/* ============================================================
   POWER WASH — Estética Automotiva à domicílio · Anápolis-GO
   Dark navy + azul água (paleta da marca) · Clash Display / Satoshi
   ============================================================ */

:root {
  --bg:        #06121f;
  --bg-2:      #0a1a2b;
  --panel:     #0e2336;
  --line:      rgba(255,255,255,0.08);
  --line-blue: rgba(31,159,224,0.30);
  --blue:      #1f9fe0;
  --blue-2:    #6fd3f7;
  --blue-3:    #0a5ba6;
  --navy:      #0c2f6e;
  --red:       #e2231a;
  --red-2:     #ff5a4d;
  --yellow:    #f5c518;
  --text:      #e8f1f8;
  --muted:     #8ba3b8;
  --dim:       #51677a;
  --water:     #6fd3f7;
  --display: 'Clash Display', 'Satoshi', sans-serif;
  --body:    'Satoshi', system-ui, sans-serif;
  --ease: cubic-bezier(0.16, 1, 0.3, 1);
}

* , *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
html { -webkit-text-size-adjust:100%; }
body {
  background: var(--bg);
  color: var(--text);
  font-family: var(--body);
  font-weight: 400;
  line-height: 1.6;
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
}
a { color: inherit; text-decoration: none; }
img, video { display:block; max-width:100%; }
button { font-family: inherit; cursor: pointer; border:none; background:none; color:inherit; }
::selection { background: var(--blue); color:#000; }

/* custom scrollbar */
::-webkit-scrollbar { width: 10px; }
::-webkit-scrollbar-track { background: var(--bg); }
::-webkit-scrollbar-thumb { background: #16324a; border-radius:10px; border:2px solid var(--bg); }
::-webkit-scrollbar-thumb:hover { background: var(--blue-3); }

/* grain overlay */
.grain {
  position: fixed; inset:0; z-index: 9000; pointer-events:none; opacity:0.04;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='4'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

/* ── Layout helpers ── */
.wrap { width:100%; max-width:1280px; margin:0 auto; padding:0 40px; }
.eyebrow {
  font-family: var(--body);
  font-size: 11px; font-weight:600; letter-spacing: 3.5px; text-transform:uppercase;
  color: var(--blue); display:inline-flex; align-items:center; gap:14px;
}
.eyebrow::before { content:''; width:32px; height:1px; background:var(--blue); display:block; }
.eyebrow.center::after { content:''; width:32px; height:1px; background:var(--blue); display:block; }
.eyebrow.center { justify-content:center; }

h1,h2,h3 { font-family: var(--display); font-weight:600; line-height:0.98; letter-spacing:-0.02em; }
.display-xl { font-size: clamp(48px, 8.5vw, 132px); font-weight:700; text-transform:uppercase; }
.display-l  { font-size: clamp(34px, 5vw, 76px); text-transform:uppercase; }
.gold { color: var(--blue); }
.gold-grad {
  background: linear-gradient(100deg, var(--blue) 0%, var(--blue-2) 50%, var(--blue) 100%);
  -webkit-background-clip:text; background-clip:text; color:transparent;
}

/* ── Buttons ── */
.btn {
  display:inline-flex; align-items:center; gap:12px;
  font-family: var(--body); font-size:13px; font-weight:700; letter-spacing:1.5px; text-transform:uppercase;
  padding:17px 30px; border-radius:2px; transition: all .4s var(--ease); cursor:pointer; white-space:nowrap;
}
.btn svg { width:15px; height:15px; transition: transform .4s var(--ease); }
.btn-gold { background: var(--blue); color:#04101c; }
.btn-gold:hover { background: var(--blue-2); transform: translateY(-2px); box-shadow: 0 14px 40px -12px rgba(31,159,224,.55); }
.btn-gold:hover svg { transform: translateX(5px); }
.btn-ghost { border:1px solid var(--line-blue); color:var(--text); }
.btn-ghost:hover { border-color: var(--blue); color:var(--blue); }

/* ============================================================
   NAV
   ============================================================ */
.nav {
  position: fixed; top:0; left:0; right:0; z-index:1000;
  display:flex; align-items:center; justify-content:space-between;
  padding: 26px 40px; transition: all .5s var(--ease);
}
.nav.scrolled {
  padding: 16px 40px; background: rgba(6, 18, 31,0.82);
  backdrop-filter: blur(14px); border-bottom:1px solid var(--line);
}
.brand { display:flex; align-items:center; gap:11px; }
.brand-logo { height:50px; width:auto; display:block; transition: height .4s var(--ease); filter: drop-shadow(0 4px 14px rgba(0,0,0,.45)); }
.nav.scrolled .brand-logo { height:42px; }
.footer .brand-logo { height:74px; }
.brand-mark { width:30px; height:30px; flex:none; }
.brand-text { font-family:var(--display); font-weight:700; font-size:18px; letter-spacing:0.5px; text-transform:uppercase; line-height:1; }
.brand-text small { display:block; font-family:var(--body); font-size:8.5px; font-weight:500; letter-spacing:3px; color:var(--blue); margin-top:3px; }
.nav-links { display:flex; gap:38px; list-style:none; }
.nav-links a { font-size:13px; font-weight:500; letter-spacing:0.4px; color:var(--text); position:relative; padding:4px 0; }
.nav-links a::after { content:''; position:absolute; left:0; bottom:0; width:100%; height:1px; background:var(--blue); transform:scaleX(0); transform-origin:right; transition:transform .4s var(--ease); }
.nav-links a:hover { color:var(--blue); }
.nav-links a:hover::after { transform:scaleX(1); transform-origin:left; }
.nav-cta { display:inline-flex; align-items:center; gap:9px; font-size:12px; font-weight:700; letter-spacing:1px; text-transform:uppercase; padding:12px 22px; background:var(--blue); color:#04101c; border-radius:2px; transition:all .4s var(--ease); }
.nav-cta:hover { background:var(--blue-2); transform:translateY(-1px); }
.nav-cta svg { width:13px; height:13px; }
.nav-burger { display:none; flex-direction:column; gap:5px; padding:8px; }
.nav-burger span { width:24px; height:2px; background:var(--text); transition:.3s; }

/* ============================================================
   HERO
   ============================================================ */
.hero { position:relative; height:100svh; min-height:640px; display:flex; align-items:flex-end; overflow:hidden; }
.hero-video, .hero-poster {
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:0;
}
.hero-poster { z-index:0; }
.hero-video { z-index:1; }
.hero::before { /* cinematic gradient */
  content:''; position:absolute; inset:0; z-index:2; pointer-events:none;
  background:
    linear-gradient(180deg, rgba(6, 18, 31,.55) 0%, rgba(6, 18, 31,.15) 30%, rgba(6, 18, 31,.55) 62%, rgba(6, 18, 31,.97) 100%),
    linear-gradient(90deg, rgba(6, 18, 31,.85) 0%, rgba(6, 18, 31,.30) 50%, rgba(6, 18, 31,.55) 100%);
}
.hero-glow { position:absolute; z-index:2; bottom:-10%; left:50%; transform:translateX(-50%); width:80%; height:40vh; background:radial-gradient(ellipse at center, rgba(31,159,224,.22), transparent 70%); filter:blur(40px); pointer-events:none; }
.hero-inner { position:relative; z-index:3; padding-bottom: 8vh; }
.hero h1 { margin: 22px 0 26px; max-width: 14ch; }
.hero-sub { font-size: clamp(15px, 1.5vw, 18px); color:var(--muted); font-weight:400; max-width: 50ch; line-height:1.7; }
.hero-actions { display:flex; gap:16px; flex-wrap:wrap; margin-top:38px; }
.hero-scroll {
  position:absolute; z-index:3; bottom:30px; left:50%; transform:translateX(-50%);
  display:flex; flex-direction:column; align-items:center; gap:10px;
  font-size:10px; letter-spacing:3px; text-transform:uppercase; color:var(--muted);
}
.hero-scroll .bar { width:1px; height:46px; background:linear-gradient(var(--blue), transparent); position:relative; overflow:hidden; }
.hero-scroll .bar::after { content:''; position:absolute; top:0; left:0; width:100%; height:40%; background:var(--blue); animation: scrolldown 2s var(--ease) infinite; }
@keyframes scrolldown { 0%{transform:translateY(-100%)} 100%{transform:translateY(250%)} }

/* hero floating badge */
.hero-badge {
  position:absolute; z-index:3; right:40px; bottom:21vh; text-align:right;
  border-right:1px solid var(--line-blue); padding-right:20px;
}
.hero-badge b { font-family:var(--display); font-size:40px; color: var(--red); display:block; line-height:1; }
.hero-badge span { font-size:11px; letter-spacing:1.5px; text-transform:uppercase; color:var(--muted); }

/* ============================================================
   SECTION SHELL
   ============================================================ */
.section { padding: clamp(80px, 11vh, 150px) 0; position:relative; }
.section-head { max-width: 760px; margin-bottom: 64px; }
.section-head.center { margin-left:auto; margin-right:auto; text-align:center; }
.section-head h2 { margin: 26px 0 20px; }
.section-head p { color:var(--muted); font-size:16px; max-width:54ch; }
.section-head.center p { margin:0 auto; }

/* ── Serviços ── */
.services-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; perspective:1200px; }
.service {
  background:linear-gradient(180deg, var(--panel), var(--bg-2));
  padding:42px 34px 38px; position:relative; overflow:hidden; border-radius:18px;
  border:1px solid var(--line); transform-style:preserve-3d; will-change:transform;
  box-shadow:0 20px 44px -30px rgba(0,0,0,.85);
  transition: transform .5s var(--ease), box-shadow .5s var(--ease), border-color .5s var(--ease);
}
.service::before { content:''; position:absolute; top:0; left:0; width:100%; height:3px; background:linear-gradient(90deg, var(--blue), var(--blue-2)); transform:scaleX(0); transform-origin:left; transition:transform .5s var(--ease); z-index:6; }
.service:hover { border-color:var(--line-blue); box-shadow:0 38px 70px -32px rgba(0,0,0,.95), 0 0 0 1px var(--line-blue), 0 0 50px -16px rgba(31,159,224,.28); }
.service:hover::before { transform:scaleX(1); }
.tilt-glare { position:absolute; inset:0; border-radius:inherit; pointer-events:none; opacity:0; transition:opacity .35s var(--ease); mix-blend-mode:soft-light; z-index:5; }
.service-num { font-family:var(--display); font-size:13px; color:var(--blue-2); letter-spacing:2px; display:inline-block; transform: translateZ(20px); }
.service-icon { width:48px; height:48px; margin:24px 0 26px; color:var(--blue); transform: translateZ(45px); }
.service-icon svg { width:100%; height:100%; stroke:var(--blue); fill:none; stroke-width:1.3; }
.service h3 { font-size:24px; margin-bottom:14px; text-transform:none; letter-spacing:-0.01em; transform: translateZ(30px); }
.service p { color:var(--muted); font-size:14.5px; line-height:1.75; transform: translateZ(18px); }
.service-tag { margin-top:22px; font-size:12px; letter-spacing:1px; text-transform:uppercase; color:var(--blue); display:inline-flex; gap:8px; align-items:center; transform: translateZ(26px); }

/* ============================================================
   ANTES & DEPOIS — slider
   ============================================================ */
.ba-section { background: var(--bg-2); border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.ba {
  position:relative; width:100%; aspect-ratio:16/9; max-height:78vh; overflow:hidden; border-radius:4px;
  cursor:ew-resize; user-select:none; touch-action:none; box-shadow:0 40px 80px -30px rgba(0,0,0,.8);
  --pos: 52%;
}
.ba-img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.ba-before { position:absolute; inset:0; clip-path: inset(0 calc(100% - var(--pos)) 0 0); }
/* "Antes": carro empoeirado — filme bege que clareia + textura de poeira */
.ba-before .ba-img { filter: brightness(1.12) saturate(.22) contrast(.8) sepia(.55); }
.ba-before .ba-grime {
  position:absolute; inset:0; pointer-events:none; mix-blend-mode:screen;
  background:
    radial-gradient(90% 70% at 35% 30%, rgba(214,200,168,.20), transparent 65%),
    linear-gradient(165deg, rgba(206,190,156,.34) 0%, rgba(176,158,124,.50) 100%);
}
.ba-before .ba-grime::before {
  content:''; position:absolute; inset:0; mix-blend-mode:screen; opacity:.5;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 240 240' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.018' numOctaves='3'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.6'/%3E%3C/svg%3E");
  background-size: 300px 300px;
}
.ba-before .ba-grime::after {
  content:''; position:absolute; inset:0; mix-blend-mode:overlay; opacity:.35;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 100 100' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  background-size: 110px 110px;
}
.ba-divider { position:absolute; top:0; bottom:0; left:var(--pos); width:2px; background:var(--blue); transform:translateX(-1px); z-index:4; box-shadow:0 0 18px rgba(31,159,224,.8); }
.ba-grip {
  position:absolute; top:50%; left:50%; transform:translate(-50%,-50%);
  width:54px; height:54px; border-radius:50%; background:rgba(6, 18, 31,.6); backdrop-filter:blur(6px);
  border:1.5px solid var(--blue); display:flex; align-items:center; justify-content:center; color:var(--blue);
}
.ba-grip svg { width:22px; height:22px; }
.ba-label {
  position:absolute; bottom:22px; z-index:4; font-size:11px; font-weight:700; letter-spacing:2.5px; text-transform:uppercase;
  padding:8px 16px; border:1px solid var(--line-blue); background:rgba(6, 18, 31,.5); backdrop-filter:blur(6px); border-radius:2px;
}
.ba-label-before { left:22px; color:var(--muted); }
.ba-label-after  { right:22px; color:var(--blue); }
.ba-hint { text-align:center; margin-top:20px; font-size:12px; letter-spacing:1.5px; text-transform:uppercase; color:var(--dim); }

/* ============================================================
   COMO FUNCIONA
   ============================================================ */
.steps { display:grid; grid-template-columns:repeat(3,1fr); gap:34px; }
.step { position:relative; padding-top:34px; border-top:1px solid var(--line); }
.step-n { font-family:var(--display); font-size:64px; font-weight:700; color:transparent; -webkit-text-stroke:1px var(--blue-3); line-height:.8; }
.step h3 { font-size:22px; margin:18px 0 12px; text-transform:none; }
.step p { color:var(--muted); font-size:14.5px; }

/* ── Diferenciais strip ── */
.strip { display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--line); border:1px solid var(--line); }
.strip > div { background:var(--bg); padding:34px 26px; text-align:center; }
.strip b { font-family:var(--display); font-size:34px; color:var(--blue); display:block; }
.strip span { font-size:12.5px; color:var(--muted); letter-spacing:.5px; margin-top:6px; display:block; }

/* ── Showcase ── */
.showcase { display:grid; grid-template-columns:1.4fr 1fr 1fr; grid-auto-rows: 230px; gap:14px; }
.shot { position:relative; overflow:hidden; border-radius:4px; }
.shot img { width:100%; height:100%; object-fit:cover; transition:transform 1s var(--ease); filter:saturate(1.05); }
.shot:hover img { transform:scale(1.07); }
.shot.tall { grid-row: span 2; }
.shot::after { content:''; position:absolute; inset:0; background:linear-gradient(transparent 55%, rgba(6, 18, 31,.7)); }
.shot span { position:absolute; left:18px; bottom:16px; z-index:2; font-size:11px; letter-spacing:2px; text-transform:uppercase; color:var(--blue); }

/* ── Sobre ── */
.about { display:grid; grid-template-columns:1fr 1fr; gap:80px; align-items:center; }
.about-statement { font-family:var(--display); font-weight:500; font-size:clamp(24px,2.6vw,38px); line-height:1.25; letter-spacing:-0.01em; }
.about-statement em { font-style:normal; color:var(--blue); }
.about-media { position:relative; aspect-ratio:4/5; overflow:hidden; border-radius:4px; border:1px solid var(--line-blue); }
.about-media img { width:100%; height:100%; object-fit:cover; }

/* ============================================================
   CTA FINAL
   ============================================================ */
.cta { position:relative; text-align:center; overflow:hidden; }
.cta::before { content:''; position:absolute; inset:0; background:radial-gradient(ellipse 60% 80% at 50% 50%, rgba(31,159,224,.14), transparent 70%); pointer-events:none; }
.cta h2 { margin:24px auto 22px; max-width:16ch; }
.cta p { color:var(--muted); max-width:46ch; margin:0 auto 38px; }
.cta-actions { display:flex; gap:16px; justify-content:center; flex-wrap:wrap; }

/* ============================================================
   FOOTER
   ============================================================ */
.footer { border-top:1px solid var(--line); padding:70px 0 36px; }
.footer-top { display:grid; grid-template-columns:1.6fr 1fr 1fr; gap:48px; padding-bottom:50px; border-bottom:1px solid var(--line); }
.footer-brand p { color:var(--muted); font-size:14px; max-width:42ch; margin-top:20px; }
.footer-col h4 { font-family:var(--display); font-size:12px; letter-spacing:2px; text-transform:uppercase; color:var(--muted); margin-bottom:20px; }
.footer-col a { display:block; color:var(--text); font-size:14px; padding:7px 0; transition:color .3s; }
.footer-col a:hover { color:var(--blue); }
.footer-bottom { display:flex; justify-content:space-between; align-items:center; padding-top:28px; font-size:12px; color:var(--dim); flex-wrap:wrap; gap:10px; }

/* ============================================================
   REVEAL
   ============================================================ */
.reveal { opacity:0; transform:translateY(30px); transition: opacity 1s var(--ease), transform 1s var(--ease); }
.reveal.in { opacity:1; transform:none; }

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (max-width: 1080px) {
  .nav-links, .nav .nav-cta { display:none; }
  .nav-burger { display:flex; }
  .services-grid, .steps, .strip { grid-template-columns:1fr 1fr; }
  .showcase { grid-template-columns:1fr 1fr; }
  .about { grid-template-columns:1fr; gap:40px; }
  .footer-top { grid-template-columns:1fr 1fr; }
}
@media (max-width: 680px) {
  .wrap { padding:0 22px; }
  .nav, .nav.scrolled { padding:16px 22px; }
  .hero { align-items:flex-end; }
  .hero h1 { margin:16px 0 20px; }
  .hero-badge { display:none; }
  .hero-actions .btn { flex:1; justify-content:center; }
  .services-grid, .steps, .strip, .showcase, .footer-top { grid-template-columns:1fr; }
  .shot.tall { grid-row: span 1; }
  .section-head { margin-bottom:44px; }
  .ba-grip { width:44px; height:44px; }
}

/* ── Mobile drawer ── */
.drawer { position:fixed; inset:0; z-index:1200; background:rgba(6, 18, 31,.97); backdrop-filter:blur(10px); transform:translateX(100%); transition:transform .5s var(--ease); display:flex; flex-direction:column; padding:90px 32px 40px; }
.drawer.open { transform:none; }
.drawer a { font-family:var(--display); font-size:30px; text-transform:uppercase; padding:16px 0; border-bottom:1px solid var(--line); transition:color .3s; }
.drawer a:hover { color:var(--blue); }
.drawer .btn { margin-top:32px; justify-content:center; }
.drawer-close { position:absolute; top:24px; right:24px; width:44px; height:44px; border:1px solid var(--line); border-radius:50%; display:flex; align-items:center; justify-content:center; }
.drawer-close svg { width:18px; height:18px; stroke:var(--text); }
.no-scroll { overflow:hidden; }

/* ============================================================
   PROVAS SOCIAIS — marquee
   ============================================================ */
.proof { background: var(--bg-2); border-top:1px solid var(--line); border-bottom:1px solid var(--line); overflow:hidden; }
.proof-stats { display:flex; gap:60px; justify-content:center; flex-wrap:wrap; margin-bottom:58px; }
.proof-stat { text-align:center; }
.proof-stat b { font-family:var(--display); font-weight:700; font-size:clamp(34px,4vw,52px); color:var(--blue); display:block; line-height:1; }
.proof-stat b em { font-style:normal; color:var(--yellow); }
.proof-stat span { font-size:12px; letter-spacing:1.5px; text-transform:uppercase; color:var(--muted); margin-top:8px; display:block; }
.proof-rows { display:flex; flex-direction:column; gap:18px; position:relative; }
.proof-rows::before, .proof-rows::after { content:''; position:absolute; top:0; bottom:0; width:140px; z-index:4; pointer-events:none; }
.proof-rows::before { left:0; background:linear-gradient(90deg, var(--bg-2), transparent); }
.proof-rows::after { right:0; background:linear-gradient(270deg, var(--bg-2), transparent); }
.proof-track { display:flex; gap:18px; width:max-content; }
.proof-track.left  { animation: marqL 46s linear infinite; }
.proof-track.right { animation: marqR 54s linear infinite; }
.proof:hover .proof-track { animation-play-state: paused; }
@keyframes marqL { from { transform:translateX(0); } to { transform:translateX(-50%); } }
@keyframes marqR { from { transform:translateX(-50%); } to { transform:translateX(0); } }
.proof-card {
  width:380px; flex:none; background:var(--panel); border:1px solid var(--line);
  border-radius:16px; padding:28px 28px 26px; transition: border-color .4s var(--ease), transform .4s var(--ease);
}
.proof-card:hover { border-color:var(--line-blue); transform:translateY(-4px); }
.proof-stars { color:var(--yellow); letter-spacing:3px; font-size:15px; margin-bottom:14px; }
.proof-quote { font-size:14.5px; line-height:1.7; color:var(--text); margin-bottom:22px; }
.proof-author { display:flex; align-items:center; gap:13px; }
.proof-avatar { width:44px; height:44px; border-radius:50%; flex:none; display:flex; align-items:center; justify-content:center; font-family:var(--display); font-weight:700; font-size:15px; color:#fff; background:linear-gradient(135deg, var(--blue), var(--blue-3)); }
.proof-name { font-family:var(--display); font-weight:600; font-size:15px; }
.proof-meta { font-size:12px; color:var(--muted); }
@media (max-width:680px){
  .proof-card { width:300px; padding:24px 22px; }
  .proof-stats { gap:32px; }
  .proof-rows::before, .proof-rows::after { width:60px; }
}

/* ============================================================
   BOTÕES FLUTUANTES — WhatsApp + Agendamento online
   ============================================================ */
.fab-stack { position:fixed; right:24px; bottom:24px; z-index:1150; display:flex; flex-direction:column; align-items:flex-end; gap:14px; }
.fab-agendar {
  display:inline-flex; align-items:center; gap:10px; padding:14px 20px; border-radius:40px;
  background:linear-gradient(120deg, var(--blue), var(--blue-3)); color:#fff;
  font-family:var(--display); font-weight:600; font-size:13px; letter-spacing:.3px;
  box-shadow:0 14px 32px -10px rgba(31,159,224,.6); transition:transform .35s var(--ease), box-shadow .35s var(--ease);
  white-space:nowrap;
}
.fab-agendar svg { width:18px; height:18px; }
.fab-agendar:hover { transform:translateY(-3px); box-shadow:0 20px 44px -10px rgba(31,159,224,.8); }
.fab-wa {
  width:62px; height:62px; border-radius:50%; background:#25d366; color:#fff;
  display:flex; align-items:center; justify-content:center; position:relative;
  box-shadow:0 14px 34px -8px rgba(37,211,102,.55); transition:transform .3s var(--ease);
}
.fab-wa svg { width:34px; height:34px; }
.fab-wa:hover { transform:scale(1.08); }
.fab-wa::before { content:''; position:absolute; inset:0; border-radius:50%; background:#25d366; z-index:-1; animation:fabpulse 2.4s ease-out infinite; }
@keyframes fabpulse { 0%{transform:scale(1); opacity:.55} 80%,100%{transform:scale(1.75); opacity:0} }
@media (max-width:680px){
  .fab-stack { right:16px; bottom:16px; gap:12px; }
  .fab-wa { width:56px; height:56px; } .fab-wa svg { width:30px; height:30px; }
  .fab-agendar { padding:12px 17px; font-size:12px; }
}

/* ── Instagram no nav ── */
.nav-social { width:40px; height:40px; border-radius:50%; border:1px solid var(--line-blue); display:flex; align-items:center; justify-content:center; color:var(--text); flex:none; transition:all .35s var(--ease); }
.nav-social svg { width:18px; height:18px; }
.nav-social:hover { background:linear-gradient(45deg,#f09433,#e6683c,#dc2743,#cc2366,#bc1888); border-color:transparent; color:#fff; transform:translateY(-1px); box-shadow:0 8px 22px -8px rgba(220,39,67,.6); }
@media (max-width:680px){ .nav-social { width:38px; height:38px; margin-right:4px; } }