/* Refinement of the original blue, teal and coral identity. */
:root { --navy: #19364d; --teal: #287c78; --coral: #d94e38; --line: #dfe7ec; }
html { scroll-padding-top: 100px; }
body { background: #fbfcfd; color: #203447; }
::selection { background: #d5ebe7; color: var(--navy); }
.container { max-width: 1160px; padding-inline: 32px; }
.header { background: #fbfcfd; border-bottom: 1px solid var(--line); }
.header-inner { height: 80px; }
.logo-img { width: 208px; height: 62px; object-fit: contain; }
.header-nav { gap: 25px; }
.header-nav a { font-size: 13px; color: #4e6374; }
.header-nav a:hover { color: var(--teal); }
.header-cta { padding: 12px 20px; border-radius: 7px; background: var(--coral); }
.header-cta:hover { background: #be3c28; }
.hero { padding: 92px 0 82px; background: var(--navy); }
.hero-media { position: absolute; inset: 0; }
.hero-video { inset: 0; width: 100%; height: 100%; min-width: 0; min-height: 0; transform: none; object-fit: cover; }
.hero-overlay { background: linear-gradient(90deg, rgba(13,31,43,.68), rgba(13,31,43,.44)); }
.hero-content { max-width: 740px; }
.hero-badge { font-size: 11px; font-weight: 500; letter-spacing: 1.1px; border: 0; color: #e1f4ec; background: none; padding: 0; border-radius: 0; margin-bottom: 26px; }
.hero h1 { font-size: clamp(34px, 3.8vw, 49px); letter-spacing: -1.6px; line-height: 1.14; font-weight: 700; margin-bottom: 25px; text-wrap: balance; }
.hero-sub { max-width: 595px; font-size: 16px; line-height: 1.85; opacity: 1; color: #edf2f4; margin-bottom: 32px; }
.hero-actions { gap: 13px; margin-bottom: 35px; }
.btn { border-radius: 7px; min-height: 50px; font-size: 14px; font-weight: 600; padding: 14px 25px; transition: background .2s, border-color .2s, color .2s; }
.btn-primary { background: var(--coral); }
.btn-primary:hover { background: #be3c28; transform: none; }
.btn-outline { border-color: #dfe7ec8c; }
.hero-trust { gap: 28px; }
.trust-item { opacity: 1; color: #e1e9eb; font-size: 11px; font-weight: 400; }
.trust-item svg { stroke-width: 1.7; }
.video-toggle { position: absolute; bottom: 22px; right: 25px; z-index: 3; width: 36px; height: 36px; display: grid; place-items: center; border: 1px solid #dfe7ec80; border-radius: 50%; color: #f4f8fa; background: #19364d70; cursor: pointer; }
.video-toggle svg { width: 12px; height: 12px; }
.video-toggle .play-icon, .video-toggle.is-paused .pause-icon { display: none; }
.video-toggle.is-paused .play-icon { display: block; }
.trust-bar { background: #f0f5f7; padding: 33px 0; border-color: var(--line); }
.trust-bar-grid { gap: 0; }
.trust-bar-grid > div + div { border-left: 1px solid #d4e0e5; }
.trust-stat-number { font-size: 27px; color: var(--navy); letter-spacing: -.7px; }
.trust-stat-label { font-size: 11px; color: #566d7c; font-weight: 400; }
.section-header { margin-bottom: 38px; }
.section-header h2 { font-size: clamp(26px, 2.7vw, 34px); font-weight: 650; line-height: 1.25; letter-spacing: -1px; color: var(--navy); margin-bottom: 14px; }
.section-header p { font-size: 15px; line-height: 1.8; color: #607282; max-width: 605px; }
.tipos, .tests-section, .testimonios { background: #fbfcfd; }
.tipos-grid { gap: 20px; }
.tipo-card { padding: 29px; border: 1px solid var(--line); border-radius: 4px; }
.tipo-card h3, .guia-card h3 { color: var(--navy); font-size: 17px; font-weight: 650; line-height: 1.4; margin-bottom: 12px; }
.tipo-card p, .guia-card p { font-size: 14px; color: #607282; line-height: 1.8; margin-bottom: 22px; }
.tipo-link, .guia-card-link { font-size: 12px; color: var(--teal); }
.tipo-card:hover, .guia-card:hover { transform: none; border-color: #9bbfb9; box-shadow: none; }
.como-funciona, .guias-section, .formulario-section { background: #f1f5f7; }
.pasos-grid { gap: 44px; }
.paso-num { background: none; color: var(--teal); font-size: 26px; font-weight: 400; width: auto; height: auto; border-radius: 0; margin-bottom: 20px; }
.paso h3 { color: var(--navy); font-size: 17px; }
.paso p { font-size: 14px; line-height: 1.8; color: #607282; }
.datos { background: #163247; }
.datos .section-header p { color: #c0d0da; }
.dato-card { background: none; border: 0; border-top: 1px solid #8da9bc50; border-radius: 0; padding: 28px 20px 0; }
.dato-number { font-size: 42px; color: #a5d3c9; letter-spacing: -1.5px; }
.dato-card p { color: #d9e3e9; font-size: 14px; line-height: 1.7; }
.dato-card cite { color: #acc1ce; font-size: 11px; }
.tests-grid { gap: 20px; }
.tests-grid .guia-card-test { padding: 29px 25px; align-items: flex-start; background: #eef5f3; border: 1px solid #d5e5df; }
.guia-card-test h3 { color: var(--navy); font-size: 20px; margin-top: 15px; }
.guia-card-test p { color: #506d72; font-size: 14px; margin-bottom: 25px; }
.guia-card-test .guia-card-badge { color: #326c64; background: none; padding: 0; border: 0; font-size: 10px; letter-spacing: .6px; font-weight: 500; }
.tests-grid .guia-card-test .guia-card-link { background: var(--navy); padding: 11px 18px; font-size: 12px; border-radius: 5px; }
.tests-grid .guia-card-test:hover .guia-card-link { background: #28526a; }
.guias-grid { gap: 0 44px; }
.guia-card { background: transparent; border: 0; border-top: 1px solid #ccd9df; border-radius: 0; padding: 27px 0; }
.guias-grid .guia-card:hover h3 { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 4px; }
.testimonio { background: none; border: 0; border-top: 1px solid #ccd9df; border-radius: 0; padding: 28px 0; }
.testimonio p { font-size: 16px; line-height: 1.85; color: #405968; }
.testimonio footer { font-size: 12px; color: #355769; }
.form-info h2 { color: var(--navy); font-size: 32px; letter-spacing: -1px; }
.form-info > p { font-size: 15px; line-height: 1.8; }
.form-wrapper { gap: 65px; }
.formulario { border-color: var(--line); border-radius: 4px; box-shadow: none; padding: 32px; }
.form-group label { font-size: 12px; }
.form-group input, .form-group select, .form-group textarea { font-size: 16px; border-width: 1px; border-color: #bfced6; }
.form-group textarea { resize: vertical; }
.form-legal { color: #667a87; font-size: 11px; }
.benefit { font-size: 14px; }
.cta-section { background: #1a3a52; padding: 72px 0; }
.cta-section h2 { font-size: 31px; letter-spacing: -.8px; }
.cta-section p { color: #d7e3e9; opacity: 1; font-size: 15px; }
.emergencia { background: #faf3f1; }
.emergency-card { border: 1px solid #e8d5d0; }
.emergency-card strong { font-size: 31px; font-weight: 650; }
.emergency-card span { font-size: 12px; }
.footer { background: #112b3e; }
.footer .logo-img { height: 52px; }
.footer-brand p, .footer-links a { opacity: 1; color: #c0d0da; font-size: 12px; }
.footer-bottom p { opacity: 1; color: #acbeca; font-size: 11px; }
.guia-hero, .guia-cta { background: #193b50; }
.guia-hero h1 { font-size: clamp(29px, 3vw, 42px); letter-spacing: -1px; }
.guia-content h2 { color: var(--navy); }
.guia-content p, .guia-content li { line-height: 1.85; }
.guia-table { overflow-wrap: anywhere; }
.ciudad-extra.is-visible { display: flex; }
.ciudad-ver-todas { order: 2; }
.skip-link { position: fixed; top: 10px; left: 10px; z-index: 200; transform: translateY(-180%); background: var(--navy); color: white; padding: 12px 20px; }
.skip-link:focus { transform: none; }
:focus-visible { outline: 3px solid #3d978d; outline-offset: 4px; }
section:focus { outline: none; }
.mobile-menu { top: 80px; height: calc(100dvh - 80px); right: 0; transform: translateX(100%); visibility: hidden; transition: transform .25s, visibility .25s; }
.mobile-menu.active { transform: none; visibility: visible; }
.mobile-menu-overlay { top: 80px; height: calc(100dvh - 80px); }
.mobile-menu-toggle { width: 44px; height: 44px; align-items: center; justify-content: center; }
.mobile-menu-toggle.active span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.mobile-menu-toggle.active span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }
.menu-open { overflow: hidden; }
.mobile-sticky-bar { padding-bottom: max(10px, env(safe-area-inset-bottom)); }
.mobile-sticky-form { background: var(--coral); }
.mobile-sticky-call { background: #1a3a52; }
.back-to-top { width: 40px; height: 40px; font-size: 18px; }
@media (max-width: 900px) {
  .header-nav { display: none; }
  .mobile-menu-toggle { display: flex; }
  .form-wrapper { gap: 32px; }
}
@media (max-width: 768px) {
  .container { padding-inline: 24px; }
  .header-inner { height: 68px; }
  .logo-img { width: 168px; height: 52px; }
  .mobile-menu, .mobile-menu-overlay { top: 68px; height: calc(100dvh - 68px); }
  .hero { padding: 58px 0 54px; }
  .hero h1 { font-size: clamp(32px, 6.5vw, 43px); letter-spacing: -1px; }
  .hero-sub { font-size: 15px; line-height: 1.75; }
  .hero-badge { font-size: 9px; letter-spacing: .8px; }
  .hero-actions { flex-direction: row; gap: 10px; margin-bottom: 28px; }
  .hero-actions .btn { padding: 13px 18px; min-height: 49px; font-size: 12px; }
  .hero-trust { gap: 14px; }
  .trust-item { font-size: 10px; gap: 5px; }
  .trust-item svg { width: 13px; }
  .video-toggle { bottom: 12px; right: 12px; width: 29px; height: 29px; }
  .trust-bar { padding: 28px 0; }
  .trust-bar-grid { gap: 24px 14px; }
  .trust-bar-grid > div + div { border: 0; }
  .trust-stat-number { font-size: 24px; }
  .trust-stat-label { font-size: 10px; }
  .tipos, .como-funciona, .datos, .tests-section, .guias-section, .testimonios, .formulario-section, .emergencia { padding: 58px 0; }
  .section-header h2 { font-size: 27px; }
  .section-header p { font-size: 14px; }
  .section-header { margin-bottom: 30px; }
  .tipo-card { padding: 24px; }
  .guia-card { padding: 24px 0; }
  .datos-grid { grid-template-columns: 1fr; }
  .dato-number { font-size: 38px; }
  .formulario { padding: 25px 21px; }
  .form-info h2 { font-size: 29px; }
  .cta-section h2 { font-size: 27px; }
  .testimonio { padding: 25px 0; }
  .footer-links { flex-direction: row; flex-wrap: wrap; gap: 18px; }
  #verTodasBtn { min-width: 0; width: 100%; padding-inline: 12px; font-size: 13px; }
  .guia-table { font-size: 11px; }
  .guia-table th, .guia-table td { padding: 9px 6px; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}