/**
 * TECTRANZ — ELEMENTOR OVERRIDES
 * Patches Elementor defaults to match Tectranz design system.
 * Loaded after Elementor's own styles.
 */

/* ── CONTAINER WIDTH ──────────────────────────── */
.elementor-section.elementor-section-boxed > .elementor-container,
.e-con.e-con--boxed > .e-con-inner {
  max-width: var(--lay-container);
}

.elementor-section.elementor-section-boxed.tz-wide > .elementor-container,
.e-con.e-con--boxed.tz-wide > .e-con-inner {
  max-width: var(--lay-wide);
}

/* ── TYPOGRAPHY OVERRIDE ──────────────────────── */
.elementor-widget-heading .elementor-heading-title {
  font-family: var(--f-display);
  letter-spacing: var(--ls-tight);
  line-height: var(--lh-tight);
}

.elementor-widget-text-editor p,
.elementor-widget-text-editor li {
  font-family: var(--f-body);
  line-height: var(--lh-relaxed);
  color: var(--c-text);
}

/* ── BUTTON OVERRIDE ──────────────────────────── */
.elementor-widget-button .elementor-button {
  font-family: var(--f-body);
  font-weight: var(--fw-bold);
  border-radius: var(--btn-radius) !important;
  letter-spacing: 0;
  transition: all var(--tr-fast);
}

/* Primary button preset — apply class "tz-btn-primary" on button widget */
.elementor-widget-button.tz-btn-primary .elementor-button {
  background: var(--c-blue);
  border-color: var(--c-blue);
  box-shadow: var(--sh-blue);
}
.elementor-widget-button.tz-btn-primary .elementor-button:hover {
  background: var(--c-blue-dark);
  border-color: var(--c-blue-dark);
  transform: translateY(-2px);
}

/* Ghost button preset — apply class "tz-btn-ghost" on button widget */
.elementor-widget-button.tz-btn-ghost .elementor-button {
  background: rgba(255,255,255,0.12);
  border: 1.5px solid rgba(255,255,255,0.25) !important;
  color: #fff;
  backdrop-filter: blur(8px);
}
.elementor-widget-button.tz-btn-ghost .elementor-button:hover {
  background: rgba(255,255,255,0.2);
  border-color: rgba(255,255,255,0.4) !important;
  transform: translateY(-2px);
}

/* Green button preset */
.elementor-widget-button.tz-btn-green .elementor-button {
  background: var(--c-green);
  border-color: var(--c-green);
  box-shadow: var(--sh-green);
}
.elementor-widget-button.tz-btn-green .elementor-button:hover {
  background: var(--c-green-dark);
  transform: translateY(-2px);
}

/* ── SECTION HERO DARK ────────────────────────── */
.elementor-section.tz-hero,
.e-con.tz-hero {
  background: var(--g-hero) !important;
  position: relative;
}

.elementor-section.tz-hero .elementor-heading-title,
.elementor-section.tz-hero p,
.e-con.tz-hero .elementor-heading-title,
.e-con.tz-hero p {
  color: #fff;
}

/* Dot grid on dark hero sections */
.elementor-section.tz-dot-overlay::before,
.e-con.tz-dot-overlay::before {
  content: '';
  position: absolute;
  inset: 0;
  background-image: radial-gradient(circle, rgba(255,255,255,0.06) 1px, transparent 1px);
  background-size: 28px 28px;
  pointer-events: none;
  z-index: 1;
}
.elementor-section.tz-dot-overlay .elementor-container,
.e-con.tz-dot-overlay > .e-con-inner {
  position: relative;
  z-index: 2;
}

/* ── CARD HOVER LIFT (apply .tz-card-hover on widget) ── */
.tz-card-hover {
  transition: transform var(--tr-normal), box-shadow var(--tr-normal);
}
.tz-card-hover:hover {
  transform: translateY(-4px);
  box-shadow: var(--sh-4);
}

/* ── COUNTER WIDGET ───────────────────────────── */
.elementor-counter .elementor-counter-number-wrapper {
  font-family: var(--f-display);
  font-weight: var(--fw-black);
  letter-spacing: var(--ls-tighter);
  color: var(--c-blue);
}

.elementor-counter.tz-counter-green .elementor-counter-number-wrapper {
  color: var(--c-green-vivid);
}

/* ── ACCORDION WIDGET ─────────────────────────── */
.elementor-widget-accordion .elementor-accordion-icon {
  color: var(--c-blue);
}

.elementor-accordion .elementor-accordion-item {
  border: 1.5px solid var(--c-border);
  border-radius: var(--r-xl);
  margin-bottom: var(--sp-3);
  overflow: hidden;
}

.elementor-accordion .elementor-tab-title {
  font-family: var(--f-body);
  font-weight: var(--fw-semi);
  color: var(--c-navy);
}

.elementor-accordion .elementor-tab-title.elementor-active {
  color: var(--c-blue);
  border-bottom: 1px solid var(--c-border);
}

/* ── IMAGE WIDGET ─────────────────────────────── */
.elementor-widget-image img {
  border-radius: var(--r-2xl);
}

/* ── DIVIDER WIDGET ───────────────────────────── */
.elementor-widget-divider .elementor-divider-separator {
  border-color: var(--c-border);
}

/* ── ICON BOX WIDGET ──────────────────────────── */
.elementor-widget-icon-box .elementor-icon-box-icon .elementor-icon {
  color: var(--c-blue);
}

.elementor-widget-icon-box.tz-icon-box-circle .elementor-icon-box-icon .elementor-icon {
  background: var(--c-blue-light);
  border-radius: var(--r-full);
  padding: 12px;
}

/* ── FORM WIDGET ──────────────────────────────── */
.elementor-form .elementor-field-group .elementor-field {
  font-family: var(--f-body);
  border: var(--input-border);
  border-radius: var(--input-radius);
  height: var(--input-h);
  transition: border-color var(--tr-fast), box-shadow var(--tr-fast);
}

.elementor-form .elementor-field-group .elementor-field:focus {
  border-color: var(--c-blue);
  box-shadow: 0 0 0 3px var(--c-blue-light);
}

.elementor-form .elementor-field-type-textarea .elementor-field {
  height: auto;
  min-height: 120px;
}

.elementor-form .elementor-button {
  border-radius: var(--btn-radius) !important;
  font-family: var(--f-body);
  font-weight: var(--fw-bold);
  background: var(--c-blue);
  border-color: var(--c-blue);
  transition: all var(--tr-fast);
}

.elementor-form .elementor-button:hover {
  background: var(--c-blue-dark);
  transform: translateY(-2px);
}

/* ── MOBILE NAV STICKY BAR (custom HTML widget) ─ */
.tz-sticky-bar {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: var(--z-sticky);
  height: var(--lay-sticky-bar-h);
  background: var(--c-white);
  border-top: 1px solid var(--c-border);
  box-shadow: 0 -4px 24px rgba(13,27,75,0.10);
  display: flex;
  align-items: center;
  transition: transform var(--tr-normal);
}

.tz-sticky-bar.hidden { transform: translateY(100%); }

/* ── ANNOUNCE BAR (custom HTML widget / header) ─ */
.tz-announce {
  background: linear-gradient(90deg, var(--c-navy) 0%, var(--c-blue) 100%);
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: var(--fs-sm);
  color: rgba(255,255,255,0.92);
  font-family: var(--f-body);
  position: relative;
}

/* ── PROGRAMS GRID RESPONSIVE SNAP (mobile) ────── */
@media (max-width: 767px) {
  .tz-programs-scroll {
    display: flex;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    gap: var(--sp-4);
    padding-inline: var(--sp-4);
    padding-bottom: var(--sp-4);
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
  }

  .tz-programs-scroll::-webkit-scrollbar { display: none; }

  .tz-programs-scroll > * {
    flex: 0 0 min(320px, 85vw);
    scroll-snap-align: start;
  }
}

/* ── HELLO ELEMENTOR HEADER OVERRIDES ──────────── */
.site-header {
  border-bottom: none !important;
  box-shadow: none !important;
}

/* ── EDITOR-ONLY HELPERS ───────────────────────── */
.elementor-editor-active .tz-sticky-bar {
  display: none !important;
}

/* ── PARENT THEME FOOTER WIDTH FIX ─────────────── */
/* Hello Elementor theme.css caps .site-footer:not(.dynamic-footer) to max-width: 1140px.
   This makes the dark footer appear as a narrow box in the center of the page. Override it. */
.site-footer,
.site-footer:not(.dynamic-footer) {
  max-width: 100% !important;
  width: 100% !important;
}