:root{
  --magenta:#A82B7A; --magenta-deep:#8E1F65;
  --yellow:#F1BE2A; --orange:#E48627;
  --green:#94BE3D; --green-deep:#7BA22F;
  --cream:#F8F3EB; --cream-warm:#F1E9DA;
  --ink:#2C2528; --ink-soft:#5A4F52; --taupe:#8A7E7A;
  --line:rgba(44,37,40,.12);
  --serif:"Fraunces", Georgia, serif;
  --sans:"Inter", -apple-system, "Segoe UI", Roboto, sans-serif;
}
*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body{ margin:0; font-family:var(--sans); color:var(--ink); background:var(--cream); font-size:17px; line-height:1.65; -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility; }
img,svg{ max-width:100%; display:block; }
h1,h2,h3,h4{ font-family:var(--serif); font-weight:500; letter-spacing:-0.01em; line-height:1.15; margin:0 0 .6em; }
p{ margin:0 0 1.1em; }
a{ color:var(--magenta); text-decoration:none; }
a:hover{ text-decoration:underline; }

/* Navigation */
.nav{ position:fixed; inset:0 0 auto 0; z-index:50; padding:14px 32px; display:flex; align-items:center; justify-content:space-between; background:rgba(248,243,235,0); transition:background .3s ease, box-shadow .3s ease, padding .3s ease; }
.nav.scrolled{ background:rgba(248,243,235,.96); box-shadow:0 1px 16px rgba(44,37,40,.06); padding:10px 32px; }
.nav-logo{ display:flex; align-items:center; gap:10px; }
.nav-logo img{ height:44px; width:auto; }
.nav-logo span{ font-family:var(--serif); font-weight:600; font-size:19px; color:var(--magenta); opacity:0; transition:opacity .3s ease; }
.nav.scrolled .nav-logo span{ opacity:1; }
.nav-links{ display:flex; gap:28px; align-items:center; }
.nav-links a{ color:#fff; font-size:14.5px; font-weight:500; text-decoration:none; opacity:.95; text-shadow:0 1px 8px rgba(0,0,0,.35); }
.nav.scrolled .nav-links a{ color:var(--ink); text-shadow:none; opacity:.85; }
.nav-links a.cta{ background:var(--magenta); color:#fff; padding:9px 18px; border-radius:999px; font-weight:600; opacity:1; text-shadow:none; }
.nav-links a.cta:hover{ background:var(--magenta-deep); text-decoration:none; }

/* Hero */
.hero{ position:relative; min-height:78vh; display:grid; align-items:end; padding:140px 24px 90px; color:#fff; background-color:var(--magenta-deep); background-size:cover; background-position:center; background-attachment:fixed; overflow:hidden; }
.hero::before{ content:""; position:absolute; inset:0; background:linear-gradient(180deg, rgba(44,37,40,.38) 0%, rgba(44,37,40,.68) 100%); }
.hero-inner{ position:relative; max-width:1080px; margin:0 auto; width:100%; }
.crumbs{ font-size:13px; letter-spacing:.06em; margin-bottom:22px; opacity:.9; }
.crumbs a{ color:#fff; text-decoration:underline; text-underline-offset:3px; }
.hero-eyebrow{ font-weight:500; font-size:14px; letter-spacing:.28em; text-transform:uppercase; color:var(--yellow); margin-bottom:14px; }
.hero h1{ font-weight:400; font-size:clamp(40px, 6.6vw, 82px); line-height:1.04; letter-spacing:-.02em; margin:0 0 22px; text-shadow:0 2px 30px rgba(0,0,0,.35); max-width:16ch; }
.hero h1 em{ font-style:italic; font-weight:500; color:var(--yellow); }
.hero-sub{ font-size:clamp(17px, 2vw, 21px); max-width:620px; margin:0 0 30px; color:rgba(255,255,255,.95); text-shadow:0 2px 14px rgba(0,0,0,.3); }
.dest-chips{ display:flex; gap:10px; flex-wrap:wrap; }
.dest-chips span{ background:rgba(255,255,255,.16); backdrop-filter:blur(6px); border:1px solid rgba(255,255,255,.45); padding:8px 18px; border-radius:999px; font-weight:600; font-size:14.5px; }

.btn{ display:inline-block; padding:15px 30px; border-radius:999px; font-weight:600; font-size:15px; letter-spacing:.01em; transition:transform .2s ease, background .2s ease; cursor:pointer; border:0; }
.btn-primary{ background:var(--magenta); color:#fff; }
.btn-primary:hover{ background:var(--magenta-deep); transform:translateY(-2px); text-decoration:none; }

/* Sections */
section.content{ padding:100px 24px; position:relative; }
.wrap{ max-width:1080px; margin:0 auto; }
.wrap-narrow{ max-width:760px; margin:0 auto; }
.eyebrow{ font-weight:600; font-size:12.5px; letter-spacing:.28em; text-transform:uppercase; color:var(--magenta); margin-bottom:16px; display:inline-block; }
h2.section-title{ font-size:clamp(32px, 4.4vw, 52px); font-weight:400; margin-bottom:26px; max-width:20ch; }
h2.section-title em{ font-style:italic; color:var(--magenta); font-weight:500; }
.lead{ font-size:19px; line-height:1.7; color:var(--ink-soft); max-width:62ch; }

.intro{ background:var(--cream); }
.intro-grid{ display:grid; grid-template-columns:1fr; gap:56px; align-items:start; }
@media(min-width:900px){ .intro-grid{ grid-template-columns:1.1fr .9fr; gap:80px; } }
.checks{ display:grid; gap:14px; margin:8px 0 0; padding:0; list-style:none; }
.checks li{ position:relative; padding-left:36px; font-size:16.5px; line-height:1.55; }
.checks li::before{ content:""; position:absolute; left:0; top:4px; width:22px; height:22px; border-radius:50%; background:var(--magenta) url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'><polyline points='20 6 9 17 4 12'/></svg>") center/13px no-repeat; }
.checks li strong{ font-weight:600; }
.fit-card{ background:#fff; border-radius:8px; padding:34px 34px 30px; box-shadow:0 22px 55px -24px rgba(44,37,40,.25); border-top:5px solid var(--yellow); }
.fit-card h3{ font-size:24px; margin-bottom:18px; }

/* Destinations */
.dests{ background:var(--cream-warm); }
.dest-head{ max-width:640px; margin-bottom:56px; }
.dest-list{ display:grid; gap:34px; }
.dest{ display:grid; grid-template-columns:1fr; background:#fff; border-radius:8px; overflow:hidden; box-shadow:0 22px 55px -28px rgba(44,37,40,.3); }
@media(min-width:860px){
  .dest{ grid-template-columns:1.05fr 1fr; }
  .dest:nth-child(even) .dest-pic{ order:2; }
}
.dest-pic{ position:relative; min-height:280px; background:var(--cream-warm); overflow:hidden; }
.dest-pic svg{ position:absolute; inset:0; width:100%; height:100%; transition:transform .9s ease; }
.dest:hover .dest-pic svg{ transform:scale(1.045); }
.dest-num{ position:absolute; left:18px; top:14px; z-index:2; font-family:var(--serif); font-style:italic; font-size:54px; line-height:1; color:#fff; text-shadow:0 2px 14px rgba(0,0,0,.35); }
.dest-body{ padding:42px 40px 38px; display:flex; flex-direction:column; }
.dest-body .where{ font-size:12.5px; letter-spacing:.24em; text-transform:uppercase; color:var(--magenta); font-weight:600; margin-bottom:10px; }
.dest-body h3{ font-size:clamp(28px,3.2vw,38px); font-weight:400; margin-bottom:6px; }
.dest-body .tagline{ font-family:var(--serif); font-style:italic; font-size:19px; color:var(--magenta); margin-bottom:16px; }
.dest-body p{ color:var(--ink-soft); font-size:16.5px; }
.tags{ display:flex; flex-wrap:wrap; gap:8px; margin:6px 0 20px; }
.tags span{ font-size:13px; font-weight:600; padding:5px 14px; border-radius:999px; background:var(--cream-warm); color:var(--ink); }
.tags span:nth-child(3n+1){ background:rgba(241,190,42,.28); }
.tags span:nth-child(3n+2){ background:rgba(148,190,61,.28); }
.tags span:nth-child(3n){ background:rgba(168,43,122,.12); }
.when{ margin-top:auto; padding-top:18px; border-top:1px solid var(--line); font-size:14.5px; color:var(--ink-soft); display:flex; gap:10px; align-items:flex-start; }
.when svg{ flex:0 0 auto; width:20px; height:20px; stroke:var(--magenta); stroke-width:1.8; fill:none; stroke-linecap:round; stroke-linejoin:round; margin-top:2px; }
.when strong{ color:var(--ink); }

/* Parallax band */
.parallax{ position:relative; min-height:62vh; display:grid; place-items:center; padding:110px 24px; color:#fff; background-color:var(--magenta-deep); background-size:cover; background-position:center; background-attachment:fixed; }
.parallax::before{ content:""; position:absolute; inset:0; background:linear-gradient(180deg, rgba(44,37,40,.35), rgba(44,37,40,.6)); }
.parallax > .wrap-narrow{ position:relative; text-align:center; }
.parallax .eyebrow{ color:var(--yellow); }
.parallax h2{ font-weight:400; font-size:clamp(30px,4.4vw,52px); max-width:22ch; margin:0 auto 22px; text-shadow:0 2px 24px rgba(0,0,0,.35); }
.parallax h2 em{ font-style:italic; color:var(--yellow); font-weight:500; }
.parallax p{ font-size:18px; color:rgba(255,255,255,.95); max-width:58ch; margin:0 auto; text-shadow:0 1px 12px rgba(0,0,0,.3); }

/* Combo / tailor-made */
.tailor{ background:var(--cream); }
.tailor-grid{ display:grid; grid-template-columns:1fr; gap:2px; margin-top:44px; background:var(--line); border-radius:6px; overflow:hidden; }
@media(min-width:760px){ .tailor-grid{ grid-template-columns:repeat(3,1fr); } }
.tailor-item{ background:var(--cream); padding:36px 30px 32px; }
.tailor-item .num{ font-family:var(--serif); font-style:italic; font-size:52px; line-height:1; color:var(--magenta); opacity:.85; display:block; margin-bottom:10px; }
.tailor-item h3{ font-size:21px; margin-bottom:8px; }
.tailor-item p{ font-size:15.5px; color:var(--ink-soft); margin:0; }

/* Other themes */
.others{ background:var(--cream-warm); padding:84px 24px; }
.others h2{ font-size:clamp(26px,3.4vw,38px); font-weight:400; text-align:center; margin-bottom:36px; }
.others h2 em{ font-style:italic; color:var(--magenta); }
.theme-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(190px,1fr)); gap:16px; max-width:1080px; margin:0 auto; }
.theme-card{ position:relative; display:block; border-radius:8px; overflow:hidden; aspect-ratio:4/3; color:#fff; box-shadow:0 14px 34px -20px rgba(44,37,40,.45); }
.theme-card svg{ position:absolute; inset:0; width:100%; height:100%; transition:transform .7s ease; }
.theme-card:hover svg{ transform:scale(1.07); }
.theme-card:hover{ text-decoration:none; }
.theme-card::after{ content:""; position:absolute; inset:0; background:linear-gradient(180deg, rgba(0,0,0,0) 35%, rgba(30,15,25,.78) 100%); }
.theme-card .label{ position:absolute; z-index:2; left:16px; right:16px; bottom:14px; font-family:var(--serif); font-size:20px; line-height:1.15; text-shadow:0 1px 10px rgba(0,0,0,.4); }
.theme-card .label small{ display:block; font-family:var(--sans); font-size:12px; font-weight:500; opacity:.92; margin-top:4px; letter-spacing:.02em; }
.theme-card.current{ outline:3px solid var(--yellow); outline-offset:-3px; }

/* CTA */
.cta-final{ background:var(--magenta); color:#fff; padding:100px 24px; text-align:center; position:relative; overflow:hidden; }
.cta-final::before{ content:""; position:absolute; inset:0; background:radial-gradient(40% 60% at 15% 30%, rgba(241,190,42,.22), transparent 60%), radial-gradient(40% 60% at 85% 70%, rgba(148,190,61,.20), transparent 60%); pointer-events:none; }
.cta-final > *{ position:relative; }
.cta-final h2{ font-weight:400; font-size:clamp(34px,5vw,60px); line-height:1.1; margin:0 auto 20px; max-width:20ch; }
.cta-final h2 em{ font-style:italic; color:var(--yellow); }
.cta-final p{ font-size:19px; max-width:52ch; margin:0 auto 34px; color:rgba(255,255,255,.94); }
.contact-cards{ display:grid; grid-template-columns:1fr; gap:22px; max-width:760px; margin:48px auto 0; text-align:left; }
@media(min-width:720px){ .contact-cards{ grid-template-columns:1fr 1fr; gap:26px; } }
.contact-card{ background:rgba(255,255,255,.08); backdrop-filter:blur(6px); border:1px solid rgba(255,255,255,.2); border-radius:8px; padding:26px 28px 24px; color:#fff; }
.contact-card h3{ font-weight:500; font-style:italic; font-size:26px; margin:0 0 4px; color:#fff; }
.contact-card .location{ font-size:13px; letter-spacing:.16em; text-transform:uppercase; color:var(--yellow); margin-bottom:16px; font-weight:600; }
.contact-card .lines{ display:grid; gap:9px; font-size:15.5px; }
.contact-card .lines a{ color:#fff; text-decoration:none; display:flex; align-items:center; gap:11px; word-break:break-word; }
.contact-card .lines a:hover{ opacity:.8; text-decoration:underline; text-underline-offset:3px; }
.contact-card .lines svg{ flex:0 0 auto; width:18px; height:18px; stroke:var(--yellow); stroke-width:1.8; fill:none; stroke-linecap:round; stroke-linejoin:round; }

footer{ background:var(--ink); color:rgba(255,255,255,.7); padding:44px 24px 34px; font-size:14px; text-align:center; }
footer .foot-logo{ height:52px; margin:0 auto 12px; filter:brightness(1.1); }
footer strong{ color:#fff; }

@media(max-width:900px){
  .hero,.parallax{ background-attachment:scroll; }
  section.content{ padding:76px 22px; }
  .parallax{ min-height:56vh; padding:84px 24px; }
  .nav{ padding:12px 20px; }
  .nav-links{ gap:16px; }
  .nav-links a:not(.cta){ display:none; }
  .dest-body{ padding:30px 26px 28px; }
  .dest-pic{ min-height:230px; }
}
.reveal{ opacity:0; transform:translateY(18px); transition:opacity .8s ease, transform .8s ease; }
.reveal.in{ opacity:1; transform:none; }
@media (prefers-reduced-motion:reduce){
  .reveal{ opacity:1; transform:none; transition:none; }
  .dest-pic svg,.theme-card svg{ transition:none; }
  html{ scroll-behavior:auto; }
}

/* --- Foto-versie --- */
.dest-pic img.photo,.theme-card img.photo{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; transition:transform .9s ease; }
.dest:hover .dest-pic img.photo,.theme-card:hover img.photo{ transform:scale(1.05); }
.dest-pic .credit{ position:absolute; right:12px; bottom:10px; z-index:2; font-size:11.5px; color:#fff; background:rgba(0,0,0,.42); padding:3px 9px; border-radius:999px; backdrop-filter:blur(4px); }
@media (prefers-reduced-motion:reduce){ .dest-pic img.photo,.theme-card img.photo{ transition:none; } }

/* Bedankt-melding na het winterfair-formulier */
.bedankt{ background:#fff; border-bottom:4px solid var(--yellow); box-shadow:0 12px 30px -22px rgba(44,37,40,.5); }
.bedankt[hidden]{ display:none; }
.bedankt-inner{ position:relative; max-width:1080px; margin:0 auto; padding:26px 56px 22px 24px; display:flex; gap:18px; align-items:flex-start; }
.bedankt-icon{ font-size:38px; line-height:1; }
.bedankt h2{ font-family:var(--serif); font-size:28px; color:var(--magenta); margin:0 0 6px; }
.bedankt p{ margin:0 0 8px; color:var(--ink-soft); max-width:62ch; }
.bedankt p:empty{ display:none; }
.bedankt-close{ position:absolute; top:12px; right:16px; width:36px; height:36px; border:0; border-radius:50%; background:var(--cream-warm); color:var(--ink); font-size:22px; line-height:1; cursor:pointer; }
.bedankt-close:hover{ background:var(--yellow); }
