/* ===== Página de presentación ===== */
body.landing{background:
  radial-gradient(760px 560px at 8% -6%,rgba(90,200,250,.5),transparent 60%),
  radial-gradient(700px 600px at 100% 4%,rgba(0,113,227,.3),transparent 60%),
  radial-gradient(800px 640px at 55% 110%,rgba(175,130,255,.26),transparent 60%),var(--bg);background-attachment:fixed}
@media not all{body.landing{background:
  radial-gradient(760px 560px at 8% -6%,rgba(10,132,255,.36),transparent 60%),
  radial-gradient(700px 600px at 100% 4%,rgba(94,92,230,.32),transparent 60%),
  radial-gradient(800px 640px at 55% 110%,rgba(90,200,250,.2),transparent 60%),#000;background-attachment:fixed}}
.landing main>*{animation:none}
.l-top{position:sticky;top:0;z-index:30;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px max(18px,calc((100% - 1080px)/2));padding-top:calc(10px + env(safe-area-inset-top));background:var(--glass);backdrop-filter:saturate(180%) blur(22px);-webkit-backdrop-filter:saturate(180%) blur(22px);border-bottom:.5px solid var(--sep)}
.l-logo img{display:block;height:30px;width:auto}
.l-login{min-height:40px;padding:9px 20px;font-size:15px}
.l-main{max-width:1080px;margin:0 auto;padding:0 20px 40px}
.l-hero{display:grid;grid-template-columns:1.05fr .95fr;gap:36px;align-items:center;padding:64px 0 40px}
.l-pill{display:inline-flex;align-items:center;gap:8px;padding:7px 14px 7px 10px;border-radius:99px;background:linear-gradient(135deg,rgba(0,113,227,.12),rgba(124,77,255,.14));color:var(--azul);font-size:14px;font-weight:600;margin-bottom:20px;animation:subir .7s var(--ease) both}
.l-pill svg{width:16px;height:16px}
.landing h1{font-size:clamp(38px,6.4vw,64px);line-height:1.04;letter-spacing:-.05em;margin:0 0 18px;display:block;animation:subir .8s var(--ease) .08s both}
.l-grad{background:linear-gradient(120deg,#0071e3,#7c4dff 60%,#bf5af2);-webkit-background-clip:text;background-clip:text;color:transparent}
.l-texto>p{font-size:clamp(17px,2.2vw,21px);color:var(--mut);line-height:1.5;max-width:30em;margin:0 0 28px;animation:subir .8s var(--ease) .16s both}
.l-cta{animation:subir .8s var(--ease) .24s both}
.btn.l-grande{min-height:56px;padding:15px 34px;font-size:18px;font-weight:600;box-shadow:0 12px 32px rgba(0,113,227,.38)}
.l-texto .l-nota{font-size:14px;margin:16px 0 0;animation:subir .8s var(--ease) .3s both}

.l-visual{position:relative;animation:subir 1s var(--ease) .2s both}
.l-cal{background:var(--card);border-radius:28px;padding:20px 18px 16px;box-shadow:0 30px 80px rgba(0,60,150,.2),0 0 0 .5px var(--sep);transform:rotate(1.2deg)}
.l-cal-cab{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px}
.l-cal-cab b{font-size:20px;letter-spacing:-.03em}
.l-cal-cab span{display:flex;gap:5px}.l-cal-cab i{width:10px;height:10px;border-radius:50%;background:var(--col)}
.l-sem,.l-grid{display:grid;grid-template-columns:repeat(7,1fr)}
.l-sem span{text-align:center;font-size:11px;font-weight:700;color:var(--mut);padding-bottom:6px}
.l-grid{gap:2px}
.lc-d{aspect-ratio:1/1.05;display:flex;flex-direction:column;align-items:center;gap:3px;padding-top:6px;border-radius:12px;font-size:14px}
.lc-d b{font-weight:500;width:26px;height:26px;display:flex;align-items:center;justify-content:center;border-radius:50%;line-height:1}
.lc-d.sel{background:var(--azul-cl)}.lc-d.sel b{background:var(--txt);color:var(--bg);font-weight:700}
.lc-d i{display:flex;gap:3px;min-height:6px}
.lc-d u{width:6px;height:6px;border-radius:50%;background:var(--col);animation:pop .5s var(--ease) both;animation-delay:calc(.5s + var(--k) * .11s)}
.l-flota{position:absolute;display:flex;align-items:center;gap:12px;padding:12px 16px;border-radius:18px;background:var(--glass);backdrop-filter:saturate(180%) blur(20px);-webkit-backdrop-filter:saturate(180%) blur(20px);box-shadow:0 14px 40px rgba(0,0,0,.18),0 0 0 .5px var(--sep)}
.l-flota b{display:block;font-size:15px;letter-spacing:-.02em}.l-flota small{color:var(--mut);font-size:13px}
.l-flota svg{width:26px;height:26px;color:#7c4dff;flex:none}
.l-bola{width:12px;height:12px;border-radius:50%;background:var(--col);flex:none}
.l-flota.a{left:-18px;bottom:46px;animation:flota 6s ease-in-out infinite}
.l-flota.b{right:-10px;top:-18px;animation:flota 7s ease-in-out -2s infinite}
@keyframes flota{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}

.l-sec{padding:56px 0 20px}
.l-sec h2{font-size:clamp(28px,4.4vw,42px);letter-spacing:-.045em;line-height:1.1;text-align:center;max-width:16em;margin:0 auto 36px}
.l-cards{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.l-card{background:var(--glass);backdrop-filter:saturate(180%) blur(20px);-webkit-backdrop-filter:saturate(180%) blur(20px);border-radius:26px;padding:26px 22px;box-shadow:var(--sombra),0 0 0 .5px var(--sep);transition:transform .35s var(--ease),box-shadow .35s}
.l-card:hover{transform:translateY(-6px);box-shadow:0 22px 50px rgba(0,60,150,.16),0 0 0 .5px var(--sep)}
.l-ico{width:48px;height:48px;border-radius:15px;display:flex;align-items:center;justify-content:center;color:#fff;background:linear-gradient(145deg,#5ac8fa,#0071e3);margin-bottom:16px;box-shadow:0 8px 20px rgba(0,113,227,.35)}
.l-ico svg{width:24px;height:24px}
.l-card:nth-child(2) .l-ico{background:linear-gradient(145deg,#a78bfa,#7c4dff)}
.l-card:nth-child(3) .l-ico{background:linear-gradient(145deg,#34d399,#30b863)}
.l-card:nth-child(4) .l-ico{background:linear-gradient(145deg,#ffb340,#ff9f0a)}
.l-card h3{font-size:19px;margin:0 0 8px;letter-spacing:-.03em;line-height:1.2}
.l-card p{margin:0;color:var(--mut);font-size:15.5px;line-height:1.5}
.l-fin{text-align:center;margin:56px 0 10px;padding:56px 24px;border-radius:34px;background:linear-gradient(135deg,#0a4fc7,#0071e3 45%,#7c4dff);color:#fff;box-shadow:0 30px 70px rgba(0,80,200,.35)}
.l-fin h2{font-size:clamp(28px,4.4vw,42px);letter-spacing:-.045em;margin:0 0 10px}
.l-fin p{margin:0 0 26px;opacity:.9;font-size:18px}
.l-fin .btn{background:#fff;color:#0058c4;box-shadow:0 12px 30px rgba(0,0,0,.25)}
.l-fin .btn:hover{background:#f2f6ff}
.l-pie{text-align:center;color:var(--mut);font-size:14px;padding:20px 20px calc(30px + env(safe-area-inset-bottom))}

.rev{opacity:0;transform:translateY(26px);transition:opacity .8s var(--ease),transform .8s var(--ease);transition-delay:calc(var(--k,0) * 90ms)}
.rev.in{opacity:1;transform:none}

@media(max-width:900px){.l-cards{grid-template-columns:repeat(2,1fr)}}
@media(max-width:820px){
  .l-hero{grid-template-columns:1fr;padding:36px 0 24px;gap:34px}
  .l-visual{max-width:440px;margin:0 auto;width:100%}
  .l-flota.a{left:-6px}.l-flota.b{right:-4px}
}
@media(max-width:520px){.l-cards{grid-template-columns:1fr}.l-main{padding:0 16px 30px}.l-fin{padding:42px 20px;border-radius:28px}.btn.l-grande{width:100%}.l-cta{display:block}}
@media(prefers-reduced-motion:reduce){.rev{opacity:1;transform:none}.l-flota{animation:none!important}}
body.landing{overflow-x:clip}

/* ===== Arreglos de ajuste ===== */
.l-sem,.l-grid{grid-template-columns:repeat(7,minmax(0,1fr))}
.lc-d{min-width:0;overflow:hidden}
.l-cal{max-width:100%;overflow:hidden}
.l-visual{padding:14px 6px 0}
.l-flota.b{right:2px;top:0}
.l-flota.a{left:2px}
/* barra superior: transparente arriba, cristal al hacer scroll */
.l-top{background:transparent;backdrop-filter:none;-webkit-backdrop-filter:none;border-bottom-color:transparent;transition:background .3s,border-color .3s,backdrop-filter .3s}
.l-top.on{background:var(--glass);backdrop-filter:saturate(180%) blur(22px);-webkit-backdrop-filter:saturate(180%) blur(22px);border-bottom-color:var(--sep)}
