/* Keep the sticky header blur on an overscanned, clipped compositing layer. */
.topbar{background:transparent;backdrop-filter:none;-webkit-backdrop-filter:none;isolation:isolate;overflow:hidden;overflow:clip}
.topbar::before{content:"";position:absolute;inset:-24px;z-index:-1;pointer-events:none;background:rgba(10,10,11,.72);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);transform:translateZ(0)}
/* Decorative portfolio imagery; all interactive content stays above it. */
.page-intro{position:relative;isolation:isolate;margin:-78px -28px 0;padding:78px 28px 44px}
.page-intro::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(90deg,rgba(10,10,11,.98) 8%,rgba(10,10,11,.88) 46%,rgba(10,10,11,.28) 100%),linear-gradient(0deg,#0a0a0b 0%,transparent 48%),var(--intro-image);background-size:cover;background-position:center,right center,right center}
.page-intro .lead{max-width:60ch}
.page-intro--about::before{background-position:center,center,65% center}
.page-intro .stats{position:relative;margin-bottom:0}
.svc--illustrated{position:relative;isolation:isolate;overflow:hidden}
.svc--illustrated>.svc__content,.svc--illustrated>.svc__action{position:relative;z-index:1}
.svc__art{position:absolute;inset:0 0 0 30%;pointer-events:none;z-index:0;opacity:.36;mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.2) 30%,#000 100%);-webkit-mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.2) 30%,#000 100%);transition:opacity .3s}
.svc__art img{display:block;width:100%;height:100%;object-fit:cover;object-position:center;filter:saturate(.65) brightness(.7)}
.svc--illustrated:hover .svc__art{opacity:.47}
#faq .faq-card{display:grid;grid-template-columns:minmax(0,1fr) 110px;align-items:center;gap:40px}
.faq-copy{min-width:0}.faq-icon{justify-self:center;color:var(--accent);opacity:.5;pointer-events:none}
.faq-icon svg{display:block;width:68px;height:68px;fill:none;stroke:currentColor;stroke-width:1.25;stroke-linecap:round;stroke-linejoin:round}
.strip--illustrated{position:relative;isolation:isolate;overflow:hidden;background:#131315}
.strip--illustrated::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(90deg,rgba(10,10,11,.94) 0%,rgba(10,10,11,.78) 48%,rgba(10,10,11,.4) 100%),url('/media/posters/poster_wardrobe.jpg') center 54%/cover no-repeat}
.strip--illustrated>div,.strip--illustrated>.btn{position:relative}
#leadForm .form__row{grid-template-columns:repeat(2,minmax(0,1fr));align-items:start}
#leadForm .form__row>.field{min-width:0}
#leadForm .form__row>.field>label{display:flex;align-items:flex-end;min-height:3em;line-height:1.5;overflow-wrap:anywhere}
@media(max-width:900px){.svc__art{left:22%;opacity:.27}.svc--illustrated:hover .svc__art{opacity:.34}.page-intro::before{background-image:linear-gradient(90deg,rgba(10,10,11,.94) 0%,rgba(10,10,11,.72) 70%,rgba(10,10,11,.6)),linear-gradient(0deg,#0a0a0b 0%,transparent 70%),var(--intro-image)}}
@media(max-width:600px){#faq .faq-card{grid-template-columns:minmax(0,1fr) 42px;gap:16px}.faq-icon svg{width:38px;height:38px}.page-intro{padding-bottom:32px}.svc__art{left:0;opacity:.22}.strip--illustrated::before{background-image:linear-gradient(90deg,rgba(10,10,11,.9),rgba(10,10,11,.65)),url('/media/posters/poster_wardrobe.jpg')}}
@media(max-width:520px){#leadForm .form__row{grid-template-columns:minmax(0,1fr)}#leadForm .form__row>.field>label{min-height:0}}
@media(prefers-reduced-motion:reduce){.svc__art{transition:none}}

/* Match the homepage image treatment: muted image plus a separate fading shade. */
.page-intro::before{z-index:-2;background:var(--intro-image) center 30%/cover no-repeat;opacity:.34;filter:saturate(.8) contrast(1.05)}
.page-intro::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(90deg,rgba(10,10,11,.94) 0%,rgba(10,10,11,.62) 50%,rgba(10,10,11,.3) 100%),linear-gradient(180deg,rgba(10,10,11,.35) 0%,rgba(10,10,11,0) 30%,#0a0a0b 97%)}
.studio-contacts .col{min-width:0}.studio-contacts__email{color:var(--text);overflow-wrap:anywhere}.studio-contacts .btn{margin-top:20px}

/* Animate inside the cards without changing their dimensions. */
.svc__art{overflow:hidden;transition:opacity .65s ease}
.svc__art img{transform:scale(1);transform-origin:70% 50%;transition:transform .85s cubic-bezier(.2,.65,.3,1),filter .65s ease}
.svc--link .svc__label{display:block;font-weight:inherit;transform-origin:left center;transition:transform .45s cubic-bezier(.2,.65,.3,1),color .35s ease}
.svc--link:focus-visible .svc__art{opacity:.47}
.svc--link:focus-visible .svc__art img{transform:scale(1.06);filter:saturate(.8) brightness(.8)}
.svc--link:focus-visible .svc__label{transform:scale(1.08)}
@media(hover:hover) and (pointer:fine){.svc--link:hover .svc__art img{transform:scale(1.06);filter:saturate(.8) brightness(.8)}.svc--link:hover .svc__label{transform:scale(1.08)}}
@media(prefers-reduced-motion:reduce){.svc__art,.svc__art img,.svc--link .svc__label{transition:none}.svc--link:hover .svc__art img,.svc--link:focus-visible .svc__art img,.svc--link:hover .svc__label,.svc--link:focus-visible .svc__label{transform:none}}

/* Full-width hero backgrounds, with text aligned to the site container. */
.page--wideintro{max-width:none;margin:0;padding:0 0 40px}
.page--wideintro .page-intro{margin:0;padding:96px 0 84px}
.page--wideintro .intro-inner{position:relative}
.page--wideintro .page-intro::before{background-position:center 30%}
@media(max-width:600px){.page--wideintro .page-intro{padding:64px 0 52px}}

/* Compact FAQ pairs; the unpaired fifth answer spans the row. */
#faq{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;align-items:stretch}
#faq>h2{grid-column:1/-1;margin-bottom:4px}
#faq .faq-card{min-width:0;grid-template-columns:minmax(0,1fr) 56px;gap:24px;padding:32px}
#faq .faq-card:last-child{grid-column:1/-1}
#faq .faq-icon svg{width:52px;height:52px}
@media(max-width:760px){#faq{grid-template-columns:minmax(0,1fr)}#faq .faq-card{grid-template-columns:minmax(0,1fr) 42px;gap:16px;padding:24px}#faq .faq-icon svg{width:38px;height:38px}}
