/* ==========================================================================
   HOME.CSS — Homepage-specific styles pre stellasirava.sk
   Enhanced version
   ========================================================================== */

/* === SECTIONS WITH ALTERNATE BACKGROUNDS === */

.section-alt {
    background-color: var(--bg-secondary);
}

/* === GALLERY PREVIEW GRID (3 cols desktop, 1 col mobile) === */

.gallery-preview-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-4);
}

/* Staggered animation for gallery grid items */
.gallery-preview-grid .gallery-preview-item {
    opacity: 0;
    transform: scale(0.9);
    transition: opacity 0.6s var(--ease-out-expo), transform 0.6s var(--ease-out-expo);
}

.gallery-preview-grid.is-visible .gallery-preview-item:nth-child(1) { transition-delay: 0ms; opacity: 1; transform: scale(1); }
.gallery-preview-grid.is-visible .gallery-preview-item:nth-child(2) { transition-delay: 80ms; opacity: 1; transform: scale(1); }
.gallery-preview-grid.is-visible .gallery-preview-item:nth-child(3) { transition-delay: 160ms; opacity: 1; transform: scale(1); }

@media (max-width: 767px) {
    .gallery-preview-grid {
        grid-template-columns: 1fr;
    }
}

/* === SECTION CENTER BUTTON === */

.section-cta-center {
    text-align: center;
    margin-top: var(--space-10);
}

.section-cta-center .btn svg {
    margin-left: 4px;
}

/* === REVIEWS SECTION — horizontal divider between cards === */

.review-card + .review-card {
    position: relative;
}

/* === WEATHER SECTION — subtle animation === */

#pocasie .section-title {
    margin-bottom: var(--space-8);
}