/* The Graveyard: visual layer (ANIMA, 2026-10-15). Load AFTER graveyard.css; uses its tokens
   (--stone --card --ink --ember --gold --blood, --serif/--sans/--mono). Every class is gx-*.
   Motion lives in gy-visual.js and only runs when .gx-anim is on <html> (JS on + motion allowed). */

/* ── entry hero: the claim vs reality hit ── */
.gx-hero{padding:52px 0 56px;border-top:none}
.gx-hero h1{font-size:clamp(34px,4.6vw,56px);line-height:1.03;margin:14px 0 16px;max-width:24ch;text-wrap:balance}
.gx-meta{display:flex;flex-wrap:wrap;align-items:center;gap:12px 18px;font:400 13px var(--mono);color:var(--muted)}
.gx-hero-grid{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:48px;align-items:center;margin-top:40px}
.gx-hero-grid.gx-solo{grid-template-columns:1fr}
.gx-hit{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);gap:8px 22px;align-items:start;padding:30px 0 0;border-top:2px solid var(--ink)}
.gx-side{min-width:0}
.gx-lab{display:flex;align-items:center;gap:10px;font:500 11.5px var(--mono);letter-spacing:.2em;text-transform:uppercase;margin-bottom:10px}
.gx-lab::before{content:"";width:22px;height:1.5px;background:currentColor}
.gx-claim .gx-lab{color:#7a5d2f}
.gx-real .gx-lab{color:var(--ember-deep)}
.gx-pre,.gx-rest{display:block;font:400 15.5px/1.35 var(--sans);color:var(--ink-soft)}
.gx-rest{margin-top:8px}
.gx-big{font:400 clamp(54px,7.4vw,108px)/.95 var(--serif);letter-spacing:-.025em;font-variant-numeric:lining-nums;overflow-wrap:anywhere}
.gx-big:not(.gx-q .gx-big){white-space:nowrap}
.gx-big.gx-l{font-size:clamp(46px,5.4vw,80px)}
.gx-big.gx-xl{font-size:clamp(34px,3.6vw,54px)}
.gx-q .gx-big{font-size:clamp(28px,3.2vw,40px);line-height:1.08;letter-spacing:-.01em}
.gx-claim .gx-big{color:rgba(20,17,15,.5)}
/* the ember strike: a background line, so it crosses every wrapped line of a quote too */
.gx-claim .gx-n{background:linear-gradient(var(--ember),var(--ember)) no-repeat 0 56%/100% .08em;-webkit-box-decoration-break:clone;box-decoration-break:clone}
.gx-vs{font:400 clamp(30px,3vw,44px)/1 var(--serif);color:var(--ember);align-self:center}
.gx-line{grid-column:1/-1;margin-top:18px;padding-top:16px;border-top:1px dashed var(--line-hard);font:400 italic clamp(19px,2vw,23px)/1.3 var(--serif);color:var(--ink-soft)}

/* clip: 1:1 muted loop, framed like a print */
.gx-clip{margin:0;background:var(--card);border:1px solid var(--line-hard);border-radius:18px;padding:10px;box-shadow:0 2px 0 var(--stone-dp),0 22px 50px rgba(20,17,15,.16)}
.gx-clip video{display:block;width:100%;height:auto;aspect-ratio:1/1;border-radius:10px;background:var(--stone)}
.gx-clip figcaption{display:flex;justify-content:space-between;gap:12px;padding:10px 6px 2px;font:400 11px var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.gx-clip figcaption a{color:var(--ember-deep);text-decoration:none}

/* ── facts: tiles, drawn chart, verdict ── */
.gx-facts{padding:56px 0 64px}
.gx-tiles{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.gx-tile{background:var(--card-hi);border:1px solid var(--line-hard);border-radius:14px;padding:16px 18px 18px;display:flex;flex-direction:column-reverse;justify-content:flex-end;gap:8px;min-width:0}
.gx-tile dd{font:400 clamp(26px,2.6vw,34px)/1.05 var(--serif);letter-spacing:-.01em;font-variant-numeric:lining-nums;overflow-wrap:anywhere}
.gx-tile dt{font:400 11.5px/1.4 var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.gx-row{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:40px;align-items:center;margin-top:40px}
.gx-row.gx-solo{grid-template-columns:1fr;max-width:760px}
.gx-chart{margin:0;background:var(--card-hi);border:1px solid var(--line-hard);border-radius:16px;padding:22px 22px 16px}
.gx-chart svg{display:block;width:100%;height:auto;max-height:360px}
.gx-chart .gv-tally{max-width:440px}
.gx-chart figcaption{margin-top:12px;font:400 12.5px/1.5 var(--mono);color:var(--muted)}
.gx-verdict{display:flex;flex-direction:column;align-items:flex-start;gap:10px}
.gx-stamp{font-size:clamp(26px,3vw,38px);padding:.28em .5em .26em .55em;border-width:3px;border-radius:10px;transform:rotate(-4deg);margin-bottom:12px;box-shadow:inset 0 0 0 3px var(--stone),inset 0 0 0 5px currentColor;background:transparent}
.gx-stamp::before{display:none}
.gx-v1{font:400 clamp(24px,2.6vw,32px)/1.12 var(--serif);text-wrap:balance}
.gx-v2{font:400 italic clamp(19px,2vw,23px)/1.25 var(--serif);color:var(--ink-soft);text-wrap:balance}
.gx-fair{font-size:13.5px;color:var(--muted);margin-top:6px}

/* ── autopsy: collapsed long read ── */
.gx-autopsy-wrap{padding:0 0 72px;border-top:none}
.gx-autopsy{border:1px solid var(--line-hard);border-radius:16px;background:var(--stone-hi)}
.gx-autopsy summary{list-style:none;cursor:pointer;display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:6px 18px;padding:20px 24px;border-radius:16px}
.gx-autopsy summary::-webkit-details-marker{display:none}
.gx-autopsy summary:hover{background:rgba(255,255,255,.18)}
.gx-sum-l{font:400 26px/1.1 var(--serif);display:inline-flex;align-items:center;gap:14px}
.gx-sum-l::before{content:"+";font:500 18px/1 var(--mono);width:28px;height:28px;border-radius:50%;background:var(--ink);color:var(--stone-hi);display:inline-grid;place-items:center;transition:transform .25s}
.gx-autopsy[open] .gx-sum-l::before{content:"–"}
.gx-sum-r{font:400 11.5px var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.gx-autopsy-body{padding:6px 24px 28px;border-top:1px dashed var(--line-hard)}
.gx-autopsy-body h2{font-size:26px;margin:28px 0 8px}
.gx-autopsy-body p{font-size:16.5px;color:var(--ink-soft);max-width:68ch}

/* ── landing: visual card grid ── */
.gx-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin-top:36px}
.gx-card{position:relative;display:flex;flex-direction:column;text-decoration:none;color:var(--ink);background:linear-gradient(180deg,var(--card-hi),var(--card));border:1px solid var(--line-hard);border-radius:120px 120px 14px 14px;padding:30px 24px 18px;box-shadow:inset 0 0 0 6px rgba(255,255,255,.16),0 2px 0 var(--stone-dp),0 12px 26px rgba(20,17,15,.08);transition:transform .25s,box-shadow .25s;min-width:0}
.gx-card:hover{transform:translateY(-4px);box-shadow:inset 0 0 0 6px rgba(255,255,255,.16),0 2px 0 var(--stone-dp),0 22px 40px rgba(20,17,15,.15)}
.gx-c-top{display:flex;flex-direction:column;align-items:center;gap:12px}
.gx-c-no{font:500 10.5px var(--mono);letter-spacing:.22em;color:var(--muted)}
.gx-c-stamp{font-size:15px;padding:7px 12px;border-width:2px;transform:rotate(-4deg);box-shadow:inset 0 0 0 2px var(--card-hi),inset 0 0 0 3.5px currentColor;background:transparent}
.gx-c-stamp::before{display:none}
.gx-c-claim{margin-top:20px;font:400 12px/1.4 var(--mono);color:var(--muted);text-align:center;letter-spacing:.02em}
.gx-c-claim span{letter-spacing:.16em;text-transform:uppercase;font-size:10.5px}
.gx-c-claim s{text-decoration:none;background:linear-gradient(var(--ember),var(--ember)) no-repeat 0 55%/100% 1.5px;color:var(--ink-soft)}
.gx-c-hit{margin-top:8px;text-align:center;display:flex;flex-direction:column;align-items:center;gap:2px}
.gx-c-hit b{font:400 clamp(44px,4.6vw,60px)/1 var(--serif);letter-spacing:-.025em;font-variant-numeric:lining-nums;overflow-wrap:anywhere;max-width:100%}
.gx-c-hit b.gx-l{font-size:clamp(36px,3.4vw,46px);white-space:nowrap}
.gx-c-hit b.gx-xl{font-size:clamp(26px,2.4vw,32px);white-space:nowrap}
.gx-c-pre,.gx-c-rest{font:400 13.5px/1.3 var(--sans);color:var(--ink-soft)}
.gx-c-q{font:400 26px/1.1 var(--serif);text-wrap:balance}
.gx-card h3{margin-top:18px;padding-top:14px;border-top:1px dashed var(--line-hard);font:400 18px/1.2 var(--serif);text-align:center;text-wrap:balance}
.gx-c-foot{display:flex;justify-content:space-between;align-items:center;margin-top:auto;padding-top:14px;font:400 11px var(--mono);color:var(--muted);letter-spacing:.06em}
.gx-c-foot b{color:var(--ember-deep);font-weight:500}
.gx-card.v-dead .gx-c-hit b{color:var(--ink)}

/* ── responsive ── */
@media (max-width:960px){
  .gx-hero-grid{grid-template-columns:1fr;gap:32px}
  .gx-clip{max-width:520px}
  .gx-tiles{grid-template-columns:repeat(2,minmax(0,1fr))}
  .gx-row{grid-template-columns:1fr}
  .gx-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:600px){
  .gx-hero{padding:34px 0 40px}
  .gx-hit{grid-template-columns:1fr;gap:6px;padding-top:22px}
  .gx-vs{transform:rotate(90deg);justify-self:start;padding:0 0 0 4px;font-size:30px;line-height:.8}
  .gx-big{font-size:clamp(56px,17vw,84px)}
  .gx-big.gx-l{font-size:clamp(44px,13vw,64px)}
  .gx-big.gx-xl{font-size:clamp(30px,8.6vw,40px)}
  .gx-big:not(.gx-q .gx-big){white-space:nowrap}
.gx-big.gx-l{font-size:clamp(46px,5.4vw,80px)}
.gx-big.gx-xl{font-size:clamp(34px,3.6vw,54px)}
.gx-q .gx-big{font-size:30px}
  .gx-tiles{gap:10px}
  .gx-tile{padding:13px 14px 14px}
  .gx-tile dd{font-size:24px}
  .gx-tile dt{font-size:10.5px}
  .gx-chart{padding:16px 14px 12px}
  .gx-autopsy summary{padding:16px 18px}
  .gx-autopsy-body{padding:4px 18px 22px}
  .gx-grid{grid-template-columns:1fr;gap:16px}
  .gx-grid.clipped .gx-card:nth-child(n+7){display:none}
  .gx-card{border-radius:100px 100px 14px 14px}
}

/* motion: initial states only exist while JS is about to play them */
.gx-anim [data-gx-hit] .gx-side,.gx-anim [data-gx-hit] .gx-line,.gx-anim [data-gx-hit] .gx-vs{transition:opacity .6s ease,transform .8s cubic-bezier(.16,1,.3,1)}
.gx-anim [data-gx-hit]:not(.gx-in) .gx-side,.gx-anim [data-gx-hit]:not(.gx-in) .gx-line,.gx-anim [data-gx-hit]:not(.gx-in) .gx-vs{opacity:0;transform:translateY(18px)}
.gx-anim [data-gx-hit] .gx-real{transition-delay:.9s}
.gx-anim [data-gx-hit] .gx-vs{transition-delay:.7s}
.gx-anim [data-gx-hit] .gx-line{transition-delay:1.8s}
.gx-anim .gx-tile{transition:opacity .5s ease calc(var(--i)*.08s),transform .7s cubic-bezier(.16,1,.3,1) calc(var(--i)*.08s)}
.gx-anim .gx-tiles:not(.gx-in) .gx-tile{opacity:0;transform:translateY(14px)}
.gx-anim .gx-stamp{transition:opacity .15s ease,transform .32s cubic-bezier(.3,1.6,.5,1)}
.gx-anim .gx-verdict:not(.gx-in) .gx-stamp{opacity:0;transform:rotate(-9deg) scale(1.7)}
@media (prefers-reduced-motion:reduce){.gx-card,.gx-card:hover{transition:none;transform:none}}

/* ═══ Phase 3 (KG 2026-10-15: "still a massive wall of text"): clip-first landing + entry top ═══
   Later rules override the Phase 1/2 card styles above on purpose. */
/* landing hero: headline, sub-line, email + one clip. Phone order: head, clip, form. */
.gx-lhero{padding:44px 0 52px;border-top:none;min-height:calc(100svh - 71px);display:flex;align-items:center}
.gx-lhero > .wrap{width:100%}
.gx-lhero-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,500px);grid-template-areas:"head clip" "form clip";column-gap:56px;row-gap:22px;align-items:end}
.gx-lh-head{grid-area:head;align-self:end}
.gx-lh-head h1{font:400 clamp(46px,5.6vw,78px)/.98 var(--serif);letter-spacing:-.02em;max-width:12ch}
.gx-lh-head h1 em{font-style:italic;color:var(--ember-deep)}
.gx-lh-sub{margin-top:16px;font:400 clamp(17px,1.6vw,20px)/1.4 var(--sans);color:var(--ink-soft);max-width:34ch}
.gx-lh-form{grid-area:form;align-self:start}
.gx-lh-form .signup{max-width:520px}
.gx-lh-clip{grid-area:clip;display:block;aspect-ratio:1/1;border-radius:20px;overflow:hidden;border:1px solid var(--line-hard);box-shadow:0 2px 0 var(--stone-dp),0 26px 60px rgba(20,17,15,.18);background:var(--stone)}
.gx-lh-clip video,.gx-clip2 video{display:block;width:100%;height:100%;object-fit:cover}
.gx-ledger{margin-top:18px;font:500 12.5px var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.gx-ledger b{color:var(--ink);font-weight:600}.gx-ledger b.z{color:var(--ember-deep)}

/* the grid: 2 big clip cards per row, 1 on phones */
.gx-grid-sec{padding:56px 0 64px}
.gx-h2{font:400 clamp(30px,3.4vw,42px)/1.05 var(--serif);letter-spacing:-.01em}
.gx-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:28px;margin-top:26px}
.gx-card{border-radius:18px;padding:0;overflow:hidden;background:var(--card-hi);gap:0;min-width:0}
.gx-poster{position:relative;display:block;aspect-ratio:1/1;background:var(--stone);border-bottom:1px solid var(--line)}
.gx-poster video{display:block;width:100%;height:100%;object-fit:cover}
.gx-poster .gx-c-stamp{position:absolute;top:16px;right:16px;background:rgba(214,204,188,.92);font-size:14px}
.gx-c-row{display:flex;align-items:baseline;justify-content:space-between;gap:14px;padding:16px 20px 2px}
.gx-c-num{font:400 clamp(34px,3.4vw,46px)/1 var(--serif);letter-spacing:-.02em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.gx-c-num.gx-l{font-size:clamp(30px,2.8vw,38px)}.gx-c-num.gx-xl{font-size:clamp(22px,2vw,28px)}
.gx-c-no{flex:0 0 auto;font:500 11px var(--mono);letter-spacing:.2em;color:var(--muted)}
.gx-c-title{display:block;padding:6px 20px 18px;font:400 18px/1.25 var(--serif);color:var(--ink-soft);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* entry top: clip | hit, ≤3 tiles, stamp + one sentence */
.gx-top2{padding:30px 0 44px;border-top:none}
.gx-eb{font:500 11.5px var(--mono);letter-spacing:.2em;text-transform:uppercase;color:var(--ember-deep)}
.gx-top2 h1{font:400 clamp(30px,3.6vw,46px)/1.04 var(--serif);letter-spacing:-.012em;margin:8px 0 22px;max-width:28ch;text-wrap:balance}
/* desktop: clip | hit on the first screen; tiles + stamp/verdict in a row just under it */
.gx-top2-grid{display:grid;grid-template-columns:minmax(0,600px) minmax(0,1fr);grid-template-areas:"clip hit" "facts facts";column-gap:52px;row-gap:72px;align-items:center}
.gx-top2-grid > figure{grid-area:clip}
.gx-top2-grid > .gx-side2{grid-area:hit}
.gx-top2-grid > .gx-facts2{grid-area:facts;display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:22px 40px;align-items:center}
.gx-top2-grid.gx-solo{grid-template-columns:1fr;grid-template-areas:"hit" "facts"}
/* MAIN 2026-10-15: with a clip the claim→reality block is dropped (the clip says it), so the facts
   take the column beside the clip instead of leaving it empty. Phone rule below. */
.gx-top2-grid.gx-noside{grid-template-areas:"clip facts";row-gap:0}
.gx-top2-grid.gx-noside > .gx-facts2{grid-template-columns:1fr;gap:28px}
.gx-noside .gx-verdict2{flex-direction:column;align-items:flex-start;gap:14px}
.gx-clip2{margin:0;aspect-ratio:1/1;border-radius:18px;overflow:hidden;border:1px solid var(--line-hard);box-shadow:0 2px 0 var(--stone-dp),0 22px 50px rgba(20,17,15,.16);background:var(--stone)}
.gx-side2{display:flex;flex-direction:column;gap:22px;min-width:0}
.gx-hit2{padding-top:18px;grid-template-columns:1fr;gap:10px}
.gx-hit2 .gx-vs{transform:rotate(90deg);justify-self:start;padding:0 0 0 6px;line-height:.8}
.gx-hit2 .gx-big{font-size:clamp(46px,5vw,76px)}
.gx-hit2 .gx-big.gx-l{font-size:clamp(38px,4vw,58px)}.gx-hit2 .gx-big.gx-xl{font-size:clamp(28px,2.8vw,40px)}
.gx-hit2 .gx-q .gx-big{font-size:clamp(24px,2.4vw,32px)}
.gx-tiles.gx-t3{grid-template-columns:repeat(3,minmax(0,1fr))}.gx-tiles.gx-t2{grid-template-columns:repeat(2,minmax(0,1fr))}.gx-tiles.gx-t1{grid-template-columns:1fr}
.gx-side2 .gx-tile dd{font-size:clamp(22px,2vw,28px)}
.gx-verdict2{flex-direction:row;align-items:center;gap:18px}
.gx-verdict2 .gx-stamp{margin:0;flex:0 0 auto}
.gx-verdict2 .gx-v1{font-size:clamp(20px,1.9vw,25px)}
.gx-autopsy-body .gx-src{font:400 13px var(--mono);color:var(--muted);margin-top:16px}
.gx-autopsy-body .gx-line{margin-top:12px;padding-top:0;border:0;font-size:20px}
.gx-autopsy-body .gx-v2{margin-top:8px}
.gx-autopsy-body .gx-tiles{margin-top:16px}
.gx-autopsy-wrap{padding-bottom:40px}
.gx-sub2{padding:0 0 44px;border-top:none}
.gx-sub2 .signup{max-width:560px}
.gx-more{padding:40px 0 56px}
.gx-thumbs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:16px}
.gx-thumb{position:relative;display:block;text-decoration:none;color:var(--ink);min-width:0}
.gx-thumb img{width:100%;height:auto;aspect-ratio:1/1;border-radius:12px;border:1px solid var(--line-hard);background:var(--stone)}
.gx-thumb .gx-c-stamp{position:absolute;top:10px;right:10px;font-size:11px;padding:4px 8px;background:rgba(214,204,188,.92)}
.gx-thumb span:last-child{display:block;margin-top:8px;font:400 15px/1.25 var(--serif);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* one-line footer (overrides graveyard.css footer) */
footer.gx-foot{padding:20px 0}
.gx-foot .wrap{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px 24px}
.gx-foot .disc{font:400 13.5px/1.4 var(--sans);color:#cfc6b8;max-width:none}
.gx-foot .disc a{color:#e9a27e}
.gx-foot nav{display:flex;flex-wrap:wrap;gap:6px 18px;font-size:13.5px}
.gx-foot nav a{color:#cfc6b8;text-decoration:none}.gx-foot nav a:hover{color:#fff}

/* /graveyard/method */
.gx-mhead{padding:48px 0 30px;border-top:none}
.gx-mhead h1{font:400 clamp(36px,4.6vw,56px)/1.04 var(--serif);margin:14px 0 14px;max-width:20ch}
.gx-toc{display:flex;flex-wrap:wrap;gap:8px;margin-top:22px}
.gx-toc a{font:500 12px var(--mono);letter-spacing:.06em;text-decoration:none;border:1px solid var(--line-hard);background:var(--card-hi);border-radius:999px;padding:8px 14px}
.gx-toc a:hover{background:var(--ink);color:var(--stone-hi)}
.gx-disc-h{font:400 24px/1.25 var(--serif);margin-top:12px;max-width:46ch}
.gx-disc-long{margin-top:12px;font-size:14px;line-height:1.65;color:var(--ink-soft);max-width:90ch}

@media (max-width:960px){
  .gx-lhero-grid{grid-template-columns:minmax(0,1fr) minmax(0,400px);column-gap:36px}
  .gx-top2-grid{grid-template-columns:minmax(0,380px) minmax(0,1fr);column-gap:32px}
  .gx-top2-grid > .gx-facts2{grid-template-columns:1fr}
}
@media (max-width:699px){
  .gx-lhero{padding:22px 0 34px;min-height:0;display:block}
  .gx-lhero-grid{grid-template-columns:1fr;grid-template-areas:"head" "clip" "form";row-gap:18px}
  .gx-lh-head h1{font-size:clamp(34px,10vw,44px);max-width:none}
  .gx-lh-sub{margin-top:10px;font-size:16px}
  .gx-lh-clip{aspect-ratio:9/16;height:min(60vh,560px);width:auto;justify-self:center;border-radius:16px}
  .gx-grid{grid-template-columns:1fr;gap:20px}
  .gx-top2{padding:18px 0 32px}
  .gx-top2 h1{font-size:clamp(25px,7vw,32px);margin:6px 0 16px}
  .gx-top2-grid{grid-template-columns:1fr;grid-template-areas:"clip" "hit" "facts";row-gap:24px}
  .gx-top2-grid > .gx-facts2{grid-template-columns:1fr;gap:20px}
  .gx-top2-grid.gx-noside{grid-template-areas:"clip" "facts";row-gap:24px}
  .gx-clip2{aspect-ratio:9/16;height:min(62vh,600px);width:auto;justify-self:center}
  .gx-tiles.gx-t3{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
  .gx-side2 .gx-tile{padding:11px 10px 12px}
  .gx-side2 .gx-tile dd{font-size:20px}
  .gx-side2 .gx-tile dt{font-size:9.5px;letter-spacing:.04em}
  .gx-verdict2{flex-direction:column;align-items:flex-start;gap:12px}
  .gx-thumbs{gap:10px}
  .gx-thumb span:last-child{font-size:13px}
  .gx-foot .wrap{flex-direction:column;align-items:flex-start}
}
