:root{
  /* ---------------------------------------------------------------
     LAYER 1 — BRAND PRIMITIVES  (VitaCeylona Brand Guidelines 2026)
     Raw brand values. Never reference these directly in components;
     use the semantic roles in Layer 2 so the site stays re-themable.
     --------------------------------------------------------------- */
  --brand-blue:        #0A2463;   /* Deep Sapphire Blue — primary   */
  --brand-blue-deep:   #071A47;   /* darker blue for depth/footers  */
  --brand-green:       #2E8B57;   /* Ceylon Tea Green — secondary   */
  --brand-terracotta:  #C75B39;   /* Warm Terra Cotta — accent/CTA  */
  --brand-cream:       #FFF8F0;   /* Clean Cream — default surface  */

  /* Accessible companions.
     The brand accents measure ~4.0:1 on cream, below the 4.5:1 (WCAG AA)
     the brand guidelines require. These marginally darker variants clear
     AA for small text and for white button labels, and are visually
     indistinguishable from the brand hues. Full-strength brand colours
     are still used for fills, large text and decoration. */
  --brand-terracotta-ink: #B95435; /* 4.55:1 on cream, 4.79:1 w/ white */
  --brand-green-ink:      #2B8251; /* 4.52:1 on cream, 4.76:1 w/ white */
  --brand-terracotta-soft:#E8A78D; /* accent text on dark blue (7.2:1) */

  --brand-ink:         #1F2430;   /* body text                       */
  --brand-muted:       #5A6472;   /* secondary text (5.7:1 on cream)  */

  /* RGB triplets — let components build translucent shadows/overlays
     from tokens instead of hardcoding colour values. */
  --brand-blue-rgb:       10,36,99;
  --brand-blue-deep-rgb:  7,26,71;
  --brand-cream-rgb:      255,248,240;
  --brand-green-rgb:      46,139,87;
  --brand-terracotta-rgb: 199,91,57;

  /* ---------------------------------------------------------------
     LAYER 2 — SEMANTIC ROLES
     What components actually reference.
     --------------------------------------------------------------- */
  --primary:        var(--brand-blue);
  --primary-deep:   var(--brand-blue-deep);
  --primary-rgb:    var(--brand-blue-rgb);
  --primary-deep-rgb: var(--brand-blue-deep-rgb);

  --secondary:      var(--brand-green);
  --secondary-ink:  var(--brand-green-ink);
  --secondary-rgb:  var(--brand-green-rgb);

  --accent:         var(--brand-terracotta);      /* fills, decoration */
  --accent-ink:     var(--brand-terracotta-ink);  /* text + button fill */
  --accent-soft:    var(--brand-terracotta-soft); /* accent on dark     */
  --accent-rgb:     var(--brand-terracotta-rgb);

  --surface:        var(--brand-cream);
  --surface-alt:    #FFFCF7;   /* raised cards; replaces pure white  */
  --surface-rgb:    var(--brand-cream-rgb);

  --text:           var(--brand-ink);
  --text-muted:     var(--brand-muted);
  --text-invert:    var(--brand-cream);

  --border:         rgba(var(--primary-rgb), 0.14);
  --shadow-sm:      0 4px 16px rgba(var(--primary-rgb), 0.08);
  --shadow-md:      0 10px 34px rgba(var(--primary-rgb), 0.12);
  --shadow-lg:      0 20px 60px rgba(var(--primary-rgb), 0.16);

  /* Type */
  --serif: 'Playfair Display', Georgia, serif;
  --sans:  'Inter', system-ui, -apple-system, sans-serif;

  /* Type scale — Brand Guidelines 04 */
  --fs-display: 3rem;    /* 48px */
  --fs-h1:      2.25rem; /* 36px */
  --fs-h2:      1.75rem; /* 28px */
  --fs-h3:      1.375rem;/* 22px */
  --fs-body-lg: 1.125rem;/* 18px */
  --fs-body:    1rem;    /* 16px */
  --fs-caption: 0.75rem; /* 12px */
  --fs-label:   0.625rem;/* 10px */
}
*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  font-family:var(--sans);
  background:var(--surface);
  color:var(--text);
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
  font-size:var(--fs-body);
  /* Solid navigation bar is fixed; offset content so it never covers it. */
  padding-top:76px;
}
@media (max-width:980px){body{padding-top:70px;}}
a{text-decoration:none;color:inherit;}
img{display:block;max-width:100%;}
::selection{background:var(--accent-soft);color:var(--text);}

a:focus-visible, button:focus-visible, input:focus-visible{
  outline:2px solid var(--accent); outline-offset:3px;
}

.screen-reader-text{
  position:absolute !important; width:1px; height:1px; overflow:hidden;
  clip:rect(1px,1px,1px,1px); white-space:nowrap;
}
.skip-link.screen-reader-text:focus{
  position:fixed !important; top:12px; left:12px; width:auto; height:auto;
  clip:auto; z-index:100000; background:var(--primary-deep); color:var(--surface-alt);
  padding:12px 20px; border-radius:2px; font-size:0.85rem; font-weight:600;
}

@media (prefers-reduced-motion: reduce){
  *{animation-duration:0.001ms !important; animation-iteration-count:1 !important; transition-duration:0.001ms !important;}
}

.eyebrow{
  font-family:var(--sans);
  font-size:0.72rem;
  letter-spacing:0.22em;
  text-transform:uppercase;
  color:var(--accent-ink);
  font-weight:600;
  display:inline-block;
  margin-bottom:14px;
}

/* Typography — Brand Guidelines 04.
   Playfair Display for headlines only; Inter for body/UI (rule 11). */
h1,h2,h3,h4,.display{font-family:var(--serif); letter-spacing:0.005em; line-height:1.18; color:var(--primary);}
.display{font-size:var(--fs-display); font-weight:700;}
h1{font-size:var(--fs-h1); font-weight:700;}
h2{font-size:var(--fs-h2); font-weight:600;}
h3{font-size:var(--fs-h3); font-weight:500;}
@media (max-width:720px){
  :root{--fs-display:2.125rem; --fs-h1:1.75rem; --fs-h2:1.5rem; --fs-h3:1.25rem;}
}

.container{max-width:1240px; margin:0 auto; padding:0 40px;}
@media (max-width:720px){.container{padding:0 22px;}}

/* ---------- NAV ----------
   Brand Guidelines 06: solid Deep Sapphire Blue navigation bar.
   The logo is swapped by FILE (primary / inverted) rather than by CSS
   filter — the new mark is multi-colour, so brightness/invert would
   flatten it to a silhouette. ---------------------------------------- */
header.site-nav{
  position:fixed; top:0; left:0; right:0; z-index:1000;
  padding:16px 0;
  background:var(--primary);
  transition:padding 0.35s ease, box-shadow 0.35s ease, background 0.35s ease;
}
header.site-nav.scrolled{
  background:var(--primary-deep);
  padding:10px 0;
  box-shadow:0 6px 26px rgba(var(--primary-deep-rgb),0.35);
}
.nav-inner{
  max-width:1240px; margin:0 auto; padding:0 40px;
  display:flex; align-items:center; justify-content:space-between; gap:24px;
}
@media (max-width:720px){.nav-inner{padding:0 22px;}}
.logo-mark{height:46px; width:auto; display:block; transition:height 0.35s ease;}
header.site-nav.scrolled .logo-mark{height:38px;}
@media (max-width:980px){.logo-mark{height:38px;}}
/* `gap` in flexbox is unsupported on Safari < 14.1, where the links would
   otherwise run together. Margin fallback first, gap for modern browsers. */
.nav-links{display:flex; align-items:center;}
.nav-links > *{margin-left:30px;}
.nav-links > *:first-child{margin-left:0;}
@supports (gap:1px){
  .nav-links{gap:30px;}
  .nav-links > *{margin-left:0;}
}
.nav-links a{
  font-family:var(--sans);
  font-size:0.875rem; letter-spacing:0.02em; font-weight:500;
  color:var(--text-invert);
  position:relative; padding:6px 0;
  white-space:nowrap; /* "Travel Agents" / "Start Planning" must never break in two */
  transition:color 0.3s ease;
}
.nav-links a:hover{color:var(--accent-soft);}
.nav-links a::after{
  content:''; position:absolute; left:0; bottom:0; width:0; height:2px;
  background:var(--accent); transition:width 0.3s ease;
}
.nav-links a:hover::after{width:100%;}
.nav-links a[aria-current="page"]::after{width:100%;}
.nav-cta{
  font-size:0.8rem; font-weight:600; letter-spacing:0.04em;
  padding:11px 22px; border:none;
  background:var(--accent-ink);
  border-radius:3px; color:#fff !important;
  white-space:nowrap;
  transition:background 0.3s ease, transform 0.2s ease;
}
.nav-cta::after{display:none;}
.nav-cta:hover{background:var(--accent); color:#fff !important; transform:translateY(-1px);}
.nav-toggle{display:none; background:none; border:none; cursor:pointer; z-index:1100; padding:8px; min-width:44px; min-height:44px;}
.nav-toggle span{display:block; width:24px; height:2px; background:var(--text-invert); margin:5px 0; transition:0.3s;}

/* The desktop nav needs ~950px to lay 7 links plus the CTA on one line, so the
   drawer takes over at 980px rather than 900px — between those widths the bar
   used to squeeze and wrap. */
@media (max-width:980px){
  .nav-links{
    position:fixed; top:0; right:-100%; height:100vh; width:min(320px,80vw);
    background:var(--primary-deep); flex-direction:column; justify-content:center;
    gap:26px; padding:40px; transition:right 0.45s cubic-bezier(.77,0,.18,1);
    box-shadow:-20px 0 60px rgba(var(--primary-deep-rgb),0.45);
  }
  .nav-links.open{right:0;}
  .nav-links a{color:var(--text-invert); font-size:1rem; min-height:44px; display:flex; align-items:center;}
  .nav-cta{text-align:center; justify-content:center; display:flex; align-items:center;}
  .nav-toggle{display:block;}
}

/* ---------- HERO (homepage) ---------- */
.hero{
  position:relative; height:calc(100vh - 76px); min-height:560px;
  display:flex; align-items:flex-end;
  overflow:hidden;
}
.hero-slide{
  position:absolute; inset:0; background-size:cover; background-position:center;
  opacity:0; transform:scale(1.08);
  animation:heroFade 18s infinite;
}
.hero-slide:nth-child(1){animation-delay:0s;}
.hero-slide:nth-child(2){animation-delay:6s;}
.hero-slide:nth-child(3){animation-delay:12s;}
@keyframes heroFade{
  0%{opacity:0; transform:scale(1.08);}
  5%{opacity:1; transform:scale(1.13);}
  28%{opacity:1; transform:scale(1.13);}
  33%{opacity:0; transform:scale(1.16);}
  100%{opacity:0;}
}
.hero::before{
  content:''; position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(var(--primary-deep-rgb),0.55) 0%, rgba(var(--primary-deep-rgb),0.25) 38%, rgba(var(--primary-deep-rgb),0.75) 100%);
  z-index:1;
}
.hero-content{position:relative; z-index:2; padding:0 0 100px; width:100%;}
.hero-content .container{max-width:1240px;}
.hero-eyebrow{color:var(--accent-soft); font-size:0.78rem; letter-spacing:0.25em; text-transform:uppercase; font-weight:600; margin-bottom:22px; display:block;}
.hero h1{
  font-size:clamp(2.6rem, 6vw, 5.2rem);
  color:var(--surface-alt);
  max-width:820px;
  line-height:1.05;
  margin-bottom:26px;
}
.hero p.sub{
  color:rgba(var(--surface-rgb),0.88); font-size:1.08rem; max-width:480px; font-weight:300;
  margin-bottom:40px;
}
.hero-ctas{display:flex; gap:18px; flex-wrap:wrap; align-items:center; margin-bottom:56px;}
.btn{
  display:inline-flex; align-items:center; gap:10px;
  padding:15px 30px; font-size:0.84rem; font-weight:600; letter-spacing:0.04em;
  border-radius:2px; transition:all 0.35s ease; white-space:nowrap;
  cursor:pointer; border:none; font-family:var(--sans);
}
/* Terra Cotta is the exclusive CTA colour (Brand Guidelines 11).
   The fill uses --accent-ink so the white label clears WCAG AA (4.79:1);
   full-strength --accent is kept for the hover lift and decoration.
   Legacy class names (.btn-gold / .btn-teal) are retained deliberately —
   they are referenced across templates and JS; only styling changed. */
.btn-gold{background:var(--accent-ink); color:#fff; box-shadow:var(--shadow-sm);}
.btn-gold:hover{background:var(--accent); color:#fff; transform:translateY(-2px); box-shadow:var(--shadow-md);}
.btn-outline{border:1px solid rgba(var(--surface-rgb),0.65); color:var(--text-invert); background:none;}
.btn-outline:hover{border-color:var(--accent-soft); color:var(--accent-soft); background:rgba(var(--surface-rgb),0.08);}
.btn-teal{background:var(--primary); color:var(--text-invert);}
.btn-teal:hover{background:var(--primary-deep); transform:translateY(-2px);}
.btn-outline-teal{border:1px solid var(--primary); color:var(--primary); background:none;}
.btn-outline-teal:hover{background:var(--primary); color:var(--text-invert);}
.btn-green{background:var(--secondary-ink); color:#fff;}
.btn-green:hover{background:var(--secondary); transform:translateY(-2px);}

.journey-line{position:absolute; left:0; right:0; bottom:0; width:100%; z-index:2; pointer-events:none;}
.journey-line path{
  fill:none; stroke:var(--accent); stroke-width:1.4; opacity:0.85;
  stroke-dasharray:1400; stroke-dashoffset:1400;
  animation:drawLine 3.2s ease-out 0.4s forwards;
}
@keyframes drawLine{to{stroke-dashoffset:0;}}

.scroll-cue{
  position:absolute; right:40px; bottom:36px; z-index:2;
  display:flex; flex-direction:column; align-items:center; gap:10px;
  color:rgba(var(--surface-rgb),0.75); font-size:0.68rem; letter-spacing:0.18em; text-transform:uppercase;
}
@media (max-width:720px){.scroll-cue{display:none;}}
.scroll-cue .line{width:1px; height:38px; background:rgba(var(--surface-rgb),0.4); position:relative; overflow:hidden;}
.scroll-cue .line::after{content:''; position:absolute; top:-100%; left:0; width:100%; height:100%; background:var(--accent); animation:scrollDrip 2.2s infinite ease-in-out;}
@keyframes scrollDrip{0%{top:-100%;} 60%{top:100%;} 100%{top:100%;}}

/* ---------- INNER PAGE HERO (destinations / experiences / pages) ---------- */
.page-hero{
  position:relative; height:52vh; min-height:340px; margin-top:0;
  background-size:cover; background-position:center;
  display:flex; align-items:flex-end;
}
.page-hero-plain{background:var(--primary-deep);}
.page-hero-overlay{position:absolute; inset:0; background:linear-gradient(180deg, rgba(var(--primary-deep-rgb),0.35) 0%, rgba(var(--primary-deep-rgb),0.78) 100%);}
.page-hero-content{position:relative; z-index:2; padding-bottom:52px;}
.page-hero-content h1{color:var(--surface-alt); font-size:clamp(2.2rem,4.5vw,3.6rem);}
.page-hero .hero-eyebrow{color:var(--accent-soft); font-size:0.78rem; letter-spacing:0.22em; text-transform:uppercase; font-weight:600; margin-bottom:16px; display:block;}

/* ---------- SECTION GENERIC ---------- */
section{padding:120px 0;}
@media (max-width:900px){section{padding:80px 0;}}
.section-head{max-width:640px; margin-bottom:64px;}
.section-head h2{font-size:clamp(2rem,4vw,3rem); color:var(--primary-deep); line-height:1.15;}
.section-head p{color:var(--text-muted); font-size:1.02rem; margin-top:18px; font-weight:300;}
.section-head.center{margin-left:auto; margin-right:auto; text-align:center;}

/* ---------- WHY VITACEYLONA ---------- */
.why{background:var(--surface-alt);}
.why-grid{display:grid; grid-template-columns:1.1fr 1.6fr; gap:80px; align-items:start;}
@media (max-width:900px){.why-grid{grid-template-columns:1fr; gap:48px;}}
.why-manifesto p{font-family:var(--serif); font-size:1.5rem; font-style:italic; color:var(--primary-deep); line-height:1.5; font-weight:400;}
.why-principles{display:flex; flex-direction:column;}
.principle{
  display:grid; grid-template-columns:44px 1fr; gap:22px;
  padding:28px 0; border-top:1px solid rgba(var(--primary-rgb),0.14);
}
.why-principles .principle:last-child{border-bottom:1px solid rgba(var(--primary-rgb),0.14);}
.principle .icon{color:var(--accent-ink);}
.principle h3{font-size:1.15rem; color:var(--primary-deep); font-weight:600; font-family:var(--sans); margin-bottom:6px; letter-spacing:0.01em;}
.principle p{font-size:0.94rem; color:var(--text-muted); font-weight:300;}

/* ---------- EXPERIENCES GRID (homepage) ---------- */
.experiences{background:var(--surface); position:relative;}
.exp-grid{
  display:grid;
  grid-template-columns:repeat(6,1fr);
  grid-auto-rows:180px;
  gap:22px;
  position:relative;
}
.exp-card{
  position:relative; border-radius:3px; overflow:hidden; cursor:pointer; display:block;
  grid-column:span 3; grid-row:span 2;
}
.exp-card.wide{grid-column:span 4;}
.exp-card.narrow{grid-column:span 2;}
.exp-card img{
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover;
  transition:transform 0.7s cubic-bezier(.2,.7,.3,1);
}
.exp-card:hover img{transform:scale(1.08);}
.exp-card::after{
  content:''; position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(var(--primary-deep-rgb),0) 40%, rgba(var(--primary-deep-rgb),0.82) 100%);
}
.exp-card .exp-label{
  position:absolute; left:24px; right:24px; bottom:22px; z-index:2;
}
.exp-card .exp-eyebrow{color:var(--accent-soft); font-size:0.68rem; letter-spacing:0.18em; text-transform:uppercase; font-weight:600; display:block; margin-bottom:6px;}
.exp-card h3{color:var(--surface-alt); font-size:1.5rem; font-weight:500;}
@media (max-width:900px){
  .exp-grid{grid-template-columns:repeat(2,1fr); grid-auto-rows:220px;}
  .exp-card, .exp-card.wide, .exp-card.narrow{grid-column:span 1; grid-row:span 1;}
}

/* ---------- MAP ---------- */
.map-section{background:var(--primary-deep); color:var(--surface-alt); overflow:hidden;}
.map-section .section-head h2{color:var(--surface-alt);}
.map-section .section-head p{color:rgba(var(--surface-rgb),0.75);}
.map-wrap{display:grid; grid-template-columns:0.9fr 1.1fr; gap:60px; align-items:center;}
@media (max-width:900px){.map-wrap{grid-template-columns:1fr;}}
.map-svg{width:100%; height:auto;}
.map-pin{cursor:pointer;}
.map-pin circle.pulse{fill:var(--accent); opacity:0.35; animation:pulse 2.4s infinite ease-out;}
.map-pin circle.dot{fill:var(--accent); stroke:var(--surface-alt); stroke-width:1.2;}
@keyframes pulse{0%{r:5; opacity:0.5;} 100%{r:16; opacity:0;}}
.map-pin text{fill:var(--surface-alt); font-family:var(--sans); font-size:11px; font-weight:500; opacity:0; transition:opacity 0.25s ease;}
.map-pin:hover text{opacity:1;}
.map-list{display:flex; flex-direction:column; gap:0;}
.map-list .m-item{
  display:flex; justify-content:space-between; align-items:baseline;
  padding:20px 0; border-top:1px solid rgba(var(--surface-rgb),0.15);
  font-family:var(--serif); font-size:1.3rem;
}
.map-list .m-item:last-child{border-bottom:1px solid rgba(var(--surface-rgb),0.15);}
.map-list .m-item span.tag{font-family:var(--sans); font-size:0.72rem; letter-spacing:0.14em; text-transform:uppercase; color:var(--accent-soft); font-weight:600;}

/* ---------- HOTELS TEASER ---------- */
.hotels{background:var(--surface-alt);}
.hotel-wrap{display:grid; grid-template-columns:1.15fr 0.85fr; gap:0; align-items:stretch; box-shadow:0 30px 60px rgba(var(--primary-rgb),0.12);}
@media (max-width:900px){.hotel-wrap{grid-template-columns:1fr;}}
.hotel-img{position:relative; min-height:420px; overflow:hidden;}
.hotel-img img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover;}
.hotel-panel{background:var(--primary); color:var(--surface-alt); padding:64px 56px; display:flex; flex-direction:column; justify-content:center;}
@media (max-width:720px){.hotel-panel{padding:44px 28px;}}
.hotel-panel h2{color:var(--surface-alt); font-size:2.1rem; margin-bottom:20px;}
.hotel-panel p{color:rgba(var(--surface-rgb),0.85); font-weight:300; margin-bottom:32px;}
.hotel-tags{display:flex; flex-wrap:wrap; gap:10px; margin-bottom:36px;}
.hotel-tags span{
  font-size:0.72rem; letter-spacing:0.05em; padding:7px 14px;
  border:1px solid rgba(var(--surface-rgb),0.3); border-radius:20px; color:rgba(var(--surface-rgb),0.9);
}

/* ---------- TESTIMONIALS ---------- */
.testimonials{background:var(--surface); text-align:center;}
.quote-wrap{max-width:760px; margin:0 auto; min-height:220px; position:relative;}
.quote-slide{position:absolute; inset:0; opacity:0; transition:opacity 0.6s ease;}
.quote-slide.active{opacity:1; position:relative;}
.quote-slide p.q{font-family:var(--serif); font-style:italic; font-size:1.7rem; color:var(--primary-deep); line-height:1.5; margin-bottom:26px;}
.quote-meta{display:flex; align-items:center; justify-content:center; gap:14px;}
.quote-avatar{
  width:44px; height:44px; border-radius:50%; border:1px solid var(--accent);
  display:flex; align-items:center; justify-content:center;
  font-family:var(--serif); color:var(--accent); font-size:1rem;
}
.quote-meta .who{text-align:left; font-size:0.85rem;}
.quote-meta .who strong{display:block; color:var(--primary-deep); font-weight:600;}
.quote-meta .who span{color:var(--text-muted); font-size:0.78rem;}
.quote-dots{display:flex; gap:9px; justify-content:center; margin-top:40px;}
.quote-dots button{width:7px; height:7px; border-radius:50%; background:rgba(var(--primary-rgb),0.25); border:none; cursor:pointer; transition:0.3s;}
.quote-dots button.active{background:var(--accent); width:22px; border-radius:4px;}

/* ---------- GALLERY ---------- */
.gallery{background:var(--surface-alt);}
.gal-grid{display:grid; grid-template-columns:repeat(6,1fr); gap:14px;}
@media (max-width:900px){.gal-grid{grid-template-columns:repeat(3,1fr);}}
.gal-grid a{position:relative; aspect-ratio:1; overflow:hidden; border-radius:3px; display:block;}
.gal-grid img{width:100%; height:100%; object-fit:cover; transition:transform 0.5s ease, filter 0.5s ease;}
.gal-grid a:hover img{transform:scale(1.1);}
.gal-grid a::after{content:'';position:absolute;inset:0;background:rgba(var(--primary-rgb),0);transition:background 0.3s ease;}
.gal-grid a:hover::after{background:rgba(var(--primary-rgb),0.18);}

/* ---------- NEWSLETTER ---------- */
.newsletter{background:var(--primary-deep); color:var(--surface-alt);}
.news-wrap{display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:32px;}
.news-wrap h2{color:var(--surface-alt); font-size:2rem; max-width:420px;}
.news-form{display:flex; align-items:center; gap:14px; border-bottom:1px solid rgba(var(--surface-rgb),0.4); min-width:340px; padding-bottom:12px;}
.news-form input{
  background:none; border:none; color:var(--surface-alt); font-family:var(--sans);
  font-size:0.95rem; flex:1; outline:none;
}
.news-form input::placeholder{color:rgba(var(--surface-rgb),0.5);}
.news-form button{background:none; border:none; color:var(--accent-soft); font-weight:600; font-size:0.85rem; letter-spacing:0.05em; cursor:pointer;}

/* ---------- FOOTER ---------- */
footer{background:var(--primary-deep); color:rgba(var(--surface-rgb),0.75); padding-top:80px;}
.foot-grid{display:grid; grid-template-columns:1.3fr repeat(3,0.9fr); gap:48px; padding-bottom:60px; border-bottom:1px solid rgba(var(--surface-rgb),0.12);}
@media (max-width:900px){.foot-grid{grid-template-columns:1fr 1fr; row-gap:36px;}}
.foot-logo{height:52px; width:auto; margin-bottom:18px;}
.foot-tagline{font-family:var(--serif); font-style:italic; color:var(--accent-soft); font-size:1rem; margin-bottom:14px;}
.foot-grid p.desc{font-size:0.88rem; max-width:280px; font-weight:300;}
.foot-col h4{font-family:var(--sans); font-size:0.75rem; letter-spacing:0.14em; text-transform:uppercase; color:var(--accent-soft); margin-bottom:18px; font-weight:600;}
.foot-col a{display:block; font-size:0.88rem; margin-bottom:12px; color:rgba(var(--surface-rgb),0.75); transition:color 0.25s ease;}
.foot-col a:hover{color:var(--accent-soft);}
.foot-bottom{
  display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:14px;
  padding:28px 0; font-size:0.78rem; color:rgba(var(--surface-rgb),0.5);
}
.foot-social{display:flex; gap:16px;}
.foot-social a{color:rgba(var(--surface-rgb),0.6); transition:color 0.25s ease;}
.foot-social a:hover{color:var(--accent-soft);}

/* Progressive enhancement: content is visible by default. The reveal
   animation is only armed when JS is running (html.vc-js), so a script
   failure can never leave the page blank. */
.fade-up{opacity:1; transform:none;}
.vc-js .fade-up{opacity:0; transform:translateY(28px); transition:opacity 0.8s ease, transform 0.8s ease;}
.vc-js .fade-up.in{opacity:1; transform:translateY(0);}

.wa-float{
  position:fixed; bottom:26px; right:26px; z-index:900;
  width:54px; height:54px; border-radius:50%; background:#25D366;
  display:flex; align-items:center; justify-content:center;
  box-shadow:0 10px 30px rgba(0,0,0,0.25); transition:transform 0.3s ease;
}
.wa-float:hover{transform:scale(1.08);}

/* ---------- INNER PAGE / DETAIL LAYOUT (Destination, Experience, Page, Archive) ---------- */
.detail-section{background:var(--surface);}
.detail-grid{display:grid; grid-template-columns:1.7fr 1fr; gap:70px; align-items:start;}
@media (max-width:900px){.detail-grid{grid-template-columns:1fr;}}
.detail-main h2{color:var(--primary-deep); font-size:1.9rem; margin:44px 0 18px;}
.detail-main h2:first-child{margin-top:0;}
.rich-text{color:var(--text); font-weight:300; font-size:1rem;}
.rich-text.small{font-size:0.92rem;}
.rich-text ul{padding-left:20px; margin:10px 0;}
.rich-text li{margin-bottom:6px;}
.rich-text p{margin-bottom:14px;}
.muted{color:var(--text-muted); font-style:italic;}

.detail-gallery{display:grid; grid-template-columns:repeat(2,1fr); gap:16px; margin-top:6px;}
.detail-gallery a{border-radius:3px; overflow:hidden; display:block; aspect-ratio:4/3;}
.detail-gallery img{width:100%; height:100%; object-fit:cover; transition:transform 0.5s ease;}
.detail-gallery a:hover img{transform:scale(1.06);}

/* Two-up field pairing for longer forms (e.g. Start Planning) — collapses
   to one column on small screens so paired inputs never get cramped. */
.form-row-2{display:grid; grid-template-columns:1fr 1fr; gap:18px;}
@media (max-width:600px){.form-row-2{grid-template-columns:1fr;}}

.detail-sidebar{position:sticky; top:110px;}
.sidebar-card{background:var(--surface-alt); border:1px solid rgba(var(--primary-rgb),0.12); border-radius:4px; padding:32px;}
.sidebar-card h3{font-family:var(--sans); font-size:0.78rem; letter-spacing:0.1em; text-transform:uppercase; color:var(--accent-ink); font-weight:600; margin:22px 0 8px;}
.sidebar-card h3:first-child{margin-top:0;}
.sidebar-card p{color:var(--text); font-size:0.95rem;}

.timeline{margin-top:10px;}
.timeline-step{display:grid; grid-template-columns:40px 1fr; gap:20px; padding-bottom:28px; position:relative;}
.timeline-step:not(:last-child)::before{content:''; position:absolute; left:19px; top:40px; bottom:0; width:1px; background:rgba(var(--primary-rgb),0.2);}
.timeline-marker{
  width:40px; height:40px; border-radius:50%; background:var(--primary); color:var(--surface-alt);
  display:flex; align-items:center; justify-content:center; font-family:var(--serif); font-size:1.1rem; flex-shrink:0;
}
.timeline-step h3{font-size:1.15rem; color:var(--primary-deep); font-family:var(--sans); font-weight:600; margin-bottom:4px;}
.timeline-step p{color:var(--text-muted); font-size:0.95rem; font-weight:300;}

.archive-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:26px;}
@media (max-width:900px){.archive-grid{grid-template-columns:repeat(2,1fr);}}
@media (max-width:600px){.archive-grid{grid-template-columns:1fr;}}
.archive-card{position:relative; border-radius:3px; overflow:hidden; aspect-ratio:4/5; display:block;}
.archive-card img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; transition:transform 0.6s ease;}
.archive-card:hover img{transform:scale(1.07);}
.archive-card::after{content:''; position:absolute; inset:0; background:linear-gradient(180deg, rgba(var(--primary-deep-rgb),0) 45%, rgba(var(--primary-deep-rgb),0.85) 100%);}
.archive-card-label{position:absolute; left:20px; right:20px; bottom:20px; z-index:2;}
.archive-card-label h3{color:var(--surface-alt); font-size:1.3rem;}
.archive-pagination{margin-top:50px; display:flex; justify-content:center; gap:10px;}
.archive-pagination .page-numbers{padding:10px 16px; border:1px solid rgba(var(--primary-rgb),0.2); border-radius:2px; font-size:0.85rem;}
.archive-pagination .page-numbers.current{background:var(--primary); color:var(--surface-alt); border-color:var(--primary);}

/* ---------- BLOG ---------- */
.blog-grid{display:grid; grid-template-columns:repeat(2,1fr); gap:30px;}
@media (max-width:600px){.blog-grid{grid-template-columns:1fr;}}
.blog-card{display:block; background:var(--surface-alt); border-radius:4px; overflow:hidden; border:1px solid rgba(var(--primary-rgb),0.1); transition:transform 0.35s ease, box-shadow 0.35s ease;}
.blog-card:hover{transform:translateY(-4px); box-shadow:0 20px 40px rgba(var(--primary-rgb),0.12);}
.blog-card-img{aspect-ratio:16/10; overflow:hidden;}
.blog-card-img img{width:100%; height:100%; object-fit:cover; transition:transform 0.5s ease;}
.blog-card:hover .blog-card-img img{transform:scale(1.06);}
.blog-card-body{padding:22px;}
.blog-card-body h3{color:var(--primary-deep); font-size:1.3rem; margin:6px 0 10px;}

/* WordPress default search form */
.search-form{display:flex; gap:0; border-bottom:1px solid rgba(var(--primary-rgb),0.3);}
.search-form .search-field{flex:1; border:none; background:none; padding:10px 4px; font-family:var(--sans); font-size:0.92rem; outline:none;}
.search-form .search-submit{background:none; border:none; color:var(--accent-ink); font-weight:600; cursor:pointer; font-family:var(--sans); font-size:0.85rem;}
.widget{margin-bottom:10px;}
.widget-title{font-family:var(--sans); font-size:0.78rem; letter-spacing:0.1em; text-transform:uppercase; color:var(--accent-ink); font-weight:600; margin-bottom:12px;}
.widget ul{list-style:none;}
.widget li{padding:8px 0; border-top:1px solid rgba(var(--primary-rgb),0.1); font-size:0.9rem;}

/* ---------- AGENT PORTAL ---------- */
.portal-login{max-width:440px; margin:0 auto; background:var(--surface-alt); border:1px solid rgba(var(--primary-rgb),0.12); border-radius:6px; padding:44px;}
.portal-login h2{color:var(--primary-deep); font-size:1.8rem; margin-bottom:12px;}
.portal-login .login-username,
.portal-login .login-password{margin-bottom:16px;}
.portal-login label{display:block; font-family:var(--sans); font-size:0.82rem; font-weight:600; color:var(--primary-deep); margin-bottom:6px;}
.portal-login input[type=text],
.portal-login input[type=password]{width:100%; padding:11px 12px; border:1px solid rgba(var(--primary-rgb),0.25); border-radius:3px; font-family:var(--sans); font-size:0.95rem;}
.portal-login .login-remember{font-weight:400; font-size:0.85rem; margin:6px 0 16px;}
.portal-login .login-remember input{margin-right:6px;}
.portal-login .button-primary,
.portal-login .login-submit input{background:var(--accent); color:var(--primary-deep); border:none; padding:12px 26px; border-radius:2px; font-family:var(--sans); font-weight:600; font-size:0.9rem; cursor:pointer; letter-spacing:0.03em;}
.portal-login .button-primary:hover{background:var(--accent-soft);}

.portal-flash{background:#e7f2ef; border:1px solid var(--primary); color:var(--primary-deep); padding:12px 18px; border-radius:3px; margin-bottom:24px; font-family:var(--sans); font-size:0.9rem;}

.portal-dashboard-head{display:flex; justify-content:space-between; align-items:flex-end; flex-wrap:wrap; gap:20px; margin-bottom:36px;}
.portal-dashboard-head h2{color:var(--primary-deep); font-size:1.9rem;}
.portal-empty{text-align:center; background:var(--surface-alt); border:1px dashed rgba(var(--primary-rgb),0.25); border-radius:6px; padding:56px 24px;}
.portal-empty p{margin-bottom:20px; color:var(--text-muted);}

.itinerary-list{display:flex; flex-direction:column; gap:14px;}
.itinerary-row{display:flex; justify-content:space-between; align-items:center; gap:20px; background:var(--surface-alt); border:1px solid rgba(var(--primary-rgb),0.12); border-radius:5px; padding:20px 24px; transition:box-shadow 0.3s ease;}
.itinerary-row:hover{box-shadow:0 12px 30px rgba(var(--primary-rgb),0.1);}
.itinerary-row-main h3{color:var(--primary-deep); font-size:1.25rem; font-family:var(--serif);}
.itinerary-row-actions{display:flex; gap:8px; flex-shrink:0;}
.btn-small{font-family:var(--sans); font-size:0.78rem; font-weight:600; padding:8px 14px; border:1px solid rgba(var(--primary-rgb),0.3); border-radius:2px; color:var(--primary); transition:all 0.25s ease; white-space:nowrap;}
.btn-small:hover{background:var(--primary); color:var(--surface-alt);}
.btn-small.btn-danger{border-color:rgba(170,51,51,0.4); color:#a33;}
.btn-small.btn-danger:hover{background:#a33; color:var(--surface-alt); border-color:#a33;}

.portal-signout{margin-top:40px; text-align:center;}
.portal-signout a{font-family:var(--sans); font-size:0.85rem; color:var(--text-muted); text-decoration:underline;}

.portal-toolbar{display:flex; justify-content:space-between; align-items:center; margin-bottom:28px;}
.portal-back{font-family:var(--sans); font-size:0.85rem; color:var(--primary); font-weight:600;}
.btn-teal{background:var(--primary); color:var(--surface-alt); padding:11px 22px; border-radius:2px; font-family:var(--sans); font-weight:600; font-size:0.82rem; letter-spacing:0.03em;}
.btn-teal:hover{background:var(--primary-deep);}
.btn-outline-teal{background:none; border:1px solid var(--primary); color:var(--primary); padding:11px 22px; border-radius:2px; font-family:var(--sans); font-weight:600; font-size:0.82rem; cursor:pointer; margin-top:8px;}
.btn-outline-teal:hover{background:var(--primary); color:var(--surface-alt);}

.itinerary-builder{background:var(--surface-alt); border:1px solid rgba(var(--primary-rgb),0.12); border-radius:6px; padding:36px;}
.itinerary-builder h2{color:var(--primary-deep); font-size:1.5rem; margin:10px 0 6px;}
.itinerary-builder label span{display:block; font-family:var(--sans); font-size:0.78rem; font-weight:600; color:var(--primary-deep); margin-bottom:5px;}
.itinerary-builder input[type=text],
.itinerary-builder input[type=date],
.itinerary-builder input[type=number],
.itinerary-builder select,
.itinerary-builder textarea{width:100%; padding:10px 12px; border:1px solid rgba(var(--primary-rgb),0.25); border-radius:3px; font-family:var(--sans); font-size:0.92rem; background:var(--surface-alt);}
.builder-head{margin-bottom:24px;}
.field-full{display:block; margin-bottom:16px;}
.builder-meta{display:grid; grid-template-columns:repeat(4,1fr); gap:14px;}
@media (max-width:720px){.builder-meta{grid-template-columns:1fr 1fr;}}

.day-card{border:1px solid rgba(var(--primary-rgb),0.15); border-radius:5px; padding:22px; margin-bottom:16px; background:var(--surface-alt);}
.day-card-head{display:flex; justify-content:space-between; align-items:center; margin-bottom:16px;}
.day-number{font-family:var(--serif); font-size:1.3rem; color:var(--primary-deep);}
.day-remove{background:none; border:none; color:#a33; font-family:var(--sans); font-size:0.8rem; font-weight:600; cursor:pointer;}
.day-grid{display:grid; grid-template-columns:1fr 1fr; gap:14px;}
.day-grid .field-full{grid-column:1 / -1; margin-bottom:0;}
.day-grid .field-half{grid-column:span 1;}
@media (max-width:720px){.day-grid{grid-template-columns:1fr;} .day-grid .field-half{grid-column:1 / -1;}}
.catalog-select{min-height:110px;}

.builder-actions{margin-top:24px; padding-top:20px; border-top:1px solid rgba(var(--primary-rgb),0.12);}

/* ---------- GUEST FEEDBACK ---------- */
.feedback-section{background:var(--surface); padding:70px 0 100px;}
.feedback-container{max-width:760px; margin:0 auto; padding:0 24px;}
.hidden{display:none !important;}
.fade-in{animation:fbFade 0.5s ease;}
@keyframes fbFade{from{opacity:0;transform:translateY(12px);}to{opacity:1;transform:translateY(0);}}

.feedback-intro{text-align:center; background:var(--surface-alt); border:1px solid rgba(var(--primary-rgb),0.12); border-radius:8px; padding:52px 40px;}
.fb-lead{font-family:var(--serif); font-size:1.5rem; color:var(--primary-deep); font-style:italic; margin-bottom:16px; line-height:1.5;}
.fb-time{font-family:var(--sans); font-size:0.8rem; letter-spacing:0.14em; text-transform:uppercase; color:var(--accent-ink); font-weight:600; margin-bottom:22px;}
.fb-welcome{color:var(--text-muted); margin-bottom:26px;}
.fb-ref{color:var(--accent-ink); font-size:0.85em;}

.fb-progress{margin-bottom:30px;}
.fb-progress-bar{height:4px; background:rgba(var(--primary-rgb),0.15); border-radius:2px; overflow:hidden;}
.fb-progress-bar span{display:block; height:100%; background:var(--accent); width:0; transition:width 0.45s ease;}
.fb-progress-label{font-family:var(--sans); font-size:0.78rem; letter-spacing:0.05em; color:var(--text-muted); margin-top:10px; text-transform:uppercase;}

.feedback-form{background:var(--surface-alt); border:1px solid rgba(var(--primary-rgb),0.12); border-radius:8px; padding:40px;}
@media (max-width:600px){.feedback-form{padding:26px 20px;}}
.fb-step-title{color:var(--primary-deep); font-size:1.8rem; margin-bottom:8px;}
.fb-step-sub{color:var(--text-muted); font-size:0.95rem; margin-bottom:22px;}

.fb-field{margin-bottom:22px;}
.fb-label{display:block; font-family:var(--sans); font-size:0.9rem; font-weight:600; color:var(--primary-deep); margin-bottom:10px;}
.fb-label .req{color:var(--accent-ink);}
.fb-field input[type=text], .fb-field input[type=email], .fb-field textarea, .fb-field input[type=date]{
  width:100%; padding:12px 14px; border:1px solid rgba(var(--primary-rgb),0.25); border-radius:4px; font-family:var(--sans); font-size:0.98rem; background:var(--surface-alt);
}
.fb-field.fb-invalid input, .fb-field.fb-invalid textarea{border-color:#c0392b; background:#fdf3f2;}

/* stars */
.fb-star-row{display:flex; gap:6px;}
.fb-star{background:none; border:none; font-size:2rem; line-height:1; color:rgba(var(--primary-rgb),0.2); cursor:pointer; padding:2px; transition:color 0.15s ease, transform 0.15s ease;}
.fb-star:hover{transform:scale(1.12);}
.fb-star.on{color:var(--accent);}
.fb-stars.fb-invalid .fb-star{color:#e2b0a8;}

/* nps */
.fb-nps-row{display:flex; gap:6px; flex-wrap:wrap;}
.fb-nps-btn{width:40px; height:40px; border:1px solid rgba(var(--primary-rgb),0.25); background:var(--surface-alt); border-radius:4px; font-family:var(--sans); font-weight:600; color:var(--primary-deep); cursor:pointer; transition:all 0.2s ease;}
.fb-nps-btn:hover{border-color:var(--accent);}
.fb-nps-btn.on{background:var(--primary); color:var(--surface-alt); border-color:var(--primary);}
.fb-nps-ends{display:flex; justify-content:space-between; font-size:0.72rem; color:var(--text-muted); margin-top:8px; text-transform:uppercase; letter-spacing:0.08em;}

/* choices */
.fb-choice-row{display:flex; flex-direction:column; gap:8px;}
.fb-choice{display:flex; align-items:center; gap:10px; padding:11px 14px; border:1px solid rgba(var(--primary-rgb),0.2); border-radius:4px; cursor:pointer; font-size:0.94rem; transition:all 0.2s ease; background:var(--surface-alt);}
.fb-choice:hover{border-color:var(--accent-soft); background:var(--surface-alt);}
.fb-choice input{accent-color:var(--primary); width:18px; height:18px; flex-shrink:0;}
.fb-choice input:checked + span{color:var(--primary-deep); font-weight:600;}

.fb-check-grid{display:grid; grid-template-columns:1fr 1fr; gap:8px; margin-bottom:16px;}
@media (max-width:600px){.fb-check-grid{grid-template-columns:1fr;}}
.fb-check{display:flex; align-items:center; gap:9px; font-size:0.92rem; cursor:pointer;}
.fb-check input{accent-color:var(--primary); width:17px; height:17px;}

.fb-card{background:var(--surface-alt); border:1px solid rgba(var(--primary-rgb),0.15); border-radius:6px; padding:24px; margin-bottom:20px;}
.fb-card-title{color:var(--primary-deep); font-size:1.15rem; font-family:var(--sans); font-weight:600; margin-bottom:16px; padding-bottom:10px; border-bottom:1px solid rgba(var(--primary-rgb),0.1);}

.fb-consent-reminder{background:var(--surface-alt); border:1px solid var(--accent-soft); border-radius:4px; padding:12px 14px; font-size:0.85rem; color:var(--accent-ink); margin:14px 0;}

.fb-media-list{margin-top:14px; display:flex; flex-direction:column; gap:10px;}
.fb-media-item{display:grid; grid-template-columns:1fr auto; gap:8px; align-items:center; background:var(--surface-alt); border:1px solid rgba(var(--primary-rgb),0.15); border-radius:4px; padding:10px 12px;}
.fb-media-name{font-size:0.85rem; font-weight:600; color:var(--primary-deep);}
.fb-media-status{font-size:0.78rem; color:var(--text-muted);}
.fb-media-status.ok{color:var(--primary);}
.fb-media-status.bad{color:#c0392b;}
.fb-media-desc, .fb-media-loc{grid-column:1/-1; padding:8px 10px !important; font-size:0.86rem !important;}

.fb-nav{display:flex; justify-content:space-between; align-items:center; gap:12px; margin-top:14px;}
.fb-nav .btn{min-width:120px; justify-content:center;}
#fbNextBtn, #fbSubmitBtn{margin-left:auto;}

.fb-error-global{background:#fdf3f2; border:1px solid #e0b4ae; color:#c0392b; padding:12px 16px; border-radius:4px; margin-top:16px; font-size:0.9rem;}

.fb-summary{background:var(--surface-alt); border:1px solid rgba(var(--primary-rgb),0.15); border-radius:6px; padding:8px 20px;}
.fb-sum-row{display:flex; justify-content:space-between; padding:12px 0; border-bottom:1px solid rgba(var(--primary-rgb),0.08); font-size:0.94rem;}
.fb-sum-row:last-child{border-bottom:none;}
.fb-sum-row span{color:var(--text-muted);}
.fb-sum-row strong{color:var(--primary-deep);}

.fb-thankyou{text-align:center; background:var(--surface-alt); border:1px solid rgba(var(--primary-rgb),0.12); border-radius:8px; padding:64px 40px;}
.fb-ty-mark{font-size:2.4rem; color:var(--accent); margin-bottom:16px;}
.fb-thankyou h2{color:var(--primary-deep); font-size:2rem; margin-bottom:14px;}
.fb-thankyou p{color:var(--text-muted); margin-bottom:10px;}
.fb-ty-note{font-size:0.9rem; color:var(--text-muted); max-width:460px; margin:8px auto;}
.fb-thankyou .btn{margin-top:24px;}

/* ---------- ITINERARY PREVIEW (Brand Guidelines 06) ----------
   Circular imagery, Playfair titles, cream card surfaces, terra cotta CTA. */
.itinerary-preview{background:var(--surface); padding:100px 0;}
.itin-grid{
  display:grid; grid-template-columns:repeat(3,1fr); gap:32px; margin-top:48px;
}
.itin-card{
  background:var(--surface-alt);
  border:1px solid var(--border);
  border-radius:6px;
  padding:38px 28px 32px;
  text-align:center;
  transition:transform 0.35s ease, box-shadow 0.35s ease, border-color 0.35s ease;
}
.itin-card:hover{transform:translateY(-6px); box-shadow:var(--shadow-md); border-color:rgba(var(--accent-rgb),0.35);}
.itin-media{
  display:block; width:132px; height:132px; margin:0 auto 22px;
  border-radius:50%; overflow:hidden;
  box-shadow:0 6px 20px rgba(var(--primary-rgb),0.18);
  border:3px solid var(--surface-alt);
}
.itin-media img{width:100%; height:100%; object-fit:cover; transition:transform 0.6s ease;}
.itin-card:hover .itin-media img{transform:scale(1.07);}
.itin-card h3{font-size:var(--fs-h3); color:var(--primary); margin-bottom:6px;}
.itin-sub{
  font-family:var(--sans); font-size:var(--fs-label); font-weight:700;
  letter-spacing:0.14em; text-transform:uppercase;
  color:var(--secondary-ink); margin-bottom:12px;
}
.itin-excerpt{font-size:0.9rem; color:var(--text-muted); line-height:1.65; margin-bottom:16px;}
.itin-link{
  font-family:var(--sans); font-size:0.8rem; font-weight:600; letter-spacing:0.04em;
  color:var(--accent-ink); position:relative;
}
.itin-link::after{content:' \\00BB'; }
.itin-card:hover .itin-link{color:var(--accent);}
.itin-cta{text-align:center; margin-top:48px;}

@media (max-width:900px){
  .itin-grid{grid-template-columns:repeat(2,1fr); gap:24px;}
  .itinerary-preview{padding:72px 0;}
}
@media (max-width:600px){
  .itin-grid{grid-template-columns:1fr; gap:20px;}
  .itin-media{width:112px; height:112px;}
  .itinerary-preview{padding:56px 0;}
}

/* =====================================================================
   EXPERIENCES  (archive-experience.php)
   Editorial catalogue: cinematic hero, signature features, filterable
   grid and the "My Journey" shortlist. Built on the existing tokens —
   no new colours, no new type faces.
   ===================================================================== */

/* `hidden` must win over the display rules below (filtered-out cards,
   empty states, the shortlist panel). */
[hidden]{display:none !important;}

/* ---------- 01 · Hero ---------- */
.xp-hero{
  position:relative; min-height:min(84vh,760px);
  display:flex; align-items:flex-end;
  padding:0; overflow:hidden; background:var(--primary-deep);
}
.xp-hero-img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover;}
.xp-hero-veil{
  position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(var(--primary-deep-rgb),0.62) 0%, rgba(var(--primary-deep-rgb),0.28) 40%, rgba(var(--primary-deep-rgb),0.88) 100%);
}
.xp-hero-inner{position:relative; z-index:2; padding-top:140px; padding-bottom:96px;}
.xp-hero-inner h1{
  font-size:clamp(2.6rem,6vw,5rem); color:var(--surface-alt);
  line-height:1.05; max-width:15ch; margin-bottom:26px;
}
.xp-hero-sub{
  color:rgba(var(--surface-rgb),0.9); font-size:1.08rem; font-weight:300;
  max-width:56ch; margin-bottom:40px;
}
@media (max-width:720px){
  .xp-hero{min-height:auto;}
  .xp-hero-inner{padding-top:110px; padding-bottom:64px;}
  .xp-hero-sub{font-size:1rem; margin-bottom:30px;}
}

/* ---------- 02 · Philosophy ---------- */
.xp-philosophy{background:var(--surface-alt);}
.xp-philosophy-grid{display:grid; grid-template-columns:1fr 1.35fr; gap:80px; align-items:start;}
.xp-philosophy-grid h2{font-size:clamp(2rem,3.6vw,2.9rem); color:var(--primary-deep); line-height:1.12;}
.xp-lead{
  font-family:var(--serif); font-size:1.45rem; font-style:italic; font-weight:400;
  line-height:1.5; color:var(--primary-deep); margin-bottom:26px;
}
.xp-lead-sub{color:var(--text-muted); font-size:1.05rem; font-weight:300; max-width:52ch;}
@media (max-width:900px){
  .xp-philosophy-grid{grid-template-columns:1fr; gap:32px;}
  .xp-lead{font-size:1.25rem;}
}

/* ---------- 03 · Signature experiences ---------- */
.xp-signature{background:var(--surface);}
.xp-signature-grid{display:grid; grid-template-columns:repeat(6,1fr); gap:30px;}
.xp-feature{grid-column:span 2;}
.xp-feature.is-wide{grid-column:span 3;}
.xp-feature > a{display:block; height:100%;}
.xp-feature-media{
  display:block; position:relative; overflow:hidden; border-radius:4px;
  aspect-ratio:4/3; margin-bottom:20px;
}
.xp-feature.is-wide .xp-feature-media{aspect-ratio:16/10;}
.xp-feature-media img{
  width:100%; height:100%; object-fit:cover;
  transition:transform 0.8s cubic-bezier(.2,.7,.3,1);
}
.xp-feature:hover .xp-feature-media img{transform:scale(1.05);}
.xp-feature-body{display:block;}
.xp-feature h3{
  font-size:1.55rem; color:var(--primary-deep); margin:8px 0 10px;
  transition:color 0.3s ease;
}
.xp-feature.is-wide h3{font-size:1.95rem;}
.xp-feature:hover h3{color:var(--accent-ink);}
.xp-feature-body p{color:var(--text-muted); font-weight:300; font-size:0.98rem; max-width:52ch;}
.xp-kicker{
  font-family:var(--sans); font-size:0.68rem; font-weight:600;
  letter-spacing:0.18em; text-transform:uppercase; color:var(--accent-ink);
  display:block;
}
.xp-feature-meta{
  display:flex; flex-wrap:wrap; gap:18px; margin-top:16px;
  font-family:var(--sans); font-size:0.78rem; letter-spacing:0.04em;
  color:var(--text-muted);
}
.xp-feature-meta span{position:relative;}
.xp-feature-meta span + span::before{
  content:''; position:absolute; left:-10px; top:50%;
  width:3px; height:3px; border-radius:50%; background:rgba(var(--primary-rgb),0.4);
}
@media (max-width:900px){
  .xp-signature-grid{grid-template-columns:repeat(2,1fr); gap:26px;}
  .xp-feature, .xp-feature.is-wide{grid-column:span 1;}
  .xp-feature.is-wide h3{font-size:1.55rem;}
}
@media (max-width:600px){
  .xp-signature-grid{grid-template-columns:1fr;}
}

/* ---------- 04 · Explorer: filters ---------- */
.xp-explorer{background:var(--surface-alt);}
.xp-filters{margin-bottom:26px;}
.xp-pills{display:flex; flex-wrap:wrap; gap:10px; margin-bottom:22px;}
.xp-pill{
  font-family:var(--sans); font-size:0.8rem; font-weight:500; letter-spacing:0.02em;
  padding:9px 18px; border-radius:100px; cursor:pointer;
  background:transparent; color:var(--text);
  border:1px solid rgba(var(--primary-rgb),0.2);
  transition:background 0.25s ease, color 0.25s ease, border-color 0.25s ease;
}
.xp-pill:hover{border-color:var(--primary); color:var(--primary);}
.xp-pill.is-active{background:var(--primary); border-color:var(--primary); color:var(--surface-alt);}
@media (max-width:720px){
  /* horizontal category rail rather than a wrapping block */
  .xp-pills{
    flex-wrap:nowrap; overflow-x:auto; margin:0 -22px 18px; padding:2px 22px 10px;
    scroll-snap-type:x proximity; -webkit-overflow-scrolling:touch;
  }
  .xp-pills::-webkit-scrollbar{display:none;}
  .xp-pill{flex:0 0 auto; scroll-snap-align:start;}
}

.xp-filter-bar{display:flex; gap:16px; align-items:center; margin-bottom:20px;}
.xp-search{flex:1; display:block;}
.xp-search input{
  width:100%; padding:13px 16px; font-family:var(--sans); font-size:0.92rem;
  background:var(--surface); color:var(--text);
  border:1px solid rgba(var(--primary-rgb),0.2); border-radius:3px; outline:none;
  transition:border-color 0.25s ease;
}
.xp-search input:focus{border-color:var(--primary);}
.xp-search input::placeholder{color:var(--text-muted);}
.xp-refine-toggle{
  display:none; align-items:center; gap:8px; cursor:pointer;
  font-family:var(--sans); font-size:0.85rem; font-weight:600;
  padding:13px 22px; border-radius:3px;
  background:var(--primary); color:var(--surface-alt); border:none;
}
.xp-refine-count{
  background:var(--accent-ink); color:#fff; border-radius:100px;
  min-width:18px; height:18px; font-size:0.68rem; line-height:18px; text-align:center;
  display:inline-block; padding:0 5px;
}
.xp-refine-head{display:none;}
.xp-refine-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:16px;}
.xp-select{display:block;}
.xp-select span{
  display:block; font-family:var(--sans); font-size:0.7rem; font-weight:600;
  letter-spacing:0.12em; text-transform:uppercase; color:var(--text-muted);
  margin-bottom:7px;
}
.xp-select select{
  width:100%; padding:12px 14px; font-family:var(--sans); font-size:0.9rem;
  background:var(--surface); color:var(--text);
  border:1px solid rgba(var(--primary-rgb),0.2); border-radius:3px;
  cursor:pointer; appearance:none;
  background-image:linear-gradient(45deg,transparent 50%,currentColor 50%),linear-gradient(135deg,currentColor 50%,transparent 50%);
  background-position:calc(100% - 18px) 55%, calc(100% - 13px) 55%;
  background-size:5px 5px, 5px 5px; background-repeat:no-repeat;
}
.xp-select select:focus{border-color:var(--primary); outline:none;}
.xp-refine-actions{display:flex; justify-content:flex-end; margin-top:14px;}
.xp-clear{
  background:none; border:none; cursor:pointer;
  font-family:var(--sans); font-size:0.82rem; font-weight:600;
  color:var(--accent-ink); text-decoration:underline; text-underline-offset:3px;
}
.xp-refine-apply{display:none;}

.xp-result-count{
  font-family:var(--sans); font-size:0.78rem; letter-spacing:0.14em;
  text-transform:uppercase; color:var(--text-muted); font-weight:600;
  margin-bottom:28px;
}

/* Mobile: the refine panel becomes a bottom sheet. */
@media (max-width:900px){
  .xp-refine-toggle{display:inline-flex;}
  .xp-refine{
    position:fixed; left:0; right:0; bottom:0; z-index:1200;
    background:var(--surface); border-radius:14px 14px 0 0;
    padding:8px 22px 26px; max-height:82vh; overflow-y:auto;
    box-shadow:0 -18px 50px rgba(var(--primary-deep-rgb),0.3);
    /* visibility is toggled alongside the slide so the closed drawer is not
       reachable by keyboard while it sits off-screen. */
    transform:translateY(102%); visibility:hidden;
    transition:transform 0.4s cubic-bezier(.77,0,.18,1), visibility 0s linear 0.4s;
  }
  .xp-refine.is-open{
    transform:translateY(0); visibility:visible;
    transition:transform 0.4s cubic-bezier(.77,0,.18,1), visibility 0s;
  }
  .xp-refine-head{
    display:flex; align-items:center; justify-content:space-between;
    padding:10px 0 16px; position:sticky; top:0; background:var(--surface);
  }
  .xp-refine-head h3{font-size:1.2rem; color:var(--primary-deep);}
  .xp-refine-close{
    background:none; border:none; cursor:pointer; color:var(--text);
    font-size:1.8rem; line-height:1; padding:4px 10px; min-height:44px;
  }
  .xp-refine-grid{grid-template-columns:1fr 1fr; gap:14px;}
  .xp-refine-actions{justify-content:space-between; align-items:center; margin-top:22px;}
  .xp-refine-apply{display:inline-flex;}
  body.xp-drawer-open{overflow:hidden;}
}
@media (max-width:600px){
  .xp-refine-grid{grid-template-columns:1fr;}
}

/* ---------- 04 · Explorer: cards ---------- */
.xp-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:28px;}
@media (max-width:900px){.xp-grid{grid-template-columns:repeat(2,1fr); gap:22px;}}
@media (max-width:600px){.xp-grid{grid-template-columns:1fr;}}

.xp-card{
  display:flex; flex-direction:column;
  background:var(--surface); border:1px solid var(--border); border-radius:5px;
  overflow:hidden;
  transition:transform 0.35s ease, box-shadow 0.35s ease, border-color 0.35s ease;
}
.xp-card:hover{
  transform:translateY(-5px); box-shadow:var(--shadow-md);
  border-color:rgba(var(--accent-rgb),0.3);
}
.xp-card-media{position:relative; display:block; aspect-ratio:3/2; overflow:hidden;}
.xp-card-media img{
  width:100%; height:100%; object-fit:cover;
  transition:transform 0.7s cubic-bezier(.2,.7,.3,1);
}
.xp-card:hover .xp-card-media img{transform:scale(1.06);}
.xp-badge{
  position:absolute; top:14px; left:14px;
  font-family:var(--sans); font-size:0.62rem; font-weight:700;
  letter-spacing:0.14em; text-transform:uppercase;
  background:rgba(var(--primary-deep-rgb),0.82); color:var(--surface-alt);
  padding:5px 11px; border-radius:2px; backdrop-filter:blur(4px);
}
.xp-card-body{display:flex; flex-direction:column; flex:1; padding:24px 24px 22px;}
.xp-card-body h3{font-size:1.28rem; color:var(--primary-deep); margin:9px 0 10px; line-height:1.25;}
.xp-card-body h3 a{transition:color 0.3s ease;}
.xp-card:hover h3 a{color:var(--accent-ink);}
.xp-card-teaser{color:var(--text-muted); font-size:0.93rem; font-weight:300; margin-bottom:18px;}
.xp-facts{list-style:none; display:flex; flex-wrap:wrap; gap:7px; margin-bottom:14px;}
.xp-facts li{
  font-family:var(--sans); font-size:0.7rem; letter-spacing:0.04em;
  color:var(--text); background:rgba(var(--primary-rgb),0.06);
  border:1px solid rgba(var(--primary-rgb),0.1);
  padding:5px 10px; border-radius:2px;
}
.xp-ideal{
  font-size:0.8rem; color:var(--text-muted); font-style:italic;
  margin-bottom:18px;
}
.xp-card-actions{
  display:flex; align-items:center; justify-content:space-between; gap:12px;
  margin-top:auto; padding-top:16px; border-top:1px solid var(--border);
}
.xp-link{
  font-family:var(--sans); font-size:0.8rem; font-weight:600; letter-spacing:0.04em;
  color:var(--accent-ink); transition:color 0.3s ease;
}
.xp-link:hover{color:var(--accent);}
.xp-link::after{content:' \2192';}
.xp-add{
  font-family:var(--sans); font-size:0.75rem; font-weight:600;
  background:none; cursor:pointer; color:var(--primary);
  border:1px solid rgba(var(--primary-rgb),0.25); border-radius:2px;
  padding:7px 12px; white-space:nowrap;
  transition:background 0.25s ease, color 0.25s ease, border-color 0.25s ease;
}
.xp-add:hover{border-color:var(--primary); background:rgba(var(--primary-rgb),0.06);}
.xp-add.is-added{background:var(--secondary-ink); border-color:var(--secondary-ink); color:#fff;}
.xp-add.is-added::before{content:'\2713\00a0';}

.xp-empty{
  text-align:center; color:var(--text-muted); font-size:1rem;
  padding:60px 20px; max-width:46ch; margin:0 auto;
}
.xp-empty a{color:var(--accent-ink); text-decoration:underline; text-underline-offset:3px;}
.xp-admin-note{
  margin-top:40px; padding:16px 20px; font-size:0.86rem;
  background:rgba(var(--secondary-rgb),0.07);
  border-left:3px solid var(--secondary-ink); border-radius:2px;
}
.xp-admin-note a{color:var(--accent-ink); text-decoration:underline;}

/* ---------- 05 · Build your journey ---------- */
.xp-build{background:var(--primary-deep); color:rgba(var(--surface-rgb),0.85);}
.xp-build-inner{display:grid; grid-template-columns:1.15fr 0.85fr; gap:70px; align-items:start;}
.xp-build h2{color:var(--surface-alt); font-size:clamp(2rem,3.6vw,2.8rem); margin-bottom:14px;}
.xp-build-lead{
  font-family:var(--serif); font-size:1.5rem; font-style:italic;
  color:var(--accent-soft); margin-bottom:18px;
}
.xp-build p{color:rgba(var(--surface-rgb),0.8); font-weight:300; max-width:48ch; margin-bottom:30px;}
.xp-journey-panel{
  background:rgba(var(--surface-rgb),0.06); border:1px solid rgba(var(--surface-rgb),0.16);
  border-radius:6px; padding:30px 28px;
}
.xp-journey-panel h3{
  font-family:var(--sans); font-size:0.76rem; font-weight:600;
  letter-spacing:0.16em; text-transform:uppercase;
  color:var(--accent-soft); margin-bottom:16px;
}
.xp-journey-empty{font-size:0.9rem; color:rgba(var(--surface-rgb),0.7); font-weight:300; margin:0;}
.xp-journey-list{list-style:none;}
.xp-journey-list li{
  display:flex; align-items:center; justify-content:space-between; gap:12px;
  padding:11px 0; border-bottom:1px solid rgba(var(--surface-rgb),0.12);
  font-size:0.93rem; color:var(--surface-alt);
}
.xp-journey-remove{
  background:none; border:none; cursor:pointer; flex-shrink:0;
  color:rgba(var(--surface-rgb),0.6); font-size:1.2rem; line-height:1;
  padding:4px 6px; transition:color 0.25s ease;
}
.xp-journey-remove:hover{color:var(--accent-soft);}
.xp-journey-clear{
  background:none; border:none; cursor:pointer; margin-top:16px;
  font-family:var(--sans); font-size:0.78rem; font-weight:600;
  color:rgba(var(--surface-rgb),0.7); text-decoration:underline; text-underline-offset:3px;
}
.xp-journey-clear:hover{color:var(--accent-soft);}
@media (max-width:900px){
  .xp-build-inner{grid-template-columns:1fr; gap:38px;}
}

/* ---------- 07 · Final CTA ---------- */
.xp-final{background:var(--surface); text-align:center;}
.xp-final-inner{max-width:720px; margin:0 auto;}
.xp-final h2{font-size:clamp(2rem,4vw,3rem); color:var(--primary-deep); margin-bottom:18px;}
.xp-final p{color:var(--text-muted); font-size:1.05rem; font-weight:300; margin-bottom:38px;}
.xp-final-ctas{justify-content:center; margin-bottom:0;}
/* .btn-outline is designed for dark heroes — restate it for this cream section. */
.xp-final .btn-outline{border-color:rgba(var(--primary-rgb),0.35); color:var(--primary);}
.xp-final .btn-outline:hover{background:var(--primary); border-color:var(--primary); color:var(--surface-alt);}

/* ---------- Single experience: fact bar & detail blocks ---------- */
.xp-factbar{
  background:var(--surface-alt); border-bottom:1px solid var(--border);
  padding:0;
}
.xp-factbar-list{
  display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr));
  gap:0; margin:0;
}
.xp-factbar-list > div{
  padding:26px 28px 26px 0; border-right:1px solid var(--border);
}
.xp-factbar-list > div:last-child{border-right:none;}
.xp-factbar-list dt{
  font-family:var(--sans); font-size:0.66rem; font-weight:600;
  letter-spacing:0.16em; text-transform:uppercase; color:var(--text-muted);
  margin-bottom:7px;
}
.xp-factbar-list dd{
  font-size:0.96rem; color:var(--primary-deep); font-weight:500; margin:0;
}
@media (max-width:720px){
  .xp-factbar-list{grid-template-columns:1fr 1fr;}
  .xp-factbar-list > div{padding:18px 18px 18px 0; border-bottom:1px solid var(--border);}
  .xp-factbar-list > div:nth-child(2n){border-right:none;}
}

.xp-responsible{
  background:rgba(var(--secondary-rgb),0.07);
  border-left:3px solid var(--secondary-ink);
  border-radius:2px; padding:4px 26px 20px; margin-top:44px;
}
.xp-responsible h2{margin-top:24px;}

.xp-related-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:18px; margin-top:8px;}
@media (max-width:600px){.xp-related-grid{grid-template-columns:1fr;}}
.xp-related-card{
  display:block; background:var(--surface-alt); border:1px solid var(--border);
  border-radius:4px; overflow:hidden;
  transition:transform 0.3s ease, border-color 0.3s ease;
}
.xp-related-card:hover{transform:translateY(-3px); border-color:rgba(var(--accent-rgb),0.35);}
.xp-related-card img{width:100%; aspect-ratio:3/2; object-fit:cover;}
.xp-related-card > span{display:block; padding:14px 16px 16px;}
.xp-related-card strong{
  display:block; font-family:var(--serif); font-size:1.05rem;
  font-weight:500; color:var(--primary-deep); margin-top:5px; line-height:1.3;
}

.xp-facts-stacked{margin-bottom:0;}
.xp-link-list{list-style:none;}
.xp-link-list li{
  padding:9px 0; border-bottom:1px solid var(--border); font-size:0.92rem;
}
.xp-link-list li:last-child{border-bottom:none;}
.xp-link-list a{color:var(--primary); transition:color 0.25s ease;}
.xp-link-list a:hover{color:var(--accent-ink);}
.xp-add-block{width:100%; justify-content:center; padding:11px 14px; margin-top:6px;}

/* =====================================================================
   DISCOVER  (archive-collection.php / single-collection.php)
   The inspiration layer. Shares the Experiences hero and final-CTA
   components; everything below is specific to collections.
   ===================================================================== */

/* ---------- Collection cards ---------- */
.dc-collections{background:var(--surface);}
.dc-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:34px 30px;}
@media (max-width:900px){.dc-grid{grid-template-columns:repeat(2,1fr); gap:28px 24px;}}
@media (max-width:600px){.dc-grid{grid-template-columns:1fr;}}

.dc-card > a{display:block;}
.dc-card-media{
  display:block; position:relative; overflow:hidden;
  border-radius:4px; aspect-ratio:4/3; margin-bottom:20px;
}
.dc-card-media img{
  width:100%; height:100%; object-fit:cover;
  transition:transform 0.8s cubic-bezier(.2,.7,.3,1);
}
.dc-card:hover .dc-card-media img{transform:scale(1.05);}
.dc-number{
  position:absolute; left:18px; top:14px; z-index:2;
  font-family:var(--serif); font-size:2.1rem; font-weight:500; line-height:1;
  color:var(--surface-alt); opacity:0.92;
  text-shadow:0 2px 14px rgba(var(--primary-deep-rgb),0.55);
}
.dc-card-body{display:block;}
.dc-card-body h3{
  font-size:1.6rem; color:var(--primary-deep); margin:8px 0 10px;
  transition:color 0.3s ease;
}
.dc-card:hover .dc-card-body h3{color:var(--accent-ink);}
.dc-card-body p{color:var(--text-muted); font-weight:300; font-size:0.97rem; margin-bottom:14px; max-width:44ch;}
.dc-grid-related .dc-card-body h3{font-size:1.35rem;}

/* ---------- Mood picker ---------- */
.dc-moods{background:var(--surface-alt);}
.dc-mood-list{
  list-style:none; display:flex; flex-wrap:wrap; justify-content:center;
  gap:14px; max-width:860px; margin:0 auto;
}
.dc-mood-list a{
  display:inline-block;
  font-family:var(--serif); font-size:1.28rem; font-style:italic;
  color:var(--primary-deep);
  padding:14px 28px; border-radius:100px;
  border:1px solid rgba(var(--primary-rgb),0.18);
  background:var(--surface);
  transition:background 0.3s ease, color 0.3s ease, border-color 0.3s ease, transform 0.3s ease;
}
.dc-mood-list a:hover{
  background:var(--primary); border-color:var(--primary);
  color:var(--surface-alt); transform:translateY(-2px);
}
@media (max-width:720px){
  .dc-mood-list{gap:10px;}
  .dc-mood-list a{font-size:1.1rem; padding:11px 20px;}
}

/* ---------- Collection detail ---------- */
.dc-meta-line{
  margin-top:26px;
  font-family:var(--sans); font-size:0.76rem; letter-spacing:0.16em;
  text-transform:uppercase; font-weight:500;
  color:rgba(var(--surface-rgb),0.72);
}

.dc-intro{background:var(--surface-alt);}
.dc-intro-inner{max-width:760px; margin:0 auto;}
.dc-intro-lead{
  font-family:var(--serif); font-size:1.55rem; font-style:italic;
  line-height:1.5; color:var(--primary-deep); margin-bottom:24px;
}
.dc-intro-inner p{color:var(--text-muted); font-size:1.05rem; font-weight:300;}
@media (max-width:720px){.dc-intro-lead{font-size:1.28rem;}}

.dc-highlights{background:var(--surface);}
.dc-highlight-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:30px;}
@media (max-width:900px){.dc-highlight-grid{grid-template-columns:repeat(2,1fr); gap:24px;}}
@media (max-width:600px){.dc-highlight-grid{grid-template-columns:1fr;}}
.dc-highlight-media{
  display:block; overflow:hidden; border-radius:4px;
  aspect-ratio:3/2; margin-bottom:16px;
}
.dc-highlight-media img{width:100%; height:100%; object-fit:cover; transition:transform 0.7s ease;}
.dc-highlight:hover .dc-highlight-media img{transform:scale(1.05);}
.dc-highlight h3{font-size:1.2rem; color:var(--primary-deep); margin-bottom:8px;}
.dc-highlight p{color:var(--text-muted); font-size:0.93rem; font-weight:300;}
/* Text-only highlights sit as quiet editorial notes rather than empty cards. */
.dc-highlight.is-text{
  border-left:2px solid rgba(var(--accent-rgb),0.45);
  padding:4px 0 4px 20px; align-self:start;
}

.dc-moments{background:var(--primary-deep);}
.dc-moments-inner{max-width:780px;}
.dc-moments .section-head h2{color:var(--surface-alt);}
.dc-moments .section-head p{color:rgba(var(--surface-rgb),0.72);}
.dc-moments .timeline-step:not(:last-child)::before{background:rgba(var(--surface-rgb),0.25);}
.dc-moments .timeline-marker{background:var(--accent-ink); color:#fff;}
.dc-moments .timeline-step h3{color:var(--surface-alt);}
.dc-moments .timeline-step p{color:rgba(var(--surface-rgb),0.75);}

.dc-destinations{background:var(--surface);}
.dc-place-list{list-style:none; display:flex; flex-wrap:wrap; gap:12px;}
.dc-place-list li{display:block;}
.dc-place-list a, .dc-place-list span{
  display:inline-block; font-family:var(--sans); font-size:0.9rem; font-weight:500;
  padding:12px 22px; border-radius:3px;
  border:1px solid rgba(var(--primary-rgb),0.18);
  transition:background 0.3s ease, color 0.3s ease, border-color 0.3s ease;
}
.dc-place-list a{color:var(--primary); background:var(--surface-alt);}
.dc-place-list a:hover{background:var(--primary); border-color:var(--primary); color:var(--surface-alt);}
/* No destination page published yet — shown, but deliberately not a link. */
.dc-place-list span{color:var(--text-muted); background:transparent; border-style:dashed;}

.dc-experiences{background:var(--surface-alt);}
.dc-exp-list{list-style:none; display:flex; flex-wrap:wrap; gap:14px;}
.dc-exp-list a{
  display:inline-block; font-family:var(--sans); font-size:0.88rem; font-weight:600;
  color:var(--surface-alt); background:var(--accent-ink);
  padding:13px 24px; border-radius:3px;
  transition:background 0.3s ease, transform 0.2s ease;
}
.dc-exp-list a::after{content:' \2192';}
.dc-exp-list a:hover{background:var(--accent); transform:translateY(-2px);}

.dc-practical{background:var(--surface);}
.dc-practical-grid{display:grid; grid-template-columns:1.25fr 1fr; gap:70px; align-items:start;}
@media (max-width:900px){.dc-practical-grid{grid-template-columns:1fr; gap:44px;}}
.dc-season{
  font-family:var(--serif); font-size:1.4rem; font-style:italic;
  color:var(--primary-deep); line-height:1.5; margin-bottom:18px;
}
.dc-season-alt{color:var(--text-muted); font-size:0.97rem; font-weight:300;}
.dc-season-alt strong{color:var(--secondary-ink); font-weight:600;}
.dc-tags{list-style:none; display:flex; flex-wrap:wrap; gap:10px;}
.dc-tags li{
  font-family:var(--sans); font-size:0.8rem; font-weight:500; letter-spacing:0.02em;
  color:var(--text); background:rgba(var(--secondary-rgb),0.1);
  border:1px solid rgba(var(--secondary-rgb),0.28);
  padding:8px 16px; border-radius:100px;
}

.dc-related{background:var(--surface-alt);}

/* ---------- Shortlist handoff on the Start Planning form ---------- */
.xp-handoff{
  background:rgba(var(--secondary-rgb),0.08);
  border-left:3px solid var(--secondary-ink);
  border-radius:2px; padding:16px 20px; margin-bottom:26px;
}
.xp-handoff p{font-size:0.92rem; margin:0 0 6px;}
.xp-handoff .xp-journey-clear{color:var(--text-muted); margin-top:0;}
.xp-handoff .xp-journey-clear:hover{color:var(--accent-ink);}