/* Sauce Tecnologia — Simulador de Videowall (carregado só em videowall.html) */
.vw-sim { background: var(--g950); padding: 88px 52px; }
.vw-sim-inner { max-width: 1080px; margin: 0 auto; }
.vw-sim-head { text-align: center; margin-bottom: 44px; }
.vw-sim-badge { display: inline-flex; align-items: center; gap: 8px; font-size: 12px; font-weight: 800; letter-spacing: 1.5px; color: var(--yellow); text-transform: uppercase; margin-bottom: 14px; }
.vw-sim-head h2 { font-size: clamp(26px, 3.6vw, 40px); font-weight: 800; letter-spacing: -1px; color: var(--white); line-height: 1.1; }
.vw-sim-head p { font-size: 15px; color: var(--g400); margin-top: 12px; }
.vw-sim-grid { display: grid; grid-template-columns: 340px 1fr; gap: 40px; align-items: start; }

/* Controles */
.vw-controls { background: rgba(255,255,255,0.04); border: 1px solid rgba(255,255,255,0.1); border-radius: 14px; padding: 26px; }
.vw-ctl { margin-bottom: 22px; }
.vw-ctl:last-child { margin-bottom: 0; }
.vw-ctl-label { font-size: 12px; font-weight: 800; letter-spacing: .5px; color: var(--g400); text-transform: uppercase; margin-bottom: 10px; display: block; }
.vw-stepper { display: flex; align-items: center; gap: 0; border: 1px solid rgba(255,255,255,0.15); border-radius: 8px; overflow: hidden; width: fit-content; }
.vw-stepper button { width: 44px; height: 44px; background: rgba(255,255,255,0.06); border: none; color: var(--white); font-size: 20px; font-weight: 800; cursor: pointer; font-family: var(--f); transition: background .2s; }
.vw-stepper button:hover { background: var(--yellow); color: var(--g950); }
.vw-stepper output { width: 56px; text-align: center; font-size: 18px; font-weight: 800; color: var(--white); }
.vw-steppers-row { display: flex; gap: 22px; }
.vw-radio-row { display: flex; gap: 8px; flex-wrap: wrap; }
.vw-radio-row input[type="radio"], .vw-radio-row input[type="checkbox"] { position: absolute; opacity: 0; pointer-events: none; }
.vw-radio-row label.vw-chip { padding: 10px 18px; border: 1px solid rgba(255,255,255,0.18); border-radius: 8px; font-size: 14px; font-weight: 700; color: var(--g400); cursor: pointer; transition: all .2s; user-select: none; }
.vw-radio-row input:checked + label.vw-chip { background: var(--yellow); border-color: var(--yellow); color: var(--g950); }
.vw-radio-row input:focus-visible + label.vw-chip { outline: 2px solid var(--yellow); outline-offset: 2px; }

.vw-other-input { display: none; margin-top: 12px; width: 100%; padding: 11px 14px; border-radius: 8px; border: 1px solid rgba(255,255,255,0.18); background: rgba(255,255,255,0.06); color: var(--white); font-family: var(--f); font-size: 13px; }
.vw-other-input.show { display: block; }
.vw-other-input::placeholder { color: var(--g500); }
.vw-other-input:focus { outline: none; border-color: var(--yellow); }

/* Preview */
.vw-preview-wrap { text-align: center; }
.vw-preview { display: inline-grid; gap: 3px; background: #000; border: 4px solid #222; border-radius: 6px; padding: 3px; box-shadow: 0 24px 70px rgba(0,0,0,.5); margin-bottom: 26px; max-width: 100%; }
.vw-tile { border-radius: 2px; min-width: 0; min-height: 0; position: relative; overflow: hidden; }
/* modo conteúdo individual: cada tile com um "conteúdo" próprio */
.vw-preview.mode-ind .vw-tile { background: linear-gradient(135deg, #2a2a2a, #3a3a3a); }
.vw-preview.mode-ind .vw-tile::after { content: ''; position: absolute; inset: 18% 14%; border-radius: 2px; background: linear-gradient(135deg, rgba(212,230,0,.85), rgba(168,184,0,.55)); }
.vw-preview.mode-ind .vw-tile:nth-child(3n)::after { background: linear-gradient(135deg, rgba(0,192,192,.7), rgba(0,120,120,.5)); }
.vw-preview.mode-ind .vw-tile:nth-child(3n+1)::after { background: linear-gradient(135deg, rgba(255,255,255,.75), rgba(180,180,180,.4)); }
/* modo imagem expandida: um único gradiente atravessando o painel */
.vw-preview.mode-exp .vw-tile { background-image: linear-gradient(115deg, #D4E600 0%, #6ab04c 34%, #00c0c0 68%, #1a1a2e 100%); background-repeat: no-repeat; }

/* Resultados */
.vw-results { display: flex; gap: 14px; justify-content: center; flex-wrap: wrap; margin-bottom: 26px; }
.vw-res { background: rgba(255,255,255,0.05); border: 1px solid rgba(255,255,255,0.1); border-radius: 12px; padding: 16px 24px; min-width: 150px; }
.vw-res-v { font-size: clamp(20px, 2.6vw, 28px); font-weight: 900; color: var(--yellow); letter-spacing: -.5px; }
.vw-res-l { font-size: 11px; font-weight: 700; letter-spacing: 1px; color: var(--g400); text-transform: uppercase; margin-top: 4px; }
.vw-disclaimer { font-size: 12px; color: var(--g500); margin-bottom: 26px; }
.vw-sim .btn-cta { display: inline-flex; }

@media (max-width: 900px) {
  .vw-sim { padding: 64px 24px; }
  .vw-sim-grid { grid-template-columns: 1fr; gap: 30px; }
  .vw-controls { max-width: 480px; margin: 0 auto; width: 100%; }
}