@import url('https://fonts.googleapis.com/css2?family=Dancing+Script:wght@600&display=swap');

.nfs-home-intro {
    position: relative;
    width: min(820px, calc(100% - 40px));
    max-width: 820px !important;
    margin: 44px auto 54px !important;
    padding: 48px 48px 44px !important;
    overflow: hidden;
    color: #33423c;
    background:
        radial-gradient(circle at 88% 18%, rgba(217, 180, 91, .12) 0 4px, transparent 5px),
        radial-gradient(circle at 92% 25%, rgba(33, 134, 132, .13) 0 3px, transparent 4px),
        linear-gradient(145deg, #fff 0%, #fbf8f1 100%);
    border: 1px solid rgba(23, 63, 53, .15);
    border-radius: 24px;
    box-shadow: 0 18px 50px rgba(23, 63, 53, .08);
    box-sizing: border-box;
}

.nfs-home-intro::before {
    content: '';
    position: absolute;
    top: 0;
    left: 50%;
    width: 190px;
    height: 5px;
    border-radius: 0 0 6px 6px;
    background: linear-gradient(90deg, #218684 0 28%, #f0c94f 28% 50%, #d85f55 50% 72%, #5e9d68 72% 100%);
    transform: translateX(-50%);
}

.nfs-home-intro p {
    margin: 0;
}

.nfs-home-intro p:first-child {
    color: #173f35;
    font-family: "Dancing Script", "Segoe Script", "Bradley Hand", cursive;
    font-size: clamp(48px, 6vw, 68px);
    font-weight: 600;
    line-height: 1.02;
}

.nfs-home-intro p:nth-child(2) {
    max-width: 690px;
    margin: 21px auto 0;
    font-size: 18px;
    line-height: 1.72;
}

.nfs-home-intro p:last-child {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    margin: 25px auto 0;
    color: #427063;
    font-size: 15px;
    font-weight: 700;
    letter-spacing: .045em;
}

.nfs-home-intro p:last-child::before,
.nfs-home-intro p:last-child::after {
    content: '';
    width: 34px;
    height: 1px;
    background: #d9b45b;
}

.nfs-book-journey {
    --nfs-green: #173f35;
    --nfs-green-soft: #427063;
    --nfs-cream: #fbf8f1;
    --nfs-gold: #d9b45b;
    --nfs-card-width: clamp(150px, 18vw, 235px);
    margin: 20px auto 58px;
    padding: 46px 0 36px;
    overflow: hidden;
    color: #26332e;
    background: linear-gradient(180deg, #fff 0%, var(--nfs-cream) 48%, #fff 100%);
    border-top: 1px solid rgba(23, 63, 53, .14);
    border-bottom: 1px solid rgba(23, 63, 53, .14);
}

.nfs-book-journey *,
.nfs-book-journey *::before,
.nfs-book-journey *::after {
    box-sizing: border-box;
}

.nfs-book-journey__intro,
.nfs-book-journey__caption {
    width: min(760px, calc(100% - 40px));
    margin-inline: auto;
    text-align: center;
}

.nfs-book-journey__eyebrow {
    margin: 0 0 8px;
    color: var(--nfs-green-soft);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .18em;
    text-transform: uppercase;
}

.nfs-book-journey__intro h2 {
    margin: 0;
    color: var(--nfs-green);
    font-family: "Dancing Script", "Segoe Script", "Bradley Hand", cursive;
    font-size: clamp(42px, 5.2vw, 60px);
    font-weight: 600;
    line-height: 1.04;
}

.nfs-book-journey__intro > p:last-child {
    max-width: 620px;
    margin: 15px auto 0;
    color: #58645f;
    font-size: 16px;
    line-height: 1.6;
}

.nfs-book-journey__years {
    display: flex;
    gap: 8px;
    justify-content: center;
    margin: 24px auto 9px;
    padding: 0 20px 8px;
    overflow-x: auto;
    scrollbar-width: thin;
}

.nfs-book-journey__year {
    flex: 0 0 auto;
    min-width: 64px;
    padding: 7px 13px;
    color: var(--nfs-green);
    background: #fff;
    border: 1px solid rgba(23, 63, 53, .28);
    border-radius: 999px;
    font: 700 13px/1.1 inherit;
    cursor: pointer;
    transition: color .2s ease, background-color .2s ease, border-color .2s ease;
}

.nfs-book-journey__year:hover,
.nfs-book-journey__year:focus-visible,
.nfs-book-journey__year.is-active {
    color: #fff;
    background: var(--nfs-green);
    border-color: var(--nfs-green);
    outline: none;
}

.nfs-book-journey__stage {
    position: relative;
    width: min(1220px, 100%);
    margin: 0 auto;
}

.nfs-book-journey__viewport {
    width: 100%;
    padding: 32px 0 28px;
    overflow-x: auto;
    overflow-y: hidden;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
    touch-action: pan-x;
}

.nfs-book-journey__viewport::-webkit-scrollbar {
    display: none;
}

.nfs-book-journey__viewport:focus-visible {
    outline: 2px solid var(--nfs-gold);
    outline-offset: -5px;
}

.nfs-book-journey__track {
    display: flex;
    align-items: center;
    gap: clamp(14px, 2vw, 28px);
    width: max-content;
    padding-inline: calc(var(--nfs-stage-half, 50vw) - (var(--nfs-card-width) / 2));
}

.nfs-book-card {
    flex: 0 0 var(--nfs-card-width);
    width: var(--nfs-card-width);
    margin: 0;
    scroll-snap-align: center;
    cursor: pointer;
    opacity: var(--nfs-opacity, .52);
    transform: perspective(900px) translateY(var(--nfs-lift, 10px)) scale(var(--nfs-scale, .82)) rotateY(var(--nfs-rotate, 0deg));
    transform-origin: center center;
    transition: transform .24s ease, opacity .24s ease, filter .24s ease;
    filter: saturate(var(--nfs-saturation, .7));
}

.nfs-book-card img {
    display: block;
    width: 100%;
    aspect-ratio: 561 / 701;
    height: auto;
    object-fit: cover;
    border-radius: 14px;
    box-shadow: 0 16px 34px rgba(31, 42, 37, .18);
    user-select: none;
    -webkit-user-drag: none;
}

.nfs-book-card__link {
    display: block;
    border-radius: 14px;
}

.nfs-book-card__link:focus-visible {
    outline: 3px solid var(--nfs-gold);
    outline-offset: 5px;
}

.nfs-book-card__link--coming {
    cursor: default;
}

.nfs-book-card.is-active {
    z-index: 3;
    opacity: 1;
    filter: saturate(1);
}

.nfs-book-journey__arrow {
    position: absolute;
    top: 50%;
    z-index: 8;
    display: grid;
    place-items: center;
    width: 48px;
    height: 48px;
    padding: 0 0 4px;
    color: #fff;
    background: rgba(23, 63, 53, .92);
    border: 0;
    border-radius: 50%;
    box-shadow: 0 8px 20px rgba(23, 63, 53, .23);
    font: 300 42px/1 Georgia, serif;
    cursor: pointer;
    transform: translateY(-50%);
}

.nfs-book-journey__arrow:hover,
.nfs-book-journey__arrow:focus-visible {
    background: var(--nfs-green-soft);
    outline: 3px solid rgba(217, 180, 91, .55);
}

.nfs-book-journey__arrow:disabled {
    opacity: .25;
    cursor: default;
}

.nfs-book-journey__arrow--previous { left: max(12px, calc((100% - 1100px) / 2)); }
.nfs-book-journey__arrow--next { right: max(12px, calc((100% - 1100px) / 2)); }

.nfs-book-journey__caption {
    min-height: 98px;
    padding-top: 3px;
}

.nfs-book-journey__position {
    margin: 0 0 5px;
    color: var(--nfs-green-soft);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .12em;
    text-transform: uppercase;
}

.nfs-book-journey__book-title {
    margin: 0;
    color: var(--nfs-green);
    font-family: Georgia, "Times New Roman", serif;
    font-size: clamp(21px, 2.4vw, 30px);
    line-height: 1.2;
}

.nfs-book-journey__book-meta {
    margin: 7px 0 0;
    color: #5f6964;
    font-size: 14px;
}

.nfs-book-journey__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
    justify-content: center;
    margin-top: 16px;
}

.nfs-book-journey__actions a,
.nfs-book-journey__coming {
    display: inline-flex;
    align-items: center;
    min-height: 38px;
    padding: 8px 15px;
    border-radius: 999px;
    font-size: 13px;
    font-weight: 700;
    line-height: 1.25;
    text-decoration: none;
}

.nfs-book-journey__notes-link {
    color: #fff;
    background: var(--nfs-green);
    border: 1px solid var(--nfs-green);
}

.nfs-book-journey__affiliate-link {
    color: var(--nfs-green);
    background: #fff;
    border: 1px solid rgba(23, 63, 53, .32);
}

.nfs-book-journey__coming {
    color: #6e756f;
    background: #f5f2eb;
    border: 1px solid rgba(23, 63, 53, .14);
}

.nfs-book-journey__actions a:hover,
.nfs-book-journey__actions a:focus-visible {
    color: #fff;
    background: var(--nfs-green-soft);
    border-color: var(--nfs-green-soft);
    outline: 2px solid rgba(217, 180, 91, .55);
    outline-offset: 2px;
}

.nfs-book-journey__actions [hidden] {
    display: none;
}

.nfs-tree-book-journey {
    --nfs-card-width: clamp(145px, 19vw, 205px);
    width: 100%;
    margin: 24px 0 46px;
    padding: 38px 0 30px;
    background:
        radial-gradient(circle at 92% 10%, color-mix(in srgb, var(--nfs-gold) 15%, transparent) 0 4px, transparent 5px),
        linear-gradient(180deg, #fff 0%, color-mix(in srgb, var(--nfs-green) 5%, #fff) 52%, #fff 100%);
    border: 1px solid color-mix(in srgb, var(--nfs-green) 20%, transparent);
    border-radius: 24px;
    box-shadow: 0 14px 38px color-mix(in srgb, var(--nfs-green) 9%, transparent);
}

.nfs-tree-book-journey .nfs-book-journey__intro,
.nfs-tree-book-journey .nfs-book-journey__caption {
    width: min(680px, calc(100% - 34px));
}

.nfs-tree-book-journey .nfs-book-journey__intro h2 {
    font-size: clamp(38px, 5vw, 52px);
}

.nfs-tree-book-journey .nfs-book-journey__stage {
    margin-top: 8px;
}

.nfs-tree-book-journey .nfs-book-journey__viewport {
    padding-top: 28px;
    padding-bottom: 23px;
}

.nfs-tree-book-journey .nfs-book-journey__caption {
    min-height: 92px;
}

.nfs-area--body {
    --nfs-green: #2d7558;
    --nfs-green-soft: #4d8f72;
    --nfs-gold: #efc84a;
}

.nfs-area--mind {
    --nfs-green: #236b83;
    --nfs-green-soft: #438ba0;
    --nfs-gold: #edc955;
}

.nfs-area--heart {
    --nfs-green: #a94148;
    --nfs-green-soft: #c56366;
    --nfs-gold: #e8ad63;
}

.nfs-area--soul {
    --nfs-green: #8d6a0c;
    --nfs-green-soft: #b48c1d;
    --nfs-gold: #f2cb3f;
}

.nfs-area--purpose {
    --nfs-green: #76517d;
    --nfs-green-soft: #936d99;
    --nfs-gold: #e5b75b;
}

.nfs-area--roots {
    --nfs-green: #655638;
    --nfs-green-soft: #81714d;
    --nfs-gold: #d7ad4b;
}

@media (max-width: 767px) {
    .nfs-home-intro {
        width: calc(100% - 28px);
        margin: 28px auto 38px !important;
        padding: 36px 22px 33px !important;
        border-radius: 19px;
    }

    .nfs-home-intro p:first-child {
        font-size: clamp(47px, 13vw, 60px);
    }

    .nfs-home-intro p:nth-child(2) {
        margin-top: 18px;
        font-size: 16px;
        line-height: 1.65;
    }

    .nfs-home-intro p:last-child {
        margin-top: 21px;
        font-size: 14px;
    }

    .nfs-book-journey {
        --nfs-card-width: min(61vw, 230px);
        margin-bottom: 38px;
        padding-top: 36px;
    }

    .nfs-tree-book-journey {
        --nfs-card-width: min(58vw, 215px);
        width: calc(100% - 20px);
        margin: 20px auto 38px;
        padding-top: 31px;
        border-radius: 19px;
    }

    .nfs-book-journey__track {
        gap: 10px;
    }

    .nfs-book-journey__arrow {
        width: 42px;
        height: 42px;
        font-size: 36px;
    }

    .nfs-book-journey__arrow--previous { left: 7px; }
    .nfs-book-journey__arrow--next { right: 7px; }
}

@media (prefers-reduced-motion: reduce) {
    .nfs-book-card,
    .nfs-book-journey__year {
        transition: none;
    }

    .nfs-book-journey__viewport {
        scroll-behavior: auto;
    }
}