/* ==========================================================
   mod_bhg_split – rozvržení „Akce“ (dřív mod_eventsplit 1.4.4)
   Fotka + obsah + info panel akce. Třídy mod-eventsplit / evs-* → bhg-split--event / bhg-split__*,
   barvy přes společné proměnné --bhg-* se zálohou na tokeny DEER (M1).
   ========================================================== */

.bhg-split--event {
  --bhg-split-ink:        var(--bhg-color-surface-dark, var(--c-forest-400, #23142D));
  --bhg-split-ink-2:      var(--c-forest-300, #392745);
  --bhg-split-light:      var(--bhg-color-on-dark, var(--c-surface, #F0F3FF));
  --bhg-split-accent:     var(--bhg-color-accent, var(--c-grain-400, #C2A361));
  --bhg-split-panel-bg:   color-mix(in srgb, var(--c-forest-300, #392745) 40%, var(--bhg-color-surface-dark, var(--c-forest-400, #23142D)));
  --bhg-split-border:     color-mix(in srgb, var(--c-surface, #F0F3FF) 14%, transparent);

  --bhg-split-radius:     var(--bhg-radius-card, var(--radius-card, 16px));
  --bhg-split-gap:        clamp(24px, 4vw, 56px);

  color: var(--bhg-split-light);
}

/* Pozadí se zapíná utilitou z pole „Třídy – pozadí“ (bg-forest-350 apod.),
   modul barvu nikde nedrží. Zde je jen mechanika: odsazení a breakout. */

/* Pozadí přes celou šířku obrazovky (vzorec jako .deer-events--fullbleed) */
.bhg-split--bleed {
  width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
}

/* Obsah zůstane v mřížce i když pozadí teče přes celou obrazovku */
.bhg-split--bleed .bhg-split__inner {
  padding-inline: var(--space-5, clamp(25px, 14px + 3.4vw, 48px));
  margin-inline: auto;
  max-inline-size: 1320px;
}

/* Když je pozadí zapnuté, obsah se ho nesmí dotýkat */
.bhg-split--has-bg .bhg-split__inner {
  padding-block: var(--space-5, clamp(25px, 14px + 3.4vw, 48px));
}

/* V šířce bloku vypadá pozadí lépe zaoblené; přes celou obrazovku ne. */
.bhg-split--has-bg:not(.bhg-split--bleed) {
  border-radius: var(--bhg-split-radius);
}
.bhg-split--has-bg:not(.bhg-split--bleed) .bhg-split__inner {
  padding-inline: var(--space-5, clamp(25px, 14px + 3.4vw, 48px));
}

.bhg-split--event .bhg-split__row {
  --bs-gutter-x: 0;
  column-gap: 0;
}

/* ---------- Média ---------- */
.bhg-split--event .bhg-split__media {
  height: 100%;
}
.bhg-split--event .bhg-split__img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: var(--bhg-split-radius);
  min-height: clamp(260px, 34vw, 460px);
}

/* Odsazení mezi fotkou a obsahem podle pozice */
.bhg-split--event .bhg-split__col-media.order-lg-1 .bhg-split__media { padding-right: 0; }
@media (min-width: 992px) {
  .bhg-split--event .bhg-split__col-content.order-lg-2 .bhg-split__content { padding-left: var(--bhg-split-gap); }
  .bhg-split--event .bhg-split__col-content.order-lg-1 .bhg-split__content { padding-right: var(--bhg-split-gap); }
}

/* ---------- Obsah ---------- */
.bhg-split--event .bhg-split__content {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

/* Jen mechanika. Velikost/řádkování/váhu i font (serif) má Hx centrálně
   (typography.css + template.css); barvu řeší utilita v poli „Třída nadpisu“. */
.bhg-split--event .bhg-split__heading {
  margin: 0 0 var(--bhg-space-4, var(--space-4, 1.5rem));
}

.bhg-split--event .bhg-split__text {
  color: color-mix(in srgb, var(--bhg-split-light) 82%, transparent);
  font-size: var(--bhg-fs-body, var(--typo-b1-fs, 16px));
  line-height: var(--bhg-lh-body, var(--typo-b1-lh, 24px));
  max-width: 52ch;
}
.bhg-split--event .bhg-split__text p { margin: 0 0 0.75rem; }
.bhg-split--event .bhg-split__text p:last-child { margin-bottom: 0; }
.bhg-split--event .bhg-split__text a:not(.btn) {
  color: var(--bhg-split-light);
  text-decoration: underline;
  text-underline-offset: 0.18em;
  text-decoration-thickness: 1px;
  transition: color .15s ease;
}
.bhg-split--event .bhg-split__text a:not(.btn):hover {
  color: var(--bhg-split-accent);
}

/* ---------- Info-panel události ---------- */
.bhg-split--event .bhg-split__panel {
  width: 100%;
  margin-top: clamp(24px, 3vw, 36px);
  background: var(--bhg-split-panel-bg);
  border: 0;
  border-radius: 0;
  padding: clamp(20px, 2.2vw, 28px);
}

.bhg-split--event .bhg-split__panel-label {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0 0 14px;
}
.bhg-split--event .bhg-split__panel-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: currentColor;
  flex: 0 0 auto;
}

.bhg-split--event .bhg-split__panel-meta {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 0 0 8px;
  color: var(--bhg-split-light);
  font-weight: var(--typo-w-sub, inherit);
  font-size: var(--typo-s3-fs, 18px);
  line-height: var(--typo-s3-lh, 26px);
}
.bhg-split--event .bhg-split__panel-sep {
  width: 1px;
  align-self: stretch;
  min-height: 1.1em;
  background: color-mix(in srgb, var(--bhg-split-light) 30%, transparent);
}

.bhg-split--event .bhg-split__panel-desc {
  margin: 0 0 clamp(18px, 2vw, 22px);
  color: color-mix(in srgb, var(--bhg-split-light) 70%, transparent);
  font-size: var(--bhg-fs-sm, var(--typo-c1-fs, 14px));
  line-height: var(--bhg-lh-sm, var(--typo-c1-lh, 22px));
}

/* Tlačítko používá nativní .btn systém webu (Space Mono, velikost, padding,
   uppercase, radius – vše z typography.css). Modul k němu nic nepřidává;
   variantu vybíráš v poli „Třída tlačítka“ (výchozí btn btn-canvas btn-outline).
   Jen odsazení dolů necháme na modulu. */
.bhg-split--event .bhg-split__panel-actions { margin-top: auto; }

/* Odkaz stylovaný jako tlačítko nesmí být podtržený – platí pro tlačítka kdekoli
   v modulu (panel i rich-text .bhg-split__text). Base .btn text-decoration neřeší a globální
   a:not(.btn) tlačítka vynechává => bez tohoto by padal browser-default underline. */
.bhg-split--event .btn,
.bhg-split--event .btn:hover,
.bhg-split--event .btn:focus {
  text-decoration: none;
}

/* ---------- Responsivita ---------- */
@media (max-width: 991.98px) {
  .bhg-split--event .bhg-split__content {
    padding: 0 !important;
    margin-top: clamp(20px, 5vw, 28px);
  }
  /* na mobilu fotka vždy nahoře */
  .bhg-split--event .bhg-split__col-media { order: 1 !important; }
  .bhg-split--event .bhg-split__col-content { order: 2 !important; }
}

@media (max-width: 575.98px) {
  .bhg-split--has-bg .bhg-split__inner { padding-inline: var(--bhg-space-4, var(--space-4, 1.5rem)); }
  .bhg-split--event .bhg-split__panel-actions .btn { width: 100%; }
}