@font-face {
    font-family: "WAB League";
    src: url("../assets/fonts/league-spartan-variable.woff2") format("woff2");
    font-display: swap;
    font-style: normal;
    font-weight: 100 900;
}

body.home-page main section#model.wab-services {
    --wab-dark: var(--site-bg, #050917);
    --wab-white: #fff;
    --wab-copper: #d79a5b;
    position: relative;
    z-index: 3;
    width: 100%;
    max-width: none;
    margin: 0;
    padding: 0 !important;
    color: var(--wab-white);
    background-color: #050917 !important;
    background: var(--wab-dark) !important;
    overflow: visible !important;
    isolation: isolate;
}

body.home-page main section#model.wab-services::before,
body.home-page main section#model.wab-services::after {
    content: "";
    position: absolute;
    z-index: 9;
    right: 0;
    left: 0;
    height: clamp(110px, 14vw, 210px);
    pointer-events: none;
}

body.home-page main section#model.wab-services::before {
    top: 0;
    background: linear-gradient(180deg, var(--wab-dark) 0%, rgba(5, 9, 23, .84) 26%, rgba(5, 9, 23, 0) 100%);
}

body.home-page main section#model.wab-services::after {
    bottom: 0;
    background: linear-gradient(180deg, rgba(5, 9, 23, 0) 0%, rgba(5, 9, 23, .82) 72%, var(--wab-dark) 100%);
    box-shadow: 0 42px 90px var(--wab-dark);
}

.wab-services *,
.wab-services *::before,
.wab-services *::after { box-sizing: border-box; }

.wab-services__scroll {
    position: relative;
    height: 340vh;
    min-height: 2200px;
    background: var(--wab-dark) !important;
}

.wab-services__sticky {
    position: sticky;
    top: 0;
    width: 100%;
    height: 100vh;
    height: 100svh;
    min-height: 620px;
    overflow: hidden;
    background-color: #050917 !important;
    background: var(--wab-dark) !important;
}

.wab-services__space,
.wab-services__space-image,
.wab-services__space-shade,
.wab-services__space-grain,
.wab-services__horizon,
.wab-services__cockpit,
.wab-services__opening,
.wab-services__trade-map,
.wab-services__chapters {
    position: absolute;
    inset: 0;
}

.wab-services__space {
    z-index: 0;
    transform-origin: 50% 54%;
    will-change: transform, filter;
    background: var(--wab-dark) !important;
}

.wab-services__space-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: 50% 50%;
    transform: scale(1.035);
    filter: saturate(.95) contrast(1.08) brightness(.78);
}

.wab-services__space-shade {
    z-index: 1;
    background:
        radial-gradient(circle at 53% 52%, rgba(0, 0, 0, .02) 4%, rgba(0, 0, 0, .22) 48%, rgba(0, 0, 0, .66) 96%),
        linear-gradient(180deg, rgba(0, 0, 0, .58), rgba(0, 0, 0, .04) 34%, rgba(0, 0, 0, .38));
}

.wab-services__space-grain {
    z-index: 2;
    opacity: .045;
    background-image: url("../assets/images/service-space/cosmic-grain.webp");
    background-size: cover;
    background-position: center;
    mix-blend-mode: screen;
    pointer-events: none;
}

.wab-services__space-grain::after {
    content: "";
    position: absolute;
    inset: -80%;
    opacity: .18;
    background-image: repeating-radial-gradient(circle at 17% 32%, rgba(255,255,255,.7) 0 1px, transparent 1px 5px);
    background-size: 7px 7px;
    animation: wab-grain .24s steps(2) infinite;
}

.wab-services__horizon {
    z-index: 3;
    opacity: .25;
    background: radial-gradient(ellipse 54% 14% at 54% 23%, rgba(183, 214, 255, .28), transparent 70%);
    mix-blend-mode: screen;
}

@keyframes wab-grain {
    0% { transform: translate3d(-1%, 1%, 0); }
    25% { transform: translate3d(2%, -1%, 0); }
    50% { transform: translate3d(0, 2%, 0); }
    75% { transform: translate3d(-2%, 0, 0); }
    100% { transform: translate3d(1%, -2%, 0); }
}

.wab-services__cockpit {
    z-index: 3;
    display: grid;
    place-items: center;
    transform-origin: 50% 52%;
    will-change: transform, opacity;
    pointer-events: none;
}

.wab-services__cockpit img {
    width: 100%;
    height: auto;
    min-height: 100%;
    max-width: none;
    object-fit: cover;
    object-position: 50% 50%;
    transform: scale(1.18);
    filter: brightness(.8) contrast(1.14);
}

.wab-services__cockpit-glass {
    position: absolute;
    inset: 0;
    background: radial-gradient(ellipse 31% 31% at 50% 51%, transparent 0 40%, rgba(0, 0, 0, .2) 66%, rgba(0, 0, 0, .62) 100%);
}

.wab-services__opening {
    z-index: 4;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: clamp(5.8rem, 8vw, 8rem) clamp(1.25rem, 3.15vw, 3.75rem) clamp(1.5rem, 3vw, 3rem);
    pointer-events: none;
    will-change: transform, opacity;
}

.wab-services__opening-meta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    font: 650 clamp(.62rem, .68vw, .78rem)/1 "WAB League", sans-serif;
    letter-spacing: .16em;
}

.wab-services__hero-title {
    position: absolute;
    inset: 50% 0 auto;
    display: grid;
    place-items: center;
    width: 100%;
    margin: 0;
    transform: translateY(-50%);
    text-align: center;
    font-size: 0 !important;
    line-height: 0 !important;
}

.wab-services__hero-logo {
    display: block;
    width: 210px;
    height: 98px;
    object-fit: cover;
    object-position: center;
    filter: contrast(1.1) brightness(1.05);
    will-change: transform, filter, opacity;
}

body.home-page main section#model.wab-services .wab-services__hero-title {
    font-size: 0 !important;
    line-height: 0 !important;
}

.wab-services__opening-footer {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 2rem;
}

.wab-services__opening-footer > p {
    max-width: 30rem;
    margin: 0;
    font: 500 clamp(.92rem, 1.1vw, 1.18rem)/1.35 "WAB League", sans-serif;
    letter-spacing: -.015em;
}

.wab-services__scroll-cue {
    display: flex;
    align-items: center;
    gap: 1rem;
    font: 650 .72rem/1 "WAB League", sans-serif;
    letter-spacing: .14em;
    text-transform: uppercase;
}

.wab-services__scroll-cue svg {
    width: 18px;
    height: 28px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.3;
    animation: wab-scroll-arrow 1.7s ease-in-out infinite;
}

@keyframes wab-scroll-arrow {
    0%, 100% { transform: translateY(0); opacity: .65; }
    50% { transform: translateY(7px); opacity: 1; }
}

.wab-services__trade-map {
    z-index: 5;
    visibility: hidden;
    opacity: 0;
    overflow: hidden;
    pointer-events: none;
}

.wab-services__trade-map::after {
    content: "";
    position: absolute;
    z-index: 2;
    inset: 0;
    background:
        linear-gradient(180deg, rgba(0,0,0,.34), transparent 28%, rgba(0,0,0,.38)),
        linear-gradient(90deg, rgba(0,0,0,.08), transparent 44%, rgba(0,0,0,.2));
}

.wab-services__route-stage,
.wab-services__route-canvas {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
}

.wab-services__route-stage { z-index: 3; }
.wab-services__route-canvas { z-index: 1; }

.wab-services__route-intro {
    position: absolute;
    z-index: 4;
    top: clamp(6rem, 10vw, 9.5rem);
    left: clamp(1.25rem, 3.2vw, 3.8rem);
    max-width: min(31rem, 43vw);
}

.wab-services__route-intro > span {
    display: block;
    margin-bottom: .8rem;
    color: rgba(255,255,255,.64);
    font: 650 clamp(.6rem, .66vw, .76rem)/1 "WAB League", sans-serif;
    letter-spacing: .18em;
}

.wab-services__route-intro h3 {
    margin: 0;
    color: var(--wab-white);
    font: 700 clamp(2rem, 3.2vw, 4.05rem)/.92 "WAB League", sans-serif !important;
    letter-spacing: -.055em !important;
}

body.home-page main section#model.wab-services .wab-services__route-intro h3 {
    color: var(--wab-white) !important;
    font-family: "WAB League", sans-serif !important;
    font-size: clamp(2rem, 3.2vw, 4.05rem) !important;
    font-weight: 700 !important;
    line-height: .92 !important;
    letter-spacing: -.055em !important;
}

.wab-services__route-intro > p {
    max-width: 29rem;
    margin: 1rem 0 0;
    color: rgba(255,255,255,.7);
    font: 480 clamp(.78rem, .95vw, 1rem)/1.45 "WAB League", sans-serif;
    letter-spacing: -.01em;
}

.wab-trade-node {
    --route-x: 50;
    --route-y: 50;
    position: absolute;
    z-index: 3;
    left: calc(var(--route-x) * 1%);
    top: calc(var(--route-y) * 1%);
    display: flex;
    align-items: center;
    gap: .55rem;
    transform: translate(-50%, -50%);
    color: rgba(255,255,255,.9);
    white-space: nowrap;
    font: 680 clamp(.6rem, .72vw, .82rem)/1 "WAB League", sans-serif;
    letter-spacing: .08em;
    text-transform: uppercase;
    opacity: 0;
}

.wab-trade-node[data-route-x="35"] { --route-x: 35; --route-y: 45; }
.wab-trade-node[data-route-x="73"] { --route-x: 73; --route-y: 87; }

.wab-trade-node i {
    position: relative;
    display: block;
    width: 7px;
    height: 7px;
    flex: 0 0 auto;
    border: 1px solid #fff;
    border-radius: 50%;
    background: var(--wab-copper);
    box-shadow: 0 0 0 5px rgba(215,154,91,.13), 0 0 22px rgba(255,205,146,.9);
}

.wab-trade-node--destination {
    z-index: 5;
    padding: .62rem .82rem;
    border: 1px solid rgba(255,255,255,.52);
    border-radius: 999px;
    background: rgba(3,3,3,.72);
    box-shadow: 0 12px 40px rgba(0,0,0,.35);
    backdrop-filter: blur(8px);
}

.wab-trade-node--destination i {
    width: 10px;
    height: 10px;
    background: #fff;
    box-shadow: 0 0 0 6px rgba(215,154,91,.24), 0 0 28px rgba(255,255,255,.95);
}

.wab-trade-node--hub {
    padding: .52rem .72rem;
    border: 1px solid rgba(215,154,91,.5);
    border-radius: 999px;
    background: rgba(3,3,3,.7);
    backdrop-filter: blur(8px);
}

.wab-trade-node--hub i {
    width: 9px;
    height: 9px;
    box-shadow: 0 0 0 6px rgba(215,154,91,.2), 0 0 30px rgba(255,205,146,.95);
}

.wab-services__route-note {
    position: absolute;
    z-index: 4;
    right: clamp(1.25rem, 3.2vw, 3.8rem);
    bottom: clamp(1.5rem, 3vw, 3rem);
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: .45rem;
    font-family: "WAB League", sans-serif;
    letter-spacing: .14em;
    text-align: right;
}

.wab-services__route-note span {
    color: rgba(255,255,255,.55);
    font-size: clamp(.58rem, .66vw, .72rem);
}

.wab-services__route-note strong {
    font-size: clamp(.72rem, .85vw, .95rem);
    font-weight: 680;
}

.wab-services__chapters {
    z-index: 6;
    visibility: hidden;
    pointer-events: none;
}

.wab-service-chapter {
    position: absolute;
    inset: 0;
    display: block;
    opacity: 0;
    visibility: hidden;
    overflow: hidden;
    isolation: isolate;
}

.wab-service-chapter__body {
    position: absolute;
    z-index: 3;
    top: 50%;
    left: clamp(2rem, 6.5vw, 7.8rem);
    width: min(46vw, 45rem);
    transform: translateY(-50%);
    text-shadow: 0 10px 42px rgba(0,0,0,.5);
}

.wab-service-chapter__wash {
    position: absolute;
    z-index: 2;
    inset: 0;
    background:
        linear-gradient(90deg, rgba(0,0,0,.82) 0%, rgba(0,0,0,.34) 32%, rgba(0,0,0,.06) 54%, rgba(0,0,0,.48) 100%),
        radial-gradient(circle at 55% 50%, transparent 18%, rgba(0,0,0,.26) 82%),
        linear-gradient(180deg, rgba(0,0,0,.34), transparent 34%, rgba(0,0,0,.42));
    pointer-events: none;
}

.wab-service-chapter__wash::after {
    content: "";
    position: absolute;
    inset: -50%;
    opacity: .1;
    background-image: repeating-radial-gradient(circle at 37% 42%, rgba(255,255,255,.7) 0 1px, transparent 1px 4px);
    background-size: 6px 6px;
    mix-blend-mode: soft-light;
    animation: wab-grain .28s steps(2) infinite;
}

.wab-service-chapter__count {
    display: block;
    margin-bottom: clamp(1.05rem, 1.6vw, 1.65rem);
    color: rgba(255,255,255,.7);
    font: 650 clamp(.5rem, .54vw, .64rem)/1 "WAB League", sans-serif;
    letter-spacing: .16em;
}

.wab-service-chapter__kicker {
    margin: 0 0 clamp(.6rem, .9vw, .9rem);
    color: rgba(255,255,255,.76);
    font: 680 clamp(.52rem, .58vw, .68rem)/1 "WAB League", sans-serif;
    letter-spacing: .17em;
}

body.home-page main section#model.wab-services .wab-service-chapter__kicker {
    color: rgba(255,255,255,.76) !important;
    font-family: "WAB League", sans-serif !important;
    font-size: clamp(.52rem, .58vw, .68rem) !important;
    font-weight: 680 !important;
    line-height: 1 !important;
}

.wab-service-chapter h3 {
    margin: 0;
    color: var(--wab-white);
    font: 720 clamp(2.65rem, 4.35vw, 4.95rem)/.92 "WAB League", sans-serif !important;
    letter-spacing: -.045em !important;
}

body.home-page main section#model.wab-services .wab-service-chapter h3 {
    color: var(--wab-white) !important;
    font-family: "WAB League", sans-serif !important;
    font-size: clamp(2.65rem, 4.35vw, 4.95rem) !important;
    font-weight: 720 !important;
    line-height: .92 !important;
    letter-spacing: -.045em !important;
}

.wab-service-chapter__aside {
    position: absolute;
    z-index: 3;
    top: 52%;
    right: clamp(2rem, 6.4vw, 7.4rem);
    width: min(31vw, 31rem);
    margin: 0;
    color: rgba(255,255,255,.94);
    font: 520 clamp(1rem, 1.34vw, 1.46rem)/1.36 "WAB League", sans-serif;
    letter-spacing: 0;
    text-align: center;
    text-shadow: 0 8px 34px rgba(0,0,0,.78);
}

body.home-page main section#model.wab-services .wab-service-chapter__aside {
    color: rgba(255,255,255,.94) !important;
    font-family: "WAB League", sans-serif !important;
    font-size: clamp(1rem, 1.34vw, 1.46rem) !important;
    font-weight: 520 !important;
    line-height: 1.36 !important;
}

.wab-service-chapter--trade .wab-service-chapter__wash {
    background:
        linear-gradient(90deg, rgba(0,0,0,.82) 0%, rgba(0,0,0,.3) 35%, transparent 58%, rgba(0,0,0,.5) 100%),
        linear-gradient(180deg, rgba(0,0,0,.3), transparent 36%, rgba(0,0,0,.42));
}

.wab-service-chapter--partner .wab-service-chapter__wash {
    background:
        linear-gradient(90deg, rgba(0,0,0,.8) 0%, rgba(0,0,0,.25) 38%, transparent 56%, rgba(0,0,0,.48) 100%),
        linear-gradient(180deg, rgba(0,0,0,.3), transparent 38%, rgba(0,0,0,.42));
}

.wab-services--static .wab-services__scroll {
    height: auto;
    min-height: 0;
}

.wab-services--static .wab-services__sticky {
    position: relative;
    min-height: 100svh;
}

.wab-services--static .wab-services__opening,
.wab-services--static .wab-services__cockpit { display: none; }

.wab-services--static .wab-services__trade-map {
    visibility: visible;
    opacity: 1;
}

.wab-services--static .wab-trade-node { opacity: 1; }

.wab-services--static .wab-services__sticky {
    height: auto;
    overflow: visible;
}

.wab-services--static .wab-services__trade-map {
    position: relative;
    min-height: 100svh;
}

.wab-services--static .wab-services__chapters {
    position: relative;
    visibility: visible;
}

.wab-services--static .wab-service-chapter {
    position: relative;
    min-height: 66svh;
    opacity: 1;
    visibility: visible;
}

@media (max-width: 900px) {
    .wab-services__scroll { height: 310vh; min-height: 1850px; }
    .wab-services__sticky { min-height: 540px; }
    .wab-services__opening { padding-top: clamp(5.5rem, 15vw, 7rem); }
    .wab-services__hero-logo { width: 174px; height: 80px; }
    .wab-services__cockpit img { width: auto; height: 108%; min-height: 0; }
    .wab-services__route-intro { top: clamp(5.5rem, 14vw, 7rem); max-width: 50vw; }
    .wab-services__route-intro h3,
    body.home-page main section#model.wab-services .wab-services__route-intro h3 {
        font-size: clamp(2.2rem, 6vw, 3.6rem) !important;
    }
    .wab-service-chapter__body { left: 2rem; width: 56vw; }
    .wab-service-chapter__aside { right: 2rem; width: 30vw; }
    .wab-service-chapter h3,
    body.home-page main section#model.wab-services .wab-service-chapter h3 {
        font-size: clamp(2.7rem, 6.4vw, 4.4rem) !important;
        line-height: .9 !important;
    }
}

@media (max-width: 620px) {
    .wab-services__scroll { height: 300vh; min-height: 1780px; }
    .wab-services__opening { padding-right: 1rem; padding-left: 1rem; }
    .wab-services__opening-meta { font-size: .56rem; }
    .wab-services__opening-meta span:last-child { max-width: 10rem; text-align: right; }
    .wab-services__hero-logo { width: 148px; height: 68px; }
    .wab-services__opening-footer > p { max-width: 15rem; font-size: .83rem; }
    .wab-services__scroll-cue span { display: none; }
    .wab-services__cockpit img { height: 115%; }

    .wab-services__space-image {
        inset: 50% 0 auto;
        height: auto;
        aspect-ratio: 16 / 9;
        object-fit: cover;
        transform: translateY(-50%) scale(1.01);
    }

    .wab-services__route-stage {
        inset: 50% 0 auto;
        height: auto;
        aspect-ratio: 16 / 9;
        transform: translateY(-50%);
    }

    .wab-services__route-intro {
        top: clamp(5.25rem, 20vw, 6.5rem);
        left: 1rem;
        max-width: calc(100% - 2rem);
    }
    .wab-services__route-intro > span { margin-bottom: .45rem; font-size: .54rem; }
    .wab-services__route-intro h3,
    body.home-page main section#model.wab-services .wab-services__route-intro h3 {
        font-size: clamp(1.8rem, 8.5vw, 2.65rem) !important;
    }
    .wab-services__route-intro > p { max-width: 18rem; margin-top: .65rem; font-size: .68rem; }
    .wab-trade-node { gap: .25rem; font-size: .46rem; letter-spacing: .03em; }
    .wab-trade-node i { width: 4px; height: 4px; box-shadow: 0 0 0 3px rgba(215,154,91,.16), 0 0 12px rgba(255,205,146,.8); }
    .wab-trade-node--destination { padding: .35rem .48rem; }
    .wab-trade-node--destination i { width: 6px; height: 6px; box-shadow: 0 0 0 3px rgba(215,154,91,.2), 0 0 14px rgba(255,255,255,.9); }
    .wab-services__route-note { right: 1rem; bottom: 1.4rem; }
    .wab-service-chapter__wash,
    .wab-service-chapter--trade .wab-service-chapter__wash,
    .wab-service-chapter--partner .wab-service-chapter__wash {
        background:
            linear-gradient(180deg, rgba(2,4,8,.38) 0%, rgba(2,4,8,.12) 34%, rgba(2,4,8,.48) 72%, rgba(2,4,8,.82) 100%),
            linear-gradient(90deg, rgba(2,4,8,.52), transparent 70%);
    }
    .wab-service-chapter__body {
        top: 42%;
        left: 1rem;
        width: calc(100% - 2rem);
        transform: translateY(-50%);
    }
    .wab-service-chapter__count { margin-bottom: 1rem; }
    .wab-service-chapter h3,
    body.home-page main section#model.wab-services .wab-service-chapter h3 {
        font-size: clamp(2.35rem, 10vw, 3.35rem) !important;
        line-height: .9 !important;
    }
    .wab-service-chapter__aside {
        top: auto;
        right: 1rem;
        bottom: 1.7rem;
        left: 1rem;
        width: auto;
        font-size: .98rem;
        line-height: 1.36;
        text-align: left;
    }
    body.home-page main section#model.wab-services .wab-service-chapter__aside {
        font-size: .98rem !important;
        line-height: 1.36 !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    .wab-services__space-grain::after,
    .wab-services__scroll-cue svg { animation: none; }
}
