:root{
  --navy:#082b66;
  --blue:#0c6fe8;
  --blue2:#2c91ff;
  --ink:#0b1730;
  --muted:#64748b;
  --line:#dce7f5;
  --soft:#f4f8fd;
  --white:#fff;
  --radius:24px;
  --shadow:0 24px 70px rgba(8,43,102,.13);
}

*{
  box-sizing:border-box;
}

html{
  scroll-behavior:smooth;
}

body{
  margin:0;
  font-family:Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color:var(--ink);
  background:#fff;
  line-height:1.6;
}

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

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

.container{
  width:min(1160px,calc(100% - 40px));
  margin-inline:auto;
}

.eyebrow{
  display:inline-flex;
  align-items:center;
  gap:10px;
  color:var(--blue);
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.16em;
  font-size:.74rem;
}

.eyebrow:before{
  content:"";
  width:38px;
  height:2px;
  background:var(--blue);
}

h1,
h2,
h3{
  line-height:1.08;
  margin:0;
}

h1{
  font-size:clamp(2.7rem,6vw,5.6rem);
  letter-spacing:-.055em;
}

h2{
  font-size:clamp(2rem,4vw,3.8rem);
  letter-spacing:-.045em;
}

h3{
  font-size:1.2rem;
}

p{
  margin:0;
}

/* Cabeçalho */

header{
  position:sticky;
  top:0;
  z-index:100;
  background:rgba(255,255,255,.86);
  backdrop-filter:blur(18px);
  border-bottom:1px solid rgba(220,231,245,.8);
}

.nav{
  height:92px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:28px;
}

.logo{
  width:174px;
}

.nav-links{
  display:flex;
  align-items:center;
  gap:34px;
  font-weight:650;
  font-size:.95rem;
}

.nav-links a{
  position:relative;
  padding:10px 0;
}

.nav-links a:after{
  content:"";
  position:absolute;
  left:0;
  bottom:4px;
  width:0;
  height:2px;
  background:var(--blue);
  transition:.25s;
}

.nav-links a:hover:after,
.nav-links a.active:after{
  width:100%;
}

.nav-cta,
.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  min-height:52px;
  padding:0 24px;
  border-radius:14px;
  font-weight:800;
  transition:.25s;
  border:1px solid transparent;
  cursor:pointer;
}

.nav-cta,
.btn-primary{
  background:linear-gradient(135deg,var(--navy),var(--blue));
  color:#fff;
  box-shadow:0 12px 30px rgba(12,111,232,.24);
}

.nav-cta:hover,
.btn-primary:hover{
  transform:translateY(-2px);
  box-shadow:0 18px 34px rgba(12,111,232,.32);
}

.btn-secondary{
  border-color:#bdd1ed;
  color:var(--navy);
  background:#fff;
}

.btn-secondary:hover{
  border-color:var(--blue);
  color:var(--blue);
  transform:translateY(-2px);
}

.menu-btn{
  display:none;
  border:0;
  background:none;
  font-size:1.8rem;
  color:var(--navy);
}

/* Hero */

.hero{
  min-height:calc(100vh - 92px);
  display:grid;
  align-items:center;
  position:relative;
  overflow:hidden;
  background:
    radial-gradient(circle at 78% 35%,rgba(44,145,255,.17),transparent 31%),
    radial-gradient(circle at 15% 85%,rgba(12,111,232,.08),transparent 30%),
    linear-gradient(135deg,#fff 0%,#f6faff 100%);
}

.hero:before{
  content:"";
  position:absolute;
  right:-120px;
  top:70px;
  width:430px;
  height:430px;
  border:1px solid rgba(12,111,232,.14);
  border-radius:50%;
}

.hero-grid{
  display:grid;
  grid-template-columns:1.05fr .95fr;
  gap:70px;
  align-items:center;
  padding:80px 0;
}

.hero-copy p{
  font-size:1.15rem;
  color:#52627a;
  max-width:620px;
  margin:28px 0 34px;
}

.hero-actions{
  display:flex;
  gap:14px;
  flex-wrap:wrap;
}

.hero-visual{
  min-height:560px;
  position:relative;
  border-radius:32px;
  overflow:hidden;

  background:
    linear-gradient(155deg,rgba(7,39,96,.05),rgba(7,39,96,.68)),
    url("hero-prover.jpg") center/cover no-repeat;

  box-shadow:var(--shadow);
}

.hero-visual:before{
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(110deg,transparent 25%,rgba(255,255,255,.23) 26%,transparent 27%),
    radial-gradient(circle at 75% 25%,rgba(255,255,255,.5),transparent 22%);
}

.hero-badge{
  position:absolute;
  left:26px;
  bottom:26px;
  right:26px;
  padding:25px;
  border:1px solid rgba(255,255,255,.35);
  border-radius:20px;
  background:rgba(255,255,255,.13);
  backdrop-filter:blur(14px);
  color:#fff;
}

.hero-badge strong{
  font-size:1.35rem;
  display:block;
  margin-bottom:4px;
}

.hero-stat{
  position:absolute;
  right:-18px;
  top:45px;
  background:#fff;
  padding:20px 24px;
  border-radius:18px;
  box-shadow:var(--shadow);
  min-width:190px;
}

.hero-stat strong{
  font-size:2rem;
  color:var(--blue);
  display:block;
  line-height:1;
}

/* Seções gerais */

.section{
  padding:110px 0;
}

.section-soft{
  background:var(--soft);
}

.section-head{
  display:flex;
  justify-content:space-between;
  gap:40px;
  align-items:end;
  margin-bottom:48px;
}

.section-head p{
  max-width:540px;
  color:var(--muted);
}

/* Cards de soluções */

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

.card{
  padding:30px;
  border:1px solid var(--line);
  border-radius:var(--radius);
  background:#fff;
  box-shadow:0 12px 40px rgba(8,43,102,.06);
  transition:.3s;
  position:relative;
  overflow:hidden;
}

.card:before{
  content:"";
  position:absolute;
  inset:auto -50px -70px auto;
  width:150px;
  height:150px;
  border-radius:50%;
  background:rgba(12,111,232,.06);
  transition:.3s;
}

.card:hover{
  transform:translateY(-8px);
  border-color:#b8d2f4;
  box-shadow:0 22px 55px rgba(8,43,102,.12);
}

.card:hover:before{
  transform:scale(1.35);
}

.icon{
  width:54px;
  height:54px;
  border-radius:16px;
  display:grid;
  place-items:center;
  background:linear-gradient(135deg,#e6f1ff,#f7fbff);
  color:var(--blue);
  font-size:1.45rem;
  margin-bottom:24px;
}

.card h3{
  margin-bottom:12px;
  color:var(--navy);
}

.card p{
  color:var(--muted);
  font-size:.96rem;
}

/* Seções com imagem institucional */

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

.about-copy{
  max-width:940px;
}

.about-copy .eyebrow{
  margin-bottom:20px;
}

.about-copy h2{
  max-width:880px;
  margin-bottom:28px;
}

.about-copy p{
  max-width:880px;
  color:var(--muted);
  margin:0 0 18px;
  font-size:1.05rem;
  line-height:1.85;
}

.checks{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:18px;
  margin:36px 0 0;
}

.check{
  min-height:78px;
  display:flex;
  align-items:center;
  gap:14px;
  padding:20px 22px;
  border:1px solid var(--line);
  border-radius:18px;
  background:#fff;
  color:var(--navy);
  font-weight:750;
  box-shadow:0 10px 30px rgba(8,43,102,.06);
  transition:.25s;
}

.check:hover{
  transform:translateY(-4px);
  border-color:#b8d2f4;
  box-shadow:0 16px 36px rgba(8,43,102,.10);
}

.check span{
  width:30px;
  height:30px;
  display:grid;
  place-items:center;
  flex-shrink:0;
  border-radius:50%;
  background:#eaf3ff;
  color:var(--blue);
  font-size:.9rem;
  font-weight:900;
}

/* Imagem da seção Sobre a Prover, exibida na página inicial */

.about-art{
  min-height:520px;
  border-radius:30px;
  background:
    linear-gradient(150deg,rgba(8,43,102,.10),rgba(8,43,102,.70)),
    url("sobre-prover.jpg") center/cover no-repeat;
  position:relative;
  overflow:hidden;
  box-shadow:var(--shadow);
}

.about-art:before{
  content:"";
  position:absolute;
  width:300px;
  height:300px;
  border:60px solid rgba(255,255,255,.14);
  border-radius:50%;
  right:-100px;
  top:-70px;
}

.about-art .quote{
  position:absolute;
  left:28px;
  right:28px;
  bottom:28px;
  background:#fff;
  border-radius:20px;
  padding:24px;
  color:var(--navy);
  font-weight:750;
  box-shadow:0 20px 45px rgba(8,43,102,.18);
}

/* Última seção da página Sobre: texto à esquerda e imagem à direita */
/* No HTML, use: class="container about-grid atuacao-grid" */

.atuacao-grid{
  grid-template-columns:1fr 1fr;
  gap:70px;
  align-items:center;
}

.atuacao-grid:after{
  content:"";
  display:block;
  min-height:540px;
  border-radius:30px;
  background:
    linear-gradient(150deg,rgba(8,43,102,.06),rgba(8,43,102,.48)),
    url("atuacao-prover.jpg") center/cover no-repeat;
  box-shadow:var(--shadow);
  position:relative;
}

.atuacao-grid .about-copy{
  max-width:600px;
  margin:0;
}

/* Localizações */

.locations{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:22px;
}

.location-card{
  padding:28px;
  border-radius:22px;
  background:#fff;
  border:1px solid var(--line);
}

.location-card small{
  display:block;
  color:var(--blue);
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.12em;
  margin-bottom:8px;
}

.location-card h3{
  color:var(--navy);
  margin-bottom:10px;
}

.location-card a{
  display:block;
  color:var(--muted);
  margin-top:5px;
}

.location-card a:hover{
  color:var(--blue);
}

/* Chamada para ação */

.cta{
  background:linear-gradient(135deg,#061f4d,#0a5cbf);
  color:#fff;
  border-radius:34px;
  padding:64px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:45px;
  position:relative;
  overflow:hidden;
}

.cta:after{
  content:"";
  position:absolute;
  width:300px;
  height:300px;
  border:1px solid rgba(255,255,255,.15);
  border-radius:50%;
  right:-80px;
  top:-130px;
}

.cta p{
  color:#cfddf2;
  max-width:650px;
  margin-top:16px;
}

.cta .btn{
  background:#fff;
  color:var(--navy);
  white-space:nowrap;
  position:relative;
  z-index:2;
}

/* Cabeçalho de páginas internas */

.page-hero{
  padding:100px 0 75px;
  background:linear-gradient(135deg,#f7fbff,#eaf3ff);
  border-bottom:1px solid var(--line);
}

.page-hero p{
  max-width:720px;
  color:var(--muted);
  font-size:1.12rem;
  margin-top:22px;
}

/* Contato */

.contact-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:30px;
}

.contact-panel{
  padding:38px;
  border-radius:28px;
  background:#fff;
  border:1px solid var(--line);
  box-shadow:0 14px 45px rgba(8,43,102,.07);
}

.contact-row{
  display:flex;
  gap:16px;
  padding:18px 0;
  border-bottom:1px solid var(--line);
}

.contact-row:last-child{
  border-bottom:0;
}

.contact-row strong{
  display:block;
  color:var(--navy);
}

.contact-row a,
.contact-row span{
  color:var(--muted);
}

/* Rodapé */

footer{
  background:#061a3d;
  color:#fff;
  padding:72px 0 28px;
}

.footer-grid{
  display:grid;
  grid-template-columns:1.3fr .8fr 1fr;
  gap:55px;
}

.footer-logo{
  width:190px;
  background:#fff;
  border-radius:10px;
  padding:8px;
}

footer p,
footer a{
  color:#aebcd0;
}

footer h3{
  margin-bottom:18px;
}

.footer-links{
  display:grid;
  gap:10px;
}

.footer-bottom{
  border-top:1px solid rgba(255,255,255,.12);
  margin-top:48px;
  padding-top:22px;
  color:#91a2b9;
  font-size:.9rem;
}

/* WhatsApp */

.whatsapp{
  position:fixed;
  right:22px;
  bottom:22px;
  z-index:120;
  width:62px;
  height:62px;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:#25D366;
  color:#fff;
  box-shadow:0 15px 35px rgba(37,211,102,.35);
  font-size:1.7rem;
  transition:.25s;
}

.whatsapp:hover{
  transform:scale(1.08) translateY(-2px);
}

/* Animações */

.reveal{
  opacity:0;
  transform:translateY(24px);
  transition:opacity .75s ease,transform .75s ease;
}

.reveal.visible{
  opacity:1;
  transform:none;
}

/* Tablets */

@media(max-width:900px){

  .nav-links{
    display:none;
    position:absolute;
    top:92px;
    left:0;
    right:0;
    background:#fff;
    padding:24px 20px;
    flex-direction:column;
    align-items:flex-start;
    border-bottom:1px solid var(--line);
  }

  .nav-links.open{
    display:flex;
  }

  .nav-cta{
    display:none;
  }

  .menu-btn{
    display:block;
  }

  .hero-grid,
  .about-grid,
  .atuacao-grid,
  .contact-grid{
    grid-template-columns:1fr;
  }

  .hero{
    min-height:auto;
  }

  .hero-visual{
    min-height:440px;
  }

  .about-art,
  .atuacao-grid:after{
    min-height:440px;
  }

  .atuacao-grid .about-copy{
    max-width:none;
  }

  .hero-stat{
    right:18px;
  }

  .cards,
  .locations{
    grid-template-columns:1fr 1fr;
  }

  .section-head{
    display:block;
  }

  .section-head p{
    margin-top:18px;
  }

  .cta{
    padding:44px;
    display:block;
  }

  .cta .btn{
    margin-top:26px;
  }

  .footer-grid{
    grid-template-columns:1fr 1fr;
  }
}

/* Celulares */

@media(max-width:620px){

  .container{
    width:min(100% - 28px,1160px);
  }

  .nav{
    height:78px;
  }

  .nav-links{
    top:78px;
  }

  .logo{
    width:145px;
  }

  .hero-grid{
    padding:55px 0;
    gap:38px;
  }

  .hero-visual{
    min-height:350px;
  }

  .about-art,
  .atuacao-grid:after{
    min-height:360px;
    border-radius:24px;
  }

  .hero-stat{
    display:none;
  }

  .section{
    padding:78px 0;
  }

  .cards,
  .locations,
  .checks,
  .footer-grid{
    grid-template-columns:1fr;
  }

  .about-copy h2{
    font-size:clamp(2rem,10vw,2.7rem);
  }

  .about-copy p{
    font-size:1rem;
    line-height:1.75;
  }

  .check{
    min-height:70px;
    padding:18px;
  }

  .cta{
    padding:34px 26px;
    border-radius:24px;
  }

  .page-hero{
    padding:70px 0 55px;
  }
}

/*!
 * =========================================================
 * Website desenvolvido por Bernardo Porto (BP)
 * Desenvolvimento Front-end | HTML, CSS e JavaScript
 *
 * © 2026 Bernardo Porto (BP)
 * Todos os direitos reservados.
 * =========================================================
 */