/* ==========================================================================
   Home, ETAPA 2: Serviços. Cards um abaixo do outro, imagem alternando de lado,
   palco escuro com a foto do equipamento. Sem empilhamento. Carregado só na home
   depois de home-base-visual.css. Escopo: #servicos. Anima só transform e opacity.
   ========================================================================== */
body .nx-home-redesign[data-nx="home"] #servicos{--nx-ease:cubic-bezier(.2,.7,.2,1);--nx-stage:#192136;--nx-card-bg:#FBFAF6}

/* Lista de cards: um abaixo do outro, 28px de espaço */
body .nx-home-redesign[data-nx="home"] #servicos .nx-services-stack{display:grid;grid-template-columns:minmax(0,1fr);grid-auto-rows:auto;gap:28px}
body .nx-home-redesign[data-nx="home"] #servicos .nx-service-slot{position:relative;top:auto;margin:0}
body .nx-home-redesign[data-nx="home"] #servicos .nx-service-slot .nx-service-stack-card{
  display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);grid-template-rows:auto;height:auto;min-height:0;
  background:var(--nx-card-bg);border:1px solid var(--line);border-radius:12px;box-shadow:none;overflow:hidden;transform:none}
/* a imagem fica sempre à esquerda e as informações à direita, nos cinco cards */

/* Palco da imagem */
body .nx-home-redesign[data-nx="home"] #servicos .nx-service-stack-card .nx-digital-visual{
  position:relative;display:block;min-width:0;min-height:420px;padding:0;margin:0;border:0;background:var(--nx-stage);overflow:hidden;isolation:isolate;perspective:1100px}
body .nx-home-redesign[data-nx="home"] #servicos .nx-service-stack-card .nx-digital-visual:before{
  content:"";display:block;position:absolute;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(60% 55% at 50% 42%,rgba(14,107,88,.28),transparent 70%)}
body .nx-home-redesign[data-nx="home"] #servicos .nx-service-stack-card .nx-digital-visual:after{display:none}
body .nx-home-redesign[data-nx="home"] #servicos .nx-media-obj{position:absolute;inset:0;transform-style:preserve-3d}
body .nx-home-redesign[data-nx="home"] #servicos .nx-media-obj img{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:cover;object-position:center;
  -webkit-mask-image:radial-gradient(80% 85% at 50% 50%,#000 55%,transparent 100%);mask-image:radial-gradient(80% 85% at 50% 50%,#000 55%,transparent 100%)}
body .nx-home-redesign[data-nx="home"] #servicos .nx-media-glare{position:absolute;inset:0;pointer-events:none;mix-blend-mode:screen;opacity:0;
  background:radial-gradient(240px 240px at var(--gx,50%) var(--gy,40%),rgba(220,234,229,.16),transparent 70%)}
body .nx-home-redesign[data-nx="home"] #servicos .nx-media-sweep{position:absolute;inset:-20% -40%;pointer-events:none;mix-blend-mode:screen;opacity:0;
  background:linear-gradient(100deg,transparent 42%,rgba(143,211,194,.10) 48%,rgba(220,234,229,.22) 50%,rgba(143,211,194,.10) 52%,transparent 58%);transform:translateX(-60%)}

/* Lado do texto */
body .nx-home-redesign[data-nx="home"] #servicos .nx-service-stack-card .nx-digital-content{
  min-width:0;display:grid;gap:22px;align-content:center;padding:clamp(24px,4vw,48px)}
body .nx-home-redesign[data-nx="home"] #servicos .nx-service-stack-card .nx-digital-content>.nx-service-eyebrow{
  margin:0;font-family:Figtree,'Figtree Fallback',Arial,sans-serif;font-weight:600;font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:#8A8F98}
body .nx-home-redesign[data-nx="home"] #servicos .nx-service-stack-card .nx-digital-content h3{margin:0;min-height:0;max-width:none}
body .nx-home-redesign[data-nx="home"] #servicos .nx-service-stack-card .nx-digital-description{margin:0;min-height:0;max-width:46ch;font-size:17px;line-height:1.55;color:var(--graphite)}
body .nx-home-redesign[data-nx="home"] #servicos .nx-service-stack-card .nx-digital-benefits{
  display:grid;gap:0;margin:0;padding:0;list-style:none;border-top:1px solid var(--line)}
body .nx-home-redesign[data-nx="home"] #servicos .nx-service-stack-card .nx-digital-benefits li{
  display:grid;grid-template-columns:auto minmax(0,1fr);gap:14px;align-items:start;padding:14px 0;margin:0;border-bottom:1px solid var(--line)}
/* ícones sem caixa: só o traço em teal (o CSS antigo usa !important, por isso aqui também) */
body .nx-home-redesign[data-nx="home"] #servicos .nx-service-stack-card .nx-digital-benefits li>.nx-benefit-icon,
body .nx-home-redesign[data-nx="home"] #servicos .nx-service-stack-card .nx-digital-benefits li:hover>.nx-benefit-icon{
  display:block!important;width:20px!important;height:20px!important;margin-top:2px;padding:0;border:0;border-radius:0!important;background:none!important;box-shadow:none!important;color:var(--teal)!important;transform:none!important}
body .nx-home-redesign[data-nx="home"] #servicos .nx-service-stack-card .nx-benefit-icon svg{display:block;width:20px!important;height:20px!important;color:var(--teal)}
body .nx-home-redesign[data-nx="home"] #servicos .nx-service-stack-card .nx-benefit-icon .nx-benefit-accent{fill:none}
body .nx-home-redesign[data-nx="home"] #servicos .nx-service-stack-card .nx-digital-benefits strong{display:block;font-weight:600;color:var(--navy)}
body .nx-home-redesign[data-nx="home"] #servicos .nx-service-stack-card .nx-digital-benefits p{margin:0;font-size:15px;color:var(--graphite)}
body .nx-home-redesign[data-nx="home"] #servicos .nx-service-stack-card .nx-digital-actions{display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin:0;padding:0;border:0}
body .nx-home-redesign[data-nx="home"] #servicos .nx-service-stack-card .nx-digital-actions>a{min-height:0;display:inline-flex;align-items:center;justify-content:flex-start;gap:8px;padding:13px 20px;font:600 15px/1.35 Figtree,'Figtree Fallback',Arial,sans-serif}

/* Celular e tablet estreito (até 860px): uma coluna, imagem em cima em 4:3 */
@media (max-width:860px){
  /* o card vira uma coluna (antes ficava com duas colunas e proporção 4:3, cortando o texto e escondendo a foto) */
  body .nx-home-redesign[data-nx="home"] #servicos .nx-service-slot .nx-service-stack-card{grid-template-columns:minmax(0,1fr);min-height:0;aspect-ratio:auto}
  body .nx-home-redesign[data-nx="home"] #servicos .nx-service-stack-card .nx-digital-visual{min-height:0;aspect-ratio:4/3}
  body .nx-home-redesign[data-nx="home"] #servicos .nx-service-stack-card .nx-digital-content{padding:24px 20px 26px;gap:18px}
  body .nx-home-redesign[data-nx="home"] #servicos .nx-service-stack-card .nx-digital-description{font-size:16px}
}

/* Movimento: entrada, inclinação com o mouse e faixa de luz. Só transform e opacity. */
@media (prefers-reduced-motion:no-preference){
  body .nx-home-redesign[data-nx="home"] #servicos .nx-media-obj{transform:translateY(18px) scale(.985);transition:transform .5s var(--nx-ease)}
  body .nx-home-redesign[data-nx="home"] #servicos .nx-service-stack-card.is-in .nx-media-obj{transform:none;transition:transform 1s var(--nx-ease)}
  body .nx-home-redesign[data-nx="home"] #servicos .nx-service-stack-card .nx-digital-content>*{transform:translateY(10px);transition:transform .8s var(--nx-ease)}
  body .nx-home-redesign[data-nx="home"] #servicos .nx-service-stack-card.is-in .nx-digital-content>*{transform:none}
  body .nx-home-redesign[data-nx="home"] #servicos .nx-service-stack-card.is-in .nx-digital-content>*:nth-child(2){transition-delay:.05s}
  body .nx-home-redesign[data-nx="home"] #servicos .nx-service-stack-card.is-in .nx-digital-content>*:nth-child(3){transition-delay:.1s}
  body .nx-home-redesign[data-nx="home"] #servicos .nx-service-stack-card.is-in .nx-digital-content>*:nth-child(4){transition-delay:.15s}
  body .nx-home-redesign[data-nx="home"] #servicos .nx-service-stack-card.is-in .nx-digital-content>*:nth-child(5){transition-delay:.2s}
  body .nx-home-redesign[data-nx="home"] #servicos .nx-media-glare{transition:opacity .4s var(--nx-ease)}
  body .nx-home-redesign[data-nx="home"] #servicos .nx-service-stack-card .nx-digital-visual:hover .nx-media-glare{opacity:1}
  body .nx-home-redesign[data-nx="home"] #servicos .nx-service-stack-card.is-in .nx-media-sweep{opacity:1;animation:nx-sweep 7s ease-in-out 1s infinite}
}
@keyframes nx-sweep{0%{transform:translateX(-60%)}35%,100%{transform:translateX(60%)}}
@media (prefers-reduced-motion:reduce){
  body .nx-home-redesign[data-nx="home"] #servicos .nx-media-obj,
  body .nx-home-redesign[data-nx="home"] #servicos .nx-service-stack-card .nx-digital-content>*{transform:none!important;transition:none!important}
  body .nx-home-redesign[data-nx="home"] #servicos .nx-media-sweep,
  body .nx-home-redesign[data-nx="home"] #servicos .nx-media-glare{display:none}
}

/* ==========================================================================
   Empilhamento (só quando o JS marca data-stack-ready="true": tela alta o bastante,
   acima de 860px e sem "reduzir movimento"). Cada card gruda 24px mais abaixo que o anterior.
   O card de trás diminui até 0,96 e escurece um pouco, ligado à rolagem (transform e opacity).
   ========================================================================== */
body .nx-home-redesign[data-nx="home"] #servicos .nx-service-stack-card{position:relative;transform-origin:50% 0}
body .nx-home-redesign[data-nx="home"] #servicos .nx-service-stack-card::after{content:"";position:absolute;inset:0;z-index:4;pointer-events:none;background:var(--navy);opacity:0}
@media (min-width:861px) and (prefers-reduced-motion:no-preference){
  body .nx-home-redesign[data-nx="home"] #servicos .nx-services-stack[data-stack-ready="true"]>.nx-service-slot{position:sticky;top:var(--nx-stack-top,104px)}
  body .nx-home-redesign[data-nx="home"] #servicos .nx-services-stack[data-stack-ready="true"] .nx-service-slot .nx-service-stack-card{
    transform:scale(var(--nx-stack-scale,1));will-change:transform}
  body .nx-home-redesign[data-nx="home"] #servicos .nx-services-stack[data-stack-ready="true"] .nx-service-stack-card::after{opacity:var(--nx-stack-shade,0)}
  body .nx-home-redesign[data-nx="home"] #servicos .nx-services-stack[data-stack-ready="true"] .nx-service-stack-card .nx-digital-visual{min-height:380px}
}

/* Telas baixas: o card fica mais compacto para caber inteiro, sem mudar textos */
@media (min-width:861px) and (max-height:820px){
  body .nx-home-redesign[data-nx="home"] #servicos .nx-service-stack-card .nx-digital-content{gap:14px;padding:clamp(20px,3vw,32px) clamp(24px,3.4vw,40px)}
  body .nx-home-redesign[data-nx="home"] #servicos .nx-service-stack-card .nx-digital-content h3{font-size:clamp(28px,3vw,34px)}
  body .nx-home-redesign[data-nx="home"] #servicos .nx-service-stack-card .nx-digital-description{font-size:16px}
  body .nx-home-redesign[data-nx="home"] #servicos .nx-service-stack-card .nx-digital-benefits li{padding:9px 0}
  body .nx-home-redesign[data-nx="home"] #servicos .nx-service-stack-card .nx-digital-benefits p{font-size:14px}
  body .nx-home-redesign[data-nx="home"] #servicos .nx-service-stack-card .nx-digital-actions>a{padding:11px 18px}
}
@media (min-width:861px) and (max-height:700px){
  body .nx-home-redesign[data-nx="home"] #servicos .nx-service-stack-card .nx-digital-description{font-size:15px;line-height:1.45}
  body .nx-home-redesign[data-nx="home"] #servicos .nx-service-stack-card .nx-digital-benefits li{padding:7px 0;gap:12px}
  body .nx-home-redesign[data-nx="home"] #servicos .nx-service-stack-card .nx-digital-content{gap:10px}
  body .nx-home-redesign[data-nx="home"] #servicos .nx-service-stack-card .nx-digital-content h3{font-size:28px}
}