/* SubirSite — slider "Ferramentas recomendadas" (index e Início do painel) */
.rec{position:relative;border-radius:24px;overflow:hidden;border:1px solid var(--fio2);background:#030303;min-height:560px;isolation:isolate;box-shadow:0 30px 80px -30px rgba(0,0,0,.9)}
.rec-trilho{position:relative;display:grid;min-height:inherit}
.rec-sl{position:relative;grid-area:1/1;min-height:inherit;opacity:0;visibility:hidden;transition:opacity .8s ease,visibility 0s .8s}
.rec-sl.on{opacity:1;visibility:visible;transition:opacity .8s ease}
.rec-foto{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:70% 35%;transform:scale(1.06);transition:transform 7s ease-out}
.rec-sl.on .rec-foto{transform:scale(1)}
.rec-sl::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(90deg,#000 0%,rgba(0,0,0,.92) 30%,rgba(0,0,0,.45) 58%,rgba(0,0,0,.05) 85%),linear-gradient(0deg,rgba(0,0,0,.75),transparent 40%)}
.rec-tx{position:relative;z-index:2;min-height:inherit;box-sizing:border-box;max-width:560px;padding:56px 0 84px 58px;display:flex;flex-direction:column;justify-content:center}
.rec-tx>*{flex-shrink:0;opacity:0;transform:translateY(14px);transition:opacity .6s ease,transform .6s ease}
.rec-sl.on .rec-tx>*{opacity:1;transform:none}
.rec-sl.on .rec-tx>:nth-child(2){transition-delay:.1s}.rec-sl.on .rec-tx>:nth-child(3){transition-delay:.18s}
.rec-sl.on .rec-tx>:nth-child(4){transition-delay:.26s}.rec-sl.on .rec-tx>:nth-child(5){transition-delay:.34s}
.rec-marca{display:inline-flex;align-items:center;gap:10px;align-self:flex-start;padding:6px 14px 6px 6px;border-radius:99px;background:rgba(0,0,0,.6);border:1px solid color-mix(in srgb,var(--rc) 45%,transparent);backdrop-filter:blur(8px);margin-bottom:22px}
.rec-mic{width:30px;height:30px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:var(--rc);color:#020a05;box-shadow:0 0 18px color-mix(in srgb,var(--rc) 60%,transparent)}
.rec-mic .i{width:16px;height:16px;stroke-width:2.4}
.rec-marca b{font:800 14.5px var(--fh);color:#fff}
.rec-marca small{color:var(--tx2);font-size:12.5px;font-weight:600;padding-left:10px;border-left:1px solid var(--fio2)}
.rec-tx h3{font-size:clamp(28px,3.6vw,46px);font-weight:800;line-height:1.06;letter-spacing:-.03em}
.rec-tx h3 em{font-style:normal;color:var(--rc);text-shadow:0 0 30px color-mix(in srgb,var(--rc) 45%,transparent)}
.rec-tx p{color:#c9c9d1;font-size:16.5px;line-height:1.6;margin-top:16px;max-width:470px}
.rec-tx ul{list-style:none;padding:0;margin:22px 0 28px;display:flex;flex-wrap:wrap;gap:8px 18px}
.rec-tx li{display:flex;align-items:center;gap:7px;font-weight:600;font-size:14px;color:#e8e8ec}
.rec-tx li .i{width:16px;height:16px;color:var(--rc)}
.rec-bt{align-self:flex-start;display:inline-flex;align-items:center;gap:10px;height:50px;padding:0 24px;border-radius:14px;background:var(--rc);color:#020a05;font-weight:800;font-size:15px;text-decoration:none;box-shadow:0 14px 34px -12px color-mix(in srgb,var(--rc) 80%,transparent);transition:transform .15s,box-shadow .15s}
.rec-bt:hover{transform:translateY(-2px);box-shadow:0 18px 40px -12px var(--rc)}
.rec-bt .i{transition:transform .15s}.rec-bt:hover .i{transform:translateX(3px)}
.rec-seta{position:absolute;z-index:3;top:50%;transform:translateY(-50%);width:46px;height:46px;border-radius:50%;border:1px solid var(--fio2);background:rgba(0,0,0,.55);backdrop-filter:blur(8px);color:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer;opacity:0;transition:opacity .2s,background .15s}
.rec:hover .rec-seta{opacity:1}.rec-seta:hover{background:rgba(255,255,255,.12)}
.rec-seta.ant{left:14px}.rec-seta.prox{right:14px}
.rec-pontos{position:absolute;z-index:3;left:58px;bottom:26px;display:flex;gap:8px}
.rec-pontos button{width:38px;height:4px;border:0;padding:0;border-radius:4px;background:rgba(255,255,255,.2);cursor:pointer;overflow:hidden;position:relative}
.rec-pontos button i{position:absolute;inset:0;width:0;background:#fff;border-radius:4px}
.rec-pontos button.on i{animation:rec-barra var(--rec-tempo,6.5s) linear forwards}
.rec.pausa .rec-pontos button.on i{animation-play-state:paused}
@keyframes rec-barra{to{width:100%}}

/* seção da página inicial */
.s-rec{padding:40px 0 100px;position:relative}

/* versão do painel (Início): mais baixa */
.rec[data-rec="painel"]{min-height:390px;border-radius:20px}
.rec[data-rec="painel"] .rec-tx{max-width:520px;padding:30px 0 62px 40px}
.rec[data-rec="painel"] .rec-marca{margin-bottom:14px}
.rec[data-rec="painel"] .rec-tx h3{font-size:clamp(22px,2.4vw,32px)}
.rec[data-rec="painel"] .rec-tx p{font-size:14.5px;margin-top:10px}
.rec[data-rec="painel"] .rec-tx ul{margin:14px 0 18px}
.rec[data-rec="painel"] .rec-bt{height:44px;padding:0 18px;font-size:14px;border-radius:12px}
.rec[data-rec="painel"] .rec-pontos{left:40px;bottom:18px}
.rec-cab{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}
.rec-cab h3{display:flex;align-items:center;gap:9px;font-size:15px}
.rec-cab h3 .i{color:var(--verde)}
.rec-cab small{color:var(--tx3);font-size:12.5px}

@media (max-width:760px){
  .rec,.rec[data-rec="painel"]{height:auto;min-height:0}
  .rec-trilho{position:relative;display:grid}
  .rec-sl{position:relative;grid-area:1/1}
  .rec-foto{position:relative;height:230px;object-position:65% 30%}
  .rec[data-rec="painel"] .rec-foto{height:190px}
  .rec-sl::after{background:linear-gradient(180deg,transparent 0,transparent 120px,#000 230px)}
  .rec-tx,.rec[data-rec="painel"] .rec-tx{max-width:none;padding:0 20px 56px;margin-top:-50px;height:auto}
  .rec[data-rec="painel"] .rec-tx{margin-top:-40px}
  .rec-tx p{font-size:15px}
  .rec-marca small{display:none}
  .rec-bt{align-self:stretch;justify-content:center}
  .rec-seta{display:none}
  .rec-pontos,.rec[data-rec="painel"] .rec-pontos{left:20px;bottom:22px}
}
