/* ==========================================================================
   Fondos: papel cálido con celdas fantasma (A + B) y bordes de celda entre
   las secciones de color (E). Elegido por el cliente el 15-oct-2026.
   ========================================================================== */

/* ---------- A + B: papel cálido con celdas fantasma ---------- */
body { background: #f7f7f2 url("/assets/img/celdas.svg") center top / 1600px auto repeat; }
.dhero, .foot { background: transparent; }
.section--mist { background: #eef1ee; }
.top { background: rgba(247, 247, 242, .94); }
.offer--white, .formblock .lead, .before__col:first-child { background: var(--white); }
.sim__qlist button, .flows__chips button:not([aria-pressed="true"]) { box-shadow: 0 10px 22px -18px rgba(0, 0, 0, .4); }
.phone, .flows__stage, .office__plan, .compare { box-shadow: 0 40px 70px -42px rgba(40, 50, 30, .55); }
.flows__stage, .office__plan { background: var(--white); }

/* ---------- E: las secciones de color se cortan con bordes de celda ---------- */
.section--ink, .section--mist, .close, .cellgrid--brand {
  --cut: clamp(26px, 3.4vw, 54px);
  position: relative; z-index: 1;
  clip-path: polygon(0 var(--cut), 13% 0, 37% calc(var(--cut) * .72), 61% calc(var(--cut) * .12), 83% calc(var(--cut) * .86), 100% calc(var(--cut) * .28),
                     100% calc(100% - var(--cut) * .5), 79% 100%, 52% calc(100% - var(--cut) * .8), 28% calc(100% - var(--cut) * .1), 0 calc(100% - var(--cut) * .7));
  margin-block: calc(-1 * var(--cut) * .6);
  padding-top: calc(clamp(88px, 11vw, 150px) + var(--cut) * .6);
  padding-bottom: calc(clamp(88px, 11vw, 150px) + var(--cut) * .6);
}
.cellgrid--brand { margin-block: 0; padding: 0; clip-path: none; }
.foot { position: relative; z-index: 0; }

.mosaic__grout path { stroke: #f7f7f2; }
@media (max-width: 1020px) { .top, .top__nav { background: #f7f7f2; } }