/* ============================================================
   MUWAN PALASSA — Experiences hub (page-templates/page-experiences.php).
   Shared chrome (buttons, bands, exp cards, field-index marquee,
   book band, ambient layer) lives in main.css; this file carries
   only the hero, this page's journey stroke, the ivory territory
   interlude, the forest index ground and the field-plan passage.
   ============================================================ */

/* ---------- hero (canopy dark — the index waits below) ---------- */
.xh-hero{
  padding: calc(var(--header-h) + clamp(3.5rem, 9vw, 6.5rem)) 0 clamp(3.5rem, 9vw, 6rem);
  position:relative;
  background:
    radial-gradient(110% 60% at 74% 100%, rgba(192,137,78,.10), transparent 62%),
    linear-gradient(180deg, var(--night) 0%, var(--forest) 58%, var(--forest) 100%);
}
.xh-hero h1{ max-width:11em; }
.xh-hero .kicker{ color:var(--bronze); }
.hero-line{ display:block; overflow:hidden; padding-bottom:.08em; margin-bottom:-.08em; }
.hero-line-inner{ display:block; will-change:transform; }
.xh-hero .hero-lede{ margin-top:var(--s-3); font-size:var(--fs-600); line-height:1.55; color:var(--khaki); max-width:34em; }
.xh-hero .hero-cta{ display:flex; flex-wrap:wrap; align-items:center; gap:1.4rem; margin-top:var(--s-4); }

/* ---------- the journey line: this page's material stops ---------- */
.journey path{ stroke: url(#xhJourneyGrad); }

/* ---------- the territory (ivory interlude) ---------- */
.xh-intro{ --sec-bg: var(--ivory); }
.xh-intro-grid{ display:grid; gap:clamp(2.5rem, 6vw, 5rem); align-items:start; }
@media (min-width:56em){ .xh-intro-grid{ grid-template-columns:1.15fr .85fr; } }
.xh-facts{ margin-top:var(--s-4); border-top:1.5px dashed var(--dash-light); max-width:38rem; }
.xh-facts li{
  display:flex; gap:1rem; align-items:baseline;
  padding:1.05rem 0; border-bottom:1.5px dashed var(--dash-light);
  font-size:1rem; color:var(--ink);
}
.xh-facts li strong{ font-family:var(--serif); font-weight:400; font-size:1.1em; color:var(--clay-deep); white-space:nowrap; }
.xh-figure{
  border-radius:44% 56% 50% 50% / 52% 44% 56% 48%; /* river-stone blob — the day's one blob */
  overflow:hidden; aspect-ratio:4/4.6; background:var(--sand);
  transform:rotate(1.2deg);
}
.xh-figure img{ width:100%; height:112%; object-fit:cover; will-change:transform; }
.xh-caption{ margin-top:1rem; text-align:center; }

/* ---------- the five experiences (forest floor) ---------- */
.xh-index{ --sec-bg: var(--ground-exps); }

/* ---------- field plan (palm shade, lamplight) ---------- */
.xh-plan{ --sec-bg: var(--ground-stay); }
.xh-days{
  list-style:none; margin:0; padding:0;
  display:grid; gap:clamp(1.75rem, 4vw, 2.75rem);
}
@media (min-width:56em){ .xh-days{ grid-template-columns:1fr 1fr 1fr; } }
.xh-day{
  border-top:1.5px dashed rgba(243,235,219,.32);
  padding-top:1.25rem;
  display:flex; flex-direction:column; align-items:flex-start; gap:.55rem;
}
.xh-day-idx{ color:var(--bronze); }
.xh-day h3{ font-family:var(--serif); font-style:italic; font-size:var(--fs-600); color:var(--ivory); }
.xh-day p{ color:var(--khaki); font-size:.98rem; }
.xh-plan-outro{
  margin-top:clamp(2.5rem, 6vw, 4rem);
  display:flex; flex-wrap:wrap; align-items:center; gap:1.5rem;
}
.xh-plan-outro .field-note{ color:var(--khaki); }