/* ==========================================================================
   LUBTECH - pele do Design System para paginas montadas no Elementor.

   Duas coisas explicam o formato das regras daqui:

   1. O Elementor poe a classe personalizada no involucro do widget, nunca no
      elemento de dentro. Por isso cada regra alcanca o filho:
      .lt-btn-primario .elementor-button, e nao .btn.
   2. O CSS do kit do Elementor carrega depois do tema e empata em
      especificidade. O prefixo .elementor desempata a nosso favor.

   No editor voce escolhe a classe em Avancado > Classes CSS.
   A lista completa esta no LEIA-ME do tema.
   ========================================================================== */

/* ---------- SECOES --------------------------------------------------------- */
.elementor .lt-secao { padding: var(--lt-sp-24) var(--lt-sp-12); }
.elementor .lt-secao > .e-con-inner { max-width: var(--lt-container); margin-inline: auto; }
.elementor .lt-secao-clara  { background-color: var(--lt-canvas-light); color: var(--lt-body-light); }
.elementor .lt-secao-fundo  { background-color: var(--lt-surface-sunken); color: var(--lt-body-light); }
.elementor .lt-secao-escura { background-color: var(--lt-ink); color: var(--lt-on-ink); }
.elementor .lt-secao-branca { background-color: var(--lt-surface-card); color: var(--lt-body-light); }
.elementor .lt-secao-baixa  { padding-block: var(--lt-sp-16); }

/* ---------- BANNER: foto, scrim e painel fume ------------------------------ */
.elementor .lt-hero {
  position: relative;
  min-height: 420px;
  padding: var(--lt-sp-16) var(--lt-sp-12);
  background-color: var(--lt-ink-deep);
  background-size: cover;
  background-position: center;
  justify-content: center;
}
.elementor .lt-hero-alto { min-height: 560px; }
.elementor .lt-hero-baixo { min-height: 380px; }
/* Enquanto nao existe foto, a textura segura o bloco em pe. Quando a imagem
   entrar pelo fundo do container, ela cobre este desenho sozinha. */
.elementor .lt-hero::before {
  content: ""; position: absolute; inset: 0; z-index: 0;
  background:
    repeating-linear-gradient(135deg, rgba(255,255,255,.03) 0 12px, transparent 12px 24px),
    var(--lt-scrim);
}
.elementor .lt-hero > .e-con-inner {
  position: relative; z-index: 1; max-width: var(--lt-container); margin-inline: auto;
}
.elementor .lt-painel {
  background-color: var(--lt-panel-smoke);
  border-radius: var(--lt-r-plate);
  padding: var(--lt-sp-12);
  box-shadow: var(--lt-shadow-panel);
  max-width: 70%;
  gap: var(--lt-sp-4);
}
.elementor .lt-painel-estreito { max-width: 62%; }

/* ---------- TIPOGRAFIA ----------------------------------------------------- */
.elementor .lt-eyebrow .elementor-heading-title {
  font-family: var(--lt-font-body); font-size: var(--lt-size-eyebrow); font-weight: 600;
  text-transform: uppercase; letter-spacing: var(--lt-track-eyebrow); color: var(--lt-muted);
}
.elementor .lt-secao-escura .lt-eyebrow .elementor-heading-title,
.elementor .lt-hero .lt-eyebrow .elementor-heading-title { color: var(--lt-primary); }

.elementor .lt-voz-amarela .elementor-heading-title,
.elementor .lt-voz-branca .elementor-heading-title,
.elementor .lt-display .elementor-heading-title {
  font-family: var(--lt-font-display); font-weight: var(--lt-weight-display);
  text-transform: uppercase; line-height: 1.08; letter-spacing: var(--lt-track-display);
  text-wrap: balance; margin: 0;
}
.elementor .lt-voz-amarela .elementor-heading-title,
.elementor .lt-voz-branca .elementor-heading-title {
  font-size: clamp(34px, 5vw, var(--lt-size-display-xl));
  letter-spacing: var(--lt-track-display-large);
}
.elementor .lt-voz-amarela .elementor-heading-title { color: var(--lt-primary); }
.elementor .lt-voz-branca .elementor-heading-title { color: var(--lt-on-ink); }
.elementor .lt-display .elementor-heading-title {
  font-size: clamp(28px, 3.4vw, var(--lt-size-display-lg)); color: inherit;
}
.elementor .lt-display-md .elementor-heading-title { font-size: clamp(24px, 2.6vw, var(--lt-size-display-md)); }
.elementor .lt-titulo-cartao .elementor-heading-title {
  font-family: var(--lt-font-body); font-size: var(--lt-size-title-lg); font-weight: 700;
  text-transform: none; letter-spacing: 0; line-height: 1.35; color: var(--lt-body-light);
}

.elementor .lt-texto .elementor-widget-container { font-size: var(--lt-size-body-md); line-height: 1.6; }
.elementor .lt-texto-apoio .elementor-widget-container {
  font-size: var(--lt-size-body-lg); line-height: 1.6; color: var(--lt-muted); max-width: 68ch;
}
.elementor .lt-secao-escura .lt-texto-apoio .elementor-widget-container,
.elementor .lt-hero .lt-texto-apoio .elementor-widget-container { color: var(--lt-on-ink-muted); }
.elementor .lt-texto-medida .elementor-widget-container { max-width: 680px; }

/* ---------- BOTOES --------------------------------------------------------- */
.elementor .lt-btn-primario .elementor-button,
.elementor .lt-btn-contorno-escuro .elementor-button,
.elementor .lt-btn-contorno-claro .elementor-button {
  min-height: 48px; padding: 15px 28px; border-radius: var(--lt-r-md);
  font-family: var(--lt-font-body); font-size: var(--lt-size-button); font-weight: 700;
  text-transform: uppercase; letter-spacing: var(--lt-track-button);
  border: 2px solid transparent; fill: currentColor;
  transition: background-color .15s ease, color .15s ease;
}
.elementor .lt-btn-primario .elementor-button { background-color: var(--lt-primary); color: var(--lt-on-primary); }
.elementor .lt-btn-primario .elementor-button:hover { background-color: var(--lt-primary-deep); color: var(--lt-on-primary); }
.elementor .lt-btn-contorno-escuro .elementor-button {
  background-color: transparent; color: var(--lt-primary); border-color: var(--lt-primary);
}
.elementor .lt-btn-contorno-escuro .elementor-button:hover { background-color: var(--lt-primary); color: var(--lt-on-primary); }
.elementor .lt-btn-contorno-claro .elementor-button {
  background-color: transparent; color: var(--lt-ink); border-color: var(--lt-ink);
}
.elementor .lt-btn-contorno-claro .elementor-button:hover { background-color: var(--lt-ink); color: var(--lt-on-ink); }

/* ---------- LISTA DE MARCAS ------------------------------------------------ */
.elementor .lt-lista .elementor-icon-list-item {
  position: relative; padding: var(--lt-sp-3) 0 var(--lt-sp-3) var(--lt-sp-8);
  border-bottom: 1px solid var(--lt-hairline-light); font-size: var(--lt-size-body-md);
}
.elementor .lt-lista .elementor-icon-list-item::before {
  content: ""; position: absolute; left: 0; top: 22px; width: 18px; height: 3px; background: var(--lt-primary);
}
.elementor .lt-lista .elementor-icon-list-icon { display: none; }
.elementor .lt-secao-escura .lt-lista .elementor-icon-list-item { border-color: var(--lt-ink-hairline); }

/* ---------- CARTOES E BARRAS ----------------------------------------------- */
.elementor .lt-cartao {
  background-color: var(--lt-surface-card); border-radius: var(--lt-r-lg);
  padding: var(--lt-sp-6); box-shadow: var(--lt-shadow-card); color: var(--lt-body-light);
  gap: var(--lt-sp-3);
}
.elementor .lt-cartao-destaque {
  border-radius: var(--lt-r-lg); padding: var(--lt-sp-12); margin-bottom: var(--lt-sp-6);
  gap: var(--lt-sp-3);
}
.elementor .lt-barra-secao {
  background-color: var(--lt-ink-raised); border-radius: var(--lt-r-xs); padding: 12px var(--lt-sp-5);
}
.elementor .lt-barra-secao .elementor-heading-title {
  font-family: var(--lt-font-body); font-size: var(--lt-size-bar-label); font-weight: 700;
  text-transform: uppercase; letter-spacing: .04em; color: var(--lt-primary);
}
.elementor .lt-foto-apoio img { border-radius: var(--lt-r-lg); }

/* ---------- ARRANJOS ------------------------------------------------------- */
.elementor .lt-centro { text-align: center; }
.elementor .lt-centro .lt-texto-apoio .elementor-widget-container { margin-inline: auto; }
.elementor .lt-centro > .e-con-inner { align-items: center; }
.elementor .lt-centro.lt-linha-botoes { justify-content: center; }
.elementor .lt-cabecalho { gap: var(--lt-sp-3); margin-bottom: var(--lt-sp-12); }
.elementor .lt-linha-botoes {
  flex-direction: row; flex-wrap: wrap; gap: var(--lt-sp-3); align-items: center; width: 100%;
}
.elementor .lt-grade-3 {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--lt-sp-6); align-items: stretch; width: 100%;
}
.elementor .lt-duas-colunas > .e-con-inner {
  display: grid; grid-template-columns: 45fr 55fr; gap: var(--lt-sp-12); align-items: start;
}
.elementor .lt-inverte > .e-con-inner { grid-template-columns: 55fr 45fr; }

@media (max-width: 1024px) {
  .elementor .lt-secao { padding-inline: var(--lt-sp-6); }
  .elementor .lt-hero { padding-inline: var(--lt-sp-6); }
  .elementor .lt-painel, .elementor .lt-painel-estreito { max-width: 90%; }
  .elementor .lt-grade-3 { grid-template-columns: repeat(2, 1fr); }
  .elementor .lt-duas-colunas > .e-con-inner,
  .elementor .lt-inverte > .e-con-inner { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
  .elementor .lt-secao { padding-block: var(--lt-sp-16); }
  .elementor .lt-painel, .elementor .lt-painel-estreito {
    max-width: 100%; background-color: var(--lt-ink); padding: var(--lt-sp-6);
  }
  .elementor .lt-grade-3 { grid-template-columns: 1fr; }
  .elementor .lt-btn-primario .elementor-button,
  .elementor .lt-btn-contorno-escuro .elementor-button,
  .elementor .lt-btn-contorno-claro .elementor-button { width: 100%; }
}

/* Com foto no fundo, o hero fica só com o scrim: a trama diagonal existia
   para segurar o bloco enquanto não havia imagem. */
.elementor .lt-hero-foto::before { background: var(--lt-scrim); }

/* o cartão de serviço principal com foto vira duas colunas */
/* o container é boxed: quem recebe a grade é o .e-con-inner, não o container */
.elementor .lt-cartao-destaque:has(.lt-foto-destaque) > .e-con-inner {
  display: grid; grid-template-columns: 42% 1fr; gap: var(--lt-sp-8); align-items: center;
}
.elementor .lt-foto-destaque { grid-row: span 3; }
.elementor .lt-foto-destaque img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 10px; display: block; }
@media (max-width: 767px) {
  .elementor .lt-cartao-destaque:has(.lt-foto-destaque) > .e-con-inner { grid-template-columns: 1fr; }
  .elementor .lt-foto-destaque { grid-row: auto; }
}
