/* Banners promocionais do carrossel principal (VPS / ChatBot) — v5
   Layout: texto à esquerda, foto em faixa diagonal ocupando toda a lateral direita. */

.promo-banner{
  --pb-navy:#001871;
  --pb-blue:#4c8dff;
  --pb-sky:#7fb1ff;
  position:relative;
  display:flex;
  align-items:center;
  width:100%;
  aspect-ratio:1680/500;
  min-height:400px;
  padding:0 6vw;
  overflow:hidden;
  background:
    radial-gradient(rgba(255,255,255,.09) 1.2px, rgba(255,255,255,0) 1.7px) 0 0/28px 28px,
    radial-gradient(60% 90% at 78% 50%, rgba(76,141,255,.28) 0%, rgba(76,141,255,0) 70%),
    linear-gradient(120deg,#001363 0%,#001d85 55%,#0030b8 100%);
  text-decoration:none;
}
.promo-banner:hover{ text-decoration:none; }

/* anéis decorativos (mesma linguagem dos banners de imagem) */
.promo-banner::before,
.promo-banner::after{
  content:"";
  position:absolute;
  border-radius:50%;
  border:2px solid rgba(255,255,255,.08);
  pointer-events:none;
}
.promo-banner::before{ width:340px; height:340px; left:-150px; bottom:-170px; }
.promo-banner::after{ width:200px; height:200px; left:38%; top:-100px; border-color:rgba(76,141,255,.22); }
.promo-banner .pb-ring{ display:none; }

.promo-banner-content{
  position:relative; z-index:3;
  display:flex; align-items:center; width:100%;
  max-width:1360px; margin:0 auto;
}
.promo-banner-text{ flex:0 1 46%; min-width:0; padding-bottom:18px; }

.promo-banner-eyebrow{
  display:inline-flex; align-items:center; gap:10px;
  font-family:Intelo,sans-serif; font-weight:700; font-size:13px;
  letter-spacing:.08em; text-transform:uppercase; color:var(--pb-sky); margin-bottom:12px;
}
.promo-banner-cross{ width:30px; height:30px; flex:none; position:relative; }
.promo-banner-cross::before,
.promo-banner-cross::after{
  content:""; position:absolute; background:transparent; border:2px solid var(--pb-blue);
}
.promo-banner-cross::before{ left:10px; top:0; width:10px; height:30px; }
.promo-banner-cross::after{ left:0; top:10px; width:30px; height:10px; }

.promo-banner-title{
  font-family:Intelo,sans-serif; font-weight:800; color:#fff;
  font-size:clamp(32px,4.6vw,62px); line-height:1.02; letter-spacing:-.01em; margin:0 0 16px;
}
.promo-banner-title span{ display:block; }
.promo-banner-title span:last-child{ color:#5aa3ff; }

.promo-banner-desc{
  font-family:Intelo,sans-serif; font-weight:500; color:#c6d6f7;
  font-size:clamp(14px,1.3vw,18px); line-height:1.5; margin:0 0 26px; max-width:560px;
}
.promo-banner-desc b{ color:#fff; font-weight:800; }

.promo-banner-cta{
  display:inline-flex; align-items:center; gap:10px;
  background:#fff; color:#001871!important; font-family:Intelo,sans-serif; font-weight:800;
  font-size:16px; padding:15px 30px; border-radius:999px;
  box-shadow:0 10px 26px rgba(0,8,40,.35);
  transition:transform .18s ease, background .18s ease, box-shadow .18s ease;
}
.promo-banner-cta svg{ transition:transform .18s ease; }
.promo-banner:hover .promo-banner-cta{ background:#e4eeff; transform:translateY(-2px); box-shadow:0 14px 30px rgba(0,8,40,.45); }
.promo-banner:hover .promo-banner-cta svg{ transform:translateX(4px); }

/* ---------- arte: faixa diagonal com a foto ---------- */
.promo-banner-art{
  position:absolute; z-index:1; top:0; right:0; bottom:0; width:54%;
}
/* faixa clara atrás da foto, dá profundidade ao corte diagonal */
.promo-banner-art::before{
  content:""; position:absolute; inset:0;
  background:linear-gradient(160deg,rgba(127,177,255,.55),rgba(76,141,255,.15));
  clip-path:polygon(calc(20% - 26px) 0,100% 0,100% 100%,calc(0% - 26px) 100%);
}
.promo-banner-avatar{
  position:absolute; inset:0; display:block;
  clip-path:polygon(20% 0,100% 0,100% 100%,0 100%);
  background:#00204f;
}
.promo-banner-photo{
  width:100%; height:100%; display:block; object-fit:cover; object-position:50% 14%;
}
.photo--rack{ object-position:40% 50%; }
.photo--phone{ object-position:50% 58%; }
.promo-banner-photo.duotone{ object-position:50% 22%; filter:grayscale(1) contrast(1.1) brightness(.96); }
.promo-banner-duotone-overlay{
  position:absolute; inset:0; mix-blend-mode:color; pointer-events:none;
  background:linear-gradient(165deg,#00133d 8%,#4c8dff 100%);
}
/* tinge a foto com o azul da marca para casar com o fundo */
.promo-banner-avatar::before{
  content:""; position:absolute; inset:0; z-index:1; pointer-events:none;
  mix-blend-mode:soft-light; opacity:.95;
  background:linear-gradient(160deg,#5b9bff 0%,#0a3bd0 100%);
}
.promo-banner-avatar:has(.duotone)::before{ opacity:.45; }
.promo-banner-avatar:has(.photo--rack)::before{ opacity:.3; }
/* esfumaça o encontro da foto com o fundo azul e escurece a base */
.promo-banner-avatar::after{
  content:""; position:absolute; inset:0; z-index:2; pointer-events:none;
  background:
    linear-gradient(90deg,rgba(0,24,113,.85) 0%,rgba(0,24,113,0) 38%),
    linear-gradient(0deg,rgba(0,12,60,.55) 0%,rgba(0,12,60,0) 32%);
}

/* recortes (pessoas dos banners): a imagem fica na altura total, com bordas esmaecidas no fundo azul */
.promo-banner-avatar.is-cutout{ background:var(--pb-bg,#132667); }
.promo-banner-avatar.is-cutout::before{ display:none; }
.promo-banner-avatar.is-cutout::after{
  background:linear-gradient(90deg,rgba(0,24,113,.9) 0%,rgba(0,24,113,0) 32%);
}
.is-cutout .promo-banner-photo{
  position:absolute; top:0; right:6%; width:auto; height:100%; max-width:none; object-fit:fill;
  -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 9%,#000 91%,transparent 100%);
          mask-image:linear-gradient(90deg,transparent 0,#000 9%,#000 91%,transparent 100%);
}

/* chips de destaque sobre a foto */
.promo-banner-chips{
  position:absolute; z-index:4; inset:0; list-style:none; margin:0; padding:0; pointer-events:none;
}
.promo-banner-chip{
  position:absolute;
  display:inline-flex; align-items:center; gap:10px;
  padding:10px 16px 10px 10px; border-radius:16px;
  background:rgba(8,26,96,.55);
  -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px);
  border:1px solid rgba(255,255,255,.28);
  box-shadow:0 12px 28px rgba(0,8,40,.35);
  font-family:Intelo,sans-serif; font-weight:700; font-size:14px; line-height:1.15; color:#fff;
  animation:pb-float 6s ease-in-out infinite;
}
.promo-banner-chip small{ display:block; font-weight:500; font-size:11.5px; color:#b9cdf5; }
.promo-banner-chip i{
  flex:none; width:34px; height:34px; border-radius:10px;
  display:flex; align-items:center; justify-content:center;
  background:linear-gradient(150deg,#4c8dff,#145fd1);
}
.promo-banner-chip i svg{ width:18px; height:18px; stroke:#fff; fill:none; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
.promo-banner-chip.chip--tl{ top:12%; left:19%; }
.promo-banner-chip.chip--tr{ top:10%; right:8%; }
.promo-banner-chip.chip--b{ bottom:9%; left:12%; animation-delay:-5s; }
.promo-banner-chip.chip--erp{ top:11%; left:17%; animation-delay:-1s; }
.promo-banner-chip.chip--r{ top:38%; right:14%; animation-delay:-3s; }
.chips--left .chip--r{ right:auto; left:15%; top:41%; animation-delay:-3s; }
@keyframes pb-float{ 0%,100%{ transform:translateY(0);} 50%{ transform:translateY(-7px);} }
@media (prefers-reduced-motion:reduce){ .promo-banner-chip{ animation:none; } }

/* informações extras do slide VPS: linha de especificações e preço */
.promo-banner-specs{ list-style:none; margin:-8px 0 18px; padding:0; display:flex; flex-wrap:wrap; gap:8px; }
.promo-banner-specs li{
  padding:6px 11px; border-radius:999px; font-family:Intelo,sans-serif; font-weight:700; font-size:12px; white-space:nowrap;
  color:#dbe7ff; background:rgba(255,255,255,.09); border:1px solid rgba(255,255,255,.2);
}
.promo-banner-specs li::before{ content:"\2713"; margin-right:6px; color:#5aa3ff; font-weight:800; }
.promo-banner-cta-row{ display:flex; align-items:center; flex-wrap:wrap; gap:14px 22px; }
.promo-banner-from{ font-family:Intelo,sans-serif; font-weight:500; font-size:13px; line-height:1.1; color:#9fc4ff; }
.promo-banner-from b{ display:inline-block; margin-left:4px; font-size:30px; font-weight:800; letter-spacing:-.02em; color:#fff; }
.promo-banner-from small{ font-size:13px; color:#c6d6f7; }

/* slide de promoção do VPS: cards dos planos */
.promo-banner-plan{
  position:absolute; width:min(210px,38%); padding:14px 18px 15px; border-radius:18px;
  display:flex; flex-direction:column; gap:1px;
  background:linear-gradient(160deg,rgba(24,56,150,.78),rgba(6,22,88,.78));
  -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px);
  border:1px solid rgba(255,255,255,.28); box-shadow:0 16px 34px rgba(0,8,40,.45);
  font-family:Intelo,sans-serif; color:#fff; animation:pb-float 6s ease-in-out infinite;
}
.promo-banner-plan small{ font-size:11px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:#9fc4ff; }
.promo-banner-plan b{ font-size:34px; font-weight:800; line-height:1.05; letter-spacing:-.02em; }
.promo-banner-plan span{ font-size:12.5px; font-weight:500; color:#c6d6f7; }
.promo-banner-plan em{
  position:absolute; top:-11px; right:14px; padding:4px 11px; border-radius:99px;
  font-style:normal; font-size:11.5px; font-weight:800; letter-spacing:.03em; color:#04331f;
  background:linear-gradient(150deg,#7dffc0,#4be1a0); box-shadow:0 6px 14px rgba(0,30,20,.4);
}
.plan--a{ left:14%; top:34%; }
.plan--b{ left:47%; top:54%; animation-delay:-3s; }

/* card de terminal (VPS) */
.promo-banner-term{
  position:absolute; left:11%; bottom:9%; width:min(290px,52%);
  border-radius:14px; overflow:hidden;
  background:rgba(4,14,52,.82);
  -webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px);
  border:1px solid rgba(255,255,255,.22); box-shadow:0 16px 34px rgba(0,8,40,.5);
  font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace; color:#dbe7ff;
}
.promo-banner-term-bar{ display:flex; align-items:center; gap:6px; padding:9px 12px; background:rgba(255,255,255,.08); font-size:11px; color:#9db8ee; }
.promo-banner-term-bar b{ width:9px; height:9px; border-radius:50%; background:#ff6b6b; }
.promo-banner-term-bar b:nth-child(2){ background:#ffc857; }
.promo-banner-term-bar b:nth-child(3){ background:#4be1a0; }
.promo-banner-term-bar span{ margin-left:6px; }
.promo-banner-term-body{ padding:10px 14px 12px; font-size:12.5px; line-height:1.7; }
.promo-banner-term-body p{ margin:0; white-space:nowrap; }
.promo-banner-term-body em{ font-style:normal; color:#5aa3ff; margin-right:4px; }
.promo-banner-term-body .ok{ color:#7dffc0; }
.promo-banner-term-body .ok u{ display:inline-block; width:8px; height:8px; margin-right:8px; border-radius:50%; background:#4be1a0; box-shadow:0 0 0 4px rgba(75,225,160,.25); text-decoration:none; }
.promo-banner-term-body .cur i{ display:inline-block; width:8px; height:14px; vertical-align:-2px; background:#dbe7ff; animation:pb-blink 1s steps(1) infinite; }
@keyframes pb-blink{ 50%{ opacity:0; } }

/* conversa de WhatsApp (ChatBot) */
.promo-banner-bubble{
  position:absolute; max-width:230px; padding:11px 15px; border-radius:18px;
  font-family:Intelo,sans-serif; font-weight:500; font-size:14px; line-height:1.35;
  box-shadow:0 12px 26px rgba(0,8,40,.38);
}
.promo-banner-bubble b{ display:block; margin-bottom:3px; font-size:11.5px; font-weight:800; letter-spacing:.02em; color:#9fc4ff; }
.bubble--user{ left:19%; top:32%; background:#fff; color:#0b1f5c; border-bottom-left-radius:5px; }
.bubble--bot{ left:12%; bottom:22%; background:linear-gradient(150deg,#1a5df0,#0a3bd0); color:#fff; border-bottom-left-radius:5px; border:1px solid rgba(255,255,255,.25); }
.bubble--typing{ left:12%; bottom:9%; display:flex; gap:5px; padding:11px 14px; background:rgba(255,255,255,.95); border-bottom-left-radius:5px; }
.bubble--typing i{ width:7px; height:7px; border-radius:50%; background:#7d93c9; animation:pb-dot 1.2s ease-in-out infinite; }
.bubble--typing i:nth-child(2){ animation-delay:.15s; }
.bubble--typing i:nth-child(3){ animation-delay:.3s; }
@keyframes pb-dot{ 0%,60%,100%{ transform:translateY(0); opacity:.5; } 30%{ transform:translateY(-4px); opacity:1; } }
@keyframes pb-pop{ from{ opacity:0; transform:translateY(14px) scale(.92); } to{ opacity:1; transform:none; } }
.carousel-item.active .promo-banner-bubble,
.carousel-item.active .promo-banner-term{ animation:pb-pop .5s cubic-bezier(.2,.8,.2,1) both; }
.carousel-item.active .bubble--user{ animation-delay:.7s; }
.carousel-item.active .bubble--bot{ animation-delay:1.5s; }
.carousel-item.active .bubble--typing{ animation-delay:2.2s; }
.carousel-item.active .promo-banner-term{ animation-delay:.9s; }

/* ---------- entrada animada (só no slide ativo) ---------- */
@keyframes pb-rise{ from{ opacity:0; transform:translateY(18px);} to{ opacity:1; transform:none;} }
@keyframes pb-slide{ from{ opacity:0; transform:translateX(48px);} to{ opacity:1; transform:none;} }
@keyframes pb-fade{ from{ opacity:0;} to{ opacity:1;} }
.carousel-item.active .promo-banner-text > *{ animation:pb-rise .7s cubic-bezier(.2,.7,.2,1) both; }
.carousel-item.active .promo-banner-text > :nth-child(2){ animation-delay:.08s; }
.carousel-item.active .promo-banner-text > :nth-child(3){ animation-delay:.16s; }
.carousel-item.active .promo-banner-text > :nth-child(4){ animation-delay:.24s; }
.carousel-item.active .promo-banner-avatar{ animation:pb-slide .85s cubic-bezier(.2,.7,.2,1) both; }
.carousel-item.active .promo-banner-chips{ animation:pb-fade .8s .55s both; }
@media (prefers-reduced-motion:reduce){
  .carousel-item.active .promo-banner-text > *,
  .carousel-item.active .promo-banner-avatar,
  .carousel-item.active .promo-banner-chips,
  .carousel-item.active .promo-banner-bubble,
  .carousel-item.active .promo-banner-term,
  .promo-banner-plan,
  .promo-banner-term-body .cur i,
  .bubble--typing i{ animation:none; }
}

/* mantém os z-index internos do carrossel dentro dele (senão passam por cima de botões fixos, ex.: WhatsApp flutuante) */
.promo-carousel{ isolation:isolate; }

/* ---------- controles do carrossel (todos os slides) ---------- */
.promo-carousel .carousel-control-prev,
.promo-carousel .carousel-control-next{
  width:46px; height:46px; top:50%; bottom:auto; margin-top:-23px;
  border-radius:50%; opacity:1;
  background:rgba(0,16,70,.5);
  -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px);
  border:1px solid rgba(255,255,255,.3);
  transition:background .18s ease, transform .18s ease;
  z-index:10;
}
.promo-carousel .carousel-control-prev{ left:18px; }
.promo-carousel .carousel-control-next{ right:18px; }
.promo-carousel .carousel-control-prev:hover,
.promo-carousel .carousel-control-next:hover{ background:rgba(0,16,70,.85); transform:scale(1.06); }
.promo-carousel .carousel-control-prev-icon,
.promo-carousel .carousel-control-next-icon{ width:18px; height:18px; }

/* indicadores (bolinhas) */
.promo-carousel .carousel-indicators{
  z-index:10; bottom:16px; margin:0; align-items:center;
}
.promo-carousel .carousel-indicators li{
  flex:none; box-sizing:border-box; width:9px; height:9px; margin:0 5px; padding:0;
  border:0; border-radius:99px; background:rgba(255,255,255,.45);
  text-indent:-999px; transition:width .25s ease, background .25s ease;
}
.promo-carousel .carousel-indicators li.active{ width:30px; background:#fff; }

/* ---------- mobile ---------- */
@media (max-width:750px){
  /* altura livre: todo o texto aparece; min-height igual em todos os slides evita o carrossel "pular" */
  .promo-banner{ aspect-ratio:auto; min-height:350px; padding:24px 0 38px 18px; }
  .promo-banner-content{ align-items:center; }
  .promo-banner-text{ flex:0 0 62%; padding:0; position:relative; z-index:4; }
  .promo-banner-eyebrow{ font-size:10.5px; margin-bottom:6px; gap:7px; }
  .promo-banner-cross{ width:18px; height:18px; }
  .promo-banner-cross::before{ left:6px; width:6px; height:18px; }
  .promo-banner-cross::after{ top:6px; width:18px; height:6px; }
  .promo-banner-title{ font-size:clamp(22px,6.6vw,30px); line-height:1.05; margin-bottom:8px; }
  .promo-banner-desc{ display:block; font-size:12.5px; line-height:1.4; margin:0 0 10px; max-width:none; }
  .promo-banner-specs{ display:flex; margin:0 0 10px; gap:6px; }
  .promo-banner-specs li{ padding:4px 8px; font-size:10.5px; }
  .promo-banner-specs li::before{ margin-right:4px; }
  .promo-banner-specs li:nth-child(n+3){ display:none; }
  .promo-banner-cta-row{ flex-direction:column; align-items:flex-start; gap:8px; }
  .promo-banner-from{ order:-1; font-size:11.5px; }
  .promo-banner-from b{ font-size:22px; margin-left:3px; }
  .promo-banner-cta{ padding:10px 18px; font-size:13.5px; }
  .promo-banner-art{ width:44%; }
  .promo-banner-art::before{ clip-path:polygon(calc(30% - 14px) 0,100% 0,100% 100%,calc(0% - 14px) 100%); }
  .promo-banner-avatar{ clip-path:polygon(30% 0,100% 0,100% 100%,0 100%); }
  .promo-banner-chips{ display:none; }
  /* recortes de pessoas: altura fixa (não esticam com o banner), presos à base */
  .is-cutout .promo-banner-photo{ top:auto; bottom:0; height:calc(250px * var(--pb-mh,1)); left:58%; right:auto; transform:translateX(calc(-50% + var(--pb-x,0px))); }
  /* suaviza o topo do recorte (senão aparece a borda da foto) */
  .is-cutout .promo-banner-photo{
    -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 9%,#000 91%,transparent 100%),linear-gradient(180deg,transparent 0,#000 16%);
    -webkit-mask-composite:source-in;
            mask-image:linear-gradient(90deg,transparent 0,#000 9%,#000 91%,transparent 100%),linear-gradient(180deg,transparent 0,#000 16%);
            mask-composite:intersect;
  }
  /* slides com pessoa: coluna de texto mais estreita para não cobrir o rosto */
  .promo-banner:has(.is-cutout) .promo-banner-text{ flex-basis:55%; }
  .promo-banner:has(.is-cutout) .promo-banner-cta{ padding:10px 16px; font-size:13px; }
  .promo-banner::before{ width:200px; height:200px; left:-100px; bottom:-110px; }
  .promo-banner::after{ display:none; }
  .promo-carousel .carousel-indicators{ bottom:10px; }
  .promo-carousel .carousel-indicators li{ width:7px; height:7px; margin:0 4px; }
  .promo-carousel .carousel-indicators li.active{ width:22px; }
}

/* setas escondidas em telas estreitas: cobririam o texto; ficam bolinhas + swipe */
@media (max-width:1000px){
  .promo-carousel .carousel-control-prev,
  .promo-carousel .carousel-control-next{ display:none; }
}

/* telas médias: chips menores para não cobrir o rosto */
@media (min-width:751px) and (max-width:1100px){
  .chips--left{ display:none; }
  .promo-banner-plan{ display:none; }
  .promo-banner-specs{ display:none; }
  .chip--erp{ display:none; }
  .promo-banner-chip.chip--r,
  .bubble--user{ display:none; }
  .promo-banner-chip{ font-size:13px; }
}

/* notebooks: sem espaço para 4 pílulas na mesma linha */
@media (min-width:1101px) and (max-width:1400px){
  .promo-banner-specs li:nth-child(4){ display:none; }
}
@media (min-width:1101px) and (max-width:1200px){
  .promo-banner-specs{ display:none; }
}

/* ---------- SUPER BANNER (slide de abertura): resumo das soluções em 4 cards ---------- */
.promo-banner.is-super .promo-banner-content{ pointer-events:none; }
.promo-banner.is-super .promo-banner-text{ pointer-events:auto; flex:0 1 42%; }
.is-super .promo-banner-title{ font-size:clamp(30px,4vw,58px); }
.is-super .promo-banner-desc{ max-width:520px; }
.is-super .promo-banner-avatar::before{ opacity:.3; }
.is-super .promo-banner-avatar::after{
  background:
    linear-gradient(90deg,rgba(0,24,113,.92) 0%,rgba(0,24,113,.35) 48%,rgba(0,24,113,.45) 100%),
    linear-gradient(0deg,rgba(0,12,60,.6) 0%,rgba(0,12,60,0) 40%);
}

.pb-cards{
  position:absolute; z-index:5; right:max(76px,4%); top:50%; transform:translateY(-50%);
  width:min(600px,50%); margin:0; padding:0; list-style:none;
  display:grid; grid-template-columns:1fr 1fr; gap:14px;
}
.pb-cards li{ display:flex; }
.pb-card{
  position:relative; flex:1; display:flex; flex-direction:column; gap:5px;
  padding:16px 16px 14px; border-radius:18px;
  background:linear-gradient(160deg,rgba(24,56,150,.78),rgba(6,22,88,.78));
  -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px);
  border:1px solid rgba(255,255,255,.28); box-shadow:0 14px 30px rgba(0,8,40,.4);
  font-family:Intelo,sans-serif; color:#fff!important; text-decoration:none!important;
  transition:transform .18s ease, border-color .18s ease, background .18s ease, box-shadow .18s ease;
}
.pb-card:hover{
  transform:translateY(-4px); border-color:rgba(127,177,255,.85);
  background:linear-gradient(160deg,rgba(38,82,190,.88),rgba(10,34,120,.88)); box-shadow:0 20px 38px rgba(0,8,40,.5);
}
.pb-card i{
  flex:none; width:38px; height:38px; margin-bottom:4px; border-radius:11px;
  display:flex; align-items:center; justify-content:center;
  background:linear-gradient(150deg,#4c8dff,#145FD1);
}
.pb-card i svg{ width:20px; height:20px; stroke:#fff; fill:none; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
.pb-card b{ font-size:18px; font-weight:800; line-height:1.15; letter-spacing:-.01em; }
.pb-card small{ font-size:12.5px; font-weight:500; line-height:1.35; color:#c6d6f7; }
.pb-card-go{
  margin-top:auto; padding-top:8px; display:inline-flex; align-items:center; gap:6px;
  font-size:12.5px; font-weight:800; color:#7fb1ff; transition:gap .18s ease, color .18s ease;
}
.pb-card-go svg{ width:14px; height:14px; stroke:currentColor; fill:none; stroke-width:2.5; stroke-linecap:round; stroke-linejoin:round; }
.pb-card:hover .pb-card-go{ gap:10px; color:#fff; }
.pb-card em{
  position:absolute; top:-11px; right:12px; padding:4px 11px; border-radius:99px;
  font-style:normal; font-family:Intelo,sans-serif; font-size:11.5px; font-weight:800; letter-spacing:.02em; color:#04331f;
  background:linear-gradient(150deg,#7dffc0,#4be1a0); box-shadow:0 6px 14px rgba(0,30,20,.4); white-space:nowrap;
}
.carousel-item.active .pb-card{ animation:pb-pop .6s cubic-bezier(.2,.8,.2,1) both; }
.carousel-item.active .pb-cards li:nth-child(1) .pb-card{ animation-delay:.45s; }
.carousel-item.active .pb-cards li:nth-child(2) .pb-card{ animation-delay:.55s; }
.carousel-item.active .pb-cards li:nth-child(3) .pb-card{ animation-delay:.65s; }
.carousel-item.active .pb-cards li:nth-child(4) .pb-card{ animation-delay:.75s; }
@media (prefers-reduced-motion:reduce){ .carousel-item.active .pb-card{ animation:none; } .pb-card, .pb-card-go{ transition:none; } }

/* notebooks e tablets: cards um pouco menores */
@media (min-width:751px) and (max-width:1400px){
  .pb-cards{ width:min(560px,49%); gap:12px; }
  .pb-card{ padding:14px 14px 12px; }
  .pb-card b{ font-size:16.5px; }
  .pb-card small{ font-size:12px; }
}
@media (min-width:751px) and (max-width:1100px){
  .pb-cards{ right:max(76px,3%); width:min(520px,47%); gap:10px; }
  .pb-card{ padding:12px 12px 10px; border-radius:15px; }
  .pb-card i{ width:32px; height:32px; }
  .pb-card b{ font-size:15px; }
  .pb-card small{ font-size:11.5px; }
  .pb-card-go{ font-size:11.5px; padding-top:6px; }
  .pb-card em{ font-size:10.5px; padding:3px 9px; right:10px; }
}

/* celular: texto em cima e cards 2x2 embaixo (altura livre, nada é escondido) */
@media (max-width:750px){
  .promo-banner.is-super{ flex-direction:column; align-items:stretch; justify-content:flex-start; min-height:0; padding:26px 18px 44px; }
  .promo-banner.is-super .promo-banner-content{ pointer-events:auto; }
  .promo-banner.is-super .promo-banner-text{ flex:0 0 auto; width:100%; }
  .is-super .promo-banner-title{ font-size:clamp(26px,7.6vw,32px); }
  .is-super .promo-banner-art{ position:relative; inset:auto; width:100%; margin-top:20px; z-index:4; }
  .is-super .promo-banner-art::before,
  .is-super .promo-banner-avatar{ display:none; }
  .pb-cards{ position:static; transform:none; width:100%; gap:16px 10px; }
  .pb-card{ padding:12px 12px 10px; border-radius:14px; }
  .pb-card i{ width:30px; height:30px; margin-bottom:2px; }
  .pb-card i svg{ width:17px; height:17px; }
  .pb-card b{ font-size:14.5px; }
  .pb-card small{ font-size:11.5px; }
  .pb-card-go{ font-size:11.5px; padding-top:6px; }
  .pb-card em{ font-size:10px; padding:3px 8px; top:-10px; right:8px; }
}

/* tablet estreito: sem a descrição, para os 4 cards caberem na altura do banner */
@media (min-width:751px) and (max-width:900px){
  .pb-cards{ right:4%; width:min(430px,50%); }
  .pb-card small{ display:none; }
  .pb-card-go{ padding-top:2px; }
}
