/* ==========================================================
   SNOW EXP — SHARED PLANNER TOOLS RAIL
   ========================================================== */

/*
 * About, Planner and the itinerary landing pages all use the
 * base-resorts visual system.
 *
 * Escape only the inherited desktop body width clamp.
 * Do not change body margin or padding.
 */
@media (min-width: 1100px) {
    body.template-plannerpage,
    body.template-ski-trip-itinerary {
        max-width: none !important;
    }
}


/* ----------------------------------------------------------
   MAIN PLANNER PAGE
   ---------------------------------------------------------- */

.planner-page-shell {
    width: 78vw;
    max-width: 1450px;
    margin: 0 auto;
    padding: 0 24px 20px;
    box-sizing: border-box;
}

.planner-page-hero {
    padding: 8px 0 18px;
}

.planner-page-hero .main-text-resorts {
    margin: 0;
    font-weight: 900;
    letter-spacing: -0.02em;
}

.planner-page-columns {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 320px;
    gap: 26px;
    align-items: start;
}

.planner-page-main {
    min-width: 0;
}

body.template-plannerpage
.planner-page-main
#planner-index-back {
    box-sizing: border-box;
    width: 100%;
    max-width: none !important;
    margin-top: 0;
}


/* ----------------------------------------------------------
   ITINERARY LANDING PAGES
   ---------------------------------------------------------- */

.itinerary-page-layout {
    display: grid;
    grid-template-columns:
        minmax(0, 2fr)
        minmax(320px, 0.95fr);
    gap: 28px;
    align-items: start;
}

.itinerary-main-column {
    min-width: 0;
    display: grid;
    gap: 22px;
}


/* ----------------------------------------------------------
   SHARED RIGHT RAIL
   ---------------------------------------------------------- */

.planner-tools-rail {
    min-width: 0;
    align-self: start;
}

.planner-tools-rail__sticky {
    display: grid;
    gap: 18px;
}

.planner-rail-card {
    overflow: hidden;
    border: 1px solid rgba(255,255,255,.62);
    border-radius: 18px;
    padding: 19px;

    background:
        linear-gradient(
            145deg,
            rgba(255,255,255,.96),
            rgba(245,248,252,.90)
        );

    color: #172033;
    box-shadow: 0 18px 42px rgba(8,18,34,.14);
    backdrop-filter: blur(14px);
}

.planner-rail-eyebrow {
    margin: 0 0 5px;
    color: #ff5a3d;
    font-size: 11px;
    font-weight: 900;
    letter-spacing: .11em;
    text-transform: uppercase;
}

.planner-rail-title {
    margin: 0 0 14px;
    color: #172033;
    font-size: 20px;
    line-height: 1.15;
}

.planner-tool-links {
    display: grid;
    gap: 8px;
}

.planner-tool-link {
    display: grid;
    grid-template-columns: 38px minmax(0, 1fr) auto;
    gap: 11px;
    align-items: center;

    padding: 11px 8px;
    border-radius: 12px;

    color: #172033;
    text-decoration: none;

    transition:
        background .16s ease,
        transform .16s ease;
}

.planner-tool-link + .planner-tool-link {
    border-top: 1px solid rgba(15,23,42,.08);
}

.planner-tool-link:hover,
.planner-tool-link:focus {
    background: rgba(255,90,61,.08);
    color: #172033;
    text-decoration: none;
    transform: translateX(2px);
}

.planner-tool-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    width: 36px;
    height: 36px;

    border: 1px solid rgba(255,90,61,.34);
    border-radius: 11px;

    color: #172033;
    background: #fff;
}

.planner-tool-icon svg {
    width: 21px;
    height: 21px;

    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.planner-tool-copy {
    min-width: 0;
}

.planner-tool-copy strong {
    display: block;
    margin-bottom: 3px;

    color: #172033;
    font-size: 13px;
    font-weight: 900;
    line-height: 1.25;
}

.planner-tool-copy small {
    display: block;

    color: rgba(23,32,51,.68);
    font-size: 11px;
    line-height: 1.35;
}

.planner-tool-arrow {
    color: #ff5a3d;
    font-size: 18px;
    font-weight: 900;
}

.planner-tools-rail__affiliate {
    min-width: 0;
}

.planner-tools-rail__affiliate
.snowexp-affiliate-banner-card {
    padding: 12px !important;
}

.planner-tools-rail__affiliate
.snowexp-affiliate-banner-link,
.planner-tools-rail__affiliate picture {
    display: block;
    width: 100%;
}

.planner-tools-rail__affiliate
.snowexp-affiliate-banner-image,
.planner-tools-rail__affiliate img {
    display: block;
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    margin: 0 auto;
}


/*
 * Match the successful resort-rail behaviour:
 * sticky only when there is enough desktop viewport.
 */
@media (min-width: 1281px) and (min-height: 760px) {
    .planner-tools-rail__sticky {
        position: sticky;
        top: 86px;
    }
}


/* ----------------------------------------------------------
   RESPONSIVE
   ---------------------------------------------------------- */

@media (max-width: 1100px) {
    .planner-page-columns,
    .itinerary-page-layout {
        grid-template-columns: 1fr;
    }

    .planner-tools-rail__sticky {
        position: static;
        grid-template-columns: 1fr;
    }

    .planner-tools-card .planner-tool-links {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
        gap: 8px 14px;
    }
}

@media (max-width: 760px) {
    .planner-page-shell {
        width: 100%;
        max-width: none;
        padding: 0 14px 18px;
    }

    .planner-tools-card .planner-tool-links {
        grid-template-columns: 1fr;
    }

    .planner-rail-card {
        border-radius: 16px;
        padding: 16px;
    }
}


/* ==========================================================
   SNOWEXP PLANNER PRODUCT PAGE POLISH V2
   ========================================================== */


/* ----------------------------------------------------------
   PAGE TITLES
   The global main-text-resorts colour is unsuitable over the
   dark slideshow on these planner/product pages.
   ---------------------------------------------------------- */

body.template-plannerpage .planner-page-hero,
body.template-ski-trip-itinerary .itinerary-page-hero {
    position: relative;
    z-index: 2;
}

body.template-plannerpage
.planner-page-hero
.main-text-resorts,

body.template-ski-trip-itinerary
.itinerary-page-hero
.main-text-resorts {
    margin: 0 !important;
    padding: 8px 0 5px;

    color: #fff !important;

    font-size: clamp(2.25rem, 3.4vw, 3.7rem);
    font-weight: 900;
    line-height: 1.02;
    letter-spacing: -0.035em;

    text-shadow:
        0 2px 4px rgba(0,0,0,.42),
        0 8px 26px rgba(0,0,0,.32);
}


/* ----------------------------------------------------------
   PLANNER INSPIRATION
   It belongs to the main working column, not centred beneath
   the two-column page.
   ---------------------------------------------------------- */

body.template-plannerpage
.planner-page-main
.planner-inspiration-footer-buffer {
    width: 100% !important;
    max-width: none !important;

    margin:
        30px 0
        0 !important;
}


/* ----------------------------------------------------------
   ITINERARY PRODUCT / GUIDE PAGES
   Use the successful About / partner presentation:
   the mountain remains behind the page, with one light glass
   product surface over it.
   ---------------------------------------------------------- */

body.template-ski-trip-itinerary
.itinerary-page-back,

body.template-ski-trip-itinerary
#resort-back.itinerary-page-back {
    width: 100%;
    max-width: 1240px;

    margin:
        0 auto;

    padding: 28px;

    border:
        1px solid
        rgba(255,255,255,.62);

    border-radius: 20px;

    background:
        linear-gradient(
            145deg,
            rgba(255,255,255,.94),
            rgba(244,247,250,.84)
        );

    box-shadow:
        0 20px 52px
        rgba(8,18,34,.20);

    backdrop-filter:
        blur(14px);

    box-sizing:
        border-box;
}


/* Breadcrumbs now sit on a light product surface. */

body.template-ski-trip-itinerary
.itinerary-breadcrumbs {
    display: flex;
    flex-wrap: wrap;
    align-items: center;

    margin:
        0 0 18px;

    color:
        rgba(23,32,51,.65);

    font-size: .9rem;
    font-weight: 650;
    line-height: 1.4;
}

body.template-ski-trip-itinerary
.itinerary-breadcrumbs a,

body.template-ski-trip-itinerary
.itinerary-breadcrumbs a:visited {
    color: #e8583f;

    font-weight: 800;

    text-decoration: none;
}

body.template-ski-trip-itinerary
.itinerary-breadcrumbs a:hover,

body.template-ski-trip-itinerary
.itinerary-breadcrumbs a:focus {
    color: #c8442f;

    text-decoration: underline;
    text-underline-offset: 3px;
}


/* Replace the temporary dark floating cards. */

body.template-ski-trip-itinerary
.itinerary-intro-card,

body.template-ski-trip-itinerary
.itinerary-card,

body.template-ski-trip-itinerary
.itinerary-related,

body.template-ski-trip-itinerary
.itinerary-cta {
    border:
        1px solid
        rgba(15,23,42,.10);

    background:
        rgba(255,255,255,.64);

    color: #172033;

    box-shadow:
        0 10px 28px
        rgba(8,18,34,.07);

    backdrop-filter:
        blur(8px);
}

body.template-ski-trip-itinerary
.itinerary-intro-card {
    background:
        rgba(255,255,255,.78);
}

body.template-ski-trip-itinerary
.itinerary-intro-title,

body.template-ski-trip-itinerary
.itinerary-card h2,

body.template-ski-trip-itinerary
.itinerary-related h2,

body.template-ski-trip-itinerary
.itinerary-cta h2 {
    color: #172033;
}

body.template-ski-trip-itinerary
.itinerary-lead,

body.template-ski-trip-itinerary
.itinerary-card p,

body.template-ski-trip-itinerary
.itinerary-card li,

body.template-ski-trip-itinerary
.itinerary-related p,

body.template-ski-trip-itinerary
.itinerary-cta p {
    color:
        rgba(23,32,51,.83);
}

body.template-ski-trip-itinerary
.itinerary-kicker {
    color: #e8583f;
}

body.template-ski-trip-itinerary
.itinerary-related a,

body.template-ski-trip-itinerary
.itinerary-related a:visited {
    color: #d94d36;
}

body.template-ski-trip-itinerary
.itinerary-cta {
    border:
        2px solid
        #ff6f52;

    background:
        rgba(255,255,255,.76);
}


/* ----------------------------------------------------------
   RAIL: REAL TOOLS
   ---------------------------------------------------------- */

.planner-tool-link.is-current {
    background:
        rgba(255,90,61,.10);

    box-shadow:
        inset 3px 0 0
        #ff5a3d;
}


/* ----------------------------------------------------------
   RAIL: SEPARATE PLANNING GUIDES
   ---------------------------------------------------------- */

.planner-rail-title--small {
    font-size: 17px;
}

.planner-guides-card {
    background:
        linear-gradient(
            145deg,
            rgba(246,248,251,.96),
            rgba(238,242,247,.92)
        );
}

.planner-guide-links {
    display: grid;
    gap: 8px;
}

.planner-guide-link {
    display: grid;

    grid-template-columns:
        minmax(0,1fr)
        auto;

    gap: 12px;
    align-items: center;

    padding: 12px 8px;

    border-radius: 12px;

    color: #172033;
    text-decoration: none;

    transition:
        background .16s ease,
        transform .16s ease;
}

.planner-guide-link
+ .planner-guide-link {
    border-top:
        1px solid
        rgba(15,23,42,.08);
}

.planner-guide-link:hover,
.planner-guide-link:focus {
    background:
        rgba(255,90,61,.08);

    color: #172033;

    text-decoration: none;

    transform:
        translateX(2px);
}

.planner-guide-link.is-current {
    background:
        rgba(255,90,61,.09);
}

.planner-guide-link strong {
    display: block;

    margin:
        3px 0;

    color: #172033;

    font-size: 13px;
    font-weight: 900;
    line-height: 1.3;
}

.planner-guide-link small:not(.planner-guide-badge) {
    display: block;

    color:
        rgba(23,32,51,.66);

    font-size: 11px;
    line-height: 1.35;
}

.planner-guide-badge {
    display: inline-block;

    padding:
        3px 6px;

    border:
        1px solid
        rgba(255,90,61,.30);

    border-radius:
        999px;

    color:
        #e8583f;

    font-size:
        9px;

    font-weight:
        900;

    letter-spacing:
        .08em;
}


/* ----------------------------------------------------------
   MOBILE / TABLET
   ---------------------------------------------------------- */

@media (max-width: 1100px) {
    body.template-ski-trip-itinerary
    .itinerary-page-back,

    body.template-ski-trip-itinerary
    #resort-back.itinerary-page-back {
        padding:
            22px;
    }
}

@media (max-width: 760px) {
    body.template-plannerpage
    .planner-page-hero
    .main-text-resorts,

    body.template-ski-trip-itinerary
    .itinerary-page-hero
    .main-text-resorts {
        font-size:
            clamp(
                2rem,
                9vw,
                2.8rem
            );
    }

    body.template-ski-trip-itinerary
    .itinerary-page-back,

    body.template-ski-trip-itinerary
    #resort-back.itinerary-page-back {
        padding: 16px;
        border-radius: 16px;
    }
}


/* ==========================================================
   SNOWEXP_PLANNER_VIEWPORT_RAIL_V3
   Uses the SAME live layout states as the resort facts rail.
   ========================================================== */

.planner-tools-rail__support {
    display: contents;
}


/*
 * Affiliate renderer should not introduce invisible vertical
 * margins inside the measured support unit.
 */
.planner-tools-rail__affiliate {
    display: block;
    width: 100%;
    margin: 0 !important;
    padding: 0;
}

.planner-tools-rail__affiliate
.snowexp-affiliate-wrap {
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
}

.planner-tools-rail__affiliate
.snowexp-affiliate-grid,

.planner-tools-rail__affiliate
.snowexp-affiliate-card,

.planner-tools-rail__affiliate
.snowexp-affiliate-banner-card {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}


/* Guide rows now use the same icon / copy / arrow geometry. */

.planner-guide-link {
    grid-template-columns:
        38px
        minmax(0, 1fr)
        auto;

    gap: 11px;
}

.planner-guide-copy {
    min-width: 0;
}

.planner-guide-copy strong {
    display: block;
    margin: 0 0 3px;

    color: #172033;
    font-size: 13px;
    font-weight: 900;
    line-height: 1.3;
}

.planner-guide-copy small {
    display: block;

    color: rgba(23,32,51,.66);
    font-size: 11px;
    line-height: 1.35;
}

.planner-guide-icon {
    align-self: center;
}


/*
 * The old GUIDE sticker is no longer used.
 */
.planner-guide-badge {
    display: none !important;
}


/* ----------------------------------------------------------
   LIVE VIEWPORT-AWARE PLANNER RAIL
   ---------------------------------------------------------- */

@media (min-width: 1101px) {

    /*
     * Neutral state.
     * JS explicitly selects the appropriate live mode.
     */
    .planner-page-columns
        > .planner-tools-rail,

    .itinerary-page-layout
        > .planner-tools-rail {
        position: static;

        top: auto;

        width: auto;
        max-width: none;

        height: auto;
        max-height: none;

        overflow: visible;

        align-self: start;
    }


    /*
     * Undo the earlier fixed sticky rule.
     * Sticky ownership now belongs to the JS mode.
     */
    .planner-page-columns
        > .planner-tools-rail
        .planner-tools-rail__sticky,

    .itinerary-page-layout
        > .planner-tools-rail
        .planner-tools-rail__sticky {
        position: static;
        top: auto;
    }


    /* ======================================================
       STACK
       Complete Tools -> Advert -> Guides unit fits.
       ====================================================== */

    .planner-page-columns
        > .planner-tools-rail[data-rail-mode="stack"],

    .itinerary-page-layout
        > .planner-tools-rail[data-rail-mode="stack"] {
        position: sticky;

        top:
            var(
                --planner-rail-top,
                86px
            );

        height: fit-content;
    }


    .planner-page-columns
        > .planner-tools-rail[data-rail-mode="stack"]
        .planner-tools-rail__sticky,

    .itinerary-page-layout
        > .planner-tools-rail[data-rail-mode="stack"]
        .planner-tools-rail__sticky {
        display: grid;
        grid-template-columns: 1fr;
        gap: 18px;
    }


    /* ======================================================
       SPLIT STACK
       Same resort behaviour:
       primary module left, support unit right.
       ====================================================== */

    .planner-page-columns
        > .planner-tools-rail[data-rail-mode="split-stack"],

    .itinerary-page-layout
        > .planner-tools-rail[data-rail-mode="split-stack"] {
        position: sticky;

        top:
            var(
                --planner-rail-top,
                86px
            );

        width:
            calc(
                320px +
                16px +
                var(
                    --planner-rail-extra-width,
                    320px
                )
            );

        max-width: none;

        height: fit-content;

        z-index: 4;
    }


    .planner-page-columns
        > .planner-tools-rail[data-rail-mode="split-stack"]
        .planner-tools-rail__sticky,

    .itinerary-page-layout
        > .planner-tools-rail[data-rail-mode="split-stack"]
        .planner-tools-rail__sticky {
        display: grid;

        grid-template-columns:
            320px
            minmax(0, 1fr);

        grid-template-rows: auto;

        column-gap: 16px;
        row-gap: 0;

        align-items: start;
    }


    .planner-page-columns
        > .planner-tools-rail[data-rail-mode="split-stack"]
        .planner-tools-card,

    .itinerary-page-layout
        > .planner-tools-rail[data-rail-mode="split-stack"]
        .planner-tools-card {
        grid-column: 1;
        grid-row: 1;

        position: static;
        overflow: visible;
    }


    .planner-page-columns
        > .planner-tools-rail[data-rail-mode="split-stack"]
        .planner-tools-rail__support,

    .itinerary-page-layout
        > .planner-tools-rail[data-rail-mode="split-stack"]
        .planner-tools-rail__support {
        display: grid;

        grid-column: 2;
        grid-row: 1;

        grid-template-columns: 1fr;
        gap: 12px;

        min-width: 0;

        align-self: start;
    }


    /* ======================================================
       SUPPORT STICKY / AD STICKY
       Tools can scroll away; commercial/support content stays.
       ====================================================== */

    .planner-page-columns
        > .planner-tools-rail[data-rail-mode="support-sticky"],

    .planner-page-columns
        > .planner-tools-rail[data-rail-mode="ad-sticky"],

    .itinerary-page-layout
        > .planner-tools-rail[data-rail-mode="support-sticky"],

    .itinerary-page-layout
        > .planner-tools-rail[data-rail-mode="ad-sticky"] {
        position: relative;

        align-self: stretch;

        height: auto;
        max-height: none;

        overflow: visible;
    }


    .planner-page-columns
        > .planner-tools-rail[data-rail-mode="support-sticky"]
        .planner-tools-rail__sticky,

    .planner-page-columns
        > .planner-tools-rail[data-rail-mode="ad-sticky"]
        .planner-tools-rail__sticky,

    .itinerary-page-layout
        > .planner-tools-rail[data-rail-mode="support-sticky"]
        .planner-tools-rail__sticky,

    .itinerary-page-layout
        > .planner-tools-rail[data-rail-mode="ad-sticky"]
        .planner-tools-rail__sticky {
        display: flex;

        flex-direction: column;

        min-height: 100%;
        height: 100%;

        gap: 18px;

        overflow: visible;
    }


    .planner-page-columns
        > .planner-tools-rail[data-rail-mode="support-sticky"]
        .planner-tools-card,

    .planner-page-columns
        > .planner-tools-rail[data-rail-mode="ad-sticky"]
        .planner-tools-card,

    .itinerary-page-layout
        > .planner-tools-rail[data-rail-mode="support-sticky"]
        .planner-tools-card,

    .itinerary-page-layout
        > .planner-tools-rail[data-rail-mode="ad-sticky"]
        .planner-tools-card {
        position: static;

        flex: 0 0 auto;

        height: auto;
        max-height: none;

        overflow: visible;
    }


    .planner-page-columns
        > .planner-tools-rail[data-rail-mode="support-sticky"]
        .planner-tools-rail__support,

    .planner-page-columns
        > .planner-tools-rail[data-rail-mode="ad-sticky"]
        .planner-tools-rail__support,

    .itinerary-page-layout
        > .planner-tools-rail[data-rail-mode="support-sticky"]
        .planner-tools-rail__support,

    .itinerary-page-layout
        > .planner-tools-rail[data-rail-mode="ad-sticky"]
        .planner-tools-rail__support {
        display: grid;

        grid-template-columns: 1fr;
        gap: 12px;

        position: sticky;

        top:
            var(
                --planner-rail-top,
                86px
            );

        flex: 0 0 auto;

        z-index: 5;
    }


    /*
     * Same principle as the resort rail:
     * if the viewport is extremely short, preserve the advert
     * and allow the supplementary guide card to flow away.
     */
    .planner-page-columns
        > .planner-tools-rail[data-rail-mode="ad-sticky"]
        .planner-guides-card,

    .itinerary-page-layout
        > .planner-tools-rail[data-rail-mode="ad-sticky"]
        .planner-guides-card {
        display: none;
    }


    /* ======================================================
       FLOW
       Nothing is cropped.
       ====================================================== */

    .planner-page-columns
        > .planner-tools-rail[data-rail-mode="flow"],

    .itinerary-page-layout
        > .planner-tools-rail[data-rail-mode="flow"] {
        position: static;

        width: auto;

        height: auto;
        max-height: none;

        overflow: visible;
    }


    .planner-page-columns
        > .planner-tools-rail[data-rail-mode="flow"]
        .planner-tools-rail__sticky,

    .itinerary-page-layout
        > .planner-tools-rail[data-rail-mode="flow"]
        .planner-tools-rail__sticky {
        display: grid;
        grid-template-columns: 1fr;
    }
}


/* ----------------------------------------------------------
   ITINERARY PAGE — BODY / UTILITY SEPARATION
   ---------------------------------------------------------- */

/*
 * Do not make the entire body + rail one large pale slab.
 * The editorial area owns the mountain/glass presentation.
 * The utility rail gets a stable neutral surface of its own.
 */

body.template-ski-trip-itinerary
.itinerary-page-back,

body.template-ski-trip-itinerary
#resort-back.itinerary-page-back {
    padding: 0;

    border: 0;

    background: transparent;

    box-shadow: none;

    backdrop-filter: none;
}


body.template-ski-trip-itinerary
.itinerary-main-column {
    padding: 28px;

    border:
        1px solid
        rgba(255,255,255,.28);

    border-radius: 20px;

    background:
        rgba(226,231,237,.88);

    box-shadow:
        0 18px 46px
        rgba(8,18,34,.18);

    backdrop-filter:
        blur(13px);

    box-sizing:
        border-box;
}


body.template-ski-trip-itinerary
.itinerary-page-layout
> .planner-tools-rail {
    padding: 18px;

    border:
        1px solid
        rgba(15,23,42,.08);

    border-radius: 20px;

    background:
        rgba(238,241,245,.98);

    box-shadow:
        0 18px 46px
        rgba(8,18,34,.14);

    box-sizing:
        border-box;
}


/*
 * Editorial modules should not be stark white against the
 * new light body surface.
 */
body.template-ski-trip-itinerary
.itinerary-intro-card,

body.template-ski-trip-itinerary
.itinerary-card,

body.template-ski-trip-itinerary
.itinerary-related {
    background:
        rgba(247,249,252,.92) !important;

    border-color:
        rgba(15,23,42,.09) !important;
}


/*
 * CTA gets its own slightly stronger surface.
 */
body.template-ski-trip-itinerary
.itinerary-cta {
    background:
        rgba(241,244,248,.97) !important;

    border:
        2px solid
        #ff6f52 !important;
}


/*
 * Old landing-page CSS assumed dark translucent cards.
 * Explicitly own button colours on the new light layout.
 */
body.template-ski-trip-itinerary
.itinerary-button,

body.template-ski-trip-itinerary
.itinerary-button:visited {
    border:
        1px solid
        #f18459;

    background:
        #f28b60;

    color:
        #111827 !important;

    box-shadow:
        0 7px 18px
        rgba(242,139,96,.22);
}


body.template-ski-trip-itinerary
.itinerary-button-secondary,

body.template-ski-trip-itinerary
.itinerary-button-secondary:visited {
    border:
        1px solid
        #172033 !important;

    background:
        #172033 !important;

    color:
        #ffffff !important;

    box-shadow:
        0 7px 18px
        rgba(23,32,51,.18);
}


body.template-ski-trip-itinerary
.itinerary-button-secondary:hover,

body.template-ski-trip-itinerary
.itinerary-button-secondary:focus {
    background:
        #26344d !important;

    color:
        #ffffff !important;
}


/* ----------------------------------------------------------
   MOBILE / TABLET
   ---------------------------------------------------------- */

@media (max-width: 1100px) {

    .planner-tools-rail__support {
        display: contents;
    }

    body.template-ski-trip-itinerary
    .itinerary-main-column {
        padding: 22px;
    }

    body.template-ski-trip-itinerary
    .itinerary-page-layout
    > .planner-tools-rail {
        padding: 16px;
    }
}


@media (max-width: 760px) {

    body.template-ski-trip-itinerary
    .itinerary-main-column {
        padding: 16px;

        border-radius: 16px;
    }

    body.template-ski-trip-itinerary
    .itinerary-page-layout
    > .planner-tools-rail {
        padding: 12px;

        border-radius: 16px;
    }
}

/* END SNOWEXP_PLANNER_VIEWPORT_RAIL_V3 */


/* ==========================================================
   SNOWEXP_ITINERARY_GUIDE_FINAL_SURFACE
   Planner itself is intentionally untouched.
   ========================================================== */


/*
 * Exact established Trip Planner panel treatment.
 */
body.template-ski-trip-itinerary {
    --planner-product-surface:
        linear-gradient(
            145deg,
            rgba(255,255,255,.93),
            rgba(255,255,255,.78)
        );
}


/* ----------------------------------------------------------
   BODY COLUMN
   ---------------------------------------------------------- */

/*
 * Keep one restrained body container so the content still
 * separates from the mountain background, but make it much
 * closer to the Planner rather than a flat opaque slab.
 */
body.template-ski-trip-itinerary
.itinerary-main-column {
    padding: 28px;

    border:
        1px solid
        rgba(255,255,255,.42);

    border-radius:
        22px;

    background:
        rgba(216,221,227,.72);

    box-shadow:
        0 18px 46px
        rgba(8,18,34,.16);

    backdrop-filter:
        blur(9px);
}


/*
 * All editorial cards use the same translucent treatment as
 * #planner-index-back rather than opaque white.
 */
body.template-ski-trip-itinerary
.itinerary-intro-card,

body.template-ski-trip-itinerary
.itinerary-card,

body.template-ski-trip-itinerary
.itinerary-related {
    background:
        var(
            --planner-product-surface
        ) !important;

    border:
        1px solid
        rgba(255,255,255,.52) !important;

    box-shadow:
        0 12px 30px
        rgba(0,0,0,.08) !important;

    backdrop-filter:
        blur(6px);
}


/* ----------------------------------------------------------
   REMOVE UNWANTED OUTER RAIL / "RESORT BACK"
   ---------------------------------------------------------- */

body.template-ski-trip-itinerary
.itinerary-page-layout
> .planner-tools-rail {
    padding: 0 !important;

    border: 0 !important;

    border-radius: 0 !important;

    background:
        transparent !important;

    box-shadow:
        none !important;

    backdrop-filter:
        none !important;
}


/*
 * Individual rail cards themselves should match the Planner
 * panel, not be plain white.
 */
body.template-ski-trip-itinerary
.planner-rail-card {
    background:
        var(
            --planner-product-surface
        ) !important;

    border:
        1px solid
        rgba(255,255,255,.52);

    box-shadow:
        0 14px 34px
        rgba(0,0,0,.10);

    backdrop-filter:
        blur(8px);
}


/*
 * Current row may retain its subtle coral tint, but not become
 * a white tile.
 */
body.template-ski-trip-itinerary
.planner-tool-link.is-current,

body.template-ski-trip-itinerary
.planner-guide-link.is-current {
    background:
        rgba(255,111,82,.11);
}


/* ----------------------------------------------------------
   CTA — PURPOSEFUL CONTRAST
   ---------------------------------------------------------- */

body.template-ski-trip-itinerary
.itinerary-cta {
    position: relative;

    overflow: hidden;

    padding:
        32px 34px;

    border:
        1px solid
        rgba(255,255,255,.15) !important;

    border-radius:
        20px;

    background:
        linear-gradient(
            135deg,
            rgba(15,23,42,.98),
            rgba(28,39,58,.97)
        ) !important;

    color:
        #ffffff;

    box-shadow:
        0 18px 42px
        rgba(8,18,34,.20);

    text-align:
        left;
}


body.template-ski-trip-itinerary
.itinerary-cta::after {
    content: "";

    position: absolute;

    right: -80px;
    top: -100px;

    width: 260px;
    height: 260px;

    border-radius: 50%;

    background:
        radial-gradient(
            circle,
            rgba(255,111,82,.17),
            rgba(255,111,82,0) 68%
        );

    pointer-events: none;
}


body.template-ski-trip-itinerary
.itinerary-cta__copy {
    position: relative;
    z-index: 1;

    max-width: 760px;
}


body.template-ski-trip-itinerary
.itinerary-cta__kicker {
    margin:
        0 0 7px;

    color:
        #ff8f71 !important;

    font-size:
        11px;

    font-weight:
        900;

    letter-spacing:
        .12em;

    text-transform:
        uppercase;
}


body.template-ski-trip-itinerary
.itinerary-cta h2 {
    margin:
        0 0 10px;

    color:
        #ffffff !important;

    font-size:
        clamp(
            1.55rem,
            2.2vw,
            2.15rem
        );

    line-height:
        1.12;
}


body.template-ski-trip-itinerary
.itinerary-cta
.itinerary-cta__copy
> p:not(.itinerary-cta__kicker) {
    max-width:
        720px;

    margin:
        0;

    color:
        rgba(255,255,255,.82) !important;

    font-size:
        1rem;

    line-height:
        1.6;
}


body.template-ski-trip-itinerary
.itinerary-actions {
    position: relative;
    z-index: 1;

    justify-content:
        flex-start;

    margin-top:
        22px;
}


body.template-ski-trip-itinerary
.itinerary-button {
    display:
        inline-flex;

    align-items:
        center;

    justify-content:
        center;

    gap:
        9px;

    min-height:
        46px;

    padding:
        11px 19px;

    border-radius:
        12px;

    font-weight:
        900;

    line-height:
        1.2;

    transition:
        transform .16s ease,
        box-shadow .16s ease,
        background .16s ease;
}


body.template-ski-trip-itinerary
.itinerary-button-primary,

body.template-ski-trip-itinerary
.itinerary-button-primary:visited {
    border:
        1px solid
        #f28b60 !important;

    background:
        #f28b60 !important;

    color:
        #111827 !important;

    box-shadow:
        0 9px 22px
        rgba(242,139,96,.23);
}


body.template-ski-trip-itinerary
.itinerary-button-primary:hover,

body.template-ski-trip-itinerary
.itinerary-button-primary:focus {
    background:
        #ff9a72 !important;

    color:
        #111827 !important;

    transform:
        translateY(-1px);
}


body.template-ski-trip-itinerary
.itinerary-button-secondary,

body.template-ski-trip-itinerary
.itinerary-button-secondary:visited {
    border:
        1px solid
        rgba(255,255,255,.68) !important;

    background:
        transparent !important;

    color:
        #ffffff !important;

    box-shadow:
        none;
}


body.template-ski-trip-itinerary
.itinerary-button-secondary:hover,

body.template-ski-trip-itinerary
.itinerary-button-secondary:focus {
    border-color:
        #ffffff !important;

    background:
        rgba(255,255,255,.10) !important;

    color:
        #ffffff !important;

    transform:
        translateY(-1px);
}


body.template-ski-trip-itinerary
.itinerary-button__icon {
    font-size:
        1rem;

    line-height:
        1;
}


body.template-ski-trip-itinerary
.itinerary-cta__note {
    position:
        relative;

    z-index:
        1;

    margin:
        16px 0 0 !important;

    color:
        rgba(255,255,255,.60) !important;

    font-size:
        .83rem;

    text-align:
        left;
}


/* ----------------------------------------------------------
   MOBILE
   ---------------------------------------------------------- */

@media (max-width: 760px) {

    body.template-ski-trip-itinerary
    .itinerary-main-column {
        padding:
            16px;
    }

    body.template-ski-trip-itinerary
    .itinerary-cta {
        padding:
            25px 21px;
    }

    body.template-ski-trip-itinerary
    .itinerary-actions {
        display:
            grid;

        grid-template-columns:
            1fr;
    }

    body.template-ski-trip-itinerary
    .itinerary-button {
        width:
            100%;
    }
}

/* END SNOWEXP_ITINERARY_GUIDE_FINAL_SURFACE */


/* ==========================================================
   SNOWEXP_ITINERARY_VISUAL_MATCH_V2
   ========================================================== */


/* ----------------------------------------------------------
   STANDARD SNOW EXP BREADCRUMBS
   Exact visual contract used by resort / SEO pages.
   ---------------------------------------------------------- */

body.template-ski-trip-itinerary
.snowexp-breadcrumbs {
    margin: 0 0 18px;

    font-size: 13px;
    line-height: 1.4;
}


body.template-ski-trip-itinerary
.snowexp-breadcrumbs-list {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    align-items: center;

    list-style: none;

    margin: 0;
    padding: 0;
}


body.template-ski-trip-itinerary
.snowexp-breadcrumbs-item {
    display: inline-flex;
    align-items: center;
    gap: 6px;

    color: rgba(0,0,0,.52);
}


body.template-ski-trip-itinerary
.snowexp-breadcrumbs-link,

body.template-ski-trip-itinerary
.snowexp-breadcrumbs-link:visited {
    color: rgba(0,0,0,.58);

    text-decoration: none;

    border-bottom:
        1px solid
        transparent;

    transition:
        color .16s ease,
        border-color .16s ease;
}


body.template-ski-trip-itinerary
.snowexp-breadcrumbs-link:hover,

body.template-ski-trip-itinerary
.snowexp-breadcrumbs-link:focus {
    color: rgba(0,0,0,.78);

    border-bottom-color:
        rgba(0,0,0,.22);

    text-decoration: none;
}


body.template-ski-trip-itinerary
.snowexp-breadcrumbs-separator {
    color: rgba(0,0,0,.26);
}


body.template-ski-trip-itinerary
.snowexp-breadcrumbs-current {
    color: rgba(0,0,0,.42);
}


/* ----------------------------------------------------------
   REMOVE OLD CUSTOM BREADCRUMB VISUALS
   ---------------------------------------------------------- */

body.template-ski-trip-itinerary
.itinerary-breadcrumbs {
    all: unset;
}


/* ----------------------------------------------------------
   SURFACE COLOURS
   Match the soft grey character of the Trip Planner instead
   of producing bright white nested cards.
   ---------------------------------------------------------- */

body.template-ski-trip-itinerary {
    --itinerary-panel-surface:
        linear-gradient(
            145deg,
            rgba(229,232,236,.96),
            rgba(215,220,226,.92)
        );

    --itinerary-card-surface:
        linear-gradient(
            145deg,
            rgba(238,240,243,.88),
            rgba(222,226,231,.82)
        );
}


/*
 * Stronger backing so the mountain image does not wash through
 * the editorial body as much.
 */
body.template-ski-trip-itinerary
.itinerary-main-column {
    background:
        linear-gradient(
            145deg,
            rgba(205,210,217,.94),
            rgba(190,197,205,.91)
        ) !important;

    border:
        1px solid
        rgba(255,255,255,.38);

    backdrop-filter:
        blur(12px);
}


/*
 * Editorial subcards become softly grey rather than white.
 */
body.template-ski-trip-itinerary
.itinerary-intro-card,

body.template-ski-trip-itinerary
.itinerary-card,

body.template-ski-trip-itinerary
.itinerary-related {
    background:
        var(
            --itinerary-card-surface
        ) !important;

    border:
        1px solid
        rgba(255,255,255,.40) !important;

    box-shadow:
        0 10px 26px
        rgba(8,18,34,.08) !important;
}


/*
 * Rail cards use the SAME surface family.
 */
body.template-ski-trip-itinerary
.planner-rail-card {
    background:
        var(
            --itinerary-panel-surface
        ) !important;

    border:
        1px solid
        rgba(255,255,255,.42) !important;
}


/*
 * The large intro card should be only slightly more prominent,
 * not bright white.
 */
body.template-ski-trip-itinerary
.itinerary-intro-card {
    background:
        linear-gradient(
            145deg,
            rgba(235,238,241,.94),
            rgba(220,225,230,.88)
        ) !important;
}


/* ----------------------------------------------------------
   CTA
   Coral is the primary action, so use strong white text.
   ---------------------------------------------------------- */

body.template-ski-trip-itinerary
.itinerary-button-primary,

body.template-ski-trip-itinerary
.itinerary-button-primary:visited {
    background:
        #ef875d !important;

    border-color:
        #ef875d !important;

    color:
        #ffffff !important;

    text-shadow:
        0 1px 1px
        rgba(0,0,0,.12);
}


body.template-ski-trip-itinerary
.itinerary-button-primary:hover,

body.template-ski-trip-itinerary
.itinerary-button-primary:focus {
    background:
        #f69670 !important;

    border-color:
        #f69670 !important;

    color:
        #ffffff !important;
}


/* END SNOWEXP_ITINERARY_VISUAL_MATCH_V2 */


/* ==========================================================
   SNOWEXP_ITINERARY_BREADCRUMB_CORAL_FINAL
   Keep standard breadcrumb geometry; only restore brand colour
   for clickable links.
   ========================================================== */

body.template-ski-trip-itinerary
.snowexp-breadcrumbs-link,

body.template-ski-trip-itinerary
.snowexp-breadcrumbs-link:visited {
    color: #e8583f;
}


body.template-ski-trip-itinerary
.snowexp-breadcrumbs-link:hover,

body.template-ski-trip-itinerary
.snowexp-breadcrumbs-link:focus {
    color: #c8442f;

    border-bottom-color:
        rgba(200,68,47,.32);
}


/*
 * Deliberately leave these on the standard muted treatment:
 * - separators
 * - current page
 */

/* END SNOWEXP_ITINERARY_BREADCRUMB_CORAL_FINAL */


/* ==========================================================
   SNOWEXP_PLANNER_RESPONSIVE_GAP_FIX_V1
   ========================================================== */


/* ----------------------------------------------------------
   INTERMEDIATE DESKTOP
   Keep the useful right rail, but stop Explore routes being
   squeezed out of the main Planner panel.
   ---------------------------------------------------------- */

@media
    (min-width: 1281px)
    and (max-width: 1420px) {

    body.template-plannerpage
    .planner-form-row {
        display: grid !important;

        grid-template-columns:
            minmax(0, 1fr)
            minmax(0, 1fr) !important;

        gap:
            14px 16px;

        align-items:
            end;
    }


    body.template-plannerpage
    .planner-form-row
    .planner-field {
        min-width: 0;
        width: 100%;
    }


    body.template-plannerpage
    .planner-form-row
    .planner-select {
        width: 100%;
        max-width: 100%;
    }


    body.template-plannerpage
    .planner-form-row
    .planner-actions {
        grid-column:
            1 / -1;

        display: flex !important;

        justify-content:
            flex-end;

        align-items:
            center;

        flex-wrap:
            wrap;

        gap:
            10px;

        min-width:
            0;
    }


    body.template-plannerpage
    .planner-form-row
    .planner-main-cta {
        width: auto;
        max-width: 100%;

        white-space: nowrap;
    }
}


/* ----------------------------------------------------------
   SMALL LAPTOP / TABLET
   Rail belongs BELOW the complete main content rather than
   consuming ~320px while the body gets squeezed.
   ---------------------------------------------------------- */

@media (max-width: 1280px) {

    body.template-plannerpage
    .planner-page-columns,

    body.template-ski-trip-itinerary
    .itinerary-page-layout {
        display: grid !important;

        grid-template-columns:
            minmax(0, 1fr) !important;

        gap:
            28px;
    }


    /*
     * Because the rail follows the main/article column in the
     * DOM, normal one-column grid flow puts it at the bottom:
     *
     * Planner:
     * planner panel -> advert -> inspiration -> rail
     *
     * Guides:
     * complete editorial body / CTA -> rail
     */
    body.template-plannerpage
    .planner-page-columns
    > .planner-tools-rail,

    body.template-ski-trip-itinerary
    .itinerary-page-layout
    > .planner-tools-rail {
        position: static !important;

        grid-column: 1 !important;
        grid-row: auto !important;

        width: 100% !important;
        max-width: none !important;

        height: auto !important;
        max-height: none !important;

        margin: 0 !important;

        align-self:
            auto !important;

        overflow:
            visible !important;
    }


    body.template-plannerpage
    .planner-tools-rail__sticky,

    body.template-ski-trip-itinerary
    .planner-tools-rail__sticky {
        position:
            static !important;

        top:
            auto !important;

        display:
            grid !important;

        grid-template-columns:
            minmax(0, 1fr) !important;

        gap:
            18px !important;

        width:
            100%;

        height:
            auto !important;

        min-height:
            0 !important;
    }


    /*
     * At this size Advert + Guides should remain ordinary
     * vertically stacked content, not a second side column.
     */
    body.template-plannerpage
    .planner-tools-rail__support,

    body.template-ski-trip-itinerary
    .planner-tools-rail__support {
        position:
            static !important;

        display:
            grid !important;

        grid-template-columns:
            minmax(0, 1fr) !important;

        gap:
            18px !important;

        width:
            100%;

        top:
            auto !important;
    }


    /*
     * Remove any dimensions left behind by the live JS mode
     * while switching from desktop into document flow.
     */
    body.template-plannerpage
    .planner-tools-rail,

    body.template-ski-trip-itinerary
    .planner-tools-rail {
        --planner-rail-extra-width:
            0px;
    }
}


/* ----------------------------------------------------------
   PLANNER FORM ON STACKED-RAIL WIDTHS
   There is now plenty of body width, so keep both selectors
   together but give the action its own safe row.
   ---------------------------------------------------------- */

@media
    (min-width: 761px)
    and (max-width: 1280px) {

    body.template-plannerpage
    .planner-form-row {
        display:
            grid !important;

        grid-template-columns:
            minmax(0, 1fr)
            minmax(0, 1fr) !important;

        gap:
            14px 16px;

        align-items:
            end;
    }


    body.template-plannerpage
    .planner-form-row
    .planner-field {
        min-width: 0;
    }


    body.template-plannerpage
    .planner-form-row
    .planner-select {
        width: 100%;
        max-width: 100%;
    }


    body.template-plannerpage
    .planner-form-row
    .planner-actions {
        grid-column:
            1 / -1;

        display:
            flex !important;

        justify-content:
            flex-start;

        flex-wrap:
            wrap;

        gap:
            10px;
    }
}


/* ----------------------------------------------------------
   TRUE MOBILE
   ---------------------------------------------------------- */

@media (max-width: 760px) {

    body.template-plannerpage
    .planner-form-row {
        display:
            grid !important;

        grid-template-columns:
            minmax(0, 1fr) !important;

        gap:
            14px;
    }


    body.template-plannerpage
    .planner-form-row
    .planner-actions {
        grid-column:
            auto;

        display:
            grid !important;

        grid-template-columns:
            minmax(0, 1fr);

        gap:
            10px;
    }


    body.template-plannerpage
    .planner-main-cta,

    body.template-plannerpage
    .planner-clear-cta {
        width:
            100%;

        max-width:
            none;

        justify-content:
            center;
    }


    /*
     * Editorial guide cards should become a sensible single
     * reading column once the viewport is genuinely narrow.
     */
    body.template-ski-trip-itinerary
    .itinerary-grid {
        grid-template-columns:
            minmax(0, 1fr) !important;
    }
}

/* END SNOWEXP_PLANNER_RESPONSIVE_GAP_FIX_V1 */


/* ==========================================================
   SNOWEXP_PLANNER_CTA_WRAP_FINAL

   Do not guess another viewport breakpoint.

   While the side rail is active, the form itself decides
   whether the CTA fits. The two selectors flex; the CTA is
   the last item so it naturally drops to the next row first.
   ========================================================== */

@media (min-width: 1281px) {

    body.template-plannerpage
    .planner-form-row {
        display: flex !important;

        flex-wrap: wrap;

        align-items: flex-end;

        gap: 14px 16px;
    }


    body.template-plannerpage
    .planner-form-row
    .planner-field {
        flex:
            1 1 245px;

        min-width:
            220px;

        width:
            auto;

        max-width:
            none;
    }


    body.template-plannerpage
    .planner-form-row
    .planner-select {
        display:
            block;

        width:
            100%;

        max-width:
            100%;

        min-width:
            0;
    }


    body.template-plannerpage
    .planner-form-row
    .planner-actions {
        display:
            flex !important;

        flex:
            0 0 auto;

        align-items:
            center;

        justify-content:
            flex-end;

        gap:
            10px;

        min-width:
            0;

        margin-left:
            auto;
    }


    body.template-plannerpage
    .planner-form-row
    .planner-main-cta {
        flex:
            0 0 auto;

        width:
            auto;

        max-width:
            100%;

        min-width:
            0;

        white-space:
            nowrap;
    }


    /*
     * If the CTA has wrapped, margin-left:auto still keeps it
     * neatly aligned to the right edge of the form rather than
     * leaving it stranded mid-row.
     */
    body.template-plannerpage
    .planner-form-row
    .planner-actions:first-child {
        margin-left:
            auto;
    }
}

/* END SNOWEXP_PLANNER_CTA_WRAP_FINAL */


/* ==========================================================
   SNOWEXP_PLANNER_SEO_SUPPORT_AND_STACK_V1
   ========================================================== */


/* ----------------------------------------------------------
   SUPPORTING SEO / INTERNAL-LINK CARD
   ---------------------------------------------------------- */

body.template-plannerpage
.planner-seo-support-card {
    width: 100%;
    box-sizing: border-box;

    margin: 26px 0 0;
    padding: 24px 26px;

    border:
        1px solid
        rgba(255,255,255,.52);

    border-radius: 18px;

    background:
        linear-gradient(
            145deg,
            rgba(255,255,255,.93),
            rgba(255,255,255,.78)
        );

    box-shadow:
        0 12px 30px
        rgba(0,0,0,.09);

    backdrop-filter:
        blur(8px);

    color: #172033;
}


body.template-plannerpage
.planner-seo-support-card__kicker {
    margin:
        0 0 6px;

    color:
        #e8583f;

    font-size:
        11px;

    font-weight:
        900;

    letter-spacing:
        .11em;

    text-transform:
        uppercase;
}


body.template-plannerpage
.planner-seo-support-card h2 {
    margin:
        0 0 12px;

    color:
        #172033;

    font-size:
        clamp(
            1.35rem,
            2vw,
            1.8rem
        );

    line-height:
        1.15;
}


body.template-plannerpage
.planner-seo-support-card p {
    margin:
        0 0 11px;

    color:
        rgba(23,32,51,.82);

    font-size:
        .98rem;

    line-height:
        1.62;
}


body.template-plannerpage
.planner-seo-support-card p:last-child {
    margin-bottom:
        0;
}


body.template-plannerpage
.planner-seo-support-card a,

body.template-plannerpage
.planner-seo-support-card a:visited {
    color:
        #e8583f;

    font-weight:
        750;

    text-decoration:
        none;

    border-bottom:
        1px solid
        rgba(232,88,63,.30);
}


body.template-plannerpage
.planner-seo-support-card a:hover,

body.template-plannerpage
.planner-seo-support-card a:focus {
    color:
        #c8442f;

    border-bottom-color:
        #c8442f;
}


/* ----------------------------------------------------------
   PLANNER-SPECIFIC EARLIER RAIL STACK
   The itinerary pages intentionally keep their 1280 breakpoint.
   ---------------------------------------------------------- */

@media (max-width: 1280px) {

    body.template-plannerpage
    .planner-page-columns {
        display:
            grid !important;

        grid-template-columns:
            minmax(0, 1fr) !important;

        gap:
            28px;
    }


    body.template-plannerpage
    .planner-page-columns
    > .planner-tools-rail {
        position:
            static !important;

        grid-column:
            1 !important;

        grid-row:
            auto !important;

        width:
            100% !important;

        max-width:
            none !important;

        height:
            auto !important;

        max-height:
            none !important;

        margin:
            0 !important;

        overflow:
            visible !important;

        align-self:
            auto !important;
    }


    body.template-plannerpage
    .planner-tools-rail__sticky {
        position:
            static !important;

        top:
            auto !important;

        display:
            grid !important;

        grid-template-columns:
            minmax(0, 1fr) !important;

        gap:
            18px !important;

        width:
            100%;

        height:
            auto !important;

        min-height:
            0 !important;
    }


    body.template-plannerpage
    .planner-tools-rail__support {
        position:
            static !important;

        top:
            auto !important;

        display:
            grid !important;

        grid-template-columns:
            minmax(0, 1fr) !important;

        gap:
            18px !important;

        width:
            100%;
    }


    /*
     * Inspiration remains inside planner-page-main.
     * Once the rail is below, the inspiration cards regain the
     * full main-column width rather than becoming tall/narrow.
     */
    body.template-plannerpage
    .planner-page-main
    .planner-inspiration-footer-buffer {
        width:
            100% !important;

        max-width:
            none !important;
    }
}


@media (max-width: 760px) {

    body.template-plannerpage
    .planner-seo-support-card {
        padding:
            20px;

        border-radius:
            16px;
    }
}

/* END SNOWEXP_PLANNER_SEO_SUPPORT_AND_STACK_V1 */
