@import url("https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;500;600;700&display=swap");

:root {
  --font-sans: "Space Grotesk", ui-sans-serif, system-ui, sans-serif;
  --font-serif: "Space Grotesk", ui-sans-serif, system-ui, sans-serif;

  --color-brand-primary: #edf2f4;
  --color-brand-secondary: #8d99ae;
  --color-brand-accent: #ef233c;
  --color-brand-accent-hover: #d90429;
  --color-brand-cta: #ef233c;
  --color-brand-cta-hover: #d90429;
  --color-brand-light: #2b2d42;
  --color-brand-dark: rgba(255, 255, 255, 0.14);
  --color-brand-warm: #ef233c;
  --color-brand-alert: #d90429;
}

/* ── Force dark page background – must win over WordPress + Elementor defaults ── */
html,
body {
  background:
    radial-gradient(
      circle at 15% 10%,
      rgba(239, 35, 60, 0.12),
      transparent 38%
    ),
    radial-gradient(circle at 85% 0%, rgba(239, 35, 60, 0.08), transparent 30%),
    #1f2130 !important;
  color: var(--color-brand-primary) !important;
  font-family: var(--font-sans) !important;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* Page-level wrappers: transparent so dark body shows through */
#page,
.site,
.site-content,
#content,
.entry-content,
#primary,
main.site-main {
  background: transparent !important;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: var(--font-serif);
  text-transform: uppercase;
  letter-spacing: -0.01em;
  line-height: 1.05;
}

p,
li,
button,
a,
input,
label,
textarea,
select {
  font-family: var(--font-sans);
}

/* ── Elementor structural containers: transparent so dark body shows through ── */
.elementor,
.elementor-section-wrap,
.elementor-top-section,
.elementor-section,
.elementor-inner-section,
.elementor-container,
.elementor-row,
.elementor-column,
.elementor-column-wrap,
.elementor-widget-wrap,
.elementor-widget,
.elementor-widget-container,
.e-con,
.e-con-inner,
.e-flex,
.e-child {
  background-color: transparent !important;
  background-image: none !important;
}

/* Remove Elementor default section padding – components handle their own spacing */
.elementor-section,
.elementor-top-section {
  margin: 0 !important;
  padding: 0 !important;
}

.elementor-section > .elementor-container,
.elementor-top-section > .elementor-container {
  max-width: 100% !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

.elementor-section.elementor-section-boxed > .elementor-container {
  max-width: 100% !important;
}

.elementor-widget-container {
  padding: 0 !important;
  margin: 0 !important;
}

.elementor-column {
  padding: 0 !important;
}

/* Elementor export wrapper baseline */
.tf-elementor-export {
  font-family: var(--font-sans);
  color: var(--color-brand-primary);
}

.tf-elementor-export h1,
.tf-elementor-export h2,
.tf-elementor-export h3,
.tf-elementor-export h4,
.tf-elementor-export h5,
.tf-elementor-export h6 {
  font-family: var(--font-serif);
  text-transform: uppercase;
  letter-spacing: -0.01em;
  line-height: 1.05;
}

.tf-elementor-export svg {
  display: block;
}

/* Reusable visual facelift: dark surfaces, crisp borders, premium depth */
.bg-white {
  background-color: rgba(255, 255, 255, 0.05) !important;
  backdrop-filter: blur(6px);
}

.border-brand-dark {
  border-color: rgba(255, 255, 255, 0.16) !important;
}

.shadow-sm,
.shadow-md,
.shadow-lg,
.shadow-xl,
.shadow-2xl {
  box-shadow: 0 16px 42px rgba(0, 0, 0, 0.25) !important;
}

.text-brand-secondary {
  color: rgba(141, 153, 174, 0.95) !important;
}

/* Labels & microcopy */
.tracking-widest {
  letter-spacing: 0.14em !important;
}

/* Interactive language */
a,
button {
  transition:
    background-color 0.2s ease,
    color 0.2s ease,
    border-color 0.2s ease,
    transform 0.2s ease,
    box-shadow 0.2s ease;
}

a:hover,
button:hover {
  transform: translateY(-1px);
}

/* Primary action consistency */
.bg-brand-cta {
  border: 1px solid rgba(239, 35, 60, 0.5);
  text-transform: uppercase;
  letter-spacing: 0.06em;
}

.bg-brand-cta:hover {
  box-shadow:
    0 0 0 1px rgba(239, 35, 60, 0.3),
    0 14px 28px rgba(217, 4, 41, 0.35) !important;
}

/* Accessibility: reduce animation when requested */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}
