/*
Theme Name: Abdo & Cabral
Theme URI: https://abdoecabral.com.br
Author: Abdo & Cabral Dev
Author URI: https://abdoecabral.com.br
Description: Block theme (FSE) da Abdo & Cabral Empreendimentos — design "Arquitetura do Silêncio". Todo o conteúdo é editável pelo editor de blocos; empreendimentos e obras são custom post types com importação via CSV.
Version: 1.0.0
Requires at least: 6.7
Tested up to: 7.0
Requires PHP: 8.2
License: GPL-2.0-or-later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: abdocabral
Tags: block-patterns, full-site-editing, custom-colors, editor-style
*/

/* ==========================================================================
   PONTE WP ⇄ DESIGN SYSTEM
   O design vive em assets/css/theme.css (mesmo CSS do site estático).
   Este arquivo só adapta as classes que os blocos do core geram.
   ========================================================================== */

/* ---- Reset de figuras/listas geradas por blocos ------------------------- */
.wp-block-image { margin: 0; }
.wp-block-image img { height: auto; }
figure { margin: 0; }
ul.wp-block-list { list-style: none; padding: 0; margin: 0; }

/* ---- Grupos usados como <main> ------------------------------------------ */
main.site-main { display: block; }

/* ---- Header ------------------------------------------------------------- */
header.site-header { position: fixed; }
/* Logo vertical/badge: manda a altura (não a largura). Maior + teto de largura
   pra um wordmark horizontal não estourar. Ajuste fino: mexa só nestes valores. */
.site-header .wp-block-site-logo,
.site-header .wp-block-site-logo a { display: flex; align-items: center; }
.site-header .wp-block-site-logo img {
  height: clamp(48px, 5vw, 62px);
  width: auto;
  max-width: 170px;
  object-fit: contain;
  transition: height .5s var(--ease);
}
.site-header.is-solid .wp-block-site-logo img { height: clamp(40px, 4vw, 48px); }

/* Navegação (core/navigation) herda o visual do .nav */
.site-header .wp-block-navigation a {
  font-family: var(--font-head);
  font-size: .68rem;
  font-weight: 500;
  letter-spacing: .2em;
  text-transform: uppercase;
  opacity: .82;
  transition: opacity .3s;
}
.site-header .wp-block-navigation a:hover { opacity: 1; }
.site-header .wp-block-navigation .wp-block-navigation__container { gap: clamp(1.4rem, 2.6vw, 3rem); }

/* Overlay mobile do core/navigation */
.wp-block-navigation__responsive-container.has-modal-open {
  background: rgba(29, 29, 27, .97);
}
.wp-block-navigation__responsive-container.has-modal-open a {
  font-size: 1.15rem;
  opacity: 1;
  color: var(--on-dark);
}
.wp-block-navigation__responsive-container-open,
.wp-block-navigation__responsive-container-close {
  color: currentColor;
}

/* Colapso do menu no mesmo breakpoint do design (900px, não os 600px do core) */
@media (max-width: 900px) {
  header.site-header .wp-block-navigation__responsive-container-open:not(.always-shown) { display: flex; }
  header.site-header .wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open) { display: none; }
  header.site-header .header-cta-wrap { display: none; }
}

/* ---- Botões (core/button) recebem as peles do design --------------------- */
.wp-block-button .wp-block-button__link {
  border-radius: 0;
  font-family: var(--font-head);
  font-size: .7rem;
  font-weight: 600;
  letter-spacing: .2em;
  text-transform: uppercase;
  padding: 1rem 1.9rem;
  transition: background .4s var(--ease), border-color .4s, color .4s, transform .4s var(--ease);
}
.wp-block-button.btn-gold .wp-block-button__link {
  background: var(--gold);
  color: var(--dark);
  border: 1px solid var(--gold);
}
.wp-block-button.btn-gold .wp-block-button__link:hover {
  background: var(--gold-lt);
  border-color: var(--gold-lt);
  transform: translateY(-2px);
}
.wp-block-button.btn-glass .wp-block-button__link {
  color: var(--on-dark);
  border: 1px solid rgba(237, 237, 232, .4);
  background: rgba(237, 237, 232, .08);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}
.wp-block-button.btn-glass .wp-block-button__link:hover {
  background: rgba(237, 237, 232, .18);
  border-color: rgba(237, 237, 232, .75);
  transform: translateY(-2px);
}
.wp-block-button.btn-dark .wp-block-button__link {
  background: var(--dark);
  color: var(--on-dark);
  border: 1px solid var(--dark);
}
.wp-block-button.btn-dark .wp-block-button__link:hover {
  background: var(--gold);
  border-color: var(--gold);
  color: var(--dark);
}
.wp-block-button.btn-outline-dark .wp-block-button__link {
  background: transparent;
  color: inherit;
  border: 1px solid var(--ink);
}
.wp-block-button.btn-outline-dark .wp-block-button__link:hover {
  background: var(--ink);
  color: var(--on-dark);
}
.wp-block-button.header-cta .wp-block-button__link {
  font-size: .66rem;
  padding: .62rem 1.4rem;
  background: var(--gold);
  color: var(--dark);
  border: 1px solid var(--gold);
}
.wp-block-button.header-cta .wp-block-button__link:hover {
  background: transparent;
  color: var(--on-dark);
  border-color: currentColor;
}

/* Fix "caixa dupla" no hover: no site estático estas classes eram o próprio <a>
   e ganharam fundo/borda/padding no theme.css. No WP elas viram o WRAPPER e a
   pele real fica no .wp-block-button__link (acima) → dois fundos/duas bordas.
   Zera só o box do wrapper; layout (flex/gap p/ o ícone-seta) permanece. */
.wp-block-button.btn-gold,
.wp-block-button.btn-glass,
.wp-block-button.btn-dark,
.wp-block-button.btn-outline-dark,
.wp-block-button.header-cta {
  background: none;
  border: 0;
  padding: 0;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}

/* ---- Hero / page-hero com blocos ----------------------------------------- */
.hero .hero__media .wp-block-image,
.page-hero .page-hero__media .wp-block-image { position: absolute; inset: 0; }
.hero .hero__media img,
.page-hero .page-hero__media img { width: 100%; height: 100%; object-fit: cover; }
.hero__title { max-width: 22ch; }

/* ---- Linhas de ficha / notas / fases (grupos + parágrafos) ---------------- */
.spec__row p, .note p, .phase__head p, .stat p, .footer-bottom p { margin: 0; }
.spec .spec__row { display: flex; justify-content: space-between; gap: 1rem; }
.notes .note { display: flex; }
.stat { display: flex; }

/* ---- Cards de query (empreendimentos/obras/blog) -------------------------- */
.cards.wp-block-post-template,
.journal-grid.wp-block-post-template { padding: 0; margin: 0; list-style: none; }
.cards .wp-block-post { display: block; }
.cards .wp-block-post-featured-image {
  position: relative;
  overflow: hidden;
  aspect-ratio: 3/4;
  margin: 0;
}
.cards .wp-block-post-featured-image a,
.cards .wp-block-post-featured-image img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.cards .wp-block-post .taxonomy-status-empreendimento,
.cards .wp-block-post .taxonomy-status-obra {
  display: inline-block;
  font-family: var(--font-head);
  font-size: .58rem;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: var(--gold);
  margin-top: 1rem;
}
.cards .wp-block-post .wp-block-post-title {
  font-family: var(--font-display);
  font-size: clamp(1.3rem, 2vw, 1.7rem);
  line-height: 1.1;
  margin: .3rem 0 0;
}
.cards .wp-block-post .wp-block-post-excerpt,
.cards .wp-block-post .wp-block-post-excerpt p {
  font-size: .78rem;
  color: var(--ink-mute);
  margin: .2rem 0 0;
}
.section--dark .cards .wp-block-post-title,
.htl-section .cards .wp-block-post-title { color: var(--on-dark); }

/* Blog (journal) via query */
.journal-grid .wp-block-post-featured-image {
  aspect-ratio: 3/2;
  overflow: hidden;
  margin: 0 0 clamp(1.4rem, 2vw, 1.8rem);
}
.journal-grid .wp-block-post-featured-image a,
.journal-grid .wp-block-post-featured-image img {
  display: block; width: 100%; height: 100%; object-fit: cover;
}
.journal-grid .wp-block-post-terms,
.journal-grid .wp-block-post-date {
  font-family: var(--font-head);
  font-size: .58rem;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--gold);
}
.journal-grid .wp-block-post-title {
  font-family: var(--font-display);
  font-size: 1.35rem;
  line-height: 1.15;
  margin: .5rem 0;
}
.journal-grid .wp-block-post-excerpt p {
  font-size: .9rem;
  color: var(--ink-soft);
  margin: 0;
}

/* Post individual (blog) */
.page-hero .wp-block-post-title { font-size: clamp(2.2rem, 6vw, 4.6rem); max-width: 20ch; margin: 1rem 0 .8rem; }
.page-hero .wp-block-post-terms, .page-hero .wp-block-post-date {
  font-family: var(--font-head);
  font-size: .62rem;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--gold-lt);
}
.article-body { max-width: 760px; }
.article-body h2 { font-size: 1.7rem; margin: 2.4rem 0 .8rem; }
.article-body p { color: var(--ink-soft); margin-bottom: 1.2rem; }
.article-body blockquote {
  border-left: 2px solid var(--gold);
  padding-left: 1.4rem;
  margin: 2rem 0;
  font-family: var(--font-display);
  font-size: 1.4rem;
  line-height: 1.4;
}
.article-body blockquote p { color: inherit; }

/* ---- Galerias (grupo .gallery com blocos de imagem) ----------------------- */
.gallery .wp-block-image { overflow: hidden; aspect-ratio: 4/3; }
.gallery .wp-block-image a { display: block; width: 100%; height: 100%; }
.gallery .wp-block-image img { width: 100%; height: 100%; object-fit: cover; }
/* Plantas: o card branco quadrado fica no link, não na figure — senão o
   overflow:hidden da figure corta a legenda (figcaption). */
.gallery--plantas .wp-block-image { aspect-ratio: auto; overflow: visible; }
.gallery--plantas .wp-block-image a { aspect-ratio: 1/1; height: auto; overflow: hidden; background: #fff; }
.gallery--plantas .wp-block-image img { object-fit: contain; padding: 1.5rem; }

/* ---- Rodapé ---------------------------------------------------------------- */
.site-footer ul { list-style: none; padding: 0; margin: 0; }
.footer-cols .wp-block-heading {
  font-family: var(--font-head);
  font-size: .6rem;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: var(--on-dark-mute);
  font-weight: 600;
  margin-bottom: 1.2rem;
}
.footer-contact li, .footer-contact a { font-family: var(--font-head); font-size: .82rem; color: var(--on-dark-soft); }
.footer-cols li a { font-family: var(--font-head); font-size: .82rem; color: var(--on-dark-soft); transition: color .3s; }
.footer-cols li a:hover { color: var(--on-dark); }
.footer-cols ul { display: grid; gap: .7rem; }
.footer-contact { display: grid; gap: .5rem; margin-top: 1.8rem; }

/* ---- Manifesto: cards de número sobre a imagem --------------------------- */
.manifesto__visual { position: relative; }
.manifesto__visual .wp-block-image img { width: 100%; aspect-ratio: 4/5; object-fit: cover; }

/* ---- Timeline (Nossa História) -------------------------------------------- */
.htl-card { min-width: 0; }
.htl__icon .wp-block-image { width: 20px; height: 20px; aspect-ratio: auto; }
.htl__icon img { width: 20px; height: 20px; display: block; }

/* ---- Destaque: slideshow --------------------------------------------------- */
.destaque__slides { position: relative; aspect-ratio: 4/5; overflow: hidden; }
.destaque__slides .wp-block-image { position: absolute; inset: 0; opacity: 0; transition: opacity 1.1s var(--ease); }
.destaque__slides .wp-block-image.is-active { opacity: 1; }
.destaque__slides .wp-block-image img { width: 100%; height: 100%; object-fit: cover; }

/* ---- Barras de progresso / fases ------------------------------------------ */
.progress__head p { margin: 0; }
.progress__head .pct,
.phase__head .pct {
  font-family: var(--font-display);
  font-size: 1.4rem;
  letter-spacing: 0;
  color: var(--ink);
}
.phase__head .pct { font-size: 1.1rem; color: var(--gold); }
.section--dark .progress__head .pct { color: var(--on-dark); }
.phase__head { display: flex; justify-content: space-between; align-items: baseline; }

/* ---- Post individual: imagem destacada como fundo do hero ------------------ */
.page-hero__media .wp-block-post-featured-image { position: absolute; inset: 0; margin: 0; }
.page-hero__media .wp-block-post-featured-image img { width: 100%; height: 100%; object-fit: cover; }

/* ---- Cabeçalhos de arquivo / páginas simples -------------------------------- */
.archive-head { padding-top: 9rem; }
.archive-head .wp-block-query-title { font-size: clamp(2rem, 4.5vw, 3.6rem); }
.legal-page { padding-top: 9rem; }
.legal-page h1 { font-size: clamp(2.2rem, 5vw, 3.6rem); margin: 1rem 0 2.5rem; }
.legal-page h3 { font-size: 1.6rem; margin: 2.4rem 0 .8rem; }

/* ---- Paginação de listagens --------------------------------------------------- */
.query-pagination {
  margin-top: clamp(2.5rem, 5vw, 4rem);
  font-family: var(--font-head);
  font-size: .72rem;
  letter-spacing: .18em;
  text-transform: uppercase;
}
.query-pagination a:hover { color: var(--gold); }

/* ---- Editor: torna a edição fiel ao front --------------------------------- */
.editor-styles-wrapper .site-header { position: relative; }
.editor-styles-wrapper .wa-float { display: none; }

/* ---- Acessibilidade --------------------------------------------------------- */
:focus-visible { outline: 2px solid var(--gold); outline-offset: 2px; }
.skip-link.screen-reader-text {
  position: absolute;
  clip-path: inset(50%);
  width: 1px; height: 1px;
  overflow: hidden;
}
.skip-link.screen-reader-text:focus {
  clip-path: none;
  width: auto; height: auto;
  left: 1rem; top: 1rem;
  z-index: 100;
  background: var(--dark);
  color: var(--on-dark);
  padding: .8rem 1.2rem;
}