:root{
  /* Cores adaptadas ao logo enviado */
  --bg: #f6f8f7;
  --card: #ffffff;
  --accent: #39B54A;
  --accent-dark: #2f9a3d;
  --text: #0f1720;
  --muted: #6b7280;
  --glass: rgba(15,23,32,0.04);
  --radius:12px;
  --container:1200px;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial;
  color-scheme: light;
}

/* Tipografia */
h1,h2,h3, .brand, .site-title { font-family: "Montserrat", Inter, sans-serif; }
body { font-family: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial; }

*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  background: linear-gradient(180deg,var(--bg) 0%, #eef3f2 100%);
  color:var(--text);
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  line-height:1.5;
}

/* Container */
.container{
  width:calc(100% - 2rem);
  max-width:var(--container);
  margin:0 auto;
  padding:2rem 1rem;
}

/* Header */
.site-header{
  position:sticky;
  top:0;
  background: rgba(255,255,255,0.95);
  backdrop-filter: blur(6px);
  z-index:40;
  border-bottom:1px solid rgba(15,23,32,0.06);
}
.header-inner{
  display:flex;
  gap:1rem;
  align-items:center;
  justify-content:space-between;
}

/* Logo */
.logo{ display:flex; gap:0.75rem; align-items:center; }
.logo-image{ height:96px; width:auto; display:block; }
.brand{ font-weight:700; letter-spacing:0.02em; color:var(--text); font-size:1rem; }

/* Visually hidden */
.visually-hidden{
  position: absolute !important;
  height: 1px; width: 1px;
  overflow: hidden;
  clip: rect(1px, 1px, 1px, 1px);
  white-space: nowrap;
}

/* Nav */
.main-nav ul{
  list-style:none;
  margin:0;
  padding:0;
  display:flex;
  gap:1.25rem;
  align-items:center;
}
.main-nav a{
  color:var(--muted);
  text-decoration:none;
  padding:0.45rem 0.5rem;
  border-radius:8px;
  transition:all .18s ease;
  font-weight:600;
}
.main-nav a:hover, .main-nav a:focus{
  color:var(--text);
  background:var(--glass);
}

/* Hamburger (mobile) */
.hamburger{ display:none; background:transparent; border:0; padding:0.3rem; }
.hamburger span{ display:block; width:22px; height:2px; background:var(--muted); margin:4px 0; border-radius:2px; }

/* Hero */
.hero{ padding:2rem 0 1rem; /* reduzido para aproximar serviços */ }
.hero-inner{ display:flex; gap:2rem; align-items:center; justify-content:space-between; flex-wrap:wrap; }
.hero-text{ flex:1 1 480px; max-width:700px; }
.site-title{ margin:0 0 .5rem 0; font-size:clamp(1.8rem, 4.5vw, 3.2rem); letter-spacing:-0.02em; font-weight:700; }
.lead{ color:var(--muted); margin:0 0 1rem 0; font-size:1.05rem; }
.hero-cta{ margin-bottom:0.25rem; } /* reduz espaço abaixo do CTA */
.hero-cta .btn{ margin-right:0.75rem; margin-bottom:0.5rem; text-decoration:none }
.btn{ display:inline-block; padding:0.65rem 1rem; border-radius:10px; font-weight:600; border:1px solid transparent; }
.btn.primary{ background:linear-gradient(90deg,var(--accent),var(--accent-dark) 70%); color:#fff; box-shadow: 0 6px 18px rgba(57,181,74,0.12); }
.btn.ghost{ background:transparent; border:1px solid rgba(15,23,32,0.06); color:var(--text); }

/* Hero visual: vídeo */
.hero-visual{ flex:0 1 320px; display:flex; align-items:center; justify-content:center; }
.hero-visual video{
  width:320px;
  height:220px;
  max-width:100%;
  border-radius:14px;
  object-fit:cover;
  display:block;
  border:1px solid rgba(15,23,32,0.03);
  background:#000;
}

/* Services - CARROSSEL */
/* padding-top reduzido para ficar logo abaixo do CTA */
.services{ padding:0.5rem 0 3rem; }
.services h2{ margin:0 0 0.25rem 0; }
.section-sub{ color:var(--muted); margin-bottom:1rem; }

/* viewport: área visível do carrossel */
.service-viewport{
  overflow:hidden;
  width:100%;
  position:relative;
  padding:0.25rem 0;
}

/* track: faixa que desliza (conteúdo duplicado via JS) */
.service-track{
  display:flex;
  gap:1rem;
  align-items:stretch;
  transition: transform 0.05s linear;
  will-change: transform;
}

/* cada card tem largura fixa relativa para que 3 caibam na tela em desktop */
.service-card{
  background:var(--card);
  padding:1.25rem;
  border-radius:12px;
  border:1px solid rgba(15,23,32,0.04);
  box-shadow: 0 6px 18px rgba(12,18,20,0.03);
  display:flex;
  flex-direction:column;
  gap:0.5rem;
  /* largura para 3 visíveis em desktop */
  flex: 0 0 calc((100% / 3) - ( (1rem * 2) / 3 ));
  min-width: calc((100% / 3) - ( (1rem * 2) / 3 ));
  box-sizing: border-box;
}

/* imagens dos serviços */
.service-card img{
  width:100%;
  height:160px;
  object-fit:cover;
  border-radius:8px;
  display:block;
  margin-bottom:0.25rem;
}

/* Contact */
.contact{ padding:3rem 0 6rem; }
.contact-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:1rem; }
.contact-card{ background:var(--card); padding:1rem; border-radius:12px; border:1px solid rgba(15,23,32,0.04); }

/* Footer */
.site-footer{ border-top:1px solid rgba(15,23,32,0.04); padding:1rem 0; color:var(--muted); background:transparent; }
.footer-inner{ display:flex; justify-content:space-between; align-items:center; gap:1rem; flex-wrap:wrap; }

/* Responsividade: tablet => 2 visíveis, mobile => 1 visível */
@media (max-width:980px){
  .service-card{ flex: 0 0 calc((100% / 2) - ( (1rem * 1) / 2 )); min-width: calc((100% / 2) - ( (1rem * 1) / 2 )); }
  .contact-grid{ grid-template-columns:repeat(2,1fr); }
  .hero-inner{ gap:1rem; }
  .hero-visual{ order:2; margin-top:1rem; }
  .hero-text{ order:1; }
  .service-card img{ height:140px; }
  .hero-visual video{ width:100%; height:180px; }
}
@media (max-width:640px){
  .service-card{ flex: 0 0 100%; min-width: 100%; }
  .main-nav{ position:absolute; inset:64px 0 0 0; background:linear-gradient(180deg,#ffffff,#ffffff); display:none }
  .main-nav.open{ display:block }
  .main-nav ul{ flex-direction:column; padding:1rem }
  .hamburger{ display:block }
  .logo-image{ height:64px } /* mobile */
  .container{ padding:1rem }
  .service-card img{ height:180px }
  .hero-visual video{ width:100%; height:220px; }
}