/* Variacao C da captacao: hero reformulado.
   Carrega DEPOIS de lp-semana.css e lp-semana-b.css. */

/* ---------- HERO: conteudo no topo, faixa colada embaixo ---------- */
.iv-hero--c{flex-direction:column;justify-content:space-between;
  padding-top:30px;padding-bottom:0}
.iv-hero--c .iv-wrap{padding-top:0}

/* ---------- DESTAQUE: colado na headline, como se fosse a primeira linha ---------- */
.iv-c-destaque{display:inline-block;margin:0 0 10px;padding:.14em .46em;
  background:var(--vermelho);color:#fefefe;font-size:1.62em;font-weight:800;
  line-height:1.24;letter-spacing:.005em}

/* ---------- HEADLINE ---------- */
.iv-hero--c h1{font-size:2.05em;line-height:1.12;margin:0 0 18px;font-weight:800}
.iv-hero--c h1 .destaque{color:var(--vermelho);font-weight:800}

/* ---------- CHAMADA (verde, igual ao botao) E DATA ---------- */
.iv-c-chamada{margin:0 0 4px;font-size:1.5em;font-weight:800;line-height:1.2;
  color:#008000}
.iv-c-evento{margin:0 0 18px;font-size:1.18em;line-height:1.45;color:var(--tinta)}
.iv-c-evento b{font-weight:700}

/* ---------- NOTA ABAIXO DO BOTAO ---------- */
.iv-c-nota{margin:2px 0 0;font-size:1.02em;font-weight:700;color:var(--vermelho);line-height:1.35}

/* ---------- FAIXA ROLANTE ---------- */
@keyframes ivRolagem{
  from{transform:translateX(0)}
  to{transform:translateX(-50%)}
}
.iv-faixa-rolante{position:relative;margin-top:36px;overflow:hidden;white-space:nowrap;
  padding:18px 0;
  background:linear-gradient(90deg,#8E1A15 0%,#E0382D 28%,#F2564A 50%,#E0382D 72%,#8E1A15 100%);
  -webkit-mask-image:linear-gradient(to right,rgba(0,0,0,0) 0%,rgba(0,0,0,1) 14%,rgba(0,0,0,1) 86%,rgba(0,0,0,0) 100%);
  mask-image:linear-gradient(to right,rgba(0,0,0,0) 0%,rgba(0,0,0,1) 14%,rgba(0,0,0,1) 86%,rgba(0,0,0,0) 100%);
  -webkit-mask-size:100% 100%;mask-size:100% 100%;
  -webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;
  -webkit-mask-position:center center;mask-position:center center}
.iv-faixa-rolante__trilho{display:inline-flex;align-items:center;
  animation:ivRolagem 34s linear infinite;will-change:transform}
.iv-faixa-rolante__trilho span{display:inline-block;padding:0 22px;
  color:#FFFFFF;font-size:1.12em;font-weight:800;letter-spacing:.04em;
  text-shadow:0 1px 2px rgba(0,0,0,.18)}
.iv-faixa-rolante__trilho span::after{content:"\00B7";margin-left:22px;opacity:.6}
.iv-faixa-rolante:hover .iv-faixa-rolante__trilho{animation-play-state:paused}

@media (prefers-reduced-motion:reduce){
  .iv-faixa-rolante{white-space:normal;-webkit-mask-image:none;mask-image:none}
  .iv-faixa-rolante__trilho{animation:none;display:flex;flex-wrap:wrap;justify-content:center}
}

/* ---------- MOBILE ---------- */
@media (max-width:1023px){
  /* a faixa do topo nao pode ser puxada para cima: cortava a logo */
  /* faixa encostada no topo: sem padding e sem margem negativa (que cortava a logo) */
  .iv-hero--c{min-height:0;padding-top:0;padding-bottom:0}
  .iv-hero--c .iv-faixa{margin-top:0;min-height:88px}
  .iv-hero--c .iv-logo{width:140px}
}
@media (max-width:767px){
  /* primeira dobra: todo o hero, ate a nota abaixo do botao */
  .iv-c-destaque{font-size:1.06em;margin-bottom:7px;padding:.16em .44em}
  .iv-hero--c h1{font-size:1.34em;line-height:1.13;margin-bottom:13px}
  .iv-c-chamada{font-size:1.12em;margin-bottom:2px}
  .iv-c-evento{font-size:.98em;margin-bottom:12px;line-height:1.35}
  .iv-c-nota{font-size:.86em;line-height:1.3}
  .iv-hero--c .iv-form{gap:8px}
  .iv-hero--c .iv-campo input[type=email],.iv-hero--c .iv-campo input[type=tel]{padding:.62em;font-size:1em}
  .iv-hero--c .iv-btn{font-size:1.08em;padding:.66em .8em;gap:8px}
  .iv-hero--c .iv-btn svg{width:20px;height:20px}
  .iv-faixa-rolante{margin-top:26px;padding:13px 0;
    -webkit-mask-image:linear-gradient(to right,rgba(0,0,0,0) 0%,rgba(0,0,0,1) 8%,rgba(0,0,0,1) 92%,rgba(0,0,0,0) 100%);
    mask-image:linear-gradient(to right,rgba(0,0,0,0) 0%,rgba(0,0,0,1) 8%,rgba(0,0,0,1) 92%,rgba(0,0,0,0) 100%)}
  .iv-faixa-rolante__trilho span{font-size:.95em;padding:0 16px}
  .iv-faixa-rolante__trilho span::after{margin-left:16px}
}