/* ============================================================
   DIVI ADDITIONAL CSS
   Single file for all Divi-context rules.

   ORDER MATTERS:
   1. Base reset  — sets defaults for all Divi text elements
   2. Component overrides — defined after the reset at equal or
      higher specificity, so they win via cascade without !important

   Change font sizes in global-design-system.css (--fs-* variables).
   ============================================================ */


/* ── 1. BASE TYPOGRAPHY RESET ──────────────────────────────── */

.et-db .et_pb_text_inner p,
.et-db .et_pb_text_inner li { font-size: var(--fs-body); }
.et-db .et_pb_text_inner h1  { font-size: var(--fs-h1); }
.et-db .et_pb_text_inner h2  { font-size: var(--fs-h2); }


/* ── 2. COMPONENT OVERRIDES ────────────────────────────────── */
/* These share the same .et_pb_text_inner context and are defined
   after the reset, so they win cleanly via cascade order.       */

/* Product hero title — CSS class: "product-hero-title"
   Apply on the Divi Heading module containing the product name. */
.et-db .et_pb_text_inner .product-hero-title {
  font-family: var(--ff-serif, Georgia, serif);
  font-size: var(--fs-display);
  font-weight: 400;
  line-height: 1.15;
  margin: 0;
}

/* Product tagline — CSS class: "product-tagline"
   Apply on the Divi Text module pulling the tagline from ACF.
   Class is on the outer module div, so path is: .product-tagline > .et_pb_text_inner > p */
.et-db .product-tagline .et_pb_text_inner p {
  font-size: var(--fs-tagline);
  font-style: normal;
  line-height: 1.4;
  margin: 0;
}

.et-db .product-tagline .et_pb_text_inner p span {
  font-style: italic;
}


/* ── 3. STAT NUMBER ─────────────────────────────────────────── */
/* Applied via wrapper: <span class="stat-number"> */
.stat-number {
  font-family: var(--ff-serif, Georgia, serif);
  font-style: italic;
  font-size: clamp(32px, 4vw, 48px);
  font-weight: 400;
  color: var(--co-radiance);
  line-height: 1.1;
}


/* ── 4. HEADER LAYOUT (mobile) ──────────────────────────────── */
@media (max-width: 980px) {
  .header-items {
    display: flex;
    flex-direction: row !important;
    justify-content: center !important;
    align-items: center !important;
  }
  .header-items .toggle_menu-humburger {
    justify-content: center;
    display: flex;
  }
  .custom-menu .account-btn {
    filter: invert(1);
  }
}

.et_pb_code.et_pb_text_align_right.et_pb_module {
  margin-left: 0 !important;
  margin-right: 0 !important;
}
.et_pb_code_1_tb_header.et_pb_code.et_pb_module {
  margin-left: 0 !important;
  margin-right: 10px !important;
}
.et_pb_code_4_tb_header.et_pb_code.et_pb_module {
  margin-left: 0 !important;
  margin-right: 10px !important;
}


/* ── 5. TOP BANNER CAROUSEL ─────────────────────────────────── */
.topbannerslider.et_pb_group_carousel_slides_4 .et_pb_group,
.et_pb_group_carousel.et_pb_group_carousel_slides_4 .et_pb_group_carousel_slide {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

.topbannerslider.et_pb_group_carousel_slides_5 .et_pb_group,
.et_pb_group_carousel.et_pb_group_carousel_slides_5 .et_pb_group_carousel_slide {
  max-width: max-content !important;
}

@media (max-width: 480px) {
  .topbannerslider .et_pb_group_carousel_slide .et_pb_group {
    max-width: max-content !important;
    margin-right: auto !important;
    margin-left: auto !important;
  }
}