/* Dried Mealworms B2B — base styles */
:root{
  --bg:#fffdf9; --ink:#1c1917; --muted:#6b635c; --line:#e8e1d8;
  --amber:#b45309; --amber-2:#92400e; --cream:#fdf6ec; --card:#ffffff;
  --max:1120px; --r:14px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0; background:var(--bg); color:var(--ink);
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  line-height:1.65; -webkit-font-smoothing:antialiased;
}
img{max-width:100%; display:block}
a{color:var(--amber-2); text-decoration:none}
a:hover{text-decoration:underline}
.wrap{max-width:var(--max); margin:0 auto; padding:0 20px}

/* header */
header{position:sticky; top:0; z-index:50; background:rgba(255,253,249,.94);
  backdrop-filter:saturate(180%) blur(8px); border-bottom:1px solid var(--line)}
.nav{display:flex; align-items:center; justify-content:space-between; height:64px; gap:16px}
.brand{font-weight:700; letter-spacing:-.02em; font-size:18px; color:var(--ink)}
.brand span{color:var(--amber)}
.nav ul{display:flex; gap:22px; list-style:none; margin:0; padding:0; font-size:14.5px}
.nav ul a{color:var(--muted)}
.nav ul a:hover{color:var(--ink); text-decoration:none}
.btn{display:inline-block; padding:11px 18px; border-radius:999px; font-size:14.5px;
  font-weight:600; border:1px solid transparent; transition:.15s}
.btn-primary{background:var(--amber); color:#fff}
.btn-primary:hover{background:var(--amber-2); text-decoration:none}
.btn-ghost{border-color:var(--line); color:var(--ink); background:#fff}
.btn-ghost:hover{border-color:var(--amber); text-decoration:none}

/* hero */
.hero{padding:72px 0 56px; background:linear-gradient(180deg,var(--cream),var(--bg))}
.hero h1{font-size:clamp(30px,4.4vw,52px); line-height:1.12; letter-spacing:-.03em; margin:0 0 18px; max-width:16ch}
.hero p.lead{font-size:clamp(16px,1.6vw,19px); color:var(--muted); max-width:56ch; margin:0 0 28px}
.hero-cta{display:flex; gap:12px; flex-wrap:wrap; align-items:center}
.hero-note{font-size:13px; color:var(--muted); margin-top:14px}

/* trust strip */
.strip{border-top:1px solid var(--line); border-bottom:1px solid var(--line); background:#fff}
.strip .wrap{display:grid; grid-template-columns:repeat(4,1fr); gap:8px; padding:22px 20px}
.strip div{text-align:center; font-size:13.5px; color:var(--muted)}
.strip strong{display:block; font-size:19px; color:var(--ink); letter-spacing:-.01em}

/* sections */
section{padding:64px 0}
section h2{font-size:clamp(24px,2.8vw,34px); letter-spacing:-.02em; margin:0 0 12px}
section .sub{color:var(--muted); margin:0 0 34px; max-width:60ch}

/* cards */
.grid{display:grid; gap:20px}
.g3{grid-template-columns:repeat(3,1fr)}
.g2{grid-template-columns:repeat(2,1fr)}
.card{background:var(--card); border:1px solid var(--line); border-radius:var(--r); padding:26px}
.card h3{margin:0 0 8px; font-size:18px; letter-spacing:-.01em}
.card p{margin:0 0 14px; color:var(--muted); font-size:14.5px}
.price{font-size:22px; font-weight:700; letter-spacing:-.02em}
.price small{font-size:13px; font-weight:500; color:var(--muted)}
.tag{display:inline-block; font-size:11.5px; font-weight:700; letter-spacing:.04em;
  text-transform:uppercase; color:var(--amber-2); background:var(--cream);
  border-radius:999px; padding:4px 10px; margin-bottom:12px}

/* table */
table{width:100%; border-collapse:collapse; font-size:14.5px; background:#fff;
  border:1px solid var(--line); border-radius:var(--r); overflow:hidden}
th,td{padding:13px 16px; text-align:left; border-bottom:1px solid var(--line)}
th{background:var(--cream); font-size:13px; letter-spacing:.03em; text-transform:uppercase; color:var(--muted)}
tr:last-child td{border-bottom:none}

/* faq */
details{background:#fff; border:1px solid var(--line); border-radius:12px; padding:16px 20px; margin-bottom:12px}
summary{cursor:pointer; font-weight:600; font-size:15px}
details p{margin:12px 0 0; color:var(--muted); font-size:14.5px}

/* cta band */
.band{background:var(--ink); color:#fff; padding:56px 0}
.band h2{color:#fff}
.band .sub{color:#c9c1b8}
.band a.btn-primary{background:#fff; color:var(--ink)}
.band a.btn-ghost{border-color:#3f3a35; color:#fff; background:transparent}

/* footer */
footer{border-top:1px solid var(--line); padding:40px 0; font-size:13.5px; color:var(--muted)}
footer .cols{display:grid; grid-template-columns:2fr 1fr 1fr; gap:28px; margin-bottom:26px}
footer strong{color:var(--ink); display:block; margin-bottom:8px; font-size:14px}
footer ul{list-style:none; margin:0; padding:0}
footer li{margin-bottom:6px}
.legal{border-top:1px solid var(--line); padding-top:18px; font-size:12.5px; line-height:1.7}

/* whatsapp float */
.wa{position:fixed; right:18px; bottom:18px; z-index:60; background:#25D366; color:#fff;
  border-radius:999px; padding:13px 18px; font-weight:600; font-size:14px;
  box-shadow:0 8px 24px rgba(0,0,0,.18)}
.wa:hover{text-decoration:none; filter:brightness(1.05)}

@media(max-width:820px){
  .nav ul{display:none}
  .g3,.g2{grid-template-columns:1fr}
  .strip .wrap{grid-template-columns:repeat(2,1fr)}
  footer .cols{grid-template-columns:1fr}
  .hero{padding:48px 0 40px}
  section{padding:48px 0}
}
