body {
  background: #f8f8f8;
  font-family: "BentonSans", "Helvetica Neue", Helvetica, sans-serif;
  scroll-behavior: smooth;  
  --amex-onenav-height: 60px;
  --amex-subnav-height: 75px;
  --hero-height: calc(100vh - var(--amex-subnav-height) - var(--amex-onenav-height));
  --mobile-nav-trigger-height: 44px;

  @media (prefers-reduced-motion: reduce) {
    scroll-behavior: initial;
  }
}

:root {
  --DarkGray: #333;
  --dark-gray-2: #53565A;
  --btnGray: #53565A;
  --light-gray: #F6F6F6;
  --light-gray-2: #D9D9D6;
  --light-gray-3: #F2F2F2;
  --light-gray-4: #F5F5F5;
  --light-blue: #006FCF;
  --dark-blue: #00175A;
  --white: #fff;
  --Black: #000;
  --dark-bg: #121110;
  --fBenton: "BentonSans", "Helvetica Neue", Helvetica, sans-serif;
  --fGuardian: "Guardian Egyptian Web";

  --text-mobile-nav-light: #63666A;
  --text-mobile-nav-dark: #FFFFFF;
  --text-mobile-nav: var(--text-mobile-nav-light);

  --btn-primary-hv-light: var(--light-blue);
  --btn-primary-hv-dark: var(--white);
  --btn-bg-hv-light: var(--white);
  --btn-bg-hv-dark: #242221;

  --btn-primary-hv: var(--btn-primary-hv-light);
  --btn-bg-hv: var(--btn-bg-hv-light);

  --black-transparent: rgba(0, 0, 0, 0.65);
  color-scheme: light;
  --text-1-light: var(--DarkGray);
  --text-2-light: var(--dark-gray-2);
  --text-3-light: var(--dark-blue);
  --text-4-light: var(--white);
  --text-5-light: var(--light-blue);
  
  
  --text-1-dark: #ffffff;
  --text-2-dark: #ffffff;
  --text-3-dark: var(--white);
  --text-4-dark: var(--white);
  --text-5-dark: var(--white);

  --surface-1-light: var(--white);
  --surface-2-light: var(--light-gray);
  --surface-3-light: var(--light-gray-3);
  --surface-4-light: var(--light-gray-4);
  --surface-5-light: var(--light-blue);
  --surface-6-light: var(--dark-blue);
  --surface-7-light: #EDEDEE;
  --surface-8-light: #D9D9D9;
  --surface-9-light: #F5F5F5;

  --surface-1-dark: var(--dark-bg);
  --surface-2-dark: #242221;
  --surface-3-dark: #242221;
  --surface-4-dark: #242221;
  --surface-5-dark: var(--light-blue);
  --surface-6-dark: var(--dark-blue);
  --surface-7-dark: #242221;
  --surface-8-dark: #242221;
  --surface-9-dark: #242221;


  --text-1: var(--text-1-light);
  --text-2: var(--text-2-light);
  --text-3: var(--text-3-light);
  --text-4: var(--text-4-light);
  --text-5: var(--text-5-light);
  --surface-1: var(--surface-1-light);
  --surface-2: var(--surface-2-light);
  --surface-3: var(--surface-3-light);
  --surface-4: var(--surface-4-light);
  --surface-5: var(--surface-5-light);
  --surface-6: var(--surface-6-light);
  --surface-7: var(--surface-7-light);
  --surface-8: var(--surface-8-light);
  --surface-9: var(--surface-9-light);

  --shadow-xs-light: 0 2px 2px 0 rgba(0, 0, 0, 0.10);
  --text-shadow: 0 2px 2px rgba(0, 0, 0, 0.30);
  --shadow-xs: var(--shadow-xs-light);

  --border-defualt-light: var(--light-gray);
  --border-details: var(--light-gray-2);
  --border-default: var(--border-default-light);
  --border-nav-items: var(--light-gray-2);
  --border-card: #4A4C50;
  --border-accordion: var(--light-gray-2);
}

@media (prefers-color-scheme: dark) {
  :root {
    color-scheme: dark;

    --text-mobile-nav: var(--text-mobile-nav-dark);

    --btn-primary-hv: var(--btn-primary-hv-dark);
    --btn-bg-hv: var(--btn-bg-hv-dark);
    --text-1: var(--text-1-dark);
    --text-2: var(--text-2-dark);
    --text-3: var(--text-3-dark);
    --text-4: var(--text-4-dark);
    --text-5: var(--text-5-dark);

    --surface-1: var(--surface-1-dark);
    --surface-2: var(--surface-2-dark);
    --surface-3: var(--surface-3-dark);
    --surface-4: var(--surface-4-dark);
    --surface-5: var(--surface-5-dark);
    --surface-6: var(--surface-6-dark);
    --surface-7: var(--surface-7-dark);
    --surface-8: var(--surface-8-dark);
    --surface-9: var(--surface-9-dark);
  }
}

body.webview {
    --amex-onenav-height: 0px;
    --amex-subnav-height: 0px;
    background: #F5F2F0;

    @media (prefers-color-scheme: dark) {
        background: var(--surface-1-dark) !important;
    }

    .slide-body.surface-4,
    summary.surface-4 {
        background: var(--white);

        @media (prefers-color-scheme: dark) {
            background: var(--surface-4);
        }
    }

    .slide-statbox {
        background: #F5F2F0;

        @media (prefers-color-scheme: dark) {
            background: var(--surface-1);
        }
    }

    #dest-menu-btn {
        background: #F5F2F0;

        @media (prefers-color-scheme: dark) {
            background: var(--surface-9);
        }
    }

    .c-dest-footer__group {
        circle {
            fill: var(--white);

            @media (prefers-color-scheme: dark) {
                fill: #454D55;
            }
        }

        path {
            @media (prefers-color-scheme: dark) {
                fill: #fff;
            }
        }
    }
}

    @media (prefers-color-scheme: dark) {
        body.webview {
            background: var(--surface-1-dark) !important;
        }


    }

section {
    max-width: initial;
    width: initial;
    color: inherit;
}

@font-face {
	  font-family: 'Guardian Egyptian Web';
	  src: url('../fonts/GuardianEgyp-RegularIt-Web.woff') format('woff');
	  font-weight:  400;
	  font-style:   italic;
	  font-stretch: normal;
}

@font-face {
	  font-family: 'Guardian Egyptian Web';
	  src: url('../fonts/GuardianEgyp-MediumIt-Web.woff') format('woff');
	  font-weight:  500;
	  font-style:   italic;
	  font-stretch: normal;
}
@font-face {
  font-family: 'Guardian Egyptian Web';
  src: url('../fonts/GuardianEgyp-BoldIt-Web.woff') format('woff');
  font-weight:  700;
  font-style:   italic;
  font-stretch: normal;
}

html {
    scroll-behavior: smooth;
}

body {
  overflow-x: hidden;
  background: var(--surface-1);

  @media (width >= 768px) {
      --mobile-nav-trigger-height: 0px;
  }
}
body p {
  color: var(--text-1);
  font-family: var(--fBenton);
  font-size: calc(1.4rem * .625);
  font-weight: 350;
  line-height: calc(2.2rem * .625);
  margin-bottom: 1.1em;
  text-wrap: pretty;

  &.large {
    font-size: calc(1.8rem * .625);
    font-family: var(--fGuardian);
    font-weight: 400;
    line-height: 1.66;
  }

  &.medium {
    font-size: calc(1.8rem * .625);
    font-family: var(--Benton);
    font-weight: 500;
    line-height: 1.4;
  }

  &.disclaimer {
    font-size: calc(1.2rem * .625);
    font-weight: 350;
    line-height: 1.16;
  }
}
body p:last-of-type {
  margin-bottom: 0;
}
@media (width >= 768px) {
  body p {
    font-size: calc(1.8rem * .625);
    line-height: calc(2.8rem * .625);
    margin-bottom: 28px;

    &.large {
      font-size: calc(2.8rem * .625);
      line-height: 1.4;
    }

    &.medium {
        font-size: calc(1.8rem * .625);
    }
  }
}

a:focus-visible {
    outline: 1px dashed currentColor;
    outline-offset: 3px;
}

    .c-hero {
        position: relative;
    }

        .c-hero__grid {
            grid-template-rows: 1fr min-content;
            /* height: 820px; */
            height: var(--hero-height);
        }

        .c-hero__bg {
            grid-row: 1 / span 2;
            grid-column: bleed;
            z-index: 1;
            display: grid;

            figure {
                position: relative;
                height: 100%;
                grid-column: 1;
                grid-row: 1;
                clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
                
                &:not(:first-of-type) {
                    clip-path: polygon(100% 0%, 100% 0%, 100% 100%, 100% 100%);
                }
            }

            img {
                width: 100%;
                height: 100%;
                object-fit: cover;
                position: absolute;
                inset: 0;
            }

            figcaption {
                position: absolute;
                bottom: 10px;
                right: 10px;
                background: var(--black-transparent);
                display: flex;
                gap: 6px;
                padding-block: 6px;
                padding-inline: 8px;
                color: var(--white);
                font-size: calc(1.2rem * .625);
                font-weight: 500;
                line-height: 1;
                border-radius: 2px;
                z-index: 2;
            }
        }

        .c-hero__text {
            grid-row: 2;
            grid-column: content;
            z-index: 3;
            display: grid;
            gap: 20px;
            padding-block-end: 50px;

            @media (width >= 768px) {
                gap: 30px;
            }

            img {
                width: 100%;
                max-width: 268px;

                @media (width >= 768px) {
                    max-width: 348px;
                }
            }

            h1 {
                font-size: calc(2.5rem * .625);
                line-height: 1.2;
                text-transform: uppercase;
                font-weight: 700;
                display: flex;
                flex-flow: row wrap;
                gap: 14px;
                color: var(--white);
                margin-block: initial;

                @media (width >= 768px) {
                    font-size: calc(4.2rem * .625);
                    align-items: center;
                }

                span:first-of-type {
                    font-size: calc(5.6rem * .625);
                    font-family: var(--fGuardian);
                    font-weight: 400;
                    line-height: 1;

                    @media (width >= 768px) {
                        font-size: calc(12rem * .625);
                        line-height: 0.83;
                        margin-top: 0.1em;
                    }
                }
            }
        }

        .c-hero__bg-gradient {
            position: absolute;
            bottom: 0;
            left: 0;
            right: 0;
            z-index: 2;
            background: linear-gradient(180deg, rgba(0, 0, 0, 0.00) 0%, rgba(0, 0, 0, 0.60) 100%);
            height: 50%;
        }


    /* Utilities */
    .sr-only,
    .slick-sr-only {
        position: absolute;
        width: 1px;
        height: 1px;
        padding: 0;
        margin: -1px;
        overflow: hidden;
        clip: rect(0, 0, 0, 0);
        white-space: nowrap;
        border-width: 0;
    }

    .text-medium {
        font-weight: 500;
    }
    
    .text-nowrap {
        white-space: nowrap;
    }

    .surface-1 {
        background-color: var(--surface-1);
        color: var(--text-1);
    }

    .surface-2 {
        background-color: var(--surface-2);
        color: var(--text-1);
    }

    .surface-3 {
        background-color: var(--surface-3);
        color: var(--text-1);
    }

    .surface-4 {
        background-color: var(--surface-4);
        color: var(--text-2);
    }

    .grid-container {
        display: grid;
        grid-template-columns: 
            [bleed-start] 
            minmax(20px, 1fr)
            [content-start]
            minmax(0, 1470px)
            [content-end] 
            minmax(20px, 1fr)
            [bleed-end];
        overflow-x: clip;
    }

    .ship-registry {
        font-size: calc(1.2rem * .625);
        line-height: 1.04;
        font-weight: 350;
        margin-bottom: calc(1.5rem * .625);
    }


    /* Content */
    .c-content {
        grid-column: content;
        display: grid;
        grid-template-columns: 1fr;
        gap: 0;
        align-items: start;
        padding-top: 30px;
        padding-bottom: 60px;

        @media (width >= 768px) {
            grid-template-columns: max-content 1fr;
            padding-top: 100px;
            padding-bottom: 120px;
            gap: 5%;
        }

        @media (width >= 1200px) {
            gap: 11%;
        }

        @media (height <= 1060px) {
            padding-top: 30px;
            padding-bottom: 60px;
        }


    }        
    .c-content__nav {
        position: sticky;
        z-index: 3;
        top: calc(var(--amex-subnav-height) + 75px);
        display: none;
        min-width: 333px;

        @media (width >= 768px) {
            display: block;
        }

        @media (height <= 1060px) {
            top: 100px;
        }

        .nav-heading {
            font-size: calc(2.6rem * .625);
            line-height: normal;
            text-align: center;
            font-weight: 400;
            font-family: var(--fGuardian);
            margin-bottom: calc(2.5rem * .625);
            letter-spacing: 0.91px;

            @media (height <= 1060px) {
                display: none;
            }
        }

        ul {
            padding: 30px;
            border-radius: 8px;
            border: 1px solid var(--border-default);
            box-shadow: var(--shadow-xs);
            display: flex;
            flex-flow: column;
            gap: calc(1.6rem * .625);
            background: var(--surface-1);

            @media (height <= 1060px) {
                padding: 20px;
            }

            @media (height <= 820px) {
                max-height: 80vh;
                overflow-y: scroll;
            }
        }

        li {
            position: relative;

            &:not(:last-child)::after {
                content: '';
                position: absolute;
                left: 0;
                right: 0;
                bottom: -8px;
                margin-inline: 15px;
                height: 1px;
                background-color: var(--border-nav-items);
            }

            &:has(+ li a.current)::after,
            &:has(a.current)::after {
                display: none;
            }
        }

        a {
            display: grid;
            grid-template-columns: 1fr max-content;
            grid-template-rows: max-content max-content;
            padding-block: 10px;
            padding-inline: 15px;
            text-decoration: none;
            color: var(--text-1);
            border-radius: 8px;
            transition: all 0.2s ease-in;
            gap: 0 8px;
            min-height: 44px;

            @media (height <= 1060px) {
                padding-block: 6px;
            }

            @media (height <= 820px) {
                grid-template-rows: 1fr;
                align-items: center;
            }

            @media (prefers-reduced-motion: reduce) {
                transition: none;
            }

            &:focus-visible {
                outline: 1px dashed currentColor;
                outline-offset: initial;
            }

            &:hover {
                background-color: var(--surface-2);
                transition: all 0.2s ease-in;

                @media (prefers-reduced-motion: reduce) {
                    transition: none;
                }
            }

            &.current {
                background-color: var(--surface-8);
                box-shadow: var(--shadow-xs);

                svg {
                    display: none;
                }
            }

            svg {
                /* width: 5.455px;
                height: 12px; */
                flex-shrink: 0;
                grid-column: 2;
                grid-row: 1 / span 2;
                margin-block: auto;
                width: 8px;
                height: 14px;

                @media (height <= 820px) {
                    grid-row: 1;
                }

                path {
                    stroke: var(--text-1);
                }
            }
        }

        .location {
            font-size: calc(1.8rem * .625);
            line-height: 1.11;
            font-weight: 700;
            grid-column: 1;
            grid-row: 1;
            margin-bottom: calc(0.5rem * .625);

            @media (height <= 1060px) {
                font-size: calc(1.6rem * .625);
            }

            &.mb-0 {
                margin-bottom: 0;
            }
        }

        .country {
            font-size: calc(1.6rem * .625);
            line-height: 1;
            font-weight: 350;
            grid-column: 1;
            grid-row: 2;

            @media (height <= 1060px) {
                font-size: calc(1.2rem * .625);
            }

            @media (height <= 820px) {
                display: none;
            }
        }
    }

    .c-content__body {
        min-width: 0;
    }

    #introduction {
        .c-content__body {
            margin-block: auto;
        }
        .intro-copy {
            /* max-width: 662px; */
            margin-inline: auto;
            margin-block: auto;
        }
    }

    /* c-benefitsbox */
    .c-benefitsbox {
        > p:first-of-type {
            font-size: calc(1.4rem * .625);
            font-weight: 500;
            line-height: 1.57;
        }
    }

        .c-benefitsbox__cards {
            display: grid;
            grid-template-columns: 1fr;
            margin-block-start: calc(2rem * .625);
            gap: calc(2.5rem * .625);

            @media (width >= 768px) {
                grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
                margin-block-start: calc(2.5rem * .625);
            }
        }

    /* c-card */
    .c-card {
        padding-block: calc(2.5rem * .625);
        padding-inline: calc(2rem * .625);
        border: 1px solid var(--border-card);

        &.thc {
            color: var(--text-3);
            border: 1px solid var(--text-3);

            @media (prefers-color-scheme: dark) {
                border: 1px solid var(--border-card);
            }
        }
        
        .fhr-logo {
            width: 100%;
            max-width: 270px;

            @media (width >= 768px) {
                max-width: 314px;
            }
        }

        .thc-logo {
            width: 100%;
            max-width: 270px;

            @media (width >= 768px) {
                max-width: 301px;
            }
        }

        &.single-card {
            @media (width >= 992px) {
                padding: 0;
                border: 0;

                .c-card__header {
                    justify-content: center;
                }

                .c-card__body {
                    max-width: 665px;
                    margin-inline: auto;
                    ul {
                        margin-inline: auto;
                        gap: 8px 50px;
                        display: grid;
                        grid-template-columns: 1fr 1fr;
                        grid-template-rows: repeat(3, max-content);
                        grid-auto-flow: column;
                    }
                }
            }
        }
    }

        .c-card__header {
            display: flex;
            flex-flow: row;
            align-items: center;
            margin-bottom: calc(2rem * .625);

            .with-fn {
                display: flex;
                flex-flow: row;
                color: var(--text-3);
                font-size: calc(1.667rem * .625);

                sup {
                    top: -1.5ex;
                }
            }
        }

        .c-card__body {
            ul {
                list-style: none;
                display: flex;
                flex-flow: column;
                gap: calc(1rem * .625);
                margin-bottom: 10px;
            }

            li {
                display: flex;
                flex-flow: row;
                align-items: center;
                gap: calc(1rem * .625);
                padding-inline: calc(1.2rem * .625);

                svg {
                    flex-shrink: 0;
                    overflow: visible;
                }
            }

            p.disclaimer-xs {
                margin-bottom: 0;
                font-size: calc(1.2rem * .625);
                line-height: 1.57;
            }
        }

        .c-intro-benefits {
            margin-top: calc(4.5rem * .625);
            display: grid;
            gap: calc(2.5rem * .625);

            h3 {
                font-family: var(--fGuardian);
                font-size: calc(1.8rem * .625);
                font-weight: 400;
                line-height: 1.4;

                @media (width >= 768px) {
                    font-size: calc(2.8rem * .625);
                }
            }
        }

        .c-accordion {
            display: grid;
            gap: calc(2rem * .625);

            details {
                color: var(--text-1);
            }

            details summary svg {
                transition: all 0.2s ease-in;
                
                @media (prefers-reduced-motion: reduce) {
                    transition: none;
                }
            }

            details[open] summary svg {
                transform: rotate(180deg);
            }

            summary::-webkit-details-marker {
                display: none;
            }

            summary {
                list-style: none;
                display: flex;
                flex-flow: row;
                justify-content: space-between;
                align-items: center;
                cursor: pointer;
                padding-block: calc(1.5rem * .625);
                padding-inline: calc(4rem * .625);

                &:focus-visible {
                    outline: 1px dashed currentColor;
                    outline-offset: 3px;
                }

                h4 {
                    padding: 0;
                    margin: 0;
                    font-size: calc(1.6rem * .625);
                    font-weight: 400;
                    line-height: 1.5;
                    border: none;
                }
            }
        }

            .c-accordion__content {
                padding: calc(3rem * .625);
                border: 1px solid var(--surface-3);
                background: var(--surface-1);
            }


    /* c-dest-detail */
    .c-dest-detail {
        scroll-margin-top: calc(var(--amex-subnav-height) + var(--mobile-nav-trigger-height));
    }

    .c-dest-detail__hero {
        grid-column: bleed;
        position: relative;

        @media (width >= 768px) {
            max-height: 720px;
            overflow: clip;

            &.gradient-darken::after {
                content: '';
                position: absolute;
                top: 0;
                left: 0;
                width: 57%;
                height: 76%;
                background: linear-gradient(141deg, rgba(0, 0, 0, 0.80) 3.71%, rgba(0, 0, 0, 0.00) 48.51%);
                z-index: 1;
            }

            &.gradient-lighten::after {
                content: '';
                position: absolute;
                top: 0;
                left: 0;
                width: 57%;
                height: 76%;
                background: linear-gradient(141deg, rgba(255, 255, 255, 0.90) 3.71%, rgba(255, 255, 255, 0.00) 48.51%);
                z-index: 1;
            }
        }

        picture {
            grid-column: bleed;
            grid-row: 2;

            @media (width >= 768px) {
                grid-row: 1;
            }
        }

        .hero-bg {
            max-height: 720px;

            img {
                width: 100%;
                height: 100%;
                object-fit: cover;

                
            }
            
            &.obj-top img {
                object-position: top;
            }
        }

    }

    .c-dest-detail__hero-copy {
        grid-column: content;
        padding-block: calc(1rem * .625);
        display: grid;
        gap: calc(0.5rem * .625);
        text-align: center;
        color: var(--text-1);
        grid-row: 1;
        margin-bottom: auto;
        z-index: 2;

        &.white {
            color: var(--text-1);
            @media (width >= 768px) {
                color: var(--white);
            }
        }

        &.dark-gray {
            color: var(--text-1);
            @media (width >= 768px) {
                color: var(--DarkGray);
            }
        }

        @media (width >= 768px) {
            padding-block: calc(8rem * .625);
            text-align: left;
            gap: calc(1rem * .625);
        }

        h2 {
            font-size: calc(3.6rem * .625);
            line-height: 1.16;
            font-weight: 700;
            text-transform: uppercase;

            @media (width >= 768px) {
                text-shadow: var(--text-shadow);
                font-size: calc(4.4rem * .625);
            }
        }


        .country {
            font-size: calc(1.8rem * .625);
            line-height: 1.22;
            font-weight: 350;

            @media (width >= 768px) {
                font-size: calc(2.6rem * .625);
                text-shadow: var(--text-shadow);
            }
        }
    }

    .c-figure {
        margin-block: calc(3rem * .625);
        display: grid;
        grid-template-columns: 1fr;
        gap: calc(3rem * .625);


        @media (width >= 768px) {
            margin-block: calc(5rem * .625);
            padding-bottom: calc(5rem * .625);
            grid-template-columns: repeat(auto-fit, minmax(270px, 1fr));
            gap: calc(5rem * .625);
            border-bottom: 1px solid var(--border-details);
            align-items: center;

            &.no-border {
                border-bottom: none;
            }
        }

        picture {
            width: 100%;
            height: 100%;
        }
        picture img {
            width: 100%;
            height: 100%;
            object-fit: cover;
        }
    }


    .c-dest-footer {
        padding-bottom: calc(3rem * .625);
        border-bottom: 1px solid var(--border-details);
        display: grid;
        gap: calc(2rem * .625);

        @media (width >= 768px) {
            gap: calc(2.5rem * .625);
            border-bottom: none;
        }
    }

        .c-dest-footer__group {
            display: flex;
            flex-flow: row;
            align-items: flex-start;
            gap: calc(1.5rem * .625);

            svg {
                flex-shrink: 0;
                width: 36px;
                aspect-ratio: 1 / 1;

                @media (width >= 768px) {
                    width: 42px;
                }
            }
        }

    /* c-carousel */
    .c-carousel {
        margin-bottom: calc(1.5rem * .625);

        @media (width < 768px) {
            padding-inline: 25px;

            .slick-list {
                overflow: visible;
            }
        }

        &:last-of-type,
        &:has(.slick-dots) {
            margin-bottom: 0;
        }
    }

    .c-fake-carousel {
        margin-bottom: calc(5rem * .625);
        grid-template-columns: 1fr;
        display: grid;

        @media (width < 768px) {
            padding-inline: 25px;
        }

        &:last-of-type {
            margin-bottom: 0;
        }

        @media (width >=1100px) {
            grid-template-columns: repeat(2, 1fr);
            gap: 25px;
        }
    }

        .c-carousel__slide { height: 100%; }
        .c-carousel__slide-inner {
            display: flex;
            flex-flow: column;
            height: 100%;
            position: relative;

            .slide-header {
                display: flex;
                align-items: center;
                justify-content: center;
                padding: calc(0.8rem * .625);

                &.slide-header--fhr {
                    background: var(--dark-gray-2);

                    img {
                        max-width: 235px;
                    }
                }

                &.slide-header--thc {
                    background: var(--surface-6);

                    img {
                        max-width: 228px;
                    }
                }

                &.slide-header--platinum-destinations {
                    background: #454D55;
                    text-transform: uppercase;
                    font-size: calc(1.4rem * .625);
                    line-height: 1;
                    font-weight: 800;
                    letter-spacing: 0.7px;
                    color: var(--white);
                    position: absolute;
                    top: 0;
                    left: 0;
                    right: 0;
                }
            }

            .slide-picture {
                width: 100%;
                max-height: 200px;

                @media (width >= 600px) {
                    max-height: 260px;
                }

                img {
                    width: 100%;
                    height: 100%;
                    object-fit: cover;
                }
            }

            .slide-body {
                /* padding-inline: calc(2rem * .625); */
                /* padding-block: calc(2rem * .625); */
                padding-inline: calc(2rem * .625);
                padding-block: calc(2rem * .625);
                display: flex;
                flex-flow: column;
                flex-grow: 1;

                @media (width >= 768px) {
                    /* padding: calc(3rem * .625); */
                    padding-inline: calc(4.4rem * .625);
                    padding-block: calc(4.4rem * .625);
                }
            }

            .slide-statbox {
                background-color: var(--surface-1);
                color: var(--text-2);
                margin-bottom: calc(1.5rem * .625);
                display: flex;
                flex-flow: row;
                gap: calc(1.5rem * .625);
                padding: calc(1.5rem * .625);
                border-radius: 8px;



                svg {
                    flex-shrink: 0;
                }

                p {
                    font-weight: 500;
                    font-size: calc(1.2rem * .625);
                    line-height: 1.57;

                    @media (width >= 768px) {
                        font-size: calc(1.2rem * .625);
                    }

                    &:last-of-type {
                        margin-bottom: 0 !important;
                    }
                }
            }

            .eyebrow {
                font-size: calc(1rem * .625);
                line-height: calc(2rem * .625);
                font-weight: 700;
                text-transform: uppercase;
                margin-bottom: calc(0.5rem * .625);

                @media (min-width: 768px) {
                    font-size: calc(1.2rem * .625);
                    line-height: calc(2.33rem * .625);
                }
            }

            h4 {
                font-family: var(--fGuardian);
                font-size: calc(1.8rem * .625);
                font-weight: 400;
                line-height: 1.33;
                margin-bottom: calc(0.5rem * .625);
                padding: initial;
                border: none;

                @media (min-width: 768px) {
                    font-size: calc(2.2rem * .625);
                    line-height: 1.27;
                }
            }

            p {
                font-size: calc(1.2rem * .625);
                line-height: 1.5;
                margin-bottom: calc(1.5rem * .625) !important;

                @media (min-width: 768px) {
                    font-size: calc(1.4rem * .625);
                    line-height: 1.57;
                }
            }

            .slide-cta {
                margin-top: auto;
            }
        }


    .slick-initialized .slick-slide {
        height: initial;
    }

    .slick-track {
        display: flex !important;
        align-items: stretch !important;
    }
    .slick-slide {
        height: auto !important;
        display: flex !important;
        align-items: stretch !important;
        margin-inline: 12.5px;
    }
    .slick-slide > div {
        width: 100%;
    }

    .slick-list {
        margin-inline: -12.5px;
        padding: 0 !important;
    }

    .slick-arrow {
        position: absolute;
        top: calc(50% - 34px);
        transform: translateY(-50%);
        z-index: 2;
        width: 44px;
        height: 44px;
        border: none;
        background: rgba(0, 0, 0, 0.53);
        color: var(--text-4);
        padding: 0;
        display: grid;
        align-items: center;
        justify-content: center;
        cursor: pointer;

        &:focus-visible {
            outline: 1px dashed currentColor;
            outline-offset: -3px;
        }

        &.slick-disabled {
            background-color: rgba(0, 0, 0, 0.2);
            cursor: not-allowed;
        }
    }
        .slick-prev {
            left: 0;
            
        }
        .slick-next {
            right: 0;
        }

        .slick-dots {
            padding-block: calc(1.6rem * .625);
            padding-inline: calc(1.8rem * .625);
            display: flex;
            flex-flow: row;
            gap: 10px;
            justify-content: center;
            align-items: center;
            margin-top: calc(2.5rem * .625);

            li {
                display: grid;
                align-items: center;
                justify-content: center;
            }
            
            .slick-active {
                button {
                    background-color: var(--surface-5);
                    width: 12px;
                    height: 12px;
                }
            }

            button {
                width: 8px;
                height: 8px;
                background-color: #8E9092;
                border-radius: 100%;
                padding: 0;
                margin: 0;
                border: none;

                &:focus-visible {
                    outline: 1px dashed currentColor;
                    outline-offset: 3px;
                }
            }

        }


    .c-where {
        h3 {
            font-family: var(--fGuardian);
            font-size: calc(1.8rem * .625);
            font-weight: 400;
            line-height: 1.33;
            margin-top: calc(3rem * .625);
            margin-bottom: calc(2rem * .625);
            padding-inline: calc(2.5rem * .625);

            @media (min-width: 768px) {
                margin-top: calc(5rem * .625);
                font-size: calc(2.6rem * .625);
                line-height: 1.46;
                padding-inline: initial;
            }
        }
    }

    /* c-more-benefits */
    #card-member-benefits {
        background-color: var(--surface-7);
        color: var(--text-1);
        padding-block: calc(4rem * .625);

        @media (width >= 768px) {
            padding-block: calc(8rem * .625);
        }
    }
    .c-morebenefits {
        grid-column: content;

        h2 {
            font-family: var(--fGuardian);
            font-size: calc(1.8rem * .625);
            font-weight: 400;
            line-height: 1.33;
            margin-bottom: calc(3.5rem * .625);
            text-align: center;

            @media (width >= 768px) {
                margin-bottom: calc(4rem * .625);
                font-size: calc(2.4rem * .625);
                line-height: 1.42;
            }
        }
    }

    /* c-benefits-carousel */
    .c-benefits-carousel {
        max-width: 1200px;
        margin-inline: auto;

        @media (width < 768px) {
            padding-inline: 25px;

            .slick-list {
                overflow: visible;
            }
        }
    }

        .c-benefits-carousel__slide {
            height: 100%;
            background: var(--surface-1);
        }

        .c-benefits-carousel__slide-inner {
            height: 100%;
            padding-block: calc(3rem * .625);
            padding-inline: calc(2.5rem * .625);

            @media (width >= 768px) {
                /* padding-block: calc(2rem * .625);
                padding-inline: calc(2rem * .625); */
                padding-block: calc(6rem * .625);
                padding-inline: calc(6rem * .625);
            }

            &.style-1 {
                display: grid;
                grid-template-columns: 1fr;
                gap: calc(2rem * .625);

                @media (width >= 768px) {
                    grid-template-columns: minmax(320px, 4fr) 6fr;
                }
            }

            &.style-2 {
                display: flex;
                flex-flow: column;
                gap: calc(2.5rem * .625);

                @media (width >= 768px) {
                    display: grid;
                    grid-template-columns: 1fr 1fr;
                    gap: calc(2rem * .625);
                }

                figure {
                    display: grid;
                    picture {
                        grid-column: 1 / -1;
                        grid-row: 1;
                    }
                    img {
                        width: 100%;
                        height: 100%;
                        object-fit: cover;
                        grid-column: 1 / -1;
                    }
                }

                figcaption {
                    grid-column: 1 / -1;
                    grid-row: 1;
                    margin-top: auto;
                    margin-left: auto;
                    margin-bottom: calc(2rem * .625);
                    margin-right: calc(2rem * .625);
                    background-color: var(--Black);
                    color: var(--white);
                    font-size: calc(1rem * .625);
                    font-weight: 400;
                    line-height: 1;
                    padding-block: calc(0.5rem * .625);
                    padding-inline: calc(1.2rem * .625);

                }
            }

            .style-2-content {


                @media (width >= 768px) {
                    order: -1;
                    display: flex;
                    flex-flow: column;
                    justify-content: center;
                    padding-left: calc(2.4rem * .625);
                    padding-right: calc(2rem * .625);
                }

                p {
                    font-size: calc(1.4rem * .625);
                    line-height: 1.57;

                    @media (width >= 768px) {
                        font-size: calc(1.6rem * .625);
                        font-weight: 350;
                        line-height: 1.5;
                    }

                    &.disclaimer {
                        font-size: calc(1.2rem * .625);
                    }
                }

                .iap-logo {
                    margin-bottom: calc(2rem * .625);
                    display: block;
                    
                    img {
                        width: 100%;
                        max-width: 410px;
                    }
                }

                .resy-logo {
                    margin-bottom: calc(2rem * .625);
                    display: block;
                    
                    img {
                        width: 100%;
                        max-width: 82px;
                    }
                }

                .gyg-logo {
                    margin-bottom: calc(2rem * .625);
                    display: block;
                    
                    img {
                        width: 100%;
                        max-width: 328px;
                    }
                }

                .logo-grid {
                    display: grid;
                    grid-template-columns: repeat(auto-fit, minmax(108px, 1fr));
                    gap: 0 calc(3rem * .625);
                    margin-block: calc(2.5rem * .625);
                    margin-inline: -20px;

                    @media (width >= 768px) {
                        /* grid-template-columns: repeat(4, 108px); */
                        gap: 0 calc(0.5rem * .625);
                        margin-inline: initial;
                    }

                    @media (prefers-color-scheme: dark) {
                        background-color: #F5F2F0 !important;
                        padding-inline: calc(0.5rem * .625);
                    }

                    picture {
                            width: 100%;
                            min-height: 47px;
                            margin-inline: auto;
                            max-width: 108px;
                            display: flex;
                            align-items: center;
                        img {
                            width: 100%;
                        }
                    }
                }

                .cruise-item {
                    margin-bottom: calc(2.5rem * .625);

                    h3 {
                        font-size: calc(2.2rem * .625);
                        line-height: 1.18;
                        font-family: var(--fGuardian);
                        font-weight: 400;
                        text-align: center;
                        margin-bottom: 5px;

                        @media (width >= 768px) {
                            font-size: calc(2.6rem * .625);
                            line-height: 1.23;
                            text-align: left;
                        }
                    }
                }

                h3.lounge {
                    font-size: calc(2.2rem * .625);
                    line-height: 1.18;
                    font-family: var(--fGuardian);
                    font-weight: 400;
                    text-align: center;
                    margin-bottom: 5px;

                    @media (width >= 768px) {
                        font-size: calc(2.6rem * .625);
                        line-height: 1.23;
                        text-align: left;
                    }
                }

                .footer {
                    margin-top: calc(2.5rem * .625);
                    .slide-cta {

                        &:hover {
                            text-decoration: underline;
                        }
                        
                        @media (width >= 768px) {
                            margin-right: auto;
                            display: inline-block;
                        }
                    }
                }
            }

            .style-1-header {
                padding-inline: calc(1.5rem * .625);
                padding-block: calc(3.8rem * .625);
                display: flex;
                flex-flow: column;
                justify-content: center;

                .slide-cta:focus-visible {
                    outline: 1px dashed var(--white);
                    outline-offset: 3px;
                }

                img {
                    width: 100%;
                    margin-bottom: calc(1.2rem * .625);
                    margin-inline: auto;

                    @media (width >= 768px) {
                        margin-bottom: calc(2rem * .625);
                        margin-inline: initial;
                    }
                }

                &.fhr {
                    background-color: var(--dark-gray-2);
                    color: var(--white);

                    img {
                        max-width: 305px;
                    }
                }

                &.thc {
                    background-color: var(--dark-blue);
                    color: var(--white);

                    img {
                        max-width: 296px;
                    }
                }

                p {
                    color: var(--white);
                    text-align: center;
                    font-size: calc(1.2rem * .625);
                    line-height: 1.33;
                    font-weight: 350;

                    @media (width >= 768px) {
                        text-align: left;
                        font-size: calc(1.8rem * .625);
                    }
                }

                .footer {
                    display: none;

                    @media (width >= 768px) {
                        display: grid;
                        gap: calc(4rem * .625);
                        margin-top: calc(4rem * .625);
                    }
                }
            }

            .slide-cta {

                &:hover {
                    text-decoration: underline;
                }

                @media (width >= 768px) {
                    margin-right: auto;
                }
            }

            .footnotes {
                font-size: calc(1.2rem * .625);
                font-weight: 350;
                line-height: 1.5;
                margin-top: 0;
                display: grid;
                gap: calc(0.8rem * .625);

            }

            .style-1-content {
                display: grid;
                gap: calc(2.5rem * .625);

                @media (width >= 768px) {
                    padding: calc(2rem * .625);
                    margin-block: auto;
                }

                .title {
                    font-size: calc(1.3rem * .625);
                    font-weight: 500;
                    line-height: 1.36;

                    @media (width >= 768px) {
                        font-size: calc(1.6rem * .625);
                    }
                }
                .footer {
                    display: grid;
                    gap: calc(2.5rem * .625);

                    @media (width >= 768px) {
                        a { display: none; }
                    }

                    .footnotes {
                        margin-top: 0;
                    }
                }
            }

            .icon-grid-3col {
                display: grid;
                grid-template-columns: 1fr 1fr;
                gap: calc(1.5rem * .625);

                @media (width >= 768px) {
                    grid-template-columns: repeat(3, 1fr);
                    gap: calc(3rem * .625);
                }


            }     
            .icon-grid-2col {
                display: grid;
                grid-template-columns: 1fr 1fr;
                gap: calc(1.5rem * .625);

                @media (width >= 768px) {
                    grid-template-columns: repeat(2, minmax(auto, 200px));
                    gap: calc(3rem * .625);
                    margin-inline: auto;
                }
            }    

            .item {
                display: flex;
                flex-flow: column;
                gap: calc(1.6rem * .625);
                text-align: center;

                svg {
                    color: var(--text-2);
                    margin-inline: auto;
                }
            }

            .thc .item svg {
                color: var(--text-3);
            }

            .item-copy {
                display: flex;
                flex-flow: column;
                gap: 8px;

                p {
                    font-size: calc(1.2rem * .625);
                    font-weight: 400;
                    line-height: 1.54;
                    margin-bottom: 0;
                }
            }

            .icon-title {
                font-size: calc(1.2rem * .625);
                font-weight: 500;
                line-height: 1.48;
            }
        }

    /*  buttons  */
    .btn-primary,
    .btn-secondary {
        background-color: var(--surface-5);
        border: 1px solid var(--surface-5);
        color: var(--text-4);
        padding-block: calc(1.3rem * .625);
        padding-inline: calc(1.3rem * .625);
        display: flex;
        flex-flow: row;
        align-items: center;
        justify-content: center;
        border-radius: 4px;
        text-decoration: none;
        font-size: calc(1.6rem * .625);
        line-height: 1.375;
        text-wrap: pretty;
        text-align: center;
        transition: all 0.2s ease-in;

        @media (prefers-reduced-motion: reduce) {
            transition: none;
        }

        &:focus-visible {
            outline: 1px dashed var(--text-1);
            outline-offset: 3px;
        }
    }

    .btn-primary:hover {
        background-color: var(--btn-bg-hv);
        border-color: var(--btn-primary-hv);
        color: var(--btn-primary-hv);
        transition: all 0.2s ease-in;

        @media (prefers-reduced-motion: reduce) {
            transition: none;
        }
    }

    .btn-secondary {
        background-color: var(--white);
        border: none;
        color: var(--light-blue);
        padding-inline: calc(3.5rem * .625);

        &.btn-secondary--ghost {
            background-color: transparent;
            border: 1px solid var(--light-blue);

            @media (prefers-color-scheme: dark) {
                border: 1px solid var(--white);
                color: var(--white);
            }
        }
    }



    .ext-link {
        color: var(--text-5);
        display: flex;
        text-decoration: underline;
        flex-flow: row;
        align-items: center;
        gap: calc(0.875rem * .625);
        font-weight: 500;
        font-size: calc(1.2rem * .625);

        @media (width >= 768px) {
            font-size: calc(1.4rem * .625);
        }

        svg {
            color: inherit;
            flex-shrink: 0;
            /* width: 10.5px;
            height: 10.5px; */
        }
    }

    a[href^="tel:"] {
        -webkit-user-select: text !important;
        -moz-user-select: text !important;
        -ms-user-select: text !important;
        user-select: text !important;
        -webkit-touch-callout: default !important;
    }


    .text-link {
        color: var(--text-5);
    }

    /* Footer  */
    .terms-section {
        padding-top: 80px;
    
        > * {
            grid-column: content;
        }

        .dllBG {
            grid-column: bleed;
        }
    }

    .dest-mobile-nav {
        width: 100%;
        border-bottom: 1px solid #D9D9D9;
        display: flex;
        align-items: center;
        flex-flow: column;
        position: sticky;
        top: var(--amex-subnav-height);
        background-color: var(--surface-1);
        z-index: 3;


        @media (width >= 768px) {
            display: none;
        }

        #dest-menu-btn {
            display: flex;
            width: 100%;
            height: calc(4.4rem * .625);
            padding: calc(1rem * .625);
            color: var(--text-5);
            font-size: calc(1.3rem * .625);
            letter-spacing: 0.3px;
            text-align: center;
            align-items: center;
            justify-content: center;
            gap: calc(0.6rem * .625);
            background: var(--surface-9);
            border: none;
            cursor: pointer;

            svg {
                transform: rotate(180deg);
            }

            &[aria-expanded="true"] {
                svg {
                    transform: rotate(0deg);
                }
            }
        }

        #dest-menu {
            display: none;
            max-width: 375px;
            margin-inline: auto;
            margin-block: calc(2rem * .625);
            padding-inline: calc(2rem * .625);

            &.open {
                display: flex;
                flex-flow: column;
                gap: calc(1rem * .625);
            }

            a {
                padding: calc(1rem * .625);
                background: var(--surface-9);
                color: var(--text-mobile-nav);
                text-decoration: none;
                display: inline-block;
                width: 100%;
                font-size: calc(1.1rem * .625);
            }
        }
    }