@charset "UTF-8";
/* =========================================================
   Chronex - camada de estilo
   Referencia visual: pegga.app
   Nao substitui nada do tema; so acrescenta por cima.
   ========================================================= */

:root{
  --cx-navy-900:#0B1F2E;
  --cx-navy-800:#0D1B2A;
  --cx-navy-700:#122B3E;
  --cx-navy-600:#19415A;
  --cx-teal:#2EC4B6;
  --cx-teal-dark:#1FA69A;
  --cx-sky:#62B6CB;
  --cx-tint:#F5F9F9;
  --cx-line:rgba(13,27,42,.09);
  --cx-ease:cubic-bezier(.22,.68,.36,1);
}

/* ---------------------------------------------------------
   1. HERO - deixa de ser um bloco chapado
   --------------------------------------------------------- */
body .elementor-62 .elementor-element.elementor-element-c5cf9d9{
  position:relative;
  isolation:isolate;
  background-color:var(--cx-navy-700);
  background-image:
    radial-gradient(1100px 520px at 78% -12%, rgba(46,196,182,.20), rgba(0,0,0,0) 60%),
    radial-gradient(760px 420px at 10% 112%, rgba(98,182,203,.15), rgba(0,0,0,0) 62%),
    linear-gradient(165deg,#0F2739 0%,#122B3E 52%,#16394F 100%);
}
/* derrete para a seccao branca seguinte, em vez de cortar a direito */
body .elementor-62 .elementor-element.elementor-element-c5cf9d9::after{
  content:"";
  position:absolute; left:0; right:0; bottom:0; height:84px;
  background:linear-gradient(to bottom,
    rgba(255,255,255,0)    0%,
    rgba(255,255,255,.05) 25%,
    rgba(255,255,255,.16) 45%,
    rgba(255,255,255,.40) 65%,
    rgba(255,255,255,.74) 83%,
    #fff                 100%);
  pointer-events:none; z-index:0;
}
/* espaco extra em baixo para o texto miudo nao apanhar o degrade */
body .elementor-62 .elementor-element-c5cf9d9 > .e-con-inner{ padding-bottom:116px; }
body .elementor-62 .elementor-element.elementor-element-c5cf9d9 > .e-con-inner{
  position:relative; z-index:1;
}

/* pastilha por cima do titulo */
body .elementor-62 .elementor-element-c5cf9d9 .elementor-heading-title::before{
  content:"● FEITO EM PORTUGAL PARA MOTORISTAS TVDE";
  display:table; margin:0 auto 24px; padding:8px 17px;
  font-family:"Poppins",-apple-system,sans-serif;
  font-size:11px; font-weight:600; letter-spacing:.16em; line-height:1;
  color:#9BE7DD;
  background:rgba(46,196,182,.12);
  border:1px solid rgba(46,196,182,.30);
  border-radius:999px;
  white-space:nowrap;
}
@media (max-width:640px){
  body .elementor-62 .elementor-element-c5cf9d9 .elementor-heading-title::before{
    white-space:normal; font-size:10px; letter-spacing:.12em; padding:8px 14px;
  }
}

/* ---------------------------------------------------------
   2. TIPOGRAFIA
   --------------------------------------------------------- */
body .elementor-62 h1.elementor-heading-title{ letter-spacing:-.022em; line-height:1.12; }
body .elementor-62 h2.elementor-heading-title{ letter-spacing:-.015em; line-height:1.2; }

/* risquinho de acento debaixo de cada h2 */
body .elementor-62 > .e-con > .e-con-inner > .elementor-widget-heading .elementor-heading-title::after,
body .elementor-62 > .e-con > .elementor-widget-heading .elementor-heading-title::after,
body .elementor-62 .cx-feats h2::after{
  content:""; display:block;
  width:54px; height:3px; margin:18px auto 0;
  background:linear-gradient(90deg,var(--cx-teal),var(--cx-sky));
  border-radius:3px;
}
/* nas seccoes escuras/teal o risquinho tem de ser claro para se ver */
body .elementor-62 .elementor-element-c5cf9d9 .elementor-heading-title::after,
body .elementor-62 .elementor-element-b1ffd03 .elementor-heading-title::after,
body .elementor-62 .elementor-element-b47d7f0 .elementor-heading-title::after,
body .elementor-62 .cx-feats h2::after{
  background:linear-gradient(90deg, rgba(255,255,255,.92), rgba(255,255,255,.30));
}

/* ---------------------------------------------------------
   3. RITMO DE SECCOES - claro / tom / claro
   --------------------------------------------------------- */
body .elementor-62 .elementor-element.elementor-element-4880fc4{ background-color:#fff; }
body .elementor-62 .elementor-element.elementor-element-0fa8028{ background-color:var(--cx-tint); }
body .elementor-62 .elementor-element.elementor-element-29e632d{ background-color:var(--cx-tint); }
body .elementor-62 .elementor-element.elementor-element-51c3806{ background-color:#fff; }
body .elementor-62 .elementor-element.elementor-element-158356e{ background-color:var(--cx-tint); }

/* seccao escura do "O que o Chronex faz" ganha profundidade */
body .elementor-62 .elementor-element.elementor-element-f25358e{
  background-image:radial-gradient(900px 460px at 22% -10%, rgba(46,196,182,.14), rgba(0,0,0,0) 62%);
}
/* o bloco interno tinha fundo proprio e so ia ate 1140px, o que deixava
   uma costura visivel assim que a seccao ganhou degrade. Passa a herdar. */
body .elementor-62 .cx-feats{ background:transparent; }

/* CTA final: brilho por cima e transicao suave para o rodape claro */
body .elementor-62 .elementor-element.elementor-element-b47d7f0{
  position:relative; isolation:isolate;
  background-image:radial-gradient(900px 420px at 50% -25%, rgba(46,196,182,.20), rgba(0,0,0,0) 65%);
}
body .elementor-62 .elementor-element.elementor-element-b47d7f0::after{
  content:""; position:absolute; left:0; right:0; bottom:0; height:82px;
  background:linear-gradient(to bottom,
    rgba(241,245,249,0)    0%,
    rgba(241,245,249,.05) 25%,
    rgba(241,245,249,.17) 45%,
    rgba(241,245,249,.42) 65%,
    rgba(241,245,249,.76) 83%,
    #F1F5F9              100%);
  pointer-events:none; z-index:0;
}
/* folga para o botao nao cair dentro do degrade */
body .elementor-62 .elementor-element-b47d7f0 > .e-con-inner{ padding-bottom:112px; }
body .elementor-62 .elementor-element.elementor-element-b47d7f0 > .e-con-inner{ position:relative; z-index:1; }

/* ---------------------------------------------------------
   4. CARTOES - sombra suave e levantar no hover
   --------------------------------------------------------- */
body .elementor-62 .elementor-element-0fa8028 .elementor-widget-icon-box,
body .elementor-62 .elementor-element-29e632d .elementor-widget-icon-box,
body .elementor-62 .elementor-element-158356e .elementor-widget-icon-box{
  background-color:#fff;
  border-color:var(--cx-line);
  border-radius:14px;
  box-shadow:0 1px 2px rgba(13,27,42,.04), 0 10px 28px rgba(13,27,42,.06);
  transition:transform .18s var(--cx-ease), box-shadow .18s var(--cx-ease), border-color .18s var(--cx-ease);
  will-change:transform;
}
body .elementor-62 .elementor-element-0fa8028 .elementor-widget-icon-box:hover,
body .elementor-62 .elementor-element-29e632d .elementor-widget-icon-box:hover,
body .elementor-62 .elementor-element-158356e .elementor-widget-icon-box:hover{
  transform:translateY(-4px);
  border-color:rgba(46,196,182,.38);
  box-shadow:0 2px 6px rgba(13,27,42,.06), 0 18px 44px rgba(13,27,42,.10);
}

/* cartoes do ecossistema com a mesma altura */
body .elementor-62 .elementor-element-e8a4d6b > .e-con{ align-self:stretch; }
body .elementor-62 .elementor-element-158356e .elementor-widget-icon-box{ height:100%; }

/* icone dentro do cartao ganha respiro */
body .elementor-62 .elementor-widget-icon-box .elementor-icon{
  transition:transform .18s var(--cx-ease);
}
body .elementor-62 .elementor-widget-icon-box:hover .elementor-icon{ transform:scale(1.06); }

/* ligacoes dentro dos cartoes */
body .elementor-62 .elementor-icon-box-description a{
  transition:opacity .18s var(--cx-ease);
  text-decoration:none;
}
body .elementor-62 .elementor-icon-box-description a:hover{ opacity:.7; }

/* ---------------------------------------------------------
   5. BOTOES
   --------------------------------------------------------- */
body .elementor-62 .elementor-button{
  border-radius:999px;
  transition:transform .18s var(--cx-ease), box-shadow .18s var(--cx-ease), filter .18s var(--cx-ease);
  will-change:transform;
}
body .elementor-62 .elementor-button:hover{ transform:translateY(-2px); }

body .elementor-62 .elementor-element-c5cf9d9 .elementor-button{
  background-image:linear-gradient(135deg,#2EC4B6,#1FA69A);
  box-shadow:0 8px 24px rgba(46,196,182,.32);
}
body .elementor-62 .elementor-element-c5cf9d9 .elementor-button:hover{
  box-shadow:0 12px 34px rgba(46,196,182,.44);
  filter:brightness(1.05);
}
body .elementor-62 .elementor-element-b47d7f0 .elementor-button{
  box-shadow:0 8px 24px rgba(0,0,0,.22);
}
body .elementor-62 .elementor-element-b47d7f0 .elementor-button:hover{
  box-shadow:0 12px 32px rgba(0,0,0,.32);
}

/* botao do cabecalho (todas as paginas) */
.l-header .w-btn{
  border-radius:999px !important;
  transition:transform .18s var(--cx-ease), box-shadow .18s var(--cx-ease);
}
.l-header .w-btn:hover{ transform:translateY(-1px); box-shadow:0 8px 20px rgba(13,27,42,.22); }

/* ---------------------------------------------------------
   6. FAQ
   --------------------------------------------------------- */
body .elementor-62 .e-n-accordion-item{
  border-radius:12px;
  transition:background-color .2s var(--cx-ease), box-shadow .2s var(--cx-ease);
}
body .elementor-62 .e-n-accordion-item:hover{ background-color:#F7FBFB; }
body .elementor-62 .e-n-accordion-item[open]{
  background-color:#fff;
  box-shadow:0 6px 24px rgba(13,27,42,.08);
}
body .elementor-62 .e-n-accordion-item-title{ transition:color .18s var(--cx-ease); }

/* ---------------------------------------------------------
   7. CABECALHO EM VIDRO (todas as paginas)
   --------------------------------------------------------- */
.l-header.pos_fixed .l-subheader.at_middle{
  background-color:rgba(255,255,255,.82);
  -webkit-backdrop-filter:blur(14px) saturate(1.6);
  backdrop-filter:blur(14px) saturate(1.6);
}

/* ---------------------------------------------------------
   8. ENTRADA POR SCROLL
   --------------------------------------------------------- */
html.cx-js .elementor-62 .cx-rev{ opacity:0; transform:translateY(16px); }
html.cx-js .elementor-62 .cx-rev.cx-on{
  opacity:1; transform:none;
  transition:opacity .7s var(--cx-ease), transform .8s var(--cx-ease);
}

@media (prefers-reduced-motion:reduce){
  html.cx-js .elementor-62 .cx-rev{ opacity:1 !important; transform:none !important; }
  body .elementor-62 *, .l-header .w-btn{ transition:none !important; }
}

/* ---------------------------------------------------------
   9. REFERENCIAS LEGAIS - o cinzento claro nao se lia
   --------------------------------------------------------- */
body .elementor-62 .elementor-element-6d32e0d p,
body .elementor-62 .elementor-element-6d32e0d li,
body .elementor-62 .elementor-element-6d32e0d a{
  color:#4E5C68;
}
body .elementor-62 .elementor-element-6d32e0d a:hover{ color:#1FA69A; }

/* ---------------------------------------------------------
   10. O titulo do hero passou de h2 para h1 (SEO).
   Estas regras garantem que o aspecto nao muda.
   --------------------------------------------------------- */
body .elementor-62 .elementor-element-c5cf9d9 h1.elementor-heading-title{
  margin:0;
}