
.sm-container{ 
	width:min(1100px, calc(100% - 2rem)); 
	margin-inline:auto }

.sm-h2{ 
	margin:0 0 8px; 
	font-size:clamp(1.6rem, 1.6vw + 1.2rem, 2.2rem) 
}

.sm-gap{ height:16px }

.sm-slot{
	min-height:64px; 
	display:flex; 
	align-items:center; 
	justify-content:center; 
	color:#8a94a6; }

.sm-slot--header{ background:#f6f8fb }

.sm-slot--footer{ 
	background:#0f172a; 
	color:#c7d2fe }



/* ---------- HERO ---------- */

.sm-hero{
  position:relative;
  background:#ffffff;
  padding: clamp(50px, 7vw, 100px) 0;
}

.sm-hero__grid{
  display:grid; gap:28px; align-items:center;
  grid-template-columns: 1.15fr .85fr;
}

.sm-hero__title{ 
	margin:0 0 6px; 
	line-height:1 }

.sm-hero__title-main{ 
	display:block; 
	font-weight:700; 
	font-size:clamp(2rem, 2.2vw + 1.2rem, 3rem); 
	color:#111827 }

.sm-hero__title-sub{ 
	display:block; 
	font-weight:700; 
	font-size:clamp(2rem, 2.2vw + 1.2rem, 3rem); 
	color:#6c4ef7 }

.sm-hero__lead{ 
	margin:10px 0 14px; 
	color:#4b5563; 
	max-width:60ch }

.sm-hero__cta{
	margin-top:8px 
}

.sm-hero__image{
  max-width: 100%;
  height: auto;
  display: block;
}



/* ---------- SEÇÕES GENÉRICAS ---------- */

.sm-section{ 
	padding:56px 0 
}

.sm-section__header{ 
	text-align:center; 
	margin-bottom:18px 
}

.sm-section__desc{ 
	margin:6px auto 0;
	max-width:62ch;
	color:#6b7280 }

.sm-cards{ 
	display:grid;
	gap:16px }

.sm-cards--3{ 
	grid-template-columns: repeat(3, minmax(220px, 1fr)) 
}

.sm-cards--4{ 
	grid-template-columns: repeat(4, minmax(220px, 1fr)) 
}

.sm-card{
  background:#ffffff;
  border:1px solid #e5e7eb;
  border-radius:14px;
  padding:18px;
  box-shadow: 0 12px 28px rgba(2,6,23,.06);
}

.sm-card__title{ 
	margin:0 0 4px; 
	font-size:1.05rem; 
	color:#111827 }

.sm-card__text{ 
	margin:0; 
	color:#4b5563 }

.sm-why{ 
	background:#f7f9fc 
}


/* ---------- SPLIT (imagem + texto) ---------- */

.sm-split__grid{
  display:grid; 
	gap:22px; 
	align-items:center;
  grid-template-columns: .9fr 1.1fr;
}

.sm-split--reverse .sm-split__grid{ 
	grid-template-columns: 1.1fr .9fr 
}

.sm-split__content p{ color:#4b5563; 
	margin:0 0 10px; 
	max-width:62ch 
}

.sm-list{ 
	padding-left:1.1rem; 
	margin:8px 0 0; 
	color:#4b5563 }

.sm-list li{ 
	margin:6px 0 
}

.sm-split__image {
  max-width: 90%;
  height: auto;
  border-radius: 12px; /* opcional para seguir o estilo arredondado */
  display: block;
}



/* ---------- PROCESS STRIP ---------- */

.sm-process{
  background:linear-gradient(180deg, #111827 0%, #0b1220 100%);
  color:#e5e7eb;
  padding:28px 0;
}

.sm-process__steps{
  display:flex; 
	flex-wrap:wrap; 
	gap:14px; 
	list-style:none; 
	margin:0; 
	padding:0; 
	justify-content:center
}

.sm-process__steps li{
  display:flex; 
	align-items:center; 
	gap:8px;
  padding:10px 14px; 
	border:1px dashed rgba(255,255,255,.18);
  border-radius:999px; 
	background:rgba(255,255,255,.03)
}

.sm-process__steps span{
  display:inline-grid; 
	place-items:center;
  width:22px; 
	height:22px; 
	border-radius:999px;
  background:#6c4ef7; 
	color:#fff; 
	font-size:.85rem; 
	font-weight:700
}



/* ---------- CTA ---------- */

.sm-cta{
  padding:56px 0; 
	text-align:center; 
	background:#fafbff; 
	border-top:1px solid #eef1f6
}

.sm-cta__wrap p{ 
	margin:6px auto 16px; 
	max-width:60ch; 
	color:#4b5563 }

@media (max-width: 1024px){
  .sm-cards--4{ grid-template-columns: repeat(2, minmax(220px,1fr)) }
}

@media (max-width: 920px){
  .sm-hero__grid{ grid-template-columns: 1fr }
  .sm-split__grid{ grid-template-columns: 1fr }
  .sm-cards--3{ grid-template-columns: 1fr }
}
