/* Lo que cambia el cliente desde el panel (ofertas, reseñas, preguntas, horario especial).
   Sacado de clientes/yukana-burger/en-obras/index.html por dev/preparar_completa.py. */
/* ── Lo que cambian desde el panel (contenido.js) ── */
    .c-banner {
      display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 6px 14px;
      padding: 10px 16px;
      background: var(--degradado) border-box; color: #111;
      text-align: center; font-weight: 600;
    }
    .c-banner--black-friday { background: #111; color: var(--amarillo); border-bottom: 2px solid var(--amarillo); }
    .c-banner--navidad { background: linear-gradient(90deg, #c8102e, #8a0c20); color: #fff; }
    .c-banner--rebajas { background: var(--rosa); color: #fff; }
    .c-banner--verano { background: linear-gradient(90deg, var(--amarillo), var(--naranja)); color: #111; }
    .c-banner--san-valentin { background: linear-gradient(90deg, #ff5c8a, #c2185b); color: #fff; }
    .c-banner__texto { margin: 0; }
    .c-banner__titulo { font: 800 italic 1.15rem/1.1 var(--titular); text-transform: uppercase; letter-spacing: .03em; }
    .c-banner__boton { font-weight: 700; padding: 6px 14px; border-radius: 999px; background: rgb(0 0 0 / .82); color: #fff; text-decoration: none; }

    .especiales { list-style: none; margin: 12px 0 0; padding: 0; display: grid; gap: 6px; }
    .c-especial { padding: 8px 12px; border-radius: 10px; background: rgb(255 47 136 / .12); font-size: .95rem; }
    .c-especial strong { color: var(--rosa); }
    .c-especial--nota { background: transparent; padding: 0; color: var(--gris); font-size: .85rem; }
    .horario .especial dd { color: var(--rosa); }

    .extra { width: min(1120px, 100% - 32px); margin: 0 auto; display: grid; gap: 40px; padding-bottom: 40px; }
    .extra__titulo { font: 800 italic clamp(2rem, 7vw, 3rem)/1 var(--titular); text-transform: uppercase; margin-bottom: 18px; }
    .promos, .resenas { display: grid; gap: 16px; }
    .c-promo { border-radius: 18px; padding: 22px 20px; background: var(--tarjeta); border: 2px solid transparent;
      background: linear-gradient(var(--tarjeta), var(--tarjeta)) padding-box, var(--degradado) border-box; }
    .c-promo--black-friday { background: linear-gradient(#111, #111) padding-box, linear-gradient(90deg, var(--amarillo), #fff) border-box; }
    .c-promo--navidad { background: linear-gradient(var(--tarjeta), var(--tarjeta)) padding-box, linear-gradient(90deg, #c8102e, #1f7a3a) border-box; }
    .c-promo__titulo { font: 800 italic 1.6rem/1.05 var(--titular); text-transform: uppercase; margin-bottom: 8px; }
    .c-promo__texto { color: var(--gris); margin-bottom: 8px; }
    .c-precio { margin: 6px 0; }
    .c-precio__ahora { font: 800 italic 2rem/1 var(--titular); color: var(--amarillo); }
    .c-precio__antes { color: var(--gris); margin-left: 8px; }
    .c-promo__nota, .c-promo__fechas { font-size: .82rem; color: var(--gris); margin: 4px 0 0; }
    .c-boton { display: inline-flex; margin-top: 14px; padding: 10px 18px; border-radius: 12px; background: var(--amarillo); color: #111;
      font: 800 italic 1.1rem/1 var(--titular); text-transform: uppercase; text-decoration: none; }

    .c-cat { margin-bottom: 26px; }
    .c-cat__nombre { font: 800 italic 1.5rem/1 var(--titular); text-transform: uppercase; color: var(--amarillo); margin-bottom: 6px; }
    .c-cat__nota { color: var(--gris); font-size: .9rem; margin-bottom: 8px; }
    .c-lista { list-style: none; margin: 0; padding: 0; }
    .c-producto { padding: 12px 0; border-bottom: 1px dashed var(--borde); }
    .c-producto__cabeza { display: flex; align-items: baseline; gap: 10px; }
    .c-producto__nombre { font-weight: 600; font-size: 1.05rem; }
    .c-producto__precio { margin-left: auto; font: 800 italic 1.25rem/1 var(--titular); color: var(--amarillo); white-space: nowrap; }
    .c-producto--agotado .c-producto__nombre { text-decoration: line-through; color: var(--gris); }
    .c-producto--agotado .c-producto__precio { color: var(--rosa); font-size: 1rem; }
    .c-producto__desc { color: var(--gris); font-size: .95rem; margin: 4px 0 0; }
    .c-producto__alergenos { font-size: .8rem; color: var(--gris); margin: 4px 0 0; }
    .c-etiqueta { font: 800 italic .8rem/1 var(--titular); text-transform: uppercase; padding: 3px 7px; border-radius: 6px; background: var(--turquesa); color: #111; }
    .c-nota { font-size: .85rem; color: var(--gris); margin-top: 10px; }

    .c-resena { margin: 0; padding: 20px; border-radius: 16px; background: var(--tarjeta); border: 1px solid var(--borde); }
    .c-resena__estrellas { color: var(--amarillo); letter-spacing: 2px; margin-bottom: 6px; }
    .c-resena__texto { margin: 0 0 10px; font-size: 1.05rem; }
    .c-resena__pie { display: flex; flex-wrap: wrap; gap: 4px 10px; font-size: .85rem; color: var(--gris); }
    .c-resena__autor { color: var(--tiza); font-weight: 600; }

    .c-faq { border-bottom: 1px solid var(--borde); padding: 14px 0; }
    .c-faq__pregunta { cursor: pointer; font-weight: 600; font-size: 1.05rem; list-style: none; display: flex; justify-content: space-between; gap: 12px; }
    .c-faq__pregunta::after { content: "+"; color: var(--amarillo); font-weight: 800; }
    .c-faq[open] .c-faq__pregunta::after { content: "–"; }
    .c-faq__respuesta { color: var(--gris); padding-top: 8px; }

    @media (min-width: 900px) {
      .promos { grid-template-columns: repeat(2, 1fr); }
      .resenas { grid-template-columns: repeat(3, 1fr); }
      .c-carta { display: grid; grid-template-columns: 1fr 1fr; gap: 0 48px; align-items: start; }
      .c-carta .c-nota, .resenas .c-nota { grid-column: 1 / -1; }
    }