/* ============================================================
   Laboratories.org — comparison site styles
   Clean clinical aesthetic: cool whites, deep trustworthy teal
   ============================================================ */

:root, [data-theme="light"] {
  --bg: #f4f7f8;
  --surface: #ffffff;
  --surface-2: #fbfdfd;
  --surface-offset: #eef3f4;
  --border: #dce5e7;
  --border-strong: #c4d2d5;
  --text: #15282c;
  --text-muted: #5a6e72;
  --text-faint: #93a3a6;
  --primary: #0f5e67;
  --primary-hover: #0b474e;
  --primary-soft: #e3f0f1;
  --primary-softer: #f0f7f7;
  --accent: #1f9aa6;
  --gold: #c98a12;
  --gold-soft: #fbf2dd;
  --best: #1f8a52;
  --best-soft: #e4f4ea;
  --labreqs: #0f5e67;
  --shadow-sm: 0 1px 2px rgba(20,40,44,.06);
  --shadow-md: 0 6px 20px rgba(20,40,44,.08);
  --shadow-lg: 0 18px 44px rgba(20,40,44,.12);

  --font-body: 'Inter', system-ui, -apple-system, sans-serif;
  --font-display: 'Fraunces', Georgia, serif;

  --text-xs: clamp(0.75rem, 0.72rem + 0.15vw, 0.82rem);
  --text-sm: clamp(0.85rem, 0.82rem + 0.2vw, 0.95rem);
  --text-base: clamp(1rem, 0.97rem + 0.2vw, 1.06rem);
  --text-lg: clamp(1.15rem, 1.05rem + 0.5vw, 1.4rem);
  --text-xl: clamp(1.5rem, 1.2rem + 1.2vw, 2.1rem);
  --text-2xl: clamp(2.1rem, 1.4rem + 2.8vw, 3.4rem);

  --space-1:.25rem; --space-2:.5rem; --space-3:.75rem; --space-4:1rem;
  --space-5:1.25rem; --space-6:1.5rem; --space-8:2rem; --space-10:2.5rem;
  --space-12:3rem; --space-16:4rem; --space-20:5rem; --space-24:6rem;

  --radius-sm:.4rem; --radius-md:.65rem; --radius-lg:1rem; --radius-xl:1.4rem; --radius-full:9999px;
  --wrap: 1180px;
  --transition: 180ms cubic-bezier(.16,1,.3,1);
}

[data-theme="dark"] {
  --bg: #0e1718;
  --surface: #15211f;
  --surface-2: #18272a;
  --surface-offset: #122019;
  --border: #26393a;
  --border-strong: #335152;
  --text: #dde8e8;
  --text-muted: #92a6a6;
  --text-faint: #5e7374;
  --primary: #43b0bb;
  --primary-hover: #5cc3cd;
  --primary-soft: #18353a;
  --primary-softer: #122a2d;
  --accent: #4cc4d0;
  --gold: #e6b446;
  --gold-soft: #2e2716;
  --best: #4cc07e;
  --best-soft: #163326;
  --labreqs: #43b0bb;
  --shadow-sm: 0 1px 2px rgba(0,0,0,.3);
  --shadow-md: 0 6px 20px rgba(0,0,0,.4);
  --shadow-lg: 0 18px 44px rgba(0,0,0,.5);
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme]) {
    --bg:#0e1718;--surface:#15211f;--surface-2:#18272a;--surface-offset:#122019;
    --border:#26393a;--border-strong:#335152;--text:#dde8e8;--text-muted:#92a6a6;
    --text-faint:#5e7374;--primary:#43b0bb;--primary-hover:#5cc3cd;--primary-soft:#18353a;
    --primary-softer:#122a2d;--accent:#4cc4d0;--gold:#e6b446;--gold-soft:#2e2716;
    --best:#4cc07e;--best-soft:#163326;--labreqs:#43b0bb;
  }
}

/* ---- reset ---- */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;scroll-behavior:smooth;scroll-padding-top:5rem}
body{min-height:100dvh;font-family:var(--font-body);font-size:var(--text-base);line-height:1.6;color:var(--text);background:var(--bg)}
img,svg{display:block;max-width:100%}
button{cursor:pointer;background:none;border:none;font:inherit;color:inherit}
a{color:inherit;text-decoration:none}
table{border-collapse:collapse;width:100%}
h1,h2,h3{line-height:1.12;text-wrap:balance;font-family:var(--font-display);font-weight:600;letter-spacing:-.01em}
p{text-wrap:pretty}
:focus-visible{outline:2px solid var(--primary);outline-offset:2px;border-radius:var(--radius-sm)}
@media (prefers-reduced-motion: reduce){*{animation-duration:.01ms!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}

.wrap{width:100%;max-width:var(--wrap);margin-inline:auto;padding-inline:clamp(1rem,4vw,2.5rem)}
.eyebrow{display:inline-block;font-size:var(--text-xs);font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--primary);margin-bottom:var(--space-3)}
.skip-link{position:absolute;left:-999px;top:0;background:var(--primary);color:#fff;padding:.6rem 1rem;border-radius:0 0 var(--radius-md) 0;z-index:200}
.skip-link:focus{left:0}

/* ---- header ---- */
.site-header{position:sticky;top:0;z-index:100;background:color-mix(in srgb,var(--surface) 88%,transparent);backdrop-filter:blur(12px);border-bottom:1px solid var(--border)}
.header-inner{display:flex;align-items:center;gap:var(--space-6);height:4.2rem}
.brand{display:flex;align-items:center;gap:.6rem;color:var(--primary);font-weight:700}
.brand-mark{flex:none}
.brand-text{font-family:var(--font-body);font-size:1.18rem;font-weight:700;letter-spacing:-.02em;color:var(--text)}
.brand-dot{color:var(--primary)}
.header-nav{display:flex;gap:var(--space-6);margin-left:auto;font-size:var(--text-sm);font-weight:500}
.header-nav a{color:var(--text-muted);transition:color var(--transition)}
.header-nav a:hover{color:var(--primary)}
.header-actions{display:flex;align-items:center;gap:var(--space-3)}
.header-nav+.header-actions{margin-left:var(--space-4)}
.btn-edit{font-size:var(--text-sm);font-weight:600;color:var(--primary);border:1.5px solid var(--border-strong);padding:.42rem .85rem;border-radius:var(--radius-full);white-space:nowrap;transition:all var(--transition)}
.btn-edit:hover{border-color:var(--primary);background:var(--primary-soft)}
.btn-edit[aria-pressed="true"]{background:var(--primary);color:#fff;border-color:var(--primary)}
.theme-toggle{width:2.3rem;height:2.3rem;display:grid;place-items:center;border-radius:var(--radius-full);color:var(--text-muted);border:1.5px solid var(--border)}
.theme-toggle:hover{color:var(--primary);border-color:var(--border-strong)}

/* ---- hero ---- */
.hero{position:relative;padding-block:clamp(3rem,7vw,5.5rem) clamp(2.5rem,5vw,4rem);overflow:hidden;
  background:radial-gradient(120% 120% at 80% -10%,var(--primary-soft) 0%,transparent 55%),var(--bg)}
.hero-inner{max-width:880px}
.hero h1{font-size:var(--text-2xl);margin-bottom:var(--space-5)}
.hero-sub{font-size:var(--text-lg);color:var(--text-muted);max-width:46rem;line-height:1.5}
.hero-cats{display:flex;flex-wrap:wrap;gap:var(--space-3);margin-top:var(--space-8)}
.hero-cat{display:inline-flex;align-items:center;gap:.5rem;padding:.55rem .95rem;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-full);font-size:var(--text-sm);font-weight:600;box-shadow:var(--shadow-sm);transition:all var(--transition)}
.hero-cat:hover{transform:translateY(-2px);border-color:var(--primary);box-shadow:var(--shadow-md)}
.hc-icon{font-size:1.05rem}
.hero-meta{display:flex;flex-wrap:wrap;gap:var(--space-8);margin-top:var(--space-10);padding-top:var(--space-6);border-top:1px solid var(--border)}
.hero-meta div{display:flex;flex-direction:column}
.hero-meta strong{font-family:var(--font-display);font-size:var(--text-xl);color:var(--primary);line-height:1}
.hero-meta span{font-size:var(--text-xs);color:var(--text-muted);text-transform:uppercase;letter-spacing:.08em;margin-top:.35rem}

/* ---- trust strip ---- */
.trust-strip{background:var(--primary);color:#fff}
[data-theme="dark"] .trust-strip{background:var(--surface-2);border-block:1px solid var(--border)}
.trust-inner{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-6);padding-block:var(--space-6)}
.trust-item{display:flex;flex-direction:column;gap:.2rem}
.ti-num{font-weight:700;font-size:var(--text-base)}
.ti-lbl{font-size:var(--text-sm);opacity:.82}
[data-theme="dark"] .ti-num{color:var(--primary)}

/* ---- sections ---- */
.section{padding-block:clamp(3rem,6vw,5rem)}
.section-alt{background:var(--surface-offset)}
.section-head{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:var(--space-8);align-items:end;margin-bottom:var(--space-10)}
.section-head h2{font-size:var(--text-xl)}
.section-lede{color:var(--text-muted);font-size:var(--text-base)}

/* ---- controls ---- */
.controls{display:flex;flex-direction:column;gap:var(--space-5);margin-bottom:var(--space-6)}
.cat-tabs{display:flex;flex-wrap:wrap;gap:.5rem}
.cat-tab{display:inline-flex;align-items:center;gap:.45rem;padding:.55rem 1rem;border:1.5px solid var(--border);border-radius:var(--radius-full);font-size:var(--text-sm);font-weight:600;color:var(--text-muted);background:var(--surface);transition:all var(--transition)}
.cat-tab:hover{border-color:var(--border-strong);color:var(--text)}
.cat-tab[aria-selected="true"]{background:var(--primary);border-color:var(--primary);color:#fff}
.test-select-row{display:flex;align-items:center;gap:var(--space-3);flex-wrap:wrap}
.test-select-row label{font-size:var(--text-sm);font-weight:600;color:var(--text-muted)}
#testSelect{flex:1;min-width:240px;max-width:560px;padding:.6rem .9rem;border:1.5px solid var(--border-strong);border-radius:var(--radius-md);background:var(--surface);font-size:var(--text-sm);font-weight:500;color:var(--text)}
.sort-toggle{display:inline-flex;align-items:center;gap:.45rem;font-weight:500!important;color:var(--text-muted);cursor:pointer}
.sort-toggle input{accent-color:var(--primary);width:1rem;height:1rem}
.student-row{display:flex;align-items:center;gap:var(--space-4);flex-wrap:wrap;background:var(--primary-softer);border:1px solid var(--primary-soft);border-radius:var(--radius-md);padding:.65rem .85rem}
.student-toggle{display:inline-flex;align-items:center;gap:.5rem;font-size:var(--text-sm);font-weight:600;color:var(--primary);cursor:pointer}
.student-toggle input{accent-color:var(--primary);width:1.05rem;height:1.05rem}
.student-controls{display:inline-flex;align-items:center;gap:.5rem;font-size:var(--text-sm);color:var(--text-muted)}
.student-code{margin-right:.4rem}
.student-code strong{color:var(--primary);background:var(--surface);border:1px solid var(--primary-soft);border-radius:var(--radius-sm);padding:.1rem .45rem;letter-spacing:.03em}
.student-controls label{font-weight:600}
#studentPct{width:3.6rem;padding:.3rem .5rem;border:1.5px solid var(--border-strong);border-radius:var(--radius-sm);background:var(--surface);color:var(--text);font-weight:600;text-align:center}
.price-was{color:var(--text-faint);text-decoration:line-through;font-size:var(--text-sm);font-weight:500;margin-right:.25rem}

/* ---- edit banner ---- */
.edit-banner{display:flex;align-items:center;justify-content:space-between;gap:var(--space-4);flex-wrap:wrap;
  background:var(--gold-soft);border:1px solid color-mix(in srgb,var(--gold) 40%,transparent);
  border-radius:var(--radius-md);padding:var(--space-3) var(--space-4);margin-bottom:var(--space-5);font-size:var(--text-sm)}
.edit-banner-actions{display:flex;gap:.6rem}
.btn-primary{background:var(--primary);color:#fff;font-weight:600;font-size:var(--text-sm);padding:.5rem 1rem;border-radius:var(--radius-md);transition:background var(--transition)}
.btn-primary:hover{background:var(--primary-hover)}
.btn-secondary{color:var(--text-muted);font-weight:600;font-size:var(--text-sm);padding:.5rem .9rem;border:1.5px solid var(--border-strong);border-radius:var(--radius-md)}
.btn-secondary:hover{color:var(--text);border-color:var(--text-muted)}

/* ---- compare table ---- */
.table-scroll{overflow-x:auto;border:1px solid var(--border);border-radius:var(--radius-lg);background:var(--surface);box-shadow:var(--shadow-sm)}
.compare-table{min-width:760px;font-size:var(--text-sm)}
.compare-table thead th{position:sticky;top:0;background:var(--surface-offset);text-align:left;padding:var(--space-4);font-weight:700;font-size:var(--text-xs);text-transform:uppercase;letter-spacing:.07em;color:var(--text-muted);border-bottom:1px solid var(--border)}
.compare-table thead th:first-child{min-width:170px}
.compare-table tbody td{padding:var(--space-4);border-bottom:1px solid var(--border);vertical-align:top}
.compare-table tbody tr:last-child td{border-bottom:none}
.compare-table tbody tr{transition:background var(--transition)}
.compare-table tbody tr:hover{background:var(--surface-2)}
.row-labreqs{background:var(--primary-softer)}
.row-labreqs:hover{background:var(--primary-soft)!important}
.cell-portal{display:flex;flex-direction:column;gap:.35rem}
.portal-name{font-weight:700;font-size:var(--text-base);color:var(--text);display:flex;align-items:center;gap:.45rem}
.badge{display:inline-block;font-size:.66rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase;padding:.15rem .45rem;border-radius:var(--radius-full)}
.badge-labreqs{background:var(--primary);color:#fff}
.badge-best{background:var(--best-soft);color:var(--best);border:1px solid color-mix(in srgb,var(--best) 35%,transparent)}
.portal-net{font-size:var(--text-xs);color:var(--text-muted)}
.cell-price{font-family:var(--font-display);font-size:var(--text-lg);font-weight:600;color:var(--text);white-space:nowrap}
.cell-price.is-best{color:var(--best)}
.price-edit{font:inherit;color:inherit;width:7.5rem;padding:.3rem .5rem;border:1.5px dashed var(--primary);border-radius:var(--radius-sm);background:var(--surface-2)}
.cell-incl{color:var(--text-muted);max-width:34ch;line-height:1.45}
.test-sub{display:block;font-size:var(--text-xs);color:var(--text-faint);margin-top:.25rem}
.u18-note{display:block;font-size:var(--text-xs);font-weight:600;color:var(--primary);background:var(--primary-softer);border:1px solid var(--primary-soft);border-radius:var(--radius-sm);padding:.35rem .5rem;margin-top:.4rem;line-height:1.35}
.cell-turn{white-space:nowrap;color:var(--text-muted)}
.cell-link a{display:inline-flex;align-items:center;gap:.3rem;font-weight:600;color:var(--primary);font-size:var(--text-sm)}
.cell-link a:hover{color:var(--primary-hover);text-decoration:underline}
.na{color:var(--text-faint);font-style:italic;font-family:var(--font-body);font-size:var(--text-sm);font-weight:500}
.table-foot{margin-top:var(--space-4);font-size:var(--text-xs);color:var(--text-faint)}

/* ---- chart ---- */
.chart-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);padding:clamp(1.2rem,3vw,2rem);box-shadow:var(--shadow-sm)}
.chart-legend{display:flex;flex-wrap:wrap;gap:var(--space-5);margin-bottom:var(--space-6);font-size:var(--text-xs);color:var(--text-muted)}
.chart-legend span{display:inline-flex;align-items:center;gap:.4rem}
.lg-swatch{width:.85rem;height:.85rem;border-radius:.2rem;flex:none}
.chart{display:flex;flex-direction:column;gap:var(--space-3)}
.bar-row{display:grid;grid-template-columns:140px 1fr auto;align-items:center;gap:var(--space-3)}
.bar-label{font-size:var(--text-sm);font-weight:600;color:var(--text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bar-track{background:var(--surface-offset);border-radius:var(--radius-full);height:1.55rem;overflow:hidden}
.bar-fill{height:100%;border-radius:var(--radius-full);background:var(--accent);width:0;transition:width 700ms cubic-bezier(.16,1,.3,1)}
.bar-fill.is-best{background:var(--best)}
.bar-fill.is-labreqs{background:linear-gradient(90deg,var(--primary),var(--accent))}
.bar-val{font-family:var(--font-display);font-weight:600;font-size:var(--text-base);color:var(--text);min-width:4.5rem;text-align:right}
.bar-val.is-best{color:var(--best)}
.chart-empty{color:var(--text-faint);font-style:italic;padding:var(--space-6) 0}

/* ---- portal grid ---- */
.portal-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(255px,1fr));gap:var(--space-5)}
.portal-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);padding:var(--space-6);box-shadow:var(--shadow-sm);transition:transform var(--transition),box-shadow var(--transition);position:relative}
.portal-card:hover{transform:translateY(-3px);box-shadow:var(--shadow-md)}
.portal-card.is-labreqs{border-color:var(--primary);border-width:1.5px}
.pc-head{display:flex;align-items:center;justify-content:space-between;gap:.5rem;margin-bottom:var(--space-4)}
.pc-name{font-family:var(--font-display);font-size:var(--text-lg);font-weight:600}
.pc-rows{display:flex;flex-direction:column;gap:var(--space-3);margin-bottom:var(--space-5)}
.pc-row{display:flex;justify-content:space-between;gap:var(--space-4);font-size:var(--text-sm);border-bottom:1px dashed var(--border);padding-bottom:var(--space-3)}
.pc-row:last-child{border-bottom:none;padding-bottom:0}
.pc-row .k{color:var(--text-muted)}
.pc-row .v{font-weight:600;text-align:right}
.pc-fee{font-size:var(--text-xs);color:var(--gold);background:var(--gold-soft);border-radius:var(--radius-sm);padding:.5rem .65rem;margin-bottom:var(--space-4);line-height:1.4}
.pc-cta{display:inline-flex;align-items:center;gap:.4rem;font-weight:600;color:var(--primary);font-size:var(--text-sm)}
.pc-cta:hover{text-decoration:underline}

/* ---- guide ---- */
.guide-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:var(--space-5)}
.guide-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);padding:var(--space-6)}
.guide-card h3{font-size:var(--text-lg);margin-bottom:var(--space-3);color:var(--primary)}
.guide-card p{color:var(--text-muted);font-size:var(--text-sm);line-height:1.6;max-width:none}

/* ---- faq ---- */
.faq-list{display:grid;gap:var(--space-3);max-width:820px}
.faq-item{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);padding:var(--space-4) var(--space-5);transition:border-color .15s ease}
.faq-item[open]{border-color:var(--primary)}
.faq-item summary{cursor:pointer;font-weight:600;font-size:var(--text-base);color:var(--text);list-style:none;display:flex;justify-content:space-between;align-items:center;gap:var(--space-4)}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary::after{content:"+";font-weight:400;font-size:1.4em;line-height:1;color:var(--primary);transition:transform .15s ease}
.faq-item[open] summary::after{content:"\2212"}
.faq-item p{margin-top:var(--space-3);color:var(--text-muted);font-size:var(--text-sm);line-height:1.65;max-width:none}

/* ---- footer ---- */
.site-footer{background:var(--text);color:#cdd8d8}
[data-theme="dark"] .site-footer{background:#0a1011;border-top:1px solid var(--border)}
.footer-inner{display:grid;grid-template-columns:1.2fr 1fr;gap:var(--space-10);padding-block:var(--space-16)}
.footer-brand .brand-text{color:#fff;font-size:1.3rem}
.brand-mark-text{color:#fff}
.footer-brand p{color:#9fb0b0;font-size:var(--text-sm);margin-top:var(--space-4);max-width:42ch;line-height:1.6}
.footer-disclaimer p{color:#9fb0b0;font-size:var(--text-sm);line-height:1.6}
.footer-disclaimer strong{color:#dce7e7}
.footer-updated{margin-top:var(--space-4);font-size:var(--text-xs);color:#7f9292}

/* ---- responsive ---- */
@media (max-width:860px){
  .section-head{grid-template-columns:1fr;gap:var(--space-4)}
  .footer-inner{grid-template-columns:1fr;gap:var(--space-8)}
  .trust-inner{grid-template-columns:1fr;gap:var(--space-4)}
}
@media (max-width:680px){
  .header-nav{display:none}
  .bar-row{grid-template-columns:96px 1fr auto}
  .bar-label{font-size:var(--text-xs)}
}

/* ---- legal pages ---- */
.legal-main{max-width:820px;margin-inline:auto;padding-block:clamp(2.5rem,5vw,4rem)}
.legal-main h1{font-size:var(--text-2xl);margin-bottom:var(--space-3)}
.legal-updated{color:var(--text-faint);font-size:var(--text-sm);margin-bottom:var(--space-8)}
.legal-main h2{font-size:var(--text-lg);color:var(--primary);margin-top:var(--space-8);margin-bottom:var(--space-3)}
.legal-main p,.legal-main li{color:var(--text-muted);font-size:var(--text-base);line-height:1.7;margin-bottom:var(--space-3);max-width:none}
.legal-main ul{padding-left:1.4rem;margin-bottom:var(--space-3)}
.legal-main li{margin-bottom:var(--space-2)}
.legal-main a{color:var(--primary);text-decoration:underline}
.legal-intro{background:var(--surface);border:1px solid var(--border);border-left:3px solid var(--primary);border-radius:var(--radius-md);padding:var(--space-5);margin-bottom:var(--space-6)}
.legal-intro p{margin-bottom:0}
.footer-links{display:flex;gap:var(--space-4);flex-wrap:wrap;margin-top:var(--space-4);font-size:var(--text-sm)}
.footer-links a{color:#9fb0b0;text-decoration:none}
.footer-links a:hover{color:#fff;text-decoration:underline}
.back-link{display:inline-flex;align-items:center;gap:.35rem;color:var(--primary);font-weight:600;font-size:var(--text-sm);margin-bottom:var(--space-6);text-decoration:none}
.back-link:hover{text-decoration:underline}

/* ---- key takeaways (answer-first) ---- */
.section-takeaways{padding-block:clamp(2rem,4vw,3rem)}
.takeaways-card{background:var(--surface);border:1px solid var(--border);border-left:4px solid var(--primary);border-radius:var(--radius-lg);padding:clamp(1.5rem,3vw,2.5rem);box-shadow:var(--shadow-sm)}
.takeaways-title{font-size:var(--text-lg);color:var(--primary);margin-bottom:var(--space-4)}
.takeaways-lead{color:var(--text);font-size:var(--text-base);line-height:1.6;margin-bottom:var(--space-4);max-width:none}
.takeaways-list{list-style:none;display:grid;gap:var(--space-3);margin-bottom:var(--space-4)}
.takeaways-list li{position:relative;padding-left:1.6rem;color:var(--text-muted);font-size:var(--text-sm);line-height:1.6}
.takeaways-list li::before{content:"\2713";position:absolute;left:0;top:0;color:var(--best);font-weight:700}
.takeaways-list strong{color:var(--text)}
.takeaways-foot{font-size:var(--text-sm);color:var(--text-faint);line-height:1.6;border-top:1px solid var(--border);padding-top:var(--space-4);max-width:none}
.takeaways-foot a{color:var(--primary);font-weight:600;text-decoration:none;white-space:nowrap}
.takeaways-foot a:hover{text-decoration:underline}

/* ---- article / guide pages ---- */
.article-main{max-width:760px;margin-inline:auto;padding-block:clamp(2.5rem,5vw,4rem)}
.article-eyebrow{display:inline-block;font-size:var(--text-xs);font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--primary);margin-bottom:var(--space-3)}
.article-main h1{font-size:var(--text-2xl);line-height:1.1;margin-bottom:var(--space-4)}
.article-meta{color:var(--text-faint);font-size:var(--text-sm);margin-bottom:var(--space-8);padding-bottom:var(--space-6);border-bottom:1px solid var(--border)}
.article-lead{font-size:var(--text-lg);line-height:1.55;color:var(--text);margin-bottom:var(--space-8)}
.article-main h2{font-size:var(--text-xl);color:var(--text);margin-top:var(--space-12);margin-bottom:var(--space-4);scroll-margin-top:5rem}
.article-main h3{font-size:var(--text-lg);color:var(--primary);margin-top:var(--space-8);margin-bottom:var(--space-3)}
.article-main p,.article-main li{color:var(--text-muted);font-size:var(--text-base);line-height:1.7;margin-bottom:var(--space-4);max-width:none}
.article-main ul,.article-main ol{padding-left:1.4rem;margin-bottom:var(--space-4)}
.article-main li{margin-bottom:var(--space-2)}
.article-main strong{color:var(--text)}
.article-main a{color:var(--primary);text-decoration:underline}
.article-main table{width:100%;border-collapse:collapse;margin-bottom:var(--space-6);font-size:var(--text-sm)}
.article-main th{text-align:left;background:var(--surface-offset);padding:var(--space-3);font-weight:700;border-bottom:1px solid var(--border);color:var(--text)}
.article-main td{padding:var(--space-3);border-bottom:1px solid var(--border);color:var(--text-muted);vertical-align:top}
.article-toc{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-md);padding:var(--space-5);margin-bottom:var(--space-8)}
.article-toc h2{font-size:var(--text-sm);text-transform:uppercase;letter-spacing:.08em;color:var(--text-muted);margin:0 0 var(--space-3) 0}
.article-toc ul{list-style:none;padding:0;margin:0;columns:2;gap:var(--space-6)}
.article-toc li{margin-bottom:var(--space-2);font-size:var(--text-sm)}
.callout{background:var(--primary-softer);border:1px solid var(--primary-soft);border-left:3px solid var(--primary);border-radius:var(--radius-md);padding:var(--space-5);margin-bottom:var(--space-6)}
.callout p{margin-bottom:0}
.callout strong{color:var(--primary)}
.medical-disclaimer{background:var(--gold-soft);border:1px solid color-mix(in srgb,var(--gold) 40%,transparent);border-radius:var(--radius-md);padding:var(--space-4) var(--space-5);margin:var(--space-8) 0;font-size:var(--text-sm)}
.medical-disclaimer p{margin-bottom:0;color:var(--text-muted)}
.article-sources{margin-top:var(--space-12);padding-top:var(--space-6);border-top:1px solid var(--border)}
.article-sources h2{font-size:var(--text-lg);margin-top:0}
.article-sources ol{font-size:var(--text-sm)}
.article-sources li{color:var(--text-faint);margin-bottom:var(--space-2);word-break:break-word}
.article-cta{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);padding:var(--space-6);margin-top:var(--space-10);text-align:center}
.article-cta h3{margin-top:0;color:var(--text)}
.article-cta .btn-primary{display:inline-block;margin-top:var(--space-3);text-decoration:none}

/* ---- resources hub ---- */
.resource-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:var(--space-5);margin-top:var(--space-6)}
.resource-card{display:block;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);padding:var(--space-6);text-decoration:none;transition:transform var(--transition),box-shadow var(--transition),border-color var(--transition)}
.resource-card:hover{transform:translateY(-3px);box-shadow:var(--shadow-md);border-color:var(--primary)}
.resource-card .rc-icon{font-size:1.8rem;margin-bottom:var(--space-3)}
.resource-card h3{font-family:var(--font-display);font-size:var(--text-lg);color:var(--text);margin-bottom:var(--space-2)}
.resource-card p{color:var(--text-muted);font-size:var(--text-sm);line-height:1.55;margin:0}
.resource-card .rc-more{display:inline-block;margin-top:var(--space-3);color:var(--primary);font-weight:600;font-size:var(--text-sm)}

/* resource card: prevent link underline on card text */
.resource-card,.resource-card h3,.resource-card p{text-decoration:none}
.resource-card h3,.resource-card p{text-decoration:none !important}