/* Revora's existing imagery, with a deliberate rhythm and readable controls. */
html { scroll-behavior:auto; }
button,a,input,select { -webkit-tap-highlight-color:transparent; }
button:focus-visible,a:focus-visible { outline:2px solid #c0e8ff; outline-offset:4px; }
[hidden] { display:none !important; }
.grain { opacity:.035; }
.intro { display:none; }
.timeline { height:640svh; }
.stage { height:100svh; }
.frame { inset:-2%; display:none; will-change:auto; transform-origin:50% 45%; }
.stage::after { background:linear-gradient(90deg,rgba(0,5,17,.86),rgba(0,5,17,.62) 33%,rgba(0,5,17,.1) 68%),linear-gradient(0deg,#020817 0%,transparent 27%); }
.bloom { opacity:.15; }
.constellation,.warp { display:none; }
.cursor-light { opacity:.06; }
.copy-layer { width:min(88vw,1240px); padding:0; }
.beat { top:26%; bottom:auto; width:min(560px,44%); }
.beat h1 { font-size:clamp(3.4rem,6.3vw,6.7rem); line-height:.94; }
.beat h2 { font-size:clamp(3rem,5.5vw,5.8rem); line-height:.96; }
.beat .copy { max-width:390px; font-size:clamp(.92rem,1.2vw,1.05rem); line-height:1.65; margin-bottom:0; }
.beat[data-beat="3"] { top:24%; width:min(440px,40%); }
.beat[data-beat="3"] h2 { font-size:clamp(2.8rem,4.8vw,5rem); }
.services { gap:.4rem; margin-top:1.15rem; }
.services span { padding:.4rem .6rem; font-size:.65rem; }
.film-toolbar { position:absolute; z-index:7; top:6rem; left:6%; display:flex; flex-wrap:wrap; align-items:center; gap:.5rem; }
.film-toolbar button { min-height:42px; border:1px solid #54728e; padding:.65rem .9rem; border-radius:999px; background:rgba(2,8,23,.88); color:#eaf6ff; cursor:pointer; font-size:.68rem; font-weight:700; }
.film-toolbar button:hover { border-color:#c0e8ff; background:#0a2445; }
.film-toolbar .motion-toggle { color:#b1cce0; border-color:#294055; }
.film-controls { display:flex; gap:.4rem; }
.film-status { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); }
.next-scene { top:auto; bottom:5.6rem; right:6%; min-height:44px; background:rgba(2,8,23,.9); }
.skip-story { bottom:5.6rem; left:6%; right:auto; display:flex; align-items:center; min-height:44px; border:0; letter-spacing:.02em; color:#c2d9e9; }
.scroll-prompt { display:none; }
.chapter-nav { top:auto; bottom:1.4rem; right:50%; transform:translateX(50%); display:flex; align-items:center; gap:.35rem; padding:.3rem .7rem; border:1px solid #324e6b; border-radius:999px; background:rgba(2,8,23,.94); backdrop-filter:blur(14px); transition:opacity .2s; }
.chapter-current { color:#c9e5fa; font-size:.65rem; font-weight:700; min-width:110px; padding:0 .5rem; }
.chapter-jump { min-width:44px; min-height:44px; justify-content:center; font-size:0; gap:0; opacity:.7; }
.chapter-jump::after { width:.45rem; height:.45rem; }
.chapter-jump:hover,.chapter-jump[aria-current="step"] { transform:none; }
.reveal-lockup { position:absolute; z-index:4; left:50%; bottom:19%; transform:translateX(-50%); width:min(90%,520px); text-align:center; opacity:0; pointer-events:none; }
.reveal-lockup.is-visible { pointer-events:auto; }
.reveal-lockup .eyebrow { justify-content:center; font-size:.62rem; letter-spacing:.23em; }
.reveal-lockup .eyebrow::before { display:none; }
.reveal-lockup h2 { font-size:clamp(2rem,3.3vw,3.6rem); margin-bottom:1.25rem; letter-spacing:-.035em; line-height:1.05; }
.reveal-lockup a { display:inline-flex; align-items:center; justify-content:center; min-height:48px; padding:.85rem 1.3rem; border-radius:999px; background:#e8f6ff; color:#061426; font-size:.78rem; font-weight:800; box-shadow:0 8px 30px #010510; }
.reveal-lockup a:hover { background:#bfe6ff; }
.stage[data-revealing="true"]::after { background:linear-gradient(0deg,rgba(2,8,23,.8),transparent 52%),linear-gradient(90deg,rgba(2,8,23,.15),transparent); }
.rest-backdrop { background-image:linear-gradient(180deg,rgba(2,8,23,.68),rgba(2,8,23,.94)),url('assets/sequence-webp/19.webp'); }
.work { margin-top:-12svh; padding-top:clamp(4.5rem,9vw,8rem); background:linear-gradient(180deg,rgba(2,8,23,.06),rgba(2,8,23,.92) 35%); }
.work::before { display:none; }
.work-head { transition:opacity .4s,transform .5s; }
.studio-end { background:#030d1d; overflow:clip; }
.studio-end::before { background:radial-gradient(ellipse at 10% 0%,rgba(32,92,164,.15),transparent 65%); }
.service-item { min-width:0; display:flex; flex-direction:column; }
.service-card { width:100%; height:100%; min-width:0; }
.service-card:hover,.service-card.is-active { transform:none; }
.service-card i { opacity:1; transform:none; }
.service-card:focus-visible { outline-offset:3px; }
.service-detail { margin-top:1rem; background:#06172c; }
.service-detail[hidden] { display:none; }
.project-menu:not([data-open="true"]),.project-preview:not([data-open="true"]) { visibility:hidden; }
body[data-motion="reduced"] .frame { transform:none !important; filter:none !important; }
body[data-motion="reduced"] .ripples,body[data-motion="reduced"] .bloom,body[data-motion="reduced"] .light-pass,body[data-motion="reduced"] .cursor-light { display:none; }
body[data-motion="reduced"] .will-reveal { opacity:1; transform:none; transition:none; }
@media (min-width:801px) and (max-width:1050px) { .service-deck { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:800px) {
  .timeline { height:610svh; }
  .nav { top:.7rem; }
  .film-toolbar { top:5.2rem; left:1.25rem; right:1.25rem; gap:.4rem; }
  .film-toolbar button { padding:.55rem .72rem; font-size:.63rem; }
  .copy-layer { width:calc(100% - 2.5rem); padding:0; }
  .beat,.beat[data-beat="3"] { top:29%; bottom:auto; width:100%; max-width:430px; }
  .beat h1,.beat h2,.beat[data-beat="3"] h2 { font-size:clamp(2.65rem,11.5vw,4.5rem); line-height:.98; }
  .beat .copy { max-width:340px; font-size:.88rem; line-height:1.6; }
  .eyebrow { font-size:.59rem; letter-spacing:.12em; margin-bottom:.7rem; gap:.5rem; }
  .eyebrow::before { width:1.4rem; }
  .stage::after { background:linear-gradient(90deg,rgba(2,8,23,.48),rgba(2,8,23,.2)),linear-gradient(0deg,#020817 0%,rgba(2,8,23,.68) 25%,rgba(2,8,23,.65) 53%,transparent 85%); }
  .next-scene { top:auto; bottom:5rem; right:1.25rem; padding:.5rem .7rem; }
  .skip-story { bottom:5rem; left:1.25rem; right:auto; font-size:.63rem; }
  .chapter-nav { bottom:.7rem; padding:.15rem .5rem; gap:0; }
  .chapter-current { min-width:100px; font-size:.6rem; padding:0 .35rem; }
  .chapter-jump { min-width:36px; min-height:44px; }
  .reveal-lockup { bottom:24%; }
  .reveal-lockup h2 { font-size:clamp(1.9rem,7.8vw,2.8rem); }
  .reveal-lockup .eyebrow { margin-bottom:.55rem; }
  .reveal-lockup a { font-size:.73rem; min-height:44px; padding:.75rem 1.15rem; }
  .ripples { bottom:23%; }
  .service-head { padding-top:3rem; }
  .service-head h2 { font-size:clamp(2.5rem,11vw,4rem); line-height:1; }
  .service-head p { font-size:.86rem; max-width:440px; }
  .service-deck { display:grid; grid-template-columns:minmax(0,1fr); gap:.7rem; overflow:visible; margin:1.4rem 0 0; padding:0; scroll-snap-type:none; }
  .service-card { flex:none; height:auto; min-height:0; padding:1rem 1.1rem; scroll-snap-align:none; }
  .service-card strong { margin:.65rem 0 .4rem; font-size:2rem; }
  .service-card small { max-width:440px; font-size:.8rem; }
  .service-card i { margin-top:.75rem; font-size:.68rem; }
  .service-item .service-detail { flex:none; margin-top:0; padding:1rem 1.1rem; border-top:0; min-height:0; }
  .service-detail p { font-size:.8rem; }
  .service-detail a { min-height:44px; display:inline-flex; align-items:center; margin-top:.7rem; padding:.65rem .8rem; }
  .inquiry-panel { min-width:0; padding:1.2rem; margin-top:3rem; }
  .inquiry-form,.inquiry-form label,.inquiry-form input,.inquiry-form select { min-width:0; }
}
@media (max-height:580px) and (max-width:800px) {
  .beat,.beat[data-beat="3"] { top:29%; }
  .beat h1,.beat h2,.beat[data-beat="3"] h2 { font-size:clamp(2.4rem,10.5vw,3.4rem); margin-bottom:.8rem; }
  .beat .copy { font-size:.82rem; }
  .services { margin-top:.7rem; }
  .services span { font-size:.6rem; padding:.3rem .45rem; }
  .reveal-lockup { bottom:26%; }
  .reveal-lockup h2 { font-size:1.8rem; margin-bottom:.8rem; }
}
@media (prefers-reduced-motion:reduce) {
  .frame { transform:none !important; filter:none !important; }
  .ripples,.bloom,.light-pass,.cursor-light { display:none; }
  .will-reveal { opacity:1; transform:none; }
}

/* Only the two visible images need compositing surfaces. */
.frame.is-active { display:block; will-change:opacity,transform; }
.scene-dim { position:absolute; inset:0; z-index:-5; background:#000; opacity:0; pointer-events:none; }
@media (max-width:800px), (pointer:coarse) {
  .grain,.bloom,.cursor-light { display:none; }
  .nav,.brand,.nav-action,.chapter-nav,.next-scene,.services span,.process-grid { backdrop-filter:none; -webkit-backdrop-filter:none; }
  .nav { background:rgba(2,8,23,.96); }
  .rest-backdrop { background-image:linear-gradient(180deg,rgba(2,8,23,.68),rgba(2,8,23,.94)),url('assets/sequence-mobile/19.webp'); }
}