:root{ --mango-25:#FFF7ED; --mango-50:#FFEFD6; --mango-100:#FED7AA; --mango-200:#FDBA74; --mango-300:#FB923C; --mango-400:#F97316; --mango-500:#EA580C; --slate-100:#F1F5F9; --slate-200:#E2E8F0; --slate-500:#64748B; --slate-600:#475569; --slate-700:#334155; --slate-800:#1F2937; }
*{box-sizing:border-box}
html,body{margin:0;padding:0;font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,"Helvetica Neue",Arial,"Noto Sans",sans-serif;color:var(--slate-800);background:#fff}
a{color:inherit;text-decoration:none}
.container{max-width:1200px;margin:0 auto;padding:0 20px}
.btn{display:inline-flex;align-items:center;justify-content:center;padding:12px 18px;border-radius:14px;font-weight:600}
.btn-primary{background:linear-gradient(90deg,var(--mango-200),var(--mango-400));color:#fff;box-shadow:0 6px 18px rgba(249,115,22,.28)}
.btn-ghost{border:1px solid var(--mango-100);background:transparent}
.card{border:1px solid var(--slate-500);border-radius:18px;background:#fff}
header.sticky{position:sticky;top:46px;background:rgba(255,255,255,.9);backdrop-filter:saturate(180%) blur(8px);border-bottom:1px solid var(--slate-200);z-index:50}
.menu{display:flex;align-items:center;gap:16px}
.menu a:hover{color:var(--mango-500)}
.hero{position:relative;overflow:hidden}
.blob{position:absolute;border-radius:9999px;filter:blur(60px);opacity:.6;z-index:-1}
.blob.left{left:-120px;top:-120px;width:320px;height:320px;background:linear-gradient(135deg,var(--mango-50),var(--mango-100))}
.blob.right{right:-120px;bottom:-120px;width:320px;height:320px;background:linear-gradient(135deg,var(--mango-50),var(--mango-100))}
h1{font-size:38px;line-height:1.15;margin:0}
@media(min-width:960px){h1{font-size:52px}}
h2{font-size:32px;margin:0}
h3{margin:0;font-size:20px}
p{line-height:1.6}
.grid{display:grid;gap:24px}
.grid-2{grid-template-columns:1fr}
.grid-3{grid-template-columns:1fr}
@media(min-width:900px){.grid-2{grid-template-columns:1fr 1fr}.grid-3{grid-template-columns:repeat(3,1fr)}}
.aspect-video{position:relative;padding-top:56%}
.aspect-video > div{position:absolute;inset:0}
.hero-img{background:linear-gradient(135deg,#fff,var(--mango-25));display:flex;align-items:center;justify-content:center}
.section{padding:72px 0}
.muted{color:var(--slate-600)}
.section.alt{background:linear-gradient(180deg,#fff,var(--mango-25))}
.pricing{display:grid;gap:24px;justify-content:center}
@media(min-width:900px){.pricing{grid-template-columns:repeat(3,minmax(280px,360px))}}
.price-card{position:relative;padding:28px;border:1px solid var(--mango-100);border-radius:20px;background:#fff;transition:transform 0.3s ease}
.price-card.featured{border-color:#10b981;border-width:2px;box-shadow:0 20px 50px rgba(16,185,129,.25);transform:scale(1.05);z-index:10}
.price{font-size:40px;font-weight:800}
.strike{text-decoration:line-through;font-size:14px;margin-left:6px;color:var(--slate-600)}
ul.clean{list-style:none;padding:0;margin:14px 0}
ul.clean li{display:flex;gap:10px;margin:10px 0}
.check{width:18px;height:18px;border-radius:50%;background:linear-gradient(135deg,var(--mango-200),var(--mango-400));display:flex;align-items:center;justify-content:center;flex-shrink:0;color:#fff;font-size:12px;font-weight:bold}
details{border-bottom:1px solid var(--slate-200)}
summary{cursor:pointer;padding:16px 0;font-weight:600;list-style:none}
summary::-webkit-details-marker{display:none}
footer{border-top:1px solid var(--slate-200)}
.mobile{display:none}
@media(max-width:899px){.desktop{display:none!important}.mobile{display:block}}
.blurred{filter:blur(2px);opacity:0.6;pointer-events:none}
.september-special{background:linear-gradient(135deg,var(--mango-100),var(--mango-200));border:2px solid var(--mango-300);color:var(--slate-800)}
.cookie-banner{position:fixed;bottom:0;left:0;right:0;background:rgba(255,255,255,0.95);backdrop-filter:blur(8px);border-top:1px solid var(--slate-200);padding:16px 0;z-index:100;box-shadow:0 -4px 12px rgba(0,0,0,0.1)}
.cookie-banner.hidden{display:none}
.cert-btn{padding:16px 20px;text-align:center;flex-direction:column;gap:4px;background:linear-gradient(135deg,var(--mango-200),var(--mango-400));color:#fff;box-shadow:0 4px 12px rgba(249,115,22,.25);transition:all 0.2s ease;min-width:280px;border:none;text-shadow:0 1px 2px rgba(0,0,0,0.3)}
.cert-btn:hover{transform:translateY(-4px);box-shadow:0 8px 20px rgba(249,115,22,.35)}
.carousel-container{position:relative;overflow:hidden}
.carousel-track{position:relative;width:100%}
.carousel-slide{display:none;animation:fadeIn 0.5s ease-in-out}
.carousel-slide.active{display:block}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
.carousel-btn{position:absolute;top:50%;transform:translateY(-50%);background:rgba(255,255,255,0.9);border:1px solid var(--slate-200);color:var(--slate-800);width:48px;height:48px;border-radius:50%;font-size:24px;cursor:pointer;transition:all 0.2s ease;display:flex;align-items:center;justify-content:center;z-index:10;box-shadow:0 2px 8px rgba(0,0,0,0.1)}
.carousel-btn:hover{background:#fff;box-shadow:0 4px 12px rgba(0,0,0,0.15);color:var(--mango-500)}
.carousel-prev{left:-60px}
.carousel-next{right:-60px}
@media(max-width:1100px){.carousel-prev{left:10px}.carousel-next{right:10px}}
.carousel-dot{width:12px;height:12px;border-radius:50%;background:var(--slate-200);border:none;cursor:pointer;transition:all 0.3s ease;padding:0}
.carousel-dot:hover{background:var(--mango-300)}
.carousel-dot.active{background:var(--mango-400);width:32px;border-radius:6px}
.promo-banner{display:block;background:linear-gradient(90deg,var(--mango-200),var(--mango-400));color:#fff;text-align:center;padding:12px 20px;font-size:14px;font-weight:600;text-decoration:none;box-shadow:0 2px 8px rgba(249,115,22,0.25);transition:all 0.2s ease;text-shadow:0 1px 2px rgba(0,0,0,0.1);position:sticky;top:0;z-index:100}
.promo-banner:hover{background:linear-gradient(90deg,var(--mango-300),var(--mango-500));box-shadow:0 4px 12px rgba(249,115,22,0.35)}
@media(min-width:768px){.promo-banner{font-size:15px;padding:14px 20px}}