/* Quadros finais por padrão. Só classes instaladas por scenes.js alteram a vitrine. */
.service-list{list-style:none;margin:0;min-width:0}
.service-list>li{min-width:0}
.service-list .service-item{position:relative;display:block;padding:var(--space-6) 0;border:0;border-top:1px solid var(--line-strong);border-radius:0;background:transparent;box-shadow:none;transform:none}
.service-list .service-item:hover,.service-list .service-item:focus-within{border-color:var(--line-strong);box-shadow:none;transform:none;translate:none}
.service-index{display:block;margin-bottom:var(--space-2);font-size:var(--fs-sm);font-weight:800;color:var(--mint-deep)}
.service-item h3{font-size:clamp(1.65rem,1.15rem + 1.6vw,2.6rem);line-height:1.16;margin-bottom:var(--space-3)}
.service-item>p{max-width:44ch;color:var(--text-muted)}
.service-item .card-list{margin-bottom:var(--space-3)}
.service-item>.link-arrow{position:relative;z-index:1}
.service-select{display:block;padding:0;border:0;background:none;text-align:left;font:inherit;letter-spacing:inherit;line-height:inherit;color:inherit;cursor:pointer}
.service-test{display:flex;width:fit-content;padding:0;border:0;background:none;cursor:pointer}
.scene{min-width:0;width:100%;max-width:38rem;margin:var(--space-5) 0 0;padding:clamp(.75rem,2vw,1.5rem);border:1px solid var(--line);border-radius:var(--radius-lg);background:var(--wash);color:var(--ink);font-size:var(--fs-xs);line-height:1.5;overflow:hidden}
.scene-frame{width:100%;overflow:hidden;border:1px solid var(--line-strong);border-radius:var(--radius);background:var(--white);box-shadow:var(--shadow-md)}
.scene-note{margin-top:var(--space-3);text-align:center;color:var(--text-muted);font-size:var(--fs-xs)}
.motion .services-showcase.is-enhanced .service-item h3{transition:color var(--dur) var(--ease)}
@media(min-width:1024px){
  .services-showcase{--scene-max-h:calc(100vh - var(--header-h) - 3rem)}
  .services-showcase .scene{display:flex;flex-direction:column;min-height:0;max-height:var(--scene-max-h)}
  .services-showcase .scene--sistemas.demo{max-height:min(600px,var(--scene-max-h))}
  .services-showcase .scene>.scene-frame,.services-showcase .scene>.demo-chat-layout{min-height:0;flex:0 1 auto}
  .services-showcase .scene-note{flex-shrink:0}
  .services-showcase.is-desktop{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:var(--space-7);align-items:start}
  .is-desktop .service-item{min-height:24rem}
  .is-desktop .service-list{padding-bottom:max(0px,calc(var(--scene-max-h) - (100vh - var(--header-h)) / 2))}
  .is-desktop .service-item h3{color:var(--text-muted)}
  .is-desktop .service-item.is-active h3{color:var(--ink)}
  .is-desktop .service-index{color:var(--text-muted)}
  .is-desktop .service-item.is-active .service-index{color:var(--mint-deep)}
  .is-desktop .services-stage{position:sticky;top:calc(var(--header-h) + 2rem);display:grid;min-width:0;max-height:var(--scene-max-h);padding-block:0}
  .is-desktop .services-stage .scene{grid-area:1/1;margin:0;align-self:center;opacity:0;visibility:hidden;pointer-events:none}
  .motion .is-desktop .service-index{transition:color var(--dur) var(--ease)}
  .motion .is-desktop .services-stage .scene{transition:opacity .25s var(--ease),visibility .25s}
  .is-desktop .services-stage .scene.is-active{opacity:1;visibility:visible;pointer-events:auto}
}
@media(prefers-reduced-motion:reduce){
  .motion .services-showcase .service-item h3,.motion .services-showcase .service-index,.motion .is-desktop .services-stage .scene{transition:none}
}
/* Desktop estatico: texto e cena lado a lado, sem coluna vazia. */
@media(min-width:1024px){
  .services-showcase:not(.is-desktop) .service-item{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);column-gap:var(--space-7);align-items:start}
  .services-showcase:not(.is-desktop) .service-item>:not(.scene){grid-column:1}
  .services-showcase:not(.is-desktop) .service-item>.scene{grid-column:2;grid-row:1 / span 5;margin:0}
}
