/* Shared Services disclosure: stable hit area and quiet, inset material. */
#mast-nav .mast-services > .service-menu {
 top:calc(100% + 10px); padding:18px; width:364px; border-radius:16px;
 overflow:hidden; animation:none; transform:none;
 border-color:color-mix(in srgb,var(--mist) 24%,transparent);
 box-shadow:0 18px 45px #101a2233,inset 0 1px 0 #ffffff1f;
}
#mast-nav .mast-services[open]::before { top:100%; height:14px; width:364px; left:-22px; }
#mast-nav .mast-services .service-menu > a { padding:15px 18px; min-height:56px; border-radius:10px; text-shadow:none; text-decoration:none!important; box-shadow:none; border:0; }
#mast-nav .mast-services .service-menu > a:is(:hover,:focus-visible,[aria-current]) { color:var(--frost)!important; box-shadow:none; background:color-mix(in srgb,var(--mist) 12%,transparent); }
#mast-nav .mast-services .service-menu > .nav-liquid { display:none; }
#mast-nav .mast-services > summary { border:0; box-shadow:none; text-decoration:none!important; }
#mast-nav .mast-services > summary:not(:focus-visible) { outline:none; }
#mast-nav .mast-services a:focus-visible { outline:2px solid var(--mist); outline-offset:-3px; }
/* Studio uses the homepage's shared materials and chapter behavior. */
.studio-page .studio-opening-stage { position:relative; height:200svh; background:var(--ink); }
.studio-page .studio-hero--vhs { position:sticky; top:0; height:100svh; min-height:760px; overflow:hidden; }
.studio-page .studio-hero--vhs::before {
 content:''; pointer-events:none; position:absolute; inset:0; z-index:2;
 background:repeating-linear-gradient(0deg,transparent 0 2px,#1117202b 2px 3px),linear-gradient(180deg,transparent 70%,var(--ink));
 opacity:.65;
}
.studio-page .studio-hero__copy { z-index:3; }
.studio-page .studio-hero__portrait { align-self:end; isolation:isolate; }
.studio-page .studio-hero__portrait::before {
 content:''; position:absolute; inset:0; z-index:-1;
 background:url('process-3-v21.webp') center bottom/contain no-repeat;
 transform:translate(-24px,5px); opacity:.17; filter:blur(2px); mix-blend-mode:screen;
}
.studio-page .studio-hero__portrait img { filter:saturate(.65) contrast(1.06) drop-shadow(-9px 0 8px #91c4c81f); mask-image:linear-gradient(180deg,#000 85%,transparent 100%); }
.studio-page #story {
 position:relative; z-index:4; margin-top:-100svh; min-height:0;
 padding-block:clamp(72px,7vw,112px);
 display:grid; align-items:center; background:var(--ink); color:var(--frost);
}
.studio-page #story h2 { color:var(--frost); }
.studio-page #story p { color:var(--text-muted-dark); }
.studio-page .studio-art--immersive {
 position:relative; z-index:4; isolation:isolate; min-height:90svh; display:grid; align-items:center;
 background:var(--ink) url('harisfy-pencil-studio-v41.webp') 65% center/cover no-repeat;
}
.studio-page .studio-art--immersive::before { content:''; position:absolute; inset:0; z-index:-1; background:linear-gradient(90deg,#101a22f5 0%,#101a22df 30%,#101a2280 58%,#101a2233 100%); }
.studio-page .studio-art--immersive .content-split { display:block; }
.studio-page .studio-art--immersive .content-split > div { max-width:52ch; }
.studio-page .studio-art--immersive h2 { max-width:17ch; }
.studio-page .studio-art--immersive p { color:var(--frost); }
.studio-brand-card-section { position:relative; z-index:4; padding:clamp(48px,7vw,100px) var(--page-edge); background:var(--frost); }
.studio-page .studio-brand-card {
 position:relative; overflow:hidden; border-radius:16px; padding:clamp(32px,5vw,76px); max-width:1440px;
 background:linear-gradient(115deg,#a8c8c217,transparent 40%,#ff62480a),repeating-linear-gradient(0deg,#ffffff05 0 1px,transparent 1px 3px),linear-gradient(155deg,#3a505b 0%,#17212b 38%,#294957 68%,#121a23 100%);
 color:var(--frost); box-shadow:inset 0 1px 1px #ffffff70,inset 0 -3px 5px #0005;
}
.studio-brand-card::after { content:''; pointer-events:none; position:absolute; inset:0; background:linear-gradient(115deg,transparent 25%,#ffffff0d 46%,transparent 65%); }
.studio-page .studio-brand-card .studio-statement { font-size:clamp(32px,4.2vw,64px); max-width:24ch; margin:0 0 28px; color:var(--frost); }
.studio-brand-card .studio-statement em { color:var(--coral); font-style:normal; }
.studio-brand-card .studio-art__note { color:var(--text-muted-dark); max-width:58ch; margin-bottom:28px; }
.studio-brand-card .studio-art__note a { color:var(--frost); }
.studio-page .studio-experience { position:relative; z-index:4; }
.studio-experience .content-split { display:block; max-width:900px; }
.studio-experience .content-split h2 { max-width:24ch; margin-bottom:24px; }
.studio-experience .content-split > p { max-width:67ch; }
.studio-use-cases { display:grid; grid-template-columns:1fr 1fr; gap:4px; margin-top:44px; }
.studio-use-case { position:relative; isolation:isolate; overflow:hidden; border-radius:6px; min-height:480px; display:flex; align-items:end; color:var(--frost); }
.studio-use-case::after { content:''; position:absolute; inset:0; z-index:-1; background:linear-gradient(0deg,#101a22 0%,#101a22e6 18%,#101a2222 75%); }
.studio-use-case > img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:-2; transition:opacity .85s ease,filter .85s ease; }
.studio-use-case .use-case-base { filter:grayscale(1) saturate(.15); }
.studio-use-case .use-case-colour { opacity:0; }
.studio-use-case:is(:hover,:focus-visible) .use-case-colour { opacity:1; }
.studio-use-case:is(:hover,:focus-visible) { outline:2px solid var(--card-hover-ring); outline-offset:-2px; }
.studio-use-case__copy { padding:clamp(24px,3vw,44px); }
.studio-use-case h3 { color:var(--frost); font-size:clamp(26px,2.4vw,36px); margin:0 0 14px; transition:color .3s; }
.studio-use-case:is(:hover,:focus-visible) h3 { color:var(--coral); }
.studio-use-case p { color:var(--frost); font-size:17px; line-height:1.55; max-width:42ch; margin-bottom:20px; }
.studio-use-case__copy > span {
 position:relative; font-family:var(--body); font-size:16px; font-weight:600;
 line-height:1.5; letter-spacing:.005em; color:var(--frost);
 min-height:44px; gap:10px; border-radius:999px;
 transition:color .3s ease;
}
.studio-use-case__copy > span::before {
 content:''; position:absolute; inset:0 -14px; border-radius:inherit;
 background:color-mix(in srgb,var(--mist) 10%,transparent);
 box-shadow:inset 0 1px 0 #ffffff1a; opacity:0;
 transition:opacity .35s ease; pointer-events:none;
}
.studio-use-case__copy > span .link-play { margin-inline-start:0; }
.studio-use-case:is(:hover,:focus-visible) .studio-use-case__copy > span::before { opacity:1; }
@media(prefers-reduced-motion:reduce) {
 .studio-use-case__copy > span,.studio-use-case__copy > span::before { transition:none; }
}
.studio-experience-proof { font-size:16px; color:var(--reading); margin-top:28px; max-width:75ch; }
.studio-experience-proof a { text-decoration:underline; text-underline-offset:4px; }
.studio-page .studio-principles { height:210svh; background:var(--frost); }
.studio-page .studio-principles .process-panel h3 { color:var(--coral); font-size:clamp(30px,3vw,48px); }
.studio-page .studio-principles .process-pictures { height:min(65svh,720px); }
.studio-page .studio-principles .process-pictures img { object-fit:contain; }
.studio-services-metal { padding:0 var(--page-edge) clamp(64px,7vw,100px); max-width:none; background:var(--frost); }
.studio-services-metal .studio-service-links { margin:0 auto; max-width:1440px; gap:14px; }
body .studio-service-links .shiny-metallic {
 color:var(--frost); border:1px solid #a8c8c26b; padding:16px 24px; font-size:14px; line-height:1.4; white-space:normal;
 background:linear-gradient(160deg,#a8c8c2 0%,#45636c 12%,#294957 46%,#111720 100%);
 box-shadow:inset 0 2px 2px #ffffff80,inset 0 -2px 4px #0006; text-decoration:none;
}
body .studio-service-links .shiny-metallic:is(:hover,:focus-visible) { color:var(--frost); background:linear-gradient(160deg,#60818a,#294957 55%,#111720); }
body.studio-page .contact-stage .contact { min-height:580px; padding-block:84px 110px; }
body.studio-page #contact .contact__title { font-size:clamp(36px,4.7vw,70px); line-height:1.08; text-shadow:none; max-width:21ch; }
body.studio-page #contact .contact__title em { text-shadow:none; }
body.studio-page #contact .contact__bottom { margin-top:28px; gap:24px; }
body.studio-page #contact .contact__bottom p { max-width:48ch; }
body.studio-page .studio-footer { min-height:0; padding:0; margin-top:calc(var(--contact-frame-height,580px) * -1); }
body.studio-page .studio-footer .film-card { min-height:600px; padding:64px var(--page-edge); }
body.studio-page .studio-footer .film-title { font-size:clamp(26px,3.5vw,48px); margin-block:24px; }
body.studio-page .studio-footer .film-founder strong { font-size:clamp(26px,2.8vw,38px); }
body.studio-page .studio-footer .film-nav { flex-wrap:wrap; justify-content:center; }
@media(max-width:780px) {
 #mast-nav .mast-services > .service-menu { position:relative; top:auto; left:auto; width:100%; max-width:none; margin:8px 0 12px; padding:12px; }
 .studio-page .studio-hero--vhs { min-height:860px; height:100svh; }
 .studio-page .studio-use-cases { grid-template-columns:1fr; }
 .studio-use-case { min-height:480px; }
 .studio-page .studio-art--immersive { background-position:62% center; }
 .studio-page .studio-art--immersive::before { background:#101a22c9; }
 .studio-page .studio-principles .process-pictures { height:min(36svh,350px); }
 body.studio-page .contact-stage .contact { min-height:520px; padding-block:72px 100px; }
 body.studio-page .studio-footer .film-card { min-height:560px; }
}
@media(hover:none) { .studio-use-case .use-case-colour { opacity:1; } }
@media(prefers-reduced-motion:reduce),(max-height:650px) {
 .studio-page .studio-opening-stage { height:auto; }
 .studio-page .studio-hero--vhs { position:relative; height:auto; min-height:0; }
 .studio-page #story { margin-top:0; min-height:0; }
 .studio-page .studio-principles { height:auto; }
 body.studio-page .studio-footer { margin-top:0; }
 .studio-use-case > img,.studio-use-case h3 { transition:none; }
}
.studio-page .studio-hero--vhs::before { opacity:calc(.45 + var(--studio-fade,0) * .55); background:linear-gradient(#101a2200,#101a22aa),repeating-linear-gradient(0deg,transparent 0 2px,#11172070 2px 3px); }
.studio-page .studio-hero__portrait { transform:translateY(var(--studio-drift,0px)); }
/* During the wipe the closing frame fills the view; static reading stays compact. */
@media(prefers-reduced-motion:no-preference) and (min-height:651px) {
 body.studio-page .studio-footer .film-card { min-height:100svh; }
}
.studio-page .process-tabs .sr-only { position:absolute!important; width:1px!important; height:1px!important; padding:0!important; margin:-1px!important; overflow:hidden!important; clip:rect(0,0,0,0)!important; white-space:nowrap!important; border:0!important; }
.studio-page .studio-principles .process-panel h3 { color:color-mix(in srgb,var(--coral) 90%,var(--ink)); }
.studio-page .studio-principles .process-panels { min-height:230px; }
@media(max-width:780px) { .studio-page .studio-principles .process-panels { min-height:190px; } }
@media(prefers-reduced-motion:reduce),(max-height:650px) { .studio-page .studio-principles .process-panels { min-height:0; } }