/* Moolineo — CSS (basé sur maquette) */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
:root{
    --white:#fff;--g50:#f8fafc;--g100:#f1f5f9;--g200:#e2e8f0;--g300:#cbd5e1;
    --g400:#94a3b8;--g500:#64748b;--g600:#475569;--g700:#334155;--g800:#1e293b;--g900:#0f172a;
    --em50:#ecfdf5;--em100:#d1fae5;--em500:#10b981;--em600:#059669;--em700:#047857;
    --bl50:#eff6ff;--bl100:#dbeafe;--bl500:#3b82f6;--bl600:#2563eb;
    --or400:#fb923c;--or500:#f97316;--or600:#ea580c;
    --am50:#fffbeb;--am400:#fbbf24;--am500:#f59e0b;
    --rd50:#fef2f2;--rd500:#ef4444;
}
html{scroll-behavior:smooth;font-size:16px;-webkit-font-smoothing:antialiased}
body{font-family:'Inter',system-ui,sans-serif;background:var(--g50);color:var(--g700);line-height:1.6;overflow-x:hidden}
h1,h2,h3{font-family:'Plus Jakarta Sans','Inter',sans-serif;color:var(--g900);line-height:1.2}
a{color:var(--bl600);text-decoration:none}
img{max-width:100%;height:auto;display:block}
ul,ol{list-style:none}
button{cursor:pointer;border:none;background:none;font:inherit}
input{font:inherit}
.wrap{max-width:1140px;margin:0 auto;padding:0 24px}
.wrap-sm{max-width:800px;margin:0 auto;padding:0 24px}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* ===== SCROLL PROGRESS ===== */
.scroll-progress{position:fixed;top:0;left:0;height:3px;background:linear-gradient(90deg,var(--em500),var(--bl500));z-index:101;width:0;transition:width .1s linear;pointer-events:none}

/* ===== TOPBAR ===== */
.topbar{background:linear-gradient(135deg,var(--em600),var(--bl600));color:#fff;text-align:center;padding:9px 20px;font-size:.82rem;font-weight:500}
.topbar strong{font-weight:700}

/* ===== NAV ===== */
.nav{background:rgba(255,255,255,.92);border-bottom:1px solid var(--g200);position:sticky;top:0;z-index:100;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);overflow:visible}
.nav .inner{max-width:1140px;margin:0 auto;padding:12px 24px;display:flex;align-items:center;justify-content:space-between;gap:12px}
.nav .brand{font-family:'Plus Jakarta Sans',sans-serif;font-weight:800;font-size:1.05rem;color:var(--g900);display:flex;align-items:center;gap:8px;text-decoration:none}
.nav .brand img{max-width:140px;height:auto}
.nav-right{display:flex;align-items:center;gap:16px}
.nav-cta{display:inline-flex;align-items:center;padding:8px 18px;font-size:.82rem;border-radius:8px;background:var(--or500);color:#fff;font-weight:700;border:none;cursor:pointer;font-family:'Inter',sans-serif;transition:background .15s;text-decoration:none;white-space:nowrap}
.nav-cta:hover{background:var(--or600);color:#fff}

/* Nav dropdown */
.nav-dd{position:relative}
.nav-dd-toggle{display:flex;align-items:center;gap:4px;font-size:.82rem;font-weight:500;color:var(--g600);cursor:pointer;background:none;border:none;padding:6px 10px;border-radius:6px;transition:background .15s}
.nav-dd-toggle:hover{background:var(--g100)}
.nav-dd-toggle svg{width:14px;height:14px;transition:transform .2s}
.nav-dd.open .nav-dd-toggle svg{transform:rotate(180deg)}
.nav-dd-menu{position:absolute;top:calc(100% + 6px);right:0;min-width:180px;background:var(--white);border:1px solid var(--g200);border-radius:10px;box-shadow:0 8px 24px rgba(0,0,0,.1);padding:6px 0;opacity:0;visibility:hidden;transform:translateY(-6px);transition:all .2s;z-index:200;max-height:360px;overflow-y:auto}
.nav-dd.open .nav-dd-menu{opacity:1;visibility:visible;transform:translateY(0)}
.nav-dd-menu a{display:flex;align-items:center;gap:8px;padding:7px 14px;font-size:.82rem;color:var(--g700);transition:background .15s;text-decoration:none}
.nav-dd-menu a:hover{background:var(--g50)}
.nav-dd-menu a.active{color:var(--bl600);font-weight:600}

/* Mobile toggle */
.nav-toggle{display:none;flex-direction:column;gap:5px;padding:8px;cursor:pointer;background:none;border:none}
.nav-toggle span{display:block;width:20px;height:2px;background:var(--g700);border-radius:2px;transition:all .2s}
.nav-toggle.active span:nth-child(1){transform:rotate(45deg) translate(5px,5px)}
.nav-toggle.active span:nth-child(2){opacity:0}
.nav-toggle.active span:nth-child(3){transform:rotate(-45deg) translate(5px,-5px)}

/* ===== HERO ===== */
.hero{position:relative;padding:64px 0 56px;overflow:hidden;background:var(--white);border-bottom:1px solid var(--g100)}
.hero::before{content:'';position:absolute;top:-120px;right:-80px;width:500px;height:500px;border-radius:50%;background:radial-gradient(circle,rgba(16,185,129,.07),transparent 70%);pointer-events:none}
.hero::after{content:'';position:absolute;bottom:-100px;left:-60px;width:400px;height:400px;border-radius:50%;background:radial-gradient(circle,rgba(59,130,246,.06),transparent 70%);pointer-events:none}
.hero-centered{text-align:center;max-width:860px;margin:0 auto;position:relative;z-index:1}
.hero-centered .eyebrow{display:inline-flex;align-items:center;gap:7px;background:var(--em50);border:1px solid var(--em100);border-radius:50px;padding:5px 14px;font-size:.78rem;color:var(--em700);font-weight:600;margin-bottom:20px}
.hero-centered .eyebrow .dot{width:6px;height:6px;background:var(--em500);border-radius:50%;animation:blink 2s infinite}
@keyframes blink{0%,100%{opacity:1}50%{opacity:.3}}
.hero-centered h1{font-size:clamp(2rem,4.5vw,3.2rem);font-weight:900;margin-bottom:16px;letter-spacing:-.02em}
.hero-centered h1 .accent{background:linear-gradient(135deg,var(--em600),var(--bl600));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.hero-centered .sub{font-size:1.05rem;color:var(--g500);line-height:1.7;margin-bottom:28px;max-width:760px;margin-left:auto;margin-right:auto}
.hero-centered .sub strong{color:var(--g700);font-weight:600}

/* ===== CTA BUTTON (shared) ===== */
.btn-cta{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:14px 30px;background:var(--or500);color:#fff;font-size:1rem;font-weight:700;border:none;border-radius:12px;cursor:pointer;transition:all .2s;box-shadow:0 4px 16px rgba(249,115,22,.3);font-family:'Inter',sans-serif;position:relative;overflow:hidden;text-decoration:none}
.btn-cta:hover{background:var(--or600);transform:translateY(-2px);box-shadow:0 8px 24px rgba(249,115,22,.35);color:#fff}
.btn-cta::after{content:'';position:absolute;inset:0;border-radius:12px;animation:pulse 2.5s infinite;pointer-events:none}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(249,115,22,.3)}70%{box-shadow:0 0 0 10px rgba(249,115,22,0)}100%{box-shadow:0 0 0 0 rgba(249,115,22,0)}}
.btn-cta .arr{transition:transform .2s}.btn-cta:hover .arr{transform:translateX(3px)}

/* ===== SECTION HEADING ===== */
.sec-head{text-align:center;margin-bottom:36px}
.sec-head h2{font-size:clamp(1.5rem,3vw,2rem);margin-bottom:8px}
.sec-head .sub{color:var(--g500);font-size:.9rem}
.sec-head .sub .hl{color:var(--em600);font-weight:600}

/* ===== CARDS ===== */
.cards{padding:16px 0 24px}
.card{position:relative;background:var(--white);border:1px solid var(--g200);border-radius:18px;margin-bottom:16px;transition:transform .25s ease,box-shadow .25s ease,opacity .5s ease;overflow:hidden;display:grid;grid-template-columns:56px 1fr auto;align-items:stretch;opacity:0;transform:translateY(20px);text-decoration:none;color:inherit;cursor:pointer}
.card.visible{opacity:1;transform:translateY(0)}
.card:hover{transform:translateY(-3px);box-shadow:0 12px 32px rgba(0,0,0,.07);color:inherit}
.card.visible:hover{transform:translateY(-3px)}
.card.top-1{border-color:var(--am400);box-shadow:0 0 0 1px #fde68a,0 2px 8px rgba(251,191,36,.12)}
.card.top-1.visible:hover{box-shadow:0 0 0 1px #fde68a,0 12px 32px rgba(251,191,36,.15)}

/* Rank column */
.card-rank{display:flex;align-items:center;justify-content:center;background:var(--g50);border-right:1px solid var(--g100);font-family:'Plus Jakarta Sans',sans-serif;font-weight:900;font-size:1.3rem;color:var(--g400);min-height:100%}
.card.top-1 .card-rank{background:linear-gradient(180deg,#fef3c7,#fffbeb);border-right-color:#fde68a;color:var(--am500);font-size:1.5rem}
.card.top-2 .card-rank{background:var(--g100);color:var(--g500)}
.card.top-3 .card-rank{background:#fff7ed;border-right-color:#fed7aa;color:var(--or400)}

/* Card center */
.card-center{padding:20px 24px;display:flex;flex-direction:column;gap:10px}
.card-head{display:flex;align-items:center;gap:12px}
.card-logo{width:56px;height:42px;border-radius:11px;display:flex;align-items:center;justify-content:center;font-size:.95rem;font-weight:800;flex-shrink:0;color:#fff;overflow:hidden;aspect-ratio:4/3}
.card-logo img{width:100%;height:100%;object-fit:cover}
.bg-bl{background:linear-gradient(135deg,#3b82f6,#2563eb)}.bg-gn{background:linear-gradient(135deg,#10b981,#059669)}
.bg-vi{background:linear-gradient(135deg,#8b5cf6,#7c3aed)}.bg-rs{background:linear-gradient(135deg,#f43f5e,#e11d48)}
.bg-cy{background:linear-gradient(135deg,#06b6d4,#0891b2)}.bg-am{background:linear-gradient(135deg,#f59e0b,#d97706)}
.bg-in{background:linear-gradient(135deg,#6366f1,#4f46e5)}.bg-tl{background:linear-gradient(135deg,#14b8a6,#0d9488)}
.card-info h3{font-size:1.1rem;font-weight:800;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.card-info .stars{display:flex;align-items:center;gap:5px;font-size:.82rem;margin-top:1px}
.card-info .stars .si{color:var(--am400);letter-spacing:1px;font-size:.85rem}
.card-info .stars .sn{font-weight:700;color:var(--g900)}.card-info .stars .sc{color:var(--g400);font-size:.78rem}

.card-mid{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.tag{font-size:.72rem;padding:3px 9px;background:var(--g50);border:1px solid var(--g200);border-radius:6px;color:var(--g600);white-space:nowrap;font-weight:500}
.card-desc{font-size:.85rem;color:var(--g500);line-height:1.6}

.gauge{display:flex;align-items:center;gap:10px}
.gauge-lbl{font-size:.73rem;font-weight:600;color:var(--rd500);white-space:nowrap}
.gauge-track{flex:1;height:5px;background:var(--g100);border-radius:5px;overflow:hidden;max-width:180px}
.gauge-bar{height:100%;border-radius:5px;background:linear-gradient(90deg,var(--or400),var(--rd500));width:0;transition:width 1.6s cubic-bezier(.22,.61,.36,1)}
.gauge-pct{font-size:.72rem;font-weight:700;color:var(--g500)}

/* Card CTA zone */
.card-cta{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:20px 28px;gap:10px;border-left:1px solid var(--g100);background:var(--g50);min-width:200px}
.gain{font-family:'Plus Jakarta Sans',sans-serif;font-size:1.15rem;font-weight:800;color:var(--em700);text-align:center;line-height:1.3}
.gain small{display:block;font-size:.72rem;font-weight:500;color:var(--g500);font-family:'Inter',sans-serif;margin-top:2px}
.card-cta .btn-cta{padding:11px 22px;font-size:.88rem;border-radius:10px;width:100%;box-shadow:0 2px 10px rgba(249,115,22,.28)}
.card-cta .meta{font-size:.72rem;color:var(--g400);text-align:center}
.card-cta .meta .hot{color:var(--or500);font-weight:700}

/* Ribbon */
.ribbon{position:absolute;top:12px;right:12px;background:var(--em500);color:#fff;font-size:.65rem;font-weight:700;padding:3px 9px;border-radius:6px;text-transform:uppercase;letter-spacing:.03em;z-index:2}

/* ===== MID-LIST CTA ===== */
.mid-cta{background:linear-gradient(135deg,var(--bl50),var(--em50));border:1px solid var(--bl100);border-radius:16px;padding:24px 28px;margin-bottom:16px;display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.mid-cta .mid-icon{font-size:1.8rem;flex-shrink:0}
.mid-cta .mid-text{flex:1;min-width:200px}
.mid-cta .mid-text strong{color:var(--g900);font-size:.95rem}
.mid-cta .mid-text p{color:var(--g500);font-size:.82rem;margin-top:2px}
.mid-cta .btn-mid{display:inline-flex;align-items:center;padding:10px 22px;background:var(--bl600);color:#fff;font-size:.82rem;font-weight:700;border:none;border-radius:8px;cursor:pointer;font-family:'Inter',sans-serif;transition:background .15s;white-space:nowrap;text-decoration:none}
.mid-cta .btn-mid:hover{background:var(--bl500);color:#fff}

/* ===== STATS ===== */
.stats-title{text-align:center;font-size:1.2rem;margin:32px 0 16px;color:var(--g900)}
.hero-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:16px}
.stat-card{background:var(--white);border:1px solid var(--g200);border-radius:14px;padding:18px 16px;text-align:center;transition:transform .2s,box-shadow .2s}
.stat-card:hover{transform:translateY(-2px);box-shadow:0 8px 24px rgba(0,0,0,.06)}
.stat-card .stat-icon{font-size:1.3rem;margin-bottom:6px}
.stat-card .stat-val{font-family:'Plus Jakarta Sans',sans-serif;font-size:1.4rem;font-weight:800;color:var(--g900)}
.stat-card .stat-label{font-size:.75rem;color:var(--g500);margin-top:2px}

/* ===== INTRO SEO ===== */
.intro{padding:24px 0}
.intro-box{background:var(--white);border:1px solid var(--g200);border-radius:20px;padding:36px 40px;box-shadow:0 1px 3px rgba(0,0,0,.04)}
.intro-box h2{font-size:1.35rem;margin-bottom:16px}
.intro-box p{color:var(--g600);margin-bottom:12px;font-size:.93rem;line-height:1.75}
.intro-box p strong{color:var(--g800);font-weight:600}

/* ===== HOW ===== */
.how{padding:56px 0;background:var(--white);border-top:1px solid var(--g100);border-bottom:1px solid var(--g100)}
.how h2{text-align:center;font-size:clamp(1.3rem,3vw,1.8rem);margin-bottom:36px}
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.step{text-align:center;padding:28px 20px;background:var(--g50);border:1px solid var(--g100);border-radius:16px;transition:transform .2s}
.step:hover{transform:translateY(-3px)}
.step-num{width:44px;height:44px;border-radius:12px;background:linear-gradient(135deg,var(--bl500),#8b5cf6);color:#fff;font-weight:800;font-size:1.1rem;display:flex;align-items:center;justify-content:center;margin:0 auto 14px;font-family:'Plus Jakarta Sans',sans-serif}
.step h3{font-size:1rem;margin-bottom:6px}.step p{font-size:.85rem;color:var(--g500);line-height:1.6}

/* ===== TRUST ===== */
.trust{padding:56px 0}
.trust h2{text-align:center;font-size:clamp(1.3rem,3vw,1.8rem);margin-bottom:36px}
.trust-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.trust-card{text-align:center;padding:28px 16px;background:var(--white);border:1px solid var(--g200);border-radius:16px;box-shadow:0 1px 2px rgba(0,0,0,.04)}
.trust-card .ti{font-size:1.5rem;margin-bottom:8px}
.trust-card .big{font-family:'Plus Jakarta Sans',sans-serif;font-size:clamp(1.8rem,4vw,2.4rem);font-weight:800;color:var(--g900)}
.trust-card .lbl{font-size:.82rem;color:var(--g500);margin-top:2px}

/* ===== FAQ ===== */
.faq{padding:56px 0;background:var(--white);border-top:1px solid var(--g100)}
.faq h2{text-align:center;font-size:clamp(1.3rem,3vw,1.8rem);margin-bottom:32px}
.faq-item{border:1px solid var(--g200);border-radius:12px;margin-bottom:10px;overflow:hidden;background:var(--white)}
.faq-q{width:100%;background:none;border:none;color:var(--g900);font-family:'Inter',sans-serif;font-size:.9rem;font-weight:600;padding:16px 20px;text-align:left;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:12px}
.faq-q:hover{background:var(--g50)}
.faq-q svg{width:18px;height:18px;flex-shrink:0;color:var(--g400);transition:transform .3s}
.faq-item.open .faq-q svg{transform:rotate(180deg);color:var(--bl500)}
.faq-a{max-height:0;overflow:hidden;transition:max-height .4s ease}
.faq-item.open .faq-a{max-height:400px}
.faq-a-inner{padding:0 20px 16px;color:var(--g500);font-size:.86rem;line-height:1.75}

/* ===== BOTTOM CTA ===== */
.bottom{padding:56px 0}
.bottom-box{background:linear-gradient(135deg,var(--g900),var(--g800));border-radius:24px;padding:48px 40px;text-align:center;position:relative;overflow:hidden}
.bottom-box::before{content:'';position:absolute;top:-60px;right:-40px;width:300px;height:300px;border-radius:50%;background:radial-gradient(circle,rgba(249,115,22,.15),transparent 70%)}
.bottom-box h2{color:#fff;font-size:clamp(1.4rem,3vw,2rem);margin-bottom:10px;position:relative}
.bottom-box p{color:rgba(255,255,255,.65);margin-bottom:28px;font-size:.95rem;position:relative}
.bottom-box .btn-cta{font-size:1rem;padding:15px 36px;box-shadow:0 4px 24px rgba(249,115,22,.4)}

/* ===== FOOTER ===== */
.footer{padding:32px 0;border-top:1px solid var(--g200);text-align:center;font-size:.78rem;color:var(--g400);line-height:1.8}
.footer a{color:var(--g500);text-decoration:none}.footer a:hover{color:var(--g700)}
.footer .disc{max-width:640px;margin:10px auto 0;font-size:.72rem}

/* ===== WIDGET: TOAST ===== */
.toast{position:fixed;bottom:24px;left:24px;z-index:900;background:var(--white);border:1px solid var(--g200);border-radius:14px;padding:14px 18px;box-shadow:0 8px 32px rgba(0,0,0,.12);display:flex;align-items:center;gap:12px;max-width:340px;transform:translateX(-110%);opacity:0;transition:all .5s cubic-bezier(.4,0,.2,1);pointer-events:none}
.toast.show{transform:translateX(0);opacity:1;pointer-events:auto}
.toast-avatar{width:38px;height:38px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:1rem;flex-shrink:0;background:linear-gradient(135deg,var(--em50),var(--bl50));border:2px solid var(--em100)}
.toast-body{flex:1;min-width:0}
.toast-body .toast-name{font-weight:700;color:var(--g900);font-size:.85rem}
.toast-body .toast-msg{font-size:.78rem;color:var(--g500);line-height:1.4;margin-top:1px}
.toast-body .toast-msg strong{color:var(--em600);font-weight:600}
.toast-time{font-size:.68rem;color:var(--g400);margin-top:3px}
.toast-close{position:absolute;top:8px;right:10px;background:none;border:none;color:var(--g400);cursor:pointer;font-size:.9rem;line-height:1;padding:2px}

/* ===== WIDGET: LIVE VISITORS ===== */
.live-badge{position:fixed;bottom:24px;right:24px;z-index:900;background:var(--white);border:1px solid var(--g200);border-radius:50px;padding:8px 16px;box-shadow:0 4px 16px rgba(0,0,0,.08);display:flex;align-items:center;gap:8px;font-size:.8rem;font-weight:500;color:var(--g600);opacity:0;transform:translateY(20px);transition:all .4s ease}
.live-badge.show{opacity:1;transform:translateY(0)}
.live-dot{width:8px;height:8px;border-radius:50%;background:var(--em500);animation:live-pulse 1.5s infinite}
@keyframes live-pulse{0%,100%{box-shadow:0 0 0 0 rgba(16,185,129,.4)}50%{box-shadow:0 0 0 6px rgba(16,185,129,0)}}
.live-badge .live-num{font-weight:700;color:var(--g900)}

/* ===== WIDGET: MOBILE STICKY BOTTOM ===== */
.sticky-bottom{position:fixed;bottom:0;left:0;right:0;z-index:800;background:var(--white);border-top:1px solid var(--g200);padding:10px 16px;display:none;align-items:center;justify-content:space-between;gap:10px;box-shadow:0 -4px 16px rgba(0,0,0,.08);transform:translateY(100%);transition:transform .3s ease}
.sticky-bottom.show{transform:translateY(0)}
.sticky-bottom .sb-text{font-size:.78rem;color:var(--g700);font-weight:600;line-height:1.3}
.sticky-bottom .sb-text small{display:block;font-weight:400;color:var(--g400);font-size:.7rem}
.sticky-bottom .sb-btn{display:inline-flex;align-items:center;gap:4px;padding:10px 20px;background:var(--or500);color:#fff;font-size:.82rem;font-weight:700;border:none;border-radius:8px;cursor:pointer;white-space:nowrap;font-family:'Inter',sans-serif;transition:background .15s;text-decoration:none}
.sticky-bottom .sb-btn:hover{background:var(--or600);color:#fff}

/* ===== EXIT INTENT POPUP ===== */
.exit-overlay{position:fixed;inset:0;background:rgba(0,0,0,.55);z-index:9999;display:none;align-items:center;justify-content:center;padding:20px;backdrop-filter:blur(4px)}
.exit-overlay.active{display:flex}
.exit-popup{background:var(--white);border-radius:20px;max-width:420px;width:100%;padding:36px 28px;text-align:center;position:relative;animation:popIn .35s ease-out;box-shadow:0 25px 60px rgba(0,0,0,.25)}
@keyframes popIn{from{opacity:0;transform:scale(.85) translateY(20px)}to{opacity:1;transform:scale(1) translateY(0)}}
.exit-popup-close{position:absolute;top:12px;right:14px;background:none;border:none;font-size:1.3rem;color:var(--g400);cursor:pointer;width:32px;height:32px;display:flex;align-items:center;justify-content:center;border-radius:50%;transition:background .2s}
.exit-popup-close:hover{background:var(--g100);color:var(--g700)}
.exit-popup-badge{display:inline-flex;align-items:center;gap:6px;background:var(--am50);border:1px solid var(--am400);border-radius:50px;padding:5px 14px;font-size:.75rem;font-weight:700;color:var(--or600);margin-bottom:16px}
.exit-popup-icon{font-size:2.8rem;margin-bottom:12px}
.exit-popup h3{font-size:1.35rem;font-weight:800;color:var(--g900);margin-bottom:8px;font-family:'Plus Jakarta Sans',sans-serif}
.exit-popup p{font-size:.92rem;color:var(--g500);line-height:1.6;margin-bottom:20px}
.exit-popup .btn-cta{display:inline-flex;width:100%;justify-content:center;font-size:1rem;padding:14px 24px}
.exit-popup-sub{font-size:.75rem;color:var(--g400);margin-top:12px}

/* ===== COOKIE BANNER ===== */
.cookie-banner{position:fixed;bottom:1rem;left:1rem;right:1rem;max-width:600px;margin:0 auto;background:var(--white);border:1px solid var(--g200);border-radius:14px;box-shadow:0 8px 32px rgba(0,0,0,.12);padding:16px 20px;z-index:2000;display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.cookie-banner.hidden{display:none}
.cookie-banner p{flex:1;font-size:.82rem;color:var(--g500);min-width:200px}
.cookie-banner p a{color:var(--bl600)}
.cookie-actions{display:flex;gap:8px;flex-shrink:0}
.cookie-actions button{padding:7px 14px;font-size:.78rem;font-weight:600;border-radius:6px;border:none;cursor:pointer;transition:background .15s}
#cookie-decline{background:var(--g100);color:var(--g500)}
#cookie-decline:hover{background:var(--g200)}
#cookie-accept{background:var(--em600);color:#fff}
#cookie-accept:hover{background:var(--em700)}

/* ===== MODAL OVERLAY ===== */
.modal-overlay{position:fixed;inset:0;background:rgba(0,0,0,.5);z-index:2500;display:flex;align-items:center;justify-content:center;padding:1rem;opacity:0;visibility:hidden;transition:all .3s ease}
.modal-overlay.visible{opacity:1;visibility:visible}
.modal-panel{background:var(--white);border-radius:20px;max-width:640px;width:100%;max-height:85vh;overflow-y:auto;box-shadow:0 25px 60px rgba(0,0,0,.2);transform:translateY(20px);transition:transform .3s ease}
.modal-overlay.visible .modal-panel{transform:translateY(0)}
.modal-header{display:flex;align-items:center;justify-content:space-between;padding:18px 24px;border-bottom:1px solid var(--g200)}
.modal-header h5{font-family:'Plus Jakarta Sans',sans-serif;font-weight:700;font-size:1.05rem}
.modal-close{width:32px;height:32px;border-radius:50%;background:var(--g100);display:flex;align-items:center;justify-content:center;cursor:pointer;border:none;color:var(--g500);font-size:1.1rem;transition:all .15s}
.modal-close:hover{background:var(--g200);color:var(--g700)}
.modal-body{padding:24px;font-size:.88rem;line-height:1.75;color:var(--g600)}
.modal-body h6{font-family:'Plus Jakarta Sans',sans-serif;font-weight:700;font-size:.92rem;margin-top:18px;margin-bottom:6px;color:var(--g800)}
.modal-body h6:first-child{margin-top:0}
.modal-body p{margin-bottom:10px}
.modal-body ul{padding-left:1.5rem;margin-bottom:10px}
.modal-body ul li{list-style:disc;font-size:.88rem;color:var(--g600);margin-bottom:4px}
.modal-footer{padding:14px 24px;border-top:1px solid var(--g200);display:flex;justify-content:flex-end}
.btn-modal-close{padding:8px 18px;background:var(--g100);color:var(--g500);font-weight:600;font-size:.82rem;border-radius:8px;border:none;cursor:pointer;transition:all .15s}
.btn-modal-close:hover{background:var(--g200);color:var(--g700)}

/* ===== NO OFFERS ===== */
.no-offers{text-align:center;padding:48px 24px;background:var(--am50);border:1px dashed var(--am400);border-radius:16px;color:var(--g700);font-size:.95rem}

/* ===== ARTICLE PAGE ===== */
.article-page{padding:40px 0 56px}
.article-breadcrumb{font-size:.82rem;color:var(--g400);margin-bottom:24px}
.article-breadcrumb a{color:var(--g500)}.article-breadcrumb a:hover{color:var(--g700)}
.article-breadcrumb .sep{margin:0 6px;color:var(--g300)}
.article-title{font-size:clamp(1.5rem,4vw,2.2rem);font-weight:800;margin-bottom:12px}
.article-date{font-size:.82rem;color:var(--g400);display:flex;align-items:center;gap:6px;margin-bottom:32px}
.article-date svg{flex-shrink:0}
.article-content{font-size:.95rem;color:var(--g600);line-height:1.8}
.article-content h2{font-size:1.3rem;margin:28px 0 12px}
.article-content h3{font-size:1.1rem;margin:24px 0 10px}
.article-content p{margin-bottom:16px}
.article-content ul,.article-content ol{margin:0 0 16px 20px;list-style:revert}
.article-content a{color:var(--bl600)}.article-content a:hover{text-decoration:underline}
.article-content img{border-radius:12px;margin:16px 0}
.article-content blockquote{border-left:3px solid var(--em500);padding:12px 20px;margin:16px 0;background:var(--g50);border-radius:0 8px 8px 0;font-style:italic;color:var(--g500)}
.article-bottom-cta{text-align:center;margin-top:40px;padding-top:32px;border-top:1px solid var(--g200)}

/* ===== 404 PAGE ===== */
.page-404{display:flex;align-items:center;justify-content:center;min-height:60vh;text-align:center;padding:40px 24px}
.page-404 h1{font-size:clamp(4rem,10vw,8rem);font-weight:900;color:var(--g200);line-height:1}
.page-404 h2{font-size:1.3rem;color:var(--g700);margin:8px 0}
.page-404 p{color:var(--g500);margin-bottom:24px;font-size:.95rem}

/* ===== RESPONSIVE: TABLET ===== */
@media(max-width:960px){
    .hero-stats{grid-template-columns:repeat(4,1fr);gap:10px}
    .card{grid-template-columns:44px 1fr}
    .card-cta{grid-column:1/-1;border-left:none;border-top:1px solid var(--g100);flex-direction:row;flex-wrap:wrap;justify-content:center;padding:14px 20px;min-width:0;gap:12px}
    .card-cta .btn-cta{width:auto;padding:10px 22px}
    .gain{font-size:1rem}
    .ribbon{right:12px}
}

/* ===== RESPONSIVE: MOBILE ===== */
@media(max-width:640px){
    .wrap,.wrap-sm{padding:0 16px}
    body{padding-bottom:60px}
    .hero{padding:40px 0 32px}
    .hero-stats{grid-template-columns:1fr 1fr;gap:8px}
    .stat-card{padding:12px 10px}
    .stat-card .stat-icon{font-size:1.1rem;margin-bottom:4px}
    .stat-card .stat-val{font-size:1.1rem}
    .stat-card .stat-label{font-size:.68rem}
    .intro-box{padding:22px 18px}
    .steps,.trust-grid{grid-template-columns:1fr}
    .card{grid-template-columns:1fr;border-radius:14px;margin-bottom:12px}
    .card-rank{display:none}
    .card-center{padding:14px 16px;gap:8px}
    .card-head{gap:10px}
    .card-logo{width:48px;height:36px;border-radius:9px;font-size:.82rem}
    .card-info h3{font-size:1rem}
    .card-info .stars{font-size:.78rem}
    .card-desc{display:none}
    .gauge-track{max-width:120px}
    .card-cta{padding:12px 16px;border-top:1px solid var(--g100);flex-direction:row;align-items:center;justify-content:space-between;gap:10px}
    .gain{font-size:.95rem;text-align:left}
    .gain small{display:inline;margin-top:0;margin-left:4px}
    .card-cta .btn-cta{width:auto;padding:10px 18px;font-size:.82rem}
    .card-cta .meta{display:none}
    .ribbon{right:8px;top:8px;font-size:.6rem;padding:2px 7px}
    .bottom-box{padding:32px 20px;border-radius:18px}
    .bottom-box .btn-cta{font-size:.9rem;padding:13px 28px}
    .faq-q{font-size:.85rem;padding:14px 16px}
    .faq-a-inner{padding:0 16px 14px;font-size:.82rem}
    .mid-cta{padding:18px 16px;gap:12px}
    .mid-cta .mid-icon{font-size:1.4rem}
    .exit-overlay{padding:12px}
    .exit-popup{padding:28px 20px}
    .exit-popup-icon{font-size:2.2rem;margin-bottom:8px}
    .exit-popup h3{font-size:1.15rem}
    .exit-popup p{font-size:.85rem}
    .sticky-bottom{display:flex}
    .live-badge{bottom:auto;top:60px;right:16px;font-size:.72rem;padding:6px 12px}
    .toast{bottom:72px;left:12px;right:12px;max-width:none;transform:translateY(120%)}
    .toast.show{transform:translateY(0)}
    .nav-right{display:none}
    .nav-toggle{display:flex}
    .nav-right.mobile-open{display:flex;flex-direction:column;position:absolute;top:100%;left:0;right:0;background:var(--white);border-bottom:1px solid var(--g200);box-shadow:0 8px 24px rgba(0,0,0,.08);padding:12px 16px;gap:8px;z-index:100}
    .nav-right.mobile-open .nav-dd{width:100%}
    .nav-right.mobile-open .nav-dd-toggle{width:100%;justify-content:space-between;padding:8px 10px}
    .nav-right.mobile-open .nav-dd-menu{position:static;transform:none;box-shadow:none;border:none;border-top:1px solid var(--g100);padding:0;max-height:0;overflow:hidden;opacity:0;transition:max-height .3s ease,opacity .2s ease}
    .nav-right.mobile-open .nav-dd.open .nav-dd-menu{opacity:1;visibility:visible;max-height:240px;overflow-y:auto;padding:4px 0 4px 12px}
}

@media(min-width:1200px){
    .card-center{padding:22px 28px}
}

@media(prefers-reduced-motion:reduce){
    *{animation:none!important;transition:none!important}
    html{scroll-behavior:auto}
    .card{opacity:1;transform:none}
}
