/* ============================================================
   Elementor widget overrides — make our design tokens win
   over Elementor's default colors/fonts/spacing.
   Loads AFTER creative.css.
   ============================================================ */

/* ============================================================
   OVERRIDE ELEMENTOR KIT GLOBAL VARIABLES
   (Elementor stores global colors / fonts / container width in a
   hidden "kit" post — those defaults fight our design tokens.)
   ============================================================ */
:root,
body,
body.elementor-default,
.elementor-kit-18,
.elementor-kit-19,
.elementor-kit-20 {
  --e-global-color-primary:   var(--color-primary)   !important;
  --e-global-color-secondary: var(--color-secondary) !important;
  --e-global-color-text:      var(--color-secondary) !important;
  --e-global-color-accent:    var(--color-j1-accent) !important;
  --e-global-typography-primary-font-family:   var(--font-heading) !important;
  --e-global-typography-primary-font-weight:   600 !important;
  --e-global-typography-secondary-font-family: var(--font-heading) !important;
  --e-global-typography-text-font-family:      var(--font-body)    !important;
  --e-global-typography-accent-font-family:    var(--font-heading) !important;
  --container-max-width: 100% !important;
}
.elementor .e-con,
.elementor .e-con.e-parent {
  --container-max-width: 100% !important;
}

/* ---------- Reset Elementor's container default padding ---------- */
.elementor-section,
.e-con,
.e-con-inner,
.elementor-widget-container {
  /* Elementor adds 10px padding to widget-container by default. Reset. */
}
.elementor-widget {
  margin-bottom: 0; /* don't add stacking margin */
}

/* ---------- Heading widget — inherit our design system ---------- */
.elementor-widget-heading .elementor-heading-title,
.elementor .elementor-widget-heading .elementor-heading-title,
.elementor-widget-heading h1.elementor-heading-title,
.elementor-widget-heading h2.elementor-heading-title,
.elementor-widget-heading h3.elementor-heading-title,
.elementor-widget-heading h4.elementor-heading-title,
.elementor-widget-heading h5.elementor-heading-title,
.elementor-widget-heading h6.elementor-heading-title {
  font-family: var(--font-heading) !important;
  color: var(--color-primary) !important;
  letter-spacing: -0.02em;
  line-height: var(--leading-tight);
  font-weight: 600;
  margin: 0;
}

h1.elementor-heading-title {
  font-size: var(--text-5xl);
  line-height: 1.05;
  letter-spacing: -0.03em;
  font-weight: 700;
}
@media (min-width: 768px) {
  h1.elementor-heading-title { font-size: var(--text-6xl); }
}

h2.elementor-heading-title { font-size: var(--text-4xl); }
h3.elementor-heading-title { font-size: var(--text-3xl); }
h4.elementor-heading-title { font-size: var(--text-2xl); }
h5.elementor-heading-title { font-size: var(--text-xl); }
h6.elementor-heading-title { font-size: var(--text-lg); }

/* Gradient text spans inside headings should keep their gradient color */
.elementor-heading-title .accent-j1,
.elementor-heading-title .accent-j2,
.elementor-heading-title .grad {
  background-clip: text;
  -webkit-background-clip: text;
  color: transparent;
  -webkit-text-fill-color: transparent;
}
.elementor-heading-title .accent-j1 {
  background-image: linear-gradient(135deg, var(--grad-emerald) 0%, var(--grad-emerald-deep) 100%);
}
.elementor-heading-title .accent-j2 {
  background-image: linear-gradient(135deg, var(--grad-blue) 0%, var(--grad-blue-deep) 100%);
}
.elementor-heading-title .grad {
  background-image: linear-gradient(135deg, var(--grad-emerald) 0%, var(--grad-blue) 100%);
}

/* ---------- Mega/Aurora hero — heading sized to fit 3 lines on desktop ---------- */
.hero-mega h1.elementor-heading-title,
.aurora h1.elementor-heading-title {
  font-size: clamp(2.25rem, 5vw, 4.5rem);
  line-height: 1.08;
  letter-spacing: -0.03em;
  font-weight: 700;
  text-align: center;
  max-width: 900px;
  margin-inline: auto;
}
.hero-mega h1.elementor-heading-title em,
.aurora h1.elementor-heading-title em {
  font-style: italic;
  font-weight: 400;
}

/* Page hero rich on interior pages */
.page-hero-rich h1.elementor-heading-title {
  font-size: clamp(2.25rem, 6vw, 4.5rem);
  letter-spacing: -0.03em;
  line-height: 1.05;
  text-align: center;
}

/* ---------- Text editor widget — inherit our body styles ---------- */
.elementor-widget-text-editor {
  font-family: var(--font-body);
  color: var(--color-secondary);
  line-height: var(--leading-normal);
}
.elementor-widget-text-editor p {
  color: var(--color-secondary);
  font-family: var(--font-body);
  font-size: var(--text-base);
  line-height: var(--leading-normal);
  margin: 0;
}

/* Hero subhead size */
.hero-mega .elementor-widget-text-editor p,
.aurora .elementor-widget-text-editor p {
  font-size: clamp(1.125rem, 1.7vw, 1.375rem);
  line-height: 1.5;
  color: var(--color-secondary);
  max-width: 680px;
  margin: 0 auto var(--space-10);
  text-align: center;
}

/* Page hero lead text */
.page-hero-rich .elementor-widget-text-editor p {
  font-size: clamp(1.125rem, 1.5vw, 1.25rem);
  max-width: 640px;
  margin: 0 auto;
  text-align: center;
}

/* ---------- Mega CTA gradient — force white text on widgets inside ---------- */
.mega-cta .elementor-heading-title,
.mega-cta h2.elementor-heading-title {
  color: #fff !important;
  text-align: center;
  max-width: 700px;
  margin: 0 auto var(--space-5);
  font-size: clamp(2rem, 5vw, 3.5rem);
}
.mega-cta .elementor-widget-text-editor,
.mega-cta .elementor-widget-text-editor p {
  color: rgba(255, 255, 255, 0.85) !important;
  text-align: center;
  font-size: var(--text-lg);
  max-width: 540px;
  margin: 0 auto var(--space-8);
  line-height: 1.55;
}

/* ---------- Section-head context — center widgets ---------- */
.section-head .elementor-widget,
.section-head .elementor-widget-container {
  text-align: center;
}

/* ---------- Hero CTA buttons centered ---------- */
.hero-mega .elementor-widget-container {
  text-align: center;
}

/* ---------- Container width / spacing reset ---------- */
.e-con.scp-section,
.e-con[data-element_type="container"] {
  /* Don't let Elementor's default padding mess with our .section padding */
  padding-block: 0;
  padding-inline: 0;
}

/* Aurora overflow control — keep orbs from leaking out */
.e-con.aurora { overflow: hidden; isolation: isolate; }

/* ---------- Trust strip — force full width ---------- */
.e-con.trust-strip { padding: var(--space-6) 0; }

/* ============================================================
   CONTENT CONTAINERS — restore .container (1200px) and
   .container--narrow (800px) inside Elementor containers.
   These get killed by the global max-width: none !important rule below;
   higher-specificity selector restores them.
   ============================================================ */
html body .elementor .e-con.container,
html body div.elementor div.e-con.container {
  max-width: var(--container-max, 1200px) !important;
  width: 100% !important;
  margin-inline: auto !important;
  padding-inline: var(--space-6) !important;
}
html body .elementor .e-con.container.container--narrow,
html body div.elementor div.e-con.container.container--narrow,
html body .elementor .e-con.container--narrow,
html body div.elementor div.e-con.container--narrow {
  max-width: var(--container-narrow, 800px) !important;
  width: 100% !important;
  margin-inline: auto !important;
  padding-inline: var(--space-6) !important;
}
/* Exception: header/footer .container stays at 1140px (already handled above) */
html body .elementor .e-con.site-header .e-con.container,
html body .elementor .e-con.site-footer .e-con.container {
  max-width: none !important;
  padding-inline: 0 !important;
}

/* ---------- Re-apply section block padding ---------- */
.e-con.section { padding: var(--space-20) 0; }
.e-con.section.section--sm { padding: var(--space-12) 0; }
.e-con.section.section--lg { padding: var(--space-24) 0; }
.e-con.section.section--muted { background: var(--color-muted); }

/* ---------- Force inner Elementor wrappers to be transparent ---------- */
.elementor-widget-html .elementor-widget-container { padding: 0; }
.elementor-widget-heading .elementor-widget-container { padding: 0; }
.elementor-widget-text-editor .elementor-widget-container { padding: 0; }

/* ---------- Fix top-of-page padding when no header bg ---------- */
body.elementor-page main#content,
body.elementor-page #content {
  padding: 0;
  margin: 0;
}

/* ---------- Hello Elementor parent's content area constraints — neutralize ---------- */
.elementor-page .site,
.elementor-page .page-content {
  max-width: none;
  padding: 0;
  margin: 0;
}

/* ---------- Sticky header above Elementor canvas ---------- */
.site-header { z-index: 100; }

/* ============================================================
   HEADER & FOOTER — content centered at 1140px (band stays full-width).
   Maximum specificity to defeat Elementor's per-element compiled CSS.
   ============================================================ */

/* HEADER STICKY: target the OUTER HFE template wrapper (direct child of <body>),
   not the inner .e-con. Sticky needs a tall containing block — wrapping the inner
   .e-con only limits sticky range to header's own height (= no visible effect).
   Use :has() to find any HFE post wrapper that contains a .site-header child. */
html body .elementor[data-elementor-type="wp-post"]:has(> .e-con.site-header) {
  position: sticky !important;
  top: 0 !important;
  z-index: 100 !important;
}

/* Header visual styling stays on the inner .e-con */
html body .elementor .e-con.site-header,
html body div.elementor div.e-con.site-header {
  background: rgba(255, 255, 255, 0.94) !important;
  backdrop-filter: saturate(180%) blur(12px);
  -webkit-backdrop-filter: saturate(180%) blur(12px);
  border-bottom: 1px solid var(--color-border) !important;
}

html body .elementor .e-con.site-header > .e-con-inner,
html body div.elementor div.e-con.site-header > div.e-con-inner {
  max-width: 1140px !important;
  width: 100% !important;
  margin-inline: auto !important;
  padding-inline: var(--space-6) !important;
}

/* Force the inner row to fill the constrained parent (no extra constraints) */
html body .elementor .e-con.site-header__inner,
html body div.elementor div.e-con.site-header__inner {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
}

/* FOOTER: .site-footer is e-con-full (no .e-con-inner directly).
   The inner .container child IS e-con-boxed (has .e-con-inner).
   Constrain THAT to 1140px. */
html body .elementor .e-con.site-footer .e-con.container,
html body div.elementor div.e-con.site-footer div.e-con.container {
  width: 100% !important;
  max-width: none !important;
  padding-inline: 0 !important;
}

html body .elementor .e-con.site-footer .e-con.container > .e-con-inner,
html body div.elementor div.e-con.site-footer div.e-con.container > div.e-con-inner {
  max-width: 1140px !important;
  width: 100% !important;
  margin-inline: auto !important;
  padding-inline: var(--space-6) !important;
}

/* Logo must never wrap, even on smallest screens */
.site-header__logo {
  white-space: nowrap;
  flex-shrink: 0;
}

/* Footer grid breathing room */
.site-footer { padding-inline: 0 !important; }
.site-footer .container { padding-block: 0 !important; }

/* ============================================================
   JOURNEY-AWARE NAV/CTA/SWITCHER — show only the active variant
   based on body.journey-j1 / body.journey-j2 class
   ============================================================ */
/* Default state: hide all journey-specific variants */
.site-nav--j1,
.site-nav--j2,
.site-header__cta--j1,
.site-header__cta--j2,
.journey-switcher--j1,
.journey-switcher--j2 {
  display: none !important;
}

/* General context (no journey body class): show general nav + general CTA */
body:not(.journey-j1):not(.journey-j2) .site-nav--general,
body:not(.journey-j1):not(.journey-j2) .site-header__cta--general {
  /* default visibility from .site-nav and .btn .site-header__cta — already correct */
}

/* Journey 1 (Loved Ones) — show j1 variants, hide others */
body.journey-j1 .site-nav--general,
body.journey-j1 .site-header__cta--general {
  display: none !important;
}
body.journey-j1 .site-nav--j1 {
  display: none; /* base hidden, lg+ shows */
}
body.journey-j1 .site-header__cta--j1 {
  display: inline-flex !important;
}
body.journey-j1 .journey-switcher--j1 {
  display: block !important;
}
@media (min-width: 1024px) {
  body.journey-j1 .site-nav--j1 { display: flex !important; }
}

/* Journey 2 (Connect) — show j2 variants, hide others */
body.journey-j2 .site-nav--general,
body.journey-j2 .site-header__cta--general {
  display: none !important;
}
body.journey-j2 .site-nav--j2 {
  display: none;
}
body.journey-j2 .site-header__cta--j2 {
  display: inline-flex !important;
}
body.journey-j2 .journey-switcher--j2 {
  display: block !important;
}
@media (min-width: 1024px) {
  body.journey-j2 .site-nav--j2 { display: flex !important; }
}

/* Mobile drawer: show all journey-specific nav items when drawer is open
   (the active journey's nav is the one that's already showing on its journey pages) */
@media (max-width: 1023px) {
  body.is-menu-open.journey-j1 .site-nav--j1 { display: flex !important; }
  body.is-menu-open.journey-j2 .site-nav--j2 { display: flex !important; }
  body.is-menu-open:not(.journey-j1):not(.journey-j2) .site-nav--general { display: flex !important; }
}

/* ============================================================
   ELEMENTOR BUTTON WIDGET — restyle to match our .btn aesthetic
   when the widget has site-header__cta on it
   ============================================================ */
.site-header__cta .elementor-button,
.elementor-widget-button.site-header__cta .elementor-button-link {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  gap: var(--space-2);
  padding: var(--space-3) var(--space-6);
  border-radius: var(--radius-md);
  font-family: var(--font-heading);
  font-weight: 500;
  font-size: var(--text-sm);
  line-height: 1;
  min-height: 40px;
  border: 2px solid transparent;
  transition: all var(--duration-base) var(--ease-out);
  white-space: nowrap;
  text-decoration: none;
  background: var(--color-primary);
  color: var(--color-on-primary);
  border-color: var(--color-primary);
}
.site-header__cta--general .elementor-button:hover {
  background: var(--color-secondary);
  border-color: var(--color-secondary);
  color: var(--color-on-primary);
}
.site-header__cta--j1 .elementor-button {
  background: var(--color-j1-accent);
  border-color: var(--color-j1-accent);
}
.site-header__cta--j1 .elementor-button:hover {
  background: var(--color-j1-accent-hover);
  border-color: var(--color-j1-accent-hover);
}
.site-header__cta--j2 .elementor-button {
  background: var(--color-j2-accent);
  border-color: var(--color-j2-accent);
}
.site-header__cta--j2 .elementor-button:hover {
  background: var(--color-j2-accent-hover);
  border-color: var(--color-j2-accent-hover);
}
.site-header__cta .elementor-button-text {
  font-family: var(--font-heading);
  font-weight: 500;
}

/* ============================================================
   FOOTER ICON-LIST WIDGET — make it look like our footer link lists
   ============================================================ */
.site-footer .elementor-widget-icon-list .elementor-icon-list-items {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
}
.site-footer .elementor-widget-icon-list .elementor-icon-list-item {
  padding: 0 !important;
  border: none !important;
}
.site-footer .elementor-widget-icon-list .elementor-icon-list-item:not(:last-child):after {
  display: none !important;
}
.site-footer .elementor-widget-icon-list .elementor-icon-list-icon {
  display: none;
}
.site-footer .elementor-widget-icon-list .elementor-icon-list-text,
.site-footer .elementor-widget-icon-list .elementor-icon-list-item > a {
  color: rgba(255, 255, 255, 0.7) !important;
  font-size: var(--text-sm) !important;
  font-family: var(--font-body) !important;
  font-weight: 400 !important;
  padding: 0 !important;
  text-decoration: none;
  transition: color var(--duration-base) var(--ease-out);
}
.site-footer .elementor-widget-icon-list .elementor-icon-list-item > a:hover,
.site-footer .elementor-widget-icon-list .elementor-icon-list-item > a:hover .elementor-icon-list-text {
  color: var(--color-on-primary) !important;
}

/* ============================================================
   FOOTER heading widgets — match h4 styling
   ============================================================ */
.site-footer .elementor-widget-heading .elementor-heading-title {
  color: var(--color-on-primary) !important;
  font-size: var(--text-base) !important;
  font-weight: 600 !important;
  margin-bottom: var(--space-4);
}

/* Footer brand h4 (it's inside an HTML widget so already styled) */
.site-footer__brand h4 {
  color: var(--color-on-primary) !important;
  font-size: var(--text-base);
  font-weight: 600;
  margin-bottom: var(--space-4);
}

/* Footer text widgets for description / copyright */
.site-footer .elementor-widget-text-editor p,
.site-footer .elementor-widget-text-editor span {
  color: rgba(255, 255, 255, 0.7) !important;
  font-size: var(--text-sm) !important;
  font-family: var(--font-body) !important;
  margin: 0;
}
.site-footer__brand .elementor-widget-text-editor p {
  max-width: 320px;
  line-height: 1.55;
}
.site-footer__bottom .elementor-widget-text-editor span {
  font-size: var(--text-sm) !important;
}

/* Footer grid layout via Elementor inner containers */
.site-footer .elementor-element.e-con.site-footer__grid {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: var(--space-10) !important;
  width: 100% !important;
}
@media (min-width: 768px) {
  .site-footer .elementor-element.e-con.site-footer__grid {
    grid-template-columns: 2fr 1fr 1fr 1fr !important;
  }
}

/* Footer bottom strip layout */
.site-footer .elementor-element.e-con.site-footer__bottom {
  display: flex !important;
  flex-direction: column !important;
  gap: var(--space-3) !important;
  align-items: center;
  justify-content: space-between;
  margin-top: var(--space-12);
  padding-top: var(--space-6) !important;
  border-top: 1px solid rgba(255, 255, 255, 0.1);
}
@media (min-width: 768px) {
  .site-footer .elementor-element.e-con.site-footer__bottom {
    flex-direction: row !important;
  }
}

/* Footer wrapper padding + background */
.site-footer.e-con,
.elementor .e-con.site-footer {
  background: var(--color-primary) !important;
  color: var(--color-on-primary) !important;
  padding-block: var(--space-16) var(--space-8) !important;
}

/* Site header background */
.site-header.e-con,
.elementor .e-con.site-header {
  background: rgba(255, 255, 255, 0.92) !important;
  backdrop-filter: saturate(180%) blur(12px);
  -webkit-backdrop-filter: saturate(180%) blur(12px);
  border-bottom: 1px solid var(--color-border);
  position: sticky;
  top: 0;
  z-index: 100;
}

/* ============================================================
   SKIP LINK — hidden until focused (accessibility)
   ============================================================ */
.skip-link,
.elementor-widget-html .skip-link {
  position: absolute !important;
  top: -100px !important;
  left: 1rem !important;
  background: var(--color-primary);
  color: var(--color-on-primary);
  padding: 0.5rem 1rem;
  border-radius: var(--radius-md);
  z-index: 1000;
  text-decoration: none;
  font-family: var(--font-heading);
  font-weight: 500;
  font-size: 0.875rem;
}
.skip-link:focus,
.elementor-widget-html .skip-link:focus {
  top: 1rem !important;
  outline: 2px solid var(--color-j2-accent);
  outline-offset: 2px;
}

/* ============================================================
   SITE HEADER — full-width band, inner content centered in max-width
   ============================================================ */
/* Outer header band — full width, sticky */
.elementor .e-con.site-header {
  width: 100% !important;
  max-width: none !important;
  padding: 0 !important;
}

/* Constrain the OUTER .site-header's .e-con-inner to 1140px (centered) — this
   wraps all header content. Since .site-header is e-con-boxed, Elementor
   uses .e-con-inner as the layout wrapper. */
.elementor .e-con.site-header > .e-con-inner {
  max-width: 1140px !important;
  width: 100% !important;
  margin-inline: auto !important;
  padding-inline: var(--space-6) !important;
}

/* Inner flex row — sits inside the constrained .e-con-inner */
.elementor .e-con.site-header__inner {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: var(--space-5) !important;
  flex-wrap: nowrap !important;
  width: 100% !important;
  max-width: 100% !important;
  padding-block: 0 !important;
  padding-inline: 0 !important;
  min-height: 72px !important;
  align-self: center !important;
}

/* All widgets inside the header inner should NOT grow — shrink to content */
.elementor .e-con.site-header__inner > .e-con-inner > .elementor-widget,
.elementor .e-con.site-header__inner > .elementor-widget {
  flex: 0 0 auto !important;
  width: auto !important;
  max-width: none !important;
}

/* The logo gets margin-right: auto to push everything else to the right */
.elementor .e-con.site-header__inner > .e-con-inner > .elementor-widget-scplus_site_logo,
.elementor .e-con.site-header__inner > .elementor-widget-scplus_site_logo {
  margin-right: auto !important;
}

/* Hide all nav widget wrappers by default; show only the matching one based on body journey class */
.elementor .e-con.site-header__inner .elementor-widget-scplus_site_nav { display: none; }
body:not(.journey-j1):not(.journey-j2) .elementor .e-con.site-header__inner .scp-nav-wrap--general,
body.journey-j1 .elementor .e-con.site-header__inner .scp-nav-wrap--j1,
body.journey-j2 .elementor .e-con.site-header__inner .scp-nav-wrap--j2 {
  display: inline-flex;
}
/* Mobile: hide all nav widgets in the bar (shown only inside drawer) */
@media (max-width: 1023px) {
  .elementor .e-con.site-header__inner .elementor-widget-scplus_site_nav { display: none !important; }
}
/* Mobile drawer: show the active journey's nav inside the drawer */
@media (max-width: 1023px) {
  body.is-menu-open:not(.journey-j1):not(.journey-j2) .elementor .e-con.site-header__inner .scp-nav-wrap--general,
  body.is-menu-open.journey-j1 .elementor .e-con.site-header__inner .scp-nav-wrap--j1,
  body.is-menu-open.journey-j2 .elementor .e-con.site-header__inner .scp-nav-wrap--j2 {
    display: flex !important;
  }
}

/* CTA Button widget — small inline button, not stretched */
.elementor .e-con.site-header__inner .elementor-widget-button {
  width: auto !important;
  flex: 0 0 auto !important;
}
.elementor .e-con.site-header__inner .elementor-widget-button .elementor-button-wrapper {
  text-align: right !important;
}
.elementor .e-con.site-header__inner .elementor-button {
  padding: var(--space-3) var(--space-5) !important;
  font-size: var(--text-sm) !important;
  min-height: 44px !important;
  height: 44px !important;
  line-height: 1 !important;
  border-radius: var(--radius-md) !important;
}
.elementor .e-con.site-header__inner .elementor-button .elementor-button-text {
  font-family: var(--font-heading) !important;
  font-weight: 500 !important;
  font-size: var(--text-sm) !important;
}

/* Hide non-active CTA buttons based on journey */
body:not(.journey-j1):not(.journey-j2) .site-header__cta--j1,
body:not(.journey-j1):not(.journey-j2) .site-header__cta--j2,
body.journey-j1 .site-header__cta--general,
body.journey-j1 .site-header__cta--j2,
body.journey-j2 .site-header__cta--general,
body.journey-j2 .site-header__cta--j1 {
  display: none !important;
}

/* Mobile menu toggle widget */
.elementor .e-con.site-header__inner .elementor-widget-scplus_mobile_toggle {
  display: none;
}
@media (max-width: 1023px) {
  .elementor .e-con.site-header__inner .elementor-widget-scplus_mobile_toggle {
    display: inline-flex !important;
  }
  /* Hide all CTA buttons on mobile (they show in drawer) */
  .elementor .e-con.site-header__inner .elementor-widget-button {
    display: none;
  }
  /* Logo doesn't get auto-margin on mobile - mobile-toggle takes the right */
  .elementor .e-con.site-header__inner > .e-con-inner > .elementor-widget-scplus_mobile_toggle,
  .elementor .e-con.site-header__inner > .elementor-widget-scplus_mobile_toggle {
    margin-left: auto !important;
  }
}

/* ============================================================
   FULL-WIDTH CONTAINER FIX — Elementor wraps sections in
   .e-con + .e-con-inner which constrain width by default.
   Force them edge-to-edge for our full-bleed designs.
   ============================================================ */
.elementor .e-con,
.elementor .e-con.e-parent,
body.elementor-page .elementor .e-con {
  width: 100% !important;
  max-width: none !important;
  --container-max-width: 100% !important;
  padding-inline: 0 !important;
}

.elementor .e-con > .e-con-inner,
body.elementor-page .elementor .e-con > .e-con-inner {
  width: 100% !important;
  max-width: none !important;
  padding-inline: 0 !important;
  margin-inline: 0 !important;
}

/* Re-establish vertical padding for "section" containers */
.elementor .e-con.section { padding-block: var(--space-20) !important; }
.elementor .e-con.section.section--sm { padding-block: var(--space-12) !important; }
.elementor .e-con.section.section--lg { padding-block: var(--space-24) !important; }

/* Aurora hero — extra bottom padding for breathing room before marquee */
.elementor .e-con.aurora.hero-mega {
  padding-block: var(--space-16) var(--space-20) !important;
}

/* Trust strip / footer must be edge-to-edge with breathing space above */
.elementor .e-con.trust-strip,
.elementor .e-con.scp-section.trust-strip {
  padding: var(--space-6) 0 !important;
  margin-top: var(--space-8) !important;
}

/* ============================================================
   ELEMENTOR WIDGET CONTAINER — zero out default padding
   ============================================================ */
.elementor-widget-html .elementor-widget-container,
.elementor-widget-heading .elementor-widget-container,
.elementor-widget-text-editor .elementor-widget-container {
  padding: 0 !important;
}

/* ============================================================
   BUTTON GROUP — force flex gap to win over Elementor reset
   ============================================================ */
.hero-mega__cta,
.mega-cta__buttons,
.hero-split__actions {
  display: flex !important;
  gap: var(--space-4) !important;
  flex-wrap: wrap !important;
  justify-content: center !important;
  align-items: center !important;
  margin-top: var(--space-2);
}
.hero-mega__cta a.btn,
.mega-cta__buttons a.btn,
.hero-split__actions a.btn {
  margin: 0 !important;
}

/* Left-aligned variant for split heroes */
.split-hero__text .hero-mega__cta {
  justify-content: flex-start !important;
}

/* ============================================================
   MOBILE NAV DRAWER — opens when .is-menu-open is set on <body>
   ============================================================ */
@media (max-width: 1023px) {
  .site-nav {
    position: fixed;
    top: 72px; /* header height */
    left: 0; right: 0;
    background: rgba(255, 255, 255, 0.98);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    border-bottom: 1px solid var(--color-border);
    box-shadow: var(--shadow-lg);
    flex-direction: column !important;
    align-items: stretch !important;
    padding: var(--space-4);
    gap: var(--space-1) !important;
    max-height: 0;
    overflow: hidden;
    visibility: hidden;
    transition: max-height var(--duration-base) var(--ease-out),
                visibility var(--duration-base) var(--ease-out);
    z-index: 90;
  }
  body.is-menu-open .site-nav {
    display: flex !important;
    max-height: 80vh;
    visibility: visible;
    overflow-y: auto;
  }
  body.is-menu-open .site-nav a {
    padding: var(--space-3) var(--space-4);
    border-radius: var(--radius-md);
    font-size: var(--text-base);
  }

  .site-header__cta {
    display: none;
  }
  body.is-menu-open .site-header__cta {
    display: inline-flex !important;
    margin-top: var(--space-2);
    justify-content: center;
  }

  /* Hamburger to X morph */
  body.is-menu-open .site-header__menu svg line:nth-child(1) {
    transform: rotate(45deg) translate(3px, 6px);
    transform-origin: center;
  }
  body.is-menu-open .site-header__menu svg line:nth-child(2) {
    opacity: 0;
  }
  body.is-menu-open .site-header__menu svg line:nth-child(3) {
    transform: rotate(-45deg) translate(3px, -6px);
    transform-origin: center;
  }
  body.is-menu-open .site-header__menu svg line {
    transition: transform var(--duration-base) var(--ease-out),
                opacity var(--duration-fast) var(--ease-out);
  }

  /* Prevent body scroll when menu open */
  body.is-menu-open { overflow: hidden; }
}

/* Active menu state base */
.site-header__menu { cursor: pointer; }
body.is-menu-open .site-header__menu {
  background: var(--color-muted);
}

/* ============================================================
   Hero/CTA fixes for Elementor wrapper
   ============================================================ */
.hero-mega .elementor-widget,
.aurora .elementor-widget {
  width: 100%;
}

/* Constrain text widgets inside hero to readable width, centered */
.hero-mega .elementor-widget-text-editor,
.aurora .elementor-widget-text-editor {
  max-width: 680px;
  margin-inline: auto;
}

/* Constrain the heading widget for line-length */
.hero-mega .elementor-widget-heading,
.aurora .elementor-widget-heading {
  max-width: 1000px;
  margin-inline: auto;
}

/* CTAs in HTML widget should not be flex-stretched */
.hero-mega .elementor-widget-html,
.aurora .elementor-widget-html {
  text-align: center;
}

/* ============================================================
   Section default block padding (in case .section class isn't on the container)
   ============================================================ */
.elementor .e-con.scp-section { padding-block: var(--space-12); }
.elementor .e-con.scp-page-styles { padding: 0 !important; display: none; }
