/* ===================================================================
 * paricon page-fixes CSS — loaded on DQF (#685) and DIF (#677) only
 * Migrated from Kit #9 custom CSS field — Batch 7
 * =================================================================== */

/* DQF mobile text overflow fix */
@media (max-width: 767px) {
  :is(.elementor-page-685,.elementor-page-2830) .elementor-widget-text-editor,
  :is(.elementor-page-685,.elementor-page-2830) .elementor-widget-heading {
    max-width: 100% !important;
    overflow-wrap: break-word !important;
    word-break: break-word !important;
  }
  :is(.elementor-page-685,.elementor-page-2830) .e-con,
  :is(.elementor-page-685,.elementor-page-2830) .e-con-inner {
    max-width: 100% !important;
    overflow-x: hidden !important;
  }
}
@media (max-width: 767px) {
  body:is(.elementor-page-685,.elementor-page-2830) {
    overflow-x: hidden !important;
  }
}

/* DIF Wie tab text overflow fix */
:is(.elementor-page-677,.elementor-page-2828) .e-con .elementor-widget-text-editor .elementor-widget-container {
  max-width: 100% !important;
  overflow: hidden !important;
}
@media (max-width: 767px) {
  :is(.elementor-page-677,.elementor-page-2828) .elementor-widget-text-editor,
  :is(.elementor-page-677,.elementor-page-2828) .elementor-widget-heading {
    max-width: 100% !important;
    overflow-wrap: break-word !important;
    word-break: break-word !important;
  }
  body:is(.elementor-page-677,.elementor-page-2828) {
    overflow-x: hidden !important;
  }
}

/* DIF Warum tab - contain logo within slider */
:is(.elementor-page-677,.elementor-page-2828) .elementor-widget-image-carousel img,
:is(.elementor-page-677,.elementor-page-2828) .elementor-widget-slides img,
:is(.elementor-page-677,.elementor-page-2828) .swiper-slide img {
  max-width: 100% !important;
  height: auto !important;
  object-fit: contain !important;
}

/* ===================================================================
 * Partner Page CSS – P10a (KPI numbers white) + P10b (testimonial
 * eyebrow CYAN). Promoted to live post 2669 (slug /partnerschaft/)
 * in Sprint 2 after Sprint-1 review approval. Scope kept on both
 * .elementor-page-2669 (review sandbox) and .elementor-page-2669
 * (live) so the side-by-side comparison stays available until the
 * full cutover when 3253 is deleted.
 * =================================================================== */

/* P10a – KPI numbers (28+, 100+, 6, 0): plain white, no gradient */
.elementor-page-2669 .paricon-stat .number {
    background: none !important;
    background-image: none !important;
    -webkit-background-clip: initial !important;
    background-clip: initial !important;
    color: #FFFFFF !important;
    -webkit-text-fill-color: #FFFFFF !important;
}

/* P10b – STRATEGIC PARTNER TESTIMONIAL eyebrow: solid paricon CYAN #02CBFF */
.elementor-page-2669 .pt-eyebrow {
    background: none !important;
    background-image: none !important;
    -webkit-background-clip: initial !important;
    background-clip: initial !important;
    color: #02CBFF !important;
    -webkit-text-fill-color: #02CBFF !important;
}

/* ===================================================================
 * Partner Review (3253): hide standalone "Bereit für die Partnerschaft?"
 * CTA section (container b7ce7c0, widget 4fd1f64). The CTA function moves
 * into the new join-card popup inside the partner logo grid (handled by
 * paricon-partner-modals.php). Scope on 3253 only; Phase 2 will extend
 * to 2669 when popups promote to live.
 * =================================================================== */
.elementor-page-2669 .elementor-element-b7ce7c0 {
    display: none !important;
}

/* ===================================================================
 * Partner Review (3253): credibility strip (Approach E).
 *
 * KPIs (29+ / 100+ / 6 / 0) are rendered as a full-width 4-column
 * micro-strip between the hero and the subtitle/lead 2-col row.
 * The strip DOM is injected via JS in paricon-partner-modals.php
 * because (a) editing the Elementor section tree is more invasive
 * than a runtime DOM insert and (b) iterating on visual specs in
 * CSS is cheaper than re-running _elementor_data writes for each tweak.
 *
 * Hide rules for the original (now-orphaned) KPI block in widget
 * ed4981c stay scoped to 3253 only; Phase 2 promotion to live 2669
 * will extend the scope here AND in paricon-partner-modals.php.
 * =================================================================== */

/* Hide original KPI strip in widget ed4981c (relocated to top strip on 3253) */
.elementor-page-2669 .elementor-element-ed4981c .paricon-stats {
    display: none !important;
}

/* Pull testimonial row up to maintain uniform vertical rhythm */
.elementor-page-2669 .elementor-element-ed4981c .pt-row {
    margin-top: 0 !important;
}

/* Credibility strip — full-width 4-column band. Originally scoped to /partnerschaft/
   (page 2669); also used on /about-renewed-draft/ (page 3273). */
.elementor-page-2669 .prc-credibility-strip,
.elementor-page-3273 .prc-credibility-strip {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 24px;
    padding: 28px 0;
    margin: 0 auto;
    max-width: 1140px;
    border-top:    1px solid rgba(2, 203, 255, 0.25);
    border-bottom: 1px solid rgba(2, 203, 255, 0.25);
}
.elementor-page-2669 .prc-credibility-strip .prc-cred-stat,
.elementor-page-3273 .prc-credibility-strip .prc-cred-stat {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 6px;
    min-width: 0;
    padding: 0 8px;
}
.elementor-page-2669 .prc-credibility-strip .prc-cred-number,
.elementor-page-3273 .prc-credibility-strip .prc-cred-number {
    font-family: "Barlow", sans-serif;
    font-size: 2.0em;
    line-height: 1.1;
    font-weight: 700;
    color: #02CBFF;
    -webkit-text-fill-color: #02CBFF;
    background: none;
    background-image: none;
    letter-spacing: 0.5px;
}
.elementor-page-2669 .prc-credibility-strip .prc-cred-label,
.elementor-page-3273 .prc-credibility-strip .prc-cred-label {
    font-family: "Barlow", sans-serif;
    font-size: 0.88em;
    line-height: 1.35;
    font-weight: 500;
    color: rgba(255, 255, 255, 0.65);
    letter-spacing: 0.2px;
}

/* Tablet: tighter padding + smaller number, still 4 columns */
@media (max-width: 1024px) {
    .elementor-page-2669 .prc-credibility-strip,
    .elementor-page-3273 .prc-credibility-strip {
        gap: 16px;
        padding: 22px 16px;
    }
    .elementor-page-2669 .prc-credibility-strip .prc-cred-number,
    .elementor-page-3273 .prc-credibility-strip .prc-cred-number {
        font-size: 1.75em;
    }
}

/* Mobile: 2x2 grid */
@media (max-width: 640px) {
    .elementor-page-2669 .prc-credibility-strip,
    .elementor-page-3273 .prc-credibility-strip {
        grid-template-columns: repeat(2, 1fr);
        gap: 18px 16px;
        padding: 20px 16px;
    }
    .elementor-page-2669 .prc-credibility-strip .prc-cred-number,
    .elementor-page-3273 .prc-credibility-strip .prc-cred-number {
        font-size: 1.65em;
    }
    .elementor-page-2669 .prc-credibility-strip .prc-cred-label,
    .elementor-page-3273 .prc-credibility-strip .prc-cred-label {
        font-size: 0.82em;
    }
}

/* ===================================================================
 * Partner Review (3253): "IHR WEG ZUR PARTNERSCHAFT" timeline (widget
 * a91825d) — fix mobile/tablet view.
 *
 * The widget's inline @media (max-width: 900px) flips .steps to column
 * and .step to row, but it never overrides the desktop rule
 *   .step-text { align-items: center }
 * so the title + description end up horizontally centered inside their
 * column-flex container — visually they float in the middle of the
 * screen instead of sitting tight to the circle on the left.
 *
 * Fix: pin .step-text to align-items: flex-start. Add a subtle vertical
 * cyan→pink gradient line connecting the circles to mirror the desktop
 * horizontal connector.
 *
 * Scope on 3253 only; Phase 2 promotes to 2669 alongside the rest of
 * the Sprint-3 batches.
 * =================================================================== */
@media (max-width: 900px) {
    /* Pull title + desc tight to circle, left-aligned within step */
    .elementor-page-2669 .paricon-timeline .step .step-text {
        align-items: flex-start !important;
        flex: 1 1 auto;
        min-width: 0;
    }
    .elementor-page-2669 .paricon-timeline .step-title {
        text-align: left !important;
    }
    .elementor-page-2669 .paricon-timeline .step-desc {
        text-align: left !important;
        max-width: none !important;
    }

    /* Center the entire step column as a block to match the centred
       heading + subtitle above it. Shrink-to-content + margin auto, capped
       so very narrow viewports do not overflow. */
    .elementor-page-2669 .paricon-timeline .steps {
        width: max-content !important;
        max-width: 100% !important;
        margin: 0 auto !important;
        position: relative;
        gap: 24px !important;       /* slightly more breathing room than 20 */
    }

    /* Disable the original (full-width-anchored) connector */
    .elementor-page-2669 .paricon-timeline::before {
        display: none !important;
    }

    /* New connector anchored to the centred .steps block so it stays
       glued to the circles' centre at any viewport width */
    .elementor-page-2669 .paricon-timeline .steps::before {
        content: '' !important;
        display: block !important;
        position: absolute !important;
        top: 22px;        /* centre of first 44px circle */
        bottom: 22px;     /* centre of last 44px circle */
        left: 21px;       /* (44/2) - 1 = circle-centre minus half line width */
        right: auto;
        width: 2px;
        height: auto;
        background: linear-gradient(180deg, #02CBFF 0%, #FF0071 100%);
        opacity: 0.28;
        z-index: 1;
        pointer-events: none;
    }

    /* Keep each step above the line; opaque circle covers it */
    .elementor-page-2669 .paricon-timeline .step {
        position: relative;
        z-index: 2;
    }
    .elementor-page-2669 .paricon-timeline .step-num {
        background: #1A2032 !important;
    }
}

/* ===================================================================
 * PARTNER-SPACING – PARTNERNETZWERK intro row (container bb4970b) stacks
 * with zero vertical breathing room on mobile.
 *
 * Section: /partnerschaft/ (post 2669), the "PARICON PARTNERNETZWERK"
 * intro. Row bb4970b is a 2-col flex row:
 *   - col 925c854 (heading "PARICON PARTNERNETZWERK", text-editor f386121)
 *   - col 1febe18 (intro body, text-editor 0d925ab)
 *
 * Defect (verified against post-2669.css 2026-06-14):
 *   1. Row bb4970b carries --flex-wrap-mobile:wrap but NO --gap at any
 *      breakpoint -> when the row wraps to a column at <=767px the two
 *      stacked blocks touch (vertical gap = 0).
 *   2. col 925c854 keeps --width:44.705% even when wrapped (no mobile
 *      width override) -> the heading sits in a cramped ~44% column above
 *      the full-width body text.
 *
 * Fix: at <=767px (the Elementor mobile breakpoint where the row wraps),
 * give the row a vertical gap and reset both columns to full width so the
 * stacked heading + body read as two clearly separated rows.
 * Scoped to post 2669 only via the body class.
 * =================================================================== */
@media (max-width: 767px) {
    .elementor-page-2669 .elementor-element.elementor-element-bb4970b {
        --gap: 24px 24px;
        --row-gap: 24px;
        --column-gap: 24px;
    }
    .elementor-page-2669 .elementor-element.elementor-element-925c854,
    .elementor-page-2669 .elementor-element.elementor-element-1febe18 {
        --width: 100%;
        width: 100%;
    }
}