/* dark v1 palette with enhancements */
* { 
  box-sizing: border-box; 
} 

html, body { 
  margin: 0; 
  padding: 0; 
}

:root { 
  --brand:#0B1B00; 
  --accent:#C7F431; 
  --bg:#0C0F0A; 
  --surface:#101410; 
  --surface-2:#121712; 
  --muted:#9AA39A; 
  --text:#E7F0E7; 
  --ring:0 0 0 3px rgba(199,244,49,.35); 
  --radius:14px; 
  --shadow:0 6px 30px rgba(0,0,0,.35); 
  --container:1120px;
}

body {
  font:400 17px/1.6 'Urbanist',system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif; 
  color:var(--text); 
  background:linear-gradient(180deg,#0B0F0B 0%,#101410 100%);
}

h1,h2,h3 { 
  font-family:'Sora',system-ui,-apple-system,Segoe UI,Roboto,sans-serif; 
}

a { 
  color:inherit; 
  text-decoration:none; 
} 

img { 
  max-width:100%; 
  display:block; 
} 

.container { 
  max-width:var(--container); 
  margin:0 auto; 
  padding:0 20px; 
}
.brand-logo {
  height: 42px;           /* ajusta o tamanho do logo */
  width: auto;            /* mantém proporção */
  display: block;
}

@media (max-width: 600px) {
  .brand-logo {
    height: 32px;         /* reduz um pouco em telas pequenas */
  }
}

/* Header */
.site-header { 
  position:sticky; 
  top:0; 
  z-index:50; 
  backdrop-filter:blur(8px); 
  background:rgba(16,20,16,.65); 
  border-bottom:1px solid var(--accent); 
}

.header-grid { 
  display:grid; 
  grid-template-columns:auto 1fr; 
  align-items:center; 
  gap:16px; 
  min-height:64px; 
}

.brand-name { 
  letter-spacing:.5px; 
  font-weight:700;
}

.main-nav ul { 
  display:flex; 
  gap:14px; 
  align-items:center; 
  justify-content:flex-end; 
  list-style:none; 
  margin:0; 
  padding:0;
}
.main-nav a {
  margin: 0 14px; /* espaçamento horizontal */
  padding: 6px 0; /* espaçamento vertical opcional */
}

.main-nav .pill { 
  padding:10px 14px; 
  border-radius:999px; 
  background:var(--accent); 
  color:#0B1B00; 
  font-weight:700;
}

.nav-toggle { 
  display:none;
}

@media (max-width:800px) { 
  .nav-toggle { 
    display:inline-block; 
    background:transparent; 
    border:1px solid rgba(255,255,255,.2); 
    border-radius:10px; 
    padding:8px 10px; 
    color:var(--text);
  } 

  .main-nav ul { 
    display:none;
  } 

  .main-nav[data-open="true"] ul { 
    display:flex; 
    flex-direction:column; 
    align-items:flex-end; 
    padding:12px 0;
  } 
}

/* Hero */
.hero { 
  padding:72px 0 28px; 
  background: radial-gradient(600px 300px at 20% 10%, rgba(199,244,49,.08), transparent 70%); 
}

.hero-grid { 
  display:grid; 
  gap:40px; 
  grid-template-columns:1.1fr .9fr; 
  align-items:center;
}

@media (max-width:980px) { 
  .hero-grid { 
    grid-template-columns:1fr; 
  } 
}

.hero h1 { 
  font-size: clamp(40px,6vw,74px); 
  line-height:1.02; 
  margin:0 0 16px; 
  letter-spacing:-1px;
}

.accent { 
  color:var(--accent); 
}

.lead { 
  font-size:18px; 
  color:#DCE6DC; 
  max-width:64ch;
}

.cta-row { 
  display:flex; 
  gap:12px; 
  margin-top:18px;
}

.btn, button, [type="submit"] { cursor: pointer; }
button[disabled], .btn[disabled] { cursor: not-allowed; opacity:.6; }
.form-feedback { display:block; margin-top:8px; font-weight:500; }


.btn { 
  display:inline-block; 
  padding:12px 16px; 
  border-radius:12px; 
  font-weight:700; 
  border:1px solid var(--accent);
}

.btn-primary { 
  background:var(--accent); 
  color:#0B1B00; 
  border-color:transparent; 
  box-shadow:var(--shadow);
}

.btn-ghost { 
  background:transparent; 
  color:var(--text);
}

.hero-bullets { 
  padding-left:20px; 
  margin:16px 0 0; 
  color:#C7D3C7; 
}

.hero-bullets li { 
  margin:6px 0; 
}

.hero-media .vehicle-card { 
  border-radius:var(--radius); 
  background: linear-gradient(160deg,#0E130E,#151A14); 
  border:1px solid rgba(255,255,255,.06); 
  box-shadow:var(--shadow); 
  overflow:hidden;
}

.hero-media .vehicle-card img { 
  width:100%; 
  height:auto;
}

.media-caption { 
  font-size:16px; 
  color:var(--muted); 
  margin-top:10px; 
  text-align:center; 
}

/* Sections */
.section { 
  padding: 64px 0; 
}

.section.alt { 
  background: linear-gradient(0deg, rgba(255,255,255,.03), rgba(255,255,255,0)); 
}

.section.highlight { 
  background: linear-gradient(0deg, rgba(199,244,49,.08), rgba(199,244,49,0)); 
}

.section-head h2 { 
  margin:0 0 8px; 
  font-size: clamp(26px, 3.6vw, 38px); 
}

.section-head p { 
  margin:0 0 22px; 
  color:#DDE5DD; 
}

/* Grid */
.grid { 
    padding-top: 20px;
  display:grid; 
  gap:18px; 
}

.cards-3 { 
  grid-template-columns: repeat(3, 1fr); 
}

.features-2 { 
  grid-template-columns: repeat(2, 1fr); 
  gap:22px; 
}

@media (max-width: 900px) { 
  .cards-3 { grid-template-columns: 1fr; } 
  .features-2 { grid-template-columns:1fr; } 
}

/* Cards */
.card {
  background: linear-gradient(180deg, #121712, #0F130F);
  border: 1px solid rgba(255,255,255,.06);
  border-radius: var(--radius);
  padding: 18px;
  box-shadow: var(--shadow);
}

.card h3 { 
  margin-top: 6px; 
}

.icon { 
  color: var(--accent); 
}

/* Stats */
.stats {
  display:grid; 
  grid-template-columns: repeat(3,1fr); 
  gap:16px; 
  margin-top:18px; 
  text-align:center;
}

.stats strong { 
  display: block; 
  font-size: clamp(22px, 4.5vw, 36px); 
  color: var(--accent); 
  font-family: 'Sora', system-ui, -apple-system, Segoe UI, Roboto, sans-serif;
}


.stats span { 
  color:#DCE6DC; 
  font-size:18px; 
}

@media (max-width: 700px) { 
  .stats { grid-template-columns:1fr; } 
}

.note { 
  font-size: 16px; 
  color: var(--muted); 
  margin-top: 10px; 
}

/* Chips */
.chips { 
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); 
}

.chip {
  display:inline-block; 
  border:1px solid rgba(255,255,255,.10); 
  padding:10px 12px;
  border-radius: 999px; 
  background: #0F140F; 
  text-align:center;
}

/* Trust */
.trust { 
  display:grid; 
  grid-template-columns: repeat(4,1fr); 
  gap:12px; 
}

.trust-badge {
  display:flex; 
  align-items:center; 
  gap:10px; 
  justify-content:center;
  padding:12px 14px; 
  border:1px solid rgba(255,255,255,.08);
  border-radius: 12px; 
  background:#0F140F;
}

.trust .check { 
  color:var(--accent); 
  font-weight:900; 
}

@media (max-width: 900px) { 
  .trust { grid-template-columns:1fr 1fr; } 
}

/* Media Slots */
.media-slot { 
  margin:14px 0 18px; 
} 

.media-slot.small img { 
  max-width:560px; 
} 

.media-slot img { 
  width:100%; 
  height:auto; 
  border-radius:12px; 
  margin-top: 30px;
  border:1px solid rgba(255,255,255,.08); 
  box-shadow:var(--shadow); 
}

.video-slot { 
  margin-top:16px; 
  text-align:center; 
} 

.video-slot video { 
  width:100%; 
  max-width:1200px; 
  border-radius:14px; 
  border:1px solid rgba(255,255,255,.08); 
  box-shadow:var(--shadow);
}

/* Forms */
.contact-grid { 
  display:grid; 
  grid-template-columns:1.1fr .9fr; 
  gap:22px; 
  align-items:start; 
}

@media (max-width:980px) { 
  .contact-grid { grid-template-columns:1fr; } 
}

.form-row { 
  display:flex; 
  flex-direction:column; 
  gap:6px; 
  margin-bottom:12px; 
}

input, select, textarea { 
  width:100%; 
  background:#0E130E; 
  color:var(--text); 
  border:1px solid rgba(255,255,255,.12); 
  border-radius:10px; 
  padding:10px 12px; 
  outline:none; 
}

input:focus, select:focus, textarea:focus { 
  box-shadow:var(--ring); 
  border-color:transparent; 
}

.form-feedback { 
  min-height:1.4em; 
  margin-top:6px; 
  color:var(--accent); 
}


input, select, textarea {
  width: 100%;
  background: #0E130E;
  color: var(--text);
  border: 1px solid rgba(255, 255, 255, .12);
  border-radius: 10px;
  padding: 10px 12px;
  outline: none;
  font-family: 'Urbanist', sans-serif; /* 👈 adicionado */
  font-size: 16px;                     /* 👈 opcional, ajusta proporção */
  font-weight: 500;                    /* 👈 mantém consistência visual */
}
input::placeholder,
textarea::placeholder {
  font-family: 'Urbanist', sans-serif;
  color: rgba(255, 255, 255, 0.5);
}





/* FAQ */
.faq details { 
  background: linear-gradient(180deg,#121712,#0F130F); 
  border:1px solid rgba(255,255,255,.06); 
  border-radius:12px; 
  padding:12px 14px; 
  margin:8px 0; 
}

.faq summary { 
  cursor:pointer; 
  font-weight:600; 
  color:#EAF5EA; 
}

.faq p { 
  margin:.5em 0 0; 
  color:#DCE6DC; 
}

/* Footer */
.site-footer { 
  border-top:1px solid rgba(255,255,255,.06); 
  padding:28px 0; 
  background:#0B0E0B; 
}

.footer-grid { 
  display:grid; 
  gap:16px; 
  grid-template-columns:1fr auto auto; 
  align-items:center; 
}

.footer-grid nav ul { 
  display:flex; 
  gap:14px; 
  list-style:none; 
  margin:0; 
  padding:0; 
}

.muted { 
  color:var(--muted); 
}

@media (max-width:800px) { 
  .footer-grid { 
    grid-template-columns:1fr; 
    text-align:center; 
  } 

  .footer-grid nav ul { 
    justify-content:center; 
    flex-wrap:wrap; 
  } 
}

.btn:focus-visible, 
a:focus-visible, 
button:focus-visible, 
input:focus-visible, 
select:focus-visible, 
textarea:focus-visible { 
  outline:none; 
  box-shadow:var(--ring); 
}


.app-grid{ 
    grid-template-columns: repeat(auto-fit, minmax(240px,1fr)); 
    gap:14px;} 
    
.app-card{ 
    background: linear-gradient(180deg,#121712,#0F130F); 
    border:1px solid rgba(255,255,255,.06); 
    border-radius:14px; 
    padding:14px;
} 

.app-card h3{ 
    margin:0 0 6px; 
    color:#EAF5EA; 
}


/* =========================================================
   BRILHO SUAVE — #C7F431
   ========================================================= */
/* =========================================================
   BRILHO SUAVE — #C7F431
   ========================================================= */

/* Bolinhas de listas (funcionalidades) */
.feature ul {
  list-style: none;
  padding-left: 0;
  margin: 10px 0 0;
}

.feature ul li {
  position: relative;
  padding-left: 28px;
  margin: 8px 0;
  line-height: 1.6;
}

.feature ul li::before {
  content: '';
  position: absolute;
  left: 0;
  top: 0.6em;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: var(--accent);
  box-shadow: 0 0 6px color-mix(in srgb, var(--accent) 50%, transparent);
}

/* Glow nas bordas (cards e trust badges) */
.card,
.app-card,
.trust-badge {
  background: transparent;
  border: 1px solid rgba(255,255,255,.08);
  box-shadow:
    0 0 0 1px color-mix(in srgb, var(--accent) 45%, transparent) inset,
    0 0 16px color-mix(in srgb, var(--accent) 25%, transparent) inset,
    0 6px 20px rgba(0,0,0,.3);
  transition: box-shadow .25s ease, transform .25s ease;
}

.card:hover,
.card:focus-within,
.app-card:hover,
.app-card:focus-within,
.trust-badge:hover {
  transform: translateY(-2px);
  box-shadow:
    0 0 0 1px color-mix(in srgb, var(--accent) 60%, transparent) inset,
    0 0 22px color-mix(in srgb, var(--accent) 35%, transparent) inset,
    0 10px 26px rgba(0,0,0,.4);
}
/* FAQ com borda constante e leve brilho no hover */
.faq details {
  background: transparent;
  border: 1px solid rgba(199,244,49,.35); /* borda sempre visível */
  border-radius: 12px;
  padding: 12px 14px;
  margin: 8px 0;
  box-shadow: none; /* sem brilho constante */
  transition: box-shadow .25s ease, transform .25s ease, border-color .25s ease, background .25s ease;
}

.faq details:hover,
.faq details[open] {
  transform: translateY(-2px);
  border-color: rgba(199,244,49,.55); /* reforça a cor no hover */
  background: rgba(199,244,49,0.02);  /* leve toque translúcido */
  box-shadow:
    0 0 10px rgba(199,244,49,.18),
    0 6px 18px rgba(0,0,0,.25);
}



/* Glow sutil nos números (.stats) */
.stats div {
  background: transparent;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: var(--radius);
  padding: 22px 18px;
  box-shadow:
    0 0 0 1px color-mix(in srgb, var(--accent) 45%, transparent) inset,
    0 0 16px color-mix(in srgb, var(--accent) 25%, transparent) inset,
    0 6px 20px rgba(0,0,0,.3);
  transition: box-shadow .25s ease, transform .25s ease;
}

.stats div:hover {
  transform: translateY(-2px);
  box-shadow:
    0 0 0 1px color-mix(in srgb, var(--accent) 60%, transparent) inset,
    0 0 22px color-mix(in srgb, var(--accent) 35%, transparent) inset,
    0 10px 26px rgba(0,0,0,.4);
}

.stats strong {
  font-family: 'Sora', system-ui, -apple-system, Segoe UI, Roboto, sans-serif;
  font-weight: 700;
  font-size: clamp(24px, 5vw, 40px);
  color: var(--accent);
  display: block;
  margin-bottom: 4px;
}

.stats span {
  font-family: 'Urbanist', system-ui, -apple-system, Segoe UI, Roboto, sans-serif;
  color: #E4E9E4;
  font-size: 16px;
}







.wa-fab {
  position: fixed;
  right: 20px;
  bottom: 20px;
  width: 64px;
  height: 64px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #25D366;
  color: #0b1b00;
  box-shadow: 0 10px 30px rgba(0,0,0,.35), 0 0 18px rgba(199,244,49,.20);
  border: 1px solid rgba(255,255,255,.18);
  z-index: 99;
  cursor: pointer;
  transition: transform .25s ease, box-shadow .25s ease;
  animation: wa-pulse 3.6s ease-in-out infinite;
}

.wa-icon {
  width: 30px;
  height: 30px;
  display: block;
  transform: translateY(0); /* total equilíbrio vertical */
}

.wa-fab:hover {
  transform: translateY(-3px) scale(1.05);
  box-shadow: 0 14px 36px rgba(0,0,0,.45), 0 0 22px rgba(199,244,49,.3);
}

@keyframes wa-pulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(37,211,102,0.45); }
  50% { box-shadow: 0 0 0 12px rgba(37,211,102,0); }
}

@media (max-width: 520px){
  .wa-fab{ right: 14px; bottom: 14px; width: 58px; height: 58px; }
  .wa-icon{ width: 27px; height: 27px; }
}
.wa-fab::after {
  content: "Fale conosco";
  position: absolute;
  right: 70px;
  background: #E7F0E7;
  color: #0b1b00;
  font-size: 13px;
  padding: 5px 10px;
  border-radius: 4px;
  opacity: 0;
  pointer-events: none;
  transition: opacity .25s ease, transform .25s ease;
  transform: translateY(4px);
}
.wa-fab:hover::after {
  opacity: 1;
  transform: translateY(0);
}