/* La página pública del negocio (/): solo composición. Las piezas y los colores
   son de horno.css y de la marca del negocio. */
.inicio { min-height: 100vh; min-height: 100dvh; display: flex; flex-direction: column; }
@media (min-width: 480px) { .inicio { border-inline: 1px solid var(--border); } }
.inicio__portada { position: relative; height: 96px; background: var(--marca-tint); flex: none; overflow: hidden; }
.inicio__portada img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.inicio__hd { display: grid; gap: var(--space-3); padding-top: 0; }
.inicio__marca { position: relative; }
.inicio__marca .h-marca__logo { width: 64px; height: 64px; margin-top: -32px; border: 3px solid var(--surface); font-size: 30px; border-radius: var(--radius-lg); }
.inicio__marca .h-marca__txt { padding-top: var(--space-2); }
.inicio__marca .h-marca__nombre { font-size: 20px; line-height: 26px; white-space: normal; }
/* En su propia página, el bloque de marca no necesita subtítulo («Inicio»). */
.inicio__marca .h-marca__lugar { display: none; }
.inicio__bd { flex: 1; display: grid; gap: var(--space-5); align-content: start; padding: var(--space-4) var(--space-4) var(--space-8); }
.inicio__bd > .h-skel--panel { height: 140px; }
.inicio-sec { display: grid; gap: var(--space-2); }
.inicio-horario { white-space: pre-line; }
.inicio-sucursal { display: grid; gap: var(--space-2); }
.inicio-sucursal + .inicio-sucursal { padding-top: var(--space-3); border-top: 1px solid var(--border); }
.inicio-pie { display: grid; gap: var(--space-2); justify-items: center; text-align: center; }

/* En el teléfono (hasta 760 px; la computadora no cambia): lo que se toca, de 48 px (44 un
   enlace, como «Acceso del personal»). Va aquí, con .inicio delante: la página del cliente
   no lleva el modo celular del panel. */
@media (max-width: 760px) {
  .inicio .h-btn { min-height: var(--tap); font-size: 16px; }
  .inicio .h-link { display: inline-flex; align-items: center; min-height: 44px; vertical-align: middle; }
  .inicio .h-eyebrow, .inicio .h-marca__lugar { font-size: 13px; line-height: 18px; }
  .inicio .h-est { min-height: 28px; font-size: 13px; line-height: 18px; }
}