:root { --ink:#17202a; --paper:#f7f8f6; --panel:#fff; --teal:#0b6667; --red:#a23b32; --line:#d7dedb; --muted:#53615f; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--ink); background:var(--paper); font:17px/1.62 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; }
a { color:var(--teal); }
a:focus-visible, summary:focus-visible { outline:3px solid #e39a35; outline-offset:3px; }
.skip { position:absolute; left:1rem; top:-4rem; background:#fff; padding:.7rem; z-index:20; }
.skip:focus { top:.5rem; }
.nav { position:sticky; top:0; z-index:10; background:#17202a; color:#fff; padding:.65rem 4vw; display:flex; gap:1rem; overflow:auto; }
.nav a { color:#fff; white-space:nowrap; text-decoration:none; }
.hero { min-height:min(900px,100vh); display:grid; grid-template-columns:1.05fr .95fr; background:#102c31; color:#fff; }
.hero-copy { padding:clamp(2rem,5vw,5rem); align-self:center; max-width:800px; }
.eyebrow { color:#9ad8d0; font-weight:700; }
.hero h1 { font:700 clamp(2.4rem,5vw,5.4rem)/1.02 Georgia,serif; margin:.2rem 0 1rem; letter-spacing:0; }
.hero-media { min-height:460px; }
.hero img { width:100%; height:100%; object-fit:cover; display:block; }
.hero-media .ai-note { color:#d6e4df; margin:0; padding:.65rem 1rem; }
.meta { color:#d6e4df; }
.actions { display:flex; gap:.8rem; flex-wrap:wrap; margin:1.2rem 0; }
.button { display:inline-block; padding:.7rem 1rem; background:#f3b562; color:#17202a; text-decoration:none; font-weight:800; border-radius:4px; }
.button.secondary { background:transparent; color:#fff; border:1px solid #b9d1cb; }
.guard { border-left:4px solid #f3b562; padding-left:1rem; }
.wrap { max-width:1120px; margin:auto; padding:4rem 1.2rem; }
h2 { font:700 clamp(1.8rem,3vw,2.7rem)/1.1 Georgia,serif; letter-spacing:0; }
h3 { font-size:1.25rem; letter-spacing:0; }
.grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1rem; }
.card, details, .utility { background:var(--panel); border:1px solid var(--line); border-radius:6px; padding:1.1rem; }
summary { font-weight:800; cursor:pointer; }
.label { font-weight:800; color:var(--red); }
table { width:100%; border-collapse:collapse; background:#fff; }
caption { text-align:left; font-weight:700; padding:.7rem 0; }
th, td { text-align:left; vertical-align:top; border:1px solid var(--line); padding:.7rem; }
th { background:#eaf1ee; }
.table-scroll { overflow:auto; }
.recommendation { padding:1.5rem 0; border-top:1px solid var(--line); }
.recommendation h3 { color:var(--teal); }
.checks { display:grid; gap:.7rem; }
.checks label { background:#fff; border:1px solid var(--line); padding:.8rem; }
.source-list li { margin:.5rem 0; }
.ai-note, .fine { color:var(--muted); font-size:.92rem; }
footer { background:#17202a; color:#dfe9e6; padding:2rem; }
footer a { color:#9ad8d0; }
@media (max-width:760px) {
  body { font-size:16px; }
  .nav { font-size:.86rem; }
  .hero { display:flex; flex-direction:column; min-height:auto; }
  .hero-copy { padding:1.35rem 1rem 1rem; }
  .hero h1 { font-size:2.45rem; }
  .hero-media { min-height:230px; order:-1; }
  .hero img { height:230px; }
  .grid { grid-template-columns:1fr; }
  .wrap { padding:3rem 1rem; }
  table.details, table.details caption, table.details tbody, table.details tr, table.details th, table.details td { display:block; width:100%; }
  table.details caption { padding:.7rem 0 1rem; }
  table.details thead { position:absolute; left:-9999px; }
  table.details tr { border:1px solid var(--line); margin-bottom:1rem; background:#fff; }
  table.details th, table.details td { border:0; border-bottom:1px solid var(--line); }
  table.details td::before { content:attr(data-label); display:block; font-weight:800; color:var(--teal); margin-bottom:.2rem; }
}