/* =============================================================================
   Kast Insurance — Elementor Compatibility Layer
   -----------------------------------------------------------------------------
   The kast- design in kast-style.css was authored for a hand-coded HTML
   structure. When the pages are rebuilt with Elementor, Elementor:
     1. turns every container into a flexbox (.e-con { display:flex }), and
     2. adds default gap/padding to containers.
   That overrides the grid/flex layouts the kast- classes expect. This file
   re-asserts those layouts, but ONLY inside Elementor (scoped to .elementor),
   so the original static mockups in /kast-insurance and /version 1 are
   untouched. Loaded AFTER kast-style.css and Elementor's CSS.
   ============================================================================= */

/* ── Neutralize Elementor's default container gap on EVERY kast container ──
   so the kast- spacing (margins/padding in kast-style.css) is what shows.
   The explicit grid/flex gaps further down win because they come later. */
.elementor [class*="kast-"] {
  --gap: 0px;
  gap: 0;
}

/* Alternating light-background sections (the inner pages alternate
   white / light, matching the original kast-style.css mockups). */
.elementor .kast-bg-light { background: var(--kast-light); }

/* Full-bleed section wrappers should span edge to edge regardless of
   Elementor's "boxed" default. */
.elementor .kast-section,
.elementor .kast-page-hero,
.elementor .kast-hero,
.elementor .kast-trust-bar,
.elementor .kast-about-strip,
.elementor .kast-testimonials,
.elementor .kast-cta-banner {
  width: 100%;
  max-width: 100%;
}

/* ── Re-assert GRID layouts (Elementor forces flex on every container) ────── */
.elementor .kast-hero .kast-container,
.elementor .kast-about-strip .kast-container {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 3rem;
  align-items: center;
}
.elementor .kast-about-strip .kast-container { gap: 4rem; }

.elementor .kast-services-grid   { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 1.5rem; }
.elementor .kast-coverage-cards  { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 1.5rem; }
.elementor .kast-steps           { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 1.5rem; }
.elementor .kast-team-grid       { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 2rem; }
.elementor .kast-values-grid     { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 1.5rem; }
.elementor .kast-locations-grid  { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 1.5rem; }
.elementor .kast-testimonials-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 1.5rem; }
.elementor .kast-compare-grid    { display: grid; grid-template-columns: 1fr 1fr; gap: 1.5rem; max-width: 860px; margin: 0 auto; }
.elementor .kast-content-block   { display: grid; grid-template-columns: 1fr 1fr; gap: 3.5rem; align-items: center; }
.elementor .kast-contact-layout  { display: grid; grid-template-columns: 2fr 1fr; gap: 3rem; align-items: start; }
.elementor .kast-footer-grid     { display: grid; grid-template-columns: 2fr 1fr 1fr 1fr; gap: 2.5rem; margin-bottom: 3rem; }
.elementor .kast-footer-bottom   { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: .5rem; }

/* ── Re-assert FLEX layouts ───────────────────────────────────────────────── */
.elementor .kast-trust-bar .kast-container { display: flex; justify-content: center; gap: 3rem; flex-wrap: wrap; align-items: center; }
.elementor .kast-hero-btns,
.elementor .kast-cta-btns { display: flex; gap: 1rem; flex-wrap: wrap; }
.elementor .kast-cta-btns { justify-content: center; }

/* The .kast-container is a centered max-width column for stacked content. */
.elementor .kast-section > .kast-container,
.elementor .kast-page-hero > .kast-container,
.elementor .kast-testimonials > .kast-container,
.elementor .kast-cta-banner > .kast-container {
  display: block;
  max-width: 1160px;
  margin: 0 auto;
}

/* ── Fix the few DIRECT-CHILD (>) selectors kast-style.css uses, which break
   once Elementor nests content inside .elementor-widget-container ─────────── */
.elementor .kast-hero-content p {
  font-size: 1.1rem;
  opacity: .88;
  max-width: 480px;
  margin-bottom: 2rem;
}
.elementor .kast-hero-content .kast-hero-phone {
  font-size: .9rem;
  opacity: .7;
  max-width: none;
  margin: 1.5rem 0 0;
}

/* ── Elementor Button widget: let the kast- button classes win over
   Elementor's own .elementor-button base styles. The double-class selector
   (.elementor-button.kast-btn-*) outranks Elementor's single .elementor-button. */
.elementor .elementor-button.kast-btn {
  display: inline-flex; align-items: center; gap: .45rem;
  border-radius: 8px; font-weight: 600; border: none;
  transition: transform .15s, box-shadow .15s, background .2s;
}
.elementor .elementor-button.kast-btn:hover { transform: translateY(-2px); box-shadow: 0 6px 18px rgba(0,0,0,.18); }
.elementor .elementor-button.kast-btn-primary { background: var(--kast-teal);  color: var(--kast-white) !important; }
.elementor .elementor-button.kast-btn-primary:hover { background: #22748a; }
.elementor .elementor-button.kast-btn-gold    { background: var(--kast-gold);  color: var(--kast-navy)  !important; }
.elementor .elementor-button.kast-btn-gold:hover { background: #cf8e1a; }
.elementor .elementor-button.kast-btn-ghost   { background: rgba(255,255,255,.15); color: var(--kast-white) !important; border: 2px solid rgba(255,255,255,.4); }
.elementor .elementor-button.kast-btn-ghost:hover { background: rgba(255,255,255,.25); }
.elementor .elementor-button.kast-btn-outline { background: transparent; color: var(--kast-navy) !important; border: 2px solid var(--kast-navy); }
.elementor .elementor-button.kast-btn-outline:hover { background: var(--kast-navy); color: var(--kast-white) !important; }
.elementor .elementor-button.kast-btn-lg { padding: .95rem 2.2rem; font-size: 1.05rem; }
.elementor .elementor-button.kast-btn   { padding: .75rem 1.75rem; font-size: .95rem; }

/* Elementor wraps button text in .elementor-button-text — keep it inheriting. */
.elementor .elementor-button.kast-btn .elementor-button-text { color: inherit; }

/* ── Headings/text inside kast wrappers: Elementor heading & text-editor
   widgets render full-width; make sure centered sections stay centered. */
.elementor .kast-section-header { text-align: center; }
.elementor .kast-cta-banner { text-align: center; }

/* Text-editor & heading widgets shouldn't add their own bottom margin that
   doubles the kast spacing. */
.elementor .kast-hero-content .elementor-widget,
.elementor .kast-content-text .elementor-widget,
.elementor .kast-about-text .elementor-widget { margin-bottom: 0; }

/* ── Responsive: mirror kast-style.css breakpoints inside Elementor ───────── */
@media (max-width: 900px) {
  .elementor .kast-hero .kast-container,
  .elementor .kast-about-strip .kast-container,
  .elementor .kast-content-block,
  .elementor .kast-contact-layout,
  .elementor .kast-compare-grid { grid-template-columns: 1fr; gap: 2rem; }
}
@media (max-width: 680px) {
  .elementor .kast-trust-bar .kast-container { gap: 1.5rem; }
  .elementor .kast-hero-btns,
  .elementor .kast-cta-btns { flex-direction: column; align-items: flex-start; }
  .elementor .kast-cta-btns { align-items: center; }
}
@media (max-width: 900px) {
  .elementor .kast-footer-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 680px) {
  .elementor .kast-footer-grid { grid-template-columns: 1fr; }
}

/* =============================================================================
   THEME BUILDER — Header & Footer (Elementor)
   The old hand-coded .kast-navbar markup doesn't exist anymore; the header is
   rebuilt with Elementor widgets. These classes style that rebuilt header.
   ============================================================================= */
.kast-eheader {
  position: sticky; top: 0; z-index: 999;
  background: var(--kast-navy);
  box-shadow: 0 2px 12px rgba(0,0,0,.25);
}
.admin-bar .kast-eheader { top: 32px; }
@media screen and (max-width: 782px) { .admin-bar .kast-eheader { top: 46px; } }

.elementor .kast-eheader > .kast-container,
.elementor .kast-eheader .kast-eheader-row {
  display: flex; align-items: center; justify-content: space-between;
  gap: 1rem; min-height: 70px;
}
.kast-ebrand, .kast-ebrand a { display: inline-flex; align-items: center; gap: .65rem; color: var(--kast-white) !important; font-size: 1.2rem; font-weight: 800; text-decoration: none !important; }
.kast-ebrand-icon { width: 38px; height: 38px; background: var(--kast-teal); border-radius: 8px; display: inline-flex; align-items: center; justify-content: center; font-size: 1.2rem; }
.kast-ebrand-sub { display: block; font-weight: 400; font-size: .75rem; opacity: .75; line-height: 1; }

/* Elementor Nav Menu inside the header */
.kast-eheader .elementor-nav-menu a { color: rgba(255,255,255,.85) !important; font-weight: 500; }
.kast-eheader .elementor-nav-menu a:hover,
.kast-eheader .elementor-nav-menu .current-menu-item a { color: var(--kast-white) !important; }
.kast-eheader .elementor-menu-toggle { color: var(--kast-white) !important; }
