/* ==========================================================================
   Tema Dra. Bianca Almeida — blog, post, busca, arquivos e 404.
   Segue o sistema de design do site (ver DESIGN.md na raiz do projeto):
   títulos em Cormorant Garamond, corpo em Darker Grotesque, tons terrosos,
   sombras longas em camadas e hover que sobe 5px em 300ms.
   ========================================================================== */

/* ---------------------------------------------------------------- base ---- */

.bia-interna {
	background: #fffdfd;
}

.bia-container {
	width: 100%;
	max-width: 1320px; /* 1280 de conteúdo + 20px de calha de cada lado */
	margin-inline: auto;
	padding-inline: 20px;
}

.bia-main {
	padding-block: 4.5rem 6rem;
}

.screen-reader-text {
	position: absolute !important;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(1px, 1px, 1px, 1px);
	clip-path: inset(50%);
	white-space: nowrap;
}

/* Entrada em cascata — só entra em ação quando há JavaScript, para o conteúdo
   nunca ficar invisível se o script falhar. */
.bia-js .bia-anim {
	opacity: 0;
	transform: translateY(24px);
	transition: opacity .5s ease-in-out, transform .5s ease-in-out;
	will-change: transform, opacity;
}

.bia-js .bia-anim.ativo {
	opacity: 1;
	transform: none;
}

@media (prefers-reduced-motion: reduce) {
	.bia-js .bia-anim {
		opacity: 1 !important;
		transform: none !important;
		transition: none !important;
	}
}

/* --------------------------------------------------------------- topo ----- */

.bia-topbar {
	background: var(--cor-fundo-creme, #f0ebe9);
	border-bottom: 1px solid var(--cor-linha-divisoria, #e0d7cd);
}

/* O padding calculado aqui é de propósito: a faixa creme sangra de ponta a ponta
   e só o conteúdo centraliza em 1280px. Só funciona porque este elemento não tem
   max-width — com max-width o padding cresce dentro da caixa e esmaga o conteúdo. */
.bia-topbar__inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 24px;
	flex-wrap: wrap;
	padding: 20px max(20px, calc((100% - 1280px) / 2));
}

.bia-topbar__logo img {
	display: block;
	width: auto;
	height: 56px;
}

.bia-nav__lista {
	display: flex;
	align-items: center;
	gap: clamp(16px, 2.5vw, 38px);
	margin: 0;
	padding: 0;
	list-style: none;
}

.bia-nav__lista a {
	font-family: var(--fonte-corpo, "Darker Grotesque"), sans-serif;
	font-size: 1.125rem;
	letter-spacing: .08em;
	text-transform: uppercase;
	text-decoration: none;
	color: var(--cor-texto-principal, #4f433b);
	transition: color 300ms;
}

.bia-nav__lista a:hover,
.bia-nav__lista a:focus-visible {
	color: var(--cor-eyebrow, #8d7963);
}

/* --------------------------------------------- cabeçalho das páginas ------ */

.bia-cabecalho {
	background: var(--cor-fundo-creme, #f0ebe9);
}

.bia-cabecalho__inner {
	padding-block: clamp(3rem, 7vw, 6rem) clamp(2.5rem, 5vw, 4rem);
	max-width: 940px; /* 900 de texto + a calha */
	margin-inline: auto;
}

.bia-eyebrow {
	margin: 0 0 1rem;
	font-family: var(--fonte-corpo, "Darker Grotesque"), sans-serif;
	font-size: .875rem;
	font-weight: 400;
	letter-spacing: .31em;
	text-transform: uppercase;
	color: var(--cor-eyebrow, #8d7963);
}

.bia-eyebrow--claro {
	color: var(--cor-texto-claro-suave, #e8e3df);
}

.bia-titulo {
	margin: 0;
	font-family: var(--fonte-titulo, "Cormorant Garamond"), serif;
	font-weight: 400;
	font-size: clamp(2.25rem, 5vw, 3.75rem);
	line-height: 1.2;
	color: #514841;
	text-wrap: balance;
}

.bia-cabecalho__texto {
	margin: 1.25rem 0 0;
	max-width: 620px;
	font-family: var(--fonte-corpo, "Darker Grotesque"), sans-serif;
	font-size: 1.25rem;
	line-height: 150%;
	color: var(--cor-texto-suave, rgba(81, 72, 65, .68));
}

/* -------------------------------------------------------------- cards ----- */

.bia-grid-posts {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 40px 32px;
	align-items: stretch;
}

@media (max-width: 1024px) {
	.bia-grid-posts {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 32px 24px;
	}
}

@media (max-width: 767px) {
	.bia-grid-posts {
		grid-template-columns: 1fr;
		gap: 28px;
	}
}

.bia-card {
	height: 100%;
	background: #fffdfd;
	border: 1px solid #e6dfd78f;
	border-radius: 10px;
	overflow: hidden;
	box-shadow: 0 6px 14px 0 #8f8f8f1a, 0 25px 25px 0 #8f8f8f17, 0 55px 33px 0 #8f8f8f0d, 0 98px 39px 0 #8f8f8f03;
	transition: transform 300ms, box-shadow 300ms;
}

.bia-card:hover,
.bia-card:focus-within {
	transform: translate3d(0, -5px, 0);
	box-shadow: 0 10px 18px 0 rgba(107, 107, 107, .18), 0 40px 40px 0 #8f8f8f14;
}

.bia-card__link {
	display: flex;
	flex-direction: column;
	height: 100%;
	text-decoration: none;
	color: inherit;
}

.bia-card__figura {
	aspect-ratio: 3 / 2;
	background: #e4ddd4;
	overflow: hidden;
}

.bia-card__figura img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.bia-card__figura--vazia {
	display: block;
	width: 100%;
	height: 100%;
	background: linear-gradient(135deg, #f6f2ee 0%, #e4ddd4 100%);
}

.bia-card__corpo {
	display: flex;
	flex-direction: column;
	gap: .75rem;
	padding: 1.75rem 1.75rem 2rem;
	flex: 1 1 auto;
}

.bia-card__data {
	margin: 0;
	font-size: .75rem;
}

.bia-card__titulo {
	margin: 0;
	font-family: var(--fonte-titulo, "Cormorant Garamond"), serif;
	font-weight: 400;
	font-size: 1.875rem;
	line-height: 130%;
	color: #514841;
}

.bia-card__resumo {
	margin: 0;
	font-family: var(--fonte-corpo, "Darker Grotesque"), sans-serif;
	font-size: 1.125rem;
	line-height: 150%;
	color: var(--cor-texto-suave, rgba(81, 72, 65, .68));
}

.bia-card__mais {
	margin-top: auto;
	padding-top: .5rem;
	font-family: var(--fonte-corpo, "Darker Grotesque"), sans-serif;
	font-size: .875rem;
	font-weight: 500;
	letter-spacing: .16em;
	text-transform: uppercase;
	color: var(--cor-eyebrow, #8d7963);
}

.bia-card__mais::after {
	content: " →";
	transition: margin 300ms;
}

.bia-card:hover .bia-card__mais::after {
	margin-inline-start: 4px;
}

/* ---------------------------------------------------------- paginação ----- */

.bia-paginacao {
	margin-top: 3.5rem;
}

.bia-paginacao .nav-links {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	gap: 8px;
}

.bia-paginacao .page-numbers {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 46px;
	padding: 10px 14px;
	border: 1px solid var(--cor-linha-divisoria, #e0d7cd);
	border-radius: 5px;
	font-family: var(--fonte-corpo, "Darker Grotesque"), sans-serif;
	font-size: 1.0625rem;
	text-decoration: none;
	color: var(--cor-texto-principal, #4f433b);
	transition: transform 300ms, box-shadow 300ms, background 300ms;
}

.bia-paginacao .page-numbers:hover {
	transform: translate3d(0, -3px, 0);
	box-shadow: 0 6px 12px 0 rgba(107, 107, 107, .13);
}

.bia-paginacao .page-numbers.current {
	background-image: linear-gradient(135deg, #f6f2ee 0%, #e9e1d7 100%);
	border-bottom: 3px solid var(--cor-borda-destaque, rgba(134, 121, 107, .56));
	font-weight: 500;
}

.bia-paginacao .dots {
	border-color: transparent;
}

/* --------------------------------------------------------------- post ----- */

.bia-main--post {
	padding-block-start: 3rem;
}

.bia-post__cabecalho {
	max-width: 860px; /* 820 de texto + a calha */
	margin-inline: auto;
	padding-block-end: 2rem;
	text-align: center;
}

.bia-post__cabecalho .bia-titulo {
	font-size: clamp(2rem, 4.2vw, 3.25rem);
}

.bia-post__meta {
	margin: 1.25rem 0 0;
	display: flex;
	justify-content: center;
	gap: 10px;
	font-family: var(--fonte-corpo, "Darker Grotesque"), sans-serif;
	font-size: 1rem;
	color: var(--cor-texto-suave, rgba(81, 72, 65, .68));
}

.bia-post__capa {
	margin: 0 auto 3rem;
	max-width: 1020px; /* 980 de imagem + a calha */
}

.bia-post__capa img {
	width: 100%;
	height: auto;
	border-radius: 10px;
	box-shadow: 0 5px 10px 0 rgba(97, 97, 97, .10), 0 18px 18px 0 rgba(97, 97, 97, .09), 0 41px 24px 0 rgba(97, 97, 97, .05);
}

.bia-post__capa figcaption {
	margin-top: .75rem;
	text-align: center;
	font-family: var(--fonte-corpo, "Darker Grotesque"), sans-serif;
	font-size: 1rem;
	color: var(--cor-texto-suave, rgba(81, 72, 65, .68));
}

/* ------------------------------------------------- texto do post/página --- */

.bia-prose {
	max-width: 800px; /* 760 de texto + a calha */
	margin-inline: auto;
	font-family: var(--fonte-corpo, "Darker Grotesque"), sans-serif;
	font-size: 1.25rem;
	line-height: 160%;
	color: var(--cor-texto-principal, #4f433b);
}

.bia-prose > * + * {
	margin-block-start: 1.5rem;
}

.bia-prose h2,
.bia-prose h3,
.bia-prose h4 {
	font-family: var(--fonte-titulo, "Cormorant Garamond"), serif;
	font-weight: 400;
	line-height: 130%;
	color: #514841;
	margin-block-start: 3rem;
	margin-block-end: 0;
}

.bia-prose h2 { font-size: 2.5rem; }
.bia-prose h3 { font-size: 1.875rem; }
.bia-prose h4 { font-size: 1.5rem; }

.bia-prose a {
	color: var(--cor-texto-principal, #4f433b);
	text-decoration: underline;
	text-decoration-color: var(--cor-eyebrow, #8d7963);
	text-underline-offset: 3px;
}

.bia-prose a:hover {
	color: var(--cor-eyebrow, #8d7963);
}

.bia-prose strong { font-weight: 600; }

.bia-prose ul,
.bia-prose ol {
	padding-inline-start: 1.25rem;
}

.bia-prose li + li {
	margin-block-start: .5rem;
}

.bia-prose ul {
	list-style: none;
	padding-inline-start: 0;
}

.bia-prose ul > li {
	position: relative;
	padding-inline-start: 1.5rem;
}

.bia-prose ul > li::before {
	content: "–";
	position: absolute;
	inset-inline-start: 0;
	color: var(--cor-eyebrow, #8d7963);
}

.bia-prose blockquote {
	margin-inline: 0;
	padding: .5rem 0 .5rem 1.75rem;
	border-inline-start: 2px solid var(--cor-linha-divisoria, #e0d7cd);
	font-family: var(--fonte-titulo, "Cormorant Garamond"), serif;
	font-style: italic;
	font-size: 1.875rem;
	line-height: 130%;
	color: #514841;
}

.bia-prose img,
.bia-prose iframe,
.bia-prose video {
	max-width: 100%;
	height: auto;
	border-radius: 10px;
}

.bia-prose figcaption {
	margin-top: .5rem;
	font-size: 1rem;
	color: var(--cor-texto-suave, rgba(81, 72, 65, .68));
}

.bia-prose hr {
	border: 0;
	border-top: 1px solid var(--cor-linha-divisoria, #e0d7cd);
	margin-block: 3rem;
}

.bia-prose table {
	width: 100%;
	border-collapse: collapse;
	font-size: 1.125rem;
}

.bia-prose th,
.bia-prose td {
	padding: .75rem 1rem;
	border-bottom: 1px solid var(--cor-linha-divisoria, #e0d7cd);
	text-align: start;
}

/* --------------------------------------------------- rodapé do post ------- */

.bia-post__rodape {
	max-width: 800px; /* 760 de texto + a calha */
	margin: 3.5rem auto 0;
}

.bia-tags {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin: 0 0 2rem;
}

.bia-tags a {
	padding: 6px 14px;
	border: 1px solid var(--cor-linha-divisoria, #e0d7cd);
	border-radius: 9999px;
	font-family: var(--fonte-corpo, "Darker Grotesque"), sans-serif;
	font-size: .9375rem;
	text-decoration: none;
	color: var(--cor-texto-suave, rgba(81, 72, 65, .68));
	transition: color 300ms, border-color 300ms;
}

.bia-tags a:hover {
	color: var(--cor-eyebrow, #8d7963);
	border-color: var(--cor-eyebrow, #8d7963);
}

.bia-aviso {
	margin: 0;
	padding: 1.25rem 1.5rem;
	background: var(--cor-fundo-creme, #f0ebe9);
	border-radius: 10px;
	font-family: var(--fonte-corpo, "Darker Grotesque"), sans-serif;
	font-size: 1rem;
	line-height: 150%;
	color: var(--cor-texto-suave, rgba(81, 72, 65, .68));
}

/* ------------------------------------------------------- relacionados ----- */

.bia-relacionados {
	margin-top: 5rem;
	padding-block: 4rem;
	background: #fbf9f9;
	border-top: 1px solid var(--cor-linha-divisoria, #e0d7cd);
}

.bia-relacionados .bia-eyebrow {
	margin-bottom: 2rem;
}

/* -------------------------------------------------------------- busca ----- */

.bia-busca {
	display: flex;
	gap: 10px;
	flex-wrap: wrap;
	max-width: 620px;
}

.bia-busca__campo {
	flex: 1 1 240px;
	padding: 14px 18px;
	border: 1px solid var(--cor-linha-divisoria, #e0d7cd);
	border-radius: 5px;
	background: #fffdfd;
	font-family: var(--fonte-corpo, "Darker Grotesque"), sans-serif;
	font-size: 1.125rem;
	color: var(--cor-texto-principal, #4f433b);
}

.bia-busca__campo:focus-visible {
	outline: 2px solid var(--cor-eyebrow, #8d7963);
	outline-offset: 2px;
}

.bia-busca__botao {
	padding: 14px 28px;
	border: 0;
	border-bottom: 3px solid var(--cor-borda-destaque, rgba(134, 121, 107, .56));
	border-radius: 5px;
	background-image: linear-gradient(135deg, #f6f2ee 0%, #e9e1d7 100%);
	box-shadow: 0 6px 12px 0 rgba(107, 107, 107, .13);
	font-family: var(--fonte-corpo, "Darker Grotesque"), sans-serif;
	font-size: 1.125rem;
	font-weight: 500;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: var(--cor-texto-principal, #4f433b);
	cursor: pointer;
	transition: transform 300ms, box-shadow 300ms;
}

.bia-busca__botao:hover,
.bia-busca__botao:focus-visible {
	transform: translate3d(0, -3px, 0);
	box-shadow: 0 10px 18px 0 rgba(107, 107, 107, .18);
}

.bia-busca-topo {
	margin-bottom: 3rem;
}

/* -------------------------------------------------------------- botão ----- */

.bia-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: fit-content;
	padding: 20px 48px;
	border: 0;
	border-bottom: 3px solid var(--cor-borda-destaque, rgba(134, 121, 107, .56));
	border-radius: 5px;
	background-image: linear-gradient(135deg, #eae3dc 0%, #c9bcad 100%);
	box-shadow: 0 6px 12px 0 rgba(107, 107, 107, .13);
	font-family: var(--fonte-corpo, "Darker Grotesque"), sans-serif;
	font-size: 1.375rem;
	font-weight: 500;
	letter-spacing: .04em;
	text-transform: uppercase;
	text-decoration: none;
	color: var(--cor-texto-principal, #4f433b);
	cursor: pointer;
	transition: transform 300ms, box-shadow 300ms;
}

.bia-btn:hover,
.bia-btn:focus-visible {
	transform: translate3d(0, -5px, 0);
	box-shadow: 0 10px 18px 0 rgba(107, 107, 107, .18);
	color: var(--cor-texto-principal, #4f433b);
}

.bia-link {
	font-family: var(--fonte-corpo, "Darker Grotesque"), sans-serif;
	font-size: 1.125rem;
	color: var(--cor-eyebrow, #8d7963);
	text-underline-offset: 3px;
}

/* ------------------------------------------------------ estado vazio ------ */

.bia-vazio {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 2rem;
	max-width: 660px; /* 620 de texto + a calha */
	margin-inline: auto;
}

.bia-vazio__texto {
	margin: 0;
	font-family: var(--fonte-corpo, "Darker Grotesque"), sans-serif;
	font-size: 1.25rem;
	line-height: 150%;
	color: var(--cor-texto-suave, rgba(81, 72, 65, .68));
}

.bia-vazio__acoes {
	display: flex;
	align-items: center;
	gap: 1.5rem;
	flex-wrap: wrap;
}

/* ------------------------------------------------------- chamada final ---- */

.bia-cta {
	background: var(--cor-fundo-escuro-1, #6c5f58);
	color: var(--cor-texto-claro, #fbf9f9);
}

.bia-cta__inner {
	padding-block: clamp(3.5rem, 7vw, 5.5rem);
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	gap: 1.25rem;
}

.bia-cta__titulo {
	margin: 0;
	max-width: 760px;
	font-family: var(--fonte-titulo, "Cormorant Garamond"), serif;
	font-weight: 400;
	font-size: clamp(1.875rem, 3.6vw, 3rem);
	line-height: 130%;
	color: var(--cor-texto-claro, #fbf9f9);
}

.bia-cta__texto {
	margin: 0;
	max-width: 560px;
	font-family: var(--fonte-corpo, "Darker Grotesque"), sans-serif;
	font-size: 1.125rem;
	line-height: 150%;
	color: var(--cor-texto-claro-suave, #e8e3df);
}

.bia-cta .bia-btn {
	margin-top: .75rem;
}

/* -------------------------------------------------------- comentários ----- */

.bia-comentarios {
	max-width: 760px;
	margin: 4rem auto 0;
	padding-top: 3rem;
	border-top: 1px solid var(--cor-linha-divisoria, #e0d7cd);
	font-family: var(--fonte-corpo, "Darker Grotesque"), sans-serif;
	font-size: 1.125rem;
	line-height: 150%;
	color: var(--cor-texto-principal, #4f433b);
}

.bia-comentarios__lista,
.bia-comentarios__lista .children {
	list-style: none;
	margin: 0;
	padding: 0;
}

.bia-comentarios__lista .children {
	margin-inline-start: 1.5rem;
	padding-inline-start: 1.5rem;
	border-inline-start: 1px solid var(--cor-linha-divisoria, #e0d7cd);
}

.bia-comentarios__lista li {
	margin-block: 1.75rem;
}

.bia-comentarios__lista .comment-author img {
	border-radius: 9999px;
	vertical-align: middle;
	margin-inline-end: .5rem;
}

.bia-comentarios__titulo {
	margin: 2.5rem 0 1rem;
	font-family: var(--fonte-titulo, "Cormorant Garamond"), serif;
	font-size: 1.875rem;
	color: #514841;
}

.bia-comentarios input[type="text"],
.bia-comentarios input[type="email"],
.bia-comentarios input[type="url"],
.bia-comentarios textarea {
	width: 100%;
	max-width: 100%;
	padding: 12px 16px;
	border: 1px solid var(--cor-linha-divisoria, #e0d7cd);
	border-radius: 5px;
	background: #fffdfd;
	font-family: inherit;
	font-size: 1.0625rem;
	color: inherit;
}

.bia-comentarios .comment-form-cookies-consent {
	display: flex;
	align-items: center;
	gap: .5rem;
	font-size: 1rem;
}

/* ------------------------------------------------ artigos do blog na home --- */
/* Fica entre o FAQ e o CTA final, os dois com foto de fundo. O fundo claro e
   sólido aqui serve de respiro entre eles — é o mesmo das seções de conteúdo
   da home (Sobre, Atendimento, Depoimentos). */

.bia-home-blog {
	background: #fffdfd;
	padding-block: clamp(4rem, 8vw, 7.5rem);
}

/* Alinhamento com as seções vizinhas da home, que têm calha de 48px e assentam
   numa coluna de 1168px acima de 1280 de tela. Sem isto a seção usaria os 1280 e a
   calha de 20px do blog, e nasceria mais larga que o resto da home no desktop. */
@media (min-width: 768px) {
	.bia-home-blog .bia-container {
		max-width: 1264px; /* 1168 de conteúdo + 48px de calha de cada lado */
		padding-inline: 48px;
	}
}

.bia-home-blog__cabecalho {
	max-width: 900px;
	margin: 0 auto clamp(2.5rem, 5vw, 4rem);
	text-align: center;
}

/* Na home os títulos de seção respiram um pouco mais que no blog. */
.bia-home-blog .bia-titulo {
	line-height: 1.3;
}

.bia-home-blog__cabecalho .bia-cabecalho__texto {
	margin-inline: auto;
}

.bia-home-blog__rodape {
	display: flex;
	justify-content: center;
	margin-top: clamp(2.5rem, 5vw, 4rem);
}
