/*
 * Doutor Bruxismo — camada de tema sobre o Bootstrap 5.3.
 *
 * Regra da casa: layout, espaçamento, cores de fundo/texto e componentes vêm
 * das classes do Bootstrap no markup. Este arquivo só (1) mapeia a paleta da
 * marca nas variáveis --bs-* e (2) define o que o Bootstrap não oferece.
 * Para trocar a paleta, altere apenas os tokens --brand-* abaixo.
 */

/* 1. Tokens da marca ------------------------------------------------------ */
:root {
	--brand-ink: #0f2a30;
	--brand-ink-rgb: 15, 42, 48;
	--brand-ink-hover: #0a1e22;
	--brand-ink-2: #173840;
	--brand-ink-2-rgb: 23, 56, 64;
	--brand-ink-3: #1e4650;
	--brand-gold: #b8925a;
	--brand-gold-hover: #a47e47;
	--brand-gold-light: #d8bd8e;
	--brand-gold-deep: #8c6b36;
	--brand-gold-subtle: #f3e9d8;
	--brand-cream: #fbf8f3;
	--brand-cream-rgb: 251, 248, 243;
	--brand-sand: #f3ede3;
	--brand-sand-rgb: 243, 237, 227;
	--brand-sand-2: #e9e0d1;
	--brand-sand-2-rgb: 233, 224, 209;
	--brand-text: #1c2b2f;
	--brand-text-rgb: 28, 43, 47;
	--brand-line: #e4dccf;
	--brand-font-body: "Manrope", system-ui, -apple-system, "Segoe UI", sans-serif;
	--brand-font-display: "Fraunces", Georgia, "Times New Roman", serif;

	/* Texto em dourado precisa ser mais escuro no claro (contraste AA). */
	--brand-accent: var(--brand-gold-deep);

	/* 2. Bootstrap: paleta e tipografia */
	--bs-primary: var(--brand-ink);
	--bs-primary-rgb: var(--brand-ink-rgb);
	--bs-primary-text-emphasis: var(--brand-ink);
	--bs-primary-bg-subtle: var(--brand-sand);
	--bs-primary-border-subtle: var(--brand-sand-2);
	--bs-body-bg: var(--brand-cream);
	--bs-body-bg-rgb: var(--brand-cream-rgb);
	--bs-body-color: var(--brand-text);
	--bs-body-color-rgb: var(--brand-text-rgb);
	--bs-emphasis-color: var(--brand-ink);
	--bs-emphasis-color-rgb: var(--brand-ink-rgb);
	--bs-secondary-color: rgba(var(--brand-text-rgb), .7);
	--bs-tertiary-color: rgba(var(--brand-text-rgb), .4);
	--bs-secondary-bg: var(--brand-sand-2);
	--bs-secondary-bg-rgb: var(--brand-sand-2-rgb);
	--bs-tertiary-bg: var(--brand-sand);
	--bs-tertiary-bg-rgb: var(--brand-sand-rgb);
	--bs-border-color: var(--brand-line);
	--bs-link-color: var(--brand-ink);
	--bs-link-color-rgb: var(--brand-ink-rgb);
	--bs-link-hover-color: var(--brand-gold-deep);
	--bs-link-hover-color-rgb: 140, 107, 54;
	--bs-body-font-family: var(--brand-font-body);
	--bs-border-radius-xl: 1.25rem;
	--bs-border-radius-xxl: 2rem;
	--bs-focus-ring-color: rgba(184, 146, 90, .35);
}

/* Seções escuras: basta data-bs-theme="dark" + bg-primary no markup. */
[data-bs-theme=dark] {
	--brand-accent: var(--brand-gold-light);
	--bs-body-bg: var(--brand-ink);
	--bs-body-bg-rgb: var(--brand-ink-rgb);
	--bs-body-color: #f3ede3;
	--bs-body-color-rgb: 243, 237, 227;
	--bs-emphasis-color: #fff;
	--bs-emphasis-color-rgb: 255, 255, 255;
	--bs-secondary-color: rgba(243, 237, 227, .72);
	--bs-tertiary-color: rgba(243, 237, 227, .45);
	--bs-secondary-bg: var(--brand-ink-3);
	--bs-tertiary-bg: var(--brand-ink-2);
	--bs-tertiary-bg-rgb: var(--brand-ink-2-rgb);
	--bs-border-color: rgba(255, 255, 255, .14);
	--bs-link-color: var(--brand-gold-light);
	--bs-link-color-rgb: 216, 189, 142;
	--bs-link-hover-color: #fff;
	--bs-link-hover-color-rgb: 255, 255, 255;
	color: var(--bs-body-color);
}

/* 3. Base ------------------------------------------------------------------ */
html { scroll-behavior: smooth; overflow-x: clip; }
body { overflow-x: clip; }
body.admin-bar .sticky-top { top: 32px; }
#main-content { scroll-margin-top: 8rem; }
h1, h2, h3, .h1, .h2, .h3, .display-1, .display-2, .display-3, .display-4, .display-5, .display-6, .font-display, .brand-wordmark {
	font-family: var(--brand-font-display);
	font-weight: 500;
	letter-spacing: -.02em;
}
h1 em, h2 em, .display-2 em { font-style: italic; }
::selection { background: rgba(184, 146, 90, .3); }

/* 4. Peças que o Bootstrap não tem ---------------------------------------- */
.text-accent { color: var(--brand-accent) !important; }
.bg-accent-subtle { background-color: var(--brand-gold-subtle) !important; }
.section-kicker { display: inline-block; font-size: .78rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; }
.brand-wordmark { color: var(--bs-emphasis-color); font-size: 2rem; font-weight: 600; }
.icon-badge { align-items: center; background: var(--brand-gold-subtle); border-radius: 50%; color: var(--brand-gold-deep); display: inline-flex; flex: 0 0 auto; font-size: 1.35rem; height: 3.25rem; justify-content: center; width: 3.25rem; }
.icon-badge--lg { font-size: 1.75rem; height: 4.25rem; width: 4.25rem; }
[data-bs-theme=dark] .icon-badge { background: rgba(216, 189, 142, .14); color: var(--brand-gold-light); }
/* Botão com seta: o visual vem de .btn .btn-outline-* no markup. */
.link-arrow { align-items: center; display: inline-flex; gap: .6rem; }
.link-arrow i { transition: transform .2s ease; }
.link-arrow:hover i, .lift:hover .link-arrow i { transform: translateX(4px); }
/* Card inteiro clicável: o botão interno acende junto com o hover do card. */
.lift:hover .link-arrow { background-color: var(--bs-btn-hover-bg); border-color: var(--bs-btn-hover-border-color); color: var(--bs-btn-hover-color); }
.lift { transition: transform .3s ease, box-shadow .3s ease; }
.lift:hover { box-shadow: var(--bs-box-shadow) !important; transform: translateY(-4px); }
.sticky-offset { top: 8rem; }
.social-icon-link { align-items: center; display: inline-flex; height: 2.75rem; justify-content: center; padding: 0; width: 2.75rem; }

/* Botões: Bootstrap compila as cores no CSS, então remapeamos as variáveis. */
.btn { font-weight: 600; }
.btn-primary {
	--bs-btn-bg: var(--brand-ink); --bs-btn-border-color: var(--brand-ink);
	--bs-btn-hover-bg: var(--brand-ink-hover); --bs-btn-hover-border-color: var(--brand-ink-hover);
	--bs-btn-active-bg: var(--brand-ink-hover); --bs-btn-active-border-color: var(--brand-ink-hover);
	--bs-btn-focus-shadow-rgb: var(--brand-ink-rgb);
}
.btn-outline-primary {
	--bs-btn-color: var(--brand-ink); --bs-btn-border-color: var(--brand-ink);
	--bs-btn-hover-bg: var(--brand-ink); --bs-btn-hover-border-color: var(--brand-ink);
	--bs-btn-active-bg: var(--brand-ink); --bs-btn-active-border-color: var(--brand-ink);
	--bs-btn-focus-shadow-rgb: var(--brand-ink-rgb);
}
.btn-accent {
	--bs-btn-color: var(--brand-ink); --bs-btn-bg: var(--brand-gold); --bs-btn-border-color: var(--brand-gold);
	--bs-btn-hover-color: var(--brand-ink); --bs-btn-hover-bg: var(--brand-gold-light); --bs-btn-hover-border-color: var(--brand-gold-light);
	--bs-btn-active-color: var(--brand-ink); --bs-btn-active-bg: var(--brand-gold-hover); --bs-btn-active-border-color: var(--brand-gold-hover);
	--bs-btn-focus-shadow-rgb: 184, 146, 90;
}

/* 5. Header e navegação ---------------------------------------------------- */
.site-header { z-index: 1030; }
.site-header .navbar {
	--bs-navbar-color: var(--brand-text);
	--bs-navbar-hover-color: var(--brand-gold-deep);
	--bs-navbar-active-color: var(--brand-gold-deep);
	--bs-navbar-nav-link-padding-x: .8rem;
}
.site-header .nav-link { font-weight: 600; }
.site-header .current-menu-item > .nav-link, .site-header .current_page_item > .nav-link { color: var(--bs-navbar-active-color); }
.custom-logo { max-height: 56px; }
.offcanvas { --bs-offcanvas-width: min(88vw, 390px); }
.offcanvas .nav-link { border-bottom: 1px solid var(--bs-border-color); }
.offcanvas .dropdown-menu { border: 0; position: static !important; transform: none !important; }
@media (min-width: 992px) {
	.site-header .dropdown:hover > .dropdown-menu, .site-header .dropdown:focus-within > .dropdown-menu { display: block; margin-top: 0; }
}

/* 6. Seções ---------------------------------------------------------------- */
.hero-home__image { aspect-ratio: 4 / 5; }
.page-hero, .cta-panel { background-image: radial-gradient(circle at 85% 0%, rgba(184, 146, 90, .22), transparent 45%); }
.ticker__track { animation: brand-ticker 40s linear infinite; width: max-content; }
@keyframes brand-ticker { to { transform: translateX(-50%); } }
.footer-links a { color: var(--bs-secondary-color); text-decoration: none; }
.footer-links a:hover { color: var(--bs-emphasis-color); }
.floating-whatsapp { height: 3.75rem; width: 3.75rem; z-index: 1020; }

/* 7. Conteúdo editorial (posts e páginas do editor) ------------------------ */
.entry-content { overflow-wrap: anywhere; }
.entry-content > * { max-width: 820px; }
.entry-content > .alignwide { max-width: 1100px; }
.entry-content > .alignfull { max-width: none; }
.entry-content h2 { font-size: clamp(1.7rem, 3vw, 2.3rem); margin: 2.5rem 0 1rem; }
.entry-content h2:first-child { margin-top: 0; }
.entry-content h3 { font-size: 1.4rem; margin: 2rem 0 .65rem; }
.entry-content a { text-decoration: underline; text-underline-offset: .2em; }
.entry-content img { border-radius: var(--bs-border-radius-lg); height: auto; max-width: 100%; }
.entry-content table { display: block; overflow-x: auto; }
.entry-content blockquote { background: var(--bs-tertiary-bg); border-left: 4px solid var(--brand-gold); border-radius: 0 var(--bs-border-radius-lg) var(--bs-border-radius-lg) 0; font-family: var(--brand-font-display); font-size: 1.25rem; margin: 2rem 0; padding: 1.5rem; }
.entry-meta { color: var(--bs-secondary-color); display: flex; flex-wrap: wrap; font-size: .9rem; gap: .75rem 1.25rem; }
.entry-thumbnail img { border-radius: var(--bs-border-radius-xl); height: auto; width: 100%; }
.entry-taxonomy { border-top: 1px solid var(--bs-border-color); display: flex; flex-wrap: wrap; gap: .5rem; margin-top: 2rem; padding-top: 1.5rem; }
.entry-taxonomy a { background: var(--bs-tertiary-bg); border-radius: 999px; font-size: .85rem; padding: .35rem .75rem; text-decoration: none; }
.post-navigation .nav-links { border-top: 1px solid var(--bs-border-color); display: flex; gap: 1rem; justify-content: space-between; margin-top: 2.5rem; padding-top: 1.5rem; }
.post-nav__label { color: var(--bs-secondary-color); display: block; font-size: .8rem; text-transform: uppercase; }
.post-list-card__media { min-height: 220px; }
.post-list-card__media img, .post-list-card__placeholder { object-fit: cover; }
.post-list-card__placeholder { background: var(--bs-tertiary-bg); color: var(--brand-gold); font-size: 3.5rem; min-height: 220px; }
.post-list-card__title { line-height: 1.2; }
.search-form__inner .form-control { border-radius: var(--bs-border-radius-pill) 0 0 var(--bs-border-radius-pill); padding-inline: 1.1rem; }
.search-form__inner .btn { border-radius: 0 var(--bs-border-radius-pill) var(--bs-border-radius-pill) 0; padding-inline: 1.1rem; }
.navigation.pagination .nav-links { display: flex; flex-wrap: wrap; gap: .5rem; justify-content: center; margin-top: 3rem; }
.navigation.pagination .page-numbers { border: 1px solid var(--bs-border-color); border-radius: var(--bs-border-radius-pill); color: var(--bs-body-color); min-width: 2.75rem; padding: .5rem .9rem; text-align: center; text-decoration: none; }
.navigation.pagination .page-numbers.current { background: var(--brand-ink); border-color: var(--brand-ink); color: #fff; }

/* 8. Animação de entrada (assets/js/theme.js) ------------------------------ */
[data-reveal].reveal-pending { opacity: 0; transform: translateY(28px); }
[data-reveal].is-visible { animation: brand-reveal .8s cubic-bezier(.2, .65, .3, 1) var(--reveal-delay, 0ms) both; }
@keyframes brand-reveal { from { opacity: 0; transform: translateY(28px); } to { opacity: 1; transform: none; } }

@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }
	[data-reveal].reveal-pending, [data-reveal].is-visible { animation: none; opacity: 1; transform: none; }
	.ticker__track { animation: none; }
	* { animation-duration: .01ms !important; transition-duration: .01ms !important; }
}
@media (max-width: 991.98px) {
	body.admin-bar .sticky-top { top: 46px; }
	.hero-home__image { aspect-ratio: 4 / 3; }
}
@media (max-width: 782px) {
	body.admin-bar .sticky-top { top: 0; }
}