/* ==========================================================================
   AMAZING THAILAND CLUB — style.css
   Sections
   01. Fonts
   02. Design tokens (CSS variables)
   03. Global reset & base
   04. Utilities
   05. Buttons & small components
   06. Header + navigation
   07. Off-canvas menu
   08. Hero + search bar
   09. Section framework (eyebrow, titles, decorations)
   10. Destination cards
   11. Experience grid
   12. Decorative bands
   13. About + stats
   14. Beyond a Holiday
   15. Contact form
   16. Footer
   17. Slider engine
   18. Back to top
   ========================================================================== */

/* ==========================================================================
   01. FONTS (self-hosted, Google Fonts / SIL Open Font License)
   ========================================================================== */
@font-face {
  font-family: 'Playfair Display';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('../fonts/playfair-display-500-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Playfair Display';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('../fonts/playfair-display-500.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Playfair Display';
  font-style: italic;
  font-weight: 600;
  font-display: swap;
  src: url('../fonts/playfair-display-600-italic-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Playfair Display';
  font-style: italic;
  font-weight: 600;
  font-display: swap;
  src: url('../fonts/playfair-display-600-italic.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Playfair Display';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('../fonts/playfair-display-600-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Playfair Display';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('../fonts/playfair-display-600.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Playfair Display';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('../fonts/playfair-display-700-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Playfair Display';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('../fonts/playfair-display-700.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Playfair Display';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url('../fonts/playfair-display-800-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Playfair Display';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url('../fonts/playfair-display-800.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url('../fonts/poppins-300-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url('../fonts/poppins-300.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('../fonts/poppins-400-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('../fonts/poppins-400.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('../fonts/poppins-500-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('../fonts/poppins-500.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('../fonts/poppins-600-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('../fonts/poppins-600.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('../fonts/poppins-700-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('../fonts/poppins-700.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Dancing Script';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('../fonts/dancing-script-600-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Dancing Script';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('../fonts/dancing-script-600.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Dancing Script';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('../fonts/dancing-script-700-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Dancing Script';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('../fonts/dancing-script-700.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* ==========================================================================
   02. DESIGN TOKENS
   ========================================================================== */
:root {
  /* brand colours sampled from the approved design */
  --navy:            #11265E;
  --navy-deep:       #0B1B45;
  --navy-soft:       #33456F;
  --crimson:         #C21F4F;
  --crimson-lt:      #D6335E;
  --crimson-dk:      #9E1840;
  --gold:            #D9A441;
  --gold-dk:         #A87B22;
  --gold-deep:       #8A6410;   /* AA-contrast gold for small text on light panels */
  --gold-lt:         #F7DFA0;
  --gold-pale:       #EFD9A8;

  /* surfaces */
  --cream:           #FDF3E9;
  --cream-2:         #FFF6EA;
  --cream-3:         #FEF0E0;
  --card:            #FFFBF6;
  --white:           #FFFFFF;
  --ink:             #33456F;
  --ink-soft:        #5C6B8A;
  --footer-bg:       #232B3A;
  --footer-bg-2:     #1A2130;

  /* gradients */
  --grad-gold:       linear-gradient(135deg, #F7DFA0 0%, #E9BE5E 42%, #D9A441 100%);
  --grad-gold-hover: linear-gradient(135deg, #FBEBC0 0%, #EFCB77 42%, #E0AE4E 100%);
  --grad-crimson:    linear-gradient(135deg, #D6335E 0%, #C21F4F 60%, #A81A43 100%);
  --grad-line:       linear-gradient(90deg, rgba(217,164,65,0) 0%, #D9A441 50%, rgba(217,164,65,0) 100%);
  --grad-cream:      linear-gradient(180deg, #FFF8EE 0%, #FDF1E2 55%, #FEF4E8 100%);
  --grad-sunset:     linear-gradient(180deg, #FDEBDD 0%, #FBE2D6 30%, #FDF0E2 75%, #FFF7EC 100%);

  /* typography */
  --ff-serif:  'Playfair Display', 'Times New Roman', Georgia, serif;
  --ff-sans:   'Poppins', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
  --ff-script: 'Dancing Script', 'Brush Script MT', cursive;

  --fs-eyebrow: clamp(.66rem, .42rem + .32vw, .82rem);
  --fs-h1:      clamp(2.35rem, 1.2rem + 4.2vw, 4.6rem);
  --fs-h2:      clamp(1.85rem, 1.05rem + 2.5vw, 3.1rem);
  --fs-h3:      clamp(1.12rem, .95rem + .55vw, 1.42rem);
  --fs-body:    clamp(.92rem, .86rem + .2vw, 1.02rem);
  --fs-sm:      clamp(.8rem, .75rem + .16vw, .89rem);
  --fs-xs:      clamp(.72rem, .68rem + .12vw, .79rem);

  /* spacing & shape */
  --container:   1320px;
  --gutter:      clamp(16px, 3.2vw, 40px);
  --section-y:   clamp(52px, 5.4vw, 92px);
  --header-h:    88px;
  --r-sm:        10px;
  --r-md:        16px;
  --r-lg:        22px;
  --r-xl:        30px;
  --r-pill:      999px;

  /* elevation */
  --sh-xs: 0 2px 8px rgba(64, 42, 12, .07);
  --sh-sm: 0 6px 18px rgba(64, 42, 12, .09);
  --sh-md: 0 14px 34px rgba(64, 42, 12, .12);
  --sh-lg: 0 24px 60px rgba(48, 30, 6, .16);
  --sh-gold: 0 10px 26px rgba(196, 146, 44, .34);
  --sh-crimson: 0 10px 26px rgba(168, 26, 67, .30);

  /* motion */
  --t-fast: .22s cubic-bezier(.4, 0, .2, 1);
  --t-base: .35s cubic-bezier(.4, 0, .2, 1);
  --t-slow: .5s cubic-bezier(.22, .61, .36, 1);
}

/* ==========================================================================
   03. GLOBAL RESET & BASE
   ========================================================================== */
*, *::before, *::after { box-sizing: border-box; }

html {
  -webkit-text-size-adjust: 100%;
  -moz-text-size-adjust: 100%;
  text-size-adjust: 100%;
  scroll-behavior: smooth;
  scroll-padding-top: calc(var(--header-h) + 14px);
}

body {
  margin: 0;
  font-family: var(--ff-sans);
  font-size: var(--fs-body);
  font-weight: 400;
  line-height: 1.68;
  color: var(--ink);
  background: var(--cream-2);
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

body.is-locked { overflow: hidden; }

h1, h2, h3, h4, h5, h6 {
  margin: 0;
  /*font-family: var(--ff-serif);*/
  /*font-weight: 700;*/
  line-height: 1.16;
  color: var(--navy);
  letter-spacing: -.005em;
}

p { margin: 0; }
ul, ol { margin: 0; padding: 0; list-style: none; }

a { color: inherit; text-decoration: none; transition: color var(--t-fast); }

img, svg, video { display: block; max-width: 100%; }
/* <picture> is a wrapper only — the <img> stays the laid-out element */
picture { display: contents; }
img { height: auto; border: 0; }

button, input, select, textarea {
  font: inherit;
  color: inherit;
  margin: 0;
}
button { background: none; border: 0; cursor: pointer; -webkit-appearance: none; appearance: none; }

select {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background: transparent;
  border: 0;
  cursor: pointer;
}

input[type="search"]::-webkit-search-decoration,
input[type="search"]::-webkit-search-cancel-button { -webkit-appearance: none; }

textarea { resize: vertical; }

table { border-collapse: collapse; }

/* the hidden attribute must win over any display rule */
[hidden] { display: none !important; }

::selection { background: rgba(217, 164, 65, .3); color: var(--navy-deep); }

/* keyboard focus */
:focus-visible {
  outline: 3px solid var(--gold);
  outline-offset: 3px;
  border-radius: 4px;
}
:focus:not(:focus-visible) { outline: none; }

/* icons inherit colour and size */
svg:not(.svg-sprite) {
  width: 1em;
  height: 1em;
  stroke: none;
  flex: none;
  pointer-events: none;
}
.svg-sprite { position: absolute; width: 0; height: 0; overflow: hidden; }

/* ==========================================================================
   04. UTILITIES
   ========================================================================== */
.container {
  width: 100%;
  max-width: var(--container);
  margin-inline: auto;
  padding-inline: var(--gutter);
}

.sr-only {
  position: absolute !important;
  width: 1px; height: 1px;
  padding: 0; margin: -1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  white-space: nowrap; border: 0;
}

.skip-link {
  position: absolute;
  top: -80px; left: 16px;
  z-index: 999;
  padding: 12px 22px;
  border-radius: 0 0 var(--r-sm) var(--r-sm);
  background: var(--navy);
  color: #fff;
  font-weight: 600;
  transition: top var(--t-fast);
}
.skip-link:focus { top: 0; }

.t-navy   { color: var(--navy); }
.t-crimson{ color: var(--crimson); }
.t-gold   { color: var(--gold-dk); background: linear-gradient(95deg, #C79331 0%, #E0B355 45%, #B98A24 100%); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; }

/* ==========================================================================
   05. BUTTONS & SMALL COMPONENTS
   ========================================================================== */
.btn {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .6em;
  padding: 14px 30px;
  border-radius: var(--r-pill);
  font-family: var(--ff-sans);
  font-size: var(--fs-sm);
  font-weight: 600;
  letter-spacing: .01em;
  white-space: nowrap;
  cursor: pointer;
  overflow: hidden;
  isolation: isolate;
  transition: transform var(--t-base), box-shadow var(--t-base), background var(--t-base), color var(--t-base), border-color var(--t-base);
}
.btn svg { width: 1.15em; height: 1.15em; }
.btn--lg { padding: 17px 38px; font-size: clamp(.86rem, .8rem + .22vw, .98rem); }
.btn--sm { padding: 10px 20px; font-size: var(--fs-xs); }
.btn--block { width: 100%; }

.btn--gold {
  background: var(--grad-gold);
  color: var(--navy-deep);
  box-shadow: var(--sh-gold);
  border: 1px solid rgba(255, 244, 214, .85);
}
.btn--gold:hover, .btn--gold:focus-visible {
  background: var(--grad-gold-hover);
  transform: translateY(-3px);
  box-shadow: 0 16px 34px rgba(196, 146, 44, .42);
}

.btn--crimson {
  background: var(--grad-crimson);
  color: #fff;
  box-shadow: var(--sh-crimson);
}
.btn--crimson:hover, .btn--crimson:focus-visible {
  transform: translateY(-3px);
  box-shadow: 0 16px 34px rgba(168, 26, 67, .38);
}

.btn--ghost-gold {
  background: rgba(255, 253, 248, .75);
  color: var(--navy);
  border: 1.5px solid var(--gold);
  -webkit-backdrop-filter: blur(6px);
  backdrop-filter: blur(6px);
}
.btn--ghost-gold:hover, .btn--ghost-gold:focus-visible {
  background: var(--grad-gold);
  color: var(--navy-deep);
  transform: translateY(-2px);
  box-shadow: var(--sh-gold);
}

/* round icon button (card arrows) */
.round-btn {
  display: inline-grid;
  place-items: center;
  flex: none;
  width: 38px; height: 38px;
  border-radius: 50%;
  border: 1.5px solid var(--gold);
  color: var(--gold-dk);
  background: rgba(255, 252, 246, .9);
  transition: background var(--t-base), color var(--t-base), transform var(--t-base), box-shadow var(--t-base);
}
.round-btn svg { width: 17px; height: 17px; }
.round-btn--on-dark {
  border-color: rgba(247, 223, 160, .9);
  color: var(--gold-lt);
  background: rgba(20, 16, 10, .28);
  -webkit-backdrop-filter: blur(4px);
  backdrop-filter: blur(4px);
}

/* icon-only header button */
.icon-btn {
  display: grid;
  place-items: center;
  width: 44px; height: 44px;
  border-radius: 50%;
  border: 1.5px solid var(--gold);
  color: var(--navy);
  background: rgba(255, 255, 255, .5);
  transition: background var(--t-base), color var(--t-base), transform var(--t-base);
}

.icon-btn:hover{
    border: 1px #c21f4f solid;
    background-color: #c21f4f;
    color: #fff;
}

/* text link with arrow */
.link-cta {
  display: inline-flex;
  align-items: center;
  gap: .55em;
  font-size: var(--fs-xs);
  font-weight: 600;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--gold-dk);
}
.link-cta svg { width: 1.1em; height: 1.1em; transition: transform var(--t-base); }
.link-cta:hover { color: var(--crimson); }
.link-cta:hover svg { transform: translateX(5px); }

/* decorative ornament */
.ornament { display: inline-grid; place-items: center; color: var(--gold); }
.ornament svg { width: 40px; height: 24px; }
.ornament--sm svg { width: 30px; height: 18px; }
.ornament--xs svg { width: 22px; height: 14px; }

/* handwritten script accents */
.script-note {
  font-family: var(--ff-script);
  font-weight: 700;
  font-size: clamp(1.35rem, 1rem + 1.4vw, 2.1rem);
  line-height: 1.12;
  color: var(--gold-dk);
  letter-spacing: .01em;
}
.script-note__heart { display: inline-block; color: var(--crimson); }
.script-note__heart svg { width: .62em; height: .62em; display: inline-block; vertical-align: -.02em; }
.script-note--pink { color: var(--crimson); }

/* ==========================================================================
   05b. BREADCRUMB
   ========================================================================== */
.crumbs { margin-bottom: 14px; }
.crumbs__list {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px 10px;
  font-size: var(--fs-xs);
  color: var(--ink-soft);
}
.crumbs__list li { display: flex; align-items: center; gap: 10px; }
.crumbs__list li + li::before {
  content: "";
  width: 6px; height: 6px;
  border-top: 1.6px solid currentColor;
  border-right: 1.6px solid currentColor;
  transform: rotate(45deg);
  opacity: .55;
}
.crumbs__list a { color: var(--ink-soft); }
.crumbs__list a:hover { color: var(--crimson); text-decoration: underline; text-underline-offset: 3px; }
.crumbs__list [aria-current="page"] { color: var(--crimson); font-weight: 600; }

/* ==========================================================================
   05c. SHARED BUTTON VARIANTS & NOTICES
   ========================================================================== */
.btn--wine {
  background: linear-gradient(135deg, #D2447B 0%, #B3265D 62%, #9C1B4E 100%);
  color: #fff;
  box-shadow: 0 8px 20px rgba(179, 38, 93, .28);
}
.btn--wine:hover, .btn--wine:focus-visible {
  transform: translateY(-2px);
  filter: brightness(1.06);
  box-shadow: 0 14px 28px rgba(179, 38, 93, .34);
}

.btn--outline {
  background: #fff;
  color: var(--navy);
  border: 1.5px solid rgba(217, 164, 65, .34);
}
.btn--outline:hover, .btn--outline:focus-visible {
  border-color: var(--crimson);
  color: var(--crimson);
  transform: translateY(-2px);
}

.icon-btn--sq { width: 44px; height: 44px; border-radius: 12px; border-color: rgba(217, 164, 65, .34); color: var(--navy); background: #fff; }
.icon-btn--sq:hover { background: rgba(179, 38, 93, .08); color: var(--crimson); border-color: var(--crimson); transform: none; }

/* small reset link used beside filter groups and promo codes */
.filters__reset {
  font-size: var(--fs-xs);
  font-weight: 600;
  color: var(--crimson);
  padding: 4px 2px;
  transition: color var(--t-fast);
}
.filters__reset:hover { color: var(--crimson-dk); text-decoration: underline; text-underline-offset: 3px; }

/* WhatsApp round button */
.wa-btn {
  display: grid;
  place-items: center;
  flex: none;
  width: 40px; height: 40px;
  border-radius: 50%;
  background: #25D366;
  color: #fff;
  box-shadow: 0 5px 14px rgba(37, 211, 102, .34);
  transition: transform var(--t-base), box-shadow var(--t-base);
}
.wa-btn svg { width: 21px; height: 21px; }
.wa-btn:hover { transform: translateY(-2px) scale(1.05); box-shadow: 0 10px 22px rgba(37, 211, 102, .4); }

/* the file:// warning raised by include.js */
.include-notice {
  padding: 14px 18px;
  background: #FFF4D6;
  border-bottom: 2px solid var(--gold);
  font-size: .86rem;
  line-height: 1.6;
  color: #5A4413;
}
.include-notice code {
  padding: 1px 6px;
  border-radius: 5px;
  background: rgba(0, 0, 0, .07);
  font-size: .92em;
}

/* ==========================================================================
   06. HEADER + NAVIGATION
   ========================================================================== */
.header {
  position: fixed;
  inset: 0 0 auto 0;
  z-index: 120;
  background: rgba(253, 247, 240, .82);
  -webkit-backdrop-filter: blur(14px) saturate(140%);
  backdrop-filter: blur(14px) saturate(140%);
  border-bottom: 1px solid rgba(217, 164, 65, 0);
  border-radius: 0 0 var(--r-xl) var(--r-xl);
  transition: background var(--t-base), box-shadow var(--t-base), border-color var(--t-base), transform var(--t-slow);
  will-change: transform;
}
.header::after {
  content: "";
  position: absolute;
  inset: auto 0 -1px 0;
  height: 1px;
  background: var(--grad-line);
  opacity: .5;
}
.header.is-stuck {
  background: rgba(255, 251, 245, .93);
  box-shadow: 0 10px 30px rgba(70, 45, 12, .12);
  border-bottom-color: rgba(217, 164, 65, .25);
}
.header.is-hidden { transform: translateY(-110%); }

.header__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: clamp(12px, 2vw, 34px);
  min-height: var(--header-h);
}

/* --- logo --- */
.logo { display: inline-flex; align-items: center; gap: 12px; flex: 0 0 auto; }
.logo__mark {
  width: clamp(46px, 3.4vw, 60px);
  height: auto;
  filter: drop-shadow(0 3px 6px rgba(80, 55, 15, .18));
  transition: transform var(--t-base);
}
.logo:hover .logo__mark { transform: rotate(-6deg) scale(1.06); }
.logo__text { display: flex; flex-direction: column; gap: 3px; }
.logo__name {
  font-family: var(--ff-serif);
  font-weight: 700;
  font-size: clamp(1.18rem, .82rem + 1.1vw, 1.82rem);
  line-height: 1;
  white-space: nowrap;
}
.logo__name-a { color: var(--navy); }
.logo__name-b { color: var(--crimson); }
.logo__tld { color: var(--navy-deep); font-size: .46em; font-weight: 600; vertical-align: .55em; margin-left: .12em; }
.logo__tag {
  font-size: clamp(.5rem, .4rem + .2vw, .63rem);
  font-weight: 600;
  letter-spacing: .3em;
  text-transform: uppercase;
  color: var(--navy-soft);
  white-space: nowrap;
}
.logo--stack .logo__tag { display: none; }

/* --- desktop nav --- */
.nav__list { display: flex; align-items: center; gap: clamp(10px, 1.5vw, 28px); }
.nav__item { position: relative; }

.nav__link {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 10px 2px;
    font-size: 1rem;
    font-weight: 600;
    color: var(--navy);
    white-space: nowrap;
}
.nav__link::after {
  content: "";
  position: absolute;
  left: 0; bottom: 4px;
  width: 100%; height: 2px;
  border-radius: 2px;
  background: var(--grad-gold);
  transform: scaleX(0);
  transform-origin: right;
  transition: transform var(--t-base);
}
.nav__link:hover, .nav__item.is-active > .nav__link { color: var(--crimson); }
.nav__link:hover::after,
.nav__item.is-active > .nav__link::after { transform: scaleX(1); transform-origin: left; }

.nav__caret { width: 15px; height: 15px; transition: transform var(--t-base); }
.nav__item--has-children:hover .nav__caret,
.nav__item--has-children:focus-within .nav__caret { transform: rotate(180deg); }

.nav__drop {
  position: absolute;
  top: calc(100% + 14px);
  left: 50%;
  min-width: 270px;
  padding: 10px;
  border-radius: var(--r-md);
  background: rgba(255, 252, 247, .97);
  -webkit-backdrop-filter: blur(16px);
  backdrop-filter: blur(16px);
  border: 1px solid rgba(217, 164, 65, .3);
  box-shadow: var(--sh-md);
  opacity: 0;
  visibility: hidden;
  transform: translate(-50%, 12px);
  transition: opacity var(--t-base), transform var(--t-base), visibility var(--t-base);
}
.nav__drop::before {
  content: "";
  position: absolute;
  top: -16px; left: 0; right: 0; height: 16px;
}
.nav__item--has-children:hover > .nav__drop,
.nav__item--has-children:focus-within > .nav__drop {
  opacity: 1; visibility: visible; transform: translate(-50%, 0);
}
.nav__drop a {
  display: block;
  padding: 5px 14px;
  border-radius: var(--r-sm);
  font-size: var(--fs-sm);
  color: var(--navy);
  transition: background var(--t-fast), color var(--t-fast), padding-left var(--t-fast);
}
.nav__drop a:hover, .nav__drop a:focus-visible {
  background: linear-gradient(90deg, rgba(247, 223, 160, .55), rgba(247, 223, 160, 0));
  color: var(--crimson);
  padding-left: 20px;
}

.header__actions { display: flex; align-items: center; gap: 10px; flex: 0 0 auto; }

/* --- burger --- */
.burger {
  display: none;
  flex-direction: column;
  justify-content: center;
  gap: 5px;
  width: 46px; height: 46px;
  padding: 0 11px;
  border-radius: 14px;
  border: 1.5px solid rgba(217, 164, 65, .55);
  background: rgba(255, 255, 255, .55);
}
.burger__bar {
  display: block;
  height: 2px;
  width: 100%;
  border-radius: 2px;
  background: var(--navy);
  transition: transform var(--t-base), opacity var(--t-base), width var(--t-base);
}
.burger__bar:nth-child(2) { width: 72%; }
.burger.is-open .burger__bar:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.burger.is-open .burger__bar:nth-child(2) { opacity: 0; }
.burger.is-open .burger__bar:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

/* --- header search drawer --- */
.header-search {
  border-top: 1px solid rgba(217, 164, 65, .22);
  background: rgba(255, 251, 244, .96);
  animation: drop-in .3s cubic-bezier(.4, 0, .2, 1) both;
}
.header-search__form {
  position: relative;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 14px 0 18px;
}
.header-search__icon {
  position: absolute;
  left: 18px;
  width: 19px; height: 19px;
  color: var(--gold-dk);
}
.header-search__input {
  flex: 1;
  padding: 13px 18px 13px 48px;
  border-radius: var(--r-pill);
  border: 1.5px solid rgba(217, 164, 65, .4);
  background: #fff;
  font-size: var(--fs-sm);
  transition: border-color var(--t-fast), box-shadow var(--t-fast);
}
.header-search__input:focus { border-color: var(--gold); box-shadow: 0 0 0 4px rgba(217, 164, 65, .16); outline: none; }

/* ==========================================================================
   07. OFF-CANVAS MENU
   ========================================================================== */
.offcanvas-overlay {
  position: fixed;
  inset: 0;
  z-index: 190;
  background: rgba(14, 12, 24, .58);
  -webkit-backdrop-filter: blur(3px);
  backdrop-filter: blur(3px);
  opacity: 0;
  transition: opacity var(--t-base);
}
.offcanvas-overlay.is-visible { opacity: 1; }

.offcanvas {
  position: fixed;
  top: 0; left: 0;
  z-index: 200;
  display: flex;
  flex-direction: column;
  width: min(360px, 88vw);
  height: 100%;
  height: 100dvh;
  padding: 20px 0 0;
  background: linear-gradient(180deg, #FFFBF4 0%, #FDF2E4 100%);
  box-shadow: 18px 0 50px rgba(40, 25, 5, .25);
  transform: translateX(-102%);
  visibility: hidden;
  transition: transform .42s cubic-bezier(.22, .61, .36, 1), visibility .42s;
  overflow: hidden;
}
.offcanvas.is-open { transform: translateX(0); visibility: visible; }

.offcanvas__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 0 20px 18px;
  border-bottom: 1px solid rgba(217, 164, 65, .28);
}
.offcanvas__close {
  display: grid;
  place-items: center;
  flex: none;
  width: 40px; height: 40px;
  border-radius: 50%;
  border: 1.5px solid rgba(217, 164, 65, .55);
  color: var(--navy);
  transition: background var(--t-fast), transform var(--t-fast);
}
.offcanvas__close svg { width: 18px; height: 18px; }
.offcanvas__close:hover { background: var(--grad-gold); transform: rotate(90deg); }

.offcanvas__nav { flex: 1; overflow-y: auto; padding: 8px 14px 18px; -webkit-overflow-scrolling: touch; }

.oc-item + .oc-item { border-top: 1px solid rgba(217, 164, 65, .18); }
.oc-link {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  width: 100%;
  padding: 15px 10px;
  font-size: 1rem;
  font-weight: 500;
  text-align: left;
  color: var(--navy);
  transition: color var(--t-fast), padding-left var(--t-fast);
}
.oc-link svg { width: 18px; height: 18px; color: var(--gold-dk); transition: transform var(--t-base); }
.oc-link:hover { color: var(--crimson); padding-left: 16px; }
.oc-toggle[aria-expanded="true"] { color: var(--crimson); }
.oc-toggle[aria-expanded="true"] svg { transform: rotate(180deg); }

.oc-sub {
  overflow: hidden;
  max-height: 0;
  transition: max-height .38s cubic-bezier(.4, 0, .2, 1);
}
.oc-sub a {
  display: block;
  padding: 11px 10px 11px 26px;
  font-size: .9rem;
  color: var(--ink);
  border-left: 2px solid rgba(217, 164, 65, .35);
  margin-left: 10px;
  transition: color var(--t-fast), border-color var(--t-fast), padding-left var(--t-fast);
}
.oc-sub a:hover { color: var(--crimson); border-color: var(--crimson); padding-left: 32px; }

.offcanvas__foot {
  padding: 18px 20px calc(20px + env(safe-area-inset-bottom));
  border-top: 1px solid rgba(217, 164, 65, .28);
  background: rgba(255, 249, 240, .9);
}
.offcanvas__tagline {
  margin-top: 12px;
  text-align: center;
  font-family: var(--ff-script);
  font-size: 1.22rem;
  font-weight: 700;
  color: var(--gold-dk);
}

/* ==========================================================================
   08. HERO + SEARCH BAR
   ========================================================================== */
.hero {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-height: clamp(560px, 46vw + 210px, 400px);
  padding: calc(var(--header-h) + clamp(34px, 5vw, 78px)) 0 clamp(96px, 9vw, 132px);
  isolation: isolate;
  z-index: 4;            /* lets the search bar overlap the next section */
}
.hero__media { position: absolute; inset: 0; z-index: -2; overflow: hidden; }
.hero__img {
  width: 100%; height: 100%;
  object-fit: cover;
  object-position: center 58%;
}
.hero__overlay {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(100deg, rgba(30, 10, 38, .86) 0%, rgba(44, 16, 44, .7) 28%, rgba(56, 22, 42, .38) 55%, rgba(70, 30, 30, .14) 100%),
    linear-gradient(180deg, rgba(30, 12, 34, .38) 0%, rgba(30, 12, 34, 0) 32%, rgba(35, 14, 30, .34) 100%);
}

.hero__inner { position: relative; z-index: 2; padding-left: clamp(0px, 5.5vw, 120px); }

.hero__title {
    margin: 14px 0 0;
    font-size: 2.5rem;
    font-weight: 700;
    line-height: 1.02;
    color: #fff;
    text-shadow: 0 6px 26px rgba(28, 8, 30, .5);
}
.hero__title-1, .hero__title-2 { display: block; }
.hero__title-2 {
  background: linear-gradient(96deg, #FBE7B0 0%, #EFC367 30%, #F7DFA0 55%, #E3AE4B 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  filter: drop-shadow(0 4px 10px rgba(40, 12, 24, .6)) drop-shadow(0 8px 26px rgba(60, 20, 10, .35));
}

.hero__sub {
  margin-top: 16px;
  max-width: 58ch;
  font-size: clamp(.92rem, .82rem + .38vw, 1.14rem);
  font-weight: 400;
  line-height: 1.72;
  color: rgba(255, 252, 245, .95);
  text-shadow: 0 2px 12px rgba(30, 10, 25, .5);
}
.hero__sub span { color: var(--gold-lt); margin-inline: .25em; }

.hero__cta {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: clamp(16px, 2.4vw, 34px);
  margin-top: clamp(24px, 3vw, 38px);
}

.video-link { display: inline-flex; align-items: center; gap: 14px; color: #fff; }
.video-link__btn {
  position: relative;
  display: grid;
  place-items: center;
  width: 52px; height: 52px;
  border-radius: 50%;
  border: 2px solid rgba(255, 250, 240, .85);
  background: rgba(255, 255, 255, .12);
  -webkit-backdrop-filter: blur(6px);
  backdrop-filter: blur(6px);
  transition: background var(--t-base), transform var(--t-base);
}
.video-link__btn svg { width: 22px; height: 22px; color: #fff; margin-left: 3px; }
.video-link:hover .video-link__btn { background: var(--grad-gold); transform: scale(1.08); }
.video-link:hover .video-link__btn svg { color: var(--navy-deep); }
.video-link__text { display: flex; flex-direction: column; line-height: 1.32; text-shadow: 0 2px 10px rgba(30, 10, 25, .5); }
.video-link__text strong { font-size: clamp(.92rem, .86rem + .2vw, 1.04rem); font-weight: 600; }
.video-link__text small { font-size: var(--fs-xs); font-weight: 300; opacity: .92; }

/* --- search bar --- */
.searchbar-wrap {
  position: absolute;
  left: 50%;
  bottom: clamp(-34px, -2.2vw, -26px);
  z-index: 6;
  transform: translateX(-50%);
}
.searchbar {
  display: flex;
  align-items: stretch;
  gap: 6px;
  padding: 10px;
  border-radius: var(--r-pill);
  background: rgba(255, 253, 249, .9);
  -webkit-backdrop-filter: blur(16px) saturate(150%);
  backdrop-filter: blur(16px) saturate(150%);
  border: 1px solid rgba(255, 255, 255, .8);
  box-shadow: var(--sh-lg);
}
.searchbar__field {
  position: relative;
  display: flex;
  align-items: center;
  gap: 12px;
  flex: 1 1 0;
  min-width: 0;
  padding: 8px 40px 8px 18px;
  border-radius: var(--r-pill);
  transition: background var(--t-fast);
}
.searchbar__field:hover { background: rgba(247, 223, 160, .2); }
.searchbar__icon { width: 24px; height: 24px; flex: none; color: var(--gold-dk); }
.searchbar__body { display: flex; flex-direction: column; min-width: 0; flex: 1; }
.searchbar__label {
  font-size: var(--fs-xs);
  font-weight: 400;
  color: var(--ink-soft);
  line-height: 1.3;
  cursor: pointer;
}
.searchbar__select,
.searchbar__input {
  width: 100%;
  padding: 0;
  border: 0;
  background: transparent;
  font-size: clamp(.86rem, .8rem + .18vw, .97rem);
  font-weight: 600;
  color: var(--navy);
  line-height: 1.45;
  text-overflow: ellipsis;
}
.searchbar__input::placeholder { color: var(--navy); opacity: 1; }
.searchbar__select:focus, .searchbar__input:focus { outline: none; }
.searchbar__caret {
  position: absolute;
  right: 16px;
  width: 17px; height: 17px;
  color: var(--ink-soft);
  transition: transform var(--t-base);
}
.searchbar__field:hover .searchbar__caret { transform: translateY(2px); color: var(--gold-dk); }
.searchbar__divider { width: 1px; align-self: center; height: 34px; background: rgba(217, 164, 65, .4); flex: none; }

.searchbar__submit {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  flex: none;
  position: relative;
  overflow: hidden;
  isolation: isolate;
  padding: 0 clamp(24px, 2.6vw, 42px);
  border-radius: var(--r-pill);
  background: var(--grad-crimson);
  color: #fff;
  font-size: var(--fs-sm);
  font-weight: 600;
  box-shadow: var(--sh-crimson);
  transition: transform var(--t-base), box-shadow var(--t-base), filter var(--t-base);
}
.searchbar__submit svg { width: 19px; height: 19px; }
.searchbar__submit:hover { transform: translateY(-2px); filter: brightness(1.06); box-shadow: 0 16px 32px rgba(168, 26, 67, .38); }

/* --- scroll cue --- */
.scroll-cue {
  position: absolute;
  left: 50%;
  bottom: clamp(74px, 8vw, 104px);
  z-index: 4;
  transform: translateX(-50%);
  display: none;
}
.scroll-cue__mouse {
  display: block;
  width: 26px; height: 42px;
  border: 2px solid rgba(255, 250, 240, .75);
  border-radius: 14px;
}
.scroll-cue__dot {
  display: block;
  width: 4px; height: 8px;
  margin: 7px auto 0;
  border-radius: 3px;
  background: var(--gold-lt);
}

/* ==========================================================================
   09. SECTION FRAMEWORK
   ========================================================================== */
.section {
    position: relative;
    padding: 3rem 0;
    overflow: hidden;
}
.section--cream  { background: var(--grad-cream); }
.section--cream2 { background: linear-gradient(180deg, #FFF5E7 0%, #FEEFDA 48%, #FFF6E9 100%); }
.section--sunset { background: var(--grad-sunset); }

/* soft gold wave on top/bottom of cream sections */
.section--cream::before,
.section--cream2::before,
.section--sunset::before {
  content: "";
  position: absolute;
  inset: 0 0 auto 0;
  height: 3px;
  background: var(--grad-line);
  opacity: .55;
}

.section__head { position: relative; text-align: center; margin-bottom: clamp(28px, 3.4vw, 48px); }
.section__head--center { text-align: center; }

.eyebrow {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
  font-family: var(--ff-sans);
  font-size: var(--fs-eyebrow);
  font-weight: 600;
  letter-spacing: .34em;
  text-transform: uppercase;
  color: var(--gold-dk);
  margin-top: 1rem;
}
.eyebrow--light { color: var(--gold-lt); text-shadow: 0 2px 10px rgba(30, 10, 25, .4); justify-content: flex-start; }
.eyebrow--left { justify-content: flex-start; color: var(--navy); }
.eyebrow__rule {
  display: block;
  width: clamp(28px, 6vw, 92px);
  height: 1px;
  background: var(--grad-line);
}
.eyebrow--light .eyebrow__rule { background: linear-gradient(90deg, rgba(247,223,160,0), rgba(247,223,160,.9), rgba(247,223,160,0)); }

.section__title {
    margin-top: 1.2rem;
    font-size: 2rem;
    font-weight: 700;
}
.section__sub {
  max-width: 62ch;
  margin: 12px auto 0;
  font-size: clamp(.88rem, .82rem + .22vw, 1.02rem);
  color: var(--ink);
}
.section__sub--wide { max-width: 72ch; }

.section__action {
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
}

/* botanical decorations on the section edges */
.deco {
  position: absolute;
  top: 0;
  width: clamp(90px, 11vw, 190px);
  height: 100%;
  pointer-events: none;
  opacity: .55;
  background-repeat: no-repeat;
  background-size: 100% auto;
}
.deco--left {
  left: 0;
  background-image:
    radial-gradient(60% 40% at 8% 14%, rgba(97, 148, 76, .22), transparent 70%),
    radial-gradient(42% 28% at 2% 52%, rgba(226, 118, 155, .18), transparent 70%),
    radial-gradient(50% 34% at 12% 86%, rgba(97, 148, 76, .18), transparent 70%);
}
.deco--right {
  right: 0;
  background-image:
    radial-gradient(60% 40% at 92% 12%, rgba(97, 148, 76, .2), transparent 70%),
    radial-gradient(42% 28% at 98% 48%, rgba(226, 118, 155, .16), transparent 70%),
    radial-gradient(50% 34% at 88% 84%, rgba(97, 148, 76, .18), transparent 70%);
}

/* ==========================================================================
   10. DESTINATION CARDS
   ========================================================================== */
.dest-card {
  position: relative;
  height: 100%;
  border-radius: var(--r-lg);
  background: var(--card);
  box-shadow: var(--sh-sm);
  overflow: hidden;
  transition: transform var(--t-base), box-shadow var(--t-base);
}
.dest-card:hover { transform: translateY(-8px); box-shadow: var(--sh-lg); }

.dest-card__media { position: relative; aspect-ratio: 16 / 10.6; overflow: hidden; }
.dest-card__media::after {
  content: "";
  position: absolute; inset: 0;
  background: linear-gradient(180deg, rgba(20, 10, 30, 0) 52%, rgba(20, 10, 30, .3) 100%);
}
.dest-card__media img {
  width: 100%; height: 100%;
  object-fit: cover;
  transition: transform .7s cubic-bezier(.22, .61, .36, 1);
}
.dest-card:hover .dest-card__media img { transform: scale(1.09); }

.dest-card__body {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 14px 14px 16px 16px;
}
.dest-card__icon {
  display: grid;
  place-items: center;
  flex: none;
  width: 38px; height: 38px;
  color: var(--gold-dk);
}
.dest-card__icon svg { width: 32px; height: 32px; }
.dest-card__text { flex: 1; min-width: 0; }
.dest-card__title {
  font-size: var(--fs-h3);
  font-weight: 700;
  color: var(--navy);
  line-height: 1.2;
}
.dest-card__tags {
  margin-top: 2px;
  font-size: clamp(.68rem, .64rem + .12vw, .76rem);
  line-height: 1.5;
  color: var(--ink-soft);
}
.dest-card__tags span { color: var(--gold); margin-inline: .18em; }
.dest-card:hover .round-btn { background: var(--grad-gold); color: var(--navy-deep); transform: translateX(3px); box-shadow: var(--sh-gold); }

/* ==========================================================================
   11. EXPERIENCE GRID (Find Your Thailand)
   ========================================================================== */
.exp-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: clamp(14px, 1.5vw, 24px);
}
.exp-card {
  position: relative;
  display: block;
  aspect-ratio: 3 / 2;
  border-radius: var(--r-lg);
  overflow: hidden;
  box-shadow: var(--sh-sm);
  isolation: isolate;
  transition: transform var(--t-base), box-shadow var(--t-base);
}
.exp-card:hover { transform: translateY(-8px); box-shadow: var(--sh-lg); }
.exp-card__img {
  position: absolute;
  inset: 0;
  width: 100%; height: 100%;
  object-fit: cover;
  z-index: -2;
  transition: transform .75s cubic-bezier(.22, .61, .36, 1);
}
.exp-card:hover .exp-card__img { transform: scale(1.08); }
.exp-card::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: linear-gradient(180deg, rgba(14, 8, 20, .04) 0%, rgba(14, 8, 20, .28) 42%, rgba(12, 7, 18, .82) 100%);
  transition: opacity var(--t-base);
}
.exp-card:hover::after { opacity: .92; }

.exp-card__icon {
  position: absolute;
  top: 14px; left: 14px;
  display: grid;
  place-items: center;
  width: 44px; height: 44px;
  border-radius: 50%;
  background: rgba(255, 253, 248, .94);
  color: var(--gold-dk);
  box-shadow: 0 5px 14px rgba(24, 12, 4, .26);
  transition: transform var(--t-base), background var(--t-base);
}
.exp-card__icon svg { width: 23px; height: 23px; }
.exp-card:hover .exp-card__icon { transform: scale(1.1) rotate(-6deg); background: var(--gold-lt); }

.exp-card__body {
  position: absolute;
  left: 16px; right: 62px; bottom: 15px;
  display: flex;
  flex-direction: column;
  gap: 4px;
  color: #fff;
}
.exp-card__title {
  font-family: var(--ff-sans);
  font-size: clamp(.95rem, .84rem + .38vw, 1.14rem);
  font-weight: 600;
  line-height: 1.25;
  text-shadow: 0 2px 10px rgba(10, 5, 15, .6);
}
.exp-card__sub {
  font-size: var(--fs-xs);
  font-weight: 300;
  line-height: 1.45;
  color: rgba(255, 252, 246, .9);
  text-shadow: 0 2px 8px rgba(10, 5, 15, .55);
}
.exp-card .round-btn {
  position: absolute;
  right: 14px; bottom: 15px;
}
.exp-card:hover .round-btn { background: var(--grad-gold); color: var(--navy-deep); border-color: var(--gold-lt); }

.script-note--right {
  margin: -6px 4px 18px auto;
  width: max-content;
  text-align: right;
  transform: rotate(-4deg);
  transform-origin: right center;
}

/* ==========================================================================
   12. DECORATIVE BANDS
   ========================================================================== */
.band {
  position: relative;
  display: grid;
  place-items: center;
  min-height: clamp(150px, 15vw, 230px);
  isolation: isolate;
  overflow: hidden;
}
.band--cta { min-height: clamp(210px, 19vw, 300px); }
.band__img {
  position: absolute;
  inset: 0;
  z-index: -2;
  width: 100%; height: 100%;
  object-fit: cover;
  object-position: center 55%;
  filter: saturate(1.1) contrast(1.04);
}
.band__veil {
  position: absolute;
  inset: 0;
  z-index: -1;
  background:
    linear-gradient(180deg, rgba(255, 246, 233, .95) 0%, rgba(255, 242, 226, .3) 30%, rgba(255, 236, 216, .26) 70%, rgba(255, 247, 236, .96) 100%),
    linear-gradient(90deg, rgba(255, 214, 170, .3), rgba(255, 233, 205, .12) 45%, rgba(255, 206, 160, .28));
}
.band__veil--warm {
  background:
    linear-gradient(180deg, rgba(255, 246, 233, .9) 0%, rgba(255, 238, 222, .45) 30%, rgba(253, 232, 214, .48) 68%, rgba(255, 247, 236, .95) 100%),
    radial-gradient(60% 80% at 50% 50%, rgba(255, 233, 200, .5), transparent 70%);
}
.band__inner {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  text-align: center;
  padding-block: clamp(24px, 3vw, 40px);
}
.band__text {
  font-family: var(--ff-sans);
  font-size: clamp(.78rem, .7rem + .32vw, .98rem);
  font-weight: 600;
  letter-spacing: .3em;
  text-transform: uppercase;
  color: var(--navy);
}
.band__text--sm { font-size: var(--fs-eyebrow); letter-spacing: .28em; }
.band__heart { color: var(--gold-dk); }
.band__heart svg { width: 18px; height: 18px; }
.band--islands .band__inner::before,
.band--islands .band__inner::after {
  content: "";
  position: absolute;
  left: 50%;
  width: min(560px, 76vw);
  height: 1px;
  background: var(--grad-line);
  transform: translateX(-50%);
}
.band--islands .band__inner::before { top: 6px; }
.band--islands .band__inner::after { bottom: 6px; }

/* ==========================================================================
   13. ABOUT + STATS
   ========================================================================== */
.about { background: linear-gradient(180deg, #FFF8EF 0%, #FEF3E6 60%, #FFF8EF 100%); }

.about__card {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr);
  align-items: stretch;
  border-radius: var(--r-xl);
  background: var(--card);
  box-shadow: var(--sh-md);
  overflow: hidden;
}

.about__text { padding: clamp(26px, 3.4vw, 54px) clamp(22px, 3vw, 48px); }
.about__title {
    margin-top: 14px;
    font-size: 2rem;
    line-height: 1.1;
}
.about__lead {
  margin-top: 16px;
  font-family: var(--ff-serif);
  font-size: clamp(1.02rem, .9rem + .5vw, 1.34rem);
  font-weight: 700;
}
.about__body { margin-top: 14px; max-width: 54ch; }

.usp {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0;
  margin-top: clamp(22px, 2.6vw, 36px);
}
.usp__item {
  position: relative;
  padding: 0 clamp(5px, .7vw, 12px);
  text-align: center;
}
.usp__item + .usp__item::before {
  content: "";
  position: absolute;
  left: 0; top: 34px; bottom: 6px;
  width: 1px;
  background: linear-gradient(180deg, rgba(217,164,65,0), rgba(217,164,65,.5), rgba(217,164,65,0));
}
.usp__icon { display: grid; place-items: center; color: var(--gold-dk); transition: transform var(--t-base); }
.usp__icon svg { width: 30px; height: 30px; }
.usp__item:hover .usp__icon { transform: translateY(-4px) scale(1.08); }
.usp__title {
  margin-top: 10px;
  font-size: clamp(.78rem, .72rem + .18vw, .9rem);
  font-weight: 700;
  color: var(--navy);
  line-height: 1.24;
  hyphens: none;
}
.usp__text { margin-top: 6px; font-size: clamp(.68rem, .64rem + .12vw, .76rem); color: var(--ink-soft); line-height: 1.5; }

.about__text .btn { margin-top: clamp(22px, 2.6vw, 34px); }

/* --- about media --- */
.about__media { position: relative; min-height: 420px; isolation: isolate; overflow: hidden; }
.about__photo {
  position: absolute;
  inset: 0;
  z-index: -2;
  width: 100%; height: 100%;
  object-fit: cover;
  transition: transform 1.1s cubic-bezier(.22, .61, .36, 1);
}
.about__media:hover .about__photo { transform: scale(1.05); }
.about__photo-veil {
  position: absolute;
  inset: 0;
  z-index: -1;
}

.script-note--onphoto {
  position: absolute;
  top: clamp(26px, 4vw, 62px);
  left: clamp(14px, 3vw, 44px);
  z-index: 2;
  transform: rotate(-9deg);
  color: var(--gold-dk);
  text-shadow: 0 2px 10px rgba(255, 248, 235, .8);
}

.about__quote {
  position: absolute;
  top: clamp(18px, 2.4vw, 34px);
  right: clamp(14px, 2vw, 30px);
  z-index: 2;
  max-width: 300px;
  margin: 0;
  padding: 16px 18px;
  border-radius: var(--r-md);
  background: rgba(255, 252, 246, .72);
  -webkit-backdrop-filter: blur(9px) saturate(140%);
  backdrop-filter: blur(9px) saturate(140%);
  border: 1px solid rgba(255, 255, 255, .7);
  box-shadow: var(--sh-sm);
  text-align: center;
}
.about__quote p {
  font-family: var(--ff-serif);
  font-size: clamp(.86rem, .78rem + .3vw, 1.02rem);
  font-weight: 600;
  line-height: 1.45;
  color: var(--navy);
}
.about__quote .ornament { margin: 8px auto 6px; }
.about__quote cite {
  display: block;
  font-family: var(--ff-sans);
  font-style: normal;
  font-size: .62rem;
  font-weight: 600;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--navy-soft);
}

/* --- mascot --- */
.mascot {
  position: absolute;
  right: clamp(-10px, -.4vw, 0px);
  bottom: 0;
  z-index: 3;
  margin: 0;
  display: flex;
  align-items: flex-end;
  gap: 4px;
  pointer-events: none;
}
.mascot__img {
  width: clamp(150px, 17vw, 260px);
  height: auto;
  filter: drop-shadow(0 14px 26px rgba(50, 30, 10, .3));
  animation: mascot-float 5.5s ease-in-out infinite;
}
.mascot__cap {
  display: none;
  padding-bottom: 18px;
  text-align: center;
}
.mascot--footer .mascot__cap { text-shadow: 0 1px 8px rgba(255, 246, 232, .85); }
.mascot__name {
  display: block;
  font-family: var(--ff-script);
  font-size: clamp(1.4rem, 1.1rem + .8vw, 1.85rem);
  font-weight: 700;
  color: var(--navy);
}
.mascot__role {
  display: block;
  margin-top: 4px;
  font-size: .62rem;
  font-weight: 600;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: var(--navy-soft);
  line-height: 1.6;
}

/* --- stats --- */
.stats {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin-top: clamp(18px, 2vw, 28px);
  padding: clamp(16px, 1.8vw, 26px) clamp(12px, 2vw, 30px);
  border-radius: var(--r-xl);
  background: linear-gradient(180deg, #FFFCF7 0%, #FEF6EB 100%);
  border: 1px solid rgba(217, 164, 65, .3);
  box-shadow: var(--sh-sm);
}
.stats__item {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
  padding-inline: clamp(6px, 1vw, 18px);
}
.stats__item + .stats__item::before {
  content: "";
  position: absolute;
  left: 0; top: 4px; bottom: 4px;
  width: 1px;
  background: linear-gradient(180deg, rgba(217,164,65,0), rgba(217,164,65,.55), rgba(217,164,65,0));
}
.stats__icon { color: var(--gold-dk); flex: none; }
.stats__icon svg { width: 32px; height: 32px; }
.stats__body { display: flex; flex-direction: column; min-width: 0; }
.stats__num {
  font-family: var(--ff-serif);
  font-size: clamp(1.1rem, .94rem + .6vw, 1.5rem);
  font-weight: 700;
  color: var(--navy);
  line-height: 1.16;
}
.stats__label { font-size: var(--fs-xs); color: var(--ink-soft); }

/* ==========================================================================
   14. BEYOND A HOLIDAY
   ========================================================================== */
.chips {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: clamp(8px, 1.6vw, 30px);
  margin-bottom: clamp(24px, 2.8vw, 38px);
}
.chip {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  padding: 9px 16px;
  border-radius: var(--r-pill);
  border: 1px solid transparent;
  font-size: var(--fs-xs);
  font-weight: 600;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--navy);
  transition: background var(--t-base), border-color var(--t-base), color var(--t-base), transform var(--t-base);
}
.chip svg { width: 22px; height: 22px; color: var(--gold-dk); transition: transform var(--t-base); }
.chip:hover { transform: translateY(-2px); color: var(--crimson); }
.chip:hover svg { transform: scale(1.12); }
.chip.is-active {
  background: rgba(255, 253, 247, .82);
  border-color: rgba(217, 164, 65, .55);
  box-shadow: var(--sh-xs);
}

.holiday-card {
  position: relative;
  height: 100%;
  border-radius: var(--r-lg);
  background: var(--card);
  box-shadow: var(--sh-sm);
  overflow: hidden;
  text-align: center;
  transition: transform var(--t-base), box-shadow var(--t-base);
}
.holiday-card:hover { transform: translateY(-9px); box-shadow: var(--sh-lg); }
.holiday-card__media { position: relative; aspect-ratio: 4 / 3; overflow: hidden; }
.holiday-card__media img {
  width: 100%; height: 100%;
  object-fit: cover;
  transition: transform .8s cubic-bezier(.22, .61, .36, 1);
}
.holiday-card:hover .holiday-card__media img { transform: scale(1.1); }
.holiday-card__icon {
  position: relative;
  z-index: 2;
  margin: -30px auto 0;
  display: grid;
  place-items: center;
  width: 60px; height: 60px;
  border-radius: 50%;
  background: var(--card);
  border: 1px solid rgba(217, 164, 65, .45);
  color: var(--gold-dk);
  box-shadow: 0 6px 16px rgba(60, 38, 8, .16);
  transition: transform var(--t-base), background var(--t-base), color var(--t-base);
}
.holiday-card__icon svg { width: 28px; height: 28px; }
.holiday-card:hover .holiday-card__icon { transform: translateY(-4px) scale(1.06); background: var(--grad-gold); color: var(--navy-deep); }
.holiday-card { display: flex; flex-direction: column; }
.holiday-card__body { padding: 14px clamp(16px, 1.8vw, 26px) clamp(20px, 2.2vw, 28px); }
.holiday-card__title {font-size: 17px}
.holiday-card__text { margin-top: 8px; font-size: var(--fs-sm); color: var(--ink); }
.holiday-card .link-cta { margin-top: 14px; }

/* ==========================================================================
   15. CONTACT FORM
   ========================================================================== */
.contact__grid {
  display: grid;
  grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr);
  gap: clamp(20px, 3vw, 46px);
  align-items: start;
}

.contact__info { display: grid; gap: 14px; }
.contact__info li {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 16px 18px;
  border-radius: var(--r-md);
  background: rgba(255, 253, 248, .8);
  border: 1px solid rgba(217, 164, 65, .3);
  box-shadow: var(--sh-xs);
  transition: transform var(--t-base), box-shadow var(--t-base), border-color var(--t-base);
}
.contact__info li:hover { transform: translateX(5px); box-shadow: var(--sh-sm); border-color: rgba(217, 164, 65, .6); }
.contact__ico {
  display: grid;
  place-items: center;
  flex: none;
  width: 46px; height: 46px;
  border-radius: 50%;
  background: linear-gradient(145deg, rgba(247, 223, 160, .6), rgba(247, 223, 160, .2));
  color: var(--gold-dk);
}
.contact__ico svg { width: 22px; height: 22px; }
.contact__info span strong {
  display: block;
  font-size: var(--fs-sm);
  font-weight: 600;
  color: var(--navy);
}
.contact__info span { font-size: var(--fs-xs); color: var(--ink-soft); line-height: 1.6; }

.form {
  padding: clamp(20px, 2.6vw, 36px);
  border-radius: var(--r-xl);
  background: var(--card);
  border: 1px solid rgba(217, 164, 65, .28);
  box-shadow: var(--sh-md);
}
.form__row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(12px, 1.4vw, 20px); }
.form__row + .form__row,
.form__row + .field,
.form > .field + .field { margin-top: clamp(12px, 1.4vw, 20px); }
.form .btn { margin-top: clamp(16px, 1.8vw, 24px); }

.field { position: relative; }
.field__input {
  width: 100%;
  padding: 22px 16px 10px 46px;
  border-radius: var(--r-md);
  border: 1.5px solid rgba(217, 164, 65, .38);
  background: #FFFDFA;
  font-size: var(--fs-sm);
  color: var(--navy);
  transition: border-color var(--t-fast), box-shadow var(--t-fast), background var(--t-fast);
}
.field__input--area { padding-top: 26px; min-height: 124px; line-height: 1.6; }
.field__input--select { padding-top: 22px; cursor: pointer; }
.field__input:hover { border-color: rgba(217, 164, 65, .68); }
.field__input:focus {
  outline: none;
  border-color: var(--gold);
  background: #fff;
  box-shadow: 0 0 0 4px rgba(217, 164, 65, .15);
}

.field__label {
  position: absolute;
  left: 46px;
  top: 16px;
  font-size: var(--fs-sm);
  color: var(--ink-soft);
  pointer-events: none;
  transform-origin: left top;
  transition: transform var(--t-fast), color var(--t-fast);
}
.field__input:focus + .field__label,
.field__input:not(:placeholder-shown) + .field__label,
.field__label--static {
  transform: translateY(-10px) scale(.78);
  color: var(--gold-deep);
  font-weight: 600;
}
.field__icon {
  position: absolute;
  left: 16px; top: 18px;
  width: 20px; height: 20px;
  color: var(--gold-dk);
  opacity: .85;
}
.field__icon--top { top: 22px; }

.field__msg {
  min-height: 1.1em;
  margin-top: 5px;
  font-size: .72rem;
  line-height: 1.5;
  color: var(--crimson);
}
.field.is-invalid .field__input { border-color: var(--crimson); box-shadow: 0 0 0 4px rgba(194, 31, 79, .12); }
.field.is-valid .field__input { border-color: #3E9B6B; }
.field.is-valid::after {
  content: "";
  position: absolute;
  right: 16px; top: 20px;
  width: 16px; height: 16px;
  border-radius: 50%;
  background: #3E9B6B;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4.5 12.8l4.8 4.8L19.5 7.4' fill='none' stroke='%23000' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 15px no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4.5 12.8l4.8 4.8L19.5 7.4' fill='none' stroke='%23000' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 15px no-repeat;
}

.form__status {
  margin-top: 14px;
  padding: 0 14px;
  max-height: 0;
  overflow: hidden;
  border-radius: var(--r-sm);
  font-size: var(--fs-sm);
  font-weight: 500;
  transition: max-height var(--t-base), padding var(--t-base);
}
.form__status.is-shown { max-height: 120px; padding: 12px 14px; }
.form__status.is-success { background: rgba(62, 155, 107, .12); color: #2C7350; }
.form__status.is-error   { background: rgba(194, 31, 79, .1);  color: var(--crimson-dk); }

/* ==========================================================================
   16. FOOTER
   ========================================================================== */
.footer { position: relative; background: linear-gradient(180deg, #FFF9F0 0%, #FEF4E7 100%); }
.footer__grid {
  display: grid;
  grid-template-columns: 1.6fr 1fr 1.2fr 1.2fr 1.5fr;
  gap: clamp(20px, 2.4vw, 40px);
  padding-block: clamp(38px, 4.4vw, 68px) clamp(24px, 3vw, 44px);
}
.footer__grid > * { min-width: 0; }
.logo--footer { margin-bottom: 18px; }
.logo--footer .logo__name { font-size: clamp(1rem, .72rem + .7vw, 1.32rem); }
.logo--footer .logo__tag { font-size: .52rem; letter-spacing: .2em; }
.logo--footer .logo__mark { width: clamp(46px, 3vw, 58px); }
.footer__about { max-width: 34ch; font-size: var(--fs-sm); color: var(--ink); }
.script-note--footer {
  margin-top: 24px;
  font-size: clamp(1.1rem, .86rem + .78vw, 1.62rem);
  white-space: nowrap;
  transform: rotate(-7deg);
  transform-origin: left center;
}

.footer__title {
  margin-bottom: 18px;
  font-size: clamp(1rem, .9rem + .35vw, 1.24rem);
  font-weight: 700;
  color: var(--navy);
}
.footer__list { display: grid; gap: 11px; }
.footer__list a {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: var(--fs-sm);
    color: var(--navy);
}
.footer__list svg { width: 18px; height: 18px; color: var(--gold-dk); flex: none; transition: transform var(--t-fast); }
.footer__list--chev svg { width: 15px; height: 15px; transform: rotate(-90deg); }
.footer__list a:hover { color: var(--crimson); }
.footer__list--chev a:hover svg { transform: rotate(-90deg) translateY(-4px); }
.footer__list--ico a:hover svg { transform: scale(1.14); }

.footer__note { max-width: 32ch; font-size: var(--fs-sm); color: var(--ink); }

.newsletter { position: relative; margin-top: 18px; }
.newsletter__icon {
  position: absolute;
  left: 18px; top: 50%;
  width: 20px; height: 20px;
  margin-top: -18px;
  color: var(--gold-dk);
}
.newsletter__input {
  width: 100%;
  padding: 15px 66px 15px 50px;
  border-radius: var(--r-pill);
  border: 1.5px solid rgba(217, 164, 65, .42);
  background: #FFFDFA;
  font-size: var(--fs-sm);
  transition: border-color var(--t-fast), box-shadow var(--t-fast);
}
.newsletter__input:focus { outline: none; border-color: var(--gold); box-shadow: 0 0 0 4px rgba(217, 164, 65, .15); }
.newsletter__btn {
    position: absolute;
    right: 5px;
    top: 50%;
    display: grid;
    place-items: center;
    width: 42px;
    height: 42px;
    margin-top: -31px;
    border-radius: 50%;
    background: var(--grad-gold);
    color: var(--navy-deep);
    box-shadow: var(--sh-gold);
    transition: transform var(--t-base), filter var(--t-base);
}
.newsletter__btn svg { width: 19px; height: 19px; }
.newsletter__btn:hover { transform: scale(1.07) translateX(2px); filter: brightness(1.05); }
.newsletter__msg { margin-top: 8px; padding-left: 18px; font-size: .72rem; min-height: 1em; }
.newsletter__msg.is-error { color: var(--crimson); }
.newsletter__msg.is-success { color: #2C7350; }
.social {
    display: flex;
    gap: 12px;
    margin-top: 0;
}
.social__link {
  display: grid;
  place-items: center;
  width: 44px; height: 44px;
  border-radius: 50%;
  border: 1.5px solid rgba(217, 164, 65, .55);
  color: var(--gold-dk);
  transition: background var(--t-base), color var(--t-base), transform var(--t-base), box-shadow var(--t-base);
}
.social__link svg { width: 20px; height: 20px; }
.social__link:hover {
  background: var(--grad-gold);
  color: var(--navy-deep);
  transform: translateY(-4px);
  box-shadow: var(--sh-gold);
}
.script-note--pink { margin-top: 24px; transform: rotate(-8deg); transform-origin: left center; }

/* --- footer scene --- */
.footer-scene {
  position: relative;
  min-height: clamp(230px, 24vw, 380px);
  isolation: isolate;
  overflow: hidden;
}
.footer-scene__img {
  position: absolute;
  inset: 0;
  z-index: -2;
  width: 100%; height: 100%;
  object-fit: cover;
  object-position: center 62%;
  filter: saturate(1.08) brightness(1.04);
}
.footer-scene__veil {
  position: absolute;
  inset: 0;
  z-index: -1;
  background:
    linear-gradient(180deg, rgba(255, 246, 233, .97) 0%, rgba(255, 243, 229, .62) 22%, rgba(255, 240, 224, .42) 58%, rgba(255, 236, 214, .3) 78%, rgba(35, 43, 58, .42) 100%);
}
.footer-scene__inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  padding-top: clamp(16px, 2vw, 28px);
  text-align: center;
}
.footer-scene__kicker {
  font-size: var(--fs-eyebrow);
  font-weight: 600;
  letter-spacing: .34em;
  text-transform: uppercase;
  color: var(--navy);
}
.mascot--footer {
  left: clamp(-6px, 1vw, 34px);
  right: auto;
  align-items: flex-end;
}
.mascot--footer .mascot__img { width: clamp(140px, 16vw, 250px); }
.mascot--footer .mascot__cap { display: block; }

/* --- footer bar --- */
.footer-bar {
  position: relative;
  background: linear-gradient(180deg, var(--footer-bg) 0%, var(--footer-bg-2) 100%);
  color: rgba(255, 250, 242, .88);
}
.footer-bar__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 16px;
  padding-block: 20px;
}
.footer-bar__copy { font-size: var(--fs-xs); }
.footer-bar__links { display: flex; align-items: center; flex-wrap: wrap; gap: 14px; }
.footer-bar__links li {display: flex; align-items: center; gap: 14px; font-size: var(--fs-xs); }
.footer-bar__links li + li:not(:nth-child(1))::before {
  content: "";
  width: 1px; height: 13px;
  background: rgba(255, 250, 242, .3);
}
.footer-bar__links li + li:not(:nth-child(2))::before {
  content: "";
  width: 1px; height: 13px;
  background: rgba(255, 250, 242, .3);
}
.footer-bar__links a { color: rgba(255, 250, 242, .85); }
.footer-bar__links a:hover { color: var(--gold-lt); }
.footer-bar__brand {display: flex; align-items: center; gap: 12px; line-height: 1.05;}
.footer-bar__amazing {
  font-family: var(--ff-script);
  font-size: 1rem;
  font-weight: 700;
  color: var(--crimson-lt);
  align-self: flex-start;
}
.footer-bar__thailand {
  font-family: var(--ff-sans);
  font-size: 1.28rem;
  font-weight: 700;
  letter-spacing: .02em;
  color: #E9E4F2;
}
.footer-bar__sep { width: 1px; height: 30px; background: rgba(255, 250, 242, .3); }
.footer-bar__slogan {
  font-size: .62rem;
  font-weight: 600;
  letter-spacing: .26em;
  text-transform: uppercase;
  color: var(--gold-lt);
  line-height: 1.7;
}

/* ==========================================================================
   17. SLIDER ENGINE
   ========================================================================== */
.slider { position: relative; }
.slider__viewport { overflow: hidden; margin-inline: -8px; padding: 8px; }
.slider__track {
  display: flex;
  align-items: stretch;
  gap: var(--slide-gap, 20px);
  transition: transform .55s cubic-bezier(.22, .61, .36, 1);
  will-change: transform;
}
.slider.is-dragging .slider__track { transition: none; cursor: grabbing; }
.slider__slide {
  flex: 0 0 auto;
  width: var(--slide-w, 100%);
  min-width: 0;
}
.slider__slide > * { height: 100%; }

.slider__nav {
  position: absolute;
  top: 44%;
  z-index: 5;
  display: none;
  place-items: center;
  width: 46px; height: 46px;
  border-radius: 50%;
  border: 1.5px solid rgba(217, 164, 65, .6);
  background: rgba(255, 253, 248, .92);
  color: var(--gold-dk);
  box-shadow: var(--sh-sm);
  transition: background var(--t-base), color var(--t-base), transform var(--t-base), opacity var(--t-base);
}
.slider__nav svg { width: 19px; height: 19px; }
.slider__nav--prev { left: calc(var(--gutter) * -1 + -20px); }
.slider__nav--next { right: calc(var(--gutter) * -1 + -20px); }
.slider__nav:hover { background: var(--grad-gold); color: var(--navy-deep); }
.slider__nav[disabled] { opacity: .32; cursor: default; }
.slider.is-navigable .slider__nav { display: grid; }

.slider__dots {
  display: none;
  align-items: center;
  justify-content: center;
  gap: 9px;
  margin-top: 22px;
}
.slider.is-navigable .slider__dots { display: flex; }
.slider__dot {
  width: 9px; height: 9px;
  border-radius: var(--r-pill);
  background: rgba(217, 164, 65, .35);
  transition: width var(--t-base), background var(--t-base);
}
.slider__dot.is-active { width: 28px; background: var(--grad-gold); }

/* ==========================================================================
   18. BACK TO TOP
   ========================================================================== */
.to-top {
  position: fixed;
  right: clamp(14px, 2vw, 28px);
  bottom: clamp(14px, 2vw, 28px);
  z-index: 110;
  display: grid;
  place-items: center;
  width: 48px; height: 48px;
  border-radius: 50%;
  background: var(--grad-gold);
  color: var(--navy-deep);
  box-shadow: var(--sh-gold);
  opacity: 0;
  visibility: hidden;
  transform: translateY(18px) scale(.85);
  transition: opacity var(--t-base), transform var(--t-base), visibility var(--t-base);
}
.to-top svg { width: 21px; height: 21px; transform: rotate(180deg); }
.to-top.is-visible { opacity: 1; visibility: visible; transform: translateY(0) scale(1); }
.to-top:hover { transform: translateY(-4px) scale(1.06); }




.thai-journeys,.thai-journeys *{box-sizing:border-box}
.thai-journeys{width:100%;padding:50px 5.2% 40px;background:#fff;color:#09266b}
.thai-journeys .tj-heading{text-align:center;margin:0 auto 38px}
.thai-journeys .tj-eyebrow{display:flex;align-items:center;justify-content:center;gap:22px;margin-bottom:10px;font-size:12px;letter-spacing:3px;font-weight:700;color:#09266b}
.thai-journeys .tj-eyebrow:before,.thai-journeys .tj-eyebrow:after{content:"";width:54px;height:1px;background:#d88b28}
.thai-journeys .tj-heading h2{margin:0;font-size:2rem;line-height:1.12;font-weight:700;letter-spacing:-1.5px;color:#09266b}
.thai-journeys .tj-heading h2 span{color:#bd7617; font-size: 2rem;}
.thai-journeys .tj-subtitle{margin:8px 0 0;font-size:17px;line-height:1.5;color:#09266b}
.thai-journeys .tj-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:17px;max-width:1500px;margin:auto}
.thai-journeys .tj-card{min-width:0;overflow:hidden;border:1px solid #f1e9df;border-radius:16px;background:#fff;box-shadow:0 3px 12px rgba(23,35,65,.035);transition:transform .25s ease,box-shadow .25s ease}
.thai-journeys .tj-card:hover{transform:translateY(-5px);box-shadow:0 12px 28px rgba(23,35,65,.12)}
.thai-journeys .tj-photo{height:190px;position:relative;overflow:hidden;background:#edf2f6}
.thai-journeys .tj-photo img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .4s ease}
.thai-journeys .tj-card:hover .tj-photo img{transform:scale(1.05)}
.thai-journeys .tj-badge{position:absolute;top:12px;left:12px;display:inline-flex;align-items:center;g1(100% - 24px);padding:3px 10px;border-radius:30px;background:#ed1450;color:#fff;font-size:12px;font-weight:600;white-space:nowrap}
.thai-journeys .tj-badge.tj-blue{background:#09266b}
.thai-journeys .tj-badge.tj-gold{background:#a96508}
.thai-journeys .tj-badge .tj-symbol{font-size:17px}
.thai-journeys .tj-content{padding:12px 17px 17px;position:relative}
.thai-journeys .tj-title{margin:0 0 7px;serif;font-size:clamp(17px,1.45vw,18px);font-weight:700;line-height:1.25;color:#09266b}
.thai-journeys .tj-duration{display:flex;align-items:center;gap:10px;margin-bottom:10px;font-size:14px;color:#09266b}
.thai-journeys .tj-sun{font-size:22px;line-height:1;color:#e58a00}
.thai-journeys .tj-price{display:flex;flex-wrap:wrap;align-items:baseline;gap:5px;margin:0 0 11px}
.thai-journeys .tj-from{font-size:17px;color:#c87912}
.thai-journeys .tj-amount{font-size:clamp(20px,1.8vw,22px);font-weight:700;letter-spacing:-.6px;color:#ec1450;white-space:nowrap}
.thai-journeys .tj-person{margin-left:5px;font-size:13px;color:#73809c}
.thai-journeys .tj-bottom{display:flex;align-items:flex-end;justify-content:space-between;gap:5px}
.thai-journeys .tj-features{list-style:none;padding:0;margin:0;flex:1;min-width:0}
.thai-journeys .tj-features li{position:relative;padding-left:26px;margin:0 0 5px;font-size:14px;line-height:1.25;color:#102b68}
.thai-journeys .tj-features li:last-child{margin-bottom:0}
.thai-journeys .tj-features li:before{content:"✓";position:absolute;left:0;top:-1px;font-size:19px;line-height:1;color:#c8780c;font-weight:700}
.thai-journeys .tj-arrow{flex:0 0 46px;width:46px;height:46px;display:flex;align-items:center;justify-content:center;border:1.5px solid #df8300;border-radius:50%;color:#bd7617;text-decoration:none;font-size:27px;line-height:1;transition:background .2s,color .2s;align-self:flex-end}
.thai-journeys .tj-arrow:hover{background:#c87912;color:#fff}
.thai-journeys .tj-arrow:focus-visible{outline:3px solid #09266b;outline-offset:3px}
.thai-journeys .tj-arrow span{transform:translateY(-1px)}
@media(min-width:1500px){.thai-journeys .tj-photo{height:210px}.thai-journeys .tj-content{padding:15px 20px 19px}}
@media(max-width:1100px){.thai-journeys{padding:40px 4%}.thai-journeys .tj-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:22px}.thai-journeys .tj-photo{height:230px}.thai-journeys .tj-title{font-size:22px}.thai-journeys .tj-amount{font-size:27px}}
@media(max-width:600px){.thai-journeys{padding:32px 15px}.thai-journeys .tj-heading{margin-bottom:25px}.thai-journeys .tj-eyebrow{gap:9px;font-size:9px;letter-spacing:1.5px}.thai-journeys .tj-eyebrow:before,.thai-journeys .tj-eyebrow:after{width:23px}.thai-journeys .tj-heading h2{font-size:32px;letter-spacing:-.8px}.thai-journeys .tj-subtitle{font-size:14px;max-width:340px;margin:9px auto 0}.thai-journeys .tj-grid{grid-template-columns:1fr;gap:19px;max-width:430px}.thai-journeys .tj-photo{height:220px}.thai-journeys .tj-content{padding:14px 16px 17px}.thai-journeys .tj-title{font-size:23px}.thai-journeys .tj-amount{font-size:27px}.thai-journeys .tj-features li{font-size:14px}.thai-journeys .tj-arrow{width:44px;height:44px;flex-basis:44px}}
@media(prefers-reduced-motion:reduce){.thai-journeys .tj-card,.thai-journeys .tj-photo img,.thai-journeys .tj-arrow{transition:none}}

.signing-block a {
    border: 1px #daa544 solid;
    background-color: #f6eee5;
    color: #11265e;
    padding: 10px 15px;
    font-size: 16px;
    border-radius: 90px;
}
.signing-block a:hover{
    border: 1px #c21f4f solid;
    background-color: #c21f4f;
    color: #fff;
}




.thdest-section{width:100%;padding:5rem 0 4rem 0;background:#fff7ed;color:#102957;box-sizing:border-box}
.thdest-section *{box-sizing:border-box}
.thdest-header{position:relative;text-align:center;margin-bottom:20px}
.thdest-section .thdest-title{font-size:2rem;line-height:1.15;font-weight:700;color:#102957;margin:0}
.thdest-section .thdest-title span{color:#d7375a}
.thdest-section .thdest-subtitle{font-size:15px;line-height:1.5;margin:5px 0 30px;color:#203a65}
.thdest-section .thdest-view-all{position:absolute;right:1%;top:15px;display:inline-flex;align-items:center;justify-content:center;gap:12px;padding:7px 20px;border:1px solid #d9a536;border-radius:50px;color:#102957;text-decoration:none;font-size:14px;font-weight:700;white-space:nowrap;transition:all .3s}
.thdest-section .thdest-view-all span{font-size:20px}
.thdest-section .thdest-view-all:hover{background:#102957;color:#fff;border-color:#102957}
.thdest-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.thdest-section .thdest-card{position:relative;display:flex;align-items:flex-end;min-width:0;height:190px;overflow:hidden;border-radius:13px;background:#173c54;text-decoration:none!important;color:#fff;isolation:isolate}
.thdest-section .thdest-image{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;z-index:-2;transition:transform .45s ease}
.thdest-section .thdest-card:after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(0,0,0,.78),rgba(0,0,0,.2) 48%,transparent);z-index:-1;pointer-events:none}
.thdest-section .thdest-card:hover .thdest-image{transform:scale(1.07)}
.thdest-content{position:relative;width:100%;padding:16px 18px;display:flex;align-items:flex-end;justify-content:space-between;gap:8px;z-index:1}
.thdest-info{min-width:0}
.thdest-section .thdest-name{display:flex;align-items:center;gap:9px;font-size:18px;line-height:1.3;font-weight:500;margin:0 0 5px;color:#fff}
.thdest-pin{width:17px;height:21px;flex-shrink:0;fill:#fff}
.thdest-section .thdest-description{font-size:13px;line-height:1.4;color:#fff;margin:0}
.thdest-arrow{width:49px;height:49px;flex-shrink:0;border:1.5px solid #fff;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:29px;font-weight:300;transition:all .3s;color:#fff}
.thdest-section .thdest-card:hover .thdest-arrow{background:#fff;color:#102957;transform:translateX(3px)}
@media(max-width:1100px){
.thdest-section{padding-left:3%;padding-right:3%}
.thdest-section .thdest-title{font-size:38px}
.thdest-section .thdest-view-all{position:static;margin-top:14px;padding:12px 23px}
.thdest-header{margin-bottom:22px}
.thdest-section .thdest-card{height:190px}
.thdest-content{padding:14px}
.thdest-section .thdest-name{font-size:18px}
.thdest-section .thdest-description{font-size:13px}
.thdest-arrow{width:40px;height:40px;font-size:25px}
}
@media(max-width:760px){
.thdest-section{padding:28px 16px}
.thdest-section .thdest-title{font-size:34px}
.thdest-section .thdest-subtitle{font-size:14px;line-height:1.6;max-width:450px;margin:8px auto 0}
.thdest-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.thdest-section .thdest-card{height:190px}
.thdest-content{padding:12px;gap:6px}
.thdest-section .thdest-name{font-size:17px;gap:6px}
.thdest-pin{width:15px;height:19px}
.thdest-section .thdest-description{font-size:12px}
.thdest-arrow{width:35px;height:35px;font-size:23px}
}
@media(max-width:420px){
.thdest-section{padding:24px 12px}
.thdest-section .thdest-title{font-size:30px}
.thdest-grid{grid-template-columns:1fr;gap:14px}
.thdest-section .thdest-card{height:210px}
.thdest-content{padding:16px}
.thdest-section .thdest-name{font-size:20px}
.thdest-section .thdest-description{font-size:14px}
.thdest-arrow{width:43px;height:43px}
}
@media(prefers-reduced-motion:reduce){
.thdest-section .thdest-image,.thdest-arrow{transition:none}
}

.thdest-slider{position:relative}
.thdest-grid{display:grid;grid-auto-flow:column;grid-auto-columns:calc((100% - 72px)/4);grid-template-columns:none;gap:24px;overflow-x:auto;scroll-behavior:smooth;scroll-snap-type:x mandatory;scrollbar-width:none;-webkit-overflow-scrolling:touch;padding:2px 1px 8px}
.thdest-grid::-webkit-scrollbar{display:none}
.thdest-card{position:relative;display:block;min-width:0;overflow:hidden;border-radius:14px;background:#f5f5f5;text-decoration:none;color:#222;scroll-snap-align:start}
.thdest-image{display:block;width:100%;height:300px;object-fit:cover;transition:transform .4s ease}
.thdest-card:hover .thdest-image{transform:scale(1.05)}
.thdest-content{position:absolute;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:40px 18px 18px;color:#fff;background:linear-gradient(transparent,rgba(0,0,0,.8))}
.thdest-info{min-width:0}
.thdest-name{display:flex;align-items:center;gap:7px;margin:0 0 6px;font-size:21px;font-weight:700;color:#fff}
.thdest-pin{width:17px;height:17px;flex-shrink:0;fill:currentColor}
.thdest-description{margin:0;font-size:13px;line-height:1.5;color:#fff}
.thdest-arrow{display:flex;align-items:center;justify-content:center;flex-shrink:0;width:34px;height:34px;border:1px solid rgba(255,255,255,.7);border-radius:50%;font-size:20px;color:#fff;transition:all .3s ease}
.thdest-card:hover .thdest-arrow{background:#fff;color:#222}
.thdest-nav{position:absolute;z-index:2;top:50%;display:flex;align-items:center;justify-content:center;width:44px;height:44px;padding:0;transform:translateY(-50%);border:1px solid #ddd;border-radius:50%;background:#fff;color:#222;font-size:24px;line-height:1;cursor:pointer;box-shadow:0 3px 12px rgba(0,0,0,.15);transition:background .25s,color .25s,border-color .25s}
.thdest-prev{left:-58px; border: 1.5px solid #a87b22; background: #fff; color: var(--gold-dk);}
.thdest-next{right:-58px}
.thdest-nav:hover{border: 1.5px solid rgba(217, 164, 65, .6); background: rgba(255, 253, 248, .92); color: var(--gold-dk); box-shadow: var(--sh-sm); transition: background var(--t-base), color var(--t-base), transform var(--t-base), opacity var(--t-base);}
.thdest-nav:disabled{opacity:.35;cursor:not-allowed}
@media(max-width:991px){
  .thdest-grid{grid-auto-columns:calc((100% - 24px)/2);gap:24px}
  .thdest-image{height:280px}
  .thdest-prev{left:-15px}
  .thdest-next{right:-15px}
}
@media(max-width:575px){
  .thdest-section{padding:40px 0}
  .thdest-title{font-size:28px}
  .thdest-subtitle{font-size:14px}
  .thdest-grid{grid-auto-columns:85%;gap:16px}
  .thdest-image{height:280px}
  .thdest-nav{width:38px;height:38px;font-size:21px}
  .thdest-prev{left:8px}
  .thdest-next{right:8px}
  .thdest-content{padding:35px 14px 15px}
  .thdest-name{font-size:19px}
}

.view-all-category{background-color: #c21f4f; color: #fff !important;}
.view-all-category:hover{background-color: #11265e !important; background: linear-gradient(90deg, rgb(17 38 94), rgb(17 38 94)) !important;}



.th-dest-section{padding:50px 0;background:#f8f9fb}
.th-dest-container{width:100%;max-width:1320px;margin:0 auto;padding:0 15px}
.th-dest-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px}
.th-dest-card{display:block;overflow:hidden;background:#fff;border:1px solid #e8eaf0;border-radius:12px;text-decoration:none!important;color:#222;box-shadow:0 4px 16px rgba(0,0,0,.05);transition:transform .3s ease,box-shadow .3s ease}
.th-dest-card:hover{transform:translateY(-5px);box-shadow:0 12px 28px rgba(0,0,0,.12)}
.th-dest-image{display:block;width:100%;height:210px;object-fit:cover;transition:transform .4s ease}
.th-dest-card:hover .th-dest-image{transform:scale(1.04)}
.th-dest-card{isolation:isolate}
.th-dest-content {
    position: relative;
    padding: 12px 20px;
    background: #fff;
}
.th-dest-title{margin:0;font-size:17px;line-height:1.4;font-weight:500;color:#222}
.th-dest-url{display:block;overflow-wrap:anywhere;font-size:13px;line-height:1.5;color:#6b7280}
.th-dest-card:hover .th-dest-title{color:#d97706}
@media(max-width:991px){.th-dest-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.th-dest-image{height:190px}}
@media(max-width:767px){.th-dest-section{padding:30px 0}.th-dest-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.th-dest-image{height:150px}.th-dest-content{padding:12px}.th-dest-title{font-size:16px}.th-dest-url{font-size:11px}}
@media(max-width:380px){.th-dest-grid{grid-template-columns:1fr}.th-dest-image{height:200px}}


.pkg-intro{padding-bottom: 2rem;}