﻿/* ============================================================
   CANTONEIRA – Padrão PUC-Rio
   ============================================================ */

/* ============================
   Paleta cromática institucional
   ============================ */
:root {
    /* Cores principais */
    --puc-azul: #4646ff;
    --puc-amarelo: #ffb52f;
    --puc-branco-areia: #f5f5f0;
    --puc-azul-profundo: #0000a9;
    --puc-amarelo-escuro: #e08c07;
    --puc-areia-escuro: #9b9583;
    --puc-azul-marinho: #030053;
    --puc-laranja: #bf6000;
    --puc-preto: #000000;
    /* Cores auxiliares */
    --puc-aux-roxo: #c11aff;
    --puc-aux-vermelho: #ff0031;
    --puc-aux-ciano: #00e7f2;
    --puc-aux-verde: #6ae700;
    --puc-aux-roxo-escuro: #7817b1;
    --puc-aux-vinho: #be002d;
    --puc-aux-petroleo: #00a2ac;
    --puc-aux-verde-escuro: #00a800;
    --puc-aux-roxo-profundo: #3a0062;
    --puc-aux-vinho-profundo: #7c0024;
    --puc-aux-petroleo-escuro: #005c66;
    --puc-aux-verde-muito-escuro: #003900;
}

/* Tipografia sugerida no branding */
body {
    font-family: "Rethink Sans", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

/* ============================
   Estrutura geral da cantoneira
   ============================ */
.card-puc {
    display: grid;
    grid-template-columns: 72px 1fr;
    grid-template-rows: 72px minmax(220px, 1fr);
    max-width: 1200px;
    border: none;
    border-radius: 0;
    overflow: hidden;
    position: relative;
    height: 380px; /* altura atual */
}

/* ============================
   Bloco do brasão (linha 1, coluna 1)
   ============================ */
.card-puc-coat-box {
    grid-row: 1;
    grid-column: 1;
    background-color: var(--puc-main-color);
    display: flex;
    align-items: center;
    justify-content: center;
}

.card-puc-coat {
    width: 52px;
    height: 52px;
}

.card-puc-coat img {
    width: 100%;
    height: auto;
    display: block;
}

/* ============================
   Faixa superior (RIO) – linha 1, coluna 2
   ============================ */
.card-puc-top {
    grid-row: 1;
    grid-column: 2;
    background-color: var(--puc-top-color);
    display: flex;
    align-items: center;
    padding: 0 24px;
}

.card-puc-top-text {
    font-size: 48px;
    font-weight: 700;
    color: #ffffff;
    letter-spacing: 4px;
}

/* ============================
   Bloco PUC (linha 2, coluna 1)
   ============================ */
.card-puc-wordmark-box {
    grid-row: 2;
    grid-column: 1;
    background-color: var(--puc-branco-areia);
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding-top: 4px;
}

.card-puc-wordmark {
    writing-mode: vertical-rl;
    transform: rotate(180deg);
    font-weight: 700;
    font-size: 48px;
    letter-spacing: 2px;
    color: var(--puc-preto);
}

/* ============================
   Área principal do card (linha 2, coluna 2)
   ============================ */
.card-puc-main {
    grid-row: 2;
    grid-column: 2;
    background-color: var(--puc-main-color);
    padding: 14px 32px 20px 18px;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    font-family: "Literata", "Times New Roman", serif;
}

/* Força texto branco por padrão em QUALQUER área */
.card-puc .card-puc-main,
.card-puc .card-puc-main p,
.card-puc .card-puc-main .card-puc-title {
    color: #ffffff;
}

/* Conteúdo principal do card */
.card-puc-content {
    max-width: 100%;
    flex: 1;
    display: flex;
    flex-direction: column;
}

/* “Evento” (rótulo da linha acima do título) */
.card-puc-meta-evento {
    font-size: 22px;
    margin: 0 0 8px;
}

/* Título (nome da atividade – já truncado) */
.card-puc-title {
    font-size: 22px;
    line-height: 1.35;
    font-weight: 600;
    margin: 0 0 10px;
    text-align: justify;
}

/* Palestrante (já truncado) e link */
.card-puc-speaker {
    font-size: 15px;
    margin: 0 0 6px;
}

.card-puc-link {
    font-size: 12px;
    margin: 0;
    margin-top: auto; /* fixa no fundo da área de conteúdo */
    padding-top: 8px;
    text-decoration: none;
    color: rgba(245, 245, 240, 0.8);
}

    .card-puc-link:hover {
        color: rgba(245, 245, 240, 1);
        font-weight: bold;
    }

.card-puc-amarelo .card-puc-link,
.card-puc-areia .card-puc-link {
    color: rgba(0, 0, 0, 0.8);
}

    .card-puc-amarelo .card-puc-link:hover,
    .card-puc-areia .card-puc-link:hover {
        color: rgba(0, 0, 0, 1);
    }

/* ============================================================
   TEMAS DE CANTONEIRA (apenas ajustando variáveis)
   ============================================================ */
/* CTC – azul petróleo */
.card-puc-ctc {
    --puc-top-color: #005563;
    --puc-main-color: #0097a7;
}

/* CTCH – verde */
.card-puc-ctch {
    --puc-top-color: #004000;
    --puc-main-color: #00a32e;
}

/* Institucional – Azul */
.card-puc-azul {
    --puc-top-color: var(--puc-azul-profundo);
    --puc-main-color: var(--puc-azul);
}

/* Institucional – Amarelo – texto preto */
.card-puc-amarelo {
    --puc-top-color: var(--puc-laranja);
    --puc-main-color: var(--puc-amarelo);
}

/* força texto preto apenas para amarelo (mais específico que o padrão branco) */
.card-puc-amarelo .card-puc-main,
.card-puc-amarelo .card-puc-main p,
.card-puc-amarelo .card-puc-main .card-puc-title {
    color: var(--puc-preto);
}

/* Institucional – Areia – texto preto */
.card-puc-areia {
    --puc-top-color: var(--puc-areia-escuro);
    --puc-main-color: var(--puc-branco-areia);
}

.card-puc-areia .card-puc-main,
.card-puc-areia .card-puc-main p,
.card-puc-areia .card-puc-main .card-puc-title {
    color: var(--puc-preto);
}

/* Temático – Roxo */
.card-puc-roxo {
    --puc-top-color: var(--puc-aux-roxo-profundo);
    --puc-main-color: var(--puc-aux-roxo);
}

/* Temático – Vermelho / Vinho */
.card-puc-vermelho {
    --puc-top-color: var(--puc-aux-vinho-profundo);
    --puc-main-color: var(--puc-aux-vermelho);
}

/* Temático – Tecnologia (ciano / petróleo escuro) */
.card-puc-tecnologia {
    --puc-top-color: var(--puc-aux-petroleo-escuro);
    --puc-main-color: var(--puc-aux-ciano);
}

/* Temático – Verde */
.card-puc-verde {
    --puc-top-color: var(--puc-aux-verde-muito-escuro);
    --puc-main-color: var(--puc-aux-verde);
}