:root { --ink:#060606; --panel:#10100f; --gold:#e3b153; --gold-soft:#f1d28e; --red:#b91317; --cream:#f5efe5; --muted:#b8b1a6; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--ink); color:var(--cream); font-family:Tahoma,Arial,sans-serif; }
a { color:inherit; text-decoration:none; }
button,input,select,textarea { font:inherit; }
main { overflow:hidden; background:radial-gradient(circle at 50% 4%,#2a0808 0,#080808 27rem,#050505 70rem); }
.section-shell { width:min(1180px,calc(100% - 40px)); margin-inline:auto; position:relative; }
.top-note { text-align:center; padding:10px 16px; color:#160d02; font-weight:800; background:linear-gradient(90deg,#9a641e,#f5d58c,#a96d20); letter-spacing:.02em; }
.hero { min-height:780px; display:grid; grid-template-columns:1.02fr .98fr; align-items:center; padding-block:92px 110px; }
.hero::before { content:""; position:absolute; inset:5% -20% 0 45%; background:radial-gradient(ellipse,rgba(187,23,23,.25),transparent 62%); filter:blur(12px); }
.hero::after { content:""; position:absolute; left:-22%; bottom:-18%; width:76%; height:38%; border:2px solid rgba(202,31,27,.38); border-radius:50%; box-shadow:0 0 70px rgba(205,24,18,.25),inset 0 0 55px rgba(0,0,0,.9); transform:rotate(-10deg); }
.hero-copy { position:relative; z-index:3; }
.eyebrow,.section-heading span { display:inline-block; color:var(--gold); font-weight:800; letter-spacing:.12em; font-size:.84rem; }
h1 { margin:18px 0 22px; font-size:clamp(3.2rem,7.5vw,6.6rem); line-height:.98; letter-spacing:-.055em; }
h1 em { color:var(--gold); font-style:normal; text-shadow:0 8px 35px rgba(218,158,49,.2); }
.hero-copy>p { max-width:620px; color:#d0c8bd; font-size:1.22rem; line-height:1.9; }
.hero-actions { display:flex; gap:12px; margin-top:34px; }
.primary-button,.ghost-button { min-width:155px; padding:15px 25px; border-radius:8px; text-align:center; font-weight:900; transition:.2s ease; }
.primary-button { color:white; background:linear-gradient(135deg,#d42424,#8e080c); box-shadow:0 12px 38px rgba(183,15,18,.35); }
.ghost-button { border:1px solid rgba(227,177,83,.45); color:var(--gold-soft); background:rgba(255,255,255,.025); }
.primary-button:hover,.ghost-button:hover { transform:translateY(-2px); }
.micro-trust { display:flex; flex-wrap:wrap; gap:18px; margin-top:24px; color:#9f988d; font-size:.85rem; }
.product-stage { position:relative; z-index:2; height:610px; display:grid; place-items:center; }
.product-stage img { position:relative; z-index:2; width:min(390px,80%); max-height:570px; object-fit:contain; filter:drop-shadow(0 30px 32px rgba(0,0,0,.75)); border-radius:4px; }
.halo { position:absolute; width:520px; height:520px; border-radius:50%; background:radial-gradient(circle,rgba(224,169,70,.33) 0,rgba(170,15,17,.22) 35%,transparent 68%); filter:blur(8px); }
.stage-shadow { position:absolute; bottom:35px; width:75%; height:50px; background:black; filter:blur(18px); border-radius:50%; }
.shipping-badge { position:absolute; z-index:4; left:3%; bottom:68px; display:flex; align-items:center; gap:13px; padding:14px 22px; border:1px solid var(--gold); border-radius:13px; color:#f8dd9d; background:linear-gradient(135deg,rgba(145,6,10,.96),rgba(75,3,5,.96)); box-shadow:0 14px 40px rgba(0,0,0,.45); }
.shipping-badge b { color:white; font-size:1.05rem; }
.truck { color:var(--gold); font-size:1.65rem; }
.ember { position:absolute; width:4px; height:4px; background:#ff7028; box-shadow:0 0 22px 5px #b32312; border-radius:50%; }
.ember-one { top:15%; left:5%; }.ember-two { top:34%; right:8%; }
.problem,.ingredients,.benefits,.order-section { padding-block:105px; }
.problem { border-top:1px solid rgba(227,177,83,.17); }
.section-heading { max-width:760px; margin:0 auto 50px; text-align:center; }
.section-heading h2,.order-copy h2 { margin:12px 0 16px; font-size:clamp(2.1rem,4.4vw,3.8rem); line-height:1.2; }
.section-heading p,.order-copy p { color:var(--muted); line-height:1.9; font-size:1.04rem; }
.problem-grid,.ingredient-grid,.benefits-grid { display:grid; gap:18px; }
.problem-grid { grid-template-columns:repeat(3,1fr); }
.problem-grid article,.ingredient-grid article { border:1px solid rgba(227,177,83,.2); background:linear-gradient(150deg,rgba(255,255,255,.055),rgba(255,255,255,.012)); }
.problem-grid article { padding:34px; border-radius:18px; }
.problem-grid i { display:grid; place-items:center; width:52px; height:52px; color:#170c02; background:var(--gold); border-radius:50%; font-size:1.6rem; font-style:normal; font-weight:900; }
.problem-grid h3,.ingredient-grid h3,.benefit-card h3 { margin:22px 0 8px; color:var(--gold-soft); font-size:1.25rem; }
.problem-grid p,.ingredient-grid p,.benefit-card p { margin:0; color:var(--muted); line-height:1.75; }
.ingredients { padding-inline:28px; border-radius:35px; background:radial-gradient(circle at 100% 0,rgba(69,96,37,.17),transparent 40%),#0b0c0a; border:1px solid rgba(227,177,83,.16); }
.ingredient-grid { grid-template-columns:repeat(3,1fr); }
.ingredient-grid article { display:flex; align-items:center; gap:18px; padding:24px; border-radius:15px; }
.ingredient-icon { flex:0 0 64px; height:64px; display:grid; place-items:center; border-radius:14px; color:#151006; background:linear-gradient(145deg,#f0d890,#9d7226); font-size:1.7rem; font-weight:900; }
.ingredient-grid h3 { margin:0 0 6px; }
.benefits-grid { grid-template-columns:repeat(4,1fr); }
.benefit-card { min-height:320px; padding:28px; display:flex; flex-direction:column; justify-content:flex-end; position:relative; overflow:hidden; border-radius:18px; border:1px solid rgba(227,177,83,.32); background:linear-gradient(180deg,rgba(0,0,0,.1),rgba(0,0,0,.96)),radial-gradient(circle at 50% 15%,#581412,#111); }
.benefit-card::after { content:""; position:absolute; inset:0; background:linear-gradient(125deg,transparent 30%,rgba(227,177,83,.09) 50%,transparent 70%); }
.benefit-card i,.benefit-card h3,.benefit-card p { position:relative; z-index:1; }
.benefit-card i { width:55px; height:55px; display:grid; place-items:center; border:1px solid var(--gold); border-radius:50%; color:var(--gold); font-style:normal; font-size:1.35rem; }
.benefit-number { position:absolute; top:12px; left:18px; color:rgba(227,177,83,.15); font-size:4rem; font-weight:900; }
.card-2 { background:linear-gradient(180deg,rgba(0,0,0,.2),rgba(0,0,0,.96)),radial-gradient(circle at 45% 20%,#50411d,#111); }
.card-3 { background:linear-gradient(180deg,rgba(0,0,0,.2),rgba(0,0,0,.96)),radial-gradient(circle at 45% 20%,#532323,#111); }
.card-4 { background:linear-gradient(180deg,rgba(0,0,0,.2),rgba(0,0,0,.96)),radial-gradient(circle at 45% 20%,#183621,#111); }
.trust-section { padding:58px 0; background:linear-gradient(135deg,#06162a,#082644 48%,#06172b); border-block:1px solid rgba(227,177,83,.45); }
.trust-grid { display:grid; grid-template-columns:repeat(4,1fr); }
.trust-grid article { min-height:125px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:9px; text-align:center; border-left:1px solid rgba(227,177,83,.26); }
.trust-grid article:last-child { border-left:0; }
.trust-grid strong { width:60px; height:60px; display:grid; place-items:center; border:2px solid var(--gold); border-radius:50%; color:var(--gold-soft); font-size:1.2rem; }
.trust-grid span { color:#e8e4dc; font-weight:700; }
.order-section { display:grid; grid-template-columns:.9fr 1.1fr; gap:70px; align-items:center; }
.delivery-chip { display:inline-block; margin-top:22px; padding:12px 18px; color:#f2d48c; border:1px solid rgba(227,177,83,.38); border-radius:99px; }
form { display:grid; grid-template-columns:1fr 1fr; gap:16px; padding:30px; border:1px solid rgba(227,177,83,.28); border-radius:22px; background:#10100f; box-shadow:0 30px 70px rgba(0,0,0,.4); }
label { display:grid; gap:8px; color:#d9cdbb; font-size:.9rem; font-weight:700; }
label:first-child,.full-field,form button,.success-note { grid-column:1/-1; }
input,select,textarea { width:100%; padding:14px 15px; color:white; border:1px solid #34302b; border-radius:9px; outline:0; background:#080808; }
textarea { resize:vertical; line-height:1.6; }
input:focus,select:focus,textarea:focus { border-color:var(--gold); box-shadow:0 0 0 3px rgba(227,177,83,.08); }
form button { padding:15px; border:0; border-radius:9px; color:white; background:linear-gradient(135deg,#d42424,#8e080c); font-weight:900; cursor:pointer; }
.availability-note { grid-column:1/-1; padding:12px 14px; border:1px dashed #3a3530; border-radius:9px; background:#0a0a0a; color:#a9a29a; font-size:.85rem; text-align:center; }
.availability-note.available { border-color:rgba(95,170,89,.45); background:rgba(48,110,43,.1); color:#a8dda5; }
select:disabled { cursor:not-allowed; opacity:.55; }
.success-note { margin:0; text-align:center; color:#9fdb9b; }
footer { padding:46px 20px 105px; text-align:center; border-top:1px solid #211d18; color:#807a71; }
footer b { color:var(--gold); letter-spacing:.08em; }
footer p { max-width:720px; margin:18px auto 0; line-height:1.8; font-size:.82rem; }
.mobile-cta { display:none; }
@media (max-width:850px) {
  .section-shell { width:min(100% - 26px,660px); }
  .hero { grid-template-columns:1fr; padding-block:62px 95px; text-align:center; }
  .hero-copy>p { margin-inline:auto; }.hero-actions,.micro-trust { justify-content:center; }
  .product-stage { height:500px; margin-top:22px; }.product-stage img { width:min(340px,76%); max-height:470px; }
  .shipping-badge { left:50%; bottom:28px; transform:translateX(-50%); width:max-content; }
  .problem-grid,.ingredient-grid { grid-template-columns:1fr; }.benefits-grid { grid-template-columns:1fr 1fr; }
  .order-section { grid-template-columns:1fr; gap:35px; }.order-copy { text-align:center; }
}
@media (max-width:560px) {
  .top-note { font-size:.82rem; }h1 { font-size:3.45rem; }.hero-copy>p { font-size:1rem; }.hero-actions { flex-direction:column; }
  .product-stage { height:450px; }.halo { width:360px; height:360px; }
  .problem,.ingredients,.benefits,.order-section { padding-block:75px; }.ingredients { padding-inline:16px; }
  .benefits-grid { grid-template-columns:1fr; }.benefit-card { min-height:250px; }
  .trust-grid { grid-template-columns:1fr 1fr; gap:24px 0; }.trust-grid article:nth-child(2) { border-left:0; }
  form { grid-template-columns:1fr; padding:20px; }label,label:first-child,.full-field,form button,.success-note { grid-column:1; }
  .mobile-cta { display:block; position:fixed; z-index:20; left:16px; right:16px; bottom:14px; padding:15px; text-align:center; border-radius:10px; color:white; background:linear-gradient(135deg,#d92929,#87070b); box-shadow:0 10px 30px rgba(0,0,0,.6); font-weight:900; }
}
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; }* { transition:none!important; } }
