/* Tema configurado na Gestão. Carregado após a identidade estrutural de cada modelo. */
.smart-site .smart-button:not(.smart-button--outline) {
    background: var(--site-accent);
    color: var(--site-on-accent);
}

.smart-site .smart-auto-card--link,
.smart-site .smart-internal-card--link,
.smart-site .impact-message,
.smart-site .celebration-message {
    display: block;
    cursor: pointer;
    transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}

.smart-site .smart-auto-card--link:hover,
.smart-site .smart-internal-card--link:hover,
.smart-site .impact-message:hover,
.smart-site .celebration-message:hover {
    transform: translateY(-4px);
    border-color: var(--site-accent);
    box-shadow: 0 18px 42px color-mix(in srgb, var(--site-primary) 18%, transparent);
}

.smart-site .smart-internal-header {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    background: var(--site-primary);
    color: var(--site-on-primary);
}

.smart-site .smart-internal-header__image {
    position: absolute;
    inset: 0;
    z-index: -2;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.smart-site .smart-internal-header--image::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    background: linear-gradient(90deg, color-mix(in srgb, var(--site-primary) 76%, #000), color-mix(in srgb, var(--site-secondary) 54%, transparent));
}

.smart-site .smart-internal-header--image {
    color: #fff;
}

.smart-site .smart-internal-header--image .smart-internal-back,
.smart-site .smart-internal-header--image .smart-internal-hero p {
    color: rgba(255, 255, 255, .8);
}

.smart-site .smart-internal-header .smart-eyebrow,
.smart-site .smart-internal-nav__links a:hover,
.smart-site .smart-internal-nav__links a[aria-current="page"] {
    color: var(--site-accent);
}

.smart-site .smart-internal-back,
.smart-site .smart-internal-hero p {
    color: color-mix(in srgb, var(--site-on-primary) 76%, transparent);
}

.smart-site .smart-site-footer {
    background: var(--site-secondary);
    color: color-mix(in srgb, var(--site-on-secondary) 78%, transparent);
}

.smart-site .smart-site-footer__brand,
.smart-site .smart-site-footer__title,
.smart-site .smart-site-footer strong,
.smart-site .smart-site-footer__links a:hover {
    color: var(--site-on-secondary);
}

.smart-site .smart-site-footer__about p,
.smart-site .smart-site-footer__bottom {
    color: color-mix(in srgb, var(--site-on-secondary) 70%, transparent);
}

/* Impacto mantém a composição dramática, usando a paleta escolhida pela igreja. */
.smart-site--impacto .impact-hero {
    background: var(--site-primary);
    color: #fff;
}

.smart-site--impacto .impact-hero::after {
    background: linear-gradient(90deg, color-mix(in srgb, var(--site-primary) 68%, #000) 0%, color-mix(in srgb, var(--site-primary) 54%, #000) 48%, color-mix(in srgb, var(--site-secondary) 30%, transparent) 100%);
}

.smart-site--impacto .impact-signal__item:first-child {
    background: var(--site-primary);
    color: var(--site-on-primary);
}

.smart-site--impacto .impact-media,
.smart-site--impacto .smart-live--impacto {
    background: var(--site-secondary);
    color: var(--site-on-secondary);
}

.smart-site--impacto .impact-message {
    background: color-mix(in srgb, var(--site-secondary) 84%, var(--site-primary));
    color: var(--site-on-secondary);
}

.smart-site--impacto .impact-cta {
    background: var(--site-accent);
    color: var(--site-on-accent);
}

.smart-site--impacto .impact-cta .smart-button {
    background: var(--site-primary);
    color: var(--site-on-primary);
}

/* Institucional Premium preserva o visual editorial com matizes da marca. */
.smart-site--institucional-premium .institutional-topline,
.smart-site--institucional-premium .institutional-leadership {
    background: var(--site-primary);
    color: var(--site-on-primary);
}

.smart-site--institucional-premium .institutional-hero,
.smart-site--institucional-premium .institutional-values,
.smart-site--institucional-premium .smart-live--institucional-premium {
    background: color-mix(in srgb, var(--site-primary) 9%, #fff);
}

.smart-site--institucional-premium .institutional-footer {
    background: var(--site-secondary);
    color: var(--site-on-secondary);
}

.smart-site--institucional-premium .smart-live--institucional-premium {
    background: var(--site-secondary);
    color: var(--site-on-secondary);
}

.smart-site--institucional-premium .smart-live--institucional-premium .smart-live__copy p {
    color: color-mix(in srgb, var(--site-on-secondary) 72%, transparent);
}

/* Comunidade conserva formas acolhedoras e passa a usar as cores configuradas. */
.smart-site--comunidade .community-hero__panel {
    background: var(--site-primary);
    color: #fff;
}

.smart-site--comunidade .community-hero__panel::after {
    background: linear-gradient(180deg, color-mix(in srgb, var(--site-primary) 25%, transparent), color-mix(in srgb, var(--site-primary) 68%, #000));
}

.smart-site--comunidade .community-welcome__card:first-child {
    background: var(--site-accent);
    color: var(--site-on-accent);
}

.smart-site--comunidade .community-ministries {
    background: var(--site-secondary);
    color: var(--site-on-secondary);
}

.smart-site--comunidade .community-contact,
.smart-site--comunidade .smart-live--comunidade {
    background: color-mix(in srgb, var(--site-accent) 20%, #fff);
}

.smart-site--comunidade .community-footer {
    background: var(--site-secondary);
    color: var(--site-on-secondary);
}

/* Celebração mantém a linguagem de mídia, sem impor a antiga paleta roxa. */
.smart-site--celebracao .celebration-page {
    background: color-mix(in srgb, var(--site-secondary) 82%, #000);
    color: #fff;
}

.smart-site--celebracao .celebration-hero::before {
    background: linear-gradient(135deg, color-mix(in srgb, var(--site-primary) 72%, #000), color-mix(in srgb, var(--site-secondary) 68%, transparent), rgba(0, 0, 0, .78));
}

.smart-site--celebracao .celebration-message,
.smart-site--celebracao .smart-auto-section {
    background: color-mix(in srgb, var(--site-secondary) 72%, #000);
}

.smart-site--celebracao .celebration-page .smart-button:not(.smart-button--outline) {
    background: var(--site-accent);
    color: var(--site-on-accent);
}

.smart-site--celebracao .smart-live--celebracao .smart-live__grid {
    border-color: color-mix(in srgb, var(--site-accent) 35%, transparent);
    background: color-mix(in srgb, var(--site-secondary) 68%, #000);
}

.smart-site--celebracao .celebration-message span,
.smart-site--celebracao .celebration-event time,
.smart-site--celebracao .celebration-page .smart-eyebrow,
.smart-site--celebracao .smart-auto-card > span {
    color: var(--site-accent);
}

.smart-site--celebracao .celebration-series {
    background: linear-gradient(120deg, var(--site-primary), var(--site-secondary));
    color: var(--site-on-primary);
}

.smart-site--celebracao .celebration-visit {
    background: linear-gradient(180deg, color-mix(in srgb, var(--site-secondary) 75%, #000), color-mix(in srgb, var(--site-primary) 72%, #000));
}

/* Essencial continua leve; a paleta aparece em superfícies e chamadas principais. */
.smart-site--essencial .essential-hero,
.smart-site--essencial .essential-contact,
.smart-site--essencial .smart-live--essencial {
    background: color-mix(in srgb, var(--site-primary) 8%, #fff);
}

.smart-site--essencial .essential-facts {
    border-color: color-mix(in srgb, var(--site-primary) 28%, #fff);
}

.smart-site--essencial .essential-action {
    border-top: 4px solid var(--site-accent);
}

/* Os modelos adicionais também recebem integralmente a paleta da igreja. */
.smart-site--acolhimento .smart-live--acolhimento {
    background: color-mix(in srgb, var(--site-primary) 7%, #fff);
}

.smart-site--acolhimento .welcome-schedule {
    background: color-mix(in srgb, var(--site-secondary) 7%, #fff);
}

.smart-site--conexao .connection-schedule {
    background: color-mix(in srgb, var(--site-accent) 7%, #fff);
}

.smart-site--conexao .connection-live {
    background: color-mix(in srgb, var(--site-primary) 3%, #fff);
}

.smart-site--horizonte .smart-live--horizonte,
.smart-site--horizonte .horizon-values,
.smart-site--horizonte .horizon-schedule {
    background: color-mix(in srgb, var(--site-primary) 6%, #fff);
}

/* Página completa de vídeos, mensagens, devocionais e notícias. */
.smart-detail-main {
    min-height: 430px;
    padding: 72px 0 105px;
    background: color-mix(in srgb, var(--site-primary) 4%, #fff);
}

.smart-detail-hero {
    max-width: 980px;
    margin-inline: auto;
}

.smart-detail-article {
    max-width: 980px;
}

.smart-detail-video,
.smart-detail-image {
    margin: 0 0 42px;
    overflow: hidden;
    border-radius: 18px;
    background: #05060a;
    box-shadow: 0 22px 60px color-mix(in srgb, var(--site-primary) 22%, transparent);
}

.smart-detail-video iframe {
    width: 100%;
    aspect-ratio: 16 / 9;
    display: block;
    border: 0;
}

.smart-detail-image img {
    width: 100%;
    max-height: 620px;
    object-fit: cover;
}

.smart-detail-body {
    max-width: 780px;
    margin-inline: auto;
    color: #344054;
    font-size: 18px;
    line-height: 1.85;
}

.smart-detail-body p {
    margin: 0;
}

.smart-detail-audio {
    max-width: 780px;
    margin: 0 auto 34px;
    padding: 20px;
    display: grid;
    gap: 13px;
    border-left: 4px solid var(--site-accent);
    border-radius: 10px;
    background: #fff;
}

.smart-detail-audio audio {
    width: 100%;
}

.smart-detail-download {
    width: max-content;
    margin: 38px auto 0;
    display: flex;
}

@media (max-width: 680px) {
    .smart-detail-main { padding: 42px 0 72px; }
    .smart-detail-video, .smart-detail-image { margin-bottom: 28px; border-radius: 11px; }
    .smart-detail-body { font-size: 16px; }
    .smart-detail-download { width: 100%; }
}
