/* Nav, intro, hero, menu, reveal. */

/* ---------------- intro curtain ---------------- */
.intro{position:fixed;inset:0;z-index:120;background:var(--ink);display:grid;place-items:center;
  transition:opacity 700ms var(--ease-out),visibility 700ms;}
.intro[hidden]{display:none;}
.intro.is-done{opacity:0;visibility:hidden;pointer-events:none;}
.intro__in{display:grid;justify-items:center;gap:var(--s3);}
.intro__sigil{width:clamp(72px,16vw,132px);color:var(--ember);}
.intro__sigil path,.intro__sigil circle{stroke-dasharray:600;stroke-dashoffset:600;
  animation:draw 1500ms var(--ease-out) forwards;}
.intro__sigil circle:nth-child(2){animation-delay:120ms;}
.intro__sigil path:nth-child(n+3){animation-delay:260ms;}
@keyframes draw{to{stroke-dashoffset:0;}}
.intro__name{font-family:var(--f-mono);font-size:var(--step--1);letter-spacing:.62em;
  text-transform:uppercase;color:var(--bone-dim);padding-left:.62em;
  opacity:0;animation:fadeUp 800ms 600ms var(--ease-out) forwards;}
.intro__skip{position:absolute;bottom:var(--s4);font-family:var(--f-mono);font-size:var(--step--1);
  letter-spacing:.16em;text-transform:uppercase;color:var(--bone-dim);
  opacity:0;animation:fadeUp 500ms 1500ms var(--ease-out) forwards;}
.intro__skip:hover{color:var(--bone);}
@keyframes fadeUp{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}

/* ---------------- nav ---------------- */
.nav{position:fixed;top:0;left:0;right:0;z-index:100;height:var(--nav-h);
  display:flex;align-items:center;
  transition:background var(--dur-2) var(--ease),border-color var(--dur-2) var(--ease);
  border-bottom:1px solid transparent;}
.nav.is-stuck{background:rgba(10,10,11,.86);backdrop-filter:blur(14px) saturate(120%);
  -webkit-backdrop-filter:blur(14px) saturate(120%);border-bottom-color:var(--edge);}
.nav__in{display:flex;align-items:center;justify-content:space-between;gap:var(--s3);width:100%;}
.brand{display:inline-flex;align-items:center;gap:.6rem;min-height:44px;padding-right:.35rem;}
.brand__sigil{width:26px;height:26px;color:var(--ember);flex:none;
  transition:transform var(--dur-3) var(--ease);}
.brand:hover .brand__sigil{transform:rotate(-14deg);}
.brand__name{font-family:var(--f-ui);font-variation-settings:'wdth' 68,'wght' 800;
  text-transform:uppercase;letter-spacing:.1em;font-size:.94rem;white-space:nowrap;}

.nav__links{display:none;gap:clamp(.9rem,1.8vw,1.9rem);align-items:center;}
.nav__link{position:relative;font-family:var(--f-mono);font-size:.72rem;letter-spacing:.16em;
  text-transform:uppercase;color:var(--bone-dim);padding:.4rem 0;
  transition:color var(--dur-1) var(--ease);}
.nav__link::after{content:"";position:absolute;left:0;bottom:0;width:100%;height:1px;
  background:var(--ember);transform:scaleX(0);transform-origin:right;
  transition:transform var(--dur-2) var(--ease);}
.nav__link:hover,.nav__link[aria-current="true"]{color:var(--bone);}
.nav__link:hover::after,.nav__link[aria-current="true"]::after{transform:scaleX(1);transform-origin:left;}
.nav .nav__cta{display:none;}

.burger{display:inline-flex;flex-direction:column;justify-content:center;gap:5px;
  width:44px;height:44px;align-items:flex-end;margin-right:-.35rem;}
.burger span{display:block;height:2px;background:var(--bone);transition:transform var(--dur-2) var(--ease),
  opacity var(--dur-1) var(--ease),width var(--dur-2) var(--ease);}
.burger span:nth-child(1){width:26px;} .burger span:nth-child(2){width:18px;}
.burger[aria-expanded="true"] span:nth-child(1){width:26px;transform:translateY(3.5px) rotate(45deg);}
.burger[aria-expanded="true"] span:nth-child(2){width:26px;transform:translateY(-3.5px) rotate(-45deg);}

/* full-screen menu */
.menu{position:fixed;inset:0;z-index:99;background:var(--ink);padding-top:var(--nav-h);
  display:grid;grid-template-rows:1fr auto;opacity:0;visibility:hidden;overflow-y:auto;
  transition:opacity var(--dur-2) var(--ease),visibility 0s linear var(--dur-2);}
/* visible immediately on open so focus() lands; hiding waits for the fade */
.menu.is-open{opacity:1;visibility:visible;
  transition:opacity var(--dur-2) var(--ease),visibility 0s linear 0s;}
.menu__list{display:grid;align-content:center;gap:.1rem;padding:var(--s4) var(--gutter);}
.menu__item{overflow:hidden;}
.menu__link{display:flex;align-items:baseline;gap:var(--s2);padding:.24em 0;
  font-family:var(--f-display);font-variation-settings:'opsz' 96,'wght' 700;
  font-size:clamp(2.1rem,10vw,4rem);line-height:1;letter-spacing:-.01em;
  transform:translateY(110%);transition:color var(--dur-1) var(--ease);}
.menu.is-open .menu__link{animation:menuIn 620ms var(--ease-out) forwards;}
.menu__link:hover{color:var(--ember);}
.menu__num{font-family:var(--f-mono);font-size:.68rem;letter-spacing:.14em;color:var(--bone-dim);}
@keyframes menuIn{to{transform:none;}}
.menu__foot{padding:var(--s4) var(--gutter) var(--s5);border-top:1px solid var(--edge);
  display:flex;flex-wrap:wrap;gap:var(--s3);justify-content:space-between;align-items:center;}

/* ---------------- buttons ---------------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.6rem;
  min-height:44px;padding:.85rem 1.5rem;font-family:var(--f-mono);font-size:.74rem;
  letter-spacing:.16em;text-transform:uppercase;border:1px solid var(--edge-hi);
  position:relative;overflow:hidden;isolation:isolate;
  transition:color var(--dur-2) var(--ease),border-color var(--dur-2) var(--ease);}
.btn::before{content:"";position:absolute;inset:0;z-index:-1;background:var(--ember);
  transform:translateY(101%);transition:transform var(--dur-2) var(--ease-out);}
.btn:hover{color:var(--on-ember);border-color:var(--ember);}
.btn:hover::before{transform:none;}
.btn--solid{background:var(--ember);color:var(--on-ember);border-color:var(--ember);}
.btn--solid::before{background:var(--bone);}
.btn--solid:hover{color:var(--ink);border-color:var(--bone);}
.btn--ghost{border-color:var(--edge-hi);color:var(--bone);}
.btn--sm{padding:.6rem 1rem;font-size:.68rem;}

/* ---------------- hero ---------------- */
.hero{position:relative;min-height:100svh;display:grid;align-items:end;overflow:hidden;
  padding-top:var(--nav-h);}
.hero__media{position:absolute;inset:0;z-index:0;}
.hero__img{width:100%;height:100%;object-fit:cover;object-position:50% 42%;
  transform:scale(1.08) translate3d(0,0,0);will-change:transform;}
/* Two scrims: the rig stays visible up top, the copy sits on a dark plate.
   Sized against tools/photo_contrast.py. */
.hero__scrim{position:absolute;inset:0;
  background:
    linear-gradient(to right,rgba(10,10,11,.86) 0%,rgba(10,10,11,.55) 42%,
      rgba(10,10,11,.10) 72%,transparent 100%),
    linear-gradient(to bottom,rgba(10,10,11,.74) 0%,rgba(10,10,11,.16) 30%,
      rgba(10,10,11,.55) 52%,rgba(10,10,11,.88) 76%,var(--ink) 100%);}
.hero__spot{position:absolute;inset:0;pointer-events:none;opacity:0;
  background:radial-gradient(28rem 28rem at var(--mx,50%) var(--my,50%),
    rgba(224,85,47,.16),transparent 70%);
  transition:opacity var(--dur-3) var(--ease);}
.hero:hover .hero__spot{opacity:1;}
.hero__in{position:relative;z-index:2;width:100%;padding-bottom:clamp(2rem,7vh,4.5rem);}
.hero__kicker{margin-bottom:var(--s3);}
.hero__title{font-family:var(--f-display);font-variation-settings:'opsz' 96,'wght' 800;
  font-size:var(--step-5);line-height:.84;letter-spacing:-.005em;margin-bottom:var(--s3);
  text-transform:uppercase;}
.hero__title .w{display:inline-block;overflow:hidden;vertical-align:bottom;}
.hero__title .w>span{display:inline-block;transform:translateY(105%);}
.is-ready .hero__title .w>span{transform:none;
  transition:transform 1000ms var(--ease-out) calc(var(--i,0)*90ms);}
.hero__sub{max-width:44ch;color:var(--bone-dim);font-size:var(--step-1);margin-bottom:var(--s4);}
.hero__actions{display:flex;flex-wrap:wrap;gap:var(--s2);}
.hero__meta{position:absolute;z-index:2;font-family:var(--f-mono);font-size:.66rem;
  letter-spacing:.18em;text-transform:uppercase;color:var(--bone-dim);}
.hero__meta--tl{top:calc(var(--nav-h) + 1.1rem);left:var(--gutter);}
.hero__meta--tr{top:calc(var(--nav-h) + 1.1rem);right:var(--gutter);text-align:right;}
.hero__rec{display:inline-flex;align-items:center;gap:.45rem;}
.hero__rec::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--ember);
  animation:pulse 2s var(--ease) infinite;}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.25}}

/* ticker */
.ticker{position:relative;z-index:2;border-top:1px solid var(--edge);border-bottom:1px solid var(--edge);
  background:rgba(10,10,11,.6);overflow:hidden;padding-block:.7rem;}
.ticker__track{display:flex;gap:2.5rem;width:max-content;
  animation:slide 42s linear infinite;}
.ticker:hover .ticker__track{animation-play-state:paused;}
.ticker__item{display:inline-flex;align-items:center;gap:.7rem;font-family:var(--f-mono);
  font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--bone-dim);white-space:nowrap;}
.ticker__item b{color:var(--bone);font-weight:400;}
.ticker__item::after{content:"";width:5px;height:5px;background:var(--ember);flex:none;}
@keyframes slide{from{transform:translate3d(0,0,0)}to{transform:translate3d(-50%,0,0)}}

/* ---------------- reveal ---------------- */
.rv{opacity:0;transform:translateY(26px);
  transition:opacity 800ms var(--ease-out),transform 800ms var(--ease-out);}
.rv.in{opacity:1;transform:none;}
.rv[data-d="1"]{transition-delay:100ms}.rv[data-d="2"]{transition-delay:200ms}
.rv[data-d="3"]{transition-delay:300ms}.rv[data-d="4"]{transition-delay:400ms}
@media (prefers-reduced-motion:reduce){
  .rv{opacity:1;transform:none;}
  .hero__title .w>span{transform:none;}
  .ticker__track{animation:none;}
  .menu .menu__link{transform:none;animation:none;}
  .intro__sigil path,.intro__sigil circle{stroke-dashoffset:0;animation:none;}
  .intro__name,.intro__skip{opacity:1;animation:none;}
}

/* ---------------- desktop ---------------- */
@media (min-width:900px){
  .nav__links{display:flex;} .burger{display:none;}
  .nav .nav__cta{display:inline-flex;}
  .menu{display:none;}
  .brand__name{font-size:1rem;}
}