/* FOCUS_ADVENTURES_V8_5_5_POLISH */

body.fa855{
    --fa855-orange:#ff6418;
    --fa855-orange2:#ff8c4f;
    --fa855-line:rgba(151,177,198,.15);
    --fa855-line2:rgba(151,177,198,.23);
    --fa855-muted:#97aab8;
}

/* ==================================================
   DAG
   ================================================== */

body.fa855 :where(
    .fa26-day,
    .fa26-day-section,
    .trip-day
){
    display:block!important;
    position:relative!important;

    margin-bottom:28px!important;
    padding:24px!important;

    border:
        1px solid
        var(--fa855-line)!important;

    border-radius:22px!important;

    background:
        linear-gradient(
            145deg,
            #0d1c2a,
            #08151f
        )!important;

    overflow:visible!important;
}

/* ==================================================
   TITEL
   ================================================== */

body.fa855 :where(
    .fa26-title,
    .fa26-day-title,
    .fa26-day h2,
    .trip-day h2
){
    position:relative!important;
    inset:auto!important;

    width:min(100%,980px)!important;
    max-width:980px!important;

    margin:
        .3rem
        0
        12px!important;

    font-size:
        clamp(
            34px,
            4vw,
            60px
        )!important;

    line-height:1.02!important;

    letter-spacing:
        -.045em!important;

    word-break:normal!important;
    overflow-wrap:normal!important;
    hyphens:none!important;

    text-wrap:balance;
}

/* ==================================================
   DAGVERHAAL
   ================================================== */

body.fa855 .fa26-day-story{
    position:relative!important;
    inset:auto!important;

    float:none!important;

    width:min(100%,980px)!important;
    max-width:980px!important;

    margin:
        18px
        0
        24px!important;

    padding:
        20px
        22px!important;

    transform:none!important;

    border:
        1px solid
        var(--fa855-line)!important;

    border-left:
        3px solid
        var(--fa855-orange)!important;

    border-radius:
        16px!important;

    background:
        linear-gradient(
            135deg,
            rgba(12,28,42,.98),
            rgba(8,20,30,.98)
        )!important;
}

body.fa855
.fa26-day-story::before{
    display:none!important
}

body.fa855
.fa26-day-story-label{
    margin:
        0
        0
        8px!important;

    color:
        var(--fa855-orange2)!important;

    font-size:
        10px!important;

    font-weight:
        900!important;

    letter-spacing:
        .11em!important;

    text-transform:
        uppercase!important;
}

body.fa855
.fa26-day-story p{
    margin:0!important;

    max-width:
        88ch!important;

    color:
        #e3eaf0!important;

    font-size:
        15px!important;

    line-height:
        1.72!important;
}

/* ==================================================
   DAGMETA
   ================================================== */

.fa855-day-meta{
    display:flex;
    gap:7px;
    flex-wrap:wrap;

    margin:
        0
        0
        12px;
}

.fa855-day-meta span{
    display:inline-flex;
    align-items:center;

    min-height:27px;

    padding:
        5px
        9px;

    border:
        1px solid
        var(--fa855-line2);

    border-radius:
        999px;

    color:
        #aebdc9;

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

    font-size:
        10.5px;
}

/* ==================================================
   KOSTENVERHAAL
   ================================================== */

body.fa855
.fa851-cost-story{
    width:
        min(
            calc(100% - 20px),
            1120px
        );

    margin:
        18px
        auto
        30px;

    padding:
        21px
        23px;

    border:
        1px solid
        var(--fa855-line);

    border-left:
        3px solid
        var(--fa855-orange);

    border-radius:
        17px;

    background:
        linear-gradient(
            135deg,
            #0d1c2a,
            #091620
        );

    box-shadow:
        0
        16px
        38px
        rgba(0,0,0,.16);
}

body.fa855
.fa851-cost-story small{
    display:block;

    margin-bottom:
        8px;

    color:
        var(--fa855-orange2);

    font-size:
        10px;

    font-weight:
        900;

    letter-spacing:
        .11em;

    text-transform:
        uppercase;
}

body.fa855
.fa851-cost-story p{
    max-width:
        92ch;

    margin:0;

    color:
        #e4ebf1;

    font-size:
        15px;

    line-height:
        1.75;
}

body.fa855
.fa851-cost-note{
    margin-top:
        10px;

    max-width:
        92ch;

    color:
        #8194a4;

    font-size:
        10.5px;

    line-height:
        1.5;
}

/* Geen losse kostenkaarten */

body.fa855-cost-active
:where(
    .trip-costs-grid,
    .fa26-cost-grid,
    .fa26-cost-cards,
    .cost-cards,
    .cost-grid,
    .fa26-cost-summary
){
    display:none!important
}

/* ==================================================
   SIDEBAR
   ================================================== */

body.fa855 :where(
    .fa26-sidebar,
    .fa26-days-nav,
    .fa26-day-nav,
    .fa26-toc,
    .trip-sidebar
){
    padding:
        12px!important;
}

/*
 * Locatiechips in sidebar maken
 * het menu onnodig druk.
 */

body.fa855 :where(
    .fa26-sidebar,
    .fa26-days-nav,
    .fa26-day-nav,
    .fa26-toc,
    .trip-sidebar
)
:where(
    .fa26-chip,
    .fa26-tag,
    .fa26-location,
    .fa26-loc,
    .fa26-pill
){
    display:none!important;
}

body.fa855 :where(
    .fa26-day-link,
    .fa26-toc a,
    .fa26-day-nav a,
    .fa26-days-nav a
){
    min-height:
        50px;

    padding:
        10px
        11px!important;

    border-radius:
        12px!important;
}

/* ==================================================
   GALERIJ
   ================================================== */

body.fa855 :where(
    .fa26-photo-grid,
    .fa26-photos,
    .fa26-gallery,
    .trip-gallery
){
    display:grid!important;

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

    gap:
        14px!important;

    align-items:
        start!important;
}

body.fa855 :where(
    .fa26-photo,
    .fa26-photo-card,
    .fa26-media,
    .trip-photo
){
    grid-column:
        span 6!important;

    min-width:0;

    overflow:
        hidden!important;

    border:
        1px solid
        var(--fa855-line)!important;

    border-radius:
        16px!important;

    background:
        #08151f!important;

    box-shadow:
        0
        10px
        28px
        rgba(0,0,0,.14)!important;
}

/* HERO */

body.fa855
.fa855-hero{
    grid-column:
        1 / -1!important;
}

body.fa855
.fa855-hero img{
    width:
        100%!important;

    aspect-ratio:
        16 / 7.5!important;

    max-height:
        650px;

    object-fit:
        cover!important;
}

/* GEWONE FOTO */

body.fa855 :where(
    .fa26-photo,
    .fa26-photo-card,
    .fa26-media,
    .trip-photo
):not(.fa855-hero)
img{
    width:
        100%!important;

    aspect-ratio:
        4 / 3!important;

    object-fit:
        cover!important;
}

/* ==================================================
   FOTO VERHAAL
   ================================================== */

body.fa855
.fa26-photo-story{
    padding:
        13px
        14px
        14px!important;

    border-top:
        1px solid
        var(--fa855-line)!important;

    background:
        linear-gradient(
            180deg,
            #0d1a26,
            #09151f
        )!important;
}

body.fa855
.fa26-photo-story p{
    font-size:
        12px!important;

    line-height:
        1.6!important;
}

body.fa855
.fa855-collapse:not(.fa855-open)
> p:first-of-type{
    display:
        -webkit-box;

    -webkit-box-orient:
        vertical;

    -webkit-line-clamp:
        4;

    overflow:
        hidden;
}

.fa855-more{
    appearance:none;

    margin-top:
        6px;

    padding:
        5px
        0;

    border:0;

    background:
        transparent;

    color:
        var(--fa855-orange2);

    font:
        800
        11px/1.2
        inherit;

    cursor:
        pointer;
}

/* Exact dezelfde foto binnen een dag */

.fa855-duplicate{
    display:none!important;
}

/* ==================================================
   MOBIEL
   ================================================== */

@media(max-width:900px){

    body.fa855 :where(
        .fa26-photo,
        .fa26-photo-card,
        .fa26-media,
        .trip-photo
    ){
        grid-column:
            1 / -1!important;
    }

    body.fa855
    .fa855-hero img,

    body.fa855 :where(
        .fa26-photo,
        .fa26-photo-card,
        .fa26-media,
        .trip-photo
    ):not(.fa855-hero)
    img{
        aspect-ratio:
            4 / 3!important;
    }
}

@media(max-width:760px){

    body.fa855 :where(
        .fa26-day,
        .fa26-day-section,
        .trip-day
    ){
        padding:
            16px!important;

        border-radius:
            16px!important;
    }

    body.fa855 :where(
        .fa26-title,
        .fa26-day-title,
        .fa26-day h2,
        .trip-day h2
    ){
        font-size:
            clamp(
                31px,
                10vw,
                47px
            )!important;
    }

    body.fa855
    .fa26-day-story,

    body.fa855
    .fa851-cost-story{
        padding:
            16px!important;
    }
}