:root { --zevx-red:#ff3048; --zevx-line:rgba(255,255,255,.1); }
html { scroll-behavior:smooth; }
body { background:#08080a; color:#f8f8f8; }
.zevx-hero { position:relative; isolation:isolate; padding:clamp(4rem,10vw,8rem) 1rem clamp(3rem,7vw,5rem); overflow:hidden; }
.zevx-hero::before { content:""; position:absolute; inset:0; z-index:-2; background:radial-gradient(circle at 75% 30%,rgba(255,48,72,.22),transparent 34%),linear-gradient(180deg,#11090d,#08080a 80%); }
.zevx-hero h1 { max-width:780px; margin:1rem auto; font-size:clamp(2.5rem,7vw,5.5rem); line-height:1.02; letter-spacing:-.055em; }
.zevx-hero h1 span { color:var(--zevx-red); }
.zevx-hero p { max-width:650px; margin:0 auto 2rem; color:#bcbcc4; font-size:clamp(1rem,2vw,1.2rem); }
.zevx-trust { display:grid; grid-template-columns:repeat(4,1fr); gap:1px; margin:1rem auto 3rem; max-width:1100px; border:1px solid var(--zevx-line); border-radius:1rem; overflow:hidden; background:var(--zevx-line); }
.zevx-trust-item { padding:1.1rem; background:#111115; display:flex; gap:.65rem; align-items:center; color:#ddd; font-size:.92rem; }
.zevx-trust-item i { color:var(--zevx-red); width:1.1rem; }
.zevx-section-intro { max-width:720px; margin:0 auto 2rem; text-align:center; }
.zevx-section-intro h2 { font-size:clamp(1.8rem,4vw,2.7rem); letter-spacing:-.04em; margin-bottom:.55rem; }
.zevx-section-intro p { color:#aaaab3; }
.zevx-steps { display:grid; grid-template-columns:repeat(3,1fr); gap:1rem; max-width:1100px; margin:0 auto; }
.zevx-step { background:linear-gradient(145deg,#151519,#0d0d10); border:1px solid var(--zevx-line); border-radius:1rem; padding:1.4rem; }
.zevx-step b { color:var(--zevx-red); font:700 1.7rem/1 Kanit,sans-serif; }
.zevx-step h3 { margin:.8rem 0 .35rem; }
.zevx-step p,.zevx-info-card p,.zevx-info-card li { color:#aaaab3; line-height:1.65; }
.zevx-info-grid { display:grid; grid-template-columns:1.1fr .9fr; gap:1.25rem; }
.zevx-info-card { border:1px solid var(--zevx-line); border-radius:1rem; background:#101014; padding:clamp(1.25rem,4vw,2.4rem); }
.zevx-faq { max-width:850px; margin:auto; }
.zevx-faq details { border-bottom:1px solid var(--zevx-line); padding:1rem 0; }
.zevx-faq summary { cursor:pointer; font-weight:650; list-style:none; display:flex; justify-content:space-between; gap:1rem; }
.zevx-faq summary::-webkit-details-marker { display:none; }
.zevx-faq summary::after { content:'+'; color:var(--zevx-red); font-size:1.25rem; }
.zevx-faq details[open] summary::after { content:'−'; }
.zevx-faq p { color:#aaaab3; margin:.75rem 0 0; }
.zevx-whatsapp { position:fixed; right:1.1rem; bottom:1.1rem; z-index:40; width:3.35rem; height:3.35rem; border-radius:50%; display:grid; place-items:center; background:#25d366; color:#04180b; box-shadow:0 8px 30px #0008; }
.zevx-quantity-picker { display:none; align-items:center; justify-content:space-between; gap:.5rem; margin:.8rem 0; color:#aaaab3; font-size:.78rem; }
.zevx-quantity-picker.is-visible { display:flex; }
.zevx-quantity-picker > div { display:flex; align-items:center; border:1px solid var(--zevx-line); border-radius:.5rem; overflow:hidden; }
.zevx-quantity-picker button { width:1.9rem; height:1.9rem; border:0; background:#1a171b; color:#fff; cursor:pointer; font-size:1.1rem; }
.zevx-quantity-picker button:hover { background:#34131d; color:var(--zevx-red); }
.zevx-quantity-picker input { width:2.3rem; height:1.9rem; border:0; border-left:1px solid var(--zevx-line); border-right:1px solid var(--zevx-line); background:#0c0c0f; color:#fff; text-align:center; }
.zevx-quantity-picker input::-webkit-inner-spin-button { opacity:1; }
.zevx-delivery-badge { display:inline-flex; align-items:center; gap:.35rem; width:max-content; margin:.35rem 0 .55rem; padding:.28rem .55rem; border:1px solid rgba(53,209,139,.35); border-radius:999px; background:rgba(53,209,139,.1); color:#78e9b3; font-size:.7rem; font-weight:700; }
.zevx-qty-modal { display:none; position:fixed; inset:0; z-index:100; align-items:center; justify-content:center; padding:1rem; }
.zevx-qty-modal.is-open { display:flex; }
.zevx-qty-backdrop { position:absolute; inset:0; background:rgba(0,0,0,.78); backdrop-filter:blur(5px); }
.zevx-qty-dialog { position:relative; width:min(390px,100%); padding:1.5rem; border:1px solid #54202c; border-radius:1rem; background:#111115; box-shadow:0 20px 80px #000; text-align:center; }
.zevx-qty-dialog h2 { margin:.2rem 0 .5rem; }
.zevx-qty-product { color:#b9b9c2; font-size:.9rem; }
.zevx-qty-close { position:absolute; right:.7rem; top:.55rem; border:0; background:transparent; color:#aaa; font-size:1.5rem; cursor:pointer; }
.zevx-qty-controls { display:flex; justify-content:center; align-items:center; margin:1.25rem 0; }
.zevx-qty-controls button { width:2.7rem; height:2.7rem; border:1px solid #3d222a; background:#21151a; color:#fff; font-size:1.3rem; cursor:pointer; }
.zevx-qty-controls input { width:4rem; height:2.7rem; border:1px solid #3d222a; background:#0a0a0c; color:#fff; text-align:center; font-size:1.1rem; }
.zevx-qty-confirm { width:100%; justify-content:center; }
:focus-visible { outline:2px solid var(--zevx-red); outline-offset:3px; }
@media (max-width:800px) { .zevx-trust,.zevx-steps { grid-template-columns:repeat(2,1fr); } .zevx-info-grid { grid-template-columns:1fr; } }
@media (max-width:520px) { .zevx-trust,.zevx-steps { grid-template-columns:1fr; } }