/* ============================================================
   drnancyweaver.com
   ONE stylesheet controls every page.
   Change a colour or font HERE and it updates the whole site.
   ============================================================ */

/* ---- 1. COLOURS AND FONTS -------------------------------
   These are the only values you need to touch to reskin
   the site. Everything below uses them.
   --------------------------------------------------------- */
:root{
  /* ---- QUILT PALETTE ---------------------------------- */
  --chocolate: #43302A;   /* warm ground, dark bands */
  --navy:      #22304E;   /* headlines, dark sections */
  --blue:      #5B87BC;   /* secondary blocks */
  --aqua:      #7FC3C6;   /* blocks, nods to Olley */
  --yellow:    #FBCF3C;   /* the underline, blocks, nods to S/S */
  --magenta:   #CE4B84;   /* eyebrows, links, primary button */
  --muslin:    #FBF6EC;   /* page background */

  --navy-soft: #4F5A70;   /* body text */
  --cream:     #FBF6EC;   /* alias, page background */
  --white:     #FFFCF5;   /* alternating section background */
  --teal:      #CE4B84;   /* alias: accent role is now magenta */
  --rule:      #E5DBC8;   /* borders and dividers */

  --on-navy-body:  #A7B2C6;
  --on-navy-label: #FBCF3C;
  --on-navy-fine:  #8794AB;

  --font-display: 'Archivo', Helvetica, Arial, sans-serif;
  --font-body:    'Figtree', Helvetica, Arial, sans-serif;

  --maxw: 1080px;
}

/* ---- 2. BASE -------------------------------------------- */
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  background:var(--cream);
  color:var(--navy-soft);
  font-family:var(--font-body);
  font-size:17px;
  line-height:1.75;
  -webkit-font-smoothing:antialiased;
}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 32px}
h1,h2,h3{font-family:var(--font-display);font-weight:800;color:var(--navy);line-height:1.04;letter-spacing:-.022em}
a{color:inherit}
img{max-width:100%;height:auto;display:block}

/* small caps label that sits above most headings */
.eyebrow{
  font-family:var(--font-body);font-weight:700;font-size:12px;
  letter-spacing:.18em;text-transform:uppercase;color:var(--magenta);
}

/* ---- 3. NAVIGATION -------------------------------------- */
nav{position:sticky;top:0;z-index:50;background:rgba(245,240,230,.94);backdrop-filter:blur(8px);border-bottom:1px solid var(--rule)}
nav .wrap{display:flex;align-items:center;justify-content:space-between;height:74px;gap:24px}
.brandmark{font-family:var(--font-display);font-size:18px;color:var(--navy);text-decoration:none;white-space:nowrap}
.navlinks{display:flex;gap:28px;list-style:none}
.navlinks a{font-size:14.5px;text-decoration:none;color:var(--navy-soft);padding-bottom:3px;border-bottom:2px solid transparent;white-space:nowrap}
.navlinks a:hover,.navlinks a:focus-visible,.navlinks a.here{color:var(--navy);border-bottom-color:var(--yellow)}

/* ---- 4. BUTTONS ----------------------------------------- */
.btn{display:inline-flex;align-items:center;font-family:var(--font-body);font-weight:700;font-size:15px;letter-spacing:.01em;padding:15px 28px;text-decoration:none;border:2px solid;transition:.16s}
.btn-yellow {background:var(--magenta);color:var(--muslin);border-color:var(--magenta)}
.btn-yellow:hover{background:#B83D73;border-color:#B83D73}
.btn-outline{background:transparent;color:var(--navy);border-color:var(--navy)}
.btn-outline:hover{background:var(--navy);color:var(--muslin)}
.btn-solid {background:var(--navy);color:var(--muslin);border-color:var(--navy)}
.btn-solid:hover{background:#18233C;border-color:#18233C}

.more{font-size:14.5px;font-weight:700;text-decoration:none;color:var(--teal);border-bottom:2px solid var(--yellow);padding-bottom:2px}

/* ---- 5. HERO -------------------------------------------- */
.hero{position:relative;background:var(--muslin);padding:52px 0 60px}
.herogrid{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:56px;align-items:center;width:100%}
.hero h1{font-size:clamp(32px,5vw,54px);line-height:1.02;color:var(--navy);max-width:15ch;margin:18px 0 6px}
.hero h1 em{font-style:normal;color:var(--navy)}
.hero .eyebrow{color:var(--magenta)}
.hero .sub{margin:24px 0 0;max-width:48ch;font-size:18px;color:var(--navy-soft)}
.hero .who{margin-top:22px;font-size:16px;color:var(--navy-soft);max-width:48ch}
.cta{display:flex;gap:14px;flex-wrap:wrap;margin-top:36px}

/* portrait placeholder. DELETE this block once a real photo is in. */
.portrait-slot{position:relative;aspect-ratio:4/5;background:#FFFCF5;border:2px dashed var(--rule);display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:28px;gap:10px}
.portrait-slot .ps-label{font-weight:700;font-size:12px;letter-spacing:.18em;text-transform:uppercase;color:var(--magenta)}
.portrait-slot .ps-note{font-size:14px;line-height:1.6;color:var(--navy-soft);max-width:24ch}
.portrait-slot .ps-dim{font-size:12.5px;color:#9A9384;font-style:italic}

/* simple page header used on Press and Contact */
.pagehead{background:var(--chocolate);padding:64px 0 60px}
.pagehead h1{color:var(--cream);font-size:clamp(30px,4vw,48px);max-width:18ch;margin-top:14px}
.pagehead .eyebrow{color:var(--yellow)}
.pagehead p{color:#CFC2B8;max-width:52ch;margin-top:20px;font-size:18px}

/* ---- 6. SECTIONS ---------------------------------------- */
section.pad{padding:88px 0}
.alt{background:var(--white);border-top:1px solid var(--rule);border-bottom:1px solid var(--rule)}
.dark{background:var(--chocolate);color:var(--muslin);padding:72px 0}
.dark h2{color:var(--muslin);font-size:clamp(26px,3.4vw,36px);max-width:22ch}
.dark .lead{max-width:50ch;color:#CFC2B8;font-size:18px;margin:16px 0 44px}
.sechead{display:flex;align-items:baseline;justify-content:space-between;gap:20px;flex-wrap:wrap;margin-bottom:34px}
.sechead h2{font-size:clamp(26px,3.1vw,36px)}
.twocol{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:56px}

/* ---- 7. THE NUMBERS, as uneven quilt blocks --------- */
.ngrid{display:grid;grid-template-columns:1.15fr .78fr 1fr;gap:0;margin-top:8px}
.ngrid > div{padding:36px 28px}
.ngrid > div:nth-child(1){background:var(--aqua)}
.ngrid > div:nth-child(2){background:var(--yellow)}
.ngrid > div:nth-child(3){background:var(--magenta)}
.ngrid .n{font-family:var(--font-display);font-weight:800;font-size:clamp(34px,4.8vw,48px);color:var(--navy);line-height:1;letter-spacing:-.02em}
.ngrid > div:nth-child(3) .n{color:var(--muslin)}
.ngrid p{font-size:15px;line-height:1.55;margin-top:10px;max-width:22ch;color:#2C4A52}
.ngrid > div:nth-child(2) p{color:#5E4A11}
.ngrid > div:nth-child(3) p{color:#F7D6E4}
.src{margin-top:26px;font-size:13px;color:var(--navy-soft);font-style:italic}

/* the hand-drawn underline */
.squiggle{display:block;width:200px;height:11px;margin:0 0 6px}

/* quilt band */
.quiltband{width:100%;height:auto;display:block}

/* ---- 8. TALK LIST --------------------------------------- */
.talks{list-style:none;margin:36px 0 0;border-top:1px solid var(--rule)}
.talks li{padding:26px 0;border-bottom:1px solid var(--rule)}
.talks h3{font-size:23px;line-height:1.2;margin-bottom:7px}
.talks p{font-size:16px;color:var(--navy-soft);margin:0;max-width:62ch}
.audience{display:flex;flex-wrap:wrap;gap:10px;margin-top:32px}
.audience span{font-size:13px;letter-spacing:.04em;padding:7px 14px;border:1px solid var(--rule);background:var(--cream);color:var(--navy)}
.bookrow{margin-top:38px;display:flex;gap:16px;align-items:center;flex-wrap:wrap}
.bookrow .note{font-size:14.5px;color:var(--navy-soft)}

/* ---- 9. LISTS AND CARDS --------------------------------- */
.orglist{list-style:none;margin-top:18px}
.orglist li{padding:12px 0 12px 26px;position:relative;font-size:16.5px;color:var(--navy)}
.orglist li:before{content:"";position:absolute;left:0;top:21px;width:12px;height:2px;background:var(--yellow)}

.progs{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:48px}
.prog{border:1px solid var(--rule);background:var(--white);padding:28px 26px;text-decoration:none;display:block;transition:.16s}
.prog:hover{border-color:var(--teal)}
.prog h3{font-size:21px;margin-bottom:9px}
.prog p{font-size:15px;margin-bottom:14px}
.prog .go{font-size:12.5px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--teal)}

.eps{display:grid;grid-template-columns:repeat(3,1fr);gap:26px}
.ep{background:var(--white);border:1px solid var(--rule);padding:26px 24px 28px;display:flex;flex-direction:column;transition:.16s;text-decoration:none}
.ep:hover{border-color:var(--teal);transform:translateY(-2px)}
.ep .num{font-family:var(--font-display);font-size:15px;color:var(--yellow)}
.ep h3{font-size:20px;margin:10px 0 12px;line-height:1.25}
.ep p{font-size:15px;color:var(--navy-soft);flex:1}
.ep .meta{margin-top:18px;font-size:12.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--teal);font-weight:700}
.subrow{margin-top:30px;font-size:14.5px;color:var(--navy-soft)}
.subrow a{color:var(--navy);font-weight:700}

/* ---- 10. PRESS PAGE ------------------------------------- */
.bioblock{border:1px solid var(--rule);background:var(--white);padding:28px 26px;margin-bottom:20px}
.bioblock .biolabel{display:flex;justify-content:space-between;align-items:baseline;gap:16px;margin-bottom:14px;flex-wrap:wrap}
.bioblock .wordcount{font-size:12.5px;color:#8f8b80;font-style:italic}
.factgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:28px;margin-top:8px}
.factgrid .f{border-left:3px solid var(--yellow);padding-left:16px}
.factgrid .f strong{display:block;font-family:var(--font-display);font-size:30px;color:var(--navy);line-height:1.1}
.factgrid .f span{font-size:14.5px;color:var(--navy-soft)}
.assetgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:22px;margin-top:8px}
.asset{border:1px solid var(--rule);background:var(--white);padding:22px;text-align:center}
.asset img{margin:0 auto 16px;max-height:78px;width:auto}
.asset .aname{font-size:15px;font-weight:700;color:var(--navy);margin-bottom:4px}
.asset .afile{font-size:12.5px;color:#8f8b80}
.slot{border:2px dashed var(--rule);background:var(--white);padding:34px 26px;text-align:center;color:#8f8b80}
.slot strong{display:block;color:var(--navy);font-size:15.5px;margin-bottom:6px}
.pubs{list-style:none;margin-top:8px}
.pubs li{padding:16px 0;border-bottom:1px solid var(--rule);font-size:15.5px;line-height:1.65}
.pubs li em{color:var(--navy);font-style:normal;font-weight:700}

/* ---- 11. FORMS ------------------------------------------ */
.form{display:flex;gap:12px;flex-wrap:wrap;max-width:520px}
.form input{flex:1;min-width:230px;padding:15px 18px;border:2px solid #4a5480;background:#1a2245;color:var(--cream);font-family:var(--font-body);font-size:16px}
.form input::placeholder{color:var(--on-navy-fine)}
.form input:focus{outline:none;border-color:var(--yellow)}
.form button{padding:15px 30px;background:var(--yellow);color:var(--navy);border:2px solid var(--yellow);font-family:var(--font-body);font-weight:700;font-size:15px;cursor:pointer}
.form button:hover{background:#e8a80c;border-color:#e8a80c}
.fineprint{margin-top:16px;font-size:13px;color:var(--on-navy-fine)}

.bigform{max-width:640px}
.field{margin-bottom:22px}
.field label{display:block;font-size:13px;font-weight:700;letter-spacing:.09em;text-transform:uppercase;color:var(--navy);margin-bottom:8px}
.field input,.field select,.field textarea{
  width:100%;padding:14px 16px;border:1px solid var(--rule);background:var(--white);
  color:var(--navy-soft);font-family:var(--font-body);font-size:16px;
}
.field textarea{min-height:150px;resize:vertical}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--teal)}
.fieldrow{display:grid;grid-template-columns:1fr 1fr;gap:22px}

/* ---- 12. FOOTER ----------------------------------------- */
footer{background:var(--cream);padding:56px 0 46px;border-top:1px solid var(--rule)}
.frow{display:flex;justify-content:space-between;gap:36px;flex-wrap:wrap;align-items:flex-start}
.flinks{list-style:none;display:flex;gap:26px;flex-wrap:wrap}
.flinks a{font-size:14.5px;text-decoration:none;color:var(--navy-soft)}
.flinks a:hover{color:var(--navy)}
.social{display:flex;gap:18px;list-style:none}
.social a{font-size:13px;letter-spacing:.08em;text-transform:uppercase;font-weight:700;text-decoration:none;color:var(--teal)}
.copy{margin-top:34px;font-size:13px;color:#8f8b80;max-width:60ch}

/* ---- 13. ACCESSIBILITY AND MOBILE ----------------------- */
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid var(--teal);outline-offset:3px}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}

@media(max-width:860px){
  .navlinks{display:none}
  .eps,.progs,.ngrid,.twocol,.herogrid,.fieldrow{grid-template-columns:1fr;gap:34px}
  .talks li{grid-template-columns:1fr;gap:8px}
  .hero{min-height:0;padding:60px 0}
  .portrait-slot{aspect-ratio:3/2}
  section.pad{padding:62px 0}
  .wrap{padding:0 22px}
  .fieldrow{gap:0}
}

/* ---- 14. INDIVIDUAL POSTS ------------------------------- */
.post{max-width:660px;margin:0 auto;padding:74px 32px 60px}
.post .postmeta{font-size:13px;letter-spacing:.1em;text-transform:uppercase;color:var(--teal);font-weight:700;margin-bottom:14px}
.post h1{font-size:clamp(30px,4vw,44px);margin-bottom:26px;line-height:1.12}
.post p{margin-bottom:22px;font-size:18px;line-height:1.8}
.post h2,.post h3{margin:38px 0 16px}
.post ol,.post ul{margin:0 0 22px 22px}
.post li{margin-bottom:14px;font-size:17.5px;line-height:1.75}
.post blockquote{border-left:3px solid var(--yellow);padding-left:22px;margin:30px 0;font-size:19px;color:var(--navy)}
.post .prayer{font-size:20px;line-height:2;color:var(--navy)}
.post .backlink{display:inline-block;margin-top:40px;padding-top:26px;border-top:1px solid var(--rule);font-size:14.5px;font-weight:700;color:var(--teal);text-decoration:none}
.post .origin{margin-top:30px;font-size:14.5px;color:#8f8b80;font-style:italic}
@media(max-width:860px){.post{padding:52px 22px 44px}.post p{font-size:17px}}

/* archive list on the writing page */
.archive{list-style:none;margin-top:8px}
.archive li{padding:20px 0;border-bottom:1px solid var(--rule);display:grid;grid-template-columns:110px 1fr;gap:24px;align-items:baseline}
.archive .yr{font-family:var(--font-display);font-size:17px;color:var(--yellow)}
.archive a{text-decoration:none}
.archive .t{font-size:19px;color:var(--navy);font-weight:700;display:block;margin-bottom:4px}
.archive .d{font-size:15px;color:var(--navy-soft)}
@media(max-width:860px){.archive li{grid-template-columns:1fr;gap:4px}}

/* archive rows that hold a div rather than a link */
.archive li > div{display:block}
.archive .t{display:block}


/* ============================================================
   14. HOMEPAGE 2.0  (list-first)
   ============================================================ */

/* -- vintage quilt band -- */
.quiltband{width:100%;height:auto;display:block}

/* -- hero with inline capture -- */
.hero{background:var(--muslin);padding:40px 0 52px}
.hero h1{font-family:var(--font-display);font-weight:600;font-size:clamp(32px,5.4vw,56px);line-height:1.08;letter-spacing:-.018em;color:var(--navy);max-width:16ch;margin:20px 0 8px}
.hero .sub{font-weight:300;font-size:19px;line-height:1.75;color:var(--navy-soft);max-width:50ch;margin:0 0 30px}
.squiggle{display:block;width:250px;height:14px;margin:0 0 26px}

.capture{background:#FFFCF5;border:1px solid var(--rule);padding:26px 26px 24px;max-width:520px}
.capture .offer{font-family:var(--font-display);font-weight:600;font-size:19px;line-height:1.3;color:var(--navy);margin:0 0 6px}
.capture .offer-sub{font-weight:300;font-size:15.5px;line-height:1.6;color:var(--navy-soft);margin:0 0 18px}
.capture form{display:flex;gap:9px;flex-wrap:wrap}
.capture input{flex:1;min-width:210px;padding:14px 16px;border:1px solid var(--rule);background:var(--muslin);color:var(--navy);font-family:var(--font-body);font-size:16px}
.capture input:focus{outline:none;border-color:var(--magenta)}
.capture button{padding:14px 26px;background:var(--magenta);color:var(--muslin);border:2px solid var(--magenta);font-family:var(--font-body);font-weight:600;font-size:15px;cursor:pointer}
.capture button:hover{background:#B83D73;border-color:#B83D73}
.capture .fine{font-weight:300;font-size:12.5px;color:#8B8272;margin:12px 0 0}

/* -- credibility strip -- */
.credstrip{background:var(--navy);padding:30px 0}
.credstrip .wrap{display:flex;flex-wrap:wrap;gap:14px 34px;align-items:center;justify-content:center;max-width:1240px}
.credstrip span{font-weight:400;font-size:16px;letter-spacing:.01em;color:#D8DFEA;white-space:nowrap}
.credstrip span b{color:var(--yellow);font-weight:700;font-size:17.5px}

/* -- stats on tan -- */
.stats{background:#F0E4CE;padding:56px 0 52px}
.stats h2{font-family:var(--font-display);font-weight:600;font-size:clamp(23px,3.3vw,34px);line-height:1.18;color:var(--navy);max-width:24ch;margin:16px 0 42px}
.statgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:38px;text-align:center;justify-items:center}
.statgrid .n{font-family:var(--font-display);font-weight:700;font-size:clamp(52px,8vw,84px);color:var(--navy);margin:0;line-height:.92;letter-spacing:-.04em}
.statgrid > div:nth-child(1) .n{color:var(--magenta)}
.statgrid > div:nth-child(3) .n{color:var(--chocolate)}
.statgrid .u{width:120px;height:10px;display:block;margin:10px auto 12px}
.statgrid p{font-weight:400;font-size:16.5px;line-height:1.55;color:#5A4E3C;margin:0 auto;max-width:20ch}
.stats .src{margin-top:32px;font-weight:300;font-size:13.5px;color:#7A6C58;font-style:italic}

/* -- odd bird -- */
.oddbird{background:var(--chocolate);padding:66px 0;text-align:center}
.oddbird h2{font-family:var(--font-display);font-weight:600;font-size:clamp(21px,2.9vw,30px);line-height:1.3;color:var(--muslin);max-width:32ch;margin:14px auto 16px;text-wrap:balance}
.oddbird p{font-weight:300;font-size:18px;line-height:1.8;color:#CFC2B8;max-width:56ch;margin:0 auto 14px}
.oddbird .eyebrow{color:var(--yellow)}
.oddbird a{color:var(--yellow);font-weight:600;text-decoration:none;border-bottom:2px solid rgba(251,207,60,.4)}
.oddbird a:hover{border-bottom-color:var(--yellow)}

/* -- three doors -- */
.doors{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:34px}
.door{border:1px solid var(--rule);background:#FFFCF5;padding:0 0 26px;text-decoration:none;display:block;transition:.16s;overflow:hidden}
.door:hover{border-color:var(--magenta);transform:translateY(-2px)}
.door .cap{height:8px;display:block}
.door .inner{padding:24px 24px 0}
.door h3{font-family:var(--font-display);font-weight:600;font-size:20px;color:var(--navy);margin:0 0 9px;line-height:1.2}
.door p{font-weight:300;font-size:15px;line-height:1.6;color:var(--navy-soft);margin:0 0 14px}
.door .go{font-size:12.5px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--magenta)}

/* -- reel slot -- */
.reelslot{border:2px dashed var(--rule);background:#FFFCF5;padding:64px 26px;text-align:center;margin-top:26px}
.reelslot strong{display:block;font-family:var(--font-display);font-weight:600;font-size:19px;color:var(--navy);margin-bottom:8px}
.reelslot span{font-weight:300;font-size:15px;color:var(--navy-soft)}

/* -- logo strip -- */
.logostrip{margin-top:34px;padding-top:26px;border-top:1px solid var(--rule)}
.logostrip .lab{font-weight:700;font-size:11.5px;letter-spacing:.16em;text-transform:uppercase;color:#8B8272;margin:0 0 16px}
.logostrip ul{list-style:none;display:flex;flex-wrap:wrap;gap:12px 30px}
.logostrip li{font-weight:500;font-size:15px;color:var(--navy-soft)}

/* -- compressed bottom band -- */
.moreband{background:#F0E4CE;padding:52px 0}
.morecols{display:grid;grid-template-columns:repeat(3,1fr);gap:30px}
.morecols h3{font-family:var(--font-display);font-weight:600;font-size:18px;color:var(--navy);margin:0 0 8px}
.morecols p{font-weight:300;font-size:15px;line-height:1.6;color:#5A4E3C;margin:0 0 12px}
.morecols a{font-size:12.5px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--magenta);text-decoration:none}

@media(max-width:860px){
  .doors,.morecols{grid-template-columns:1fr}
  .credstrip .wrap{justify-content:flex-start}
  .credstrip span{font-size:12.5px;white-space:normal}
  .hero{padding:28px 0 40px}
  .stats{padding:44px 0 40px}
  .oddbird,.moreband{padding:44px 0}
}

/* ---- 15. ABOUT PAGE ------------------------------------- */
.abouthead{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr);gap:52px;align-items:center}
.abouth1{font-family:var(--font-display);font-weight:600;font-size:clamp(36px,6vw,62px);line-height:1.02;letter-spacing:-.02em;color:var(--navy);margin:16px 0 8px}
.lede{font-weight:300;font-size:20px;line-height:1.75;color:var(--navy-soft);max-width:44ch;margin:0}
.aboutbody{max-width:60ch}
.aboutbody p{font-weight:300;font-size:19px;line-height:1.85;color:var(--navy-soft);margin:0 0 22px}
.aboutbody h2{font-family:var(--font-display);font-weight:600;font-size:clamp(22px,2.9vw,28px);line-height:1.25;color:var(--navy);margin:44px 0 18px}
.draftnote{border-left:5px solid var(--yellow);background:#FFFCF5;padding:22px 24px;margin:32px 0;font-weight:300;font-size:16px;line-height:1.7;color:var(--navy-soft)}
.draftnote strong{display:block;font-weight:600;color:var(--navy);margin-bottom:6px}
@media(max-width:860px){.abouthead{grid-template-columns:1fr;gap:30px}}

/* ---- 16. PORTRAITS -------------------------------------- */
.herogrid{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:48px;align-items:center}
.heroportrait img{width:100%;height:auto;display:block}
.aboutportrait{width:100%;height:auto;display:block}
@media(max-width:860px){
  .herogrid{grid-template-columns:1fr;gap:30px}
  .heroportrait{order:-1;max-width:320px}
}

/* ---- 17. MEDIA GRID ------------------------------------- */
.mediagrid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:24px}
.mcard{display:block;border:1px solid var(--rule);background:#FFFCF5;padding:22px 22px 20px;text-decoration:none;transition:.16s}
.mcard:hover{border-color:var(--magenta);transform:translateY(-2px)}
.mcard .outlet{display:block;font-weight:700;font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--magenta);margin-bottom:9px}
.mcard .mtitle{display:block;font-family:var(--font-display);font-weight:600;font-size:17px;line-height:1.25;color:var(--navy);margin-bottom:8px}
.mcard .mmeta{display:block;font-weight:300;font-size:13.5px;color:var(--navy-soft)}
@media(max-width:860px){.mediagrid{grid-template-columns:1fr}}

/* ---- 18. HERO OVERLAPS THE QUILT ------------------------ */
.quiltband{width:100%;height:200px;display:block;margin:0}
.hero{margin-top:0;padding:26px 0 56px;background:transparent;position:relative;z-index:2}
.hero > .wrap{background:var(--muslin);padding:34px 34px 44px}
@media(max-width:860px){
  .quiltband{height:120px}
  .hero{margin-top:0;padding:38px 0 36px}
  .hero > .wrap{padding:24px 22px 32px}
}

/* ---- 19. PARTICIPANT QUOTES ----------------------------- */
.quotes{margin-top:34px;display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.quotes blockquote{font-family:var(--font-display);font-weight:600;font-size:17px;line-height:1.45;color:var(--navy);padding-top:0}
.quotes blockquote::before{content:"\201C";display:block;font-family:var(--font-display);font-weight:700;font-size:64px;line-height:.62;color:var(--yellow);margin-bottom:12px}
.leadquote{margin-top:34px;border-top:1px solid var(--rule);padding-top:26px}
.leadquote blockquote{font-family:var(--font-display);font-weight:600;font-size:clamp(21px,2.6vw,28px);line-height:1.34;color:var(--navy);max-width:30ch;margin:0}
.leadquote blockquote::before{content:"\201C";display:block;font-family:var(--font-display);font-weight:700;font-size:88px;line-height:.6;color:var(--yellow);margin-bottom:14px}
.leadquote .qsrc{font-weight:300;font-size:13.5px;color:var(--navy-soft);font-style:italic;margin-top:16px}
.quotes .qsrc{grid-column:1/-1;font-weight:300;font-size:13.5px;color:var(--navy-soft);font-style:italic;margin-top:4px}
@media(max-width:860px){.quotes{grid-template-columns:1fr}}

/* ---- 20. SIMPLER BOTTOM BAND ---------------------------- */
.morelinks{list-style:none;display:flex;justify-content:center;flex-wrap:wrap;gap:14px 34px;margin:0}
.morelinks a{font-family:var(--font-display);font-weight:600;font-size:19px;color:var(--navy);text-decoration:none;border-bottom:2px solid transparent}
.morelinks a:hover{border-bottom-color:var(--yellow)}

/* ---- 21. SIGNATURE -------------------------------------- */
.signoff{width:150px;height:auto;display:block;margin:34px 0 0}


/* ---- 14. STACKED COINS BEHIND THE HERO PORTRAIT ---------
   Pure CSS, no SVG filters. The offset is the whole trick:
   the strips sit down and left of the photo so it lies on them.
   --------------------------------------------------------- */
.heroportrait .coinstack{position:relative;padding:0 17px 17px 0}
.coinstack .coins{
  position:absolute;inset:17px -17px -17px 17px;
  display:flex;flex-direction:column;line-height:0;overflow:hidden;
}
.coinstack .coins i{display:block;width:100%}
/* vintage wash and paper grain */
.coinstack .coins::before{
  content:"";position:absolute;inset:0;background:#FDF9F1;opacity:.14;pointer-events:none;
}
.coinstack .coins::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background-image:url(data:image/png;base64,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);background-repeat:repeat;background-size:40px 40px;opacity:.5;
}
.coinstack img{position:relative;z-index:1;display:block;width:100%}

@media (max-width:760px){
  .heroportrait .coinstack{padding:0 18px 18px 0}
  .coinstack .coins{inset:18px -18px -18px 18px}
}


/* ---- 15. DOWNLOAD GATE ---------------------------------- */
.gate{display:flex;flex-direction:column;gap:9px}
.gate .gaterow{display:flex;gap:9px;flex-wrap:wrap}
.gate .gaterow input{flex:1;min-width:150px}
.gate input{padding:13px 15px;border:1px solid var(--rule);background:var(--muslin);
  color:var(--navy);font-family:var(--font-body);font-size:15.5px;width:100%}
.gate input:focus{outline:none;border-color:var(--magenta)}
.gate button{margin-top:4px;align-self:flex-start;padding:14px 26px;background:var(--magenta);
  color:var(--muslin);border:2px solid var(--magenta);font-family:var(--font-body);
  font-weight:600;font-size:15px;cursor:pointer}
.gate button:hover{background:#B83D73;border-color:#B83D73}


/* ---- 16. SPEAKING PAGE ---------------------------------- */
.sechead{font-family:var(--font-display);font-weight:600;font-size:clamp(22px,2.7vw,28px);
  color:var(--navy);letter-spacing:-.02em;margin:0 0 4px}
.talks{border-top:0}
.talks li{border-bottom:0;padding:2px 0 2px 22px;border-left:4px solid var(--yellow);margin-bottom:26px}
.talks li:last-child{margin-bottom:0}

.quotewall{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:26px 30px;
  margin:0 0 46px;padding-bottom:30px;border-bottom:1px solid var(--rule)}
.quotewall blockquote{font-family:var(--font-display);font-weight:600;font-size:17px;line-height:1.45;
  color:var(--navy);margin:0}
.quotewall blockquote::before{content:"\201C";display:block;font-family:var(--font-display);
  font-weight:700;font-size:56px;line-height:.6;color:var(--yellow);margin-bottom:14px}
.quotewall .qsrc{grid-column:1/-1;font-weight:300;font-size:13.5px;color:var(--navy-soft);
  font-style:italic;margin:0}


/* ---- 17. CONTACT --------------------------------------- */
.contactblock{max-width:60ch}
.contactblock .ask{font-weight:300;font-size:19px;line-height:1.75;color:var(--navy-soft);margin:0 0 32px}
.contactblock .btn{margin-bottom:34px}
.contactblock .orgline{font-weight:300;font-size:15.5px;line-height:1.7;color:var(--navy-soft);
  margin:0;padding-top:26px;border-top:1px solid var(--rule)}
.contactblock .orgline a{color:var(--magenta);font-weight:600;text-decoration:none;
  border-bottom:1px solid rgba(206,75,132,.35)}
.contactblock .orgline a:hover{border-bottom-color:var(--magenta)}

/* ---- 18. ORGANIZATIONS PAGE ----------------------------- */
.lede{max-width:64ch;margin-bottom:46px;padding-bottom:34px;border-bottom:1px solid var(--rule)}
.lede p{font-weight:300;font-size:19px;line-height:1.75;color:var(--navy-soft);margin:0 0 18px}
.lede p:last-child{margin-bottom:0}
.talks p a{color:var(--magenta);font-weight:600;text-decoration:none;border-bottom:1px solid rgba(206,75,132,.35)}
.talks p a:hover{border-bottom-color:var(--magenta)}

/* ---- 19. WRITING PAGE ----------------------------------- */
.featured{border-left:4px solid var(--yellow);padding:4px 0 4px 24px}
.featured .fsrc{font-size:11.5px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;
  color:var(--teal);margin:0 0 12px}
.featured h2{font-size:clamp(23px,2.8vw,31px);line-height:1.18;margin:0 0 14px;max-width:26ch}
.featured .fdek{font-weight:300;font-size:17px;line-height:1.7;color:var(--navy-soft);margin:0;max-width:62ch}
.sechead-sub{font-weight:300;font-size:17px;line-height:1.7;color:var(--navy-soft);margin:10px 0 0;max-width:58ch}
.morelink{margin-top:26px;font-weight:300;font-size:15.5px;line-height:1.7;color:var(--navy-soft);max-width:62ch}