/* ═══════════════════════════════════════════════════════════
   AI-NNOVA · site.css
   Sistema visual: sala de control. Fondo profundo, azul señal
   para acción, verde solo para estados de cliente/llamada.
   ═══════════════════════════════════════════════════════════ */

:root{
  --ink:#05080F;
  --base:#070C16;
  --surface:#0A1120;
  --surface2:#0E172A;
  --line:rgba(140,170,220,.13);
  --line-strong:rgba(140,170,220,.22);
  --brand:#3D7BFF;
  --brand-soft:#8FB4FF;
  --brand-deep:#1E3F8F;
  --signal:#2FE3A0;
  --alert:#FFB86B;
  --fog:#8695AE;
  --paper:#E9EEF9;
  --shadow-soft:0 24px 60px -22px rgba(0,0,0,.85);
  --ease:cubic-bezier(.16,.84,.44,1);
}

*{ -webkit-tap-highlight-color:transparent; }

html{ scroll-behavior:smooth; scroll-padding-top:92px; }
body{ background:var(--ink); overflow-x:hidden; overflow-wrap:break-word; }

/* Los hijos de una retícula no deben poder empujar el ancho de la
   página: sin esto, un texto con nowrap ensancha la columna. */
.grid > *{ min-width:0; }
img, svg{ max-width:100%; }

::-webkit-scrollbar{ width:11px; }
::-webkit-scrollbar-track{ background:var(--ink); }
::-webkit-scrollbar-thumb{ background:#1a2540; border-radius:99px; border:3px solid var(--ink); }
::-webkit-scrollbar-thumb:hover{ background:#26355c; }

:focus-visible{
  outline:2px solid var(--brand-soft);
  outline-offset:3px;
  border-radius:6px;
}

.skip-link{
  position:absolute; left:-9999px; top:0; z-index:100;
  background:var(--brand); color:#fff; padding:.7rem 1.1rem; border-radius:0 0 10px 0;
  font-size:14px; font-weight:600;
}
.skip-link:focus{ left:0; }

/* ─── Tipografía base ─────────────────────────────────────── */
.font-800{ font-weight:800; }

.section{ position:relative; padding:5.5rem 0; overflow:hidden; }
@media (min-width:1024px){ .section{ padding:7.5rem 0; } }
.section--alt{ background:linear-gradient(180deg, rgba(10,17,32,0) 0%, rgba(10,17,32,.75) 18%, rgba(10,17,32,.75) 82%, rgba(10,17,32,0) 100%); }

.section-title{
  font-family:'Sora',system-ui,sans-serif;
  font-weight:700;
  font-size:clamp(1.85rem, 4.2vw, 2.75rem);
  line-height:1.1;
  letter-spacing:-.032em;
  margin-top:1rem;
  color:var(--paper);
}

.text-gradient{
  background:linear-gradient(96deg,#8FB4FF 0%,#3D7BFF 45%,#2FE3A0 130%);
  -webkit-background-clip:text; background-clip:text;
  -webkit-text-fill-color:transparent; color:transparent;
}

.eyebrow{
  display:inline-flex; align-items:center; gap:.6rem;
  font-family:'JetBrains Mono',monospace;
  font-size:11.5px; letter-spacing:.09em; text-transform:uppercase;
  color:var(--brand-soft);
  background:rgba(61,123,255,.08);
  border:1px solid rgba(61,123,255,.22);
  padding:.45rem .85rem; border-radius:99px;
  max-width:100%; line-height:1.5;
}
.eyebrow-plain{
  font-family:'JetBrains Mono',monospace;
  font-size:11.5px; letter-spacing:.1em; text-transform:uppercase;
  color:var(--brand-soft);
}

.text-link{ color:var(--brand-soft); text-decoration:underline; text-underline-offset:3px; text-decoration-thickness:1px; transition:color .2s; }
.text-link:hover{ color:#fff; }

/* ─── Fondos y halos ──────────────────────────────────────── */
.grid-backdrop{
  position:absolute; inset:0; pointer-events:none;
  background-image:
    linear-gradient(rgba(140,170,220,.045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(140,170,220,.045) 1px, transparent 1px);
  background-size:64px 64px;
  mask-image:radial-gradient(ellipse 90% 60% at 50% 0%, #000 20%, transparent 78%);
  -webkit-mask-image:radial-gradient(ellipse 90% 60% at 50% 0%, #000 20%, transparent 78%);
}
.halo{ position:absolute; pointer-events:none; border-radius:50%; filter:blur(110px); opacity:.5; }
.halo--hero{ width:820px; height:620px; top:-260px; right:-180px; background:radial-gradient(circle, rgba(61,123,255,.34) 0%, transparent 68%); }
.halo--left{ width:640px; height:640px; top:8%; left:-320px; background:radial-gradient(circle, rgba(30,63,143,.42) 0%, transparent 70%); }
.halo--right{ width:640px; height:640px; bottom:-10%; right:-300px; background:radial-gradient(circle, rgba(47,227,160,.13) 0%, transparent 70%); }
.halo--center{ width:900px; height:520px; top:50%; left:50%; transform:translate(-50%,-50%); background:radial-gradient(ellipse, rgba(61,123,255,.22) 0%, transparent 70%); }
.halo--form{ width:700px; height:700px; top:-15%; right:-280px; background:radial-gradient(circle, rgba(61,123,255,.2) 0%, transparent 70%); }

/* ─── Header ──────────────────────────────────────────────── */
.header-shell{
  background:transparent;
  transition:background .35s var(--ease), border-color .35s var(--ease), backdrop-filter .35s;
  border-bottom:1px solid transparent;
}
#site-header.is-stuck .header-shell{
  background:rgba(7,12,22,.82);
  backdrop-filter:blur(18px) saturate(160%);
  -webkit-backdrop-filter:blur(18px) saturate(160%);
  border-bottom-color:var(--line);
}

.nav-link{
  position:relative; padding:.55rem .8rem; border-radius:8px;
  font-size:14.5px; color:var(--fog); transition:color .2s, background .2s;
}
.nav-link:hover{ color:var(--paper); background:rgba(255,255,255,.045); }
.nav-link.is-active{ color:var(--paper); }
.nav-link.is-active::after{
  content:''; position:absolute; left:.8rem; right:.8rem; bottom:.24rem; height:1.5px;
  background:linear-gradient(90deg,var(--brand),var(--signal)); border-radius:2px;
}

.mobile-link{
  padding:.85rem .25rem; font-size:16px; color:var(--paper);
  border-bottom:1px solid rgba(255,255,255,.05);
}
.mobile-link:last-of-type{ border-bottom:0; }

/* ─── Botones ─────────────────────────────────────────────── */
.btn-primary,.btn-ghost,.btn-outline,.btn-whatsapp{
  display:inline-flex; align-items:center; gap:.55rem;
  padding:.72rem 1.25rem; border-radius:11px;
  font-size:14.5px; font-weight:600; line-height:1;
  transition:transform .2s var(--ease), box-shadow .25s var(--ease), background .2s, border-color .2s, color .2s;
  white-space:nowrap;
}
.btn-sm{ padding:.6rem 1rem; font-size:13.5px; }
.btn-lg{ padding:.95rem 1.6rem; font-size:15.5px; border-radius:13px; }

.btn-primary{
  background:linear-gradient(180deg,#4d87ff,#2f6bf0);
  color:#fff;
  box-shadow:0 1px 0 rgba(255,255,255,.22) inset, 0 12px 30px -12px rgba(61,123,255,.85);
}
.btn-primary:hover{ transform:translateY(-1.5px); box-shadow:0 1px 0 rgba(255,255,255,.25) inset, 0 18px 38px -12px rgba(61,123,255,.95); }
.btn-primary:active{ transform:translateY(0); }

.btn-ghost{
  background:rgba(255,255,255,.045);
  border:1px solid var(--line-strong);
  color:var(--paper);
}
.btn-ghost:hover{ background:rgba(255,255,255,.085); border-color:rgba(140,170,220,.35); }

.btn-outline{
  background:transparent; border:1px solid var(--line-strong); color:var(--paper);
}
.btn-outline:hover{ border-color:var(--brand); background:rgba(61,123,255,.09); }

.btn-whatsapp{
  background:rgba(47,227,160,.1);
  border:1px solid rgba(47,227,160,.32);
  color:var(--signal);
}
.btn-whatsapp:hover{ background:rgba(47,227,160,.17); transform:translateY(-1.5px); }

/* ─── Micro elementos ─────────────────────────────────────── */
.pulse-dot{
  width:7px; height:7px; border-radius:50%; background:var(--brand);
  box-shadow:0 0 0 0 rgba(61,123,255,.55); animation:pulse 2.4s infinite;
}
.pulse-dot--green{ background:var(--signal); box-shadow:0 0 0 0 rgba(47,227,160,.55); animation:pulse-green 2.4s infinite; }
@keyframes pulse{ 70%{ box-shadow:0 0 0 9px rgba(61,123,255,0);} 100%{ box-shadow:0 0 0 0 rgba(61,123,255,0);} }
@keyframes pulse-green{ 70%{ box-shadow:0 0 0 9px rgba(47,227,160,0);} 100%{ box-shadow:0 0 0 0 rgba(47,227,160,0);} }

.check{
  position:relative; width:16px; height:16px; border-radius:50%;
  background:rgba(47,227,160,.14); border:1px solid rgba(47,227,160,.4); flex-shrink:0;
}
.check::after{
  content:''; position:absolute; left:4.6px; top:3.2px; width:4px; height:7px;
  border:solid var(--signal); border-width:0 1.6px 1.6px 0; transform:rotate(42deg);
}

/* ─── Panel en directo (elemento firma) ───────────────────── */
.live-panel{
  position:relative;
  border-radius:20px;
  border:1px solid var(--line-strong);
  background:linear-gradient(165deg, rgba(14,23,42,.96), rgba(7,12,22,.98));
  box-shadow:var(--shadow-soft);
  overflow:hidden;
}
.live-panel__glow{
  position:absolute; inset:-1px; border-radius:20px; pointer-events:none;
  background:linear-gradient(140deg, rgba(61,123,255,.5), transparent 42%, transparent 62%, rgba(47,227,160,.32));
  -webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite:xor; mask-composite:exclude; padding:1px;
}
.live-panel__head{
  display:flex; align-items:center; justify-content:space-between; gap:1rem;
  padding:.9rem 1.1rem; border-bottom:1px solid var(--line);
  background:rgba(255,255,255,.02);
}
.live-badge{
  display:inline-flex; align-items:center; gap:.45rem; flex-shrink:0;
  font-family:'JetBrains Mono',monospace; font-size:10.5px; letter-spacing:.06em; text-transform:uppercase;
  color:var(--signal); background:rgba(47,227,160,.09);
  border:1px solid rgba(47,227,160,.25); padding:.3rem .6rem; border-radius:99px;
}
.live-panel__stats{
  display:grid; grid-template-columns:repeat(3,1fr);
  border-bottom:1px solid var(--line);
}
.live-panel__stats > div{ padding:1rem 1.1rem; min-width:0; }
@media (max-width:420px){
  .live-panel__stats > div{ padding:.85rem .7rem; }
  .stat-value{ font-size:1.35rem; }
}
.live-panel__stats > div + div{ border-left:1px solid var(--line); }
.stat-label{ font-family:'JetBrains Mono',monospace; font-size:10px; letter-spacing:.08em; text-transform:uppercase; color:rgba(134,149,174,.75); }
.stat-value{ font-family:'Sora',sans-serif; font-size:1.6rem; font-weight:700; letter-spacing:-.03em; line-height:1.15; margin-top:.3rem; color:var(--paper); }
.stat-value--green{ color:var(--signal); }
.stat-foot{ font-size:11px; color:rgba(134,149,174,.7); margin-top:.15rem; }

.live-panel__list{ padding:.6rem; display:flex; flex-direction:column; gap:.45rem; min-height:236px; }
.lead-card{
  display:flex; align-items:center; gap:.75rem;
  padding:.7rem .8rem; border-radius:12px;
  background:rgba(255,255,255,.028); border:1px solid rgba(140,170,220,.09);
  animation:leadIn .55s var(--ease) both;
}
.lead-card--new{ border-color:rgba(47,227,160,.34); background:rgba(47,227,160,.055); }
@keyframes leadIn{
  from{ opacity:0; transform:translateY(-10px) scale(.98); }
  to{ opacity:1; transform:none; }
}
.lead-card__ico{
  width:32px; height:32px; flex-shrink:0; border-radius:9px;
  display:grid; place-items:center;
  background:rgba(61,123,255,.12); color:var(--brand-soft);
}
.lead-card--new .lead-card__ico{ background:rgba(47,227,160,.13); color:var(--signal); }
.lead-card__ico svg{ width:15px; height:15px; }
.lead-card__main{ display:block; min-width:0; flex:1; }
.lead-card__title{ display:block; font-size:13.5px; font-weight:600; color:var(--paper); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.lead-card__sub{ display:block; font-family:'JetBrains Mono',monospace; font-size:11px; color:rgba(134,149,174,.85); margin-top:.15rem; }
.lead-card__side{ display:block; text-align:right; flex-shrink:0; }
.lead-card__time{ display:block; font-family:'JetBrains Mono',monospace; font-size:12.5px; color:var(--signal); }
.lead-card__ago{ display:block; font-family:'JetBrains Mono',monospace; font-size:10px; color:rgba(134,149,174,.6); margin-top:.15rem; }

.live-panel__foot{
  display:flex; align-items:center; justify-content:space-between;
  padding:.7rem 1.1rem; border-top:1px solid var(--line); background:rgba(255,255,255,.015);
}

/* ─── Telemetría ──────────────────────────────────────────── */
.telemetry-value{
  font-family:'Sora',sans-serif; font-size:clamp(1.7rem,3.4vw,2.35rem);
  font-weight:700; letter-spacing:-.035em; color:var(--paper); line-height:1;
}
.telemetry-value--green{ color:var(--signal); }
.telemetry-label{ margin-top:.55rem; font-size:13px; line-height:1.45; color:var(--fog); max-width:22ch; }

/* ─── Tarjetas de dolor ───────────────────────────────────── */
.pain-card{
  padding:1.75rem;
  border-radius:16px;
  border:1px solid var(--line);
  background:linear-gradient(170deg, rgba(14,23,42,.6), rgba(7,12,22,.4));
  transition:border-color .3s, transform .3s var(--ease);
}
.pain-card:hover{ border-color:var(--line-strong); transform:translateY(-3px); }
.pain-card__mark{
  display:grid; place-items:center; width:40px; height:40px; border-radius:11px;
  background:rgba(255,184,107,.09); color:var(--alert); border:1px solid rgba(255,184,107,.2);
}
.pain-card__mark svg{ width:20px; height:20px; }
.pain-card__title{ margin-top:1.15rem; font-family:'Sora',sans-serif; font-size:1.1rem; font-weight:600; letter-spacing:-.02em; color:var(--paper); }
.pain-card__text{ margin-top:.7rem; font-size:14.5px; line-height:1.65; color:var(--fog); }

.flow-note{
  border-left:2px solid var(--brand);
  padding:1.1rem 0 1.1rem 1.4rem;
  font-size:16px; line-height:1.65; color:var(--fog);
  max-width:62ch;
}

/* ─── Pasos ───────────────────────────────────────────────── */
.steps{ display:flex; flex-direction:column; gap:0; counter-reset:step; }
.step{ display:grid; grid-template-columns:auto 1fr; gap:1.5rem; position:relative; padding-bottom:2.75rem; }
.step:last-child{ padding-bottom:0; }
.step::before{
  content:''; position:absolute; left:27px; top:56px; bottom:.5rem; width:1px;
  background:linear-gradient(180deg, var(--line-strong), transparent);
}
.step:last-child::before{ display:none; }
.step__num{
  width:55px; height:55px; border-radius:15px; display:grid; place-items:center; flex-shrink:0;
  border:1px solid var(--line-strong); background:var(--surface2);
  font-family:'JetBrains Mono',monospace; font-size:14px; color:var(--brand-soft);
  position:relative; z-index:1;
}
.step--highlight .step__num{
  border-color:rgba(47,227,160,.4); background:rgba(47,227,160,.07); color:var(--signal);
}
.step__title{ font-family:'Sora',sans-serif; font-size:1.25rem; font-weight:600; letter-spacing:-.025em; color:var(--paper); padding-top:.85rem; }
.step__text{ margin-top:.75rem; font-size:15.5px; line-height:1.7; color:var(--fog); max-width:60ch; }
.step__meta{
  margin-top:1rem; display:inline-flex; align-items:center; gap:.55rem;
  font-family:'JetBrains Mono',monospace; font-size:11.5px; color:var(--fog);
  background:rgba(255,255,255,.035); border:1px solid var(--line);
  padding:.4rem .75rem; border-radius:8px;
}
.step__meta span{ color:rgba(134,149,174,.6); text-transform:uppercase; letter-spacing:.06em; font-size:10px; }
.step__meta--green{ color:var(--signal); border-color:rgba(47,227,160,.25); background:rgba(47,227,160,.06); }
@media (min-width:1024px){
  .step__body{ display:grid; grid-template-columns:minmax(0,62ch) 220px; column-gap:3rem; align-items:start; }
  .step__title{ grid-column:1 / -1; }
  .step__text{ grid-column:1; grid-row:2; max-width:none; }
  .step__meta{
    grid-column:2; grid-row:2; margin-top:.4rem; justify-self:start;
    flex-direction:column; align-items:flex-start; gap:.4rem; width:100%;
  }
}
@media (max-width:640px){
  .step{ grid-template-columns:1fr; gap:.9rem; }
  .step::before{ display:none; }
  .step__title{ padding-top:0; }
}

/* ─── Mock panel ──────────────────────────────────────────── */
.mock-panel{
  border-radius:16px; border:1px solid var(--line-strong); overflow:hidden;
  background:linear-gradient(170deg, rgba(14,23,42,.95), rgba(7,12,22,.97));
  box-shadow:var(--shadow-soft);
}
.mock-panel__bar{ display:flex; align-items:center; gap:.4rem; padding:.75rem 1rem; border-bottom:1px solid var(--line); background:rgba(255,255,255,.02); }
.dot{ width:9px; height:9px; border-radius:50%; display:inline-block; }
.dot--r{ background:#ff5f57; } .dot--y{ background:#febc2e; } .dot--g{ background:#28c840; }
.mock-panel__body{ padding:.5rem; }
.mock-row{
  display:grid; grid-template-columns:1.3fr .6fr .7fr; align-items:center; gap:.6rem;
  padding:.8rem .75rem; border-radius:10px; font-size:13.5px;
}
@media (min-width:640px){ .mock-row{ grid-template-columns:1.2fr 1.1fr .5fr .8fr; } }
.mock-row:nth-child(even){ background:rgba(255,255,255,.022); }
.mock-row--head{
  font-family:'JetBrains Mono',monospace; font-size:10px; letter-spacing:.08em; text-transform:uppercase;
  color:rgba(134,149,174,.6); background:transparent !important; padding-bottom:.5rem;
}
.mock-row--play{ background:rgba(61,123,255,.07) !important; border:1px solid rgba(61,123,255,.16); margin-top:.35rem; }
.tag{
  font-style:normal; font-family:'JetBrains Mono',monospace; font-size:10.5px;
  padding:.28rem .55rem; border-radius:6px; white-space:nowrap;
}
.tag--green{ background:rgba(47,227,160,.11); color:var(--signal); border:1px solid rgba(47,227,160,.25); }
.tag--muted{ background:rgba(255,255,255,.05); color:rgba(134,149,174,.85); border:1px solid var(--line); }
.tag--blue{ background:rgba(61,123,255,.13); color:var(--brand-soft); border:1px solid rgba(61,123,255,.3); }
.play-btn{ display:grid; place-items:center; width:22px; height:22px; border-radius:50%; background:var(--brand); color:#fff; }
.play-btn svg{ width:12px; height:12px; }
.wave{ display:flex; align-items:center; gap:2.5px; height:20px; }
.wave i{ width:2px; border-radius:2px; background:rgba(61,123,255,.5); animation:wave 1.3s ease-in-out infinite; }
.wave i:nth-child(1){ height:35%; animation-delay:0s } .wave i:nth-child(2){ height:70%; animation-delay:.08s }
.wave i:nth-child(3){ height:100%; animation-delay:.16s } .wave i:nth-child(4){ height:55%; animation-delay:.24s }
.wave i:nth-child(5){ height:85%; animation-delay:.32s } .wave i:nth-child(6){ height:40%; animation-delay:.4s }
.wave i:nth-child(7){ height:75%; animation-delay:.48s } .wave i:nth-child(8){ height:30%; animation-delay:.56s }
.wave i:nth-child(9){ height:90%; animation-delay:.64s } .wave i:nth-child(10){ height:50%; animation-delay:.72s }
.wave i:nth-child(11){ height:65%; animation-delay:.8s } .wave i:nth-child(12){ height:38%; animation-delay:.88s }
@keyframes wave{ 0%,100%{ transform:scaleY(.55); opacity:.55 } 50%{ transform:scaleY(1); opacity:1 } }

/* ─── Features ────────────────────────────────────────────── */
.feature{ display:flex; gap:1rem; }
.feature__icon{
  display:grid; place-items:center; width:38px; height:38px; flex-shrink:0; border-radius:11px;
  background:rgba(61,123,255,.1); border:1px solid rgba(61,123,255,.22); color:var(--brand-soft);
}
.feature__icon svg{ width:18px; height:18px; }
.feature__title{ font-family:'Sora',sans-serif; font-size:1rem; font-weight:600; letter-spacing:-.015em; color:var(--paper); }
.feature__text{ margin-top:.35rem; font-size:14.5px; line-height:1.65; color:var(--fog); }

/* ─── Sectores ────────────────────────────────────────────── */
.sector{
  padding:1.5rem; border-radius:15px; border:1px solid var(--line);
  background:rgba(14,23,42,.45);
  transition:border-color .3s, background .3s, transform .3s var(--ease);
}
.sector:hover{ border-color:rgba(61,123,255,.35); background:rgba(14,23,42,.8); transform:translateY(-3px); }
.sector__top{ display:flex; align-items:center; justify-content:space-between; gap:1rem; }
.sector__icon{ display:grid; place-items:center; width:38px; height:38px; border-radius:10px; background:rgba(255,255,255,.045); color:var(--brand-soft); }
.sector__icon svg{ width:19px; height:19px; }
.sector__ticket{
  font-family:'JetBrains Mono',monospace; font-size:11px; color:var(--signal);
  background:rgba(47,227,160,.08); border:1px solid rgba(47,227,160,.2);
  padding:.3rem .55rem; border-radius:7px; white-space:nowrap;
}
.sector__title{ margin-top:1.1rem; font-family:'Sora',sans-serif; font-size:1.02rem; font-weight:600; letter-spacing:-.02em; color:var(--paper); }
.sector__text{ margin-top:.55rem; font-size:14px; line-height:1.6; color:var(--fog); }

/* ─── Planes ──────────────────────────────────────────────── */
.plan{
  position:relative; display:flex; flex-direction:column;
  padding:2rem; border-radius:18px; border:1px solid var(--line);
  background:linear-gradient(175deg, rgba(14,23,42,.7), rgba(7,12,22,.5));
}
.plan--featured{
  border-color:rgba(61,123,255,.42);
  background:linear-gradient(175deg, rgba(23,40,80,.7), rgba(9,15,30,.75));
  box-shadow:0 28px 70px -30px rgba(61,123,255,.55);
}
.plan__ribbon{
  position:absolute; top:0; left:50%; transform:translate(-50%,-50%);
  font-family:'JetBrains Mono',monospace; font-size:10.5px; letter-spacing:.06em; text-transform:uppercase;
  background:linear-gradient(90deg,#4d87ff,#2f6bf0); color:#fff;
  padding:.4rem .9rem; border-radius:99px; white-space:nowrap;
  box-shadow:0 8px 22px -8px rgba(61,123,255,.9);
}
.plan__tag{
  display:inline-block; font-family:'JetBrains Mono',monospace; font-size:10.5px;
  letter-spacing:.08em; text-transform:uppercase; color:var(--fog);
  border:1px solid var(--line); padding:.3rem .6rem; border-radius:99px;
}
.plan__tag--light{ color:var(--brand-soft); border-color:rgba(61,123,255,.35); background:rgba(61,123,255,.09); }
.plan__title{ margin-top:1rem; font-family:'Sora',sans-serif; font-size:1.35rem; font-weight:600; letter-spacing:-.025em; color:var(--paper); }
.plan__price{ margin-top:1.1rem; font-family:'Sora',sans-serif; font-size:2.4rem; font-weight:700; letter-spacing:-.04em; color:var(--paper); line-height:1; }
.plan__from{ display:block; font-family:'Instrument Sans',sans-serif; font-size:12.5px; font-weight:400; letter-spacing:0; color:var(--fog); margin-bottom:.35rem; }
.plan__unit{ font-size:14px; font-weight:400; letter-spacing:0; color:var(--fog); }
.plan__sub{ margin-top:.7rem; font-size:14px; color:var(--fog); }
.plan__list{ margin-top:1.75rem; padding-top:1.5rem; border-top:1px solid var(--line); display:flex; flex-direction:column; gap:.85rem; flex:1; }
.plan__list li{ position:relative; padding-left:1.7rem; font-size:14.5px; line-height:1.6; color:var(--fog); }
.plan__list li::before{
  content:''; position:absolute; left:0; top:.42em; width:15px; height:15px; border-radius:50%;
  background:rgba(47,227,160,.13); border:1px solid rgba(47,227,160,.35);
}
.plan__list li::after{
  content:''; position:absolute; left:4.3px; top:calc(.42em + 3px); width:4px; height:7px;
  border:solid var(--signal); border-width:0 1.5px 1.5px 0; transform:rotate(42deg);
}

.anti-model{
  display:flex; gap:1.1rem; align-items:flex-start;
  padding:1.6rem 1.75rem; border-radius:16px;
  border:1px dashed rgba(255,184,107,.28); background:rgba(255,184,107,.035);
}
.anti-model__mark{ display:grid; place-items:center; width:38px; height:38px; flex-shrink:0; border-radius:50%; background:rgba(255,184,107,.1); color:var(--alert); }
.anti-model__mark svg{ width:20px; height:20px; }

/* ─── Calculadora ─────────────────────────────────────────── */
.calc{
  padding:1.75rem; border-radius:18px; border:1px solid var(--line-strong);
  background:linear-gradient(170deg, rgba(14,23,42,.9), rgba(7,12,22,.95));
  box-shadow:var(--shadow-soft);
}
@media (min-width:640px){ .calc{ padding:2.25rem; } }
.calc__inputs{ display:flex; flex-direction:column; gap:1.6rem; }
.calc__field label{ display:block; font-size:13.5px; color:var(--fog); margin-bottom:.5rem; }
.calc__out{
  display:block; font-family:'Sora',sans-serif; font-size:1.5rem; font-weight:700;
  letter-spacing:-.03em; color:var(--paper); margin-bottom:.6rem;
}
.calc input[type=range]{
  -webkit-appearance:none; appearance:none; width:100%; height:5px; border-radius:99px;
  background:linear-gradient(90deg, var(--brand) var(--fill,30%), rgba(255,255,255,.09) var(--fill,30%));
  outline:none; cursor:pointer;
}
.calc input[type=range]::-webkit-slider-thumb{
  -webkit-appearance:none; appearance:none; width:20px; height:20px; border-radius:50%;
  background:#fff; border:4px solid var(--brand); cursor:grab;
  box-shadow:0 4px 14px -3px rgba(61,123,255,.9); transition:transform .15s;
}
.calc input[type=range]::-webkit-slider-thumb:active{ transform:scale(1.12); cursor:grabbing; }
.calc input[type=range]::-moz-range-thumb{
  width:16px; height:16px; border-radius:50%; background:#fff; border:4px solid var(--brand); cursor:grab;
}
.calc__results{
  margin-top:2rem; padding-top:1.75rem; border-top:1px solid var(--line);
  display:grid; grid-template-columns:repeat(3,1fr); gap:1rem;
}
@media (max-width:520px){ .calc__results{ grid-template-columns:1fr 1fr; } .calc__result--hero{ grid-column:1/-1; } }
.calc__result-label{ font-family:'JetBrains Mono',monospace; font-size:10px; letter-spacing:.07em; text-transform:uppercase; color:rgba(134,149,174,.75); }
.calc__result-value{ margin-top:.4rem; font-family:'Sora',sans-serif; font-size:1.45rem; font-weight:700; letter-spacing:-.035em; color:var(--paper); }
.calc__result-value--muted{ color:var(--fog); }
.calc__result-value--green{ color:var(--signal); }
.calc__result--hero{ padding:.9rem 1rem; margin:-.9rem -.25rem; border-radius:12px; background:rgba(47,227,160,.06); border:1px solid rgba(47,227,160,.2); }
.calc__note{ margin-top:1.4rem; font-size:13.5px; line-height:1.6; color:var(--fog); }

/* ─── Riesgo cero ─────────────────────────────────────────── */
.risk-box{
  position:relative; text-align:center; max-width:900px; margin:0 auto;
  padding:3rem 1.75rem; border-radius:24px;
  border:1px solid rgba(61,123,255,.25);
  background:linear-gradient(170deg, rgba(18,32,64,.75), rgba(7,12,22,.85));
  box-shadow:var(--shadow-soft);
}
@media (min-width:768px){ .risk-box{ padding:4rem 3.5rem; } }
.risk-box__seal{
  display:grid; place-items:center; width:56px; height:56px; margin:0 auto 1.75rem;
  border-radius:16px; border:1px solid rgba(47,227,160,.32);
  background:rgba(47,227,160,.08); color:var(--signal);
}
.risk-box__seal svg{ width:28px; height:28px; }

/* ─── Casos ───────────────────────────────────────────────── */
.case{
  display:flex; flex-direction:column;
  padding:1.75rem; border-radius:16px; border:1px solid var(--line);
  background:linear-gradient(170deg, rgba(14,23,42,.6), rgba(7,12,22,.4));
}
.case__metric{ padding-bottom:1.25rem; border-bottom:1px solid var(--line); }
.case__number{ font-family:'Sora',sans-serif; font-size:2.1rem; font-weight:700; letter-spacing:-.04em; color:var(--signal); line-height:1; }
.case__metric-label{ display:block; margin-top:.45rem; font-size:13px; color:var(--fog); }
.case__quote{ margin-top:1.25rem; flex:1; font-size:15px; line-height:1.7; color:var(--paper); opacity:.92; }
.case__quote::before{ content:'\201C'; }
.case__quote::after{ content:'\201D'; }
.case__author{ margin-top:1.5rem; display:flex; align-items:center; gap:.8rem; }
.case__avatar{
  display:grid; place-items:center; width:38px; height:38px; border-radius:50%; flex-shrink:0;
  background:rgba(61,123,255,.14); border:1px solid rgba(61,123,255,.3);
  font-family:'JetBrains Mono',monospace; font-size:12px; color:var(--brand-soft);
}
.case__author strong{ display:block; font-size:14px; font-weight:600; color:var(--paper); }
.case__author em{ display:block; font-style:normal; font-size:12.5px; color:var(--fog); margin-top:.1rem; }

/* ─── FAQ ─────────────────────────────────────────────────── */
.qa{ border-bottom:1px solid var(--line); }
.qa__q{
  display:flex; align-items:flex-start; justify-content:space-between; gap:1.5rem;
  padding:1.35rem 0; cursor:pointer; list-style:none;
  font-family:'Sora',sans-serif; font-size:1.02rem; font-weight:600; letter-spacing:-.015em; color:var(--paper);
  transition:color .2s;
}
.qa__q::-webkit-details-marker{ display:none; }
.qa__q:hover{ color:var(--brand-soft); }
.qa__ico{ position:relative; width:20px; height:20px; flex-shrink:0; margin-top:3px; }
.qa__ico::before,.qa__ico::after{
  content:''; position:absolute; left:50%; top:50%; background:var(--brand-soft);
  transform:translate(-50%,-50%); transition:transform .3s var(--ease), opacity .3s;
}
.qa__ico::before{ width:12px; height:1.6px; }
.qa__ico::after{ width:1.6px; height:12px; }
.qa[open] .qa__ico::after{ transform:translate(-50%,-50%) rotate(90deg); opacity:0; }
.qa__a{ padding:0 3rem 1.5rem 0; font-size:15px; line-height:1.75; color:var(--fog); animation:fadeDown .35s var(--ease); }
@keyframes fadeDown{ from{ opacity:0; transform:translateY(-6px);} to{ opacity:1; transform:none;} }

/* ─── Contacto ────────────────────────────────────────────── */
.contact-line{
  display:flex; align-items:center; gap:1rem;
  padding:1rem 1.15rem; border-radius:13px;
  border:1px solid var(--line); background:rgba(14,23,42,.5);
  transition:border-color .25s, background .25s, transform .25s var(--ease);
}
.contact-line:hover{ border-color:rgba(61,123,255,.4); background:rgba(14,23,42,.85); transform:translateX(3px); }
.contact-line--wa:hover{ border-color:rgba(47,227,160,.4); }
.contact-line__ico{
  display:grid; place-items:center; width:40px; height:40px; flex-shrink:0; border-radius:11px;
  background:rgba(255,255,255,.05); color:var(--brand-soft);
}
.contact-line--wa .contact-line__ico{ color:var(--signal); background:rgba(47,227,160,.09); }
.contact-line__ico svg{ width:19px; height:19px; }
.contact-line strong{ display:block; font-size:15px; font-weight:600; color:var(--paper); }
.contact-line em{ display:block; font-style:normal; font-size:13px; color:var(--fog); margin-top:.15rem; }

/* ─── Formulario ──────────────────────────────────────────── */
.form-card{
  padding:1.75rem; border-radius:20px;
  border:1px solid var(--line-strong);
  background:linear-gradient(170deg, rgba(14,23,42,.92), rgba(7,12,22,.96));
  box-shadow:var(--shadow-soft);
}
@media (min-width:640px){ .form-card{ padding:2.5rem; } }

.hp-field{ position:absolute !important; left:-9999px !important; width:1px; height:1px; overflow:hidden; }

.field label{ display:block; font-size:13.5px; font-weight:500; color:var(--paper); margin-bottom:.45rem; }
.req{ color:var(--brand-soft); }
.opt{ color:rgba(134,149,174,.7); font-weight:400; }

.field input[type=text],
.field input[type=tel],
.field input[type=email],
.field select,
.field textarea{
  width:100%; padding:.8rem .95rem; border-radius:11px;
  background:rgba(255,255,255,.035);
  border:1px solid var(--line);
  color:var(--paper); font-size:15px; font-family:'Instrument Sans',sans-serif;
  transition:border-color .2s, background .2s, box-shadow .2s;
}
.field textarea{ resize:vertical; min-height:92px; }
.field input::placeholder,.field textarea::placeholder{ color:rgba(134,149,174,.55); }
.field input:focus,.field select:focus,.field textarea:focus{
  outline:none; border-color:var(--brand);
  background:rgba(61,123,255,.06);
  box-shadow:0 0 0 3px rgba(61,123,255,.14);
}
.field select{
  appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238695AE' stroke-width='2'%3E%3Cpath d='m6 9 6 6 6-6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:right .8rem center; background-size:18px;
  padding-right:2.5rem;
}
.field select option{ background:#0E172A; color:var(--paper); }

.field--check{ display:grid; grid-template-columns:auto 1fr; gap:.75rem; align-items:start; padding-top:.35rem; }
.field--check input[type=checkbox]{
  width:19px; height:19px; margin-top:1px; border-radius:6px; cursor:pointer;
  background:rgba(255,255,255,.05); border:1px solid var(--line-strong);
  appearance:none; -webkit-appearance:none; flex-shrink:0; position:relative;
  transition:background .2s, border-color .2s;
}
.field--check input[type=checkbox]:checked{ background:var(--brand); border-color:var(--brand); }
.field--check input[type=checkbox]:checked::after{
  content:''; position:absolute; left:6px; top:2.5px; width:5px; height:9px;
  border:solid #fff; border-width:0 2px 2px 0; transform:rotate(42deg);
}
.field--check label{ font-size:13px; line-height:1.55; color:var(--fog); margin:0; font-weight:400; cursor:pointer; }
.field--check .field__error{ grid-column:1/-1; }

.field__error{ margin-top:.4rem; font-size:12.5px; color:#FF8080; min-height:0; }
.field.has-error input,.field.has-error select,.field.has-error textarea{ border-color:rgba(255,110,110,.55); background:rgba(255,110,110,.05); }

.btn-spinner{
  display:none; width:16px; height:16px; border-radius:50%;
  border:2px solid rgba(255,255,255,.35); border-top-color:#fff;
  animation:spin .7s linear infinite;
}
@keyframes spin{ to{ transform:rotate(360deg); } }
.is-sending .btn-spinner{ display:block; }
.is-sending{ opacity:.75; pointer-events:none; }

.form-status{ font-size:13.5px; text-align:center; min-height:0; }
.form-status.is-error{ color:#FF8080; padding:.6rem 0; }

.form-success{ text-align:center; padding:1.5rem 0; animation:fadeDown .5s var(--ease); }
.form-success__ico{
  display:grid; place-items:center; width:64px; height:64px; margin:0 auto; border-radius:50%;
  background:rgba(47,227,160,.1); border:1px solid rgba(47,227,160,.35); color:var(--signal);
}
.form-success__ico svg{ width:30px; height:30px; }

/* ─── Footer ──────────────────────────────────────────────── */
.footer-title{ font-family:'JetBrains Mono',monospace; font-size:10.5px; letter-spacing:.1em; text-transform:uppercase; color:rgba(134,149,174,.7); }
.footer-list{ margin-top:1.1rem; display:flex; flex-direction:column; gap:.7rem; font-size:14px; }
.footer-list a{ color:var(--fog); transition:color .2s; }
.footer-list a:hover{ color:var(--paper); }
.social{
  display:grid; place-items:center; width:38px; height:38px; border-radius:10px;
  border:1px solid var(--line); background:rgba(255,255,255,.03); color:var(--fog);
  transition:color .2s, border-color .2s, background .2s;
}
.social:hover{ color:var(--paper); border-color:var(--line-strong); background:rgba(255,255,255,.07); }
.social svg{ width:17px; height:17px; }

/* ─── Flotantes ───────────────────────────────────────────── */
.mobile-bar{
  position:fixed; bottom:0; left:0; right:0; z-index:45;
  display:grid; grid-template-columns:1fr 1fr; gap:.6rem;
  padding:.7rem .8rem calc(.7rem + env(safe-area-inset-bottom));
  background:rgba(7,12,22,.9); backdrop-filter:blur(16px); -webkit-backdrop-filter:blur(16px);
  border-top:1px solid var(--line);
}
.mobile-bar__btn{
  display:flex; align-items:center; justify-content:center; gap:.5rem;
  padding:.85rem; border-radius:12px; font-size:15px; font-weight:600;
  background:linear-gradient(180deg,#4d87ff,#2f6bf0); color:#fff;
}
.mobile-bar__btn svg{ width:18px; height:18px; }
.mobile-bar__btn--wa{ background:rgba(47,227,160,.12); border:1px solid rgba(47,227,160,.35); color:var(--signal); }

.wa-float{
  position:fixed; right:1.5rem; bottom:1.5rem; z-index:45;
  align-items:center; gap:.65rem; padding:.85rem 1.1rem; border-radius:99px;
  background:#1fb271; color:#fff; font-size:14.5px; font-weight:600;
  box-shadow:0 16px 40px -14px rgba(31,178,113,.95);
  transition:transform .25s var(--ease), box-shadow .25s;
}
.wa-float:hover{ transform:translateY(-2px) scale(1.02); box-shadow:0 22px 50px -14px rgba(31,178,113,1); }
.wa-float svg{ width:22px; height:22px; }
.wa-float__label{ max-width:0; overflow:hidden; white-space:nowrap; opacity:0; transition:max-width .4s var(--ease), opacity .3s; }
.wa-float:hover .wa-float__label{ max-width:200px; opacity:1; }

/* ─── Reveal ──────────────────────────────────────────────── */
.reveal{ opacity:0; transform:translateY(22px); transition:opacity .7s var(--ease), transform .7s var(--ease); }
.reveal.is-in{ opacity:1; transform:none; }

@media (min-width:1024px){
  .mobile-bar{ display:none !important; }
}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{ animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; }
  html{ scroll-behavior:auto; }
  .reveal{ opacity:1; transform:none; }
}

/* ─── Páginas legales ─────────────────────────────────────── */
.legal{ font-size:15.5px; line-height:1.75; color:var(--fog); }
.legal h2{
  margin:2.75rem 0 1rem;
  font-family:'Sora',sans-serif; font-size:1.15rem; font-weight:600;
  letter-spacing:-.02em; color:var(--paper);
  padding-top:1.75rem; border-top:1px solid var(--line);
}
.legal h2:first-child{ margin-top:0; padding-top:0; border-top:0; }
.legal p{ margin:0 0 1.1rem; }
.legal p:last-child{ margin-bottom:0; }
.legal strong{ color:var(--paper); font-weight:600; }
.legal > ul{ margin:0 0 1.3rem; padding-left:1.4rem; list-style:none; }
.legal > ul li{ position:relative; margin-bottom:.6rem; }
.legal > ul li::before{
  content:''; position:absolute; left:-1.15rem; top:.65em;
  width:5px; height:5px; border-radius:50%; background:var(--brand);
}
.legal-data{ margin:0 0 1.3rem; padding:0 !important; list-style:none; }
.legal-data li{
  display:grid; grid-template-columns:200px minmax(0,1fr); gap:.5rem 1.25rem;
  padding:.85rem 0; border-bottom:1px solid rgba(140,170,220,.08); margin:0 !important;
}
.legal-data li::before{ display:none !important; }
.legal-data li > span:first-child{
  font-family:'JetBrains Mono',monospace; font-size:11px; letter-spacing:.06em;
  text-transform:uppercase; color:rgba(134,149,174,.8); padding-top:.15rem;
}
@media (max-width:640px){
  .legal-data li{ grid-template-columns:1fr; gap:.25rem; }
}
.legal-note{
  padding:1.1rem 1.3rem; border-radius:12px;
  border:1px dashed rgba(255,184,107,.3); background:rgba(255,184,107,.04);
  font-size:14.5px;
}