@charset "UTF-8";
    :root {
    }
        .fall-back {
            position: absolute;
            z-index: 99999;
       }

/* Hide the mobile video by default */
.mobile-video {
    display: none;
}

                    /* Show the mobile video and hide the desktop video on small screens */
                    @media (max-width: 767px) {
                        .desktop-video {
                            display: none;
                        }
                        .mobile-video {
                            display: block;
                        }
                    }




/* Dotted Overlay */
.dotted-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: radial-gradient(#544b9b 1px, transparent 1px);
    background-size: 3px 3px; /* Adjust dot size and spacing */
    pointer-events: none; /* So it doesn’t interfere with interactions */
}
.dotted-overlay-white {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: radial-gradient(#F2F7F2 1px, transparent 1px);
    background-size: 50px 50px; /* Adjust dot size and spacing */
    pointer-events: none; /* So it doesn’t interfere with interactions */
}




.svg-container {
    position: relative;
    width: 100%;
    height: 540px; /* Adjust according to SVG */
    max-width: 100vw;
    overflow: hidden;
    z-index: 2;
}

#intro .svg-container > svg {
    z-index: 2;
}

   

/* Hero — left-aligned, vertically centered copy block */
#intro {
    position: relative;
}

#intro #visual,
#intro #visual-mobile {
    z-index: 0;
}

#intro .edv-hero-content {
    position: absolute;
    inset: 0;
    z-index: 10;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap: var(--edv-space-lg, 1.5rem);
    padding-top: 5rem;
    padding-bottom: 4rem;
    padding-left: clamp(1.25rem, 6vw, 4.5rem);
    padding-right: clamp(1.25rem, 8vw, 3rem);
    pointer-events: none;
}

#intro .edv-hero-content a,
#intro .edv-hero-content button {
    pointer-events: auto;
}

#intro .intro-headline-block1 {
    max-width: min(48rem, 100%);
}

#intro .intro-headline-block2 {
    max-width: min(84rem, 100%);
}

#intro #hero-cta.edv-hero__actions {
    justify-content: flex-start;
    align-items: flex-start;
    align-self: flex-start;
    margin-top: 5rem;
    max-width: min(48rem, 100%);
}

#intro .intro-headline-text {
    color: var(--edv-dark);
    margin-bottom: var(--edv-space-md, 1rem);
    font-size: clamp(3.15rem, 9.25vw, 6rem);
    line-height: 1.06;
    -webkit-text-stroke: 0px white;
    paint-order: stroke fill; 

}

#intro .intro-headline-desc {
    font-family: var(--edv-font);
    font-size: clamp(1.2rem, 2.85vw, 1.5rem);
    font-weight: 400;
    line-height: 1.6;
    color: var(--edv-dark);
    opacity: 0.82;
    margin: 0;
    max-width: 48rem;
}

/* Hero chrome — edvice black on green hero */
body[data-logo-tone="dark"] #logo-type,
body[data-logo-tone="dark"] .edv-header-title {
    color: var(--edv-dark) !important;
}

body[data-logo-tone="dark"] header .hamburger-inner,
body[data-logo-tone="dark"] header .hamburger-inner::before,
body[data-logo-tone="dark"] header .hamburger-inner::after {
    background-color: var(--edv-dark) !important;
}

body[data-bg="is-hero"] .lang-switcher,
body[data-lang-bg="is-hero"] .lang-switcher {
    color: var(--edv-dark);
}

body[data-bg="is-hero"] .lang-switcher a,
body[data-lang-bg="is-hero"] .lang-switcher a {
    color: var(--edv-dark) !important;
}

body[data-bg="is-hero"] .lang-switcher .langswitcher-on,
body[data-lang-bg="is-hero"] .lang-switcher .langswitcher-on {
    border-color: var(--edv-dark);
}

body[data-bg="is-hero"] .lang-switcher:hover .langswitcher-off,
body[data-lang-bg="is-hero"] .lang-switcher:hover .langswitcher-off {
    background: var(--edv-dark);
    color: var(--edv-cream);
}

body[data-bg="is-footer"] .lang-switcher a,
body[data-lang-bg="is-footer"] .lang-switcher a {
    color: var(--edv-cream) !important;
}

body[data-bg="is-footer"] .lang-switcher .langswitcher-on,
body[data-lang-bg="is-footer"] .lang-switcher .langswitcher-on {
    border-color: var(--edv-cream);
}

body[data-bg="is-footer"] .lang-switcher:hover .langswitcher-off,
body[data-lang-bg="is-footer"] .lang-switcher:hover .langswitcher-off {
    background: var(--edv-cream);
    color: var(--edv-dark);
}

#intro #hero-cta .edv-btn {
    color: var(--edv-dark) !important;
    border-color: var(--edv-dark);
    overflow: visible;
}

#intro #hero-cta .edv-btn__label {
    display: inline-block;
}

#intro #hero-cta .edv-btn__arrow-img {
    width: 0.95em;
    height: 0.95em;
    display: block;
    flex-shrink: 0;
}

#intro #hero-cta .edv-btn--primary {
    background: var(--edv-dark);
    border-color: var(--edv-dark);
    color: var(--edv-cream) !important;
}

#intro #hero-cta .edv-btn--primary .edv-btn__arrow-img {
    filter: brightness(0) invert(1);
}

#intro #hero-cta .edv-btn--primary:hover {
    background: #1a1430;
    border-color: #1a1430;
    color: var(--edv-cream) !important;
}

#intro #hero-cta .edv-btn--ghost {
    background: transparent;
    color: var(--edv-dark) !important;
    border-color: var(--edv-dark);
}

#intro #hero-cta .edv-btn--ghost:hover {
    background: var(--edv-dark);
    border-color: var(--edv-dark);
    color: var(--edv-cream) !important;
}

#intro #hero-cta .edv-btn--ghost:hover .edv-btn__arrow-img {
    filter: brightness(0) invert(1);
}




/* Floating Animation */
@keyframes floatUpDown {
    from { transform: translateY(0px); }
    to { transform: translateY(-2.1vh); }
}

@keyframes floatDownUp {
    from { transform: translateY(0px); }
    to { transform: translateY(2.1vh); }
}




.collage {
    position: absolute !important;
    
    min-width: 150px;
    height: auto;
    overflow: hidden;
    pointer-events: visiblePainted;
    animation: floatUpDown 3s ease-in-out infinite alternate;
    animation-delay: var(--float-delay, 0s);
    will-change: transform, opacity;
    transition: transform 11s ease-out, opacity 0.3s ease-out;
    opacity: 1;
    z-index: 0; /* Lower than text but above background */
    }



/* Apply Floating with Random Delays */
.floating {
    position: absolute !important;
    max-width: 10vw;
    min-width: 150px;
    height: auto;
    overflow: hidden;
    pointer-events: none;
    animation: floatUpDown 3s ease-in-out infinite alternate;
    animation-delay: var(--float-delay, 0s);
    will-change: transform;
    opacity: 1;
    z-index: 0; /* Lower than text but above background */
    }

/* Decorative arrow sat at CTA height and looked like a flickering CTA icon */
#intro .float-arrow {
    display: none;
}

/* Adjusting floating elements for better placement */
.float-news { top: 10vh; right: -5vw; max-width: 48vw}  /* Closer */
.float-greekguy { top: 20vh; right: 8vw; max-width:24%;}  /* Closer */
.float-cap { top: 11vh; right: 18vw; max-width:9%;}   /* Closer to headline */
.float-arrow { top: 50vh; right: 35vw; max-width:7%}  /* Closer */
.float-slogan { top: 60vh; right: 6vw; max-width: 7%}  /* Closer but not overlapping */
.float-passport { top: 11vh; right: 5vw; max-width:8%;}  /* Adjusted */
.float-plane { bottom: 15vh; right: 12vw; display: none;}  /* Adjusted */
.float-student { top: 40vh; right: 15vw; display: none;}  /* Slightly moved */


                @media (max-width: 1024px) { /* Tablets */
                    .floating { max-width: 21vw; } 
                    .float-cap { top: 6vh; left: 5vw; }
                    .float-arrow { top: 12vh; right: 8vw; } 
                    .float-passport { top: 67vh; left: 38vw; }
                    .float-student { top: 60vh; left: 8vw; }
                    .float-slogan { top: 65vh; right: 8vw; }
                    /* Hiding some elements if needed */
                    .float-plane { display: none; } 
                }

                @media (max-width: 768px) { /* Mobile */
                    .floating { max-width: 16vw; }  
                    .float-cap { top: 8vh; left: 3vw; }
                    .float-student { top: 20vh; left: 40vw; }

                    /* Hiding some elements if needed */
                    .float-arrow, .float-plane { display: none; }

                    /* Collage + greekguy — 63% larger, centered on mobile */
                    @keyframes intro-float-center-y {
                        from { transform: translateX(-50%) translateY(0); }
                        to { transform: translateX(-50%) translateY(-2.1vh); }
                    }

                    #intro .float-news.collage {
                        left: 45%;
                        right: auto;
                        max-width: calc(48vw * 1.63);
                        min-width: calc(150px * 1.63);
                        animation-name: intro-float-center-y;
                    }

                    #intro .float-greekguy.floating {
                        left: 50%;
                        right: auto;
                        max-width: calc(16vw * 1.63);
                        min-width: calc(150px * 1.63);
                        animation-name: intro-float-center-y;
                    }

                    /* Passport — 66% smaller, beside centered greekguy (mobile only) */
                    #intro .float-passport.floating {
                        top: 22vh;
                        left: 75%;
                        right: auto;
                        max-width: calc(16vw * 0.34);
                        min-width: calc(150px * 0.34);
                    }

                    /* Slogan — 60% smaller, behind greekguy upper-right (mobile only) */
                    #intro .float-slogan.floating {
                        top: 12vh;
                        left: 64%;
                        right: auto;
                        max-width: calc(16vw * 0.4);
                        min-width: calc(250px * 0.4);
                        z-index: -1;
                    }

                    /* Hero copy always above decorative floats */
                    #intro .edv-hero-content {
                        z-index: 20;
                    }

                    #intro .svg-container .floating,
                    #intro .svg-container .collage {
                        z-index: 0;
                    }

                    /* Hero CTAs — narrower and lower on mobile */
                    #intro #hero-cta.edv-hero__actions {
                        top: 7rem;
                    }

                    #intro #hero-cta .edv-btn {
                        width: 75%;
                        max-width: 75%;
                    }
                }

                @media (max-width: 480px) { /* Small Mobile */
                    .floating { max-width: 20vw; }
                    .float-student { top: 16vh; left: 42vw; max-width: 35vw; }
                    .float-cap, .float-arrow, .float-plane { display: none; } /* Hide extra elements */

                    #intro .float-greekguy.floating {
                        max-width: calc(20vw * 1.63);
                    }

                    #intro .float-passport.floating {
                        max-width: calc(20vw * 0.34);
                    }

                    #intro .float-slogan.floating {
                        max-width: calc(20vw * 0.4);
                    }
                }





.second-copy {
    position: static;
    width: auto;
    max-width: none;
    margin: 0;
    color: var(--edv-dark);
    text-shadow: none;
}

.second-desc {
    position: static;
    width: auto;
    max-width: none;
    margin: 0;
    color: var(--edv-dark);
    opacity: 0.82;
    text-shadow: none;
}

/* Post-zoom hero copy — behind green SVG until GSAP zoom reveals it over video */
.edv-hero-second-copy {
    position: absolute;
    inset: 0;
    z-index: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    padding-top: 5rem;
    padding-bottom: 4rem;
    padding-left: clamp(1.25rem, 6vw, 4.5rem);
    padding-right: clamp(1.25rem, 8vw, 3rem);
    pointer-events: none;
}

.edv-hero-second-copy__inner {
    max-width: min(48rem, 100%);
    margin-bottom: 6.5rem;
}
.countries-overlay-video {
    position: absolute;
    bottom: 0;
    left: 0; 
    width: 100%;
    height: 100%;
    z-index: 0; /* Make sure it's above the background */
}
@media (max-width: 1024px) { /* Tablets */
    .countries-overlay-video {
        height: 80%;
        width: 80%;
        left: 50%;
        top: 50%;
        bottom: auto; /* Remove bottom to center it */
        transform: translate(-50%, -50%); /* Center perfectly */
    }
}

@media (max-width: 768px) { /* Mobile */
    .countries-overlay-video {
        height: 70%;
        width: 70%;
        left: 50%;
        top: 50%;
        transform: translate(-50%, -50%);
    }
}

@media (max-width: 480px) { /* Small Mobile */
    .countries-overlay-video {
        height: 90%;
        width: 90%;
        left: 55%;
        top: 80%;
        transform: translate(-50%, -50%);
    }
}



.countries-overlay-logomark {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 9; /* Make sure it's above the background */
}



.overlay-svg {
    position: absolute;
    width: 100%;
    height: auto;
    opacity: 1; /* Ensure it's visible */
}


.noise{
background-image: url(../assets/edvice-media/noise.png), radial-gradient(ellipse at top, #00d350, transparent), radial-gradient(ellipse at bottom, #0e0923, transparent); z-index:1; }

/*body {

    background-image: url(../assets/edvice-media/noise.png), radial-gradient(ellipse at top, #00d350, transparent), radial-gradient(ellipse at bottom, #000, transparent) 
    }*/


.displayit {
    
    z-index: 9; /* Make sure it's above the background */
}

/* Hero CTA */
#hero-cta {
    position: relative;
    z-index: 11;
    margin-bottom: 0rem;
    isolation: isolate;
}

#intro #hero-cta .edv-btn__icon {
    flex-shrink: 0;
    backface-visibility: hidden;
}

/* Hero bottom Discover scroll cue — Edvice black */
#intro #scrolldown {
    cursor: pointer;
    pointer-events: auto;
    text-decoration: none;
}

#intro #scrolldown img {
    display: block;
    width: min(84px, 16vw);
    height: auto;
    filter: brightness(0) saturate(100%);
}

#intro-headline {
    will-change: transform;
}

.intro-headline-block {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    text-align: left;
}

#intro h2,
.intro-headline-text {
    text-align: left;
}

.intro-headline-text {
    font-size: clamp(3.15rem, 9.25vw, 6rem);
    font-weight: 700;
    line-height: 1.06;
    letter-spacing: -0.03em;
    margin: 0;
    text-shadow: none;
}

/* Footer — Edvice green wordmark */
.edv-footer-logo {
    display: inline-block;
    max-width: min(100%, 11rem);
}

@media (min-width: 992px) {
    .edv-footer-logo {
        max-width: 12.5rem;
    }
}

/* Consistent section rhythm (override theme 8rem blocks) */
main > section.inview:not(#intro) {
    padding-top: var(--edv-section-pad-y);
    padding-bottom: var(--edv-section-pad-y);
}

section.edv-cta-band {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

.edv-section__header.mb-5,
.edv-section__header.mb-4 {
    margin-bottom: var(--edv-space-lg) !important;
}

/* Header chrome — always visible, adaptive with logo */
header {
    opacity: 1 !important;
    visibility: visible !important;
    transform: none !important;
    pointer-events: auto;
}

.edv-header-bar {
    display: flex;
    align-items: center;
    gap: 0.65rem;
    width: 100%;
}

#nav-toggle {
    flex: 0 0 auto;
    display: inline-block !important;
    visibility: visible !important;
    opacity: 1 !important;
    z-index: 10001;
    position: relative;
}

.edv-header-title,
header #logo-type {
    flex: 0 1 auto;
    margin-left: auto;
    min-width: 0;
    max-width: min(42vw, 20rem);
    font-size: clamp(0.9rem, 2.2vw, 1.42rem);
    font-weight: 700;
    line-height: 1.2;
    text-align: right;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    transition: color 0.35s ease;
}

.edv-header-logo,
#logo-figure {
    flex: 0 0 auto;
    display: flex;
    justify-content: flex-start;
}

header .go-back {
    display: none !important;
}

body[data-logo-tone="green"] #logo-type,
body[data-logo-tone="green"] .edv-header-title {
    color: var(--edv-green) !important;
}

body[data-logo-tone="light"] #logo-type,
body[data-logo-tone="light"] .edv-header-title {
    color: var(--edv-cream) !important;
}

body[data-logo-tone="green"] header .hamburger-inner,
body[data-logo-tone="green"] header .hamburger-inner::before,
body[data-logo-tone="green"] header .hamburger-inner::after {
    background-color: var(--edv-green) !important;
}

body[data-logo-tone="light"] header .hamburger-inner,
body[data-logo-tone="light"] header .hamburger-inner::before,
body[data-logo-tone="light"] header .hamburger-inner::after {
    background-color: var(--edv-cream) !important;
}

/* Nav open — cream hamburger on cream overlay was invisible */
body.nav-is-active #logo-type,
body.nav-is-active .edv-header-title {
    color: var(--edv-dark) !important;
}

body.nav-is-active header .hamburger-inner,
body.nav-is-active header .hamburger-inner::before,
body.nav-is-active header .hamburger-inner::after,
body.nav-is-active header .hamburger--squeeze.is-active .hamburger-inner,
body.nav-is-active header .hamburger--squeeze.is-active .hamburger-inner::before,
body.nav-is-active header .hamburger--squeeze.is-active .hamburger-inner::after {
    background-color: var(--edv-green) !important;
}

#nav-overlay.number-nav {
    z-index: 9998;
}

/* Mobile nav — sized between compact and original, anchored to bottom */
@media (max-width: 991px) {
    #nav-overlay > .container.h-100 {
        display: flex;
        flex-direction: column;
        min-height: 100vh;
        min-height: 100dvh;
        height: 100% !important;
        padding-top: 5.25rem;
        padding-bottom: max(1.75rem, env(safe-area-inset-bottom));
        box-sizing: border-box;
    }

    #nav-overlay .row.align-items-center {
        flex: 1 1 auto;
        display: flex;
        align-items: flex-end !important;
        width: 100%;
        min-height: 0;
    }

    #nav-overlay .row > nav {
        width: 100%;
    }

    #nav-overlay.number-nav a.h2,
    #nav-overlay.number-nav a {
        font-size: 1.4rem !important;
        line-height: 1.3;
        margin-bottom: 0;
    }

    #nav-overlay.number-nav li {
        margin-bottom: 1.45rem;
    }

    #nav-overlay li span {
        margin-right: 1.15rem;
        width: 1.25rem;
    }

    #nav-overlay .active a:before {
        height: 30px;
        width: 30px;
        left: 10px;
    }

    #nav-overlay a:hover span {
        margin-right: 1.4rem;
    }
}

@media (max-width: 767px) {
    #nav-overlay > .container.h-100 {
        padding-top: 5rem;
    }

    #nav-overlay.number-nav a.h2,
    #nav-overlay.number-nav a {
        font-size: 1.3rem !important;
    }

    #nav-overlay.number-nav li {
        margin-bottom: 1.3rem;
    }

    #nav-overlay li span {
        margin-right: 1rem;
        width: 1.125rem;
    }

    /* CTA only visible below md — extra gap after last nav item */
    #nav-overlay .nav-atlas-cta {
        margin-top: 3.25rem !important;
    }

    .edv-header-title,
    header #logo-type {
        font-size: 0.85rem;
        max-width: calc(100vw - 11.5rem);
    }
}

.edvice-logo-link {
    position: relative;
    display: inline-block;
    width: 173px;
    height: 55px;
}

.edvice-logo-link img {
    max-width: 173px;
    height: auto;
}

@media (max-width: 767px) {
    #logo-figure .edvice-logo-link {
        width: calc(173px * 0.67);
        height: calc(55px * 0.67);
    }

    #logo-figure .edvice-logo-link .edvice-logo-variant {
        width: calc(173px * 0.67);
        max-width: calc(173px * 0.67);
        height: auto;
    }
}

#intro .edv-hero-badge {
    position: relative;
    z-index: 11;
    margin-bottom: var(--edv-space-sm);
}

.py-lg-6 {
    padding-top: 4rem;
    padding-bottom: 4rem;
}

@media (min-width: 992px) {
    .py-lg-6 {
        padding-top: 6rem;
        padding-bottom: 6rem;
    }
}

/* Destinations */
#destinations .destination-flag {
    transition: transform 0.3s ease, opacity 0.3s ease;
}

#destinations a:hover .destination-flag {
    transform: scale(1.05);
}

#destinations a {
    display: block;
    text-decoration: none;
}

/* EdviceAtlas section */
#edvice-atlas .edv-section__lead {
    margin-bottom: 0;
}

#edvice-atlas #atlas-primary-cta {
    margin-top: var(--edv-space-xl, 2.5rem);
}

.edv-launch-title {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.65rem 1rem;
    line-height: 1.1;
}

.edv-launch-title__text {
    color: var(--edv-cream);
    font-size: var(--edv-text-3xl);
}

.edv-atlas-logo-wordmark {
    display: block;
    width: min(100%, 22rem);
    height: auto;
    max-height: none;
    aspect-ratio: 308.59 / 70.63;
    filter: brightness(0) invert(1);
}

#edvice-atlas .edv-atlas-logo-wordmark {
    width: min(100%, clamp(16rem, 42vw, 24rem));
}

#edvice-atlas .atlas-features strong {
    display: block;
    margin-bottom: 0.25rem;
}

#edvice-atlas .atlas-features span {
    font-weight: 400;
    opacity: 0.9;
}

.atlas-mockup-frame {
    background: rgba(242, 247, 242, 0.08);
    border: 2px solid rgba(242, 247, 242, 0.25);
    border-radius: 1rem;
    padding: 2.5rem 2rem;
    text-align: center;
}

.atlas-mockup-frame img {
    max-width: 180px;
    margin-bottom: 1.5rem;
}

.atlas-mockup-caption {
    font-size: 0.95rem;
}

.atlas-cta-btn {
    text-decoration: none !important;
}

@media (max-width: 767px) {
    #intro #hero-cta .edv-btn {
        width: 75%;
        max-width: 75%;
    }

    #intro #hero-cta.edv-hero__actions {
        margin-top: 2.25rem;
    }

    .edv-hero-second-copy__inner {
        margin-bottom: 5rem;
    }
}