/* ============================================================
   CAM — interior page compositions. Depends on cam.css + home.css.
   Same closed palette: charcoal, taupe, blush, cream, white.
   No new hues, no new dependencies.
   ============================================================ */

/* ---- Page head ------------------------------------------- */
.crumbs{display:flex;flex-wrap:wrap;align-items:center;gap:.55rem;
  font-size:var(--fs-xs);letter-spacing:.18em;text-transform:uppercase;color:var(--ink-40)}
.crumbs a{transition:color .25s var(--ease)}
.crumbs a:hover{color:var(--charcoal)}
.crumbs span{color:var(--ink-40)}
.page-head .eyebrow{margin-top:var(--s-3)}
.page-head__cta{margin-top:var(--s-4)}
.page-head--plain{border-bottom:0}

/* ---- Editorial intro: prose left, aside right ------------- */
.intro{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);
  gap:clamp(2rem,5vw,5rem);align-items:start}
.intro__body>*+*{margin-top:var(--s-3)}
.intro__body .body{max-width:42rem}
.intro__aside{padding-top:var(--s-3);border-top:1px solid var(--rule)}
.dark .intro__aside{border-top-color:var(--rule-dark)}
.intro__aside h3{font-family:var(--serif);font-size:var(--fs-h3);font-weight:400;
  line-height:1.2;letter-spacing:-.005em}
.intro__aside>*+*{margin-top:var(--s-2)}
.intro__aside ul li{font-size:var(--fs-sm);color:var(--ink-70);padding-block:.5rem;
  border-bottom:1px solid rgba(184,176,166,.35)}
.dark .intro__aside ul li{color:var(--cream-70);border-bottom-color:var(--rule-dark)}

/* ---- Treatment rows -------------------------------------- */
.tx-group+.tx-group{margin-top:var(--s-6)}
.tx-group__head{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;
  gap:var(--s-2);padding-bottom:var(--s-2);border-bottom:1px solid var(--charcoal)}
.tx-group__head h3{font-family:var(--serif);font-size:var(--fs-h3);font-weight:400;
  line-height:1.2;letter-spacing:-.005em}
.tx-group__idx{font-size:var(--fs-xs);letter-spacing:.18em;color:var(--ink-40)}
.tx{display:grid;grid-template-columns:minmax(0,15rem) minmax(0,1fr);
  gap:var(--s-1) var(--s-4);padding-block:var(--s-3);border-bottom:1px solid var(--rule)}
.tx__name{font-family:var(--serif);font-size:1.3rem;font-weight:400;line-height:1.25;
  letter-spacing:-.005em}
.tx__aka{display:block;font-family:var(--sans);font-size:var(--fs-xs);font-weight:400;
  letter-spacing:.14em;text-transform:uppercase;color:var(--ink-40);margin-top:.5rem;line-height:1.6}
.tx__desc{font-size:var(--fs-sm);line-height:1.75;color:var(--ink-70);max-width:46rem}

/* ---- Note strip ------------------------------------------ */
.note-strip{margin-top:var(--s-5);padding:var(--s-4);background:var(--white);
  border:1px solid var(--rule);border-radius:var(--r-md);
  display:grid;grid-template-columns:minmax(0,1fr) auto;gap:var(--s-3);align-items:center}
.note-strip__body>*+*{margin-top:var(--s-2)}
.note-strip h3{font-family:var(--serif);font-size:var(--fs-h3);font-weight:400;
  line-height:1.2;letter-spacing:-.005em}
.note-strip .small{max-width:46rem}
.dark .note-strip{background:transparent;border-color:var(--rule-dark)}

/* ---- Decade deck (cross-link band) ----------------------- */
.deck{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--s-3);margin-top:var(--s-5)}
.deck__card{display:flex;flex-direction:column;gap:.65rem;padding:var(--s-3);
  border:1px solid var(--rule);border-radius:var(--r-md);
  transition:background .35s var(--ease),transform .5s var(--ease)}
.deck__card:hover{background:var(--white);transform:translateY(-4px)}
.dark .deck__card{border-color:var(--rule-dark)}
.dark .deck__card:hover{background:rgba(250,247,242,.05)}
.deck__num{font-family:var(--serif);font-size:2.4rem;font-weight:300;line-height:1;
  letter-spacing:-.025em}
.deck__key{font-size:var(--fs-eyebrow);font-weight:500;letter-spacing:.26em;
  text-transform:uppercase;color:var(--ink-55)}
.dark .deck__key{color:var(--blush)}
.deck__copy{font-size:var(--fs-sm);line-height:1.7;color:var(--ink-70);flex:1}
.dark .deck__copy{color:var(--cream-70)}
.deck__go{font-size:var(--fs-xs);letter-spacing:.18em;text-transform:uppercase;color:var(--ink-40)}
.dark .deck__go{color:var(--cream-45)}
.deck__card:hover .deck__go{color:var(--charcoal)}
.dark .deck__card:hover .deck__go{color:var(--cream)}

/* ---- Numbered steps -------------------------------------- */
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--s-4);margin-top:var(--s-5)}
.step{padding-top:var(--s-3);border-top:1px solid var(--rule)}
.dark .step{border-top-color:var(--rule-dark)}
.step__n{display:block;font-family:var(--serif);font-size:2.4rem;font-weight:300;
  line-height:1;color:var(--ink-40)}
.dark .step__n{color:var(--cream-45)}
.step h3{font-family:var(--serif);font-size:var(--fs-h3);font-weight:400;line-height:1.2;
  letter-spacing:-.005em;margin-block:var(--s-2) .65rem}
.step p{font-size:var(--fs-sm);line-height:1.75;color:var(--ink-70)}
.dark .step p{color:var(--cream-70)}

/* ---- Priority cards (what this decade asks for) ---------- */
.prios{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s-3);margin-top:var(--s-5)}
.prio{padding:var(--s-4);border:1px solid var(--rule);border-radius:var(--r-md);
  background:var(--white)}
.dark .prio{background:transparent;border-color:var(--rule-dark)}
.prio__k{font-size:var(--fs-eyebrow);font-weight:500;letter-spacing:.26em;
  text-transform:uppercase;color:var(--ink-55)}
.dark .prio__k{color:var(--blush)}
.prio h3{font-family:var(--serif);font-size:var(--fs-h3);font-weight:400;line-height:1.22;
  letter-spacing:-.005em;margin-block:var(--s-2) .65rem}
.prio p{font-size:var(--fs-sm);line-height:1.75;color:var(--ink-70)}
.dark .prio p{color:var(--cream-70)}

/* ---- Hold-off block -------------------------------------- */
.holdoff{display:grid;grid-template-columns:minmax(0,14rem) minmax(0,1fr);
  gap:var(--s-3) var(--s-4);padding:var(--s-4);border:1px solid var(--rule);
  border-radius:var(--r-md);background:var(--white)}
.dark .holdoff{background:transparent;border-color:var(--rule-dark)}
.holdoff h2{font-family:var(--serif);font-size:var(--fs-h3);font-weight:400;line-height:1.2;
  letter-spacing:-.005em}
.holdoff ul li{font-size:var(--fs-sm);line-height:1.75;color:var(--ink-70);
  padding-block:.7rem;border-bottom:1px solid rgba(184,176,166,.35)}
.dark .holdoff ul li{color:var(--cream-70);border-bottom-color:var(--rule-dark)}
.holdoff ul li:last-child{border-bottom:0;padding-bottom:0}
.holdoff ul li b{font-weight:500;color:var(--charcoal)}
.dark .holdoff ul li b{color:var(--cream)}

/* ---- Photography placeholder plates ---------------------- */
.plate--wide{aspect-ratio:16/9}
.plate--pano{aspect-ratio:21/9}
.plate--sq{aspect-ratio:1/1}
.plate--4x5{aspect-ratio:4/5}
.plates{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s-3);margin-top:var(--s-5)}
.plates .plate{border:1px solid var(--rule);align-items:flex-end}
.plate-cap{margin-top:.85rem;font-size:var(--fs-xs);letter-spacing:.16em;
  text-transform:uppercase;color:var(--ink-40)}

/* ---- Provider bio (light band variant of .lead-provider) -- */
.bio{display:grid;grid-template-columns:minmax(0,.62fr) minmax(0,1fr);
  gap:clamp(2rem,5vw,5rem);align-items:center;margin-top:var(--s-5)}
.bio__body>*+*{margin-top:var(--s-3)}
.bio__body .body{max-width:none}
.bio .plate{width:100%;aspect-ratio:4/5;align-items:center;justify-content:center;
  flex-direction:column;gap:.75rem;border:1px solid var(--rule-dark);background:transparent;
  position:relative}
.bio .plate .initial{font-family:var(--serif);font-size:4rem;font-weight:300;font-style:italic;
  color:var(--taupe);line-height:1}
.bio .plate::after{position:absolute;bottom:1rem;left:50%;transform:translateX(-50%);
  white-space:nowrap;color:var(--cream-45);letter-spacing:.2em}
.bio-facts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s-2) var(--s-3);
  margin-top:var(--s-4);padding-top:var(--s-3);border-top:1px solid var(--rule-dark)}
.bio-facts div{font-size:var(--fs-sm);color:var(--cream-70)}
.bio-facts dt{font-size:var(--fs-xs);letter-spacing:.2em;text-transform:uppercase;
  color:var(--cream-45);margin-bottom:.35rem}

/* ---- Journal cards (external, until migration) ----------- */
.jposts{margin-top:var(--s-5);gap:var(--s-4) var(--s-4)}
.jpost{display:flex;flex-direction:column;gap:var(--s-2);padding-top:var(--s-3);
  border-top:1px solid var(--charcoal);transition:transform .5s var(--ease)}
.jpost:hover{transform:translateY(-4px)}
.jpost__tag{font-size:var(--fs-xs);letter-spacing:.2em;text-transform:uppercase;color:var(--ink-40)}
.jpost__title{font-family:var(--serif);font-size:var(--fs-h3);font-weight:400;line-height:1.22;
  letter-spacing:-.005em;max-width:24ch}
.jpost:hover .jpost__title{font-style:italic}
.jpost__desc{font-size:var(--fs-sm);line-height:1.75;color:var(--ink-70)}
.jpost__read{font-size:var(--fs-xs);letter-spacing:.16em;text-transform:uppercase;
  color:var(--ink-40);margin-top:auto;padding-top:var(--s-2)}

/* ---- Contact / NAP --------------------------------------- */
.info{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);
  gap:clamp(2rem,5vw,4.5rem);align-items:start}
.info-block+.info-block{margin-top:var(--s-4);padding-top:var(--s-4);
  border-top:1px solid var(--rule)}
.info-block h3{font-size:var(--fs-eyebrow);font-weight:500;letter-spacing:.24em;
  text-transform:uppercase;color:var(--ink-55);margin-bottom:var(--s-2)}
.info-block p,.info-block address{font-family:var(--serif);font-size:1.35rem;font-weight:300;
  line-height:1.5;font-style:normal;letter-spacing:-.005em}
.info-block .small{font-family:var(--sans);font-size:var(--fs-sm);line-height:1.75;
  letter-spacing:0;color:var(--ink-55)}
.info-block a{border-bottom:1px solid var(--ink-12);transition:border-color .25s var(--ease)}
.info-block a:hover{border-bottom-color:var(--charcoal)}
.map-plate{aspect-ratio:4/3;border:1px solid var(--rule);align-items:center;justify-content:center;
  flex-direction:column;gap:.6rem;text-align:center}
.map-plate .map-pin{font-family:var(--serif);font-size:1.5rem;font-style:italic;color:var(--ink-55)}
.map-plate::after{color:rgba(37,37,37,.5);letter-spacing:.2em}

/* ---- Pillars (about) ------------------------------------- */
.pillars{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--s-4);margin-top:var(--s-5)}
.pillar{padding-top:var(--s-3);border-top:1px solid var(--rule)}
.dark .pillar{border-top-color:var(--rule-dark)}
.pillar h3{font-family:var(--serif);font-size:var(--fs-h3);font-weight:400;line-height:1.2;
  letter-spacing:-.005em;margin-bottom:.65rem}
.pillar p{font-size:var(--fs-sm);line-height:1.75;color:var(--ink-70)}
.dark .pillar p{color:var(--cream-70)}

/* ---- Responsive ------------------------------------------ */
@media (max-width:1024px){
  .intro,.bio,.info{grid-template-columns:1fr}
  .bio .plate{max-width:26rem}
  .deck,.steps,.pillars{grid-template-columns:repeat(2,1fr)}
  .prios,.plates{grid-template-columns:repeat(2,1fr)}
  .prios>*:last-child:nth-child(odd){grid-column:1/-1}
}
@media (max-width:760px){
  .tx{grid-template-columns:1fr;gap:.5rem}
  .tx__aka{margin-top:.3rem}
  .note-strip{grid-template-columns:1fr}
  .note-strip .btn{width:100%}
  .deck,.steps,.pillars,.prios,.plates{grid-template-columns:1fr}
  .prios>*:last-child:nth-child(odd){grid-column:auto}
  .holdoff{grid-template-columns:1fr}
  .bio-facts{grid-template-columns:1fr}
  .plate--pano{aspect-ratio:16/9}
}


/* ---- Visual-audit fixes 8/13 ------------------------------ */
.bio .media{background:var(--charcoal)}

.section--tight .shell > .note-strip:first-child{margin-top:0}

/* ---- Interior page heroes (interim imagery until content day) ---- */
.page-hero{position:relative;min-height:100svh;display:flex;align-items:center;overflow:hidden;
  border-bottom:1px solid var(--rule);padding:0}
.page-hero .ph-bg{position:absolute;inset:0}
.page-hero .ph-bg img{width:100%;height:100%;object-fit:cover;display:block}
.page-hero .ph-scrim{position:absolute;inset:0;
  background:linear-gradient(75deg,rgba(20,18,17,.78) 0%,rgba(20,18,17,.46) 45%,rgba(20,18,17,.10) 78%),
             linear-gradient(0deg,rgba(20,18,17,.52) 0%,rgba(20,18,17,0) 45%)}
.page-hero .shell{position:relative;z-index:2;padding-top:7rem;padding-bottom:3rem;width:100%}
.page-hero .crumbs,.page-hero .crumbs a{color:var(--cream-45)}
.page-hero .crumbs a:hover{color:var(--cream)}
.page-hero .eyebrow{color:var(--blush)}
.page-hero .h1{color:var(--cream);max-width:9.5em}
.page-hero .h1 em{color:var(--blush)}
.page-hero .lead{color:var(--cream-70);max-width:30rem}
.page-hero .btn{background:var(--cream);color:var(--charcoal)}
.page-hero .btn:hover{background:var(--blush)}
.page-hero .btn--ghost{background:transparent;color:var(--cream);border:1px solid rgba(250,247,242,.55)}
.page-hero .btn--ghost:hover{border-color:var(--cream);background:rgba(250,247,242,.08)}
.page-hero .hero__caption{position:absolute;right:0;bottom:0;z-index:2}
@media (max-width:760px){.page-hero{min-height:100svh}.page-hero .shell{padding-top:7.5rem}}
