/* Capa compartida de legibilidad para las landing sectoriales. */

html,
body {
  overflow-x: clip;
}

.section-sub {
  max-width: 720px;
  font-size: clamp(1.075rem, 1.6vw, 1.25rem) !important;
  line-height: 1.72 !important;
}

.hero-sub,
.hero-copy,
.hero-description {
  font-size: clamp(1.1rem, 1.5vw, 1.3rem) !important;
  line-height: 1.65 !important;
}

.eyebrow,
.auto-chip,
.hero-kicker,
.sc-num {
  font-size: 0.875rem !important;
  line-height: 1.4 !important;
}

.select-card {
  padding: 28px !important;
}

.select-card h3 {
  font-size: 1.25rem !important;
  line-height: 1.35 !important;
}

.select-card p {
  font-size: 1.05rem !important;
  line-height: 1.65 !important;
}

.sc-link {
  font-size: 0.975rem !important;
  line-height: 1.4 !important;
}

.auto-head h2 {
  line-height: 1.12 !important;
  text-wrap: balance;
}

.auto-pain {
  max-width: 760px;
  font-size: clamp(1.075rem, 1.5vw, 1.2rem) !important;
  line-height: 1.72 !important;
}

.auto-sub {
  font-size: 1.25rem !important;
  line-height: 1.35 !important;
}

.flow p {
  font-size: 1.0625rem !important;
  line-height: 1.68 !important;
}

.flow p b {
  margin-bottom: 4px;
  font-size: 1.125rem !important;
  line-height: 1.4 !important;
}

.mini-checks li {
  font-size: 1rem !important;
  line-height: 1.55 !important;
}

.chat-header .name {
  font-size: 1.025rem !important;
}

.chat-header .status {
  font-size: 0.825rem !important;
}

.msg {
  font-size: 0.975rem !important;
  line-height: 1.55 !important;
}

.msg-btn,
.msg-file .mf-name,
.msg-alert b,
.msg-media .mm-label b {
  font-size: 0.925rem !important;
}

.msg-file .mf-meta,
.msg-audio .dur {
  font-size: 0.8rem !important;
}

.r-big {
  font-size: clamp(1.2rem, 2vw, 1.5rem) !important;
  line-height: 1.3 !important;
}

.result p {
  font-size: 1rem !important;
  line-height: 1.6 !important;
}

.hero-stat .stat-label,
.hero-stats .stat-label,
.hero-metric .metric-label {
  font-size: 0.975rem !important;
  line-height: 1.4 !important;
}

.hero-cta-note,
.hero-note,
.rail-text,
.railbar a {
  font-size: 0.875rem !important;
}

.cta-final .section-sub {
  max-width: 760px !important;
}

@media (max-width: 767px) {
  .hero-home {
    top: calc(140px + env(safe-area-inset-top)) !important;
    left: max(16px, env(safe-area-inset-left)) !important;
    width: 44px !important;
    height: 44px !important;
    z-index: 55 !important;
    touch-action: manipulation;
  }
}

@media (max-width: 767px) and (orientation: landscape) {
  .hero-home {
    top: calc(16px + env(safe-area-inset-top)) !important;
  }
}

@media (max-width: 640px) {
  body:not(.masajes-page) .hero-title {
    font-size: clamp(3rem, 16vw, 5.25rem) !important;
  }

  .hero-cta-wrap {
    width: min(100% - 112px, 340px);
  }

  .hero-cta {
    width: 100%;
    max-width: 340px;
    padding-inline: 18px !important;
    text-align: center;
  }

  .hero-cta-note {
    max-width: 100%;
    white-space: normal !important;
    text-wrap: balance;
  }

  .railbar {
    scroll-padding-inline: 14px;
    scroll-snap-type: x proximity;
    overscroll-behavior-inline: contain;
  }

  .railbar a {
    min-height: 44px;
    scroll-snap-align: start;
  }

  .container {
    width: 100%;
    padding-inline: 20px !important;
  }

  .selector,
  .auto-section,
  .cta-final {
    min-height: auto !important;
    padding-block: 76px !important;
  }

  .selector-head h2,
  .auto-head h2,
  .cta-final h2 {
    font-size: clamp(2rem, 9vw, 2.75rem) !important;
    line-height: 1.08 !important;
    overflow-wrap: anywhere;
  }

  .section-sub,
  .auto-pain {
    font-size: 1.1rem !important;
    line-height: 1.7 !important;
  }

  .select-grid {
    grid-template-columns: 1fr !important;
    gap: 16px !important;
  }

  .select-card {
    min-height: auto !important;
    padding: 24px !important;
    border-radius: 20px !important;
  }

  .select-card h3 {
    font-size: 1.25rem !important;
  }

  .select-card p {
    font-size: 1.0625rem !important;
  }

  .auto-body,
  .auto-body.rev {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 34px !important;
  }

  .auto-info,
  .auto-demo,
  .chat {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
  }

  .flow p {
    font-size: 1.0625rem !important;
  }

  .mini-checks {
    grid-template-columns: 1fr !important;
  }

  .mini-checks li {
    font-size: 1.025rem !important;
  }

  .msg {
    max-width: 92% !important;
    font-size: 1rem !important;
  }

  .auto-results {
    grid-template-columns: 1fr !important;
    gap: 14px !important;
  }

  .result {
    padding: 22px !important;
  }

  .result p {
    font-size: 1.025rem !important;
  }

  .hero-cta,
  .btn {
    min-height: 52px;
    font-size: 1rem !important;
  }

  footer p {
    font-size: 0.9375rem !important;
    line-height: 1.55 !important;
  }

  footer a {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
  }
}