/* ROF visual upgrade layer: shared layout, motion, and polish. */
:root{
  --rof-ink:#080705;
  --rof-panel:#14110c;
  --rof-panel-2:#1d1810;
  --rof-paper:#f5f0e6;
  --rof-muted:#b7ab99;
  --rof-line:rgba(201,160,90,.18);
  --rof-line-strong:rgba(201,160,90,.38);
  --rof-glow:0 22px 70px rgba(0,0,0,.34);
  --rof-rise:cubic-bezier(.16,1,.3,1);
}

html{scroll-padding-top:92px;}
body{
  background:
    linear-gradient(180deg,var(--rof-ink),#100d09 38%,#0a0805),
    radial-gradient(circle at 18% 12%,rgba(201,160,90,.10),transparent 34%);
  text-rendering:optimizeLegibility;
}
body::before{
  content:"";
  position:fixed;
  inset:0;
  z-index:-2;
  pointer-events:none;
  background:
    linear-gradient(90deg,rgba(244,241,234,.025) 1px,transparent 1px),
    linear-gradient(180deg,rgba(244,241,234,.018) 1px,transparent 1px);
  background-size:72px 72px;
  mask-image:linear-gradient(to bottom,rgba(0,0,0,.7),transparent 78%);
}
body::after{
  content:"";
  position:fixed;
  inset:0;
  z-index:-1;
  pointer-events:none;
  background:radial-gradient(520px circle at var(--pointer-x,50%) var(--pointer-y,18%),rgba(201,160,90,.075),transparent 66%);
  opacity:.9;
  transition:opacity .35s ease;
}

.ambient .orb{display:none!important;}
.ambient .sweep{opacity:.22!important;filter:blur(.2px);}
.grain{opacity:.038!important;mix-blend-mode:soft-light;}

nav#nav{
  height:82px;
  padding:0 clamp(1rem,3vw,3rem);
  background:linear-gradient(180deg,rgba(8,7,5,.86),rgba(8,7,5,.58));
  border-bottom:1px solid var(--rof-line);
  box-shadow:0 14px 44px rgba(0,0,0,.18);
}
nav#nav.scrolled{height:66px;background:rgba(8,7,5,.92);border-color:rgba(201,160,90,.26);}
.brand img{max-width:min(190px,30vw);object-fit:contain;}
.nav-links{gap:clamp(1.1rem,2.35vw,2.6rem);}
.nav-links a{font-size:.82rem;letter-spacing:.04em;}
.nav-links a::before{
  content:"";
  position:absolute;
  inset:-.45rem -.7rem;
  border:1px solid transparent;
  opacity:0;
  transform:scale(.96);
  transition:opacity .28s var(--rof-rise),transform .28s var(--rof-rise),border-color .28s;
}
.nav-links a:hover::before,.nav-links a.active::before{opacity:1;transform:none;border-color:rgba(201,160,90,.16);}
.nav-cta,.btn-primary,.btn-ghost,.btn-dark,.location-cta,.lens-cta,.footer-top,.footer-back{
  position:relative;
  overflow:hidden;
}
.nav-cta::after,.btn-primary::after,.btn-ghost::after,.btn-dark::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(110deg,transparent 0%,rgba(255,255,255,.28) 48%,transparent 60%);
  transform:translateX(-120%);
  transition:transform .7s var(--rof-rise);
}
.nav-cta:hover::after,.btn-primary:hover::after,.btn-ghost:hover::after,.btn-dark:hover::after{transform:translateX(120%);}

section{position:relative;}
.hero,.about-hero,.svc-hero,.work-hero,.deck-hero,.contact-page{isolation:isolate;}
.hero::after,.about-hero::after,.svc-hero::after,.work-hero::after,.deck-hero::after{
  content:"";
  position:absolute;
  inset:clamp(1rem,2.5vw,2rem);
  border:1px solid rgba(201,160,90,.15);
  pointer-events:none;
  z-index:1;
}
.hero::after{inset:calc(82px + 1.2rem) clamp(1rem,2.5vw,2rem) 1.2rem;}
.hero-inner,.about-hero-content,.svc-hero-inner,.work-hero > *,.deck-hero > *{position:relative;z-index:2;}

.about-hero,.svc-hero,.work-hero,.deck-hero{
  min-height:clamp(560px,72vh,780px)!important;
  padding-left:6vw!important;
  padding-right:6vw!important;
}
.about-hero-content,.svc-hero-inner,.work-hero,.deck-hero{max-width:1180px!important;margin-left:auto!important;margin-right:auto!important;}
.work-hero,.deck-hero{text-align:left!important;align-items:flex-start!important;}
.work-hero h1,.deck-title,.about-hero h1,.svc-hero h1,.contact-title,.hero h1{
  text-wrap:balance;
  letter-spacing:0!important;
}
.work-hero-sub,.deck-sub,.about-hero-sub,.svc-hero-sub,.hero-sub{max-width:58ch;text-wrap:pretty;}
.hero h1,.about-hero h1,.svc-hero h1,.work-hero h1,.deck-title{
  text-shadow:0 18px 54px rgba(0,0,0,.38);
}

.breath,.qbreath,.lens,.values-section,.location-section,.deck-section,.contact-right{
  background:linear-gradient(180deg,#f6f1e8,#e9dfce)!important;
}
.frames,.emotion,.process,.team-section,.cats,.timeline-section,.contact-left{
  background:linear-gradient(180deg,var(--rof-ink),var(--rof-panel) 52%,var(--rof-ink))!important;
}
.breath,.qbreath,.lens,.frames,.emotion,.typo,.process,.begin,.timeline-section,.values-section,.team-section,.location-section,.outcomes,.cats,.deck-section{
  padding-top:clamp(5rem,9vw,9rem)!important;
  padding-bottom:clamp(5rem,9vw,9rem)!important;
}
.frames-head,.emotion-head,.process-head,.section-header,.team-header,.timeline-header,.outcomes-head,.cats-head{
  max-width:1180px;
  margin-left:auto!important;
  margin-right:auto!important;
}
.frames-head h2,.emotion-head h2,.process-head h2,.section-title,.team-header h2,.timeline-header h2,.outcomes-head h2,.cats-head h2{
  text-wrap:balance;
}

.frame-card,.emo-card,.value-card,.team-card,.outcome,.cat-card,.step,.portfolio-item,.deck-card,.location-map-card,.contact-block,.form-field{
  will-change:transform,opacity;
}
.frame-card,.emo-card,.cat-card,.portfolio-item,.deck-card,.location-map-card,.team-avatar-placeholder{
  box-shadow:var(--rof-glow);
}
.frame-card,.emo-card,.cat-card,.portfolio-item,.team-avatar-placeholder,.lens-still,.location-map-card{
  border:1px solid var(--rof-line)!important;
}
.frame-card::before,.emo-card::before,.cat-card::before,.portfolio-item::before,.team-avatar-placeholder::before,.location-map-card::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:2;
  pointer-events:none;
  background:linear-gradient(135deg,rgba(255,255,255,.12),transparent 28%,transparent 72%,rgba(201,160,90,.12));
  opacity:0;
  transition:opacity .45s var(--rof-rise);
}
.frame-card:hover::before,.emo-card:hover::before,.cat-card:hover::before,.portfolio-item:hover::before,.team-avatar-placeholder:hover::before,.location-map-card:hover::before{opacity:1;}
.frame-card,.cat-card,.portfolio-item{transform-style:preserve-3d;}
.cat-card,.portfolio-item,.value-card,.team-card,.outcome,.step{
  transition:opacity .75s var(--rof-rise),transform .75s var(--rof-rise),border-color .35s,box-shadow .35s!important;
}
.cat-card:hover,.portfolio-item:hover,.value-card:hover,.team-card:hover,.outcome:hover,.step:hover{
  border-color:var(--rof-line-strong)!important;
  box-shadow:0 24px 70px rgba(0,0,0,.32);
}
.value-card,.outcome,.step{
  padding:clamp(1.6rem,2.6vw,2.4rem)!important;
  background:linear-gradient(180deg,rgba(255,255,255,.035),rgba(255,255,255,.012));
  border:1px solid var(--rof-line)!important;
}
.values-section .value-card{background:rgba(255,255,255,.42);border-color:rgba(10,8,5,.08)!important;box-shadow:0 18px 45px rgba(62,42,18,.08);}
.team-card{padding:0 0 .5rem;}
.team-avatar-placeholder::after{
  content:"";
  position:absolute;
  inset:1rem;
  border:1px solid rgba(201,160,90,.20);
  pointer-events:none;
}

.portfolio-grid{gap:clamp(.8rem,1.5vw,1.3rem)!important;padding-left:clamp(1rem,4vw,4rem)!important;padding-right:clamp(1rem,4vw,4rem)!important;}
.portfolio-item{overflow:hidden;background:#100d09!important;}
.portfolio-thumb,.cat-card-img,.frame-card-bg,.emo-bg,.lens-still-img{transition:transform .9s var(--rof-rise),filter .55s ease!important;}
.portfolio-item:hover .portfolio-thumb,.cat-card:hover .cat-card-img{transform:scale(1.065);filter:brightness(.86) saturate(1.12)!important;}
.portfolio-overlay{background:linear-gradient(to top,rgba(8,7,5,.94),rgba(8,7,5,.12) 58%,rgba(8,7,5,.30))!important;}
.portfolio-play,.frame-play{backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);}

.cats-grid,.outcomes-grid,.process-steps,.values-grid,.team-grid{
  gap:clamp(1rem,2vw,1.6rem)!important;
}
.cat-detail.show{
  background:linear-gradient(180deg,rgba(244,241,234,.04),rgba(244,241,234,.015));
  border:1px solid var(--rof-line);
  padding:clamp(1.5rem,3vw,3rem)!important;
  margin-top:2rem!important;
}

.deck-section{overflow:hidden;}
.deck-stage{filter:drop-shadow(0 30px 55px rgba(0,0,0,.26));}
.deck-card{border-radius:6px;}
.deck-arrow{font-family:var(--serif)!important;}
.deck-hint{opacity:.78;}

.contact-page{background:var(--rof-ink);}
.contact-left{display:flex;flex-direction:column;justify-content:center;}
.contact-blocks{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem!important;}
.contact-block{
  padding:1.2rem;
  border:1px solid rgba(201,160,90,.16);
  background:rgba(244,241,234,.035);
}
.contact-right{display:flex;flex-direction:column;justify-content:center;}
.contact-form input,.contact-form textarea,.contact-form select{
  border-radius:0!important;
  border-color:rgba(10,8,5,.18)!important;
  background:rgba(255,255,255,.56)!important;
  transition:border-color .25s,box-shadow .25s,background .25s;
}
.contact-form input:focus,.contact-form textarea:focus,.contact-form select:focus{
  border-color:var(--accent)!important;
  box-shadow:0 0 0 4px rgba(201,160,90,.13)!important;
  background:rgba(255,255,255,.82)!important;
}

.reveal,.reveal-stagger > *,.timeline-item,.value-card,.team-card,.outcome,.step,.cat-card,.portfolio-item{
  transition-delay:var(--stagger,0ms)!important;
}
.motion-ready .reveal:not(.visible),.motion-ready .timeline-item:not(.visible),.motion-ready .value-card:not(.visible),.motion-ready .team-card:not(.visible),.motion-ready .outcome:not(.visible),.motion-ready .step:not(.visible),.motion-ready .cat-card:not(.visible),.motion-ready .portfolio-item:not(.visible){
  opacity:0;
  transform:translateY(34px);
}
.motion-ready .visible{opacity:1;transform:none;}

.float-call{
  box-shadow:0 14px 40px rgba(0,0,0,.28),0 0 0 1px rgba(201,160,90,.2)!important;
}
footer{
  border-top:1px solid var(--rof-line)!important;
  background:linear-gradient(180deg,#0b0906,#050403)!important;
}
footer a:hover{color:var(--accent)!important;}
footer .footer-brand{
  min-width:0;
}
footer .footer-brand img{
  width:min(240px,36vw)!important;
  height:auto!important;
  object-fit:contain;
}
footer .footer-brand span{
  line-height:1.8;
}
footer .footer-links{
  row-gap:1rem!important;
}

@media(max-width:1040px){
  nav#nav{grid-template-columns:1fr auto;height:74px;}
  .nav-links{top:74px!important;padding:1.4rem!important;gap:.4rem!important;background:rgba(8,7,5,.98)!important;}
  .nav-links.open{display:grid!important;}
  .nav-links a{font-size:1rem!important;padding:1rem;border-bottom:1px solid rgba(201,160,90,.12);}
  .nav-right{gap:.75rem;}
  .nav-time{display:none!important;}
  .nav-cta{display:none!important;}
}
@media(max-width:900px){
  .about-hero,.svc-hero,.work-hero,.deck-hero{min-height:560px!important;text-align:left!important;}
  .lens,.contact-page{grid-template-columns:1fr!important;}
  .values-grid,.team-grid,.outcomes-grid,.cats-grid,.process-steps{grid-template-columns:repeat(2,minmax(0,1fr))!important;}
  .timeline::before{left:16px!important;}
  .timeline-item{grid-template-columns:34px 1fr!important;gap:1rem!important;}
  .timeline-empty{display:none!important;}
  .timeline-year-wrap{grid-column:1!important;align-items:flex-start!important;}
  .timeline-content{grid-column:2!important;text-align:left!important;padding:0!important;}
  .contact-blocks{grid-template-columns:1fr!important;}
}
@media(max-width:620px){
  body::before{background-size:44px 44px;}
  .hero::after,.about-hero::after,.svc-hero::after,.work-hero::after,.deck-hero::after{inset:.75rem;}
  .hero::after{inset:calc(74px + .75rem) .75rem .75rem;}
  .hero-inner{padding-left:1.2rem!important;padding-right:1.2rem!important;}
  .hero-actions{width:100%;}
  .btn-primary,.btn-ghost,.btn-dark{width:100%;justify-content:center;padding:1rem 1.1rem!important;}
  .values-grid,.team-grid,.outcomes-grid,.cats-grid,.process-steps{grid-template-columns:1fr!important;}
  .frame-card{margin-left:1rem!important;margin-right:1rem!important;min-height:420px!important;}
  .deck-ui{gap:1rem!important;width:100%;justify-content:center;}
  .deck-meta{min-width:120px!important;}
  .contact-left,.contact-right{padding-left:1.2rem!important;padding-right:1.2rem!important;}
  footer{padding-left:1.2rem!important;padding-right:1.2rem!important;}
}
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.001ms!important;}
  body::after{display:none;}
}
/* Keep decorative filmstrip elements from widening mobile pages. */
.filmstrip,.filmstrip-holes,.filmstrip-hole-row{max-width:100%;overflow:hidden;contain:paint;}
@media(max-width:620px){
  .filmstrip{height:54px;}
  .filmstrip-track{min-width:max-content;}
  .filmstrip-hole-row{gap:10px;}
  .filmstrip-hole:nth-child(n+18){display:none;}
}@media(max-width:620px){
  .filmstrip-track{display:none!important;}
  .cursor-dot,.cursor-ring{display:none!important;}
}.count-bar{flex-wrap:wrap;}
@media(max-width:620px){
  .count-bar{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.2rem!important;padding:1.4rem 1.2rem!important;}
  .count-divider{display:none!important;}
  .count-num{font-size:2.15rem!important;}
  .count-label{letter-spacing:.18em!important;}
}
/* Contrast correction after the visual upgrade: keep dark scenes readable. */
nav#nav .brand img{
  filter:brightness(0) invert(1) sepia(.22) saturate(1.8) hue-rotate(2deg)!important;
  opacity:1!important;
}
nav#nav .nav-links a,
nav#nav .nav-time,
nav#nav #time-display{
  color:rgba(244,241,234,.78)!important;
}
nav#nav .nav-links a:hover,
nav#nav .nav-links a.active{
  color:#f7f1e6!important;
}
nav#nav .nav-cta{
  color:#0a0805!important;
  background:#d4aa60!important;
  border-color:#d4aa60!important;
}

.about-hero,
.svc-hero,
.work-hero,
.deck-hero{
  color:#f4f1ea!important;
  min-height:clamp(460px,58vh,660px)!important;
  background:
    radial-gradient(900px circle at 34% 25%,rgba(201,160,90,.16),transparent 58%),
    linear-gradient(180deg,#0a0805 0%,#12100b 68%,#0a0805 100%)!important;
}
.about-hero h1,
.svc-hero h1,
.work-hero h1,
.deck-title{
  color:#f4f1ea!important;
  opacity:1!important;
  text-shadow:0 18px 56px rgba(0,0,0,.62)!important;
}
.about-hero h1 em,
.svc-hero h1 em,
.work-hero h1 em,
.deck-title em{
  color:#d6ad63!important;
}
.about-hero-eyebrow,
.svc-hero-eyebrow,
.work-hero-eyebrow,
.deck-eyebrow{
  color:#d6ad63!important;
  opacity:1!important;
}
.about-hero-sub,
.svc-hero-sub,
.work-hero-sub,
.deck-sub{
  color:rgba(244,241,234,.74)!important;
  opacity:1!important;
}
.deck-hero{
  padding-bottom:clamp(3rem,6vw,5rem)!important;
}

/* Sections authored for the light theme should stay light and readable. */
.manifesto,
.values-section,
.location-section,
.deck-section,
.contact-right{
  background:#f4f1ea!important;
  color:#0a0805!important;
}
.manifesto{
  max-width:none!important;
  margin:0!important;
  padding:clamp(5rem,8vw,8rem) 6vw!important;
}
.manifesto-label,
.manifesto-text{
  max-width:980px;
  margin-left:auto!important;
  margin-right:auto!important;
}
.manifesto-text,
.values-section h2,
.values-section h3,
.location-section h2,
.deck-section,
.deck-cap,
.deck-title + .deck-sub{
  color:#0a0805!important;
}
.manifesto-text strong{
  color:#0a0805!important;
}

/* Keep dark content sections readable. */
.timeline-section,
.team-section,
.cats,
.process,
.frames,
.emotion{
  color:#f4f1ea!important;
}
.timeline-content h3,
.team-name,
.outcome h3,
.cat-card h3,
.step h3,
.portfolio-title{
  color:#f4f1ea!important;
}
.timeline-content p,
.team-bio,
.outcome p,
.cat-desc,
.step p,
.portfolio-year,
.portfolio-kind{
  color:rgba(244,241,234,.66)!important;
}

@media(max-width:620px){
  .about-hero,.svc-hero,.work-hero,.deck-hero{min-height:520px!important;}
}
/* Gallery hero subtitle must stay light on the dark hero. */
.deck-hero .deck-sub{color:rgba(244,241,234,.74)!important;}
nav#nav .nav-toggle{
  color:#f4f1ea!important;
  border-color:rgba(201,160,90,.45)!important;
  background:rgba(10,8,5,.45)!important;
}
nav#nav .nav-toggle:hover{border-color:#d6ad63!important;color:#d6ad63!important;}
/* Immersive cinema background: projector sweep, film gate, scratches, and dust. */
body.rof-immersive-ready{
  background:
    linear-gradient(180deg,#080705 0%,#110d08 44%,#070604 100%)!important;
}
.rof-immersive{
  position:fixed;
  inset:-8vh -8vw;
  z-index:0;
  pointer-events:none;
  overflow:hidden;
  contain:layout paint style;
  opacity:.82;
  color:#d6ad63;
  transform:translate3d(0,var(--rof-bg-y,0px),0);
  transition:opacity .35s ease;
}
.rof-immersive::before{
  content:"";
  position:absolute;
  inset:-16% -18%;
  background:
    linear-gradient(112deg,transparent 0%,rgba(214,173,99,.045) 34%,rgba(244,241,234,.075) 48%,rgba(138,51,36,.035) 58%,transparent 76%),
    radial-gradient(ellipse at 28% 20%,rgba(214,173,99,.10),transparent 42%),
    linear-gradient(180deg,rgba(244,241,234,.018),transparent 35%,rgba(214,173,99,.018));
  transform:translate3d(-8%,0,0) rotate(-2deg);
  animation:rofProjectorSweep 18s var(--rof-rise,cubic-bezier(.16,1,.3,1)) infinite alternate;
  will-change:transform,opacity;
}
.rof-immersive::after{
  content:"";
  position:absolute;
  inset:0;
  background:
    repeating-linear-gradient(90deg,transparent 0 11.5vw,rgba(214,173,99,.055) 11.55vw,transparent 11.65vw),
    repeating-linear-gradient(180deg,transparent 0 88px,rgba(244,241,234,.025) 89px,transparent 90px);
  opacity:.54;
  animation:rofGateDrift 14s steps(10) infinite;
}
.rof-immersive__gate{
  position:absolute;
  inset:10vh 8vw;
  border:1px solid rgba(214,173,99,.12);
  box-shadow:inset 0 0 70px rgba(214,173,99,.035),0 0 80px rgba(0,0,0,.22);
  opacity:.72;
  animation:rofGateBreath 9s ease-in-out infinite;
}
.rof-immersive__gate::before,
.rof-immersive__gate::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  height:1px;
  background:linear-gradient(90deg,transparent,rgba(214,173,99,.26),transparent);
  opacity:.55;
}
.rof-immersive__gate::before{top:23%;}
.rof-immersive__gate::after{bottom:19%;}
.rof-immersive__scan{
  position:absolute;
  inset:0;
  background:linear-gradient(180deg,transparent 0%,rgba(244,241,234,.035) 48%,transparent 52%);
  opacity:.42;
  transform:translateY(-70%);
  animation:rofScan 7s linear infinite;
}
.rof-immersive__scratch{
  position:absolute;
  top:-20%;
  width:1px;
  height:145%;
  background:linear-gradient(180deg,transparent,rgba(244,241,234,.22),transparent 68%);
  opacity:.18;
  transform:translateY(-18%);
  animation:rofScratchFall linear infinite;
}
.rof-immersive__scratch:nth-child(3n){width:2px;opacity:.10;background:linear-gradient(180deg,transparent,rgba(214,173,99,.24),transparent 72%);}
.rof-immersive__dust{
  position:absolute;
  inset:0;
}
.rof-immersive__dust i{
  position:absolute;
  display:block;
  width:2px;
  height:2px;
  background:rgba(244,241,234,.72);
  opacity:0;
  box-shadow:0 0 8px rgba(214,173,99,.65);
  animation:rofDustFloat linear infinite;
  will-change:transform,opacity;
}
.rof-immersive__dust i:nth-child(4n){width:1px;height:4px;background:rgba(214,173,99,.72);}
.rof-immersive__dust i:nth-child(5n){width:3px;height:1px;}

.hero,
.about-hero,
.svc-hero,
.work-hero,
.deck-hero,
.contact-left{
  overflow:hidden;
}
.hero::before,
.about-hero::before,
.svc-hero::before,
.work-hero::before,
.deck-hero::before,
.contact-left::before{
  animation:rofHeroLight 12s ease-in-out infinite alternate!important;
}
.hero h1,
.about-hero h1,
.svc-hero h1,
.work-hero h1,
.deck-title{
  filter:drop-shadow(0 22px 38px rgba(0,0,0,.55));
}
.frame-card,
.portfolio-item,
.cat-card,
.deck-card,
.team-avatar-placeholder,
.lens-still{
  animation:rofCardFloat 7s ease-in-out infinite;
  animation-delay:var(--float-delay,0ms);
}
.portfolio-grid .portfolio-item:nth-child(3n),
.cats-grid .cat-card:nth-child(3n),
.emotion-grid .emo-card:nth-child(3n){--float-delay:700ms;}
.portfolio-grid .portfolio-item:nth-child(3n+2),
.cats-grid .cat-card:nth-child(3n+2),
.emotion-grid .emo-card:nth-child(3n+2){--float-delay:1400ms;}

@keyframes rofProjectorSweep{
  0%{opacity:.48;transform:translate3d(-14%,1%,0) rotate(-3deg) scale(1.02);}
  45%{opacity:.82;}
  100%{opacity:.62;transform:translate3d(10%,-2%,0) rotate(2deg) scale(1.06);}
}
@keyframes rofGateDrift{
  0%,100%{transform:translate3d(0,0,0);}
  25%{transform:translate3d(-8px,4px,0);}
  50%{transform:translate3d(6px,-3px,0);}
  75%{transform:translate3d(3px,6px,0);}
}
@keyframes rofGateBreath{
  0%,100%{opacity:.52;transform:scale(1);}
  50%{opacity:.86;transform:scale(1.006);}
}
@keyframes rofScan{
  from{transform:translateY(-72%);}
  to{transform:translateY(72%);}
}
@keyframes rofScratchFall{
  0%{transform:translateY(-22%);opacity:0;}
  12%{opacity:.2;}
  82%{opacity:.12;}
  100%{transform:translateY(22%);opacity:0;}
}
@keyframes rofDustFloat{
  0%{opacity:0;transform:translate3d(0,18px,0) scale(.75);}
  14%,78%{opacity:.48;}
  100%{opacity:0;transform:translate3d(var(--dx,28px),-64px,0) scale(1.1);}
}
@keyframes rofHeroLight{
  0%,100%{opacity:.82;filter:saturate(1) brightness(1);}
  50%{opacity:1;filter:saturate(1.18) brightness(1.12);}
}
@keyframes rofCardFloat{
  0%,100%{translate:0 0;}
  50%{translate:0 -5px;}
}

@media(max-width:700px){
  .rof-immersive{opacity:.55;inset:-4vh -8vw;}
  .rof-immersive__gate{inset:9vh 3vw;}
  .rof-immersive__scratch:nth-of-type(n+6),
  .rof-immersive__dust i:nth-child(n+18){display:none;}
  .frame-card,.portfolio-item,.cat-card,.deck-card,.team-avatar-placeholder,.lens-still{animation:none!important;}
}
@media(prefers-reduced-motion:reduce){
  .rof-immersive,
  .rof-immersive *,
  .frame-card,.portfolio-item,.cat-card,.deck-card,.team-avatar-placeholder,.lens-still{
    animation:none!important;
  }
  .rof-immersive{opacity:.28;}
}
/* View chips stay visible even before live YouTube statistics are configured. */
.portfolio-views.views-pending,
.frame-views.views-pending{
  color:rgba(244,241,234,.58)!important;
}
.portfolio-views.views-pending svg{
  opacity:.55;
}
/* Canvas projector layer: page-wide motion behind every scene. */
body.rof-immersive-ready > :not(.rof-immersive):not(script):not(style):not(.lightbox):not(.imglb):not(.float-call):not(.page-fade):not(.ambient):not(.grain):not(.scroll-prog):not(.cursor-dot):not(.cursor-ring):not(.hud){
  position:relative;
  z-index:1;
}
body.rof-immersive-ready > .lightbox,
body.rof-immersive-ready > .imglb,
body.rof-immersive-ready > .page-fade,
body.rof-immersive-ready > .ambient,
body.rof-immersive-ready > .grain,
body.rof-immersive-ready > .scroll-prog,
body.rof-immersive-ready > .cursor-dot,
body.rof-immersive-ready > .cursor-ring,
body.rof-immersive-ready > .hud,
body.rof-immersive-ready > .float-call{
  position:fixed!important;
}
body.rof-immersive-ready > .lightbox,
body.rof-immersive-ready > .imglb,
body.rof-immersive-ready > .page-fade{
  inset:0!important;
}
.rof-bg-canvas{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  z-index:0;
  opacity:.9;
  mix-blend-mode:screen;
  filter:saturate(1.04) contrast(1.05);
}
.rof-immersive__ticker{
  position:absolute;
  left:0;
  right:0;
  bottom:7vh;
  height:34px;
  opacity:.2;
  overflow:hidden;
  mask-image:linear-gradient(90deg,transparent,black 16%,black 84%,transparent);
}
.rof-immersive__ticker::before{
  content:"ROF 001  ROF 002  ROF 003  ROF 004  ROF 005  ROF 006  ROF 007  ROF 008  ROF 009";
  position:absolute;
  left:0;
  top:50%;
  min-width:220%;
  font-family:var(--mono,'JetBrains Mono',monospace);
  font-size:.58rem;
  letter-spacing:.42em;
  color:rgba(214,173,99,.76);
  white-space:nowrap;
  transform:translate3d(0,-50%,0);
  animation:rofTicker 24s linear infinite;
}
@keyframes rofTicker{
  from{transform:translate3d(0,-50%,0);}
  to{transform:translate3d(-50%,-50%,0);}
}
@media(max-width:700px){
  .rof-bg-canvas{opacity:.55;}
  .rof-immersive__ticker{display:none;}
}
@media(prefers-reduced-motion:reduce){
  .rof-bg-canvas,.rof-immersive__ticker{display:none!important;}
}
/* Performance pass: keep the cinematic atmosphere, remove jittery always-on motion. */
.rof-immersive{
  opacity:.48!important;
  transform:none!important;
  will-change:auto!important;
}
.rof-immersive::before{
  opacity:.42!important;
  animation-duration:46s!important;
  will-change:auto!important;
}
.rof-immersive::after{
  opacity:.20!important;
  animation:none!important;
}
.rof-immersive__gate{
  opacity:.34!important;
  animation:none!important;
  box-shadow:inset 0 0 42px rgba(214,173,99,.026)!important;
}
.rof-immersive__scan{
  display:none!important;
}
.rof-immersive__scratch{
  opacity:.08!important;
}
.rof-immersive__dust i{
  box-shadow:none!important;
  animation-timing-function:ease-in-out!important;
}
.rof-bg-canvas{
  opacity:.42!important;
  filter:none!important;
}
.rof-immersive__ticker{
  display:none!important;
}
.frame-card,
.portfolio-item,
.cat-card,
.deck-card,
.team-avatar-placeholder,
.lens-still{
  animation:none!important;
}
.frame-card,.emo-card,.value-card,.team-card,.outcome,.cat-card,.step,.portfolio-item,.deck-card,.location-map-card,.contact-block,.form-field{
  will-change:auto!important;
}
.portfolio-thumb,.cat-card-img,.frame-card-bg,.emo-bg,.lens-still-img{
  will-change:transform;
}
@media(max-width:900px){
  .rof-bg-canvas{display:none!important;}
  .rof-immersive{opacity:.32!important;}
  .rof-immersive::before{animation:none!important;}
  .rof-immersive__scratch:nth-of-type(n+3),
  .rof-immersive__dust i:nth-child(n+8){display:none!important;}
}
/* Final smoothness guard: no canvas renderer, minimal background particles. */
.rof-bg-canvas{display:none!important;}
.rof-immersive__dust i:nth-child(n+9),
.rof-immersive__scratch:nth-of-type(n+3){display:none!important;}
.rof-immersive::before{animation-duration:70s!important;opacity:.34!important;}
.rof-immersive{opacity:.38!important;}
/* Typographic intermission containment: keep the statement centered and readable. */
.typo{
  overflow:hidden!important;
  padding-left:clamp(1.25rem,6vw,6rem)!important;
  padding-right:clamp(1.25rem,6vw,6rem)!important;
}
.typo h2{
  width:min(100%,14.6ch)!important;
  max-width:760px!important;
  margin:0 auto!important;
  font-size:clamp(3rem,6.2vw,5.8rem)!important;
  line-height:1.04!important;
  letter-spacing:0!important;
  text-align:center!important;
  text-wrap:balance;
  overflow-wrap:normal;
}
.typo h2 .dim{
  color:rgba(10,8,5,.24)!important;
}
@media(max-width:900px){
  .typo h2{
    width:min(100%,14ch)!important;
    font-size:clamp(2.55rem,8.4vw,4.25rem)!important;
    line-height:1.08!important;
  }
}
@media(max-width:560px){
  .typo{padding-left:1.1rem!important;padding-right:1.1rem!important;}
  .typo h2{
    width:100%!important;
    max-width:14ch!important;
    font-size:clamp(2.1rem,11vw,3rem)!important;
  }
}
/* Device optimization layer: phones, tablets, and narrow browser windows. */
*,*::before,*::after{box-sizing:border-box;}
html,body{width:100%;max-width:100%;overflow-x:clip!important;}
img,video,canvas,iframe{max-width:100%;}
:where(h1,h2,h3,p,blockquote,cite,a,button,span){min-width:0;}
:where(.scene-mark,.section-eyebrow,.work-hero-eyebrow,.deck-eyebrow,.about-hero-eyebrow,.svc-hero-eyebrow,.portfolio-kind,.portfolio-year,.frame-meta,.count-label){overflow-wrap:anywhere;}
nav#nav{max-width:100vw;}
nav#nav .brand img{height:auto!important;max-height:58px;max-width:clamp(112px,18vw,190px)!important;}
.nav-links{min-width:0;}

@media(max-width:1180px){
  .nav-links{gap:clamp(.75rem,1.5vw,1.4rem)!important;}
  .nav-links a{font-size:.76rem!important;}
  .nav-time{font-size:.64rem!important;}
  .hero h1,.about-hero h1,.svc-hero h1,.work-hero h1,.deck-title,.contact-title{font-size:clamp(3rem,8.4vw,6.2rem)!important;line-height:.96!important;}
  .portfolio-grid{grid-template-columns:repeat(auto-fit,minmax(240px,1fr))!important;}
}

@media(max-width:900px){
  html{scroll-padding-top:76px;}
  nav#nav{height:72px!important;padding-left:1rem!important;padding-right:1rem!important;grid-template-columns:1fr auto!important;}
  nav#nav.scrolled{height:64px!important;}
  nav#nav .brand img{max-width:138px!important;max-height:48px!important;}
  .nav-right{justify-self:end!important;}
  .nav-time,.nav-cta{display:none!important;}
  .nav-toggle{display:inline-flex!important;align-items:center;justify-content:center;min-width:44px;min-height:44px;padding:.7rem .85rem!important;}
  .nav-links{
    position:fixed!important;
    left:0!important;
    right:0!important;
    top:72px!important;
    max-height:calc(100svh - 72px)!important;
    overflow-y:auto!important;
    overscroll-behavior:contain;
    padding:1rem!important;
    gap:0!important;
  }
  nav#nav.scrolled .nav-links{top:64px!important;max-height:calc(100svh - 64px)!important;}
  .nav-links.open,.nav-links.mobile-open{display:grid!important;}
  .nav-links a{font-size:1rem!important;line-height:1.2!important;padding:1rem .35rem!important;letter-spacing:.02em!important;}

  .hero,.about-hero,.svc-hero,.work-hero,.deck-hero{min-height:auto!important;padding:8.5rem 1.2rem 4rem!important;}
  .contact-page{min-height:auto!important;grid-template-columns:1fr!important;}
  .hero-inner,.about-hero-content,.svc-hero-inner,.work-hero,.deck-hero{width:100%!important;max-width:100%!important;}
  .hero h1,.about-hero h1,.svc-hero h1,.work-hero h1,.deck-title,.contact-title{font-size:clamp(2.75rem,11vw,4.9rem)!important;line-height:1!important;}
  .hero-sub,.about-hero-sub,.svc-hero-sub,.work-hero-sub,.deck-sub{font-size:clamp(.95rem,3.2vw,1.1rem)!important;max-width:60ch!important;}

  .breath,.qbreath,.lens,.frames,.emotion,.typo,.process,.begin,.timeline-section,.values-section,.team-section,.location-section,.outcomes,.cats,.deck-section,.manifesto{padding:4.5rem 1.25rem!important;}
  .section-header,.frames-head,.emotion-head,.process-head,.team-header,.timeline-header,.outcomes-head,.cats-head{display:block!important;margin-bottom:2.4rem!important;}
  .section-title,.frames-head h2,.emotion-head h2,.process-head h2,.team-header h2,.timeline-header h2,.outcomes-head h2,.cats-head h2{font-size:clamp(2rem,8vw,3.2rem)!important;line-height:1.06!important;letter-spacing:0!important;}
  .scene-mark{gap:.7rem!important;letter-spacing:.24em!important;font-size:.58rem!important;line-height:1.55!important;}

  .values-grid,.team-grid,.outcomes-grid,.cats-grid,.process-steps,.contact-blocks{grid-template-columns:1fr!important;}
  .portfolio-grid{grid-template-columns:1fr!important;padding-left:1rem!important;padding-right:1rem!important;gap:1rem!important;}
  .portfolio-item{min-height:360px!important;}
  .frame-card{min-height:440px!important;height:auto!important;margin-left:1rem!important;margin-right:1rem!important;}
  .frame-card h3{font-size:clamp(2rem,9vw,3.5rem)!important;max-width:12ch!important;}
  .frame-meta{gap:.75rem!important;font-size:.56rem!important;}
  .emo-grid,.emotion-grid{grid-template-columns:1fr!important;}
  .emo-card,.cat-card{min-height:320px!important;}
  .deck-stage{width:100%!important;min-height:440px!important;}
  .deck-card{width:min(82vw,330px)!important;}
  .lightbox-inner{width:92vw!important;max-width:92vw!important;}
  #breathCanvas,#qCanvas,.breath-bg,.qbreath-bg{display:none!important;}
}

@media(max-width:620px){
  body{font-size:15px;}
  nav#nav{padding-left:.85rem!important;padding-right:.85rem!important;}
  nav#nav .brand img{max-width:116px!important;max-height:42px!important;}
  .hero,.about-hero,.svc-hero,.work-hero,.deck-hero{padding-top:7.4rem!important;padding-bottom:3.5rem!important;}
  .hero h1,.about-hero h1,.svc-hero h1,.work-hero h1,.deck-title,.contact-title{font-size:clamp(2.35rem,13vw,3.75rem)!important;}
  .hero-actions,.begin-actions,.contact-actions{display:grid!important;grid-template-columns:1fr!important;width:100%!important;gap:.75rem!important;}
  .btn-primary,.btn-ghost,.btn-dark,.lens-cta,.location-cta{width:100%!important;min-height:46px;justify-content:center!important;text-align:center!important;}
  .count-bar{grid-template-columns:1fr!important;text-align:center!important;}
  .count-num{font-size:2rem!important;}
  .filter-bar{padding:1rem!important;gap:.6rem!important;justify-content:flex-start!important;overflow-x:auto!important;scroll-snap-type:x proximity;}
  .filter-btn{flex:0 0 auto;scroll-snap-align:start;min-height:42px;}
  .portfolio-item{min-height:320px!important;}
  .portfolio-title{font-size:1.45rem!important;}
  .portfolio-overlay{padding:1.2rem!important;}
  .frame-card{min-height:390px!important;}
  .deck-stage{min-height:380px!important;}
  .contact-left,.contact-right{padding:4rem 1rem!important;}
  footer{display:grid!important;grid-template-columns:1fr!important;text-align:left!important;gap:1.6rem!important;padding:2.4rem 1rem!important;}
  .footer-links,.footer-nav,.footer-meta{display:grid!important;grid-template-columns:1fr!important;gap:.8rem!important;}
  .float-call{width:50px!important;height:50px!important;right:max(1rem,env(safe-area-inset-right))!important;bottom:max(1rem,env(safe-area-inset-bottom))!important;}
}

@media(max-width:420px){
  .hero h1,.about-hero h1,.svc-hero h1,.work-hero h1,.deck-title,.contact-title{font-size:clamp(2.1rem,14vw,3.25rem)!important;}
  .breath-morph{font-size:clamp(1.85rem,10vw,2.5rem)!important;line-height:1.14!important;}
  .qbreath blockquote{font-size:clamp(1.45rem,8vw,2rem)!important;max-width:14ch!important;}
  .typo h2{font-size:clamp(1.95rem,11vw,2.8rem)!important;max-width:14ch!important;}
  .scene-mark{letter-spacing:.18em!important;}
}

@media(max-height:560px) and (orientation:landscape){
  .hero,.about-hero,.svc-hero,.work-hero,.deck-hero{padding-top:6rem!important;padding-bottom:2.5rem!important;}
  .hero h1,.about-hero h1,.svc-hero h1,.work-hero h1,.deck-title{font-size:clamp(2rem,8vw,3.5rem)!important;}
  .breath,.qbreath,.lens,.frames,.emotion,.typo,.process,.begin,.timeline-section,.values-section,.team-section,.location-section,.outcomes,.cats,.deck-section{padding-top:3rem!important;padding-bottom:3rem!important;}
}
/* Calm motion mode: keep the film language, remove the jitter-heavy loops. */
html.motion-calm{
  scroll-behavior:auto;
}
html.motion-calm .grain,
html.motion-calm .cursor-dot,
html.motion-calm .cursor-ring,
html.motion-calm .ambient .motes,
html.motion-calm .ambient .sweep,
html.motion-calm .rof-immersive__scan,
html.motion-calm .rof-immersive__dust,
html.motion-calm .rof-immersive__scratch,
html.motion-calm .rof-immersive__ticker,
html.motion-calm #breathCanvas,
html.motion-calm #qCanvas,
html.motion-calm .breath-bg,
html.motion-calm .qbreath-bg{
  display:none!important;
}
html.motion-calm .ambient .orb{
  animation:none!important;
  filter:blur(34px)!important;
  mix-blend-mode:normal!important;
  opacity:.16!important;
  transform:none!important;
  will-change:auto!important;
}
html.motion-calm .ambient .orb2,
html.motion-calm .ambient .orb3{
  display:none!important;
}
html.motion-calm .hero-slide{
  animation:none!important;
  opacity:0!important;
  transform:none!important;
  filter:brightness(.46) saturate(1.02) contrast(1)!important;
  will-change:auto!important;
}
html.motion-calm .hero-slide:first-child{
  opacity:1!important;
}
html.motion-calm #loader::before,
html.motion-calm .loader-reel-img,
html.motion-calm .loader-status .status-dot,
html.motion-calm .hud .rec i,
html.motion-calm .hero-cue-line,
html.motion-calm .rof-immersive::before,
html.motion-calm .rof-immersive::after,
html.motion-calm .rof-immersive__gate{
  animation:none!important;
  will-change:auto!important;
}
html.motion-calm .loader-reel{
  display:none!important;
}
html.motion-calm .loader-logo img{
  animation:logoDevelop 1.6s .12s var(--ease-out) forwards!important;
}
html.motion-calm .rof-immersive{
  opacity:.26!important;
  transform:none!important;
  will-change:auto!important;
}
html.motion-calm .rof-immersive__gate{
  opacity:.24!important;
  box-shadow:inset 0 0 34px rgba(214,173,99,.018)!important;
}
html.motion-calm .frame-card-bg,
html.motion-calm .emo-bg,
html.motion-calm .cat-card-img,
html.motion-calm .portfolio-thumb,
html.motion-calm .lens-still-img,
html.motion-calm .hero-montage,
html.motion-calm .about-hero-bg,
html.motion-calm .svc-hero-bg{
  transform:none!important;
  will-change:auto!important;
}
html.motion-calm nav{
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
}
html.motion-calm .portfolio-play,
html.motion-calm .frame-play,
html.motion-calm .reel-player-play,
html.motion-calm .imglb-nav{
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
}
html.motion-calm .flare,
html.motion-calm .scan-line,
html.motion-calm .team-aperture svg,
html.motion-calm .map-pin-dot,
html.motion-calm .map-pin-ring,
html.motion-calm .map-pin-ring2,
html.motion-calm .live-d,
html.motion-calm .filmstrip-track,
html.motion-calm .slide-row,
html.motion-calm .contact-left::before,
html.motion-calm .svc-hero-media,
html.motion-calm .service-visual,
html.motion-calm .deck-card,
html.motion-calm .team-card,
html.motion-calm .value-card,
html.motion-calm .outcome,
html.motion-calm .step{
  animation:none!important;
  will-change:auto!important;
}
html.motion-calm .slide-row,
html.motion-calm .filmstrip-track{
  transform:none!important;
}
/* Hard performance ceiling for calm mode. */
html.motion-calm *,
html.motion-calm *::before,
html.motion-calm *::after{
  animation:none!important;
  animation-delay:0s!important;
  animation-duration:0s!important;
  animation-iteration-count:1!important;
  scroll-behavior:auto!important;
}
html.motion-calm .loader-logo img{
  animation:logoDevelop 1.2s .08s var(--ease-out) forwards!important;
}
html.motion-calm .loader-frame,
html.motion-calm .loader-status,
html.motion-calm .loader-bottom,
html.motion-calm .loader-sub,
html.motion-calm .loader-bar-wrap{
  opacity:1!important;
}
html.motion-calm .loader-rule{
  width:min(260px,58vw)!important;
}
html.motion-calm .ambient,
html.motion-calm .rof-immersive,
html.motion-calm .rof-bg-canvas{
  display:none!important;
}
/* Calm mode visibility restore: content that used to rely on intro animations. */
html.motion-calm .hero-scene,
html.motion-calm .hero-sub,
html.motion-calm .hero-actions,
html.motion-calm .breath-morph .w,
html.motion-calm .breath .scene-mark,
html.motion-calm .breath-sub,
html.motion-calm .frame-card,
html.motion-calm .emo-card,
html.motion-calm .pstep,
html.motion-calm .reveal,
html.motion-calm .reveal-stagger > *,
html.motion-calm .timeline-content,
html.motion-calm .value-card,
html.motion-calm .team-card,
html.motion-calm .outcome,
html.motion-calm .step,
html.motion-calm .cat-card,
html.motion-calm .portfolio-item,
html.motion-calm .eg-item,
html.motion-calm .svc-hero-eyebrow,
html.motion-calm .svc-hero h1,
html.motion-calm .svc-hero-sub{
  opacity:1!important;
  transform:none!important;
}
html.motion-calm .hero h1 .ln span{
  opacity:1!important;
  transform:none!important;
}
html.motion-calm .hero-cue{
  opacity:1!important;
  transform:translateX(-50%)!important;
}
html.motion-calm .float-call.show{
  opacity:1!important;
  transform:scale(1)!important;
}
/* Typographic correction: the word "is" should read as sentence text, not a faded placeholder. */
.typo h2 .dim,
html.motion-calm .typo h2 .dim{
  color:var(--ink,#0a0805)!important;
  opacity:1!important;
  filter:none!important;
  text-shadow:none!important;
}
/* Calm mode exception: keep the cinematic page-transition slate alive. */
html.motion-calm .page-fade{
  display:block!important;
  opacity:1;
  transition:opacity .55s cubic-bezier(.7,0,.2,1)!important;
  animation:none!important;
}
html.motion-calm .page-fade.gone{
  opacity:0!important;
  pointer-events:none!important;
}
html.motion-calm .page-fade.cut{
  opacity:1!important;
  pointer-events:all!important;
}
html.motion-calm .pf-slate{
  opacity:0!important;
  transform:translate(-50%,-50%) scale(.92)!important;
  transition:opacity .3s ease,transform .4s cubic-bezier(.7,0,.2,1)!important;
  animation:none!important;
}
html.motion-calm .page-fade.cut .pf-slate{
  opacity:1!important;
  transform:translate(-50%,-50%) scale(1)!important;
}
html.motion-calm .pf-label{
  opacity:0!important;
  transition:opacity .35s .18s ease!important;
  animation:none!important;
}
html.motion-calm .page-fade.cut .pf-label{
  opacity:1!important;
}
html.motion-calm .pf-arm{
  transform-box:fill-box!important;
  transform-origin:8% 90%!important;
  transform:rotate(-26deg)!important;
}
html.motion-calm .page-fade.cut .pf-arm{
  animation:pfClap .5s .12s cubic-bezier(.5,0,.3,1.4) forwards!important;
}
/* Dynamic transition pass: lightweight film wipe + slate clap, independent of background motion. */
@keyframes rofCutBloom{
  0%{opacity:0;transform:translate3d(-120%,0,0) skewX(-14deg);}
  34%{opacity:.72;}
  100%{opacity:0;transform:translate3d(120%,0,0) skewX(-14deg);}
}
@keyframes rofSlatePop{
  0%{opacity:0;transform:translate(-50%,-46%) scale(.86);filter:blur(6px);}
  42%{opacity:1;transform:translate(-50%,-50%) scale(1.035);filter:blur(0);}
  100%{opacity:1;transform:translate(-50%,-50%) scale(1);filter:blur(0);}
}
@keyframes rofLabelLift{
  0%{opacity:0;transform:translate(-50%,12px);}
  100%{opacity:1;transform:translate(-50%,0);}
}
@keyframes rofClapLive{
  0%{transform:rotate(-28deg);}
  46%{transform:rotate(7deg);}
  68%{transform:rotate(-4deg);}
  100%{transform:rotate(0deg);}
}
html.motion-calm .page-fade::before{
  content:"";
  position:absolute;
  inset:-18% -28%;
  pointer-events:none;
  opacity:0;
  background:linear-gradient(100deg,transparent 34%,rgba(232,185,122,.18),rgba(244,241,234,.34),rgba(232,185,122,.12),transparent 66%);
  transform:translate3d(-120%,0,0) skewX(-14deg);
  animation:none!important;
}
html.motion-calm .page-fade.cut::before{
  animation:rofCutBloom .95s cubic-bezier(.16,1,.3,1) forwards!important;
}
html.motion-calm .page-fade.cut .pf-slate{
  animation:rofSlatePop .46s .08s cubic-bezier(.16,1,.3,1) both!important;
  transition:none!important;
}
html.motion-calm .page-fade.cut .pf-label{
  animation:rofLabelLift .38s .34s cubic-bezier(.16,1,.3,1) both!important;
  transition:none!important;
}
html.motion-calm .page-fade.cut .pf-arm{
  animation:rofClapLive .62s .18s cubic-bezier(.5,0,.3,1.35) forwards!important;
}
/* Transition state fix: hidden always beats cut, and hidden slate pieces cannot linger. */
html.motion-calm .page-fade.gone,
html.motion-calm .page-fade.gone.cut{
  opacity:0!important;
  pointer-events:none!important;
}
html.motion-calm .page-fade.gone::before,
html.motion-calm .page-fade.gone.cut::before,
html.motion-calm .page-fade.gone .pf-slate,
html.motion-calm .page-fade.gone.cut .pf-slate,
html.motion-calm .page-fade.gone .pf-label,
html.motion-calm .page-fade.gone.cut .pf-label,
html.motion-calm .page-fade.gone .pf-arm,
html.motion-calm .page-fade.gone.cut .pf-arm{
  animation:none!important;
}
html.motion-calm .page-fade.gone .pf-slate,
html.motion-calm .page-fade.gone.cut .pf-slate,
html.motion-calm .page-fade.gone .pf-label,
html.motion-calm .page-fade.gone.cut .pf-label{
  opacity:0!important;
}
/* Slate transition rebuild: data-state controls visibility; CSS arm avoids SVG clipping. */
html.motion-calm .page-fade{
  opacity:0!important;
  pointer-events:none!important;
}
html.motion-calm .page-fade[data-state="cut"]{
  opacity:1!important;
  pointer-events:all!important;
}
html.motion-calm .page-fade[data-state="hidden"],
html.motion-calm .page-fade:not([data-state="cut"]){
  opacity:0!important;
  pointer-events:none!important;
}
html.motion-calm .pf-slate{
  overflow:visible!important;
  width:min(76vw,420px)!important;
  aspect-ratio:200/150;
}
html.motion-calm .pf-slate svg{
  overflow:visible!important;
}
html.motion-calm .pf-arm{
  opacity:0!important;
}
html.motion-calm .pf-slate::before{
  content:"";
  position:absolute;
  left:7%;
  top:4%;
  width:86%;
  height:16%;
  border:1.5px solid #c9a05a;
  border-radius:5px;
  background:
    linear-gradient(90deg,rgba(10,8,5,.98),rgba(10,8,5,.92)),
    repeating-linear-gradient(115deg,#c9a05a 0 18px,transparent 18px 38px);
  box-shadow:0 12px 22px rgba(0,0,0,.34);
  transform-origin:5% 100%;
  transform:rotate(-29deg);
  opacity:0;
  z-index:2;
}
html.motion-calm .pf-slate::after{
  content:"";
  position:absolute;
  left:8.5%;
  top:20.5%;
  width:13px;
  height:13px;
  border-radius:999px;
  background:#c9a05a;
  box-shadow:0 0 0 2px rgba(10,8,5,.75);
  opacity:0;
  z-index:3;
}
@keyframes rofCssClap{
  0%{opacity:1;transform:rotate(-31deg);}
  42%{opacity:1;transform:rotate(6deg);}
  62%{opacity:1;transform:rotate(-5deg);}
  100%{opacity:1;transform:rotate(0deg);}
}
@keyframes rofSlateBodyIn{
  0%{opacity:0;transform:translate(-50%,-44%) scale(.88);}
  100%{opacity:1;transform:translate(-50%,-50%) scale(1);}
}
html.motion-calm .page-fade[data-state="cut"] .pf-slate{
  opacity:1!important;
  transform:translate(-50%,-50%) scale(1)!important;
  animation:rofSlateBodyIn .32s cubic-bezier(.16,1,.3,1) both!important;
}
html.motion-calm .page-fade[data-state="cut"] .pf-slate::before{
  animation:rofCssClap .72s .16s cubic-bezier(.45,0,.25,1.35) forwards!important;
}
html.motion-calm .page-fade[data-state="cut"] .pf-slate::after{
  opacity:1!important;
}
html.motion-calm .page-fade[data-state="cut"] .pf-label{
  opacity:1!important;
  animation:rofLabelLift .38s .34s cubic-bezier(.16,1,.3,1) both!important;
}
html.motion-calm .page-fade[data-state="hidden"] .pf-slate,
html.motion-calm .page-fade[data-state="hidden"] .pf-slate::before,
html.motion-calm .page-fade[data-state="hidden"] .pf-slate::after,
html.motion-calm .page-fade[data-state="hidden"] .pf-label{
  opacity:0!important;
  animation:none!important;
}
/* Slate transition fix: restart clap only after the overlay becomes visible. */
html.motion-calm .page-fade.cut[data-state="cut"]{
  opacity:1!important;
  pointer-events:all!important;
}
html.motion-calm .page-fade.cut[data-state="cut"] .pf-slate{
  opacity:1!important;
  top:50%!important;
  left:50%!important;
  overflow:visible!important;
  transform:translate(-50%,-50%) scale(1)!important;
  animation-name:rofSlateBodyIn!important;
  animation-duration:.32s!important;
  animation-delay:0s!important;
  animation-timing-function:cubic-bezier(.16,1,.3,1)!important;
  animation-fill-mode:both!important;
}
html.motion-calm .page-fade.cut[data-state="cut"] .pf-slate::before{
  opacity:1!important;
  transform-origin:5% 100%!important;
  animation-name:rofCssClap!important;
  animation-duration:.72s!important;
  animation-delay:.08s!important;
  animation-timing-function:cubic-bezier(.45,0,.25,1.35)!important;
  animation-fill-mode:forwards!important;
}
html.motion-calm .page-fade.cut[data-state="cut"] .pf-slate::after{
  opacity:1!important;
}
html.motion-calm .page-fade.cut[data-state="cut"] .pf-label{
  opacity:1!important;
  animation-name:rofLabelLift!important;
  animation-duration:.38s!important;
  animation-delay:.3s!important;
  animation-timing-function:cubic-bezier(.16,1,.3,1)!important;
  animation-fill-mode:both!important;
}
@media (max-width: 700px){
  html.motion-calm .pf-slate{
    width:min(82vw,340px)!important;
  }
  html.motion-calm .pf-label{
    font-size:clamp(18px,5.2vw,26px)!important;
  }
}

/* Rendering budget: defer deep sections until the visitor scrolls near them. */
section:not(.hero):not(.about-hero):not(.svc-hero):not(.work-hero):not(.deck-hero),
.manifesto,
.count-bar,
.portfolio-grid,
footer{
  content-visibility:auto;
  contain-intrinsic-size:auto 900px;
}

footer{
  contain-intrinsic-size:auto 260px;
}

/* Lightweight per-page background motion. Driven by scroll/pointer transforms in motion-upgrade.js. */
body.rof-parallax-ready{
  --rof-page-accent:214,173,99;
  --rof-page-rust:138,51,36;
  --rof-scroll-progress:0;
  --rof-parallax-y:0px;
  --rof-parallax-tilt:0deg;
  --rof-pointer-drift-x:0px;
  --rof-pointer-drift-y:0px;
}

body.rof-parallax-ready[data-rof-page="about"]{
  --rof-page-accent:224,183,112;
  --rof-page-rust:112,66,48;
}

body.rof-parallax-ready[data-rof-page="services"]{
  --rof-page-accent:201,160,90;
  --rof-page-rust:150,62,42;
}

body.rof-parallax-ready[data-rof-page="work"],
body.rof-parallax-ready[data-rof-page="gallery"]{
  --rof-page-accent:232,185,122;
  --rof-page-rust:126,43,34;
}

body.rof-parallax-ready[data-rof-page="contact"]{
  --rof-page-accent:210,170,100;
  --rof-page-rust:95,60,54;
}

.rof-parallax-scene{
  position:fixed;
  inset:-10vh -8vw;
  z-index:0;
  pointer-events:none;
  overflow:hidden;
  opacity:.62;
  contain:layout paint style;
  transform:translate3d(0,var(--rof-parallax-y,0px),0);
}

.rof-parallax-layer{
  position:absolute;
  inset:0;
  display:block;
  will-change:transform,opacity;
}

.rof-parallax-layer--beam{
  inset:-18% -22%;
  background:
    radial-gradient(780px circle at calc(24% + var(--rof-pointer-drift-x,0px)) calc(18% + var(--rof-pointer-drift-y,0px)),rgba(var(--rof-page-accent),.16),transparent 58%),
    radial-gradient(620px circle at calc(78% - var(--rof-pointer-drift-x,0px)) calc(76% - var(--rof-pointer-drift-y,0px)),rgba(var(--rof-page-rust),.11),transparent 62%),
    linear-gradient(108deg,transparent 18%,rgba(var(--rof-page-accent),.04) 42%,rgba(244,241,234,.07) 50%,rgba(var(--rof-page-rust),.035) 58%,transparent 78%);
  transform:translate3d(calc(var(--rof-pointer-drift-x,0px) * .35),calc(var(--rof-parallax-y,0px) * -.45 + var(--rof-pointer-drift-y,0px) * .2),0) rotate(calc(-2deg + var(--rof-parallax-tilt,0deg) * .2));
  mix-blend-mode:screen;
}

.rof-parallax-layer--gate{
  inset:8vh 6vw;
  border:1px solid rgba(var(--rof-page-accent),.10);
  background:
    linear-gradient(90deg,rgba(var(--rof-page-accent),.08) 1px,transparent 1px),
    linear-gradient(180deg,rgba(244,241,234,.035) 1px,transparent 1px);
  background-size:clamp(58px,7vw,104px) clamp(58px,7vw,104px);
  mask-image:radial-gradient(ellipse at 50% 48%,#000 0 42%,transparent 76%);
  opacity:.58;
  transform:translate3d(calc(var(--rof-pointer-drift-x,0px) * -.12),calc(var(--rof-parallax-y,0px) * -.18),0) scale(calc(1 + var(--rof-scroll-progress,0) * .025));
}

.rof-parallax-layer--grain{
  background:
    repeating-linear-gradient(90deg,transparent 0 9vw,rgba(var(--rof-page-accent),.035) 9.05vw,transparent 9.12vw),
    repeating-linear-gradient(180deg,transparent 0 92px,rgba(244,241,234,.020) 93px,transparent 94px);
  opacity:.36;
  transform:translate3d(calc(var(--rof-pointer-drift-x,0px) * .08),calc(var(--rof-parallax-y,0px) * -.65),0);
}

body.rof-parallax-ready > nav,
body.rof-parallax-ready > section,
body.rof-parallax-ready > footer,
body.rof-parallax-ready > .contact-page,
body.rof-parallax-ready > .manifesto,
body.rof-parallax-ready > .count-bar,
body.rof-parallax-ready > .portfolio-grid,
body.rof-parallax-ready > .deck-section{
  position:relative;
  z-index:1;
}

.rof-parallax-ready .work-hero::before,
.rof-parallax-ready .deck-hero::before,
.rof-parallax-ready .contact-left::before{
  transform:translate3d(0,calc(var(--hero-parallax,0) * -10px),0) scale(1.03);
  transform-origin:center;
}

.rof-parallax-ready .about-hero-bg,
.rof-parallax-ready .svc-hero-bg,
.rof-parallax-ready .hero-montage{
  transition:transform .12s linear;
}

@media(max-width:700px){
  .rof-parallax-scene{
    inset:-6vh -12vw;
    opacity:.42;
  }
  .rof-parallax-layer--gate{
    inset:9vh 4vw;
    background-size:54px 54px;
  }
}

@media(prefers-reduced-motion:reduce){
  .rof-parallax-scene{
    display:none!important;
  }
}

/* Cross-device tuning: final overrides shared by every page. */
html{
  -webkit-text-size-adjust:100%;
  text-size-adjust:100%;
  touch-action:manipulation;
}

body{
  min-height:100svh;
}

:where(a,button,input,select,textarea){
  touch-action:manipulation;
}

:where(button,a,.filter-btn,.nav-toggle,.deck-arrow,.submit-btn,.footer-top,.footer-back,.float-call){
  -webkit-tap-highlight-color:rgba(201,160,90,.22);
}

:where(input,select,textarea){
  font-size:16px!important;
}

:where(img,video,iframe,canvas,svg){
  max-width:100%;
}

:where(.hero,.about-hero,.svc-hero,.work-hero,.deck-hero,.contact-page){
  min-height:min(100svh,820px);
}

:where(.hero-inner,.about-hero-content,.svc-hero-inner,.work-hero,.deck-hero,.section-header,.frames-head,.emotion-head,.process-head,.team-header,.timeline-header,.outcomes-head,.cats-head){
  width:min(100%,1180px);
}

:where(.portfolio-grid,.values-grid,.team-grid,.outcomes-grid,.cats-grid,.process-steps,.contact-blocks){
  min-width:0;
}

:where(.portfolio-item,.cat-card,.frame-card,.emo-card,.deck-card,.value-card,.team-card,.outcome,.step,.contact-block){
  min-width:0;
}

:where(.portfolio-thumb,.cat-card-img,.frame-card-bg,.emo-bg,.lens-still-img,.about-hero-bg,.svc-hero-bg){
  background-position:center;
}

.lightbox,
.imglb{
  padding:max(1rem,env(safe-area-inset-top)) max(1rem,env(safe-area-inset-right)) max(1rem,env(safe-area-inset-bottom)) max(1rem,env(safe-area-inset-left));
}

@media(max-width:1180px){
  nav#nav{
    padding-left:clamp(.9rem,2vw,1.4rem)!important;
    padding-right:clamp(.9rem,2vw,1.4rem)!important;
  }
  nav#nav .brand img{
    max-width:clamp(120px,16vw,170px)!important;
  }
  .nav-links{
    gap:clamp(.65rem,1.25vw,1.1rem)!important;
  }
  .nav-links a{
    font-size:.76rem!important;
  }
}

@media(max-width:900px){
  body{
    overflow-x:hidden;
  }
  nav#nav{
    height:72px!important;
    grid-template-columns:1fr auto!important;
    padding-left:max(1rem,env(safe-area-inset-left))!important;
    padding-right:max(1rem,env(safe-area-inset-right))!important;
  }
  nav#nav.scrolled{
    height:64px!important;
  }
  nav#nav .brand img{
    max-width:132px!important;
    max-height:46px!important;
  }
  .nav-right,
  .nav-zone-right{
    justify-self:end!important;
  }
  .nav-time,
  .nav-cta{
    display:none!important;
  }
  .nav-toggle{
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    min-width:44px!important;
    min-height:44px!important;
  }
  .nav-links,
  .nav-zone-center .nav-links{
    position:fixed!important;
    left:0!important;
    right:0!important;
    top:72px!important;
    display:none!important;
    grid-template-columns:1fr!important;
    max-height:calc(100svh - 72px)!important;
    overflow-y:auto!important;
    overscroll-behavior:contain;
    padding:1rem max(1rem,env(safe-area-inset-right)) 1.2rem max(1rem,env(safe-area-inset-left))!important;
    gap:0!important;
    background:rgba(8,7,5,.98)!important;
    border-bottom:1px solid rgba(201,160,90,.2)!important;
  }
  nav#nav.scrolled .nav-links{
    top:64px!important;
    max-height:calc(100svh - 64px)!important;
  }
  .nav-links.open,
  .nav-links.mobile-open{
    display:grid!important;
  }
  .nav-links a{
    display:flex!important;
    align-items:center!important;
    min-height:48px!important;
    padding:.95rem .35rem!important;
    border-bottom:1px solid rgba(201,160,90,.12)!important;
    white-space:normal!important;
  }
  .hero,
  .about-hero,
  .svc-hero,
  .work-hero,
  .deck-hero{
    min-height:auto!important;
    padding-top:calc(72px + 2.4rem)!important;
    padding-bottom:3.5rem!important;
    padding-left:1.2rem!important;
    padding-right:1.2rem!important;
  }
  .hero::after,
  .about-hero::after,
  .svc-hero::after,
  .work-hero::after,
  .deck-hero::after{
    inset:calc(72px + .75rem) .75rem .75rem!important;
  }
  .hero-inner,
  .about-hero-content,
  .svc-hero-inner,
  .work-hero,
  .deck-hero{
    width:100%!important;
    max-width:100%!important;
    padding-left:0!important;
    padding-right:0!important;
  }
  .hero h1,
  .about-hero h1,
  .svc-hero h1,
  .work-hero h1,
  .deck-title,
  .contact-title{
    line-height:1!important;
    max-width:12ch!important;
  }
  .hero-sub,
  .about-hero-sub,
  .svc-hero-sub,
  .work-hero-sub,
  .deck-sub{
    max-width:62ch!important;
  }
  .breath,
  .qbreath,
  .lens,
  .frames,
  .emotion,
  .typo,
  .process,
  .begin,
  .timeline-section,
  .values-section,
  .team-section,
  .location-section,
  .outcomes,
  .cats,
  .deck-section,
  .manifesto{
    padding-left:1.25rem!important;
    padding-right:1.25rem!important;
  }
  .portfolio-grid,
  .values-grid,
  .team-grid,
  .outcomes-grid,
  .cats-grid,
  .process-steps,
  .contact-blocks{
    grid-template-columns:1fr!important;
  }
  .lens,
  .contact-page{
    grid-template-columns:1fr!important;
  }
  .lightbox-inner{
    width:92vw!important;
    max-width:92vw!important;
    max-height:82svh!important;
  }
}

@media(max-width:620px){
  html{
    scroll-padding-top:68px;
  }
  body{
    font-size:15px;
  }
  nav#nav{
    height:68px!important;
  }
  nav#nav.scrolled{
    height:62px!important;
  }
  nav#nav .brand img{
    max-width:112px!important;
    max-height:40px!important;
  }
  .nav-links,
  .nav-zone-center .nav-links{
    top:68px!important;
    max-height:calc(100svh - 68px)!important;
  }
  nav#nav.scrolled .nav-links{
    top:62px!important;
    max-height:calc(100svh - 62px)!important;
  }
  .hero,
  .about-hero,
  .svc-hero,
  .work-hero,
  .deck-hero{
    padding-top:calc(68px + 1.65rem)!important;
    padding-bottom:3rem!important;
    padding-left:1rem!important;
    padding-right:1rem!important;
  }
  .hero::after,
  .about-hero::after,
  .svc-hero::after,
  .work-hero::after,
  .deck-hero::after{
    display:none!important;
  }
  .hero-actions,
  .begin-actions,
  .contact-actions{
    display:grid!important;
    grid-template-columns:1fr!important;
    width:100%!important;
    gap:.75rem!important;
  }
  .btn-primary,
  .btn-ghost,
  .btn-dark,
  .lens-cta,
  .location-cta,
  .submit-btn{
    width:100%!important;
    min-height:48px!important;
    justify-content:center!important;
    text-align:center!important;
  }
  .scene-mark{
    letter-spacing:.16em!important;
    gap:.65rem!important;
  }
  .scene-mark::before{
    width:28px!important;
  }
  .portfolio-item,
  .cat-card,
  .emo-card{
    width:100%!important;
    max-width:100%!important;
    justify-self:stretch!important;
    min-height:320px!important;
  }
  .portfolio-grid > .portfolio-item{
    max-width:calc(100vw - 2rem)!important;
  }
  .frame-card{
    min-height:380px!important;
    margin-left:0!important;
    margin-right:0!important;
  }
  .count-bar{
    grid-template-columns:1fr!important;
    text-align:center!important;
  }
  .filter-bar{
    margin-left:-1rem!important;
    margin-right:-1rem!important;
    padding-left:1rem!important;
    padding-right:1rem!important;
    overflow-x:auto!important;
    -webkit-overflow-scrolling:touch;
    scroll-snap-type:x proximity;
  }
  .filter-btn{
    flex:0 0 auto!important;
    min-height:44px!important;
    scroll-snap-align:start;
  }
  .deck-stage{
    min-height:360px!important;
  }
  .deck-card{
    width:min(84vw,320px)!important;
  }
  .deck-ui{
    width:100%!important;
    justify-content:center!important;
    gap:.85rem!important;
  }
  .deck-arrow{
    min-width:44px!important;
    min-height:44px!important;
  }
  .contact-left,
  .contact-right{
    padding:3.4rem 1rem!important;
  }
  .contact-form input,
  .contact-form textarea,
  .contact-form select{
    min-height:48px;
  }
  .lightbox-inner{
    width:94vw!important;
    max-width:94vw!important;
    height:auto!important;
    max-height:82svh!important;
  }
  .lightbox-close{
    min-height:44px!important;
  }
  .float-call{
    right:max(.85rem,env(safe-area-inset-right))!important;
    bottom:max(.85rem,env(safe-area-inset-bottom))!important;
  }
  footer{
    padding-bottom:calc(5rem + env(safe-area-inset-bottom))!important;
  }
  .rof-parallax-scene{
    opacity:.22!important;
  }
  .rof-parallax-layer--grain{
    display:none!important;
  }
}

@media(max-width:380px){
  .hero h1,
  .about-hero h1,
  .svc-hero h1,
  .work-hero h1,
  .deck-title,
  .contact-title{
    max-width:11ch!important;
  }
  .nav-links a{
    min-height:46px!important;
  }
  .portfolio-title{
    font-size:1.32rem!important;
  }
}

@media(max-height:560px) and (orientation:landscape){
  nav#nav{
    height:60px!important;
  }
  nav#nav.scrolled{
    height:56px!important;
  }
  .nav-links{
    top:60px!important;
    max-height:calc(100svh - 60px)!important;
  }
  .hero,
  .about-hero,
  .svc-hero,
  .work-hero,
  .deck-hero{
    padding-top:calc(60px + 1rem)!important;
    padding-bottom:2rem!important;
  }
  .hero h1,
  .about-hero h1,
  .svc-hero h1,
  .work-hero h1,
  .deck-title,
  .contact-title{
    font-size:clamp(2.15rem,6.6vw,4.2rem)!important;
    line-height:.94!important;
    max-width:16ch!important;
  }
  .hero-sub,
  .about-hero-sub,
  .svc-hero-sub,
  .work-hero-sub,
  .deck-sub{
    max-width:70ch!important;
  }
  .contact-page{
    min-height:auto!important;
  }
  .contact-left,
  .contact-right{
    padding-top:calc(60px + 1rem)!important;
    padding-bottom:2rem!important;
  }
  .hero-actions,
  .begin-actions{
    margin-top:1.25rem!important;
  }
  .float-call{
    width:46px!important;
    height:46px!important;
  }
}

html.motion-calm .rof-parallax-ready .hero-montage,
html.motion-calm .rof-parallax-ready .about-hero-bg,
html.motion-calm .rof-parallax-ready .svc-hero-bg{
  transform:translate3d(0,var(--hero-drift,0px),0)!important;
}

@media(pointer:coarse){
  .cursor-dot,
  .cursor-ring{
    display:none!important;
  }
  .frame-card,
  .portfolio-item,
  .cat-card,
  .deck-card,
  .team-avatar-placeholder,
  .lens-still{
    animation:none!important;
    transform:none!important;
  }
  .portfolio-item:hover .portfolio-thumb,
  .cat-card:hover .cat-card-img{
    transform:none!important;
  }
}

@media(prefers-reduced-data:reduce){
  .rof-parallax-scene,
  .rof-immersive,
  .ambient,
  .grain{
    display:none!important;
  }
  .portfolio-thumb,
  .cat-card-img,
  .frame-card-bg,
  .emo-bg,
  .lens-still-img{
    filter:none!important;
  }
}

/* Mobile nav reliability: support both page handlers and keep the drawer above media layers. */
@media(max-width:1040px){
  nav#nav .nav-links,
  nav#nav .nav-zone-center .nav-links{
    z-index:260!important;
  }
  nav#nav .nav-links.open,
  nav#nav .nav-links.mobile-open,
  nav#nav .nav-zone-center.open .nav-links{
    display:grid!important;
  }
}

/* Mobile nav hard fix: the button was toggling, but the drawer could remain hidden behind the hero/header stack on phones. */
@media(max-width:1040px){
  html body nav#nav{
    overflow:visible!important;
    z-index:10000!important;
  }
  html body nav#nav .nav-links,
  html body nav#nav .nav-zone-center .nav-links{
    position:fixed!important;
    left:0!important;
    right:0!important;
    top:68px!important;
    width:100vw!important;
    max-height:calc(100svh - 68px)!important;
    overflow-y:auto!important;
    display:none!important;
    grid-template-columns:1fr!important;
    gap:0!important;
    margin:0!important;
    padding:1.1rem max(1.15rem,env(safe-area-inset-right)) calc(1.4rem + env(safe-area-inset-bottom)) max(1.15rem,env(safe-area-inset-left))!important;
    list-style:none!important;
    background:linear-gradient(180deg,rgba(8,7,5,.995),rgba(10,8,5,.975))!important;
    border-top:1px solid rgba(201,160,90,.18)!important;
    border-bottom:1px solid rgba(201,160,90,.28)!important;
    box-shadow:0 22px 38px rgba(0,0,0,.52)!important;
    opacity:1!important;
    visibility:visible!important;
    transform:none!important;
    pointer-events:auto!important;
    z-index:10001!important;
  }
  html body nav#nav .nav-links.open,
  html body nav#nav .nav-links.mobile-open,
  html body nav#nav .nav-zone-center.open .nav-links{
    display:grid!important;
  }
  html body nav#nav .nav-links li{
    display:block!important;
    margin:0!important;
  }
  html body nav#nav .nav-links a{
    display:flex!important;
    align-items:center!important;
    width:100%!important;
    min-height:54px!important;
    padding:1rem .1rem!important;
    color:#f4f1ea!important;
    border-bottom:1px solid rgba(201,160,90,.16)!important;
    opacity:1!important;
    visibility:visible!important;
  }
}

@media(max-width:620px){
  html body nav#nav .nav-links,
  html body nav#nav .nav-zone-center .nav-links{
    top:68px!important;
    max-height:calc(100svh - 68px)!important;
  }
  html body nav#nav.scrolled .nav-links,
  html body nav#nav.scrolled .nav-zone-center .nav-links{
    top:62px!important;
    max-height:calc(100svh - 62px)!important;
  }
}

/* Mobile prints deck: keep the photograph stack inside the viewport. */
@media(max-width:700px){
  html body .deck-section{
    overflow:hidden!important;
    align-items:center!important;
    padding-left:1rem!important;
    padding-right:1rem!important;
  }
  html body .deck-stage{
    width:min(84vw,330px)!important;
    height:auto!important;
    min-height:0!important;
    aspect-ratio:4/5.9!important;
    margin-left:auto!important;
    margin-right:auto!important;
    perspective:1100px!important;
  }
  html body .deck{
    position:absolute!important;
    inset:0!important;
  }
  html body .deck-card{
    width:100%!important;
    max-width:100%!important;
  }
  html body .deck-ui{
    width:100%!important;
    justify-content:center!important;
    position:relative!important;
    z-index:3!important;
  }
}