/* AERTHEIX · What it answers · the spine and the six scenes below the film. Namespace ah-.
   Layers: L1 is always visible (impression, headline, promise, limit line, picture).
           L2 is one click (native <details>; the text is in the HTML, nothing is fetched).
   Tokens come from the page. No new font sizes: display = --ans-display, body = --fs-*.
   With scripts off, or with reduced motion, everything is simply there. */

.ah-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ---------- the dark field that holds the spine and the scenes ---------- */
.ah-spine,.ah-scenes{position:relative;color:var(--on-dark-body);background:#0A1F18}
.ah-spine{background:linear-gradient(180deg,#0A1F18,#0F2A21);padding:clamp(72px,10vw,132px) 0 clamp(56px,7vw,96px)}
.ah-scenes{background:linear-gradient(180deg,#0F2A21 0%,#0A1F18 14%,#0D261F 50%,#0A1F18 100%)}
.ah-spine-in{width:min(100% - 2*var(--gutter),var(--max));margin-inline:auto}

.ah-eyebrow{margin:0 0 20px;color:var(--gold-light);font:600 var(--fs-micro)/1.4 var(--sans);letter-spacing:.2em;text-transform:uppercase}
.ah-spine h2{margin:0;max-width:16ch;font:500 var(--ans-display)/1.04 var(--sans);letter-spacing:-.05em;color:#F7F4EE}
.ah-spine h2 em,.ah-scene h2 em{font:italic 400 1em/1.06 var(--display);letter-spacing:-.03em;color:var(--gold-light)}
.ah-spine-lead{max-width:44ch;margin:28px 0 0;color:var(--on-dark-body);font:400 var(--fs-lead)/1.5 var(--sans)}
.ah-pair{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(20px,4vw,64px);max-width:860px;margin-top:clamp(36px,5vw,60px);padding-top:28px;border-top:1px solid rgba(212,188,132,.22)}
.ah-pair b{display:block;margin-bottom:8px;color:var(--gold-light);font:italic 400 var(--fs-statement)/1.1 var(--display);letter-spacing:-.02em}
.ah-pair p{margin:0;color:var(--on-dark-fine);font:400 var(--fs-body)/1.55 var(--sans)}
.ah-spine-tools{display:flex;flex-wrap:wrap;align-items:flex-start;justify-content:space-between;gap:16px 32px;margin-top:clamp(36px,4vw,56px)}
.ah-spine-tools .ah-more{flex:1 1 560px}

/* ---------- a scene ---------- */
.ah-scene{position:relative;isolation:isolate;overflow:hidden;border-top:1px solid rgba(212,188,132,.12);
  padding:clamp(76px,10vh,128px) 0 clamp(36px,5vh,60px);scroll-margin-top:100px}
.ah-scene::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;opacity:.7;
  background:radial-gradient(circle at 14% 24%,rgba(255,236,190,.55) 0 1px,transparent 1.6px),radial-gradient(circle at 78% 14%,rgba(255,236,190,.4) 0 1px,transparent 1.6px),radial-gradient(circle at 52% 82%,rgba(255,236,190,.45) 0 1px,transparent 1.6px),radial-gradient(circle at 90% 66%,rgba(255,236,190,.35) 0 1px,transparent 1.6px),radial-gradient(circle at 30% 70%,rgba(255,236,190,.3) 0 1px,transparent 1.6px),radial-gradient(60% 50% at 30% 40%,rgba(27,74,58,.5),transparent 70%)}
.ah-scene-bg{position:absolute;inset:0;z-index:-1;pointer-events:none}
.ah-scene-bg img{position:absolute;top:0;right:0;width:56%;height:100%;object-fit:cover;opacity:.2;filter:saturate(.7);
  -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 62%);mask-image:linear-gradient(90deg,transparent 0,#000 62%)}
.ah-scene:nth-child(even) .ah-scene-bg img{right:auto;left:0;-webkit-mask-image:linear-gradient(270deg,transparent 0,#000 62%);mask-image:linear-gradient(270deg,transparent 0,#000 62%)}

.ah-scene-in{display:grid;grid-template-columns:minmax(0,1.04fr) minmax(0,.96fr);align-items:center;gap:clamp(28px,5vw,88px);
  width:min(100% - 2*var(--gutter),var(--max));margin-inline:auto}
.ah-scene:nth-child(even) .ah-art{order:-1}
.ah-copy{min-width:0}

.ah-no{display:flex;align-items:baseline;gap:14px;margin:0 0 clamp(22px,3vh,34px);color:var(--gold-light);font:600 var(--fs-micro)/1.3 var(--sans);letter-spacing:.2em;text-transform:uppercase}
.ah-no b{font:italic 400 var(--fs-statement)/1 var(--display);letter-spacing:-.02em;text-transform:none}
.ah-no span::before{content:"— ";opacity:.7}

/* the impression, then a gold line through it */
.ah-fuzzy{position:relative;margin:0 0 clamp(14px,2vh,22px);color:rgba(220,229,224,.7);font:italic 400 var(--fs-lead)/1.4 var(--display)}
.ah-fuzzy-label{display:block;margin-bottom:6px;color:var(--on-dark-fine);font:600 var(--fs-fine)/1.3 var(--sans);font-style:normal;letter-spacing:.14em;text-transform:uppercase}
.ah-q{position:relative;display:inline-block}
.ah-q::after{content:"";position:absolute;left:-2%;right:-2%;top:54%;height:2px;background:var(--gold);transform-origin:0 50%;transform:scaleX(1);opacity:.85}

.ah-scene h2{margin:0;max-width:14ch;font:500 var(--ans-display)/1.04 var(--sans);letter-spacing:-.05em;color:#F7F4EE;text-shadow:0 2px 30px rgba(5,18,14,.5)}
.ah-line{display:inline}
.ah-promise{max-width:40ch;margin:clamp(20px,3vh,30px) 0 0;color:var(--on-dark-body);font:400 var(--fs-lead)/1.5 var(--sans)}
.ah-limit{max-width:52ch;margin:clamp(18px,2.4vh,26px) 0 0;padding-left:16px;border-left:2px solid var(--gold);color:var(--on-dark-fine);font:400 var(--fs-fine)/1.55 var(--sans)}

/* ---------- the pictures ---------- */
.ah-art{min-width:0;position:relative}
.ah-panel{position:relative;padding:clamp(20px,2.4vw,32px);border-radius:10px;border:1px solid rgba(212,188,132,.3);
  background:linear-gradient(180deg,rgba(244,239,228,.1),rgba(244,239,228,.04));box-shadow:0 44px 70px -44px rgba(0,0,0,.85);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.ah-panel-title{margin:0 0 18px;color:var(--gold-light);font:600 var(--fs-fine)/1.4 var(--sans);letter-spacing:.14em;text-transform:uppercase}
.ah-panel-foot{display:block;margin-top:16px;color:var(--on-dark-fine);font:italic 400 var(--fs-fine)/1.4 var(--display)}
.ah-panel b{color:#fff;font-weight:600}

/* 01 · what VS1 contributes to a 9-box discussion */
.ah-row{display:grid;grid-template-columns:7.5em minmax(0,1fr);gap:4px 16px;padding:14px 0;border-top:1px solid rgba(212,188,132,.18)}
.ah-row:first-of-type{border-top:0;padding-top:0}
.ah-row-k{color:var(--on-dark-fine);font:600 var(--fs-fine)/1.5 var(--sans);letter-spacing:.1em;text-transform:uppercase}
.ah-row-v{color:var(--on-dark-body);font:400 var(--fs-body)/1.5 var(--sans)}
.ah-row-v b{display:inline-grid;place-items:center;width:1.7em;height:1.7em;margin:0 .45em 0 .9em;border-radius:50%;background:rgba(212,188,132,.16);color:var(--gold-light);font:italic 400 1em/1 var(--display)}
.ah-row-v b:first-child{margin-left:0}
.ah-row small{grid-column:2;color:var(--on-dark-fine);font:italic 400 var(--fs-fine)/1.4 var(--display)}
.ah-row--gap .ah-row-v{display:inline-block;justify-self:start;padding:2px 12px;border:1px dashed rgba(212,188,132,.55);border-radius:99px;color:var(--gold-light)}

/* 02 · one result, four problems */
.ah-gap-src{display:inline-block;margin-bottom:22px;padding:10px 18px;border-radius:8px;background:rgba(244,239,228,.92);color:#1D2B25}
.ah-gap-src small{display:block;color:#5C6862;font:600 var(--fs-fine)/1.3 var(--sans);letter-spacing:.1em;text-transform:uppercase}
.ah-gap-src strong{font:500 var(--fs-body)/1.3 var(--sans)}
.ah-gap-list{list-style:none;margin:0;padding:0 0 0 24px;border-left:2px solid rgba(212,188,132,.45)}
.ah-gap-list li{position:relative;padding:11px 0}
.ah-gap-list li::before{content:"";position:absolute;left:-24px;top:50%;width:22px;border-top:2px solid rgba(212,188,132,.45)}
.ah-gap-list b{display:block;color:#fff;font:600 var(--fs-body)/1.3 var(--sans)}
.ah-gap-list span{color:var(--on-dark-fine);font:400 var(--fs-label)/1.45 var(--sans)}

/* 03 · the decision file: a paper card, like the observation cards in the film */
.ah-file{position:relative;max-width:460px;margin-inline:auto;border-radius:6px;background:#F4EFE4;color:#1D2B25;transform:rotate(-1.4deg);box-shadow:0 50px 70px -40px rgba(0,0,0,.9)}
.ah-scene:nth-child(even) .ah-file{transform:rotate(1.2deg)}
.ah-file-head{display:flex;align-items:baseline;justify-content:space-between;padding:12px 22px;border-radius:6px 6px 0 0;background:var(--gold);color:#0F2A21;font:700 var(--fs-fine)/1.3 var(--sans);letter-spacing:.2em;text-transform:uppercase}
.ah-file-head small{font:italic 400 var(--fs-fine)/1.3 var(--display);letter-spacing:0;text-transform:none}
.ah-file-rows{list-style:none;margin:0;padding:6px 22px 28px;counter-reset:none}
.ah-file-rows li{display:grid;grid-template-columns:2.4em minmax(0,1fr);gap:0 8px;padding:15px 0;border-bottom:1px solid rgba(29,43,37,.14);font:400 var(--fs-label)/1.5 var(--sans);color:#4B5852}
.ah-file-rows li:last-child{border-bottom:0}
.ah-file-rows b{color:#735818;font:italic 400 var(--fs-statement)/1 var(--display)}
.ah-file-rows strong{display:block;margin-bottom:2px;color:#0F2A21;font:600 var(--fs-body)/1.3 var(--sans)}
.ah-xyz{display:flex;gap:8px;margin-top:8px}
.ah-xyz i{display:grid;place-items:center;width:2em;height:2em;border-radius:6px;background:rgba(15,42,33,.08);color:#0F2A21;font:italic 400 var(--fs-body)/1 var(--display)}
.ah-stamp{position:absolute;right:16px;bottom:14px;padding:3px 12px;border:2px solid #735818;border-radius:4px;color:#735818;font:italic 600 var(--fs-body)/1.3 var(--display);letter-spacing:.02em;transform:rotate(-6deg)}

/* 04 · three responses */
.ah-opts{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.ah-opts li{padding:16px 18px;border-radius:8px;background:rgba(10,31,24,.55);border:1px solid rgba(212,188,132,.2)}
.ah-opts b{display:block;margin-bottom:3px;color:#fff;font:italic 400 var(--fs-statement)/1.15 var(--display);letter-spacing:-.01em;font-weight:400}
.ah-opts span{color:var(--on-dark-body);font:400 var(--fs-label)/1.5 var(--sans)}

/* 05 · four responses */
.ah-four{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.ah-four li{padding:18px 18px 20px;border-radius:8px;background:rgba(10,31,24,.55);border:1px solid rgba(212,188,132,.2);border-top:3px solid var(--gold)}
.ah-four li:nth-child(2){border-top-color:#C8AE72}.ah-four li:nth-child(3){border-top-color:#9FB6A2}.ah-four li:nth-child(4){border-top-color:rgba(244,239,228,.55);border-top-style:dashed}
.ah-four b{display:block;margin-bottom:4px;color:#fff;font:italic 400 var(--fs-statement)/1.1 var(--display);font-weight:400}
.ah-four span{color:var(--on-dark-body);font:400 var(--fs-label)/1.5 var(--sans)}

/* 06 · two readings */
.ah-cmp-cols{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);gap:12px;align-items:center}
.ah-cmp-h{margin:0 0 10px;color:var(--gold-light);font:600 var(--fs-fine)/1.4 var(--sans);letter-spacing:.14em;text-transform:uppercase}
.ah-cmp ul{list-style:none;margin:0;padding:0}
.ah-cmp-cols li{display:flex;gap:10px;align-items:baseline;padding:8px 0;border-top:1px solid rgba(212,188,132,.16);color:var(--on-dark-body);font:400 var(--fs-label)/1.4 var(--sans)}
.ah-cmp-cols li b{width:1.2em;color:var(--gold-light);font:italic 400 var(--fs-body)/1 var(--display)}
.ah-cmp-cols li.is-moved{color:#fff}
.ah-cmp-cols li.is-moved span{padding:0 8px;border-radius:99px;background:rgba(212,188,132,.2)}
.ah-cmp-arrow{color:var(--gold-light);font:400 var(--fs-statement)/1 var(--sans)}
.ah-outcomes{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:22px 0 0;padding:0;list-style:none}
.ah-outcomes li{padding:11px 14px;border-radius:8px;background:rgba(10,31,24,.55);border:1px solid rgba(212,188,132,.2)}
.ah-outcomes b{display:block;color:#fff;font:600 var(--fs-label)/1.3 var(--sans)}
.ah-outcomes span{color:var(--on-dark-fine);font:400 var(--fs-fine)/1.4 var(--sans)}

/* ---------- L2: the menu-bar disclosure ---------- */
.ah-more{grid-column:1/-1;margin-top:clamp(24px,4vh,44px);border-top:1px solid rgba(212,188,132,.3);border-bottom:1px solid rgba(212,188,132,.3)}
.ah-more[open]{background:rgba(244,239,228,.03)}
.ah-more summary{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px 4px;cursor:pointer;list-style:none;color:var(--gold-light);font:600 var(--fs-micro)/1.3 var(--sans);letter-spacing:.2em;text-transform:uppercase;transition:color .2s,background .2s}
.ah-more summary::-webkit-details-marker{display:none}
.ah-more summary:hover{color:#fff}
.ah-more summary:focus-visible{outline:2px solid var(--gold-light);outline-offset:2px}
.ah-more summary i{position:relative;flex:none;width:22px;height:22px;border:1px solid rgba(212,188,132,.55);border-radius:50%}
.ah-more summary i::before,.ah-more summary i::after{content:"";position:absolute;left:50%;top:50%;width:10px;height:1.5px;margin:-.75px 0 0 -5px;background:var(--gold-light);transition:transform .25s ease}
.ah-more summary i::after{transform:rotate(90deg)}
.ah-more[open] summary i::after{transform:rotate(0)}
.ah-more-body{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(20px,3vw,48px);padding:6px 4px clamp(24px,3vw,40px)}
.ah-more[open] .ah-more-body{animation:ah-open .45s cubic-bezier(.2,.7,.2,1)}
@keyframes ah-open{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:none}}
.ah-block h3{margin:0 0 10px;color:var(--gold-light);font:600 var(--fs-fine)/1.4 var(--sans);letter-spacing:.12em;text-transform:uppercase}
.ah-block p{margin:0 0 12px;color:var(--on-dark-body);font:400 var(--fs-label)/1.65 var(--sans);max-width:60ch}
.ah-block p b,.ah-block li b{color:#fff;font-weight:600}
.ah-src{color:var(--on-dark-fine)!important;font-size:var(--fs-fine)!important}
.ah-list{margin:0;padding:0 0 0 1.1em;color:var(--on-dark-body);font:400 var(--fs-label)/1.6 var(--sans)}
.ah-list li{margin-bottom:10px;padding-left:4px}
.ah-facts{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.ah-facts li{display:grid;grid-template-columns:4.4em minmax(0,1fr);gap:12px;align-items:baseline;color:var(--on-dark-body);font:400 var(--fs-label)/1.5 var(--sans)}
.ah-facts b{white-space:nowrap;color:var(--gold-light);font:italic 400 var(--fs-statement)/1 var(--display)}

.ah-openall{flex:none;align-self:center;padding:12px 20px;border:1px solid rgba(212,188,132,.5);border-radius:99px;background:transparent;color:var(--gold-light);font:600 var(--fs-micro)/1 var(--sans);letter-spacing:.14em;text-transform:uppercase;cursor:pointer;transition:background .2s,color .2s}
.ah-openall:hover,.ah-openall[aria-pressed="true"]{background:var(--gold-light);color:#0F2A21}
.ah-openall:focus-visible{outline:2px solid var(--gold-light);outline-offset:3px}

/* ---------- entrance: set up by scenes.js, so without it nothing is ever hidden ---------- */
html.ah-armed .ah-scene .ah-reveal,html.ah-armed .ah-spine .ah-reveal{opacity:0;transform:translateY(20px);
  transition:opacity .8s ease,transform .8s cubic-bezier(.2,.7,.2,1);transition-delay:calc(var(--d,0) * 90ms)}
html.ah-armed .ah-scene.is-in .ah-reveal,html.ah-armed .ah-spine.is-in .ah-reveal{opacity:1;transform:none}
html.ah-armed .ah-scene .ah-art.ah-reveal{transform:translateY(28px) scale(.985)}
html.ah-armed .ah-scene.is-in .ah-art.ah-reveal{transform:none}
html.ah-armed .ah-scene .ah-q::after{transform:scaleX(0)}
html.ah-armed .ah-scene.is-in .ah-q::after{transform:scaleX(1);transition:transform .7s cubic-bezier(.65,0,.2,1) .7s}
html.ah-armed .ah-scene .ah-fuzzy{transition:opacity .8s ease .1s,transform .8s cubic-bezier(.2,.7,.2,1) .1s,color .6s ease 1.3s}
html.ah-armed .ah-scene.is-in .ah-fuzzy{color:rgba(220,229,224,.5)}

/* ---------- tablet and phone ---------- */
@media(max-width:1000px){
  .ah-scene-in{grid-template-columns:minmax(0,1fr)}
  .ah-scene:nth-child(even) .ah-art{order:0}
  .ah-scene-bg img{width:100%;opacity:.12;-webkit-mask-image:linear-gradient(180deg,#000,transparent 80%);mask-image:linear-gradient(180deg,#000,transparent 80%)}
  .ah-scene:nth-child(even) .ah-scene-bg img{-webkit-mask-image:linear-gradient(180deg,#000,transparent 80%);mask-image:linear-gradient(180deg,#000,transparent 80%)}
  .ah-scene h2{max-width:18ch}
  .ah-more-body{grid-template-columns:minmax(0,1fr)}
  .ah-file{margin-inline:0}
}
@media(max-width:560px){
  .ah-pair{grid-template-columns:minmax(0,1fr)}
  .ah-row{grid-template-columns:minmax(0,1fr)}
  .ah-row small{grid-column:1}
  .ah-four,.ah-outcomes{grid-template-columns:minmax(0,1fr)}
  .ah-cmp-cols{grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);gap:8px}
}
@media(prefers-reduced-motion:reduce){
  html.ah-armed .ah-reveal{opacity:1!important;transform:none!important;transition:none!important}
  html.ah-armed .ah-scene .ah-q::after{transform:scaleX(1)!important;transition:none!important}
  .ah-more[open] .ah-more-body{animation:none}
}
@media print{.ah-scene-bg{display:none}.ah-scenes,.ah-spine{background:#fff;color:#000}}

/* page-wide summary "+" belongs to the old accordions; ours draws its own icon */
.ans-page .ah-more>summary::after,.ans-page .ah-more[open]>summary::after{content:none!important;display:none!important}
.ah-spine h2 em,.ah-scene h2 em{display:block;line-height:.98;margin-top:-.04em}
.ah-spine h2,.ah-scene h2{line-height:1}
.ah-no{flex-wrap:wrap;row-gap:4px}
.ah-fuzzy{margin-top:0}

/* the page resets paragraph margins with a higher-specificity rule; restate ours at the same weight */
body[data-page="what-it-answers"] .ah-scene .ah-no,body[data-page="what-it-answers"] .ah-spine .ah-no{margin:0 0 clamp(26px,3.6vh,40px)}
body[data-page="what-it-answers"] .ah-scene .ah-fuzzy{margin:0 0 clamp(14px,2vh,22px)}
body[data-page="what-it-answers"] .ah-scene .ah-promise{margin:clamp(22px,3.2vh,32px) 0 0}
body[data-page="what-it-answers"] .ah-scene .ah-limit{margin:clamp(18px,2.6vh,28px) 0 0}
body[data-page="what-it-answers"] .ah-spine .ah-spine-lead{margin:28px 0 0}
body[data-page="what-it-answers"] .ah-scene h2{max-width:none;font-size:var(--fs-h1);letter-spacing:-.045em}
body[data-page="what-it-answers"] .ah-panel .ah-panel-title,body[data-page="what-it-answers"] .ah-panel .ah-cmp-h{margin:0 0 14px}
body[data-page="what-it-answers"] .ah-panel .ah-panel-foot{margin:16px 0 0}
body[data-page="what-it-answers"] .ah-more-body p,body[data-page="what-it-answers"] .ah-more-body li{margin-top:0}
.ah-cmp-cols{align-items:start}

/* =====================================================================
   Round 2: 9-box figure, hover re-strike, light scenes, limits, closing CTA
   ===================================================================== */

/* ---- 01 · a 9-box with nobody in it: VS1 feeds the two axes, the review decides the rest ---- */
.ah-nine{display:grid;grid-template-columns:minmax(0,236px) minmax(0,1fr);gap:clamp(18px,2.4vw,32px);align-items:center}
.ah-nine-fig{position:relative;display:grid;grid-template-columns:auto minmax(0,1fr);grid-template-rows:auto auto;gap:8px 10px}
.ah-nine-grid{grid-column:2;aspect-ratio:1;display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(3,1fr);gap:4px;padding:4px;border-radius:6px;border:1px solid rgba(212,188,132,.35);background:rgba(10,31,24,.35)}
.ah-nine-grid i{border-radius:3px;background:rgba(244,239,228,.07);border:1px solid rgba(212,188,132,.16)}
.ah-nine-y,.ah-nine-x{display:flex;align-items:center;gap:6px;color:var(--gold-light);font:600 var(--fs-micro)/1 var(--sans);letter-spacing:.16em;text-transform:uppercase;white-space:nowrap}
.ah-nine-y{grid-column:1;grid-row:1;writing-mode:vertical-rl;transform:rotate(180deg);justify-self:center}
.ah-nine-x{grid-column:2;grid-row:2;justify-content:flex-end}
.ah-nine-y::after,.ah-nine-x::after{content:"";width:18px;height:1px;background:currentColor;opacity:.6}
.ah-nine-x::after{order:-1}
.ah-nine-y b,.ah-nine-x b{display:inline-grid;place-items:center;width:1.9em;height:1.9em;border-radius:50%;background:rgba(212,188,132,.18);color:var(--gold-light);font:italic 400 var(--fs-fine)/1 var(--display);letter-spacing:0;text-transform:none}
.ah-nine-y b{transform:rotate(180deg)}
.ah-nine-key{list-style:none;margin:0;padding:0;display:grid;gap:0}
.ah-nine-key li{display:grid;gap:3px;padding:14px 0;border-top:1px solid rgba(212,188,132,.18)}
.ah-nine-key li:first-child{border-top:0;padding-top:0}
.ah-nine-key .ah-row-v b{margin-left:.7em}
.ah-nine-key .ah-row-v b:first-child{margin-left:0}
.ah-nine-key small{color:var(--on-dark-fine);font:italic 400 var(--fs-fine)/1.4 var(--display)}
.ah-nine-key .ah-row--gap .ah-row-v{justify-self:start}
@media(max-width:560px){.ah-nine{grid-template-columns:minmax(0,1fr)}.ah-nine-fig{max-width:260px}}

/* ---- the strike-through is redrawn each time you point at the impression ---- */
@keyframes ah-restrike{from{transform:scaleX(0)}to{transform:scaleX(1)}}
.ah-fuzzy{width:fit-content;max-width:100%}
.ah-fuzzy .ah-q{transition:color .3s ease}
@media(hover:hover){
  .ah-fuzzy:hover .ah-q::after{animation:ah-restrike .8s cubic-bezier(.65,0,.2,1)}
  html.ah-armed .ah-scene.is-in .ah-fuzzy:hover{color:rgba(240,245,242,.95);transition:color .25s ease 0s}
  html.ah-armed .ah-scene--light.is-in .ah-fuzzy:hover{color:#2B313E}
}
.ah-fuzzy.is-redraw .ah-q::after{animation:ah-restrike .8s cubic-bezier(.65,0,.2,1)}
@media(prefers-reduced-motion:reduce){.ah-fuzzy:hover .ah-q::after,.ah-fuzzy.is-redraw .ah-q::after{animation:none}}

/* ---- light scenes: 03, 05, 06. Green is kept for the moments that matter. ---- */
.ah-scene--light{color:var(--ink);border-top:1px solid rgba(15,42,33,.1);background:linear-gradient(180deg,#FAF8F4,#F2EEE9)}
.ah-scene--light::before{display:none}
.ah-scene--light .ah-scene-bg img{opacity:.5;filter:saturate(.55) contrast(.92) brightness(1.08);mix-blend-mode:multiply}
.ah-scene--light .ah-no{color:var(--gold-access)}
.ah-scene--light .ah-fuzzy{color:#6B7280}
.ah-scene--light .ah-fuzzy-label{color:var(--fine)}
html.ah-armed .ah-scene--light.is-in .ah-fuzzy{color:#6B7280}
.ah-scene--light .ah-q::after{background:var(--gold-access)}
body[data-page="what-it-answers"] .ah-scene--light h2{color:var(--forest-deep);text-shadow:none}
.ah-scene--light h2 em{color:var(--gold-access)}
.ah-scene--light .ah-promise{color:var(--ink)}
.ah-scene--light .ah-limit{color:var(--fine);border-left-color:var(--gold)}
.ah-scene--light .ah-more{border-color:rgba(15,42,33,.22)}
.ah-scene--light .ah-more[open]{background:rgba(15,42,33,.025)}
.ah-scene--light .ah-more summary{color:var(--forest)}
.ah-scene--light .ah-more summary:hover{color:var(--forest-deep)}
.ah-scene--light .ah-more summary:focus-visible{outline-color:var(--forest)}
.ah-scene--light .ah-more summary i{border-color:rgba(23,67,52,.55)}
.ah-scene--light .ah-more summary i::before,.ah-scene--light .ah-more summary i::after{background:var(--forest)}
.ah-scene--light .ah-block h3{color:var(--gold-access)}
.ah-scene--light .ah-block p,.ah-scene--light .ah-list{color:var(--ink)}
.ah-scene--light .ah-block p b,.ah-scene--light .ah-block li b{color:var(--forest-deep)}
.ah-scene--light .ah-src{color:var(--fine)!important}
.ah-scene--light .ah-panel{border-color:rgba(15,42,33,.14);background:rgba(255,255,255,.78);box-shadow:0 30px 60px -38px rgba(15,42,33,.35);-webkit-backdrop-filter:none;backdrop-filter:none}
.ah-scene--light .ah-panel-title,.ah-scene--light .ah-cmp-h{color:var(--gold-access)}
.ah-scene--light .ah-panel-foot{color:var(--fine)}
.ah-scene--light .ah-panel b{color:var(--forest-deep)}
.ah-scene--light .ah-four li,.ah-scene--light .ah-outcomes li{background:#fff;border-color:rgba(15,42,33,.14)}
.ah-scene--light .ah-four li{border-top-color:var(--gold)}
.ah-scene--light .ah-four li:nth-child(2){border-top-color:#B79B5D}
.ah-scene--light .ah-four li:nth-child(3){border-top-color:#6F9477}
.ah-scene--light .ah-four li:nth-child(4){border-top-color:rgba(15,42,33,.4)}
.ah-scene--light .ah-four b,.ah-scene--light .ah-outcomes b{color:var(--forest-deep)}
.ah-scene--light .ah-four span,.ah-scene--light .ah-outcomes span{color:var(--fine)}
.ah-scene--light .ah-cmp-cols li{border-top-color:rgba(15,42,33,.14);color:var(--ink)}
.ah-scene--light .ah-cmp-cols li b{color:var(--gold-access)}
.ah-scene--light .ah-cmp-cols li.is-moved{color:var(--forest-deep)}
.ah-scene--light .ah-cmp-cols li.is-moved span{background:rgba(184,152,90,.25)}
.ah-scene--light .ah-cmp-arrow{color:var(--gold-access)}
.ah-scene--light .ah-file{box-shadow:0 0 0 1px rgba(15,42,33,.1),0 36px 54px -34px rgba(15,42,33,.45);background:#fff}
.ah-scene--light .ah-file-rows li{border-bottom-color:rgba(15,42,33,.12)}

/* ---- limits, in one place ---- */
.ah-limits{background:#EEE7D9;color:var(--ink);padding:clamp(56px,7vw,96px) 0;border-top:1px solid rgba(15,42,33,.1)}
.ah-limits-in{width:min(100% - 2*var(--gutter),var(--max));margin-inline:auto}
.ah-limits .ah-eyebrow{color:var(--gold-access)}
body[data-page="what-it-answers"] .ah-limits h2{margin:0;max-width:20ch;font:500 var(--fs-h2)/1.08 var(--sans);letter-spacing:-.04em;color:var(--forest-deep)}
.ah-limits h2 em{font:italic 400 1em/1.08 var(--display);color:var(--gold-access);letter-spacing:-.02em}
body[data-page="what-it-answers"] .ah-limits .ah-limits-lead{max-width:56ch;margin:20px 0 0;color:var(--forest);font:500 var(--fs-lead)/1.45 var(--sans)}
.ah-limits-list{list-style:none;margin:clamp(28px,4vw,44px) 0 0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 clamp(24px,3vw,48px)}
.ah-limits-list li{padding:20px 0;border-top:1px solid rgba(15,42,33,.2)}
.ah-limits-list a{display:flex;gap:12px;align-items:baseline;color:var(--forest);text-decoration:none;font:600 var(--fs-micro)/1.4 var(--sans);letter-spacing:.14em;text-transform:uppercase}
.ah-limits-list a:hover span{text-decoration:underline;text-decoration-color:var(--gold)}
.ah-limits-list a:focus-visible{outline:2px solid var(--forest);outline-offset:3px}
.ah-limits-list b{color:var(--gold-access);font:italic 400 var(--fs-statement)/1 var(--display);letter-spacing:-.02em;text-transform:none}
body[data-page="what-it-answers"] .ah-limits-list p{margin:10px 0 0;color:var(--ink);font:400 var(--fs-body)/1.55 var(--sans)}
@media(max-width:1000px){.ah-limits-list{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:560px){.ah-limits-list{grid-template-columns:minmax(0,1fr)}}

/* ---- closing CTA: one primary action, two paths with their reason ---- */
.ah-cta .ans-cta-actions{display:flex;justify-content:center;margin-top:30px}
.ah-paths{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;max-width:760px;margin:clamp(34px,4vw,52px) auto 0;text-align:left}
.ah-path{position:relative;display:block;padding:22px 52px 22px 24px;border:1px solid rgba(15,42,33,.16);border-radius:6px;background:rgba(255,255,255,.7);color:var(--ink);text-decoration:none;transition:border-color .25s,box-shadow .25s,transform .25s}
.ah-path small{display:block;margin-bottom:8px;color:var(--gold-access);font:600 var(--fs-micro)/1.3 var(--sans);letter-spacing:.18em;text-transform:uppercase}
.ah-path strong{display:block;margin-bottom:6px;color:var(--forest-deep);font:500 var(--fs-h4)/1.25 var(--sans);letter-spacing:-.02em}
.ah-path-text>span{display:block;color:var(--fine);font:400 var(--fs-label)/1.55 var(--sans)}
.ah-path i{position:absolute;right:20px;top:20px;color:var(--gold-access);font:400 var(--fs-body)/1 var(--sans);font-style:normal;transition:transform .25s}
.ah-path:focus-visible{outline:2px solid var(--forest);outline-offset:3px}
@media(hover:hover){.ah-path:hover{border-color:var(--gold);box-shadow:0 20px 34px -24px rgba(15,42,33,.4);transform:translateY(-2px)}.ah-path:hover i{transform:translate(2px,-2px)}}
@media(max-width:700px){.ah-paths{grid-template-columns:minmax(0,1fr)}}
@media print{.ah-scene--light .ah-scene-bg{display:none}.ah-limits{background:#fff}}

/* round 2 fixes */
.ah-nine{grid-template-columns:minmax(0,252px) minmax(0,1fr)}
.ah-nine-y{writing-mode:vertical-rl;transform:rotate(180deg)}
.ah-chip{display:block;margin-top:6px}
.ah-chip:first-child{margin-top:0}
.ah-nine-key .ah-chip b{margin-left:0}
body[data-page="what-it-answers"] .ah-spine .ah-eyebrow,body[data-page="what-it-answers"] .ah-limits .ah-eyebrow{margin:0 0 20px}
.ah-scene--light .ah-panel{background:rgba(255,255,255,.92)}
@media(max-width:560px){.ah-nine{grid-template-columns:minmax(0,1fr)}.ah-nine-fig{max-width:260px}}
@media(max-width:1000px){.ah-scene--light .ah-scene-bg img{opacity:.2}}
.ah-scene--light .ah-no,.ah-scene--light .ah-no b{color:#735818}
.ah-scene--light .ah-fuzzy,html.ah-armed .ah-scene--light.is-in .ah-fuzzy{color:var(--fine)}
.ah-scene--light .ah-block h3{color:#735818}
.ah-scene--light .ah-more[open]{background:rgba(250,248,244,.95)}
.ah-limits .ah-eyebrow,.ah-limits-list b,.ah-limits h2 em{color:#735818}

/* =====================================================================
   Round 3: full-width spine disclosure, light 9-box card, picture paths
   ===================================================================== */

/* the spine's disclosure opens across the whole row, like the scenes' */
.ah-spine-tools{display:block}
.ah-spine-tools .ah-more{flex:none;width:100%}
.ah-spine .ah-more-body{grid-template-columns:repeat(3,minmax(0,1fr))}
/* numbers: one column as wide as the widest figure, so "3-in-1" never runs into its text */
.ah-facts{grid-template-columns:max-content minmax(0,1fr);column-gap:clamp(14px,1.6vw,22px);row-gap:14px;align-items:baseline}
.ah-facts li{display:contents}
.ah-facts b{padding-top:0}
@media(max-width:1000px){.ah-spine .ah-more-body{grid-template-columns:minmax(0,1fr)}}

/* 01 · the 9-box sits on a light card so it reads against the green */
body[data-page="what-it-answers"] .ah-nine-panel{background:#F6F2E8;border-color:rgba(184,152,90,.7);color:var(--ink);box-shadow:0 44px 70px -40px rgba(0,0,0,.7);-webkit-backdrop-filter:none;backdrop-filter:none}
.ah-nine-panel .ah-panel-title{color:#735818}
.ah-nine-panel .ah-nine-grid{border-color:rgba(15,42,33,.3);background:rgba(15,42,33,.07)}
.ah-nine-panel .ah-nine-grid i{background:#fff;border-color:rgba(15,42,33,.18)}
.ah-nine-panel .ah-nine-y,.ah-nine-panel .ah-nine-x{color:var(--forest)}
.ah-nine-panel .ah-row-k{color:var(--fine)}
.ah-nine-panel .ah-row-v{color:var(--forest-deep)}
.ah-nine-panel .ah-nine-key li{border-top-color:rgba(15,42,33,.16)}
.ah-nine-panel .ah-row-v b{background:rgba(15,42,33,.09);color:var(--forest-deep)}
.ah-nine-panel .ah-nine-key small{color:var(--fine)}
.ah-nine-panel .ah-row--gap .ah-row-v{display:inline-block;padding:4px 14px;border:1px dashed #735818;border-radius:14px;color:#735818}

/* closing CTA: each path has a small picture on its left */
.ah-path{display:grid;grid-template-columns:104px minmax(0,1fr);gap:20px;align-items:center;padding:14px 48px 14px 14px}
.ah-path img{width:104px;height:104px;object-fit:cover;border-radius:4px;filter:saturate(.85)}
.ah-path:first-child img{object-position:50% 38%}
.ah-path-text{display:block;min-width:0}
@media(max-width:700px){.ah-path{grid-template-columns:88px minmax(0,1fr);gap:16px}.ah-path img{width:88px;height:88px}}
.ah-path{grid-template-columns:132px minmax(0,1fr);gap:22px;padding:0 48px 0 0;overflow:hidden;align-items:stretch}
.ah-path img{width:132px;height:100%;min-height:132px;border-radius:0}
.ah-path-text{align-self:center;padding:20px 0}
@media(max-width:700px){.ah-path{grid-template-columns:96px minmax(0,1fr);gap:16px}.ah-path img{width:96px;min-height:96px}}
.ah-path:nth-child(2) img{object-position:12% 50%}

/* =====================================================================
   Round 4: every picture answers the pointer. All of it is decoration:
   nothing here carries meaning that is not already in the text.
   ===================================================================== */

/* ---- 01 · nine squares, each a little different. No order, no gradient, no label:
        a heat-map pattern here would read as a placement grid, which VS1 does not make (C-023). ---- */
.ah-nine-grid i{transition:transform .35s cubic-bezier(.2,.7,.2,1),box-shadow .35s ease,border-color .3s ease,background .3s ease,opacity .3s ease}
.ah-nine-panel .ah-nine-grid i:nth-child(1){background:#FFFFFF}
.ah-nine-panel .ah-nine-grid i:nth-child(2){background:#FBF7EE}
.ah-nine-panel .ah-nine-grid i:nth-child(3){background:#F2F6F1}
.ah-nine-panel .ah-nine-grid i:nth-child(4){background:#FAF4E7}
.ah-nine-panel .ah-nine-grid i:nth-child(5){background:#F7F2E8}
.ah-nine-panel .ah-nine-grid i:nth-child(6){background:#FEFEFC}
.ah-nine-panel .ah-nine-grid i:nth-child(7){background:#F0F5EF}
.ah-nine-panel .ah-nine-grid i:nth-child(8){background:#FCF8EF}
.ah-nine-panel .ah-nine-grid i:nth-child(9){background:#F6F1E4}
.ah-nine-panel .ah-nine-grid i:nth-child(2n){border-radius:5px 3px 4px 3px}
.ah-nine-panel .ah-nine-grid i:nth-child(3n){border-radius:3px 5px 3px 4px}
.ah-nine-panel .ah-nine-grid i:nth-child(5){border-radius:4px}
@media(hover:hover){
  .ah-nine-panel .ah-nine-grid i:hover{transform:translateY(-3px) scale(1.05);border-color:var(--gold);background:#FFFDF6;box-shadow:0 10px 18px -8px rgba(138,109,50,.55),0 0 0 1px var(--gold);z-index:1}
  /* pointing at a line of the key lights what it speaks about */
  .ah-nine:has(.ah-nine-key li:nth-child(1):hover) .ah-nine-grid i{box-shadow:inset 3px 0 0 rgba(184,152,90,.55),inset -3px 0 0 rgba(184,152,90,.55)}
  .ah-nine:has(.ah-nine-key li:nth-child(1):hover) .ah-nine-x{color:#735818}
  .ah-nine:has(.ah-nine-key li:nth-child(2):hover) .ah-nine-grid i{box-shadow:inset 0 3px 0 rgba(184,152,90,.55),inset 0 -3px 0 rgba(184,152,90,.55)}
  .ah-nine:has(.ah-nine-key li:nth-child(2):hover) .ah-nine-y{color:#735818}
  .ah-nine:has(.ah-nine-key li:nth-child(3):hover) .ah-nine-grid i{border-style:dashed;border-color:#735818;opacity:.72}
  .ah-nine-key li{transition:transform .3s cubic-bezier(.2,.7,.2,1)}
  .ah-nine-key li:hover{transform:translateX(5px)}
}
/* entrance: the squares settle one by one, in no particular order */
html.ah-armed .ah-scene:not(.is-in) .ah-nine-grid i{opacity:0}
html.ah-armed .ah-scene.is-in .ah-nine-grid i{animation:ah-cell .55s cubic-bezier(.2,.7,.2,1) backwards;animation-delay:calc(var(--k,0) * 70ms + .9s)}
@keyframes ah-cell{from{opacity:0;transform:scale(.86)}to{opacity:1;transform:none}}
.ah-nine-grid i:nth-child(1){--k:4}.ah-nine-grid i:nth-child(2){--k:1}.ah-nine-grid i:nth-child(3){--k:7}.ah-nine-grid i:nth-child(4){--k:3}.ah-nine-grid i:nth-child(5){--k:0}.ah-nine-grid i:nth-child(6){--k:5}.ah-nine-grid i:nth-child(7){--k:8}.ah-nine-grid i:nth-child(8){--k:2}.ah-nine-grid i:nth-child(9){--k:6}

@media(hover:hover){
/* ---- 02 · the four causes: the one you point at steps forward ---- */
  .ah-gap-list li{transition:transform .3s cubic-bezier(.2,.7,.2,1)}
  .ah-gap-list li::before{transition:border-color .25s ease,width .25s ease}
  .ah-gap-list li::after{content:"";position:absolute;left:-30px;top:50%;width:10px;height:10px;margin-top:-5px;border-radius:50%;background:var(--gold-light);box-shadow:0 0 12px rgba(230,184,79,.7);transform:scale(0);transition:transform .25s cubic-bezier(.2,.7,.2,1)}
  .ah-gap-list li:hover{transform:translateX(8px)}
  .ah-gap-list li:hover::before{border-top-color:var(--gold-light);width:28px}
  .ah-gap-list li:hover::after{transform:scale(1)}
  .ah-gap-list li:hover b{color:var(--gold-light)}
  .ah-gap-list li:hover span{color:#fff}
  .ah-gap-src{transition:transform .3s ease,box-shadow .3s ease}
  .ah-art:hover .ah-gap-src{transform:translateY(-2px);box-shadow:0 12px 24px -14px rgba(0,0,0,.6)}

/* ---- 03 · the decision file squares up, the row you point at is marked, the stamp lands again ---- */
  .ah-scene .ah-file{transition:transform .55s cubic-bezier(.2,.7,.2,1),box-shadow .55s ease}
  .ah-scene .ah-file:hover{transform:rotate(0) translateY(-8px);box-shadow:0 0 0 1px rgba(15,42,33,.12),0 44px 60px -30px rgba(15,42,33,.55)}
  .ah-file-rows li{transition:background .25s ease,transform .25s ease}
  .ah-file-rows li:hover{background:linear-gradient(90deg,rgba(184,152,90,.16),rgba(184,152,90,0));transform:translateX(4px)}
  .ah-file:hover .ah-stamp{animation:ah-stamp .55s cubic-bezier(.2,.9,.3,1.2)}
  .ah-xyz i{transition:transform .25s ease,background .25s ease}
  .ah-xyz i:hover{transform:translateY(-3px);background:rgba(184,152,90,.28)}

/* ---- 04 / 05 / 06 · cards lift, take a gold edge ---- */
  .ah-opts li,.ah-four li,.ah-outcomes li{transition:transform .3s cubic-bezier(.2,.7,.2,1),border-color .3s ease,background .3s ease,box-shadow .3s ease}
  .ah-opts li:hover{transform:translateY(-3px);border-color:var(--gold-light);background:rgba(10,31,24,.82);box-shadow:inset 3px 0 0 var(--gold),0 18px 28px -18px rgba(0,0,0,.7)}
  .ah-opts li:hover b{color:var(--gold-light)}
  .ah-four li:hover{transform:translateY(-4px);border-color:var(--gold-light);background:rgba(10,31,24,.82);box-shadow:0 20px 30px -18px rgba(0,0,0,.7)}
  .ah-four li:hover b{color:var(--gold-light)}
  .ah-outcomes li:hover{transform:translateY(-3px);border-color:var(--gold-light);background:rgba(10,31,24,.8);box-shadow:0 16px 24px -16px rgba(0,0,0,.7)}
  .ah-scene--light .ah-four li:hover{background:#fff;border-color:var(--gold);box-shadow:0 20px 30px -20px rgba(15,42,33,.45)}
  .ah-scene--light .ah-four li:hover b{color:#735818}
  .ah-scene--light .ah-outcomes li:hover{background:#fff;border-color:var(--gold);box-shadow:0 16px 24px -18px rgba(15,42,33,.4)}

  .ah-cmp-cols li{transition:transform .25s ease,background .25s ease}
  .ah-cmp-cols li:hover{transform:translateX(4px);background:linear-gradient(90deg,rgba(212,188,132,.14),rgba(212,188,132,0))}
  .ah-scene--light .ah-cmp-cols li:hover{background:linear-gradient(90deg,rgba(184,152,90,.18),rgba(184,152,90,0))}
  .ah-cmp-arrow{display:inline-block;transition:transform .35s cubic-bezier(.2,.7,.2,1)}
  .ah-panel:hover .ah-cmp-arrow{transform:translateX(6px)}
  .ah-cmp-cols li.is-moved span{transition:box-shadow .3s ease,background .3s ease}
  .ah-panel:hover .ah-cmp-cols li.is-moved span{box-shadow:0 0 0 3px rgba(184,152,90,.3)}
}
@keyframes ah-stamp{0%{opacity:0;transform:rotate(-6deg) scale(1.6)}55%{opacity:1;transform:rotate(-6deg) scale(.93)}100%{opacity:1;transform:rotate(-6deg) scale(1)}}
@media(prefers-reduced-motion:reduce){
  html.ah-armed .ah-nine-grid i{opacity:1!important;animation:none!important}
  .ah-nine-grid i,.ah-file,.ah-file-rows li,.ah-gap-list li,.ah-opts li,.ah-four li,.ah-outcomes li,.ah-cmp-cols li,.ah-nine-key li,.ah-cmp-arrow{transition:none!important;transform:none!important}
  .ah-file:hover .ah-stamp{animation:none!important}
}