:root {
    --ink:#0D0E26; --navy:#16183B; --navy-2:#1D2050; --line:rgba(206,210,255,.12); --line-2:rgba(206,210,255,.22);
    --txt:#F3F4FA; --mut:#A9AED0; --dim:#8990BC;
    --teal:#6ACAD2; --crimson:#D92659; --cta:#C71F4E; --cta-2:#AE1A44;
    --ease-out:cubic-bezier(.23,1,.32,1);
    --r-lg:22px; --r-md:14px; --r-sm:8px;
    --gut:clamp(16px, 4vw, 40px);
    --sans:-apple-system, BlinkMacSystemFont, "SF Pro Display", "SF Pro Text", "Helvetica Neue", Helvetica, Arial, sans-serif;
  }
  * { box-sizing:border-box; margin:0; padding:0; }
  html { scrollbar-color:var(--navy-2) var(--ink); }
  /* los brillos de fondo salen del ancho de la pantalla; clip en html evita que el celular achique la página para mostrarlos */
  html { overflow-x:clip; }
  body { background:var(--ink); color:var(--txt); font:400 17px/1.6 var(--sans); -webkit-font-smoothing:antialiased; overflow-x:hidden; }
  ::selection { background:rgba(217,38,89,.4); color:#fff; }
  :focus-visible { outline:2px solid var(--teal); outline-offset:3px; border-radius:6px; }
  img { display:block; max-width:100%; height:auto; }
  a { color:inherit; text-decoration:none; }
  .wrap { width:min(1200px, 100% - 2 * var(--gut)); margin:0 auto; position:relative; }
  h1, h2, h3 { letter-spacing:-.025em; line-height:1.02; text-wrap:balance; }
  h2 { font-size:clamp(32px, 4.4vw, 58px); font-weight:700; }
  p { text-wrap:pretty; }
  .lede { color:var(--mut); font-size:clamp(17px, 1.5vw, 19px); max-width:58ch; }

  .btn { display:inline-flex; align-items:center; justify-content:center; min-height:48px; padding:0 24px; border-radius:999px;
    font:600 16px/1 var(--sans); letter-spacing:.005em; cursor:pointer; border:1px solid transparent;
    transition:transform 160ms var(--ease-out), background-color 200ms ease, border-color 200ms ease; }
  .btn:active { transform:scale(.97); }
  .btn.pri { background:var(--cta); color:#fff; box-shadow:0 8px 18px -6px rgba(0,0,0,.55); }
  .btn.sec { border-color:var(--line-2); color:var(--txt); background:rgba(22,24,59,.5); }
  @media (hover:hover) and (pointer:fine) {
    .btn.pri:hover { background:var(--cta-2); }
    .btn.sec:hover { border-color:var(--teal); }
  }

  /* logo: solo acá rige el manual (lámina 11) */
  .logo { --h:30px; display:inline-flex; align-items:center; gap:calc(var(--h) * .23); color:#fff; }
  .logo img { height:var(--h); width:auto; }
  .logo .wm { font-family:"Fira Sans Condensed", sans-serif; font-style:italic; font-size:calc(var(--h) * .9); line-height:1; white-space:nowrap; }
  .logo .f { font-weight:300; } .logo .b { font-weight:500; }

  /* ── nav ── */
  nav { height:84px; display:flex; align-items:center; justify-content:space-between; gap:24px; }
  nav ul { display:flex; gap:32px; list-style:none; color:var(--mut); font-size:15px; }
  nav .btn { min-height:42px; padding:0 20px; font-size:15px; }

  /* ── hero ── */
  .hero { position:relative; padding:64px 0 40px; text-align:center; overflow:hidden; isolation:isolate; }
  .hero::before { content:""; position:absolute; z-index:-1; left:-10%; top:-20%; width:70%; height:90%;
    background:radial-gradient(50% 50% at 50% 50%, rgba(106,202,210,.22), rgba(106,202,210,.06) 55%, transparent 75%); filter:blur(60px); }
  .hero::after { content:""; position:absolute; z-index:-1; right:-12%; top:30%; width:70%; height:80%;
    background:radial-gradient(50% 50% at 50% 50%, rgba(217,38,89,.24), rgba(217,38,89,.07) 55%, transparent 75%); filter:blur(70px); }
  .hero h1 { font-size:clamp(40px, 6.7vw, 96px); font-weight:700; letter-spacing:-.04em; line-height:.98; }
  .hero h1 .a { display:block; color:var(--dim); }
  .hero h1 .b { display:block; }
  .hero .lede { margin:26px auto 0; }
  .hero .cta { display:flex; gap:12px; justify-content:center; flex-wrap:wrap; margin-top:34px; }

  .stage { position:relative; margin:64px auto 0; width:100%; max-width:1200px; }
  .player { position:relative; width:72%; margin:0 auto; aspect-ratio:16/9; border-radius:var(--r-lg); overflow:hidden;
    border:1px solid var(--line-2); box-shadow:0 30px 40px -24px rgba(0,0,0,.8);
    background:#0a0b1c url(img/hero-escenario.webp) center/cover no-repeat; }
  .player::after { content:""; position:absolute; inset:0;
    background:linear-gradient(to top, rgba(9,10,28,.94) 0%, rgba(9,10,28,.5) 28%, transparent 58%), linear-gradient(to right, rgba(9,10,28,.55), transparent 48%); }
  .player .meta { position:absolute; z-index:2; left:15%; bottom:17%; text-align:left; }
  .player .tag { position:absolute; z-index:2; top:16px; left:16px; font-size:13px; padding:4px 11px; border-radius:999px; background:rgba(13,14,38,.6); border:1px solid var(--line-2); }
  .player .meta .t { display:block; letter-spacing:-.03em; line-height:1.02; font-size:clamp(20px, 3vw, 40px); font-weight:700; margin-top:6px; max-width:13em; }
  .player .play { position:absolute; z-index:2; left:50%; top:44%; width:13%; aspect-ratio:1; transform:translate(-50%,-50%); display:grid; place-items:center;
    border-radius:50%; background:rgba(13,14,38,.45); border:1px solid rgba(255,255,255,.35); color:#fff; }
  .player .play svg { width:38%; height:38%; margin-left:6%; }
  .player .bar { position:absolute; z-index:2; left:15%; right:15%; bottom:8%; height:4px; border-radius:2px; background:rgba(255,255,255,.2); }
  .player .bar::before { content:""; position:absolute; inset:0 62% 0 0; border-radius:2px; background:var(--teal); }

  .phone { position:absolute; z-index:3; width:18.3%; aspect-ratio:9/16; border-radius:24px; overflow:hidden; border:1px solid var(--line-2);
    box-shadow:0 24px 36px -16px rgba(0,0,0,.85); background:#0a0b1c center/cover no-repeat; }
  .phone.l { left:3.5%; top:9%; transform:rotate(-6deg); background-image:url(img/hero-vertical-orador.webp); }
  .phone.r { right:3.5%; top:4%; transform:rotate(6deg); background-image:url(img/hero-vertical-podcast.webp); }
  .phone::after { content:""; position:absolute; inset:0; background:linear-gradient(to top, rgba(9,10,28,.9), rgba(9,10,28,.35) 24%, transparent 48%); }
  .phone .tag { position:absolute; z-index:2; top:14px; left:14px; font-size:12px; padding:4px 10px; border-radius:999px; background:rgba(13,14,38,.6); border:1px solid var(--line-2); }
  .phone .cap { position:absolute; z-index:2; left:12px; right:12px; bottom:9%; text-align:center; font:820 clamp(13px, 1.6vw, 21px)/1.12 var(--sans); text-transform:uppercase; letter-spacing:-.01em; }
  .phone .cap em { font-style:normal; padding:0 5px; border-radius:4px; }
  .phone.l .cap em { background:var(--teal); color:var(--ink); }
  .phone.r .cap em { background:var(--cta); }

  .track { position:relative; width:72%; margin:18px auto 0; padding:12px 16px 14px; border-radius:var(--r-md); text-align:left;
    background:rgba(22,24,59,.72); border:1px solid var(--line); }
  .track .head { display:flex; justify-content:space-between; font-size:13px; color:var(--mut); margin-bottom:8px; }
  .track .lane { position:relative; height:40px; }
  .track .wave { width:100%; height:100%; fill:rgba(169,174,208,.35); }
  .track .cut { position:absolute; top:-4px; bottom:-4px; border-radius:6px; border:1.5px solid; }
  .track .cut.t { border-color:var(--teal); background:rgba(106,202,210,.16); }
  .track .cut.c { border-color:var(--crimson); background:rgba(217,38,89,.18); }
  .track .ph { position:absolute; left:38%; top:-10px; bottom:-10px; width:2px; background:#fff; border-radius:1px; }
  .track .ph { animation:scrub 16s linear infinite; }
  @keyframes scrub { from { left:1%; } to { left:99%; } }
  .track .ph::before { content:""; position:absolute; top:-2px; left:-5px; width:12px; height:8px; border-radius:2px; background:#fff; }

  /* ── clientes ── */
  .clients { padding:clamp(64px, 8vw, 104px) 0 24px; }
  .kpi { text-align:center; }
  .kpi strong { display:block; font-size:clamp(52px, 8vw, 112px); font-weight:700; letter-spacing:-.045em; line-height:.95;
    background:linear-gradient(180deg, #fff 30%, rgba(206,210,255,.72)); -webkit-background-clip:text; background-clip:text; color:transparent; }
  .kpi span { display:block; margin-top:14px; color:var(--mut); font-size:clamp(17px, 1.7vw, 22px); letter-spacing:-.01em; text-wrap:balance; }
  /* banda de clientes: dos copias de la lista que corren de derecha a izquierda; al llegar a la mitad vuelve a empezar sin corte */
  .marquee { margin-top:clamp(32px, 4vw, 48px); border-block:1px solid var(--line); overflow:hidden;
    -webkit-mask-image:linear-gradient(90deg, transparent, #000 12%, #000 88%, transparent); mask-image:linear-gradient(90deg, transparent, #000 12%, #000 88%, transparent); }
  .mq-track { display:flex; width:max-content; animation:mq 70s linear infinite; }
  .marquee ul { display:flex; flex:none; list-style:none; }
  .marquee li { display:flex; align-items:center; white-space:nowrap; }
  .marquee li::after { content:""; width:6px; height:6px; border-radius:50%; background:var(--teal); opacity:.55; margin:0 clamp(22px, 2.6vw, 36px); }
  .marquee a { display:block; padding:clamp(18px, 2vw, 24px) 0; font-weight:700; font-size:clamp(17px, 1.7vw, 23px); letter-spacing:-.015em;
    color:rgba(243,244,250,.6); transition:color 200ms var(--ease-out); }
  @keyframes mq { to { transform:translateX(-50%); } }
  @media (hover:hover) and (pointer:fine) {
    .marquee:hover .mq-track { animation-play-state:paused; }
    .marquee a:hover { color:var(--txt); }
  }
  .marquee:focus-within .mq-track { animation-play-state:paused; }
  @media (prefers-reduced-motion: reduce) {
    .marquee { -webkit-mask-image:none; mask-image:none; }
    .mq-track { animation:none; width:auto; }
    .marquee ul { flex-wrap:wrap; justify-content:center; flex:1; padding:8px 0; }
    .marquee ul[aria-hidden] { display:none; }
  }

  section.blk { padding:clamp(80px, 11vw, 140px) 0 0; position:relative; isolation:isolate; }
  section.glow-t::before, section.glow-c::before { content:""; position:absolute; z-index:-1; top:10%; width:60%; height:80%; filter:blur(80px); pointer-events:none; }
  section.glow-t::before { left:-18%; background:radial-gradient(50% 50% at 50% 50%, rgba(106,202,210,.11), transparent 72%); }
  section.glow-c::before { right:-18%; background:radial-gradient(50% 50% at 50% 50%, rgba(217,38,89,.12), transparent 72%); }

  /* ── problema ── */
  .pain { display:grid; grid-template-columns:1.05fr 1fr; gap:clamp(32px, 6vw, 96px); align-items:start; }
  .pain .lede { margin-top:24px; }
  .hours { margin-top:32px; padding:22px 24px; border-radius:var(--r-md); border:1px solid rgba(217,38,89,.45); background:rgba(217,38,89,.08); color:var(--mut); font-size:17px; max-width:34em; }
  .hours b { display:block; color:var(--txt); font-size:clamp(30px, 3.2vw, 42px); letter-spacing:-.03em; line-height:1.05; margin-bottom:6px; }
  .pain ol { list-style:none; border-top:1px solid var(--line-2); }
  .pain li { padding:26px 0; border-bottom:1px solid var(--line-2); display:grid; grid-template-columns:28px 1fr; gap:16px; }
  .pain li i { width:10px; height:10px; margin-top:10px; border-radius:50%; background:var(--crimson); }
  .pain li b { display:block; font-size:clamp(20px, 2vw, 24px); font-weight:700; letter-spacing:-.015em; line-height:1.2; }
  .pain li span { display:block; color:var(--mut); margin-top:6px; }

  /* ── mecanismo ── */
  .how h2 .l { display:block; }
  .steps { display:grid; grid-template-columns:repeat(3, 1fr); gap:clamp(20px, 3vw, 40px); margin-top:44px; }
  .steps { position:relative; padding-top:34px; }
  .rail { position:absolute; left:0; right:0; top:0; height:14px; display:grid; grid-template-columns:repeat(3, 1fr); gap:clamp(20px, 3vw, 40px);
    border-radius:7px; background:rgba(169,174,208,.12); padding:3px; }
  .rail .seg { border-radius:5px; border:1.5px solid; }
  .rail .s1 { border-color:var(--teal); background:rgba(106,202,210,.22); }
  .rail .s2 { border-color:#9a8fe0; background:rgba(154,143,224,.22); }
  .rail .s3 { border-color:var(--crimson); background:rgba(217,38,89,.24); }
  .step { position:relative; }
  .step b { display:block; font-size:20px; font-weight:700; letter-spacing:-.01em; }
  .step span { display:block; color:var(--mut); margin-top:6px; font-size:16px; }
  .month { margin-top:48px; padding:clamp(16px, 2.4vw, 28px); border-radius:var(--r-lg); border:1px solid var(--line);
    background:linear-gradient(160deg, rgba(29,32,80,.85), rgba(22,24,59,.6)); }
  .month header { display:flex; justify-content:space-between; align-items:baseline; gap:16px; flex-wrap:wrap; margin-bottom:16px; }
  .month header b { font-size:22px; font-weight:700; }
  .legend { display:flex; gap:18px; flex-wrap:wrap; color:var(--mut); font-size:14px; }
  .legend span::before { content:""; display:inline-block; width:10px; height:10px; border-radius:3px; margin-right:7px; vertical-align:-1px; background:var(--c); }
  .dow, .grid { display:grid; grid-template-columns:repeat(7, 1fr); gap:clamp(4px, .8vw, 10px); }
  .dow { color:var(--dim); font-size:13px; margin-bottom:8px; text-align:center; }
  .day { position:relative; aspect-ratio:3/4; border-radius:10px; overflow:hidden; background:rgba(13,14,38,.6); border:1px solid var(--line); }
  .day.off { background:transparent; border-style:dashed; opacity:.5; }
  .day .num { position:absolute; z-index:2; top:6px; left:8px; font-size:12px; font-weight:600; color:rgba(243,244,250,.85); }
  .day .thumb { position:absolute; inset:24px 18% 8px; border-radius:6px; background-size:cover; opacity:.92; }
  .day .thumb.t { box-shadow:0 0 0 1.5px var(--teal); }
  .day .thumb.c { box-shadow:0 0 0 1.5px var(--crimson); }
  .day .thumb.doc { opacity:1; border-radius:0; }
  .day .thumb.doc svg { display:block; width:100%; height:100%; overflow:visible; }
  .day .pill { position:absolute; z-index:2; left:50%; bottom:6px; transform:translateX(-50%); font-size:11px; font-weight:700; padding:2px 8px; border-radius:999px; white-space:nowrap; }
  .pill.c { background:var(--cta); color:#fff; }
  .pill.t { background:#fff; color:var(--ink); }
  .note { margin-top:14px; font-size:13px; color:var(--dim); }

  /* ── planes ── */
  .plans-head { display:flex; justify-content:space-between; align-items:end; gap:24px; flex-wrap:wrap; }
  .plans-head p { color:var(--mut); max-width:36ch; }
  .plans { display:grid; grid-template-columns:1fr 1fr 1.12fr; gap:16px; margin-top:44px; align-items:stretch; }
  .plan { display:flex; flex-direction:column; padding:32px; border-radius:var(--r-lg); border:1px solid var(--line); background:rgba(22,24,59,.45); }
  .plan.hot { background:linear-gradient(170deg, #22255C, var(--navy) 60%); border-color:rgba(217,38,89,.75);
    box-shadow:0 24px 40px -24px rgba(0,0,0,.7); }
  .plan h3 { font-size:24px; font-weight:700; min-height:2.04em; }
  .plan .for { color:var(--mut); font-size:15px; margin-top:8px; min-height:3.2em; }
  .plan .price { margin-top:26px; font-size:clamp(40px, 4vw, 54px); font-weight:700; letter-spacing:-.03em; line-height:1; font-variant-numeric:tabular-nums; }
  .plan .per { display:block; color:var(--mut); font-size:15px; font-weight:400; letter-spacing:0; margin-top:10px; }
  .save { margin-top:22px; padding:14px 16px; border-radius:12px; background:rgba(106,202,210,.1); border:1px solid rgba(106,202,210,.35); }
  .save b { display:block; color:var(--teal); font-size:16px; font-weight:700; letter-spacing:-.01em; }
  .save span { display:block; color:var(--mut); font-size:14px; margin-top:3px; min-height:2.9em; font-variant-numeric:tabular-nums; }
  .plan ul { list-style:none; margin:24px 0 32px; display:grid; gap:12px; font-size:16px; }
  .plan li { display:grid; grid-template-columns:20px 1fr; gap:10px; }
  .ic { width:20px; height:20px; color:var(--teal); }
  .plan .btn { margin-top:auto; width:100%; }
  .plan .flag { align-self:flex-start; font-size:13px; font-weight:600; color:#fff; background:var(--cta); padding:4px 10px; border-radius:999px; margin-bottom:14px; }
  .extras { margin-top:22px; color:var(--mut); font-size:15px; }

  /* ── trabajos ── */
  .work { display:grid; grid-template-columns:1fr 1fr; gap:16px; margin-top:44px; }
  .case { border-radius:var(--r-lg); border:1px solid var(--line); background:rgba(22,24,59,.45); overflow:hidden; display:flex; flex-direction:column; }
  .mosaic { display:grid; grid-template-columns:1fr 1fr; gap:3px; background:var(--ink); border-bottom:1px solid var(--line); }
  .mosaic img { width:100%; aspect-ratio:16/9; object-fit:cover; }
  .case .body { padding:24px 26px 28px; }
  .case h3 { font-size:24px; font-weight:700; }
  .case p { color:var(--mut); font-size:16px; margin-top:6px; }
  .case .res { margin-top:18px; padding-top:18px; border-top:1px solid var(--line-2); color:var(--txt); font-size:18px; line-height:1.4; }
  .case .res b { display:block; font-size:clamp(28px, 2.8vw, 36px); line-height:1.1; letter-spacing:-.025em; color:var(--teal); margin-bottom:4px; }
  .case .src { font-size:13px; color:var(--dim); margin-top:8px; }
  .case .ver { display:inline-flex; align-items:center; gap:4px; margin-top:18px; font-size:15px; font-weight:600; }
  .case .ver svg { width:16px; height:16px; transform:rotate(-90deg); color:var(--teal); transition:transform 160ms var(--ease-out); }
  @media (hover:hover) and (pointer:fine) { .case .ver:hover svg { transform:rotate(-90deg) translateY(2px); } }
  .more { margin-top:22px; }
  .more a { color:var(--teal); font-weight:600; text-decoration:underline; text-underline-offset:4px; text-decoration-thickness:1px; }

  /* ── preguntas ── */
  .faq { display:grid; grid-template-columns:1fr 1.4fr; gap:clamp(32px, 6vw, 96px); }
  .faq .lede { margin-top:20px; }
  .qa { border-top:1px solid var(--line-2); }
  .qa details { border-bottom:1px solid var(--line-2); padding:22px 0; }
  .qa summary { list-style:none; display:flex; justify-content:space-between; gap:20px; font-size:19px; font-weight:600; cursor:pointer; }
  .qa summary::-webkit-details-marker { display:none; }
  .qa summary svg { flex:none; width:22px; height:22px; color:var(--mut); transition:transform 200ms var(--ease-out); }
  .qa details[open] summary svg { transform:rotate(180deg); color:var(--teal); }
  .qa p { color:var(--mut); margin-top:10px; max-width:60ch; }

  /* ── cierre ── */
  .final { position:relative; overflow:hidden; text-align:center; padding:clamp(110px, 13vw, 160px) 0 clamp(150px, 16vw, 200px); margin-top:clamp(60px, 8vw, 100px); isolation:isolate; }
  .final::before { content:""; position:absolute; z-index:-2; left:50%; top:30%; width:min(1300px, 140%); height:560px; transform:translateX(-50%);
    background:radial-gradient(50% 50% at 50% 55%, rgba(106,202,210,.36), rgba(140,120,205,.24) 30%, rgba(217,38,89,.18) 54%, rgba(217,38,89,.06) 75%, transparent); filter:blur(70px); }
  .final::after { content:""; position:absolute; z-index:-1; left:50%; top:calc(100% - clamp(120px, 14vw, 170px)); width:max(1500px, 180%); aspect-ratio:1; transform:translateX(-50%); border-radius:50%;
    background:linear-gradient(180deg, #11122e, var(--ink) 22%); border-top:1px solid rgba(255,255,255,.7);
    box-shadow:0 -2px 24px rgba(106,202,210,.5), 0 -14px 100px rgba(217,38,89,.3);
    -webkit-mask-image:linear-gradient(90deg, transparent 12%, #000 38%, #000 62%, transparent 88%); mask-image:linear-gradient(90deg, transparent 12%, #000 38%, #000 62%, transparent 88%); }
  .final h2 { font-size:clamp(34px, 5.6vw, 76px); max-width:18ch; margin:0 auto; }
  .final .lede { margin:22px auto 0; }
  .audit { position:relative; max-width:760px; margin:40px auto 0; padding:28px; text-align:left; display:grid; grid-template-columns:1fr 1fr; gap:18px 18px;
    border-radius:var(--r-lg); background:rgba(22,24,59,.88); border:1px solid var(--line-2); box-shadow:0 30px 40px -28px rgba(0,0,0,.8); }
  .audit label { display:grid; gap:7px; font-size:14px; font-weight:600; color:var(--txt); }
  .audit label em { font-style:normal; font-weight:400; color:var(--dim); }
  .audit .full, .audit .btn, .audit small { grid-column:1 / -1; }
  .audit input, .audit select, .audit textarea { width:100%; min-height:48px; padding:11px 14px; font:400 16px/1.4 var(--sans); color:var(--txt);
    background:var(--ink); border:1px solid var(--line-2); border-radius:10px; transition:border-color 150ms ease; }
  .audit textarea { resize:vertical; min-height:96px; }
  .audit select { appearance:none; padding-right:40px; background-image:linear-gradient(45deg, transparent 50%, var(--mut) 50%), linear-gradient(135deg, var(--mut) 50%, transparent 50%);
    background-position:calc(100% - 20px) 21px, calc(100% - 15px) 21px; background-size:5px 5px; background-repeat:no-repeat; }
  .audit input:focus-visible, .audit select:focus-visible, .audit textarea:focus-visible { outline:none; border-color:var(--teal); box-shadow:0 0 0 3px rgba(106,202,210,.25); }
  .audit ::placeholder { color:var(--dim); }
  .audit .btn { width:100%; margin-top:4px; }
  .audit small { color:var(--dim); font-size:13px; text-align:center; }
  .audit .hp { position:absolute; left:-9999px; width:1px; height:1px; opacity:0; }
  .final .guide { margin-top:22px; color:var(--mut); }
  .final .guide a { color:var(--teal); text-decoration:underline; text-underline-offset:4px; }
  footer { border-top:1px solid var(--line); padding:30px 0 40px; color:var(--dim); font-size:14px; }
  footer .wrap { display:flex; justify-content:space-between; align-items:center; gap:20px; flex-wrap:wrap; }
  footer nav { height:auto; }
  footer ul { display:flex; gap:24px; list-style:none; }

  @media (prefers-reduced-motion: reduce) { .btn, .qa summary svg { transition:none; } .track .ph { animation:none; left:38%; } }

  @media (max-width: 760px) {
    body { font-size:16px; }
    nav { height:68px; }
    nav ul { display:none; }
    .logo { --h:24px; }
    nav .btn { min-height:40px; padding:0 16px; font-size:14px; }
    .hero { padding-top:40px; }
    .stage { margin-top:44px; }
    .player { width:100%; border-radius:16px; }
    .player .meta { left:6%; bottom:20%; }
    .player .bar { left:6%; right:6%; }
    .player .play { width:16%; }
    .phones { display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-top:16px; }
    .phone, .phone.l, .phone.r { position:relative; width:100%; left:auto; right:auto; top:auto; border-radius:18px; }
    .phone.l { transform:rotate(-2deg); } .phone.r { transform:rotate(2deg); margin-top:18px; }
    .phone .cap { font-size:15px; }
    .track { width:100%; }
    .pain, .faq { grid-template-columns:1fr; }
    .how h2 { font-size:clamp(26px, 7.6vw, 32px); }
    .steps { grid-template-columns:1fr; gap:22px; padding:0 0 0 26px; }
    .rail { right:auto; top:0; bottom:0; width:12px; height:auto; grid-template-columns:1fr; grid-template-rows:repeat(3, 1fr); gap:10px; }
    .day { border-radius:7px; }
    .day .thumb { inset:20px 14% 6px; border-radius:4px; }
    .day .num { font-size:11px; top:3px; left:5px; }
    .day .pill { font-size:0; padding:0; width:64%; height:4px; bottom:4px; }
    .player .meta { bottom:15%; }
    .player .play { top:36%; }
    .plans { grid-template-columns:1fr; }
    .plan { padding:26px; }
    .work { grid-template-columns:1fr; }
    .plan .for, .plan h3, .save span { min-height:0; }
    .final::after { width:900px; top:calc(100% - 110px); }
    .audit { grid-template-columns:1fr; padding:20px; }
  }

  /* ── movimiento: el de pabloaguilar.art (curva ease-out de Emil, 0,97 al presionar) ── */
  html.lenis, html.lenis body { height:auto; }
  .lenis.lenis-smooth { scroll-behavior:auto !important; }
  .lenis.lenis-smooth [data-lenis-prevent] { overscroll-behavior:contain; }
  .lenis.lenis-stopped { overflow:hidden; }
  @keyframes rv { from { opacity:0; transform:translateY(24px); filter:blur(10px); } }
  @keyframes rv-nb { from { opacity:0; transform:translateY(24px); } }
  .rv { animation:rv 650ms var(--ease-out) both; animation-delay:calc(var(--i, 0) * 120ms); }
  .rv.nb { animation-name:rv-nb; }
  html.js .sr { opacity:0; transform:translateY(16px); }
  html.js .sr.in { opacity:1; transform:none; transition:opacity 500ms var(--ease-out), transform 500ms var(--ease-out); transition-delay:calc(var(--i, 0) * 60ms); }
  .phead, .ghead { overflow-x:hidden; overflow-x:clip; }
  header.wrap { z-index:60; }
  nav { position:relative; z-index:2; }
  .nav-r { display:flex; align-items:center; gap:10px; }
  nav ul a { position:relative; transition:color 200ms var(--ease-out); }
  nav ul a::after { content:""; position:absolute; left:0; right:0; bottom:-8px; height:2px; border-radius:1px; background:var(--teal);
    transform:scaleX(0); transform-origin:left; transition:transform 200ms var(--ease-out); }
  footer ul a { position:relative; transition:color 200ms var(--ease-out); }
  footer ul a::after { content:""; position:absolute; left:0; right:0; bottom:-3px; height:1px; background:currentColor; opacity:.6;
    transform:scaleX(0); transform-origin:left; transition:transform 200ms var(--ease-out); }
  .btn .ar { width:18px; height:18px; margin-left:8px; transition:transform 300ms cubic-bezier(.34, 1.56, .64, 1); }
  @media (hover:hover) and (pointer:fine) {
    nav ul a:hover { color:var(--txt); } nav ul a:hover::after { transform:scaleX(1); }
    footer ul a:hover { color:var(--txt); } footer ul a:hover::after { transform:scaleX(1); }
    .btn:hover .ar { transform:translate(3px, -3px); }
  }
  .final .cta { display:flex; justify-content:center; margin-top:34px; }
  .final h1 { font-size:clamp(34px, 5.6vw, 76px); font-weight:700; max-width:18ch; margin:0 auto; }
  .final.solo { margin-top:0; padding-top:clamp(48px, 7vw, 88px); }
  .mbtn { display:none; position:relative; width:44px; height:44px; padding:0; border-radius:50%; border:1px solid rgba(255,255,255,.15);
    background:none; cursor:pointer; transition:border-color 200ms var(--ease-out), scale 160ms var(--ease-out); }
  .mbtn i { position:absolute; left:13px; width:16px; height:1.5px; border-radius:1px; background:var(--txt); transition:transform 200ms var(--ease-out); }
  .mbtn i:first-child { top:18px; } .mbtn i:last-child { top:24px; }
  .mbtn[aria-expanded="true"] i:first-child { transform:translateY(3px) rotate(45deg); }
  .mbtn[aria-expanded="true"] i:last-child { transform:translateY(-3px) rotate(-45deg); }
  .mbtn:active { scale:.97; }
  .mbtn:focus-visible { outline:2px solid var(--teal); outline-offset:2px; }
  @media (hover:hover) and (pointer:fine) { .mbtn:hover { border-color:rgba(255,255,255,.4); } }
  .menu { position:fixed; inset:0; z-index:1; padding:100px var(--gut) 48px; overflow-y:auto; overscroll-behavior:contain;
    background:rgba(13,14,38,.98); -webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px); }
  .menu[hidden] { display:none; }
  .menu.abre { animation:m-in 240ms var(--ease-out); }
  .menu.sale { animation:m-out 160ms var(--ease-out) forwards; }
  @keyframes m-in { from { opacity:0; scale:.99; } }
  @keyframes m-out { to { opacity:0; scale:.99; } }
  .menu ul { list-style:none; }
  .menu li { animation:m-row 260ms var(--ease-out) both; animation-delay:calc(min(var(--i), 7) * 35ms); }
  @keyframes m-row { from { opacity:0; translate:0 12px; } }
  .menu li a:not(.btn) { display:block; padding:14px 0; font-size:30px; font-weight:700; letter-spacing:-.025em; color:var(--txt); border-bottom:1px solid var(--line); }
  .menu li a.on { color:var(--teal); }
  .menu .btn { width:100%; margin-top:28px; }
  @media (max-width: 760px) { .mbtn { display:block; } }
  /* encabezado en celulares angostos: el botón en una sola línea; por debajo de 360 px queda solo en el menú */
  nav .btn { white-space:nowrap; } .mbtn { flex:none; }
  @media (max-width: 400px) { nav { gap:12px; } .logo { --h:22px; } nav .btn { padding:0 12px; } }
  @media (max-width: 359px) { nav .btn { display:none; } }
  @media (prefers-reduced-motion: reduce) {
    .rv, .menu.abre, .menu.sale, .menu li { animation:none; }
    html.js .sr { transform:none; }
    .btn .ar, nav ul a::after, footer ul a::after, .mbtn i { transition:none; }
  }

  nav ul a.on { color:var(--txt); } nav ul a.on::after { transform:scaleX(1); }
  .phead { padding:64px 0 8px; }
  .phead h1 { font-size:clamp(44px, 7vw, 96px); font-weight:700; letter-spacing:-.04em; line-height:.98; }
  .phead .lede { margin-top:20px; }
  .phead .lede strong { color:var(--txt); }
  .mosaic-p { display:grid; grid-template-columns:repeat(4, 1fr); gap:clamp(12px, 1.6vw, 20px); margin-top:56px; align-items:start; }
  .mosaic-p.m2 { display:none; grid-template-columns:repeat(2, 1fr); }
  .col { display:grid; gap:clamp(12px, 1.6vw, 20px); }
  .c1 { margin-top:96px; } .c2 { margin-top:40px; } .c3 { margin-top:128px; }
  .tile { position:relative; display:block; aspect-ratio:var(--ar); border-radius:12px; overflow:hidden; background:var(--navy); border:1px solid var(--line); }
  .tile .im { position:absolute; left:0; right:0; top:0; height:100%; overflow:hidden; border-radius:11px; background:#0a0b1c;
    transition:height 300ms var(--ease-out); }
  .tile .im img, .tile .im video { width:100%; height:100%; object-fit:cover; display:block; transition:transform 400ms var(--ease-out); }
  .tile .cap { position:absolute; left:0; right:0; bottom:0; height:42%; padding:14px 16px; display:flex; flex-direction:column; justify-content:flex-end; gap:3px;
    opacity:0; transition:opacity 200ms ease; }
  .tile .cap b { font-size:17px; font-weight:700; letter-spacing:-.015em; line-height:1.15; }
  .tile .cap .y { color:var(--dim); font-size:14px; }
  .tile .cap .p { color:var(--mut); font-size:14px; line-height:1.3; }
  .tile .cap .r { color:var(--teal); font-size:14px; font-weight:600; line-height:1.3; }
  .tile.h .cap { height:66%; padding:10px 14px; gap:1px; }
  .tile.h .cap b { font-size:15px; } .tile.h .cap .y, .tile.h .cap .p, .tile.h .cap .r { font-size:13px; }
  .tile.hov .im { height:58%; } .tile.h.hov .im { height:34%; } .tile.hov .cap { opacity:1; }
  @media (hover:hover) and (pointer:fine) {
    .tile:hover .im, .tile:focus-visible .im { height:58%; }
    .tile.h:hover .im, .tile.h:focus-visible .im { height:34%; }
    .tile:hover .cap, .tile:focus-visible .cap { opacity:1; }
    .tile:hover .im img, .tile:hover .im video { transform:scale(1.04); }
  }
  @media (hover:none) {
    .tile { aspect-ratio:auto; background:none; border:0; border-radius:0; overflow:visible; }
    .tile .im { position:relative; height:auto; aspect-ratio:var(--ar); border:1px solid var(--line); }
    .tile .cap { position:static; height:auto; opacity:1; padding:10px 2px 0; }
    .tile.hov .im, .tile.h.hov .im { height:auto; }
    .tile.h .cap { height:auto; padding:10px 2px 0; }
  }
  @media (prefers-reduced-motion: reduce) { .tile .im, .tile .cap, .tile .im img, .tile .im video { transition:none; } }
  @media (max-width: 760px) {
    .mosaic-p.m4 { display:none; }
    .mosaic-p.m2 { display:grid; margin-top:36px; }
    .mosaic-p.m2 .c1 { margin-top:40px; }
  }

  .ghead { padding:48px 0 0; }
  .back { display:inline-flex; align-items:center; gap:6px; color:var(--mut); font-size:15px; }
  .back svg { width:18px; height:18px; transform:rotate(90deg); }
  .ghead h1 { font-size:clamp(40px, 6vw, 80px); font-weight:700; letter-spacing:-.04em; line-height:1; margin-top:18px; }
  .ghead .lede { margin-top:14px; max-width:40em; }
  .ghead .res { margin-top:10px; color:var(--teal); font-weight:600; font-size:17px; }
  .gm { display:grid; grid-template-columns:repeat(var(--c), minmax(0, 1fr)); gap:clamp(12px, 1.6vw, 20px); align-items:start;
    margin-top:48px; max-width:var(--mw, none); }
  .gm.gmb { display:none; }
  .gcol { display:grid; gap:clamp(12px, 1.6vw, 20px); }
  .gm.st .gcol:nth-child(2) { margin-top:96px; } .gm.st .gcol:nth-child(3) { margin-top:40px; } .gm.st .gcol:nth-child(4) { margin-top:128px; }
  .gt { position:relative; display:block; width:100%; aspect-ratio:var(--ar); padding:0; border:1px solid var(--line); border-radius:12px;
    overflow:hidden; background:var(--navy); color:#fff; font:inherit; cursor:pointer; transition:scale 160ms var(--ease-out); }
  .gt.zoom { cursor:zoom-in; }
  .gt .im { position:absolute; inset:0; overflow:hidden; border-radius:11px; background:#0a0b1c; }
  .gt .im img, .gt .im video { width:100%; height:100%; object-fit:cover; display:block; transition:transform 400ms var(--ease-out); }
  .gt .dur { position:absolute; left:10px; bottom:10px; padding:3px 9px; border-radius:999px; font-size:12px; font-weight:600;
    font-variant-numeric:tabular-nums; background:rgba(13,14,38,.72); }
  .gt .pl { position:absolute; left:50%; top:50%; width:56px; aspect-ratio:1; display:grid; place-items:center; border-radius:50%;
    background:rgba(13,14,38,.55); border:1px solid rgba(255,255,255,.4); translate:-50% -50%; scale:.9; opacity:0;
    transition:opacity 200ms ease, scale 200ms var(--ease-out), background-color 160ms ease, border-color 160ms ease; }
  .gt .pl svg { width:24px; height:24px; margin-left:3px; }
  .gt.yt .pl { opacity:1; scale:1; }
  .gt:active { scale:.985; }
  .gt:focus-visible { outline:2px solid var(--teal); outline-offset:3px; }
  @media (hover:hover) and (pointer:fine) {
    .gt:hover .im img, .gt:hover .im video { transform:scale(1.04); }
    .gt:hover .pl { opacity:1; scale:1; background:var(--cta); border-color:var(--cta); }
  }
  @media (hover:none) { .gt .pl { opacity:1; scale:.8; } }
  @media (max-width: 760px) {
    .gm.gd { display:none; }
    .gm.gmb { display:grid; margin-top:36px; }
    .gm.gmb.st .gcol:nth-child(2) { margin-top:40px; }
  }
  .lb { position:fixed; inset:0; width:100%; height:100%; max-width:none; max-height:none; margin:0; padding:0; border:0;
    background:rgba(8,9,24,.94); color:var(--txt); overscroll-behavior:contain; }
  .lb::backdrop { background:transparent; }
  .lb[open] { display:grid; place-items:center; animation:lb-in 200ms ease; }
  @keyframes lb-in { from { opacity:0; } }
  .lb-in { --hmax:calc(100dvh - 150px); width:min(92vw, 1400px, calc(var(--hmax) * var(--r))); animation:lb-up 260ms var(--ease-out); }
  @keyframes lb-up { from { opacity:0; scale:.96; } }
  .lb.sale { animation:lb-out 160ms var(--ease-out) forwards; }
  .lb.sale .lb-in { animation:lb-dn 160ms var(--ease-out) forwards; }
  @keyframes lb-out { to { opacity:0; } }
  @keyframes lb-dn { to { opacity:0; scale:.99; } }
  .lb-media > * { display:block; width:100%; height:auto; aspect-ratio:var(--ar); border:0; border-radius:12px; background:#000; object-fit:contain; }
  .lb-media video { cursor:pointer; }
  .lb-cap { margin-top:12px; font-size:15px; color:var(--mut); }
  .lb-bar { display:flex; align-items:center; gap:12px; margin-top:12px; }
  .lb-bar[hidden], .lb-cap[hidden], .lb [hidden] { display:none; }
  .lb-b { flex:none; width:40px; height:40px; display:grid; place-items:center; padding:0; border-radius:50%; cursor:pointer; color:#fff;
    background:rgba(255,255,255,.08); border:1px solid var(--line-2); transition:scale 160ms var(--ease-out), background-color 160ms ease; }
  .lb-b svg { width:20px; height:20px; }
  .lb-b:active { scale:.97; }
  .lb-b:focus-visible { outline:2px solid var(--teal); outline-offset:2px; }
  @media (hover:hover) and (pointer:fine) { .lb-b:hover { background:rgba(255,255,255,.16); } }
  .lb-t { flex:none; min-width:88px; font-size:13px; color:var(--mut); font-variant-numeric:tabular-nums; }
  .lb-p { flex:1; min-width:0; height:4px; margin:0; appearance:none; -webkit-appearance:none; border-radius:2px; cursor:pointer;
    background:linear-gradient(var(--teal), var(--teal)) 0 0 / var(--p, 0%) 100% no-repeat, rgba(255,255,255,.2); }
  .lb-p::-webkit-slider-thumb { -webkit-appearance:none; width:14px; height:14px; border-radius:50%; background:#fff; border:0; }
  .lb-p::-moz-range-thumb { width:14px; height:14px; border-radius:50%; background:#fff; border:0; }
  .lb-p:focus-visible { outline:2px solid var(--teal); outline-offset:6px; }
  .lb-x { position:absolute; top:16px; right:16px; }
  .lb-prev, .lb-next { position:absolute; top:50%; translate:0 -50%; }
  .lb-prev { left:16px; } .lb-next { right:16px; }
  .lb-prev svg { transform:rotate(90deg); } .lb-next svg { transform:rotate(-90deg); }
  .lb-n { position:absolute; top:26px; left:24px; font-size:13px; color:var(--mut); font-variant-numeric:tabular-nums; }
  @media (max-width: 760px) {
    .lb-in { --hmax:calc(100dvh - 210px); }
    .lb-prev, .lb-next { top:auto; bottom:20px; translate:none; }
    .lb-prev { left:calc(50% - 52px); } .lb-next { right:calc(50% - 52px); }
  }
  @media (prefers-reduced-motion: reduce) {
    .lb[open], .lb-in, .lb.sale, .lb.sale .lb-in { animation:none; }
    .gt, .gt .pl, .gt .im img, .gt .im video, .lb-b { transition:none; }
  }

  /* auditoría de Vercel (Web Interface Guidelines) */
  html { color-scheme:dark; }
  a, button, summary, label, input, select, textarea { touch-action:manipulation; -webkit-tap-highlight-color:transparent; }
  .skip { position:absolute; left:16px; top:-60px; z-index:100; padding:10px 16px; border-radius:10px; background:var(--txt); color:var(--ink); font-weight:600; }
  .skip:focus { top:16px; }
  .audit button[disabled] { opacity:.7; cursor:progress; }