﻿/* =========================================================
   Knowledge / Insights
   ========================================================= */
.knowledge {
    padding: 120px 48px;
    background: var(--m8crc-surface-raised);
    transition: background .3s;
}

.knowledge-inner {
    max-width: 1200px;
    margin: 0 auto;
}

.section-head {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    margin-bottom: 20px;
}

    .section-head h2 {
        font-size: clamp(36px, 4vw, 52px);
        font-weight: 300;
        color: var(--m8crc-text-base);
        transition: color .3s;
    }

        .section-head h2 em {
            font-style: italic;
            color: var(--m8crc-secondary);
        }

.carousel-nav {
    display: flex;
    gap: 12px;
}

    .carousel-nav button {
        width: 48px;
        height: 48px;
        border: 1px solid var(--m8crc-border-subtle);
        border-radius: 50%;
        background: transparent;
        cursor: pointer;
        display: flex;
        align-items: center;
        justify-content: center;
        transition: border-color .25s, background .25s;
    }

        .carousel-nav button:hover {
            border-color: var(--m8crc-secondary);
            background: var(--m8crc-surface-raised);
        }

        .carousel-nav button svg {
            width: 20px;
            height: 20px;
            stroke: var(--m8crc-text-subdued);
            fill: none;
            stroke-width: 1.5px;
        }

.carousel-track-wrap {
    overflow: hidden;
}

.carousel-track {
    display: flex;
    gap: 28px;
    transition: transform .55s cubic-bezier(.22,.61,0,1);
}

.knowledge-card {
    min-width: calc((100% - 56px) / 3);
    flex-shrink: 0;
    background: var(--m8crc-surface-base);
    border: 1px solid var(--m8crc-border-subtle);
    border-radius: 4px;
    overflow: hidden;
    transition: border-color .3s, box-shadow .3s, background .3s;
}

    .knowledge-card:hover {
        border-color: var(--m8crc-secondary);
        box-shadow: 0 8px 32px rgba(0,0,0,0.08);
    }

    .knowledge-card .card-accent {
        height: 3px;
        background: var(--m8crc-secondary);
    }

    .knowledge-card .card-body {
        padding: 32px;
    }

    .knowledge-card .card-tag {
        font-size: 10px;
        font-weight: 600;
        letter-spacing: 1.2px;
        text-transform: uppercase;
        color: var(--m8crc-secondary);
        margin-bottom: 14px;
        transition: color .3s;
    }

    .knowledge-card .card-date {
        font-size: 12px;
        color: var(--m8crc-text-muted);
        margin-bottom: 12px;
        transition: color .3s;
    }

    .knowledge-card h3 {
        font-family: 'Cormorant Garamond', serif;
        font-size: 22px;
        font-weight: 500;
        line-height: 1.35;
        color: var(--m8crc-text-base);
        margin-bottom: 12px;
        transition: color .3s;
    }

    .knowledge-card p {
        font-size: 13px;
        line-height: 1.7;
        color: var(--m8crc-text-subdued);
        font-weight: 400;
        transition: color .3s;
    }

    .knowledge-card .read-more {
        margin-top: 18px;
        display: inline-flex;
        align-items: center;
        gap: 6px;
        font-size: 12px;
        font-weight: 600;
        letter-spacing: .5px;
        text-transform: uppercase;
        color: var(--m8crc-secondary);
        transition: gap .25s, color .3s;
    }

        .knowledge-card .read-more:hover {
            gap: 10px;
        }

/* Responsive */
@media (max-width: 1024px) {
    .knowledge-card {
        min-width: calc((100% - 28px) / 2);
    }
}

@media (max-width: 768px) {
    .knowledge {
        padding: 80px 24px;
    }

    .section-head {
        flex-direction: column;
        align-items: flex-start;
        gap: 24px;
        margin-top: 20px;
    }

    .knowledge-card {
        min-width: 100%;
    }
}
