:root{--kraft:#d9c29a;--kraft2:#e9d9ba;--paper:#f6eedd;--tomato:#e2552f;--leaf:#2f5426;--leaf2:#4e7a37;--soil:#5a3b22;--ink:#2a1f16}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:"Schibsted Grotesk",system-ui,sans-serif;color:var(--ink);background:var(--kraft);background-image:radial-gradient(rgba(90,59,34,.12) 1px,transparent 1.2px),radial-gradient(rgba(255,255,255,.18) 1px,transparent 1.2px);background-size:7px 7px,11px 11px;background-position:0 0,3px 5px;line-height:1.6}
a{color:inherit}
h1,h2,.logo,.packet-rate b{font-family:Caprasimo,Georgia,serif;font-weight:400}
.strip{display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:.8rem 1.2rem;background:var(--leaf);color:var(--paper)}
.logo{text-decoration:none;font-size:1.25rem}
.logo span{color:#f3b9a6}
.strip-call{text-decoration:none;font-weight:800;font-size:.9rem;background:var(--tomato);padding:.45rem .9rem;border-radius:6px;white-space:nowrap}
.hero{max-width:1100px;margin:auto;padding:2.4rem 1.2rem 3rem;display:grid;gap:2rem;align-items:center}
.packet{background:var(--paper);border-radius:6px;padding:1.2rem 1.2rem 1.4rem;box-shadow:0 2px 0 var(--soil),0 18px 30px rgba(42,31,22,.25);position:relative;transform:rotate(-1.2deg);border-top:16px solid var(--tomato)}
.packet::before{content:"";position:absolute;left:0;right:0;top:-16px;height:16px;background:repeating-linear-gradient(90deg,transparent 0 10px,rgba(0,0,0,.12) 10px 12px)}
.packet-top{display:flex;justify-content:space-between;font-size:.75rem;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:var(--soil);border-bottom:2px dashed var(--kraft);padding-bottom:.5rem}
.variety{font-weight:600;color:var(--leaf2);margin:.9rem 0 .2rem;font-size:.95rem}
h1{font-size:clamp(2.2rem,8.5vw,3.6rem);line-height:1.02;color:var(--leaf);margin-bottom:1rem}
h1 em{font-style:normal;color:var(--tomato)}
.yard{width:100%;height:auto;display:block;border-radius:4px;border:3px solid var(--ink)}
.packet-rate{display:flex;align-items:center;gap:.6rem;margin-top:1rem;flex-wrap:wrap}
.packet-rate b{font-size:2rem;color:var(--tomato)}
.st{color:#d69a12;letter-spacing:.06em}
.lede{font-size:1.12rem;margin-bottom:1.3rem;max-width:32rem}
.ctas{display:flex;flex-wrap:wrap;gap:.7rem}
.btn{display:inline-block;text-decoration:none;font-weight:800;padding:.9rem 1.3rem;border-radius:8px;font-size:1rem;text-align:center}
.red{background:var(--tomato);color:#fff;box-shadow:0 4px 0 #a63a1d}
.red:hover{background:#cc4523}
.ghost{border:2px solid var(--ink)}
.ghost:hover{background:var(--kraft2)}
.ghost.light{border-color:var(--paper);color:var(--paper)}
.facts{list-style:none;display:flex;flex-wrap:wrap;gap:.5rem;margin-top:1.4rem}
.facts li{background:var(--leaf);color:var(--paper);font-weight:600;font-size:.85rem;padding:.3rem .8rem;border-radius:99px}
.two{max-width:1100px;margin:auto;padding:1rem 1.2rem 3rem;display:grid;gap:1.2rem}
.col{background:var(--paper);border:3px solid var(--ink);border-radius:10px;padding:1.5rem;box-shadow:6px 6px 0 var(--leaf)}
.col.alt{background:var(--leaf);color:var(--paper);box-shadow:6px 6px 0 var(--tomato)}
.tag{font-size:.72rem;font-weight:800;letter-spacing:.2em;text-transform:uppercase;color:var(--tomato)}
.alt .tag{color:#f3b9a6}
.col h2{font-size:1.9rem;margin:.2rem 0 .9rem}
.check{list-style:none;display:grid;gap:.5rem}
.check li{padding-left:1.8rem;position:relative}
.check li::before{content:"";position:absolute;left:0;top:.35rem;width:1.05rem;height:1.05rem;border-radius:50% 0;background:var(--leaf2);transform:rotate(-20deg)}
.alt .check li::before{background:#9cc27a}
.note{margin-top:1rem;font-style:italic;opacity:.9}
.reviews{background:var(--paper);padding:3.2rem 1.2rem;border-block:3px solid var(--ink)}
.rh{max-width:1100px;margin:0 auto 2rem;font-size:clamp(1.7rem,6vw,2.6rem);color:var(--leaf);display:flex;flex-wrap:wrap;align-items:baseline;gap:.4rem 1rem}
.rh span{font-family:"Schibsted Grotesk",sans-serif;font-weight:800;font-size:.95rem;color:var(--tomato)}
.stakes{max-width:1100px;margin:auto;display:grid;gap:2.4rem 1.2rem}
.stake{position:relative;background:#fff;border:2px solid var(--ink);border-radius:8px 8px 8px 8px;padding:1.3rem 1.2rem 1rem;margin-bottom:1rem}
.stake::after{content:"";position:absolute;left:50%;bottom:-30px;width:14px;height:28px;margin-left:-7px;background:var(--soil);clip-path:polygon(0 0,100% 0,50% 100%)}
.stake::before{content:"";position:absolute;top:10px;left:50%;width:10px;height:10px;margin-left:-5px;border-radius:50%;border:2px solid var(--ink);background:var(--kraft)}
.stake blockquote{margin-top:.8rem;font-size:.98rem}
.stake figcaption{margin-top:.8rem;font-weight:800;color:var(--leaf2);font-size:.9rem}
.how{max-width:1100px;margin:auto;padding:3rem 1.2rem}
.how h2{font-size:2rem;color:var(--leaf);margin-bottom:1rem}
.how ol{list-style:none;display:grid;gap:.8rem;counter-reset:s}
.how li{counter-increment:s;background:var(--kraft2);border-radius:10px;padding:1rem 1rem 1rem 3.6rem;position:relative}
.how li::before{content:counter(s);position:absolute;left:1rem;top:.85rem;width:1.9rem;height:1.9rem;border-radius:50%;background:var(--tomato);color:#fff;font-weight:800;display:grid;place-items:center}
.how b{display:block}
.end{background:var(--leaf);color:var(--paper);text-align:center;padding:3.2rem 1.2rem}
.end h2{font-size:clamp(1.7rem,6vw,2.5rem);margin-bottom:.4rem}
.end p{margin-bottom:1.3rem}
.end .ctas{justify-content:center}
.foot{text-align:center;padding:1.3rem;font-size:.85rem;background:var(--ink);color:var(--kraft)}
@media(min-width:820px){.hero{grid-template-columns:1fr 1fr}.two{grid-template-columns:1fr 1fr}.stakes{grid-template-columns:repeat(2,1fr)}.how ol{grid-template-columns:repeat(3,1fr)}}
@media(min-width:1080px){.stakes{grid-template-columns:repeat(3,1fr)}}
