@font-face{font-family:"Instrument Serif";src:url(../fonts/instrument-serif-latin-400-normal.woff2) format("woff2");font-display:swap}
@font-face{font-family:"Instrument Serif";src:url(../fonts/instrument-serif-latin-400-italic.woff2) format("woff2");font-style:italic;font-display:swap}
@font-face{font-family:"Inter Tight";src:url(../fonts/inter-tight-latin-wght-normal.woff2) format("woff2");font-weight:100 900;font-display:swap}

:root{
  --dusk:#121521; --dusk-2:#1B2031; --ink:#F3EEE4; --ink-2:rgb(243 238 228 / .68); --ink-3:rgb(243 238 228 / .42);
  --lamp:#F4C46B; --sand:#C9A876; --moss:#8FA36B; --clay:#3B2A22;
  --serif:"Instrument Serif",Georgia,serif; --sans:"Inter Tight",system-ui,sans-serif;
  --gut:clamp(16px,4.4vw,64px);
}
/* engine theme */
.sw-root{--sw-bg:#121521;--sw-ink:#F3EEE4;--sw-ink-soft:rgb(243 238 228 / .7);--sw-accent:#F4C46B;--sw-font-display:var(--serif);--sw-font-body:var(--sans)}
html,body{background:var(--dusk)}
body{margin:0;color:var(--ink);font:400 clamp(16px,1.05vw,18px)/1.6 var(--sans);-webkit-font-smoothing:antialiased}
a{color:inherit}
img{display:block;max-width:100%;height:auto}
.skip{position:fixed;left:-999px;top:10px;z-index:200;background:var(--lamp);color:var(--dusk);padding:.6rem 1rem;border-radius:99px}
.skip:focus{left:10px}
:focus-visible{outline:2px solid var(--lamp);outline-offset:3px}
em{font-family:var(--serif);font-style:italic;color:var(--lamp)}

/* own header (engine topbar unused) */
.sw-topbar{display:none!important}
.bar{position:fixed;inset:0 0 auto;z-index:120;display:flex;justify-content:space-between;align-items:center;padding:clamp(14px,2.2vw,26px) var(--gut);pointer-events:none;mix-blend-mode:difference}
.bar a{pointer-events:auto}
.logo{display:flex;align-items:center;gap:.6rem;text-decoration:none;color:#fff;font:400 1.6rem/1 var(--serif);letter-spacing:-.01em}
.logo svg{width:26px;height:26px;fill:none;stroke:#fff;stroke-width:1.4;stroke-linecap:round}
.bar-cta{color:#fff;text-decoration:none;font:500 .82rem/1 var(--sans);letter-spacing:.08em;text-transform:uppercase;border:1px solid rgb(255 255 255 / .6);padding:.85rem 1.2rem;border-radius:99px;transition:background .3s,color .3s}
.bar-cta:hover{background:#fff;color:#000}

/* film chrome */
.sw-copylayer::before{width:min(70vw,1000px);background:linear-gradient(90deg,rgb(8 10 18 / .88) 0%,rgb(8 10 18 / .66) 38%,rgb(8 10 18 / .25) 68%,transparent 100%)}
.sw-copy{width:min(44vw,560px)}
.sw-copy__num{font:500 .72rem/1 var(--sans);letter-spacing:.2em;color:var(--lamp)}
.sw-copy__eyebrow{font:500 .76rem/1.2 var(--sans)!important;letter-spacing:.22em!important;color:var(--ink-2)!important}
.sw-copy__title{font-family:var(--serif)!important;font-weight:400!important;font-size:clamp(2.8rem,6.2vw,6rem)!important;line-height:.92!important;letter-spacing:-.02em!important;text-shadow:0 4px 40px rgb(0 0 0 / .45)!important}
.sw-copy__body{color:rgb(243 238 228 / .88)!important;text-shadow:0 1px 16px rgb(0 0 0 / .6)!important}
.sw-copy__tags li{background:rgb(243 238 228 / .08)!important;color:var(--ink)!important;border-color:rgb(243 238 228 / .22)!important;backdrop-filter:blur(8px);font-weight:500!important}
.sw-btn--primary{background:var(--lamp)!important;color:var(--dusk)!important}
.sw-btn--ghost{color:var(--ink)!important;border-color:rgb(243 238 228 / .4)!important}
.sw-route__label{background:rgb(18 21 33 / .7)!important;color:var(--ink)!important}
.sw-hint{color:var(--ink-2)!important}
.sw-hint i{border-color:rgb(243 238 228 / .5)!important}
.sw-scene__video,.sw-scene__still{filter:saturate(1.06) contrast(1.04)}

.clock{position:fixed;right:var(--gut);bottom:clamp(18px,3vh,30px);z-index:45;display:grid;gap:.35rem;justify-items:end;text-align:right;font:500 .72rem/1 var(--sans);letter-spacing:.16em;text-transform:uppercase;color:var(--ink-2);transition:opacity .5s}
.clock-time{font:400 2.4rem/1 var(--serif);letter-spacing:0;color:var(--ink);font-variant-numeric:tabular-nums}
.clock-bar{width:180px;height:1px;background:rgb(243 238 228 / .25);position:relative}
.clock-bar i{position:absolute;inset:0;background:var(--lamp);transform-origin:right;transform:scaleX(0)}
.leak{position:fixed;inset:0;z-index:15;pointer-events:none;mix-blend-mode:screen;opacity:.0;
  background:radial-gradient(80% 60% at 85% 10%,var(--leak,#ffb36b) 0%,transparent 60%)}
.grain{position:fixed;inset:0;z-index:100;pointer-events:none;opacity:.08;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  animation:grain 1s steps(5) infinite}
@keyframes grain{0%{background-position:0 0}25%{background-position:-41px 23px}50%{background-position:27px -49px}75%{background-position:-63px -17px}100%{background-position:0 0}}
body.past-film .clock,body.past-film .sw-route,body.past-film .sw-hint{opacity:0;pointer-events:none}

/* the monograph that slides over the last frame */
.after{position:relative;z-index:70;background:var(--dusk);box-shadow:0 -40px 80px 20px rgb(18 21 33 / .9)}
.after::before{content:"";position:absolute;left:0;right:0;top:-38vh;height:38vh;background:linear-gradient(to bottom,transparent,var(--dusk));pointer-events:none}
.eyebrow{font:500 .74rem/1 var(--sans);letter-spacing:.24em;text-transform:uppercase;color:var(--lamp);margin:0 0 1.6rem;display:flex;align-items:center;gap:.8rem}
.eyebrow::before{content:"";width:28px;height:1px;background:currentColor}
h2{font:400 clamp(2.6rem,6.4vw,6.4rem)/.94 var(--serif);letter-spacing:-.02em;margin:0}

.intro{padding:18vh var(--gut) 16vh;max-width:1400px}
.intro h2{font-size:clamp(2rem,4.4vw,4.6rem);line-height:1.08;letter-spacing:-.015em}
.reveal-words .w{opacity:.16;transition:none}

.services{padding:6vh var(--gut) 14vh;position:relative}
.sec-head{display:flex;justify-content:space-between;align-items:flex-end;gap:2rem;flex-wrap:wrap;margin-bottom:7vh}
.sec-head .eyebrow{margin:0}
.svc-list{list-style:none;margin:0;padding:0;border-top:1px solid rgb(243 238 228 / .18)}
.svc-list a{display:grid;grid-template-columns:5rem 1fr minmax(0,24rem);align-items:baseline;gap:2rem;padding:2.2rem 0;border-bottom:1px solid rgb(243 238 228 / .18);text-decoration:none;position:relative;overflow:hidden}
.svc-list .n{font:500 .78rem/1 var(--sans);letter-spacing:.2em;color:var(--ink-3)}
.svc-list .t{font:400 clamp(2rem,4.6vw,4.4rem)/1 var(--serif);letter-spacing:-.02em;transition:transform .6s cubic-bezier(.2,.8,.2,1),color .4s}
.svc-list .d{color:var(--ink-2);font-size:.98rem}
.svc-list a::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgb(244 196 107 / .1),transparent 60%);transform:scaleX(0);transform-origin:left;transition:transform .6s cubic-bezier(.2,.8,.2,1);z-index:-1}
.svc-list a:hover::after,.svc-list a:focus-visible::after{transform:none}
.svc-list a:hover .t,.svc-list a:focus-visible .t{transform:translateX(1.2rem);color:var(--lamp)}
.svc-peek{position:fixed;left:0;top:0;width:min(30vw,420px);aspect-ratio:16/10;pointer-events:none;z-index:80;opacity:0;transform:translate(-50%,-50%) scale(.85);border-radius:4px;overflow:hidden;box-shadow:0 30px 80px rgb(0 0 0 / .5)}
.svc-peek img{width:100%;height:100%;object-fit:cover}

.year{position:relative}
.year-pin{min-height:100vh;display:flex;flex-direction:column;justify-content:center;padding:10vh 0;overflow:hidden}
.year .sec-head{padding:0 var(--gut)}
.strip{display:flex;gap:clamp(16px,2vw,32px);padding:0 var(--gut);width:max-content}
.strip figure{margin:0;width:min(62vw,820px);flex:none}
.strip img{aspect-ratio:16/9;object-fit:cover;border-radius:3px;filter:saturate(.95)}
.strip figcaption{margin-top:1rem;color:var(--ink-2);max-width:36rem;font-size:.98rem}
.strip b{font:400 1.5rem/1 var(--serif);color:var(--ink);margin-right:.6rem;font-weight:400}

.numbers{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid rgb(243 238 228 / .18);border-bottom:1px solid rgb(243 238 228 / .18);margin:12vh var(--gut)}
.numbers div{padding:4rem 2rem 3rem 0;display:grid;gap:1rem}
.numbers div+div{padding-left:2rem;border-left:1px solid rgb(243 238 228 / .18)}
.numbers .big{font:400 clamp(4rem,9vw,9rem)/.85 var(--serif);color:var(--lamp);font-variant-numeric:tabular-nums}
.numbers .lbl{color:var(--ink-2)}

.walk{display:grid;grid-template-columns:1.1fr minmax(0,30rem);gap:clamp(32px,7vw,120px);padding:14vh var(--gut);align-items:end;
  background:radial-gradient(70% 90% at 20% 100%,rgb(244 196 107 / .14),transparent 70%)}
.walk-copy p{color:var(--ink-2);max-width:32rem}
.contact{font-size:.95rem}
.contact a{color:var(--lamp)}
.walk-form{display:grid;gap:1.4rem}
.walk-form label span{display:block;font:500 .72rem/1 var(--sans);letter-spacing:.18em;text-transform:uppercase;color:var(--ink-3);margin-bottom:.5rem}
.walk-form input,.walk-form textarea{width:100%;box-sizing:border-box;background:transparent;border:0;border-bottom:1px solid rgb(243 238 228 / .35);color:var(--ink);font:400 1.5rem/1.3 var(--serif);padding:.3rem 0 .5rem;border-radius:0;resize:vertical}
.walk-form input:focus,.walk-form textarea:focus{outline:none;border-bottom-color:var(--lamp)}
.walk-form button{justify-self:start;background:var(--lamp);color:var(--dusk);border:0;border-radius:99px;padding:1.05rem 1.6rem;font:600 .86rem/1 var(--sans);letter-spacing:.08em;text-transform:uppercase;cursor:pointer;transition:transform .3s cubic-bezier(.3,1.6,.5,1),box-shadow .3s}
.walk-form button:hover{transform:translateY(-2px);box-shadow:0 12px 40px -10px rgb(244 196 107 / .7)}
.form-msg{color:var(--lamp);min-height:1.2em;margin:0}

.foot{padding:10vh var(--gut) 6vh;border-top:1px solid rgb(243 238 228 / .14)}
.foot .foot-mark{color:transparent;font:400 clamp(5rem,19vw,20rem)/.8 var(--serif);letter-spacing:-.04em;margin:0 0 3rem;
  background:linear-gradient(180deg,var(--ink) 30%,rgb(244 196 107 / .5));-webkit-background-clip:text;background-clip:text;color:transparent}
.foot p{color:var(--ink-3);margin:.4rem 0;font-size:.9rem}
.foot .demo{color:var(--lamp);opacity:.8}

@media (max-width:860px){
  .bar-cta{padding:.7rem .95rem;font-size:.72rem}
  .clock{bottom:auto;top:76px}
  .clock-time{font-size:1.8rem}
  .clock-bar{width:120px}
  .svc-list a{grid-template-columns:3rem 1fr;gap:.6rem 1rem}
  .svc-list .d{grid-column:2}
  .svc-peek{display:none}
  .strip figure{width:82vw}
  .numbers{grid-template-columns:1fr}
  .numbers div+div{padding-left:0;border-left:0;border-top:1px solid rgb(243 238 228 / .18)}
  .walk{grid-template-columns:1fr}
}
@media (prefers-reduced-motion:reduce){
  .grain{animation:none}
  .reveal-words .w{opacity:1}
}