:root{
    --bg:#ffffff;
    --text:#111827;
    --muted:#4b5563;
    --border:#e5e7eb;
  
    --ink:#0f172a;
    --accent:#1f6feb;
  
    --soft-blue:#eff6ff;
    --soft-amber:#fff7ed;
    --soft-green:#ecfdf5;
    --soft-slate:#f8fafc;
  
    --shadow:0 10px 30px rgba(15, 23, 42, .06);
    --radius:16px;
  }
  
  .hero{
    border:1px solid var(--border);
    border-radius:var(--radius);
    padding:22px 18px;
    box-shadow:var(--shadow);
    background:#fff;
  }
  
  .kicker{
    font-weight:800;
    letter-spacing:.04em;
    text-transform:uppercase;
    color:var(--muted);
    font-size:12px;
    margin:0 0 6px;
  }
  
  .meta{
    display:flex;
    flex-wrap:wrap;
    gap:10px;
    margin-top:10px;
  }
  
  .badge{
    display:inline-flex;
    align-items:center;
    gap:8px;
    padding:8px 12px;
    border-radius:999px;
    border:1px solid var(--border);
    background:var(--soft-slate);
    color:var(--muted);
    font-size:13px;
  }
  .badge b{color:var(--ink)}
  
  .lede{
    margin:14px 0 0;
    color:var(--text);
    font-size:17px;
  }
  
  .section{
    margin-top:22px;
    padding:18px 16px;
    border:1px solid var(--border);
    border-radius:var(--radius);
    background:#fff;
    box-shadow:var(--shadow);
  }
    
  .callout{
    border:1px solid var(--border);
    border-radius:14px;
    padding:12px 12px;
    margin:12px 0;
    background:var(--soft-slate);
  }
  .callout.blue{background:var(--soft-blue)}
  .callout.amber{background:var(--soft-amber)}
  .callout.green{background:var(--soft-green)}
  .callout strong{color:var(--ink)}
  
  .shade{
    border:1px solid var(--border);
    border-radius:14px;
    padding:12px 12px;
    margin:12px 0;
  }
  .shade.blue{background:var(--soft-blue)}
  .shade.amber{background:var(--soft-amber)}
  .shade.green{background:var(--soft-green)}
  
  .grid{
    display:grid;
    grid-template-columns:1fr;
    gap:12px;
  }
  
  .card{
    border:1px solid var(--border);
    border-radius:14px;
    padding:12px 12px;
    background:#fff;
    position:relative;
  }
  
  .card .label{
    font-size: 12px !important;
    color:var(--muted);
    font-weight:800;
    display:flex;
    align-items:center;
    justify-content:center;
    text-transform:uppercase;
    letter-spacing:.04em;
    margin:0 !important;
    background: var(--soft-blue);
  }
  
  .card .value{
    font-size:18px;
    line-height:1.25;
    margin:0;
    color:var(--ink);
    font-weight:900;
  }
  
  .card .note{
    margin:6px 0 0;
    color:var(--muted);
    font-size:13px;
  }
  
  .highlight{
    padding:4px 12px;
    border-radius:25px;
    border:1px solid var(--border);
    font-weight:800;
    display:inline-block;
    color:var(--ink);
    background:#fff;
    text-align:center;
  }
  .hl-blue{background:var(--soft-blue)}
  .hl-amber{background:var(--soft-amber)}
  .hl-green{background:var(--soft-green)}
  
  .table-wrap{
    border:1px solid var(--border);
    border-radius:14px;
    background:#fff;
  }
  
  .small{color:var(--muted);font-size:13px}
  
  .sources{
    margin:10px 0 0 18px;
    padding:0;
  }
  .sources li{margin:10px 0}
  .sources a{font-weight:800}
  .source-note{color:var(--muted);font-weight:500}
  
  /* FAQ (no JS) */
  .faq-list{
    margin-top: 10px;
  }
  details.faq{
    border:1px solid var(--border);
    border-radius:14px;
    background: var(--soft-slate);
    padding: 0;
    margin: 10px 0;
    overflow:hidden;
  }
  details.faq:nth-child(3n+1){ background: var(--soft-blue); }
  details.faq:nth-child(3n+2){ background: var(--soft-amber); }
  details.faq:nth-child(3n+3){ background: var(--soft-green); }
  
  details.faq summary{
    list-style:none;
    cursor:pointer;
    padding: 12px 12px;
    font-weight:900;
    color: var(--ink);
    display:flex;
    align-items:flex-start;
    gap:10px;
  }
  details.faq summary::-webkit-details-marker{ display:none; }
  
  .faq-icon{
    width:22px;
    height:22px;
    border:1px solid var(--border);
    border-radius:999px;
    background:#fff;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    font-size:14px;
    line-height:0;
    flex: 0 0 auto;
    margin-top: 1px;
  }
  details.faq[open] .faq-icon{ background:#fff; }
  
  .faq-body{
    padding: 0 12px 12px;
    color: var(--text);
  }
  .faq-body p{ margin: 8px 0; }