/**
 * Solution Page Builder — frontend styles
 *
 * Extraído de Pagina Solucao.html (PR-02). Escopo aplicado em .sol-root.
 * Cor da marca: --rs-red (#d8303f). Não alterar sem alinhamento.
 *
 * @package RS_Gestao
 */


:root{
  --rs-font:'Nunito Sans',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  --rs-red:#d8303f;
  --rs-red-dark:#b52632;
  --rs-red-light:rgba(216,48,63,.08);
  --rs-red-glow:rgba(216,48,63,.18);
  --rs-white:#ffffff;
  --rs-black:#0d0d0d;
  --rs-gray-50:#fafafa;
  --rs-gray-100:#f5f5f7;
  --rs-gray-200:#e8e8ed;
  --rs-gray-300:#d1d1d6;
  --rs-gray-400:#aeaeb2;
  --rs-gray-500:#8e8e93;
  --rs-gray-600:#636366;
  --rs-gray-700:#48484a;
  --rs-gray-800:#2c2c2e;
  --text-main:#17171c;
  --text-body:#333333;
  --text-secondary:#6e6e78;
  --text-tertiary:#7a7a7a;
  --bg-alt:#f7f7fa;
  --rs-radius-xs:6px;
  --rs-radius-sm:10px;
  --rs-radius:16px;
  --rs-radius-lg:24px;
  --rs-shadow-sm:0 1px 3px rgba(0,0,0,.04),0 1px 2px rgba(0,0,0,.06);
  --rs-shadow:0 4px 16px rgba(0,0,0,.06),0 1px 4px rgba(0,0,0,.04);
  --rs-shadow-lg:0 12px 40px rgba(0,0,0,.08),0 4px 12px rgba(0,0,0,.04);
  --rs-shadow-xl:0 20px 60px rgba(0,0,0,.10),0 8px 20px rgba(0,0,0,.06);
  --rs-transition-fast:.2s cubic-bezier(.25,.8,.25,1);
  --rs-transition:.3s cubic-bezier(.25,.8,.25,1);
  --rs-transition-slow:.5s cubic-bezier(.25,.8,.25,1);
  --container:1280px;
}
.sol-root, .sol-root *, .sol-root *::before, .sol-root *::after{box-sizing:border-box !important;margin:0 !important;padding:0 !important}
.sol-root{
  font-family:var(--rs-font) !important;
  color:var(--text-body) !important;
  background:#fff !important;
  line-height:1.5 !important;
  -webkit-font-smoothing:antialiased !important;
  -moz-osx-font-smoothing:grayscale !important}
.sol-root img{max-width:100% !important;display:block !important}
.sol-root button{font-family:inherit !important;cursor:pointer !important;border:none !important;background:none !important}
.sol-root a{color:inherit !important;text-decoration:none !important}

.sol-root .container{max-width:var(--container) !important;margin:0 auto !important;padding:0 24px !important}

.sol-root /* ============ BREADCRUMB ============ */
.breadcrumb{
  padding:28px 0 12px !important;
  font-size:13px !important;
  color:var(--text-secondary) !important;
  font-weight:300 !important;
  letter-spacing:.2px !important}
.sol-root .breadcrumb a{color:var(--text-secondary) !important;transition:color var(--rs-transition-fast) !important}
.sol-root .breadcrumb a:hover{color:var(--rs-red) !important}
.sol-root .breadcrumb .sep{margin:0 10px !important;opacity:.5 !important}
.sol-root .breadcrumb .current{color:var(--text-main) !important;font-weight:400 !important}

.sol-root /* ============ HERO ============ */
.hero{
  position:relative !important;
  padding:20px 0 80px !important;
  background:
    radial-gradient(60% 50% at 10% 0%, rgba(216,48,63,.035), transparent 70%),
    linear-gradient(180deg, #fff 0%, var(--bg-alt) 100%) !important;
  overflow:hidden !important}
.sol-root .hero::before{
  content:"" !important;
  position:absolute !important;
  inset:0 !important;
  background-image:
    linear-gradient(rgba(23,23,28,.025) 1px, transparent 1px),
    linear-gradient(90deg, rgba(23,23,28,.025) 1px, transparent 1px) !important;
  background-size:48px 48px !important;
  mask-image:radial-gradient(ellipse 80% 60% at 50% 40%, #000, transparent 80%) !important;
  pointer-events:none !important}
.sol-root .hero-grid{
  display:grid !important;
  grid-template-columns:1.05fr 1fr !important;
  gap:48px !important;
  align-items:start !important;
  position:relative !important;
  z-index:1 !important}

.sol-root /* Gallery */
.gallery{
  background:#fff !important;
  border-radius:var(--rs-radius-lg) !important;
  padding:24px !important;
  box-shadow:var(--rs-shadow-lg) !important;
  border:1px solid var(--rs-gray-200) !important}
.sol-root .gallery__main{
  position:relative !important;
  aspect-ratio:1/1 !important;
  background:linear-gradient(135deg, var(--rs-gray-100) 0%, var(--rs-gray-200) 100%) !important;
  border-radius:var(--rs-radius) !important;
  overflow:hidden !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important}
.sol-root .gallery__main::before{
  content:"" !important;
  position:absolute !important;
  inset:0 !important;
  background-image:
    repeating-linear-gradient(45deg, rgba(0,0,0,.02) 0 2px, transparent 2px 16px) !important;
  pointer-events:none !important}
.sol-root .gallery__img{
  width:100% !important;
  height:100% !important;
  object-fit:contain !important;
  transition:transform var(--rs-transition-slow) !important;
  padding:40px !important}
.sol-root .gallery__main:hover .gallery__img{transform:scale(1.04) !important}

.sol-root .gallery__badge{
  position:absolute !important;
  top:16px !important;
  left:16px !important;
  background:var(--rs-red) !important;
  color:#fff !important;
  font-size:11px !important;
  font-weight:700 !important;
  letter-spacing:.8px !important;
  text-transform:uppercase !important;
  padding:8px 14px !important;
  border-radius:100px !important;
  z-index:2 !important;
  display:inline-flex !important;
  align-items:center !important;
  gap:6px !important}
.sol-root .gallery__badge i{font-size:9px !important}

.sol-root .gallery__zoom{
  position:absolute !important;
  bottom:16px !important;
  right:16px !important;
  width:44px !important;
  height:44px !important;
  border-radius:50% !important;
  background:#fff !important;
  box-shadow:var(--rs-shadow) !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  color:var(--text-main) !important;
  cursor:pointer !important;
  transition:all var(--rs-transition-fast) !important;
  z-index:2 !important}
.sol-root .gallery__zoom:hover{background:var(--rs-red) !important;color:#fff !important;transform:scale(1.08) !important}

.sol-root .gallery__thumbs{
  display:grid !important;
  grid-template-columns:repeat(5,1fr) !important;
  gap:10px !important;
  margin-top:16px !important}
.sol-root .gallery__thumb{
  aspect-ratio:1/1 !important;
  background:linear-gradient(135deg,var(--rs-gray-100),var(--rs-gray-200)) !important;
  border-radius:12px !important;
  overflow:hidden !important;
  cursor:pointer !important;
  border:2px solid transparent !important;
  transition:all var(--rs-transition-fast) !important;
  position:relative !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important}
.sol-root .gallery__thumb::before{
  content:"" !important;
  position:absolute !important;inset:0 !important;
  background-image:repeating-linear-gradient(45deg,rgba(0,0,0,.02) 0 2px,transparent 2px 12px) !important}
.sol-root .gallery__thumb img{width:80% !important;height:80% !important;object-fit:contain !important}
.sol-root .gallery__thumb.is-active{border-color:var(--rs-red) !important;box-shadow:0 0 0 3px var(--rs-red-light) !important}
.sol-root .gallery__thumb:hover{transform:translateY(-2px) !important}

.sol-root /* Hero Info */
.hero-info{
  padding:8px 4px 0 !important}
.sol-root .hero-eyebrow{
  display:inline-flex !important;
  align-items:center !important;
  gap:8px !important;
  background:var(--rs-red-light) !important;
  color:var(--rs-red) !important;
  padding:8px 14px !important;
  border-radius:100px !important;
  font-size:12px !important;
  font-weight:700 !important;
  letter-spacing:.8px !important;
  text-transform:uppercase !important;
  margin-bottom:20px !important}
.sol-root .hero-eyebrow i{font-size:10px !important}
.sol-root .hero-title{
  font-size:44px !important;
  font-weight:700 !important;
  line-height:1.1 !important;
  letter-spacing:-0.8px !important;
  color:var(--text-main) !important;
  margin-bottom:18px !important}
.sol-root .hero-title span{color:var(--rs-red) !important}
.sol-root .hero-subtitle{
  font-size:16px !important;
  font-weight:400 !important;
  line-height:1.65 !important;
  color:var(--text-secondary) !important;
  margin-bottom:28px !important;
  max-width:520px !important}

.sol-root .hero-meta{
  display:flex !important;
  flex-wrap:wrap !important;
  gap:10px !important;
  margin-bottom:32px !important}
.sol-root .meta-chip{
  display:inline-flex !important;
  align-items:center !important;
  gap:8px !important;
  background:#fff !important;
  border:1px solid var(--rs-gray-200) !important;
  padding:10px 14px !important;
  border-radius:14px !important;
  font-size:13px !important;
  font-weight:500 !important;
  color:var(--text-main) !important;
  box-shadow:var(--rs-shadow-sm) !important}
.sol-root .meta-chip i{color:var(--rs-red) !important;font-size:12px !important}

.sol-root .hero-actions{
  display:flex !important;
  flex-wrap:wrap !important;
  gap:12px !important;
  margin-bottom:32px !important}
.sol-root .btn{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:10px !important;
  font-family:var(--rs-font) !important;
  font-size:15px !important;
  font-weight:500 !important;
  padding:0 26px !important;
  height:54px !important;
  border-radius:100px !important;
  cursor:pointer !important;
  transition:all var(--rs-transition) !important;
  white-space:nowrap !important}
.sol-root .btn-primary{
  background:var(--rs-red) !important;
  color:#fff !important;
  border:1px solid var(--rs-red) !important;
  box-shadow:0 6px 18px rgba(216,48,63,.22) !important}
.sol-root .btn-primary:hover{
  background:var(--rs-red-dark) !important;
  border-color:var(--rs-red-dark) !important;
  transform:translateY(-2px) !important;
  box-shadow:0 10px 26px rgba(216,48,63,.32) !important}
.sol-root .btn-secondary{
  background:#fff !important;
  color:var(--text-main) !important;
  border:1px solid var(--rs-gray-300) !important}
.sol-root .btn-secondary:hover{
  border-color:var(--text-main) !important;
  transform:translateY(-2px) !important}
.sol-root .btn-ghost{
  background:transparent !important;
  color:var(--text-main) !important;
  border:1px solid transparent !important;
  padding:0 8px !important}
.sol-root .btn-ghost:hover{color:var(--rs-red) !important}

.sol-root .hero-assur{
  display:grid !important;
  grid-template-columns:repeat(3,1fr) !important;
  gap:0 !important;
  padding-top:24px !important;
  border-top:1px solid var(--rs-gray-200) !important}
.sol-root .assur{
  display:flex !important;
  flex-direction:column !important;
  gap:4px !important;
  padding-right:16px !important}
.sol-root .assur-ico{
  width:36px !important;height:36px !important;
  background:var(--rs-red-light) !important;
  border-radius:10px !important;
  display:flex !important;align-items:center !important;justify-content:center !important;
  color:var(--rs-red) !important;
  margin-bottom:6px !important;
  font-size:14px !important}
.sol-root .assur-title{font-size:13px !important;font-weight:700 !important;color:var(--text-main) !important}
.sol-root .assur-sub{font-size:12px !important;color:var(--text-secondary) !important;font-weight:300 !important}

.sol-root /* ============ SECTION PRIMITIVES ============ */
section{padding:100px 0 !important}
.sol-root .sec-head{
  text-align:center !important;
  max-width:760px !important;
  margin:0 auto 56px !important}
.sol-root .sec-eyebrow{
  display:inline-block !important;
  color:var(--rs-red) !important;
  font-size:12px !important;
  font-weight:700 !important;
  letter-spacing:2px !important;
  text-transform:uppercase !important;
  margin-bottom:14px !important;
  position:relative !important;
  padding-left:40px !important}
.sol-root .sec-eyebrow::before{
  content:"" !important;
  position:absolute !important;
  left:0 !important;top:50% !important;
  width:28px !important;height:2px !important;
  background:var(--rs-red) !important;
  transform:translateY(-50%) !important}
.sol-root .sec-title{
  font-size:42px !important;
  font-weight:700 !important;
  line-height:1.1 !important;
  letter-spacing:-0.6px !important;
  color:var(--text-main) !important;
  margin-bottom:16px !important}
.sol-root .sec-title em{font-style:normal !important;color:var(--rs-red) !important}
.sol-root .sec-sub{
  font-size:16px !important;
  line-height:1.65 !important;
  color:var(--text-secondary) !important;
  font-weight:400 !important}

.sol-root /* ============ SOBRE / SAIBA MAIS ============ */
.sobre{background:#fff !important}
.sol-root .sobre-grid{
  display:grid !important;
  grid-template-columns:1fr 1.2fr !important;
  gap:80px !important;
  align-items:start !important}
.sol-root .sobre-visual{
  position:sticky !important;
  top:40px !important;
  aspect-ratio:4/5 !important;
  border-radius:var(--rs-radius-lg) !important;
  background:linear-gradient(135deg,var(--rs-gray-100),var(--rs-gray-200)) !important;
  overflow:hidden !important;
  position:relative !important;
  box-shadow:var(--rs-shadow-lg) !important}
.sol-root .sobre-visual::before{
  content:"" !important;position:absolute !important;inset:0 !important;
  background-image:repeating-linear-gradient(45deg,rgba(0,0,0,.03) 0 2px,transparent 2px 14px) !important}
.sol-root .sobre-visual::after{
  content:"[ foto de fábrica / solução instalada ]" !important;
  position:absolute !important;
  inset:0 !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  font-family:ui-monospace,'SF Mono',Menaco,Consolas,monospace !important;
  font-size:12px !important;
  color:var(--text-tertiary) !important;
  letter-spacing:.5px !important}
/* Com imagem setada (.has-media), remove o placeholder e a textura pra mostrar a foto limpa. */
.sol-root .sobre-visual.has-media::before,
.sol-root .sobre-visual.has-media::after{content:none !important}
.sol-root .sobre-visual .tag{
  position:absolute !important;
  left:20px !important;bottom:20px !important;
  background:var(--rs-red) !important;
  color:#fff !important;
  padding:10px 16px !important;
  border-radius:100px !important;
  font-size:12px !important;
  font-weight:700 !important;
  letter-spacing:.8px !important;
  text-transform:uppercase !important;
  box-shadow:var(--rs-shadow) !important;
  z-index:1 !important}
.sol-root .sobre-content .sec-eyebrow{padding-left:0 !important}
.sol-root .sobre-content .sec-eyebrow::before{display:none !important}
.sol-root .sobre-content h2{
  font-size:40px !important;
  font-weight:700 !important;
  line-height:1.12 !important;
  letter-spacing:-0.5px !important;
  color:var(--text-main) !important;
  margin:12px 0 22px !important}
.sol-root .sobre-content h2 em{font-style:normal !important;color:var(--rs-red) !important}
.sol-root .sobre-content p{
  font-size:16px !important;
  line-height:1.7 !important;
  color:var(--text-body) !important;
  margin-bottom:18px !important}
.sol-root .sobre-highlights{
  margin-top:32px !important;
  display:grid !important;
  gap:14px !important}
.sol-root .hl{
  display:flex !important;
  align-items:flex-start !important;
  gap:14px !important;
  padding:16px 18px !important;
  background:var(--bg-alt) !important;
  border-radius:14px !important;
  border-left:3px solid var(--rs-red) !important}
.sol-root .hl-ico{
  width:40px !important;height:40px !important;
  flex-shrink:0 !important;
  background:#fff !important;
  border-radius:10px !important;
  display:flex !important;align-items:center !important;justify-content:center !important;
  color:var(--rs-red) !important;
  box-shadow:var(--rs-shadow-sm) !important}
.sol-root .hl-txt strong{display:block !important;color:var(--text-main) !important;font-size:15px !important;font-weight:700 !important;margin-bottom:2px !important}
.sol-root .hl-txt span{font-size:14px !important;color:var(--text-secondary) !important;line-height:1.5 !important}

.sol-root /* ============ SPECS ============ */
.specs{background:var(--bg-alt) !important;position:relative !important}
.sol-root .specs-wrap{
  display:grid !important;
  grid-template-columns:1fr 1fr !important;
  gap:56px !important;
  align-items:center !important}
.sol-root .specs-left .sec-eyebrow{padding-left:0 !important}
.sol-root .specs-left .sec-eyebrow::before{display:none !important}
.sol-root .specs-left h2{
  font-size:40px !important;
  font-weight:700 !important;
  line-height:1.12 !important;
  letter-spacing:-0.5px !important;
  color:var(--text-main) !important;
  margin:12px 0 18px !important}
.sol-root .specs-left p{font-size:16px !important;line-height:1.65 !important;color:var(--text-secondary) !important;margin-bottom:20px !important;max-width:440px !important}
.sol-root .specs-table{
  background:#fff !important;
  border-radius:var(--rs-radius-lg) !important;
  padding:8px !important;
  box-shadow:var(--rs-shadow-lg) !important;
  border:1px solid var(--rs-gray-200) !important}
.sol-root .spec-row{
  display:grid !important;
  grid-template-columns:1fr auto !important;
  gap:16px !important;
  padding:18px 22px !important;
  align-items:center !important;
  border-radius:12px !important;
  transition:background var(--rs-transition-fast) !important}
.sol-root .spec-row:not(:last-child){border-bottom:1px solid var(--rs-gray-200) !important}
.sol-root .spec-row:hover{background:var(--bg-alt) !important}
.sol-root .spec-label{
  display:flex !important;align-items:center !important;gap:12px !important;
  font-size:14px !important;
  font-weight:500 !important;
  color:var(--text-main) !important}
.sol-root .spec-label i{
  color:var(--rs-red) !important;
  font-size:14px !important;
  width:24px !important;text-align:center !important}
.sol-root .spec-value{
  font-size:14px !important;
  font-weight:700 !important;
  color:var(--text-main) !important;
  font-variant-numeric:tabular-nums !important}
.sol-root .spec-value small{font-weight:400 !important;color:var(--text-secondary) !important;margin-left:4px !important}

.sol-root /* ============ COMO FUNCIONA (process) ============ */
.process{background:#fff !important}
.sol-root .steps{
  display:grid !important;
  grid-template-columns:repeat(4,1fr) !important;
  gap:24px !important;
  position:relative !important}
.sol-root .steps::before{
  content:"" !important;
  position:absolute !important;
  top:36px !important;
  left:10% !important;right:10% !important;
  height:2px !important;
  background:repeating-linear-gradient(90deg,var(--rs-gray-300) 0 6px,transparent 6px 12px) !important;
  z-index:0 !important}
.sol-root .step{
  position:relative !important;
  z-index:1 !important;
  padding:0 8px !important}
.sol-root .step-num{
  width:72px !important;height:72px !important;
  background:#fff !important;
  border:2px solid var(--rs-gray-200) !important;
  border-radius:50% !important;
  display:flex !important;align-items:center !important;justify-content:center !important;
  font-size:22px !important;
  font-weight:900 !important;
  color:var(--text-main) !important;
  margin-bottom:20px !important;
  position:relative !important;
  transition:all var(--rs-transition) !important}
.sol-root .step-num::after{
  content:"" !important;
  position:absolute !important;
  inset:-6px !important;
  border-radius:50% !important;
  border:1px dashed var(--rs-gray-300) !important;
  opacity:0 !important;
  transition:opacity var(--rs-transition) !important}
.sol-root .step:hover .step-num{
  background:var(--rs-red) !important;
  border-color:var(--rs-red) !important;
  color:#fff !important;
  box-shadow:0 10px 24px rgba(216,48,63,.22) !important}
.sol-root .step:hover .step-num::after{opacity:1 !important;border-color:var(--rs-red) !important}
.sol-root .step-tag{
  display:inline-block !important;
  font-size:11px !important;
  font-weight:700 !important;
  color:var(--rs-red) !important;
  text-transform:uppercase !important;
  letter-spacing:1.2px !important;
  margin-bottom:8px !important}
.sol-root .step-title{
  font-size:18px !important;
  font-weight:700 !important;
  color:var(--text-main) !important;
  margin-bottom:8px !important;
  line-height:1.25 !important}
.sol-root .step-desc{
  font-size:14px !important;
  line-height:1.6 !important;
  color:var(--text-secondary) !important}

.sol-root /* ============ BENEFÍCIOS ============ */
.benefits{background:var(--bg-alt) !important}
.sol-root .bgrid{
  display:grid !important;
  grid-template-columns:repeat(3,1fr) !important;
  gap:20px !important}
.sol-root .bcard{
  background:#fff !important;
  border-radius:var(--rs-radius-lg) !important;
  padding:32px 28px !important;
  border:1px solid var(--rs-gray-200) !important;
  transition:all var(--rs-transition) !important;
  position:relative !important;
  overflow:hidden !important}
.sol-root .bcard::before{
  content:"" !important;
  position:absolute !important;
  left:0 !important;top:0 !important;
  width:100% !important;height:3px !important;
  background:linear-gradient(90deg,var(--rs-red),var(--rs-red) 30%,transparent 30%) !important;
  transform:translateX(-100%) !important;
  transition:transform var(--rs-transition-slow) !important}
.sol-root .bcard:hover{
  transform:translateY(-6px) !important;
  box-shadow:var(--rs-shadow-xl) !important;
  border-color:transparent !important}
.sol-root .bcard:hover::before{transform:translateX(0) !important}
.sol-root .bcard-ico{
  width:56px !important;height:56px !important;
  background:var(--rs-red-light) !important;
  border-radius:14px !important;
  display:flex !important;align-items:center !important;justify-content:center !important;
  color:var(--rs-red) !important;
  font-size:22px !important;
  margin-bottom:20px !important;
  transition:all var(--rs-transition) !important}
.sol-root .bcard:hover .bcard-ico{
  background:var(--rs-red) !important;
  color:#fff !important;
  transform:rotate(-5deg) scale(1.06) !important}
.sol-root .bcard h3{
  font-size:20px !important;
  font-weight:700 !important;
  color:var(--text-main) !important;
  margin-bottom:10px !important;
  letter-spacing:-0.2px !important}
.sol-root .bcard p{
  font-size:14px !important;
  line-height:1.6 !important;
  color:var(--text-secondary) !important}
.sol-root .bcard-stat{
  margin-top:20px !important;
  padding-top:16px !important;
  border-top:1px solid var(--rs-gray-200) !important;
  display:flex !important;
  align-items:baseline !important;
  gap:8px !important}
.sol-root .bcard-stat strong{
  font-size:28px !important;
  font-weight:900 !important;
  color:var(--rs-red) !important;
  font-variant-numeric:tabular-nums !important;
  letter-spacing:-1px !important}
.sol-root .bcard-stat span{font-size:12px !important;color:var(--text-secondary) !important}

.sol-root /* ============ APLICAÇÕES ============ */
.apps{background:#fff !important}
.sol-root .apps-grid{
  display:grid !important;
  grid-template-columns:repeat(6,1fr) !important;
  gap:16px !important}
.sol-root .app-card{
  grid-column:span 2 !important;
  background:var(--bg-alt) !important;
  border-radius:var(--rs-radius) !important;
  padding:28px 24px !important;
  transition:all var(--rs-transition) !important;
  cursor:pointer !important;
  display:flex !important;
  flex-direction:column !important;
  gap:14px !important;
  min-height:200px !important;
  position:relative !important;
  overflow:hidden !important;
  border:1px solid transparent !important}
.sol-root .app-card:hover{
  background:#fff !important;
  border-color:var(--rs-gray-200) !important;
  box-shadow:var(--rs-shadow-lg) !important;
  transform:translateY(-3px) !important}
.sol-root .app-card.feat{
  grid-column:span 3 !important;
  background:linear-gradient(135deg,#17171c 0%,#2c2c2e 100%) !important;
  color:#fff !important;
  min-height:260px !important}
.sol-root .app-card.feat h4{color:#fff !important}
.sol-root .app-card.feat p{color:rgba(255,255,255,.7) !important}
.sol-root .app-card.feat .app-ico{background:rgba(255,255,255,.1) !important;color:#fff !important}
.sol-root .app-card.feat::after{
  content:"" !important;
  position:absolute !important;
  right:-40px !important;bottom:-40px !important;
  width:200px !important;height:200px !important;
  background:radial-gradient(circle,var(--rs-red-glow) 0%,transparent 70%) !important;
  opacity:.6 !important}
.sol-root .app-card.wide{grid-column:span 3 !important}
.sol-root .app-ico{
  width:48px !important;height:48px !important;
  background:var(--rs-red-light) !important;
  color:var(--rs-red) !important;
  border-radius:12px !important;
  display:flex !important;align-items:center !important;justify-content:center !important;
  font-size:18px !important;
  margin-bottom:4px !important}
.sol-root .app-card h4{
  font-size:18px !important;
  font-weight:700 !important;
  color:var(--text-main) !important;
  letter-spacing:-0.2px !important}
.sol-root .app-card p{
  font-size:14px !important;
  line-height:1.55 !important;
  color:var(--text-secondary) !important;
  margin-top:auto !important}
.sol-root .app-card .arrow{
  align-self:flex-end !important;
  width:32px !important;height:32px !important;
  border-radius:50% !important;
  background:rgba(0,0,0,.04) !important;
  display:flex !important;align-items:center !important;justify-content:center !important;
  color:var(--text-main) !important;
  font-size:12px !important;
  transition:all var(--rs-transition) !important;
  margin-top:10px !important}
.sol-root .app-card:hover .arrow{
  background:var(--rs-red) !important;
  color:#fff !important;
  transform:translate(4px,-4px) !important}
.sol-root .app-card.feat .arrow{background:rgba(255,255,255,.12) !important;color:#fff !important}

.sol-root /* ============ STATS BAR ============ */
.stats-bar{
  background:linear-gradient(135deg,#17171c 0%, #2c2c2e 100%) !important;
  padding:64px 0 !important;
  position:relative !important;
  overflow:hidden !important}
.sol-root .stats-bar::before{
  content:"" !important;
  position:absolute !important;
  inset:0 !important;
  background-image:
    linear-gradient(rgba(255,255,255,.02) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.02) 1px,transparent 1px) !important;
  background-size:48px 48px !important}
.sol-root .stats-bar::after{
  content:"" !important;
  position:absolute !important;
  right:-80px !important;top:50% !important;
  transform:translateY(-50%) !important;
  width:360px !important;height:360px !important;
  background:radial-gradient(circle,var(--rs-red-glow),transparent 70%) !important;
  opacity:.5 !important}
.sol-root .stats-grid{
  display:grid !important;
  grid-template-columns:repeat(4,1fr) !important;
  gap:32px !important;
  position:relative !important;
  z-index:1 !important}
.sol-root .stat{color:#fff !important}
.sol-root .stat-num{
  font-size:54px !important;
  font-weight:900 !important;
  letter-spacing:-2px !important;
  line-height:1 !important;
  color:#fff !important;
  margin-bottom:8px !important;
  display:flex !important;
  align-items:baseline !important;
  gap:4px !important}
.sol-root .stat-num small{
  font-size:24px !important;
  color:var(--rs-red) !important;
  font-weight:700 !important}
.sol-root .stat-label{
  font-size:13px !important;
  color:rgba(255,255,255,.65) !important;
  font-weight:400 !important;
  letter-spacing:.3px !important}

.sol-root /* ============ VÍDEO ============ */
.vid{background:var(--bg-alt) !important}
.sol-root .vid-wrap{
  display:grid !important;
  grid-template-columns:1.5fr 1fr !important;
  gap:48px !important;
  align-items:center !important}
.sol-root .vid-left{
  position:relative !important;
  aspect-ratio:16/9 !important;
  border-radius:var(--rs-radius-lg) !important;
  overflow:hidden !important;
  background:linear-gradient(135deg,#0d0d0d,#2c2c2e) !important;
  box-shadow:var(--rs-shadow-xl) !important;
  cursor:pointer !important;
  transition:transform var(--rs-transition) !important}
.sol-root .vid-left:hover{transform:translateY(-4px) !important}
.sol-root .vid-left::before{
  content:"" !important;position:absolute !important;inset:0 !important;
  background:
    linear-gradient(180deg,transparent 40%, rgba(0,0,0,.6) 100%),
    repeating-linear-gradient(45deg,rgba(255,255,255,.02) 0 2px,transparent 2px 16px) !important}
.sol-root .vid-thumb-txt{
  position:absolute !important;
  inset:0 !important;
  display:flex !important;
  flex-direction:column !important;
  justify-content:flex-end !important;
  padding:32px !important;
  z-index:1 !important;
  color:#fff !important}
.sol-root .vid-thumb-txt .live{
  display:inline-flex !important;
  align-items:center !important;
  gap:8px !important;
  background:var(--rs-red) !important;
  color:#fff !important;
  padding:6px 12px !important;
  border-radius:6px !important;
  font-size:11px !important;
  font-weight:700 !important;
  letter-spacing:1px !important;
  text-transform:uppercase !important;
  align-self:flex-start !important;
  margin-bottom:12px !important}
.sol-root .vid-thumb-txt .live::before{
  content:"" !important;
  width:6px !important;height:6px !important;border-radius:50% !important;
  background:#fff !important;
  animation:sol-pulse 1.5s infinite !important}
@keyframes sol-pulse{0%,100%{opacity:1}50%{opacity:.4}}
.sol-root .vid-thumb-txt h3{
  font-size:26px !important;
  font-weight:700 !important;
  letter-spacing:-0.4px !important;
  max-width:420px !important;
  line-height:1.2 !important}
.sol-root .vid-thumb-txt .date{
  font-size:13px !important;
  color:rgba(255,255,255,.7) !important;
  margin-top:8px !important}
.sol-root .vid-play{
  position:absolute !important;
  top:50% !important;left:50% !important;
  transform:translate(-50%,-50%) !important;
  width:88px !important;height:88px !important;
  background:var(--rs-red) !important;
  border-radius:50% !important;
  display:flex !important;align-items:center !important;justify-content:center !important;
  color:#fff !important;
  font-size:26px !important;
  box-shadow:0 10px 30px rgba(216,48,63,.5) !important;
  z-index:2 !important;
  transition:all var(--rs-transition) !important}
.sol-root .vid-left:hover .vid-play{transform:translate(-50%,-50%) scale(1.1) !important}
.sol-root .vid-play::after{
  content:"" !important;
  position:absolute !important;inset:-8px !important;
  border-radius:50% !important;
  border:2px solid rgba(255,255,255,.3) !important;
  animation:sol-ring 2s infinite !important}
@keyframes sol-ring{0%{transform:scale(1);opacity:1}100%{transform:scale(1.4);opacity:0}}

.sol-root .vid-right .sec-eyebrow{padding-left:0 !important}
.sol-root .vid-right .sec-eyebrow::before{display:none !important}
.sol-root .vid-right h2{
  font-size:34px !important;
  font-weight:700 !important;
  line-height:1.15 !important;
  letter-spacing:-0.4px !important;
  color:var(--text-main) !important;
  margin:12px 0 16px !important}
.sol-root .vid-right p{
  font-size:15px !important;
  line-height:1.65 !important;
  color:var(--text-secondary) !important;
  margin-bottom:20px !important}
.sol-root .vid-people{
  display:flex !important;
  gap:20px !important;
  margin-top:24px !important;
  padding-top:24px !important;
  border-top:1px solid var(--rs-gray-200) !important}
.sol-root .person{display:flex !important;gap:12px !important;align-items:center !important}
.sol-root .person-avatar{
  width:44px !important;height:44px !important;
  border-radius:50% !important;
  background:linear-gradient(135deg,var(--rs-gray-200),var(--rs-gray-300)) !important;
  flex-shrink:0 !important;
  display:flex !important;align-items:center !important;justify-content:center !important;
  font-weight:700 !important;
  font-size:14px !important;
  color:var(--text-main) !important}
.sol-root .person-name{font-size:13px !important;font-weight:700 !important;color:var(--text-main) !important;line-height:1.2 !important}
.sol-root .person-role{font-size:11px !important;color:var(--text-secondary) !important;line-height:1.3 !important}

.sol-root /* ============ RELACIONADOS ============ */
.rel{background:#fff !important}
.sol-root .rel-head{
  display:flex !important;
  align-items:end !important;
  justify-content:space-between !important;
  margin-bottom:40px !important;
  gap:20px !important}
.sol-root .rel-head .sec-eyebrow{padding-left:0 !important}
.sol-root .rel-head .sec-eyebrow::before{display:none !important}
.sol-root .rel-head h2{
  font-size:36px !important;
  font-weight:700 !important;
  letter-spacing:-0.4px !important;
  color:var(--text-main) !important;
  margin-top:8px !important;
  line-height:1.1 !important}
.sol-root .rel-nav{
  display:flex !important;gap:10px !important}
.sol-root .rel-nav button{
  width:46px !important;height:46px !important;
  border-radius:50% !important;
  background:var(--bg-alt) !important;
  color:var(--text-main) !important;
  display:flex !important;align-items:center !important;justify-content:center !important;
  transition:all var(--rs-transition-fast) !important}
.sol-root .rel-nav button:hover{background:var(--rs-red) !important;color:#fff !important;box-shadow:var(--rs-shadow) !important}

.sol-root .rel-grid{
  display:grid !important;
  grid-template-columns:repeat(4,1fr) !important;
  gap:20px !important}
.sol-root .pcard{
  background:#fff !important;
  border:1px solid var(--rs-gray-200) !important;
  border-radius:var(--rs-radius) !important;
  padding:16px !important;
  transition:all var(--rs-transition) !important;
  cursor:pointer !important}
.sol-root .pcard:hover{
  transform:translateY(-4px) !important;
  box-shadow:var(--rs-shadow-lg) !important;
  border-color:transparent !important}
.sol-root .pcard-img{
  aspect-ratio:1/1 !important;
  background:linear-gradient(135deg,var(--rs-gray-100),var(--rs-gray-200)) !important;
  border-radius:12px !important;
  margin-bottom:16px !important;
  position:relative !important;
  overflow:hidden !important;
  display:flex !important;align-items:center !important;justify-content:center !important}
.sol-root .pcard-img::before{
  content:"" !important;position:absolute !important;inset:0 !important;
  background-image:repeating-linear-gradient(45deg,rgba(0,0,0,.02) 0 2px,transparent 2px 12px) !important}
.sol-root .pcard-img img{width:75% !important;height:75% !important;object-fit:contain !important;transition:transform var(--rs-transition-slow) !important}
.sol-root .pcard:hover .pcard-img img{transform:scale(1.08) !important}
.sol-root .pcard-tag{
  position:absolute !important;
  top:10px !important;left:10px !important;
  background:rgba(255,255,255,.95) !important;
  color:var(--text-main) !important;
  font-size:10px !important;
  font-weight:700 !important;
  letter-spacing:.6px !important;
  text-transform:uppercase !important;
  padding:5px 10px !important;
  border-radius:100px !important;
  z-index:1 !important}
.sol-root .pcard h4{
  font-size:16px !important;
  font-weight:700 !important;
  color:var(--text-main) !important;
  margin-bottom:4px !important;
  letter-spacing:-0.2px !important}
.sol-root .pcard p{font-size:13px !important;color:var(--text-secondary) !important;margin-bottom:14px !important;line-height:1.5 !important}
.sol-root .pcard-foot{
  display:flex !important;
  justify-content:space-between !important;
  align-items:center !important;
  padding-top:12px !important;
  border-top:1px solid var(--rs-gray-200) !important}
.sol-root .pcard-foot span{font-size:12px !important;color:var(--text-secondary) !important;font-weight:500 !important}
.sol-root .pcard-foot i{
  width:30px !important;height:30px !important;
  border-radius:50% !important;
  background:var(--rs-red-light) !important;
  color:var(--rs-red) !important;
  display:flex !important;align-items:center !important;justify-content:center !important;
  font-size:11px !important;
  transition:all var(--rs-transition-fast) !important}
.sol-root .pcard:hover .pcard-foot i{background:var(--rs-red) !important;color:#fff !important;transform:translateX(2px) !important}

.sol-root /* ============ FAQ ============ */
.faq{background:var(--bg-alt) !important}
.sol-root .faq-wrap{
  max-width:860px !important;
  margin:0 auto !important}
.sol-root .faq-item{
  background:#fff !important;
  border-radius:var(--rs-radius) !important;
  border:1px solid var(--rs-gray-200) !important;
  margin-bottom:12px !important;
  overflow:hidden !important;
  transition:box-shadow var(--rs-transition-fast) !important}
.sol-root .faq-item[open]{box-shadow:var(--rs-shadow-lg) !important;border-color:transparent !important}
.sol-root .faq-item summary{
  list-style:none !important;
  padding:22px 26px !important;
  cursor:pointer !important;
  display:flex !important;
  justify-content:space-between !important;
  align-items:center !important;
  gap:20px !important;
  font-size:16px !important;
  font-weight:700 !important;
  color:var(--text-main) !important}
.sol-root .faq-item summary::-webkit-details-marker{display:none !important}
.sol-root .faq-icon{
  width:36px !important;height:36px !important;
  border-radius:50% !important;
  background:var(--bg-alt) !important;
  color:var(--rs-red) !important;
  display:flex !important;align-items:center !important;justify-content:center !important;
  font-size:14px !important;
  flex-shrink:0 !important;
  transition:all var(--rs-transition) !important}
.sol-root .faq-item[open] .faq-icon{background:var(--rs-red) !important;color:#fff !important;transform:rotate(45deg) !important}
.sol-root .faq-body{
  padding:0 26px 22px !important;
  font-size:15px !important;
  line-height:1.7 !important;
  color:var(--text-secondary) !important}

.sol-root /* ============ CTA FINAL ============ */
.cta{
  padding:120px 0 !important;
  background:linear-gradient(135deg,#d8303f 0%,#b52632 100%) !important;
  color:#fff !important;
  position:relative !important;
  overflow:hidden !important}
.sol-root .cta::before{
  content:"" !important;
  position:absolute !important;inset:0 !important;
  background-image:
    radial-gradient(circle at 20% 20%,rgba(255,255,255,.1),transparent 40%),
    radial-gradient(circle at 80% 80%,rgba(255,255,255,.08),transparent 40%) !important}
.sol-root .cta::after{
  content:"" !important;
  position:absolute !important;inset:0 !important;
  background-image:
    linear-gradient(rgba(255,255,255,.03) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.03) 1px,transparent 1px) !important;
  background-size:60px 60px !important;
  mask-image:radial-gradient(ellipse 70% 70% at 50% 50%,#000,transparent 80%) !important}
.sol-root .cta-inner{
  position:relative !important;
  z-index:1 !important;
  display:grid !important;
  grid-template-columns:1.3fr 1fr !important;
  gap:60px !important;
  align-items:center !important}
.sol-root .cta h2{
  font-size:48px !important;
  font-weight:700 !important;
  line-height:1.1 !important;
  letter-spacing:-0.8px !important;
  margin-bottom:18px !important}
.sol-root .cta p{
  font-size:17px !important;
  line-height:1.65 !important;
  color:rgba(255,255,255,.85) !important;
  margin-bottom:32px !important;
  max-width:500px !important}
.sol-root .cta-actions{display:flex !important;flex-wrap:wrap !important;gap:12px !important}
.sol-root .cta .btn-primary{
  background:#fff !important;
  color:var(--rs-red) !important;
  border-color:#fff !important;
  box-shadow:0 10px 28px rgba(0,0,0,.2) !important}
.sol-root .cta .btn-primary:hover{background:var(--text-main) !important;color:#fff !important;border-color:var(--text-main) !important}
.sol-root .cta .btn-secondary{
  background:transparent !important;
  color:#fff !important;
  border:1px solid rgba(255,255,255,.4) !important}
.sol-root .cta .btn-secondary:hover{background:rgba(255,255,255,.1) !important;border-color:#fff !important}

.sol-root .cta-form{
  background:rgba(255,255,255,.08) !important;
  backdrop-filter:blur(10px) !important;
  border:1px solid rgba(255,255,255,.15) !important;
  border-radius:var(--rs-radius-lg) !important;
  padding:32px !important}
.sol-root .cta-form h4{
  font-size:18px !important;
  font-weight:700 !important;
  margin-bottom:6px !important;
  color:#fff !important}
.sol-root .cta-form .sub{font-size:13px !important;color:rgba(255,255,255,.7) !important;margin-bottom:22px !important;font-weight:300 !important}
.sol-root .finput{
  width:100% !important;
  padding:14px 18px !important;
  border-radius:14px !important;
  border:1px solid rgba(255,255,255,.2) !important;
  background:rgba(255,255,255,.08) !important;
  color:#fff !important;
  font-family:inherit !important;
  font-size:14px !important;
  margin-bottom:10px !important}
.sol-root .finput::placeholder{color:rgba(255,255,255,.55) !important}
.sol-root .finput:focus{outline:none !important;border-color:#fff !important;background:rgba(255,255,255,.15) !important}
.sol-root .cta-form .btn{
  width:100% !important;
  background:#fff !important;
  color:var(--rs-red) !important;
  margin-top:8px !important;
  font-weight:700 !important}
.sol-root .cta-form .btn:hover{background:var(--text-main) !important;color:#fff !important}

.sol-root /* ============ CHAT WIDGET FIXO (lembrete do original) ============ */
.chat-fab{
  position:fixed !important;
  right:24px !important;bottom:24px !important;
  width:60px !important;height:60px !important;
  border-radius:50% !important;
  background:var(--rs-red) !important;
  color:#fff !important;
  display:flex !important;align-items:center !important;justify-content:center !important;
  box-shadow:0 10px 30px rgba(216,48,63,.4) !important;
  font-size:22px !important;
  z-index:100 !important;
  cursor:pointer !important;
  transition:transform var(--rs-transition) !important}
.sol-root .chat-fab:hover{transform:scale(1.08) !important}
.sol-root .chat-fab::after{
  content:"" !important;
  position:absolute !important;
  top:4px !important;right:4px !important;
  width:12px !important;height:12px !important;
  background:#22c55e !important;
  border-radius:50% !important;
  border:2px solid #fff !important}

.sol-root /* ============ FRASE DESTAQUE ============ */
.frase{
  position:relative !important;
  padding:110px 0 !important;
  background:#0d0d0d !important;
  color:#fff !important;
  overflow:hidden !important}
/* brilho radial sutil da marca (topo/base) */
.sol-root .frase::before{
  content:"" !important;
  position:absolute !important;inset:0 !important;
  background-image:
    radial-gradient(60% 60% at 50% 0%,rgba(216,48,63,.20),transparent 70%),
    radial-gradient(50% 50% at 50% 120%,rgba(216,48,63,.10),transparent 70%) !important;
  pointer-events:none !important}
/* granulado (noise) — SVG feTurbulence inline */
.sol-root .frase::after{
  content:"" !important;
  position:absolute !important;inset:0 !important;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='rsn'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23rsn)'/%3E%3C/svg%3E") !important;
  opacity:.13 !important;
  mix-blend-mode:overlay !important;
  pointer-events:none !important}
.sol-root .frase-inner{
  position:relative !important;
  z-index:1 !important;
  max-width:820px !important;
  margin:0 auto !important;
  text-align:center !important}
.sol-root .frase-eyebrow{
  display:inline-block !important;
  color:var(--rs-red) !important;
  font-size:12px !important;
  font-weight:700 !important;
  letter-spacing:2px !important;
  text-transform:uppercase !important;
  margin-bottom:18px !important}
.sol-root .frase-title{
  font-size:44px !important;
  font-weight:800 !important;
  line-height:1.15 !important;
  letter-spacing:-0.6px !important;
  color:#fff !important}
.sol-root .frase-title em{font-style:normal !important;color:var(--rs-red) !important}
.sol-root .frase-sub{
  font-size:17px !important;
  line-height:1.65 !important;
  color:rgba(255,255,255,.72) !important;
  margin:20px auto 0 !important;
  max-width:640px !important}

.sol-root /* ============ RESPONSIVE ============ */
@media (max-width:1024px){
  .hero-grid, .sobre-grid, .specs-wrap, .vid-wrap, .cta-inner{grid-template-columns:1fr !important;gap:40px}
  .sobre-visual{position:static !important;aspect-ratio:16/10}
  .steps{grid-template-columns:repeat(2,1fr)}
  .steps::before{display:none}
  .bgrid{grid-template-columns:repeat(2,1fr)}
  .apps-grid{grid-template-columns:repeat(2,1fr)}
  .app-card, .app-card.feat, .app-card.wide{grid-column:auto}
  .rel-grid{grid-template-columns:repeat(2,1fr)}
  .stats-grid{grid-template-columns:repeat(2,1fr)}
  .hero-title{font-size:36px}
  .sec-title, .cta h2, .frase-title{font-size:34px}
  section{padding:72px 0} !important
}
@media (max-width:640px){
  .sol-root .hero-assur{grid-template-columns:1fr !important;gap:14px !important}
  .sol-root .bgrid, .sol-root .rel-grid, .sol-root .apps-grid{grid-template-columns:1fr !important}
  .sol-root .stats-grid{grid-template-columns:1fr !important}
  .sol-root .steps{grid-template-columns:1fr !important}
  .sol-root .hero-title{font-size:30px !important}
  .sol-root .sec-title, .sol-root .cta h2, .sol-root .frase-title{font-size:28px !important}
  .sol-root .frase{padding:72px 0 !important}
}

