/* debby.health 05 — home.css: home-only layers split from directions/debby-v2/assets/a/a.css (cover, intro, P.02 pain,
   P.03 report head + spread, P.04 notes, P.05 story, P.07 speaking, P.08 utr, P.10 closing). Loaded after site.css.
   Rules are unchanged; only their file moved. */

/* ===================== 01 Cover ===================== */
.ai-cover {
  position: relative; overflow: clip; background: var(--ai-paper);
  display: grid; column-gap: 0;
  grid-template-columns: var(--ai-gutter) minmax(0, .86fr) minmax(0, 1.14fr) var(--ai-gutter);
  grid-template-rows: var(--ai-header-h) auto auto auto auto auto auto auto;
  grid-template-areas:
    ". .     .     ."
    ". mast  mast  ."
    ". eye   eye   ."
    ". title title ."
    ". lead  fig   fig"
    ". cta   cta   ."
    ". sig   sig   ."
    ". lines lines .";
}
.ai-cover__paper { position: absolute; inset: 0; pointer-events: none; z-index: 0; }
.ai-crop { position: absolute; width: 18px; height: 18px; }
.ai-crop::before, .ai-crop::after { content: ""; position: absolute; background: var(--ai-rule-strong); }
.ai-crop::before { width: 18px; height: 1px; } .ai-crop::after { width: 1px; height: 18px; }
.ai-crop--tl { left: 8px; top: calc(var(--ai-header-h) + 2px); } .ai-crop--tl::before, .ai-crop--tl::after { left: 0; top: 0; }
.ai-crop--tr { right: 8px; top: calc(var(--ai-header-h) + 2px); } .ai-crop--tr::before, .ai-crop--tr::after { right: 0; top: 0; }
.ai-crop--bl { left: 8px; bottom: 8px; } .ai-crop--bl::before, .ai-crop--bl::after { left: 0; bottom: 0; }
.ai-crop--br { right: 8px; bottom: 8px; } .ai-crop--br::before, .ai-crop--br::after { right: 0; bottom: 0; }

.ai-cover__masthead { grid-area: mast; position: relative; z-index: 1; display: flex; align-items: center; gap: 12px; padding: 6px 0 10px; font-size: .75rem; letter-spacing: .22em; color: var(--ai-muted); }
.ai-cover__vol { font-family: var(--ai-font-display); font-weight: 900; font-size: 1.125rem; letter-spacing: .04em; color: var(--ai-teal-700); }
.ai-cover__rule { flex: 1; height: 1px; background: var(--ai-rule-strong); min-width: 16px; }
.ai-cover__page { white-space: nowrap; }
.ai-cover__issue { white-space: nowrap; }

.ai-cover__figure { grid-area: fig; position: relative; z-index: 1; align-self: end; justify-self: end; width: 100%; }
.ai-cover__img { width: 100%; position: relative; z-index: 1; transform-origin: 50% 100%; }
.ai-cover__brush { position: absolute; z-index: 0; left: -24%; top: 4%; width: 130%; height: 78%; overflow: visible; pointer-events: none; }
.ai-cover__brush path { fill: none; stroke: rgba(252, 100, 148, .17); stroke-width: 120; stroke-linecap: butt; stroke-dasharray: 1 1; stroke-dashoffset: 0; }

.ai-cover__body { display: contents; }
.ai-cover__eyebrow { grid-area: eye; position: relative; z-index: 2; font-size: var(--ai-fs-eyebrow); letter-spacing: var(--ai-track-eyebrow); color: var(--ai-teal-700); margin: 10px 0 8px; }
.ai-cover__title { grid-area: title; position: relative; z-index: 2; font-family: var(--ai-font-display); font-weight: 900; font-size: var(--ai-fs-cover); line-height: 1.16; letter-spacing: .01em; }
.ai-cover__t1, .ai-cover__t2 { display: block; }
.ai-cover__lead { grid-area: lead; position: relative; z-index: 2; font-size: .9375rem; line-height: 1.75; color: var(--ai-ink); margin-top: 14px; padding-right: 12px; word-break: keep-all; overflow-wrap: anywhere; }
.ai-cover__sig { grid-area: sig; position: relative; z-index: 2; margin: 4px 0 24px; padding: 14px 12px 0 0; border-top: 1px solid var(--ai-rule-strong); align-self: start; }
.ai-cover__motto { font-family: var(--ai-font-display); font-weight: 900; font-size: 1.25rem; line-height: 1.35; }
.ai-cover__motto-k { display: block; font-size: .62em; letter-spacing: .06em; color: var(--ai-teal-700); margin-bottom: 4px; }
.ai-cover__hint { display: none; }
.ai-cover__motto-note { font-size: .8125rem; line-height: 1.65; color: var(--ai-muted); margin-top: 8px; word-break: keep-all; overflow-wrap: anywhere; }
.ai-cover__cta { grid-area: cta; position: relative; z-index: 3; display: flex; flex-wrap: wrap; align-items: flex-start; gap: 10px 12px; padding: 16px 0 20px; margin: 0 calc(-1 * var(--ai-gutter)); padding-left: var(--ai-gutter); padding-right: var(--ai-gutter); background: linear-gradient(rgba(251, 248, 243, .0), var(--ai-paper) 22%); }
.ai-cover__primary { display: flex; flex-direction: column; align-items: flex-start; gap: 6px; }
.ai-cover__note { font-size: .8125rem; letter-spacing: .06em; color: var(--ai-muted); padding-left: 2px; }
.ai-cover__cta .ai-btn--lg { min-height: 52px; padding: 0 18px; font-size: 1rem; }
.ai-cover__lines { grid-area: lines; position: relative; z-index: 2; display: grid; grid-template-columns: 1fr 1fr; column-gap: 12px; border-top: 1px solid var(--ai-rule-strong); margin: 0 0 12px; }
.ai-cover__lines a { display: flex; align-items: baseline; gap: 10px; min-height: 40px; padding: 9px 0; text-decoration: none; font-family: var(--ai-font-display); font-weight: 900; font-size: .9375rem; border-bottom: 1px solid var(--ai-rule); }
.ai-cover__lp { font-family: var(--ai-font-body); font-size: .6875rem; letter-spacing: .16em; color: var(--ai-teal-700); }
.ai-cover__lines a:hover { background: linear-gradient(var(--ai-hl), var(--ai-hl)) 0 70% / 100% .5em no-repeat; }

@media (max-width: 767px) {
  .ai-cover__figure { margin-left: -14px; width: calc(100% + 14px); }
  .ai-cover__masthead { padding: 4px 0 6px; }
  .ai-cover__eyebrow { margin: 4px 0 6px; }
  .ai-cover__title { line-height: 1.13; }
  .ai-cover__cta { padding-top: 12px; padding-bottom: 16px; }
  .ai-cover__cta .ai-btn--ghost { padding: 0 16px; }
}
@media (max-width: 359px) {
  .ai-cover__issue { display: none; }
  .ai-cover__lead { font-size: .875rem; }
  .ai-cover__motto { font-size: 1.0625rem; }
}

/* tablet: text left, portrait right */
@media (min-width: 768px) and (max-width: 1024px) {
  .ai-cover {
    min-height: min(100svh, 1180px);
    grid-template-columns: var(--ai-gutter) minmax(0, 1fr) minmax(0, 1fr) var(--ai-gutter);
    grid-template-rows: var(--ai-header-h) auto minmax(24px, 1fr) auto auto auto auto auto minmax(24px, .7fr) auto;
    grid-template-areas:
      ".   .     .     ."
      ".   mast  mast  ."
      ".   .     fig   fig"
      ".   eye   fig   fig"
      ".   title fig   fig"
      ".   lead  fig   fig"
      ".   cta   fig   fig"
      ".   sig   fig   fig"
      ".   .     fig   fig"
      ".   lines lines .";
  }
  .ai-cover__title { --ai-fs-cover: clamp(2.75rem, 6.2vw, 4rem); }
  .ai-cover__lead { font-size: 1.0625rem; max-width: 22em; }
  .ai-cover__cta { margin: 0; padding: 22px 0 0; background: none; }
  .ai-cover__sig { margin-top: 28px; margin-bottom: 0; max-width: 24em; }
  .ai-cover__motto { font-size: 1.625rem; }
  .ai-cover__figure { max-width: min(560px, calc((100svh - var(--ai-header-h) - 64px) * .688)); }
  .ai-cover__lines { align-self: auto; margin: 0 0 12px; }
  .ai-cover__lines { grid-template-columns: repeat(4, auto); justify-content: space-between; }
  .ai-cover__lines a { border-bottom: 0; }
}

/* desktop: magazine cover, headline split on both sides of the portrait */
@media (min-width: 1025px) {
  .ai-cover {
    min-height: max(680px, 100svh);
    grid-template-columns: var(--ai-gutter) minmax(0, 1fr) var(--ai-pw) minmax(0, 1fr) var(--ai-gutter);
    grid-template-rows: var(--ai-header-h) auto minmax(12px, 1fr) auto auto auto auto minmax(16px, .8fr) auto;
    grid-template-areas: none;
  }
  .ai-cover__masthead { grid-column: 2 / 5; }
  .ai-cover__eyebrow { grid-column: 2; grid-row: 4; }
  .ai-cover__lines { grid-column: 2 / 5; grid-row: 9; }
  .ai-cover__masthead { grid-row: 2; align-self: end; padding: 10px 0 12px; font-size: .8125rem; }
  .ai-cover__vol { font-size: 1.375rem; }
  .ai-cover__figure { grid-row: 2 / 10; grid-column: 3; justify-self: center; width: 100%; z-index: 1; }
  .ai-cover__brush { left: -30%; width: 160%; top: 8%; height: 70%; }
  .ai-cover__title {
    grid-column: 2 / 5; grid-row: 5 / 7; display: grid; grid-template-columns: subgrid; grid-template-rows: subgrid;
    --ai-fs-cover: min(6rem, calc((100vw - 2 * var(--ai-gutter) - var(--ai-pw)) / 10.8)); line-height: 1.1;
  }
  .ai-cover__t1 { grid-column: 1; grid-row: 1; }
  .ai-cover__t2 { grid-column: 3; grid-row: 1 / 3; text-align: right; padding-top: .62em; }
  .ai-cover__t2 .ai-line__in { text-align: right; }
  .ai-cover__lead { grid-column: 2; grid-row: 6; font-size: 1.0625rem; max-width: 24em; margin-top: 24px; }
  .ai-cover__cta { grid-column: 2; grid-row: 7; margin: 0; padding: 26px 0 0; background: none; gap: 12px 14px; }
  .ai-cover__cta .ai-btn--lg { min-height: 56px; padding: 0 24px; font-size: 1.0625rem; }
  .ai-cover__sig { grid-column: 4; grid-row: 7; justify-self: end; text-align: right; max-width: 22em; padding: 14px 0 0; margin: 26px 0 0; align-self: start; }
  .ai-cover__motto { font-size: clamp(1.5rem, 2.1vw, 2rem); }
  .ai-cover__lines { grid-template-columns: auto auto 1fr auto auto; column-gap: 28px; margin: 0 0 14px; align-self: auto; }
  .ai-cover__lines a { border-bottom: 0; }
  .ai-cover__lines a:nth-child(3) { grid-column: 4; }
  .ai-cover__lines a:nth-child(4) { grid-column: 5; }
}
/* short desktop windows: let the cover grow instead of squeezing */
@media (min-width: 1025px) and (max-height: 760px) {
  :root { --ai-pw: min(34vw, 400px); }
}

/* hero load entrance (after the intro); hidden states exist only under html.ai-motion */
.ai-motion [data-ai-hero-in], .ai-motion .ai-cover__title .ai-line__in { opacity: 0; transform: translateY(24px); }
.ai-motion .ai-cover__img { transform: translateY(24px) scale(1.04); }
.ai-motion .ai-cover__brush path, .ai-motion .ai-hl--cover path { stroke-dashoffset: 1; }
.ai-hero-go [data-ai-hero-in], .ai-hero-go .ai-cover__title .ai-line__in {
  opacity: 1; transform: none;
  transition: opacity var(--ai-dur) var(--ai-ease) calc(var(--i, 0) * 90ms + 120ms), transform .9s var(--ai-ease) calc(var(--i, 0) * 90ms + 120ms);
}
.ai-hero-go .ai-cover__img { transform: none; transition: transform 1.4s var(--ai-ease) .05s; }
.ai-hero-go .ai-cover__brush path { stroke-dashoffset: 0; transition: stroke-dashoffset 1.6s var(--ai-ease) .2s; }
.ai-hero-go .ai-hl--cover path { stroke-dashoffset: 0; transition: stroke-dashoffset 1.2s cubic-bezier(.6, 0, .3, 1) 1.1s; }
.ai-hero-go .ai-hl--late path { transition-delay: 2s; }
.ai-hero-go .ai-hl--cover .ai-hl__svg { animation: ai-breathe 6.5s ease-in-out 3.4s infinite alternate; transform-origin: 0 70%; }
@keyframes ai-breathe { 0% { opacity: 1; transform: scaleY(1); } 100% { opacity: .72; transform: scaleY(.86); } }

/* 02 pain */
.ai-pain__head { max-width: none; }
.ai-pain__head .ai-h2 { font-size: clamp(2rem, 1rem + 4.2vw, 4.5rem); }
.ai-pain__cols { display: grid; gap: 0; margin-top: clamp(40px, 6vw, 80px); border-top: 1px solid var(--ai-rule-strong); }
.ai-pain__col { padding: 28px 0 32px; border-bottom: 1px solid var(--ai-rule); display: grid; grid-template-columns: auto 1fr; column-gap: 20px; align-content: start; }
.ai-pain__col > :not(.ai-pain__no) { grid-column: 2; }
.ai-pain__no { grid-row: 1 / 5; font-family: var(--ai-font-display); font-weight: 900; font-size: 2.75rem; line-height: 1; color: var(--ai-teal-700); }
.ai-pain__col .ai-h3 { font-size: clamp(1.375rem, 1rem + 1vw, 1.75rem); }
.ai-pain__col p { margin-top: 10px; color: var(--ai-muted); }
.ai-reply { display: flex; align-items: center; flex-wrap: wrap; gap: 4px 10px; margin-top: 18px !important; color: var(--ai-ink) !important; }
.ai-reply img { width: 44px; height: 44px; border-radius: 50%; object-fit: cover; object-position: 50% 30%; background: #fff; box-shadow: 0 0 0 2px var(--ai-paper), 0 0 0 3.5px var(--ai-pink); }
.ai-reply__who { font-size: .8125rem; letter-spacing: .12em; color: var(--ai-muted); }
.ai-reply__q { font-family: var(--ai-font-display); font-weight: 900; font-size: 1.125rem; background: linear-gradient(var(--ai-hl), var(--ai-hl)) 0 82% / 100% .42em no-repeat; }
@media (min-width: 768px) {
  .ai-pain__cols { grid-template-columns: repeat(3, 1fr); border-bottom: 1px solid var(--ai-rule-strong); }
  .ai-pain__col { display: block; padding: 32px clamp(20px, 2.4vw, 40px) 40px; border-bottom: 0; border-left: 1px solid var(--ai-rule); }
  .ai-pain__col:first-child { border-left: 0; padding-left: 0; }
  .ai-pain__no { display: block; font-size: clamp(3.5rem, 6vw, 5.5rem); margin-bottom: 18px; }
}
@media (min-width: 1025px) {
  .ai-pain .ai-wrap { display: grid; grid-template-columns: repeat(12, 1fr); column-gap: 24px; }
  .ai-pain .ai-runhead, .ai-pain__cols { grid-column: 1 / -1; }
  .ai-pain__head { grid-column: 1 / -1; max-width: none; }
}

/* 03 report (head only; the triage component is the live port at the end of this file) */
.ai-report { background: var(--ai-lt-bg, #FAF6EE); }
.ai-report__head .ai-h2 { max-width: 14em; }

/* 04 notes — horizontal pages */
.ai-notes { padding: var(--ai-sec-y) 0; background: var(--ai-paper); }
.ai-hs__head { padding: 0 var(--ai-gutter); max-width: calc(var(--ai-max) + 2 * var(--ai-gutter)); margin: 0 auto; }
.ai-runhead--hs { display: none; }
.ai-hs__head .ai-h2 { font-size: clamp(2rem, 1rem + 4vw, 4.5rem); }
.ai-hs__progress { display: none; }
.ai-hs__all { margin-top: 20px; }
.ai-hs__view { margin-top: 36px; overflow-x: auto; overflow-y: clip; scroll-snap-type: x mandatory; scroll-padding: 0 var(--ai-gutter); -webkit-overflow-scrolling: touch; scrollbar-width: thin; scrollbar-color: var(--ai-rule-strong) transparent; padding-bottom: 14px; }
.ai-hs__track { display: flex; gap: 16px; padding: 0 var(--ai-gutter); width: max-content; }
.ai-page { scroll-snap-align: start; width: min(82vw, 400px); flex: none; }
.ai-page__in { position: relative; height: 100%; min-height: 380px; display: flex; flex-direction: column; gap: 16px; padding: 26px 24px 24px; border-radius: var(--ai-r-xs); background: var(--ai-sheet); box-shadow: var(--ai-shadow-sheet); transition: transform .45s var(--ai-ease); }
.ai-page__kicker { display: flex; align-items: center; gap: 12px; font-size: .8125rem; letter-spacing: .2em; color: var(--ai-teal-700); padding-bottom: 14px; border-bottom: 1px solid var(--ai-rule-strong); }
.ai-page__no { font-family: var(--ai-font-display); font-weight: 900; font-size: 2.25rem; line-height: 1; letter-spacing: 0; color: var(--ai-ink); }
.ai-page__title { font-family: var(--ai-font-display); font-weight: 900; font-size: clamp(1.375rem, 1.1rem + .9vw, 1.875rem); line-height: 1.4; }
.ai-page__title a { text-decoration: none; background: linear-gradient(var(--ai-hl), var(--ai-hl)) 0 86% / 0 .42em no-repeat; transition: background-size .6s var(--ai-ease); }
.ai-page__title a::after { content: ""; position: absolute; inset: 0; z-index: 1; }
.ai-page:hover .ai-page__title a, .ai-page__title a:focus-visible { background-size: 100% .42em; }
.ai-page__sum { margin-top: auto; font-size: .9375rem; line-height: 1.75; color: var(--ai-muted); }
.ai-page__arrow { align-self: flex-end; font-size: 1.5rem; line-height: 1; transition: transform .4s var(--ai-ease); }
.ai-page:hover .ai-page__arrow { transform: translateX(6px); }
.ai-page--b .ai-page__in { background: var(--ai-mint, #DDF3E8); color: var(--ai-ink); box-shadow: inset 0 0 0 1px rgba(23, 98, 102, .12), var(--ai-shadow-sheet); }   /* ink 11.39, teal-700 6.07, muted 5.47 */
.ai-page--b .ai-page__kicker { color: var(--ai-teal-700); border-color: rgba(23, 98, 102, .45); }
.ai-page--b .ai-page__no { color: var(--ai-teal-700); }
.ai-page--b .ai-page__sum { color: var(--ai-muted); }
.ai-page--c .ai-page__in { background: var(--ai-pink-50); }
.ai-page--d .ai-page__in { background: var(--ai-teal-50); }
/* full desktop: vertical scroll moves the pages sideways (set by JS: .is-hs) */
.ai-hs.is-hs { height: calc(100vh - var(--ai-header-h) + var(--ai-hs-dist, 0px)); }
.ai-notes:has(.is-hs) { padding: 0; }
.ai-hs.is-hs .ai-hs__sticky { position: sticky; top: var(--ai-header-h); height: calc(100vh - var(--ai-header-h)); display: flex; align-items: stretch; overflow: clip; }
.ai-hs.is-hs .ai-hs__head { flex: none; width: clamp(320px, 30vw, 440px); margin: 0; padding: clamp(40px, 6vh, 72px) 32px 40px var(--ai-gutter); display: flex; flex-direction: column; position: relative; z-index: 2; background: var(--ai-paper); box-shadow: 18px 0 30px -18px rgba(24, 52, 55, .25); }
.ai-hs.is-hs .ai-runhead--hs { display: flex; }
.ai-hs.is-hs .ai-hs__head .ai-h2 { font-size: clamp(2.5rem, 3.6vw, 4rem); }
.ai-hs.is-hs .ai-hs__progress { display: block; margin-top: auto; height: 2px; background: var(--ai-rule); }
.ai-hs.is-hs .ai-hs__fill { display: block; height: 100%; background: var(--ai-pink); transform-origin: 0 50%; transform: scaleX(0); }
.ai-hs.is-hs .ai-hs__view { flex: 1; min-width: 0; margin: 0; overflow: clip; scroll-snap-type: none; padding: 0; display: flex; align-items: center; cursor: grab; }
.ai-hs.is-hs .ai-hs__view.is-dragging { cursor: grabbing; }
.ai-hs.is-hs .ai-hs__track { gap: clamp(20px, 2vw, 32px); padding: 0 var(--ai-gutter) 0 clamp(32px, 4vw, 64px); align-items: stretch; will-change: transform; }
.ai-hs.is-hs .ai-page { width: clamp(360px, 33vw, 500px); height: min(600px, calc(100vh - var(--ai-header-h) - 120px)); }
.ai-hs.is-hs .ai-page__in { padding: 34px 32px 30px; }
.ai-hs.is-hs .ai-page__no { font-size: 3.5rem; }
.ai-hs.is-hs .ai-page__title { font-size: clamp(1.625rem, 2vw, 2.125rem); }
.ai-hs.is-hs .ai-page:nth-child(even) { margin-top: 48px; margin-bottom: -48px; }
@media (min-width: 768px) and (max-width: 1024px) { .ai-page { width: min(60vw, 420px); } }

/* 05 story */
.ai-story__spread { display: grid; gap: 40px; }
.ai-story__photo { position: relative; }
.ai-story__frame { position: relative; overflow: hidden; aspect-ratio: 4 / 5; border-radius: var(--ai-r-xs); background: #E7E6EA; }
.ai-story__frame img { width: 100%; height: 118%; object-fit: cover; object-position: 50% 18%; position: absolute; left: 0; top: -9%; }
.ai-story__text .ai-h2 { font-size: clamp(2rem, 1rem + 3.8vw, 4.25rem); }
.ai-story__cols { margin-top: 32px; display: grid; gap: 16px; }
.ai-story__p { font-size: 1.0625rem; line-height: 1.9; }
.ai-story__p--drop::first-letter { font-family: var(--ai-font-display); font-weight: 900; font-size: 3.4em; float: left; line-height: .9; margin: .08em .12em 0 0; color: var(--ai-teal-700); }
.ai-pull { margin: 36px 0 0; padding: 28px 0 0; border-top: 2px solid var(--ai-ink); position: relative; }
.ai-pull::before { content: "“"; position: absolute; top: -.32em; left: 0; padding-right: 10px; background: var(--ai-paper); font-family: var(--ai-font-display); font-weight: 900; font-size: 4rem; line-height: 1; color: var(--ai-pink); }
.ai-pull p { font-family: var(--ai-font-display); font-weight: 900; font-size: clamp(1.25rem, 1rem + 1vw, 1.75rem); line-height: 1.7; }
.ai-timeline { position: relative; display: grid; gap: 22px; margin-top: clamp(56px, 7vw, 96px); padding: 0 0 0 28px; --ai-draw: 1; }
.ai-timeline::before { content: ""; position: absolute; left: 6px; top: 6px; bottom: 6px; width: 6px; background: var(--ai-hl); transform-origin: 50% 0; transform: scaleY(var(--ai-draw)); border-radius: 1px; }
.ai-timeline__line { display: none; }
.ai-timeline__item { position: relative; display: flex; flex-direction: column; gap: 4px; }
.ai-timeline__dot { position: absolute; left: -28px; top: 6px; width: 18px; height: 18px; border-radius: 50%; background: var(--ai-paper); border: 2px solid var(--ai-ink); }
.ai-timeline__item:last-of-type .ai-timeline__dot { background: var(--ai-ink); }
.ai-timeline__when { font-family: var(--ai-font-display); font-weight: 900; font-size: 1.375rem; color: var(--ai-teal-700); line-height: 1.3; font-variant-numeric: tabular-nums; }
.ai-timeline__what { font-size: 1rem; }
.ai-story__lower { display: grid; gap: 28px; margin-top: clamp(48px, 6vw, 80px); }
@media (min-width: 768px) {
  .ai-story__spread { grid-template-columns: 5fr 7fr; gap: clamp(32px, 5vw, 80px); align-items: start; }
  .ai-story__frame { aspect-ratio: 3 / 4; }
  .ai-story__lower { grid-template-columns: 7fr 5fr; align-items: start; }
  .ai-timeline { grid-template-columns: repeat(3, 1fr); gap: 32px; padding: 34px 0 0; }
  .ai-timeline::before { display: none; }
  .ai-timeline__line { display: block; position: absolute; left: 0; right: 0; top: 4px; width: 100%; height: 20px; overflow: visible; }
  .ai-timeline__line path { fill: none; stroke: var(--ai-hl); stroke-width: 7; stroke-dasharray: 1 1; stroke-dashoffset: calc(1 - var(--ai-draw)); }
  .ai-timeline__dot { left: 0; top: -38px; }
}
@media (min-width: 1025px) {
  .ai-story__cols { grid-template-columns: 1fr 1fr; column-gap: 36px; }
  .ai-story__photo { position: sticky; top: calc(var(--ai-header-h) + 32px); }
  .ai-story__text { padding-top: 24px; }
}

/* 07 speaking — pale pink page (2026-10-27 r2): soft diagonal gradient pink-50 #FFF0F4 (top left) → pink-100 #FFE1EA
   (bottom right). Worst case #FFE1EA: ink 10.86, teal-700 5.78, muted #4E6366 5.21 (so the usual grey works again).
   Debby pink stays decoration only (highlighter, dots, frames). */
.ai-speak { background-color: #FFE1EA; background-image: linear-gradient(160deg, #FFF0F4 0%, #FFF0F4 18%, #FFE1EA 82%, #FFE1EA 100%); color: var(--ai-ink); }
.ai-speak .ai-runhead { border-color: rgba(24, 52, 55, .55); color: var(--ai-teal-700); }
.ai-speak .ai-eyebrow { color: var(--ai-teal-700); }
.ai-speak .ai-lead { color: var(--ai-muted); }
.ai-speak .ai-cap { color: var(--ai-muted); }
.ai-speak .ai-cap__no { color: var(--ai-teal-700); }
.ai-speak .ai-link { background-image: none; text-decoration-thickness: 1.5px; }
.ai-speak .ai-link:hover { color: var(--ai-ink); }
.ai-hl--onpink .ai-hl__p1 { stroke: rgba(252, 100, 148, .42); }   /* ink on the blend over #FFE1EA: 7.6 */
.ai-hl--onpink .ai-hl__p2 { stroke: rgba(255, 255, 255, .45); }
.ai-speak::before { content: ""; position: absolute; right: clamp(16px, 4vw, 56px); bottom: clamp(20px, 3vw, 40px); width: 64px; height: 64px; pointer-events: none; opacity: .9;
  background: no-repeat center / contain url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 20.3c-.4 0-7.9-4.6-9.4-9.4C1.6 7.7 3.5 4.6 6.7 4.4c2.1-.1 3.9 1.1 5.3 3.1 1.4-2 3.2-3.2 5.3-3.1 3.2.2 5.1 3.3 4.1 6.5-1.5 4.8-9 9.4-9.4 9.4z' fill='none' stroke='%23FC6494' stroke-width='1.2'/%3E%3C/svg%3E"); transform: rotate(12deg); }
.ai-speak__grid { display: grid; gap: 40px; }
.ai-speak__photo { position: relative; align-self: start; }
.ai-speak__frame { overflow: hidden; aspect-ratio: 3 / 2; border-radius: var(--ai-r-xs); background: var(--ai-pink-100); box-shadow: 0 0 0 6px #fff, 0 22px 44px -22px rgba(144, 48, 46, .45); }
.ai-speak__frame img { width: 100%; height: 100%; object-fit: cover; }
.ai-toc__title { margin-top: 36px; font-size: .8125rem; font-weight: 700; letter-spacing: .24em; color: var(--ai-teal-700); font-family: var(--ai-font-body); }
.ai-toc { margin-top: 12px; border-top: 1.5px solid var(--ai-ink); }
.ai-toc li { display: flex; align-items: baseline; gap: 16px; padding: 14px 0; border-bottom: 1px dashed rgba(24, 52, 55, .28); }
.ai-toc__no { font-family: var(--ai-font-display); font-weight: 900; font-size: 1.125rem; color: var(--ai-teal-700); font-variant-numeric: tabular-nums; flex: none; width: 2em; }
.ai-toc__t { font-family: var(--ai-font-display); font-weight: 900; font-size: clamp(1.0625rem, 1rem + .4vw, 1.3125rem); }
.ai-speak__cta { display: flex; flex-wrap: wrap; align-items: center; gap: 16px 24px; margin-top: 32px; }
@media (min-width: 1025px) {
  .ai-speak__grid { grid-template-columns: 1fr 1fr; gap: clamp(40px, 5vw, 88px); }
  .ai-speak__photo { position: sticky; top: calc(var(--ai-header-h) + 32px); }
  .ai-speak__frame { aspect-ratio: 4 / 5; }
  .ai-speak__frame img { object-position: 30% 45%; }
}
@media (min-width: 768px) and (max-width: 1024px) { .ai-speak__frame { aspect-ratio: 16 / 9; } }

/* 08 utr directory */
.ai-utr__head .ai-lead { max-width: 36em; }
.ai-dir { display: grid; margin-top: 40px; border-top: 1px solid var(--ai-rule-strong); }
.ai-dir__item a { position: relative; display: flex; flex-direction: column; gap: 6px; height: 100%; padding: 22px 4px 24px; text-decoration: none; border-bottom: 1px solid var(--ai-rule); transition: background-color .3s var(--ai-ease); }
.ai-dir__item a:hover { background: var(--ai-sheet); }
.ai-dir__q { font-size: .8125rem; letter-spacing: .12em; color: var(--ai-teal-700); font-weight: 600; }
.ai-dir__t { font-family: var(--ai-font-display); font-weight: 900; font-size: clamp(1.25rem, 1rem + .7vw, 1.5rem); line-height: 1.4; align-self: flex-start; background: linear-gradient(var(--ai-hl), var(--ai-hl)) 0 84% / 0 .45em no-repeat; transition: background-size .5s var(--ai-ease); }
.ai-dir__item a:hover .ai-dir__t, .ai-dir__item a:focus-visible .ai-dir__t { background-size: 100% .45em; }
.ai-dir__d { color: var(--ai-muted); font-size: .9375rem; line-height: 1.7; }
.ai-dir__item--lead a { background: var(--ai-pink-50); padding-left: 18px; padding-right: 18px; }
.ai-utr__cta { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 40px; }
@media (min-width: 768px) {
  .ai-dir { grid-template-columns: repeat(2, 1fr); }
  .ai-dir__item a { padding: 28px 28px 30px; border-right: 1px solid var(--ai-rule); }
  .ai-dir__item:nth-child(2n) a { border-right: 0; }
}
@media (min-width: 1025px) {
  .ai-dir { grid-template-columns: repeat(3, 1fr); }
  .ai-dir__item:nth-child(2n) a { border-right: 1px solid var(--ai-rule); }
  .ai-dir__item:nth-child(3n) a { border-right: 0; }
  .ai-utr .ai-wrap { display: grid; grid-template-columns: repeat(12, 1fr); column-gap: 24px; }
  .ai-utr .ai-runhead, .ai-dir, .ai-utr__cta { grid-column: 1 / -1; }
  .ai-utr__head { grid-column: 1 / 10; }
}


/* 10 closing — cutout half-portrait beside a two-line quote (2026-10-27). Unlike the cover (seated full figure,
   centred, headline split around it) the portrait here is cropped to head–waist, sits on a pink disc on the left,
   and opens from the bottom with a scale (data-ai-photo="up"); the disc grows in; both reverse on the way up. */
.ai-close { padding: clamp(72px, 9vw, 140px) 0; overflow: clip; }
.ai-close__grid { display: grid; gap: 32px; align-items: center; }
.ai-close__portrait { position: relative; width: min(76vw, 340px); margin: 0 auto; }
.ai-close__disc { position: absolute; left: 9%; right: 9%; bottom: 0; aspect-ratio: 1; border-radius: 50%; background: radial-gradient(circle at 40% 35%, var(--ai-pink-50), var(--ai-pink-100) 70%); box-shadow: inset 0 0 0 1.5px rgba(252, 100, 148, .35); }
.ai-close__clip { position: relative; aspect-ratio: 1 / .9; overflow: hidden; border-radius: 0 0 50% 50% / 0 0 40% 40%; }   /* head rises above the disc; shows the top 62% of the cutout (head to elbows) — the black chair starts at 68%, so it never shows */
.ai-close__clip img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 0; }
.ai-close__q { font-family: var(--ai-font-display); font-weight: 900; line-height: 1.35; letter-spacing: .01em;
  /* line 2 (15 characters) must stay on one line: the size follows the text column, never below 17px */
  font-size: max(1.0625rem, min(3.5rem, calc((min(100vw, 1448px) - 2 * var(--ai-gutter)) / 15.6))); }
.ai-close__l2 { white-space: nowrap; }
.ai-close__cta { display: flex; flex-wrap: wrap; align-items: flex-start; gap: 14px; margin-top: 36px; }
@media (min-width: 768px) {
  .ai-close__grid { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(32px, 4vw, 72px); }
  .ai-close__portrait { width: 100%; max-width: 440px; }
  .ai-close__q { font-size: min(3.5rem, calc(((min(100vw, 1448px) - 2 * var(--ai-gutter) - clamp(32px, 4vw, 72px)) * 7 / 12) / 15.6)); }
}

/* ===================== Intro (VOL.01 cover being highlighted) ===================== */
.ai-intro { display: none; }
.ai-intro-on .ai-intro {
  display: flex; position: fixed; inset: 0; z-index: 10000; align-items: center; justify-content: center; background: var(--ai-paper);
  animation: ai-intro-bail .6s linear 9s forwards;
}
.ai-intro-done .ai-intro { opacity: 0; visibility: hidden; transition: opacity .9s var(--ai-ease), visibility 0s .9s; }
.ai-intro-fast .ai-intro { transition-duration: .45s, 0s; transition-delay: 0s, .45s; }
@keyframes ai-intro-bail { to { opacity: 0; visibility: hidden; } }
.ai-intro__inner { display: flex; flex-direction: column; align-items: center; gap: clamp(14px, 2vw, 22px); padding: 0 24px; }
.ai-intro__vol { display: flex; gap: 14px; align-items: center; font-size: .8125rem; letter-spacing: .3em; color: var(--ai-muted); opacity: 0; animation: ai-intro-fade .9s var(--ai-ease) 1.9s forwards; }
.ai-intro__vol span:first-child { font-family: var(--ai-font-display); font-weight: 900; font-size: 1.125rem; letter-spacing: .06em; color: var(--ai-teal-700); padding-right: 14px; border-right: 1px solid var(--ai-rule-strong); }
.ai-intro__mark { position: relative; isolation: isolate; padding: 0 .12em; }
.ai-intro__word { display: block; font-family: var(--ai-font-display); font-weight: 900; font-size: clamp(2.5rem, 8.4vw, 7.5rem); line-height: 1.2; letter-spacing: .02em; color: var(--ai-ink); white-space: nowrap; clip-path: inset(-20% 100% -20% 0); animation: ai-intro-word 1.5s cubic-bezier(.6, 0, .3, 1) .4s forwards; }
.ai-intro__stroke { position: absolute; z-index: -1; left: -4%; width: 108%; bottom: 4%; height: 62%; overflow: visible; }
.ai-intro__stroke path { fill: none; stroke-dasharray: 1 1; stroke-dashoffset: 1; animation: ai-intro-draw 1.5s cubic-bezier(.6, 0, .3, 1) .35s forwards; }
.ai-intro__pass1 { stroke: rgba(252, 100, 148, .42); stroke-width: 46; }
.ai-intro__pass2 { stroke: rgba(252, 100, 148, .22); stroke-width: 30; animation-delay: .5s !important; }
.ai-intro__sub { font-size: clamp(.875rem, 1.4vw, 1.0625rem); letter-spacing: .5em; color: var(--ai-teal-700); opacity: 0; animation: ai-intro-fade .9s var(--ai-ease) 2.2s forwards; padding-left: .5em; }
.ai-intro__crop { position: absolute; width: 28px; height: 28px; opacity: 0; animation: ai-intro-fade .6s var(--ai-ease) .1s forwards; }
.ai-intro__crop::before, .ai-intro__crop::after { content: ""; position: absolute; background: var(--ai-rule-strong); }
.ai-intro__crop::before { width: 28px; height: 1px; } .ai-intro__crop::after { width: 1px; height: 28px; }
.ai-intro__crop--tl { left: 24px; top: 24px; } .ai-intro__crop--tl::before, .ai-intro__crop--tl::after { left: 0; top: 0; }
.ai-intro__crop--tr { right: 24px; top: 24px; } .ai-intro__crop--tr::before, .ai-intro__crop--tr::after { right: 0; top: 0; }
.ai-intro__crop--bl { left: 24px; bottom: 24px; } .ai-intro__crop--bl::before, .ai-intro__crop--bl::after { left: 0; bottom: 0; }
.ai-intro__crop--br { right: 24px; bottom: 24px; } .ai-intro__crop--br::before, .ai-intro__crop--br::after { right: 0; bottom: 0; }
@keyframes ai-intro-draw { to { stroke-dashoffset: 0; } }
@keyframes ai-intro-word { to { clip-path: inset(-20% 0 -20% 0); } }
@keyframes ai-intro-fade { to { opacity: 1; } }

.ai-hs__view.is-dragging { -webkit-user-select: none; user-select: none; }
/* 03 opening spread */
.ai-spread { margin: 0 calc(-1 * var(--ai-gutter)) clamp(28px, 3vw, 44px); }
.ai-spread__frame { overflow: hidden; aspect-ratio: 4 / 3; background: #E9E4DA; }
.ai-spread__frame img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 40%; }
.ai-spread .ai-cap { padding: 0 var(--ai-gutter); }
@media (min-width: 768px) {
  .ai-spread { margin-left: 0; margin-right: 0; }
  .ai-spread__frame { aspect-ratio: 21 / 9; border-radius: var(--ai-r-xs); }
  .ai-spread .ai-cap { padding: 0; }
}
@media (min-width: 1025px) {
  .ai-spread { position: relative; }
  .ai-spread__frame { aspect-ratio: 2.6 / 1; }
  .ai-spread__frame img { object-position: 50% 42%; }
  .ai-report__head { position: relative; z-index: 1; margin-top: calc(-1 * clamp(120px, 10vw, 160px)); background: #FAF6EE; padding: 32px 40px 8px 0; width: min(62%, 760px); }
  .ai-spread .ai-cap { justify-content: flex-end; }
}
/* 07 speaking: main photo + overlapping inset */
.ai-speak__photos { position: relative; align-self: start; }
.ai-speak__inset { position: relative; width: 62%; margin: 14px 0 0 auto; z-index: 2; }
.ai-speak__frame--inset { aspect-ratio: 3 / 2 !important; box-shadow: 0 0 0 6px #fff, 0 20px 40px -16px rgba(144, 48, 46, .45); }
.ai-speak__inset .ai-cap { justify-content: flex-end; }
@media (min-width: 1025px) {
  .ai-speak__photos { position: sticky; top: calc(var(--ai-header-h) + 32px); }
  .ai-speak__photo { position: static; }
  .ai-speak__inset { width: 52%; margin-top: -22%; }
  .ai-speak__photo > .ai-cap { max-width: 44%; }
}
@media (max-width: 359px) {
  .ai-cover__lp { display: none; }
  .ai-cover__lines a { font-size: .8125rem; min-height: 36px; padding: 8px 0; }
}

/* ===================== r1 copy (section-map r1) ===================== */
/* 02 closing quote */
.ai-pain__quote { margin: clamp(36px, 5vw, 64px) 0 0; padding-top: 24px; border-top: 2px solid var(--ai-ink); }
.ai-pain__quote p { font-family: var(--ai-font-display); font-weight: 900; font-size: clamp(1.5rem, 1rem + 2vw, 2.5rem); line-height: 1.4; }
.ai-pain__quote footer { margin-top: 10px; font-size: .875rem; letter-spacing: .12em; color: var(--ai-muted); }
@media (min-width: 1025px) { .ai-pain__quote { grid-column: 4 / -1; } }
/* 05 the wish */
.ai-story__wish { margin-top: 24px; padding-left: 16px; border-left: 3px solid var(--ai-pink); font-weight: 600; line-height: 1.85; }
/* cover: scroll hint (desktop/tablet) */
@media (min-width: 1025px) {
  .ai-cover__hint { display: flex; align-items: center; gap: 8px; grid-area: hint; font-size: .75rem; letter-spacing: .3em; color: var(--ai-muted); position: relative; z-index: 3; }
  .ai-cover__hint i { display: block; width: 1px; height: 28px; background: var(--ai-rule-strong); transform-origin: 50% 0; animation: ai-hint 2.4s ease-in-out infinite; }
  @keyframes ai-hint { 0% { transform: scaleY(0); } 50% { transform: scaleY(1); } 100% { transform: scaleY(1); opacity: 0; } }
}
@media (min-width: 1025px) {
  .ai-cover__hint { grid-column: 3; grid-row: 9; justify-self: center; align-self: end; margin-bottom: 18px; flex-direction: column; padding: 8px 12px; background: rgba(251, 248, 243, .85); border-radius: var(--ai-r-pill); }
}
@media (max-width: 359px) { .ai-cover__lead { word-break: normal; } }