@charset "UTF-8";

/* Keep the three original section trails and the itinerary heading accent. */
.scroll-paw-trail,
.hero-mobile-paw-trail {
    --paw-duration: 4.6s;
    --paw-peak: .65;
    --paw-rest: .22;
}
.hero-mobile-paw-trail { display: none; }
.scroll-paw-trail {
    position: absolute;
    bottom: -60px;
    right: 0;
    display: block;
    width: 210px;
    height: 56px;
    fill: var(--green-2);
    pointer-events: none;
    user-select: none;
}
.itinerary .itinerary-heading[data-paw-trail] { margin-bottom: 60px; }
section[data-paw-trail] { position: relative; }
section[data-paw-trail] > .scroll-paw-trail {
    left: max(32px, calc((100% - 1180px) / 2));
    right: auto;
    bottom: 20px;
    width: 180px;
    height: 56px;
}
section[data-paw-trail="right"] > .scroll-paw-trail {
    left: auto;
    right: max(32px, calc((100% - 1180px) / 2));
}
section[data-paw-trail="center"] > .scroll-paw-trail { left: calc(50% - 90px); }
@media (max-width: 920px) {
    section[data-paw-trail] > .scroll-paw-trail { bottom: 12px; width: 154px; height: 48px; }
    section[data-paw-trail="center"] > .scroll-paw-trail { left: calc(50% - 77px); }
}
.scroll-paw-print {
    opacity: 0;
    transform-box: fill-box;
    transform-origin: center;
}
.scroll-paw-trail.is-static .scroll-paw-print { opacity: var(--paw-rest); }
.scroll-paw-trail.is-playing .scroll-paw-print {
    animation: scroll-paw-arrival var(--paw-duration) ease-in-out both;
    animation-delay: var(--step-delay);
}
@keyframes scroll-paw-arrival {
    0% { opacity: 0; transform: translateY(-3px) scale(.88); }
    12%, 60% { opacity: var(--paw-peak); transform: translateY(0) scale(1); }
    100% { opacity: var(--paw-rest); transform: translateY(0) scale(1); }
}
@media (max-width: 767px) {
    .scroll-paw-trail,
    .hero-mobile-paw-trail { --paw-duration: 4.6s; --paw-peak: .52; --paw-rest: .22; }
    .scroll-paw-trail { bottom: -60px; height: 52px; width: 180px; }
    section[data-paw-trail] > .scroll-paw-trail { left: 16px; right: auto; bottom: 6px; width: 168px; height: 52px; }
    section[data-paw-trail="right"] > .scroll-paw-trail { left: auto; right: 16px; }
    section[data-paw-trail="center"] > .scroll-paw-trail { left: calc(50% - 84px); }
    /* A separate mobile motif fits beside the small English title, not over the photo. */
    .hero-v3 .hero-top-eyebrow { position: relative; inset: auto; }
    .hero-mobile-paw-trail {
        display: block;
        position: absolute;
        top: 50%;
        right: 0;
        width: min(46%, 150px);
        height: 46px;
        transform: translateY(-50%);
        fill: var(--hero-green);
        pointer-events: none;
        user-select: none;
    }
    .hero-v3.is-ready .hero-mobile-paw-trail.is-playing .scroll-paw-print {
        animation: scroll-paw-arrival var(--paw-duration) ease-in-out both;
        animation-delay: calc(.35s + var(--step-delay));
    }
    .scroll-paw-trail.is-static .scroll-paw-print,
    .hero-mobile-paw-trail.is-static .scroll-paw-print { opacity: .22; }
}
@media (prefers-reduced-motion: reduce) {
    .scroll-paw-trail .scroll-paw-print { animation: none; opacity: .16; }
}
@media (max-width: 767px) and (prefers-reduced-motion: reduce) {
    .scroll-paw-trail { display: block; }
    .scroll-paw-trail .scroll-paw-print,
    .hero-v3 .hero-mobile-paw-trail .scroll-paw-print { animation: none; opacity: .22; transform: none; }
}

.floating-contact { overflow: visible; }
@media (max-width: 640px) {
    .floating-contact {
        display: flex;
        right: 14px;
        bottom: max(14px, env(safe-area-inset-bottom));
        min-width: 144px;
        min-height: 48px;
        gap: 16px;
        padding: 12px 16px;
        border-radius: 10px;
        font-size: 14px;
    }
}
