/* ==========================================================================
   BuenaCarta.com - Apartado TPV Ágora (agora-pos, tpv-agora, mantenimiento-agora, manual-agora)
   Se carga solo en esas páginas (clave 'css' de include/paginas.php)
   ========================================================================== */

/* Hero ---------------------------------------------------------------- */
.hero.hero-agora { background-image: url('/images/agora/tpv-agora-restaurante.jpg'); background-position: center right; min-height: 560px; }
.hero.hero-mantenimiento { background-image: url('/images/agora/mantenimiento-tpv-agora.jpg'); background-position: center right; min-height: 520px; }
@media (max-width: 767.98px) {
	.hero.hero-agora, .hero.hero-mantenimiento { background-position: 70% center; }
	.hero.hero-agora::before, .hero.hero-mantenimiento::before { background: rgba(14, 40, 8, .78); }
	.hero.hero-agora .hero-contenido, .hero.hero-mantenimiento .hero-contenido { padding: 56px 0; }
}

.sello-distribuidor { display: inline-flex; align-items: center; gap: .5rem; background: rgba(255, 255, 255, .14); border: 1px solid rgba(255, 255, 255, .35); color: #fff; border-radius: 50px; padding: .35rem 1rem; font-size: .8rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; margin-bottom: 1rem; }
.sello-distribuidor i { color: #b6ff85; }
.pagina-cabecera .sello-distribuidor { background: var(--bc-verde-claro); border-color: var(--bc-verde); color: var(--bc-verde-oscuro); }
.pagina-cabecera .sello-distribuidor i { color: var(--bc-verde); }

/* Fichas de producto -------------------------------------------------- */
.producto { background: #fff; border-radius: var(--bc-radio); box-shadow: var(--bc-sombra); border: 1px solid var(--bc-borde); height: 100%; display: flex; flex-direction: column; overflow: hidden; transition: transform .3s ease, box-shadow .3s ease; }
.producto:hover { transform: translateY(-4px); box-shadow: var(--bc-sombra-hover); }
.producto-imagen { background: #fff; aspect-ratio: 4 / 3; display: flex; align-items: center; justify-content: center; border-bottom: 1px solid var(--bc-borde); }
.producto-imagen img { width: 100%; height: 100%; object-fit: contain; }
.producto-cuerpo { padding: 1.4rem 1.5rem 1.6rem; display: flex; flex-direction: column; flex: 1; }
.producto-cuerpo h3 { font-size: 1.2rem; margin-bottom: .35rem; }
.producto-cuerpo p { font-size: .97rem; color: var(--bc-gris); line-height: 1.6; }
.producto-cuerpo .btn { margin-top: auto; align-self: flex-start; }
.producto-etiqueta { display: inline-block; font-size: .72rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--bc-verde-oscuro); background: var(--bc-verde-claro); border-radius: 50px; padding: .2rem .7rem; margin-bottom: .6rem; align-self: flex-start; }

/* TPV destacados (X100 / X300) */
.tpv-destacado { background: #fff; border-radius: var(--bc-radio); box-shadow: var(--bc-sombra); border: 1px solid var(--bc-borde); padding: 2rem; height: 100%; }
.tpv-destacado h3 { font-size: 1.6rem; margin-bottom: .25rem; }
.tpv-destacado .tpv-lema { color: var(--bc-gris); margin-bottom: 1rem; }
.tpv-galeria { display: grid; grid-template-columns: 2fr 1fr; gap: .75rem; margin-bottom: 1.25rem; }
.tpv-galeria img { width: 100%; height: 100%; object-fit: contain; background: #fff; border: 1px solid var(--bc-borde); border-radius: 14px; }
.tpv-galeria .tpv-galeria-mini { display: grid; grid-template-rows: 1fr 1fr; gap: .75rem; }

.specs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .5rem 1.25rem; margin: 0 0 1.25rem; }
.specs div { border-bottom: 1px dashed var(--bc-borde); padding: .35rem 0; }
.specs dt { font-size: .75rem; text-transform: uppercase; letter-spacing: .08em; color: var(--bc-gris-claro); font-weight: 600; }
.specs dd { margin: 0; font-weight: 600; font-size: .98rem; }
@media (max-width: 400px) { .specs { grid-template-columns: 1fr; } }

/* Servicios / mantenimiento --------------------------------------------- */
.servicio-num { font-size: .8rem; font-weight: 800; color: var(--bc-verde); letter-spacing: .1em; }
.caja-backup { background: var(--bc-verde-profundo) url('/images/agora/copia-seguridad-tpv-nube.jpg') center / cover no-repeat; border-radius: var(--bc-radio); color: #fff; position: relative; overflow: hidden; padding: 3rem; }
.caja-backup::before { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(14, 40, 8, .92) 0%, rgba(14, 40, 8, .75) 55%, rgba(14, 40, 8, .35) 100%); }
.caja-backup > * { position: relative; }
.caja-backup h2, .caja-backup h3, .caja-backup p, .caja-backup li { color: #fff; }
.caja-backup .lista-check li::before { color: #b6ff85; }
.caja-backup .etiqueta { color: #b6ff85; }
@media (max-width: 767.98px) { .caja-backup { padding: 1.75rem; } .caja-backup::before { background: rgba(14, 40, 8, .85); } }

/* Tabla de planes ------------------------------------------------------ */
.planes-agora td, .planes-agora th { text-align: center; }
.planes-agora tbody th { text-align: left; }
.planes-agora .precio { font-size: 1.35rem; font-weight: 800; color: var(--bc-verde-oscuro); display: block; }
.planes-agora .precio small { font-size: .8rem; font-weight: 600; color: var(--bc-gris); }

/* Manual -------------------------------------------------------------- */
.ruta { display: inline-block; font-family: var(--bc-fuente); font-weight: 700; font-size: .92em; background: #fff; border: 1px solid var(--bc-borde); border-bottom-width: 2px; border-radius: 8px; padding: .05rem .5rem; color: var(--bc-verde-oscuro); white-space: nowrap; }
.prosa .ruta { white-space: normal; }
.prosa .paso-manual { counter-reset: paso; list-style: none; padding-left: 0; }
.prosa .paso-manual > li { counter-increment: paso; position: relative; padding-left: 2.75rem; margin-bottom: .9rem; }
.prosa .paso-manual > li::before { content: counter(paso); position: absolute; left: 0; top: .15rem; width: 2rem; height: 2rem; border-radius: 50%; background: var(--bc-verde-claro); color: var(--bc-verde-oscuro); font-weight: 800; display: flex; align-items: center; justify-content: center; font-size: .95rem; }
.prosa .nota-aviso { background: #fff6e5; border-left-color: #e0a100; }
.indice-manual { columns: 2; column-gap: 2rem; }
@media (max-width: 575.98px) { .indice-manual { columns: 1; } }

/* Enlaces cruzados y avisos ------------------------------------------- */
.agora-enlaces { background: #fff; border: 1px solid var(--bc-borde); border-radius: var(--bc-radio); padding: 1.5rem; text-align: center; box-shadow: var(--bc-sombra); }
.agora-enlaces .btn { margin: .25rem; }
.aviso-marca { font-size: .82rem; color: var(--bc-gris-claro); text-align: center; margin: 0; }