/*
Theme Name: Vilhiotti Pro
Theme URI: https://vilhiottitransportes.com.br
Description: Tema profissional completo com todas as seções e painel de personalização avançado.
Author: Manus
Version: 2.0
License: GNU General Public License v2 or later
Text Domain: vilhiotti-pro
*/

/* =============================================
   VARIÁVEIS — EDITE AQUI CORES E FONTES
   ============================================= */
:root {
  --cor-primaria:   #1a3a52;
  --cor-secundaria: #e8a020;
  --cor-texto:      #444444;
  --cor-fundo:      #f7f9fb;
  --cor-branco:     #ffffff;
  --fonte-titulo:   'Montserrat', sans-serif;
  --fonte-corpo:    'Open Sans', sans-serif;
  --raio-borda:     10px;
  --sombra-card:    0 4px 24px rgba(0,0,0,0.08);
}

@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@400;600;700;800&family=Open+Sans:wght@400;500;600&display=swap');

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body { font-family: var(--fonte-corpo); color: var(--cor-texto); background: var(--cor-branco); line-height: 1.7; }
img { max-width: 100%; height: auto; display: block; }
a { text-decoration: none; color: inherit; }

/* BOTÕES */
.btn-primario { display:inline-block; background:var(--cor-secundaria); color:#fff; padding:14px 30px; border-radius:6px; font-family:var(--fonte-titulo); font-weight:700; font-size:15px; transition:opacity .2s,transform .2s; cursor: pointer; }
.btn-primario:hover { opacity:.9; transform:translateY(-2px); }
.btn-outline { display:inline-block; background:transparent; color:#fff; padding:14px 30px; border-radius:6px; font-family:var(--fonte-titulo); font-weight:700; font-size:15px; border:2px solid #fff; transition:background .2s,color .2s; cursor: pointer; }
.btn-outline:hover { background:#fff; color:var(--cor-primaria); }
.btn-escuro { display:inline-block; background:var(--cor-primaria); color:#fff; padding:14px 30px; border-radius:6px; font-family:var(--fonte-titulo); font-weight:700; font-size:15px; transition:opacity .2s; cursor: pointer; }
.btn-escuro:hover { opacity:.85; }

/* HEADER */
#site-header { position:fixed; top:0; left:0; right:0; z-index:999; background:var(--cor-primaria); padding:14px 40px; box-shadow:0 2px 12px rgba(0,0,0,.2); }
.header-inner { max-width:1200px; margin:0 auto; display:flex; align-items:center; justify-content:space-between; }
.site-logo img { height:60px; }
.site-nav ul { list-style:none; display:flex; gap:28px; }
.site-nav a { color:#fff; font-family:var(--fonte-titulo); font-size:14px; font-weight:600; letter-spacing:.5px; transition:color .2s; }
.site-nav a:hover { color:var(--cor-secundaria); }
.menu-toggle { display:none; background:none; border:none; cursor:pointer; flex-direction:column; gap:5px; }
.menu-toggle span { display:block; width:26px; height:2px; background:#fff; border-radius:2px; }

/* HERO */
#hero { background:var(--cor-primaria); padding:160px 40px 100px; min-height:100vh; display:flex; align-items:center; }
.hero-inner { max-width:1200px; margin:0 auto; display:grid; grid-template-columns:1fr 1fr; gap:60px; align-items:center; }
.hero-titulo { font-family:var(--fonte-titulo); font-size:clamp(32px,4vw,52px); font-weight:800; color:#fff; line-height:1.15; margin-bottom:20px; }
.hero-subtitulo { font-size:17px; color:#cde3f5; margin-bottom:36px; max-width:480px; }
.hero-botoes { display:flex; gap:16px; flex-wrap:wrap; }
.hero-img img { border-radius:var(--raio-borda); box-shadow:0 20px 60px rgba(0,0,0,.3); width:100%; }

/* SEÇÕES GENÉRICAS */
.secao-inner { max-width:1200px; margin:0 auto; }
.secao-topo { text-align:center; margin-bottom:56px; }
.secao-titulo { font-family:var(--fonte-titulo); font-size:clamp(26px,3vw,38px); font-weight:800; color:var(--cor-primaria); margin-bottom:14px; }
.secao-subtitulo { font-size:16px; color:#666; max-width:640px; margin:0 auto; }

/* VISÃO GERAL */
#visao-geral { background:var(--cor-fundo); padding:90px 40px; }
.cards-grid-2 { display:grid; grid-template-columns:1fr 1fr; gap:28px; }
.card { background:var(--cor-branco); border-radius:var(--raio-borda); padding:40px; box-shadow:var(--sombra-card); }
.card-icone { font-size:42px; margin-bottom:18px; }
.card-titulo { font-family:var(--fonte-titulo); font-size:20px; font-weight:700; color:var(--cor-primaria); margin-bottom:12px; }
.card-texto { font-size:15px; color:#666; line-height:1.8; }

/* CTA BANNER */
#cta-banner { background:var(--cor-secundaria); padding:80px 40px; text-align:center; }
.cta-titulo { font-family:var(--fonte-titulo); font-size:clamp(24px,3vw,36px); font-weight:800; color:#fff; margin-bottom:16px; }
.cta-texto { font-size:17px; color:rgba(255,255,255,.9); max-width:600px; margin:0 auto 32px; }
.cta-botoes { display:flex; gap:16px; justify-content:center; flex-wrap:wrap; }

/* SERVIÇOS */
#servicos { background:var(--cor-branco); padding:90px 40px; }
.cards-grid-3 { display:grid; grid-template-columns:repeat(3,1fr); gap:28px; }
.card-servico { background:var(--cor-fundo); border-radius:var(--raio-borda); padding:40px 32px; text-align:center; border-top:4px solid var(--cor-primaria); transition:transform .2s,box-shadow .2s; }
.card-servico:hover { transform:translateY(-6px); box-shadow:var(--sombra-card); }
.card-tag { display:inline-block; color:var(--cor-secundaria); font-size:12px; font-weight:700; letter-spacing:.5px; text-transform:uppercase; margin-bottom:12px; }

/* AUTORIZAÇÕES */
#autorizacoes { background:var(--cor-primaria); padding:90px 40px; }
.badge-legalizada { display:inline-block; background:var(--cor-secundaria); color:#fff; font-family:var(--fonte-titulo); font-size:12px; font-weight:700; padding:6px 20px; border-radius:20px; margin-bottom:20px; letter-spacing:.5px; }
#autorizacoes .secao-titulo { color:#fff; }
#autorizacoes .secao-subtitulo { color:#cde3f5; }
.cards-grid-4 { display:grid; grid-template-columns:repeat(4,1fr); gap:24px; }
.card-cert { background:var(--cor-branco); border-radius:var(--raio-borda); padding:32px 24px; text-align:center; }
.cert-logo { background:var(--cor-fundo); border-radius:8px; padding:22px; margin-bottom:16px; font-family:var(--fonte-titulo); font-size:20px; font-weight:900; color:var(--cor-primaria); letter-spacing:1px; }
.cert-logo img { max-height: 80px; margin: 0 auto; }
.card-cert h4 { font-family:var(--fonte-titulo); font-size:16px; color:var(--cor-primaria); margin-bottom:6px; }
.card-cert p { font-size:13px; color:#777; }

/* FAQ */
#faq { background:var(--cor-fundo); padding:90px 40px; }
.faq-lista { max-width:800px; margin:0 auto; display:flex; flex-direction:column; gap:12px; }
.faq-item { background:var(--cor-branco); border-radius:8px; border:1px solid #e0e8f0; overflow:hidden; }
.faq-pergunta { width:100%; background:none; border:none; padding:20px 24px; text-align:left; font-family:var(--fonte-titulo); font-size:15px; font-weight:600; color:var(--cor-primaria); cursor:pointer; display:flex; justify-content:space-between; align-items:center; gap:12px; }
.faq-icon { min-width:24px; height:24px; background:var(--cor-primaria); color:#fff; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:18px; font-weight:700; transition:transform .3s,background .3s; }
.faq-item.aberto .faq-icon { transform:rotate(45deg); background:var(--cor-secundaria); }
.faq-resposta { max-height:0; overflow:hidden; transition:max-height .35s ease,padding .3s; font-size:15px; color:#555; line-height:1.8; padding:0 24px; }
.faq-item.aberto .faq-resposta { max-height:300px; padding:0 24px 20px; }

/* FORMULÁRIO */
#formulario { background:var(--cor-branco); padding:90px 40px; }
.form-wrapper { max-width:860px; margin:0 auto; background:var(--cor-fundo); border-radius:16px; padding:50px 48px; box-shadow:var(--sombra-card); }
.form-grid { display:grid; grid-template-columns:1fr 1fr; gap:20px; }
.form-grupo { display:flex; flex-direction:column; gap:6px; }
.form-grupo.full { grid-column:1 / -1; }
.form-grupo label { font-family:var(--fonte-titulo); font-size:13px; font-weight:700; color:var(--cor-primaria); text-transform:uppercase; letter-spacing:.5px; }
.form-grupo input, .form-grupo select, .form-grupo textarea { padding:12px 16px; border:1.5px solid #d0dce8; border-radius:7px; font-family:var(--fonte-corpo); font-size:15px; color:var(--cor-texto); background:var(--cor-branco); transition:border-color .2s; width:100%; }
.form-grupo input:focus, .form-grupo select:focus, .form-grupo textarea:focus { outline:none; border-color:var(--cor-primaria); }
.form-grupo textarea { resize:vertical; min-height:110px; }
.form-submit { margin-top:28px; text-align:center; }
.btn-form { background:var(--cor-primaria); color:#fff; padding:16px 44px; border:none; border-radius:7px; font-family:var(--fonte-titulo); font-size:16px; font-weight:700; cursor:pointer; transition:background .2s,transform .2s; }
.btn-form:hover { background:var(--cor-secundaria); transform:translateY(-2px); }

/* CONTATO */
#contato { background:var(--cor-fundo); padding:90px 40px; }
.card-contato { background:var(--cor-branco); border-radius:var(--raio-borda); padding:40px 28px; text-align:center; box-shadow:var(--sombra-card); }
.card-contato h4 { font-family:var(--fonte-titulo); font-size:17px; color:var(--cor-primaria); margin:16px 0 10px; }
.card-contato a, .card-contato p { color:var(--cor-secundaria); font-weight:700; font-size:16px; }
.contato-cta { text-align:center; margin-top:48px; }

/* FOOTER */
#site-footer { background:var(--cor-primaria); padding:36px 40px; }
.footer-inner { max-width:1200px; margin:0 auto; display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:20px; }
.footer-logo img { height:50px; }
.footer-copy { color:#cde3f5; font-size:14px; }
.footer-social a { color:#fff; font-family:var(--fonte-titulo); font-size:14px; font-weight:600; transition:color .2s; }
.footer-social a:hover { color:var(--cor-secundaria); }



/* RESPONSIVO */
@media (max-width:1024px) {
  .cards-grid-4 { grid-template-columns:repeat(2,1fr); }
  .cards-grid-3 { grid-template-columns:repeat(2,1fr); }
}
@media (max-width:768px) {
  #site-header { padding:14px 20px; }
  .menu-toggle { display:flex; }
  .site-nav { display:none; position:absolute; top:88px; left:0; right:0; background:var(--cor-primaria); padding:20px; }
  .site-nav.aberto { display:block; }
  .site-nav ul { flex-direction:column; gap:16px; }
  #hero { padding:120px 20px 70px; }
  .hero-inner { grid-template-columns:1fr; }
  .hero-img { display:none; }
  .cards-grid-2, .cards-grid-3, .cards-grid-4 { grid-template-columns:1fr; }
  .form-wrapper { padding:32px 20px; }
  .form-grid { grid-template-columns:1fr; }
  #site-header,#hero,#visao-geral,#cta-banner,#servicos,#autorizacoes,#faq,#formulario,#contato,#site-footer { padding-left:20px; padding-right:20px; }
  .footer-inner { flex-direction:column; text-align:center; }
}
