:root{
  --papel:#fbfaf6;
  --papel-2:#f1eee7;
  --tinta:#10213f;
  --azul:#1f63e9;
  --azul-2:#0e4dc8;
  --gris:#5f6978;
  --linea:#cdd7e9;
  --blanco:#fff;
  --contenedor:1260px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--papel);color:var(--tinta);font-family:"DM Sans","Segoe UI",sans-serif;line-height:1.55}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}
button:focus-visible,a:focus-visible{outline:3px solid var(--azul);outline-offset:4px}
.skip-link{position:fixed;left:1rem;top:1rem;z-index:9999;padding:.8rem 1rem;background:#fff;transform:translateY(-180%)}.skip-link:focus{transform:none}
.contenedor{width:min(var(--contenedor),calc(100% - 40px));margin-inline:auto}
.kicker{margin:0 0 1.1rem;color:var(--azul);font-family:"IBM Plex Mono",monospace;font-size:.72rem;letter-spacing:.12em}
h1,h2,h3{margin:0;font-family:"Fraunces",Georgia,serif;font-weight:600;line-height:1.02;letter-spacing:-.035em}
h1{font-size:clamp(3.7rem,5.9vw,6.3rem)}
h2{font-size:clamp(2.7rem,4.6vw,4.7rem)}
h3{font-size:clamp(2rem,3vw,3rem)}
p{margin-top:0}

.site-header{position:sticky;top:0;z-index:500;border-bottom:1px solid rgba(16,33,63,.12);background:rgba(251,250,246,.94);backdrop-filter:blur(14px)}
.header-inner{display:flex;min-height:74px;align-items:center;gap:2rem;padding-right:165px}
.marca img{width:145px}
.menu-principal{display:flex;gap:1.7rem;margin-left:auto;font-size:.9rem;font-weight:600}
.header-link{display:flex;gap:.6rem;align-items:center;padding:.6rem 0;border-bottom:1px solid var(--azul);color:var(--azul);font-weight:700}
.menu-toggle{display:none;width:44px;height:44px;margin-left:auto;border:0;background:transparent}.menu-toggle span{display:block;width:24px;height:2px;margin:5px auto;background:var(--tinta)}

.hero{padding:clamp(4rem,7vw,6.5rem) 0 clamp(5rem,8vw,7rem)}
.hero-layout{display:grid;grid-template-columns:minmax(0,.9fr) minmax(600px,1.1fr);gap:clamp(2.5rem,5vw,5.5rem);align-items:start}
.hero-copy{padding-top:1rem}
.hero-copy h1{max-width:650px}
.hero-idea{max-width:640px;margin:1.7rem 0 .8rem;font-family:"Fraunces",Georgia,serif;font-size:clamp(1.45rem,2vw,2rem);line-height:1.25;color:var(--azul)}
.hero-text{max-width:640px;color:var(--gris);font-size:1.07rem}
.acciones{display:grid;grid-template-columns:1fr 1fr;gap:1px;margin-top:1.8rem;background:rgba(16,33,63,.15);border:1px solid rgba(16,33,63,.15)}
.accion{display:grid;gap:.28rem;min-height:145px;padding:1.2rem 1.3rem;background:var(--papel);transition:.2s}
.accion span{color:var(--azul);font-family:"IBM Plex Mono",monospace;font-size:.7rem}
.accion strong{font-size:1.03rem}
.accion small{color:var(--gris);font-size:.82rem;line-height:1.35}
.accion:hover{background:#fff}
.accion-principal{background:var(--azul);color:#fff}
.accion-principal span,.accion-principal small{color:#fff}
.enlace-secundario{display:inline-block;margin-top:1rem;color:var(--azul);font-weight:700}

.mapa-card{overflow:hidden;border:1px solid rgba(16,33,63,.18);background:#fff}
.mapa-cabecera{display:grid;grid-template-columns:1fr .85fr;gap:2rem;padding:1.4rem 1.5rem;border-bottom:1px solid rgba(16,33,63,.14)}
.mapa-cabecera span{color:var(--azul);font-family:"IBM Plex Mono",monospace;font-size:.68rem}
.mapa-cabecera h2{margin-top:.25rem;font-size:clamp(1.8rem,2.7vw,2.8rem)}
.mapa-cabecera p{margin:0;color:var(--gris);font-size:.86rem;align-self:end}
.mapa{position:relative;min-height:570px;background:linear-gradient(145deg,#fff 0%,#f7faff 100%)}
.mapa-svg{position:absolute;inset:0;width:100%;height:100%}
.topo{fill:none;stroke:#cbd8ef;stroke-width:1.2;opacity:.55}
.ruta-base,.ruta-activa{fill:none;stroke-linecap:round;stroke-width:4}
.ruta-base{stroke:#cdd7e9}
.ruta-activa{stroke:var(--azul);stroke-dasharray:1180;stroke-dashoffset:1180;animation:dibujar 2.6s .35s cubic-bezier(.22,1,.36,1) forwards;filter:url(#softGlow)}
.punto circle:first-child{fill:#fff;stroke:var(--azul);stroke-width:2}
.punto .centro{fill:var(--azul)}
.estacion{position:absolute;max-width:185px;padding:.15rem .25rem;background:rgba(255,255,255,.76);backdrop-filter:blur(5px)}
.estacion span{display:block;color:var(--azul);font-family:"IBM Plex Mono",monospace;font-size:.68rem}
.estacion strong{display:block;margin:.22rem 0;font-family:"Fraunces",Georgia,serif;font-size:1.08rem;line-height:1.05}
.estacion p{margin:0;color:var(--gris);font-size:.74rem;line-height:1.35}
.e0{left:2.5%;bottom:3%}
.e1{left:22%;bottom:20%}
.e2{left:42%;top:43%}
.e3{right:13%;top:24%}
.e4{right:1.5%;top:2.5%}
.mapa-cierre{margin:0;padding:1rem 1.5rem;border-top:1px solid rgba(16,33,63,.14);color:var(--gris);font-size:.82rem}
@keyframes dibujar{to{stroke-dashoffset:0}}

.evidencia{padding:clamp(5rem,8vw,7rem) 0;background:var(--papel-2);border-top:1px solid rgba(16,33,63,.12);border-bottom:1px solid rgba(16,33,63,.12)}
.evidencia-layout{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:rgba(16,33,63,.14);border:1px solid rgba(16,33,63,.14)}
.evidencia-layout>*{padding:clamp(2rem,4vw,3.3rem);background:var(--papel-2)}
.evidencia-copy h2{font-size:clamp(2.8rem,4.2vw,4.4rem)}
.evidencia-copy>p:last-child{max-width:620px;margin-top:1.5rem;color:var(--gris);font-size:1.05rem}
.caso-principal{background:#fff}
.caso-titulo{display:flex;justify-content:space-between;gap:2rem;padding-bottom:1rem;border-bottom:1px solid rgba(16,33,63,.15)}
.caso-titulo span,.caso-secundario>span{color:var(--azul);font-family:"IBM Plex Mono",monospace;font-size:.68rem}
.caso-titulo strong{font-family:"Fraunces",Georgia,serif;font-size:1.25rem}
.metricas{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;margin-top:1.5rem;background:rgba(16,33,63,.14)}
.metricas>div{padding:1.35rem;background:#fff}
.metricas strong{display:block;color:var(--azul);font-size:clamp(1.8rem,3vw,3.1rem);letter-spacing:-.05em}
.metricas span{display:block;margin-top:.4rem;color:var(--gris);font-size:.78rem}
.nota{margin:1.3rem 0 0;color:var(--gris);font-size:.82rem}
.resuelve h3{margin-bottom:1.5rem}
.resuelve-lista{display:grid}
.resuelve-lista>div{display:grid;grid-template-columns:42px 1fr;gap:1rem;padding:1rem 0;border-top:1px solid rgba(16,33,63,.14)}
.resuelve-lista span{color:var(--azul);font-family:"IBM Plex Mono",monospace;font-size:.68rem}
.resuelve-cierre{margin:1.5rem 0 0;color:var(--gris)}
.caso-secundario{display:flex;flex-direction:column;justify-content:center}
.caso-secundario>strong{margin:.5rem 0 1rem;font-family:"Fraunces",Georgia,serif;font-size:2rem}
.caso-secundario p{color:var(--gris)}

.siguiente{padding:clamp(5rem,8vw,7rem) 0}
.siguiente-layout{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(3rem,6vw,6rem);align-items:start}
.siguiente-copy p:last-child{max-width:630px;margin-top:1.5rem;color:var(--gris);font-size:1.05rem}
.opciones{display:grid;border-top:1px solid rgba(16,33,63,.18)}
.opciones a{display:grid;grid-template-columns:44px 1fr;gap:.3rem 1rem;padding:1.4rem 0;border-bottom:1px solid rgba(16,33,63,.18)}
.opciones span{grid-row:1/3;color:var(--azul);font-family:"IBM Plex Mono",monospace;font-size:.7rem}
.opciones strong{font-family:"Fraunces",Georgia,serif;font-size:1.45rem}
.opciones small{color:var(--gris);font-size:.86rem}
.opciones a:hover strong{color:var(--azul)}
.orientacion{grid-column:1/-1;display:grid;grid-template-columns:.7fr 1.4fr auto;gap:2rem;align-items:center;margin-top:1rem;padding:1.2rem 0;border-top:1px solid rgba(16,33,63,.18);border-bottom:1px solid rgba(16,33,63,.18)}
.orientacion p{margin:0}.orientacion a{color:var(--azul);font-weight:700}

.site-footer{padding:2rem 0;background:var(--tinta);color:#fff}
.footer-inner{display:flex;align-items:center;gap:2rem}
.footer-inner img{width:135px}
.footer-inner p{margin:0;color:rgba(255,255,255,.68)}
.footer-inner a{margin-left:auto}

.revision-sin-conexion{margin-top:1rem!important;padding:.8rem;border:1px solid var(--review-border);background:rgba(255,255,255,.55);font-size:.82rem;font-weight:700}
.btn-enviar-feedback:disabled{opacity:.55;cursor:not-allowed}

@media(max-width:1100px){
  .header-inner{padding-right:165px}
  .menu-principal,.header-link{display:none}
  .menu-toggle{display:block}
  .menu-principal.abierto{position:absolute;top:74px;right:0;left:0;display:flex;flex-direction:column;gap:0;padding:1rem 20px 1.5rem;background:var(--papel);border-bottom:1px solid rgba(16,33,63,.15)}
  .menu-principal.abierto a{padding:.8rem 0;border-bottom:1px solid rgba(16,33,63,.1)}
  .hero-layout{grid-template-columns:1fr}
  .mapa-card{margin-top:1rem}
  .evidencia-layout,.siguiente-layout{grid-template-columns:1fr}
  .orientacion{grid-template-columns:1fr}
}
@media(max-width:720px){
  .contenedor{width:min(100% - 28px,var(--contenedor))}
  .header-inner{min-height:68px;padding-right:145px}
  .marca img{width:124px}
  h1{font-size:clamp(3.1rem,13vw,4.6rem)}
  h2{font-size:clamp(2.5rem,11vw,3.8rem)}
  .acciones{grid-template-columns:1fr}
  .accion{min-height:118px}
  .mapa-cabecera{grid-template-columns:1fr}
  .mapa{min-height:auto;padding:1.25rem 1rem}
  .mapa-svg{display:none}
  .estacion{position:relative;left:auto!important;right:auto!important;top:auto!important;bottom:auto!important;max-width:none;margin-left:42px;padding:1rem 0 1.4rem}
  .estacion::before{content:"";position:absolute;left:-31px;top:1.2rem;width:16px;height:16px;border:2px solid var(--azul);border-radius:50%;background:#fff}
  .estacion::after{content:"";position:absolute;left:-23px;top:2.3rem;width:2px;height:calc(100% - .3rem);background:var(--azul)}
  .estacion:last-child::after{display:none}
  .metricas{grid-template-columns:1fr}
  .caso-titulo{flex-direction:column}
  .footer-inner{flex-direction:column;align-items:flex-start}
  .footer-inner a{margin-left:0}
}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .ruta-activa{animation:none;stroke-dashoffset:0}
  *{transition-duration:.01ms!important;animation-duration:.01ms!important}
}


/* =========================================================
   V3.1 — COMPACTACIÓN Y PROFUNDIDAD VISUAL
   Base conservada: mapa completo de v3
   ========================================================= */

:root {
  --papel: #f8f4ec;
  --papel-2: #ebe4d8;
  --tinta: #10213f;
  --azul: #1f63e9;
  --azul-2: #1249b7;
  --gris: #566276;
  --linea: #b9c5d8;
  --acento: #d98a3a;
  --sombra-papel: 0 18px 45px rgba(16, 33, 63, 0.10);
}

body {
  background:
    radial-gradient(circle at 15% 5%, rgba(217, 138, 58, 0.05), transparent 22rem),
    var(--papel);
}

body::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 1000;
  opacity: 0.08;
  background-image:
    repeating-linear-gradient(
      0deg,
      rgba(16, 33, 63, 0.14) 0,
      rgba(16, 33, 63, 0.14) 1px,
      transparent 1px,
      transparent 4px
    );
  mix-blend-mode: multiply;
}

.site-header {
  background: rgba(248, 244, 236, 0.96);
}

.hero,
.evidencia,
.siguiente {
  position: relative;
  overflow: hidden;
}

.marca-papel {
  position: absolute;
  pointer-events: none;
  border: 1px solid rgba(16, 33, 63, 0.12);
  background: rgba(255, 255, 255, 0.26);
  box-shadow: var(--sombra-papel);
  transform: rotate(-2deg);
}

.marca-papel-uno {
  width: 280px;
  height: 110px;
  right: -70px;
  top: 120px;
}

.marca-papel-dos {
  width: 240px;
  height: 86px;
  left: -90px;
  top: 120px;
  transform: rotate(3deg);
}

.marca-papel-tres {
  width: 260px;
  height: 90px;
  right: -90px;
  bottom: 70px;
  transform: rotate(-4deg);
}

@media (min-width: 1101px) {
  .hero {
    min-height: calc(100vh - 74px);
    padding: 2.2rem 0 2.6rem;
  }

  .hero-layout {
    min-height: calc(100vh - 126px);
    grid-template-columns: minmax(0, 0.9fr) minmax(560px, 1.1fr);
    align-items: center;
    gap: 2.25rem 3.5rem;
  }

  .hero-copy {
    padding-top: 0;
  }

  .hero-copy h1 {
    max-width: 650px;
    font-size: clamp(3.25rem, 4.65vw, 5.1rem);
    line-height: 0.98;
  }

  .hero-idea {
    margin-top: 1.15rem;
    font-size: clamp(1.25rem, 1.65vw, 1.7rem);
  }

  .hero-text {
    font-size: 0.98rem;
    line-height: 1.5;
  }

  .acciones {
    margin-top: 1.2rem;
  }

  .accion {
    min-height: 118px;
    padding: 1rem 1.1rem;
  }

  .mapa-card {
    box-shadow: var(--sombra-papel);
    border-color: rgba(16, 33, 63, 0.20);
    background: rgba(255, 255, 255, 0.82);
  }

  .mapa {
    min-height: 490px;
  }

  .mapa-cabecera {
    padding: 1.05rem 1.2rem;
  }

  .mapa-cierre {
    padding: 0.8rem 1.2rem;
  }

  .evidencia {
    min-height: calc(100vh - 74px);
    padding: 2.4rem 0;
  }

  .evidencia-layout {
    min-height: calc(100vh - 150px);
    grid-template-columns: 0.95fr 1.05fr;
    gap: 0;
    border: 0;
    background: transparent;
  }

  .evidencia-layout > * {
    background: transparent;
    padding: 1.45rem 2.2rem;
  }

  .evidencia-copy {
    border-right: 1px solid rgba(16, 33, 63, 0.16);
    border-bottom: 1px solid rgba(16, 33, 63, 0.16);
  }

  .caso-principal {
    border-bottom: 1px solid rgba(16, 33, 63, 0.16);
    background: rgba(255, 255, 255, 0.62);
    box-shadow: var(--sombra-papel);
  }

  .resuelve {
    border-right: 1px solid rgba(16, 33, 63, 0.16);
  }

  .caso-secundario {
    padding-left: 2.8rem;
  }

  .evidencia-copy h2 {
    font-size: clamp(2.5rem, 3.45vw, 3.75rem);
  }

  .metricas strong {
    font-size: clamp(1.9rem, 2.5vw, 2.8rem);
  }

  .siguiente {
    min-height: calc(100vh - 74px);
    padding: 2.5rem 0 2rem;
  }

  .siguiente-layout {
    min-height: calc(100vh - 150px);
    align-content: center;
    gap: 1.8rem 4rem;
  }

  .siguiente-copy h2 {
    font-size: clamp(2.75rem, 4vw, 4.25rem);
  }

  .opciones a {
    padding: 1rem 0;
  }

  .orientacion {
    padding: 1rem 1.2rem;
    background: rgba(255, 255, 255, 0.60);
    box-shadow: var(--sombra-papel);
    border: 1px solid rgba(16, 33, 63, 0.16);
  }
}

@media (max-width: 720px) {
  body::before {
    opacity: 0.05;
  }

  .marca-papel {
    display: none;
  }

  .hero,
  .evidencia,
  .siguiente {
    padding-top: 2rem;
    padding-bottom: 2.5rem;
  }

  .mapa-card {
    box-shadow: 0 12px 30px rgba(16, 33, 63, 0.08);
  }

  .orientacion {
    padding: 1rem;
    background: rgba(255, 255, 255, 0.55);
    border: 1px solid rgba(16, 33, 63, 0.14);
  }
}


/* =========================================================
   V3.2 — COMPOSICIÓN FINAL DE PRUEBA
   ========================================================= */

.conexion-label {
  margin-bottom: .8rem;
  color: var(--azul);
  font-family: "IBM Plex Mono", monospace;
  font-size: .67rem;
  letter-spacing: .1em;
}

.micro-cta {
  display: block;
  margin-top: .65rem;
  color: inherit;
  font-family: "DM Sans", sans-serif;
  font-size: .77rem;
  font-style: normal;
  font-weight: 800;
}

.accion {
  position: relative;
  cursor: pointer;
  box-shadow: 0 10px 24px rgba(16, 33, 63, .06);
  transform: translateY(0);
  transition: transform .2s ease, box-shadow .2s ease, background .2s ease;
}

.accion::after {
  content: "";
  position: absolute;
  inset: 0;
  border: 2px solid transparent;
  pointer-events: none;
  transition: border-color .2s ease;
}

.accion:hover {
  background: inherit;
  transform: translateY(-3px);
  box-shadow: 0 18px 34px rgba(16, 33, 63, .12);
}

.accion:hover::after {
  border-color: rgba(31, 99, 233, .35);
}

.accion-principal:hover {
  background: var(--azul-2);
}

.inversion-titulo strong {
  font-family: "Fraunces", Georgia, serif;
  font-size: clamp(1.7rem, 2.5vw, 2.4rem);
  line-height: 1.05;
}

.inversion-cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  padding: .8rem 1rem;
  background: var(--azul);
  color: #fff !important;
  font-weight: 800;
}

.cta-final {
  grid-column: 1 / -1;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 2rem;
  margin-top: .5rem;
  padding: 1rem 0;
  border-top: 1px solid rgba(16, 33, 63, .16);
}

.cta-final p {
  margin: 0;
  font-family: "Fraunces", Georgia, serif;
  font-size: 1.2rem;
}

.cta-final a {
  color: var(--azul);
  font-weight: 800;
}

@media (min-width: 1101px) {
  .site-header {
    position: fixed;
    top: 0;
    right: 0;
    left: 0;
    transition: transform .28s ease;
  }

  body {
    padding-top: 74px;
  }

  body.header-oculto .site-header {
    transform: translateY(-100%);
  }

  .hero {
    min-height: calc(100vh - 74px);
    padding: 1.4rem 0 1.8rem;
  }

  .hero-layout {
    min-height: calc(100vh - 105px);
    grid-template-columns: minmax(0, .88fr) minmax(530px, 1.12fr);
    align-items: center;
    gap: 1.4rem 3rem;
  }

  .hero-copy h1 {
    font-size: clamp(3rem, 4.2vw, 4.45rem);
  }

  .hero-idea {
    margin-top: .85rem;
    font-size: clamp(1.12rem, 1.45vw, 1.45rem);
  }

  .hero-text {
    margin-bottom: 0;
    font-size: .94rem;
    line-height: 1.45;
  }

  .acciones {
    margin-top: 1rem;
  }

  .accion {
    min-height: 106px;
    padding: .9rem 1rem;
  }

  .enlace-secundario {
    margin-top: .7rem;
  }

  .mapa-card {
    align-self: center;
  }

  .mapa {
    min-height: 445px;
  }

  .mapa-cabecera {
    padding: .85rem 1rem;
  }

  .mapa-cabecera h2 {
    font-size: clamp(1.65rem, 2.2vw, 2.25rem);
  }

  .mapa-cierre {
    padding: .65rem 1rem;
  }

  .evidencia {
    min-height: calc(100vh - 74px);
    padding: 1.7rem 0;
  }

  .evidencia-layout {
    min-height: calc(100vh - 116px);
    grid-template-columns: .88fr 1.12fr;
    grid-template-rows: auto auto;
    align-content: center;
  }

  .evidencia-copy h2 {
    font-size: clamp(2.35rem, 3vw, 3.2rem);
  }

  .caso-principal {
    align-self: center;
  }

  .resuelve {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: .8fr 1.2fr;
    gap: 2rem;
    align-items: start;
    border-right: 0;
    border-top: 1px solid rgba(16, 33, 63, .16);
  }

  .resuelve h3,
  .resuelve .kicker,
  .resuelve-cierre {
    grid-column: 1;
  }

  .resuelve-lista {
    grid-column: 2;
    grid-row: 1 / span 3;
  }

  .siguiente {
    min-height: calc(100vh - 74px);
    padding: 1.8rem 0 1.4rem;
  }

  .siguiente-layout {
    min-height: calc(100vh - 120px);
    align-content: center;
    gap: 1.1rem 3.5rem;
  }

  .siguiente-copy h2 {
    font-size: clamp(2.5rem, 3.5vw, 3.75rem);
  }

  .opciones a {
    padding: .8rem 0;
  }

  .orientacion {
    margin-top: .35rem;
    grid-template-columns: .85fr 1.5fr auto;
  }
}

@media (max-width: 720px) {
  .cta-final {
    flex-direction: column;
    align-items: flex-start;
  }

  .inversion-cta {
    width: 100%;
  }
}


/* =========================================================
   V3.3 — PALETA PSICOLÓGICA + NAVEGACIÓN COMPACTA
   ========================================================= */

:root {
  --papel: #f2ebdd;
  --papel-2: #e7dfd2;
  --tinta: #17252c;
  --azul: #2764e7;
  --azul-2: #1c4fbe;
  --petroleo: #17645d;
  --petroleo-profundo: #123f3b;
  --petroleo-palido: #dbe9e5;
  --ambar: #d7823f;
  --gris: #5b655f;
  --linea: #b9c8c2;
  --blanco-evidencia: #fffdf8;
}

body {
  background:
    radial-gradient(circle at 14% 8%, rgba(215, 130, 63, .08), transparent 18rem),
    radial-gradient(circle at 88% 16%, rgba(23, 100, 93, .08), transparent 20rem),
    var(--papel);
  color: var(--tinta);
}

body::before {
  opacity: .045;
}

.site-header.compacta {
  position: fixed;
  top: 14px;
  left: 18px;
  right: 18px;
  width: auto;
  border: 0;
  background: transparent;
  backdrop-filter: none;
  z-index: 700;
  transform: none !important;
}

.compacta-inner {
  width: auto;
  min-height: 52px;
  padding: 0;
  display: flex;
  justify-content: space-between;
}

.marca {
  display: inline-flex;
  align-items: center;
  padding: .55rem .8rem;
  background: rgba(255, 253, 248, .90);
  border: 1px solid rgba(23, 37, 44, .14);
  box-shadow: 0 10px 28px rgba(23, 37, 44, .08);
}

.header-acciones {
  display: flex;
  align-items: center;
  gap: .65rem;
}

.menu-minimo,
.header-cta {
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: .7rem .95rem;
  border: 1px solid rgba(23, 37, 44, .18);
  background: rgba(255, 253, 248, .92);
  color: var(--tinta);
  font: 700 .83rem "DM Sans", sans-serif;
  cursor: pointer;
  box-shadow: 0 10px 28px rgba(23, 37, 44, .08);
}

.header-cta {
  background: var(--petroleo);
  color: #fff;
  border-color: var(--petroleo);
}

.menu-flotante {
  position: fixed;
  top: 68px;
  right: 18px;
  z-index: 710;
  width: 220px;
  display: none;
  flex-direction: column;
  background: var(--blanco-evidencia);
  border: 1px solid rgba(23, 37, 44, .16);
  box-shadow: 0 18px 40px rgba(23, 37, 44, .14);
}

.menu-flotante.abierto {
  display: flex;
}

.menu-flotante a {
  padding: .9rem 1rem;
  border-bottom: 1px solid rgba(23, 37, 44, .10);
  font-weight: 700;
}

.menu-flotante a:last-child {
  border-bottom: 0;
}

body {
  padding-top: 0 !important;
}

.hero {
  padding-top: 2rem;
}

.kicker,
.conexion-label,
.mapa-cabecera span,
.caso-titulo span,
.caso-secundario > span,
.opciones span,
.resuelve-lista span {
  color: var(--petroleo);
}

.hero-copy h1,
.evidencia-copy h2,
.siguiente-copy h2,
.caso-titulo strong,
.opciones strong,
.resuelve h3 {
  color: var(--tinta);
}

.hero-idea,
.enlace-secundario,
.inversion-cta,
.cta-final a {
  color: var(--petroleo);
}

.accion-principal {
  background: var(--petroleo);
}

.accion-principal:hover {
  background: var(--petroleo-profundo);
}

.accion:not(.accion-principal) {
  background: var(--blanco-evidencia);
}

.mapa-card {
  border: 0;
  box-shadow: 0 20px 48px rgba(23, 37, 44, .12);
  background:
    linear-gradient(180deg, rgba(255, 253, 248, .97), rgba(241, 247, 245, .95));
}

.mapa {
  background:
    radial-gradient(circle at 78% 18%, rgba(215, 130, 63, .10), transparent 17rem),
    linear-gradient(145deg, #fffdf8 0%, #edf5f2 100%);
}

.ruta-base {
  stroke: #a8bdb6;
}

.ruta-activa {
  stroke: var(--petroleo);
}

.punto circle:first-child {
  stroke: var(--petroleo);
}

.punto .centro {
  fill: var(--ambar);
}

.estacion span {
  color: var(--petroleo);
}

.estacion strong {
  color: var(--tinta);
}

.e0::before,
.e1::before,
.e2::before,
.e3::before,
.e4::before {
  content: "";
}

.evidencia {
  background:
    linear-gradient(180deg, rgba(255,253,248,.82), rgba(231,223,210,.92));
}

.caso-principal {
  background: var(--blanco-evidencia);
  border-left: 6px solid var(--petroleo);
}

.metricas strong {
  color: var(--petroleo);
}

.resuelve {
  background:
    linear-gradient(90deg, rgba(23,100,93,.06), transparent);
}

.siguiente {
  background:
    radial-gradient(circle at 85% 18%, rgba(39,100,231,.06), transparent 16rem),
    var(--papel);
}

.opciones a:hover strong {
  color: var(--petroleo);
}

.inversion-panel {
  background:
    linear-gradient(110deg, var(--petroleo-profundo), var(--petroleo));
  color: #fff;
  border: 0;
  box-shadow: 0 18px 42px rgba(23, 64, 59, .22);
  grid-template-columns: .9fr 1.2fr 1.4fr auto;
}

.inversion-precio span {
  display: block;
  color: rgba(255,255,255,.70);
  font-family: "IBM Plex Mono", monospace;
  font-size: .68rem;
  letter-spacing: .1em;
}

.inversion-precio strong {
  display: block;
  margin-top: .35rem;
  color: #fff;
  font-family: "Fraunces", Georgia, serif;
  font-size: clamp(1.8rem, 2.6vw, 2.5rem);
  line-height: 1;
}

.inversion-panel p {
  color: rgba(255,255,255,.86);
}

.inversion-panel .inversion-nota {
  font-size: .86rem;
}

.inversion-panel .inversion-cta {
  background: var(--ambar);
  color: var(--tinta) !important;
  box-shadow: none;
}

.flecha-conexion {
  position: absolute;
  right: -2.2rem;
  top: 48%;
  color: var(--ambar);
  font-size: 2rem;
  line-height: 1;
  font-weight: 800;
  transform: translateY(-50%);
  z-index: 4;
}

.hero-copy,
.evidencia-intro,
.siguiente-copy {
  position: relative;
}

@media (min-width: 1101px) {
  .hero,
  .evidencia,
  .siguiente {
    min-height: 100vh;
  }

  .hero-layout,
  .evidencia-layout,
  .siguiente-layout {
    min-height: calc(100vh - 56px);
  }

  .hero {
    padding-top: 1.25rem;
    padding-bottom: 1.25rem;
  }

  .hero-layout {
    align-content: center;
  }

  .evidencia {
    padding-top: 1.4rem;
    padding-bottom: 1.4rem;
  }

  .siguiente {
    padding-top: 1.4rem;
    padding-bottom: 1.4rem;
  }
}

@media (max-width: 900px) {
  .header-cta {
    display: none;
  }

  .site-header.compacta {
    top: 10px;
    left: 10px;
    right: 10px;
  }

  .flecha-conexion {
    display: none;
  }

  .inversion-panel {
    grid-template-columns: 1fr;
  }
}

/* =========================================================
   V3.4 — EVIDENCIA VISUAL + NAVEGACIÓN SIN OBSTRUCCIÓN
   ========================================================= */

.site-header.compacta {
  position: absolute;
  top: 14px;
  left: 18px;
  right: 18px;
}

.marca {
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
}

.marca img {
  width: 138px;
}

.menu-minimo,
.header-cta {
  box-shadow: 0 8px 22px rgba(23, 37, 44, 0.09);
}

.evidencia-visual-masaje {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 0.75rem;
  margin: 0.5rem 0 0;
}

.evidencia-visual-masaje a:first-child {
  display: block;
  overflow: hidden;
  background: #fffdf8;
  box-shadow: 0 20px 48px rgba(23, 37, 44, 0.14);
}

.evidencia-visual-masaje img {
  display: block;
  width: 100%;
  height: auto;
  transition: transform 0.35s ease;
}

.evidencia-visual-masaje a:first-child:hover img {
  transform: scale(1.012);
}

.evidencia-visual-masaje figcaption {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  color: var(--gris);
  font-size: 0.82rem;
}

.evidencia-visual-masaje figcaption a {
  color: var(--petroleo);
  font-weight: 800;
  white-space: nowrap;
}

@media (min-width: 1101px) {
  .evidencia-layout {
    grid-template-columns: 0.76fr 1.24fr;
  }

  .evidencia-visual-masaje {
    grid-column: 2;
    margin-top: -0.25rem;
  }

  .resuelve {
    grid-column: 1 / -1;
  }
}

@media (max-width: 720px) {
  .site-header.compacta {
    position: absolute;
    top: 10px;
    left: 10px;
    right: 10px;
  }

  .evidencia-visual-masaje figcaption {
    flex-direction: column;
  }
}

/* =========================================================
   V3.4 — PRIMERA PASADA MÓVIL
   No modifica la composición de escritorio.
   ========================================================= */

@media (max-width: 720px) {
  html,
  body {
    max-width: 100%;
    overflow-x: hidden;
  }

  body {
    background-image: none !important;
    background-color: #f4eddf !important;
  }

  .site-header.compacta {
    position: relative !important;
    inset: auto !important;
    top: auto !important;
    left: auto !important;
    right: auto !important;
    width: 100% !important;
    min-height: 72px;
    padding: 14px 18px 8px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 12px !important;
    background: transparent !important;
    box-shadow: none !important;
    z-index: 20;
  }

  .marca {
    flex: 1 1 auto;
    min-width: 0;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  .marca img {
    display: block;
    width: min(205px, 100%) !important;
    height: auto !important;
  }

  .header-cta {
    display: none !important;
  }

  .menu-minimo {
    position: relative !important;
    inset: auto !important;
    flex: 0 0 auto;
    min-width: auto !important;
    padding: 12px 16px !important;
    background: rgba(255, 253, 248, 0.96) !important;
    box-shadow: 0 8px 22px rgba(23, 37, 44, 0.1) !important;
  }

  main,
  section,
  article {
    max-width: 100%;
  }

  h1 {
    max-width: 11ch;
    font-size: clamp(3rem, 14vw, 4.15rem) !important;
    line-height: 0.97 !important;
    letter-spacing: -0.045em !important;
  }

  h2 {
    font-size: clamp(2.5rem, 11vw, 3.4rem) !important;
    line-height: 1.02 !important;
    letter-spacing: -0.035em !important;
  }

  h3 {
    line-height: 1.08 !important;
  }

  p {
    line-height: 1.55;
  }

  .hero,
  .capitulo,
  .seccion,
  .evidencia,
  .siguiente-paso {
    padding-left: 18px !important;
    padding-right: 18px !important;
  }

  .evidencia-layout,
  .ruta-layout,
  .opciones-layout,
  .planes-layout {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  .caso-principal,
  .resuelve,
  .ruta-contenido,
  .inversion {
    width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  .caso-principal {
    padding: 34px 28px !important;
  }

  .caso-principal h2,
  .resultados-intro h2 {
    max-width: 10ch;
  }

  .caso-principal > *,
  .resuelve > * {
    max-width: 100%;
  }

  .evidencia-visual-masaje {
    display: none !important;
  }

  .inversion {
    padding: 28px 22px !important;
  }

  .inversion h2,
  .inversion h3 {
    font-size: clamp(2rem, 9vw, 2.7rem) !important;
  }

  .inversion a,
  .cta-principal,
  .boton-principal {
    width: 100%;
    justify-content: center;
    text-align: center;
  }

  footer {
    padding-left: 20px !important;
    padding-right: 20px !important;
  }
}

/* =========================================================
   V3.4 — SEGUNDA PASADA MÓVIL
   Ajustes específicos sin afectar escritorio.
   ========================================================= */

@media (max-width: 720px) {
  body {
    background-color: #f8f3e9 !important;
  }

  .seccion {
    padding-top: 72px !important;
    padding-bottom: 72px !important;
  }

  .hero {
    min-height: auto !important;
    padding-top: 34px !important;
    padding-bottom: 62px !important;
  }

  .hero h1 {
    max-width: 9.7ch !important;
    margin-bottom: 22px !important;
  }

  .hero p {
    max-width: 33rem !important;
    font-size: 1.04rem !important;
  }

  .hero .acciones,
  .hero .hero-acciones {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 12px !important;
    width: 100% !important;
  }

  .accion,
  .accion-principal,
  .enlace-secundario {
    width: 100% !important;
    min-height: 52px !important;
    justify-content: center !important;
    text-align: center !important;
  }

  .estacion {
    padding: 22px 20px !important;
    margin-bottom: 14px !important;
  }

  .estacion h3 {
    font-size: 1.36rem !important;
  }

  .estacion p {
    margin-bottom: 0 !important;
  }

  .nota-estrategica {
    padding: 22px 20px !important;
    margin-top: 24px !important;
  }

  .evidencia {
    padding-top: 64px !important;
    padding-bottom: 64px !important;
  }

  .caso-principal {
    padding: 28px 22px !important;
    border-radius: 22px !important;
  }

  .caso-principal h2 {
    max-width: 9.5ch !important;
    margin-bottom: 18px !important;
  }

  .caso-principal .metricas,
  .caso-principal .resultados,
  .caso-principal ul {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 12px !important;
  }

  .caso-principal li,
  .caso-principal .metrica,
  .caso-principal .resultado {
    padding: 18px !important;
    min-height: auto !important;
  }

  .caso-enlace-real,
  .btn-ver-explicacion {
    width: 100% !important;
    justify-content: center !important;
    text-align: center !important;
  }

  .siguiente {
    padding-top: 64px !important;
    padding-bottom: 68px !important;
  }

  .siguiente h2 {
    max-width: 10ch !important;
  }

  .inversion {
    padding: 26px 20px !important;
    border-radius: 22px !important;
  }

  .inversion-cta {
    width: 100% !important;
    min-height: 54px !important;
    justify-content: center !important;
    text-align: center !important;
  }

  .toggle-modo,
  .btn-finalizar-revision,
  .panel-revision,
  .modal-feedback,
  [id*="Revision"],
  [class*="revision"] {
    display: none !important;
  }

  .site-footer {
    padding-top: 42px !important;
    padding-bottom: 42px !important;
  }
}

/* =========================================================
   COPY ARTUX V2
   Ajustes de lectura sin modificar la dirección visual.
   ========================================================= */

.hero-precio {
  max-width: 640px;
  margin: 1.15rem 0 0;
  padding-left: 1rem;
  border-left: 3px solid var(--ambar);
  color: var(--gris);
  font-size: .9rem;
  line-height: 1.45;
}

.hero-precio strong {
  display: block;
  margin-bottom: .2rem;
  color: var(--tinta);
  font-family: "Fraunces", Georgia, serif;
  font-size: 1.18rem;
}

.evidencia-copy > p {
  max-width: 620px;
  color: var(--gris);
  font-size: 1.02rem;
}

.evidencia-copy > p + p {
  margin-top: 1rem;
}

.nota-evidencia {
  margin-top: .65rem;
  color: var(--petroleo);
  font-weight: 700;
}

.caso-enlace-real {
  display: inline-flex;
  margin-top: 1.2rem;
  color: var(--petroleo);
  font-weight: 800;
}

.resuelve-lista strong {
  line-height: 1.3;
}

.resuelve-lista small {
  display: block;
  margin-top: .4rem;
  color: var(--gris);
  font-family: "DM Sans", sans-serif;
  font-size: .82rem;
  font-weight: 400;
  line-height: 1.48;
}

.siguiente-copy > p {
  max-width: 630px;
  color: var(--gris);
  font-size: 1.05rem;
}

.siguiente-copy > p + p {
  margin-top: .85rem;
}

@media (min-width: 1101px) {
  .hero-layout {
    align-items: start;
    padding-top: 4.3rem;
  }

  .hero-copy h1 {
    font-size: clamp(2.85rem, 3.85vw, 4.15rem);
  }

  .hero-text,
  .hero-precio {
    font-size: .9rem;
  }

  .accion {
    min-height: 122px;
  }

  .mapa-card {
    margin-top: 1rem;
  }

  .evidencia-layout {
    align-content: start;
    padding-top: 3.6rem;
    padding-bottom: 3rem;
  }

  .evidencia-copy h2 {
    font-size: clamp(2.2rem, 2.8vw, 3rem);
  }

  .resuelve {
    margin-top: .75rem;
  }
}

@media (max-width: 720px) {
  .hero-precio {
    margin-top: 1.3rem;
    font-size: .94rem;
  }

  .hero-precio strong {
    font-size: 1.3rem;
  }

  .accion {
    text-align: left !important;
    justify-content: initial !important;
  }

  .resuelve-lista > div {
    grid-template-columns: 32px 1fr;
  }

  .resuelve-lista small {
    font-size: .9rem;
  }

  .evidencia-copy > p,
  .siguiente-copy > p {
    font-size: 1rem;
  }
}

/* =========================================================
   AJUSTE DE TARJETAS DEL MAPA — COPY V2
   Evita cruces y recortes en computadora.
   ========================================================= */

@media (min-width: 1101px) {
  .mapa {
    min-height: 520px;
  }

  .estacion {
    max-width: 165px;
    padding: .45rem .55rem;
    background: rgba(255, 255, 255, .9);
    box-shadow: 0 8px 22px rgba(23, 37, 44, .08);
  }

  .estacion strong {
    font-size: 1rem;
    line-height: 1.02;
  }

  .estacion p {
    font-size: .7rem;
    line-height: 1.3;
  }

  .e0 {
    left: 2.5%;
    bottom: 2.5%;
  }

  .e1 {
    left: 23%;
    bottom: 22%;
  }

  .e2 {
    left: 44%;
    top: 40%;
  }

  .e3 {
    right: 13%;
    top: 20%;
  }

  .e4 {
    right: 1.5%;
    top: 2%;
  }
}

/* =========================================================
   CORRECCIÓN A1 + A3
   Elimina rectángulos decorativos que cubren contenido y CTA.
   ========================================================= */

.marca-papel,
.marca-papel-uno,
.marca-papel-dos,
.marca-papel-tres {
  display: none !important;
}

/* =========================================================
   CORRECCIÓN A2 — HEADER FIJO SIN ENCIMARSE
   ========================================================= */

.site-header.compacta {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  width: 100% !important;
  padding: 10px 18px !important;
  background: #f2ebdd !important;
  border-bottom: 1px solid rgba(23, 37, 44, .12) !important;
  box-shadow: none !important;
  z-index: 3000 !important;
  transition: box-shadow .2s ease !important;
}

body.header-con-sombra .site-header.compacta {
  box-shadow: 0 8px 24px rgba(23, 37, 44, .10) !important;
}

body {
  padding-top: 72px !important;
}

.menu-flotante {
  top: 72px !important;
  z-index: 3010 !important;
}

body.header-oculto .site-header {
  transform: none !important;
}

@media (max-width: 720px) {
  .site-header.compacta {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    min-height: 72px !important;
    padding: 12px 18px !important;
    background: #f2ebdd !important;
  }

  body {
    padding-top: 72px !important;
  }

  .menu-flotante {
    top: 72px !important;
    right: 10px !important;
  }
}

/* =========================================================
   BOTÓN FLOTANTE DE WHATSAPP
   ========================================================= */

.whatsapp-flotante {
  position: fixed;
  right: 24px;
  bottom: 24px;
  z-index: 2900;

  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;

  min-height: 56px;
  padding: 0 22px;

  color: #ffffff;
  background: #25D366;
  border-radius: 999px;
  box-shadow: 0 10px 28px rgba(0, 0, 0, .22);

  font: inherit;
  font-weight: 700;
  line-height: 1;
  text-decoration: none;

  transition:
    transform .18s ease,
    box-shadow .18s ease;
}

.whatsapp-flotante:hover {
  transform: translateY(-2px);
  box-shadow: 0 14px 32px rgba(0, 0, 0, .26);
}

.whatsapp-flotante:focus-visible {
  outline: 3px solid #ffffff;
  outline-offset: 3px;
}

.whatsapp-flotante__icono {
  width: 28px;
  height: 28px;
  flex: 0 0 auto;
}

.whatsapp-flotante__texto {
  display: inline-block;
}

body {
  padding-bottom: 104px;
}

@media (max-width: 767px) {
  .whatsapp-flotante {
    right: 16px;
    bottom: 16px;

    width: 56px;
    min-width: 56px;
    height: 56px;
    min-height: 56px;
    padding: 0;

    border-radius: 50%;
  }

  .whatsapp-flotante__texto {
    display: none;
  }

  body {
    padding-bottom: 88px;
  }
}

/* =========================================================
   AJUSTE TRAS EXTRAER EL TIMELINE
   Hero sin columna vacía + timeline adaptado a la pantalla
   ========================================================= */

@media (min-width: 901px) {

  /* El hero ya no reserva espacio para el mapa */
  .hero .hero-layout {
    grid-template-columns: minmax(0, 1fr) !important;
    align-items: start !important;
    min-height: auto !important;
  }

  .hero .hero-copy {
    width: 100% !important;
    max-width: 760px !important;
  }

  /* El hero ocupa la pantalla disponible, sin cortar sus botones */
  .hero {
    min-height: calc(100dvh - 72px) !important;
    padding-top: clamp(56px, 7vh, 86px) !important;
    padding-bottom: clamp(40px, 6vh, 72px) !important;
  }

  .hero .acciones {
    margin-top: 1rem !important;
  }

  /* Timeline como pantalla independiente */
  .timeline-seccion {
    min-height: calc(100dvh - 72px) !important;
    padding: 24px 0 30px !important;
    display: flex !important;
    align-items: center !important;
  }

  .timeline-seccion > .contenedor {
    width: min(100% - 48px, 1180px) !important;
    margin-inline: auto !important;
  }

  .timeline-seccion .mapa-card {
    width: 100% !important;
    margin: 0 auto !important;
  }

  /* Un poco más compacto para que entre a 100% de zoom */
  .timeline-seccion .mapa {
    min-height: 440px !important;
    height: 440px !important;
  }

  .timeline-seccion .mapa-cabecera {
    padding-top: 20px !important;
    padding-bottom: 14px !important;
  }

  .timeline-seccion .estacion {
    max-width: 155px !important;
    padding: .4rem .5rem !important;
  }

  .timeline-seccion .estacion strong {
    font-size: .95rem !important;
    line-height: 1.02 !important;
  }

  .timeline-seccion .estacion p {
    font-size: .67rem !important;
    line-height: 1.25 !important;
  }
}

/* En pantallas medianas no forzar altura rígida */
@media (min-width: 768px) and (max-width: 900px) {
  .hero .hero-layout {
    grid-template-columns: 1fr !important;
  }

  .timeline-seccion .mapa {
    min-height: 480px !important;
  }
}

/* =========================================================
   ARTUX COPY V3 · ESTRUCTURA Y MAQUETACIÓN
   ========================================================= */

.header-kicker {
  margin: 0 auto;
  padding-inline: 24px;
  font-family: "IBM Plex Mono", monospace;
  font-size: .68rem;
  letter-spacing: .11em;
  color: #116c65;
  text-align: center;
}

.v3-hero,
.v3-situaciones,
.v3-prueba,
.v3-quien,
.v3-precio,
.v3-cierre {
  scroll-margin-top: 72px;
}

.v3-hero {
  min-height: calc(100dvh - 72px);
  display: flex;
  align-items: center;
  padding: clamp(60px, 9vh, 110px) 0;
}

.v3-hero__contenido {
  max-width: 900px;
}

.v3-hero h1 {
  max-width: 850px;
  margin: 0;
  font-size: clamp(2.8rem, 6vw, 5.8rem);
  line-height: .94;
}

.v3-hero__subtitulo {
  max-width: 760px;
  margin: 28px 0 0;
  color: #006c63;
  font-family: "Fraunces", serif;
  font-size: clamp(1.35rem, 2.2vw, 2rem);
  font-weight: 600;
}

.v3-hero__texto {
  max-width: 730px;
  margin: 24px 0 0;
  font-size: clamp(1rem, 1.25vw, 1.15rem);
  line-height: 1.65;
}

.v3-precio-hero {
  max-width: 610px;
  margin-top: 30px;
  padding: 18px 20px;
  border-left: 3px solid #df7b2b;
}

.v3-precio-hero strong {
  font-family: "Fraunces", serif;
  font-size: 1.25rem;
}

.v3-precio-hero p {
  margin: 7px 0 0;
}

.v3-situaciones {
  min-height: calc(100dvh - 72px);
  display: flex;
  align-items: center;
  padding: 72px 0;
}

.v3-situaciones__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin-top: 28px;
  border-top: 1px solid rgba(20, 33, 43, .2);
  border-left: 1px solid rgba(20, 33, 43, .2);
}

.v3-situacion {
  min-height: 360px;
  display: flex;
  flex-direction: column;
  padding: 30px;
  border-right: 1px solid rgba(20, 33, 43, .2);
  border-bottom: 1px solid rgba(20, 33, 43, .2);
  background: rgba(255, 255, 255, .55);
}

.v3-situacion > span {
  font-family: "IBM Plex Mono", monospace;
  color: #006c63;
}

.v3-situacion h2 {
  margin: 30px 0 14px;
  font-size: clamp(1.55rem, 2vw, 2.2rem);
}

.v3-situacion p {
  line-height: 1.6;
}

.v3-situacion a {
  margin-top: auto;
  padding-top: 28px;
  font-weight: 700;
}

.v3-prueba {
  padding: 90px 0;
}

.v3-prueba__layout {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(300px, .9fr);
  gap: 54px;
  align-items: start;
  margin-top: 20px;
}

.v3-prueba__texto h2,
.v3-quien h2,
.v3-dudas > .contenedor > h2,
.v3-precio h2,
.v3-cierre h2 {
  font-size: clamp(2.4rem, 4.8vw, 4.8rem);
  line-height: .98;
}

.v3-prueba__texto p,
.v3-quien__texto p,
.v3-precio__texto p,
.v3-cierre__contenido > p {
  font-size: 1.05rem;
  line-height: 1.7;
}

.todo-visible {
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-height: 220px;
  padding: 28px;
  border: 2px dashed #df7b2b;
  background: rgba(255, 247, 214, .72);
}

.todo-visible strong,
.todo-inline {
  font-family: "IBM Plex Mono", monospace;
  color: #9b4c12;
}

.v3-metricas {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  margin-top: 60px;
  border-top: 1px solid rgba(20, 33, 43, .25);
  border-left: 1px solid rgba(20, 33, 43, .25);
}

.v3-metricas > div {
  padding: 30px;
  border-right: 1px solid rgba(20, 33, 43, .25);
  border-bottom: 1px solid rgba(20, 33, 43, .25);
}

.v3-metricas strong {
  display: block;
  font-family: "Fraunces", serif;
  font-size: clamp(2.4rem, 5vw, 5rem);
}

.v3-metricas span {
  display: block;
  max-width: 230px;
  margin-top: 10px;
}

.v3-fecha {
  margin-top: 18px;
  font-family: "IBM Plex Mono", monospace;
  font-size: .78rem;
}

.v3-nota {
  max-width: 760px;
  margin-top: 40px;
  font-size: 1.05rem;
  line-height: 1.6;
}

.v3-cita {
  max-width: 850px;
  margin: 44px 0 24px;
  padding: 28px;
  border-left: 3px solid #df7b2b;
  background: rgba(255,255,255,.55);
}

.v3-cita p {
  margin: 0;
  font-family: "Fraunces", serif;
  font-size: clamp(1.35rem, 2vw, 1.9rem);
}

.v3-cita cite,
.v3-cita .todo-inline {
  display: block;
  margin-top: 14px;
}

.v3-enlace {
  display: inline-block;
  margin-top: 18px;
  font-weight: 700;
}

.v3-quien {
  padding: 90px 0;
}

.v3-quien__layout {
  display: grid;
  grid-template-columns: minmax(280px, .8fr) minmax(0, 1.2fr);
  gap: 60px;
  align-items: center;
}

.v3-quien__foto {
  min-height: 520px;
}

.v3-dudas {
  padding: 90px 0;
}

.v3-dudas__lista {
  margin-top: 44px;
  border-top: 1px solid rgba(20, 33, 43, .25);
}

.v3-dudas__lista article {
  display: grid;
  grid-template-columns: 50px minmax(260px, .8fr) minmax(0, 1.2fr);
  gap: 30px;
  padding: 30px 0;
  border-bottom: 1px solid rgba(20, 33, 43, .25);
}

.v3-dudas__lista article > span {
  font-family: "IBM Plex Mono", monospace;
  color: #006c63;
}

.v3-dudas__lista h3,
.v3-dudas__lista p {
  margin: 0;
}

.v3-dudas__lista h3 {
  font-family: "Fraunces", serif;
  font-size: 1.45rem;
}

.v3-dudas__lista p {
  line-height: 1.65;
}

.v3-dudas__lista .todo-visible {
  min-height: 0;
}

.v3-precio {
  min-height: calc(100dvh - 72px);
  display: flex;
  align-items: center;
  padding: 80px 0;
  background: #116c65;
  color: #fff;
}

.v3-precio__layout {
  display: grid;
  grid-template-columns: .8fr 1.2fr;
  gap: 70px;
  align-items: start;
}

.v3-precio .kicker {
  color: #fff;
}

.v3-precio__texto .todo-visible {
  color: #14212b;
}

.v3-timeline {
  scroll-margin-top: 72px;
}

.v3-cierre {
  min-height: calc(100dvh - 72px);
  display: flex;
  align-items: center;
  padding: 80px 0;
}

.v3-cierre__contenido {
  max-width: 900px;
}

.v3-cierre__contenido > a {
  display: inline-block;
  margin-top: 28px;
  padding: 18px 24px;
  background: #df7b2b;
  color: #14212b;
  font-weight: 700;
  text-decoration: none;
}

.v3-cierre__correo {
  margin-top: 22px;
}

.v3-footer__contenido {
  display: grid;
  gap: 12px;
}

.v3-footer__contenido p {
  margin: 0;
}

@media (max-width: 900px) {
  .header-kicker {
    display: none;
  }

  .v3-situaciones__grid,
  .v3-prueba__layout,
  .v3-metricas,
  .v3-quien__layout,
  .v3-precio__layout {
    grid-template-columns: 1fr;
  }

  .v3-situacion {
    min-height: 290px;
  }

  .v3-quien__foto {
    min-height: 360px;
  }

  .v3-dudas__lista article {
    grid-template-columns: 42px 1fr;
  }

  .v3-dudas__lista article p {
    grid-column: 2;
  }
}

@media (max-width: 767px) {
  .v3-hero,
  .v3-situaciones,
  .v3-precio,
  .v3-cierre {
    min-height: auto;
  }

  .v3-hero {
    padding: 70px 0 56px;
  }

  .v3-hero h1 {
    font-size: clamp(2.5rem, 12vw, 4rem);
  }

  .v3-situaciones,
  .v3-prueba,
  .v3-quien,
  .v3-dudas,
  .v3-precio,
  .v3-cierre {
    padding: 64px 0;
  }

  .v3-situaciones__grid {
    display: block;
    border-top: 0;
    border-left: 0;
  }

  .v3-situacion {
    min-height: 0;
    border-left: 1px solid rgba(20, 33, 43, .2);
  }

  .v3-prueba__texto h2,
  .v3-quien h2,
  .v3-dudas > .contenedor > h2,
  .v3-precio h2,
  .v3-cierre h2 {
    font-size: clamp(2.2rem, 10vw, 3.5rem);
  }

  .v3-metricas {
    display: block;
    border-top: 0;
    border-left: 0;
  }

  .v3-metricas > div {
    border-left: 1px solid rgba(20, 33, 43, .25);
  }

  .v3-dudas__lista article {
    display: block;
  }

  .v3-dudas__lista article > span,
  .v3-dudas__lista h3,
  .v3-dudas__lista p {
    display: block;
    margin-bottom: 12px;
  }
}

/* =========================================================
   HEADER COMPACTO + HERO COMPLETO EN ESCRITORIO
   ========================================================= */

@media (min-width: 901px) {
  .site-header.compacta {
    min-height: 56px !important;
    height: 56px !important;
    padding: 6px 20px !important;
  }

  .site-header .header-inner {
    min-height: 44px !important;
    height: 44px !important;
    display: grid !important;
    grid-template-columns: auto 1fr !important;
    align-items: center !important;
  }

  .site-header .marca img {
    max-height: 34px !important;
    width: auto !important;
  }

  .header-kicker {
    justify-self: center !important;
    padding-right: 110px !important;
  }

  body {
    padding-top: 56px !important;
  }

  .v3-hero {
    min-height: calc(100dvh - 56px) !important;
    padding-top: clamp(30px, 4.5vh, 50px) !important;
    padding-bottom: clamp(26px, 4vh, 44px) !important;
  }

  .v3-hero__contenido {
    max-width: 860px !important;
  }

  .v3-hero h1 {
    font-size: clamp(3.2rem, 5.35vw, 5.15rem) !important;
    line-height: .93 !important;
  }

  .v3-hero__subtitulo {
    margin-top: 20px !important;
    font-size: clamp(1.25rem, 2vw, 1.8rem) !important;
    line-height: 1.3 !important;
  }

  .v3-hero__texto {
    margin-top: 18px !important;
    line-height: 1.55 !important;
  }

  .v3-precio-hero {
    margin-top: 20px !important;
    padding-top: 12px !important;
    padding-bottom: 12px !important;
  }

  .v3-precio-hero p {
    margin-top: 4px !important;
  }

  .v3-hero,
  .v3-situaciones,
  .v3-prueba,
  .v3-quien,
  .v3-dudas,
  .v3-precio,
  .v3-timeline,
  .v3-cierre {
    scroll-margin-top: 56px !important;
  }
}

/* En móvil se conserva espacio suficiente para el logo. */
@media (max-width: 900px) {
  .site-header.compacta {
    min-height: 60px !important;
    height: 60px !important;
    padding: 8px 16px !important;
  }

  body {
    padding-top: 60px !important;
  }
}

/* =========================================================
   CAPTURA APROBADA · MASAJE PROFESIONAL SPA
   ========================================================= */

.v3-prueba__captura {
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  border: 1px solid rgba(0, 0, 0, 0.16) !important;
  border-radius: 16px !important;
  background: #111 !important;
  aspect-ratio: 1820 / 832 !important;
}

.v3-prueba__captura img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center !important;
}

/* =========================================================
   AJUSTES DE COPY Y JERARQUÍA · SITUACIONES Y MÉTRICAS
   ========================================================= */

.v3-situaciones > .contenedor > .kicker {
  max-width: 850px !important;
  margin-bottom: 34px !important;
  font-size: clamp(1.25rem, 2.2vw, 1.75rem) !important;
  line-height: 1.2 !important;
  font-weight: 700 !important;
  letter-spacing: 0.02em !important;
  text-transform: none !important;
}

.v3-fecha {
  margin: 38px 0 18px !important;
  font-size: clamp(1.15rem, 1.8vw, 1.45rem) !important;
  line-height: 1.3 !important;
  font-weight: 700 !important;
  letter-spacing: 0.01em !important;
}

.v3-nota {
  max-width: 900px !important;
  line-height: 1.65 !important;
}

@media (max-width: 700px) {
  .v3-situaciones > .contenedor > .kicker {
    margin-bottom: 26px !important;
    font-size: 1.25rem !important;
  }

  .v3-fecha {
    margin-top: 30px !important;
    font-size: 1.15rem !important;
  }
}


/* === AJUSTE FINO TIMELINE 03-04 === */
@media (min-width: 901px) {
  .mapa .estacion.e3 {
    transform: translate(-30px, 22px) !important;
    z-index: 3 !important;
  }

  .mapa .estacion.e4 {
    transform: translate(18px, -18px) !important;
    z-index: 4 !important;
  }
}
/* === FIN AJUSTE FINO TIMELINE 03-04 === */

/* =========================================================
   SECCIÓN QUIÉN SOY · SIN FOTO
   ========================================================= */

.v3-quien__layout {
  display: block !important;
}

.v3-quien__texto {
  width: 100% !important;
  max-width: 920px !important;
  margin: 0 auto !important;
}

.v3-quien__texto h2 {
  max-width: 760px !important;
}

.v3-quien__texto > p:not(.kicker) {
  max-width: 820px !important;
}

@media (max-width: 700px) {
  .v3-quien__texto {
    max-width: none !important;
  }
}

/* =========================================================
   PÁGINAS LEGALES ARTUX · V1
   ========================================================= */

.footer-legales {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin-top: 12px;
  font-size: .84rem;
}

.footer-legales a {
  color: inherit;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.pagina-legal {
  padding-top: 0 !important;
  background: #f7f2e8;
  color: #17252c;
}

.legal-header {
  position: static;
  min-height: 72px;
  border-bottom: 1px solid rgba(23, 37, 44, .14);
  background: rgba(255, 253, 248, .97);
}

.legal-header__interior {
  min-height: 72px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
}

.legal-header img {
  display: block;
  width: 150px;
  height: auto;
}

.legal-volver {
  font-weight: 700;
  color: #17252c;
}

.legal-main {
  padding: clamp(56px, 8vw, 104px) 20px;
}

.legal-documento {
  width: min(100%, 850px);
  margin: 0 auto;
}

.legal-documento h1 {
  max-width: none;
  margin: 12px 0 12px;
  font-family: "Fraunces", Georgia, serif;
  font-size: clamp(3rem, 7vw, 5.6rem);
  line-height: .96;
}

.legal-version {
  margin: 0 0 38px;
  font-family: "IBM Plex Mono", monospace;
  font-size: .8rem;
  color: #52636b;
}

.legal-introduccion {
  margin-bottom: 56px;
  font-size: clamp(1.2rem, 2vw, 1.55rem);
  line-height: 1.5;
}

.legal-documento section {
  padding: 34px 0;
  border-top: 1px solid rgba(23, 37, 44, .14);
}

.legal-documento h2 {
  margin: 0 0 18px;
  font-family: "Fraunces", Georgia, serif;
  font-size: clamp(1.65rem, 3vw, 2.35rem);
  line-height: 1.08;
}

.legal-documento p,
.legal-documento li {
  font-size: 1rem;
  line-height: 1.72;
}

.legal-documento p {
  margin: 0 0 18px;
}

.legal-documento ul {
  margin: 18px 0 24px;
  padding-left: 24px;
}

.legal-documento li + li {
  margin-top: 9px;
}

.legal-documento a {
  color: #146b63;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.legal-aclaracion {
  margin-top: 42px;
  padding: 24px;
  border: 1px solid rgba(23, 37, 44, .18);
  border-radius: 14px;
  background: rgba(255, 255, 255, .55);
  line-height: 1.6;
}

.legal-footer {
  padding: 30px 20px;
  border-top: 1px solid rgba(23, 37, 44, .14);
  background: #fffdf8;
}

.legal-footer .contenedor {
  display: flex;
  flex-wrap: wrap;
  gap: 16px 26px;
}

.legal-footer a {
  color: #17252c;
  font-size: .9rem;
}

@media (max-width: 700px) {
  .legal-header__interior {
    min-height: 64px;
  }

  .legal-header img {
    width: 122px;
  }

  .legal-volver {
    font-size: .82rem;
  }

  .legal-main {
    padding: 44px 18px 70px;
  }

  .legal-introduccion {
    margin-bottom: 42px;
  }

  .legal-documento section {
    padding: 28px 0;
  }
}

/* =========================================================
   AJUSTE FINAL WHATSAPP · CUENTAME TU PROYECTO
   ========================================================= */

.whatsapp-flotante {
  right: 22px;
  bottom: 22px;

  min-height: 54px;
  padding: 0 21px;

  gap: 9px;
  border: 1px solid rgba(255, 255, 255, .28);
  border-radius: 999px;

  color: #ffffff;
  background: #20c95a;
  box-shadow:
    0 12px 30px rgba(18, 89, 48, .26),
    0 3px 8px rgba(0, 0, 0, .12);

  font-size: .94rem;
  font-weight: 700;
  line-height: 1;
  white-space: nowrap;

  transition:
    transform .18s ease,
    background-color .18s ease,
    box-shadow .18s ease;
}

.whatsapp-flotante:hover {
  background: #18b94f;
  transform: translateY(-3px);
  box-shadow:
    0 16px 34px rgba(18, 89, 48, .3),
    0 4px 10px rgba(0, 0, 0, .14);
}

.whatsapp-flotante:active {
  transform: translateY(-1px) scale(.98);
}

.whatsapp-flotante__icono {
  width: 27px;
  height: 27px;
}

.whatsapp-flotante__texto {
  display: inline-block;
}

@media (max-width: 767px) {
  .whatsapp-flotante {
    right: 12px;
    bottom: 14px;

    width: auto;
    min-width: 0;
    height: auto;
    min-height: 52px;
    padding: 0 17px;

    border-radius: 999px;
    font-size: .86rem;
  }

  .whatsapp-flotante__icono {
    width: 25px;
    height: 25px;
  }

  .whatsapp-flotante__texto {
    display: inline-block;
  }

  body {
    padding-bottom: 84px;
  }
}

@media (max-width: 390px) {
  .whatsapp-flotante {
    right: 10px;
    bottom: 12px;
    min-height: 49px;
    padding: 0 14px;
    font-size: .8rem;
  }

  .whatsapp-flotante__icono {
    width: 23px;
    height: 23px;
  }
}