/* =========================================================
   PedidOS — piezas propias de su página (web/pedidos/)
   Usa la base de styles.css. Solo modo claro. Sin naranja.
   ========================================================= */

/* Sin escena fijada, el problema vuelve a llevar sus márgenes de panel */
.pagina-pedidos .panel.problema { margin-left: var(--hueco); margin-right: var(--hueco); padding: 104px 56px 88px; }
.pagina-pedidos .problema .puntos { margin-top: 72px; }
@media (max-width: 820px) { .pagina-pedidos .panel.problema { padding: 72px 20px 56px; } .pagina-pedidos .problema .puntos { margin-top: 48px; } }

/* Lo que recibes tú */
.recibes__rejilla { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 56px; align-items: center; }
.recibes__texto { margin-top: 24px; }
.aviso-pedido {
  display: flex; flex-direction: column; gap: 10px;
  padding: clamp(22px, 2vw + 12px, 36px); border-radius: 32px;
  background: var(--superficie); box-shadow: var(--relieve);
}
.aviso-pedido__cabeza { display: flex; align-items: center; gap: 14px; margin-bottom: 8px; }
.aviso-pedido__cabeza .disco { border: 0; }
.aviso-pedido__t { font-size: 18px; font-weight: 700; line-height: 1.2; }
.aviso-pedido__s { font-size: 14px; color: var(--gris); }
@media (max-width: 900px) { .recibes__rejilla { grid-template-columns: 1fr; gap: 36px; } }

/* Filas con etiqueta «Próximamente» sobre carbón */
.pagina-pedidos .fila__nombre > div { display: flex; flex-direction: column; align-items: flex-start; gap: 14px; }
.pagina-pedidos .servicios .etiqueta { background: var(--carbon-2); color: #fff; }
.pagina-pedidos .servicios .etiqueta--proximamente::before { background: var(--cian); }

/* Llamada final */
.final__rejilla { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 40px; }
.final__rejilla > div:first-child { flex: 1 1 520px; max-width: 820px; }
.final__texto { margin-top: 24px; }
.final__botones { display: flex; flex-wrap: wrap; gap: 12px; }
@media (max-width: 820px) { .final__botones { width: 100%; } .final__botones .boton { width: 100%; } }

/* Portada: chip de PedidOS + «Próximamente» */
.chips-portada { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 10px; position: relative; z-index: 1; }
.chips-portada .etiqueta { background: #fff; padding: 10px 16px; }