/* V4 landing composition: homepage navigation over a full-width portfolio frame. */
body.v4-cinematic .v4-site-nav{position:absolute;inset:0 0 auto;background:transparent!important;z-index:70}
body.v4-cinematic .v4-nav-shell{min-height:108px;gap:35px}
body.v4-cinematic .v4-nav-links{gap:24px}
body.v4-cinematic .v4-nav-actions{gap:24px}
body.v4-cinematic .v4-nav-cta{min-height:46px;display:inline-flex;align-items:center;padding:13px 22px}
body.v4-cinematic .crumbs{position:absolute;top:108px;left:0;right:0;z-index:3;padding-block:12px;background:transparent}
body.v4-cinematic .crumbs a,body.v4-cinematic .crumbs-current{color:#c0c6c2}
body.v4-cinematic .hero{position:relative;isolation:isolate;padding:196px 0 80px;min-height:900px;background:#101815!important;overflow:hidden}
body.v4-cinematic .hero:before{content:'';position:absolute;inset:0;z-index:-2;background-image:var(--v4-hero-image);background-size:cover;background-position:65% center;opacity:.7}
body.v4-cinematic .hero:after{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(6,11,12,.96),rgba(6,11,12,.78) 48%,rgba(6,11,12,.18)),linear-gradient(0deg,#0b0e10,transparent 40%)}
body.v4-cinematic .hero-grid{display:block;position:relative}
body.v4-cinematic .hero-grid>div:first-child{max-width:920px}
body.v4-cinematic .hero :is(h1,.hero-headline){font-size:clamp(48px,5.8vw,84px)!important;max-width:940px;line-height:1.06!important;text-wrap:balance;margin:24px 0 0}
body.v4-cinematic .hero .hero-lead{max-width:680px;font-size:18px;line-height:1.65;color:#e3e5e1;margin-top:28px}
body.v4-cinematic .hero .hero-ctas{margin-top:36px;gap:18px;display:flex;flex-wrap:wrap}
body.v4-cinematic .hero .hero-reassure{max-width:630px;color:#bcc4bd;font-size:12px;margin-top:20px}
body.v4-cinematic .hero .hero-meta{max-width:650px;margin-top:44px;padding-top:24px;border-color:#647064;background:transparent}
body.v4-cinematic .hero .hero-meta-num{font-size:36px;color:#f5f6f3}
body.v4-cinematic .hero .hero-meta-lab{font-size:12px;text-transform:none;letter-spacing:0;color:#c0c6c2}
body.v4-cinematic .hero .chip{font-size:13px;color:#c1c8bf;gap:13px;display:inline-flex;align-items:center}
body.v4-cinematic .hero .hsv[aria-hidden=true]{display:none}
body.v4-cinematic .hero .mb-service-video{position:absolute;right:0;bottom:0;width:285px;border:1px solid #55604e;border-radius:18px;background:#111719;overflow:hidden;min-height:0;box-shadow:none}
body.v4-cinematic .hero .mb-service-video .showreel-tile{aspect-ratio:16/10;min-height:0;border-radius:0}
body.v4-cinematic .hero .mb-service-video .showreel-info{padding:15px;font-size:12px}
body.v4-cinematic .hero .mb-service-video .showreel-info-title{font-size:17px}
body.v4-cinematic .hero .mb-service-video .showreel-info-meta{font-size:10px}
body.v4-cinematic .hero .mb-service-video .showreel-play-btn{width:48px;height:48px}
/* AI audiences retain their interactive portrait carousel in a separate reading row. */
body.v4-cinematic .hero-grid>div:not(:first-child):not(.hsv){margin-top:48px;max-width:720px}
body.v4-cinematic .hero-grid>.hsv:not([aria-hidden=true]):not(.mb-service-video){margin:48px 0 0;max-width:650px}
body.v4-cinematic .hero-ticker{margin-top:48px}
body.v4-cinematic .trust-strip{border:0;background:#0b0e10;padding-block:35px}
body.v4-cinematic .section .wrap>:is(h2,.h-display){max-width:940px}
body.v4-cinematic .section .wrap>.lead{max-width:680px;font-size:18px;line-height:1.65}
body.v4-cinematic .section .wrap>:is(.eyebrow,.reel-eyebrow){margin-bottom:22px}
body.v4-cinematic :is(.showreel-grid,.mb-four-videos){grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:none;grid-auto-rows:auto;align-items:start;gap:24px}
body.v4-cinematic .mb-four-videos>.showreel-tile-hero{aspect-ratio:21/9;max-height:600px}
body.v4-cinematic :is(.showreel-tile,.reel-thumb){border-radius:22px}
body.v4-cinematic :is(.usecase-card,.persona-card,.tech-card,.type-card,.pain-card){padding:32px;border:1px solid #353d35;border-radius:24px;background:#171e19}
body.v4-cinematic :is(.usecase-title,.persona-title,.type-card-title){font-size:29px;font-weight:400}
body.v4-cinematic :is(.usecase-icon,.persona-icon,.type-card-icon){font-size:24px;margin-bottom:24px}
body.v4-cinematic :is(.section-head,.showreel-head,.tiers-head,.process-head){gap:7vw}
body.v4-cinematic .section .v4-light{background:transparent}
body.v4-cinematic .case-deep{border-radius:24px;padding:34px}
body.v4-cinematic :is(.process-step,.timeline-card){box-shadow:none;border-radius:0;background:transparent;border:0;border-top:1px solid var(--line);padding-top:26px}
body.v4-cinematic .btn-ghost{background:rgba(12,19,13,.5);border-color:#7d8966}
body.v4-cinematic .v4-light .btn-ghost{background:transparent}
@media(max-width:1200px){
 body.v4-cinematic .hero-grid>div:first-child{max-width:820px}
 body.v4-cinematic .hero .mb-service-video{position:relative;margin-top:34px;width:340px;max-width:100%}
 body.v4-cinematic .hero{min-height:850px}
}
@media(max-width:1100px){
 body.v4-cinematic .v4-nav-shell{min-height:88px}
 body.v4-cinematic .crumbs{top:88px}
 body.v4-cinematic .v4-nav-links{gap:18px}
 body.v4-cinematic .hero{padding-top:170px}
}
@media(max-width:760px){
 body.v4-cinematic .v4-nav-shell{min-height:82px}
 body.v4-cinematic .v4-nav-cta{display:none}
 body.v4-cinematic .v4-menu-button{border:0;border-radius:0;gap:7px}
 body.v4-cinematic .v4-menu-button span{width:25px}
 body.v4-cinematic .v4-nav-links{top:82px}
 body.v4-cinematic .crumbs{top:82px;font-size:11px}
 body.v4-cinematic .hero{padding:148px 0 54px;min-height:790px}
 body.v4-cinematic .hero:before{background-position:65% center;opacity:.5}
 body.v4-cinematic .hero:after{background:linear-gradient(90deg,rgba(6,11,12,.87),rgba(6,11,12,.5)),linear-gradient(0deg,#0b0e10,transparent 70%)}
 body.v4-cinematic .hero :is(h1,.hero-headline){font-size:clamp(39px,8.7vw,62px)!important;line-height:1.1!important;margin-top:24px;overflow-wrap:normal}
 body.v4-cinematic .hero .hero-lead{font-size:15px;line-height:1.6;margin-top:24px}
 body.v4-cinematic .hero .chip{font-size:11px}
 body.v4-cinematic .hero .hero-ctas{margin-top:28px;gap:12px}
 body.v4-cinematic .hero .hero-meta{margin-top:30px;gap:18px}
 body.v4-cinematic .hero .hero-meta-num{font-size:28px}
 body.v4-cinematic .hero .hero-meta-lab{font-size:10px}
 body.v4-cinematic .hero .hero-reassure{font-size:11px}
 body.v4-cinematic .hero .mb-service-video{width:100%;margin-top:30px}
 body.v4-cinematic :is(.showreel-grid,.mb-four-videos){grid-template-columns:1fr;gap:22px}
 body.v4-cinematic .mb-four-videos>.showreel-tile-hero{aspect-ratio:16/9}
 body.v4-cinematic :is(.usecase-card,.persona-card,.tech-card,.type-card,.pain-card,.case-deep){padding:26px}
 body.v4-cinematic :is(.usecase-title,.persona-title,.type-card-title){font-size:25px}
 body.v4-cinematic .section .wrap>.lead{font-size:16px}
}
/* One wide lead project, followed by a balanced two-column portfolio. */
@media(min-width:761px){
 body.v4-cinematic .showreel-grid>.showreel-tile-hero{grid-column:1/-1;grid-row:auto;aspect-ratio:21/9;max-height:560px}
}
body.v4-cinematic .hero .mb-service-video .showreel-info{bottom:0;left:0;right:0;background:linear-gradient(0deg,rgba(6,11,12,.95),transparent);padding:10px 13px}
body.v4-cinematic .hero .mb-service-video .showreel-info-meta{display:block;line-height:1.4}
body.v4-cinematic .hero .mb-service-video .showreel-play{bottom:40px}
body.v4-cinematic .v4-cinematic-backdrop{position:absolute;inset:0;z-index:-2;width:100%;height:100%;object-fit:cover;object-position:65% center;opacity:.7;pointer-events:none}
@media(max-width:760px){body.v4-cinematic .v4-cinematic-backdrop{opacity:.5}}
@media(prefers-reduced-motion:reduce){body.v4-cinematic .v4-cinematic-backdrop{display:none}}
body.v4-cinematic .usecase-icon.v4-drawn-icon{width:56px;height:56px;border:0;border-radius:0;background:transparent;display:block;overflow:visible}
body.v4-cinematic .usecase-icon.v4-drawn-icon img{width:56px;height:56px;display:block}
