/* ============================================================
   KERUTO — FICHA BLOQUEADA (proyecto bajo petición)
   Vista que ve quien no tiene acceso: título, categorías, aviso
   y CTA. El contenido protegido no se llega a generar.
   ============================================================ */

.ker-bloqueo {
  --u: min( calc(100vw / 1480), calc(100vh / 1064) );
  box-sizing: border-box;
  min-height: 100vh;
  padding: calc(260 * var(--u)) calc(76 * var(--u)) calc(80 * var(--u));
  font-family: var(--font-body);
  color: var(--ker-ink);
}

.ker-bloqueo__inner {
  max-width: calc(1100 * var(--u));
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: calc(18 * var(--u));
}

.ker-bloqueo__back {
  align-self: flex-start;
  font-family: var(--font-display);
  font-size: calc(24 * var(--u));
  color: var(--ker-ink);
  text-decoration: none;
  border-bottom: calc(3 * var(--u)) solid var(--ker-black);
  padding-bottom: calc(2 * var(--u));
}

.ker-bloqueo__back:hover { color: var(--ker-green); border-color: var(--ker-green); }

.ker-bloqueo__eyebrow {
  margin: calc(20 * var(--u)) 0 0;
  font-family: var(--font-display);
  font-size: calc(22 * var(--u));
  color: var(--ker-green);
}

.ker-bloqueo__title {
  margin: 0;
  font-family: var(--font-display);
  font-weight: 400;
  font-size: calc(56 * var(--u));
  line-height: 1.08;
  color: var(--ker-black);
}

.ker-bloqueo__cats {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: calc(12 * var(--u));
}

.ker-bloqueo__cats a {
  display: inline-block;
  padding: calc(4 * var(--u)) calc(16 * var(--u)) calc(8 * var(--u));
  border: calc(2 * var(--u)) solid var(--ker-black);
  border-radius: calc(13 * var(--u));
  background: var(--ker-yellow);
  color: var(--ker-black);
  text-decoration: none;
  font-family: var(--font-display);
  font-size: calc(22 * var(--u));
  line-height: 1.1;
}

.ker-bloqueo__cats a:hover { background: var(--ker-green); color: #fff; }

.ker-bloqueo__figure {
  margin: calc(12 * var(--u)) 0 0;
  border: calc(4 * var(--u)) solid var(--ker-black);
  border-radius: calc(18 * var(--u));
  overflow: hidden;
  background: var(--ker-placeholder);
}

.ker-bloqueo__img {
  display: block;
  width: 100%;
  height: auto;
  filter: blur(calc(14 * var(--u))) saturate(.75);
  transform: scale(1.06);
}

.ker-bloqueo__teaser {
  margin: calc(8 * var(--u)) 0 0;
  font-size: calc(24 * var(--u));
  line-height: 1.45;
  max-width: calc(820 * var(--u));
}

.ker-bloqueo__card {
  margin-top: calc(16 * var(--u));
  padding: calc(36 * var(--u)) calc(40 * var(--u)) calc(32 * var(--u));
  background: var(--ker-paper);
  border: calc(5 * var(--u)) solid var(--ker-black);
  border-radius: calc(24 * var(--u));
  box-sizing: border-box;
  max-width: calc(720 * var(--u));
}

.ker-bloqueo__card-title {
  margin: 0 0 calc(12 * var(--u));
  font-family: var(--font-display);
  font-weight: 400;
  font-size: calc(34 * var(--u));
  line-height: 1.15;
  color: var(--ker-black);
}

.ker-bloqueo__error {
  margin: 0 0 calc(12 * var(--u));
  padding: calc(10 * var(--u)) calc(16 * var(--u));
  border-left: calc(6 * var(--u)) solid var(--ker-green);
  background: var(--ker-hover);
  font-size: calc(20 * var(--u));
}

.ker-bloqueo__msg {
  margin: 0 0 calc(22 * var(--u));
  font-size: calc(22 * var(--u));
  line-height: 1.5;
}

.ker-bloqueo__actions {
  display: flex;
  flex-wrap: wrap;
  gap: calc(14 * var(--u));
}

.ker-bloqueo__hint {
  margin: calc(20 * var(--u)) 0 0;
  font-size: calc(19 * var(--u));
  color: rgba(29, 29, 29, .72);
}

.ker-bloqueo__hint a {
  color: var(--ker-black);
  text-decoration: underline;
  text-underline-offset: 3px;
}

.ker-bloqueo__hint a:hover { color: var(--ker-green); }

/* (La clase .ker-thumb-locked del grid vive en ker-site.css: se necesita en
   /portfolio/, donde no se carga esta hoja.) */

@media (max-width: 767px) {
  .ker-bloqueo {
    --u: 1px;
    padding: 24px 16px 56px;
    min-height: 0;
  }
  .ker-bloqueo__inner { gap: 12px; }
  .ker-bloqueo__back { font-size: 16px; }
  .ker-bloqueo__eyebrow { margin-top: 12px; font-size: 15px; }
  .ker-bloqueo__title { font-size: 30px; }
  .ker-bloqueo__cats { gap: 8px; }
  .ker-bloqueo__cats a { padding: 3px 10px 6px; border-radius: 10px; font-size: 14px; }
  .ker-bloqueo__figure { border-width: 3px; border-radius: 14px; }
  .ker-bloqueo__img { filter: blur(9px) saturate(.75); }
  .ker-bloqueo__teaser { font-size: 15px; }
  .ker-bloqueo__card {
    padding: 22px 18px;
    border-width: 3px;
    border-radius: 16px;
    max-width: none;
  }
  .ker-bloqueo__card-title { font-size: 21px; }
  .ker-bloqueo__msg { font-size: 15px; margin-bottom: 16px; }
  .ker-bloqueo__hint { font-size: 13px; margin-top: 16px; }
}
