/* =========================================================
   DIANA RETREATS — Marbella
   Design system + styles
   ========================================================= */

/* ---------- Design tokens ---------- */
:root{
  /* Brand palette */
  --cream:        #FBF3E6;
  --cream-soft:   #F4E9D8;
  --cream-deep:   #EADFC8;
  --ink:          #171310;
  --ink-soft:     #241E19;
  --pink:         #FF2E74;
  --pink-deep:    #C71856;
  --pink-soft:    #FFD3E2;
  --green:        #CBDB3A;
  --green-deep:   #9AAE1E;
  --sun:          #F4B942;
  --white:        #FFFFFF;
  --gold:         #C9A96E;
  --gold-bright:  #E9CB8E;
  --gold-deep:    #8A6F3F;

  /* Semantic */
  --bg:           var(--cream);
  --bg-alt:       var(--cream-soft);
  --text:         var(--ink);
  --text-soft:    #5C5248;
  --text-inverse: var(--cream);

  /* Type */
  --font-display: Didot, "Big Caslon", Georgia, "Times New Roman", serif;
  --font-body: -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;

  /* Fluid type scale */
  --fs-hero: clamp(2.75rem, 8vw, 7rem);
  --fs-h1: clamp(2.4rem, 5.5vw, 4.4rem);
  --fs-h2: clamp(1.9rem, 4vw, 3rem);
  --fs-h3: clamp(1.3rem, 2.4vw, 1.8rem);
  --fs-lead: clamp(1.05rem, 1.6vw, 1.35rem);
  --fs-body: 1rem;
  --fs-small: 0.85rem;
  --fs-eyebrow: 0.8rem;

  /* Spacing */
  --space-xs: 0.5rem;
  --space-sm: 1rem;
  --space-md: 2rem;
  --space-lg: 4rem;
  --space-xl: 7rem;
  --section-pad: clamp(2.75rem, 6vw, 5rem);

  /* Misc */
  --radius: 4px;
  --radius-lg: 18px;
  --ease: cubic-bezier(.22,.61,.36,1);
  --nav-h: 84px;
  --max-w: 1320px;
}

/* ---------- Reset ---------- */
*, *::before, *::after{ box-sizing: border-box; }
html{
  scroll-behavior: smooth;
  -webkit-text-size-adjust: 100%;
}
html, body{ margin:0; padding:0; }
body{
  background: var(--bg);
  color: var(--text);
  font-family: var(--font-body);
  font-size: var(--fs-body);
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}
img{ max-width:100%; display:block; }
ul{ list-style:none; margin:0; padding:0; }
a{ color:inherit; text-decoration:none; }
button{ font:inherit; color:inherit; background:none; border:none; cursor:pointer; }
input, select, textarea{ font:inherit; color:inherit; }
h1,h2,h3,h4,p,figure{ margin:0; }

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

.skip-link{
  position:fixed;
  top:-60px; left:1rem;
  background:var(--pink);
  color:var(--white);
  padding:0.75rem 1.25rem;
  border-radius:var(--radius);
  z-index:1000;
  transition:top .25s var(--ease);
  font-weight:600;
}
.skip-link:focus{ top:1rem; }

body.no-scroll{ overflow:hidden; height:100%; }

/* ---------- Layout helpers ---------- */
.wrap{
  max-width: var(--max-w);
  margin-inline: auto;
  padding-inline: clamp(1.25rem, 4vw, 3rem);
}
.section{ padding-block: var(--section-pad); position:relative; }
.section--dark{ background: var(--ink); color: var(--text-inverse); }
.section--alt{ background: var(--bg-alt); }

@media (max-width: 640px){
  :root{ --section-pad: clamp(2.25rem, 10vw, 3rem); }
}

.section-head{
  max-width: 720px;
  margin-bottom: clamp(1.75rem, 3.5vw, 3rem);
}
.section-head--center{ margin-inline:auto; text-align:center; }

.eyebrow{
  display:inline-flex;
  align-items:center;
  gap:0.6em;
  font-family: var(--font-body);
  font-size: var(--fs-eyebrow);
  font-weight:700;
  letter-spacing:0.22em;
  text-transform:uppercase;
  color: var(--pink);
  margin-bottom: 1rem;
}
.eyebrow::before{
  content:"";
  width:28px; height:2px;
  background: var(--pink);
  display:inline-block;
}
.section--dark .eyebrow{ color: var(--green); }
.section--dark .eyebrow::before{ background: var(--green); }

.section-title{
  font-family: var(--font-display);
  font-style: italic;
  font-weight:400;
  font-size: var(--fs-h2);
  line-height:1.08;
  letter-spacing:-0.01em;
}
.section-lead{
  margin-top:1.1rem;
  font-size: var(--fs-lead);
  color: var(--text-soft);
  max-width:52ch;
}
.section--dark .section-lead{ color:#C9C1B6; }

/* ---------- Buttons ---------- */
.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:0.6em;
  padding: 1.05em 2.1em;
  border-radius: 999px;
  font-size: var(--fs-small);
  font-weight:700;
  letter-spacing:0.14em;
  text-transform:uppercase;
  white-space:nowrap;
  transition: transform .35s var(--ease), box-shadow .35s var(--ease), background-color .35s var(--ease), color .35s var(--ease);
  will-change: transform;
}
.btn:active{ transform: translateY(1px) scale(.99); }

.btn--primary{
  background: var(--pink);
  color: var(--white);
  box-shadow: 0 10px 24px -8px rgba(255,46,116,.55);
}
.btn--primary:hover{
  background: var(--pink-deep);
  box-shadow: 0 14px 30px -8px rgba(255,46,116,.65);
  transform: translateY(-2px);
}

.btn--ghost{
  background: transparent;
  color: currentColor;
  border: 1.5px solid currentColor;
}
.btn--ghost:hover{
  background: rgba(255,255,255,.12);
  transform: translateY(-2px);
}

.btn--dark{
  background: var(--ink);
  color: var(--cream);
}
.btn--dark:hover{
  background: var(--ink-soft);
  transform: translateY(-2px);
}

.btn--block{ width:100%; }
.btn--lg{ padding: 1.2em 2.6em; font-size: 0.9rem; }

/* ---------- Reveal animation ---------- */
.reveal{
  opacity:0;
  transform: translateY(28px);
  transition: opacity .9s var(--ease), transform .9s var(--ease);
}
.reveal.is-visible{ opacity:1; transform:none; }
.reveal-group > *{ transition-delay: calc(var(--i, 0) * 90ms); }

@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior:auto; }
  .reveal{ opacity:1; transform:none; transition:none; }
  *{ animation-duration:.001ms !important; transition-duration:.001ms !important; }
}

/* =========================================================
   NAVIGATION
   ========================================================= */
.nav{
  position: fixed;
  top:0; left:0; right:0;
  z-index: 900;
  height: var(--nav-h);
  display:flex;
  align-items:center;
  transition: background-color .4s var(--ease), box-shadow .4s var(--ease), height .4s var(--ease);
}
.nav__inner{
  width:100%;
  max-width: var(--max-w);
  margin-inline:auto;
  padding-inline: clamp(1.25rem, 4vw, 3rem);
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 1.5rem;
}
.nav__wordmark{
  font-family: var(--font-display);
  font-style: italic;
  font-size: clamp(1.15rem, 2vw, 1.5rem);
  letter-spacing: 0.03em;
  color: var(--pink);
  text-shadow: 0 0 10px rgba(255,46,116,0.38), 0 0 2px rgba(255,46,116,0.28);
  transition: color .4s var(--ease);
}
.nav__wordmark strong{ font-weight:400; }

.nav__links{
  display:flex;
  align-items:center;
  gap: clamp(0.5rem, 1vw, 0.75rem);
}
.nav__link{
  font-size: 0.72rem;
  font-weight:700;
  letter-spacing:0.1em;
  text-transform:uppercase;
  color: var(--gold-bright);
  position:relative;
  padding: 0.6em 1.15em;
  border-radius:999px;
  border: 1px solid rgba(201,169,110,.4);
  background: rgba(15,12,10,.35);
  backdrop-filter: blur(10px) saturate(140%);
  -webkit-backdrop-filter: blur(10px) saturate(140%);
  box-shadow: 0 1px 0 rgba(255,255,255,.05) inset;
  transition: color .3s var(--ease), border-color .3s var(--ease), background .3s var(--ease), transform .3s var(--ease), box-shadow .3s var(--ease);
}
.nav__link:hover{
  color: var(--pink);
  border-color: rgba(255,46,116,.6);
  background: rgba(255,46,116,.08);
  transform: translateY(-2px);
  box-shadow: 0 1px 0 rgba(255,255,255,.08) inset, 0 10px 24px -10px rgba(255,46,116,.4);
}

.nav__cta{
  padding: 0.85em 1.7em;
  font-size:0.74rem;
}

.nav__toggle{
  display:none;
  position:relative;
  width:44px; height:44px;
  border-radius:50%;
}
.nav__toggle span{
  position:absolute;
  left:50%;
  width:22px; height:2px;
  background: var(--cream);
  transition: transform .35s var(--ease), opacity .35s var(--ease), background-color .35s var(--ease), top .35s var(--ease);
  transform: translateX(-50%);
}
.nav__toggle span:nth-child(1){ top:16px; }
.nav__toggle span:nth-child(2){ top:21px; }
.nav__toggle span:nth-child(3){ top:26px; }

.nav.menu-open .nav__toggle span:nth-child(1){ top:21px; transform: translateX(-50%) rotate(45deg); }
.nav.menu-open .nav__toggle span:nth-child(2){ opacity:0; }
.nav.menu-open .nav__toggle span:nth-child(3){ top:21px; transform: translateX(-50%) rotate(-45deg); }

/* Scrolled state */
.nav.is-scrolled{
  height: 68px;
  background: rgba(23,19,16,0.92);
  backdrop-filter: blur(10px) saturate(140%);
  box-shadow: 0 8px 30px -12px rgba(0,0,0,.4);
}

/* Menu open state (mobile) */
.nav.menu-open{ background: var(--ink); }

@media (max-width: 980px){
  .nav__links{ display:none; }
  .nav__cta.nav__cta--desktop{ display:none; }
  .nav__toggle{ display:flex; }
}

/* ---------- Mobile menu overlay ---------- */
.mobile-menu{
  position:fixed;
  inset:0;
  z-index:850;
  background: var(--ink);
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap: 2.1rem;
  padding: var(--nav-h) 1.5rem 3rem;
  transform: translateY(-100%);
  opacity:0;
  transition: transform .5s var(--ease), opacity .4s var(--ease);
  visibility:hidden;
}
.mobile-menu.is-open{
  transform: translateY(0);
  opacity:1;
  visibility:visible;
}
.mobile-menu__link{
  font-family: var(--font-display);
  font-style: italic;
  font-size: clamp(1.8rem, 8vw, 2.6rem);
  color: var(--cream);
  opacity:0;
  transform: translateY(16px);
  transition: opacity .5s var(--ease), transform .5s var(--ease);
}
.mobile-menu.is-open .mobile-menu__link{ opacity:1; transform:none; }
.mobile-menu__link:nth-child(1){ transition-delay:.08s; }
.mobile-menu__link:nth-child(2){ transition-delay:.14s; }
.mobile-menu__link:nth-child(3){ transition-delay:.2s; }
.mobile-menu__link:nth-child(4){ transition-delay:.26s; }
.mobile-menu__link:nth-child(5){ transition-delay:.32s; }
.mobile-menu__cta{ margin-top:1rem; opacity:0; transform:translateY(16px); transition: opacity .5s var(--ease), transform .5s var(--ease); transition-delay:.4s; }
.mobile-menu.is-open .mobile-menu__cta{ opacity:1; transform:none; }

.mobile-menu__social{
  position:absolute;
  bottom: 2rem;
  font-size: 0.78rem;
  letter-spacing:0.12em;
  text-transform:uppercase;
  color: var(--cream-deep);
}

/* =========================================================
   HERO
   ========================================================= */
.hero{
  position:relative;
  min-height: 100svh;
  display:flex;
  align-items:flex-end;
  overflow:hidden;
  background: var(--ink);
}
.hero__media{
  position:absolute;
  inset:0;
  z-index:0;
}
.hero__media img{
  width:100%; height:100%;
  object-fit:cover;
  object-position: 62% 18%;
}
.hero__scrim{
  position:absolute; inset:0;
  background:
    radial-gradient(ellipse 900px 600px at 8% 0%, rgba(255,46,116,.16), transparent 55%),
    radial-gradient(ellipse 800px 600px at 100% 100%, rgba(201,169,110,.14), transparent 55%),
    linear-gradient(180deg, rgba(15,12,10,.55) 0%, rgba(15,12,10,.15) 32%, rgba(15,12,10,.35) 62%, rgba(15,12,10,.92) 100%),
    linear-gradient(90deg, rgba(15,12,10,.78) 0%, rgba(15,12,10,.15) 55%);
}
.hero__content{
  position:relative;
  z-index:1;
  width:100%;
  min-width:0;
  padding: calc(var(--nav-h) + 2rem) clamp(1.25rem, 4vw, 3rem) clamp(3rem, 7vw, 5.5rem);
  max-width: var(--max-w);
  margin-inline:auto;
  color: var(--cream);
}
.hero__eyebrow{
  display:flex;
  flex-wrap:wrap;
  gap: 0.9rem 1.4rem;
  font-size: var(--fs-eyebrow);
  font-weight:700;
  letter-spacing:0.24em;
  text-transform:uppercase;
  margin-bottom: 1.6rem;
}
.hero__eyebrow span{
  display:inline-flex;
  align-items:center;
  gap:0.6rem;
  padding: 0.55em 0.95em;
  background: rgba(15,12,10,0.42);
  backdrop-filter: blur(10px) saturate(140%);
  -webkit-backdrop-filter: blur(10px) saturate(140%);
  border: 1px solid rgba(212,175,55,0.6);
  border-radius: 999px;
  box-shadow: 0 0 22px -10px rgba(201,169,110,.55);
}
.hero__eyebrow span::before{
  content:"";
  width:6px; height:6px;
  flex-shrink:0;
  border-radius:50%;
  background: var(--pink);
}
.hero__headline{
  font-family: var(--font-display);
  font-style: italic;
  font-weight:400;
  font-size: var(--fs-hero);
  line-height:1.04;
  letter-spacing:-0.01em;
  max-width: 17.5ch;
  margin-top: clamp(1.5rem, 3vw, 2.25rem);
}
.hero__headline em{
  font-style: italic;
  color: var(--pink);
}
.hero__sub{
  position:absolute;
  right:0;
  top:48%;
  transform: translateY(-50%);
  text-align:right;
  font-size: clamp(0.82rem, 1.05vw, 0.98rem);
  line-height:1.6;
  max-width: 30ch;
  color: #EFE6D8;
  text-shadow: 0 2px 16px rgba(0,0,0,.5);
}
.hero__actions{
  margin-top: 2.6rem;
  display:flex;
  flex-wrap:wrap;
  gap: 1rem;
}
.hero__scrolldown{
  position:absolute;
  right: clamp(1.25rem, 4vw, 3rem);
  bottom: clamp(1.5rem, 3vw, 2.5rem);
  z-index:1;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:0.6rem;
  color: var(--cream);
  font-size:0.7rem;
  letter-spacing:0.2em;
  text-transform:uppercase;
  opacity:.85;
}
.hero__scrolldown .line{
  width:1px; height:46px;
  background: linear-gradient(var(--pink), transparent);
  animation: scrolldown 2.2s var(--ease) infinite;
}
@keyframes scrolldown{
  0%{ transform:scaleY(0); transform-origin:top; }
  50%{ transform:scaleY(1); transform-origin:top; }
  50.01%{ transform-origin:bottom; }
  100%{ transform:scaleY(0); transform-origin:bottom; }
}
@media (max-width:768px){
  .hero__media img{ object-position: 50% 10%; }
  .hero__scrolldown{ display:none; }
  .hero__content{
    display:flex;
    flex-direction:column;
  }
  .hero__headline{ order:1; margin-top:0; }
  .hero__sub{
    order:2;
    position:static;
    transform:none;
    text-align:left;
    max-width:none;
    margin-top:1.1rem;
  }
  .hero__eyebrow{
    order:3;
    gap: 0.5rem 0.6rem;
    margin-bottom:0;
    margin-top:1.5rem;
  }
  .hero__eyebrow span{
    padding: 0.4em 0.75em;
    font-size:0.62rem;
    letter-spacing:0.15em;
    gap:0.4rem;
  }
  .hero__eyebrow span::before{ width:4px; height:4px; }
  .hero__actions{ order:4; margin-top:1.5rem; }
}

/* =========================================================
   MARQUEE STRIP
   ========================================================= */
.marquee{
  background: var(--pink);
  color: var(--white);
  overflow:hidden;
  white-space:nowrap;
  padding-block: 0.85rem;
}
.marquee__track{
  display:inline-flex;
  gap:3rem;
  animation: marquee 32s linear infinite;
  will-change: transform;
}
.marquee__track span{
  font-family: var(--font-display);
  font-style: italic;
  font-size: 1.1rem;
  letter-spacing:0.02em;
  display:inline-flex;
  align-items:center;
  gap:3rem;
}
.marquee__track span::after{
  content:"✦";
  font-style:normal;
  opacity:.8;
}
@keyframes marquee{
  from{ transform:translateX(0); }
  to{ transform:translateX(-50%); }
}

/* =========================================================
   EXPERIENCE / PILLARS
   ========================================================= */
#experience{
  background:
    radial-gradient(ellipse 850px 520px at 104% -10%, rgba(255,46,116,.2), transparent 60%),
    radial-gradient(ellipse 750px 520px at -6% 106%, rgba(201,169,110,.2), transparent 60%),
    var(--ink);
  overflow:hidden;
}
#experience::before,
#experience::after{
  content:"";
  position:absolute;
  width:140%; height:62%;
  pointer-events:none;
  z-index:0;
  filter: blur(72px);
}
#experience::before{
  top:-24%; right:-36%;
  background: linear-gradient(-120deg, rgba(255,46,116,.55) 0%, rgba(255,46,116,.22) 22%, transparent 52%);
  transform: rotate(20deg);
}
#experience::after{
  bottom:-26%; left:-36%;
  background: linear-gradient(60deg, rgba(201,169,110,.4) 0%, rgba(201,169,110,.22) 26%, transparent 56%);
  transform: rotate(20deg);
}
#experience .wrap{ position:relative; z-index:1; }
#experience .eyebrow{ color: var(--gold-bright); }
#experience .eyebrow::before{ background: var(--gold-bright); }

.pillars-carousel{
  position:relative;
  overflow:hidden;
  touch-action: pan-y;
  padding-block: 1rem;
  -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 14%, #000 86%, transparent 100%);
  mask-image: linear-gradient(90deg, transparent 0%, #000 14%, #000 86%, transparent 100%);
}
.pillars-track{
  position:relative;
  height: clamp(340px, 42vw, 480px);
}
.pillar{
  position:relative;
  border-radius: 22px;
  overflow:hidden;
  min-height: 320px;
  display:flex;
  align-items:flex-end;
  padding: 2rem;
  isolation:isolate;
  border: 1px solid rgba(201,169,110,.4);
  box-shadow: 0 1px 0 rgba(255,255,255,.07) inset;
}
@keyframes pillarKenBurns{
  0%   { transform: scale(1) translate(0, 0); }
  50%  { transform: scale(1.07) translate(-1.2%, -1%); }
  100% { transform: scale(1) translate(0, 0); }
}
.pillar__title{
  font-family: var(--font-display);
  font-style:italic;
  font-size: clamp(1.5rem, 2.6vw, 2.1rem);
  line-height:1.05;
  margin-bottom:0.55rem;
  position:relative; z-index:2;
}
.pillar__text{
  font-size:0.95rem;
  max-width:32ch;
  position:relative; z-index:2;
}

.pillar--photo{ color:var(--cream); grid-column: span 7; min-height: 260px; }
.pillar--photo img{
  position:absolute; inset:0;
  width:100%; height:100%;
  object-fit:cover;
  z-index:0;
  animation: pillarKenBurns 13s ease-in-out infinite;
}
.pillar--photo::before{
  content:"";
  position:absolute; inset:0;
  background:
    linear-gradient(0deg, rgba(255,46,116,.1), transparent 30%),
    linear-gradient(180deg, rgba(15,12,10,0) 35%, rgba(15,12,10,.85) 100%);
  z-index:1;
}
.pillar__text{ color:#F1E9DC; }

.pillar--sun{ grid-column: span 5; min-height:260px; }
.pillar--vibes{ grid-column: span 5; min-height:260px; color: var(--cream); }
.pillar--people{ grid-column: span 7; min-height:260px; color: var(--cream); }

.pillar--vibes img,
.pillar--people img{
  position:absolute; inset:0;
  width:100%; height:100%;
  object-fit:cover;
  z-index:0;
  animation: pillarKenBurns 13s ease-in-out infinite;
}
.pillar--vibes::before,
.pillar--people::before{
  content:"";
  position:absolute; inset:0;
  background:
    linear-gradient(0deg, rgba(255,46,116,.1), transparent 30%),
    linear-gradient(180deg, rgba(15,12,10,0) 35%, rgba(15,12,10,.85) 100%);
  z-index:1;
}

.pillar-slide{
  position:absolute;
  top:0; left:50%;
  width: min(600px, 62vw);
  height:100%;
  margin:0;
  box-shadow:
    0 34px 70px -28px rgba(0,0,0,.65),
    0 0 60px -20px rgba(255,46,116,.28);
  transition: transform 1s cubic-bezier(.22,.61,.36,1), opacity 1s ease;
  will-change: transform, opacity;
}
.pillar-slide:nth-child(2) img{ animation-duration: 15s; animation-delay: -3s; }
.pillar-slide:nth-child(3) img{ animation-duration: 11s; animation-delay: -6s; }
.pillar-slide:nth-child(4) img{ animation-duration: 14s; animation-delay: -1s; }
.pillar-slide:nth-child(5) img{ animation-duration: 12s; animation-delay: -8s; }
.pillar-slide.is-center{
  transform: translate(-50%, 0) scale(1);
  opacity:1;
  z-index:5;
}
.pillar-slide.is-left1{
  transform: translate(calc(-50% - 58%), 0) scale(0.82);
  opacity:.5;
  z-index:3;
}
.pillar-slide.is-right1{
  transform: translate(calc(-50% + 58%), 0) scale(0.82);
  opacity:.5;
  z-index:3;
}
.pillar-slide.is-farleft{
  transform: translate(calc(-50% - 105%), 0) scale(0.7);
  opacity:0;
  z-index:1;
  pointer-events:none;
}
.pillar-slide.is-farright{
  transform: translate(calc(-50% + 105%), 0) scale(0.7);
  opacity:0;
  z-index:1;
  pointer-events:none;
}

.pillars-nav{
  display:flex;
  align-items:center;
  justify-content:center;
  gap: clamp(1rem, 3vw, 1.75rem);
  margin-top: clamp(1.75rem, 4vw, 2.5rem);
}
.pillars-arrow{
  flex-shrink:0;
  width:44px; height:44px;
  border-radius:50%;
  border: 1px solid rgba(201,169,110,.5);
  color: var(--gold-bright);
  background: rgba(255,255,255,.03);
  display:flex; align-items:center; justify-content:center;
  transition: border-color .3s var(--ease), color .3s var(--ease), transform .3s var(--ease), background .3s var(--ease);
}
.pillars-arrow svg{ width:19px; height:19px; pointer-events:none; }
.pillars-arrow--prev svg{ transform: scaleX(-1); }
.pillars-arrow:hover{
  border-color: var(--pink);
  color: var(--pink);
  background: rgba(255,46,116,.08);
  transform: translateY(-2px);
}
.pillars-arrow:active{ transform: translateY(0) scale(.96); }

.pillars-dots{ display:flex; align-items:center; gap:0.65rem; }
.pillars-dot{
  width:22px; height:22px;
  display:flex; align-items:center; justify-content:center;
  opacity:.55;
  transition: opacity .3s var(--ease);
}
.pillars-dot svg{
  width:13px; height:13px;
  transition: width .3s var(--ease), height .3s var(--ease), filter .3s var(--ease);
}
.pillars-dot svg circle{
  fill: rgba(201,169,110,.4);
  stroke: rgba(201,169,110,.7);
  transition: fill .3s var(--ease), stroke .3s var(--ease);
}
.pillars-dot:hover{ opacity:.85; }
.pillars-dot.is-active{ opacity:1; }
.pillars-dot.is-active svg{ width:17px; height:17px; filter: drop-shadow(0 0 6px rgba(255,46,116,.6)); }
.pillars-dot.is-active svg circle{ fill: var(--pink); stroke: var(--pink-deep); }

@media (max-width: 720px){
  .pillars-track{ height: clamp(300px, 78vw, 380px); }
  .pillar-slide{ width: min(320px, 76vw); }
  .pillar-slide.is-left1{ transform: translate(calc(-50% - 52%), 0) scale(0.8); }
  .pillar-slide.is-right1{ transform: translate(calc(-50% + 52%), 0) scale(0.8); }
  .pillar-slide.is-farleft{ transform: translate(calc(-50% - 95%), 0) scale(0.7); }
  .pillar-slide.is-farright{ transform: translate(calc(-50% + 95%), 0) scale(0.7); }
}

/* =========================================================
   CINEMATIC BAND
   ========================================================= */
.band{
  position:relative;
  min-height: 62vh;
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  overflow:hidden;
  background: var(--ink);
}
.band__media{ position:absolute; inset:0; }
.band__media img{
  width:100%; height:100%;
  object-fit:cover;
  object-position:center 65%;
}
.band__media::after{
  content:"";
  position:absolute; inset:0;
  background: linear-gradient(180deg, rgba(15,12,10,.55), rgba(15,12,10,.72));
}
.band__content{
  position:relative; z-index:1;
  color: var(--cream);
  padding-inline: 1.5rem;
  max-width:900px;
}
.band__quote{
  font-family: var(--font-display);
  font-style:italic;
  font-size: clamp(1.7rem, 4.4vw, 3.2rem);
  line-height:1.18;
}
.band__quote em{ color: var(--sun); font-style:italic; }
.band__cta{ margin-top:2.2rem; }

/* =========================================================
   ABOUT DIANA
   ========================================================= */
#about{
  background:
    radial-gradient(ellipse 850px 520px at 96% -8%, rgba(201,169,110,.22), transparent 60%),
    radial-gradient(ellipse 750px 520px at -6% 108%, rgba(255,46,116,.18), transparent 60%),
    var(--ink);
  overflow:hidden;
}
#about::before,
#about::after{
  content:"";
  position:absolute;
  width:140%; height:62%;
  pointer-events:none;
  z-index:0;
  filter: blur(72px);
}
#about::before{
  top:-24%; right:-36%;
  background: linear-gradient(-120deg, rgba(201,169,110,.5) 0%, rgba(201,169,110,.22) 22%, transparent 52%);
  transform: rotate(20deg);
}
#about::after{
  bottom:-26%; left:-36%;
  background: linear-gradient(60deg, rgba(255,46,116,.42) 0%, rgba(255,46,116,.2) 26%, transparent 56%);
  transform: rotate(20deg);
}
#about .wrap{ position:relative; z-index:1; }
#about .eyebrow{ color: var(--gold-bright); }
#about .eyebrow::before{ background: var(--gold-bright); }

.about{
  display:grid;
  grid-template-columns: 0.85fr 1.15fr;
  gap: clamp(2rem, 6vw, 5rem);
  align-items:center;
}
.about__media{
  position:relative;
  isolation:isolate;
  border-radius: 24px;
  overflow:visible;
  aspect-ratio: 4/5;
  box-shadow:
    0 50px 90px -30px rgba(0,0,0,.75),
    inset 0 0 0 1px rgba(233,203,142,.65),
    inset 0 0 0 2px rgba(255,255,255,.1),
    inset 0 0 46px -20px rgba(255,197,150,.55),
    inset 0 0 70px -22px rgba(255,46,116,.3);
}
.about__media::before{
  content:"";
  position:absolute;
  inset: -16px;
  z-index:-1;
  border-radius: 34px;
  background:
    radial-gradient(120% 140% at 12% 8%, rgba(233,203,142,.55), transparent 55%),
    radial-gradient(120% 140% at 92% 22%, rgba(255,197,150,.45), transparent 58%),
    radial-gradient(130% 150% at 55% 102%, rgba(255,46,116,.4), transparent 62%);
  filter: blur(24px);
  opacity:.85;
  pointer-events:none;
}
.about__media img{
  width:100%; height:100%;
  border-radius: 24px;
  object-fit:cover;
  object-position: 50% 18%;
  display:block;
  transform: scale(1.03);
  filter: saturate(1.08) contrast(1.04);
  transition: transform 1.4s var(--ease);
}
.about__media:hover img{ transform: scale(1.09); }
.about__media::after{
  content:"";
  position:absolute; inset:0;
  border-radius: 24px;
  background:
    linear-gradient(0deg, rgba(10,7,6,.78) 0%, rgba(10,7,6,0) 40%),
    linear-gradient(135deg, rgba(255,255,255,.18) 0%, transparent 24%, transparent 76%, rgba(255,255,255,.08) 100%),
    linear-gradient(205deg, rgba(255,46,116,.16), transparent 45%),
    linear-gradient(20deg, rgba(233,203,142,.18), transparent 42%);
  pointer-events:none;
}
.about__badge{
  position:absolute;
  left:1.3rem; bottom:1.3rem;
  z-index:1;
  display:inline-flex;
  flex-direction:column;
  gap:0.35rem;
  background: linear-gradient(160deg, rgba(23,19,16,.6), rgba(23,19,16,.38));
  backdrop-filter: blur(14px) saturate(160%);
  -webkit-backdrop-filter: blur(14px) saturate(160%);
  border: 1px solid rgba(201,169,110,.55);
  color: var(--cream);
  padding: 0.85rem 1.1rem;
  border-radius: 12px;
  max-width: 200px;
  box-shadow:
    0 1px 0 rgba(255,255,255,.12) inset,
    0 24px 50px -20px rgba(0,0,0,.7),
    0 0 30px -12px rgba(201,169,110,.4);
}
.about__badge strong{
  display:block;
  font-family: var(--font-display);
  font-style:italic;
  font-size:0.95rem;
  color: var(--cream);
}
.about__badge span{
  display:flex;
  align-items:center;
  gap:0.5em;
  font-size:0.62rem;
  letter-spacing:0.1em;
  text-transform:uppercase;
  color: var(--gold-bright);
  margin-top:0.2rem;
  font-weight:700;
}
.about__badge span::before{
  content:"";
  width:14px; height:1px;
  background: var(--gold-bright);
  display:inline-block;
  flex:none;
}

.about__quote{
  position:relative;
  font-family: var(--font-display);
  font-style:italic;
  font-size: clamp(1.4rem, 2.6vw, 2rem);
  line-height:1.36;
  color: var(--cream);
  margin: 1.6rem 0 2.1rem;
  padding-left: 1.5rem;
  border-left: 2px solid rgba(201,169,110,.5);
}
.about__quote::before{
  content:"“";
  position:absolute;
  left:0.1rem; top:-0.5rem;
  font-size:2.6rem;
  line-height:1;
  color: var(--pink);
  opacity:.9;
}
.about__quote::after{ content:"”"; color:var(--pink); opacity:.9; }

.about__name{
  font-weight:700;
  letter-spacing:0.06em;
  font-size:1rem;
  text-transform:uppercase;
  color: var(--cream);
}
.about__role{
  color:#C9C1B6;
  margin-top:0.25rem;
  font-size:0.92rem;
}
.about__stats{
  display:flex;
  gap: clamp(1.1rem, 3vw, 1.85rem);
  margin-top:2.3rem;
  padding-top:2rem;
  border-top: 1px solid rgba(201,169,110,.25);
}
.about__stat{
  flex:1 1 0;
  min-width:0;
  padding-right: clamp(1.1rem, 3vw, 1.85rem);
  border-right: 1px solid rgba(201,169,110,.22);
  opacity:0;
  transform: translateY(14px);
  transition: opacity .7s var(--ease), transform .7s var(--ease);
}
.about__stat:last-child{ padding-right:0; border-right:none; }
.about__content.is-visible .about__stat{ opacity:1; transform:none; }
.about__content.is-visible .about__stat:nth-child(2){ transition-delay:.12s; }
.about__content.is-visible .about__stat:nth-child(3){ transition-delay:.24s; }
.about__stat strong{
  display:block;
  font-family: var(--font-display);
  font-style:italic;
  font-size: clamp(1.5rem, 2.6vw, 1.9rem);
  background: linear-gradient(135deg, var(--gold-bright), var(--pink));
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
  transition: filter .4s var(--ease);
}
.about__stat:hover strong{ filter:brightness(1.25); }
.about__stat span{
  display:block;
  margin-top:0.2rem;
  font-size:0.72rem;
  letter-spacing:0.06em;
  text-transform:uppercase;
  color:#C9C1B6;
}

@media (max-width: 860px){
  .about{ grid-template-columns:1fr; }
  .about__media{
    aspect-ratio: 5/4;
    box-shadow:
      0 34px 60px -26px rgba(0,0,0,.7),
      inset 0 0 0 1px rgba(233,203,142,.6),
      inset 0 0 0 1.5px rgba(255,255,255,.08),
      inset 0 0 28px -16px rgba(255,197,150,.42),
      inset 0 0 42px -18px rgba(255,46,116,.24);
  }
  .about__media::before{
    inset: -8px;
    border-radius: 26px;
    filter: blur(14px);
    opacity:.65;
  }
}

@media (max-width: 480px){
  .about__stats{ gap:0.75rem; }
  .about__stat{ padding-right:0.75rem; }
}

/* =========================================================
   ITINERARY
   ========================================================= */
#itinerary{
  position:relative;
  background:
    radial-gradient(ellipse 1000px 600px at 10% -8%, rgba(255,46,116,.22), transparent 60%),
    radial-gradient(ellipse 1000px 650px at 100% 105%, rgba(201,169,110,.24), transparent 58%),
    var(--ink);
  overflow:hidden;
}
#itinerary::before{
  content:"";
  position:absolute;
  inset:-10%;
  z-index:0;
  pointer-events:none;
  background-image: url("images/boat.jpg");
  background-size: cover;
  background-position: center 45%;
  filter: blur(46px) saturate(1.6) brightness(0.9);
  opacity:0.22;
}
#itinerary .wrap{ position:relative; z-index:1; }
#itinerary .eyebrow{ color: var(--gold-bright); }
#itinerary .eyebrow::before{ background: var(--gold-bright); }
#itinerary .section-title{ color: var(--cream); }
#itinerary .section-head{ margin-bottom: clamp(1rem, 2vw, 1.75rem); }

.itinerary__tabs{
  display:flex;
  flex-wrap:wrap;
  gap: 1rem;
  margin-bottom: clamp(1.5rem, 3vw, 2.25rem);
  padding-top: 0.4rem;
}
.itinerary__tab{
  position:relative;
  flex: 1 1 190px;
  display:flex;
  flex-direction:row;
  align-items:center;
  gap:0.65rem;
  padding: 0.75rem 2.35rem 0.75rem 1.15rem;
  border-radius: 999px;
  background: rgba(10,8,7,.5);
  border: 1px solid rgba(201,169,110,.55);
  backdrop-filter: blur(16px) saturate(140%);
  -webkit-backdrop-filter: blur(16px) saturate(140%);
  box-shadow: 0 1px 0 rgba(255,255,255,.06) inset, 0 0 34px -6px rgba(201,169,110,.85);
  color:#D3CABC;
  font-size:0.66rem;
  font-weight:600;
  letter-spacing:0.06em;
  text-transform:uppercase;
  text-align:left;
  line-height:1.25;
  cursor:pointer;
  transition: border-color .4s var(--ease), box-shadow .4s var(--ease), transform .4s var(--ease), background .4s var(--ease), color .4s var(--ease);
}
.itinerary__tab-num{
  flex-shrink:0;
  color: var(--pink);
  font-family: var(--font-display);
  font-style:italic;
  font-size:1.5rem;
  text-transform:none;
  letter-spacing:0;
  line-height:1;
  opacity:1;
  text-shadow: 0 0 16px rgba(255,46,116,.55);
  transition: color .4s var(--ease), opacity .4s var(--ease), text-shadow .4s var(--ease);
}
.itinerary__tab-title{ flex:1; min-width:0; }
.itinerary__tab-icon{
  position:absolute;
  right:-4px; top:50%;
  transform: translateY(-50%);
  width:40px; height:40px;
  flex-shrink:0;
  display:flex; align-items:center; justify-content:center;
  border-radius:50%;
  background: rgba(15,12,11,.88);
  border: 1px solid rgba(201,169,110,.7);
  color: var(--gold-bright);
  box-shadow: 0 6px 16px -8px rgba(0,0,0,.75), 0 0 20px -2px rgba(201,169,110,.8);
  transition: border-color .4s var(--ease), box-shadow .4s var(--ease), color .4s var(--ease);
}
.itinerary__tab-icon svg{ width:17px; height:17px; }
.itinerary__tab:hover{
  border-color: rgba(201,169,110,.8);
  transform: translateY(-2px);
  box-shadow: 0 1px 0 rgba(255,255,255,.08) inset, 0 0 42px -4px rgba(201,169,110,1);
  color:#EDE6D9;
}
.itinerary__tab[aria-selected="true"]{
  background: linear-gradient(160deg, rgba(255,46,116,.2), rgba(201,169,110,.06) 65%);
  border-color: rgba(255,46,116,.9);
  color: var(--cream);
  transform: translateY(-2px);
  box-shadow:
    0 1px 0 rgba(255,255,255,.1) inset,
    0 0 46px -4px rgba(255,46,116,.95),
    0 0 90px -20px rgba(255,46,116,.6);
}
.itinerary__tab[aria-selected="true"] .itinerary__tab-num{
  opacity:1;
  text-shadow: 0 0 24px rgba(255,46,116,.9);
}
.itinerary__tab[aria-selected="true"] .itinerary__tab-icon{
  border-color: rgba(255,46,116,.8);
  color: var(--pink);
  box-shadow: 0 6px 16px -8px rgba(0,0,0,.75), 0 0 26px -2px rgba(255,46,116,.85);
}

.itinerary__stage{ position:relative; min-height: clamp(440px, 46vw, 520px); }

.itinerary__panel{
  position:absolute; inset:0;
  display:grid;
  grid-template-columns: 1.05fr 1fr;
  gap: clamp(1.5rem, 3vw, 2.25rem);
  align-items:stretch;
  opacity:0;
  transform: translateX(26px);
  filter: blur(8px);
  pointer-events:none;
  transition: opacity .8s var(--ease), transform .8s var(--ease), filter .8s var(--ease);
}
.itinerary__panel.is-active{
  opacity:1;
  transform: translateX(0);
  filter: blur(0);
  pointer-events:auto;
}

.itinerary__media{
  position:relative;
  border-radius: 22px;
  overflow:hidden;
  box-shadow:
    0 40px 80px -30px rgba(0,0,0,.75),
    0 0 0 1.5px rgba(201,169,110,.5),
    0 0 70px -10px rgba(255,46,116,.45),
    0 0 110px -22px rgba(201,169,110,.35);
}
.itinerary__media::after{
  content:"";
  position:absolute; inset:0;
  background:
    linear-gradient(0deg, rgba(255,46,116,.18), transparent 34%),
    linear-gradient(180deg, rgba(10,7,6,0) 44%, rgba(10,7,6,.52) 100%);
  pointer-events:none;
}
.itinerary__media img{
  position:absolute; inset:0;
  width:100%; height:100%;
  object-fit:cover;
  filter: saturate(1.45) contrast(1.16) brightness(1.04);
}
.itinerary__daytag{
  position:absolute;
  top:1.4rem; left:1.4rem;
  z-index:2;
  background: linear-gradient(160deg, rgba(255,46,116,.55), rgba(199,24,86,.4));
  backdrop-filter: blur(10px) saturate(160%);
  -webkit-backdrop-filter: blur(10px) saturate(160%);
  border: 1px solid rgba(255,211,226,.6);
  color: var(--white);
  padding:0.55rem 1.1rem;
  border-radius:999px;
  font-size:0.72rem;
  font-weight:700;
  letter-spacing:0.12em;
  text-transform:uppercase;
  box-shadow: 0 1px 0 rgba(255,255,255,.25) inset, 0 0 26px -4px rgba(255,46,116,.7);
}
.itinerary__body{
  position:relative;
  padding: clamp(1.5rem, 3vw, 2.25rem);
  display:flex;
  flex-direction:column;
  justify-content:center;
  border-radius: 22px;
  background:
    linear-gradient(165deg, rgba(255,255,255,.09), rgba(255,255,255,.02) 45%, rgba(0,0,0,.14) 100%),
    radial-gradient(ellipse 560px 340px at 88% -18%, rgba(201,169,110,.24), transparent 62%),
    radial-gradient(ellipse 500px 320px at -8% 116%, rgba(255,46,116,.16), transparent 60%),
    rgba(18,14,12,.6);
  border: 1px solid rgba(201,169,110,.55);
  backdrop-filter: blur(26px) saturate(150%);
  -webkit-backdrop-filter: blur(26px) saturate(150%);
  box-shadow:
    0 1px 0 rgba(255,255,255,.1) inset,
    0 44px 90px -30px rgba(0,0,0,.75),
    0 0 60px -16px rgba(255,46,116,.38),
    0 0 90px -22px rgba(201,169,110,.32);
}
.itinerary__title{
  position:relative;
  font-family: var(--font-display);
  font-style:italic;
  font-size: var(--fs-h3);
  color: var(--cream);
  margin-bottom:1.15rem;
  padding-bottom:0.65rem;
}
.itinerary__title::after{
  content:"";
  position:absolute;
  left:0; bottom:0;
  width:54px; height:2px;
  border-radius:2px;
  background: linear-gradient(90deg, var(--pink), rgba(255,46,116,.1));
  box-shadow: 0 0 10px -2px rgba(255,46,116,.6);
}
.itinerary__list{ display:flex; flex-direction:column; gap:0; }
.itinerary__list li{
  display:flex;
  align-items:flex-start;
  gap:0.65rem;
  font-size:0.86rem;
  line-height:1.3;
  color:#E7DFD1;
  padding-block:0.55rem;
  border-bottom: 1px solid rgba(201,169,110,.24);
}
.itinerary__list li:last-child{ border-bottom:none; padding-bottom:0; }
.itinerary__list li::before{
  content:"";
  flex-shrink:0;
  width:6px; height:6px;
  margin-top:0.42em;
  border-radius:50%;
  background: var(--pink);
  box-shadow: 0 0 0 2px rgba(201,169,110,.32), 0 0 10px -1px rgba(255,46,116,.85);
}

.itinerary__note{
  margin: clamp(1.75rem, 3.5vw, 2.5rem) 0 0;
  text-align:center;
  font-family: var(--font-display);
  font-style:italic;
  font-size: clamp(1.4rem, 2.6vw, 1.9rem);
  color: var(--pink);
  text-shadow: 0 0 26px rgba(255,46,116,.35);
}
.itinerary__note::before{
  content:"";
  display:block;
  width:46px; height:1px;
  background: linear-gradient(90deg, transparent, var(--gold-bright), transparent);
  margin: 0 auto 1.1rem;
}
.itinerary__note::after{
  content:"";
  display:block;
  width:46px; height:1px;
  background: linear-gradient(90deg, transparent, var(--gold-bright), var(--pink), transparent);
  margin: 1.1rem auto 0;
}

@media (max-width: 860px){
  .itinerary__stage{ min-height: clamp(600px, 160vw, 700px); }
  .itinerary__panel{ grid-template-columns:1fr; }
  .itinerary__media{ min-height:240px; }
  .itinerary__body{ padding: 1.25rem 1.5rem; }
}

@media (max-width: 700px){
  .itinerary__tabs{
    flex-wrap:nowrap;
    overflow-x:auto;
    scroll-snap-type:x proximity;
    -webkit-overflow-scrolling:touch;
    padding-bottom:0.3rem;
  }
  .itinerary__tab{ flex:0 0 auto; min-width:200px; scroll-snap-align:start; }
}

/* =========================================================
   WHAT'S INCLUDED
   ========================================================= */
#included{
  position:relative;
  background:
    radial-gradient(ellipse 800px 520px at -8% -12%, rgba(255,46,116,.22), transparent 60%),
    radial-gradient(ellipse 700px 480px at 50% 6%, rgba(201,169,110,.16), transparent 65%),
    radial-gradient(ellipse 800px 520px at 108% 108%, rgba(255,46,116,.2), transparent 60%),
    var(--ink);
  overflow:hidden;
}
#included::before,
#included::after{
  content:"";
  position:absolute;
  width:140%; height:62%;
  pointer-events:none;
  z-index:0;
  filter: blur(72px);
}
#included::before{
  top:-24%; left:-36%;
  background: linear-gradient(120deg, rgba(255,46,116,.6) 0%, rgba(255,46,116,.24) 22%, transparent 52%);
  transform: rotate(-20deg);
}
#included::after{
  bottom:-26%; right:-36%;
  background: linear-gradient(-60deg, rgba(255,46,116,.42) 0%, rgba(201,169,110,.24) 26%, transparent 56%);
  transform: rotate(-20deg);
}
#included .wrap{ position:relative; z-index:1; }
#included .eyebrow{ color: var(--gold-bright); justify-content:center; }
#included .eyebrow::before{ background: var(--gold-bright); }
#included .section-title em{ font-style:italic; color: var(--pink); }

.included__spark{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:0.75rem;
  width:220px;
  margin: 1.2rem auto 0;
  color: var(--gold-bright);
}
.included__spark span{
  flex:1; height:1px;
  background: linear-gradient(90deg, transparent, rgba(201,169,110,.65));
}
.included__spark span:last-child{
  background: linear-gradient(90deg, rgba(201,169,110,.65), transparent);
}
.included__spark i{ font-style:normal; font-size:0.75rem; }

/* ---------- Carousel ---------- */
.included-carousel{
  position:relative;
  margin-top: clamp(1.75rem, 3.5vw, 2.5rem);
}
.included-track{
  display:flex;
  gap: 1.25rem;
  overflow-x:auto;
  scroll-snap-type:x mandatory;
  -webkit-overflow-scrolling:touch;
  scrollbar-width:none;
  padding: 0.5rem 0.25rem 1rem;
}
.included-track::-webkit-scrollbar{ display:none; }

.included-card{
  scroll-snap-align:start;
  flex: 0 0 84%;
  position:relative;
  cursor:pointer;
  perspective: 1600px;
}
.included-card__inner{
  position:relative;
  width:100%;
  transition: transform .7s cubic-bezier(.22,.61,.36,1);
  transform-style: preserve-3d;
}
@media (hover: hover) and (pointer: fine){
  .included-card:hover .included-card__inner{ transform: rotateY(180deg); }
}
.included-card.is-flipped .included-card__inner{ transform: rotateY(180deg); }

.included-card__front,
.included-card__back{
  border-radius:20px;
  overflow:hidden;
  backface-visibility:hidden;
  -webkit-backface-visibility:hidden;
  transition: border-color .35s var(--ease), box-shadow .35s var(--ease), visibility 0s linear .35s;
}
.included-card__front{
  position:relative;
  display:flex;
  flex-direction:column;
  background:
    linear-gradient(165deg, rgba(255,255,255,.05), rgba(255,255,255,.012) 55%),
    rgba(15,12,11,.55);
  border: 1px solid rgba(201,169,110,.6);
  box-shadow:
    0 1px 0 rgba(255,255,255,.06) inset,
    0 30px 60px -28px rgba(0,0,0,.75),
    0 0 34px -8px rgba(201,169,110,.7);
}
.included-card.is-flipped .included-card__front{
  visibility:hidden;
}
@media (hover: hover) and (pointer: fine){
  .included-card:hover .included-card__front{
    visibility:hidden;
  }
}
.included-card__back{
  position:absolute; inset:0;
  transform: rotateY(180deg);
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  text-align:center;
  padding: 1.75rem 1.5rem;
  background:
    linear-gradient(165deg, rgba(255,255,255,.06), rgba(255,255,255,.015) 55%),
    rgba(10,8,7,.82);
  border: 1px solid rgba(201,169,110,.75);
  box-shadow:
    0 1px 0 rgba(255,255,255,.08) inset,
    0 30px 60px -28px rgba(0,0,0,.8),
    0 0 50px -10px rgba(255,46,116,.5),
    0 0 74px -16px rgba(201,169,110,.45);
}
.included-card:hover .included-card__front,
.included-card.is-flipped .included-card__front{
  border-color: rgba(201,169,110,.9);
}
.included-card__media{
  position:relative;
  aspect-ratio: 4/3;
  overflow:hidden;
}
.included-card__media img{
  width:100%; height:100%;
  object-fit:cover;
  transition: transform 1.1s var(--ease);
}
.included-card:hover .included-card__media img{ transform:scale(1.06); }
.included-card__media::after{
  content:"";
  position:absolute; inset:0;
  background: linear-gradient(180deg, rgba(10,7,6,0) 42%, rgba(15,12,11,.96) 100%);
}
.included-card__icon{
  position:relative;
  z-index:3;
  flex-shrink:0;
  width:52px; height:52px;
  margin: -26px auto 0;
  border-radius:50%;
  background: rgba(15,12,11,.85);
  border: 1px solid rgba(201,169,110,.85);
  display:flex; align-items:center; justify-content:center;
  color: var(--pink);
  box-shadow: 0 10px 26px -10px rgba(0,0,0,.75), 0 0 26px -4px rgba(201,169,110,.75);
}
.included-card__icon svg{ width:22px; height:22px; }
.included-card__back .included-card__icon{ margin: 0 0 1.1rem; }
.included-card__body{
  padding: 0.9rem 1.4rem 1.6rem;
  text-align:center;
  min-height:84px;
  display:flex;
  align-items:center;
  justify-content:center;
}
.included-card__body h3{
  font-family: var(--font-body);
  font-style:normal;
  font-weight:700;
  font-size:1.05rem;
  color: var(--cream);
}
.included-card__back h3{
  font-family: var(--font-body);
  font-style:normal;
  font-weight:700;
  font-size:1.1rem;
  color: var(--cream);
  margin-bottom:0.75rem;
}
.included-card__back p{
  font-size:0.9rem;
  color: var(--gold);
  line-height:1.6;
  max-width:26ch;
}
.included-card__back p:empty{ display:none; }

/* ---------- Nav ---------- */
.included-nav{
  display:flex;
  align-items:center;
  justify-content:center;
  gap: clamp(1rem, 3vw, 1.75rem);
  margin-top: clamp(1.75rem, 4vw, 2.5rem);
}
.included-arrow{
  flex-shrink:0;
  width:44px; height:44px;
  border-radius:50%;
  border: 1px solid rgba(201,169,110,.7);
  color: var(--gold-bright);
  background: rgba(255,255,255,.03);
  display:flex; align-items:center; justify-content:center;
  box-shadow: 0 0 20px -6px rgba(201,169,110,.6);
  transition: border-color .3s var(--ease), color .3s var(--ease), transform .3s var(--ease), background .3s var(--ease), box-shadow .3s var(--ease);
}
.included-arrow svg{ width:18px; height:18px; }
.included-arrow--prev svg{ transform: scaleX(-1); }
.included-arrow:hover{
  border-color: var(--pink);
  color: var(--pink);
  background: rgba(255,46,116,.08);
  transform: translateY(-2px);
}
.included-arrow:active{ transform: translateY(0) scale(.96); }

.included-dots{ display:flex; align-items:center; gap:0.55rem; }
.included-dot{
  width:9px; height:9px;
  border-radius:50%;
  padding:0;
  background: rgba(201,169,110,.4);
  border: 1px solid rgba(201,169,110,.6);
  transition: all .3s var(--ease);
}
.included-dot:hover{ background: rgba(201,169,110,.7); }
.included-dot.is-active{
  width:11px; height:11px;
  background: var(--pink);
  border-color: var(--pink);
  box-shadow: 0 0 10px 2px rgba(255,46,116,.55);
}

@media (min-width: 640px){
  .included-card{ flex-basis: calc(50% - 0.625rem); }
}
@media (min-width: 1000px){
  .included-track{
    display:grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1.5rem;
    overflow:visible;
    scroll-snap-type:none;
    padding: 0.5rem 0.25rem 0;
  }
  .included-card{ scroll-snap-align:none; }
  .included-nav{ display:none; }
}

/* =========================================================
   PRICING
   ========================================================= */
#pricing{
  background:
    radial-gradient(ellipse 800px 500px at 6% -10%, rgba(201,169,110,.2), transparent 60%),
    radial-gradient(ellipse 750px 520px at 102% 108%, rgba(255,46,116,.18), transparent 60%),
    var(--ink);
  overflow:hidden;
}
#pricing::before,
#pricing::after{
  content:"";
  position:absolute;
  width:140%; height:62%;
  pointer-events:none;
  z-index:0;
  filter: blur(72px);
}
#pricing::before{
  top:-24%; left:-36%;
  background: linear-gradient(120deg, rgba(201,169,110,.55) 0%, rgba(201,169,110,.22) 22%, transparent 52%);
  transform: rotate(-20deg);
}
#pricing::after{
  bottom:-26%; right:-36%;
  background: linear-gradient(-60deg, rgba(255,46,116,.42) 0%, rgba(255,46,116,.22) 26%, transparent 56%);
  transform: rotate(-20deg);
}
#pricing .wrap{ position:relative; z-index:1; }
#pricing .eyebrow{ color: var(--gold-bright); }
#pricing .eyebrow::before{ background: var(--gold-bright); }

.pricing__cards{
  display:grid;
  grid-template-columns: 0.85fr 1.15fr;
  gap: clamp(1.5rem, 3vw, 2.25rem);
  align-items:stretch;
}
.price-card{
  border-radius: 22px;
  padding: clamp(1.75rem, 3vw, 2.75rem);
  display:flex;
  flex-direction:column;
  position:relative;
}
.price-card--standard{
  background: linear-gradient(165deg, rgba(255,255,255,.055), rgba(255,255,255,.015) 55%);
  border: 1px solid rgba(201,169,110,.28);
  backdrop-filter: blur(16px) saturate(140%);
  -webkit-backdrop-filter: blur(16px) saturate(140%);
  color: var(--cream);
  box-shadow: 0 1px 0 rgba(255,255,255,.05) inset, 0 30px 60px -30px rgba(0,0,0,.6);
}
.price-card--early{
  background:
    linear-gradient(165deg, rgba(255,255,255,.07), rgba(255,255,255,.015) 45%, rgba(0,0,0,.15) 100%),
    linear-gradient(200deg, rgba(255,46,116,.16), transparent 55%),
    rgba(15,12,11,.6);
  border: 1px solid rgba(201,169,110,.5);
  backdrop-filter: blur(22px) saturate(150%);
  -webkit-backdrop-filter: blur(22px) saturate(150%);
  color: var(--cream);
  position:relative;
  overflow:hidden;
  box-shadow:
    0 1px 0 rgba(255,255,255,.08) inset,
    0 45px 90px -30px rgba(0,0,0,.75),
    0 0 60px -18px rgba(255,46,116,.35);
}
.price-card--early::after{
  content:"";
  position:absolute;
  width:320px; height:320px;
  right:-120px; top:-120px;
  border-radius:50%;
  background: radial-gradient(circle, rgba(255,46,116,.22), transparent 70%);
  pointer-events:none;
}
.price-card__badge{
  align-self:flex-start;
  display:inline-flex;
  align-items:center;
  gap:0.55rem;
  background: rgba(15,12,10,.4);
  backdrop-filter: blur(10px) saturate(140%);
  -webkit-backdrop-filter: blur(10px) saturate(140%);
  border: 1px solid rgba(201,169,110,.6);
  color: var(--gold-bright);
  font-size:0.7rem;
  font-weight:800;
  letter-spacing:0.12em;
  text-transform:uppercase;
  padding: 0.55rem 0.95rem;
  border-radius:999px;
  margin-bottom:1.6rem;
  position:relative; z-index:1;
}
.price-card__badge::before{
  content:"";
  width:6px; height:6px;
  flex-shrink:0;
  border-radius:50%;
  background: var(--pink);
}
.price-card__label{
  font-size:0.78rem;
  letter-spacing:0.14em;
  text-transform:uppercase;
  font-weight:700;
  opacity:.85;
  position:relative; z-index:1;
}
.price-card__amount{
  font-family: var(--font-display);
  font-style:italic;
  font-size: clamp(2.6rem, 6vw, 4.4rem);
  line-height:1;
  margin: 0.5rem 0 0.3rem;
  position:relative; z-index:1;
  color: var(--cream);
}
.price-card--early .price-card__amount{
  text-shadow: 0 0 40px rgba(255,46,116,.35);
}
.price-card__amount sup{
  font-size:1.4rem;
  vertical-align: 0.6em;
  margin-right:0.15rem;
  color: var(--gold-bright);
}
.price-card__was{
  font-size:1rem;
  text-decoration: line-through;
  opacity:.7;
  font-weight:400;
}
.price-card__note{
  font-size:0.9rem;
  opacity:.9;
  margin-top:1.1rem;
  padding-top:1rem;
  border-top: 1px solid rgba(201,169,110,.2);
  max-width:34ch;
  position:relative; z-index:1;
  color:#C9C1B6;
}
.price-card--early .price-card__note{ color:#D8CFC3; }
.price-card__cta{ margin-top:2rem; position:relative; z-index:1; }
.price-card--standard .price-card__amount{ color:#C9C1B6; }
.price-card--standard .price-card__amount sup{ color: var(--gold); }

@media (max-width: 860px){
  .pricing__cards{ grid-template-columns:1fr; }
}

/* =========================================================
   BOOKING FORM
   ========================================================= */
#booking{
  background:
    radial-gradient(ellipse 800px 520px at 100% -10%, rgba(201,169,110,.2), transparent 60%),
    radial-gradient(ellipse 750px 520px at -4% 106%, rgba(255,46,116,.18), transparent 60%),
    var(--ink);
  overflow:hidden;
}
#booking::before,
#booking::after{
  content:"";
  position:absolute;
  width:140%; height:62%;
  pointer-events:none;
  z-index:0;
  filter: blur(72px);
}
#booking::before{
  top:-24%; right:-36%;
  background: linear-gradient(-120deg, rgba(201,169,110,.5) 0%, rgba(201,169,110,.22) 22%, transparent 52%);
  transform: rotate(20deg);
}
#booking::after{
  bottom:-26%; left:-36%;
  background: linear-gradient(60deg, rgba(255,46,116,.42) 0%, rgba(255,46,116,.2) 26%, transparent 56%);
  transform: rotate(20deg);
}
#booking .wrap{ position:relative; z-index:1; }
#booking .eyebrow{ color: var(--gold-bright); }
#booking .eyebrow::before{ background: var(--gold-bright); }

.booking{
  display:grid;
  grid-template-columns: 0.8fr 1.2fr;
  gap: clamp(2rem, 5vw, 4rem);
  align-items:flex-start;
}
.booking__intro{ position:sticky; top:calc(var(--nav-h) + 1rem); }
.booking__list{ margin-top:1.75rem; display:grid; gap:0; }
.booking__list li{
  display:flex; gap:0.85rem; align-items:flex-start;
  font-size:0.95rem; color:#C9C1B6;
  padding:0.9rem 0;
  border-bottom: 1px solid rgba(201,169,110,.16);
}
.booking__list li:first-child{ padding-top:0; }
.booking__list li:last-child{ border-bottom:none; padding-bottom:0; }
.booking__list li::before{
  content:"";
  width:7px; height:7px;
  margin-top:0.45em;
  border-radius:50%;
  flex-shrink:0;
  background: var(--pink);
  box-shadow: 0 0 10px 1px rgba(255,46,116,.55);
}

.form-card{
  background:
    linear-gradient(165deg, rgba(255,255,255,.06), rgba(255,255,255,.015) 45%, rgba(0,0,0,.14) 100%),
    rgba(15,12,11,.55);
  border: 1px solid rgba(201,169,110,.38);
  backdrop-filter: blur(24px) saturate(140%);
  -webkit-backdrop-filter: blur(24px) saturate(140%);
  border-radius: 22px;
  padding: clamp(1.75rem, 4vw, 3rem);
  box-shadow:
    0 1px 0 rgba(255,255,255,.07) inset,
    0 45px 90px -30px rgba(0,0,0,.75),
    0 0 60px -22px rgba(255,46,116,.22);
}
.form-grid{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap: 1.25rem;
}
.form-group{ display:flex; flex-direction:column; gap:0.45rem; }
.form-group--full{ grid-column: 1 / -1; }
.form-group label{
  font-size:0.76rem;
  font-weight:700;
  letter-spacing:0.08em;
  text-transform:uppercase;
  color: var(--gold-bright);
}
.form-group input,
.form-group select,
.form-group textarea{
  border: 1px solid rgba(251,243,230,.2);
  border-radius: 10px;
  padding: 0.85em 1em;
  background: rgba(255,255,255,.04);
  color: var(--cream);
  font-family: inherit;
  transition: border-color .3s var(--ease), background .3s var(--ease), box-shadow .3s var(--ease);
  width:100%;
}
.form-group input::placeholder,
.form-group textarea::placeholder{ color: rgba(251,243,230,.32); }
.form-group input:focus,
.form-group select:focus,
.form-group textarea:focus{
  outline:none;
  border-color: var(--pink);
  background: rgba(255,255,255,.07);
  box-shadow: 0 0 0 3px rgba(255,46,116,.16);
}
.form-group textarea{ resize:vertical; min-height:100px; }

.radio-group{
  display:flex; flex-wrap:wrap; gap:0.6rem;
}
.radio-pill{
  position:relative;
}
.radio-pill input{
  position:absolute; opacity:0; inset:0; cursor:pointer; width:100%; height:100%;
}
.radio-pill span{
  display:inline-flex;
  padding: 0.7em 1.2em;
  border-radius:999px;
  border: 1px solid rgba(251,243,230,.22);
  background: rgba(255,255,255,.03);
  color: var(--cream);
  font-size:0.85rem;
  transition: all .25s var(--ease);
}
.radio-pill input:checked + span{
  background: linear-gradient(160deg, var(--pink), var(--pink-deep));
  border-color: rgba(255,46,116,.8);
  color: var(--white);
  box-shadow: 0 8px 22px -8px rgba(255,46,116,.55);
}
.radio-pill input:focus-visible + span{
  outline: 2px solid var(--gold-bright);
  outline-offset: 2px;
}

.field-error{
  font-size:0.76rem;
  color: var(--pink);
  min-height:1em;
}
.form-group.has-error input,
.form-group.has-error select,
.form-group.has-error textarea{
  border-color: var(--pink);
  background: rgba(255,46,116,.08);
}

.form__submit{ margin-top:0.5rem; }
.form__disclaimer{
  font-size:0.78rem;
  color:#C9C1B6;
  margin-top:1rem;
  text-align:center;
}

.form__submit-error{
  display:none;
  font-size:0.85rem;
  color: var(--pink);
  margin-top:1rem;
  text-align:center;
}
.form__submit-error.is-visible{ display:block; }

.form__success{
  display:none;
  text-align:center;
  padding: clamp(2rem, 6vw, 3.5rem) 1rem;
}
.form__success.is-visible{ display:block; }
.form-card.is-submitted .form-fields,
.form-card.is-submitted .form__submit,
.form-card.is-submitted .form__disclaimer,
.form-card.is-submitted .form__submit-error{ display:none; }
.form__success-icon{
  width:64px; height:64px;
  border-radius:50%;
  background: linear-gradient(160deg, rgba(255,46,116,.2), rgba(201,169,110,.12));
  border: 1px solid rgba(201,169,110,.55);
  display:flex; align-items:center; justify-content:center;
  margin: 0 auto 1.5rem;
  color: var(--pink);
  box-shadow: 0 0 40px -12px rgba(255,46,116,.45);
}
.form__success h3{
  font-family: var(--font-display);
  font-style:italic;
  font-size: clamp(1.5rem, 3vw, 2rem);
  margin-bottom:0.75rem;
  color: var(--cream);
}
.form__success p{ color:#C9C1B6; max-width:42ch; margin-inline:auto; }

@media (max-width: 860px){
  .booking{ grid-template-columns:1fr; }
  .booking__intro{ position:static; }
  .form-grid{ grid-template-columns:1fr; }
}

/* =========================================================
   FOOTER
   ========================================================= */
.footer{
  position:relative;
  overflow:hidden;
  background:
    radial-gradient(ellipse 900px 560px at 10% -12%, rgba(255,46,116,.14), transparent 60%),
    radial-gradient(ellipse 850px 560px at 94% 106%, rgba(201,169,110,.15), transparent 60%),
    var(--ink);
  color: var(--cream);
  padding-block: clamp(3.25rem, 7vw, 5.5rem) 2.25rem;
}
.footer::before{
  content:"";
  position:absolute; inset:0;
  z-index:0;
  opacity:.035;
  mix-blend-mode:overlay;
  pointer-events:none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  background-size: 160px 160px;
}
.footer .wrap{ position:relative; z-index:1; }

.footer__hero{
  text-align:center;
  max-width: 640px;
  margin-inline:auto;
  padding-bottom: clamp(3rem, 6vw, 4.5rem);
}
.footer__topline{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1.25rem;
  text-align:left;
  margin-bottom:0.5rem;
}
.footer__wordmark{
  font-family: var(--font-display);
  font-style:italic;
  font-size: clamp(1.75rem, 3.4vw, 2.5rem);
  line-height:1;
  white-space:nowrap;
  color: var(--pink);
  text-shadow: 0 0 34px rgba(255,46,116,.35), 0 0 4px rgba(255,46,116,.3);
}
.footer__meta{
  margin-top:1.1rem;
  font-size:0.74rem;
  font-weight:700;
  letter-spacing:0.16em;
  text-transform:uppercase;
  color: var(--gold-bright);
  display:flex;
  justify-content:center;
}
.footer__meta span:not(:last-child)::after{
  content:"\00B7";
  margin-inline:0.85rem;
  color:rgba(201,169,110,.5);
}
.footer__tagline{
  font-family: var(--font-display);
  font-style:italic;
  font-size: clamp(1.5rem, 3.2vw, 2.3rem);
  line-height:1.28;
  color: var(--cream);
  margin: 1.75rem auto 2.25rem;
  max-width:19ch;
}
.footer__cta{
  display:inline-flex;
  align-items:center;
  gap:0.6em;
  padding: 1em 2.3em;
  border-radius:999px;
  background: linear-gradient(160deg, rgba(255,46,116,.16), rgba(201,169,110,.08));
  border: 1px solid rgba(201,169,110,.6);
  backdrop-filter: blur(14px) saturate(150%);
  -webkit-backdrop-filter: blur(14px) saturate(150%);
  color: var(--cream);
  font-size:0.76rem;
  font-weight:700;
  letter-spacing:0.16em;
  text-transform:uppercase;
  box-shadow:
    0 1px 0 rgba(255,255,255,.08) inset,
    0 24px 46px -20px rgba(0,0,0,.65),
    0 0 34px -12px rgba(255,46,116,.4);
  transition: border-color .35s var(--ease), background .35s var(--ease), transform .35s var(--ease), box-shadow .35s var(--ease);
}
.footer__cta:hover{
  border-color: var(--pink);
  background: linear-gradient(160deg, rgba(255,46,116,.3), rgba(201,169,110,.12));
  transform: translateY(-3px);
  box-shadow:
    0 1px 0 rgba(255,255,255,.1) inset,
    0 30px 56px -20px rgba(0,0,0,.7),
    0 0 46px -10px rgba(255,46,116,.6);
}

.footer__top{
  padding-block: clamp(2.5rem, 5vw, 3.5rem);
  border-top: 1px solid rgba(201,169,110,.22);
}
.footer__cols{
  display:flex;
  justify-content:center;
  gap: clamp(3.5rem, 8vw, 6.5rem);
  flex-wrap:wrap;
  text-align:left;
}
.footer__col h4{
  font-size:0.7rem;
  font-weight:700;
  letter-spacing:0.18em;
  text-transform:uppercase;
  color: var(--gold-bright);
  margin-bottom:1rem;
}
.footer__col a, .footer__col span{
  display:block;
  width:fit-content;
  position:relative;
  font-size:0.92rem;
  color:#C9C1B6;
  margin-bottom:0.65rem;
  transition: color .3s var(--ease);
}
.footer__col a::after{
  content:"";
  position:absolute;
  left:0; right:100%;
  bottom:-1px;
  height:1px;
  background: var(--pink);
  transition: right .3s var(--ease);
}
.footer__col a:hover{ color: var(--cream); }
.footer__col a:hover::after{ right:0; }

.footer__social-link{
  display:inline-flex;
  align-items:center;
  gap:0.6em;
  padding: 0.55em 1.1em;
  margin-top:0.1rem;
  border-radius:999px;
  border: 1px solid rgba(201,169,110,.4);
  background: rgba(255,255,255,.03);
  backdrop-filter: blur(8px) saturate(140%);
  -webkit-backdrop-filter: blur(8px) saturate(140%);
  color:#C9C1B6;
  font-size:0.85rem;
  cursor:pointer;
  transition: border-color .3s var(--ease), background .3s var(--ease), color .3s var(--ease), transform .3s var(--ease);
}
.footer__social-link::after{ content:none; }
.footer__social-icon{
  width:1.05em;
  height:1.05em;
  flex-shrink:0;
  transition: color .25s var(--ease);
}
.footer__social-link:hover{
  color: var(--pink);
  border-color: var(--pink);
  background: rgba(255,46,116,.08);
  transform: translateY(-2px);
}

.footer__bottom{
  display:flex;
  justify-content:center;
  flex-wrap:wrap;
  gap:0.5rem 1.5rem;
  padding-top: clamp(1.75rem, 3vw, 2.25rem);
  border-top: 1px solid rgba(201,169,110,.16);
  font-size:0.74rem;
  letter-spacing:0.03em;
  color:#8A8175;
  text-align:center;
}

@media (max-width: 640px){
  .footer__topline{ flex-direction:column; justify-content:center; text-align:center; gap:0.85rem; }
  .footer__cols{ justify-content:center; gap: 3rem; text-align:center; }
  .footer__col a, .footer__col span{ margin-inline:auto; }
}

/* =========================================================
   WHATSAPP FLOAT
   ========================================================= */
.whatsapp-btn{
  position:fixed;
  right: clamp(1rem, 3vw, 1.75rem);
  bottom: clamp(1rem, 3vw, 1.75rem);
  width:60px; height:60px;
  border-radius:50%;
  background:#25D366;
  color:#fff;
  display:flex; align-items:center; justify-content:center;
  box-shadow: 0 12px 28px -8px rgba(37,211,102,.65);
  z-index: 700;
  transition: transform .3s var(--ease), box-shadow .3s var(--ease);
}
.whatsapp-btn:hover{ transform: translateY(-3px) scale(1.05); }
.whatsapp-btn svg{ width:30px; height:30px; }

/* =========================================================
   UTILITIES
   ========================================================= */
.icon{ width:20px; height:20px; }

::selection{ background: var(--pink); color: var(--white); }
