/* Cinematic service scenes; UI copy remains outside the Remotion canvases. */
.expertise{margin-inline:3%;padding-block:40px 44px;scroll-margin-top:-30px}
.expertise-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:32px;margin:0 8px 28px}
.expertise-heading .section-label{font-size:12px;color:#929594;letter-spacing:3.5px;margin-bottom:12px}
.expertise-heading h2{font-size:clamp(40px,4.25vw,68px);line-height:1.08;letter-spacing:-.035em;white-space:nowrap}
.expertise-heading h2 em{font-size:1.1em}
.expertise-context{flex-shrink:0;padding-bottom:3px}
.expertise-context p{font-size:18px;line-height:1.5;color:#dbdbd6}
.motion-toggle{display:flex;align-items:center;justify-content:flex-end;gap:12px;margin:10px 0 0 auto;padding:8px 0 0 12px;background:transparent;border:0;font-size:12px;letter-spacing:.8px;color:var(--muted)}
.motion-toggle[hidden]{display:none}
.motion-toggle span{text-decoration:underline;text-underline-offset:4px}
.motion-toggle i{height:1px;width:24px;background:var(--gold)}
.motion-toggle:hover{color:var(--gold)}
.expertise-gallery{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
.expertise-card{position:relative;aspect-ratio:16/9;min-width:0;isolation:isolate;overflow:hidden;border:1px solid #30312e;border-radius:5px;background:#090b0b;transition:border-color .25s}
.expertise-art{position:absolute;inset:0;z-index:-2;transition:transform .7s cubic-bezier(.2,.7,.2,1)}
.expertise-art>img,.expertise-art>video,.scene-host{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.expertise-art>video{z-index:1;background:#090b0b}
.expertise-art-avatar{background:radial-gradient(ellipse at center,#333832,#090b0b 75%)}
.expertise-art-avatar>video{object-fit:contain;background:transparent}
.scene-host{pointer-events:none}
.avatar-waveform{position:absolute;z-index:2;left:26%;right:26%;top:66%;height:34px;opacity:.72;background:repeating-linear-gradient(90deg,var(--gold) 0 2px,transparent 2px 7px);mask-image:radial-gradient(ellipse at center,#000 28%,transparent 74%);animation:avatar-wave 1.15s ease-in-out infinite alternate;pointer-events:none}
@keyframes avatar-wave{from{transform:scaleY(.24);opacity:.38}to{transform:scaleY(1);opacity:.82}}
.expertise.motion-paused .avatar-waveform{animation-play-state:paused}
.expertise-card::after{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(0deg,rgba(0,0,0,.95),rgba(0,0,0,.8) 12%,rgba(0,0,0,.35) 29%,transparent 49%),linear-gradient(180deg,#0004,transparent 28%)}
.expertise-number{position:absolute;top:24px;left:24px;display:flex;align-items:center;gap:13px;font-size:13px;color:var(--gold);pointer-events:none}
.expertise-number i{width:23px;height:1px;background:var(--gold)}
.expertise-action{position:absolute;inset:0;z-index:2;width:100%;border:0;padding:0;background:transparent;border-radius:4px}
.expertise-action:focus-visible{outline-offset:-4px;outline:2px solid var(--gold)}
.expertise-arrow{position:absolute;right:18px;top:17px;width:40px;height:40px;border:1px solid var(--gold);border-radius:50%;display:grid;place-items:center;background:#0002;color:var(--gold);transition:background .2s,color .2s,transform .2s}
.expertise-arrow svg{width:19px;height:19px}
.expertise-caption{position:absolute;bottom:20px;left:22px;right:22px;pointer-events:none}
.expertise-caption h3{font-family:'Segoe UI',Arial,sans-serif;font-size:clamp(23px,1.85vw,30px);font-weight:350;line-height:1.2;letter-spacing:-.5px;margin-bottom:7px}
.expertise-caption p{font-size:clamp(13px,1.06vw,17px);line-height:1.45;color:#c3c5c2;max-width:96%}
.expertise-card:hover,.expertise-card:focus-within{border-color:#ad9266}
.expertise-card:hover .expertise-arrow,.expertise-card:focus-within .expertise-arrow{background:var(--gold);color:#080909;transform:rotate(5deg)}
@media(hover:hover) and (prefers-reduced-motion:no-preference){.expertise-card:hover .expertise-art{transform:scale(1.025)}}
@media(prefers-reduced-motion:reduce){.avatar-waveform{animation:none;transform:scaleY(.42)}}
@media(max-width:1300px){.expertise-heading h2{white-space:normal;max-width:740px}.expertise-heading h2 em{display:block}.expertise-context p{font-size:16px}.expertise-gallery{gap:20px}.expertise-caption{left:20px;bottom:18px}.expertise-caption h3{font-size:25px}.expertise-caption p{font-size:14px}}
@media(max-width:900px){.expertise-context{max-width:260px}.expertise-card{aspect-ratio:1.4}.expertise-art{bottom:15%;}.expertise-caption p{font-size:13px}.expertise-caption h3{font-size:23px}.expertise-number{top:18px;left:18px}.expertise-arrow{width:35px;height:35px}.expertise-card::after{background:linear-gradient(0deg,#000 2%,#000d 20%,#0005 42%,transparent 65%)}}
@media(max-width:700px){.expertise{margin-inline:6%;padding-block:52px 24px}.expertise-heading{display:block;margin:0 0 24px}.expertise-heading h2{font-size:clamp(38px,9.6vw,58px)}.expertise-heading .section-label{font-size:10px;letter-spacing:2.5px}.expertise-context{max-width:none;display:flex;align-items:flex-end;justify-content:space-between;gap:12px;margin-top:23px}.expertise-context p{font-size:13px;max-width:230px}.motion-toggle{font-size:10px;white-space:nowrap;gap:7px;padding-left:0}.motion-toggle i{width:12px}.expertise-gallery{grid-template-columns:1fr;gap:18px}.expertise-card{aspect-ratio:1.17}.expertise-art{bottom:11%}.expertise-caption{left:18px;right:16px;bottom:18px}.expertise-caption h3{font-size:25px}.expertise-caption p{font-size:13px;max-width:100%;line-height:1.5}.expertise-card::after{background:linear-gradient(0deg,#000 1%,#000e 15%,#0008 36%,transparent 65%)}.expertise-number{font-size:12px}.expertise-arrow{right:15px;top:14px}}
/* Deliverables stay visible without hover or opening the brief. */
.expertise-card{aspect-ratio:auto;min-height:430px}
.expertise-caption{bottom:24px}
.expertise-card::after{background:linear-gradient(0deg,#000 0%,#000e 32%,#0006 60%,transparent 85%)}
.deliverables{border-top:1px solid #ffffff30;margin-top:17px;padding-top:13px;display:grid;gap:7px}
.deliverables strong{font-size:13px;color:var(--gold);font-weight:400;line-height:1.6}
.deliverables span{font-size:12px;line-height:1.5;color:#c3c5c2;max-width:48ch}
.process-invitation{display:grid;grid-template-columns:1.2fr 1fr;gap:8%;padding-block:90px;border-top:1px solid var(--line)}
.process-invitation h2{font-size:clamp(44px,5vw,76px)}
.process-invitation>div:last-child{align-self:center}.process-invitation p:not(.section-label){font-size:20px;line-height:1.6;max-width:40ch;color:var(--muted);margin-bottom:26px}
.studio-belief{max-width:540px}.studio-belief p+p{margin-top:18px}.studio-intro .studio-belief p{font-size:18px}
.header nav{gap:30px;padding-left:0}.portfolio-header nav{gap:28px}
@media(max-width:700px){.expertise-card{min-height:440px}.process-invitation{grid-template-columns:1fr;gap:28px;padding-block:55px}.process-invitation p:not(.section-label){font-size:17px}.studio-intro .studio-belief p{font-size:16px}.deliverables strong{font-size:12px}.header nav{display:flex;position:absolute;top:77px;left:0;right:0;justify-content:space-between;gap:8px}.header nav a{font-size:13px}.hero-content{padding-top:90px}.studio-intro h3{font-size:28px}}
