/* ============================================================
   Homepage — Custom CSS
   Conectivo
   ============================================================ */

.home main section:not(:nth-child(2)) {
  position: relative;
  z-index: 10;
}

/* ── Design tokens ──────────────────────────────────────── */

/* ── Header ─────────────────────────────────────────────── */

/* ── Hero ───────────────────────────────────────────────── */

/* ── Services ───────────────────────────────────────────── */
.home ul,
.home li {
  list-style: none;
  text-decoration: none;
  margin-block-start: 0;
  margin-block-end: 0;
  padding-inline-start: 0;
}

/* Left column — GSAP will pin this element while .home2 scrolls.
   height + flex centering keeps the counter visually centred in the viewport
   once GSAP makes it position:fixed. No CSS sticky needed. */
.services__left {
  height: 100vh;
  display: flex;
  align-items: center;
}

/* Right column grows to fit all stacked cards */
.services__right {
  flex: 1;
}

/* Background SVG — absolutely positioned by default (out of flow).
   ScrollTrigger toggles .is-fixed while .home2 is in the viewport,
   switching to position:fixed so it stays anchored top-right.
   No GSAP pin needed — pin-spacer would be 0×0 on an absolute element. */
.services__background {
  position: absolute;
  top: 0;
  right: 0;
  z-index: 2;
  pointer-events: none;
}
.services__background.is-fixed {
  position: fixed;
  top: 0;
  right: 0;
}
/* When the section ends, anchor to bottom of section so the SVG
   doesn't snap back to top:0 (which is above the viewport at that point) */
.services__background.is-ended {
  position: absolute;
  top: auto;
  bottom: 0;
  right: 0;
}

/* Each card = one viewport height so the counter updates once per card */
.services__card {
  position: relative;
  z-index: 3;
}

/* WordPress / Bricks sometimes adds scroll-behavior: smooth which breaks
   ScrollTrigger's internal remeasuring on resize. */
html {
  scroll-behavior: auto !important;
}

.kpis__card-background {
  opacity: 0;
}

.kpis__card:hover .kpis__card-background {
  opacity: 0.6;
}

.footer .brxe-social-icons li {
  padding: 0 !important;
}

/* ── home2Alt — False horizontal scroll, then normal vertical ───────
   Card 1 (intro) is pinned while card 2 slides in from the right.
   overflow:hidden clips card 1 exiting left and card 2 entering right.
   After the pin, cards 2–4 scroll normally.
   ─────────────────────────────────────────────────────────────────── */

.home2Alt .services__right {
  overflow: hidden;
}

/* Background SVG: always fixed and centred, only visible while the
   section is in the viewport. Staying fixed at all times avoids the
   flash caused by switching between position:absolute and position:fixed.
   JS adds/removes .is-fixed via ScrollTrigger. */
.home2Alt .services__background {
  position: fixed !important;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  visibility: hidden;
}
.home2Alt .services__background.is-fixed {
  visibility: visible;
}