@font-face{font-family:'Syne';font-weight:600;font-display:swap;src:url(../fonts/syne-latin-600-normal.woff2) format('woff2')}
@font-face{font-family:'Syne';font-weight:700;font-display:swap;src:url(../fonts/syne-latin-700-normal.woff2) format('woff2')}
@font-face{font-family:'Syne';font-weight:800;font-display:swap;src:url(../fonts/syne-latin-800-normal.woff2) format('woff2')}
@font-face{font-family:'Inter';font-weight:400;font-display:swap;src:url(../fonts/inter-latin-400-normal.woff2) format('woff2')}
@font-face{font-family:'Inter';font-weight:500;font-display:swap;src:url(../fonts/inter-latin-500-normal.woff2) format('woff2')}
@font-face{font-family:'Inter';font-weight:600;font-display:swap;src:url(../fonts/inter-latin-600-normal.woff2) format('woff2')}
:root{
  --ink:#0F0D0B;
  --clay:#E08560;
  --smoke:#8C847A;
  --bone:#EFE9E1;
  --bone-2:#DCD4C9;
  --display:'Syne', system-ui, sans-serif;
  --text:'Inter', system-ui, -apple-system, sans-serif;
  --pad:clamp(20px, 3.4vw, 48px);
}
*{box-sizing:border-box;margin:0;padding:0}
html{background:var(--ink);-webkit-text-size-adjust:100%}
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto!important}
body{background:var(--ink);color:var(--bone);font-family:var(--text);-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:inherit}
::selection{background:var(--clay);color:var(--ink)}

.loader{position:fixed;inset:0;z-index:50;background:var(--ink);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:22px;transition:opacity .9s ease,visibility .9s}
.loader.is-done{opacity:0;visibility:hidden}
.loader__logo{font-family:var(--display);font-weight:800;font-size:clamp(28px,4vw,44px);letter-spacing:.34em;padding-left:.34em}
.loader__bar{width:140px;height:1px;background:rgba(239,233,225,.18);overflow:hidden}
.loader__bar i{display:block;height:100%;width:0;background:var(--clay);transition:width .3s ease}

.stage{position:fixed;inset:0;height:100vh;height:100lvh;overflow:hidden;z-index:1;contain:strict}
.layer{position:absolute;inset:0;width:100%;height:100%}
#extVideo{object-fit:cover;will-change:opacity}
#seq{opacity:0;will-change:opacity,transform;animation:breathe 16s ease-in-out infinite alternate;animation-play-state:paused}
#seq.is-breathing{animation-play-state:running}
@keyframes breathe{from{transform:scale(1)}to{transform:scale(1.05)}}
.svc-bgs{opacity:0;will-change:opacity}
.svc-bg{position:absolute;inset:0;opacity:0;will-change:opacity,transform;background:#000}
.svc-bg img{width:100%;height:100%;object-fit:cover;display:block}
.svc-bg:first-child{opacity:1}
.svc-bgs,.svc-bg,#seq{visibility:hidden}
.shade{pointer-events:none;background:
  radial-gradient(ellipse 120% 90% at 50% 50%,rgba(15,13,11,.12) 0%,rgba(15,13,11,.55) 62%,rgba(15,13,11,.9) 100%);
  transition:background .6s}
.shade::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(15,13,11,.78) 0%,rgba(15,13,11,.35) 38%,rgba(15,13,11,0) 62%);opacity:var(--side,0)}

.bar{position:absolute;z-index:5;left:var(--pad);right:var(--pad);top:calc(env(safe-area-inset-top,0px) + clamp(18px,2.6vw,30px));display:grid;grid-template-columns:1fr auto 1fr;align-items:center;font-size:12px;letter-spacing:.16em;text-transform:uppercase}
.bar__logo{font-family:var(--display);font-weight:800;font-size:clamp(18px,1.8vw,23px);letter-spacing:.34em;padding-left:.34em;text-decoration:none}
.bar__right{justify-self:end;display:flex;align-items:center;gap:clamp(14px,2vw,26px)}
.bar__link{text-decoration:none;padding:12px 0;transition:color .25s}
.bar__link:hover{color:var(--clay)}
.menu-btn{width:46px;height:46px;border-radius:50%;border:1px solid rgba(239,233,225,.45);background:rgba(15,13,11,.15);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;cursor:pointer;transition:border-color .25s,background .25s}
.menu-btn span{display:block;width:16px;height:1.5px;background:var(--bone);transition:transform .35s ease}
.menu-btn:hover{border-color:var(--clay)}
.menu-btn[aria-expanded="true"] span:first-child{transform:translateY(3.75px) rotate(45deg)}
.menu-btn[aria-expanded="true"] span:last-child{transform:translateY(-3.75px) rotate(-45deg)}

.menu{position:fixed;inset:0;z-index:4;background:rgba(15,13,11,.92);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:clamp(14px,2.4vh,26px);opacity:0;transition:opacity .45s ease}
.menu[hidden]{display:none}
.menu.is-open{opacity:1}
.menu a{font-family:var(--display);font-weight:700;font-size:clamp(34px,6vw,72px);text-decoration:none;letter-spacing:-.02em;transition:color .25s}
.menu a:hover{color:var(--clay)}
.menu .menu__social{display:flex;gap:28px;margin-top:clamp(10px,2vh,22px)}
.menu .menu__social a{font-family:var(--text);font-weight:500;font-size:13px;letter-spacing:.16em;text-transform:uppercase;color:var(--smoke)}
.menu .menu__social a:hover{color:var(--clay)}

.beats{position:absolute;inset:0;z-index:3;pointer-events:none}
.beat{position:absolute;left:50%;top:50%;width:min(1100px,calc(100% - 2*var(--pad)));transform:translate(-50%,-50%);display:flex;flex-direction:column;align-items:center;text-align:center;gap:clamp(16px,2.4vh,26px);opacity:0;will-change:opacity,transform}
.beat.is-live{pointer-events:auto}
.kicker,.body,.svc-text__desc,.featured__label{text-shadow:0 1px 18px rgba(0,0,0,.45)}
.kicker{font-size:12px;letter-spacing:.3em;text-transform:uppercase;color:var(--clay);font-weight:500}
.title{font-family:var(--display);font-weight:700;font-size:clamp(40px,7vw,104px);line-height:1;letter-spacing:-.035em;text-wrap:balance}
.body{font-size:clamp(16px,1.3vw,19px);line-height:1.6;color:var(--bone-2);max-width:560px}
.cta{display:flex;flex-wrap:wrap;gap:14px;justify-content:center;margin-top:8px}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:54px;padding:0 30px;border-radius:999px;text-decoration:none;font-weight:600;font-size:15px;transition:transform .25s ease,background .25s,color .25s,border-color .25s}
.btn--solid{background:var(--clay);color:var(--ink)}
.btn--solid:hover{background:var(--bone);transform:translateY(-2px)}
.btn--ghost{border:1px solid rgba(239,233,225,.5)}
.btn--ghost:hover{border-color:var(--clay);color:var(--clay);transform:translateY(-2px)}
.social{display:flex;gap:10px;justify-content:center;margin-top:22px}
.social__icon{display:flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:50%;border:1px solid rgba(239,233,225,.35);transition:color .25s,border-color .25s,transform .25s}
.social__icon svg{width:19px;height:19px}
.social__icon:hover{color:var(--clay);border-color:var(--clay);transform:translateY(-2px)}
.address{display:inline-flex;align-items:center;gap:8px;margin-top:18px;font-size:13px;letter-spacing:.06em;color:var(--bone);text-shadow:0 1px 12px rgba(15,13,11,.7);text-decoration:none;transition:color .25s}
.address svg{width:16px;height:16px;flex:none}
.address:hover{color:var(--clay)}

.featured{position:absolute;inset:0;z-index:3;pointer-events:none;opacity:0;will-change:opacity}
.featured.is-live{pointer-events:auto}
.featured__label{position:absolute;left:var(--pad);top:clamp(96px,15vh,150px);font-size:12px;letter-spacing:.3em;text-transform:uppercase;color:var(--clay);font-weight:500;display:flex;align-items:center;gap:14px}
.featured__label::after{content:"";width:46px;height:1px;background:var(--clay)}
.svc-texts{position:absolute;left:var(--pad);top:calc(50% - clamp(70px,11vh,120px));width:min(660px,calc(100% - 2*var(--pad)))}
.svc-text{position:absolute;left:0;top:0;transform:translateY(-50%);width:100%;display:flex;flex-direction:column;gap:clamp(14px,2.2vh,22px);opacity:0;will-change:opacity,transform}
.svc-text__num{font-family:var(--display);font-weight:600;font-size:14px;color:var(--clay);letter-spacing:.1em}
.svc-text__name{font-family:var(--display);font-weight:800;font-size:clamp(34px,min(6vw,10.5vh),88px);line-height:.95;letter-spacing:-.04em;text-wrap:balance}
.svc-text__desc{font-size:clamp(15px,1.25vw,18px);line-height:1.65;color:var(--bone-2);max-width:500px}

.svc-rail{position:absolute;left:var(--pad);right:0;bottom:clamp(96px,14vh,130px);overflow:hidden}
.svc-track{display:flex;gap:16px;will-change:transform}
.svc-card{flex:0 0 clamp(200px,19vw,270px);display:flex;flex-direction:column;gap:12px;text-align:left;background:none;border:0;color:inherit;font:inherit;cursor:pointer;padding:0;opacity:.5;transition:opacity .4s ease}
.svc-card.is-active{opacity:1}
.svc-card__thumb{position:relative;height:clamp(84px,min(8.5vw,13vh),124px);border-radius:6px;overflow:hidden;background:#1a1714}
.svc-card__thumb img{width:100%;height:100%;object-fit:cover;display:block;transform:scale(1.04);transition:transform .8s ease}
.svc-card.is-active .svc-card__thumb img{transform:scale(1)}
.svc-card__bar{height:2px;background:rgba(239,233,225,.22);position:relative;overflow:hidden}
.svc-card__bar i{position:absolute;inset:0;background:var(--clay);transform-origin:left;transform:scaleX(0)}
.svc-card__meta{display:flex;gap:10px;align-items:baseline;font-size:13px}
.svc-card__meta b{font-family:var(--display);font-weight:600;color:var(--clay);font-size:12px}
.svc-card__meta span{font-weight:500}
.svc-card:focus-visible{outline:2px solid var(--clay);outline-offset:6px;border-radius:6px}

.proc-media{opacity:0;visibility:hidden;will-change:opacity,transform;background:#000}
.proc-media canvas{width:100%;height:100%;object-fit:cover;display:block}
.proc{position:absolute;inset:0;z-index:3;pointer-events:none;opacity:0;will-change:opacity}
.proc.is-live{pointer-events:auto}
.proc-steps{position:absolute;left:var(--pad);bottom:clamp(96px,14vh,130px);width:min(820px,calc(100% - 2*var(--pad)));display:flex;gap:16px}
.proc-step{flex:1;display:flex;flex-direction:column;gap:14px;text-align:left;background:none;border:0;color:inherit;font:inherit;cursor:pointer;padding:0;opacity:.5;transition:opacity .4s ease}
.proc-step.is-active{opacity:1}
.proc-step__name{font-family:var(--display);font-weight:600;font-size:clamp(14px,1.2vw,17px);letter-spacing:.02em}
.proc-step:focus-visible{outline:2px solid var(--clay);outline-offset:6px;border-radius:4px}

.hud{position:absolute;z-index:5;left:var(--pad);right:var(--pad);bottom:calc(env(safe-area-inset-bottom,0px) + clamp(22px,3.2vh,36px));display:flex;justify-content:space-between;align-items:flex-end;pointer-events:none}
.hud__count,#hudPct{opacity:0;transition:opacity .5s ease}
.hud.is-svc .hud__count,.hud.is-svc #hudPct{opacity:1}
.hud__count{display:flex;align-items:baseline;gap:10px;font-family:var(--display)}
.hud__count span{font-weight:800;font-size:clamp(34px,4vw,56px);line-height:1}
.hud__count small{font-size:15px;color:var(--smoke)}
.hud__progress{width:min(300px,42vw);display:flex;flex-direction:column;gap:10px;font-size:11px;letter-spacing:.14em;text-transform:uppercase}
.hud__row{display:flex;justify-content:space-between}
.hud__line{height:2px;background:rgba(239,233,225,.22);overflow:hidden}
.hud__line i{display:block;height:100%;background:var(--clay);transform-origin:left;transform:scaleX(0)}

.scroll-hint{pointer-events:none;position:absolute;z-index:3;left:50%;bottom:clamp(30px,5vh,48px);transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:10px;font-size:11px;letter-spacing:.3em;text-transform:uppercase;color:var(--bone-2);transition:opacity .5s}
.scroll-hint i{width:1px;height:38px;background:linear-gradient(var(--bone),transparent);animation:hint 1.8s ease-in-out infinite;transform-origin:top}
@keyframes hint{0%{transform:scaleY(0);opacity:1}60%{transform:scaleY(1);opacity:1}100%{transform:scaleY(1);opacity:0}}

.track{position:relative;z-index:0;pointer-events:none}

@media (min-width:821px){
  .menu-btn{display:none}
}
@media (max-width:820px){
  .bar__loc{visibility:hidden}
  .bar__link{display:none}
  .hud__count span{font-size:30px}
  .svc-texts{top:34%}
  .svc-text__name{font-size:clamp(30px,9.2vw,48px)}
  .svc-rail{bottom:96px}
  .proc-steps{bottom:96px;gap:12px}
  .svc-card{flex-basis:150px}
  .svc-card__thumb{height:78px}
  .scroll-hint{bottom:96px}
  .shade::after{background:linear-gradient(0deg,rgba(15,13,11,.85) 0%,rgba(15,13,11,.25) 55%,rgba(15,13,11,.35) 100%)}
}
@media (prefers-reduced-motion:reduce){
  .scroll-hint i{animation:none}
  #seq{animation:none}
}