:root {
      color-scheme: light dark;
      --bg:#1a1512;
      --bg-2:#251d18;
      --ink:#faf5ec;
      --muted:#d7c9bb;
      --red:#f03f35;
      --red-deep:#a72420;
      --gold:#e8a93d;
      --paper:#faf5ec;
      --paper-ink:#1a1512;
      --line:rgba(250,245,236,.22);
      --shadow:#0e0b09;
      --placeholder:#302621;
    }
    @media (prefers-color-scheme: dark) {
      :root {
        --bg:#100d0b;
        --bg-2:#1d1713;
        --ink:#fff9f0;
        --muted:#d8c8b8;
        --red:#f03f35;
        --red-deep:#a72420;
        --gold:#f0b64f;
        --paper:#f7efe4;
        --paper-ink:#110e0c;
        --line:rgba(255,249,240,.22);
        --shadow:#050403;
        --placeholder:#29201b;
      }
    }
    * { box-sizing:border-box; }
    html { scroll-behavior:smooth; background:var(--bg); }
    body {
      margin:0;
      background:var(--bg);
      color:var(--ink);
      font-family:"Barlow Condensed", sans-serif;
      font-size:18px;
      line-height:1.45;
      overflow-x:hidden;
    }
    a { color:inherit; }
    button, a { -webkit-tap-highlight-color:transparent; }
    .hero {
      min-height:94svh;
      position:relative;
      display:flex;
      align-items:center;
      padding:clamp(34px, 5vw, 76px) max(24px, calc((100vw - 1340px)/2));
      overflow:hidden;
      isolation:isolate;
      background:var(--bg);
    }
    .hero::before {
      content:"";
      position:absolute;
      inset:0;
      z-index:-3;
      background:url("../assets/real-crawfish-closeup.jpg") center 50% / cover no-repeat;
      transform:scale(1.01);
    }
    .hero::after {
      content:"";
      position:absolute;
      inset:0;
      z-index:-2;
      background:
        linear-gradient(90deg,rgba(16,13,11,.98) 0%,rgba(16,13,11,.9) 37%,rgba(16,13,11,.34) 69%,rgba(16,13,11,.14) 100%),
        linear-gradient(0deg,rgba(16,13,11,.88) 0%,transparent 36%,rgba(16,13,11,.22) 100%);
    }
    .hero-copy { position:relative; z-index:2; width:min(760px,72%); padding-top:clamp(96px,10vw,140px); transform:translateY(32px); }
    .brand-lockup {
      position:absolute;
      z-index:3;
      left:max(24px, calc((100vw - 1340px)/2));
      right:max(24px, calc((100vw - 1340px)/2));
      top:clamp(24px,3.6vw,46px);
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:24px;
      border-bottom:2px solid rgba(250,245,236,.48);
      padding-bottom:14px;
    }
    .brand-logo {
      display:block;
      width:clamp(190px,20vw,270px);
      height:auto;
      flex:0 0 auto;
    }
    .brand-actions { display:flex; align-items:center; gap:22px; margin-left:auto; }
    .brand-kind { color:var(--ink); font-size:18px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; white-space:nowrap; }
    .brand-nav { display:flex; align-items:center; gap:20px; }
    .brand-nav a { position:relative; color:var(--ink); font-size:16px; font-weight:700; letter-spacing:.08em; text-decoration:none; text-transform:uppercase; }
    .brand-nav a::after { content:""; position:absolute; left:0; right:100%; bottom:-6px; height:3px; background:var(--gold); transition:right .18s ease; }
    .brand-nav a:hover::after,.brand-nav a:focus-visible::after { right:0; }
    .brand-nav a:focus-visible { outline:2px solid var(--gold); outline-offset:7px; }
    .nav-toggle { display:none; width:48px; height:48px; padding:0; border:2px solid var(--ink); background:rgba(16,13,11,.75); color:var(--ink); cursor:pointer; }
    .nav-toggle span,.nav-toggle::before,.nav-toggle::after { content:""; display:block; width:22px; height:2px; margin:5px auto; background:currentColor; transition:transform .18s ease,opacity .18s ease; }
    .nav-toggle.is-open span { opacity:0; }
    .nav-toggle.is-open::before { transform:translateY(7px) rotate(45deg); }
    .nav-toggle.is-open::after { transform:translateY(-7px) rotate(-45deg); }
    .eyebrow {
      display:inline-flex;
      align-items:center;
      gap:10px;
      margin:0 0 20px;
      color:var(--gold);
      font-weight:700;
      font-size:clamp(15px,1.3vw,19px);
      letter-spacing:.1em;
      text-transform:uppercase;
    }
    .eyebrow::before { content:""; width:34px; height:5px; background:var(--red); transform:skewX(-18deg); }
    h1,h2,h3 { font-family:"Anton",Impact,sans-serif; font-weight:400; margin:0; line-height:.88; letter-spacing:.005em; }
    h1 {
      font-size:clamp(88px,12.6vw,190px);
      max-width:5.2ch;
      text-transform:uppercase;
      text-shadow:7px 7px 0 var(--red-deep);
    }
    .hero-sub {
      max-width:590px;
      margin:28px 0 32px;
      color:var(--muted);
      font-size:clamp(21px,2.1vw,30px);
      line-height:1.25;
      font-weight:500;
    }
    .actions { display:flex; flex-wrap:wrap; gap:13px; }
    .btn {
      display:inline-flex;
      justify-content:center;
      align-items:center;
      min-height:54px;
      padding:13px 23px 12px;
      font-family:"Anton",Impact,sans-serif;
      font-weight:400;
      font-size:18px;
      line-height:1;
      letter-spacing:.04em;
      text-transform:uppercase;
      text-decoration:none;
      border:2px solid var(--ink);
      transition:background .18s ease,color .18s ease,transform .18s ease;
    }
    .btn-primary { background:var(--red); border-color:var(--red); color:#fff; box-shadow:6px 6px 0 var(--gold); }
    .btn-secondary { background:transparent; }
    .btn:hover,.btn:focus-visible { background:var(--gold); border-color:var(--gold); color:var(--paper-ink); transform:translate(-2px,-2px); outline:none; }
    .hero-art {
      width:min(100%,650px);
      justify-self:end;
      position:relative;
      transform:rotate(1.5deg);
      filter:drop-shadow(18px 22px 0 rgba(0,0,0,.27));
    }
    .hero-art svg { width:100%; height:auto; display:block; }
    .burst {
      position:absolute;
      right:1%; top:5%;
      width:112px; aspect-ratio:1;
      display:grid; place-items:center;
      background:var(--gold);
      color:var(--paper-ink);
      font-family:"Anton",sans-serif;
      font-size:24px;
      line-height:.9;
      text-align:center;
      transform:rotate(10deg);
      clip-path:polygon(50% 0,61% 13%,78% 5%,83% 22%,100% 25%,90% 42%,100% 55%,84% 65%,88% 84%,68% 85%,59% 100%,47% 87%,30% 98%,25% 80%,7% 78%,16% 60%,0 49%,17% 38%,8% 21%,29% 18%,36% 2%);
      z-index:4;
    }
    .marquee {
      border-top:4px solid var(--paper-ink);
      border-bottom:4px solid var(--paper-ink);
      background:var(--gold);
      color:var(--paper-ink);
      overflow:hidden;
      transform:rotate(-1deg) scale(1.02);
      position:relative;
      z-index:5;
    }
    .marquee-track {
      width:max-content;
      display:flex;
      gap:24px;
      padding:10px 0 8px;
      font-family:"Anton",sans-serif;
      font-size:clamp(24px,3vw,42px);
      line-height:1;
      animation:marquee 24s linear infinite;
    }
    @keyframes marquee { to { transform:translateX(-50%); } }
    .section { padding:clamp(82px,10vw,140px) max(24px, calc((100vw - 1340px)/2)); }
    .section-head { display:flex; justify-content:space-between; gap:28px; align-items:flex-end; margin-bottom:48px; }
    .section-head h2 { font-size:clamp(64px,9vw,132px); text-transform:uppercase; }
    .section-note { max-width:350px; margin:0 0 10px; color:var(--muted); font-size:20px; }
    .heat-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; }
    .heat-card {
      min-width:0;
      background:var(--bg-2);
      border-top:8px solid var(--tier);
      position:relative;
      display:flex;
      flex-direction:column;
      box-shadow:8px 8px 0 var(--shadow);
      cursor:pointer;
      transition:transform .18s ease,box-shadow .18s ease;
    }
    .heat-card:hover,.heat-card:focus-visible { transform:translate(-3px,-3px); box-shadow:13px 13px 0 var(--shadow); outline:3px solid var(--tier); outline-offset:4px; }
    .heat-card:nth-child(2) { transform:translateY(26px); }
    .heat-card:nth-child(2):hover,.heat-card:nth-child(2):focus-visible { transform:translate(-3px,23px); }
    .photo-slot {
      height:clamp(360px,34vw,500px);
      display:grid;
      place-items:center;
      position:relative;
      overflow:hidden;
      padding:22px;
      background:#e7e7e5;
      border-bottom:1px solid var(--line);
    }
    .photo-slot img {
      width:100%;
      height:100%;
      display:block;
      object-fit:contain;
      object-position:center center;
      filter:drop-shadow(0 14px 12px rgba(26,21,18,.16));
    }
    .card-body { padding:26px 25px 30px; display:flex; flex-direction:column; flex:1; }
    .card-top { display:flex; align-items:flex-start; justify-content:space-between; gap:16px; }
    .heat-name { font-size:clamp(48px,4vw,66px); color:var(--tier); text-transform:uppercase; }
    .price { font-family:"Anton",sans-serif; font-size:28px; white-space:nowrap; }
    .tagline { margin:12px 0 10px; font-size:24px; line-height:1.05; font-weight:700; }
    .description { margin:0; color:var(--muted); font-size:18px; line-height:1.38; flex:1; }
    .detail-cue { margin:22px 0 0; padding-top:14px; border-top:1px solid var(--line); color:var(--tier); font-size:16px; line-height:1; font-weight:700; letter-spacing:.08em; text-transform:uppercase; }
    .meter { margin-top:26px; display:flex; align-items:center; justify-content:space-between; gap:15px; }
    .meter-label { font-size:14px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; }
    .flames { display:flex; gap:6px; }
    .flame { width:14px; height:22px; border:2px solid var(--tier); transform:skewX(-9deg); }
    .flame.on { background:var(--tier); }
    .mild { --tier:var(--gold); }
    .medium { --tier:#e2662e; }
    .spicy { --tier:var(--red); }
    .product-modal {
      position:fixed;
      inset:0;
      z-index:100;
      display:none;
      place-items:center;
      padding:clamp(14px,3vw,34px);
      background:rgba(5,4,3,.86);
    }
    .product-modal.is-open { display:grid; }
    .modal-panel {
      width:min(1080px,100%);
      max-height:calc(100svh - 28px);
      overflow:auto;
      position:relative;
      display:grid;
      grid-template-columns:minmax(280px,.82fr) minmax(0,1.18fr);
      background:var(--bg-2);
      color:var(--ink);
      border-top:8px solid var(--tier,var(--red));
      box-shadow:14px 14px 0 var(--shadow);
    }
    .modal-close {
      position:absolute;
      z-index:2;
      top:14px;
      right:14px;
      min-width:46px;
      min-height:46px;
      padding:9px 12px;
      border:2px solid var(--ink);
      background:var(--bg);
      color:var(--ink);
      font:700 16px/1 "Barlow Condensed",sans-serif;
      letter-spacing:.06em;
      text-transform:uppercase;
      cursor:pointer;
    }
    .modal-close:hover,.modal-close:focus-visible { background:var(--gold); color:var(--paper-ink); border-color:var(--gold); outline:none; }
    .modal-product {
      min-height:100%;
      display:flex;
      flex-direction:column;
      align-items:center;
      justify-content:center;
      gap:18px;
      padding:58px clamp(24px,4vw,52px) 38px;
      background:#e7e7e5;
      color:var(--paper-ink);
    }
    .modal-product img { width:100%; max-width:390px; height:min(48svh,480px); display:block; object-fit:contain; object-position:center; filter:drop-shadow(0 16px 14px rgba(26,21,18,.2)); }
    .modal-product-line { width:100%; display:flex; align-items:flex-end; justify-content:space-between; gap:16px; }
    .modal-product h2 { min-width:0; color:var(--tier,var(--red)); font-size:clamp(44px,4vw,54px); text-transform:uppercase; }
    .modal-price { flex:0 0 auto; font-family:"Anton",sans-serif; font-size:28px; white-space:nowrap; }
    .modal-heat { width:100%; display:flex; align-items:center; justify-content:space-between; gap:16px; }
    .modal-content { padding:clamp(58px,6vw,76px) clamp(26px,5vw,64px) 46px; }
    .modal-kicker { display:block; margin-bottom:12px; color:var(--gold); font-weight:700; font-size:16px; letter-spacing:.11em; text-transform:uppercase; }
    .modal-content h3 { margin:28px 0 9px; color:var(--gold); font:700 22px/1 "Barlow Condensed",sans-serif; letter-spacing:.08em; text-transform:uppercase; }
    .modal-content h3:first-of-type { margin-top:0; }
    .modal-content p { margin:0; color:var(--muted); font-size:18px; line-height:1.42; }
    .modal-content strong { color:var(--ink); }
    .flavor-summary { max-width:560px; color:var(--ink) !important; font-size:21px !important; line-height:1.32 !important; font-weight:600; }
    .crafted-list { display:flex; flex-wrap:wrap; gap:8px; margin:13px 0 0; padding:0; list-style:none; }
    .crafted-list li { padding:7px 11px 6px; background:var(--paper); color:var(--paper-ink); font-weight:700; line-height:1; }
    .cook-steps { margin:0; padding-left:24px; color:var(--muted); font-size:18px; line-height:1.38; }
    .cook-steps li + li { margin-top:7px; }
    .modal-facts { display:grid; grid-template-columns:1fr 1fr; gap:18px; margin-top:28px; padding-top:24px; border-top:2px solid var(--line); }
    .modal-fact strong { display:block; color:var(--ink); font-size:21px; }
    .modal-fact span { color:var(--muted); }
    .allergen-note { margin:26px 0 10px !important; color:var(--ink) !important; font-size:15px !important; font-weight:700; letter-spacing:.04em; }
    .ingredient-disclosure { border-top:2px solid var(--line); border-bottom:2px solid var(--line); }
    .ingredient-disclosure summary {
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:18px;
      padding:16px 0 14px;
      color:var(--gold);
      font-weight:700;
      font-size:18px;
      letter-spacing:.06em;
      text-transform:uppercase;
      cursor:pointer;
      list-style:none;
    }
    .ingredient-disclosure summary::-webkit-details-marker { display:none; }
    .ingredient-disclosure summary::after { content:"+"; flex:0 0 auto; color:var(--ink); font:400 29px/1 "Anton",sans-serif; }
    .ingredient-disclosure[open] summary::after { content:"−"; }
    .ingredient-disclosure summary:focus-visible { outline:3px solid var(--gold); outline-offset:5px; }
    .disclosure-body { padding:2px 0 20px; }
    .disclosure-body h4 { margin:16px 0 6px; color:var(--ink); font-size:17px; line-height:1; letter-spacing:.06em; text-transform:uppercase; }
    .disclosure-body h4:first-child { margin-top:0; }
    .nutrition-panel {
      margin-top:10px;
      border:2px solid var(--ink);
      background:var(--bg);
      color:var(--ink);
    }
    .nutrition-heading {
      padding:11px 12px 8px;
      border-bottom:5px solid var(--ink);
      font-family:"Anton",Impact,sans-serif;
      font-size:30px;
      line-height:1;
      letter-spacing:.025em;
      text-transform:uppercase;
    }
    .nutrition-serving { display:grid; gap:2px; padding:9px 12px; border-bottom:3px solid var(--ink); font-size:16px; line-height:1.25; }
    .nutrition-serving strong { color:var(--ink); }
    .nutrition-amount { padding:7px 12px 2px; font-size:13px; font-weight:700; letter-spacing:.05em; text-transform:uppercase; }
    .nutrition-calories { display:flex; align-items:end; justify-content:space-between; gap:18px; padding:0 12px 7px; border-bottom:5px solid var(--ink); font-family:"Anton",Impact,sans-serif; font-size:28px; line-height:1; }
    .nutrition-calories strong:last-child { font-size:36px; }
    .nutrition-dv { padding:6px 12px 4px; border-bottom:1px solid var(--line); text-align:right; font-size:13px; font-weight:700; letter-spacing:.035em; }
    .nutrition-table { width:100%; border-collapse:collapse; color:var(--ink); font-size:16px; line-height:1.2; }
    .nutrition-table th,.nutrition-table td { padding:7px 12px 6px; border-bottom:1px solid var(--line); }
    .nutrition-table th { text-align:left; font-weight:600; }
    .nutrition-table td { width:62px; text-align:right; font-weight:700; white-space:nowrap; }
    .nutrition-table tr:last-child th,.nutrition-table tr:last-child td { border-bottom:0; }
    .nutrition-table .subnutrient { padding-left:26px; font-weight:500; }
    body.modal-open { overflow:hidden; }
    .food-story { 
      padding:0 max(24px, calc((100vw - 1340px)/2)) clamp(82px,10vw,140px);
      display:grid;
      grid-template-columns:1.06fr .94fr;
      gap:18px;
      align-items:start;
    }
    .food-frame { margin:0; position:relative; min-height:0; overflow:hidden; background:var(--placeholder); }
    .food-frame:first-child { transform:rotate(-1deg); }
    .food-frame:last-child { transform:translateY(38px) rotate(1deg); }
    .food-frame img { width:100%; height:auto; display:block; }
    .food-frame:first-child img { object-position:center 54%; }
    .food-frame:last-child img { object-position:center 50%; }
    .food-caption {
      position:absolute;
      left:18px;
      bottom:18px;
      padding:9px 12px 7px;
      background:var(--gold);
      color:var(--paper-ink);
      font-family:Impact,"Anton",sans-serif;
      font-size:clamp(24px,2.8vw,42px);
      line-height:.92;
      text-transform:uppercase;
      box-shadow:5px 5px 0 var(--red-deep);
    }
    .real-deal {
      padding:clamp(86px,10vw,138px) max(24px, calc((100vw - 1340px)/2));
      background:var(--bg-2);
      border-top:5px solid var(--red);
    }
    .real-deal .section-head { margin-bottom:36px; }
    .real-deal .section-head h2 { color:var(--gold); }
    .real-gallery {
      display:grid;
      grid-template-columns:minmax(0,1.12fr) minmax(0,.88fr);
      gap:18px;
      align-items:start;
    }
    .gallery-stack { display:grid; gap:18px; }
    .gallery-frame {
      margin:0;
      position:relative;
      overflow:hidden;
      border:8px solid var(--bg);
      background:var(--bg);
      box-shadow:8px 8px 0 var(--shadow);
    }
    .gallery-frame img { width:100%; height:auto; display:block; }
    .gallery-caption {
      position:absolute;
      left:14px;
      bottom:14px;
      padding:8px 11px 7px;
      background:rgba(16,13,11,.9);
      color:#fff;
      font-weight:700;
      font-size:clamp(18px,2vw,28px);
      line-height:1;
      text-transform:uppercase;
      letter-spacing:.025em;
    }
    .brand-band {
      background:var(--paper);
      color:var(--paper-ink);
      padding:clamp(70px,9vw,120px) max(24px, calc((100vw - 1340px)/2));
      position:relative;
      overflow:hidden;
    }
    .brand-band::before {
      content:"";
      position:absolute;
      inset:0;
      background:repeating-linear-gradient(-45deg,transparent 0 20px,rgba(193,39,45,.035) 20px 22px);
      pointer-events:none;
    }
    .band-kicker {
      display:inline-block;
      background:var(--red);
      color:#fff;
      padding:7px 13px 5px;
      font-family:"Anton",sans-serif;
      font-size:21px;
      transform:rotate(-2deg);
      margin-bottom:20px;
    }
    .brand-intro { display:grid; grid-template-columns:minmax(0,1.18fr) minmax(300px,.82fr); gap:clamp(28px,5vw,72px); align-items:end; position:relative; z-index:1; }
    .brand-band h2 { font-size:clamp(70px,9.2vw,132px); text-transform:uppercase; max-width:8ch; }
    .stamp-wrap { display:flex; align-items:flex-end; justify-content:flex-end; gap:22px; }
    .brand-stamp {
      flex:0 0 auto;
      width:clamp(152px,16vw,220px);
      aspect-ratio:1;
      display:grid;
      place-items:center;
      border:8px solid var(--red);
      border-radius:50%;
      background:var(--paper);
      color:var(--red);
      font-family:Impact,"Anton",sans-serif;
      font-size:clamp(24px,3vw,42px);
      line-height:.84;
      text-align:center;
      text-transform:uppercase;
      transform:rotate(8deg);
      box-shadow:8px 8px 0 var(--gold);
    }
    .stamp-wrap p { max-width:260px; margin:0 0 6px; font-size:23px; line-height:1.18; font-weight:600; }
    .proof-grid { display:grid; grid-template-columns:1.35fr 1fr 1fr; gap:0; margin-top:54px; border-top:3px solid var(--paper-ink); border-bottom:3px solid var(--paper-ink); position:relative; z-index:1; }
    .proof { padding:30px 28px 28px 0; }
    .proof + .proof { border-left:3px solid var(--paper-ink); padding-left:28px; }
    .proof-num { display:block; color:var(--red); font-family:"Anton",sans-serif; font-size:58px; line-height:1; }
    .proof h3 { font-family:"Barlow Condensed",sans-serif; font-size:28px; line-height:1.05; font-weight:700; margin:10px 0 8px; }
    .proof p { margin:0; font-size:18px; line-height:1.35; }
    .boil-band {
      min-height:clamp(420px,62vw,760px);
      position:relative;
      display:flex;
      align-items:flex-end;
      padding:clamp(44px,7vw,92px) max(24px, calc((100vw - 1340px)/2));
      isolation:isolate;
      overflow:hidden;
    }
    .boil-band::before { content:""; position:absolute; inset:0; z-index:-2; background:url("../assets/real-crawfish-bowl.jpg") center 48% / cover no-repeat; }
    .boil-band::after { content:""; position:absolute; inset:0; z-index:-1; background:linear-gradient(0deg,rgba(16,13,11,.95) 0%,rgba(16,13,11,.18) 58%,rgba(16,13,11,.2) 100%); }
    .boil-band h2 { max-width:8ch; color:#fff; font-size:clamp(66px,10vw,142px); text-transform:uppercase; text-shadow:6px 6px 0 var(--red-deep); }
    footer {
      padding:52px max(24px, calc((100vw - 1340px)/2));
      display:grid;
      grid-template-columns:minmax(0,1fr) auto;
      gap:30px;
      align-items:end;
      border-top:5px solid var(--gold);
      background:var(--red-deep);
      color:#fff;
    }
    .footer-brand-block { display:flex; align-items:center; gap:18px; min-width:0; }
    .footer-brand-logo {
      display:block;
      width:clamp(150px,19.2vw,240px);
      height:auto;
      flex:0 0 auto;
    }
    .footer-copyright { font-size:16px; color:#fff; white-space:nowrap; }
    .footer-meta { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:13px 24px; font-size:17px; }
    footer a { text-underline-offset:4px; text-decoration-thickness:1px; }
    footer a:hover,footer a:focus-visible { color:var(--gold); outline:none; }
    @media (max-width:980px) {
      .hero-copy { width:min(820px,88%); }
      .hero::after { background:linear-gradient(90deg,rgba(16,13,11,.96) 0%,rgba(16,13,11,.78) 55%,rgba(16,13,11,.2) 100%),linear-gradient(0deg,rgba(16,13,11,.84) 0%,transparent 48%); }
      .heat-grid { grid-template-columns:1fr; gap:24px; }
      .heat-card:nth-child(2) { transform:none; }
      .heat-card:nth-child(2):hover,.heat-card:nth-child(2):focus-visible { transform:translate(-3px,-3px); }
      .heat-card { display:grid; grid-template-columns:minmax(220px,.8fr) 1.2fr; }
      .photo-slot { height:420px; border-bottom:0; border-right:1px solid var(--line); }
      .food-story { grid-template-columns:1fr 1fr; }
      .real-gallery { grid-template-columns:1fr 1fr; }
      .gallery-main { grid-column:1 / -1; }
      .gallery-stack { display:contents; }
      .brand-intro { grid-template-columns:1fr; }
      .stamp-wrap { justify-content:flex-start; }
      .proof-grid { grid-template-columns:1fr; }
      .proof + .proof { border-left:0; border-top:3px solid var(--paper-ink); padding-left:0; }
      .proof { padding-right:0; }
    }
    @media (max-width:660px) {
      body { font-size:17px; }
      .hero { min-height:780px; padding:170px 20px 50px; align-items:flex-end; }
      .hero::before { background-position:62% center; }
      .hero::after { background:linear-gradient(180deg,rgba(16,13,11,.35) 0%,rgba(16,13,11,.2) 27%,rgba(16,13,11,.92) 62%,rgba(16,13,11,.99) 100%); }
      .brand-lockup { left:20px; right:20px; top:18px; align-items:center; gap:12px; padding-bottom:12px; }
      .brand-logo { width:min(52vw,180px); }
      .brand-actions { gap:10px; }
      .brand-kind { display:none; }
      .nav-toggle { display:block; }
      .brand-nav { display:none; position:absolute; top:calc(100% + 2px); left:0; right:0; z-index:10; padding:7px 14px 12px; flex-direction:column; align-items:stretch; gap:0; background:rgba(16,13,11,.97); border-bottom:3px solid var(--gold); box-shadow:0 12px 22px rgba(0,0,0,.28); }
      .brand-nav.is-open { display:flex; }
      .brand-nav a { display:flex; align-items:center; min-height:48px; padding:7px 2px; border-bottom:1px solid var(--line); font-size:17px; }
      .brand-nav a:last-child { border-bottom:0; }
      .brand-nav a::after { display:none; }
      .hero-copy { width:100%; padding-top:0; transform:none; }
      h1 { font-size:clamp(68px,21vw,86px); max-width:100%; line-height:.9; text-shadow:4px 4px 0 var(--red-deep); }
      .eyebrow { gap:8px; margin-bottom:14px; font-size:14px; letter-spacing:.055em; }
      .eyebrow::before { width:26px; height:4px; }
      .hero-sub { margin:20px 0 24px; font-size:20px; line-height:1.26; }
      .actions { display:grid; grid-template-columns:1fr; gap:12px; }
      .btn { width:100%; min-height:54px; }
      .marquee-track { font-size:25px; }
      .section { padding:70px 20px 86px; }
      .section-head { display:block; margin-bottom:30px; }
      .section-head h2 { font-size:clamp(60px,18vw,72px); line-height:.9; }
      .section-note { margin-top:16px; font-size:19px; }
      .heat-grid { gap:22px; }
      .heat-card { display:flex; box-shadow:6px 6px 0 var(--shadow); }
      .heat-card:hover,.heat-card:focus-visible { transform:none; box-shadow:6px 6px 0 var(--shadow); }
      .photo-slot { height:min(92vw,360px); padding:18px; border-right:0; border-bottom:1px solid var(--line); }
      .card-body { padding:22px 20px 24px; }
      .heat-name { font-size:50px; }
      .price { font-size:25px; }
      .tagline { margin-top:10px; font-size:22px; }
      .detail-cue { margin-top:18px; min-height:44px; display:flex; align-items:center; }
      .meter { margin-top:18px; }
      .product-modal { padding:0; place-items:stretch; }
      .modal-panel { width:100%; max-height:100svh; grid-template-columns:1fr; border-top-width:6px; box-shadow:none; }
      .modal-close { position:fixed; top:12px; right:12px; min-width:48px; min-height:48px; box-shadow:3px 3px 0 rgba(0,0,0,.3); }
      .modal-product { min-height:auto; gap:13px; padding:58px 20px 24px; }
      .modal-product img { max-width:250px; height:min(38svh,300px); }
      .modal-product h2 { font-size:48px; }
      .modal-price { font-size:26px; }
      .modal-content { padding:30px 20px 42px; }
      .flavor-summary { font-size:20px !important; }
      .modal-content h3 { margin-top:26px; font-size:21px; }
      .crafted-list { gap:7px; }
      .crafted-list li { padding:8px 10px 7px; }
      .cook-steps { padding-left:21px; }
      .modal-facts { grid-template-columns:1fr 1fr; gap:13px; }
      .ingredient-disclosure summary { min-height:54px; font-size:17px; }
      .nutrition-table { font-size:15px; }
      .nutrition-table th,.nutrition-table td { padding-left:10px; padding-right:10px; }
      .nutrition-table .subnutrient { padding-left:22px; }
      .food-story { grid-template-columns:1fr; gap:20px; padding:0 20px 82px; }
      .food-frame:first-child,.food-frame:last-child { transform:none; }
      .food-caption,.gallery-caption { left:10px; bottom:10px; max-width:calc(100% - 20px); font-size:24px; }
      .real-deal { padding:76px 20px 88px; }
      .real-gallery { grid-template-columns:1fr; gap:16px; }
      .gallery-main { grid-column:auto; }
      .gallery-stack { display:grid; gap:16px; }
      .gallery-frame { border-width:5px; box-shadow:6px 6px 0 var(--shadow); }
      .brand-band { padding:68px 20px 76px; }
      .brand-band h2 { font-size:clamp(50px,15vw,62px); line-height:.93; overflow-wrap:normal; }
      .stamp-wrap { align-items:flex-start; flex-direction:column; gap:18px; }
      .brand-stamp { width:132px; border-width:6px; }
      .stamp-wrap p { font-size:20px; }
      .proof-grid { margin-top:34px; }
      .proof { padding:24px 0; }
      .proof-num { font-size:49px; }
      .proof h3 { font-size:26px; }
      .boil-band { min-height:430px; padding:48px 20px; }
      .boil-band::before { background-position:60% center; }
      .boil-band h2 { font-size:clamp(54px,17vw,68px); line-height:.92; }
      footer { grid-template-columns:1fr; gap:22px; align-items:start; padding:42px 20px; }
      .footer-brand-block { align-items:flex-start; flex-direction:column; gap:12px; }
      .footer-brand-logo { width:150px; }
      .footer-copyright { white-space:normal; line-height:1.3; }
      .footer-meta { justify-content:flex-start; flex-direction:column; gap:0; width:100%; }
      .footer-meta a { display:flex; align-items:center; min-height:46px; }
    }
    @media (max-width:380px) {
      .hero { padding-left:16px; padding-right:16px; }
      .brand-lockup { left:16px; right:16px; }
      .brand-logo { width:165px; }
      .section,.real-deal,.brand-band { padding-left:16px; padding-right:16px; }
      .food-story { padding-left:16px; padding-right:16px; }
      .card-top { align-items:flex-end; }
      .modal-content,.modal-product { padding-left:18px; padding-right:18px; }
    }
    @media (prefers-reduced-motion:reduce) {
      html { scroll-behavior:auto; }
      .marquee-track { animation:none; }
      .btn,.heat-card { transition:none; }
    }

/* ---------- store bridge: maps production component vars onto the concept theme ---------- */
:root {
  --cream: var(--ink);
  --cream-dim: var(--muted);
  --ink-2: var(--bg-2);
  --ink-3: var(--placeholder);
  --font-head: "Anton", Impact, sans-serif;
  --font-body: "Barlow Condensed", "Arial Narrow", sans-serif;
}
body { font-family: var(--font-body); }
/* add-to-cart inside the product modal */
.modal-add { width: 100%; margin: 6px 0 4px; }
.modal-add[disabled] { opacity: 0.65; cursor: default; }
/* cart button placement in the concept header */
.brand-actions .cart-btn { flex-shrink: 0; }

/* ---------- production store components ---------- */
.cart-btn {
  position: relative;
  background: transparent;
  border: 2px solid rgba(245, 239, 228, 0.35);
  border-radius: 999px;
  color: var(--cream);
  padding: 9px 18px;
  font-family: var(--font-head);
  text-transform: uppercase;
  letter-spacing: 0.06em;
  font-size: 15px;
  cursor: pointer;
}
.cart-btn:hover { border-color: var(--cream); }
.cart-count {
  position: absolute;
  top: -8px;
  right: -6px;
  background: var(--red);
  color: #fff;
  font-family: var(--font-body);
  font-weight: 700;
  font-size: 12px;
  min-width: 22px;
  height: 22px;
  border-radius: 999px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 6px;
}
.cart-count[hidden] { display: none; }

.stock-badge {
  display: inline-block;
  font-size: 13px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: #ffb3b5;
  background: rgba(193, 39, 45, 0.18);
  border: 1px solid rgba(193, 39, 45, 0.5);
  border-radius: 999px;
  padding: 4px 12px;
  width: fit-content;
}

/* ---------- Cart drawer ---------- */
.cart-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0.6);
  z-index: 400;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.2s ease;
}
.cart-overlay.open { opacity: 1; pointer-events: auto; }
.cart-drawer {
  position: fixed;
  top: 0;
  right: 0;
  height: 100dvh;
  width: min(420px, 92vw);
  background: var(--ink-2);
  border-left: 1px solid rgba(245,239,228,0.15);
  z-index: 401;
  transform: translateX(105%);
  transition: transform 0.25s ease;
  display: flex;
  flex-direction: column;
}
.cart-drawer.open { transform: translateX(0); }
.cart-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 20px 22px;
  border-bottom: 1px solid rgba(245,239,228,0.12);
}
.cart-head h2 { font-size: 24px; }
.cart-close { background: transparent; border: none; color: var(--cream); font-size: 28px; cursor: pointer; line-height: 1; }
.cart-items { flex: 1; overflow-y: auto; padding: 18px 22px; display: flex; flex-direction: column; gap: 16px; }
.cart-empty { color: var(--cream-dim); text-align: center; padding: 40px 10px; }
.cart-line { display: grid; grid-template-columns: 64px 1fr auto; gap: 14px; align-items: center; }
.cart-line img { width: 64px; height: 64px; object-fit: contain; background: #0a0908; border-radius: 8px; }
.cart-line-name { font-weight: 700; font-size: 15px; }
.cart-line-price { font-size: 14px; color: var(--cream-dim); }
.qty-row { display: flex; align-items: center; gap: 10px; margin-top: 8px; }
.qty-row button {
  width: 30px; height: 30px;
  border-radius: 8px;
  border: 1px solid rgba(245,239,228,0.3);
  background: var(--ink-3);
  color: var(--cream);
  font-size: 17px;
  cursor: pointer;
}
.qty-row .qty { min-width: 24px; text-align: center; font-weight: 700; }
.line-remove { background: transparent; border: none; color: var(--cream-dim); font-size: 13px; text-decoration: underline; cursor: pointer; margin-top: 6px; padding: 0; }
.cart-foot { padding: 20px 22px 26px; border-top: 1px solid rgba(245,239,228,0.12); }
.cart-subtotal { display: flex; justify-content: space-between; font-family: var(--font-head); font-size: 21px; text-transform: uppercase; margin-bottom: 6px; }
.cart-note { font-size: 13px; color: var(--cream-dim); margin-bottom: 14px; }
.cart-foot .btn { width: 100%; text-align: center; }
.cart-error { margin-top: 10px; font-size: 14px; color: #ffc9cb; }

/* ---------- Promo popup ---------- */
.promo-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0.65);
  z-index: 500;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
}
.promo-overlay[hidden] { display: none; }
.promo-box {
  background: var(--ink-2);
  border: 2px solid var(--red);
  border-radius: 18px;
  max-width: 440px;
  width: 100%;
  padding: 40px 34px;
  text-align: center;
  position: relative;
}
.promo-box h2 { font-size: 34px; color: var(--cream); margin-bottom: 10px; }
.promo-box p { color: var(--cream-dim); margin-bottom: 6px; }
.promo-code {
  display: inline-block;
  margin: 14px 0 20px;
  font-family: var(--font-head);
  font-size: 30px;
  letter-spacing: 0.12em;
  color: var(--gold);
  border: 2px dashed var(--gold);
  border-radius: 12px;
  padding: 10px 26px;
}
.promo-close {
  position: absolute;
  top: 10px; right: 14px;
  background: transparent; border: none;
  color: var(--cream-dim); font-size: 26px; cursor: pointer;
}


/* ---- Spruce-up 2026-10-01: red divider marquee + tighter rhythm between food-story and real-deal ---- */
.marquee-red {
  background:var(--red);
  color:var(--paper);
  border-top:4px solid var(--paper);
  border-bottom:4px solid var(--paper);
  transform:rotate(1deg) scale(1.02);
}
.food-story { padding-bottom:clamp(36px,5vw,64px); }
.real-deal { padding-top:clamp(44px,6vw,76px); }

/* ---- Mix of three 2026-10-01: ideas from the ChatGPT concept, adapted to Concept A ---- */

/* A. Film grain over the whole page (warms up flat black) + gold hairline into food-story */
body::after {
  content:""; position:fixed; inset:0; z-index:2000; pointer-events:none; opacity:.05;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)'/%3E%3C/svg%3E");
}
.food-story { border-top:3px solid var(--gold); }

/* B. Parchment band for the heat section (concept's "CHOOSE YOUR HEAT" treatment) */
#heat {
  background:
    repeating-linear-gradient(-45deg, transparent 0 22px, rgba(26,21,18,.03) 22px 24px),
    var(--paper);
  color:var(--paper-ink);
}
#heat .section-head h2 { color:var(--paper-ink); }
#heat .section-note { color:#5c4f44; }
#heat .heat-card { background:var(--paper); color:var(--paper-ink); box-shadow:8px 8px 0 rgba(26,21,18,.9); }
#heat .heat-card:hover, #heat .heat-card:focus-visible { box-shadow:13px 13px 0 rgba(26,21,18,.9); }
#heat .heat-name { color:var(--paper-ink); }
#heat .heat-card.spicy .heat-name { color:var(--red); }
#heat .description { color:#5c4f44; }
#heat .detail-cue { color:var(--paper-ink); border-top-color:rgba(26,21,18,.25); }
#heat .meter-label { color:var(--paper-ink); }
#heat .photo-slot { border-bottom:1px solid rgba(26,21,18,.15); }

/* C. Chili-pepper heat meters (replaces flame pips) */
.pepper { display:inline-block; font-size:20px; line-height:1; font-style:normal; filter:grayscale(1); opacity:.28; }
.pepper.on { filter:none; opacity:1; }
.flames { align-items:center; }