/*
Theme Name: Cobra
Author: Cristian Cobra
Description: Tema de blocos do site Cristian Cobra (teste sem Divi). Paleta café e Open Sans no theme.json.
Version: 0.2.4
Requires at least: 6.6
Requires PHP: 8.1
Text Domain: cobra
*/

/* ---------- Cabeçalho ---------- */
.cabecalho {
	position: sticky;
	top: 0;
	z-index: 100;
	transition: background-color .25s ease, box-shadow .25s ease;
}
.admin-bar .cabecalho { top: 32px; }
.cabecalho .logo img { height: 46px; width: auto; display: block; }
.cabecalho .logo .logo-claro { display: none; }
.cabecalho .wp-block-navigation { font-weight: 600; font-size: 14px; }
.cabecalho .current-menu-item > a { color: var(--wp--preset--color--folha); }

/* Na home o cabeçalho fica por cima do vídeo, transparente e com texto claro;
   ao rolar (classe .rolou, via assets/js/cabecalho.js) volta a ser Papel. */
.home .cabecalho {
	position: fixed;
	left: 0;
	right: 0;
	background-color: transparent !important;
}
.home .cabecalho:not(.rolou) .wp-block-navigation,
.home .cabecalho:not(.rolou) .wp-block-navigation a { color: var(--wp--preset--color--papel); }
.home .cabecalho:not(.rolou) .current-menu-item > a { color: var(--wp--preset--color--crema); }
.home .cabecalho:not(.rolou) .wp-block-navigation__responsive-container-open { color: var(--wp--preset--color--papel); }
.home .cabecalho:not(.rolou) .logo .logo-claro { display: block; }
.home .cabecalho:not(.rolou) .logo .logo-normal { display: none; }
.home .cabecalho.rolou {
	background-color: var(--wp--preset--color--papel) !important;
	box-shadow: 0 1px 0 rgba(43, 29, 22, .12);
}

/* ---------- Hero da home ---------- */
.hero { min-height: 760px; }
.hero .foto img { border-radius: 50%; aspect-ratio: 1; object-fit: cover; }
/* Ícones nas cores que o site atual usa, quadrados */
.hero .redes .wp-social-link { border-radius: 4px; }
.hero .redes .wp-social-link a { padding: 7px; }
.hero .redes .wp-social-link-facebook { background-color: #3b5998; }
.hero .redes .wp-social-link-instagram { background-color: #ea2c59; }
.hero .redes .wp-social-link-youtube { background-color: #a82400; }

/* Capas: mesma altura para todas, grade 2x2 também no celular */
.capas { align-items: start; }
.capa { text-align: center; }
.capa .wp-block-image img {
	height: 180px;
	width: auto;
	max-width: 100%;
	object-fit: contain;
	box-shadow: 0 10px 24px rgba(0, 0, 0, .45);
	transition: transform .2s ease, box-shadow .2s ease;
}
.capa:hover img { transform: translateY(-6px); box-shadow: 0 16px 30px rgba(0, 0, 0, .6); }
.capa h3 a { color: var(--wp--preset--color--papel); }
.capa:hover h3 a { color: var(--wp--preset--color--crema); text-decoration: none; }
.capa .dados { color: var(--wp--preset--color--crema); font-size: 12px; font-weight: 600; letter-spacing: 1px; text-transform: uppercase; }

@media (max-width: 781px) {
	.hero { min-height: 0; padding-top: 110px !important; }
	.hero .foto img { width: 220px !important; }
	.capas { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
	.capa .wp-block-image img { height: 130px; }
	.capa h3 { font-size: 14px !important; }
}

/* ---------- Últimos textos ---------- */
.cartao {
	background: var(--wp--preset--color--branco);
	height: 100%;
	box-shadow: 0 1px 3px rgba(43, 29, 22, .12);
}
.cartao .wp-block-post-featured-image { margin: 0; }
.cartao .wp-block-post-featured-image img { aspect-ratio: 16 / 10; object-fit: cover; width: 100%; }
.cartao .wp-block-post-excerpt { font-size: 14px; color: #4a3a31; }

/* ---------- Rodapé ---------- */
.rodape a { color: var(--wp--preset--color--papel); }
.rodape .wp-social-link { color: var(--wp--preset--color--cafe-com-leite); }

/* Sem espaço entre cabeçalho, conteúdo e rodapé (o blockGap do tema é para dentro das seções) */
.wp-site-blocks > * + * { margin-block-start: 0; }


/* ---------- Ícones (Font Awesome Free, mesma fonte que o Divi usava) ---------- */
@font-face { font-family: "FA"; font-weight: 900; font-display: block; src: url(assets/fonts/fa-solid-900.woff2) format("woff2"); }
@font-face { font-family: "FA Brands"; font-weight: 400; font-display: block; src: url(assets/fonts/fa-brands-400.woff2) format("woff2"); }
.icone { display: block; text-align: center; font-family: "FA"; font-weight: 900; font-size: 72px; line-height: 1; }
.icone.folha { color: var(--wp--preset--color--folha); font-size: 40px; }

/* ---------- Partes comuns das páginas ---------- */
.faixa h1 { color: var(--wp--preset--color--papel); font-size: 44px; margin: 0; }
.faixa .faixa-sub { font-size: 18px; margin-top: 4px; }
.livro img, .capa-livro img { box-shadow: 0 2px 18px rgba(0, 0, 0, .3); }
.livro img { max-width: 300px; width: 100%; display: block; margin: 0 auto; }
.livro-colunas { gap: 4% !important; }
.livro-colunas h2 { font-size: 30px; }
.livro-colunas p { font-size: 17px; }
.botoes-livro { flex-direction: column; align-items: flex-start; gap: 10px; margin-top: 30px; }
.livro-hero img { width: 100%; }

.wp-block-button.is-style-outline > .wp-block-button__link {
	background: transparent; color: var(--wp--preset--color--torra);
	border: 2px solid var(--wp--preset--color--torra); padding: 8px 18px;
}
.wp-block-button.is-style-outline > .wp-block-button__link:hover { background: var(--wp--preset--color--torra); color: var(--wp--preset--color--papel); }
.wp-block-button.contorno-claro > .wp-block-button__link { color: var(--wp--preset--color--papel); border-color: var(--wp--preset--color--papel); }
.wp-block-button.contorno-claro > .wp-block-button__link:hover { background: var(--wp--preset--color--papel); color: var(--wp--preset--color--espresso); }

/* Meus livros: cartões em 2 colunas */
.livros-grade { align-items: stretch; }
.cartao-livro { display: flex; flex-direction: column; }
.cartao-livro .capa-livro img { height: 280px; width: auto; max-width: 100%; object-fit: contain; }
.cartao-livro h2 { font-size: 30px; }
.cartao-livro p { font-size: 17px; }
.cartao-livro .wp-block-buttons { margin-top: auto; padding-top: 10px; }

/* Biografia */
.foto-redonda img { border-radius: 50%; aspect-ratio: 1; object-fit: cover; }
.bio p { font-size: 14px; }
.bio h1 { font-size: 30px; font-weight: 500; }
.bio h2 { font-size: 26px; font-weight: 500; margin-top: 2em; }

/* Sites */
.sites-hero { background-image: url(/wp-content/uploads/2026/10/doodle-tech.png); background-repeat: repeat; background-size: initial; }
.sites-hero h1 { color: var(--wp--preset--color--folha); font-size: clamp(40px, 5vw, 56px); font-weight: 700; line-height: 1.1; margin-top: 0; }
.sites-hero h2 { color: var(--wp--preset--color--torra); font-size: clamp(24px, 3vw, 32px); font-weight: 500; margin-bottom: 0; }
.sites-hero h3 { color: var(--wp--preset--color--folha); font-size: 22px; font-weight: 500; }
.botao-whatsapp .wp-block-button__link { font-size: 18px; font-weight: 600; border-radius: 12px; padding: 12px 22px; box-shadow: 0 6px 16px rgba(0, 0, 0, .2); }
.botao-whatsapp .wp-block-button__link::before { content: "\f232"; font-family: "FA Brands"; font-weight: 400; margin-right: 8px; }
.redes-sites .wp-social-link { background-color: var(--wp--preset--color--folha) !important; color: #fff !important; border-radius: 3px; }
.redes-sites .wp-social-link a { padding: 6px; }
.servicos-verdes { clip-path: polygon(0 110px, 100% 0, 100% 100%, 0 100%); margin-top: -110px !important; padding-top: 150px !important; }
.servicos-verdes h2 { color: #fff; font-size: 18px; font-weight: 500; margin: 14px 0 6px; }
.servicos-verdes p { font-size: 15px; line-height: 1.6; color: #fff; }
.print-site img { border: 2px solid var(--wp--preset--color--folha); border-radius: 10px; width: 100%; }
.trabalho h3 { color: var(--wp--preset--color--folha); font-size: 20px; font-weight: 700; margin: 14px 0 4px; }
.trabalho p { font-size: 14px; }
.experiencia .icone { font-size: 64px; color: #fff; }
.experiencia h2 { color: #fff; font-size: 36px; font-weight: 500; }
.experiencia a { color: #fff; font-size: 20px; }
.cc-whatsapp-float img { max-width: none; }

/* Editoração */
.abertura .kicker { color: var(--wp--preset--color--crema); font-size: 14px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; margin-bottom: 0; }
.abertura .faixa-sub { max-width: 760px; }
.abertura .wp-block-buttons { margin-top: 24px; }
.servico h3 { font-size: 20px; margin: 14px 0 6px; }
.servico p { font-size: 15px; }
.kicker-folha { color: var(--wp--preset--color--folha); font-size: 15px; letter-spacing: 2px; text-transform: uppercase; margin-top: 40px; }
.obra img { height: 240px; width: auto; max-width: 100%; object-fit: contain; box-shadow: 0 8px 20px rgba(43, 29, 22, .25); }
.obra h4 { font-size: 16px; margin: 14px 0 4px; }
.obra p { font-size: 14px; line-height: 1.6; }
.chamada h2 { color: var(--wp--preset--color--papel); font-size: 36px; }
.chamada p { font-size: 18px; }

/* ---------- Blog: lista, barra lateral e post ---------- */
.com-barra { gap: 0 !important; }
.com-barra > .wp-block-column:first-child { padding-right: 5.5%; }
.com-barra > .wp-block-column:last-child { border-left: 1px solid rgba(43, 29, 22, .1); padding-left: 30px; }
.titulo-pagina { font-size: 26px; font-weight: 500; }
.barra-lateral h4 { font-size: 18px; font-weight: 500; margin: 0 0 12px; }
.barra-lateral ul { list-style: none; padding: 0; margin: 0 0 40px; font-size: 14px; }
.barra-lateral li { margin-bottom: 8px; line-height: 1.5; }
.barra-lateral .wp-block-latest-comments { font-size: 14px; margin-bottom: 40px; }
.post-item { margin-bottom: 50px !important; gap: 30px !important; }
.post-item h2 { font-size: 26px; font-weight: 400; margin: 0 0 6px; }
.post-item h2 a { color: var(--wp--preset--color--torra); }
.post-meta { font-size: 14px; margin-bottom: 10px; }
.post-meta > *, .post-meta .wp-block-post-date { font-size: 14px; color: var(--wp--preset--color--espresso); margin: 0; }
.post-meta a { color: var(--wp--preset--color--folha); }
.post-item .wp-block-post-excerpt { font-size: 14px; }
.post-item .wp-block-post-excerpt__more-text { display: none; }
.post-cabecalho h1 { color: var(--wp--preset--color--papel); font-size: 40px; margin: 0; }
.post-dados { font-size: 13px; font-weight: 600; letter-spacing: 1px; text-transform: uppercase; color: var(--wp--preset--color--crema); margin-top: 10px; }
.post-dados > *, .post-dados .wp-block-post-date, .post-dados a { color: var(--wp--preset--color--crema); font-size: 13px; margin: 0; }
.post-destaque { margin-bottom: 30px; }
.post-destaque img { width: auto !important; max-width: 100%; max-height: 520px; margin: 0 auto; display: block; }
.post-conteudo { font-size: 17px; line-height: 1.8; }
.post-navegacao { font-size: 14px; margin: 20px 0; }

@media (max-width: 781px) {
	.faixa h1 { font-size: 34px; }
	.livros-grade, .servicos-grade, .obras-grade.obras-destaque { grid-template-columns: 1fr !important; }
	.obras-grade, .portfolio-grade, .servicos-grade-sites { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
	.servicos-grade-sites { grid-template-columns: 1fr !important; }
	.obra img { height: 190px; }
	.cartao-livro .capa-livro img { height: 250px; }
	.botoes-livro { align-items: center; }
	.livro-colunas h2 { text-align: center; }
	.com-barra > .wp-block-column:first-child { padding-right: 0; }
	.com-barra > .wp-block-column:last-child { border-left: 0; padding-left: 0; }
	.servicos-verdes { clip-path: polygon(0 50px, 100% 0, 100% 100%, 0 100%); margin-top: -50px !important; padding-top: 90px !important; }
}
@media (min-width: 782px) and (max-width: 1100px) {
	.servicos-grade-sites { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
	.portfolio-grade { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
}

/* Ajustes da comparação com o Divi */
/* Parágrafo mais estreito que a faixa, mas começando na mesma linha do título */
.abertura .faixa-sub { margin-left: max(0px, calc((100% - 1080px) / 2)) !important; }
.icone.folha { font-size: 56px; }
.com-barra .wp-block-post-content { font-size: 14px; }
.com-barra .wp-block-post-content h2 { font-size: 26px; font-weight: 400; margin: 1.2em 0 .4em; }
.com-barra .wp-block-post-content .wp-block-columns { gap: 40px; }
.com-barra .wp-block-post-content .wp-block-column { flex: 1 1 0; }
/* Citações: a barra verde só nas que têm texto (o conteúdo antigo tem citações aninhadas e vazias) */
.com-barra .wp-block-quote { border: 0; padding: 0; margin: 0; font-size: 13px; }
.com-barra .wp-block-quote:has(> p) { border-left: 5px solid var(--wp--preset--color--folha); padding-left: 20px; margin-bottom: 20px; }
.com-barra .wp-block-quote:not(:has(p)) { display: none; }

/* Editoração: grades centralizadas. Com número ímpar de itens (5 serviços, 3 obras),
   a última linha fica no meio em vez de encostada à esquerda; a largura do item é sempre a mesma. */
.servicos-grade, .obras-grade { display: flex !important; flex-wrap: wrap; justify-content: center; }
.servicos-grade > .servico { flex: 0 0 calc((100% - 80px) / 3); }
.obras-grade > .obra { flex: 0 0 calc((100% - 72px) / 4); }
.obras-grade.obras-destaque > .obra { flex: 0 0 calc((100% - 24px) / 2); }
.secao-editoracao > h2 { font-size: clamp(30px, 3.6vw, 40px); margin-bottom: 60px; }
.kicker-folha { font-size: 18px; margin-top: 110px; margin-bottom: 36px; }
.secao-editoracao > .kicker-folha:first-of-type { margin-top: 0; }
@media (max-width: 781px) {
	.servicos-grade > .servico, .obras-grade.obras-destaque > .obra { flex-basis: 100%; }
	.obras-grade > .obra { flex-basis: calc((100% - 24px) / 2); }
}
.chamada .wp-block-buttons { gap: 16px; margin-top: 30px; }