/* ============================================================
   Premium clinical design system — v3
   Type: Newsreader (display) / Manrope (text)
   ============================================================ */
:root{
  --paper:#FBFBF9;
  --white:#FFFFFF;
  --ink:#141B26;
  --ink-2:#3E4C61;
  --ink-3:#6B7A8F;
  --prussian:#12395B;
  --azure:#0F5FA8;
  --verdigris:#177E74;
  --hairline:#E4E7EB;
  --hairline-2:#D3D9E0;
  --gold:#A8834B;
  --r:10px;
}
*{box-sizing:border-box;min-width:0;}
html{scroll-behavior:smooth;}
html,body{overflow-x:hidden;}
body{
  margin:0;background:var(--paper);color:var(--ink);
  font-family:'Manrope',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,'Helvetica Neue',Arial,sans-serif;
  font-size:16.5px;line-height:1.75;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
  font-feature-settings:'ss01';
}
h1,h2{
  font-family:'Newsreader',Georgia,'Times New Roman',serif;
  font-weight:500;line-height:1.08;margin:0;letter-spacing:-0.015em;color:var(--ink);
}
h3,h4{font-family:'Manrope',sans-serif;font-weight:700;line-height:1.3;margin:0;color:var(--ink);letter-spacing:-0.005em;}
a{color:var(--azure);}
img{max-width:100%;display:block;}
p{margin:0.9em 0;}
.wrap{max-width:1080px;margin:0 auto;padding:0 22px;}
@media(max-width:480px){.wrap{padding:0 18px;}}

.kicker{
  font-size:11.5px;font-weight:800;letter-spacing:0.22em;text-transform:uppercase;
  color:var(--verdigris);display:flex;align-items:center;gap:10px;
}
.kicker::before{content:"";width:26px;height:1px;background:var(--verdigris);}
.eyebrow{font-size:11.5px;font-weight:800;letter-spacing:0.22em;text-transform:uppercase;color:var(--verdigris);}

/* ---------- top utility bar ---------- */
.util-bar{background:var(--prussian);color:rgba(255,255,255,0.85);font-size:12.5px;}
.util-bar .wrap{display:flex;justify-content:space-between;align-items:center;padding-top:8px;padding-bottom:8px;gap:12px;}
.util-bar a{color:#fff;text-decoration:none;font-weight:600;}
.util-bar .u-right{white-space:nowrap;}
@media(max-width:640px){.util-bar .u-left{display:none;}.util-bar .wrap{justify-content:center;}}

/* ---------- nav ---------- */
nav.site-nav{position:sticky;top:0;z-index:50;background:rgba(251,251,249,0.92);backdrop-filter:blur(10px);border-bottom:1px solid var(--hairline);}
.nav-row{display:flex;align-items:center;justify-content:space-between;padding:16px 0;gap:16px;}
.logo{font-family:'Newsreader',Georgia,serif;font-size:22px;font-weight:600;color:var(--ink);text-decoration:none;flex-shrink:0;letter-spacing:-0.01em;}
.logo span{color:var(--verdigris);font-style:italic;}
.nav-links{display:flex;gap:26px;font-size:14px;}
.nav-links a{text-decoration:none;color:var(--ink-2);font-weight:600;position:relative;padding:4px 0;}
.nav-links a::after{content:"";position:absolute;left:0;bottom:0;width:0;height:1.5px;background:var(--ink);transition:width .2s ease;}
.nav-links a:hover{color:var(--ink);}
.nav-links a:hover::after{width:100%;}
.nav-mobile-hide{display:flex;}
@media(max-width:920px){.nav-mobile-hide{display:none;}}
.nav-cta{
  background:var(--ink);color:var(--paper);padding:11px 22px;font-size:13px;font-weight:700;
  letter-spacing:0.02em;text-decoration:none;border-radius:6px;white-space:nowrap;transition:background .18s;
}
.nav-cta:hover{background:var(--prussian);}

/* ---------- breadcrumb ---------- */
.breadcrumb{padding:18px 0 0;font-size:12px;color:var(--ink-3);letter-spacing:0.02em;}
.breadcrumb a{text-decoration:none;color:var(--ink-3);}
.breadcrumb a:hover{color:var(--ink);}
.breadcrumb .sep{margin:0 8px;opacity:0.4;}

/* ---------- page head ---------- */
.page-head{padding:38px 0 58px;position:relative;}
.page-head::after{
  content:"";position:absolute;left:0;right:0;bottom:0;height:1px;
  background:linear-gradient(90deg,var(--hairline-2) 0%,transparent 100%);
}
.page-head h1{font-size:clamp(30px,5.2vw,54px);max-width:21ch;}
.answer-lead{
  margin-top:26px;font-size:clamp(16px,2.2vw,18.5px);line-height:1.78;color:var(--ink-2);max-width:62ch;
}
.answer-lead strong{font-weight:700;color:var(--ink);}
.note-flag{
  display:inline-block;font-size:10px;letter-spacing:0.08em;text-transform:uppercase;font-weight:800;
  color:var(--gold);border:1px solid #DCC9A6;background:#FBF6ED;border-radius:4px;padding:2px 8px;margin-left:8px;vertical-align:middle;
}
.cta-row{display:flex;gap:14px;flex-wrap:wrap;margin-top:30px;align-items:center;}
.btn{
  display:inline-flex;align-items:center;gap:10px;padding:15px 30px;font-size:14px;font-weight:700;
  letter-spacing:0.01em;text-decoration:none;border-radius:6px;transition:all .18s;
}
.btn-primary{background:var(--ink);color:var(--paper);}
.btn-primary:hover{background:var(--prussian);}
.btn-secondary{color:var(--ink);border-bottom:1.5px solid var(--ink);border-radius:0;padding:6px 2px;font-size:14px;}
.btn-secondary:hover{color:var(--azure);border-color:var(--azure);}
.freshness{font-size:12px;color:var(--ink-3);margin-top:22px;letter-spacing:0.03em;}

/* ---------- fact strip ---------- */
.fact-row{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));
  border-top:1px solid var(--hairline-2);border-bottom:1px solid var(--hairline-2);
  margin-top:30px;
}
.fact-badge{
  padding:16px 18px 16px 0;font-size:13.5px;font-weight:600;color:var(--ink-2);
  border-right:1px solid var(--hairline);background:none;line-height:1.5;
}
.fact-badge:last-child{border-right:none;}
.fact-badge b{display:block;font-family:'Newsreader',Georgia,serif;font-size:19px;font-weight:600;color:var(--ink);font-style:italic;margin-bottom:2px;}
@media(max-width:640px){.fact-badge{border-right:none;border-bottom:1px solid var(--hairline);padding:12px 0;}
.fact-badge:last-child{border-bottom:none;}}

/* ---------- content image ---------- */
.content-img{width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:var(--r);margin:12px 0 8px;background:#EEF1F0;}

/* ---------- sections ---------- */
main{counter-reset:sec;}
section.block{padding:58px 0;}
section.block + section.block{border-top:1px solid var(--hairline);}
.block h2{font-size:clamp(24px,3.4vw,34px);position:relative;padding-left:0;max-width:26ch;}
.block h2::before{
  counter-increment:sec;content:counter(sec,decimal-leading-zero);
  display:block;font-family:'Manrope',sans-serif;font-size:11px;font-weight:800;
  letter-spacing:0.22em;color:var(--gold);margin-bottom:10px;
}
.block h3{font-size:17.5px;margin-top:28px;margin-bottom:8px;}
.block p{color:var(--ink-2);font-size:15.5px;max-width:66ch;}
.block ul,.block ol{color:var(--ink-2);font-size:15.5px;max-width:66ch;padding-left:20px;}
.block li{margin-bottom:8px;}

/* ---------- tables ---------- */
.table-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch;margin-top:20px;}
.cmp-table{width:100%;min-width:480px;border-collapse:collapse;font-size:14.5px;}
.cmp-table th,.cmp-table td{padding:15px 18px 15px 0;text-align:left;vertical-align:top;border-bottom:1px solid var(--hairline);}
.cmp-table th{
  font-family:'Manrope',sans-serif;font-size:11px;letter-spacing:0.16em;text-transform:uppercase;
  color:var(--ink-3);font-weight:800;border-bottom:1.5px solid var(--ink);
}
.cmp-table td{color:var(--ink-2);}
.cmp-table td:first-child{font-weight:700;color:var(--ink);}
.cmp-table tr:last-child td{border-bottom:none;}

/* ---------- check list ---------- */
.check-list{list-style:none;padding:0;margin:18px 0 0;max-width:66ch;}
.check-list li{padding:13px 0 13px 30px;border-bottom:1px solid var(--hairline);font-size:15px;color:var(--ink-2);position:relative;}
.check-list li:last-child{border-bottom:none;}
.check-list li::before{
  content:"—";position:absolute;left:0;top:13px;color:var(--gold);font-weight:700;
}

/* ---------- FAQ ---------- */
.faq-item{border-bottom:1px solid var(--hairline);padding:24px 0;}
.faq-item:first-of-type{border-top:1.5px solid var(--ink);}
.faq-item h3{font-size:16.5px;font-weight:700;margin:0 0 10px;color:var(--ink);}
.faq-item h3::before{content:"Q. ";font-family:'Newsreader',Georgia,serif;font-style:italic;color:var(--gold);font-weight:600;}
.faq-item p{margin:0;color:var(--ink-2);font-size:14.5px;max-width:64ch;}

/* ---------- related ---------- */
.related-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:1px;background:var(--hairline);border:1px solid var(--hairline);margin-top:20px;}
.related-card{background:var(--paper);padding:26px 24px;text-decoration:none;display:block;transition:background .18s;}
.related-card .eyebrow{margin-bottom:10px;font-size:10.5px;color:var(--ink-3);}
.related-card h3{font-family:'Newsreader',Georgia,serif;font-size:18px;font-weight:500;color:var(--ink);margin:0;line-height:1.3;}
.related-card:hover{background:var(--white);}
.related-card:hover h3{color:var(--azure);}

/* ---------- CTA band ---------- */
.cta-band{background:var(--prussian);color:#fff;}
.cta-band .eyebrow{color:#8FC7BF;}
.cta-band h2{color:#fff;}
.cta-band h2::before{color:#8FC7BF;}
.cta-band p{color:rgba(255,255,255,0.72);max-width:56ch;}
.cta-band .btn-primary{background:var(--paper);color:var(--ink);}
.cta-band .btn-primary:hover{background:#fff;}
.cta-band .btn{border-color:rgba(255,255,255,0.5);color:#fff;}

/* ---------- footer ---------- */
footer{padding:56px 0 34px;border-top:1px solid var(--hairline-2);background:var(--white);}
.foot-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr 1fr;gap:32px;}
@media(max-width:920px){.foot-grid{grid-template-columns:1fr 1fr;}}
@media(max-width:520px){.foot-grid{grid-template-columns:1fr;}}
.foot-col h4{font-size:10.5px;letter-spacing:0.2em;text-transform:uppercase;color:var(--ink-3);margin-bottom:16px;font-weight:800;}
.foot-col a{display:block;font-size:13.5px;text-decoration:none;color:var(--ink-2);margin-bottom:10px;}
.foot-col a:hover{color:var(--ink);}
.foot-note{font-size:12px;color:var(--ink-3);margin-top:36px;border-top:1px solid var(--hairline);padding-top:22px;line-height:1.8;max-width:none;}
