/* ==========================================================
   Healthcare Pulse — design system
   Brand: navy ink, teal→blue gradient, amber accent.
   ========================================================== */

:root {
  --bg: #FAFDFD;
  --navy: #1B3A4B;
  --ink: #173441;
  --body-c: #37505B;
  --muted: #6E828C;
  --teal: #0FA3A3;
  --blue: #2E7CB8;
  --green: #37B68A;
  --amber: #E08A3C;
  --amberdk: #B96A14;
  --line: #E2EDED;
  --tintT: #E7F5F4;
  --grad: linear-gradient(135deg, #0FA3A3 0%, #2E7CB8 100%);
  --radius: 16px;
  --mono: 'IBM Plex Mono', monospace;
  --sans: 'Manrope', 'Segoe UI', system-ui, sans-serif;
  --shadow: 0 14px 34px rgba(27, 58, 75, .12);
}

* { box-sizing: border-box; margin: 0; padding: 0; }

html { scroll-behavior: smooth; }

body {
  background: var(--bg);
  color: var(--body-c);
  font-family: var(--sans);
  font-size: 17.5px;
  line-height: 1.7;
  -webkit-font-smoothing: antialiased;
}

a { color: var(--blue); }

/* ---------- progress bar ---------- */
#prog {
  position: fixed; top: 0; left: 0;
  height: 4px; width: 0;
  background: var(--grad);
  z-index: 99;
}

/* ---------- utility bar ---------- */
.util { background: var(--navy); color: #CFE6E6; font-size: 12.5px; letter-spacing: .5px; }

.util-in {
  max-width: 1240px; margin: 0 auto;
  padding: 8px 24px;
  display: flex; justify-content: space-between; align-items: center;
}

.util b { color: #fff; letter-spacing: 2.5px; font-family: var(--mono); font-weight: 600; }

.util a { color: #9FDEDD; font-weight: 700; text-decoration: none; }

.util a:hover { color: #fff; }

/* ---------- masthead ---------- */
.site-header {
  display: flex; justify-content: space-between; align-items: center; gap: 16px;
  padding: 16px clamp(20px, 4vw, 48px);
  background: #fff;
  border-bottom: 1px solid var(--line);
  position: sticky; top: 0; z-index: 10;
}

.logo { display: flex; align-items: center; gap: 13px; text-decoration: none; }

.avatar {
  width: 50px; height: 50px; flex: none;
  border-radius: 50%;
  background: var(--grad);
  color: #fff;
  font-weight: 800; font-size: 17px; letter-spacing: .5px;
  display: flex; align-items: center; justify-content: center;
}

.avatar-sm { width: 44px; height: 44px; font-size: 15px; border-radius: 12px; }

.logo-name {
  display: block;
  font-weight: 800; font-size: 22px;
  color: var(--navy); letter-spacing: -.4px; line-height: 1.1;
}

.logo-tag { display: block; font-size: 12.5px; color: var(--muted); }

.site-header nav { display: flex; gap: 20px; align-items: center; }

.site-header nav a { text-decoration: none; font-weight: 700; font-size: 15px; color: var(--ink); }

.site-header nav a:hover { color: var(--teal); }

.nav-subscribe {
  background: var(--grad);
  color: #fff !important;
  padding: 9px 20px;
  border-radius: 999px;
  box-shadow: 0 4px 12px rgba(15, 163, 163, .35);
}

.nav-subscribe:hover { filter: brightness(1.08); }

/* ---------- hero ---------- */
.hero {
  padding: clamp(54px, 8vw, 96px) clamp(20px, 4vw, 48px) clamp(34px, 5vw, 56px);
  max-width: 1240px; margin: 0 auto;
}

.eyebrow {
  display: inline-block;
  font-family: var(--mono);
  font-size: 11.5px; font-weight: 600;
  letter-spacing: 2px;
  color: var(--teal);
  background: var(--tintT);
  padding: 6px 14px;
  border-radius: 20px;
  margin-bottom: 20px;
}

.hero-title {
  font-weight: 800;
  font-size: clamp(44px, 7.5vw, 86px);
  line-height: 1.02;
  letter-spacing: -0.025em;
  color: var(--navy);
  max-width: 16ch;
}

.hi-grad {
  background: var(--grad);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

.hero-ecg { width: min(560px, 100%); height: 64px; margin: 18px 0 4px; display: block; }

.ecg-path {
  stroke: url(#g) var(--teal);
  stroke: var(--teal);
  stroke-dasharray: 1400;
  stroke-dashoffset: 1400;
  animation: trace 2.6s ease-out forwards .3s;
}

@keyframes trace { to { stroke-dashoffset: 0; } }

.hero-sub {
  margin-top: 16px;
  font-size: clamp(17px, 2vw, 21px);
  color: var(--ink);
  max-width: 56ch;
  line-height: 1.5;
}

.hero-actions { display: flex; gap: 14px; align-items: center; margin-top: 28px; flex-wrap: wrap; }

.hero-cta {
  display: inline-block;
  font-weight: 800; font-size: 17px;
  text-decoration: none;
  background: var(--grad);
  color: #fff;
  padding: 14px 30px;
  border-radius: 999px;
  box-shadow: 0 8px 22px rgba(15, 163, 163, .38);
  transition: transform .15s ease, box-shadow .15s ease;
}

.hero-cta:hover { transform: translateY(-2px); box-shadow: 0 12px 28px rgba(15, 163, 163, .45); }

.hero-ghost {
  font-weight: 700; font-size: 16px;
  text-decoration: none;
  color: var(--navy);
  border: 2px solid var(--line);
  padding: 12px 24px;
  border-radius: 999px;
}

.hero-ghost:hover { border-color: var(--teal); color: var(--teal); }

/* ---------- post grid ---------- */
.post-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
  gap: 26px;
  padding: 8px clamp(20px, 4vw, 48px) 80px;
  max-width: 1280px; margin: 0 auto;
}

.card {
  text-decoration: none;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  overflow: hidden;
  display: flex; flex-direction: column;
  box-shadow: 0 4px 14px rgba(27, 58, 75, .07);
  transition: transform .2s ease, box-shadow .2s ease;
}

.card:hover { transform: translateY(-6px); box-shadow: var(--shadow); }

.reveal { opacity: 0; transform: translateY(22px); transition: opacity .55s ease, transform .55s ease; }

.reveal.in { opacity: 1; transform: none; }

.card-banner { height: 116px; position: relative; overflow: hidden; }

.card-banner svg, .banner-ecg { width: 100%; height: 100%; display: block; }

.card-ed {
  position: absolute; top: 12px; right: 12px;
  font-family: var(--mono); font-size: 11px; font-weight: 600; letter-spacing: 1.5px;
  background: rgba(255, 255, 255, .92);
  color: var(--navy);
  padding: 4px 10px;
  border-radius: 999px;
}

/* category colors */
.cat-digital-health .card-banner, .post-banner.cat-digital-health { background: var(--grad); }
.cat-pharma .card-banner,         .post-banner.cat-pharma         { background: linear-gradient(135deg, #2E7CB8, #1B3A4B); }
.cat-biotech .card-banner,        .post-banner.cat-biotech        { background: linear-gradient(135deg, #37B68A, #0FA3A3); }
.cat-policy .card-banner,         .post-banner.cat-policy         { background: linear-gradient(135deg, #E08A3C, #B96A14); }
.cat-general .card-banner,        .post-banner.cat-general        { background: linear-gradient(135deg, #1B3A4B, #2E7CB8); }
.cat-strategy .card-banner,       .post-banner.cat-strategy       { background: linear-gradient(135deg, #6C4AB6, #3A2E7C); }

.cat-digital-health .card-meta { color: var(--teal); }
.cat-pharma .card-meta         { color: var(--blue); }
.cat-biotech .card-meta        { color: var(--green); }
.cat-policy .card-meta         { color: var(--amberdk); }
.cat-general .card-meta        { color: var(--navy); }
.cat-strategy .card-meta       { color: #6C4AB6; }

.card-body { padding: 20px 22px 24px; display: flex; flex-direction: column; flex: 1; }

.card-meta {
  font-family: var(--mono);
  font-size: 12px; font-weight: 600; letter-spacing: .8px;
  text-transform: uppercase;
  margin-bottom: 10px;
}

.card-body h2 {
  font-weight: 800; font-size: 21.5px; line-height: 1.2;
  color: var(--navy);
  margin-bottom: 10px;
}

.card-excerpt { font-size: 15px; color: var(--body-c); }

.card-read {
  margin-top: auto; padding-top: 16px;
  font-weight: 800; font-size: 14.5px;
  color: var(--teal);
}

.card:hover .card-read { color: var(--blue); }

/* ---------- single post ---------- */
.post { max-width: 780px; margin: 0 auto; padding: 40px 20px 70px; }

.post-banner {
  height: clamp(140px, 24vw, 220px);
  border-radius: var(--radius);
  overflow: hidden;
  box-shadow: var(--shadow);
}

.post-meta {
  display: flex; flex-wrap: wrap; gap: 8px 20px; align-items: center;
  font-family: var(--mono);
  font-size: 12.5px; font-weight: 600; letter-spacing: 1px;
  color: var(--muted);
  margin: 26px 0 14px;
}

.meta-ed { color: var(--teal); }

.meta-cat {
  background: var(--navy);
  color: #fff;
  padding: 3px 13px;
  border-radius: 999px;
}

.post-title {
  font-weight: 800;
  font-size: clamp(32px, 5.5vw, 54px);
  line-height: 1.06; letter-spacing: -0.02em;
  color: var(--navy);
  margin-bottom: 28px;
}

.post-body h2 {
  font-weight: 800; font-size: 27px; color: var(--navy);
  margin: 38px 0 14px;
}

.post-body h3 { font-weight: 700; font-size: 21px; color: var(--navy); margin: 30px 0 10px; }

.post-body p { margin-bottom: 18px; }

.post-body ul, .post-body ol { margin: 0 0 18px 24px; }

.post-body li { margin-bottom: 8px; }

.post-body blockquote {
  border-left: 5px solid var(--amber);
  background: #FBF0E1;
  color: var(--ink);
  padding: 16px 22px;
  border-radius: 0 12px 12px 0;
  margin: 24px 0;
  font-weight: 600;
}

.post-body img { max-width: 100%; border-radius: 12px; box-shadow: var(--shadow); }

.post-body strong { color: var(--navy); }

/* ---------- author box ---------- */
.author-box {
  display: flex; gap: 16px; align-items: flex-start;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 22px;
  margin-top: 46px;
  box-shadow: 0 4px 14px rgba(27, 58, 75, .06);
}

.author-name { font-weight: 800; color: var(--navy); font-size: 17px; }

.author-name span { font-weight: 500; color: var(--muted); font-size: 13px; }

.author-bio { font-size: 13.5px; color: var(--muted); line-height: 1.55; margin: 4px 0 8px; }

.author-box a { font-weight: 800; font-size: 14.5px; text-decoration: none; color: var(--teal); }

.back-link {
  display: inline-block; margin-top: 34px;
  font-family: var(--mono); font-size: 14px;
  text-decoration: none; color: var(--navy);
  border-bottom: 2px solid var(--teal);
  padding-bottom: 2px;
}

/* ---------- subscribe ---------- */
.subscribe { background: var(--navy); color: #E8F4F4; padding: clamp(50px, 8vw, 90px) clamp(20px, 4vw, 48px); }

.subscribe-inner { max-width: 660px; margin: 0 auto; text-align: center; }

.subscribe .eyebrow { background: rgba(255, 255, 255, .08); color: #FFC987; }

.subscribe h2 {
  font-weight: 800;
  font-size: clamp(28px, 4.5vw, 42px);
  line-height: 1.12;
  color: #fff;
}

.subscribe-sub { margin-top: 14px; color: #B9D2D6; }

.subscribe-actions { display: flex; gap: 14px; justify-content: center; flex-wrap: wrap; margin-top: 28px; }

.btn-li {
  display: inline-flex; align-items: center; gap: 9px;
  background: var(--grad);
  color: #fff;
  font-weight: 800; font-size: 16px;
  text-decoration: none;
  padding: 14px 26px;
  border-radius: 999px;
  box-shadow: 0 8px 22px rgba(15, 163, 163, .4);
  transition: transform .15s ease;
}

.btn-li:hover { transform: translateY(-2px); }

.btn-ghost {
  display: inline-flex; align-items: center;
  color: #fff; font-weight: 700; font-size: 15px;
  text-decoration: none;
  border: 2px solid rgba(255, 255, 255, .25);
  padding: 12px 22px;
  border-radius: 999px;
}

.btn-ghost:hover { border-color: var(--teal); color: #9FDEDD; }

.subscribe-form { margin-top: 22px; display: flex; gap: 10px; justify-content: center; flex-wrap: wrap; }

.subscribe-form input {
  font-family: var(--sans); font-size: 16px;
  padding: 13px 18px;
  border-radius: 999px; border: none;
  width: min(320px, 100%);
}

.subscribe-form button {
  font-family: var(--sans); font-weight: 800; font-size: 16px;
  padding: 13px 26px;
  border-radius: 999px; border: none;
  background: var(--amber); color: #fff;
  cursor: pointer;
}

.rss-line { margin-top: 20px; font-size: 14px; color: #B9D2D6; }

.rss-line a { color: #9FDEDD; }

/* ---------- footer ---------- */
.site-footer {
  padding: 24px clamp(20px, 4vw, 48px);
  font-family: var(--mono);
  font-size: 12.5px;
  color: var(--muted);
  border-top: 1px solid var(--line);
  text-align: center;
}

/* ---------- about page ---------- */
.page { max-width: 720px; margin: 0 auto; padding: 60px 20px 80px; }

.page h1 {
  font-weight: 800;
  font-size: clamp(34px, 6vw, 56px);
  color: var(--navy);
  letter-spacing: -.02em;
  margin-bottom: 24px;
}

.page p { margin-bottom: 18px; }

/* ---------- focus & motion ---------- */
a:focus-visible, button:focus-visible, input:focus-visible {
  outline: 3px solid var(--amber);
  outline-offset: 2px;
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  * { transition: none !important; animation: none !important; }
  .ecg-path { stroke-dashoffset: 0; }
  .reveal { opacity: 1; transform: none; }
}

/* ---------- mobile ---------- */
@media (max-width: 600px) {
  .site-header { flex-direction: column; gap: 12px; }
  .post-grid { grid-template-columns: 1fr; }
  .util-in { flex-direction: column; gap: 4px; }
}

/* logo image */
.logo-img{width:48px;height:48px;object-fit:contain;border-radius:10px;}
/* hp-blocks (used inside posts) */
.hp-block{background:#fff;border:1px solid #E2EDED;border-radius:16px;padding:28px 26px;margin:32px 0;box-shadow:0 4px 14px rgba(27,58,75,.06)}
.hp-eyebrow{font-family:'IBM Plex Mono',monospace;font-size:11.5px;font-weight:600;letter-spacing:2px;color:#E08A3C;text-transform:uppercase;margin-bottom:8px}
.hp-h2{font-size:26px;font-weight:800;color:#1B3A4B;margin-bottom:8px;line-height:1.15}
.hp-sub{color:#37505B;margin-bottom:20px;font-size:15.5px}
.hp-stats{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:16px;margin-top:20px}
.hp-stat{background:#FAFDFD;border:1px solid #E2EDED;border-radius:12px;padding:18px 16px}
.hp-num{display:block;font-size:32px;font-weight:800;line-height:1.1;margin-bottom:8px}
.hp-num.up{color:#0FA3A3}.hp-num.down{color:#C0392B}.hp-num.warn{color:#E08A3C}.hp-num.flat{color:#2E7CB8}
.hp-stat p{font-size:14px;color:#37505B;line-height:1.5}
.hp-three{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:16px;margin-top:20px}
.hp-col{border-radius:12px;padding:20px 18px}.hp-col ul{margin:10px 0 0 16px}.hp-col li{font-size:14px;margin-bottom:8px;color:#37505B}
.hp-gain{background:#E7F5F4;border-top:4px solid #0FA3A3}.hp-stall{background:#FBF0E1;border-top:4px solid #E08A3C}.hp-rev{background:#FDECEA;border-top:4px solid #C0392B}
.hp-col-head{font-weight:800;font-size:17px;color:#1B3A4B}.hp-col-sub{font-family:'IBM Plex Mono',monospace;font-size:11px;letter-spacing:1.5px;color:#6E828C;margin:4px 0 12px}
.hp-swot{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:20px}
.hp-swot-cell{border-radius:12px;padding:18px 16px}.hp-swot-cell ul{margin:10px 0 0 16px}.hp-swot-cell li{font-size:14px;margin-bottom:8px;color:#37505B}
.hp-swot-label{font-weight:800;font-size:16px;margin-bottom:4px}
.hp-s{background:#E7F5F4}.hp-s .hp-swot-label{color:#0FA3A3}.hp-w{background:#FDECEA}.hp-w .hp-swot-label{color:#C0392B}
.hp-o{background:#EEF2FF}.hp-o .hp-swot-label{color:#2E7CB8}.hp-t{background:#FBF0E1}.hp-t .hp-swot-label{color:#E08A3C}
.hp-balance{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:20px}
.hp-pros{background:#E7F5F4;border-radius:12px;padding:20px 18px}.hp-cons{background:#FDECEA;border-radius:12px;padding:20px 18px}
.hp-pros ul,.hp-cons ul{margin:10px 0 0 0;list-style:none}
.hp-pros li,.hp-cons li{font-size:14px;margin-bottom:10px;color:#37505B;padding-left:20px;position:relative}
.hp-pros li::before{content:"+";position:absolute;left:0;color:#0FA3A3;font-weight:800}
.hp-cons li::before{content:"–";position:absolute;left:0;color:#C0392B;font-weight:800}
.hp-pros-head{font-weight:800;font-size:17px;color:#0FA3A3}.hp-cons-head{font-weight:800;font-size:17px;color:#C0392B}
@media(max-width:560px){.hp-swot,.hp-balance{grid-template-columns:1fr}}

/* ── header thinning patch ── */
.site-header {
  padding: 10px clamp(16px, 3vw, 40px) !important;
}
.logo-img {
  width: 38px !important;
  height: 38px !important;
  border-radius: 8px !important;
}
.logo-name {
  font-size: 18px !important;
}
.logo-tag {
  font-size: 11.5px !important;
}
.logo {
  gap: 10px !important;
}
.util {
  font-size: 11.5px !important;
}
.util-in {
  padding: 5px 24px !important;
}

/* ── header compact v2 ── */
.site-header {
  padding: 8px clamp(16px, 3vw, 40px) !important;
  min-height: unset !important;
}
.logo {
  gap: 8px !important;
  align-items: center !important;
}
.logo-img {
  width: 32px !important;
  height: 32px !important;
  border-radius: 6px !important;
  flex: none !important;
  object-fit: contain !important;
}
.logo-name { font-size: 16px !important; }
.logo-tag  { font-size: 11px !important; }
.util-in   { padding: 4px 24px !important; }
.util      { font-size: 11px !important; }
.site-header nav a { font-size: 14px !important; }
.nav-subscribe { padding: 7px 16px !important; font-size: 14px !important; }


/* ── wider layout ── */
.hero, .post-grid { max-width: 1340px; }

/* ── hero split with profile card ── */
.hero-split {
  display: grid;
  grid-template-columns: 1.45fr 1fr;
  gap: 48px;
  align-items: center;
}
.hero-left { min-width: 0; }

.profile-card {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 22px;
  padding: 26px;
  box-shadow: 0 14px 40px rgba(27,58,75,.12);
}
.pc-top { display: flex; gap: 16px; align-items: center; margin-bottom: 16px; }
.pc-photo {
  width: 72px; height: 72px; flex: none;
  border-radius: 16px; object-fit: cover;
  border: 3px solid var(--tintT);
}
.pc-name { font-weight: 800; font-size: 20px; color: var(--navy); line-height: 1.1; }
.pc-role { font-weight: 700; font-size: 13.5px; color: var(--amber); margin-top: 3px; }
.pc-bio { font-size: 14px; color: var(--body-c); line-height: 1.6; margin-bottom: 16px; }
.pc-list { list-style: none; margin: 0 0 18px; padding-top: 14px; border-top: 1px solid var(--line); }
.pc-list li {
  font-size: 13px; color: var(--body-c); line-height: 1.5;
  padding-left: 18px; position: relative; margin-bottom: 9px;
}
.pc-list li::before {
  content: ''; width: 6px; height: 6px; border-radius: 50%;
  background: var(--amber); position: absolute; left: 0; top: 7px;
}
.pc-links { display: flex; gap: 10px; align-items: center; padding-top: 14px; border-top: 1px solid var(--line); }
.pc-links a {
  width: 34px; height: 34px; border-radius: 9px;
  background: var(--tintT); color: var(--navy);
  display: flex; align-items: center; justify-content: center;
  text-decoration: none;
}
.pc-links a:hover { background: var(--teal); color: #fff; }
.pc-full {
  width: auto !important; padding: 0 14px;
  font-weight: 700; font-size: 13px; color: var(--teal) !important;
  margin-left: auto; background: none !important;
}
.pc-full:hover { background: none !important; color: var(--blue) !important; }

@media (max-width: 880px) {
  .hero-split { grid-template-columns: 1fr; gap: 32px; }
  .profile-card { max-width: 440px; }
}


/* ── share buttons ── */
.share-bar {
  display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
  margin: 36px 0 10px; padding: 18px 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line);
}
.share-bar .share-label { font-weight: 800; font-size: 14px; color: var(--navy); margin-right: 4px; }
.share-btn {
  display: inline-flex; align-items: center; gap: 7px;
  font-weight: 700; font-size: 13.5px; text-decoration: none;
  padding: 8px 15px; border-radius: 999px; border: 1px solid var(--line);
  color: var(--navy); background: #fff; cursor: pointer;
}
.share-btn:hover { border-color: var(--teal); color: var(--teal); }
.share-wa:hover { border-color:#25D366; color:#1a9e4b; }
.share-li:hover { border-color:#0A66C2; color:#0A66C2; }
.share-x:hover  { border-color:#000; color:#000; }
.share-copied { color: var(--teal) !important; border-color: var(--teal) !important; }

/* ── contact form ── */
.contact-section { background: var(--tintT); padding: clamp(44px,7vw,80px) clamp(20px,4vw,48px); }
.contact-inner { max-width: 620px; margin: 0 auto; }
.contact-inner .eyebrow { display:inline-block; }
.contact-inner h2 { font-size: clamp(26px,4vw,38px); font-weight: 800; color: var(--navy); margin: 10px 0 8px; }
.contact-inner > p { color: var(--body-c); margin-bottom: 24px; }
.cform { display: grid; gap: 14px; }
.cform input, .cform textarea {
  font-family: var(--sans); font-size: 15.5px;
  padding: 14px 16px; border-radius: 12px; border: 1px solid var(--line);
  background: #fff; width: 100%; color: var(--ink);
}
.cform input:focus, .cform textarea:focus { outline: 2px solid var(--teal); border-color: var(--teal); }
.cform textarea { min-height: 130px; resize: vertical; }
.cform button {
  font-family: var(--sans); font-weight: 800; font-size: 16px;
  padding: 14px 28px; border-radius: 999px; border: none;
  background: var(--grad); color: #fff; cursor: pointer; justify-self: start;
  box-shadow: 0 8px 22px rgba(15,163,163,.35);
}
.cform button:hover { transform: translateY(-2px); }
.cform .row2 { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
@media(max-width:520px){ .cform .row2 { grid-template-columns: 1fr; } }

/* ── search / filter bar ── */
.filter-bar { max-width: 1340px; margin: 0 auto; padding: 8px clamp(20px,4vw,48px) 0; }
.filter-inner {
  display: flex; gap: 10px; flex-wrap: wrap; align-items: center;
  background: #fff; border: 1px solid var(--line); border-radius: 14px;
  padding: 14px 16px; box-shadow: 0 4px 14px rgba(27,58,75,.05);
}
.f-search {
  flex: 1 1 240px; min-width: 180px;
  font-family: var(--sans); font-size: 15px;
  padding: 11px 16px; border-radius: 10px;
  border: 1px solid var(--line); background: var(--bg); color: var(--ink);
}
.f-search:focus { outline: 2px solid var(--teal); border-color: var(--teal); }
.f-select {
  font-family: var(--sans); font-size: 14.5px; font-weight: 600;
  padding: 11px 14px; border-radius: 10px;
  border: 1px solid var(--line); background: #fff; color: var(--navy); cursor: pointer;
}
.f-select:focus { outline: 2px solid var(--teal); border-color: var(--teal); }
.f-btn {
  font-family: var(--sans); font-weight: 800; font-size: 14.5px;
  padding: 11px 24px; border-radius: 10px; border: none;
  background: var(--grad); color: #fff; cursor: pointer;
}
.f-btn:hover { filter: brightness(1.08); }
.f-clear {
  font-family: var(--sans); font-weight: 700; font-size: 14.5px;
  padding: 11px 18px; border-radius: 10px;
  border: 1px solid var(--line); background: #fff; color: var(--muted); cursor: pointer;
}
.f-clear:hover { border-color: var(--teal); color: var(--teal); }
.f-count {
  font-family: var(--mono); font-size: 13px; color: var(--muted);
  margin: 12px 0 0 4px;
}
@media(max-width:600px){
  .f-search, .f-select, .f-btn, .f-clear { flex: 1 1 100%; }
}

/* ── MailerLite signup form ── */
.ml-signup {
  display: flex; gap: 10px; justify-content: center; flex-wrap: wrap;
  max-width: 480px; margin: 26px auto 8px;
}
.ml-signup input[type="email"] {
  flex: 1 1 260px; min-width: 200px;
  font-family: var(--sans); font-size: 16px;
  padding: 14px 18px; border-radius: 999px; border: none;
  color: var(--ink);
}
.ml-signup input[type="email"]:focus { outline: 3px solid var(--amber); }
.ml-signup button {
  font-family: var(--sans); font-weight: 800; font-size: 16px;
  padding: 14px 28px; border-radius: 999px; border: none;
  background: var(--amber); color: #fff; cursor: pointer; white-space: nowrap;
}
.ml-signup button:hover { filter: brightness(1.07); }
.ml-note { font-size: 12.5px; color: #9FBFC4; margin-top: 4px; }
.subscribe-or { color: #80A4AA; font-size: 13px; margin: 22px 0 14px; font-family: var(--mono); }
@media(max-width:520px){
  .ml-signup input[type="email"], .ml-signup button { flex: 1 1 100%; }
}

/* ════════════════════════════════════════
   NEW FEATURES: picks, views, dark mode
   ════════════════════════════════════════ */

/* ── Editor's Picks ── */
.picks { max-width: 1340px; margin: 0 auto; padding: 20px clamp(20px,4vw,48px) 0; }
.picks-head { margin-bottom: 18px; }
.picks-title { font-size: 26px; font-weight: 800; color: var(--navy); margin-top: 6px; }
.picks-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 18px; }
.pick-card {
  display: flex; flex-direction: column; gap: 8px;
  border-radius: 16px; padding: 24px 22px; text-decoration: none;
  color: #fff; position: relative; overflow: hidden;
  min-height: 200px; transition: transform .2s ease, box-shadow .2s ease;
}
.pick-card:hover { transform: translateY(-5px); box-shadow: 0 16px 40px rgba(27,58,75,.22); }
.pick-card.cat-digital-health { background: var(--grad); }
.pick-card.cat-policy { background: linear-gradient(135deg,#E08A3C,#B96A14); }
.pick-card.cat-strategy { background: linear-gradient(135deg,#6C4AB6,#3A2E7C); }
.pick-card.cat-pharma { background: linear-gradient(135deg,#2E7CB8,#1B3A4B); }
.pick-card.cat-biotech { background: linear-gradient(135deg,#37B68A,#0FA3A3); }
.pick-ed { font-family: var(--mono); font-size: 11px; font-weight: 600; letter-spacing: 1.5px; opacity: .9; }
.pick-card h3 { font-size: 19px; font-weight: 800; line-height: 1.2; }
.pick-card p { font-size: 13.5px; line-height: 1.5; opacity: .95; flex: 1; }
.pick-read { font-weight: 800; font-size: 14px; margin-top: auto; }
@media(max-width:820px){ .picks-grid { grid-template-columns: 1fr; } }

/* ── Card footer with reading time ── */
.card-foot { margin-top: auto; padding-top: 16px; display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.card-foot .card-read { padding-top: 0; }
.card-views { font-family: var(--mono); font-size: 12px; color: var(--muted); white-space: nowrap; }

/* ── Subscribe social proof ── */
.subscribe-proof { color: #9FDEDD; font-size: 14.5px; font-weight: 600; margin-top: 6px; }

/* ── Theme toggle button ── */
.theme-toggle {
  background: none; border: 1px solid var(--line); border-radius: 10px;
  width: 38px; height: 38px; cursor: pointer; color: var(--navy);
  display: inline-flex; align-items: center; justify-content: center; padding: 0;
}
.theme-toggle:hover { border-color: var(--teal); color: var(--teal); }
.theme-toggle .t-moon { display: none; }
[data-theme="dark"] .theme-toggle .t-sun { display: none; }
[data-theme="dark"] .theme-toggle .t-moon { display: block; }

/* ── DARK MODE THEME ── */
[data-theme="dark"] {
  --bg: #0F1B22;
  --navy: #E8F4F4;
  --ink: #DCEaEa;
  --body-c: #B4C7CE;
  --muted: #7E939B;
  --line: #25373F;
  --tintT: #16252C;
}
[data-theme="dark"] body { background: var(--bg); }
[data-theme="dark"] .site-header { background: #13212A; border-bottom-color: #25373F; }
[data-theme="dark"] .card,
[data-theme="dark"] .profile-card,
[data-theme="dark"] .hp-block,
[data-theme="dark"] .section-block,
[data-theme="dark"] .about-hero,
[data-theme="dark"] .filter-inner { background: #16252C; border-color: #25373F; }
[data-theme="dark"] .f-search { background: #0F1B22; color: var(--ink); }
[data-theme="dark"] .f-select { background: #16252C; color: var(--ink); }
[data-theme="dark"] .card-banner svg path { stroke: rgba(255,255,255,.7); }
[data-theme="dark"] .logo-name { color: #E8F4F4; }
[data-theme="dark"] .nav-subscribe { color: #fff !important; }
[data-theme="dark"] .util { background: #0A1418; }
[data-theme="dark"] .contact-section { background: #13212A; }
[data-theme="dark"] .cform input, [data-theme="dark"] .cform textarea { background: #0F1B22; color: var(--ink); border-color: #25373F; }
[data-theme="dark"] .pick-card { color: #fff; }

/* ── Archive page ── */
.archive-wrap { max-width: 860px; margin: 0 auto; padding: 52px 24px 80px; }
.archive-head { margin-bottom: 30px; }
.archive-head h1 { font-size: clamp(30px,5vw,44px); font-weight: 800; color: var(--navy); margin: 8px 0; }
.archive-sub { color: var(--body-c); font-size: 16px; }
.archive-list { list-style: none; }
.archive-item { border-bottom: 1px solid var(--line); }
.archive-item a { display: grid; grid-template-columns: 70px 1fr auto; gap: 16px; align-items: baseline; padding: 18px 4px; text-decoration: none; }
.archive-item a:hover { background: var(--tintT); }
.ai-ed { font-family: var(--mono); font-size: 12px; font-weight: 600; color: var(--teal); }
.ai-title { font-weight: 700; font-size: 16.5px; color: var(--navy); line-height: 1.35; }
.ai-meta { font-family: var(--mono); font-size: 12px; color: var(--muted); white-space: nowrap; }
@media(max-width:600px){ .archive-item a { grid-template-columns: 1fr; gap: 4px; } .ai-meta { white-space: normal; } }

/* ── Topic landing pages ── */
.topic-wrap { max-width: 1340px; margin: 0 auto; padding: 40px clamp(20px,4vw,48px) 60px; }
.topic-head { margin-bottom: 24px; }
.topic-head h1 { font-size: clamp(30px,5vw,46px); font-weight: 800; color: var(--navy); margin: 8px 0; }
.topic-sub { color: var(--body-c); font-size: 16px; margin-bottom: 12px; }
.topic-back { font-weight: 700; color: var(--teal); text-decoration: none; font-size: 14px; }
.topic-empty { color: var(--muted); padding: 40px 0; text-align: center; }

/* ── Topic chips (browse by topic) ── */
.topic-chips { max-width: 1340px; margin: 0 auto; padding: 8px clamp(20px,4vw,48px) 0; display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
.topic-chips .tc-label { font-family: var(--mono); font-size: 12px; color: var(--muted); margin-right: 4px; }
.topic-chip { text-decoration: none; font-size: 13px; font-weight: 700; padding: 7px 16px; border-radius: 999px; border: 1px solid var(--line); color: var(--navy); transition: all .15s ease; }
.topic-chip:hover { border-color: var(--teal); color: var(--teal); }

/* ── Related issues ── */
.related { max-width: 860px; margin: 40px auto 0; padding: 0 24px; }
.related-label { font-family: var(--mono); font-size: 12px; font-weight: 600; letter-spacing: 1.5px; text-transform: uppercase; color: var(--muted); margin-bottom: 14px; }
.related-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 14px; }
.related-card { display: flex; flex-direction: column; gap: 8px; padding: 18px 18px; border-radius: 12px; text-decoration: none; color: #fff; min-height: 110px; transition: transform .2s ease; }
.related-card:hover { transform: translateY(-3px); }
.related-card.cat-digital-health { background: var(--grad); }
.related-card.cat-policy { background: linear-gradient(135deg,#E08A3C,#B96A14); }
.related-card.cat-strategy { background: linear-gradient(135deg,#6C4AB6,#3A2E7C); }
.related-card.cat-pharma { background: linear-gradient(135deg,#2E7CB8,#1B3A4B); }
.related-card.cat-biotech { background: linear-gradient(135deg,#37B68A,#0FA3A3); }
.related-card.cat-general { background: linear-gradient(135deg,#1B3A4B,#2E7CB8); }
.rc-ed { font-family: var(--mono); font-size: 11px; font-weight: 600; opacity: .9; }
.rc-title { font-weight: 700; font-size: 15px; line-height: 1.3; }
@media(max-width:700px){ .related-grid { grid-template-columns: 1fr; } }

/* ── Ask Me Anything ── */
.ama-wrap { max-width: 760px; margin: 0 auto; padding: 52px 24px 80px; }
.ama-head { text-align: center; margin-bottom: 28px; }
.ama-head h1 { font-size: clamp(30px,5vw,46px); font-weight: 800; color: var(--navy); margin: 8px 0; }
.ama-sub { color: var(--body-c); font-size: 16px; line-height: 1.6; max-width: 560px; margin: 0 auto; }
.ama-box { display: flex; gap: 10px; margin-bottom: 16px; }
.ama-input { flex: 1; padding: 16px 18px; border: 2px solid var(--line); border-radius: 12px; font-size: 16px; font-family: inherit; color: var(--ink); background: #fff; }
.ama-input:focus { outline: none; border-color: var(--teal); }
.ama-btn { padding: 0 26px; background: var(--grad); color: #fff; border: none; border-radius: 12px; font-weight: 800; font-size: 15px; cursor: pointer; white-space: nowrap; }
.ama-btn:hover { filter: brightness(1.08); }
.ama-suggest { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-bottom: 30px; }
.ama-sg-label { font-family: var(--mono); font-size: 11px; color: var(--muted); }
.ama-chip { background: var(--tintT); border: none; border-radius: 999px; padding: 7px 14px; font-size: 13px; font-weight: 600; color: var(--navy); cursor: pointer; }
.ama-chip:hover { background: var(--teal); color: #fff; }
.ama-result { min-height: 40px; }
.ama-answer { animation: amaFade .3s ease; }
@keyframes amaFade { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
.ama-found { font-weight: 700; color: var(--navy); margin-bottom: 14px; font-size: 15px; }
.ama-card { display: flex; flex-direction: column; gap: 5px; padding: 18px 20px; border-radius: 12px; text-decoration: none; color: #fff; margin-bottom: 12px; transition: transform .15s ease; }
.ama-card:hover { transform: translateX(4px); }
.ama-card.cat-digital-health { background: var(--grad); }
.ama-card.cat-policy { background: linear-gradient(135deg,#E08A3C,#B96A14); }
.ama-card.cat-strategy { background: linear-gradient(135deg,#6C4AB6,#3A2E7C); }
.ama-card.cat-pharma { background: linear-gradient(135deg,#2E7CB8,#1B3A4B); }
.ama-card.cat-biotech { background: linear-gradient(135deg,#37B68A,#0FA3A3); }
.ama-card.cat-general { background: linear-gradient(135deg,#1B3A4B,#2E7CB8); }
.amc-ed { font-family: var(--mono); font-size: 11px; font-weight: 600; opacity: .9; }
.amc-title { font-weight: 800; font-size: 17px; line-height: 1.25; }
.amc-go { font-size: 13px; font-weight: 700; margin-top: 4px; opacity: .95; }
.ama-none { background: var(--tintT); border-radius: 14px; padding: 28px 26px; text-align: center; }
.ama-none-title { font-size: 19px; font-weight: 800; color: var(--navy); margin-bottom: 8px; }
.ama-none-sub { color: var(--body-c); font-size: 14.5px; line-height: 1.6; margin-bottom: 18px; }
.ama-suggest-btn { display: inline-block; background: var(--grad); color: #fff; font-weight: 800; font-size: 14px; text-decoration: none; padding: 12px 24px; border-radius: 999px; margin: 0 6px 10px; }
.ama-browse { display: block; color: var(--teal); font-weight: 700; font-size: 14px; text-decoration: none; margin-top: 6px; }
[data-theme="dark"] .ama-input { background: #16252C; color: var(--ink); }

/* ── Coverage stats section ── */
.stats-section { background: var(--tintT); padding: 56px 24px; }
.stats-inner { max-width: 760px; margin: 0 auto; }
.stats-inner h2 { font-size: clamp(24px,4vw,34px); font-weight: 800; color: var(--navy); margin: 6px 0 4px; }
.stats-sub { color: var(--body-c); font-size: 15px; margin-bottom: 28px; }
.stats-bars { display: flex; flex-direction: column; gap: 16px; }
.stat-row { display: grid; grid-template-columns: 120px 1fr 64px; gap: 14px; align-items: center; }
.stat-name { font-size: 14px; font-weight: 700; color: var(--navy); }
.stat-track { background: rgba(27,58,75,.08); border-radius: 999px; height: 14px; overflow: hidden; }
.stat-fill { height: 100%; border-radius: 999px; transition: width 1.1s cubic-bezier(.22,1,.36,1); }
.stat-fill.cat-policy { background: linear-gradient(90deg,#E08A3C,#B96A14); }
.stat-fill.cat-strategy { background: linear-gradient(90deg,#6C4AB6,#3A2E7C); }
.stat-fill.cat-digital-health { background: var(--grad); }
.stat-fill.cat-pharma { background: linear-gradient(90deg,#2E7CB8,#1B3A4B); }
.stat-fill.cat-biotech { background: linear-gradient(90deg,#37B68A,#0FA3A3); }
.stat-fill.cat-general { background: linear-gradient(90deg,#1B3A4B,#2E7CB8); }
.stat-val { font-family: var(--mono); font-size: 14px; font-weight: 600; color: var(--navy); text-align: right; }
.stat-count { color: var(--muted); font-size: 12px; }
.stats-foot { margin-top: 26px; font-size: 14px; color: var(--body-c); }
.stats-foot a { color: var(--teal); font-weight: 700; text-decoration: none; }
@media(max-width:540px){ .stat-row { grid-template-columns: 88px 1fr 52px; gap: 10px; } .stat-name { font-size: 12.5px; } }
[data-theme="dark"] .stats-section { background: #13212A; }
[data-theme="dark"] .stat-track { background: rgba(255,255,255,.08); }

/* ── Back to top button ── */
.to-top { position: fixed; bottom: 24px; right: 24px; width: 46px; height: 46px; border-radius: 50%; background: var(--navy); color: #fff; border: none; cursor: pointer; display: flex; align-items: center; justify-content: center; opacity: 0; pointer-events: none; transform: translateY(10px); transition: opacity .25s ease, transform .25s ease; z-index: 60; box-shadow: 0 6px 18px rgba(27,58,75,.28); }
.to-top.show { opacity: 1; pointer-events: auto; transform: none; }
.to-top:hover { background: var(--teal); }
[data-theme="dark"] .to-top { background: var(--teal); }