
:root{
  --blue-50:#E7F4FF; --blue-100:#CFEAFF; --blue-200:#A5D7FF; --blue-300:#7EC3F3;
  --blue-400:#5BB4EA; --blue-500:#2D8CD3; --blue-600:#1E6FAF; --blue-700:#155789;
  --blue-800:#0F456C; --blue-900:#0A3D62;
  --white:#FFFFFF; --black:#0B1118; --muted:#5a6a7c;
  --radius:18px; --shadow:0 10px 30px rgba(10,61,98,.15);
  --space-2:.5rem; --space-3:.75rem; --space-4:1rem; --space-6:1.5rem; --space-8:2rem;
  --z-topbar:50; --z-sticky:40; --z-fab:60;
}

*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  font-family: Inter, system-ui, -apple-system, "Segoe UI", Roboto, "Open Sans", sans-serif;
  color:var(--black); background:linear-gradient(180deg,var(--blue-50),#fff);
}
h1,h2,h3{font-family:Poppins, Inter, system-ui, sans-serif}

.container{width:min(1160px, 92%); margin:0 auto}
.row{display:flex; gap:16px}
.between{justify-content:space-between}
.center{align-items:center}
.start{align-items:flex-start}
.hide-mobile{display:block}
.show-mobile{display:none}
.muted{color:var(--muted)}
.pad{padding: clamp(var(--space-6), 7vw, 72px) 0}

/* Skip link & focus */
.skip-link{
  position:absolute; left:-9999px; top:auto; width:1px; height:1px; overflow:hidden;
}
.skip-link:focus{
  left:16px; top:16px; width:auto; height:auto; padding:8px 12px; background:#fff; z-index:1000;
  border-radius:12px; box-shadow: var(--shadow);
}
:focus-visible{ outline: 3px solid rgba(45,140,211,.55); outline-offset: 2px; border-radius: 10px; }

.topbar{
  position:sticky; top:0; z-index:var(--z-topbar); background:rgba(255,255,255,.9);
  backdrop-filter:saturate(1.2) blur(8px); border-bottom:1px solid #eaf1f7;
}
.topbar .brand{gap:12px; text-decoration:none; color:var(--black); font-weight:700}
.topbar .brand small{font-weight:500; color:var(--muted)}
.topbar .nav a{margin:0 10px; text-decoration:none; color:var(--black)}
.topbar .btn{margin-left:12px}

.menu-btn{width:44px;height:44px;border:none;background:transparent;display:flex;flex-direction:column;justify-content:center;gap:5px}
.menu-btn span{display:block;height:2px;background:var(--blue-900);border-radius:2px}

.mobile-drawer{display:block; max-height:0; overflow:hidden; transition:max-height .25s ease; border-bottom:1px solid #eaf1f7; background:#fff}
.mobile-drawer a{display:block; padding:12px 16px; text-decoration:none; color:var(--black)}
.mobile-drawer.is-open{ max-height: 320px; }

.hero{
  position:relative; color:var(--white); background:var(--blue-900);
  padding:112px 0 40px; overflow:hidden;
}
.hero::after{
  content:""; position:absolute; inset:0; pointer-events:none;
  background:
    radial-gradient(120% 80px at 50% -30px, rgba(91,180,234,.8), transparent 70%),
    linear-gradient(180deg, rgba(14,35,54,.12) 0%, rgba(10,26,42,.35) 60%, rgba(10,26,42,.55) 100%);
}
.hero-grid{ display:grid; grid-template-columns: minmax(0,1.1fr) minmax(0,.9fr); gap:clamp(16px, 3.6vw, 32px); position:relative; z-index:1; }
.hero-copy h1{font-size:clamp(28px, 4vw, 56px); line-height:1.1; margin:0 0 10px}
.grad{background:linear-gradient(90deg, var(--blue-200), var(--blue-50)); -webkit-background-clip:text; background-clip:text; color:transparent}
.hero-copy p{opacity:.92; font-size:1.05rem}

.lead-form{margin:18px 0 8px; background:rgba(255,255,255,.08); padding:12px; border-radius:var(--radius); backdrop-filter: blur(6px)}
.lead-form .form-row{display:grid; grid-template-columns:1fr 1fr; gap:10px}
.lead-form input, .lead-form select{
  width:100%; padding:12px 14px; border-radius:12px; border:1px solid rgba(255,255,255,.3);
  background:rgba(255,255,255,.15); color:#fff; outline:none;
}
.lead-form input::placeholder{color:#e6efff}
.form-hint{display:block; color:#dfeaff; margin-top:6px; font-size:.85rem}
.sr-only{ position:absolute !important; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }

.hero-art{margin:0; border-radius:var(--radius); overflow:hidden; box-shadow:var(--shadow)}
.hero-art img{width:100%; height:auto; display:block; object-fit:cover; aspect-ratio: 16/10}
.hero figcaption{font-size:.8rem; opacity:.8; padding:6px 8px; background:rgba(255,255,255,.1)}

.hero-wave{ position:absolute; left:0; right:0; bottom:-1px; height:80px; }

.difs{padding:36px 0}
.cards-4{display:grid; grid-template-columns:repeat(4,1fr); gap:16px}
.cards-3{display:grid; grid-template-columns:repeat(3,1fr); gap:16px}
.cards-snap{ /* becomes snap on small screens via media query */ }

.card{
  background:#fff; border-radius:var(--radius); box-shadow:var(--shadow); overflow:hidden;
  border:1px solid #eaf1f7; transition: transform .18s ease, box-shadow .18s ease;
}
.card:hover{transform:translateY(-2px); box-shadow:0 12px 36px rgba(10,61,98,.18)}
.card img{width:100%; height:auto; display:block; object-fit:cover}
.card.tall img{aspect-ratio: 4/3}
.card .card-body{padding:16px}

/* NOVO estilo de ícone: apenas o SVG, em azul escuro */
.ic{ display:inline-flex; width:44px; height:44px; color: var(--blue-900); margin:12px 12px 0 12px; }
.ic svg{ width:44px; height:44px; fill: currentColor; stroke: currentColor; stroke-width:1; }

.sec-head h2{margin:0 0 8px; font-size:clamp(24px, 2.5vw, 36px)}
.sec-head p{margin:0; color:var(--muted)}
.cta-center{display:flex; justify-content:center; margin-top:18px}

.benef .benef-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:16px; }
.benef-item{ background:#fff; border:1px solid #eaf1f7; border-radius:var(--radius); padding:18px; box-shadow:var(--shadow) }
.benef-item strong{display:block; margin-bottom:6px}

.steps-list{list-style:none; padding:0; margin:0; display:grid; grid-template-columns:repeat(3,1fr); gap:16px}
.steps-list li{ background:#fff; border-radius:var(--radius); padding:16px; border:1px solid #eaf1f7; box-shadow:var(--shadow); }
.steps-list li span{
  display:inline-grid; place-items:center; width:28px; height:28px; border-radius:999px; background:var(--blue-600); color:#fff; font-weight:700; margin-right:8px
}

.faq details{background:#fff; border:1px solid #eaf1f7; border-radius:12px; padding:14px 16px; margin:10px 0; box-shadow:var(--shadow)}
.faq summary{cursor:pointer; font-weight:600}
.faq p{color:#33495f}

.footer{padding:36px 0; background:#f7fbff; border-top:1px solid #eaf1f7}
.footer .brand{gap:12px; text-decoration:none; color:var(--black); font-weight:700}

.btn{display:inline-flex; align-items:center; justify-content:center; gap:8px; padding:12px 18px; border-radius:999px; text-decoration:none; font-weight:700; border:1px solid transparent; cursor:pointer; transition: filter .18s ease, transform .18s ease}
.btn-primary{background:linear-gradient(90deg,var(--blue-500),var(--blue-700)); color:#fff}
.btn-primary:hover{filter:brightness(1.05)}
.btn-outline{border-color:var(--blue-800); color:var(--blue-900); background:#fff}
.btn-outline:hover{background:var(--blue-100)}

.sticky-cta{
  position:sticky; bottom:0; z-index:var(--z-sticky); background:rgba(255,255,255,.96);
  border-top:1px solid #eaf1f7; padding:10px 0; transform: translateY(100%); transition: transform .2s ease;
}
.sticky-cta.show{ transform: translateY(0); }

.fab{
  position:fixed; right:18px; bottom:18px; width:56px; height:56px; border-radius:999px;
  display:grid; place-items:center; text-decoration:none; font-size:24px;
  background:linear-gradient(90deg,var(--blue-500),var(--blue-700)); color:#fff; box-shadow:var(--shadow);
  z-index:var(--z-fab);
}

/* Responsive */
@media (max-width: 1200px){
  .hero-grid{ grid-template-columns: 1.2fr .8fr; }
}
@media (max-width: 960px){
  .hero-grid{grid-template-columns:1fr}
  .hide-mobile{display:none}
  .show-mobile{display:block}
  .cards-4{grid-template-columns:repeat(2,1fr)}
  .cards-3{grid-template-columns:1fr}
  .benef .benef-grid{grid-template-columns:repeat(2,1fr)}
  .steps-list{grid-template-columns:1fr}
  .lead-form .form-row{grid-template-columns:1fr}
  /* enable snap carousels */
  .cards-snap{ display:flex; gap:12px; overflow-x:auto; scroll-snap-type:x mandatory; padding-bottom:8px; }
  .cards-snap .card{ min-width: 82%; scroll-snap-align: start; }
}
@media (prefers-reduced-motion: reduce){
  *{ transition:none !important; animation:none !important }
}
