
/* =========================================================
   VIDEURO COUNTRY — NEW VISION
   ========================================================= */

.country-page-v2{
    background:#080b0f !important;
}

.country-page-v2 .section,
.crx .section{
    width:min(1240px,calc(100% - 64px));
    max-width:1240px;
    margin-left:auto;
    margin-right:auto;
}


/* HIDE LEGACY COUNTRY BODY */

.country-v2-overview,
.country-rich-guide,
.country-guide-pro,
.country-famous-rich,
.country-beyond,
.country-discovery,
.country-editorial,
.country-v2-map-section,
.country-v2-videos,
.country-v2-notes,
.country-v2-end{
    display:none !important;
}


/* =========================================================
   HERO — DIFFERENT LOOK
   ========================================================= */

.country-v2-hero{
    height:520px !important;
    min-height:520px !important;

    border-bottom:0 !important;

    background-position:center 45% !important;
}

.country-v2-hero-shade{
    background:
        linear-gradient(
            90deg,
            rgba(5,8,12,.91) 0%,
            rgba(5,8,12,.56) 38%,
            rgba(5,8,12,.08) 73%
        ),
        linear-gradient(
            180deg,
            rgba(0,0,0,.04) 20%,
            #080b0f 100%
        ) !important;
}

.country-v2-heading h1{
    font-size:clamp(5.5rem,9vw,8.8rem) !important;
    letter-spacing:-.075em !important;
}

.country-v2-facts{
    border-radius:14px !important;

    background:rgba(8,12,18,.55) !important;

    backdrop-filter:blur(18px) !important;
}


/* =========================================================
   GENERAL
   ========================================================= */

.crx{
    --x-line:rgba(255,255,255,.09);
    --x-muted:rgba(255,255,255,.52);
    --x-dim:rgba(255,255,255,.33);
    --x-card:#11161d;
    --x-card2:#151b23;
    --x-red:#ff5668;

    color:#f6f7f9;
}

.crx-label{
    display:block;

    color:#8491ab;

    font-size:10px;
    font-weight:700;

    letter-spacing:.19em;

    text-transform:uppercase;
}

.crx-section-head{
    display:grid;

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

    gap:70px;

    align-items:end;

    margin-bottom:34px;
}

.crx-section-head h2{
    margin:14px 0 0;

    font:
        600
        clamp(3.1rem,5.2vw,5.25rem)
        /.98
        var(--serif);

    letter-spacing:-.055em;
}

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

    color:var(--x-muted);

    font-size:.88rem;

    line-height:1.72;
}


/* =========================================================
   DOSSIER
   ========================================================= */

.crx-dossier{
    display:grid;

    grid-template-columns:
        minmax(0,1.1fr)
        minmax(440px,.9fr);

    gap:75px;

    padding-top:90px;
    padding-bottom:95px;
}

.crx-dossier-copy h2{
    max-width:690px;

    margin:16px 0 22px;

    font:
        600
        clamp(3.2rem,5.3vw,5.3rem)
        /1
        var(--serif);

    letter-spacing:-.055em;
}

.crx-dossier-copy > p{
    max-width:640px;

    margin:0;

    color:var(--x-muted);

    font-size:1rem;

    line-height:1.8;
}

.crx-actions{
    display:flex;

    gap:25px;

    margin-top:28px;
}

.crx-actions a{
    display:inline-flex;

    align-items:center;

    gap:13px;

    color:#fff;

    font-size:.82rem;
}

.crx-actions span{
    color:#7788a7;
}


/* FACT BOARD */

.crx-factboard{
    display:grid;

    grid-template-columns:1fr 1fr;

    border-top:1px solid var(--x-line);
    border-left:1px solid var(--x-line);
}

.crx-factboard article{
    min-height:132px;

    display:flex;

    flex-direction:column;

    justify-content:flex-end;

    padding:22px;

    border-right:1px solid var(--x-line);
    border-bottom:1px solid var(--x-line);

    transition:.25s ease;
}

.crx-factboard article:hover{
    background:rgba(255,255,255,.035);
}

.crx-factboard small{
    margin-bottom:7px;

    color:var(--x-dim);

    font-size:.59rem;

    letter-spacing:.14em;

    text-transform:uppercase;
}

.crx-factboard strong{
    max-width:250px;

    font:
        600
        1.15rem/1.35
        var(--serif);
}


/* =========================================================
   PLACES — ASYMMETRIC MAGAZINE LAYOUT
   ========================================================= */

.crx-places{
    padding-top:90px;
    padding-bottom:100px;

    border-top:1px solid var(--x-line);
}

.crx-place-layout{
    display:grid;

    grid-template-columns:
        minmax(0,.9fr)
        minmax(0,1.1fr);

    gap:15px;
}

.crx-featured-place{
    min-height:505px;

    display:flex;

    flex-direction:column;

    justify-content:space-between;

    padding:34px;

    border-radius:22px;

    background:
        radial-gradient(
            circle at 85% 10%,
            rgba(82,110,159,.22),
            transparent 30%
        ),
        linear-gradient(
            150deg,
            #18222e,
            #0e1218
        );

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

    position:relative;

    overflow:hidden;
}

.crx-featured-place::after{
    content:"01";

    position:absolute;

    right:-12px;
    bottom:-64px;

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

    font:
        700
        15rem/1
        var(--serif);
}

.crx-place-no{
    color:var(--x-red);

    font:
        600
        1rem
        var(--serif);
}

.crx-featured-place small,
.crx-place-list small{
    display:block;

    margin-bottom:8px;

    color:#7483a0;

    font-size:.58rem;

    letter-spacing:.15em;

    text-transform:uppercase;
}

.crx-featured-place h3{
    max-width:520px;

    margin:0 0 16px;

    font:
        600
        clamp(2.8rem,4.6vw,4.8rem)
        /.96
        var(--serif);

    letter-spacing:-.045em;
}

.crx-featured-place p{
    max-width:520px;

    margin:0;

    color:var(--x-muted);

    line-height:1.72;
}

.crx-arrow{
    color:#71819f;

    font-size:1.2rem;
}


.crx-place-list{
    display:grid;

    grid-template-columns:1fr 1fr;

    gap:15px;
}

.crx-place-list article{
    min-height:245px;

    display:grid;

    grid-template-columns:35px 1fr 24px;

    gap:13px;

    padding:25px;

    border-radius:18px;

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

    background:
        linear-gradient(
            145deg,
            #12171e,
            #0d1116
        );

    transition:.25s ease;
}

.crx-place-list article:hover{
    transform:translateY(-4px);

    border-color:rgba(255,255,255,.2);
}

.crx-place-list h3{
    margin:0 0 10px;

    font:
        600
        1.7rem/1.05
        var(--serif);
}

.crx-place-list p{
    margin:0;

    color:var(--x-muted);

    font-size:.8rem;

    line-height:1.6;
}


/* =========================================================
   ROUTE — FULL WIDTH DIFFERENT BACKGROUND
   ========================================================= */

.crx-route{
    padding:90px 0;

    background:
        linear-gradient(
            135deg,
            #111923,
            #090d12 58%,
            #11151c
        );

    border-top:1px solid var(--x-line);
    border-bottom:1px solid var(--x-line);
}

.crx-section-head-light h2{
    max-width:720px;
}

.crx-route-grid{
    display:grid;

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

    gap:1px;

    margin-top:45px;

    background:var(--x-line);

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

    border-radius:18px;

    overflow:hidden;
}

.crx-route-grid article{
    min-height:310px;

    padding:30px;

    background:#0d1218;
}

.crx-day{
    display:flex;

    justify-content:space-between;

    align-items:flex-start;
}

.crx-day strong{
    color:#fff;

    font:
        600
        3.2rem/1
        var(--serif);
}

.crx-day span{
    color:#72809c;

    font-size:.57rem;

    letter-spacing:.18em;
}

.crx-route-grid h3{
    margin:80px 0 12px;

    font:
        600
        1.7rem
        var(--serif);
}

.crx-route-grid p{
    margin:0;

    color:var(--x-muted);

    font-size:.82rem;

    line-height:1.65;
}


/* =========================================================
   MAP
   ========================================================= */

.crx-map-section{
    padding-top:95px;
    padding-bottom:100px;
}

.crx-map-layout{
    display:grid;

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

    gap:14px;
}

.crx-map{
    height:520px;

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

    border-radius:20px;

    overflow:hidden;
}

.crx-practical{
    display:flex;

    flex-direction:column;

    padding:28px;

    border-radius:20px;

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

    background:
        linear-gradient(
            160deg,
            #161c24,
            #0e1217
        );
}

.crx-practical h3{
    margin:13px 0 25px;

    font:
        600
        2.25rem/1.05
        var(--serif);
}

.crx-practical dl{
    margin:0 0 25px;
}

.crx-practical dl div{
    display:grid;

    grid-template-columns:90px 1fr;

    gap:14px;

    padding:11px 0;

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

.crx-practical dt{
    color:var(--x-dim);

    font-size:.59rem;

    letter-spacing:.11em;

    text-transform:uppercase;
}

.crx-practical dd{
    margin:0;

    font-size:.79rem;
}

.crx-mini-list{
    margin-top:20px;
}

.crx-mini-list small{
    display:block;

    margin-bottom:10px;

    color:#73809a;

    font-size:.56rem;

    letter-spacing:.15em;
}

.crx-mini-list span{
    display:inline-flex;

    margin:0 5px 6px 0;

    padding:6px 9px;

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

    border-radius:999px;

    color:var(--x-muted);

    font-size:.68rem;
}


/* =========================================================
   STORIES
   ========================================================= */

.crx-stories{
    padding-top:90px;
    padding-bottom:100px;

    border-top:1px solid var(--x-line);
}

.crx-story-total{
    text-align:right;
}

.crx-story-total strong{
    display:block;

    font:
        600
        4.4rem/1
        var(--serif);
}

.crx-story-total span{
    color:#73809a;

    font-size:.56rem;

    letter-spacing:.18em;
}

.crx-video-grid{
    display:grid;

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

    gap:15px;
}

.crx-video-grid article{
    overflow:hidden;

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

    border-radius:18px;

    background:#10151b;
}

.crx-video-grid article > div:last-child{
    padding:20px;
}

.crx-video-grid small{
    color:#7785a1;

    font-size:.57rem;

    letter-spacing:.14em;

    text-transform:uppercase;
}

.crx-video-grid h3{
    margin:8px 0 0;

    font:
        600
        1.45rem
        var(--serif);
}


/* empty state redesigned as horizontal editorial banner */

.crx-empty-stories{
    min-height:190px;

    display:grid;

    grid-template-columns:70px 1fr auto;

    align-items:center;

    gap:28px;

    padding:30px;

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

    border-radius:20px;

    background:
        radial-gradient(
            circle at 20% 0%,
            rgba(98,85,190,.17),
            transparent 28%
        ),
        #10141a;
}

.crx-play{
    width:64px;
    height:64px;

    display:grid;

    place-items:center;

    border-radius:50%;

    background:
        linear-gradient(
            135deg,
            #5b8eff,
            #9a68ff,
            #ff647a
        );
}

.crx-empty-stories h3{
    max-width:700px;

    margin:9px 0;

    font:
        600
        2rem/1.05
        var(--serif);
}

.crx-empty-stories p{
    max-width:650px;

    margin:0;

    color:var(--x-muted);

    font-size:.8rem;
}

.crx-empty-stories > a{
    display:flex;

    align-items:center;

    gap:20px;

    padding:15px 18px;

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

    border-radius:999px;

    color:#fff;

    white-space:nowrap;
}


/* =========================================================
   FINAL
   ========================================================= */

.crx-final{
    padding:115px 0;

    text-align:center;

    border-top:1px solid var(--x-line);

    background:
        radial-gradient(
            circle at 50% 50%,
            rgba(62,90,145,.22),
            transparent 35%
        ),
        #0b0e13;
}

.crx-final .section{
    display:flex;

    flex-direction:column;

    align-items:center;
}

.crx-final h2{
    margin:19px 0;

    font:
        600
        clamp(3.3rem,6vw,6.3rem)
        /.96
        var(--serif);

    letter-spacing:-.06em;
}

.crx-final p{
    max-width:520px;

    margin:0 0 27px;

    color:var(--x-muted);
}


/* =========================================================
   TABLET
   ========================================================= */

@media(max-width:1000px){

    .crx-dossier{
        grid-template-columns:1fr;

        gap:40px;
    }

    .crx-place-layout{
        grid-template-columns:1fr;
    }

    .crx-featured-place{
        min-height:390px;
    }

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

        gap:18px;
    }

    .crx-route-grid{
        grid-template-columns:1fr;
    }

    .crx-route-grid article{
        min-height:220px;
    }

    .crx-route-grid h3{
        margin-top:40px;
    }

    .crx-map-layout{
        grid-template-columns:1fr;
    }

}


/* =========================================================
   MOBILE
   ========================================================= */

@media(max-width:680px){

    .country-page-v2 .section,
    .crx .section{
        width:calc(100% - 30px);
    }

    .country-v2-hero{
        height:485px !important;
        min-height:485px !important;
    }

    .crx-dossier,
    .crx-places,
    .crx-map-section,
    .crx-stories{
        padding-top:60px;
        padding-bottom:65px;
    }

    .crx-factboard{
        grid-template-columns:1fr;
    }

    .crx-place-list{
        grid-template-columns:1fr;
    }

    .crx-featured-place{
        min-height:340px;
    }

    .crx-place-list article{
        min-height:200px;
    }

    .crx-route{
        padding:65px 0;
    }

    .crx-map{
        height:390px;
    }

    .crx-empty-stories{
        grid-template-columns:1fr;

        text-align:left;
    }

    .crx-story-total{
        text-align:left;
    }

    .crx-final{
        padding:80px 0;
    }

}
