:root{
    --velvet:      #1C332A;   /* deep jewelry-box green */
    --velvet-deep: #12241C;
    --parchment:   #F6F1E6;   /* warm ivory paper */
    --parchment-2: #EFE7D6;
    --gold:        #B9924B;   /* engraved gold */
    --gold-bright: #DCB878;
    --gold-pale:   #E9D9B4;
    --ink:         #262218;
    --wine:        #6E2B33;   /* communion-wine accent, seals only */
    --hairline:    rgba(185,146,75,.35);

    --font-display:"Cormorant Garamond", Georgia, serif;
    --font-body:   "Lora", Georgia, serif;
    --font-utility:"Jost", "Segoe UI", sans-serif;

    --measure: 62ch;
    --pad: clamp(1.25rem, 4vw, 3rem);
  }

  *{ margin:0; padding:0; box-sizing:border-box; }
  html{ scroll-behavior:smooth; }
  @media (prefers-reduced-motion: reduce){
    html{ scroll-behavior:auto; }
    *, *::before, *::after{ animation:none !important; transition:none !important; }
  }

  body{
    font-family:var(--font-body);
    background:var(--parchment);
    color:var(--ink);
    line-height:1.7;
    font-size:1.0625rem;
  }

  a{ color:var(--velvet); text-decoration-color:var(--gold); text-underline-offset:3px; }
  a:focus-visible, button:focus-visible, input:focus-visible{
    outline:2px solid var(--gold); outline-offset:3px; border-radius:2px;
  }

  .eyebrow{
    font-family:var(--font-utility);
    font-size:.72rem; letter-spacing:.28em; text-transform:uppercase;
    color:var(--gold);
  }

  h1,h2,h3{ font-family:var(--font-display); font-weight:600; line-height:1.15; color:var(--velvet); }
  .on-velvet h1, .on-velvet h2{ color:var(--parchment); }

  /* ---------- header ---------- */
  header.site{
    position:sticky; top:0; z-index:50;
    background:var(--velvet);
    border-bottom:1px solid var(--hairline);
  }
  .site-inner{
    max-width:1100px; margin:0 auto; padding:.9rem var(--pad);
    display:flex; align-items:center; justify-content:space-between; gap:1rem;
  }
  .brand{
    display:flex; align-items:center; gap:.65rem;
    font-family:var(--font-display); font-size:1.35rem; font-weight:600;
    color:var(--gold-pale); text-decoration:none; letter-spacing:.02em;
  }
  .brand svg{ flex:none; }
  nav.primary{ display:flex; gap:1.6rem; }
  nav.primary a{
    font-family:var(--font-utility); font-size:.8rem; letter-spacing:.18em;
    text-transform:uppercase; color:var(--gold-pale); text-decoration:none;
  }
  nav.primary a:hover{ color:var(--gold-bright); }
  @media (max-width:640px){ nav.primary{ display:none; } }

  /* ---------- hero ---------- */
  .hero{
    background:
      radial-gradient(ellipse 90% 70% at 50% 115%, rgba(185,146,75,.18), transparent 60%),
      linear-gradient(180deg, var(--velvet) 0%, var(--velvet-deep) 100%);
    color:var(--parchment);
    text-align:center;
    padding:clamp(4rem,10vw,7.5rem) var(--pad) clamp(4rem,9vw,6.5rem);
  }
  .hero .cross-mark{
    margin:0 auto 2.2rem; display:block;
    filter:drop-shadow(0 0 14px rgba(220,184,120,.45));
  }
  .cross-mark .glint{ animation:glintSweep 5.5s ease-in-out infinite; }
  @keyframes glintSweep{
    0%, 55%{ transform:skewX(-20deg) translateX(0); }
    80%, 100%{ transform:skewX(-20deg) translateX(160px); }
  }
  .hero h1{
    font-size:clamp(2.4rem, 6vw, 4.2rem);
    max-width:18ch; margin:0 auto .9rem;
  }
  .hero p.lede{
    font-size:clamp(1.05rem, 2vw, 1.25rem);
    font-style:italic; color:var(--gold-pale);
    max-width:46ch; margin:0 auto 2.4rem;
  }
  .btn{
    display:inline-block; font-family:var(--font-utility);
    font-size:.82rem; letter-spacing:.22em; text-transform:uppercase;
    padding:1rem 2.2rem; text-decoration:none;
    border:1px solid var(--gold); color:var(--gold-bright);
    background:transparent; transition:background .25s, color .25s;
  }
  .btn:hover{ background:var(--gold); color:var(--velvet-deep); }
  .btn.solid{ background:var(--gold); color:var(--velvet-deep); }
  .btn.solid:hover{ background:var(--gold-bright); }

  /* ---------- disclosure ribbon (FTC) ---------- */
  .disclosure{
    background:var(--parchment-2);
    border-bottom:1px solid var(--hairline);
    font-family:var(--font-utility); font-size:.78rem; letter-spacing:.02em;
    text-align:center; padding:.7rem var(--pad); color:#5a5140;
  }

  /* ---------- sections ---------- */
  section{ padding:clamp(3.5rem,8vw,6rem) var(--pad); }
  .measure{ max-width:var(--measure); margin-left:auto; margin-right:auto; }
  .wide{ max-width:1100px; margin-left:auto; margin-right:auto; }
  .section-head{ text-align:center; max-width:60ch; margin:0 auto 3rem; }
  .section-head h2{ font-size:clamp(1.9rem,4vw,2.8rem); margin:.4rem 0 .8rem; }

  .divider{
    display:flex; align-items:center; justify-content:center; gap:1rem;
    color:var(--gold); margin:0 auto;
  }
  .divider::before, .divider::after{
    content:""; height:1px; width:min(120px,25vw); background:var(--hairline);
  }

  /* ---------- guide primer ---------- */
  .primer{ background:var(--parchment); }
  .primer-grid{
    display:grid; gap:1.5rem; margin-top:2.5rem;
    grid-template-columns:repeat(auto-fit, minmax(230px, 1fr));
  }
  .primer-card{
    border:1px solid var(--hairline); padding:1.6rem 1.4rem; background:#FBF8F0;
  }
  .primer-card h3{ font-size:1.25rem; margin:.5rem 0 .5rem; }
  .primer-card p{ font-size:.95rem; }

  /* ---------- tier bands & product cards ---------- */
  .tier{ border-top:1px solid var(--hairline); }
  .tier:nth-of-type(odd){ background:var(--parchment-2); }
  .tier-head{ text-align:center; margin-bottom:2.6rem; }
  .tier-head h3{ font-size:clamp(1.6rem,3vw,2.2rem); margin-top:1.1rem; }
  .tier-head .range{
    font-family:var(--font-utility); letter-spacing:.14em; font-size:.8rem;
    text-transform:uppercase; color:var(--wine); margin-top:.35rem;
  }

  /* wax seal — the signature element */
  .seal{
    width:74px; height:74px; margin:0 auto;
    border-radius:50%;
    background:
      radial-gradient(circle at 32% 28%, #2A4A3C, var(--velvet) 55%, var(--velvet-deep) 100%);
    box-shadow:
      0 2px 6px rgba(38,34,24,.35),
      inset 0 0 0 3px rgba(220,184,120,.55),
      inset 0 0 0 8px rgba(220,184,120,.12);
    display:flex; align-items:center; justify-content:center;
  }
  .seal svg{ width:34px; height:34px; }

  .cards{
    display:grid; gap:1.6rem;
    grid-template-columns:repeat(auto-fit, minmax(280px, 1fr));
    max-width:1100px; margin:0 auto;
  }
  .card{
    background:#FBF8F0; border:1px solid var(--hairline);
    display:flex; flex-direction:column;
  }
  .card .plate{
    background:var(--velvet); color:var(--gold-pale);
    padding:1.1rem 1.4rem;
    font-family:var(--font-utility); font-size:.72rem;
    letter-spacing:.22em; text-transform:uppercase;
    display:flex; justify-content:space-between; align-items:center; gap:.6rem;
  }
  .card .plate .tag{ color:var(--gold-bright); }
  .card-body{ padding:1.6rem 1.4rem 1.4rem; display:flex; flex-direction:column; gap:.8rem; flex:1; }
  .card-body h4{
    font-family:var(--font-display); font-weight:600;
    font-size:1.45rem; color:var(--velvet); line-height:1.2;
  }
  .card-body .why{ font-size:.97rem; }
  .card-body .best-for{
    font-size:.85rem; font-style:italic; color:#5a5140;
    border-top:1px dashed var(--hairline); padding-top:.8rem; margin-top:auto;
  }
  .card-body .price{
    font-family:var(--font-utility); font-size:.82rem; letter-spacing:.1em;
    text-transform:uppercase; color:var(--wine);
  }
  .card .btn{ margin:0 1.4rem 1.4rem; text-align:center; }

  /* ---------- wisdom / editorial notes ---------- */
  .wisdom{ background:var(--velvet); color:var(--parchment); }
  .wisdom h2{ color:var(--parchment); }
  .wisdom .eyebrow{ color:var(--gold-bright); }
  .wisdom-grid{
    display:grid; gap:2.4rem; margin-top:2.8rem;
    grid-template-columns:repeat(auto-fit, minmax(240px, 1fr));
    max-width:1100px; margin-left:auto; margin-right:auto;
  }
  .wisdom-item h3{
    color:var(--gold-bright); font-size:1.3rem; margin-bottom:.5rem;
  }
  .wisdom-item p{ font-size:.95rem; color:var(--gold-pale); }

  /* ---------- about ---------- */
  .about blockquote{
    font-family:var(--font-display); font-size:clamp(1.3rem,2.6vw,1.7rem);
    font-style:italic; color:var(--velvet);
    border-left:2px solid var(--gold); padding-left:1.4rem; margin:2rem 0;
  }

  /* ---------- email capture ---------- */
  .capture{ background:var(--parchment-2); border-top:1px solid var(--hairline); text-align:center; }
  .capture form{
    display:flex; gap:.8rem; justify-content:center; flex-wrap:wrap; margin-top:1.8rem;
  }
  .capture input[type="email"]{
    font-family:var(--font-utility); font-size:.95rem;
    padding:.95rem 1.2rem; min-width:min(320px, 80vw);
    border:1px solid var(--gold); background:#FBF8F0; color:var(--ink);
  }
  .capture button{ cursor:pointer; }

  /* ---------- footer ---------- */
  footer{
    background:var(--velvet-deep); color:var(--gold-pale);
    padding:3rem var(--pad) 2.5rem; text-align:center;
    font-size:.85rem;
  }
  footer .fine{ max-width:70ch; margin:1.2rem auto 0; opacity:.75; font-size:.78rem; line-height:1.6; }
  footer nav{ display:flex; gap:1.4rem; justify-content:center; margin-top:1.2rem; flex-wrap:wrap; }
  footer nav a{ color:var(--gold-pale); font-family:var(--font-utility); font-size:.75rem; letter-spacing:.18em; text-transform:uppercase; }

/* compact hero for sub-pages */
.hero.compact{ padding:clamp(2.5rem,6vw,4rem) var(--pad); }
.hero.compact h1{ font-size:clamp(2rem,4.5vw,3.2rem); }
