/* Fase 2: evidencia de campo, interacción precisa y detalles de acabado. */
html {
  scroll-behavior: smooth;
  scroll-padding-top: 100px;
  scrollbar-color: #1689b7 rgba(7, 42, 66, .18);
}

::selection { color: #f7feff; background: #0879bd; }
::-moz-selection { color: #f7feff; background: #0879bd; }
::-webkit-scrollbar { width: 11px; height: 11px; }
::-webkit-scrollbar-track { background: rgba(6, 38, 61, .08); }
::-webkit-scrollbar-thumb { border: 3px solid transparent; border-radius: 999px; background: #1588b4; background-clip: padding-box; }
::-webkit-scrollbar-thumb:hover { background: #0e9fc4; background-clip: padding-box; }

/* Una pausa visual de evidencia: la fotografía se mueve apenas en escritorio,
   mientras el contenido se mantiene completamente convencional en móvil. */
.impact-panel {
  --impact-shift: 0px;
  position: relative;
  isolation: isolate;
  display: grid;
  min-height: clamp(470px, 47vw, 590px);
  overflow: hidden;
  color: #f4fdff;
  background: #062b48;
}

.impact-media,
.impact-media img,
.impact-wash { position: absolute; inset: 0; }
.impact-media { z-index: -2; margin: 0; }
.impact-media img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 54%;
  transform: translate3d(0, var(--impact-shift), 0) scale(1.075);
  transition: transform 90ms linear;
  will-change: transform;
}

.impact-wash {
  z-index: -1;
  background:
    linear-gradient(90deg, rgba(3, 26, 46, .94) 0%, rgba(4, 39, 63, .82) 44%, rgba(2, 31, 48, .42) 100%),
    linear-gradient(135deg, rgba(0, 145, 193, .26), transparent 48%);
}

.impact-content {
  position: relative;
  width: min(100% - 40px, 1120px);
  padding: clamp(66px, 8vw, 104px) 0;
}

.impact-eyebrow { color: #7be9e3 !important; }
.impact-content h2 {
  max-width: 15ch;
  margin: 12px 0 17px;
  color: #f7feff;
  font-size: clamp(2.3rem, 4.4vw, 4.4rem);
  line-height: .99;
  letter-spacing: -.045em;
}

.impact-copy {
  max-width: 57ch;
  margin: 0;
  color: #c4e1eb;
  font-size: clamp(1rem, 1.38vw, 1.13rem);
  line-height: 1.65;
}

.impact-stats {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  max-width: 720px;
  margin: clamp(30px, 4vw, 42px) 0 28px;
}

.impact-stat {
  min-height: 112px;
  padding: 17px 18px 16px;
  border: 1px solid rgba(170, 240, 239, .26);
  border-radius: var(--sinbio-radius-sm);
  background: rgba(2, 34, 55, .38);
  box-shadow: inset 0 1px rgba(255, 255, 255, .08), 0 10px 26px rgba(0, 16, 29, .15);
  backdrop-filter: blur(7px);
}

.impact-stat strong,
.impact-stat span { display: block; }
.impact-stat strong {
  color: #f4ffff;
  font-size: clamp(1.75rem, 3vw, 2.55rem);
  line-height: 1;
  letter-spacing: -.04em;
}
.impact-stat strong span { display: inline; color: #73ded4; }
.impact-stat > span {
  margin-top: 8px;
  color: #c3e6ed;
  font-size: .78rem;
  font-weight: 760;
  line-height: 1.25;
}
.impact-stat-coverage strong { font-size: clamp(1.45rem, 2.2vw, 2rem); letter-spacing: -.025em; }

.impact-cta { box-shadow: 0 12px 25px rgba(0, 8, 18, .2); }
.impact-cta:hover,
.impact-cta:focus-visible { transform: translateY(-2px); box-shadow: 0 17px 31px rgba(0, 8, 18, .28); }

/* Detalles que apoyan lectura y respuesta sin cambiar la estructura existente. */
.contact-form :is(input, select, textarea) {
  transition: border-color var(--sinbio-motion), box-shadow var(--sinbio-motion), background-color var(--sinbio-motion);
}
.contact-form :is(input, select, textarea):focus {
  border-color: #1bb6d0 !important;
  outline: 3px solid rgba(49, 203, 215, .18);
  outline-offset: 1px;
  box-shadow: 0 0 0 4px rgba(7, 117, 168, .1);
}

main :is(.article, .service-section, .faq-section) :is(p, li) > a:not(.btn) {
  color: #078bc0;
  font-weight: 720;
  text-decoration-color: rgba(7, 139, 192, .35);
  text-underline-offset: .18em;
  transition: color var(--sinbio-motion), text-decoration-color var(--sinbio-motion);
}
main :is(.article, .service-section, .faq-section) :is(p, li) > a:not(.btn):hover {
  color: #00a6bd;
  text-decoration-color: currentColor;
}

html[data-theme="dark"] ::selection { color: #061e31; background: #79e6df; }
html[data-theme="dark"] ::-webkit-scrollbar-track { background: rgba(196, 239, 248, .08); }
html[data-theme="dark"] ::-webkit-scrollbar-thumb { background: #4bc9cb; background-clip: padding-box; }
html[data-theme="dark"] main :is(.article, .service-section, .faq-section) :is(p, li) > a:not(.btn) { color: #7fe8eb; }

@media (max-width: 760px) {
  html { scroll-padding-top: 78px; }
  .impact-panel { min-height: 0; }
  .impact-media img { object-position: 57% center; transform: none; will-change: auto; }
  .impact-wash { background: linear-gradient(180deg, rgba(3, 28, 48, .82) 0%, rgba(3, 32, 54, .94) 76%, rgba(2, 27, 46, .98) 100%); }
  .impact-content { width: min(100% - 36px, 560px); padding: 62px 0 54px; }
  .impact-content h2 { max-width: 13ch; font-size: clamp(2.15rem, 10.6vw, 3.1rem); }
  .impact-copy { font-size: 1rem; }
  .impact-stats { grid-template-columns: 1fr; gap: 9px; margin: 28px 0 25px; }
  .impact-stat { display: grid; grid-template-columns: minmax(92px, .55fr) 1fr; align-items: center; min-height: 0; padding: 13px 15px; }
  .impact-stat > span { margin: 0; font-size: .8rem; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .impact-media img { transform: none; transition: none; will-change: auto; }
  .impact-cta { transition: none; }
}