
* { margin:0; padding:0; box-sizing:border-box; }

:root{
  --brand-green:#368800;
  --brand-yellow:#f3bc0a;
  --graphite:#2C2C2C;
  --graphite-2:#1F1F1F;
  --text-light:#b9bcc1;
  --text-lighter:#e0e0e0;
}

html, body{ min-height:100%; }
body{
  font-family:'Roboto',sans-serif;
  color:#333;
  line-height:1.6;
  overflow-x:hidden;
  background:#f5f5f5;
}

/* Títulos */
h1,h2,h3{ font-weight:700; }

/* Utilidades */
.logo-img{ max-width:150px; height:auto; }
.line-break{
  height:2px;
  background:linear-gradient(to right, transparent, var(--brand-yellow), transparent);
  margin:2rem 0;
  border:none;
}

/* ===========================
   HEADER / NAVEGAÇÃO
   =========================== */
.navbar-nav .nav-link{
  font-family:'Montserrat',sans-serif;
  font-weight:600;
  color:var(--brand-yellow) !important;
  letter-spacing:.2px;
}
.navbar-nav .nav-link.active{ font-weight:700; }
.navbar-dark .navbar-toggler{ border-color:rgba(255,255,255,.2); }

/* Link ativo (reforço) */
.navbar .nav-link.active{
  color:var(--brand-yellow) !important;
  font-weight:600;
  text-decoration:underline;
  text-decoration-color:var(--brand-yellow);
  text-underline-offset:4px;
}

/* ===========================
   PARALLAX / SECÇÕES
   =========================== */
/* Sem “perspective”/scroll próprio; nada de fundo escuro */
.parallax-container{
  min-height:100vh;
  overflow-x:hidden;
  overflow-y:visible;
  background:transparent;
}

/* Cada secção ocupa o ecrã; nada de z-index negativos */
.parallax-section{
  position:relative;
  min-height:100vh;
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  z-index:1;
}

/* Fundo com parallax por CSS e BLEED para eliminar fendas */
.parallax-bg{
  position:absolute;
  top:-6px; right:-6px; bottom:-6px; left:-6px; /* BLEED */
  background-size:cover;
  background-position:50% 50%;
  background-attachment:fixed;                 /* efeito parallax (desktop) */
  z-index:0;
}

/* Conteúdo acima do fundo */
.parallax-content{
  max-width:90%;
  margin:0 auto;
  padding:2rem;
  background-color:rgba(255,255,255,.9);
  box-shadow:0 0 20px rgba(0,0,0,.1);
  position:relative;
  z-index:1;
}
.content-text{ max-width:800px; margin:0 auto; }
.first-letter{
  font-size:3rem; font-weight:700; line-height:1;
  color:var(--brand-green); float:left; margin-right:10px; margin-bottom:-10px;
}

/* ===========================
   HERO (primeiro slide)
   =========================== */
.title-section{
  position:relative;
  min-height:100vh;
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  overflow:hidden;
  margin-bottom:-2px;                 /* cola no próximo slide */
}
.title-section::after{
  content:"Sm";
  position:absolute; inset:auto 0 10% 0; margin:auto; width:100%; text-align:center;
  font-family:'Montserrat',sans-serif; font-weight:700; font-size:26vw; line-height:1;
  color:rgba(255,255,255,.05);
  z-index:1;                           /* acima do hero-bg, abaixo do texto */
}
.hero-bg{
  position:absolute;
  top:-6px; right:-6px; bottom:-6px; left:-6px; /* BLEED */
  background-image:
    linear-gradient(rgba(0,0,0,.55), rgba(0,0,0,.55)),
    url('assets/empresaSM.png');
  background-size:cover;
  background-repeat:no-repeat;
  background-position:80% 70%;         /* foca a placa (ajusta 70–80%) */
  background-attachment:fixed;
  z-index:0;                           /* fundo do hero */
}
.title-content{ position:relative; z-index:2; padding:4rem 2rem; }
.title-content h1{
  font-weight:700;
  font-family:'Montserrat',sans-serif;
  font-size:4rem; text-transform:uppercase; letter-spacing:.5px; margin-bottom:1rem; color:#fff;
}
.title-content h2{ font-size:1.5rem; color:var(--brand-yellow); }

/* Colagem extra entre secções parallax */
.title-section + .parallax-section{ margin-top:-2px; }
.parallax-section + .parallax-section{ margin-top:-2px; }

/* ===========================
   FOOTER (GLOBAL)
   =========================== */
.site-footer{
  background: linear-gradient(135deg, var(--graphite) 0%, var(--graphite-2) 100%);
  color: var(--text-light);
  border-top:1px solid rgba(255,255,255,.06);
  padding:40px 0 20px;
  font-size:.9rem;
  position:relative;
  overflow:hidden;
  margin-top:60px;
}
.site-footer::before{
  content:""; position:absolute; top:0; left:0; right:0; height:1px;
  background:linear-gradient(90deg, transparent 0%, var(--brand-yellow) 20%, var(--brand-yellow) 80%, transparent 100%);
}
.site-footer .container{ position:relative; z-index:2; }

.brandline{
  margin:0 0 1rem;
  opacity:.85; letter-spacing:.2px; font-size:.95rem; line-height:1.5;
  color:var(--text-lighter);
}
.brand-initial{ color:var(--brand-yellow); font-weight:700; margin-right:2px; font-size:1.1em; }

.links a{
  color:var(--text-light);
  text-decoration:none;
  transition:all .3s ease;
  position:relative;
  padding:0 5px;
  font-size:.9rem;
}
.links a::after{
  content:""; position:absolute; bottom:-2px; left:0; width:0; height:1px;
  background-color:var(--brand-yellow); transition:width .3s ease;
}
.links a:hover{ color:var(--brand-yellow); }
.links a:hover::after{ width:100%; }
.sep{ margin:0 8px; color:#6c727a; }

.social{
  display:flex; justify-content:center; gap:20px; margin:0 0 15px;
}
.social a{
  display:flex; align-items:center; justify-content:center; width:40px; height:40px;
  background:rgba(255,255,255,.08); color:var(--text-light); border-radius:50%;
  text-decoration:none; transition:all .3s ease; position:relative; overflow:hidden;
}
.social a::before{
  content:""; position:absolute; inset:0;
  background:linear-gradient(135deg, var(--brand-green), var(--brand-yellow));
  opacity:0; transition:opacity .3s ease;
}
.social a i{ position:relative; z-index:1; }
.social a:hover{ transform:translateY(-3px); box-shadow:0 5px 15px rgba(0,0,0,.2); }
.social a:hover::before{ opacity:1; }
.social a:hover i{ color:#fff; }

.copy{
  display:block; color:#7f848b; font-size:.8rem; text-align:center; margin:20px 0;
}

/* Logos de financiamento */
.fund-logos{
  display:flex; gap:20px; justify-content:center; align-items:center; flex-wrap:wrap; margin:15px 0;
}
.fund-logos img{
  height:40px; object-fit:contain;
  filter:grayscale(100%) brightness(1.1);
  opacity:.85; transition:all .3s ease;
  padding:5px; background:rgba(255,255,255,.05); border-radius:4px;
}
.fund-logos img:hover{
  filter:none; opacity:1; transform:translateY(-2px);
  box-shadow:0 5px 12px rgba(0,0,0,.15);
}

/* Efeito subtil no fundo do footer */
.site-footer::after{
  content:""; position:absolute; inset:0;
  background-image:
    radial-gradient(circle at 20% 30%, rgba(243,188,10,0.03) 0%, transparent 40%),
    radial-gradient(circle at 80% 70%, rgba(27,77,62,0.03) 0%, transparent 40%);
  pointer-events:none;
}

/* ===========================
   RESPONSIVO
   =========================== */
@media (max-width: 992px){
  .title-content{ padding:3rem 1.5rem; }
  .title-content h1{ font-size:3.2rem; }
  .site-footer .row{ text-align:center; }
  .site-footer .links{ margin-bottom:20px; }
}
@media (max-width: 768px){
  .title-content h1{ font-size:2.6rem; }
  .title-content h2{ font-size:1.2rem; }
  .parallax-content{ padding:1.5rem; }
  .first-letter{ font-size:2rem; float:none; margin:0; color:var(--brand-yellow); }
  .site-footer{ padding:10px 0; }
  .site-footer .social{ gap:12px; }
  .fund-logos img{ height:30px; }
}
@media (max-width: 576px){
  .fund-logos img{ height:25px; }
  .brandline{ font-size:.85rem; }
  .links a{ font-size:.8rem; }
  .social{ gap:15px; }
}

/* Mobile/tablet: iOS/Android não gostam de fixed → desliga parallax */
@media (max-width:1024px){
  .parallax-bg,
  .hero-bg{ background-attachment:scroll; }
  .hero-bg{ background-position:50% 62%; }
}

/* Ajuste fino no 3.º slide (imagem muito clara no topo) */
#qualidade .parallax-bg{ background-position:50% 40%; margin-top: 0rem!important; }

