﻿:root {
    --pc-navy: #0e2445;
    --pc-blue: #1769e0;
    --pc-green: #12a66a;
    --pc-text: #14233d;
    --pc-muted: #667793;
    --pc-line: #dae5f2;
}

.pc-page {
    min-height: 75vh;
    overflow: hidden;
    background: #f5f8fd;
    color: var(--pc-text);
}

.pc-hero {
    position: relative;
    isolation: isolate;
    padding: 86px 0 78px;
    overflow: hidden;
    border-bottom: 1px solid #d9e6f4;
    background: linear-gradient(rgba(23, 105, 224, .035) 1px, transparent 1px), linear-gradient(90deg, rgba(23, 105, 224, .035) 1px, transparent 1px), linear-gradient(135deg, #f9fcff 0%, #eef5ff 60%, #effbf6 100%);
    background-size: 42px 42px, 42px 42px, auto;
}

.pc-orb {
    position: absolute;
    z-index: -1;
    border-radius: 50%;
    filter: blur(4px);
    pointer-events: none;
}

.pc-orb-one {
    top: -210px;
    right: -100px;
    width: 560px;
    height: 560px;
    background: radial-gradient(circle, rgba(36, 186, 122, .2), rgba(36, 186, 122, 0) 68%);
}

.pc-orb-two {
    bottom: -330px;
    left: -180px;
    width: 650px;
    height: 650px;
    background: radial-gradient(circle, rgba(39, 111, 230, .18), rgba(39, 111, 230, 0) 70%);
}

.pc-hero-container {
    display: grid;
    grid-template-columns: minmax(0, 1.15fr) minmax(360px, .72fr);
    align-items: center;
    gap: clamp(45px, 7vw, 100px);
}

.pc-eyebrow,
.pc-section-kicker {
    color: #0d9161;
    font-size: .76rem;
    font-weight: 850;
    letter-spacing: .12em;
    text-transform: uppercase;
}

.pc-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    margin-bottom: 20px;
    padding: 9px 14px;
    border: 1px solid #c8eadc;
    border-radius: 999px;
    background: rgba(238, 252, 246, .88);
}

.pc-hero h1 {
    max-width: 850px;
    margin: 0;
    color: #103d88;
    font-size: clamp(3rem, 5.6vw, 5.4rem);
    font-weight: 950;
    line-height: .98;
    letter-spacing: -.065em;
}

    .pc-hero h1 span {
        display: block;
        color: #13ae64;
    }

.pc-hero-copy > p {
    max-width: 720px;
    margin: 24px 0 0;
    color: #5f7290;
    font-size: 1.08rem;
    line-height: 1.75;
}

.pc-hero-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 30px;
}

.pc-primary-action,
.pc-secondary-action,
.pc-cta-card > a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    min-height: 52px;
    padding: 0 20px;
    border-radius: 14px;
    font-weight: 800;
    text-decoration: none;
    transition: transform .2s ease, box-shadow .2s ease, background .2s ease;
}

.pc-primary-action {
    background: linear-gradient(135deg, #176ce3, #125bc6);
    box-shadow: 0 14px 28px rgba(23, 105, 224, .25);
    color: #fff;
}

.pc-secondary-action {
    border: 1px solid #cfdded;
    background: rgba(255, 255, 255, .82);
    color: #153b75;
}

    .pc-primary-action:hover,
    .pc-secondary-action:hover,
    .pc-cta-card > a:hover {
        transform: translateY(-2px);
    }

.pc-primary-action:hover {
    color: #fff;
    box-shadow: 0 18px 34px rgba(23, 105, 224, .32);
}

.pc-secondary-action:hover {
    color: #0e55bb;
    background: #fff;
}

.pc-hero-dashboard {
    padding: 26px;
    border: 1px solid rgba(193, 213, 235, .9);
    border-radius: 28px;
    background: rgba(255, 255, 255, .88);
    box-shadow: 0 30px 70px rgba(29, 63, 108, .13);
    backdrop-filter: blur(14px);
}

.pc-dashboard-head {
    display: flex;
    align-items: center;
    gap: 13px;
    padding-bottom: 20px;
    border-bottom: 1px solid #e2eaf4;
}

.pc-dashboard-icon {
    display: grid;
    width: 48px;
    height: 48px;
    place-items: center;
    border-radius: 15px;
    background: linear-gradient(135deg, #176ce3, #2d91ed);
    color: #fff;
    font-size: 1.15rem;
}

.pc-dashboard-head > span:last-child {
    display: flex;
    flex-direction: column;
}

.pc-dashboard-head small {
    color: #75849a;
    font-size: .75rem;
    font-weight: 700;
}

.pc-dashboard-head strong {
    margin-top: 2px;
    color: #10213d;
    font-size: 1rem;
}

.pc-stat-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    margin-top: 20px;
}

.pc-stat-card {
    display: flex;
    min-height: 132px;
    flex-direction: column;
    justify-content: center;
    padding: 18px;
    border-radius: 20px;
}

    .pc-stat-card.blue {
        background: #edf5ff;
        color: #1764d1;
    }

    .pc-stat-card.green {
        background: #ebfaf3;
        color: #0d9a60;
    }

    .pc-stat-card i {
        font-size: 1.25rem;
    }

    .pc-stat-card strong {
        margin-top: 9px;
        color: #10213d;
        font-size: 1.8rem;
        line-height: 1;
    }

    .pc-stat-card span {
        margin-top: 6px;
        font-size: .76rem;
        font-weight: 700;
    }

.pc-dashboard-note {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-top: 14px;
    padding: 14px;
    border-radius: 16px;
    background: #f6f8fc;
}

    .pc-dashboard-note > i {
        color: #10a868;
        font-size: 1.35rem;
    }

    .pc-dashboard-note span {
        display: flex;
        flex-direction: column;
    }

    .pc-dashboard-note strong {
        font-size: .84rem;
    }

    .pc-dashboard-note small {
        margin-top: 2px;
        color: #77869a;
        font-size: .7rem;
    }

.pc-content {
    padding: 72px 0 82px;
}

.pc-section-head {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 30px;
    margin-bottom: 34px;
}

    .pc-section-head h2 {
        margin: 8px 0 0;
        color: var(--pc-navy);
        font-size: clamp(2rem, 3.4vw, 3.2rem);
        font-weight: 900;
        letter-spacing: -.045em;
    }

    .pc-section-head p {
        margin: 10px 0 0;
        color: var(--pc-muted);
    }

.pc-search {
    display: flex;
    width: min(100%, 360px);
    min-height: 54px;
    align-items: center;
    gap: 11px;
    padding: 0 12px 0 17px;
    border: 1px solid #d3e0ef;
    border-radius: 16px;
    background: #fff;
    box-shadow: 0 10px 25px rgba(30, 65, 110, .06);
    color: #7890aa;
}

    .pc-search:focus-within {
        border-color: #70a8ed;
        box-shadow: 0 0 0 4px rgba(23, 105, 224, .1);
    }

    .pc-search input {
        min-width: 0;
        flex: 1;
        border: 0;
        outline: 0;
        background: transparent;
        color: #152540;
    }

    .pc-search span {
        padding: 5px 7px;
        border: 1px solid #dbe5f0;
        border-radius: 7px;
        color: #8290a3;
        font-size: .65rem;
        white-space: nowrap;
    }

.pc-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 24px;
}

.pc-grid-single {
    grid-template-columns: minmax(0, 720px);
    justify-content: center;
}

.pc-card {
    overflow: hidden;
    border: 1px solid #d9e5f2;
    border-radius: 26px;
    background: #fff;
    box-shadow: 0 15px 38px rgba(24, 55, 94, .08);
    transition: transform .24s ease, box-shadow .24s ease, border-color .24s ease;
}

    .pc-card:hover {
        transform: translateY(-7px);
        border-color: #91b8e9;
        box-shadow: 0 26px 55px rgba(24, 55, 94, .15);
    }

    .pc-card[hidden] {
        display: none;
    }

.pc-card-link {
    display: block;
    height: 100%;
    color: inherit;
    text-decoration: none;
}

.pc-card-media {
    position: relative;
    display: grid;
    min-height: 190px;
    place-items: center;
    overflow: hidden;
    background: linear-gradient(135deg, #eef6ff, #eefaf5);
}

    .pc-card-media > img {
        position: absolute;
        inset: 0;
        width: 100%;
        height: 100%;
        object-fit: cover;
        transition: transform .4s ease;
    }

.pc-card:hover .pc-card-media > img {
    transform: scale(1.045);
}

.pc-card-icon {
    display: grid;
    position: relative;
    z-index: 2;
    width: 82px;
    height: 82px;
    place-items: center;
    border: 1px solid rgba(255, 255, 255, .8);
    border-radius: 25px;
    box-shadow: 0 15px 30px rgba(25, 64, 110, .12);
    font-size: 2rem;
}

    .pc-card-icon.blue {
        background: #e7f2ff;
        color: #1767d9;
    }

    .pc-card-icon.green {
        background: #e5faef;
        color: #0fa45d;
    }

    .pc-card-icon.purple {
        background: #efebff;
        color: #7253e8;
    }

    .pc-card-icon.orange {
        background: #fff3df;
        color: #e69213;
    }

    .pc-card-icon.pink {
        background: #ffebf4;
        color: #e64c8a;
    }

    .pc-card-icon.indigo {
        background: #e9edff;
        color: #4f60df;
    }

.pc-course-badge {
    position: absolute;
    z-index: 3;
    top: 16px;
    right: 16px;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 10px;
    border: 1px solid rgba(255, 255, 255, .75);
    border-radius: 999px;
    background: rgba(255, 255, 255, .9);
    box-shadow: 0 8px 18px rgba(20, 47, 80, .1);
    color: #174b8e;
    font-size: .72rem;
    font-weight: 800;
    backdrop-filter: blur(8px);
}

.pc-card-shine {
    position: absolute;
    inset: auto -30% -80% auto;
    width: 230px;
    height: 230px;
    border-radius: 50%;
    background: rgba(24, 170, 104, .1);
}

.pc-card-body {
    padding: 24px 24px 26px;
}

.pc-card-number {
    color: #168d64;
    font-size: .68rem;
    font-weight: 850;
    letter-spacing: .09em;
    text-transform: uppercase;
}

.pc-card-body h3 {
    margin: 8px 0 0;
    color: #10213d;
    font-size: 1.35rem;
    font-weight: 900;
}

.pc-card-body p {
    min-height: 50px;
    margin: 11px 0 0;
    color: #6b7c94;
    font-size: .88rem;
    line-height: 1.6;
}

.pc-card-action {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 20px;
    padding-top: 18px;
    border-top: 1px solid #e5ebf3;
    color: #1767d9;
    font-size: .86rem;
    font-weight: 850;
}

    .pc-card-action i {
        transition: transform .2s ease;
    }

.pc-card:hover .pc-card-action i {
    transform: translateX(5px);
}

.pc-no-results,
.pc-empty {
    padding: 70px 24px;
    border: 1px dashed #c8d8e9;
    border-radius: 26px;
    background: #fff;
    text-align: center;
}

    .pc-empty > span {
        display: grid;
        width: 70px;
        height: 70px;
        margin: 0 auto;
        place-items: center;
        border-radius: 22px;
        background: #edf5ff;
        color: #1769df;
        font-size: 1.8rem;
    }

    .pc-empty h2,
    .pc-no-results h3 {
        margin: 16px 0 0;
        color: #10213d;
        font-weight: 900;
    }

    .pc-empty p,
    .pc-no-results p {
        margin: 8px 0 0;
        color: #718097;
    }

    .pc-empty a {
        display: inline-flex;
        gap: 8px;
        margin-top: 20px;
        color: #1767d9;
        font-weight: 800;
        text-decoration: none;
    }

    .pc-no-results i {
        color: #1769df;
        font-size: 2rem;
    }

.pc-cta {
    padding: 0 0 84px;
    background: #f5f8fd;
}

.pc-cta-card {
    display: grid;
    grid-template-columns: auto 1fr auto;
    align-items: center;
    gap: 22px;
    padding: 30px;
    overflow: hidden;
    border: 1px solid rgba(90, 134, 199, .25);
    border-radius: 28px;
    background: linear-gradient(135deg, #103d88, #155bb5 58%, #128e67);
    box-shadow: 0 24px 55px rgba(16, 61, 136, .22);
    color: #fff;
}

.pc-cta-icon {
    display: grid;
    width: 64px;
    height: 64px;
    place-items: center;
    border: 1px solid rgba(255, 255, 255, .22);
    border-radius: 20px;
    background: rgba(255, 255, 255, .14);
    font-size: 1.5rem;
}

.pc-cta-card div > span {
    color: #adf0d1;
    font-size: .72rem;
    font-weight: 850;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.pc-cta-card h2 {
    margin: 5px 0 0;
    font-size: 1.55rem;
    font-weight: 900;
}

.pc-cta-card p {
    margin: 6px 0 0;
    color: rgba(255, 255, 255, .76);
    font-size: .87rem;
}

.pc-cta-card > a {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    gap: 10px;
    min-width: 185px;
    min-height: 52px;
    padding: 0 20px;
    background: #ffffff !important;
    color: #104d9e !important;
    font-size: 0.86rem;
    font-weight: 850;
    line-height: 1;
    white-space: nowrap;
    text-decoration: none !important;
}

    .pc-cta-card > a i {
        display: inline-block;
        color: #104d9e !important;
    }

    .pc-cta-card > a:hover {
        color: #0d438a;
        box-shadow: 0 12px 25px rgba(0, 0, 0, .14);
    }

@media (max-width: 1199.98px) {
    .pc-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 991.98px) {
    .pc-hero {
        padding: 65px 0;
    }

    .pc-hero-container {
        grid-template-columns: 1fr;
    }

    .pc-hero-dashboard {
        max-width: 620px;
    }

    .pc-cta-card {
        grid-template-columns: auto 1fr;
    }

        .pc-cta-card > a {
            grid-column: 1 / -1;
            justify-self: start;
        }
}

@media (max-width: 767.98px) {
    .pc-section-head {
        align-items: stretch;
        flex-direction: column;
    }

    .pc-search {
        width: 100%;
    }

    .pc-grid,
    .pc-grid-single {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 575.98px) {
    .pc-hero {
        padding: 50px 0;
    }

        .pc-hero h1 {
            font-size: 2.8rem;
        }

    .pc-hero-actions {
        flex-direction: column;
    }

    .pc-primary-action,
    .pc-secondary-action {
        width: 100%;
    }

    .pc-hero-dashboard {
        padding: 19px;
        border-radius: 22px;
    }

    .pc-stat-grid {
        grid-template-columns: 1fr;
    }

    .pc-stat-card {
        min-height: 105px;
    }

    .pc-content {
        padding: 54px 0 64px;
    }

    .pc-card-media {
        min-height: 175px;
    }

    .pc-cta-card {
        grid-template-columns: 1fr;
        padding: 24px;
    }

        .pc-cta-card > a {
            width: 100%;
        }
}

@media (prefers-reduced-motion: reduce) {
    .pc-card,
    .pc-card-media > img,
    .pc-card-action i,
    .pc-primary-action,
    .pc-secondary-action,
    .pc-cta-card > a {
        transition: none;
    }
}
