/* Login com a foto da frota em tela cheia — partials/login-foto-cheia.ejs (dono: "pode usar uma foto real, porém deixe mais novo, mais visual, mais bonito"):
   foto real da carreta Venassi ocupando a tela toda, tratada em azul-noite com o amarelo da marca brilhando;
   texto grande por cima, 3 selos de vidro embaixo e o quadro de entrar flutuando à direita. Pouca coisa mexendo. */
html .lg.lf6::before { display: none; }
.lf6-fundo { position: fixed; inset: 0; z-index: 0; pointer-events: none; overflow: hidden; background: #070D24; }
.lf6-fundo img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 22% 62%;
  filter: brightness(.62) contrast(1.12) saturate(1.05); transform-origin: 30% 60%; animation: lf6-zoom 50s ease-in-out infinite alternate; }
/* tratamento de cor: céu vira azul-noite, chão escurece, lado do quadro bem escuro para ler */
.lf6-cor { position: absolute; inset: 0;
  background: linear-gradient(180deg, rgba(10, 22, 70, .55) 0%, rgba(10, 22, 70, .15) 35%, rgba(7, 13, 36, .15) 55%, rgba(7, 13, 36, .9) 100%),
    linear-gradient(90deg, rgba(7, 13, 36, .55) 0%, rgba(7, 13, 36, .05) 30%, rgba(7, 13, 36, .35) 55%, rgba(7, 13, 36, .9) 72%, #070D24 100%); }
.lf6-cor::after { content: ""; position: absolute; inset: 0; background: linear-gradient(160deg, rgba(37, 70, 190, .35), rgba(7, 13, 36, 0) 60%); mix-blend-mode: color; }
.lf6-brilho { position: absolute; left: 8%; top: 46%; width: 34vw; height: 34vw; border-radius: 50%; transform: translate(-30%, -50%);
  background: radial-gradient(closest-side, rgba(252, 201, 42, .26), transparent); mix-blend-mode: screen; animation: lf-pisca 9s ease-in-out infinite; }
.lg.lf6 > .lf, .lg.lf6 > .lg-lado { position: relative; z-index: 1; }
.lg.lf6 .lf > :not(.lf6-fundo) { position: relative; z-index: 1; }
.lf.lf6-x, .lg.lf6 .lf { justify-content: space-between; gap: 0; padding: 40px 56px 32px; }
.lf6-meio { margin-top: auto; display: grid; gap: 14px; max-width: 640px; }
.lf6-sobre { display: inline-flex; align-items: center; gap: 10px; color: var(--lf-amarelo); font: 700 13px/1 Inter, system-ui, sans-serif; letter-spacing: 3px; text-transform: uppercase; }
.lf6-sobre::before { content: ""; width: 34px; height: 2px; background: var(--lf-amarelo); box-shadow: 0 0 10px var(--lf-amarelo); }
.lg.lf6 .lf6-slogan.lg-slogan { font-size: clamp(46px, 5.2vw, 76px); line-height: 1.02; letter-spacing: -1.6px; font-weight: 800; text-shadow: 0 4px 30px rgba(0, 0, 0, .55); }
.lf6-selos { list-style: none; margin: 34px 0 22px; padding: 0; display: flex; gap: 12px; flex-wrap: wrap; }
.lf6-selos li { display: flex; align-items: center; gap: 12px; padding: 12px 16px 12px 12px; border-radius: 16px; color: #fff;
  background: rgba(10, 18, 48, .42); border: 1px solid rgba(255, 255, 255, .14); -webkit-backdrop-filter: blur(10px) saturate(1.2); backdrop-filter: blur(10px) saturate(1.2);
  box-shadow: 0 10px 30px rgba(0, 0, 0, .25); }
.lf6-selos svg { width: 38px; height: 38px; padding: 8px; box-sizing: border-box; border-radius: 12px; background: rgba(252, 201, 42, .14);
  fill: none; stroke: var(--lf-amarelo); stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; flex: none; }
.lf6-selos span { display: grid; font: 500 12.5px/1.3 Inter, system-ui, sans-serif; color: rgba(220, 228, 250, .8); }
.lf6-selos b { font-size: 14.5px; font-weight: 700; color: #fff; }
.lg.lf6 .lf .lg-rodape { color: rgba(238, 242, 255, .6); }
/* quadro de entrar: vidro um pouco mais firme e a luz amarela correndo na borda */
.lg.lf6 .lg-cartao { background: rgba(10, 18, 48, .66); -webkit-backdrop-filter: blur(18px) saturate(1.3); backdrop-filter: blur(18px) saturate(1.3); position: relative; isolation: isolate; }
@property --lf6-ang { syntax: '<angle>'; inherits: false; initial-value: 0deg; }
.lg.lf6 .lg-cartao::after { content: ""; position: absolute; inset: -1px; border-radius: inherit; padding: 1.5px; pointer-events: none; z-index: -1;
  background: conic-gradient(from var(--lf6-ang), transparent 0 68%, rgba(252, 201, 42, .95) 82%, transparent 94%);
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite: xor; mask: linear-gradient(#000 0 0) content-box exclude, linear-gradient(#000 0 0);
  animation: lf6-borda 9s linear infinite; }
@media (min-width: 861px) { .lg.lf6 .lg-cartao > .lg-logo { display: none; } }
@keyframes lf6-zoom { from { transform: scale(1.02); } to { transform: scale(1.1); } }
@keyframes lf6-borda { to { --lf6-ang: 360deg; } }
/* celular: foto em cima com o texto por cima, quadro embaixo; nada correndo */
@media (max-width: 860px) {
  .lf6-fundo { position: absolute; inset: 0 0 auto 0; height: 380px; }
  .lf6-fundo img { object-position: 18% 60%; animation: none; }
  .lf6-cor { background: linear-gradient(180deg, rgba(10, 22, 70, .55) 0%, rgba(7, 13, 36, .1) 40%, rgba(7, 13, 36, .95) 100%); }
  .lf6-brilho { display: none; }
  .lg.lf6 .lf { padding: 16px 16px 24px; min-height: 330px; }
  .lf6-sobre { font-size: 10.5px; letter-spacing: 2px; } .lf6-sobre::before { width: 22px; }
  .lg.lf6 .lf6-slogan.lg-slogan { font-size: 30px; letter-spacing: -.6px; }
  .lf6-selos { display: none; } .lg.lf6 .lf .lg-rodape { display: none; }
  .lg.lf6 .lg-cartao { -webkit-backdrop-filter: none; backdrop-filter: none; background: rgba(12, 21, 56, .96); }
  .lg.lf6 .lg-cartao::after { display: none; }
}
@media (prefers-reduced-motion: reduce) { .lf6-fundo img, .lf6-brilho, .lg.lf6 .lg-cartao::after { animation: none !important; } }
/* ajuste: texto no céu (em cima), caminhão aparecendo inteiro no meio, selos no chão (embaixo) */
.lf6-meio { margin-top: 56px; }
.lf6-selos { margin-top: auto; }
.lg.lf6 .lf6-slogan.lg-slogan { font-size: clamp(42px, 4.4vw, 64px); }
.lf6-fundo img { filter: brightness(.78) contrast(1.1) saturate(1.1); object-position: 30% 100%; }
.lf6-cor { background:
    linear-gradient(180deg, rgba(8, 18, 60, .78) 0%, rgba(10, 22, 70, .35) 34%, rgba(7, 13, 36, 0) 52%, rgba(7, 13, 36, .2) 75%, rgba(7, 13, 36, .85) 100%),
    linear-gradient(90deg, rgba(7, 13, 36, .35) 0%, rgba(7, 13, 36, 0) 25%, rgba(7, 13, 36, .2) 50%, rgba(7, 13, 36, .85) 66%, #070D24 82%); }
.lf6-brilho { left: 6%; top: 66%; }
@media (max-width: 860px) {
  .lf6-meio { margin-top: 14px; }
  .lf6-fundo img { object-position: 10% 100%; }
  .lg.lf6 .lf { min-height: 300px; }
  .lf6-cor { background: linear-gradient(180deg, rgba(8, 18, 60, .8) 0%, rgba(10, 22, 70, .3) 42%, rgba(7, 13, 36, 0) 60%, rgba(7, 13, 36, .95) 100%); }
  .lg.lf6 .lf6-slogan.lg-slogan { font-size: 28px; }
}
@media (max-width: 860px) {
  .lg.lf6 .lf { justify-content: flex-start; min-height: 0; height: 340px; padding-top: 16px; }
  .lf6-fundo { height: 360px; }
  .lf6-fundo img { object-position: 12% 100%; }
  .lf6-meio { margin-top: 18px; gap: 8px; }
  .lf6-cor { background: linear-gradient(180deg, rgba(8, 18, 60, .85) 0%, rgba(10, 22, 70, .45) 38%, rgba(7, 13, 36, 0) 58%, rgba(7, 13, 36, .2) 80%, rgba(7, 13, 36, .95) 100%); }
}
/* ajuste das frases e das caixas (dono: "ajuste as frases e caixas de frases para ficar melhor de ver") */
.lf6-meio { position: relative; padding: 4px 0; }
.lf6-meio::before { content: ""; position: absolute; left: -56px; top: -40px; right: -40px; bottom: -40px; z-index: -1; pointer-events: none;
  background: radial-gradient(70% 70% at 30% 45%, rgba(5, 10, 32, .62), transparent 75%); }
.lf6-sobre { font-size: 14px; letter-spacing: 2.4px; color: #FDE68A; text-shadow: 0 1px 10px rgba(0, 0, 0, .7); }
.lg.lf6 .lf6-slogan.lg-slogan { color: #fff; text-shadow: 0 2px 4px rgba(0, 0, 0, .55), 0 8px 34px rgba(0, 0, 0, .65); }
.lg.lf6 .lf6-slogan .lg-amarelo { color: #FFD43B; text-shadow: 0 2px 4px rgba(0, 0, 0, .5), 0 0 26px rgba(252, 201, 42, .45); }
.lf6-selos { flex-wrap: nowrap; gap: 10px; margin-bottom: 20px; }
.lf6-selos li { flex: 1 1 0; min-width: 0; padding: 14px 16px 14px 14px; border-radius: 16px;
  background: rgba(6, 12, 34, .78); border: 1px solid rgba(252, 201, 42, .32); box-shadow: 0 12px 30px rgba(0, 0, 0, .4), inset 0 1px 0 rgba(255, 255, 255, .06); }
.lf6-selos svg { width: 42px; height: 42px; background: rgba(252, 201, 42, .18); }
.lf6-selos span { font-size: 13px; line-height: 1.35; color: #C9D3EE; }
.lf6-selos b { font-size: 15.5px; color: #fff; margin-bottom: 1px; }
.lg.lf6 .lf .lg-rodape { color: rgba(238, 242, 255, .75); text-shadow: 0 1px 6px rgba(0, 0, 0, .7); }
@media (max-width: 1180px) and (min-width: 861px) { .lf6-selos { flex-wrap: wrap; } .lf6-selos li { flex: 1 1 calc(50% - 10px); } }
@media (max-width: 860px) {
  .lf6-meio::before { left: -16px; right: -16px; top: -20px; bottom: -20px; background: radial-gradient(80% 80% at 30% 40%, rgba(5, 10, 32, .6), transparent 80%); }
  .lf6-sobre { font-size: 11.5px; letter-spacing: 1.6px; }
  .lg.lf6 .lf6-slogan.lg-slogan { font-size: 30px; line-height: 1.08; }
}
.lf6-selos { max-width: 680px; }
.lf6-selos li { gap: 10px; padding: 12px 14px 12px 12px; }
.lf6-selos svg { width: 34px; height: 34px; padding: 7px; border-radius: 10px; }
.lf6-selos b { white-space: nowrap; font-size: 14.5px; }
.lf6-selos span { font-size: 12.5px; white-space: nowrap; }
.lf6-selos { flex-wrap: wrap; }
.lf6-selos li { flex: 0 0 auto; min-width: 0; }