/*
Theme Name: Walprint
Theme URI: https://walprint.com.br
Author: TI Walprint
Description: Tema em blocos do site institucional da Walprint (página única). Sem construtor de páginas: só blocos nativos do WordPress.
Version: 1.0.0
Requires at least: 7.0
Requires PHP: 8.2
License: GPL-2.0-or-later
Text Domain: walprint
*/

/* ---------- Base ---------- */
html { scroll-behavior: smooth; }
:where([id]) { scroll-margin-top: 80px; }
body { -webkit-font-smoothing: antialiased; }
.wp-site-blocks > main, .wp-site-blocks > footer, .wp-site-blocks > * + * { margin-block-start: 0; }
.rotulo { font-size: 13px !important; font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase; color: var(--wp--preset--color--teal); margin-bottom: 8px !important; }
.has-white-color .rotulo, .rotulo.has-white-color { color: #fff; }

/* ---------- Cabeçalho fixo sobre a abertura ---------- */
.cabecalho { position: fixed; top: 0; left: 0; right: 0; z-index: 100; transition: background .25s, box-shadow .25s; }
.admin-bar .cabecalho { top: 32px; }
.cabecalho.rolou { background: rgba(0, 0, 0, .92); box-shadow: 0 2px 12px rgba(0, 0, 0, .25); }
.cabecalho .wp-block-navigation a { font-size: 12px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.cabecalho .wp-block-navigation a:hover { color: var(--wp--preset--color--teal); }
.cabecalho .wp-block-navigation__responsive-container.is-menu-open { background: #000 !important; color: #fff !important; }

/* ---------- Abertura ---------- */
.abertura h1 { line-height: 1; }
.abertura .wp-block-button__link { border: 2px solid #fff; }
.abertura .wp-block-button__link:hover { background: #fff !important; color: var(--wp--preset--color--teal) !important; }

/* ---------- Ícones em círculo (O que fazemos) ---------- */
.icone-circulo img { width: 112px !important; height: 112px !important; padding: 26px; border: 2px solid var(--wp--preset--color--teal); border-radius: 50%; box-sizing: border-box; }
.servico h3 { min-height: 2.6em; display: flex; align-items: center; justify-content: center; }

/* ---------- Cartões de processo (Como fazemos): descrição aparece ao passar o mouse ---------- */
.cartao { border-radius: 12px; overflow: hidden; }
.cartao .wp-block-cover__inner-container { width: 100%; }
.cartao img.icone-cartao { width: 44px; height: 44px; }
.cartao .revela { max-height: 0; opacity: 0; overflow: hidden; transition: max-height .35s ease, opacity .35s ease; margin: 0 !important; }
.cartao:hover .revela, .cartao:focus-within .revela { max-height: 220px; opacity: 1; margin-top: 16px !important; }
.cartao .wp-block-cover__background { transition: opacity .35s ease; }
.cartao:hover .wp-block-cover__background { opacity: .75 !important; }
@media (hover: none) { .cartao .revela { max-height: none; opacity: 1; margin-top: 12px !important; } }

/* ---------- Logos de clientes ---------- */
.logos.wp-block-gallery img { transition: transform .25s; }
.logos.wp-block-gallery figure:hover img { transform: scale(1.06); }

/* ---------- Formulário de orçamento (Contact Form 7) ---------- */
.orcamento .wpcf7 { max-width: 1000px; margin: 0 auto; }
.orcamento .grade { display: grid; grid-template-columns: repeat(2, 1fr); gap: 0 32px; }
.orcamento .grade-3 { display: grid; grid-template-columns: 2fr 2fr 1fr; gap: 0 12px; }
.orcamento .grade-4 { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0 12px; }
.orcamento .grade-capa { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0 12px; }
.orcamento .campo { margin-bottom: 16px; }
.orcamento label, .orcamento .titulo-campo { display: block; font-size: 12px; font-weight: 500; letter-spacing: .04em; text-transform: uppercase; color: #111; margin-bottom: 6px; }
.orcamento .obrig { color: #d33; }
.orcamento input[type=text], .orcamento input[type=email], .orcamento input[type=tel], .orcamento input[type=number], .orcamento select {
  width: 100%; box-sizing: border-box; height: 44px; padding: 0 14px; border: 1px solid #e3e3e3; border-radius: 10px; background: #fafafa;
  font: inherit; font-size: 15px; color: #111;
}
.orcamento input:focus, .orcamento select:focus { outline: 2px solid var(--wp--preset--color--teal); outline-offset: 1px; background: #fff; }
.orcamento h3 { margin: 32px 0 12px; }
.orcamento .categorias { text-align: center; margin-bottom: 24px; }
.orcamento .categorias .wpcf7-list-item { margin: 0 12px 8px; }
.orcamento .categorias .wpcf7-list-item-label { font-weight: 700; text-transform: uppercase; color: var(--wp--preset--color--teal); font-size: 15px; }
.orcamento .opcoes .wpcf7-list-item { margin: 0 18px 0 0; }
.orcamento .opcoes .wpcf7-list-item label { display: inline; text-transform: none; font-size: 14px; }
.orcamento input[type=submit] {
  width: 100%; height: 50px; border: 0; border-radius: 10px; background: var(--wp--preset--color--teal); color: #fff;
  font: inherit; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; cursor: pointer; margin-top: 24px;
}
.orcamento input[type=submit]:hover { background: var(--wp--preset--color--teal-escuro); }
.orcamento .wpcf7-not-valid-tip { font-size: 12px; }
.orcamento .wpcf7-response-output { border-radius: 10px; text-align: center; }
@media (max-width: 781px) {
  .orcamento .grade, .orcamento .grade-capa { grid-template-columns: 1fr; }
  .orcamento .grade-3 { grid-template-columns: 1fr 1fr; }
  .orcamento .grade-4 { grid-template-columns: 1fr 1fr; }
}

/* ---------- Rodapé e botão do WhatsApp ---------- */
.rodape a { color: inherit; }
.botao-whatsapp {
  position: fixed; right: 22px; bottom: 22px; z-index: 90; width: 58px; height: 58px; border-radius: 50%;
  background: #25D366; display: flex; align-items: center; justify-content: center; box-shadow: 0 4px 14px rgba(0, 0, 0, .3);
}
.botao-whatsapp svg { width: 32px; height: 32px; fill: #fff; }
.botao-whatsapp:focus-visible { outline: 3px solid #fff; outline-offset: 2px; }