/* BlockForge exported theme (light locked) — token-safe */
:root{
  --color-background:#0d131d;
  --color-surface:#111a28;
  --color-text:#d9e2ef;
  --color-accent:#7aa2ff;
  --color-accent-rgb:122,162,255;
  --color-border:#223046;

  /* common aliases (so exported CSS works even if page CSS evolves) */
  --bg: var(--color-background);
  --ink: var(--color-text);
  --accent: var(--color-accent);
  --line: var(--color-border);

  /* legacy aliases (kept for backward CSS compatibility) */
  --pageBg:#0d131d;
  --pageText:#d9e2ef;
  --pageAccent:#7aa2ff;
  --pageBorder:#223046;
}

/* Phase 7A5-c — Responsive visibility toggles (token-safe utility classes)
   Breakpoints: mobile <=720px, tablet 721–860px, desktop >=861px (Phase 5 baseline if present; safe defaults otherwise). */
@media (max-width: 720px){
  .bf-hide-mobile{ display:none !important; }
}
@media (min-width: 721px) and (max-width: 860px){
  .bf-hide-tablet{ display:none !important; }
}
@media (min-width: 861px){
  .bf-hide-desktop{ display:none !important; }
}

/* Grid (7B4): safe CSS Grid 2–6 (token-safe) */
.bfGrid{ display:grid; gap: var(--gridGap, var(--space-base)); align-items:start; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.bfGrid[data-cols="3"]{ grid-template-columns: repeat(3, minmax(0, 1fr)); }
.bfGrid[data-cols="4"]{ grid-template-columns: repeat(4, minmax(0, 1fr)); }
.bfGrid[data-cols="5"]{ grid-template-columns: repeat(5, minmax(0, 1fr)); }
.bfGrid[data-cols="6"]{ grid-template-columns: repeat(6, minmax(0, 1fr)); }
@media (max-width: 640px){ .bfGrid.stack{ grid-template-columns:1fr !important; } }

/* 7B5-a: Hero Block (composite) */
.bfHero{ position:relative; border:1px solid rgba(148,167,193,.14); background: rgba(255,255,255,.02); border-radius: var(--radius-large, 18px); overflow:hidden; }
.bfHero .bfHeroBg{ position:absolute; inset:0; opacity:.22; }
.bfHero .bfHeroBg img{ width:100%; height:100%; object-fit:cover; border:0; border-radius:0; background: transparent; }
.bfHero .bfHeroInner{ position:relative; padding: 28px; }
.bfHero[data-align="center"] .bfHeroInner{ text-align:center; }
.bfHero[data-align="right"] .bfHeroInner{ text-align:right; }
.bfHero .bfHeroInner p{ margin: 0 0 14px 0; color: rgba(217,226,239,.82); max-width: 56ch; }
.bfHero[data-align="center"] .bfHeroInner p{ margin-left:auto; margin-right:auto; }
.bfHero[data-align="right"] .bfHeroInner p{ margin-left:auto; margin-right:0; }
@media (max-width: 720px){ .bfHero .bfHeroInner{ padding: 22px; } }


/* 7C2-c: CTA Block v2 (layout + bg token) */
.bfCTA{
  display:flex;
  gap: var(--space-base);
  align-items:center;
  justify-content:space-between;
  flex-wrap:wrap;
  border:1px solid rgba(148,167,193,.14);
  border-radius: var(--radius-large, 18px);
}
.bfCTA .bfCTAText{ min-width: 220px; flex: 1 1 320px; }
.bfCTA .bfCTATitle{
  font-family: var(--font-heading, inherit);
  font-weight: 900;
  font-size: calc(var(--h3, 32px) * 0.78);
  margin: 0 0 8px 0;
}
.bfCTA .bfCTABody{
  margin: 0;
  color: rgba(217,226,239,.82);
  max-width: 72ch;
}
.bfCTA .bfCTAAction{ display:flex; align-items:center; justify-content:flex-start; }

.bfCTA[data-layout="center"]{ justify-content:center; text-align:center; }
.bfCTA[data-layout="center"] .bfCTAAction{ width:100%; justify-content:center; }
.bfCTA[data-layout="center"] .bfCTABody{ margin-left:auto; margin-right:auto; }

.bfCTA[data-layout="right"]{ justify-content:flex-end; text-align:right; }
.bfCTA[data-layout="right"] .bfCTABody{ margin-left:auto; margin-right:0; }

@media (max-width: 720px){
  .bfCTA .bfCTAText{ flex: 1 1 100%; }
  .bfCTA .bfCTAAction{ width:100%; justify-content:flex-start; }
  .bfCTA[data-layout="center"] .bfCTAAction{ justify-content:center; }
  .bfCTA[data-layout="right"] .bfCTAAction{ justify-content:flex-end; }
}
