:root{
  --aqua: #2ac7b8; /* verde água */
  --aqua-dark: #1f9f8f;
  --white: #ffffff;
  --muted: #6c757d;
  --dark: #0b0b0b;
  --gray: #f7f7f7;
}
/* Base */
.body, body{font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial; color:var(--dark); background:var(--gray);} 
.text-aqua{color:var(--aqua) !important}
.bg-aqua{background:linear-gradient(135deg,var(--aqua),var(--aqua-dark));}
.btn-aqua{background:var(--aqua); color:var(--dark); border:0}

.hero{min-height:60vh; display:flex; align-items:center}
.card img{object-fit:cover}

/* Responsive tweaks */
@media (max-width: 767.98px){
  .hero{min-height:50vh}
  .display-5{font-size:1.6rem}
}

/* Accessibility and small styles */
.badge.bg-aqua{color:var(--dark)}

/* Ensure full width layout on small devices */
.container{max-width:1100px}

/* New layout styles */
.hero-row{min-height:320px}
.hero-left{position:relative; height:100%;}
.hero-image-placeholder{
  background-image: url('../imgs/home.png');
  background-size: cover;
  background-position: center;
  width:100%;
  height:100%;
  min-height:320px;
}
.hero-left{position:relative; overflow:hidden}
.hero-left::before{
  content: "";
  position: absolute;
  inset: 0;
  /* subtle dark gradient to improve text contrast */
  background: linear-gradient(180deg, rgba(0,0,0,0.5) 0%, rgba(0,0,0,0.35) 40%, rgba(0,0,0,0.12) 75%, rgba(0,0,0,0) 100%);
  z-index: 1;
  pointer-events: none;
}
.hero-text{position:absolute; left:5%; top:20%; color:var(--white); max-width:60%; z-index:2}
.hero-text h1{font-size:3.2rem; text-shadow:0 2px 6px rgba(0,0,0,0.45); font-weight:700}
/* Make the subtitle more visible */
.hero-text p.lead{
  font-weight:600;
  font-size:1.15rem;
  color:var(--white);
  opacity:0.98;
  text-shadow:0 1px 4px rgba(0,0,0,0.45);
  margin-top:0.5rem;
}

.logo-card{width:320px; height:220px; display:flex; align-items:center; justify-content:center}
.logo-placeholder{width:100%; height:100%; border-radius:18px; display:flex; align-items:center; justify-content:center;}

.logo-placeholder img{max-width:100%; max-height:100%; display:block}
.logo-placeholder .fallback-text{font-size:0.95rem; color:var(--muted)}
.logo-placeholder img[onerror]{display:block}

.service-card{background:#fff; border-radius:12px; height:100%; display:flex; flex-direction:column; align-items:center; justify-content:flex-start; box-shadow:0 6px 18px rgba(0,0,0,0.04)}
.service-card h6{margin-top:auto}
.service-img{width:84px; height:84px; object-fit:contain}

/* Make logo card fluid on small screens */
.logo-card{max-width:360px}

@media (max-width:767.98px){
  .service-card{padding:1rem}
  .service-img{width:64px; height:64px}
  .logo-card{width:90%; margin: 0 auto;}
}

.contact-bar{background:#0f3760; color:var(--white)}
.whatsapp-icon{width:64px; height:64px; border-radius:50%; background:#fff; display:flex; align-items:center; justify-content:center}
.qr-placeholder{width:120px; height:120px}

@media (max-width:767.98px){
  .contact-bar .row{gap:1rem}
  .qr-placeholder{display:none}
}

/* Responsive adjustments */
@media (max-width: 991.98px){
  /* Keep hero text overlaying the image on mobile: center it and reduce size */
  .hero-text{position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); padding:16px; color:var(--white); max-width:90%; text-align:center}
  .hero-text h1{font-size:2rem; line-height:1.05}
  .logo-card{width:220px; height:140px; margin-top:0}
  .hero-image-placeholder{min-height:300px}
  /* strengthen overlay on small screens for guaranteed readability */
  .hero-left::before{background: linear-gradient(180deg, rgba(0,0,0,0.65) 0%, rgba(0,0,0,0.5) 40%, rgba(0,0,0,0.2) 75%, rgba(0,0,0,0) 100%);} 
}