:root{
  --green:#0b5d3b; --green2:#16885a; --cream:#fffaf2; --ink:#163126;
  --soft:#eef7ef; --pink:#ff4f9a; --yellow:#ffd94d; --muted:#6b756f;
}
*{box-sizing:border-box}
body{margin:0;font-family:Inter,Arial,sans-serif;background:var(--cream);color:var(--ink)}
a{text-decoration:none;color:inherit}
.wrap{max-width:1120px;margin:auto;padding:0 20px}
header{display:flex;justify-content:space-between;align-items:center;padding:18px 0}
.logo{font-size:28px;font-weight:800;color:var(--green)}
.tag{font-size:13px;color:var(--muted)}
.hero{display:grid;grid-template-columns:1.1fr .9fr;gap:40px;align-items:center;padding:64px 0 36px}
h1{font-size:64px;line-height:.98;margin:0 0 18px;letter-spacing:-2px}
h2{font-size:42px;line-height:1.05;margin:0 0 16px}
p.lead{font-size:21px;line-height:1.5;color:#35483f}
.cta{display:inline-block;background:var(--green2);color:white;font-weight:800;padding:18px 28px;border-radius:18px;font-size:20px;box-shadow:0 8px 24px rgba(11,93,59,.18)}
.pills{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px}
.pill{padding:9px 12px;border-radius:999px;background:white;border:1px solid #dfe9e2;font-size:14px}
.card{background:white;border:1px solid #e7eee8;border-radius:24px;padding:24px;box-shadow:0 10px 35px rgba(20,60,40,.08)}
.metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin:28px 0}
.metric{background:var(--soft);padding:18px;border-radius:18px}
.metric b{font-size:28px;display:block;color:var(--green)}
.food{height:420px;border-radius:28px;background:
linear-gradient(145deg,rgba(11,93,59,.10),rgba(255,217,77,.18)),
radial-gradient(circle at 30% 30%,#f5c76f 0 10%,transparent 11%),
radial-gradient(circle at 62% 44%,#7aa85a 0 13%,transparent 14%),
radial-gradient(circle at 50% 70%,#dc7747 0 15%,transparent 16%),
#efe6cf;position:relative;overflow:hidden}
.food:after{content:"7 meals • 1 smart shopping list";position:absolute;left:24px;bottom:24px;background:white;padding:14px 18px;border-radius:14px;font-weight:800}
.section{padding:64px 0}
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.num{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:var(--green);color:white;font-weight:800}
.quiz-shell{max-width:720px;margin:50px auto;background:white;border:1px solid #e7eee8;border-radius:28px;padding:26px;box-shadow:0 12px 40px rgba(20,60,40,.1)}
.progress{height:8px;background:#edf2ee;border-radius:99px;overflow:hidden;margin:10px 0 26px}
.progress span{display:block;height:100%;background:var(--green2);width:20%}
.options{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.option{border:1px solid #dfe8e2;border-radius:16px;padding:16px;cursor:pointer;background:#fff}
.option.selected{border:2px solid var(--green2);background:#eef8f1}
.nav{display:flex;justify-content:space-between;gap:12px;margin-top:24px}
button{border:0;border-radius:16px;padding:14px 20px;font-weight:800;cursor:pointer}
button.primary{background:var(--green2);color:white}
button.secondary{background:#edf2ee;color:var(--ink)}
.result-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:22px}
.meals{display:grid;gap:10px}
.meal{display:flex;justify-content:space-between;gap:12px;padding:14px;border-radius:14px;background:#f7faf7}
.offer{background:linear-gradient(180deg,#fff,#f1f8f2);border:2px solid #dbeade}
.price{font-size:64px;font-weight:900;color:var(--green);line-height:1}
.cross{text-decoration:line-through;color:#7d8b83}
.note{font-size:13px;color:var(--muted)}
footer{padding:40px 0;color:#6a756e;font-size:14px}
.hidden{display:none!important}
@media(max-width:800px){
 .hero,.result-grid{grid-template-columns:1fr}
 h1{font-size:46px}
 .metrics{grid-template-columns:1fr 1fr}
 .steps{grid-template-columns:1fr}
 .options{grid-template-columns:1fr}
}