/* Engine styles the BlackRail theme relied on (brand tokens, entry animations,
   header and footer baselines), captured from the live site. */
:root {
  --brand-primary: #57CCE6;
  --brand-accent: #E5468B;
  --brand-bg: #05101F;
  --brand-background: var(--brand-bg);
  --brand-panel: #0A1B33;
  --brand-text: #F7EBD5;
  --brand-muted: color-mix(in srgb, var(--brand-text) 62%, var(--brand-bg));
  --brand-rule: color-mix(in srgb, var(--brand-text) 17%, transparent);
  --brand-on-primary: #1A1714;
  --brand-on-accent: #FFFFFF;
  --forest: var(--brand-primary);
  --forest-deep: var(--brand-primary);
  --moss: var(--brand-primary);
  --terracotta: var(--brand-accent);
  --cream: var(--brand-bg);
  --cream-deep: var(--brand-bg);
  --sage: var(--brand-panel);
  --ink: var(--brand-text);
}
.cms-media, .cms-video-embed, .cms-media-frame {
  display: block;
  max-width: 100%;
  margin: 18px 0;
  border-radius: 12px;
}
.cms-media-image { height: auto; }
.cms-media-video,
.cms-video-embed video,
.cms-video-embed iframe,
.cms-media-frame {
  width: min(100%, 860px);
  aspect-ratio: 16 / 9;
  background: #14261B;
  border: 0;
}
.cms-map-embed {
  display: block;
  width: 100%;
  min-height: clamp(280px, 46vw, 460px);
  margin: 18px 0;
  overflow: hidden;
  border: 1px solid color-mix(in srgb, #57CCE6 18%, transparent);
  border-radius: 12px;
  background: color-mix(in srgb, #0A1B33 82%, #05101F);
}
.cms-map-embed .leaflet-container,
.cms-map-embed .leaflet-control,
.cms-map-embed .leaflet-popup-content-wrapper,
.cms-map-embed .leaflet-popup-tip {
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
.cms-map-embed .leaflet-tile { transition: filter 160ms ease; }
.cms-map-style-grayscale .leaflet-tile { filter: grayscale(1) contrast(.98); }
.cms-map-style-muted .leaflet-tile { filter: saturate(.72) contrast(.94) brightness(1.03); }
.cms-map-style-contrast .leaflet-tile { filter: contrast(1.16) saturate(.9); }
.cms-map-style-warm .leaflet-tile { filter: sepia(.24) saturate(.86) brightness(1.02); }
/* Brand-tinted maps: desaturate the tile layer, then overlay the brand colour
   in 'color' blend mode so the map adopts the hue while keeping topographic
   detail. The overlay sits on top of tiles but below leaflet controls. */
.cms-map-style-brand-primary { position: relative; isolation: isolate; }
.cms-map-style-brand-primary .leaflet-tile { filter: grayscale(.78) contrast(.96); }
.cms-map-style-brand-primary::after {
  content: ''; position: absolute; inset: 0;
  background: #57CCE6;
  mix-blend-mode: color;
  opacity: .42;
  pointer-events: none;
  z-index: 410;  /* above tile pane (200), below leaflet controls (1000) */
  border-radius: inherit;
}
.cms-map-style-brand-secondary { position: relative; isolation: isolate; }
.cms-map-style-brand-secondary .leaflet-tile { filter: grayscale(.78) contrast(.96); }
.cms-map-style-brand-secondary::after {
  content: ''; position: absolute; inset: 0;
  background: #E5468B;
  mix-blend-mode: color;
  opacity: .42;
  pointer-events: none;
  z-index: 410;
  border-radius: inherit;
}
.cms-map-embed .leaflet-control-attribution {
  background: color-mix(in srgb, #0A1B33 86%, transparent);
  color: #F7EBD5;
}
.cms-map-embed .leaflet-control-attribution a { color: #57CCE6; }

/* Entry-animation keyframes — wired up by the visual editor. */
    @keyframes site-fadeIn   { from { opacity: 0; } to { opacity: 1; } }
    @keyframes site-slideUp  { from { opacity: 0; transform: translateY(24px); } to { opacity: 1; transform: translateY(0); } }
    @keyframes site-slideDown{ from { opacity: 0; transform: translateY(-24px); } to { opacity: 1; transform: translateY(0); } }
    @keyframes site-scaleIn  { from { opacity: 0; transform: scale(0.92); } to { opacity: 1; transform: scale(1); } }

:where(.comp-site-header) { background: var(--brand-panel, #fff); border-bottom: 1px solid var(--brand-rule, rgba(0,0,0,0.08)); }
:where(.comp-site-header-inner) { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 14px clamp(18px, 4vw, 28px); max-width: 1200px; margin: 0 auto; }
:where(.comp-site-header-brand) { display: inline-flex; align-items: center; gap: 10px; color: var(--brand-text, #1F1A14); text-decoration: none; font-weight: 700; }
:where(.comp-site-header-mark) { font-size: 22px; color: var(--brand-primary, #1f3a2b); }
:where(.comp-site-header-name) { font-family: var(--brand-display-font, Fraunces, Georgia, serif); font-weight: 600; font-size: 18px; }
:where(.comp-site-header-nav) { display: inline-flex; gap: 18px; flex-wrap: wrap; }
:where(.comp-site-header-nav a) { color: var(--brand-text, #1F1A14); text-decoration: none; font-weight: 550; font-size: 15px; }
:where(.comp-site-header-nav a:hover) { color: var(--brand-accent, #B4623E); }
:where(.comp-site-header-cta) { background: var(--brand-primary, #1f3a2b); color: var(--brand-bg, #F5EFE4); text-decoration: none; padding: 9px 16px; border-radius: 8px; font-weight: 600; font-size: 14px; }
:where(.comp-site-header-cta:hover) { background: var(--brand-accent, #B4623E); }
@media (max-width: 720px) {
  :where(.comp-site-header-inner) { flex-wrap: wrap; gap: 12px 18px; }
  :where(.comp-site-header-nav) { order: 3; flex-basis: 100%; justify-content: flex-start; }
}

:where(.comp-site-footer) { background: var(--brand-panel, #fff); border-top: 1px solid var(--brand-rule, rgba(0,0,0,0.08)); margin-top: 48px; }
:where(.comp-site-footer-inner) { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 22px clamp(18px, 4vw, 28px); max-width: 1200px; margin: 0 auto; flex-wrap: wrap; }
:where(.comp-site-footer-copyright) { margin: 0; color: var(--brand-muted, rgba(31,26,20,0.62)); font-size: 14px; }
:where(.comp-site-footer-nav) { display: inline-flex; gap: 16px; flex-wrap: wrap; }
:where(.comp-site-footer-nav a) { color: var(--brand-text, #1F1A14); text-decoration: none; font-size: 14px; }
:where(.comp-site-footer-nav a:hover) { color: var(--brand-accent, #B4623E); }