
/* =========================================================
   WANDERTINE PREMIUM VISUAL SYSTEM
   Final homepage layer — loads after the base project CSS.
========================================================= */

:root{
    --wt-navy:#081c3a;
    --wt-navy-2:#081C3A;
    --wt-gold:#f39a1e;
    --wt-cream:#f7f4ee;
    --wt-white:#fff;
    --wt-muted:#6d7787;
    --wt-border:rgba(8,28,58,.10);
    --wt-shadow:0 24px 70px rgba(8,28,58,.12);
    --wt-radius:28px;
}

html{scroll-behavior:smooth}
body{
    background:#fff;
    color:var(--wt-navy);
    overflow-x:hidden;
}
img{display:block}
a{text-decoration:none}

/* ---------- Header refinement ---------- */
.site-header{
    position:sticky !important;
    top:0;
    left:0;
    right:0;
    z-index:1000;
    width:100%;
}
.topbar{
    min-height:34px;
    padding:8px 0 !important;
    background:rgba(8,28,58,.97) !important;
    font-size:12px !important;
}
.navbar{
    background:rgba(255,255,255,.96) !important;
    backdrop-filter:blur(18px);
    -webkit-backdrop-filter:blur(18px);
    box-shadow:0 10px 35px rgba(8,28,58,.08) !important;
}
.navbar > .container{
    min-height:82px;
}
.logo img{
    max-height:62px;
    width:auto;
}
.navbar nav ul{
    align-items:center;
}
.navbar nav a{
    font-weight:600 !important;
    transition:color .25s ease;
}
.navbar nav a:hover{color:var(--wt-gold) !important}
.quote-btn{
    box-shadow:0 10px 25px rgba(243,154,30,.25);
}

/* ---------- Hero ---------- */
.hero{
    min-height:100svh !important;
    height:min(900px,100svh);
    margin:0;
    position:relative;
    isolation:isolate;
    display:flex;
    align-items:flex-end;
    overflow:hidden;
}
.hero-media{
    position:absolute;
    inset:0;
    z-index:-5;
    background:
        linear-gradient(120deg,rgba(8,28,58,.94),rgba(8,28,58,.42) 55%,rgba(8,28,58,.20)),
        url("https://images.unsplash.com/photo-1516026672322-bc52d61a55d5?auto=format&fit=crop&w=2200&q=88")
        center/cover no-repeat;
}
.hero-media video,
.hero-slide-media{
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    object-fit:cover;
}
.hero-slide-media{
    opacity:0;
    transition:opacity 1.2s ease,transform 8s ease;
    transform:scale(1.04);
}
.hero-slide-media.is-active{
    opacity:1;
    transform:scale(1);
}
.hero-video{
    z-index:0;
    opacity:.95;
}
.hero-shade{
    position:absolute;
    inset:0;
    z-index:1;
    background:
      linear-gradient(90deg,rgba(8,28,58,.88) 0%,rgba(8,28,58,.55) 45%,rgba(8,28,58,.15) 100%),
      linear-gradient(0deg,rgba(8,28,58,.72) 0%,transparent 48%);
}
.hero-content{
    position:relative;
    z-index:4;
    width:100%;
    height:auto !important;
    padding:105px 0 105px !important;
}
.hero-text{
    max-width:820px;
}
.hero-eyebrow{
    display:inline-flex;
    align-items:center;
    gap:10px;
    padding:9px 14px;
    border:1px solid rgba(255,255,255,.28);
    border-radius:999px;
    background:rgba(255,255,255,.09);
    backdrop-filter:blur(14px);
    color:#fff;
    text-transform:uppercase;
    letter-spacing:.18em;
    font-size:11px;
    font-weight:700;
}
.hero h1{
    margin:20px 0 22px !important;
    color:#fff !important;
    font-size:clamp(3.2rem,6.4vw,6.8rem) !important;
    line-height:.93 !important;
    letter-spacing:-.055em;
    max-width:900px;
}
.hero h1 span{color:var(--wt-gold)}
.hero p{
    max-width:720px !important;
    font-size:clamp(1rem,1.5vw,1.25rem) !important;
    line-height:1.8 !important;
}
.hero-buttons{
    margin-bottom:0 !important;
}
.hero-buttons .btn-primary,
.hero-buttons .btn-secondary{
    min-height:58px;
    padding:0 28px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    border-radius:999px;
    font-weight:700;
}
.hero-micro{
    display:flex;
    flex-wrap:wrap;
    gap:10px;
    margin-top:26px;
}
.hero-micro span{
    padding:9px 13px;
    border-radius:999px;
    background:rgba(255,255,255,.09);
    border:1px solid rgba(255,255,255,.15);
    color:rgba(255,255,255,.9);
    font-size:12px;
}
.hero-controls{
    position:absolute;
    z-index:5;
    right:5%;
    bottom:70px;
    display:flex;
    align-items:center;
    gap:10px;
}
.hero-dot{
    width:42px;
    height:4px;
    border:0;
    border-radius:99px;
    background:rgba(255,255,255,.35);
    cursor:pointer;
}
.hero-dot.is-active{background:var(--wt-gold)}
.hero-scroll{
    z-index:5 !important;
}

/* ---------- Floating planner ---------- */
.visual-planner{
    position:relative;
    z-index:20;
    margin:-48px auto 0;
}
.visual-planner-inner{
    background:#fff;
    border:1px solid var(--wt-border);
    border-radius:var(--wt-radius);
    box-shadow:var(--wt-shadow);
    padding:28px;
}
.visual-planner-grid{
    display:grid;
    grid-template-columns:1.15fr 1fr 1fr 1fr auto;
    gap:14px;
    align-items:end;
}
.visual-planner label{
    display:block;
    font-size:11px;
    text-transform:uppercase;
    letter-spacing:.12em;
    font-weight:800;
    color:var(--wt-muted);
    margin-bottom:8px;
}
.visual-planner select,
.visual-planner input{
    width:100%;
    height:54px;
    border:1px solid var(--wt-border);
    border-radius:14px;
    padding:0 15px;
    background:#fff;
    color:var(--wt-navy);
}
.visual-planner button{
    height:54px;
    border:0;
    border-radius:14px;
    padding:0 24px;
    background:var(--wt-gold);
    color:#fff;
    font-weight:800;
    cursor:pointer;
}

/* ---------- Editorial sections ---------- */
.premium-section{
    padding:120px 0;
}
.premium-section.cream{background:var(--wt-cream)}
.section-kicker{
    display:inline-block;
    color:var(--wt-gold);
    font-size:11px;
    font-weight:800;
    text-transform:uppercase;
    letter-spacing:.2em;
    margin-bottom:12px;
}
.premium-heading{
    font-size:clamp(2.4rem,4vw,4.5rem);
    line-height:1;
    letter-spacing:-.045em;
    margin:0 0 18px;
    color:var(--wt-navy);
}
.premium-copy{
    max-width:650px;
    color:var(--wt-muted);
    line-height:1.85;
}
.section-head{
    display:flex;
    justify-content:space-between;
    align-items:end;
    gap:40px;
    margin-bottom:50px;
}
.section-head .premium-copy{margin:0}

/* ---------- Service image cards ---------- */
.image-services{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:24px;
}
.image-service-card{
    min-height:500px;
    border-radius:var(--wt-radius);
    overflow:hidden;
    position:relative;
    isolation:isolate;
    background:#12294D;
}
.image-service-card::before{
    content:"";
    position:absolute;
    inset:0;
    z-index:-1;
    background:var(--card-image) center/cover no-repeat;
    transition:transform .8s ease;
}
.image-service-card:hover::before{transform:scale(1.07)}
.image-service-card::after{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(0deg,rgba(8,28,58,.92),rgba(8,28,58,.05) 72%);
    z-index:-1;
}
.image-service-content{
    position:absolute;
    inset:auto 28px 28px;
    color:#fff;
}
.image-service-number{
    font-size:12px;
    letter-spacing:.15em;
    font-weight:800;
    color:var(--wt-gold);
}
.image-service-content h3{
    color:#fff;
    font-size:2rem;
    margin:8px 0 10px;
}
.image-service-content p{
    color:rgba(255,255,255,.82);
    line-height:1.7;
    margin:0 0 18px;
}
.text-link{
    color:#fff;
    font-weight:700;
}
.text-link:hover{color:var(--wt-gold)}

/* ---------- Destination mosaic ---------- */
.destination-mosaic{
    display:grid;
    grid-template-columns:1.15fr .85fr .85fr;
    grid-template-rows:280px 280px;
    gap:18px;
}
.destination-tile{
    position:relative;
    overflow:hidden;
    border-radius:24px;
    background:#17304f;
    isolation:isolate;
}
.destination-tile:first-child{grid-row:span 2}
.destination-tile::before{
    content:"";
    position:absolute;
    inset:0;
    z-index:-2;
    background:var(--tile-image) center/cover no-repeat;
    transition:transform .8s ease;
}
.destination-tile:hover::before{transform:scale(1.08)}
.destination-tile::after{
    content:"";
    position:absolute;
    inset:0;
    z-index:-1;
    background:linear-gradient(0deg,rgba(8,28,58,.9),rgba(8,28,58,.03) 75%);
}
.destination-info{
    position:absolute;
    left:24px;
    right:24px;
    bottom:22px;
    color:#fff;
}
.destination-info span{
    font-size:11px;
    letter-spacing:.16em;
    text-transform:uppercase;
    color:rgba(255,255,255,.75);
}
.destination-info h3{
    color:#fff;
    font-size:clamp(1.4rem,2.2vw,2.2rem);
    margin:6px 0 0;
}

/* ---------- Big story ---------- */
.story-grid{
    display:grid;
    grid-template-columns:.9fr 1.1fr;
    gap:80px;
    align-items:center;
}
.story-image{
    min-height:650px;
    border-radius:30px;
    background:
      linear-gradient(0deg,rgba(8,28,58,.18),transparent),
      url("https://images.unsplash.com/photo-1516426122078-c23e76319801?auto=format&fit=crop&w=1500&q=88")
      center/cover no-repeat;
    box-shadow:var(--wt-shadow);
}
.story-points{
    display:grid;
    gap:20px;
    margin-top:35px;
}
.story-point{
    display:grid;
    grid-template-columns:48px 1fr;
    gap:16px;
    align-items:start;
}
.story-point-icon{
    width:48px;
    height:48px;
    border-radius:14px;
    display:grid;
    place-items:center;
    background:#F7F4EE;
    color:var(--wt-gold);
    font-weight:800;
}
.story-point h3{
    margin:0 0 5px;
    font-size:1.1rem;
}
.story-point p{
    margin:0;
    color:var(--wt-muted);
    line-height:1.7;
}

/* ---------- Gallery ---------- */
.travel-gallery{
    display:grid;
    grid-template-columns:1.3fr .7fr .7fr;
    grid-template-rows:260px 260px;
    gap:16px;
}
.gallery-photo{
    border-radius:22px;
    overflow:hidden;
    background:var(--gallery-image) center/cover no-repeat;
    position:relative;
    transition:transform .4s ease;
}
.gallery-photo:hover{transform:translateY(-4px)}
.gallery-photo:first-child{grid-row:span 2}
.gallery-photo:nth-child(4){grid-column:span 2}
.gallery-caption{
    position:absolute;
    left:20px;
    bottom:18px;
    color:#fff;
    font-weight:700;
    text-shadow:0 2px 18px rgba(0,0,0,.4);
}

/* ---------- CTA ---------- */
.premium-cta{
    position:relative;
    overflow:hidden;
    isolation:isolate;
    padding:120px 0;
    color:#fff;
    background:
      linear-gradient(90deg,rgba(8,28,58,.94),rgba(8,28,58,.54)),
      url("https://images.unsplash.com/photo-1500534623283-312aade485b7?auto=format&fit=crop&w=2200&q=88")
      center/cover no-repeat;
}
.premium-cta h2{
    color:#fff;
    max-width:850px;
    font-size:clamp(2.6rem,5vw,5.2rem);
    line-height:.98;
    letter-spacing:-.045em;
}
.premium-cta p{
    max-width:620px;
    color:rgba(255,255,255,.82);
    line-height:1.8;
}
.premium-cta .btn-primary{
    display:inline-flex;
    min-height:58px;
    align-items:center;
    padding:0 28px;
    border-radius:999px;
    margin-top:16px;
}

/* ---------- Footer ---------- */
.footer{
    padding-top:80px !important;
}
.footer a:hover{color:var(--wt-gold) !important}

/* ---------- Responsive ---------- */
@media(max-width:1100px){
    .visual-planner-grid{grid-template-columns:repeat(2,1fr)}
    .visual-planner button{width:100%}
    .image-services{grid-template-columns:1fr 1fr}
    .destination-mosaic{grid-template-columns:1fr 1fr;grid-template-rows:320px 240px 240px}
    .destination-tile:first-child{grid-row:span 1}
    .story-grid{grid-template-columns:1fr;gap:45px}
    .story-image{min-height:520px}
}
@media(max-width:760px){
    .topbar{display:none !important}
    .navbar > .container{min-height:70px}
    .hero{height:auto;min-height:100svh !important}
    .hero-content{padding:145px 0 110px !important}
    .hero h1{font-size:clamp(3rem,15vw,5rem) !important}
    .hero-controls{right:20px;bottom:32px}
    .hero-dot{width:30px}
    .visual-planner{margin:-24px 16px 0}
    .visual-planner-inner{padding:20px}
    .visual-planner-grid{grid-template-columns:1fr}
    .premium-section{padding:80px 0}
    .section-head{display:block;margin-bottom:35px}
    .image-services{grid-template-columns:1fr}
    .image-service-card{min-height:440px}
    .destination-mosaic{
        display:grid;
        grid-template-columns:1fr;
        grid-template-rows:repeat(4,280px);
    }
    .destination-tile:first-child{grid-row:auto}
    .travel-gallery{
        display:grid;
        grid-template-columns:1fr 1fr;
        grid-template-rows:230px 230px 230px;
    }
    .gallery-photo:first-child{grid-row:span 2}
    .gallery-photo:nth-child(4){grid-column:span 2}
    .story-image{min-height:430px}
    .premium-cta{padding:85px 0}
}


/* =========================================================
   FINAL FOOTER — PREMIUM CONTACT / LINKS / NEWSLETTER
========================================================= */
.footer{
    position:relative;
    overflow:hidden;
    background:
        radial-gradient(circle at 18% 20%, rgba(243,154,30,.08) 0 2px, transparent 2.5px) 0 0/22px 22px,
        linear-gradient(135deg,#06172f 0%,#081c3a 55%,#0d274d 100%) !important;
    color:#fff;
    padding:86px 0 0 !important;
}
.footer::before{content:"";position:absolute;inset:0;pointer-events:none;opacity:.16;background:radial-gradient(ellipse at 78% 28%,transparent 0 18%,rgba(255,255,255,.06) 18.2% 18.5%,transparent 18.7%),radial-gradient(ellipse at 65% 55%,transparent 0 24%,rgba(255,255,255,.045) 24.2% 24.5%,transparent 24.7%)}
.footer .container{position:relative;z-index:1}
.footer-grid{display:grid !important;grid-template-columns:1.25fr .85fr .95fr 1.25fr 1.05fr !important;gap:42px !important;align-items:start}
.footer-brand p{max-width:320px;color:rgba(255,255,255,.72);line-height:1.8;margin:20px 0 22px}
.footer-logo{display:inline-flex;align-items:flex-start}
.footer-logo img{width:auto;max-width:190px;height:auto;max-height:72px;object-fit:contain}
.footer-column h3,.footer-contact h3,.footer-newsletter h3{color:var(--wt-gold) !important;font-family:"DM Sans",sans-serif !important;font-size:15px !important;line-height:1.3;text-transform:uppercase;letter-spacing:.08em;margin:0 0 22px !important}
.footer-links{display:grid;gap:12px}
.footer-links a{color:rgba(255,255,255,.84) !important;font-size:14px;transition:transform .2s ease,color .2s ease}
.footer-links a:hover{color:var(--wt-gold) !important;transform:translateX(4px)}
.footer-contact-list{display:grid;gap:14px}
.footer-contact-item{display:grid;grid-template-columns:28px 1fr;gap:10px;align-items:start;color:rgba(255,255,255,.84);font-size:14px;line-height:1.65}
.footer-contact-item .contact-icon{color:var(--wt-gold);font-size:16px;line-height:1.5}
.footer-contact-item a{color:rgba(255,255,255,.9) !important}
.footer-contact-item a:hover{color:var(--wt-gold) !important}
.footer-socials{display:flex;gap:9px;margin-top:24px}
.footer-socials a{width:38px;height:38px;border:1px solid rgba(255,255,255,.28);border-radius:50%;display:grid;place-items:center;color:#fff !important;font-size:12px;font-weight:800;transition:.25s ease}
.footer-socials a:hover{border-color:var(--wt-gold);background:var(--wt-gold);color:#081c3a !important;transform:translateY(-3px)}
.footer-newsletter p{color:rgba(255,255,255,.72);font-size:14px;line-height:1.7;margin:0 0 16px}
.footer-newsletter-form{display:flex;min-height:50px;background:#fff;border-radius:10px;overflow:hidden;box-shadow:0 12px 35px rgba(0,0,0,.14)}
.footer-newsletter-form input{flex:1;min-width:0;border:0;outline:0;padding:0 14px;color:var(--wt-navy);font:inherit}
.footer-newsletter-form button{width:54px;border:0;background:var(--wt-gold);color:#fff;font-size:18px;cursor:pointer}
.footer-bottom{margin-top:56px;padding:20px 0 24px;border-top:1px solid rgba(255,255,255,.14);display:flex !important;justify-content:space-between;align-items:center;gap:20px}
.footer-bottom p{margin:0;color:rgba(255,255,255,.62);font-size:12px}
.footer-legal{display:flex;gap:20px}
.footer-legal a{color:rgba(255,255,255,.62) !important;font-size:12px}
.footer-legal a:hover{color:var(--wt-gold) !important}
.sr-only{position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;margin:-1px !important;overflow:hidden !important;clip:rect(0,0,0,0) !important;white-space:nowrap !important;border:0 !important}
@media(max-width:1050px){.footer-grid{grid-template-columns:1.2fr 1fr 1fr 1.2fr !important}.footer-newsletter{grid-column:1 / -1;max-width:500px}}
@media(max-width:760px){.site-header{position:sticky !important}.footer{padding-top:65px !important}.footer-grid{grid-template-columns:1fr 1fr !important;gap:36px 24px !important}.footer-brand,.footer-newsletter{grid-column:1 / -1}.footer-bottom{display:block !important;text-align:center}.footer-legal{justify-content:center;margin-top:12px}}


/* =========================================================
   FINAL HOMEPAGE CORRECTIONS
   1. Navigation text remains readable on the white floating bar.
   2. Newsletter is removed from the footer.
========================================================= */
.navbar nav a,
.header nav a,
#mobileMenu a{
    color:var(--wt-navy) !important;
}
.navbar nav a:hover,
.header nav a:hover,
#mobileMenu a:hover,
.navbar nav a.active,
.header nav a.active,
#mobileMenu a.active{
    color:var(--wt-gold) !important;
}

/* Keep the menu button readable against the white navigation bar. */
.menu-toggle{
    color:var(--wt-navy) !important;
}
.menu-toggle:hover{
    background:rgba(8,28,58,.06) !important;
}

/* Newsletter has been intentionally removed; keep the footer balanced at four columns. */
.footer-grid{
    grid-template-columns:1.25fr .85fr .95fr 1.25fr !important;
}
.footer-newsletter{
    display:none !important;
}

@media(max-width:1050px){
    .footer-grid{
        grid-template-columns:1.2fr 1fr 1fr 1.2fr !important;
    }
}

@media(max-width:760px){
    .footer-grid{
        grid-template-columns:1fr 1fr !important;
    }
    .footer-brand{
        grid-column:1 / -1;
    }
}
