/* ============================================================
   LUIS VALADÉS · V3 desde cero · Davincci Light Luxury
   White + Electric Blue + Navy Ink
   ============================================================ */

:root {
  /* Paleta */
  --ink:        #0A0D14;
  --ink-2:      #11172A;
  --ink-3:      #1A2238;
  --moss:       #1F47A0;
  --moss-2:     #1A3B85;
  --sage:       #2B59B0;
  --sage-2:     #4076D4;
  --sage-3:     #5D8FE8;
  --mint:       #DCE6F5;
  --mint-2:     #EEF3FA;
  --cream:      #F4F6FA;
  --paper:      #FFFFFF;
  --paper-2:    #FAFBFD;
  --bg:         #FFFFFF;
  --text:       #0A0D14;
  --text-soft:  #4A5159;
  --text-mute:  #717A8C;
  --line:       rgba(9,12,20,.08);
  --line-strong: rgba(9,12,20,.16);

  /* Tipo */
  --f-display:  'Oswald', 'Helvetica Neue', sans-serif;
  --f-body:     'Karla', system-ui, -apple-system, sans-serif;
  --f-label:    'Bebas Neue', 'Oswald', sans-serif;

  /* Radii */
  --r-sm: 10px;
  --r-md: 18px;
  --r-lg: 28px;
  --r-xl: 36px;
  --r-2xl: 48px;
  --r-full: 9999px;

  /* Sombras */
  --sh-1: 0 8px 22px -10px rgba(9,12,20,.10);
  --sh-2: 0 22px 44px -18px rgba(9,12,20,.14);
  --sh-3: 0 34px 64px -22px rgba(9,12,20,.20);
  --sh-xl: 0 56px 120px -36px rgba(9,12,20,.26);
  --sh-sage: 0 22px 52px -14px rgba(43,89,176,.45);
  --sh-neon: 0 0 60px -8px rgba(43,89,176,.45), 0 0 24px -4px rgba(43,89,176,.30);
  --sh-ink:  0 18px 36px -14px rgba(9,12,20,.45), 0 0 36px -10px rgba(43,89,176,.40);
  --inset-hi: inset 0 1px 0 rgba(255,255,255,.5);
  --gradient-paper: linear-gradient(165deg, var(--paper) 0%, var(--paper-2) 70%, var(--cream) 100%);

  /* Easing */
  --ease:    cubic-bezier(.2,.8,.2,1);
  --ease-spring: cubic-bezier(.34,1.56,.64,1);
  --ease-out: cubic-bezier(.16,1,.3,1);
  --container: 1480px;
}

/* ----- RESET ----- */
*, *::before, *::after { box-sizing: border-box; }
html {
  scroll-behavior: smooth;
  -webkit-text-size-adjust: 100%;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  font-size: 18px;
  overflow-x: hidden;
  width: 100%;
  max-width: 100%;
}
@media (max-width: 980px) {
  html { font-size: 17px; }
}
@media (max-width: 600px) {
  html { font-size: 16px; }
}
body {
  margin: 0;
  padding: 0;
  width: 100%;
  max-width: 100%;
  overflow-x: hidden;
  position: relative;
}
img { max-width: 100%; height: auto; }
body {
  font-family: var(--f-body);
  font-size: 1rem;     /* hereda 18.4px del html */
  line-height: 1.7;
  color: var(--text);
  background: var(--bg);
  font-feature-settings: "ss01", "kern";
}
img, svg { display: block; max-width: 100%; height: auto; }
a { color: inherit; text-decoration: none; }
button { font: inherit; cursor: pointer; border: 0; background: transparent; color: inherit; }
::selection { background: var(--sage); color: var(--cream); }
:focus-visible { outline: 3px solid var(--sage); outline-offset: 3px; border-radius: 4px; }

h1, h2, h3, h4 {
  font-family: var(--f-display);
  font-weight: 500;
  line-height: 1.06;
  letter-spacing: -0.02em;
  color: var(--text);
  margin: 0;
}
h1 { font-size: clamp(2rem, 1.2rem + 2.4vw, 3.4rem); font-weight: 600; }
h2 { font-size: clamp(1.85rem, 1.2rem + 1.5vw, 2.9rem); font-weight: 600; }
h3 { font-size: clamp(1.25rem, 1rem + .7vw, 1.6rem); letter-spacing: -0.01em; }
h4 { font-size: 1.55rem; letter-spacing: -0.015em; font-weight: 600; }

h1 em, h2 em, h3 em, h4 em {
  font-family: var(--f-body);
  font-style: italic;
  font-weight: 500;
  background: linear-gradient(95deg, var(--moss) 10%, var(--sage) 70%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  letter-spacing: -0.005em;
}

p { margin: 0; color: var(--text-soft); line-height: 1.7; }
p strong { color: var(--text); font-weight: 700; }
.lede { font-size: 1.15rem; line-height: 1.6; color: var(--text-soft); font-style: italic; font-weight: 500; }

/* ----- LAYOUT ----- */
.container {
  width: 100%;
  max-width: var(--container);
  margin: 0 auto;
  padding-inline: clamp(1.25rem, .8rem + 1.2vw, 2rem);
}

/* CACHE-BUSTER-MARKER · build 2026-05-22-22h59 · containers 1480px sin per-section overrides */

/* === Section internal widths · estetica premium PC ===
   max-width al elemento interno de cada seccion (NO al .container).
   Patron descubierto con el debug del timeline: algun reset invisible
   pisa max-width en algunos elementos, por eso !important + margin auto. */
.timeline__list {
  max-width: 760px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}
.features__grid {
  max-width: 1280px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}
.calc__grid {
  max-width: 1100px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}
.bio__grid {
  max-width: 1180px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}
.testimonios__grid {
  max-width: 1220px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}
.faq__grid,
.faq__cols {
  max-width: 880px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}
.cta-final__inner {
  max-width: 920px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}
.metrics__grid {
  max-width: 1240px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}
/* Centrar TODOS los section-head (incluyendo los que tienen modifier --left) */
.section-head--left {
  margin-left: auto !important;
  margin-right: auto !important;
  text-align: center !important;
}
/* Anaquel (master-detail Hipotecario/PyME) reducido a 80% */
.anaquel__shell {
  max-width: 1184px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}
section { position: relative; }

/* ----- EYEBROW ----- */
.eyebrow {
  font-family: var(--f-label);
  text-transform: uppercase;
  letter-spacing: 0.22em;
  font-size: .85rem;
  color: var(--moss);
  font-weight: 400;
  line-height: 1;
  display: inline-flex;
  align-items: center;
  gap: .55rem;
}
.eyebrow .dot {
  width: 7px; height: 7px; border-radius: 50%;
  background: var(--sage);
  box-shadow: 0 0 0 4px rgba(43,89,176,.20);
}

/* ----- SECTION HEAD ----- */
.section-head {
  max-width: 760px;
  margin: 0 auto clamp(2.5rem, 4vw, 4rem);
  text-align: center;
}
.section-head--left { margin-left: 0; margin-right: auto; text-align: left; }
.section-head h2 { margin: 1rem 0 1rem; }
.section-head p { color: var(--text-soft); font-size: 1.05rem; }

/* ============================================================
   BOTONES
   ============================================================ */
.btn {
  display: inline-flex;
  align-items: center;
  gap: .65rem;
  padding: 1.1rem 1.8rem;
  border-radius: var(--r-full);
  font-family: var(--f-body);
  font-weight: 600;
  font-size: .98rem;
  letter-spacing: -0.005em;
  transition: transform .22s var(--ease-out), box-shadow .22s, background .22s, color .22s;
  white-space: nowrap;
  box-shadow: var(--inset-hi);
}
.btn:hover { transform: translateY(-2px); }
.btn:active { transform: translateY(0) scale(.98); }
.btn__icon {
  width: 28px; height: 28px;
  border-radius: 50%;
  display: inline-grid; place-items: center;
  background: rgba(255,255,255,.18);
  font-size: .72rem;
  transition: transform .35s var(--ease-spring);
}
.btn:hover .btn__icon { transform: translateX(3px); }

.btn--primary {
  background: linear-gradient(135deg, var(--ink-3) 0%, var(--ink-2) 50%, var(--ink) 100%);
  color: var(--cream);
  border: 1px solid rgba(43,89,176,.25);
  box-shadow: var(--inset-hi),
    0 0 0 1px rgba(43,89,176,.10),
    0 18px 36px -14px rgba(9,12,20,.45),
    0 0 36px -10px rgba(43,89,176,.40);
}
.btn--primary:hover {
  background: linear-gradient(135deg, #243056 0%, #16213D 50%, #0E1320 100%);
  box-shadow: var(--inset-hi),
    0 0 0 1px rgba(43,89,176,.45),
    0 24px 46px -16px rgba(9,12,20,.5),
    0 0 48px -6px rgba(43,89,176,.65);
}

.btn--sage {
  background: linear-gradient(135deg, var(--sage-3) 0%, var(--sage) 50%, var(--moss-2) 100%);
  color: var(--cream);
  border: 1px solid rgba(43,89,176,.4);
  box-shadow: var(--inset-hi),
    0 16px 34px -14px rgba(43,89,176,.55),
    0 0 36px -8px rgba(43,89,176,.55);
}
.btn--sage:hover {
  background: linear-gradient(135deg, #7AA6F0 0%, var(--sage-2) 50%, var(--moss) 100%);
  box-shadow: var(--inset-hi),
    0 22px 44px -16px rgba(43,89,176,.7),
    0 0 50px -6px rgba(43,89,176,.75);
}

.btn--ghost {
  background: var(--paper);
  color: var(--text);
  border: 1px solid var(--line-strong);
  box-shadow: var(--inset-hi);
}
.btn--ghost:hover { background: var(--mint-2); border-color: rgba(43,89,176,.4); }

.btn--ghost-light {
  background: transparent;
  color: var(--cream);
  border: 1px solid rgba(255,255,255,.25);
}
.btn--ghost-light:hover { background: var(--cream); color: var(--ink); border-color: var(--cream); }

.btn--link {
  background: transparent;
  padding: .9rem 0;
  color: var(--text);
  font-weight: 500;
}
.btn--link:hover { gap: .9rem; color: var(--moss); }

.btn--lg { padding: 1.2rem 2rem; font-size: 1rem; }
.btn--sm { padding: .7rem 1.1rem; font-size: .88rem; }
.btn--block { width: 100%; justify-content: center; }

/* ============================================================
   PILLS
   ============================================================ */
.pill {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  padding: .4rem .85rem;
  border-radius: var(--r-full);
  font-family: var(--f-label);
  letter-spacing: .22em;
  text-transform: uppercase;
  font-size: .72rem;
  font-weight: 400;
}
.pill--gold {
  background: linear-gradient(135deg, var(--sage-2), var(--sage));
  color: var(--cream);
  border: 1px solid rgba(43,89,176,.6);
  box-shadow: 0 0 18px -4px rgba(43,89,176,.55);
}
.pill--sage {
  background: var(--mint-2);
  color: var(--moss);
  border: 1px solid rgba(43,89,176,.30);
}

/* ============================================================
   UTILITIES · glossy, neon-ring, grain
   ============================================================ */
.glossy {
  position: relative;
  background: var(--gradient-paper);
  border: 1px solid var(--line);
  isolation: isolate;
  overflow: hidden;
}
.glossy::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0; height: 50%;
  background: linear-gradient(180deg, rgba(255,255,255,.6) 0%, transparent 100%);
  pointer-events: none;
  z-index: 0;
}
.neon-ring {
  position: relative;
  isolation: isolate;
}
.neon-ring::before {
  content: '';
  position: absolute;
  inset: -1px;
  border-radius: inherit;
  padding: 1px;
  background: linear-gradient(135deg, rgba(43,89,176,.55) 0%, rgba(43,89,176,0) 35%, rgba(43,89,176,0) 65%, rgba(43,89,176,.35) 100%);
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
  pointer-events: none;
  z-index: 1;
}
.neon-ring--strong::before {
  background: linear-gradient(135deg, rgba(43,89,176,.95) 0%, rgba(43,89,176,.2) 40%, rgba(43,89,176,.15) 60%, rgba(43,89,176,.85) 100%);
}
.grain {
  pointer-events: none;
  position: absolute;
  inset: 0;
  background-image: radial-gradient(rgba(9,9,9,.025) 1px, transparent 1px);
  background-size: 3px 3px;
  mix-blend-mode: multiply;
  opacity: .6;
  z-index: 0;
}

/* ============================================================
   § 1 · NAV
   ============================================================ */
.nav {
  position: fixed;
  top: 0; left: 0; right: 0;
  z-index: 100;
  padding: 1.1rem 0;
  background: rgba(255,255,255,.78);
  -webkit-backdrop-filter: saturate(180%) blur(18px);
  backdrop-filter: saturate(180%) blur(18px);
  border-bottom: 1px solid transparent;
  transition: padding .35s var(--ease), background .35s var(--ease), border-color .35s var(--ease);
}
.nav.is-scrolled {
  padding: .7rem 0;
  border-bottom-color: var(--line);
  background: rgba(255,255,255,.94);
}
.nav__inner {
  display: flex;
  align-items: center;
  gap: 2rem;
}

.brand {
  display: inline-flex;
  align-items: center;
  gap: .8rem;
}
.brand__monogram {
  width: 46px; height: 46px;
  border-radius: 12px;
  display: grid; place-items: center;
  font-family: var(--f-label);
  font-weight: 400;
  font-size: 1.4rem;
  letter-spacing: .04em;
  background: linear-gradient(135deg, var(--ink), var(--ink-3));
  color: var(--sage-3);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.10), 0 4px 14px rgba(9,12,20,.25);
}
.brand__text { display: flex; flex-direction: column; line-height: 1.1; }
.brand__name {
  font-family: var(--f-display);
  font-weight: 600;
  font-size: 1.15rem;
  color: var(--text);
  letter-spacing: -0.005em;
}
.brand__role {
  font-family: var(--f-body);
  font-size: .7rem;
  color: var(--text-soft);
  margin-top: .3rem;
  letter-spacing: .12em;
  text-transform: uppercase;
  font-weight: 500;
}

.nav__menu {
  display: flex;
  gap: 1.8rem;
  margin-left: auto;
}
.nav__menu a {
  font-size: .93rem;
  font-weight: 500;
  color: var(--text-soft);
  position: relative;
  padding: .25rem 0;
  transition: color .25s;
}
.nav__menu a::after {
  content: '';
  position: absolute;
  left: 0; bottom: -4px;
  width: 100%; height: 1px;
  background: var(--sage);
  transform: scaleX(0);
  transform-origin: right;
  transition: transform .35s var(--ease);
}
.nav__menu a:hover { color: var(--text); }
.nav__menu a:hover::after { transform: scaleX(1); transform-origin: left; }

.nav__toggle {
  display: none;
  flex-direction: column;
  gap: 5px;
  padding: 8px;
  margin-left: auto;
}
.nav__toggle span {
  width: 22px; height: 2px;
  background: var(--text);
  border-radius: 2px;
}

@media (max-width: 980px) {
  /* Nav sólido NAVY INK en mobile · contraste premium con la foto */
  .nav {
    padding: 2.6rem 0 1.4rem !important;
    padding-top: max(2.6rem, calc(env(safe-area-inset-top, 0px) + 1.8rem)) !important;
    background: var(--ink) !important;
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
    border-bottom: 1px solid rgba(255,255,255,.06) !important;
    box-shadow: 0 4px 18px rgba(9,12,20,.35) !important;
  }
  .nav.is-scrolled {
    background: var(--ink) !important;
    box-shadow: 0 6px 22px rgba(9,12,20,.55) !important;
  }
  .nav .container,
  .nav__inner {
    padding-inline: 1.1rem !important;
  }
  /* Texto del brand · claro sobre ink */
  .brand__name { color: var(--cream) !important; }
  .brand__role { color: rgba(220,230,245,.7) !important; }
  /* Monograma · electric blue sobre ink */
  .brand__monogram {
    background: linear-gradient(135deg, var(--sage), var(--sage-3, #5A8CE6)) !important;
    color: var(--cream) !important;
    box-shadow: 0 4px 14px rgba(43,89,176,.45) !important;
  }

  .nav__inner {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: .8rem !important;
    width: 100% !important;
  }
  .brand {
    display: flex !important;
    align-items: center !important;
    gap: .6rem !important;
    flex: 1 1 0 !important;
    min-width: 0 !important;
  }
  /* Brand fluido · escala con viewport para que funcione en TODOS los mobiles:
     iPhone SE 320, iPhone mini 360-375, iPhone Pro 393, Motorola/Samsung 412,
     iPhone Pro Max 430, tablets 600-768 */
  .brand__monogram {
    width: clamp(42px, 11vw + 4px, 52px) !important;
    height: clamp(42px, 11vw + 4px, 52px) !important;
    font-size: clamp(1.1rem, 3vw + .2rem, 1.4rem) !important;
    flex: 0 0 clamp(42px, 11vw + 4px, 52px) !important;
    border-radius: 11px !important;
  }
  .brand__text {
    min-width: 0 !important;
    flex: 1 1 auto !important;
    line-height: 1.25 !important;
    padding-block: 2px !important;
  }
  .brand__name {
    font-size: clamp(1rem, 1.4vw + .9rem, 1.4rem) !important;
    line-height: 1.25 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    display: block !important;
  }
  .brand__role {
    font-size: clamp(.62rem, .8vw + .5rem, .85rem) !important;
    line-height: 1.3 !important;
    letter-spacing: .08em !important;
    margin-top: .25rem !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    display: block !important;
  }
  .nav__menu {
    position: fixed;
    inset: 100px 0 auto 0;
    flex-direction: column;
    gap: 0;
    background: var(--ink);
    padding: 1.5rem;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: translateY(-12px);
    transition: opacity .25s var(--ease), transform .3s var(--ease), visibility .3s;
    box-shadow: 0 20px 40px rgba(9,12,20,.5);
    border-top: 1px solid rgba(255,255,255,.06);
    z-index: 90;
  }
  .nav__menu.is-open {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translateY(0);
  }
  .nav__menu a {
    padding: 1rem 0;
    border-bottom: 1px solid rgba(255,255,255,.08);
    font-size: 1.05rem;
    color: var(--cream) !important;
  }
  .nav__cta { display: none; }
  .nav__toggle {
    display: flex !important;
    flex: 0 0 auto !important;
    width: 44px !important;
    height: 44px !important;
    padding: 10px !important;
    margin-left: 0 !important;
    gap: 5px !important;
    border-radius: 10px !important;
    background: var(--sage) !important;
    align-items: center !important;
    justify-content: center !important;
    box-shadow: 0 4px 14px rgba(43,89,176,.45) !important;
  }
  .nav__toggle span {
    width: 22px !important;
    height: 2.5px !important;
    background: var(--cream) !important;
    border-radius: 2px !important;
  }
  .nav__toggle[aria-expanded="true"] span:nth-child(1) {
    transform: translateY(7px) rotate(45deg);
  }
  .nav__toggle[aria-expanded="true"] span:nth-child(2) {
    opacity: 0;
  }
  .nav__toggle[aria-expanded="true"] span:nth-child(3) {
    transform: translateY(-7px) rotate(-45deg);
  }
  .nav__toggle span {
    transition: transform .3s var(--ease), opacity .25s ease;
  }
}

@media (max-width: 480px) {
  /* Brand ya escala con clamp() en @media 980px, no necesita override.
     Solo ajustar gap y padding-inline en phones muy estrechos. */
  .nav__inner { gap: .55rem !important; }
  .nav .container, .nav__inner { padding-inline: .9rem !important; }
}

/* ============================================================
   § 2 · HERO SPLIT EDITORIAL
   ============================================================ */
.hero {
  display: grid;
  grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr);
  min-height: clamp(480px, 70vh, 700px);
  background: var(--cream);
  overflow: hidden;
}

.hero__photo {
  position: relative;
  margin: 0;
  overflow: hidden;
  background: var(--ink-2);
  min-height: 384px;
}
.hero__photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 35%;
  filter: contrast(1.04) saturate(1.06);
}
.hero__photo-frame {
  position: absolute;
  inset: clamp(1rem, 2vw, 2rem);
  border: 1px solid rgba(220,230,245,.22);
  pointer-events: none;
  z-index: 2;
}
.hero__photo-frame::before,
.hero__photo-frame::after {
  content: '';
  position: absolute;
  width: 32px; height: 32px;
  border: 2px solid var(--sage-3);
}
.hero__photo-frame::before { top: -1px; left: -1px; border-right: 0; border-bottom: 0; }
.hero__photo-frame::after  { bottom: -1px; right: -1px; border-left: 0; border-top: 0; }

.hero__photo-caption {
  position: absolute;
  inset: auto 0 0 0;
  z-index: 3;
  padding: clamp(1.8rem, 2vw + 1rem, 2.8rem);
  background: linear-gradient(180deg, transparent 0%, rgba(10,13,20,.55) 45%, rgba(10,13,20,.95) 100%);
  color: var(--cream);
  display: flex;
  flex-direction: column;
  gap: .35rem;
}
.hero__photo-eyebrow {
  font-family: var(--f-label);
  font-size: .95rem;
  letter-spacing: .24em;
  text-transform: uppercase;
  color: var(--sage-3);
  background: rgba(10,13,20,.85);
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
  border: 1px solid rgba(43,89,176,.4);
  padding: .5rem .9rem;
  border-radius: var(--r-full);
  align-self: flex-start;
  box-shadow: 0 4px 14px rgba(9,12,20,.35), 0 0 22px -6px rgba(43,89,176,.45);
  margin-bottom: .5rem;
}
.hero__photo-caption strong {
  font-family: var(--f-display);
  font-size: clamp(1.5rem, 1.1rem + .7vw, 1.85rem);
  font-weight: 600;
  letter-spacing: -0.005em;
}
.hero__photo-role {
  font-family: var(--f-body);
  font-size: .9rem;
  color: rgba(220,230,245,.78);
  font-weight: 500;
}

.hero__content {
  display: flex;
  align-items: center;
  padding: calc(3.5rem + 60px) clamp(1.25rem, 1.2vw, 2rem) 3.5rem clamp(2.5rem, 3vw + .5rem, 4.5rem);
  background: var(--cream);
}
.hero__copy { max-width: 100%; width: 100%; }
.hero__title {
  /* Rango original 32-54px independiente del rem base */
  font-size: clamp(32px, 1.6vw + 24px, 54px);
  margin: 1.2rem 0 1.4rem;
  max-width: 22ch;
  line-height: 1.08;
}
.hero__sub {
  font-size: clamp(1.05rem, .95rem + .35vw, 1.2rem);
  color: var(--text-soft);
  max-width: 760px;
  line-height: 1.6;
  margin-bottom: 2rem;
}
.hero__cta {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  margin-bottom: 2rem;
}
.hero__trust {
  list-style: none;
  margin: 0; padding: 1.2rem 0 1.4rem;
  display: flex;
  flex-wrap: wrap;
  gap: 1rem 1.8rem;
  border-top: 1px solid var(--line);
  max-width: 100%;
}
.hero__trust li {
  display: inline-flex;
  align-items: center;
  gap: .55rem;
  font-size: .85rem;
  color: var(--text-soft);
  font-weight: 500;
}
.hero__trust i { color: var(--sage); font-size: 1rem; }

/* Wrapper con overflow hidden + fade lateral */
.hero__badges-wrap {
  padding-top: 1.4rem;
  border-top: 1px dashed var(--line);
  max-width: 100%;
  overflow: hidden;
  mask-image: linear-gradient(90deg, transparent, black 5%, black 95%, transparent);
  -webkit-mask-image: linear-gradient(90deg, transparent, black 5%, black 95%, transparent);
}
/* Track con los logos */
.hero__badges {
  display: inline-flex;
  flex-wrap: nowrap;
  gap: 2.8rem;
  align-items: center;
  white-space: nowrap;
  animation: badges-marquee 8s linear infinite;
}
@keyframes badges-marquee {
  from { transform: translateX(0); }
  to   { transform: translateX(-50%); }
}
.hero__badges:hover { animation-play-state: paused; }
.hero__badges img {
  height: clamp(65px, 2.9rem + 2.4vw, 94px);
  width: auto;
  max-width: 215px;
  flex-shrink: 0;
  object-fit: contain;
  filter: grayscale(.15) opacity(.88);
  transition: filter .35s, transform .35s;
}
.hero__badges img:hover {
  filter: grayscale(0) opacity(1);
  transform: scale(1.06);
}

@media (max-width: 980px) {
  .hero {
    grid-template-columns: 1fr;
    min-height: auto;
    display: flex;
    flex-direction: column;
  }
  /* FOTO PRIMERO (orden DOM normal), texto después */
  .hero__photo {
    min-height: auto;
    aspect-ratio: 4/5;
    width: 100%;
  }
  .hero__photo img { object-position: center 30%; }
  /* Caption oculto en mobile · el nombre ya esta en el nav y abajo en hero */
  .hero__photo-caption { display: none !important; }
  .hero__content {
    padding: 2.2rem clamp(1.5rem, 4vw, 2.5rem) 2.5rem;
    width: 100%;
  }
}

/* ============================================================
   § 3 · STRIP · marquees
   ============================================================ */
.strip {
  background: var(--cream);
  padding: 3rem 0 3.5rem;
  overflow: hidden;
}
.strip__label {
  font-family: var(--f-label);
  font-size: clamp(.95rem, .85rem + .25vw, 1.1rem);
  letter-spacing: .26em;
  text-transform: uppercase;
  color: var(--text-soft);
  text-align: center;
  margin-bottom: 2rem;
}
.marquee {
  overflow: hidden;
  mask-image: linear-gradient(90deg, transparent, black 6%, black 94%, transparent);
  -webkit-mask-image: linear-gradient(90deg, transparent, black 6%, black 94%, transparent);
  padding: .4rem 0;
}
.marquee + .marquee { margin-top: 1.5rem; }
.marquee__track {
  display: inline-flex;
  align-items: center;
  gap: clamp(2.5rem, 1.5rem + 2vw, 4.5rem);
  white-space: nowrap;
}
@keyframes marquee-l { from { transform: translateX(0); } to { transform: translateX(-50%); } }
@keyframes marquee-r { from { transform: translateX(-50%); } to { transform: translateX(0); } }
.marquee__track--ltr { animation: marquee-l 15.3s linear infinite; }
.marquee__track--rtl { animation: marquee-r 18.7s linear infinite; }
.marquee:hover .marquee__track { animation-play-state: paused; }

.marquee img {
  height: clamp(32px, 1.6rem + 1.4vw, 52px);
  width: auto;
  max-width: 180px;
  object-fit: contain;
  opacity: .9;
  transition: opacity .35s, transform .35s;
  flex-shrink: 0;
}
.marquee img:hover {
  opacity: 1;
  transform: scale(1.08);
}

/* ============================================================
   § 4 · FEATURES
   ============================================================ */
.features {
  padding: clamp(5rem, 7vw, 8rem) 0 clamp(4rem, 5vw, 6rem);
  background: var(--cream);
}
.features__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.5rem;
  margin-top: 3rem;
}
.feature-card {
  position: relative;
  background: var(--paper);
  padding: 2.2rem 1.8rem 1.8rem;
  border-radius: var(--r-lg);
  border: 1px solid var(--line);
  box-shadow: var(--sh-1);
  transition: transform .45s var(--ease-out), box-shadow .45s, border-color .45s;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  isolation: isolate;
}
.feature-card:hover {
  transform: translateY(-8px);
  box-shadow: var(--sh-3);
  border-color: rgba(43,89,176,.30);
}
.feature-card__icon {
  width: 64px; height: 64px;
  border-radius: 16px;
  display: grid; place-items: center;
  background: linear-gradient(135deg, var(--mint), var(--mint-2));
  color: var(--moss);
  font-size: 1.55rem;
  transition: transform .5s var(--ease-spring);
}
.feature-card:hover .feature-card__icon {
  transform: scale(1.08) rotate(-5deg);
}
.feature-card h3 {
  font-size: clamp(1.15rem, 1rem + .4vw, 1.3rem);
  font-weight: 600;
}
.feature-card > p {
  color: var(--text-soft);
  font-size: .94rem;
  line-height: 1.55;
}
.feature-card__list {
  list-style: none;
  margin: auto 0 0;
  padding: 1rem 0 0;
  border-top: 1px dashed var(--line);
  display: flex;
  flex-direction: column;
  gap: .5rem;
}
.feature-card__list li {
  font-size: .87rem;
  color: var(--text);
  display: flex; align-items: center; gap: .55rem;
  font-weight: 500;
}
.feature-card__list i { color: var(--sage); font-size: .8rem; }

.feature-card--featured {
  background: linear-gradient(160deg, var(--ink-2), var(--ink));
  color: var(--cream);
  border-color: transparent;
  box-shadow: var(--sh-ink);
}
.feature-card--featured::after {
  content: '';
  position: absolute;
  top: -50px; right: -50px;
  width: 200px; height: 200px;
  background: radial-gradient(circle, rgba(43,89,176,.25), transparent 65%);
  pointer-events: none;
  z-index: -1;
}
.feature-card--featured h3 { color: var(--cream); }
.feature-card--featured > p { color: rgba(220,230,245,.75); }
.feature-card--featured .feature-card__list { border-top-color: rgba(220,230,245,.18); }
.feature-card--featured .feature-card__list li { color: var(--mint); }
.feature-card--featured .feature-card__list i { color: var(--sage-3); }
.feature-card--featured .feature-card__icon {
  background: linear-gradient(135deg, var(--sage-2), var(--sage));
  color: var(--cream);
  box-shadow: 0 10px 28px rgba(43,89,176,.45);
}
.feature-card__pill {
  position: absolute;
  top: 1.4rem; right: 1.4rem;
  font-family: var(--f-label);
  font-size: .78rem;
  letter-spacing: .2em;
  text-transform: uppercase;
  padding: .35rem .75rem;
  border-radius: var(--r-full);
  background: var(--sage);
  color: var(--cream);
  font-weight: 400;
}

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

/* ============================================================
   § 5 · MÉTRICAS
   ============================================================ */
.metrics {
  padding: clamp(5rem, 7vw, 8rem) 0;
  background: var(--paper);
  position: relative;
  overflow: hidden;
}
.watermark {
  position: absolute;
  top: 50%; left: 50%;
  transform: translate(-50%, -50%);
  font-family: var(--f-display);
  font-weight: 700;
  font-size: clamp(8rem, 4rem + 18vw, 22rem);
  letter-spacing: -0.05em;
  line-height: 1;
  color: transparent;
  -webkit-text-stroke: 1.5px rgba(43,89,176,.10);
  pointer-events: none;
  z-index: 0;
  user-select: none;
  white-space: nowrap;
}
.metrics .container { position: relative; z-index: 1; }
.metrics__grid {
  display: grid;
  grid-template-columns: 1.4fr repeat(4, 1fr);
  gap: 3rem;
  align-items: stretch;
}
.metrics__head {
  max-width: 320px;
  border-top: 1px solid var(--ink);
  padding-top: 1.2rem;
  display: flex;
  flex-direction: column;
}
.metrics__head .eyebrow { margin-bottom: .9rem; }
.metrics__head h2 {
  font-size: clamp(1.55rem, 1.1rem + 1.1vw, 2.1rem);
  margin-top: 0;
  letter-spacing: -0.01em;
  line-height: 1.15;
}
.metric {
  border-top: 1px solid var(--ink);
  padding-top: 1.2rem;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
}
.metric__num {
  display: block;
  font-family: var(--f-display);
  font-size: clamp(2.8rem, 2rem + 2.6vw, 4.6rem);
  font-weight: 500;
  line-height: .95;
  color: var(--text);
  letter-spacing: -0.025em;
}
.metric__label {
  display: block;
  font-size: .85rem;
  color: var(--text-soft);
  margin-top: .75rem;
  line-height: 1.4;
}

@media (max-width: 980px) {
  .metrics__grid { grid-template-columns: 1fr 1fr; gap: 2rem; }
  .metrics__head { grid-column: 1 / -1; max-width: none; }
}

/* ============================================================
   § 6-7 · ANAQUELES
   ============================================================ */
.anaquel {
  padding-block: clamp(4rem, 5vw, 7rem);
  background: var(--cream);
}
.anaquel.anaquel--dark {
  background: linear-gradient(180deg, var(--mint-2) 0%, var(--cream) 100%);
}

.anaquel__shell {
  border-radius: var(--r-2xl);
  padding: 1.2rem;
  box-shadow: var(--sh-xl);
}
.anaquel--light .anaquel__shell {
  background: linear-gradient(160deg, var(--mint) 0%, var(--mint-2) 100%);
}
.anaquel--dark .anaquel__shell {
  background: linear-gradient(160deg, var(--ink-2) 0%, var(--ink) 100%);
}

.anaquel__core {
  border-radius: calc(var(--r-2xl) - 8px);
  padding: clamp(2.4rem, 3.5vw, 3.6rem);
  overflow: hidden;
  position: relative;
}
.anaquel--light .anaquel__core { background: var(--paper); color: var(--text); }
.anaquel--dark .anaquel__core { background: linear-gradient(170deg, var(--ink) 0%, var(--ink-3) 100%); color: var(--cream); }
.anaquel--dark .anaquel__core::before {
  content: ''; position: absolute; inset: 0;
  background-image:
    linear-gradient(rgba(43,89,176,.06) 1px, transparent 1px),
    linear-gradient(90deg, rgba(43,89,176,.06) 1px, transparent 1px);
  background-size: 48px 48px;
  mask-image: radial-gradient(circle at 80% 20%, #000 0%, transparent 65%);
  -webkit-mask-image: radial-gradient(circle at 80% 20%, #000 0%, transparent 65%);
  pointer-events: none;
}
.anaquel--dark .anaquel__core::after {
  content: ''; position: absolute;
  right: -80px; top: -80px;
  width: 320px; height: 320px; border-radius: 50%;
  background: radial-gradient(circle, rgba(43,89,176,.25), transparent 60%);
  pointer-events: none;
}

.anaquel__grid {
  display: grid;
  grid-template-columns: 1.05fr 1fr;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: stretch;
  position: relative;
  z-index: 1;
}
.anaquel__left {
  display: flex;
  flex-direction: column;
}
.anaquel__left > .btn { margin-top: auto; }

.anaquel__num {
  font-family: var(--f-display);
  font-weight: 600;
  font-size: clamp(3.6rem, 2rem + 3vw, 5.2rem);
  line-height: 1;
  letter-spacing: -0.04em;
  margin-bottom: .9rem;
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}
.anaquel--light .anaquel__num {
  background-image: linear-gradient(120deg, var(--moss) 10%, var(--sage) 80%);
}
.anaquel--dark .anaquel__num {
  background-image: linear-gradient(120deg, var(--sage-3) 10%, var(--mint) 80%);
}

.anaquel--dark .eyebrow { color: var(--sage-3); }
.anaquel--dark .eyebrow .dot { background: var(--sage-3); }

.anaquel__title {
  font-size: clamp(1.9rem, 1.2rem + 1.7vw, 2.6rem);
  margin-top: .7rem;
  max-width: 18ch;
  line-height: 1.08;
}
.anaquel--dark .anaquel__title { color: var(--cream); }

.anaquel__tags {
  display: flex;
  gap: .55rem;
  flex-wrap: wrap;
  margin: 1.2rem 0 1.6rem;
}
.anaquel__tag {
  font-family: var(--f-body);
  font-weight: 500;
  font-size: .95rem;
  padding: .45rem 1rem;
  border-radius: var(--r-full);
  background: transparent;
  border: 1px solid rgba(43,89,176,.32);
}
.anaquel--light .anaquel__tag { color: var(--moss); }
.anaquel--dark .anaquel__tag { color: var(--sage-3); }

/* === TABS === */
.anaquel__tabs {
  display: flex;
  flex-direction: column;
  gap: .65rem;
  margin-bottom: 1.6rem;
}
.anaquel__tab {
  display: grid;
  grid-template-columns: 64px 1fr auto auto;
  align-items: center;
  gap: 1.1rem;
  padding: .85rem .9rem;
  border-radius: var(--r-md);
  text-align: left;
  transition: all .22s var(--ease-out);
  cursor: pointer;
  width: 100%;
  appearance: none;
}
.anaquel--light .anaquel__tab {
  background: var(--cream);
  border: 1px solid var(--line);
  color: var(--text);
}
.anaquel--dark .anaquel__tab {
  background: rgba(255,255,255,.025);
  border: 1px solid rgba(255,255,255,.06);
  color: var(--cream);
}
.anaquel--light .anaquel__tab:hover {
  background: var(--mint-2);
  border-color: rgba(43,89,176,.32);
}
.anaquel--dark .anaquel__tab:hover {
  background: rgba(43,89,176,.08);
  border-color: rgba(43,89,176,.32);
}
.anaquel--light .anaquel__tab.is-active {
  background: linear-gradient(135deg, var(--mint), var(--mint-2));
  border-color: var(--moss);
  box-shadow: 0 14px 28px -16px rgba(9,12,20,.6), 0 0 28px -10px rgba(43,89,176,.55);
}
.anaquel--dark .anaquel__tab.is-active {
  background: linear-gradient(135deg, rgba(43,89,176,.16), rgba(43,89,176,.04));
  border-color: var(--sage);
  box-shadow: 0 14px 28px -16px rgba(0,0,0,.55), 0 0 32px -8px rgba(43,89,176,.45);
}

.anaquel__tab-thumb {
  position: relative;
  width: 64px; height: 64px;
  border-radius: 12px;
  overflow: hidden;
  flex: 0 0 auto;
}
.anaquel--light .anaquel__tab-thumb { background: var(--paper); border: 1px solid var(--line); }
.anaquel--dark .anaquel__tab-thumb { background: rgba(43,89,176,.10); border: 1px solid rgba(43,89,176,.18); }
.anaquel__tab-thumb img {
  width: 100%; height: 100%;
  object-fit: cover;
  object-position: center 28%;
  filter: saturate(1.05);
}
.anaquel__tab-icon {
  position: absolute;
  right: 4px; bottom: 4px;
  width: 22px; height: 22px;
  border-radius: 50%;
  display: grid; place-items: center;
  background: linear-gradient(135deg, var(--sage-2), var(--sage));
  color: var(--cream);
  box-shadow: 0 4px 10px -4px rgba(43,89,176,.65), 0 0 16px -2px rgba(43,89,176,.55);
  font-size: .7rem;
}

.anaquel__tab-body { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.anaquel__tab-title {
  font-family: var(--f-display);
  font-weight: 600;
  font-size: 1.25rem;
  letter-spacing: -0.005em;
}
.anaquel__tab-sub { font-size: .95rem; }
.anaquel--light .anaquel__tab-sub { color: var(--text-mute); }
.anaquel--dark .anaquel__tab-sub { color: rgba(220,230,245,.6); }

.anaquel__tab-arrow {
  width: 32px; height: 32px; border-radius: 50%;
  display: grid; place-items: center;
  opacity: .35;
  transition: transform .25s, opacity .25s;
  font-size: .8rem;
}
.anaquel--light .anaquel__tab-arrow { color: var(--text); }
.anaquel--dark .anaquel__tab-arrow { color: var(--cream); }
.anaquel__tab-arrow.is-rot,
.anaquel__tab.is-active .anaquel__tab-arrow {
  transform: rotate(90deg);
  opacity: 1;
}

/* Stats row */
.anaquel__statsRow {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  padding: 1rem 0 1.4rem;
  margin-bottom: 1.6rem;
}
.anaquel--light .anaquel__statsRow {
  border-top: 1px dashed var(--line);
  border-bottom: 1px dashed var(--line);
}
.anaquel--dark .anaquel__statsRow {
  border-top: 1px dashed rgba(220,230,245,.18);
  border-bottom: 1px dashed rgba(220,230,245,.18);
}
.anaquel__statCell strong {
  display: block;
  font-family: var(--f-display);
  font-weight: 600;
  font-size: 1.85rem;
  letter-spacing: -0.02em;
  line-height: 1.05;
}
.anaquel--dark .anaquel__statCell strong { color: var(--cream); }
.anaquel__statCell span {
  font-family: var(--f-label);
  font-size: .7rem;
  letter-spacing: 0.22em;
  text-transform: uppercase;
}
.anaquel--light .anaquel__statCell span { color: var(--moss); }
.anaquel--dark .anaquel__statCell span { color: var(--sage-3); }

/* APAN panel right */
.anaquel__right { position: sticky; top: 100px; }
.apan {
  border-radius: var(--r-lg);
  padding: 1.2rem;
  display: flex;
  flex-direction: column;
}
.apan[hidden] { display: none; }
.anaquel--light .apan { background: var(--cream); border: 1px solid var(--line); }
.anaquel--dark .apan { background: rgba(255,255,255,.04); border: 1px solid rgba(255,255,255,.06); }

.apan__media {
  position: relative;
  border-radius: var(--r-md);
  overflow: hidden;
  aspect-ratio: 3 / 2;
  background: var(--ink);
}
.apan__media img {
  width: 100%; height: 100%;
  object-fit: cover;
  object-position: center 35%;
  filter: saturate(1.05);
}
.apan__media-tag {
  position: absolute;
  bottom: 1rem; left: 1rem;
  display: inline-flex;
  align-items: center;
  gap: .6rem;
  padding: .55rem .85rem;
  background: rgba(255,255,255,.92);
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
  border-radius: var(--r-full);
}
.apan__media-icon {
  width: 24px; height: 24px;
  border-radius: 50%;
  display: grid; place-items: center;
  background: var(--mint);
  color: var(--moss);
  font-size: .72rem;
}
.apan__media-tag .eyebrow { color: var(--text); }

.apan__body {
  padding: 1.2rem .4rem .4rem;
  display: flex;
  flex-direction: column;
  gap: .9rem;
}
.apan__body h4 { line-height: 1.15; }
.anaquel--dark .apan__body h4 { color: var(--cream); }
.apan__body p { font-size: .98rem; line-height: 1.6; }
.anaquel--dark .apan__body p { color: rgba(220,230,245,.78); }

.apan__stats {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .8rem;
  padding: 1rem;
  border-radius: var(--r-md);
}
.anaquel--light .apan__stats { background: var(--paper); border: 1px solid var(--line); box-shadow: var(--sh-1); }
.anaquel--dark .apan__stats { background: rgba(43,89,176,.08); border: 1px solid rgba(43,89,176,.18); }
.apan__stat { display: flex; flex-direction: column; gap: 2px; }
.apan__statk {
  font-family: var(--f-label);
  font-size: .68rem;
  letter-spacing: 0.22em;
  text-transform: uppercase;
}
.anaquel--light .apan__statk { color: var(--moss); }
.anaquel--dark .apan__statk { color: var(--sage-3); }
.apan__stat strong {
  font-family: var(--f-display);
  font-weight: 500;
  font-size: 1.4rem;
  letter-spacing: -0.02em;
}
.anaquel--dark .apan__stat strong { color: var(--cream); }

.apan__checks {
  list-style: none;
  padding: 0; margin: 0;
  display: flex;
  flex-direction: column;
  gap: .5rem;
  font-size: .92rem;
}
.anaquel--light .apan__checks { color: var(--text-soft); }
.anaquel--dark .apan__checks { color: rgba(220,230,245,.85); }
.apan__checks li { display: inline-flex; align-items: center; gap: .5rem; }
.apan__checks i { flex: 0 0 auto; font-size: .8rem; }
.anaquel--light .apan__checks i { color: var(--moss); }
.anaquel--dark .apan__checks i { color: var(--sage-3); }

@media (max-width: 1000px) {
  .anaquel__grid { grid-template-columns: 1fr; }
  .anaquel__right { position: static; }
  .apan__media { aspect-ratio: 16/10; }
}

/* ============================================================
   § 8 · TIMELINE pill zigzag
   ============================================================ */
.timeline {
  padding: clamp(5rem, 7vw, 8rem) 0;
  background: var(--paper);
}
.timeline__list {
  list-style: none;
  margin: 3rem auto 0;
  padding: 0;
  max-width: 760px;
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 1.4rem;
}
.timeline__list::before {
  content: '';
  position: absolute;
  top: 36px; bottom: 36px;
  left: 50%;
  width: 0;
  border-left: 2px dashed rgba(43,89,176,.20);
  transform: translateX(-50%);
}
.timeline__step {
  position: relative;
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: 1rem;
  align-items: center;
  padding: 1rem 1.4rem;
  background: var(--paper);
  border-radius: var(--r-full);
  box-shadow: 0 14px 40px -14px rgba(9,12,20,.18), 0 1px 3px rgba(9,12,20,.05);
  border: 1px solid var(--line);
  min-height: 84px;
  z-index: 1;
}
.timeline__step:nth-child(odd) { margin-left: clamp(0rem, 5vw, 5rem); }
.timeline__step:nth-child(even) { margin-right: clamp(0rem, 5vw, 5rem); }
.timeline__step:nth-child(even) .timeline__icon { order: 3; }
.timeline__step:nth-child(even) .timeline__body { order: 2; }
.timeline__step:nth-child(even) .timeline__num { order: 1; }

.timeline__num {
  font-family: var(--f-display);
  font-size: clamp(1.4rem, 1rem + 1vw, 1.85rem);
  font-weight: 600;
  color: var(--cream);
  background: linear-gradient(135deg, var(--moss), var(--ink-3));
  border-radius: var(--r-full);
  padding: .7rem 1.3rem;
  letter-spacing: -0.01em;
  line-height: 1;
  min-width: 70px;
  text-align: center;
}
.timeline__icon {
  width: 52px; height: 52px;
  border-radius: 50%;
  background: var(--mint);
  color: var(--moss);
  display: grid; place-items: center;
  font-size: 1.2rem;
  flex-shrink: 0;
}
.timeline__body { min-width: 0; padding: 0 .4rem; }
.timeline__step:nth-child(even) .timeline__body { text-align: right; }
.timeline__body h3 {
  font-size: 1.15rem;
  font-weight: 600;
  margin: 0 0 .15rem;
  line-height: 1.2;
}
.timeline__body p {
  margin: 0;
  font-size: .87rem;
  line-height: 1.5;
}
.timeline__time {
  display: inline-flex;
  gap: .4rem;
  align-items: center;
  margin-top: .35rem;
  font-family: var(--f-label);
  font-size: .8rem;
  color: var(--moss);
  letter-spacing: .14em;
  text-transform: uppercase;
}
.timeline__time i { font-size: .7rem; opacity: .7; }

.timeline__step.is-key {
  background: linear-gradient(135deg, var(--ink), var(--ink-2));
  border-color: rgba(43,89,176,.30);
  box-shadow: 0 22px 48px -14px rgba(9,12,20,.45), 0 0 60px -20px rgba(43,89,176,.55);
}
.timeline__step.is-key .timeline__body h3 { color: var(--cream); }
.timeline__step.is-key .timeline__body p { color: rgba(220,230,245,.72); }
.timeline__step.is-key .timeline__time { color: var(--sage-3); }
.timeline__step.is-key .timeline__icon { background: rgba(43,89,176,.18); color: var(--sage-3); }
.timeline__step.is-key .timeline__num {
  background: linear-gradient(135deg, var(--sage-3), var(--mint));
  color: var(--ink);
}

.timeline__cta {
  text-align: center;
  margin-top: 3rem;
}

@media (max-width: 760px) {
  .timeline__list::before { display: none; }
  .timeline__step {
    grid-template-columns: auto 1fr;
    border-radius: var(--r-lg);
    margin: 0 !important;
    padding: 1.2rem 1.3rem;
  }
  .timeline__num { grid-row: 1 / 2; }
  .timeline__icon { grid-row: 1 / 2; grid-column: 2 / 3; justify-self: end; }
  .timeline__body { grid-column: 1 / -1; text-align: left !important; padding: 0; }
  .timeline__step:nth-child(even) .timeline__num,
  .timeline__step:nth-child(even) .timeline__icon,
  .timeline__step:nth-child(even) .timeline__body { order: unset; }
  .timeline__step:nth-child(even) .timeline__icon { justify-self: end; }
}

/* ============================================================
   § 9 · CALCULADORA
   ============================================================ */
.calc {
  padding: clamp(5rem, 7vw, 8rem) 0;
  background: linear-gradient(180deg, var(--paper) 0%, var(--cream) 100%);
}
.calc__grid {
  display: grid;
  grid-template-columns: 1fr 1.1fr;
  gap: 4rem;
  align-items: center;
}
.calc__intro h2 {
  font-size: clamp(1.8rem, 1.3rem + 1.6vw, 2.8rem);
  margin: 1rem 0;
}
.calc__intro p { color: var(--text-soft); max-width: 420px; margin-bottom: 2rem; }
.calc__visual {
  max-width: 340px;
  position: relative;
}
.calc__visual::before {
  content: '';
  position: absolute;
  inset: -20px;
  background: radial-gradient(circle, rgba(43,89,176,.18), transparent 60%);
  z-index: -1;
}
.calc__visual img { filter: drop-shadow(0 20px 35px rgba(9,12,20,.18)); }

.calc__panel {
  border-radius: var(--r-xl);
  padding: clamp(1.5rem, 1.2rem + 1.5vw, 2.4rem);
  display: flex;
  flex-direction: column;
  gap: 1.3rem;
  box-shadow: var(--sh-3);
}

.field { display: flex; flex-direction: column; gap: .6rem; position: relative; z-index: 1; }
.field label {
  font-family: var(--f-label);
  font-size: .92rem;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--text-soft);
  display: flex; justify-content: space-between; align-items: center;
}
.field label strong {
  font-family: var(--f-display);
  color: var(--text);
  font-size: 1.15rem;
  font-weight: 600;
  letter-spacing: -0.005em;
  text-transform: none;
}
.field__input {
  display: flex;
  align-items: center;
  background: var(--mint-2);
  border-radius: var(--r-md);
  padding: 0 1rem;
  border: 1px solid var(--line);
  transition: border-color .25s;
}
.field__input:focus-within { border-color: var(--sage); background: var(--paper); }
.field__prefix, .field__suffix {
  color: var(--text-mute);
  font-weight: 600;
  font-size: .9rem;
}
.field__input input {
  flex: 1;
  background: transparent;
  border: 0;
  padding: 1rem .5rem;
  font-family: var(--f-display);
  font-size: 1.55rem;
  font-weight: 500;
  color: var(--text);
  outline: none;
  min-width: 0;
  letter-spacing: -0.01em;
}

.field--range input[type="range"] {
  -webkit-appearance: none;
  appearance: none;
  width: 100%;
  height: 6px;
  border-radius: var(--r-full);
  background: var(--mint);
  outline: none;
}
.field--range input[type="range"]::-webkit-slider-thumb {
  -webkit-appearance: none;
  width: 22px; height: 22px;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--sage-3), var(--sage));
  border: 3px solid var(--paper);
  box-shadow: 0 4px 12px rgba(43,89,176,.45);
  cursor: pointer;
}
.field--range input[type="range"]::-moz-range-thumb {
  width: 22px; height: 22px;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--sage-3), var(--sage));
  border: 3px solid var(--paper);
  cursor: pointer;
}

.chips { display: flex; align-items: center; gap: .55rem; flex-wrap: wrap; }
.chip {
  padding: .65rem 1.05rem;
  border-radius: var(--r-full);
  border: 1px solid var(--line);
  font-weight: 600;
  font-size: .9rem;
  color: var(--text-soft);
  transition: all .25s;
}
.chip:hover { border-color: var(--text); color: var(--text); }
.chip.is-active {
  background: var(--ink);
  border-color: var(--ink);
  color: var(--cream);
}
.chips__caption { color: var(--text-soft); font-size: .85rem; margin-left: .35rem; }

.calc__results {
  margin-top: .8rem;
  padding-top: 1.2rem;
  border-top: 1px solid var(--line);
  display: flex;
  flex-direction: column;
  gap: .65rem;
  position: relative;
  z-index: 1;
}
.calc__row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: .92rem;
  color: var(--text-soft);
}
.calc__row strong {
  font-family: var(--f-display);
  font-size: 1.2rem;
  font-weight: 600;
  color: var(--text);
  letter-spacing: -0.005em;
}
.calc__row--hero {
  margin-top: .6rem;
  padding: 1rem 1.2rem;
  background: linear-gradient(135deg, var(--ink), var(--ink-3));
  border-radius: var(--r-md);
  color: var(--cream);
  box-shadow: var(--sh-ink);
}
.calc__row--hero span {
  font-family: var(--f-label);
  color: rgba(220,230,245,.7);
  font-size: .92rem;
  letter-spacing: .22em;
  text-transform: uppercase;
}
.calc__row--hero strong {
  font-family: var(--f-display);
  font-size: 1.85rem;
  background: linear-gradient(135deg, var(--sage-3), var(--mint));
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  letter-spacing: -0.01em;
}

.calc__legal {
  font-size: .75rem;
  color: var(--text-mute);
  text-align: center;
  position: relative;
  z-index: 1;
}

@media (max-width: 900px) {
  .calc__grid { grid-template-columns: 1fr; gap: 2.5rem; }
  .calc__visual { display: none; }
}

/* ============================================================
   § 10 · BIO
   ============================================================ */
.bio {
  padding: clamp(5rem, 7vw, 8rem) 0;
  background: var(--cream);
}
.bio__grid {
  display: grid;
  grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr);
  gap: 4rem;
  align-items: center;
}
.bio__photo {
  position: relative;
  margin: 0;
  border-radius: var(--r-2xl);
  overflow: hidden;
  box-shadow: var(--sh-3);
}
.bio__photo img {
  width: 100%;
  aspect-ratio: 4/5;
  object-fit: cover;
  object-position: center 75%;
  filter: contrast(1.02) saturate(.92) brightness(.96);
}
.bio__photo figcaption {
  position: absolute;
  inset: auto 0 0 0;
  padding: 1.6rem 1.8rem;
  background: linear-gradient(180deg, transparent, rgba(9,12,20,.88));
  color: var(--sage-3);
  font-family: var(--f-label);
  font-size: 1rem;
  letter-spacing: .22em;
  text-transform: uppercase;
}
.bio__text h2 {
  font-size: clamp(2rem, 1.4rem + 2vw, 3.4rem);
  margin: 1rem 0 1.5rem;
}
.bio__pillars {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.2rem;
  margin: 2rem 0;
}
.bio__pillars > div {
  display: flex;
  flex-direction: column;
  gap: .35rem;
  padding: 1.2rem;
  background: var(--paper);
  border-radius: var(--r-md);
  border: 1px solid var(--line);
}
.bio__pillars i { font-size: 1.2rem; color: var(--moss); margin-bottom: .35rem; }
.bio__pillars strong {
  font-family: var(--f-display);
  font-size: 1.2rem;
  font-weight: 600;
  color: var(--text);
}
.bio__pillars span { font-size: .88rem; color: var(--text-soft); line-height: 1.5; }

@media (max-width: 880px) {
  .bio__grid { grid-template-columns: 1fr; gap: 2rem; }
  .bio__photo { max-width: 440px; margin: 0 auto; }
  .bio__pillars { grid-template-columns: 1fr; }
}

/* ============================================================
   § 11 · TESTIMONIOS
   ============================================================ */
.testimonios {
  padding: clamp(4rem, 6vw, 7rem) 0;
  background: var(--paper);
}
.testimonios__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.5rem;
}
.quote {
  background: var(--cream);
  padding: 2rem;
  border-radius: var(--r-lg);
  border: 1px solid var(--line);
  transition: transform .4s var(--ease-out), box-shadow .4s;
}
.quote:hover { transform: translateY(-6px); box-shadow: var(--sh-3); }
.quote p {
  font-family: var(--f-body);
  font-size: 1.1rem;
  line-height: 1.55;
  color: var(--text);
  font-style: italic;
  font-weight: 500;
  margin: 0 0 1.4rem;
  position: relative;
}
.quote p::before {
  content: '"';
  position: absolute;
  top: -.55em; left: -.15em;
  font-size: 4rem;
  color: var(--sage);
  opacity: .5;
  font-family: var(--f-display);
  font-weight: 700;
  line-height: 1;
}
.quote footer { display: flex; flex-direction: column; gap: .2rem; }
.quote footer strong { font-family: var(--f-body); font-weight: 600; color: var(--text); }
.quote footer span { font-size: .8rem; color: var(--text-soft); }

.quote--featured {
  background: linear-gradient(135deg, var(--ink), var(--ink-2));
  border-color: transparent;
}
.quote--featured p { color: var(--cream); }
.quote--featured footer strong { color: var(--cream); }
.quote--featured footer span { color: rgba(220,230,245,.6); }
.quote--featured p::before { color: var(--sage-3); opacity: 1; }

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

/* ============================================================
   § 12 · FAQ
   ============================================================ */
.faq {
  padding: clamp(5rem, 7vw, 8rem) 0;
  background: var(--cream);
}
.faq__grid {
  display: grid;
  grid-template-columns: minmax(0, .9fr) minmax(0, 1.4fr);
  gap: 4rem;
  align-items: start;
}
.faq__head { position: sticky; top: 110px; }
.faq__head h2 {
  font-size: clamp(1.6rem, 1.2rem + 1.4vw, 2.4rem);
  margin: 1rem 0;
}
.faq__head p { color: var(--text-soft); margin-bottom: 1.5rem; }
.faq__head .btn--link { padding: 0; color: var(--moss); }
.faq__head .btn--link:hover { color: var(--ink); gap: .9rem; }

/* Calendario GHL embed · llena el espacio izquierdo */
.faq__calendar {
  margin-top: 2rem;
  padding: 1.2rem;
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
  box-shadow: var(--sh-2);
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
.cal__head { display: flex; flex-direction: column; gap: .35rem; }
.cal__title {
  font-family: var(--f-display);
  font-size: 1.25rem;
  font-weight: 600;
  letter-spacing: -0.005em;
  color: var(--text);
  margin: .3rem 0 0;
}
.cal__sub {
  font-size: .82rem;
  color: var(--text-soft);
  margin: 0;
}
.cal__embed {
  position: relative;
  width: 100%;
  border-radius: var(--r-md);
  overflow: hidden;
  background: var(--cream);
  border: 1px solid var(--line);
}
.cal__embed iframe {
  width: 100%;
  min-height: 720px;
  display: block;
  border: 0;
}
@media (max-width: 880px) {
  .cal__embed iframe { min-height: 640px; }
}

/* Trust card · (legacy) llena el espacio del lado izquierdo con valor */
.faq__trust {
  margin-top: 2rem;
  padding: 1.4rem;
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
  box-shadow: var(--sh-2);
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
.faq__trust-top {
  display: flex;
  align-items: center;
  gap: .85rem;
}
.faq__trust-top img {
  width: 52px; height: 52px;
  border-radius: 50%;
  object-fit: cover;
  object-position: center 25%;
  border: 2px solid var(--mint-2);
}
.faq__trust-top strong {
  display: block;
  font-family: var(--f-display);
  font-size: 1.1rem;
  font-weight: 600;
  color: var(--text);
  letter-spacing: -0.005em;
}
.faq__trust-top > div > span {
  font-family: var(--f-label);
  font-size: .78rem;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--moss);
}

.faq__trust-rating {
  display: flex;
  align-items: center;
  gap: .5rem;
  padding: .6rem 0;
  border-top: 1px dashed var(--line);
  border-bottom: 1px dashed var(--line);
}
.faq__stars {
  color: var(--sage-2);
  font-size: 1rem;
  letter-spacing: .12em;
}
.faq__trust-rating strong {
  font-family: var(--f-display);
  font-size: 1.15rem;
  font-weight: 600;
  color: var(--text);
}
.faq__trust-meta {
  font-size: .85rem;
  color: var(--text-soft);
}

.faq__trust-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: .55rem;
}
.faq__trust-list li {
  display: flex;
  align-items: center;
  gap: .6rem;
  font-size: .88rem;
  color: var(--text-soft);
}
.faq__trust-list i {
  width: 18px;
  font-size: .85rem;
  color: var(--sage);
  flex-shrink: 0;
}

.faq__list {
  list-style: none;
  padding: 0; margin: 0;
  display: flex;
  flex-direction: column;
  gap: .75rem;
}
.faq__item {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--r-md);
  overflow: hidden;
  transition: border-color .35s, box-shadow .35s;
}
.faq__item.is-open {
  border-color: var(--sage);
  box-shadow: 0 14px 36px -10px rgba(43,89,176,.20);
}
.faq__q {
  width: 100%;
  padding: 1.3rem 1.5rem;
  background: transparent;
  border: 0;
  text-align: left;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
  font-family: var(--f-display);
  font-size: clamp(1rem, .92rem + .35vw, 1.15rem);
  font-weight: 600;
  color: var(--text);
  cursor: pointer;
  letter-spacing: -0.005em;
  line-height: 1.4;
}
.faq__q:hover { color: var(--moss); }
.faq__icon {
  position: relative;
  width: 26px; height: 26px;
  border-radius: 50%;
  background: var(--mint);
  flex-shrink: 0;
  transition: background .25s, transform .4s;
}
.faq__icon::before, .faq__icon::after {
  content: '';
  position: absolute;
  top: 50%; left: 50%;
  width: 11px; height: 2px;
  background: var(--moss);
  border-radius: 1px;
  transform: translate(-50%, -50%);
  transition: background .25s, transform .35s;
}
.faq__icon::after { transform: translate(-50%, -50%) rotate(90deg); }
.faq__item.is-open .faq__icon { background: var(--sage); transform: rotate(180deg); }
.faq__item.is-open .faq__icon::before,
.faq__item.is-open .faq__icon::after { background: var(--cream); }
.faq__item.is-open .faq__icon::after { transform: translate(-50%, -50%) rotate(0); }

.faq__a {
  max-height: 0;
  overflow: hidden;
  transition: max-height .5s var(--ease);
}
.faq__item.is-open .faq__a { max-height: 600px; }
.faq__a > div {
  padding: 0 1.5rem 1.4rem;
  font-size: .95rem;
  line-height: 1.65;
  color: var(--text-soft);
}
.faq__a p { margin: 0; }
.faq__a strong { color: var(--text); font-weight: 600; }

@media (max-width: 880px) {
  .faq__grid { grid-template-columns: 1fr; gap: 2rem; }
  .faq__head { position: static; }
}

/* ============================================================
   § 13 · CTA FINAL
   ============================================================ */
.cta-final {
  padding: clamp(5rem, 7vw, 8rem) 0;
  background: linear-gradient(135deg, var(--ink) 0%, var(--ink-2) 60%, var(--ink-3) 100%);
  color: var(--cream);
  position: relative;
  overflow: hidden;
}
.cta-final::before {
  content: '';
  position: absolute;
  top: -150px; right: -150px;
  width: 500px; height: 500px;
  background: radial-gradient(circle, rgba(43,89,176,.30), transparent 65%);
  pointer-events: none;
}
.cta-final__inner {
  display: grid;
  grid-template-columns: 1.4fr 1fr;
  gap: 4rem;
  align-items: center;
  position: relative;
  z-index: 1;
}
.cta-final .eyebrow { color: var(--sage-3); }
.cta-final h2 {
  color: var(--cream);
  font-size: clamp(2rem, 1.4rem + 2vw, 3rem);
  margin: 1rem 0;
}
.cta-final p { color: rgba(220,230,245,.7); max-width: 480px; }
.cta-final__actions { display: flex; flex-direction: column; gap: 1rem; }

@media (max-width: 880px) {
  .cta-final__inner { grid-template-columns: 1fr; gap: 2rem; }
}

/* ============================================================
   § 14 · FOOTER
   ============================================================ */
.footer {
  background: var(--ink-2);
  color: rgba(220,230,245,.7);
  padding: clamp(4rem, 6vw, 6rem) 0 2rem;
}
.footer__grid {
  display: grid;
  grid-template-columns: 1.4fr repeat(3, 1fr);
  gap: 3rem;
  padding-bottom: 3rem;
  border-bottom: 1px solid rgba(220,230,245,.10);
}
.footer .brand__name { color: var(--cream); }
.footer .brand__role { color: rgba(220,230,245,.6); }
.footer__brand p {
  margin-top: 1rem;
  font-size: .88rem;
  line-height: 1.6;
  max-width: 320px;
}
.socials { display: flex; gap: .8rem; margin-top: 1.2rem; }
.socials a {
  width: 48px; height: 48px;
  font-size: 1.25rem;
  border-radius: 50%;
  display: grid; place-items: center;
  background: rgba(220,230,245,.06);
  color: var(--cream);
  transition: all .3s;
}
.socials a:hover { background: var(--sage); color: var(--cream); transform: translateY(-3px); }

.footer h4 {
  font-family: var(--f-label);
  font-size: 1.05rem;
  font-weight: 400;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--sage-3);
  margin-bottom: 1.2rem;
}
.footer ul {
  list-style: none;
  padding: 0; margin: 0;
  display: flex;
  flex-direction: column;
  gap: .65rem;
}
.footer ul a { font-size: .9rem; color: rgba(220,230,245,.7); transition: color .25s; }
.footer ul a:hover { color: var(--sage-3); }
.footer ul i { color: var(--sage-3); margin-right: .5rem; font-size: .85rem; }

.footer__bottom {
  padding-top: 2rem;
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 1rem;
  font-size: .8rem;
  color: rgba(220,230,245,.45);
}

@media (max-width: 720px) {
  .footer { padding: 2rem 0 1.2rem; }
  .footer__grid {
    grid-template-columns: 1fr 1fr;
    gap: 1.4rem;
    padding-bottom: 1.4rem;
  }
  .footer__brand {
    grid-column: 1 / -1;
    margin-bottom: 0;
  }
  /* Descripción brand oculta · solo nombre + socials */
  .footer__brand p { display: none; }
  /* Brand del footer · MÁS GRANDE (override mobile nav sizing) */
  .footer__brand .brand { gap: .9rem !important; }
  .footer__brand .brand__monogram {
    width: 60px !important; height: 60px !important;
    flex: 0 0 60px !important;
    font-size: 1.55rem !important;
    border-radius: 14px !important;
  }
  .footer__brand .brand__name {
    font-size: 1.5rem !important;
    color: var(--cream) !important;
  }
  .footer__brand .brand__role {
    font-size: .78rem !important;
    letter-spacing: .14em !important;
    margin-top: .3rem !important;
    color: rgba(220,230,245,.7) !important;
  }
  .footer h4 { font-size: .85rem; margin-bottom: .65rem; letter-spacing: .16em; }
  .footer ul { gap: .4rem; }
  .footer ul a, .footer ul li { font-size: .8rem; }
  /* Solo mostrar 3 items por lista (no 5) */
  .footer ul li:nth-child(n+4) { display: none; }
  .socials { gap: .7rem; margin-top: 1rem; justify-content: flex-start; }
  .socials a { width: 52px; height: 52px; font-size: 1.4rem; }
  .footer__bottom {
    flex-direction: column;
    align-items: flex-start;
    padding-top: 1rem;
    font-size: .7rem;
    gap: .25rem;
  }
  /* Solo copyright, no la segunda línea legal */
  .footer__bottom span:last-child { display: none; }
}

/* ============================================================
   WHATSAPP FLOAT
   ============================================================ */
.wa-float {
  position: fixed;
  bottom: 1.5rem; right: 1.5rem;
  width: 60px; height: 60px;
  border-radius: 50%;
  background: linear-gradient(135deg, #25D366, #128C7E);
  color: var(--paper);
  display: grid; place-items: center;
  font-size: 1.6rem;
  box-shadow: 0 12px 30px rgba(37,211,102,.45);
  z-index: 90;
  transition: transform .35s var(--ease-spring);
}
.wa-float:hover { transform: scale(1.1); }
.wa-float__pulse {
  position: absolute;
  inset: 0;
  border-radius: 50%;
  background: #25D366;
  animation: wapulse 2.2s ease-out infinite;
  z-index: -1;
}
@keyframes wapulse {
  0%   { transform: scale(1); opacity: .6; }
  100% { transform: scale(1.7); opacity: 0; }
}

/* (deploy test removed · production ready) */

/* ============================================================
   MOBILE OVERFLOW · BLOQUEO EXTREMO con !important
   ============================================================ */
html, body {
  overflow-x: hidden !important;
  width: 100% !important;
  max-width: 100% !important;
  position: relative !important;
  margin: 0 !important;
}
* { max-width: 100% !important; box-sizing: border-box !important; }
img, video, iframe { max-width: 100% !important; height: auto; }

.hero, .hero__photo, .hero__content,
.anaquel, .anaquel__core,
.timeline, .calc, .bio, .testimonios, .faq, .cta-final,
.footer, .features, .metrics, .strip {
  max-width: 100% !important;
  overflow-x: clip !important;
  overflow-x: hidden;
}
/* anaquel__shell DEBE permitir max-width 1184px (regla del top) — removido del reset */
.anaquel__shell {
  max-width: 1184px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  overflow-x: clip !important;
  overflow-x: hidden;
}
/* Nav menu reducido a 80% (1184px) — contenido nav centrado */
.nav__inner {
  max-width: 1184px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* Watermark RESULTADOS · oculto en mobile (causa overflow) */
.watermark { max-width: 100vw; white-space: nowrap; overflow: hidden; }
@media (max-width: 900px) {
  .watermark { display: none !important; }
}

/* Marquee · estricto overflow hidden */
.marquee, .strip, .metrics, .hero { overflow: hidden !important; }

@media (max-width: 600px) {
  /* Padding lateral generoso en todas las secciones */
  .container {
    padding-inline: 2rem;
  }
  /* EXCEPCIÓN: las cards de los anaqueles necesitan más espacio interior, no agregar padding extra al container */
  .anaquel > .container,
  .anaqueles > .container {
    padding-inline: 1rem !important;
  }
  .hero__photo-caption {
    padding: 1.1rem 1.2rem;
  }
  .hero__photo-eyebrow {
    font-size: .72rem;
    letter-spacing: .14em;
    padding: .4rem .7rem;
    margin-bottom: .35rem;
  }
  .hero__photo-caption strong { font-size: 1.2rem; }
  .hero__photo-role { font-size: .78rem; }

  /* Hero content mobile · letras grandes + bordes laterales generosos */
  .hero__content {
    padding: 2rem 1.5rem 2.5rem;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    overflow-x: hidden;
  }
  .hero__copy {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
  }
  .hero__title {
    max-width: 100% !important;
    font-size: clamp(28px, 7.5vw, 42px);
    line-height: 1.1;
    overflow-wrap: anywhere;
    word-break: break-word;
    hyphens: auto;
  }
  .hero__sub {
    max-width: 100% !important;
    font-size: 1.02rem;
    line-height: 1.55;
    overflow-wrap: anywhere;
    word-break: break-word;
    hyphens: auto;
  }
  .hero__sub strong { word-break: break-word; }
  .hero__cta { gap: .7rem; flex-wrap: wrap; }
  .hero__cta .btn { padding: .9rem 1.2rem; font-size: .95rem; }
  .hero__trust {
    max-width: 100% !important;
    width: 100% !important;
    gap: .6rem 1rem;
  }
  .hero__trust li {
    font-size: .82rem;
    overflow-wrap: anywhere;
    word-break: break-word;
  }
  .hero__badges-wrap { max-width: 100% !important; width: 100% !important; padding-top: 1.6rem; }
  .hero__badges { gap: 2.5rem; }
  .hero__badges img { height: clamp(58px, 14vw, 78px); max-width: 160px; }

  /* Anaqueles mobile · anti-overflow estricto */
  .anaquel,
  .anaquel__shell,
  .anaquel__core,
  .anaquel__left,
  .anaquel__right,
  .anaquel__tabs { max-width: 100% !important; min-width: 0 !important; overflow: hidden !important; box-sizing: border-box !important; }
  .anaquel__shell { padding: .7rem; }
  .anaquel__core { padding: 1.4rem 1.1rem; }
  .anaquel__num { font-size: 2.8rem; }
  .anaquel__title { font-size: 1.55rem; word-break: break-word; }
  .anaquel__tags { max-width: 100%; }
  .anaquel__tag { font-size: .8rem !important; padding: .35rem .7rem !important; }
  .anaquel__tab { grid-template-columns: 52px 1fr auto; padding: .65rem; gap: .8rem; min-width: 0 !important; max-width: 100% !important; box-sizing: border-box !important; }
  .anaquel__tab-title, .anaquel__tab-sub { min-width: 0 !important; overflow: hidden; text-overflow: ellipsis; }
  .anaquel__tab-thumb { width: 52px; height: 52px; }
  .anaquel__tab-title { font-size: 1rem; }
  .anaquel__tab-sub { font-size: .78rem; }
  .anaquel__tab .pill { display: none; }
  .anaquel__tab-arrow { display: none; }
  .anaquel__statCell strong { font-size: 1.4rem; }
  .anaquel__statCell span { font-size: .65rem; }
  .apan { padding: .9rem; }
  .apan__body { padding: 1.1rem .2rem .2rem; }
  .apan__body h4 { font-size: 1.3rem; }
  .apan__stat strong { font-size: 1.2rem; }

  /* Calc mobile */
  .calc__panel { padding: 1.25rem; }
  .field__input input { font-size: 1.2rem; }
  .field label strong { font-size: 1rem; }
  .field__range-meta { font-size: .7rem; }
  .calc__row--hero strong { font-size: 1.4rem; }

  /* Bio mobile */
  .bio__photo figcaption {
    padding: 1.1rem 1.2rem;
    font-size: .72rem;
    letter-spacing: .12em;
  }

  /* FAQ mobile */
  .faq__q { padding: 1rem 1.1rem; font-size: 1rem; }
  .faq__a > div { padding: 0 1.1rem 1.1rem; font-size: .92rem; }

  /* Timeline mobile más compacto */
  .timeline__step { padding: 1rem 1.1rem; }
  .timeline__body h3 { font-size: 1.05rem; }
  .timeline__body p { font-size: .82rem; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .01ms !important;
    transition-duration: .01ms !important;
  }
}