/* =========================================================
   PizzBur Burela — hoja de estilos
   Réplica del aspecto de la web anterior (Mobirise 5.3 + Bootstrap 4)
   sin dependencias: foto a pantalla completa, fondo blanco, Jost.
   Diseño de un solo tema (claro), como el original.
   ========================================================= */

@font-face {
  font-family: "Jost";
  src: url("../assets/fonts/jost-latin-400-normal.woff2") format("woff2");
  font-weight: 400; font-style: normal; font-display: swap;
}
@font-face {
  font-family: "Jost";
  src: url("../assets/fonts/jost-latin-500-normal.woff2") format("woff2");
  font-weight: 500; font-style: normal; font-display: swap;
}

:root {
  --fondo: #ffffff;
  --texto: #232323;
  --linea: rgba(0, 0, 0, 0.1);
  --velo: rgb(68, 121, 217);   /* capa azul sobre la foto, opacidad 0.2 */
  --foco: #ffffff;
  --fuente: "Jost", "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  color-scheme: light;
}

*, *::before, *::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; }

body {
  margin: 0;
  background: var(--fondo);
  color: var(--texto);
  font-family: var(--fuente);
  font-size: 1rem;
  line-height: 1.5;
}

img { max-width: 100%; height: auto; display: block; }

a { color: var(--texto); }

.oculto {
  position: absolute !important;
  width: 1px; height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  white-space: nowrap;
}

/* Contenedor equivalente al de Bootstrap 4 (540 / 720 / 960 / 1140) */
.contenedor {
  width: 100%;
  margin-inline: auto;
  padding-left: max(16px, env(safe-area-inset-left, 0px));
  padding-right: max(16px, env(safe-area-inset-right, 0px));
}
@media (min-width: 576px)  { .contenedor { max-width: 540px; } }
@media (min-width: 768px)  { .contenedor { max-width: 720px; } }
@media (min-width: 992px)  { .contenedor { max-width: 960px; } }
@media (min-width: 1200px) { .contenedor { max-width: 1140px; } }

/* ---------- Portada: foto a pantalla completa ---------- */
.portada {
  position: relative;
  min-height: 100vh;
  min-height: 100svh;
  background: #8a8f8c url("../assets/images/pizzbur2111-1600x900-web1-1.jpg") center center / cover no-repeat;
  overflow: hidden;
}
.portada::before {
  content: "";
  position: absolute;
  inset: 0;
  background: var(--velo);
  opacity: 0.2;
  pointer-events: none;
}

/* Zonas pulsables situadas sobre el dibujo de la foto.
   js/main.js las coloca con precisión según el recorte de la imagen;
   estos valores son la posición aproximada si no hay JavaScript. */
.zona {
  position: absolute;
  display: block;
  border-radius: 50%;
  z-index: 1;
}
.zona-pedido { left: calc(50% - 6.5vw); top: calc(50% + 4vh); width: 13vw; height: 13vw; min-width: 120px; min-height: 120px; }
.zona-telefono { border-radius: 6px; left: 61%; top: 4%; width: 15%; height: 6%; }
.zona:focus-visible {
  outline: 3px solid var(--foco);
  outline-offset: 4px;
  box-shadow: 0 0 0 7px rgba(0, 0, 0, 0.35);
}

/* ---------- Franja de enlaces legales ---------- */
.franja-legal hr {
  border: 0;
  border-top: 1px solid var(--linea);
  margin: 0;
}
.franja-legal p {
  margin: 24px 0;
  text-align: center;
  font-size: 1.2rem;
  line-height: 1.5;
}
.franja-legal a { color: var(--texto); text-decoration: none; }
.franja-legal a:hover { text-decoration: underline; }
.franja-legal .sep { margin: 0 0.6em; opacity: 0.5; }

/* ---------- Logos de las ayudas ---------- */
.ayudas { padding-block: 96px; }
.ayudas .fila {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 32px;
}
@media (min-width: 992px) {
  .ayudas .fila { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: start; }
}
.ayudas img { width: 100%; }

/* ---------- Páginas de texto ---------- */
.documento { padding-block: 80px; }
.documento article { margin-inline: auto; }
@media (min-width: 992px) { .documento article { width: 83.333%; } }
.documento h1 {
  font-size: 2rem;
  font-weight: 400;
  line-height: 1.2;
  margin: 0 0 24px;
  text-wrap: balance;
}
.documento h2 {
  font-size: 1.4rem;
  font-weight: 500;
  line-height: 1.3;
  margin: 2rem 0 0.5rem;
  text-wrap: balance;
}
.documento p, .documento li { font-size: 1.2rem; line-height: 1.5; }
.documento p { margin: 0 0 1rem; }
.documento ul { padding-left: 1.25rem; margin: 0 0 1rem; }
.documento .actualizado { font-size: 1rem; opacity: 0.7; }

.ficha {
  display: grid;
  grid-template-columns: max-content minmax(0, 1fr);
  gap: 0.25rem 1.25rem;
  margin: 0 0 1.5rem;
  font-size: 1.2rem;
}
.ficha dt { font-weight: 500; }
.ficha dd { margin: 0; overflow-wrap: anywhere; }
@media (max-width: 575px) {
  .ficha { grid-template-columns: minmax(0, 1fr); }
  .ficha dd { margin-bottom: 0.5rem; }
}


/* ---------- Páginas de los carteles ---------- */
.cartel { padding-block: 96px; }
.cartel figure { margin: 0 auto; }
@media (min-width: 992px) { .cartel figure { width: 83.333%; } }
.cartel img { width: 100%; }

:focus-visible { outline: 2px solid var(--texto); outline-offset: 2px; }

/* Datos identificativos del titular (aviso legal) */
.datos-titular { margin: 0 0 1.5rem; }
.datos-titular p { margin: 0 0 0.35rem; overflow-wrap: anywhere; }
.datos-titular strong { font-weight: 500; }