{
  "version": 3,
  "sources": ["src/app/features/home/blocks/hero-banner-block/hero-banner-block.component.css"],
  "sourcesContent": ["/* ── Section wrapper ──────────────────────────────────────────────────────── */\n.hero-banner {\n  position: relative;\n  overflow: hidden;\n  min-height: 420px;\n  display: flex;\n  align-items: center;\n}\n\n/* ── Background image + overlay ──────────────────────────────────────────── */\n.hero-banner__background {\n  position: absolute;\n  inset: 0;\n  z-index: 0;\n}\n\n.hero-banner__image {\n  object-fit: cover;\n}\n\n.hero-banner__overlay {\n  position: absolute;\n  inset: 0;\n  background: linear-gradient(\n    90deg,\n    color-mix(in srgb, var(--color-surface-inverse) 72%, transparent) 0%,\n    color-mix(in srgb, var(--color-surface-inverse) 20%, transparent) 100%\n  );\n}\n\n/* ── Content wrapper ─────────────────────────────────────────────────────── */\n.hero-banner__inner {\n  position: relative;\n  z-index: 1;\n  max-width: var(--grid-max-width);\n  width: 100%;\n  margin-inline: auto;\n  padding-inline: var(--grid-margin);\n  padding-block: var(--space-section);\n}\n\n.hero-banner__content {\n  display: flex;\n  flex-direction: column;\n  gap: var(--space-4);\n  max-width: 36rem;\n}\n\n/* ── Eyebrow ─────────────────────────────────────────────────────────────── */\n.hero-banner__eyebrow {\n  margin: 0;\n  font-family: var(--font-family-body);\n  font-size: var(--text-size-sm);\n  font-weight: var(--font-weight-body-medium);\n  color: var(--color-brand-primary);\n  letter-spacing: 0.08em;\n  text-transform: uppercase;\n}\n\n/* ── Title ────────────────────────────────────────────────────────────────── */\n.hero-banner__title {\n  margin: 0;\n  font-family: var(--font-family-heading);\n  font-size: clamp(var(--text-size-3xl), 4vw, var(--text-size-5xl));\n  font-weight: var(--font-weight-heading-bold);\n  color: var(--color-text-inverse);\n  line-height: var(--leading-tight);\n  text-wrap: balance;\n}\n\n/* ── Subtitle (description) ──────────────────────────────────────────────── */\n.hero-banner__subtitle {\n  margin: 0;\n  font-family: var(--font-family-body);\n  font-size: var(--text-size-lg);\n  color: color-mix(in srgb, var(--color-text-inverse) 80%, transparent);\n  line-height: var(--leading-relaxed);\n  max-width: 40ch;\n}\n\n/* ── CTA Button ──────────────────────────────────────────────────────────── */\n.hero-banner__cta {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  width: fit-content;\n  min-height: 3rem;\n  padding: var(--space-3) var(--space-8);\n  margin-top: var(--space-2);\n  border: 1px solid var(--color-text-inverse);\n  background: var(--color-text-inverse);\n  color: var(--color-text-primary);\n  font-family: var(--font-family-body);\n  font-size: var(--text-size-base);\n  font-weight: var(--font-weight-body-medium);\n  text-decoration: none;\n  text-transform: uppercase;\n  letter-spacing: 0.04em;\n  white-space: nowrap;\n  cursor: pointer;\n  transition:\n    background-color var(--transition-fast),\n    border-color var(--transition-fast),\n    color var(--transition-fast),\n    transform var(--transition-fast);\n}\n\n.hero-banner__cta:hover {\n  background: transparent;\n  color: var(--color-text-inverse);\n  transform: translateY(-1px);\n}\n\n.hero-banner__cta:focus-visible {\n  outline: 2px solid var(--color-action-secondary);\n  outline-offset: 2px;\n}\n\n/* ── Responsive: Tablet (<=1024px) ───────────────────────────────────────── */\n@media (max-width: 1024px) {\n  .hero-banner {\n    min-height: 380px;\n  }\n}\n\n/* ── Responsive: Mobile (<=768px) ────────────────────────────────────────── */\n@media (max-width: 768px) {\n  .hero-banner {\n    min-height: 360px;\n  }\n\n  .hero-banner__content {\n    max-width: none;\n  }\n\n  .hero-banner__overlay {\n    background: linear-gradient(\n      180deg,\n      color-mix(in srgb, var(--color-surface-inverse) 40%, transparent) 0%,\n      color-mix(in srgb, var(--color-surface-inverse) 80%, transparent) 100%\n    );\n  }\n}\n\n/* ── Responsive: Small mobile (<=640px) ──────────────────────────────────── */\n@media (max-width: 640px) {\n  .hero-banner__inner {\n    padding-block: var(--space-12);\n  }\n\n  .hero-banner__cta {\n    width: 100%;\n  }\n}\n\n/* ── Reduced motion ──────────────────────────────────────────────────────── */\n@media (prefers-reduced-motion: reduce) {\n  .hero-banner__cta {\n    transition: none;\n  }\n}\n"],
  "mappings": ";AACA,CAAA;AACE,YAAA;AACA,YAAA;AACA,cAAA;AACA,WAAA;AACA,eAAA;AACF;AAGA,CAAA;AACE,YAAA;AACA,SAAA;AACA,WAAA;AACF;AAEA,CAAA;AACE,cAAA;AACF;AAEA,CAAA;AACE,YAAA;AACA,SAAA;AACA;IAAA;WAAA;0EAAA;;AAKF;AAGA,CAAA;AACE,YAAA;AACA,WAAA;AACA,aAAA,IAAA;AACA,SAAA;AACA,iBAAA;AACA,kBAAA,IAAA;AACA,iBAAA,IAAA;AACF;AAEA,CAAA;AACE,WAAA;AACA,kBAAA;AACA,OAAA,IAAA;AACA,aAAA;AACF;AAGA,CAAA;AACE,UAAA;AACA,eAAA,IAAA;AACA,aAAA,IAAA;AACA,eAAA,IAAA;AACA,SAAA,IAAA;AACA,kBAAA;AACA,kBAAA;AACF;AAGA,CAAA;AACE,UAAA;AACA,eAAA,IAAA;AACA,aAAA,MAAA,IAAA,gBAAA,EAAA,GAAA,EAAA,IAAA;AACA,eAAA,IAAA;AACA,SAAA,IAAA;AACA,eAAA,IAAA;AACA,aAAA;AACF;AAGA,CAAA;AACE,UAAA;AACA,eAAA,IAAA;AACA,aAAA,IAAA;AACA,SAAA,UAAA,GAAA,IAAA,EAAA,IAAA,sBAAA,GAAA,EAAA;AACA,eAAA,IAAA;AACA,aAAA;AACF;AAGA,CAAA;AACE,WAAA;AACA,eAAA;AACA,mBAAA;AACA,SAAA;AACA,cAAA;AACA,WAAA,IAAA,WAAA,IAAA;AACA,cAAA,IAAA;AACA,UAAA,IAAA,MAAA,IAAA;AACA,cAAA,IAAA;AACA,SAAA,IAAA;AACA,eAAA,IAAA;AACA,aAAA,IAAA;AACA,eAAA,IAAA;AACA,mBAAA;AACA,kBAAA;AACA,kBAAA;AACA,eAAA;AACA,UAAA;AACA;;;;;AAKF;AAEA,CA1BA,gBA0BA;AACE,cAAA;AACA,SAAA,IAAA;AACA,aAAA,WAAA;AACF;AAEA,CAhCA,gBAgCA;AACE,WAAA,IAAA,MAAA,IAAA;AACA,kBAAA;AACF;AAGA,QAAA,WAAA;AACE,GAvHF;AAwHI,gBAAA;AACF;AACF;AAGA,QAAA,WAAA;AACE,GA9HF;AA+HI,gBAAA;AACF;AAEA,GA1FF;AA2FI,eAAA;AACF;AAEA,GAnHF;AAoHI;MAAA;cAAA;4EAAA;;AAKF;AACF;AAGA,QAAA,WAAA;AACE,GAnHF;AAoHI,mBAAA,IAAA;AACF;AAEA,GArEF;AAsEI,WAAA;AACF;AACF;AAGA,QAAA,wBAAA;AACE,GA5EF;AA6EI,gBAAA;AACF;AACF;",
  "names": []
}
