/* FROGGY PIXEL — LANDING v5 (MERGE: v4 architecture + v2 premium polish) */
/* HERO MOBILE REDESIGN INTEGRATED */

/* ═══════════════════════════════════════
   §1 TOKENS — v2 spacing restored
   ═══════════════════════════════════════ */
:root{
  --p:#7c3aed;--p5:#8b5cf6;--p4:#a78bfa;--p3:#c4b5fd;
  --s:#3b82f6;--s5:#60a5fa;--s4:#93c5fd;
  --a:#10b981;--a5:#34d399;
  --n9:#0f172a;--n8:#1f2937;--n7:#374151;--n6:#4b5563;--n5:#6b7280;--n4:#9ca3af;--n3:#d1d5db;--n2:#e5e7eb;--n1:#f3f4f6;--n0:#f9fafb;
  --fd:'Space Grotesk',system-ui;--fb:'Inter',system-ui;
  --r-s:8px;--r-m:12px;--r-l:16px;--r-xl:20px;--r-2xl:24px;--r-f:9999px;
  --sh-sm:0 2px 4px rgba(0,0,0,.08);
  --sh-md:0 4px 12px rgba(0,0,0,.1);
  --sh-lg:0 8px 32px rgba(0,0,0,.1);
  --sh-xl:0 16px 48px rgba(0,0,0,.12);
  --sh-glow:0 0 30px rgba(124,58,237,.25);
  --t:.3s ease-out;--ts:.5s cubic-bezier(.34,1.56,.64,1)
}

/* §2 RESET */
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-font-smoothing:antialiased;overflow-x:hidden}
body{font-family:var(--fb);background:#fff;color:var(--n8);line-height:1.6;overflow-x:hidden;margin:0;padding:0}
#_pages_content,#page-content,.container,.container-fluid,[id*="page"],.dash-debug-menu{padding-left:0!important;padding-right:0!important;margin-left:0!important;margin-right:0!important;max-width:100%!important;width:100%!important}
#react-entry-point,.dash-debug-alert-container{padding:0!important;margin:0!important}
.lp{
  overflow-x: clip;
  width: 100%;
  max-width: 100%;
  position: relative;
}

/* §3 KEYFRAMES */
@keyframes fadeUp{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:translateY(0)}}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
@keyframes slideL{from{opacity:0;transform:translateX(-32px)}to{opacity:1;transform:translateX(0)}}
@keyframes slideR{from{opacity:0;transform:translateX(32px)}to{opacity:1;transform:translateX(0)}}
@keyframes slideUp{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}
@keyframes slideDown{from{opacity:0;transform:translateY(-12px)}to{opacity:1;transform:translateY(0)}}
@keyframes blobR{0%{transform:translate(0,0) scale(1) rotate(0)}33%{transform:translate(20px,-40px) scale(1.1) rotate(120deg)}66%{transform:translate(-15px,15px) scale(.95) rotate(240deg)}100%{transform:translate(0,0) scale(1) rotate(360deg)}}
@keyframes gradShift{0%,100%{background-position:0 50%}50%{background-position:100% 50%}}
@keyframes mockFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
@keyframes curBlink{0%,100%{opacity:1}50%{opacity:0}}
@keyframes mqScroll{0%{transform:translateX(0)}100%{transform:translateX(-33.333%)}}
@keyframes pulseDot{0%{left:-3px;opacity:0}15%{opacity:1}85%{opacity:1}100%{left:calc(100% - 3px);opacity:0}}
@keyframes pulseDotV{0%{top:-2px;opacity:0}15%{opacity:1}85%{opacity:1}100%{top:calc(100% - 3px);opacity:0}}
@keyframes nodeGlow{0%,100%{box-shadow:0 0 6px rgba(124,58,237,.4);transform:translate(-50%,-50%) scale(1)}50%{box-shadow:0 0 14px rgba(124,58,237,.7);transform:translate(-50%,-50%) scale(1.25)}}
@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-20px)}}
@keyframes glowPulse{0%,100%{box-shadow:0 0 20px rgba(124,58,237,.4),0 0 40px rgba(124,58,237,.2)}50%{box-shadow:0 0 40px rgba(124,58,237,.6),0 0 80px rgba(124,58,237,.3)}}
@keyframes sphereFL{0%,100%{transform:translateY(-50%) translateX(0)}50%{transform:translateY(-60%) translateX(-30px)}}
@keyframes sphereFR{0%,100%{transform:translateY(-50%) translateX(0)}50%{transform:translateY(-55%) translateX(40px)}}
@keyframes hexShift{0%{background-position:0 0,30px 30px}100%{background-position:60px 60px,90px 90px}}
@keyframes scaleIn{from{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}

/* §4 UTILITIES */
.hl-grad{background:linear-gradient(90deg,var(--p),var(--s));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.sc-badge{display:inline-block;width:fit-content;background:linear-gradient(135deg,rgba(124,58,237,.14),rgba(139,92,246,.08));border:1.5px solid rgba(124,58,237,.35);border-radius:var(--r-f);padding:.65rem 1.25rem;font-size:.75rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--p);font-family:var(--fd);margin-bottom:1.5rem;backdrop-filter:blur(10px);animation:slideDown .8s ease-out}
.sec-h2{font-family:var(--fd);font-size:clamp(2rem,4.5vw,3rem);font-weight:900;line-height:1.1;letter-spacing:-.03em;color:var(--n8);margin-bottom:1rem;animation:slideUp .9s ease-out .1s both}
.sec-p{font-size:1.05rem;line-height:1.8;color:var(--n5);max-width:650px;margin:0 auto;font-weight:400;animation:slideUp 1s ease-out .2s both}


/* ═══════════════════════════════════════
   §5 HEADER — v2 glassmorphic polish
   ═══════════════════════════════════════ */
.header-sticky{position:fixed;top:0;left:0;right:0;z-index:500;height:60px;display:flex;align-items:center;justify-content:center;padding:0 2rem;background:rgba(255,255,255,.75);backdrop-filter:blur(20px);border-bottom:1px solid rgba(124,58,237,.15);box-shadow:0 8px 32px rgba(0,0,0,.08);animation:slideDown .6s ease-out}
.header-content{display:flex;align-items:center;justify-content:space-between;max-width:1400px;width:100%;gap:3rem;height:100%}
.header-logo{display:flex;align-items:center;transform:translateY(2px)}
.header-nav{display:flex;gap:3rem;flex:1}
.header-nav-link{font-size:.85rem;font-weight:600;color:var(--n5);text-decoration:none;position:relative;transition:color var(--t)}
.header-nav-link::after{content:'';position:absolute;bottom:-6px;left:0;width:0;height:2px;background:linear-gradient(90deg,var(--p),var(--s),var(--a));border-radius:1px;transition:width var(--ts)}
.header-nav-link:hover{color:var(--p)}.header-nav-link:hover::after{width:100%}
.header-buttons{display:flex;gap:1rem;align-items:center}
.header-btn-login{background:transparent!important;color:var(--n5)!important;font-weight:600!important;padding:.6rem 1.25rem!important;border-radius:var(--r-m)!important;border:none!important;transition:all var(--t)!important;cursor:pointer;font-size:.85rem!important}
.header-btn-login:hover{background:rgba(124,58,237,.08)!important;color:var(--p)!important;transform:translateY(-2px)}
.header-btn-cta{background:linear-gradient(135deg,var(--p),var(--s))!important;color:#fff!important;font-weight:700!important;padding:.6rem 1.5rem!important;border-radius:var(--r-m)!important;border:none!important;box-shadow:0 8px 20px rgba(124,58,237,.3);transition:all var(--t)!important;cursor:pointer;font-size:.85rem!important;position:relative;overflow:hidden}
.header-btn-cta::before{content:'';position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.3),transparent);transition:left .6s ease}
.header-btn-cta:hover{transform:translateY(-3px);box-shadow:0 12px 32px rgba(124,58,237,.4)}
.header-btn-cta:hover::before{left:100%}
@media(max-width:1024px){.header-nav{display:none}}


/* ═══════════════════════════════════════
   §6 HERO — SPLIT + FLOW (v4 arch, v2 polish)
   ═══════════════════════════════════════ */
.hero-section{position:relative;min-height:85vh;max-height:100vh;display:flex;align-items:center;justify-content:center;padding:76px 0 0;overflow:hidden;background:linear-gradient(135deg,#fff 0%,#f8f4ff 50%,#f0f9ff 100%)}
.hero-deco-1{position:absolute;width:500px;height:500px;background:radial-gradient(circle at 30% 70%,rgba(124,58,237,.25),transparent 60%);border-radius:40% 60% 70% 30%/40% 50% 60% 50%;top:-200px;left:-100px;animation:blobR 20s ease-in-out infinite;filter:blur(50px);opacity:.8}
.hero-deco-2{position:absolute;width:400px;height:400px;background:radial-gradient(circle at 70% 30%,rgba(59,130,246,.2),transparent 60%);border-radius:60% 40% 30% 70%/60% 30% 70% 40%;top:50%;right:-150px;animation:blobR 25s ease-in-out infinite reverse;filter:blur(50px);opacity:.7}
.hero-deco-3{position:absolute;width:350px;height:350px;background:radial-gradient(circle at 50% 50%,rgba(16,185,129,.15),transparent 60%);border-radius:30% 70% 70% 30%/30% 30% 70% 70%;bottom:-100px;left:25%;animation:blobR 22s ease-in-out infinite;filter:blur(50px);opacity:.6}
.hero-grid-bg{position:absolute;inset:0;background-image:linear-gradient(rgba(124,58,237,.03) 1px,transparent 1px),linear-gradient(90deg,rgba(124,58,237,.03) 1px,transparent 1px);background-size:60px 60px;z-index:1}

.hero-split{position:relative;z-index:10;width:100%;display:grid;grid-template-columns:38% 62%;gap:2rem;align-items:center;padding:0 3rem 0 4rem}
.hero-left{animation:slideL 1s ease-out .15s both}
.hero-right{animation:slideR 1s ease-out .2s both;display:flex;justify-content:center}

/* Grid placement for trust & persona (now siblings of hero-left/right) */
.hero-left    { grid-column: 1; grid-row: 1; }
.hero-right   { grid-column: 2; grid-row: 1 / 5; }
.hero-trust   { grid-column: 1; grid-row: 2; }
.hero-persona { grid-column: 1; grid-row: 3; }
/* Reinforcement phrase — mobile only */
.hero-reinforcement{display:none;font-size:.78rem;color:var(--p);font-weight:600;text-align:center;margin:0;padding:0;letter-spacing:-.01em}

.hero-badge{display:inline-flex;gap:.5rem;background:linear-gradient(135deg,rgba(124,58,237,.12),rgba(59,130,246,.1));border:1.5px solid rgba(124,58,237,.3);border-radius:var(--r-f);padding:.5rem 1.1rem;margin-bottom:.5rem;font-size:.75rem;font-weight:600;color:var(--p);backdrop-filter:blur(10px);transition:all var(--t);cursor:pointer;animation:slideDown .8s ease-out .1s both}
.hero-badge:hover{border-color:rgba(124,58,237,.6);background:linear-gradient(135deg,rgba(124,58,237,.18),rgba(59,130,246,.15));transform:translateY(-3px);box-shadow:0 12px 24px rgba(124,58,237,.2)}

.hero-h1{font-family:var(--fd);font-size:clamp(1.85rem,3.6vw,2.75rem);font-weight:900;line-height:1.08;letter-spacing:-.03em;margin-bottom:.85rem;background:linear-gradient(135deg,#4c1d95,#5b21b6 30%,#1e3a8a 60%,#3730a3);background-size:200% 200%;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;animation:slideDown 1s ease-out .2s both,gradShift 8s ease-in-out infinite}
.hero-sub{font-size:.92rem;line-height:1.65;color:var(--n6);margin-bottom:1.25rem;max-width:440px;animation:slideDown 1.1s ease-out .3s both}

/* Mobile subheadline — hidden on desktop */
.hero-sub-mobile{display:none;font-size:.84rem;line-height:1.55;color:var(--n5);font-weight:500;text-align:center;margin:0 auto .65rem;max-width:340px;animation:fadeUp .9s ease-out .25s both}

.hero-btns{display:flex;gap:1rem;margin-bottom:1rem;flex-wrap:wrap;animation:slideDown 1.2s ease-out .4s both}
.hero-btn-primary{background:linear-gradient(135deg,var(--p),var(--s))!important;color:#fff!important;font-weight:700!important;padding:.7rem 1.4rem!important;border-radius:var(--r-l)!important;box-shadow:0 12px 32px rgba(124,58,237,.3);transition:all var(--ts)!important;border:none!important;cursor:pointer;font-size:.85rem!important;white-space:nowrap;position:relative;overflow:hidden}
.hero-btn-primary::before{content:'';position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.3),transparent);transition:left .6s ease}
.hero-btn-primary:hover{transform:translateY(-4px);box-shadow:0 16px 48px rgba(124,58,237,.4)}
.hero-btn-primary:hover::before{left:100%}
.hero-btn-secondary{background:rgba(124,58,237,.08)!important;color:var(--p)!important;font-weight:700!important;padding:.7rem 1.4rem!important;border-radius:var(--r-l)!important;border:2px solid rgba(124,58,237,.3)!important;transition:all var(--t)!important;font-size:.85rem!important;cursor:pointer;display:inline-flex!important;align-items:center;gap:.5rem;white-space:nowrap}
.hero-btn-secondary:hover{background:rgba(124,58,237,.12)!important;border-color:var(--p)!important;transform:translateY(-4px);box-shadow:0 12px 28px rgba(124,58,237,.25)}

.hero-trust{display:flex;flex-direction:column;gap:.45rem;margin-bottom:.35rem;padding-top:.75rem;border-top:1px solid rgba(124,58,237,.1);animation:slideDown 1.3s ease-out .5s both}
.trust-item{display:flex;align-items:center;gap:.5rem;font-size:.8rem;font-weight:600;color:var(--n5);transition:all var(--t)}
.trust-item:hover{color:var(--p);transform:translateX(4px)}
.hero-persona{font-size:.75rem;color:var(--n4);font-style:italic;font-weight:500;margin:0;padding:0}

@media(max-width:1100px){
  .hero-split{grid-template-columns:1fr;text-align:center}
  .hero-left{order:1}.hero-right{order:2}
  .hero-trust{order:3;align-items:center}
  .hero-persona{order:4;text-align:center}
  .hero-sub{max-width:100%;margin-left:auto;margin-right:auto}
  .hero-btns{justify-content:center}
  .hero-badge{margin-left:auto;margin-right:auto}
}
/* NOTE: 576px hero rules REMOVED — now handled by M §3 mobile redesign */


/* §6b FLOW DIAGRAM */
.hero-flow-visual{display:flex;align-items:center;gap:0;width:100%;max-width:780px}
.flow-zone-brand{display:flex;flex-direction:column;gap:6px;min-width:120px;flex-shrink:0}
.bchip{display:flex;align-items:center;gap:8px;background:rgba(255,255,255,.85);border:1px solid rgba(124,58,237,.12);border-radius:var(--r-m);padding:7px 10px;backdrop-filter:blur(8px);transition:all var(--t);cursor:default;box-shadow:0 2px 8px rgba(0,0,0,.04)}
.bchip:hover{border-color:rgba(124,58,237,.3);transform:translateX(-3px);box-shadow:0 4px 14px rgba(124,58,237,.1)}
.bchip-icon{width:28px;height:28px;background:linear-gradient(135deg,rgba(124,58,237,.12),rgba(139,92,246,.06));border-radius:var(--r-s);display:flex;align-items:center;justify-content:center;color:var(--p);flex-shrink:0}
.bchip-text{display:flex;flex-direction:column;overflow:hidden}
.bchip-label{font-size:10px;font-weight:700;color:var(--n8);white-space:nowrap}
.bchip-detail{font-size:8px;font-weight:500;color:var(--n4);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.flow-zone-social{display:flex;flex-direction:column;gap:6px;min-width:110px;flex-shrink:0;align-items:center}
.flow-social-icons{display:flex;flex-direction:column;gap:6px}
.schip{display:flex;align-items:center;gap:8px;background:rgba(255,255,255,.85);border:1px solid rgba(124,58,237,.1);border-radius:var(--r-m);padding:7px 10px;backdrop-filter:blur(8px);transition:all var(--t);cursor:default;box-shadow:0 2px 8px rgba(0,0,0,.04)}
.schip:hover{border-color:rgba(124,58,237,.3);transform:translateX(3px);box-shadow:0 4px 14px rgba(124,58,237,.1)}
.schip-icon{width:28px;height:28px;background:rgba(255,255,255,.9);border:1px solid var(--n2);border-radius:var(--r-s);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.schip-label{font-size:10px;font-weight:700;color:var(--n8)}
.flow-status{display:flex;align-items:center;justify-content:center;gap:5px;padding:5px 10px;background:linear-gradient(135deg,rgba(16,185,129,.1),rgba(16,185,129,.05));border:1px solid rgba(16,185,129,.2);border-radius:var(--r-f);margin-top:4px}
.flow-status-text{font-size:9px;font-weight:700;color:var(--a)}

.flow-connector{position:relative;width:40px;min-width:40px;height:100%;min-height:180px;display:flex;align-items:center;flex-shrink:0}
.flow-connector::before{content:'';position:absolute;top:50%;left:0;right:0;height:2px;transform:translateY(-50%);background:linear-gradient(90deg,rgba(124,58,237,.08),rgba(124,58,237,.45),rgba(59,130,246,.45),rgba(59,130,246,.08));border-radius:1px;box-shadow:0 0 8px rgba(124,58,237,.12)}
.flow-connector::after{content:'';position:absolute;top:50%;left:10%;right:10%;height:6px;transform:translateY(-50%);background:linear-gradient(90deg,transparent,rgba(124,58,237,.08),rgba(59,130,246,.08),transparent);border-radius:3px;filter:blur(3px)}
.flow-node{position:absolute;top:50%;left:50%;width:8px;height:8px;transform:translate(-50%,-50%);background:linear-gradient(135deg,var(--p),var(--s));border-radius:50%;box-shadow:0 0 10px rgba(124,58,237,.5);z-index:2;animation:nodeGlow 2.5s ease-in-out infinite}
.flow-pulse{position:absolute;top:50%;width:5px;height:5px;background:var(--p5);border-radius:50%;transform:translateY(-50%);box-shadow:0 0 6px rgba(124,58,237,.8),0 0 14px rgba(124,58,237,.3);animation:pulseDot 3s linear infinite;z-index:3}
.flow-pulse-2{animation-delay:1.5s;background:var(--s5);box-shadow:0 0 6px rgba(59,130,246,.8),0 0 14px rgba(59,130,246,.3)}
.flow-zone-product{flex:1;min-width:0;display:flex;justify-content:center}

@media(max-width:1100px){
  .hero-flow-visual{flex-direction:column;gap:12px;max-width:420px;margin:0 auto}
  .flow-zone-brand{flex-direction:row;flex-wrap:wrap;justify-content:center;min-width:unset}
  .flow-zone-social{flex-direction:column;align-items:center;min-width:unset}
  .flow-social-icons{flex-direction:row;flex-wrap:wrap;justify-content:center;gap:6px}
  .flow-connector{width:100%;min-width:unset;height:32px;min-height:32px}
  .flow-connector::before{top:50%;left:50%;right:auto;width:2px;height:100%;transform:translate(-50%,-50%);background:linear-gradient(180deg,rgba(124,58,237,.08),rgba(124,58,237,.45),rgba(59,130,246,.45),rgba(59,130,246,.08))}
  .flow-connector::after{display:none}.flow-node{top:50%;left:50%}
  .flow-pulse{top:auto;left:50%;transform:translateX(-50%);animation-name:pulseDotV}
}
/* NOTE: 576px flow rules REMOVED — now handled by M §3 mobile redesign */


/* §6c MOCKUP */
.hero-mockup{width:100%;max-width:400px;background:linear-gradient(135deg,#fff,#faf8ff);border:1.5px solid rgba(124,58,237,.14);border-radius:var(--r-xl);box-shadow:0 24px 56px rgba(124,58,237,.12),0 4px 16px rgba(0,0,0,.06),inset 0 1px 0 rgba(255,255,255,.8);overflow:hidden;animation:mockFloat 6s ease-in-out infinite;transition:all var(--ts)}
.hero-mockup:hover{box-shadow:0 32px 72px rgba(124,58,237,.18),0 8px 24px rgba(0,0,0,.08);transform:translateY(-4px)}
.mtop{display:flex;align-items:center;justify-content:space-between;padding:7px 12px;background:linear-gradient(135deg,#faf8ff,#f0edff);border-bottom:1px solid rgba(124,58,237,.08)}
.mdots{display:flex;gap:4px}.mdot{width:8px;height:8px;border-radius:50%}.mdot-r{background:#ff5f57}.mdot-y{background:#ffbd2e}.mdot-g{background:#28c840}
.mtop-center{display:flex;align-items:center;gap:4px}.mtop-brand{font-size:9px;font-weight:800;color:var(--n8);font-family:var(--fd)}
.mtop-right{display:flex;gap:4px}.mchip{font-size:8px;font-weight:700;color:var(--p);background:rgba(124,58,237,.08);padding:2px 6px;border-radius:var(--r-f)}.mchip-green{color:var(--a);background:rgba(16,185,129,.1)}
.mbody{display:grid;grid-template-columns:1fr 1.3fr;gap:0;min-height:180px}
.mpanel-prompt{padding:10px;display:flex;flex-direction:column;gap:7px;border-right:1px solid rgba(124,58,237,.06);background:rgba(124,58,237,.015)}
.mpanel-preview{padding:10px;display:flex;flex-direction:column;gap:7px}
.mlabel-row{display:flex;align-items:center;gap:4px}.mlabel{font-size:8px;font-weight:700;color:var(--n5);text-transform:uppercase;letter-spacing:.06em}
.mprompt{position:relative;background:#fff;border:1px solid rgba(124,58,237,.12);border-radius:var(--r-s);padding:7px 9px;min-height:46px}
.mprompt-text{font-size:9px;line-height:1.5;color:var(--n7);font-style:italic;font-weight:500}.mcursor{width:1.5px;height:11px;background:var(--p);border-radius:1px;display:inline-block;vertical-align:middle;margin-left:2px;animation:curBlink 1s step-end infinite}
.mtags{display:flex;flex-wrap:wrap;gap:4px}.mtag{display:inline-flex;align-items:center;gap:3px;padding:3px 6px;background:#fff;border:1px solid var(--n2);border-radius:var(--r-f);font-size:8px;font-weight:700;color:var(--n6)}
.mgen-btn{display:flex;align-items:center;justify-content:center;gap:4px;background:linear-gradient(135deg,var(--p),var(--s));padding:6px 10px;border-radius:var(--r-s);margin-top:auto;box-shadow:0 3px 10px rgba(124,58,237,.25)}.mgen-text{font-size:9px;font-weight:800;color:#fff}
.mmain{position:relative;border-radius:var(--r-s);overflow:hidden;flex:1;background:var(--n1);border:1px solid rgba(124,58,237,.08)}.mmain-img{width:100%;height:100%;object-fit:cover;display:block;min-height:80px}.mmain-ph{width:100%;min-height:100px;background:linear-gradient(135deg,var(--n1),var(--n0))}
.mselected{position:absolute;top:5px;right:5px;display:flex;align-items:center;gap:3px;background:rgba(16,185,129,.88);padding:3px 6px;border-radius:var(--r-f);backdrop-filter:blur(6px)}
.mthumbs{display:flex;gap:6px}.mthumb{flex:1;border-radius:var(--r-s);overflow:hidden;border:1px solid var(--n2);height:40px;background:var(--n1);transition:all var(--t);cursor:pointer}.mthumb:hover{border-color:var(--p);transform:scale(1.04)}.mthumb-img{width:100%;height:100%;object-fit:cover;display:block}
.mfooter{display:flex;align-items:center;justify-content:space-between;padding:7px 12px;background:linear-gradient(135deg,#faf8ff,#f0edff);border-top:1px solid rgba(124,58,237,.08)}
.msoc-row{display:flex;gap:4px}.msoc{width:24px;height:24px;display:flex;align-items:center;justify-content:center;background:#fff;border:1px solid var(--n2);border-radius:var(--r-s);transition:all .15s ease-out}.msoc:hover{border-color:rgba(124,58,237,.3);transform:translateY(-1px)}
.msched-area{display:flex;flex-direction:column;align-items:flex-end;gap:3px}.msched-btn{display:flex;align-items:center;gap:4px;background:linear-gradient(135deg,var(--p),var(--s));padding:4px 9px;border-radius:var(--r-s);box-shadow:0 3px 8px rgba(124,58,237,.2)}.msched-text{font-size:8px;font-weight:800;color:#fff}.msched-info{display:flex;align-items:center;gap:3px}.msched-status{font-size:8px;font-weight:600;color:var(--a)}
/* NOTE: 576px mockup rules REMOVED — now handled by M §3 mobile redesign */


/* ═══════════════════════════════════════
   §7 SHOWCASE — MARQUEE (v2 spacing)
   ═══════════════════════════════════════ */
.showcase-section{padding:5rem 0 4rem;background:linear-gradient(180deg,#f5f3ff,#fff 50%,#f8f4ff);position:relative;overflow:hidden}
.showcase-section::before{content:'';position:absolute;inset:0;background:radial-gradient(circle at 30% 0%,rgba(124,58,237,.06),transparent 50%),radial-gradient(circle at 70% 100%,rgba(59,130,246,.05),transparent 50%);z-index:0;pointer-events:none}
.sc-header{text-align:center;max-width:700px;margin:0 auto 3.5rem;padding:0 1.5rem;position:relative;z-index:1;animation:fadeUp 1s ease-out}
.mq-gallery{display:flex;flex-direction:column;gap:.85rem;mask-image:linear-gradient(90deg,transparent 0%,#000 5%,#000 95%,transparent 100%);-webkit-mask-image:linear-gradient(90deg,transparent 0%,#000 5%,#000 95%,transparent 100%);position:relative;z-index:1}
.mq-row{overflow:hidden;width:100%}
.mq-track{display:flex;gap:.85rem;width:max-content;animation-name:mqScroll;animation-timing-function:linear;animation-iteration-count:infinite}
.mq-row:hover .mq-track{animation-play-state:paused}
.mq-item{flex-shrink:0;position:relative;height:220px;border-radius:var(--r-l);overflow:hidden;cursor:pointer;transition:all .4s cubic-bezier(.34,1.56,.64,1);box-shadow:0 4px 16px rgba(0,0,0,.08),0 1px 4px rgba(124,58,237,.06);border:2px solid rgba(124,58,237,.06)}
.mq-item:hover{transform:scale(1.06) translateY(-6px);box-shadow:0 16px 40px rgba(124,58,237,.18),0 4px 12px rgba(0,0,0,.1);border-color:rgba(124,58,237,.3);z-index:10}
.mq-img{height:100%;width:auto;display:block;object-fit:cover;min-width:140px;transition:transform .5s cubic-bezier(.34,1.56,.64,1)}
.mq-item:hover .mq-img{transform:scale(1.08)}
.mq-lbl{display:none}
.mq-lbl-text{font-size:.7rem;font-weight:700;color:#fff;text-shadow:0 2px 8px rgba(0,0,0,.4);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mq-row:nth-child(1) .mq-item{height:200px}.mq-row:nth-child(2) .mq-item{height:240px}.mq-row:nth-child(3) .mq-item{height:180px}.mq-row:nth-child(4) .mq-item{height:220px}
@media(max-width:768px){.mq-row:nth-child(1) .mq-item{height:150px}.mq-row:nth-child(2) .mq-item{height:170px}.mq-row:nth-child(3) .mq-item{height:140px}.mq-row:nth-child(4) .mq-item{height:160px}.mq-gallery,.mq-track{gap:.5rem}.mq-img{min-width:110px}}


/* ═══════════════════════════════════════
   §7b PERFORMANCE BOOST — RESTORED (v2)
   ═══════════════════════════════════════ */
.perf-section{padding:5rem 1.5rem;background:linear-gradient(135deg,#fff,#f8f4ff 50%,#f0f9ff);position:relative;overflow:hidden}
.perf-section::before{content:'';position:absolute;inset:0;background:radial-gradient(circle at 20% 50%,rgba(124,58,237,.08),transparent 50%),radial-gradient(circle at 80% 50%,rgba(59,130,246,.06),transparent 50%);z-index:0}
.perf-wrapper{max-width:1400px;margin:0 auto;position:relative;z-index:1;display:grid;grid-template-columns:1fr 1fr;gap:4rem;align-items:center}
.perf-left{display:flex;flex-direction:column;gap:1.5rem;animation:slideL 1s ease-out .2s both}
.perf-description{font-size:1rem;line-height:1.8;color:var(--n6);font-weight:400}
.perf-features-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1.75rem;margin-top:1rem}
.perf-feature-card{display:flex;flex-direction:column;gap:.85rem;transition:all var(--ts);cursor:pointer}
.perf-feature-card:hover{transform:translateY(-6px)}
.perf-feature-icon{width:56px;height:56px;background:linear-gradient(135deg,rgba(124,58,237,.12),rgba(139,92,246,.08));border-radius:var(--r-l);display:flex;align-items:center;justify-content:center;color:var(--p);transition:all var(--t)}
.perf-feature-card:hover .perf-feature-icon{transform:scale(1.15) rotate(-8deg);background:linear-gradient(135deg,rgba(124,58,237,.2),rgba(139,92,246,.15))}
.perf-feature-title{font-size:1.05rem;font-weight:700;color:var(--n8)}
.perf-feature-desc{font-size:.9rem;color:var(--n5);line-height:1.65}
.perf-right{display:flex;justify-content:center;align-items:flex-start;animation:slideR 1s ease-out .2s both}

/* PERFORMANCE FLOW — ANIMATED PIPELINE v2 */
.pf-scene{display:flex;flex-direction:column;align-items:center;width:100%;max-width:400px}
.pf-brief,.pf-engine,.pf-publish{width:100%;background:rgba(255,255,255,.92);backdrop-filter:blur(16px);border:1.5px solid rgba(124,58,237,.1);border-radius:var(--r-l);box-shadow:0 4px 20px rgba(0,0,0,.05),0 1px 6px rgba(124,58,237,.04);transition:all var(--ts);position:relative;overflow:hidden}
.pf-brief:hover,.pf-engine:hover,.pf-publish:hover{border-color:rgba(124,58,237,.22);box-shadow:0 8px 32px rgba(124,58,237,.1);transform:translateY(-2px)}
.pf-brief{animation:fadeUp .7s ease-out .3s both;padding:1rem 1.15rem}
.pf-engine{animation:fadeUp .7s ease-out .6s both;padding:1.15rem}
.pf-publish{animation:fadeUp .7s ease-out .9s both;padding:1rem 1.15rem}
.pf-label{display:flex;align-items:center;gap:5px;margin-bottom:.6rem}
.pf-label-text{font-size:.65rem;font-weight:800;color:var(--n5);text-transform:uppercase;letter-spacing:.08em;font-family:var(--fd)}
.pf-brief{border-color:rgba(124,58,237,.14)}
.pf-brief::before{content:'';position:absolute;top:10%;left:0;width:3px;height:80%;background:linear-gradient(180deg,transparent,var(--p),var(--s),transparent);border-radius:2px;opacity:.35;animation:pfEdgeGlow 3s ease-in-out infinite}
@keyframes pfEdgeGlow{0%,100%{opacity:.2;height:60%}50%{opacity:.5;height:85%}}
.pf-brief-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:.6rem}
.pf-brief-status{display:flex;align-items:center;gap:4px;font-size:.58rem;font-weight:700;color:var(--a);background:rgba(16,185,129,.08);border:1px solid rgba(16,185,129,.15);padding:2px 8px;border-radius:var(--r-f);animation:fadeUp .5s ease-out 1.2s both}
.pf-prompt{background:rgba(124,58,237,.025);border:1px solid rgba(124,58,237,.1);border-radius:var(--r-s);padding:8px 10px;margin-bottom:.55rem;display:flex;align-items:center;gap:6px;transition:border-color .3s ease}
.pf-prompt:hover{border-color:rgba(124,58,237,.25)}
.pf-prompt-icon{flex-shrink:0;opacity:.5}
.pf-prompt-text{font-size:.7rem;line-height:1.5;color:var(--n7);font-style:italic;font-weight:500}
.pf-cursor{width:1.5px;height:12px;background:var(--p);border-radius:1px;flex-shrink:0;animation:curBlink 1s step-end infinite}
.pf-chips{display:flex;flex-wrap:wrap;gap:4px;margin-bottom:.5rem}
.pf-chip{display:inline-flex;align-items:center;gap:3px;padding:2.5px 7px;background:#fff;border:1px solid var(--n2);border-radius:var(--r-f);font-size:.6rem;font-weight:700;color:var(--n6);transition:all var(--t);animation:fadeUp .5s ease-out both}
.pf-chip:nth-child(1){animation-delay:.45s}.pf-chip:nth-child(2){animation-delay:.55s}.pf-chip:nth-child(3){animation-delay:.65s}
.pf-chip:hover{border-color:rgba(124,58,237,.25);transform:translateY(-1px)}
.pf-brands{display:flex;align-items:center;gap:4px}
.pf-brand-label{font-size:.55rem;font-weight:700;color:var(--n4);margin-right:2px;letter-spacing:.03em}
.pf-brand-tag{display:inline-flex;align-items:center;gap:2px;padding:2px 6px;background:linear-gradient(135deg,rgba(124,58,237,.05),rgba(139,92,246,.02));border:1px solid rgba(124,58,237,.08);border-radius:var(--r-f);font-size:.55rem;font-weight:700;color:var(--p);transition:all var(--t)}
.pf-brand-tag:hover{border-color:rgba(124,58,237,.2)}
.pf-vconn{width:100%;height:32px;position:relative;display:flex;justify-content:center;flex-shrink:0}
.pf-vline{position:absolute;left:50%;top:0;bottom:0;width:2px;transform:translateX(-50%);background:linear-gradient(180deg,rgba(124,58,237,.06),rgba(124,58,237,.35),rgba(59,130,246,.35),rgba(59,130,246,.06));border-radius:1px}
.pf-vline::after{content:'';position:absolute;left:50%;top:10%;bottom:10%;width:8px;transform:translateX(-50%);background:linear-gradient(180deg,transparent,rgba(124,58,237,.06),transparent);border-radius:4px;filter:blur(3px)}
.pf-vnode{position:absolute;top:50%;left:50%;width:7px;height:7px;transform:translate(-50%,-50%);background:linear-gradient(135deg,var(--p),var(--s));border-radius:50%;box-shadow:0 0 8px rgba(124,58,237,.4);z-index:2;animation:nodeGlow 3s ease-in-out infinite}
.pf-vpulse{position:absolute;left:50%;width:4px;height:4px;background:var(--p4);border-radius:50%;transform:translateX(-50%);box-shadow:0 0 6px rgba(124,58,237,.5);animation:pfDown 2.4s linear infinite;z-index:3}
.pf-vpulse-2{animation-delay:1.2s;background:var(--s4);box-shadow:0 0 6px rgba(59,130,246,.5)}
.pf-vconn-d2 .pf-vpulse{animation-delay:.5s}
.pf-vconn-d2 .pf-vpulse-2{animation-delay:1.7s}
.pf-vconn::after{content:'';position:absolute;bottom:0;left:50%;width:5px;height:5px;transform:translateX(-50%) rotate(45deg);border-right:1.5px solid rgba(59,130,246,.4);border-bottom:1.5px solid rgba(59,130,246,.4);z-index:4;opacity:.6}
@keyframes pfDown{0%{top:-3px;opacity:0;transform:translateX(-50%) scale(.5)}10%{opacity:.8;transform:translateX(-50%) scale(1)}85%{opacity:.8;transform:translateX(-50%) scale(1)}100%{top:calc(100% - 3px);opacity:0;transform:translateX(-50%) scale(.5)}}
.pf-engine-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:.7rem}
.pf-engine-meta{display:flex;align-items:center;gap:5px;font-size:.55rem;color:var(--n4)}
.pf-engine-chip{font-weight:700}
.pf-engine-chip-ok{color:var(--a)}
.pf-variants{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin-bottom:.5rem}
.pf-var{position:relative;border-radius:var(--r-s);overflow:hidden;border:1.5px solid rgba(124,58,237,.06);height:100px;background:var(--n1);transition:all var(--ts);cursor:pointer;animation:pfVarIn .6s ease-out both}
.pf-var-1{animation-delay:.8s}.pf-var-2{animation-delay:.92s}.pf-var-3{animation-delay:1.04s}
.pf-var:hover{border-color:rgba(124,58,237,.25);transform:scale(1.03) translateY(-2px);box-shadow:0 6px 16px rgba(124,58,237,.1)}
.pf-var-sel{border-color:var(--p)!important;box-shadow:0 2px 12px rgba(124,58,237,.12)}
.pf-var-sel::after{content:'';position:absolute;inset:0;background:linear-gradient(135deg,rgba(124,58,237,.06),transparent 50%);pointer-events:none}
.pf-var-img{width:100%;height:100%;object-fit:cover;display:block;transition:transform var(--ts)}
.pf-var:hover .pf-var-img{transform:scale(1.06)}
.pf-var-ph{width:100%;height:100%;background:linear-gradient(135deg,rgba(124,58,237,.04),rgba(59,130,246,.03))}
.pf-var-badge{position:absolute;top:5px;right:5px;display:flex;align-items:center;gap:2px;background:rgba(124,58,237,.88);padding:2px 6px;border-radius:var(--r-f);backdrop-filter:blur(8px);font-size:.5rem;font-weight:800;color:#fff;animation:pfBadgeIn .4s ease-out 1.3s both;box-shadow:0 3px 10px rgba(124,58,237,.25)}
@keyframes pfVarIn{from{opacity:0;transform:translateY(10px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}
@keyframes pfBadgeIn{from{opacity:0;transform:scale(.7)}to{opacity:1;transform:scale(1)}}
.pf-engine-loader{height:2px;border-radius:1px;background:rgba(124,58,237,.04);overflow:hidden}
.pf-shimmer-bar{width:35%;height:100%;background:linear-gradient(90deg,transparent,rgba(124,58,237,.2),rgba(59,130,246,.15),transparent);border-radius:1px;animation:pfShimmer 2.8s ease-in-out infinite}
@keyframes pfShimmer{0%{transform:translateX(-120%)}100%{transform:translateX(380%)}}
.pf-pub-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:.65rem}
.pf-pub-connected{display:flex;align-items:center;gap:4px;font-size:.55rem;font-weight:700;color:var(--a);animation:fadeUp .5s ease-out 1.4s both}
.pf-cal-row{display:flex;gap:3px;margin-bottom:.65rem;animation:fadeUp .5s ease-out 1.1s both}
.pf-cal-day{flex:1;display:flex;flex-direction:column;align-items:center;gap:1px;padding:4px 0;border-radius:var(--r-s);background:rgba(124,58,237,.02);border:1px solid transparent;transition:all var(--t)}
.pf-cal-letter{font-size:.5rem;font-weight:700;color:var(--n4);text-transform:uppercase}
.pf-cal-num{font-size:.62rem;font-weight:700;color:var(--n6);font-family:var(--fd)}
.pf-cal-active{background:linear-gradient(135deg,rgba(124,58,237,.1),rgba(59,130,246,.06));border-color:rgba(124,58,237,.25);box-shadow:0 2px 8px rgba(124,58,237,.1)}
.pf-cal-active .pf-cal-letter{color:var(--p)}
.pf-cal-active .pf-cal-num{color:var(--p);font-weight:800}
.pf-pub-row{display:flex;align-items:center;justify-content:space-between;margin-bottom:.6rem}
.pf-socials{display:flex;gap:5px}
.pf-soc{width:28px;height:28px;display:flex;align-items:center;justify-content:center;background:rgba(255,255,255,.95);border:1px solid var(--n2);border-radius:var(--r-s);transition:all .2s ease-out;animation:pfSocIn .4s ease-out both}
.pf-soc-1{animation-delay:1.15s}.pf-soc-2{animation-delay:1.22s}.pf-soc-3{animation-delay:1.29s}.pf-soc-4{animation-delay:1.36s}
.pf-soc:hover{border-color:rgba(124,58,237,.25);transform:translateY(-2px);box-shadow:0 3px 10px rgba(124,58,237,.08)}
@keyframes pfSocIn{from{opacity:0;transform:translateY(6px) scale(.85)}to{opacity:1;transform:translateY(0) scale(1)}}
.pf-time{display:flex;align-items:center;gap:4px;font-size:.65rem;font-weight:600;color:var(--n5);animation:fadeUp .4s ease-out 1.3s both}
.pf-final-row{display:flex;align-items:center;justify-content:space-between;gap:.5rem}
.pf-final-badge{display:flex;align-items:center;gap:5px;padding:5px 12px;background:linear-gradient(135deg,rgba(16,185,129,.1),rgba(16,185,129,.05));border:1.5px solid rgba(16,185,129,.2);border-radius:var(--r-f);font-size:.65rem;font-weight:800;color:var(--a);animation:pfFinalIn .5s ease-out 1.6s both;box-shadow:0 3px 12px rgba(16,185,129,.08);position:relative}
.pf-final-badge::after{content:'';position:absolute;inset:-2px;border-radius:var(--r-f);box-shadow:0 0 0 0 rgba(16,185,129,.25);animation:pfFinalPulse 3.5s ease-in-out 2.5s infinite}
.pf-final-note{font-size:.55rem;font-weight:600;color:var(--n4);font-style:italic;animation:fadeUp .5s ease-out 1.8s both}
@keyframes pfFinalIn{from{opacity:0;transform:translateY(4px) scale(.92)}to{opacity:1;transform:translateY(0) scale(1)}}
@keyframes pfFinalPulse{0%,100%{box-shadow:0 0 0 0 rgba(16,185,129,.25)}50%{box-shadow:0 0 0 6px rgba(16,185,129,0)}}
@media(max-width:1024px){.perf-wrapper{grid-template-columns:1fr}.pf-scene{max-width:440px;margin:0 auto}}
@media(max-width:768px){.perf-section{padding:4rem 1.5rem}.perf-features-grid{grid-template-columns:1fr}.pf-scene{max-width:100%}.pf-var{height:80px}.pf-vconn{height:26px}}


/* ═══════════════════════════════════════
   §8 SOCIAL PROOF
   ═══════════════════════════════════════ */
.sp-section{padding:4rem 1.5rem;background:linear-gradient(135deg,#fff,rgba(248,250,252,.9));text-align:center;border-top:1px solid rgba(124,58,237,.1);border-bottom:1px solid rgba(124,58,237,.1);overflow:hidden}
.sp-title{font-size:.75rem;font-weight:800;color:var(--n5);text-transform:uppercase;letter-spacing:.15em;margin-bottom:2.5rem;font-family:var(--fd);animation:fadeUp .8s ease-out}
.sp-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:2rem;max-width:1200px;margin:0 auto}
.sp-box{background:linear-gradient(135deg,rgba(124,58,237,.08),rgba(59,130,246,.06));border:2px solid rgba(124,58,237,.15);border-radius:var(--r-xl);padding:2rem 1.25rem;display:flex;flex-direction:column;align-items:center;gap:.5rem;transition:all var(--ts);cursor:default;box-shadow:var(--sh-md);animation:fadeUp 1s ease-out both}
.sp-box:nth-child(1){animation-delay:.1s}.sp-box:nth-child(2){animation-delay:.2s}.sp-box:nth-child(3){animation-delay:.3s}.sp-box:nth-child(4){animation-delay:.4s}
.sp-box:hover{border-color:var(--p);box-shadow:0 16px 40px rgba(124,58,237,.15);transform:translateY(-6px);background:linear-gradient(135deg,rgba(124,58,237,.12),rgba(59,130,246,.1))}
.sp-icon{width:52px;height:52px;background:linear-gradient(135deg,rgba(124,58,237,.12),rgba(139,92,246,.08));border-radius:var(--r-m);display:flex;align-items:center;justify-content:center;margin-bottom:.25rem}
.sp-number{font-family:var(--fd);font-size:2.5rem;font-weight:900;background:linear-gradient(90deg,var(--p),var(--s),var(--a));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;line-height:1;letter-spacing:-.02em}
.sp-stat{font-family:var(--fd);font-size:.95rem;font-weight:800;color:var(--n8);text-align:center;line-height:1.3}
.sp-label{font-size:.8rem;color:var(--n5);font-weight:500;text-align:center;line-height:1.4}
@media(max-width:768px){.sp-stats{grid-template-columns:repeat(2,1fr)}}
@media(max-width:480px){.sp-stats{grid-template-columns:1fr}}


/* ═══════════════════════════════════════
   §9 AUDIENCE
   ═══════════════════════════════════════ */
.audience-section{padding:5rem 1.5rem;background:linear-gradient(180deg,#fff,#f5f3ff 50%,#f0f9ff);overflow:hidden}
.aud-wrapper{max-width:1200px;margin:0 auto;text-align:center}
.aud-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:2rem;margin-top:3rem}
.aud-card{background:linear-gradient(135deg,#fff,rgba(249,250,251,.9));backdrop-filter:blur(10px);border:2px solid rgba(124,58,237,.1);border-radius:var(--r-xl);padding:2rem 1.5rem;text-align:center;transition:all var(--ts);cursor:default;box-shadow:0 8px 32px rgba(0,0,0,.06),0 2px 8px rgba(124,58,237,.06);position:relative;overflow:hidden;animation:fadeUp 1s ease-out both}
.aud-card:nth-child(1){animation-delay:.2s}.aud-card:nth-child(2){animation-delay:.3s}.aud-card:nth-child(3){animation-delay:.4s}.aud-card:nth-child(4){animation-delay:.5s}
.aud-card::before{content:'';position:absolute;top:-50%;right:-50%;width:200px;height:200px;background:radial-gradient(circle,rgba(124,58,237,.08),transparent 70%);border-radius:50%;z-index:0;opacity:0;transition:all var(--ts)}
.aud-card:hover::before{opacity:1;top:-30%;right:-30%}
.aud-card>*{position:relative;z-index:1}
.aud-card:hover{transform:translateY(-8px);border-color:rgba(124,58,237,.3);box-shadow:0 16px 48px rgba(124,58,237,.12),0 4px 16px rgba(0,0,0,.06)}
.aud-icon{width:56px;height:56px;background:linear-gradient(135deg,rgba(124,58,237,.12),rgba(139,92,246,.08));border-radius:var(--r-l);display:flex;align-items:center;justify-content:center;color:var(--p);margin:0 auto 1.25rem;transition:all var(--t)}
.aud-card:hover .aud-icon{transform:scale(1.15) rotate(-8deg);background:linear-gradient(135deg,rgba(124,58,237,.2),rgba(139,92,246,.15))}
.aud-title{font-size:1.05rem;font-weight:700;color:var(--n8);margin-bottom:.5rem}
.aud-desc{font-size:.9rem;color:var(--n5);line-height:1.65}
@media(max-width:768px){.aud-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:480px){.aud-grid{grid-template-columns:1fr}}


/* ═══════════════════════════════════════
   §10 HOW IT WORKS
   ═══════════════════════════════════════ */
.how-section{padding:3.5rem 1.5rem;background:linear-gradient(180deg,#f5f0ff,#fff,#eef5ff);position:relative;overflow:hidden}
.how-section::before{content:'';position:absolute;inset:0;background:radial-gradient(circle at 50% -20%,rgba(124,58,237,.08),transparent 50%);z-index:0}
.how-wrapper{max-width:1200px;margin:0 auto;text-align:center;position:relative;z-index:1}
.steps-row{display:flex;align-items:stretch;gap:0;margin-top:2.5rem}
.step-card{flex:1;background:linear-gradient(135deg,#fff,rgba(249,250,251,.9));border:2px solid rgba(124,58,237,.12);border-radius:var(--r-xl);padding:1.5rem 1.25rem;text-align:center;transition:all var(--ts);position:relative;box-shadow:0 8px 32px rgba(124,58,237,.08);overflow:hidden;animation:fadeUp 1s ease-out both}
.step-card-1{animation-delay:.2s}.step-card-2{animation-delay:.4s}.step-card-3{animation-delay:.6s}
.step-card::before{content:'';position:absolute;top:0;right:0;width:150px;height:150px;background:linear-gradient(135deg,var(--p),var(--s));opacity:.04;border-radius:50%;filter:blur(60px);transition:all var(--t)}
.step-card:hover::before{width:220px;height:220px;opacity:.1}
.step-card:hover{transform:translateY(-10px);border-color:rgba(124,58,237,.35);box-shadow:0 20px 52px rgba(124,58,237,.16),0 0 20px rgba(124,58,237,.08);background:linear-gradient(135deg,#fff,#f5f0ff)}
.step-num{font-family:var(--fd);font-size:2rem;font-weight:900;background:linear-gradient(135deg,var(--p),var(--s));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;line-height:1;margin-bottom:.5rem;opacity:.2}
.step-icon-img{width:60px;height:60px;object-fit:contain;object-position:center;margin:0 auto .75rem;animation:float 6s ease-in-out infinite;filter:drop-shadow(0 6px 16px rgba(124,58,237,.2))}
.step-card-1 .step-icon-img{animation-delay:0s}.step-card-2 .step-icon-img{animation-delay:2s}.step-card-3 .step-icon-img{animation-delay:4s}
.step-icon{width:52px;height:52px;background:linear-gradient(135deg,var(--p),var(--s));border-radius:var(--r-m);display:flex;align-items:center;justify-content:center;color:#fff;margin:0 auto 1.25rem;box-shadow:0 8px 24px rgba(124,58,237,.3);animation:glowPulse 3s ease-in-out infinite}
.step-title{font-size:.95rem;font-weight:700;color:var(--n8);margin-bottom:.4rem}
.step-desc{font-size:.82rem;color:var(--n5);line-height:1.6}
.step-connector{width:40px;min-width:40px;display:flex;align-items:center;justify-content:center;position:relative;flex-shrink:0}
.step-conn-line{position:absolute;top:50%;left:0;right:0;height:3px;transform:translateY(-50%);background:linear-gradient(90deg,rgba(124,58,237,.08),rgba(124,58,237,.5),rgba(59,130,246,.5),rgba(59,130,246,.08));border-radius:2px;box-shadow:0 0 12px rgba(124,58,237,.15)}
.step-conn-line::after{content:'';position:absolute;top:50%;left:5%;right:5%;height:8px;transform:translateY(-50%);background:linear-gradient(90deg,transparent,rgba(124,58,237,.1),rgba(59,130,246,.1),transparent);border-radius:4px;filter:blur(4px)}
.step-conn-node{position:absolute;top:50%;left:50%;width:10px;height:10px;transform:translate(-50%,-50%);background:linear-gradient(135deg,var(--p),var(--s));border-radius:50%;box-shadow:0 0 12px rgba(124,58,237,.6);z-index:2;animation:nodeGlow 2.5s ease-in-out infinite}
.step-conn-pulse{position:absolute;top:50%;width:6px;height:6px;background:var(--p5);border-radius:50%;transform:translateY(-50%);box-shadow:0 0 8px rgba(124,58,237,.8),0 0 16px rgba(124,58,237,.3);animation:stepPulseDot 2.5s linear infinite;z-index:3}
.step-conn-pulse-2{animation-delay:1.25s;background:var(--s5);box-shadow:0 0 8px rgba(59,130,246,.8),0 0 16px rgba(59,130,246,.3)}
.step-connector::after{content:'';position:absolute;right:-1px;top:50%;transform:translateY(-50%);border-left:9px solid var(--s5);border-top:6px solid transparent;border-bottom:6px solid transparent;filter:drop-shadow(0 0 6px rgba(59,130,246,.4));z-index:4;animation:arrowPulse 2.5s ease-in-out infinite}
@keyframes stepPulseDot{0%{left:-4px;opacity:0;transform:translateY(-50%) scale(.6)}10%{opacity:1;transform:translateY(-50%) scale(1)}85%{opacity:1;transform:translateY(-50%) scale(1)}100%{left:calc(100% - 4px);opacity:0;transform:translateY(-50%) scale(.6)}}
@keyframes arrowPulse{0%,100%{opacity:.5;filter:drop-shadow(0 0 4px rgba(59,130,246,.3))}50%{opacity:1;filter:drop-shadow(0 0 10px rgba(59,130,246,.6))}}
@media(max-width:768px){.steps-row{flex-direction:column;gap:0}.step-connector{width:100%;min-width:unset;height:36px;min-height:36px}.step-conn-line{top:0;bottom:0;left:50%;right:auto;width:3px;height:100%;transform:translateX(-50%);background:linear-gradient(180deg,rgba(124,58,237,.08),rgba(124,58,237,.5),rgba(59,130,246,.5),rgba(59,130,246,.08))}.step-conn-line::after{top:5%;bottom:5%;left:50%;right:auto;width:8px;height:auto;transform:translateX(-50%);background:linear-gradient(180deg,transparent,rgba(124,58,237,.1),rgba(59,130,246,.1),transparent)}.step-conn-node{top:50%;left:50%}.step-conn-pulse{top:auto;left:50%;transform:translateX(-50%);animation-name:stepPulseDotV}.step-conn-pulse-2{animation-name:stepPulseDotV}.step-connector::after{right:auto;top:auto;bottom:-1px;left:50%;transform:translateX(-50%);border-left:6px solid transparent;border-right:6px solid transparent;border-top:9px solid var(--s5);border-bottom:none}}
@keyframes stepPulseDotV{0%{top:-4px;opacity:0;transform:translateX(-50%) scale(.6)}10%{opacity:1;transform:translateX(-50%) scale(1)}85%{opacity:1;transform:translateX(-50%) scale(1)}100%{top:calc(100% - 4px);opacity:0;transform:translateX(-50%) scale(.6)}}


/* ═══════════════════════════════════════
   §11 AI ADVANTAGE — CONSTELLATION
   ═══════════════════════════════════════ */
.ai-adv-section{padding:3.5rem 1.5rem;background:linear-gradient(135deg,#fff 0%,#f8f4ff 40%,#f0f9ff 100%);position:relative;overflow:hidden}
.ai-adv-section::before{content:'';position:absolute;inset:0;background:radial-gradient(circle at 25% 50%,rgba(124,58,237,.08),transparent 50%),radial-gradient(circle at 75% 50%,rgba(59,130,246,.06),transparent 50%);z-index:0}
.ai-adv-wrapper{max-width:1300px;padding-right:2rem;margin:0 auto;position:relative;z-index:1;display:grid;grid-template-columns:1.15fr .85fr;gap:1.75rem 2.75rem;align-items:center}
.ai-adv-left{grid-column:1;display:flex;justify-content:center;align-items:center}
.ai-adv-right{grid-column:2;display:flex;flex-direction:column;gap:1.15rem}
.ai-adv-header{display:flex;flex-direction:column;gap:.5rem}
.ai-adv-header .sec-h2{font-size:clamp(1.65rem,3.5vw,2.25rem)}
.ai-adv-subtitle{font-size:.92rem;line-height:1.75;color:var(--n6);font-weight:400}
.ai-adv-cards-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:.85rem}
.ai-adv-card{background:linear-gradient(135deg,#fff,rgba(249,250,251,.9));border:1.5px solid rgba(124,58,237,.08);border-radius:var(--r-l);padding:.85rem;display:flex;flex-direction:column;gap:.35rem;transition:all var(--ts);box-shadow:0 4px 16px rgba(0,0,0,.04);position:relative;overflow:hidden;animation:fadeUp .8s ease-out both}
.ai-adv-card:nth-child(1){animation-delay:.3s}.ai-adv-card:nth-child(2){animation-delay:.4s}.ai-adv-card:nth-child(3){animation-delay:.5s}.ai-adv-card:nth-child(4){animation-delay:.6s}
.ai-adv-card::before{content:'';position:absolute;top:-50%;right:-50%;width:120px;height:120px;background:radial-gradient(circle,rgba(124,58,237,.06),transparent 70%);border-radius:50%;opacity:0;transition:all var(--ts)}
.ai-adv-card:hover::before{opacity:1;top:-30%;right:-30%}
.ai-adv-card:hover{transform:translateY(-5px);border-color:rgba(124,58,237,.22);box-shadow:0 10px 28px rgba(124,58,237,.1)}
.ai-adv-card-icon{width:36px;height:36px;background:linear-gradient(135deg,rgba(124,58,237,.12),rgba(139,92,246,.06));border-radius:var(--r-s);display:flex;align-items:center;justify-content:center;color:var(--p);transition:all var(--t);margin-bottom:.1rem}
.ai-adv-card:hover .ai-adv-card-icon{transform:scale(1.1) rotate(-6deg)}
.ai-adv-card-title{font-size:.82rem;font-weight:700;color:var(--n8)}
.ai-adv-card-desc{font-size:.72rem;color:var(--n5);line-height:1.5}
.aa-visual{position:relative;width:100%;max-width:520px;min-height:390px;margin:0 auto;animation:fadeUp 1s ease-out .2s both}
.aa-glow{position:absolute;border-radius:50%;filter:blur(50px);z-index:0;pointer-events:none}
.aa-glow-1{width:280px;height:280px;background:radial-gradient(circle,rgba(124,58,237,.2),transparent 70%);top:-40px;left:-30px;animation:aaGlow1 6s ease-in-out infinite}
.aa-glow-2{width:220px;height:220px;background:radial-gradient(circle,rgba(59,130,246,.16),transparent 70%);bottom:-25px;right:-15px;animation:aaGlow2 7s ease-in-out infinite}
@keyframes aaGlow1{0%,100%{transform:translate(0,0);opacity:.5}50%{transform:translate(15px,-12px);opacity:.85}}
@keyframes aaGlow2{0%,100%{transform:translate(0,0);opacity:.4}50%{transform:translate(-12px,14px);opacity:.75}}
.aa-main-card{position:relative;z-index:10;width:88%;margin:55px auto 0;background:rgba(255,255,255,.95);backdrop-filter:blur(18px);border:1.5px solid rgba(124,58,237,.12);border-radius:var(--r-l);box-shadow:0 20px 64px rgba(124,58,237,.14),0 4px 12px rgba(0,0,0,.05);overflow:hidden;transition:all var(--ts);animation:fadeUp .7s ease-out .4s both,aaMainBreath 5s ease-in-out 2s infinite}
.aa-main-card:hover{transform:translateY(-5px);box-shadow:0 28px 80px rgba(124,58,237,.18);border-color:rgba(124,58,237,.25)}
@keyframes aaMainBreath{0%,100%{border-color:rgba(124,58,237,.12);box-shadow:0 20px 64px rgba(124,58,237,.14),0 4px 12px rgba(0,0,0,.05)}50%{border-color:rgba(124,58,237,.22);box-shadow:0 20px 64px rgba(124,58,237,.2),0 4px 12px rgba(0,0,0,.05),0 0 20px rgba(124,58,237,.06)}}
.aa-main-top{display:flex;align-items:center;justify-content:space-between;padding:10px 14px;border-bottom:1px solid rgba(124,58,237,.06)}
.aa-main-top-left{display:flex;align-items:center;gap:5px}
.aa-main-label{font-size:.6rem;font-weight:800;color:var(--n5);text-transform:uppercase;letter-spacing:.06em;font-family:var(--fd)}
.aa-main-top-right{display:flex;gap:4px}
.aa-pill{font-size:.52rem;font-weight:700;padding:2px 8px;border-radius:var(--r-f);background:rgba(124,58,237,.08);color:var(--p);letter-spacing:.02em;position:relative;overflow:hidden}
.aa-pill::after{content:'';position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.5),transparent);animation:aaPillShimmer 3s ease-in-out 2s infinite}
.aa-pill-green{background:rgba(16,185,129,.08);color:var(--a)}
.aa-pill-green::after{animation-delay:2.5s}
@keyframes aaPillShimmer{0%{left:-100%}30%{left:100%}100%{left:100%}}
.aa-main-body{position:relative;height:390px;overflow:hidden}
.aa-main-img{width:100%;height:100%;object-fit:cover;display:block;transition:transform var(--ts)}
.aa-main-card:hover .aa-main-img{transform:scale(1.04)}
.aa-main-ph{width:100%;height:100%;background:linear-gradient(135deg,rgba(124,58,237,.04),rgba(59,130,246,.03))}
.aa-main-overlay{position:absolute;bottom:0;left:0;right:0;height:35%;background:linear-gradient(0deg,rgba(255,255,255,.75),transparent);pointer-events:none}
.aa-main-footer{display:flex;gap:8px;padding:9px 14px;border-top:1px solid rgba(124,58,237,.04)}
.aa-main-status{display:flex;align-items:center;gap:4px;font-size:.55rem;font-weight:700;color:var(--a);animation:fadeUp .4s ease-out 1.2s both}
.aa-main-status-gold{color:#d97706;animation-delay:1.4s}
.aa-float{position:absolute;z-index:20;background:rgba(255,255,255,.93);backdrop-filter:blur(16px);border:1.5px solid rgba(124,58,237,.1);border-radius:var(--r-m);padding:.7rem .9rem;box-shadow:0 8px 28px rgba(0,0,0,.06),0 1px 4px rgba(124,58,237,.04);transition:all .4s cubic-bezier(.34,1.56,.64,1);cursor:default}
.aa-float:hover{border-color:rgba(124,58,237,.28);box-shadow:0 12px 40px rgba(124,58,237,.14);transform:translateY(-4px) scale(1.02)!important}
.aa-float-brand{top:20px;left:-15px;animation:fadeUp .5s ease-out .55s both,aaFloatA 5.5s ease-in-out 1.5s infinite}
.aa-float-variants{bottom:-5px;left:-10px;animation:fadeUp .5s ease-out .7s both,aaFloatB 6s ease-in-out 2s infinite}
.aa-float-learning{top:15px;right:-12px;animation:fadeUp .5s ease-out .62s both,aaFloatC 5.8s ease-in-out 1.7s infinite}
.aa-float-workspace{bottom:18px;right:-8px;animation:fadeUp .5s ease-out .78s both,aaFloatD 5.3s ease-in-out 2.1s infinite}
@keyframes aaFloatA{0%,100%{transform:translate(0,0)}50%{transform:translate(-5px,-7px)}}
@keyframes aaFloatB{0%,100%{transform:translate(0,0)}50%{transform:translate(6px,5px)}}
@keyframes aaFloatC{0%,100%{transform:translate(0,0)}50%{transform:translate(5px,-6px)}}
@keyframes aaFloatD{0%,100%{transform:translate(0,0)}50%{transform:translate(-4px,6px)}}
.aa-float-head{display:flex;align-items:center;gap:5px;margin-bottom:.4rem}
.aa-float-title{font-size:.6rem;font-weight:800;color:var(--n8);font-family:var(--fd)}
.aa-float-copy{font-size:.52rem;color:var(--n5);line-height:1.45;margin:0;font-weight:500}
.aa-tag-row{display:flex;gap:3px;margin-bottom:.3rem}
.aa-tag{font-size:.5rem;font-weight:700;color:var(--p);padding:2px 6px;background:linear-gradient(135deg,rgba(124,58,237,.06),rgba(139,92,246,.03));border:1px solid rgba(124,58,237,.1);border-radius:var(--r-f);transition:all var(--t)}
.aa-tag:hover{border-color:rgba(124,58,237,.25);background:linear-gradient(135deg,rgba(124,58,237,.1),rgba(139,92,246,.06))}
.aa-thumbs-row{display:flex;gap:5px}
.aa-thumb-wrap{flex:1;height:48px;border-radius:var(--r-s);overflow:hidden;border:1.5px solid rgba(124,58,237,.08);transition:all var(--t)}
.aa-thumb-wrap:hover{border-color:rgba(124,58,237,.25);transform:translateY(-1px);box-shadow:0 4px 12px rgba(124,58,237,.08)}
.aa-thumb{width:100%;height:100%;object-fit:cover;display:block;transition:transform var(--t)}
.aa-thumb-wrap:hover .aa-thumb{transform:scale(1.1)}
.aa-thumb-ph{width:100%;height:100%;background:var(--n1)}
.aa-refinement{display:flex;flex-direction:column;gap:4px;margin-bottom:.35rem}
.aa-ref-row{display:flex;align-items:center;justify-content:space-between;padding:3px 0;opacity:.4;transition:all var(--t);animation:fadeUp .4s ease-out both}
.aa-ref-1{animation-delay:.9s;opacity:.3}.aa-ref-2{animation-delay:1.05s;opacity:.5}.aa-ref-3{animation-delay:1.2s;opacity:1}
.aa-ref-stars{display:flex;gap:2px}
.aa-ref-label{font-size:.48rem;font-weight:700;color:var(--n4);font-family:var(--fd);letter-spacing:.03em}
.aa-ref-label-now{color:var(--p);font-weight:800}
.aa-ref-badge{display:flex;align-items:center;gap:3px;font-size:.48rem;font-weight:800;color:var(--a);animation:fadeUp .4s ease-out 1.4s both}
.aa-mini-icons{display:flex;gap:5px}
.aa-mini-icon{width:28px;height:28px;background:linear-gradient(135deg,rgba(124,58,237,.06),rgba(59,130,246,.04));border:1px solid rgba(124,58,237,.08);border-radius:var(--r-s);display:flex;align-items:center;justify-content:center;transition:all var(--t)}
.aa-mini-icon:hover{border-color:rgba(124,58,237,.22);transform:translateY(-2px);box-shadow:0 3px 10px rgba(124,58,237,.08)}
.aa-mod-row{display:flex;gap:6px;width:100%}
.aa-mod{flex:1;display:flex;flex-direction:column;align-items:center;gap:3px;padding:6px 4px;background:linear-gradient(135deg,rgba(124,58,237,.04),rgba(59,130,246,.02));border:1px solid rgba(124,58,237,.08);border-radius:var(--r-s);transition:all var(--t)}
.aa-mod:hover{border-color:rgba(124,58,237,.2);transform:translateY(-1px);box-shadow:0 3px 8px rgba(124,58,237,.06)}
.aa-mod-icon{width:28px;height:28px;display:flex;align-items:center;justify-content:center;background:rgba(255,255,255,.8);border-radius:var(--r-s);box-shadow:0 1px 4px rgba(0,0,0,.04)}
.aa-mod-label{font-size:.42rem;font-weight:700;color:var(--n5);text-transform:uppercase;letter-spacing:.04em;font-family:var(--fd)}

@media(max-width:1024px){
  .ai-adv-wrapper{grid-template-columns:1fr}
  .ai-adv-left{order:2;margin-top:1rem}
  .ai-adv-right{order:1}
  .ai-adv-header .sec-h2{font-size:clamp(1.75rem,4vw,2.5rem)}
  .aa-visual{max-width:460px}
}
@media(max-width:768px){
  .ai-adv-section{padding:4rem 1.5rem}
  .ai-adv-cards-grid{grid-template-columns:1fr}
  .aa-visual{max-width:380px;min-height:400px}
  .aa-main-card{width:80%}
  .aa-main-body{height:170px}
  .aa-float-brand{top:15px;left:-5px}
  .aa-float-learning{top:10px;right:-5px}
  .aa-float-variants{bottom:10px;left:-5px}
  .aa-float-workspace{bottom:25px;right:-3px}
  .aa-thumb-wrap{height:40px}
}
@media(max-width:576px){
  .aa-visual{max-width:100%;min-height:360px}
  .aa-main-card{width:76%}
  .aa-float{padding:.55rem .7rem}
  .aa-float-title{font-size:.55rem}
  .aa-main-body{height:150px}
  .aa-thumb-wrap{height:36px}
}

/* ═══════════════════════════════════════
   §12 PRICING
   ═══════════════════════════════════════ */
.pricing-section{position:relative;padding:5rem 1.5rem;background:linear-gradient(180deg,#fff,#f8f4ff 40%,#f0f9ff);overflow:hidden}
.pricing-section::before{content:'';position:absolute;inset:0;background:radial-gradient(circle at 20% 0%,rgba(124,58,237,.08),transparent 40%),radial-gradient(circle at 80% 100%,rgba(59,130,246,.06),transparent 40%);z-index:0;pointer-events:none}
.pr-blob-1{position:absolute;width:500px;height:500px;background:radial-gradient(circle at 30% 70%,rgba(124,58,237,.15),transparent 60%);border-radius:40% 60% 70% 30%/40% 50% 60% 50%;top:-150px;left:-100px;animation:blobR 25s ease-in-out infinite;filter:blur(50px);z-index:1}
.pr-blob-2{position:absolute;width:450px;height:450px;background:radial-gradient(circle at 70% 30%,rgba(59,130,246,.12),transparent 60%);border-radius:60% 40% 30% 70%/60% 30% 70% 40%;bottom:-120px;right:-80px;animation:blobR 30s ease-in-out infinite reverse;filter:blur(50px);z-index:1}
.pr-wrapper{max-width:1200px;margin:0 auto;position:relative;z-index:2}
.pr-header{text-align:center;margin-bottom:3.5rem;animation:fadeUp 1s ease-out}
.tgl-container{display:flex;align-items:center;justify-content:center;gap:.85rem;margin-top:1.5rem;flex-wrap:wrap;background:linear-gradient(135deg,rgba(124,58,237,.05),rgba(59,130,246,.05));border:2px solid rgba(124,58,237,.15);border-radius:var(--r-f);padding:.75rem 1.5rem;width:fit-content;margin-left:auto;margin-right:auto;backdrop-filter:blur(10px);animation:scaleIn .8s ease-out .3s both}
.tgl-label{font-size:.85rem;font-weight:500;color:var(--p4);opacity:.8;transition:all .2s;user-select:none;cursor:pointer}.tgl-label.active{color:var(--p5);opacity:1;font-weight:700}
.tgl-switch{width:52px;height:30px;border-radius:var(--r-f);background:linear-gradient(90deg,var(--p),var(--s));position:relative;cursor:pointer;transition:all .22s;display:inline-flex;align-items:center;padding:3px;box-shadow:0 4px 12px rgba(124,58,237,.3)}
.tgl-dot{width:24px;height:24px;border-radius:50%;background:#fff;box-shadow:0 2px 6px rgba(0,0,0,.2);transform:translateX(0);transition:transform .22s}
.tgl-switch:hover{box-shadow:0 6px 16px rgba(124,58,237,.4);transform:translateY(-1px)}
.tgl-switch.active{background:linear-gradient(135deg,#6d5efc,#4f46e5);border-color:rgba(109,94,252,.5)}.tgl-switch.active .tgl-dot{transform:translateX(22px)}
.tgl-save{display:inline-block;background:linear-gradient(90deg,var(--a),var(--p));color:#fff;padding:.4rem .9rem;border-radius:var(--r-m);font-size:.7rem;font-weight:700;box-shadow:0 4px 12px rgba(16,185,129,.3)}
.pr-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:2rem;animation:fadeUp 1.2s ease-out .3s both}
.pr-card{position:relative;background:linear-gradient(135deg,#fff,rgba(249,250,251,.95));border:2px solid rgba(124,58,237,.12);border-radius:var(--r-xl);padding:2.5rem;display:flex;flex-direction:column;gap:1.25rem;transition:all var(--ts);box-shadow:0 8px 32px rgba(0,0,0,.06);overflow:hidden;backdrop-filter:blur(10px);animation:fadeUp 1s ease-out both}
.pr-card:nth-child(1){animation-delay:.4s}.pr-card:nth-child(2){animation-delay:.5s}.pr-card:nth-child(3){animation-delay:.6s}
.pr-card::before{content:'';position:absolute;top:-50%;right:-50%;width:300px;height:300px;background:radial-gradient(circle,rgba(124,58,237,.1),transparent 70%);border-radius:50%;z-index:0;opacity:0;transition:all var(--ts)}
.pr-card:hover::before{opacity:1;top:-30%;right:-30%}
.pr-card>*{position:relative;z-index:1}
.pr-card:hover{transform:translateY(-8px);border-color:rgba(124,58,237,.3);box-shadow:0 16px 48px rgba(124,58,237,.12),0 4px 16px rgba(0,0,0,.08)}
.pr-card-hl{border:2px solid var(--p);background:linear-gradient(135deg,rgba(124,58,237,.04),rgba(59,130,246,.02));box-shadow:0 0 0 1px rgba(124,58,237,.1),0 24px 60px rgba(124,58,237,.15);transform:scale(1.05)}
.pr-card-hl::after{content:'';position:absolute;inset:0;background:linear-gradient(135deg,rgba(124,58,237,.05),transparent);border-radius:var(--r-xl);pointer-events:none}
.pr-card-hl:hover{transform:scale(1.05) translateY(-8px);box-shadow:0 0 0 1px rgba(124,58,237,.15),0 28px 72px rgba(124,58,237,.2)}
.pr-badge{display:none}.pr-badge-hl{display:inline-block;background:linear-gradient(135deg,var(--p),var(--s));color:#fff;padding:.4rem 1rem;border-radius:var(--r-f);font-size:.7rem;font-weight:700;letter-spacing:.05em;text-transform:uppercase;width:fit-content;font-family:var(--fd);box-shadow:0 6px 16px rgba(124,58,237,.3)}
.pr-name{font-size:1.25rem;font-weight:800;color:var(--n8);letter-spacing:-.01em}
.pr-sub{font-size:.85rem;color:var(--n5);font-weight:500;margin:-.25rem 0 0}
.pr-price{display:flex;align-items:baseline;gap:.4rem;margin:.5rem 0}
.pr-cur{font-size:1.1rem;font-weight:700;color:var(--n5)}
.pr-amt{font-family:var(--fd);font-size:clamp(2.5rem,5vw,3.5rem);font-weight:800;background:linear-gradient(90deg,var(--p),var(--s));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;line-height:1;letter-spacing:-.02em}
.pr-per{font-size:.85rem;color:var(--n5);font-weight:600}
.pr-meta{width:100%;display:flex;align-items:center;gap:8px;margin-top:6px}.pr-orig{font-size:.78rem;font-weight:600;color:#ef4444;text-decoration:line-through}
.pr-save{font-size:.72rem;font-weight:700;color:var(--a);background:rgba(16,185,129,.1);border:1px solid rgba(16,185,129,.2);padding:4px 8px;border-radius:var(--r-f)}
.pr-btn{font-weight:700!important;border-radius:var(--r-l)!important;padding:.1rem 1.5rem!important;border:none!important;cursor:pointer;transition:all var(--ts)!important;font-size:.85rem!important;position:relative;overflow:hidden}
.pr-btn-secondary{background:rgba(124,58,237,.08)!important;color:var(--p)!important;border:2px solid var(--p)!important}
.pr-btn-secondary:hover{background:rgba(124,58,237,.15)!important;transform:translateY(-2px);box-shadow:0 8px 20px rgba(124,58,237,.2)!important}
.pr-btn-primary{background:linear-gradient(135deg,var(--p),var(--s))!important;color:#fff!important;box-shadow:0 8px 24px rgba(124,58,237,.3)!important}
.pr-btn-primary::before{content:'';position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.3),transparent);transition:left .6s ease}
.pr-btn-primary:hover{transform:translateY(-2px);box-shadow:0 12px 36px rgba(124,58,237,.4)!important}
.pr-btn-primary:hover::before{left:100%}
.pr-microcopy{font-size:.75rem;color:var(--n4);text-align:center;font-weight:500;margin-top:-.25rem}
.pr-divider{height:1px;background:linear-gradient(90deg,transparent,rgba(124,58,237,.2),transparent);margin:.5rem 0}
.pr-feats{list-style:none;padding:0;display:flex;flex-direction:column;gap:.85rem}
.pr-feats li{display:flex;align-items:center;gap:.6rem;font-size:.85rem;color:var(--n5);font-weight:500;transition:all var(--t)}
.pr-card:hover .pr-feats li{transform:translateX(3px);color:var(--n8)}
.pr-chk{display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;background:linear-gradient(135deg,rgba(16,185,129,.15),rgba(16,185,129,.08));border-radius:var(--r-s);color:var(--a);font-weight:700;font-size:.72rem;flex-shrink:0}
.pr-chk-off{display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;background:rgba(107,114,128,.1);border-radius:var(--r-s);color:rgba(107,114,128,.45);font-weight:700;font-size:.72rem;flex-shrink:0}
@media(max-width:768px){.pr-grid{grid-template-columns:1fr}.pr-card-hl{transform:scale(1)}.pr-card-hl:hover{transform:translateY(-8px)}}


/* ═══════════════════════════════════════
   §13 FAQ
   ═══════════════════════════════════════ */
.faq-section{padding:3rem 1.5rem;background:linear-gradient(135deg,#fff,#f8f4ff 50%,#f0f9ff);position:relative;overflow:hidden}
.faq-section::before{content:'';position:absolute;inset:0;background:radial-gradient(circle at 20% 50%,rgba(124,58,237,.08),transparent 50%),radial-gradient(circle at 80% 50%,rgba(59,130,246,.06),transparent 50%);z-index:0}
.faq-wrapper{max-width:1200px;margin:0 auto;display:grid;grid-template-columns:240px 1fr;gap:2.5rem;align-items:flex-start;position:relative;z-index:1}
.faq-left{display:flex;justify-content:center;animation:slideL 1s ease-out .2s both;position:sticky;top:80px}
.faq-img{width:100%;max-width:220px;border-radius:var(--r-xl);box-shadow:0 16px 48px rgba(124,58,237,.15);animation:float 6s ease-in-out infinite;border:1.5px solid rgba(124,58,237,.12);object-fit:cover}
.faq-right{display:flex;flex-direction:column;gap:1.25rem;animation:slideR 1s ease-out .2s both}
.faq-hd-content{display:flex;flex-direction:column;gap:.5rem;margin-bottom:.5rem}
.faq-h2{margin-bottom:0}
.faq-badge-pill{display:inline-flex;gap:.5rem;background:linear-gradient(135deg,rgba(124,58,237,.12),rgba(139,92,246,.08));border:1.5px solid rgba(124,58,237,.3);border-radius:var(--r-f);padding:.45rem .9rem;font-size:.65rem;font-weight:700;letter-spacing:.12em;text-transform:capitalize;color:var(--p);width:fit-content;font-family:var(--fd)}
.faq-items{display:flex;flex-direction:column;gap:0}
.faq-item{border-bottom:1px solid rgba(124,58,237,.08);animation:fadeUp .8s ease-out both}
.faq-item:nth-child(1){animation-delay:.3s}.faq-item:nth-child(2){animation-delay:.36s}.faq-item:nth-child(3){animation-delay:.42s}.faq-item:nth-child(4){animation-delay:.48s}.faq-item:nth-child(5){animation-delay:.54s}
.faq-hd{display:flex;justify-content:space-between;align-items:center;gap:1rem;cursor:pointer;padding:.7rem 0;transition:all var(--t);user-select:none}
.faq-hd:hover{transform:translateX(4px)}
.faq-q{font-size:.9rem;font-weight:700;color:var(--n8);transition:all var(--t);line-height:1.35}.faq-hd:hover .faq-q{color:var(--p)}
.faq-arr{width:26px;height:26px;display:flex;align-items:center;justify-content:center;color:var(--p);background:rgba(124,58,237,.08);border:1.5px solid rgba(124,58,237,.15);border-radius:var(--r-s);flex-shrink:0;transition:all .3s cubic-bezier(.34,1.56,.64,1)}
.faq-hd:hover .faq-arr{background:rgba(124,58,237,.14);border-color:rgba(124,58,237,.3)}
.faq-arr.active{transform:rotate(180deg);background:rgba(124,58,237,.12);border-color:rgba(124,58,237,.25)}
.faq-a{overflow:hidden;max-height:0;opacity:0;transition:all var(--t)}
.faq-a[style*="display: block"]{max-height:500px;opacity:1;padding-bottom:.6rem;animation:slideUp .3s ease-out}
.faq-a-text{font-size:.82rem;line-height:1.65;color:var(--n5)}
@media(max-width:1024px){.faq-wrapper{grid-template-columns:1fr}.faq-left{position:relative;top:auto}}
@media(max-width:576px){.faq-left{display:none}}


/* §13b FINAL CTA */
.fcta-section{position:relative;padding:4rem 1.5rem;text-align:center;background:linear-gradient(180deg,#f0f9ff 0%,#fff 100%);overflow:hidden}
.fcta-glow-1{position:absolute;width:350px;height:350px;background:radial-gradient(circle,rgba(124,58,237,.12),transparent 70%);border-radius:50%;top:-100px;left:20%;filter:blur(60px);animation:aaGlow1 6s ease-in-out infinite;pointer-events:none}
.fcta-glow-2{position:absolute;width:300px;height:300px;background:radial-gradient(circle,rgba(59,130,246,.1),transparent 70%);border-radius:50%;bottom:-80px;right:20%;filter:blur(60px);animation:aaGlow2 7s ease-in-out infinite;pointer-events:none}
.fcta-content{position:relative;z-index:1;max-width:600px;margin:0 auto;animation:fadeUp 1s ease-out}
.fcta-title{font-family:var(--fd);font-size:clamp(1.75rem,4vw,2.5rem);font-weight:900;line-height:1.1;letter-spacing:-.03em;color:var(--n8);margin-bottom:.75rem}
.fcta-sub{font-size:1rem;color:var(--n5);font-weight:500;margin-bottom:2rem}
.fcta-btn{background:linear-gradient(135deg,var(--p),var(--s))!important;color:#fff!important;font-weight:800!important;padding:.85rem 2.5rem!important;border-radius:var(--r-l)!important;border:none!important;font-size:1rem!important;cursor:pointer;transition:all var(--ts)!important;box-shadow:0 12px 40px rgba(124,58,237,.3);position:relative;overflow:hidden}
.fcta-btn::before{content:'';position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.3),transparent);transition:left .6s ease}
.fcta-btn:hover{transform:translateY(-4px);box-shadow:0 16px 56px rgba(124,58,237,.4)}
.fcta-btn:hover::before{left:100%}


/* ═══════════════════════════════════════
   §14 NEWSLETTER V5
   ═══════════════════════════════════════ */
.nl5-section{position:relative;padding:3.5rem 1.5rem;background:linear-gradient(135deg,#0a0e27,#1a1f3a 40%,#0f2d4a 80%,#0a0e27);border-radius:var(--r-2xl);margin:3.5rem auto;overflow:hidden;min-height:340px;display:flex;align-items:center;justify-content:center;width:calc(100% - 4rem);max-width:1300px;box-shadow:0 32px 100px rgba(124,58,237,.35),inset 0 1px 0 rgba(255,255,255,.1);border:1px solid rgba(124,58,237,.2)}
.nl5-hex-bg{position:absolute;inset:0;background-image:linear-gradient(30deg,transparent 24%,rgba(124,58,237,.05) 25%,rgba(124,58,237,.05) 26%,transparent 27%,transparent 74%,rgba(124,58,237,.05) 75%,rgba(124,58,237,.05) 76%,transparent 77%),linear-gradient(150deg,transparent 24%,rgba(124,58,237,.05) 25%,rgba(124,58,237,.05) 26%,transparent 27%,transparent 74%,rgba(124,58,237,.05) 75%,rgba(124,58,237,.05) 76%,transparent 77%);background-size:60px 60px;animation:hexShift 20s linear infinite;opacity:.3;z-index:1}
.nl5-sphere-left{position:absolute;left:-130px;top:50%;transform:translateY(-50%);width:420px;height:420px;border-radius:50%;background:radial-gradient(circle at 30% 30%,rgba(196,181,253,.8),transparent 40%),linear-gradient(135deg,rgba(124,58,237,.4),rgba(59,130,246,.2) 50%,rgba(15,52,96,.3));box-shadow:0 0 70px rgba(124,58,237,.6),0 0 130px rgba(124,58,237,.3),inset -45px -45px 90px rgba(0,0,0,.4),inset 35px 35px 55px rgba(255,255,255,.15);filter:drop-shadow(0 0 50px rgba(124,58,237,.5));opacity:.8;animation:sphereFL 8s ease-in-out infinite;z-index:2}
.nl5-sphere-right{position:absolute;right:-160px;top:50%;transform:translateY(-50%);width:460px;height:460px;border-radius:50%;background:radial-gradient(circle at 35% 35%,rgba(236,72,153,.7),transparent 35%),conic-gradient(from 0deg at 40% 40%,#3b82f6,#7c3aed 90deg,#ec4899 180deg,#f59e0b 270deg,#3b82f6);box-shadow:0 0 90px rgba(59,130,246,.6),0 0 160px rgba(236,72,153,.4),inset -55px -55px 110px rgba(0,0,0,.3),inset 35px 35px 70px rgba(255,255,255,.1);filter:drop-shadow(0 0 60px rgba(59,130,246,.5)) drop-shadow(0 0 100px rgba(236,72,153,.3));opacity:.75;animation:sphereFR 10s ease-in-out infinite;z-index:2}
.nl5-content{position:relative;z-index:10;text-align:center;display:flex;flex-direction:column;align-items:center;gap:1.15rem;max-width:700px}
.nl5-badge{display:inline-flex;align-items:center;gap:.5rem;background:linear-gradient(135deg,rgba(124,58,237,.2),rgba(236,72,153,.15));border:2px solid rgba(124,58,237,.4);border-radius:var(--r-f);padding:.6rem 1.25rem;font-size:.7rem;font-weight:800;letter-spacing:.15em;text-transform:uppercase;color:var(--p4);font-family:var(--fd);box-shadow:0 8px 32px rgba(124,58,237,.15);white-space:nowrap}
.nl5-badge span:first-child{font-size:1rem;filter:drop-shadow(0 0 8px rgba(124,58,237,.5))}
.nl5-title{font-family:var(--fd);font-size:clamp(2rem,5vw,3.25rem);font-weight:900;color:#fff;line-height:1.08;letter-spacing:-.04em;text-shadow:0 0 30px rgba(124,58,237,.3),0 16px 48px rgba(0,0,0,.4)}
.nl5-gradient-text{background:linear-gradient(90deg,#60a5fa,#a78bfa,#ec4899,#f59e0b);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;font-style:italic;font-weight:900;background-size:200% 200%;animation:gradShift 4s ease-in-out infinite}
.nl5-subtitle{font-size:clamp(.88rem,1.8vw,1rem);line-height:1.7;color:rgba(255,255,255,.85);font-weight:400;text-shadow:0 4px 16px rgba(0,0,0,.3)}
.nl5-form-wrapper{width:100%;max-width:560px;margin:1rem 0 0}
.nl5-form{display:flex;align-items:center;gap:.85rem;background:linear-gradient(135deg,rgba(255,255,255,.1),rgba(255,255,255,.05));border:2px solid rgba(255,255,255,.15);border-radius:var(--r-xl);padding:.85rem;backdrop-filter:blur(20px);box-shadow:0 8px 32px rgba(0,0,0,.2),inset 0 1px 0 rgba(255,255,255,.1)}
.nl5-input{flex:1;padding:.75rem 1.1rem;border:none;border-radius:var(--r-l);font-size:.92rem;background:rgba(255,255,255,.95);color:#0a0e27;font-family:var(--fb);font-weight:500;outline:none;box-shadow:0 4px 16px rgba(0,0,0,.1)}
.nl5-input::placeholder{color:rgba(10,14,39,.5)}
.nl5-input:focus{box-shadow:0 8px 32px rgba(124,58,237,.2),0 0 0 2px rgba(124,58,237,.1);background:#fff;transform:translateY(-2px)}
.nl5-btn{background:linear-gradient(135deg,var(--p),var(--s))!important;color:#fff!important;font-weight:800!important;padding:.1rem 1.5rem!important;border-radius:var(--r-l)!important;border:none!important;font-size:.92rem!important;cursor:pointer;transition:all var(--ts)!important;box-shadow:0 10px 36px rgba(124,58,237,.4),0 0 16px rgba(59,130,246,.2);white-space:nowrap;display:flex;align-items:center;gap:.5rem;position:relative;overflow:hidden}
.nl5-btn::before{content:'';position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.3),transparent);transition:left .6s ease}
.nl5-btn:hover{transform:translateY(-4px);box-shadow:0 14px 48px rgba(124,58,237,.5),0 0 36px rgba(59,130,246,.3)}
.nl5-btn:hover::before{left:100%}
.nl5-feats{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:1rem;margin-top:1rem;width:100%}
.nl5-feat-item{display:flex;align-items:center;gap:.45rem;background:rgba(124,58,237,.08);border:1px solid rgba(124,58,237,.2);border-radius:var(--r-m);padding:.75rem 1.15rem;font-size:.8rem;color:rgba(255,255,255,.9);font-weight:600;transition:all var(--t);backdrop-filter:blur(10px)}
.nl5-feat-item:hover{background:rgba(124,58,237,.15);border-color:rgba(124,58,237,.4);transform:translateY(-2px)}
.nl5-feat-check{width:22px;height:22px;background:linear-gradient(135deg,#10b981,#34d399);border-radius:var(--r-s);display:flex;align-items:center;justify-content:center;color:#fff;font-weight:700;font-size:.8rem;flex-shrink:0;box-shadow:0 4px 12px rgba(16,185,129,.3)}
@media(max-width:768px){.nl5-section{padding:2.5rem 1.5rem;margin:2.5rem auto;width:calc(100% - 3rem);min-height:300px}.nl5-sphere-left{width:220px;height:220px;left:-70px;opacity:.6}.nl5-sphere-right{width:240px;height:240px;right:-90px;opacity:.55}.nl5-form{flex-direction:column;gap:.5rem}.nl5-btn{width:100%;justify-content:center}.nl5-feats{grid-template-columns:1fr}}
@media(max-width:576px){.nl5-sphere-left{display:none}.nl5-sphere-right{width:160px;height:160px;right:-50px;opacity:.4}}


/* ═══════════════════════════════════════
   §15 FOOTER
   ═══════════════════════════════════════ */
.footer{background:linear-gradient(135deg,var(--n9),#1a1f3a);color:#fff;padding:3.5rem 1.5rem 1.5rem;border-top:1px solid rgba(124,58,237,.2)}
.ft-content{max-width:1200px;margin:0 auto;display:grid;grid-template-columns:2fr 3fr;gap:3rem;margin-bottom:2.5rem}
.ft-logo{display:flex;align-items:center;margin-bottom:1.5rem;transition:all var(--t)}
.ft-logo-link{display:inline-flex;text-decoration:none;transition:all var(--t)}
.ft-logo-link:hover{transform:translateY(-2px);opacity:.85}
.ft-tag{font-size:.875rem;color:rgba(255,255,255,.6);line-height:1.6}
.ft-froggy-wrap{margin-top:.75rem}.ft-froggy-img{animation:float 6s ease-in-out infinite}
.ft-links{display:grid;grid-template-columns:repeat(3,1fr);gap:2.5rem}
.ft-sec-title{font-weight:800;margin-bottom:1.5rem;color:#fff;font-size:.875rem;text-transform:uppercase;letter-spacing:.08em;font-family:var(--fd)}
.ft-link{display:block;color:rgba(255,255,255,.5);text-decoration:none;font-size:.875rem;margin-bottom:.875rem;transition:all var(--t);font-weight:500}
.ft-link:hover{color:var(--p);transform:translateX(4px)}
.ft-bottom{max-width:1200px;margin:0 auto;display:flex;justify-content:space-between;align-items:center;padding-top:1.5rem;border-top:1px solid rgba(124,58,237,.15);flex-wrap:wrap;gap:1.5rem}
.ft-copy{font-size:.875rem;color:rgba(255,255,255,.4)}
.ft-soc-row{display:flex;gap:1rem}
.ft-soc{color:rgba(255,255,255,.5);text-decoration:none;transition:all var(--t);display:flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:var(--r-m);background:rgba(124,58,237,.1);border:1px solid rgba(124,58,237,.2)}
.ft-soc:hover{color:#fff;transform:translateY(-3px);background:rgba(124,58,237,.25);border-color:var(--p)}
@media(max-width:768px){.ft-content{grid-template-columns:1fr}.ft-links{grid-template-columns:repeat(3,1fr)}}
@media(max-width:576px){.ft-links{grid-template-columns:1fr}}


/* §16 A11Y + SELECTION */
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}.mq-track{animation-play-state:paused!important}}
::selection{background:rgba(124,58,237,.3);color:#fff}
button:focus-visible,a:focus-visible{outline:2px solid var(--p);outline-offset:2px}


/* ═══════════════════════════════════════
   COMPARATIVA v3 — DESKTOP + MOBILE
   ═══════════════════════════════════════ */
.cmp-section{padding:5rem 1.5rem;background:var(--n0);position:relative;overflow:hidden}
.cmp-wrapper{max-width:920px;margin:0 auto}
.cmp-header{text-align:center;max-width:600px;margin:0 auto 3rem}
.cmp-table{position:relative}
.cmp-col-hl{position:absolute;top:0;bottom:0;left:28%;width:18%;background:rgba(124,58,237,.03);border:1px solid rgba(124,58,237,.07);border-radius:var(--r-m);pointer-events:none;z-index:0}
.cmp-headers{display:grid;grid-template-columns:28% 18% 18% 18% 18%;align-items:center;padding-bottom:.75rem;border-bottom:1px solid var(--n2);position:relative;z-index:1}
.cmp-hcell{display:flex;align-items:center;justify-content:center;padding:.3rem .5rem}
.cmp-hcell-crit{justify-content:flex-start}
.cmp-hcell-fp{justify-content:center}
.cmp-logo-img{height:22px!important;object-fit:contain}
.cmp-hcell-other{justify-content:center}
.cmp-hname{font-size:.68rem;font-weight:500;color:var(--n4)}
.cmp-hcell-other{flex-direction:column!important;gap:4px}
.cmp-comp-icon{width:24px;height:24px;object-fit:contain;border-radius:var(--r-s)}
.cmp-rows{position:relative;z-index:1}
.cmp-row{display:grid;grid-template-columns:28% 18% 18% 18% 18%;align-items:center;padding:.75rem 0;border-bottom:1px solid rgba(226,232,240,.5);transition:background .15s ease}
.cmp-row:last-child{border-bottom:none}
.cmp-row:hover{background:rgba(124,58,237,.01)}
.cmp-cell{padding:0 .5rem;display:flex;align-items:center;justify-content:center}
.cmp-cell-crit{justify-content:flex-start;padding-left:.25rem}
.cmp-crit{font-size:.88rem;font-weight:600;color:var(--n7)}
.cmp-cell-fp{justify-content:center}
.cmp-cell-other{justify-content:center}
.cmp-cta{display:flex;flex-direction:column;align-items:center;gap:1.15rem;margin-top:2.75rem;text-align:center}
.cmp-cta-sub{font-size:.88rem;color:var(--n4);font-weight:400;margin:0;max-width:480px}
.cmp-cta-btn{background:linear-gradient(135deg,var(--p),var(--s))!important;color:#fff!important;font-weight:800!important;padding:.8rem 2.25rem!important;border-radius:var(--r-l)!important;border:none!important;font-size:.95rem!important;cursor:pointer;transition:all var(--ts)!important;box-shadow:0 10px 32px rgba(124,58,237,.28);position:relative;overflow:hidden}
.cmp-cta-btn::before{content:'';position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.25),transparent);transition:left .6s ease}
.cmp-cta-btn:hover{transform:translateY(-3px);box-shadow:0 14px 44px rgba(124,58,237,.36)}
.cmp-cta-btn:hover::before{left:100%}


/* ═══════════════════════════════════════════════════════════════
   MOBILE-FIRST SECTIONS
   ═══════════════════════════════════════════════════════════════ */

/* M §1 — GLOBAL TYPOGRAPHY MOBILE */
@media(max-width:768px){
  .sec-h2{font-size:clamp(1.45rem,5.5vw,2rem)!important;letter-spacing:-.025em!important;margin-bottom:.75rem!important}
  .sec-p{font-size:.9rem!important;line-height:1.65!important;max-width:100%!important}
  .sc-badge{padding:.5rem 1rem!important;font-size:.65rem!important;letter-spacing:.1em!important;margin-bottom:1rem!important}
  .hl-grad{display:inline}
}
@media(max-width:480px){
  .sec-h2{font-size:clamp(1.3rem,6vw,1.7rem)!important}
  .sec-p{font-size:.85rem!important}
}

/* M §2 — HEADER */
@media(max-width:768px){
  .header-sticky{padding:0 1rem!important;height:52px!important}
  .header-content{gap:.75rem!important}
  .header-logo img,#brand-logo{height:44px!important}
  .header-btn-login{padding:.4rem .7rem!important;font-size:.75rem!important}
  .header-btn-cta{padding:.4rem 1rem!important;font-size:.75rem!important;box-shadow:0 4px 12px rgba(124,58,237,.2)!important}
  .header-btn-cta::before{display:none}
}
@media(max-width:480px){
  .header-sticky{padding:0 .75rem!important;height:48px!important}
  .header-logo img,#brand-logo{height:36px!important}
  .header-btn-login{display:none!important}
  .header-btn-cta{padding:.35rem .85rem!important;font-size:.72rem!important}
}


/* ═══════════════════════════════════════════════════════
   FROGGY PIXEL — LANDING MOBILE PADDING CONSISTENCY
   ═══════════════════════════════════════════════════════ */


/* ─────────────────────────────────────────────────────
   M §3 — HERO  (UPDATED: trust & persona are now
   siblings of hero-left/hero-right inside hero-split)
   ───────────────────────────────────────────────────── */
@media(max-width:768px){
  .hero-section{
    padding:56px 0 1.5rem!important;
    min-height:auto!important;
    height:auto!important;
    max-height:none!important;
    overflow:visible!important;
    align-items:flex-start!important;
    justify-content:flex-start!important;
  }

  .hero-split{
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    padding:0 1.5rem!important;
    gap:0!important;
  }

  /* ── hero-left: badge + title + sub-mobile + CTA ── */
  .hero-left{
    order:1;
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    width:100%!important;
    animation:none!important;
    opacity:1!important;
    transform:none!important;
  }

  .hero-badge{
    order:1;
    width:auto;
    margin-bottom:.3rem!important;
    font-size:.6rem!important;
    padding:.35rem .75rem!important;
    animation:none!important;
    opacity:1!important;
    transform:none!important;
  }

  .hero-h1{
    order:2;
    width:100%;
    text-align:center!important;
    font-size:clamp(1.45rem,6vw,1.95rem)!important;
    line-height:1.35!important;
    margin-bottom:.35rem!important;
    animation:none!important;
    opacity:1!important;
    transform:none!important;
  }

  .hero-sub{
    order:99;
    display:none!important;
  }

  .hero-sub-mobile{
    order:3;
    display:block!important;
    width:100%;
    animation:none!important;
    opacity:1!important;
    transform:none!important;
  }

  /* CTA is last child of hero-left */
  .hero-btns{
    order:4;
    width:100%;
    justify-content:center!important;
    margin-bottom:.6rem!important;
    animation:none!important;
  }

  /* ── hero-right: diagrama (order 2 de hero-split) ── */
  .hero-right{
    order:3;
    width:100%;
    padding:0 .25rem;
    margin:.35rem 0 .45rem;
    animation:none!important;
  }

  .hero-reinforcement{
    order:2;
    display:block!important;
    width:100%;
    margin:.15rem 0 .1rem!important;
    font-size:.82rem!important;
    opacity:.85;
  }

  /* ── hero-trust: bullets DEBAJO del diagrama (order 3 de hero-split) ── */
  .hero-trust{
    order:4;
    width:100%;
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    gap:.28rem!important;
    padding-top:.15rem!important;
    padding-bottom:.25rem!important;
    border-top:none!important;
    animation:none!important;
  }

  /* ── hero-persona: texto "Ideal para..." (order 4 de hero-split) ── */
  .hero-persona{
    order:5;
    width:100%;
    text-align:center;
    font-size:.65rem!important;
    margin-bottom:.6rem!important;
  }

  .hero-deco-1{width:200px!important;height:200px!important;top:-100px!important;left:-60px!important;opacity:.4!important}
  .hero-deco-2{width:160px!important;height:160px!important;right:-80px!important;opacity:.3!important}
  .hero-deco-3{display:none!important}
  .hero-grid-bg{opacity:.3!important}

  .hero-btn-primary{
    padding:.6rem 1.2rem!important;
    font-size:.82rem!important;
    box-shadow:0 6px 16px rgba(124,58,237,.2)!important;
  }

  .hero-btn-primary::before{display:none!important}
  .trust-item{font-size:.7rem!important}

  .hero-flow-visual{
    flex-direction:column!important;
    gap:0!important;
    max-width:380px!important;
    margin:0 auto!important;
  }

  .flow-zone-brand{
    display:flex!important;
    flex-direction:row!important;
    flex-wrap:nowrap!important;
    justify-content:center!important;
    gap:5px!important;
    min-width:unset!important;
    overflow-x:auto;
    scrollbar-width:none;
    -webkit-overflow-scrolling:touch;
  }

  .flow-zone-brand::-webkit-scrollbar{display:none}

  .bchip{
    padding:5px 9px!important;
    gap:5px!important;
    border-radius:8px!important;
    box-shadow:none!important;
    flex-shrink:0;
    background:rgba(255,255,255,.9)!important;
    border-color:rgba(124,58,237,.1)!important;
  }

  .bchip:hover{transform:none!important}
  .bchip-icon{width:22px!important;height:22px!important;border-radius:6px!important}
  .bchip-label{font-size:8.5px!important}
  .bchip-detail{display:none!important}
  .bchip-text{gap:0!important}

  .flow-connector{
    display:flex!important;
    width:100%!important;
    min-width:unset!important;
    height:28px!important;
    min-height:28px!important;
  }

  .flow-connector::before{
    top:0!important;
    bottom:0!important;
    left:50%!important;
    right:auto!important;
    width:2px!important;
    height:100%!important;
    transform:translateX(-50%)!important;
    background:linear-gradient(180deg,rgba(124,58,237,.06),rgba(124,58,237,.32),rgba(59,130,246,.32),rgba(59,130,246,.06))!important;
  }

  .flow-connector::after{display:none!important}
  .flow-node{width:5px!important;height:5px!important;animation:nodeGlow 3s ease-in-out infinite!important;box-shadow:0 0 4px rgba(124,58,237,.35)!important}
  .flow-pulse,.flow-pulse-2{display:block!important;left:50%!important;transform:translateX(-50%)!important;animation-name:pulseDotV!important;width:4px!important;height:4px!important}

  .flow-zone-product{flex:none!important;width:100%!important}

  .hero-mockup{
    max-width:360px!important;
    margin:0 auto!important;
    animation:none!important;
    box-shadow:0 12px 36px rgba(124,58,237,.12),0 2px 8px rgba(0,0,0,.04)!important;
    border-radius:var(--r-l)!important;
  }

  .hero-mockup:hover{
    transform:none!important;
    box-shadow:0 12px 36px rgba(124,58,237,.12),0 2px 8px rgba(0,0,0,.04)!important;
  }

  .mbody{grid-template-columns:1fr 1.3fr!important;min-height:160px!important}
  .mpanel-prompt{border-right:1px solid rgba(124,58,237,.06)!important;border-bottom:none!important}
  .mtop-right{display:flex!important}

  .flow-zone-social{
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    gap:6px!important;
    min-width:unset!important;
  }

  .flow-social-icons{
    display:flex!important;
    flex-direction:row!important;
    flex-wrap:nowrap!important;
    justify-content:center!important;
    gap:5px!important;
  }

  .schip{
    padding:5px 9px!important;
    gap:5px!important;
    box-shadow:none!important;
    flex-shrink:0;
    background:rgba(255,255,255,.9)!important;
  }

  .schip:hover{transform:none!important}
  .schip-icon{width:22px!important;height:22px!important}
  .schip-label{font-size:8.5px!important}
  .flow-status{padding:4px 9px!important;margin-top:2px!important;flex-shrink:0}
  .flow-status-text{font-size:8px!important}
}

@media(max-width:576px){
  .hero-section{
    padding:50px 0 1.25rem!important;
    min-height:auto!important;
    height:auto!important;
    max-height:none!important;
    overflow:visible!important;
    align-items:flex-start!important;
    justify-content:flex-start!important;
  }

  .hero-split{padding:0 1.25rem!important}
  .hero-h1{font-size:1.35rem!important}
  .hero-sub-mobile{font-size:.8rem!important;max-width:300px!important}
  .hero-reinforcement{font-size:.78rem!important}
  .hero-btns{
    flex-direction:column!important;
    align-items:stretch!important;
    gap:.5rem!important;
  }

  .hero-btn-primary{justify-content:center!important;text-align:center!important}

  .flow-zone-brand{display:flex!important;gap:4px!important}
  .flow-zone-social{display:flex!important;flex-direction:column!important;align-items:center!important;gap:5px!important}
  .flow-social-icons{display:flex!important;flex-direction:row!important;gap:4px!important}
  .flow-connector{display:flex!important;height:22px!important;min-height:22px!important}
  .hero-flow-visual{max-width:100%!important}
  .hero-mockup{max-width:100%!important}
  .mbody{grid-template-columns:1fr 1.3fr!important;min-height:140px!important}
  .mpanel-prompt{border-right:1px solid rgba(124,58,237,.06)!important;border-bottom:none!important;padding:8px!important}
  .mpanel-preview{padding:8px!important}
  .mtop-right{display:flex!important}
  .mtop{padding:5px 10px!important}
  .mfooter{padding:5px 10px!important}
  .bchip{padding:4px 7px!important;gap:4px!important}
  .bchip-icon{width:20px!important;height:20px!important}
  .bchip-label{font-size:8px!important}
  .schip{padding:4px 7px!important;gap:4px!important}
  .schip-icon{width:20px!important;height:20px!important}
  .schip-label{font-size:8px!important}
  .hero-trust{flex-direction:column!important;gap:.2rem!important}
  .trust-item{font-size:.68rem!important}
}

@media(max-width:400px){
  .hero-split{padding:0 1rem!important}
  .hero-h1{font-size:1.22rem!important}
  .hero-sub-mobile{font-size:.76rem!important;max-width:280px!important}
  .bchip{padding:3px 6px!important}
  .bchip-icon{width:18px!important;height:18px!important}
  .bchip-label{font-size:7px!important}
  .schip{padding:3px 6px!important}
  .schip-icon{width:18px!important;height:18px!important}
  .schip-label{font-size:7px!important}
  .flow-status{padding:3px 7px!important}
  .flow-status-text{font-size:7px!important}
  .hero-reinforcement{font-size:.72rem!important}
  .flow-connector{height:16px!important;min-height:16px!important}
}

@media (max-width:430px) and (max-height:740px){
  .hero-section{padding-top:54px!important}
  .hero-badge{font-size:.58rem!important;padding:.32rem .68rem!important;margin-bottom:.22rem!important}
  .hero-h1{font-size:clamp(1.18rem,5.8vw,1.55rem)!important;line-height:1.08!important;margin-bottom:.28rem!important}
  .hero-sub-mobile{font-size:.72rem!important;line-height:1.42!important;max-width:265px!important}
  .hero-right{margin:.25rem 0 .5rem!important}
}

/* ─────────────────────────────────────────────────────
   M §4 — SHOWCASE MARQUEE
   ───────────────────────────────────────────────────── */
@media(max-width:768px){
  .showcase-section{padding:3.5rem 0 3rem!important}
  .sc-header{padding:0 1.5rem!important;margin-bottom:2.5rem!important}
  .mq-gallery{gap:.5rem!important}
  .mq-track{gap:.5rem!important}
  .mq-item{height:140px!important;border-width:1px!important}
  .mq-img{min-width:100px!important}
  .mq-row:nth-child(1) .mq-item{height:130px!important}
  .mq-row:nth-child(2) .mq-item{height:150px!important}
  .mq-row:nth-child(3) .mq-item{height:120px!important}
  .mq-row:nth-child(4) .mq-item{height:140px!important}
}


/* ─────────────────────────────────────────────────────
   M §5 — PERFORMANCE BOOST
   ───────────────────────────────────────────────────── */
@media(max-width:1024px){.perf-wrapper{grid-template-columns:1fr!important;gap:2.5rem!important}.perf-right{order:2}.perf-left{order:1}}
@media(max-width:768px){
  .perf-section{padding:3.5rem 1.5rem!important}
  .perf-features-grid{grid-template-columns:1fr!important;gap:1.25rem!important}
  .perf-feature-card{flex-direction:row!important;align-items:flex-start!important;gap:.75rem!important}
  .perf-feature-icon{width:44px!important;height:44px!important;flex-shrink:0!important;border-radius:var(--r-m)!important}
  .perf-feature-title{font-size:.92rem!important}
  .perf-feature-desc{font-size:.82rem!important}
  .perf-description{font-size:.9rem!important}
  .pf-scene{max-width:100%!important}
  .pf-var{height:75px!important}
  .pf-vconn{height:24px!important}
  .pf-brief,.pf-engine,.pf-publish{animation:none!important}
  .pf-vpulse,.pf-vpulse-2{display:none!important}
  .pf-shimmer-bar{animation:none!important}
}
@media(max-width:480px){.pf-cal-row{gap:2px!important}.pf-cal-letter{font-size:.42rem!important}.pf-cal-num{font-size:.55rem!important}}


/* ─────────────────────────────────────────────────────
   M §6 — SOCIAL PROOF
   ───────────────────────────────────────────────────── */
@media(max-width:768px){
  .sp-section{padding:3rem 1.5rem!important}
  .sp-title{margin-bottom:1.75rem!important;font-size:.7rem!important}
  .sp-stats{grid-template-columns:1fr 1fr!important;gap:1rem!important}
  .sp-box{padding:1.5rem 1rem!important;border-radius:var(--r-l)!important;box-shadow:0 2px 8px rgba(0,0,0,.04)!important;border-width:1.5px!important}
  .sp-box:hover{transform:none!important}
  .sp-icon{width:40px!important;height:40px!important;margin-bottom:.1rem!important}
  .sp-number{font-size:1.75rem!important}
  .sp-stat{font-size:.8rem!important}
  .sp-label{font-size:.7rem!important}
}
@media(max-width:480px){.sp-stats{grid-template-columns:1fr 1fr!important;gap:.75rem!important}.sp-number{font-size:1.5rem!important}}


/* ─────────────────────────────────────────────────────
   M §7 — AUDIENCE
   ───────────────────────────────────────────────────── */
@media(max-width:768px){
  .audience-section{padding:3.5rem 1.5rem!important}
  .aud-grid{grid-template-columns:1fr 1fr!important;gap:1rem!important;margin-top:2rem!important}
  .aud-card{padding:1.15rem 1.25rem .65rem!important;border-radius:var(--r-l)!important;box-shadow:0 2px 10px rgba(0,0,0,.04)!important}
  .aud-card::before{display:none!important}
  .aud-card:hover{transform:none!important}
  .aud-icon{width:42px!important;height:42px!important;margin-bottom:1.35rem!important}
  .aud-title{font-size:.9rem!important;margin-bottom:.35rem!important}
  .aud-desc{font-size:.78rem!important;line-height:1.5!important}
  .aud-icon{width:42px!important;height:42px!important;margin:0 auto 1.35rem!important}
}
@media(max-width:480px){
  .aud-grid{grid-template-columns:1fr!important;gap:.85rem!important}
  .aud-card{flex-direction:row!important;align-items:flex-start!important;gap:1rem!important;text-align:left!important;padding:1.25rem 1.5rem .85rem!important}
  .aud-icon{margin:0 .25rem 0 0!important;flex-shrink:0!important;width:46px!important;height:46px!important}
}


/* ─────────────────────────────────────────────────────
   M §8 — HOW IT WORKS
   ───────────────────────────────────────────────────── */
@media(max-width:768px){
  .how-section{padding:3rem 1.5rem!important}
  .steps-row{flex-direction:column!important;gap:0!important}
  .step-card{padding:1.25rem 1rem!important;box-shadow:0 2px 10px rgba(124,58,237,.04)!important}
  .step-card::before{display:none!important}
  .step-card:hover{transform:none!important;box-shadow:0 2px 10px rgba(124,58,237,.04)!important}
  .step-num{font-size:1.25rem!important;margin-bottom:.25rem!important}
  .step-icon-img{width:44px!important;height:44px!important;margin-bottom:.5rem!important;animation:none!important}
  .step-title{font-size:.88rem!important}
  .step-desc{font-size:.78rem!important}
  .step-connector{height:28px!important;min-height:28px!important}
  .step-conn-pulse,.step-conn-pulse-2{display:none!important}
  .step-connector::after{display:none!important}
  .step-conn-line{background:linear-gradient(180deg,rgba(124,58,237,.06),rgba(124,58,237,.2),rgba(124,58,237,.06))!important}
  .step-conn-node{width:6px!important;height:6px!important;animation:none!important;box-shadow:0 0 4px rgba(124,58,237,.3)!important}
}


/* ─────────────────────────────────────────────────────
   M §9 — AI ADVANTAGE (REDESIGNED MOBILE)
   
   Strategy: use `display:contents` on .ai-adv-right so
   .ai-adv-header and .ai-adv-cards-grid become direct
   children of the wrapper flex container. This lets us
   interleave: header → visual → value cards.
   ───────────────────────────────────────────────────── */
 
@media(max-width:1024px){
  .ai-adv-wrapper{
    display:flex!important;
    flex-direction:column!important;
    gap:2rem!important;
  }
 
  /* Break .ai-adv-right so its children participate in flex ordering */
  .ai-adv-right{
    display:contents!important;
  }
 
  /* ORDER: 1=header, 2=visual, 3=value cards */
  .ai-adv-header{
    order:1!important;
    text-align:center!important;
    width:100%!important;
  }
  .ai-adv-header .sc-badge{
    margin-left:auto!important;
    margin-right:auto!important;
  }
 
  .ai-adv-left{
    order:2!important;
    width:100%!important;
    margin-top:0!important;
  }
 
  .ai-adv-cards-grid{
    order:3!important;
    width:100%!important;
  }
}
 
 
@media(max-width:768px){
  .ai-adv-section{
    padding:2.5rem 1.5rem!important;
  } 
  .ai-adv-wrapper{
    gap:1.15rem!important;
  }
 
  /* ── HEADER ── */
  .ai-adv-header{
    text-align:center!important;
    align-items:center!important;
  }
  .ai-adv-header .sec-h2{
    font-size:clamp(1.4rem,5vw,1.85rem)!important;
  }
  .ai-adv-subtitle{
    font-size:.85rem!important;
    text-align:center!important;
  }
  .ai-adv-header{gap:.45rem!important}
  .ai-adv-header .sc-badge{margin-bottom:.25rem!important}

  /* ── VISUAL: main card as hero, floating cards as compact grid ── */
  .aa-visual{
    position:relative!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    gap:.65rem!important;
    min-height:auto!important;
    max-width:100%!important;
    width:100%!important;
    padding:0!important;
  }
 
  .aa-glow{display:none!important}
 
  /* Main card — HERO of the section, prominent */
  .aa-main-card{
    position:relative!important;
    width:92%!important;
    max-width:420px!important;
    margin:0 auto!important;
    animation:none!important;
    order:1!important;
    z-index:10!important;
    border-radius:var(--r-l)!important;
    box-shadow:0 16px 48px rgba(124,58,237,.14),0 4px 12px rgba(0,0,0,.06)!important;
  }
  .aa-main-card:hover{
    transform:none!important;
  }
  .aa-main-body{
    height:170px!important;
  }
 
  /* ── FLOATING CARDS: compact 2×2 grid, support role ── */
  .aa-float{
    position:static!important;
    width:100%!important;
    animation:none!important;
    transform:none!important;
    padding:.4rem .65rem!important;
    border-radius:var(--r-m)!important;
    box-shadow:0 2px 8px rgba(0,0,0,.04)!important;
    border-width:1px!important;
  }
  .aa-float:hover{
    transform:none!important;
  }
 
  /* Wrap all 4 floating cards in a 2×2 grid via order */
  .aa-float-brand{   order:2!important; }
  .aa-float-learning{ order:3!important; }
  .aa-float-variants{ order:4!important; }
  .aa-float-workspace{ order:5!important; }
 
  /* Use the flex gap + wrap to create the 2×2 effect */
  .aa-visual{
    flex-wrap:wrap!important;
    justify-content:center!important;
  }
 
  /* Main card takes full width to stay on its own row */
  .aa-main-card{
    flex:0 0 auto!important;
    width:92%!important;
  }
 
  /* Floating cards: each takes ~half width minus gap */
  .aa-float{
      flex:0 0 100%!important;
      max-width:100%!important;
    }
 
  /* Compact internal styles for floating cards */
  .aa-float-head{
    margin-bottom:.3rem!important;
  }
  .aa-float-title{
    font-size:.58rem!important;
  }
  .aa-float-copy{
    font-size:.5rem!important;
    line-height:1.4!important;
  }
  .aa-tag-row{
    margin-bottom:.2rem!important;
  }
  .aa-tag{
    font-size:.48rem!important;
    padding:1.5px 5px!important;
  }
  .aa-thumbs-row{
    gap:4px!important;
  }
  .aa-thumb-wrap{
    height:38px!important;
  }
  .aa-refinement{
    gap:3px!important;
    margin-bottom:.25rem!important;
  }
  .aa-ref-label{
    font-size:.45rem!important;
  }
  .aa-ref-badge{
    font-size:.45rem!important;
  }
  .aa-mini-icons{
    gap:4px!important;
  }
  .aa-mini-icon{
    width:24px!important;
    height:24px!important;
  }

  .aa-float-variants{flex:0 0 100%!important;max-width:100%!important;padding:.5rem .85rem .55rem!important}
  .aa-float-variants .aa-thumbs-row{gap:6px!important}
  .aa-float-variants .aa-thumb-wrap{height:80px!important;flex:1 1 0!important}
  
  /* ── VALUE CARDS: the real selling points ── */
  .ai-adv-cards-grid{
    display:grid!important;
    grid-template-columns:1fr 1fr!important;
    gap:.55rem!important;
  }
  .ai-adv-card{
    padding:.7rem .85rem!important;
    border-width:1px!important;
    animation:none!important;
  }
  .ai-adv-card::before{display:none!important}
  .ai-adv-card:hover{transform:none!important}
  .ai-adv-card-icon{
    width:32px!important;
    height:32px!important;
  }
  .ai-adv-card-title{
    font-size:.8rem!important;
  }
  .ai-adv-card-desc{
    font-size:.7rem!important;
  }
}
 
 
/* ── 480px: tighter but still 2-col where possible ── */
@media(max-width:480px){
  .ai-adv-wrapper{
    gap:1.25rem!important;
  }
 
  .aa-main-card{
    width:96%!important;
  }
  .aa-main-body{
    height:350px!important;
  }
 

  .aa-thumb-wrap{
    height:34px!important;
  }

  .aa-float-variants .aa-thumb-wrap{height:110px!important}
 
  /* Value cards: switch to 1 column on narrow screens */
  .ai-adv-cards-grid{
    grid-template-columns:1fr!important;
  }
 
  /* Value cards become horizontal layout for density */
  .ai-adv-card{
    display:flex!important;
    flex-direction:row!important;
    align-items:flex-start!important;
    gap:.65rem!important;
    padding:.85rem 1rem!important;
  }
  .ai-adv-card-icon{
    flex-shrink:0!important;
    margin-bottom:0!important;
  }
}
 
 
/* ── 400px: most compact ── */
@media(max-width:400px){
  .aa-main-body{
    height:155px!important;
  }


  .ai-adv-header .sec-h2{
    font-size:clamp(1.25rem,5.5vw,1.6rem)!important;
  }
  .ai-adv-subtitle{
    font-size:.8rem!important;
  }
}

/* ─────────────────────────────────────────────────────
   M §10 — COMPARATIVA
   ───────────────────────────────────────────────────── */
@media(max-width:768px){
  .cmp-section{padding:3.5rem 1.5rem!important}
  .cmp-header{margin-bottom:2rem!important}
  
  .cmp-headers,.cmp-row{grid-template-columns:28% 18% 18% 18% 18%!important}
  .cmp-col-hl{left:28%!important;width:18%!important}
  .cmp-comp-icon{width:18px!important;height:18px!important}
  .cmp-hname{font-size:.58rem!important}

  .cmp-crit{font-size:.78rem!important;line-height:1.35!important}
  .cmp-hname{font-size:.7rem!important}
  .cmp-logo-img{height:16px!important}
  .cmp-row{padding:.6rem 0!important}
  .cmp-cell{padding:0 .25rem!important}
  .cmp-cell svg,.cmp-cell-fp svg,.cmp-cell-other svg{width:20px!important;height:20px!important}
  .cmp-cta-sub{font-size:.82rem!important}
  .cmp-cta-btn{padding:.7rem 1.5rem!important;font-size:.88rem!important}
}
@media(max-width:400px){
  .cmp-headers,.cmp-row{grid-template-columns:30% 17.5% 17.5% 17.5% 17.5%!important}
  .cmp-col-hl{left:30%!important;width:17.5%!important}
  .cmp-comp-icon{width:14px!important;height:14px!important}
  .cmp-hname{font-size:.52rem!important}
  .cmp-crit{font-size:.72rem!important}
  .cmp-hname{font-size:.62rem!important}
  .cmp-logo-img{height:14px!important}
  .cmp-cell svg,.cmp-cell-fp svg,.cmp-cell-other svg{width:18px!important;height:18px!important}
  .cmp-cta-btn{width:100%!important;justify-content:center!important}
}


/* ─────────────────────────────────────────────────────
   M §11 — PRICING
   ───────────────────────────────────────────────────── */
@media(max-width:768px){
  .pricing-section{padding:3.5rem 1.5rem!important}
  .pr-blob-1,.pr-blob-2{display:none!important}
  .pr-header{margin-bottom:2.5rem!important}
  .pr-grid{grid-template-columns:1fr!important;gap:1.15rem!important}
  .pr-card{padding:1.75rem 1.25rem!important;border-radius:var(--r-l)!important;box-shadow:0 2px 10px rgba(0,0,0,.04)!important}
  .pr-card::before{display:none!important}
  .pr-card:hover{transform:none!important}
  .pr-card-hl{transform:none!important;border-width:2px!important;box-shadow:0 4px 20px rgba(124,58,237,.1)!important}
  .pr-card-hl:hover{transform:none!important}
  .pr-name{font-size:1.1rem!important}
  .pr-amt{font-size:clamp(2rem,6vw,2.75rem)!important}
  .tgl-container{padding:.6rem 1.15rem!important}
}


/* ─────────────────────────────────────────────────────
   M §12 — FAQ
   ───────────────────────────────────────────────────── */
@media(max-width:1024px){.faq-wrapper{grid-template-columns:1fr!important;gap:1.5rem!important}.faq-left{position:static!important;justify-content:center!important}.faq-img{max-width:140px!important}}
@media(max-width:576px){
  .faq-section{padding:3rem 1.5rem!important}
  .faq-left{display:none!important}
  .faq-q{font-size:.85rem!important}
  .faq-a-text{font-size:.78rem!important}
  .faq-arr{width:22px!important;height:22px!important}
  .faq-badge-pill{font-size:.6rem!important;padding:.35rem .7rem!important}
}


/* ─────────────────────────────────────────────────────
   M §13 — FINAL CTA
   ───────────────────────────────────────────────────── */
@media(max-width:768px){
  .fcta-section{padding:3rem 1.5rem!important}
  .fcta-glow-1,.fcta-glow-2{display:none!important}
  .fcta-title{font-size:clamp(1.35rem,5vw,1.85rem)!important}
  .fcta-sub{font-size:.9rem!important;margin-bottom:1.5rem!important}
  .fcta-btn{padding:.7rem 1.75rem!important;font-size:.9rem!important;box-shadow:0 6px 16px rgba(124,58,237,.2)!important}
  .fcta-btn::before{display:none!important}
}
@media(max-width:480px){.fcta-btn{width:100%!important;justify-content:center!important}}


/* ─────────────────────────────────────────────────────
   M §14 — NEWSLETTER
   ───────────────────────────────────────────────────── */
@media(max-width:768px){
  .nl5-section{padding:2.5rem 1.5rem!important;margin:2.5rem auto!important;width:calc(100% - 3rem)!important;min-height:auto!important;border-radius:var(--r-xl)!important}
  .nl5-sphere-left{width:160px!important;height:160px!important;left:-60px!important;opacity:.4!important}
  .nl5-sphere-right{width:180px!important;height:180px!important;right:-70px!important;opacity:.35!important}
  .nl5-title{font-size:clamp(1.4rem,5vw,2rem)!important}
  .nl5-subtitle{font-size:.85rem!important;line-height:1.55!important}
  .nl5-form{flex-direction:column!important;gap:.6rem!important;padding:.7rem!important}
  .nl5-input{width:100%!important;padding:.65rem .9rem!important;font-size:.88rem!important}
  .nl5-btn{width:100%!important;justify-content:center!important;padding:.65rem 1.25rem!important;font-size:.88rem!important}
  .nl5-btn::before{display:none!important}
  .nl5-feats{grid-template-columns:1fr!important;gap:.6rem!important}
  .nl5-feat-item{justify-content:center!important;text-align:center!important;padding:.6rem .9rem!important;font-size:.75rem!important}
}
@media(max-width:480px){
  .nl5-section{width:calc(100% - 3rem)!important;padding:2rem 1.25rem!important;margin:2rem auto!important}
  .nl5-sphere-left{display:none!important}
  .nl5-sphere-right{width:120px!important;height:120px!important;right:-40px!important;opacity:.25!important}
  .nl5-badge{font-size:.6rem!important;padding:.4rem .9rem!important}
}


/* ─────────────────────────────────────────────────────
   M §15 — FOOTER
   ───────────────────────────────────────────────────── */
@media(max-width:768px){
  .footer{padding:2.5rem 1.5rem 1.25rem!important}
  .ft-content{grid-template-columns:1fr!important;gap:2rem!important;margin-bottom:2rem!important}
  .ft-links{grid-template-columns:1fr 1fr!important;gap:1.25rem 1.5rem!important}
  .ft-sec-title{font-size:.78rem!important;margin-bottom:1rem!important}
  .ft-link{font-size:.82rem!important;margin-bottom:.65rem!important}
  .ft-tag{font-size:.82rem!important}
  .ft-froggy-img{width:15%!important}
}
@media(max-width:480px){
  .footer{padding:2rem 1.25rem 1rem!important}
  .ft-bottom{flex-direction:column!important;align-items:center!important;text-align:center!important;gap:.75rem!important}
  .ft-copy{font-size:.78rem!important}
  .ft-soc-row{gap:.6rem!important}
  .ft-soc{width:34px!important;height:34px!important}
}


/* ─────────────────────────────────────────────────────
   M §16 — KILL ALL OVERFLOW
   ───────────────────────────────────────────────────── */
@media(max-width:768px){
  html,body,.lp{overflow-x:hidden!important}
  .cmp-glow-1,.cmp-glow-2{display:none!important}
  .sp-box:hover,.aud-card:hover,.step-card:hover,.pr-card:hover{box-shadow:0 2px 10px rgba(0,0,0,.06)!important;transform:none!important}
  .bchip:hover,.schip:hover,.mthumb:hover,.ai-adv-card:hover,.aa-float:hover,.faq-hd:hover{transform:none!important}
}


/* ─────────────────────────────────────────────────────
   M §17 — REDUCED MOTION
   ───────────────────────────────────────────────────── */
@media(max-width:768px){
  .hero-left,.hero-right,.hero-trust,.hero-persona,.perf-left,.perf-right,.faq-left,.faq-right,.sc-header,.cmp-header,.ai-adv-card,.sp-box,.aud-card,.step-card,.pr-card,.faq-item,.aa-float,.aa-main-card{animation:none!important}
  .hero-mockup{animation:none!important}
  .step-icon-img{animation:none!important}
  .faq-img{animation:none!important}
  .ft-froggy-img{animation:none!important}
  .header-btn-cta::before,.hero-btn-primary::before,.fcta-btn::before,.nl5-btn::before,.cmp-cta-btn::before,.pr-btn-primary::before,.aa-pill::after{display:none!important}
}