/* ==========================================================================
   LAVANDERIA — azul anil, lilás e bolhas, Urbanist
   Esqueleto em ../base/servicos.css. Aqui: a sacola e o tom.
   ========================================================================== */

h1, h2 { font-weight: 800; }
.sv-logo { background: var(--bolha); }
.sv-botao { border-radius: 999px; }
.sv-hero-lado { background: radial-gradient(circle at 12% 20%, var(--lilas), transparent 30%), radial-gradient(circle at 90% 70%, var(--bolha), transparent 35%); }
.sv-hero-lado .sv-hero-foto { position: relative; }
.sv-hero-lado .sv-hero-foto img { border-radius: 999px 999px 32px 32px; }
.sv-hero-lado .sv-hero-foto::before, .sv-hero-lado .sv-hero-foto::after { content: ''; position: absolute; border-radius: 50%; border: 2px solid rgba(59,91,219,.35); background: radial-gradient(circle at 30% 30%, #fff, rgba(219,228,255,.4)); }
.sv-hero-lado .sv-hero-foto::before { width: 70px; height: 70px; left: -18px; top: 30%; }
.sv-hero-lado .sv-hero-foto::after { width: 38px; height: 38px; right: 8%; top: -10px; }
.sv-confianca { background: var(--escuro); }
.sv-serv-ico { display: grid; place-items: center; width: 50px; height: 50px; border-radius: 50%; background: var(--bolha); }

.lv-grade { display: grid; grid-template-columns: 1.5fr 1fr; gap: 28px; align-items: start; }
.lv-quilo { display: grid; gap: 12px; }
.lv-kg, .lv-qtd { display: inline-flex; align-items: center; gap: 6px; }
.lv-kg button, .lv-qtd button { width: 42px; height: 42px; border-radius: 50%; border: 2px solid var(--linha); background: var(--papel); font-size: 1.2rem; font-weight: 800; }
.lv-kg output { min-width: 70px; text-align: center; font-weight: 800; font-size: 1.3rem; }
.lv-qtd output { min-width: 26px; text-align: center; font-weight: 800; }
.lv-abas { display: flex; gap: 6px; overflow-x: auto; margin-bottom: 10px; scrollbar-width: none; }
.lv-abas button { flex: none; min-height: 42px; padding: 8px 16px; border-radius: 999px; font-weight: 700; background: var(--fundo); border: 2px solid var(--linha); }
.lv-abas button[aria-selected="true"] { background: var(--primaria); border-color: var(--primaria); color: #fff; }
.lv-itens { display: grid; gap: 6px; }
.lv-itens li { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 14px; border-radius: 14px; background: var(--fundo); border: 1px solid var(--linha); }
.lv-itens span { display: flex; flex-direction: column; }
.lv-itens small { color: var(--suave); }
.sv-chips small { font-weight: 500; opacity: .75; }
.sv-op b small { font-weight: 600; color: var(--primaria); }
.lv-sacola { position: sticky; top: 84px; }
.lv-falta { font-size: .86rem; font-weight: 700; color: var(--primaria); background: var(--bolha); padding: 6px 10px; border-radius: 10px; margin-top: 8px; }

@media (max-width: 900px) {
  .lv-grade { grid-template-columns: 1fr; }
  .lv-sacola { position: static; }
}