/* Webidea — landing v2. Estilos base + estados (hover/focus) extraídos del diseño. */
:root { color-scheme: light; }
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0; background: #F6F7FB; color: #0B1020;
  font-family: Manrope, system-ui, -apple-system, sans-serif;
  -webkit-font-smoothing: antialiased;
}
a { color: #185DF5; text-decoration: none; }
h1, h2, h3 { font-family: Sora, system-ui, sans-serif; margin: 0; letter-spacing: -0.02em; text-wrap: balance; }
p { text-wrap: pretty; }
img, svg { max-width: 100%; }
[hidden] { display: none !important; }

@keyframes wi-float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-10px); } }

/* Transiciones suaves para los estados de abajo. */
a, button, select, input, .hv7, .hv8, .hv9, .hv10, .hv11 {
  transition: background-color .18s ease, border-color .18s ease, color .18s ease,
              box-shadow .18s ease, transform .18s ease;
}

/* Foco visible en todo lo enfocable (el diseño no lo traía). */
a:focus-visible, button:focus-visible, select:focus-visible, input:focus-visible {
  outline: 2px solid #185DF5; outline-offset: 3px;
}
section[style*="#0B1020"] a:focus-visible, footer a:focus-visible { outline-color: #A4F0E8; }

/* --- estados extraídos del export (style-hover / style-focus) --- */
.hv1:hover { color:#0B1020; }
.hv2:hover { color:#0B1020; }
.hv3:hover { color:#0B1020; }
.hv4:hover { background:#0039BE; color:#fff; }
.hv5:hover { background:#3B6EF1; color:#fff; }
.hv6:hover { background:rgba(255,255,255,0.08); color:#fff; }
.hv7:hover { border-color:#185DF5; box-shadow:0 18px 40px rgba(11,16,32,0.09); transform:translateY(-3px); }
.hv8:hover { border-color:#185DF5; box-shadow:0 18px 40px rgba(11,16,32,0.09); transform:translateY(-3px); }
.hv9:hover { border-color:#185DF5; box-shadow:0 18px 40px rgba(11,16,32,0.09); transform:translateY(-3px); }
.hv10:hover { border-color:#185DF5; box-shadow:0 18px 40px rgba(11,16,32,0.09); transform:translateY(-3px); }
.hv11:hover { border-color:#185DF5; box-shadow:0 18px 40px rgba(11,16,32,0.09); transform:translateY(-3px); }
.hv12:hover { background:#41E3D3; color:#06221F; }
.hv13:hover { background:#F2F4FA; }
.hv14:hover { background:rgba(255,255,255,0.08); color:#fff; }
.hv15:hover { background:#0039BE; }
.hv16:hover { color:#FFFFFF; }
.fc1:focus { border-color:#185DF5; box-shadow:0 0 0 3px rgba(24,93,245,0.15); }
.fc2:focus { border-color:#185DF5; box-shadow:0 0 0 3px rgba(24,93,245,0.15); }
.fc3:focus { border-color:#185DF5; }

/* El acordeón: la fila completa es el objetivo táctil. */
#preguntas button { min-height: 56px; }

/* Móvil: el nav de texto no cabe junto al logo y el botón. */
@media (max-width: 720px) {
  header nav { display: none !important; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .001ms !important; animation-iteration-count: 1 !important; transition-duration: .001ms !important; }
}
