/* ============================================================
   /harrison page - SAM design-system reskin (visual layer only).
   Layers the SAM signatures (graph-paper texture, numbered
   eyebrows, orange rules, hard-offset shadows, Archivo display
   type, navy authority bands, squared print-card corners) onto
   the existing bp- and bc- classes. No copy, layout, or markup
   structure changes; loads LAST so it wins ties.
   Self-contained: tokens defined here (sam.css is not linked
   on this page), scoped to body.about which is unique to
   /harrison. Mirrors css/book-sam.css (the worked example).
   ============================================================ */

body.about{
  --abs-navy:#0F2038;
  --abs-navy-2:#182E4E;
  --abs-navy-3:#0A1626;
  --abs-orange:#E07A3F;
  --abs-orange-2:#C9632B;
  --abs-cream:#FAF7F0;
  --abs-cream-2:#F1EBDE;
  --abs-ink:#232830;
  --abs-ink-soft:#4A5160;
  --abs-paper-line:rgba(15,32,56,.055);
  --abs-navy-line:rgba(250,247,240,.14);
  --abs-card-edge:rgba(15,32,56,.16);
  --abs-radius:6px;
  --abs-disp:"Archivo","Barlow Condensed",sans-serif;
  --abs-body:"Readex Pro",system-ui,sans-serif;

  background:var(--abs-cream);
  color:var(--abs-ink);
}
body.about main{background:var(--abs-cream)}

/* ---------- surfaces: graph paper on cream, flat on cream-2 ---------- */
body.about .bp-hero-founder,
body.about .bp-book,
body.about .bp-framework{
  background-color:var(--abs-cream);
  background-image:linear-gradient(var(--abs-paper-line) 1px,transparent 1px),linear-gradient(90deg,var(--abs-paper-line) 1px,transparent 1px);
  background-size:28px 28px;
}
/* speaking goes flat cream-2 so it separates from the graph-paper press
   section above it instead of running together (the two were both paper) */
body.about .bp-bio,
body.about .bp-track,
body.about .bp-speak,
body.about .bp-find{background:var(--abs-cream-2)}
/* a hairline top rule to make the press -> speaking break unmistakable */
body.about .bp-speak{border-top:1px solid rgba(15,32,56,.10)}
body.about .bp-press{
  background-color:var(--abs-cream);
  background-image:linear-gradient(var(--abs-paper-line) 1px,transparent 1px),linear-gradient(90deg,var(--abs-paper-line) 1px,transparent 1px);
  background-size:28px 28px;
  border-top:none;border-bottom:none;
}

/* ---------- navy authority bands (thesis + conversation + final CTA) ---------- */
body.about .bc-manifesto-feature,
body.about .bc-conversation,
body.about .bp-cta{
  position:relative;
  background:linear-gradient(165deg,var(--abs-navy) 0%,var(--abs-navy-3) 100%);
  color:var(--abs-cream);
  border-left:none;
}
body.about .bc-manifesto-feature::before,
body.about .bc-conversation::before,
body.about .bp-cta::before{
  content:"";position:absolute;inset:0;pointer-events:none;
  background-image:linear-gradient(var(--abs-navy-line) 1px,transparent 1px),linear-gradient(90deg,var(--abs-navy-line) 1px,transparent 1px);
  background-size:64px 64px;opacity:.18;
}
body.about .bc-manifesto-feature .bc-wrap,
body.about .bc-conversation .bc-wrap,
body.about .bp-cta .bc-wrap{position:relative;z-index:2}
/* orange divider so the navy final CTA reads against the navy footer */
body.about .bp-cta{border-bottom:4px solid var(--abs-orange)}

/* ---------- stage strip: light SAM polish only ---------- */
body.about .bc-stage-strip{
  background:var(--abs-cream-2);
  border-bottom:1px solid var(--abs-card-edge);
}
body.about .bc-stage-strip-prefix{color:var(--abs-orange-2)}
body.about .bc-stage-strip-step.is-active{color:var(--abs-orange-2)}

/* ---------- display type: Archivo headers ---------- */
body.about main h1,
body.about main h2,
body.about main h3{
  font-family:var(--abs-disp);
  letter-spacing:-0.015em;
}
body.about .bc-manifesto-feature h2,
body.about .bp-bio h2,
body.about .bp-book h2,
body.about .bp-track h2,
body.about .bp-press h2,
body.about .bp-speak h2,
body.about .bp-find h2,
body.about .bp-framework h2{
  font-weight:800;text-transform:none;
  font-size:clamp(28px,3.4vw,42px);line-height:1.1;
}
body.about .bc-manifesto-feature h2{color:var(--abs-cream)}

/* orange rule under the section H2s */
body.about .bc-manifesto-feature h2::after,
body.about .bp-bio h2::after,
body.about .bp-book h2::after,
body.about .bp-track h2::after,
body.about .bp-press h2::after,
body.about .bp-speak h2::after,
body.about .bp-find h2::after,
body.about .bp-framework h2::after,
body.about .bp-cta-h::after{
  content:"";display:block;width:64px;height:4px;
  background:var(--abs-orange);margin-top:22px;
}

/* ---------- eyebrows: SAM numbered-ledger treatment ---------- */
body.about .bc-eyebrow{
  font-family:var(--abs-body);font-weight:600;font-size:13px;
  letter-spacing:.22em;text-transform:uppercase;color:var(--abs-orange-2);
  opacity:1;display:flex;align-items:center;margin-bottom:18px;
}
body.about .bc-eyebrow .num{
  font-family:var(--abs-disp);font-weight:800;color:var(--abs-navy);
  border:1.5px solid var(--abs-navy);border-radius:3px;
  padding:1px 7px;margin-right:12px;font-size:12px;letter-spacing:.05em;
  flex:none;
}
/* the numbered box replaces the old orange dot on the book eyebrow */
body.about .bc-eyebrow .num~.dot{display:none}
body.about .bc-manifesto-feature .bc-eyebrow,
body.about .bc-conversation .bc-eyebrow,
body.about .bp-cta .bc-eyebrow{color:var(--abs-orange)}
body.about .bc-manifesto-feature .bc-eyebrow .num,
body.about .bc-conversation .bc-eyebrow .num,
body.about .bp-cta .bc-eyebrow .num{
  color:var(--abs-cream);border-color:var(--abs-cream);
}

/* ---------- buttons: SAM action style, squared corners ---------- */
body.about .bc-btn{
  font-family:var(--abs-disp);font-weight:800;text-transform:none;
  letter-spacing:.01em;font-size:16px;
  padding:15px 28px;border-radius:var(--abs-radius);
  transition:transform .15s ease,box-shadow .15s ease,background .15s ease,color .15s ease,border-color .15s ease;
}
body.about .bc-btn--solid,
body.about .bc-btn--solid.bc-btn--manifesto{
  background:var(--abs-orange);color:var(--abs-navy);
  border:1px solid var(--abs-orange);
  box-shadow:0 2px 0 var(--abs-orange-2);
}
body.about .bc-btn--solid:hover,
body.about .bc-btn--solid.bc-btn--manifesto:hover{
  background:var(--abs-orange);color:var(--abs-navy);border-color:var(--abs-orange);
  transform:translateY(-2px);box-shadow:0 5px 0 var(--abs-orange-2);
}
body.about .bc-btn--ghost{
  background:transparent;color:var(--abs-navy);
  border:1.5px solid rgba(15,32,56,.35);box-shadow:none;
}
body.about .bc-btn--ghost:hover{
  background:transparent;color:var(--abs-orange-2);border-color:var(--abs-orange);
  transform:translateY(-2px);
}
/* ghosts that sit on the navy final CTA band */
body.about .bp-cta .bc-btn--ghost{
  color:var(--abs-cream);border-color:var(--abs-navy-line);
}
body.about .bp-cta .bc-btn--ghost:hover{
  color:var(--abs-orange);border-color:var(--abs-orange);
}

/* ============================================================
   BLOCK 1 - HERO (founder)
   ============================================================ */
body.about .bp-hero-founder .bc-hero-h1{
  font-family:var(--abs-disp);font-weight:900;text-transform:none;
  font-size:clamp(46px,6.6vw,88px)!important; /* inline style on the h1 carries the old condensed scale */
  line-height:1.02;letter-spacing:-0.02em;
  color:var(--abs-navy);
}
body.about .bp-hero-founder .bc-hero-h1 .accent{
  color:var(--abs-orange);
  background-image:linear-gradient(to top,rgba(224,122,63,.28) 0 .18em,transparent .18em);
}
body.about .bp-hero-founder .bc-hero-h1::after{
  content:"";display:block;width:64px;height:4px;
  background:var(--abs-orange);margin-top:26px;
}
body.about .bp-hero-roles{
  font-family:var(--abs-body);font-weight:600;font-size:12.5px;
  letter-spacing:.14em;color:var(--abs-ink-soft);opacity:1;
}
body.about .bp-hero-roles em{font-style:normal}
body.about .bp-hero-tagline{
  font-family:var(--abs-body);font-style:normal;font-weight:300;
  font-size:clamp(18px,2vw,21px);line-height:1.6;
  color:var(--abs-ink-soft);opacity:1;
  border-left:3px solid var(--abs-orange);
}
/* portrait as a print card: cream mat, squared corners, hard-offset shadow */
body.about .bp-hero-photo{
  background:var(--abs-cream);
  border:1.5px solid var(--abs-card-edge);
  border-radius:8px;
  padding:14px;
  filter:none;
  box-shadow:14px 14px 0 rgba(15,32,56,.14);
  transform:rotate(-1.2deg);transition:transform .35s ease;
}
/* the credential roles default to white-space:nowrap (base harrison.css);
   the long "Author - You Have Already Been Replaced by AI" line then can't
   wrap on a phone and forces horizontal scroll. Let them wrap when narrow;
   they still sit on one line wherever they fit (e.g. the 2-col desktop hero). */
body.about .bp-hero-roles span{white-space:normal}
body.about .bp-hero-photo:hover{transform:rotate(0)}

/* ============================================================
   OUR THESIS (navy manifesto band)
   ============================================================ */
body.about .bc-manifesto-cover{
  filter:drop-shadow(14px 14px 0 rgba(0,0,0,.3));
  transform:rotate(-1.4deg);transition:transform .35s ease;
}
body.about .bc-manifesto-cover:hover{transform:rotate(0)}
body.about .bc-manifesto-sub{
  font-family:var(--abs-body);font-style:normal;font-weight:300;
  font-size:clamp(16.5px,1.8vw,19px);line-height:1.6;
  color:rgba(250,247,240,.82);opacity:1;
}
body.about .bc-manifesto-epi{
  border-left:3px solid var(--abs-orange);color:var(--abs-orange);
}
body.about .bc-manifesto-foot{color:rgba(250,247,240,.65);opacity:1}

/* ============================================================
   BLOCK 2 - BIO NARRATIVE
   ============================================================ */
body.about .bp-bio-text p{
  font-family:var(--abs-body);color:var(--abs-ink);opacity:1;
}
body.about .bp-bio-text p:first-child::first-letter{
  font-family:var(--abs-disp);font-style:normal;font-weight:800;
  color:var(--abs-orange);font-size:3.1em;line-height:.8;
  margin:8px 14px 0 0;
}

/* ============================================================
   BLOCK 3 - BOOK CALLOUT
   ============================================================ */
body.about .bp-book-cover{
  filter:drop-shadow(14px 14px 0 rgba(15,32,56,.16));
  transition:transform .35s ease;
}
body.about .bp-book-cover:hover{transform:rotate(0)}
body.about .bp-book-sub{
  font-family:var(--abs-body);font-style:normal;font-weight:300;
  font-size:clamp(17px,1.9vw,20px);line-height:1.6;
  color:var(--abs-ink-soft);opacity:1;
}
body.about .bp-book-meta{
  font-family:var(--abs-body);font-weight:600;font-size:12.5px;
  letter-spacing:.14em;color:var(--abs-ink-soft);opacity:1;
}

/* ============================================================
   BLOCK 4 - TRACK RECORD (ledger timeline)
   ============================================================ */
body.about .bp-track-sub{
  font-family:var(--abs-body);font-style:normal;font-weight:300;
  font-size:clamp(16.5px,1.8vw,19px);line-height:1.6;
  color:var(--abs-ink-soft);opacity:1;
}
body.about .bp-timeline{border-top:1.5px solid var(--abs-card-edge)}
body.about .bp-tl-row{border-bottom:1px dashed var(--abs-card-edge)}
body.about .bp-tl-year{
  font-family:var(--abs-disp);font-weight:800;letter-spacing:.08em;
  color:var(--abs-orange-2);
}
body.about .bp-tl-title{
  font-family:var(--abs-disp);font-weight:700;text-transform:none;
  letter-spacing:-0.01em;font-size:clamp(19px,2.1vw,24px);line-height:1.2;
  color:var(--abs-navy);
}
body.about .bp-tl-desc{
  font-family:var(--abs-body);color:var(--abs-ink-soft);opacity:1;
}

/* ============================================================
   BLOCK 4b - IN THE PRESS (print-card image + proof quote)
   ============================================================ */
body.about .bp-press-image{
  background:var(--abs-cream);
  border:1.5px solid var(--abs-card-edge);
  border-radius:8px;
  padding:12px;
  box-shadow:14px 14px 0 rgba(15,32,56,.14);
  transform:rotate(-1.2deg);transition:transform .35s ease;
}
body.about .bp-press-image:hover{transform:rotate(0)}
body.about .bp-press-quote{
  font-family:var(--abs-disp);font-style:normal;font-weight:600;
  font-size:clamp(18px,2.1vw,23px);line-height:1.42;
  color:var(--abs-navy);
  border-left:4px solid var(--abs-orange);
}
body.about .bp-press-quote-attr{
  font-family:var(--abs-body);font-weight:400;color:var(--abs-ink-soft);
}
body.about .bp-press-sub{
  font-family:var(--abs-body);color:var(--abs-ink-soft);
}

/* ============================================================
   BLOCK 5 - SPEAKING (photo as print card + format ledger)
   ============================================================ */
body.about .bp-speak-photo{
  background:var(--abs-cream);
  border:1.5px solid var(--abs-card-edge);
  border-radius:8px;
  padding:14px;
  filter:none;
  box-shadow:14px 14px 0 rgba(15,32,56,.14);
  transform:rotate(-1.2deg);transition:transform .35s ease;
}
body.about .bp-speak-photo:hover{transform:rotate(0)}
body.about .bp-speak-lede{
  font-family:var(--abs-body);font-style:normal;font-weight:300;
  font-size:clamp(17px,1.9vw,20px);line-height:1.6;
  color:var(--abs-ink-soft);opacity:1;
}
body.about .bp-formats{border-top:1.5px solid var(--abs-card-edge)}
body.about .bp-format{border-bottom:1px dashed var(--abs-card-edge)}
body.about .bp-format-num{
  font-family:var(--abs-disp);font-weight:900;color:var(--abs-orange-2);
}
body.about .bp-format-name{
  font-family:var(--abs-disp);font-weight:700;text-transform:none;
  letter-spacing:-0.01em;font-size:clamp(19px,2.1vw,24px);
  color:var(--abs-navy);
}
body.about .bp-format-meta{
  font-family:var(--abs-body);font-style:normal;font-weight:600;
  font-size:13px;letter-spacing:.1em;text-transform:uppercase;
  color:var(--abs-orange-2);opacity:1;
}
body.about .bp-format-desc{
  font-family:var(--abs-body);color:var(--abs-ink-soft);opacity:1;
}

/* ============================================================
   BLOCK 5b - IN CONVERSATION (navy band, video print cards)
   ============================================================ */
body.about .bc-conversation-video{
  border-radius:8px;
  border:1.5px solid var(--abs-navy-line);
  box-shadow:10px 10px 0 rgba(0,0,0,.28);
}
body.about .bc-conversation-caption{
  font-family:var(--abs-body);font-style:normal;font-weight:300;
  font-size:clamp(16.5px,1.8vw,19px);line-height:1.55;
  color:rgba(250,247,240,.85);
}
body.about .bc-conversation-cite{
  font-family:var(--abs-body);text-transform:none;letter-spacing:0;
}
body.about .bc-conversation-name{
  font-family:var(--abs-disp);font-weight:700;font-size:15.5px;
  color:var(--abs-cream);
}
body.about .bc-conversation-role{
  font-size:13.5px;letter-spacing:0;color:rgba(250,247,240,.65);opacity:1;
}
body.about .bc-conversation-foot .bc-btn--text{
  color:var(--abs-cream);border-bottom-color:var(--abs-navy-line);
}
body.about .bc-conversation-foot .bc-btn--text:hover{
  color:var(--abs-orange);border-bottom-color:var(--abs-orange);
}

/* ============================================================
   BLOCK 6 - WHERE TO FIND ME (channel print cards)
   ============================================================ */
body.about .bp-find-sub{
  font-family:var(--abs-body);font-style:normal;font-weight:300;
  font-size:clamp(16.5px,1.8vw,19px);line-height:1.6;
  color:var(--abs-ink-soft);opacity:1;
}
body.about .bp-channels{border-top:none;gap:20px}
body.about .bp-channel{
  background:var(--abs-cream);
  border:1.5px solid var(--abs-card-edge);
  border-top:5px solid var(--abs-orange);
  border-radius:8px;
  box-shadow:7px 7px 0 rgba(15,32,56,.08);
  padding:clamp(24px,3vw,32px) clamp(22px,2.6vw,28px);
  transition:transform .18s ease,box-shadow .18s ease;
}
body.about .bp-channel:hover{
  padding-left:clamp(22px,2.6vw,28px);
  transform:translate(-2px,-2px);
  box-shadow:9px 9px 0 rgba(15,32,56,.12);
}
body.about .bp-channel:nth-child(2n){
  border-left:1.5px solid var(--abs-card-edge);
  padding-left:clamp(22px,2.6vw,28px);
}
body.about .bp-channel-tag{
  font-family:var(--abs-body);font-weight:600;font-size:12px;
  letter-spacing:.18em;color:var(--abs-orange-2);
}
body.about .bp-channel-title{
  font-family:var(--abs-disp);font-weight:700;text-transform:none;
  letter-spacing:-0.01em;font-size:clamp(19px,2.1vw,23px);
  color:var(--abs-navy);
}
body.about .bp-channel-desc{
  font-family:var(--abs-body);font-style:normal;font-size:15px;
  line-height:1.6;color:var(--abs-ink-soft);opacity:1;
}
body.about .bp-channel-link{
  font-family:var(--abs-disp);font-weight:700;letter-spacing:.06em;
  font-size:13px;color:var(--abs-navy);
  border-bottom:1.5px solid var(--abs-orange);
}

/* ============================================================
   BLOCK 7 - FRAMEWORK CALLOUT (credential print card)
   ============================================================ */
body.about .bp-framework-inner{
  max-width:880px;
  background:var(--abs-cream);
  border:1.5px solid var(--abs-card-edge);
  border-top:5px solid var(--abs-orange);
  border-radius:8px;
  box-shadow:14px 14px 0 rgba(15,32,56,.1);
  padding:clamp(36px,5vw,60px) clamp(26px,4.5vw,64px);
}
body.about .bp-framework p{
  font-family:var(--abs-body);color:var(--abs-ink);opacity:1;
}

/* ============================================================
   BLOCK 8 - FINAL CTA (navy authority band)
   ============================================================ */
body.about .bp-cta-h{
  font-family:var(--abs-disp);font-weight:900;text-transform:none;
  font-size:clamp(40px,6.2vw,76px);line-height:1.04;letter-spacing:-0.02em;
  color:var(--abs-cream);
}
body.about .bp-cta-h .accent{color:var(--abs-orange)}
body.about .bp-cta-sub{
  font-family:var(--abs-body);font-style:normal;font-weight:300;
  font-size:clamp(17px,1.9vw,20px);line-height:1.6;
  color:rgba(250,247,240,.78);opacity:1;
}

/* ---------- small screens ---------- */
@media (max-width:480px){
  body.about .bp-hero-photo{
    transform:rotate(0);padding:10px;
    box-shadow:9px 9px 0 rgba(15,32,56,.14);
  }
  body.about .bp-book-cover{filter:drop-shadow(9px 9px 0 rgba(15,32,56,.16))}
  body.about .bc-manifesto-cover{filter:drop-shadow(9px 9px 0 rgba(0,0,0,.25));transform:rotate(0)}
  body.about .bp-speak-photo,
  body.about .bp-press-image{
    transform:rotate(0);
    box-shadow:9px 9px 0 rgba(15,32,56,.14);
  }
  body.about .bp-framework-inner{box-shadow:9px 9px 0 rgba(15,32,56,.1)}
  body.about .bc-conversation-video{box-shadow:7px 7px 0 rgba(0,0,0,.28)}
}
