/* ======================================================================
   MIGRATION P9 — FERMENTIERLUST EXPERIENCE DESIGN
   Canonical visual-experience layer. This file is intentionally loaded
   after layout/content CSS so atmosphere and interaction stay separated
   from geometry, commerce logic and editorial content.
   ====================================================================== */

:root {
  --xp-purple-haze: rgba(84,22,80,.075);
  --xp-rose-haze: rgba(186,120,168,.105);
  --xp-green-haze: rgba(176,200,153,.13);
  --xp-cream-glow: rgba(245,241,197,.24);
  --xp-shadow-soft: 0 22px 64px rgba(59,38,53,.075);
  --xp-shadow-hover: 0 28px 76px rgba(59,38,53,.12);
}

/* ---------- 01. Site rhythm: editorial seams instead of stacked blocks ---------- */
body.xp-experience main > .section,
body.xp-experience main > .page-hero,
body.xp-experience main > .hero,
body.xp-experience main > .voucher-hero,
body.xp-experience main > .booking-success__hero {
  position: relative;
}

body.xp-experience main > .section:not(.section--purple):not(.reviews-section):not(.region-positioning)::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: 0;
  width: min(86vw, 1040px);
  height: 1px;
  transform: translateX(-50%);
  background: linear-gradient(90deg, transparent, rgba(84,22,80,.08) 18%, rgba(84,22,80,.08) 82%, transparent);
  pointer-events: none;
}
body.xp-experience main > .section:last-of-type::after,
body.xp-experience .final-cta::after { display: none; }

/* ---------- 02. Fermentation signature: a tiny jar + bubbles ---------- */
body.xp-experience .page-hero .eyebrow,
body.xp-experience .hero-copy .eyebrow,
body.xp-experience .voucher-copy .eyebrow {
  position: relative;
  padding-left: 28px;
}
body.xp-experience .page-hero .eyebrow::before,
body.xp-experience .hero-copy .eyebrow::before,
body.xp-experience .voucher-copy .eyebrow::before {
  content: "";
  position: absolute;
  left: 2px;
  top: 50%;
  width: 12px;
  height: 15px;
  transform: translateY(-48%);
  border: 1.5px solid currentColor;
  border-radius: 2px 2px 5px 5px;
  opacity: .72;
  box-shadow: inset 0 5px 0 -4px currentColor;
}
body.xp-experience .page-hero .eyebrow::after,
body.xp-experience .hero-copy .eyebrow::after,
body.xp-experience .voucher-copy .eyebrow::after {
  content: "";
  position: absolute;
  left: 6px;
  top: calc(50% + 2px);
  width: 2px;
  height: 2px;
  border-radius: 50%;
  background: currentColor;
  opacity: .55;
  box-shadow: 4px -4px 0 currentColor, 6px 2px 0 currentColor;
}

/* ---------- 03. Hero: glass/brine depth without scaling the layout ---------- */
body.xp-experience .hero,
body.xp-experience .page-hero,
body.xp-experience .voucher-hero {
  overflow: clip;
  isolation: isolate;
}
body.xp-experience .hero::after,
body.xp-experience .page-hero::after,
body.xp-experience .voucher-hero::after {
  content: "";
  position: absolute;
  width: clamp(180px, 19vw, 300px);
  aspect-ratio: 1;
  right: clamp(-150px, -8vw, -70px);
  bottom: clamp(-150px, -8vw, -80px);
  border-radius: 50%;
  border: 1px solid rgba(84,22,80,.08);
  box-shadow:
    0 0 0 28px rgba(176,200,153,.055),
    0 0 0 58px rgba(186,120,168,.04);
  pointer-events: none;
  z-index: 0;
}
body.xp-experience .hero-grid,
body.xp-experience .page-hero__grid,
body.xp-experience .voucher-grid { position: relative; z-index: 2; }

body.xp-experience .hero-media,
body.xp-experience .page-hero__media,
body.xp-experience .voucher-preview,
body.xp-experience .experience-media,
body.xp-experience .about-person__media,
body.xp-experience .knowledge-featured__media,
body.xp-experience .equipment-affiliate-media {
  position: relative;
  box-shadow: var(--xp-shadow-soft);
  transition: box-shadow 420ms var(--ease-out), border-radius 420ms var(--ease-out);
}
body.xp-experience .hero-media::before,
body.xp-experience .page-hero__media::before,
body.xp-experience .experience-media::before,
body.xp-experience .about-person__media::before,
body.xp-experience .knowledge-featured__media::before,
body.xp-experience .equipment-affiliate-media::before {
  content: "";
  position: absolute;
  inset: 12px;
  z-index: 2;
  border: 1px solid rgba(255,255,255,.34);
  border-radius: inherit;
  pointer-events: none;
  opacity: .68;
  transform: translate3d(var(--xp-pointer-x,0), var(--xp-pointer-y,0), 0);
  transition: transform 180ms ease-out, opacity 280ms ease;
}
@media (hover:hover) and (pointer:fine) {
  body.xp-experience .hero-media:hover,
  body.xp-experience .page-hero__media:hover,
  body.xp-experience .experience-media:hover,
  body.xp-experience .about-person__media:hover,
  body.xp-experience .knowledge-featured__media:hover,
  body.xp-experience .equipment-affiliate-media:hover { box-shadow: var(--xp-shadow-hover); }
}

/* ---------- 04. Real scroll choreography — visible without JS, animated with JS ---------- */
body.xp-public-page [data-reveal] { will-change: opacity, transform, clip-path; }
html.js.reveal-ready body.xp-public-page [data-reveal]:not(.is-visible) {
  opacity: 0;
  transform: translate3d(0, 18px, 0);
}
html.js.reveal-ready body.xp-public-page [data-reveal="scale"]:not(.is-visible) {
  transform: translate3d(0, 12px, 0) scale(.985);
}
html.js.reveal-ready body.xp-public-page [data-reveal="clip"]:not(.is-visible) {
  opacity: .12;
  transform: translate3d(0, 14px, 0) scale(.992);
  clip-path: inset(5% 0 5% 0 round 22px);
}
html.js.reveal-ready body.xp-public-page [data-reveal].is-visible {
  opacity: 1;
  transform: translate3d(0,0,0) scale(1);
  clip-path: inset(0 0 0 0 round 0);
  transition: opacity 620ms var(--ease-out), transform 720ms var(--ease-out), clip-path 760ms var(--ease-out);
}

/* ---------- 05. Cards: less template, more tactile objects ---------- */
body.xp-experience :is(.principle-card,.format-card,.why-item,.knowledge-card,.knowledge-category,.equipment-category,.equipment-product-card,.review-card,.social-proof-card,.legal-block,.voucher-flow article,.cart-item,.checkout-card,.checkout-review-card) {
  position: relative;
}
body.xp-experience :is(.principle-card,.format-card,.knowledge-card,.knowledge-category,.equipment-category,.equipment-product-card,.review-card,.voucher-flow article) {
  transition: transform 360ms var(--ease-out), box-shadow 360ms var(--ease-out), border-color 260ms ease;
}
@media (hover:hover) and (pointer:fine) {
  body.xp-experience :is(.principle-card,.format-card,.knowledge-card,.knowledge-category,.equipment-category,.equipment-product-card,.review-card,.voucher-flow article):hover {
    transform: translateY(-5px);
    box-shadow: var(--xp-shadow-hover);
    border-color: rgba(84,22,80,.18);
  }
  body.xp-experience :is(.principle-card,.format-card,.knowledge-card,.voucher-flow article):hover .h3 { color: var(--fl-purple-dark); }
}

/* A changing rhythm across repetitive grids without changing their information order. */
@media (min-width: 821px) {
  body.xp-experience .principle-grid > :nth-child(even),
  body.xp-experience .format-grid > :nth-child(2),
  body.xp-experience .review-grid > :nth-child(2) { translate: 0 12px; }
}

/* ---------- 06. Section-specific visual language ---------- */
body.xp-experience .section--cream {
  background-image:
    radial-gradient(circle at 91% 14%, rgba(186,120,168,.08) 0 5px, transparent 6px),
    radial-gradient(circle at 94% 22%, rgba(176,200,153,.11) 0 10px, transparent 11px),
    linear-gradient(180deg, rgba(255,255,255,.13), transparent 38%);
}
body.xp-experience .section--green-soft {
  background-image:
    radial-gradient(circle at 7% 18%, rgba(84,22,80,.055) 0 4px, transparent 5px),
    radial-gradient(circle at 11% 29%, rgba(255,255,255,.36) 0 8px, transparent 9px),
    linear-gradient(145deg, rgba(255,255,255,.16), transparent 54%);
}
body.xp-experience .section--purple {
  background-image:
    radial-gradient(circle at 88% 18%, rgba(245,241,197,.14) 0 4px, transparent 5px),
    radial-gradient(circle at 92% 30%, rgba(176,200,153,.17) 0 8px, transparent 9px),
    linear-gradient(150deg, rgba(255,255,255,.025), transparent 48%);
}

body.xp-experience .inline-cta,
body.xp-experience .team-contact-card {
  position: relative;
  overflow: hidden;
  box-shadow: var(--xp-shadow-soft);
}
body.xp-experience .inline-cta::after,
body.xp-experience .team-contact-card::after {
  content: "";
  position: absolute;
  right: -40px;
  bottom: -52px;
  width: 130px;
  height: 130px;
  border-radius: 50%;
  border: 1px solid rgba(245,241,197,.18);
  box-shadow: 0 0 0 22px rgba(176,200,153,.06), 0 0 0 44px rgba(245,241,197,.035);
  pointer-events: none;
}

/* ---------- 07. Knowledge + equipment: editorial navigation ---------- */
body.xp-page-wissen .knowledge-category__number,
body.xp-page-equipment .equipment-category__kicker { transition: letter-spacing 260ms ease, color 260ms ease; }
@media (hover:hover) and (pointer:fine) {
  body.xp-page-wissen .knowledge-category:hover .knowledge-category__number { color: var(--fl-purple); }
  body.xp-page-equipment .equipment-category:hover .equipment-category__kicker { letter-spacing: .16em; }
}
body.xp-page-wissen .knowledge-topic-list .is-live a::after,
body.xp-page-equipment .equipment-category__knowledge::after {
  transition: transform 220ms var(--ease-out);
}
body.xp-page-equipment .equipment-category__knowledge::after { content: "→"; }
@media (hover:hover) and (pointer:fine) {
  body.xp-page-wissen .knowledge-topic-list .is-live a:hover::after,
  body.xp-page-equipment .equipment-category__knowledge:hover::after { transform: translateX(4px); }
}

/* ---------- 08. About / people: softer editorial portrait framing ---------- */
body.xp-page-about .about-person { position: relative; }
body.xp-page-about .about-person::before {
  content: "";
  position: absolute;
  width: 110px;
  height: 110px;
  border-radius: 50%;
  border: 1px solid rgba(84,22,80,.085);
  top: -22px;
  right: 42%;
  box-shadow: 28px 64px 0 -34px rgba(176,200,153,.18), -36px 28px 0 -41px rgba(186,120,168,.2);
  pointer-events: none;
}

/* ---------- 09. Contact: calm, physical form object ---------- */
body.xp-page-contact .contact-form {
  box-shadow: var(--xp-shadow-soft);
  border-color: rgba(84,22,80,.1);
}
body.xp-page-contact .contact-form :is(input,select,textarea) {
  transition: border-color 180ms ease, box-shadow 180ms ease, background 180ms ease;
}
body.xp-page-contact .contact-form :is(input,select,textarea):hover { background: rgba(255,253,248,.72); }

/* ---------- 10. Commerce: premium but quieter than marketing pages ---------- */
body.xp-page-cart .checkout-shell,
body.xp-page-checkout .checkout-shell {
  position: relative;
  overflow: clip;
  background:
    radial-gradient(circle at 92% 7%, rgba(176,200,153,.12), transparent 19%),
    radial-gradient(circle at 5% 28%, rgba(186,120,168,.08), transparent 17%),
    #fffdf8;
}
body.xp-page-cart .cart-item,
body.xp-page-checkout :is(.checkout-card,.checkout-review-card,.order-review-board) {
  box-shadow: 0 12px 38px rgba(59,38,53,.055);
}
@media (hover:hover) and (pointer:fine) {
  body.xp-page-cart .cart-item:hover { border-color: rgba(84,22,80,.2); box-shadow: 0 18px 48px rgba(59,38,53,.08); }
}
body.xp-page-success .booking-success__hero {
  background:
    radial-gradient(circle at 8% 18%, rgba(186,120,168,.09) 0 5px, transparent 6px),
    radial-gradient(circle at 13% 28%, rgba(176,200,153,.12) 0 10px, transparent 11px),
    linear-gradient(145deg,#fffdf8 25%,#f5f1e7 100%);
}
body.xp-page-success .booking-success__image::after {
  content: "";
  position: absolute;
  inset: 14px;
  border: 1px solid rgba(255,255,255,.34);
  border-radius: 28px 100px 28px 28px;
  pointer-events: none;
}

/* ---------- 11. Frozen event detail: experience only, no composition rewrite ---------- */
body.xp-page-event .event-v2-hero,
body.xp-page-event .event-v2-booking,
body.xp-page-event .event-v2-aftercare { position: relative; overflow: clip; }
body.xp-page-event .event-v2-hero::after,
body.xp-page-event .event-v2-booking::before {
  content: "";
  position: absolute;
  width: 170px;
  height: 170px;
  border-radius: 50%;
  border: 1px solid rgba(84,22,80,.075);
  box-shadow: 0 0 0 24px rgba(176,200,153,.05), 0 0 0 48px rgba(186,120,168,.035);
  pointer-events: none;
}
body.xp-page-event .event-v2-hero::after { right: -90px; top: 50px; }
body.xp-page-event .event-v2-booking::before { left: -110px; bottom: -70px; }
body.xp-page-event .event-v2-booking__card { box-shadow: var(--xp-shadow-soft); }

/* ---------- 12. Header/footer micro polish ---------- */
body.xp-experience .site-header { border-bottom-color: rgba(84,22,80,.075); }
body.xp-experience .desktop-nav a { position: relative; }
body.xp-experience .desktop-nav a:not(.btn)::after {
  content: "";
  position: absolute;
  left: 0;
  right: 100%;
  bottom: -5px;
  height: 1px;
  background: var(--fl-purple);
  transition: right 240ms var(--ease-out);
}
@media (hover:hover) and (pointer:fine) {
  body.xp-experience .desktop-nav a:not(.btn):hover::after,
  body.xp-experience .desktop-nav a[aria-current="page"]::after { right: 0; }
}

/* ---------- 13. Responsive / accessibility ---------- */
@media (max-width: 820px) {
  body.xp-experience main > .section:not(.section--purple):not(.reviews-section):not(.region-positioning)::after { width: calc(100% - 40px); }
  body.xp-experience .principle-grid > :nth-child(even),
  body.xp-experience .format-grid > :nth-child(2),
  body.xp-experience .review-grid > :nth-child(2) { translate: none; }
  body.xp-page-about .about-person::before { display:none; }
}
@media (max-width: 560px) {
  body.xp-experience .hero::after,
  body.xp-experience .page-hero::after,
  body.xp-experience .voucher-hero::after { opacity:.55; }
  body.xp-experience .page-hero .eyebrow,
  body.xp-experience .hero-copy .eyebrow,
  body.xp-experience .voucher-copy .eyebrow { padding-left:24px; }
}
@media (hover:none), (pointer:coarse) {
  body.xp-experience :is(.principle-card,.format-card,.knowledge-card,.knowledge-category,.equipment-category,.equipment-product-card,.review-card,.voucher-flow article):hover { transform:none; box-shadow:inherit; }
}
@media (prefers-reduced-motion: reduce) {
  html.js.reveal-ready body.xp-public-page [data-reveal],
  html.js.reveal-ready body.xp-public-page [data-reveal]:not(.is-visible),
  html.js.reveal-ready body.xp-public-page [data-reveal].is-visible {
    opacity:1 !important;
    transform:none !important;
    clip-path:none !important;
    transition:none !important;
  }
  body.xp-experience .hero-media::before,
  body.xp-experience .page-hero__media::before,
  body.xp-experience .experience-media::before,
  body.xp-experience .about-person__media::before,
  body.xp-experience .knowledge-featured__media::before,
  body.xp-experience .equipment-affiliate-media::before { transform:none !important; transition:none !important; }
}

/* ========================================================================== */
/* P11 DESIGN CONSOLIDATION — public editorial system                         */
/* ========================================================================== */

html { scroll-padding-top: calc(var(--nav-height) + 18px); }
[id] { scroll-margin-top: calc(var(--nav-height) + 18px); }

/* Header / dropdown proportions */
body.xp-experience .nav-dropdown__panel {
  width: min(286px, calc(100vw - 32px));
  padding: 8px;
  border-radius: 16px;
}
body.xp-experience .nav-dropdown__panel a {
  gap: 1px;
  padding: 10px 12px;
  border-radius: 11px;
}
body.xp-experience .nav-dropdown__panel small { font-size: 10.5px; }


/* Homepage: one coherent proof block instead of stacked rating modules */
.home-voices { background: #eef3e9; }
.home-voices__grid { display:grid; grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr); gap:clamp(42px,7vw,92px); align-items:start; }
.home-voices__lead blockquote { margin:14px 0 14px; max-width:14ch; font:500 clamp(38px,5vw,66px)/.98 var(--font-display); color:var(--fl-purple-dark); }
.home-voices__lead>p:last-of-type { color:var(--fl-ink-soft); }
.home-voices__links { display:flex; flex-wrap:wrap; gap:18px; margin-top:28px; }
.home-voices__quotes { display:grid; gap:0; border-top:1px solid rgba(84,22,80,.15); }
.home-voices__quotes figure { margin:0; padding:22px 0; border-bottom:1px solid rgba(84,22,80,.15); }
.home-voices__quotes blockquote { margin:0 0 9px; font:500 clamp(24px,2.8vw,34px)/1.08 var(--font-display); }
.home-voices__quotes figcaption { color:var(--fl-ink-soft); font-size:12px; }
.region-positioning__grid--compact { grid-template-columns:minmax(0,.82fr) minmax(0,1fr); gap:clamp(36px,7vw,86px); align-items:end; }
.region-positioning__grid--compact .lead { margin-top:0; }
@media(max-width:800px){ .home-voices__grid,.region-positioning__grid--compact{grid-template-columns:1fr} }

/* Knowledge hub: magazine index, not dashboard */
.knowledge-library-head { display:grid; grid-template-columns:minmax(0,.85fr) minmax(260px,.6fr); gap:clamp(36px,7vw,88px); align-items:end; margin-bottom:48px; }
.knowledge-library-head>p { margin:0; color:var(--fl-ink-soft); line-height:1.7; }
.knowledge-editorial-list { border-top:1px solid rgba(84,22,80,.16); }
.knowledge-editorial-topic { display:grid; grid-template-columns:minmax(250px,.62fr) minmax(0,1.2fr); gap:clamp(30px,5vw,70px); padding:clamp(30px,4vw,48px) 0; border-bottom:1px solid rgba(84,22,80,.16); }
.knowledge-editorial-topic__intro { position:relative; }
.knowledge-editorial-topic__intro .knowledge-category__number { display:inline-grid; place-items:center; width:42px; height:42px; margin-bottom:22px; border-radius:50%; background:var(--fl-purple-dark); color:var(--fl-cream); font:500 17px/1 var(--font-display); }
.knowledge-editorial-topic__intro .h2 { margin:4px 0 14px; max-width:10ch; }
.knowledge-editorial-topic__intro>p:last-child { max-width:42ch; color:var(--fl-ink-soft); line-height:1.65; }
.knowledge-topic-list--editorial { margin:0; padding:0; list-style:none; border-top:1px solid rgba(84,22,80,.10); }
.knowledge-topic-list--editorial .is-live a { min-height:64px; padding:15px 0; }
.knowledge-topic-list--editorial .is-live a span { font-size:clamp(20px,2vw,26px); }
.knowledge-topic-list--editorial .is-featured a { padding:20px 0; }
.knowledge-topic-list--editorial .is-featured a span { color:var(--fl-purple-dark); font-size:clamp(24px,2.5vw,32px); }
.knowledge-category__art { display:none !important; }
@media(max-width:820px){ .knowledge-library-head,.knowledge-editorial-topic{grid-template-columns:1fr}.knowledge-editorial-topic{gap:24px}.knowledge-editorial-topic__intro .h2{max-width:none} }

/* Article template: editorial knowledge page */
.knowledge-article { padding:clamp(28px,4vw,52px) 0 clamp(72px,9vw,126px); background:var(--fl-surface); }
.article-shell { max-width:1040px; }
.article-breadcrumb { display:flex; flex-wrap:wrap; gap:8px; margin-bottom:34px; color:var(--fl-ink-soft); font-size:12px; }
.article-breadcrumb a { color:inherit; text-decoration:none; }
.article-hero { display:grid; grid-template-columns:minmax(0,1fr) minmax(320px,.7fr); gap:clamp(34px,5vw,64px); align-items:center; }
.article-hero__copy .display { max-width:14ch; font-size:clamp(42px,5vw,64px); line-height:.98; }
.article-hero__copy .lead { max-width:58ch; margin-top:20px; }
.article-freshness { margin-top:22px; font:600 10px/1.2 var(--font-accent); letter-spacing:.12em; text-transform:uppercase; color:var(--fl-ink-soft); }
.article-media { margin:0; overflow:hidden; aspect-ratio:4/3; max-height:420px; border-radius:28px 62px 28px 28px; background:#eee9e3; }
.article-media img { width:100%; height:100%; object-fit:cover; }
.article-answer { display:grid; grid-template-columns:145px minmax(0,1fr); gap:26px; align-items:start; margin:clamp(34px,5vw,58px) 0; padding:24px 0; border-top:1px solid rgba(84,22,80,.18); border-bottom:1px solid rgba(84,22,80,.18); }
.article-answer>span { font:600 10px/1.2 var(--font-accent); letter-spacing:.13em; text-transform:uppercase; color:var(--fl-purple); }
.article-answer p { margin:0; max-width:48ch; font:500 clamp(24px,2.7vw,34px)/1.12 var(--font-display); color:var(--fl-purple-dark); }
.article-content { display:grid; gap:0; }
.article-section { display:grid; grid-template-columns:minmax(205px,.5fr) minmax(0,1fr); gap:clamp(28px,5vw,66px); padding:clamp(30px,4.2vw,52px) 0; border-bottom:1px solid rgba(84,22,80,.12); }
.article-section__heading>span { display:block; margin-bottom:18px; color:var(--fl-purple); font:600 10px/1 var(--font-accent); letter-spacing:.13em; }
.article-section__heading h2 { margin:0; max-width:13ch; font:500 clamp(30px,3.5vw,44px)/1.02 var(--font-display); }
.article-section__body { max-width:700px; }
.article-section__body>p { margin:0 0 18px; color:var(--fl-ink-soft); font-size:16px; line-height:1.78; }
.article-section__body>h3 { margin:26px 0 10px; font:500 25px/1.1 var(--font-display); }
.article-list { display:grid; gap:0; margin:26px 0 0; padding:0; list-style:none; border-top:1px solid rgba(84,22,80,.11); }
.article-list li { display:grid; grid-template-columns:26px 1fr; gap:12px; padding:14px 0; border-bottom:1px solid rgba(84,22,80,.11); line-height:1.55; }
.article-list li>span:first-child { display:grid; place-items:center; width:22px; height:22px; border-radius:50%; background:#e5eddc; color:var(--fl-green); font-size:12px; font-weight:800; }
.article-note { margin:28px 0 0; padding:24px 26px; border-radius:22px; background:#f3eee5; }
.article-note__label { display:block; margin-bottom:9px; font:600 10px/1.2 var(--font-accent); letter-spacing:.13em; text-transform:uppercase; color:var(--fl-purple); }
.article-note strong { display:block; margin-bottom:7px; font:500 27px/1.08 var(--font-display); }
.article-note p { margin:0; color:var(--fl-ink-soft); line-height:1.65; }
.article-faq { display:grid; grid-template-columns:minmax(205px,.5fr) minmax(0,1fr); gap:clamp(28px,5vw,66px); padding:clamp(36px,4.5vw,58px) 0; }
.article-faq__head h2 { margin:5px 0 0; max-width:12ch; font:500 clamp(30px,3.5vw,44px)/1.02 var(--font-display); }
.article-faq__items { border-top:1px solid rgba(84,22,80,.14); }
.article-faq details { border-bottom:1px solid rgba(84,22,80,.14); }
.article-faq summary { padding:17px 0; cursor:pointer; font:500 clamp(20px,2.2vw,26px)/1.15 var(--font-display); }
.article-faq details p { margin:0; padding:0 0 22px; color:var(--fl-ink-soft); line-height:1.7; }
.article-sources { display:grid; grid-template-columns:220px 1fr; gap:36px; padding:28px 0; border-top:1px solid rgba(84,22,80,.14); border-bottom:1px solid rgba(84,22,80,.14); }
.article-sources>div { display:grid; gap:6px; }.article-sources>div strong{font:500 24px/1.05 var(--font-display)}
.article-sources ul { margin:0; padding:0; list-style:none; }.article-sources li+li{margin-top:10px}.article-sources a{color:var(--fl-purple-dark);text-underline-offset:4px}
.article-related { margin-top:clamp(56px,8vw,100px); }
.article-related__head { display:flex; justify-content:space-between; gap:30px; align-items:end; margin-bottom:24px; }
.article-related__head .h2 { max-width:13ch; }
.article-related__grid { display:grid; grid-template-columns:repeat(3,1fr); gap:0; border-top:1px solid rgba(84,22,80,.14); border-bottom:1px solid rgba(84,22,80,.14); }
.article-related__card { display:grid; align-content:space-between; min-height:190px; padding:22px 22px 20px; color:var(--fl-ink); text-decoration:none; }
.article-related__card+.article-related__card { border-left:1px solid rgba(84,22,80,.14); }
.article-related__card>span { font:600 10.5px/1.2 var(--font-accent); letter-spacing:.1em; text-transform:uppercase; color:var(--fl-purple); }
.article-related__card strong { margin:18px 0; font:500 23px/1.1 var(--font-display); }
.article-related__card small { color:var(--fl-purple-dark); font-weight:700; }
.article-workshop-cta { margin-top:54px; }
.article-back { margin:26px 0 0; }
@media(max-width:900px){ .article-hero,.article-section,.article-faq{grid-template-columns:1fr}.article-media{max-width:620px;aspect-ratio:16/10;border-radius:28px}.article-answer{grid-template-columns:1fr;gap:12px}.article-section{gap:18px}.article-section__heading h2,.article-faq__head h2{max-width:none}.article-sources{grid-template-columns:1fr}.article-related__grid{grid-template-columns:1fr}.article-related__card+.article-related__card{border-left:0;border-top:1px solid rgba(84,22,80,.14)} }

/* Event detail: experience first, keep signature story, reduce dead space */
body.xp-page-event .event-v2-hero { padding:clamp(42px,6vw,78px) 0 clamp(52px,7vw,86px); }
body.xp-page-event .event-v2-hero__grid { grid-template-columns:minmax(0,.74fr) minmax(430px,.9fr); gap:clamp(44px,7vw,92px); align-items:center; }
body.xp-page-event .event-v2-hero__copy .display { max-width:10ch; font-size:clamp(58px,6.2vw,84px); }
body.xp-page-event .event-v2-hero__lead { max-width:48ch; }
body.xp-page-event .event-v2-hero__media { min-height:470px; border-radius:30px 90px 30px 30px; }
body.xp-page-event .event-v2-hero__meta { margin-top:22px; }
body.xp-page-event .event-v2-hero__booking { margin-top:22px; padding-top:18px; }
body.xp-page-event .event-v21-experience__layout { gap:clamp(38px,6vw,78px); }
body.xp-page-event .event-v2-results { padding-top:clamp(62px,8vw,108px); padding-bottom:clamp(62px,8vw,108px); }
body.xp-page-event .event-v2-section-intro--split { align-items:end; margin-bottom:34px; }
body.xp-page-event .event-v24-results__grid { gap:22px; }
body.xp-page-event .event-v24-result-card { min-height:430px; }
body.xp-page-event .event-v23-story__stage { min-height:520px; }
body.xp-page-event .event-v23-story__panel { max-width:460px; padding:34px; }
@media(min-width:861px){ body.xp-page-event .event-v23-location__header { grid-template-columns:minmax(0,.82fr) minmax(220px,.35fr); gap:46px; } }
body.xp-page-event .event-v23-location__panorama { max-height:430px; aspect-ratio:16/7; }
body.xp-page-event .event-v23-location__panorama img { width:100%; height:100%; object-fit:cover; }
body.xp-page-event .event-v2-booking__card { border-radius:30px; }
body.xp-page-event .event-v2-aftercare { padding-top:46px; padding-bottom:58px; }
@media(max-width:900px){ body.xp-page-event .event-v2-hero__grid{grid-template-columns:1fr} body.xp-page-event .event-v2-hero__media{min-height:360px} }


/* Workshop results: editorial outcomes instead of overlapping promo cards */
body.xp-page-event .event-v24-results__grid {
  display:grid;
  grid-template-columns:1fr;
  gap:0;
  border-top:1px solid rgba(84,22,80,.16);
}
body.xp-page-event .event-v24-result-card,
body.xp-page-event .event-v24-result-card--second {
  display:grid;
  grid-template-columns:minmax(300px,.82fr) minmax(0,1fr);
  gap:clamp(30px,6vw,78px);
  align-items:center;
  min-height:0;
  margin:0;
  padding:30px 0;
  border-bottom:1px solid rgba(84,22,80,.16);
}
body.xp-page-event .event-v24-result-card figure,
body.xp-page-event .event-v24-result-card--second figure {
  margin:0;
  aspect-ratio:16/10;
  max-height:300px;
  border-radius:24px;
  box-shadow:none;
}
body.xp-page-event .event-v24-result-card--second figure { order:2; }
body.xp-page-event .event-v24-result-card--second .event-v24-result-card__copy { order:1; }
body.xp-page-event .event-v24-result-card__copy,
body.xp-page-event .event-v24-result-card--second .event-v24-result-card__copy {
  width:auto;
  margin:0;
  padding:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
  backdrop-filter:none;
}
body.xp-page-event .event-v24-result-card__copy h3 {
  max-width:11ch;
  font-size:clamp(38px,4.2vw,58px);
}
body.xp-page-event .event-v24-result-card__copy p { max-width:48ch; font-size:15px; line-height:1.7; }
body.xp-page-event .event-v24-benefit-rail {
  display:flex;
  flex-wrap:wrap;
  gap:0;
  margin-top:28px;
  padding:0;
  overflow:visible;
  border-top:1px solid rgba(84,22,80,.12);
}
body.xp-page-event .event-v24-benefit-rail span {
  flex:1 1 220px;
  padding:13px 20px 13px 0;
  border:0;
  border-bottom:1px solid rgba(84,22,80,.12);
  border-radius:0;
  background:transparent;
  font-size:13px;
  font-weight:600;
}
@media(max-width:760px){
  body.xp-page-event .event-v24-result-card,
  body.xp-page-event .event-v24-result-card--second{grid-template-columns:1fr;gap:20px;padding:24px 0}
  body.xp-page-event .event-v24-result-card--second figure,
  body.xp-page-event .event-v24-result-card--second .event-v24-result-card__copy{order:initial}
  body.xp-page-event .event-v24-result-card figure,
  body.xp-page-event .event-v24-result-card--second figure{max-height:none;aspect-ratio:4/3}
}

/* Legal AGB layout */
.legal-agb-layout { display:grid; grid-template-columns:220px minmax(0,1fr); gap:clamp(40px,7vw,96px); align-items:start; }
.legal-agb-nav { position:sticky; top:calc(var(--nav-height) + 24px); display:grid; gap:4px; }
.legal-agb-nav a { padding:10px 0; color:var(--fl-purple-dark); text-decoration:none; border-bottom:1px solid rgba(84,22,80,.12); }
.legal-agb-content { display:grid; gap:54px; }
.legal-agb-document { padding-bottom:50px; border-bottom:1px solid rgba(84,22,80,.14); }
.legal-agb-document__head { display:flex; justify-content:space-between; gap:28px; align-items:end; }
.legal-agb-document__head p { color:var(--fl-ink-soft); }
.legal-source-pending { margin-top:28px; padding:24px; border-radius:20px; background:#f3eee5; }
.legal-source-pending strong { display:block; margin-bottom:8px; font:500 25px/1.08 var(--font-display); }
.legal-source-pending p { margin:0; color:var(--fl-ink-soft); line-height:1.65; }
.legal-review-note { padding:30px; border-radius:24px; background:#eef3e9; }
.legal-review-note .h3 { max-width:19ch; }
@media(max-width:800px){ .legal-agb-layout{grid-template-columns:1fr}.legal-agb-nav{position:static;grid-template-columns:1fr 1fr}.legal-agb-document__head{align-items:flex-start;flex-direction:column} }


/* P11.1 — editorial reduction after visual audit */
.brand-panel__actions { display:flex; flex-wrap:wrap; align-items:center; gap:18px; margin-top:26px; }
.brand-panel__knowledge-link { color:var(--fl-cream); text-underline-offset:5px; }
body.xp-page-home .brand-panel { padding-top:clamp(62px,8vw,108px); padding-bottom:clamp(62px,8vw,108px); }
body.xp-page-home .gallery-section { padding-top:clamp(58px,7vw,92px); }

body.xp-page-event .event-v2-audience { padding-top:clamp(58px,7vw,96px); padding-bottom:clamp(58px,7vw,96px); }
body.xp-page-event .event-v2-audience__grid {
  display:grid;
  grid-template-columns:minmax(280px,.72fr) minmax(0,1fr);
  gap:clamp(44px,8vw,108px);
  align-items:start;
}
body.xp-page-event .event-v2-audience__intro .h2 { max-width:10ch; }
body.xp-page-event .event-v2-audience__intro .lead { max-width:52ch; margin-top:18px; }
body.xp-page-event .event-v2-audience__facts { border-top:1px solid rgba(84,22,80,.16); }
body.xp-page-event .event-v2-audience__facts>div {
  display:grid;
  grid-template-columns:160px 1fr;
  gap:24px;
  padding:22px 0;
  border-bottom:1px solid rgba(84,22,80,.16);
}
body.xp-page-event .event-v2-audience__facts span {
  color:var(--fl-purple);
  font:600 10px/1.3 var(--font-accent);
  letter-spacing:.12em;
  text-transform:uppercase;
}
body.xp-page-event .event-v2-audience__facts p { margin:0; color:var(--fl-ink-soft); line-height:1.7; }
@media(max-width:820px){
  body.xp-page-event .event-v2-audience__grid{grid-template-columns:1fr;gap:28px}
  body.xp-page-event .event-v2-audience__intro .h2{max-width:none}
  body.xp-page-event .event-v2-audience__facts>div{grid-template-columns:1fr;gap:8px}
}


/* P11 visual red-team fixes — systemic mobile containment */
@media(max-width:900px){
  body.xp-page-event .event-v2-hero__media{
    width:100%;
    min-width:0;
    min-height:0;
    height:clamp(300px,82vw,360px);
    aspect-ratio:auto;
  }
}

/* Keep the long AGB compound heading readable on narrow viewports. */
@media(max-width:560px){
  .legal-page--agb .legal-hero .display{
    font-size:clamp(32px,9.5vw,38px);
    line-height:1;
    overflow-wrap:normal;
    hyphens:none;
  }
}