#page .site-content {
    --nnav-desktop-height: 0;
}

/* the theme's overflow-x: hidden on .site-content (phones) makes it a scroll box, which stops the sticky
   benefit tabs; clip keeps the same horizontal cut without that */
.site-content:has(> .ltb-page) {
    overflow-x: clip;
}

/* the footer after the FAQ as in the designs (instead of its global 180 / 96): 205px from the FAQ grid to the footer's
   CTA card, which sits 70px into the footer; 116px on phones */
body:has(.ltb-page) .footer-2026-wrap {
    margin-top: 87px;  /* FAQ padding-bottom 48 */
}

body:has(.ltb-page--finance) .footer-2026-wrap {
    margin-top: 47px;  /* FAQ padding-bottom 88 */
}

@media (max-width: 1023px) {
    body:has(.ltb-page) .footer-2026-wrap {
        margin-top: 71px;  /* FAQ padding-bottom 64 */
    }
}

@media (max-width: 767px) {
    body:has(.ltb-page) .footer-2026-wrap {
        margin-top: -18px;
    }
}

.ltb-page {
    --ltb-green: #22E243;
    --ltb-green-hover: #20BB3B;
    --ltb-green-muted: #1AC137;
    --ltb-jet: #0F0F0F;
    --ltb-carbon: #121212;
    --ltb-anthracite: #222;
    --ltb-ash: #424242;
    --ltb-soft-grey: #888;
    --ltb-light-grey: #C2BDBD;
    --ltb-rich-beige: #6F685E;
    --ltb-regular-beige: #ECEBE7;
    --ltb-light-beige: #FAFAF7;
    width: 100%;
    background: #fff;
    overflow-x: clip;
    color: var(--ltb-ash);
    font-family: Nunito, sans-serif;
    font-feature-settings: 'liga' off, 'clig' off;
}

/* .page-template p / h* margins from the global theme */
.ltb-page :where(h1, h2, h3, h4, p, ul, ol) {
    margin: 0;
}

.ltb-page p {
    margin-bottom: 0;
}

.ltb-page .linebreak {
    display: block;
}

/* {linebreak_desktop} / {linebreak_mobile}: a break on one layout, a plain space on the other */
.ltb-page .ltb-br-d {
    display: block;
}

.ltb-page .ltb-br-m {
    display: inline;
}

.ltb-page .green {
    color: var(--ltb-green-muted);
}

/* {dark_start}: darker text at the regular weight */
.ltb-page .dark {
    color: var(--ltb-carbon);
}

.ltb-page strong {
    font-weight: 800;
}

.ltb-container {
    width: 100%;
    max-width: 1360px;
    margin: 0 auto;
    padding: 0 24px;
    box-sizing: border-box;
}

@supports (text-box: trim-both cap alphabetic) {
    .ltb-trim {
        text-box: trim-both cap alphabetic;
    }
}

.ltb-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    height: 64px;
    padding: 0 32px 0 40px;
    box-sizing: border-box;
    border-radius: 64px;
    background: var(--ltb-green);
    color: #000;
    font-family: Nunito, sans-serif;
    font-size: 16px;
    font-weight: 800;
    line-height: 24px;
    letter-spacing: 0;
    text-transform: uppercase;
    text-decoration: none;
    white-space: nowrap;
    cursor: pointer;
    transition: background-color .2s ease, color .2s ease, box-shadow .2s ease;
}

.ltb-btn--dark {
    background: #000;
    color: #fff;
}

/* 1.5px stroke as an inset shadow: a 1.5px border would be snapped to 1px */
.ltb-btn--outline {
    padding: 0 32px 0 40px;
    background: #fff;
    box-shadow: inset 0 0 0 1.5px var(--ltb-green-muted);
    color: var(--ltb-carbon);
}

.ltb-btn--outline .ltb-btn__icon {
    color: var(--ltb-green-muted);
}

.ltb-btn__icon {
    display: block;
    flex: 0 0 16px;
    width: 16px;
    height: 16px;
}

/* hover: the green button turns black with a green label, the dark and outlined ones turn green */
@media (hover: hover) and (pointer: fine) {
    .ltb-btn:hover {
        background: #000;
        color: var(--ltb-green);
    }

    .ltb-btn--dark:hover,
    .ltb-btn--outline:hover {
        background: var(--ltb-green);
        box-shadow: inset 0 0 0 1.5px var(--ltb-green);
        color: #000;
    }

    .ltb-btn--outline:hover .ltb-btn__icon {
        color: #000;
    }
}

.ltb-head {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
}

/* 16px label row + 12px spacer (padding, so it never collapses into the next margin);
   a section without a label renders neither */
.ltb-page .ltb-overline {
    display: flex;
    align-items: center;
    gap: 7px;
    min-height: 28px;
    padding-bottom: 12px;
    color: var(--ltb-soft-grey);
    font-size: 12px;
    font-weight: 800;
    line-height: 16.8px;
    letter-spacing: 2.52px;
    text-transform: uppercase;
    white-space: nowrap;
}

.ltb-head .ltb-overline {
    justify-content: center;
}

.ltb-head__title {
    max-width: 900px;
    color: #000;
    font-size: 48px;
    font-weight: 800;
    line-height: 56px;
    letter-spacing: 0;
}

.ltb-head__sub {
    max-width: 900px;
    margin-top: 24px;
    color: var(--ltb-anthracite);
    font-size: 18px;
    font-weight: 500;
    line-height: 26px;
}

.ltb-head__sub strong {
    color: var(--ltb-anthracite);
}

/* numbered card: number, rule, headline, description, optional pill label */
.ltb-card {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    min-width: 0;
}

.ltb-card__main {
    display: flex;
    flex-direction: column;
    gap: 2px;
    width: 100%;
}

.ltb-card__num {
    color: var(--ltb-soft-grey);
    font-size: 14px;
    font-style: italic;
    font-weight: 500;
    line-height: 18px;
}

/* Travel: upright 12px numbers */
.ltb-page--travel .ltb-card__num {
    font-size: 12px;
    font-style: normal;
    font-weight: 800;
    line-height: 14px;
    letter-spacing: 1px;
}

.ltb-card__rule {
    display: block;
    width: 100%;
    height: 2px;
    border-radius: 2px;
    background: var(--ltb-light-grey);
}

.ltb-card__body {
    padding: 9px 0 0;
}

.ltb-card__title {
    color: var(--ltb-anthracite);
    font-size: 24px;
    font-style: italic;
    font-weight: 900;
    line-height: 32px;
    text-transform: uppercase;
}

.ltb-card__desc {
    max-width: 280px;
    margin-top: 32px;
    color: var(--ltb-ash);
    font-size: 16px;
    font-weight: 500;
    line-height: 22px;
}

.ltb-card__desc strong {
    color: var(--ltb-ash);
}

.ltb-card__label {
    display: inline-flex;
    align-items: flex-end;
    gap: 8px;
    margin: 32px 0 0;
    padding: 9px 16px;
    border-radius: 28px;
    background: var(--ltb-carbon);
    font-style: italic;
    white-space: nowrap;
}

.ltb-card__highlight {
    color: var(--ltb-green);
    font-size: 16px;
    font-weight: 900;
    line-height: 24px;
    letter-spacing: .64px;
}

.ltb-card__qualifier {
    color: #fff;
    font-size: 10px;
    font-weight: 700;
    line-height: 18px;
    letter-spacing: 1px;
}

/* Finance and Shopping set their labels in capitals (part of the copy is typed in lower case) */
.ltb-page--finance .ltb-card__highlight,
.ltb-page--finance .ltb-card__qualifier,
.ltb-page--shopping .ltb-card__highlight,
.ltb-page--shopping .ltb-card__qualifier {
    text-transform: uppercase;
}

/* Swiper markup: a slider only below each row's own breakpoint (data-ltb-until),
   a plain layout above it */
.ltb-page .swiper-wrapper {
    height: auto;
}

.ltb-page .swiper-slide {
    height: auto;
}

/* slider controls show whenever the row is a slider */
.ltb-nav {
    display: none;
    align-items: center;
    justify-content: center;
    gap: 16px;
}

.swiper-initialized > .ltb-nav {
    display: flex;
}

.ltb-nav__btn {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    margin: 0;
    padding: 0;
    border: 0;
    background: transparent;
    color: var(--ltb-green-muted);
    cursor: pointer;
    transition: color .25s ease;
}

.ltb-nav__btn:disabled {
    color: var(--ltb-light-grey);
    cursor: default;
}

.ltb-nav__btn svg {
    display: block;
    width: 40px;
    height: 40px;
}

/* Swiper tags the dots box as an absolute full-width pagination; keep it in the row */
.ltb-page .ltb-nav__dots {
    position: static;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    width: auto;
    min-width: 51px;
    height: 12px;
    transform: none;
}

.ltb-nav__dot {
    display: block;
    flex: 0 0 auto;
    width: 5px;
    height: 5px;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: var(--ltb-anthracite);
    cursor: pointer;
    transition: width .3s ease, height .3s ease, background-color .3s ease;
}

.ltb-nav__dot.is-active {
    width: 12px;
    height: 12px;
    background: var(--ltb-green-muted);
    cursor: default;
}

.ltb-nav__btn:focus-visible,
.ltb-nav__dot:focus-visible {
    outline: 2px solid var(--ltb-green);
    outline-offset: 2px;
}

/* desktop: rows that slide peek out to the page edge (the page clips them) */
@media (min-width: 1024px) {
    .ltb-page .swiper {
        overflow: visible;
    }

    .ltb-page .swiper:not(.swiper-initialized) .swiper-slide {
        width: auto;
    }
}

@media (max-width: 1023px) {
    .ltb-page .ltb-br-d {
        display: inline;
    }

    .ltb-page .ltb-only-d {
        display: none;
    }

    .ltb-page .ltb-br-m {
        display: block;
    }

    .ltb-page .ltb-overline {
        white-space: normal;
    }

    .ltb-head__title {
        font-size: 34px;
        line-height: 40px;
    }

    .ltb-head__sub {
        margin-top: 16px;
    }

    .ltb-card__label {
        margin-top: 37px;
    }

    .ltb-page .swiper-wrapper {
        display: flex;
    }

    /* reserved before Swiper starts, so the page does not jump */
    .ltb-nav {
        display: flex;
    }

    /* long labels / translations wrap inside the pill instead of running out of it */
    .ltb-btn {
        height: auto;
        min-height: 64px;
        max-width: 100%;
        padding-top: 8px;
        padding-bottom: 8px;
        white-space: normal;
        text-align: center;
    }

    .ltb-btn__label {
        min-width: 0;
    }
}

/* the narrowest phones: long single words in headlines still fit their card */
@media (max-width: 359px) {
    .ltb-card__title {
        font-size: 20px;
        line-height: 28px;
    }
}
