/* ===== ref.css — additive styles for the reference pages (v2, Sept 2026) ===== */

/* nav: mobile toggle */
.nav-toggle{display:none;background:none;border:1px solid rgba(184,145,84,0.4);color:var(--ivory);font-size:20px;padding:4px 12px;border-radius:4px;cursor:pointer}
@media(max-width:880px){
  .nav-toggle{display:block}
  .nav-links{display:none}
  .nav-links.open{display:flex;flex-direction:column;align-items:flex-start;gap:14px;padding-top:6px}
}
.foot-blurb{margin-top:18px;color:rgba(244,238,224,0.55);font-size:14px;line-height:1.7;max-width:300px}

/* article layout */
.article{padding:70px 32px}
.article .container-narrow{max-width:780px}
.article h2{font-size:clamp(28px,3.6vw,40px);margin:54px 0 16px;scroll-margin-top:90px}
.article h2:first-child{margin-top:0}
.article h3{font-size:24px;margin:34px 0 10px;color:var(--navy);scroll-margin-top:90px}
.article p{font-size:17.5px;line-height:1.85;color:var(--ink);margin-bottom:18px}
.article ul,.article ol{padding-left:24px;margin:0 0 20px}
.article li{font-size:17px;line-height:1.8;margin-bottom:8px;color:var(--ink)}
.article .lead{font-size:20px;line-height:1.7;color:var(--ink-soft)}
.article hr{border:0;border-top:1px solid var(--rule);margin:48px 0}
.article .de{font-style:italic;color:var(--brass-deep);font-family:'Cormorant Garamond',serif;font-size:1.05em}

/* sourced quotations */
.q{margin:28px 0;padding:6px 0 6px 26px;border-left:3px solid var(--brass)}
.q blockquote{font-family:'Cormorant Garamond',serif;font-style:italic;font-size:22px;line-height:1.55;color:var(--navy);margin:0}
.q blockquote strong{font-style:normal;color:var(--ember);font-weight:600}
.q .src{display:block;margin-top:12px;font-size:13px;color:var(--ink-faint);letter-spacing:0.04em;font-family:'Inter',sans-serif;font-style:normal}
.q .src a{color:var(--ink-faint);text-decoration:underline dotted}
.q.dark{border-left-color:var(--brass)}
.q.dark blockquote{color:var(--ivory)}
.q.dark .src{color:rgba(244,238,224,0.55)}

/* claim labels */
.tag{display:inline-block;font-family:'Inter',sans-serif;font-size:11px;font-weight:700;letter-spacing:0.12em;text-transform:uppercase;padding:4px 9px;border-radius:3px;vertical-align:middle;margin-left:8px}
.tag-solid{background:#1f5a3a;color:#eaf6ee}
.tag-thin{background:#8a6a3c;color:#fbf3e3}
.tag-no{background:var(--ember-deep);color:#fdeee8}
.tag-frankl{background:var(--navy);color:var(--ivory)}
.tag-ours{background:var(--rule);color:var(--navy)}

/* callouts */
.note{background:var(--ivory);border:1px solid var(--rule);border-left:4px solid var(--brass);border-radius:6px;padding:22px 26px;margin:28px 0}
.note p{margin-bottom:10px;font-size:16.5px}
.note p:last-child{margin-bottom:0}
.note h4{margin-bottom:10px}
.note.warn{border-left-color:var(--ember)}
.note.dark{background:var(--navy);border-color:rgba(184,145,84,0.3);color:var(--ivory)}
.note.dark p,.note.dark li{color:var(--ivory)}
.note.dark h4{color:var(--brass)}

/* tables */
.tbl{width:100%;border-collapse:collapse;margin:24px 0 32px;font-size:15.5px;line-height:1.55}
.tbl th{text-align:left;font-family:'Inter',sans-serif;font-size:12px;letter-spacing:0.1em;text-transform:uppercase;color:var(--brass-deep);padding:10px 12px;border-bottom:2px solid var(--brass);vertical-align:bottom}
.tbl td{padding:12px;border-bottom:1px solid var(--rule);vertical-align:top;color:var(--ink)}
.tbl td:first-child{font-weight:600;color:var(--navy)}
.tbl-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
@media(max-width:700px){.tbl{font-size:14px}.tbl th,.tbl td{padding:8px}}

/* table of contents */
.toc{background:var(--ivory-warm);border-radius:6px;padding:26px 30px;margin:0 0 40px}
.toc h4{margin-bottom:12px}
.toc ol{margin:0;padding-left:22px}
.toc li{margin-bottom:6px;font-size:16px}
.toc a{color:var(--navy)}
.toc a:hover{color:var(--ember)}

/* home: the three columns of the front door */
.doors{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;margin-top:44px}
@media(max-width:880px){.doors{grid-template-columns:1fr}}
.door{background:var(--ivory);border-top:3px solid var(--brass);border-radius:6px;padding:34px 30px;display:flex;flex-direction:column}
.door h3{font-size:24px;margin-bottom:12px}
.door p{font-size:15.5px;color:var(--ink-soft);line-height:1.7;flex:1}
.door a.more{font-weight:600;font-size:14px;letter-spacing:0.04em;text-transform:uppercase}

/* home: the "one page" statement */
.statement{background:var(--navy);color:var(--ivory);padding:80px 32px}
.statement .container-narrow{max-width:820px}
.statement h2{color:var(--ivory)}
.statement p{color:rgba(244,238,224,0.82);font-size:18px;line-height:1.8}
.statement .kicker{display:block;font-family:'Cormorant Garamond',serif;font-style:italic;color:var(--brass);font-size:18px;margin-bottom:12px}

/* definition rows */
.defs{display:grid;grid-template-columns:200px 1fr;gap:10px 28px;margin:24px 0 30px}
@media(max-width:700px){.defs{grid-template-columns:1fr;gap:4px 0}}
.defs dt{font-family:'Cormorant Garamond',serif;font-size:21px;font-weight:600;color:var(--navy)}
.defs dt small{display:block;font-style:italic;font-weight:500;color:var(--brass-deep);font-size:15px}
.defs dd{font-size:16.5px;line-height:1.75;color:var(--ink);margin:0 0 14px}

/* the number */
.big-number{font-family:'Cormorant Garamond',serif;font-size:64px;font-weight:600;color:var(--ember);line-height:1;margin:6px 0 4px}
.big-number small{font-size:18px;color:var(--ink-faint);font-weight:500;margin-left:8px;font-family:'Inter',sans-serif}

/* begin hub */
.hub{display:grid;grid-template-columns:1fr 1fr;gap:26px;margin-top:40px}
@media(max-width:880px){.hub{grid-template-columns:1fr}}
.hub .card{background:var(--ivory);border:1px solid var(--rule);border-radius:6px;padding:32px}
.hub .card h3{margin-bottom:8px}
.hub .card p{color:var(--ink-soft);font-size:15.5px}
.hub .card .meta{font-size:12px;letter-spacing:0.1em;text-transform:uppercase;color:var(--brass-deep);margin-bottom:12px;display:block}

/* small print under heroes */
.sub-hero .fine{margin-top:22px;font-size:14px;color:rgba(244,238,224,0.55);font-style:italic;font-family:'Cormorant Garamond',serif}

/* footnote-ish source list */
.sources{font-size:14.5px;line-height:1.7;color:var(--ink-soft);border-top:1px solid var(--rule);padding-top:22px;margin-top:40px}
.sources li{font-size:14.5px;margin-bottom:8px;color:var(--ink-soft)}
.sources h4{margin-bottom:12px}

/* print */
@media print{nav.site,footer.site,.cta-banner,.nav-toggle{display:none}body{background:#fff}.article p,.article li{font-size:12pt}}

/* footer: five columns */
footer.site .container{grid-template-columns:1.4fr 1fr 1fr 1fr 1.2fr}
@media(max-width:1000px){footer.site .container{grid-template-columns:1fr 1fr 1fr}}
@media(max-width:640px){footer.site .container{grid-template-columns:1fr 1fr}}
@media(max-width:640px){
  footer.site{padding:44px 20px 24px}
  footer.site .container{grid-template-columns:1fr;gap:26px}
  footer.site .foot-blurb{max-width:none}
  section{padding-left:20px;padding-right:20px}
  .article{padding:50px 20px}
  .hero{padding:70px 20px 80px}
  .sub-hero{padding:70px 20px 56px}
}
/* italics in reference prose are italics, not accent-coloured */
.article em,.tbl em,.sources em,.note em,.defs em,.toc em,.door em,.hub em,.statement em{color:inherit}
.article .q blockquote strong{color:var(--ember)}
