/* 23 oct 2026: cada svh lleva antes su respaldo en vh. Sin él, en WebViews viejos (enlaces abiertos dentro de
   Facebook o Instagram en celulares sin actualizar) .gw-fijo quedaba sin altura y con overflow:hidden: pantalla negra. */
/* /paginas-web en celular: scroll guiado. Debajo de 768 px reemplaza a la página de escritorio (.pw);
   arriba de 768 px no existe. Las secciones con .gw-fijo se quedan pegadas mientras el dedo avanza
   y el JS les pasa el avance en --p (0 a 1). */
@media (min-width:768px) { .gw { display:none !important; } }
@media (max-width:767px) { .pw { display:none !important; } }

.gw { --ink:#0B0612; --purple:#6B3997; --purple-2:#8A55C4; --lilac:#CDB0F2; --cream:#F6F1FB; --muted:rgba(246,241,251,.66);
      --line:rgba(255,255,255,.12); --sans:'Inter Tight','Inter',system-ui,sans-serif; --serif:'Instrument Serif',Georgia,serif;
      --ease:cubic-bezier(.2,.7,.2,1);
      position:relative; background:var(--ink); color:var(--cream); font-family:var(--sans); overflow-x:clip; -webkit-tap-highlight-color:transparent; }
.gw em { font-family:var(--serif); font-style:italic; font-weight:400; color:var(--lilac); letter-spacing:-.01em; }
.gw button { font-family:inherit; color:inherit; }
.gw h1, .gw h2 { margin:0; font-weight:800; letter-spacing:-.045em; line-height:.98; text-wrap:balance; }
.gw h2 { font-size:clamp(2.1rem, 9.6vw, 2.7rem); }
.gw-eyebrow { display:block; margin-bottom:12px; font-size:11.5px; font-weight:700; letter-spacing:.2em; text-transform:uppercase; color:var(--lilac); }
.gw-fijo { position:sticky; top:0; height:100vh; height:100svh; overflow:hidden; }

/* Aparición al entrar en pantalla */
.gw-rv { opacity:0; transform:translateY(22px); transition:opacity .7s var(--ease) var(--d, 0s), transform .7s var(--ease) var(--d, 0s); }
.gw-rv.in { opacity:1; transform:none; }

/* ── Barra: se asoma cuando ya pasó la entrada ── */
.gw-barra { position:fixed; top:0; left:0; right:0; z-index:60; display:flex; align-items:center; justify-content:space-between;
            padding:calc(12px + env(safe-area-inset-top, 0px)) 18px 12px; background:rgba(11,6,18,.94);
            border-bottom:1px solid rgba(255,255,255,.06);
            transform:translateY(-100%); transition:transform .45s var(--ease); }
.gw.pasada .gw-barra { transform:none; }
.gw-barra img { height:20px; width:auto; }
.gw-pill { padding:8px 14px; border-radius:999px; background:var(--purple); color:#fff; font-size:13px; font-weight:700; text-decoration:none; }

/* En celular, la invitación flotante de Beetle tapaba los paquetes: aquí cada paquete ya lleva a Beetle */
html.gw-activo .pc-invita { display:none !important; }
/* Mientras está la entrada, la burbuja de Beetle no tapa el título */
html.gw-entrada .pc-burbuja, html.gw-entrada .pc-invita { opacity:0 !important; pointer-events:none !important; }


/* ═════════ 1 · ENTRADA: nebulosa de filamentos ═════════ */
.gw-entrada { position:relative; height:150vh; height:150svh; }
.gw-cielo { position:absolute; inset:0; overflow:hidden; opacity:0; transition:opacity .9s ease;
             transform:scale(calc(1 + var(--p, 0) * .55)); transform-origin:58% 60%; will-change:transform; }
.gw-cielo.listo { opacity:1; }
.gw-capa { position:absolute; left:-10%; top:-10%; width:120%; height:120%; will-change:transform; }
.gw-capa canvas { display:block; width:100%; height:100%; }
.gw-capa.lejos { animation:gw-deriva-a 28s ease-in-out infinite alternate; }
.gw-capa.cerca { animation:gw-deriva-b 20s ease-in-out infinite alternate; }
@keyframes gw-deriva-a { from { transform:translate3d(-2%, -1%, 0) scale(1); } to { transform:translate3d(2%, 1.5%, 0) scale(1.04); } }
@keyframes gw-deriva-b { from { transform:translate3d(2%, 1%, 0) scale(1.02); } to { transform:translate3d(-2.5%, -2%, 0) scale(1.08); } }
.gw-vivo { position:absolute; inset:0; }
.gw-vivo i { position:absolute; display:block; pointer-events:none; }
.gw-nodo { width:var(--s); height:var(--s); margin:calc(var(--s) / -2) 0 0 calc(var(--s) / -2); border-radius:50%;
           background:radial-gradient(circle, rgba(255,255,255,.95) 0, rgba(196,156,248,.55) 12%, rgba(196,156,248,.12) 38%, rgba(196,156,248,0) 68%);
           animation:gw-late 3.4s ease-in-out var(--d) infinite; }
@keyframes gw-late { 0%, 100% { transform:scale(.86); opacity:.8; } 50% { transform:scale(1.1); opacity:1; } }
.gw-chispa { width:12px; height:12px; margin:-6px 0 0 -6px; opacity:0; animation:gw-titila var(--t) ease-in-out var(--d) infinite; }
.gw-chispa::before, .gw-chispa::after { content:''; position:absolute; left:50%; top:50%; background:var(--c); border-radius:2px; transform:translate(-50%, -50%); }
.gw-chispa::before { width:100%; height:1.5px; }
.gw-chispa::after { width:1.5px; height:100%; }
@keyframes gw-titila { 0%, 100% { opacity:0; transform:scale(.4); } 50% { opacity:.9; transform:scale(1); } }
.gw-entrada.dormido .gw-capa, .gw-entrada.dormido .gw-vivo i { animation-play-state:paused; }
.gw-velo { position:absolute; inset:0; pointer-events:none;
           /* 22 oct 2026: más opaco para que el título y el subtítulo se lean sobre la nebulosa */
           background:linear-gradient(180deg, rgba(11,6,18,.78) 0%, rgba(11,6,18,.62) 40%, rgba(11,6,18,.42) 62%, rgba(11,6,18,.35) 78%, var(--ink) 100%); }
.gw-titulo { position:absolute; left:22px; right:22px; top:calc(15vh + env(safe-area-inset-top, 0px)); top:calc(15svh + env(safe-area-inset-top, 0px));
             transform:translateY(calc(var(--p, 0) * -70px)) scale(calc(1 + var(--p, 0) * .18)); transform-origin:left top;
             opacity:calc(1 - var(--p, 0) * 1.7); will-change:transform, opacity; }
.gw-logo { height:40px; width:auto; margin-bottom:32px; }
.gw-titulo h1 { font-size:clamp(3rem, 14vw, 3.9rem); line-height:.94; text-shadow:0 4px 18px rgba(11,6,18,.55); }
/* Sin animación de entrada: el título sale en el primer pintado (antes esperaba 2.8 s a un loader que ya no existe) */
.gw-titulo .l { display:block; }
@keyframes gw-sube { from { opacity:0; transform:translateY(26px); } to { opacity:1; transform:none; } }
@keyframes gw-sube-b { from { opacity:0; transform:translateY(26px); } to { opacity:1; transform:none; } }
.gw-desliza { position:absolute; left:0; right:0; bottom:calc(max(30px, 5vh) + env(safe-area-inset-bottom, 0px)); bottom:calc(max(30px, 5svh) + env(safe-area-inset-bottom, 0px)); display:flex; flex-direction:column; align-items:center; gap:12px;
              opacity:calc(1 - var(--p, 0) * 4); pointer-events:none; }
/* Siempre visible: sin animación de entrada que la pueda dejar en cero */
.gw-desliza span { padding:10px 18px; border-radius:999px; font-size:12.5px; font-weight:700; letter-spacing:.16em; text-transform:uppercase; color:var(--cream);
                   background:rgba(11,6,18,.72); border:1px solid rgba(205,176,242,.5); box-shadow:0 0 34px rgba(174,134,230,.4); }
.gw-desliza i { width:20px; height:20px; border-right:2.5px solid var(--cream); border-bottom:2.5px solid var(--cream); transform:rotate(45deg);
                filter:drop-shadow(0 0 8px rgba(205,176,242,.9)); animation:gw-baja 1.5s ease-in-out infinite; }
@keyframes gw-aparece { from { opacity:0; } to { opacity:1; } }
@keyframes gw-baja { 0%, 100% { transform:translateY(-4px) rotate(45deg); opacity:.55; } 50% { transform:translateY(7px) rotate(45deg); opacity:1; } }

/* Tarjeta del paquete del anuncio (solo si llega con utm_content de un paquete) */
.gw-anuncio { position:absolute; left:16px; right:16px; bottom:calc(92px + env(safe-area-inset-bottom, 0px)); z-index:3;
              padding:16px 16px 14px; border-radius:22px; background:rgba(18,10,30,.86); border:1px solid rgba(205,176,242,.45);
              box-shadow:0 24px 60px -20px rgba(0,0,0,.8), 0 0 40px -12px rgba(174,134,230,.5);
              animation:gw-sube .8s var(--ease) .9s both; }
.gw-anuncio-cab { display:flex; align-items:flex-end; justify-content:space-between; gap:12px; }
.gw-anuncio-nombre { min-width:0; }
.gw-anuncio-nombre .gw-eyebrow { margin-bottom:6px; font-size:10.5px; }
.gw-anuncio-nombre b { display:block; font-size:18px; font-weight:800; letter-spacing:-.02em; }
.gw-anuncio-nombre small { display:block; margin-top:2px; font-size:13px; color:var(--muted); }
.gw-anuncio-precio { flex:none; font-size:30px; font-weight:800; letter-spacing:-.04em; line-height:1; text-align:right; }
.gw-anuncio-precio sup { font-size:.5em; margin-right:1px; vertical-align:.7em; }
.gw-anuncio-precio small { display:block; margin-top:4px; font-size:11px; font-weight:600; letter-spacing:0; color:var(--muted); }
.gw-anuncio-boton { margin-top:14px; width:100%; min-height:50px; border:0; border-radius:999px; background:var(--cream); color:var(--ink) !important;
                    font-size:16px; font-weight:700; cursor:pointer; box-shadow:0 10px 40px -10px rgba(205,176,242,.6); }
.gw-anuncio p { margin:10px 0 0; font-size:12px; text-align:center; color:var(--muted); }
/* Con tarjeta, la píldora de desliza se hace discreta para no competir con el botón */
.gw-entrada.con-anuncio .gw-desliza { bottom:calc(22px + env(safe-area-inset-bottom, 0px)); }
.gw-entrada.con-anuncio .gw-desliza span { padding:7px 14px; font-size:11px; box-shadow:none; }
.gw-entrada.con-anuncio .gw-desliza i { display:none; }

/* ═════════ 2 · CÓMO SE ARMA ═════════ */
.gw-arma { position:relative; height:240vh; height:240svh; }
.gw-arma .gw-fijo { display:flex; flex-direction:column; gap:22px; padding:calc(84px + env(safe-area-inset-top, 0px)) 22px calc(18px + env(safe-area-inset-bottom, 0px)); }
.gw-frases { position:relative; min-height:5.6rem; }
.gw-frases h2 { position:absolute; inset:0 0 auto 0; opacity:0; transform:translateY(18px); transition:opacity .45s var(--ease), transform .45s var(--ease); }
.gw-frases h2.on { opacity:1; transform:none; }
.gw-cel { position:relative; flex:1 1 auto; min-height:0; display:flex; justify-content:center; perspective:900px; }
.gw-cel .pant { position:relative; height:100%; max-height:480px; aspect-ratio:9 / 18.5; max-width:100%; border-radius:30px; overflow:hidden;
                border:7px solid #221830; background:#170E22; box-shadow:0 30px 80px -20px rgba(0,0,0,.8), 0 0 70px -10px rgba(107,57,151,.6);
                transform:rotateX(calc((1 - var(--p, 0)) * 8deg)) scale(calc(.9 + var(--p, 0) * .1)); transform-origin:50% 100%; }
.gw-cel .pant img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:top; }
.esq { position:absolute; inset:0; padding:14px 12px; display:flex; flex-direction:column; gap:9px; }
.esq i, .esq .e-cards i { display:block; border-radius:8px; background:rgba(205,176,242,.2); opacity:0; transform:translateY(14px) scale(.96); transition:opacity .4s var(--ease), transform .4s var(--ease); }
.esq i.vis, .esq .e-cards i.vis { opacity:1; transform:none; }
.esq .e-nav { height:14px; width:45%; }
.esq .e-hero { height:32%; border-radius:14px; background:linear-gradient(135deg,#B99BDA,#6B3997); }
.esq .e-txt { height:10px; width:88%; }
.esq .e-txt.corto { width:60%; }
.esq .e-btn { height:26px; width:48%; border-radius:999px; background:#6B3997; }
.esq .e-cards { display:grid; grid-template-columns:1fr 1fr; gap:8px; flex:1; }
.gw-arma .real { opacity:0; transform:scale(1.05); transition:opacity .6s var(--ease), transform .6s var(--ease); }
.gw-arma .real.vis { opacity:1; transform:none; }
.aviso { position:absolute; left:50%; top:16px; z-index:2; width:min(260px, 88%); display:flex; gap:10px; align-items:center; padding:10px 12px;
         border-radius:16px; background:rgba(22,14,32,.93); border:1px solid rgba(205,176,242,.4); box-shadow:0 18px 40px -12px rgba(0,0,0,.7);
         opacity:0; transform:translate(-50%, -26px) scale(.96);
         transition:opacity .5s var(--ease), transform .6s cubic-bezier(.3,1.4,.5,1); }
.aviso.vis { opacity:1; transform:translate(-50%, 0); }
.aviso .pt { flex:none; width:30px; height:30px; border-radius:50%; background:linear-gradient(135deg,#6B3997,#CDB0F2); position:relative; }
.aviso .pt::after { content:''; position:absolute; inset:10px; border-radius:50%; background:#fff; }
.aviso b { display:block; font-size:12.5px; line-height:1.25; }
.aviso small { display:block; font-size:11.5px; color:var(--muted); }
.gw-avance { margin-right:76px; height:3px; border-radius:3px; background:rgba(255,255,255,.12); overflow:hidden; }
.gw-avance b { display:block; height:100%; width:calc(var(--p, 0) * 100%); background:linear-gradient(90deg, var(--purple-2), var(--lilac)); border-radius:3px; }

/* Aviso al final de una sección pegada: aparece cuando ya se vio casi todo (el JS pone .on).
   La flecha solo se anima mientras se ve */
.gw-sigue { position:absolute; left:0; right:0; bottom:calc(52px + env(safe-area-inset-bottom, 0px)); z-index:3; display:flex; flex-direction:column; align-items:center; gap:10px;
            opacity:0; transform:translateY(14px); transition:opacity .4s var(--ease), transform .4s var(--ease); pointer-events:none; }
.gw-sigue.on { opacity:1; transform:none; }
.gw-sigue span { padding:10px 18px; border-radius:999px; font-size:12.5px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:var(--cream);
                 background:rgba(11,6,18,.88); border:1px solid rgba(205,176,242,.5); box-shadow:0 0 34px rgba(174,134,230,.4); text-align:center; }
.gw-sigue i { width:18px; height:18px; border-right:2.5px solid var(--cream); border-bottom:2.5px solid var(--cream); transform:rotate(45deg);
              filter:drop-shadow(0 0 8px rgba(205,176,242,.9)); }
.gw-sigue.on i { animation:gw-baja 1.5s ease-in-out infinite; }
.gw-trabajo .gw-sigue { bottom:calc(30px + env(safe-area-inset-bottom, 0px)); }
/* En "cómo se arma" va debajo de la línea de avance, en su propio espacio (reservado: nada brinca
   al aparecer), con la flecha dentro y centrada bajo la línea, que deja libre la burbuja de Beetle */
.gw-arma .gw-sigue { position:static; flex:none; height:40px; margin:-6px 76px 0 0; justify-content:center; }
.gw-arma .gw-sigue span { display:inline-flex; align-items:center; gap:12px; padding:10px 16px 10px 20px; }
.gw-arma .gw-sigue span i { width:8px; height:8px; margin-top:-4px; border-width:0 2px 2px 0; filter:none; }
.gw-arma .gw-sigue.on span i { animation:gw-baja-chica 1.4s ease-in-out infinite; }
@keyframes gw-baja-chica { 0%, 100% { transform:translateY(-1px) rotate(45deg); opacity:.6; } 50% { transform:translateY(3px) rotate(45deg); opacity:1; } }

/* ═════════ 3 · TRABAJO ═════════ */
.gw-trabajo { position:relative; height:calc(var(--n, 5) * 38vh + 50vh); height:calc(var(--n, 5) * 38svh + 50svh); }
.gw-trabajo .gw-fijo { display:flex; flex-direction:column; justify-content:center; gap:22px; padding-top:calc(70px + env(safe-area-inset-top, 0px));
                        padding-bottom:calc(104px + env(safe-area-inset-bottom, 0px)); }   /* abajo va "Ya casi llegas" sin tapar los nombres */
.gw-cabeza { padding:0 22px; }
.gw-pista { display:flex; gap:18px; padding:0 22px; width:max-content; will-change:transform; }
.gw-pieza { display:flex; flex-direction:column; gap:4px; width:min(48vw, 210px); color:inherit; text-decoration:none; }
.gw-cel.chico { display:block; perspective:none; }
.gw-cel.chico .pant { display:block; height:auto; width:100%; transform:none; }
.gw-pieza b { margin-top:12px; font-size:16px; }
.gw-pieza small { font-size:13px; color:var(--muted); }

/* ═════════ 4 · PRUEBA ═════════ */
.gw-prueba, .gw-paquetes { padding:80px 22px 40px; }
.gw-paquetes { padding-top:56px; }
.gw-prueba { padding-bottom:90px; }
.gw-premios { list-style:none; margin:26px 0 0; padding:0; display:grid; gap:10px; }
.gw-premios li { display:flex; gap:14px; align-items:center; padding:14px 16px; border-radius:16px; background:rgba(255,255,255,.05); border:1px solid var(--line); }
.gw-premios i { flex:none; width:40px; height:40px; border-radius:12px; display:grid; place-items:center; font-size:19px; color:var(--lilac); background:rgba(107,57,151,.3); }
.gw-premios b { display:block; font-size:17px; }
.gw-premios span { color:var(--muted); font-size:14px; }
.gw-logos { display:grid; grid-template-columns:repeat(3, 1fr); gap:22px 14px; align-items:center; justify-items:center; margin-top:34px; opacity:.82; }
.gw-logos img { max-height:26px; max-width:88px; width:auto; object-fit:contain; }
.gw-logos.in { opacity:.82; }
.gw-mas { margin-top:56px; padding-top:40px; border-top:1px solid var(--line); display:flex; flex-direction:column; align-items:center; gap:22px; text-align:center; }
.gw-mas h2 { font-size:clamp(1.9rem, 8.6vw, 2.4rem); }
.gw-boton { display:inline-flex; align-items:center; justify-content:center; gap:10px; width:100%; min-height:54px; border-radius:999px;
            background:var(--cream); color:var(--ink); font-size:16px; font-weight:700; text-decoration:none; box-shadow:0 10px 40px -10px rgba(205,176,242,.55); }
.gw-boton:active { transform:scale(.98); }

/* ═════════ 5 · PAQUETES ═════════ */
.gw-paquetes { padding-bottom:40px; }
.gw-sub { margin:14px 0 24px; color:var(--muted); font-size:16px; line-height:1.5; }
.gw-planes { display:grid; gap:12px; }
.gw-plan { position:relative; display:grid; grid-template-columns:1fr auto 18px; align-items:center; gap:12px; width:100%; text-align:left; cursor:pointer;
           padding:18px 16px; border-radius:18px; background:rgba(255,255,255,.05); border:1px solid var(--line); }
.gw-plan:active { transform:scale(.98); }
.gw-plan.top { background:rgba(107,57,151,.28); border-color:rgba(205,176,242,.55); }
.gw-plan .n b { display:block; font-size:16.5px; }
.gw-plan .n small { display:block; margin-top:2px; font-size:13px; color:var(--muted); }
.gw-plan .p { font-weight:800; font-size:22px; letter-spacing:-.03em; font-variant-numeric:tabular-nums; }
.gw-plan .p sup { font-size:.55em; margin-right:1px; vertical-align:.55em; }
.gw-plan .p em { font-size:20px; }
.gw-plan > i { color:var(--lilac); font-size:16px; }
.gw-plan .sello { position:absolute; top:-9px; left:14px; padding:3px 9px; border-radius:999px; font-size:10.5px; font-weight:700; letter-spacing:.06em;
                  text-transform:uppercase; background:var(--lilac); color:#1A1224; }
.gw-letra { margin:18px 0 0; font-size:12.5px; line-height:1.5; color:rgba(246,241,251,.5); }
.gw-beetle { margin-top:26px; width:100%; min-height:54px; border-radius:999px; border:1px solid rgba(205,176,242,.4); background:transparent; font-size:15px; cursor:pointer; }
.gw-beetle b { color:var(--lilac); }

/* ═════════ Cuestionario ═════════ */
.gw-hoja { position:fixed; inset:0; z-index:78; display:flex; flex-direction:column; gap:18px; overflow:hidden;
           padding:calc(14px + env(safe-area-inset-top, 0px)) 20px calc(20px + env(safe-area-inset-bottom, 0px));
           background:radial-gradient(120% 60% at 90% 0%, rgba(107,57,151,.5), transparent 60%), var(--ink);
           animation:gw-hoja .35s var(--ease) both; }
.gw-hoja[hidden] { display:none; }
@keyframes gw-hoja { from { opacity:0; transform:translateY(24px); } to { opacity:1; transform:none; } }
html.gw-hoja-on, html.gw-hoja-on body { overflow:hidden !important; }
html.gw-hoja-on .pc-burbuja, html.gw-hoja-on .pc-invita { display:none !important; }
.gw-hoja-cab { display:flex; align-items:center; gap:12px; }
.gw-redondo { flex:none; width:40px; height:40px; border-radius:50%; border:1px solid var(--line); background:rgba(255,255,255,.05); display:grid; place-items:center; font-size:16px; cursor:pointer; }
.gw-paq { flex:1; text-align:center; font-size:13.5px; font-weight:600; color:var(--lilac); }
.gw-pasos { display:flex; gap:5px; }
.gw-pasos i { flex:1; height:3px; border-radius:3px; background:rgba(255,255,255,.18); transition:background .3s; }
.gw-pasos i.si { background:var(--lilac); }
.gw-preguntas { display:flex; flex-direction:column; gap:14px; min-height:0; flex:1; }
.gw-preg { font-size:clamp(1.9rem, 8.6vw, 2.35rem) !important; }
.gw-ayuda { margin:-4px 0 0; font-size:14px; color:var(--muted); }
.gw-ayuda:empty { display:none; }
.gw-ops { display:grid; gap:9px; overflow-y:auto; overflow-x:hidden; min-height:0; padding-bottom:4px; scrollbar-width:none; }
.gw-ops::-webkit-scrollbar { display:none; }
.gw-op { display:flex; align-items:center; justify-content:space-between; gap:10px; width:100%; min-height:52px; padding:12px 16px; text-align:left;
         border-radius:14px; border:1px solid var(--line); background:rgba(255,255,255,.05); font-size:16px; font-weight:500; cursor:pointer;
         transition:background .15s, border-color .15s; animation:gw-op .45s var(--ease) calc(var(--k) * .045s) both; }
@keyframes gw-op { from { opacity:0; transform:translateY(14px); } to { opacity:1; transform:none; } }
.gw-op i { opacity:0; color:var(--lilac); font-size:18px; }
.gw-op.si { background:rgba(107,57,151,.35); border-color:var(--lilac); }
.gw-op.si i { opacity:1; }
.gw-seguir { width:100%; min-height:54px; border:0; border-radius:999px; background:var(--cream); color:var(--ink) !important; font-size:16px; font-weight:700; cursor:pointer;
             box-shadow:0 10px 40px -10px rgba(205,176,242,.55); }
.gw-seguir:disabled { opacity:.4; }
.gw-listo { flex:1; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:18px; text-align:center; }
.gw-listo[hidden] { display:none; }
.gw-listo h2 { font-size:clamp(2rem, 9vw, 2.5rem); }
.gw-listo p { margin:0; max-width:30ch; color:var(--muted); }
.gw-bola { width:72px; height:72px; border-radius:50%; display:grid; place-items:center; color:#fff; background:linear-gradient(135deg,#6B3997,#CDB0F2); position:relative; }
.gw-bola svg { width:30px; height:30px; }
.gw-bola::after { content:''; position:absolute; inset:-8px; border-radius:50%; border:2px solid rgba(205,176,242,.6); animation:gw-pulso 1.4s ease-out infinite; }
@keyframes gw-pulso { from { transform:scale(.85); opacity:1; } to { transform:scale(1.35); opacity:0; } }

@media (max-height:680px) {
    .gw-titulo { top:calc(11vh + env(safe-area-inset-top, 0px)); top:calc(11svh + env(safe-area-inset-top, 0px)); }
    .gw-entrada.con-anuncio .gw-titulo h1 { font-size:2.5rem; }
    .gw-entrada.con-anuncio .gw-logo { margin-bottom:18px; }
    .gw-anuncio { padding:13px 14px 12px; bottom:calc(76px + env(safe-area-inset-bottom, 0px)); }
    .gw-anuncio p { display:none; }
    .gw-titulo h1 { font-size:2.9rem; }
    .gw-arma .gw-fijo { gap:16px; padding-top:calc(76px + env(safe-area-inset-top, 0px)); }
    .gw h2 { font-size:1.95rem; }
    .gw-op { min-height:46px; }
}

@media (prefers-reduced-motion:reduce) {
    .gw *, .gw *::after { animation:none !important; transition:none !important; }
    .gw-titulo .l, .gw-logo, .gw-rv { opacity:1 !important; transform:none !important; filter:none !important; }
}

/* «Cotiza con nuestra IA» en cada paquete (5 oct 2026) */
.gw-plan .gw-plan-ia { grid-column:1 / -1; display:flex; align-items:center; justify-content:center; gap:7px; min-height:40px; margin-top:4px;
        border-radius:999px; background:var(--cream); color:var(--ink); font-size:14px; font-weight:700; letter-spacing:-.01em; }
.gw-plan .gw-plan-ia i { font-size:14px; color:var(--purple, #6B3997); }
.gw-anuncio[data-gw-ia] { cursor:pointer; }


/* 7 oct 2026: lo primero que ve quien llega de un anuncio sale al instante, sin animación ni loader.
   La nebulosa (.gw-cielo) sí entra suave, detrás. */
.gw-titulo .l, .gw.arrancado .gw-titulo .l, .gw-logo, .gw.arrancado .gw-logo, .gw-anuncio { opacity:1; transform:none; animation:none; }

/* 9 oct 2026: suscripción. «Contratar» es lo principal; la IA queda como segunda opción */
.gw-plan .p small { font-size:.5em; font-weight:600; color:var(--muted); margin-left:1px; }
.gw-plan-contratar { grid-column:1 / -1; display:flex; align-items:center; justify-content:center; min-height:44px; margin-top:6px; border-radius:999px;
        background:var(--cream); color:var(--ink) !important; font-size:15px; font-weight:800; text-decoration:none; }
.gw-plan .gw-plan-ia { background:none; color:var(--lilac); min-height:30px; margin-top:0; font-weight:600; font-size:13px; }
.gw-plan .gw-plan-ia.solo { background:var(--cream); color:var(--ink); min-height:40px; margin-top:6px; }
.gw-plan .gw-plan-ia i { color:inherit; }
.gw-plan > i { display:none; }
a.gw-anuncio-boton { display:flex; align-items:center; justify-content:center; text-decoration:none; font-weight:800; }
.gw-anuncio-ia { display:block; width:100%; margin-top:8px; padding:6px 0 0; border:0; background:none; color:var(--lilac); font:600 13px var(--sans, inherit); cursor:pointer; }
.gw-anuncio-precio small { white-space:nowrap; }

/* 11 oct 2026: «Ver mi página gratis» es lo principal; contratar y la IA, enlaces chicos */
.gw-anuncio-sub { margin:8px 0 0 !important; font-size:12.5px !important; text-align:center; color:var(--muted); display:block !important; }
.gw-anuncio-links { display:flex; justify-content:center; gap:18px; margin-top:8px; }
.gw-anuncio-links a, .gw-anuncio-links button { padding:4px 0; border:0; background:none; color:var(--lilac) !important; font:600 13px inherit; font-family:inherit; text-decoration:none; cursor:pointer; }
.gw-plan-links { grid-column:1 / -1; display:flex; justify-content:center; align-items:center; gap:16px; }
.gw-plan-links a { color:var(--cream) !important; font-size:13px; font-weight:700; text-decoration:underline; text-underline-offset:3px; }
.gw-plan-links .gw-plan-ia { grid-column:auto; margin:0; min-height:30px; }

/* «Créala ahora» bajo el título (20 oct 2026). Sale al instante, igual que el título (regla del 7 oct) */
.gw-crear { display:inline-flex; align-items:center; gap:10px; margin-top:28px; min-height:52px; padding:0 26px; border-radius:999px;
            background:var(--cream); color:var(--ink) !important; font-size:17px; font-weight:800; letter-spacing:-.01em; text-decoration:none;
            box-shadow:0 12px 40px -10px rgba(205,176,242,.7); }
.gw-crear i { font-size:16px; }
@media (max-height:680px) { .gw-crear { margin-top:18px; min-height:46px; font-size:16px; } }
#gw-paquetes { scroll-margin-top:calc(72px + env(safe-area-inset-top, 0px)); }   /* que la barra fija no tape «Mensualidad fija» */

/* Título largo (22 oct 2026: «Si llegaste aquí, es porque quieres crecer tu marca.») y su subtítulo */
/* Lo más grande que quepa: el renglón más ancho («Si llegaste aquí») mide ~6.4 veces el tamaño de letra,
   así que se calcula sobre el ancho disponible (pantalla menos los 44 px de márgenes), con tope de 3.9rem */
.gw-titulo h1.gw-largo { font-size:min(calc((100vw - 44px) / 6.6), 3.9rem); line-height:.95; }
.gw-titulo h1.gw-largo .l { white-space:nowrap; }
.gw-subtitulo { margin:18px 0 0; max-width:21rem; font-size:17px; line-height:1.45; color:rgba(246,241,251,.82); text-shadow:0 2px 12px rgba(11,6,18,.6); }
.gw-subtitulo + script + .gw-crear, .gw-subtitulo ~ .gw-crear { margin-top:24px; }
@media (max-height:680px) { .gw-titulo h1.gw-largo { font-size:min(calc((100vw - 44px) / 7.4), 2.9rem); } .gw-subtitulo { font-size:15.5px; margin-top:12px; } }

/* Portada con la oferta del anuncio (23 oct 2026): tres renglones; «Tu página web,» mide 6.5 veces la letra */
.gw-titulo h1.gw-oferta { font-size:min(calc((100vw - 44px) / 6.8), 3.9rem); }
.gw-subtitulo b { color:var(--cream); font-weight:700; }
@media (max-height:680px) { .gw-titulo h1.gw-oferta { font-size:min(calc((100vw - 44px) / 7.6), 2.9rem); } }