/* === LPDO DIFUMINADO PREMIUM SUAVE REV 2.26 === */
/* Ajusta solo el difuminado de divisiones. No cambia estructura ni tarjetas. */

:root {
  --lpdo-cream-top-soft: rgba(232, 221, 205, .58);
  --lpdo-cream-mid-soft: rgba(242, 233, 220, .52);
  --lpdo-cream-end-soft: rgba(255, 248, 237, .00);

  --lpdo-hairline-soft: rgba(181, 91, 48, .045);
  --lpdo-hairline-glow: rgba(255, 255, 255, .70);
}

/* Banda crema más suave, menos línea marcada */
#pedidos::before,
#carta::before,
#historia::before,
.site-footer::before {
  background:
    linear-gradient(
      180deg,
      var(--lpdo-cream-top-soft) 0%,
      var(--lpdo-cream-mid-soft) 42%,
      var(--lpdo-cream-end-soft) 100%
    ) !important;
}

/* Línea más fina y menos café */
#pedidos::after,
#carta::after,
#historia::after,
.site-footer::after {
  height: 1px !important;
  background:
    linear-gradient(
      90deg,
      rgba(181,91,48,0) 0%,
      var(--lpdo-hairline-soft) 16%,
      var(--lpdo-hairline-soft) 84%,
      rgba(181,91,48,0) 100%
    ) !important;
  box-shadow: 0 1px 0 var(--lpdo-hairline-glow) !important;
}

/* Separación Historia -> Horario con el mismo difuminado */
#historia .story-info-grid::before,
#historia .info-grid::before {
  background:
    linear-gradient(
      180deg,
      var(--lpdo-cream-top-soft) 0%,
      var(--lpdo-cream-mid-soft) 42%,
      var(--lpdo-cream-end-soft) 100%
    ) !important;
}

#historia .story-info-grid::after,
#historia .info-grid::after {
  height: 1px !important;
  background:
    linear-gradient(
      90deg,
      rgba(181,91,48,0) 0%,
      var(--lpdo-hairline-soft) 16%,
      var(--lpdo-hairline-soft) 84%,
      rgba(181,91,48,0) 100%
    ) !important;
  box-shadow: 0 1px 0 var(--lpdo-hairline-glow) !important;
}

/* Mobile: un poco más de recorrido para que el fade no parezca línea seca */
@media (max-width: 768px) {
  #pedidos,
  #carta,
  #historia,
  .site-footer {
    padding-top: 54px !important;
  }

  #pedidos::before,
  #carta::before,
  #historia::before,
  .site-footer::before {
    height: 54px !important;
  }

  #historia .story-info-grid,
  #historia .info-grid {
    margin-top: 44px !important;
    padding-top: 44px !important;
  }

  #historia .story-info-grid::before,
  #historia .info-grid::before {
    height: 44px !important;
  }
}

@media (max-width: 420px) {
  #pedidos,
  #carta,
  #historia,
  .site-footer {
    padding-top: 50px !important;
  }

  #pedidos::before,
  #carta::before,
  #historia::before,
  .site-footer::before {
    height: 50px !important;
  }
}