/* RealCut · web pública (todas las versiones de idioma). Branding eléctrico de la app:
   fondo oscuro, azul #2f8cff, verde dinero #3ddc97, amarillo #ffc83d, degradado violeta→azul→cian. Nada de rosa. */
:root{--bg:#06080d;--text:#f5f7fb;--text-2:#aeb7c9;--text-3:#8b94a7;--blue:#2f8cff;--cyan:#22d3ee;--green:#3ddc97;--yellow:#ffc83d}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;color:var(--text);font:400 16px/1.5 "DM Sans",system-ui,sans-serif;min-height:100vh;
  background:radial-gradient(900px 520px at 8% -8%,rgba(47,140,255,.28),transparent 60%),radial-gradient(700px 520px at 100% 10%,rgba(34,211,238,.16),transparent 60%),radial-gradient(800px 600px at 60% 115%,rgba(124,92,255,.20),transparent 60%),var(--bg)}
body::before{content:"";position:fixed;inset:0;pointer-events:none;background-image:linear-gradient(rgba(255,255,255,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px);background-size:44px 44px;-webkit-mask-image:radial-gradient(ellipse 80% 60% at 50% 0%,#000 25%,transparent 75%);mask-image:radial-gradient(ellipse 80% 60% at 50% 0%,#000 25%,transparent 75%)}
a{color:inherit}
h1,h2,h3,p,span{text-wrap:pretty}
.box{position:relative;max-width:1080px;margin:0 auto;padding:22px 20px calc(24px + env(safe-area-inset-bottom));display:flex;flex-direction:column;gap:26px}
.grad{background:linear-gradient(100deg,#8b7bff 0%,#2f8cff 45%,#22d3ee 100%);-webkit-background-clip:text;background-clip:text;color:transparent}

/* cabecera */
.top{display:flex;align-items:center;gap:12px}
.marca{display:flex;align-items:center;gap:12px;text-decoration:none;font:800 20px "Plus Jakarta Sans",sans-serif;letter-spacing:-.4px}
.marca img{width:42px;height:42px;border-radius:50%;box-shadow:0 0 0 1px rgba(47,140,255,.5),0 0 24px rgba(47,140,255,.45)}
.idiomas{margin-left:auto;position:relative}
.idiomas summary{list-style:none;cursor:pointer;font-size:13px;font-weight:700;color:#c3cad8;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.04);border-radius:999px;padding:7px 12px}
.idiomas summary::-webkit-details-marker{display:none}
.idiomas nav{position:absolute;right:0;top:calc(100% + 6px);z-index:5;display:flex;flex-direction:column;min-width:150px;padding:6px;border-radius:14px;background:#0f1420;border:1px solid rgba(255,255,255,.12);box-shadow:0 20px 50px rgba(0,0,0,.5)}
.idiomas nav a{padding:8px 10px;border-radius:9px;text-decoration:none;font-size:14px;color:#c3cad8}
.idiomas nav a:hover,.idiomas nav a[aria-current]{background:rgba(47,140,255,.16);color:#fff}
.entrar{font-size:13px;font-weight:800;text-decoration:none;color:#fff;border-radius:999px;padding:8px 14px;background:linear-gradient(100deg,#8b7bff,#2f8cff,#22d3ee)}
.marca span,.idiomas summary,.entrar{white-space:nowrap}
.top{align-items:flex-start}
.marca{margin-top:2px}
.top-r{margin-left:auto;display:flex;flex-direction:column;align-items:flex-end;gap:10px}
.top-fila{display:flex;align-items:center;gap:8px}
.top-fila .idiomas{margin-left:0}
/* la lista de espera pequeña, arriba a la derecha */
.wait.mini{width:360px;max-width:100%;margin:0;padding:10px 12px;gap:4px;border-style:solid;border-color:rgba(255,200,61,.4);background:rgba(255,200,61,.07)}
.wait.mini .lock{display:flex;align-items:center;gap:6px;font-size:13px}
.wait.mini .lock svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round}
.wait.mini > span{font-size:12.5px}
.wait.mini .wait-row{margin-top:2px}
.wait.mini input{padding:8px 12px;font-size:14px}
.wait.mini button{padding:8px 14px;font-size:13px}
@media (max-width:700px){
  .top{flex-wrap:wrap}
  .top-r{display:contents}
  .top-fila{margin-left:auto}
  .wait.mini{width:100%;order:3}
}
@media (max-width:440px){.top{gap:8px}.marca > span{display:none}.idiomas summary,.entrar{font-size:12.5px;padding:7px 11px}}

/* portada */
.hero{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);gap:44px;align-items:center;padding:2vh 0}
@media (max-width:880px){.hero{grid-template-columns:1fr;gap:30px}}
.main{display:flex;flex-direction:column;gap:20px;min-width:0}
.eyebrow{margin:0;align-self:flex-start;display:inline-flex;align-items:center;gap:8px;font-weight:700;font-size:13px;color:#dbe7ff;background:rgba(47,140,255,.12);border:1px solid rgba(47,140,255,.4);border-radius:999px;padding:7px 14px 7px 12px;box-shadow:0 0 24px rgba(47,140,255,.18)}
.dot{width:8px;height:8px;border-radius:50%;background:var(--cyan);animation:pulse 1.8s infinite}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(34,211,238,.7)}70%{box-shadow:0 0 0 8px rgba(34,211,238,0)}100%{box-shadow:0 0 0 0 rgba(34,211,238,0)}}
h1{font:800 clamp(36px,6vw,62px)/1.03 "Plus Jakarta Sans","DM Sans",sans-serif;letter-spacing:-.045em;margin:0;text-wrap:balance}
.lead{margin:0;color:var(--text-2);font-size:18px;line-height:1.55;max-width:52ch}
.aviso{margin:0;font-size:14px;color:#ffc83d;background:rgba(255,200,61,.08);border:1px solid rgba(255,200,61,.3);border-radius:12px;padding:10px 12px;max-width:52ch}
.cta{position:relative;width:100%;max-width:400px}
.cta::before{content:"";position:absolute;inset:-2px;border-radius:999px;background:linear-gradient(100deg,#8b7bff,#2f8cff,#22d3ee);filter:blur(14px);opacity:.55;transition:opacity .2s}
.cta:hover::before{opacity:.9}
.btn-cta{position:relative;display:flex;align-items:center;justify-content:center;width:100%;text-decoration:none;background:#fff;color:#111827;border-radius:999px;padding:16px 22px;font:700 17px "DM Sans",sans-serif}
.nota{margin:-6px 0 0;color:var(--text-3);font-size:14px}

/* lista de espera */
.wait{display:flex;flex-direction:column;gap:6px;max-width:440px;margin-top:4px;padding:14px 16px;border-radius:16px;background:rgba(255,200,61,.06);border:1px dashed rgba(255,200,61,.45)}
.wait b{font:800 15px "Plus Jakarta Sans",sans-serif;color:var(--yellow)}
.wait > span{font-size:14px;color:var(--text-2);line-height:1.45}
.wait-row{display:flex;gap:8px;margin-top:4px}
.wait input{flex:1;min-width:0;border-radius:999px;border:1px solid rgba(255,255,255,.16);background:rgba(255,255,255,.06);color:var(--text);padding:11px 16px;font:500 15px "DM Sans",sans-serif;outline:none}
.wait input:focus{border-color:var(--yellow)}
.wait button{border:0;border-radius:999px;padding:11px 18px;font:800 14px "Plus Jakarta Sans",sans-serif;color:#1a1300;background:var(--yellow);cursor:pointer;white-space:nowrap}
.wait button:disabled{opacity:.6}
.wait-msg{margin:0;font-size:13.5px}.wait-msg.ok{color:var(--green)}.wait-msg.mal{color:#ff9db0}

/* vista previa del panel */
.prev{position:relative;border-radius:24px;padding:20px;background:linear-gradient(180deg,rgba(22,28,44,.92),rgba(12,16,26,.92)) padding-box,linear-gradient(140deg,rgba(139,123,255,.9),rgba(47,140,255,.6) 40%,rgba(34,211,238,.9)) border-box;border:1px solid transparent;box-shadow:0 30px 80px -20px rgba(47,140,255,.45);animation:float 6s ease-in-out infinite}
@keyframes float{50%{transform:translateY(-8px)}}
@media (prefers-reduced-motion:reduce){.prev,.dot{animation:none}}
.prev-h{display:flex;align-items:center;justify-content:space-between;font-size:12px;color:var(--text-3);font-weight:700}
.live{display:inline-flex;align-items:center;gap:6px;color:var(--green)}.live i{width:6px;height:6px;border-radius:50%;background:var(--green);box-shadow:0 0 10px var(--green)}
.big{margin-top:12px;font:800 40px "Plus Jakarta Sans",sans-serif;letter-spacing:-.03em;font-variant-numeric:tabular-nums}
.up{display:inline-block;margin-left:10px;vertical-align:middle;font-size:12px;font-weight:800;color:var(--green);background:rgba(61,220,151,.12);border:1px solid rgba(61,220,151,.35);border-radius:999px;padding:3px 9px;letter-spacing:0}
.split{display:flex;height:10px;border-radius:999px;overflow:hidden;margin:14px 0 6px;background:rgba(255,255,255,.07)}.split i{display:block}.split .c{background:var(--green)}.split .d{background:var(--yellow)}
.legend{display:flex;gap:14px;flex-wrap:wrap;font-size:11.5px;color:var(--text-2);margin-bottom:14px}.legend i{display:inline-block;width:8px;height:8px;border-radius:2px;margin-right:5px}
.rows{display:flex;flex-direction:column;gap:9px}
.row{display:grid;grid-template-columns:30px minmax(0,1fr) auto;gap:10px;align-items:center;background:rgba(255,255,255,.035);border:1px solid rgba(255,255,255,.06);border-radius:12px;padding:9px 11px}
.rk{width:30px;height:30px;border-radius:9px;display:grid;place-items:center;font:800 12px "Plus Jakarta Sans",sans-serif;color:#fff;background:linear-gradient(135deg,#2f8cff,#22d3ee)}
.row:nth-child(2) .rk{background:linear-gradient(135deg,#5b4bff,#2f8cff)}.row:nth-child(3) .rk{background:rgba(255,255,255,.08);color:#c3cad8}
.rn{font-size:13px;font-weight:700;color:#e8ecf4;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.rn small{display:block;font-size:11px;font-weight:600;color:var(--text-3)}
.rv{font:800 14px "Plus Jakarta Sans",sans-serif;color:var(--green)}
.best{margin-top:12px;padding:10px 12px;border-radius:12px;background:rgba(61,220,151,.1);border:1px solid rgba(61,220,151,.3);font-size:13px;color:#e8ecf4}.best b{color:var(--green)}

/* beneficios */
.feats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
@media (max-width:760px){.feats{grid-template-columns:1fr}}
.feat{display:flex;gap:14px;align-items:flex-start;background:linear-gradient(180deg,rgba(255,255,255,.05),rgba(255,255,255,.015));border:1px solid rgba(255,255,255,.08);border-radius:18px;padding:16px}
.ico{flex:none;width:40px;height:40px;border-radius:12px;display:grid;place-items:center;background:linear-gradient(135deg,rgba(47,140,255,.28),rgba(34,211,238,.10));border:1px solid rgba(47,140,255,.45);box-shadow:0 0 22px rgba(47,140,255,.25)}
.ico svg{width:20px;height:20px;stroke:#9fd0ff;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.feat h3{margin:0 0 3px;font:800 16px "Plus Jakarta Sans",sans-serif}
.feat p{margin:0;font-size:14px;color:var(--text-3);line-height:1.45}

/* secciones */
.sec{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:40px;align-items:center;padding:34px 0;border-top:1px solid rgba(255,255,255,.07)}
.sec.rev .sec-t{order:2}
@media (max-width:880px){.sec{grid-template-columns:1fr;gap:22px}.sec.rev .sec-t{order:0}}
h2{font:800 clamp(26px,3.6vw,38px)/1.08 "Plus Jakarta Sans","DM Sans",sans-serif;letter-spacing:-.035em;margin:0 0 12px;text-wrap:balance}
.sec p{margin:0 0 10px;color:var(--text-2);font-size:16.5px;line-height:1.6;max-width:48ch}
.tag{display:inline-block;margin-bottom:12px;font-size:12.5px;font-weight:700;color:#9fd0ff}
.panel{border-radius:22px;padding:18px;background:linear-gradient(180deg,rgba(255,255,255,.055),rgba(255,255,255,.015));border:1px solid rgba(255,255,255,.09)}
.vs{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.vs h3{margin:0 0 10px;font:700 12.5px "DM Sans",sans-serif;color:var(--text-3)}.vs .win h3{color:var(--green)}
.vs ol{list-style:none;margin:0;padding:0;display:grid;gap:7px}
.vs li{display:flex;justify-content:space-between;gap:8px;align-items:center;padding:9px 10px;border-radius:11px;background:rgba(255,255,255,.04);font-size:13px;font-weight:600;color:#e8ecf4}
.vs li small{font-weight:700;color:var(--text-3);white-space:nowrap}.vs .win li small{color:var(--green)}
.vs .win li:first-child{background:rgba(61,220,151,.12);outline:1px solid rgba(61,220,151,.35)}
.ten{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;margin-bottom:14px}
.ten i{border-radius:12px}
.ten svg{width:46%;height:46%;fill:none;stroke-width:1.8;stroke-linejoin:round}
.ten .g{background:rgba(61,220,151,.16);border:1px solid rgba(61,220,151,.5);box-shadow:0 0 18px rgba(61,220,151,.18)}.ten .g svg{stroke:var(--green)}
.ten .y{background:rgba(255,200,61,.10);border:1px solid rgba(255,200,61,.35)}.ten .y svg{stroke:var(--yellow)}
.ten .n{background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.08)}.ten .n svg{stroke:#5b6475}
.ten-l{display:flex;flex-wrap:wrap;gap:6px 14px;font-size:12px;color:var(--text-2)}
.ten-l i{display:inline-block;width:9px;height:9px;border-radius:3px;margin-right:6px;vertical-align:-1px}
.ten-l .g{background:var(--green)}.ten-l .y{background:var(--yellow)}.ten-l .n{background:#5b6475}
.antes{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:14px}
.antes > div{padding:12px;border-radius:14px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08)}
.antes small{display:block;font-size:11.5px;font-weight:700;color:var(--text-3);margin-bottom:4px}
.antes b{font:800 15px/1.25 "Plus Jakarta Sans",sans-serif;color:#c3cad8}
.antes .win{background:rgba(61,220,151,.1);border-color:rgba(61,220,151,.4)}.antes .win b{color:var(--green);font-size:22px}
.reels{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
@media (max-width:600px){.reels{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:46%;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:4px}.reel{scroll-snap-align:start}}
.reel{position:relative;aspect-ratio:9/16;border-radius:16px;overflow:hidden;background:linear-gradient(160deg,#1b2747,#0b1020);border:1px solid rgba(255,255,255,.1);display:flex;flex-direction:column;justify-content:flex-end;padding:10px}
.reel:nth-child(2){background:linear-gradient(160deg,#2a1f4f,#0b1020)}.reel:nth-child(3){background:linear-gradient(160deg,#0f3340,#0b1020)}
.reel .play{position:absolute;top:30%;left:50%;transform:translate(-50%,-50%);width:42px;height:42px;border-radius:50%;background:rgba(255,255,255,.14);display:grid;place-items:center}
.reel .play svg{width:16px;height:16px;fill:#fff;margin-left:2px}
.reel b{font-size:12px;color:#fff;line-height:1.25}.reel small{font-size:11px;color:var(--green);font-weight:700;margin:2px 0 8px}
.open{display:inline-flex;align-items:center;justify-content:center;border-radius:999px;padding:6px 8px;font-size:11px;font-weight:800;color:#fff;background:linear-gradient(100deg,#8b7bff,#2f8cff,#22d3ee)}
.flow{display:grid;gap:10px}
.deal{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:10px;align-items:center;padding:12px;border-radius:14px;background:rgba(255,255,255,.04)}
.chip{font-size:11.5px;font-weight:800;border-radius:999px;padding:4px 10px}.chip.r{background:rgba(47,140,255,.2);color:#9fd0ff}.chip.b{background:rgba(255,200,61,.16);color:var(--yellow)}
.deal b{font-size:14px}.deal span{display:block;font-size:12px;color:var(--text-3)}.deal em{font-style:normal;font:800 15px "Plus Jakarta Sans",sans-serif;color:var(--green)}
.sum{display:flex;justify-content:space-between;align-items:baseline;gap:10px;padding:12px 4px 0;border-top:1px dashed rgba(255,255,255,.15);font-weight:700;color:#c3cad8;font-size:14px}.sum em{font-style:normal;font:800 22px "Plus Jakarta Sans",sans-serif;color:var(--green)}

/* pasos, preguntas y cierre */
.pasos{padding:34px 0;border-top:1px solid rgba(255,255,255,.07)}
.steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
@media (max-width:760px){.steps{grid-template-columns:1fr}}
.step{padding:16px;border-radius:16px;border:1px solid rgba(255,255,255,.08)}
.step i{font-style:normal;display:inline-grid;place-items:center;width:28px;height:28px;border-radius:50%;background:linear-gradient(100deg,#8b7bff,#2f8cff,#22d3ee);color:#fff;font:800 13px "Plus Jakarta Sans",sans-serif;margin-bottom:10px}
.step h3{margin:0 0 4px;font:800 16px "Plus Jakarta Sans",sans-serif}.step p{margin:0;font-size:14px;color:var(--text-3);line-height:1.5}
.faq{padding:34px 0;border-top:1px solid rgba(255,255,255,.07);max-width:820px}
.faq details{border-bottom:1px solid rgba(255,255,255,.08)}
.faq summary{cursor:pointer;list-style:none;padding:16px 34px 16px 0;position:relative;font:700 17px/1.35 "Plus Jakarta Sans",sans-serif}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";position:absolute;right:4px;top:12px;font-size:24px;color:#9fd0ff;transition:transform .2s}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq details p{margin:0 0 16px;color:var(--text-2);line-height:1.6;max-width:70ch}
.final{text-align:center;padding:40px 0 10px;border-top:1px solid rgba(255,255,255,.07);display:flex;flex-direction:column;align-items:center;gap:16px}
.final h2{font-size:clamp(26px,4vw,40px);margin:0}
.final .wait{text-align:left;width:100%}
.pie{color:#6f788b;font-size:13px}.pie p{margin:4px 0}.pie a{color:#aeb7c9}
.pie-idiomas a{margin-right:10px;text-decoration:none}

/* botón dentro de una sección («Haz tu diagnóstico gratuito ahora») */
.btn-sec{display:inline-flex;align-items:center;gap:6px;margin-top:8px;padding:13px 22px;border-radius:999px;text-decoration:none;font:800 15px "Plus Jakarta Sans",sans-serif;color:#fff;background:linear-gradient(100deg,#8b7bff,#2f8cff,#22d3ee);box-shadow:0 10px 30px -8px rgba(47,140,255,.6);transition:transform .15s,box-shadow .15s}
.btn-sec:hover{transform:translateY(-1px);box-shadow:0 14px 34px -8px rgba(47,140,255,.8)}
@media (max-width:880px){.btn-sec{display:flex;justify-content:center}}

/* «lo que has vendido para la marca» (sección de negociar) */
.informe{margin-bottom:14px;padding:14px;border-radius:16px;background:linear-gradient(135deg,rgba(47,140,255,.14),rgba(34,211,238,.05));border:1px solid rgba(47,140,255,.4)}
.informe h3{margin:0 0 10px;font:800 15px "Plus Jakarta Sans",sans-serif}
.informe dl{margin:0;display:grid;grid-template-columns:1fr 1fr;gap:8px}
.informe dl div{padding:9px 10px;border-radius:11px;background:rgba(255,255,255,.05)}
.informe dt{font-size:11.5px;color:var(--text-3)}
.informe dd{margin:2px 0 0;font:800 18px "Plus Jakarta Sans",sans-serif;color:var(--text)}
.informe dl div:first-child dd{color:var(--green)}
.informe p{margin:10px 0 0;font-size:12.5px;font-weight:700;color:#9fd0ff}
.pasos{border-top:0;padding-top:0}

/* ── 16/10/2026: el diagnóstico gratis es el botón principal; los datos (nombre, correo, teléfono, TikTok) ── */
.btn-diag{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:8px;border:0;cursor:pointer;border-radius:999px;padding:14px 24px;font:800 15.5px "Plus Jakarta Sans",sans-serif;color:#fff;background:linear-gradient(100deg,#8b7bff,#2f8cff,#22d3ee);box-shadow:0 12px 34px -10px rgba(47,140,255,.75)}
.btn-diag:hover{filter:brightness(1.08)}.btn-diag:active{transform:scale(.98)}.btn-diag:disabled{opacity:.6}
.btn-diag.grande{width:100%;padding:17px 22px;font-size:17px}
.sec-t .btn-diag{margin-top:8px}
@media (max-width:880px){.sec-t .btn-diag{display:flex;width:100%}}
.final .nota{margin:0}.final .nota a{color:#9fd0ff}
.campos{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-top:4px}
.campos input{min-width:0;border-radius:10px;border:1px solid rgba(255,255,255,.16);background:rgba(255,255,255,.06);color:var(--text);padding:9px 11px;font:500 14px "DM Sans",sans-serif;outline:none}
.campos input:focus{border-color:var(--yellow)}
.priv{display:flex;align-items:center;gap:7px;font-size:12px;color:var(--text-2);margin-top:2px}
.priv input{flex:none;width:16px;height:16px;margin:0;accent-color:#2f8cff}.priv a{color:#9fd0ff}
.wait-btn{align-self:flex-start;border:0;border-radius:999px;padding:9px 16px;font:800 13px "Plus Jakarta Sans",sans-serif;color:#1a1300;background:var(--yellow);cursor:pointer}
.wait-btn:disabled{opacity:.6}
@media (max-width:420px){.wait.mini .campos input{padding:8px 10px;font-size:13.5px}.wait.mini{gap:3px}}
.modal{position:fixed;inset:0;z-index:50;display:grid;place-items:center;padding:16px;background:rgba(3,5,10,.72);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
.modal[hidden]{display:none}
body.modal-open{overflow:hidden}
.ficha{position:relative;width:100%;max-width:440px;display:flex;flex-direction:column;gap:10px;padding:24px 20px 20px;border-radius:22px;background:linear-gradient(180deg,#141a2a,#0c1019) padding-box,linear-gradient(140deg,rgba(139,123,255,.9),rgba(47,140,255,.6) 40%,rgba(34,211,238,.9)) border-box;border:1px solid transparent;box-shadow:0 30px 80px -20px rgba(47,140,255,.5)}
.ficha .tag{margin:0}
.ficha h2{margin:0;font-size:26px}
.ficha > p{margin:0;font-size:14px;color:var(--text-2);line-height:1.5}
.ficha .campos{grid-template-columns:1fr;gap:8px}.ficha .campos input{padding:12px 14px;font-size:15px}
.ficha .btn-diag{width:100%;margin-top:4px}
.ficha .wait-msg b{color:var(--text)}
.x{position:absolute;top:10px;right:12px;border:0;background:none;color:var(--text-3);font-size:26px;line-height:1;cursor:pointer}

/* arriba a la derecha: «Acceso solo con invitación» como botón (los datos, en su ventana) */
.inv-pill{display:flex;flex-direction:column;align-items:flex-start;gap:2px;border:1px solid rgba(255,200,61,.45);background:rgba(255,200,61,.08);color:var(--yellow);border-radius:14px;padding:8px 14px;cursor:pointer;text-align:left}
.inv-pill .lock{display:flex;align-items:center;gap:6px;font:800 12.5px "Plus Jakarta Sans",sans-serif}
.inv-pill .lock svg{width:13px;height:13px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round}
.inv-pill b{font:700 13px "DM Sans",sans-serif;color:#fff}
.inv-pill:hover{background:rgba(255,200,61,.14)}
@media (max-width:700px){.inv-pill{order:3;width:100%;flex-direction:row;align-items:center;justify-content:space-between}}

/* fotos de los productos de ejemplo (análisis de la portada y «lo que ves / lo que te pagan») */
.foto{flex:none;width:38px;height:38px;border-radius:10px;object-fit:cover;background:#09101e;box-shadow:0 0 0 1px rgba(47,140,255,.35),0 0 14px rgba(47,140,255,.18)}
.vs li > span{display:flex;align-items:center;gap:8px;min-width:0}
.vs .foto{width:34px;height:34px;border-radius:9px}

/* la comparativa con fotos tiene que caber en el móvil */
.vs{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
.vs li{min-width:0}
.vs li > span{min-width:0;line-height:1.2}
@media (max-width:480px){.vs{gap:8px}.vs li{padding:7px 8px;font-size:12px;gap:2px;flex-direction:column;align-items:flex-start}.vs li small{margin-left:32px}.vs .foto{width:26px;height:26px;border-radius:7px}.vs h3{font-size:11.5px}}

/* marcas con su producto (Lumina Skin = sérum, NutriGo = proteína) */
.deal-m{display:flex;align-items:center;gap:10px;min-width:0}
.deal .foto{width:36px;height:36px}
.informe h3{display:flex;align-items:center;gap:10px}
.informe h3 .foto{width:34px;height:34px}

/* ── 16/10/2026: «Tu tiempo también es dinero» (calculadora + comparación) y los planes ── */
.cmp-sec,.planes-sec{padding:34px 0;border-top:1px solid rgba(255,255,255,.07)}
.cmp-top{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.9fr);gap:40px;align-items:center;margin-bottom:22px}
@media (max-width:880px){.cmp-top{grid-template-columns:1fr;gap:20px}}
.cmp-sec .sec-t p{margin:0;color:var(--text-2);font-size:16.5px;line-height:1.6;max-width:48ch}
.calc{padding:18px;border-radius:20px;background:linear-gradient(180deg,rgba(255,255,255,.055),rgba(255,255,255,.015));border:1px solid rgba(255,255,255,.09);display:grid;gap:12px}
.calc h3{margin:0;font:800 15px "Plus Jakarta Sans",sans-serif;color:#9fd0ff}
.calc label{display:grid;grid-template-columns:1fr auto;gap:6px 10px;align-items:center;font-size:13.5px;color:var(--text-2)}
.calc output{font:800 16px "Plus Jakarta Sans",sans-serif;color:var(--text);font-variant-numeric:tabular-nums}
.calc input[type=range]{grid-column:1/-1;width:100%;accent-color:#2f8cff;margin:0}
.calc-r{padding:12px 14px;border-radius:14px;background:rgba(255,159,67,.09);border:1px solid rgba(255,159,67,.35)}
.calc-r small{display:block;font-size:12.5px;color:var(--text-2)}
.calc-r b{display:block;font:800 30px/1.15 "Plus Jakarta Sans",sans-serif;color:#ffb067;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.calc-r p{margin:2px 0 0;font-size:13px;color:var(--text-2)}
.cmp{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:auto repeat(var(--filas),auto);gap:0 12px}
.cmp-col{display:grid;grid-row:span calc(var(--filas) + 1);grid-template-rows:subgrid;margin:0;border-radius:18px;padding:6px 14px 10px;background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.08)}
.cmp-h{padding:10px 0 8px;font:800 16px "Plus Jakarta Sans",sans-serif;color:#c3cad8}
.cmp-f{padding:9px 0;border-top:1px solid rgba(255,255,255,.07)}
.cmp-f dt{font-size:11.5px;font-weight:700;color:var(--text-3);margin-bottom:2px}
.cmp-f dd{margin:0;font-size:14px;line-height:1.4;color:#c3cad8}
.cmp-col:first-child dd{color:#8b94a7}
.cmp-col.win{background:linear-gradient(180deg,rgba(61,220,151,.12),rgba(61,220,151,.03));border-color:rgba(61,220,151,.45);box-shadow:0 20px 50px -24px rgba(61,220,151,.45)}
.cmp-col.win .cmp-h{color:var(--green)}
.cmp-col.win dd{color:#fff;font-weight:700}
@media (max-width:760px){
  .cmp{grid-template-columns:1fr;grid-template-rows:none;gap:10px}
  .cmp-col{grid-row:auto;grid-template-rows:none;display:block}
  .cmp-col.win{order:-1}
}
.cmp-cierre{margin:18px 0 0;text-align:center;font-size:17px;color:var(--text-2)}.cmp-cierre b{color:var(--green)}
.planes-sec{text-align:center}
.planes-sec h2{max-width:22ch;margin-left:auto;margin-right:auto}
.planes-p{margin:0 auto 18px;color:var(--text-2);font-size:16.5px;max-width:52ch}
.periodo{display:inline-flex;padding:4px;border-radius:999px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);margin-bottom:22px}
.periodo button{border:0;background:none;color:var(--text-2);font:700 14px "DM Sans",sans-serif;padding:9px 16px;border-radius:999px;cursor:pointer;display:inline-flex;align-items:center;gap:8px}
.periodo button[aria-pressed=true]{background:#fff;color:#111827}
.periodo em{font-style:normal;font-size:11.5px;font-weight:800;color:#0b3d27;background:var(--green);border-radius:999px;padding:2px 8px}
.planes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;text-align:left;align-items:start}
@media (max-width:880px){.planes{grid-template-columns:1fr;max-width:440px;margin:0 auto}}
.plan{position:relative;display:flex;flex-direction:column;gap:10px;padding:22px 18px 18px;border-radius:22px;background:linear-gradient(180deg,rgba(255,255,255,.055),rgba(255,255,255,.015));border:1px solid rgba(255,255,255,.1)}
.plan.pop{background:linear-gradient(180deg,#141a2a,#0c1019) padding-box,linear-gradient(140deg,rgba(139,123,255,.9),rgba(47,140,255,.6) 40%,rgba(34,211,238,.9)) border-box;border:1px solid transparent;box-shadow:0 30px 70px -26px rgba(47,140,255,.7)}
@media (min-width:881px){.plan.pop{transform:translateY(-8px)}}
.plan-pop{position:absolute;top:-11px;left:18px;font-size:11.5px;font-weight:800;color:#fff;border-radius:999px;padding:4px 10px;background:linear-gradient(100deg,#8b7bff,#2f8cff,#22d3ee)}
.plan-h{display:flex;align-items:center;justify-content:space-between;gap:8px}
.plan-h h3{margin:0;font:800 20px "Plus Jakarta Sans",sans-serif}
.plan-prueba{font-size:11.5px;font-weight:800;color:var(--green);background:rgba(61,220,151,.12);border:1px solid rgba(61,220,151,.35);border-radius:999px;padding:3px 9px;white-space:nowrap}
.plan-para{margin:0;font-size:13.5px;color:var(--text-3);min-height:2.8em}
.plan-precio{display:flex;align-items:baseline;gap:4px}
.plan-precio b{font:800 38px "Plus Jakarta Sans",sans-serif;letter-spacing:-.03em;font-variant-numeric:tabular-nums}
.plan-precio span{font-size:14px;color:var(--text-3);font-weight:700}
.plan-cobro{margin:-6px 0 0;font-size:12.5px;color:var(--text-3)}
.plan-btn{border:0;cursor:pointer;border-radius:999px;padding:13px 16px;font:800 15px "Plus Jakarta Sans",sans-serif;color:#111827;background:#fff}
.plan.pop .plan-btn{color:#fff;background:linear-gradient(100deg,#8b7bff,#2f8cff,#22d3ee);box-shadow:0 12px 30px -10px rgba(47,140,255,.8)}
.plan-btn:hover{filter:brightness(1.06)}
.plan ul{list-style:none;margin:4px 0 0;padding:12px 0 0;border-top:1px solid rgba(255,255,255,.08);display:grid;gap:8px}
.plan li{display:flex;gap:8px;align-items:flex-start;font-size:14px;line-height:1.35;color:#dbe1ec}
.plan li svg{flex:none;width:17px;height:17px;margin-top:1px;fill:none;stroke:var(--green);stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round}
.plan li.no{color:#6f788b}.plan li.no svg{stroke:#5b6475}
.planes-nota{margin:18px auto 0;font-size:13px;color:var(--text-3);line-height:1.6}
/* calculadora v2: dos resultados, tiempo y dinero */
.calc-r{display:grid;grid-template-columns:1fr 1fr;gap:8px;padding:0;background:none;border:0}
.calc-r > div{padding:12px 14px;border-radius:14px}
.calc-t{background:rgba(47,140,255,.1);border:1px solid rgba(47,140,255,.4)}
.calc-d{background:rgba(61,220,151,.1);border:1px solid rgba(61,220,151,.45)}
.calc-r small{display:block;font-size:12px;color:var(--text-2);margin-bottom:2px}
.calc-r b{font:800 28px/1.1 "Plus Jakarta Sans",sans-serif;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.calc-t b{color:#9fd0ff}.calc-d b{color:var(--green)}
.calc-r b i{font-style:normal;font-size:13px;font-weight:700;color:var(--text-2);letter-spacing:0}
.calc-r p{margin:4px 0 0;font-size:12.5px;font-weight:700;color:var(--green)}
.calc-nota{margin:0;font-size:11.5px;color:var(--text-3);line-height:1.45}
@media (max-width:400px){.calc-r{grid-template-columns:1fr}}
/* 17/10/2026: el mini análisis va justo debajo de la portada, a lo ancho */
.mini .calc{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 26px;padding:20px 22px}
.mini .calc h3{grid-column:1/-1;font-size:17px}
.mini .calc-r,.mini .calc-cta,.mini .calc-nota{grid-column:1/-1}
.mini .calc-r b{font-size:34px}
.mini .calc-cta .btn-diag{width:100%}
.cmp-top{grid-template-columns:1fr}
@media (max-width:700px){.mini .calc{grid-template-columns:1fr}}
/* 17/10/2026: casillas para escribir el número en la calculadora */
.calc-n{display:inline-flex;align-items:center;gap:4px;justify-self:end}
.calc-n input{width:96px;text-align:right;border-radius:10px;border:1px solid rgba(255,255,255,.18);background:rgba(255,255,255,.06);color:var(--text);padding:6px 9px;font:800 16px "Plus Jakarta Sans",sans-serif;font-variant-numeric:tabular-nums;outline:none;-moz-appearance:textfield}
.calc-n input:focus{border-color:#2f8cff}
.calc-n input::-webkit-outer-spin-button,.calc-n input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.calc-n i{font-style:normal;font-weight:800;color:var(--text-2)}
.calc-n input[data-calc-n=v]{width:64px}

/* 17/10/2026: la calculadora es por cuenta (1, 2 o 3) */
.calc-cuentas{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px;font-size:14px;color:var(--text-2);font-weight:700}
.calc-cuentas [role=group]{display:inline-flex;padding:3px;border-radius:999px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.12)}
.calc-cuentas button{border:0;background:none;color:var(--text-2);font:800 14px "Plus Jakarta Sans",sans-serif;width:38px;height:30px;border-radius:999px;cursor:pointer}
.calc-cuentas button[aria-pressed=true]{background:#fff;color:#111827}
.calc-por{margin:-4px 0 0;font-size:12.5px;color:var(--text-3)}
.calc-acc{display:grid;gap:10px;padding:12px 14px;border-radius:14px;background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.08)}
.calc-acc[hidden]{display:none}
.calc-acc-t{font:800 13px "Plus Jakarta Sans",sans-serif;color:#9fd0ff}
.mini .calc-cuentas,.mini .calc-por,.mini .calc-acc{grid-column:1/-1}
.mini .calc-acc{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 26px}
.mini .calc-acc-t{grid-column:1/-1}
@media (max-width:700px){.mini .calc-acc{grid-template-columns:1fr}}

/* 17/10/2026: EE. UU. → «Español» (latinos) y al revés */
.alt-idioma{font-size:13px;font-weight:800;text-decoration:none;color:#fff;border:1px solid rgba(255,255,255,.25);border-radius:999px;padding:7px 12px;white-space:nowrap}
.alt-idioma:hover{background:rgba(255,255,255,.08)}
/* 17/10/2026: el selector ya dice país + idioma; en el móvil la fila de arriba puede bajar de línea */
.idiomas nav{min-width:220px}
.idiomas nav a{white-space:nowrap}
@media (max-width:520px){.top-fila{flex-wrap:wrap;justify-content:flex-end;row-gap:8px}}

/* 17/10/2026: páginas de la calculadora de comisiones */
.cc-hero{padding:3vh 0 10px;display:grid;gap:16px}
.cc-hero h1{font-size:clamp(32px,5vw,52px)}
.cc{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:16px;padding:20px;border-radius:22px;background:linear-gradient(180deg,rgba(22,28,44,.92),rgba(12,16,26,.92)) padding-box,linear-gradient(140deg,rgba(139,123,255,.9),rgba(47,140,255,.6) 40%,rgba(34,211,238,.9)) border-box;border:1px solid transparent;box-shadow:0 30px 80px -24px rgba(47,140,255,.45)}
.cc-in{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.cc-in label{display:grid;gap:6px;font-size:13px;color:var(--text-2);font-weight:700}
.cc-in input{border-radius:12px;border:1px solid rgba(255,255,255,.16);background:rgba(255,255,255,.06);color:var(--text);padding:12px 14px;font:800 18px "Plus Jakarta Sans",sans-serif;outline:none;width:100%;min-width:0}
.cc-in input:focus{border-color:#2f8cff}
.cc-out{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.cc-out div{padding:12px 14px;border-radius:14px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08)}
.cc-out small{display:block;font-size:12px;color:var(--text-3);font-weight:700}
.cc-out b{display:block;font:800 24px "Plus Jakarta Sans",sans-serif;font-variant-numeric:tabular-nums;margin-top:2px}
.cc-out .win{background:rgba(61,220,151,.1);border-color:rgba(61,220,151,.45)}.cc-out .win b{color:var(--green);font-size:30px}
.cc .calc-nota{grid-column:1/-1}
.cc-mini{padding:30px 0;border-top:1px solid rgba(255,255,255,.07)}
.cc-mini h2{margin-bottom:16px}
@media (max-width:760px){.cc{grid-template-columns:1fr}.cc-in{grid-template-columns:1fr 1fr}}
/* 17/10/2026: la comparación como tabla, con los conceptos a la izquierda */
.ct{display:grid;grid-template-columns:minmax(0,.9fr) repeat(3,minmax(0,1fr));border-radius:18px;overflow:hidden;border:1px solid rgba(255,255,255,.08)}
.ct > div{padding:12px 14px;border-bottom:1px solid rgba(255,255,255,.07);font-size:14px;line-height:1.35;color:#c3cad8}
.ct-h{font:800 15px "Plus Jakarta Sans",sans-serif;color:#c3cad8!important;background:rgba(255,255,255,.03)}
.ct-l{font-size:12.5px!important;font-weight:700;color:var(--text-3)!important}
.ct .win{background:rgba(61,220,151,.08);color:#fff!important;font-weight:700}
.ct-h.win{color:var(--green)!important;background:rgba(61,220,151,.14)}
.ct > div:nth-last-child(-n+4){border-bottom:0}
@media (max-width:640px){.ct > div{padding:9px 8px;font-size:12px}.ct-h{font-size:12.5px}.ct-l{font-size:11px!important}}
/* 17/10/2026: preguntas por temas */
.faq-tabs{display:flex;flex-wrap:wrap;gap:6px;margin:4px 0 10px}
.faq-tabs button{border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.04);color:var(--text-2);font:700 13px "DM Sans",sans-serif;padding:8px 13px;border-radius:999px;cursor:pointer}
.faq-tabs button[aria-pressed=true]{background:#fff;color:#111827;border-color:#fff}
.faq-g[hidden]{display:none}
/* 17/10/2026: opiniones reales, en una cinta que se mueve sola (como Cut AI) */
.rs-sec{padding:20px 0;overflow:hidden}
.rs-sec h2{text-align:center}
.rs-cinta{overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.rs-mov{display:flex;gap:14px;width:max-content;animation:rs 60s linear infinite}
.rs-cinta:hover .rs-mov{animation-play-state:paused}
@keyframes rs{to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){.rs-mov{animation:none;flex-wrap:wrap;width:auto}}
.rs{margin:0;width:300px;flex:none;padding:16px;border-radius:18px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.09);display:flex;flex-direction:column;gap:8px}
.rs-e{color:#ffc83d;letter-spacing:2px}
.rs blockquote{margin:0;font-size:14px;line-height:1.5;color:#dbe1ec}
.rs-r{margin:0;font-size:13px;font-weight:800;color:var(--green)}
.rs figcaption{display:flex;align-items:center;gap:8px;font-size:13px;margin-top:auto}
.rs figcaption img,.rs figcaption span{width:32px;height:32px;border-radius:50%;object-fit:cover;display:grid;place-items:center;background:linear-gradient(135deg,#2f8cff,#22d3ee);font-weight:800}
.rs figcaption small{color:var(--text-3)}

/* 17/10/2026: el plan recomendado según la calculadora */
.plan-roi{max-width:620px;margin:0 auto 18px;padding:12px 16px;border-radius:14px;background:rgba(61,220,151,.09);border:1px solid rgba(61,220,151,.4);font-size:15px;color:var(--text-2);line-height:1.5}
.plan-roi b{color:#fff}.plan-roi b:last-child{color:var(--green)}
.plan-rec{display:none;position:absolute;top:-11px;right:18px;font-size:11.5px;font-weight:800;color:#0b3d27;border-radius:999px;padding:4px 10px;background:var(--green)}
.plan.rec .plan-rec{display:block}
.plan.rec{outline:2px solid rgba(61,220,151,.7);outline-offset:2px}

/* 17/10/2026: Creator y Pro con las mismas filas: cada fila a la misma altura para compararlas de un vistazo */
@media (min-width:881px){.plan li{min-height:3.1em}.plan.pop{transform:none}}
/* 17/10/2026: en el móvil, los planes en carrusel: se desliza de uno a otro (como Cut AI) */
.planes-nav{display:none}
@media (max-width:880px){
  .planes{display:flex;grid-template-columns:none;max-width:none;margin:0 -20px;padding:14px 20px 6px;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;-webkit-overflow-scrolling:touch}
  .planes::-webkit-scrollbar{display:none}
  .plan{flex:0 0 84%;scroll-snap-align:center}
  .planes-nav{display:flex;align-items:center;justify-content:center;gap:14px;margin:-6px 0 4px}
  .planes-nav button{width:34px;height:34px;border-radius:50%;border:1px solid rgba(255,255,255,.18);background:rgba(255,255,255,.05);color:#fff;font-size:20px;line-height:1;cursor:pointer}
  .planes-nav button:disabled{opacity:.3}
  .pl-pos{font-size:13px;font-weight:700;color:var(--text-2);min-width:120px;text-align:center}
}
/* 17/10/2026 (Celia): ningún plan «por encima» del resto: sin bordes llamativos; el Pro, solo un poco más iluminado.
   Lo que no tiene un plan, con una X roja. */
.plan,.plan.pop{background:linear-gradient(180deg,rgba(255,255,255,.055),rgba(255,255,255,.015));border:1px solid rgba(255,255,255,.1);box-shadow:none;transform:none}
.plan.pop{background:linear-gradient(180deg,rgba(47,140,255,.13),rgba(255,255,255,.03));border-color:rgba(255,255,255,.16);box-shadow:0 0 60px -22px rgba(47,140,255,.55)}
.plan.rec{outline:0}
.plan.pop .plan-btn{color:#111827;background:#fff;box-shadow:none}
.plan li.no{color:#9aa3b5}
.plan li.no svg{stroke:#ff5c6c;stroke-width:2.6}
/* 17/10/2026: en anual, lo que costaría sin descuento, tachado, y lo que te ahorras */
.plan-cobro s{color:var(--text-3);text-decoration-color:#ff5c6c;text-decoration-thickness:2px}

/* 17/10/2026: «¿Eres una agencia? Déjanos aquí tu correo» */
.agencia-link{margin:10px 0 0;font-size:14px;color:var(--text-2)}
.agencia-link button{border:0;background:none;color:#9fd0ff;font:700 14px "DM Sans",sans-serif;cursor:pointer;text-decoration:underline;text-underline-offset:3px;padding:0}
/* 17/10/2026: en la frase de la media, el tiempo y el dinero destacan */
.cmp-cierre{font-size:18px;line-height:1.9}
.dest{display:inline-block;padding:2px 12px;border-radius:999px;font:800 19px "Plus Jakarta Sans",sans-serif;white-space:nowrap}
.dest.t{color:#9fd0ff;background:rgba(47,140,255,.14);border:1px solid rgba(47,140,255,.45)}
.dest.d{color:var(--green);background:rgba(61,220,151,.12);border:1px solid rgba(61,220,151,.45)}
.cmp-nota{margin:6px 0 0;text-align:center;font-size:11.5px;color:var(--text-3)}

/* 17/10/2026: menú de secciones, pegado arriba al bajar */
.secciones{position:sticky;top:0;z-index:40;display:flex;gap:4px;justify-content:center;margin:14px -8px 0;padding:8px;
  background:rgba(6,8,13,.82);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid rgba(255,255,255,.06);
  overflow-x:auto;scrollbar-width:none}
.secciones::-webkit-scrollbar{display:none}
.secciones a,.secciones button{flex:none;border:0;background:none;color:var(--text-2);font:700 13.5px "DM Sans",sans-serif;text-decoration:none;
  padding:8px 13px;border-radius:999px;cursor:pointer;white-space:nowrap}
.secciones a:hover,.secciones button:hover{color:#fff;background:rgba(255,255,255,.06)}
.secciones button{color:#9fd0ff}
@media (max-width:620px){.secciones{justify-content:flex-start;margin:10px -16px 0;padding:8px 12px}.secciones a,.secciones button{font-size:12.5px;padding:7px 10px}}
html{scroll-padding-top:64px}

/* 17/10/2026 (Celia): el dibujo del análisis, en pequeño al lado del título; al bajar, ya se ve la calculadora */
.hero{grid-template-columns:minmax(0,1fr) 300px;gap:36px;padding:1vh 0}
.hero .an{padding:12px;gap:8px;font-size:12px}
.hero .an-pasos,.hero .an-diez{display:none}
.hero .an-fila{grid-template-columns:minmax(0,1fr) auto;gap:8px}.hero .an-b{display:none}.hero .an-v{min-width:56px}
.hero .an-file{padding:7px}.hero .an-xls{width:28px;height:32px}
.hero .an-total b{font-size:22px}
@media (max-width:880px){
  .hero{grid-template-columns:1fr;gap:18px}
  .hero .an{max-width:420px;width:100%;margin:0 auto}
  .hero .an-lista{display:none}
}

/* 17/10/2026: la @ de TikTok ya escrita delante del campo */
.arroba{position:relative;display:block;min-width:0}
.arroba span{position:absolute;left:12px;top:50%;transform:translateY(-50%);font:700 15px "DM Sans",sans-serif;color:var(--text-2);pointer-events:none}
.campos .arroba input{width:100%;padding-left:28px}
.ficha .campos .arroba input{padding-left:31px}

.agencia-link.solo{text-align:center;margin:28px 0 0}

/* 17/10/2026 (Celia): GMV vs comisiones, sin texto: etiquetas grandes y colores por puesto (verde, naranja, gris) */
.vs h3{font:800 17px "Plus Jakarta Sans",sans-serif;letter-spacing:.2px;color:#aab3c5;margin:0 0 12px;text-transform:none}
.vs .win h3{color:var(--green)}
.vs > div:first-child li,.vs > div:first-child li.top{background:rgba(255,255,255,.05);outline:1px solid rgba(255,255,255,.10)}
.vs > div:first-child li small{color:#aab3c5}
.vs .win li{transition:top .6s cubic-bezier(.65,0,.35,1),background .5s,outline-color .5s}
.vs .win li small{transition:color .5s}
/* 17/10/2026 (Celia): color fijo por producto en las dos columnas: verde el que más comisión deja, rojo el que menos */
.vs li[data-k="v"],.vs > div:first-child li[data-k="v"]{background:rgba(61,220,151,.15);outline:1px solid rgba(61,220,151,.5)}
.vs li[data-k="v"] small,.vs > div:first-child li[data-k="v"] small{color:#3ddc97}
.vs li[data-k="r"],.vs > div:first-child li[data-k="r"]{background:rgba(255,92,92,.14);outline:1px solid rgba(255,92,92,.5)}
.vs li[data-k="r"] small,.vs > div:first-child li[data-k="r"] small{color:#ff8a8a}
.vs li[data-k="n"],.vs > div:first-child li[data-k="n"]{background:rgba(255,255,255,.05);outline:1px solid rgba(255,255,255,.10)}
.vs .win li[data-k="n"] small{color:#c9d1df}

/* 17/10/2026: resultados de la calculadora en % (las horas, debajo y en pequeño, como los euros) */
.calc-t p{margin:4px 0 0;font-size:12.5px;color:var(--text-2)}

/* 17/10/2026 (Celia): GMV vs comisiones en una sola tabla: producto | GMV | Comisiones */
.gc{--cg:minmax(0,1fr) 86px 104px}
.gc-cab{display:grid;grid-template-columns:var(--cg);gap:8px;padding:0 12px 10px;font:800 16px "Plus Jakarta Sans",sans-serif}
.gc-cab b{text-align:right;transition:opacity .4s}
.gc-cab [data-col="g"]{color:#aab3c5}.gc-cab [data-col="c"]{color:var(--green)}
.gc[data-por="g"] [data-col="c"],.gc[data-por="c"] [data-col="g"]{opacity:.45}
.gc[data-por] b::after{content:"";display:inline-block;width:0;margin-left:0}
.gc[data-por="g"] [data-col="g"]::after,.gc[data-por="c"] [data-col="c"]::after{content:"▼";font-size:10px;margin-left:5px;vertical-align:2px}
.gc ol{list-style:none;margin:0;padding:0;display:grid;gap:7px}
.gc li{display:grid;grid-template-columns:var(--cg);gap:8px;align-items:center;padding:9px 12px;border-radius:12px;
  background:rgba(255,255,255,.05);outline:1px solid rgba(255,255,255,.10);font-size:13px;font-weight:600;color:#e8ecf4}
.gc-n{display:flex;align-items:center;gap:9px;min-width:0;line-height:1.2}
.gc-n .foto{width:34px;height:34px;border-radius:9px;flex:none}
.gc small{text-align:right;font-weight:700;white-space:nowrap;font-size:13px}
.gc .gc-g{color:#aab3c5}.gc .gc-c{color:#c9d1df}
.gc li[data-k="v"]{background:rgba(61,220,151,.15);outline-color:rgba(61,220,151,.5)}.gc li[data-k="v"] .gc-c{color:#3ddc97}
.gc li[data-k="r"]{background:rgba(255,92,92,.14);outline-color:rgba(255,92,92,.5)}.gc li[data-k="r"] .gc-c{color:#ff8a8a}
.gc.anima ol{position:relative;display:block}
.gc.anima li{position:absolute;left:0;right:0;transition:top .7s cubic-bezier(.65,0,.35,1)}
@media (max-width:480px){.gc{--cg:minmax(0,1fr) 64px 78px}.gc li{padding:8px 9px;font-size:12px;gap:6px}.gc small{font-size:12px}
  .gc-n .foto{width:28px;height:28px;border-radius:7px}.gc-cab{font-size:13.5px;padding:0 9px 8px;gap:6px}}
@media (prefers-reduced-motion:reduce){.gc.anima li{transition:none}}

.gc-cab b{white-space:nowrap}
@media (max-width:480px){.gc{--cg:minmax(0,1fr) 62px 88px}.gc-cab{font-size:13px}.gc[data-por="g"] [data-col="g"]::after,.gc[data-por="c"] [data-col="c"]::after{margin-left:3px}}

/* 17/10/2026 (Celia): sin flechitas; al reordenar por comisión sale un sticker «Mayor comisión» encima del dinero */
.gc[data-por="g"] [data-col="g"]::after,.gc[data-por="c"] [data-col="c"]::after{content:none}
.gc li{overflow:visible}
.gc ol{margin-top:16px}
.gc-c{position:relative}
.gc-badge{position:absolute;right:-6px;bottom:calc(100% + 10px);white-space:nowrap;font:800 11px "DM Sans",sans-serif;color:#06200f;
  background:linear-gradient(135deg,#7dffc0,#3ddc97);padding:4px 9px;border-radius:999px;box-shadow:0 6px 18px rgba(61,220,151,.45);
  transform:rotate(-6deg) scale(0);transform-origin:80% 100%;opacity:0;transition:transform .35s cubic-bezier(.34,1.6,.64,1),opacity .2s;pointer-events:none;z-index:2}
.gc-badge::after{content:"";position:absolute;right:16px;top:100%;border:5px solid transparent;border-top-color:#3ddc97}
.gc[data-por="c"] .gc-badge,.gc:not([data-por]) .gc-badge{transform:rotate(-6deg) scale(1);opacity:1;transition-delay:.55s}
@media (max-width:480px){.gc-badge{font-size:10px;padding:3px 7px;right:-4px}}

/* 17/10/2026 (Celia): móvil/iPhone. El menú cabe entero (en dos líneas si hace falta, sin cortar «Precios») y en
   el móvil no sale el dibujo del Excel de la portada: debajo del botón va directamente la calculadora */
@media (max-width:620px){
  .secciones{flex-wrap:wrap;justify-content:center;overflow:visible;gap:4px 2px;margin:10px -16px 0;padding:7px 10px}
  .secciones a,.secciones button{font-size:12.5px;padding:6px 9px}
}
@media (max-width:880px){.hero .an{display:none}.hero{gap:0}}
@media (max-width:620px){html{scroll-padding-top:96px}}
/* ─── Guías (18/10/2026) ─── */
.guia{max-width:820px}
.guia-migas{margin:18px 0 0;font-size:14px}.guia-migas a{color:#9fd0ff;text-decoration:none}
.guia-hero{padding:22px 0 10px}.guia-hero h1{font-size:clamp(30px,5vw,48px);line-height:1.12;margin:0 0 16px}
.guia-b{padding:22px 0;border-top:1px solid rgba(255,255,255,.07)}
.guia-b h2{font-size:clamp(22px,3.2vw,28px);margin:0 0 12px}
.guia-b p,.guia-b li{color:var(--text-2);font-size:17px;line-height:1.65;max-width:70ch}
.guia-b p{margin:0 0 12px}.guia-b ul,.guia-b ol{margin:0 0 12px;padding-left:22px}.guia-b li{margin:4px 0}
.guia-b b{color:var(--text,#e8ecf4)}.guia-b a{color:#9fd0ff}
.guia-b .ojo{background:rgba(61,220,151,.08);border:1px solid rgba(61,220,151,.25);border-radius:14px;padding:14px 16px;color:var(--text,#e8ecf4)}
.guia-b table{border-collapse:collapse;width:100%;margin:6px 0 12px;font-size:15px}
.guia-b th,.guia-b td{border-bottom:1px solid rgba(255,255,255,.1);padding:9px 8px;text-align:left;vertical-align:top;color:var(--text-2)}
.guia-b th{color:var(--text,#e8ecf4)}
.guia-b .fuente{font-size:13px;opacity:.75}
.guia-lista{list-style:none;padding:0;margin:10px 0 30px;display:grid;gap:12px}
.guia-lista a{display:block;padding:18px 20px;border:1px solid rgba(255,255,255,.1);border-radius:16px;background:rgba(255,255,255,.03);text-decoration:none;color:inherit}
.guia-lista a:hover{border-color:#9fd0ff}
.guia-lista b{display:block;font:800 19px/1.3 "Plus Jakarta Sans",sans-serif;margin-bottom:6px}
.guia-lista span{color:var(--text-2);font-size:15px;line-height:1.5}
.guia-mas{padding:24px 0 10px;border-top:1px solid rgba(255,255,255,.07)}.guia-mas h2{font-size:22px;margin:0 0 10px}
.guia-mas ul{padding-left:20px;margin:0}.guia-mas li{margin:6px 0}.guia-mas a{color:#9fd0ff}
.pie-guias a{color:#9fd0ff}
@media(max-width:600px){.guia-b p,.guia-b li{font-size:16px}.guia-b table{font-size:13px}}
