/* SignalFoundry — editorial layer (Trionn structure + gold/glass identity)
   Serif display + sans body, dark/light rhythm, giant stacked type,
   scroll-driven reveals, magnetic hover. */

:root{
  --serif:'Instrument Serif',ui-serif,Georgia,'Times New Roman',serif;
  --sans:'Inter',ui-sans-serif,system-ui,sans-serif;
  --mono:'JetBrains Mono',ui-monospace,monospace;

  /* light-section tokens */
  --paper:#f2f0ea;
  --paper-2:#e8e5dc;
  --ink:#0c0c10;
  --ink-dim:#4a4a52;
  --ink-faint:#8a8a94;
  --gold-ink:#8a6d00;
}

body{font-family:var(--sans)}

/* ---------- display type ---------- */
.display{
  font-family:var(--serif);
  font-weight:400;
  font-size:clamp(2.8rem,7.2vw,6.2rem);
  line-height:.94;
  letter-spacing:-.02em;
  color:var(--text-hi);
}
.display em{font-style:italic;color:var(--accent)}
.display-sm{
  font-family:var(--serif);
  font-weight:400;
  font-size:clamp(2rem,4.2vw,3.4rem);
  line-height:1.02;
  letter-spacing:-.02em;
}
.display-sm em{font-style:italic}

/* ---------- hero ---------- */
.hero-ed{
  position:relative;
  padding:clamp(3.5rem,9vw,7rem) 0 clamp(2.5rem,5vw,4rem);
  z-index:1;
}
.hero-ed .wrap{max-width:1180px;margin:0 auto;padding:0 var(--pad)}
.hero-ed .display{max-width:16ch}
.lede-ed{
  margin-top:1.4rem;max-width:46ch;
  font-size:clamp(.95rem,1.4vw,1.08rem);
  color:var(--text-dim);line-height:1.65;
}
.hero-ed .hero-actions{margin-top:2rem}
.hero-ed .proof-row{margin-top:2rem}

/* ---------- marquee ---------- */
.marquee-ed{
  border-top:1px solid rgb(255 255 255 / .08);
  border-bottom:1px solid rgb(255 255 255 / .08);
  background:rgb(255 255 255 / .02);
  overflow:hidden;padding:.9rem 0;
}
.marquee-ed div{
  display:flex;align-items:center;gap:1.6rem;white-space:nowrap;
  font-family:var(--serif);font-size:clamp(1.4rem,3vw,2.4rem);
  color:rgb(255 255 255 / .28);
  animation:slide-ed 34s linear infinite;
  width:max-content;
}
.marquee-ed b{color:var(--accent);font-weight:400;font-size:.7em}
@keyframes slide-ed{from{transform:translateX(0)}to{transform:translateX(-33.333%)}}

/* ---------- light sections ---------- */
.light{
  background:var(--paper);
  color:var(--ink);
  position:relative;z-index:2;
  padding:clamp(3.5rem,8vw,6.5rem) 0;
}
.light .wrap{max-width:1180px;margin:0 auto;padding:0 var(--pad)}
.light .eyebrow{color:var(--ink-faint)}
.light .eyebrow.dark{color:var(--ink-faint)}
.light .eyebrow::before{background:var(--gold-ink);box-shadow:none}
.light .display-sm{color:var(--ink)}
.light .display-sm em{color:var(--gold-ink)}
.sec-head-ed{margin-bottom:clamp(2rem,4vw,3.5rem)}
.sec-sub{margin-top:.9rem;max-width:52ch;color:var(--ink-dim);font-size:.95rem;line-height:1.65}
.light-sub{color:rgb(255 255 255 / .55)}

/* ---------- key facts ---------- */
.facts-grid{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));
  gap:1px;background:rgb(12 12 16 / .12);
  border:1px solid rgb(12 12 16 / .12);
}
.fact{
  background:var(--paper);
  padding:clamp(1.4rem,3vw,2.2rem);
  display:flex;flex-direction:column;gap:.5rem;
  transition:background .3s ease;
}
.fact:hover{background:#fff}
.fact-accent{background:var(--ink);color:var(--paper)}
.fact-accent:hover{background:#000}
.fact-num{
  font-family:var(--serif);font-size:clamp(2.6rem,5vw,4rem);
  line-height:1;letter-spacing:-.03em;
}
.fact-accent .fact-num{color:var(--accent)}
.fact-label{
  font-family:var(--mono);font-size:.62rem;letter-spacing:.14em;
  text-transform:uppercase;color:var(--ink-faint);
}
.fact-accent .fact-label{color:rgb(255 255 255 / .5)}
.fact p{font-size:.85rem;line-height:1.6;color:var(--ink-dim);margin-top:.3rem}
.fact-accent p{color:rgb(255 255 255 / .62)}

.fact-strip{
  margin-top:clamp(2rem,4vw,3rem);
  padding-top:1.5rem;border-top:1px solid rgb(12 12 16 / .12);
  display:flex;align-items:center;justify-content:space-between;
  gap:1.5rem;flex-wrap:wrap;
  font-family:var(--mono);font-size:.66rem;letter-spacing:.1em;
  text-transform:uppercase;color:var(--ink-faint);
}
.fact-logos{display:flex;gap:1.6rem;flex-wrap:wrap}
.fact-logos b{font-weight:600;color:rgb(12 12 16 / .35);letter-spacing:.16em}

/* ---------- giant stacked type ---------- */
.stacked{
  background:#050510;position:relative;z-index:2;
  padding:clamp(3rem,7vw,5.5rem) 0;
  border-top:1px solid rgb(255 255 255 / .06);
}
.stacked .wrap{max-width:1180px;margin:0 auto;padding:0 var(--pad)}
.stack-list{display:flex;flex-direction:column}
.stack-row{
  display:grid;grid-template-columns:1fr minmax(0,.9fr);
  gap:clamp(1rem,4vw,3rem);align-items:center;
  padding:clamp(1rem,2.5vw,1.8rem) 0;
  border-top:1px solid rgb(255 255 255 / .07);
  transition:padding-left .4s cubic-bezier(.2,.7,.2,1);
}
.stack-row:last-child{border-bottom:1px solid rgb(255 255 255 / .07)}
.stack-row:hover{padding-left:1.2rem}
.stack-word{
  font-family:var(--sans);
  font-weight:900;
  font-size:clamp(2.6rem,9vw,7.5rem);
  line-height:.86;letter-spacing:-.045em;
  color:rgb(255 255 255 / .16);
  text-transform:uppercase;
  transition:color .35s ease,letter-spacing .35s ease;
  margin:0;
}
.stack-row:hover .stack-word{color:var(--accent);letter-spacing:-.03em}
.stack-desc{
  font-size:.9rem;line-height:1.7;color:var(--text-dim);
  max-width:44ch;
  opacity:.75;transition:opacity .35s ease;
}
.stack-row:hover .stack-desc{opacity:1}

/* ---------- tools grid ---------- */
.tool-grid-ed{
  display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));
  gap:1px;background:rgb(12 12 16 / .12);
  border:1px solid rgb(12 12 16 / .12);
}
.tool-ed{
  background:var(--paper);
  padding:clamp(1.2rem,2.5vw,1.7rem);
  display:flex;flex-direction:column;gap:.55rem;
  position:relative;overflow:hidden;
  transition:background .3s ease,transform .3s ease;
  text-decoration:none;color:inherit;
}
.tool-ed::after{
  content:'';position:absolute;inset:auto 0 0 0;height:2px;
  background:var(--gold-ink);
  transform:scaleX(0);transform-origin:left;
  transition:transform .4s cubic-bezier(.2,.7,.2,1);
}
.tool-ed:hover{background:#fff}
.tool-ed:hover::after{transform:scaleX(1)}
.tool-ed .tool-idx{
  font-family:var(--mono);font-size:.6rem;letter-spacing:.14em;
  text-transform:uppercase;color:var(--gold-ink);
}
.tool-ed h3{
  font-family:var(--sans);font-size:1rem;font-weight:700;
  letter-spacing:-.015em;color:var(--ink);margin:0;
}
.tool-ed p{font-size:.83rem;line-height:1.6;color:var(--ink-dim);flex:1;margin:0}
.tool-ed .tool-foot{
  display:flex;align-items:center;justify-content:space-between;
  padding-top:.6rem;margin-top:.3rem;
  border-top:1px solid rgb(12 12 16 / .1);
  font-family:var(--mono);font-size:.6rem;letter-spacing:.08em;
  text-transform:uppercase;color:var(--ink-faint);
}
.tool-ed .go{color:var(--gold-ink);font-weight:600}
.price-free{color:var(--ok)!important;font-weight:700}
.price-paid{color:var(--accent)!important;font-weight:700}
.tool-free{background:#fff}
.tool-free .tool-idx{color:var(--ink)}

/* ---------- rules ---------- */
.rules-ed{
  background:#050510;position:relative;z-index:2;
  padding:clamp(3.5rem,8vw,6rem) 0;
  border-top:1px solid rgb(255 255 255 / .06);
}
.rules-ed .wrap{max-width:1180px;margin:0 auto;padding:0 var(--pad)}
.light-text{color:var(--text-hi)}
.light-text em{color:var(--accent)}
.rules-grid-ed{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));
  gap:1rem;margin-top:clamp(2rem,4vw,3rem);
}
.rule-ed{
  border:1px solid rgb(255 255 255 / .1);
  border-radius:var(--radius);
  background:linear-gradient(180deg, rgb(255 255 255 / .06), rgb(255 255 255 / .02));
  backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  padding:1.2rem;
  box-shadow:0 1px 0 rgb(255 255 255 / .14) inset;
  transition:border-color .3s ease,transform .3s ease,box-shadow .3s ease;
}
.rule-ed:hover{
  border-color:rgb(255 215 0 / .4);
  transform:translateY(-4px);
  box-shadow:0 20px 40px -20px rgb(0 0 0 / .8), 0 1px 0 rgb(255 255 255 / .2) inset;
}
.rule-ed .n{
  font-family:var(--mono);font-size:.58rem;letter-spacing:.14em;
  text-transform:uppercase;color:var(--accent);
}
.rule-ed strong{display:block;margin:.5rem 0 .4rem;font-size:.92rem;color:var(--text-hi)}
.rule-ed p{font-size:.82rem;line-height:1.6;color:var(--text-dim);margin:0}

/* ---------- CTA ---------- */
.cta-ed{
  position:relative;z-index:2;overflow:hidden;
  padding:clamp(4rem,10vw,8rem) 0 clamp(5rem,10vw,8rem);
  border-top:1px solid rgb(255 255 255 / .06);
  text-align:center;
}
.cta-ed .wrap{max-width:1180px;margin:0 auto;padding:0 var(--pad);position:relative;z-index:2}
.cta-ed .display{font-size:clamp(2.6rem,7vw,5.5rem)}
.cta-ed .lede-ed{margin-left:auto;margin-right:auto;text-align:center}
.cta-ed .btn{margin-top:2rem}
.cta-wordmark{
  position:absolute;left:50%;bottom:-.18em;transform:translateX(-50%);
  font-family:var(--sans);font-weight:900;
  font-size:clamp(4rem,17vw,15rem);
  letter-spacing:-.05em;line-height:.8;
  color:rgb(255 255 255 / .028);
  white-space:nowrap;pointer-events:none;user-select:none;
}

/* ---------- scroll reveal ---------- */
.reveal{
  opacity:0;
  transform:translateY(28px);
  transition:opacity .8s cubic-bezier(.2,.7,.2,1), transform .8s cubic-bezier(.2,.7,.2,1);
  will-change:opacity,transform;
}
.reveal.in{opacity:1;transform:none}

/* staggered children */
.reveal-stagger > *{
  opacity:0;transform:translateY(24px);
  transition:opacity .7s cubic-bezier(.2,.7,.2,1), transform .7s cubic-bezier(.2,.7,.2,1);
}
.reveal-stagger.in > *{opacity:1;transform:none}
.reveal-stagger.in > *:nth-child(1){transition-delay:.05s}
.reveal-stagger.in > *:nth-child(2){transition-delay:.13s}
.reveal-stagger.in > *:nth-child(3){transition-delay:.21s}
.reveal-stagger.in > *:nth-child(4){transition-delay:.29s}
.reveal-stagger.in > *:nth-child(5){transition-delay:.37s}
.reveal-stagger.in > *:nth-child(6){transition-delay:.45s}
.reveal-stagger.in > *:nth-child(7){transition-delay:.53s}

/* stack words slide in from left */
.stack-row{opacity:0;transform:translateX(-24px);transition:opacity .7s ease,transform .7s cubic-bezier(.2,.7,.2,1),padding-left .4s cubic-bezier(.2,.7,.2,1)}
.stack-row.in{opacity:1;transform:none}

/* ---------- cursor spotlight ---------- */
.cursor-spot{
  position:fixed;top:0;left:0;z-index:1;pointer-events:none;
  width:520px;height:520px;border-radius:50%;
  background:radial-gradient(circle, rgb(255 215 0 / .055), transparent 62%);
  mix-blend-mode:screen;
  will-change:transform;
}

/* ---------- stack row reveal ---------- */
.reveal-stack{opacity:0;transform:translateX(-24px);transition:opacity .7s ease,transform .7s cubic-bezier(.2,.7,.2,1)}
.reveal-stack.in{opacity:1;transform:none}

/* ---------- responsive ---------- */
@media(max-width:860px){
  .stack-row{grid-template-columns:1fr;gap:.6rem}
  .stack-word{font-size:clamp(2.4rem,13vw,4.5rem)}
  .hero-ed .display{max-width:none}
  .fact-strip{flex-direction:column;align-items:flex-start}
}

/* ---------- reduced motion ---------- */
@media(prefers-reduced-motion:reduce){
  .reveal,.reveal-stagger > *,.stack-row{opacity:1!important;transform:none!important}
  .marquee-ed div{animation:none}
  .tool-ed:hover,.rule-ed:hover,.stack-row:hover{padding-left:0;transform:none}
}