/* ==========================================================================
Portal Brazuca — ajustes do CMS
Este arquivo complementa o tema. Edite-o para personalizar sem
mexer no CSS principal (assets/css/site.css).
========================================================================== */
/* Linhas criadas no construtor de paginas */
.pb-section { position: relative; }
.pb-row { align-items: start; }
@media (max-width: 900px) {
.pb-row { grid-template-columns: 1fr !important; }
.pb-hide-mobile { display: none !important; }
}
@media (min-width: 901px) {
.pb-hide-desktop { display: none !important; }
}
/* Links dentro de titulos herdam a cor do tema */
.news-card h3 a,
.latest h3 a,
.most-read h3 a,
.culture-link h3 a,
.category-card-copy h3 a,
.feature-copy h3 a,
.community-side h3 a,
.business-feature h3 a,
.job-list h3 a,
.event-list h3 a,
.events-list-copy h3 a,
.job-result-copy h3 a,
.related-grid h3 a,
.sidebar-most a {
color: inherit;
text-decoration: none;
}
.news-card h3 a:hover,
.latest h3 a:hover,
.most-read h3 a:hover,
.category-card-copy h3 a:hover,
.job-result-copy h3 a:hover,
.events-list-copy h3 a:hover {
text-decoration: underline;
}
/* Icones sociais do topo */
.socials a { margin-inline: 4px; text-decoration: none; }
/* Formularios de newsletter no rodape e barra lateral */
footer .newsletter { display: flex; gap: 8px; }
.sidebar-newsletter form { display: flex; flex-direction: column; gap: 8px; }
/* Diretorio de empresas */
.directory-search { display: flex; gap: 10px; margin: 18px 0; }
.directory-search input {
flex: 1; padding: 12px 14px; border: 1px solid #dbe2ea; border-radius: 8px; font-size: 14px;
}
.directory-search button {
padding: 12px 20px; border-radius: 8px; background: #0b2545; color: #fff;
font-weight: 700; font-size: 13px; cursor: pointer; border: 0;
}
.directory-category-row { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 22px; }
.directory-category-row a {
padding: 7px 14px; border: 1px solid #dbe2ea; border-radius: 999px;
font-size: 12px; font-weight: 600; color: #4a5568; text-decoration: none;
}
.directory-category-row a.active { background: #0b2545; color: #fff; border-color: #0b2545; }
.directory-grid {
display: grid; gap: 20px;
grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
}
.directory-card-item {
border: 1px solid #e6ebf1; border-radius: 12px; overflow: hidden; background: #fff;
display: flex; flex-direction: column;
}
.directory-photo { min-height: 150px; background: #eef2f7; }
.directory-card-content { padding: 18px; flex: 1; }
.directory-card-content b { font-size: 11px; letter-spacing: .06em; color: #7c8798; display: block; margin: 10px 0 6px; }
.directory-card-content h3 { font-size: 17px; font-weight: 700; line-height: 1.3; margin-bottom: 8px; }
.directory-card-content p { font-size: 13px; color: #5a6577; line-height: 1.55; }
.directory-card-footer {
display: flex; justify-content: space-between; gap: 10px;
padding: 14px 18px; border-top: 1px solid #eef2f7; font-size: 13px; font-weight: 600;
}
/* Quadro de vagas */
.jobs-board { display: grid; gap: 34px; grid-template-columns: minmax(0, 1fr) 320px; align-items: start; margin: 34px auto; }
.jobs-search { display: grid; gap: 10px; grid-template-columns: 2fr 1fr 1fr auto; margin-bottom: 22px; }
.jobs-search input, .jobs-search select {
padding: 12px 14px; border: 1px solid #dbe2ea; border-radius: 8px; font-size: 14px; background: #fff;
}
.jobs-search button { padding: 12px 20px; border: 0; border-radius: 8px; background: #0b2545; color: #fff; font-weight: 700; cursor: pointer; }
.jobs-list-heading, .agenda-heading {
display: flex; justify-content: space-between; align-items: baseline;
padding-bottom: 12px; border-bottom: 2px solid #0b2545; margin-bottom: 18px;
}
.jobs-list-heading h2, .agenda-heading h2 { font-size: 22px; font-weight: 800; }
.jobs-list-heading span, .agenda-heading span { font-size: 12px; color: #7c8798; }
.jobs-results { display: flex; flex-direction: column; gap: 14px; }
.job-result {
display: grid; grid-template-columns: 54px minmax(0,1fr) auto; gap: 16px;
padding: 18px; border: 1px solid #e6ebf1; border-radius: 12px; background: #fff; align-items: center;
}
.job-result.is-featured { border-color: #f0c14b; box-shadow: 0 0 0 1px #f0c14b33; }
.job-result-copy h3 { font-size: 17px; font-weight: 700; margin-bottom: 6px; }
.job-company { font-size: 12px; color: #7c8798; font-weight: 600; }
.job-labels { display: flex; flex-wrap: wrap; gap: 6px; margin: 8px 0; }
.job-labels span {
font-size: 11px; padding: 4px 9px; border-radius: 999px;
background: #f1f5f9; color: #4a5568; font-weight: 600;
}
.job-result-copy p { font-size: 13px; color: #5a6577; line-height: 1.5; }
.job-meta { font-size: 12px; color: #94a1b2; margin-top: 6px; }
.job-result-action a { font-size: 13px; font-weight: 700; color: #0b2545; white-space: nowrap; }
/* Agenda de eventos */
.events-agenda { display: grid; gap: 34px; grid-template-columns: minmax(0,1fr) 320px; align-items: start; margin: 34px auto; }
.events-search { display: grid; gap: 10px; grid-template-columns: 2fr 1fr auto; margin-bottom: 22px; }
.events-search input, .events-search select {
padding: 12px 14px; border: 1px solid #dbe2ea; border-radius: 8px; font-size: 14px; background: #fff;
}
.events-search button { padding: 12px 20px; border: 0; border-radius: 8px; background: #0b2545; color: #fff; font-weight: 700; cursor: pointer; }
/* Resultados de busca */
.search-result { padding: 20px 0; border-bottom: 1px solid #eef2f7; }
.search-result-kicker { font-size: 11px; letter-spacing: .06em; color: #7c8798; font-weight: 700; }
.search-result h3 { font-size: 19px; font-weight: 700; margin: 6px 0 8px; line-height: 1.35; }
.search-result p { font-size: 14px; color: #5a6577; line-height: 1.6; }
.search-result-meta { font-size: 12px; color: #94a1b2; margin-top: 8px; }
.search-type-tabs { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 20px; }
.search-type-tabs a {
padding: 8px 16px; border: 1px solid #dbe2ea; border-radius: 999px;
font-size: 13px; font-weight: 600; color: #4a5568; text-decoration: none;
}
.search-type-tabs a.active { background: #0b2545; color: #fff; border-color: #0b2545; }
/* Botao carregar mais */
a.load-more {
display: block; text-align: center; margin: 26px auto 0; padding: 13px 24px;
border: 1px solid #dbe2ea; border-radius: 8px; font-weight: 700; font-size: 13px;
color: #0b2545; max-width: 320px; text-decoration: none;
}
a.load-more:hover { background: #f7fafc; }
@media (max-width: 900px) {
.jobs-board, .events-agenda { grid-template-columns: 1fr; }
.jobs-search, .events-search { grid-template-columns: 1fr; }
}
/* Retorno dos formularios (proposta comercial e newsletter) */
.pb-form-ok,
.pb-form-error {
padding: 12px 16px;
border-radius: 10px;
font-size: 14px;
margin-bottom: 18px;
font-weight: 600;
}
.pb-form-ok { background: #e7f6ec; color: #1c6b3f; border: 1px solid #b9e3c8; }
.pb-form-error { background: #fdeaea; color: #9e2b2b; border: 1px solid #f3c2c2; }
/* ==========================================================================
Filtros que viraram links reais (antes eram botoes sem funcao)
========================================================================== */
.sports-filter a{border:1px solid var(--line);color:#596579;background:#fff;border-radius:18px;padding:8px 14px;font-size:8px;font-weight:800}
.sports-filter a.active{border-color:var(--blue);background:var(--blue);color:#fff}
.sports-filter a{white-space:nowrap}
.events-category-grid a{color:#fff;text-align:left;background:var(--category-color,#ffffff08);border:1px solid #fff2;grid-template-columns:48px 1fr auto;align-items:center;gap:13px;min-height:112px;padding:18px;transition:background-color .2s,transform .2s,box-shadow .2s;display:grid}
.events-category-grid a.music{--category-color:#8f356f;--category-hover:#a54182}
.events-category-grid a.sport{--category-color:#397d3c;--category-hover:#499248}
.events-category-grid a.community{--category-color:#177ead;--category-hover:#2094c5}
.events-category-grid a.business{--category-color:#bd711b;--category-hover:#d28625}
.events-category-grid a:hover{background:var(--category-hover,var(--category-color,#ffffff12));transform:translateY(-2px);box-shadow:0 7px 18px #00000020}
.events-category-grid a:focus-visible{outline-offset:3px;background:var(--category-hover,var(--category-color,#ffffff12));outline:3px solid #fff}
.events-category-grid a>b{color:#fff;background:#b28124;border-radius:50%;place-items:center;width:44px;height:44px;font:900 18px Georgia,serif;display:grid}
.events-category-grid a.sport>b{background:#45813b}
.events-category-grid a.community>b{background:#147bac}
.events-category-grid a.business>b{background:#b5423c}
.events-category-grid a{color:#fff;text-align:left;border:0;grid-template-columns:50px 1fr auto;align-items:center;gap:12px;min-height:135px;padding:20px;display:grid;position:relative;overflow:hidden}
.events-category-grid a:after{content:"";border:24px solid #ffffff10;border-radius:50%;width:125px;height:125px;position:absolute;top:-60px;right:-55px}
.events-category-grid a>b{text-align:center;font:900 31px Georgia,serif}
.events-category-grid a span{z-index:2;position:relative}
.events-category-grid a small{display:block}
.events-category-grid a strong{font:700 15px Georgia,serif}
.events-category-grid a small{color:#ffffffbd;margin-top:7px;font-size:7px}
.events-category-grid a em{z-index:2;font-size:18px;font-style:normal;position:relative}
.events-category-grid a{min-height:105px}
.sports-filter a, .events-category-grid a { text-decoration: none; cursor: pointer; }
/* Aviso exibido quando um bloco ainda nao tem conteudo cadastrado */
.pb-empty-note {
border: 1px dashed #cbd5e1;
border-radius: 12px;
padding: 20px;
color: #64748b;
font-size: 14px;
background: #f8fafc;
margin: 8px 0;
}
.pb-empty-note b { color: #334155; }
/* Busca: abas e filtros viraram links/forms reais */
.search-type-tabs a{color:#657287;background:0 0;border:0;border-bottom:3px solid #0000;flex:none;padding:16px 18px 13px;font-size:9px;font-weight:900}
.search-type-tabs a.active{color:var(--blue);border-bottom-color:var(--cyan);background:#fff}
.search-type-tabs a{padding-inline:14px}
.search-empty a.btn{color:#fff;background:var(--blue);border:0;padding:10px 13px;font-size:8px;font-weight:900}
.search-empty a.btn+button{color:var(--blue);background:#fff;border:1px solid #bdd0dd}
.search-empty a.btn{width:100%}
.search-type-tabs a { text-decoration: none; display: inline-flex; align-items: center; cursor: pointer; }
.search-clear { cursor: pointer; text-decoration: none; display: inline-flex; align-items: center; }
.search-results-heading { display: flex; justify-content: space-between; align-items: flex-end;
gap: 16px; flex-wrap: wrap; margin-bottom: 20px; }
.search-results-heading span { color: var(--red); letter-spacing: .11em; font-size: 8px; font-weight: 900; }
.search-results-heading h2 { color: var(--navy); margin: 4px 0 0; font: 700 22px Georgia, serif; }
.search-results-heading small { color: #8994a4; font-size: 11px; }
.search-results-list { display: flex; flex-direction: column; gap: 18px; }
.search-results-list article { display: grid; grid-template-columns: 132px minmax(0,1fr);
gap: 18px; border: 1px solid var(--line); border-radius: 12px; background: #fff;
padding: 16px; transition: box-shadow .2s, border-color .2s; }
.search-results-list article:hover { border-color: #bdd0dd; box-shadow: 0 10px 26px #10203b12; }
.search-result-art { display: flex; flex-direction: column; align-items: center; justify-content: center;
gap: 8px; border-radius: 9px; min-height: 104px; text-decoration: none; background: var(--navy); color: #fff; }
.search-result-art b { font: 800 26px Georgia, serif; }
.search-result-art small { letter-spacing: .12em; font-size: 8px; font-weight: 900; opacity: .85; }
.search-result-art.tone-blue { background: linear-gradient(140deg,#12406e,#1e6fa8); }
.search-result-art.tone-red { background: linear-gradient(140deg,#8c2f2f,#c14b3f); }
.search-result-art.tone-green { background: linear-gradient(140deg,#1d5c46,#2f8f63); }
.search-result-art.tone-gold { background: linear-gradient(140deg,#8a6414,#d0a032); }
.search-result-art.tone-purple { background: linear-gradient(140deg,#57306b,#8f4fa8); }
.search-result-art.tone-navy { background: linear-gradient(140deg,#0b2545,#25436e); }
.search-result-copy h3 { margin: 8px 0 6px; font: 700 17px/1.3 Georgia, serif; color: var(--navy); }
.search-result-copy h3 a { color: inherit; text-decoration: none; }
.search-result-copy h3 a:hover { color: var(--blue); }
.search-result-copy p { color: #5b6779; font-size: 13px; line-height: 1.55; margin: 0; }
.search-filter-row { display: flex; gap: 14px; align-items: flex-end; flex-wrap: wrap; padding: 14px 0; }
.search-filter-row label { display: flex; flex-direction: column; gap: 5px; min-width: 160px; }
.search-filter-row label span { color: #778497; letter-spacing: .1em; font-size: 8px; font-weight: 900; }
.search-filter-row select { padding: 9px 11px; border: 1px solid var(--line); border-radius: 7px;
font-size: 12.5px; background: #fff; font-family: inherit; }
.search-upcoming { border: 1px solid var(--line); border-radius: 12px; padding: 18px; background: #fff; }
.search-upcoming h3 { margin: 0 0 12px; font: 700 15px Georgia, serif; color: var(--navy); }
.search-upcoming article { display: flex; gap: 11px; padding: 9px 0; border-bottom: 1px solid #f1f4f7; }
.search-upcoming article:last-child { border-bottom: 0; }
.search-upcoming time { color: var(--blue); font-size: 10px; font-weight: 900; white-space: nowrap; min-width: 46px; }
.search-upcoming a { color: var(--navy); font-size: 12.5px; line-height: 1.4; text-decoration: none; }
.search-upcoming a:hover { color: var(--blue); }
@media (max-width: 620px) {
.search-results-list article { grid-template-columns: 1fr; }
.search-result-art { min-height: 76px; flex-direction: row; }
.search-filter-row label { min-width: 100%; }
}
/* ==========================================================================
AJUSTES DE LAYOUT
========================================================================== */
/* --- 1. Ritmo vertical: secoes coladas umas nas outras ------------------- */
.ent-mosaic { padding-top: 30px; padding-bottom: 34px; }
.ent-latest { padding-top: 56px; }
.news-archive { padding-top: 44px; padding-bottom: 64px; }
/* Rede de seguranca: qualquer bloco sem respiro propria ganha um minimo */
.pb-section + .pb-section > section:not([class*="hero"]):not([class*="ad-"]):not(.breaking) {
margin-top: 0;
}
.pb-section > section.container { padding-top: max(28px, var(--pb-gap, 0px)); }
/* --- 2. Heroes: degrade cobrindo a largura total ------------------------- */
.events-hero,
.business-hero,
.search-hero,
.state-hero,
.category-intro,
.jobs-hero {
width: 100%;
}
.events-hero, .business-hero, .search-hero { background-attachment: scroll; }
/* O wrapper do construtor nao pode cortar o fundo */
.pb-section { width: 100%; }
/* --- 3. Abertura de categoria com mais presenca ------------------------- */
.category-intro {
padding: 52px 0 56px;
background: linear-gradient(120deg, #eef7fc 0%, #f7fbfd 55%, #fff 100%);
}
.category-intro h1 { font-size: 56px; margin: 10px 0 12px; }
.category-intro p { font-size: 17px; max-width: 700px; }
.category-intro .breadcrumbs { margin-bottom: 26px; }
/* --- 4. Filtros: alinhamento e altura consistentes ---------------------- */
.events-search {
align-items: end;
border-radius: 12px;
box-shadow: 0 12px 34px #10203b14;
padding: 18px 20px;
gap: 0 4px;
}
.events-search label { display: flex; flex-direction: column; justify-content: flex-end; }
.events-search label > span { margin-bottom: 8px; }
.events-search select,
.events-search input[type="search"] {
height: 44px;
padding: 0 12px;
border: 1px solid var(--line);
border-radius: 8px;
background: #fff;
font-size: 13px;
font-weight: 600;
width: 100%;
}
.events-search > button,
.events-search-actions > button {
height: 44px;
align-self: end;
border-radius: 8px;
padding: 0 22px;
font-size: 12px;
letter-spacing: .04em;
white-space: nowrap;
}
.events-search-actions { display: flex; align-items: flex-end; min-height: 0; }
.jobs-search { align-items: end; }
.jobs-search select,
.jobs-search input[type="search"] { height: 44px; font-size: 13px; }
.jobs-search button { height: 44px; border-radius: 8px; font-size: 12px; padding: 0 22px; }
.search-main-form label { align-items: center; }
.search-main-form input { height: 52px; font-size: 15px; }
.search-main-form button { height: 52px; border-radius: 8px; font-size: 13px; padding: 0 26px; }
/* --- 5. Semana da agenda: dias clicaveis com estado visivel ------------- */
/* --- 6. Arquivo de noticias --------------------------------------------- */
.news-archive-count { color: var(--muted); font-size: 12.5px; font-weight: 700; }
.news-archive-search { display: flex; gap: 10px; margin: 22px 0 18px; flex-wrap: wrap; }
.news-archive-search input {
flex: 1; min-width: 220px; height: 46px; padding: 0 15px;
border: 1px solid var(--line); border-radius: 9px; font-size: 14px; font-family: inherit;
}
.news-archive-search button {
height: 46px; padding: 0 24px; border: 0; border-radius: 9px;
background: var(--navy); color: #fff; font-weight: 800; font-size: 13px; cursor: pointer;
}
.news-archive-search button:hover { background: var(--blue); }
.news-archive-clear {
height: 46px; display: inline-flex; align-items: center; padding: 0 16px;
color: var(--muted); font-size: 13px; font-weight: 700;
}
.news-archive-cats { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 26px; }
.news-archive-cats a {
display: inline-flex; align-items: center; gap: 7px;
padding: 9px 15px; border: 1px solid var(--line); border-radius: 999px;
background: #fff; color: #4a5768; font-size: 13px; font-weight: 700; text-decoration: none;
}
.news-archive-cats a:hover { border-color: var(--cyan); color: var(--navy); }
.news-archive-cats a.active { background: var(--navy); border-color: var(--navy); color: #fff; }
.news-archive-cats a small {
background: #eef2f6; color: #6b7688; border-radius: 999px;
padding: 2px 7px; font-size: 11px; font-weight: 800;
}
.news-archive-cats a.active small { background: #ffffff2e; color: #fff; }
.news-archive-empty {
border: 1px dashed var(--line); border-radius: 12px; padding: 46px 20px;
text-align: center; color: var(--muted); background: #fafcfd;
}
.news-archive-empty b { display: block; color: var(--navy); font-size: 17px; margin-bottom: 6px; }
.news-archive-pages { display: flex; gap: 7px; margin-top: 32px; flex-wrap: wrap; align-items: center; }
.news-archive-pages a {
min-width: 40px; height: 40px; display: inline-flex; align-items: center; justify-content: center;
padding: 0 13px; border: 1px solid var(--line); border-radius: 8px;
color: var(--navy); font-size: 13px; font-weight: 700; text-decoration: none; background: #fff;
}
.news-archive-pages a:hover { border-color: var(--cyan); }
.news-archive-pages a.active { background: var(--navy); border-color: var(--navy); color: #fff; }
.news-archive-pages span { color: var(--muted); padding: 0 4px; }
.news-archive-grid .card-foot {
display: flex; justify-content: space-between; align-items: center;
gap: 10px; margin-top: 12px; padding-top: 11px; border-top: 1px solid #eef2f6;
}
.news-archive-grid .card-foot time { color: #98a2b3; font-size: 11.5px; }
.news-archive-grid .card-foot a { color: var(--blue); font-size: 12px; font-weight: 800; }
/* --- 7. Barra superior: informacoes que se alternam --------------------- */
.pb-ticker { display: inline-flex; align-items: center; min-height: 18px; }
.pb-ticker span { display: none; }
.pb-ticker span.is-on { display: inline; animation: pbFade .45s ease; }
@keyframes pbFade { from { opacity: 0; transform: translateY(-2px); } to { opacity: 1; transform: none; } }
/* --- 8. Menu principal: item ativo mais claro --------------------------- */
.nav-inner a.active { background: #ffffff14; border-bottom-color: var(--cyan); }
.nav-inner a { transition: background-color .15s, border-color .15s; }
/* ==========================================================================
RESPONSIVIDADE
========================================================================== */
@media (max-width: 900px) {
.category-intro { padding: 34px 0 36px; }
.category-intro h1 { font-size: 40px; }
.category-intro p { font-size: 15px; }
.news-archive-cats { gap: 6px; }
.news-archive-cats a { padding: 8px 12px; font-size: 12px; }
.events-search { padding: 15px; }
.search-main-form { flex-wrap: wrap; }
.search-main-form button { width: 100%; }
}
@media (max-width: 640px) {
.category-intro { padding: 26px 0 28px; }
.category-intro h1 { font-size: 31px; letter-spacing: -.02em; }
.news-archive { padding-top: 30px; padding-bottom: 40px; }
.news-archive-search input { min-width: 100%; }
.news-archive-search button, .news-archive-clear { flex: 1; justify-content: center; }
.news-archive-cats {
flex-wrap: nowrap; overflow-x: auto; padding-bottom: 6px;
-webkit-overflow-scrolling: touch; scrollbar-width: none;
}
.news-archive-cats::-webkit-scrollbar { display: none; }
.news-archive-cats a { white-space: nowrap; }
.search-results-heading { align-items: flex-start; }
.news-archive-pages a { min-width: 36px; height: 36px; font-size: 12px; }
.ent-latest { padding-top: 34px; }
}
/* Confirmacao do filtro ativo na agenda */
.events-active-filter {
display: flex; justify-content: space-between; align-items: center; gap: 14px;
flex-wrap: wrap; background: #eef6fb; border: 1px solid #d3e6f2;
border-radius: 10px; padding: 13px 17px; margin-bottom: 22px;
}
.events-active-filter span { color: var(--navy); font-size: 13.5px; font-weight: 700; }
.events-active-filter a { color: var(--blue); font-size: 12.5px; font-weight: 800; white-space: nowrap; }
/* ==========================================================================
CORRECOES DE CARDS E TIPOGRAFIA
========================================================================== */
/* --- 1. Titulos que viraram links nao podem herdar o tamanho de "a" -------
O layout original usa titulos sem link. Como agora todo card leva para a
materia, o dentro do titulo tem de manter a fonte do titulo. */
h1 a, h2 a, h3 a, h4 a, h5 a,
.card-copy h3 a, .category-card-copy h3 a, .directory-card-content h3 a,
.ent-latest-copy h3 a, .events-feature-copy h3 a, .sports-news-list h3 a {
font: inherit !important;
/* A cor tambem: em alguns blocos a regra generica de "a" pintava o titulo
de dourado sobre fundo claro, e a leitura ficava dificil. */
color: inherit !important;
letter-spacing: inherit;
text-decoration: none;
}
h2 a:hover, h3 a:hover, h4 a:hover { color: var(--blue); }
/* --- 2. Cards de empresas: foto, selo e texto no lugar ------------------- */
.directory-photo { position: relative; overflow: hidden; min-height: 100%; background: #eef2f6; }
.directory-photo > img { width: 100%; height: 100%; object-fit: cover; display: block; }
.directory-photo-art {
display: grid; place-items: center; width: 100%; height: 100%; min-height: 150px;
color: #ffffffdd; font: 900 46px Georgia, serif;
background: linear-gradient(145deg, #12406e, #1e6fa8);
}
.directory-photo-art.gold { background: linear-gradient(145deg, #8a6414, #d0a032); }
.directory-photo-art.green { background: linear-gradient(145deg, #1d5c46, #2f8f63); }
.directory-photo-art.red { background: linear-gradient(145deg, #8c2f2f, #c14b3f); }
.directory-photo-art.purple{ background: linear-gradient(145deg, #57306b, #8f4fa8); }
.directory-photo-art.navy { background: linear-gradient(145deg, #0b2545, #25436e); }
.directory-logo { position: absolute; left: 12px; bottom: 12px; z-index: 2; }
.directory-card-content { justify-content: flex-start; gap: 2px; }
.directory-card-content > span { display: block; margin-bottom: 4px; }
.directory-card-content h3 { margin: 4px 0 6px; font: 700 18px/1.25 Georgia, serif; }
.directory-card-content p {
margin: 0; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical;
overflow: hidden; line-height: 1.5;
}
.directory-empty { grid-column: 1 / -1; }
.directory-empty .directory-card-content { padding: 34px; text-align: center; }
/* --- 3. Eventos em destaque: arte nao pode cobrir o texto ---------------- */
.events-featured-grid { grid-template-rows: auto auto !important; }
.events-featured-grid article { grid-template-rows: auto 1fr !important; overflow: hidden; }
.events-featured-grid .events-feature-main { grid-template-rows: auto 1fr !important; }
.events-feature-art { min-height: 170px; }
.events-feature-main .events-feature-art { min-height: 240px; }
.events-feature-copy { min-width: 0; }
.events-feature-copy h3 { margin: 8px 0; }
.events-feature-copy p {
display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
/* Em telas largas o destaque volta a ficar lado a lado */
@media (min-width: 901px) {
.events-featured-grid { grid-template-columns: 1.25fr .75fr; }
.events-featured-grid .events-feature-main {
grid-row: 1 / 3; grid-template-columns: 48% 52% !important; grid-template-rows: 1fr !important;
}
}
/* --- 4. "Encontre seu proximo programa": fundo claro, texto escuro ------- */
.events-categories .events-section-heading h2 { color: var(--navy); }
.events-categories .events-section-heading span { color: var(--blue); }
.events-categories .events-section-heading p { color: var(--muted); }
.events-categories .events-section-heading { border-color: var(--line); }
/* --- 5. Anuncios: imagem contida e centralizada -------------------------- */
.ad-top, .ad-wide, .side-ad, .article-ad, .sports-side-ad, .category-inline-ad {
overflow: hidden;
}
.ad-top img, .ad-wide img, .side-ad img, .article-ad img,
.sports-side-ad img, .category-inline-ad img, .business-ads-row img {
max-width: 100%;
height: auto;
display: block;
margin: 0 auto;
object-fit: contain;
}
.ad-top, .ad-wide { height: auto; min-height: 105px; padding: 14px 18px; }
.ad-top > div, .ad-wide > div { min-width: 0; }
.ad-top a img, .ad-wide a img { margin-inline: auto; }
/* --- 6. Hero do estado: colunas, resumo e atalhos ------------------------ */
.state-kicker { color: var(--blue); letter-spacing: .14em; font-size: 11.5px; font-weight: 900; }
.state-summary { display: flex; flex-wrap: wrap; gap: 26px; margin-top: 26px; }
.state-summary span { color: #5c6b80; font-size: 12.5px; }
.state-summary b { display: block; color: var(--navy); font: 700 24px Georgia, serif; }
.state-cities { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 24px; }
.state-cities a {
display: flex; flex-direction: column; gap: 3px; min-width: 118px;
padding: 11px 15px; border: 1px solid #d8e6ee; border-radius: 10px;
background: #ffffffcc; text-decoration: none; transition: border-color .15s, transform .15s;
}
.state-cities a:hover { border-color: var(--cyan); transform: translateY(-2px); }
.state-cities b { color: var(--navy); font-size: 13.5px; font-weight: 700; }
.state-cities small { color: #7c8b9e; font-size: 11.5px; }
.state-sun {
width: 150px; height: 150px; border-radius: 50%;
background: radial-gradient(circle at 40% 35%, #ffe066, #e0a72c);
position: absolute; top: 42px; right: 52px; opacity: .9;
}
.state-map { color: #ffffffe6; font: 900 96px Georgia, serif; position: relative; z-index: 1; }
/* --- 7. Padronizacao dos titulos de card -------------------------------- */
.card-copy h3 { font: 700 19px/1.28 Georgia, serif; }
.category-card-copy h3 { font: 700 18px/1.28 Georgia, serif; }
.news-card h3 { font: 700 19px/1.28 Georgia, serif; }
.ent-latest-copy h3 { font: 700 20px/1.24 Georgia, serif; }
.sports-news-list h3 { font: 700 17px/1.3 Georgia, serif; }
/* --- 8. Painel de indicadores mais legivel ------------------------------ */
.market-panel { padding: 20px 22px; }
.market-row { padding: 11px 0; align-items: baseline; }
.market-row span { font-size: 13px; color: #4a5768; }
.market-row strong { font-size: 17px; }
.market-row em { font-size: 12px; font-weight: 800; font-style: normal; }
.market-row em.up { color: #2f9e5f; }
.market-row em.down { color: #d64545; }
.market-panel-head b { font-size: 17px; }
.market-panel > small { font-size: 11.5px; }
@media (max-width: 640px) {
.state-summary { gap: 16px; }
.state-summary b { font-size: 20px; }
.state-cities a { min-width: calc(50% - 5px); }
.directory-card-content h3 { font-size: 16px; }
.events-feature-main .events-feature-art { min-height: 180px; }
}
/* ==========================================================================
AGENDA: BARRA DA SEMANA E BALAO DO DIA
Cada dia e uma celula que contem o link do dia e, ao lado dele (nunca
dentro), o balao com os eventos — assim cada evento e clicavel.
========================================================================== */
.events-week {
display: grid;
grid-template-columns: minmax(150px, 1.3fr) repeat(7, minmax(0, 1fr));
gap: 1px;
background: #ffffff1a;
border-radius: 12px;
margin-top: 26px;
overflow: visible;
position: relative;
z-index: 20;
}
.events-week > .all-days {
display: flex; flex-direction: column; justify-content: center;
gap: 5px; min-height: 96px; padding: 14px 20px;
background: var(--gold); color: #2f2a0c; text-decoration: none;
border-radius: 12px 0 0 12px;
}
.events-week > .all-days b { letter-spacing: .14em; font-size: 11px; font-weight: 900; }
.events-week > .all-days span { font: 700 21px Georgia, serif; }
.events-week > .all-days.active { box-shadow: inset 0 -4px 0 #0000002e; }
.events-week-cell { position: relative; display: flex; z-index: 1; }
.events-week-cell:last-child { border-radius: 0 12px 12px 0; overflow: visible; }
.events-week-cell:hover, .events-week-cell.is-open, .events-week-cell:focus-within { z-index: 60; }
.events-day-link {
flex: 1;
display: flex; flex-direction: column; align-items: center; justify-content: center;
gap: 5px; min-height: 96px; padding: 14px 8px;
background: #16233f; color: #fff; text-decoration: none;
transition: background-color .15s;
}
.events-week-cell:last-child .events-day-link { border-radius: 0 12px 12px 0; }
.events-day-link > span { letter-spacing: .1em; font-size: 11px; font-weight: 900; color: #a9b7cc; }
.events-day-link > b { font: 700 27px Georgia, serif; color: var(--gold); }
.events-day-link > small { font-size: 11px; color: #94a3b8; }
.events-day-link:hover { background: #22345c; }
.events-week-cell.active .events-day-link { background: #22345c; box-shadow: inset 0 -4px 0 var(--gold); }
.events-week-cell.is-empty .events-day-link > b { color: #6b7b95; }
.events-week-cell.is-empty .events-day-link > small { color: #64748b; }
/* Balao com os eventos do dia */
.events-day-pop {
position: absolute; top: calc(100% + 10px); left: 50%;
transform: translateX(-50%) translateY(6px);
width: 280px; max-width: 80vw; z-index: 70;
background: #fff; color: var(--navy); text-align: left;
border: 1px solid var(--line); border-radius: 11px;
box-shadow: 0 18px 42px #0b254536;
padding: 14px 16px;
opacity: 0; visibility: hidden; pointer-events: none;
transition: opacity .16s ease .1s, transform .16s ease .1s, visibility 0s linear .3s;
}
.events-day-pop:before {
content: ""; position: absolute; top: -7px; left: 50%; margin-left: -7px;
border-left: 7px solid transparent; border-right: 7px solid transparent;
border-bottom: 7px solid #fff;
}
/* Ponte invisivel: o ponteiro nao "cai" ao descer ate o balao */
.events-day-pop:after {
content: ""; position: absolute; top: -14px; left: 0; right: 0; height: 14px;
}
.events-week-cell:hover .events-day-pop,
.events-week-cell:focus-within .events-day-pop,
.events-week-cell.is-open .events-day-pop {
opacity: 1; visibility: visible; pointer-events: auto;
transform: translateX(-50%) translateY(0);
transition-delay: 0s;
}
.events-day-pop > b {
display: block; font: 700 13.5px Georgia, serif; color: var(--navy);
padding-bottom: 9px; margin-bottom: 4px; border-bottom: 1px solid #eef2f6;
}
.events-day-pop ul { list-style: none; margin: 0; padding: 0; }
.events-day-pop li { border-bottom: 1px solid #f4f7f9; }
.events-day-pop li:last-child { border-bottom: 0; }
.events-day-pop li > a {
display: grid; gap: 2px; padding: 9px 8px; margin: 0 -8px;
border-radius: 7px; text-decoration: none; transition: background-color .12s;
}
.events-day-pop li > a:hover { background: #f2f8fc; }
.events-day-pop i { color: var(--blue); font-size: 11px; font-weight: 900; font-style: normal; }
.events-day-pop em { color: var(--navy); font-size: 12.5px; font-style: normal; line-height: 1.35; }
.events-day-pop li > a:hover em { color: var(--blue); }
.events-day-pop u { color: #8894a6; font-size: 11px; text-decoration: none; }
.events-day-pop p { color: var(--muted); font-size: 12.5px; margin: 6px 0 0; }
.events-day-pop-cta {
display: block; margin-top: 8px; padding-top: 9px; border-top: 1px solid #eef2f6;
color: var(--blue); font-size: 11.5px; font-weight: 900; text-decoration: none;
}
.events-day-pop-cta:hover { color: var(--navy); }
/* Nos ultimos dias o balao abre para a esquerda, para nao sair da tela */
.events-week-cell:nth-last-child(-n+2) .events-day-pop {
left: auto; right: 0; transform: translateX(0) translateY(6px);
}
.events-week-cell:nth-last-child(-n+2) .events-day-pop:before { left: auto; right: 26px; }
.events-week-cell:nth-last-child(-n+2):hover .events-day-pop,
.events-week-cell:nth-last-child(-n+2):focus-within .events-day-pop,
.events-week-cell:nth-last-child(-n+2).is-open .events-day-pop { transform: translateX(0) translateY(0); }
@media (max-width: 900px) {
.events-week { grid-template-columns: repeat(4, 1fr); }
.events-week > .all-days {
grid-column: 1 / -1; align-items: center; text-align: center; border-radius: 12px 12px 0 0;
}
.events-week-cell:last-child .events-day-link { border-radius: 0; }
}
@media (max-width: 640px) {
.events-week { grid-template-columns: repeat(3, 1fr); }
.events-day-link { min-height: 82px; }
.events-day-link > b { font-size: 22px; }
.events-day-pop {
position: fixed; left: 12px; right: 12px; top: auto; bottom: 12px;
width: auto; max-width: none; transform: none;
}
.events-day-pop:before, .events-day-pop:after { display: none; }
.events-week-cell:hover .events-day-pop,
.events-week-cell.is-open .events-day-pop,
.events-week-cell:nth-last-child(-n+2).is-open .events-day-pop { transform: none; }
}
/* ==========================================================================
CORRECOES DE CARDS E TIPOGRAFIA
========================================================================== */
/* --- 1. Titulos que viraram links nao podem herdar o tamanho de "a" -------
O layout original usa titulos sem link. Como agora todo card leva para a
materia, o dentro do titulo tem de manter a fonte do titulo. */
h1 a, h2 a, h3 a, h4 a, h5 a,
.card-copy h3 a, .category-card-copy h3 a, .directory-card-content h3 a,
.ent-latest-copy h3 a, .events-feature-copy h3 a, .sports-news-list h3 a {
font: inherit !important;
color: inherit;
letter-spacing: inherit;
text-decoration: none;
}
h2 a:hover, h3 a:hover, h4 a:hover { color: var(--blue); }
/* --- 2. Cards de empresas: foto, selo e texto no lugar ------------------- */
.directory-photo { position: relative; overflow: hidden; min-height: 100%; background: #eef2f6; }
.directory-photo > img { width: 100%; height: 100%; object-fit: cover; display: block; }
.directory-photo-art {
display: grid; place-items: center; width: 100%; height: 100%; min-height: 150px;
color: #ffffffdd; font: 900 46px Georgia, serif;
background: linear-gradient(145deg, #12406e, #1e6fa8);
}
.directory-photo-art.gold { background: linear-gradient(145deg, #8a6414, #d0a032); }
.directory-photo-art.green { background: linear-gradient(145deg, #1d5c46, #2f8f63); }
.directory-photo-art.red { background: linear-gradient(145deg, #8c2f2f, #c14b3f); }
.directory-photo-art.purple{ background: linear-gradient(145deg, #57306b, #8f4fa8); }
.directory-photo-art.navy { background: linear-gradient(145deg, #0b2545, #25436e); }
.directory-logo { position: absolute; left: 12px; bottom: 12px; z-index: 2; }
.directory-card-content { justify-content: flex-start; gap: 2px; }
.directory-card-content > span { display: block; margin-bottom: 4px; }
.directory-card-content h3 { margin: 4px 0 6px; font: 700 18px/1.25 Georgia, serif; }
.directory-card-content p {
margin: 0; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical;
overflow: hidden; line-height: 1.5;
}
.directory-empty { grid-column: 1 / -1; }
.directory-empty .directory-card-content { padding: 34px; text-align: center; }
/* --- 3. Eventos em destaque: arte nao pode cobrir o texto ---------------- */
.events-featured-grid { grid-template-rows: auto auto !important; }
.events-featured-grid article { grid-template-rows: auto 1fr !important; overflow: hidden; }
.events-featured-grid .events-feature-main { grid-template-rows: auto 1fr !important; }
.events-feature-art { min-height: 170px; }
.events-feature-main .events-feature-art { min-height: 240px; }
.events-feature-copy { min-width: 0; }
.events-feature-copy h3 { margin: 8px 0; }
.events-feature-copy p {
display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
/* Em telas largas o destaque volta a ficar lado a lado */
@media (min-width: 901px) {
.events-featured-grid { grid-template-columns: 1.25fr .75fr; }
.events-featured-grid .events-feature-main {
grid-row: 1 / 3; grid-template-columns: 48% 52% !important; grid-template-rows: 1fr !important;
}
}
/* --- 4. "Encontre seu proximo programa": fundo claro, texto escuro ------- */
.events-categories .events-section-heading h2 { color: var(--navy); }
.events-categories .events-section-heading span { color: var(--blue); }
.events-categories .events-section-heading p { color: var(--muted); }
.events-categories .events-section-heading { border-color: var(--line); }
/* --- 5. Anuncios: imagem contida e centralizada -------------------------- */
.ad-top, .ad-wide, .side-ad, .article-ad, .sports-side-ad, .category-inline-ad {
overflow: hidden;
}
.ad-top img, .ad-wide img, .side-ad img, .article-ad img,
.sports-side-ad img, .category-inline-ad img, .business-ads-row img {
max-width: 100%;
height: auto;
display: block;
margin: 0 auto;
object-fit: contain;
}
.ad-top, .ad-wide { height: auto; min-height: 105px; padding: 14px 18px; }
.ad-top > div, .ad-wide > div { min-width: 0; }
.ad-top a img, .ad-wide a img { margin-inline: auto; }
/* --- 6. Hero do estado: colunas, resumo e atalhos ------------------------ */
.state-kicker { color: var(--blue); letter-spacing: .14em; font-size: 11.5px; font-weight: 900; }
.state-summary { display: flex; flex-wrap: wrap; gap: 26px; margin-top: 26px; }
.state-summary span { color: #5c6b80; font-size: 12.5px; }
.state-summary b { display: block; color: var(--navy); font: 700 24px Georgia, serif; }
.state-cities { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 24px; }
.state-cities a {
display: flex; flex-direction: column; gap: 3px; min-width: 118px;
padding: 11px 15px; border: 1px solid #d8e6ee; border-radius: 10px;
background: #ffffffcc; text-decoration: none; transition: border-color .15s, transform .15s;
}
.state-cities a:hover { border-color: var(--cyan); transform: translateY(-2px); }
.state-cities b { color: var(--navy); font-size: 13.5px; font-weight: 700; }
.state-cities small { color: #7c8b9e; font-size: 11.5px; }
.state-sun {
width: 150px; height: 150px; border-radius: 50%;
background: radial-gradient(circle at 40% 35%, #ffe066, #e0a72c);
position: absolute; top: 42px; right: 52px; opacity: .9;
}
.state-map { color: #ffffffe6; font: 900 96px Georgia, serif; position: relative; z-index: 1; }
/* --- 7. Padronizacao dos titulos de card -------------------------------- */
.card-copy h3 { font: 700 19px/1.28 Georgia, serif; }
.category-card-copy h3 { font: 700 18px/1.28 Georgia, serif; }
.news-card h3 { font: 700 19px/1.28 Georgia, serif; }
.ent-latest-copy h3 { font: 700 20px/1.24 Georgia, serif; }
.sports-news-list h3 { font: 700 17px/1.3 Georgia, serif; }
/* --- 8. Painel de indicadores mais legivel ------------------------------ */
.market-panel { padding: 20px 22px; }
.market-row { padding: 11px 0; align-items: baseline; }
.market-row span { font-size: 13px; color: #4a5768; }
.market-row strong { font-size: 17px; }
.market-row em { font-size: 12px; font-weight: 800; font-style: normal; }
.market-row em.up { color: #2f9e5f; }
.market-row em.down { color: #d64545; }
.market-panel-head b { font-size: 17px; }
.market-panel > small { font-size: 11.5px; }
@media (max-width: 640px) {
.state-summary { gap: 16px; }
.state-summary b { font-size: 20px; }
.state-cities a { min-width: calc(50% - 5px); }
.directory-card-content h3 { font-size: 16px; }
.events-feature-main .events-feature-art { min-height: 180px; }
}
/* ==========================================================================
AGENDA: BARRA DA SEMANA E BALAO DO DIA
========================================================================== */
/* ==========================================================================
AJUSTES FINAIS
========================================================================== */
/* --- 1. O balao do dia nao pode ser cortado nem coberto ------------------ */
.events-hero { overflow: visible; z-index: 5; }
/* O circulo decorativo passa a caber dentro do hero, sem precisar recortar */
.events-hero:before {
top: 10px; right: 30px; width: 380px; height: 380px; border-width: 60px;
}
/* As secoes seguintes ficam abaixo do balao */
.events-hero + .pb-section, .pb-section:has(.events-hero) + .pb-section { position: relative; z-index: 1; }
/* --- 2. Busca de eventos: campo e botao lado a lado --------------------- */
.events-search-q { grid-column: span 2; min-width: 0; }
.events-search-q > div { display: flex; gap: 10px; align-items: stretch; }
.events-search-q input[type="search"] { flex: 1; min-width: 0; }
.events-search-q button {
flex: 0 0 auto; height: 44px; padding: 0 22px; border: 0; border-radius: 8px;
background: var(--navy); color: #fff; font-weight: 800; font-size: 12px;
letter-spacing: .04em; cursor: pointer; white-space: nowrap;
}
.events-search-q button:hover { background: var(--blue); }
/* --- 3. Guia comercial: 3 por linha, texto completo -------------------- */
.directory-grid { grid-template-columns: repeat(3, 1fr) !important; gap: 22px; }
.directory-grid article {
grid-template-columns: 38% 62% !important;
min-height: 210px;
align-items: stretch;
}
.directory-card-content { padding: 18px 18px 16px; }
.directory-card-content h3 { font: 700 17px/1.25 Georgia, serif; margin: 5px 0 7px; }
.directory-card-content p {
-webkit-line-clamp: 4; font-size: 12.5px; line-height: 1.5;
}
.directory-card-footer { gap: 10px; flex-wrap: wrap; padding-top: 13px; }
.directory-card-footer > a { white-space: nowrap; }
.directory-card-footer > b { font-size: 10.5px; padding: 4px 7px; white-space: normal; }
@media (max-width: 1100px) {
.directory-grid { grid-template-columns: repeat(2, 1fr) !important; }
}
@media (max-width: 760px) {
.directory-grid { grid-template-columns: 1fr !important; }
.directory-grid article { grid-template-columns: 34% 66% !important; min-height: 170px; }
.directory-card-content p { -webkit-line-clamp: 3; }
}
@media (max-width: 460px) {
.directory-grid article { grid-template-columns: 1fr !important; }
.directory-photo { min-height: 130px; }
.directory-photo-art { min-height: 130px; }
}
/* --- 4. Thumbs: nada de forma decorativa por cima da foto --------------
A classe .has-image e aplicada pelo PHP sempre que o card tem foto real.
Regra unica e abrangente: nenhuma forma, faixa ou circulo decorativo
sobrepoe a imagem, seja qual for o bloco. */
.has-image::before,
.has-image::after {
content: none !important;
display: none !important;
background: none !important;
}
/* Formas desenhadas como elementos (nao pseudo) tambem somem */
.has-image > .sports-lines,
.has-image > .sports-ball,
.has-image > .state-sun,
.has-image > .state-map,
.has-image > .visual-icon,
.has-image > .ent-art-shape { display: none !important; }
/* A foto ocupa o card inteiro.
Sem !important de proposito: o encaixe (preencher ou foto inteira) e a
altura vem do proprio bloco, escolhidos no construtor. */
.has-image {
background-size: cover;
background-position: center;
background-repeat: no-repeat;
}
/* O rotulo continua legivel sobre a foto */
.has-image > .example-label,
.has-image > small {
background: #0f1a2ecc !important;
z-index: 2;
}
/* --- 5. Filtros nao podem ser cobertos pela secao seguinte ------------- */
.events-search, .jobs-search, .search-filter-band, .directory-search {
position: relative;
z-index: 4;
}
.sports-filter { position: relative; z-index: 3; flex-wrap: wrap; }
.sports-filter a {
display: inline-flex; align-items: center; gap: 7px;
}
.sports-filter a i {
font-style: normal; background: #eef2f6; color: #5b6779;
border-radius: 999px; padding: 1px 7px; font-size: 10.5px; font-weight: 800;
}
.sports-filter a.active i { background: #ffffff2e; color: #fff; }
@media (max-width: 900px) {
.events-search-q { grid-column: 1 / -1; }
.events-search-q > div { flex-direction: column; }
.events-search-q button { width: 100%; }
/* Espaco extra para o cartao de filtros nao encostar na secao de baixo */
.events-hero { padding-bottom: 26px; }
.events-search { margin-bottom: 0; }
}
/* ==========================================================================
TEMA DAS MATERIAS (ajustavel no painel)
========================================================================== */
.article-body { width: min(100%, var(--pb-article-width, 680px)); margin-inline: auto; }
.article-body p { font-size: var(--pb-article-font, 17px); }
/* Anuncios dentro da materia */
.article-ad.pb-ad-custom { display: block; text-align: center; }
.article-ad.pb-ad-custom img,
.side-ad img, .article-ad img { max-width: 100%; height: auto; margin: 0 auto; display: block; }
.pb-ad-image { display: block; margin: 10px auto; max-width: 100%; }
.article-body .article-ad { margin: 30px auto; width: 100%; }
.side-ad .pb-ad-image img { border-radius: 6px; }
/* ==========================================================================
PAGINA DE AGRADECIMENTO
========================================================================== */
.thanks-page { padding: 56px 0 70px; background: linear-gradient(160deg, #f4f9fc 0%, #fff 60%); }
.thanks-card {
max-width: 660px; margin: 0 auto; text-align: center;
background: #fff; border: 1px solid var(--line); border-radius: 16px;
padding: 46px 34px; box-shadow: 0 16px 44px #10203b12;
}
.thanks-mark {
width: 66px; height: 66px; margin: 0 auto 22px; border-radius: 50%;
display: grid; place-items: center; font-size: 30px; font-weight: 700;
background: #e7f6ec; color: #2f9e5f;
}
.thanks-card span {
display: block; color: var(--blue); letter-spacing: .14em;
font-size: 11.5px; font-weight: 900; margin-bottom: 10px;
}
.thanks-card h1 { color: var(--navy); font: 700 34px/1.2 Georgia, serif; margin: 0 0 14px; }
.thanks-card p { color: #5b6779; font-size: 15px; line-height: 1.6; margin: 0 auto; max-width: 500px; }
.thanks-actions { display: flex; gap: 12px; justify-content: center; flex-wrap: wrap; margin-top: 28px; }
.thanks-actions a {
display: inline-flex; align-items: center; height: 46px; padding: 0 22px;
border: 1px solid var(--line); border-radius: 9px; background: #fff;
color: var(--navy); font-size: 13.5px; font-weight: 700; text-decoration: none;
}
.thanks-actions a:hover { border-color: var(--cyan); }
.thanks-actions a.primary { background: var(--navy); border-color: var(--navy); color: #fff; }
.thanks-actions a.primary:hover { background: var(--blue); border-color: var(--blue); }
.thanks-suggestions { max-width: 1100px; margin: 52px auto 0; }
/* Aviso de erro na inscricao */
.thanks-page .thanks-card:has(.thanks-mark:not(:empty)) { }
.thanks-card .thanks-mark:only-child { margin-bottom: 0; }
@media (max-width: 640px) {
.thanks-page { padding: 34px 0 44px; }
.thanks-card { padding: 32px 20px; border-radius: 13px; }
.thanks-card h1 { font-size: 25px; }
.thanks-actions a { width: 100%; justify-content: center; }
}
/* ==========================================================================
EVENTOS EM DESTAQUE: rotulo da arte nao pode encostar no texto
========================================================================== */
/* O rotulo fica preso dentro da arte, com fundo proprio para ser legivel
sobre qualquer cor ou foto. */
.events-feature-art,
.ent-latest-art,
.category-card-art,
.card-visual {
position: relative !important;
overflow: hidden !important;
}
.events-feature-art > small,
.events-feature-art > .example-label {
position: absolute !important;
bottom: 8px; left: 10px; top: auto; right: auto;
z-index: 3;
max-width: calc(100% - 20px);
padding: 3px 8px;
border-radius: 5px;
background: #0f1a2ea6;
color: #fff !important;
font-size: 10px;
letter-spacing: .1em;
line-height: 1.35;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
/* Respiro no conteudo, para nada colidir com a arte */
.events-feature-copy { padding-top: 20px; }
.events-feature-copy > span { display: block; margin-bottom: 2px; }
.events-feature-meta { margin-top: 8px; flex-wrap: wrap; row-gap: 4px; }
.events-feature-copy h3 { margin: 10px 0 8px; }
.events-feature-copy > small { display: block; margin-top: 4px; }
/* Em telas pequenas o espaco e curto: o rotulo sai de cena */
@media (max-width: 640px) {
.events-feature-art > small,
.events-feature-art > .example-label { display: none; }
.events-feature-copy { padding-top: 16px; }
}
/* ==========================================================================
"ENCONTRE SEU PROXIMO PROGRAMA": fundo claro pede texto escuro
========================================================================== */
.events-categories .events-section-heading h2,
.events-categories .events-section-heading h2 a {
color: var(--navy) !important;
}
.events-categories .events-section-heading > p { color: var(--muted) !important; }
.events-categories .events-section-heading span { color: var(--blue) !important; }
.events-categories .events-section-heading { border-color: var(--line) !important; }
/* Mesmo que o bloco venha marcado como "claro" de versoes anteriores */
.events-categories .events-section-heading.light h2 { color: var(--navy) !important; }
.events-categories .events-section-heading.light > p { color: var(--muted) !important; }
/* ==========================================================================
CARDS DE TEXTO COM A FOTO DA MATERIA AO FUNDO
As regras destes cards NAO ficam aqui: elas sao escritas pelo proprio PHP
(includes/helpers.php, funcao pb_card_photo_css) e entram no de cada
pagina. Assim a foto e o texto claro sempre andam juntos, mesmo que um dia
so parte dos arquivos seja enviada para o servidor.
Para mudar algo (a intensidade do veu escuro, a altura dos cards, as cores),
edite aquela funcao — ou escreva aqui embaixo a sua regra com !important,
porque este arquivo e carregado depois.
========================================================================== */