/* =========================================================================
   CASEMIRO DECOR · Landing Page
   Identidade visual conforme Manual de Identidade Visual (2023)
   Paleta: #EB232C · #F38020 · #3FA4DC · #54B948 · #444444
   ========================================================================= */

/* -------------------------------------------------------------------------
   TIPOGRAFIA DA MARCA
   O manual define Caviar Dreams (principal) e Century Gothic (secundária).
   Nenhuma das duas está licenciada para web nesta entrega, então usamos:
     · Jost (Google Fonts)     -> substituta geométrica de Caviar Dreams
     · Questrial (Google Fonts)-> substituta de Century Gothic
   Se o cliente fornecer os arquivos licenciados (.woff2), basta colocá-los em
   assets/fonts/ e descomentar o bloco abaixo, as pilhas já dão prioridade a eles.

@font-face {
  font-family: 'Caviar Dreams';
  src: url('../fonts/CaviarDreams.woff2') format('woff2');
  font-weight: 400; font-style: normal; font-display: swap;
}
@font-face {
  font-family: 'Caviar Dreams';
  src: url('../fonts/CaviarDreams-Bold.woff2') format('woff2');
  font-weight: 700; font-style: normal; font-display: swap;
}
------------------------------------------------------------------------- */

/* ============================ TOKENS ============================ */
:root{
  /* Cores institucionais */
  --red:      #EB232C;
  --red-deep: #C9161F;
  --orange:   #F38020;
  --blue:     #3FA4DC;
  --green:    #54B948;
  --green-deep:#42A038;
  /* verde oficial do WhatsApp, usado só nos CTAs do WhatsApp */
  --wa:       #25D366;
  --wa-deep:  #1EBE5B;

  /* Escala de cinza do manual (#444444 a 100/80/60/40/20%) */
  --ink:      #444444;
  --ink-80:   #6B6B6B;
  --ink-60:   #909090;
  --ink-40:   #B6B6B6;
  --ink-20:   #DCDCDC;

  --graphite:      #2C2C2C;
  --graphite-soft: #3A3A3A;
  --graphite-deep: #1F1F1F;

  --bg:       #FFFFFF;
  --bg-soft:  #F7F7F5;
  --bg-tint:  #FBFBFA;
  --line:     #ECECE8;
  --line-soft:#F2F2EE;

  /* Tipografia */
  --font-display: 'Caviar Dreams', 'Jost', 'Century Gothic', 'Questrial', 'URW Gothic', Arial, sans-serif;
  --font-body:    'Century Gothic', 'Questrial', 'Jost', 'URW Gothic', Arial, Helvetica, sans-serif;

  /* Métrica */
  --wrap: 1220px;
  --gutter: clamp(1.15rem, 4vw, 2.5rem);
  --r-xs: 10px;
  --r-sm: 14px;
  --r:    20px;
  --r-lg: 28px;
  --r-xl: 36px;
  --header-min: 66px;          /* altura mínima da barra do topo */
  --header-h: 67px;            /* altura real do header (o JS mede e atualiza) */
  /* altura da hero: uma dobra cheia, com teto para telas muito altas */
  --hero-h: min(calc(100svh - var(--header-h)), 880px);

  /* Sombras suaves e em camadas */
  --sh-1: 0 1px 2px rgba(44,44,44,.04), 0 4px 14px rgba(44,44,44,.05);
  --sh-2: 0 2px 6px rgba(44,44,44,.05), 0 14px 34px rgba(44,44,44,.08);
  --sh-3: 0 4px 12px rgba(44,44,44,.06), 0 28px 64px rgba(44,44,44,.13);

  --ease: cubic-bezier(.22,.61,.36,1);
  --ease-out: cubic-bezier(.16,1,.3,1);

  --brand-gradient: linear-gradient(90deg, var(--red) 0 25%, var(--orange) 25% 50%, var(--blue) 50% 75%, var(--green) 75% 100%);
}

@media (min-width: 1024px){ :root{ --header-min: 78px; --header-h: 79px; } }

/* ============================ RESET ============================ */
*,*::before,*::after{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; scroll-behavior:smooth; overscroll-behavior-y:none; }
body{
  margin:0;
  font-family:var(--font-body);
  font-size:clamp(.975rem, .93rem + .22vw, 1.0625rem);
  line-height:1.7;
  color:var(--ink);
  background:var(--bg);
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
  overscroll-behavior-y:none;   /* sem "borrachinha" acima da hero e abaixo do rodapé */
}
img,svg{ display:block; max-width:100%; }
img{ height:auto; }
button,input,select,textarea{ font:inherit; color:inherit; }
button{ background:none; border:0; cursor:pointer; }
a{ color:inherit; text-decoration:none; }
ul,ol{ margin:0; padding:0; list-style:none; }
h1,h2,h3,h4,p,figure,blockquote{ margin:0; }

h1,h2,h3,h4,.stat__num,.step__n,.benefits__n{
  font-family:var(--font-display);
  font-weight:500;
  line-height:1.12;
  color:var(--graphite);
}
h1{ font-size:clamp(1.95rem, 1.15rem + 3.4vw, 3.75rem); font-weight:400; letter-spacing:-.018em; }
h2{ font-size:clamp(1.6rem, 1.15rem + 2vw, 2.7rem); font-weight:400; letter-spacing:-.014em; }
h3{ font-size:clamp(1.075rem, 1rem + .38vw, 1.3rem); letter-spacing:-.006em; }
h4{ font-size:1.02rem; letter-spacing:-.004em; }

::selection{ background:var(--red); color:#fff; }

:focus-visible{ outline:3px solid var(--blue); outline-offset:3px; border-radius:6px; }

.visually-hidden{
  position:absolute; width:1px; height:1px; margin:-1px; padding:0;
  overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0;
}

/* ============================ LAYOUT ============================ */
.container{
  width:100%; max-width:var(--wrap);
  margin-inline:auto; padding-inline:var(--gutter);
}
.container--narrow{ max-width:880px; }

.section{ padding-block:clamp(3.5rem, 2rem + 6.5vw, 7rem); }
.section--soft{ background:var(--bg-soft); }

.sec-head{ max-width:46rem; margin-bottom:clamp(2.15rem, 1.4rem + 2.6vw, 3.5rem); }
.sec-head__sub{ margin-top:.9rem; color:var(--ink-80); font-size:1.04em; }

.eyebrow{
  display:inline-flex; align-items:center; gap:.55rem;
  font-family:var(--font-display);
  font-size:.72rem; font-weight:500;
  letter-spacing:.17em; text-transform:uppercase;
  color:var(--ink-60);
  margin-bottom:1.1rem;
}
.eyebrow--pill{
  padding:.42rem .95rem .42rem .8rem;
  border:1px solid var(--line);
  border-radius:999px;
  background:rgba(255,255,255,.7);
  backdrop-filter:blur(6px);
  color:var(--ink-80);
  letter-spacing:.12em;
}
h1 em, h2 em{ font-style:normal; color:var(--red); }
.hero__h1-sub{
  display:block; margin-top:.5em;
  font-size:.32em; font-weight:400; letter-spacing:.01em;
  line-height:1.35; color:var(--ink-80);
}
@media (max-width:640px){ .hero__h1-sub{ font-size:.46em; margin-top:.55em; } }

/* Pontinhos da marca (Elemento gráfico I) */
.dot{ width:8px; height:8px; border-radius:50%; flex:0 0 auto; }
.dot--red{ background:var(--red); }
.dot--orange{ background:var(--orange); }
.dot--blue{ background:var(--blue); }
.dot--green{ background:var(--green); }

/* Chips */
.chips{ display:flex; flex-wrap:wrap; gap:.5rem; }
.chips li{
  display:inline-flex; align-items:center; gap:.5rem;
  padding:.44rem .9rem;
  border:1px solid var(--line);
  border-radius:999px;
  background:#fff;
  font-size:.855rem; color:var(--ink-80);
  box-shadow:var(--sh-1);
}

/* ============================ BOTÕES ============================ */
.btn{
  --btn-bg:var(--red); --btn-fg:#fff; --btn-bd:transparent; --btn-glow:rgba(235,35,44,.3);
  position:relative;
  display:inline-flex; align-items:center; justify-content:center; gap:.55rem;
  padding:.82rem 1.45rem;
  background:var(--btn-bg); color:var(--btn-fg);
  border:1.5px solid var(--btn-bd);
  border-radius:999px;
  font-family:var(--font-display);
  font-weight:500; font-size:.94rem; line-height:1.2;
  letter-spacing:.012em; text-align:center;
  transition:transform .3s var(--ease-out), box-shadow .3s var(--ease-out), background .2s, color .2s, border-color .2s;
}
.btn:hover{ transform:translateY(-2px); box-shadow:0 10px 26px var(--btn-glow); }
.btn:active{ transform:translateY(0); }
.btn .ico{ width:1.15em; height:1.15em; fill:currentColor; flex:0 0 auto; }

.btn--lg{ padding:1.02rem 1.8rem; font-size:1rem; }
.btn--block{ width:100%; }
.btn--primary{ --btn-bg:linear-gradient(180deg, var(--red), var(--red-deep)); --btn-glow:rgba(235,35,44,.34); }
.btn--wa{ --btn-bg:linear-gradient(180deg, var(--wa), var(--wa-deep)); --btn-glow:rgba(37,211,102,.38); }
.btn--ghost{ --btn-bg:#fff; --btn-fg:var(--graphite); --btn-bd:var(--ink-20); --btn-glow:rgba(44,44,44,.13); }
.btn--ghost:hover{ --btn-bd:var(--graphite); }
.btn--outline{ --btn-bg:#fff; --btn-fg:var(--graphite); --btn-bd:var(--ink-40); --btn-glow:rgba(44,44,44,.14); }
.btn--outline:hover{ --btn-bg:var(--graphite); --btn-fg:#fff; --btn-bd:var(--graphite); }
.btn--outline-light{ --btn-bg:rgba(255,255,255,.06); --btn-fg:#fff; --btn-bd:rgba(255,255,255,.42); --btn-glow:rgba(0,0,0,.3); }
.btn--outline-light:hover{ --btn-bd:#fff; }

.link-arrow{
  display:inline-flex; align-items:center; gap:.4rem;
  font-family:var(--font-display); font-weight:500; font-size:.93rem;
  color:var(--red);
  transition:gap .25s var(--ease-out);
}
.link-arrow span{ transition:transform .25s var(--ease-out); }
.link-arrow:hover{ gap:.65rem; }
.link-arrow:hover span{ transform:translateX(2px); }

/* ============================ HEADER ============================ */
.header{
  position:sticky; top:0; z-index:90;
  background:rgba(255,255,255,.82);
  backdrop-filter:saturate(180%) blur(14px);
  -webkit-backdrop-filter:saturate(180%) blur(14px);
  border-bottom:1px solid transparent;
  transition:box-shadow .35s var(--ease), border-color .35s, background .35s;
}
.header.is-stuck{
  background:rgba(255,255,255,.92);
  border-bottom-color:var(--line);
  box-shadow:0 8px 30px rgba(44,44,44,.07);
}
.header__inner{
  display:flex; align-items:center; justify-content:space-between; gap:1rem;
  min-height:var(--header-min);
}
.header__progress{
  position:absolute; left:0; bottom:-1px; height:2px; width:0;
  background:var(--brand-gradient); background-size:100vw 100%;
  transition:width .12s linear;
}
.brand img{ width:auto; height:32px; }
@media (min-width:1024px){ .brand img{ height:41px; } }

.nav{ display:flex; align-items:center; gap:1.5rem; }
.nav__list{ display:flex; align-items:center; gap:clamp(.85rem,1.5vw,1.7rem); }
.nav__list a{
  position:relative;
  font-family:var(--font-display); font-size:.92rem; font-weight:500;
  color:var(--ink); padding-block:.4rem;
  transition:color .2s;
}
.nav__list a::after{
  content:''; position:absolute; left:0; right:100%; bottom:.05rem; height:2px;
  border-radius:2px; background:var(--red); transition:right .3s var(--ease-out);
}
.nav__list a:hover{ color:var(--graphite); }
.nav__list a:hover::after, .nav__list a.is-active::after{ right:0; }
.nav__list a.is-active{ color:var(--graphite); }

.nav__actions{ display:flex; align-items:center; gap:.9rem; }
.nav__phone{
  display:none; align-items:center; gap:.45rem;
  font-family:var(--font-display); font-size:.88rem; font-weight:500; color:var(--ink-80);
  transition:color .2s;
}
.nav__phone svg{ width:15px; height:15px; fill:var(--ink-60); transition:fill .2s; }
.nav__phone:hover{ color:var(--graphite); }
.nav__phone:hover svg{ fill:var(--red); }
@media (min-width:1180px){ .nav__phone{ display:inline-flex; } }

.burger{ display:grid; place-content:center; gap:5px; width:44px; height:44px; margin-right:-8px; }
.burger span{ display:block; width:23px; height:2px; border-radius:2px; background:var(--graphite); transition:transform .3s var(--ease-out), opacity .2s; }
.burger[aria-expanded="true"] span:nth-child(1){ transform:translateY(7px) rotate(45deg); }
.burger[aria-expanded="true"] span:nth-child(2){ opacity:0; }
.burger[aria-expanded="true"] span:nth-child(3){ transform:translateY(-7px) rotate(-45deg); }

@media (max-width:1023.98px){
  .nav{
    position:fixed; inset:var(--header-h) 0 auto 0;
    flex-direction:column; align-items:stretch; gap:0;
    background:#fff;
    border-bottom:1px solid var(--line);
    box-shadow:var(--sh-3);
    padding:.35rem var(--gutter) 1.5rem;
    max-height:calc(100dvh - var(--header-h));
    overflow-y:auto;
    transform:translateY(-14px);
    opacity:0; visibility:hidden; pointer-events:none;
    transition:opacity .28s var(--ease-out), transform .28s var(--ease-out), visibility .28s;
  }
  .nav.is-open{ opacity:1; visibility:visible; transform:translateY(0); pointer-events:auto; }
  .nav__list{ flex-direction:column; align-items:stretch; gap:0; }
  .nav__list a{ display:block; padding:.95rem .25rem; border-bottom:1px solid var(--line-soft); font-size:1.02rem; }
  .nav__list a::after{ display:none; }
  .nav__actions{ flex-direction:column; align-items:stretch; margin-top:1.15rem; }
  .nav__cta{ width:100%; }
}
@media (min-width:1024px){ .burger{ display:none; } }

/* ============================ HERO ============================ */
.hero{
  position:relative;
  display:flex; flex-direction:column; justify-content:center;
  /* altura definida = a hero inteira cabe na primeira dobra, sem rolagem */
  min-height:var(--hero-h);
  padding-block:clamp(1.5rem, .75rem + 2.5vw, 2.75rem) clamp(2rem, 1rem + 3vw, 3.5rem);
  overflow:hidden;
  background:
    radial-gradient(60% 55% at 88% 8%,  rgba(63,164,220,.08), transparent 62%),
    radial-gradient(48% 45% at 4% 96%,  rgba(243,128,32,.07), transparent 62%),
    radial-gradient(40% 40% at 62% 100%, rgba(235,35,44,.05), transparent 60%);
}
.hero__glyph{
  position:absolute; z-index:0; pointer-events:none;
  top:-16%; right:-14%;
  width:min(60vw,640px); aspect-ratio:1;
  background:url('../img/brand/simbolo.png') center/contain no-repeat;
  opacity:.05;
}
.hero__grid{
  position:relative; z-index:1;
  flex:1 1 auto; min-height:0;
  display:grid; gap:clamp(1.35rem, 3vw, 3rem);
  grid-template-rows:auto minmax(120px, 1fr);
  align-items:center;
}
@media (min-width:900px){
  .hero__grid{
    grid-template-columns:minmax(0,1.12fr) minmax(0,.88fr);
    grid-template-rows:1fr;
    gap:clamp(2.25rem,4vw,4.5rem);
  }
}

.hero__sub{
  margin-top:1.05rem;
  font-size:clamp(.98rem, .93rem + .3vw, 1.14rem);
  color:var(--ink-80); max-width:34rem;
}
.hero__sub strong{ color:var(--graphite); font-weight:400; box-shadow:inset 0 -.42em 0 rgba(243,128,32,.2); }

.hero__text .chips{ margin-top:1.5rem; }
.hero__actions{ display:flex; flex-wrap:wrap; gap:.7rem; margin-top:1.85rem; }
.hero__micro{ margin-top:1rem; font-size:.815rem; color:var(--ink-60); }

.hero__media{ position:relative; margin:0; height:100%; min-height:0; }
.hero__media img{
  width:100%; height:100%; object-fit:cover;
  border-radius:var(--r-lg);
  box-shadow:var(--sh-3);
}
.hero__media::before{
  content:''; position:absolute; inset:auto -16px -16px auto;
  width:56%; height:52%;
  border:1.5px solid rgba(243,128,32,.55); border-radius:var(--r-lg);
  z-index:-1;
}
@media (min-height:600px){
  .hero{ height:var(--hero-h); }
}
@media (min-width:900px){
  .hero__media{ height:min(100%, 520px); }
}
.hero__badge{
  position:absolute; left:-6px; bottom:-16px;
  display:flex; align-items:center; gap:.7rem;
  background:rgba(255,255,255,.94);
  backdrop-filter:blur(8px);
  border-radius:var(--r-sm);
  padding:.72rem 1.05rem;
  box-shadow:var(--sh-2);
  border-left:3px solid var(--red);
}
.hero__badge strong{ font-family:var(--font-display); font-size:1.75rem; font-weight:500; color:var(--red); line-height:1; letter-spacing:-.02em; }
.hero__badge span{ font-size:.73rem; line-height:1.3; color:var(--ink-80); }
@media (min-width:600px){ .hero__badge{ left:-22px; bottom:-20px; } .hero__badge strong{ font-size:2.05rem; } }

/* Ajuste fino para caber na primeira dobra em telas pequenas */
@media (max-width:640px){
  .hero{ padding-block:1.1rem 1.5rem; }
  .hero__sub{ margin-top:.85rem; line-height:1.6; }
  .hero__text .chips{ margin-top:1.15rem; }
  .chips li{ padding:.38rem .8rem; font-size:.82rem; }
  .hero__actions{ margin-top:1.35rem; gap:.6rem; }
  .hero__actions .btn--lg{ padding:.92rem 1.5rem; font-size:.95rem; }
  .hero__micro{ margin-top:.8rem; }
  .eyebrow--pill{ font-size:.665rem; padding:.36rem .8rem .36rem .68rem; margin-bottom:.9rem; }
}

/* Telas muito baixas (celular deitado): volta ao fluxo natural */
@media (max-height:599.98px){
  .hero{ min-height:0; height:auto; }
  .hero__grid{ grid-template-rows:auto auto; }
  .hero__media{ height:auto; }
  .hero__media img{ aspect-ratio:16/9; }
}

/* ============================ BARRA DE CONFIANÇA ============================ */
.trustbar{
  position:relative;
  padding-block:1.6rem 1.75rem;
  background:var(--bg-tint);
  border-block:1px solid var(--line);
  overflow:hidden;
}
.trustbar__head{ display:flex; justify-content:center; }
.trustbar__label{
  margin:0 0 1.1rem; font-family:var(--font-display);
  font-size:.7rem; font-weight:500; letter-spacing:.19em; text-transform:uppercase;
  color:var(--ink-60); text-align:center;
}
.marquee{
  position:relative;
  display:flex; gap:clamp(2rem,5vw,4rem);
  width:max-content;
  animation:marquee 34s linear infinite;
}
.marquee__track{ display:flex; align-items:center; gap:clamp(2rem,5vw,4rem); }
.marquee__track li{ flex:0 0 auto; }
.marquee img{
  height:40px; width:auto; object-fit:contain;
  filter:grayscale(1) contrast(1.12); opacity:.62;
  transition:filter .3s, opacity .3s;
}
@media (min-width:768px){ .marquee img{ height:52px; } }
.trustbar:hover .marquee{ animation-play-state:paused; }
.trustbar:hover .marquee img{ filter:grayscale(0); opacity:1; }
@keyframes marquee{ from{ transform:translateX(0) } to{ transform:translateX(calc(-50% - clamp(1rem,2.5vw,2rem))) } }
.trustbar::before, .trustbar::after{
  content:''; position:absolute; top:0; bottom:0; width:clamp(40px,10vw,110px); z-index:2; pointer-events:none;
}
.trustbar::before{ left:0;  background:linear-gradient(90deg, var(--bg-tint), rgba(251,251,250,0)); }
.trustbar::after{ right:0; background:linear-gradient(270deg, var(--bg-tint), rgba(251,251,250,0)); }

/* ============================ CARDS DE SERVIÇO ============================ */
.cards-3{ display:grid; gap:clamp(1.25rem,2.5vw,2rem); }
@media (min-width:640px){ .cards-3{ grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (min-width:1000px){ .cards-3{ grid-template-columns:repeat(3,minmax(0,1fr)); } }

.card{
  position:relative;
  display:flex; flex-direction:column;
  background:#fff;
  border-radius:var(--r-lg);
  overflow:hidden;
  box-shadow:var(--sh-1);
  transition:transform .4s var(--ease-out), box-shadow .4s var(--ease-out);
}
.card::after{
  content:''; position:absolute; inset:0; border-radius:inherit;
  border:1px solid var(--line); pointer-events:none;
  transition:border-color .35s;
}
.card:hover{ transform:translateY(-7px); box-shadow:var(--sh-3); }
.card:hover::after{ border-color:transparent; }
.card__media{ position:relative; overflow:hidden; }
.card__media img{ width:100%; aspect-ratio:4/3; object-fit:cover; transition:transform .7s var(--ease-out); }
.card:hover .card__media img{ transform:scale(1.05); }
.card__tag{
  position:absolute; left:1rem; top:1rem; z-index:2;
  padding:.34rem .85rem; border-radius:999px;
  background:var(--red); color:#fff;
  font-family:var(--font-display); font-size:.68rem; font-weight:500;
  letter-spacing:.13em; text-transform:uppercase;
  box-shadow:0 4px 14px rgba(0,0,0,.18);
}
.card__tag--orange{ background:var(--orange); }
.card__tag--blue{ background:var(--blue); }
.card__body{ display:flex; flex-direction:column; gap:.8rem; padding:1.5rem clamp(1.2rem,2.5vw,1.7rem) 1.7rem; flex:1; }
.card__body p{ color:var(--ink-80); font-size:.955rem; }
.card__list{ display:grid; gap:.45rem; margin-top:.15rem; }
.card__list li{ position:relative; padding-left:1.15rem; font-size:.895rem; color:var(--ink-80); }
.card__list li::before{
  content:''; position:absolute; left:0; top:.58em;
  width:7px; height:7px; border-radius:50%; background:var(--ink-20);
}
.card__body .link-arrow{ margin-top:auto; align-self:flex-start; padding-top:.5rem; }

/* Mini cards */
.mini-cards{
  display:grid; gap:1.35rem;
  margin-top:clamp(1.9rem,3vw,3rem);
  padding-top:clamp(1.9rem,3vw,3rem);
  border-top:1px solid var(--line);
}
@media (min-width:600px){ .mini-cards{ grid-template-columns:repeat(2,minmax(0,1fr)); gap:1.6rem 2.25rem; } }
@media (min-width:1000px){ .mini-cards{ grid-template-columns:repeat(4,minmax(0,1fr)); } }
.mini-cards li{ display:flex; gap:.95rem; align-items:flex-start; }
.mini-cards__ico{
  flex:0 0 auto; display:grid; place-content:center;
  width:44px; height:44px; border-radius:var(--r-xs);
  background:var(--bg-soft);
}
.mini-cards__ico svg{ width:21px; height:21px; fill:var(--graphite); }
.mini-cards li:nth-child(1) .mini-cards__ico{ background:rgba(235,35,44,.09); }
.mini-cards li:nth-child(1) .mini-cards__ico svg{ fill:var(--red); }
.mini-cards li:nth-child(2) .mini-cards__ico{ background:rgba(243,128,32,.1); }
.mini-cards li:nth-child(2) .mini-cards__ico svg{ fill:var(--orange); }
.mini-cards li:nth-child(3) .mini-cards__ico{ background:rgba(63,164,220,.1); }
.mini-cards li:nth-child(3) .mini-cards__ico svg{ fill:var(--blue); }
.mini-cards li:nth-child(4) .mini-cards__ico{ background:rgba(84,185,72,.1); }
.mini-cards li:nth-child(4) .mini-cards__ico svg{ fill:var(--green); }
.mini-cards h4{ margin-bottom:.25rem; }
.mini-cards p{ font-size:.88rem; color:var(--ink-80); line-height:1.55; }

/* ============================ NÚMEROS ============================ */
.stats{
  position:relative;
  background:
    radial-gradient(70% 120% at 12% 0%, rgba(235,35,44,.14), transparent 58%),
    radial-gradient(60% 120% at 88% 100%, rgba(63,164,220,.14), transparent 58%),
    var(--graphite);
  color:#fff;
  padding-block:clamp(2.75rem, 2rem + 3.2vw, 4.5rem);
  overflow:hidden;
}
.stats::before{ content:''; position:absolute; inset:0 0 auto 0; height:3px; background:var(--brand-gradient); }
.stats__grid{ display:grid; gap:2.25rem 1.5rem; text-align:center; }
@media (min-width:560px){ .stats__grid{ grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (min-width:1000px){ .stats__grid{ grid-template-columns:repeat(4,minmax(0,1fr)); text-align:left; } }
.stat{ position:relative; }
@media (min-width:1000px){ .stat + .stat{ padding-left:2.25rem; border-left:1px solid rgba(255,255,255,.14); } }
.stat__num{
  display:block;
  font-size:clamp(2.5rem, 1.9rem + 2.4vw, 3.6rem);
  font-weight:400; line-height:1; color:#fff; letter-spacing:-.028em;
}
.stat__label{ display:block; margin-top:.65rem; font-size:.875rem; color:rgba(255,255,255,.68); line-height:1.5; }
.stat::after{ content:''; display:block; width:36px; height:3px; border-radius:2px; margin:1rem auto 0; }
@media (min-width:1000px){ .stat::after{ margin-inline:0; } }
.stats__grid .stat:nth-child(1)::after{ background:var(--red); }
.stats__grid .stat:nth-child(2)::after{ background:var(--orange); }
.stats__grid .stat:nth-child(3)::after{ background:var(--blue); }
.stats__grid .stat:nth-child(4)::after{ background:var(--green); }

/* ============================ PORTFÓLIO ============================ */
.filters{ display:flex; flex-wrap:wrap; gap:.5rem; margin-bottom:clamp(1.6rem,3vw,2.4rem); }
.filters__btn{
  padding:.52rem 1.1rem; border-radius:999px;
  border:1px solid var(--line); background:#fff;
  font-family:var(--font-display); font-size:.865rem; font-weight:500; color:var(--ink-80);
  box-shadow:var(--sh-1);
  transition:all .25s var(--ease-out);
}
.filters__btn:hover{ border-color:var(--ink-40); color:var(--graphite); transform:translateY(-1px); }
.filters__btn.is-active{ background:var(--graphite); border-color:var(--graphite); color:#fff; }

.gallery{ display:grid; gap:clamp(.7rem,1.5vw,1.15rem); grid-template-columns:repeat(2,minmax(0,1fr)); }
@media (min-width:768px){ .gallery{ grid-template-columns:repeat(3,minmax(0,1fr)); } }
@media (min-width:1100px){ .gallery{ grid-template-columns:repeat(4,minmax(0,1fr)); } }

.gallery__item{ position:relative; }
.gallery__item.is-hidden{ display:none; }
.gallery__btn{
  position:relative; display:block; width:100%;
  border-radius:var(--r); overflow:hidden;
  background:var(--ink-20);
  aspect-ratio:4/3;
  box-shadow:var(--sh-1);
  transition:transform .4s var(--ease-out), box-shadow .4s var(--ease-out);
}
.gallery__btn:hover{ transform:translateY(-4px); box-shadow:var(--sh-2); }
.gallery__btn img{ width:100%; height:100%; object-fit:cover; transition:transform .65s var(--ease-out); }
.gallery__btn::after{
  content:''; position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(20,20,20,0) 28%, rgba(20,20,20,.55) 62%, rgba(20,20,20,.92) 100%);
  opacity:0; transition:opacity .35s;
}
.gallery__btn:hover img, .gallery__btn:focus-visible img{ transform:scale(1.06); }
.gallery__btn:hover::after, .gallery__btn:focus-visible::after{ opacity:1; }
.gallery__info{
  position:absolute; left:0; right:0; bottom:3.05rem; z-index:2;
  display:grid; gap:.18rem;
  padding:.9rem .95rem;
  text-align:left; color:#fff;
  transform:translateY(8px); opacity:0;
  transition:transform .4s var(--ease-out), opacity .3s;
}
.gallery__btn:hover .gallery__info, .gallery__btn:focus-visible .gallery__info{ transform:translateY(0); opacity:1; }
.gallery__info em{
  font-style:normal; font-family:var(--font-display);
  font-size:.63rem; letter-spacing:.16em; text-transform:uppercase; color:#FCA85A; text-shadow:0 1px 3px rgba(0,0,0,.5);
}
.gallery__info strong{ font-family:var(--font-display); font-weight:500; font-size:.86rem; line-height:1.25; text-shadow:0 1px 3px rgba(0,0,0,.55); }

/* CTA que aparece junto com a legenda, no hover */
.gallery__cta{
  position:absolute; z-index:3; left:.95rem; right:.95rem; bottom:.95rem;
  display:flex; align-items:center; justify-content:center; gap:.3em;
  height:38px; padding:0 .9rem; border-radius:999px;
  background:var(--red); color:#fff;
  font-family:var(--font-display); font-weight:500; font-size:.83rem; letter-spacing:.01em;
  opacity:0; transform:translateY(10px); pointer-events:none;
  transition:opacity .3s var(--ease-out), transform .35s var(--ease-out), background .2s;
}
.gallery__cta:hover{ background:var(--red-deep); }
.gallery__item:hover .gallery__cta,
.gallery__item:focus-within .gallery__cta{ opacity:1; transform:translateY(0); pointer-events:auto; }
.gallery__item:hover .gallery__btn::after,
.gallery__item:focus-within .gallery__btn::after{ opacity:1; }
.gallery__item:hover .gallery__info,
.gallery__item:focus-within .gallery__info{ transform:translateY(0); opacity:1; }

/* Sem hover (toque): a legenda fica visível, mas com scrim reforçado */
@media (hover:none){
  .gallery__btn::after{
    opacity:1;
    background:linear-gradient(180deg, rgba(20,20,20,0) 34%, rgba(20,20,20,.68) 66%, rgba(20,20,20,.95) 100%);
  }
  .gallery__info{ transform:none; opacity:1; }
  .gallery__cta{ opacity:1; transform:none; pointer-events:auto; }
}
/* Em telas pequenas o tile vira quadrado e o botão fica compacto,
   para caber a legenda e o "Solicitar" sem apertar a foto. */
@media (max-width:639.98px){
  .gallery__btn{ aspect-ratio:1/1; }
  /* em tela estreita não existe hover: legenda e botão ficam sempre visíveis */
  .gallery__btn::after{
    opacity:1;
    background:linear-gradient(180deg, rgba(18,18,18,0) 18%, rgba(18,18,18,.5) 44%, rgba(18,18,18,.88) 72%, rgba(18,18,18,.96) 100%);
  }
  .gallery__info{ opacity:1; transform:none; }
  .gallery__cta{ opacity:1; transform:none; pointer-events:auto; }
  .gallery__info{ bottom:2.6rem; padding:.55rem .7rem; gap:.1rem; }
  .gallery__info em{ font-size:.58rem; letter-spacing:.13em; }
  .gallery__info strong{ font-size:.78rem; }
  .gallery__cta{ left:.55rem; right:.55rem; bottom:.55rem; height:32px; padding:0 .5rem; font-size:.76rem; }
  .gallery__cta-word{ display:none; }
}

.gallery__more{ display:flex; flex-wrap:wrap; justify-content:center; gap:.7rem; margin-top:clamp(1.75rem,3vw,2.5rem); }

/* ============================ CLIENTES ============================ */
.logos{
  display:grid; gap:.6rem;
  grid-template-columns:repeat(2,minmax(0,1fr));
}
@media (min-width:560px){ .logos{ grid-template-columns:repeat(3,minmax(0,1fr)); } }
@media (min-width:900px){ .logos{ grid-template-columns:repeat(6,minmax(0,1fr)); gap:.75rem; } }
.logos li{
  display:grid; place-items:center;
  background:#fff; border-radius:var(--r-sm);
  border:1px solid var(--line);
  padding:1.15rem 1rem; min-height:96px;
  transition:transform .35s var(--ease-out), box-shadow .35s var(--ease-out), border-color .3s;
}
.logos li:hover{ transform:translateY(-3px); box-shadow:var(--sh-2); border-color:transparent; }
.logos img{
  max-height:42px; width:auto; max-width:100%; object-fit:contain;
  filter:grayscale(1) contrast(1.12); opacity:.7;
  transition:filter .3s, opacity .3s;
}
.logos li:hover img{ filter:none; opacity:1; }
@media (hover:none){ .logos img{ filter:grayscale(1) contrast(1.12); opacity:.82; } }

/* ============================ DIFERENCIAIS ============================ */
.split{ display:grid; gap:clamp(2.5rem,4vw,4.25rem); align-items:center; }
@media (min-width:960px){ .split{ grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr); } }

.split__lead{ margin-top:1.15rem; color:var(--ink-80); }
.benefits{ display:grid; gap:1.5rem; margin-top:2.25rem; }
.benefits li{ display:flex; gap:1.1rem; align-items:flex-start; }
.benefits__n{
  flex:0 0 auto;
  display:grid; place-content:center;
  width:50px; height:50px; border-radius:var(--r-xs);
  font-family:var(--font-display); font-size:.98rem; font-weight:500; color:#fff;
  background:var(--ink);
  box-shadow:var(--sh-1);
}
.benefits__n--red{ background:linear-gradient(160deg, #F0424A, var(--red)); }
.benefits__n--orange{ background:linear-gradient(160deg, #F79441, var(--orange)); }
.benefits__n--blue{ background:linear-gradient(160deg, #5FB6E4, var(--blue)); }
.benefits__n--green{ background:linear-gradient(160deg, #6DC762, var(--green)); }
.benefits h3{ margin-bottom:.3rem; }
.benefits p{ font-size:.93rem; color:var(--ink-80); line-height:1.6; }

.split__media{ position:relative; }
.split__img{ width:100%; aspect-ratio:4/3; object-fit:cover; border-radius:var(--r-lg); box-shadow:var(--sh-3); }
.split__note{
  display:flex; gap:.85rem; align-items:flex-start;
  background:rgba(255,255,255,.95); backdrop-filter:blur(8px);
  border-radius:var(--r-sm);
  padding:1rem 1.2rem; box-shadow:var(--sh-2);
  margin:-2.5rem 1rem 0;
  position:relative; z-index:2;
}
@media (min-width:960px){ .split__note{ margin:-3rem 2.5rem 0 -1.75rem; } }
.split__note-ico{ flex:0 0 auto; display:grid; place-content:center; width:34px; height:34px; border-radius:9px; background:rgba(84,185,72,.13); }
.split__note-ico svg{ width:19px; height:19px; fill:var(--green); }
.split__note p{ font-size:.875rem; color:var(--ink-80); line-height:1.55; }
.split__note strong{ color:var(--graphite); font-weight:400; font-family:var(--font-display); }

/* ============================ COMO FUNCIONA ============================ */
.steps{ display:grid; gap:1.75rem; }
@media (min-width:600px){ .steps{ grid-template-columns:repeat(2,minmax(0,1fr)); gap:2.25rem; } }
@media (min-width:1000px){ .steps{ grid-template-columns:repeat(4,minmax(0,1fr)); } }
.step{ position:relative; padding-top:1.6rem; border-top:2px solid var(--line); }
.step__n{
  position:absolute; top:-1.2rem; left:0;
  display:grid; place-content:center;
  width:40px; height:40px; border-radius:50%;
  background:#fff; border:2px solid var(--line);
  font-family:var(--font-display); font-size:.95rem; font-weight:500; color:var(--graphite);
  box-shadow:var(--sh-1);
}
.step:nth-child(1) .step__n{ border-color:var(--red); color:var(--red); }
.step:nth-child(2) .step__n{ border-color:var(--orange); color:var(--orange); }
.step:nth-child(3) .step__n{ border-color:var(--blue); color:var(--blue); }
.step:nth-child(4) .step__n{ border-color:var(--green); color:var(--green); }
.step h3{ margin:1.5rem 0 .45rem; }
.step p{ font-size:.92rem; color:var(--ink-80); }

/* ============================ CTA BAND ============================ */
.cta-band{
  position:relative; overflow:hidden;
  background:
    radial-gradient(65% 130% at 8% 0%, rgba(84,185,72,.16), transparent 55%),
    radial-gradient(55% 120% at 92% 100%, rgba(235,35,44,.16), transparent 55%),
    var(--graphite);
  color:#fff;
  padding-block:clamp(3rem, 2rem + 4vw, 5rem);
}
.cta-band::before{ content:''; position:absolute; inset:auto 0 0 0; height:3px; background:var(--brand-gradient); }
.cta-band__glyph{
  position:absolute; z-index:0; pointer-events:none;
  right:-7%; top:50%; translate:0 -50%;
  width:min(50vw,420px); aspect-ratio:1;
  background:url('../img/brand/simbolo-branco.png') center/contain no-repeat;
  opacity:.055;
}
.cta-band__inner{ position:relative; z-index:1; display:grid; gap:1.85rem; align-items:center; }
@media (min-width:900px){ .cta-band__inner{ grid-template-columns:1fr auto; gap:3rem; } }
.cta-band h2{ color:#fff; }
.cta-band p{ margin-top:.75rem; color:rgba(255,255,255,.74); max-width:38rem; }
.cta-band__actions{ display:flex; flex-wrap:wrap; gap:.7rem; }
@media (max-width:479.98px){ .cta-band__actions .btn{ width:100%; } }

/* ============================ DEPOIMENTOS ============================ */
.quotes{ display:grid; gap:1.5rem; }
@media (min-width:800px){ .quotes{ grid-template-columns:repeat(3,minmax(0,1fr)); } }
.quote{
  background:#fff; border:1px solid var(--line); border-radius:var(--r-lg);
  padding:1.9rem; position:relative; box-shadow:var(--sh-1);
}
.quote::before{
  content:'“'; position:absolute; top:.4rem; right:1.25rem;
  font-family:var(--font-display); font-size:4rem; line-height:1; color:var(--line);
}
.quote blockquote{ font-size:.98rem; color:var(--ink-80); }
.quote cite{ display:block; margin-top:1.25rem; font-style:normal; }
.quote cite strong{ display:block; font-family:var(--font-display); color:var(--graphite); font-weight:500; }
.quote cite span{ font-size:.83rem; color:var(--ink-60); }

/* ============================ FAQ ============================ */
.faq{ display:grid; gap:.65rem; }
.faq__item{
  background:#fff; border:1px solid var(--line); border-radius:var(--r-sm);
  padding-inline:clamp(1.05rem,2.5vw,1.6rem);
  transition:border-color .3s, box-shadow .3s;
}
.faq__item[open]{ border-color:transparent; box-shadow:var(--sh-2); }
.faq__item summary{
  position:relative;
  display:flex; align-items:center;
  list-style:none; cursor:pointer;
  padding:1.15rem 2.6rem 1.15rem 0;
  font-family:var(--font-display); font-size:clamp(.99rem, .95rem + .25vw, 1.1rem); font-weight:500;
  color:var(--graphite);
  transition:color .2s;
}
.faq__item summary::-webkit-details-marker{ display:none; }
.faq__item summary:hover{ color:var(--red); }
.faq__item summary::after{
  content:''; position:absolute; right:.15rem; top:50%;
  width:10px; height:10px; margin-top:-7px;
  border-right:2px solid var(--ink-60); border-bottom:2px solid var(--ink-60);
  transform:rotate(45deg);
  transition:transform .3s var(--ease-out), border-color .2s;
}
.faq__item[open] summary::after{ transform:rotate(-135deg); margin-top:-2px; border-color:var(--red); }
.faq__body{ padding:0 1.5rem 1.4rem 0; }
.faq__body p{ color:var(--ink-80); font-size:.945rem; }
.faq__item[open] .faq__body{ animation:fadeSlide .34s var(--ease-out) both; }
@keyframes fadeSlide{ from{ opacity:0; transform:translateY(-6px);} to{ opacity:1; transform:none; } }

/* ============================ CONTATO ============================ */
.contact{ display:grid; gap:clamp(2.25rem,4vw,3.75rem); align-items:start; }
@media (min-width:960px){ .contact{ grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr); } }
.contact__list{ display:grid; gap:1.2rem; margin-top:2rem; }
.contact__list li{ display:flex; gap:.95rem; align-items:flex-start; }
.contact__ico{ flex:0 0 auto; display:grid; place-content:center; width:44px; height:44px; border-radius:var(--r-xs); background:var(--ink-20); }
.contact__ico svg{ width:20px; height:20px; fill:var(--graphite); }
.contact__ico--green{ background:rgba(84,185,72,.13); } .contact__ico--green svg{ fill:var(--green); }
.contact__ico--blue{ background:rgba(63,164,220,.13); } .contact__ico--blue svg{ fill:var(--blue); }
.contact__ico--orange{ background:rgba(243,128,32,.13); } .contact__ico--orange svg{ fill:var(--orange); }
.contact__ico--red{ background:rgba(235,35,44,.11); } .contact__ico--red svg{ fill:var(--red); }
.contact__list strong{ display:block; font-family:var(--font-display); font-weight:500; color:var(--graphite); font-size:.93rem; }
.contact__list a, .contact__list span{ font-size:.93rem; color:var(--ink-80); }
.contact__list a{ transition:color .2s; }
.contact__list a:hover{ color:var(--red); }

.contact__social{ display:flex; gap:.55rem; margin-top:2.15rem; }
.contact__social a{
  display:grid; place-content:center; width:42px; height:42px; border-radius:50%;
  border:1px solid var(--line); background:#fff;
  transition:all .3s var(--ease-out);
}
.contact__social svg{ width:18px; height:18px; fill:var(--ink-80); transition:fill .25s; }
.contact__social a:hover{ border-color:transparent; background:var(--red); transform:translateY(-3px); box-shadow:0 8px 20px rgba(235,35,44,.3); }
.contact__social a:hover svg{ fill:#fff; }



/* CTA principal: o botão do WhatsApp é o ponto de foco da seção */
.contact__wa{ margin-top:.25rem; width:100%; max-width:22rem; }
@media (min-width:520px){ .contact__wa{ width:auto; } }
.contact__wa-note{ margin-top:.6rem; font-size:.8rem; color:var(--ink-60); }

/* Formulário: caminho alternativo, compacto e visualmente mais leve */

.form{
  background:#fff; border:1px solid var(--line); border-radius:var(--r);
  padding:clamp(1.15rem,2.2vw,1.6rem);
  box-shadow:var(--sh-1);
  display:grid; gap:.72rem;
}
.form__title{
  font-family:var(--font-display); font-size:1rem; font-weight:500; color:var(--graphite); margin:0;
}
.form__sub{ margin:-.5rem 0 .35rem; font-size:.82rem; color:var(--ink-60); }
.form__row{ display:grid; gap:.72rem; }
@media (min-width:420px){ .form__row{ grid-template-columns:1fr 1fr; } }

.field{ display:grid; gap:.28rem; }
.field label{ font-size:.76rem; font-family:var(--font-display); font-weight:500; color:var(--ink-80); }
.field label span{ color:var(--red); }
.field input, .field select, .field textarea{
  width:100%;
  padding:.58rem .8rem;
  border:1px solid var(--ink-20);
  border-radius:9px;
  background:var(--bg-tint);
  font-size:.9rem;
  transition:border-color .2s, box-shadow .2s, background .2s;
  min-height:42px;
}
.field textarea{ resize:vertical; min-height:64px; }
.field select{ appearance:none; background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23909090'%3E%3Cpath d='M7 10l5 5 5-5z'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:right .55rem center; background-size:18px; padding-right:2.1rem; }
.field input::placeholder, .field textarea::placeholder{ color:var(--ink-40); }
.field input:focus, .field select:focus, .field textarea:focus{
  outline:none; background:#fff; border-color:var(--blue); box-shadow:0 0 0 4px rgba(63,164,220,.14);
}
.field.has-error input, .field.has-error select, .field.has-error textarea{ border-color:var(--red); background:#fff; }
.field__error{ display:none; font-size:.78rem; color:var(--red); }
.field.has-error .field__error, .field__error.is-visible{ display:block; }

.check{ display:flex; gap:.55rem; align-items:flex-start; font-size:.76rem; color:var(--ink-60); line-height:1.45; cursor:pointer; margin-top:.15rem; }
.check input{ width:16px; height:16px; margin-top:.1rem; flex:0 0 auto; accent-color:var(--red); }

.hp{ position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden; }

.form__feedback{ margin:0; font-size:.8rem; text-align:center; }
.form__feedback:empty{ display:none; }
.form__feedback.is-ok{ color:var(--green); }
.form__feedback.is-err{ color:var(--red); }

/* ============================ RODAPÉ ============================ */
.footer{ position:relative; background:var(--graphite-deep); color:rgba(255,255,255,.66); padding-top:clamp(3rem, 2rem + 3vw, 4.5rem); }
.footer__grid{ display:grid; gap:2.35rem; padding-bottom:2.9rem; }
@media (min-width:640px){ .footer__grid{ grid-template-columns:repeat(2,minmax(0,1fr)); gap:2.5rem; } }
@media (min-width:1000px){ .footer__grid{ grid-template-columns:1.6fr 1fr 1fr 1.2fr; gap:3rem; } }
.footer__brand img{ width:auto; height:40px; margin-bottom:1.2rem; }
.footer__brand p{ font-size:.875rem; line-height:1.65; max-width:30rem; }
.footer__social{ display:flex; gap:.5rem; margin-top:1.4rem; }
.footer__social a{ display:grid; place-content:center; width:38px; height:38px; border-radius:50%; background:rgba(255,255,255,.07); transition:background .3s, transform .3s var(--ease-out); }
.footer__social svg{ width:17px; height:17px; fill:rgba(255,255,255,.78); }
.footer__social a:hover{ background:var(--red); transform:translateY(-3px); }
.footer__social a:hover svg{ fill:#fff; }

.footer__col h3{ color:#fff; font-size:.74rem; letter-spacing:.17em; text-transform:uppercase; margin-bottom:1.05rem; font-weight:500; }
.footer__col ul{ display:grid; gap:.65rem; }
.footer__col a, .footer__contact li{ font-size:.875rem; line-height:1.55; }
.footer__col a{ transition:color .2s; }
.footer__col a:hover{ color:#fff; }

.footer__bar{ border-top:1px solid rgba(255,255,255,.09); }
.footer__bar-inner{ display:grid; gap:.4rem; padding-block:1.4rem 1.7rem; font-size:.785rem; }
@media (min-width:768px){ .footer__bar-inner{ display:flex; justify-content:space-between; align-items:center; } }
.footer__made{ color:rgba(255,255,255,.42); }
.footer__stripe{ display:block; height:3px; background:var(--brand-gradient); }


/* ============================ WHATSAPP FLUTUANTE ============================ */
.wa-float{
  position:fixed; z-index:80;
  right:clamp(.9rem,3vw,1.75rem);
  bottom:calc(1rem + env(safe-area-inset-bottom));
  display:grid; place-content:center;
  width:60px; height:60px;
  background:var(--wa); color:#fff;
  border-radius:50%;
  box-shadow:0 10px 26px rgba(37,211,102,.44);
  transition:transform .35s var(--ease-out), box-shadow .35s var(--ease-out);
}
.wa-float svg{ width:32px; height:32px; fill:#fff; }
.wa-float:hover{ transform:scale(1.06); box-shadow:0 16px 36px rgba(37,211,102,.55); }
.wa-float::before{
  content:''; position:absolute; inset:0; border-radius:50%;
  background:var(--wa); z-index:-1;
  animation:pulse 2.2s var(--ease) infinite;
}
@keyframes pulse{ 0%{ transform:scale(1); opacity:.55; } 70%{ transform:scale(1.55); opacity:0; } 100%{ opacity:0; } }
@media (min-width:768px){ .wa-float{ bottom:clamp(1rem,3vw,1.85rem); } }


/* ============================ LIGHTBOX ============================ */
.lightbox{
  position:fixed; inset:0; z-index:120;
  display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:.5rem;
  padding:clamp(.75rem,3vw,2rem);
  background:rgba(24,24,24,.95);
  backdrop-filter:blur(6px);
  opacity:0; transition:opacity .3s var(--ease-out);
}
.lightbox.is-open{ opacity:1; }
.lightbox[hidden]{ display:none; }
.lightbox__fig{ margin:0; display:grid; gap:.9rem; justify-items:center; max-height:100%; }
.lightbox__fig img{
  max-width:100%; max-height:78dvh; width:auto;
  border-radius:var(--r); object-fit:contain;
  box-shadow:0 30px 70px rgba(0,0,0,.55);
}
.lightbox__fig figcaption{
  color:rgba(255,255,255,.85); font-size:.88rem; text-align:center; max-width:46rem;
  font-family:var(--font-display);
}
.lightbox__close{
  position:absolute; top:clamp(.5rem,2vw,1.25rem); right:clamp(.5rem,2vw,1.25rem);
  width:44px; height:44px; border-radius:50%;
  background:rgba(255,255,255,.12); color:#fff; font-size:1.9rem; line-height:1;
  display:grid; place-content:center; transition:background .2s;
}
.lightbox__close:hover{ background:rgba(255,255,255,.24); }
.lightbox__nav{
  width:44px; height:58px; border-radius:12px;
  background:rgba(255,255,255,.1); color:#fff; font-size:2rem; line-height:1;
  display:grid; place-content:center; transition:background .2s;
}
.lightbox__nav:hover{ background:rgba(255,255,255,.22); }
@media (max-width:600px){
  .lightbox{ grid-template-columns:1fr; grid-template-rows:1fr auto; }
  .lightbox__nav{ width:auto; height:48px; }
  .lightbox__nav--prev{ grid-column:1; grid-row:2; justify-self:start; width:96px; }
  .lightbox__nav--next{ grid-column:1; grid-row:2; justify-self:end; width:96px; }
  .lightbox__fig{ grid-row:1; }
}

/* ============================ ANIMAÇÕES DE ENTRADA ============================ */
.reveal{ opacity:0; transform:translateY(24px); transition:opacity .8s var(--ease-out), transform .8s var(--ease-out); }
.reveal.is-in{ opacity:1; transform:none; }
.reveal[data-delay="1"]{ transition-delay:.09s; }
.reveal[data-delay="2"]{ transition-delay:.18s; }
.reveal[data-delay="3"]{ transition-delay:.27s; }

@media (prefers-reduced-motion:reduce){
  html{ scroll-behavior:auto; }
  *,*::before,*::after{ animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; }
  .reveal{ opacity:1; transform:none; }
  .wa-float::before{ display:none; }
  /* sem animação, a faixa de logos vira uma linha estática e centralizada */
  .marquee{ animation:none; width:auto; flex-wrap:wrap; justify-content:center; }
  .marquee__track{ flex-wrap:wrap; justify-content:center; }
  .marquee__track:last-child{ display:none; }
  .trustbar::before, .trustbar::after{ display:none; }
}

/* ============================ IMPRESSÃO ============================ */
@media print{
  .header,.wa-float,.lightbox,.filters,.gallery__more,.cta-band__actions,.trustbar{ display:none !important; }
  body{ color:#000; }
  .hero{ min-height:0; }
  .reveal{ opacity:1; transform:none; }
}
