/* Contenido institucional (día 6): políticas de entrega, días de flor, estatus del pedido y el
   aviso de la vista previa del tema. Los encabezados verdes repiten las bandas de las imágenes
   del cliente; el texto blanco sobre --stem-deep pasa 4.5:1. */

/* Aviso fijo arriba de la tienda cuando el personal revisa un tema sin publicar. */
.vista-previa-tema { background: var(--ink); color: #fff; font-size: 14px; }
.vista-previa-tema .wrap { display: flex; flex-wrap: wrap; gap: 6px 12px; align-items: center; padding-block: 8px; }
.vista-previa-tema a { color: #fff; text-underline-offset: 3px; margin-left: auto; }

/* Políticas */
.politicas { display: grid; gap: 22px; }
.politicas-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; align-items: start; }
.politica { background: var(--card); border: 1px solid var(--line); border-radius: var(--r-md); overflow: hidden; }
.politica h2 {
  background: var(--stem-deep); color: #fff; font-family: var(--f-caps); font-size: 22px;
  letter-spacing: .06em; text-align: center; padding: 12px 16px;
}
.politica ul { margin: 0; padding: 18px 22px 20px 40px; display: grid; gap: 10px; }
.politica strong, .dias-flor strong { font-weight: 600; }
.politicas-nota { margin: 0; text-align: center; color: var(--muted); font-style: italic; }
.politicas-nota a { color: var(--rose); text-underline-offset: 3px; }

/* Días de flor */
.dias-flor {
  background: var(--blush); border-radius: var(--r-md); padding: 40px 28px; text-align: center;
  display: grid; gap: 14px; justify-items: center;
}
.dias-flor h2 { font-size: clamp(28px, 3.6vw, 42px); }
.dias-flor-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; max-width: 820px; }
.dias-flor-grid p { margin: 0; background: var(--card); border-radius: var(--r-md); padding: 16px 18px; }
.dias-flor-lema { margin: 0; color: var(--rose); font-style: italic; font-size: 18px; }

/* Estatus A TIEMPO / DESTIEMPO */
.estatus-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; align-items: start; }
.estatus { border: 1px solid var(--line); border-radius: var(--r-md); background: var(--card); overflow: hidden; display: grid; gap: 10px; padding-bottom: 20px; }
.estatus h3 { font-family: var(--f-body); font-size: 18px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; padding: 12px 20px; }
.estatus-a-tiempo h3 { background: var(--stem-deep); color: #fff; }
/* Naranja de la imagen del cliente; con texto café oscuro pasa 4.5:1. */
.estatus-destiempo h3 { background: #f2a66a; color: #3d2412; }
.estatus p { margin: 0; padding-inline: 20px; }
.pasos-pedido { margin: 6px 20px 0; padding: 0; list-style: none; counter-reset: paso; display: grid; gap: 10px; }
.pasos-pedido li { counter-increment: paso; display: grid; grid-template-columns: 30px 1fr; gap: 10px; align-items: start; font-size: 15px; }
.pasos-pedido li::before {
  content: counter(paso); display: grid; place-items: center; width: 30px; height: 30px; border-radius: 50%;
  background: var(--surface); border: 1px solid var(--line); font-weight: 600; font-size: 14px;
}

@media (max-width: 760px) {
  .politicas-grid, .dias-flor-grid, .estatus-grid { grid-template-columns: 1fr; }
  .politica h2 { font-size: 19px; }
  .dias-flor { padding: 28px 18px; }
}