/* ─────────────────────────────────────────────────────────────
   The Way Back to Her — partner pathway

   The same world as the book: parchment, mineral, Nightfall, clay,
   candle; Newsreader for voice, Hanken for labels; the left axis
   and the spacing model unchanged. What differs is deliberate — a
   shorter measure and a firmer weight, because this is addressed
   to someone who needs to understand quickly rather than sit with
   something slowly.

   This file redeclares only what changes. Everything else comes
   from ../styles/twbty.css.
   ───────────────────────────────────────────────────────────── */

/* the book's body padding is meant for a paged view; this is one scroll */
body.partner{padding-block:0;background-color:var(--bone);
  background-image:radial-gradient(120% 58% at 16% -6%, rgba(255,250,240,.42), rgba(255,250,240,0) 55%), var(--paint-bone);
  overflow-x:hidden;}
body.partner #guide{display:block;}

/* one continuous scroll; each section keeps its own room */
.p-sec{padding-block:var(--s1);}
/* the book's left axis, exactly: content sits on --flow, not on the edge.
   The threshold was omitted here, which is why it ran to the screen edge. */
.p-thresh .in,.p-sec .in,.p-held .in,.p-urgent .in,.p-close .in{
  position:relative;padding-left:var(--flow);padding-right:var(--edge);
  max-width:none;margin-inline:0;}
.p-sec.sheet{background-color:var(--mineral);background-image:var(--paint-mineral);
  padding-block:var(--s2);}
.p-sec.after-held{padding-top:var(--s1);}

/* a firmer voice, and a shorter measure than her chapters */
body.partner .read{font-weight:400;max-width:var(--measure);}
body.partner .read p{margin-bottom:1.3em;}
body.partner .read p:last-child{margin-bottom:0;}
body.partner .d3{font-size:var(--d3);max-width:19ch;margin-bottom:1.1rem;}
body.partner .lbl{margin-bottom:.9rem;}

/* ── the two plates ──
   The book's rule holds: never a card, never a shadow, never a caption.
   What differs is the crop. Both photographs carry two people and the
   distance between them, so the frame cannot be narrowed — a portrait
   or square crop would remove one of them. The source is 3:2 and the
   plate is 3:2, which means object-fit has nothing to discard at any
   width. Nothing essential can be cropped away because nothing is.

   On phones it runs edge to edge, the widest thing on the page.
   From 760px a full-bleed 3:2 would stand a metre tall, so it becomes
   a measured block on the same left axis as the writing, which is how
   the book already handles its larger plates. */
.p-plate{margin-block:0;}
.p-plate img{display:block;width:100%;height:auto;aspect-ratio:3/2;
  object-fit:cover;object-position:center center;background-color:var(--mineral);}

/* each plate keeps its own room: --s2 above and below, from the
   neighbouring sections rather than from margins that would stack */
.p-sec.after-plate{padding-top:var(--s2);}
.p-sec.before-plate{padding-bottom:var(--s2);}

@media (min-width:760px){
  .p-plate{padding-left:var(--flow);padding-right:var(--edge);}
  .p-plate img{max-width:52rem;}
}

/* ── the threshold ── */
.p-thresh{padding-block:clamp(1.6rem,4svh,3.2rem) var(--s2);}
.p-thresh .pmast{font-family:var(--serif);font-weight:300;font-style:italic;
  font-size:var(--t-read);line-height:1.5;color:var(--taupe);max-width:26ch;
  margin-top:.45rem;padding-bottom:clamp(.9rem,2svh,1.4rem);
  border-bottom:1px solid var(--hair);}
.p-thresh .d1{font-size:var(--d2);line-height:1.3;letter-spacing:-.014em;
  max-width:17ch;margin-block:clamp(1.1rem,3svh,1.8rem) 0;}
.p-thresh .rule{width:34px;height:1px;min-height:1px;margin:clamp(1.1rem,3svh,1.8rem) 0;
  background:linear-gradient(90deg,var(--clay),rgba(135,77,53,0));}
.p-thresh .read{margin-bottom:1.2em;}
.p-thresh .cta{margin-top:clamp(1.4rem,3.4svh,2.4rem);}
.p-thresh .read:last-of-type{margin-bottom:0;}

/* ── the dark planes: here they carry emphasis, not a held breath ──
   The book fades its held quotes in as the reader reaches them, using an
   observer this pathway does not run. Without this they would be invisible
   text on black, which is exactly what happened. */
html.js .p-held .in,
html.js .p-urgent .in,
html.js .p-close .in{opacity:1;}
.p-held,.p-urgent,.p-close{background-color:var(--night);background-image:var(--paint-night);
  padding-block:var(--s2);}
.p-held .q,.p-close .q{color:var(--candle);font-size:clamp(1.28rem,5.2vw,1.72rem);
  line-height:1.44;font-weight:300;max-width:26ch;}
.p-urgent{padding-block:var(--s2);}
.p-urgent .lbl{color:var(--ember);}
.p-urgent .q{color:var(--candle);font-size:clamp(1.14rem,4.4vw,1.42rem);
  line-height:1.5;font-weight:300;max-width:34ch;margin-bottom:1.2rem;}
.p-urgent .urgnote{font-family:var(--sans);font-size:1rem;line-height:1.72;
  color:var(--ash);max-width:38ch;margin-top:1rem;}
.p-urgent .urgacts{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:1.2rem;}
.p-urgent .urgacts a{display:inline-flex;align-items:center;justify-content:center;
  min-height:48px;padding:0 1.3rem;border:1px solid rgba(201,164,92,.55);border-radius:999px;
  font-family:var(--sans);font-size:.7rem;letter-spacing:.2em;text-transform:uppercase;
  font-weight:500;color:var(--foil);text-decoration:none;text-indent:.2em;}
.p-urgent .urgacts a:hover{border-color:rgba(201,164,92,.95);background:rgba(201,164,92,.10);}
.p-urgent .urgacts a:active{opacity:.72;}

/* ── things she may not know how to say, and words he can use ── */
.saylist{list-style:none;margin-top:var(--s1);}
.saylist li{font-family:var(--serif);font-weight:300;font-style:italic;
  font-size:var(--t-emph);line-height:1.62;color:var(--ink);
  max-width:32ch;padding-block:1.15rem;border-top:1px solid var(--hair);}
.saylist li:first-child{border-top:none;padding-top:0;}
.p-end .saylist li{border-top-color:var(--hair);}

/* ── instead of / try ── */
.pairs{margin-top:var(--s1);}
.pair{padding-block:1.4rem;border-top:1px solid var(--hair);}
.pair:first-child{border-top:none;padding-top:0;}
.pairs dt{font-family:var(--sans);font-size:var(--t-lbl);letter-spacing:.2em;
  text-transform:uppercase;font-weight:500;color:var(--taupe);text-indent:.18em;}
.pairs dd{font-family:var(--serif);font-size:var(--t-read);line-height:1.72;
  max-width:34ch;margin:.3rem 0 1rem;}
.pairs dd:last-child{margin-bottom:0;}
.pairs .was{color:var(--taupe);}
.pairs .now{color:var(--ink);}
body.partner .read.note{margin-top:var(--s1);color:var(--taupe);}

/* ── today ── */
.todo{list-style:none;counter-reset:t;margin-top:var(--s1);}
.todo li{counter-increment:t;position:relative;font-family:var(--serif);
  font-size:var(--t-read);line-height:1.76;max-width:34ch;
  padding:1.25rem 0 1.25rem 2.4rem;border-top:1px solid var(--hair);}
.todo li:first-child{border-top:none;padding-top:0;}
.todo li::before{content:counter(t);position:absolute;left:0;top:1.35rem;
  font-family:var(--serif);font-size:1.1rem;color:var(--clay);}
.todo li:first-child::before{top:.15rem;}
.todo strong{font-weight:500;}
body.partner .reflect{margin-top:var(--s1);font-style:italic;color:var(--taupe);}

/* ── when more is needed ── */
.signs{margin-top:var(--s2);}

/* ── resources, rendered from the shared list ── */
.resgroup{margin-top:var(--s1);}
.resgroup .resitem:first-of-type{padding-top:.2rem;}
.resgroup + .resgroup{padding-top:var(--s1);border-top:1px solid var(--hair);}
.resgroup .lbl{color:var(--taupe);}
.resgroup.urgent .lbl{color:var(--clay);}
.resitem{padding-block:.35rem;}
.resitem + .resitem{padding-top:0;}
.resitem .rname{font-family:var(--serif);font-size:var(--t-read);line-height:1.5;color:var(--ink);
  margin-bottom:.1rem;}
.resitem a{display:inline-flex;align-items:center;min-height:44px;
  font-family:var(--sans);font-size:.98rem;letter-spacing:.02em;color:var(--clay);
  text-decoration:underline;text-underline-offset:4px;}
.resitem a:active{opacity:.72;}
.resitem .rnote{font-family:var(--sans);font-size:.94rem;line-height:1.68;
  color:var(--taupe);max-width:40ch;margin-top:.15rem;margin-bottom:.5rem;}
body.partner .disclaimer{margin-top:var(--s2);}

/* ── the close ── */
.p-end{padding-block:var(--s2) var(--s4);}
.p-end .ask{font-size:clamp(1.24rem,4.8vw,1.6rem);line-height:1.46;font-weight:300;
  font-style:italic;color:var(--clay);max-width:28ch;margin-block:1.3rem;}
.p-end .sitline{font-size:clamp(1.3rem,5vw,1.7rem);line-height:1.4;font-weight:300;
  color:var(--ink);max-width:24ch;margin-top:var(--s2);}
.wordsblock{margin-top:var(--s2);}
.words{margin-top:1rem;}
.attrib{font-family:var(--sans);font-size:.86rem;color:var(--taupe);
  margin-top:var(--s2);opacity:.9;}
.attrib em{font-family:var(--serif);font-style:italic;font-size:1.1em;}

@media (prefers-reduced-motion: reduce){
  body.partner *{animation:none!important;transition:none!important;}
}

.endnav{margin-top:var(--s2);padding-top:var(--s1);border-top:1px solid var(--hair);}
.endnav .tlink{font-size:.94rem;}


/* a way onward for the partner who wants to understand more.
   Quiet, and after the ask — his job on this page is to go and sit
   with her, not to keep reading. */
.p-end .pmore{margin-top:var(--s2);max-width:34ch;}