/* ===== Tokens & Reset ===== */
:root{
  --azul:#193b6a;
  --azul-2:#1D70B7;
  --amarelo:#F8B400;
  --amarelo-2:#FFC600;
  --cinza:#EAEAEA;
  --verde:#04bc09;
  --radius:18px;
}
*,
*::before,
*::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body{
  margin:0;
  font-family:'Montserrat', Arial, sans-serif;
  color:var(--azul);
  background:#fff;
  line-height:1.5;
}
img{ max-width:100%; height:auto; display:block; }
a{ color:inherit; text-decoration:none; }
.topbar{ height:12px; background:var(--amarelo); }

/* ===== Header ===== */
.header-bg{
  min-height: clamp(360px, 68vh, 640px);
  background: url('imagens/fachada-camelao.jpg') center/cover no-repeat;
  position: relative;
  color:#fff;
  display:grid;
  place-items:center;            /* centraliza vertical e horizontal */
  padding:16px;
  isolation:isolate;
}
.header-bg::after{
  content:"";
  position:absolute; inset:0;
  background:linear-gradient(180deg, #00000066, #00000022);
  z-index:0;
}
.header-content{
	position: relative;
	z-index: 1;
	text-align: center;
	display: grid;
	gap: 12px;
	align-content: center;
	align-items: center;
}
.header-title{
  margin:0;
  font-weight:900;
  color:#f5b700;
  text-shadow:1px 2px 9px #000a;
  font-size: clamp(1.6rem, 4.5vw, 2.8rem);
}
.header-subtitle{
  margin:0 0 6px;
  font-weight:800;
  text-shadow:1px 1px 6px #000a;
  font-size: clamp(1.1rem, 4.6vw, 2.2rem);
}
.btn-green{
  display:inline-block;
  background:var(--verde);
  color:#fff;
  font-weight:800;
  border:none;
  border-radius:999px;
  padding:12px 22px;
  font-size: clamp(.95rem, 2.4vw, 1.1rem);
  box-shadow:0 6px 16px #0002;
  transition:transform .12s ease, filter .2s ease;
}
.btn-green:hover,
.btn-green:focus{
	transform: translateY(-1px) scale(1.02);
	filter: brightness(.95);
}

/* ===== Estatísticas ===== */
.stats-cards{
  --gap:24px;
  max-width:1100px;
  margin:40px auto 0;
  padding:0 12px;
  display:grid;
  grid-template-columns: repeat(4, minmax(0,1fr));
  gap:var(--gap);
}
.stat-card{
  border-radius:var(--radius);
  padding:18px 12px;
  text-align:center;
  box-shadow:0 2px 12px #0001;
  display:flex; flex-direction:column; justify-content:center; align-items:center;
  min-height: clamp(120px, 14vw, 220px);
}
.stat-card.amarelo{ background:var(--amarelo-2); color:#fff; }
.stat-card.cinza{ background:var(--cinza); color:#2676bb; }
.stat-num{ font-size: clamp(1.6rem, 4.5vw, 3.2rem); font-weight:900; letter-spacing:-.5px; line-height:1; margin-bottom:8px; }
.stat-label{ font-weight:800; text-transform:uppercase; font-size: clamp(.9rem, 2.5vw, 1.1rem); }
.stat-icon{ margin-bottom:10px; }

@media (max-width: 980px){
  .stats-cards{ grid-template-columns: repeat(2, minmax(0,1fr)); }
}
@media (max-width: 560px){
  .stats-cards{ grid-template-columns: repeat(2, minmax(0,1fr)); gap:14px; }
}

/* ===== Seções comuns ===== */
.section-title{
	text-align: center;
	color: var(--azul-2);
	font-weight: 900;
	margin-top: 30px;
	margin-right: 0;
	margin-left: 0;
	margin-bottom: 50px;
	font-size: clamp(1.2rem, 4vw, 2rem);
	padding: 20px;
	line-height: 1.2;
}
.hero-photo{
  max-width:360px;
  margin:0 auto 16px;
}
.hero-photo img{
  border-radius:10px;
  box-shadow:0 2px 12px #0001;
}
.stack-center{ display:grid; place-items:center; margin:16px 0; }

/* ===== Depoimentos (imagens) ===== */
.depoimentos{ padding: 12px 0 4px; }
.depo-grid{
  max-width:1100px;
  margin:0 auto;
  padding:0 12px;
  display:grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap:18px;
}
.depo img{ border-radius:10px; }

@media (max-width: 900px){
  .depo-grid{ grid-template-columns: repeat(2, 1fr);align-content: center;
	  align-items: center; text-align: center; }
}
@media (max-width: 560px){
  .depo-grid{ grid-template-columns: 1fr; 
	  align-content: center;
	  align-items: center;
	  align-items: center; text-align: center; 
	
	}

}

/* ===== Lojistas de Sucesso ===== */
.sucesso{ padding: 8px 0 20px; }
.sucesso-grid{
  max-width:1200px;
  margin:0 auto;
  padding:0 12px;
  display:grid;
  grid-template-columns: repeat(4, minmax(0,1fr));
  gap:18px;
}
.brand{
  background:#fff;
  border-radius:10px;
  text-align:center;
  padding:14px 10px 10px;
}
.brand-logo{ height:110px; object-fit:contain; margin:0 auto 6px; }
.brand-text{ color:#29364d; font-size:.95rem; }

@media (max-width: 900px){
  .sucesso-grid{ grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 680px){
  .sucesso-grid{ grid-template-columns: repeat(2, 1fr); }  /* 2 por linha no mobile */
}

/* ===== Feature ===== */
.feature{
  max-width:1200px;
  margin:36px auto;
  padding:0 12px;
  display:grid;
  grid-template-columns: 1.00fr 1.45fr;
  gap:26px;
}
.feature-text{
  background:#F2F4EE;
  border-radius:18px;
  padding:26px 22px;
}
.feature-text p{ margin:0 0 14px; font-weight:600; color:#2b3d57;font-size: 15px; }
.checks{ list-style:none; margin:0 0 18px; padding:0; display:grid; gap:10px; }
.checks li{
  padding-left:28px;
  position:relative;
}
.checks li::before{
  content:"";
  position:absolute; left:0; top:3px;
  width:18px; height:18px; border-radius:50%;
  background:#19D64A;
  box-shadow: inset 0 0 0 4px #19D64A, 0 0 0 2px #fff;
  mask: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="white" d="M9.55 17.5 4.8 12.75l1.4-1.4 3.35 3.3 7.25-7.25 1.4 1.45-8.65 8.65z"/></svg>') center/14px 14px no-repeat;
}
.feature-media{
	border-radius: 18px;
	overflow: hidden;
	min-height: 260px;
	background: #000;
	margin-left: -50px;
}
@media (max-width: 920px){
  .feature{ grid-template-columns: 1fr; }
  .feature-media{ min-height:220px; 
	align-content: center;
	align-items: center;}
	
}

/* ===== CTA ===== */
.cta{
	background-position: center top;
	background-size: cover;
	background-image: url("imagens/bg-seja.jpg");
	min-height: clamp(460px, 52vw, 650px);
	display: grid;
	place-items: center;
	text-align: center;
	padding: 30px 12px 24px;
	margin-top: 100px;
	margin-bottom: 100;
}
.cta-title{
	margin-top: 38px;
	margin-right: 38px;
	margin-left: 38px;
	margin-bottom: 38px;
	color: var(--amarelo);
	font-weight: 900;
	letter-spacing: 1px;
	text-shadow: 1px 2px 8px #fff5;
	font-size: clamp(2rem, 10vw, 6rem);
	min-height: 0px;
}
.cta-sub{
	margin-top: clamp(-100px, 10vw, -190px);
	margin-right: 0;
	margin-left: 0;
	margin-bottom: 20px;
	color: var(--azul-2);
	font-weight: 900;
	font-size: clamp(1.6rem, 8vw, 4.6rem);
}

/* ===== Formulário (layout igual à arte) ===== */
.form-wrap{
  --card-bg: #EDEAE5;
  --card-br: 26px;
  --field-bg:#F3F3F3;
  --field-br:12px;
  --field-bd:#CFCFCF;
  --text:#2b3d57;
	max-width: 1200px;
	margin: 60px auto 0;
	padding-right: 12px;
	padding-left: 12px;
	padding-bottom: 50px;
	display: grid;
	grid-template-columns: 1.05fr 1fr;
	gap: clamp(24px, 4vw, 56px);
	align-items: start;
	padding-top: 50px;
}
.form-hero-title{
	margin: 0 0 18px 0;
	color: #1D70B7;
	font-weight: 900;
	letter-spacing: .2px;
	line-height: 1.04;
	font-size: clamp(1.8rem, 6.2vw, 3.3rem);
	text-transform: uppercase;
	padding-top: 0px;
}
.form-hero-text{
  margin: 0;
  max-width: 520px;
  color: var(--text);
  font-size: clamp(.98rem, 1.8vw, 1.05rem);
}
.form-card{
  background: var(--card-bg);
  border-radius: var(--card-br);
  padding: clamp(16px, 3.4vw, 26px);
  box-shadow: inset 0 0 0 1px rgba(0,0,0,.05);
  display: grid;
  gap: 12px;
}
.form-field{ display: grid; }
.form-card input,
.form-card textarea{
  appearance: none;
  border: 2px solid var(--field-bd);
  background: var(--field-bg);
  border-radius: var(--field-br);
  padding: 16px 18px;
  font-size: 16px;
  color: #333;
  outline: none;
  width: 100%;
}
.form-card input::placeholder,
.form-card textarea::placeholder{ color:#8A8A8A; }
.form-card textarea{ min-height: 120px; resize: vertical; }
.form-checkgroup{
  border: none; padding: 0; margin: 2px 0 0;
  display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 10px 18px;
}
.form-checkgroup legend{
  font-weight: 800; color: var(--text); margin: 0 0 6px 0;
}
.check{ display:inline-flex; align-items:center; gap:10px; font-size:15px; color:#596273; }
.check input{
  width:20px; height:20px; border:2px solid #BDBDBD; border-radius:6px;
  appearance:none; background:#fff; display:grid; place-items:center; outline:none;
}
.check input:checked{
  border-color:#1D70B7; background:#1D70B7;
  mask:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="white" d="M9 16.2 4.8 12l1.4-1.4L9 13.4l8.8-8.8L19.2 6z"/></svg>') center/14px 14px no-repeat;
}
.lgpd{ align-items:flex-start; color:#7c8699; line-height:1.35; }
.lgpd input{ margin-top:2px; }
.btn-submit{
  background:#F8B400; color:#fff; font-weight:800; border:0;
  border-radius:16px; padding:18px 22px; font-size:clamp(1rem,2.4vw,1.15rem);
  cursor:pointer; box-shadow:0 10px 22px rgba(0,0,0,.08);
  transition:transform .12s ease, filter .2s ease;
}
.btn-submit:hover{ transform:translateY(-1px); filter:brightness(.98); }
.btn-submit:active{ transform:translateY(0); }
@media (max-width: 980px){
  .form-wrap{ grid-template-columns: 1fr; gap:22px; }
}

/* ===== Footer ===== */
.footer{
	text-align: center;
	padding: 204px 12px 10px;
	background-image: url(imagens/Ativo%2014.jpg);
	background-position: center;
	background-repeat: no-repeat;
	background-position: top;
}
.footer-logo{ width:min(500px, 80vw); margin:0 auto 8px; }
.footer-text{
  font-size: clamp(1.6rem, 6vw, 3rem);
  color:#1D70B7; font-weight:700; margin:0 0 4px;
}
.footer-copy{ color:#29364d; font-size:.96rem; }

/* ===== Motion ===== */
@media (prefers-reduced-motion: reduce){
  *{ animation:none !important; transition:none !important; }
}
.bt1 {
	width: 300px;
	alignment-adjust: central;

}

.bt2 {
	align-items: center;
	margin-top: -180px;

}