
/* ============================================================
   Design tokens — Dutch Wanderer
   "Ink & Brass" — one near-black ink, one confident brass accent,
   quiet warm neutrals. Same system in light and dark.
   ============================================================ */
:root{

--bg:#F5F3ED;
--bg-alt:#EDE9DF;
--surface:#FFFFFF;
--surface-2:#F6F3EA;

--text:#14130F;
--text-muted:#57544A;
--text-faint:#8D8879;
--border:#DEDACC;

--navy:#17160F;
--navy-dark:#0B0A07;
--navy-light:#312F26;

--accent:#B4832B;
--accent-hover:#8F6A22;
--accent-tint:#EFE1BE;

--error:#A8453D;
--error-tint:#F0DAD6;
--success:#2F8F5B;

--shadow-soft:0 30px 70px rgba(20,19,15,.10);
--shadow-card:0 18px 44px rgba(20,19,15,.12);

--ease:cubic-bezier(.16,1,.3,1);
--ease-soft:cubic-bezier(.22,.61,.36,1);
--dur-fast:.22s;
--dur-med:.5s;
--dur-slow:.9s;

--font-display:'Fraunces',serif;
--font-body:'Inter',sans-serif;
--font-mono:'JetBrains Mono',monospace;

color-scheme:light;
}

[data-theme="dark"]{

--bg:#0A0A0B;
--bg-alt:#111113;
--surface:#151517;
--surface-2:#1A1A1D;

--text:#F1EEE6;
--text-muted:#9B9689;
--text-faint:#67635A;
--border:#232326;

--navy:#000000;
--navy-dark:#000000;
--navy-light:#1C1C1F;

--accent:#D6A64B;
--accent-hover:#E8BC6C;
--accent-tint:rgba(214,166,75,.14);

--error:#DE8981;
--error-tint:rgba(168,69,61,.22);
--success:#57C08B;

--shadow-soft:0 30px 70px rgba(0,0,0,.5);
--shadow-card:0 18px 44px rgba(0,0,0,.55);

color-scheme:dark;
}

*{
margin:0;
padding:0;
box-sizing:border-box;
font-family:'Inter',sans-serif;
}

h1, h2, h3,
.logo,
.hero-trust-item strong,
.price,
.tour-hero-price,
.modal-price strong{
font-family:'Fraunces',serif;
font-weight:600;
letter-spacing:-.01em;
}

/* Eyebrow / label utility — the mono face carries the "technical,
   confident" register: small caps-like tracking, never decorative. */
.eyebrow,
.section-title p.eyebrow{
font-family:var(--font-mono);
font-size:12px;
font-weight:500;
letter-spacing:.14em;
text-transform:uppercase;
color:var(--accent);
}

/* Theme toggle button, injected into the header by shared.js */
.theme-toggle{
display:inline-flex;
align-items:center;
justify-content:center;
width:40px;
height:40px;
border-radius:50%;
border:1.5px solid rgba(255,255,255,.4);
background:transparent;
color:white;
font-size:15px;
cursor:pointer;
transition:background var(--dur-fast) var(--ease), border-color var(--dur-fast) var(--ease), color var(--dur-fast) var(--ease);
margin-left:6px;
flex-shrink:0;
}
.theme-toggle:hover{ background:rgba(255,255,255,.15); }
header.scrolled .theme-toggle:hover{ background:var(--accent-tint); }
header.scrolled .theme-toggle{
border-color:var(--border);
color:var(--text);
}
.theme-toggle .fa-sun{ display:none; }
[data-theme="dark"] .theme-toggle .fa-sun{ display:inline; }
[data-theme="dark"] .theme-toggle .fa-moon{ display:none; }

/* ============================================================
   Custom cursor — "compass needle" identity: two slim triangular
   blades pivoting on a center point, not a ring/target/crosshair.
   Rest: tilted slightly off-true, like a needle not yet settled.
   Hover: swings toward true north and gains weight/contrast.
   Card hover: gently seeks back and forth, still finding a bearing.
   ============================================================ */
@media (hover:hover) and (pointer:fine){
  html.dw-has-cursor, html.dw-has-cursor *{ cursor:none !important; }
}
.dw-cursor{
position:fixed;
top:0; left:0;
width:74px; height:74px;
margin:-37px 0 0 -37px;
pointer-events:none;
z-index:9999;
opacity:0;
transform:translate3d(-100px,-100px,0);
transition:opacity .2s var(--ease);
will-change:transform;
}
.dw-cursor.is-visible{ opacity:1; }

.dw-cursor-svg{
width:100%;
height:100%;
overflow:visible;
/* Dual halo so the needle stays legible over photos, cards, and both
   light/dark themes at once: a soft light glow to lift it off dark
   or busy backgrounds, plus a crisp dark contour to keep an edge on
   light backgrounds — neither halo alone would cover every case. */
filter:
drop-shadow(0 0 1.5px rgba(11,10,7,.6))
drop-shadow(0 2px 3px rgba(11,10,7,.4))
drop-shadow(0 0 8px rgba(255,255,255,.6));
}

.dw-cursor-needle{
transform-origin:20px 20px;
transform:rotate(-16deg) scale(.94);
transition:transform .55s cubic-bezier(.16,.84,.2,1.28), opacity .3s var(--ease);
opacity:.95;
}

.dw-cursor-needle-n{
fill:var(--accent);
stroke:rgba(255,255,255,.9);
stroke-width:.7;
stroke-linejoin:round;
}

.dw-cursor-needle-s{
fill:rgba(255,255,255,.94);
stroke:var(--accent);
stroke-width:2;
stroke-linejoin:round;
opacity:.92;
}

.dw-cursor-pivot{
fill:var(--surface);
stroke:var(--accent);
stroke-width:2.2;
transition:r .2s var(--ease), fill .2s var(--ease), stroke .2s var(--ease);
}

.dw-cursor.is-active .dw-cursor-pivot{ r:2.2; }
.dw-cursor.is-active .dw-cursor-needle{ transform:rotate(-16deg) scale(.8); }

.dw-cursor.is-hover .dw-cursor-needle{
transform:rotate(2deg) scale(1.32);
opacity:1;
}
.dw-cursor.is-hover .dw-cursor-needle-s{ opacity:1; }

.dw-cursor.is-cta .dw-cursor-needle-n{ fill:white; stroke:var(--accent); }
.dw-cursor.is-cta .dw-cursor-needle-s{ fill:var(--accent); stroke:white; opacity:1; }
.dw-cursor.is-cta .dw-cursor-pivot{ fill:var(--accent); stroke:white; }
.dw-cursor.is-cta::before{
content:'';
position:absolute;
inset:13px;
border-radius:50%;
background:var(--accent);
z-index:-1;
}

.dw-cursor.is-view .dw-cursor-needle{
opacity:1;
transform:scale(1.32) rotate(-13deg);
animation:dwCompassSeek 2.6s ease-in-out infinite;
}
@keyframes dwCompassSeek{
0%, 100%{ transform:scale(1.32) rotate(-13deg); }
50%{ transform:scale(1.32) rotate(17deg); }
}
@media(prefers-reduced-motion: reduce){
.dw-cursor.is-view .dw-cursor-needle{ animation:none; }
}

html{
scroll-behavior:smooth;
overflow-x:hidden;
width:100%;
}

body{
animation:pageFadeIn .6s ease forwards;
position:relative;
}

body::after{
content:'';
position:fixed;
inset:0;
z-index:9998;
pointer-events:none;
opacity:.025;
mix-blend-mode:overlay;
background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

@keyframes pageFadeIn{
from{
opacity:0;
}
to{
opacity:1;
}
}

.btn-primary,
.btn-secondary,
.book-btn,
.book-btn-mobile,
.tour-book-btn,
.modal-submit,
.card-content button,
.faq-cta .btn-primary,
.error-primary,
.error-secondary{
position:relative;
overflow:hidden;
}

.btn-primary:active,
.btn-secondary:active,
.book-btn:active,
.tour-book-btn:active,
.modal-submit:active,
.card-content button:active{
transform:scale(.97);
}

#home, #tours, #destinations, #about, #contact{
scroll-margin-top:88px;
}

.visually-hidden{
position:absolute;
width:1px;
height:1px;
padding:0;
margin:-1px;
overflow:hidden;
clip:rect(0,0,0,0);
white-space:nowrap;
border:0;
}

/* Spam-bot trap: kept out of the tab order and hidden from assistive tech
   (unlike .visually-hidden, which screen readers still announce), so only
   automated form-fillers ever touch it. If it comes back filled in, or the
   form was submitted implausibly fast, we treat the submission as a bot. */
.hp-field{
position:absolute;
left:-9999px;
top:-9999px;
width:1px;
height:1px;
overflow:hidden;
}

.skip-link{
position:fixed;
top:-60px;
left:16px;
background:var(--accent);
color:white;
padding:14px 22px;
border-radius:10px;
text-decoration:none;
font-weight:600;
font-size:14px;
z-index:3000;
transition:top .25s ease;
}

.skip-link:focus{
top:16px;
}

@media(prefers-reduced-motion:reduce){

html{
scroll-behavior:auto;
}

*, *::before, *::after{
animation-duration:.001s !important;
animation-iteration-count:1 !important;
transition-duration:.001s !important;
scroll-behavior:auto !important;
}

.reveal{
opacity:1 !important;
transform:none !important;
}

}

body{
background-color:var(--bg);
background-image:
radial-gradient(circle, rgba(31,58,86,.05) 1px, transparent 1px);
background-size:28px 28px;
color:var(--text);
overflow-x:hidden;
width:100%;
max-width:100vw;
transition:background-color .45s var(--ease), color .45s var(--ease);
}

.card, .info-page-body, footer, header, .btn-primary, .btn-secondary,
.book-btn, .nav-dropdown-menu, input, textarea, select{
transition-property:background-color, color, border-color, box-shadow, transform;
transition-duration:.35s;
transition-timing-function:var(--ease);
}

header{

position:fixed;
top:0;
left:0;
width:100%;
padding:20px 8%;
display:flex;
justify-content:space-between;
align-items:center;
background:rgba(0,0,0,.35);
backdrop-filter:blur(10px);
z-index:999;
transition:background .35s ease, box-shadow .35s ease, padding .35s ease;

}

header.scrolled{

background:var(--surface);
box-shadow:var(--shadow-soft);
padding:14px 8%;

}

header.scrolled .logo{
color:var(--text);
}

header.scrolled nav a{
color:var(--text);
}

header.scrolled .mobile-menu-btn{
color:var(--text);
}

.logo{

font-size:32px;
font-weight:800;
color:white;
letter-spacing:1px;
transition:color .3s ease;
text-decoration:none;
cursor:pointer;
display:inline-block;
}

.logo span{
color:var(--accent);
}

nav ul{

display:flex;
list-style:none;
gap:26px;

}

nav a{

text-decoration:none;
color:white;
font-weight:500;
transition:.3s;
position:relative;

}

nav a:hover{

color:var(--accent);

}

nav a.active-link{
color:var(--accent);
}

nav a.active-link::after{
content:'';
position:absolute;
left:0;
bottom:-8px;
width:100%;
height:2px;
background:var(--accent);
border-radius:2px;
}

.nav-dropdown{
position:relative;
}

.nav-dropdown-btn{
display:flex;
align-items:center;
gap:6px;
background:none;
border:none;
padding:0;
margin:0;
font-family:inherit;
font-size:inherit;
text-decoration:none;
color:white;
font-weight:500;
cursor:pointer;
transition:.3s;
}

.nav-dropdown-btn:hover,
.nav-dropdown.open .nav-dropdown-btn{
color:var(--accent);
}

.nav-dropdown-caret{
font-size:10px;
opacity:.7;
transition:transform .25s ease;
}

.nav-dropdown.open .nav-dropdown-caret{
transform:rotate(180deg);
}

.nav-dropdown-menu{
position:absolute;
top:calc(100% + 18px);
left:50%;
transform:translateX(-50%);
background:var(--surface);
border-radius:14px;
box-shadow:0 18px 40px rgba(0,0,0,.18);
padding:8px;
min-width:220px;
margin:0;
list-style:none;
display:none;
flex-direction:column;
gap:2px;
z-index:500;
}

.nav-dropdown.open .nav-dropdown-menu{
display:flex;
}

.nav-dropdown-menu li{
list-style:none;
}

.nav-dropdown-menu a{
display:block;
padding:10px 12px;
border-radius:10px;
font-size:14px;
font-weight:500;
color:var(--text) !important;
white-space:nowrap;
}

.nav-dropdown-menu a:hover{
background:var(--accent-tint);
color:var(--accent) !important;
}

.nav-dropdown-menu a.active-link::after{
display:none;
}

header.scrolled .nav-dropdown-btn{
color:var(--text);
}

.nav-mobile-cta{
display:none;
}

.nav-mobile-legal{
display:none;
}

.mobile-menu-btn{
display:none;
background:rgba(255,255,255,.15);
border:none;
color:white;
font-size:19px;
width:42px;
height:42px;
border-radius:50%;
align-items:center;
justify-content:center;
cursor:pointer;
transition:color .3s ease, background .3s ease;
position:relative;
z-index:2001;
}

.header-wishlist-btn{
position:relative;
background:none;
border:none;
color:white;
font-size:19px;
cursor:pointer;
width:40px;
height:40px;
display:flex;
align-items:center;
justify-content:center;
transition:color .3s ease, transform .2s ease;
}

.header-wishlist-btn:hover{
transform:scale(1.1);
}

.header-wishlist-btn.has-items i{
color:var(--error);
}

header.scrolled .header-wishlist-btn{
color:var(--text);
}

.wishlist-count{
position:absolute;
top:-2px;
right:-2px;
background:var(--accent);
color:white;
font-size:10px;
font-weight:700;
width:17px;
height:17px;
border-radius:50%;
display:flex;
align-items:center;
justify-content:center;
}

header.scrolled .mobile-menu-btn{
background:rgba(0,0,0,.06);
}

.book-btn{

background:var(--accent);
padding:12px 28px;
border-radius:50px;
color:white;
text-decoration:none;
font-weight:600;
transition:.3s;

}

.book-btn:hover{

background:var(--accent-hover);
transform:translateY(-3px);

}

@media(max-width:1500px) and (min-width:1181px){

header{
padding:18px 4%;
}

.logo{
font-size:26px;
}

nav ul{
gap:16px;
}

nav a,
.nav-dropdown-btn{
font-size:14px;
}

.book-btn{
padding:12px 22px;
font-size:14px;
}

}

@media(max-width:1180px){

.logo{
font-size:20px;
flex-shrink:0;
}

header{
gap:8px;
}

.header-wishlist-btn,
.mobile-menu-btn{
flex-shrink:0;
}

.nav-dropdown{
display:none;
}

.mobile-menu-btn{
display:flex;
}

nav{
position:fixed;
top:0;
right:0;
width:min(320px, 82vw);
height:100vh;
background:rgba(10,10,15,.98);
backdrop-filter:blur(12px);
display:flex;
flex-direction:column;
align-items:center;
justify-content:center;
overflow-y:auto;
padding:24px 0;
transform:translateX(100%);
transition:transform .4s cubic-bezier(.2,.8,.2,1);
z-index:1998;
}

nav.active{
transform:translateX(0);
}

/* The menu toggle sits on top of a dark full-screen overlay whenever the
   menu is open, so it must stay light regardless of the header's own
   scrolled/light state — otherwise the close (X) icon disappears against
   the dark backdrop. */
header.scrolled nav.active ~ .mobile-menu-btn,
nav.active ~ .mobile-menu-btn{
color:white !important;
background:rgba(255,255,255,.15);
}

nav ul{
flex-direction:column;
gap:32px;
text-align:center;
}

nav ul a{
font-size:22px;
color:white;
}

header > .book-btn{
display:none;
}

.nav-mobile-cta{
display:block;
margin-top:10px;
}

.book-btn-mobile{
background:var(--accent);
padding:14px 34px;
border-radius:50px;
color:white;
text-decoration:none;
font-weight:600;
font-size:16px;
transition:.3s;
}

.book-btn-mobile:hover{
background:var(--accent-hover);
}

.nav-mobile-legal{
display:block;
padding-top:22px;
border-top:1px solid rgba(255,255,255,.15);
width:100%;
}

.nav-legal-list{
display:flex;
flex-direction:column;
align-items:center;
gap:14px;
list-style:none;
}

.nav-legal-list a{
font-size:13px;
color:rgba(255,255,255,.55);
text-decoration:none;
letter-spacing:.02em;
transition:color .3s ease;
}

.nav-legal-list a:hover{
color:var(--accent);
}

}

@media(max-width:340px){

.logo{
font-size:17px;
}

header{
padding-left:6%;
padding-right:6%;
}

}

.hero{
min-height:100vh;
min-height:100svh;
display:flex;
flex-direction:column;
justify-content:flex-end;
padding:150px 8% 64px;
position:relative;
overflow:hidden;
}

.hero::before{

content:'';
position:absolute;
inset:-20px;
background-color:var(--navy);
background-image:url("https://images.unsplash.com/photo-1512470876302-972faa2aa9a4?auto=format&fit=crop&w=2000&q=80");
background-size:cover;
background-position:center;
animation:heroKenBurns 20s var(--ease) forwards;
z-index:0;

}

@media(max-width:700px){

.hero::before{
background-image:url("https://images.unsplash.com/photo-1512470876302-972faa2aa9a4?auto=format&fit=crop&w=900&q=80");
animation-duration:14s;
}

}

.hero::after{

content:'';
position:absolute;
inset:0;
background:linear-gradient(180deg, rgba(11,10,7,.15) 0%, rgba(11,10,7,.55) 100%);
z-index:1;

}

@keyframes heroKenBurns{

0%{
transform:scale(1) translate(0,0);
}

100%{
transform:scale(1.1) translate(-1.5%,-1.5%);
}

}

@media(prefers-reduced-motion: reduce){
.hero::before{ animation:none; }
}

.hero-grid{
position:relative;
z-index:2;
max-width:1180px;
}

.hero-kicker{
color:rgba(255,255,255,.7) !important;
margin-bottom:22px;
display:block;
}

.hero-title{

font-size:clamp(44px, 8vw, 108px);
font-weight:600;
line-height:.98;
letter-spacing:-.03em;
color:white;
margin-bottom:36px;
max-width:16ch;

}

.hero-title span{

color:var(--accent);

}

.hero-title span.hero-plain{

color:inherit;

}

.hero-foot{
display:flex;
align-items:flex-end;
justify-content:space-between;
gap:48px;
flex-wrap:wrap;
border-top:1px solid rgba(255,255,255,.18);
padding-top:28px;
}

.hero-desc{
color:rgba(255,255,255,.78);
font-size:17px;
line-height:1.6;
max-width:34ch;
}

/* ===== Language switcher ===== */

.lang-switcher{
position:relative;
margin-right:14px;
}

.lang-switcher-btn{
display:flex;
align-items:center;
gap:6px;
background:none;
border:1px solid rgba(0,0,0,.12);
border-radius:20px;
padding:8px 14px;
font-family:'Inter',sans-serif;
font-size:13px;
font-weight:600;
color:inherit;
cursor:pointer;
transition:.25s;
}

.lang-switcher-btn:hover{
border-color:var(--accent);
color:var(--accent);
}

.lang-switcher-caret{
font-size:9px;
opacity:.6;
}

.lang-switcher-menu{
position:absolute;
top:calc(100% + 10px);
right:0;
background:var(--surface);
border-radius:14px;
box-shadow:0 18px 40px rgba(0,0,0,.18);
padding:8px;
min-width:170px;
display:none;
flex-direction:column;
gap:2px;
z-index:500;
}

.lang-switcher-menu.open{
display:flex;
}

.lang-switcher-item{
display:flex;
align-items:center;
gap:10px;
background:none;
border:none;
text-align:left;
padding:10px 12px;
border-radius:10px;
font-family:'Inter',sans-serif;
font-size:14px;
font-weight:500;
color:var(--text);
cursor:pointer;
}

.lang-switcher-item:hover{
background:var(--accent-tint);
}

.lang-switcher-item.active{
background:var(--accent-tint);
color:var(--accent);
font-weight:700;
}

.lang-flag{
font-size:16px;
}

header.scrolled .lang-switcher-btn{
border-color:rgba(0,0,0,.12);
}

@media(max-width:900px){
.lang-switcher{
margin-right:8px;
}
.lang-switcher-btn span.lang-switcher-current{
display:none;
}
.lang-switcher-btn{
padding:8px 10px;
}
}

/* ===== Tour locations map ===== */

.nl-map-section{
margin:70px auto 0;
max-width:900px;
padding:0 8%;
text-align:center;
}

.nl-map-card{
position:relative;
margin:30px auto 0;
max-width:760px;
padding:38px 24px 34px;
background:linear-gradient(180deg,#f6fbff,#eaf3fc);
border-radius:28px;
box-shadow:0 24px 60px rgba(16,59,115,.12);
overflow:hidden;
}

.nl-map-card::before{
content:'';
position:absolute;
top:-70px;
right:-70px;
width:220px;
height:220px;
border-radius:50%;
background:radial-gradient(circle,rgba(255,140,50,.14),transparent 70%);
pointer-events:none;
}

.nl-map-card::after{
content:'';
position:absolute;
bottom:-90px;
left:-90px;
width:240px;
height:240px;
border-radius:50%;
background:radial-gradient(circle,rgba(16,59,115,.07),transparent 70%);
pointer-events:none;
}

.nl-map-wrap{
position:relative;
max-width:480px;
margin:0 auto;
z-index:1;
aspect-ratio:642.84 / 782.20;
overflow:hidden;
border-radius:18px;
touch-action:none;
cursor:grab;
}

.nl-map-wrap.is-panning{ cursor:grabbing; }

.nl-map-stage{
position:absolute;
inset:0;
transform-origin:0 0;
will-change:transform;
--map-inv-scale:1;
}

.nl-map-wrap:not(.is-panning) .nl-map-stage{
transition:transform .35s cubic-bezier(.2,.8,.2,1);
}

.nl-map-svg{
width:100%;
height:100%;
display:block;
filter:drop-shadow(0 16px 28px rgba(16,59,115,.22));
position:relative;
z-index:1;
}

/* Zoom / pan controls, bottom-right of the card */
.nl-map-zoom-controls{
position:absolute;
right:14px;
bottom:14px;
z-index:10;
display:flex;
flex-direction:column;
gap:6px;
}

.nl-map-zoom-btn{
width:34px;
height:34px;
border:1.5px solid var(--border);
border-radius:10px;
background:var(--surface);
color:var(--text);
font-size:14px;
display:flex;
align-items:center;
justify-content:center;
cursor:pointer;
box-shadow:var(--shadow-card);
transition:background .2s var(--ease), color .2s var(--ease), border-color .2s var(--ease), transform .2s var(--ease);
}

.nl-map-zoom-btn:hover{
background:var(--accent);
border-color:var(--accent);
color:white;
transform:translateY(-2px);
}

.nl-map-zoom-btn:focus-visible{
outline:2px solid var(--accent);
outline-offset:2px;
}

.nl-map-zoom-btn:active{ transform:translateY(0) scale(.94); }

.nl-map-zoom-btn[disabled]{
opacity:.4;
cursor:default;
pointer-events:none;
}

[data-theme="dark"] .nl-map-zoom-btn{
background:var(--surface-2);
border-color:rgba(255,255,255,.14);
color:var(--text);
}

[data-theme="dark"] .nl-map-zoom-btn:hover{
background:var(--accent);
border-color:var(--accent);
color:var(--navy-dark);
}

.nl-map-hint{
position:absolute;
left:14px;
bottom:14px;
z-index:10;
display:flex;
align-items:center;
gap:6px;
font-family:var(--font-mono);
font-size:10px;
letter-spacing:.06em;
color:var(--text-muted);
background:rgba(255,255,255,.85);
padding:6px 10px;
border-radius:20px;
box-shadow:0 6px 16px rgba(16,59,115,.14);
pointer-events:none;
opacity:1;
transition:opacity .4s var(--ease);
}

.nl-map-hint.is-hidden{ opacity:0; }

@media(max-width:700px){
.nl-map-hint{ display:none; }
}

.nl-map-provinces path{
fill:#fbfdff;
stroke:#c9dcf2;
stroke-width:1.6;
stroke-linejoin:round;
transition:fill .25s ease, stroke .25s ease;
}

.nl-map-provinces path:hover{
fill:var(--accent-tint);
stroke:#ffb877;
}

.nl-map-pins{
position:absolute;
inset:0;
z-index:2;
}

.nl-map-pins{
}

.nl-map-pin{
position:absolute;
transform:translate(-50%,-100%) scale(var(--map-inv-scale));
transform-origin:50% 100%;
background:none;
border:none;
padding:0;
margin:0;
cursor:pointer;
z-index:3;
-webkit-tap-highlight-color:transparent;
}

/* Secondary layer: smaller towns + a water label, revealed as the
   visitor zooms in — the 9 destinations stay the visual focus at
   every zoom level, this layer is deliberately quieter (no big pin,
   no photo preview) so it reads as "more information", not "more
   destinations". Counter-scaled the same way as the main pins. */
.nl-map-cities{
position:absolute;
inset:0;
z-index:2;
pointer-events:none;
}

.nl-map-city{
position:absolute;
transform:translate(-50%,-50%) scale(var(--map-inv-scale));
transform-origin:50% 50%;
display:flex;
align-items:center;
gap:5px;
opacity:0;
transition:opacity .5s var(--ease);
white-space:nowrap;
}

.nl-map-city-dot{
width:4px;
height:4px;
border-radius:50%;
background:var(--navy);
opacity:.55;
flex:none;
}

.nl-map-city-label{
font-family:var(--font-mono);
font-size:9.5px;
letter-spacing:.02em;
color:var(--navy);
opacity:.6;
text-shadow:0 1px 2px rgba(255,255,255,.7);
}

.nl-map-water-label{
position:absolute;
transform:translate(-50%,-50%) scale(var(--map-inv-scale));
transform-origin:50% 50%;
font-family:var(--font-display);
font-style:italic;
font-weight:500;
font-size:11px;
letter-spacing:.03em;
color:#6E9FC7;
opacity:0;
transition:opacity .5s var(--ease);
pointer-events:none;
z-index:1;
white-space:nowrap;
}

/* Zoom 1× (default): only the country silhouette, provinces and the
   9 destinations — everything in this layer stays hidden. */
.nl-map-city,
.nl-map-water-label{ opacity:0; }

/* Zoom ~1.7×+: bigger cities and the main body of water appear. */
.nl-map-stage.zoom-lvl-2 .nl-map-city.city-tier-1,
.nl-map-stage.zoom-lvl-2 .nl-map-water-label{ opacity:1; }

/* Zoom ~2.6×+: the rest of the smaller towns fade in too. */
.nl-map-stage.zoom-lvl-3 .nl-map-city.city-tier-2{ opacity:1; }

[data-theme="dark"] .nl-map-city-dot{ background:var(--text); opacity:.6; }
[data-theme="dark"] .nl-map-city-label{
color:var(--text);
opacity:.75;
text-shadow:0 1px 3px rgba(0,0,0,.6);
}
[data-theme="dark"] .nl-map-water-label{ color:#7FB2DE; opacity:0; }
[data-theme="dark"] .nl-map-stage.zoom-lvl-2 .nl-map-water-label{ opacity:.85; }

/* Enlarged invisible tap target (44px+) without moving the visual dot,
   since the button itself is anchored by transform:translate(-50%,-100%)
   and must keep its exact box for that math to stay correct. */
.nl-map-pin::before{
content:'';
position:absolute;
left:50%; bottom:0;
width:44px; height:44px;
transform:translate(-50%, 10px);
}

.nl-map-pin:hover,
.nl-map-pin:focus-visible,
.nl-map-pin.active{
z-index:30;
}

.nl-map-pin-dot{
position:relative;
display:flex;
align-items:center;
justify-content:center;
width:24px;
height:24px;
border-radius:50% 50% 50% 0;
background:var(--accent);
transform:rotate(-45deg);
box-shadow:0 3px 8px rgba(31,58,86,.35), 0 0 0 3px var(--surface);
transition:transform .25s ease, background .25s ease;
}

.nl-map-pin-dot i{
transform:rotate(45deg);
color:white;
font-size:10px;
}

.nl-map-pin-dot::after{
content:'';
position:absolute;
inset:-8px;
border-radius:50%;
border:2px solid rgba(255,140,50,.45);
animation:nlPinPulse 2.4s ease-out infinite;
pointer-events:none;
}

@keyframes nlPinPulse{
0%{transform:scale(.6);opacity:.9;}
100%{transform:scale(1.8);opacity:0;}
}

.nl-map-pin:hover .nl-map-pin-dot,
.nl-map-pin:focus-visible .nl-map-pin-dot,
.nl-map-pin.active .nl-map-pin-dot{
background:var(--navy);
transform:rotate(-45deg) scale(1.2);
}

.nl-map-pin-tooltip{
position:absolute;
bottom:calc(100% + 14px);
left:50%;
transform:translateX(-50%) translateY(6px);
width:158px;
background:var(--surface);
border-radius:14px;
box-shadow:0 18px 36px rgba(16,59,115,.28);
overflow:hidden;
opacity:0;
visibility:hidden;
pointer-events:none;
transition:opacity .2s ease, transform .2s ease;
text-align:left;
}

.nl-map-pin:hover .nl-map-pin-tooltip,
.nl-map-pin:focus-visible .nl-map-pin-tooltip,
.nl-map-pin.active .nl-map-pin-tooltip{
opacity:1;
visibility:visible;
pointer-events:auto;
transform:translateX(-50%) translateY(0);
}

.nl-map-pin-tooltip::after{
content:'';
position:absolute;
top:100%;
left:50%;
transform:translateX(-50%);
border:7px solid transparent;
border-top-color:white;
}

.nl-map-pin-tooltip img{
width:100%;
height:72px;
object-fit:cover;
display:block;
}

.nl-map-pin-tooltip-body{
display:block;
padding:9px 11px 11px;
}

.nl-map-pin-tooltip-title{
display:block;
font-family:'Inter',sans-serif;
font-size:12px;
font-weight:700;
color:var(--navy);
line-height:1.3;
margin-bottom:5px;
}

.nl-map-pin-tooltip-price{
display:block;
font-family:'Inter',sans-serif;
font-size:11.5px;
font-weight:600;
color:var(--text-muted);
margin-bottom:5px;
}

.nl-map-pin-tooltip-price:empty{
display:none;
}

.nl-map-pin-tooltip-cta{
display:inline-flex;
align-items:center;
gap:5px;
font-size:10.5px;
font-weight:600;
color:var(--accent);
}

.nl-map-pin-tooltip-cta::after{
content:'\2192';
}

/* ===== Review dates + guide replies ===== */

.t-card-date{
display:block;
font-size:12px;
color:var(--text-faint);
margin-top:2px;
}

.guide-reply{
margin-top:14px;
padding:12px 14px;
background:var(--accent-tint);
border-left:3px solid var(--accent);
border-radius:0 10px 10px 0;
font-size:13px;
line-height:1.6;
color:var(--text-muted);
}

.guide-reply strong{
color:var(--accent);
display:block;
margin-bottom:3px;
font-size:12px;
text-transform:uppercase;
letter-spacing:.03em;
}

.tour-review-date{
font-size:12px;
color:var(--text-faint);
margin-top:2px;
}

.hero p{

font-size:22px;
line-height:1.8;
margin-bottom:45px;
opacity:.95;

}

.buttons{

display:flex;
align-items:center;
gap:32px;
flex-wrap:wrap;

}

.hero-stats{

position:relative;
z-index:2;
display:flex;
gap:clamp(20px, 4vw, 56px);
flex-wrap:wrap;
margin-top:56px;
padding-top:28px;
border-top:1px solid rgba(255,255,255,.18);

}

.hero-trust-item{

display:flex;
flex-direction:column;
gap:4px;

}

.hero-trust-item strong{

font-family:var(--font-mono);
font-size:22px;
font-weight:600;
color:white;
display:flex;
align-items:center;
gap:6px;
letter-spacing:-.01em;

}

.hero-trust-item strong i{

font-size:14px;
color:var(--accent);

}

.hero-trust-item span{

font-size:12px;
color:rgba(255,255,255,.6);
text-transform:uppercase;
letter-spacing:.08em;

}

@media(max-width:700px){

.hero-stats{
gap:22px;
margin-top:36px;
padding-top:20px;
}

.hero-trust-item strong{
font-size:18px;
}

}

.btn{

padding:17px 34px;
border-radius:4px;
text-decoration:none;
font-weight:600;
font-size:15px;
letter-spacing:-.005em;
transition:transform var(--dur-fast) var(--ease), background-color var(--dur-fast) var(--ease), color var(--dur-fast) var(--ease);
display:inline-block;

}

.btn-primary{

background:var(--accent);
color:var(--navy);

}

.btn-primary:hover{

background:var(--accent-hover);
color:white;
transform:translateY(-3px);

}

.btn-secondary{

border:1.5px solid var(--border);
color:var(--text);
background:transparent;

}

.btn-secondary:hover{

border-color:var(--accent);
color:var(--accent);

}

/* Quiet secondary hero action — icon + underline-on-hover text, no box.
   Reads as a real interactive object without competing with the CTA. */
.hero-ghost-link{
display:inline-flex;
align-items:center;
gap:10px;
color:white;
text-decoration:none;
font-weight:500;
font-size:15px;
position:relative;
}
.hero-ghost-link i{
width:38px; height:38px;
display:inline-flex;
align-items:center;
justify-content:center;
border:1.5px solid rgba(255,255,255,.4);
border-radius:50%;
font-size:11px;
transition:background var(--dur-fast) var(--ease), border-color var(--dur-fast) var(--ease);
}
.hero-ghost-link span{
position:relative;
}
.hero-ghost-link span::after{
content:'';
position:absolute;
left:0; right:0; bottom:-3px;
height:1px;
background:currentColor;
transform:scaleX(0);
transform-origin:left;
transition:transform var(--dur-med) var(--ease);
}
.hero-ghost-link:hover i{
background:var(--accent);
border-color:var(--accent);
}
.hero-ghost-link:hover span::after{ transform:scaleX(1); }

.scroll{

position:absolute;

bottom:132px;

left:50%;

transform:translateX(-50%);

font-size:14px;

color:white;

z-index:7;

display:flex;
flex-direction:column;
align-items:center;
gap:12px;
text-decoration:none;

}

.scroll-label{
font-family:var(--font-mono);
font-size:10.5px;
letter-spacing:.18em;
text-transform:uppercase;
color:rgba(255,255,255,.95);
writing-mode:horizontal-tb;
text-shadow:0 2px 10px rgba(0,0,0,.4);
}

.scroll i{
width:50px;
height:50px;
display:flex;
align-items:center;
justify-content:center;
font-size:17px;
color:var(--navy);
border-radius:50%;
background:var(--accent);
box-shadow:0 12px 30px rgba(0,0,0,.35), 0 0 0 5px rgba(255,255,255,.2);
animation:scrollHint 2.2s var(--ease) infinite;
transition:background var(--dur-fast) var(--ease), transform var(--dur-fast) var(--ease), box-shadow var(--dur-fast) var(--ease);
}

.scroll:hover i{
background:white;
color:var(--navy);
transform:scale(1.1);
box-shadow:0 16px 36px rgba(0,0,0,.4), 0 0 0 6px rgba(255,255,255,.3);
}

@keyframes scrollHint{
0%, 100%{ transform:translateY(0); }
50%{ transform:translateY(9px); }
}

@media(prefers-reduced-motion: reduce){
.scroll i{ animation:none; }
}

@media(max-width:700px){
.scroll i{ width:42px; height:42px; font-size:15px; }
.scroll-label{ font-size:9px; }
}

section{

padding:100px 8%;

}

.section-title{

text-align:left;
max-width:640px;
margin:0 0 72px;
position:relative;
padding-left:26px;

}

/* Signature: a thin ink line that draws itself once, the moment the
   section enters view — a single deliberate gesture instead of a
   continuous decorative loop. */
.section-title::before{
content:'';
position:absolute;
left:0; top:6px;
width:2px;
height:0;
background:var(--accent);
transform-origin:top;
transition:height .7s var(--ease) .1s;
}
.section-title.visible::before,
.section-title.reveal.visible::before{ height:calc(100% - 6px); }

.section-title p.eyebrow{
font-family:var(--font-mono);
color:var(--accent);
font-weight:500;
letter-spacing:.14em;
text-transform:uppercase;
font-size:12px;
margin-bottom:14px;
}

.section-title h2{

font-size:clamp(32px, 4.2vw, 52px);
line-height:1.05;
margin-bottom:16px;
letter-spacing:-.02em;

}

.section-title p{

color:var(--text-muted);
font-size:17px;
line-height:1.6;
max-width:52ch;

}

@media(max-width:700px){
.section-title{ padding-left:18px; margin-bottom:48px; }
}

.spotlight{
position:relative;
z-index:1;
display:grid;
grid-template-columns:1.1fr 1fr;
gap:0;
background:var(--surface);
border-radius:26px;
overflow:hidden;
box-shadow:0 30px 70px rgba(16,59,115,.12);
margin-bottom:60px;
}

.spotlight-img{
position:relative;
min-height:340px;
background:linear-gradient(135deg,var(--navy),var(--navy-light));
}

.spotlight-img img{
width:100%;
height:100%;
object-fit:cover;
display:block;
}

.spotlight-badge{
position:absolute;
top:24px;
left:24px;
background:var(--accent);
color:white;
font-size:12px;
font-weight:700;
letter-spacing:.5px;
text-transform:uppercase;
padding:8px 18px;
border-radius:50px;
}

.spotlight-content{
padding:50px;
display:flex;
flex-direction:column;
justify-content:center;
}

.spotlight-content .eyebrow{
color:var(--accent);
font-weight:600;
letter-spacing:2px;
text-transform:uppercase;
font-size:13px;
margin-bottom:10px;
}

.spotlight-content h3{
font-size:32px;
margin-bottom:16px;
}

.spotlight-content p{
color:var(--text-muted);
line-height:1.85;
font-size:15.5px;
margin-bottom:24px;
}

.spotlight-facts{
list-style:none;
display:flex;
flex-wrap:wrap;
gap:18px;
margin-bottom:30px;
color:var(--text-muted);
font-size:14px;
}

.spotlight-facts li{
display:flex;
align-items:center;
gap:7px;
}

.spotlight-facts i{
color:var(--accent);
}

.spotlight-cta{
display:flex;
align-items:center;
justify-content:space-between;
gap:20px;
flex-wrap:wrap;
}

.spotlight-price{
font-family:'Fraunces',serif;
font-size:28px;
font-weight:600;
color:var(--accent);
}

.spotlight-price small{
font-family:'Inter',sans-serif;
font-size:13px;
color:var(--text-faint);
font-weight:400;
}

.btn-primary-inline{
display:inline-flex;
align-items:center;
gap:10px;
background:var(--navy);
color:white;
padding:15px 30px;
border-radius:50px;
text-decoration:none;
font-weight:600;
font-size:14.5px;
transition:.3s;
}

.btn-primary-inline:hover{
background:var(--navy-dark);
gap:14px;
}

@media(max-width:900px){

.spotlight{
grid-template-columns:1fr;
}

.spotlight-img{
min-height:220px;
}

.spotlight-content{
padding:32px;
}

.spotlight-content h3{
font-size:26px;
}

}

.tours{

display:grid;

grid-template-columns:repeat(auto-fit,minmax(340px,1fr));

gap:35px;

}

@media(max-width:700px){

/* Simple stacked list instead of a horizontal swipe carousel - easier to
   browse and compare tours on a phone than guessing whether to swipe or
   scroll. Each card takes the full width, one after another. */
.tours{
display:grid;
grid-template-columns:1fr;
gap:20px;
}

.tours .card.filtered-out{
display:none;
}

}

@media(min-width:701px){

.swipe-hint{
display:none;
}

}

.card{

background:var(--surface);

border-radius:2px;
border:1px solid var(--border);

overflow:hidden;

box-shadow:none;

transition:border-color var(--dur-med) var(--ease), transform var(--dur-med) var(--ease), box-shadow var(--dur-med) var(--ease);

display:flex;
flex-direction:column;

}

.card:hover{

border-color:var(--accent);
box-shadow:var(--shadow-card);

}

.card-img-wrap{
position:relative;
background:linear-gradient(135deg,var(--navy),var(--navy-light));
overflow:hidden;
}

.card img{

width:100%;

height:250px;

object-fit:cover;
display:block;
transition:transform var(--dur-slow) var(--ease);

}

.card:hover img{
transform:scale(1.045);
}

.badge{
position:absolute;
top:16px;
left:16px;
background:var(--navy);
color:white;
font-size:12px;
font-weight:600;
letter-spacing:.5px;
text-transform:uppercase;
padding:6px 14px;
border-radius:50px;
}

.badge.orange{
background:var(--accent);
}

.wishlist-btn{
position:absolute;
top:14px;
right:14px;
width:34px;
height:34px;
border-radius:50%;
background:rgba(0,0,0,.28);
backdrop-filter:blur(2px);
border:none;
color:white;
font-size:16px;
cursor:pointer;
display:flex;
align-items:center;
justify-content:center;
transition:.25s;
z-index:1;
}

.wishlist-btn:hover{
background:rgba(0,0,0,.45);
transform:scale(1.08);
transform:scale(1.08);
}

.wishlist-btn.saved{
color:var(--error);
}

.wishlist-btn.saved i{
font-weight:900;
}

@keyframes heartPop{
0%{transform:scale(1);}
40%{transform:scale(1.35);}
100%{transform:scale(1);}
}

.wishlist-btn.pop{
animation:heartPop .35s ease;
}

.card-content{

padding:25px;
display:flex;
flex-direction:column;
flex-grow:1;

}

.card-content h3{
font-size:22px;
margin-bottom:6px;
}

.meta{
display:flex;
gap:16px;
color:var(--text-faint);
font-size:14px;
margin-bottom:14px;
}

.meta span{
display:flex;
align-items:center;
gap:6px;
}

.card-content ul{
list-style:none;
margin-bottom:auto;
padding-bottom:20px;
color:var(--text-muted);
font-size:15px;
line-height:1.9;
}

.card-content ul li i{
color:var(--accent);
width:18px;
}

.price-row{
display:flex;
align-items:baseline;
justify-content:space-between;
margin-bottom:18px;
}

.details-link{
display:inline-flex;
align-items:center;
gap:6px;
color:var(--navy);
text-decoration:none;
font-size:13.5px;
font-weight:600;
margin-bottom:14px;
transition:.25s;
}

.details-link:hover{
color:var(--accent);
gap:9px;
}

.details-link i{
font-size:11px;
}

.price{

font-size:30px;

font-weight:700;

color:var(--accent);

}

.price small{
font-size:14px;
color:var(--text-faint);
font-weight:400;
}

.card-content button{

width:100%;

padding:16px;

background:var(--navy);

color:white;

border:none;

border-radius:12px;

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

cursor:pointer;

transition:.3s;

}

.card-content button:hover{

background:var(--navy-dark);

}

/* Destinations */

.destinations{
background:var(--bg-alt);
position:relative;
overflow:hidden;
}

.destinations::before{
content:'';
position:absolute;
top:-120px;
right:10%;
width:340px;
height:340px;
border-radius:50%;
background:radial-gradient(circle, rgba(16,59,115,.07), transparent 70%);
z-index:0;
pointer-events:none;
}

.destinations .section-title,
.destinations .dest-grid{
position:relative;
z-index:1;
}

.dest-grid{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(230px,1fr));
gap:25px;
}

.dest-card{
position:relative;
border-radius:16px;
overflow:hidden;
height:280px;
cursor:pointer;
}

.dest-card img{
width:100%;
height:100%;
object-fit:cover;
transition:.5s;
}

.dest-card:hover img{
transform:scale(1.1);
}

.dest-overlay{
position:absolute;
inset:0;
background:linear-gradient(to top,rgba(0,0,0,.75),transparent 60%);
display:flex;
align-items:flex-end;
padding:20px;
}

.dest-index{
position:absolute;
top:14px;
left:16px;
z-index:2;
font-family:var(--font-mono);
font-size:12px;
font-weight:600;
letter-spacing:.04em;
color:white;
text-shadow:0 2px 8px rgba(0,0,0,.4);
opacity:.9;
}

.dest-index em{
font-style:normal;
font-weight:400;
opacity:.65;
margin-left:1px;
}

.dest-overlay h4{
color:white;
font-size:22px;
}

.dest-overlay p{
color:#ffd8b0;
font-size:14px;
}

/* About */

.about{
display:grid;
grid-template-columns:1fr 1fr;
gap:60px;
align-items:center;
}

.about img{
width:100%;
border-radius:20px;
}

.about h2{
font-size:40px;
margin-bottom:20px;
}

.about p{
color:var(--text-muted);
line-height:1.9;
margin-bottom:18px;
font-size:16px;
}

.stats{
display:flex;
gap:40px;
margin-top:30px;
}

.stats div h3{
font-size:34px;
color:var(--accent);
}

.stats div p{
color:var(--text-muted);
font-size:14px;
margin:0;
}

/* Testimonials */

.testimonials{
background:var(--navy);
color:white;
}

.testimonials .section-title h2,
.testimonials .section-title p{
color:white;
}

.testimonials .section-title p{
opacity:.7;
}

.t-grid{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(300px,1fr));
gap:30px;
}

.t-card{
background:rgba(255,255,255,.07);
padding:30px;
border-radius:16px;
}

.t-card .stars{
color:var(--accent);
margin-bottom:14px;
}

.t-card p{
opacity:.9;
line-height:1.8;
margin-bottom:20px;
}

.t-author{
display:flex;
align-items:center;
gap:14px;
}

.t-author img{
width:46px;
height:46px;
border-radius:50%;
object-fit:cover;
}

.t-author strong{
display:block;
font-size:15px;
}

.t-author span{
font-size:13px;
opacity:.7;
}

/* Homepage FAQ preview */

.faq-preview-section{
background:var(--bg-alt);
}

.faq-preview-section .faq-list-preview{
max-width:760px;
margin:0 auto;
padding:0;
}

.faq-preview-cta{
display:flex;
align-items:center;
justify-content:center;
gap:10px;
max-width:760px;
margin:36px auto 0;
color:var(--navy);
font-weight:600;
text-decoration:none;
transition:.25s;
}

.faq-preview-cta i{
transition:.25s;
}

.faq-preview-cta:hover{
color:var(--accent);
}

.faq-preview-cta:hover i{
transform:translateX(4px);
}

/* Newsletter */

.newsletter{
background:var(--accent);
text-align:center;
color:white;
}

.newsletter h2{
font-size:34px;
margin-bottom:12px;
}

.newsletter p{
opacity:.9;
margin-bottom:30px;
}

.newsletter form{
display:flex;
justify-content:center;
gap:12px;
flex-wrap:wrap;
}

.newsletter input{
padding:16px 22px;
border-radius:50px;
border:none;
width:320px;
max-width:80vw;
font-size:16px;
}

.newsletter button{
padding:16px 32px;
border-radius:50px;
border:none;
background:var(--navy);
color:white;
font-weight:600;
cursor:pointer;
transition:.3s;
}

.newsletter button:hover{
background:var(--navy-dark);
}

/* Footer */

footer{
background:var(--navy-dark);
color:#B8B0A0;
padding:70px 8% 30px;
}

.footer-grid{
display:grid;
grid-template-columns:2fr 1fr 1fr 1.3fr;
gap:40px;
margin-bottom:50px;
}

.footer-grid h4{
color:white;
margin-bottom:20px;
font-size:17px;
}

.footer-grid p{
line-height:1.8;
font-size:14px;
margin-bottom:18px;
}

.footer-grid ul{
list-style:none;
}

.footer-grid ul li{
margin-bottom:12px;
}

.footer-grid ul a{
color:#aaa;
text-decoration:none;
font-size:14px;
transition:.3s;
}

.footer-grid ul a:hover{
color:var(--accent);
}

.footer-grid .social{
display:flex;
gap:14px;
margin-top:10px;
}

.footer-grid .social a{
width:38px;
height:38px;
border-radius:50%;
background:rgba(255,255,255,.08);
display:flex;
align-items:center;
justify-content:center;
color:white;
text-decoration:none;
transition:.3s;
}

.footer-grid .social a:hover{
background:var(--accent);
}

.footer-map{
border-radius:16px;
overflow:hidden;
margin-bottom:40px;
filter:grayscale(.3) contrast(1.05);
opacity:.9;
}

.footer-bottom{
border-top:1px solid rgba(255,255,255,.1);
padding-top:25px;
text-align:center;
font-size:13px;
}

/* Wave divider */

.wave-divider{
position:absolute;
bottom:-1px;
left:0;
right:0;
width:auto;
line-height:0;
z-index:3;
pointer-events:none;
}

.wave-divider svg{
display:block;
width:100%;
height:90px;
}

/* Tours section decoration */

.tours-section{
position:relative;
background:var(--bg-alt);
overflow:hidden;
}

.tours-section::before{
content:'';
position:absolute;
top:-140px;
right:-140px;
width:420px;
height:420px;
border-radius:50%;
background:radial-gradient(circle, rgba(255,140,50,.14), transparent 70%);
z-index:0;
pointer-events:none;
}

.tours-section::after{
content:'';
position:absolute;
bottom:-160px;
left:-160px;
width:460px;
height:460px;
border-radius:50%;
background:radial-gradient(circle, rgba(16,59,115,.09), transparent 70%);
z-index:0;
pointer-events:none;
}

.tours-section .section-title,
.tours-section .tours{
position:relative;
z-index:1;
}

/* Card hover spotlight */

.tours .card{
transition:transform .4s ease, opacity .4s ease, box-shadow .4s ease;
}

.tours.dimming .card{
opacity:.4;
transform:scale(.96);
}

.tours.dimming .card.card-active-hover{
opacity:1;
transform:translateY(-14px) scale(1.035);
box-shadow:0 30px 65px rgba(255,106,0,.28);
z-index:3;
}

.card-img-wrap,
.card-content h3{
cursor:pointer;
}

/* About section decoration */

.about{
position:relative;
background:linear-gradient(180deg, var(--surface) 0%, var(--bg-alt) 100%);
overflow:hidden;
}

.about::before{
content:'';
position:absolute;
top:-100px;
left:40%;
width:380px;
height:380px;
border-radius:50%;
background:radial-gradient(circle, rgba(255,140,50,.10), transparent 70%);
z-index:0;
pointer-events:none;
}

.about > img,
.about > div{
position:relative;
z-index:1;
}

/* Back to top */

.back-to-top{
position:fixed;
bottom:26px;
right:26px;
width:48px;
height:48px;
border-radius:50%;
background:var(--navy);
color:white;
border:none;
display:flex;
align-items:center;
justify-content:center;
font-size:17px;
cursor:pointer;
box-shadow:0 10px 30px rgba(0,0,0,.22);
opacity:0;
pointer-events:none;
transform:translateY(16px);
transition:.35s ease;
z-index:1300;
}

.back-to-top.visible{
opacity:1;
pointer-events:auto;
transform:translateY(0);
}

.back-to-top:hover{
background:var(--accent);
}

@media(max-width:600px){

.back-to-top{
width:42px;
height:42px;
bottom:16px;
right:16px;
font-size:15px;
}

}

/* Urgency / scarcity note (spots left) */

.urgency-note{
display:flex;
align-items:center;
gap:7px;
font-size:13px;
font-weight:600;
color:#c2540a;
background:var(--accent-tint);
border:1px solid #ffd9b0;
padding:7px 12px;
border-radius:10px;
margin:10px 0;
width:fit-content;
}

.urgency-note i{
color:var(--accent);
}

.tour-hero-info .urgency-note{
background:rgba(255,255,255,.14);
border-color:rgba(255,255,255,.35);
color:#fff;
}

.tour-hero-info .urgency-note i{
color:#ffb066;
}

/* Group / corporate rate note */

.group-note{
display:flex;
align-items:center;
gap:6px;
flex-wrap:wrap;
font-size:12.5px;
color:var(--text-muted);
margin-top:10px;
text-align:center;
justify-content:center;
}

.group-note i{
color:var(--navy);
}

.group-note a{
color:var(--navy);
font-weight:600;
text-decoration:underline;
}

.group-note a:hover{
color:var(--accent);
}

/* WhatsApp floating contact button */

.whatsapp-float{
position:fixed;
bottom:96px;
right:26px;
width:52px;
height:52px;
border-radius:50%;
background:#25D366;
color:white;
display:flex;
align-items:center;
justify-content:center;
font-size:26px;
box-shadow:var(--shadow-soft);
z-index:1300;
text-decoration:none;
transition:transform var(--dur-fast) var(--ease), box-shadow var(--dur-fast) var(--ease);
}

.whatsapp-float:hover{
transform:translateY(-3px) scale(1.05);
}

.whatsapp-float-bubble{
position:fixed;
bottom:104px;
right:88px;
background:var(--navy);
color:white;
padding:9px 16px;
border-radius:4px;
font-size:13px;
font-weight:500;
white-space:nowrap;
box-shadow:var(--shadow-soft);
z-index:1299;
opacity:0;
pointer-events:none;
transform:translateX(8px);
transition:.3s var(--ease);
}

.whatsapp-float-bubble.visible{
opacity:1;
transform:translateX(0);
}

@media(max-width:600px){

.whatsapp-float{
width:48px;
height:48px;
bottom:84px;
right:16px;
font-size:23px;
}

.whatsapp-float-bubble{
display:none;
}

}

.modal-overlay{
position:fixed;
inset:0;
background:rgba(10,10,15,.6);
backdrop-filter:blur(4px);
display:none;
align-items:center;
justify-content:center;
z-index:2000;
padding:20px;
}

.modal-overlay.active{
display:flex;
}

.modal-box{
background:var(--surface);
width:100%;
max-width:480px;
border-radius:20px;
padding:36px;
position:relative;
max-height:90vh;
overflow-y:auto;
animation:modalIn .35s ease;
z-index:2;
transform:translateZ(0);
-webkit-transform:translateZ(0);
}

@keyframes modalIn{
from{opacity:0;transform:translateY(20px) scale(.97);}
to{opacity:1;transform:translateY(0) scale(1);}
}

.modal-close{
position:absolute;
top:20px;
right:20px;
width:36px;
height:36px;
border-radius:50%;
border:none;
background:var(--bg-alt);
color:var(--text-muted);
font-size:16px;
cursor:pointer;
display:flex;
align-items:center;
justify-content:center;
transition:.25s;
}

.modal-close:hover{
background:var(--accent);
color:white;
}

.modal-eyebrow{
color:var(--accent);
font-weight:600;
letter-spacing:1px;
text-transform:uppercase;
font-size:13px;
margin-bottom:6px;
}

.modal-box h3{
font-size:26px;
margin-bottom:4px;
}

.modal-price{
color:var(--text-muted);
font-size:15px;
margin-bottom:26px;
}

.modal-price strong{
color:var(--accent);
}

.form-row{
display:grid;
grid-template-columns:1fr 1fr;
gap:14px;
}

.form-group{
margin-bottom:18px;
}

.form-group label{
display:block;
font-size:13px;
font-weight:600;
color:var(--text);
margin-bottom:7px;
}

.form-group input,
.form-group select,
.form-group textarea{
width:100%;
padding:13px 15px;
border:1.5px solid var(--border);
border-radius:10px;
font-size:16px;
font-family:'Inter',sans-serif;
background:var(--surface);
color:var(--text);
transition:.25s;
}

.form-group input:focus,
.form-group select:focus,
.form-group textarea:focus{
outline:none;
border-color:var(--accent);
}

.form-group textarea{
resize:vertical;
min-height:80px;
}

.modal-submit{
width:100%;
padding:16px;
background:var(--navy);
color:white;
border:none;
border-radius:12px;
font-size:16px;
font-weight:600;
cursor:pointer;
transition:.3s;
margin-top:6px;
display:flex;
align-items:center;
justify-content:center;
gap:10px;
}

.modal-submit:disabled{
opacity:.7;
cursor:not-allowed;
}

.modal-submit .fa-spinner{
animation:spin .8s linear infinite;
}

@keyframes spin{
from{transform:rotate(0deg);}
to{transform:rotate(360deg);}
}

.form-error{
display:flex;
align-items:flex-start;
gap:10px;
background:#fdecea;
color:#b3261e;
border:1px solid #f5c2c0;
border-radius:10px;
padding:14px 16px;
font-size:13.5px;
line-height:1.6;
margin-bottom:16px;
}

.form-error i{
margin-top:2px;
}

.form-error a{
color:#b3261e;
font-weight:600;
}

.modal-submit:hover{
background:var(--navy-dark);
}

.modal-success{
text-align:center;
padding:20px 0;
}

.modal-success i{
font-size:52px;
color:var(--success);
margin-bottom:18px;
}

.modal-success h3{
margin-bottom:10px;
}

.modal-success p{
color:var(--text-muted);
line-height:1.7;
}

/* Video Modal */

.video-modal-overlay{
position:fixed;
inset:0;
background:rgba(5,5,10,.85);
backdrop-filter:blur(4px);
display:none;
align-items:center;
justify-content:center;
z-index:2100;
padding:20px;
}

.video-modal-overlay.active{
display:flex;
}

.video-modal-box{
width:100%;
max-width:900px;
position:relative;
animation:modalIn .35s ease;
z-index:2;
transform:translateZ(0);
-webkit-transform:translateZ(0);
}

.video-modal-box .modal-close{
top:-52px;
right:0;
background:rgba(255,255,255,.15);
color:white;
}

.video-modal-box .modal-close:hover{
background:var(--accent);
}

.video-frame-wrap{
position:relative;
width:100%;
padding-top:56.25%;
border-radius:16px;
overflow:hidden;
box-shadow:0 25px 60px rgba(0,0,0,.5);
}

.video-frame-wrap iframe{
position:absolute;
inset:0;
width:100%;
height:100%;
border:none;
}

/* Scroll reveal */

.reveal{
opacity:0;
transform:translateY(40px);
transition:opacity .7s ease, transform .7s ease;
}

.reveal.visible{
opacity:1;
transform:translateY(0);
}

.reveal-delay-1{transition-delay:.08s;}
.reveal-delay-2{transition-delay:.16s;}
.reveal-delay-3{transition-delay:.24s;}
.reveal-delay-4{transition-delay:.32s;}

/* Motion "direction": headings/kickers snap in fast and plain so the
   page feels deliberate, not uniformly floaty; large imagery eases in
   slower and with a touch more travel. Applied selectively, not to
   every .reveal — most elements keep the default above. */
.reveal-instant{
transition-duration:.45s;
transform:translateY(14px);
}
.reveal-slow{
transition-duration:1.1s;
transform:translateY(56px);
}
@media(prefers-reduced-motion: reduce){
.reveal, .reveal-instant, .reveal-slow{ transition-duration:.01s; transform:none; }
}

/* "Coordinates settle into a name" moment — a small surprise on the
   destinations eyebrow: shows raw lat/long briefly, then crossfades
   into the real label once the section has had a moment to breathe. */
.dw-coord-morph{
transition:opacity .5s var(--ease);
font-variant-numeric:tabular-nums;
}
.dw-coord-morph.is-morphing{ opacity:0; }
@media(prefers-reduced-motion: reduce){
.dw-coord-morph{ transition:none; }
}

/* Live activity toast */

.activity-toast{
position:fixed;
bottom:26px;
left:26px;
background:var(--surface);
border-radius:14px;
box-shadow:0 15px 40px rgba(0,0,0,.18);
padding:16px 44px 16px 20px;
display:flex;
align-items:center;
gap:14px;
max-width:340px;
z-index:1500;
transform:translateY(120%);
opacity:0;
transition:transform .5s cubic-bezier(.2,.8,.2,1), opacity .5s ease;
}

.activity-toast.visible{
transform:translateY(0);
opacity:1;
}

.activity-toast .toast-icon{
width:42px;
height:42px;
border-radius:50%;
background:var(--accent-tint);
color:var(--accent);
display:flex;
align-items:center;
justify-content:center;
font-size:18px;
flex-shrink:0;
}

.activity-toast .toast-text{
font-size:13.5px;
line-height:1.5;
color:var(--text);
}

.activity-toast .toast-text strong{
color:var(--navy);
}

.activity-toast .toast-time{
display:block;
font-size:11.5px;
color:var(--text-faint);
margin-top:2px;
}

.toast-dismiss{
position:absolute;
top:10px;
right:10px;
width:24px;
height:24px;
border-radius:50%;
background:var(--bg-alt);
border:none;
color:var(--text-faint);
font-size:11px;
cursor:pointer;
display:flex;
align-items:center;
justify-content:center;
transition:.2s;
}

.toast-dismiss:hover{
background:var(--accent);
color:white;
}

@media(max-width:600px){

.activity-toast{
left:16px;
right:16px;
bottom:78px;
max-width:none;
}

}

/* About features */

.about-features{
grid-column:1 / -1;
margin-top:55px;
display:grid;
grid-template-columns:repeat(auto-fit,minmax(230px,1fr));
gap:32px;
}

.feature-item{
display:flex;
gap:16px;
align-items:flex-start;
}

.feature-item i{
width:50px;
height:50px;
min-width:50px;
border-radius:12px;
background:var(--accent-tint);
color:var(--accent);
display:flex;
align-items:center;
justify-content:center;
font-size:19px;
}

.feature-item h4{
font-size:16px;
margin-bottom:6px;
}

.feature-item p{
font-size:14px;
color:var(--text-muted);
margin:0;
line-height:1.7;
}

/* Testimonial carousel */

.testimonial-carousel{
position:relative;
display:flex;
align-items:center;
gap:16px;
}

.t-track{
display:flex;
gap:30px;
overflow-x:auto;
scroll-snap-type:x mandatory;
scroll-behavior:smooth;
scrollbar-width:none;
padding:4px 2px 14px;
}

.t-track::-webkit-scrollbar{
display:none;
}

.t-track .t-card{
flex:0 0 100%;
scroll-snap-align:start;
}

.t-arrow{
width:48px;
height:48px;
min-width:48px;
border-radius:50%;
background:rgba(255,255,255,.12);
color:white;
border:1.5px solid rgba(255,255,255,.25);
cursor:pointer;
display:flex;
align-items:center;
justify-content:center;
font-size:16px;
transition:.3s;
}

.t-arrow:hover{
background:var(--accent);
border-color:var(--accent);
}

.t-dots{
display:flex;
justify-content:center;
gap:9px;
margin-top:30px;
}

.t-dot{
width:9px;
height:9px;
border-radius:50%;
background:rgba(255,255,255,.3);
border:none;
cursor:pointer;
transition:.3s;
padding:0;
}

.t-dot.active{
background:var(--accent);
width:26px;
border-radius:6px;
}

@media(min-width:700px){

.t-track .t-card{
flex:0 0 calc(50% - 15px);
}

}

@media(min-width:1050px){

.t-track .t-card{
flex:0 0 calc(33.333% - 20px);
}

}

/* Destination modal */

.dest-modal-box{
max-width:520px;
padding:36px;
}

.dest-modal-img-wrap{
margin:-36px -36px 26px -36px;
height:220px;
overflow:hidden;
border-radius:20px 20px 0 0;
}

.dest-modal-img-wrap img{
width:100%;
height:100%;
object-fit:cover;
display:block;
}

.dest-modal-box .modal-close{
background:rgba(255,255,255,.3);
color:white;
}

.dest-modal-box .modal-close:hover{
background:var(--accent);
}

.modal-desc{
color:var(--text-muted);
line-height:1.85;
font-size:15px;
margin-bottom:22px;
}

.modal-highlights{
list-style:none;
color:var(--text-muted);
font-size:15px;
line-height:2.1;
margin-bottom:28px;
}

.modal-highlights li i{
color:var(--accent);
width:20px;
margin-right:4px;
}

/* Flash highlight for jumped-to tour card */

@keyframes cardFlash{
0%{box-shadow:0 0 0 0 rgba(255,140,50,.55);}
70%{box-shadow:0 0 0 16px rgba(255,140,50,0);}
100%{box-shadow:0 0 0 0 rgba(255,140,50,0);}
}

.card-flash{
animation:cardFlash 1.1s ease-out 2;
}

@media(max-width:900px){

.wave-divider svg{
height:50px;
}

.scroll{
bottom:76px;
}

.hero{
height:auto;
min-height:100vh;
min-height:100svh;
padding:120px 6% 60px;
justify-content:flex-end;
}

.hero-title{
font-size:clamp(36px, 11vw, 56px);
margin-bottom:24px;
}

.hero-foot{
flex-direction:column;
align-items:flex-start;
gap:24px;
}

.hero-desc{
font-size:15px;
max-width:none;
}

.hero-stats{
margin-top:32px;
gap:18px 28px;
}

.hero-trust-item strong{
font-size:18px;
}

.about{
grid-template-columns:1fr;
}

.footer-grid{
grid-template-columns:1fr 1fr;
}

.form-row{
grid-template-columns:1fr;
gap:0;
}

.modal-overlay{
padding:14px;
align-items:flex-end;
}

.modal-box{
padding:26px 22px;
border-radius:20px 20px 0 0;
max-height:88vh;
animation:modalInMobile .35s ease;
}

@keyframes modalInMobile{
from{opacity:0;transform:translateY(40px) translateZ(0);}
to{opacity:1;transform:translateY(0) translateZ(0);}
}

.btn-primary,
.btn-secondary{
width:100%;
text-align:center;
}

.buttons{
flex-direction:column;
align-items:stretch;
width:100%;
gap:16px;
}

.hero-ghost-link{
justify-content:center;
}

.dest-modal-img-wrap{
margin:-26px -22px 20px -22px;
}

.share-buttons button{
width:44px;
height:44px;
}

}


/* ===== Tour Detail Page ===== */

.tour-breadcrumb{
padding:130px 8% 0;
font-size:14px;
color:var(--text-faint);
}

.tour-breadcrumb a{
color:var(--text-faint);
text-decoration:none;
transition:.25s;
}

.tour-breadcrumb a:hover{
color:var(--accent);
}

.tour-hero-banner{
padding:26px 8% 60px;
display:grid;
grid-template-columns:1.3fr 1fr;
gap:50px;
align-items:center;
}

.tour-hero-banner img{
width:100%;
height:420px;
object-fit:cover;
border-radius:24px;
box-shadow:0 25px 60px rgba(0,0,0,.15);
background:linear-gradient(135deg,var(--navy),var(--navy-light));
}

.tour-gallery{
padding:0 8% 20px;
display:grid;
grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
gap:20px;
}

.tour-gallery img{
width:100%;
height:200px;
object-fit:cover;
border-radius:16px;
transition:.3s;
cursor:pointer;
}

.tour-gallery img:hover{
transform:scale(1.02);
box-shadow:0 15px 35px rgba(0,0,0,.15);
}

@media(max-width:900px){

.tour-gallery img{
height:160px;
}

}

.tour-hero-info .badge{
position:static;
display:inline-block;
}

.tour-hero-info h1{
font-size:42px;
margin-bottom:18px;
line-height:1.15;
}

.tour-rating-line{
display:flex;
align-items:center;
gap:7px;
font-size:14.5px;
color:var(--text);
font-weight:600;
margin-bottom:20px;
}

.review-count-light{
color:var(--text-faint);
font-weight:400;
}

.tour-quick-facts{
display:flex;
flex-wrap:wrap;
gap:22px;
margin-bottom:26px;
color:var(--text-muted);
font-size:15px;
}

.tour-quick-facts span{
display:flex;
align-items:center;
gap:8px;
}

.tour-quick-facts i{
color:var(--accent);
}

.tour-hero-price{
font-size:36px;
font-weight:700;
color:var(--accent);
margin-bottom:22px;
}

.tour-hero-price small{
font-size:15px;
color:var(--text-faint);
font-weight:400;
}

.tour-book-btn{
background:var(--navy);
color:white;
border:none;
padding:18px 38px;
border-radius:50px;
font-size:16px;
font-weight:600;
cursor:pointer;
transition:.3s;
}

.tour-book-btn:hover{
background:var(--navy-dark);
transform:translateY(-3px);
}

.tour-body{
padding:20px 8% 100px;
display:grid;
grid-template-columns:1.6fr 1fr;
gap:60px;
align-items:start;
}

.tour-body h2{
font-size:28px;
margin:44px 0 18px;
}

.tour-body h2:first-child{
margin-top:0;
}

.tour-body > div:first-child p{
color:var(--text-muted);
line-height:1.9;
font-size:16px;
margin-bottom:16px;
}

.itinerary-list{
list-style:none;
}

.itinerary-item{
display:flex;
gap:20px;
padding-bottom:26px;
position:relative;
}

.itinerary-item:not(:last-child)::before{
content:'';
position:absolute;
left:19px;
top:42px;
bottom:0;
width:2px;
background:#ffe3c7;
}

.itinerary-time{
min-width:40px;
height:40px;
border-radius:50%;
background:var(--accent-tint);
color:var(--accent);
display:flex;
align-items:center;
justify-content:center;
font-size:15px;
flex-shrink:0;
z-index:1;
}

.itinerary-content h4{
font-size:16px;
margin-bottom:6px;
}

.itinerary-content p{
color:var(--text-muted);
font-size:14.5px;
line-height:1.7;
margin:0;
}

.included-list{
list-style:none;
}

.included-list li{
display:flex;
align-items:flex-start;
gap:10px;
color:var(--text-muted);
font-size:15px;
line-height:1.8;
margin-bottom:6px;
}

.included-list li i{
color:var(--success);
margin-top:4px;
}

.good-to-know{
background:var(--bg-alt);
border-radius:16px;
padding:26px;
margin-top:20px;
}

.good-to-know p{
font-size:14.5px !important;
margin-bottom:12px !important;
}

.good-to-know p:last-child{
margin-bottom:0 !important;
}

.tour-reviews-list{
display:flex;
flex-direction:column;
gap:14px;
}

.tour-review-card{
background:var(--bg-alt);
border-radius:16px;
padding:22px 24px;
}

.tour-review-top{
display:flex;
align-items:center;
gap:12px;
margin-bottom:12px;
}

.tour-review-avatar{
width:42px;
height:42px;
border-radius:50%;
background:var(--navy);
color:white;
font-weight:700;
font-size:14px;
display:flex;
align-items:center;
justify-content:center;
flex-shrink:0;
}

.tour-review-name{
font-weight:700;
font-size:14.5px;
color:#1a1a1a;
margin-bottom:2px;
}

.tour-review-meta{
font-size:13px;
color:var(--text-faint);
}

.tour-review-top{
position:relative;
}

.tour-review-stars{
margin-left:auto;
color:var(--accent);
font-size:14px;
letter-spacing:1px;
white-space:nowrap;
align-self:flex-start;
}

.tour-review-text{
font-size:14.5px !important;
color:var(--text-muted);
line-height:1.75;
margin-bottom:0 !important;
}

.tour-review-card > .tour-review-text:not(:last-child){
margin-bottom:12px !important;
}

.tour-review-photos{
display:flex;
gap:8px;
flex-wrap:wrap;
margin-bottom:4px;
}

.tour-review-photo{
width:76px;
height:76px;
object-fit:cover;
border-radius:10px;
cursor:pointer;
transition:transform .2s ease, box-shadow .2s ease;
box-shadow:0 2px 8px rgba(0,0,0,.08);
}

.tour-review-photo:hover{
transform:scale(1.05);
box-shadow:0 6px 16px rgba(0,0,0,.16);
}

@media(max-width:700px){
.tour-review-photo{
width:64px;
height:64px;
}
}

@media(max-width:700px){

.tour-review-card{
padding:20px;
}

.tour-review-top{
flex-wrap:wrap;
}

.tour-review-stars{
margin-left:56px;
order:3;
}

}

.tour-sidebar{
position:sticky;
top:110px;
background:var(--surface);
border-radius:20px;
box-shadow:0 20px 50px rgba(0,0,0,.1);
padding:30px;
}

.tour-sidebar .price{
font-size:32px;
font-weight:700;
color:var(--accent);
margin-bottom:4px;
}

.tour-sidebar .price small{
font-size:14px;
color:var(--text-faint);
font-weight:400;
}

.tour-sidebar-facts{
list-style:none;
margin:20px 0 24px;
border-top:1px solid var(--border);
padding-top:20px;
}

.tour-sidebar-facts li{
display:flex;
align-items:center;
gap:10px;
color:var(--text-muted);
font-size:14.5px;
margin-bottom:12px;
}

.tour-sidebar-facts i{
color:var(--accent);
width:18px;
}

.share-row{
margin-top:22px;
padding-top:20px;
border-top:1px solid var(--border);
display:flex;
align-items:center;
justify-content:space-between;
gap:12px;
}

.share-row span{
font-size:13px;
color:var(--text-faint);
}

.share-buttons{
display:flex;
gap:8px;
}

.share-buttons button{
width:36px;
height:36px;
border-radius:50%;
border:1.5px solid var(--border);
background:var(--surface);
color:var(--text-muted);
font-size:14px;
cursor:pointer;
display:flex;
align-items:center;
justify-content:center;
transition:.25s;
}

.share-buttons button:hover{
background:var(--accent);
border-color:var(--accent);
color:white;
}

.share-toast{
position:fixed;
bottom:26px;
left:50%;
transform:translateX(-50%) translateY(20px);
background:var(--navy);
color:white;
padding:14px 26px;
border-radius:50px;
font-size:14px;
font-weight:600;
opacity:0;
pointer-events:none;
transition:.3s ease;
z-index:3000;
}

.share-toast.visible{
opacity:1;
transform:translateX(-50%) translateY(0);
}

.print-itinerary-btn{
width:100%;
margin-top:14px;
padding:12px;
background:none;
border:1.5px solid var(--border);
border-radius:10px;
color:var(--text-muted);
font-size:13.5px;
font-weight:600;
cursor:pointer;
transition:.25s;
display:flex;
align-items:center;
justify-content:center;
gap:8px;
}

.print-itinerary-btn:hover{
border-color:var(--navy);
color:var(--navy);
}

.related-tours{
padding:0 8% 100px;
}

.related-tours h2{
font-size:30px;
margin-bottom:30px;
text-align:center;
}

.related-grid{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
gap:30px;
}

@media(max-width:900px){

.tour-breadcrumb{
padding-top:110px;
}

.tour-hero-banner{
grid-template-columns:1fr;
gap:24px;
}

.tour-hero-banner img{
height:260px;
}

.tour-hero-info h1{
font-size:30px;
}

.tour-body{
grid-template-columns:1fr;
}

.tour-sidebar{
position:static;
}

.related-grid{
display:flex;
overflow-x:auto;
scroll-snap-type:x proximity;
scroll-behavior:smooth;
gap:16px;
padding-bottom:16px;
-webkit-overflow-scrolling:touch;
scrollbar-width:none;
}

.related-grid::-webkit-scrollbar{
display:none;
}

.related-grid .card{
flex:0 0 72vw;
flex-shrink:0;
scroll-snap-align:start;
}

}

@media(max-width:700px){

.related-grid{
display:grid;
grid-template-columns:1fr;
gap:20px;
}

}

/* ===== Info Pages (FAQ, Terms, Privacy, Cancellation) ===== */

.info-page-header{
padding:150px 8% 60px;
text-align:center;
background:var(--bg-alt);
}

.info-page-header p.eyebrow{
color:var(--accent);
font-weight:600;
letter-spacing:2px;
text-transform:uppercase;
font-size:14px;
margin-bottom:10px;
}

.info-page-header h1{
font-size:42px;
margin-bottom:14px;
}

.info-page-header p.subtitle{
color:var(--text-muted);
font-size:17px;
max-width:600px;
margin:0 auto;
}

.info-page-body{
max-width:820px;
margin:0 auto;
padding:70px 8% 100px;
}

.info-page-body h2{
font-size:24px;
margin:44px 0 16px;
}

.info-page-body h2:first-child{
margin-top:0;
}

.info-page-body p{
color:var(--text-muted);
line-height:1.9;
font-size:16px;
margin-bottom:16px;
}

.info-page-body ul{
margin:0 0 20px 20px;
color:var(--text-muted);
line-height:1.9;
font-size:16px;
}

.info-page-body strong{
color:var(--text);
}

.info-updated{
color:var(--text-faint);
font-size:13.5px;
margin-bottom:40px;
}

/* FAQ accordion */

.faq-list{
max-width:820px;
margin:0 auto;
padding:70px 8% 60px;
}

.faq-item{
border-bottom:1px solid var(--border);
}

.faq-question{
width:100%;
background:none;
border:none;
text-align:left;
padding:24px 0;
font-size:17px;
font-weight:600;
color:var(--text);
cursor:pointer;
display:flex;
justify-content:space-between;
align-items:center;
gap:20px;
font-family:'Inter',sans-serif;
}

.faq-question i{
color:var(--accent);
transition:transform .3s ease;
flex-shrink:0;
}

.faq-item.open .faq-question i{
transform:rotate(45deg);
}

.faq-answer{
max-height:0;
overflow:hidden;
transition:max-height .35s ease;
}

.faq-answer p{
color:var(--text-muted);
line-height:1.85;
font-size:15px;
padding-bottom:24px;
padding-right:30px;
}

.faq-cta{
text-align:center;
padding:20px 8% 100px;
}

.faq-cta p{
color:var(--text-muted);
margin-bottom:20px;
font-size:16px;
}

.faq-cta .btn-primary{
display:inline-block;
background:var(--accent);
color:white;
padding:16px 36px;
border-radius:50px;
text-decoration:none;
font-weight:600;
transition:.3s;
}

.faq-cta .btn-primary:hover{
background:var(--accent-hover);
transform:translateY(-3px);
}

@media(max-width:900px){

.info-page-header{
padding-top:120px;
}

.info-page-header h1{
font-size:30px;
}

}

/* ===== Print styles (tour itinerary pages) ===== */

@media print{

header,
.back-to-top,
.mobile-menu-btn,
.book-btn,
.tour-book-btn,
.share-row,
.tour-sidebar .modal-submit,
.related-tours,
footer,
.modal-overlay,
.skip-link,
.activity-toast,
.wave-divider,
.scroll{
display:none !important;
}

body{
animation:none !important;
}

body::after{
display:none !important;
}

.tour-breadcrumb{
padding-top:20px;
}

.tour-hero-banner{
grid-template-columns:1fr;
padding-top:0;
}

.tour-hero-banner img{
height:220px;
box-shadow:none;
}

.tour-body{
grid-template-columns:1fr;
padding-top:20px;
}

.tour-sidebar{
box-shadow:none;
border:1px solid #ddd;
position:static;
}

.itinerary-item::before{
background:#ccc;
}

a[href]::after{
content:none !important;
}

.tour-gallery{
display:none;
}

}

/* ===== Mobile sticky booking bar (tour pages) ===== */

.mobile-sticky-bar{
display:none;
}

@media(max-width:900px){

.mobile-sticky-bar{
position:fixed;
bottom:0;
left:0;
width:100%;
background:var(--surface);
box-shadow:0 -8px 30px rgba(0,0,0,.12);
padding:14px 18px;
display:flex;
align-items:center;
justify-content:space-between;
gap:16px;
z-index:1400;
transform:translateY(100%);
transition:transform .35s ease;
}

.mobile-sticky-bar.visible{
transform:translateY(0);
}

.tour-page footer{
padding-bottom:100px;
}

.tour-page .back-to-top{
bottom:86px;
}

.tour-page .whatsapp-float{
bottom:156px;
}

.mobile-sticky-price{
font-family:'Fraunces',serif;
font-size:22px;
font-weight:600;
color:var(--accent);
white-space:nowrap;
}

.mobile-sticky-price small{
font-family:'Inter',sans-serif;
font-size:12px;
color:var(--text-faint);
font-weight:400;
}

.mobile-sticky-btn{
background:var(--navy);
color:white;
border:none;
padding:14px 26px;
border-radius:50px;
font-size:15px;
font-weight:600;
cursor:pointer;
flex-shrink:0;
white-space:nowrap;
}

}

/* ===== Tour category filters ===== */

.tour-filters{
position:relative;
z-index:1;
display:flex;
gap:12px;
flex-wrap:wrap;
justify-content:center;
margin-bottom:44px;
}

.filter-tab{
background:var(--surface);
border:1.5px solid var(--border);
color:var(--text-muted);
padding:11px 22px;
border-radius:50px;
font-size:14px;
font-weight:600;
font-family:'Inter',sans-serif;
cursor:pointer;
transition:.25s;
}

.filter-tab:hover{
border-color:var(--accent);
color:var(--accent);
}

.filter-tab.active{
background:var(--navy);
border-color:var(--navy);
color:white;
}

.tours .card{
transition:transform .4s ease, opacity .4s ease, box-shadow .4s ease;
}

.tours .card.filtered-out{
display:none;
}

@media(max-width:700px){

.tour-filters{
justify-content:flex-start;
overflow-x:auto;
flex-wrap:nowrap;
padding-bottom:6px;
margin-bottom:36px;
-webkit-overflow-scrolling:touch;
}

.filter-tab{
flex-shrink:0;
}

}

/* ===== Card rating ===== */

.card-rating{
display:flex;
align-items:center;
gap:6px;
font-size:13.5px;
color:var(--text);
font-weight:600;
margin-bottom:10px;
}

.stars-small{
color:var(--accent);
font-size:12px;
letter-spacing:1px;
}

.review-count{
color:var(--text-faint);
font-weight:400;
}

.tour-map-wrap{
border-radius:16px;
overflow:hidden;
box-shadow:0 10px 30px rgba(0,0,0,.08);
margin-bottom:10px;
}

/* ===== Photo lightbox ===== */

.lightbox-overlay{
position:fixed;
inset:0;
background:rgba(5,5,10,.94);
display:none;
align-items:center;
justify-content:center;
z-index:2500;
padding:60px 20px;
}

.lightbox-overlay.active{
display:flex;
}

.lightbox-overlay img{
max-width:100%;
max-height:85vh;
border-radius:10px;
box-shadow:0 30px 80px rgba(0,0,0,.5);
animation:lightboxZoomIn .3s ease;
}

@keyframes lightboxZoomIn{
from{opacity:0;transform:scale(.94);}
to{opacity:1;transform:scale(1);}
}

.lightbox-close{
position:absolute;
top:24px;
right:24px;
width:44px;
height:44px;
border-radius:50%;
background:rgba(255,255,255,.12);
border:none;
color:white;
font-size:18px;
cursor:pointer;
transition:.25s;
}

.lightbox-close:hover{
background:var(--accent);
}

.lightbox-nav{
position:absolute;
top:50%;
transform:translateY(-50%);
width:52px;
height:52px;
border-radius:50%;
background:rgba(255,255,255,.12);
border:none;
color:white;
font-size:18px;
cursor:pointer;
transition:.25s;
display:flex;
align-items:center;
justify-content:center;
}

.lightbox-nav:hover{
background:var(--accent);
}

.lightbox-prev{
left:20px;
}

.lightbox-next{
right:20px;
}

.lightbox-counter{
position:absolute;
bottom:24px;
left:50%;
transform:translateX(-50%);
color:rgba(255,255,255,.7);
font-size:14px;
font-weight:600;
}

@media(max-width:700px){

.lightbox-nav{
width:44px;
height:44px;
font-size:15px;
}

.lightbox-prev{
left:8px;
}

.lightbox-next{
right:8px;
}

.lightbox-close{
top:14px;
right:14px;
}

}

/* Reading progress bar (tour pages) */

.reading-progress{
position:fixed;
top:0;
left:0;
height:3px;
width:0%;
background:linear-gradient(90deg,var(--accent),var(--accent-hover));
z-index:2999;
transition:width .1s ease-out;
}

/* Wishlist panel content */

.wishlist-empty{
text-align:center;
padding:20px 10px 10px;
color:var(--text-faint);
}

.wishlist-empty i{
font-size:38px;
color:#ffd0da;
margin-bottom:16px;
display:block;
}

.wishlist-empty p{
font-size:14.5px;
line-height:1.7;
}

.wishlist-item{
display:flex;
align-items:center;
justify-content:space-between;
gap:14px;
padding:14px 0;
border-bottom:1px solid #f0f0f0;
}

.wishlist-item:last-child{
border-bottom:none;
}

.wishlist-item-link{
display:flex;
align-items:center;
gap:14px;
min-width:0;
color:var(--text);
text-decoration:none;
flex:1;
}

.wishlist-item-img{
width:56px;
height:56px;
border-radius:12px;
object-fit:cover;
flex-shrink:0;
background:var(--bg-alt);
}

.wishlist-item-noimg{
width:56px;
height:56px;
border-radius:12px;
flex-shrink:0;
background:var(--error-tint);
color:var(--accent);
display:flex;
align-items:center;
justify-content:center;
font-size:18px;
}

.wishlist-item a,
.wishlist-item-name{
color:var(--text);
text-decoration:none;
font-weight:600;
font-size:15px;
transition:.2s;
overflow:hidden;
text-overflow:ellipsis;
white-space:nowrap;
}

.wishlist-item-link:hover .wishlist-item-name{
color:var(--accent);
}

.wishlist-remove{
width:30px;
height:30px;
border-radius:50%;
background:var(--bg-alt);
border:none;
color:var(--text-faint);
font-size:12px;
cursor:pointer;
display:flex;
align-items:center;
justify-content:center;
flex-shrink:0;
transition:.2s;
}

.wishlist-remove:hover{
background:var(--error);
color:white;
}

.tour-hero-top-row{
display:flex;
align-items:center;
justify-content:space-between;
margin-bottom:16px;
}

.wishlist-btn-static{
position:static;
background:var(--bg-alt);
color:var(--navy);
}

.wishlist-btn-static.saved{
background:var(--error-tint);
color:var(--error);
}

.reserve-note{
text-align:center;
color:var(--text-faint);
font-size:13px;
margin-top:12px;
display:flex;
align-items:center;
justify-content:center;
gap:6px;
}

.reserve-note i{
color:var(--success);
}

/* Swipe-teach animation: nudges the first card itself so the gesture is unmistakable */

@keyframes swipeTeachAnim{
0%{transform:translateX(0);}
28%{transform:translateX(-26px);}
55%{transform:translateX(-4px);}
75%{transform:translateX(-26px);}
100%{transform:translateX(0);}
}

.swipe-teach{
animation:swipeTeachAnim 1.4s ease-in-out;
}

/* Tours carousel arrows - only used on wide screens; on mobile the list
   is a plain vertical stack (see .tours rules above), no arrows needed. */

.tours-carousel-wrap{
display:block;
position:relative;
}

.tours-prev, .tours-next{
display:none;
}
