/* Cinematic office stage. Text remains real HTML above a single continuous film. */
.experience{isolation:isolate}
.visual-stage{background:#080b10;z-index:-1}
.film-wrap{inset:0;width:100%;height:100%;max-width:none;aspect-ratio:auto;transform:none;mask-image:none;opacity:1}
.film-wrap video,.film-wrap>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:var(--film-focus,58%) center}
.film-wrap video{opacity:0;transition:opacity .18s linear}
.visual-stage.film-ready .film-wrap video{opacity:1}
.film-shade{position:absolute;inset:0;background:linear-gradient(90deg,#080b10f5 0%,#080b10df 27%,#080b1094 48%,#080b1020 75%),linear-gradient(0deg,#080b10b3,transparent 30%,transparent 80%,#080b1080)}
.coordinate-bottom{bottom:30px;right:var(--gutter);width:auto;gap:14px;color:#dce1df;text-shadow:0 1px 8px #000}
.coordinate-code{margin-left:28px}
.hero,.expertise-step,.solutions,.process,.principles,.contact{position:relative;min-height:100svh}
.hero{padding-top:160px;padding-bottom:150px}
.hero-copy{max-width:650px;width:53%}
.hero h1{font-size:clamp(40px,4.2vw,74px)}
.hero-description,.section-intro p,.detail-copy{color:#c2c9cd!important}
.hero-bottom{bottom:70px;border-color:#ffffff30}
.expertise{padding-top:0;padding-bottom:0}
.section-intro{width:48%;padding-top:100px;padding-bottom:100px}
.expertise-step{max-width:none;padding:120px 0;border:0;background:none}
.expertise-step>.scene-copy{width:46%;max-width:650px}
.expertise-step h3{font-size:clamp(36px,3.5vw,62px)}
.expertise-step .detail-copy{max-width:440px;font-size:14px;line-height:1.9;margin-top:16px}
.expertise-step .scene-copy>p{font-size:17px;line-height:1.9;color:#d7dcdf}
.solutions,.process,.principles,.contact{background:none;border:0;padding-top:140px;padding-bottom:130px;display:flex;align-items:center;overflow:visible}
.solutions>.scene-copy,.process>.scene-copy,.principles>.scene-copy,.contact>.scene-copy{width:48%;max-width:720px}
.section-heading{display:block;margin-bottom:36px}
.section-heading>p{margin-top:24px;color:#c2c9cd}
.section-heading h2,.process-intro h2,.principles h2{font-size:clamp(32px,3.1vw,54px)}
.solution-tabs button{font-size:12px;padding:18px 8px!important;gap:8px}
.solution-tabs button .icon{width:14px;height:14px}
.solution-panel{display:block;min-height:320px;padding-top:30px}
.solution-copy h3{font-size:30px}
.solution-copy>p,.process-intro p,.principle-grid p{color:#bcc6cd}
.product-visual{display:none}
.process-intro{margin-bottom:32px}.process-note{display:none}
.process-steps{background:#080b1060;border-radius:4px}
.process-steps summary{padding:20px 10px}.process-detail{padding:0 15px 24px 40px}
.principles h2{margin-bottom:36px}
.principle-grid{grid-template-columns:1fr;gap:22px}
.principle-grid article{padding-top:18px}.principle-grid h3{margin:10px 0;font-size:23px}
.contact h2{font-size:clamp(38px,4.2vw,68px)}
.contact-art{display:none}.contact-bottom{margin-top:46px;font-size:9px}.contact-bottom>span:last-child{font-size:11px}
.floating-motion{position:fixed;z-index:15;right:var(--gutter);bottom:22px;border:1px solid #ffffff40;border-radius:40px;background:#0b101be6;padding:10px 16px;min-height:44px;backdrop-filter:blur(12px);font-size:11px;color:#edf0ed}
.coordinate-bottom{top:120px;bottom:auto}
.film-credit{display:block;margin-top:5px;color:#88949f;font-size:10px}
.footer{position:relative;background:var(--bg);padding-bottom:90px}
@media(min-width:1800px){.film-wrap{inset:0}.hero-copy{max-width:760px}}
@media(max-width:1100px) and (min-width:761px){.hero-copy{width:62%;max-width:650px}.solutions>.scene-copy,.process>.scene-copy,.principles>.scene-copy,.contact>.scene-copy{width:58%}.expertise-step>.scene-copy{width:55%}.section-intro{width:60%}.film-shade{background:linear-gradient(90deg,#080b10f5,#080b10d9 40%,#080b1040 100%)}}
@media(max-width:760px){
  html{scroll-padding-top:0}
  .experience{--mobile-film-height:clamp(240px,62.5vw,420px)}
  .visual-stage{height:100svh;margin-bottom:-100svh;z-index:3;background:transparent}
  .film-wrap{inset:74px 0 auto;height:var(--mobile-film-height);min-height:0;max-height:none;width:100%;opacity:1;transform:none}
  .film-wrap video,.film-wrap>img{object-position:var(--film-focus,55%) center}
  .film-shade{top:calc(74px + var(--mobile-film-height) - 64px);bottom:auto;height:64px;background:linear-gradient(180deg,transparent,#080b10 64px)}
  .hero,.expertise-step,.solutions,.process,.principles,.contact{display:flex;flex-direction:column;justify-content:flex-start;align-items:stretch;min-height:100svh;padding:calc(74px + var(--mobile-film-height) + 24px) var(--gutter) 88px}
  .hero{min-height:100svh;padding-bottom:40px}
  .hero-copy,.expertise-step>.scene-copy,.solutions>.scene-copy,.process>.scene-copy,.principles>.scene-copy,.contact>.scene-copy{width:100%;max-width:none}
  .scene-copy{position:relative;background:none;box-shadow:none;border-radius:0}.process-steps{background:none}
  .hero .eyebrow{font-size:9px;margin-bottom:20px}.hero h1{font-size:clamp(32px,7.7vw,48px);line-height:1.3}
  .hero-description{font-size:14px;line-height:1.85;margin:22px 0 26px}.hero .button{font-size:12px;gap:16px}.hero-link{margin:18px 0 0;display:flex}
  .hero-bottom{position:relative;inset:auto;width:100%;margin-top:48px;padding-top:14px;font-size:8px}.hero-bottom>a{gap:12px}
  .expertise{padding:0}.section-intro{margin:0 var(--gutter);width:auto;padding:calc(74px + var(--mobile-film-height) + 24px) 0 24px}
  .expertise-step h3{font-size:36px;margin:22px 0}.expertise-step .scene-copy>p{font-size:15px}.expertise-step .scene-copy>.detail-copy{font-size:13px}
  .section-heading h2,.process-intro h2,.principles h2{font-size:34px}.section-heading>p{font-size:13px}
  .solution-tabs button{font-size:11px;padding:16px 4px!important}.solution-tabs button .icon{display:none}
  .solution-panel{min-height:335px}.solution-copy h3{font-size:29px}.solution-copy>p{font-size:13px}
  .process-steps summary{padding:22px 0}.process-steps summary h3{font-size:19px}.process-detail{padding-left:29px;font-size:13px}
  .principle-grid h3{font-size:22px}.principle-grid p{font-size:13px}
  .contact h2{font-size:clamp(34px,8vw,46px)}.contact-bottom{gap:18px;margin-top:36px}
  .coordinate-bottom{top:calc(74px + 12px);bottom:auto;left:20px;right:auto;font-size:9px;background:#080b1080;border:1px solid #ffffff26;padding:6px 10px;border-radius:30px}.coordinate-code{display:none}
  .floating-motion{bottom:calc(12px + env(safe-area-inset-bottom));right:16px;padding:9px 12px;font-size:10px}
  .header{background:#080b10f5}.footer{padding-bottom:95px}
}
@media(max-width:380px){.hero h1{font-size:31px}.step-index{gap:12px}.step-index span{font-size:8px}.contact .eyebrow{letter-spacing:.02em}.hero .button{gap:12px}}
@media(prefers-reduced-motion:reduce){.film-wrap video{transition:none}}
