/* ============================================================
   SEÇÃO · faixa (gloda.cloud / gloda.store)
   Convertido de gloda-home.html. Escopo .lp-root.
   ============================================================ */
/* ============================================================
   5 · FAIXAS — 130px medido
   ============================================================ */
.lp-root .strip{border-radius:var(--radius-lg);overflow:hidden;position:relative;isolation:isolate;}
.lp-root .strip-in{
  display:flex;align-items:center;gap:var(--space-24);
  padding:var(--space-20) var(--space-32);min-height:130px;position:relative;z-index:2;
}
.lp-root .strip-title{
  font-size:var(--fs-h3);font-weight:600;line-height:1.2;letter-spacing:var(--ls-apoio);
  color:var(--paper);flex:1 1 auto;min-width:0;
}
/* palavras em degradê (tituloHtml com <span class="grad">): cores do pôr do sol do hero */
.lp-root .strip-title .grad{
  background:linear-gradient(90deg,#fe915a 0%,#e99fa4 45%,#c18ebf 75%,#9b79bb 100%);
  -webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent;color:transparent;
}
.lp-root .strip-title u{text-decoration:none;border-bottom:1.5px solid rgba(255,255,255,.55);padding-bottom:2px;}
.lp-root .strip-sub{
  font-size:var(--fs-sm);line-height:1.55;color:rgba(255,255,255,.75);
  flex:0 1 280px;min-width:0;text-align:right;
}
/* faixa gloda.cloud: chapada */
.lp-root .strip-cloud{background:var(--navy-900);}
/* faixa gloda.store: horizontal 90°, 9 stops medidos */
.lp-root .strip-store{
  background:linear-gradient(90deg,
    #012b7a 0%, #01369b 12%, #0042bc 25%, #004ddd 37%, #015aff 50%,
    #1d6cff 62%, #397eff 75%, #5591ff 87%, #71a3ff 100%);
}
/* faixa gloda.shop: roxo → laranja, laranja chapado a partir da metade (medido no print) */
.lp-root .strip-shop{
  background:linear-gradient(90deg,#8414dc 0%,#9a22c0 16%,#b8347f 30%,#d64530 42%,#e84e0a 52%,#e84e0a 100%);
}
/* faixa Gloda Wear: vermelho chapado, medido no Figma 249:211 (23/09/2026) */
.lp-root .strip-wear{background:#d22d2d;}
@media (max-width:768px){
  .lp-root .strip-in{flex-wrap:wrap;gap:var(--space-16);padding:var(--space-24) var(--space-20);min-height:0;}
  .lp-root .strip-title{flex:1 1 100%;}
  .lp-root .strip-sub{flex:1 1 auto;text-align:left;}
  .lp-root .btn-round{width:56px;height:56px;min-width:56px;}
}

/* Home V2 (24/09/2026): no celular a bolinha com a seta some e a faixa INTEIRA vira o link
   (o <a> continua lá, invisível, cobrindo a faixa — o toque em qualquer ponto abre o domínio). */
@media (max-width:768px){
  .lp-root.lp-root--compacto .strip .btn-round{
    position:absolute;inset:0;z-index:3;width:auto;height:auto;min-width:0;border-radius:0;
    opacity:0;transform:none!important;
  }
}

/* faixa cromática (MagicProducts, 19/10/2026, doc 18/10 item 07): vermelho → laranja → amarelo → creme, estático.
   Título, seta e sublinhado brancos; apoio à direita em preto; botão redondo branco com seta escura. */
.lp-root .strip-cromatica{background:linear-gradient(90deg,#ff4a3d 0%,#ff7a1a 33%,#ffd84a 66%,#f8f6de 100%);}
.lp-root .strip-cromatica .strip-sub{color:#000;}
.lp-root .strip-cromatica .strip-title u{border-bottom-color:rgba(255,255,255,.8);}
/* faixa embutida no topo de um carrossel (19/10/2026): cantos só em cima; o destaque é o link do domínio */
.lp-root .strip--embutida{border-radius:var(--radius-lg) var(--radius-lg) 0 0;}
.lp-root .strip-link{color:inherit;text-decoration:none;white-space:nowrap;}
.lp-root .strip-link:hover u{border-bottom-color:#fff;}
.lp-root .strip-link:focus-visible{outline:2px solid #fff;outline-offset:3px;border-radius:4px;}
@media (max-width:768px){
  /* o botão continua visível (avança o slide); a regra do ritmo compacto que transformava a faixa inteira em link não vale aqui */
  .lp-root.lp-root--compacto .strip--embutida .btn-round{position:static;width:48px;height:48px;min-width:48px;border-radius:50%;opacity:1;}
  .lp-root .strip--embutida .strip-in{flex-wrap:wrap;align-items:center;row-gap:var(--space-8);}
  .lp-root .strip--embutida .strip-title{flex:1 1 0;order:1;}
  .lp-root .strip--embutida .btn-round{order:2;}
  .lp-root .strip--embutida .strip-sub{order:3;flex:1 1 100%;text-align:left;}
}