/* ==========================================================================
   Elementor (Free) glue — keeps the approved ClimaPlus design system in
   charge when page content is rendered by Elementor containers/widgets.
   Loaded only on pages built with Elementor.
   ========================================================================== */

/* Flatten helper: the widget markup behaves as a direct child of the
   theme section (used with the `clima-flat` class from the builder). */
.clima-flat,
.clima-flat > .elementor-widget-container,
.elementor-widget-shortcode,
.elementor-widget-shortcode > .elementor-widget-container {
  display: contents;
}

/* Elementor resets headings harder than the theme's element selectors —
   restore the approved typography (section-level rules still override). */
.elementor-widget-heading.clima-heading .elementor-heading-title {
  font-family: var(--font-family-primary);
  font-weight: var(--font-weight-medium);
  letter-spacing: var(--tracking-heading);
  color: var(--color-text);
  line-height: inherit;
}

/* Section-specific heading colors. These selectors intentionally outrank
   Elementor's generated `.elementor-widget-heading .elementor-heading-title`
   rule without forcing one color onto every heading on the site. */
.hero .elementor-widget-heading.clima-heading .elementor-heading-title,
.contact-hero .elementor-widget-heading.clima-heading .elementor-heading-title,
.final-cta .elementor-widget-heading.clima-heading .elementor-heading-title {
  color: #fff;
}

/* Elementor containers default to a column. Slider geometry and metadata
   must keep their real wrappers and explicit horizontal direction. */
.elementor .e-con.testi-slider-viewport {
  display: block;
  width: 100%;
  overflow: hidden;
}
.elementor .e-con.testi-slider-track {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: stretch;
  width: 100%;
}
.elementor .e-con.testi-slide {
  display: grid;
  flex: 0 0 100%;
  width: 100%;
  min-width: 100%;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  align-items: stretch;
}
.elementor .e-con.testi-meta {
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
}

/* The avatar widget owns clipping, radius, and size: never flatten it. */
.e-con .elementor-widget-image.testi-av {
  display: flex;
}
.testi-card--photo .clima-add-testi-photo img,
.testi-card--photo img.testi-photo {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

@media (max-width: 767px) {
  .elementor .e-con.testi-slider-viewport {
    display: block;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    overflow: hidden;
  }
  .elementor .e-con.testi-slider-track {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    gap: 0;
  }
  .elementor .e-con.testi-slide {
    display: contents;
  }
  .elementor .e-con.testi-card {
    flex: 0 0 100%;
    width: 100%;
    min-width: 100%;
    max-width: 100%;
  }
  .elementor .e-con.testi-card > .e-con,
  .elementor .e-con.testi-card .elementor-widget {
    min-width: 0;
    max-width: 100%;
  }
}

/* Elementor button widgets receive their approved ClimaPlus variant class on
   the real anchor via elementor-glue.js. Generated page/Kit CSS is loaded
   after this sheet, so every rule below deliberately includes the widget,
   Elementor anchor, and variant class (0,3,0 specificity). This beats Kit
   rules without coupling the theme to a local `.elementor-kit-XX` ID. */
.elementor-widget-button .elementor-button:is(
  .btn-hero-primary,
  .btn-hero-secondary,
  .btn-dl,
  .btn-quiz,
  .why-showcase-cta,
  .cta-btn-primary,
  .cta-btn-ghost
) {
  box-sizing: border-box;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  max-width: 100%;
  width: fit-content;
  font-family: inherit;
  line-height: 1.2;
  text-align: center;
  text-decoration: none;
  white-space: normal;
  overflow-wrap: anywhere;
  fill: currentColor;
}
.elementor-widget-button .elementor-button:is(
  .btn-hero-primary,
  .btn-hero-secondary,
  .btn-dl,
  .btn-quiz,
  .why-showcase-cta,
  .cta-btn-primary,
  .cta-btn-ghost
):focus-visible {
  outline: 3px solid currentColor;
  outline-offset: 3px;
}
.elementor-widget-button .elementor-button:is(
  .btn-hero-primary,
  .btn-hero-secondary,
  .btn-dl,
  .btn-quiz,
  .why-showcase-cta,
  .cta-btn-primary,
  .cta-btn-ghost
) svg {
  flex: 0 0 auto;
}

/* Hero variants. */
.elementor-widget-button .elementor-button.btn-hero-primary {
  gap: 8px;
  min-height: var(--control-height-lg);
  padding: 0 var(--control-padding-inline-lg);
  border: 0;
  border-radius: var(--radius-pill);
  background: var(--color-primary);
  color: #fff;
  font-size: var(--type-button-size);
  font-weight: var(--font-weight-semibold);
  letter-spacing: .06em;
  text-transform: uppercase;
  box-shadow: none;
  transition: opacity .2s, transform .2s;
}
.elementor-widget-button .elementor-button.btn-hero-primary:hover {
  background: var(--color-primary);
  color: #fff;
  opacity: .9;
  transform: translateY(-2px);
}
.elementor-widget-button .elementor-button.btn-hero-secondary {
  gap: 8px;
  min-height: var(--control-height-lg);
  padding: 0 var(--control-padding-inline-lg);
  border: 1.5px solid rgba(255,255,255,.45);
  border-radius: var(--radius-pill);
  background: rgba(255,255,255,.08);
  color: #fff;
  font-size: var(--type-button-size);
  font-weight: var(--font-weight-semibold);
  letter-spacing: .06em;
  text-transform: uppercase;
  box-shadow: none;
  backdrop-filter: blur(8px);
  transition: background .2s, border-color .2s, transform .2s;
}
.elementor-widget-button .elementor-button.btn-hero-secondary:hover {
  border-color: rgba(255,255,255,.7);
  background: rgba(255,255,255,.16);
  color: #fff;
  transform: translateY(-2px);
}

/* Catalogue and product-finder variants. */
.elementor-widget-button .elementor-button.btn-dl,
.elementor-widget-button .elementor-button.btn-quiz {
  gap: 9px;
  min-height: 44px;
  padding: 13px 24px;
  border-radius: var(--radius-pill);
  font-size: .88rem;
  font-weight: 600;
  letter-spacing: -.01em;
  box-shadow: none;
}
.elementor-widget-button .elementor-button.btn-dl {
  border: 0;
  background: #0D1424;
  color: #fff;
  transition: background .2s, transform .2s, box-shadow .2s;
}
.elementor-widget-button .elementor-button.btn-dl:hover {
  background: #14213c;
  color: #fff;
  transform: translateY(-2px);
  box-shadow: 0 12px 28px rgba(0,0,0,.32);
}
.elementor-widget-button .elementor-button.btn-quiz {
  border: 1.5px solid var(--color-border);
  background: var(--color-white);
  color: var(--color-text);
  transition: border-color .2s, transform .2s;
}
.elementor-widget-button .elementor-button.btn-quiz:hover {
  border-color: var(--color-navy);
  background: var(--color-white);
  color: var(--color-text);
  transform: translateY(-2px);
}
.elementor-widget-button .elementor-button.btn-quiz svg {
  color: var(--color-primary);
}

/* Editorial and final CTA variants. */
.elementor-widget-button .elementor-button.why-showcase-cta {
  gap: 9px;
  padding: 13px 26px;
  border: 0;
  border-radius: var(--radius-pill);
  background: var(--color-primary);
  color: #fff;
  font-size: .83rem;
  font-weight: 700;
  letter-spacing: .04em;
  box-shadow: none;
  transition: background .2s, transform .2s;
}
.elementor-widget-button .elementor-button.why-showcase-cta:hover {
  background: var(--color-primary-hover);
  color: #fff;
  transform: translateY(-2px);
}
.elementor-widget-button .elementor-button.why-showcase-cta:hover svg {
  transform: translateX(3px);
}
.final-cta .elementor-widget-button .elementor-button.cta-btn-primary,
.final-cta .elementor-widget-button .elementor-button.cta-btn-ghost {
  gap: 8px;
  min-height: var(--control-height-md);
  padding: 0 var(--control-padding-inline);
  border-radius: var(--radius-pill);
  font-size: var(--type-button-size);
  font-weight: var(--font-weight-semibold);
  box-shadow: none;
}
.final-cta .elementor-widget-button .elementor-button.cta-btn-primary {
  border: 0;
  background: var(--color-primary);
  color: #fff;
  transition: opacity .2s, transform .2s;
}
.final-cta .elementor-widget-button .elementor-button.cta-btn-primary:hover {
  background: var(--color-primary);
  color: #fff;
  opacity: .88;
  transform: translateY(-2px);
}
.final-cta .elementor-widget-button .elementor-button.cta-btn-ghost {
  border: 1.5px solid rgba(255,255,255,.35);
  background: transparent;
  color: rgba(255,255,255,.85);
  transition: background .2s, border-color .2s;
}
.final-cta .elementor-widget-button .elementor-button.cta-btn-ghost:hover {
  border-color: rgba(255,255,255,.6);
  background: rgba(255,255,255,.1);
  color: #fff;
}

/* Flatten only the presentation-only Elementor button wrappers. */
.elementor-widget-button.clima-btn,
.elementor-widget-button.clima-btn > .elementor-widget-container,
.elementor-widget-button.clima-btn .elementor-button-wrapper,
.elementor-widget-button.clima-btn .elementor-button-content-wrapper,
.elementor-widget-button.clima-btn .elementor-button-text {
  display: contents;
}
.elementor .e-con.catalog-cta-btns,
.elementor .e-con.cta-buttons,
.elementor .e-con.hero-buttons {
  flex-direction: row;
  align-items: center;
}
.elementor .e-con.cta-phone-buttons {
  flex-direction: row;
  align-items: center;
  flex-wrap: nowrap;
  gap: 12px;
}

/* Shortcode output is a flex item inside an Elementor container. Prevent its
   intrinsic desktop width from becoming the mobile carousel width. */
.elementor-widget-shortcode .elementor-shortcode {
  box-sizing: border-box;
  width: 100%;
  max-width: 100%;
  min-width: 0;
}
.elementor .p-visual > img.p-prod-img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

@media (max-width: 620px) {
  .elementor-widget-button .elementor-button.why-showcase-cta,
  .final-cta .elementor-widget-button .elementor-button.cta-btn-primary,
  .final-cta .elementor-widget-button .elementor-button.cta-btn-ghost {
    width: 100%;
  }
  .elementor .e-con.cta-buttons {
    flex-direction: column;
    align-items: stretch;
  }
  .elementor .e-con.cta-phone-buttons {
    flex-direction: row;
    gap: 8px;
  }
  .final-cta .e-con.cta-phone-buttons .elementor-button.cta-btn-ghost {
    width: auto;
    min-width: 0;
    flex: 1 1 0;
    padding-inline: 10px;
    font-size: .76rem;
  }
}

/* Images/videos: let the theme classes size them; kill Elementor's
   inline-block centering wrapper effects inside flattened layouts. */
.e-con .elementor-widget-image,
.e-con .elementor-widget-image > .elementor-widget-container {
  display: contents;
}
.e-con .elementor-widget-video {
  width: 100%;
}
.e-con .elementor-widget-video .elementor-video,
.e-con .elementor-widget-video video {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.why-slide.elementor-widget-video .elementor-widget-container,
.why-slide.elementor-widget-video .elementor-fit-aspect-ratio {
  height: 100%;
}
.contact-why-video .elementor-widget-video,
.contact-why-video .elementor-widget-container {
  height: 100%;
}

/* Widget wrappers must not add spacing inside approved sections. */
.e-con .elementor-widget:not(:last-child) {
  margin-bottom: 0;
}

/* home.css centers the about-bento header with direct-child selectors
   (`.about-bento > .container > h2`) that widget wrappers break. */
.about-bento .clima-about-h2,
.about-bento .clima-about-h2 h2,
.about-bento .container .subtitle {
  text-align: center;
}
.about-bento .clima-about-h2 h2 {
  margin-bottom: 0;
}
.about-bento .container .subtitle {
  margin-bottom: var(--space-12);
}

/* Legal pages built with Elementor reuse the approved reading layout. */
.clima-legal {
  display: block;
}

/* The Elementor document wrapper itself must never constrain the
   approved full-bleed sections. */
.elementor.elementor {
  max-width: none;
}
