/* ============================================================
   MUWAN PALASSA — Our Story (page-templates/page-our-story.php).
   The ivory interlude register. Shared chrome (buttons, bands,
   book band, ambient layer) lives in main.css; this file carries
   the hero, this page's journey stroke, the ivory family story,
   the eco-philosophy pillars and the forest stewardship passage.
   ============================================================ */

/* ---------- hero (canopy dark — the family in the trees) ---------- */
.story-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 26% 100%, rgba(192,137,78,.10), transparent 62%),
    linear-gradient(180deg, var(--night) 0%, var(--forest) 58%, var(--forest) 100%);
}
.story-hero h1{ max-width:12em; }
.story-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; }
.story-hero .hero-lede{ margin-top:var(--s-3); font-size:var(--fs-600); line-height:1.55; color:var(--khaki); max-width:34em; }
.story-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(#storyJourneyGrad); }

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

/* ---------- eco-philosophy (night tank, one warm radial) ---------- */
.story-eco{
  --sec-bg:
    radial-gradient(120% 55% at 78% 0%, rgba(192,137,78,.07), transparent 60%),
    linear-gradient(180deg, var(--night) 0%, var(--night) 62%, #17211A 100%);
}
.story-eco .section-head .field-note{ color:var(--bronze); }
.eco-grid{ display:grid; gap:clamp(1.75rem, 4.5vw, 3rem); }
@media (min-width:56em){ .eco-grid{ grid-template-columns:repeat(3, 1fr); } }
.eco-col{
  border-top:1.5px solid transparent;
  border-image: linear-gradient(90deg, #8A6238, #C9A25E 45%, rgba(201,162,94,0)) 1;
  padding-top:1.5rem;
}
.eco-col .stamp{ width:2.9rem; margin-bottom:1rem; }
.eco-col h3{ font-family:var(--serif); font-size:var(--fs-600); color:var(--ivory); }
.eco-col p{ margin-top:.8rem; color:var(--khaki); font-size:.98rem; }
.eco-col .ph-slot{ display:inline-block; margin-top:1rem; }

/* ---------- stewardship (forest floor — the neighbours) ---------- */
.story-land{
  --sec-bg:
    radial-gradient(120% 50% at 20% 0%, rgba(192,137,78,.06), transparent 60%),
    linear-gradient(180deg, #17211A 0%, var(--forest) 26%, var(--forest) 100%);
}
.story-land .section-head{ max-width:52rem; }
.land-figure{
  border-radius:var(--radius); /* soft documentary frame — no arch in the dark */
  overflow:hidden; aspect-ratio:16/8; background:var(--night);
}
@media (max-width:44em){ .land-figure{ aspect-ratio:4/3.4; } }
.land-figure img{ width:100%; height:114%; object-fit:cover; will-change:transform; }