/* ==========================================================================
   ZECA SOUND & FILM — Design tokens
   Palette: preto profundo + laranja vibrante (identidade solicitada),
   com uma segunda camada de laranja mais fechado para os degradês.
   Tipografia: Rajdhani (display, técnica/automotiva) + Inter (leitura) +
   Space Mono (números, horários, telefone — leitura tipo painel digital).
   Assinatura visual: barras de equalizador animadas, usadas como divisor
   de seções e elemento decorativo recorrente (referência direta ao "Sound").
   ========================================================================== */

:root{
  --black:        #0a0a0d;
  --black-soft:   #131317;
  --black-elev:   #1b1b21;
  --white:        #f7f5f1;
  --white-dim:    #cfccc6;
  --orange:       #ff6a00;
  --orange-deep:  #b8360a;
  --orange-light: #ffa64d;

  --grad-brand: linear-gradient(135deg, var(--black) 0%, #2a1206 55%, var(--orange-deep) 100%);
  --grad-orange: linear-gradient(120deg, var(--orange) 0%, var(--orange-deep) 100%);

  --font-display: 'Rajdhani', sans-serif;
  --font-body: 'Inter', sans-serif;
  --font-mono: 'Space Mono', monospace;

  --radius-s: 10px;
  --radius-m: 18px;
  --radius-l: 28px;

  --shadow-soft: 0 20px 50px -20px rgba(0,0,0,.55);
  --shadow-orange: 0 16px 40px -14px rgba(255,106,0,.45);

  --ease: cubic-bezier(.22,1,.36,1);
  --header-h: 84px;

  /* Ajuste fino da foto de fundo do Hero (a imagem preenche toda a tela):
     --hero-zoom: 1 = tamanho normal; valores acima de 1 (ex: 1.1) aproximam mais, abaixo (ex: 0.9) afastam.
     --hero-pos: controla qual parte da foto fica visível (ex: "center top", "center 30%", "left center"). */
  --hero-zoom: 1;
  --hero-pos: center center;
}

*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; scroll-padding-top: var(--header-h); }
@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior:auto; }
  *,*::before,*::after{ animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important; }
}

body{
  margin:0;
  background:var(--black);
  color:var(--white);
  font-family:var(--font-body);
  line-height:1.6;
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
}

img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }
button{ font-family:inherit; cursor:pointer; }
ul{ list-style:none; margin:0; padding:0; }
.icon{ display:inline-block; vertical-align:middle; }

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

:focus-visible{
  outline:2px solid var(--orange-light);
  outline-offset:3px;
  border-radius:4px;
}

/* ---------- Typography ---------- */
.eyebrow{
  font-family:var(--font-mono);
  font-size:.78rem;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--orange-light);
  margin:0 0 14px;
  display:flex;
  align-items:center;
  gap:10px;
}
.eyebrow::before{
  content:"";
  width:26px; height:2px;
  background:var(--grad-orange);
  display:inline-block;
}
.eyebrow-center{ justify-content:center; }
.eyebrow-center::before{ display:none; }
.eyebrow-mono{ color:var(--white-dim); }

.section-title{
  font-family:var(--font-display);
  font-weight:700;
  font-size:clamp(1.9rem, 3.6vw, 3rem);
  line-height:1.08;
  letter-spacing:.01em;
  margin:0 0 22px;
  color:var(--white);
}
.section-title span{ color:var(--orange); }
.section-title-center{ text-align:center; margin-left:auto; margin-right:auto; max-width:720px; }

.section-subtitle{
  text-align:center;
  max-width:620px;
  margin:-8px auto 48px;
  color:var(--white-dim);
  font-size:1.02rem;
}

.body-lg{ font-size:1.05rem; color:var(--white-dim); max-width:560px; }

.mono-num{ font-family:var(--font-mono); letter-spacing:.03em; }

.section{ padding:110px 0; position:relative; }
@media (max-width:720px){ .section{ padding:76px 0; } }

/* ---------- Buttons ---------- */
.btn{
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding:16px 30px;
  font-family:var(--font-display);
  font-weight:600;
  font-size:1rem;
  letter-spacing:.03em;
  border-radius:100px;
  border:1.5px solid transparent;
  transition:transform .35s var(--ease), box-shadow .35s var(--ease), background .35s var(--ease), border-color .35s var(--ease);
  white-space:nowrap;
}
.btn .icon{ transition:transform .35s var(--ease); }
.btn:hover{ transform:translateY(-3px); }
.btn:hover .icon{ transform:translateX(3px); }

.btn-primary{
  background:var(--grad-orange);
  color:var(--black);
  box-shadow:var(--shadow-orange);
}
.btn-primary:hover{ box-shadow:0 22px 48px -12px rgba(255,106,0,.65); }

.btn-secondary{
  background:rgba(255,255,255,.04);
  color:var(--white);
  border-color:rgba(247,245,241,.35);
  backdrop-filter:blur(6px);
}
.btn-secondary:hover{ border-color:var(--orange-light); background:rgba(255,106,0,.08); }

.btn-lg{ padding:19px 40px; font-size:1.08rem; }

.btn-nav-cta{ padding:11px 22px; font-size:.88rem; }

/* ==========================================================================
   HEADER
   ========================================================================== */
.site-header{
  position:fixed; inset:0 0 auto 0;
  height:var(--header-h);
  z-index:100;
  background:transparent;
  transition:background .4s var(--ease), box-shadow .4s var(--ease), height .4s var(--ease);
}
.site-header.is-scrolled{
  background:rgba(10,10,13,.86);
  backdrop-filter:blur(14px) saturate(140%);
  box-shadow:0 10px 30px -18px rgba(0,0,0,.7);
  height:74px;
}

.header-inner{
  height:100%;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
}

.brand{ display:flex; align-items:center; gap:12px; flex-shrink:0; }
.brand-mark{ height:38px; width:auto; filter:drop-shadow(0 4px 12px rgba(255,106,0,.35)); }
.brand-name{ font-family:var(--font-display); font-weight:600; font-size:1.15rem; letter-spacing:.02em; }
.brand-name strong{ color:var(--orange); font-weight:700; }

.main-nav{ display:flex; align-items:center; gap:34px; }
.main-nav ul{ display:flex; gap:28px; }
.nav-link{
  position:relative;
  font-size:.94rem;
  font-weight:500;
  padding:6px 0;
  color:var(--white-dim);
  transition:color .3s var(--ease);
}
.nav-link::after{
  content:"";
  position:absolute; left:0; bottom:-2px;
  width:0; height:2px;
  background:var(--grad-orange);
  transition:width .35s var(--ease);
}
.nav-link:hover, .nav-link.active-link{ color:var(--white); }
.nav-link:hover::after, .nav-link.active-link::after{ width:100%; }

.hamburger{
  display:none;
  position:relative;
  width:44px; height:44px;
  align-items:center; justify-content:center;
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.12);
  border-radius:50%;
  color:var(--white);
  z-index:120;
}
.hamburger .icon-close{ display:none; position:absolute; }
.hamburger .icon-open{ position:absolute; }
.hamburger.is-open .icon-open{ display:none; }
.hamburger.is-open .icon-close{ display:block; }

.nav-overlay{
  position:fixed; inset:0;
  background:rgba(0,0,0,.55);
  backdrop-filter:blur(3px);
  opacity:0; pointer-events:none;
  transition:opacity .35s var(--ease);
  z-index:95;
}
.nav-overlay.is-visible{ opacity:1; pointer-events:auto; }

@media (max-width:960px){
  .main-nav{
    position:fixed; top:0; right:0; height:100vh;
    width:min(320px, 82vw);
    background:linear-gradient(160deg, var(--black-soft), var(--black));
    border-left:1px solid rgba(255,106,0,.18);
    flex-direction:column; align-items:flex-start;
    padding:110px 32px 40px;
    gap:36px;
    transform:translateX(100%);
    transition:transform .45s var(--ease);
    z-index:110;
  }
  .main-nav.is-open{ transform:translateX(0); }
  .main-nav ul{ flex-direction:column; gap:22px; width:100%; }
  .nav-link{ font-size:1.08rem; display:block; }
  .btn-nav-cta{ width:100%; justify-content:center; }
  .hamburger{ display:flex; }
}

/* ==========================================================================
   EQUALIZER SIGNATURE MOTIF
   ========================================================================== */
.eq-bars{
  display:inline-flex;
  align-items:flex-end;
  gap:4px;
  height:20px;
}
.eq-bars i{
  width:3px;
  background:var(--grad-orange);
  border-radius:2px;
  animation:eq-bounce 1.1s ease-in-out infinite;
}
.eq-bars i:nth-child(1){ height:35%; animation-delay:-1.1s; }
.eq-bars i:nth-child(2){ height:70%; animation-delay:-0.9s; }
.eq-bars i:nth-child(3){ height:100%; animation-delay:-0.7s; }
.eq-bars i:nth-child(4){ height:50%; animation-delay:-0.5s; }
.eq-bars i:nth-child(5){ height:85%; animation-delay:-0.3s; }
.eq-bars i:nth-child(6){ height:40%; animation-delay:-0.15s; }
.eq-bars i:nth-child(7){ height:65%; animation-delay:-0.6s; }
.eq-bars i:nth-child(8){ height:30%; animation-delay:-0.2s; }
@keyframes eq-bounce{
  0%,100%{ transform:scaleY(.35); }
  50%{ transform:scaleY(1); }
}
.eq-bars--large{ height:120px; gap:8px; }
.eq-bars--large i{ width:7px; border-radius:4px; }

.hero-eq{
  position:absolute; left:0; right:0; bottom:0;
  height:64px;
  display:flex; align-items:flex-end; justify-content:center; gap:6px;
  padding:0 6%;
  z-index:2;
  -webkit-mask-image:linear-gradient(to top, black, transparent);
  mask-image:linear-gradient(to top, black, transparent);
}
.hero-eq::before{
  content:"";
  position:absolute; inset:0;
  background-image:repeating-linear-gradient(90deg, var(--orange) 0 3px, transparent 3px 22px);
  opacity:.5;
  animation:eq-scroll 5s linear infinite;
  height:60%;
  align-self:flex-end;
  bottom:0;
}
@keyframes eq-scroll{
  0%{ transform:translateX(0); }
  100%{ transform:translateX(-22px); }
}

/* ==========================================================================
   HERO
   ========================================================================== */
.hero{
  position:relative;
  min-height:100vh;
  display:flex; align-items:center;
  overflow:hidden;
}
.hero-media{ position:absolute; inset:0; z-index:0; overflow:hidden; }
.hero-img{
  width:100%; height:100%;
  object-fit:cover;
  object-position: var(--hero-pos, center center);
  transform: scale(var(--hero-zoom, 1));
  transform-origin:center center;
}
.hero-overlay{
  position:absolute; inset:0;
  background:
    linear-gradient(180deg, rgba(10,10,13,.55) 0%, rgba(10,10,13,.72) 45%, var(--black) 100%),
    linear-gradient(100deg, rgba(10,10,13,.75) 10%, rgba(184,54,10,.25) 100%);
}

.hero-content{ position:relative; z-index:2; padding-top:var(--header-h); text-align:left; max-width:760px; }
.hero-logo{ width:150px; margin-bottom:22px; opacity:.95; }
.hero-title{
  font-family:var(--font-display);
  font-weight:700;
  font-size:clamp(2.6rem, 6.6vw, 5.2rem);
  line-height:.98;
  margin:0 0 20px;
  letter-spacing:.01em;
}
.hero-title span{
  background:var(--grad-orange);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
}
.hero-subtitle{
  font-size:clamp(1.02rem, 1.6vw, 1.28rem);
  color:var(--white-dim);
  max-width:560px;
  margin:0 0 40px;
}
.hero-actions{ display:flex; flex-wrap:wrap; gap:18px; }

.scroll-cue{
  position:absolute; left:50%; bottom:26px; transform:translateX(-50%);
  z-index:2;
  width:26px; height:42px;
  border:2px solid rgba(247,245,241,.4);
  border-radius:20px;
}
.scroll-cue span{
  position:absolute; top:8px; left:50%; transform:translateX(-50%);
  width:4px; height:8px;
  background:var(--orange);
  border-radius:3px;
  animation:scroll-cue 1.8s ease-in-out infinite;
}
@keyframes scroll-cue{
  0%{ opacity:1; top:8px; }
  70%{ opacity:0; top:22px; }
  100%{ opacity:0; top:8px; }
}

@media (max-width:720px){
  .hero-content{ text-align:left; }
  .hero-actions{ flex-direction:column; align-items:stretch; }
  .hero-actions .btn{ justify-content:center; }
}

/* ==========================================================================
   SOBRE
   ========================================================================== */
.section-sobre{ background:var(--black); }
.sobre-grid{
  display:grid;
  grid-template-columns:1.1fr .8fr;
  gap:70px;
  align-items:center;
}
.differentials{ display:grid; gap:16px; margin-top:34px; }
.differentials li{
  display:flex; align-items:center; gap:12px;
  font-family:var(--font-display); font-weight:600; font-size:1.02rem;
  color:var(--white);
}
.differentials .icon{ color:var(--orange); flex-shrink:0; }

.waveform-panel{
  background:var(--grad-brand);
  border-radius:var(--radius-l);
  border:1px solid rgba(255,106,0,.25);
  min-height:340px;
  display:flex; align-items:center; justify-content:center;
  box-shadow:var(--shadow-soft);
  position:relative;
  overflow:hidden;
}
.waveform-panel::before{
  content:"";
  position:absolute; inset:0;
  background-image:radial-gradient(circle, rgba(255,106,0,.18) 1px, transparent 1px);
  background-size:22px 22px;
  opacity:.5;
}

@media (max-width:900px){
  .sobre-grid{ grid-template-columns:1fr; gap:48px; }
  .sobre-visual{ order:-1; }
  .waveform-panel{ min-height:220px; }
}

/* ==========================================================================
   SERVIÇOS
   ========================================================================== */
.section-servicos{ background:linear-gradient(180deg, var(--black) 0%, var(--black-soft) 100%); }
.servicos-grid{
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  gap:26px;
}
.servicos-grid .card-servico{
  flex:1 1 280px;
  max-width:340px;
}
.card-servico{
  background:var(--black-elev);
  border:1px solid rgba(255,255,255,.06);
  border-radius:var(--radius-m);
  padding:34px 28px;
  transition:transform .4s var(--ease), border-color .4s var(--ease), box-shadow .4s var(--ease);
  position:relative;
  overflow:hidden;
}
.card-servico::before{
  content:"";
  position:absolute; top:0; left:0; right:0; height:3px;
  background:var(--grad-orange);
  transform:scaleX(0); transform-origin:left;
  transition:transform .45s var(--ease);
}
.card-servico:hover{
  transform:translateY(-8px);
  border-color:rgba(255,106,0,.35);
  box-shadow:var(--shadow-soft);
}
.card-servico:hover::before{ transform:scaleX(1); }

.card-icon{
  width:56px; height:56px;
  display:flex; align-items:center; justify-content:center;
  border-radius:50%;
  background:rgba(255,106,0,.12);
  color:var(--orange);
  margin-bottom:20px;
  transition:background .4s var(--ease), transform .4s var(--ease);
}
.card-servico:hover .card-icon{ background:var(--grad-orange); color:var(--black); transform:rotate(-8deg) scale(1.05); }

.card-servico h3{
  font-family:var(--font-display); font-size:1.28rem; font-weight:700;
  margin:0 0 10px;
}
.card-servico p{ color:var(--white-dim); font-size:.95rem; margin:0 0 22px; }

.card-link{
  display:inline-flex; align-items:center; gap:8px;
  font-family:var(--font-display); font-weight:600; font-size:.92rem;
  color:var(--orange-light);
}
.card-link .icon{ transition:transform .3s var(--ease); }
.card-link:hover .icon{ transform:translateX(4px); }

/* ==========================================================================
   ANTES E DEPOIS
   ========================================================================== */
.section-antes-depois{ background:var(--black-soft); }
.ba-grid{
  display:grid;
  grid-template-columns:repeat(2, 1fr);
  gap:36px;
}
.ba-slider{
  position:relative;
  aspect-ratio:7/5;
  border-radius:var(--radius-m);
  overflow:hidden;
  border:1px solid rgba(255,255,255,.08);
  box-shadow:var(--shadow-soft);
  user-select:none;
}
.ba-img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.ba-clip{ position:absolute; inset:0; width:50%; overflow:hidden; }
.ba-clip .ba-img{ width:var(--ba-w, 100%); max-width:none; height:100%; }
.ba-range{
  position:absolute; inset:0;
  width:100%; height:100%;
  margin:0;
  opacity:0;
  cursor:ew-resize;
  -webkit-appearance:none; appearance:none;
}
.ba-handle{
  position:absolute; top:0; bottom:0;
  transform:translateX(-50%);
  width:44px; height:44px; margin:auto 0; top:0; bottom:0;
  display:flex; align-items:center; justify-content:center;
  background:var(--grad-orange);
  color:var(--black);
  border-radius:50%;
  border:3px solid var(--white);
  pointer-events:none;
  box-shadow:0 8px 20px -6px rgba(0,0,0,.6);
}
.ba-handle::before, .ba-handle::after{
  content:""; position:absolute; top:-1000px; bottom:-1000px;
  width:2px; background:rgba(247,245,241,.85);
  left:50%; transform:translateX(-50%);
}
.ba-tag{
  position:absolute; top:14px;
  font-family:var(--font-mono); font-size:.72rem; letter-spacing:.12em;
  padding:6px 12px; border-radius:100px;
  background:rgba(10,10,13,.65); backdrop-filter:blur(4px);
  pointer-events:none;
}
.ba-tag-before{ left:14px; }
.ba-tag-after{ right:14px; }
.ba-caption{ margin:16px 4px 0; color:var(--white-dim); font-size:.95rem; }

@media (max-width:800px){
  .ba-grid{ grid-template-columns:1fr; }
}

/* ==========================================================================
   NOSSA LOJA (VÍDEO)
   ========================================================================== */
.section-loja{ background:var(--black); }
.loja-grid{
  display:grid;
  grid-template-columns:.85fr 1.15fr;
  gap:64px;
  align-items:center;
}
.loja-text .btn{ margin-top:12px; }
.video-frame{
  position:relative;
  border-radius:var(--radius-l);
  overflow:hidden;
  aspect-ratio:16/9;
  border:1px solid rgba(255,106,0,.25);
  box-shadow:var(--shadow-soft);
  background:var(--black-elev);
}
.video-frame video{ width:100%; height:100%; object-fit:cover; }
.video-play-btn{
  position:absolute; inset:0; margin:auto;
  width:82px; height:82px;
  border-radius:50%;
  border:none;
  background:rgba(10,10,13,.55);
  backdrop-filter:blur(4px);
  color:var(--white);
  display:flex; align-items:center; justify-content:center;
  transition:transform .35s var(--ease), background .35s var(--ease);
}
.video-play-btn::before{
  content:"";
  position:absolute; inset:-10px;
  border-radius:50%;
  border:2px solid rgba(255,106,0,.55);
  animation:pulse-ring 2.4s ease-out infinite;
}
@keyframes pulse-ring{
  0%{ transform:scale(.9); opacity:.8; }
  100%{ transform:scale(1.4); opacity:0; }
}
.video-play-btn:hover{ transform:scale(1.08); background:var(--grad-orange); color:var(--black); }
.video-frame.is-playing .video-play-btn{ opacity:0; pointer-events:none; }

@media (max-width:900px){
  .loja-grid{ grid-template-columns:1fr; gap:36px; }
}

/* ==========================================================================
   GALERIA
   ========================================================================== */
.section-galeria{ background:linear-gradient(180deg, var(--black-soft) 0%, var(--black) 100%); }
.galeria-grid{
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:20px;
}
.galeria-item{
  position:relative;
  border:none; padding:0;
  border-radius:var(--radius-m);
  overflow:hidden;
  aspect-ratio:1/1;
  background:none;
}
.galeria-item img{ width:100%; height:100%; object-fit:cover; transition:transform .6s var(--ease); }
.galeria-zoom{
  position:absolute; inset:0;
  display:flex; align-items:center; justify-content:center;
  background:rgba(10,10,13,0);
  color:var(--white);
  opacity:0;
  transition:opacity .35s var(--ease), background .35s var(--ease);
}
.galeria-item:hover img{ transform:scale(1.08); }
.galeria-item:hover .galeria-zoom{ opacity:1; background:rgba(10,10,13,.45); }

@media (max-width:800px){
  .galeria-grid{ grid-template-columns:repeat(2, 1fr); }
}
@media (max-width:480px){
  .galeria-grid{ grid-template-columns:1fr 1fr; gap:12px; }
}

/* ==========================================================================
   HORÁRIO + REDES SOCIAIS
   ========================================================================== */
.section-info-strip{
  padding:64px 0;
  background:var(--grad-brand);
  border-top:1px solid rgba(255,106,0,.2);
  border-bottom:1px solid rgba(255,106,0,.2);
}
.info-strip-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:40px;
}
.info-card{
  display:flex; align-items:center; gap:18px;
}
.info-card .icon{ color:var(--orange); flex-shrink:0; }
.info-card h3{ font-family:var(--font-display); font-size:1.1rem; margin:0 0 6px; }
.info-card p{ margin:0; color:var(--white-dim); }
.info-card-social{ justify-content:flex-start; }
.social-links{ display:flex; flex-direction:column; gap:10px; margin-top:10px; }
.social-link{
  display:inline-flex; align-items:center; gap:10px;
  color:var(--white-dim);
  transition:color .3s var(--ease), transform .3s var(--ease);
  width:fit-content;
}
.social-link .icon{ color:var(--orange); }
.social-link:hover{ color:var(--white); transform:translateX(4px); }

@media (max-width:720px){
  .info-strip-grid{ grid-template-columns:1fr; gap:30px; }
}

/* ==========================================================================
   CONTATO
   ========================================================================== */
.section-contato{ background:var(--black); text-align:center; }
.contato-inner{ display:flex; flex-direction:column; align-items:center; }
.contato-phone{
  font-size:clamp(1.8rem, 4vw, 2.6rem);
  font-weight:700;
  color:var(--orange-light);
  margin-bottom:34px;
}

/* ==========================================================================
   COMO CHEGAR
   ========================================================================== */
.section-mapa{ background:var(--black-soft); }
.mapa-grid{
  display:grid;
  grid-template-columns:.9fr 1.1fr;
  gap:56px;
  align-items:center;
}
.mapa-text .body-lg{ display:flex; align-items:flex-start; gap:10px; }
.mapa-text .body-lg .icon{ color:var(--orange); flex-shrink:0; margin-top:3px; }
.mapa-text .btn{ margin-top:26px; }
.mapa-embed{
  border-radius:var(--radius-l);
  overflow:hidden;
  border:1px solid rgba(255,106,0,.25);
  box-shadow:var(--shadow-soft);
  aspect-ratio:4/3;
}
.mapa-embed iframe{ width:100%; height:100%; border:0; filter:grayscale(.15) contrast(1.05); }

@media (max-width:900px){
  .mapa-grid{ grid-template-columns:1fr; gap:36px; }
}

/* ==========================================================================
   FOOTER
   ========================================================================== */
.site-footer{ background:var(--black); border-top:1px solid rgba(255,255,255,.06); padding:38px 0; }
.footer-inner{
  display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:16px;
}
.footer-brand{ display:flex; align-items:center; gap:10px; font-family:var(--font-display); font-weight:600; }
.footer-brand img{ height:30px; width:auto; }
.footer-brand strong{ color:var(--orange); }
.footer-copy{ margin:0; color:var(--white-dim); font-size:.85rem; }
.footer-dev{
  font-size:.85rem;
  color:var(--white-dim);
  border-bottom:1px dashed rgba(255,255,255,.25);
  transition:color .3s var(--ease), border-color .3s var(--ease);
}
.footer-dev:hover{ color:var(--orange-light); border-color:var(--orange-light); }

@media (max-width:720px){
  .footer-inner{ flex-direction:column; text-align:center; }
}

/* ==========================================================================
   FLOATING WHATSAPP
   ========================================================================== */
.floating-whatsapp{
  position:fixed; right:22px; bottom:22px;
  width:60px; height:60px;
  border-radius:50%;
  background:var(--grad-orange);
  color:var(--black);
  display:flex; align-items:center; justify-content:center;
  box-shadow:var(--shadow-orange);
  z-index:90;
  transition:transform .35s var(--ease), box-shadow .35s var(--ease);
}
.floating-whatsapp::before{
  content:"";
  position:absolute; inset:0;
  border-radius:50%;
  border:2px solid rgba(255,106,0,.6);
  animation:pulse-ring 2.2s ease-out infinite;
}
.floating-whatsapp:hover{ transform:scale(1.08) translateY(-2px); }

/* ==========================================================================
   LIGHTBOX
   ========================================================================== */
.lightbox{
  position:fixed; inset:0;
  background:rgba(6,6,8,.94);
  display:flex; align-items:center; justify-content:center;
  padding:40px;
  opacity:0; pointer-events:none;
  transition:opacity .35s var(--ease);
  z-index:200;
}
.lightbox.is-open{ opacity:1; pointer-events:auto; }
.lightbox img{ max-width:min(900px, 90vw); max-height:86vh; border-radius:var(--radius-m); box-shadow:0 30px 80px rgba(0,0,0,.6); }
.lightbox-close{
  position:absolute; top:24px; right:24px;
  width:48px; height:48px;
  border-radius:50%;
  border:1px solid rgba(255,255,255,.2);
  background:rgba(255,255,255,.06);
  color:var(--white);
  display:flex; align-items:center; justify-content:center;
}
.lightbox-close:hover{ background:var(--grad-orange); color:var(--black); }

/* ==========================================================================
   SCROLL REVEAL
   ========================================================================== */
.reveal-up{
  opacity:0;
  transform:translateY(34px);
  transition:opacity .8s var(--ease), transform .8s var(--ease);
}
.reveal-up.is-visible{ opacity:1; transform:translateY(0); }

/* stagger children of grids that carry reveal-up */
.differentials li:nth-child(1){ transition-delay:.05s; }
.differentials li:nth-child(2){ transition-delay:.1s; }
.differentials li:nth-child(3){ transition-delay:.15s; }
.differentials li:nth-child(4){ transition-delay:.2s; }
.differentials li:nth-child(5){ transition-delay:.25s; }

.servicos-grid .card-servico:nth-child(1){ transition-delay:0s; }
.servicos-grid .card-servico:nth-child(2){ transition-delay:.06s; }
.servicos-grid .card-servico:nth-child(3){ transition-delay:.12s; }
.servicos-grid .card-servico:nth-child(4){ transition-delay:.18s; }
.servicos-grid .card-servico:nth-child(5){ transition-delay:.24s; }
.servicos-grid .card-servico:nth-child(6){ transition-delay:.3s; }
.servicos-grid .card-servico:nth-child(7){ transition-delay:.36s; }

.galeria-grid .galeria-item:nth-child(1){ transition-delay:0s; }
.galeria-grid .galeria-item:nth-child(2){ transition-delay:.05s; }
.galeria-grid .galeria-item:nth-child(3){ transition-delay:.1s; }
.galeria-grid .galeria-item:nth-child(4){ transition-delay:.15s; }
.galeria-grid .galeria-item:nth-child(5){ transition-delay:.2s; }
.galeria-grid .galeria-item:nth-child(6){ transition-delay:.25s; }

.ba-grid .ba-compare:nth-child(1){ transition-delay:0s; }
.ba-grid .ba-compare:nth-child(2){ transition-delay:.08s; }
.ba-grid .ba-compare:nth-child(3){ transition-delay:.16s; }
.ba-grid .ba-compare:nth-child(4){ transition-delay:.24s; }
