/* ==========================================================================
   1860 motion layer
   Shared animations for the public site: promo popup enter/exit, scroll
   reveal, card hover lift and button press feedback. Everything that hides
   content (reveal) is opt-in via classes that 1860-motion.js adds, so with
   JS off nothing is ever left invisible. All of it is switched off for
   visitors who ask for reduced motion.
   ========================================================================== */

:root {
    --t-ease-out: cubic-bezier(0.22, 1, 0.36, 1);
    --t-ease-in: cubic-bezier(0.55, 0, 0.75, 0.06);
}

/* ---------- Promo popups (#pageLoadPopup, #adventureModal) ---------- */

.t-pop {
    opacity: 0;
    transition: opacity 0.32s var(--t-ease-out);
}
.t-pop.t-pop-in { opacity: 1; }
.t-pop.t-pop-out {
    opacity: 0;
    transition: opacity 0.22s var(--t-ease-in);
}

/* Replace the old per-page keyframes with one consistent motion. */
.t-pop .popup-content,
.t-pop .adventure-modal-content {
    animation: none;
    transform: translateY(24px) scale(0.96);
    opacity: 0;
    transition: transform 0.45s var(--t-ease-out), opacity 0.35s var(--t-ease-out);
    will-change: transform, opacity;
}
.t-pop.t-pop-in .popup-content,
.t-pop.t-pop-in .adventure-modal-content {
    transform: none;
    opacity: 1;
}
.t-pop.t-pop-out .popup-content,
.t-pop.t-pop-out .adventure-modal-content {
    transform: translateY(12px) scale(0.98);
    opacity: 0;
    transition-duration: 0.2s;
    transition-timing-function: var(--t-ease-in);
}
.t-pop.adventure-modal { animation: none; }

/* Text side slides in just after the card lands. */
.t-pop .popup-text > *,
.t-pop .adventure-modal-body > * {
    opacity: 0;
    transform: translateY(10px);
    transition: opacity 0.4s var(--t-ease-out), transform 0.4s var(--t-ease-out);
}
.t-pop.t-pop-in .popup-text > *,
.t-pop.t-pop-in .adventure-modal-body > * {
    opacity: 1;
    transform: none;
}
.t-pop.t-pop-in .popup-text > :nth-child(2),
.t-pop.t-pop-in .adventure-modal-body > :nth-child(2) { transition-delay: 0.12s; }
.t-pop.t-pop-in .popup-text > :nth-child(3),
.t-pop.t-pop-in .adventure-modal-body > :nth-child(3) { transition-delay: 0.18s; }
.t-pop.t-pop-in .popup-text > :nth-child(4),
.t-pop.t-pop-in .adventure-modal-body > :nth-child(4) { transition-delay: 0.24s; }
.t-pop.t-pop-in .popup-text > :nth-child(n+5),
.t-pop.t-pop-in .adventure-modal-body > :nth-child(n+5) { transition-delay: 0.3s; }

/* Slow Ken Burns drift on the promo photo while it is open. */
.t-pop .popup-image img,
.t-pop .adventure-modal-img img,
.t-pop .popup-only-image {
    transform: scale(1.08);
    transition: transform 6s ease-out;
}
.t-pop.t-pop-in .popup-image img,
.t-pop.t-pop-in .adventure-modal-img img,
.t-pop.t-pop-in .popup-only-image { transform: scale(1); }

.t-pop .read-more-btn,
.t-pop .adventure-btn {
    transition: transform 0.2s var(--t-ease-out), box-shadow 0.2s var(--t-ease-out), background-color 0.2s;
}
.t-pop .read-more-btn:hover,
.t-pop .adventure-btn:hover { transform: translateY(-2px); }

/* Stop the page behind the popup from scrolling. */
html.t-pop-lock, html.t-pop-lock body { overflow: hidden !important; }

/* ---------- Scroll reveal ---------- */

.t-reveal {
    opacity: 0;
    transform: translateY(28px);
    transition: opacity 0.7s var(--t-ease-out), transform 0.7s var(--t-ease-out);
    transition-delay: var(--t-reveal-delay, 0s);
}
.t-reveal.t-reveal-in {
    opacity: 1;
    transform: none;
}

/* ---------- Cards: hover lift ---------- */

.tour-card,
.top-deal-card,
.td-item-exact,
.card-grid > * {
    transition: transform 0.35s var(--t-ease-out), box-shadow 0.35s var(--t-ease-out);
}
@media (hover: hover) {
    .tour-card:hover,
    .top-deal-card:hover,
    .td-item-exact:hover,
    .card-grid > *:hover {
        transform: translateY(-6px);
        box-shadow: 0 18px 36px -14px rgba(15, 23, 42, 0.28);
    }
    /* Reveal sets its own transform; hover must still win once revealed. */
    .t-reveal.t-reveal-in.tour-card:hover,
    .t-reveal.t-reveal-in.top-deal-card:hover,
    .t-reveal.t-reveal-in.td-item-exact:hover,
    .card-grid > .t-reveal.t-reveal-in:hover { transform: translateY(-6px); }

    .tour-card-image img,
    .td-image-exact img,
    .top-deal-card img {
        transition: transform 0.6s var(--t-ease-out);
    }
    .tour-card:hover .tour-card-image img,
    .td-item-exact:hover .td-image-exact img,
    .top-deal-card:hover img { transform: scale(1.05); }
}

/* ---------- Buttons: tactile press ---------- */

.btn,
.read-more-btn,
.adventure-btn,
button[type="submit"] {
    transition: transform 0.15s var(--t-ease-out), box-shadow 0.2s, background-color 0.2s, color 0.2s, border-color 0.2s;
}
.btn:active,
.read-more-btn:active,
.adventure-btn:active,
button[type="submit"]:active { transform: scale(0.97); }

/* ---------- Reduced motion: no movement, content shown immediately ---------- */

@media (prefers-reduced-motion: reduce) {
    .t-pop,
    .t-pop .popup-content,
    .t-pop .adventure-modal-content,
    .t-pop .popup-text > *,
    .t-pop .adventure-modal-body > *,
    .t-pop .popup-image img,
    .t-pop .adventure-modal-img img,
    .t-pop .popup-only-image,
    .t-reveal {
        transition: opacity 0.01s !important;
        transform: none !important;
    }
    .t-reveal { opacity: 1 !important; }
    .tour-card:hover, .top-deal-card:hover, .td-item-exact:hover, .card-grid > *:hover,
    .tour-card:hover .tour-card-image img, .td-item-exact:hover .td-image-exact img, .top-deal-card:hover img,
    .btn:active, .read-more-btn:active, .adventure-btn:active, button[type="submit"]:active {
        transform: none !important;
    }
}
