/* NARA BACK — secciones creadas desde el /admin.
   No existen en el artefacto compilado: se renderizan por JS y se insertan
   antes del bloque de booking. Mantienen el lenguaje del sitio: negro, lima
   ácido, magenta, Anton + Space Mono + Manrope, brackets y sombras duras. */

.nbs-wrap { position: relative; z-index: 1; }

.nbs {
  background: #000;
  padding: 54px 20px;
  border-top: 1px solid rgba(203, 253, 81, .18);
}
.nbs__inner { max-width: 1056px; margin: 0 auto; }

/* Etiqueta entre brackets, igual que el resto del sitio */
.nbs__kicker {
  display: inline-block;
  font-family: 'Space Mono', ui-monospace, monospace;
  font-size: 10px; font-weight: 700; letter-spacing: .14em;
  text-transform: uppercase;
  color: #CBFD51;
  border: 1px dashed rgba(203, 253, 81, .55);
  padding: 3px 9px;
  margin-bottom: 14px;
}

.nbs__title {
  font-family: 'Anton', 'Roboto Mono', sans-serif;
  font-size: clamp(28px, 8.5vw, 48px);
  line-height: .95;
  letter-spacing: .01em;
  text-transform: uppercase;
  color: #fff;
  margin: 0 0 14px;
}

.nbs__body {
  font-family: 'Manrope', sans-serif;
  font-size: 15px;
  line-height: 1.62;
  color: #c9c9c9;
  margin: 0;
  max-width: 62ch;
  white-space: pre-line;      /* respeta los saltos que escriba el admin */
}

/* ── Imagen + texto ─────────────────────────────────────────────────── */
.nbs--imagen .nbs__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 22px;
  align-items: start;
}
@media (min-width: 760px) {
  .nbs--imagen .nbs__grid { grid-template-columns: 1fr 1fr; gap: 34px; }
  .nbs--imagen.is-flipped .nbs__media { order: 2; }
}
.nbs__media {
  width: 100%;
  aspect-ratio: 4 / 3;
  border: 3px solid #fff;
  box-shadow: 8px 8px 0 rgba(203, 253, 81, .25);
  background: #0c0c0c;
  overflow: hidden;
}
.nbs__media img { width: 100%; height: 100%; object-fit: cover; display: block; }

/* ── Galería ────────────────────────────────────────────────────────── */
.nbs__gallery {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 12px;
  margin-top: 20px;
}
@media (min-width: 760px) { .nbs__gallery { grid-template-columns: repeat(4, 1fr); } }
.nbs__tile {
  aspect-ratio: 1 / 1;
  border: 2px solid rgba(255, 255, 255, .85);
  background: #0c0c0c;
  overflow: hidden;
}
.nbs__tile img { width: 100%; height: 100%; object-fit: cover; display: block; }

/* ── CTA ────────────────────────────────────────────────────────────── */
.nbs--cta .nbs__inner {
  border: 2px dashed #CBFD51;
  padding: 30px 22px;
  text-align: center;
}
.nbs--cta .nbs__body { margin-left: auto; margin-right: auto; }
.nbs__btn {
  display: inline-flex;
  align-items: center; justify-content: center;
  margin-top: 20px;
  padding: 14px 26px;
  min-height: 48px;
  background: #CBFD51;
  color: #000 !important;
  border: 2px solid #000;
  box-shadow: 5px 5px 0 #EC5CCE;
  font-family: 'Anton', 'Roboto Mono', sans-serif;
  font-size: 18px; letter-spacing: .035em;
  text-transform: uppercase; text-decoration: none;
  transition: transform .12s cubic-bezier(.22,.9,.3,1), box-shadow .12s cubic-bezier(.22,.9,.3,1);
}
.nbs__btn:active { transform: translate(4px, 4px); box-shadow: 1px 1px 0 #EC5CCE; }

@media (prefers-reduced-motion: reduce) { .nbs__btn { transition: none; } }