/* ==========================================================================
   Morgan Howard Communications
   Design system stylesheet
   Tokens per DESIGN-new-MHC-website.md
   ========================================================================== */

/* Self-hosted webfonts — no external requests, no third-party tracking.
   Cormorant Garamond stands in for Copernicus / Tiempos Headline;
   Inter stands in for StyreneB. Both per the design system's substitution notes. */
@font-face{font-family:'Cormorant Garamond';font-style:normal;font-weight:400;font-display:swap;
  src:url('../fonts/cormorant-garamond-latin-400-normal.woff2') format('woff2');}
@font-face{font-family:'Cormorant Garamond';font-style:italic;font-weight:400;font-display:swap;
  src:url('../fonts/cormorant-garamond-latin-400-italic.woff2') format('woff2');}
@font-face{font-family:'Cormorant Garamond';font-style:normal;font-weight:500;font-display:swap;
  src:url('../fonts/cormorant-garamond-latin-500-normal.woff2') format('woff2');}
@font-face{font-family:'Cormorant Garamond';font-style:normal;font-weight:600;font-display:swap;
  src:url('../fonts/cormorant-garamond-latin-600-normal.woff2') format('woff2');}
@font-face{font-family:'Inter';font-style:normal;font-weight:400;font-display:swap;
  src:url('../fonts/inter-latin-400-normal.woff2') format('woff2');}
@font-face{font-family:'Inter';font-style:normal;font-weight:500;font-display:swap;
  src:url('../fonts/inter-latin-500-normal.woff2') format('woff2');}
@font-face{font-family:'Inter';font-style:normal;font-weight:600;font-display:swap;
  src:url('../fonts/inter-latin-600-normal.woff2') format('woff2');}

:root{
  /* colour */
  --primary:#cc785c;
  --primary-active:#a9583e;
  --primary-disabled:#e6dfd8;
  --ink:#141413;
  --body:#3d3d3a;
  --body-strong:#252523;
  --muted:#6c6a64;
  --muted-soft:#8e8b82;
  --hairline:#e6dfd8;
  --hairline-soft:#ebe6df;
  --canvas:#faf9f5;
  --surface-soft:#f5f0e8;
  --surface-card:#efe9de;
  --cream-strong:#e8e0d2;
  --dark:#181715;
  --dark-elev:#252320;
  --dark-soft:#1f1e1b;
  --on-primary:#fff;
  --on-dark:#faf9f5;
  --on-dark-soft:#a09d96;
  --teal:#5db8a6;
  --amber:#e8a55a;

  /* type */
  --serif:'Cormorant Garamond','EB Garamond',Georgia,'Times New Roman',serif;
  --sans:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;

  /* space */
  --xxs:4px; --xs:8px; --sm:12px; --md:16px; --lg:24px; --xl:32px; --xxl:48px; --section:96px;

  /* radius */
  --r-sm:6px; --r-md:8px; --r-lg:12px; --r-xl:16px; --r-pill:9999px;

  --maxw:1200px;
  --measure:68ch;
}

*,*::before,*::after{box-sizing:border-box;}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;}
body{
  margin:0;background:var(--canvas);color:var(--body);
  font-family:var(--sans);font-size:17px;line-height:1.62;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
}
img{max-width:100%;height:auto;display:block;}

/* ---------- type ---------- */
h1,h2,h3,h4,.serif{font-family:var(--serif);font-weight:400;color:var(--ink);}
h1{font-size:clamp(2.6rem,6vw,4.1rem);line-height:1.04;letter-spacing:-.02em;margin:0 0 var(--lg);}
h2{font-size:clamp(2rem,4vw,3rem);line-height:1.1;letter-spacing:-.02em;margin:0 0 var(--md);}
h3{font-size:clamp(1.5rem,2.6vw,2rem);line-height:1.16;letter-spacing:-.015em;margin:0 0 var(--sm);}
h4{font-size:1.32rem;line-height:1.25;letter-spacing:-.01em;margin:0 0 var(--xs);}
p{margin:0 0 var(--lg);max-width:var(--measure);}
a{color:var(--primary);text-decoration:none;border-bottom:1px solid rgba(204,120,92,.32);transition:border-color .15s;}
a:hover{border-bottom-color:var(--primary);}
a:focus-visible,button:focus-visible{outline:3px solid rgba(204,120,92,.45);outline-offset:3px;border-radius:2px;}
strong,b{color:var(--ink);font-weight:600;}
em,i{font-style:italic;}
blockquote{margin:var(--xl) 0;padding:0 0 0 var(--lg);border-left:2px solid var(--primary);}
blockquote p{font-family:var(--serif);font-size:1.5rem;line-height:1.34;color:var(--ink);}
hr{border:none;border-top:1px solid var(--hairline);margin:var(--xxl) 0;}
ul,ol{max-width:var(--measure);padding-left:1.25em;margin:0 0 var(--lg);}
li{margin-bottom:var(--xs);}
::selection{background:rgba(204,120,92,.22);}

.eyebrow{font-size:.75rem;font-weight:500;letter-spacing:.14em;text-transform:uppercase;
  color:var(--muted);margin:0 0 var(--md);}
.lede{font-size:1.28rem;line-height:1.5;color:var(--body-strong);max-width:60ch;}
.small{font-size:.92rem;color:var(--muted);}
.center{text-align:center;margin-left:auto;margin-right:auto;}

/* ---------- layout ---------- */
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 var(--lg);}
.narrow{max-width:760px;margin-left:auto;margin-right:auto;}
section{padding:var(--section) 0;}
.band-soft{background:var(--surface-soft);}
.band-card{background:var(--surface-card);}
.band-dark{background:var(--dark);color:var(--on-dark-soft);}
.band-dark h1,.band-dark h2,.band-dark h3,.band-dark h4,.band-dark .serif{color:var(--on-dark);}
.band-dark .eyebrow{color:var(--on-dark-soft);}
.band-dark .lede,.band-dark .attrib,.band-dark .small{color:var(--on-dark);}
.band-dark strong,.band-dark b{color:var(--on-dark);}
.band-dark a{color:#e5a58b;border-bottom-color:rgba(229,165,139,.4);}

.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:var(--xxl);}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--lg);}
.split{display:grid;grid-template-columns:1fr 1fr;gap:var(--xxl);align-items:center;}
.split-wide{display:grid;grid-template-columns:1.15fr 1fr;gap:var(--xxl);align-items:center;}

/* ---------- header / nav ---------- */
.site-header{position:sticky;top:0;z-index:60;background:rgba(250,249,245,.93);
  backdrop-filter:saturate(160%) blur(10px);border-bottom:1px solid var(--hairline-soft);}
.nav{max-width:var(--maxw);margin:0 auto;padding:0 var(--lg);height:74px;
  display:flex;align-items:center;gap:var(--xl);}
.brand{font-family:var(--serif);font-size:1.45rem;letter-spacing:-.01em;color:var(--ink);
  border:none;white-space:nowrap;}
.brand span{color:var(--primary);}
.nav-links{display:flex;gap:var(--lg);margin-left:auto;align-items:center;}
.nav-links a{font-size:.92rem;font-weight:500;color:var(--ink);border:none;padding:6px 0;
  border-bottom:2px solid transparent;}
.nav-links a:hover{border-bottom-color:var(--primary);}
.nav-links a.current{border-bottom-color:var(--primary);}
.nav-links a.btn{color:var(--on-primary);padding:12px 22px;border-bottom:none;}
.nav-links a.btn:hover{border-bottom:none;}
.btn{display:inline-block;background:var(--primary);color:var(--on-primary);font-family:var(--sans);
  font-size:.92rem;font-weight:500;padding:12px 22px;border-radius:var(--r-md);border:none;line-height:1;}
.btn:hover{background:var(--primary-active);border:none;}
.btn-ghost{background:transparent;color:var(--ink);border:1px solid var(--hairline);}
.btn-ghost:hover{background:var(--surface-card);border:1px solid var(--hairline);}
.btn-cream{background:var(--canvas);color:var(--ink);}
.btn-cream:hover{background:#fff;}
.nav-toggle{display:none;background:none;border:none;font-family:var(--sans);font-size:.92rem;
  font-weight:500;color:var(--ink);cursor:pointer;margin-left:auto;padding:10px;}

/* ---------- hero ---------- */
.hero{padding:calc(var(--section) * .9) 0 var(--section);}
.hero h1{max-width:16ch;}
.hero h1.hero-q{max-width:20ch;font-size:clamp(2rem,3.5vw,2.9rem);line-height:1.12;letter-spacing:-.015em;}
.hero figcaption{font-size:.8rem;}
.hero .lede{margin-bottom:var(--xl);}
.page-head{padding:calc(var(--section) * .75) 0 var(--xxl);}
.page-head h1{max-width:19ch;font-size:clamp(2.3rem,5vw,3.5rem);}
.crumb{font-size:.85rem;color:var(--muted);margin-bottom:var(--lg);}
.crumb a{color:var(--muted);border:none;}
.crumb a:hover{color:var(--ink);}

/* ---------- cards ---------- */
.card{background:var(--surface-card);border-radius:var(--r-lg);padding:var(--xl);
  display:flex;flex-direction:column;}
.card h3{font-size:1.5rem;margin-bottom:var(--xs);}
.card p{font-size:.98rem;margin-bottom:var(--md);color:var(--body);}
.card .more{margin-top:auto;font-size:.9rem;font-weight:500;color:var(--primary);border:none;}
.card:hover .more{border-bottom:1px solid var(--primary);}
.card-plain{background:var(--canvas);border:1px solid var(--hairline);}
.card-dark{background:var(--dark);color:var(--on-dark-soft);}
.card-dark h3{color:var(--on-dark);}
.card-link{border:none;color:inherit;display:block;}
.card-link:hover{border:none;}
.card-link:hover .card{background:var(--cream-strong);}
.card-link:hover .card-dark{background:var(--dark-elev);}

.tile{border-top:1px solid var(--hairline);padding:var(--lg) 0;display:block;border-bottom:none;color:inherit;}
.tile:hover{border-top-color:var(--primary);border-bottom:none;}
.tile h4{margin-bottom:2px;}
.tile p{font-size:.95rem;margin:0;color:var(--muted);}

.pill{display:inline-block;background:var(--surface-card);color:var(--ink);font-size:.78rem;
  font-weight:500;border-radius:var(--r-pill);padding:5px 14px;margin:0 6px 6px 0;}
.pill-coral{background:var(--primary);color:#fff;letter-spacing:.1em;text-transform:uppercase;font-size:.7rem;}

/* ---------- cta ---------- */
.cta-coral{background:var(--primary);color:#fff;border-radius:var(--r-lg);padding:var(--xxl) var(--xxl);}
.cta-coral h2{color:#fff;max-width:18ch;}
.cta-coral p{color:rgba(255,255,255,.92);font-size:1.12rem;}
.cta-coral a:not(.btn){color:#fff;border-bottom-color:rgba(255,255,255,.5);}
.contact-inline{font-family:var(--serif);font-size:1.35rem;color:#fff;margin-top:var(--lg);}
.contact-inline a{color:#fff;border-bottom-color:rgba(255,255,255,.45);}

/* ---------- footer ---------- */
.site-footer{background:var(--dark);color:var(--on-dark-soft);padding:var(--section) 0 var(--xxl);font-size:.92rem;}
.site-footer h5{font-family:var(--sans);font-size:.72rem;font-weight:500;letter-spacing:.14em;
  text-transform:uppercase;color:var(--on-dark-soft);margin:0 0 var(--md);}
.site-footer a{color:var(--on-dark);border:none;display:block;padding:5px 0;}
.site-footer a:hover{color:var(--primary);}
.footer-cols{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--xl);padding-bottom:var(--xxl);
  border-bottom:1px solid rgba(250,249,245,.13);}
.footer-invite{padding:var(--xxl) 0;border-bottom:1px solid rgba(250,249,245,.13);}
.footer-invite .serif{font-size:2rem;color:var(--on-dark);margin:0 0 var(--sm);display:block;}
.footer-invite a{display:inline;color:var(--on-dark);border-bottom:1px solid rgba(250,249,245,.35);}
.footer-legal{padding-top:var(--xxl);font-size:.84rem;color:var(--on-dark-soft);}
.footer-legal a{display:inline;color:var(--on-dark-soft);border-bottom:1px solid rgba(160,157,150,.35);}
.footer-legal p{max-width:70ch;}

/* ---------- figures & placeholders ---------- */
figure{margin:var(--xl) 0;}
figure img{border-radius:var(--r-lg);}
figcaption{font-size:.86rem;color:var(--muted);margin-top:var(--sm);max-width:60ch;line-height:1.5;}
.full-bleed{margin:var(--xxl) 0;}
.full-bleed img{width:100%;border-radius:var(--r-lg);}

.ph{position:relative;border:2px dashed var(--primary);border-radius:var(--r-lg);
  background:repeating-linear-gradient(135deg,var(--surface-card),var(--surface-card) 14px,
  var(--surface-soft) 14px,var(--surface-soft) 28px);
  display:flex;flex-direction:column;justify-content:center;align-items:center;
  padding:var(--xl);text-align:center;color:var(--muted);}
.ph::before{content:"IMAGE PLACEHOLDER";position:absolute;top:14px;left:50%;transform:translateX(-50%);
  font-size:.62rem;font-weight:600;letter-spacing:.16em;color:var(--primary);}
.ph .ph-title{font-family:var(--serif);font-size:1.4rem;color:var(--ink);margin:0 0 6px;max-width:32ch;line-height:1.2;}
.ph .ph-note{font-size:.84rem;margin:0;max-width:42ch;line-height:1.45;}
.ph .ph-status{font-size:.68rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;
  margin-top:var(--md);color:var(--primary);}
.ph-3-2{aspect-ratio:3/2;} .ph-16-9{aspect-ratio:16/9;} .ph-4-5{aspect-ratio:4/5;} .ph-1-1{aspect-ratio:1/1;}
.ph-dark{border-color:var(--primary);background:repeating-linear-gradient(135deg,var(--dark-elev),
  var(--dark-elev) 14px,var(--dark-soft) 14px,var(--dark-soft) 28px);color:var(--on-dark-soft);}
.ph-dark .ph-title{color:var(--on-dark);}

/* low-res warning badge */
.lowres{position:relative;}
.lowres::after{content:"LOW-RES — REPLACE";position:absolute;bottom:10px;left:10px;
  background:var(--primary);color:#fff;font-size:.6rem;font-weight:600;letter-spacing:.1em;
  padding:4px 9px;border-radius:var(--r-pill);}

/* ---------- framework diagram ---------- */
.diagram{background:var(--canvas);border:1px solid var(--hairline);border-radius:var(--r-lg);
  padding:var(--xl);margin:var(--xl) 0;}
.band-dark .diagram{background:var(--dark-soft);border-color:rgba(250,249,245,.14);}
.diagram svg{width:100%;height:auto;display:block;}

/* ---------- pull quote ---------- */
.pull{font-family:var(--serif);font-size:clamp(1.6rem,3vw,2.3rem);line-height:1.28;color:var(--ink);
  max-width:22ch;margin:var(--xxl) 0;letter-spacing:-.015em;}
.band-dark .pull{color:var(--on-dark);}
.quote-block{background:var(--surface-card);border-radius:var(--r-lg);padding:var(--xl) var(--xxl);margin:var(--xl) 0;}
.quote-block p:last-child{margin-bottom:0;}
.attrib{font-size:1.18rem;color:var(--body-strong);font-style:normal;}

/* ---------- misc ---------- */
.steps{counter-reset:s;list-style:none;padding:0;max-width:var(--measure);}
.steps li{counter-increment:s;position:relative;padding-left:56px;margin-bottom:var(--lg);}
.steps li::before{content:counter(s);position:absolute;left:0;top:-2px;width:36px;height:36px;
  border-radius:50%;background:var(--primary);color:#fff;display:flex;align-items:center;
  justify-content:center;font-size:.9rem;font-weight:500;}
.steps strong{display:block;font-family:var(--serif);font-size:1.3rem;color:var(--ink);
  font-weight:400;margin-bottom:2px;}
.band-dark .steps strong{color:var(--on-dark);}

.clientlist{columns:3;column-gap:var(--xl);font-size:.95rem;max-width:100%;}
.clientlist div{break-inside:avoid;padding:5px 0;color:var(--body-strong);}

.skip{position:absolute;left:-9999px;}
.skip:focus{left:var(--lg);top:var(--sm);z-index:99;background:var(--primary);color:#fff;
  padding:10px 18px;border-radius:var(--r-md);}

.note{background:var(--surface-card);border-left:3px solid var(--primary);border-radius:0 var(--r-md) var(--r-md) 0;
  padding:var(--lg) var(--xl);margin:var(--xl) 0;font-size:.95rem;}
.note p{margin-bottom:var(--xs);max-width:none;}
.note p:last-child{margin-bottom:0;}

/* ---------- responsive ---------- */
@media(max-width:1000px){
  .grid-3{grid-template-columns:1fr 1fr;}
  .clientlist{columns:2;}
}
@media(max-width:820px){
  body{font-size:16px;}
  section{padding:64px 0;}
  .grid-2,.grid-3,.split,.split-wide{grid-template-columns:1fr;gap:var(--xl);}
  .footer-cols{grid-template-columns:1fr 1fr;gap:var(--lg);}
  .nav-links{position:fixed;inset:74px 0 auto 0;background:var(--canvas);flex-direction:column;
    align-items:flex-start;gap:0;padding:var(--lg);border-bottom:1px solid var(--hairline);
    display:none;max-height:calc(100vh - 74px);overflow:auto;}
  .nav-links.open{display:flex;}
  .nav-links a{font-family:var(--serif);font-size:1.6rem;padding:10px 0;width:100%;}
  .nav-links .btn{font-family:var(--sans);font-size:.95rem;margin-top:var(--md);}
  .nav-toggle{display:block;}
  .clientlist{columns:1;}
  .cta-coral{padding:var(--xxl) var(--lg);}
  .pull{max-width:none;}
}
@media(max-width:520px){
  .footer-cols{grid-template-columns:1fr;}
  h1{font-size:2.2rem;}
  .brand{font-size:1.15rem;}
  .brand span{display:none;}
  .nav{gap:var(--md);}
}
@media(max-width:820px) and (min-width:521px){
  .brand{font-size:1.25rem;}
}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto;}
  *{transition:none!important;animation:none!important;}
}

/* ---------- on-this-page rail (long service pages) ---------- */
.toc{display:flex;flex-wrap:wrap;align-items:baseline;gap:var(--md) var(--lg);
  padding:var(--md) 0 var(--lg);margin-bottom:var(--xl);border-bottom:1px solid var(--hairline);}
.toc span{font-size:.72rem;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);}
.toc a{font-size:.95rem;color:var(--ink);border-bottom:1px solid transparent;}
.toc a:hover{border-bottom-color:var(--primary);}
section[id]{scroll-margin-top:90px;}

/* ---------- service colors ---------- */
:root{
  --svc-1:#cc785c;  --svc-1-tint:#f7e8e1;  --svc-1-hover:#f2ddd3;
  --svc-2:#5f7d6b;  --svc-2-tint:#e7eeea;  --svc-2-hover:#dae5df;
  --svc-3:#a8823c;  --svc-3-tint:#f4ecda;  --svc-3-hover:#ece0c8;
  --svc-4:#4f6e7b;  --svc-4-tint:#e6edf0;  --svc-4-hover:#d8e3e8;
}
/* equal-height cards everywhere */
.card-link{height:100%;}
.card{height:100%;}

.svc-colors .card{border-top:3px solid transparent;}
.svc-colors .card-link:nth-child(1) .card{background:var(--svc-1-tint);border-top-color:var(--svc-1);}
.svc-colors .card-link:nth-child(2) .card{background:var(--svc-2-tint);border-top-color:var(--svc-2);}
.svc-colors .card-link:nth-child(3) .card{background:var(--svc-3-tint);border-top-color:var(--svc-3);}
.svc-colors .card-link:nth-child(4) .card{background:var(--svc-4-tint);border-top-color:var(--svc-4);}
.svc-colors .card-link:nth-child(1) .more{color:var(--svc-1);}
.svc-colors .card-link:nth-child(2) .more{color:var(--svc-2);}
.svc-colors .card-link:nth-child(3) .more{color:var(--svc-3);}
.svc-colors .card-link:nth-child(4) .more{color:var(--svc-4);}
.svc-colors .card-link:nth-child(1) .card:hover .more{border-bottom-color:var(--svc-1);}
.svc-colors .card-link:nth-child(2) .card:hover .more{border-bottom-color:var(--svc-2);}
.svc-colors .card-link:nth-child(3) .card:hover .more{border-bottom-color:var(--svc-3);}
.svc-colors .card-link:nth-child(4) .card:hover .more{border-bottom-color:var(--svc-4);}
.svc-colors .card-link:nth-child(1):hover .card{background:var(--svc-1-hover);}
.svc-colors .card-link:nth-child(2):hover .card{background:var(--svc-2-hover);}
.svc-colors .card-link:nth-child(3):hover .card{background:var(--svc-3-hover);}
.svc-colors .card-link:nth-child(4):hover .card{background:var(--svc-4-hover);}

/* ---------- Venn diagram ---------- */
.venn-wrap{margin:var(--xxl) 0 0;}
.venn{display:block;width:100%;max-width:740px;margin:0 auto;height:auto;}
.venn .lobes{mix-blend-mode:multiply;}
.venn .vl{font-family:var(--sans);font-size:20px;font-weight:500;letter-spacing:.01em;fill:var(--ink);}
.venn .vl-center{font-family:var(--serif);font-size:25px;font-weight:400;fill:#faf9f5;letter-spacing:.005em;}
.venn-wrap figcaption{text-align:center;max-width:46ch;margin:var(--lg) auto 0;color:var(--muted);font-size:.9rem;}

@media(max-width:600px){
  /* use the full viewport width so the labels render as large as possible */
  .venn{width:calc(100% + 2*var(--lg));max-width:none;margin-left:calc(-1*var(--lg));}
  .venn .vl{font-size:22px;}
}

/* stacked cards beside a portrait */
.card-stack{display:grid;grid-template-columns:1fr;gap:var(--lg);align-content:center;}
.card-stack .card{height:auto;}
.card-stack .card-link{height:auto;}
.split-top{align-items:center;}

/* hero background motifs */
.hero{position:relative;overflow:hidden;
  background:linear-gradient(100deg,#fdfcfa 0%,#faf9f5 34%,#f4eee5 72%,#ece5d8 100%);}
.hero > .wrap{position:relative;z-index:1;}
.hero-bg{position:absolute;top:0;left:0;width:100%;height:auto;z-index:0;pointer-events:none;}
@media(max-width:860px){.hero-bg{display:none;}}

/* ---------- emphasis treatments for the hero line ---------- */
.hl{position:relative;}
.hl-bold .hl{font-weight:600;color:var(--ink);}
.hl-orange .hl{color:var(--primary);}
.hl-marker .hl{
  background-image:linear-gradient(103deg,rgba(204,120,92,0) .4%,rgba(204,120,92,.30) 2.4%,
    rgba(204,120,92,.34) 95%,rgba(204,120,92,0) 99%);
  background-size:100% 58%;background-position:0 78%;background-repeat:no-repeat;
  padding:0 .14em;margin:0 -.06em;}

/* the line under the hero portrait */
.hero .portrait-cap{font-size:1.02rem;letter-spacing:.06em;text-transform:none;
  color:var(--body-strong);text-align:center;max-width:none;margin-top:var(--md);}
/* a shorter gap between the hero and what follows */
.hero{padding-bottom:calc(var(--section) * .5);}

/* testimonial blockquotes read as spoken quotes */
blockquote p:not(.attrib){font-style:italic;}
blockquote p:not(.attrib)::before{content:"\201C";}
blockquote p:not(.attrib)::after{content:"\201D";}
.attrib{margin-top:var(--md);}

/* ---------- speaking engagements list ---------- */
.talks{list-style:none;margin:32px 0 0;padding:0;border-top:1px solid var(--hairline);}
.talks li{padding:var(--lg) 0;border-bottom:1px solid var(--hairline);}
.talk-title{font-family:var(--serif);font-size:1.32rem;line-height:1.3;color:var(--ink);
  margin:0 0 6px;max-width:none;}
.talk-meta{font-size:.95rem;line-height:1.5;color:var(--muted);margin:0;max-width:none;}
.talks-more{margin-top:var(--lg);}
.talks-more summary{display:inline-block;cursor:pointer;list-style:none;
  font-size:.95rem;letter-spacing:.02em;color:var(--primary);
  border-bottom:1px solid rgba(204,120,92,.45);padding-bottom:2px;}
.talks-more summary::-webkit-details-marker{display:none;}
.talks-more summary::after{content:" \2193";}
.talks-more summary:hover{border-bottom-color:var(--primary);}
.talks-more[open] summary{display:none;}
.talks-more .talks{margin-top:0;border-top:none;}
.talks{max-width:none;}
.talks li{display:flex;gap:var(--xl);align-items:baseline;justify-content:space-between;}
.talk-main{flex:1 1 auto;}
.talk-host{font-size:.95rem;line-height:1.5;color:var(--muted);margin:0;max-width:70ch;}
.talk-when{flex:0 0 auto;text-align:right;white-space:nowrap;font-size:.92rem;
  color:var(--muted);margin:0;max-width:none;}
@media(max-width:760px){
  .talks li{display:block;}
  .talk-when{text-align:left;white-space:normal;margin-top:6px;}
}

/* ---------- About: portrait matted to the height of the card stack ---------- */
.about-split{align-items:stretch;}
.about-split > div:first-child{display:flex;min-width:0;}
.about-portrait{flex:1 1 auto;display:flex;margin:0;min-height:0;
  background:var(--surface-card);border-radius:var(--r-lg);padding:var(--lg);}
.about-portrait img{flex:1 1 auto;width:100%;height:100%;min-height:0;
  object-fit:cover;object-position:50% 18%;border-radius:var(--r-md);}
@media(max-width:860px){
  .about-portrait img{height:auto;object-fit:contain;}
}

/* ---------- small headshot beside an interview note ---------- */
.interview-split{grid-template-columns:140px 1fr;gap:var(--xl);align-items:start;}
.headshot{margin:0;max-width:140px;}
.headshot img{width:100%;height:auto;display:block;border-radius:var(--r-md);}
.headshot figcaption{font-size:.8rem;margin-top:var(--xs);}
@media(max-width:760px){.interview-split{grid-template-columns:1fr;}}

/* ---------- work samples ---------- */
.sample-row{align-items:center;}
.sample-cover{margin:0;}
.sample-cover img{width:100%;height:auto;display:block;border-radius:var(--r-md);
  box-shadow:0 10px 30px rgba(20,20,19,.13);}
.sample-kind{font-size:.95rem;color:var(--muted);margin:0 0 var(--md);}
.sample-actions{display:flex;flex-wrap:wrap;align-items:center;gap:var(--lg);margin-top:var(--xl);}
.sample-dl{font-size:.95rem;}

/* ---------- a block of square photos beside an intro ---------- */
.anc-split{align-items:start;grid-template-columns:1.1fr 1fr;}
.photo-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--lg);}
.photo-grid figure{margin:0;}
.photo-grid img{width:100%;aspect-ratio:1/1;display:block;
  background:var(--surface-card);border-radius:var(--r-md);}
@media(max-width:860px){.anc-split{grid-template-columns:1fr;}}
/* the copy that runs on below the photo block keeps the same left edge */
.anc-rest{max-width:760px;margin-top:var(--xl);}
.photo-stack{display:grid;grid-template-columns:1fr;gap:var(--lg);max-width:250px;}
.photo-stack figure{margin:0;}
.photo-stack img{width:100%;aspect-ratio:1/1;display:block;object-fit:cover;
  background:var(--surface-card);border-radius:var(--r-md);}
/* an image that keeps its own proportions instead of being cropped square */
.photo-stack figure.natural img{aspect-ratio:auto;height:auto;object-fit:fill;background:none;}
/* a photo column that sits on the baseline of the copy beside it */
.anc-split .stack-bottom{align-self:end;}
.anc-split ul:last-child{margin-bottom:0;}
.anc-split ul li:last-child{margin-bottom:0;}
/* a pull quote one step down from the default */
.pull.pull-sm{font-size:clamp(1.35rem,2.4vw,1.95rem);max-width:none;}
/* a testimonial given more weight */
.quote-lg p{font-size:1.9rem;}
.quote-lg .attrib{font-size:1.32rem;}

/* ---------- a photo pinned up like a snapshot ---------- */
.snapshot{margin:0;width:150px;max-width:100%;
  background:#fdfcfa;padding:9px 9px 34px;border-radius:2px;
  box-shadow:0 14px 34px rgba(0,0,0,.34);
  transform:rotate(-3.2deg);transform-origin:50% 50%;}
.snapshot img{width:100%;height:auto;display:block;border-radius:0;}
.intro-dark{grid-template-columns:1fr 200px;align-items:center;}
.intro-dark .lede{max-width:none;margin-bottom:0;}
@media(max-width:860px){
  .intro-dark{grid-template-columns:1fr;}
  .snapshot{margin-top:var(--xl);}
}
/* a figure set a little smaller than its column */
.fig-sm{max-width:84%;}
/* a figure at three quarters of its column, centred */
.fig-75{max-width:75%;margin-left:auto;margin-right:auto;}