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

    /* ── TOKENS — RSV site: warm teal + terracotta ── */
    :root {
      --paper:      #f0ebe3;
      --bg:         #f0ebe3;
      --ink:        #1a1c1b;   /* deep warm black                                 */
      --ink-2:      #2e3b38;   /* mid warm teal-gray                             */
      --ink-3:      #6e8480;   /* muted teal-gray                                */
      --rule-soft:    rgba(26,28,27,0.16);
      --rule-faint:   rgba(26,28,27,0.09);
      --rule-section: rgba(26,28,27,0.80);

      --accent:      #2e7a73;   /* warm teal — health, trust, calm               */
      --accent-soft: rgba(46,122,115,0.12);
      --accent-2:    #c46d2e;   /* terracotta — warmth, urgency, matches illustrations */
      --accent-2-soft: rgba(196,109,46,0.14);

      /* RSV activity severity palette */
      --s0: #c8c0bc;   /* none      — warm gray                          */
      --s1: #88b0aa;   /* very low  — pale teal                          */
      --s2: #3e9e94;   /* low       — teal                               */
      --s3: #c9a227;   /* moderate  — amber                              */
      --s4: #c86820;   /* high      — orange                             */
      --s5: #a01828;   /* very high — deep red                           */

      --serif: 'Source Serif 4', Georgia, 'Times New Roman', serif;
      --sans:  'Inter', -apple-system, BlinkMacSystemFont, 'Helvetica Neue', Arial, sans-serif;
    }

    html, body {
      background: var(--paper);
      color: var(--ink);
      font-family: var(--serif);
      font-size: 18px;
      line-height: 1.55;
      -webkit-font-smoothing: antialiased;
      -moz-osx-font-smoothing: grayscale;
    }
    body { min-height: 100vh; overflow-x: hidden; }
    a { color: inherit; text-decoration: none; }
    .tnum { font-variant-numeric: tabular-nums; }

    .shell {
      max-width: 880px;
      margin: 0 auto;
      padding: 0 36px;
    }

    /* ── MASTHEAD ── */
    .masthead {
      border-bottom: 2px solid var(--accent);
      padding: 28px 0 18px;
      display: flex;
      justify-content: space-between;
      align-items: baseline;
      gap: 24px;
      flex-wrap: wrap;
    }
    .mast-brand {
      font-family: var(--sans);
      font-size: 11px;
      font-weight: 700;
      letter-spacing: 0.12em;
      text-transform: uppercase;
      color: var(--ink);
    }
    .mast-date {
      font-family: var(--sans);
      font-style: italic;
      font-size: 14px;
      color: var(--ink-2);
      flex: 1;
      text-align: center;
    }
    .mast-nav { display: flex; gap: 24px; }
    .mast-btn {
      font-family: var(--sans);
      font-size: 11px;
      font-weight: 600;
      letter-spacing: 0.08em;
      text-transform: uppercase;
      color: var(--ink-2);
      transition: color 0.15s;
    }
    .mast-btn:hover { color: var(--accent); }

    /* ── HERO — full viewport width ── */
    .hero {
      position: relative;
      min-height: 480px;
      overflow: hidden;
      display: flex;
      align-items: center;
    }

    /* Illustration: fills the right 58% of the viewport */
    .hero-illustration {
      position: absolute;
      right: 0;
      top: 0;
      bottom: 0;
      width: 58%;
      z-index: 0;
      pointer-events: none;
      overflow: hidden;
    }
    /* Fade left edge smoothly into page background */
    .hero-illustration::before {
      content: '';
      position: absolute;
      top: 0; left: 0; bottom: 0;
      width: 45%;
      background: linear-gradient(to right, var(--paper) 0%, transparent 100%);
      z-index: 2;
    }
    /* Crossfade layers — both absolutely positioned within illustration container */
    .hero-img {
      position: absolute;
      top: 50%;
      left: 0;
      transform: translateY(-50%);
      width: 100%;
      height: auto;
      display: block;
      transition: opacity 1.8s ease-in-out;
      opacity: 0;
    }
    .hero-img--active { opacity: 1; }

    /* Content: centered like the shell, text constrained to left */
    .hero-content {
      position: relative;
      z-index: 2;
      width: 100%;
      max-width: 880px;
      margin: 0 auto;
      padding: 72px 36px 64px;
    }
    .hero-eyebrow,
    .hero-q,
    .answer,
    .qualifier,
    .loc-line,
    .hero-loc-bar,
    .hero-severity-bar {
      max-width: 420px;
    }
    .hero-eyebrow {
      font-family: var(--sans);
      font-size: 11px;
      font-weight: 600;
      letter-spacing: 0.13em;
      text-transform: uppercase;
      color: var(--accent-2);
      margin-bottom: 16px;
      min-height: 14px;
      transition: opacity 0.5s ease;
    }
    .hero-eyebrow.fading { opacity: 0; }
    .hero-q {
      font-family: var(--serif);
      font-size: clamp(32px, 4.5vw, 52px);
      font-weight: 400;
      line-height: 1.2;
      letter-spacing: -0.01em;
      color: var(--ink);
      margin-bottom: 4px;
    }
    .answer {
      font-family: var(--serif);
      font-size: clamp(64px, 10vw, 108px);
      font-weight: 700;
      line-height: 1;
      letter-spacing: -0.02em;
      margin: 8px 0 16px;
    }
    .answer.yes  { color: var(--s4); }
    .answer.no   { color: var(--accent); }
    .answer.loading { color: var(--ink-3); }
    .dot { animation: blink 1.2s infinite; }
    .dot:nth-child(2) { animation-delay: 0.2s; }
    .dot:nth-child(3) { animation-delay: 0.4s; }
    @keyframes blink { 0%,80%,100%{opacity:0.2} 40%{opacity:1} }

    .qualifier {
      font-family: var(--sans);
      font-size: 16px;
      color: var(--ink-2);
      margin-bottom: 6px;
    }
    .qualifier.loading { color: var(--ink-3); min-height: 20px; }

    .loc-line {
      font-family: var(--sans);
      font-size: 13px;
      color: var(--ink-3);
      margin-bottom: 14px;
    }
    .hero-loc-bar { margin-bottom: 20px; }
    .hero-loc-wrap {
      position: relative;
      display: inline-flex;
      align-items: center;
    }
    .hero-loc-input {
      background: transparent;
      border: none;
      border-bottom: 1.5px solid var(--rule-soft);
      font-family: var(--sans);
      font-size: 14px;
      color: var(--ink-2);
      padding: 4px 24px 5px 0;
      width: 220px;
      outline: none;
      transition: border-color 0.15s, color 0.15s;
    }
    .hero-loc-input::placeholder { color: var(--ink-3); }
    .hero-loc-input:focus {
      border-bottom-color: var(--accent);
      color: var(--ink);
    }
    .hero-loc-input:focus + .hero-loc-pencil { opacity: 0; pointer-events: none; }
    .hero-loc-input:disabled { color: var(--ink-3); font-style: italic; }
    .hero-loc-pencil {
      position: absolute;
      right: 2px;
      bottom: 6px;
      background: none;
      border: none;
      padding: 0;
      cursor: pointer;
      font-size: 13px;
      color: var(--ink-3);
      line-height: 1;
      transition: opacity 0.15s, color 0.15s;
    }
    .hero-loc-pencil:hover { color: var(--accent); }
    .hero-loc-error {
      font-family: var(--sans);
      font-size: 12px;
      color: var(--accent-2);
      margin-top: 4px;
      min-height: 16px;
    }
    .hero-severity-bar { margin-top: 4px; }

    /* Mobile: stack vertically, hide illustration */
    @media (max-width: 600px) {
      .hero { min-height: auto; }
      /* illustration handled by the 620px stacked layout below */
      .hero-content { padding: 8px 24px 40px; }
      .hero-eyebrow, .hero-q, .answer, .qualifier,
      .loc-line, .hero-loc-bar, .hero-severity-bar { max-width: 100%; }
    }

    /* ── ACTIVITY METER ── */
    .hbid {
      border-top: 1.5px solid var(--rule-soft);
      padding: 36px 0 28px;
    }
    .hbid-head {
      display: flex;
      align-items: baseline;
      justify-content: space-between;
      flex-wrap: wrap;
      gap: 12px;
      margin-bottom: 18px;
    }
    .hbid-eyebrow {
      font-family: var(--sans);
      font-size: 11px;
      font-weight: 700;
      letter-spacing: 0.12em;
      text-transform: uppercase;
      color: var(--ink-3);
    }
    .hbid-severity {
      font-family: var(--sans);
      font-size: 15px;
      font-weight: 700;
    }
    .hbid-meter {
      display: flex;
      gap: 4px;
      margin-bottom: 16px;
    }
    .hbid-meter-seg {
      flex: 1;
      height: 8px;
      border-radius: 2px;
      background: var(--rule-faint);
      transition: background 0.4s;
    }
    .hbid-meter-seg.active-1 { background: var(--s1); }
    .hbid-meter-seg.active-2 { background: var(--s2); }
    .hbid-meter-seg.active-3 { background: var(--s3); }
    .hbid-meter-seg.active-4 { background: var(--s4); }
    .hbid-meter-seg.active-5 { background: var(--s5); }

    .hbid-sentence {
      font-size: 17px;
      color: var(--ink-2);
      margin-bottom: 10px;
      line-height: 1.5;
    }
    .hbid-decision {
      font-family: var(--sans);
      font-size: 14px;
      font-weight: 600;
      color: var(--ink);
      margin-bottom: 16px;
    }
    .hbid-tags { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 20px; }
    .hbid-tag {
      font-family: var(--sans);
      font-size: 12px;
      font-weight: 600;
      padding: 4px 10px;
      border-radius: 20px;
      background: var(--accent-soft);
      color: var(--accent);
    }
    .hbid-tag.warn { background: var(--accent-2-soft); color: var(--accent-2); }

    /* ── REGION LIST ── */
    .region-summary {
      font-size: 16px;
      color: var(--ink-2);
      margin-bottom: 14px;
    }
    .region-list {
      display: grid;
      grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
      gap: 8px;
      margin-bottom: 20px;
    }
    .region-row {
      display: flex;
      align-items: center;
      gap: 10px;
      padding: 8px 12px;
      border: 1px solid var(--rule-faint);
      border-radius: 6px;
      background: white;
    }
    .region-dot {
      width: 10px;
      height: 10px;
      border-radius: 50%;
      flex-shrink: 0;
    }
    .region-name { font-family: var(--sans); font-size: 13px; color: var(--ink); }
    .region-label { font-family: var(--sans); font-size: 12px; color: var(--ink-3); margin-left: auto; }
    .region-note {
      font-family: var(--sans);
      font-size: 12px;
      color: var(--ink-3);
    }

    /* ── AFFILIATE RECS ── */
    .hbid-recs {
      border-top: 1px solid var(--rule-faint);
      padding-top: 20px;
      margin-top: 20px;
    }
    .hbid-recs-label {
      font-family: var(--sans);
      font-size: 11px;
      font-weight: 700;
      letter-spacing: 0.1em;
      text-transform: uppercase;
      color: var(--ink-3);
      margin-bottom: 14px;
    }
    .hbid-recs-row {
      display: grid;
      grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
      gap: 12px;
      margin-bottom: 10px;
    }
    .rec-card {
      border: 1px solid var(--rule-soft);
      border-radius: 8px;
      padding: 14px;
      background: white;
      transition: border-color 0.15s, box-shadow 0.15s;
    }
    .rec-card:hover { border-color: var(--accent); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
    .rec-label {
      font-family: var(--sans);
      font-size: 10px;
      font-weight: 700;
      letter-spacing: 0.1em;
      text-transform: uppercase;
      color: var(--ink-3);
      margin-bottom: 4px;
    }
    .rec-title {
      font-family: var(--sans);
      font-size: 13px;
      font-weight: 600;
      color: var(--ink);
      margin-bottom: 6px;
      line-height: 1.35;
    }
    .rec-link {
      font-family: var(--sans);
      font-size: 12px;
      color: var(--accent);
      font-weight: 600;
      display: inline-block;
    }
    .rec-link:hover { text-decoration: underline; }
    .hbid-recs-disclosure {
      font-family: var(--sans);
      font-size: 11px;
      color: var(--ink-3);
    }

    /* ── SECTIONS ── */
    .section {
      border-top: 1.5px solid var(--rule-soft);
      padding: 40px 0 28px;
    }
    .section-head {
      font-family: var(--serif);
      font-size: 22px;
      font-weight: 700;
      color: var(--ink);
      margin-bottom: 20px;
      display: flex;
      align-items: baseline;
      gap: 14px;
    }
    .section-num {
      font-family: var(--sans);
      font-size: 11px;
      font-weight: 700;
      letter-spacing: 0.14em;
      text-transform: uppercase;
      color: var(--accent);
      padding: 3px 8px;
      border: 1.5px solid var(--accent);
      border-radius: 3px;
      flex-shrink: 0;
    }
    .section-sub {
      font-family: var(--sans);
      font-size: 13px;
      font-weight: 400;
      color: var(--ink-3);
    }

    /* ── RISK GROUPS ── */
    .risk-grid {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 16px;
      margin-bottom: 20px;
    }
    @media (max-width: 560px) {
      .risk-grid { grid-template-columns: 1fr; }
    }
    .risk-card {
      border: 1.5px solid var(--rule-soft);
      border-radius: 8px;
      padding: 18px 20px;
      background: white;
    }
    .risk-icon { margin-bottom: 12px; line-height: 0; }
    .risk-icon img { width: 88px; height: 88px; display: block; object-fit: contain; }
    .risk-badge {
      display: inline-block;
      font-family: var(--sans);
      font-size: 11px;
      font-weight: 700;
      letter-spacing: 0.04em;
      text-transform: uppercase;
      color: var(--accent-2);
      background: var(--accent-2-soft);
      border: 1px solid var(--accent-2);
      border-radius: 20px;
      padding: 2px 9px;
      margin-bottom: 8px;
    }
    .risk-title {
      font-family: var(--sans);
      font-size: 14px;
      font-weight: 700;
      color: var(--ink);
      margin-bottom: 6px;
    }
    .risk-body {
      font-family: var(--sans);
      font-size: 13px;
      color: var(--ink-2);
      line-height: 1.45;
    }

    /* ── RISK STAT CALLOUT ── */
    .risk-stat {
      display: flex;
      align-items: center;
      gap: 20px;
      background: var(--paper-2, #f5f1ec);
      border-radius: 10px;
      padding: 20px 24px;
      margin-top: 8px;
      margin-bottom: 4px;
    }
    .risk-stat-num {
      font-family: var(--serif);
      font-size: 52px;
      font-weight: 800;
      line-height: 1;
      color: var(--accent-2);
      flex-shrink: 0;
    }
    .risk-stat-text {
      font-family: var(--sans);
      font-size: 15px;
      font-weight: 600;
      color: var(--ink);
      line-height: 1.45;
    }
    .risk-stat-text span {
      display: block;
      font-weight: 400;
      font-size: 13px;
      color: var(--ink-2);
      margin-top: 4px;
    }
    @media (max-width: 480px) {
      .risk-stat { flex-direction: column; align-items: flex-start; gap: 8px; }
      .risk-stat-num { font-size: 40px; }
    }

    /* ── PROTECTION TIMELINE ── */
    .ptl-cal {
      background: white;
      border: 1.5px solid var(--rule-soft);
      border-radius: 10px;
      padding: 20px 22px 16px;
      margin-bottom: 20px;
    }
    .ptl-cal-head {
      display: flex;
      justify-content: space-between;
      align-items: baseline;
      margin-bottom: 16px;
      flex-wrap: wrap;
      gap: 6px;
    }
    .ptl-cal-region {
      font-family: var(--sans);
      font-size: 11px;
      font-weight: 700;
      letter-spacing: 0.1em;
      text-transform: uppercase;
      color: var(--ink-3);
    }
    .ptl-cal-range {
      font-family: var(--sans);
      font-size: 12px;
      font-weight: 600;
      color: var(--accent-2);
    }
    .ptl-bar {
      display: grid;
      grid-template-columns: repeat(12, 1fr);
      gap: 3px;
      margin-bottom: 10px;
    }
    .ptl-cell {
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 5px;
    }
    .ptl-cell-bar {
      width: 100%;
      height: 24px;
      border-radius: 3px;
      background: var(--rule-faint);
      transition: background 0.2s;
    }
    .ptl-cell--szn .ptl-cell-bar {
      background: var(--accent-2-soft);
      box-shadow: inset 0 0 0 1.5px rgba(196,109,46,0.28);
    }
    .ptl-cell--today .ptl-cell-bar {
      box-shadow: inset 0 0 0 2px var(--accent);
      background: rgba(46,122,115,0.12);
    }
    .ptl-cell--today.ptl-cell--szn .ptl-cell-bar {
      background: rgba(46,122,115,0.18);
      box-shadow: inset 0 0 0 2px var(--accent);
    }
    .ptl-cell-lbl {
      font-family: var(--sans);
      font-size: 9px;
      font-weight: 600;
      color: var(--ink-3);
      letter-spacing: 0.02em;
    }
    .ptl-cell--today .ptl-cell-lbl {
      color: var(--accent);
      font-weight: 800;
    }
    .ptl-cal-legend {
      display: flex;
      gap: 18px;
      flex-wrap: wrap;
    }
    .ptl-leg {
      font-family: var(--sans);
      font-size: 11px;
      color: var(--ink-3);
      display: flex;
      align-items: center;
      gap: 6px;
    }
    .ptl-leg::before {
      content: '';
      display: inline-block;
      width: 14px;
      height: 12px;
      border-radius: 2px;
      flex-shrink: 0;
    }
    .ptl-leg--szn::before {
      background: var(--accent-2-soft);
      box-shadow: inset 0 0 0 1px rgba(196,109,46,0.3);
    }
    .ptl-leg--today::before {
      background: rgba(46,122,115,0.12);
      box-shadow: inset 0 0 0 2px var(--accent);
    }
    .ptl-cards {
      display: grid;
      grid-template-columns: 1fr;
      gap: 14px;
      margin-bottom: 24px;
    }
    .ptl-card {
      border: 1.5px solid var(--rule-soft);
      border-radius: 8px;
      padding: 18px 20px;
      background: white;
    }
    .ptl-card-who {
      font-family: var(--sans);
      font-size: 10px;
      font-weight: 700;
      letter-spacing: 0.1em;
      text-transform: uppercase;
      color: var(--accent);
      margin-bottom: 5px;
    }
    .ptl-card-name {
      font-family: var(--sans);
      font-size: 15px;
      font-weight: 700;
      color: var(--ink);
      margin-bottom: 8px;
      line-height: 1.3;
    }
    .ptl-card-timing {
      font-weight: 400;
      color: var(--ink-3);
      font-size: 13px;
    }
    .ptl-card-body {
      font-family: var(--sans);
      font-size: 13px;
      color: var(--ink-2);
      line-height: 1.5;
      margin-bottom: 12px;
    }
    /* Plain-text note at card bottom — no bubble, no dot */
    .ptl-card-note {
      font-family: var(--sans);
      font-size: 13px;
      color: var(--ink-2);
      line-height: 1.5;
      border-top: 1px solid var(--rule-faint);
      padding-top: 10px;
      margin-top: 12px;
    }

    .ptl-urgency {
      display: flex;
      gap: 10px;
      align-items: flex-start;
      padding: 10px 14px;
      border-radius: 6px;
      font-family: var(--sans);
      font-size: 13px;
      line-height: 1.45;
      color: var(--ink);
    }
    .ptl-dot {
      width: 8px;
      height: 8px;
      border-radius: 50%;
      flex-shrink: 0;
      margin-top: 4px;
    }
    .urgency-now  { background: rgba(160,24,40,0.07); }
    .urgency-now  .ptl-dot { background: var(--s5); }
    .urgency-soon { background: var(--accent-2-soft); }
    .urgency-soon .ptl-dot { background: var(--accent-2); }
    .urgency-plan { background: var(--accent-soft); }
    .urgency-plan .ptl-dot { background: var(--accent); }

    /* ── IMMUNIZATION SECTION ── */
    .immuno-split {
      display: grid;
      grid-template-columns: 1fr auto;
      gap: 32px;
      align-items: start;
    }
    .immuno-illustration {
      width: clamp(100px, 15vw, 160px);
      align-self: center;
    }
    .immuno-illustration img {
      width: 100%;
      height: auto;
      display: block;
      mix-blend-mode: multiply;
      border-radius: 4px;
      opacity: 0.9;
    }
    .immuno-cards { display: flex; flex-direction: column; gap: 14px; }
    .immuno-card {
      border: 1.5px solid var(--rule-soft);
      border-radius: 8px;
      padding: 16px 20px;
      background: white;
      position: relative;
    }
    .immuno-card.primary { border-color: var(--accent); }
    .immuno-badge {
      font-family: var(--sans);
      font-size: 10px;
      font-weight: 700;
      letter-spacing: 0.1em;
      text-transform: uppercase;
      color: var(--accent);
      margin-bottom: 6px;
    }
    .immuno-card.secondary .immuno-badge { color: var(--accent-2); }
    .immuno-title {
      font-family: var(--sans);
      font-size: 15px;
      font-weight: 700;
      color: var(--ink);
      margin-bottom: 4px;
    }
    .immuno-body {
      font-family: var(--sans);
      font-size: 13px;
      color: var(--ink-2);
      line-height: 1.5;
    }
    .immuno-timing {
      display: inline-block;
      margin-top: 8px;
      font-family: var(--sans);
      font-size: 12px;
      font-weight: 600;
      color: var(--accent);
      background: var(--accent-soft);
      padding: 3px 10px;
      border-radius: 20px;
    }
    .immuno-card.secondary .immuno-timing { color: var(--accent-2); background: var(--accent-2-soft); }

    /* ── SYMPTOMS / TRIAGE ── */
    .symptom-split {
      display: grid;
      grid-template-columns: 1fr auto;
      gap: 28px;
      align-items: start;
      margin-bottom: 24px;
    }
    .symptom-illustration {
      width: clamp(80px, 12vw, 130px);
    }
    .symptom-illustration img {
      width: 100%;
      height: auto;
      display: block;
      mix-blend-mode: multiply;
      opacity: 0.88;
    }
    .triage-grid {
      display: flex;
      flex-direction: column;
      gap: 10px;
    }
    .triage-row {
      display: grid;
      grid-template-columns: 28px 1fr;
      gap: 12px;
      align-items: start;
      padding: 12px 16px;
      border-radius: 8px;
      border: 1px solid var(--rule-faint);
      background: white;
    }
    .triage-row.urgent { border-color: var(--s4); background: rgba(200,104,32,0.04); }
    .triage-row.emergency { border-color: var(--s5); background: rgba(160,24,40,0.05); }
    .triage-icon { font-size: 16px; padding-top: 1px; }
    .triage-title {
      font-family: var(--sans);
      font-size: 13px;
      font-weight: 700;
      color: var(--ink);
      margin-bottom: 2px;
    }
    .triage-body {
      font-family: var(--sans);
      font-size: 12px;
      color: var(--ink-2);
      line-height: 1.45;
    }

    /* ── HOME CARE / AFFILIATE ── */
    .actions {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      gap: 16px;
    }
    @media (max-width: 520px) {
      .actions { grid-template-columns: 1fr; }
    }
    .action {
      border: 1px solid var(--rule-soft);
      border-radius: 8px;
      padding: 16px 18px;
      background: white;
    }
    .action-label {
      font-family: var(--sans);
      font-size: 10px;
      font-weight: 700;
      letter-spacing: 0.1em;
      text-transform: uppercase;
      color: var(--ink-3);
      margin-bottom: 6px;
    }
    .action-title {
      font-family: var(--sans);
      font-size: 13px;
      font-weight: 600;
      color: var(--ink);
      margin-bottom: 10px;
      line-height: 1.4;
    }
    .action-links { display: flex; flex-direction: column; gap: 5px; }
    .action-link {
      font-family: var(--sans);
      font-size: 13px;
      color: var(--accent);
      font-weight: 600;
      transition: color 0.15s;
    }
    .action-link:hover { color: var(--accent-2); }

    /* ── HOME CARE ILLUSTRATION ── */
    .homecare-split {
      display: grid;
      grid-template-columns: 1fr auto;
      gap: 28px;
      align-items: start;
    }
    .homecare-illustration {
      width: clamp(80px, 12vw, 130px);
    }
    .homecare-illustration img {
      width: 100%;
      height: auto;
      display: block;
      mix-blend-mode: multiply;
      opacity: 0.9;
    }

    /* ── AD SLOT ── */
    .ad-slot {
      border-top: 1px solid var(--rule-faint);
      border-bottom: 1px solid var(--rule-faint);
      padding: 20px 0;
      margin: 16px 0;
      text-align: center;
    }
    .ad-slot-label {
      font-family: var(--sans);
      font-size: 10px;
      letter-spacing: 0.1em;
      text-transform: uppercase;
      color: var(--ink-3);
      margin-bottom: 6px;
    }
    .ad-unit {
      font-family: var(--sans);
      font-size: 12px;
      color: var(--ink-3);
      padding: 18px 0;
      background: var(--rule-faint);
      border-radius: 4px;
    }

    /* ── ALERT / EMAIL CAPTURE ── */
    .coming-soon {
      border-top: 1.5px solid var(--rule-soft);
      padding: 40px 0;
    }
    .cs-inner {
      max-width: 520px;
    }
    .cs-eyebrow {
      font-family: var(--sans);
      font-size: 11px;
      font-weight: 700;
      letter-spacing: 0.12em;
      text-transform: uppercase;
      color: var(--ink-3);
      margin-bottom: 10px;
      display: flex;
      align-items: center;
      gap: 10px;
    }
    .cs-badge {
      background: var(--accent-soft);
      color: var(--accent);
      padding: 2px 8px;
      border-radius: 20px;
      font-size: 10px;
    }
    .cs-title {
      font-family: var(--serif);
      font-size: 24px;
      font-weight: 700;
      color: var(--ink);
      margin-bottom: 12px;
    }
    .cs-body {
      font-size: 15px;
      color: var(--ink-2);
      margin-bottom: 20px;
      line-height: 1.55;
    }
    .cs-form {
      display: flex;
      gap: 8px;
      flex-wrap: wrap;
    }
    .cs-input {
      font-family: var(--sans);
      font-size: 14px;
      padding: 10px 14px;
      border: 1.5px solid var(--rule-soft);
      border-radius: 6px;
      background: white;
      color: var(--ink);
      flex: 1;
      min-width: 200px;
      outline: none;
    }
    .cs-input:focus { border-color: var(--accent); }
    .cs-btn {
      font-family: var(--sans);
      font-size: 13px;
      font-weight: 700;
      padding: 10px 20px;
      background: var(--accent);
      color: white;
      border: none;
      border-radius: 6px;
      cursor: pointer;
      white-space: nowrap;
      transition: background 0.15s;
    }
    .cs-btn:hover { background: #256860; }
    .cs-btn:disabled { opacity: 0.5; cursor: default; }
    .cs-note {
      font-family: var(--sans);
      font-size: 12px;
      color: var(--ink-3);
      margin-top: 10px;
    }
    .cs-success {
      font-family: var(--sans);
      font-size: 14px;
      font-weight: 600;
      color: var(--accent);
      padding: 10px 0;
    }

    /* ── DOCTOR CTA ── */
    .doctor-cta {
      display: flex;
      align-items: center;
      gap: 24px;
      padding: 20px 24px;
      border: 1.5px solid var(--accent);
      border-radius: 10px;
      background: var(--accent-soft);
      margin-top: 24px;
    }
    .doctor-cta-illustration {
      width: 80px;
      flex-shrink: 0;
    }
    .doctor-cta-illustration img {
      width: 100%;
      height: auto;
      display: block;
      mix-blend-mode: multiply;
    }
    .doctor-cta-text {
      font-family: var(--sans);
      font-size: 14px;
      color: var(--ink-2);
      line-height: 1.5;
    }
    .doctor-cta-text strong { color: var(--ink); }

    /* ── FOOTER ── */
    footer {
      border-top: 1.5px solid var(--rule-soft);
      padding: 28px 0 40px;
      margin-top: 20px;
    }
    .ft-nav {
      display: flex;
      flex-wrap: wrap;
      gap: 20px;
      margin-bottom: 14px;
    }
    .ft-nav a {
      font-family: var(--sans);
      font-size: 13px;
      color: var(--ink-2);
    }
    .ft-nav a:hover { color: var(--accent); }
    .ft-also {
      font-family: var(--sans);
      font-size: 13px;
      color: var(--ink-3);
      margin-bottom: 12px;
    }
    .ft-also a { border-bottom: 1px solid var(--rule-faint); }
    .ft-also a:hover { color: var(--accent); }
    .ft-meta {
      font-family: var(--sans);
      font-size: 12px;
      color: var(--ink-3);
      line-height: 1.6;
    }

    /* ── 2-COLUMN CARD ROWS ── */
    .ptl-cards--2col {
      grid-template-columns: 1fr 1fr;
    }
    @media (max-width: 620px) {
      .ptl-cards--2col { grid-template-columns: 1fr; }
    }

    /* ── HORIZONTAL (full-width) CARD ROWS ── */
    .ptl-cards--horiz {
      grid-template-columns: 1fr;
      gap: 10px;
    }
    .ptl-card--horiz {
      display: grid;
      grid-template-columns: 1fr auto;
      gap: 20px;
      align-items: center;
    }
    .ptl-horiz-left { min-width: 0; }
    .ptl-urgency--horiz {
      min-width: 220px;
      max-width: 280px;
      flex-shrink: 0;
      align-self: center;
    }
    /* Action callout variant — white bg, left border, no dot */
    .ptl-urgency--action {
      background: white;
      border-radius: 6px;
      border: 1.5px solid var(--rule-soft);
      padding: 12px 14px 12px 16px;
      font-weight: 500;
      color: var(--ink);
    }
    .ptl-urgency--action.urgency-now  { border-left: 4px solid var(--s5); }
    .ptl-urgency--action.urgency-soon { border-left: 4px solid var(--accent-2); }
    .ptl-urgency--action.urgency-plan { border-left: 4px solid var(--accent); }
    @media (max-width: 600px) {
      .ptl-card--horiz { grid-template-columns: 1fr; gap: 10px; }
      .ptl-urgency--horiz { min-width: 0; max-width: none; }
    }

    /* ── RSV SEASON CHART ── */
    .rsv-chart-wrap {
      background: white;
      border: 1.5px solid var(--rule-soft);
      border-radius: 10px;
      padding: 18px 20px 14px;
      margin-bottom: 20px;
      overflow: hidden;
    }
    .rsv-chart-head {
      display: flex;
      justify-content: space-between;
      align-items: center;
      flex-wrap: wrap;
      gap: 8px;
      margin-bottom: 12px;
    }
    .rsv-chart-eyebrow {
      font-family: var(--sans);
      font-size: 11px;
      font-weight: 700;
      letter-spacing: 0.1em;
      text-transform: uppercase;
      color: var(--ink-3);
    }
    .rsv-chart-tags {
      display: flex;
      gap: 6px;
      flex-wrap: wrap;
    }
    .rsv-chart-tag {
      font-family: var(--sans);
      font-size: 10px;
      font-weight: 700;
      letter-spacing: 0.06em;
      text-transform: uppercase;
      padding: 3px 8px;
      border-radius: 20px;
      background: var(--accent-soft);
      color: var(--accent);
    }
    .rsv-chart-tag--loading {
      background: var(--rule-faint);
      color: var(--ink-3);
    }
    .rsv-chart-tag--muted {
      background: var(--rule-faint);
      color: var(--ink-3);
    }
    #rsvSeasonCanvas {
      display: block;
      width: 100%;
      border-radius: 6px;
      margin-bottom: 10px;
    }
    .rsv-chart-legend {
      display: flex;
      gap: 12px;
      flex-wrap: wrap;
      align-items: center;
    }
    .rsv-leg {
      font-family: var(--sans);
      font-size: 10px;
      color: var(--ink-3);
      display: flex;
      align-items: center;
      gap: 5px;
    }
    .rsv-leg::before {
      content: '';
      display: inline-block;
      width: 10px;
      height: 10px;
      border-radius: 2px;
      background: var(--lc);
      flex-shrink: 0;
    }
    .rsv-chart-legend em {
      font-style: normal;
      font-family: var(--sans);
      font-size: 10px;
      color: var(--ink-3);
      margin-left: auto;
    }
    @media (max-width: 500px) {
      .rsv-chart-legend em { display: none; }
    }

    /* ── INFANT TIMING WIDGET ── */
    .tw-wrap {
      position: relative;
      margin: 14px 0 10px;
    }
    .tw-header {
      display: flex;
      align-items: center;
      gap: 6px;
      flex-wrap: wrap;
      margin-bottom: 8px;
    }
    .tw-tag {
      font-family: var(--sans);
      font-size: 10px;
      font-weight: 700;
      letter-spacing: 0.04em;
      padding: 3px 9px;
      border-radius: 20px;
      white-space: nowrap;
    }
    .tw-tag--go {
      background: var(--accent-soft);
      color: var(--accent);
    }
    .tw-tag--shield {
      background: var(--accent-2-soft);
      color: var(--accent-2);
    }
    .tw-arrow-label {
      font-family: var(--sans);
      font-size: 11px;
      color: var(--ink-3);
      flex-shrink: 0;
    }
    .tw-bar-row {
      display: flex;
      gap: 3px;
      align-items: flex-end;
    }
    .tw-cell {
      flex: 1;
      min-width: 0;
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 4px;
    }
    .tw-bar {
      width: 100%;
      height: 20px;
      border-radius: 3px;
      background: var(--rule-faint);
      transition: background 0.2s;
    }
    .tw-lbl {
      font-family: var(--sans);
      font-size: 8px;
      font-weight: 600;
      color: var(--ink-3);
      letter-spacing: 0.02em;
      text-align: center;
    }
    .tw-cell--szn .tw-bar {
      background: var(--accent-2-soft);
      box-shadow: inset 0 0 0 1px rgba(196,109,46,0.28);
    }
    .tw-cell--today .tw-bar {
      background: rgba(46,122,115,0.15);
      box-shadow: inset 0 0 0 2px var(--accent);
    }
    .tw-cell--today .tw-lbl {
      color: var(--accent);
      font-weight: 800;
    }
    .tw-cell--target .tw-bar {
      background: rgba(196,109,46,0.22);
      box-shadow: inset 0 0 0 2px var(--accent-2);
    }
    .tw-cell--target .tw-lbl {
      color: var(--accent-2);
      font-weight: 800;
    }
    .tw-arc-wrap {
      position: relative;
      pointer-events: none;
      margin-top: 0;   /* flush against bar-row so arc endpoints touch */
    }
    .tw-arc-svg {
      display: block;
      width: 100%;
      overflow: visible;
    }
    .tw-footnote {
      font-family: var(--sans);
      font-size: 11px;
      color: var(--ink-3);
      line-height: 1.5;
      margin-top: 6px;
    }
    .tw-footnote:empty { display: none; }

    /* ── WHAT'S GOING AROUND WIDGET ── */
    .gaw-wrap {
      background: white;
      border: 1.5px solid var(--rule-soft);
      border-radius: 10px;
      padding: 16px 20px 14px;
      margin-bottom: 20px;
    }
    .gaw-head {
      display: flex;
      justify-content: space-between;
      align-items: baseline;
      margin-bottom: 14px;
      flex-wrap: wrap;
      gap: 6px;
    }
    .gaw-eyebrow {
      font-family: var(--sans);
      font-size: 11px;
      font-weight: 700;
      letter-spacing: 0.1em;
      text-transform: uppercase;
      color: var(--ink-3);
    }
    .gaw-loc {
      font-family: var(--sans);
      font-size: 11px;
      color: var(--ink-3);
    }
    .gaw-body {
      display: flex;
      align-items: center;
      gap: 20px;
    }
    .gaw-canvas-wrap {
      flex-shrink: 0;
    }
    .gaw-canvas {
      display: block;
    }
    .gaw-list {
      flex: 1;
      display: flex;
      flex-direction: column;
      gap: 8px;
      min-width: 0;
    }
    .gaw-row {
      display: grid;
      grid-template-columns: 10px 42px 40px 62px;
      gap: 8px;
      align-items: center;
    }
    .gaw-row--dominant .gaw-sig-name {
      font-weight: 700;
      color: var(--ink);
    }
    .gaw-sig-dot {
      width: 8px;
      height: 8px;
      border-radius: 50%;
      justify-self: center;
    }
    .gaw-sig-name {
      font-family: var(--sans);
      font-size: 13px;
      font-weight: 600;
      color: var(--ink-2);
    }
    .gaw-sig-bars {
      display: flex;
      gap: 2px;
      align-items: center;
    }
    .gaw-bar {
      display: inline-block;
      width: 5px;
      height: 14px;
      border-radius: 2px;
      background: var(--rule-faint);
    }
    .gaw-bar--on {
      background: var(--bc, var(--accent));
    }
    .gaw-sig-level {
      font-family: var(--sans);
      font-size: 11px;
      color: var(--ink-3);
      white-space: nowrap;
    }
    .gaw-verdict {
      font-family: var(--sans);
      font-size: 13px;
      color: var(--ink-2);
      line-height: 1.5;
      border-top: 1px solid var(--rule-faint);
      padding-top: 10px;
      margin-top: 12px;
    }
    @media (max-width: 480px) {
      .gaw-body { flex-direction: column; align-items: flex-start; gap: 14px; }
      .gaw-canvas-wrap { display: flex; justify-content: center; width: 100%; }
    }

    /* ── SYMPTOM SECTION TYPOGRAPHY ── */
    .symptom-intro {
      font-family: var(--sans);
      font-size: 14px;
      color: var(--ink-2);
      line-height: 1.6;
      margin-bottom: 16px;
    }
    .symptom-disclaimer {
      font-family: var(--sans);
      font-size: 12px;
      color: var(--ink-3);
      line-height: 1.5;
      border-top: 1px solid var(--rule-faint);
      padding-top: 12px;
      margin-top: 14px;
    }
    .symptom-disclaimer strong { color: var(--ink-2); }

    /* ── TRIAGE BADGES ── */
    .triage-row {
      grid-template-columns: 50px 1fr;
    }
    .triage-badge {
      font-family: var(--sans);
      font-size: 9px;
      font-weight: 800;
      letter-spacing: 0.08em;
      text-transform: uppercase;
      padding: 4px 6px;
      border-radius: 4px;
      text-align: center;
      background: var(--rule-faint);
      color: var(--ink-3);
      align-self: start;
      margin-top: 1px;
      white-space: nowrap;
    }
    .triage-badge--urgent {
      background: rgba(200,104,32,0.12);
      color: var(--s4);
    }
    .triage-badge--er {
      background: rgba(160,24,40,0.10);
      color: var(--s5);
    }

    /* ── PREGNANT MILESTONE TIMELINE ── */
    .preg-timeline {
      display: flex;
      align-items: center;
      gap: 0;
      margin: 14px 0 12px;
      flex-wrap: nowrap;
    }
    .preg-step {
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 6px;
      flex-shrink: 0;
    }
    .preg-dot {
      width: 14px;
      height: 14px;
      border-radius: 50%;
      border: 2px solid white;
      box-shadow: 0 0 0 2px currentColor;
      flex-shrink: 0;
    }
    .preg-dot--action {
      background: var(--accent);
      color: var(--accent);
    }
    .preg-dot--mid {
      background: var(--ink-3);
      color: var(--ink-3);
    }
    .preg-dot--target {
      background: var(--accent-2);
      color: var(--accent-2);
    }
    .preg-step-body {
      text-align: center;
    }
    .preg-lbl {
      font-family: var(--sans);
      font-size: 11px;
      font-weight: 700;
      color: var(--ink);
      white-space: nowrap;
    }
    .preg-sub {
      font-family: var(--sans);
      font-size: 10px;
      color: var(--ink-3);
      white-space: nowrap;
    }
    .preg-line {
      flex: 1;
      height: 2px;
      background: var(--rule-soft);
      margin-bottom: 28px; /* aligns with dot center */
      min-width: 12px;
    }
    @media (max-width: 420px) {
      .preg-lbl { font-size: 10px; }
      .preg-sub  { font-size: 9px; }
    }

    /* ── PROSE PAGES ── */
    .page { padding: 40px 0; }
    .page-eyebrow {
      font-family: var(--sans);
      font-size: 11px;
      font-weight: 700;
      letter-spacing: 0.12em;
      text-transform: uppercase;
      color: var(--ink-3);
      margin-bottom: 10px;
    }
    .page h1 {
      font-family: var(--serif);
      font-size: clamp(26px, 4vw, 38px);
      font-weight: 800;
      color: var(--ink);
      margin-bottom: 8px;
      letter-spacing: -0.01em;
    }
    .page-meta {
      font-family: var(--sans);
      font-size: 13px;
      color: var(--ink-3);
      margin-bottom: 32px;
      border-bottom: 1px solid var(--rule-faint);
      padding-bottom: 20px;
    }
    .page h2 {
      font-family: var(--serif);
      font-size: 20px;
      font-weight: 700;
      color: var(--ink);
      margin: 32px 0 12px;
    }
    .page h3 {
      font-family: var(--sans);
      font-size: 15px;
      font-weight: 700;
      color: var(--ink);
      margin: 20px 0 8px;
    }
    .page p {
      font-size: 16px;
      line-height: 1.65;
      color: var(--ink-2);
      margin-bottom: 16px;
    }
    .page ul, .page ol {
      margin: 0 0 16px 24px;
    }
    .page li {
      font-size: 16px;
      line-height: 1.65;
      color: var(--ink-2);
      margin-bottom: 6px;
    }
    .page .callout {
      border-left: 3px solid var(--accent);
      padding: 14px 18px;
      background: var(--accent-soft);
      border-radius: 0 6px 6px 0;
      margin: 20px 0;
    }
    .page .callout p { margin: 0; font-size: 15px; }
    .page .warning {
      border-left: 3px solid var(--s4);
      padding: 14px 18px;
      background: rgba(200,104,32,0.06);
      border-radius: 0 6px 6px 0;
      margin: 20px 0;
    }
    .page .warning p { margin: 0; font-size: 15px; }

    /* ── GUIDES INDEX ── */
    /* ── GUIDES PAGE — SECTIONS ── */
    .guides-section {
      padding-bottom: 40px;
      margin-bottom: 40px;
      border-bottom: 1px solid var(--rule-soft);
    }
    .guides-section:last-child { border-bottom: none; margin-bottom: 0; }

    .guides-section-head {
      display: flex;
      align-items: center;
      gap: 20px;
      margin-bottom: 24px;
    }
    .guides-section-portrait {
      width: 80px !important;
      height: 80px !important;
      min-width: 80px;
      max-width: 80px;
      border-radius: 50%;
      object-fit: cover;
      flex-shrink: 0;
      flex-grow: 0;
      display: block;
      mix-blend-mode: multiply;
    }
    .guides-section-eyebrow {
      font-family: var(--sans);
      font-size: 10px;
      font-weight: 700;
      letter-spacing: 0.12em;
      text-transform: uppercase;
      color: var(--accent);
      margin-bottom: 4px;
    }
    .guides-section-title {
      font-family: var(--serif);
      font-size: 20px;
      font-weight: 700;
      color: var(--ink);
      line-height: 1.2;
      margin-bottom: 4px;
    }
    .guides-section-sub {
      font-family: var(--sans);
      font-size: 13px;
      color: var(--ink-3);
      line-height: 1.5;
    }
    /* Audience accent overrides */
    .guides-section--expectant .guides-section-eyebrow { color: var(--accent-2); }
    .guides-section--expectant .guide-cat              { color: var(--accent-2); }
    .guides-section--adults    .guides-section-eyebrow { color: #6e8480; }
    .guides-section--adults    .guide-cat              { color: #6e8480; }
    .guides-section--immune    .guides-section-eyebrow { color: #6e8480; }
    .guides-section--immune    .guide-cat              { color: #6e8480; }

    /* ── GUIDES GRID ── */
    .guides-grid {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      gap: 14px;
    }
    @media (max-width: 580px) {
      .guides-grid { grid-template-columns: 1fr; }
    }

    /* Regular card */
    .guide-card {
      border: 1px solid var(--rule-soft);
      border-radius: 8px;
      padding: 20px 22px;
      background: white;
      display: block;
      transition: border-color 0.15s, box-shadow 0.15s;
    }
    .guide-card:hover { border-color: var(--accent); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }

    /* Featured card — spans full width, image on right */
    .guide-card--featured {
      grid-column: 1 / -1;
      display: grid;
      grid-template-columns: 1fr auto;
      gap: 0;
      overflow: hidden;
      padding: 0;
      align-items: stretch;
    }
    .guide-card--featured:hover { border-color: var(--accent); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
    .guide-featured-text {
      padding: 22px 24px;
    }
    .guide-featured-img {
      width: 220px;
      object-fit: cover;
      display: block;
      border-radius: 0 8px 8px 0;
      flex-shrink: 0;
    }
    @media (max-width: 580px) {
      .guide-card--featured { grid-template-columns: 1fr; }
      .guide-featured-img { width: 100%; height: 160px; border-radius: 0 0 8px 8px; }
    }

    /* Coming soon stub card */
    .guide-card--stub {
      opacity: 0.6;
      cursor: default;
      pointer-events: none;
      border-style: dashed;
    }
    .guide-stub-badge {
      display: inline-block;
      font-family: var(--sans);
      font-size: 9px;
      font-weight: 700;
      letter-spacing: 0.08em;
      text-transform: uppercase;
      background: var(--rule-faint);
      color: var(--ink-3);
      padding: 2px 7px;
      border-radius: 20px;
      margin-bottom: 8px;
    }

    .guide-cat {
      font-family: var(--sans);
      font-size: 10px;
      font-weight: 700;
      letter-spacing: 0.1em;
      text-transform: uppercase;
      color: var(--accent);
      margin-bottom: 6px;
    }
    .guide-title {
      font-family: var(--serif);
      font-size: 16px;
      font-weight: 700;
      color: var(--ink);
      margin-bottom: 6px;
      line-height: 1.3;
    }
    .guide-blurb {
      font-family: var(--sans);
      font-size: 13px;
      color: var(--ink-2);
      line-height: 1.5;
    }

    /* ── RESPONSIVE ── */
    @media (max-width: 620px) {
      .shell { padding: 0 20px; }

      /* ── Hero: stack illustration above text on mobile ── */
      .hero {
        flex-direction: column;
        align-items: stretch;
        padding: 0;
        min-height: auto;
      }
      /* Illustration: pull out of absolute positioning, sit above content */
      .hero-illustration {
        display: block;
        position: relative;
        width: 100%;
        height: 260px;
        right: auto;
        top: auto;
        bottom: auto;
        order: -1;
      }
      /* Gradient fades bottom of illustration into paper below */
      .hero-illustration::before {
        top: auto;
        left: 0;
        right: 0;
        bottom: 0;
        width: 100%;
        height: 55%;
        background: linear-gradient(to top, var(--paper) 0%, transparent 100%);
      }
      /* Images fill illustration container */
      .hero-img {
        top: 0;
        transform: none;
        width: 100%;
        height: 100%;
        object-fit: contain;
        object-position: center bottom;
      }
      .immuno-split { grid-template-columns: 1fr; }
      .immuno-illustration { display: none; }
      .symptom-split { grid-template-columns: 1fr; }
      .symptom-illustration { display: none; }
      .homecare-split { grid-template-columns: 1fr; }
      .homecare-illustration { display: none; }
      .doctor-cta { flex-direction: column; }
      .mast-date { display: none; }
      .hbid-meter-seg { height: 6px; }
    }

    /* ── CONTACT FORM ── */
    .contact-form {
      display: grid;
      gap: 16px;
      max-width: 500px;
      margin-top: 24px;
    }
    .contact-form label {
      font-family: var(--sans);
      font-size: 11px;
      font-weight: 600;
      letter-spacing: 0.1em;
      text-transform: uppercase;
      color: var(--ink-3);
      margin-bottom: 4px;
      display: block;
    }
    .contact-form input,
    .contact-form textarea {
      width: 100%;
      font-family: var(--serif);
      font-size: 16px;
      padding: 11px 14px;
      background: #fff;
      border: 1px solid var(--ink);
      color: var(--ink);
      border-radius: 0;
      outline: none;
      -webkit-appearance: none;
      box-sizing: border-box;
    }
    .contact-form input:focus,
    .contact-form textarea:focus {
      border-color: var(--accent);
      box-shadow: 0 0 0 2px rgba(46,122,115,0.14);
    }
    .contact-form textarea { min-height: 140px; resize: vertical; }
    .contact-form button {
      justify-self: start;
      font-family: var(--sans);
      font-size: 12px;
      font-weight: 700;
      letter-spacing: 0.12em;
      text-transform: uppercase;
      background: var(--accent);
      color: #fff;
      border: 1px solid var(--accent);
      padding: 12px 22px;
      cursor: pointer;
    }
    .contact-form button:hover { background: #1f5550; border-color: #1f5550; }
    .contact-form button:disabled { opacity: 0.6; cursor: default; }