/* Portal Car Proteção Veicular: HTML puro. Cores, fontes e medidas do tema Astra + Elementor de abril de 2024. */
@font-face { font-family: "Poppins"; font-style: normal; font-weight: 700; font-display: swap; src: url(../fonts/poppins-700.woff2) format("woff2"); }
@font-face { font-family: "Open Sans"; font-style: normal; font-weight: 400 600; font-stretch: 100%; font-display: swap; src: url(../fonts/open-sans.woff2) format("woff2"); }

:root {
  color-scheme: only light;
  --azul: #1a5ce0;          /* cor principal do tema (astglobalcolor0) */
  --titulo: #000f23;        /* títulos (astglobalcolor2) */
  --texto: #67757f;         /* texto (astglobalcolor3) */
  --fundo-site: #f7f8f8;    /* fundo do site (astglobalcolor4) */
  --rodape: #242a36;        /* rodapé (astglobalcolor6) */
  --cinza-claro: #cad0db;
  --borda: #e9ebef;
  --container: 1140px;
  --lateral: 40px;
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
body { margin: 0; background: var(--fundo-site); color: var(--texto); font: 400 16px/1.85714 "Open Sans", Arial, sans-serif; overflow-wrap: break-word; }
img, svg { display: block; max-width: 100%; }
img { height: auto; }
a { color: var(--azul); }
p { margin: 0; }
h1, h2, h3 { margin: 0; color: var(--titulo); font-family: "Poppins", Arial, sans-serif; font-weight: 700; }
strong { font-weight: 600; }
:focus-visible { outline: 2px solid var(--azul); outline-offset: 3px; }

.container { width: min(var(--container), calc(100% - 2 * var(--lateral))); margin-inline: auto; }
.pular { position: absolute; left: -9999px; top: 8px; z-index: 100; padding: 10px 16px; background: #fff; color: var(--titulo); font-weight: 600; }
.pular:focus { left: 8px; }
.ic { width: 1em; height: 1em; flex: none; }

/* ---------------------------------------------------------------- botões */
.botoes { display: flex; flex-wrap: wrap; gap: 16px 24px; margin-top: 20px; }
.botoes-coluna { flex-direction: column; align-items: flex-start; gap: 20px; }
.botao { display: inline-block; padding: 16px 24px; border: 1px solid; border-radius: 3px; font: 500 15px/1 "Open Sans", Arial, sans-serif; text-decoration: none; text-align: center; transition: color .3s, background-color .3s, border-color .3s; }
.botao-branco { background: #fff; border-color: #fff; color: var(--azul); }
.botao-branco:hover, .botao-branco:focus-visible { background: transparent; color: #fff; }
.botao-vazado { background: transparent; border-color: rgba(255, 255, 255, .24); color: rgba(255, 255, 255, .78); }
.botao-vazado:hover, .botao-vazado:focus-visible { border-color: #fff; color: #fff; }
.botao-contorno { background: transparent; border-color: var(--azul); color: var(--azul); }
.botao-contorno:hover, .botao-contorno:focus-visible { background: var(--azul); color: #fff; }
.botao-azul { background: var(--azul); border-color: var(--azul); color: #fff; }
.botao-azul:hover, .botao-azul:focus-visible { background: transparent; color: var(--azul); }

/* ---------------------------------------------------------------- cabeçalho (transparente sobre o topo azul, como no Astra) */
.cabecalho { position: absolute; top: 0; left: 0; right: 0; z-index: 20; border-bottom: 1px solid rgba(255, 255, 255, .14); }
.cabecalho-in { width: min(1200px, calc(100% - 2 * var(--lateral))); margin-inline: auto; min-height: 102px; display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.logo img { width: 180px; height: auto; }
.menu-painel { display: flex; align-items: center; gap: 37px; }
.menu-lista { display: flex; gap: 31px; margin: 0; padding: 0; list-style: none; }
.menu-lista a { color: rgba(255, 255, 255, .75); font-size: 16px; font-weight: 400; text-decoration: none; transition: color .3s; }
.menu-lista a:hover, .menu-lista a:focus-visible, .menu-lista a[aria-current="page"] { color: #fff; }
.botao-topo { display: inline-block; padding: 14px 24px; border: 1px solid rgba(255, 255, 255, .33); border-radius: 2px; color: #fff; font: 600 15px/1 "Open Sans", Arial, sans-serif; text-decoration: none; transition: border-color .3s; }
.botao-topo:hover, .botao-topo:focus-visible { border-color: #fff; }
.menu-botao { display: none; }

/* ---------------------------------------------------------------- textos comuns das seções */
.secao { padding: 104px 0; }
.sobretitulo { font: 700 14px/1.25 "Poppins", Arial, sans-serif; letter-spacing: 2px; text-transform: uppercase; color: var(--azul); }
.secao > .container > .sobretitulo, .secao > .container > h2, .secao-intro { text-align: center; }
.secao h2 { margin-top: 20px; font-size: 48px; line-height: 1.3; }
.secao-intro { margin: 20px 24% 0; }

/* ---------------------------------------------------------------- topo da home */
.hero { position: relative; background: var(--azul); padding-top: 140px; overflow: hidden; }
.hero::before, .cotacao::before, .topo-pagina::before { content: ""; position: absolute; inset: 0; background: url(../img/fundos/curva.svg) center / cover no-repeat; opacity: .8; pointer-events: none; }
.hero-in { position: relative; display: flex; align-items: stretch; }
.hero-texto { flex: 0 0 50%; display: flex; flex-direction: column; justify-content: center; padding-bottom: 120px; }
.hero h1 { color: #fff; font-size: 45px; line-height: 1.4; margin-bottom: 44px; }
.hero-sub { color: #e9ebef; font: 700 18px/1.2 "Poppins", Arial, sans-serif; }
.checks { display: flex; flex-wrap: wrap; gap: 8px 36px; margin: 40px 0 0; padding: 0; list-style: none; }
.checks li { display: flex; align-items: center; gap: 12px; color: #fff; font-size: 15px; font-weight: 600; line-height: 1.5; }
.checks .ic { width: 14px; height: 14px; color: var(--cinza-claro); }
.hero-foto { flex: 0 0 50%; display: flex; justify-content: flex-end; align-items: flex-end; }
.familia { width: 525px; filter: brightness(1.09) contrast(.78); }

/* ---------------------------------------------------------------- três motivos */
.razoes { background: var(--fundo-site) url(../img/fundos/blob-azul.svg) left center / 76% auto no-repeat; }
.razao { display: grid; grid-template-columns: 1fr 1fr; align-items: center; margin-top: 60px; padding-bottom: 64px; }
.razao + .razao { margin-top: 40px; }
.razao:last-child { padding-bottom: 0; }
.razao-foto { position: relative; padding-bottom: 8px; }
.razao-foto::before { content: ""; position: absolute; inset: 0; background: var(--sombra) bottom center / 90% auto no-repeat; filter: blur(32px); opacity: .64; }
.razao-foto img { position: relative; width: 100%; border-radius: 8px; filter: contrast(.8); }
.razao-texto { padding: 0 16px 0 64px; }
.razao-inversa .razao-foto { order: 2; }
.razao-inversa .razao-texto { padding: 0 88px 0 0; }
.numero { margin-bottom: -8px; color: var(--azul); font: 700 18px/1.2 "Poppins", Arial, sans-serif; }
.razao h3 { margin: 40px 0 20px; font-size: 32px; line-height: 1.3; }
.razao-texto p + p { margin-top: 16px; }
.razao-texto .botao { margin-top: 24px; }

/* ---------------------------------------------------------------- serviços */
.servicos { scroll-margin-top: 0; }
.grade-servicos { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 44px 48px; margin: 64px 0 0; padding: 0; list-style: none; }
.servico { padding: 56px 40px 56px 32px; background: #fff; border-radius: 16px; box-shadow: 0 40px 120px -40px rgba(93, 114, 128, .24); transition: box-shadow .3s; }
.servico:hover { box-shadow: 0 48px 120px -40px rgba(93, 114, 128, .4); }
.servico-icone { width: 64px; height: 64px; padding: 16px; border-radius: 50%; background: rgba(26, 92, 224, .1); color: var(--azul); }
.servico h3 { margin: 16px 0 10px; font-size: 24px; line-height: 1.2; }

/* ---------------------------------------------------------------- depoimentos */
.depoimentos { background: #eef2f7; padding-bottom: 210px; }   /* 144 px + o carrossel de logos vazio que o Elementor deixava no fim */
.grade-depoimentos { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 48px; margin: 100px 0 0; padding: 0; list-style: none; }
.depoimento { padding: 40px 44px 40px 40px; border: 1px solid var(--borda); border-radius: 16px; transition: box-shadow .3s; }
.depoimento:hover { box-shadow: 0 40px 120px -40px rgba(0, 0, 0, .24); }
.aspas { width: 24px; height: 24px; margin-bottom: 12px; color: var(--azul); }
.depoimento blockquote { margin: 0 0 20px; }
.depoimento-nome { color: var(--titulo); font-weight: 600; font-size: 15px; line-height: 1.4; }
.depoimento-origem { font-size: 13px; line-height: 1.4; }

/* ---------------------------------------------------------------- chamada final "Receba uma Cotação Grátis" */
.cotacao { position: relative; background: #000f23 center / cover no-repeat; background-image: var(--fundo, none); overflow: hidden; }
.cotacao::before { background-color: #000f23; opacity: .75; }
.cotacao-in { position: relative; display: flex; align-items: stretch; }
.cotacao-foto { flex: 0 0 50%; display: flex; align-items: flex-end; padding-top: 34px; }
.cotacao-foto .familia { width: 535px; }
.cotacao-texto { flex: 0 0 40%; padding: 60px 40px; }
.cotacao .sobretitulo { color: var(--cinza-claro); }
.cotacao h2 { margin: 20px 0 36px; color: #fff; font-size: 32px; line-height: 1.3; }
.cotacao .hero-sub { margin-right: 0; }

/* ---------------------------------------------------------------- topo das páginas internas */
.topo-pagina { position: relative; padding: 240px 0 120px; background: var(--azul) center / cover no-repeat; background-image: var(--fundo, none); overflow: hidden; }
.topo-pagina::before { background-color: var(--azul); background-position: center left; opacity: .88; }
.topo-pagina .container { position: relative; }
.topo-pagina .sobretitulo { color: var(--cinza-claro); }
.topo-pagina h1 { margin-top: 20px; color: #fff; font-size: 40px; line-height: 1.4; }
.topo-curto { padding: 200px 0 80px; }

/* ---------------------------------------------------------------- regulamento do PAR */
.regulamento { background: #fff; }
.regulamento-in { padding-right: 80px; }
.regulamento h2 { margin: 20px 0 16px; font-size: 32px; line-height: 1.3; }
.regulamento .sobretitulo, .regulamento h2 { text-align: left; }
.texto { margin-top: 48px; }
.texto p { margin-bottom: 1em; }
.texto ol { margin: 0 0 1.5em 3em; padding: 0; }
.texto li { margin: 0; }
.texto strong { color: #4f5d68; }
.assinaturas { display: flex; flex-wrap: wrap; gap: 24px 8px; margin-top: 32px; }
.campo { padding-top: 6px; border-top: 1px solid currentColor; }
.campo-local { flex: 0 1 160px; }
.campo-data { flex: 0 1 90px; }
.campo-assinatura { flex: 0 1 265px; }

/* ---------------------------------------------------------------- 404 */
.pagina-404 ul { margin: 16px 0 32px; padding-left: 1.4em; }
.pagina-404 li + li { margin-top: 6px; }

/* ---------------------------------------------------------------- rodapé */
.rodape { background: var(--rodape); color: var(--cinza-claro); font-size: 14px; }
.rodape-in { display: grid; grid-template-columns: 1fr 1fr; padding: 104px 0 80px; }
.rodape-marca { padding-right: 24px; }
.rodape-marca img { width: 180px; margin-bottom: 32px; }
.rodape h2 { margin-bottom: 36px; color: #fff; font-size: 24px; line-height: 1.2; }
.rodape ul { margin: 0; padding: 0; list-style: none; }
.rodape li { display: flex; align-items: flex-start; gap: 12px; line-height: 1.85; }
.rodape li + li { margin-top: 4px; }
.rodape li .ic { width: 14px; height: 14px; margin-top: .45em; color: #fff; }
.rodape a { color: var(--cinza-claro); text-decoration: none; }
.rodape a:hover, .rodape a:focus-visible { color: #fff; text-decoration: underline; }
.subrodape { border-top: 1px solid #000; }
.subrodape .container { width: min(1200px, calc(100% - 2 * var(--lateral))); min-height: 95px; display: flex; align-items: center; }

/* ---------------------------------------------------------------- telas médias */
@media (max-width: 1024px) {
  .grade-servicos, .grade-depoimentos { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 32px; }
  .secao { padding: 80px 0; }
  .secao-intro { margin-inline: 10%; }
  .razao-texto { padding-left: 32px; }
  .razao-inversa .razao-texto { padding-right: 32px; }
  .hero-texto { flex-basis: 60%; }
  .hero-foto { flex-basis: 40%; }
  .familia { width: 100%; }
  .cotacao-foto .familia { width: 100%; }
  .cotacao-texto { flex-basis: 50%; padding: 60px 0 60px 40px; }
  .regulamento-in { padding-right: 0; }
}

/* menu do celular: painel azul-escuro com letra branca (continua legível com o modo escuro forçado do navegador) */
@media (max-width: 921px) {
  .menu-botao { display: flex; align-items: center; justify-content: center; width: 44px; height: 44px; padding: 0; border: 0; background: transparent; color: #fff; cursor: pointer; }
  .menu-botao .ic { width: 24px; height: 24px; }
  .menu-botao .ic-fechar, .menu-botao[aria-expanded="true"] .ic-abrir { display: none; }
  .menu-botao[aria-expanded="true"] .ic-fechar { display: block; }
  .menu-painel { display: none; position: absolute; top: 100%; left: 0; right: 0; flex-direction: column; align-items: stretch; gap: 0; padding: 8px var(--lateral) 24px; background: #000f23; box-shadow: 0 16px 32px rgba(0, 0, 0, .25); }
  .menu-botao[aria-expanded="true"] + .menu-painel { display: flex; }
  .menu-lista { flex-direction: column; gap: 0; }
  .menu-lista li + li { border-top: 1px solid rgba(255, 255, 255, .12); }
  .menu-lista a { display: block; padding: 14px 0; color: #fff; font-size: 16px; }
  .menu-lista a[aria-current="page"] { color: #fff; text-decoration: underline; text-underline-offset: 6px; }
  .botao-topo { margin-top: 16px; text-align: center; border-color: rgba(255, 255, 255, .5); }
  .cabecalho-in { min-height: 88px; }
  .logo img { width: 140px; }
  .secao h2 { font-size: 40px; }
  .razao h3, .cotacao h2, .regulamento h2 { font-size: 24px; }
  .servico h3 { font-size: 20px; }
}

/* ---------------------------------------------------------------- celular */
@media (max-width: 767px) {
  :root { --lateral: 24px; }
  .secao { padding: 64px 0; }
  .secao-intro { margin-inline: 16px; }
  .hero { padding-top: 120px; }
  .hero-in { flex-direction: column; }
  .hero-texto { padding-bottom: 0; }
  .hero-foto { margin-top: 50px; justify-content: center; }
  .familia { width: 100%; }
  .razao, .razao-inversa { grid-template-columns: 1fr; margin-top: 32px; padding-bottom: 32px; }
  .razao-inversa .razao-foto { order: 0; }
  .razao-texto, .razao-inversa .razao-texto { padding: 32px 0 0; }
  .grade-servicos, .grade-depoimentos { grid-template-columns: 1fr; gap: 24px; margin-top: 40px; }
  .servico, .depoimento { padding: 32px 32px 32px 24px; }
  .depoimentos { padding-bottom: 64px; }
  .cotacao-in { flex-direction: column-reverse; }
  .cotacao-texto { padding: 64px 0 0; }
  .cotacao-foto { padding-top: 40px; }
  .topo-pagina { padding: 200px 0 120px; }
  .topo-curto { padding: 160px 0 64px; }
  .rodape-in { grid-template-columns: 1fr; gap: 48px; padding: 72px 0 56px; }
  .texto ol { margin-left: 1.6em; }
}

@media (max-width: 544px) {
  .secao h2 { font-size: 32px; }
  .razao h3, .cotacao h2, .regulamento h2 { font-size: 20px; }
  .servico h3 { font-size: 18px; }
  .hero-sub { font-size: 16px; }
  .topo-pagina h1 { font-size: 32px; }
  .cabecalho-in { min-height: 80px; }
  .logo img { width: 124px; }
}

/* fundos: versão de 800 px no celular */
@media (max-width: 800px) {
  .cotacao, .topo-pagina { background-image: var(--fundo-m, var(--fundo, none)); }
}