.concept-hero {
    border-radius: 28px;
    color: white;
    background: radial-gradient(circle at top left, rgba(37, 183, 177, 0.28), transparent 34%), radial-gradient(circle at bottom right, rgba(255, 184, 77, 0.20), transparent 30%), linear-gradient(135deg, #0b3c5d 0%, #12264b 55%, #17203a 100%);
}

.concept-kicker {
    color: #7ee0da;
    font-weight: 800;
    letter-spacing: 0.08em;
}

.concept-title {
    max-width: 980px;
    font-weight: 900;
    line-height: 1.1;
}

.concept-subtitle {
    max-width: 980px;
    color: rgba(255, 255, 255, 0.82);
    line-height: 1.55;
}

.concept-card,
.concept-platform,
.concept-explain-card {
    border-radius: 24px;
    border: 1px solid rgba(15, 23, 42, 0.08);
}

.concept-card {
    min-height: 170px;
    color: white;
    transition: transform 0.18s ease, box-shadow 0.18s ease;
}

    .concept-card:hover,
    .concept-explain-card:hover,
    .concept-project-tile:hover {
        transform: translateY(-2px);
        box-shadow: 0 14px 34px rgba(15, 23, 42, 0.10);
    }

.concept-card-title {
    font-weight: 800;
    line-height: 1.25;
}

.concept-card-text {
    color: rgba(255, 255, 255, 0.82);
    line-height: 1.5;
}

.concept-card-blue {
    background: linear-gradient(135deg, #0b3c5d, #2563eb);
}

.concept-card-green {
    background: linear-gradient(135deg, #0f766e, #22c55e);
}

.concept-card-indigo {
    background: linear-gradient(135deg, #312e81, #6366f1);
}

.concept-card-orange {
    background: linear-gradient(135deg, #c2410c, #f59e0b);
}

.concept-card-purple {
    background: linear-gradient(135deg, #6d28d9, #a855f7);
}

.concept-card-teal {
    background: linear-gradient(135deg, #0f766e, #25b7b1);
}

.concept-relation {
    border-radius: 999px;
    text-align: center;
    color: #0b3c5d;
    background: #f8fafc;
    border: 1px dashed rgba(11, 60, 93, 0.28);
    font-weight: 700;
    font-size: 0.86rem;
}

.concept-chip {
    background: rgba(255, 255, 255, 0.20) !important;
    color: white !important;
    font-weight: 700 !important;
}

.concept-chip-light {
    background: rgba(255, 255, 255, 0.18) !important;
    color: white !important;
    font-weight: 700 !important;
}

.concept-platform {
    background: radial-gradient(circle at top, rgba(37, 183, 177, 0.14), transparent 36%), #ffffff;
    min-height: 100%;
}

.concept-kicker-dark {
    color: #0f766e;
    font-weight: 800;
    letter-spacing: 0.08em;
}

.concept-platform-title {
    color: #0b3c5d;
    font-weight: 900;
}

.concept-platform-subtitle {
    color: #475569;
}

.concept-portfolio {
    border-radius: 22px;
    background: #f8fafc;
    border: 1px solid rgba(11, 60, 93, 0.10);
}

.concept-section-title {
    color: #0b3c5d;
    font-weight: 850;
}

.concept-project-tile {
    border-radius: 18px;
    text-align: center;
    background: white;
    border: 1px solid rgba(11, 60, 93, 0.10);
    color: #0b3c5d;
    transition: transform 0.18s ease, box-shadow 0.18s ease;
}

    .concept-project-tile .mud-typography-h6 {
        font-weight: 900;
    }

.concept-stage-card {
    border-radius: 18px;
    background: white;
    border: 1px solid rgba(11, 60, 93, 0.10);
    height: 100%;
}

.concept-stage-icon {
    color: #25b7b1;
}

.concept-stage-title {
    color: #0b3c5d;
    font-weight: 800;
}

.concept-alert {
    border-radius: 16px;
}

.concept-explain-card {
    background: #ffffff;
    transition: transform 0.18s ease, box-shadow 0.18s ease;
}

.concept-step-number {
    background: #0b3c5d !important;
    color: white !important;
    font-weight: 900 !important;
}

.concept-explain-text {
    color: #475569;
    line-height: 1.65;
}

@media (max-width: 960px) {
    .concept-title {
        font-size: 2rem;
    }

    .concept-hero {
        padding: 28px !important;
    }
}

.cls-project-concept-link {
    padding: 10px 18px;
    text-transform: none;
    font-weight: 200;
    color: white !important;
    background: linear-gradient(135deg, #505AB6, #03E6AD) !important;
    box-shadow: 0 10px 24px rgba(11, 60, 93, 0.18);
    transition: transform 0.18s ease, box-shadow 0.18s ease;
}

    .cls-project-concept-link:hover {
        transform: translateY(-1px);
        box-shadow: 0 14px 30px rgba(11, 60, 93, 0.24);
    }