/* ==========================================================================
   Magic Morocco Tours — design system
   Palette taken from the logo: deep Majorelle-navy, brushed gold, warm sand.
   ========================================================================== */

:root {
  --navy-900: #0a1c2b;
  --navy-800: #0d2436;
  --navy-700: #12344d;
  --teal: #0e4a63;
  --gold: #b67a2a;
  --gold-600: #9c6620;
  --gold-300: #e2b566;
  --terracotta: #c2562b;
  --sand-50: #fdfaf4;
  --sand-100: #f8f1e4;
  --sand-200: #efe3cf;
  --ink: #17232e;
  --text: #414b55;
  --muted: #6b747d;
  --white: #fff;
  --wa: #1fa855;

  --font-display: "Playfair Display", Georgia, "Times New Roman", serif;
  --font-body: "Poppins", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  --font-script: "Caveat", "Segoe Script", cursive;

  --radius: 14px;
  --radius-lg: 22px;
  --shadow-sm: 0 2px 10px rgba(16, 35, 52, .07);
  --shadow: 0 14px 40px rgba(16, 35, 52, .13);
  --container: 1240px;
  --gutter: clamp(18px, 4vw, 40px);
  --header-h: 72px;
}

/* ---------- Base ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; scroll-padding-top: calc(var(--header-h) + 12px); }
body {
  margin: 0;
  font-family: var(--font-body);
  font-size: 16px;
  line-height: 1.65;
  color: var(--text);
  background: var(--sand-50);
  -webkit-font-smoothing: antialiased;
}
img, picture, svg { display: block; max-width: 100%; }
img { height: auto; }
a { color: inherit; text-decoration: none; }
ul { margin: 0; padding: 0; list-style: none; }
p { margin: 0 0 1em; }
h1, h2, h3 { margin: 0; font-family: var(--font-display); color: var(--ink); line-height: 1.15; font-weight: 700; }
h2 { font-size: clamp(1.75rem, 1.1rem + 2.1vw, 2.6rem); letter-spacing: -.01em; }
button, input, select { font: inherit; color: inherit; }
button { cursor: pointer; }
:focus-visible { outline: 3px solid var(--gold-300); outline-offset: 3px; border-radius: 4px; }

.container { width: 100%; max-width: calc(var(--container) + var(--gutter) * 2); margin-inline: auto; padding-inline: var(--gutter); }
.section { padding-block: clamp(56px, 7vw, 104px); }
.sprite { position: absolute; width: 0; height: 0; overflow: hidden; }
.icon { width: 1.25em; height: 1.25em; flex: none; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.icon .fill, symbol .fill { fill: currentColor; stroke: none; }
.skip-link { position: absolute; left: 12px; top: -60px; z-index: 200; background: var(--navy-800); color: #fff; padding: 10px 16px; border-radius: 8px; }
.skip-link:focus { top: 12px; }

.eyebrow {
  display: inline-flex; align-items: center; gap: 12px;
  margin: 0 0 14px;
  font-size: .74rem; font-weight: 600; letter-spacing: .2em; text-transform: uppercase;
  color: var(--gold-600);
}
.eyebrow::after { content: ""; width: 34px; height: 1px; background: currentColor; opacity: .7; }
.eyebrow-light { color: var(--gold-300); }

/* ---------- Buttons & links ---------- */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 10px;
  min-height: 50px; padding: 12px 26px;
  border: 1.5px solid transparent; border-radius: 10px;
  font-weight: 600; font-size: .95rem; line-height: 1.2; white-space: nowrap;
  transition: background-color .2s, color .2s, border-color .2s, transform .2s, box-shadow .2s;
}
.btn .icon { transition: transform .2s; }
.btn:hover .icon:last-child { transform: translateX(3px); }
.btn-gold { background: linear-gradient(135deg, #c08631, #a66e22); color: #fff; box-shadow: 0 8px 20px rgba(166, 110, 34, .28); }
.btn-gold:hover { background: linear-gradient(135deg, #a9722a, #8e5b19); transform: translateY(-1px); }
.btn-outline { border-color: var(--navy-800); color: var(--navy-800); }
.btn-outline:hover { background: var(--navy-800); color: #fff; }
.btn-ghost { border-color: rgba(255, 255, 255, .75); color: #fff; background: rgba(10, 28, 43, .25); backdrop-filter: blur(4px); }
.btn-ghost:hover { background: #fff; color: var(--navy-800); }
.btn-wa { background: var(--wa); color: #fff; }
.btn-wa:hover { background: #17904a; }

.text-link { display: inline-flex; align-items: center; gap: 8px; font-weight: 600; font-size: .92rem; color: var(--gold-600); white-space: nowrap; }
.text-link .icon { transition: transform .2s; }
.text-link:hover .icon { transform: translateX(4px); }
.text-link-light { color: #fff; }

.round-btn, .round-link {
  display: inline-grid; place-items: center; width: 42px; height: 42px; flex: none;
  border-radius: 50%; transition: background-color .2s, color .2s, transform .2s;
}
.round-btn { border: 1.5px solid rgba(255, 255, 255, .55); background: transparent; color: #fff; }
.round-btn:hover { background: #fff; color: var(--navy-800); }
.round-link { background: var(--gold); color: #fff; }
.round-link:hover { background: var(--navy-800); transform: translateX(2px); }

/* ---------- Top bar ---------- */
.topbar { background: var(--navy-900); color: rgba(255, 255, 255, .82); font-size: .76rem; }
.topbar-inner { display: flex; align-items: center; justify-content: space-between; gap: 20px; min-height: 38px; }
.topbar-note { display: flex; align-items: center; gap: 8px; margin: 0; letter-spacing: .06em; }
.topbar-links { display: flex; align-items: center; }
.topbar-links li + li { margin-left: 18px; padding-left: 18px; border-left: 1px solid rgba(255, 255, 255, .18); }
.topbar-links a { display: flex; align-items: center; gap: 8px; transition: color .2s; }
.topbar-links a:hover { color: var(--gold-300); }
.topbar .icon { width: 15px; height: 15px; color: var(--gold-300); }

/* ---------- Header ---------- */
.site-header { position: sticky; top: 0; z-index: 100; background: linear-gradient(180deg, rgba(250, 242, 226, .98), rgba(244, 232, 210, .98)); backdrop-filter: blur(12px); transition: box-shadow .25s; }
.site-header::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 1px; background: linear-gradient(90deg, transparent, rgba(182, 122, 42, .55) 20%, rgba(182, 122, 42, .55) 80%, transparent); }
.site-header.is-stuck { box-shadow: 0 10px 30px rgba(16, 35, 52, .1); }
.header-inner { display: flex; align-items: center; justify-content: space-between; gap: 14px; min-height: var(--header-h); }
.brand { display: flex; align-items: center; flex: none; }
.brand img { width: auto; height: 88px; margin-block: 2px; }
.mobile-nav-logo { width: auto; height: 64px; }

.main-nav { align-self: stretch; }
.main-nav > ul { display: flex; align-items: stretch; height: 100%; gap: clamp(0px, .3vw, 6px); }
.main-nav > ul > li { display: flex; align-items: center; }
.main-nav > ul > li > a { position: relative; display: flex; align-items: center; gap: 6px; height: 100%; padding: 0 9px; font-size: .76rem; font-weight: 700; letter-spacing: .07em; text-transform: uppercase; white-space: nowrap; color: var(--navy-800); transition: color .2s; }
.main-nav > ul > li > a .icon { width: .95em; height: .95em; stroke-width: 2.4; color: var(--gold); transition: transform .25s; }
.main-nav > ul > li > a::after { content: ""; position: absolute; left: 9px; right: 9px; bottom: 0; height: 3px; border-radius: 3px 3px 0 0; background: linear-gradient(90deg, #c08631, #e2b566); transform: scaleX(0); transform-origin: center; transition: transform .28s ease; }
.main-nav > ul > li > a:hover, .main-nav > ul > li:focus-within > a, .main-nav > ul > li > a[aria-current="page"] { color: var(--gold-600); }
.main-nav > ul > li > a:hover::after, .main-nav > ul > li > a[aria-current="page"]::after { transform: scaleX(1); }

.header-inner { position: relative; }
.has-mega { position: static; }
.mega { position: absolute; top: 100%; left: 0; right: 0; z-index: 10; opacity: 0; visibility: hidden; transform: translateY(12px); transition: opacity .25s ease, transform .25s ease, visibility .25s; pointer-events: none; }
.has-mega:hover .mega, .has-mega:focus-within .mega { opacity: 1; visibility: visible; transform: none; pointer-events: auto; }
.has-mega:hover > a .icon, .has-mega:focus-within > a .icon { transform: rotate(180deg); }
.main-nav > ul > li.has-mega:hover > a { color: var(--gold-600); }
.main-nav > ul > li.has-mega:hover > a::after { transform: scaleX(1); }
.mega-inner { display: grid; grid-template-columns: 290px minmax(0, 1fr) 300px; background: #fff; border-top: 3px solid var(--gold); border-radius: 0 0 22px 22px; box-shadow: 0 30px 70px rgba(10, 28, 43, .28); overflow: hidden; }

.mega-intro {
  position: relative; display: flex; flex-direction: column; align-items: flex-start; padding: 32px 30px; color: rgba(255, 255, 255, .84);
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='80' height='80' viewBox='0 0 80 80'%3E%3Cpath d='M40 6l10 24 24 10-24 10-10 24-10-24L6 40l24-10z' fill='none' stroke='%23e2b566' stroke-opacity='.13' stroke-width='1'/%3E%3Crect x='26' y='26' width='28' height='28' fill='none' stroke='%23e2b566' stroke-opacity='.13' stroke-width='1' transform='rotate(45 40 40)'/%3E%3C/svg%3E") 0 0 / 80px 80px,
    radial-gradient(120% 90% at 100% 0%, rgba(14, 74, 99, .8), transparent 60%),
    linear-gradient(180deg, var(--navy-800), var(--navy-900));
}
.mega-eyebrow { margin: 0 0 10px; font-size: .68rem; font-weight: 600; letter-spacing: .2em; text-transform: uppercase; color: var(--gold-300); }
.mega-title { margin: 0 0 12px; font-family: var(--font-display); font-size: 1.85rem; font-weight: 700; line-height: 1.1; color: #fff; }
.mega-text { margin: 0 0 24px; font-size: .86rem; line-height: 1.6; }
.mega-intro .btn { margin-top: auto; min-height: 44px; padding: 10px 20px; font-size: .84rem; border-radius: 999px; }

.mega-links { display: grid; grid-template-columns: 1fr 1fr; align-content: center; gap: 4px 10px; padding: 22px 20px; }
.mega-links-3 { grid-template-columns: repeat(3, 1fr); gap: 4px; padding-inline: 14px; }
.mega-links-3 a { gap: 12px; padding: 9px 10px; }
.mega-links-3 .mega-link-desc { font-size: .73rem; }
.mega-links a { display: flex; align-items: center; gap: 14px; padding: 10px 12px; border-radius: 14px; transition: background-color .2s, transform .2s; }
.mega-links a:hover { background: var(--sand-100); transform: translateX(4px); }
.mega-thumb { position: relative; display: grid; place-items: center; flex: none; width: 50px; height: 60px; border-radius: 999px 999px 8px 8px; overflow: hidden; background: var(--sand-200); color: var(--gold-600); box-shadow: 0 0 0 1.5px rgba(182, 122, 42, .45), 0 0 0 4px #fff, 0 4px 12px rgba(16, 35, 52, .12); transition: box-shadow .2s; }
.mega-thumb img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s; }
.mega-thumb .icon { width: 24px; height: 24px; }
.mega-links a:hover .mega-thumb { box-shadow: 0 0 0 2px var(--gold), 0 0 0 4px #fff, 0 6px 16px rgba(16, 35, 52, .18); }
.mega-links a:hover .mega-thumb img { transform: scale(1.12); }
.mega-link-text { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.mega-link-title { font-size: .92rem; font-weight: 700; color: var(--ink); line-height: 1.3; transition: color .2s; }
.mega-links a:hover .mega-link-title { color: var(--gold-600); }
.mega-link-desc { font-size: .76rem; color: var(--muted); line-height: 1.35; }
.mega-links-cards { grid-template-columns: 1fr 1fr; grid-auto-rows: 1fr; align-content: center; gap: 8px 10px; padding: 16px; }
.mega-links-cards li { display: flex; }
.mega-links-cards li:last-child:nth-child(odd) { grid-column: 1 / -1; }
.mega-links-cards a { flex: 1; gap: 14px; padding: 8px 14px; border: 1px solid var(--sand-200); border-radius: 14px; background: linear-gradient(135deg, #fffdf8, var(--sand-100)); }
.mega-links-cards a:hover { border-color: var(--gold); background: #fff; box-shadow: 0 10px 22px rgba(16, 35, 52, .12); transform: translateY(-2px); }
.mega-links-cards .mega-thumb { width: 50px; height: 60px; }
.mega-links-cards .mega-link-text { gap: 2px; }
.mega-links-cards .mega-link-title { font-size: .95rem; }
.mega-links-cards .mega-link-desc { font-size: .76rem; line-height: 1.35; }

.mega-feature { position: relative; display: block; margin: 16px 16px 16px 0; min-height: 250px; border-radius: 16px; overflow: hidden; isolation: isolate; color: #fff; background: var(--navy-800); }
.mega-feature img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .7s; }
.mega-feature::after { content: ""; position: absolute; inset: 30% 0 0; background: linear-gradient(0deg, rgba(8, 22, 34, .92), transparent); }
.mega-feature:hover img { transform: scale(1.07); }
.mega-feature-text { position: absolute; left: 18px; right: 18px; bottom: 16px; z-index: 1; display: flex; flex-direction: column; align-items: flex-start; gap: 6px; }
.mega-feature-label { padding: 4px 10px; border-radius: 6px; background: var(--terracotta); font-size: .66rem; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; }
.mega-feature strong { font-family: var(--font-display); font-size: 1.1rem; line-height: 1.25; }
.mega-feature-more { display: inline-flex; align-items: center; gap: 6px; font-size: .78rem; font-weight: 600; color: var(--gold-300); }
.mega-feature-more .icon { width: 15px; height: 15px; transition: transform .2s; }
.mega-feature:hover .mega-feature-more .icon { transform: translateX(4px); }

.header-actions { display: flex; align-items: center; gap: 12px; flex: none; }
.header-wa { display: flex; align-items: center; gap: 8px; height: 44px; padding: 0 16px 0 12px; border-radius: 999px; background: rgba(255, 255, 255, .6); border: 1.5px solid rgba(31, 168, 85, .5); color: #178a45; font-size: .84rem; font-weight: 600; transition: background-color .2s, color .2s, border-color .2s; }
.header-wa .icon { width: 22px; height: 22px; }
.header-wa:hover { background: var(--wa); border-color: var(--wa); color: #fff; }
.header-cta { min-height: 44px; padding: 10px 22px; font-size: .86rem; border-radius: 999px; }
.nav-toggle, .nav-close { display: none; place-items: center; width: 44px; height: 44px; border: 0; border-radius: 10px; background: var(--navy-800); color: #fff; }
.nav-toggle .icon, .nav-close .icon { width: 24px; height: 24px; }

/* ---------- Mobile navigation ---------- */
.mobile-nav { position: fixed; inset: 0; z-index: 150; background: rgba(10, 28, 43, .55); opacity: 0; transition: opacity .25s; }
.mobile-nav.is-open { opacity: 1; }
.mobile-nav-panel { position: absolute; top: 0; right: 0; bottom: 0; width: min(380px, 90vw); display: flex; flex-direction: column; background: var(--sand-50); transform: translateX(100%); transition: transform .3s ease; overflow-y: auto; overscroll-behavior: contain; }
.mobile-nav.is-open .mobile-nav-panel { transform: none; }
.mobile-nav-head { display: flex; align-items: center; justify-content: space-between; padding: 16px 20px; border-bottom: 1px solid var(--sand-200); }
.mobile-nav .nav-close { display: grid; }
.mobile-nav nav { padding: 8px 20px; }
.mobile-link, .mobile-nav summary { display: flex; align-items: center; justify-content: space-between; min-height: 54px; font-family: var(--font-display); font-size: 1.15rem; font-weight: 600; color: var(--ink); border-bottom: 1px solid var(--sand-200); cursor: pointer; list-style: none; }
.mobile-nav summary::-webkit-details-marker { display: none; }
.mobile-nav details[open] summary .icon { transform: rotate(180deg); }
.mobile-link[aria-current="page"] { color: var(--gold-600); }
.mobile-nav details ul { padding: 8px 0 12px 12px; border-bottom: 1px solid var(--sand-200); }
.mobile-nav details li a { display: block; padding: 10px 0; font-size: .97rem; }
.mobile-nav-foot { display: grid; gap: 12px; margin-top: auto; padding: 20px; background: var(--sand-100); }
.mobile-contact { display: flex; align-items: center; gap: 10px; font-size: .8rem; font-weight: 500; color: var(--ink); word-break: break-all; }
.mobile-contact .icon { color: var(--gold-600); }

/* ---------- Hero ---------- */
.hero { position: relative; display: flex; align-items: center; min-height: clamp(540px, 74vh, 720px); padding-block: 70px 130px; color: #fff; isolation: isolate; overflow: hidden; background: var(--navy-900); }
.hero-media { position: absolute; top: 0; bottom: 0; left: 14%; z-index: -2; width: 100%; -webkit-mask-image: linear-gradient(90deg, transparent, #000 28%); mask-image: linear-gradient(90deg, transparent, #000 28%); }
.hero-media img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 50%; }
.hero::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, rgba(10, 28, 43, .92) 0%, rgba(10, 28, 43, .55) 38%, rgba(10, 28, 43, 0) 64%), linear-gradient(0deg, rgba(10, 28, 43, .5), transparent 42%); }
.hero h1 { color: #fff; font-size: clamp(2.6rem, 1.4rem + 5.2vw, 5rem); line-height: 1.02; letter-spacing: -.015em; max-width: 12ch; text-shadow: 0 2px 30px rgba(0, 0, 0, .3); }
.hero h1 span { display: block; color: var(--gold-300); }
.hero-lead { max-width: 30em; margin: 20px 0 34px; font-size: clamp(1rem, .95rem + .35vw, 1.2rem); color: rgba(255, 255, 255, .92); }
.hero-points { display: flex; flex-wrap: wrap; gap: 14px clamp(18px, 3vw, 44px); }
.hero-points li { display: flex; flex-direction: column; align-items: center; gap: 10px; text-align: center; font-size: .78rem; font-weight: 500; line-height: 1.35; }
.hero-points .icon { width: 30px; height: 30px; stroke-width: 1.3; color: var(--gold-300); }

/* ---------- Trip planner ---------- */
.planner-wrap { position: relative; z-index: 5; margin-top: -78px; }
.planner { background: #fff; border-radius: var(--radius-lg); box-shadow: var(--shadow); overflow: hidden; }
.planner-tabs { display: flex; gap: 4px; padding: 0 18px; border-bottom: 1px solid var(--sand-200); overflow-x: auto; scrollbar-width: none; }
.planner-tabs::-webkit-scrollbar { display: none; }
.planner-tabs label { position: relative; cursor: pointer; flex: none; }
.planner-tabs input { position: absolute; top: 0; left: 0; width: 1px; height: 1px; margin: 0; opacity: 0; pointer-events: none; }
.planner-tabs span { display: flex; align-items: center; gap: 8px; padding: 16px 20px 14px; font-size: .88rem; font-weight: 500; color: var(--muted); border-bottom: 2.5px solid transparent; transition: color .2s, border-color .2s; }
.planner-tabs input:checked + span { color: var(--gold-600); border-color: var(--gold); }
.planner-tabs input:focus-visible + span { outline: 3px solid var(--gold-300); outline-offset: -3px; }
.planner-fields { display: grid; grid-template-columns: 1.35fr 1fr 1fr auto; gap: 14px; padding: 18px; }
.field { display: flex; align-items: center; gap: 12px; min-height: 60px; padding: 8px 16px; border: 1px solid var(--sand-200); border-radius: 12px; background: var(--sand-50); cursor: pointer; transition: border-color .2s, box-shadow .2s; }
.field:focus-within { border-color: var(--gold); box-shadow: 0 0 0 3px rgba(182, 122, 42, .15); }
.field > .icon { color: var(--gold-600); width: 22px; height: 22px; }
.field-text { display: flex; flex-direction: column; flex: 1; min-width: 0; }
.field-label { font-size: .72rem; font-weight: 600; color: var(--ink); }
.field select, .field input { width: 100%; padding: 0; border: 0; background: transparent; font-size: .9rem; color: var(--text); outline: none; min-height: 24px; }
.planner .btn { min-height: 60px; padding-inline: 32px; }

/* ---------- Section heads ---------- */
.section-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; margin-bottom: clamp(28px, 4vw, 44px); }
.section-head p:not(.eyebrow) { max-width: 46em; margin: 12px 0 0; }
.section-head-light h2 { color: #fff; }
.section-head-light p:not(.eyebrow) { color: rgba(255, 255, 255, .82); }
.section-head-actions { display: flex; align-items: center; gap: 12px; flex: none; }
.section-head-actions .text-link { margin-right: 10px; }

/* ---------- Experiences (arch cards) ---------- */
.experiences-grid { display: grid; grid-template-columns: minmax(260px, 1fr) 2.1fr; gap: clamp(28px, 4vw, 56px); align-items: center; }
.experiences-intro p:not(.eyebrow) { margin: 18px 0 24px; }
.arch-row { display: grid; grid-template-columns: repeat(6, 1fr); gap: clamp(8px, 1vw, 14px); }
.arch-card { position: relative; display: block; aspect-ratio: 440 / 760; overflow: hidden; border-radius: 999px 999px 12px 12px; background: var(--navy-800); box-shadow: var(--shadow-sm); isolation: isolate; transition: transform .35s, box-shadow .35s; }
.arch-card::before { content: ""; position: absolute; inset: 5px; z-index: 2; border: 1px solid rgba(226, 181, 102, .65); border-radius: 999px 999px 9px 9px; pointer-events: none; }
.arch-card::after { content: ""; position: absolute; inset: 40% 0 0; z-index: 1; background: linear-gradient(0deg, rgba(8, 22, 34, .88), transparent); }
.arch-card img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s; }
.arch-card:hover { transform: translateY(-6px); box-shadow: var(--shadow); }
.arch-card:hover img { transform: scale(1.07); }
.arch-card-label { position: absolute; left: 0; right: 0; bottom: 16px; z-index: 3; display: flex; flex-direction: column; align-items: center; gap: 7px; padding-inline: 6px; text-align: center; color: #fff; font-size: .78rem; font-weight: 600; line-height: 1.25; }
.arch-card-label .icon { width: 22px; height: 22px; stroke-width: 1.4; color: var(--gold-300); }

/* ---------- Popular tours ---------- */
.tours-section {
  --overhang: 210px; /* how far the last row of cards hangs below the dark band */
  position: relative; color: #fff; overflow: hidden; padding-bottom: 28px;
  background:
    radial-gradient(120% 90% at 85% -10%, rgba(14, 74, 99, .65), transparent 60%),
    radial-gradient(90% 70% at 0% 110%, rgba(182, 122, 42, .22), transparent 60%),
    linear-gradient(180deg, var(--navy-800), var(--navy-900));
  background-repeat: no-repeat;
  background-size: 100% calc(100% - var(--overhang) - 28px);
}
.tours-section::before {
  content: ""; position: absolute; inset: 0 0 calc(var(--overhang) + 28px); opacity: .07; pointer-events: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='80' height='80' viewBox='0 0 80 80'%3E%3Cpath d='M40 6l10 24 24 10-24 10-10 24-10-24L6 40l24-10z' fill='none' stroke='%23e2b566' stroke-width='1'/%3E%3Crect x='26' y='26' width='28' height='28' fill='none' stroke='%23e2b566' stroke-width='1' transform='rotate(45 40 40)'/%3E%3C/svg%3E");
  background-size: 80px 80px;
  mask-image: linear-gradient(90deg, transparent 30%, #000); -webkit-mask-image: linear-gradient(90deg, transparent 30%, #000);
}
.tours-section .container { position: relative; }
.tour-track { display: grid; grid-template-columns: repeat(4, 1fr); gap: clamp(22px, 2.2vw, 30px) clamp(14px, 1.6vw, 22px); }
.tours-section .round-btn { display: none; }
.tour-card { display: flex; flex-direction: column; background: #fff; border-radius: var(--radius); overflow: hidden; color: var(--text); box-shadow: 0 14px 36px rgba(10, 28, 43, .2); transition: transform .3s; }
.tour-card:hover { transform: translateY(-6px); }
.tour-card-media { position: relative; display: block; margin: 8px 8px 0; border-radius: 10px; overflow: hidden; aspect-ratio: 720 / 520; }
.tour-card-media img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s; }
.tour-card:hover .tour-card-media img { transform: scale(1.06); }
.badge { position: absolute; top: 10px; left: 10px; padding: 5px 11px; border-radius: 6px; background: var(--terracotta); color: #fff; font-size: .7rem; font-weight: 600; letter-spacing: .02em; }
.tour-card-body { display: flex; flex-direction: column; flex: 1; padding: 16px 18px 16px; }
.tour-card-route { margin: 0 0 6px; font-size: .7rem; font-weight: 600; letter-spacing: .04em; text-transform: uppercase; color: var(--gold-600); }
.tour-card h3 { font-size: 1.14rem; line-height: 1.28; }
.tour-card h3 a:hover { color: var(--gold-600); }
.tour-card-meta { display: grid; gap: 7px; margin: 14px 0 16px; font-size: .84rem; }
.tour-card-meta li { display: flex; align-items: center; gap: 10px; }
.tour-card-meta .icon { width: 17px; height: 17px; color: var(--muted); }
.tour-card-foot { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: auto; padding-top: 14px; border-top: 1px solid var(--sand-200); }
.tour-card-price { font-size: .78rem; color: var(--muted); line-height: 1.3; }
.tour-card-price strong { display: block; font-size: .98rem; color: var(--ink); }
.tour-card .round-link { width: 38px; height: 38px; }

/* ---------- Destinations ---------- */
.dest-grid { --per-view: 6; --gap: clamp(10px, 1.2vw, 16px); display: flex; gap: var(--gap); overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; padding-block: 4px 10px; }
.dest-grid::-webkit-scrollbar { display: none; }
.dest-grid .dest-card { flex: 0 0 calc((100% - var(--gap) * (var(--per-view) - 1)) / var(--per-view)); scroll-snap-align: start; }
.round-btn-gold { border-color: rgba(182, 122, 42, .55); color: var(--gold-600); }
.round-btn-gold:hover { background: var(--gold); border-color: var(--gold); color: #fff; }
.dest-card { position: relative; display: block; aspect-ratio: 520 / 760; border-radius: 12px; overflow: hidden; isolation: isolate; background: var(--navy-800); box-shadow: var(--shadow-sm); }
.dest-card img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s; }
.dest-card::after { content: ""; position: absolute; inset: 45% 0 0; background: linear-gradient(0deg, rgba(8, 22, 34, .92), transparent); }
.dest-card:hover img { transform: scale(1.07); }
.dest-card-text { position: absolute; left: 14px; right: 12px; bottom: 14px; z-index: 1; color: #fff; display: flex; flex-direction: column; gap: 2px; }
.dest-card-text strong { font-family: var(--font-display); font-size: 1.12rem; line-height: 1.2; }
.dest-card-text span { font-size: .76rem; color: rgba(255, 255, 255, .85); line-height: 1.35; }

/* ---------- Why travel with us ---------- */
.why {
  position: relative; overflow: hidden;
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='96' height='96' viewBox='0 0 96 96'%3E%3Cpath d='M48 8l12 28 28 12-28 12-12 28-12-28L8 48l28-12z' fill='none' stroke='%23b67a2a' stroke-opacity='.1' stroke-width='1'/%3E%3Crect x='31' y='31' width='34' height='34' fill='none' stroke='%23b67a2a' stroke-opacity='.1' stroke-width='1' transform='rotate(45 48 48)'/%3E%3C/svg%3E") 0 0 / 96px 96px,
    linear-gradient(180deg, var(--sand-100), #f4e9d6);
}
.eyebrow-center::before { content: ""; width: 34px; height: 1px; background: currentColor; opacity: .7; }
.why-head { max-width: 760px; margin: 0 auto clamp(36px, 5vw, 60px); text-align: center; }
.why-head p:not(.eyebrow) { margin: 16px 0 0; }
.why-layout { display: grid; grid-template-columns: minmax(0, 1fr) clamp(280px, 27vw, 360px) minmax(0, 1fr); gap: clamp(28px, 4vw, 64px); align-items: center; }
.why-col { display: grid; gap: clamp(22px, 2.6vw, 34px); }
.why-col li { position: relative; display: flex; align-items: center; gap: 18px; padding: 20px 22px; background: rgba(255, 255, 255, .78); border: 1px solid rgba(182, 122, 42, .22); border-radius: 18px; box-shadow: var(--shadow-sm); transition: transform .3s, box-shadow .3s, border-color .3s; }
.why-col li:hover { transform: translateY(-4px); box-shadow: var(--shadow); border-color: rgba(182, 122, 42, .55); }
.why-col-left li { flex-direction: row-reverse; text-align: right; }
.why-col-left li:nth-child(2) { transform: translateX(-18px); }
.why-col-right li:nth-child(2) { transform: translateX(18px); }
.why-col-left li:nth-child(2):hover { transform: translate(-18px, -4px); }
.why-col-right li:nth-child(2):hover { transform: translate(18px, -4px); }
.why-icon { display: grid; place-items: center; flex: none; width: 58px; height: 58px; border-radius: 50%; color: #fff; background: linear-gradient(135deg, #c08631, #a66e22); box-shadow: 0 0 0 5px rgba(182, 122, 42, .16), 0 8px 18px rgba(166, 110, 34, .3); }
.why-icon .icon { width: 26px; height: 26px; stroke-width: 1.5; }
.why-col h3 { font-family: var(--font-display); font-size: 1.12rem; line-height: 1.25; }
.why-col p { margin: 5px 0 0; font-size: .84rem; line-height: 1.5; color: var(--muted); }

.why-figure { position: relative; padding-bottom: 64px; }
.why-arch { position: relative; aspect-ratio: 720 / 1040; border-radius: 999px 999px 22px 22px; overflow: hidden; box-shadow: 0 0 0 1.5px var(--gold), 0 0 0 10px var(--sand-50), 0 0 0 11.500px rgba(182, 122, 42, .5), 0 30px 60px rgba(16, 35, 52, .22); }
.why-arch img { width: 100%; height: 100%; object-fit: cover; }
.why-round { position: absolute; right: -26px; bottom: 30px; width: 42%; height: auto; aspect-ratio: 1; border-radius: 50%; object-fit: cover; border: 6px solid var(--sand-50); box-shadow: 0 0 0 1.5px var(--gold), 0 16px 34px rgba(16, 35, 52, .25); }
.why-script { position: absolute; left: -10px; bottom: -4px; margin: 0; font-family: var(--font-script); font-size: clamp(1.3rem, 1rem + .9vw, 1.7rem); line-height: 1.1; color: var(--gold-600); transform: rotate(-7deg); text-align: center; }
.why-cta { display: flex; flex-wrap: wrap; justify-content: center; gap: 14px; margin-top: clamp(36px, 5vw, 56px); }

/* ---------- Guests (arcade of arches) ---------- */
.guests {
  position: relative; overflow: hidden; color: rgba(255, 255, 255, .85);
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='96' height='96' viewBox='0 0 96 96'%3E%3Cpath d='M48 8l12 28 28 12-28 12-12 28-12-28L8 48l28-12z' fill='none' stroke='%23e2b566' stroke-opacity='.06' stroke-width='1'/%3E%3C/svg%3E") 0 0 / 96px 96px,
    radial-gradient(70% 55% at 50% 62%, rgba(226, 181, 102, .2), transparent 70%),
    radial-gradient(90% 80% at 100% 0%, rgba(14, 74, 99, .7), transparent 60%),
    linear-gradient(180deg, var(--navy-800), var(--navy-900));
}
.guests-head { max-width: 760px; margin: 0 auto clamp(30px, 4vw, 52px); text-align: center; }
.guests h2 { color: #fff; }
.guests h2 span { color: var(--gold-300); }
.guests-head p:not(.eyebrow) { margin: 16px 0 0; }
.arcade { display: grid; grid-template-columns: repeat(5, 1fr); align-items: end; gap: clamp(10px, 1.8vw, 28px); max-width: 1120px; margin-inline: auto; }
.arcade-arch { margin: 0; text-align: center; }
.arcade-frame { position: relative; padding: 7px; border: 1.5px solid rgba(226, 181, 102, .75); border-radius: 999px 999px 16px 16px; transition: transform .4s, border-color .4s, box-shadow .4s; }
.arcade-frame::before { content: ""; position: absolute; left: 50%; top: -9px; width: 14px; height: 14px; background: var(--gold-300); transform: translateX(-50%) rotate(45deg); box-shadow: 0 0 0 4px var(--navy-800); }
.arcade-frame > img:not(.arcade-logo) { width: 100%; height: auto; border-radius: 999px 999px 10px 10px; object-fit: cover; filter: saturate(1.04); }
.arcade-frame > .arcade-logo { position: absolute; left: 50%; bottom: 16px; transform: translateX(-50%); width: clamp(58px, 6.6vw, 96px); height: auto; aspect-ratio: auto; border-radius: 0; opacity: .6; filter: drop-shadow(0 1px 3px rgba(0, 0, 0, .3)); pointer-events: none; }
.arcade-side .arcade-frame > img:not(.arcade-logo) { aspect-ratio: 600 / 820; }
.arcade-mid .arcade-frame > img:not(.arcade-logo) { aspect-ratio: 600 / 900; }
.arcade-centre .arcade-frame > img:not(.arcade-logo) { aspect-ratio: 600 / 980; }
.arcade-centre .arcade-frame { border-color: var(--gold-300); box-shadow: 0 0 0 6px rgba(226, 181, 102, .12), 0 30px 70px rgba(0, 0, 0, .45); }
.arcade-arch:hover .arcade-frame { transform: translateY(-10px); border-color: var(--gold-300); box-shadow: 0 0 0 6px rgba(226, 181, 102, .14), 0 30px 60px rgba(0, 0, 0, .5); }
.arcade-arch figcaption { margin-top: 16px; font-size: .72rem; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; color: var(--gold-300); }
.arcade-base { position: relative; max-width: 1180px; height: 1px; margin: 22px auto 0; background: linear-gradient(90deg, transparent, rgba(226, 181, 102, .7) 15%, rgba(226, 181, 102, .7) 85%, transparent); }
.arcade-base span { position: absolute; left: 50%; top: -5px; width: 11px; height: 11px; background: var(--gold-300); transform: translateX(-50%) rotate(45deg); }
.guests-cta { display: flex; flex-wrap: wrap; justify-content: center; gap: 14px; margin-top: clamp(32px, 4vw, 48px); }

/* ---------- FAQ ---------- */
.faq-section { background: var(--sand-100); }
.faq-grid { display: grid; grid-template-columns: minmax(260px, 1fr) 1.7fr; gap: clamp(28px, 5vw, 72px); align-items: start; }
.faq-intro p:not(.eyebrow) { margin: 16px 0 24px; }
.faq-list { display: grid; gap: 12px; }
.faq-item { background: #fff; border-radius: 12px; border: 1px solid var(--sand-200); overflow: hidden; }
.faq-item summary { position: relative; padding: 18px 56px 18px 22px; font-weight: 600; color: var(--ink); cursor: pointer; list-style: none; }
.faq-item summary::-webkit-details-marker { display: none; }
.faq-item summary::before, .faq-item summary::after { content: ""; position: absolute; right: 22px; top: 50%; width: 14px; height: 2px; background: var(--gold); transition: transform .25s; }
.faq-item summary::after { transform: rotate(90deg); }
.faq-item[open] summary::after { transform: rotate(0); }
.faq-item p { margin: 0; padding: 0 22px 20px; font-size: .94rem; }

/* ---------- Final call to action ---------- */
.cta { position: relative; isolation: isolate; color: #fff; padding-block: clamp(72px, 9vw, 124px); overflow: hidden; background: #1c0f07; }
.cta-media { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; object-fit: cover; object-position: 60% 45%; }
.cta::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, rgba(28, 15, 7, .88), rgba(28, 15, 7, .5) 36%, rgba(28, 15, 7, 0) 60%), linear-gradient(0deg, rgba(24, 12, 5, .45), transparent 40%); }
.cta-content { position: relative; }
.cta h2 { color: #fff; max-width: 16em; }
.cta-content > p:not(.cta-script) { max-width: 34em; margin: 14px 0 28px; color: rgba(255, 255, 255, .9); }
.cta-actions { display: flex; flex-wrap: wrap; gap: 14px; }
.cta-points { display: flex; flex-wrap: wrap; gap: 20px clamp(24px, 4vw, 56px); margin-top: 40px; }
.cta-points li { display: flex; align-items: center; gap: 14px; font-size: .82rem; color: rgba(255, 255, 255, .85); line-height: 1.35; }
.cta-points strong { display: block; font-family: var(--font-display); font-size: 1.2rem; color: #fff; }
.cta-points .icon { width: 42px; height: 42px; padding: 9px; border: 1px solid rgba(226, 181, 102, .7); border-radius: 50%; color: var(--gold-300); stroke-width: 1.4; }
.cta-script { position: absolute; right: var(--gutter); top: -40px; margin: 0; font-family: var(--font-script); font-size: clamp(1.5rem, 1rem + 1.6vw, 2.2rem); line-height: 1.15; color: #fff; transform: rotate(-8deg); text-align: center; opacity: .95; }

/* ---------- Footer ---------- */
.site-footer {
  --footer-top: #3b2415; --footer-bottom: #1c100a;
  position: relative; isolation: isolate; color: rgba(255, 244, 228, .8); font-size: .92rem;
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='96' height='96' viewBox='0 0 96 96'%3E%3Cpath d='M48 8l12 28 28 12-28 12-12 28-12-28L8 48l28-12z' fill='none' stroke='%23e2b566' stroke-opacity='.08' stroke-width='1'/%3E%3C/svg%3E") 0 0 / 96px 96px,
    radial-gradient(70% 80% at 100% 0%, rgba(194, 86, 43, .38), transparent 62%),
    radial-gradient(60% 70% at 0% 100%, rgba(226, 181, 102, .2), transparent 60%),
    linear-gradient(180deg, var(--footer-top), var(--footer-bottom));
}
/* scalloped Moroccan edge where the footer meets the section above */
.site-footer::before { content: ""; position: absolute; left: 0; right: 0; top: -17px; height: 18px; background: var(--footer-top); -webkit-mask: radial-gradient(circle at 50% 100%, #000 17px, transparent 18px) 50% 0 / 36px 18px repeat-x; mask: radial-gradient(circle at 50% 100%, #000 17px, transparent 18px) 50% 0 / 36px 18px repeat-x; }
.site-footer::after { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 2px; background: linear-gradient(90deg, transparent, var(--gold-300) 20%, var(--gold-300) 80%, transparent); opacity: .55; }

.footer-top { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.3fr); gap: clamp(28px, 5vw, 72px); align-items: center; padding-block: clamp(52px, 6vw, 84px) clamp(34px, 4vw, 48px); }
.footer-brand { display: flex; align-items: center; gap: 24px; }
.footer-logo { flex: none; display: block; padding: 22px 16px 14px; background: linear-gradient(180deg, #fffdf8, #f4e8d2); border-radius: 999px 999px 16px 16px; box-shadow: 0 0 0 1.5px var(--gold-300), 0 0 0 7px rgba(226, 181, 102, .14), 0 20px 44px rgba(0, 0, 0, .4); transition: transform .3s; }
.footer-logo:hover { transform: translateY(-4px); }
.footer-logo img { width: 170px; }
.footer-script { margin: 0 0 8px; font-family: var(--font-script); font-size: 1.5rem; line-height: 1.15; color: var(--gold-300); }
.footer-brand p:not(.footer-script) { margin: 0; max-width: 26em; font-size: .88rem; line-height: 1.65; }

.footer-contacts { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, .9fr) minmax(0, 1.7fr); gap: 14px; }
.footer-contacts a { display: flex; flex-direction: column; align-items: flex-start; gap: 14px; height: 100%; padding: 18px 16px; border: 1px solid rgba(226, 181, 102, .38); border-radius: 16px; background: rgba(255, 236, 200, .06); transition: transform .3s, border-color .3s, background-color .3s; }
.footer-contacts a:hover { transform: translateY(-4px); border-color: var(--gold-300); background: rgba(255, 255, 255, .08); }
.footer-contact-icon { display: grid; place-items: center; flex: none; width: 44px; height: 44px; border-radius: 50%; color: #fff; background: linear-gradient(135deg, #c08631, #a66e22); }
.footer-contact-wa { background: var(--wa); }
.footer-contact-icon .icon { width: 22px; height: 22px; }
.footer-contacts small { display: block; font-size: .68rem; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--gold-300); }
.footer-contacts strong { display: block; margin-top: 4px; font-size: .8rem; font-weight: 500; color: #fff; overflow-wrap: anywhere; line-height: 1.35; }

.footer-links { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: clamp(24px, 4vw, 56px); padding-block: clamp(34px, 4vw, 48px) clamp(40px, 5vw, 64px); border-top: 1px solid rgba(255, 255, 255, .1); }
.footer-col h2 { position: relative; margin-bottom: 20px; padding-bottom: 14px; font-family: var(--font-display); font-size: 1.15rem; font-weight: 700; color: #fff; }
.footer-col h2::after { content: ""; position: absolute; left: 0; bottom: 0; width: 38px; height: 2px; background: var(--gold-300); }
.footer-col h2::before { content: ""; position: absolute; left: 44px; bottom: -2px; width: 6px; height: 6px; background: var(--gold-300); transform: rotate(45deg); }
.footer-col li + li { margin-top: 11px; }
.footer-col li a { position: relative; display: inline-block; transition: color .2s, padding .25s; }
.footer-col li a::before { content: ""; position: absolute; left: 0; top: .62em; width: 6px; height: 6px; background: var(--gold-300); transform: rotate(45deg) scale(0); transition: transform .25s; }
.footer-col li a:hover { color: #fff; padding-left: 16px; }
.footer-col li a:hover::before { transform: rotate(45deg) scale(1); }
.footer-cta { margin-top: 22px; min-height: 44px; padding: 10px 22px; font-size: .86rem; border-radius: 999px; }

.footer-watermark { position: absolute; left: 0; right: 0; bottom: 46px; z-index: -1; margin: 0; overflow: hidden; text-align: center; font-family: var(--font-display); font-weight: 700; font-size: clamp(4rem, 13vw, 12.5rem); line-height: .8; white-space: nowrap; letter-spacing: -.02em; color: transparent; -webkit-text-stroke: 1px rgba(226, 181, 102, .1); pointer-events: none; }
.footer-bottom { position: relative; background: rgba(12, 6, 3, .5); font-size: .8rem; }
.footer-bottom-inner { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px 24px; padding-block: 18px; }
.footer-bottom p { margin: 0; }
.footer-bottom-note { letter-spacing: .08em; color: var(--gold-300); }
.footer-top-link { display: inline-flex; align-items: center; gap: 10px; font-weight: 500; transition: color .2s; }
.footer-top-link span { display: grid; place-items: center; width: 34px; height: 34px; border: 1px solid rgba(226, 181, 102, .5); border-radius: 50%; color: var(--gold-300); transition: background-color .2s, color .2s, transform .2s; }
.footer-top-link .icon { width: 16px; height: 16px; transform: rotate(180deg); }
.footer-top-link:hover { color: #fff; }
.footer-top-link:hover span { background: var(--gold); color: #fff; transform: translateY(-3px); }

/* ---------- WhatsApp float & mobile sticky bar ---------- */
.wa-float { position: fixed; right: 22px; bottom: 22px; z-index: 90; display: grid; place-items: center; width: 58px; height: 58px; border-radius: 50%; background: var(--wa); color: #fff; box-shadow: 0 10px 28px rgba(31, 168, 85, .45); transition: transform .2s; }
.wa-float .icon { width: 32px; height: 32px; }
.wa-float:hover { transform: scale(1.08); }
.sticky-bar { display: none; }

/* ---------- 404 ---------- */
.notfound { min-height: 60vh; display: grid; align-items: center; }
.notfound h1 { font-size: clamp(2rem, 1.2rem + 3vw, 3.4rem); margin-bottom: 16px; }
.notfound p { max-width: 36em; }
.notfound .cta-actions { margin-top: 26px; }

/* ---------- Scroll reveal ---------- */
.js .reveal { opacity: 0; transform: translateY(26px); transition: opacity .7s ease, transform .7s ease; }
.js .reveal.is-visible { opacity: 1; transform: none; }

/* ==========================================================================
   Morocco Tours listing page
   ========================================================================== */
.page-hero { position: relative; isolation: isolate; color: #fff; padding-block: clamp(34px, 4vw, 50px) clamp(110px, 11vw, 150px); overflow: hidden; background: #24120a; }
.page-hero-media { position: absolute; top: 0; bottom: 0; left: 27%; z-index: -2; width: 100%; -webkit-mask-image: linear-gradient(90deg, transparent, #000 26%); mask-image: linear-gradient(90deg, transparent, #000 26%); }
.page-hero-media img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 35%; }
.page-hero::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, rgba(36, 18, 6, .94) 0%, rgba(36, 18, 6, .7) 30%, rgba(36, 18, 6, 0) 56%), linear-gradient(0deg, rgba(36, 18, 6, .25), transparent 30%); }
.breadcrumbs ol { margin: 0; padding: 0; list-style: none; display: flex; flex-wrap: wrap; align-items: center; gap: 10px; font-size: .86rem; font-weight: 500; }
.breadcrumbs li { display: flex; align-items: center; gap: 10px; }
.breadcrumbs li + li::before { content: "\203A"; opacity: .7; font-size: 1.1em; }
.breadcrumbs li:first-child a::before { content: ""; display: inline-block; width: 15px; height: 15px; margin-right: 8px; vertical-align: -2px; background: currentColor; -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linejoin='round'%3E%3Cpath d='M4 11l8-7 8 7v9h-5v-6H9v6H4z'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linejoin='round'%3E%3Cpath d='M4 11l8-7 8 7v9h-5v-6H9v6H4z'/%3E%3C/svg%3E") center / contain no-repeat; }
.breadcrumbs a:hover { color: var(--gold-300); }
.page-hero-eyebrow { margin: clamp(22px, 3vw, 34px) 0 10px; font-size: .78rem; font-weight: 600; letter-spacing: .2em; text-transform: uppercase; }
.page-hero-eyebrow span { color: var(--gold-300); }
.page-hero h1 { color: #fff; font-size: clamp(2.8rem, 1.6rem + 5vw, 5rem); line-height: 1; letter-spacing: -.015em; text-shadow: 0 2px 30px rgba(0, 0, 0, .3); }
.page-hero h1 span { color: var(--gold-300); }
.page-hero-lead { max-width: 31em; margin: 18px 0 28px; font-size: clamp(1rem, .95rem + .3vw, 1.14rem); color: rgba(255, 255, 255, .93); }

.cat-row { position: relative; z-index: 5; display: grid; grid-template-columns: repeat(7, 1fr); gap: clamp(8px, 1vw, 14px); margin-top: clamp(-96px, -8vw, -70px); }
.cat-tile { position: relative; display: block; width: 100%; aspect-ratio: 340 / 380; padding: 0; border: 0; border-radius: 12px; overflow: hidden; isolation: isolate; background: var(--navy-800); color: #fff; text-align: left; box-shadow: 0 12px 30px rgba(16, 35, 52, .25); transition: transform .3s, box-shadow .3s; }
.cat-tile img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s; }
.cat-tile::after { content: ""; position: absolute; inset: 30% 0 0; background: linear-gradient(0deg, rgba(8, 22, 34, .92), transparent); }
.cat-tile:hover { transform: translateY(-5px); }
.cat-tile:hover img { transform: scale(1.07); }
.cat-tile.is-active { box-shadow: 0 0 0 3px #fff, 0 0 0 5.500px var(--gold), 0 16px 34px rgba(16, 35, 52, .3); }
.cat-tile-text { position: absolute; left: 14px; right: 10px; bottom: 14px; z-index: 1; display: flex; flex-direction: column; gap: 1px; }
.cat-tile-text .icon { width: 24px; height: 24px; margin-bottom: 6px; color: var(--gold-300); stroke-width: 1.4; }
.cat-tile-text strong { font-family: var(--font-body); font-size: clamp(.82rem, .6rem + .55vw, 1.02rem); font-weight: 600; line-height: 1.25; }
.cat-tile-text small { font-size: .78rem; color: rgba(255, 255, 255, .88); }
.cat-tile-text small b { font-weight: 400; }
.cat-row li:first-child .cat-tile-text { align-items: center; text-align: center; }

.tours-browse { padding-top: clamp(32px, 4vw, 52px); }
.tours-layout { display: grid; grid-template-columns: 290px minmax(0, 1fr); gap: clamp(20px, 2.6vw, 36px); align-items: start; }
.filters { padding: 24px 22px; background: #fff; border-radius: 16px; border: 1px solid var(--sand-200); box-shadow: var(--shadow-sm); }
.filters-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 20px; }
.filters-head h2 { font-size: 1.22rem; }
.filters-head .icon { color: var(--ink); }
.filter-label { display: block; margin: 0 0 8px; font-size: .9rem; font-weight: 600; color: var(--ink); }
.filter-label small { font-weight: 400; color: var(--muted); }
.filter-search { display: flex; align-items: center; gap: 8px; padding: 0 12px; border: 1px solid var(--sand-200); border-radius: 8px; background: var(--sand-50); }
.filter-search .icon { width: 16px; height: 16px; color: var(--muted); }
.filter-search input { flex: 1; min-width: 0; height: 40px; border: 0; background: transparent; font-size: .84rem; outline: none; }
.filter-search:focus-within { border-color: var(--gold); }
.filter-group { margin-top: 18px; padding-top: 16px; border-top: 1px solid var(--sand-200); }
.filter-group summary { display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px; font-size: .9rem; font-weight: 600; color: var(--ink); cursor: pointer; list-style: none; }
.filter-group summary::-webkit-details-marker { display: none; }
.filter-group summary .icon { width: 16px; height: 16px; color: var(--gold); stroke-width: 2.4; transition: transform .25s; }
.filter-group[open] summary .icon { transform: rotate(180deg); }
.check { display: flex; align-items: center; gap: 11px; padding: 5px 0; font-size: .86rem; cursor: pointer; }
.check input { flex: none; width: 17px; height: 17px; margin: 0; accent-color: var(--gold); cursor: pointer; }
.check span { display: block; }
.check span b { font-weight: 400; }
.check .icon { display: inline-block; width: 17px; height: 17px; margin-right: 7px; vertical-align: -3px; color: var(--ink); }
.check:hover { color: var(--gold-600); }
.filter-price { margin-top: 18px; padding-top: 16px; border-top: 1px solid var(--sand-200); }
.range { position: relative; height: 26px; margin-top: 6px; }
.range-track { position: absolute; left: 0; right: 0; top: 11px; height: 4px; border-radius: 4px; background: var(--sand-200); }
.range-fill { position: absolute; top: 0; bottom: 0; left: 0; right: 0; border-radius: 4px; background: var(--gold); }
.range input { position: absolute; inset: 0; width: 100%; margin: 0; background: none; pointer-events: none; -webkit-appearance: none; appearance: none; }
.range input::-webkit-slider-thumb { -webkit-appearance: none; width: 20px; height: 20px; border-radius: 50%; background: #fff; border: 3px solid var(--gold); box-shadow: 0 2px 6px rgba(16, 35, 52, .2); cursor: pointer; pointer-events: auto; }
.range input::-moz-range-thumb { width: 14px; height: 14px; border-radius: 50%; background: #fff; border: 3px solid var(--gold); cursor: pointer; pointer-events: auto; }
.range input::-webkit-slider-runnable-track { background: none; }
.range input::-moz-range-track { background: none; }
.range-values { display: flex; justify-content: space-between; margin-top: 4px; font-size: .78rem; color: var(--muted); }
.range-values b { font-weight: 500; }
.filters-apply { width: 100%; margin-top: 18px; }
.filters-reset { display: block; margin: 12px auto 0; padding: 4px; border: 0; background: none; font-size: .84rem; font-weight: 600; color: var(--gold-600); text-decoration: underline; text-underline-offset: 3px; }
.help-card { display: grid; grid-template-columns: auto 1fr; gap: 12px 14px; margin-top: 18px; padding: 22px; background: var(--sand-100); border-radius: 16px; border: 1px solid var(--sand-200); }
.help-card-icon { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 50%; background: var(--gold); color: #fff; }
.help-card-icon .icon { width: 17px; height: 17px; }
.help-card h2 { font-family: var(--font-body); font-size: .95rem; font-weight: 600; }
.help-card p { margin: 4px 0 0; font-size: .78rem; line-height: 1.5; color: var(--muted); }
.help-card .btn { grid-column: 1 / -1; min-height: 44px; }
.btn-dark { background: #2c3a2c; color: #fff; }
.btn-dark:hover { background: var(--navy-800); }

.results-head { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 20px; }
.results-head h2 { font-size: clamp(1.3rem, 1.1rem + .7vw, 1.65rem); }
.sort { display: flex; align-items: center; gap: 10px; font-size: .86rem; font-weight: 500; color: var(--ink); white-space: nowrap; }
.sort select { height: 42px; padding: 0 34px 0 14px; border: 1px solid var(--sand-200); border-radius: 8px; background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2317232e' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") right 10px center / 15px no-repeat; font-size: .86rem; -webkit-appearance: none; appearance: none; cursor: pointer; }
.tcard-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(14px, 1.6vw, 22px); }
.tcard { display: flex; flex-direction: column; background: #fff; border-radius: 12px; overflow: hidden; border: 1px solid var(--sand-200); box-shadow: 0 6px 20px rgba(16, 35, 52, .07); transition: transform .3s, box-shadow .3s; }
.tcard[hidden] { display: none; }
.tcard:hover { transform: translateY(-5px); box-shadow: var(--shadow); }
.tcard-media { position: relative; aspect-ratio: 4 / 2.55; overflow: hidden; }
.tcard-media a { display: block; height: 100%; }
.tcard-media img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s; }
.tcard:hover .tcard-media img { transform: scale(1.06); }
.tcard-badge { position: absolute; top: 12px; left: 12px; padding: 5px 12px; border-radius: 6px; color: #fff; font-size: .72rem; font-weight: 600; background: #e8622c; }
.tcard-badge-green { background: #1f9d57; }
.tcard-badge-pink { background: #e64a6f; }
.fav-btn { position: absolute; top: 10px; right: 10px; display: grid; place-items: center; width: 34px; height: 34px; padding: 0; border: 0; border-radius: 50%; background: transparent; color: #fff; filter: drop-shadow(0 1px 3px rgba(0, 0, 0, .5)); transition: transform .2s, color .2s; }
.fav-btn .icon { width: 24px; height: 24px; stroke-width: 2; }
.fav-btn:hover { transform: scale(1.15); }
.fav-btn[aria-pressed="true"] { color: #ff5a73; }
.fav-btn[aria-pressed="true"] .icon { fill: currentColor; }
.tcard-duration { position: absolute; left: 12px; bottom: 10px; display: inline-flex; align-items: center; gap: 6px; padding: 5px 10px; border-radius: 6px; background: rgba(10, 28, 43, .78); color: #fff; font-size: .74rem; font-weight: 500; }
.tcard-duration .icon { width: 14px; height: 14px; }
.tcard-body { display: flex; flex-direction: column; flex: 1; padding: 16px 16px 14px; }
.tcard h3 { font-family: var(--font-display); font-size: 1.04rem; line-height: 1.3; min-height: 3.9em; }
.tcard h3 a:hover { color: var(--gold-600); }
.tcard-features { display: grid; gap: 6px; margin: 12px 0 14px; font-size: .82rem; }
.tcard-features li { display: flex; align-items: center; gap: 12px; }
.tcard-features .icon { width: 16px; height: 16px; color: var(--ink); }
.tcard-foot { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: auto; }
.tcard-price { display: flex; align-items: baseline; gap: 6px; margin: 0; font-size: .78rem; color: var(--muted); }
.tcard-price .from { font-weight: 600; color: var(--terracotta); }
.tcard-price strong { font-size: 1.5rem; font-weight: 600; letter-spacing: -.01em; color: var(--ink); line-height: 1.1; }
.tcard-price-quote strong { font-size: 1.05rem; }
.tcard .round-link { width: 38px; height: 38px; }
.results-more { display: flex; justify-content: center; margin-top: clamp(26px, 3vw, 40px); }
.results-more .btn { min-width: 240px; border-radius: 999px; }
.results-more .btn[hidden] { display: none; }
.results-empty { margin: 30px 0 0; padding: 28px; text-align: center; background: var(--sand-100); border-radius: 14px; }
.results-empty a { color: var(--gold-600); font-weight: 600; text-decoration: underline; }

.regions {
  position: relative; overflow: hidden; color: rgba(255, 255, 255, .85); padding-block: clamp(56px, 7vw, 100px);
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='96' height='96' viewBox='0 0 96 96'%3E%3Cpath d='M48 8l12 28 28 12-28 12-12 28-12-28L8 48l28-12z' fill='none' stroke='%23e2b566' stroke-opacity='.06' stroke-width='1'/%3E%3C/svg%3E") 0 0 / 96px 96px,
    radial-gradient(50% 60% at 26% 55%, rgba(226, 181, 102, .22), transparent 70%),
    radial-gradient(90% 80% at 100% 0%, rgba(14, 74, 99, .7), transparent 60%),
    linear-gradient(180deg, var(--navy-800), var(--navy-900));
}
.regions > .container { position: relative; z-index: 1; }
.regions-sky { position: absolute; inset: 0 0 35%; pointer-events: none;
  background-image: radial-gradient(1.4px 1.4px at 12% 18%, #fff 50%, transparent 51%), radial-gradient(1.2px 1.2px at 28% 62%, #fff 50%, transparent 51%), radial-gradient(1.6px 1.6px at 44% 12%, #ffe9b8 50%, transparent 51%), radial-gradient(1.2px 1.2px at 58% 40%, #fff 50%, transparent 51%), radial-gradient(1.5px 1.5px at 71% 22%, #fff 50%, transparent 51%), radial-gradient(1.2px 1.2px at 83% 55%, #ffe9b8 50%, transparent 51%), radial-gradient(1.4px 1.4px at 93% 14%, #fff 50%, transparent 51%), radial-gradient(1.1px 1.1px at 6% 70%, #fff 50%, transparent 51%), radial-gradient(1.3px 1.3px at 36% 34%, #fff 50%, transparent 51%), radial-gradient(1.1px 1.1px at 66% 72%, #fff 50%, transparent 51%);
  opacity: .55; animation: region-twinkle 5s ease-in-out infinite alternate; }
.regions-dunes { position: absolute; left: 0; right: 0; bottom: -1px; width: 100%; height: clamp(70px, 9vw, 140px); pointer-events: none; }
.regions-dunes .dune-back { fill: #16344a; opacity: .7; }
.regions-dunes .dune-front { fill: #1c0f07; opacity: .55; }
@keyframes region-twinkle { from { opacity: .3; } to { opacity: .75; } }
@keyframes region-float { from { transform: translateY(0); } to { transform: translateY(-9px); } }
@keyframes region-march { to { stroke-dashoffset: -64; } }
@keyframes region-pulse { 0% { transform: scale(1); opacity: .75; } 100% { transform: scale(2.1); opacity: 0; } }
@keyframes region-card-in { from { opacity: 0; transform: translateY(18px) scale(.98); } to { opacity: 1; transform: none; } }
@keyframes region-zoom { from { transform: scale(1); } to { transform: scale(1.09); } }
@keyframes region-needle { from { transform: rotate(-5deg); } to { transform: rotate(5deg); } }
@keyframes region-progress { from { transform: scaleX(0); } to { transform: scaleX(1); } }
.regions-head { max-width: 720px; margin: 0 auto clamp(26px, 4vw, 48px); text-align: center; }
.regions h2 { color: #fff; }
.regions h2 span { color: var(--gold-300); }
.regions-head p:not(.eyebrow) { margin: 14px 0 0; }
.regions-layout { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.08fr); gap: clamp(24px, 4vw, 64px); align-items: center; }
.region-map { position: relative; width: 100%; max-width: 520px; margin-inline: auto; aspect-ratio: 600 / 650; animation: region-float 6s ease-in-out infinite alternate; }
.region-map-shape { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; }
.map-land { fill: url(#map-parchment); stroke: #b08a4a; stroke-width: 1.6; stroke-linejoin: round; }
.map-edge { fill: none; stroke: #c39a55; stroke-width: 16; opacity: .32; }
.map-waves path { fill: none; stroke: #e2b566; stroke-width: 1.2; stroke-linecap: round; opacity: .28; }
.map-mountains path { fill: none; stroke: #a07a3c; stroke-width: 1.3; stroke-linecap: round; stroke-linejoin: round; opacity: .7; }
.map-dunes path { fill: none; stroke: #b8873f; stroke-width: 1.2; stroke-linecap: round; opacity: .6; }
.map-routes path { fill: none; stroke: #6f5b3a; stroke-width: 1.6; stroke-dasharray: 2 6; stroke-linecap: round; animation: region-march 4s linear infinite; }
.map-towns circle { fill: #c2562b; stroke: #fff6e2; stroke-width: 1.5; }
.map-compass .star, .map-compass .star-dark, .map-compass .star-minor { transform-box: fill-box; transform-origin: center; animation: region-needle 4s ease-in-out infinite alternate; }
.map-compass circle { fill: none; stroke: #e2b566; stroke-width: 1.6; }
.map-compass .thin { stroke-width: .8; opacity: .8; }
.map-compass .star { fill: #ecd9ae; stroke: #a8833f; stroke-width: 1.2; stroke-linejoin: round; }
.map-compass .star-minor { fill: #d9bd84; stroke: #a8833f; stroke-width: 1; stroke-linejoin: round; }
.map-compass .star-dark { fill: #a8833f; opacity: .85; }
.map-compass .hub { fill: #7a5c26; stroke: none; }
.map-compass .star, .map-compass .star-minor { stroke: #e2b566; }
.map-labels text { fill: #5c4a2c; font-family: var(--font-body); font-size: 11.500px; font-weight: 600; }
.map-compass text { fill: #e2b566; font-family: var(--font-display); font-size: 15px; font-weight: 700; }
.map-palms .leaf { fill: #2f5f38; stroke: #214a2a; stroke-width: .8; }
.map-palms .palm-stem { fill: none; stroke: #214a2a; stroke-width: 3.5; stroke-linecap: round; }
.map-palms { filter: drop-shadow(4px 8px 8px rgba(30, 50, 20, .25)); }
.map-pin { position: absolute; padding: 0; border: 0; background: none; transform: translate(-50%, -100%); transition: transform .25s; }
.map-pin.is-active .map-pin-photo::before { content: ""; position: absolute; inset: -4px; border-radius: 50%; border: 2px solid var(--gold-300); animation: region-pulse 1.8s ease-out infinite; pointer-events: none; }
.map-pin-photo { position: relative; display: block; width: clamp(34px, 3.4vw, 46px); aspect-ratio: 1; border-radius: 50%; border: 3px solid #fff; background: #fff; box-shadow: 0 6px 16px rgba(60, 40, 10, .38); }
.map-pin-photo::after { content: ""; position: absolute; left: 50%; bottom: -8px; width: 12px; height: 12px; background: #fff; transform: translateX(-50%) rotate(45deg); border-radius: 0 0 3px 0; z-index: -1; box-shadow: 4px 4px 8px rgba(60, 40, 10, .25); }
.map-pin-photo img { width: 100%; height: 100%; object-fit: cover; border-radius: 50%; }
.map-pin-label { position: absolute; left: 50%; top: calc(100% + 12px); transform: translateX(-50%); padding: 3px 10px; border-radius: 999px; background: rgba(255, 251, 240, .96); box-shadow: 0 3px 10px rgba(0, 0, 0, .3); font-size: clamp(.66rem, .5rem + .36vw, .8rem); font-weight: 600; color: #2a2114; white-space: nowrap; transition: background-color .2s, color .2s; }
.map-pin.is-active .map-pin-label { background: var(--gold); color: #fff; }
.map-pin-right .map-pin-label { left: calc(100% + 9px); top: 28%; transform: none; }
.map-pin-left .map-pin-label { left: auto; right: calc(100% + 9px); top: 28%; transform: none; }
.map-pin:hover, .map-pin.is-active { transform: translate(-50%, -100%) scale(1.14); z-index: 2; }
.map-pin.is-active .map-pin-photo { border-color: var(--gold); }
.map-pin.is-active .map-pin-photo::after { background: var(--gold); }
.map-legend { position: absolute; left: 50%; bottom: 2%; display: grid; gap: 6px; padding: 10px 14px; border: 1px solid rgba(226, 181, 102, .35); border-radius: 10px; background: rgba(10, 28, 43, .55); font-size: .72rem; color: rgba(255, 255, 255, .85); }
.map-legend li { display: flex; align-items: center; gap: 10px; white-space: nowrap; }
.legend-route { width: 26px; border-top: 2px dotted var(--gold-300); }
.legend-town { width: 9px; height: 9px; margin-inline: 8px 9px; border-radius: 50%; background: #c2562b; box-shadow: 0 0 0 1.5px #fff6e2; }

.region-tabs { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 20px; }
.region-tab { padding: 8px 16px; border: 1px solid rgba(226, 181, 102, .45); border-radius: 999px; background: transparent; color: rgba(255, 255, 255, .85); font-size: .82rem; font-weight: 500; transition: background-color .2s, color .2s, border-color .2s; }
.region-tab:hover { border-color: var(--gold-300); color: #fff; }
.region-tab.is-active { background: linear-gradient(135deg, #c08631, #a66e22); border-color: transparent; color: #fff; font-weight: 600; }
.region-card { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1fr); gap: clamp(18px, 2.4vw, 32px); align-items: center; padding: clamp(18px, 2vw, 26px); color: var(--text); background: linear-gradient(135deg, #fffdf8, #f6ecd9); border-radius: 22px; box-shadow: 0 0 0 1px rgba(226, 181, 102, .5), 0 30px 70px rgba(0, 0, 0, .4); }
.region-card[hidden] { display: none; }
.region-card:not([hidden]) { animation: region-card-in .55s ease both; }
.region-card:not([hidden]) .region-card-photo img { animation: region-zoom 7s ease-out both; }
.region-card-photo { overflow: hidden; }
.region-card-photo img { display: block; }
.region-progress { height: 3px; margin: -8px 0 18px; border-radius: 3px; background: rgba(255, 255, 255, .14); overflow: hidden; }
.region-progress span { display: block; height: 100%; background: linear-gradient(90deg, #c08631, #e2b566); transform-origin: left; transform: scaleX(0); }
.region-progress span.is-running { animation: region-progress 6s linear forwards; }
.region-panel:hover .region-progress span.is-running { animation-play-state: paused; }
.region-card-photo { padding: 6px; border: 1.5px solid var(--gold); border-radius: 999px 999px 16px 16px; box-shadow: 0 0 0 6px rgba(182, 122, 42, .12); }
.region-card-photo img { width: 100%; aspect-ratio: 520 / 640; object-fit: cover; border-radius: 999px 999px 10px 10px; }
.region-count { margin: 0 0 6px; font-size: .8rem; letter-spacing: .12em; color: var(--muted); }
.region-count b { font-family: var(--font-display); font-size: 1.5rem; color: var(--gold-600); letter-spacing: 0; }
.region-card h3 { font-size: clamp(1.5rem, 1.2rem + 1vw, 2.1rem); }
.region-card-body > p:not(.region-count) { margin: 10px 0 16px; font-size: .92rem; line-height: 1.65; }
.region-tags { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 22px; }
.region-tags li { padding: 5px 12px; border-radius: 999px; background: rgba(182, 122, 42, .12); color: var(--gold-600); font-size: .76rem; font-weight: 600; }
.region-card .btn { min-height: 46px; padding: 10px 24px; font-size: .9rem; border-radius: 999px; }
.region-nav { display: flex; align-items: center; gap: 12px; margin-top: 20px; }
.region-nav .text-link { margin-left: auto; }
.round-btn-light { border-color: rgba(226, 181, 102, .6); color: var(--gold-300); }
.round-btn-light:hover { background: var(--gold); border-color: var(--gold); color: #fff; }

.dream-cta { position: relative; isolation: isolate; color: #fff; padding-block: clamp(60px, 7vw, 96px); overflow: hidden; background: #1c0f07; }
.dream-cta-media { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; object-fit: cover; object-position: 30% 50%; }
.dream-cta::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(270deg, rgba(28, 15, 7, .92), rgba(28, 15, 7, .6) 42%, rgba(28, 15, 7, 0) 70%); }
.dream-cta-content { max-width: 500px; margin-left: auto; }
.dream-cta h2 { color: #fff; }
.dream-cta-content > p { margin: 14px 0 24px; color: rgba(255, 255, 255, .9); }
.dream-cta .hero-points { margin-top: 34px; gap: 14px clamp(16px, 2.4vw, 34px); }

/* ==========================================================================
   Tour details page
   ========================================================================== */
.tour-hero { padding-bottom: clamp(120px, 12vw, 170px); }
.tour-hero h1 { max-width: 17em; margin-top: 14px; font-size: clamp(2rem, 1.3rem + 2.6vw, 3.3rem); line-height: 1.12; }
.tour-hero .page-hero-lead { max-width: 34em; margin: 16px 0 26px; }
.tour-hero .breadcrumbs li[aria-current] { max-width: 28em; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; display: block; }
.tour-hero-tags { display: flex; flex-wrap: wrap; gap: 8px; margin: clamp(20px, 3vw, 32px) 0 0; }
.tour-tag { display: inline-flex; align-items: center; gap: 7px; padding: 6px 14px; border-radius: 999px; border: 1px solid rgba(255, 255, 255, .35); background: rgba(20, 10, 4, .35); font-size: .78rem; font-weight: 500; backdrop-filter: blur(4px); }
.tour-tag .icon { width: 15px; height: 15px; color: var(--gold-300); }
.tour-tag-badge { background: var(--gold); border-color: var(--gold); font-weight: 600; }

.tour-strip { position: relative; z-index: 5; display: grid; grid-template-columns: repeat(5, 1fr); gap: clamp(8px, 1vw, 14px); margin-top: clamp(-104px, -8vw, -76px); }
.tour-strip li { border-radius: 14px; overflow: hidden; border: 3px solid #fff; box-shadow: var(--shadow); aspect-ratio: 4 / 2.7; background: var(--sand-200); }
.tour-strip img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s; }
.tour-strip li:hover img { transform: scale(1.06); }

.tour-tabs { position: sticky; top: var(--header-h); z-index: 50; margin-top: clamp(22px, 3vw, 34px); background: rgba(253, 250, 244, .97); border-block: 1px solid var(--sand-200); backdrop-filter: blur(10px); }
.tour-tabs .container { display: flex; gap: clamp(4px, 1.6vw, 26px); overflow-x: auto; scrollbar-width: none; }
.tour-tabs .container::-webkit-scrollbar { display: none; }
.tour-tabs a { position: relative; display: inline-flex; align-items: center; gap: 8px; padding: 16px 6px; font-size: .9rem; font-weight: 600; color: var(--ink); white-space: nowrap; }
.tour-tabs a .icon { width: 17px; height: 17px; color: var(--gold); }
.tour-tabs a::after { content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 3px; border-radius: 3px 3px 0 0; background: var(--gold); transform: scaleX(0); transition: transform .25s; }
.tour-tabs a:hover, .tour-tabs a.is-active { color: var(--gold-600); }
.tour-tabs a:hover::after, .tour-tabs a.is-active::after { transform: scaleX(1); }

.tour-layout { display: grid; grid-template-columns: minmax(0, 1fr) clamp(320px, 29vw, 384px); gap: clamp(28px, 3.4vw, 52px); align-items: start; padding-block: clamp(34px, 4vw, 56px) clamp(40px, 5vw, 72px); }
.tour-main { min-width: 0; }
.tour-block { scroll-margin-top: calc(var(--header-h) + 74px); padding-bottom: clamp(34px, 4vw, 52px); margin-bottom: clamp(34px, 4vw, 52px); border-bottom: 1px solid var(--sand-200); }
.tour-block:last-child { border-bottom: 0; margin-bottom: 0; padding-bottom: 0; }
.tour-block h2 { font-size: clamp(1.6rem, 1.2rem + 1.3vw, 2.2rem); margin-bottom: 18px; }
.tour-block > p:not(.eyebrow) { margin: 0 0 1.05em; line-height: 1.8; }
.tour-block-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; margin-bottom: 22px; }
.tour-block-head h2 { margin-bottom: 0; }
.btn-pill { flex: none; padding: 9px 18px; border: 1px solid var(--sand-200); border-radius: 999px; background: #fff; color: var(--ink); font-size: .82rem; font-weight: 600; box-shadow: var(--shadow-sm); }
.btn-pill:hover { border-color: var(--gold); color: var(--gold-600); }
.tour-subtitle { margin: 34px 0 16px; font-family: var(--font-display); font-size: 1.3rem; }

.tour-facts { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin-top: 28px; }
.tour-facts li { display: flex; gap: 12px; align-items: flex-start; padding: 16px 14px; border-radius: 12px; background: #fff; border: 1px solid var(--sand-200); box-shadow: var(--shadow-sm); }
.tour-facts .icon { flex: none; width: 26px; height: 26px; color: var(--gold); stroke-width: 1.4; }
.tour-facts small { display: block; font-size: .72rem; color: var(--muted); letter-spacing: .04em; text-transform: uppercase; }
.tour-facts strong { display: block; margin-top: 2px; font-size: .88rem; line-height: 1.35; color: var(--ink); font-weight: 600; }

.tour-highlights { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 14px; text-align: center; font-size: .84rem; line-height: 1.4; color: var(--ink); font-weight: 500; }
.tour-highlights li { display: flex; flex-direction: column; align-items: center; gap: 12px; }
.tour-highlight-icon { display: grid; place-items: center; width: 76px; height: 76px; border-radius: 999px 999px 18px 18px; background: var(--sand-100); border: 1px solid var(--sand-200); color: var(--gold); transition: background .25s, color .25s, transform .25s; }
.tour-highlight-icon .icon { width: 36px; height: 36px; stroke-width: 1.3; }
.tour-highlights li:hover .tour-highlight-icon { background: var(--navy-800); color: var(--gold-300); transform: translateY(-3px); }

.days { position: relative; display: grid; gap: 14px; }
.days::before { content: ""; position: absolute; left: 39px; top: 24px; bottom: 24px; width: 1px; border-left: 2px dotted #d9c39b; }
.day { position: relative; border-radius: 14px; border: 1px solid var(--sand-200); background: #fff; box-shadow: var(--shadow-sm); overflow: hidden; }
.day[open] { box-shadow: 0 10px 30px rgba(16, 35, 52, .09); border-color: #e2cfa6; }
.day summary { position: relative; display: flex; align-items: center; gap: 16px; padding: 16px 54px 16px 14px; cursor: pointer; list-style: none; }
.day summary::-webkit-details-marker { display: none; }
.day summary::after { content: ""; position: absolute; right: 22px; top: 50%; width: 9px; height: 9px; margin-top: -7px; border-right: 2px solid var(--gold); border-bottom: 2px solid var(--gold); transform: rotate(45deg); transition: transform .25s; }
.day[open] summary::after { transform: rotate(-135deg); margin-top: -2px; }
.day-pill { position: relative; z-index: 1; flex: none; min-width: 54px; padding: 8px 6px; border-radius: 10px; background: var(--navy-800); color: #fff; font-size: .74rem; font-weight: 600; text-align: center; letter-spacing: .02em; }
.day[open] .day-pill { background: var(--gold); }
.day h3 { font-family: var(--font-display); font-size: clamp(1rem, .95rem + .3vw, 1.16rem); line-height: 1.35; }
.day summary:hover h3 { color: var(--gold-600); }
.day-body { padding: 4px 22px 22px 84px; }
.day-meta { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 18px; }
.day-meta li { display: inline-flex; align-items: center; gap: 7px; padding: 6px 12px; border-radius: 999px; background: var(--sand-100); font-size: .78rem; font-weight: 500; color: var(--ink); }
.day-meta .icon { width: 15px; height: 15px; color: var(--gold); }
.day-text::after { content: ""; display: block; clear: both; }
.day-text img { float: right; width: min(42%, 290px); aspect-ratio: 4 / 3; object-fit: cover; margin: 4px 0 14px 22px; border-radius: 12px; box-shadow: var(--shadow-sm); }
.day-text p { margin: 0 0 1em; font-size: .95rem; line-height: 1.8; }
.day-pics { float: right; display: grid; gap: 10px; width: min(42%, 290px); margin: 4px 0 14px 22px; }
.day-text .day-pics img { float: none; width: 100%; margin: 0; }
.day-highlights { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px 22px; margin-top: 6px; padding-top: 16px; border-top: 1px dashed var(--sand-200); font-size: .86rem; color: var(--ink); }
.day-highlights li, .incl li, .practical-item li { position: relative; padding-left: 26px; }
.day-highlights li::before, .incl-yes li::before, .practical-item li::before { content: ""; position: absolute; left: 3px; top: .42em; width: 11px; height: 6px; border-left: 2px solid var(--gold); border-bottom: 2px solid var(--gold); transform: rotate(-45deg); }

.incl-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.incl { padding: 24px 22px; border-radius: 14px; background: #fff; border: 1px solid var(--sand-200); box-shadow: var(--shadow-sm); }
.incl h3 { margin-bottom: 14px; font-family: var(--font-display); font-size: 1.14rem; }
.incl ul { display: grid; gap: 9px; font-size: .9rem; line-height: 1.5; }
.incl-yes { border-top: 3px solid #1f9d57; }
.incl-yes li::before { border-color: #1f9d57; }
.incl-no { border-top: 3px solid var(--terracotta); background: var(--sand-50); }
.incl-no li::before, .incl-no li::after { content: ""; position: absolute; left: 3px; top: .7em; width: 12px; height: 2px; background: var(--terracotta); transform: rotate(45deg); }
.incl-no li::after { transform: rotate(-45deg); }
.optional-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.optional-list li { padding: 14px 16px; border-radius: 12px; border: 1px dashed #d9c39b; background: var(--sand-50); font-size: .87rem; line-height: 1.55; }
.optional-list strong { display: block; margin-bottom: 3px; color: var(--ink); font-size: .93rem; }

.practical { display: grid; gap: 12px; }
.practical-item { border-radius: 12px; border: 1px solid var(--sand-200); background: #fff; }
.practical-item summary { position: relative; display: flex; align-items: center; gap: 12px; padding: 17px 54px 17px 20px; font-weight: 600; color: var(--ink); cursor: pointer; list-style: none; }
.practical-item summary::-webkit-details-marker { display: none; }
.practical-item summary .icon { width: 20px; height: 20px; color: var(--gold); }
.practical-item summary::before, .practical-item summary::after { content: ""; position: absolute; right: 22px; top: 50%; width: 14px; height: 2px; background: var(--gold); transition: transform .25s; }
.practical-item summary::after { transform: rotate(90deg); }
.practical-item[open] summary::after { transform: rotate(0); }
.practical-item > p { margin: 0; padding: 0 22px 14px; font-size: .93rem; line-height: 1.75; }
.practical-item > p:last-child { padding-bottom: 20px; }
.practical-item ul { display: grid; gap: 9px; padding: 0 22px 20px; font-size: .92rem; line-height: 1.55; }

.tour-side { display: grid; gap: 22px; position: sticky; top: calc(var(--header-h) + 74px); }
.book-card { padding: 26px 24px 24px; border-radius: 18px; background: radial-gradient(120% 90% at 100% 0%, #17405c 0%, var(--navy-800) 46%, var(--navy-900) 100%); color: #fff; box-shadow: 0 20px 44px rgba(10, 28, 43, .3); display: grid; gap: 14px; }
.book-price { margin: 0 0 4px; line-height: 1.2; }
.book-price small { display: block; font-size: .78rem; color: rgba(255, 255, 255, .7); }
.book-price strong { font-family: var(--font-display); font-size: 2.3rem; color: var(--gold-300); }
.book-price span { font-size: .84rem; color: rgba(255, 255, 255, .78); }
.book-price-quote strong { font-size: 1.8rem; }
.book-price-quote span { display: block; }
.book-field { display: grid; gap: 6px; font-size: .76rem; font-weight: 500; letter-spacing: .04em; text-transform: uppercase; color: rgba(255, 255, 255, .72); }
.book-field select, .book-field input { width: 100%; height: 48px; padding: 0 14px; border-radius: 10px; border: 1px solid rgba(255, 255, 255, .22); background: rgba(255, 255, 255, .08); color: #fff; font: inherit; font-size: .92rem; letter-spacing: 0; text-transform: none; color-scheme: dark; }
.book-field select option { color: #17232e; }
.book-field select:focus, .book-field input:focus { outline: 2px solid var(--gold-300); outline-offset: 1px; }
.book-card .btn-gold { width: 100%; justify-content: center; margin-top: 4px; }
.book-mail { display: inline-flex; align-items: center; justify-content: center; gap: 8px; font-size: .84rem; font-weight: 500; color: rgba(255, 255, 255, .85); }
.book-mail:hover { color: var(--gold-300); }
.book-mail .icon { width: 16px; height: 16px; }
.book-points { display: grid; gap: 10px; padding-top: 16px; border-top: 1px solid rgba(255, 255, 255, .14); font-size: .86rem; color: rgba(255, 255, 255, .9); }
.book-points li { display: flex; align-items: center; gap: 10px; }
.book-points .icon { flex: none; width: 17px; height: 17px; color: var(--gold-300); }
.book-help { padding: 16px; border-radius: 12px; background: rgba(255, 255, 255, .07); border: 1px solid rgba(255, 255, 255, .12); }
.book-help p { margin: 0 0 12px; font-size: .86rem; color: rgba(255, 255, 255, .86); }
.book-help strong { color: #fff; }
.book-help .btn { width: 100%; justify-content: center; }

.route-panel { position: relative; isolation: isolate; scroll-margin-top: calc(var(--header-h) + 74px); padding: 20px 18px 18px; border-radius: 22px; overflow: hidden; color: #fff; background: radial-gradient(90% 60% at 100% 0%, rgba(194, 86, 43, .5), transparent 65%), radial-gradient(70% 50% at 0% 100%, rgba(226, 181, 102, .22), transparent 60%), linear-gradient(180deg, #4a2c18, #24140b); border: 1px solid rgba(226, 181, 102, .35); box-shadow: 0 22px 46px rgba(50, 26, 10, .34); }
.route-panel::before { content: ""; position: absolute; left: 0; right: 0; top: 0; z-index: 1; height: 3px; background: linear-gradient(90deg, transparent, var(--gold-300), transparent); }
.route-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 12px; margin-bottom: 16px; }
.route-head h2 { color: #fff; font-size: 1.55rem; }
.route-km { margin: 0; text-align: right; line-height: 1.1; }
.route-km strong { display: block; font-family: var(--font-display); font-size: 1.5rem; color: var(--gold-300); }
.route-km span { font-size: .64rem; letter-spacing: .1em; text-transform: uppercase; color: rgba(255, 244, 228, .7); }

.tour-map { position: relative; aspect-ratio: 1 / 1.04; overflow: hidden; border-radius: 16px; background: #dfe7df; box-shadow: 0 0 0 1px rgba(226, 181, 102, .6), 0 16px 34px rgba(0, 0, 0, .42); }
.tour-map-sea { position: absolute; inset: 0; width: 100%; height: 100%; }
.tour-map-sea path { fill: #a9d3df; }
.tour-map-inner { position: absolute; aspect-ratio: 600 / 650; filter: drop-shadow(0 0 7px rgba(255, 255, 255, .9)) drop-shadow(0 6px 14px rgba(40, 80, 100, .35)); }
.tour-map .map-routes, .tour-map .map-palms, .tour-map .map-compass, .tour-map .map-labels, .tour-map .map-waves, .tour-map .map-towns, .tour-map .map-edge, .tour-map-inner rect { display: none; }
.tour-map-inner g[filter="url(#map-shadow)"] { filter: none; }
.tour-map .map-land { fill: #f6ead0; stroke: #c9a465; stroke-width: 1; }
.tour-map .map-mountains path { stroke: #b99a63; opacity: .8; }
.tour-map .map-dunes path { stroke: #cfa862; opacity: .7; }
.tour-map::before { content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none; opacity: .5; background-image: linear-gradient(rgba(13, 36, 54, .09) 1px, transparent 1px), linear-gradient(90deg, rgba(13, 36, 54, .09) 1px, transparent 1px); background-size: 20% 20%; }
.tour-map::after { content: ""; position: absolute; inset: 0; z-index: 3; border-radius: inherit; pointer-events: none; box-shadow: inset 0 0 0 5px rgba(255, 255, 255, .85), inset 0 0 0 6px rgba(182, 122, 42, .5), inset 0 0 46px rgba(13, 36, 54, .2); }
.tour-map-route { position: absolute; inset: 0; z-index: 1; width: 100%; height: 100%; }
.tour-map-names text { fill: #9a7b45; font-family: var(--font-display); font-style: italic; letter-spacing: .14em; text-anchor: middle; opacity: .8; }
.tour-map-names text:first-child, .tour-map-names text:nth-child(4) { fill: #3f7f92; }
.tour-map-names text:last-child { fill: #8b9388; letter-spacing: .3em; text-transform: uppercase; font-style: normal; }
.tour-map-casing { fill: none; stroke: var(--navy-800); stroke-width: 6; stroke-linecap: round; stroke-linejoin: round; vector-effect: non-scaling-stroke; }
.tour-map-line { fill: none; stroke: var(--gold-300); stroke-width: 2.6; stroke-linecap: round; stroke-linejoin: round; vector-effect: non-scaling-stroke; }
.tour-map-dot { fill: #fff; stroke: var(--navy-800); stroke-width: 1.5; vector-effect: non-scaling-stroke; }
.tour-map-halo { fill: rgba(255, 255, 255, .55); animation: tour-halo 1.6s ease-in-out infinite; }
@keyframes tour-halo { 50% { opacity: .15; } }
.tour-pin { position: absolute; z-index: 2; width: 0; height: 0; }
.tour-pin b { position: absolute; left: -12px; top: -12px; display: grid; place-items: center; width: 24px; height: 24px; border-radius: 50%; background: var(--navy-800); border: 2px solid var(--gold-300); color: #fff; font-size: .68rem; font-weight: 700; box-shadow: 0 4px 10px rgba(13, 36, 54, .45); }
.tour-pin:first-of-type b { background: linear-gradient(135deg, #c98f3a, #a66e22); border-color: #fff; }
.tour-pin:first-of-type b::after { content: ""; position: absolute; inset: -7px; border-radius: 50%; border: 2px solid var(--gold); opacity: .7; animation: region-pulse 2s ease-out infinite; }
.tour-pin-label { position: absolute; font-size: .7rem; font-weight: 700; line-height: 1.4; letter-spacing: .01em; color: var(--navy-900); white-space: nowrap; text-shadow: 0 0 2px #fff, 0 0 2px #fff, 0 0 4px #fff, 0 0 6px #fff, 0 0 8px #fff; }
.tour-pin-right .tour-pin-label { left: 16px; top: -9px; }
.tour-pin-left .tour-pin-label { right: 16px; top: -9px; }
.tour-pin-top .tour-pin-label { left: 0; bottom: 14px; transform: translateX(-50%); }
.tour-pin-bottom .tour-pin-label { left: 0; top: 14px; transform: translateX(-50%); }
.tour-pin-top-right .tour-pin-label { left: 10px; bottom: 10px; }
.tour-pin-top-left .tour-pin-label { right: 10px; bottom: 10px; }
.tour-pin-bottom-right .tour-pin-label { left: 10px; top: 10px; }
.tour-pin-bottom-left .tour-pin-label { right: 10px; top: 10px; }
.tour-map-compass { position: absolute; right: 14px; top: 14px; z-index: 2; width: 38px; height: 38px; overflow: visible; }
.tour-map-compass circle { fill: rgba(255, 255, 255, .9); stroke: var(--gold); stroke-width: 1; }
.tour-map-compass path { fill: #c9b88f; }
.tour-map-compass .north { fill: var(--terracotta); }
.tour-map-compass text { fill: var(--navy-800); font-size: 7px; font-weight: 700; text-anchor: middle; }
.tour-map-scale { position: absolute; left: 16px; bottom: 14px; z-index: 2; padding-bottom: 3px; border: solid var(--navy-800); border-width: 0 1.5px 1.5px; font-size: .58rem; font-weight: 700; letter-spacing: .06em; line-height: 1.6; text-align: center; color: var(--navy-800); white-space: nowrap; text-shadow: 0 0 3px #fff, 0 0 5px #fff; }

.map-route { display: grid; margin: 18px 0 0; padding: 4px 14px; list-style: none; border-radius: 14px; background: rgba(255, 244, 228, .07); border: 1px solid rgba(226, 181, 102, .22); }
.map-route li { position: relative; display: flex; align-items: center; gap: 12px; padding: 8px 0; font-size: .9rem; font-weight: 500; color: #fff; }
.map-route li + li { border-top: 1px solid rgba(255, 244, 228, .08); }
.map-route li + li::before { content: ""; position: absolute; left: 11px; top: -10px; height: 20px; border-left: 2px dotted rgba(226, 181, 102, .65); }
.map-route b { position: relative; z-index: 1; flex: none; display: grid; place-items: center; width: 24px; height: 24px; border-radius: 50%; background: #2a170c; border: 1.5px solid var(--gold-300); color: #fff; font-size: .68rem; }
.map-route li:first-child b { background: linear-gradient(135deg, #c98f3a, #a66e22); border-color: #fff; }
.map-route em { margin-left: auto; padding: 2px 10px; border-radius: 999px; background: rgba(226, 181, 102, .14); border: 1px solid rgba(226, 181, 102, .5); font-style: normal; font-size: .62rem; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--gold-300); white-space: nowrap; }
.map-route-head { margin: 18px 0 8px; font-size: .68rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--gold-300); }
.map-route-head + .map-route { margin-top: 0; }
.map-route-days li { padding: 7px 0; font-size: .86rem; }
.map-route-days li:first-child b, .map-route-days li:last-child b { background: linear-gradient(135deg, #c98f3a, #a66e22); border-color: #fff; }
.map-stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin-top: 12px; }
.map-stats li { padding: 12px 8px; border-radius: 12px; background: rgba(255, 244, 228, .07); border: 1px solid rgba(226, 181, 102, .22); text-align: center; }
.map-stats .icon { width: 18px; height: 18px; color: var(--gold-300); }
.map-stats small { display: block; margin-top: 4px; font-size: .6rem; letter-spacing: .1em; text-transform: uppercase; color: rgba(255, 244, 228, .65); }
.map-stats strong { display: block; font-size: .84rem; line-height: 1.25; color: #fff; }

.tour-stay { background: var(--sand-100); scroll-margin-top: calc(var(--header-h) + 40px); }
.tour-related { scroll-margin-top: calc(var(--header-h) + 40px); }
.route-panel.is-flash { animation: route-flash 1.4s ease-out; }
@keyframes route-flash { 0%, 30% { box-shadow: 0 0 0 4px var(--gold), 0 22px 46px rgba(50, 26, 10, .34); } 100% { box-shadow: 0 22px 46px rgba(50, 26, 10, .34); } }
@media (prefers-reduced-motion: reduce) { .route-panel.is-flash { animation: none; } }
.stay-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 300px), 1fr)); gap: clamp(14px, 1.8vw, 24px); }
.stay-card { display: flex; flex-direction: column; border-radius: 16px; overflow: hidden; background: #fff; border: 1px solid var(--sand-200); box-shadow: var(--shadow-sm); transition: transform .3s, box-shadow .3s; }
.stay-card:hover { transform: translateY(-4px); box-shadow: var(--shadow); }
.stay-card img { width: 100%; aspect-ratio: 4 / 2.4; object-fit: cover; }
.stay-card-text { padding: 18px 20px 20px; }
.stay-card-nights { margin: 0 0 6px; font-size: .72rem; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--gold-600); }
.stay-card h3 { font-family: var(--font-display); font-size: 1.2rem; }
.stay-card-type { margin: 4px 0 10px; font-size: .86rem; font-weight: 600; color: var(--ink); }
.stay-card-text p:last-child { margin: 0; font-size: .88rem; line-height: 1.65; }

.camps { margin-top: clamp(40px, 5vw, 68px); padding-top: clamp(34px, 4vw, 56px); border-top: 1px solid #e6d6b8; }
.camps-head { text-align: center; max-width: 40em; margin: 0 auto clamp(24px, 3vw, 36px); }
.camps-head .eyebrow { justify-content: center; }
.camps-head h3 { font-family: var(--font-display); font-size: clamp(1.5rem, 1.2rem + 1vw, 2rem); }
.camps-head p:not(.eyebrow) { margin: 10px 0 0; }
.camps-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(16px, 2.2vw, 30px); align-items: stretch; }
.camp-card { display: flex; flex-direction: column; border-radius: 20px; overflow: hidden; background: #fff; border: 1px solid var(--sand-200); box-shadow: var(--shadow-sm); transition: transform .3s, box-shadow .3s; }
.camp-card:hover { transform: translateY(-4px); box-shadow: var(--shadow); }
.camp-card.is-featured { border-color: var(--gold); box-shadow: 0 0 0 1px var(--gold), var(--shadow); }
.camp-card-media { position: relative; aspect-ratio: 16 / 8.4; overflow: hidden; }
.camp-card-media img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 78%; transition: transform .7s; }
.camp-card:hover .camp-card-media img { transform: scale(1.05); }
.camp-card-tag { position: absolute; left: 16px; top: 16px; padding: 6px 14px; border-radius: 999px; background: rgba(10, 28, 43, .82); color: #fff; font-size: .74rem; font-weight: 600; letter-spacing: .03em; backdrop-filter: blur(4px); }
.camp-card.is-featured .camp-card-tag { background: var(--gold); }
.camp-card-text { padding: clamp(20px, 2.2vw, 28px); }
.camp-card h4 { display: flex; align-items: center; gap: 10px; margin: 0 0 16px; font-family: var(--font-display); font-size: 1.35rem; color: var(--ink); }
.camp-card h4 .icon { width: 24px; height: 24px; color: var(--gold); stroke-width: 1.5; }
.camp-card ul { display: grid; gap: 10px; font-size: .93rem; line-height: 1.5; }
.camp-card li { position: relative; padding-left: 28px; }
.camp-card li::before { content: ""; position: absolute; left: 4px; top: .42em; width: 11px; height: 6px; border-left: 2px solid var(--gold); border-bottom: 2px solid var(--gold); transform: rotate(-45deg); }

.tour-gallery { position: relative; isolation: isolate; overflow: hidden; color: #fff; background: radial-gradient(70% 55% at 50% 42%, #1b4a69 0%, var(--navy-800) 48%, var(--navy-900) 100%); }
.tour-gallery::before { content: ""; position: absolute; inset: 0; z-index: -1; opacity: .5; background-image: radial-gradient(1.4px 1.4px at 12% 18%, #fff 50%, transparent 51%), radial-gradient(1.2px 1.2px at 31% 62%, #e2b566 50%, transparent 51%), radial-gradient(1.4px 1.4px at 54% 12%, #fff 50%, transparent 51%), radial-gradient(1.2px 1.2px at 72% 78%, #fff 50%, transparent 51%), radial-gradient(1.6px 1.6px at 91% 34%, #e2b566 50%, transparent 51%), radial-gradient(1.2px 1.2px at 6% 84%, #fff 50%, transparent 51%); }
.gallery-head { text-align: center; margin-bottom: clamp(26px, 3.4vw, 46px); }
.gallery-head .eyebrow { justify-content: center; }
.gallery-head h2 { color: #fff; }
.gallery-head p:not(.eyebrow) { max-width: 36em; margin: 12px auto 0; color: rgba(255, 255, 255, .8); }

.arches { display: flex; align-items: flex-end; gap: clamp(8px, 1vw, 14px); height: clamp(380px, 40vw, 540px); counter-reset: arch; }
.arch { counter-increment: arch; flex: 1 1 0; min-width: 0; height: 82%; transition: flex-grow .8s cubic-bezier(.22, .8, .24, 1), height .8s cubic-bezier(.22, .8, .24, 1); }
.arch:nth-child(even) { height: 72%; }
.arch.is-active { flex-grow: 6.5; height: 100%; }
.arch button { position: relative; display: block; width: 100%; height: 100%; padding: 0; border: 0; border-radius: 240px 240px 16px 16px; overflow: hidden; background: var(--navy-900); cursor: pointer; box-shadow: 0 24px 50px rgba(0, 0, 0, .45); }
.arch img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; filter: saturate(.7) brightness(.62); transition: filter .7s, transform 7s ease-out; }
.arch.is-active img { filter: none; transform: scale(1.07); }
.arch button::after { content: ""; position: absolute; inset: 0; background: linear-gradient(0deg, rgba(6, 18, 28, .88) 0%, rgba(6, 18, 28, 0) 46%); }
.arch-frame { position: absolute; inset: 9px; z-index: 2; border-radius: 232px 232px 10px 10px; border: 1px solid rgba(226, 181, 102, .0); transition: border-color .6s; pointer-events: none; }
.arch.is-active .arch-frame { border-color: rgba(226, 181, 102, .75); }
.arch-text { position: absolute; left: 0; right: 0; bottom: 0; z-index: 3; display: grid; justify-items: center; gap: 10px; padding: 0 10px 22px; text-align: center; color: #fff; }
.arch-num::before { content: counter(arch, decimal-leading-zero); }
.arch-num { font-family: var(--font-display); font-size: 1.25rem; font-weight: 700; color: var(--gold-300); transition: font-size .6s; }
.arch-caption, .arch-zoom { display: none; }
.arch.is-active .arch-text { grid-template-columns: auto minmax(0, 1fr) auto; align-items: end; justify-items: start; gap: 18px; padding: 0 clamp(22px, 2.6vw, 38px) clamp(22px, 2.4vw, 32px); text-align: left; }
.arch.is-active .arch-num { font-size: clamp(2.4rem, 1.6rem + 2vw, 3.4rem); line-height: .9; }
.arch.is-active .arch-caption { display: block; padding-left: 18px; border-left: 1px solid rgba(226, 181, 102, .6); font-family: var(--font-display); font-size: clamp(1rem, .9rem + .5vw, 1.3rem); line-height: 1.35; animation: arch-rise .7s .25s both; }
.arch.is-active .arch-zoom { display: inline-flex; align-items: center; gap: 7px; padding: 9px 16px; border-radius: 999px; border: 1px solid rgba(255, 255, 255, .4); background: rgba(8, 22, 34, .45); font-size: .76rem; font-weight: 500; white-space: nowrap; backdrop-filter: blur(6px); animation: arch-rise .7s .35s both; transition: background .25s, border-color .25s; }
.arch.is-active button:hover .arch-zoom { background: var(--gold); border-color: var(--gold); }
.arch-zoom .icon { width: 14px; height: 14px; }
.arch:not(.is-active) button:hover img { filter: saturate(.9) brightness(.85); }
.arch button:focus-visible { outline: 2px solid var(--gold-300); outline-offset: 3px; }
@keyframes arch-rise { from { opacity: 0; transform: translateY(14px); } }
.flow-arrow { position: absolute; top: 50%; z-index: 8; display: grid; place-items: center; width: 52px; height: 52px; margin-top: -26px; border-radius: 50%; border: 1px solid rgba(226, 181, 102, .7); background: rgba(8, 22, 34, .55); color: #fff; transition: background .25s, transform .25s; }
.flow-arrow:hover { background: var(--gold); border-color: var(--gold); transform: scale(1.08); }
.flow-arrow .icon { width: 20px; height: 20px; }

.lightbox { width: 100vw; max-width: none; height: 100vh; height: 100dvh; max-height: none; margin: 0; padding: 0; border: 0; background: rgba(5, 14, 22, .96); color: #fff; }
.lightbox[open] { display: grid; place-items: center; animation: lightbox-in .3s; }
.lightbox::backdrop { background: rgba(5, 14, 22, .9); }
.lightbox figure { margin: 0; max-width: min(92vw, 1240px); text-align: center; }
.lightbox figure img { width: auto; max-width: 100%; height: auto; max-height: 80vh; border-radius: 14px; box-shadow: 0 30px 80px rgba(0, 0, 0, .6); }
.lightbox figcaption { margin-top: 16px; font-family: var(--font-display); font-size: 1.1rem; }
.lightbox .flow-arrow-prev { left: clamp(10px, 2vw, 30px); }
.lightbox .flow-arrow-next { right: clamp(10px, 2vw, 30px); }
.lightbox-close { position: absolute; top: clamp(12px, 2vw, 26px); right: clamp(12px, 2vw, 26px); display: grid; place-items: center; width: 48px; height: 48px; border-radius: 50%; border: 1px solid rgba(255, 255, 255, .35); background: transparent; color: #fff; }
.lightbox-close:hover { background: #fff; color: var(--navy-800); }
@keyframes lightbox-in { from { opacity: 0; } }

.tour-related { background: var(--sand-100); }
.related-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: clamp(14px, 1.6vw, 22px); }
.tcard-route { margin: 10px 0 14px; font-size: .82rem; line-height: 1.5; color: var(--muted); }
.tcard-mini .tcard-foot { margin-top: auto; }

@media (max-width: 1100px) {
  .tour-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .tour-highlights { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px 14px; }
  .related-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 960px) {
  .tour-layout { grid-template-columns: minmax(0, 1fr); }
  .tour-side { position: static; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; }
}
@media (max-width: 700px) {
  .tour-hero { padding-bottom: 96px; }
  .tour-hero .breadcrumbs li[aria-current] { display: none; }
  .tour-hero .hero-points { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 8px; }
  .tour-hero .hero-points li { font-size: .54rem; gap: 7px; letter-spacing: -.01em; }
  .tour-hero .hero-points .icon { width: 24px; height: 24px; }
  .tour-strip { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; margin-inline: calc(var(--gutter) * -1); padding: 6px var(--gutter) 10px; margin-top: -70px; }
  .tour-strip::-webkit-scrollbar { display: none; }
  .tour-strip li { flex: 0 0 46%; scroll-snap-align: start; }
  .tour-tabs { margin-top: 8px; }
  .tour-tabs a { padding: 14px 4px; font-size: .84rem; }
  .tour-side { grid-template-columns: minmax(0, 1fr); }
  .tour-block-head { flex-direction: column; align-items: flex-start; }
  .days::before { display: none; }
  .day summary { padding: 14px 44px 14px 12px; gap: 12px; }
  .day summary::after { right: 16px; }
  .day-body { padding: 2px 14px 18px; }
  .day-text img { float: none; width: 100%; margin: 0 0 14px; aspect-ratio: 16 / 9; }
  .day-pics { float: none; width: 100%; grid-template-columns: 1fr 1fr; margin: 0 0 14px; }
  .day-text .day-pics img { aspect-ratio: 4 / 3; }
  .day-highlights, .incl-grid, .optional-list, .camps-grid { grid-template-columns: minmax(0, 1fr); }
  .arches { height: auto; align-items: stretch; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; margin-inline: calc(var(--gutter) * -1); padding: 6px var(--gutter) 10px; }
  .arches::-webkit-scrollbar { display: none; }
  .arch, .arch:nth-child(even), .arch.is-active { flex: 0 0 74%; height: auto; aspect-ratio: 3 / 4; scroll-snap-align: center; }
  .arch img { filter: none; }
  .arch .arch-frame { border-color: rgba(226, 181, 102, .7); }
  .arch .arch-text, .arch.is-active .arch-text { grid-template-columns: auto minmax(0, 1fr); align-items: end; justify-items: start; gap: 14px; padding: 0 22px 24px; text-align: left; }
  .arch .arch-num { font-size: 2.2rem; line-height: .9; }
  .arch .arch-caption { display: block; padding-left: 14px; border-left: 1px solid rgba(226, 181, 102, .6); font-family: var(--font-display); font-size: 1rem; line-height: 1.35; animation: none; }
  .arch .arch-zoom, .arch.is-active .arch-zoom { display: none; }
  .flow-arrow { width: 42px; height: 42px; margin-top: -21px; }
  .lightbox .flow-arrow { top: auto; bottom: 22px; }
  .related-grid { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; margin-inline: calc(var(--gutter) * -1); padding: 4px var(--gutter) 14px; }
  .related-grid .tcard { flex: 0 0 78%; scroll-snap-align: start; }
}
@media (max-width: 380px) {
  .tour-facts { grid-template-columns: minmax(0, 1fr); }
}

/* ==========================================================================
   Destination page
   ========================================================================== */
.dest-hero { padding-bottom: clamp(96px, 9vw, 130px); }
.dest-hero h1 { max-width: 12em; font-size: clamp(2.3rem, 1.4rem + 3.6vw, 4rem); line-height: 1.08; }
.dest-hero h1 span { display: block; }
.dest-hero .page-hero-lead { max-width: 33em; }
.dest-hero-actions { display: flex; flex-wrap: wrap; gap: 12px; }
.btn-small { padding: 10px 20px; font-size: .84rem; flex: none; }

.dest-tabs { position: relative; z-index: 5; display: flex; justify-content: space-between; gap: 6px; margin-top: -34px; padding: 6px clamp(10px, 2vw, 28px); border-radius: 14px; background: #fff; border: 1px solid var(--sand-200); box-shadow: var(--shadow); overflow-x: auto; scrollbar-width: none; }
.dest-tabs::-webkit-scrollbar { display: none; }
.dest-tabs a { position: relative; display: inline-flex; align-items: center; gap: 9px; padding: 16px 12px; font-size: .88rem; font-weight: 600; color: var(--ink); white-space: nowrap; }
.dest-tabs a .icon { width: 19px; height: 19px; color: var(--gold); }
.dest-tabs a::after { content: ""; position: absolute; left: 12px; right: 12px; bottom: 4px; height: 2px; border-radius: 2px; background: var(--gold); transform: scaleX(0); transition: transform .25s; }
.dest-tabs a:hover { color: var(--gold-600); }
.dest-tabs a:hover::after { transform: scaleX(1); }
.dest-overview, .dest-places, .dest-experiences, .dest-tours, .dest-guide, .dest-faqs { scroll-margin-top: var(--header-h); }
.dest-overview { padding-bottom: clamp(30px, 4vw, 56px); }
.dest-places, .dest-experiences, .dest-tours, .dest-guide { padding-block: clamp(30px, 4vw, 56px); }

.dest-overview-grid { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr) minmax(190px, .5fr); gap: clamp(22px, 3vw, 44px); align-items: center; }
.dest-overview-text h2 { margin-bottom: 18px; }
.dest-overview-text p:not(.eyebrow) { margin: 0 0 1.05em; font-size: .96rem; line-height: 1.8; }
.dest-overview-text .btn { margin-top: 8px; }
.dest-collage { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 12px; align-items: start; }
.dest-collage img { width: 100%; object-fit: cover; }
.dest-collage img:first-child { grid-column: 1 / -1; justify-self: center; width: 90%; aspect-ratio: 4 / 3.5; border-radius: 16px; box-shadow: var(--shadow); }
.dest-collage img:not(:first-child) { position: relative; z-index: 1; margin-top: -30%; aspect-ratio: 4 / 3; border-radius: 12px; border: 4px solid #fff; box-shadow: 0 14px 30px rgba(16, 35, 52, .22); transition: transform .35s; }
.dest-collage img:not(:first-child):hover { transform: translateY(-6px); }
.dest-facts h3 { margin-bottom: 18px; font-family: var(--font-display); font-size: 1.2rem; }
.dest-facts ul { display: grid; gap: 18px; }
.dest-facts li { display: flex; align-items: flex-start; gap: 14px; }
.dest-fact-icon { flex: none; display: grid; place-items: center; width: 40px; height: 40px; border-radius: 50%; background: var(--sand-100); border: 1px solid var(--sand-200); color: var(--gold); }
.dest-fact-icon .icon { width: 19px; height: 19px; }
.dest-facts small { display: block; font-size: .78rem; color: var(--muted); }
.dest-facts strong { display: block; font-size: .88rem; line-height: 1.4; color: var(--ink); font-weight: 600; }

.place-grid { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: clamp(10px, 1.2vw, 18px); }
@media (min-width: 1101px) { .place-grid:has(.place-card:nth-child(5):last-child) { grid-template-columns: repeat(5, minmax(0, 1fr)); } }
.place-card, .dexp-card { display: flex; flex-direction: column; border-radius: 12px; overflow: hidden; background: #fff; border: 1px solid var(--sand-200); box-shadow: var(--shadow-sm); transition: transform .3s, box-shadow .3s; }
.place-card:hover, .dexp-card:hover { transform: translateY(-5px); box-shadow: var(--shadow); }
.place-card img { width: 100%; aspect-ratio: 1 / .94; object-fit: cover; transition: transform .6s; }
.dexp-card img { width: 100%; aspect-ratio: 4 / 2.9; object-fit: cover; transition: transform .6s; }
.place-card:hover img, .dexp-card:hover img { transform: scale(1.06); }
.place-card-text, .dexp-card-text { position: relative; z-index: 1; flex: 1; padding: 14px 14px 16px; background: #fff; }
.place-card h3, .dexp-card-text { display: block; }
.dexp-card h3, .dexp-card-text strong { display: block; font-family: var(--font-display); font-size: .98rem; font-weight: 700; line-height: 1.3; color: var(--ink); transition: color .2s; }
.dexp-card:hover .dexp-card-text strong { color: var(--gold-600); }
.place-card p, .dexp-card p, .dexp-card-text span { display: block; margin: 6px 0 0; font-size: .8rem; line-height: 1.5; color: var(--muted); }
.place-card-text::after { content: ""; display: block; width: 26px; height: 2px; margin-top: 12px; border-radius: 2px; background: var(--gold); transition: width .3s; }
.place-card:hover .place-card-text::after { width: 52px; }
.dexp-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: clamp(10px, 1.2vw, 18px); }
.dexp-cols-6 { grid-template-columns: repeat(6, minmax(0, 1fr)); }
.dexp-cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.dest-tour-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(14px, 1.8vw, 24px); }
.dest-tour-grid .tcard h3 { min-height: 0; }

.dest-guide-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(28px, 4vw, 64px); align-items: start; }
.dest-map-col > p:not(.eyebrow), .dest-when > p:not(.eyebrow) { margin: 12px 0 20px; font-size: .95rem; }
.dest-map { aspect-ratio: 1 / .78; }
.dest-map-spokes { fill: none; stroke: var(--navy-800); stroke-width: 1.6; stroke-dasharray: 3 5; stroke-linecap: round; vector-effect: non-scaling-stroke; opacity: .7; }
.dest-pin b { left: -6px; top: -6px; width: 12px; height: 12px; border-width: 2px; background: #fff; border-color: var(--navy-800); box-shadow: 0 2px 5px rgba(13, 36, 54, .4); }
.dest-pin:first-of-type b { background: #fff; border-color: var(--navy-800); }
.dest-pin:first-of-type b::after { content: none; }
.dest-pin .tour-pin-label { font-size: .68rem; }
.dest-pin.tour-pin-right .tour-pin-label { left: 11px; }
.dest-pin.tour-pin-left .tour-pin-label { right: 11px; }
.dest-pin.tour-pin-top .tour-pin-label { bottom: 9px; }
.dest-pin.tour-pin-bottom .tour-pin-label { top: 9px; }
.dest-pin-main b { left: -17px; top: -17px; width: 34px; height: 34px; border: 2px solid #fff; background: linear-gradient(135deg, #c98f3a, #a66e22); color: #fff; box-shadow: 0 6px 14px rgba(60, 40, 10, .45); }
.dest-pin-main b .icon { width: 17px; height: 17px; }
.dest-pin-main b::after { content: ""; position: absolute; inset: -8px; border-radius: 50%; border: 2px solid var(--gold); opacity: .7; animation: region-pulse 2s ease-out infinite; }
.dest-pin-main .tour-pin-label { font-size: .82rem; }
.dest-pin-main.tour-pin-right .tour-pin-label { left: 23px; top: -11px; }
.dest-pin-main.tour-pin-left .tour-pin-label { right: 23px; top: -11px; }
.dest-pin-main.tour-pin-top .tour-pin-label { bottom: 21px; }
.dest-pin-main.tour-pin-bottom .tour-pin-label { top: 21px; }
.dest-distances { display: grid; margin-top: 16px; border-radius: 14px; background: #fff; border: 1px solid var(--sand-200); box-shadow: var(--shadow-sm); }
.dest-distances li { display: grid; grid-template-columns: minmax(0, 1fr) 70px 104px; align-items: center; gap: 10px; padding: 11px 16px; font-size: .86rem; }
.dest-distances li + li { border-top: 1px solid var(--sand-100); }
.dest-distances strong { color: var(--ink); font-weight: 600; }
.dest-distances span { display: inline-flex; align-items: center; gap: 6px; color: var(--muted); white-space: nowrap; }
.dest-distances .icon { width: 15px; height: 15px; color: var(--gold); }

.season-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
.season { display: grid; gap: 2px; padding: 16px 12px; border-radius: 12px; background: #fff; border: 1px solid var(--sand-200); box-shadow: var(--shadow-sm); font-size: .78rem; line-height: 1.45; color: var(--muted); }
.season .icon { width: 30px; height: 30px; margin-bottom: 8px; padding: 6px; border-radius: 8px; stroke-width: 1.6; }
.season strong { font-size: .92rem; color: var(--ink); }
.season small { font-size: .74rem; color: var(--gold-600); font-weight: 600; margin-bottom: 4px; }
.season-hl-saffron .icon { background: #e4f4e5; color: #2f9e52; }
.season-sun .icon { background: #fff2d0; color: #e09a12; }
.season-leaf .icon { background: #fde6d8; color: #d5622a; }
.season-snow .icon { background: #e2f0fb; color: #3b8fd0; }
.dest-tips-title { margin: 30px 0 16px; font-family: var(--font-display); font-size: 1.25rem; }
.tip-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; text-align: center; font-size: .78rem; line-height: 1.5; color: var(--text); }
.tip-grid li { display: flex; flex-direction: column; align-items: center; gap: 10px; }
.tip-icon { display: grid; place-items: center; width: 54px; height: 54px; border-radius: 999px 999px 14px 14px; background: var(--sand-100); border: 1px solid var(--sand-200); color: var(--gold); }
.tip-icon .icon { width: 24px; height: 24px; stroke-width: 1.4; }

.dest-faqs .faq-list { grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; }

.dest-play { display: inline-flex; align-items: center; gap: 14px; padding: 0; border: 0; background: none; color: #fff; text-align: left; cursor: pointer; }
.dest-play-icon { position: relative; display: grid; place-items: center; width: 54px; height: 54px; border-radius: 50%; background: #fff; color: var(--gold-600); box-shadow: 0 8px 22px rgba(0, 0, 0, .35); transition: transform .25s; }
.dest-play-icon::after { content: ""; position: absolute; inset: -7px; border-radius: 50%; border: 1px solid rgba(255, 255, 255, .6); animation: region-pulse 2.2s ease-out infinite; }
.dest-play-icon svg { width: 22px; height: 22px; fill: currentColor; margin-left: 3px; }
.dest-play:hover .dest-play-icon { transform: scale(1.08); }
.dest-play strong { display: block; font-size: .92rem; font-weight: 600; }
.dest-play small { display: block; font-size: .78rem; color: rgba(255, 255, 255, .8); }
.place-card-text { padding-right: 46px; }
.place-card-text::after { content: none; }
.place-card .round-link { position: absolute; right: 12px; bottom: 14px; width: 30px; height: 30px; }
.place-card .round-link .icon { width: 14px; height: 14px; }

.city-map { position: relative; aspect-ratio: 600 / 460; margin: 6px -3% 0; }
.city-map-art { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; }
.cm-shadow { fill: rgba(182, 122, 42, .22); }
.cm-land { fill: #f8ecd9; stroke: #ecd6b6; stroke-width: 2; }
.cm-district { fill: #f3dfc6; opacity: .8; }
.cm-zone { fill: #f8cfbf; }
.cm-green { fill: #cfe4b3; stroke: #b4d394; stroke-width: 1.5; }
.cm-water { fill: #b9e0ec; }
.cm-ripple { fill: none; stroke: #fff; stroke-width: 2; stroke-linecap: round; opacity: .85; }
.cm-dunes { fill: #f5c682; opacity: .8; }
.cm-dune-line { fill: none; stroke: #dc9d4c; stroke-width: 2; stroke-linecap: round; opacity: .85; }
.cm-road { fill: none; stroke: #fff; stroke-width: 4.5; stroke-linecap: round; }
.cm-lane { fill: none; stroke: #fff; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; opacity: .9; }
.cm-wall { fill: none; stroke: #d27f55; stroke-width: 2.2; stroke-dasharray: 1 7; stroke-linecap: round; }
.cm-palm-shade, .g-shade { fill: rgba(120, 80, 30, .18); }
.cm-trunk { fill: none; stroke: #a9773f; stroke-width: 3; stroke-linecap: round; }
.cm-leaf { fill: #4f9f5d; stroke: #3a8349; stroke-width: .8; stroke-linejoin: round; }
.cm-site path, .cm-site circle, .cm-site ellipse { stroke-linejoin: round; stroke-linecap: round; }
.g-main { fill: #eeb087; stroke: #a85f3a; stroke-width: 1.3; }
.g-low { fill: #f6cfae; stroke: #a85f3a; stroke-width: 1.2; }
.g-roof { fill: #c9683f; stroke: #8f4a2a; stroke-width: 1.1; }
.g-door { fill: #7d4326; stroke: none; }
.g-line { fill: none; stroke: #8f4a2a; stroke-width: 1.3; }
.g-dune { fill: #f3c27c; stroke: #dc9d4c; stroke-width: 1.2; }
.g-water { fill: #b9e0ec; stroke: #8ec7d8; stroke-width: 1.2; }
.g-wave { fill: none; stroke: #fff; stroke-width: 1.6; }
.g-green { fill: #cfe4b3; stroke: #b4d394; stroke-width: 1.2; }
.cm-compass circle { fill: #fffaf0; stroke: var(--gold); stroke-width: 1.5; }
.cm-compass .cm-ring { fill: none; stroke: #e2c58f; stroke-width: 1; stroke-dasharray: 2 3; }
.cm-compass path { fill: var(--gold); }
.cm-compass .cm-minor { fill: #e6d2a6; }
.cm-compass .cm-north { fill: var(--terracotta); }
.cm-compass text { fill: var(--gold-600); font: 700 13px var(--font-display); text-anchor: middle; }
.city-pin { position: absolute; z-index: 2; width: 0; height: 0; padding: 0; border: 0; background: none; cursor: pointer; }
.city-pin i { position: absolute; left: -9px; top: -9px; width: 18px; height: 18px; border-radius: 50%; background: #1f6f9c; border: 3px solid #fff; box-shadow: 0 3px 8px rgba(13, 36, 54, .35); transition: transform .25s, background .25s; }
.city-pin i::after { content: ""; position: absolute; inset: 3px; border-radius: 50%; background: #fff; }
.city-pin span { position: absolute; padding: 4px 11px; border-radius: 999px; background: #fff; box-shadow: 0 3px 10px rgba(13, 36, 54, .18); font: 600 .72rem/1.4 var(--font-body); color: var(--ink); white-space: nowrap; transition: background .25s, color .25s; }
.city-pin-right span { left: 14px; top: -13px; }
.city-pin-left span { right: 14px; top: -13px; }
.city-pin-top span { left: 0; bottom: 14px; transform: translateX(-50%); }
.city-pin-bottom span { left: 0; top: 14px; transform: translateX(-50%); }
.city-pin:hover, .city-pin.is-active { z-index: 3; }
.city-pin:hover i, .city-pin.is-active i { background: var(--gold); transform: scale(1.25); }
.city-pin:hover span, .city-pin.is-active span { background: var(--navy-800); color: #fff; }
.city-map-full { position: absolute; left: 0; top: 18%; z-index: 3; }

.dest-stories { padding-block: clamp(30px, 4vw, 56px); }
.story-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(14px, 1.8vw, 24px); }
.story-card { display: flex; flex-direction: column; border-radius: 12px; overflow: hidden; background: #fff; border: 1px solid var(--sand-200); box-shadow: var(--shadow-sm); transition: transform .3s, box-shadow .3s; }
.story-card:hover { transform: translateY(-5px); box-shadow: var(--shadow); }
.story-card-media { display: block; aspect-ratio: 16 / 9.4; overflow: hidden; }
.story-card-media img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s; }
.story-card:hover .story-card-media img { transform: scale(1.06); }
.story-card-text { display: flex; flex-direction: column; flex: 1; padding: 18px 18px 16px; }
.story-card h3 { font-family: var(--font-display); font-size: 1.08rem; line-height: 1.35; }
.story-card h3 a:hover { color: var(--gold-600); }
.story-card-text p { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin: auto 0 0; padding-top: 14px; font-size: .8rem; color: var(--muted); }
.slideshow figure { position: relative; width: min(92vw, 1000px); aspect-ratio: 4 / 3; max-height: 82vh; }
.slideshow figure img { position: absolute; inset: 0; width: 100%; height: 100%; max-height: none; object-fit: cover; opacity: 0; transform: scale(1.08); transition: opacity 1s, transform 5s linear; }
.slideshow figure img.is-active { opacity: 1; transform: none; }
.slideshow figcaption { position: absolute; left: 0; right: 0; bottom: -44px; margin: 0; }

@media (max-width: 1100px) {
  .dest-overview-grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .dest-facts { grid-column: 1 / -1; }
  .dest-facts ul { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .place-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .dexp-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .season-grid, .tip-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 960px) {
  .dest-guide-grid { grid-template-columns: minmax(0, 1fr); }
  .season-grid, .tip-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
@media (max-width: 700px) {
  .dest-hero { padding-bottom: 76px; }
  .dest-tabs { justify-content: flex-start; margin-inline: calc(var(--gutter) * -1 + 10px); }
  .dest-tabs a { padding: 14px 10px; font-size: .84rem; }
  .dest-overview-grid { grid-template-columns: minmax(0, 1fr); }
  .dest-facts ul { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .place-grid, .dexp-grid, .dest-tour-grid { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; margin-inline: calc(var(--gutter) * -1); padding: 4px var(--gutter) 14px; }
  .place-grid::-webkit-scrollbar, .dexp-grid::-webkit-scrollbar, .dest-tour-grid::-webkit-scrollbar { display: none; }
  .place-card { flex: 0 0 58%; scroll-snap-align: start; }
  .story-grid { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; margin-inline: calc(var(--gutter) * -1); padding: 4px var(--gutter) 14px; }
  .story-card { flex: 0 0 80%; scroll-snap-align: start; }
  .dest-places .section-head .btn, .dest-stories .section-head .btn, .dest-faqs .section-head .btn { display: none; }
  .city-pin span { font-size: .62rem; padding: 3px 8px; }
  .city-map-full { top: auto; bottom: -6px; }
  .dexp-card { flex: 0 0 66%; scroll-snap-align: start; }
  .dest-tour-grid .tcard { flex: 0 0 80%; scroll-snap-align: start; }
  .dest-experiences .section-head .btn, .dest-tours .section-head .btn { display: none; }
  .dest-map { aspect-ratio: 1; }
  .dest-distances li { grid-template-columns: minmax(0, 1fr) 62px 96px; padding: 10px 12px; }
  .season-grid, .tip-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .dest-faqs .faq-list { grid-template-columns: minmax(0, 1fr); }
}

/* ---------- Tour category pages ("Tours from ...") ---------- */
.cat-hero h1 { font-size: clamp(2.5rem, 1.5rem + 4.2vw, 4.4rem); }
.cat-slider { position: relative; }
.cat-row-links { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; scroll-behavior: smooth; scrollbar-width: none; padding: 8px 6px 14px; margin-inline: -6px; }
.cat-row-links::-webkit-scrollbar { display: none; }
.cat-row-links li { flex: 0 0 calc((100% - 7 * clamp(8px, 1vw, 14px)) / 7.5); scroll-snap-align: start; }
.cat-slider-btn { position: absolute; z-index: 6; top: 50%; transform: translateY(-50%); background: #fff; border-color: #fff; color: var(--ink); box-shadow: var(--shadow); }
.cat-slider-btn:hover { background: var(--gold); border-color: var(--gold); color: #fff; }
.cat-slider-prev { left: max(4px, calc(var(--gutter) - 22px)); }
.cat-slider-next { right: max(4px, calc(var(--gutter) - 22px)); }
.cat-row-links .cat-tile { color: #fff; }
.cat-row-links .cat-tile-text strong { font-size: clamp(.78rem, .56rem + .5vw, .96rem); }
.cat-about { background: var(--sand-100); padding-block: clamp(44px, 5vw, 76px); }
.cat-about-grid { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: clamp(28px, 4vw, 64px); align-items: center; }
.cat-about h2 { margin-bottom: 18px; }
.cat-about p:not(.eyebrow) { margin: 0 0 1.05em; line-height: 1.8; }
.cat-about-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 22px; }
.cat-about-facts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.cat-about-facts li { display: grid; gap: 4px; padding: 20px 18px; border-radius: 14px; background: #fff; border: 1px solid var(--sand-200); box-shadow: var(--shadow-sm); font-size: .84rem; line-height: 1.45; color: var(--muted); }
.cat-about-facts .icon { width: 26px; height: 26px; margin-bottom: 6px; color: var(--gold); stroke-width: 1.4; }
.cat-about-facts strong { font-family: var(--font-display); font-size: 1.35rem; color: var(--ink); }
@media (max-width: 1280px) { .cat-row-links li { flex-basis: calc((100% - 4 * clamp(8px, 1vw, 14px)) / 4.5); } }
@media (max-width: 960px) { .cat-about-grid { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 700px) { .cat-row-links li { flex-basis: 38vw; } .cat-slider-btn { display: none; } }

/* ==========================================================================
   Morocco Activities page
   ========================================================================== */
.act-hero { padding-block: clamp(46px, 5vw, 70px) clamp(84px, 8vw, 110px); }
.act-hero h1 { max-width: 11em; font-size: clamp(2.3rem, 1.4rem + 3.6vw, 4rem); line-height: 1.08; }
.act-hero h1 span { display: block; }
.act-hero .page-hero-eyebrow { margin-top: 0; }
.act-search { display: flex; align-items: center; gap: 10px; max-width: 520px; margin-bottom: 26px; padding: 6px 6px 6px 18px; border-radius: 999px; background: #fff; box-shadow: 0 14px 34px rgba(0, 0, 0, .3); color: var(--muted); }
.act-search .icon { width: 18px; height: 18px; }
.act-search input { flex: 1; min-width: 0; height: 40px; border: 0; background: none; font: inherit; font-size: .9rem; color: var(--ink); outline: none; }
.act-search button { flex: none; display: grid; place-items: center; width: 42px; height: 42px; border: 0; border-radius: 50%; background: linear-gradient(135deg, #c08631, #a66e22); color: #fff; cursor: pointer; }
.act-hero-points { gap: 12px clamp(14px, 2.2vw, 30px); }
.act-hero-points li { flex-direction: row; text-align: left; gap: 10px; }
.act-hero-script { position: absolute; left: min(48%, 560px); top: 22%; margin: 0; font-family: var(--font-script); font-size: clamp(1.2rem, .9rem + 1vw, 1.7rem); line-height: 1.2; color: #fff; transform: rotate(-7deg); opacity: .9; }
.act-hero .page-hero-content { position: relative; }

.act-cats { position: relative; z-index: 5; display: grid; grid-template-columns: repeat(10, minmax(0, 1fr)); gap: 4px; margin-top: -44px; padding: 10px; border-radius: 16px; background: #fff; border: 1px solid var(--sand-200); box-shadow: var(--shadow); }
.act-cat { display: flex; flex-direction: column; align-items: center; gap: 8px; padding: 14px 4px 12px; border: 1px solid transparent; border-radius: 12px; background: none; font: 600 .74rem/1.25 var(--font-body); color: var(--ink); cursor: pointer; transition: background .25s, border-color .25s, color .25s, transform .25s; }
.act-cat .icon { width: 30px; height: 30px; color: var(--gold); stroke-width: 1.4; }
.act-cat:hover { background: var(--sand-100); transform: translateY(-2px); }
.act-cat.is-active { background: var(--sand-100); border-color: #e2cfa6; color: var(--gold-600); box-shadow: inset 0 -3px 0 var(--gold); }

.act-list { padding-top: clamp(36px, 4vw, 56px); scroll-margin-top: var(--header-h); }
.act-intro { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(24px, 4vw, 60px); align-items: center; margin-bottom: 26px; }
.act-intro p:not(.eyebrow) { max-width: 30em; margin: 14px 0 0; }
.act-video { position: relative; display: block; width: 100%; aspect-ratio: 16 / 5.8; padding: 0; border: 0; border-radius: 14px; overflow: hidden; background: var(--navy-900); color: #fff; text-align: left; cursor: pointer; box-shadow: var(--shadow); }
.act-video img { width: 100%; height: 100%; object-fit: cover; transition: transform .7s; }
.act-video::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(20, 10, 4, .7), rgba(20, 10, 4, .1) 60%); }
.act-video:hover img { transform: scale(1.05); }
.act-video-play { position: absolute; left: 50%; top: 50%; z-index: 1; display: grid; place-items: center; width: 54px; height: 54px; margin: -27px 0 0 -27px; border-radius: 50%; background: rgba(255, 255, 255, .92); color: var(--gold-600); }
.act-video-play svg { width: 22px; height: 22px; fill: currentColor; margin-left: 3px; }
.act-video-text { position: absolute; left: 22px; bottom: 18px; z-index: 1; }
.act-video-text strong { display: block; font-size: .95rem; }
.act-video-text small { font-size: .78rem; opacity: .85; }
.act-count { margin: 0 0 14px; font-size: .86rem; color: var(--muted); }
.act-count b { color: var(--ink); }
.act-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: clamp(12px, 1.5vw, 20px); }
.act-card { display: flex; flex-direction: column; border-radius: 12px; overflow: hidden; background: #fff; border: 1px solid var(--sand-200); box-shadow: var(--shadow-sm); transition: transform .3s, box-shadow .3s; }
.act-card[hidden] { display: none; }
.act-card:hover { transform: translateY(-5px); box-shadow: var(--shadow); }
.act-card-media { position: relative; aspect-ratio: 4 / 2.8; overflow: hidden; }
.act-card-media img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s; }
.act-card:hover .act-card-media img { transform: scale(1.06); }
.act-card-media::after { content: ""; position: absolute; inset: 50% 0 0; background: linear-gradient(0deg, rgba(10, 20, 30, .78), transparent); }
.act-card-tag { position: absolute; left: 12px; bottom: 10px; z-index: 1; display: inline-flex; align-items: center; gap: 9px; color: #fff; font-size: .78rem; font-weight: 500; }
.act-card-tag span { display: grid; place-items: center; width: 32px; height: 32px; border-radius: 50%; background: rgba(255, 255, 255, .92); color: var(--gold-600); }
.act-card-tag .icon { width: 18px; height: 18px; stroke-width: 1.5; }
.act-card-text { display: flex; flex-direction: column; flex: 1; padding: 16px 16px 14px; }
.act-card h3 { font-family: var(--font-display); font-size: 1.04rem; line-height: 1.3; }
.act-card-place { display: flex; align-items: center; gap: 6px; margin: 6px 0 8px; font-size: .76rem; font-weight: 600; letter-spacing: .04em; text-transform: uppercase; color: var(--gold-600); }
.act-card-place .icon { width: 13px; height: 13px; }
.act-card-text > p:not(.act-card-place) { margin: 0 0 12px; font-size: .84rem; line-height: 1.55; color: var(--muted); }
.act-card .text-link { margin-top: auto; font-size: .84rem; color: var(--terracotta); }
.act-card .text-link { justify-content: space-between; width: 100%; padding-top: 10px; border-top: 1px solid var(--sand-200); }
.act-card .text-link small { font-weight: 400; font-size: .76rem; color: var(--muted); }

.act-culture { position: relative; isolation: isolate; color: #fff; background: #1c100a; overflow: hidden; }
.act-culture-media { position: absolute; left: 0; top: 0; z-index: -1; width: 56%; height: 100%; object-fit: cover; -webkit-mask-image: linear-gradient(90deg, #000 68%, transparent); mask-image: linear-gradient(90deg, #000 68%, transparent); }
.act-culture-text { margin-left: 60%; padding-block: clamp(50px, 6vw, 84px); }
.act-culture h2 { color: #fff; }
.act-culture-text > p:not(.eyebrow) { margin: 16px 0 26px; color: rgba(255, 255, 255, .86); }
.act-culture-points { display: flex; flex-wrap: wrap; gap: 12px 26px; margin-top: 34px; font-size: .82rem; color: rgba(255, 255, 255, .88); }
.act-culture-points li { display: inline-flex; align-items: center; gap: 8px; }
.act-culture-points .icon { width: 20px; height: 20px; color: var(--gold-300); stroke-width: 1.4; }

.act-why-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr); gap: clamp(28px, 4vw, 60px); align-items: center; }
.act-checks { display: grid; gap: 14px; margin: 24px 0 30px; font-weight: 500; color: var(--ink); }
.act-checks li { display: flex; align-items: center; gap: 14px; }
.act-checks .icon { flex: none; width: 24px; height: 24px; padding: 5px; border-radius: 50%; background: var(--gold); color: #fff; stroke-width: 2.6; }
.act-why { overflow: hidden; }
.act-map { position: relative; aspect-ratio: 330 / 300; margin-right: 7%; }
.act-map-inner { position: absolute; left: -65.15%; top: -6.67%; width: 181.8%; aspect-ratio: 600 / 650; filter: drop-shadow(0 10px 22px rgba(196, 140, 90, .35)); -webkit-mask-image: radial-gradient(46% 40% at 55% 27%, #000 70%, transparent 100%); mask-image: radial-gradient(46% 40% at 55% 27%, #000 70%, transparent 100%); }
.act-map .map-routes, .act-map .map-palms, .act-map .map-compass, .act-map .map-labels, .act-map .map-towns, .act-map .map-waves, .act-map .map-edge, .act-map-inner rect { display: none; }
.act-map .map-mountains path, .act-map .map-dunes path { stroke: #d9a57e; opacity: .7; }
.act-map-inner g[filter="url(#map-shadow)"] { filter: none; }
.act-map .map-land { fill: #f4d6ba; stroke: #e6b995; stroke-width: 1.4; }
.act-map-route { position: absolute; inset: 0; z-index: 1; width: 100%; height: 100%; overflow: visible; }
.act-map-line { fill: none; stroke: #c9825a; stroke-width: 2; stroke-dasharray: 1 6; stroke-linecap: round; vector-effect: non-scaling-stroke; animation: tour-route 1.4s linear infinite; }
.act-map-dot { fill: #fff; stroke: var(--terracotta); stroke-width: 2; vector-effect: non-scaling-stroke; }
.act-pin { position: absolute; z-index: 2; width: 0; height: 0; padding: 0; border: 0; background: none; cursor: pointer; text-align: left; }
.act-pin::before { content: ""; position: absolute; left: -9px; top: -3px; width: 18px; height: 6px; border-radius: 50%; background: rgba(120, 60, 20, .25); filter: blur(1.5px); }
.act-pin i { position: absolute; left: -12px; top: -30px; width: 24px; height: 24px; border-radius: 50% 50% 50% 0; background: linear-gradient(135deg, #e0623a, #b8431f); transform: rotate(-45deg); box-shadow: 0 4px 10px rgba(120, 50, 20, .4); transition: transform .3s; }
.act-pin i::after { content: ""; position: absolute; inset: 7px; border-radius: 50%; background: #fff; }
.act-pin:hover i, .act-pin.is-active i { transform: rotate(-45deg) translate(3px, -3px) scale(1.12); }
.act-pin-card { position: absolute; width: max-content; display: flex; align-items: center; gap: 14px; padding: 6px 18px 6px 6px; border-radius: 12px; background: #fff; border: 1px solid #f1e3cf; box-shadow: 0 14px 34px rgba(120, 84, 30, .2); white-space: nowrap; transition: transform .3s, box-shadow .3s; }
.act-pin-left .act-pin-card { right: 22px; top: -62px; }
.act-pin-right .act-pin-card { left: 22px; top: -44px; }
.act-pin-leftup .act-pin-card { right: 22px; top: -104px; }
.act-pin-belowr .act-pin-card { left: -46px; top: 16px; }
.act-pin-belowr:hover .act-pin-card, .act-pin-belowr.is-active .act-pin-card { transform: translateY(-5px); box-shadow: 0 0 0 2px var(--gold), 0 20px 40px rgba(120, 84, 30, .28); }
.act-pin-leftup:hover .act-pin-card, .act-pin-leftup.is-active .act-pin-card { transform: translateY(-5px); box-shadow: 0 0 0 2px var(--gold), 0 20px 40px rgba(120, 84, 30, .28); }
.act-pin-below .act-pin-card { left: 0; top: 14px; transform: translateX(-50%); }
.act-pin-card img { width: clamp(84px, 8.4vw, 124px); aspect-ratio: 4 / 2.9; height: auto; object-fit: cover; border-radius: 8px; }
.act-pin-card strong { display: block; font: 700 1.02rem/1.25 var(--font-body); color: var(--ink); }
.act-pin-card small { display: block; font-size: .78rem; color: var(--muted); }
.act-pin-card em { display: block; margin-top: 5px; font-style: normal; font-size: .64rem; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--gold-600); }
.act-pin:hover, .act-pin:focus-visible, .act-pin.is-active { z-index: 3; }
.act-pin-left:hover .act-pin-card, .act-pin-right:hover .act-pin-card, .act-pin-left.is-active .act-pin-card, .act-pin-right.is-active .act-pin-card { transform: translateY(-5px); box-shadow: 0 0 0 2px var(--gold), 0 20px 40px rgba(120, 84, 30, .28); }
.act-pin-below:hover .act-pin-card, .act-pin-below.is-active .act-pin-card { transform: translate(-50%, -5px); box-shadow: 0 0 0 2px var(--gold), 0 20px 40px rgba(120, 84, 30, .28); }
.act-map-script { position: absolute; right: -4%; top: 4%; margin: 0; font-family: var(--font-script); font-size: clamp(1rem, .8rem + .7vw, 1.4rem); line-height: 1.15; color: var(--terracotta); transform: rotate(-9deg); text-align: center; opacity: .85; }

.act-custom { position: relative; isolation: isolate; color: #fff; padding-block: clamp(44px, 5vw, 70px); background: #24120a; overflow: hidden; }
.act-custom-media { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; object-fit: cover; }
.act-custom::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, rgba(30, 14, 6, .9), rgba(30, 14, 6, .45) 55%, rgba(30, 14, 6, .6)); }
.act-custom-grid, .act-cta-grid { display: flex; align-items: flex-end; justify-content: space-between; gap: 30px; flex-wrap: wrap; }
.act-custom h2 { color: #fff; }
.act-custom p:not(.eyebrow) { max-width: 26em; margin: 12px 0 22px; color: rgba(255, 255, 255, .9); }
.act-faqs .faq-list { grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; }
.act-cta-grid .hero-points { margin: 0; }

@media (max-width: 1100px) {
  .act-cats { grid-template-columns: repeat(5, minmax(0, 1fr)); }
  .act-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .act-hero-script { display: none; }
}
@media (max-width: 960px) {
  .act-why-grid, .act-intro { grid-template-columns: minmax(0, 1fr); }
  .act-culture-media { width: 100%; opacity: .35; -webkit-mask-image: none; mask-image: none; }
  .act-culture-text { margin-left: 0; }
}
@media (max-width: 700px) {
  .act-cats { display: flex; overflow-x: auto; scrollbar-width: none; margin-inline: calc(var(--gutter) * -1 + 8px); }
  .act-cats::-webkit-scrollbar { display: none; }
  .act-cat { flex: 0 0 96px; }
  .act-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .act-card-text { padding: 12px 12px 12px; }
  .act-card h3 { font-size: .94rem; }
  .act-card-tag { font-size: 0; gap: 0; }
  .act-hero-points { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .act-video { aspect-ratio: 16 / 8; }
  .act-map { margin-right: 0; }
  .act-pin-card { padding: 4px 10px 4px 4px; gap: 8px; }
  .act-pin-card img { width: 40px; }
  .act-pin-card strong { font-size: .76rem; }
  .act-pin-card small { display: none; }
  .act-pin-card em { display: none; }
  .act-pin-left .act-pin-card { top: -44px; }
  .act-pin-leftup .act-pin-card { top: -74px; }
  .act-pin-belowr .act-pin-card { left: -20px; top: 10px; }
  .act-pin-right .act-pin-card { left: auto; right: 22px; top: -30px; }
  .act-map-script { display: none; }
  .act-faqs .faq-list { grid-template-columns: minmax(0, 1fr); }
  .act-faqs .section-head .btn { display: none; }
}
@media (max-width: 380px) { .act-grid { grid-template-columns: minmax(0, 1fr); } }

/* ==========================================================================
   Merzouga Activities page
   ========================================================================== */
.mz-hero h1 { max-width: 10em; }
.mz-hero h1 span { display: inline; }
.mz-hero-points { gap: 0; }
.mz-hero-points li { padding-inline: clamp(12px, 1.8vw, 26px); border-left: 1px solid rgba(255, 255, 255, .22); }
.mz-hero-points li:first-child { padding-left: 0; border-left: 0; }
.mz-cats { grid-template-columns: repeat(7, minmax(0, 1fr)); padding: 14px; }
.mz-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.mz-grid .act-card-media { aspect-ratio: 4 / 2.5; }
.mz-grid .act-card h3 { font-size: 1.18rem; }
.mz-includes { display: grid; gap: 6px; margin: 0 0 14px; padding: 12px 14px; border-radius: 10px; background: var(--sand-100); border: 1px solid var(--sand-200); font-size: .82rem; font-weight: 500; color: var(--ink); }
.mz-includes li { display: flex; align-items: center; gap: 9px; }
.mz-includes .icon { flex: none; width: 17px; height: 17px; padding: 3px; border-radius: 50%; background: var(--gold); color: #fff; stroke-width: 3; }
.act-cats-solid .act-cat.is-active { background: linear-gradient(135deg, #c98f3a, #a66e22); border-color: transparent; color: #fff; box-shadow: 0 10px 22px rgba(166, 110, 34, .32); }
.act-cats-solid .act-cat.is-active .icon { color: #fff; }
.mz-head { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto; gap: clamp(18px, 3vw, 44px); align-items: end; margin-bottom: 22px; }
.mz-head > p { margin: 0; font-size: .86rem; line-height: 1.6; color: var(--muted); }
.mz-badge { position: absolute; right: 12px; top: 12px; z-index: 1; padding: 5px 13px; border-radius: 999px; background: rgba(166, 110, 34, .92); color: #fff; font-size: .72rem; font-weight: 600; backdrop-filter: blur(3px); }
.mz-card .act-card-media::after { content: none; }
.mz-meta { display: flex; flex-wrap: wrap; gap: 6px 16px; margin: 8px 0 10px; font-size: .78rem; color: var(--muted); }
.mz-meta li { display: inline-flex; align-items: center; gap: 6px; }
.mz-meta .icon { width: 15px; height: 15px; color: var(--gold); }
.mz-foot { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: auto; padding-top: 6px; }
.mz-price { margin: 0; font-size: .92rem; font-weight: 700; color: var(--terracotta); }
.mz-price span { font-weight: 400; font-size: .8rem; }
.mz-foot .round-link { flex: none; width: 34px; height: 34px; }
.mz-foot .round-link .icon { width: 15px; height: 15px; }

.mz-special { position: relative; isolation: isolate; display: grid; grid-template-columns: minmax(0, 1fr) clamp(220px, 23%, 290px); border-radius: 18px; overflow: hidden; color: #fff; background: #1c100a; box-shadow: var(--shadow); }
.mz-special-media { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; object-fit: cover; }
.mz-special::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, rgba(28, 14, 6, .9), rgba(28, 14, 6, .35) 50%, rgba(28, 14, 6, 0) 70%); }
.mz-special-text { padding: clamp(30px, 4vw, 56px) clamp(22px, 3.4vw, 50px); max-width: 30em; }
.mz-special h2 { color: #fff; }
.mz-special-text > p:not(.eyebrow) { margin: 14px 0 24px; color: rgba(255, 255, 255, .9); }
.mz-special-points { display: grid; align-content: center; gap: 22px; padding: 28px 24px; background: rgba(18, 12, 10, .86); backdrop-filter: blur(6px); font-size: .8rem; color: rgba(255, 255, 255, .75); }
.mz-special-points li { display: flex; align-items: center; gap: 14px; }
.mz-special-points .icon { flex: none; width: 30px; height: 30px; color: var(--gold-300); stroke-width: 1.3; }
.mz-special-points strong { display: block; font-size: .9rem; color: #fff; }

.mz-culture-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr); gap: clamp(28px, 4vw, 64px); align-items: center; }
.mz-culture-grid p:not(.eyebrow) { max-width: 32em; margin: 16px 0 24px; }
.mz-collage { position: relative; aspect-ratio: 1 / .56; }
.mz-collage img { position: absolute; object-fit: cover; border: 5px solid #fff; border-radius: 6px; box-shadow: 0 16px 36px rgba(60, 40, 10, .28); transition: transform .4s; }
.mz-collage img:nth-child(1) { left: 2%; top: 4%; width: 42%; height: 88%; transform: rotate(-5deg); z-index: 2; }
.mz-collage img:nth-child(2) { left: 38%; top: 0; width: 32%; height: 44%; transform: rotate(4deg); z-index: 3; }
.mz-collage img:nth-child(3) { left: 66%; top: 2%; width: 30%; height: 54%; border-radius: 6px; }
.mz-collage img:nth-child(4) { left: 46%; top: 46%; width: 30%; height: 44%; transform: rotate(-3deg); z-index: 3; }
.mz-collage img:hover { transform: rotate(0) scale(1.04); z-index: 5; }
.mz-collage-script { position: absolute; right: 0; bottom: 4%; margin: 0; font-family: var(--font-script); font-size: clamp(1rem, .8rem + .7vw, 1.4rem); line-height: 1.15; color: var(--terracotta); transform: rotate(-9deg); text-align: center; }
.mz-why-eyebrow { margin-top: clamp(36px, 4vw, 56px); }
.mz-why { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); margin-top: 16px; text-align: center; font-size: .8rem; color: var(--muted); }
.mz-why li { display: grid; justify-items: center; gap: 4px; padding: 20px 14px; border-left: 1px solid var(--sand-200); }
.mz-why li:first-child { border-left: 0; }
.mz-why .icon { width: 34px; height: 34px; margin-bottom: 8px; color: var(--terracotta); stroke-width: 1.3; }
.mz-why strong { font-size: .9rem; line-height: 1.3; color: var(--ink); }
.mz-why li.is-featured { border-radius: 14px; border-left-color: transparent; background: #fff; box-shadow: var(--shadow); }
.mz-why li.is-featured + li { border-left-color: transparent; }

.mz-faq { position: relative; isolation: isolate; padding-top: 0; padding-bottom: clamp(150px, 16vw, 230px); overflow: hidden; }
.mz-faq-dunes { position: absolute; left: 0; right: 0; bottom: 0; z-index: -1; width: 100%; height: 62%; object-fit: cover; object-position: 50% 100%; filter: sepia(.55) saturate(2.1) hue-rotate(-14deg) brightness(.96); -webkit-mask-image: linear-gradient(180deg, transparent 0%, rgba(0, 0, 0, .35) 30%, #000 62%); mask-image: linear-gradient(180deg, transparent 0%, rgba(0, 0, 0, .35) 30%, #000 62%); }
.mz-faq-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, .82fr); gap: clamp(26px, 4vw, 60px); align-items: start; }
.mz-faq h2 { margin-bottom: 18px; }
.mz-custom { position: relative; isolation: isolate; display: flex; border-radius: 16px 16px 0 0; border: 1px solid #ecd9bb; border-bottom: 0; background: linear-gradient(180deg, #fdf3e2 0%, rgba(253, 243, 226, .92) 42%, rgba(253, 243, 226, 0) 100%); min-height: 300px; margin-bottom: clamp(-150px, -12vw, -90px); padding-bottom: clamp(150px, 15vw, 210px); }
.mz-custom img { position: absolute; left: -1px; right: -1px; bottom: 0; z-index: -1; width: calc(100% + 2px); height: 60%; object-fit: cover; object-position: 50% 46%; -webkit-mask-image: linear-gradient(180deg, transparent, #000 30%, #000 72%, transparent 98%); mask-image: linear-gradient(180deg, transparent, #000 30%, #000 72%, transparent 98%); }
.act-cta-grid > div { flex: 0 1 34em; }
.act-cta-grid h2, .act-cta-grid p { max-width: none; }
.mz-cta { z-index: 2; margin-top: clamp(-140px, -10vw, -96px); padding-top: clamp(120px, 12vw, 170px); background: #2a1408; clip-path: ellipse(135% 100% at 30% 100%); }
.mz-cta .cta-media { object-position: 62% 40%; }
.mz-cta::after { background: linear-gradient(90deg, rgba(40, 18, 6, .8), rgba(40, 18, 6, .28) 46%, rgba(40, 18, 6, .1)), linear-gradient(0deg, rgba(30, 14, 5, .55), transparent 45%); }
.mz-cta-camp { position: absolute; right: 0; bottom: 0; z-index: -2; width: min(46%, 640px); height: 78%; object-fit: cover; -webkit-mask-image: radial-gradient(60% 62% at 62% 62%, #000 30%, transparent 78%); mask-image: radial-gradient(60% 62% at 62% 62%, #000 30%, transparent 78%); opacity: .95; }
.mz-cta .cta-media { z-index: -3; }
.mz-custom-text { padding: clamp(22px, 2.6vw, 34px); }
.mz-custom h2 { font-size: clamp(1.3rem, 1.1rem + .8vw, 1.7rem); }
.mz-custom p { margin: 12px 0 18px; font-size: .9rem; max-width: 30em; }
.mz-custom-actions { display: flex; flex-wrap: wrap; gap: 10px; }
.mz-custom .btn-outline { background: rgba(255, 255, 255, .8); }

@media (max-width: 1100px) {
  .mz-cats { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .mz-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .mz-head { grid-template-columns: minmax(0, 1fr); align-items: start; }
  .mz-why { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px 0; }
}
@media (max-width: 960px) {
  .mz-culture-grid, .mz-faq-grid { grid-template-columns: minmax(0, 1fr); }
  .mz-custom { margin-bottom: -60px; }
  .mz-cta-camp { display: none; }
  .mz-special { grid-template-columns: minmax(0, 1fr); }
  .mz-special-points { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 700px) {
  .mz-hero-points { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px 0; }
  .mz-hero-points li { border-left: 0; padding-inline: 4px; }
  .mz-cats { display: flex; }
  .mz-grid { grid-template-columns: minmax(0, 1fr); }
  .mz-why { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .mz-why li { border-left: 0; }
  .mz-special-points { grid-template-columns: minmax(0, 1fr); }
  .mz-meta { gap: 4px 10px; font-size: .72rem; }
  .mz-collage { aspect-ratio: 1 / .7; }
}

/* ==========================================================================
   Marrakech Activities page
   ========================================================================== */
.mk-hero { padding-bottom: clamp(96px, 9vw, 130px); }
.mk-hero h1 span { display: inline; }
.mk-hero h1 { max-width: 10em; }
.mk-hero .act-hero-script, .mz-hero .act-hero-script, .ct-hero .act-hero-script { left: auto; right: 2%; top: 2%; }
.mk-hero .dest-play { margin-bottom: 30px; }
.mk-hero-points li { flex-direction: row; text-align: left; gap: 12px; }
.mk-tiles { position: relative; z-index: 5; display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); gap: clamp(8px, 1vw, 14px); margin-top: -50px; padding: 14px; border-radius: 18px; background: #fff; border: 1px solid var(--sand-200); box-shadow: var(--shadow); }
.mk-tile { display: flex; flex-direction: column; gap: 8px; padding: 0 0 8px; border: 0; border-radius: 12px; background: none; font: 600 .78rem/1.25 var(--font-body); color: var(--ink); cursor: pointer; overflow: hidden; transition: transform .25s, box-shadow .25s; }
.mk-tile img { width: 100%; height: clamp(84px, 9vw, 124px); object-fit: cover; border-radius: 12px; transition: transform .5s; }
.mk-tile:hover { transform: translateY(-3px); }
.mk-tile:hover img { transform: scale(1.06); }
.mk-tile.is-active:not(.mk-tile-all) { color: var(--gold-600); }
.mk-tile.is-active:not(.mk-tile-all) img { box-shadow: 0 0 0 3px var(--gold); }
.mk-tile-all { align-items: center; justify-content: center; padding: 10px; background: var(--sand-100); border: 1px solid var(--sand-200); }
.mk-tile-all .icon { width: 34px; height: 34px; color: var(--gold); stroke-width: 1.4; }
.mk-tile-all.is-active { background: linear-gradient(135deg, #c98f3a, #a66e22); border-color: transparent; color: #fff; box-shadow: 0 10px 22px rgba(166, 110, 34, .32); }
.mk-tile-all.is-active .icon { color: #fff; }
.mk-intro { position: relative; isolation: isolate; display: grid; grid-template-columns: minmax(0, 1.45fr) minmax(0, .95fr) minmax(0, .74fr); align-items: stretch; margin-bottom: 30px; border-radius: 22px; overflow: hidden; background: linear-gradient(100deg, #fffdf8 0%, #fdf5e6 52%, #f8e9cf 100%); box-shadow: 0 0 0 1px #ead7b3, 0 24px 54px rgba(120, 84, 30, .16); }
.mk-intro::before { content: ""; position: absolute; inset: 0; z-index: -1; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='84' height='84' viewBox='0 0 84 84'%3E%3Cpath d='M42 8l10 24 24 10-24 10-10 24-10-24L8 42l24-10z' fill='none' stroke='%23c9a465' stroke-opacity='.13'/%3E%3Ccircle cx='42' cy='42' r='6' fill='none' stroke='%23c9a465' stroke-opacity='.12'/%3E%3C/svg%3E") 0 0 / 84px 84px; -webkit-mask-image: radial-gradient(70% 120% at 0% 100%, #000, transparent 70%); mask-image: radial-gradient(70% 120% at 0% 100%, #000, transparent 70%); }
.mk-intro::after { content: ""; position: absolute; inset: 9px; z-index: 2; border-radius: 15px; border: 1px solid rgba(182, 122, 42, .38); pointer-events: none; }
.mk-intro-corner { position: absolute; left: 9px; z-index: 3; width: 34px; height: 34px; pointer-events: none; background: radial-gradient(circle at 0 0, transparent 13px, rgba(182, 122, 42, .7) 13.5px, rgba(182, 122, 42, .7) 14.5px, transparent 15px), radial-gradient(circle at 0 0, var(--gold) 4px, transparent 4.5px); }
.mk-intro-corner-tl { top: 9px; }
.mk-intro-corner-bl { bottom: 9px; transform: scaleY(-1); }
.mk-intro-text { padding: clamp(30px, 3.6vw, 54px) clamp(26px, 3.4vw, 54px); align-self: center; }
.mk-intro-text h2 { font-size: clamp(1.8rem, 1.2rem + 1.9vw, 2.7rem); line-height: 1.14; }
.mk-intro-text h2 span { color: var(--gold); font-style: italic; white-space: nowrap; }
.mk-intro-rule { display: flex; align-items: center; gap: 10px; width: 130px; margin: 18px 0 16px; }
.mk-intro-rule::before, .mk-intro-rule::after { content: ""; flex: 1; height: 1px; background: linear-gradient(90deg, transparent, var(--gold)); }
.mk-intro-rule::after { transform: scaleX(-1); }
.mk-intro-rule i { width: 9px; height: 9px; background: var(--gold); transform: rotate(45deg); box-shadow: 0 0 0 3px rgba(182, 122, 42, .18); }
.mk-intro-text p:not(.eyebrow) { margin: 0; max-width: 40em; font-size: .96rem; line-height: 1.8; }
.mk-arch { position: relative; min-height: 290px; box-shadow: inset 14px 0 22px -14px rgba(90, 60, 20, .45), inset -14px 0 22px -14px rgba(90, 60, 20, .45); }
.mk-arch-art { position: absolute; inset: 0; width: 100%; height: 100%; }
.mk-arch::after { content: ""; position: absolute; inset: 0; pointer-events: none; box-shadow: inset 14px 0 22px -14px rgba(90, 60, 20, .4), inset -14px 0 22px -14px rgba(90, 60, 20, .4); }
.mk-why { position: relative; align-self: center; padding: clamp(22px, 2.4vw, 34px) clamp(22px, 2.6vw, 38px) clamp(22px, 2.4vw, 34px) clamp(18px, 2vw, 30px); }
.mk-why h3 { display: flex; align-items: center; gap: 14px; margin-bottom: 18px; font-family: var(--font-display); font-size: 1.16rem; line-height: 1.22; color: var(--ink); }
.mk-crown-wrap { flex: none; display: grid; place-items: center; width: 52px; height: 52px; border-radius: 50%; background: #fff; box-shadow: 0 0 0 1px #e6cf9f, 0 0 0 5px rgba(226, 181, 102, .18), 0 8px 18px rgba(120, 84, 30, .16); }
.mk-crown { width: 28px; height: 25px; fill: none; stroke: var(--gold); stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.mk-why ul { display: grid; font-size: .9rem; font-weight: 500; color: var(--ink); }
.mk-why li { display: flex; align-items: center; gap: 12px; padding: 10px 0; }
.mk-why li + li { border-top: 1px dashed rgba(182, 122, 42, .35); }
.mk-why li .icon { flex: none; width: 22px; height: 22px; padding: 4.5px; border-radius: 50%; background: linear-gradient(135deg, #c98f3a, #a66e22); color: #fff; stroke-width: 3.2; box-shadow: 0 3px 8px rgba(166, 110, 34, .3); }
.mk-tabs { display: flex; flex-wrap: wrap; gap: 6px clamp(6px, 1.4vw, 22px); margin-bottom: 18px; padding-bottom: 14px; border-bottom: 1px solid var(--sand-200); }
.mk-tabs button { padding: 9px 18px; border: 0; border-radius: 8px; background: none; font: 600 .86rem var(--font-body); color: var(--ink); cursor: pointer; transition: background .2s, color .2s; }
.mk-tabs button:hover { background: var(--sand-100); color: var(--gold-600); }
.mk-tabs button.is-active { background: linear-gradient(135deg, #c98f3a, #a66e22); color: #fff; }
.mk-badge { right: auto; left: 12px; }
.mk-list .act-card h3 { font-size: 1rem; }

.mk-more { display: grid; grid-template-columns: minmax(0, 1fr) clamp(240px, 26%, 330px); background: var(--sand-50); }
.mk-more-dark { position: relative; isolation: isolate; color: #fff; background: #0f2a26; overflow: hidden; }
.mk-more-dark img { position: absolute; right: 0; top: 0; z-index: -1; width: 58%; height: 100%; object-fit: cover; -webkit-mask-image: linear-gradient(270deg, #000 60%, transparent); mask-image: linear-gradient(270deg, #000 60%, transparent); }
.mk-more-text { max-width: 30em; padding: clamp(46px, 6vw, 84px) clamp(20px, 5vw, 80px); margin-left: max(0px, calc((100vw - var(--container)) / 2 - var(--gutter))); }
.mk-more h2 { color: #fff; }
.mk-more-text > p:not(.eyebrow) { margin: 16px 0 26px; color: rgba(255, 255, 255, .88); }
.mk-stats { display: grid; align-content: center; gap: 26px; padding: 30px clamp(18px, 2.4vw, 38px); font-size: .82rem; color: var(--muted); }
.mk-stats li { display: flex; align-items: center; gap: 16px; }
.mk-stats .icon { flex: none; width: 46px; height: 46px; padding: 10px; border-radius: 50%; background: #fff; border: 1px solid var(--sand-200); color: var(--gold); stroke-width: 1.4; box-shadow: var(--shadow-sm); }
.mk-stats strong { display: block; font-family: var(--font-display); font-size: 1.45rem; line-height: 1.15; color: var(--ink); }

.mk-day-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, .9fr) minmax(0, .8fr); gap: clamp(22px, 3vw, 48px); align-items: center; }
.mk-day-grid p:not(.eyebrow) { margin: 14px 0 22px; font-size: .95rem; }
.mk-day-photos { position: relative; display: grid; grid-template-columns: 1.5fr 1fr; grid-template-rows: 1.3fr 1fr; gap: 6px; aspect-ratio: 1 / .78; padding: 0; border: 0; border-radius: 190px 190px 14px 14px / 150px 150px 14px 14px; overflow: hidden; background: #fff; cursor: pointer; box-shadow: var(--shadow); }
.mk-day-photos img { width: 100%; height: 100%; object-fit: cover; }
.mk-day-photos img:nth-child(1) { grid-row: 1; grid-column: 1; }
.mk-day-photos img:nth-child(2) { grid-row: 1 / 3; grid-column: 2; }
.mk-day-photos img:nth-child(3) { grid-row: 2; grid-column: 1; width: 50%; }
.mk-day-photos img:nth-child(4) { position: absolute; left: 30.2%; bottom: 0; width: 29.6%; height: 43%; }
.mk-steps { display: grid; gap: 20px; margin: 0; padding: 0 0 0 clamp(0px, 2vw, 28px); list-style: none; border-left: 1px solid var(--sand-200); font-size: .82rem; color: var(--muted); }
.mk-steps li { display: flex; align-items: center; gap: 16px; }
.mk-steps b { flex: none; display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; background: linear-gradient(135deg, #c98f3a, #a66e22); color: #fff; font-size: .86rem; }
.mk-steps strong { display: block; font-size: .92rem; color: var(--ink); }

.mk-combos { padding-top: 0; }
.mk-combo-track { display: grid; grid-auto-flow: column; grid-auto-columns: calc((100% - 3 * 18px) / 4); gap: 18px; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; padding: 6px 2px 16px; }
.mk-combo-track::-webkit-scrollbar { display: none; }
.mk-combo { scroll-snap-align: start; }
.mk-combo .act-card-media { aspect-ratio: 4 / 2.2; }
.mk-combo h3 { font-size: .98rem; min-height: 2.6em; }
.mk-bottom { display: grid; grid-template-columns: minmax(0, 1.85fr) minmax(0, 1fr); gap: 20px; margin-top: 26px; }
.mk-mapcard { position: relative; isolation: isolate; display: grid; grid-template-columns: minmax(0, .78fr) minmax(0, 1.22fr); align-items: stretch; min-height: 270px; border-radius: 22px; overflow: hidden; background: linear-gradient(100deg, #fffdf8 0%, #fdf5e6 55%, #f8e9cf 100%); box-shadow: 0 0 0 1px #ead7b3, 0 24px 54px rgba(120, 84, 30, .16); }
.mk-mapcard::after { content: ""; position: absolute; inset: 9px; z-index: 3; border-radius: 15px; border: 1px solid rgba(182, 122, 42, .38); pointer-events: none; }
.mk-mapcard-text { position: relative; z-index: 2; align-self: center; padding: clamp(26px, 3vw, 40px) 0 clamp(26px, 3vw, 40px) clamp(26px, 3vw, 44px); }
.mk-mapcard h2, .mk-request h2 { font-size: clamp(1.35rem, 1.1rem + .9vw, 1.8rem); }
.mk-mapcard-text p:not(.eyebrow) { margin: 10px 0 18px; font-size: .9rem; max-width: 22em; }
.mk-mapcard-map { position: relative; overflow: hidden; -webkit-mask-image: linear-gradient(90deg, transparent, #000 20%); mask-image: linear-gradient(90deg, transparent, #000 20%); }
.mk-mapcard-art { position: absolute; inset: -26% -8%; opacity: .92; }
.mk-mapcard-art .city-map-art { position: absolute; inset: 0; width: 100%; height: 100%; }
.mk-mapcard-art .cm-compass, .mk-mapcard-art .cm-site { display: none; }
.mk-mapcard-lines { position: absolute; inset: 0; width: 100%; height: 100%; }
.mk-mapcard-lines path { fill: none; stroke: var(--terracotta); stroke-width: 1.4; stroke-dasharray: 2 5; stroke-linecap: round; vector-effect: non-scaling-stroke; opacity: .75; }
.mk-map-label { position: absolute; left: 50%; top: 60%; transform: translate(-50%, -50%); padding: 4px 16px; border-radius: 999px; background: rgba(255, 255, 255, .92); box-shadow: 0 6px 16px rgba(120, 84, 30, .2); font: 700 1.05rem var(--font-display); letter-spacing: .04em; color: var(--ink); }
.mk-map-pin { position: absolute; width: 0; height: 0; }
.mk-map-pin::before { content: ""; position: absolute; left: -11px; top: -28px; width: 22px; height: 22px; border-radius: 50% 50% 50% 0; background: radial-gradient(circle at 50% 50%, #fff 0 4px, transparent 4.5px), linear-gradient(135deg, #e0623a, #b8431f); transform: rotate(-45deg); box-shadow: 0 4px 10px rgba(120, 50, 20, .4); }
.mk-map-pin::after { content: ""; position: absolute; left: -9px; top: -4px; width: 18px; height: 8px; border-radius: 50%; border: 2px solid var(--terracotta); opacity: .6; animation: region-pulse 2.2s ease-out infinite; }
.mk-map-photo { position: absolute; z-index: 1; width: clamp(96px, 23%, 138px); margin: 0; padding: 5px 5px 0; border-radius: 10px; background: #fff; box-shadow: 0 14px 30px rgba(120, 84, 30, .28); transform: rotate(-4deg); transition: transform .35s; }
.mk-map-photo-r { transform: rotate(3deg); }
.mk-map-photo-b { transform: rotate(-2deg); }
.mk-map-photo img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 6px; }
.mk-map-photo figcaption { padding: 5px 2px 6px; font: 600 .7rem var(--font-body); text-align: center; color: var(--ink); }
.mk-mapcard:hover .mk-map-photo { transform: rotate(0) translateY(-3px); }
.mk-request { position: relative; isolation: isolate; display: flex; align-items: center; min-height: 270px; border-radius: 22px; overflow: hidden; color: #fff; background: linear-gradient(150deg, #c98f3a 0%, #a8641f 46%, #7a3d17 100%); box-shadow: 0 24px 54px rgba(122, 61, 23, .3); }
.mk-request::after { content: ""; position: absolute; inset: 9px; border-radius: 15px; border: 1px solid rgba(255, 240, 210, .4); pointer-events: none; }
.mk-request-art { position: absolute; inset: 0; z-index: -1; width: 100%; height: 100%; }
.mk-sil-sun { fill: #ffd98a; opacity: .5; }
.mk-sil-dune-back { fill: #8a4a1c; opacity: .55; }
.mk-sil-dune { fill: #5a2c12; }
.mk-sil-camel { fill: #4a240f; stroke: #4a240f; }
.mk-sil-rope { fill: none; stroke: #4a240f; stroke-width: 1.200; }
.mk-sil-palm { fill: #4a240f; stroke: #4a240f; stroke-linecap: round; }
.mk-request-text { position: relative; padding: clamp(26px, 3vw, 38px); max-width: 21em; }
.mk-request h2 { color: #fff; }
.mk-request-text p:not(.eyebrow) { margin: 10px 0 18px; font-size: .9rem; color: rgba(255, 255, 255, .92); }
.btn-light { background: #fff; color: var(--gold-600); box-shadow: 0 10px 22px rgba(60, 30, 10, .28); }
.btn-light:hover { background: var(--navy-800); color: #fff; }

@media (max-width: 1100px) {
  .mk-tiles { grid-auto-flow: row; grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .mk-day-grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .mk-steps { grid-column: 1 / -1; grid-template-columns: repeat(2, minmax(0, 1fr)); border-left: 0; padding-left: 0; }
  .mk-combo-track { grid-auto-columns: calc((100% - 2 * 18px) / 3); }
}
@media (max-width: 960px) {
  .mk-intro { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .mk-intro-text { grid-column: 1 / -1; }
  .mk-more, .mk-bottom { grid-template-columns: minmax(0, 1fr); }
  .mk-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .mk-more-dark img { width: 100%; opacity: .3; -webkit-mask-image: none; mask-image: none; }
}
@media (max-width: 700px) {
  .mk-hero-points { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
  .mk-tiles { display: flex; overflow-x: auto; scrollbar-width: none; margin-inline: calc(var(--gutter) * -1 + 8px); }
  .mk-tiles::-webkit-scrollbar { display: none; }
  .mk-tile { flex: 0 0 104px; }
  .mk-day-grid, .mk-mapcard { grid-template-columns: minmax(0, 1fr); }
  .mk-mapcard-text { padding-right: 26px; }
  .mk-mapcard-map { min-height: 240px; -webkit-mask-image: none; mask-image: none; }
  .mk-map-label { left: 30%; top: 66%; font-size: .92rem; }
  .mk-map-photo-b { right: 4% !important; }
  .mk-intro { grid-template-columns: minmax(0, 1fr); }
  .mk-steps { grid-template-columns: minmax(0, 1fr); }
  .mk-tabs { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; margin-inline: calc(var(--gutter) * -1); padding-inline: var(--gutter); }
  .mk-tabs button { flex: none; }
  .mk-combo-track { grid-auto-columns: 78%; }
  .mk-stats { grid-template-columns: minmax(0, 1fr); }
}

/* ==========================================================================
   Camel Trekking in Merzouga page
   ========================================================================== */
.ct-hero { padding-bottom: clamp(104px, 10vw, 140px); }
.ct-hero h1 { max-width: 8.500em; }
.ct-hero-points li { flex-direction: row; text-align: left; gap: 12px; font-size: .84rem; font-weight: 600; }
.ct-hero-points small { display: block; font-size: .72rem; font-weight: 400; opacity: .8; }
.ct-play { position: absolute; right: 4%; bottom: 6%; flex-direction: column; gap: 8px; text-align: center; }
.ct-strip-wrap { position: relative; z-index: 5; display: flex; align-items: center; gap: 10px; margin-top: -70px; padding: 12px; border-radius: 16px; background: #fff; border: 1px solid var(--sand-200); box-shadow: var(--shadow); }
.ct-strip { flex: 1; display: grid; grid-auto-flow: column; grid-auto-columns: calc((100% - 4 * 12px) / 5); gap: 12px; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; margin: 0; padding: 0; list-style: none; }
.ct-strip::-webkit-scrollbar { display: none; }
.ct-strip li { scroll-snap-align: start; }
.ct-strip button { display: block; width: 100%; padding: 0; border: 0; border-radius: 10px; overflow: hidden; background: var(--sand-200); cursor: pointer; }
.ct-strip img { width: 100%; aspect-ratio: 4 / 2.3; object-fit: cover; transition: transform .5s; }
.ct-strip button:hover img { transform: scale(1.06); }
.ct-strip li:first-child button { box-shadow: 0 0 0 3px var(--gold); }
.ct-strip-btn { flex: none; background: #fff; }

.ct-overview-grid { display: grid; grid-template-columns: minmax(0, 1fr) clamp(300px, 28vw, 370px); gap: clamp(28px, 4vw, 60px); align-items: start; }
.ct-overview-grid > div > p:not(.eyebrow) { margin: 16px 0 26px; line-height: 1.8; }
.ct-features { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); padding: 20px 8px; border-radius: 14px; background: #fff; border: 1px solid var(--sand-200); box-shadow: var(--shadow-sm); text-align: center; font-size: .8rem; font-weight: 500; line-height: 1.4; color: var(--ink); }
.ct-features li { display: grid; justify-items: center; gap: 10px; padding-inline: 6px; border-left: 1px solid var(--sand-200); }
.ct-features li:first-child { border-left: 0; }
.ct-features .icon { width: 32px; height: 32px; color: var(--terracotta); stroke-width: 1.3; }
.ct-book { display: grid; gap: 12px; padding: 26px 24px; border-radius: 16px; background: #fff; border: 1px solid var(--sand-200); box-shadow: var(--shadow); }
.ct-book h2 { font-size: 1.3rem; }
.ct-book-price { margin: 0; font-size: 1.3rem; font-weight: 700; color: var(--terracotta); }
.ct-book-price span { font-size: .95rem; font-weight: 500; color: var(--ink); }
.ct-book-list { display: grid; gap: 11px; margin: 6px 0 8px; font-size: .88rem; color: var(--ink); }
.ct-book-list li, .ct-book-notes li { display: flex; align-items: center; gap: 10px; }
.ct-book-list .icon { flex: none; width: 22px; height: 22px; padding: 4px; border-radius: 50%; background: var(--sand-100); color: var(--gold); }
.ct-book .btn { width: 100%; justify-content: center; }
.ct-book-notes { display: grid; gap: 7px; margin-top: 4px; font-size: .8rem; color: var(--muted); }
.ct-book-notes .icon { width: 15px; height: 15px; color: var(--gold); }

.ct-trail { position: relative; isolation: isolate; overflow: hidden; color: #fff; padding-block: clamp(60px, 7vw, 100px) clamp(110px, 12vw, 190px); scroll-margin-top: var(--header-h); background: linear-gradient(180deg, #17203f 0%, #4a2a52 26%, #a8493a 52%, #e08a45 76%, #f4c27c 100%); }
.ct-trail-scene { position: absolute; inset: 0; z-index: -1; width: 100%; height: 100%; }
.ct-trail-sun { fill: #ffd98a; opacity: .22; }
.ct-trail-sun-core { fill: #ffe9b8; opacity: .85; }
.ct-trail-dune-3 { fill: #b45a2e; opacity: .75; }
.ct-trail-dune-2 { fill: #8a3f1f; opacity: .9; }
.ct-trail-dune-1 { fill: #4e2412; }
.ct-sil { fill: #3a1a0c; }
.ct-trail-head { max-width: 46em; margin: 0 auto clamp(50px, 6vw, 80px); text-align: center; }
.ct-trail-head .eyebrow { justify-content: center; }
.ct-trail-head h2 { color: #fff; }
.ct-trail-head h2 span { color: #ffd98a; font-style: italic; }
.ct-trail-head p:not(.eyebrow) { margin: 14px 0 0; color: rgba(255, 255, 255, .88); }
.ct-trail-row { position: relative; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: clamp(10px, 1.4vw, 20px); align-items: start; }
.ct-trail-path { position: absolute; left: -3%; right: -3%; top: 70px; z-index: -1; width: 106%; height: 150px; overflow: visible; }
.ct-trail-path path { fill: none; stroke: #ffe1a6; stroke-width: 2.5; stroke-dasharray: 2 10; stroke-linecap: round; vector-effect: non-scaling-stroke; opacity: .9; animation: tour-route 1.6s linear infinite; }
.ct-door { position: relative; display: flex; flex-direction: column; border-radius: 50% 50% 22px 22px / 124px 124px 22px 22px; background: #fffaf0; color: var(--text); box-shadow: 0 0 0 1px rgba(255, 233, 184, .9), 0 0 0 7px rgba(255, 233, 184, .16), 0 30px 60px rgba(40, 14, 6, .45); transition: transform .45s cubic-bezier(.22, .8, .24, 1), box-shadow .45s; }
.ct-door:nth-child(odd) { margin-top: 56px; }
.ct-door:hover { transform: translateY(-12px); box-shadow: 0 0 0 2px #ffd98a, 0 0 0 10px rgba(255, 217, 138, .22), 0 44px 80px rgba(40, 14, 6, .55); }
.ct-door-photo { position: relative; margin: 7px 7px 0; aspect-ratio: 1 / 1.12; border-radius: 50% 50% 14px 14px / 117px 117px 14px 14px; overflow: hidden; }
.ct-door-photo img { width: 100%; height: 100%; object-fit: cover; transition: transform .8s; }
.ct-door:hover .ct-door-photo img { transform: scale(1.08); }
.ct-door-photo::after { content: ""; position: absolute; inset: 55% 0 0; background: linear-gradient(0deg, rgba(20, 10, 4, .65), transparent); }
.ct-door-badge { position: absolute; left: 50%; bottom: 34px; z-index: 1; transform: translateX(-50%); padding: 5px 13px; border-radius: 999px; background: rgba(255, 250, 240, .94); font-size: .68rem; font-weight: 700; letter-spacing: .04em; color: var(--gold-600); white-space: nowrap; }
.ct-door-num { position: relative; z-index: 2; display: grid; place-items: center; width: 54px; height: 54px; margin: -27px auto 0; border-radius: 50%; background: linear-gradient(135deg, #d9a14f, #a66e22); border: 4px solid #fffaf0; font: 700 1.15rem var(--font-display); color: #fff; box-shadow: 0 8px 18px rgba(120, 70, 20, .35); }
.ct-door-body { display: flex; flex-direction: column; flex: 1; align-items: center; padding: 12px clamp(12px, 1.4vw, 20px) 22px; text-align: center; }
.ct-door-time { display: inline-flex; align-items: center; gap: 6px; margin: 0 0 8px; font-size: .68rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--terracotta); }
.ct-door-time .icon { width: 13px; height: 13px; }
.ct-door h3 { font-family: var(--font-display); font-size: clamp(.98rem, .86rem + .45vw, 1.2rem); line-height: 1.28; color: var(--ink); }
.ct-door-includes { display: grid; gap: 7px; width: 100%; margin: 14px 0 16px; padding-top: 14px; border-top: 1px dashed #e2cfa6; font-size: .78rem; line-height: 1.4; text-align: left; color: var(--ink); }
.ct-door-includes li { display: flex; align-items: flex-start; gap: 8px; }
.ct-door-includes .icon { flex: none; width: 15px; height: 15px; margin-top: 1px; padding: 3px; border-radius: 50%; background: var(--gold); color: #fff; stroke-width: 3.2; }
.ct-door-price { margin: auto 0 12px; font: 700 1.2rem var(--font-display); color: var(--terracotta); }
.ct-door-price span { font: 400 .78rem var(--font-body); color: var(--muted); }
.ct-door .btn { width: 100%; justify-content: center; }
.ct-trail-note { display: flex; align-items: center; justify-content: center; gap: 10px; margin: clamp(30px, 4vw, 48px) 0 0; font-size: .88rem; font-weight: 500; color: #fff; text-shadow: 0 2px 10px rgba(40, 14, 6, .5); }
.ct-trail-note .icon { width: 18px; height: 18px; color: #ffe1a6; }

.ct-expect-grid { display: grid; grid-template-columns: minmax(0, .95fr) minmax(0, 1fr); gap: clamp(28px, 4vw, 64px); align-items: center; }
.ct-expect-photos { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.ct-expect-main { position: relative; grid-column: 1 / -1; display: block; padding: 0; border: 0; border-radius: 14px; overflow: hidden; cursor: pointer; background: var(--navy-900); box-shadow: var(--shadow); }
.ct-expect-main img { width: 100%; aspect-ratio: 1 / .92; object-fit: cover; }
.ct-expect-photos > img { width: 100%; aspect-ratio: 4 / 2.7; object-fit: cover; border-radius: 10px; }
.ct-expect-grid > div > p:not(.eyebrow) { margin: 14px 0 26px; line-height: 1.8; }
.ct-steps { position: relative; display: grid; gap: 22px; margin: 0; padding: 0; list-style: none; font-size: .9rem; line-height: 1.6; }
.ct-steps::before { content: ""; position: absolute; left: 21px; top: 20px; bottom: 20px; border-left: 2px dotted #d9c39b; }
.ct-steps li { position: relative; display: flex; gap: 18px; }
.ct-step-icon { flex: none; display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; background: linear-gradient(135deg, #d39a4a, #a66e22); color: #fff; box-shadow: 0 0 0 5px var(--sand-50); }
.ct-step-icon .icon { width: 22px; height: 22px; stroke-width: 1.5; }
.ct-steps strong { display: block; font-size: 1rem; color: var(--ink); }

.ct-more { position: relative; isolation: isolate; display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, .8fr) minmax(0, .7fr); align-items: center; border-radius: 18px; overflow: hidden; color: #fff; background: #1c100a; box-shadow: var(--shadow); min-height: 300px; }
.ct-more-media { position: absolute; right: 0; top: 0; z-index: -1; width: 62%; height: 100%; object-fit: cover; object-position: 50% 40%; -webkit-mask-image: linear-gradient(270deg, #000 45%, transparent); mask-image: linear-gradient(270deg, #000 45%, transparent); }
.ct-more::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, #1c100a 30%, rgba(28, 16, 10, .55) 62%, rgba(28, 16, 10, 0) 82%); }
.ct-more-text { padding: clamp(28px, 3.6vw, 52px); }
.ct-more h2 { color: #fff; }
.ct-more-text > p:not(.eyebrow) { margin: 14px 0 22px; font-size: .92rem; color: rgba(255, 255, 255, .88); }
.ct-more-points { display: grid; gap: 16px; font-size: .86rem; color: rgba(255, 255, 255, .92); }
.ct-more-points li { display: flex; align-items: center; gap: 12px; }
.ct-more-points .icon { flex: none; width: 24px; height: 24px; color: var(--gold-300); stroke-width: 1.4; }

.ct-info-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, .9fr) minmax(0, 1.15fr); gap: 18px; align-items: stretch; }
.ct-info-card { padding: 24px 22px; border-radius: 16px; background: #fff; border: 1px solid var(--sand-200); box-shadow: var(--shadow-sm); }
.ct-info-card .act-checks { margin: 14px 0 0; font-size: .9rem; }
.ct-know { display: grid; gap: 16px; margin-top: 14px; font-size: .82rem; line-height: 1.5; color: var(--muted); }
.ct-know li { display: flex; gap: 14px; }
.ct-know .icon { flex: none; width: 28px; height: 28px; color: var(--terracotta); stroke-width: 1.3; }
.ct-know strong { display: block; font-size: .9rem; color: var(--ink); }
.ct-location { display: flex; flex-direction: column; padding-bottom: 14px; }
.ct-location-map { position: relative; flex: 1; min-height: 220px; margin-top: 12px; border-radius: 12px; overflow: hidden; background: #fbf1df; }
.ct-location-map .mk-mapcard-art { inset: -18% -10%; }
.ct-location-map .city-map-art { position: absolute; inset: 0; width: 100%; height: 100%; }
.ct-map-label { left: 34%; top: 80%; font-size: .95rem; }
.ct-pin-small::before { transform: rotate(-45deg) scale(.8); }
.ct-map-dunes { position: absolute; left: 70%; top: 22%; font: 600 .74rem var(--font-body); color: var(--ink); text-shadow: 0 0 4px #fff, 0 0 6px #fff; white-space: nowrap; }
.ct-map-photo { right: 5%; bottom: 8%; transform: rotate(2deg); width: clamp(96px, 34%, 132px); }
.ct-map-photo figcaption { font-weight: 400; font-size: .66rem; color: var(--muted); }
.ct-map-photo figcaption strong { display: block; font-size: .74rem; color: var(--ink); }

.ct-quote { position: relative; isolation: isolate; color: #fff; padding-block: clamp(50px, 6vw, 88px); background: #2a1408; overflow: hidden; }
.ct-quote img { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; object-fit: cover; }
.ct-quote::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, rgba(40, 18, 6, .8), rgba(40, 18, 6, .2) 60%); }
.ct-quote p { position: relative; margin: 0; padding-left: 40px; font-family: var(--font-display); font-size: clamp(1.4rem, 1rem + 1.6vw, 2.2rem); line-height: 1.3; }
.ct-quote p span { position: absolute; left: 0; top: -.25em; font-size: 2.6em; line-height: 1; color: var(--gold-300); }
.ct-faq .faq-list { grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; }

@media (max-width: 1100px) {
  .ct-features { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px 0; }
  .ct-info-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ct-location { grid-column: 1 / -1; }
  .ct-more { grid-template-columns: minmax(0, 1fr) minmax(0, .8fr); }
}
@media (max-width: 960px) {
  .ct-overview-grid, .ct-expect-grid { grid-template-columns: minmax(0, 1fr); }
  .ct-trail-row { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; margin-inline: calc(var(--gutter) * -1); padding: 14px var(--gutter) 30px; }
  .ct-trail-row::-webkit-scrollbar { display: none; }
  .ct-door, .ct-door:nth-child(odd) { flex: 0 0 min(300px, 76%); margin-top: 0; scroll-snap-align: center; }
  .ct-trail-path { display: none; }
}
@media (max-width: 700px) {
  .ct-hero-points { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
  .ct-play { position: static; flex-direction: row; margin-top: 18px; }
  .ct-strip { grid-auto-columns: 46%; }
  .ct-strip-btn { display: none; }
  .ct-features { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ct-features li { border-left: 0; }
  .ct-info-grid { grid-template-columns: minmax(0, 1fr); }
  .ct-more { grid-template-columns: minmax(0, 1fr); }
  .ct-more-points { padding: 0 28px 28px; }
  .ct-more-media { width: 100%; opacity: .3; -webkit-mask-image: none; mask-image: none; }
  .ct-faq .faq-list { grid-template-columns: minmax(0, 1fr); }
  .ct-faq .section-head .btn { display: none; }
}

/* ---------- Activity details pages ---------- */
.ad-hero h1 { max-width: 11em; }
.ad-hero h1 span { display: block; }
.ad-hero .ct-hero-points { flex-wrap: wrap; row-gap: 14px; max-width: min(100%, 720px); }
.ad-overview-grid { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, .62fr) clamp(290px, 26vw, 360px); gap: clamp(22px, 2.8vw, 40px); align-items: start; }
.ad-overview-text p:not(.eyebrow) { margin: 0 0 1.05em; line-height: 1.8; }
.ad-overview-text h2 { margin-bottom: 16px; }
.ad-feats { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); border-radius: 14px; overflow: hidden; background: #fff; border: 1px solid var(--sand-200); box-shadow: var(--shadow-sm); text-align: center; font-size: .8rem; font-weight: 600; line-height: 1.35; color: var(--ink); }
.ad-feats li { display: grid; justify-items: center; align-content: center; gap: 10px; min-height: 124px; padding: 16px 10px; border-right: 1px solid var(--sand-200); border-bottom: 1px solid var(--sand-200); }
.ad-feats li:nth-child(even) { border-right: 0; }
.ad-feats li:nth-last-child(-n+2) { border-bottom: 0; }
.ad-feats .icon { width: 34px; height: 34px; color: var(--terracotta); stroke-width: 1.3; }
.ad-itin { position: relative; padding: clamp(56px, 7vw, 104px) 0; overflow: hidden; color: #3a2a18;
  background:
    radial-gradient(ellipse 55% 30% at 50% 0, rgba(255,247,228,.75), transparent 70%),
    radial-gradient(120% 22% at 18% 101%, rgba(194,120,52,.26), transparent 70%),
    radial-gradient(110% 18% at 88% 102%, rgba(166,110,34,.22), transparent 70%),
    repeating-linear-gradient(45deg, rgba(122,78,24,.04) 0 1px, transparent 1px 24px),
    repeating-linear-gradient(-45deg, rgba(122,78,24,.04) 0 1px, transparent 1px 24px),
    linear-gradient(180deg, #f3e2c2, #ecd3a6 55%, #e4c28c); }
.ad-itin-head { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 22px 40px; margin-bottom: clamp(26px, 3.4vw, 44px); }
.ad-itin-head h2 { margin: 10px 0 0; max-width: 16em; color: #2b1b0e; }
.ad-itin-head .eyebrow { color: #8a5a17; }
.ad-itin-facts { display: flex; flex-wrap: wrap; gap: 10px; margin: 0; padding: 0; list-style: none; }
.ad-itin-facts li { display: flex; align-items: center; gap: 11px; padding: 10px 18px 10px 12px; border-radius: 999px; background: rgba(255,252,245,.85); border: 1px solid rgba(166,110,34,.3); font-size: .86rem; font-weight: 600; line-height: 1.3; color: #2b1b0e; }
.ad-itin-facts .icon { flex: none; width: 34px; height: 34px; padding: 7px; border-radius: 50%; background: linear-gradient(135deg, #dba854, #a66e22); color: #fff; stroke-width: 1.6; }
.ad-itin-facts small { display: block; font-size: .62rem; font-weight: 500; letter-spacing: .14em; text-transform: uppercase; color: #8b744d; }

.ad-route { position: relative; display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); margin: 0 0 clamp(30px, 4vw, 54px); padding: 22px clamp(14px, 2vw, 28px); list-style: none; border-radius: 22px; background: linear-gradient(135deg, #1c2f47, #0f1e31); border: 1px solid rgba(226,181,102,.45); box-shadow: 0 22px 48px rgba(15,30,49,.28); }
.ad-route li { position: relative; }
.ad-route li + li::before { content: ""; position: absolute; top: 22px; right: calc(50% + 30px); width: calc(100% - 60px); border-top: 2px dashed rgba(226,181,102,.6); }
.ad-route a { position: relative; display: grid; justify-items: center; gap: 12px; padding: 0 10px; text-align: center; color: #fff; }
.ad-route-dot { display: grid; place-items: center; width: 46px; height: 46px; border-radius: 50%; background: #0f1e31; border: 2px solid #e2b566; color: #f1d39a; font: 700 1.05rem var(--font-display); transition: background .3s, color .3s, transform .3s; }
.ad-route a:hover .ad-route-dot { background: linear-gradient(135deg, #e6bd6f, #b17a28); color: #fff; transform: scale(1.08); }
.ad-route-text { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden; font-size: .82rem; font-weight: 500; line-height: 1.45; color: #dfe6ee; }
.ad-route-text small { display: block; margin-bottom: 3px; font-size: .66rem; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: #e6bd6f; }

.ad-stages { display: grid; gap: clamp(28px, 3.6vw, 48px); }
.ad-stage { position: relative; display: grid; grid-template-columns: minmax(0, .82fr) minmax(0, 1.18fr); scroll-margin-top: calc(var(--header-h) + 24px); border-radius: 26px; background: #fffdf8; border: 1px solid #e6d2ac; box-shadow: 0 26px 56px rgba(110,70,18,.18); overflow: hidden; transition: box-shadow .35s, transform .35s; }
.ad-stage:hover { transform: translateY(-4px); box-shadow: 0 34px 68px rgba(110,70,18,.26); }
.ad-stage:nth-child(even) { grid-template-columns: minmax(0, 1.18fr) minmax(0, .82fr); }
.ad-stage:nth-child(even) .ad-stage-photo { order: 2; }
.ad-stage-photo { position: relative; min-height: 100%; margin: 0; padding: 16px; background: linear-gradient(160deg, #f6e9cf, #efd9b0); }
.ad-stage-photo::before { content: ""; position: absolute; inset: 8px; border-radius: 999px 999px 20px 20px; border: 1px dashed rgba(138,90,23,.45); pointer-events: none; }
.ad-stage-photo img { display: block; width: 100%; height: 100%; min-height: 340px; object-fit: cover; border-radius: 999px 999px 14px 14px; box-shadow: 0 18px 36px rgba(90,56,14,.28); transition: transform .8s; }
.ad-stage:hover .ad-stage-photo img { transform: scale(1.03); }
.ad-stage-photo figcaption { position: absolute; left: 50%; bottom: 30px; transform: translateX(-50%); padding: 9px 22px; border-radius: 999px; background: rgba(15,30,49,.88); border: 1px solid rgba(226,181,102,.7); color: #f1d39a; font-size: .7rem; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; white-space: nowrap; backdrop-filter: blur(4px); }
.ad-stage-body { position: relative; display: flex; flex-direction: column; padding: clamp(24px, 3.2vw, 46px); }
.ad-stage-num { position: absolute; top: clamp(8px, 1.4vw, 18px); right: clamp(18px, 2.6vw, 38px); font: 700 clamp(4rem, 7vw, 6.6rem)/1 var(--font-display); color: transparent; -webkit-text-stroke: 1.5px rgba(177,122,40,.35); pointer-events: none; }
.ad-stage-label { display: inline-flex; align-items: center; gap: 12px; margin: 0 0 12px; font-size: .72rem; font-weight: 700; letter-spacing: .2em; text-transform: uppercase; color: #a66e22; }
.ad-stage-label::after { content: ""; width: 44px; height: 1px; background: #c8963f; }
.ad-stage-body h3 { position: relative; margin: 0 0 16px; max-width: 86%; font: 700 clamp(1.25rem, 1.9vw, 1.7rem)/1.28 var(--font-display); color: #2b1b0e; }
.ad-stage-body > p:not(.ad-stage-label) { margin: 0 0 .95em; font-size: .95rem; line-height: 1.85; color: #4d4338; }
.ad-stage-points { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px 20px; margin: 8px 0 0; padding: 0; list-style: none; font-size: .86rem; font-weight: 600; color: #2b1b0e; }
.ad-stage-points li { display: flex; align-items: flex-start; gap: 10px; line-height: 1.45; }
.ad-stage-points .icon { flex: none; width: 20px; height: 20px; margin-top: 1px; padding: 4px; border-radius: 50%; background: linear-gradient(135deg, #dba854, #a66e22); color: #fff; stroke-width: 2.4; }
.ad-stage-meta { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 14px 20px; margin: auto calc(clamp(24px, 3.2vw, 46px) * -1) calc(clamp(24px, 3.2vw, 46px) * -1); padding: 20px clamp(24px, 3.2vw, 46px); list-style: none; background: #fbf3e2; border-top: 2px dashed #e0c794; }
.ad-stage-points + .ad-stage-meta { margin-top: 28px; }
.ad-stage-meta li { display: flex; align-items: flex-start; gap: 11px; font-size: .86rem; font-weight: 600; line-height: 1.4; color: #2b1b0e; }
.ad-stage-meta .icon { flex: none; width: 24px; height: 24px; margin-top: 2px; color: #a66e22; stroke-width: 1.4; }
.ad-stage-meta small { display: block; font-size: .62rem; font-weight: 500; letter-spacing: .14em; text-transform: uppercase; color: #8b744d; }

.ad-itin-foot { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 18px 30px; margin-top: clamp(34px, 4.4vw, 60px); padding: 20px clamp(18px, 2.4vw, 30px); border-radius: 18px; background: linear-gradient(135deg, #4a2c18, #2a180d); border: 1px solid rgba(226,181,102,.5); box-shadow: 0 18px 40px rgba(60,34,12,.28); }
.ad-itin-foot p { flex: 1 1 320px; display: flex; align-items: center; gap: 12px; margin: 0; font-size: .9rem; color: #f1e4cb; }
.ad-itin-foot p .icon { flex: none; width: 22px; height: 22px; color: #e0b56c; }
@media (max-width: 860px) {
  .ad-route { grid-auto-flow: row; gap: 16px; padding: 20px 18px; }
  .ad-route li + li::before { top: -16px; right: auto; left: 22px; width: 0; height: 16px; border-top: 0; border-left: 2px dashed rgba(226,181,102,.6); }
  .ad-route a { grid-template-columns: 46px minmax(0, 1fr); justify-items: start; align-items: center; gap: 14px; padding: 0; text-align: left; }
  .ad-stage, .ad-stage:nth-child(even) { grid-template-columns: minmax(0, 1fr); }
  .ad-stage:nth-child(even) .ad-stage-photo { order: 0; }
  .ad-stage-photo { padding: 14px 14px 0; background: none; }
  .ad-stage-photo::before { inset: 7px 7px -7px; border-bottom: 0; border-radius: 999px 999px 0 0; }
  .ad-stage-photo img { height: auto; min-height: 0; aspect-ratio: 1 / .86; }
  .ad-stage-photo figcaption { bottom: 16px; }
  .ad-stage-body h3 { max-width: none; }
  .ad-stage-num { position: static; display: block; margin-bottom: 4px; font-size: 3.4rem; }
  .ad-stage-points { grid-template-columns: minmax(0, 1fr); }
}
.ad-expect h2 { margin-bottom: 22px; }
.ad-expect-photo { grid-column: auto; width: 100%; }
.ad-expect-photo img { aspect-ratio: 1 / .78; }
.ct-step-icon b { font: 700 1rem var(--font-display); }
.ad-more { margin-bottom: 0; }
.ad-excluded-title { margin: 18px 0 8px; font-size: .7rem; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; color: var(--muted); }
.ad-excluded { display: grid; gap: 6px; font-size: .84rem; color: var(--muted); }
.ad-excluded li { position: relative; padding-left: 20px; }
.ad-excluded li::before { content: ""; position: absolute; left: 2px; top: .62em; width: 10px; height: 2px; background: var(--terracotta); }
.ad-map-label { left: 44%; top: 74%; }
.ad-related { background: var(--sand-100); }
.ad-related-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(14px, 1.8vw, 24px); }
.ad-related-card { display: flex; flex-direction: column; border-radius: 14px; overflow: hidden; background: #fff; border: 1px solid var(--sand-200); box-shadow: var(--shadow-sm); transition: transform .3s, box-shadow .3s; }
.ad-related-card:hover { transform: translateY(-5px); box-shadow: var(--shadow); }
.ad-related-card img { width: 100%; aspect-ratio: 16 / 8.6; object-fit: cover; }
.ad-related-text { display: grid; gap: 6px; padding: 16px 18px 18px; }
.ad-related-text small { display: inline-flex; align-items: center; gap: 6px; font-size: .72rem; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--gold-600); }
.ad-related-text small .icon { width: 13px; height: 13px; }
.ad-related-text strong { font: 700 1.08rem/1.3 var(--font-display); color: var(--ink); }
.ad-related-text em { display: inline-flex; align-items: center; gap: 8px; font-style: normal; font-size: .86rem; font-weight: 600; color: var(--terracotta); }
.ad-related-text em .icon { width: 15px; height: 15px; }
.act-card h3 a:hover, .ct-door h3 a:hover { color: var(--gold-600); }
.ct-door-more { margin-top: 10px; font-size: .8rem; font-weight: 600; color: var(--gold-600); }
@media (max-width: 1100px) {
  .ad-overview-grid { grid-template-columns: minmax(0, 1fr) clamp(280px, 36vw, 340px); }
  .ad-feats { grid-column: 1; grid-row: 2; }
  .ad-overview-grid .ct-book { grid-column: 2; grid-row: 1 / span 2; }
}
@media (max-width: 760px) {
  .ad-overview-grid { grid-template-columns: minmax(0, 1fr); }
  .ad-feats, .ad-overview-grid .ct-book { grid-column: auto; grid-row: auto; }
  .ad-related-grid { grid-template-columns: minmax(0, 1fr); }
}

/* ---------- About Us page ---------- */
.ab-hero h1 { max-width: 12em; }
.ab-hero h1 span { color: var(--gold-300); }
.ab-play small { display: block; font-size: .76rem; font-weight: 400; opacity: .85; }
.ab-hero-script { position: absolute; right: clamp(16px, 5vw, 80px); top: 20%; margin: 0; font-family: var(--font-script); font-size: clamp(1.4rem, 1.05rem + 1.3vw, 2.15rem); font-weight: 700; line-height: 1.2; color: #fff; text-align: center; transform: rotate(-6deg); text-shadow: 0 0 2px rgba(30, 14, 4, .95), 0 2px 4px rgba(30, 14, 4, .9), 0 4px 16px rgba(30, 14, 4, .8), 0 0 34px rgba(30, 14, 4, .6); }
.ab-strip { position: relative; z-index: 2; display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); margin: -44px 0 0; padding: 22px 10px; list-style: none; border-radius: 18px; background: #fffdf8; border: 1px solid var(--sand-200); box-shadow: var(--shadow); text-align: center; }
.ab-strip li { display: grid; justify-items: center; gap: 4px; padding: 4px 10px; }
.ab-strip li + li { border-left: 1px solid #e6d2ac; }
.ab-strip .icon { width: 34px; height: 34px; margin-bottom: 6px; color: var(--gold-600); stroke-width: 1.3; }
.ab-strip strong { font-size: 1.02rem; color: var(--ink); line-height: 1.2; }
.ab-strip span { font-size: .74rem; color: var(--muted); line-height: 1.35; }
.ab-who { padding-bottom: clamp(46px, 5vw, 76px); background: radial-gradient(40% 60% at 0 100%, rgba(214,170,98,.1), transparent 70%), var(--sand-50); }
.ab-who-grid { display: grid; grid-template-columns: minmax(0, .78fr) minmax(0, 1.22fr); gap: clamp(40px, 7vw, 120px); align-items: center; }
.ab-who-text h2 { max-width: 9em; margin-bottom: 18px; }
.ab-who-text p:not(.eyebrow) { margin: 0 0 1em; line-height: 1.8; }
.ab-who-text .btn { margin-top: 8px; }
.ab-collage { position: relative; display: grid; grid-template-columns: minmax(0, 1.12fr) minmax(0, 1fr); grid-template-rows: 1fr 1fr; gap: 12px; }
.ab-collage img { display: block; width: 100%; height: 100%; min-height: 0; object-fit: cover; border-radius: 14px; box-shadow: 0 16px 36px rgba(60,34,12,.2); }
.ab-collage-main { grid-row: 1 / span 2; aspect-ratio: 1 / 1.3; }
.ab-collage-script { position: absolute; z-index: 1; right: calc(100% + 6px); bottom: 2%; display: flex; align-items: center; gap: 8px; margin: 0; font-family: var(--font-script); font-size: clamp(1.15rem, .95rem + .6vw, 1.5rem); line-height: 1.12; color: #b8742e; text-align: center; transform: rotate(-12deg); white-space: nowrap; }
.ab-collage-script .icon { width: 40px; height: 40px; stroke-width: 1.1; }
.ab-values { position: relative; padding: clamp(60px, 6.4vw, 96px) 0 clamp(44px, 5vw, 70px); overflow: hidden; color: #dfece6;
  background: repeating-linear-gradient(45deg, rgba(255,255,255,.02) 0 1px, transparent 1px 26px), repeating-linear-gradient(-45deg, rgba(255,255,255,.02) 0 1px, transparent 1px 26px), linear-gradient(120deg, #0b2f2b, #0e3a35 55%, #0b302c); }
.ab-values::before { content: ""; position: absolute; left: -150px; top: -90px; width: 420px; height: 420px; border-radius: 50%; background: repeating-radial-gradient(circle, rgba(226,181,102,.16) 0 1px, transparent 1px 15px); -webkit-mask-image: radial-gradient(circle, #000 40%, transparent 70%); mask-image: radial-gradient(circle, #000 40%, transparent 70%); }
.ab-values-wave { position: absolute; left: 0; top: -1px; width: 100%; height: clamp(22px, 3vw, 46px); fill: var(--sand-50); }
.ab-values { --ab-arch: clamp(250px, 28vw, 480px); --ab-pad: calc(var(--ab-arch) - max(var(--gutter), (100vw - var(--container)) / 2) + 28px); }
.ab-values-arch { position: absolute; right: 0; top: clamp(8px, 1.2vw, 20px); bottom: 0; width: var(--ab-arch); padding: 14px 0 0 14px; border-radius: 48% 0 0 0 / 30% 0 0 0; background: linear-gradient(160deg, #d9b27a, #a87a45 60%, #8a5f31); box-shadow: -18px 0 50px rgba(0,0,0,.45), inset 0 0 0 2px rgba(255,236,200,.35); }
.ab-values-arch::before { content: ""; position: absolute; left: 6px; top: 6px; right: 0; bottom: 0; border-radius: 47% 0 0 0 / 29% 0 0 0; border-left: 2px solid rgba(90,56,20,.45); border-top: 2px solid rgba(90,56,20,.45); pointer-events: none; }
.ab-values-arch img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: 38% 50%; border-radius: 46% 0 0 0 / 28% 0 0 0; }
.ab-values .container { position: relative; }
.ab-values-head { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 16px 40px; margin-bottom: clamp(22px, 2.6vw, 36px); padding-right: var(--ab-pad); }
.ab-values-head h2 { margin: 10px 0 0; color: #fff; }
.ab-values-script { margin: 0 2% 6px 0; font-family: var(--font-script); font-size: clamp(1.15rem, .9rem + .8vw, 1.6rem); line-height: 1.25; color: #e9cf9a; text-align: center; }
.ab-values-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: clamp(12px, 1.5vw, 20px); margin: 0; padding: 0 var(--ab-pad) 0 0; list-style: none; }
.ab-values-grid li { display: grid; justify-items: center; align-content: start; gap: 12px; padding: clamp(22px, 2.3vw, 32px) 16px; border-radius: 14px; border: 1px solid rgba(226,181,102,.32); background: rgba(8,36,33,.35); text-align: center; transition: transform .3s, border-color .3s, background .3s; }
.ab-values-grid li:hover { transform: translateY(-5px); border-color: #e2b566; background: rgba(255,255,255,.06); }
.ab-values-grid .icon { width: 46px; height: 46px; color: #e2b566; stroke-width: 1.1; }
.ab-values-grid strong { font-size: 1.02rem; color: #fff; }
.ab-values-grid span { font-size: .84rem; line-height: 1.55; color: #c9dbd3; }
.ab-why-grid { display: grid; grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr); gap: clamp(28px, 4vw, 64px); align-items: center; }
.ab-why-grid h2 { margin-bottom: 16px; }
.ab-why-grid p:not(.eyebrow) { margin: 0 0 20px; line-height: 1.85; }
.ab-checks { display: grid; gap: 13px; font-weight: 600; }
.ab-tiles { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.ab-tile { position: relative; margin: 0; border-radius: 16px; overflow: hidden; background: #fff; box-shadow: var(--shadow); }
.ab-tile:first-child { grid-column: 1 / -1; }
.ab-tile img { display: block; width: 100%; aspect-ratio: 16 / 9; object-fit: cover; transition: transform .7s; }
.ab-tile:first-child img { aspect-ratio: 16 / 6.6; }
.ab-tile:hover img { transform: scale(1.05); }
.ab-tile figcaption { position: relative; display: flex; align-items: center; gap: 14px; padding: 14px 18px; background: #fff; font-size: .8rem; line-height: 1.45; color: var(--muted); }
.ab-tile:first-child figcaption { position: absolute; right: 0; bottom: 0; border-radius: 16px 0 0 0; }
.ab-tile figcaption .icon { flex: none; width: 34px; height: 34px; color: var(--gold-600); stroke-width: 1.2; }
.ab-tile figcaption strong { display: block; font-size: .95rem; color: var(--ink); }
.ab-team { position: relative; padding: clamp(50px, 6vw, 90px) 0 clamp(60px, 7vw, 110px); overflow: hidden;
  background: radial-gradient(50% 40% at 50% 100%, rgba(214,160,96,.3), transparent 70%), repeating-linear-gradient(45deg, rgba(166,110,34,.03) 0 1px, transparent 1px 24px), repeating-linear-gradient(-45deg, rgba(166,110,34,.03) 0 1px, transparent 1px 24px), linear-gradient(180deg, var(--sand-50), #f4e6cd); }
.ab-why { padding-bottom: clamp(34px, 4vw, 56px); }
.ab-team { padding-top: clamp(70px, 7vw, 104px); }
.ab-team::before { content: ""; position: absolute; left: 50%; top: clamp(22px, 2.6vw, 38px); width: min(620px, 76%); height: 1px; transform: translateX(-50%); background: linear-gradient(90deg, transparent, #c8963f 22%, #c8963f 78%, transparent); }
.ab-team::after { content: ""; position: absolute; left: 50%; top: clamp(22px, 2.6vw, 38px); width: 14px; height: 14px; margin: -7px 0 0 -7px; background: linear-gradient(135deg, #e6bd6f, #a66e22); transform: rotate(45deg); box-shadow: 0 0 0 6px #fbf5e9, 0 0 0 7px rgba(200,150,63,.55), 22px -22px 0 -4px #c8963f, -22px 22px 0 -4px #c8963f; }
.ab-team-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 20px 60px; margin-bottom: clamp(34px, 4.4vw, 60px); }
.ab-team-text { max-width: 620px; }
.ab-team-text h2 { margin-bottom: 16px; }
.ab-team-text > p:not(.eyebrow) { margin: 0 0 20px; line-height: 1.8; }
.ab-team-chips { display: flex; flex-wrap: wrap; gap: 10px; margin: 0 0 22px; padding: 0; list-style: none; }
.ab-team-chips li { display: inline-flex; align-items: center; gap: 9px; padding: 9px 16px 9px 12px; border-radius: 999px; background: #fffdf8; border: 1px solid #e6d2ac; box-shadow: 0 6px 14px rgba(90,56,14,.08); font-size: .84rem; font-weight: 600; color: var(--ink); }
.ab-team-chips .icon { width: 18px; height: 18px; color: var(--gold-600); }
.ab-team-chips strong { font: 700 1.05rem var(--font-display); color: #a0621f; }
.ab-team-wa { display: inline-flex; align-items: center; gap: 14px; padding: 10px 20px 10px 10px; border-radius: 999px; background: linear-gradient(135deg, #1c2f47, #0f1e31); color: #fff; font-size: .95rem; font-weight: 600; line-height: 1.25; box-shadow: 0 14px 30px rgba(15,30,49,.25); transition: transform .3s, box-shadow .3s; }
.ab-team-wa:hover { transform: translateY(-3px); box-shadow: 0 20px 40px rgba(15,30,49,.34); }
.ab-team-wa small { display: block; font-size: .7rem; font-weight: 500; letter-spacing: .1em; text-transform: uppercase; color: #e6bd6f; }
.ab-team-wa-icon { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; background: #25a55a; box-shadow: 0 0 0 4px rgba(37,165,90,.25); }
.ab-team-wa-icon .icon { width: 22px; height: 22px; color: #fff; }
.ab-team-wa > .icon { width: 18px; height: 18px; color: #e6bd6f; transition: transform .3s; }
.ab-team-wa:hover > .icon { transform: translateX(4px); }
.ab-team-script { margin: 0 4% 0 0; font-family: var(--font-script); font-size: clamp(1.4rem, 1.1rem + 1vw, 2.1rem); line-height: 1.15; color: #a0621f; text-align: center; transform: rotate(-6deg); }
.ab-arcade { position: relative; display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: clamp(12px, 1.8vw, 26px); margin: 0; padding: 0 0 44px; list-style: none; scroll-margin-top: calc(var(--header-h) + 30px); }
.ab-arcade::before { content: ""; position: absolute; left: -4%; right: -4%; top: 46%; border-top: 2px dashed rgba(166,110,34,.4); }
.ab-arch { position: relative; display: grid; justify-items: center; transition: transform .45s ease; }
.ab-arch:nth-child(even) { transform: translateY(44px); }
.ab-arch:hover { transform: translateY(-10px); }
.ab-arch:nth-child(even):hover { transform: translateY(34px); }
.ab-arch-frame { position: relative; display: block; width: 100%; padding: 8px; border-radius: 999px 999px 20px 20px; background: linear-gradient(160deg, #f3dcab, #c8963f 55%, #9a6a22); box-shadow: 0 22px 44px rgba(90,56,14,.28); }
.ab-arch-frame::before { content: ""; position: absolute; left: 50%; top: -15px; width: 16px; height: 16px; margin-left: -8px; background: linear-gradient(135deg, #e6bd6f, #a66e22); transform: rotate(45deg); box-shadow: 0 0 0 4px #f8eedc; }
.ab-arch-frame::after { content: ""; position: absolute; inset: 3px; border-radius: 999px 999px 17px 17px; border: 1px solid rgba(255,244,214,.75); pointer-events: none; }
.ab-arch-frame img { display: block; width: 100%; aspect-ratio: 3 / 4.3; object-fit: cover; object-position: 50% 22%; border-radius: 999px 999px 13px 13px; filter: grayscale(.85) sepia(.25) contrast(1.04); transition: filter .5s, transform .6s; }
.ab-arch:hover .ab-arch-frame img { filter: none; }
.ab-arch-plate { position: relative; z-index: 1; display: grid; justify-items: center; gap: 2px; width: 88%; margin-top: -30px; padding: 12px 10px 13px; border-radius: 14px; background: #fffdf8; border: 1px solid #ead9b8; box-shadow: 0 12px 26px rgba(90,56,14,.16); text-align: center; transition: border-color .3s, box-shadow .3s; }
.ab-arch:hover .ab-arch-plate { border-color: #c8963f; box-shadow: 0 16px 32px rgba(90,56,14,.24); }
.ab-arch-plate strong { font: 700 1.12rem var(--font-display); color: var(--ink); }
.ab-arch-plate > span { font-size: .7rem; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--gold-600); }
.ab-arch-plate small { display: inline-flex; align-items: center; gap: 5px; margin-top: 5px; padding-top: 6px; border-top: 1px dashed #e0c794; font-size: .72rem; color: var(--muted); }
.ab-arch-plate small .icon { width: 12px; height: 12px; color: var(--gold-600); }
.ab-dialog { padding: 0; border: 0; border-radius: 26px; background: #fffdf8; box-shadow: 0 40px 100px rgba(0,0,0,.5); overflow: hidden; }
.ab-dialog::backdrop { background: rgba(12, 22, 34, .74); -webkit-backdrop-filter: blur(5px); backdrop-filter: blur(5px); }
.ab-dialog .lightbox-close { position: absolute; z-index: 3; right: 16px; top: 16px; background: var(--navy-900); color: #fff; }
.ab-story { width: min(1080px, calc(100vw - 28px)); max-height: calc(100vh - 28px); }
.ab-story[open] { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); animation: abStoryIn .45s ease both; }
@keyframes abStoryIn { from { opacity: 0; transform: translateY(18px) scale(.98); } to { opacity: 1; transform: none; } }
.ab-story-media { position: relative; min-height: 100%; background: #2a180d; }
.ab-story-media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.ab-story-media::after { content: ""; position: absolute; inset: 0; background: linear-gradient(0deg, rgba(30,15,6,.85), transparent 55%); }
.ab-story-media p { position: absolute; z-index: 1; left: 24px; right: 24px; bottom: 26px; margin: 0; font-family: var(--font-script); font-size: clamp(1.4rem, 1.1rem + 1vw, 2rem); line-height: 1.2; color: #f6e2b4; transform: rotate(-3deg); }
.ab-story-text { max-height: calc(100vh - 28px); padding: clamp(28px, 3.4vw, 52px); overflow-y: auto; }
.ab-story-text h2 { margin: 10px 0 24px; font-size: clamp(1.5rem, 1.2rem + 1.2vw, 2.2rem); line-height: 1.2; }
.ab-story-chapters { position: relative; display: grid; gap: 22px; margin: 0 0 26px; padding: 0; list-style: none; counter-reset: story; }
.ab-story-chapters::before { content: ""; position: absolute; left: 17px; top: 20px; bottom: 20px; border-left: 2px dotted #d9c39b; }
.ab-story-chapters li { position: relative; padding-left: 56px; counter-increment: story; }
.ab-story-chapters li::before { content: counter(story); position: absolute; left: 0; top: 0; display: grid; place-items: center; width: 36px; height: 36px; border-radius: 50%; background: linear-gradient(135deg, #d39a4a, #a66e22); color: #fff; font: 700 .95rem var(--font-display); box-shadow: 0 0 0 5px #fffdf8; }
.ab-story-chapters h3 { margin: 4px 0 6px; font: 700 1.12rem var(--font-display); color: var(--ink); }
.ab-story-chapters p { margin: 0; font-size: .94rem; line-height: 1.8; color: #4d4a44; }
.ab-story-sign { margin: 0 0 22px; font-family: var(--font-script); font-size: 1.6rem; color: #a0621f; }
@media (max-width: 760px) {
  .ab-story[open] { grid-template-columns: minmax(0, 1fr); overflow-y: auto; }
  .ab-story-media { min-height: 200px; }
  .ab-story-text { max-height: none; overflow: visible; }
}
.ab-band { position: relative; padding: clamp(40px, 5vw, 70px) 0 clamp(110px, 11vw, 170px); overflow: hidden; color: #fff; background: #2a180d; }
.ab-band > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: .55; }
.ab-band::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(42,24,13,.55), rgba(42,24,13,.75)); }
.ab-band-dunes { position: absolute; z-index: 1; left: 0; right: 0; bottom: -1px; width: 100%; height: clamp(70px, 8.4vw, 124px); }
.ab-dune-back { fill: rgba(232,196,138,.35); }
.ab-dune-mid { fill: rgba(243,222,184,.7); }
.ab-dune-front { fill: #f8efdc; }
.ab-band-seal { position: absolute; z-index: 2; left: 50%; bottom: clamp(4px, 1vw, 14px); display: grid; place-items: center; width: 58px; height: 58px; margin-left: -29px; border-radius: 50%; background: #f8efdc; box-shadow: 0 0 0 1px #d6aa62, 0 0 0 6px #f8efdc, 0 0 0 7px rgba(214,170,98,.6), 0 12px 26px rgba(60,34,12,.3); }
.ab-band-seal::before, .ab-band-seal::after { content: ""; position: absolute; top: 50%; width: clamp(60px, 12vw, 190px); height: 1px; background: linear-gradient(90deg, transparent, #c8963f); }
.ab-band-seal::before { right: calc(100% + 16px); }
.ab-band-seal::after { left: calc(100% + 16px); transform: scaleX(-1); }
.ab-band-seal i { position: relative; width: 22px; height: 22px; background: linear-gradient(135deg, #e6bd6f, #a66e22); transform: rotate(45deg); }
.ab-band-seal i::before { content: ""; position: absolute; inset: 0; background: linear-gradient(135deg, #f1d39a, #b17a28); transform: rotate(45deg); }
.ab-band-seal i::after { content: ""; position: absolute; inset: 7px; border-radius: 50%; background: #f8efdc; }
.ab-band-grid { position: relative; z-index: 1; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin: 0 auto; padding-block: 0; list-style: none; text-align: center; }
.ab-band-grid li { display: grid; justify-items: center; gap: 4px; padding: 6px 12px; }
.ab-band-grid li + li { border-left: 1px solid rgba(255,255,255,.3); }
.ab-band-grid .icon { width: 44px; height: 44px; margin-bottom: 8px; color: #e6bd6f; stroke-width: 1.2; }
.ab-band-grid strong { font: 700 clamp(1.5rem, 1.1rem + 1.4vw, 2.3rem)/1.1 var(--font-body); }
.ab-band-grid span { font-size: .86rem; color: #f1e4cb; }
.ab-guests { position: relative; padding: clamp(30px, 3.6vw, 56px) 0 clamp(54px, 6.4vw, 100px); overflow: hidden; color: #3a2a18;
  background: radial-gradient(rgba(138,90,23,.16) 1px, transparent 1.4px) 0 0 / 22px 22px, radial-gradient(60% 50% at 50% 0, rgba(255,250,236,.9), transparent 70%), linear-gradient(180deg, #f8efdc, #f0e0c2); }
.ab-album-route { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; }
.ab-album-route path { fill: none; stroke: #b17a28; stroke-width: 2.5; stroke-dasharray: 3 12; stroke-linecap: round; opacity: .55; vector-effect: non-scaling-stroke; }
.ab-guests .container { position: relative; }
.ab-album-head { text-align: center; margin-bottom: clamp(30px, 4vw, 56px); }
.ab-album-head .eyebrow { justify-content: center; }
.ab-album-head h2 { margin: 10px 0 2px; color: #2b1b0e; }
.ab-album-sub { margin: 0; font-family: var(--font-script); font-size: clamp(1.5rem, 1.2rem + 1vw, 2.1rem); color: #a0621f; transform: rotate(-2deg); }
.ab-album { position: relative; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: clamp(26px, 3.4vw, 54px) clamp(16px, 2.2vw, 34px); margin: 0; padding: 0 clamp(0px, 2vw, 30px); list-style: none; }
.ab-album li:not(.ab-stamp) { position: relative; transition: transform .45s cubic-bezier(.2,.8,.2,1), z-index 0s; }
.ab-album li:nth-child(1) { transform: rotate(-3.5deg); } .ab-album li:nth-child(2) { transform: rotate(2.5deg) translateY(14px); } .ab-album li:nth-child(3) { transform: rotate(-1.5deg) translateY(-6px); } .ab-album li:nth-child(4) { transform: rotate(3.5deg) translateY(10px); }
.ab-album li:nth-child(5) { transform: rotate(2.5deg) translateY(6px); } .ab-album li:nth-child(6) { transform: rotate(-3deg); } .ab-album li:nth-child(7) { transform: rotate(1.5deg) translateY(12px); } .ab-album li:nth-child(8) { transform: rotate(-2.5deg) translateY(-4px); }
.ab-album li:not(.ab-stamp):hover { transform: rotate(0) translateY(-10px) scale(1.05); z-index: 3; }
.ab-album li:not(.ab-stamp)::before { content: ""; position: absolute; z-index: 2; left: 50%; top: -13px; width: 92px; height: 28px; margin-left: -46px; background: linear-gradient(90deg, rgba(226,181,102,.78), rgba(241,211,154,.6)); border-left: 1px dashed rgba(255,255,255,.7); border-right: 1px dashed rgba(255,255,255,.7); box-shadow: 0 2px 6px rgba(90,56,14,.18); transform: rotate(-3deg); }
.ab-album li:nth-child(even):not(.ab-stamp)::before { left: 24%; transform: rotate(-22deg); top: -8px; }
.ab-album li:nth-child(3n):not(.ab-stamp)::before { left: 76%; transform: rotate(18deg); top: -8px; }
.ab-album button { display: block; width: 100%; padding: 12px 12px 0; border: 0; border-radius: 4px; background: #fffdf8; box-shadow: 0 18px 38px rgba(90,56,14,.26), 0 2px 4px rgba(90,56,14,.12); cursor: pointer; text-align: center; transition: box-shadow .45s; }
.ab-album li:hover button { box-shadow: 0 32px 60px rgba(90,56,14,.36), 0 2px 4px rgba(90,56,14,.12); }
.ab-album img { display: block; width: 100%; aspect-ratio: 1 / .92; object-fit: cover; border-radius: 2px; filter: saturate(1.05) contrast(1.02); }
.ab-album button span { display: block; padding: 10px 4px 14px; font-family: var(--font-script); font-size: clamp(1.25rem, 1rem + .7vw, 1.6rem); line-height: 1.1; color: #4a3220; }
.ab-stamp { position: absolute; z-index: 2; display: grid; place-items: center; align-content: center; gap: 2px; width: clamp(104px, 9.6vw, 140px); aspect-ratio: 1; border-radius: 50%; border: 3px double #b0431f; color: #b0431f; text-align: center; text-transform: uppercase; opacity: .82; pointer-events: none; mix-blend-mode: multiply; }
.ab-stamp::before { content: ""; position: absolute; inset: 7px; border-radius: 50%; border: 1px dashed #b0431f; }
.ab-stamp span { font-size: .52rem; font-weight: 700; letter-spacing: .14em; max-width: 78%; line-height: 1.2; }
.ab-stamp strong { font: 800 clamp(.9rem, .7rem + .5vw, 1.15rem)/1.05 var(--font-body); letter-spacing: .06em; }
.ab-stamp-a { left: calc(50% - 70px); top: 39%; transform: rotate(-14deg); }
.ab-stamp-b { right: -1.5%; bottom: -5%; transform: rotate(12deg); color: #1c4a6e; border-color: #1c4a6e; }
.ab-stamp-b::before { border-color: #1c4a6e; }
.ab-album-foot { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 16px 30px; margin-top: clamp(40px, 5vw, 70px); }
.ab-album-foot p { margin: 0; font-size: .98rem; color: #5a4630; }
.ab-album-foot strong { margin-right: 4px; font: 700 1.9rem var(--font-display); color: #a0621f; }
.ab-cta { position: relative; padding: clamp(84px, 9.4vw, 146px) 0 clamp(64px, 8vw, 124px); overflow: hidden; color: #fff; background: #2a180d; }
.ab-cta > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.ab-cta > img { object-position: 50% 16%; }
.ab-cta::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(30,15,6,.88) 0, rgba(30,15,6,.55) 42%, rgba(30,15,6,.05) 78%), linear-gradient(0deg, rgba(30,15,6,.45), transparent 45%); }
.ab-cta .container { position: relative; z-index: 1; }
.ab-cta-tear { position: absolute; z-index: 2; left: 0; right: 0; top: -1px; width: 100%; height: clamp(26px, 3.4vw, 50px); filter: drop-shadow(0 8px 10px rgba(30,15,6,.45)); }
.ab-tear-under { fill: #d9c296; }
.ab-tear-top { fill: #f0e0c2; }
.ab-cta h2 { margin: 0 0 10px; color: #fff; }
.ab-cta p { margin: 0 0 24px; font-size: 1.05rem; color: #f1e4cb; }
.ab-cta-actions { display: flex; flex-wrap: wrap; gap: 14px; }
.btn-outline-light { border: 1px solid rgba(255,255,255,.7); background: rgba(0,0,0,.15); color: #fff; }
.btn-outline-light:hover { background: #fff; color: var(--ink); }
@media (max-width: 1100px) {
  .ab-strip { grid-template-columns: repeat(3, minmax(0, 1fr)); row-gap: 20px; }
  .ab-strip li:nth-child(4) { border-left: 0; }
  .ab-values-arch { display: none; }
  .ab-values-head, .ab-values-grid { padding-right: 0; }
  .ab-arcade { grid-template-columns: repeat(3, minmax(0, 1fr)); row-gap: 70px; }
  .ab-arcade::before { display: none; }
  .ab-hero-script { display: none; }
}
@media (max-width: 820px) {
  .ab-who-grid, .ab-why-grid { grid-template-columns: minmax(0, 1fr); }
  .ab-team-script { display: none; }
  .ab-arcade { display: flex; gap: 14px; padding: 22px 4px 26px; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; }
  .ab-arcade::-webkit-scrollbar { display: none; }
  .ab-arcade::before { display: none; }
  .ab-arch, .ab-arch:nth-child(even), .ab-arch:hover, .ab-arch:nth-child(even):hover { flex: 0 0 58%; transform: none; scroll-snap-align: center; }
  .ab-arch-frame img { filter: none; }
  .ab-values-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ab-album { grid-template-columns: repeat(2, minmax(0, 1fr)); padding: 0 4px; }
  .ab-stamp-a { left: calc(50% - 52px); top: 47%; }
  .ab-stamp-b { right: 2%; bottom: -3%; }
  .ab-collage-script { right: auto; left: 10px; bottom: -8px; padding: 8px 14px; border-radius: 14px; background: #fffdf8; box-shadow: var(--shadow-sm); font-size: 1.05rem; }
  .ab-collage-script .icon { width: 28px; height: 28px; }
  .ab-band-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 26px; }
  .ab-band-grid li:nth-child(3) { border-left: 0; }
}
@media (max-width: 520px) {
  .ab-strip { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ab-strip li:nth-child(4) { border-left: 1px solid #e6d2ac; }
  .ab-strip li:nth-child(odd) { border-left: 0; }
  .ab-tiles { grid-template-columns: minmax(0, 1fr); }
  .ab-tile:first-child figcaption { position: relative; border-radius: 0; }
}

/* ---------- Contact Us page ---------- */
.cu-hero { padding-bottom: clamp(90px, 9vw, 150px); }
.cu-hero h1 { max-width: 10.5em; }
.cu-hero h1 span { color: var(--gold-300); }
.cu-faces { display: flex; align-items: center; gap: 22px; margin-top: 24px; }
.cu-faces ul { display: flex; margin: 0; padding: 0; list-style: none; }
.cu-faces li { width: 58px; height: 58px; margin-left: -12px; border-radius: 50%; overflow: hidden; border: 2.5px solid #f6e2b4; box-shadow: 0 6px 16px rgba(0,0,0,.35); }
.cu-faces li:first-child { margin-left: 0; }
.cu-faces img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 18%; }
.cu-faces p { margin: 0; font-family: var(--font-script); font-size: clamp(1.15rem, 1rem + .6vw, 1.5rem); line-height: 1.15; color: #f6e2b4; transform: rotate(-5deg); }
.cu-hero-script { top: 14%; right: auto; left: 56%; }
.cu-lantern-defs { position: absolute; }
.cu-lantern { position: absolute; z-index: 2; display: block; pointer-events: none; transform-origin: 50% 0; animation: cuSway 6s ease-in-out infinite; }
.cu-lantern::before { content: ""; position: absolute; left: 50%; bottom: 100%; width: 2px; margin-left: -1px; background: linear-gradient(180deg, #6b4514, #e9c27a); }
.cu-lantern::after { content: ""; position: absolute; left: 50%; top: 52%; width: 190%; aspect-ratio: 1; transform: translate(-50%, -50%); border-radius: 50%; background: radial-gradient(circle, rgba(255,200,97,.55), rgba(255,200,97,0) 68%); z-index: -1; }
.cu-lantern svg { display: block; width: 100%; height: auto; filter: drop-shadow(0 8px 12px rgba(0,0,0,.45)); }
@keyframes cuSway { 0%, 100% { transform: rotate(-2.200deg); } 50% { transform: rotate(2.200deg); } }
.cu-lantern-a { left: 42%; top: 36px; width: 60px; }
.cu-lantern-a::before { height: 400px; }
.cu-lantern-b { left: 48%; top: -14px; width: 74px; animation-delay: -2.400s; }
.cu-lantern-b::before { height: 400px; }
.cu-lantern-form { right: -38px; top: 74px; width: 70px; animation-duration: 7.500s; }
.cu-lantern-form::before { height: 26px; }
@media (max-width: 1100px) { .cu-lantern { display: none; } }
@media (prefers-reduced-motion: reduce) { .cu-lantern { animation: none; } }
.cu-hero .page-hero-media img { object-position: 88% 50%; }
.cu-main { position: relative; z-index: 2; margin-top: clamp(-110px, -7vw, -60px); padding-bottom: clamp(30px, 4vw, 56px); }
.cu-main-grid { display: grid; grid-template-columns: minmax(0, .92fr) minmax(0, 1.08fr); gap: clamp(20px, 3vw, 44px); align-items: stretch; }
.cu-info { padding: clamp(24px, 3vw, 44px); border-radius: 22px 22px 0 0; background: var(--sand-50); }
.cu-info h2 { margin: 10px 0 16px; font-size: clamp(2rem, 1.5rem + 2vw, 3.1rem); line-height: 1.08; max-width: 7em; }
.cu-info > p:not(.eyebrow) { margin: 0 0 26px; line-height: 1.8; }
.cu-feats { display: grid; grid-template-columns: 1fr 1fr; gap: 22px 0; margin: 0 0 30px; padding: 0; list-style: none; }
.cu-feats li { display: flex; align-items: center; gap: 14px; padding: 2px 18px; font-size: .82rem; line-height: 1.4; color: var(--muted); }
.cu-feats li:nth-child(even) { border-left: 1px solid #e6d2ac; }
.cu-feats li:nth-child(odd) { padding-left: 4px; }
.cu-feats .icon { flex: none; width: 38px; height: 38px; color: #c2562b; stroke-width: 1.2; }
.cu-feats strong { display: block; font-size: .95rem; color: var(--ink); }
.cu-rows { display: grid; gap: 12px; margin: 0; padding: 0; list-style: none; }
.cu-rows a { display: grid; grid-template-columns: 56px minmax(0, 1fr) 20px; align-items: center; gap: 18px; padding: 14px 18px; border-radius: 14px; background: #fff; border: 1px solid var(--sand-200); box-shadow: var(--shadow-sm); transition: transform .3s, box-shadow .3s, border-color .3s; }
.cu-rows a:hover { transform: translateX(5px); border-color: var(--gold); box-shadow: var(--shadow); }
.cu-row-icon { display: grid; place-items: center; width: 56px; height: 56px; border-radius: 50%; color: #fff; }
.cu-row-icon .icon { width: 26px; height: 26px; stroke-width: 1.6; }
.cu-row-wa { background: #22b455; } .cu-row-mail { background: #1f7ab8; } .cu-row-pin { background: #d0402c; } .cu-row-clock { background: #b9772c; }
.cu-rows small { display: block; font-size: .9rem; color: var(--ink); }
.cu-rows strong { display: block; font-size: .9rem; color: var(--ink); overflow-wrap: anywhere; }
.cu-rows em { display: block; font-style: normal; font-size: .8rem; color: var(--muted); }
.cu-rows a > .icon { width: 18px; height: 18px; color: var(--gold-600); }
.cu-next { margin-top: 26px; padding: clamp(20px, 2.4vw, 30px); border-radius: 18px; background: linear-gradient(160deg, #fffdf8, #f7ecd8); border: 1px solid #e6d2ac; box-shadow: var(--shadow-sm); }
.cu-next h3 { margin: 8px 0 20px; font: 700 clamp(1.25rem, 1.05rem + .8vw, 1.6rem)/1.25 var(--font-display); color: var(--ink); }
.cu-steps { position: relative; display: grid; gap: 18px; margin: 0 0 22px; padding: 0; list-style: none; }
.cu-steps::before { content: ""; position: absolute; left: 19px; top: 20px; bottom: 20px; border-left: 2px dotted #d9c39b; }
.cu-steps li { position: relative; display: grid; grid-template-columns: 40px minmax(0, 1fr); gap: 16px; align-items: start; font-size: .88rem; line-height: 1.6; color: #4d4a44; }
.cu-steps li > span { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 50%; background: linear-gradient(135deg, #d39a4a, #a66e22); color: #fff; font: 700 1rem var(--font-display); box-shadow: 0 0 0 5px #fbf4e6; }
.cu-steps strong { display: block; font-size: .98rem; color: var(--ink); }
.cu-langs { display: flex; align-items: center; gap: 14px; margin: 0; padding: 14px 16px; border-radius: 12px; background: linear-gradient(135deg, #1c2f47, #0f1e31); color: #cfd8e3; font-size: .84rem; line-height: 1.45; }
.cu-langs .icon { flex: none; width: 30px; height: 30px; color: #e6bd6f; stroke-width: 1.3; }
.cu-langs strong { display: block; font-size: .95rem; color: #fff; }
.cu-side { display: flex; flex-direction: column; gap: 16px; }
.cu-side .cu-quote { flex: 1 1 auto; }
.cu-form { position: relative; padding: clamp(24px, 3vw, 44px); border-radius: 18px; color: #dfece6; background: repeating-linear-gradient(45deg, rgba(255,255,255,.02) 0 1px, transparent 1px 26px), repeating-linear-gradient(-45deg, rgba(255,255,255,.02) 0 1px, transparent 1px 26px), linear-gradient(160deg, #123b35, #0b2b27); box-shadow: 0 30px 70px rgba(10,30,26,.4); }
.cu-form h2 { margin: 8px 0 10px; color: #fff; }
.cu-form > p:not(.eyebrow):not(.cu-safe) { margin: 0 0 22px; line-height: 1.7; color: #c9dbd3; }
.cu-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 16px 20px; }
.cu-fields label { display: grid; gap: 8px; font-size: .86rem; font-weight: 600; color: #fff; }
.cu-fields label b { color: #e2623c; }
.cu-wide { grid-column: 1 / -1; }
.cu-hint { font-size: .76rem; font-weight: 400; line-height: 1.5; color: #b9cfc6; }
.cu-fields input, .cu-fields select, .cu-fields textarea { width: 100%; min-height: 48px; padding: 12px 16px; border: 1px solid transparent; border-radius: 8px; background: #fff; color: var(--ink); font: 400 .92rem var(--font-body); transition: border-color .2s, box-shadow .2s; }
.cu-fields textarea { resize: vertical; min-height: 120px; }
.cu-fields input:focus, .cu-fields select:focus, .cu-fields textarea:focus { outline: 0; border-color: #e2b566; box-shadow: 0 0 0 3px rgba(226,181,102,.35); }
.cu-phone { display: grid; grid-template-columns: 112px minmax(0, 1fr); }
.cu-phone select { border-radius: 8px 0 0 8px; background: #f3efe6; padding-inline: 10px 4px; }
.cu-phone input { border-radius: 0 8px 8px 0; }
.cu-captcha { display: grid; grid-template-columns: 46px minmax(0, 1fr) 110px 46px; align-items: center; gap: 14px; margin-top: 18px; padding: 12px 14px; border-radius: 12px; background: rgba(255,255,255,.07); border: 1px solid rgba(226,181,102,.4); }
.cu-captcha-icon { display: grid; place-items: center; width: 46px; height: 46px; border-radius: 50%; background: rgba(226,181,102,.16); color: #e6bd6f; }
.cu-captcha-icon .icon { width: 24px; height: 24px; }
.cu-captcha label { font-size: 1rem; font-weight: 600; color: #fff; }
.cu-captcha label small { display: block; font-size: .66rem; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; color: #e6bd6f; }
.cu-captcha label b { padding: 2px 10px; border-radius: 6px; background: rgba(0,0,0,.25); font: 700 1.15rem var(--font-display); letter-spacing: .06em; color: #f1d39a; }
.cu-captcha input { width: 100%; min-height: 46px; padding: 10px 12px; border: 1px solid transparent; border-radius: 8px; background: #fff; color: var(--ink); font: 600 1rem var(--font-body); text-align: center; }
.cu-captcha input:focus { outline: 0; border-color: #e2b566; box-shadow: 0 0 0 3px rgba(226,181,102,.35); }
.cu-captcha.is-wrong input { border-color: #e2623c; box-shadow: 0 0 0 3px rgba(226,98,60,.35); }
.cu-captcha-new { display: grid; place-items: center; width: 46px; height: 46px; border: 1px solid rgba(226,181,102,.5); border-radius: 50%; background: none; color: #e6bd6f; cursor: pointer; transition: background .25s, transform .4s; }
.cu-captcha-new:hover { background: rgba(226,181,102,.16); transform: rotate(180deg); }
.cu-captcha-new .icon { width: 20px; height: 20px; }
.cu-captcha-error { grid-column: 1 / -1; margin: 0; font-size: .84rem; font-weight: 600; color: #ffb49c; }
.cu-trap { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.cu-send { width: 100%; margin-top: 20px; min-height: 54px; justify-content: center; }
.cu-safe { display: flex; align-items: center; justify-content: center; gap: 10px; margin: 18px 0 0; font-size: .82rem; color: #c9dbd3; }
.cu-safe .icon { width: 18px; height: 18px; color: #e2b566; }
.cu-quote { position: relative; display: flex; align-items: flex-end; min-height: 440px; margin: 0; border-radius: 999px 999px 20px 20px / 300px 300px 20px 20px; overflow: hidden; background: #2a180d; box-shadow: 0 30px 70px rgba(60,34,12,.32); isolation: isolate; }
.cu-quote > img { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; object-fit: cover; transition: transform 1.2s ease; }
.cu-quote:hover > img { transform: scale(1.05); }
.cu-quote::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgba(20,10,4,.05) 0, rgba(20,10,4,.15) 38%, rgba(20,10,4,.86) 78%, rgba(20,10,4,.94) 100%); }
.cu-quote-frame { position: absolute; inset: 12px; border: 1.5px solid rgba(241,211,154,.75); border-radius: 999px 999px 12px 12px / 290px 290px 12px 12px; pointer-events: none; }
.cu-quote-frame::after { content: ""; position: absolute; inset: 7px; border: 1px dashed rgba(241,211,154,.4); border-radius: inherit; }
.cu-quote-seal { position: absolute; left: 50%; top: 34px; display: grid; place-items: center; width: 54px; height: 54px; margin-left: -27px; border-radius: 50%; background: linear-gradient(135deg, #e6bd6f, #a66e22); color: #fff; box-shadow: 0 0 0 5px rgba(255,253,248,.28), 0 10px 22px rgba(0,0,0,.35); }
.cu-quote-seal .icon { width: 24px; height: 24px; }
.cu-quote blockquote { position: relative; width: 100%; margin: 0; padding: clamp(30px, 3.4vw, 46px) clamp(30px, 3.6vw, 52px) clamp(32px, 3.4vw, 44px); text-align: center; }
.cu-quote blockquote::before { content: "“"; display: block; height: 44px; font: 700 5.4rem/1 var(--font-display); color: #e6bd6f; }
.cu-quote p { margin: 0 0 22px; font: 600 clamp(1.3rem, 1.05rem + 1.1vw, 1.9rem)/1.3 var(--font-display); color: #fff; text-shadow: 0 2px 14px rgba(0,0,0,.5); }
.cu-quote p em { display: block; font-style: italic; color: #f1d39a; }
.cu-quote footer { display: inline-flex; align-items: center; gap: 16px; padding: 8px 22px 8px 8px; border-radius: 999px; background: rgba(20,10,4,.6); border: 1px solid rgba(241,211,154,.5); font-size: .76rem; color: #e7dcc6; text-align: left; }
.cu-quote-faces { display: flex; }
.cu-quote-faces img { position: static; width: 38px; height: 38px; margin-left: -10px; border-radius: 50%; border: 2px solid #f6e2b4; object-fit: cover; object-position: 50% 18%; }
.cu-quote-faces img:first-child { margin-left: 0; }
.cu-quote-sign b { display: block; font: 400 1.35rem/1 var(--font-script); color: #fff; }
.cu-visit { padding: clamp(10px, 2vw, 30px) 0 clamp(34px, 4vw, 60px); }
.cu-visit-grid { display: grid; grid-template-columns: minmax(0, 3fr) minmax(0, 1fr); gap: clamp(16px, 2vw, 28px); align-items: stretch; }
.cu-map-card { position: relative; display: grid; grid-template-columns: minmax(0, .78fr) minmax(0, 1.22fr); min-height: 470px; border-radius: 22px; overflow: hidden; color: #f1e4cb; border: 1px solid rgba(226,181,102,.4); box-shadow: 0 30px 70px rgba(30,20,10,.35);
  background: radial-gradient(60% 80% at 0 0, rgba(226,181,102,.16), transparent 70%), linear-gradient(100deg, #2b1c10 0, #3a2816 36%, #123a47 64%, #0d2f3b 100%); }
.cu-map-card::after { content: ""; position: absolute; inset: 10px; border-radius: 14px; border: 1px solid rgba(226,181,102,.28); pointer-events: none; }
.cu-map-text { position: relative; z-index: 2; align-self: center; padding: clamp(26px, 3.4vw, 54px); }
.cu-map-text h2 { margin: 8px 0 12px; color: #fff; }
.cu-map-text p:not(.eyebrow) { margin: 0 0 20px; line-height: 1.7; }
.cu-map-facts { display: flex; gap: 0; margin: 0 0 24px; padding: 0; list-style: none; font-size: .7rem; letter-spacing: .12em; text-transform: uppercase; color: #c9b993; }
.cu-map-facts li { padding-right: 22px; }
.cu-map-facts li + li { padding-left: 22px; border-left: 1px solid rgba(226,181,102,.35); }
.cu-map-facts strong { display: block; font: 700 2rem/1.1 var(--font-display); letter-spacing: 0; color: #f1d39a; }
.cu-map-art { position: relative; min-height: 470px; overflow: hidden; }
.cu-map-art::before { content: ""; position: absolute; inset: 0; z-index: 1; background: linear-gradient(90deg, #3a2816 0, rgba(58,40,22,0) 24%); pointer-events: none; }
.cu-map-box { position: absolute; top: 46px; bottom: 30px; left: 50%; aspect-ratio: 330 / 300; transform: translateX(-55%); }
.cu-map-inner { position: absolute; left: -65.15%; top: -6.67%; width: 181.8%; aspect-ratio: 600 / 650; filter: drop-shadow(0 16px 26px rgba(0,0,0,.45)); }
.cu-map-inner .map-routes, .cu-map-inner .map-labels, .cu-map-inner .map-towns, .cu-map-inner .map-edge, .cu-map-inner rect { display: none; }
.cu-map-inner g[filter="url(#map-shadow)"] { filter: none; }
.cu-map-inner .map-land { fill: #f0d9ae; stroke: #c8963f; stroke-width: 1.6; }
.cu-map-inner .map-mountains path, .cu-map-inner .map-dunes path { stroke: #b88a4c; opacity: .8; }
.cu-map-inner .map-waves path { stroke: rgba(170,215,225,.45); }
.cu-map-inner .map-compass { opacity: .9; }
.cu-map-route { position: absolute; inset: 0; z-index: 1; width: 100%; height: 100%; overflow: visible; pointer-events: none; }
.cu-route-glow { fill: none; stroke: rgba(194,86,43,.22); stroke-width: 7; stroke-linecap: round; vector-effect: non-scaling-stroke; }
.cu-route-line { fill: none; stroke: #b8431f; stroke-width: 2.2; stroke-dasharray: 1 7; stroke-linecap: round; vector-effect: non-scaling-stroke; animation: tour-route 1.6s linear infinite; }
.cu-route-dot { fill: #fff; stroke: #b8431f; stroke-width: 2; vector-effect: non-scaling-stroke; }
.cu-pin { position: absolute; z-index: 2; width: 0; height: 0; color: inherit; }
.cu-pin::before { content: ""; position: absolute; left: -13px; top: -13px; width: 26px; height: 26px; border-radius: 50%; background: rgba(224,98,58,.35); animation: cuPulse 2.6s ease-out infinite; }
.cu-pin:nth-of-type(even)::before { animation-delay: 1.3s; }
@keyframes cuPulse { from { transform: scale(.3); opacity: .9; } to { transform: scale(1.5); opacity: 0; } }
.cu-pin i { position: absolute; left: -11px; top: -29px; width: 22px; height: 22px; border-radius: 50% 50% 50% 0; background: linear-gradient(135deg, #ec7447, #b8431f); transform: rotate(-45deg); box-shadow: 0 4px 10px rgba(60,20,5,.5); transition: transform .3s; }
.cu-pin i::after { content: ""; position: absolute; inset: 6px; border-radius: 50%; background: #fff; }
.cu-pin:hover { z-index: 3; }
.cu-pin:hover i { transform: rotate(-45deg) translate(3px, -3px) scale(1.15); }
.cu-pin b { position: absolute; top: -34px; padding: 6px 14px 7px; border-radius: 12px; background: #fffdf8; border: 1px solid #ead9b8; color: #2b1b0e; font-size: .8rem; font-weight: 700; line-height: 1.2; white-space: nowrap; box-shadow: 0 10px 22px rgba(0,0,0,.35); transition: background .25s, color .25s, transform .25s, border-color .25s; }
.cu-pin b small { display: block; font-size: .64rem; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: #a66e22; transition: color .25s; }
.cu-pin:hover b { background: linear-gradient(135deg, #dba854, #a66e22); border-color: #a66e22; color: #fff; transform: translateY(-3px); }
.cu-pin:hover b small { color: #fff3d6; }
.cu-pin-r b { left: 18px; } .cu-pin-l b { right: 18px; } .cu-pin-b b { left: 0; top: 8px; transform: translateX(-50%); }
.cu-pin-b:hover b { transform: translate(-50%, 3px); }
.cu-map-legend { position: absolute; z-index: 2; right: 26px; bottom: 22px; display: flex; align-items: center; gap: 10px; margin: 0; font-size: .7rem; letter-spacing: .1em; text-transform: uppercase; color: #cfe3e8; }
.cu-map-legend span { width: 34px; border-top: 2px dotted #ec7447; }
.cu-chat { display: flex; flex-direction: column; justify-content: center; padding: clamp(22px, 2.4vw, 32px); border-radius: 18px; background: #fffdf8; border: 1px solid var(--sand-200); box-shadow: var(--shadow-sm); }
.cu-chat h2 { margin: 8px 0 10px; font-size: clamp(1.4rem, 1.1rem + 1vw, 1.9rem); }
.cu-chat p:not(.eyebrow) { margin: 0 0 20px; font-size: .92rem; line-height: 1.65; }
.cu-chat a { display: flex; align-items: center; justify-content: center; gap: 14px; min-height: 52px; padding: 10px 16px; border-radius: 8px; font-weight: 600; transition: transform .25s, box-shadow .25s; }
.cu-chat a:hover { transform: translateY(-2px); box-shadow: var(--shadow); }
.cu-chat a .icon { width: 24px; height: 24px; }
.cu-chat-wa { margin-bottom: 12px; background: #128c3f; color: #fff; }
.cu-chat-mail { background: #fff; border: 1px solid var(--sand-200); color: var(--ink); }
.cu-cta { position: relative; padding: clamp(86px, 8.6vw, 130px) 0 clamp(54px, 6vw, 86px); overflow: hidden; color: #fff; background: #0d1626; }
.cu-cta > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50% 100%; }
.cu-cta::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(8,14,30,.82) 0, rgba(8,14,30,.4) 42%, rgba(8,14,30,0) 76%), linear-gradient(0deg, rgba(8,14,30,.62) 0, transparent 44%); }
.cu-cta::before { content: ""; position: absolute; z-index: 2; left: 0; right: 0; top: 0; height: 26px; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='48' height='26' viewBox='0 0 48 26'%3E%3Crect width='48' height='26' fill='%2314476b'/%3E%3Cpath d='M24 3l10 10-10 10-10-10z' fill='none' stroke='%23f4ead6' stroke-width='1.6'/%3E%3Cpath d='M24 8.500l4.500 4.500-4.500 4.500-4.500-4.500z' fill='%23e2b566'/%3E%3Cpath d='M0 3l10 10-10 10M48 3l-10 10 10 10' fill='none' stroke='%23f4ead6' stroke-width='1.6'/%3E%3Ccircle cx='0' cy='13' r='2.600' fill='%23d0552c'/%3E%3Ccircle cx='48' cy='13' r='2.600' fill='%23d0552c'/%3E%3Ccircle cx='12' cy='4' r='1.300' fill='%23e2b566'/%3E%3Ccircle cx='36' cy='4' r='1.300' fill='%23e2b566'/%3E%3Ccircle cx='12' cy='22' r='1.300' fill='%23e2b566'/%3E%3Ccircle cx='36' cy='22' r='1.300' fill='%23e2b566'/%3E%3C/svg%3E") 50% 0 / 48px 26px repeat-x; border-top: 3px solid #d6aa62; border-bottom: 3px solid #d6aa62; box-sizing: content-box; box-shadow: 0 10px 22px rgba(0,0,0,.4); }
.cu-cta-crown { position: absolute; z-index: 3; left: 50%; top: 8px; width: 54px; height: 54px; margin-left: -27px; border-radius: 50%; background: #14476b; border: 3px solid #d6aa62; box-shadow: 0 0 0 4px #f4ead6, 0 0 0 6px #d6aa62, 0 12px 24px rgba(0,0,0,.45); }
.cu-cta-crown::before, .cu-cta-crown i { content: ""; position: absolute; left: 50%; top: 50%; width: 22px; height: 22px; margin: -11px 0 0 -11px; background: linear-gradient(135deg, #f1d39a, #c8963f); }
.cu-cta-crown::before { transform: rotate(45deg); }
.cu-cta-crown::after { content: ""; position: absolute; left: 50%; top: 50%; z-index: 1; width: 8px; height: 8px; margin: -4px 0 0 -4px; border-radius: 50%; background: #14476b; }
.cu-cta-grid { position: relative; z-index: 1; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr); gap: clamp(24px, 4vw, 60px); align-items: end; }
.cu-cta h2 { margin: 8px 0 12px; color: #fff; }
.cu-cta p:not(.eyebrow) { margin: 0 0 24px; line-height: 1.7; color: #f1e4cb; }
.cu-cta-points { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin: 0; padding: 0; list-style: none; text-align: center; font-size: .86rem; font-weight: 600; }
.cu-cta-points li { display: grid; justify-items: center; gap: 12px; }
.cu-cta-points { transform: translateY(26px); }
.cu-cta-points li { text-shadow: 0 2px 8px rgba(0,0,0,.75); }
.cu-cta-points .icon { filter: drop-shadow(0 2px 6px rgba(0,0,0,.7)); }
.cu-cta-points .icon { width: 40px; height: 40px; color: #fff; stroke-width: 1.2; }
@media (max-width: 1000px) {
  .cu-main-grid, .cu-visit-grid, .cu-cta-grid { grid-template-columns: minmax(0, 1fr); }
  .cu-info { border-radius: 22px; }
}
@media (max-width: 640px) {
  .cu-fields, .cu-feats, .cu-map-card { grid-template-columns: minmax(0, 1fr); }
  .cu-quote { border-radius: 999px 999px 18px 18px / 200px 200px 18px 18px; }
  .cu-quote-frame { border-radius: 999px 999px 10px 10px / 190px 190px 10px 10px; }
  .cu-captcha { grid-template-columns: minmax(0, 1fr) 84px 44px; }
  .cu-captcha-icon { display: none; }
  .cu-feats li, .cu-feats li:nth-child(even) { padding: 0; border: 0; }
  .cu-rows a { grid-template-columns: 48px minmax(0, 1fr) 16px; gap: 12px; padding: 12px; }
  .cu-row-icon { width: 48px; height: 48px; }
  .cu-map-card { background: linear-gradient(180deg, #2b1c10 0, #3a2816 38%, #123a47 62%, #0d2f3b 100%); }
  .cu-map-art { min-height: 400px; }
  .cu-map-art::before { background: linear-gradient(180deg, #3a2816 0, rgba(58,40,22,0) 14%); }
  .cu-map-box { top: 50px; bottom: 44px; }
  .cu-pin b { padding: 4px 9px 5px; font-size: .68rem; }
  .cu-pin b small { font-size: .56rem; }
  .cu-cta-points { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 22px; }
  .cu-faces li { width: 46px; height: 46px; }
}

/* ---------- Blog page ---------- */
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.bl-hero { padding-bottom: clamp(70px, 7vw, 110px); }
.bl-hero h1 { max-width: 9em; font-size: clamp(2.6rem, 1.6rem + 4vw, 4.6rem); line-height: 1.05; }
.bl-hero h1 span { color: var(--gold-300); white-space: nowrap; }
.bl-search { position: relative; display: block; max-width: 560px; margin-top: 26px; }
.bl-search input { width: 100%; min-height: 62px; padding: 0 76px 0 30px; border: 0; border-radius: 999px; background: #fff; color: var(--ink); font: 400 1rem var(--font-body); box-shadow: 0 18px 40px rgba(0,0,0,.35); }
.bl-search input:focus { outline: 3px solid rgba(226,181,102,.6); }
.bl-search-btn { position: absolute; right: 7px; top: 7px; display: grid; place-items: center; width: 48px; height: 48px; border-radius: 50%; background: linear-gradient(135deg, #d39a4a, #a66e22); color: #fff; pointer-events: none; }
.bl-search-btn .icon { width: 20px; height: 20px; }
.bl-feats { display: flex; flex-wrap: wrap; gap: 18px 0; margin: 30px 0 0; padding: 0; list-style: none; font-size: .8rem; color: #e7dcc6; }
.bl-feats li { display: flex; align-items: center; gap: 14px; padding: 0 clamp(14px, 2.4vw, 34px); border-left: 1px solid rgba(255,255,255,.2); line-height: 1.35; }
.bl-feats li:first-child { padding-left: 0; border-left: 0; }
.bl-feats .icon { flex: none; width: 34px; height: 34px; color: #e6bd6f; stroke-width: 1.3; }
.bl-feats strong { display: block; font-size: .95rem; color: #fff; }
.bl-feats { text-shadow: 0 1px 6px rgba(0,0,0,.85); }
.bl-feats .icon { filter: drop-shadow(0 1px 4px rgba(0,0,0,.7)); }
.bl-feats { width: fit-content; max-width: 100%; padding: 14px 22px; border-radius: 16px; background: rgba(24,12,6,.62); border: 1px solid rgba(226,181,102,.3); }
.bl-hero-script { top: 14%; }
.bl-cats { position: relative; z-index: 2; display: flex; gap: 6px; margin: -44px 0 0; padding: 22px clamp(14px, 3vw, 40px); list-style: none; border-radius: 24px; background: #fff; box-shadow: var(--shadow); overflow-x: auto; scrollbar-width: none; }
.bl-cats::-webkit-scrollbar { display: none; }
.bl-cats li { flex: 1 0 118px; }
.bl-cat { display: grid; justify-items: center; gap: 10px; width: 100%; height: 100%; padding: 10px 6px 12px; border: 0; border-radius: 14px; background: none; color: var(--ink); font: 600 .84rem/1.3 var(--font-body); text-align: center; cursor: pointer; transition: background .25s, color .25s, transform .25s; }
.bl-cat img, .bl-cat > span { width: 58px; height: 58px; border-radius: 50%; object-fit: cover; box-shadow: 0 0 0 2px #fff, 0 0 0 3.5px rgba(214,170,98,.6); transition: transform .3s; }
.bl-cat > span { display: grid; place-items: center; background: rgba(255,255,255,.22); box-shadow: none; }
.bl-cat > span .icon { width: 30px; height: 30px; }
.bl-cat:hover img { transform: scale(1.08); }
.bl-cat:hover { color: var(--gold-600); }
.bl-cat.is-active { background: linear-gradient(135deg, #d39a4a, #a66e22); color: #fff; box-shadow: 0 12px 24px rgba(166,110,34,.3); }
.bl-cat-all:not(.is-active) > span { background: var(--sand-100); color: var(--gold-600); }
.bl-featured-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(26px, 4vw, 64px); align-items: center; }
.bl-featured h2 { margin: 12px 0 18px; font-size: clamp(2rem, 1.4rem + 2.4vw, 3.3rem); line-height: 1.1; }
.bl-featured p:not(.eyebrow) { margin: 0 0 26px; max-width: 34em; font-size: 1.05rem; line-height: 1.75; }
.bl-featured-media { position: relative; display: block; border-radius: 18px; overflow: hidden; box-shadow: var(--shadow); }
.bl-featured-media > img { display: block; width: 100%; aspect-ratio: 16 / 9.4; object-fit: cover; transition: transform .8s; }
.bl-featured-media:hover > img { transform: scale(1.04); }
.bl-tag { position: absolute; left: 16px; top: 16px; padding: 7px 14px; border-radius: 6px; background: rgba(255,253,248,.95); color: #6b4514; font-size: .66rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; box-shadow: 0 4px 10px rgba(0,0,0,.15); }
.bl-featured-media .bl-tag { top: auto; bottom: 18px; }
.bl-featured-panel { position: absolute; right: clamp(14px, 3vw, 44px); top: 0; display: grid; gap: 10px; width: min(44%, 230px); padding: 24px 22px 26px; border-radius: 0 0 14px 14px; background: rgba(246,233,207,.94); color: #5a3c16; font-size: .88rem; box-shadow: 0 16px 34px rgba(0,0,0,.25); }
.bl-featured-panel strong { font: 700 clamp(2.2rem, 1.6rem + 2vw, 3.2rem)/1 var(--font-display); color: #a0521f; }
.bl-featured-panel em { padding-bottom: 12px; border-bottom: 1px solid #c8963f; font-style: normal; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: #a0521f; }
.bl-featured-panel span { display: flex; align-items: center; gap: 10px; }
.bl-featured-panel .icon { width: 18px; height: 18px; padding: 3px; border-radius: 50%; border: 1.5px solid #c2562b; color: #c2562b; }
.bl-list { padding: clamp(10px, 2vw, 30px) 0 clamp(40px, 5vw, 70px); scroll-margin-top: calc(var(--header-h) + 10px); }
.bl-list-head { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-bottom: 22px; }
.bl-list-head .eyebrow { margin: 0; }
.bl-list-head a, .bl-list-head button { display: inline-flex; align-items: center; gap: 8px; padding: 0; border: 0; background: none; font: 600 .9rem var(--font-body); color: var(--gold-600); cursor: pointer; }
.bl-list-head .icon { width: 16px; height: 16px; transition: transform .2s; }
.bl-list-head a:hover .icon, .bl-list-head button:hover .icon { transform: translateX(4px); }
.bl-grid { display: grid; gap: clamp(14px, 1.8vw, 24px); }
.bl-grid-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.bl-grid-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.bl-card { display: flex; flex-direction: column; border-radius: 12px; overflow: hidden; background: #fff; border: 1px solid var(--sand-200); box-shadow: var(--shadow-sm); transition: transform .3s, box-shadow .3s; }
.bl-card:hover { transform: translateY(-6px); box-shadow: var(--shadow); }
.bl-card[hidden] { display: none; }
.bl-card-media { position: relative; display: block; overflow: hidden; }
.bl-card-media img { display: block; width: 100%; aspect-ratio: 4 / 2.9; object-fit: cover; transition: transform .7s; }
.bl-grid-3 .bl-card-media img { aspect-ratio: 16 / 9.8; }
.bl-card:hover .bl-card-media img { transform: scale(1.06); }
.bl-card-body { display: flex; flex-direction: column; flex: 1; padding: 20px 22px 18px; }
.bl-card h3 { margin: 0 0 12px; font: 700 1.12rem/1.35 var(--font-body); color: var(--ink); }
.bl-grid-3 .bl-card h3 { font-size: 1.25rem; }
.bl-card h3 a:hover { color: var(--gold-600); }
.bl-card p { margin: 0 0 18px; font-size: .9rem; line-height: 1.65; color: var(--muted); }
.bl-card-foot { display: flex; align-items: center; gap: 18px; margin-top: auto; font-size: .8rem; color: var(--muted); }
.bl-card-foot .round-link { margin-left: auto; }
.bl-soon { font-weight: 600; color: #c2562b; }
.bl-dest { padding-top: 0; }
.bl-dest-count { font-size: .86rem; font-weight: 600; color: var(--muted); }
.bl-more { margin-top: clamp(14px, 1.8vw, 24px); }
.bl-more[hidden] { display: none; }
.bl-more-wrap { margin: 28px 0 0; text-align: center; }
.bl-more-wrap .icon { width: 16px; height: 16px; }
.bl-empty { margin: 24px 0 0; padding: 22px; border-radius: 14px; background: var(--sand-100); text-align: center; color: var(--muted); }
.bl-stories { position: relative; display: flex; align-items: center; min-height: clamp(580px, 52vw, 760px); margin-bottom: clamp(30px, 4vw, 56px); padding: clamp(84px, 8vw, 120px) 0; overflow: hidden; color: #efe2cb; background: #24140b; isolation: isolate; }
.bl-stories::before { content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none; background: linear-gradient(90deg, #24140b 0, rgba(36,20,11,.94) 26%, rgba(36,20,11,.3) 52%, rgba(36,20,11,0) 70%), linear-gradient(180deg, #24140b 0, transparent 14%, transparent 86%, #24140b 100%); }
.bl-stories::after { content: ""; position: absolute; z-index: 1; left: 0; right: 0; top: 0; height: 3px; background: linear-gradient(90deg, transparent, #d6aa62 30%, #f1d39a 50%, #d6aa62 70%, transparent); }
.bl-stories::after { display: none; }
.bl-stories-dunes { position: absolute; z-index: 3; left: 0; right: 0; width: 100%; height: clamp(60px, 7.600vw, 112px); pointer-events: none; }
.bl-stories-dunes-base { bottom: -1px; }
.bl-stories-dunes-top { top: -1px; transform: rotate(180deg); }
.bl-dune-back { fill: rgba(232,196,138,.28); }
.bl-dune-mid { fill: rgba(246,228,196,.5); }
.bl-dune-front { fill: var(--sand-50); }
.bl-wall { position: absolute; inset: -30% -12% -30% 16%; z-index: 0; display: grid; align-content: center; transform: rotate(-9deg); }
.bl-wall-inner { display: grid; gap: clamp(14px, 1.7vw, 24px); }
.bl-wall ul { display: flex; gap: clamp(14px, 1.7vw, 24px); width: max-content; margin: 0; padding: 0; list-style: none; }
.bl-wall ul:nth-child(1) { transform: translateX(-6%); } .bl-wall ul:nth-child(2) { transform: translateX(-14%); } .bl-wall ul:nth-child(3) { transform: translateX(-2%); }
.bl-wall li { flex: none; width: clamp(230px, 22vw, 340px); padding: 7px; border-radius: 22px; background: linear-gradient(160deg, #f3dcab, #c8963f 55%, #8f6220); box-shadow: 0 22px 44px rgba(0,0,0,.5); }
.bl-wall img { display: block; width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 16px; }
.bl-stories .container { position: relative; z-index: 2; }
.bl-stories-card { position: relative; max-width: 500px; padding: clamp(26px, 3vw, 44px); border-radius: 26px; background: linear-gradient(160deg, rgba(60,36,18,.82), rgba(36,20,11,.86)); border: 1px solid rgba(226,181,102,.5); box-shadow: 0 40px 90px rgba(0,0,0,.55), inset 0 1px 0 rgba(255,255,255,.1); }
.bl-stories-card::before { content: ""; position: absolute; left: 26px; top: -1px; width: 86px; height: 3px; border-radius: 3px; background: linear-gradient(90deg, #e6bd6f, #b17a28); }
.bl-stories-card h2 { margin: 10px 0 14px; color: #fff; font-size: clamp(2rem, 1.4rem + 2.2vw, 3.1rem); line-height: 1.08; }
.bl-stories-card h2 span { display: block; font-size: .62em; font-style: italic; color: #e6bd6f; margin-top: 6px; }
.bl-stories-card > p:not(.eyebrow):not(.bl-stories-script) { margin: 0 0 22px; line-height: 1.75; color: #dccfb6; }
.bl-stories-marks { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin: 0 0 26px; padding: 16px 0; list-style: none; border-top: 1px solid rgba(226,181,102,.3); border-bottom: 1px solid rgba(226,181,102,.3); font-size: .72rem; line-height: 1.4; color: #c9b993; }
.bl-stories-marks li { padding: 0 12px; }
.bl-stories-marks li:first-child { padding-left: 0; }
.bl-stories-marks li + li { border-left: 1px solid rgba(226,181,102,.25); }
.bl-stories-marks strong { display: block; margin-bottom: 2px; font: 700 1.15rem var(--font-display); color: #f1d39a; }
.bl-stories-script { position: absolute; right: -8px; bottom: -22px; margin: 0; padding: 8px 18px; border-radius: 999px; background: linear-gradient(135deg, #e6bd6f, #b17a28); font-family: var(--font-script); font-size: 1.25rem; color: #fff; transform: rotate(-4deg); box-shadow: 0 12px 26px rgba(0,0,0,.4); white-space: nowrap; }
.bl-quote { position: relative; padding: clamp(50px, 6vw, 90px) 0; overflow: hidden; color: #fff; background: #24120a; }
.bl-quote > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50% 30%; }
.bl-quote::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(30,14,5,.82) 0, rgba(30,14,5,.45) 55%, rgba(30,14,5,.05) 100%); }
.bl-quote .container { position: relative; z-index: 1; padding-left: calc(var(--gutter) + 44px); }
.bl-quote .container::before { content: "“"; position: absolute; left: var(--gutter); top: -14px; font: 700 4.6rem/1 var(--font-display); color: #e6bd6f; }
.bl-quote p { margin: 0 0 16px; max-width: 26em; font: 500 clamp(1.25rem, 1rem + 1.2vw, 1.85rem)/1.4 var(--font-display); }
.bl-quote span { font-size: .95rem; color: #f1e4cb; }
.bl-news { position: relative; z-index: 1; margin-top: -18px; padding: clamp(30px, 4vw, 54px) 0; border-radius: 22px 22px 0 0; background: repeating-linear-gradient(45deg, rgba(166,110,34,.03) 0 1px, transparent 1px 24px), var(--sand-50); }
.bl-news-grid { display: grid; grid-template-columns: auto minmax(0, 1.2fr) minmax(0, 1fr); gap: clamp(18px, 2.6vw, 40px); align-items: center; }
.bl-news-icon { display: grid; place-items: center; width: 92px; height: 92px; border-radius: 50%; background: #f6e6cd; color: #c2562b; }
.bl-news-icon .icon { width: 44px; height: 44px; stroke-width: 1.2; }
.bl-news h2 { margin: 6px 0 8px; font-size: clamp(1.5rem, 1.2rem + 1.2vw, 2.1rem); }
.bl-news p:not(.eyebrow) { margin: 0; line-height: 1.65; }
.bl-news-form { display: flex; padding: 6px; border-radius: 999px; background: #fff; border: 1px solid var(--sand-200); box-shadow: var(--shadow-sm); }
.bl-news-form input[type="email"] { flex: 1; min-width: 0; padding: 0 22px; border: 0; background: none; font: 400 .95rem var(--font-body); color: var(--ink); }
.bl-news-form input[type="email"]:focus { outline: 0; }
.bl-news-form .btn { border-radius: 999px; }
.bl-places { padding: clamp(30px, 4vw, 60px) 0 clamp(70px, 8vw, 120px); }
.bl-places-head { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: end; gap: 4px 20px; margin-bottom: clamp(30px, 4vw, 54px); }
.bl-places-head .eyebrow { grid-column: 1 / -1; margin: 0; }
.bl-places-head h2 { margin: 8px 0 0; }
.bl-places-head a { display: inline-flex; align-items: center; gap: 8px; padding-bottom: 8px; font-weight: 600; font-size: .9rem; color: var(--gold-600); }
.bl-places-head a .icon { width: 16px; height: 16px; transition: transform .2s; }
.bl-places-head a:hover .icon { transform: translateX(4px); }
.bl-doors { position: relative; display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: clamp(10px, 1.5vw, 22px); margin: 0; padding: 0 0 40px; list-style: none; }
.bl-doors::before { content: ""; position: absolute; left: -3%; right: -3%; bottom: 14px; border-top: 2px dashed rgba(166,110,34,.4); }
.bl-doors li { transition: transform .45s cubic-bezier(.2,.8,.2,1); }
.bl-doors li:nth-child(even) { transform: translateY(40px); }
.bl-doors li:hover { transform: translateY(-10px); }
.bl-doors li:nth-child(even):hover { transform: translateY(30px); }
.bl-doors a { position: relative; display: block; padding: 7px; border-radius: 999px 999px 18px 18px; background: linear-gradient(160deg, #f3dcab, #c8963f 55%, #8f6220); box-shadow: 0 24px 46px rgba(90,56,14,.3); color: #fff; isolation: isolate; }
.bl-doors a::before { content: ""; position: absolute; left: 50%; top: -14px; width: 16px; height: 16px; margin-left: -8px; background: linear-gradient(135deg, #e6bd6f, #a66e22); transform: rotate(45deg); box-shadow: 0 0 0 4px var(--sand-50); }
.bl-doors img { display: block; width: 100%; aspect-ratio: 3 / 5; object-fit: cover; border-radius: 999px 999px 12px 12px; transition: transform .9s, filter .5s; filter: saturate(.92); }
.bl-doors a:hover img { transform: scale(1.06); filter: none; }
.bl-doors a::after { content: ""; position: absolute; inset: 7px; border-radius: 999px 999px 12px 12px; background: linear-gradient(0deg, rgba(20,10,4,.88) 0, rgba(20,10,4,.2) 46%, rgba(20,10,4,0) 64%); pointer-events: none; }
.bl-doors a { overflow: hidden; }
.bl-door-num { position: absolute; z-index: 1; left: 50%; top: 13%; transform: translateX(-50%); font: 700 .8rem var(--font-display); letter-spacing: .2em; color: #fff3d6; text-shadow: 0 2px 8px rgba(0,0,0,.6); }
.bl-door-num::after { content: ""; display: block; width: 18px; height: 1.500px; margin: 5px auto 0; background: #f1d39a; }
.bl-door-text { position: absolute; z-index: 1; left: 12px; right: 12px; bottom: 22px; display: grid; justify-items: center; gap: 3px; text-align: center; }
.bl-door-text small { font-size: .6rem; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: #f1d39a; }
.bl-door-text strong { font: 700 clamp(1.1rem, .8rem + .9vw, 1.55rem)/1.15 var(--font-display); }
.bl-door-text em { display: inline-flex; align-items: center; gap: 6px; max-height: 0; opacity: 0; overflow: hidden; font-style: normal; font-size: .76rem; font-weight: 600; color: #f1d39a; transition: max-height .35s, opacity .35s, margin .35s; }
.bl-door-text em .icon { width: 14px; height: 14px; }
.bl-doors a:hover .bl-door-text em { max-height: 24px; margin-top: 6px; opacity: 1; }
@media (max-width: 1100px) {
  .bl-grid-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .bl-doors { grid-template-columns: repeat(3, minmax(0, 1fr)); row-gap: 60px; }
  .bl-doors::before { display: none; }
  .bl-hero-script { display: none; }
  .bl-news-grid { grid-template-columns: auto minmax(0, 1fr); }
  .bl-news-form { grid-column: 1 / -1; }
}
@media (max-width: 760px) {
  .bl-featured-grid, .bl-grid-3 { grid-template-columns: minmax(0, 1fr); }
  .bl-stories { flex-direction: column; align-items: stretch; min-height: 0; padding: 46px 0 0; }
  .bl-stories .container { order: 1; }
  .bl-stories::before { background: linear-gradient(180deg, transparent 0, transparent 90%, #24140b 100%); }
  .bl-wall { order: 2; position: relative; inset: auto; margin: 60px -25% -40px; transform: rotate(-6deg); }
  .bl-wall li { width: 60vw; }
  .bl-stories-card { max-width: none; }
  .bl-stories-script { right: 12px; }
  .bl-grid-4 { grid-template-columns: minmax(0, 1fr); }
  .bl-doors { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 30px; }
  .bl-doors li:nth-child(even) { transform: translateY(24px); }
  .bl-door-text em { max-height: 24px; margin-top: 4px; opacity: 1; }
  .bl-feats li { flex: 1 0 44%; padding: 0; border: 0; }
  .bl-cats li { flex: 0 0 104px; }
  .bl-news-icon { display: none; }
  .bl-news-grid { grid-template-columns: minmax(0, 1fr); }
  .bl-quote .container { padding-left: var(--gutter); }
  .bl-quote .container::before { position: static; display: block; height: 40px; }
}

/* ---------- Destinations index ---------- */
.di-hero h1 span { color: var(--gold-300); }
.di-head { max-width: 760px; margin: 0 auto clamp(30px, 4vw, 54px); text-align: center; }
.di-head .eyebrow { justify-content: center; }
.di-head h2 { margin: 10px 0 0; }
.di-jump li { flex: 1 0 96px; }
.di-jump .bl-cat { text-decoration: none; }
.di-intro { padding: clamp(34px, 4vw, 56px) 0 clamp(30px, 4vw, 50px); }
.di-intro-grid > div:first-child { align-self: center; }
.di-intro-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(28px, 5vw, 80px); align-items: center; }
.di-intro h2 { margin: 10px 0 18px; }
.di-intro p:not(.eyebrow) { margin: 0 0 1em; line-height: 1.85; }
.di-facts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin: 26px 0 0; padding: 18px 0 0; list-style: none; border-top: 1px solid #e6d2ac; font-size: .78rem; line-height: 1.45; color: var(--muted); }
.di-facts li { padding: 0 16px; }
.di-facts li:first-child { padding-left: 0; }
.di-facts li + li { border-left: 1px solid #e6d2ac; }
.di-facts strong { display: block; font: 700 clamp(1.8rem, 1.4rem + 1.4vw, 2.6rem)/1.1 var(--font-display); color: #a0621f; }
.di-intro-grid { grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); }
.di-map { margin: 0; border-radius: 24px; overflow: hidden; background: #0d2f3b; border: 1px solid rgba(226,181,102,.45); box-shadow: 0 34px 80px rgba(13,40,52,.4); }
.di-map-stage { position: relative; height: clamp(420px, 40vw, 560px); overflow: hidden; background: radial-gradient(70% 70% at 50% 42%, #1b566b, transparent 80%), linear-gradient(160deg, #123a47, #0a2832); }
.di-map-stage::after { content: ""; position: absolute; inset: 10px; border-radius: 16px; border: 1px solid rgba(226,181,102,.3); pointer-events: none; }
.di-map-box { position: absolute; top: 34px; bottom: 30px; left: 50%; aspect-ratio: 330 / 300; transform: translateX(-50%); }
.di-map .cu-map-inner .map-compass, .di-map .cu-map-inner .map-waves { display: none; }
.di-map .cu-map-inner .map-land { fill: #f2dcb2; stroke: #d6aa62; stroke-width: 1.800; }
.di-map-over { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; pointer-events: none; }
.di-map-grid path { fill: none; stroke: rgba(170,215,225,.13); stroke-width: 1; stroke-dasharray: 2 6; vector-effect: non-scaling-stroke; }
.di-map-route { fill: none; stroke: #b8431f; stroke-width: 1.800; stroke-dasharray: 1 6; stroke-linecap: round; vector-effect: non-scaling-stroke; animation: tour-route 1.800s linear infinite; }
.di-map-sea { fill: rgba(190,225,235,.55); font: 600 6.500px var(--font-body); letter-spacing: 2.400px; }
.di-map-land { fill: rgba(122,78,24,.6); font: 600 5.500px var(--font-body); letter-spacing: 2px; }
.di-map-compass circle { fill: rgba(13,47,59,.6); stroke: #e2b566; stroke-width: 1; }
.di-map-compass path { fill: #e2b566; }
.di-map-compass text { fill: #e2b566; font: 700 7px var(--font-display); text-anchor: middle; }
.di-map-scale path { fill: none; stroke: rgba(190,225,235,.7); stroke-width: 1; }
.di-map-scale text { fill: rgba(190,225,235,.75); font: 600 6px var(--font-body); }
.di-pin { position: absolute; z-index: 2; width: 0; height: 0; }
.di-pin::before { content: ""; position: absolute; left: -17px; top: -17px; width: 34px; height: 34px; border-radius: 50%; background: rgba(226,181,102,.4); animation: cuPulse 2.800s ease-out infinite; }
.di-pin:nth-of-type(even)::before { animation-delay: 1.400s; }
.di-pin i { position: absolute; left: -13px; top: -13px; display: grid; place-items: center; width: 26px; height: 26px; border-radius: 50%; background: linear-gradient(135deg, #1c2f47, #0f1e31); border: 2px solid #e2b566; color: #f1d39a; font: 700 .64rem var(--font-display); font-style: normal; box-shadow: 0 4px 10px rgba(0,0,0,.45); transition: transform .25s, background .25s, color .25s; }
.di-pin b { position: absolute; top: -13px; padding: 5px 12px; border-radius: 999px; background: #fffdf8; border: 1px solid #ead9b8; color: #2b1b0e; font-size: .76rem; font-weight: 700; line-height: 1.2; white-space: nowrap; box-shadow: 0 8px 18px rgba(0,0,0,.35); transition: background .25s, color .25s; }
.di-pin-r b { left: 20px; } .di-pin-l b { right: 20px; } .di-pin-b b { left: 0; top: 18px; transform: translateX(-50%); } .di-pin-a b { left: 34px; top: -60px; transform: translateX(-50%); }
.di-pin-a::after { content: ""; position: absolute; left: 6px; top: -38px; width: 1px; height: 26px; background: #e2b566; transform: rotate(28deg); transform-origin: 0 100%; }
.di-pin:hover { z-index: 3; }
.di-pin:hover i { transform: scale(1.2); background: linear-gradient(135deg, #e6bd6f, #a66e22); color: #fff; }
.di-pin:hover b { background: linear-gradient(135deg, #dba854, #a66e22); border-color: #a66e22; color: #fff; }
.di-map figcaption { padding: 18px clamp(18px, 2.2vw, 28px) 22px; background: #fffdf8; }
.di-map figcaption p { margin: 0 0 12px; font-size: .68rem; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; color: var(--gold-600); }
.di-map ol { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px 16px; margin: 0; padding: 0; list-style: none; }
.di-map ol a { display: flex; align-items: center; gap: 10px; padding: 6px 8px; border-radius: 10px; font-size: .68rem; line-height: 1.3; color: var(--muted); transition: background .2s; }
.di-map ol a:hover { background: var(--sand-100); }
.di-map ol i { flex: none; display: grid; place-items: center; width: 26px; height: 26px; border-radius: 50%; background: linear-gradient(135deg, #1c2f47, #0f1e31); border: 2px solid #e2b566; color: #f1d39a; font: 700 .64rem var(--font-display); font-style: normal; }
.di-map ol strong { display: block; font-size: .86rem; color: var(--ink); }
.cu-pin-a b { left: 14px; top: -78px; transform: translateX(-50%); }
.cu-pin-a:hover b { transform: translate(-50%, -3px); }
.di-types { padding: clamp(30px, 4vw, 50px) 0 clamp(40px, 5vw, 70px); }
.di-types-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: clamp(12px, 1.6vw, 22px); margin: 0; padding: 0; list-style: none; }
.di-types-grid li { display: flex; flex-direction: column; padding: clamp(20px, 2.2vw, 30px); border-radius: 18px; background: #fffdf8; border: 1px solid #ead9b8; box-shadow: var(--shadow-sm); transition: transform .3s, box-shadow .3s, border-color .3s; }
.di-types-grid li:hover { transform: translateY(-5px); border-color: #c8963f; box-shadow: var(--shadow); }
.di-types-grid .icon { width: 44px; height: 44px; color: #c2562b; stroke-width: 1.2; }
.di-types-grid h3 { margin: 14px 0 8px; font: 700 1.25rem var(--font-display); color: var(--ink); }
.di-types-grid p { margin: 0 0 16px; font-size: .9rem; line-height: 1.65; color: var(--muted); }
.di-types-grid span { display: flex; flex-wrap: wrap; gap: 8px; margin-top: auto; }
.di-types-grid a { padding: 6px 14px; border-radius: 999px; background: var(--sand-100); border: 1px solid #e6d2ac; font-size: .78rem; font-weight: 600; color: var(--ink); transition: background .25s, color .25s, border-color .25s; }
.di-types-grid a:hover { background: linear-gradient(135deg, #dba854, #a66e22); border-color: #a66e22; color: #fff; }
.di-list { padding: clamp(40px, 5vw, 70px) 0 clamp(60px, 7vw, 110px); background: linear-gradient(180deg, var(--sand-50), #f6ecd9 60%, var(--sand-50)); }
.di-list .di-head { margin-bottom: clamp(40px, 5vw, 66px); }
.di-routes { position: relative; padding: clamp(56px, 6.4vw, 100px) 0; color: #e9dcc3; background: radial-gradient(50% 60% at 50% 0, rgba(226,181,102,.16), transparent 70%), repeating-linear-gradient(45deg, rgba(255,255,255,.02) 0 1px, transparent 1px 26px), repeating-linear-gradient(-45deg, rgba(255,255,255,.02) 0 1px, transparent 1px 26px), linear-gradient(180deg, #0c1a2c, #13263d); }
.di-routes .di-head h2 { color: #fff; }
.di-routes-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(14px, 1.8vw, 26px); margin: 0; padding: 0; list-style: none; }
.di-routes-grid li { display: flex; flex-direction: column; padding: clamp(22px, 2.4vw, 34px); border-radius: 20px; background: linear-gradient(160deg, rgba(255,255,255,.09), rgba(255,255,255,.03)); border: 1px solid rgba(214,170,98,.32); transition: transform .3s, border-color .3s; }
.di-routes-grid li:hover { transform: translateY(-5px); border-color: rgba(214,170,98,.8); }
.di-routes-grid small { display: inline-flex; align-items: center; gap: 7px; font-size: .7rem; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: #e6bd6f; }
.di-routes-grid small .icon { width: 14px; height: 14px; }
.di-routes-grid h3 { margin: 10px 0 10px; font: 700 clamp(1.25rem, 1.1rem + .8vw, 1.6rem)/1.25 var(--font-display); color: #fff; }
.di-routes-grid p { margin: 0 0 16px; font-size: .92rem; line-height: 1.7; color: #d5deea; }
.di-routes-grid .di-route-stops { padding: 10px 0; border-top: 1px dashed rgba(214,170,98,.4); border-bottom: 1px dashed rgba(214,170,98,.4); font-size: .8rem; font-weight: 600; color: #f1d39a; }
.di-routes-grid a { display: inline-flex; align-items: center; gap: 8px; margin-top: auto; font-size: .88rem; font-weight: 600; color: #f1d39a; }
.di-routes-grid a .icon { width: 16px; height: 16px; transition: transform .2s; }
.di-routes-grid a:hover .icon { transform: translateX(4px); }
.di-seasons { padding: clamp(50px, 6vw, 90px) 0 clamp(10px, 2vw, 30px); }
.di-seasons-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin: 0; padding: 0; list-style: none; border-radius: 20px; background: #fffdf8; border: 1px solid #ead9b8; box-shadow: var(--shadow-sm); overflow: hidden; }
.di-seasons-grid li { display: grid; align-content: start; gap: 4px; padding: clamp(22px, 2.4vw, 34px); }
.di-seasons-grid li + li { border-left: 1px solid #efe2c8; }
.di-seasons-grid .icon { width: 36px; height: 36px; margin-bottom: 8px; color: #c8963f; stroke-width: 1.2; }
.di-seasons-grid strong { font: 700 1.3rem var(--font-display); color: var(--ink); }
.di-seasons-grid small { font-size: .7rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: #c2562b; }
.di-seasons-grid span { margin-top: 8px; font-size: .88rem; line-height: 1.65; color: var(--muted); }
.di-cta { background: #0d1626; }
.di-cta > img { object-position: 50% 60%; }
.di-cta::after { background: linear-gradient(90deg, rgba(9,22,40,.86) 0, rgba(9,22,40,.5) 42%, rgba(9,22,40,.04) 76%), linear-gradient(0deg, rgba(9,22,40,.45), transparent 40%); }
.di-faq .faq, .di-faq .faq-list { max-width: 860px; margin-inline: auto; }
@media (max-width: 1000px) {
  .di-intro-grid { grid-template-columns: minmax(0, 1fr); }
  .di-map ol { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .di-map-stage { height: clamp(360px, 90vw, 520px); }
  .di-pin b { font-size: .66rem; padding: 4px 9px; }
  .di-types-grid, .di-seasons-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .di-seasons-grid li:nth-child(3) { border-left: 0; }
  .di-seasons-grid li:nth-child(n+3) { border-top: 1px solid #efe2c8; }
  .di-routes-grid { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 560px) { .di-types-grid, .di-seasons-grid { grid-template-columns: minmax(0, 1fr); } .di-seasons-grid li + li { border-left: 0; border-top: 1px solid #efe2c8; } }
.di-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(46px, 5vw, 70px) clamp(18px, 2.4vw, 34px); margin: 0; padding: 0; list-style: none; }
.di-card { display: grid; justify-items: center; }
.di-card > a { position: relative; display: block; width: 100%; padding: 8px; border-radius: 999px 999px 20px 20px / 240px 240px 20px 20px; background: linear-gradient(160deg, #f3dcab, #c8963f 55%, #8f6220); box-shadow: 0 26px 50px rgba(90,56,14,.28); overflow: hidden; transition: transform .45s, box-shadow .45s; }
.di-card > a:hover { transform: translateY(-8px); box-shadow: 0 36px 66px rgba(90,56,14,.36); }
.di-card img { display: block; width: 100%; aspect-ratio: 4 / 4.4; object-fit: cover; border-radius: 999px 999px 13px 13px / 232px 232px 13px 13px; transition: transform .9s; }
.di-card > a:hover img { transform: scale(1.05); }
.di-card-num { position: absolute; left: 50%; top: 9%; transform: translateX(-50%); font: 700 .85rem var(--font-display); letter-spacing: .2em; color: #fff3d6; text-shadow: 0 2px 8px rgba(0,0,0,.6); }
.di-card-body { position: relative; z-index: 1; width: 88%; margin-top: -54px; padding: 20px 22px 22px; border-radius: 16px; background: #fffdf8; border: 1px solid #ead9b8; box-shadow: 0 14px 30px rgba(90,56,14,.16); text-align: center; }
.di-card-body small { display: block; font-size: .66rem; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: var(--gold-600); }
.di-card-body h2 { margin: 6px 0 10px; font-size: clamp(1.4rem, 1.1rem + 1vw, 1.9rem); }
.di-card-body h2 a:hover { color: var(--gold-600); }
.di-card-body p { margin: 0 0 14px; font-size: .88rem; line-height: 1.65; color: var(--muted); display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden; }
.di-card-foot { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding-top: 12px; border-top: 1px dashed #e0c794; font-size: .76rem; font-weight: 600; color: #a0621f; text-align: left; }
@media (max-width: 1000px) { .di-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 640px) { .di-grid { grid-template-columns: minmax(0, 1fr); } }

/* ---------- Blog article page ---------- */
.bl-date { font-weight: 600; color: var(--gold-600); }
.po-hero h1 { max-width: 12em; }
.po-hero h1 span { display: block; }
.po-meta { display: flex; flex-wrap: wrap; gap: 12px 0; margin: 26px 0 0; padding: 0; list-style: none; font-size: .9rem; color: #f1e4cb; }
.po-meta li { display: flex; align-items: center; gap: 10px; padding: 0 22px; border-left: 1px solid rgba(255,255,255,.25); }
.po-meta li:first-child { padding-left: 0; border-left: 0; }
.po-meta .icon { width: 26px; height: 26px; padding: 4px; border-radius: 50%; border: 1.500px solid #e6bd6f; color: #e6bd6f; }
.po-play { position: absolute; right: clamp(16px, 6vw, 90px); bottom: 0; flex-direction: column; text-align: center; }
.po-hero-script { top: 0; max-width: 11em; font-size: clamp(1.2rem, 1rem + .9vw, 1.7rem); }
.po-hero { padding-bottom: clamp(70px, 7vw, 100px); }
.po-hero .page-hero-content { min-height: 250px; }
.po-wrap { position: relative; z-index: 2; margin-top: -30px; padding: clamp(34px, 4vw, 60px) 0 clamp(20px, 3vw, 40px); border-radius: 26px 26px 0 0; background: var(--sand-50); }
.po-grid { display: grid; grid-template-columns: 56px minmax(0, 1fr) clamp(280px, 26vw, 340px); gap: clamp(20px, 3vw, 48px); align-items: start; }
.po-share { position: sticky; top: calc(var(--header-h) + 24px); display: grid; justify-items: center; gap: 14px; }
.po-share p { margin: 0 0 4px; font-size: .86rem; font-weight: 600; color: var(--ink); }
.po-share a { display: grid; place-items: center; width: 46px; height: 46px; border-radius: 50%; color: #fff; font: 700 1.05rem var(--font-body); box-shadow: 0 6px 14px rgba(0,0,0,.14); transition: transform .25s; }
.po-share a:hover { transform: translateY(-3px) scale(1.06); }
.po-share .icon { width: 22px; height: 22px; }
.po-share-fb { background: #e9edf5; color: #1d4f9c !important; } .po-share-x { background: #111; } .po-share-pin { background: #d7282f; } .po-share-in { background: #1877b9; } .po-share-wa { background: #22b455; }
.po-body { min-width: 0; }
.po-intro { margin: 0 0 26px; font-size: clamp(1.05rem, 1rem + .35vw, 1.22rem); line-height: 1.8; color: #2f3a52; }
.po-lead { position: relative; display: block; width: 100%; padding: 0; border: 0; border-radius: 16px; overflow: hidden; background: #2a180d; cursor: pointer; box-shadow: var(--shadow); }
.po-lead img { display: block; width: 100%; aspect-ratio: 16 / 8.6; object-fit: cover; transition: transform .8s; }
.po-lead:hover img { transform: scale(1.03); }
.po-lead-tag { position: absolute; left: 18px; bottom: 18px; display: inline-flex; align-items: center; gap: 8px; padding: 9px 16px; border-radius: 8px; background: #fffdf8; color: var(--ink); font-size: .84rem; font-weight: 600; box-shadow: 0 6px 14px rgba(0,0,0,.2); }
.po-lead-tag .icon { width: 16px; height: 16px; color: var(--gold-600); }
.po-sec { margin-top: clamp(38px, 4.4vw, 60px); scroll-margin-top: calc(var(--header-h) + 20px); }
.po-sec > h2 { display: flex; align-items: center; gap: 18px; margin: 0 0 20px; font-size: clamp(1.5rem, 1.2rem + 1.3vw, 2.2rem); line-height: 1.2; }
.po-sec > h2::after { content: ""; flex: none; width: 34px; height: 2px; background: #c8963f; }
.po-sec > h2 span { flex: none; display: grid; place-items: center; width: 50px; height: 50px; border-radius: 12px; background: linear-gradient(135deg, #d08a4a, #b0612a); color: #fff; font: 700 1.05rem var(--font-body); box-shadow: 0 8px 18px rgba(176,97,42,.3); }
.po-sec p { margin: 0 0 1.1em; line-height: 1.85; color: #3d4a63; }
.po-sec h3 { margin: 26px 0 10px; font: 700 1.22rem/1.35 var(--font-display); color: var(--ink); }
.po-text { display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr); gap: clamp(20px, 2.6vw, 36px); align-items: start; }
.po-text figure { position: relative; margin: 0; }
.po-text figure img { display: block; width: 100%; aspect-ratio: 3 / 4.4; object-fit: cover; border-radius: 12px; box-shadow: var(--shadow); transform: rotate(1.500deg); }
.po-text figcaption { margin-top: 14px; font-family: var(--font-script); font-size: 1.4rem; color: #b8742e; text-align: center; transform: rotate(-4deg); }
.po-sec blockquote { position: relative; margin: 8px 0 0; padding: 22px 24px 22px 64px; border-radius: 12px; background: #f6e9d9; font: italic 500 1.08rem/1.7 var(--font-display); color: #5a3c16; }
.po-sec blockquote::before { content: "“"; position: absolute; left: 18px; top: 6px; font: 700 3.600rem/1 var(--font-display); color: #c98a3a; }
.po-cards { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: clamp(10px, 1.4vw, 18px); margin: 8px 0 0; padding: 0; list-style: none; }
.po-cards li { display: flex; flex-direction: column; border-radius: 12px; background: #fff; border: 1px solid var(--sand-200); box-shadow: var(--shadow-sm); overflow: hidden; font-size: .84rem; line-height: 1.6; color: var(--muted); transition: transform .3s, box-shadow .3s; }
.po-cards li:hover { transform: translateY(-5px); box-shadow: var(--shadow); }
.po-card-media { position: relative; display: block; }
.po-card-media img { display: block; width: 100%; aspect-ratio: 4 / 3.4; object-fit: cover; }
.po-card-media i { position: absolute; left: 12px; bottom: -16px; display: grid; place-items: center; width: 34px; height: 34px; border-radius: 9px; background: #fffdf8; border: 1px solid #e6d2ac; color: #b0612a; box-shadow: 0 4px 10px rgba(0,0,0,.12); }
.po-card-media i .icon { width: 18px; height: 18px; }
.po-cards strong { padding: 26px 16px 6px; font-size: .98rem; color: var(--ink); }
.po-cards strong small { font-weight: 500; font-size: .8rem; color: var(--muted); }
.po-cards li > span:last-child { padding: 0 16px 18px; }
.po-seasons-intro { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 20px 40px; align-items: center; }
.po-script { margin: 0 !important; max-width: 10em; font-family: var(--font-script); font-size: 1.35rem; line-height: 1.25 !important; color: #b8742e !important; text-align: center; transform: rotate(-5deg); }
.po-tiles { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: clamp(10px, 1.4vw, 18px); margin: 8px 0 0; padding: 0; list-style: none; }
.po-tiles li { display: flex; align-items: center; gap: 14px; padding: 18px; border-radius: 12px; background: #fff; border: 1px solid var(--sand-200); box-shadow: var(--shadow-sm); font-size: .8rem; line-height: 1.45; color: var(--muted); }
.po-tiles .icon { flex: none; width: 38px; height: 38px; color: #c2562b; stroke-width: 1.2; }
.po-tiles strong { display: block; font-size: .95rem; color: var(--ink); }
.po-tips { display: grid; gap: 14px; margin: 8px 0 0; padding: 0; list-style: none; }
.po-tips li { display: flex; gap: 14px; padding: 16px 18px; border-radius: 12px; background: #fff; border: 1px solid var(--sand-200); font-size: .92rem; line-height: 1.65; color: #3d4a63; }
.po-tips .icon { flex: none; width: 24px; height: 24px; margin-top: 2px; padding: 5px; border-radius: 50%; background: linear-gradient(135deg, #dba854, #a66e22); color: #fff; stroke-width: 2.4; }
.po-tips strong { display: block; color: var(--ink); }
.po-side { display: grid; gap: 22px; }
.po-side h2 { margin: 0 0 16px; font-size: 1.45rem; }
.po-author-head { display: flex; align-items: center; gap: 14px; margin: 0 0 14px; font-size: .82rem; line-height: 1.4; color: var(--muted); }
.po-author-head img { flex: none; width: 96px; height: 96px; border-radius: 50%; object-fit: contain; padding: 9px; background: #fffdf8; box-shadow: 0 0 0 2px #fff, 0 0 0 3.5px #d6aa62; }
.po-author-head strong { display: block; font-size: 1.05rem; color: var(--ink); }
.po-author > p { margin: 0 0 14px; font-size: .9rem; line-height: 1.7; }
.po-author-links { display: flex; gap: 10px; }
.po-author-links a { display: grid; place-items: center; width: 36px; height: 36px; border-radius: 50%; border: 1px solid #d9c39b; color: var(--ink); transition: background .25s, color .25s; }
.po-author-links a:hover { background: var(--gold); border-color: var(--gold); color: #fff; }
.po-author-links .icon { width: 17px; height: 17px; }
.po-toc { padding: 22px 22px 14px; border-radius: 16px; background: #f6e9d9; }
.po-toc h2 { padding-bottom: 14px; border-bottom: 1px solid #e6d2ac; }
.po-toc ol { margin: 0; padding: 0; list-style: none; }
.po-toc li + li { border-top: 1px solid rgba(230,210,172,.7); }
.po-toc a { display: flex; align-items: center; gap: 14px; padding: 11px 0; font-size: .92rem; color: var(--ink); transition: color .2s, padding .2s; }
.po-toc a:hover { padding-left: 6px; color: #b0612a; }
.po-toc a span { flex: none; display: grid; place-items: center; width: 28px; height: 28px; border-radius: 7px; background: linear-gradient(135deg, #d08a4a, #b0612a); color: #fff; font-size: .66rem; font-weight: 700; }
.po-promo { border-radius: 16px; overflow: hidden; background: #fff; border: 1px solid var(--sand-200); box-shadow: var(--shadow-sm); padding-bottom: 22px; }
.po-promo-media { position: relative; display: block; }
.po-promo-media img { display: block; width: 100%; aspect-ratio: 16 / 11; object-fit: cover; }
.po-promo-media b { position: absolute; left: 14px; top: 14px; padding: 6px 12px; border-radius: 6px; background: #fffdf8; color: #b0612a; font-size: .64rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; }
.po-promo h2 { margin: 20px 22px 14px; font-size: 1.35rem; line-height: 1.3; }
.po-promo ul { display: grid; gap: 10px; margin: 0 22px 20px; padding: 0; list-style: none; font-size: .9rem; color: #3d4a63; }
.po-promo li { display: flex; align-items: center; gap: 10px; }
.po-promo li .icon { flex: none; width: 20px; height: 20px; padding: 4px; border-radius: 50%; background: #1c2f47; color: #fff; stroke-width: 2.4; }
.po-promo .btn { display: flex; justify-content: center; margin: 0 22px; }
.po-related a { display: grid; grid-template-columns: 92px minmax(0, 1fr); gap: 14px; align-items: center; margin-bottom: 12px; padding: 10px; border-radius: 12px; background: #fff; border: 1px solid var(--sand-200); font-size: .76rem; color: #c2562b; transition: transform .25s, box-shadow .25s; }
.po-related a:hover { transform: translateX(4px); box-shadow: var(--shadow-sm); }
.po-related img { width: 92px; height: 92px; border-radius: 8px; object-fit: cover; }
.po-related strong { display: block; margin-bottom: 6px; font-size: .95rem; line-height: 1.35; color: var(--ink); }
.po-more { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr); align-items: center; margin: clamp(20px, 3vw, 40px) 0; border-radius: 18px; overflow: hidden; background: linear-gradient(100deg, #f6e9d9, #f0d9b8); }
.po-more img { display: block; width: 100%; height: 100%; min-height: 260px; object-fit: cover; border-radius: 18px; }
.po-more > div { padding: clamp(24px, 3.4vw, 50px); }
.po-more h2 { margin: 8px 0 12px; }
.po-more p:not(.eyebrow) { margin: 0 0 22px; line-height: 1.75; }
.po-nav { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); gap: 20px; align-items: center; padding: clamp(20px, 3vw, 40px) 0 clamp(50px, 6vw, 90px); }
.po-nav a { display: flex; align-items: center; gap: 18px; color: var(--ink); }
.po-nav img { flex: none; width: 110px; height: 90px; border-radius: 10px; object-fit: cover; }
.po-nav small { display: flex; align-items: center; gap: 6px; margin-bottom: 4px; font-size: .78rem; color: #b0612a; }
.po-nav small .icon { width: 14px; height: 14px; }
.po-nav strong { display: block; font: 700 1.15rem/1.3 var(--font-display); transition: color .2s; }
.po-nav a:hover strong { color: var(--gold-600); }
.po-nav-next { justify-content: flex-end; text-align: right; }
.po-nav-next small { justify-content: flex-end; }
.po-nav-all { display: grid !important; place-items: center; width: 70px; height: 70px; border-radius: 50%; background: #fff; box-shadow: var(--shadow-sm); transition: transform .25s; }
.po-nav-all:hover { transform: rotate(90deg); }
.po-nav-all .icon { width: 28px; height: 28px; }
@media (max-width: 1100px) {
  .po-grid { grid-template-columns: minmax(0, 1fr); }
  .po-share { position: static; display: flex; justify-content: flex-start; align-items: center; }
  .po-share p { margin: 0 6px 0 0; }
  .po-side { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .po-hero-script, .po-play { display: none; }
}
@media (max-width: 760px) {
  .po-text, .po-seasons-intro, .po-more, .po-side { grid-template-columns: minmax(0, 1fr); }
  .po-cards, .po-tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .po-text figure img { aspect-ratio: 16 / 10; transform: none; }
  .po-nav { grid-template-columns: minmax(0, 1fr); }
  .po-nav-all { justify-self: center; }
  .po-nav-next { justify-content: flex-start; text-align: left; flex-direction: row-reverse; }
  .po-nav-next small { justify-content: flex-start; }
  .po-sec > h2 span { width: 42px; height: 42px; }
  .po-meta li { padding: 0 14px; }
}

/* ==========================================================================
   Responsive
   ========================================================================== */
@media (max-width: 1400px) {
  .header-wa { width: 44px; padding: 0; justify-content: center; }
  .header-wa span { display: none; }
}

@media (max-width: 1280px) {
  .cat-row { grid-template-columns: repeat(4, 1fr); }
  .tcard-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .dest-grid { --per-view: 4; }
  .main-nav, .header-cta { display: none; }
  .nav-toggle { display: grid; }
  .experiences-grid { grid-template-columns: 1fr; }
  .experiences-intro { max-width: 640px; }
  .tours-section .round-btn { display: inline-grid; }
  .tours-section { padding-bottom: 8px; }
  .tour-track { display: flex; gap: 16px; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; margin-inline: calc(var(--gutter) * -1); padding: 4px var(--gutter) 24px; scroll-padding-inline: var(--gutter); }
  .tour-track::-webkit-scrollbar { display: none; }
  .tour-card { flex: 0 0 min(300px, 78vw); scroll-snap-align: start; }
  .faq-grid { grid-template-columns: 1fr; }
}

@media (max-width: 960px) {
  .tours-layout { grid-template-columns: 1fr; }
  .regions-layout { grid-template-columns: minmax(0, 1fr); }
  .region-map { max-width: 440px; }
  .dream-cta-content { margin-left: 0; }
  .dream-cta::after { background: rgba(28, 15, 7, .72); }
  .topbar-note { display: none; }
  .topbar-inner { justify-content: center; }
  .planner-fields { grid-template-columns: 1fr 1fr; }
  .planner-fields .field:first-child, .planner .btn { grid-column: 1 / -1; }
  .dest-grid { --per-view: 3; }
  .why-layout { grid-template-columns: 1fr 1fr; }
  .why-figure { grid-column: 1 / -1; grid-row: 1; width: min(320px, 76%); margin-inline: auto; }
  .why-col-left li { flex-direction: row; text-align: left; }
  .why-col li:nth-child(2), .why-col li:nth-child(2):hover { transform: none; }
  .footer-top { grid-template-columns: 1fr; }
  .footer-links { grid-template-columns: 1fr 1fr; }
  .cta-script { display: none; }
}

@media (max-width: 700px) {
  .page-hero { padding-bottom: 96px; }
  .page-hero-media { left: 0; -webkit-mask-image: none; mask-image: none; }
  .page-hero::after { background: linear-gradient(0deg, rgba(8, 22, 34, .9), rgba(8, 22, 34, .5)); }
  .cat-row { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; margin-inline: calc(var(--gutter) * -1); padding: 6px var(--gutter) 10px; margin-top: -70px; }
  .cat-row::-webkit-scrollbar { display: none; }
  .cat-row li { flex: 0 0 38vw; scroll-snap-align: start; }
  .tcard-grid { grid-template-columns: 1fr; }
  .results-head { flex-direction: column; align-items: flex-start; }
  .region-card { grid-template-columns: 1fr; }
  .region-card-photo { max-width: 240px; margin-inline: auto; }
  .region-tabs { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; margin-inline: calc(var(--gutter) * -1); padding-inline: var(--gutter); }
  .region-tabs::-webkit-scrollbar { display: none; }
  .region-tab { flex: none; }
  .map-legend { display: none; }
  .topbar-note { display: none; }
  .topbar-inner { justify-content: center; min-height: 34px; }
  .topbar-links li:last-child { display: none; }
  :root { --header-h: 60px; }
  body { padding-bottom: 62px; }
  .brand img { height: 62px; margin-block: 2px; }
  .header-wa { display: none; }

  .hero { min-height: 0; padding-block: 56px 120px; align-items: flex-end; }
  .hero-media { left: 0; -webkit-mask-image: none; mask-image: none; }
  .hero-media img { object-position: 50% 50%; }
  .hero::after { background: linear-gradient(0deg, rgba(8, 22, 34, .9) 0%, rgba(8, 22, 34, .55) 55%, rgba(8, 22, 34, .25) 100%); }
  .hero-points { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; }
  .hero-points li { font-size: .68rem; }
  .hero-points .icon { width: 26px; height: 26px; }

  .planner-wrap { margin-top: -84px; }
  .planner-tabs { padding: 0 6px; }
  .planner-tabs span { padding: 14px 12px 12px; font-size: .84rem; }
  .planner-fields { padding: 14px; gap: 10px; }
  .planner-fields .field { grid-column: 1 / -1; }

  .section-head { flex-direction: column; align-items: flex-start; gap: 16px; }
  .section-head-actions { width: 100%; }
  .section-head-actions .text-link { margin-right: auto; }

  .arch-row { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; gap: 12px; margin-inline: calc(var(--gutter) * -1); padding: 4px var(--gutter) 16px; scroll-padding-inline: var(--gutter); }
  .arch-row::-webkit-scrollbar { display: none; }
  .arch-card { flex: 0 0 136px; scroll-snap-align: start; }

  .dest-grid { --per-view: 2.15; margin-inline: calc(var(--gutter) * -1); padding-inline: var(--gutter); scroll-padding-inline: var(--gutter); }
  .dest-card { aspect-ratio: 4 / 5; }
  .arcade { display: flex; align-items: flex-end; gap: 16px; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; margin-inline: calc(var(--gutter) * -1); padding: 16px var(--gutter) 6px; scroll-padding-inline: var(--gutter); }
  .arcade::-webkit-scrollbar { display: none; }
  .arcade-arch { flex: 0 0 58vw; scroll-snap-align: center; }
  .guests-cta .btn { flex: 1 1 100%; }
  .why-layout { grid-template-columns: 1fr; gap: 18px; }
  .why-col { gap: 18px; }
  .why-figure { margin-bottom: 18px; }
  .why-script { left: -14px; }
  .why-round { right: -14px; }
  .why-cta .btn { flex: 1 1 100%; }

  .cta-media { object-position: 72% 45%; }
  .cta::after { background: linear-gradient(0deg, rgba(28, 15, 7, .92), rgba(28, 15, 7, .6)); }
  .cta-actions .btn { flex: 1 1 100%; }
  .cta-points { gap: 16px; flex-direction: column; }
  .footer-brand { flex-direction: column; align-items: flex-start; }
  .footer-contacts { grid-template-columns: 1fr; }
  .footer-contacts a { flex-direction: row; align-items: center; }
  .footer-contacts strong { font-size: .86rem; }
  .footer-bottom-inner { flex-direction: column; align-items: flex-start; padding-bottom: 24px; }
  .footer-bottom-note { display: none; }

  .wa-float { display: none; }
  .sticky-bar { position: fixed; left: 0; right: 0; bottom: 0; z-index: 90; display: grid; grid-template-columns: 1fr 1.25fr; box-shadow: 0 -6px 24px rgba(16, 35, 52, .18); }
  .sticky-bar a { display: flex; align-items: center; justify-content: center; gap: 8px; min-height: 62px; font-weight: 600; font-size: .95rem; color: #fff; padding-bottom: env(safe-area-inset-bottom); }
  .sticky-wa { background: var(--wa); }
  .sticky-wa .icon { width: 24px; height: 24px; }
  .sticky-plan { background: linear-gradient(135deg, #c08631, #a66e22); }
}

@media (max-width: 380px) {
  .hero-points { grid-template-columns: repeat(2, 1fr); gap: 14px 8px; }
}

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

@media (max-width: 400px) {
  .btn { white-space: normal; text-align: center; max-width: 100%; }
}

/* ---------- Theme category guide (birding) ---------- */
.cat-guide { background: var(--sand-100); }
.section-head-center { justify-content: center; text-align: center; }
.guide-hl-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
.guide-hl-grid li { display: grid; gap: 8px; align-content: start; padding: 22px 20px; border-radius: 16px; background: #fff; border: 1px solid var(--sand-200); box-shadow: var(--shadow-sm); }
.guide-hl-grid h3 { margin: 4px 0 0; font-family: var(--font-display); font-size: 1.12rem; color: var(--ink); }
.guide-hl-grid p { margin: 0; font-size: .86rem; line-height: 1.6; color: var(--muted); }
.section-sub { max-width: 640px; margin: 8px 0 0; color: var(--muted); }
.species-grid { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 14px; }
.species-card { overflow: hidden; border-radius: 14px; background: #fff; border: 1px solid var(--sand-200); box-shadow: var(--shadow-sm); }
.species-card img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.species-card h3 { margin: 10px 12px 2px; font-size: .9rem; font-weight: 700; line-height: 1.3; color: var(--ink); }
.species-card p { margin: 0 12px 12px; font-size: .74rem; line-height: 1.4; color: var(--muted); }
.cat-guide-seasons { background: var(--sand-100); }
.guide-two-col { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(28px, 4vw, 64px); align-items: start; }
.season-grid-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); margin-top: 18px; }
.guide-why { grid-template-columns: repeat(3, minmax(0, 1fr)); margin: 18px 0 24px; }
.species-grid-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
@media (max-width: 1100px) { .species-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); } .guide-hl-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 900px) { .guide-two-col { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 700px) { .species-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .guide-hl-grid { grid-template-columns: minmax(0, 1fr); } .guide-why { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

/* home: specialist journeys (birding & fossil) */
.specialist { background: var(--sand-100); }
.spec { margin-top: clamp(28px, 4vw, 48px); }
.spec-main { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); gap: clamp(22px, 3.5vw, 52px); align-items: center; }
.spec-fossil .spec-main { grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr); }
.spec-fossil .spec-media { order: 2; }
.spec-media { position: relative; display: block; border-radius: 22px; overflow: hidden; box-shadow: var(--shadow); aspect-ratio: 5 / 4; }
.spec-media img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s; }
.spec-media:hover img { transform: scale(1.04); }
.spec-stat { position: absolute; left: 18px; bottom: 18px; display: flex; flex-direction: column; padding: 12px 18px; border-radius: 14px; background: rgba(23, 35, 46, .88); color: #fdfaf4; font-size: .85rem; line-height: 1.25; backdrop-filter: blur(4px); }
.spec-stat strong { font-family: 'Playfair Display', serif; font-size: 1.9rem; color: var(--gold-300); line-height: 1; }
.spec-stat small { color: rgba(253, 250, 244, .75); font-size: .78rem; margin-top: 2px; }
.spec-body h3 { margin: 6px 0 12px; font-family: 'Playfair Display', serif; font-size: clamp(1.7rem, 3vw, 2.4rem); line-height: 1.15; }
.spec-body h3 a { color: var(--ink); text-decoration: none; }
.spec-body h3 a:hover { color: var(--gold); }
.spec-lead { color: var(--muted); line-height: 1.7; margin: 0 0 18px; }
.spec-points { list-style: none; padding: 0; margin: 0 0 24px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px 18px; }
.spec-points li { display: flex; align-items: center; gap: 12px; font-size: .92rem; font-weight: 500; color: var(--ink); line-height: 1.35; }
.spec-points .tip-icon { flex: none; width: 44px; height: 44px; background: #fff; }
.spec-points .tip-icon .icon { width: 21px; height: 21px; }
.spec-actions { display: flex; flex-wrap: wrap; gap: 12px; }
.spec-tours { margin-top: clamp(20px, 2.6vw, 30px); }
@media (max-width: 900px) {
  .spec-main, .spec-fossil .spec-main { grid-template-columns: minmax(0, 1fr); }
  .spec-fossil .spec-media { order: 0; }
  .spec-media { aspect-ratio: 16 / 10; }
  .spec-tours { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 600px) { .spec-points { grid-template-columns: minmax(0, 1fr); } .spec-tours { grid-template-columns: minmax(0, 1fr); } }

/* small link to the official tourism website, at the end of every page */
.kw-guide { padding-block: clamp(40px, 6vw, 72px) 8px; border-top: 1px solid var(--sand-200); }
.kw-guide h2 { font-size: clamp(1.5rem, 1.1rem + 1.4vw, 2.1rem); text-wrap: balance; }
.kw-guide-intro { margin: 8px 0 0; color: var(--muted); }
.kw-guide-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr)); gap: 18px; margin-top: 26px; }
.kw-guide-item { min-width: 0; padding: 22px 22px 20px; background: var(--sand-50); border: 1px solid var(--sand-200); border-top: 3px solid var(--gold); border-radius: var(--radius); }
.kw-guide-item h3 { font-size: 1.12rem; line-height: 1.25; text-wrap: balance; }
.kw-guide-item p { margin: 10px 0 0; font-size: .94rem; }
.official-note { padding-block: 18px 26px; font-size: .82rem; color: var(--muted); text-align: center; }
.official-note p { margin: 0; }
.official-note a { color: var(--gold-600); font-weight: 500; }