/* ============================================================
   INDEX — OVERRIDES
   Estilos exclusivos de index.php — no cargar en otras páginas
   ============================================================ */

body {
    background: var(--cream);
}

/* Ornament dark variant — para fondos claros */
.ornament--dark span {
    background: rgba(76, 0, 0, 0.22);
}
.ornament--dark .ornament-icon-svg {
    color: var(--guinda);
}

/* Galería: espacio inferior antes de regalos */
#galeria.galeria-section {
    padding-bottom: 60px;
}

/* Regalos: fondo cream oscuro y padding reducido */
#regalos.gifts-section {
    position: relative;
    padding-top: 60px;
    background: #ece4d6;
}
#regalos.gifts-section::before {
    content: none;
}
#regalos.gifts-section > .container {
    position: relative;
    z-index: 1;
}

/* RSVP home: sección sin tarjeta */
#rsvp.rsvp-section--home .sec-header {
    margin-bottom: 28px;
}
#rsvp.rsvp-section--home {
    padding-top: 84px;
    padding-bottom: 56px;
    margin-bottom: 24px;
}
@media (max-width: 768px) {
    #rsvp.rsvp-section--home {
        padding-top: 64px;
    }
}
#rsvp .rsvp-index-cta {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 28px;
    padding: 0 0 56px;
}
#rsvp .rsvp-index-cta .rsvp-intro {
    max-width: 480px;
    font-size: 15px;
    line-height: 1.8;
    color: var(--gray);
}
#rsvp .rsvp-index-cta .btn {
    min-width: 220px;
    justify-content: center;
    text-align: center;
}

/* Hoteles: botón full-width en tarjeta con un solo CTA */
.hotel-actions--single {
    display: flex;
    justify-content: center;
}

.hotel-actions--single .btn-hotel {
    display: flex;
    width: min(100%, 320px);
}

/* Extra-small screens: keep itinerary content away from edges */
@media (max-width: 420px) {
    .timeline-section .container {
        padding: 0 16px;
    }

    .tl-item {
        padding-left: 58px;
    }

    .tl-card {
        padding: 20px 16px;
    }

    .tl-row {
        padding: 12px;
    }

    .tl-title {
        font-size: 26px;
    }

    #rsvp.rsvp-section--home .sec-header h2 {
        font-size: clamp(1.9rem, 9vw, 2.35rem);
        line-height: 1.12;
        letter-spacing: 0.01em;
    }
}