:root{
  --bg:#ffffff;
  --card:#ffffff;
  --accent:#4f46e5;
  --muted:#64748b;
  --text:#0f1724;
  --header-height:84px;
  --max-width:1100px;
}

*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  font-family:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial;
  background:linear-gradient(180deg,var(--bg),#f8fafc 60%);
  color:var(--text);
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}

.site-header{
  position:fixed;
  top:0;
  left:0;
  right:0;
  height:var(--header-height);
  backdrop-filter:blur(6px);
  background:linear-gradient(180deg, rgba(255,255,255,0.98), rgba(255,255,255,0.95));
  border-bottom:1px solid rgba(2,6,23,0.06);
  z-index:100;
  display:flex;
  align-items:center;
}

.header-inner{
  width:100%;
  max-width:var(--max-width);
  margin:0 auto;
  display:flex;
  gap:16px;
  align-items:center;
  padding:12px;
}

.brand h1{
  margin:0;
  font-size:1rem;
  letter-spacing:0.2px;
  color:var(--text);
}
.brand .tag{
  margin:0;
  font-size:0.8rem;
  color:var(--muted);
}

/* layout spacing to avoid header overlap */
main{
  padding-top:calc(var(--header-height) + 24px);
  max-width:var(--max-width);
  margin:0 auto;
  padding-left:16px;
  padding-right:16px;
}

/* Carousel */
.carousel{
  position:relative;
  margin:24px 0;
  background:transparent;
}

.carousel-viewport{
  overflow:hidden;
  border-radius:12px;
  box-shadow:0 8px 30px rgba(2,6,23,0.06);
  background:linear-gradient(180deg, rgba(255,255,255,1), rgba(250,250,250,1));
  border:1px solid rgba(2,6,23,0.04);
}

.carousel-track{
  display:flex;
  transition:transform 500ms cubic-bezier(.2,.9,.3,1);
  will-change:transform;
}

.carousel-slide{
  min-width:100%;
  padding:44px;
  display:flex;
  flex-direction:column;
  gap:12px;
  background:transparent;
}

.carousel-slide h2{
  margin:0;
  font-size:1.6rem;
  color:var(--text);
}
.carousel-slide p{
  margin:0;
  color:var(--muted);
  line-height:1.5;
  max-width:48ch;
}

/* Buttons */
.carousel-btn{
  position:absolute;
  top:50%;
  transform:translateY(-50%);
  background:rgba(15,23,36,0.06);
  border:0;
  color:var(--text);
  width:44px;
  height:44px;
  border-radius:999px;
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  box-shadow:0 2px 8px rgba(2,6,23,0.04);
}
.carousel-btn.prev{ left:12px; }
.carousel-btn.next{ right:12px; }

/* Dots */
.carousel-dots{
  display:flex;
  gap:8px;
  justify-content:center;
  padding:12px 0;
}
.carousel-dots button{
  width:10px;height:10px;border-radius:50%;border:0;background:rgba(15,23,36,0.12);cursor:pointer;
}
.carousel-dots button[aria-selected="true"]{ background:var(--accent); box-shadow:0 0 0 4px rgba(79,70,229,0.08); }

/* Clients */
.clients{
  margin:32px 0 80px;
  text-align:center;
}
.clients h2{ margin:0 0 8px; color:var(--text); }
.clients-note{ color:var(--muted); font-size:0.9rem; margin-top:6px; margin-bottom:18px; }

.clients-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(120px,1fr));
  gap:18px;
  align-items:center;
  justify-items:center;
  max-width:900px;
  margin:0 auto;
  padding:12px;
}
.clients-grid img{
  width:120px;
  height:60px;
  object-fit:contain;
  filter:grayscale(0.0) contrast(0.95);
  opacity:0.98;
  background:rgba(2,6,23,0.02);
  padding:8px;
  border-radius:8px;
}

/* Logo */
/*.logo{
  width: auto;
  height: 51px;*/             
  /*max-width: 100%;
}*/

/* Mobile: ajuste do tamanho do logo */
@media (max-width:600px){
  .carousel-slide{ padding:28px; }
  .brand h1{ font-size:0.95rem; }
}