/* =========================================================
   TRAVEL09 — PUBLIC OFFERS
   ========================================================= */

.offer-page,
.offer-page *{
    box-sizing:border-box;
}

.offer-page{
    --n:#071E32;
    --n2:#0B2D46;
    --deep:#03131F;
    --t:#087E8B;
    --a:#16B8C4;
    --g:#D6AD60;
    --bg:#F5F8FA;
    --m:#718391;
    --b:#DFE8ED;
    --text:#173447;

    color:var(--text);
    background:#FFFFFF;

    font-size:16px;
    line-height:1.65;

    -webkit-font-smoothing:antialiased;
}

.offer-page button,
.offer-page input,
.offer-page select{
    font:inherit;
}

.offer-shell{
    width:min(
        calc(100% - 80px),
        1440px
    );

    margin:auto;
}

.offer-section-label{
    color:var(--t);

    font-size:12px;
    font-weight:850;

    letter-spacing:.10em;
    text-transform:uppercase;
}

.offer-section-head{
    display:grid;

    grid-template-columns:
        minmax(0,1.2fr)
        minmax(300px,.7fr);

    gap:50px;

    align-items:end;
}

.offer-section-head > div > span{
    color:var(--t);

    font-size:12px;
    font-weight:850;

    letter-spacing:.10em;
    text-transform:uppercase;
}

.offer-section-head h2{
    margin:7px 0 0;

    color:var(--n);

    font-family:
        "Playfair Display",
        Georgia,
        serif;

    font-size:
        clamp(
            36px,
            4vw,
            52px
        );

    font-weight:600;
    line-height:1.08;
}

.offer-section-head > p{
    margin:0;

    color:var(--m);

    font-size:15px;
    line-height:1.8;
}


/* =========================================================
   HERO
   ========================================================= */

.offer-hero{
    padding:
        78px 0 48px;

    color:#FFFFFF;

    background:
        radial-gradient(
            circle at 86% 15%,
            rgba(22,184,196,.19),
            transparent 30%
        ),
        linear-gradient(
            145deg,
            var(--deep),
            var(--n) 55%,
            var(--n2)
        );
}

.offer-hero__grid{
    display:grid;

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

    gap:64px;

    align-items:end;
}

.offer-kicker{
    color:#88E2E8;

    font-size:12px;
    font-weight:800;

    letter-spacing:.1em;
    text-transform:uppercase;
}

.offer-kicker span{
    display:inline-block;

    width:8px;
    height:8px;

    margin-right:9px;

    border-radius:50%;

    background:var(--a);

    box-shadow:
        0 0 0 5px
        rgba(22,184,196,.12);
}

.offer-hero h1{
    max-width:900px;

    margin:15px 0 0;

    font-family:
        "Playfair Display",
        Georgia,
        serif;

    font-size:
        clamp(
            54px,
            5.6vw,
            84px
        );

    font-weight:600;
    line-height:.98;

    letter-spacing:-.048em;
}

.offer-hero h1 span{
    display:block;

    margin-top:6px;

    background:
        linear-gradient(
            90deg,
            #A1EEF1,
            #72DCE3,
            #D7B66D
        );

    background-clip:text;
    -webkit-background-clip:text;

    -webkit-text-fill-color:transparent;
}

.offer-hero p{
    max-width:720px;

    color:#BDD0DA;

    font-size:17px;
    line-height:1.8;
}

.offer-hero__actions{
    display:flex;
    flex-wrap:wrap;

    gap:10px;

    margin-top:25px;
}

.offer-hero__actions a{
    min-height:46px;

    display:inline-flex;
    align-items:center;
    justify-content:center;

    padding:0 17px;

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

    border-radius:10px;

    color:#D7E4EA;

    text-decoration:none;

    font-size:13px;
    font-weight:800;
}

.offer-hero__actions .primary{
    border-color:transparent;

    background:
        linear-gradient(
            135deg,
            var(--t),
            var(--a)
        );

    color:#FFFFFF;
}

.offer-hero__note{
    display:flex;

    gap:17px;

    padding:23px;

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

    border-radius:20px;

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

.offer-hero__note-icon{
    width:54px;
    height:54px;

    display:grid;
    place-items:center;

    flex:none;

    border-radius:15px;

    background:var(--g);

    color:#392706;

    font-size:20px;
    font-weight:900;
}

.offer-hero__note strong{
    display:block;

    color:#FFFFFF;
}

.offer-hero__note p{
    margin-bottom:0;

    color:#A9BDC8;

    font-size:14px;
}


/* =========================================================
   SEARCH — FIXED
   ========================================================= */

.offer-search{
    width:100%;

    display:flex;
    align-items:stretch;

    gap:12px;

    margin-top:44px;

    padding:14px;

    border-radius:22px;

    background:#FFFFFF;

    box-shadow:
        0 28px 80px
        rgba(0,0,0,.22);
}

.offer-search label{
    min-width:0;
    min-height:92px;

    display:flex;
    flex-direction:column;
    justify-content:center;

    padding:
        13px 18px;

    border:
        1px solid
        #DCE6EB;

    border-radius:14px;

    background:#FAFCFD;
}

.offer-search__main{
    flex:
        1 1 600px;
}

.offer-search label:not(.offer-search__main){
    flex:
        0 1 240px;
}

.offer-search label > span{
    display:block;

    margin-bottom:5px;

    color:#728795;

    font-size:12px;
    font-weight:800;
}

.offer-search input,
.offer-search select{
    width:100%;
    min-width:0;

    min-height:38px;

    padding:0;

    border:0;
    outline:0;

    background:transparent;

    color:var(--text);

    font-size:16px;
    font-weight:600;
}

.offer-search input::placeholder{
    color:#6F7479;

    opacity:1;
}

.offer-search button{
    flex:
        0 0
        clamp(
            220px,
            19vw,
            340px
        );

    min-width:0;
    min-height:92px;

    display:flex;
    align-items:center;
    justify-content:center;

    padding:0 26px;

    border:0;

    border-radius:14px;

    background:
        linear-gradient(
            135deg,
            #0C8995,
            #1CB4C1
        );

    color:#FFFFFF;

    cursor:pointer;

    font-size:16px;
    font-weight:850;

    box-shadow:
        0 14px 34px
        rgba(22,184,196,.18);

    transition:
        transform .2s ease,
        box-shadow .2s ease,
        filter .2s ease;
}

.offer-search button:hover{
    transform:translateY(-1px);

    filter:brightness(1.03);

    box-shadow:
        0 17px 38px
        rgba(22,184,196,.25);
}

.offer-quick{
    display:flex;
    flex-wrap:wrap;

    gap:8px;

    margin-top:14px;
}

.offer-quick > span{
    color:#8FA8B6;

    font-size:13px;
    font-weight:700;
}

.offer-quick a{
    padding:
        8px 12px;

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

    border-radius:999px;

    color:#B8CBD5;

    text-decoration:none;

    font-size:12px;
}


/* =========================================================
   INTRO
   ========================================================= */

.offer-intro{
    padding:
        84px 0;
}

.offer-intro__grid{
    display:grid;

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

    gap:12px;

    margin-top:32px;
}

.offer-intro article{
    min-height:210px;

    padding:23px;

    border:
        1px solid
        var(--b);

    border-radius:17px;

    background:
        linear-gradient(
            180deg,
            #FFFFFF,
            #FAFCFD
        );
}

.offer-intro article > span{
    color:var(--t);

    font-size:11px;
    font-weight:900;
}

.offer-intro strong{
    display:block;

    margin-top:28px;

    color:var(--n);

    font-size:17px;
}

.offer-intro p{
    color:var(--m);

    font-size:13px;
}


/* =========================================================
   FEATURED
   ========================================================= */

.offer-featured{
    padding:
        84px 0;

    color:#FFFFFF;

    background:
        linear-gradient(
            145deg,
            var(--deep),
            var(--n)
        );
}

.offer-section-head.light h2{
    color:#FFFFFF;
}

.offer-section-head.light > div > span{
    color:#78DCE4;
}

.offer-section-head.light > p{
    color:#A8BDC9;
}

.offer-featured__grid{
    display:grid;

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

    grid-auto-rows:
        310px;

    gap:13px;

    margin-top:34px;
}

.offer-featured__grid article{
    overflow:hidden;

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

    border-radius:19px;

    background:#0A263A;
}

.offer-featured__grid article.lead{
    grid-row:span 2;
}

.offer-featured__media{
    position:relative;

    height:
        calc(100% - 54px);

    display:block;

    overflow:hidden;
}

.offer-featured__media img{
    width:100%;
    height:100%;

    object-fit:cover;
}

.offer-featured__media > span{
    position:absolute;
    inset:0;

    background:
        linear-gradient(
            180deg,
            transparent 35%,
            rgba(3,19,31,.86)
        );
}

.offer-featured__media > div{
    position:absolute;

    left:21px;
    right:21px;
    bottom:18px;
}

.offer-featured__media small{
    color:#A9C6D1;
}

.offer-featured__media h3{
    margin:
        4px 0 0;

    color:#FFFFFF;

    font-family:
        "Playfair Display",
        Georgia,
        serif;

    font-size:27px;
    font-weight:600;

    line-height:1.10;
}

.offer-featured__grid footer{
    height:54px;

    display:flex;
    align-items:center;

    gap:12px;

    padding:
        0 17px;

    color:#9FB5C0;

    font-size:11px;
}

.offer-featured__grid footer b{
    margin-left:auto;

    color:#FFFFFF;
}


/* =========================================================
   OFFER TYPES
   ========================================================= */

.offer-types{
    padding:
        78px 0;
}

.offer-types__grid{
    display:grid;

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

    gap:14px;

    margin-top:30px;
}

.offer-type-card{
    min-height:170px;

    display:grid;

    grid-template-columns:
        auto
        1fr
        auto;

    gap:15px;

    padding:24px;

    border:
        1px solid
        var(--b);

    border-radius:18px;

    color:var(--text);

    text-decoration:none;

    transition:.2s ease;
}

.offer-type-card:hover{
    transform:translateY(-3px);

    border-color:#B7DDE1;

    box-shadow:
        0 18px 45px
        rgba(7,30,50,.08);
}

.offer-type-card > span{
    color:#93A5B0;

    font-size:12px;
}

.offer-type-card strong{
    color:#15394F;

    font-family:
        "Playfair Display",
        Georgia,
        serif;

    font-size:22px;
    font-weight:600;
}

.offer-type-card p{
    color:var(--m);

    font-size:14px;
}

.offer-type-card b{
    color:var(--t);
}


/* =========================================================
   VALUE STRIP
   ========================================================= */

.offer-value{
    border-top:
        1px solid
        var(--b);

    border-bottom:
        1px solid
        var(--b);
}

.offer-value__grid{
    display:grid;

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

.offer-value article{
    display:grid;

    grid-template-columns:
        auto 1fr;

    gap:12px;

    padding:24px;

    border-right:
        1px solid
        var(--b);
}

.offer-value article:last-child{
    border-right:0;
}

.offer-value article > span{
    color:var(--t);

    font-size:11px;
    font-weight:900;
}

.offer-value strong{
    color:var(--n);
}

.offer-value p{
    margin:4px 0;

    color:var(--m);

    font-size:13px;
}


/* =========================================================
   TOOLBAR
   ========================================================= */

.offer-toolbar{
    border-bottom:
        1px solid
        var(--b);
}

.offer-toolbar__inner{
    min-height:96px;

    display:flex;

    align-items:center;
    justify-content:space-between;

    gap:30px;
}

.offer-toolbar__inner strong{
    display:block;

    margin-top:5px;

    color:var(--n);

    font-size:18px;
}

.offer-toolbar__actions{
    display:flex;

    align-items:center;

    gap:10px;
}

.offer-filter-link,
.offer-clear{
    padding:
        11px 14px;

    border-radius:9px;

    text-decoration:none;

    font-size:13px;
    font-weight:800;
}

.offer-filter-link{
    background:#EEF8F9;

    color:var(--t);
}

.offer-clear{
    color:var(--t);
}

.offer-sort label{
    display:flex;

    align-items:center;

    gap:8px;
}

.offer-sort label > span{
    color:#7A8D98;

    font-size:12px;
}

.offer-sort select{
    min-height:42px;

    padding:
        0 12px;

    border:
        1px solid
        var(--b);

    border-radius:9px;

    background:#FFFFFF;

    color:var(--text);
}


/* =========================================================
   RESULTS
   ========================================================= */

.offer-results{
    padding:
        46px 0 82px;

    background:
        var(--bg);
}

.offer-grid{
    display:grid;

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

    gap:18px;
}

.offer-card{
    overflow:hidden;

    display:flex;
    flex-direction:column;

    border:
        1px solid
        var(--b);

    border-radius:20px;

    background:#FFFFFF;

    box-shadow:
        0 10px 32px
        rgba(7,30,50,.055);

    transition:.22s ease;
}

.offer-card:hover{
    transform:translateY(-4px);

    border-color:#C6DDE3;

    box-shadow:
        0 20px 48px
        rgba(7,30,50,.09);
}

.offer-card__media{
    position:relative;

    aspect-ratio:
        16 / 10;

    overflow:hidden;
}

.offer-card__media img{
    width:100%;
    height:100%;

    object-fit:cover;

    transition:
        transform .35s ease;
}

.offer-card:hover
.offer-card__media img{
    transform:scale(1.025);
}

.offer-card__shade{
    position:absolute;
    inset:0;

    background:
        linear-gradient(
            180deg,
            transparent 35%,
            rgba(4,20,31,.62)
        );
}

.offer-card__badges{
    position:absolute;

    top:14px;
    left:14px;

    display:flex;
    flex-wrap:wrap;

    gap:6px;
}

.offer-badge{
    padding:
        6px 9px;

    border-radius:999px;

    background:
        rgba(7,30,50,.80);

    color:#FFFFFF;

    font-size:11px;
    font-weight:800;
}

.offer-badge.gold{
    background:
        var(--g);

    color:#392706;
}

.offer-card__urgency{
    position:absolute;

    right:14px;
    bottom:13px;

    padding:
        6px 9px;

    border-radius:8px;

    background:#8B382E;

    color:#FFFFFF;

    font-size:12px;
    font-weight:800;
}

.offer-card__body{
    flex:1;

    padding:20px;
}

.offer-card__meta{
    display:flex;
    flex-wrap:wrap;

    gap:7px;

    color:#7C909C;

    font-size:11px;
    font-weight:800;

    text-transform:uppercase;
}

.offer-card h2{
    margin:7px 0 0;

    font-family:
        "Playfair Display",
        Georgia,
        serif;

    font-size:25px;
    font-weight:600;

    line-height:1.22;
}

.offer-card h2 a{
    color:var(--n);

    text-decoration:none;
}

.offer-card__linked{
    margin-top:6px;

    color:#527386;

    font-size:12px;
    font-weight:700;
}

.offer-card__body > p{
    color:var(--m);

    font-size:14px;
}

.offer-card__facts{
    display:flex;
    flex-wrap:wrap;

    gap:7px;
}

.offer-card__facts span{
    padding:
        6px 9px;

    border:
        1px solid
        #E3EAEE;

    border-radius:8px;

    color:#627989;

    font-size:12px;
}

.offer-card__footer{
    display:flex;

    justify-content:space-between;
    align-items:center;

    gap:12px;

    padding:
        14px 20px;

    border-top:
        1px solid
        #EDF2F4;
}

.offer-card__price del{
    display:block;

    color:#9BA9B2;

    font-size:12px;
}

.offer-card__price strong{
    display:block;

    color:var(--n);

    font-size:17px;
}

.offer-card__price span{
    color:#8A9BA5;

    font-size:10px;

    text-transform:uppercase;
}

.offer-card__button{
    padding:
        11px 14px;

    border-radius:9px;

    background:
        var(--n);

    color:#FFFFFF;

    text-decoration:none;

    font-size:13px;
    font-weight:800;
}


/* =========================================================
   EMPTY / PAGINATION
   ========================================================= */

.offer-empty{
    max-width:760px;

    margin:auto;

    padding:
        54px 34px;

    border:
        1px solid
        var(--b);

    border-radius:22px;

    background:#FFFFFF;

    text-align:center;
}

.offer-empty__icon{
    width:56px;
    height:56px;

    display:grid;
    place-items:center;

    margin:auto;

    border-radius:16px;

    background:var(--g);

    color:#392706;

    font-size:22px;
    font-weight:900;
}

.offer-empty h2{
    color:var(--n);

    font-family:
        "Playfair Display",
        Georgia,
        serif;

    font-size:34px;
    font-weight:600;
}

.offer-empty p{
    color:var(--m);
}

.offer-empty a{
    display:inline-block;

    margin-top:20px;
}

.offer-pagination{
    display:flex;

    justify-content:center;

    gap:12px;

    margin-top:40px;
}

.offer-pagination div{
    display:flex;

    gap:6px;
}

.offer-pagination a{
    padding:
        10px 13px;

    border:
        1px solid
        var(--b);

    border-radius:9px;

    background:#FFFFFF;

    color:#526E80;

    text-decoration:none;
}

.offer-pagination a.active{
    background:
        var(--t);

    color:#FFFFFF;
}


/* =========================================================
   COMBINE
   ========================================================= */

.offer-combine{
    padding:
        82px 0;

    background:#FFFFFF;
}

.offer-combine__panel{
    display:grid;

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

    gap:55px;

    padding:42px;

    border:
        1px solid
        var(--b);

    border-radius:25px;

    background:
        linear-gradient(
            180deg,
            #FFFFFF,
            #FAFCFD
        );
}

.offer-combine h2{
    max-width:800px;

    margin:
        7px 0;

    color:var(--n);

    font-family:
        "Playfair Display",
        Georgia,
        serif;

    font-size:
        clamp(
            36px,
            4vw,
            52px
        );

    font-weight:600;
}

.offer-combine p{
    color:var(--m);
}

.offer-combine__links{
    display:flex;
    flex-wrap:wrap;

    gap:7px;

    margin-top:20px;
}

.offer-combine__links a{
    padding:
        8px 11px;

    border:
        1px solid
        var(--b);

    border-radius:8px;

    color:#496C7E;

    text-decoration:none;

    font-size:12px;
}

.offer-combine aside{
    padding:25px;

    border-radius:18px;

    background:
        var(--n);

    color:#FFFFFF;
}

.offer-combine aside p{
    color:#A8BDC9;

    font-size:13px;
}

.offer-combine aside a{
    color:#84E0E6;

    text-decoration:none;

    font-weight:800;
}


/* =========================================================
   FAQ
   ========================================================= */

.offer-faq{
    padding:
        82px 0;
}

.offer-faq__grid{
    display:grid;

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

    gap:10px;

    margin-top:30px;
}

.offer-faq details{
    padding:20px;

    border:
        1px solid
        var(--b);

    border-radius:14px;

    background:#FFFFFF;
}

.offer-faq summary{
    cursor:pointer;

    color:var(--n);

    font-weight:800;
}

.offer-faq p{
    margin-bottom:0;

    color:var(--m);

    font-size:13px;
}


/* =========================================================
   ASSISTANCE
   ========================================================= */

.offer-assistance{
    padding:
        0 0 76px;

    background:
        var(--bg);
}

.offer-assistance__panel{
    display:grid;

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

    gap:26px;

    align-items:center;

    padding:
        38px 40px;

    border:
        1px solid
        #D8E6EA;

    border-radius:24px;

    background:#FFFFFF;
}

.offer-assistance__icon{
    width:66px;
    height:66px;

    display:grid;
    place-items:center;

    border-radius:18px;

    background:
        linear-gradient(
            135deg,
            var(--t),
            var(--a)
        );

    color:#FFFFFF;

    font-weight:900;
}

.offer-assistance h2{
    margin:
        6px 0;

    color:var(--n);

    font-family:
        "Playfair Display",
        Georgia,
        serif;

    font-size:
        clamp(
            32px,
            3vw,
            46px
        );

    font-weight:600;
}

.offer-assistance p{
    color:var(--m);
}

.offer-assistance__panel > a{
    padding:
        13px 18px;

    border-radius:10px;

    background:
        var(--n);

    color:#FFFFFF;

    text-decoration:none;

    font-weight:800;

    white-space:nowrap;
}


/* =========================================================
   RESPONSIVE
   ========================================================= */

@media(max-width:1180px){

    .offer-shell{
        width:
            calc(100% - 40px);
    }

    .offer-hero__grid{
        grid-template-columns:1fr;
    }

    .offer-search{
        flex-wrap:wrap;
    }

    .offer-search__main{
        flex:
            1 1
            calc(100% - 280px);
    }

    .offer-search label:not(.offer-search__main){
        flex:
            1 1
            calc(50% - 6px);

        min-height:76px;
    }

    .offer-search button{
        flex:
            0 0 260px;
    }

    .offer-intro__grid,
    .offer-value__grid{
        grid-template-columns:
            repeat(
                2,
                minmax(0,1fr)
            );
    }

    .offer-grid,
    .offer-types__grid{
        grid-template-columns:
            repeat(
                2,
                minmax(0,1fr)
            );
    }

    .offer-combine__panel{
        grid-template-columns:1fr;
    }
}


@media(max-width:860px){

    .offer-section-head{
        grid-template-columns:1fr;

        gap:14px;
    }

    .offer-search__main{
        flex:
            1 1 100%;
    }

    .offer-search label:not(.offer-search__main){
        flex:
            1 1
            calc(50% - 6px);
    }

    .offer-search button{
        flex:
            1 1 100%;

        min-height:58px;
    }

    .offer-assistance__panel{
        grid-template-columns:1fr;
    }
}


@media(max-width:720px){

    .offer-shell{
        width:
            calc(100% - 24px);
    }

    .offer-hero{
        padding:
            54px 0 36px;
    }

    .offer-hero h1{
        font-size:
            clamp(
                42px,
                12vw,
                54px
            );
    }

    .offer-hero__note{
        flex-direction:column;
    }

    .offer-hero__actions{
        flex-direction:column;
    }

    .offer-hero__actions a{
        width:100%;
    }

    .offer-search{
        display:flex;
        flex-direction:column;

        gap:9px;

        margin-top:30px;

        padding:10px;

        border-radius:18px;
    }

    .offer-search label,
    .offer-search__main,
    .offer-search label:not(.offer-search__main){
        flex:
            1 1 auto;

        width:100%;

        min-height:76px;

        padding:
            11px 15px;

        border-radius:11px;
    }

    .offer-search input,
    .offer-search select{
        font-size:16px;
    }

    .offer-search button{
        flex:
            1 1 auto;

        width:100%;

        min-height:54px;
    }

    .offer-intro,
    .offer-featured,
    .offer-types,
    .offer-combine,
    .offer-faq{
        padding:
            56px 0;
    }

    .offer-intro__grid,
    .offer-value__grid,
    .offer-grid,
    .offer-types__grid,
    .offer-faq__grid{
        grid-template-columns:1fr;
    }

    .offer-value article{
        border-right:0;

        border-bottom:
            1px solid
            var(--b);
    }

    .offer-toolbar__inner{
        align-items:stretch;

        flex-direction:column;

        padding:
            20px 0;
    }

    .offer-toolbar__actions{
        align-items:stretch;

        flex-direction:column;
    }

    .offer-filter-link,
    .offer-clear,
    .offer-sort,
    .offer-sort label,
    .offer-sort select{
        width:100%;
    }

    .offer-card__footer{
        align-items:flex-start;

        flex-direction:column;
    }

    .offer-card__button{
        width:100%;

        text-align:center;
    }

    .offer-combine__panel{
        padding:
            27px 21px;
    }

    .offer-assistance__panel{
        padding:
            27px 22px;
    }

    .offer-assistance__panel > a{
        width:100%;

        text-align:center;
    }
}
