:root{
  --yellow:#f7c928; --dark:#29210b; --cream:#fff9df; --white:#fff;
  --shadow:0 18px 50px rgba(60,45,0,.12);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--dark);background:var(--cream)}
a{text-decoration:none;color:inherit}
button{font:inherit;cursor:pointer;border:0}
.hero{background:var(--yellow);min-height:610px;padding:22px 7% 70px;position:relative;overflow:hidden}
.hero:after{content:"";position:absolute;width:500px;height:500px;border-radius:50%;background:rgba(255,255,255,.14);right:-130px;top:-180px}
nav{display:flex;align-items:center;gap:28px;max-width:1150px;margin:auto;position:relative;z-index:2}
.logo{font-weight:900;font-size:1.3rem;margin-right:auto}
nav a{font-weight:700}
.cart-link{background:var(--dark);color:white;border-radius:999px;padding:11px 17px}
#cartCount{background:var(--yellow);color:var(--dark);border-radius:99px;padding:2px 7px;margin-left:4px}
.hero-content{max-width:1150px;margin:100px auto 0;display:flex;align-items:center;justify-content:space-between;gap:60px;position:relative;z-index:1}
.badge,.eyebrow{font-size:.8rem;font-weight:900;letter-spacing:.12em}
.badge{background:rgba(255,255,255,.55);padding:9px 13px;border-radius:999px}
h1{font-size:clamp(3rem,7vw,6.2rem);line-height:.92;margin:24px 0}
h1 strong{color:white}
.hero p{font-size:1.2rem;max-width:520px;line-height:1.6}
.btn,.pay{display:inline-block;background:var(--dark);color:white;border-radius:12px;padding:15px 22px;font-weight:800;margin-top:15px}
.bee-card{width:310px;height:310px;border-radius:40px;background:#fff8d6;display:flex;flex-direction:column;align-items:center;justify-content:center;font-size:7rem;box-shadow:var(--shadow);transform:rotate(3deg)}
.bee-card span{font-size:1rem;font-weight:900;transform:rotate(-3deg)}
.section{max-width:1150px;margin:auto;padding:90px 7%}
.eyebrow{color:#a47b00}
h2{font-size:3rem;margin:8px 0 35px}
.products{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.product{background:white;border-radius:24px;padding:22px;box-shadow:var(--shadow)}
.jar{height:210px;background:var(--yellow);border-radius:18px;display:flex;align-items:center;justify-content:center;font-size:6rem}
.product h3{font-size:1.3rem;margin-bottom:6px}
.product p{color:#756b4c;min-height:48px}
.product-bottom{display:flex;justify-content:space-between;align-items:center}
.product-bottom strong{font-size:1.2rem}
.product-bottom button{background:var(--yellow);border-radius:10px;padding:10px 14px;font-weight:800}
.values{background:var(--dark);color:white;padding:70px 7%;display:grid;grid-template-columns:repeat(3,1fr);gap:35px;text-align:center}
.values span{font-size:2.5rem}.values p{color:#d6ceb0;line-height:1.5}
.modal{position:fixed;inset:0;background:rgba(20,16,0,.55);display:flex;align-items:center;justify-content:center;padding:20px;z-index:10}
.hidden{display:none}
.modal-box{background:white;width:min(520px,100%);border-radius:24px;padding:30px;position:relative}
.close{position:absolute;right:18px;top:12px;background:none;font-size:2rem}
.cart-row{display:flex;justify-content:space-between;gap:12px;padding:12px 0;border-bottom:1px solid #eee}
.qty button{background:#f4edcf;border-radius:7px;width:30px;height:30px}
.total{display:flex;justify-content:space-between;font-size:1.2rem;padding:20px 0}
.modal input{width:100%;padding:14px;border:1px solid #ddd;border-radius:10px;margin-bottom:10px}
.pay{width:100%;margin-top:5px}
.secure{text-align:center;color:#777;font-size:.85rem}
.error{color:#a00;font-weight:700}
.success-page{min-height:100vh;display:grid;place-items:center}
.success-box{background:white;border-radius:30px;padding:50px;max-width:600px;text-align:center;box-shadow:var(--shadow);margin:20px}
.success-icon{font-size:5rem}
@media(max-width:800px){
  nav a{display:none}.hero{min-height:auto}.hero-content{margin-top:70px;flex-direction:column;align-items:flex-start}
  .bee-card{width:220px;height:220px;font-size:5rem;align-self:center}
  .products,.values{grid-template-columns:1fr}
}