/* Journey cards: the entry point to OutLaw, styled as worn frontier photographs. */
.home-journey {
    width: min(1080px, calc(100% - 48px)) !important;
    padding: 68px 0 78px !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}

.home-journey-top {
    display: flex !important;
    align-items: end !important;
    justify-content: space-between !important;
    gap: 36px !important;
    margin-bottom: 40px !important;
}

.home-journey .home-briefing-header {
    max-width: 640px !important;
    margin: 0 !important;
}

.home-journey .home-eyebrow {
    margin-bottom: 12px !important;
    color: #d39752 !important;
    font-family: 'Rye', Georgia, serif !important;
    font-size: 11px !important;
    letter-spacing: .12em !important;
}

.home-journey h2 {
    margin: 0 !important;
    color: #f2e4cf !important;
    font-family: 'Rye', Georgia, serif !important;
    font-size: clamp(37px, 4.2vw, 59px) !important;
    font-weight: 400 !important;
    letter-spacing: .015em !important;
    line-height: .98 !important;
    text-shadow: 2px 2px 0 rgba(0,0,0,.32) !important;
}

.home-journey .home-briefing-header > p:last-child {
    max-width: 560px !important;
    margin: 19px 0 0 !important;
    color: #c9b9a3 !important;
    font-family: Georgia, serif !important;
    font-size: 16px !important;
    line-height: 1.6 !important;
}

.home-community {
    min-width: 360px !important;
    padding: 14px 0 0 !important;
    border-top: 1px solid rgba(222,183,127,.55) !important;
}

.home-community > p {
    margin: 0 0 11px !important;
    color: #d39752 !important;
    font-family: 'Rye', Georgia, serif !important;
    font-size: 11px !important;
    letter-spacing: .12em !important;
    text-transform: uppercase !important;
}

.home-community-stats {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 21px !important;
}

.home-community-stats a {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    color: #f0dfc6 !important;
    text-decoration: none !important;
}

.home-community-stats > a > i {
    color: #d39752 !important;
    font-size: 21px !important;
}

.home-community-stats small,
.home-community-stats strong {
    display: block !important;
}

.home-community-stats small {
    color: #a89780 !important;
    font-family: Georgia, serif !important;
    font-size: 12px !important;
}

.home-community-stats strong {
    margin-top: 2px !important;
    color: #f6ead8 !important;
    font-family: 'Rye', Georgia, serif !important;
    font-size: 23px !important;
    font-weight: 400 !important;
    letter-spacing: .03em !important;
}

.home-journey .home-steps {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: clamp(22px, 4vw, 48px) !important;
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
}

.home-journey .home-step {
    min-width: 0 !important;
    min-height: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}

.home-journey .home-step::before {
    display: none !important;
}

.home-journey .home-step > a {
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    color: inherit !important;
    border: 0 !important;
    text-decoration: none !important;
    white-space: normal !important;
    text-align: left !important;
}

.home-step-image {
    display: block !important;
    width: 94% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    aspect-ratio: 10 / 11 !important;
    margin: 0 auto 22px !important;
    overflow: hidden !important;
    background: #1b1412 !important;
}

.home-step-image img {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center !important;
    filter: saturate(.94) contrast(1.04) !important;
    transition: transform .5s ease, filter .5s ease !important;
}

.home-step > a:hover .home-step-image img,
.home-step > a:focus-visible .home-step-image img {
    filter: saturate(1.08) contrast(1.07) !important;
    transform: scale(1.035) !important;
}

.home-journey .home-step strong {
    display: block !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    color: #d39752 !important;
    border: 0 !important;
    font-family: 'Rye', Georgia, serif !important;
    font-size: 11px !important;
    letter-spacing: .1em !important;
}

.home-journey .home-step h3 {
    margin: 12px 0 15px !important;
    color: #f5e8d6 !important;
    font-family: 'Rye', Georgia, serif !important;
    font-size: clamp(25px, 2.35vw, 34px) !important;
    font-weight: 400 !important;
    letter-spacing: .025em !important;
    line-height: 1 !important;
    text-shadow: none !important;
}

.home-journey .home-step p {
    max-width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    color: #c6b5a0 !important;
    font-family: Georgia, serif !important;
    font-size: 15px !important;
    line-height: 1.58 !important;
    white-space: normal !important;
    overflow-wrap: anywhere !important;
}

.home-step-link {
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
    margin-top: 19px !important;
    padding-bottom: 7px !important;
    color: #e1ad6c !important;
    border-bottom: 1px solid rgba(225,173,108,.7) !important;
    font-family: 'Rye', Georgia, serif !important;
    font-size: 11px !important;
    letter-spacing: .07em !important;
    text-transform: uppercase !important;
}

@media (max-width: 900px) {
    .home-journey {
        width: min(100% - 32px, 760px) !important;
    }

    .home-journey-top {
        display: block !important;
        margin-bottom: 39px !important;
    }

    .home-community {
        min-width: 0 !important;
        max-width: 460px !important;
        margin-top: 31px !important;
    }

    .home-journey .home-steps {
        gap: 36px !important;
    }
}

@media (max-width: 650px) {
    .home-journey {
        width: min(100% - 30px, 470px) !important;
        padding: 62px 0 70px !important;
    }

    .home-journey .home-steps {
        grid-template-columns: 1fr !important;
        gap: 47px !important;
    }

    .home-step-image {
        aspect-ratio: 16 / 11 !important;
        margin-bottom: 22px !important;
    }

    .home-community-stats {
        gap: 14px !important;
    }
}

/* The mark enters the main OutLaw scene like an illuminated saloon sign. */
.outlaw-home-v2 .home-camp-center::before {
    position: relative !important;
    z-index: 1 !important;
    transform-origin: center bottom !important;
    will-change: transform, filter, opacity !important;
    animation: outlaw-hero-logo-drift 6.2s cubic-bezier(.22,.76,.28,1) infinite !important;
}

@keyframes outlaw-hero-logo-drift {
    0% {
        opacity: 0;
        transform: translateY(13px) scale(.9);
        filter: brightness(.72) saturate(.8) drop-shadow(0 4px 5px rgba(0,0,0,.42));
    }
    12% {
        opacity: 1;
        transform: translateY(0) scale(1);
        filter: brightness(1.05) saturate(1.08) drop-shadow(0 10px 13px rgba(0,0,0,.62));
    }
    48% {
        transform: translateY(-4px) scale(1.018);
        filter: brightness(1.12) saturate(1.17) drop-shadow(0 13px 17px rgba(0,0,0,.68));
    }
    76% {
        transform: translateY(1px) scale(.996);
        filter: brightness(1.04) saturate(1.09) drop-shadow(0 10px 13px rgba(0,0,0,.62));
    }
    100% {
        opacity: 1;
        transform: translateY(0) scale(1);
        filter: brightness(1.05) saturate(1.08) drop-shadow(0 10px 13px rgba(0,0,0,.62));
    }
}

@media (prefers-reduced-motion: reduce) {
    .outlaw-home-v2 .home-camp-center::before {
        animation: none !important;
        opacity: 1 !important;
        transform: none !important;
    }
}