@import url('https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,400;9..144,500;9..144,600;9..144,700&family=Public+Sans:wght@400;500;600;700&family=IBM+Plex+Mono:wght@400;500&display=swap');

  :root{
    --parchment: #ECE4D3;
    --parchment-dark: #E1D6BE;
    --ink: #241B15;
    --oak: #4A3826;
    --honey: #C17A2E;
    --honey-deep: #9C5E1F;
    --bottle: #2F4A3E;
    --bottle-light: #3F6152;
    --rust: #A64B2A;
    --line: rgba(36,27,21,0.16);
  }

  *{box-sizing:border-box;}
  html{scroll-behavior:smooth;}
  body{
    margin:0;
    background:var(--parchment);
    color:var(--ink);
    font-family:'Public Sans', sans-serif;
    line-height:1.55;
  }
  h1,h2,h3{
    font-family:'Fraunces', serif;
    font-weight:600;
    margin:0;
    color:var(--ink);
  }
  a{color:inherit;}
  .wrap{max-width:1080px;margin:0 auto;padding:0 24px;}

  /* ---------- Disclosure bar ---------- */
  .disclosure{
    background:var(--ink);
    color:var(--parchment-dark);
    font-size:12.5px;
    text-align:center;
    padding:8px 16px;
    font-family:'IBM Plex Mono', monospace;
    letter-spacing:0.01em;
  }
  .disclosure a{text-decoration:underline;color:var(--parchment-dark);}

  /* ---------- Header ---------- */
  header{
    padding:28px 0 0;
    border-bottom:1px solid var(--line);
  }
  .brand-row{
    display:flex;
    justify-content:space-between;
    align-items:flex-end;
    padding-bottom:20px;
    gap:20px;
    flex-wrap:wrap;
  }
  .brand{
    font-family:'Fraunces', serif;
    font-size:22px;
    font-weight:700;
    display:flex;
    align-items:center;
    gap:10px;
  }
  nav{
    display:flex;
    gap:24px;
    font-size:14.5px;
    font-weight:500;
  }
  nav a{text-decoration:none;border-bottom:1px solid transparent;}
  nav a:hover{border-bottom-color:var(--honey-deep);}

  /* ---------- Hero ---------- */
  .hero{
    padding:56px 0 48px;
    display:grid;
    grid-template-columns:1.15fr 0.85fr;
    gap:48px;
    align-items:center;
  }
  .hero h1{
    font-size:clamp(34px,4.6vw,54px);
    line-height:1.08;
    max-width:15ch;
  }
  .hero p.lede{
    margin-top:18px;
    font-size:17px;
    max-width:46ch;
    color:var(--oak);
  }
  .hero-meta{
    margin-top:24px;
    display:flex;
    gap:28px;
    font-family:'IBM Plex Mono', monospace;
    font-size:12.5px;
    color:var(--oak);
  }
  .hero-meta div{border-left:2px solid var(--honey);padding-left:10px;}
  .hero-meta b{display:block;color:var(--ink);font-size:14px;}

  .airlock-art{width:100%;max-width:340px;justify-self:end;}

  /* ---------- Section headings ---------- */
  .section-head{
    padding:44px 0 20px;
    display:flex;
    justify-content:space-between;
    align-items:baseline;
    border-bottom:1px solid var(--line);
    margin-bottom:28px;
  }
  .section-head h2{font-size:26px;}
  .section-head span{
    font-family:'IBM Plex Mono', monospace;
    font-size:12px;
    color:var(--oak);
  }

  /* ---------- Top picks (asymmetric grid) ---------- */
  .picks-grid{
    display:grid;
    grid-template-columns:1.3fr 1fr 1fr;
    gap:20px;
  }
  .pick-card{
    background:var(--parchment-dark);
    border:1px solid var(--line);
    padding:22px;
    display:flex;
    flex-direction:column;
    gap:12px;
  }
  .pick-card.lead{
    grid-row:span 1;
    background:var(--ink);
    color:var(--parchment);
    border-color:var(--ink);
  }
  .pick-card.lead .badge{color:var(--honey);}
  .pick-card.lead .spec-row{border-color:rgba(236,228,211,0.18);}
  .pick-card.lead .spec-row span:last-child{color:var(--parchment-dark);}
  .badge{
    font-family:'IBM Plex Mono', monospace;
    font-size:11.5px;
    letter-spacing:0.02em;
    color:var(--honey-deep);
  }
  .pick-card h3{font-size:19px;line-height:1.25;}
  .pick-card .why{font-size:14px;color:var(--oak);}
  .pick-card.lead .why{color:#D8CFBB;}
  .specs{margin-top:auto;}
  .spec-row{
    display:flex;
    justify-content:space-between;
    font-size:12.5px;
    font-family:'IBM Plex Mono', monospace;
    padding:6px 0;
    border-top:1px solid var(--line);
  }
  .spec-row span:first-child{color:var(--oak);}
  .pick-card.lead .spec-row span:first-child{color:#B7AD97;}
  .buy-btn{
    margin-top:8px;
    display:inline-block;
    text-align:center;
    background:var(--honey-deep);
    color:#fff;
    text-decoration:none;
    padding:11px 16px;
    font-size:14px;
    font-weight:600;
    border:1px solid var(--honey-deep);
    transition:background .15s ease, color .15s ease;
  }
  .buy-btn:hover{background:transparent;color:var(--honey-deep);}
  .pick-card.lead .buy-btn{background:var(--honey);border-color:var(--honey);color:var(--ink);}
  .pick-card.lead .buy-btn:hover{background:transparent;color:var(--honey);}

  /* ---------- Category listicle rows ---------- */
  .category-block{padding-bottom:8px;}
  .category-block .section-head{padding-top:56px;}
  .cat-desc{
    font-size:14.5px;
    color:var(--oak);
    max-width:60ch;
    margin:-10px 0 24px;
  }
  .item-row{
    display:grid;
    grid-template-columns:34px 1.6fr 1fr auto;
    gap:20px;
    align-items:center;
    padding:18px 0;
    border-top:1px solid var(--line);
  }
  .item-row:last-child{border-bottom:1px solid var(--line);}
  .item-rank{
    font-family:'Fraunces', serif;
    font-size:20px;
    color:var(--honey-deep);
  }
  .item-name{font-size:16px;font-weight:600;}
  .item-name small{
    display:block;
    font-weight:400;
    font-size:13px;
    color:var(--oak);
    margin-top:3px;
  }
  .item-specs{
    font-family:'IBM Plex Mono', monospace;
    font-size:12px;
    color:var(--oak);
    display:flex;
    gap:14px;
    flex-wrap:wrap;
  }
  .item-price{
    text-align:right;
    font-family:'IBM Plex Mono', monospace;
    font-size:13px;
  }
  .item-price .buy-btn{
    margin-top:6px;
    padding:8px 14px;
    font-size:13px;
  }

  .picks-grid-4{grid-template-columns:repeat(4,1fr);margin-bottom:32px;}
  @media (max-width:980px){
    .picks-grid-4{grid-template-columns:1fr 1fr;}
  }
  @media (max-width:820px){
    .picks-grid-4{grid-template-columns:1fr;}
  }

  /* ---------- Guide cards ---------- */
  .guide-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:20px;
  }
  .guide-card{
    background:var(--parchment-dark);
    border:1px solid var(--line);
    padding:20px;
  }
  .guide-card h3{font-size:16px;margin-bottom:9px;line-height:1.25;}
  .guide-card p{font-size:13.5px;color:var(--oak);margin:0 0 12px;}
  .guide-tags{
    font-family:'IBM Plex Mono', monospace;
    font-size:10.5px;
    color:var(--honey-deep);
    letter-spacing:0.01em;
  }

  /* ---------- Comparison table ---------- */
  table.compare{
    width:100%;
    border-collapse:collapse;
    font-size:13.5px;
  }
  table.compare th, table.compare td{
    text-align:left;
    padding:12px 14px;
    border-bottom:1px solid var(--line);
  }
  table.compare th{
    font-family:'IBM Plex Mono', monospace;
    font-weight:500;
    font-size:11.5px;
    color:var(--oak);
    border-bottom:2px solid var(--ink);
  }
  table.compare tr:hover td{background:var(--parchment-dark);}
  table.compare .buy-btn{padding:7px 12px;font-size:12.5px;}

  /* ---------- Footer ---------- */
  footer{
    margin-top:64px;
    border-top:1px solid var(--line);
    padding:32px 0 40px;
    font-size:13px;
    color:var(--oak);
  }
  footer .disc-full{max-width:70ch;}

  @media (max-width:820px){
    .hero{grid-template-columns:1fr;}
    .airlock-art{justify-self:start;max-width:220px;}
    .picks-grid{grid-template-columns:1fr;}
    .guide-grid{grid-template-columns:1fr;}
    .item-row{grid-template-columns:24px 1fr;grid-template-areas:"rank name" ". specs" ". price";row-gap:6px;}
    .item-specs{grid-area:specs;}
    .item-price{grid-area:price;text-align:left;}
    table.compare{display:block;overflow-x:auto;}
  }

/* ---------- Simple content pages (About / Privacy) ---------- */
.page-hero{padding:48px 0 8px;}
.page-hero h1{font-size:clamp(30px,4vw,42px);max-width:20ch;}
.page-hero p.lede{margin-top:14px;font-size:16px;max-width:60ch;color:var(--oak);}
.prose{max-width:70ch;padding:24px 0 56px;font-size:15.5px;}
.prose h2{font-size:20px;margin:34px 0 12px;}
.prose h2:first-child{margin-top:0;}
.prose p{margin:0 0 16px;color:var(--oak);}
.prose ul{margin:0 0 16px;padding-left:20px;color:var(--oak);}
.prose li{margin-bottom:6px;}
.prose strong{color:var(--ink);}
.updated-tag{font-family:'IBM Plex Mono', monospace;font-size:12px;color:var(--oak);margin-bottom:24px;display:block;}