/* =========================================================
   BASE / NAVBAR
   ========================================================= */
:root{
  --brand:#0d6efd;
  --ink:#0b1535;
  --muted:#445574;
}

.brand-logo{height:44px;width:auto;display:block}
@media (max-width:576px){.brand-logo{height:34px}}

.navbar.sticky-top{transition:box-shadow .2s ease}
.navbar.scrolled{box-shadow:0 6px 16px rgba(0,0,0,.08)}

/* =========================================================
   HERO (PARALLAX REAL VIA .hero-bg)
   ========================================================= */
.hero-fit{
  position:relative;
  min-height:100vh;
  display:flex; align-items:center; justify-content:center;
  color:#fff; text-align:center;
  overflow:hidden;
}

.hero-bg{
  position:absolute; left:0; top:-10vh;
  width:100%; height:120vh;
  background-size:cover;
  background-position:center var(--focusY, 50%);
  will-change:transform;
  transform:translate3d(0,0,0);
  z-index:0;
}

/* 🔥 AJUSTE: overlay mais leve para clarear a imagem */
.hero-overlay{
  position:absolute; inset:0;
  background:rgba(0,0,0,.18);  /* antes era .45 */
  z-index:1;
}

.hero-fit .container{
  position:relative; z-index:2;
  padding:0 1rem;
}

/* Telas “achatadas” (muita largura, pouca altura) */
@media (min-aspect-ratio: 16/9) and (max-height:700px){
  .hero-bg{
    height:110vh; top:-5vh;
    background-size:contain;
    background-color:#000;
  }
  .hero-overlay{ background:rgba(0,0,0,.25); }
}

/* Mobile */
@media (max-width:576px){
  .hero-bg{ top:0; height:100vh; }
}

/* =========================================================
   SERVIÇOS — CARDS GRANDES (FOTO CHEIA)
   ========================================================= */
.service-card{
  border:0;border-radius:20px;overflow:hidden;
  background:#0b0d12;box-shadow:0 14px 34px rgba(0,0,0,.14);
  transition:transform .25s ease, box-shadow .25s ease;
}
.service-card:hover{transform:translateY(-4px);box-shadow:0 20px 48px rgba(0,0,0,.18)}

.service-media{
  position:relative;height:300px;background:#000;isolation:isolate;
}
@media (max-width:576px){.service-media{height:240px}}

.service-media img{
  width:100%;height:100%;
  object-fit:cover; object-position:center 18%;
  display:block; transform:scale(1); transition:transform .5s ease;
}
.service-card:hover .service-media img{transform:scale(1.06)}

.service-media::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(0,0,0,0) 40%,rgba(0,0,0,.35) 100%);
  pointer-events:none;
}

.service-badge{
  position:absolute;left:16px;bottom:14px;
  background:rgba(13,110,253,.95);color:#fff;
  font-weight:700;font-size:.78rem;padding:6px 10px;border-radius:999px;
  letter-spacing:.3px;text-transform:uppercase;
  box-shadow:0 8px 18px rgba(13,110,253,.35);
}

.service-content{
  background:#fff;padding:22px 20px 24px;border-top:4px solid var(--brand);
}
.service-title{color:var(--ink);font-weight:800;font-size:1.15rem;margin:0 0 .5rem}
.service-text{color:var(--muted);line-height:1.75;font-size:1.05rem}

/* focos manuais */
.service-media[data-focus="top"]   img{object-position:center 8%}
.service-media[data-focus="upper"] img{object-position:center 12%}
.service-media[data-focus="face"]  img{object-position:center 16%}

/* =========================================================
   PLANOS / PREÇOS
   ========================================================= */
.pricing-card{
  background:#fff;border:0;border-radius:16px;padding:22px;height:100%;
  box-shadow:0 10px 26px rgba(0,0,0,.06)
}
.pricing-card.highlight{
  border:1px solid #0d6efd33;box-shadow:0 14px 34px rgba(13,110,253,.20)
}
.pricing-card .price{font-size:24px;font-weight:800;margin:.25rem 0 1rem}
.pricing-card ul{padding-left:18px;margin:0 0 16px}
.pricing-card li{margin:.25rem 0}

/* =========================================================
   DEPOIMENTOS
   ========================================================= */
.testimonial{
  background:#fff;border:0;border-radius:14px;padding:22px;text-align:center;
  box-shadow:0 10px 26px rgba(0,0,0,.06)
}

/* =========================================================
   GALERIA (OWL)
   ========================================================= */
.media-carousel .item{
  border-radius:16px;overflow:hidden;background:#0b0d12;
  box-shadow:0 10px 26px rgba(0,0,0,.10);
  aspect-ratio:16/9;
}
@media (max-width:992px){.media-carousel .item{aspect-ratio:4/3}}
@media (max-width:576px){.media-carousel .item{aspect-ratio:1/1}}

.media-carousel .media-photo img{
  width:100%;height:100%;object-fit:cover;display:block;
}

.media-carousel .media-video video{
  width:100%;height:100%;object-fit:contain;background:#000;display:block;
}

.media-carousel .owl-nav button{
  position:absolute;top:45%;width:42px;height:42px;border-radius:50%;
  background:rgba(255,255,255,.96)!important;box-shadow:0 10px 24px rgba(0,0,0,.16)
}
.media-carousel .owl-nav .owl-prev{left:-8px}
.media-carousel .owl-nav .owl-next{right:-8px}
.media-carousel .owl-dots{margin-top:10px}

/* Anti-corte */
.media-photo img{ object-position:center }
.media-photo.is-portrait img{
  object-fit:contain; background:#000;
}

/* focos */
.media-photo[data-focus="top"]   img{object-position:center 10%}
.media-photo[data-focus="upper"] img{object-position:center 5%}
.media-photo[data-focus="face"]  img{object-position:center 15%}

/* Navbar dropdown */
.navbar .dropdown-menu { padding: .5rem; border-radius: .75rem }

/* =========================================================
   HERO que usa IMG (versão sua final)
   ========================================================= */
.hero-fit{
  position:relative; min-height:100vh;
  display:flex; align-items:center; justify-content:center;
  color:#fff; text-align:center; overflow:hidden;
}

.hero-bg{ position:absolute; inset:0; will-change:transform; }

/* 🔥 AJUSTE PRINCIPAL: imagem mais clara + mais viva */
.hero-img{
  position:absolute; left:0; top:-10vh;
  width:100%; height:120vh;
  object-fit:contain;
  object-position:center;
  background:#000;
  transform:translate3d(0,0,0);

  filter:brightness(1.25) contrast(1.05); /* <<< clareamento */
}

.hero-overlay{
  position:absolute; inset:0;
  background:rgba(0,0,0,.18); /* <<< mais leve */
}

.hero-fit .container{
  position:relative; z-index:1; padding:0 1rem;
}

/* Mobile */
@media (max-width:576px){
  .hero-img{ top:0; height:100vh; }
}

/* Galeria */
.gallery-photo{
  aspect-ratio: 1 / 1;
  border-radius: 16px; overflow: hidden; background:#0b0d12;
  box-shadow:0 10px 24px rgba(0,0,0,.10);
}
.gallery-photo img{ width:100%; height:100%; object-fit:cover; display:block }

.video-box{
  aspect-ratio: 16 / 9;
  border-radius: 16px; overflow: hidden; background:#000;
  box-shadow:0 10px 24px rgba(0,0,0,.10);
}
.video-box video{ width:100%; height:100%; object-fit:contain; background:#000 }
#heroTitle,
#heroDesc {
  transition: opacity .6s ease-in-out;
}

#heroTitle.is-fading,
#heroDesc.is-fading {
  opacity: 0;
}