/* =========================================================
   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;
}

/* Compensa la altura del nav sticky en todos los saltos de ancla (menú,
   drawer, footer), sin necesitar JavaScript. */
#top, #realidad, #metodo, #proceso, #centro-jubilacion, #sobre-mi, #testimonios, #agenda{
  scroll-margin-top:96px;
}
@media (max-width:900px){
  #top, #realidad, #metodo, #proceso, #centro-jubilacion, #sobre-mi, #testimonios, #agenda{
    scroll-margin-top:76px;
  }
}
.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;
}

/* =========================================================
   BREADCRUMB — solo en las páginas SEO independientes (no en la home)
========================================================= */
.cj-breadcrumb{background:var(--navy-0); border-bottom:1px solid var(--glass-border); padding:14px 0;}
.cj-breadcrumb__inner{
  max-width:var(--container); margin:0 auto; padding:0 24px;
  display:flex; align-items:center; gap:10px;
  font-family:var(--mono); font-size:0.78rem; color:var(--ink-faint); letter-spacing:0.02em;
}
.cj-breadcrumb__inner a{color:var(--ink-faint); transition:color .2s ease;}
.cj-breadcrumb__inner a:hover{color:var(--gold);}
.cj-breadcrumb__sep{opacity:0.5;}
.cj-breadcrumb__current{color:var(--ink-dim); font-weight:600;}

.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;}}

/* =========================================================
   CENTRO DE JUBILACIÓN PERÚ — Workspace premium (sin navegación,
   sin recarga, sin modales para cambiar de herramienta). Inspirado
   en Apple / Stripe / Notion / Linear: un único bloque de contenido
   que se transforma dinámicamente.
========================================================= */
.cjperu{padding:72px 24px;}
.cjperu--light{background:#F4EDDC;}
.cjperu__inner{max-width:880px; margin:0 auto;}
.cjperu__head{text-align:center; margin:0 auto 44px;}
.cjperu__kicker{
  font-family:var(--mono); font-weight:600; letter-spacing:0.1em; text-transform:uppercase;
  color:#B8860B; font-size:0.8rem; margin-bottom:14px;
}
.cjperu__title-solid{font-size:clamp(1.9rem,3.8vw,2.6rem); line-height:1.25; color:var(--hero-navy,#001B28);}
.cjperu__sub{margin-top:18px; font-size:1.02rem; color:#5A5140; line-height:1.6;}
.cjperu__foot{text-align:center; margin-top:28px; font-size:0.88rem;}
.cjperu__foot a{color:#8C8272; border-bottom:1px solid rgba(140,130,114,0.35); padding-bottom:1px; transition:color .2s ease;}
.cjperu__foot a:hover{color:#5A5140;}

/* ---- Contenedor del workspace ---- */
.cjws{
  background:#FFFFFF;
  border:1px solid rgba(0,27,40,0.07);
  border-radius:28px;
  box-shadow:0 30px 70px rgba(184,134,11,0.08), 0 10px 26px rgba(0,27,40,0.05);
  overflow:hidden;
}

/* ---- Tabs premium: siempre visibles, estado activo permanente ---- */
.cjws__tabs{display:flex; gap:8px; padding:12px; border-bottom:1px solid rgba(0,27,40,0.06); background:#FBFAF7;}
.cjws__tab{
  position:relative; flex:1 1 0; min-width:0; display:flex; align-items:center; gap:10px;
  padding:12px 14px; border:1px solid rgba(0,27,40,0.08); border-radius:14px; background:#fff; cursor:pointer;
  text-align:left; box-shadow:0 1px 3px rgba(0,27,40,0.04);
  transition:border-color .25s ease, box-shadow .25s ease, transform .2s ease;
}
.cjws__tab:hover{border-color:rgba(0,27,40,0.18); transform:translateY(-1px); box-shadow:0 4px 10px rgba(0,27,40,0.06);}
.cjws__tab-icon{
  flex-shrink:0; width:32px; height:32px; border-radius:10px;
  display:flex; align-items:center; justify-content:center;
  background:#F4EDDC; color:#B8860B; transition:background .3s ease, color .3s ease;
}
.cjws__tab-icon svg{width:15px; height:15px;}
.cjws-tab-copy{display:flex; flex-direction:column; gap:1px; min-width:0; flex:1;}
.cjws-tab-title{font-family:var(--sans); font-weight:700; font-size:0.82rem; color:#001B28; line-height:1.3; transition:color .3s ease;}
.cjws-tab-sub{font-size:0.71rem; color:#8C8272; line-height:1.3; transition:color .3s ease;}
.cjws__tab-check{
  position:absolute; top:-6px; right:-6px; width:18px; height:18px; border-radius:50%;
  background:#3F7D3F; display:flex; align-items:center; justify-content:center;
  opacity:0; transform:scale(.5); transition:opacity .25s ease, transform .25s ease;
  box-shadow:0 4px 10px rgba(0,0,0,0.15);
}
.cjws__tab-check svg{width:9px; height:9px; color:#fff;}
.cjws__tab.has-result .cjws__tab-check{opacity:1; transform:scale(1);}

.cjws__tab.is-active{
  border-color:rgba(0,27,40,0.14);
  box-shadow:0 6px 16px rgba(0,27,40,0.08);
}
.cjws__tab.is-active .cjws__tab-icon{background:#B8860B; color:#fff;}
.cjws__tab.is-active .cjws-tab-title{color:#001B28;}
.cjws__tab.is-active .cjws-tab-sub{color:#8C8272;}
.cjws__tab::before{
  content:""; position:absolute; top:0; left:14px; right:14px; height:3px; border-radius:0 0 3px 3px;
  background:#B8860B; transform:scaleX(0); transform-origin:center; transition:transform .3s cubic-bezier(.22,.61,.36,1);
}
.cjws__tab.is-active::before{transform:scaleX(1);}

/* ---- Panel dinámico: altura animada por JS, nunca fija ---- */
.cjws__panel{position:relative; overflow:hidden; transition:height .38s cubic-bezier(.22,.61,.36,1);}
.cjws__tool{display:none; padding:38px 40px 42px;}
.cjws__tool.is-active{display:block;}

.cjws__input-view, .cjws__results-view{display:none; opacity:0; transform:translateY(8px);}
.cjws__input-view.is-active, .cjws__results-view.is-active{
  display:block; animation:cjwsFadeIn .4s cubic-bezier(.22,.61,.36,1) forwards;
}
.cjws__input-view.is-leaving{animation:cjwsFadeOut .2s ease forwards;}
@keyframes cjwsFadeIn{from{opacity:0; transform:translateY(10px);} to{opacity:1; transform:translateY(0);}}
@keyframes cjwsFadeOut{from{opacity:1; transform:translateY(0);} to{opacity:0; transform:translateY(-6px);}}

/* ---- Estado de carga breve del botón, antes de revelar el resultado ---- */
.cjws__submit.is-loading{ pointer-events:none; opacity:0.86; }
.cjws__submit.is-loading .cjws__submit-label{ visibility:hidden; }
.cjws__submit.is-loading svg{ display:none; }
.cjws__submit.is-loading::after{
  content:""; position:absolute; width:16px; height:16px; border-radius:50%;
  border:2px solid rgba(244,237,220,0.35); border-top-color:#F4EDDC;
  animation:cjwsSpin .6s linear infinite;
}
.cjws__submit{position:relative;}
@keyframes cjwsSpin{ to{ transform:rotate(360deg); } }

.cjws__tool-title{font-size:1.3rem; font-weight:700; color:#001B28; margin-bottom:8px;}
.cjws__tool-sub{font-size:0.92rem; color:#5A5140; line-height:1.55; margin-bottom:28px; max-width:480px;}

/* ---- Campos ---- */
.cjfield{margin-bottom:22px;}
.cjfield:last-of-type{margin-bottom:0;}
.cjfield__row{display:flex; justify-content:space-between; align-items:baseline; margin-bottom:10px;}
.cjfield label{font-size:0.9rem; font-weight:600; color:#001B28; display:block; margin-bottom:10px;}
.cjfield__row label{margin-bottom:0;}
.cjfield__val{font-family:var(--mono); font-weight:700; color:#B8860B; font-size:1.35rem;}
.cjfield__val small{font-size:0.7rem; font-weight:600; color:#8C8272; margin-left:2px;}
.cjfield__hint{font-size:0.78rem; color:#8C8272; margin-top:8px; line-height:1.4;}

.cjfield input[type=range]{
  width:100%; -webkit-appearance:none; height:3px; border-radius:3px;
  background:linear-gradient(90deg, #B8860B 0%, #B8860B var(--fill,50%), rgba(0,27,40,0.1) var(--fill,50%));
}
.cjfield input[type=range]::-webkit-slider-thumb{
  -webkit-appearance:none; width:22px; height:22px; border-radius:50%;
  background:#fff; border:3px solid #B8860B; cursor:pointer;
  box-shadow:0 2px 10px rgba(184,134,11,0.4); transition:transform .2s ease;
}
.cjfield input[type=range]:active::-webkit-slider-thumb{transform:scale(1.15);}
.cjfield input[type=range]::-moz-range-thumb{
  width:22px; height:22px; border-radius:50%; background:#fff; border:3px solid #B8860B; cursor:pointer;
  box-shadow:0 2px 10px rgba(184,134,11,0.4);
}

.cjfield__select{
  width:100%; padding:13px 16px; border-radius:14px;
  appearance:none; -webkit-appearance:none; font-family:var(--sans); font-weight:600;
  border:1px solid rgba(0,27,40,0.1); background:#FBFAF7; color:#001B28; font-size:0.95rem;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%235A5140' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:right 16px center; padding-right:38px;
  transition:border-color .2s ease, box-shadow .2s ease;
}
.cjfield__select:focus{outline:none; border-color:#B8860B; box-shadow:0 0 0 3px rgba(184,134,11,0.12);}

/* ---- Input de dinero con formato en vivo ---- */
.cjmoney{
  display:flex; align-items:center; padding:13px 16px; border-radius:14px;
  border:1px solid rgba(0,27,40,0.1); background:#FBFAF7;
  transition:border-color .2s ease, box-shadow .2s ease;
}
.cjmoney:focus-within{border-color:#B8860B; box-shadow:0 0 0 3px rgba(184,134,11,0.12);}
.cjmoney__prefix{font-family:var(--mono); font-weight:700; color:#B8860B; font-size:0.95rem; margin-right:8px;}
.cjmoney__input{
  flex:1; width:100%; padding:0; margin:0; border:none; background:none; outline:none;
  font-family:var(--mono); font-size:0.98rem; font-weight:700; color:#001B28;
}

/* ---- Botón principal ---- */
.cjws__submit{
  display:inline-flex; align-items:center; gap:9px;
  margin-top:10px; padding:15px 28px; border:none; border-radius:100px; cursor:pointer;
  background:#001B28; color:#F4EDDC;
  font-family:var(--sans); font-weight:700; font-size:0.92rem;
  box-shadow:0 10px 26px rgba(0,27,40,0.18);
  transition:transform .25s cubic-bezier(.2,.8,.2,1), box-shadow .25s ease, background .25s ease;
}
.cjws__submit:hover{transform:translateY(-2px) scale(1.01); box-shadow:0 16px 34px rgba(0,27,40,0.24); background:#0A3D52;}
.cjws__submit svg{width:15px; height:15px;}

/* ---- Resultados: sub-workspace con 3 pestañas ---- */
.cjresults__tabs{display:flex; gap:22px; border-bottom:1px solid rgba(0,27,40,0.08); margin-bottom:26px;}
.cjresults__tab{
  background:none; border:none; cursor:pointer; padding:10px 2px; position:relative;
  font-family:var(--sans); font-weight:700; font-size:0.88rem; color:#8C8272;
  transition:color .25s ease;
}
.cjresults__tab::after{
  content:""; position:absolute; left:0; right:0; bottom:-1px; height:2px;
  background:#B8860B; transform:scaleX(0); transform-origin:left; transition:transform .25s ease;
}
.cjresults__tab.is-active{color:#001B28;}
.cjresults__tab.is-active::after{transform:scaleX(1);}

.cjresults__panel{display:none;}
.cjresults__panel.is-active{display:block; animation:cjwsFadeIn .3s ease;}

.cjresults__cards{display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-bottom:22px;}
.cjresults__cards--2{grid-template-columns:1fr 1fr;}
.cjresults__cards--3{grid-template-columns:repeat(3,1fr);}
.cjrescard{background:#FBFAF7; border:1px solid rgba(0,27,40,0.06); border-radius:16px; padding:18px 20px; position:relative; overflow:hidden;}
.cjrescard::before{content:""; position:absolute; left:0; top:0; bottom:0; width:4px; background:rgba(0,27,40,0.08);}
.cjrescard--verde::before{background:#3F9142;}
.cjrescard--azul::before{background:#2E7D9A;}
.cjrescard--dorado::before{background:#B8860B;}
.cjrescard--rojo::before{background:#C0392B;}
.cjrescard--navy::before{background:#001B28;}
.cjrescard__icon{
  display:flex; align-items:center; justify-content:center; width:30px; height:30px; border-radius:9px;
  background:rgba(0,27,40,0.06); color:#5A5140; margin-bottom:10px;
}
.cjrescard--verde .cjrescard__icon{background:rgba(63,145,66,0.12); color:#3F9142;}
.cjrescard--azul .cjrescard__icon{background:rgba(46,125,154,0.12); color:#2E7D9A;}
.cjrescard--dorado .cjrescard__icon{background:rgba(184,134,11,0.12); color:#B8860B;}
.cjrescard--rojo .cjrescard__icon{background:rgba(192,57,43,0.1); color:#C0392B;}
.cjrescard--navy .cjrescard__icon{background:rgba(0,27,40,0.08); color:#001B28;}
.cjrescard__icon svg{width:15px; height:15px;}
.cjrescard--hero{grid-column:1 / -1; background:linear-gradient(135deg, rgba(184,134,11,0.1), #FBFAF7); border-color:rgba(184,134,11,0.25);}
.cjrescard--hero::before{display:none;}
.cjrescard__herotop{display:flex; align-items:flex-end; justify-content:space-between; gap:20px;}
.cjrescard__spark{width:140px; height:56px; flex-shrink:0; opacity:0.9;}
.cjrescard__k{font-size:0.78rem; color:#8C8272; display:block; margin-bottom:8px;}
.cjrescard__v{font-family:var(--mono); font-weight:700; color:#001B28; font-size:1.15rem; display:block;}
.cjrescard--hero .cjrescard__v{font-size:clamp(1.8rem,4vw,2.4rem); color:#B8860B;}
.cjrescard__pct{font-size:0.76rem; color:#8C8272; display:block; margin-top:4px;}

.cjbadge{
  display:inline-block; padding:4px 12px; border-radius:20px; font-size:0.85rem !important;
  font-weight:700; width:fit-content;
}
.cjbadge[data-nivel="excelente"]{background:rgba(63,125,63,0.12); color:#3F7D3F;}
.cjbadge[data-nivel="bueno"]{background:rgba(46,125,154,0.12); color:#2E7D9A;}
.cjbadge[data-nivel="regular"]{background:rgba(184,134,11,0.14); color:#B8860B;}
.cjbadge[data-nivel="critico"]{background:rgba(192,57,43,0.1); color:#C0392B;}

.cjresults__interpret{font-size:0.92rem; color:#3E3527; line-height:1.65; max-width:600px;}
.cjresults__interpret strong{color:#B8860B;}
.cjresults__note{font-size:0.88rem; color:#5A5140; line-height:1.55; margin-bottom:18px; max-width:540px;}

/* ---- Gráfico de línea (Proyección) ---- */
.cjchart-wrap{position:relative; margin-bottom:14px;}
.cjchart{width:100%; height:auto; display:block; cursor:crosshair;}
.cjchart-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;
}
.cjchart-tooltip.is-visible{opacity:1;}
.cjchart-tooltip b{color:#FFBD00; font-family:var(--mono);}
.cjchart-legend{display:flex; gap:20px; flex-wrap:wrap; margin-bottom:6px;}
.cjchart-legend span{display:flex; align-items:center; gap:7px; font-size:0.8rem; color:#5A5140;}
.cjchart-legend i{width:10px; height:10px; border-radius:50%; display:inline-block;}

/* ---- Gráfico de barras (Desglose) — legado, aún usado por PPA si aplica ---- */
.cjbar-wrap{margin-bottom:18px;}
.cjbar{width:100%; height:auto; display:block;}

/* ---- Barra de porcentaje apilada (Desglose) — cuenta la historia de un vistazo ---- */
.cjstackbar{
  display:flex; width:100%; height:40px; border-radius:12px; overflow:hidden;
  margin-bottom:22px; box-shadow:0 0 0 1px rgba(0,27,40,0.06) inset;
}
.cjstackbar__seg{
  display:flex; align-items:center; justify-content:center; min-width:0;
  transition:width 1s cubic-bezier(.22,.61,.36,1); width:0%;
  font-family:var(--mono); font-weight:700; font-size:0.85rem; color:#fff;
  overflow:hidden; white-space:nowrap;
}
.cjstackbar__seg--navy{background:#001B28;}
.cjstackbar__seg--verde{background:#3F9142;}
.cjstackbar__seg span{padding:0 4px;}

.cjresults__callout{
  display:flex; gap:12px; align-items:flex-start;
  background:linear-gradient(135deg, rgba(184,134,11,0.08), rgba(255,255,255,0.4));
  border:1px solid rgba(184,134,11,0.2); border-radius:14px; padding:16px 18px;
}
.cjresults__callout-icon{
  flex-shrink:0; width:30px; height:30px; border-radius:9px;
  display:flex; align-items:center; justify-content:center;
  background:rgba(184,134,11,0.14); color:#B8860B;
}
.cjresults__callout-icon svg{width:15px; height:15px;}
.cjresults__callout p{font-size:0.9rem; line-height:1.6; color:#3E3527; margin:0;}
.cjresults__callout p strong{color:#B8860B;}

/* ---- Escenarios (Jubilación) ---- */
.cjscenarios{display:grid; grid-template-columns:repeat(3,1fr); gap:14px; margin-bottom:18px;}
.cjscenario{
  background:#FBFAF7; border:1px solid rgba(0,27,40,0.07); border-radius:16px; padding:18px; text-align:center;
  transition:border-color .25s ease, transform .25s ease;
}
.cjscenario:hover{border-color:rgba(184,134,11,0.35); transform:translateY(-3px);}
.cjscenario__edad{display:block; font-size:0.8rem; color:#8C8272; margin-bottom:8px; font-weight:600;}
.cjscenario__v{display:block; font-family:var(--mono); font-weight:700; color:#001B28; font-size:1.05rem;}

/* ---- Acciones al final del resultado ---- */
.cjresults__actions{display:flex; flex-wrap:wrap; gap:12px; padding-top:26px; margin-top:6px; border-top:1px dashed rgba(0,27,40,0.1);}
.cjws__pdf-btn{
  display:inline-flex; align-items:center; gap:8px; padding:13px 20px; border-radius:100px; cursor:pointer;
  background:none; border:1.5px solid rgba(0,27,40,0.15); color:#001B28;
  font-family:var(--sans); font-weight:700; font-size:0.86rem;
  transition:border-color .25s ease, background .25s ease, transform .25s ease;
}
.cjws__pdf-btn:hover{border-color:rgba(0,27,40,0.3); background:rgba(0,27,40,0.03); transform:translateY(-2px);}
.cjws__pdf-btn svg{width:16px; height:16px;}

.cjws__next{
  display:inline-flex; align-items:center; gap:9px; margin-left:auto;
  padding:14px 24px; border:none; border-radius:100px; cursor:pointer;
  background:transparent; color:#001B28; font-family:var(--sans); font-weight:700; font-size:0.9rem;
  box-shadow:0 0 0 1.5px rgba(0,27,40,0.15) inset; text-decoration:none;
  transition:transform .25s ease, box-shadow .25s ease, background .25s ease;
}
.cjws__next:hover{transform:translateY(-2px); box-shadow:0 0 0 1.5px rgba(0,27,40,0.3) inset; background:rgba(0,27,40,0.03);}
.cjws__next--gold{background:linear-gradient(135deg,#B8860B,#D9A93B); color:#001B28; box-shadow:0 10px 26px rgba(184,134,11,0.28);}
.cjws__next--gold:hover{background:linear-gradient(135deg,#C99400,#FFDE8A); box-shadow:0 14px 32px rgba(184,134,11,0.36);}
.cjws__next svg{width:15px; height:15px;}

/* ---- Modal: Descargar reporte PDF (lead) ---- */
.cjlead-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;
}
.cjlead-modal.is-open{opacity:1; pointer-events:auto;}
.cjlead-modal__overlay{position:absolute; inset:0; background:rgba(0,11,18,0.5); backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px);}
.cjlead-modal__card{
  position:relative; z-index:1; background:#fff; color:#001B28; max-width:420px; width:100%;
  border-radius:22px; padding:36px 32px 30px; box-shadow:0 40px 90px rgba(0,11,18,0.3);
  text-align:left; transform:scale(.94) translateY(10px); opacity:0;
  transition:transform .35s cubic-bezier(.2,.8,.2,1), opacity .3s ease;
}
.cjlead-modal.is-open .cjlead-modal__card{transform:scale(1) translateY(0); opacity:1;}
.cjlead-modal__close{position:absolute; top:16px; right:18px; background:none; border:none; font-size:1.5rem; color:#8C8272; cursor:pointer; line-height:1;}
.cjlead-modal__close:hover{color:#001B28;}
.cjlead-modal__kicker{font-family:var(--mono); font-size:0.72rem; font-weight:600; letter-spacing:0.08em; text-transform:uppercase; color:#B8860B; margin-bottom:10px;}
.cjlead-modal__card h3{font-size:1.25rem; margin-bottom:8px; color:#001B28;}
.cjlead-modal__text{font-size:0.9rem; color:#5A5140; line-height:1.5; margin-bottom:22px;}
.cjlead-modal__field{display:block; margin-bottom:16px;}
.cjlead-modal__field span{font-size:0.85rem; font-weight:600; color:#001B28; display:block; margin-bottom:8px;}
.cjlead-modal__field em{font-weight:400; color:#8C8272; font-style:normal;}
.cjlead-modal__field input{
  width:100%; padding:12px 14px; border-radius:12px; border:1px solid rgba(0,27,40,0.12);
  background:#FBFAF7; font-family:var(--sans); font-size:0.92rem; color:#001B28;
}
.cjlead-modal__field input:focus{outline:none; border-color:#B8860B;}
.cjlead-modal__error{font-size:0.82rem; color:#C0392B; min-height:1.2em; margin-bottom:6px;}
.cjlead-modal__submit{width:100%; justify-content:center;}

/* =========================================================
   EXPERIENCIA MÓVIL — App Shell (Centro de Jubilación Perú)
   Todo lo de este bloque es exclusivo de móvil (≤900px). El escritorio
   no se toca. La lógica de cálculo tampoco: solo cambia CÓMO se
   presentan los mismos elementos (dashboard, pantalla completa por
   herramienta, resultados en bottom sheet).
========================================================= */

/* ---- Drawer lateral izquierdo ---- */
.cjdrawer-overlay{
  position:fixed; inset:0; z-index:300; background:rgba(0,11,18,0.55);
  backdrop-filter:blur(4px); -webkit-backdrop-filter:blur(4px);
  opacity:0; pointer-events:none; transition:opacity .3s ease;
}
.cjdrawer-overlay.is-open{opacity:1; pointer-events:auto;}
.cjdrawer{
  position:fixed; top:0; bottom:0; left:0; width:82%; max-width:320px; z-index:301;
  background:#001B28; display:flex; flex-direction:column;
  transform:translateX(-100%); transition:transform .35s cubic-bezier(.22,.61,.36,1);
  padding-top:env(safe-area-inset-top); padding-bottom:env(safe-area-inset-bottom);
  box-shadow:20px 0 50px rgba(0,0,0,0.3);
}
.cjdrawer.is-open{transform:translateX(0);}
.cjdrawer__head{display:flex; align-items:flex-start; justify-content:space-between; padding:22px 22px 18px;}
.cjdrawer__brandcol{display:flex; flex-direction:column; gap:3px;}
.cjdrawer__brand{font-family:var(--serif); font-weight:700; font-size:1.05rem; color:#F4EDDC;}
.cjdrawer__brandsub{font-size:0.72rem; color:var(--gold); font-weight:500;}
.cjdrawer__close{background:none; border:none; color:#8C96A0; padding:6px; cursor:pointer;}
.cjdrawer__close svg{width:20px; height:20px;}
.cjdrawer__nav{display:flex; flex-direction:column; gap:4px; padding:8px 14px; overflow-y:auto;}
.cjdrawer__divider{
  height:1px; margin:18px 10px 20px; border:none;
  background:linear-gradient(90deg, transparent, rgba(255,255,255,0.14) 20%, rgba(255,255,255,0.14) 80%, transparent);
}
.cjdrawer__link{
  display:flex; align-items:center; gap:14px; padding:13px 14px; border-radius:14px;
  color:#C7D0D6; font-weight:600; font-size:0.92rem; transition:background .2s ease, color .2s ease;
}
.cjdrawer__link svg{width:19px; height:19px; flex-shrink:0; opacity:0.85;}
.cjdrawer__link:active, .cjdrawer__link:hover{background:rgba(255,255,255,0.06); color:#fff;}
.cjdrawer__link--highlight{background:rgba(184,134,11,0.14); color:#FFBD00;}
.cjdrawer__link--highlight svg{opacity:1;}
.cjdrawer__cta{
  display:flex; align-items:center; justify-content:center; gap:9px; margin:14px; padding:15px;
  border-radius:100px; background:linear-gradient(135deg,#B8860B,#D9A93B); color:#001B28;
  font-weight:800; font-size:0.92rem;
}
.cjdrawer__cta svg{width:16px; height:16px;}

/* ---- FAB de WhatsApp ---- */
.cjfab{
  display:none; position:fixed; right:18px; bottom:calc(22px + env(safe-area-inset-bottom)); z-index:150;
  width:54px; height:54px; border-radius:50%; background:#25D366; color:#fff;
  align-items:center; justify-content:center; box-shadow:0 10px 26px rgba(37,211,102,0.4);
  transition:transform .25s ease;
}
.cjfab svg{width:26px; height:26px;}
.cjfab:active{transform:scale(0.92);}

/* ---- Saludo tipo dashboard (oculto en escritorio) ---- */
.cjws-greeting{display:none;}
.cjws__mobile-back{display:none;}

@media (max-width:900px){
  body{overflow-x:hidden;}
  .cjfab{display:flex;}

  /* ---- El saludo genérico se elimina: usamos la misma identidad que
  escritorio (eyebrow dorado + título + descripción), no un saludo tipo
  app genérica — esta sección debe transmitir autoridad de especialista. ---- */
  .cjws-greeting{display:none;}

  .cjperu__foot{margin-top:20px;}

  /* ---- Dashboard: tarjetas grandes, apiladas, fáciles de tocar ---- */
  .cjws{border-radius:22px;}
  .cjws__tabs{
    flex-direction:column; gap:12px; padding:16px; background:#fff; border-bottom:none;
  }
  .cjws__tab{
    padding:18px; border-radius:18px; gap:16px; box-shadow:0 3px 12px rgba(0,27,40,0.05);
  }
  .cjws__tab-icon{width:44px; height:44px; border-radius:13px;}
  .cjws__tab-icon svg{width:20px; height:20px;}
  .cjws-tab-title{font-size:0.95rem;}
  .cjws-tab-sub{display:block; font-size:0.8rem;}
  .cjws__tab::after{display:none;} /* la barra superior de "activo" no aplica al dashboard */
  .cjws__tab::before{
    content:""; position:static; width:8px; height:8px; border-radius:50%; margin-left:auto;
    background:rgba(0,27,40,0.15); transform:none; flex-shrink:0;
  }
  .cjws__tab.is-active::before{background:#B8860B;}

  /* ---- Herramienta: pantalla completa tipo app, oculta hasta que se toca una tarjeta ---- */
  .cjws__panel{
    position:fixed; inset:0; z-index:250; background:#fff; height:auto !important;
    overflow-y:auto; -webkit-overflow-scrolling:touch;
    transform:translateX(100%); transition:transform .32s cubic-bezier(.22,.61,.36,1);
    padding-top:env(safe-area-inset-top); padding-bottom:env(safe-area-inset-bottom);
  }
  .cjws.is-mobile-tool-open .cjws__panel{transform:translateX(0);}
  .cjws__tool{padding:14px 20px 40px;}
  .cjws__tool-title{font-size:1.5rem;}

  .cjws__mobile-back{
    display:flex; align-items:center; gap:6px; background:none; border:none; cursor:pointer;
    padding:10px 4px; margin-bottom:6px; font-weight:700; font-size:0.9rem; color:#5A5140;
  }
  .cjws__mobile-back svg{width:17px; height:17px;}

  /* ---- Resultados como Bottom Sheet ---- */
  .cjsheet-backdrop{
    position:fixed; inset:0; z-index:260; background:rgba(0,11,18,0.45);
    opacity:0; pointer-events:none; transition:opacity .3s ease;
  }
  .cjsheet-backdrop.is-open{opacity:1; pointer-events:auto;}
  .cjsheet-handle{width:38px; height:5px; border-radius:3px; background:rgba(0,27,40,0.15); margin:2px auto 14px;}

  .cjws__results-view{
    position:fixed; left:0; right:0; bottom:0; z-index:270;
    background:#fff; border-radius:24px 24px 0 0; margin-top:0; border-top:none;
    max-height:86vh; overflow-y:auto; -webkit-overflow-scrolling:touch;
    padding:10px 20px calc(26px + env(safe-area-inset-bottom));
    box-shadow:0 -14px 40px rgba(0,27,40,0.2);
    transform:translateY(100%); transition:transform .38s cubic-bezier(.22,.61,.36,1);
    animation:none !important;
  }
  .cjws__results-view.is-active{transform:translateY(0);}

  /* ---- Skeleton loading (breve, antes de revelar resultados) ---- */
  .cjskeleton{display:flex; flex-direction:column; gap:14px; padding:6px 0 16px;}
  .cjskeleton__line{height:14px; border-radius:8px; background:linear-gradient(90deg,#F0EAD8 25%,#F7F2E4 37%,#F0EAD8 63%); background-size:400% 100%; animation:cjskeletonPulse 1.3s ease infinite;}
  .cjskeleton__line--title{width:60%; height:20px;}
  .cjskeleton__line--hero{width:85%; height:44px; margin:4px 0;}
  .cjskeleton__line--sm{width:40%;}
  @keyframes cjskeletonPulse{0%{background-position:100% 0;}100%{background-position:0 0;}}

  .cjresults__cards, .cjresults__cards--2, .cjresults__cards--3{grid-template-columns:1fr;}
  .cjscenarios{grid-template-columns:1fr;}
  .cjresults__actions{flex-direction:column;}
  .cjws__next{margin-left:0;}

  /* ---- Campos más cómodos al tacto ---- */
  .cjfield__select, .cjmoney, .cjws__submit{padding-top:15px; padding-bottom:15px;}
  .cjfield input[type=range]::-webkit-slider-thumb{width:26px; height:26px;}
}
@media (prefers-reduced-motion: reduce){
  .cjws__panel, .cjws__input-view, .cjws__results-view, .cjws__tab, .cjws__submit, .cjws__next, .cjresults__panel, .cjlead-modal, .cjlead-modal__card, .cjdrawer, .cjdrawer-overlay, .cjsheet-backdrop{transition:none; animation:none;}
}

/* =========================================================
   COMPACTACIÓN GENERAL MÓVIL — menos scroll, más densidad,
   misma identidad premium. Reduce el espacio vertical entre
   secciones, títulos, párrafos y tarjetas en todo el sitio.
========================================================= */
@media (max-width:900px){
  /* ---- Ritmo entre secciones: casi la mitad del padding vertical ---- */
  .hero{padding:36px 0; min-height:auto; aspect-ratio:auto;}
  .realidad{padding:32px 20px 40px;}
  .cjperu{padding:28px 20px 34px;}
  .cjperu__head{margin-bottom:20px;}
  .metodo{padding:40px 20px;}
  .proceso{padding:40px 20px 46px;}
  .sobremi{padding:40px 20px;}
  .testimonios{padding:40px 20px;}
  .faq{padding:40px 20px;}
  .agenda{padding:46px 20px 32px;}
  .footer{padding:36px 20px 0;}

  /* ---- Títulos y párrafos: menos aire debajo, mismo tamaño de letra ---- */
  .eyebrow, .realidad__kicker, .metodo__kicker, .proceso__kicker{margin-bottom:8px !important;}
  .realidad__title, .metodo__title, .proceso__title,
  .testimonios__title, .faq__title, .agenda__inner h2{margin-bottom:16px !important;}
  .metodo__lead{margin:10px auto 22px !important;}
  .proceso__title{margin-bottom:24px !important;}
  .sobremi__lead{margin-bottom:12px !important;}

  /* ---- Tarjetas y grillas: menos separación entre ellas ---- */
  .realidad__grid{gap:12px !important;}
  .metodo__pillars{gap:14px !important;}
  .testimonios__grid{gap:14px !important;}
  .faq__list{gap:10px !important;}
  .neon-card{padding:20px !important;}
  .testi-card__body{padding:16px 16px 18px !important;}
  .faq-item__header{padding:18px 18px !important;}
  .faq-item__panel-inner p{padding:0 18px 18px !important;}

  /* ---- Centro de Jubilación: cabecera y tarjetas más juntas ---- */
  .cjperu__sub{margin-top:10px;}
  .cjws__tabs{gap:9px; padding:14px;}
  .cjws__tab{padding:15px;}

  /* ---- Muro de fotos y video testimonios: menos alto, más ritmo ---- */
  .muro-track__img{height:150px !important;}
  .muro-track{gap:10px !important;}

  /* ---- Botones: algo más compactos sin perder el tacto cómodo ---- */
  .btn{padding:14px 22px !important;}
  .btn--lg{padding:16px 28px !important;}
}

/* =========================================================
   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; counter-reset:pasoProceso;}
  .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; counter-increment:pasoProceso;}
  .h-step__content h3::before{content:counter(pasoProceso) ". ";}
  .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;}
.cj-mobile-break{display:none;}
.agenda__btn-icon{display:none;}
.agenda__lead{font-size:1.05rem;margin-bottom:28px;}
.agenda__mission-mobile{display:none;}

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

.agenda__calendly-wrap{
  max-height:0; overflow:hidden;
  transition:max-height .35s ease;
}
.agenda__calendly-wrap.is-open{max-height:950px;}
.agenda__calendly-inner{overflow:visible;}
.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){
  .cj-mobile-break{display:block;}
  .agenda{padding-left:14px !important; padding-right:14px !important;}
  .agenda__inner{max-width:100%;}
  .agenda__inner h2{font-size:1.75rem !important; letter-spacing:-0.01em; line-height:1.2;}

  .agenda__btn-icon{display:inline-block; width:18px; height:18px; flex-shrink:0;}
  #agendaBtn{display:inline-flex; align-items:center; gap:9px; animation:agendaCtaPulse 6.5s ease-in-out infinite;}
  @keyframes agendaCtaPulse{
    0%, 85%, 100%{ transform:scale(1); filter:brightness(1); }
    91%{ transform:scale(1.03); filter:brightness(1.1); }
    96%{ transform:scale(1.005); filter:brightness(1.03); }
  }
  @media (prefers-reduced-motion: reduce){
    #agendaBtn{animation:none;}
  }

  .agenda__calendly-wrap{margin-top:30px;}

  .agenda__calendly-inner{overflow:visible;}
  .agenda__calendly-inner > div{
    padding:20px 0 0; max-width:100%;
  }
  .agenda__calendly-inner .calendly-inline-widget{
    border-radius:0; width:100% !important; max-width:100% !important; min-width:0 !important;
    overflow:visible !important;
  }
  .agenda__calendly-inner .calendly-inline-widget iframe{
    width:100% !important; overflow:hidden !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 rgba(255,189,0,0.35);
  color:var(--gold);
  transition:color .2s ease, border-color .2s ease, transform .2s ease, background .2s ease;
}
.footer__social-icon svg{width:17px;height:17px;}
.footer__social-icon:hover{color:#001823;background:var(--gold);border-color:var(--gold);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:#FFFFFF;transition:color .2s;}
.footer__col a:hover{color:var(--gold);}
.footer__location{display:block;font-size:0.9rem;color:#FFFFFF;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:#FFFFFF;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:#FFFFFF;
}
.footer__legal-links{display:flex;gap:26px;flex-wrap:wrap;}
.footer__legal-links a{color:#FFFFFF;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; order:-1;}
  .nav__brand{align-items:flex-end; text-align:right;}
}

/* =========================================================
   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:none;} /* reemplazada por el drawer lateral + el FAB de WhatsApp */
  /* App-like rounded generous mobile spacing */
  .hero, .realidad, .cjperu, .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;}
}

/* =========================================================
   ASISTENTE VIRTUAL DE JUBILACIÓN — burbuja flotante + panel
   Se inyecta desde script.js en cada página. Estilo consistente
   con la identidad del sitio (navy + dorado), inspirado en
   Stripe/Intercom: minimalista, limpio, premium.
========================================================= */
.cj-asistente{position:fixed; right:24px; bottom:24px; z-index:10000;}

.cj-asistente__bubble{
  position:relative; width:72px; height:72px; border-radius:50%;
  background:var(--gold); border:none; cursor:pointer;
  display:flex; align-items:center; justify-content:center;
  box-shadow:0 10px 25px rgba(255,189,0,0.28), 0 4px 10px rgba(0,0,0,0.18);
  transition:box-shadow .25s ease;
  animation:cjAsistentePulso 25s ease-in-out infinite;
}
.cj-asistente__bubble:hover{box-shadow:0 14px 32px rgba(255,189,0,0.36), 0 6px 14px rgba(0,0,0,0.2);}
.cj-asistente__bubble svg{width:30px; height:30px; color:#001B28;}
@keyframes cjAsistentePulso{
  0%, 97.6%, 100%{ transform:scale(1); }
  98.4%{ transform:scale(1.08); }
  99.2%{ transform:scale(1); }
}
@media (prefers-reduced-motion: reduce){ .cj-asistente__bubble{animation:none;} }

.cj-asistente__badge{
  position:absolute; top:-2px; right:-2px; width:18px; height:18px; border-radius:50%;
  background:#E0393E; color:#fff; font-size:10px; font-weight:800;
  display:flex; align-items:center; justify-content:center;
  font-family:var(--sans, sans-serif); border:2px solid #fff;
  opacity:0; transform:scale(0.5); transition:opacity .25s ease, transform .25s ease;
  pointer-events:none;
}
.cj-asistente__badge.is-visible{opacity:1; transform:scale(1);}

.cj-asistente__panel{
  position:fixed; right:24px; bottom:110px; width:390px; height:650px;
  max-height:calc(100vh - 140px);
  background:#fff; border-radius:16px; overflow:hidden;
  box-shadow:0 24px 60px rgba(0,11,18,0.22), 0 4px 16px rgba(0,11,18,0.1);
  display:flex; flex-direction:column;
  transform:translateY(24px) scale(0.98); opacity:0; pointer-events:none;
  transition:transform .25s cubic-bezier(.22,.61,.36,1), opacity .25s ease;
}
.cj-asistente__panel.is-open{transform:translateY(0) scale(1); opacity:1; pointer-events:auto;}

.cj-asistente__header{
  height:80px; flex-shrink:0; background:var(--navy-0); display:flex; align-items:center;
  justify-content:space-between; padding:0 18px; gap:12px;
  opacity:0; transform:translateY(-6px); transition:opacity .3s ease, transform .3s ease;
}
.cj-asistente__header.is-visible{opacity:1; transform:translateY(0);}
.cj-asistente__header-left{display:flex; align-items:center; gap:12px; min-width:0;}
.cj-asistente__foto{
  position:relative; width:46px; height:46px; border-radius:50%; flex-shrink:0;
  border:2px solid #fff; overflow:hidden; background:#8C6A08;
  display:flex; align-items:center; justify-content:center;
}
.cj-asistente__foto img{width:100%; height:100%; object-fit:cover; display:block;}
.cj-asistente__foto svg{width:26px; height:26px; color:#fff; opacity:0.92;}
.cj-asistente__foto-online{
  position:absolute; bottom:-1px; right:-1px; width:10px; height:10px; border-radius:50%;
  background:#25D366; border:2px solid #fff;
}
.cj-asistente__header-title{color:#fff; font-weight:600; font-size:18px; font-family:var(--sans, sans-serif); line-height:1.2;}
.cj-asistente__header-sub{color:#7FE0A8; font-size:12px; font-weight:500; margin-top:3px; font-family:var(--sans, sans-serif); display:flex; align-items:center; gap:5px;}
.cj-asistente__dot-online{width:7px; height:7px; border-radius:50%; background:#25D366; flex-shrink:0; display:inline-block;}
.cj-asistente__close{background:none; border:none; color:#fff; font-size:22px; line-height:1; cursor:pointer; padding:6px; opacity:0.85; flex-shrink:0;}
.cj-asistente__close:hover{opacity:1;}

.cj-asistente__body{flex:1; overflow-y:auto; padding:18px; display:flex; flex-direction:column; gap:12px; background:#FBFAF7;}

.cj-asistente__msg{
  max-width:85%; background:#fff; border:1px solid rgba(0,27,40,0.08); border-radius:14px 14px 14px 3px;
  padding:12px 14px; font-size:0.85rem; line-height:1.55; color:#232323;
  font-family:var(--sans, sans-serif); align-self:flex-start;
  box-shadow:0 2px 8px rgba(0,27,40,0.04);
}
.cj-asistente__msg--entrando{opacity:0; transform:scale(0.95); transition:opacity .22s ease, transform .22s ease;}
.cj-asistente__msg--entrando.is-visible{opacity:1; transform:scale(1);}
.cj-asistente__msg--user{
  align-self:flex-end; background:var(--navy-1); color:#fff; border:none;
  border-radius:14px 14px 3px 14px;
}

/* ---- Indicador de escritura (3 puntos, estilo WhatsApp) ---- */
.cj-asistente__typing{
  align-self:flex-start; background:#fff; border:1px solid rgba(0,27,40,0.08);
  border-radius:14px 14px 14px 3px; padding:12px 16px; display:flex; gap:4px;
  box-shadow:0 2px 8px rgba(0,27,40,0.04);
  opacity:0; transform:scale(0.95); transition:opacity .2s ease, transform .2s ease;
}
.cj-asistente__typing.is-visible{opacity:1; transform:scale(1);}
.cj-asistente__typing span{
  width:6px; height:6px; border-radius:50%; background:#B0A793;
  animation:cjTypingDot 1.2s ease-in-out infinite;
}
.cj-asistente__typing span:nth-child(2){animation-delay:.15s;}
.cj-asistente__typing span:nth-child(3){animation-delay:.3s;}
@keyframes cjTypingDot{
  0%, 60%, 100%{transform:translateY(0); opacity:0.5;}
  30%{transform:translateY(-4px); opacity:1;}
}
.cj-asistente__msg .cursor-typing{display:inline-block; width:2px; height:12px; background:#8C8272; margin-left:1px; animation:cjCursorBlink .8s step-end infinite; vertical-align:middle;}
@keyframes cjCursorBlink{50%{opacity:0;}}

.cj-asistente__opciones{display:flex; flex-direction:column; gap:10px; align-self:stretch; margin-top:2px;}
.cj-asistente__btn{
  width:90%; align-self:center; height:48px; border-radius:10px; border:none;
  background:var(--navy-1); color:#fff; font-weight:600; font-size:0.83rem; cursor:pointer;
  font-family:var(--sans, sans-serif); transition:background .18s ease, transform .15s ease;
  padding:0 14px;
}
.cj-asistente__btn--entrando{opacity:0; transform:translateY(8px);}
.cj-asistente__btn--entrando.is-visible{opacity:1; transform:translateY(0); transition:opacity .22s ease, transform .22s ease;}
.cj-asistente__btn:hover{background:var(--navy-2); transform:translateY(-1px);}
.cj-asistente__btn--gold{background:var(--gold); color:#001B28;}
.cj-asistente__btn--gold:hover{background:#E0A800;}
.cj-asistente__btn--verde{background:#25D366; color:#fff;}
.cj-asistente__btn--verde:hover{background:#1EBE59;}
.cj-asistente__btn--ghost{background:#fff; color:var(--navy-1); border:1px solid rgba(0,27,40,0.15);}
.cj-asistente__btn--ghost:hover{background:#F4EDDC;}

.cj-asistente__faq{width:100%; align-self:stretch; display:flex; flex-direction:column; gap:8px;}
.cj-asistente__faq-item{border:1px solid rgba(0,27,40,0.08); border-radius:10px; background:#fff; overflow:hidden;}
.cj-asistente__faq-q{
  width:100%; text-align:left; background:none; border:none; padding:11px 12px; cursor:pointer;
  font-size:0.8rem; font-weight:600; color:var(--navy-1); font-family:var(--sans, sans-serif);
  display:flex; justify-content:space-between; align-items:center; gap:8px;
}
.cj-asistente__faq-a{max-height:0; overflow:hidden; transition:max-height .25s ease; font-size:0.78rem; color:#5A5140; line-height:1.5;}
.cj-asistente__faq-a-inner{padding:0 12px 12px;}
.cj-asistente__faq-item.is-open .cj-asistente__faq-a{max-height:220px;}

.cj-asistente__inputbar{
  flex-shrink:0; display:flex; align-items:center; gap:8px; padding:12px 14px;
  border-top:1px solid rgba(0,27,40,0.08); background:#fff;
}
.cj-asistente__inputbar input{
  flex:1; border:1px solid rgba(0,27,40,0.12); border-radius:100px; padding:10px 14px;
  font-size:0.83rem; font-family:var(--sans, sans-serif); outline:none; background:#FBFAF7;
}
.cj-asistente__inputbar input:focus{border-color:var(--gold);}
.cj-asistente__inputbar button{
  width:38px; height:38px; border-radius:50%; background:var(--navy-1); border:none; color:#fff;
  cursor:pointer; display:flex; align-items:center; justify-content:center; flex-shrink:0;
}
.cj-asistente__inputbar button svg{width:16px; height:16px;}

@media (max-width:640px){
  .cj-asistente{right:18px; bottom:18px;}
  .cj-asistente__bubble{width:64px; height:64px;}
  .cj-asistente__bubble svg{width:26px; height:26px;}
  .cj-asistente__panel{
    right:0; bottom:0; left:0; top:0; width:100%; height:100%; max-height:100%;
    border-radius:0;
  }
}