/* =====================================================================
   SABABA · Home — capa editorial (Lenguaje Visual 1.0)
   Mejora SOLO visual. Alcance: la ruta Home (#inicio-app) y su nav.
   No cambia estructura, enlaces ni datos. No toca otras secciones.
   ===================================================================== */

/* --- suelo cálido en penumbra, solo en la ruta Home --- */
body.mobile-view-home { background: #0d150f !important; }
/* el fondo real vive en .mobile-home (#inicio-app), que tapaba al body */
#inicio-app.mobile-home {
  background:
    radial-gradient(96% 30% at 50% 0%, rgba(201, 170, 106, .12), transparent 46%),
    linear-gradient(180deg, #16241d 0%, #101a12 62%, #0d150f 100%) !important;
}

/* --- cabecera de bienvenida --- */
#inicio-app .mobile-home-head { align-items: center; padding-top: 4px; }
#inicio-app .mobile-home-head > div p {
  font-family: "Montserrat", sans-serif; font-weight: 600; font-size: .64rem;
  letter-spacing: .26em; text-transform: uppercase; color: #c8a96a; margin-bottom: 7px;
}
#inicio-app .mobile-home-head > div h1 {
  font-family: "Playfair Display", serif; font-weight: 700; font-size: 2.15rem;
  line-height: 1; color: #f7f4ee !important; letter-spacing: -.01em;
}
#inicio-app .mobile-home-head > div span {
  font-family: "Montserrat", sans-serif; font-weight: 400; font-size: .92rem;
  color: #8fc0a4; display: block; margin-top: 8px;
}
#inicio-app .mobile-home-head img { width: 76px; height: 76px; border-radius: 50%; object-fit: contain; background: transparent; }

/* --- CTA principal: pastilla brasa --- */
#inicio-app .mobile-expeditions-cta.primary-button {
  background: linear-gradient(180deg, #e6c98a, #c8a96a) !important;
  color: #241d12 !important; text-decoration: none !important; border: none !important;
  font-family: "Montserrat", sans-serif; font-weight: 600; font-size: .72rem;
  letter-spacing: .16em; text-transform: uppercase; border-radius: 999px;
  padding: 16px 22px !important; box-shadow: 0 18px 42px -18px rgba(201, 170, 106, .55);
}

/* --- marco del recorrido inmersivo --- */
#inicio-app .mobile-genially-frame {
  border-radius: 20px; overflow: hidden; border: 1px solid rgba(201, 170, 106, .16);
  box-shadow: 0 30px 60px -42px rgba(0, 0, 0, .6);
}

/* --- encabezados de sección --- */
#inicio-app .mobile-section-row h2 {
  font-family: "Playfair Display", serif; font-weight: 700; font-size: 1.5rem;
  color: #f7f4ee !important; letter-spacing: -.01em;
}
#inicio-app .mobile-section-row a {
  font-family: "Montserrat", sans-serif; font-weight: 600; font-size: .62rem;
  letter-spacing: .18em; text-transform: uppercase; color: #c8a96a !important;
}

/* --- tarjeta destacada: foto a sangre + título encima --- */
#inicio-app .mobile-featured-events a {
  position: relative; display: block; border-radius: 20px; overflow: hidden;
  border: 1px solid rgba(201, 170, 106, .2); box-shadow: 0 30px 60px -42px rgba(0, 0, 0, .7);
}
#inicio-app .mobile-featured-events a img {
  width: 100%; height: 270px; object-fit: cover; display: block;
  filter: brightness(.72) saturate(1.06);
}
#inicio-app .mobile-featured-events a span {
  position: absolute; left: 0; right: 0; bottom: 0; padding: 24px 22px;
  background: linear-gradient(180deg, transparent, rgba(13, 21, 15, .92));
}
#inicio-app .mobile-featured-events a span small {
  font-family: "Montserrat", sans-serif; font-weight: 600; font-size: .58rem;
  letter-spacing: .2em; text-transform: uppercase; color: #e6c98a; display: block; margin-bottom: 6px;
}
#inicio-app .mobile-featured-events a span strong {
  font-family: "Playfair Display", serif; font-weight: 700; font-size: 1.7rem;
  color: #f7f4ee; line-height: 1; letter-spacing: -.01em;
}

/* --- lista "Programadas" --- */
#inicio-app .mobile-event-card {
  border-radius: 14px; overflow: hidden;
  border: 1px solid rgba(201, 170, 106, .14); background: rgba(31, 49, 42, .4);
}
#inicio-app .mobile-event-card img { filter: brightness(.86) saturate(1.05); }
#inicio-app .mobile-event-card strong {
  font-family: "Playfair Display", serif; font-weight: 700; font-size: 1.08rem; color: #f7f4ee !important;
}
#inicio-app .mobile-event-card small {
  font-family: "Montserrat", sans-serif; font-size: .7rem; letter-spacing: .05em; color: #9aa48f !important;
}

/* --- accesos rápidos --- */
#inicio-app .mobile-category-grid a {
  background: rgba(31, 49, 42, .42); border: 1px solid rgba(201, 170, 106, .14);
  border-radius: 16px; color: #f7f4ee;
}
#inicio-app .mobile-category-grid a svg { stroke: #c8a96a; }
#inicio-app .mobile-category-grid a strong {
  font-family: "Playfair Display", serif; font-weight: 700; color: #f7f4ee !important;
}

/* --- acceso a Premios: el que invita a sumar puntos --- */
#inicio-app .mobile-category-grid a.home-premios {
  background: linear-gradient(150deg, rgba(201, 170, 106, .2), rgba(31, 49, 42, .5));
  border-color: rgba(201, 170, 106, .45);
}
#inicio-app .mobile-category-grid a.home-premios small {
  color: #e6c98a !important; font-size: .68rem; font-weight: 600; text-align: center; margin-top: -4px;
}
#inicio-app .mobile-category-grid a.home-premios.con-premio { box-shadow: 0 0 0 2px rgba(230, 201, 138, .35); }

/* --- nav inferior en penumbra (solo en la Home, para no alterar otras rutas) --- */
body.mobile-view-home nav.mobile-app-nav {
  background: #101a14 !important; border: 1px solid rgba(201, 170, 106, .18) !important;
  box-shadow: 0 16px 42px rgba(0, 0, 0, .45) !important;
}
body.mobile-view-home nav.mobile-app-nav a { color: #93a08c !important; }
body.mobile-view-home nav.mobile-app-nav a.active {
  background: rgba(201, 170, 106, .15) !important; color: #e6c98a !important;
}

/* ==========================================================================
   ESTADO DEL LOCAL en el Inicio · verde si está abierto, dorado si no
   ========================================================================== */
.mobile-home-head .home-estado {
  display: inline-flex; align-items: center; gap: 8px;
  margin-top: 10px; padding: 6px 13px 6px 10px;
  border-radius: 999px;
  border: 1px solid rgba(143, 192, 164, .42);
  background: rgba(143, 192, 164, .1);
  text-decoration: none;
}
.mobile-home-head .home-estado-punto {
  display: block; width: 8px; height: 8px; border-radius: 50%;
  background: #8fc0a4; box-shadow: 0 0 0 3px rgba(143, 192, 164, .2);
}
.mobile-home-head .home-estado-tx {
  color: #bfe0cd; font-size: .78rem; font-weight: 700; letter-spacing: .02em;
}
.mobile-home-head .home-estado.cerrado { border-color: rgba(215, 162, 89, .48); background: rgba(215, 162, 89, .12); }
.mobile-home-head .home-estado.cerrado .home-estado-punto { background: #d7a259; box-shadow: 0 0 0 3px rgba(215, 162, 89, .22); }
.mobile-home-head .home-estado.cerrado .home-estado-tx { color: #e6c98a; }

/* --- sello de la cabecera ---
   Vivía en una columna de 58px pero medía 76px: se salía por la derecha y
   quedaba pegado a la orilla. Ahora la columna mide lo que mide el sello,
   y el sello queda centrado en su espacio, más grande. (Sigue siendo la
   puerta de administración: 5 toques.) */
#inicio-app .mobile-home-head {
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 16px;
}
#inicio-app .mobile-home-head img {
  width: 92px; height: 92px;
  justify-self: center; align-self: center;
  margin-right: 4px;
  filter: drop-shadow(0 10px 22px rgba(0, 0, 0, .35));
}

/* pie de "Mi recorrido": desde cuando viene y su ultima visita */
.profile-track-foot { margin: 10px 0 0; font-size: .82rem; opacity: .72; }

/* Entrada al juego ¿Caminamos? (inicio de la app) */
.home-juego{display:block;margin:18px 16px 4px;border-radius:22px;overflow:hidden;text-decoration:none;color:var(--paper,#fffaf0);background:linear-gradient(180deg,#16241d,#101a12);border:1px solid rgba(200,169,106,.6);box-shadow:0 0 0 4px rgba(200,169,106,.07),0 26px 46px -14px rgba(0,0,0,.85),0 10px 34px -10px rgba(200,169,106,.28)}
.home-juego img{width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;display:block;max-width:100%}
.home-juego-tx{padding:13px 16px 15px;display:flex;flex-direction:column;gap:5px;min-width:0}
.home-juego small{font-size:.74rem;letter-spacing:.14em;text-transform:uppercase;color:#c8a96a}
.home-juego b{font-family:"Playfair Display",Georgia,serif;font-size:1.45rem;line-height:1.05}
.home-juego-tx>span{font-size:.93rem;line-height:1.5;opacity:.94}
.home-juego em{font-style:normal;font-weight:700;font-size:.95rem;color:var(--sun,#dfbd69);margin-top:5px}
.home-juego:focus-visible{outline:3px solid var(--sun,#dfbd69);outline-offset:3px}
@media (min-width:900px){.home-juego{max-width:760px;margin:24px auto}}
.home-ven{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:14px 16px 4px;padding:14px 16px;border-radius:18px;text-decoration:none;color:#ece5d5;background:rgba(31,49,42,.5);border:1px solid rgba(201,170,106,.3)}
.home-ven-tx{display:flex;flex-direction:column;gap:2px;min-width:0}
.home-ven small{font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;color:#c8a96a}
.home-ven b{font-family:"Playfair Display",Georgia,serif;font-size:1.2rem;color:#f7f4ee;line-height:1.1}
.home-ven-tx>span{font-size:.86rem;color:#cad0c4}
.home-ven em{flex:none;font-style:normal;font-weight:700;font-size:.9rem;color:#e6c98a}
.home-ven:focus-visible{outline:3px solid #dfbd69;outline-offset:3px}
@media (min-width:900px){.home-ven{max-width:760px;margin:14px auto}}
