/* Solo para «Calcula tu piscina entera» (#mi-piscina) en renovacion-piscinas/ y coronacion-piscina/.
   El resto de la web usa estilos.css. Lo mueve piscina.js. */
.mi-piscina { background: #fff; border-top: 1px solid var(--hormigon); border-bottom: 1px solid var(--hormigon); }
.psc { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr); gap: 32px; align-items: start; }
.psc-formas { display: flex; flex-wrap: wrap; gap: 6px; padding: 12px 18px 0; }
.psc-formas button { flex: none; border: 1px solid var(--hormigon-2); background: var(--cal); color: var(--grafito); border-radius: 999px; padding: 7px 13px; font: inherit; font-size: 14.5px; font-weight: 600; cursor: pointer; }
.psc-formas button[aria-pressed="true"] { background: var(--grafito); color: #fff; border-color: var(--grafito); }
.psc-hoja .medidas { grid-template-columns: 1fr 1fr; }
.psc-hoja .medidas label[hidden] { display: none; }
.psc-checks { display: grid; gap: 8px; padding: 14px 18px 18px; }
.psc-checks label { display: flex; gap: 10px; align-items: center; font-size: 15.5px; font-weight: 600; cursor: pointer; }
.psc-checks input { width: 20px; height: 20px; accent-color: var(--verde); flex: none; }
.psc-res { position: sticky; top: 84px; display: grid; gap: 14px; }
.psc-dibujo { margin: 0; background: #eef1ef; border: 1px solid var(--hormigon); border-radius: 6px; padding: 10px; }
.psc-dibujo svg { display: block; width: 100%; height: auto; }
.psc-dibujo text { font-family: var(--f); font-size: 13px; font-weight: 700; fill: var(--grafito); }
.psc-num { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin: 0; }
.psc-num div { background: var(--cal); border: 1px solid var(--hormigon); border-radius: 6px; padding: 12px 14px; }
.psc-num dt { font-size: 13.5px; font-weight: 650; color: var(--gris); }
.psc-num dd { margin: 2px 0 0; font-size: 26px; font-weight: 750; font-stretch: 85%; line-height: 1.15; }
.psc-num small { display: block; font-size: 13px; font-weight: 500; color: var(--gris); font-stretch: 100%; }
.psc-res .boton { width: 100%; }
.psc-nota { margin: 0; font-size: 14px; color: var(--gris); }
.psc-aviso { margin: 16px 0 14px; font-size: 15.5px; }
.psc-aviso a { color: var(--verde); font-weight: 700; }
@media (max-width: 960px) {
  .psc { grid-template-columns: 1fr; gap: 20px; }
  .psc-res { position: static; }
}
@media (max-width: 640px) {
  .psc-formas, .psc-checks { padding-left: 14px; padding-right: 14px; }
  .psc-formas button { padding: 7px 12px; font-size: 14px; }
  .psc-num dd { font-size: 23px; }
}