/* ============================================================
   GROWISTS · Hoja de estilos de fidelidad (tema hijo)
   Generada desde el design system Growists — no editar a mano
   los bloques compartidos con el plugin growists-elements.
   ============================================================ */

/* ============================ RESET / BASE ============================ */
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{font-family:"Inter",system-ui,sans-serif;line-height:1.6;color:var(--fg);background:var(--page-bg);overflow-x:clip}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
h1,h2,h3,h4{font-family:"Space Grotesk",system-ui,sans-serif;line-height:1.04;letter-spacing:-.025em;font-weight:700}

/* ============================ BRAND TOKENS ============================ */
:root{
  --navy-950:#050f1c; --navy-900:#0a2239; --navy-800:#0f2f4d; --navy-700:#163f66; --navy-600:#1f527f;
  --teal:#48BED9; --teal-400:#6fcee2; --teal-300:#98dced; --teal-700:#1d94ac;
  --violet:#787CFE; --violet-400:#9598fe; --violet-700:#5054cf; --violet-800:#3d40a3;
  --white:#F8FCFF; --ink-500:#667585; --ink-300:#b2bcc7; --ink-200:#d3dae1; --ink-100:#e8edf1; --ink-50:#f3f6f9;
  --page-bg:var(--white); --fg:var(--navy-900); --fg-muted:#4b5b6b;
  --grad-brand:linear-gradient(115deg,#787CFE 0%,#5a8ff0 48%,#48BED9 100%);
  --grad-brand-soft:linear-gradient(115deg,#787CFE22 0%,#48BED922 100%);
  --grad-navy:linear-gradient(155deg,#0a2239 0%,#0f2f4d 55%,#12495f 120%);
  --maxw:1200px; --pad:clamp(20px,5vw,64px);
  --r-lg:22px; --r-md:16px; --r-sm:11px;
  --shadow-soft:0 24px 60px -28px rgba(10,34,57,.45);
  --shadow-card:0 20px 50px -24px rgba(10,34,57,.30);
}

/* ============================ SECTION TONE SYSTEM ============================ */
.section{padding:clamp(72px,9vw,128px) 0;position:relative;overflow:hidden}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 var(--pad);position:relative;z-index:3}
.tone-light{background:var(--white);color:var(--navy-900);--fg-muted:#4b5b6b;--card-bg:#fff;--card-bd:var(--ink-100);--eyebrow:var(--teal-700)}
.tone-wash{background:var(--ink-50);color:var(--navy-900);--fg-muted:#4b5b6b;--card-bg:#fff;--card-bd:var(--ink-100);--eyebrow:var(--teal-700)}
.tone-navy{background:var(--navy-900);color:var(--white);--fg-muted:rgba(248,252,255,.66);--card-bg:rgba(255,255,255,.04);--card-bd:rgba(255,255,255,.10);--eyebrow:var(--teal)}
.tone-hero{background:var(--grad-navy);color:var(--white);--fg-muted:rgba(248,252,255,.72);--card-bg:rgba(255,255,255,.05);--card-bd:rgba(255,255,255,.12);--eyebrow:var(--teal)}

/* ============================ NEW VECTOR LANGUAGE ============================ */
/* aurora: soft drifting brand-gradient light behind dark surfaces */
.aurora{position:absolute;inset:-20% -10%;z-index:0;pointer-events:none;overflow:hidden}
.aurora span{position:absolute;border-radius:50%;filter:blur(70px);opacity:.5;will-change:transform}
.aurora .a1{width:520px;height:520px;background:radial-gradient(circle,#787CFE,transparent 68%);top:-140px;right:6%;animation:drift1 22s ease-in-out infinite}
.aurora .a2{width:440px;height:440px;background:radial-gradient(circle,#48BED9,transparent 68%);bottom:-160px;left:-4%;animation:drift2 26s ease-in-out infinite}
.aurora .a3{width:300px;height:300px;background:radial-gradient(circle,#5054cf,transparent 66%);top:30%;left:44%;opacity:.32;animation:drift1 30s ease-in-out infinite reverse}
@keyframes drift1{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(-60px,50px) scale(1.12)}}
@keyframes drift2{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(70px,-40px) scale(1.08)}}
/* node network: connected-system motif (edges draw in, nodes pulse) */
.netviz{position:absolute;z-index:1;pointer-events:none;overflow:visible}
.netviz .edge{stroke:url(#netg);stroke-width:1.5;fill:none;stroke-dasharray:1;stroke-dashoffset:1;opacity:0;transition:opacity .5s}
.in .netviz .edge,.netviz.solo .edge{opacity:.55;animation:draw 1.4s ease forwards}
.netviz .nd{fill:var(--teal);opacity:0;animation:pop .5s ease forwards}
.netviz .nd.v{fill:var(--violet-400)}
.in .netviz .nd,.netviz.solo .nd{animation:pop .6s ease forwards,pulse 3.4s ease-in-out infinite}
@keyframes draw{to{stroke-dashoffset:0;opacity:.55}}
@keyframes pop{from{opacity:0;transform:scale(0)}to{opacity:.95;transform:scale(1)}}
@keyframes pulse{0%,100%{opacity:.5}50%{opacity:1}}
/* growth path: refined ascending line crossing a boundary */
.gpath{position:absolute;z-index:2;pointer-events:none}
.gpath path{stroke:url(#netg);fill:none;stroke-width:2.5;stroke-linecap:round;stroke-dasharray:2;stroke-dashoffset:2;opacity:.7}
.in .gpath path,.gpath.solo path{animation:draw2 1.8s ease forwards}
.gpath .nd{fill:var(--teal);opacity:0}.gpath .nd.v{fill:var(--violet-400)}
.in .gpath .nd,.gpath.solo .nd{animation:pop .6s ease forwards,pulse 3.4s ease-in-out infinite}
.gpath.on-grad path{stroke:rgba(255,255,255,.6)}.gpath.on-grad .nd{fill:#fff}
@keyframes draw2{to{stroke-dashoffset:0}}
@media (prefers-reduced-motion:reduce){.aurora span{animation:none}.netviz .edge,.netviz .nd,.gpath path{animation:none!important;opacity:.5;stroke-dashoffset:0}}

/* ============================ TYPE ============================ */
.eyebrow{font-family:"Space Grotesk";font-weight:600;font-size:13px;letter-spacing:.15em;text-transform:uppercase;color:var(--eyebrow);display:inline-flex;align-items:center;gap:12px;margin-bottom:24px}
.eyebrow .eb-n{font-size:13px;letter-spacing:0;background:var(--grad-brand);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;font-weight:700}
.eyebrow .eb-n::after{content:"";display:inline-block;width:22px;height:2px;background:currentColor;color:var(--eyebrow);opacity:.5;margin-left:12px;vertical-align:middle}
h1.hero-t{font-size:clamp(2.6rem,1.4rem+3.9vw,4.6rem);font-weight:700;margin-bottom:26px}
h2.sec-t{font-size:clamp(2rem,1.3rem+2.4vw,3.25rem)}
h3{font-size:clamp(1.25rem,1rem+.7vw,1.6rem)}
.lead{font-size:clamp(1.05rem,.98rem+.4vw,1.3rem);color:var(--fg-muted);max-width:46ch}
.muted{color:var(--fg-muted)}
.accent{color:var(--teal-700)}
.tone-navy .accent,.tone-hero .accent{color:var(--teal)}

/* ============================ BUTTONS ============================ */
.btn{display:inline-flex;align-items:center;gap:11px;font-family:"Space Grotesk";font-weight:600;font-size:16px;padding:16px 28px;border-radius:100px;border:0;cursor:pointer;transition:transform .2s,box-shadow .2s,background .2s,color .2s;white-space:nowrap}
.btn-primary{background:var(--grad-brand);color:#fff;box-shadow:0 12px 30px -10px rgba(120,124,254,.6);position:relative;overflow:hidden}
.btn-primary::after{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 30%,rgba(255,255,255,.35) 50%,transparent 70%);transform:translateX(-120%)}
.btn-primary:hover{transform:translateY(-2px);box-shadow:0 20px 44px -12px rgba(72,190,217,.65)}
.btn-primary:hover::after{transform:translateX(120%);transition:transform .7s ease}
.arw{transition:transform .2s}.btn:hover .arw{transform:translateX(4px)}
.btn-ghost{background:transparent;border:1.5px solid currentColor;color:inherit}
.btn-ghost:hover{background:currentColor}
.btn-ghost:hover span{color:var(--navy-900)}
.tone-navy .btn-ghost:hover span,.tone-hero .btn-ghost:hover span{color:var(--navy-900)}
.link-arrow{font-family:"Space Grotesk";font-weight:600;display:inline-flex;align-items:center;gap:9px;color:var(--teal-700)}
.tone-navy .link-arrow{color:var(--teal)}
.cta-note{font-size:13.5px;color:var(--fg-muted);margin-top:18px;display:flex;align-items:center;gap:9px;justify-content:center}
.cta-note .dot{width:5px;height:5px;border-radius:50%;background:var(--teal)}

/* ============================ NAV ============================ */
.scroll-prog{position:fixed;top:0;left:0;height:2px;width:0;background:var(--grad-brand);z-index:120}
header.nav{position:fixed;top:0;left:0;right:0;z-index:100;transition:background .35s,box-shadow .35s,backdrop-filter .35s}
.nav-in{max-width:1320px;margin:0 auto;padding:18px var(--pad);display:flex;align-items:center;justify-content:space-between;gap:24px}
.nav-logo{height:30px;width:auto}
.nav-links{display:flex;align-items:center;gap:34px}
.nav-links a,.nav-drop>button{font-family:"Space Grotesk";font-weight:500;font-size:15.5px;color:#fff;background:none;border:0;cursor:pointer;display:inline-flex;align-items:center;gap:6px;letter-spacing:-.01em;transition:opacity .2s}
.nav-links a:hover,.nav-drop>button:hover{opacity:.72}
.nav-drop{position:relative}
.nav-drop>button .chev{transition:transform .25s}
.nav-drop:hover>button .chev{transform:rotate(180deg)}
.drop-panel{position:absolute;top:calc(100% + 18px);left:50%;transform:translateX(-50%) translateY(8px);width:640px;background:#fff;border-radius:var(--r-md);box-shadow:0 30px 70px -20px rgba(10,34,57,.5);padding:14px;opacity:0;visibility:hidden;transition:opacity .25s,transform .25s;display:grid;grid-template-columns:1fr 1fr;gap:6px}
.nav-drop:hover .drop-panel{opacity:1;visibility:visible;transform:translateX(-50%) translateY(0)}
.drop-item{padding:16px;border-radius:var(--r-sm);display:block;transition:background .2s}
.drop-item:hover{background:var(--ink-50)}
.drop-item .di-t{font-family:"Space Grotesk";font-weight:600;color:var(--navy-900);font-size:15.5px;margin-bottom:5px;display:flex;align-items:center;gap:9px}
.drop-item .di-d{color:var(--ink-500);font-size:13.5px;line-height:1.5}
.drop-ico{width:9px;height:9px;border-radius:3px;background:var(--grad-brand);flex:none}
.drop-head{grid-column:1/-1;padding:10px 16px 4px;font-family:"Space Grotesk";font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-500)}
.nav-cta{padding:12px 22px;font-size:15px}
header.nav.scrolled{background:rgba(5,15,28,.82);backdrop-filter:blur(16px);box-shadow:0 1px 0 rgba(255,255,255,.06)}
.nav-toggle{display:none;background:none;border:0;color:#fff;cursor:pointer}

/* ============================ HERO ============================ */
.hero{padding-top:clamp(112px,15vh,200px);padding-bottom:clamp(80px,10vw,150px)}
.hero-grid{display:grid;grid-template-columns:1.12fr .88fr;gap:56px;align-items:center}
.hero-badge{display:inline-flex;align-items:center;gap:9px;padding:8px 16px 8px 10px;border-radius:100px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);font-size:13.5px;color:var(--white);margin-bottom:30px;font-weight:500}
.hero-badge b{background:var(--grad-brand);border-radius:100px;padding:3px 10px;font-family:"Space Grotesk";font-weight:600;font-size:12px}
h1.hero-t .hl{background:linear-gradient(100deg,#98dced,#787cfe);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.hero p.lead{max-width:50ch;margin-bottom:34px}
.hero-actions{display:flex;align-items:center;gap:20px;flex-wrap:wrap}
.hero-visual{position:relative;height:452px}
.hero .netviz{top:-40px;right:-30px;width:460px;height:400px}
.mock{position:absolute;inset:0;margin:auto;width:100%;max-width:430px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.14);border-radius:var(--r-lg);backdrop-filter:blur(8px);box-shadow:var(--shadow-soft);overflow:hidden;z-index:2}
.mock-bar{display:flex;align-items:center;gap:7px;padding:14px 16px;border-bottom:1px solid rgba(255,255,255,.09)}
.mock-bar i{width:9px;height:9px;border-radius:50%;background:rgba(255,255,255,.22)}
.mock-bar span{margin-left:8px;font-size:12px;color:rgba(255,255,255,.5);font-family:"Space Grotesk"}
.mock-body{padding:22px 20px 24px}
.mock-row{display:flex;align-items:center;justify-content:space-between;padding:9px 0;border-bottom:1px solid rgba(255,255,255,.06)}
.mock-row:last-child{border-bottom:0}
.mock-row .mr-l{font-size:13.5px;color:rgba(255,255,255,.72)}
.mr-bar{display:flex;align-items:center;gap:10px}
.mr-track{width:76px;height:6px;border-radius:100px;background:rgba(255,255,255,.12);overflow:hidden}
.mr-fill{height:100%;border-radius:100px;background:var(--grad-brand);width:0;transition:width 1s ease}
.in .mr-fill{width:var(--w)}
.mr-fill.low{background:linear-gradient(90deg,#e0a325,#e05252)}
.mock-row .mr-v{font-family:"Space Grotesk";font-weight:600;font-size:12.5px;width:96px;text-align:right}
.mock-tag{position:absolute;padding:11px 15px;background:#fff;border-radius:12px;box-shadow:var(--shadow-card);font-family:"Space Grotesk";font-weight:600;font-size:13px;color:var(--navy-900);display:flex;align-items:center;gap:9px;z-index:3}
.mock-tag .tk-dot{width:22px;height:22px;border-radius:50%;background:var(--grad-brand);display:grid;place-items:center;color:#fff;font-size:12px}
.tag-1{top:14px;left:-34px;animation:float1 5s ease-in-out infinite}
.tag-2{bottom:30px;right:-26px;animation:float1 6s ease-in-out infinite .8s}
@keyframes float1{0%,100%{transform:translateY(0)}50%{transform:translateY(-11px)}}

/* ============================ MANIFESTO (protagonista) ============================ */
.manifesto{position:relative;background:var(--navy-950);color:#fff;padding:clamp(60px,8vw,96px) 0;overflow:hidden}
.manifesto .shim{position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(90deg,transparent,#787CFE,#48BED9,transparent);background-size:50% 100%;animation:shim 4s linear infinite}
@keyframes shim{0%{background-position:-100% 0}100%{background-position:200% 0}}
.mf-in{max-width:var(--maxw);margin:0 auto;padding:0 var(--pad);position:relative;z-index:3}
.mf-top{display:flex;align-items:center;gap:26px;margin-bottom:38px}
.mf-iso{width:clamp(56px,7vw,84px);height:auto;filter:drop-shadow(0 8px 22px rgba(120,124,254,.5))}
.manifesto p.mf-line{font-family:"Space Grotesk";font-weight:600;font-size:clamp(1.5rem,1rem+2.4vw,3rem);line-height:1.08;letter-spacing:-.03em;max-width:20ch}
.manifesto .em{background:linear-gradient(100deg,#98dced,#787cfe);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.mf-marq{position:relative;z-index:3;border-top:1px solid rgba(255,255,255,.1);padding-top:26px;display:flex;align-items:center;gap:22px}
.mf-marq .lbl{flex:none;font-family:"Space Grotesk";font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:rgba(248,252,255,.45)}
.marq-vp{overflow:hidden;flex:1;-webkit-mask:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.marq{display:flex;gap:48px;width:max-content;animation:marquee 26s linear infinite}
.marq span{font-family:"Space Grotesk";font-weight:600;font-size:19px;color:rgba(248,252,255,.6);white-space:nowrap;letter-spacing:.01em}
.marq-vp:hover .marq{animation-play-state:paused}
@keyframes marquee{to{transform:translateX(-50%)}}

/* ============================ SEAM (transición suave) ============================ */
.seam{height:0;position:relative;z-index:5}
.seam::before{content:"";position:absolute;left:0;right:0;top:-1px;height:110px;transform:translateY(-100%);pointer-events:none}
.seam.to-dark::before{background:linear-gradient(180deg,transparent,rgba(5,15,28,.06))}

/* ============================ ENEMIGO ============================ */
.two-col{display:grid;grid-template-columns:.92fr 1.08fr;gap:clamp(36px,6vw,80px);align-items:start}
.pain-grid{display:grid;gap:14px}
.pain{display:flex;gap:18px;padding:24px 26px;border-radius:var(--r-md);background:var(--card-bg);border:1px solid var(--card-bd);transition:transform .25s,border-color .25s,box-shadow .25s}
.pain:hover{transform:translateY(-3px);border-color:var(--teal);box-shadow:var(--shadow-card)}
.pain-ico{flex:none;width:46px;height:46px;border-radius:12px;background:var(--grad-brand-soft);display:grid;place-items:center;color:var(--teal-700)}
.pain h4{font-family:"Space Grotesk";font-size:18px;font-weight:600;margin-bottom:6px}
.pain p{font-size:14.5px;color:var(--fg-muted)}
.inertia-tag{display:inline-block;font-family:"Space Grotesk";font-weight:700;background:var(--grad-brand);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}

/* ============================ DIFERENCIA ============================ */
.vs-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:18px;margin-top:44px}
.vs-card{padding:32px 28px;border-radius:var(--r-md);border:1px solid var(--card-bd);background:var(--card-bg);position:relative}
.vs-card.them{opacity:.92}
.vs-card .vs-k{font-family:"Space Grotesk";font-size:12.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--fg-muted);margin-bottom:14px}
.vs-card h4{font-size:20px;margin-bottom:12px}
.vs-card p{font-size:14.5px;color:var(--fg-muted)}
.vs-card.us{background:var(--grad-brand);color:#fff;border:0;box-shadow:0 24px 50px -22px rgba(120,124,254,.7);overflow:hidden;transform:translateY(-8px)}
.vs-card.us .vs-k,.vs-card.us p{color:rgba(255,255,255,.92)}
.vs-card.us h4{color:#fff}
.vs-card.us .isetip{position:absolute;right:-30px;bottom:-30px;width:150px;opacity:.16}
.iso-bg{position:absolute;top:50%;transform:translateY(-50%);width:clamp(300px,36vw,540px);z-index:0;pointer-events:none;opacity:.055}
.iso-bg.right{right:-100px}.iso-bg.left{left:-100px}
.closer .iso-bg{opacity:.07}
@media (max-width:960px){.iso-bg{opacity:.04;width:60vw}}
.line-note{margin-top:36px;font-size:clamp(1.15rem,1rem+.7vw,1.7rem);font-family:"Space Grotesk";font-weight:500;max-width:40ch;letter-spacing:-.02em}
.line-note b{background:linear-gradient(100deg,var(--violet),var(--teal));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;font-weight:700}

/* ============================ MÉTODO ============================ */
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:52px}
.step{position:relative;padding:38px 30px 34px;border-radius:var(--r-md);background:var(--card-bg);border:1px solid var(--card-bd);overflow:hidden;transition:transform .3s,box-shadow .3s}
.step:hover{transform:translateY(-6px);box-shadow:var(--shadow-card)}
.step .num{font-family:"Space Grotesk";font-weight:700;font-size:60px;line-height:1;background:var(--grad-brand);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;margin-bottom:16px}
.step h3{margin-bottom:10px;font-size:22px}
.step p{font-size:14.5px;color:var(--fg-muted)}
.step .tick{position:absolute;top:36px;right:30px;font-size:12px;font-family:"Space Grotesk";color:var(--teal-700);border:1px solid var(--card-bd);padding:4px 11px;border-radius:100px}


/* ============================ RESULTADOS (carrusel) ============================ */
.res-head{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;flex-wrap:wrap}
.res-ctrls{display:flex;gap:10px}
.res-arw{width:48px;height:48px;border-radius:50%;border:1.5px solid var(--card-bd);background:var(--card-bg);color:var(--navy-900);display:grid;place-items:center;cursor:pointer;transition:all .2s}
.res-arw:hover{border-color:var(--teal);color:var(--teal-700);transform:translateY(-2px)}
.res-arw:disabled{opacity:.35;cursor:default;transform:none;border-color:var(--card-bd);color:var(--navy-900)}
.cases-vp{margin-top:44px;overflow:visible}
.cases{display:flex;gap:22px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;padding:6px 0 24px;scrollbar-width:none}
.cases::-webkit-scrollbar{display:none}
.case{flex:0 0 min(452px,84vw);scroll-snap-align:start;background:#fff;border:1px solid var(--ink-100);border-radius:var(--r-lg);overflow:hidden;display:flex;flex-direction:column;transition:transform .3s,box-shadow .3s}
.case:hover{transform:translateY(-5px);box-shadow:var(--shadow-card)}
.case-hd{padding:28px 30px 0;display:flex;align-items:flex-start;justify-content:space-between;gap:14px}
.case-hd h3{font-size:27px}
.case-hd .sector{font-family:"Space Grotesk";font-size:12.5px;color:var(--ink-500);margin-top:6px;letter-spacing:.02em}
.outcome{flex:none;font-family:"Space Grotesk";font-weight:600;font-size:12px;padding:7px 13px;border-radius:100px;background:rgba(72,190,217,.12);color:var(--teal-700);text-align:right;max-width:130px;line-height:1.3}
.svc{margin:18px 30px 0;display:inline-flex;align-items:center;gap:8px;font-family:"Space Grotesk";font-size:12.5px;font-weight:500;color:var(--violet-700);width:max-content}
.svc .svc-d{width:7px;height:7px;border-radius:2px;background:var(--grad-brand)}
.case-flow{margin:20px 30px 0;display:grid;gap:0;border-radius:var(--r-md);overflow:hidden;border:1px solid var(--ink-100)}
.flow-row{padding:16px 18px;display:flex;gap:14px;align-items:flex-start}
.flow-row.before{background:var(--ink-50)}
.flow-row.after{background:linear-gradient(115deg,rgba(120,124,254,.08),rgba(72,190,217,.08))}
.flow-k{font-family:"Space Grotesk";font-weight:700;font-size:11px;letter-spacing:.08em;text-transform:uppercase;flex:none;width:52px;padding-top:2px}
.flow-row.before .flow-k{color:var(--ink-500)}
.flow-row.after .flow-k{color:var(--teal-700)}
.flow-row p{font-size:14px;line-height:1.5}
.flow-row.before p{color:var(--fg-muted)}
.flow-div{height:1px;background:var(--ink-100);position:relative}
.flow-div::after{content:"↓";position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:26px;height:26px;background:var(--grad-brand);color:#fff;border-radius:50%;display:grid;place-items:center;font-size:13px;font-family:"Space Grotesk"}
.case-quote{margin:20px 30px 0;padding-left:16px;border-left:2px solid;border-image:var(--grad-brand) 1;font-size:13.5px;line-height:1.55;color:var(--fg-muted);font-style:italic}
.case-foot{margin-top:auto;padding:22px 30px;display:flex;align-items:center;justify-content:space-between}
.case-foot .lnk{font-family:"Space Grotesk";font-weight:600;font-size:14px;color:var(--teal-700);display:inline-flex;align-items:center;gap:8px;transition:gap .2s}
.case-foot .lnk:hover{gap:13px}
.case.invite{background:var(--grad-navy);color:#fff;border:0;justify-content:center;align-items:flex-start;padding:44px 38px;overflow:hidden;position:relative}
.case.invite .isetip{position:absolute;right:-40px;bottom:-40px;width:200px;opacity:.12}
.case.invite h3{font-size:30px;margin-bottom:14px;max-width:14ch;position:relative;z-index:2}
.case.invite p{color:rgba(248,252,255,.72);margin-bottom:26px;font-size:15px;position:relative;z-index:2;max-width:26ch}
.case.invite .btn{position:relative;z-index:2}

/* ============================ RECONOCÉS ============================ */
.mirror-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:52px}
.mirror{padding:34px 30px;border-radius:var(--r-md);background:var(--card-bg);border:1px solid var(--card-bd);transition:transform .3s,border-color .3s}
.mirror:hover{transform:translateY(-6px);border-color:var(--violet)}
.mirror .quote{font-family:"Space Grotesk";font-weight:500;font-size:18px;line-height:1.4;margin-bottom:22px}
.mirror .arrow-to{display:flex;align-items:center;gap:10px;font-size:12.5px;color:var(--fg-muted);margin-bottom:10px;font-family:"Space Grotesk";letter-spacing:.02em}
.mirror .arrow-to .a{width:24px;height:1.5px;background:var(--teal)}
.mirror .pack{font-family:"Space Grotesk";font-weight:700;font-size:20px;background:var(--grad-brand);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;margin-bottom:10px}
.mirror .pd{font-size:14px;color:var(--fg-muted)}

/* ============================ CIERRE ============================ */
.closer{background:linear-gradient(125deg,#3d40a3 0%,#5054cf 34%,#1d94ac 100%);color:#fff;text-align:center;position:relative;overflow:hidden;--eyebrow:var(--teal-300);--fg-muted:rgba(255,255,255,.85)}
.closer .wrap{display:flex;flex-direction:column;align-items:center}
.closer h2{font-size:clamp(2rem,1.3rem+2.6vw,3.4rem);max-width:20ch;margin-bottom:22px}
.closer p{color:rgba(248,252,255,.82);max-width:52ch;margin-bottom:36px;font-size:1.15rem}
.closer .btn-primary{background:#fff;color:var(--navy-900);box-shadow:0 14px 34px -12px rgba(0,0,0,.45)}
.closer p{color:rgba(255,255,255,.86)}
.closer .flow-vec{position:absolute;left:50%;transform:translateX(-50%) rotate(180deg);bottom:-46px;width:min(440px,78%);opacity:.17;pointer-events:none;z-index:1}
.mirror-cta{margin-top:46px;display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap;padding:24px 34px;border-radius:var(--r-md);background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.12)}
.mirror-cta .mc-line{font-family:"Space Grotesk";font-weight:500;font-size:clamp(1.1rem,.9rem+.7vw,1.5rem);letter-spacing:-.01em}
.method-flow{position:absolute;left:-46px;top:50%;transform:translateY(-50%) rotate(180deg);width:clamp(340px,34vw,470px);opacity:.1;pointer-events:none;z-index:0}
.foot-flow{position:absolute;right:-46px;bottom:-40px;width:300px;opacity:.08;pointer-events:none;z-index:0;transform:rotate(180deg)}
.foot-grid,.foot-bottom{position:relative;z-index:2}
.foot-social{display:flex;gap:11px;margin-top:22px}
.foot-social a{width:38px;height:38px;border-radius:10px;border:1px solid rgba(255,255,255,.14);display:grid;place-items:center;color:rgba(248,252,255,.75);transition:all .2s}
.foot-social a:hover{background:var(--grad-brand);color:#fff;border-color:transparent;transform:translateY(-2px)}
@media (max-width:640px){.mirror-cta{flex-direction:column;align-items:flex-start}}

/* ============================ FOOTER ============================ */
footer.gw-footer{background:var(--navy-950);color:#fff;padding:80px 0 34px;position:relative;overflow:hidden}
footer.gw-footer::before{content:"";position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,rgba(120,124,254,.5),rgba(72,190,217,.5),transparent)}
.foot-grid{display:grid;grid-template-columns:1.7fr 1fr 1fr 1fr;gap:40px;margin-bottom:52px}
.foot-brand img{height:30px;margin-bottom:20px}
.foot-brand p{color:rgba(248,252,255,.6);font-size:14.5px;max-width:34ch;margin-bottom:26px}
.foot-partners-l{font-family:"Space Grotesk";font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:rgba(248,252,255,.45);margin-bottom:14px}
.foot-partners{display:flex;gap:12px;flex-wrap:wrap}
.partner-slot{width:104px;height:44px;border:1px solid rgba(255,255,255,.14);border-radius:10px;overflow:hidden;background:rgba(255,255,255,.03)}
.foot-col h5{font-family:"Space Grotesk";font-size:13px;letter-spacing:.12em;text-transform:uppercase;color:var(--teal);margin-bottom:18px}
.foot-col a{display:block;color:rgba(248,252,255,.72);font-size:14.5px;margin-bottom:12px;transition:color .2s}
.foot-col a:hover{color:#fff}
.foot-bottom{border-top:1px solid rgba(255,255,255,.1);padding-top:26px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:14px;font-size:13.5px;color:rgba(248,252,255,.5)}
.foot-bottom a{color:rgba(248,252,255,.5)}

/* ============================ REVEAL ============================ */
.rv{opacity:0;transform:translateY(26px);transition:opacity .7s cubic-bezier(.2,.7,.2,1),transform .7s cubic-bezier(.2,.7,.2,1)}
.rv.in{opacity:1;transform:none}
.rv-d1{transition-delay:.08s}.rv-d2{transition-delay:.16s}.rv-d3{transition-delay:.24s}
@media (prefers-reduced-motion:reduce){.rv{opacity:1;transform:none}.tag-1,.tag-2,.shim,.marq{animation:none}}

/* ============================ RESPONSIVE ============================ */
@media (max-width:960px){
  .hero-grid{grid-template-columns:1fr;gap:40px}.hero-visual{height:340px}
  .two-col{grid-template-columns:1fr;gap:36px}
  .vs-grid,.steps,.mirror-grid{grid-template-columns:1fr}
  .vs-card.us{transform:none}
  .nav-links{display:none}.nav-toggle{display:block}
  .foot-grid{grid-template-columns:1fr 1fr;gap:32px}
  .mf-top{flex-direction:column;align-items:flex-start;gap:18px}
  .mf-marq{flex-direction:column;align-items:flex-start;gap:14px}
}
@media (max-width:560px){.foot-grid{grid-template-columns:1fr}.res-head .btn{display:none}}


/* ==================== QUÉ CONSTRUIMOS ==================== */
.frente-head{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,5vw,72px);align-items:start;margin-bottom:clamp(12px,2.4vw,26px)}
.frente-head .frente-t{margin-top:0!important}
.frente-num{font-family:"Space Grotesk";font-weight:700;font-size:13px;letter-spacing:.16em;text-transform:uppercase;background:var(--grad-brand);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.frente-t{font-weight:700;font-size:clamp(2.4rem,1.5rem+2.9vw,3.9rem);line-height:1.04;letter-spacing:-.03em;max-width:14ch}
.frente-head .lead{max-width:42ch;margin-top:0!important;padding-top:10px}
.frente-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,5vw,72px);margin-top:clamp(46px,5vw,74px);align-items:start}
.fcol-h{font-family:"Space Grotesk";font-weight:700;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--eyebrow);display:flex;align-items:center;gap:11px;padding-bottom:16px;margin-bottom:24px;border-bottom:1px solid var(--card-bd)}
.fcol-h .d{width:8px;height:8px;border-radius:2px;background:var(--grad-brand);flex:none}
.suena-list{list-style:none;display:grid;gap:16px}
.suena-list li{display:flex;gap:13px;font-size:15.5px;color:var(--fg-muted);line-height:1.55}
.suena-list li svg{flex:none;margin-top:2px;color:var(--teal-700)}
.tone-navy .suena-list li svg{color:var(--teal)}
.chips{display:flex;flex-wrap:wrap;gap:10px}
.chip-svc{font-family:"Space Grotesk";font-weight:500;font-size:13.5px;padding:10px 16px;border-radius:100px;border:1px solid var(--card-bd);background:transparent;color:inherit;transition:all .2s;display:inline-flex;align-items:center;gap:8px}
.chip-svc.link{background:var(--grad-brand);color:#fff;border-color:transparent;box-shadow:0 8px 22px -12px rgba(120,124,254,.6)}
.chip-svc.link:hover{transform:translateY(-2px)}
.chip-svc .lk{font-size:11px;opacity:.85}
.diff2{margin-top:30px;padding-top:24px;border-top:1px solid var(--card-bd);display:grid;grid-template-columns:auto 1fr;gap:20px;align-items:start}
.diff2 .dk{font-family:"Space Grotesk";font-weight:700;font-size:12px;letter-spacing:.12em;text-transform:uppercase;background:var(--grad-brand);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;white-space:nowrap;padding-top:5px}
.diff2 p{font-family:"Space Grotesk";font-weight:500;font-size:clamp(1.05rem,.95rem+.45vw,1.35rem);line-height:1.42;letter-spacing:-.01em;color:inherit}
@media (max-width:820px){.frente-head{grid-template-columns:1fr;gap:16px;align-items:start}.frente-head .lead{padding-bottom:0}.frente-grid{grid-template-columns:1fr;gap:30px}.diff2{grid-template-columns:1fr;gap:10px}}

/* ==================== POR QUÉ GROWISTS ==================== */
/* HERO — pregunta escenificada + palabra rotativa */
.whyhero-flow{position:absolute;right:-30px;bottom:-70px;width:min(660px,60%);pointer-events:none;z-index:1;transform:scaleX(-1);overflow:visible}
.wf-base{fill:#fff;fill-opacity:.12}
.wf-glow{fill:none;stroke:#cdeef8;stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round;opacity:.32;filter:drop-shadow(0 0 3px rgba(152,220,237,.5));stroke-dasharray:.07 .93;stroke-dashoffset:1;animation:wftravel 12s linear infinite}
@keyframes wftravel{to{stroke-dashoffset:0}}
@media (prefers-reduced-motion:reduce){.wf-glow{animation:none;opacity:0}}
.ask{max-width:64ch;position:relative;z-index:3}
.ask-kicker{font-family:"Space Grotesk";font-weight:600;font-size:clamp(.98rem,.85rem+.45vw,1.2rem);color:var(--teal);line-height:1.4;margin-bottom:24px;max-width:46ch}
.ask-q{font-family:"Space Grotesk";font-weight:700;letter-spacing:-.03em;line-height:1.06;font-size:clamp(2.1rem,1.2rem+3.3vw,4.2rem);margin-bottom:30px}
.ask-q span.ln{display:block}
.ask-q .swap{display:inline-block;background:linear-gradient(100deg,#98dced,#787cfe);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;transition:opacity .38s ease,transform .38s ease}
.ask-q .swap.out{opacity:0;transform:translateY(-10px)}
.ask-ans{font-size:clamp(1.05rem,.98rem+.4vw,1.3rem);color:var(--fg-muted);max-width:54ch;margin-bottom:36px}
.stg,.ask-q span.ln{opacity:0;transform:translateY(20px);animation:phraseIn .85s cubic-bezier(.2,.7,.2,1) forwards}
.ask-kicker.stg{animation-delay:.12s}
.ask-q span.ln:nth-of-type(1){animation-delay:.5s}.ask-q span.ln:nth-of-type(2){animation-delay:.8s}
.ask-ans.stg{animation-delay:1.15s}.ask-cta.stg{animation-delay:1.35s}
@keyframes phraseIn{to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.stg,.ask-q span.ln{animation:none;opacity:1;transform:none}.ask-q .swap{transition:none}}
/* COMPARACIÓN — 3 paneles con patrón de lectura y remate “después” */
.cmp-top{max-width:34ch;margin-bottom:clamp(34px,4vw,52px)}
.cmp-top .sec-t{margin-top:16px}
.cmp-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;align-items:stretch}
.ccard{display:flex;flex-direction:column;padding:30px 28px;border:1px solid var(--card-bd);border-radius:var(--r-md);background:var(--card-bg);transition:transform .3s,box-shadow .3s}
.ccard.them:hover{transform:translateY(-5px);box-shadow:var(--shadow-card)}
.cc-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:22px}
.cc-tag{font-family:"Space Grotesk";font-weight:600;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--fg-muted)}
.cc-ico{width:42px;height:42px;border-radius:12px;display:grid;place-items:center;background:var(--ink-50);color:var(--teal-700)}
.ccard h4{font-size:clamp(1.2rem,1rem+.5vw,1.5rem);margin-bottom:12px}
.ccard>p{font-size:14.5px;line-height:1.6;color:var(--fg-muted);margin-bottom:26px}
.cc-after{margin-top:auto;padding-top:18px;border-top:1px dashed var(--card-bd);display:flex;align-items:center;justify-content:space-between}
.cc-after-k{font-family:"Space Grotesk";font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--fg-muted)}
.cc-after-v{font-family:"Space Grotesk";font-weight:700;font-size:19px;color:var(--ink-500);display:inline-flex;align-items:center;gap:8px}
.ccard.us{background:var(--grad-brand);color:#fff;border:0;box-shadow:0 26px 54px -22px rgba(120,124,254,.7);transform:translateY(-12px)}
.ccard.us .cc-tag,.ccard.us>p{color:rgba(255,255,255,.92)}
.ccard.us h4{color:#fff}
.ccard.us .cc-ico{background:rgba(255,255,255,.18);color:#fff}
.ccard.us .cc-after{border-top-color:rgba(255,255,255,.22)}
.ccard.us .cc-after-k{color:rgba(255,255,255,.72)}
.ccard.us .cc-after-v{color:#fff}
.cmp-honest2{margin-top:clamp(34px,4vw,48px);padding-top:32px;border-top:1px solid var(--card-bd);display:grid;grid-template-columns:auto 1fr;gap:clamp(20px,3vw,40px);align-items:start}
.ch-label{font-family:"Space Grotesk";font-weight:700;font-size:12px;letter-spacing:.13em;text-transform:uppercase;background:var(--grad-brand);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;padding-top:9px;white-space:nowrap}
.cmp-honest2 p{font-family:"Space Grotesk";font-weight:500;font-size:clamp(1.15rem,1rem+.75vw,1.65rem);line-height:1.38;letter-spacing:-.01em;color:var(--fg);max-width:42ch}
.cmp-honest2 p b{font-weight:700;background:var(--grad-brand);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
@media(max-width:700px){.cmp-honest2{grid-template-columns:1fr;gap:12px}}
@media(max-width:900px){.cmp-cards{grid-template-columns:1fr}.ccard.us{transform:none}}
/* HISTORIA — línea de tiempo narrativa (motivo nodo/camino) */
.hist-intro{max-width:24ch;margin-bottom:clamp(40px,5vw,60px)}
.hist-intro .hist-lead{font-family:"Space Grotesk";font-weight:700;font-size:clamp(1.7rem,1.1rem+2.2vw,2.9rem);line-height:1.12;letter-spacing:-.025em;color:#fff;margin-top:16px}
.hist-iso{position:absolute;right:-70px;top:50%;transform:translateY(-50%);width:min(440px,40%);opacity:.05;pointer-events:none;z-index:0}
.timeline{position:relative}
.tl-line{position:absolute;left:20px;top:10px;bottom:44px;width:2px;background:rgba(255,255,255,.13)}
.tl-fill{position:absolute;inset:0 0 auto 0;height:0;width:100%;background:var(--grad-brand);transition:height 1.5s ease}
.timeline.lit .tl-fill{height:100%}
.tl-step{position:relative;display:grid;grid-template-columns:42px 1fr;gap:clamp(20px,3vw,46px);padding-bottom:clamp(36px,5vw,64px)}
.tl-step:last-child{padding-bottom:0}
.tl-node{width:42px;height:42px;border-radius:50%;background:var(--navy-950);border:2px solid rgba(255,255,255,.22);display:grid;place-items:center;position:relative;z-index:2}
.tl-num{font-family:"Space Grotesk";font-weight:700;font-size:14px;background:var(--grad-brand);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.tl-node.hot{background:var(--grad-brand);border-color:transparent;box-shadow:0 0 0 7px rgba(120,124,254,.16);animation:pulse 3s ease-in-out infinite}
.tl-card{padding-top:4px;max-width:60ch}
.tl-card h4{font-size:clamp(1.3rem,1rem+1vw,1.85rem);color:#fff;margin-bottom:12px}
.tl-card p{font-size:clamp(1rem,.95rem+.35vw,1.15rem);line-height:1.75;color:rgba(248,252,255,.72)}
.tl-card.big{padding:6px 0 2px}
.tl-card.big .tl-humo{font-family:"Space Grotesk";font-weight:600;font-size:clamp(1.6rem,1.1rem+2vw,2.6rem);line-height:1.2;color:#fff;margin-bottom:12px}
.humo{font-weight:700;background:var(--grad-brand);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
@media(max-width:600px){.tl-step{grid-template-columns:36px 1fr;gap:18px}.tl-line{left:17px}.tl-node{width:36px;height:36px}}
/* PRINCIPIOS — tiles visuales animados */
.prin-head{display:grid;grid-template-columns:1fr 1fr;gap:clamp(26px,5vw,64px);align-items:end;margin-bottom:14px}
.prin-head .sec-t{max-width:16ch;margin-top:14px}
.prin-intro{font-size:15.5px;line-height:1.7;color:var(--fg-muted);max-width:48ch}
.prin-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:clamp(30px,4vw,48px)}
.prin-cards .pcard{border:1px solid var(--card-bd);border-radius:var(--r-lg);background:var(--card-bg);overflow:hidden;transition:transform .35s,box-shadow .35s}
.prin-cards .pcard:hover{transform:translateY(-8px);box-shadow:var(--shadow-card)}
.pviz{height:172px;position:relative;display:grid;place-items:center;background:radial-gradient(130% 120% at 50% 0%,rgba(120,124,254,.13),transparent 68%);border-bottom:1px solid var(--card-bd);overflow:hidden}
.pc-body{padding:28px 30px 32px}
.prin-cards .pcard h3{font-size:clamp(1.4rem,1.1rem+.8vw,1.9rem);margin-bottom:10px}
.prin-cards .pcard .pc-body p{font-size:14.5px;line-height:1.65;color:var(--fg-muted)}
.dbars{display:flex;align-items:flex-end;gap:11px;height:100px}
.dbars i{width:17px;border-radius:6px 6px 0 0;background:var(--grad-brand);transform-origin:bottom;animation:dbar 2.4s ease-in-out infinite}
.dbars i:nth-child(1){height:64px;animation-delay:0s}.dbars i:nth-child(2){height:92px;animation-delay:.28s}.dbars i:nth-child(3){height:52px;animation-delay:.56s}.dbars i:nth-child(4){height:80px;animation-delay:.16s}
@keyframes dbar{0%,100%{transform:scaleY(.4)}50%{transform:scaleY(1)}}
.agil{display:flex;align-items:center;gap:2px}
.agil svg{width:42px;height:56px;animation:achev 1.4s ease-in-out infinite}
.agil svg:nth-child(2){animation-delay:.18s}.agil svg:nth-child(3){animation-delay:.36s}
@keyframes achev{0%,100%{opacity:.22;transform:translateX(-5px)}50%{opacity:1;transform:translateX(5px)}}
.tviz{width:120px;height:100px}
.tviz .iris{transform-origin:center;transform-box:fill-box;animation:blink 3.6s ease-in-out infinite}
.tviz .ring{transform-origin:center;transform-box:fill-box;animation:tring 3.6s ease-in-out infinite}
@keyframes blink{0%,44%,56%,100%{transform:scale(1)}50%{transform:scale(.12)}}
@keyframes tring{0%,100%{transform:scale(.85);opacity:.55}50%{transform:scale(1.2);opacity:0}}
@media(max-width:900px){.prin-head{grid-template-columns:1fr;gap:16px}.prin-cards{grid-template-columns:1fr}}
@media (prefers-reduced-motion:reduce){.dbars i,.agil svg,.tviz .iris,.tviz .ring,.tl-node.hot{animation:none}.dbars i{transform:scaleY(.8)}}

/* ==================== RESULTADOS ==================== */
.cd-meta{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:18px}
.cd-chip{font-family:"Space Grotesk";font-size:12px;font-weight:500;padding:6px 13px;border-radius:100px;background:rgba(72,190,217,.12);color:var(--teal-700)}
.tone-navy .cd-chip{color:var(--teal);background:rgba(72,190,217,.14)}
.case-wrap{margin-top:clamp(30px,3.5vw,48px)}
.metric-hero{background:var(--grad-brand);color:#fff;border-radius:var(--r-lg);padding:clamp(30px,4vw,46px);display:grid;grid-template-columns:minmax(0,auto) 1fr;gap:clamp(28px,5vw,60px);align-items:center;box-shadow:0 34px 70px -30px rgba(120,124,254,.65);position:relative;overflow:hidden}
.metric-hero .mh-iso{position:absolute;right:-40px;bottom:-54px;width:240px;opacity:.13;pointer-events:none}
.mh-num{position:relative;z-index:2}
.mh-top{font-family:"Space Grotesk";font-weight:600;font-size:13px;letter-spacing:.01em;color:rgba(255,255,255,.7);margin-bottom:18px}
.mh-big{font-family:"Space Grotesk";font-weight:700;font-size:clamp(3rem,2rem+4.4vw,5.4rem);line-height:.92;letter-spacing:-.03em}
.mh-lbl{font-family:"Space Grotesk";font-weight:500;font-size:13.5px;color:rgba(255,255,255,.85);margin-top:4px}
.mh-side{position:relative;z-index:2;border-left:1px solid rgba(255,255,255,.25);padding-left:clamp(24px,4vw,44px)}
.mh-k{font-family:"Space Grotesk";font-weight:700;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.75);margin-bottom:12px}
.mh-side p{font-size:15px;line-height:1.62;color:rgba(255,255,255,.95)}
.case-body{display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,5vw,68px);margin-top:clamp(30px,4vw,46px);align-items:start}
.cb-block{margin-bottom:24px}.cb-block:last-child{margin-bottom:0}
.cb-k{font-family:"Space Grotesk";font-weight:700;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--eyebrow);margin-bottom:9px}
.cb-block p{font-size:15px;line-height:1.62;color:var(--fg-muted)}
.cb-result{margin-bottom:24px}
.cb-result p{font-family:"Space Grotesk";font-weight:600;font-size:clamp(1.35rem,1rem+1.5vw,2.05rem);line-height:1.22;letter-spacing:-.02em;color:inherit}
.cb-quote{position:relative;padding:22px 24px 24px;border-radius:var(--r-md);background:var(--card-bg);border:1px solid var(--card-bd)}
.cb-quote .qm{font-family:"Space Grotesk";font-weight:700;font-size:44px;line-height:.5;background:var(--grad-brand);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;display:block;margin-bottom:4px}
.cb-quote p{font-style:italic;font-size:14.5px;line-height:1.6;color:var(--fg-muted)}
.cb-quote .who{display:block;font-style:normal;font-family:"Space Grotesk";font-weight:600;font-size:13px;color:inherit;margin-top:12px}
@media(max-width:900px){.metric-hero{grid-template-columns:1fr;gap:22px}.mh-side{border-left:0;border-top:1px solid rgba(255,255,255,.25);padding-left:0;padding-top:22px}.case-body{grid-template-columns:1fr;gap:26px}}
.slider-head{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;flex-wrap:wrap}
.sld{display:flex;gap:20px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;padding:8px 0 22px;margin-top:36px;scrollbar-width:none}
.sld::-webkit-scrollbar{display:none}
.scase{flex:0 0 min(420px,82vw);scroll-snap-align:start;border:1px solid var(--card-bd);border-radius:var(--r-lg);background:var(--card-bg);padding:30px 30px 34px;display:flex;flex-direction:column}
.scase h4{font-family:"Space Grotesk";font-size:22px;margin-bottom:4px}
.scase .srub{font-family:"Space Grotesk";font-size:12px;letter-spacing:.02em;color:var(--teal-700);margin-bottom:22px}
.sstep{padding:18px 0;border-top:1px solid var(--card-bd)}
.scase .sstep:first-of-type{border-top:0;padding-top:0}
.sstep.res{position:relative;padding-left:20px;border-top:0}
.sstep.res::before{content:"";position:absolute;left:0;top:4px;bottom:2px;width:3px;border-radius:3px;background:var(--grad-brand)}
.sk{font-family:"Space Grotesk";font-weight:700;font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;background:var(--grad-brand);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;margin-bottom:7px}
.sstep p{font-size:14px;line-height:1.55;color:var(--fg-muted)}
.scase.invite{background:var(--grad-navy);color:#fff;border:0;justify-content:center;position:relative;overflow:hidden}
.scase.invite .mh-iso{position:absolute;right:-36px;bottom:-46px;width:190px;opacity:.14;pointer-events:none}
.scase.invite h4{color:#fff;font-size:26px;max-width:13ch;margin-bottom:12px;position:relative;z-index:2}
.scase.invite p{color:rgba(248,252,255,.74);font-size:14.5px;margin-bottom:24px;position:relative;z-index:2}
.scase.invite .btn{align-self:flex-start;position:relative;z-index:2}
.logos-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:16px;margin-top:44px}
.logo-slot{height:88px;border:1px solid var(--card-bd);border-radius:var(--r-md);overflow:hidden;background:var(--card-bg)}
@media (max-width:900px){.logos-grid{grid-template-columns:repeat(3,1fr)}}
@media (max-width:520px){.logos-grid{grid-template-columns:repeat(2,1fr)}}

/* ==================== PÁGINAS DE SERVICIO ==================== */
#quees .flow-vec{position:absolute;left:clamp(-10px,1vw,24px);bottom:4%;width:min(600px,44%);pointer-events:none;z-index:1}
#construimos,#explorar{position:relative}
#construimos .brand-flow{position:absolute;right:clamp(-70px,-4vw,-20px);top:38%;width:min(500px,36%);opacity:.05;pointer-events:none;z-index:0}
#construimos .brand-iso{position:absolute;left:clamp(-140px,-7vw,-60px);top:6%;width:min(500px,38%);opacity:.04;filter:grayscale(1);pointer-events:none;z-index:0}
#explorar .brand-flow{position:absolute;left:clamp(-40px,-1vw,-10px);top:clamp(-60px,-3vw,-30px);width:min(460px,34%);opacity:.05;pointer-events:none;z-index:0;transform:rotate(180deg)}
/* HERO — mock de pipeline (motivo propio de esta landing) */
.crm-mock{width:100%;max-width:460px;margin-left:auto;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.12);border-radius:var(--r-lg);padding:20px;backdrop-filter:blur(8px);box-shadow:var(--shadow-soft)}
.crm-mock .mock-hd{font-family:"Space Grotesk";font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:rgba(248,252,255,.55);margin-bottom:16px}
.pipe{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.pcol h5{font-family:"Space Grotesk";font-size:10.5px;letter-spacing:.06em;text-transform:uppercase;color:rgba(248,252,255,.6);margin-bottom:10px;display:flex;align-items:center;gap:7px}
.pcol h5 .d{width:7px;height:7px;border-radius:50%;flex:none}
.pipe .pcard{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);border-radius:10px;padding:10px 11px;margin-bottom:9px}
.pipe .pcard .nm{font-family:"Space Grotesk";font-weight:600;font-size:12px;color:#fff;margin-bottom:4px}
.pipe .pcard .mt{font-size:10.5px;color:rgba(248,252,255,.5)}
.pipe .pcard.win{background:var(--grad-brand);border-color:transparent}
.pipe .pcard.win .mt{color:rgba(255,255,255,.85)}
/* ¿TE SUENA? — señales como tarjetas */
.suena-wrap{position:relative}
.suena-iso{position:absolute;right:clamp(-80px,-4vw,-30px);top:0;width:min(540px,40vw);opacity:.045;pointer-events:none;filter:grayscale(1);z-index:0}
.suena-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(30px,5vw,70px);margin-top:clamp(28px,4vw,44px);align-items:start;position:relative;z-index:1}
.suena-head{position:sticky;top:104px}
.suena-sub{font-size:15.5px;line-height:1.62;color:var(--fg-muted);margin-top:16px;max-width:32ch}
.suena-cards{list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:14px}
.suena-cards .pain{padding:22px 22px 18px;border:1px solid var(--card-bd);border-radius:var(--r-md);background:var(--card-bg);display:flex;flex-direction:column;gap:14px;min-height:150px}
.suena-cards .pain .pn{font-family:"Space Grotesk";font-weight:700;font-size:13px;background:var(--grad-brand);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.suena-cards .pain p{font-family:"Space Grotesk";font-weight:500;font-size:15.5px;line-height:1.4;letter-spacing:-.01em;color:inherit}
.suena-cards .pain .cost{display:inline-flex;align-items:center;gap:7px;font-family:"Space Grotesk";font-weight:600;font-size:10.5px;letter-spacing:.05em;text-transform:uppercase;color:#C0772F;margin-top:auto}
.suena-cards .pain .cost .cd{width:6px;height:6px;border-radius:50%;background:#E0913F;flex:none}
/* QUÉ ES — flujo conectado */
.quees-head{display:grid;grid-template-columns:.92fr 1.08fr;gap:clamp(28px,5vw,72px);align-items:center;margin-top:clamp(22px,3vw,34px)}
.quees-def{font-size:clamp(1.9rem,1.3rem+2.2vw,3.1rem);line-height:1.16;font-family:"Space Grotesk";font-weight:600;letter-spacing:-.025em;color:#fff;max-width:13ch;margin:0}
.quees-def b{background:var(--grad-brand);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;font-weight:700}
.quees-body{display:flex;flex-direction:column;gap:16px;padding-top:6px}
.quees-body p{font-size:clamp(.98rem,.9rem+.28vw,1.12rem);line-height:1.68;color:rgba(248,252,255,.82);margin:0}
.quees-body p b{color:#fff;font-weight:600}
@media(max-width:760px){.quees-head{grid-template-columns:1fr;gap:20px}.quees-def{max-width:20ch}}
.flowrow{display:grid;grid-template-columns:repeat(3,1fr);margin-top:clamp(40px,5vw,64px);position:relative}
.flowrow:before{content:"";position:absolute;left:6%;right:6%;top:11px;height:1px;background:linear-gradient(90deg,transparent,rgba(255,255,255,.28),transparent)}
.fstep{padding-right:clamp(16px,3vw,40px);position:relative}
.fstep .fnode{width:22px;height:22px;border-radius:50%;background:var(--grad-brand);margin-bottom:22px;box-shadow:0 0 0 5px rgba(120,124,254,.12)}
.fstep .fk{font-family:"Space Grotesk";font-weight:700;font-size:16px;color:#fff;margin-bottom:9px}
.fstep p{font-size:14px;line-height:1.6;color:rgba(248,252,255,.7);max-width:28ch}
/* PARTNERS — 3 tarjetas */
.partners{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:clamp(30px,4vw,44px)}
.pt{padding:28px 26px;border:1px solid var(--card-bd);border-radius:var(--r-md);background:var(--card-bg);display:flex;flex-direction:column}
.pt .pbadge{width:54px;height:54px;border-radius:14px;overflow:hidden;border:1px solid var(--card-bd);margin-bottom:18px;background:#fff}
.pt .pbadge.grad{background:var(--grad-brand);display:grid;place-items:center;color:#fff;border:0}
.pt .ptag{font-family:"Space Grotesk";font-weight:700;font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--teal-700);margin-bottom:8px}
.pt h3{font-size:19px;margin-bottom:8px}
.pt p{font-size:14px;color:var(--fg-muted);line-height:1.55}
/* FAQ */
.faq-list{max-width:82ch;margin-top:36px;border-top:1px solid var(--card-bd)}
.faq-item{border-bottom:1px solid var(--card-bd)}
.faq-q{width:100%;text-align:left;background:none;border:0;cursor:pointer;font-family:"Space Grotesk";font-weight:600;font-size:17px;color:inherit;padding:22px 0;display:flex;justify-content:space-between;gap:16px;align-items:center}
.faq-q .qi{flex:none;color:var(--teal-700);transition:transform .3s;font-size:24px;line-height:1}
.faq-item.open .qi{transform:rotate(45deg)}
.faq-a{max-height:0;overflow:hidden;transition:max-height .35s ease;color:var(--fg-muted);font-size:15px;line-height:1.65}
.faq-item.open .faq-a{max-height:260px;padding-bottom:22px}
/* SEGUÍ EXPLORANDO — tarjetas */
.expl{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:clamp(30px,4vw,40px)}
.expl a{padding:24px 26px;border:1px solid var(--card-bd);border-radius:var(--r-md);background:var(--card-bg);transition:transform .25s,border-color .25s,box-shadow .25s;display:flex;flex-direction:column;gap:7px}
.expl a:hover{transform:translateY(-5px);border-color:var(--teal);box-shadow:var(--shadow-card)}
.expl .en{font-family:"Space Grotesk";font-weight:600;font-size:17px;display:flex;justify-content:space-between;align-items:center;gap:12px}
.expl .en .arw{color:var(--teal-700)}
.expl .ed{font-size:13.5px;color:var(--fg-muted);line-height:1.5}
@media(max-width:900px){.hero-grid .crm-mock{max-width:none}.suena-grid{grid-template-columns:1fr;gap:26px}.suena-head{position:static}.suena-cards{grid-template-columns:1fr}.flowrow{grid-template-columns:1fr;gap:26px}.flowrow:before{display:none}.fstep{padding-right:0}.fstep .fnode{margin-bottom:14px}.partners{grid-template-columns:1fr}.expl{grid-template-columns:1fr}}

/* ============================ MOBILE NAV (tema) ============================ */
.nav-mobile{display:none;background:rgba(5,15,28,.97);backdrop-filter:blur(16px);padding:18px var(--pad) 26px;flex-direction:column;gap:18px}
.nav-mobile a{font-family:"Space Grotesk";font-weight:500;font-size:17px;color:#fff}
.nav-mobile .btn{justify-content:center}
@media (max-width:960px){.nav-mobile.open{display:flex}}
/* ============================ AJUSTES ELEMENTOR ============================ */
.elementor-section.gw-flush>.elementor-container{max-width:100%}
[class*="elementor-widget-gw_"]>.elementor-widget-container{width:100%}
/* Admin bar: la nav fija queda debajo de la barra de WP */
body.admin-bar header.nav{top:32px}
@media (max-width:782px){body.admin-bar header.nav{top:46px}}
/* Enlaces por defecto */
a{color:inherit}
a:hover{opacity:.9}


/* ============================================================
   FIXES v1.1 — íconos de Elementor, aplicaciones de marca,
   control de animaciones y variables globales del tema.
   ============================================================ */

/* Íconos elegidos desde la biblioteca de Elementor dentro de un tile */
.pain-ico svg{width:22px;height:22px;display:block}
.pain-ico i{font-size:20px;line-height:1;display:block}
.pain-ico svg path:not([fill]),.pain-ico svg circle:not([fill]){fill:currentColor}
.pt .pbadge i{font-size:24px;line-height:1}

/* Vector "flow": posición por defecto y variantes por sección */
.section > .flow-vec{position:absolute;left:50%;transform:translateX(-50%) rotate(180deg);bottom:-46px;width:min(440px,78%);opacity:.14;pointer-events:none;z-index:1}
.section.closer > .flow-vec{left:50%;transform:translateX(-50%) rotate(180deg);bottom:-46px;width:min(440px,78%);opacity:.17;z-index:1}
.section.gw-quees > .flow-vec{left:clamp(-10px,1vw,24px);right:auto;bottom:4%;transform:none;width:min(600px,44%);opacity:.06;z-index:0}
.section.gw-quees .wrap{position:relative;z-index:3}

/* Par de marca: una aplicación a cada extremo (como el diseño original) */
.gw-construimos .brand-iso{position:absolute;left:clamp(-140px,-7vw,-60px);top:6%;width:min(500px,38%);opacity:.04;filter:grayscale(1);pointer-events:none;z-index:0}
.gw-construimos .brand-flow{position:absolute;right:clamp(-70px,-4vw,-20px);top:38%;width:min(500px,36%);opacity:.05;pointer-events:none;z-index:0}
.gw-explorar .method-flow{left:clamp(-40px,-1vw,-10px);top:clamp(-60px,-3vw,-30px);transform:rotate(180deg);width:min(460px,34%);opacity:.05}

/* Animaciones controlables desde el widget */
.gw-no-anim .rv{opacity:1 !important;transform:none !important;transition:none !important}
.gw-no-anim .hero-visual,.gw-no-anim .stg{opacity:1 !important;transform:none !important;transition:none !important}
.gw-no-para [data-para]{transform:none !important}

/* Variables globales editables desde Apariencia → Personalizar → Growists */
:root{--gw-r-card:var(--r-md);--gw-shadow-k:1}
.pain,.step,.case,.mirror,.pt,.scase,.faq-item,.vs-card,.ccard,.tl-card,.expl > a,.logo-slot,.fcol{border-radius:var(--gw-r-card)}


/* ============ HEADER / FOOTER COMO WIDGETS (v1.2) ============ */
.gw-nav-static{position:static !important}
.gw-nav-noblur.scrolled{backdrop-filter:none !important;-webkit-backdrop-filter:none !important}
.partner-slot .partner-ph{display:grid;place-items:center;width:100%;height:100%;font-family:"Space Grotesk",system-ui,sans-serif;font-size:12px;color:rgba(255,255,255,.55);text-align:center;line-height:1.2;padding:4px}
a.partner-slot{display:block;transition:border-color .25s,transform .25s}
a.partner-slot:hover{transform:translateY(-2px)}
/* Iconos sociales: visibles siempre y con área de toque cómoda */
.foot-social{display:flex;gap:10px;flex-wrap:wrap;margin-top:18px}
.foot-social a{display:grid;place-items:center;width:38px;height:38px;border-radius:10px;border:1px solid rgba(255,255,255,.14);color:rgba(255,255,255,.72);transition:color .25s,border-color .25s,background .25s,transform .25s}
.foot-social a:hover{color:#fff;border-color:var(--teal);background:rgba(72,190,217,.12);transform:translateY(-2px)}
.foot-social a svg{display:block}
/* El footer widget dentro de un contenedor de Elementor ocupa todo el ancho */
.elementor-widget-gw_footer > .elementor-widget-container,.elementor-widget-gw_header > .elementor-widget-container{width:100%}


/* ============================================================
   v1.3 — CORRECCIONES RESPONSIVE MÓVIL
   ============================================================ */

/* ---- Resaltado de toque: quitamos el destello rojo/gris del navegador
        y lo sustituimos por un anillo de foco de marca ---- */
html{-webkit-tap-highlight-color:transparent}
a,button,.btn,.faq-q,.opt,.chip-svc,.res-arw,input,textarea,select,summary,[role="button"]{-webkit-tap-highlight-color:transparent}
a:focus-visible,button:focus-visible,.btn:focus-visible,.faq-q:focus-visible,.opt:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:2px solid var(--teal);outline-offset:3px;border-radius:6px}
/* Evita desbordes horizontales de toda la página */
html,body{overflow-x:hidden}
img,svg{max-width:100%}

/* ---- Botones: nunca se desbordan; en móvil, ancho completo ---- */
.btn{max-width:100%;white-space:normal;text-align:center;justify-content:center;min-height:48px}
.hero-actions{display:flex;flex-wrap:wrap;gap:14px}

@media (max-width:768px){
  /* HEADER — logo con proporción intacta y CTA solo en el menú móvil */
  .nav-in{gap:12px;padding:14px var(--pad)}
  header.nav .nav-logo{height:26px;width:auto;max-width:150px;object-fit:contain;flex:none}
  header.nav .nav-cta{display:none}
  .nav-toggle{display:block;flex:none;margin-left:auto;padding:6px;min-width:44px;min-height:44px}
  .nav-links{display:none}
  .nav-mobile.open{display:flex}
  .nav-mobile{padding:16px var(--pad) 24px}
  .nav-mobile a{padding:10px 0;min-height:44px;display:flex;align-items:center}
  .nav-mobile .btn{width:100%}

  /* HERO — deja aire bajo la barra fija (la nav mide ~62px) */
  .section.hero{padding-top:132px}
  body.admin-bar .section.hero{padding-top:178px}
  .section.quiz-hero{padding-top:132px;min-height:auto}

  /* BOTONES — ancho completo apilado (regla de UI móvil: acción principal
     alcanzable con el pulgar y área de toque ≥48px) */
  .hero-actions{flex-direction:column;align-items:stretch;width:100%}
  .hero-actions .btn,
  .closer .btn,
  .mirror-cta .btn,
  .case.invite .btn,
  .scase.invite .btn,
  .res-actions .btn,
  .ask-cta .btn,
  .gwf-actions .gwf-btn{width:100%}
  .scase.invite .btn{align-self:stretch}
  .mirror-cta{flex-direction:column;align-items:stretch;gap:18px}

  /* FAQ — la pregunta envuelve y el signo + no se aplasta */
  .faq-list{max-width:100%}
  .faq-q{gap:16px;align-items:flex-start;font-size:16px;padding:20px 0;min-height:48px}
  .faq-q span:first-child,.faq-q{min-width:0}
  .faq-q .qi{margin-top:-2px}
  .faq-a{padding-right:0}

  /* Chips y listas: sin desbordes */
  .chips{width:100%}
  .chip-svc{max-width:100%;white-space:normal;text-align:left}

  /* Tarjetas y carruseles al ancho de la pantalla */
  .case,.scase{min-width:min(86vw,340px)}
  .cases,.sld{padding-left:0;padding-right:0}
  .res-ctrls{display:none}

  /* Mocks y pipeline: scroll propio en lugar de comprimirse */
  .crm-mock{overflow-x:auto}
  .pipe{min-width:520px}
}

@media (max-width:560px){
  .section.hero{padding-top:124px}
  .btn{font-size:15px;padding:15px 22px}
  .foot-bottom{flex-direction:column;align-items:flex-start;gap:10px}
  .foot-social a{width:44px;height:44px}
  .cd-meta{gap:8px}
}

/* ---- APLICACIONES DE MARCA EN MÓVIL ----
   En móvil no se escalan en proporción (quedarían como manchas diminutas):
   se agrandan en relación al viewport y se anclan a un borde, para que
   lean como marca de agua intencional y no como un error de aplicación.
   Sin !important: los controles de estilo del widget siguen ganando. */
@media (max-width:768px){
  .section .iso-bg{width:min(78vw,420px);opacity:.05}
  .section .iso-bg.right{right:-24vw;left:auto}
  .section .iso-bg.left{left:-24vw;right:auto}

  .section .brand-iso{width:min(72vw,400px);left:-26vw;top:2%;opacity:.05}
  .section .brand-flow{width:min(70vw,380px);right:-22vw;top:auto;bottom:-4%;opacity:.06}

  .section .method-flow{width:min(76vw,400px);opacity:.06}
  .section.gw-quees > .flow-vec{width:min(76vw,400px);opacity:.06;left:-18vw;bottom:2%}
  .section > .flow-vec,.section.closer > .flow-vec{width:min(72vw,360px);bottom:-26px;opacity:.16}

  .suena-wrap .suena-iso{width:min(74vw,400px);opacity:.05}
  .manifesto .mf-iso{width:64px;height:auto}
  .gw-footer .foot-flow{width:min(80vw,420px);opacity:.1}
  .section .whyhero-flow{width:min(96vw,460px);right:-16vw;bottom:-40px}
  .manifesto .netviz.solo{display:none}

  /* Aurora: menos difusa para que no se vea como banda plana */
  .aurora span{filter:blur(60px)}
}

/* ---- HERO "POR QUÉ GROWISTS" — alto reservado ----
   La palabra rotativa cambia de longitud ("agencia" → "empresa de software").
   Reservamos el alto de dos líneas para que el resto de la página no salte. */
.ask-q{min-height:calc(1.06em * 4)}
.ask-q span.ln:last-of-type{min-height:calc(1.06em * 2);display:block}
@media (min-width:1100px){
  .ask-q{min-height:calc(1.06em * 3)}
  .ask-q span.ln:last-of-type{min-height:calc(1.06em * 1)}
}
@media (max-width:520px){
  .ask-q{min-height:calc(1.06em * 5);font-size:clamp(1.9rem,1.1rem+3vw,2.6rem)}
  .ask-q span.ln:last-of-type{min-height:calc(1.06em * 3)}
}

/* Botón: ancho completo controlable desde el widget */
.gw-btn-full > .btn{width:100%}
@media (max-width:768px){.gw-btn-full-m > .btn{width:100%}}


/* ============================================================
   v1.3.1 — DESBORDE HORIZONTAL: causa raíz
   .eyebrow era inline-flex (crece a max-content y su texto no
   envuelve), así que un eyebrow largo ensanchaba la sección
   completa y el resto del contenido se recortaba con ella.
   ============================================================ */

/* El eyebrow envuelve y nunca excede su contenedor */
.eyebrow{display:flex;flex-wrap:wrap;max-width:100%;row-gap:6px}
.eyebrow .eb-n{flex:none}

/* Los hijos de flex/grid pueden encogerse por debajo de su contenido */
.wrap,.hero-grid,.hero-grid > *,.two-col,.two-col > *,.frente-head,.frente-head > *,
.frente-grid,.frente-grid > *,.suena-grid,.suena-grid > *,.quees-head,.quees-head > *,
.prin-head,.prin-head > *,.case-body,.case-body > *,.metric-hero,.metric-hero > *,
.res-head,.res-head > *,.slider-head,.slider-head > *,.foot-grid,.foot-grid > *,
.diff2,.diff2 > *,.cmp-honest2,.cmp-honest2 > *,.faq-item,.faq-list{min-width:0}

/* Palabras largas y URLs no rompen el layout */
h1,h2,h3,h4,h5,p,li,a,button,.eyebrow,.faq-q,.chip-svc,.quees-def,.ask-q,.hero-t,.sec-t,.frente-t{overflow-wrap:break-word;word-break:normal}

/* FAQ: la pregunta envuelve, el signo + queda fijo a la derecha */
.faq-q{align-items:flex-start;gap:18px;text-align:left}
.faq-q > .qi{flex:0 0 auto;margin-left:auto}
.faq-list{max-width:min(82ch,100%)}

@media (max-width:768px){
  /* Eyebrow: menos tracking para que quepa más texto por línea */
  .eyebrow{font-size:11.5px;letter-spacing:.1em;gap:9px;margin-bottom:18px}
  .eyebrow .eb-n::after{width:14px;margin-left:9px}

  /* Cabecera sticky del bloque "¿Te suena?": estorba en móvil */
  .suena-head{position:static;top:auto}

  /* El visual del hero no impone ancho */
  .hero-visual{max-width:100%;overflow:hidden}
  .hero .netviz{right:-8vw;width:min(120%,460px)}

  /* Cualquier tarjeta o bloque respeta el ancho del viewport */
  .section,.section .wrap{max-width:100%}
  .mock,.crm-mock,.metric-hero,.pain,.step,.mirror,.pt,.faq-item,.fcol,.tl-card{max-width:100%}
}


/* v1.3.2 — FAQ: el texto de la pregunta es un span propio y encogible */
.faq-q{display:flex;align-items:flex-start;gap:18px;width:100%;text-align:left}
.faq-q .qt{flex:1 1 auto;min-width:0;overflow-wrap:break-word;hyphens:auto}
.faq-q .qi{flex:0 0 auto}
/* Compatibilidad con contenido antiguo (sin span .qt) */
.faq-q{white-space:normal}
@media (max-width:768px){
  .faq-q{gap:14px;font-size:15.5px;line-height:1.35}
  .faq-q .qi{font-size:22px}
}


/* v1.3.3 — Color de acción/foco y de error, configurables en
   Apariencia → Personalizar → Growists · Estilo global. */
:root{--gw-focus:var(--teal,#48bed9);--gw-error:#e05252}
a:focus-visible,button:focus-visible,.btn:focus-visible,.faq-q:focus-visible,.opt:focus-visible,
input:focus-visible,textarea:focus-visible,select:focus-visible,summary:focus-visible,[tabindex]:focus-visible{
  outline:2px solid var(--gw-focus);outline-offset:3px}
.gwf-field input:focus,.gwf-field textarea:focus,.gwf-field select:focus{
  border-color:var(--gw-focus);box-shadow:0 0 0 3px color-mix(in srgb,var(--gw-focus) 22%,transparent)}
.gwf-field input:invalid:not(:placeholder-shown),.gwf-field textarea:invalid:not(:placeholder-shown){border-color:var(--gw-error)}
.gwf-msg.err{color:var(--gw-error)}
/* Barras en alerta del mock de diagnóstico */
.mr-fill.low{background:linear-gradient(90deg,#e0a325,var(--gw-error))}


/* ============================================================
   v1.4 — AISLAMIENTO DE BOTONES
   Los componentes construidos sobre <button> (FAQ, flechas de
   carrusel, opciones del diagnóstico, hamburguesa) heredaban la
   regla global button/button:hover del tema padre — de ahí el
   fondo carmesí. Aquí se declaran sus cuatro estados de forma
   explícita y con especificidad suficiente para no depender de él.
   Colores en Personalizar → Growists · Estilo global.
   ============================================================ */
:root{--gw-btn-neutral-bg:transparent;--gw-btn-neutral-fg:currentColor}

/* Reset de los <button> de marca en todos sus estados */
.section button.faq-q,.section button.res-arw,.section button.opt,
header.nav button.nav-toggle,.gw-footer button,
.section button.faq-q:hover,.section button.res-arw:hover,.section button.opt:hover,
header.nav button.nav-toggle:hover,
.section button.faq-q:focus,.section button.res-arw:focus,.section button.opt:focus,
.section button.faq-q:active,.section button.res-arw:active,.section button.opt:active{
  -webkit-appearance:none;appearance:none;box-shadow:none;text-decoration:none}

/* FAQ: fondo transparente siempre; el hover solo tiñe el texto */
.faq-list .faq-item button.faq-q,
.faq-list .faq-item button.faq-q:hover,
.faq-list .faq-item button.faq-q:focus,
.faq-list .faq-item button.faq-q:active{background:transparent;border:0;color:inherit}
.faq-list .faq-item button.faq-q:hover .qt{color:var(--gw-focus)}
.faq-list .faq-item button.faq-q:hover .qi{color:var(--gw-focus)}

/* Flechas de carrusel: círculo con borde, se rellenan de marca al hover */
.section button.res-arw{background:var(--card-bg,#fff);border:1px solid var(--card-bd,rgba(10,34,57,.12));color:inherit;border-radius:100px;width:44px;height:44px;display:grid;place-items:center;cursor:pointer;transition:background .25s,border-color .25s,color .25s,transform .25s}
.section button.res-arw:hover{background:var(--grad-brand);border-color:transparent;color:#fff;transform:translateY(-2px)}
.section button.res-arw:disabled{opacity:.35;cursor:default;transform:none;background:var(--card-bg,#fff);border-color:var(--card-bd,rgba(10,34,57,.12));color:inherit}
.tone-navy button.res-arw,.tone-hero button.res-arw{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.16);color:#fff}

/* Opciones del diagnóstico */
.qcard button.opt,.qcard button.opt:focus{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.14);color:#fff}
.qcard button.opt:hover{background:rgba(255,255,255,.09);border-color:var(--gw-focus)}
.qcard button.opt.sel{border-color:var(--gw-focus);background:rgba(72,190,217,.12)}

/* Hamburguesa */
header.nav button.nav-toggle,header.nav button.nav-toggle:hover,header.nav button.nav-toggle:focus{background:none;border:0;color:#fff}

/* El botón del formulario mantiene el gradiente de marca */
.gw-form button.gwf-btn,.gw-form button.gwf-btn:hover,.gw-form button.gwf-btn:focus{background:var(--grad-brand);color:#fff;border:0}


/* v1.4.1 — DIAGNÓSTICO: sin desbordes horizontales.
   El texto de cada opción va en su propio span encogible. */
.qcard{max-width:100%;box-sizing:border-box;overflow:hidden}
.qcard .screen{min-width:0}
.opts{display:flex;flex-direction:column;gap:12px;width:100%;min-width:0}
.qcard button.opt{display:flex;align-items:flex-start;gap:14px;width:100%;max-width:100%;min-width:0;text-align:left;white-space:normal;box-sizing:border-box}
.qcard button.opt .rd{flex:0 0 auto;margin-top:2px}
.qcard button.opt .ot{flex:1 1 auto;min-width:0;overflow-wrap:break-word;line-height:1.45}
.q-title,.q-sub,.qhint{max-width:100%;overflow-wrap:break-word}
.qnav{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;width:100%}
.dims,.dim,.frase-card,.puente,.res-actions{max-width:100%;min-width:0}
.dim-track{max-width:100%}

@media (max-width:768px){
  .qcard{padding-left:20px;padding-right:20px}
  .qcard button.opt{padding:16px 18px;font-size:15px;min-height:56px}
  .q-title{font-size:clamp(1.5rem,1.1rem+2vw,2.1rem)}
  .qnav{flex-direction:column-reverse;align-items:stretch}
  .qnav .btn,.qnav .qback{width:100%;justify-content:center}
  .qhint{text-align:center}
  .res-actions .btn{width:100%}
}