:root {
  --azul:#204e78;
  --fondo:#f2f1ec;
  --gris:#4d5a66;
  --gris-claro:#dce2e9;
  --blanco:#ffffff;
  --sombra:0 12px 40px rgba(32,78,120,0.08);
  --radius:16px;
  --transition:all 0.25s ease;
  --hero-mobile-bg-x:35%
}
*,*::before,*::after {
  box-sizing:border-box
}
body {
  margin:0;
  font-family:"Inter","Segoe UI",system-ui,-apple-system,sans-serif;
  color:var(--gris);
  background:var(--fondo);
  line-height:1.6;
  scroll-behavior:smooth
}
a {
  color:inherit;
  text-decoration:none
}
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible {
  outline:2px solid #c9a86a;
  outline-offset:2px
}
img {
  max-width:100%;
  height:auto;
  display:block
}
h1,h2,h3,h4 {
  color:#0f1b2b;
  margin:0 0 0.5em
}
p {
  margin:0 0 1em
}
ul {
  padding-left:1.1em
}
.container {
  width:min(1200px,92vw);
  margin:0 auto
}
.narrow {
  width:min(820px,92vw);
  margin:0 auto
}
.section-padding {
  padding:80px 0
}
.alt-bg {
  background:var(--blanco)
}
.eyebrow {
  text-transform:uppercase;
  letter-spacing:0.08em;
  font-weight:700;
  font-size:0.82rem;
  color:var(--azul);
  margin-bottom:0.5rem
}
.lead {
  font-size:1.08rem
}
.bullet-list {
  margin:0 0 1.2em;
  padding-left:1.2em
}
.bullet-list li {
  margin-bottom:0.4em
}
.btn {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding:12px 18px;
  border-radius:999px;
  border:1px solid transparent;
  font-weight:700;
  cursor:pointer;
  transition:var(--transition);
  text-decoration:none
}
.btn-primary {
  background:var(--azul);
  color:var(--blanco);
  box-shadow:0 10px 30px rgba(32,78,120,0.3)
}
.btn-primary:hover,.btn-primary:focus-visible {
  transform:translateY(-2px);
  box-shadow:0 16px 40px rgba(32,78,120,0.32)
}
.btn-secondary {
  background:transparent;
  color:var(--azul);
  border:1px solid var(--azul)
}
.btn-secondary2 {
  background:transparent;
  color:var(--blanco);
  border:1px solid var(--blanco)
}
.btn-light {
  background:#fff;
  color:var(--azul);
  border:1px solid #fff;
  box-shadow:0 12px 30px rgba(15,27,43,0.12)
}
.btn-light:hover,.btn-light:focus-visible {
  background:#f2f6fb;
  color:var(--azul);
  transform:translateY(-2px);
  box-shadow:0 14px 34px rgba(15,27,43,0.16)
}
.btn-full {
  width:100%
}
.card {
  background:var(--blanco);
  border-radius:var(--radius);
  padding:24px;
  box-shadow:var(--sombra)
}
.image-box {
  text-align:center
}
.empleados-figure {
  display:grid;
  gap:10px
}
.empleados-figure img {
  width:100%;
  height:auto;
  object-fit:cover;
  max-height:420px
}
.caption {
  font-size:0.9rem;
  color:#6c7884;
  margin-top:0.5rem
}
.justify {
  text-align:justify
}
.highlight {
  background:linear-gradient(120deg,#f8fafc 0%,#eef5ff 100%);
  border:1px solid var(--gris-claro)
}
.note {
  font-size:0.95rem;
  color:#6c7884
}
.simulador-section {
  position:relative;
  background:radial-gradient(circle at 12% 20%,rgba(32,78,120,0.09),transparent 28%),linear-gradient(135deg,#f6f9fc 0%,#eef3fb 45%,#f9fbff 100%);
  color:var(--gris);
  overflow:hidden
}
.simulador-section::after {
  content:"";
  position:absolute;
  inset:0;
  background:url("../img/logo.webp") center/440px no-repeat;
  opacity:0.07;
  pointer-events:none;
  z-index:1
}
.simulador-section>* {
  position:relative;
  z-index:1
}
.simulador-shell {
  position:relative;
  z-index:2;
  background:rgba(255,255,255,0.78);
  border:1px solid rgba(32,78,120,0.12);
  border-radius:24px;
  padding:clamp(18px,4vw,32px);
  box-shadow:0 18px 48px rgba(15,27,43,0.12);
  backdrop-filter:blur(12px)
}
.simulador-top {
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:16px;
  flex-wrap:wrap
}
.sim-pill {
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding:10px 14px;
  border-radius:999px;
  background:rgba(32,78,120,0.08);
  color:#153652;
  font-weight:700
}
.sim-pill .dot {
  width:10px;
  height:10px;
  border-radius:50%;
  background:linear-gradient(135deg,#204e78,#3a6dae);
  box-shadow:0 0 0 6px rgba(32,78,120,0.15)
}
.form-disclaimer {
  font-size:0.85rem;
  color:#6c7884;
  margin-top:8px
}
.form-success {
  background:#e8f2fb;
  border:1px solid #c8daef;
  color:#0f1b2b;
  padding:16px;
  border-radius:12px;
  margin-top:12px
}
.form-success h3 {
  margin:0 0 6px
}
.hidden {
  display:none !important
}
.centered {
  text-align:center
}
.mt-lg {
  margin-top:48px
}
.skip-link {
  position:absolute;
  left:-999px;
  top:10px;
  background:#0f1b2b;
  color:var(--blanco);
  padding:10px 14px;
  border-radius:10px;
  z-index:100
}
.skip-link:focus-visible {
  left:12px
}
.visually-hidden {
  position:absolute;
  width:1px;
  height:1px;
  margin:-1px;
  border:0;
  padding:0;
  overflow:hidden;
  clip:rect(0 0 0 0);
  white-space:nowrap
}
.input-error {
  margin:0;
  color:#b00020;
  font-size:0.86rem;
  font-weight:700
}
.input-group.error label {
  color:#b00020
}
.input-group.error input,.input-group.error textarea {
  border-color:#b00020;
  background:#ffeef0;
  box-shadow:0 0 0 2px rgba(176,0,32,0.12)
}
.site-header {
  position:fixed;
  top:0;
  left:0;
  right:0;
  width:100%;
  background:transparent;
  backdrop-filter:blur(10px);
  box-shadow:0 6px 22px rgba(15,27,43,0.12);
  z-index:20;
  transition:color 0.3s ease,background 0.3s ease,box-shadow 0.3s ease;
  color:var(--gris)
}
.header-inner {
  display:grid;
  grid-template-columns:auto 1fr auto;
  align-items:center;
  gap:16px;
  padding:14px 0
}
.logo img {
  height:42px;
  width:auto;
  display:block
}
.header-actions {
  display:flex;
  align-items:center;
  gap:10px;
  margin-left:auto
}
.main-nav {
  display:flex;
  gap:14px;
  justify-content:center;
  flex-wrap:wrap;
  color:inherit
}
.main-nav a {
  background:transparent;
  padding:8px 12px;
  border-radius:12px;
  transition:var(--transition);
  color:inherit;
  font-weight:600;
  text-align:center
}
.main-nav a:not(.active) {
  background:transparent
}
.main-nav a:hover,.main-nav a:focus-visible {
  background:#e7eef5
}
.menu-toggle {
  display:none;
  flex-direction:column;
  justify-content:center;
  gap:5px;
  width:44px;
  height:44px;
  border-radius:12px;
  border:1px solid var(--gris-claro);
  background:var(--blanco);
  cursor:pointer;
  padding:8px 10px
}
.menu-toggle span {
  height:2px;
  width:100%;
  background:currentColor;
  border-radius:4px;
  transition:var(--transition)
}
@media (min-width:1024px) {
  .main-nav {
    margin:0 auto;
    padding:8px 16px;
    border-radius:999px;
    background:rgba(255,255,255,0.6);
    border:1px solid rgba(255,255,255,0.4);
    backdrop-filter:blur(12px);
    box-shadow:0 10px 30px rgba(15,27,43,0.12)
  }
  .header-transparent .main-nav {
    background:rgba(255,255,255,0.6);
    border-color:rgba(255,255,255,0.4);
    box-shadow:0 10px 30px rgba(15,27,43,0.12)
  }
}
body.nav-open .menu-toggle span:nth-child(1) {
  transform:translateY(7px) rotate(45deg)
}
body.nav-open .menu-toggle span:nth-child(2) {
  opacity:0
}
body.nav-open .menu-toggle span:nth-child(3) {
  transform:translateY(-7px) rotate(-45deg)
}
.nav-overlay {
  position:fixed;
  inset:0;
  background:rgba(15,27,43,0.35);
  backdrop-filter:blur(2px);
  opacity:0;
  visibility:hidden;
  transition:var(--transition);
  z-index:15
}
.page-form #footer-placeholder,
.page-form #footer {
  display:none!important
}
.header-transparent {
  background:transparent;
  box-shadow:none;
  backdrop-filter:none;
  border-bottom:none;
  color:var(--gris)
}
.header-transparent:hover {
  background:transparent;
  box-shadow:none
}
.header-transparent .main-nav a:hover,.header-transparent .main-nav a:focus-visible {
  background:#e7eef5;
  color:var(--gris)
}
.header-actions {
  justify-self:end;
  margin-left:0
}
.hero {
  padding-top:120px
}
.hero-bg {
  background:linear-gradient(120deg,rgba(15,27,43,0.78),rgba(15,27,43,0.55)),url("../img/home.webp");
  background-size:cover;
  background-position:top;
  color:#f5f8fc
}
.hero-bg h1,.hero-bg h2,.hero-bg p,.hero-bg .lead {
  color:#f5f8fc
}
.hero-bg .eyebrow {
  color:#e3ecf8
}
.hero-bg .hero-form {
  background:rgba(255,255,255,0.08);
  border:1px solid rgba(255,255,255,0.28);
  box-shadow:0 18px 48px rgba(0,0,0,0.25);
  backdrop-filter:blur(8px);
  transition:background 0.3s ease,border-color 0.3s ease,box-shadow 0.3s ease
}
.hero-bg .hero-form:hover,.hero-bg .hero-form:focus-within {
  background:rgba(255,255,255,0.16);
  border-color:rgba(255,255,255,0.42);
  box-shadow:0 22px 52px rgba(0,0,0,0.28)
}
.hero.b2b {
  background:linear-gradient(120deg,#f7fafc 0%,#eef3ff 100%)
}
.hero-grid {
  display:grid;
  gap:28px
}
@media (max-width:767px) {
  .hero-bg {
    background-position:var(--hero-mobile-bg-x,60%) top
  }
}
.mode-toggle {
  display:inline-flex;
  padding:6px;
  background:var(--blanco);
  border-radius:999px;
  box-shadow:var(--sombra);
  margin-bottom:18px
}
.toggle-btn {
  border:none;
  background:transparent;
  padding:10px 16px;
  border-radius:999px;
  font-weight:700;
  color:var(--gris);
  cursor:pointer;
  transition:var(--transition)
}
.toggle-btn.active {
  background:var(--azul);
  color:var(--blanco);
  box-shadow:0 10px 30px rgba(32,78,120,0.3)
}
.contact-mode {
  display:inline-flex;
  padding:6px;
  background:var(--blanco);
  border-radius:999px;
  box-shadow:var(--sombra);
  margin-bottom:12px;
  gap:6px
}
.contact-toggle-btn {
  border:none;
  background:transparent;
  padding:8px 14px;
  border-radius:999px;
  font-weight:700;
  color:var(--gris);
  cursor:pointer;
  transition:var(--transition)
}
.contact-toggle-btn.active {
  background:var(--azul);
  color:var(--blanco);
  box-shadow:0 10px 30px rgba(32,78,120,0.3)
}
.hero-cta {
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:14px
}
.hero-side {
  display:grid;
  gap:16px;
  align-self:start
}
.hero-visual {
  margin:0;
  overflow:hidden;
  border-radius:var(--radius);
  box-shadow:var(--sombra)
}
.hero-visual img {
  width:100%;
  height:auto;
  object-fit:cover
}
.hero-form {
  position:relative;
  isolation:isolate
}
.form-note {
  font-size:0.9rem;
  color:#6c7884
}
.form-status {
  min-height:20px;
  font-weight:600;
  margin-top:8px
}
.simulador-grid {
  display:grid;
  gap:16px;
  margin-top:18px;
  grid-template-columns:1fr
}
.sim-card {
  background:rgba(255,255,255,0.92);
  border:1px solid rgba(32,78,120,0.12);
  border-radius:18px;
  padding:clamp(18px,3vw,24px);
  box-shadow:0 14px 36px rgba(15,27,43,0.1);
  transition:transform 0.25s ease,box-shadow 0.25s ease,border-color 0.25s ease
}
.sim-card:hover,.sim-card:focus-within {
  transform:translateY(-2px);
  box-shadow:0 16px 38px rgba(15,27,43,0.14);
  border-color:rgba(32,78,120,0.2)
}
.sim-card-head {
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:10px;
  margin-bottom:10px
}
.sim-card-head h3 {
  margin:6px 0 0
}
.sim-card-head.alt h3 {
  margin-top:6px
}
.sim-tag {
  padding:8px 12px;
  border-radius:12px;
  background:rgba(32,78,120,0.1);
  color:#153652;
  font-weight:700
}
.range-group {
  display:grid;
  gap:10px;
  margin-top:18px
}
.range-label {
  display:flex;
  align-items:center;
  justify-content:space-between;
  color:#0f1b2b;
  font-weight:700
}
.range-label strong {
  color:#204e78
}
.simulador-form input[type="range"] {
  width:100%;
  appearance:none;
  height:10px;
  border-radius:999px;
  background-image:linear-gradient(90deg,#204e78 var(--fill,50%),#dbe4ef var(--fill,50%)),repeating-linear-gradient(135deg,rgba(255,255,255,0.25) 0 10px,rgba(255,255,255,0.05) 10px 20px);
  background-size:100% 100%,200% 100%;
  background-position:0 0,0 0;
  animation:waveFlow 6s linear infinite;
  transition:box-shadow 0.2s ease,background 0.2s ease
}
.simulador-form input[type="range"]::-webkit-slider-thumb {
  appearance:none;
  width:22px;
  height:22px;
  border-radius:50%;
  background:#ffffff;
  border:2px solid #204e78;
  box-shadow:0 8px 22px rgba(15,27,43,0.18);
  transition:transform 0.2s ease,box-shadow 0.2s ease
}
.simulador-form input[type="range"]::-moz-range-thumb {
  width:22px;
  height:22px;
  border-radius:50%;
  background:#ffffff;
  border:2px solid #204e78;
  box-shadow:0 8px 22px rgba(15,27,43,0.18);
  transition:transform 0.2s ease,box-shadow 0.2s ease
}
.simulador-form input[type="range"]::-moz-range-track {
  background:transparent
}
.simulador-form input[type="range"]:focus-visible {
  outline:none;
  box-shadow:0 0 0 10px rgba(32,78,120,0.16)
}
.simulador-form input[type="range"]:active::-webkit-slider-thumb,.simulador-form input[type="range"]:focus-visible::-webkit-slider-thumb,.simulador-form input[type="range"]:active::-moz-range-thumb,.simulador-form input[type="range"]:focus-visible::-moz-range-thumb {
  transform:scale(1.05);
  box-shadow:0 12px 28px rgba(15,27,43,0.22)
}
.range-hints {
  display:flex;
  justify-content:space-between;
  font-size:0.9rem;
  color:#6c7884
}
.sim-meta {
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(160px,1fr));
  gap:10px;
  margin:16px 0 6px;
  padding:12px;
  border-radius:14px;
  background:rgba(32,78,120,0.06)
}
.meta-item {
  display:grid;
  gap:2px
}
.meta-label {
  font-size:0.9rem;
  color:#6c7884
}
.meta-value {
  font-weight:700;
  color:#153652
}
.simulador-resumen {
  background:linear-gradient(140deg,rgba(32,78,120,0.92),rgba(58,109,174,0.94)),linear-gradient(160deg,rgba(255,255,255,0.08),transparent 60%);
  color:var(--blanco);
  border:1px solid rgba(255,255,255,0.28);
  box-shadow:0 18px 44px rgba(32,78,120,0.35);
  backdrop-filter:blur(10px)
}
.simulador-resumen .sim-card-head h3,.simulador-resumen .eyebrow {
  color:#f1f5fb
}
.sim-summary {
  display:grid;
  gap:12px;
  margin-top:12px
}
.sim-summary-item {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:10px 12px;
  border-radius:12px;
  background:rgba(255,255,255,0.08)
}
.sim-label {
  color:rgba(245,248,252,0.9);
  font-size:0.95rem
}
.sim-value {
  font-weight:800;
  font-size:1.08rem;
  color:#ffffff
}
.sim-total {
  margin-top:6px;
  padding:14px;
  border-radius:14px;
  background:rgba(255,255,255,0.12);
  border:1px solid rgba(255,255,255,0.12)
}
.sim-total-value {
  font-size:1.8rem;
  font-weight:800;
  margin:6px 0
}
.sim-sub {
  margin:0;
  color:rgba(245,248,252,0.82)
}
.sim-helper {
  margin:10px 0 0;
  font-size:0.9rem;
  color:#6c7884
}
.simulador-resumen .sim-helper {
  color:rgba(245,248,252,0.85)
}
@keyframes waveFlow {
  0% {
    background-position:0 0,0 0
  }
  100% {
    background-position:0 0,-200px 0
  }
}
@media (min-width:768px) {
  .simulador-shell {
    padding:26px
  }
  .simulador-grid {
    grid-template-columns:repeat(auto-fit,minmax(320px,1fr));
    gap:18px
  }
}
@media (min-width:1024px) {
  .simulador-shell {
    padding:32px
  }
  .simulador-grid {
    grid-template-columns:1.05fr 0.95fr;
    gap:22px
  }
}
.values-list {
  list-style:none;
  padding-left:0;
  display:grid;
  gap:8px
}
.values-list li {
  position:relative;
  padding-left:22px
}
.values-list li::before {
  content:"✔";
  position:absolute;
  left:0;
  top:0;
  color:var(--azul);
  font-weight:800
}
.dual-layout {
  display:grid;
  gap:32px
}
.empleados-layout {
  align-items:center
}
.stack {
  display:grid;
  gap:12px
}
.benefit-grid,.steps-grid,.stats-grid,.footer-grid {
  display:grid;
  gap:16px
}
.steps-grid .card,.stats-grid .card {
  text-align:left
}
.history {
  max-width:820px;
  margin:28px auto 0
}
.steps-hero {
  background:linear-gradient(140deg,rgba(15,27,43,0.74),rgba(33,78,120,0.64)),url("../img/aboutustop.webp") center/cover no-repeat;
  color:#f5f8fc
}
.steps-hero h2,.steps-hero p,.steps-hero .eyebrow {
  color:#f5f8fc
}
.steps-hero .card {
  background:rgba(255,255,255,0.14);
  color:#f5f8fc;
  border:1px solid rgba(255,255,255,0.35);
  box-shadow:0 18px 40px rgba(0,0,0,0.22);
  backdrop-filter:blur(12px)
}
.steps-hero .card h3,.steps-hero .card p {
  color:#f5f8fc
}
.quienes-section {
  position:relative;
  overflow:hidden;
  margin-top:40px;
  padding:40px 24px 32px;
  border-radius:18px;
  background:linear-gradient(180deg,rgba(255,255,255,0.9),rgba(245,248,252,0.92))
}
.quienes-section::after {
  content:"";
  position:absolute;
  inset:0;
  background:url("../img/logo.webp") center/360px no-repeat;
  opacity:0.08;
  pointer-events:none
}
.quienes-section>* {
  position:relative;
  z-index:1
}
.quienes-actions {
  margin:0 0 90px
}
.step-number {
  display:inline-flex;
  width:40px;
  height:40px;
  border-radius:12px;
  align-items:center;
  justify-content:center;
  background:#e7eef5;
  color:var(--azul);
  font-weight:800;
  margin-bottom:12px
}
.teaser {
  align-items:center;
  background:linear-gradient(180deg,rgba(15,27,43,0.65),rgba(15,27,43,0.65)),url("../img/home-paraempresas.webp") center/cover no-repeat;
  color:#f5f8fc
}
.teaser-content {
  display:grid;
  gap:16px;
  align-items:center;
  grid-template-columns:1fr auto
}
.teaser h2,.teaser p {
  color:#f5f8fc
}
.teaser .btn-primary {
  background:#fff;
  color:var(--azul);
  border-color:#fff;
  box-shadow:0 12px 30px rgba(0,0,0,0.16)
}
.teaser .btn-primary:hover,.teaser .btn-primary:focus-visible {
  background:#f2f6fb;
  color:var(--azul);
  box-shadow:0 14px 34px rgba(0,0,0,0.18)
}
.benefits .card {
  min-height:200px
}
.empleados-section {
  background:var(--blanco);
  position:relative;
  overflow:hidden
}
.empleados-section::after {
  content:"";
  position:absolute;
  inset:0;
  background:url("../img/logo.webp") right -60px bottom -80px/460px no-repeat;
  opacity:0.06;
  pointer-events:none
}
.empleados-card {
  position:relative;
  background:var(--blanco);
  border:1px solid var(--gris-claro);
  border-radius:24px;
  padding:clamp(24px,3vw,40px);
  box-shadow:var(--sombra);
  backdrop-filter:none;
  overflow:hidden
}
.empleados-card .stack {
  position:relative;
  z-index:1;
  gap:14px
}
.empleados-card .eyebrow {
  display:inline-flex;
  align-items:center;
  gap:8px;
  background:rgba(32,78,120,0.08);
  color:#163454;
  padding:8px 12px;
  border-radius:999px
}
.empleados-card .eyebrow::before {
  content:"";
  width:10px;
  height:10px;
  border-radius:50%;
  background:#204e78
}
.empleados-card h2 {
  font-size:clamp(1.6rem,2vw,2.1rem);
  line-height:1.2
}
.empleados-card p {
  font-size:1.02rem;
  color:#3c4a58
}
.empleados-card .benefit-grid {
  grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
  gap:14px
}
.empleados-card .benefit-grid .card {
  position:relative;
  overflow:hidden;
  border:1px solid rgba(32,78,120,0.08);
  background:var(--blanco);
  box-shadow:0 10px 28px rgba(15,27,43,0.08);
  padding:18px
}
.empleados-card .benefit-grid .card::before {
  content:none
}
.empleados-card .benefit-grid h3 {
  margin-bottom:8px
}
.empleados-figure {
  position:relative;
  z-index:1;
  background:var(--blanco);
  border:1px solid var(--gris-claro);
  box-shadow:var(--sombra)
}
.empleados-figure img {
  height:100%;
  min-height:320px;
  object-fit:cover
}
.empleados-figure .caption {
  color:#3c4a58
}
.cifras-section {
  background:var(--fondo);
  color:var(--gris)
}
.cifras-section .eyebrow,.cifras-section h2,.cifras-section p {
  color:inherit
}
.input-group {
  display:grid;
  gap:6px;
  margin-bottom:14px
}
.input-group label {
  font-weight:600
}
input,select,textarea {
  width:100%;
  padding:12px 14px;
  border-radius:12px;
  border:1px solid var(--gris-claro);
  background:#f9fbfd;
  font:inherit;
  transition:var(--transition)
}
input:focus,select:focus,textarea:focus {
  outline:2px solid rgba(32,78,120,0.25);
  background:var(--blanco)
}
.input-helper {
  margin:0;
  font-size:0.85rem;
  color:#6c7884
}
.accordion {
  display:grid;
  gap:12px
}
.accordion-item {
  border:1px solid var(--gris-claro);
  border-radius:14px;
  overflow:hidden;
  background:var(--blanco)
}
.accordion-trigger {
  width:100%;
  text-align:left;
  padding:14px 16px;
  border:none;
  background:transparent;
  font-weight:700;
  cursor:pointer;
  display:flex;
  justify-content:space-between;
  align-items:center
}
.accordion-trigger::after {
  content:"⌄";
  transition:var(--transition)
}
.accordion-item.active .accordion-trigger::after {
  transform:rotate(-180deg)
}
.accordion-content {
  max-height:0;
  overflow:hidden;
  transition:max-height 0.3s ease,padding 0.3s ease;
  padding:0 16px
}
.accordion-item.active .accordion-content {
  padding:0 16px 14px;
  max-height:400px
}
.page-hero {
  padding:60px 0 20px;
  text-align:center
}
.page-hero h1 {
  font-size:clamp(1.8rem,2.5vw,2.4rem)
}
.page-hero p {
  color:#3c4a58;
  max-width:640px;
  margin:0 auto
}
.faq-hero {
  padding:110px 0 90px;
  background:linear-gradient(130deg,rgba(33,78,120,0.70),rgba(26,63,98,0.70)),url("../img/faq.webp") center 25% / cover no-repeat;
  color:#f5f8fc;
  position:relative;
  overflow:hidden
}
.faq-hero::after {
  content:"";
  position:absolute;
  inset:0;
  background:url("../img/logo.webp") center/360px no-repeat;
  opacity:0.08;
  pointer-events:none
}
.faq-hero:hover {
  background:linear-gradient(130deg,rgba(33,78,120,0.70),rgba(26,63,98,0.70)),url("../img/faq.webp") center 25% / cover no-repeat
}
.faq-hero .eyebrow {
  color:#d7e6f6
}
.faq-hero h1,.faq-hero p {
  color:#f5f8fc
}
.faq-hero .lead {
  max-width:720px;
  margin:0 0 18px 0
}
.faq-hero .hero-cta {
  justify-content:flex-start
}
.faq-benefits {
  padding:54px 0 14px
}
.faq-benefits h2 {
  text-align:center;
  margin-bottom:20px
}
.faq-benefits {
  position:relative;
  overflow:hidden
}
.faq-benefits::before {
  content:"";
  position:absolute;
  inset:0;
  background:url("../img/logo.webp") center/520px no-repeat;
  opacity:0.08;
  pointer-events:none
}
.faq-benefits .benefit-grid {
  gap:18px;
  grid-template-columns:repeat(auto-fit,minmax(240px,1fr))
}
.faq-benefits .benefit-grid .card {
  position:relative;
  overflow:hidden;
  padding:22px;
  background:linear-gradient( 145deg,rgba(255,255,255,0.82),rgba(245,247,252,0.92) );
  border:1px solid rgba(32,78,120,0.10);
  border-radius:16px;
  box-shadow:0 10px 24px rgba(15,27,43,0.06);
  display:flex;
  flex-direction:column;
  gap:10px;
  transition:box-shadow 0.25s ease,transform 0.25s ease,border-color 0.25s ease
}
.faq-benefits .benefit-grid .card::before {
  content:"";
  position:absolute;
  width:160px;
  height:160px;
  background:radial-gradient(circle,rgba(32,78,120,0.10),transparent 70%);
  top:-60px;
  right:-60px;
  pointer-events:none
}
.faq-benefits .benefit-grid .card h3 {
  color:#153652;
  margin:0;
  font-size:1.15rem;
  font-weight:600
}
.faq-benefits .benefit-grid .card p {
  color:#4a5d70;
  line-height:1.55;
  font-size:0.95rem
}
.faq-benefits .benefit-grid .card:hover,.faq-benefits .benefit-grid .card:focus-within {
  transform:translateY(-4px);
  box-shadow:0 16px 38px rgba(15,27,43,0.12);
  border-color:rgba(32,78,120,0.20)
}
.faq-content {
  padding-bottom:90px
}
.faq-content {
  position:relative;
  overflow:hidden
}
.faq-content::before {
  content:"";
  position:absolute;
  inset:0;
  background:url("../img/logo.webp") left -80px bottom -40px/360px no-repeat;
  opacity:0.06;
  pointer-events:none;
  z-index:0
}
.faq-content>* {
  position:relative;
  z-index:1
}
.faq-actions {
  gap:12px;
  margin-top:28px
}
@media (max-width:768px) {
  .faq-benefits .benefit-grid .card {
    padding:18px;
    border-radius:14px;
    gap:8px
  }
  .faq-benefits .benefit-grid .card h3 {
    font-size:1.05rem
  }
  .faq-benefits .benefit-grid .card p {
    font-size:0.90rem
  }
}
.contact-hero {
  background:linear-gradient(120deg,#eef3fb 0%,#f7fafd 100%);
  color:var(--gris);
  position:relative;
  overflow:hidden
}
.contact-hero::after {
  content:"";
  position:absolute;
  inset:0;
  background:url("../img/logo.webp") center/480px no-repeat;
  opacity:0.08;
  pointer-events:none;
  z-index:1
}
.contact-hero .container {
  position:relative;
  z-index:2
}
.contact-hero .eyebrow,.contact-hero h1,.contact-hero p {
  color:inherit
}
.contact-hero .card {
  background:#fff;
  color:var(--gris);
  border:1px solid var(--gris-claro);
  box-shadow:var(--sombra);
  backdrop-filter:none
}
.contact-hero .card p,.contact-hero .card strong,.contact-hero .card label,.contact-hero .card h3 {
  color:inherit
}
.contact-hero .btn-primary {
  box-shadow:0 12px 30px rgba(0,0,0,0.12)
}
.contact-grid {
  display:grid;
  gap:20px;
  align-items:center
}
.contact-visual {
  margin:0;
  border-radius:18px;
  overflow:hidden;
  box-shadow:var(--sombra);
  background:rgba(255,255,255,0.08);
  backdrop-filter:blur(6px)
}
.contact-visual img {
  width:100%;
  height:100%;
  object-fit:cover;
  display:block
}
.contact-panel {
  display:grid;
  gap:14px
}
.contact-panel .translucent {
  background:rgba(255,255,255,0.14);
  border:1px solid rgba(255,255,255,0.28);
  box-shadow:0 18px 44px rgba(0,0,0,0.25)
}
.contact-panel .stack {
  gap:10px
}
@media (min-width:900px) {
  .contact-grid {
    grid-template-columns:1.05fr 1fr
  }
}
@media (max-width:899px) {
  .contact-grid {
    grid-template-columns:1fr
  }
  .contact-visual {
    order:-1
  }
}
@media (max-width:720px) {
  .footer-cta,
  .footer-links {
    justify-content:center;
    width:100%
  }
  .footer-cta .btn-primary,
  .footer-links .btn-primary {
    width:100%;
    max-width:360px;
    text-align:center
  }
}
.accordion-trigger:focus-visible {
  background:#e7eef5
}
.site-footer {
  background:#214e78;
  color:#dfe7f0;
  padding:32px 0 20px
}
.footer-grid {
  grid-template-columns:repeat(auto-fit,minmax(240px,1fr));
  align-items:start;
  margin-bottom:10px;
  gap:14px
}
.premium-footer {
  grid-template-columns:repeat(auto-fit,minmax(240px,1fr))
}
.footer-brand {
  display:grid;
  gap:16px;
  align-items:start
}
.footer-logo {
  max-width:180px;
  height:auto
}
.footer-grid h3 {
  letter-spacing:0.02em;
  margin-bottom:12px
}
.site-footer a {
  color:#dfe7f0;
  display:inline-flex;
  align-items:center;
  gap:8px;
  margin-bottom:6px
}
.footer-legal a {
  margin-bottom:8px
}
.footer-legal .btn-primary {
  margin-top:8px
}
.footer-cta {
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  align-items:center;
  justify-content:flex-start;
  margin-top:12px
}
.footer-cta .btn-primary {
  min-width:180px;
  justify-content:center
}
.footer-links {
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:10px
}
.footer-links .btn-primary {
  justify-content:center
}
.footer-contact h3,.footer-legal h3 {
  color:#fff;
  font-weight:800
}
.footer-contact p,.footer-legal a {
  color:#fff;
  font-weight:600
}
.footer-legal .btn-primary {
  background:#fff;
  color:#214e78;
  border-color:#fff;
  box-shadow:0 12px 28px rgba(0,0,0,0.12)
}
.footer-legal .btn-primary:hover,.footer-legal .btn-primary:focus-visible {
  background:#f2f6fb;
  color:#214e78;
  box-shadow:0 14px 32px rgba(0,0,0,0.16)
}
.social-row {
  display:grid;
  grid-template-columns:repeat(4,42px);
  gap:12px;
  justify-items:start
}
.social-button {
  width:42px;
  height:42px;
  display:grid;
  place-items:center;
  border-radius:12px;
  background:rgba(255,255,255,0.06);
  color:#dfe7f0;
  transition:transform 0.2s ease,box-shadow 0.2s ease,color 0.2s ease,background 0.2s ease
}
.social-button:hover,.social-button:focus-visible {
  transform:translateY(-3px);
  box-shadow:0 12px 24px rgba(201,168,106,0.28);
  color:#0f1b2b;
  background:#c9a86a
}
.btn-primary {
  transition:transform 0.2s ease,box-shadow 0.2s ease,background 0.2s ease,color 0.2s ease
}
.btn-primary:hover,.btn-primary:focus-visible {
  transform:translateY(-2px);
  box-shadow:0 14px 30px rgba(201,168,106,0.35);
  background:#c9a86a;
  color:#0f1b2b;
  border-color:transparent
}
.footer-separator {
  margin-top:8px;
  border-top:1px solid rgba(223,231,240,0.15);
  padding-top:14px
}
.legal-section {
  margin-top:28px;
  padding-top:12px;
  border-top:1px solid rgba(255,255,255,0.12);
  color:#dfe7f0
}
.legal-section h3 {
  margin:0 0 10px;
  color:var(--blanco)
}
.legal-section p {
  margin:0 0 10px
}
.legal-section ul {
  padding-left:18px;
  margin:0;
  display:grid;
  gap:6px
}
.legal-section li strong {
  color:var(--blanco)
}
.legal-section.light {
  border:1px solid var(--gris-claro);
  border-radius:var(--radius);
  padding:18px;
  background:var(--blanco);
  color:var(--gris)
}
.legal-section.light h3,.legal-section.light li strong {
  color:#0f1b2b
}
.copyright {
  margin-top:12px;
  color:#9fb4cb;
  font-size:0.9rem;
  text-align:center
}
.whatsapp-bubble {
  position:fixed;
  bottom:20px;
  right:20px;
  width:56px;
  height:56px;
  border-radius:50%;
  background:#25d366;
  color:#fff;
  display:grid;
  place-items:center;
  font-size:1.5rem;
  box-shadow:0 12px 30px rgba(0,0,0,0.18);
  text-decoration:none;
  z-index:50;
  transition:transform 0.2s ease,box-shadow 0.2s ease
}
.whatsapp-bubble:hover,.whatsapp-bubble:focus-visible {
  transform:translateY(-2px);
  box-shadow:0 18px 38px rgba(0,0,0,0.22)
}
.reveal {
  opacity:0;
  transform:translateY(24px);
  transition:var(--transition)
}
.reveal.visible {
  opacity:1;
  transform:translateY(0)
}
@media (prefers-reduced-motion:reduce) {
  * {
    scroll-behavior:auto !important
  }
  .reveal,.accordion-content {
    transition:none
  }
}
@media (max-width:767px) {
  .main-nav {
    position:fixed;
    top:70px;
    right:16px;
    left:16px;
    background:#fff;
    border-radius:14px;
    box-shadow:0 20px 45px rgba(15,27,43,0.12);
    padding:14px;
    display:none;
    flex-direction:column;
    gap:10px;
    z-index:30;
    backdrop-filter:blur(10px)
  }
  .main-nav a {
    padding:12px;
    border-radius:10px;
    color:inherit;
    width:100%
  }
  .header-inner {
    gap:12px;
    align-items:center
  }
  .header-actions {
    gap:8px;
    justify-content:center
  }
  .header-actions .btn {
    justify-content:center;
    text-align:center
  }
  .header-actions .btn-primary {
    padding:10px 14px;
    font-size:0.9rem;
    line-height:1.2;
    order:1
  }
  .menu-toggle {
    display:inline-flex;
    order:2
  }
  .footer-grid {
    text-align:center;
    justify-items:center
  }
  .social-row {
    grid-template-columns:repeat(4,minmax(28px,1fr));
    justify-items:center
  }
  body.nav-open .main-nav {
    display:flex
  }
  body.nav-open .nav-overlay {
    opacity:1;
    visibility:visible;
    backdrop-filter:blur(8px)
  }
  body.nav-open .header-actions {
    position:fixed;
    bottom:18px;
    left:16px;
    right:16px;
    justify-content:center;
    gap:10px;
    z-index:32
  }
  body.nav-open .header-actions .btn-primary {
    width:100%;
    max-width:260px;
    text-align:center
  }
  .teaser-content {
    grid-template-columns:1fr
  }
}
@media (min-width:768px) {
  .hero-grid {
    grid-template-columns:1.1fr 0.9fr;
    align-items:center
  }
  .dual-layout {
    grid-template-columns:repeat(2,minmax(0,1fr));
    align-items:center
  }
  .benefit-grid {
    grid-template-columns:repeat(2,minmax(0,1fr))
  }
  .steps-grid {
    grid-template-columns:repeat(3,minmax(0,1fr))
  }
  .stats-grid {
    grid-template-columns:repeat(3,minmax(0,1fr))
  }
  .footer-grid {
    grid-template-columns:repeat(3,minmax(0,1fr))
  }
  .simulador-container {
    grid-template-columns:1.4fr 1fr
  }
}
@media (min-width:1024px) {
  .section-padding {
    padding:110px 0
  }
  .benefit-grid {
    grid-template-columns:repeat(4,minmax(0,1fr))
  }
  .stats-grid {
    grid-template-columns:repeat(5,minmax(0,1fr))
  }
}
.contact-grid {
  display:grid;
  gap:20px;
  align-items:stretch
}
.contact-visual {
  margin:0;
  border-radius:18px;
  overflow:hidden;
  box-shadow:var(--sombra);
  background:#fff
}
.contact-visual img {
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  min-height:460px
}
.contact-panel {
  display:grid;
  gap:14px;
  background:#f9fbfd;
  border:1px solid var(--gris-claro);
  border-radius:18px;
  padding:clamp(18px,3vw,28px);
  box-shadow:var(--sombra)
}
.contact-panel .translucent {
  background:#fff;
  border:1px solid var(--gris-claro);
  box-shadow:none
}
.contact-panel .stack {
  gap:10px
}
@media (min-width:900px) {
  .contact-grid {
    grid-template-columns:1.05fr 1fr
  }
}
@media (max-width:899px) {
  .contact-grid {
    grid-template-columns:1fr
  }
  .contact-visual {
    order:-1
  }
}