/*
Theme Name: VFV Advogados Associados
Theme URI: https://vfv.com.br
Author: VFV Advogados Associados
Description: Tema institucional sob medida para o VFV Advogados Associados (Victor, Fernandes e Vieira) — advocacia estratégica em preto e dourado, com hero em parallax, botão flutuante de WhatsApp, áreas de atuação, sócios e escritório.
Version: 1.0.0
Requires at least: 6.0
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: vfv-advogados
*/

/* =========================================================
   VARIÁVEIS
========================================================= */
:root{
  --black:#08080a;
  --black-alt:#0f0f10;
  --black-card:#141416;
  --gold:#d2ae6d;
  --gold-light:#ecd7ab;
  --gold-dark:#a8814a;
  --ink:#f3efe3;
  --ink-dim:#a9a49a;
  --line: rgba(210,174,109,0.22);
  --shadow: 0 24px 60px rgba(0,0,0,0.55);
  --ease: cubic-bezier(.22,1,.36,1);
  --serif: 'Playfair Display', Georgia, serif;
  --sans: 'Jost', sans-serif;
}

/* =========================================================
   RESET
========================================================= */
*,*::before,*::after{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  background:var(--black);
  color:var(--ink);
  font-family:var(--sans);
  font-weight:300;
  line-height:1.7;
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
}
body.nav-open{overflow:hidden;}
img{max-width:100%;display:block;}
a{color:inherit;text-decoration:none;}
ul{list-style:none;margin:0;padding:0;}
h1,h2,h3,h4{
  font-family:var(--serif);
  font-weight:500;
  letter-spacing:0.01em;
  margin:0;
  color:var(--ink);
}
p{margin:0;}
.screen-reader-text{
  position:absolute !important;
  width:1px;height:1px;
  overflow:hidden;
  clip:rect(1px,1px,1px,1px);
  white-space:nowrap;
}
.skip-link:focus{
  position:fixed;top:10px;left:10px;z-index:9999;
  background:var(--gold);color:#0a0a0a;
  padding:12px 18px;clip:auto;width:auto;height:auto;
}

.container{
  width:100%;
  max-width:1240px;
  margin:0 auto;
  padding:0 6vw;
}

.eyebrow{
  font-family:var(--sans);
  font-size:0.72rem;
  letter-spacing:0.32em;
  text-transform:uppercase;
  color:var(--gold);
  display:inline-block;
}

/* =========================================================
   REVEAL ON SCROLL
========================================================= */
.reveal{
  opacity:0;
  transform:translateY(28px);
  transition:opacity .9s var(--ease), transform .9s var(--ease);
}
.reveal.in-view{opacity:1;transform:translateY(0);}
.reveal-delay-1{transition-delay:.12s;}
.reveal-delay-2{transition-delay:.24s;}
.reveal-delay-3{transition-delay:.36s;}

@media (prefers-reduced-motion: reduce){
  *{animation-duration:.001ms !important;transition-duration:.001ms !important;}
  .reveal{opacity:1;transform:none;}
}

/* =========================================================
   BOTÕES (dourado com brilho no hover)
========================================================= */
.btn{
  display:inline-flex;
  align-items:center;
  gap:10px;
  font-family:var(--sans);
  font-size:0.8rem;
  letter-spacing:0.16em;
  text-transform:uppercase;
  padding:16px 32px;
  border-radius:2px;
  border:1px solid transparent;
  cursor:pointer;
  transition:transform .4s var(--ease), box-shadow .4s var(--ease), background .4s var(--ease), border-color .4s var(--ease), color .4s var(--ease);
}
.btn-primary{
  background:linear-gradient(135deg, var(--gold-dark), var(--gold) 55%, var(--gold-light));
  color:#0a0a0a;
  font-weight:500;
}
.btn-primary:hover{
  transform:translateY(-3px);
  box-shadow:0 18px 34px rgba(210,174,109,0.35);
}
.btn-ghost{
  border-color:var(--line);
  color:var(--ink);
}
.btn-ghost:hover{
  border-color:var(--gold-light);
  color:var(--gold-light);
  transform:translateY(-3px);
}

/* efeito de brilho (shine sweep) ao passar o mouse */
.btn-shine{position:relative;overflow:hidden;}
.btn-shine::before{
  content:'';
  position:absolute;
  top:0; left:-120%;
  width:60%; height:100%;
  background:linear-gradient(115deg, transparent, rgba(255,255,255,0.55), transparent);
  transform:skewX(-20deg);
  transition:left .75s var(--ease);
}
.btn-shine:hover::before{left:130%;}

/* =========================================================
   HEADER
========================================================= */
.site-header{
  position:fixed;
  top:0;left:0;right:0;
  z-index:200;
  padding:14px 0;
  border-bottom:1px solid transparent;
  transition:background .5s var(--ease), padding .5s var(--ease), border-color .5s var(--ease), box-shadow .5s var(--ease);
}
.site-header.scrolled{
  background:rgba(8,8,10,0.88);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
  padding:8px 0;
  border-color:var(--line);
  box-shadow:0 12px 30px rgba(0,0,0,0.4);
}
.header-inner{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  max-width:1600px;
  margin:0 auto;
  padding:0 3vw;
}
.brand{display:flex;align-items:center;gap:12px;flex-shrink:0;}
.site-logo{height:95px;width:auto;max-width:none;flex-shrink:0;object-fit:contain;transition:height .5s var(--ease);}
.site-header.scrolled .site-logo{height:75px;}
.brand-mark{
  font-family:var(--serif);
  font-size:1.7rem;
  letter-spacing:0.08em;
  color:var(--gold-light);
}
.brand-type{
  font-family:var(--sans);
  font-size:0.7rem;
  letter-spacing:0.18em;
  text-transform:uppercase;
  color:var(--ink-dim);
}
.custom-logo{max-height:52px;width:auto;}

.main-nav{flex:1;min-width:0;display:flex;justify-content:center;}
.main-nav .nav-menu{display:flex;flex-wrap:nowrap;gap:clamp(16px, 2.4vw, 38px);}
.main-nav .nav-menu a{
  font-family:var(--sans);
  font-size:0.78rem;
  letter-spacing:0.16em;
  text-transform:uppercase;
  color:var(--ink-dim);
  position:relative;
  padding-bottom:6px;
  white-space:nowrap;
}
.main-nav .nav-menu a::after{
  content:'';
  position:absolute;
  left:0;bottom:0;
  width:0;height:1px;
  background:var(--gold-light);
  transition:width .4s var(--ease);
}
.main-nav .nav-menu a:hover{color:var(--ink);}
.main-nav .nav-menu a:hover::after{width:100%;}

.header-actions{display:flex;align-items:center;gap:20px;flex-shrink:0;}
.header-phone{
  display:flex;
  align-items:center;
  gap:8px;
  font-size:0.82rem;
  letter-spacing:0.04em;
  color:var(--gold-light);
  border:1px solid var(--line);
  padding:9px 16px;
  border-radius:999px;
  white-space:nowrap;
  transition:border-color .3s var(--ease), background .3s var(--ease);
}
.header-phone:hover{border-color:var(--gold-light);background:rgba(210,174,109,0.08);}

.menu-toggle{
  display:none;
  width:40px;height:40px;
  border:none;background:none;
  flex-direction:column;
  justify-content:center;
  align-items:center;
  gap:6px;
  cursor:pointer;
}
.menu-toggle span{
  width:24px;height:1px;
  background:var(--ink);
  transition:transform .35s var(--ease), opacity .35s var(--ease);
}
.menu-toggle.open span:nth-child(1){transform:translateY(7px) rotate(45deg);}
.menu-toggle.open span:nth-child(2){opacity:0;}
.menu-toggle.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}

.mobile-nav{
  display:none;
  position:fixed;
  inset:0;
  top:0;
  background:rgba(6,6,7,0.98);
  z-index:150;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:34px;
  opacity:0;
  visibility:hidden;
  transform:translateY(-12px);
  transition:opacity .4s var(--ease), transform .4s var(--ease), visibility .4s;
}
.mobile-nav.open{opacity:1;visibility:visible;transform:translateY(0);}
.mobile-nav .nav-menu{display:flex;flex-direction:column;align-items:center;gap:28px;}
.mobile-nav .nav-menu a{
  font-family:var(--serif);
  font-size:1.5rem;
  color:var(--ink);
}

@media (max-width:1200px){
  .main-nav{display:none;}
  .menu-toggle{display:flex;}
  .mobile-nav{display:flex;}
  .header-phone span{display:none;}
}

/* =========================================================
   HERO (parallax)
========================================================= */
.hero{
  position:relative;
  min-height:100vh;
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  overflow:hidden;
  padding-top:150px;
}
.hero-bg{
  position:absolute;
  inset:-15% 0;
  background-size:cover;
  background-position:center;
  will-change:transform;
  filter:brightness(1.15);
}
.hero-overlay{
  position:absolute;inset:0;
  background:
    linear-gradient(180deg, rgba(6,6,7,0.55) 0%, rgba(6,6,7,0.78) 55%, rgba(6,6,7,0.96) 100%),
    radial-gradient(ellipse 900px 500px at 50% 30%, rgba(210,174,109,0.10), transparent 60%);
}
.hero-inner{position:relative;z-index:2;max-width:900px;}
.hero-heading{
  font-family:var(--serif);
  font-style:italic;
  font-weight:500;
  font-size:clamp(1.9rem, 4.4vw, 3.1rem);
  line-height:1.42;
  color:var(--gold-light);
  margin-bottom:46px;
  text-wrap:balance;
}
.hero-heading .dot{color:var(--gold-dark);margin:0 10px;font-style:normal;}
.hero-cta{
  display:flex;
  gap:18px;
  flex-wrap:wrap;
  justify-content:center;
}

.scroll-cue{
  position:absolute;
  bottom:36px;left:50%;
  transform:translateX(-50%);
  z-index:2;
  display:flex;flex-direction:column;align-items:center;gap:10px;
  color:var(--ink-dim);
  font-size:0.68rem;
  letter-spacing:0.3em;
  text-transform:uppercase;
  opacity:0.75;
}
.scroll-cue .line{
  width:1px;height:36px;
  background:linear-gradient(var(--gold-light), transparent);
  animation:pulse-line 2.2s ease-in-out infinite;
}
@keyframes pulse-line{
  0%,100%{transform:scaleY(1);opacity:.6;}
  50%{transform:scaleY(.55);opacity:1;}
}

/* =========================================================
   STATS
========================================================= */
.stats{
  padding:64px 0;
  background:var(--black-alt);
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
}
.stats-grid{
  display:grid;
  grid-template-columns:1fr auto 1fr auto 1fr;
  align-items:center;
  gap:20px;
}
.stat-divider{width:1px;height:64px;background:var(--line);justify-self:center;}
.stat{text-align:center;}
.stat .num{
  font-family:var(--serif);
  font-size:clamp(2.2rem, 3.6vw, 3rem);
  color:var(--gold-light);
}
.stat .label{
  margin-top:8px;
  font-size:0.76rem;
  letter-spacing:0.14em;
  text-transform:uppercase;
  color:var(--ink-dim);
}
@media (max-width:760px){
  .stats-grid{grid-template-columns:1fr;}
  .stat-divider{width:70px;height:1px;margin:6px auto;}
}

/* =========================================================
   SECTION SHELL
========================================================= */
section{padding:120px 0;position:relative;}
.section-head{max-width:640px;margin:0 auto 64px;text-align:center;}
.section-head .eyebrow{margin-bottom:16px;}
.section-head h2{font-size:clamp(1.9rem, 3.4vw, 2.7rem);}
.section-head p{margin-top:18px;color:var(--ink-dim);}

/* =========================================================
   QUEM SOMOS / ABOUT
========================================================= */
.about{background:var(--black-alt);border-top:1px solid var(--line);border-bottom:1px solid var(--line);}
.about-grid{
  display:grid;
  grid-template-columns:1.1fr 0.9fr;
  gap:70px;
  align-items:center;
}
.about-copy .eyebrow{margin-bottom:18px;}
.about-copy h2{font-size:clamp(1.9rem, 3vw, 2.4rem);margin-bottom:24px;}
.about-copy p{color:var(--ink-dim);margin-bottom:18px;max-width:520px;}
.about-figure{position:relative;}
.about-figure-media{border-radius:2px;box-shadow:var(--shadow);position:relative;z-index:2;overflow:hidden;}
.about-figure-media img{width:100%;height:auto;display:block;transition:transform .7s var(--ease), filter .7s var(--ease);}
.about-figure-media:hover img{transform:scale(1.06);filter:brightness(1.05);}
.about-figure-frame{
  position:absolute;
  inset:18px -18px -18px 18px;
  border:1px solid var(--gold-dark);
  border-radius:2px;
  z-index:1;
}
@media (max-width:900px){
  .about-grid{grid-template-columns:1fr;gap:40px;}
  .about-figure{order:-1;}
}

/* =========================================================
   ÁREAS DE ATUAÇÃO
========================================================= */
.areas-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:1px;
  background:var(--line);
  border:1px solid var(--line);
}
.area-card{
  background:var(--black);
  padding:44px 36px;
  transition:background .45s var(--ease), transform .45s var(--ease);
}
.area-card:hover{background:var(--black-card);transform:translateY(-4px);}
.area-card .idx{
  font-family:var(--serif);
  color:var(--gold-dark);
  font-size:1.1rem;
  letter-spacing:0.05em;
}
.area-card h3{
  margin-top:20px;
  margin-bottom:14px;
  font-size:1.2rem;
  color:var(--gold-light);
}
.area-card p{color:var(--ink-dim);font-size:0.92rem;}
@media (max-width:960px){.areas-grid{grid-template-columns:1fr 1fr;}}
@media (max-width:640px){.areas-grid{grid-template-columns:1fr;}}

/* =========================================================
   PILARES
========================================================= */
.pillars{background:var(--black-alt);border-top:1px solid var(--line);border-bottom:1px solid var(--line);}
.pillars-grid{
  display:grid;
  grid-template-columns:repeat(5,1fr);
  gap:34px;
}
.pillar-card{text-align:center;padding:0 6px;}
.pillar-icon{
  display:flex;
  align-items:center;
  justify-content:center;
  width:56px;height:56px;
  margin:0 auto 22px;
  border-radius:50%;
  background:radial-gradient(circle at 34% 28%, var(--gold-light), var(--gold) 62%, var(--gold-dark));
  box-shadow:0 0 20px rgba(210,174,109,0.5);
}
.pillar-icon svg{width:24px;height:24px;stroke:#0a0a0a;fill:none;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;}
.pillar-card h3{font-size:1.02rem;color:var(--ink);margin-bottom:12px;}
.pillar-card p{color:var(--ink-dim);font-size:0.86rem;}
@media (max-width:1024px){.pillars-grid{grid-template-columns:repeat(3,1fr);row-gap:44px;}}
@media (max-width:640px){.pillars-grid{grid-template-columns:1fr 1fr;}}

/* =========================================================
   QUOTE / PARALLAX
========================================================= */
.quote-section{
  position:relative;
  padding:160px 0;
  overflow:hidden;
  text-align:center;
}
.quote-bg{
  position:absolute;
  inset:-15% 0;
  background-size:cover;
  background-position:center;
  will-change:transform;
  filter:grayscale(0.2) brightness(1.15);
}
.quote-overlay{
  position:absolute;inset:0;
  background:linear-gradient(180deg, rgba(6,6,7,0.88), rgba(6,6,7,0.72), rgba(6,6,7,0.9));
}
.quote-inner{position:relative;z-index:2;max-width:760px;}
.quote-mark{
  font-family:var(--serif);
  font-size:5rem;
  color:var(--gold-dark);
  line-height:1;
  display:block;
  margin-bottom:10px;
}
.quote-inner blockquote{
  font-family:var(--serif);
  font-style:italic;
  font-size:clamp(1.4rem, 2.6vw, 2rem);
  color:var(--ink);
  margin:0 0 26px;
  line-height:1.5;
}
.quote-inner cite{
  font-family:var(--sans);
  font-size:0.78rem;
  letter-spacing:0.2em;
  text-transform:uppercase;
  color:var(--gold-light);
  font-style:normal;
}

/* =========================================================
   PROPÓSITO / HISTÓRIA
========================================================= */
.story-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:70px;
}
.story-copy h2{font-size:clamp(1.6rem, 2.6vw, 2rem);margin:16px 0 22px;}
.story-copy p{color:var(--ink-dim);margin-bottom:16px;}
@media (max-width:900px){.story-grid{grid-template-columns:1fr;gap:50px;}}

/* =========================================================
   SÓCIOS
========================================================= */
.partners-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:44px;
}
.partner-card{text-align:center;}
.partner-photo{
  position:relative;
  border-radius:4px;
  overflow:hidden;
  margin-bottom:26px;
  box-shadow:var(--shadow);
}
.partner-photo::after{
  content:'';
  position:absolute;inset:0;
  border:1px solid var(--gold-dark);
  pointer-events:none;
}
.partner-photo img{
  width:100%;
  aspect-ratio:3/4;
  object-fit:cover;
  filter:grayscale(0.35) contrast(1.05);
  transition:filter .5s var(--ease), transform .6s var(--ease);
}
.partner-card:hover .partner-photo img{filter:grayscale(0);transform:scale(1.04);}
.partner-card h3{font-size:1.3rem;margin-bottom:8px;color:var(--ink);}
.partner-oab{
  font-size:0.76rem;
  letter-spacing:0.1em;
  color:var(--gold-light);
  text-transform:uppercase;
}
@media (max-width:860px){.partners-grid{grid-template-columns:1fr;max-width:340px;margin:0 auto;gap:56px;}}

/* =========================================================
   ESCRITÓRIO
========================================================= */
.office-grid{
  display:grid;
  grid-template-columns:1.15fr 0.85fr;
  gap:24px;
}
.office-figure{
  border-radius:2px;
  overflow:hidden;
  box-shadow:var(--shadow);
  position:relative;
}
.office-figure img{
  width:100%;height:100%;
  min-height:340px;
  object-fit:cover;
  transition:transform .7s var(--ease);
}
.office-figure:hover img{transform:scale(1.05);}
@media (max-width:860px){.office-grid{grid-template-columns:1fr;}}

/* =========================================================
   CONTATO
========================================================= */
.contact{background:var(--black-alt);border-top:1px solid var(--line);}
.contact-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:60px;
  align-items:stretch;
}
.contact-copy .eyebrow{margin-bottom:18px;}
.contact-copy h2{font-size:clamp(1.8rem, 3vw, 2.3rem);margin-bottom:20px;}
.contact-copy > p{color:var(--ink-dim);margin-bottom:34px;max-width:460px;}
.contact-list{margin-bottom:38px;display:flex;flex-direction:column;gap:20px;}
.contact-list li{border-bottom:1px solid var(--line);padding-bottom:16px;}
.contact-label{
  display:block;
  font-size:0.7rem;
  letter-spacing:0.16em;
  text-transform:uppercase;
  color:var(--gold-dark);
  margin-bottom:6px;
}
.contact-list a{color:var(--ink);font-size:1.02rem;}
.contact-list a:hover{color:var(--gold-light);}
.contact-map{
  min-height:340px;
  border-radius:2px;
  overflow:hidden;
  border:1px solid var(--line);
  filter:grayscale(0.5) contrast(1.1) invert(0.92);
}
@media (max-width:900px){
  .contact-grid{grid-template-columns:1fr;}
  .contact-map{min-height:280px;filter:none;}
}

/* =========================================================
   FOOTER
========================================================= */
.site-footer{background:var(--black);border-top:1px solid var(--line);padding-top:80px;}
.footer-grid{
  display:grid;
  grid-template-columns:1.4fr 1fr 1fr 1fr;
  gap:40px;
  padding-bottom:60px;
}
.footer-logo{height:109px;width:auto;}
.footer-brand .brand-mark{font-size:2rem;}
.footer-tagline{margin-top:16px;color:var(--ink);font-family:var(--serif);font-size:1.05rem;}
.footer-motto{margin-top:14px;color:var(--ink-dim);font-size:0.78rem;letter-spacing:0.08em;text-transform:uppercase;}
.footer-col h4{
  font-family:var(--sans);
  font-size:0.78rem;
  letter-spacing:0.16em;
  text-transform:uppercase;
  color:var(--gold-light);
  margin-bottom:20px;
  font-weight:500;
}
.footer-col ul{display:flex;flex-direction:column;gap:12px;}
.footer-col a{color:var(--ink-dim);font-size:0.92rem;}
.footer-col a:hover{color:var(--gold-light);}
.footer-col li{color:var(--ink-dim);font-size:0.92rem;line-height:1.6;}
.footer-bottom{border-top:1px solid var(--line);padding:26px 0;}
.footer-bottom-inner{
  display:flex;
  justify-content:space-between;
  flex-wrap:wrap;
  gap:10px;
  font-size:0.78rem;
  color:var(--ink-dim);
}
.footer-oabs{letter-spacing:0.04em;}
.footer-credit a{color:var(--ink-dim);transition:color .3s var(--ease);}
.footer-credit a:hover{color:var(--gold-light);}
@media (max-width:900px){
  .footer-grid{grid-template-columns:1fr 1fr;}
}
@media (max-width:560px){
  .footer-grid{grid-template-columns:1fr;}
  .footer-bottom-inner{flex-direction:column;text-align:center;}
}

/* =========================================================
   WHATSAPP FLUTUANTE
========================================================= */
.whatsapp-float{
  position:fixed;
  right:26px;bottom:26px;
  z-index:300;
  width:62px;height:62px;
  border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  background:linear-gradient(135deg, #1f7a3f, #25d366);
  color:#fff;
  box-shadow:0 14px 34px rgba(0,0,0,0.5), 0 0 0 1px rgba(210,174,109,0.35);
  transition:transform .35s var(--ease), box-shadow .35s var(--ease);
}
.whatsapp-float:hover{
  transform:translateY(-4px) scale(1.05);
  box-shadow:0 18px 40px rgba(0,0,0,0.55), 0 0 26px rgba(210,174,109,0.5);
}
.whatsapp-pulse{
  position:absolute;
  inset:-6px;
  border-radius:50%;
  border:2px solid rgba(37,211,102,0.55);
  animation:wa-pulse 2.4s ease-out infinite;
}
@keyframes wa-pulse{
  0%{transform:scale(0.85);opacity:0.9;}
  80%{transform:scale(1.5);opacity:0;}
  100%{opacity:0;}
}
@media (max-width:600px){
  .whatsapp-float{right:16px;bottom:16px;width:56px;height:56px;}
}

/* =========================================================
   PÁGINAS GENÉRICAS (fallback)
========================================================= */
.generic-content{padding:180px 0 120px;min-height:60vh;}
.generic-content .entry-title{font-size:clamp(1.8rem,3.4vw,2.6rem);margin-bottom:30px;}
.generic-content .entry-content{color:var(--ink-dim);max-width:760px;}
.generic-content .entry-content p{margin-bottom:18px;}
.generic-content .page-thumb{margin-bottom:34px;border-radius:2px;overflow:hidden;box-shadow:var(--shadow);}
.not-found{text-align:center;}
.not-found h1{margin:16px 0 20px;font-size:clamp(2rem,4vw,3rem);}
.not-found p{color:var(--ink-dim);margin-bottom:32px;}