/* C SANTOS ENGENHARIA — estilos do site (Manual da Marca v1.0, outubro de 2026) */

@font-face{font-family:"Montserrat";font-style:normal;font-weight:600;font-display:swap;src:url("fonts/montserrat-latin-600-normal.woff2") format("woff2")}
@font-face{font-family:"Montserrat";font-style:normal;font-weight:700;font-display:swap;src:url("fonts/montserrat-latin-700-normal.woff2") format("woff2")}
@font-face{font-family:"Source Sans 3";font-style:normal;font-weight:400;font-display:swap;src:url("fonts/source-sans-3-latin-400-normal.woff2") format("woff2")}
@font-face{font-family:"Source Sans 3";font-style:normal;font-weight:600;font-display:swap;src:url("fonts/source-sans-3-latin-600-normal.woff2") format("woff2")}

:root{
  --azul:#043E5A;
  --azul-esc:#032E43;
  --ciano:#029FC6;
  --claro:#6DC4D2;
  --grafite:#273744;
  --cinza:#657380;
  --gelo:#F1F6F8;
  --linha:#D7E3E9;
  --branco:#FFFFFF;
  --raio:12px;
  --larg:1160px;
  --fonte-titulo:"Montserrat","Segoe UI",Arial,sans-serif;
  --fonte-corpo:"Source Sans 3","Segoe UI",Arial,sans-serif;
}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;font-family:var(--fonte-corpo);font-size:1.0625rem;line-height:1.6;color:var(--grafite);background:var(--branco);-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto;display:block}
a{color:var(--azul)}
a:hover{color:var(--ciano)}
:focus-visible{outline:3px solid var(--ciano);outline-offset:3px;border-radius:4px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:-999px;top:8px;background:var(--azul);color:#fff;padding:10px 16px;border-radius:8px;z-index:100}
.skip:focus{left:8px;color:#fff}

h1,h2,h3,h4{font-family:var(--fonte-titulo);color:var(--azul);line-height:1.2;margin:0 0 .5em;font-weight:700;letter-spacing:-.01em}
h1{font-size:clamp(2.25rem,4.6vw,3.25rem)}
h2{font-size:clamp(1.75rem,3.2vw,2.375rem)}
h3{font-size:1.25rem;font-weight:600}
p{margin:0 0 1em}
.container{width:min(var(--larg),100% - 40px);margin-inline:auto}

/* ---------- cabeçalho ---------- */
.site-header{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.97);border-bottom:1px solid var(--linha);backdrop-filter:saturate(1.2) blur(6px)}
.bar{display:flex;align-items:center;justify-content:space-between;gap:24px;min-height:84px;padding-block:10px}
.brand img{width:104px;height:auto}
.nav{display:flex;align-items:center;gap:6px}
.nav a{font-family:var(--fonte-titulo);font-weight:600;font-size:.9375rem;color:var(--grafite);text-decoration:none;padding:10px 14px;border-radius:8px;position:relative}
.nav a:hover{color:var(--azul);background:var(--gelo)}
.nav a[aria-current="page"]{color:var(--azul)}
.nav a[aria-current="page"]::after{content:"";position:absolute;left:14px;right:14px;bottom:3px;height:3px;border-radius:2px;background:var(--ciano)}
.nav .btn{margin-left:10px;color:#fff}
.nav .btn:hover{background:var(--azul-esc);color:#fff}
.menu-btn{display:none;background:none;border:1px solid var(--linha);border-radius:10px;width:46px;height:46px;align-items:center;justify-content:center;cursor:pointer;color:var(--azul)}
.menu-btn svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}

/* ---------- botões ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;font-family:var(--fonte-titulo);font-weight:600;font-size:.9375rem;line-height:1.2;text-decoration:none;padding:14px 24px;border-radius:10px;border:2px solid var(--azul);background:var(--azul);color:#fff;cursor:pointer;transition:background .2s,color .2s,border-color .2s,transform .2s}
.btn:hover{background:var(--azul-esc);border-color:var(--azul-esc);color:#fff;transform:translateY(-1px)}
.btn-sm{padding:11px 18px;font-size:.875rem}
.btn-ghost{background:transparent;color:var(--azul)}
.btn-ghost:hover{background:var(--azul);color:#fff}
.btn-light{background:#fff;color:var(--azul);border-color:#fff}
.btn-light:hover{background:var(--gelo);color:var(--azul);border-color:var(--gelo)}
.btn-outline-light{background:transparent;color:#fff;border-color:rgba(255,255,255,.7)}
.btn-outline-light:hover{background:#fff;color:var(--azul);border-color:#fff}
.btn svg{width:20px;height:20px;flex:none;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.btn-row{display:flex;flex-wrap:wrap;gap:14px;margin-top:28px}

/* ---------- seções ---------- */
.section{padding-block:clamp(56px,8vw,96px)}
.section.alt{background:var(--gelo)}
.eyebrow{display:inline-flex;align-items:center;gap:10px;font-family:var(--fonte-titulo);font-weight:600;font-size:.8125rem;letter-spacing:.14em;text-transform:uppercase;color:var(--cinza);margin-bottom:14px}
.eyebrow::before{content:"";width:28px;height:3px;border-radius:2px;background:var(--ciano)}
.section-head{max-width:720px;margin-bottom:44px}
.section-head p{color:var(--cinza);font-size:1.125rem}
.lede{font-size:1.1875rem;color:var(--grafite)}

/* ---------- abertura ---------- */
.hero{background:var(--gelo);position:relative;overflow:hidden;padding-block:clamp(56px,9vw,112px)}
.hero::before{content:"";position:absolute;inset:0;background-image:linear-gradient(var(--linha) 1px,transparent 1px),linear-gradient(90deg,var(--linha) 1px,transparent 1px);background-size:56px 56px;opacity:.55;mask-image:linear-gradient(100deg,transparent 20%,#000 75%);-webkit-mask-image:linear-gradient(100deg,transparent 20%,#000 75%)}
.hero .container{position:relative;display:grid;grid-template-columns:1.25fr .75fr;gap:56px;align-items:center}
.hero h1{margin-bottom:.45em}
.hero .lede{max-width:640px;color:var(--grafite)}
.facts{display:grid;gap:14px}
.fact{background:#fff;border:1px solid var(--linha);border-left:4px solid var(--ciano);border-radius:var(--raio);padding:18px 22px;box-shadow:0 8px 24px rgba(4,62,90,.06)}
.fact strong{display:block;font-family:var(--fonte-titulo);font-size:1.375rem;color:var(--azul);line-height:1.2}
.fact span{color:var(--cinza);font-size:.9688rem}

.page-hero{background:var(--gelo);padding-block:clamp(44px,6vw,80px);border-bottom:1px solid var(--linha)}
.page-hero .lede{max-width:760px}

/* ---------- cartões ---------- */
.grid{display:grid;gap:24px}
.g2{grid-template-columns:repeat(2,1fr)}
.g3{grid-template-columns:repeat(3,1fr)}
.g4{grid-template-columns:repeat(4,1fr)}
.g5{grid-template-columns:repeat(6,1fr)}
.g5>*{grid-column:span 2}
.g5>*:nth-child(n+4){grid-column:span 3}
.card{background:#fff;border:1px solid var(--linha);border-radius:var(--raio);padding:28px;display:flex;flex-direction:column;position:relative;transition:box-shadow .2s,transform .2s,border-color .2s}
.card::before{content:"";position:absolute;left:28px;top:-1px;width:44px;height:4px;border-radius:0 0 4px 4px;background:var(--ciano)}
a.card,.card.link{text-decoration:none;color:inherit}
.card:hover{box-shadow:0 14px 34px rgba(4,62,90,.10);border-color:#bfd3dc}
.card p{color:var(--cinza);margin-bottom:0}
.card h3{margin-top:6px}
.card .more{margin-top:auto;padding-top:20px;font-family:var(--fonte-titulo);font-weight:600;font-size:.9375rem;color:var(--azul);display:inline-flex;align-items:center;gap:8px}
.card:hover .more{color:var(--ciano)}
.icon{width:52px;height:52px;border-radius:12px;background:var(--azul);display:grid;place-items:center;margin-bottom:18px}
.icon svg{width:26px;height:26px;stroke:#fff;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.chips{display:flex;flex-wrap:wrap;gap:8px;margin:16px 0 0;padding:0;list-style:none}
.chips li{font-size:.8125rem;font-weight:600;color:var(--azul);background:var(--gelo);border:1px solid var(--linha);border-radius:999px;padding:4px 12px}

/* ---------- listas com marcador ---------- */
.checks{list-style:none;margin:18px 0 0;padding:0;display:grid;gap:12px}
.checks li{position:relative;padding-left:34px}
.checks li::before{content:"";position:absolute;left:0;top:.2em;width:22px;height:22px;border-radius:50%;background:var(--ciano) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E") center/14px no-repeat}
.checks li small{display:block;color:var(--cinza);font-size:.9375rem}

.panel{background:#fff;border:1px solid var(--linha);border-radius:var(--raio);padding:clamp(24px,3.4vw,40px)}
.panel .lede{color:var(--cinza);font-size:1.0625rem}
.split{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,5vw,64px);align-items:start}
.note{margin-top:28px;padding:18px 22px;border-radius:var(--raio);background:#fff;border:1px dashed var(--claro);color:var(--grafite)}
.alt .note{background:#fff}
.note a{font-weight:600}

/* ---------- etapas ---------- */
.steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:24px;counter-reset:passo}
.steps li{counter-increment:passo;position:relative;padding-top:64px}
.steps li::before{content:"0" counter(passo);position:absolute;top:0;left:0;font-family:var(--fonte-titulo);font-weight:700;font-size:2.75rem;line-height:1;color:var(--claro)}
.steps li::after{content:"";position:absolute;top:22px;left:70px;right:-12px;height:2px;background:var(--linha)}
.steps li:last-child::after{display:none}
.steps h3{font-size:1.125rem;margin-bottom:.35em}
.steps p{color:var(--cinza);font-size:1rem;margin:0}

/* ---------- liderança ---------- */
.profile{display:grid;grid-template-columns:auto 1fr;gap:36px;align-items:start}
.profile .mark{width:96px;height:96px;border-radius:50%;background:var(--azul);display:grid;place-items:center}
.profile .mark img{width:56px}
.profile h3{font-size:1.375rem;margin-bottom:.1em}
.profile .role{color:var(--cinza);font-weight:600;margin-bottom:1em}

/* ---------- chamada final ---------- */
.cta{background:var(--azul);color:#fff;padding-block:clamp(52px,7vw,88px)}
.cta h2{color:#fff;max-width:760px}
.cta p{color:#dbe9ef;font-size:1.125rem;max-width:680px}
.cta .btn-row{margin-top:26px}

/* ---------- contato ---------- */
.channels{display:grid;gap:16px}
.channel{display:flex;gap:18px;align-items:flex-start;background:#fff;border:1px solid var(--linha);border-radius:var(--raio);padding:20px 22px}
.channel .icon{margin:0;flex:none;width:46px;height:46px}
.channel .icon svg{width:23px;height:23px}
.channel h3{font-size:1.0625rem;margin:0 0 2px}
.channel p{margin:0;color:var(--cinza)}
.channel a{font-weight:600;word-break:break-word}
.fine{font-size:.875rem;color:var(--cinza);margin-top:14px}

/* ---------- texto longo (privacidade) ---------- */
.prose{max-width:780px}
.prose h2{font-size:1.5rem;margin-top:1.8em}
.prose ul{padding-left:1.2em}
.prose li{margin-bottom:.4em}

/* ---------- rodapé ---------- */
.site-footer{background:var(--azul);color:#cfe0e8;padding-top:56px;font-size:.9688rem}
.footer-grid{display:grid;grid-template-columns:1.2fr 1fr 1fr 1.2fr;gap:36px;padding-bottom:40px}
.site-footer img{width:150px;margin-bottom:16px}
.site-footer h4{font-size:.8125rem;letter-spacing:.14em;text-transform:uppercase;color:var(--claro);margin-bottom:14px}
.site-footer a{color:#fff;text-decoration:none}
.site-footer a:hover{color:var(--claro);text-decoration:underline}
.site-footer ul{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.site-footer p{margin:0 0 8px}
.legal{border-top:1px solid rgba(255,255,255,.16);padding-block:20px;display:flex;flex-wrap:wrap;gap:8px 24px;justify-content:space-between;font-size:.875rem;color:#b5cdd8}

/* ---------- responsivo ---------- */
@media (max-width:1020px){
  .g4{grid-template-columns:repeat(2,1fr)}
  .steps{grid-template-columns:repeat(2,1fr);row-gap:36px}
  .steps li::after{display:none}
  .footer-grid{grid-template-columns:1fr 1fr}
}
@media (max-width:900px){
  .menu-btn{display:inline-flex}
  .nav{position:absolute;left:0;right:0;top:100%;background:#fff;border-bottom:1px solid var(--linha);flex-direction:column;align-items:stretch;gap:2px;padding:12px 20px 20px;display:none;box-shadow:0 18px 30px rgba(4,62,90,.10)}
  .nav.open{display:flex}
  .nav a[aria-current="page"]::after{left:14px;right:auto;width:28px}
  .nav .btn{margin:10px 0 0}
  .hero .container{grid-template-columns:1fr;gap:36px}
  .g3,.g2,.split{grid-template-columns:1fr}
  .g5{grid-template-columns:1fr}
  .g5>*,.g5>*:nth-child(n+4){grid-column:auto}
  .profile{grid-template-columns:1fr;gap:20px}
}
@media (max-width:560px){
  .g4,.steps,.footer-grid{grid-template-columns:1fr}
  .bar{min-height:72px}
  .brand img{width:88px}
  .btn-row .btn{width:100%}
  .card{padding:24px}
  .card::before{left:24px}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *{transition:none!important}
}
@media print{
  .site-header,.cta,.menu-btn{display:none}
}
