/* ==========================================================
   Knowledge article — стили статьи (из DEV/mintrans-etrn-september-2026).
   Все селекторы ограничены .knowledge-article, чтобы не ломать лендинг.
   ========================================================== */

/*
 * Локальные токены статьи. Не читаем var(--blue) в --ka-blue и обратно:
 * иначе возникает цикл, background: var(--blue) становится invalid,
 * и кнопка остаётся с белым текстом на светлом фоне.
 */
.knowledge-article {
    --ka-blue: #0D4FD7;
    --ka-blue-dark: #0a3fa8;
    --ka-blue-light: #eaf3ff;
    --ka-green: #00B37E;
    --ka-green-light: #eafaf5;
    --ka-text: #1D2433;
    --ka-text-light: #697488;
    --ka-surface: #ffffff;
    --ka-surface-alt: #f8fbff;
    --ka-background: #F5F8FD;
    --ka-border: #E4E9F2;
    --ka-radius-small: 12px;
    --ka-radius: 18px;
    --ka-radius-large: 24px;
    --ka-shadow-small: 0 6px 18px rgba(16, 43, 93, 0.06);
    --ka-shadow: 0 14px 40px rgba(16, 43, 93, 0.10);
    --ka-shadow-large: 0 28px 70px rgba(16, 43, 93, 0.14);
    color: var(--ka-text);

    /* Алиасы под селекторы из черновика статьи */
    --blue: #0D4FD7;
    --blue-dark: #0a3fa8;
    --blue-light: #eaf3ff;
    --green: #00B37E;
    --green-light: #eafaf5;
    --text: #1D2433;
    --text-light: #697488;
    --text-white: #ffffff;
    --background: #F5F8FD;
    --surface: #ffffff;
    --surface-alt: #f8fbff;
    --border: #E4E9F2;
    --radius-small: 12px;
    --radius: 18px;
    --radius-large: 24px;
    --shadow-small: 0 6px 18px rgba(16, 43, 93, 0.06);
    --shadow: 0 14px 40px rgba(16, 43, 93, 0.10);
    --shadow-large: 0 28px 70px rgba(16, 43, 93, 0.14);
}

.knowledge-article section {
    position: relative;
    padding: 90px 0;
}

/* Hero статьи — в черновике не было CSS, собран под стиль лендинга */
.knowledge-article .epd-news-hero {
    padding: 72px 0 64px;
    background:
        radial-gradient(ellipse 80% 60% at 90% 10%, rgba(13, 79, 215, 0.12), transparent 55%),
        radial-gradient(ellipse 50% 40% at 10% 90%, rgba(0, 179, 126, 0.08), transparent 50%),
        linear-gradient(180deg, #ffffff 0%, var(--ka-background) 100%);
    border-bottom: 1px solid var(--ka-border);
}

.knowledge-article .knowledge-back {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-bottom: 28px;
    font-size: 14px;
    font-weight: 500;
    color: var(--ka-text-light);
    text-decoration: none;
    transition: color 0.25s;
}

.knowledge-article .knowledge-back:hover {
    color: var(--ka-blue);
}

.knowledge-article .hero-badge {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 22px;
    padding: 8px 16px;
    border-radius: 999px;
    background: var(--ka-blue-light);
    color: var(--ka-blue);
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 0.01em;
}

.knowledge-article .epd-news-hero h1 {
    max-width: 920px;
    margin: 0 0 22px;
    font-size: clamp(28px, 4.2vw, 48px);
    line-height: 1.15;
    font-weight: 800;
    letter-spacing: -0.02em;
    color: var(--ka-text);
}

.knowledge-article .hero-description {
    max-width: 720px;
    margin: 0 0 32px;
    font-size: 18px;
    line-height: 1.7;
    color: var(--ka-text-light);
}

.knowledge-article .hero-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
}

.knowledge-article .button-primary,
.knowledge-article .button-outline {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 52px;
    padding: 14px 26px;
    border-radius: 14px;
    font-size: 15px;
    font-weight: 600;
    text-decoration: none;
    transition: 0.25s ease;
    cursor: pointer;
}

/* Явные цвета — не зависим от возможного сбоя var(--blue) */
.knowledge-article a.button-primary,
.knowledge-article .button-primary {
    background: linear-gradient(135deg, #0D4FD7 0%, #4B43E5 100%);
    color: #ffffff !important;
    border: none;
    box-shadow: 0 10px 28px rgba(13, 79, 215, 0.25);
}

.knowledge-article a.button-primary:hover,
.knowledge-article a.button-primary:visited,
.knowledge-article .button-primary:hover,
.knowledge-article .button-primary:visited {
    background: linear-gradient(135deg, #0a3fa8 0%, #3d36c9 100%);
    color: #ffffff !important;
    transform: translateY(-2px);
    box-shadow: 0 14px 32px rgba(13, 79, 215, 0.32);
}

.knowledge-article a.button-outline,
.knowledge-article .button-outline {
    background: #ffffff;
    color: #0D4FD7 !important;
    border: 1px solid #0D4FD7;
}

.knowledge-article a.button-outline:hover,
.knowledge-article a.button-outline:visited,
.knowledge-article .button-outline:hover,
.knowledge-article .button-outline:visited {
    background: #eaf3ff;
    color: #0D4FD7 !important;
}

.knowledge-article .summary {

    background:#ffffff;

    padding:90px 0;

}



/* ==========================================================
   SECTION HEADER
   ========================================================== */

.knowledge-article .section-header {

    max-width:820px;

    margin:0 auto 55px;

    text-align:center;

}



.knowledge-article .section-label {

    display:inline-flex;

    align-items:center;

    justify-content:center;

    padding:7px 16px;

    margin-bottom:20px;

    border-radius:50px;

    background:

        var(--blue-light);

    color:

        var(--blue);

    font-size:14px;

    font-weight:700;

    letter-spacing:.04em;

}



.knowledge-article .section-header h2 {

    margin-bottom:20px;

}



.knowledge-article .section-header p {

    font-size:18px;

    line-height:1.7;

}






/* ==========================================================
   SUMMARY GRID
   ========================================================== */

.knowledge-article .summary-grid {

    display:grid;

    grid-template-columns:

        repeat(4, 1fr);

    gap:24px;

}





/* ==========================================================
   CARD
   ========================================================== */

.knowledge-article .summary-card {

    position:relative;

    padding:32px 28px;

    min-height:280px;

    background:

        linear-gradient(

            180deg,

            #ffffff,

            #f8fbff

        );


    border:

        1px solid var(--border);


    border-radius:

        var(--radius);


    box-shadow:

        var(--shadow-small);


    transition:

        transform .25s ease,

        box-shadow .25s ease,

        border-color .25s ease;

}



.knowledge-article .summary-card:hover {

    transform:

        translateY(-7px);


    border-color:

        rgba(23,105,232,.25);


    box-shadow:

        var(--shadow);

}





/* ==========================================================
   ICON
   ========================================================== */

.knowledge-article .summary-icon {

    width:58px;

    height:58px;


    display:flex;

    align-items:center;

    justify-content:center;


    margin-bottom:24px;


    border-radius:16px;


    background:

        linear-gradient(

            135deg,

            rgba(23,105,232,.12),

            rgba(0,179,126,.12)

        );


    font-size:28px;

}





/* ==========================================================
   TITLE
   ========================================================== */

.knowledge-article .summary-card h3 {

    margin-bottom:14px;

    font-size:23px;

    line-height:1.3;

}





/* ==========================================================
   TEXT
   ========================================================== */

.knowledge-article .summary-card p {

    margin:0;

    font-size:16px;

    line-height:1.65;

}





.knowledge-article .summary-card strong {

    color:

        var(--blue);

}





/* ==========================================================
   DECORATIVE ELEMENT
   ========================================================== */

.knowledge-article .summary-card::after {

    content:"";

    position:absolute;


    right:22px;

    bottom:22px;


    width:45px;

    height:45px;


    border-radius:50%;


    background:

        radial-gradient(

            circle,

            rgba(0,179,126,.12),

            transparent 70%

        );


    pointer-events:none;

}

/* ==========================================================
   MEASOFT
   EPD NEWS PAGE

   style.css

   Part 03
   PRACTICAL CASES BLOCK
   ========================================================== */


/* ==========================================================
   SECTION
   ========================================================== */

   .knowledge-article .cases {

    padding:100px 0;

    background:

        var(--background);

}



/* ==========================================================
   GRID
   ========================================================== */

.knowledge-article .cases-grid {

    display:grid;

    grid-template-columns:

        repeat(2, 1fr);

    gap:28px;

}



/* ==========================================================
   CARD
   ========================================================== */

.knowledge-article .case-card {

    position:relative;

    padding:38px 36px;

    background:

        var(--surface);


    border:

        1px solid var(--border);


    border-radius:

        var(--radius-large);


    box-shadow:

        var(--shadow-small);


    overflow:hidden;


    transition:

        transform .25s ease,

        box-shadow .25s ease,

        border-color .25s ease;

}



.knowledge-article .case-card:hover {

    transform:

        translateY(-6px);


    border-color:

        rgba(23,105,232,.25);


    box-shadow:

        var(--shadow);

}





/* ==========================================================
   NUMBER
   ========================================================== */

.knowledge-article .case-number {

    position:absolute;


    top:25px;

    right:30px;


    font-size:64px;

    line-height:1;


    font-weight:800;


    color:

        rgba(23,105,232,.08);

}





/* ==========================================================
   TITLE
   ========================================================== */

.knowledge-article .case-card h3 {

    position:relative;

    z-index:2;


    max-width:420px;


    margin-bottom:18px;


    font-size:26px;

}





/* ==========================================================
   TEXT
   ========================================================== */

.knowledge-article .case-card p {

    position:relative;

    z-index:2;


    margin-bottom:28px;


    font-size:16px;


    line-height:1.7;

}





/* ==========================================================
   SOLUTION BOX
   ========================================================== */

.knowledge-article .case-solution {

    position:relative;

    z-index:2;


    padding:20px 22px;


    border-radius:

        var(--radius-small);


    background:

        linear-gradient(

            135deg,

            rgba(23,105,232,.06),

            rgba(0,179,126,.06)

        );


    border:

        1px solid rgba(23,105,232,.10);


    font-size:15px;

    line-height:1.6;


    color:

        var(--text-light);

}



.knowledge-article .case-solution strong {

    display:block;


    margin-bottom:6px;


    color:

        var(--blue);

}




/* ==========================================================
   DECORATIVE ELEMENT
   ========================================================== */

.knowledge-article .case-card::after {

    content:"";


    position:absolute;


    left:-50px;

    bottom:-50px;


    width:150px;

    height:150px;


    border-radius:50%;


    background:

        radial-gradient(

            circle,

            rgba(0,179,126,.12),

            transparent 70%

        );


    pointer-events:none;

}

/* ==========================================================
   MEASOFT
   EPD NEWS PAGE

   style.css

   Part 04
   SOLUTION + ARCHITECTURE BLOCK
   ========================================================== */


/* ==========================================================
   SECTION
   ========================================================== */

   .knowledge-article .solution {

    padding:100px 0;

    background:#ffffff;

}



/* ==========================================================
   LAYOUT
   ========================================================== */

.knowledge-article .solution-layout {

    display:grid;

    grid-template-columns:

        1fr 420px;

    gap:70px;

    align-items:center;

}





/* ==========================================================
   CONTENT
   ========================================================== */

.knowledge-article .solution-content h3 {

    margin-bottom:22px;

    font-size:30px;

}



.knowledge-article .solution-content p {

    font-size:17px;

    line-height:1.75;

}



.knowledge-article .solution-content ul {

    margin-top:30px;

}



.knowledge-article .solution-content li {

    position:relative;

    padding-left:12px;

    margin-bottom:14px;

}



.knowledge-article .solution-content li::marker {

    color:var(--blue);

}





/* ==========================================================
   ARCHITECTURE CARD
   ========================================================== */

.knowledge-article .architecture-card {

    padding:34px 30px;


    border-radius:

        var(--radius-large);


    background:

        linear-gradient(

            145deg,

            #f8fbff,

            #ffffff

        );


    border:

        1px solid var(--border);


    box-shadow:

        var(--shadow);

}





/* ==========================================================
   TITLE
   ========================================================== */

.knowledge-article .architecture-title {

    margin-bottom:28px;


    text-align:center;


    font-size:18px;


    font-weight:700;


    color:

        var(--text);

}





/* ==========================================================
   ARCHITECTURE ITEMS
   ========================================================== */

.knowledge-article .architecture-item {

    display:flex;

    align-items:center;


    gap:15px;


    padding:16px 18px;


    border-radius:

        var(--radius-small);


    background:#ffffff;


    border:

        1px solid var(--border);


    font-size:15px;


    font-weight:600;


    color:

        var(--text);

}





.knowledge-article .architecture-item span {

    display:flex;


    align-items:center;

    justify-content:center;


    width:32px;

    height:32px;


    border-radius:50%;


    background:

        var(--blue-light);


    color:

        var(--blue);


    font-size:14px;


    font-weight:700;

}





/* Активный узел MEASOFT */

.knowledge-article .architecture-item.active {

    background:

        linear-gradient(

            135deg,

            rgba(23,105,232,.08),

            rgba(0,179,126,.08)

        );


    border-color:

        rgba(23,105,232,.25);

}



.knowledge-article .architecture-item.active span {

    background:

        var(--blue);


    color:#ffffff;

}





/* ==========================================================
   ARROWS
   ========================================================== */

.knowledge-article .architecture-arrow {

    height:34px;


    display:flex;


    justify-content:center;


    align-items:center;


    color:

        var(--blue);


    font-size:24px;


    font-weight:700;

}




/* ==========================================================
   DECORATION
   ========================================================== */

.knowledge-article .architecture-card::before {

    content:"";


    position:absolute;

}


/* ==========================================================
   MEASOFT
   EPD NEWS PAGE

   style.css

   Part 05
   PARTNER BLOCK
   ========================================================== */


/* ==========================================================
   SECTION
   ========================================================== */

   .knowledge-article .partner {

    padding:100px 0;

    background:

        var(--background);

}





/* ==========================================================
   MAIN CARD
   ========================================================== */

.knowledge-article .partner-card {

    display:grid;

    grid-template-columns:

        1fr 320px;


    gap:50px;


    align-items:center;


    padding:55px;


    background:#ffffff;


    border:

        1px solid var(--border);


    border-radius:

        var(--radius-large);


    box-shadow:

        var(--shadow);

}





/* ==========================================================
   CONTENT
   ========================================================== */

.knowledge-article .partner-content h2 {

    margin-bottom:24px;

}



.knowledge-article .partner-content p {

    font-size:17px;

    line-height:1.75;

}





/* ==========================================================
   FEATURES
   ========================================================== */

.knowledge-article .partner-features {

    display:grid;

    grid-template-columns:

        repeat(3,1fr);


    gap:18px;


    margin-top:35px;

}





.knowledge-article .partner-feature {

    padding:22px;


    background:

        var(--surface-alt);


    border:

        1px solid var(--border);


    border-radius:

        var(--radius-small);


    font-size:14px;


    line-height:1.55;


    color:

        var(--text-light);

}



.knowledge-article .partner-feature strong {

    display:block;


    margin-bottom:8px;


    font-size:16px;


    color:

        var(--blue);

}





/* ==========================================================
   PARTNER BADGE
   ========================================================== */

.knowledge-article .partner-badge {

    display:flex;

    flex-direction:column;


    align-items:center;


    justify-content:center;


    padding:35px;


    min-height:280px;


    border-radius:

        var(--radius-large);


    background:

        linear-gradient(

            145deg,

            #f5f9ff,

            #ffffff

        );


    border:

        1px solid var(--border);

}





/* ==========================================================
   LOGO PLACEHOLDER
   ========================================================== */

.knowledge-article .partner-logo-placeholder {

    width:190px;

    height:120px;


    display:flex;


    align-items:center;

    justify-content:center;


    text-align:center;


    border-radius:20px;


    background:

        linear-gradient(

            135deg,

            rgba(23,105,232,.10),

            rgba(0,179,126,.10)

        );


    color:

        var(--blue);


    font-size:26px;


    font-weight:700;


    line-height:1.15;


    margin-bottom:25px;

}





/* ==========================================================
   STATUS
   ========================================================== */

.knowledge-article .partner-status {

    display:inline-flex;


    align-items:center;


    justify-content:center;


    gap:8px;


    padding:10px 18px;


    border-radius:50px;


    background:

        var(--green-light);


    color:

        #00875f;


    font-size:14px;


    font-weight:700;

}

/* ==========================================================
   MEASOFT
   EPD NEWS PAGE

   style.css

   Part 06
   INTEGRATION BLOCK
   ========================================================== */


/* ==========================================================
   SECTION
   ========================================================== */

   .knowledge-article .integration {

    padding:100px 0;

    background:#ffffff;

}



/* ==========================================================
   GRID
   ========================================================== */

.knowledge-article .integration-grid {

    display:grid;

    grid-template-columns:

        repeat(4,1fr);


    gap:24px;


    margin-top:50px;

}





/* ==========================================================
   CARD
   ========================================================== */

.knowledge-article .integration-card {

    padding:32px 26px;


    min-height:270px;


    background:

        linear-gradient(

            180deg,

            #ffffff,

            #f8fbff

        );


    border:

        1px solid var(--border);


    border-radius:

        var(--radius);


    box-shadow:

        var(--shadow-small);


    transition:

        transform .25s ease,

        box-shadow .25s ease,

        border-color .25s ease;

}





.knowledge-article .integration-card:hover {

    transform:

        translateY(-6px);


    box-shadow:

        var(--shadow);


    border-color:

        rgba(23,105,232,.25);

}





/* ==========================================================
   ICON
   ========================================================== */

.knowledge-article .integration-icon {

    width:70px;

    height:70px;


    display:flex;


    align-items:center;

    justify-content:center;


    margin-bottom:24px;


    border-radius:18px;


    background:

        linear-gradient(

            135deg,

            rgba(23,105,232,.12),

            rgba(0,179,126,.12)

        );


    color:

        var(--blue);


    font-size:20px;


    font-weight:800;


    letter-spacing:.02em;

}





/* ==========================================================
   TITLE
   ========================================================== */

.knowledge-article .integration-card h3 {

    margin-bottom:14px;


    font-size:22px;

    line-height:1.35;

}





/* ==========================================================
   TEXT
   ========================================================== */

.knowledge-article .integration-card p {

    margin:0;


    font-size:15px;


    line-height:1.65;

}





/* ==========================================================
   BOTTOM MESSAGE
   ========================================================== */

.knowledge-article .integration-bottom {

    margin-top:55px;


    padding:38px 45px;


    text-align:center;


    border-radius:

        var(--radius-large);


    background:

        linear-gradient(

            135deg,

            rgba(23,105,232,.06),

            rgba(0,179,126,.08)

        );


    border:

        1px solid rgba(23,105,232,.12);

}





.knowledge-article .integration-bottom h3 {

    margin-bottom:14px;


    font-size:28px;

}





.knowledge-article .integration-bottom p {

    max-width:850px;


    margin:0 auto;


    font-size:17px;

}

/* ==========================================================
   MEASOFT
   EPD NEWS PAGE

   style.css

   Part 07
   AUDIENCE BLOCK
   ========================================================== */


/* ==========================================================
   SECTION
   ========================================================== */

   .knowledge-article .audience {

    padding:100px 0;

    background:

        var(--background);

}





/* ==========================================================
   GRID
   ========================================================== */

.knowledge-article .audience-grid {

    display:grid;

    grid-template-columns:

        repeat(3,1fr);


    gap:28px;


    margin-top:50px;

}





/* ==========================================================
   CARD
   ========================================================== */

.knowledge-article .audience-card {

    padding:36px 32px;


    background:

        #ffffff;


    border:

        1px solid var(--border);


    border-radius:

        var(--radius-large);


    box-shadow:

        var(--shadow-small);


    transition:

        transform .25s ease,

        box-shadow .25s ease,

        border-color .25s ease;

}





.knowledge-article .audience-card:hover {

    transform:

        translateY(-7px);


    box-shadow:

        var(--shadow);


    border-color:

        rgba(23,105,232,.25);

}





/* ==========================================================
   ICON
   ========================================================== */

.knowledge-article .audience-icon {

    width:68px;

    height:68px;


    display:flex;


    align-items:center;

    justify-content:center;


    margin-bottom:25px;


    border-radius:20px;


    background:

        linear-gradient(

            135deg,

            rgba(23,105,232,.12),

            rgba(0,179,126,.12)

        );


    font-size:32px;

}





/* ==========================================================
   TITLE
   ========================================================== */

.knowledge-article .audience-card h3 {

    margin-bottom:16px;


    font-size:27px;

}





/* ==========================================================
   TEXT
   ========================================================== */

.knowledge-article .audience-card p {

    margin-bottom:22px;


    font-size:16px;


    line-height:1.7;

}





/* ==========================================================
   LIST
   ========================================================== */

.knowledge-article .audience-card ul {

    margin:0;

    padding:0;


    list-style:none;

}





.knowledge-article .audience-card li {

    position:relative;


    padding-left:25px;


    margin-bottom:12px;


    font-size:15px;


    line-height:1.55;

}





.knowledge-article .audience-card li::before {

    content:"";


    position:absolute;


    left:0;

    top:9px;


    width:8px;

    height:8px;


    border-radius:50%;


    background:

        var(--green);

}

/* ==========================================================
   MEASOFT
   EPD NEWS PAGE

   style.css

   Part 08
   CTA BLOCK
   ========================================================== */


/* ==========================================================
   SECTION
   ========================================================== */

   .knowledge-article .cta {

    padding:100px 0;

    background:

        var(--background);

}



/* ==========================================================
   CTA BOX
   ========================================================== */

.knowledge-article .cta-box {

    position:relative;


    display:grid;

    grid-template-columns:

        1fr 330px;


    gap:50px;


    align-items:center;


    padding:60px;


    overflow:hidden;


    border-radius:

        var(--radius-large);


    /* Светлая карточка: явно тёмный текст — иначе наследуется color:#fff с лендинга */
    color: #1D2433;

    text-align: left;

    background:

        linear-gradient(

            135deg,

            #ffffff,

            #f4f9ff

        );


    border:

        1px solid var(--border);


    box-shadow:

        var(--shadow);

}





/* ==========================================================
   DECORATION
   ========================================================== */

.knowledge-article .cta-box::before {

    content:"";


    position:absolute;


    top:-120px;

    right:-120px;


    width:300px;

    height:300px;


    border-radius:50%;

    pointer-events: none;


    background:

        radial-gradient(

            circle,

            rgba(23,105,232,.15),

            transparent 70%

        );


}





.knowledge-article .cta-box::after {

    content:"";


    position:absolute;


    bottom:-100px;

    left:-100px;


    width:250px;

    height:250px;


    border-radius:50%;

    pointer-events: none;


    background:

        radial-gradient(

            circle,

            rgba(0,179,126,.12),

            transparent 70%

        );


}





/* ==========================================================
   CONTENT
   ========================================================== */

.knowledge-article .cta-content {

    position:relative;

    z-index:2;

    color: #1D2433;

}



.knowledge-article .cta-content .section-label {

    color: #0D4FD7;

}



.knowledge-article .cta-content h2 {

    margin-bottom:22px;

    color: #1D2433;

}



.knowledge-article .cta-content p {

    max-width:760px;


    font-size:17px;


    line-height:1.75;

    color: #697488;

    opacity: 1;

}





/* ==========================================================
   BUTTONS
   ========================================================== */

.knowledge-article .cta-actions {

    display:flex;


    flex-wrap:wrap;


    gap:18px;


    margin-top:35px;

}





/* Кнопки — единые правила в начале файла */

/* ==========================================================
   POINTS
   ========================================================== */

.knowledge-article .cta-points {

    position:relative;

    z-index:2;


    padding:30px;


    border-radius:

        var(--radius);


    background:

        rgba(255,255,255,.8);


    border:

        1px solid var(--border);

    color: #1D2433;

}





.knowledge-article .cta-point {

    display:flex;


    align-items:center;

    color: #1D2433;


    gap:14px;


    padding:15px 0;


    border-bottom:

        1px solid var(--border);


    font-size:15px;


    color:

        var(--text);

}





.knowledge-article .cta-point:last-child {

    border-bottom:none;

}





.knowledge-article .cta-point span {

    display:flex;


    align-items:center;

    justify-content:center;


    width:28px;

    height:28px;


    border-radius:50%;


    background:

        var(--green-light);


    color:

        var(--green);


    font-weight:700;

}

/* Адаптив статьи */
@media (max-width: 1100px) {
    .knowledge-article .summary-grid {
        grid-template-columns: repeat(2, 1fr) !important;
    }
}

@media (max-width: 980px) {
    .knowledge-article section {
        padding: 64px 0;
    }

    .knowledge-article .summary-grid,
    .knowledge-article .cases-grid,
    .knowledge-article .integration-grid,
    .knowledge-article .audience-grid {
        grid-template-columns: 1fr !important;
    }

    .knowledge-article .solution-layout,
    .knowledge-article .partner-card,
    .knowledge-article .cta-box {
        grid-template-columns: 1fr !important;
    }
}

@media (max-width: 640px) {
    .knowledge-article .epd-news-hero {
        padding: 48px 0 40px;
    }

    .knowledge-article .hero-actions {
        flex-direction: column;
        align-items: stretch;
    }

    .knowledge-article .partner-card,
    .knowledge-article .architecture-card,
    .knowledge-article .cta-box {
        padding: 28px !important;
    }
}