/* ============================================================
   MEDIA KIT — kit de imprensa
   Gplay — site da banda
   ============================================================
   Painel "noite". Terceira aparição do motivo "crachá de papel"
   (depois do CTA do menu e dos cards de Integrantes) — aqui como o
   próprio kit: um cartão flutuando no preto, furo de cordão, listado
   como manifesto de prancheta. CTA único e sólido ao lado.
   ============================================================ */

.media-kit {
    padding: clamp(56px, 8vw, 96px) 0;
}

.media-kit__container {
    max-width: var(--gp-container);
    margin: 0 auto;
    padding: 0 clamp(20px, 4vw, 56px);
}

/* título "Kit de Imprensa" — estilo compartilhado em css/geral.css */

.media-kit__corpo {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: clamp(32px, 5vw, 64px);
    align-items: center;
    margin-top: clamp(32px, 5vw, 48px);
}

/* ---------------------------------------------------------- CRACHÁ */
.media-kit__cracha {
    background: var(--gp-papel);
    color: #241f18;
    border-radius: 3px;
    padding: 32px 30px;
    position: relative;
    max-width: 380px;
    transform: rotate(-1.4deg);
    box-shadow: 0 18px 40px rgba(0, 0, 0, 0.4);
}

.media-kit__cracha::before {
    content: '';
    position: absolute;
    top: -10px;
    left: 50%;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: var(--gp-tinta);
    border: 1px solid rgba(36, 31, 24, 0.25);
    transform: translateX(-50%);
}

.media-kit__cracha-titulo {
    display: block;
    font-family: var(--font-titulo);
    font-weight: 700;
    font-size: 24px;
    text-transform: uppercase;
    border-bottom: 1px dashed rgba(36, 31, 24, 0.25);
    padding-bottom: 14px;
    margin-bottom: 16px;
}

.media-kit__lista {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.media-kit__lista li {
    font-family: var(--font-dado);
    font-size: var(--gp-fs-legenda);
    letter-spacing: 0.02em;
    display: flex;
    align-items: baseline;
    gap: 8px;
}

.media-kit__lista li::before {
    content: '—';
    color: var(--gp-vermelho);
}

/* ---------------------------------------------------------- CTA */
.media-kit__cta p {
    font-size: var(--gp-fs-texto);
    line-height: 1.6;
    color: rgba(237, 231, 217, 0.75);
    max-width: 44ch;
    margin: 0 0 22px;
}

/* botão "Baixar Press Kit" usa a classe compartilhada .btn-solido
   (ver css/geral.css) — nada específico pra declarar aqui. */

/* ============================================================ RESPONSIVO */
@media (max-width: 820px) {
    .media-kit__corpo {
        grid-template-columns: 1fr;
    }

    .media-kit__cracha {
        max-width: 100%;
    }
}