.services-showcase{padding:92px 0 100px;background:#161616;border-top:1px solid #ffffff0d;scroll-margin-top:90px}
.services-showcase-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:35px;margin-bottom:30px}
.services-showcase-heading .eyebrow{margin-bottom:16px}
.services-showcase-heading h2{font-size:clamp(26px,2vw,34px);text-transform:uppercase}
.services-all-link,.service-detail-link{display:inline-flex;align-items:center;justify-content:space-between;gap:22px;color:#fff;font:600 15px/1.4 var(--heading);text-transform:uppercase}
.services-all-link{padding-bottom:10px;border-bottom:1px solid var(--accent);white-space:nowrap;margin-bottom:4px}
.services-all-link:hover,.service-detail-link:hover{color:var(--accent)}
.services-all-link svg,.service-detail-link svg{width:20px;height:20px;flex:0 0 20px;fill:none;stroke:var(--accent);stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.services-showcase-layout{display:grid;grid-template-columns:minmax(0,1.12fr) minmax(0,.88fr);gap:38px;align-items:stretch}
.service-visual{position:relative;min-height:540px;overflow:hidden;background:#222;border:1px solid #ffffff20}
.service-visual:after{content:'';position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(180deg,#0004 0%,transparent 27%,transparent 45%,#000b 78%,#000e 100%)}
.service-visual img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;filter:saturate(.85);transition:opacity .3s,transform .6s}
.service-visual:hover img{transform:scale(1.025)}
.service-visual.is-changing img{opacity:0;transform:scale(1.015)}
.service-visual-label{position:absolute;top:25px;left:25px;z-index:2;padding:9px 12px;background:#101010ba;border:1px solid #ffffff32;color:#ededed;font:500 11px/1.4 var(--heading);text-transform:uppercase;letter-spacing:1.4px}
.service-visual-caption{position:absolute;inset:auto 34px 31px;z-index:2}
.service-visual-caption-line{display:block;width:40px;height:3px;background:var(--accent);margin-bottom:19px}
.service-visual-caption h3{color:#fff;font-size:clamp(26px,2vw,34px);text-transform:uppercase;max-width:450px;line-height:1.15}
.service-visual-signature{display:block;margin-top:14px;font:400 12px/1.4 var(--body);letter-spacing:.5px;color:#c4c4c4}
.services-selection{min-width:0;display:flex;flex-direction:column}
.service-picker{display:flex;flex-direction:column;border-top:1px solid #ffffff25}
.service-item{position:relative;min-width:0;border-bottom:1px solid #ffffff1c;transition:background .2s}
.service-item:before{content:'';position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--accent);opacity:0;transition:opacity .2s;pointer-events:none}
.service-item[open]{background:#222}
.service-item[open]:before{opacity:1}
.service-picker summary{position:relative;display:flex;align-items:center;gap:17px;min-height:57px;width:100%;padding:14px 14px 14px 18px;background:transparent;color:#e4e4e4;text-align:left;border:0;list-style:none;cursor:pointer;transition:background .2s,color .2s}
.service-picker summary::-webkit-details-marker{display:none}
.service-picker summary::marker{content:''}
.service-picker summary:hover{background:#ffffff06;color:#fff}
.service-item[open] summary{color:var(--accent)}
.service-picker summary:focus-visible{outline-offset:-3px;z-index:1}
.service-picker-number{flex:0 0 23px;color:#797979;font:500 12px/1 var(--heading)}
.service-item[open] .service-picker-number{color:var(--accent)}
.service-picker-name{flex:1;min-width:0;font:600 19px/1.25 var(--heading);text-transform:uppercase}
.service-picker summary svg{width:20px;height:20px;flex:0 0 20px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;color:#909090;transition:color .2s}
.service-item[open] summary svg{color:var(--accent)}
.service-icon-vertical{transition:opacity .2s}
.service-item[open] .service-icon-vertical{opacity:0}
.service-preview{padding:0 18px 24px;display:flex;flex-direction:column;align-items:flex-start;background:#222}
.service-preview:focus-visible{outline:2px solid var(--accent);outline-offset:6px}
.service-preview p{font-size:16px;line-height:1.65;color:#b8b8b8;margin:0 0 18px;max-width:490px}
.service-detail-link{font-size:13px;gap:12px;align-self:flex-start;padding-bottom:7px;border-bottom:1px solid #ff7a0080}
.service-detail-link svg{width:17px;height:17px;flex-basis:17px}
@media(min-width:1500px){.services-showcase-layout{gap:45px;grid-template-columns:minmax(0,1.13fr) minmax(0,.87fr)}.service-visual{min-height:560px}.service-picker summary{min-height:60px}.service-picker-name{font-size:20px}.service-preview p{font-size:17px}}
@media(max-width:1100px){.services-showcase-layout{gap:25px;grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.service-picker summary{gap:12px;padding-right:10px;padding-left:14px}.service-picker-name{font-size:17px}.service-visual-caption{left:27px;right:27px}.service-preview{padding-left:14px;padding-right:14px}}
@media(max-width:760px){.services-showcase{padding:65px 0 70px;scroll-margin-top:78px}.services-showcase-heading{display:block;margin-bottom:28px}.services-showcase-heading h2{font-size:26px}.services-all-link{margin:23px 0 0;font-size:13px;gap:24px}.services-showcase-layout{grid-template-columns:1fr;gap:26px}.service-visual{min-height:0;height:380px}.service-visual-label{top:20px;left:20px;font-size:10px;padding:8px 10px;letter-spacing:1px}.service-visual-caption{inset:auto 25px 24px}.service-visual-caption h3{font-size:26px;max-width:310px}.service-visual-caption-line{margin-bottom:15px}.service-visual-signature{font-size:11px;margin-top:12px}.service-picker summary{min-height:52px;padding:13px 14px;gap:13px}.service-picker-number{font-size:11px;flex-basis:19px}.service-picker-name{font-size:16px;line-height:1.3}.service-picker summary svg{width:18px;height:18px;flex-basis:18px}.service-preview{padding:0 14px 22px}.service-preview p{font-size:16px;margin-bottom:18px;max-width:520px}.service-detail-link{font-size:13px}}
@media(max-width:380px){.service-visual{height:350px}.service-picker summary{padding:13px 10px;gap:10px}.service-picker-name{font-size:15px}.service-picker-number{flex-basis:17px}.service-preview{padding-left:10px;padding-right:10px}.services-showcase-heading h2,.service-visual-caption h3{font-size:24px}}
@media(prefers-reduced-motion:reduce){.service-visual:hover img{transform:none}}
