/* ==========================================================================
   Peixoto Paisagismo · Design tokens (extraídos da logo em LOGO PEIXOTO/)
   ========================================================================== */
:root{
  --navy: #16233F;
  --navy-deep: #101A31;
  --blue: #2E5CA6;
  --blue-light: #6E93D6;
  --off-white: #F5F6F2;
  --white: #FFFFFF;
  --ink: #1C2430;
  --ink-soft: #5B6478;
  --border: #E3E7F0;
  --gold: #C9A24B;
  --gold-light: #E4CD93;

  --serif: 'Fraunces', Georgia, serif;
  --sans: 'Manrope', -apple-system, BlinkMacSystemFont, sans-serif;

  --container: 1180px;
  --radius: 4px;
  --radius-lg: 18px;
  --ease: cubic-bezier(.4,0,.2,1);
}

*{box-sizing:border-box; margin:0; padding:0;}
html{scroll-behavior:smooth;}
body{
  font-family: var(--sans);
  color: var(--ink);
  background: var(--white);
  line-height:1.6;
  -webkit-font-smoothing: antialiased;
}
img{max-width:100%; display:block;}
a{color:inherit; text-decoration:none;}
ul,ol{list-style:none;}
button{font:inherit; cursor:pointer; background:none; border:none;}
input,textarea{font:inherit;}

.wrap{
  max-width: var(--container);
  margin: 0 auto;
  padding: 0 32px;
}

h1,h2,h3{
  font-family: var(--serif);
  font-weight: 500;
  color: var(--navy);
  line-height:1.15;
  letter-spacing: -0.01em;
}
h1{font-size: clamp(2.4rem, 5vw, 4rem); font-weight:500; letter-spacing:-0.02em;}
h2{font-size: clamp(1.9rem, 3.2vw, 2.7rem);}
h3{font-size: 1.15rem; font-weight:600; font-family: var(--sans); letter-spacing:-0.005em;}

.eyebrow{
  font-size: .76rem;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--blue);
  font-weight: 700;
  margin-bottom: 14px;
}
.center{text-align:center; margin-left:auto; margin-right:auto;}
.section-sub{
  color: var(--ink-soft);
  font-size: 1.05rem;
  max-width: 560px;
  margin-top: 10px;
}
.section{padding: 108px 0;}
.section.center, h2.center{margin-bottom: 8px;}

/* Buttons */
.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding: 15px 30px;
  border-radius: var(--radius);
  font-weight:700;
  font-size:.92rem;
  letter-spacing:.02em;
  transition: all .25s var(--ease);
  white-space:nowrap;
}
.btn-primary{
  background: var(--blue);
  color: var(--white);
}
.btn-primary:hover{ background: var(--navy); transform: translateY(-2px); }
.btn-ghost{
  border: 1.5px solid rgba(255,255,255,.5);
  color: var(--white);
}
.btn-ghost:hover{ background: rgba(255,255,255,.12); }

/* Placeholder media (no real photos yet) */
.placeholder-media{
  position:relative;
  background: linear-gradient(135deg, var(--navy) 0%, var(--blue) 100%);
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
}
.placeholder-media::before{
  content:"";
  position:absolute; inset:0;
  background-image: repeating-linear-gradient(45deg, rgba(255,255,255,.045) 0 2px, transparent 2px 14px);
}
.photo-media{
  position:relative;
  overflow:hidden;
}
.photo-media img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}
.placeholder-tag{
  position:relative;
  color: rgba(255,255,255,.85);
  font-size:.72rem;
  letter-spacing:.08em;
  text-transform:uppercase;
  font-weight:700;
  border: 1px dashed rgba(255,255,255,.5);
  padding: 8px 14px;
  border-radius: 3px;
  text-align:center;
}

/* ==========================================================================
   Topbar + Nav
   ========================================================================== */
.topbar{
  background: var(--navy-deep);
  color: rgba(255,255,255,.75);
  font-size: .8rem;
}
.topbar-inner{
  display:flex; justify-content:space-between; align-items:center;
  padding: 8px 32px;
  gap: 16px;
  flex-wrap:wrap;
}
.topbar a{ color: var(--blue-light); font-weight:600; }
.topbar a:hover{ color: var(--white); }

.nav{
  position: sticky; top:0; z-index: 100;
  background: var(--white);
  border-bottom: 1px solid var(--border);
  box-shadow: 0 1px 0 rgba(46,92,166,.05);
}
.nav-inner{
  display:flex; align-items:center; justify-content:space-between;
  padding: 14px 32px;
  gap: 24px;
}
.logo{ display:flex; align-items:center; gap:14px; }
.logo-mark{
  width: 59px; height:59px;
  border-radius: 50%;
  object-fit: contain;
  background: var(--off-white);
  border: 2px solid var(--off-white);
  box-shadow: 0 3px 12px rgba(22,35,63,.22), 0 0 0 1px rgba(46,92,166,.12);
  transition: box-shadow .3s var(--ease);
  animation: logoSpin 16s linear infinite;
}
.logo:hover .logo-mark{ box-shadow: 0 5px 18px rgba(22,35,63,.32), 0 0 0 1px rgba(46,92,166,.22); }
@keyframes logoSpin{ from{ transform: rotate(0deg); } to{ transform: rotate(360deg); } }
.logo-word{
  font-family: var(--serif);
  font-size: 1.2rem;
  color: var(--navy);
  font-weight:600;
  letter-spacing:-0.01em;
  line-height:1.1;
}
.logo-word em{
  font-style:normal;
  font-weight:500;
  color: var(--blue);
  display:block;
  font-size:.6rem;
  letter-spacing:.24em;
  text-transform:uppercase;
  margin-top:3px;
}
.logo-word.light{ color: var(--white); }
.logo-word.light em{ color: var(--blue-light); }

.nav-links{ display:flex; gap:34px; }
.nav-links a{
  font-size:.92rem; font-weight:600; color: var(--ink);
  position:relative; padding: 4px 0;
}
.nav-links a::after{
  content:""; position:absolute; left:0; bottom:0; width:0; height:2px;
  background: var(--gold); transition: width .25s var(--ease);
}
.nav-links a:hover::after{ width:100%; }
.nav-cta{ flex-shrink:0; }

.burger{
  display:none; flex-direction:column; align-items:flex-end; gap:6px; width:26px;
  padding: 6px 2px;
}
.burger span{
  height:2.5px; border-radius: 2px;
  background: var(--navy); width:100%;
  transition: all .3s var(--ease);
}
.burger span:nth-child(2){ width:65%; background: var(--blue); }
.burger.open span{ background: var(--navy); }
.burger.open span:nth-child(1){ width:100%; transform: translateY(8.5px) rotate(45deg); }
.burger.open span:nth-child(2){ opacity:0; width:100%; }
.burger.open span:nth-child(3){ width:100%; transform: translateY(-8.5px) rotate(-45deg); }

/* ==========================================================================
   Hero
   ========================================================================== */
.hero{
  position:relative;
  min-height: 86vh;
  display:flex; align-items:center;
  overflow:hidden;
}
.hero-media{
  position:absolute; inset:0;
  background-image: url('../assets/img/hero-banner.png');
  background-size: cover;
  background-position: right center;
  background-repeat: no-repeat;
}
.hero-overlay{
  position:absolute; inset:0;
  background:
    linear-gradient(100deg, rgba(16,26,49,.88) 0%, rgba(16,26,49,.74) 32%, rgba(16,26,49,.34) 58%, rgba(16,26,49,.1) 78%),
    linear-gradient(0deg, rgba(16,26,49,.65) 0%, rgba(16,26,49,0) 42%);
}
.hero-content{
  position:relative; z-index:2;
  color: var(--white);
  padding: 72px 32px;
  max-width: 824px;
}
.hero-content .eyebrow{ color: var(--blue-light); }
.hero-content h1{ color: var(--white); line-height:1.08; }
.hero-content .hero-tag{ color: var(--gold); margin-bottom:20px; }
.hero-content .hero-tag::before{ background: var(--gold); }
.hero-sub{
  font-size: 1.1rem;
  line-height: 1.7;
  color: rgba(255,255,255,.82);
  margin: 24px 0 36px;
  max-width: 560px;
}
.hero-actions{ display:flex; gap:16px; flex-wrap:wrap; }

/* ==========================================================================
   Trust belt · esteira 3D em loop (empresas parceiras + tempo de mercado)
   ========================================================================== */
.belt{
  background: var(--navy);
  padding: 34px 0;
  overflow: hidden;
  position: relative;
}
.belt::before, .belt::after{
  content:""; position:absolute; top:0; bottom:0; width:110px; z-index:2; pointer-events:none;
}
.belt::before{ left:0; background: linear-gradient(90deg, var(--navy) 15%, rgba(22,35,63,0) 100%); }
.belt::after{ right:0; background: linear-gradient(270deg, var(--navy) 15%, rgba(22,35,63,0) 100%); }

.belt-stage{ perspective: 1000px; perspective-origin: 50% 20%; }
.belt-track{
  display:flex; align-items:center; gap: 48px;
  width: max-content;
  transform-style: preserve-3d;
  transform: rotateX(8deg);
  animation: beltScroll 30s linear infinite;
  will-change: transform;
}
.belt-stage:hover .belt-track{ animation-play-state: paused; }

.belt-item{
  flex: 0 0 auto;
  height: 60px;
  display:flex; align-items:center; justify-content:center;
}
.belt-item:not(.belt-badge){
  background: var(--white);
  border-radius: 10px;
  padding: 0 26px;
  height: 60px;
  box-shadow: 0 18px 26px -8px rgba(0,0,0,.4), inset 0 1px 0 rgba(255,255,255,.6);
}
.belt-item img{
  max-height: 28px; width:auto;
  filter: grayscale(1) opacity(.7);
  transition: filter .25s var(--ease);
}
.belt-stage:hover .belt-item img{ filter: grayscale(0) opacity(1); }

.belt-badge{
  gap:12px;
  padding: 0 22px;
  border: 1px solid rgba(201,162,75,.4);
  border-radius: 999px;
  background: rgba(201,162,75,.08);
  box-shadow: 0 16px 26px -8px rgba(0,0,0,.4), inset 0 1px 0 rgba(255,255,255,.1);
}
.belt-num{
  font-family: var(--serif);
  font-size: 1.5rem;
  color: var(--gold);
  font-weight:500;
  line-height:1;
}
.belt-label{
  font-size:.64rem;
  letter-spacing:.06em;
  text-transform:uppercase;
  color: rgba(255,255,255,.68);
  line-height:1.3;
  font-weight:700;
}

@keyframes beltScroll{
  from{ transform: rotateX(8deg) translateX(0); }
  to{ transform: rotateX(8deg) translateX(-50%); }
}
@media (prefers-reduced-motion: reduce){
  .belt-track{ animation: none; }
}

/* ==========================================================================
   Sobre
   ========================================================================== */
.sobre-grid{
  display:grid; grid-template-columns: .9fr 1.1fr;
  gap: 72px; align-items:center;
}
.sobre-photo-wrap{ position:relative; }
.sobre-media{
  aspect-ratio: 4/5;
  border-radius: var(--radius-lg);
  box-shadow: 0 30px 60px -20px rgba(16,26,49,.35);
  transition: transform .5s var(--ease), box-shadow .5s var(--ease);
}
.sobre-photo-wrap:hover .sobre-media{ transform: translateY(-6px); box-shadow: 0 40px 70px -20px rgba(16,26,49,.45); }
.sobre-badge{
  position:absolute; left:-18px; bottom:32px;
  background: var(--navy);
  color: var(--white);
  padding: 18px 26px;
  border-radius: var(--radius-lg);
  box-shadow: 0 20px 40px -14px rgba(16,26,49,.5), 0 0 0 1px rgba(201,162,75,.3);
  display:flex; align-items:center; gap:12px;
  z-index:2;
}
.sobre-badge-num{ font-family: var(--serif); font-size:1.9rem; color: var(--gold); font-weight:500; line-height:1; }
.sobre-badge-label{ font-size:.68rem; letter-spacing:.08em; text-transform:uppercase; color: rgba(255,255,255,.75); font-weight:700; line-height:1.3; max-width:80px; }
.sobre-text p{ color: var(--ink-soft); margin-bottom:16px; font-size:1.02rem; }
.sobre-text strong{ color: var(--navy); }

.pilares{
  display:grid; grid-template-columns: 1fr 1fr;
  gap: 14px 16px;
  margin-top: 32px;
}
.pilar{
  display:flex; align-items:center; gap:12px;
  font-size:.9rem; font-weight:600; color: var(--navy);
  background: var(--off-white);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  padding: 14px 16px;
  transition: transform .3s var(--ease), box-shadow .3s var(--ease), border-color .3s var(--ease);
}
.pilar:hover{
  transform: translateY(-3px);
  box-shadow: 0 14px 28px -12px rgba(22,35,63,.14);
  border-color: rgba(201,162,75,.4);
}
.pilar-ico{
  flex-shrink:0;
  width:30px; height:30px; border-radius:50%;
  background: var(--navy);
  display:flex; align-items:center; justify-content:center;
}
.pilar-ico svg{ width:14px; height:14px; color: var(--gold); }

/* ==========================================================================
   Serviços · cards fotográficos com profundidade 3D
   ========================================================================== */
.servicos{ background: var(--navy-deep); position:relative; overflow:hidden; }
.servicos::before{
  content:"";
  position:absolute; inset:0;
  background:
    radial-gradient(560px 320px at 12% 0%, rgba(46,92,166,.28), transparent 70%),
    radial-gradient(520px 340px at 92% 100%, rgba(201,162,75,.14), transparent 70%);
  pointer-events:none;
}
.servicos .eyebrow, .servicos .eyebrow.center{ color: var(--gold); }
.servicos h2.center{ color: var(--white); }
.servicos .section-sub.center{ color: rgba(255,255,255,.68); }

.servicos-grid{
  display:grid; grid-template-columns: repeat(3, 1fr);
  gap: 26px;
  margin-top: 56px;
  perspective: 1400px;
  position:relative; z-index:1;
}

.servico-card{
  position:relative;
  display:block;
  aspect-ratio: 4 / 5;
  border-radius: var(--radius-lg);
  overflow:hidden;
  isolation:isolate;
  color: var(--white);
  box-shadow: 0 20px 40px -16px rgba(4,8,18,.6), 0 0 0 1px rgba(255,255,255,.06);
  transform: perspective(1400px);
  transition: transform .18s ease-out, box-shadow .4s var(--ease);
  will-change: transform;
}
.servico-card:hover{
  box-shadow: 0 30px 60px -14px rgba(4,8,18,.7), 0 0 0 1px rgba(201,162,75,.4);
}
.servico-card.featured{
  box-shadow: 0 20px 40px -16px rgba(4,8,18,.6), 0 0 0 1px rgba(201,162,75,.3);
}

.servico-card-media{
  position:absolute; inset:0;
  background-size: cover;
  background-position: center;
  transform: scale(1.1);
  transition: transform .7s var(--ease);
}
.servico-card:hover .servico-card-media{ transform: scale(1.18); }

.servico-card-scrim{
  position:absolute; inset:0;
  background:
    linear-gradient(180deg, rgba(10,16,32,.05) 0%, rgba(10,16,32,.22) 38%, rgba(8,13,27,.95) 100%);
  transition: background .4s var(--ease);
}

.servico-card-sheen{
  position:absolute; inset:-40%;
  background: linear-gradient(115deg, transparent 42%, rgba(255,255,255,.22) 50%, transparent 58%);
  transform: translateX(-70%);
  transition: transform .9s var(--ease);
  pointer-events:none;
}
.servico-card:hover .servico-card-sheen{ transform: translateX(70%); }

.servico-card-top{
  position:absolute; top:18px; left:18px; right:18px;
  display:flex; align-items:flex-start; justify-content:space-between;
  z-index:2;
}
.servico-card-num{
  font-family: var(--serif);
  font-size: .82rem;
  font-weight:600;
  letter-spacing:.1em;
  color: var(--gold);
  text-shadow: 0 1px 8px rgba(0,0,0,.5);
}
.servico-card-ico{
  width:38px; height:38px;
  border-radius:50%;
  background: rgba(255,255,255,.1);
  border: 1px solid rgba(255,255,255,.28);
  backdrop-filter: blur(6px);
  display:flex; align-items:center; justify-content:center;
  flex-shrink:0;
}
.servico-card-ico svg{ width:18px; height:18px; color: var(--white); }

.servico-card-ribbon{
  font-size:.62rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase;
  color: var(--navy-deep);
  background: var(--gold);
  padding: 5px 10px;
  border-radius: 999px;
  white-space:nowrap;
}

.servico-card-content{
  position:absolute; left:0; right:0; bottom:0;
  padding: 24px 22px;
  z-index:2;
  transform: translateY(10px);
  transition: transform .4s var(--ease);
}
.servico-card:hover .servico-card-content{ transform: translateY(0); }
.servico-card-content h3{
  font-family: var(--serif); font-weight:500; font-size:1.22rem;
  color: var(--white); margin-bottom:0; letter-spacing:-0.01em;
}
.servico-card-content p{
  color: rgba(255,255,255,.78); font-size:.86rem; line-height:1.55;
  max-height:0; opacity:0; overflow:hidden;
  transition: max-height .45s var(--ease), opacity .3s var(--ease), margin .4s var(--ease);
}
.servico-card:hover .servico-card-content p{ max-height:90px; opacity:1; margin-top:8px; }

.servico-card-link{
  display:inline-flex; align-items:center; gap:6px;
  margin-top:14px;
  font-size:.72rem; font-weight:700; text-transform:uppercase; letter-spacing:.09em;
  color: var(--gold);
  opacity:0; transform:translateY(6px);
  transition: opacity .35s var(--ease), transform .35s var(--ease);
}
.servico-card:hover .servico-card-link{ opacity:1; transform:none; }
.servico-card-link svg{ width:13px; height:13px; transition: transform .3s var(--ease); }
.servico-card:hover .servico-card-link svg{ transform: translateX(4px); }

@media (prefers-reduced-motion: reduce){
  .servico-card{ transition:none; }
}

/* ==========================================================================
   Processo
   ========================================================================== */
.processo-list{
  position:relative;
  margin-top: 56px;
  display:grid;
  gap:0;
}
.processo-list::before{
  content:"";
  position:absolute; left:31px; top:8px; bottom:8px; width:2px;
  background: linear-gradient(180deg, var(--border) 0%, rgba(201,162,75,.5) 100%);
}
.processo-list li{
  position:relative;
  display:grid; grid-template-columns: 64px 1fr;
  gap: 28px;
  padding: 22px 0;
  align-items:flex-start;
  transition: transform .3s var(--ease);
}
.processo-list li:hover{ transform: translateX(6px); }
.processo-num{
  position:relative; z-index:1;
  width:64px; height:64px; border-radius:50%;
  background: var(--navy);
  color: var(--gold);
  font-family: var(--serif);
  font-size: 1.5rem;
  font-weight:500;
  display:flex; align-items:center; justify-content:center;
  box-shadow: 0 12px 24px -10px rgba(16,26,49,.4), 0 0 0 6px var(--white);
  transition: box-shadow .3s var(--ease), transform .3s var(--ease);
}
.processo-list li:hover .processo-num{ box-shadow: 0 16px 28px -8px rgba(16,26,49,.5), 0 0 0 6px var(--white), 0 0 0 8px rgba(201,162,75,.4); }
.processo-list h3{ color: var(--navy); margin-bottom:6px; padding-top:14px; }
.processo-list p{ color: var(--ink-soft); font-size:.95rem; }

/* ==========================================================================
   Portfólio
   ========================================================================== */
.portfolio{ background: var(--off-white); }
.filters{
  display:flex; gap:10px; justify-content:center;
  margin-top: 40px; flex-wrap:wrap;
}
.filter-btn{
  padding: 9px 20px;
  border: 1.5px solid var(--border);
  border-radius: 30px;
  font-size:.85rem; font-weight:700;
  color: var(--ink-soft);
  transition: all .2s var(--ease);
  background: var(--white);
}
.filter-btn:hover{ border-color: var(--gold); color: var(--navy); }
.filter-btn.active{ background: var(--navy); border-color: var(--navy); color: var(--white); }

.portfolio-grid{
  display:grid; grid-template-columns: repeat(3, 1fr);
  gap: 20px; margin-top: 40px;
}
.port-item{
  position:relative;
  aspect-ratio: 4/3;
  border-radius: var(--radius-lg);
  box-shadow: 0 20px 40px -18px rgba(16,26,49,.3);
  transition: opacity .3s var(--ease), transform .4s var(--ease), box-shadow .4s var(--ease);
}
.port-item:hover{ transform: translateY(-6px); box-shadow: 0 30px 50px -16px rgba(16,26,49,.4); }
.port-item.hide{ display:none; }
.port-item img{ transition: transform .6s var(--ease); }
.port-item:hover img{ transform: scale(1.08); }
.port-overlay{
  position:absolute; inset:0;
  background: linear-gradient(180deg, transparent 45%, rgba(10,16,32,.88) 100%);
  display:flex; align-items:flex-end;
  padding: 20px;
  opacity:0; transition: opacity .35s var(--ease);
}
.port-item:hover .port-overlay{ opacity:1; }
.port-cat{
  display:inline-flex; align-items:center; gap:6px;
  font-size:.7rem; font-weight:700; text-transform:uppercase; letter-spacing:.1em;
  color: var(--gold);
  background: rgba(255,255,255,.1);
  border: 1px solid rgba(201,162,75,.5);
  padding: 6px 12px;
  border-radius: 999px;
  backdrop-filter: blur(4px);
}

/* ==========================================================================
   Depoimentos
   ========================================================================== */
.depo-grid{
  display:grid; grid-template-columns: repeat(3, 1fr);
  gap: 24px; margin-top: 56px;
}
.depo-card{
  position:relative;
  background: var(--off-white);
  padding: 36px 28px 28px;
  border-radius: var(--radius-lg);
  border: 1px solid var(--border);
  transition: transform .35s var(--ease), box-shadow .35s var(--ease), border-color .35s var(--ease);
}
.depo-card:hover{
  transform: translateY(-6px);
  box-shadow: 0 24px 44px -18px rgba(22,35,63,.18);
  border-color: rgba(201,162,75,.4);
}
.depo-quote-mark{ font-family: var(--serif); font-size:2.6rem; color: var(--gold); line-height:1; display:block; margin-bottom:4px; }
.depo-card p{ color: var(--ink); margin-bottom:24px; font-size:1rem; line-height:1.6; }
.depo-card footer{ display:flex; align-items:center; gap:12px; }
.depo-avatar{
  flex-shrink:0; width:42px; height:42px; border-radius:50%;
  background: var(--navy);
  color: var(--gold);
  display:flex; align-items:center; justify-content:center;
  font-family: var(--serif); font-weight:600; font-size:.95rem;
}
.depo-card footer strong{ display:block; color: var(--navy); font-size:.92rem; }
.depo-card footer span{ color: var(--ink-soft); font-size:.82rem; }

/* ==========================================================================
   Clientes
   ========================================================================== */
.clientes-grid{
  display:grid; grid-template-columns: repeat(4, 1fr);
  gap: 32px;
  margin-top: 48px;
  align-items:center;
}
.clientes-grid img{
  max-height: 42px;
  width:auto;
  margin:0 auto;
  filter: grayscale(1) opacity(.55);
  transition: filter .25s var(--ease), transform .25s var(--ease);
}
.clientes-grid img:hover{ filter: grayscale(0) opacity(1); transform: translateY(-3px); }

/* ==========================================================================
   FAQ
   ========================================================================== */
.faq-wrap{ max-width: 800px; }
.faq-list{ margin-top: 48px; display:grid; gap:12px; }
.faq-item{
  background: var(--off-white);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  padding: 22px 24px;
  transition: border-color .3s var(--ease), box-shadow .3s var(--ease);
}
.faq-item:hover{ border-color: rgba(201,162,75,.4); }
.faq-item[open]{ box-shadow: 0 16px 32px -18px rgba(22,35,63,.16); border-color: rgba(201,162,75,.5); }
.faq-item summary{
  cursor:pointer;
  font-weight:700;
  color: var(--navy);
  font-size:1.02rem;
  list-style:none;
  display:flex; justify-content:space-between; align-items:center;
  gap: 16px;
}
.faq-item summary::-webkit-details-marker{ display:none; }
.faq-item summary::after{
  content:"+";
  flex-shrink:0;
  width:30px; height:30px; border-radius:50%;
  background: var(--navy);
  color: var(--gold);
  font-family: var(--serif);
  font-size:1.2rem;
  display:flex; align-items:center; justify-content:center;
  transition: transform .3s var(--ease);
}
.faq-item[open] summary::after{ transform: rotate(45deg); }
.faq-item p{ color: var(--ink-soft); margin-top:14px; font-size:.96rem; }

/* ==========================================================================
   Contato
   ========================================================================== */
.contato{ background: var(--off-white); }
.contato-grid{
  display:grid; grid-template-columns: .9fr 1.1fr;
  gap: 64px;
}
.contato-info{
  display:flex; flex-direction:column; gap:12px;
  margin-top: 28px;
}
.contato-info a, .contato-info span{
  font-weight:700; color: var(--navy); font-size:1.05rem;
  display:flex; align-items:center; gap:10px;
}
.contato-info a:hover{ color: var(--blue); }

.contato-form{
  background: var(--white);
  padding: 40px;
  border-radius: var(--radius-lg);
  border: 1px solid var(--border);
  box-shadow: 0 30px 60px -24px rgba(16,26,49,.18);
  display:grid; gap:18px;
  position:relative;
  overflow:hidden;
}
.contato-form::before{
  content:"";
  position:absolute; top:0; left:0; right:0; height:4px;
  background: linear-gradient(90deg, var(--navy), var(--gold));
}
.contato-form label{
  display:flex; flex-direction:column; gap:8px;
  font-size:.85rem; font-weight:700; color: var(--navy);
}
.contato-form input, .contato-form textarea{
  border: 1.5px solid var(--border);
  border-radius: var(--radius);
  padding: 12px 14px;
  font-size:.95rem;
  color: var(--ink);
  transition: border-color .2s var(--ease), box-shadow .2s var(--ease);
  resize: vertical;
}
.contato-form input:focus, .contato-form textarea:focus{
  outline:none; border-color: var(--gold); box-shadow: 0 0 0 4px rgba(201,162,75,.15);
}
.contato-form .btn-primary{ margin-top:6px; }
.form-note{ font-size:.85rem; color: var(--blue); min-height:1em; }

/* ==========================================================================
   Footer
   ========================================================================== */
.footer{ background: var(--navy-deep); color: rgba(255,255,255,.7); position:relative; }
.footer::before{
  content:"";
  position:absolute; top:0; left:0; right:0; height:1px;
  background: linear-gradient(90deg, transparent, rgba(201,162,75,.5), transparent);
}
.footer-inner{
  display:grid; grid-template-columns: 1.2fr 1fr 1fr;
  gap: 40px;
  padding: 64px 32px 40px;
}
.footer-brand p{ margin-top:14px; font-size:.9rem; max-width:280px; }
.footer-links, .footer-contact{ display:flex; flex-direction:column; gap:12px; }
.footer-links a, .footer-contact a, .footer-contact span{
  font-size:.9rem; color: rgba(255,255,255,.7);
  transition: color .25s var(--ease);
}
.footer-links a:hover, .footer-contact a:hover{ color: var(--gold); }
.footer-bottom{
  border-top: 1px solid rgba(255,255,255,.1);
  padding: 22px 32px;
  font-size:.8rem;
  color: rgba(255,255,255,.45);
}

/* ==========================================================================
   WhatsApp float
   ========================================================================== */
.whatsapp-float{
  position: fixed; right:24px; bottom:24px; z-index:200;
  width:56px; height:56px; border-radius:50%;
  background:#25D366; color:#fff;
  display:flex; align-items:center; justify-content:center;
  box-shadow: 0 8px 24px rgba(0,0,0,.25);
  transition: transform .25s var(--ease);
}
.whatsapp-float svg{ width:28px; height:28px; }
.whatsapp-float:hover{ transform: scale(1.08); }

/* ==========================================================================
   Reveal on scroll
   ========================================================================== */
.reveal{
  opacity:0; transform: translateY(24px);
  transition: opacity .7s var(--ease), transform .7s var(--ease);
}
.reveal.in{ opacity:1; transform:none; }

@media (prefers-reduced-motion: reduce){
  .reveal{ opacity:1; transform:none; transition:none; }
  html{ scroll-behavior:auto; }
  .logo-mark{ animation: none; }
}

/* ==========================================================================
   Página de serviço · hero
   ========================================================================== */
.hero.hero-sm{ min-height: 62vh; }
.hero-back{
  display:inline-flex; align-items:center; gap:8px;
  padding: 9px 18px 9px 14px;
  border: 1px solid rgba(255,255,255,.32);
  border-radius: 999px;
  background: rgba(255,255,255,.06);
  backdrop-filter: blur(6px);
  color: rgba(255,255,255,.92);
  font-size:.82rem; font-weight:600;
  margin-bottom: 26px;
  transition: background .3s var(--ease), border-color .3s var(--ease), transform .3s var(--ease);
}
.hero-back svg{ width:15px; height:15px; transition: transform .3s var(--ease); }
.hero-back:hover{ background: rgba(255,255,255,.14); border-color: rgba(201,162,75,.6); transform: translateX(-3px); }
.hero-back:hover svg{ transform: translateX(-3px); }
.hero-tag{
  display:inline-flex; align-items:center; gap:8px;
  font-size:.72rem; font-weight:700; text-transform:uppercase; letter-spacing:.14em;
  color: var(--gold);
  margin-bottom:16px;
}
.hero-tag::before{ content:""; width:28px; height:1px; background: var(--gold); }

/* ==========================================================================
   Página de serviço · corpo
   ========================================================================== */
.service-body{ background: var(--white); }
.service-lede{
  font-size: 1.12rem; line-height:1.75; color: var(--ink-soft);
  max-width: 720px;
}
.service-lede strong{ color: var(--navy); }

.service-feature-grid{
  display:grid; grid-template-columns: repeat(2, 1fr);
  gap: 20px 28px;
  margin-top: 40px;
}
.service-feature{
  display:flex; align-items:flex-start; gap:16px;
  padding: 20px;
  background: var(--off-white);
  border-radius: var(--radius-lg);
  border: 1px solid var(--border);
  transition: transform .3s var(--ease), box-shadow .3s var(--ease), border-color .3s var(--ease);
}
.service-feature:hover{
  transform: translateY(-3px);
  box-shadow: 0 16px 32px -12px rgba(22,35,63,.15);
  border-color: rgba(201,162,75,.4);
}
.service-feature-ico{
  flex-shrink:0; width:40px; height:40px; border-radius:50%;
  background: var(--navy);
  display:flex; align-items:center; justify-content:center;
}
.service-feature-ico svg{ width:18px; height:18px; color: var(--gold); }
.service-feature h4{
  font-family: var(--sans); font-size:.98rem; font-weight:700;
  color: var(--navy); margin-bottom:4px;
}
.service-feature p{ font-size:.88rem; color: var(--ink-soft); line-height:1.5; }

.service-quote{
  position:relative;
  background: var(--navy-deep);
  padding: 72px 0;
  margin-top: 88px;
  overflow:hidden;
}
.service-quote::before{
  content:"";
  position:absolute; inset:0;
  background: radial-gradient(700px 300px at 50% 0%, rgba(201,162,75,.16), transparent 70%);
  pointer-events:none;
}
.service-quote-inner{
  position:relative; z-index:1;
  max-width: 760px; margin:0 auto; text-align:center; padding: 0 32px;
}
.service-quote-mark{ font-family: var(--serif); font-size:3.2rem; color: var(--gold); line-height:1; margin-bottom:8px; }
.service-quote p{
  font-family: var(--serif); font-weight:500; font-size: clamp(1.3rem, 2.4vw, 1.7rem);
  color: var(--white); line-height:1.5;
}
.service-quote-divider{ width:56px; height:2px; background: var(--gold); margin: 24px auto 0; }

.service-cta{
  background: var(--off-white);
  padding: 80px 0;
  text-align:center;
}
.service-cta h2{ margin-bottom:14px; }
.service-cta p{ color: var(--ink-soft); max-width:520px; margin: 0 auto 32px; font-size:1.02rem; }
.service-cta .hero-actions{ justify-content:center; }

.related-services{ padding: 56px 0 88px; }
.related-services-label{
  font-size:.76rem; font-weight:700; text-transform:uppercase; letter-spacing:.12em;
  color: var(--ink-soft); text-align:center; margin-bottom:20px;
}
.related-pills{ display:flex; flex-wrap:wrap; gap:12px; justify-content:center; }
.pill-link{
  display:inline-flex; align-items:center;
  padding: 10px 20px;
  border: 1px solid var(--border);
  border-radius: 999px;
  font-size:.86rem; font-weight:600;
  color: var(--navy);
  transition: background .25s var(--ease), color .25s var(--ease), border-color .25s var(--ease), transform .25s var(--ease);
}
.pill-link:hover{ background: var(--navy); color: var(--white); border-color: var(--navy); transform: translateY(-2px); }

/* ==========================================================================
   Responsive
   ========================================================================== */
@media (max-width: 980px){
  .sobre-grid, .contato-grid{ grid-template-columns:1fr; }
  .servicos-grid{ grid-template-columns: repeat(2,1fr); }
  .depo-grid{ grid-template-columns:1fr; }
  .portfolio-grid{ grid-template-columns: repeat(2,1fr); }
  .clientes-grid{ grid-template-columns: repeat(3,1fr); }
  .footer-inner{ grid-template-columns:1fr; }
  .service-feature-grid{ grid-template-columns:1fr; }
}

@media (max-width: 760px){
  .topbar-inner{ justify-content:center; text-align:center; }
  .topbar span{ display:none; }
  .nav-links, .nav-cta{ display:none; }
  .burger{ display:flex; }
  .nav-inner{ padding: 11px 20px; }
  .logo-mark{ width:53px; height:53px; }
  .logo-word{ font-size:1.08rem; }
  .logo-word em{ font-size:.56rem; letter-spacing:.2em; }
  .nav-links.open{
    display:flex; flex-direction:column;
    position:absolute; top:100%; left:0; right:0;
    background: var(--white);
    padding: 24px 32px; gap:18px;
    border-bottom: 1px solid var(--border);
  }
  .servicos-grid{ grid-template-columns:1fr; }
  .portfolio-grid{ grid-template-columns:1fr; }
  .clientes-grid{ grid-template-columns: repeat(2,1fr); }
  .pilares{ grid-template-columns:1fr; }
  .processo-list::before{ left:24px; }
  .processo-list li{ grid-template-columns: 50px 1fr; gap:16px; }
  .processo-num{ width:50px; height:50px; font-size:1.15rem; box-shadow: 0 10px 20px -8px rgba(16,26,49,.4), 0 0 0 4px var(--white); }
  .processo-list h3{ padding-top:8px; }
  .section{ padding: 76px 0; }
  .wrap{ padding: 0 20px; }
  .sobre-badge{ left:16px; bottom:16px; padding:14px 18px; }
  .sobre-badge-num{ font-size:1.5rem; }

  .hero{ min-height: 78vh; }
  .hero-content{ padding: 52px 24px; }

  .belt{ padding: 20px 0; }
  .belt-stage{ perspective: 700px; }
  .belt-track{ gap: 26px; transform: rotateX(6deg); }
  .belt-item, .belt-item:not(.belt-badge){ height: 42px; }
  .belt-item:not(.belt-badge){ padding: 0 16px; border-radius: 8px; }
  .belt-item img{ max-height: 18px; }
  .belt-badge{ padding: 0 14px; }
  .belt-num{ font-size: 1.1rem; }
  .belt-label{ font-size:.54rem; }
  .belt::before, .belt::after{ width: 50px; }
  @keyframes beltScroll{
    from{ transform: rotateX(6deg) translateX(0); }
    to{ transform: rotateX(6deg) translateX(-50%); }
  }
}