/*
Theme Name: Júlia Corrêa
Theme URI: https://github.com/cadusds2/portfolio-julia
Description: Tema de blocos do portfólio da Júlia Corrêa. Identidade do PDF (escuro, papel, azul royal, lilás), editável no Editor do site.
Author: Portfólio Júlia
Version: 0.1.0
Requires at least: 6.9
Tested up to: 7.1
Requires PHP: 8.1
License: Proprietary
Text Domain: julia
*/

/* Complementos ao theme.json: o que o theme.json não expressa (faixa azul, molduras, estados). */

html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  * { transition: none !important; }
}
body { overflow-x: clip; }
.wp-site-blocks a:focus-visible, .wp-site-blocks button:focus-visible { outline: 3px solid var(--wp--preset--color--azul); outline-offset: 3px; }
.fundo-escuro a:focus-visible, .topo a:focus-visible, .topo button:focus-visible, .rodape a:focus-visible { outline-color: #8F9BFF; }

/* ---------- topo ---------- */
.topo { position: sticky; top: 0; z-index: 20; border-bottom: 1px solid #262A35; }
body.admin-bar .topo { top: var(--wp-admin--admin-bar--height, 0px); }
.topo .wp-block-site-title a { text-decoration: none; }
.topo .wp-block-navigation a { text-decoration: none; padding-block: 6px; }
.topo .wp-block-navigation .wp-block-navigation-item__content { border-bottom: 2px solid transparent; }
.topo .wp-block-navigation .wp-block-navigation-item__content:hover { border-bottom-color: #8F9BFF; }
body.post-type-archive-projeto .topo a[href$="/projetos/"],
body.single-projeto .topo a[href$="/projetos/"],
body.tax-area .topo a[href$="/projetos/"],
body.pagina-sobre .topo a[href$="/sobre/"],
body.pagina-contato .topo a[href$="/contato/"] { border-bottom-color: var(--wp--preset--color--azul); font-weight: 700; color: #fff; }
.topo .wp-block-navigation__responsive-container.is-menu-open { padding: 24px; }
.topo-cta { margin: 0; }
@media (max-width: 781px) { .topo .topo-cta { display: none; } }

/* ---------- botão pílula ---------- */
.wp-block-button__link { display: inline-flex; align-items: center; min-height: 44px; text-decoration: none; transition: background-color .15s ease; }
.wp-block-button__link:hover { background-color: var(--wp--preset--color--azul-escuro); color: #fff; }
.wp-block-button.seta .wp-block-button__link::after { content: "\2197"; margin-left: 8px; }
.wp-block-button.is-style-outline .wp-block-button__link { background: transparent; border: 2px solid currentColor; color: inherit; }
.wp-block-button.is-style-outline .wp-block-button__link:hover { background: var(--wp--preset--color--escuro); color: #fff; }
.fundo-escuro .wp-block-button.is-style-outline .wp-block-button__link:hover { background: #fff; color: var(--wp--preset--color--escuro); }
.link-seta a { font-weight: 700; text-underline-offset: 5px; }

/* ---------- rótulos e fios ---------- */
.rotulo, .rotulo a { font-size: .78rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--wp--preset--color--azul); text-decoration: none; }
.rotulo { margin: 0; }
.fundo-escuro .rotulo { color: #D5D8E0; }
.fio-topo { border-top: 1px solid var(--wp--preset--color--linha); }

/* ---------- capa (hero) com a faixa azul do PDF ---------- */
.capa { position: relative; overflow: hidden; min-height: min(calc(100svh - 56px), 760px); display: flex; align-items: center; }
.capa::after { content: ""; position: absolute; inset: 0 0 0 auto; width: 14%; background: var(--wp--preset--color--azul); pointer-events: none; }
.capa > .wp-block-group { position: relative; z-index: 1; width: 100%; padding-inline-end: 18%; }
.capa h1 { letter-spacing: -0.03em; }
@media (min-width: 700px) {
  .capa::after { width: 23.5%; }
  .capa > .wp-block-group { padding-inline-end: 27%; }
}

/* ---------- áreas (Home) ---------- */
.areas.wp-block-columns { gap: 0; }
.areas > .wp-block-column { padding: 24px 0; border-top: 1px solid var(--wp--preset--color--linha); }
@media (min-width: 782px) {
  .areas > .wp-block-column { padding: 20px 28px 8px; border-top: 1px solid var(--wp--preset--color--linha); border-left: 1px solid var(--wp--preset--color--linha); }
  .areas > .wp-block-column:first-child { padding-left: 0; border-left: 0; }
}
.areas p:not(.rotulo) { margin-top: 10px; }

/* ---------- filtro por área ---------- */
.filtro-areas { display: flex; flex-wrap: wrap; gap: 10px; margin: 0; padding: 0; list-style: none; }
.filtro-areas a {
  display: inline-flex; align-items: center; min-height: 44px; padding: 8px 20px; border-radius: 999px;
  border: 2px solid var(--wp--preset--color--escuro); color: var(--wp--preset--color--escuro);
  font-size: .92rem; font-weight: 700; text-decoration: none; background: transparent;
}
.filtro-areas a:hover { background: var(--wp--preset--color--escuro); color: #fff; }
.filtro-areas a[aria-current="page"] { background: var(--wp--preset--color--azul); border-color: var(--wp--preset--color--azul); color: #fff; }
@media (max-width: 599px) {
  .filtro-areas { flex-wrap: nowrap; overflow-x: auto; padding-bottom: 6px; scroll-snap-type: x proximity; }
  .filtro-areas li { flex: 0 0 auto; scroll-snap-align: start; }
}

/* ---------- cards de projeto ---------- */
.lista-projetos.wp-block-post-template { gap: 28px; }
.card-projeto { position: relative; background: #fff; border: 1px solid var(--wp--preset--color--linha); height: 100%; display: flex; flex-direction: column; }
.card-projeto .wp-block-post-featured-image { margin: 0; }
.card-projeto .wp-block-post-featured-image img { width: 100%; aspect-ratio: 16 / 10; object-fit: cover; }
.card-projeto .wp-block-post-title a { text-decoration: none; }
.card-projeto .wp-block-post-title a::after { content: ""; position: absolute; inset: 0; } /* cartão inteiro clicável */
.card-projeto .wp-block-post-title a:hover { text-decoration: underline; text-underline-offset: 5px; text-decoration-color: var(--wp--preset--color--azul); }
.card-projeto:focus-within { outline: 3px solid var(--wp--preset--color--azul); outline-offset: 3px; }
.wp-site-blocks .card-projeto a:focus-visible { outline: 0; }
.cliente { margin: 0; color: var(--wp--preset--color--suave); font-size: .95rem; }
.cliente:empty { display: none; }

/* Moldura lilás em cima e embaixo, como as pranchas do PDF */
.wp-block-post-featured-image img,
.wp-block-gallery .wp-block-image img,
.moldura img {
  border-block: 6px solid var(--wp--preset--color--lilas);
  background: #fff;
  box-sizing: border-box;
}

/* "Projeto completo": barra azul lateral (termo "Projeto completo" da taxonomia Área) */
li.area-projeto-completo .card-projeto,
body.single-projeto.area-projeto-completo .projeto-topo { border-left: 5px solid var(--wp--preset--color--azul); }
body.single-projeto.area-projeto-completo .projeto-topo { padding-left: 24px; }

/* ---------- página do projeto ---------- */
.projeto-topo .wp-block-post-excerpt p { margin: 0; }
.projeto-topo .wp-block-post-excerpt__more-link { display: none; }
.projeto-topo .cliente::before { content: "Cliente: "; }
.projeto-conteudo.wp-block-post-content:not(:empty)::before {
  content: "Sobre o projeto"; display: block; margin-bottom: 20px;
  font-size: .78rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--wp--preset--color--azul);
}
.wp-block-gallery.has-nested-images figure.wp-block-image { background: transparent; }
.projeto-conteudo > .wp-block-gallery { margin-top: 40px; }
.proximo-projeto { border-top: 1px solid var(--wp--preset--color--linha); }
.proximo-projeto a { text-decoration: none; }
.proximo-projeto h2 a:hover { text-decoration: underline; text-underline-offset: 6px; text-decoration-color: var(--wp--preset--color--azul); }
.proximo-projeto__inner { display: grid; gap: 24px; align-items: center; }
.proximo-projeto img { width: 100%; height: auto; aspect-ratio: 16 / 10; object-fit: cover; border-block: 6px solid var(--wp--preset--color--lilas); background: #fff; }
@media (min-width: 782px) { .proximo-projeto__inner { grid-template-columns: 1.4fr 1fr; gap: 56px; } }

/* ---------- Sobre ---------- */
.fatos.wp-block-columns { gap: 20px 28px; }
.fatos .rotulo { margin-bottom: 2px; }
.fatos p:not(.rotulo) { margin: 0; font-weight: 800; letter-spacing: -0.01em; font-size: clamp(1.1rem, 2.5vw, 1.4rem); }

/* ---------- Contato ---------- */
.contato-bloco p:not(.rotulo) { margin: 6px 0 0; font-size: clamp(1.4rem, 4vw, 2.1rem); font-weight: 800; letter-spacing: -0.02em; overflow-wrap: anywhere; }
.contato-bloco a { text-decoration: none; }
.contato-bloco a:hover { text-decoration: underline; text-decoration-color: var(--wp--preset--color--azul); text-underline-offset: 6px; }

/* ---------- rodapé ---------- */
.rodape a { text-decoration: none; }
.rodape a:hover { text-decoration: underline; text-underline-offset: 5px; }
.rodape-links { gap: 8px 28px; }

/* ---------- espaçamentos de seção (margem lateral fluida) ---------- */
.secao { padding: var(--wp--preset--spacing--60) var(--wp--preset--spacing--gutter); }
.secao-p { padding: var(--wp--preset--spacing--50) var(--wp--preset--spacing--gutter); }
.topo-in { padding: 6px var(--wp--preset--spacing--gutter); min-height: 56px; }
.topo .wp-block-site-title { margin: 0; font-weight: 800; letter-spacing: -0.01em; }
.topo .wp-block-site-title a { color: #fff; }
.topo-cta .btn-pequeno .wp-block-button__link { min-height: 36px; padding: 6px 16px; font-size: .85rem; }
.rodape a { color: var(--wp--preset--color--claro); }
.capa > .wp-block-group { max-width: 1200px; margin-inline: auto; padding-block: 64px; padding-inline-start: var(--wp--preset--spacing--gutter); }
.capa p { max-width: 38rem; }
.capa-areas { color: var(--wp--preset--color--claro); }

/* links herdam a cor do contexto (cards, hero, rodapé) */
.card-projeto .wp-block-post-title a { color: var(--wp--preset--color--escuro); }
.fundo-escuro .link-seta a, .fundo-escuro a:not(.wp-block-button__link) { color: #fff; }
.proximo-projeto h2 a { color: var(--wp--preset--color--escuro); }
.contato-bloco a { color: var(--wp--preset--color--escuro); }

/* sem vão entre cabeçalho, conteúdo e rodapé; margem lateral do topo alinhada às seções */
.wp-site-blocks > * + * { margin-block-start: 0; }
.topo { padding-inline: var(--wp--preset--spacing--gutter); }
.topo-in { padding-inline: 0; }

/* contato: faixa de abertura mais baixa que a capa da Home */
.capa-contato { min-height: 0; }
.capa-contato > .wp-block-group { padding-block: clamp(56px, 10vw, 112px); }
.wp-block-separator { margin-block: 40px; }

/* galeria em coluna única no celular */
@media (max-width: 599px) {
  .wp-block-gallery.has-nested-images figure.wp-block-image:not(#individual-image) { width: 100%; flex-basis: 100%; }
}

/* menu do celular: painel escuro, links grandes à esquerda */
.topo .wp-block-navigation__responsive-container.is-menu-open { background-color: var(--wp--preset--color--escuro); }
.topo .is-menu-open .wp-block-navigation__responsive-container-content { align-items: flex-start; padding-top: 24px; }
.topo .is-menu-open .wp-block-navigation__container { align-items: flex-start; gap: 8px; }
.topo .is-menu-open .wp-block-navigation-item__content { font-size: 1.75rem; font-weight: 800; letter-spacing: -0.02em; padding-block: 8px; }
.topo .is-menu-open .wp-block-navigation-item { justify-content: flex-start; text-align: left; width: 100%; }
.topo .is-menu-open .wp-block-navigation__container, .topo .is-menu-open .wp-block-page-list { justify-content: flex-start; width: 100%; }