/* =========================================================
   ERNESTO FLORES — ASESOR FINANCIERO INDEPENDIENTE
   Dark theme · Neon glow · Glassmorphism
========================================================= */

:root{
  --navy-0: #000B12;
  --navy-1: #001B28;
  --navy-2: #032B3B;
  --navy-3: #0A3D52;
  --glass: rgba(10,61,82,0.35);
  --glass-border: rgba(255,255,255,0.08);

  --gold: #FFBD00;
  --gold-2: #FFE08A;
  --gold-dim: #C99400;

  --ink: #EAF1F5;
  --ink-dim: #9FBAC7;
  --ink-faint: #61808D;

  --serif: "Space Grotesk", sans-serif;
  --sans: "Manrope", -apple-system, sans-serif;
  --mono: "JetBrains Mono", monospace;

  --container: 1180px;
  --r-lg: 24px;
  --r-md: 16px;
  --r-sm: 10px;
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  font-family:var(--sans);
  color:var(--ink);
  background:
    radial-gradient(ellipse 900px 500px at 15% 0%, rgba(255,189,0,0.05), transparent 55%),
    radial-gradient(ellipse 900px 600px at 90% 15%, rgba(10,61,82,0.5), transparent 55%),
    var(--navy-1);
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
  padding-bottom:0;
}
img{max-width:100%;display:block;}
a{color:inherit;text-decoration:none;}
h1,h2,h3{font-family:var(--serif);font-weight:600;margin:0;line-height:1.15;color:var(--ink);}
p{margin:0;line-height:1.65;color:var(--ink-dim);}
.mono{font-family:var(--mono);}

@media (prefers-reduced-motion: reduce){
  *{animation-duration:0.01ms !important; animation-iteration-count:1 !important; transition-duration:0.01ms !important; scroll-behavior:auto !important;}
}
:focus-visible{outline:2px solid var(--gold);outline-offset:3px;}

/* ---------- utility ---------- */
.eyebrow{
  font-family:var(--mono);
  font-size:0.72rem;
  letter-spacing:0.14em;
  text-transform:uppercase;
  color:var(--gold);
  margin-bottom:14px;
  display:block;
}
.eyebrow--center{text-align:center;}

.text-gradient{
  background:linear-gradient(90deg, var(--gold) 0%, var(--gold-2) 50%, var(--gold) 100%);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
  font-style:normal;
}
.text-strike{position:relative;color:var(--ink-faint);}
.text-strike::after{
  content:""; position:absolute; left:-2%; right:-2%; top:50%; height:2px;
  background:var(--ink-faint); transform:rotate(-3deg);
}

.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  padding:16px 30px; border-radius:100px; font-weight:700; font-size:0.95rem;
  border:1px solid transparent; cursor:pointer; font-family:var(--sans);
  transition:transform .25s ease, box-shadow .25s ease;
}
.btn--gold{
  background:linear-gradient(135deg, var(--gold), var(--gold-2));
  color:var(--navy-0);
  box-shadow:0 0 30px rgba(255,189,0,0.25), 0 8px 20px rgba(0,0,0,0.3);
}
.btn--gold:hover{transform:translateY(-2px);box-shadow:0 0 44px rgba(255,189,0,0.45), 0 10px 26px rgba(0,0,0,0.35);}
.btn--ghost{
  color:var(--ink); border-color:var(--glass-border); background:rgba(255,255,255,0.03);
}
.btn--ghost:hover{border-color:var(--gold);color:var(--gold);}
.btn--block{width:100%;}
.btn--lg{padding:20px 44px;font-size:1.05rem;}

.glass{
  background:var(--glass);
  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);
  border:1px solid var(--glass-border);
}
.glow-border{
  box-shadow:0 0 0 1px rgba(255,189,0,0.12) inset, 0 0 50px rgba(255,189,0,0.08), 0 20px 60px rgba(0,0,0,0.4);
}

/* neon card, used across many sections */
.neon-card{
  background:linear-gradient(180deg, rgba(255,255,255,0.03), rgba(255,255,255,0.01));
  border:1px solid var(--glass-border);
  border-radius:var(--r-md);
  padding:32px 28px;
  transition:transform .3s ease, box-shadow .3s ease, border-color .3s ease;
}
.neon-card:hover{
  transform:translateY(-4px);
  border-color:rgba(255,189,0,0.4);
  box-shadow:0 0 40px rgba(255,189,0,0.12), 0 20px 40px rgba(0,0,0,0.3);
}
.neon-card h3{font-size:1.15rem;margin-bottom:10px;}
.neon-card p{font-size:0.92rem;}
.neon-card__icon{
  display:flex; align-items:center; justify-content:center;
  width:46px; height:46px; border-radius:12px; margin-bottom:18px;
}
.neon-card__icon svg{width:24px;height:24px;}

/* color variants — alternating blue / gold accent, both derived from brand */
.neon-card--blue .neon-card__icon{color:#4FC3F7;background:rgba(79,195,247,0.12);}
.neon-card--blue:hover{border-color:rgba(79,195,247,0.4);box-shadow:0 0 40px rgba(79,195,247,0.15), 0 20px 40px rgba(0,0,0,0.3);}
.neon-card--gold .neon-card__icon{color:var(--gold);background:rgba(255,189,0,0.12);}
.neon-card--gold:hover{border-color:rgba(255,189,0,0.4);box-shadow:0 0 40px rgba(255,189,0,0.15), 0 20px 40px rgba(0,0,0,0.3);}
.neon-card--sm{padding:22px 20px;text-align:center;}
.neon-card--sm .mono{color:var(--gold);font-weight:700;font-size:1.1rem;display:block;margin-bottom:8px;line-height:1.3;}
.neon-card--sm p{font-size:0.82rem;margin:0;}

/* reveal on scroll */
.js-reveal-ready .reveal{opacity:0; transform:translateY(24px); transition:opacity .8s ease, transform .8s ease;}
.reveal.is-visible{opacity:1 !important; transform:translateY(0) !important;}

/* =========================================================
   NAV
========================================================= */
.nav{
  position:sticky; top:0; left:0; right:0; z-index:100;
  padding:16px 0;
  background:var(--navy-0);
  border-bottom:1px solid var(--glass-border);
  transition:padding .3s ease, box-shadow .3s ease;
}
.nav.is-scrolled{
  padding:10px 0;
  box-shadow:0 8px 30px rgba(0,0,0,0.3);
}
.nav__inner{
  max-width:var(--container); margin:0 auto; padding:0 24px;
  display:flex; align-items:center; justify-content:space-between; gap:24px;
}
.nav__brand{display:flex;flex-direction:column;line-height:1.2;}
.nav__brandtext{color:var(--ink);font-weight:700;font-size:1.05rem;font-family:var(--serif);}
.nav__brandsub{color:#FFB90F;font-size:0.68rem;font-weight:600;letter-spacing:0.04em;}
.nav__links{display:flex;gap:20px;}
.nav__links a{
  color:var(--ink); font-size:0.78rem; font-weight:400; position:relative; padding-bottom:4px;
  transition:color .25s ease, transform .25s ease;
  display:inline-block;
}
.nav__links a::after{
  content:""; position:absolute; left:0; bottom:0; width:0; height:1px; background:var(--gold);
  transition:width .25s ease; box-shadow:0 0 8px var(--gold);
}
.nav__links a:hover{color:var(--gold);transform:translateY(-2px);}
.nav__links a:hover::after{width:100%;}
.nav__burger{display:none;background:none;border:none;flex-direction:column;gap:5px;cursor:pointer;padding:6px;}
.nav__burger span{width:22px;height:2px;background:var(--ink);border-radius:2px;}

/* =========================================================
   HERO — full-bleed photo, Sophia-style layout
========================================================= */
:root{
  --hero-cream: #EDE7D9;
  --hero-navy: #001B28;
}
.hero{
  position:relative;
  aspect-ratio:21/9;
  min-height:520px;
  display:flex;
  align-items:center;
  padding:60px 0;
  overflow:hidden;
  background:var(--hero-cream);
}
.hero__bgphoto{
  position:absolute; inset:0; width:100%; height:100%;
  object-fit:cover; object-position:right 30%;
  z-index:0;
}
.hero__scrim{
  position:absolute; inset:0; z-index:1;
  background:linear-gradient(90deg,
    var(--hero-cream) 0%,
    var(--hero-cream) 38%,
    rgba(237,231,217,0.85) 48%,
    rgba(237,231,217,0.35) 60%,
    rgba(237,231,217,0) 72%);
}
.hero__inner{
  position:relative; z-index:2; max-width:var(--container); margin:0 auto; padding:0 24px; width:100%;
}
.hero__copy{max-width:720px;}
.hero__title{
  font-size:clamp(3rem, 5.8vw, 5rem); font-weight:700; letter-spacing:-0.02em;
  color:var(--hero-navy);
}
.hero__lead{margin-top:28px; font-size:1.35rem; line-height:1.5; color:#3A4750; max-width:680px;}
.hero__bold{margin-top:24px; font-size:1.15rem; font-weight:700; color:var(--hero-navy);}
.hero__actions{display:flex;gap:16px;margin-top:34px;flex-wrap:wrap;}
.hero__mobileimg{display:none;}

@media (max-width:900px){
  .hero{
    aspect-ratio:auto; min-height:0; padding:24px 0 0; flex-direction:column; align-items:stretch;
    background:var(--hero-cream);
  }
  .hero__bgphoto{display:none;}
  .hero__scrim{display:none;}
  .hero__mobileimg{
    display:block; width:100%; aspect-ratio:4/3; object-fit:cover; object-position:top center;
  }
  .hero__inner{padding:32px 20px 40px;order:2;}
  .hero__copy{max-width:none;}
  .hero__lead, .hero__bold{color:#3A4750;}
  .hero__bold{color:var(--hero-navy);}
}


/* =========================================================
   LA NUEVA REALIDAD
========================================================= */
.realidad{padding:56px 24px 76px; max-width:var(--container); margin:0 auto;}
.realidad__kicker{
  font-family:var(--mono); font-weight:600; letter-spacing:0.06em; text-transform:uppercase;
  color:var(--gold); text-align:center; font-size:clamp(1.1rem,2.2vw,1.5rem); margin-bottom:18px;
}
.realidad__title{text-align:center;font-size:clamp(1.9rem,3.4vw,2.6rem);margin:0 auto 38px;max-width:900px;color:var(--ink);}
.realidad__grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;}

@media (max-width:900px){.realidad__grid{grid-template-columns:1fr 1fr;}}
@media (max-width:560px){.realidad__grid{grid-template-columns:1fr;}}

/* =========================================================
   CALCULADORA DE JUBILACIÓN
========================================================= */
.calculadora{padding:72px 24px;}
.calculadora__inner{max-width:var(--container); margin:0 auto;}
.calculadora__head{text-align:center;max-width:760px;margin:0 auto 50px;}
.calculadora__kicker{
  font-family:var(--mono); font-weight:600; letter-spacing:0.06em; text-transform:uppercase;
  color:var(--gold); font-size:clamp(1.15rem,2.4vw,1.5rem); margin-bottom:16px;
}
.calculadora__head h2{font-size:clamp(1.8rem,3.6vw,2.6rem);}
.calculadora__title-solid{
  font-size:clamp(1.7rem,3.2vw,2.4rem); max-width:800px; margin:0 auto; line-height:1.3;
}
.calculadora__sub{margin-top:18px;font-size:1.02rem;}

/* Encabezado mínimo del Paso 1 dentro del panel inline — sin repetir
   el título grande, ya que el usuario acaba de hacer clic en "Paso 1". */
.calculadora__head--mini{margin-bottom:20px; text-align:left;}
.calculadora__kicker--mini{
  font-size:0.78rem; margin-bottom:0; letter-spacing:0.1em;
}

/* Alternating background — single flat brand tone (no gradient) */
.calculadora--light{background:#F4EDDC;}
.calculadora--light .calculadora__title-solid{color:var(--hero-navy, #001B28);}
.calculadora--light .calculadora__sub{color:#4A4030;}
.calculadora--light .calculadora__kicker{color:#B8860B;}
.calculadora--light .calc-card{background:rgba(255,255,255,0.5);border:1px solid rgba(0,27,40,0.08);}
.calculadora--light .field__row{color:#001B28;}
.calculadora--light .field__val{color:#B8860B;}
.calculadora--light .calc-card__assumptions{color:#5A5140;border-top-color:rgba(0,27,40,0.1);}
.calculadora--light .calc-card__assumptions strong{color:#B8860B;}
.calculadora--light .calc-card__result{background:rgba(184,134,11,0.08);border-color:rgba(184,134,11,0.25);}
.calculadora--light .calc-card__result-label{color:#5A5140;}
.calculadora--light .calc-card__result-num{color:#B8860B;text-shadow:none;}
.calculadora--light .calc-card__breakdown div{border-bottom-color:rgba(0,27,40,0.1);color:#5A5140;}
.calculadora--light .calc-card__breakdown span:last-child{color:#001B28;}
.calculadora--light input[type=range]{
  background:linear-gradient(90deg, #B8860B 0%, #B8860B var(--fill,50%), rgba(0,27,40,0.15) var(--fill,50%));
}
.calculadora--light input[type=range]::-webkit-slider-thumb{background:#B8860B;box-shadow:0 0 0 4px rgba(184,134,11,0.2), 0 0 16px rgba(184,134,11,0.5);}
.calculadora--light input[type=range]::-moz-range-thumb{background:#B8860B;box-shadow:0 0 0 4px rgba(184,134,11,0.2), 0 0 16px rgba(184,134,11,0.5);}

.calc-card{
  border-radius:var(--r-lg);
  padding:28px;
  display:grid; grid-template-columns:1fr 1fr; gap:32px;
}
.field{display:block;margin-bottom:15px;}
.field:last-of-type{margin-bottom:0;}
.field__row{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:6px;font-size:0.92rem;color:var(--ink);font-weight:600;}
.field__val{color:var(--gold);font-weight:700;font-size:1.05rem;}
.field__hint{display:block;font-size:0.75rem;color:var(--ink-faint);margin-top:6px;}
.field--text input[type=text], .field--text input[type=email]{
  width:100%; background:rgba(255,255,255,0.04); border:1px solid var(--glass-border);
  border-radius:var(--r-sm); padding:13px 16px; color:var(--ink); font-family:var(--sans); font-size:0.95rem;
}
.field--text input:focus{border-color:var(--gold);outline:none;}
.field--text span{display:block;font-size:0.85rem;font-weight:600;margin-bottom:8px;color:var(--ink);}

input[type=range]{
  width:100%; -webkit-appearance:none; height:4px; border-radius:3px;
  background:linear-gradient(90deg, var(--gold) 0%, var(--gold) var(--fill,50%), rgba(255,255,255,0.12) var(--fill,50%));
}
input[type=range]::-webkit-slider-thumb{
  -webkit-appearance:none; width:20px;height:20px;border-radius:50%;
  background:var(--gold); cursor:pointer; box-shadow:0 0 0 4px rgba(255,189,0,0.2), 0 0 16px rgba(255,189,0,0.6);
}
input[type=range]::-moz-range-thumb{
  width:20px;height:20px;border-radius:50%;background:var(--gold);cursor:pointer;border:none;
  box-shadow:0 0 0 4px rgba(255,189,0,0.2), 0 0 16px rgba(255,189,0,0.6);
}

.calc-card__assumptions{font-size:0.8rem;margin-top:4px;padding-top:12px;border-top:1px solid var(--glass-border);}
.calc-card__assumptions strong{color:var(--gold);}
.calc-card__result{
  display:flex; flex-direction:column; justify-content:center;
  background:rgba(255,189,0,0.04); border-radius:var(--r-md); padding:22px;
  border:1px solid rgba(255,189,0,0.15);
}
.calc-card__result-label{font-size:0.85rem;color:var(--ink-dim);margin-bottom:6px;}
.calc-card__result-num{font-size:2.2rem;font-weight:700;color:var(--gold);line-height:1;margin-bottom:16px;text-shadow:0 0 30px rgba(255,189,0,0.4);}
.calc-card__breakdown{margin-bottom:16px;}
.calc-card__breakdown div{display:flex;justify-content:space-between;padding:6px 0;border-bottom:1px solid var(--glass-border);font-size:0.87rem;}
.calc-card__breakdown div:last-child{border-bottom:none;}
.calc-card__breakdown span:last-child{color:var(--ink);font-weight:600;}

@media (max-width:900px){
  .calc-card{grid-template-columns:1fr;padding:32px 24px;gap:32px;}
}

/* =========================================================
   ANÁLISIS — módulo original de resultados (Paso 1)
   Mismo lenguaje visual que la calculadora: misma tarjeta de
   vidrio, mismo fondo, mismos bordes, misma sombra cálida.
   Se siente como la continuación del mismo componente, no
   como un bloque o producto distinto.
========================================================= */
.janalysis{
  margin-top:18px;
  padding-top:18px;
  border-top:1px dashed rgba(0,27,40,0.12);
  opacity:0; transform:translateY(18px);
  transition:opacity .5s ease, transform .5s ease;
}
.janalysis.is-revealed{opacity:1; transform:translateY(0);}

.janalysis__head{text-align:left; margin-bottom:16px;}
.janalysis__kicker{
  font-family:var(--mono); font-size:0.72rem; font-weight:600; letter-spacing:0.12em; text-transform:uppercase;
  color:#B8860B; margin-bottom:6px;
}
.janalysis__title{font-size:clamp(1.15rem,2.2vw,1.45rem); color:var(--hero-navy,#001B28); line-height:1.3;}

.janalysis__tabs{
  display:flex; border-bottom:1px solid rgba(0,27,40,0.1); margin-bottom:16px;
}
.janalysis__tab{
  background:none; border:none; cursor:pointer; font-family:var(--sans); font-weight:700;
  font-size:0.86rem; color:#8C8272; padding:8px 6px; position:relative;
  transition:color .25s ease;
}
.janalysis__tab + .janalysis__tab{margin-left:22px;}
.janalysis__tab::after{
  content:""; position:absolute; left:0; right:0; bottom:-1px; height:2px;
  background:#B8860B; transform:scaleX(0); transition:transform .25s ease; transform-origin:left;
}
.janalysis__tab.is-active{color:#001B28;}
.janalysis__tab.is-active::after{transform:scaleX(1);}

.janalysis__panel{display:none;}
.janalysis__panel.is-active{display:block; animation:janalysisFade .35s ease;}
@keyframes janalysisFade{from{opacity:0; transform:translateY(6px);} to{opacity:1; transform:translateY(0);}}

.janalysis__cards{display:grid; grid-template-columns:repeat(3,1fr); gap:12px;}
.jcard{
  background:rgba(255,255,255,0.55);
  border:1px solid rgba(0,27,40,0.08);
  border-radius:var(--r-md);
  padding:14px 16px;
  opacity:0; transform:translateY(10px);
  box-shadow:0 16px 34px rgba(184,134,11,0.07), 0 6px 14px rgba(0,27,40,0.05);
  transition:opacity .4s ease, transform .4s ease, border-color .3s ease, background .3s ease, box-shadow .3s ease;
}
.jcard.jub-in{opacity:1; transform:translateY(0);}
.jcard:hover{border-color:rgba(184,134,11,0.35); background:rgba(255,255,255,0.85); box-shadow:0 20px 40px rgba(184,134,11,0.12), 0 8px 18px rgba(0,27,40,0.06);}
.jcard--primary{
  grid-column:1 / -1;
  background:linear-gradient(135deg, rgba(184,134,11,0.12), rgba(255,255,255,0.5));
  border-color:rgba(184,134,11,0.3);
}
.jcard__label{display:block; font-size:0.76rem; color:#5A5140; margin-bottom:6px;}
.jcard__value{display:block; font-size:1.15rem; font-weight:700; color:#001B28;}
.jcard--primary .jcard__value{font-size:1.65rem; color:#B8860B;}

/* ---- insights: traducción de las cifras a lenguaje humano ---- */
.janalysis__insights{display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-top:12px;}
.jinsight{
  display:flex; gap:10px; align-items:flex-start;
  background:rgba(255,255,255,0.4);
  border:1px solid rgba(0,27,40,0.07);
  border-radius:var(--r-md);
  padding:12px 14px;
  opacity:0; transform:translateY(10px);
  transition:opacity .4s ease, transform .4s ease;
}
.jinsight.jub-in{opacity:1; transform:translateY(0);}
.jinsight__icon{
  flex-shrink:0; width:26px; height:26px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  background:rgba(184,134,11,0.12); color:#B8860B;
}
.jinsight__icon svg{width:13px;height:13px;}
.jinsight p{font-size:0.84rem; line-height:1.45; color:#3E3527; margin:0;}
.jinsight strong{color:#001B28;}

.janalysis__note{font-size:0.88rem; color:#5A5140; margin-bottom:12px; max-width:560px;}

/* ---- gráfico interactivo de dos fases (ahorro + jubilación) ---- */
.janalysis__chartwrap{position:relative;}
.janalysis__chart{width:100%; height:auto; display:block; cursor:crosshair;}
.janalysis__tooltip{
  position:absolute; top:0; left:0;
  background:#001B28; color:#EAF1F5;
  border-radius:10px; padding:10px 14px;
  font-size:0.78rem; line-height:1.5; pointer-events:none;
  box-shadow:0 14px 30px rgba(0,27,40,0.25);
  opacity:0; transform:translate(-50%,-115%);
  transition:opacity .15s ease;
  white-space:nowrap; z-index:2;
}
.janalysis__tooltip.is-visible{opacity:1;}
.janalysis__tooltip b{color:#FFBD00; font-family:var(--mono);}
.janalysis__legend{display:flex; gap:18px; margin:8px 0 12px; flex-wrap:wrap;}
.janalysis__legend-item{display:flex; align-items:center; gap:8px; font-size:0.8rem; color:#5A5140;}
.janalysis__legend-dot{width:10px; height:10px; border-radius:50%;}

.janalysis__timeline{display:flex; align-items:flex-start; margin-top:4px;}
.janalysis__tpoint{
  display:flex; flex-direction:column; align-items:center; text-align:center; gap:8px;
  font-size:0.78rem; color:#5A5140; flex-shrink:0; width:110px; line-height:1.4;
}
.janalysis__tpoint b{color:#001B28; font-family:var(--mono); font-size:0.95rem;}
.janalysis__tdot{width:12px;height:12px;border-radius:50%;background:#B8B0A0;}
.janalysis__tdot--gold{background:#B8860B; box-shadow:0 0 10px rgba(184,134,11,0.45);}
.janalysis__tline{flex:1; height:1px; background:rgba(0,27,40,0.12); margin-top:6px;}

.janalysis__explain{font-size:1rem; line-height:1.75; color:#3E3527; max-width:600px;}
.janalysis__explain strong{color:#B8860B; font-weight:700;}

/* ---- CTA "Continuar con el Paso 2" — protagonista, no un link más ---- */
.janalysis__next{
  display:flex; align-items:center; justify-content:center; gap:10px;
  width:100%;
  margin-top:20px;
  padding:18px 30px;
  border-radius:100px;
  border:none;
  background:linear-gradient(135deg, #B8860B, #D9A93B);
  color:#001B28;
  font-family:var(--sans); font-weight:800; font-size:0.96rem; text-align:center;
  box-shadow:0 16px 36px rgba(184,134,11,0.30);
  opacity:0; transform:translateY(14px) scale(0.98); pointer-events:none;
  transition:opacity .5s ease, transform .4s cubic-bezier(.2,.8,.2,1), box-shadow .3s ease, background .3s ease;
  cursor:pointer;
}
.janalysis__next svg{width:18px;height:18px;flex-shrink:0;transition:transform .25s ease;}
.janalysis__next.jub-in{
  opacity:1; transform:translateY(0) scale(1); pointer-events:auto;
  animation:janalysisNextPulse 2.8s ease-in-out 1.1s infinite;
}
.janalysis__next:hover{
  transform:translateY(-3px) scale(1.015);
  box-shadow:0 22px 48px rgba(184,134,11,0.46);
  background:linear-gradient(135deg, #C99400, #FFDE8A);
  animation-play-state:paused;
}
.janalysis__next:hover svg{transform:translateX(4px);}
@keyframes janalysisNextPulse{
  0%,100%{box-shadow:0 16px 36px rgba(184,134,11,0.30);}
  50%{box-shadow:0 16px 36px rgba(184,134,11,0.52);}
}

@media (max-width:640px){
  .janalysis{padding-top:26px;}
  .janalysis__cards{grid-template-columns:1fr;}
  .janalysis__insights{grid-template-columns:1fr;}
  .janalysis__timeline{flex-wrap:wrap; row-gap:12px;}
  .janalysis__tpoint{width:auto;}
  .janalysis__tline{display:none;}
}
@media (prefers-reduced-motion: reduce){
  .janalysis, .jcard, .jinsight, .janalysis__next{transition:none; animation:none;}
}

/* ---- sombra cálida unificada de la tarjeta de la calculadora ---- */
.calculadora--light .calc-card.glow-border{
  box-shadow:0 0 0 1px rgba(184,134,11,0.14) inset, 0 30px 60px rgba(184,134,11,0.10), 0 14px 32px rgba(0,27,40,0.07);
}

/* =========================================================
   CENTRO DE PLANIFICACIÓN DE JUBILACIÓN
   (reemplaza visualmente a la Calculadora de Jubilación)
========================================================= */
.jubcentro{padding:80px 24px 88px;}
.jubcentro__inner{max-width:var(--container); margin:0 auto;}
.jubcentro--light{background:#F4EDDC;}

.jubcentro__head{text-align:center;max-width:720px;margin:0 auto 26px;}
.jubcentro__kicker{
  font-family:var(--mono); font-weight:600; letter-spacing:0.14em; text-transform:uppercase;
  color:#B8860B; font-size:0.8rem; margin-bottom:18px;
}
.jubcentro__title-solid{
  font-size:clamp(1.9rem,3.8vw,2.7rem); line-height:1.25; color:var(--hero-navy,#001B28);
}
.jubcentro__sub{
  margin-top:22px; font-size:clamp(1.05rem,2vw,1.25rem); font-weight:500;
  color:#3E3527; line-height:1.6; max-width:620px; margin-left:auto; margin-right:auto;
}

/* ---- entrada secuencial (título → subtítulo → línea → módulos) ---- */
.jubcentro__kicker, .jubcentro__title-solid, .jubcentro__sub{
  opacity:0; transform:translateY(16px);
  transition:opacity .55s ease, transform .55s ease;
}
.jubcentro__kicker.jub-in, .jubcentro__title-solid.jub-in, .jubcentro__sub.jub-in{
  opacity:1; transform:translateY(0);
}

/* ---- grid / stepper de módulos ---- */
.jubgrid{
  position:relative;
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:22px;
  list-style:none;
}
/* línea conectora — base tenue + progreso dorado que se ilumina según el hover */
.jubline-base, .jubline-progress{
  position:absolute;
  top:98px; left:calc(12.5% + 4px); right:calc(12.5% + 4px);
  height:2px; z-index:0;
}
.jubline-base{
  background:rgba(184,134,11,0.18);
  transform:scaleX(0); transform-origin:left center;
  transition:transform .5s ease;
}
.jubline-base.jub-in{transform:scaleX(1);}
.jubline-progress{
  background:linear-gradient(90deg, #B8860B, #D9A93B);
  transform:scaleX(var(--p,0)); transform-origin:left center;
  transition:transform .45s cubic-bezier(.2,.8,.2,1);
}
@media (max-width:900px){ .jubline-base, .jubline-progress{display:none;} }

.jubmod{
  position:relative;
  z-index:1;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  text-align:left;
  background:rgba(255,255,255,0.55);
  border:1px solid rgba(0,27,40,0.08);
  border-radius:var(--r-lg);
  padding:32px 26px 30px;
  opacity:0; transform:translateY(24px);
  transition:opacity .5s ease, transform .4s cubic-bezier(.2,.8,.2,1), box-shadow .35s ease, border-color .35s ease, background .35s ease;
}
.jubmod.jub-in{opacity:1; transform:translateY(0);}

/* halo radial detrás del ícono, aparece en hover */
.jubmod::before{
  content:""; position:absolute; top:26px; left:26px; width:80px; height:80px;
  background:radial-gradient(circle, rgba(184,134,11,0.28), transparent 70%);
  opacity:0; transition:opacity .35s ease; z-index:-1; pointer-events:none;
}

/* la tarjeta bajo el cursor se convierte en protagonista; el resto atenúa un poco */
.jubgrid:hover .jubmod.jub-in{opacity:0.95;}
.jubgrid .jubmod:hover, .jubgrid .jubmod:focus-visible{
  opacity:1 !important;
  transform:translateY(-8px) scale(1.02);
  box-shadow:0 28px 54px rgba(0,27,40,0.16), 0 0 0 1px rgba(184,134,11,0.3);
  border-color:rgba(184,134,11,0.5);
  background:rgba(255,255,255,0.9);
}
.jubmod:hover::before{opacity:1;}

.jubmod__step{
  font-family:var(--mono); font-size:0.68rem; font-weight:600; letter-spacing:0.06em; text-transform:uppercase;
  color:#B8860B; margin-bottom:18px; display:inline-flex; align-items:center; gap:6px;
}
.jubmod__icon{
  position:relative;
  width:54px; height:54px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  background:#F4EDDC;
  border:1px solid rgba(184,134,11,0.35);
  color:#B8860B;
  margin-bottom:22px;
  transition:background .35s ease, color .35s ease, transform .35s ease;
}
.jubmod__icon svg{width:24px;height:24px;transition:transform .3s ease;}
.jubmod:hover .jubmod__icon{
  background:linear-gradient(135deg,#B8860B,#D9A93B);
  color:#001B28;
  transform:scale(1.08) rotate(4deg);
}

/* ---- candado discreto (Pasos 2-4, mientras no se complete el Paso 1) ---- */
.jubmod__lock{
  width:12px; height:12px; flex-shrink:0; opacity:0.55; color:#B8860B;
  display:none;
}
.jubmod--locked .jubmod__lock{display:inline-block;}

/* ---- check del Paso 1 (aparece al completarlo) ---- */
.jubmod__check{
  position:absolute; top:-4px; right:-4px; width:20px; height:20px; border-radius:50%;
  background:var(--hero-navy,#001B28);
  display:flex; align-items:center; justify-content:center;
  opacity:0; transform:scale(.4);
  transition:opacity .25s ease, transform .25s ease;
  box-shadow:0 4px 10px rgba(0,27,40,0.35);
}
.jubmod__check svg{width:11px; height:11px; color:#FFBD00;}
.jubmod--completed .jubmod__check{opacity:1; transform:scale(1);}

/* personalidad propia por ícono, al pasar el cursor */
@keyframes jubPulse{0%{transform:scale(1);}50%{transform:scale(1.22);}100%{transform:scale(1);}}
@keyframes jubCoinTilt{0%{transform:rotate(0);}50%{transform:rotate(14deg);}100%{transform:rotate(0);}}
@keyframes jubCompassSwing{0%{transform:rotate(0);}50%{transform:rotate(-12deg);}100%{transform:rotate(0);}}
.jubmod:nth-of-type(1):hover .jubmod__icon svg{animation:jubPulse .5s ease;}
.jubmod:nth-of-type(2) .jubmod__icon svg rect{transform-box:fill-box; transform-origin:50% 100%; transition:transform .3s ease;}
.jubmod:nth-of-type(2):hover .jubmod__icon svg rect:nth-of-type(1){transform:scaleY(1.15);}
.jubmod:nth-of-type(2):hover .jubmod__icon svg rect:nth-of-type(2){transform:scaleY(1.3); transition-delay:.06s;}
.jubmod:nth-of-type(2):hover .jubmod__icon svg rect:nth-of-type(3){transform:scaleY(1.45); transition-delay:.12s;}
.jubmod:nth-of-type(3):hover .jubmod__icon svg{animation:jubCoinTilt .5s ease;}
.jubmod:nth-of-type(4):hover .jubmod__icon svg{animation:jubCompassSwing .55s ease;}

.jubmod h3{
  font-size:1.05rem; line-height:1.35; color:var(--hero-navy,#001B28); margin-bottom:12px; min-height:2.7em;
}
.jubmod p{font-size:0.88rem; color:#5A5140; margin-bottom:26px; flex-grow:1;}

.jubmod__cta{
  display:inline-flex; align-items:center; gap:8px;
  font-family:var(--sans); font-weight:700; font-size:0.85rem; color:#B8860B;
  padding-bottom:2px; border-bottom:1px solid rgba(184,134,11,0.35);
  transition:gap .25s ease, color .25s ease, border-color .25s ease;
}
.jubmod__arrow{width:15px;height:15px;flex-shrink:0;transition:transform .25s ease;}
.jubmod:hover .jubmod__cta{gap:12px; color:#8C6A08; border-color:rgba(140,106,8,0.6);}

/* Módulo final — se distingue por borde/badge, no por un botón de otro peso */
.jubmod--final{
  background:linear-gradient(160deg, rgba(184,134,11,0.10), rgba(255,255,255,0.6));
  border:1px solid rgba(184,134,11,0.4);
}
.jubmod--final:hover{
  box-shadow:0 28px 58px rgba(184,134,11,0.24), 0 0 0 1px rgba(184,134,11,0.55);
}
.jubmod__badge{
  position:absolute; top:-13px; right:22px;
  background:linear-gradient(135deg, var(--gold), var(--gold-2));
  color:var(--navy-0); font-family:var(--mono); font-size:0.62rem; font-weight:700;
  letter-spacing:0.04em; text-transform:uppercase; padding:6px 12px; border-radius:20px;
  box-shadow:0 6px 16px rgba(184,134,11,0.35);
}
.jubmod--final .jubmod__icon{
  background:linear-gradient(135deg,#B8860B,#D9A93B); color:#001B28; border-color:transparent;
}

/* ---- Paso 1 activo (mientras el panel inline está abierto) ---- */
.jubmod--active{
  border-color:rgba(184,134,11,0.55);
  background:rgba(255,255,255,0.85);
  box-shadow:0 20px 40px rgba(0,27,40,0.12), 0 0 0 1px rgba(184,134,11,0.35);
}
.jubmod--active .jubmod__icon{
  background:linear-gradient(135deg,#B8860B,#D9A93B); color:#001B28; border-color:transparent;
}
.jubmod--active .jubmod__arrow{transform:rotate(90deg);}
.jubmod--active:hover .jubmod__arrow{transform:rotate(90deg);}

/* ---- pulso breve al llegar desde "Continuar con el Paso 2" del análisis ---- */
@keyframes jubModPulse{
  0%{box-shadow:0 0 0 0 rgba(184,134,11,0.5);}
  70%{box-shadow:0 0 0 14px rgba(184,134,11,0);}
  100%{box-shadow:0 0 0 0 rgba(184,134,11,0);}
}
.jubmod--pulse{animation:jubModPulse 1.1s ease-out;}

/* ---- Panel inline del Paso 1 — despliegue suave, misma página ---- */
.jubpanel{
  display:grid;
  grid-template-rows:0fr;
  opacity:0;
  transition:grid-template-rows .45s cubic-bezier(.22,.61,.36,1), opacity .4s ease, margin-top .45s ease;
}
.jubpanel__inner{overflow:hidden; min-height:0;}
.jubpanel.is-open{
  grid-template-rows:1fr;
  opacity:1;
  margin-top:30px;
}
/* la calculadora reutilizada pierde su padding de sección propia — ya vive dentro del panel */
.calculadora--inline{padding:0;background:transparent;}

.jubcentro__foot{
  text-align:center; margin-top:52px; font-size:0.92rem; color:#5A5140;
}
.jubcentro__foot a{color:#B8860B; font-weight:700; border-bottom:1px solid rgba(184,134,11,0.35); padding-bottom:1px;}
.jubcentro__foot a:hover{color:#8C6A08;}

@media (max-width:900px){
  .jubgrid{grid-template-columns:1fr 1fr;}
  .jubmod h3{min-height:0;}
}
@media (max-width:560px){
  .jubgrid{grid-template-columns:1fr;}
  .jubcentro{padding:80px 20px 90px;}
  .jubcentro__head{margin-bottom:28px;}
}
@media (prefers-reduced-motion: reduce){
  .jubcentro__kicker, .jubcentro__title-solid, .jubcentro__sub, .jubline-base, .jubmod{
    transition:none; opacity:1; transform:none;
  }
}

/* =========================================================
   MODAL — Paso bloqueado (Centro de Planificación)
========================================================= */
.jublock-modal{
  position:fixed; inset:0; z-index:300;
  display:flex; align-items:center; justify-content:center;
  padding:24px;
  opacity:0; pointer-events:none;
  transition:opacity .3s ease;
}
.jublock-modal.is-open{opacity:1; pointer-events:auto;}
.jublock-modal__overlay{
  position:absolute; inset:0;
  background:rgba(0,11,18,0.55);
  backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px);
}
.jublock-modal__card{
  position:relative; z-index:1;
  background:#fff; color:#001B28;
  max-width:440px; width:100%;
  border-radius:22px;
  padding:40px 36px 34px;
  box-shadow:0 40px 90px rgba(0,11,18,0.35);
  text-align:left;
  transform:scale(0.94) translateY(10px);
  opacity:0;
  transition:transform .35s cubic-bezier(.2,.8,.2,1), opacity .3s ease;
}
.jublock-modal.is-open .jublock-modal__card{transform:scale(1) translateY(0); opacity:1;}
.jublock-modal__eyebrow{
  font-family:var(--mono); font-weight:600; letter-spacing:0.08em; text-transform:uppercase;
  color:#B8860B; font-size:0.78rem; margin-bottom:14px;
}
.jublock-modal__text{font-size:0.95rem; line-height:1.65; color:#3E3527; margin-bottom:14px;}
.jublock-modal__text--sub{color:#6B6250; font-size:0.88rem; margin-bottom:26px;}
.jublock-modal__actions{display:flex; flex-direction:column; gap:12px;}
.jublock-modal__secondary{
  background:none; border:none; color:#8C8272; font-family:var(--sans); font-weight:600;
  font-size:0.88rem; padding:8px; cursor:pointer; transition:color .2s ease;
}
.jublock-modal__secondary:hover{color:#3E3527;}
@media (max-width:480px){
  .jublock-modal__card{padding:30px 24px 26px; border-radius:18px;}
}
@media (prefers-reduced-motion: reduce){
  .jublock-modal, .jublock-modal__card{transition:none;}
}

/* =========================================================
   PPA METHOD
========================================================= */
.metodo{padding:72px 24px; text-align:center;}
.metodo__inner{max-width:var(--container); margin:0 auto;}
.metodo__kicker{
  font-family:var(--mono); font-weight:600; letter-spacing:0.06em; text-transform:uppercase;
  color:var(--gold); font-size:clamp(1rem,2vw,1.25rem); margin-bottom:14px;
}
.metodo__title{font-size:clamp(2.4rem,4.6vw,3.5rem);letter-spacing:0.01em;}
.metodo__lead{max-width:700px;margin:16px auto 40px;font-size:1.05rem;}
.metodo__pillars{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;text-align:left;}
.pillar__index{color:var(--gold);font-size:2.4rem;font-weight:700;letter-spacing:0.02em;display:block;margin-bottom:12px;opacity:0.85;line-height:1;}

/* Alternating light background — brand cream/gold tone, breaks the dark-navy rhythm */
.metodo--light{
  background:linear-gradient(180deg, #F4EDDC 0%, #EFE6D0 100%);
}
.metodo--light .metodo__title{color:var(--hero-navy, #001B28);}
.metodo--light .metodo__lead{color:#4A4030;}
.metodo--light .metodo__kicker{color:#B8860B;}
.neon-card--light{
  background:rgba(255,255,255,0.5);
  border:1px solid rgba(0,27,40,0.08);
}
.neon-card--light h3{color:#001B28;}
.neon-card--light p{color:#5A5140;}
.neon-card--light .pillar__index{color:#B8860B;opacity:1;}
.neon-card--light:hover{
  border-color:rgba(184,134,11,0.5);
  box-shadow:0 0 40px rgba(184,134,11,0.15), 0 20px 40px rgba(0,0,0,0.08);
}

@media (max-width:800px){.metodo__pillars{grid-template-columns:1fr;}}

/* =========================================================
   CÓMO TRABAJO — horizontal interactive timeline
========================================================= */
.proceso{padding:72px 24px 84px; max-width:var(--container); margin:0 auto; text-align:center;}
.proceso__kicker{
  font-family:var(--mono); font-weight:600; letter-spacing:0.06em; text-transform:uppercase;
  color:var(--gold); font-size:clamp(1.4rem,3vw,2rem); margin-bottom:16px;
}
.proceso__title{font-size:clamp(1.7rem,3.2vw,2.3rem); max-width:820px; margin:0 auto 56px; line-height:1.4;}

.h-timeline{position:relative;height:400px;max-width:1140px;margin:0 auto;}
.h-timeline__wave{position:absolute;inset:0;width:100%;height:100%;z-index:0;}

.h-step{
  position:absolute;
  left:var(--x);
  top:0;
  height:100%;
  transform:translateX(-50%);
  width:210px;
  z-index:1;
}
.h-step__node{
  position:absolute; left:50%; transform:translate(-50%,-50%);
  width:64px;height:64px;border-radius:50%;flex-shrink:0;
  background:var(--accent);
  border:4px solid rgba(255,255,255,0.9);
  display:flex;align-items:center;justify-content:center;
  box-shadow:0 0 0 8px var(--accent-soft), 0 12px 30px rgba(0,0,0,0.35);
  transition:transform .3s ease, box-shadow .3s ease;
}
.h-step__node svg{width:26px;height:26px;}
.h-step--up .h-step__node{top:34%;}
.h-step--down .h-step__node{top:66%;}
.h-step:hover .h-step__node{
  transform:translate(-50%,-50%) scale(1.15) rotate(-6deg);
  box-shadow:0 0 0 12px var(--accent-soft), 0 16px 36px rgba(0,0,0,0.4);
}

.h-step__content{
  position:absolute; left:50%; transform:translateX(-50%); width:100%;
  text-align:center;
}
.h-step--up .h-step__content{top:0;}
.h-step--down .h-step__content{top:calc(66% + 46px);}
.h-step__content h3{
  font-size:0.95rem;margin-bottom:8px;line-height:1.3;font-weight:700;
  color:var(--accent);
  transition:color .25s ease;
}
.h-step__content p{font-size:0.78rem;line-height:1.5;}

@media (max-width:900px){
  .h-timeline{height:auto;}
  .h-timeline__wave{display:none;}
  .h-step{
    position:relative; left:0; top:auto; height:auto; transform:none;
    display:flex; flex-direction:row; align-items:flex-start; text-align:left;
    width:100%; gap:20px; margin-bottom:28px;
  }
  .h-step__node{position:static; transform:none; margin:0; flex-shrink:0; order:1;}
  .h-step:hover .h-step__node{transform:scale(1.08);}
  .h-step__content{position:static; transform:none; width:auto; text-align:left; order:2;}
  .h-step__content h3{font-size:1rem;}
  .h-step__content p{font-size:0.85rem;}
}


/* =========================================================
   SOBRE MÍ
========================================================= */
.sobremi{padding:72px 24px;}
.sobremi__inner{display:grid;grid-template-columns:0.8fr 1.2fr;gap:60px;align-items:start;max-width:var(--container);margin:0 auto;}
.sobremi__photo{position:sticky;top:110px;}
.sobremi__photo img{
  border-radius:var(--r-lg); aspect-ratio:4/5; object-fit:cover;
  border:1px solid rgba(255,189,0,0.25);
  box-shadow:0 0 60px rgba(255,189,0,0.1);
}
.sobremi__copy h2{font-size:clamp(2rem,3.6vw,2.8rem);margin-bottom:6px;}
.sobremi__lead{font-style:italic;color:var(--gold);font-size:1.1rem;margin-bottom:22px;display:block;}
.sobremi__copy p{font-size:0.96rem;line-height:1.65;margin-bottom:15px;}
.sobremi__copy p:last-child{margin-bottom:0;}

/* Alternating light background */
.sobremi--light{background:#F4EDDC;}
.sobremi--light .sobremi__copy h2{color:var(--hero-navy,#001B28);}
.sobremi--light .sobremi__copy p{color:#4A4030;}
.sobremi--light .eyebrow{color:#B8860B;}
.sobremi--light .sobremi__lead{color:#B8860B;}

@media (max-width:900px){
  .sobremi__inner{grid-template-columns:1fr;gap:32px;}
  .sobremi__photo{position:static;max-width:300px;margin:0 auto;}
}

/* =========================================================
   MURO DE EVIDENCIAS — infinite scrolling photo wall
========================================================= */
.muro{padding:72px 0 76px;text-align:center;overflow:hidden;}
.muro__eyebrow{font-size:clamp(1.6rem,3.2vw,1.95rem);letter-spacing:0.1em;}
.muro__title{font-size:clamp(1.9rem,3.6vw,2.6rem);max-width:700px;margin:0 auto 18px;}
.muro__sub{font-size:1rem;max-width:640px;margin:0 auto 40px;color:var(--ink-dim);}

/* Alternating light background */
.muro--light{background:#F4EDDC;}
.muro--light .muro__title{color:var(--hero-navy,#001B28);}
.muro--light .muro__sub{color:#4A4030;}
.muro--light .eyebrow{color:#B8860B;}
.muro--light .muro-photo{border-color:rgba(0,27,40,0.1);}

.muro__wall{
  overflow:hidden;
  max-width:100%;
  -webkit-mask-image:linear-gradient(90deg, transparent 0, #000 6%, #000 94%, transparent 100%);
  mask-image:linear-gradient(90deg, transparent 0, #000 6%, #000 94%, transparent 100%);
}
.muro-track{
  display:flex; align-items:center; gap:20px; width:max-content;
  animation:muroScrollX 48s linear infinite;
  will-change:transform;
}
.muro-track__img{
  height:280px; width:auto; flex-shrink:0;
  border-radius:14px; display:block; object-fit:cover;
  border:1px solid var(--glass-border);
}
.muro--light .muro-track__img{border-color:rgba(0,27,40,0.1);}
@keyframes muroScrollX{
  from{transform:translateX(0);}
  to{transform:translateX(-50%);}
}

@media (max-width:1024px){
  .muro-track__img{height:220px;}
}
@media (max-width:640px){
  .muro-track__img{height:170px;}
  .muro-track{gap:14px;}
}
.testimonios{padding:72px 24px;text-align:center;}
.testimonios .eyebrow{font-size:1.15rem;letter-spacing:0.1em;}
.testimonios__inner{max-width:var(--container);margin:0 auto;}
.testimonios__title{font-size:clamp(1.9rem,3.6vw,2.6rem);margin-bottom:40px;max-width:var(--container);margin-left:auto;margin-right:auto;}
.testimonios__grid{
  max-width:var(--container); margin:0 auto;
  display:grid;grid-template-columns:repeat(3,1fr);gap:26px;text-align:left;
}

.testi-card{
  border-radius:18px;
  overflow:hidden;
  background:rgba(255,255,255,0.03);
  border:2px solid transparent;
  transition:transform .3s ease, box-shadow .3s ease, border-color .3s ease;
}
.testi-card--gold{
  border-color:rgba(255,189,0,0.4);
  box-shadow:0 0 0 1px rgba(255,189,0,0.12) inset, 0 0 30px rgba(255,189,0,0.12);
}
.testi-card--blue{
  border-color:rgba(79,195,247,0.4);
  box-shadow:0 0 0 1px rgba(79,195,247,0.12) inset, 0 0 30px rgba(79,195,247,0.12);
}
.testi-card:hover{transform:translateY(-6px);}
.testi-card--gold:hover{box-shadow:0 0 0 1px rgba(255,189,0,0.25) inset, 0 0 46px rgba(255,189,0,0.28), 0 20px 40px rgba(0,0,0,0.35);}
.testi-card--blue:hover{box-shadow:0 0 0 1px rgba(79,195,247,0.25) inset, 0 0 46px rgba(79,195,247,0.28), 0 20px 40px rgba(0,0,0,0.35);}

.testi-card__video{
  position:relative; width:100%; aspect-ratio:16/9; background:#000;
}
.testi-card__video video{
  width:100%; height:100%; display:block; object-fit:cover; background:#000;
}
.testi-card__body{padding:22px 22px 26px;}
.testi-card__body h3{
  font-size:1.02rem; margin-bottom:10px; color:var(--ink);
}
.testi-card__body h3 span{
  display:block; font-size:0.72rem; font-weight:500; letter-spacing:0.03em;
  color:var(--gold); margin-top:3px; text-transform:uppercase; font-family:var(--mono);
}
.testi-card__body p{font-style:italic;color:var(--ink-dim);font-size:0.92rem;line-height:1.55;}

@media (max-width:900px){.testimonios__grid{grid-template-columns:1fr;}}

/* =========================================================
   FAQ — minimalist premium accordion
========================================================= */
.faq{padding:72px 24px;}
.faq__inner{max-width:900px;margin:0 auto;}
.faq__eyebrow{font-size:1.15rem;letter-spacing:0.1em;}
.faq__title{
  text-align:center;font-size:clamp(1.6rem,3.4vw,2.3rem);margin-bottom:40px;
  white-space:nowrap;
}

.faq__list{display:flex;flex-direction:column;gap:14px;}

.faq-item{
  background:rgba(255,255,255,0.03);
  border:1px solid var(--glass-border);
  border-radius:14px;
  transition:border-color .2s ease, background .2s ease;
}
.faq-item:hover{background:rgba(255,255,255,0.05);border-color:rgba(255,255,255,0.14);}
.faq-item.is-open{border-color:rgba(255,189,0,0.35);}

/* Alternating light background */
.faq--light{background:#F4EDDC;}
.faq--light .faq__title{color:var(--hero-navy,#001B28);}
.faq--light .eyebrow{color:#B8860B;}
.faq--light .faq-item{background:rgba(255,255,255,0.5);border-color:rgba(0,27,40,0.1);}
.faq--light .faq-item:hover{background:rgba(255,255,255,0.75);border-color:rgba(0,27,40,0.16);}
.faq--light .faq-item.is-open{border-color:rgba(184,134,11,0.4);}
.faq--light .faq-item__q{color:#001B28;}
.faq--light .faq-item__icon::before, .faq--light .faq-item__icon::after{background:#B8860B;}
.faq--light .faq-item__panel-inner p{color:#4A4030;}

.faq-item__header{
  all:unset;
  box-sizing:border-box;
  display:flex; align-items:center; justify-content:space-between; gap:24px;
  width:100%; padding:26px 28px;
  cursor:pointer;
}
.faq-item__q{
  font-size:1.05rem; font-weight:700; color:var(--ink); line-height:1.4; text-align:left;
}
.faq-item__icon{
  position:relative; flex-shrink:0; width:22px; height:22px;
}
.faq-item__icon::before, .faq-item__icon::after{
  content:""; position:absolute; top:50%; left:50%;
  background:var(--gold);
  transform:translate(-50%,-50%);
  transition:transform .25s ease;
}
.faq-item__icon::before{width:14px;height:2px;}
.faq-item__icon::after{width:2px;height:14px;}
.faq-item.is-open .faq-item__icon::after{transform:translate(-50%,-50%) rotate(90deg) scale(0);}
.faq-item.is-open .faq-item__icon::before{transform:translate(-50%,-50%) rotate(180deg);}

.faq-item__panel{
  display:grid;
  grid-template-rows:0fr;
  transition:grid-template-rows .28s ease;
}
.faq-item.is-open .faq-item__panel{grid-template-rows:1fr;}
.faq-item__panel-inner{overflow:hidden;}
.faq-item__panel-inner p{
  padding:0 28px 26px; font-size:0.95rem; line-height:1.7; color:var(--ink-dim);
  max-width:680px;
}

@media (max-width:640px){
  .faq__title{white-space:normal;}
  .faq-item__header{padding:20px 20px;}
  .faq-item__q{font-size:0.98rem;}
  .faq-item__panel-inner p{padding:0 20px 22px;}
}


/* =========================================================
   AGENDA
========================================================= */
.agenda{padding:84px 24px 96px;text-align:center;position:relative;}
.agenda__inner{max-width:760px;margin:0 auto;position:relative;z-index:1;}
.agenda__inner h2{font-size:clamp(2rem,4.2vw,3rem);margin-bottom:16px;}
.agenda__lead{font-size:1.05rem;margin-bottom:28px;}

/* Alternating light background — follows FAQ (dark) */
.agenda__eyebrow{font-size:1.15rem;letter-spacing:0.1em;}
.agenda__title-solid{color:#4FC3F7;}

.agenda__calendly-wrap{
  display:grid; grid-template-rows:0fr;
  transition:grid-template-rows .35s ease;
}
.agenda__calendly-wrap.is-open{grid-template-rows:1fr;}
.agenda__calendly-inner{overflow:hidden;}
.agenda__calendly-inner > div{
  padding:36px 24px 0; max-width:1300px; margin:0 auto;
}
.agenda__calendly-inner .calendly-inline-widget{border-radius:16px;overflow:hidden;margin:0 auto;}
.agenda__calendly-inner .calendly-inline-widget iframe{width:100% !important;height:100% !important;border:none;}

@media (max-width:640px){
  .agenda__calendly-inner .calendly-inline-widget{height:640px !important;}
}

/* =========================================================
   FOOTER — premium, 4 columns
========================================================= */
.footer{padding:64px 24px 0;border-top:1px solid var(--glass-border);background:#001823;}
.footer__inner{
  max-width:var(--container);margin:0 auto;display:grid;grid-template-columns:1.6fr 1fr 2fr;gap:60px;
  padding-bottom:56px;
}
.footer__brand{display:flex;flex-direction:column;}
.footer__logo{width:100%;max-width:280px;height:auto;margin-bottom:26px;}
.footer__social{display:flex;gap:12px;}
.footer__social-icon{
  width:38px;height:38px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  border:1px solid var(--glass-border);
  color:var(--ink-dim);
  transition:color .2s ease, border-color .2s ease, transform .2s ease;
}
.footer__social-icon svg{width:17px;height:17px;}
.footer__social-icon:hover{color:var(--gold);border-color:rgba(255,189,0,0.5);transform:translateY(-2px);}

.footer__col h4{
  font-family:var(--mono);font-size:0.7rem;text-transform:uppercase;letter-spacing:0.1em;
  color:var(--gold);margin-bottom:22px;font-weight:600;
}
.footer__col a{display:block;margin-bottom:14px;font-size:0.9rem;color:var(--ink-dim);transition:color .2s;}
.footer__col a:hover{color:var(--gold);}
.footer__location{display:block;font-size:0.9rem;color:var(--ink-faint);margin-top:4px;}

.footer__toolscontact{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-content:start;}
.footer__toolscontact .footer__tagline{grid-column:1 / -1;}
.footer__tagline{
  font-size:0.92rem;line-height:1.6;color:var(--ink-faint);font-style:italic;
  margin-top:32px;padding-top:28px;border-top:1px solid var(--glass-border);
  max-width:420px;
}

.footer__legal{
  max-width:var(--container);margin:0 auto;
  border-top:1px solid var(--glass-border);
  padding:28px 0 40px;
  display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:16px;
  font-size:0.8rem;color:var(--ink-faint);
}
.footer__legal-links{display:flex;gap:26px;flex-wrap:wrap;}
.footer__legal-links a{color:var(--ink-faint);transition:color .2s;}
.footer__legal-links a:hover{color:var(--gold);}

@media (max-width:900px){
  .footer__inner{grid-template-columns:1fr 1fr;row-gap:44px;}
  .footer__brand{grid-column:1 / -1;}
  .footer__logo{max-width:220px;}
  .footer__toolscontact{grid-column:1 / -1;}
}
@media (max-width:560px){
  .footer__inner{grid-template-columns:1fr;}
  .footer__toolscontact{grid-template-columns:1fr;gap:36px;}
  .footer__legal{flex-direction:column;align-items:flex-start;}
}

/* =========================================================
   MOBILE NAV DRAWER
========================================================= */
@media (max-width:900px){
  .nav__links{
    position:fixed; top:0; right:-100%; height:100vh; width:80%; max-width:320px;
    background:rgba(0,11,18,0.98); backdrop-filter:blur(20px);
    flex-direction:column; padding:110px 32px; gap:28px;
    transition:right .35s ease; z-index:99; border-left:1px solid var(--glass-border);
  }
  .nav__links.is-open{right:0;}
  .nav__burger{display:flex;}
}

/* =========================================================
   MOBILE APP-STYLE BOTTOM TAB BAR
========================================================= */
.tabbar{
  display:none;
  position:fixed; left:0; right:0; bottom:0; z-index:110;
  background:rgba(0,11,18,0.85);
  backdrop-filter:blur(20px); -webkit-backdrop-filter:blur(20px);
  border-top:1px solid var(--glass-border);
  padding:10px 18px calc(10px + env(safe-area-inset-bottom));
  justify-content:space-around;
  align-items:center;
}
.tabbar__item{
  display:flex; flex-direction:column; align-items:center; gap:4px;
  color:var(--ink-faint); font-size:0.68rem; font-weight:600;
  padding:6px 14px; border-radius:14px; transition:color .2s ease;
}
.tabbar__item svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;}
.tabbar__item.is-active{color:var(--gold);}
.tabbar__item.is-active svg{filter:drop-shadow(0 0 6px rgba(255,189,0,0.6));}
.tabbar__item--cta{
  background:linear-gradient(135deg, var(--gold), var(--gold-2));
  color:var(--navy-0);
  box-shadow:0 0 20px rgba(255,189,0,0.35);
}
.tabbar__item--cta svg{stroke:var(--navy-0);}

@media (max-width:900px){
  .tabbar{display:flex;}
  body{padding-bottom:82px;}
  /* App-like rounded generous mobile spacing */
  .hero, .realidad, .jubcentro, .metodo, .proceso, .sobremi, .testimonios, .faq{
    padding-left:20px; padding-right:20px;
  }
  .neon-card{border-radius:20px;}
  .btn{padding:16px 26px;}
  .btn--lg{padding:18px 34px;}
}