:root {
    --lmd-bg-dark: #031525;
    --lmd-bg-dark-2: #082b4b;
    --lmd-blue: #146fe0;
    --lmd-blue-soft: #e8f2ff;

    --text-main: #13253f;
    --text-muted: #66768b;

    --surface-page: #f3f7fa;
    --surface: #ffffff;
    --border: #d7e1eb;

    --success: #17855f;
    --success-soft: #e9f7f1;

    --construction: #8a6a19;
    --construction-soft: #fff8df;

    --radius-card: 22px;
    --radius-control: 11px;

    --shadow:
        0 20px 55px rgba(10, 40, 72, .12);
}

*,
*::before,
*::after {
    box-sizing: border-box;
}

html,
body {
    min-height: 100%;
}

body {
    margin: 0;
    min-width: 320px;

    color: var(--text-main);
    background: var(--surface-page);

    font-family:
        "Segoe UI Variable",
        "Segoe UI",
        system-ui,
        -apple-system,
        BlinkMacSystemFont,
        Roboto,
        Helvetica,
        Arial,
        sans-serif;

    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
}

/* ==========================================================
   ESTRUTURA
   ========================================================== */

.cursos-page {
    min-height: 100vh;

    display: grid;

    grid-template-columns:
        minmax(360px, .92fr)
        minmax(0, 1.55fr);
}

/* ==========================================================
   PAINEL INSTITUCIONAL
   ========================================================== */

.cursos-hero {
    position: relative;

    min-height: 100vh;

    display: flex;
    align-items: center;

    overflow: hidden;

    color: #ffffff;

    background:
        radial-gradient(
            circle at 82% 23%,
            rgba(41, 137, 255, .25),
            transparent 27%
        ),
        radial-gradient(
            circle at 18% 81%,
            rgba(33, 111, 201, .18),
            transparent 30%
        ),
        linear-gradient(
            135deg,
            var(--lmd-bg-dark) 0%,
            #041c32 48%,
            var(--lmd-bg-dark-2) 100%
        );
}

.cursos-hero::before {
    content: "";

    position: absolute;
    inset: 0;

    opacity: .24;

    pointer-events: none;

    background-image:
        linear-gradient(
            rgba(88, 166, 247, .11) 1px,
            transparent 1px
        ),
        linear-gradient(
            90deg,
            rgba(88, 166, 247, .08) 1px,
            transparent 1px
        );

    background-size: 72px 72px;
}

.cursos-hero::after {
    content: "";

    position: absolute;

    right: -310px;
    bottom: -410px;

    width: 760px;
    height: 760px;

    border:
        1px solid rgba(74, 160, 255, .20);

    border-radius: 50%;

    box-shadow:
        0 0 0 95px rgba(50, 145, 255, .024),
        0 0 0 190px rgba(50, 145, 255, .020);

    pointer-events: none;
}

.cursos-hero__conteudo {
    position: relative;
    z-index: 1;

    width: min(78%, 540px);

    margin:
        0
        auto;
}

.cursos-logo {
    display: block;

    width: 285px;
    max-width: 100%;
    height: auto;

    margin-bottom: 56px;
}

.cursos-eyebrow {
    margin: 0 0 10px;

    color: #63b9ff;

    font-size: 13px;
    font-weight: 800;

    letter-spacing: 2px;
    text-transform: uppercase;
}

.cursos-hero h1 {
    margin: 0 0 20px;

    font-size:
        clamp(42px, 4vw, 60px);

    line-height: 1.04;

    letter-spacing: -1.8px;
}

.cursos-hero h1 span {
    color: #2b8cff;
}

.cursos-hero__texto {
    max-width: 490px;

    margin: 0;

    color: #dcebf7;

    font-size: 17px;
    line-height: 1.6;
}

/* ==========================================================
   CURSOS
   ========================================================== */

.cursos-conteudo {
    min-width: 0;

    display: flex;
    flex-direction: column;
    justify-content: center;

    padding:
        clamp(46px, 6vh, 76px)
        clamp(32px, 5vw, 82px);

    background:
        radial-gradient(
            circle at 88% 12%,
            rgba(31, 125, 236, .08),
            transparent 25%
        ),
        linear-gradient(
            145deg,
            #fbfcfd,
            #eef4f8
        );
}

.cursos-cabecalho {
    max-width: 670px;

    margin-bottom: 34px;
}

.cursos-cabecalho__eyebrow {
    margin: 0 0 9px;

    color: var(--lmd-blue);

    font-size: 11.5px;
    font-weight: 850;

    letter-spacing: 1.7px;
    text-transform: uppercase;
}

.cursos-cabecalho h2 {
    margin: 0 0 10px;

    color: #102746;

    font-size:
        clamp(34px, 3vw, 45px);

    line-height: 1.08;
}

.cursos-cabecalho > p:last-child {
    margin: 0;

    color: var(--text-muted);

    font-size: 14.5px;
    line-height: 1.55;
}

.cursos-grid {
    width: 100%;

    display: grid;

    grid-template-columns:
        repeat(3, minmax(0, 1fr));

    gap: 20px;
}

.curso-card {
    min-width: 0;

    display: flex;
    flex-direction: column;

    min-height: 315px;

    padding: 26px;

    border:
        1px solid
        rgba(214, 225, 235, .95);

    border-radius:
        var(--radius-card);

    background:
        rgba(255, 255, 255, .985);

    box-shadow:
        var(--shadow);
}

.curso-card--construcao {
    box-shadow:
        0 14px 38px rgba(10, 40, 72, .07);
}

.curso-card__topo {
    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 12px;

    margin-bottom: 25px;
}

.curso-card__nivel {
    color: #667a92;

    font-size: 10.5px;
    font-weight: 800;

    letter-spacing: .7px;

    text-transform: uppercase;
}

.curso-status {
    padding:
        6px
        9px;

    border-radius: 999px;

    font-size: 9.5px;
    font-weight: 800;

    white-space: nowrap;
}

.curso-status--aberto {
    color: var(--success);

    background:
        var(--success-soft);
}

.curso-status--construcao {
    color: var(--construction);

    background:
        var(--construction-soft);
}

.curso-card h3 {
    margin: 0 0 13px;

    color: #173557;

    font-size: 21px;
    line-height: 1.25;
}

.curso-card__descricao {
    margin: 0;

    color: #708096;

    font-size: 13px;
    line-height: 1.6;
}

.curso-card__rodape {
    margin-top: auto;

    padding-top: 26px;
}

.curso-acao {
    min-height: 48px;

    display: flex;
    align-items: center;
    justify-content: center;

    gap: 10px;

    border-radius:
        var(--radius-control);

    color: #ffffff;

    background:
        linear-gradient(
            135deg,
            #135fc6,
            #1678ee
        );

    box-shadow:
        0 10px 24px rgba(20, 103, 207, .22);

    font-size: 13.5px;
    font-weight: 780;

    text-decoration: none;
}

.curso-acao:hover {
    filter: brightness(1.035);
}

.curso-acao:focus-visible {
    outline:
        3px solid
        rgba(20, 111, 224, .27);

    outline-offset: 3px;
}

.curso-indisponivel {
    min-height: 48px;

    display: grid;
    place-items: center;

    border:
        1px solid #e2e7eb;

    border-radius:
        var(--radius-control);

    color: #8793a1;

    background: #f4f6f8;

    font-size: 12.5px;
    font-weight: 760;

    cursor: default;

    user-select: none;
}

.cursos-footer {
    margin:
        32px
        0
        0;

    color: #8996a7;

    text-align: center;

    font-size: 10.5px;

    letter-spacing: .5px;
}

/* ==========================================================
   RESPONSIVIDADE
   ========================================================== */

@media (max-width: 1180px) {
    .cursos-page {
        grid-template-columns: 1fr;
    }

    .cursos-hero {
        min-height: auto;

        padding:
            54px
            0;
    }

    .cursos-logo {
        margin-bottom: 36px;
    }

    .cursos-conteudo {
        padding:
            52px
            28px
            64px;
    }
}

@media (max-width: 850px) {
    .cursos-grid {
        grid-template-columns: 1fr;
    }

    .curso-card {
        min-height: 260px;
    }
}

@media (max-width: 620px) {
    .cursos-hero__conteudo {
        width:
            min(
                calc(100% - 36px),
                540px
            );
    }

    .cursos-logo {
        width:
            min(240px, 72vw);
    }

    .cursos-conteudo {
        padding:
            38px
            16px
            48px;
    }

    .curso-card {
        padding: 22px;
    }
}

@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        transition-duration: .001ms !important;
        animation-duration: .001ms !important;
        animation-iteration-count: 1 !important;
    }
}


/* ==========================================================
   LMD — HEADER PÚBLICO DE MATRÍCULAS
   ========================================================== */

.lmd-cursos-topo {
    position: relative;
    z-index: 20;

    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;

    width: 100%;
    padding: 18px clamp(22px, 5vw, 72px);

    box-sizing: border-box;

    background: rgba(5, 22, 38, .96);
    border-bottom: 1px solid rgba(110, 160, 200, .16);
}

.lmd-cursos-topo__marca {
    color: #ffffff;
    font-size: 15px;
    font-weight: 800;
    letter-spacing: .09em;
}

.lmd-cursos-topo__nav {
    display: flex;
    align-items: center;
    gap: 10px;
}

.lmd-cursos-topo__link {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    min-height: 40px;
    padding: 0 17px;

    border-radius: 9px;

    color: #c9d8e6;
    text-decoration: none;

    font-size: 14px;
    font-weight: 700;
}

.lmd-cursos-topo__link:hover {
    color: #ffffff;
    background: rgba(255, 255, 255, .06);
}

.lmd-cursos-topo__matricula {
    color: #ffffff;

    background: rgba(0, 119, 255, .16);
    border: 1px solid rgba(74, 163, 255, .52);
}

.lmd-cursos-topo__matricula:hover {
    background: rgba(0, 119, 255, .26);
    border-color: rgba(74, 163, 255, .80);
}

.lmd-cursos-topo__link:focus-visible {
    outline: 3px solid rgba(72, 161, 255, .35);
    outline-offset: 4px;
}

@media (max-width: 640px) {
    .lmd-cursos-topo {
        flex-direction: column;
        align-items: stretch;
        gap: 12px;
    }

    .lmd-cursos-topo__nav {
        width: 100%;
    }

    .lmd-cursos-topo__link {
        flex: 1;
    }
}

/* LMD_CURSOS_EFEITO_CARDS: faixa colorida no alto e destaque ao passar o mouse (padrao LMD) */
.curso-card{position:relative;border-top:4px solid #19B36B;transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease}
.curso-card:hover{transform:translateY(-5px);border-color:#19B36B;box-shadow:0 0 0 1px #19B36B,0 18px 36px -14px rgba(25,179,107,.45)}
.curso-card--construcao{border-top-color:#8FA6C2}
.curso-card--construcao:hover{border-color:#5B8DEF;box-shadow:0 0 0 1px #5B8DEF,0 18px 36px -14px rgba(13,97,200,.35)}
.curso-promocao-selo{z-index:5}
@media(prefers-reduced-motion:reduce){.curso-card,.curso-card:hover{transition:none;transform:none}}
/* FIM_LMD_CURSOS_EFEITO_CARDS */

/* LMD_CURSOS_COLUNA_ESTREITA */
@media (min-width:1181px){
  .cursos-page{grid-template-columns:340px minmax(0,1fr)}
  .cursos-hero__conteudo{width:calc(100% - 64px)}
}
.cursos-logo{width:200px;margin-bottom:44px}
.cursos-eyebrow::before{content:"";display:block;width:30px;height:3px;border-radius:2px;background:#64ABDB;box-shadow:0 0 8px rgba(100,171,219,.6);margin:0 0 16px}
.cursos-hero h1{font-size:46px;line-height:1.05;letter-spacing:-1.2px}
.cursos-hero h1 span{display:block}
.cursos-hero__texto{font-size:15.5px;line-height:1.55}
.cursos-hero::before{opacity:1;background-image:radial-gradient(rgba(100,171,219,.45) 1.2px,transparent 1.8px);background-size:14px 14px;-webkit-mask-image:radial-gradient(circle at 8% 94%,#000 0,transparent 26%);mask-image:radial-gradient(circle at 8% 94%,#000 0,transparent 26%)}
.cursos-hero::after{right:-260px;bottom:-300px;width:520px;height:520px;border:1.5px solid rgba(100,171,219,.55);box-shadow:0 0 22px rgba(78,134,188,.45),inset 0 0 22px rgba(78,134,188,.25),0 0 0 70px rgba(52,97,141,.06),0 0 0 140px rgba(52,97,141,.04)}
@media (max-width:620px){.cursos-logo{width:min(200px,60vw)}.cursos-hero h1{font-size:40px}}
/* FIM_LMD_CURSOS_COLUNA_ESTREITA */

/* LMD_CURSOS_SELO_CHAVE */
.curso-status--construcao{display:inline-flex;align-items:center;gap:5px}
.curso-status--construcao::before{content:"";flex:0 0 12px;width:12px;height:12px;background:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 10h3v-3l-3.5 -3.5a6 6 0 0 1 8 8l6 6a2 2 0 0 1 -3 3l-6 -6a6 6 0 0 1 -8 -8l3.5 3.5'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 10h3v-3l-3.5 -3.5a6 6 0 0 1 8 8l6 6a2 2 0 0 1 -3 3l-6 -6a6 6 0 0 1 -8 -8l3.5 3.5'/%3E%3C/svg%3E") center/contain no-repeat}
/* FIM_LMD_CURSOS_SELO_CHAVE */

/* LMD_CURSOS_ILUSTRACAO */
.curso-card--construcao .curso-card__descricao::after{content:"";display:block;width:118px;height:118px;margin:22px auto 0;background:center/contain no-repeat}
.curso-card--construcao:nth-child(2) .curso-card__descricao::after{background-image:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 100 100%22%3E%3Cpath d=%22M50 8c22 0 42 12 44 36s-14 46-40 48S6 80 6 54 28 8 50 8z%22 fill=%22%23E3EEFA%22/%3E%3Crect x=%2222%22 y=%2228%22 width=%2250%22 height=%2238%22 rx=%226%22 fill=%22%23F7FAFE%22 stroke=%22%234E86BC%22 stroke-width=%222.4%22/%3E%3Cpath d=%22M31 40l7 6-7 6M42 54h10%22 stroke=%22%234E86BC%22 stroke-width=%222.4%22 fill=%22none%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22/%3E%3Cg transform=%22translate(70 66)%22%3E%3Ccircle r=%2213%22 fill=%22%23F4F8FD%22/%3E%3Cpath d=%22M0-11v-3M0 11v3M-11 0h-3M11 0h3M-7.8-7.8l-2.1-2.1M7.8 7.8l2.1 2.1M-7.8 7.8l-2.1 2.1M7.8-7.8l2.1-2.1%22 stroke=%22%234E86BC%22 stroke-width=%222.6%22 stroke-linecap=%22round%22/%3E%3Ccircle r=%228%22 fill=%22none%22 stroke=%22%234E86BC%22 stroke-width=%222.4%22/%3E%3Ccircle r=%223%22 fill=%22none%22 stroke=%22%234E86BC%22 stroke-width=%222.2%22/%3E%3C/g%3E%3C/svg%3E")}
.curso-card--construcao:nth-child(3) .curso-card__descricao::after{background-image:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 100 100%22%3E%3Cpath d=%22M50 8c22 0 42 12 44 36s-14 46-40 48S6 80 6 54 28 8 50 8z%22 fill=%22%23E3EEFA%22/%3E%3Cg fill=%22%23F7FAFE%22 stroke=%22%234E86BC%22 stroke-width=%222.4%22%3E%3Crect x=%2224%22 y=%2224%22 width=%2246%22 height=%2214%22 rx=%224%22/%3E%3Crect x=%2224%22 y=%2241%22 width=%2246%22 height=%2214%22 rx=%224%22/%3E%3Crect x=%2224%22 y=%2258%22 width=%2246%22 height=%2214%22 rx=%224%22/%3E%3C/g%3E%3Cg fill=%22%234E86BC%22%3E%3Ccircle cx=%2231%22 cy=%2231%22 r=%221.8%22/%3E%3Ccircle cx=%2231%22 cy=%2248%22 r=%221.8%22/%3E%3Ccircle cx=%2231%22 cy=%2265%22 r=%221.8%22/%3E%3C/g%3E%3Cpath d=%22M38 31h14M38 48h14M38 65h8%22 stroke=%22%234E86BC%22 stroke-width=%222.2%22 stroke-linecap=%22round%22/%3E%3Cg transform=%22translate(70 66)%22%3E%3Ccircle r=%2213%22 fill=%22%23F4F8FD%22/%3E%3Cpath d=%22M0-11v-3M0 11v3M-11 0h-3M11 0h3M-7.8-7.8l-2.1-2.1M7.8 7.8l2.1 2.1M-7.8 7.8l-2.1 2.1M7.8-7.8l2.1-2.1%22 stroke=%22%234E86BC%22 stroke-width=%222.6%22 stroke-linecap=%22round%22/%3E%3Ccircle r=%228%22 fill=%22none%22 stroke=%22%234E86BC%22 stroke-width=%222.4%22/%3E%3Ccircle r=%223%22 fill=%22none%22 stroke=%22%234E86BC%22 stroke-width=%222.2%22/%3E%3C/g%3E%3C/svg%3E")}
/* FIM_LMD_CURSOS_ILUSTRACAO */

/* LMD_CURSOS_ILUSTRACAO_BASE */
.curso-card--disponivel .curso-card__rodape::before{content:"";display:block;width:64px;height:64px;margin:0 auto 10px;background:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 100 100%22%3E%3Cpath d=%22M50 8c22 0 42 12 44 36s-14 46-40 48S6 80 6 54 28 8 50 8z%22 fill=%22%23E3EEFA%22/%3E%3Cg fill=%22%23F7FAFE%22 stroke=%22%234E86BC%22 stroke-width=%222.4%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Crect x=%2220%22 y=%2258%22 width=%2222%22 height=%2213%22 rx=%222.5%22/%3E%3Crect x=%2244%22 y=%2258%22 width=%2222%22 height=%2213%22 rx=%222.5%22/%3E%3Crect x=%2232%22 y=%2243%22 width=%2222%22 height=%2213%22 rx=%222.5%22/%3E%3C/g%3E%3Crect x=%2256%22 y=%2243%22 width=%2222%22 height=%2213%22 rx=%222.5%22 fill=%22none%22 stroke=%22%234E86BC%22 stroke-width=%222.4%22 stroke-dasharray=%224 3%22/%3E%3Cpath d=%22M68 28v9M64 33l4 4 4-4%22 fill=%22none%22 stroke=%22%234E86BC%22 stroke-width=%222.4%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22/%3E%3C/svg%3E") center/contain no-repeat}
/* FIM_LMD_CURSOS_ILUSTRACAO_BASE */
