/* =====================================================================
   EVENTOS DE EMPRESA — eventos-empresa.php (includes/eventos_empresa.php).
   La cabecera, los bloques y las tarjetas son los de portada.css.
   ===================================================================== */

/* ----- Cómo funciona ----- */
.pasos-evento { display: grid; gap: 12px; max-width: 720px; margin: 0; padding: 0; list-style: none; counter-reset: paso; }
.pasos-evento li { position: relative; padding-left: 40px; color: var(--texto-suave); counter-increment: paso; }
.pasos-evento li::before {
    content: counter(paso);
    position: absolute;
    top: 0;
    left: 0;
    display: grid;
    place-items: center;
    width: 26px;
    height: 26px;
    border: 1px solid var(--borde-fuerte);
    border-radius: 50%;
    color: var(--acento);
    font-size: .8rem;
    font-weight: 600;
}
.pasos-evento strong { color: var(--texto); }

/* ----- Pide presupuesto ----- */
/* Con #presupuesto en la URL (botón de arriba o vuelta con errores) el
   bloque se pinta ya, para que el salto llegue justo a él. */
.evento-presupuesto { max-width: 760px; content-visibility: visible; }
.evento-presupuesto__form { margin-top: 20px; }
.evento-presupuesto__rejilla { display: grid; gap: 0 16px; }
@media (min-width: 560px) {
    .evento-presupuesto__rejilla { grid-template-columns: 1fr 1fr; }
}
/* Safari en iOS encoge la fecha vacía: la altura de los desplegables. */
.evento-presupuesto .campo input[type="date"] { min-height: 3em; }
.campo [aria-invalid="true"] { border-color: var(--error); }
.campo__error { margin: 6px 0 0; color: var(--error); font-size: .8125rem; }