/* ══════════════════════════════════════════════════════════════════════
   UMBRAL EN ABIERTO — lo poco que le falta a mesa.css cuando el
   reglamento se sirve suelto, sin la barra lateral de la aplicación.
   ══════════════════════════════════════════════════════════════════════ */

.umbral-publico .wrap{
  width:min(100% - 2.4rem, 1120px);
  margin-inline:auto;
  padding:26px 0 10px;
  position:relative; z-index:1;
}

/* ── Cabecera ────────────────────────────────────────────────────── */
.up-cab{
  position:relative; z-index:2;
  display:flex; align-items:center; justify-content:space-between;
  gap:1rem; flex-wrap:wrap;
  width:min(100% - 2.4rem, 1120px); margin-inline:auto;
  padding:18px 0 14px; border-bottom:1px solid var(--line, #e2dccc);
}
.up-marca{
  font-family:var(--title); font-size:22px; letter-spacing:.26em;
  text-transform:uppercase; text-decoration:none; color:var(--fg);
}
/* mesa.css pone todos los <nav> en columna; este va en fila. */
.up-nav{display:flex; flex-direction:row; gap:20px; flex-wrap:wrap; align-items:center}
.up-nav a{
  font-family:var(--caps); font-size:13px; letter-spacing:.14em;
  text-transform:uppercase; text-decoration:none; color:var(--fg-3);
}
.up-nav a:hover{color:var(--clay, #8a5a2b)}

/* ── Portada del reglamento ──────────────────────────────────────── */
.up-titulo{
  font-family:var(--title); font-size:clamp(38px,7vw,62px); font-weight:500;
  letter-spacing:.14em; text-transform:uppercase; margin:.4em 0 .1em; color:var(--fg);
}
.up-lede{
  font-size:20px; font-style:italic; color:var(--fg-2);
  max-width:56ch; margin:0 0 1.6em;
}

/* ── Pie ─────────────────────────────────────────────────────────── */
.up-pie{
  position:relative; z-index:1;
  width:min(100% - 2.4rem, 1120px); margin:48px auto 0;
  padding:22px 0 40px; border-top:1px solid var(--line, #e2dccc);
  font-size:16px; color:var(--fg-2);
}
.up-pie p{margin:0 0 .4em}
.up-pie a{color:var(--clay, #8a5a2b)}

@media (max-width:640px){
  .up-cab{padding-bottom:10px}
  .up-marca{font-size:19px}
  .up-nav{gap:14px}
  .up-nav a{font-size:12px}
}

/* ── Rejilla del índice ──────────────────────────────────────────── */
.up-lede-2{font-style:normal; font-size:18px; color:var(--fg-2)}
.up-lede-2 a{color:var(--clay, #8a5a2b)}
.up-rejilla{
  display:grid; grid-template-columns:repeat(auto-fill, minmax(260px, 1fr));
  gap:14px; margin:26px 0 10px;
}
/* Las tarjetas las pone mesa.css (.tarjeta-libro): son las mismas que en la app. */

/* La cabecera no se parte en tres líneas */
.up-nav{flex-direction:row; flex-wrap:nowrap}
.up-nav a{display:inline-block; white-space:nowrap}


/* ── Detrás de la puerta ─────────────────────────────────────────────
   Las dos tarjetas que no llevan a un archivo sino a la app, y que piden
   entrar. Se distinguen sin gritar: el filo punteado en vez de macizo y una
   palabra en la esquina. Lo que las separa del resto es que ahí se acaba lo
   abierto, y eso tiene que verse antes de pinchar. */
.up-seccion{
  font-family:var(--title, Georgia, serif); font-weight:500;
  font-size:clamp(22px, 3vw, 28px); margin:38px 0 4px;
  padding-top:24px; border-top:1px solid var(--line-2, #e2d8c4);
}
.tarjeta-cerrada{ border-style:dashed; border-left-style:solid; }
.tarjeta-cerrada .llave{
  position:absolute; top:14px; right:16px;
  font-family:var(--caps, Georgia, serif); font-size:10.5px; letter-spacing:.16em;
  text-transform:uppercase; color:var(--tono, #7a6a55);
  border:1px solid currentColor; border-radius:999px; padding:3px 8px;
}
.tarjeta-cerrada p{ padding-right:6px; }
@media (max-width:420px){ .tarjeta-cerrada .llave{ position:static; display:inline-block; margin-top:10px; } }