/* =========================================================
   BIBLIOTECA FALCO®
   REDISEÑO INSTITUCIONAL 2026
   Estudio Pericial Psicológico FALCO®
========================================================= */


/* =========================================================
   VARIABLES
========================================================= */

:root {

  --bf-bg: #07101d;
  --bf-bg-deep: #030915;

  --bf-panel: rgba(14, 27, 45, 0.82);
  --bf-panel-soft: rgba(255, 255, 255, 0.035);

  --bf-line: rgba(214, 177, 100, 0.20);
  --bf-line-soft: rgba(255, 255, 255, 0.08);

  --bf-gold: #d6b164;
  --bf-gold-light: #f0d79d;

  --bf-text: #f4f6f8;
  --bf-muted: #9ba8b7;
  --bf-muted-2: #718094;

  --bf-max: 1240px;
  --bf-radius: 24px;

  --bf-shadow:
    0 30px 80px rgba(0, 0, 0, 0.35);

}


/* =========================================================
   RESET LOCAL
========================================================= */

* {
  box-sizing: border-box;
}


html {
  scroll-behavior: smooth;
}


body.biblioteca-premium {

  margin: 0;

  min-height: 100vh;

  overflow-x: hidden;

  color: var(--bf-text);

  background:

    radial-gradient(
      circle at 12% 10%,
      rgba(40, 75, 124, 0.18),
      transparent 30%
    ),

    radial-gradient(
      circle at 88% 18%,
      rgba(214, 177, 100, 0.09),
      transparent 24%
    ),

    linear-gradient(
      180deg,
      #07101d 0%,
      #050b14 46%,
      #030812 100%
    );

  font-family:
    "Inter",
    "Montserrat",
    system-ui,
    -apple-system,
    BlinkMacSystemFont,
    "Segoe UI",
    sans-serif;

}


body.biblioteca-premium a {
  color: inherit;
}


/* =========================================================
   CONTENEDOR GENERAL
========================================================= */

.bf-shell {

  width:
    min(
      var(--bf-max),
      calc(100% - 64px)
    );

  margin:
    0 auto;

}


/* =========================================================
   ATMÓSFERA
========================================================= */

.bf-noise {

  position: fixed;

  inset: 0;

  z-index: 0;

  pointer-events: none;

  opacity: 0.045;

  background-image:

    url(
      "data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.55'/%3E%3C/svg%3E"
    );

}


.bf-glow {

  position: fixed;

  border-radius: 50%;

  filter:
    blur(100px);

  pointer-events: none;

  z-index: 0;

  opacity: 0.35;

}


.bf-glow--one {

  width: 420px;
  height: 420px;

  top: 6%;
  left: -180px;

  background:
    rgba(44, 86, 143, 0.28);

}


.bf-glow--two {

  width: 320px;
  height: 320px;

  top: 24%;
  right: -120px;

  background:
    rgba(214, 177, 100, 0.12);

}


/* =========================================================
   HEADER
========================================================= */

.bf-header {

  position: sticky;

  top: 0;

  z-index: 50;

  backdrop-filter:
    blur(22px);

  -webkit-backdrop-filter:
    blur(22px);

  background:
    rgba(4, 10, 19, 0.78);

  border-bottom:
    1px solid var(--bf-line-soft);

}


.bf-header__inner {

  min-height: 82px;

  display: flex;

  align-items: center;

  gap: 28px;

}


/* =========================================================
   MARCA
========================================================= */

.bf-brand {

  display: inline-flex;

  align-items: center;

  gap: 12px;

  margin-right: auto;

  text-decoration: none;

}


.bf-brand img {

  width: 48px;
  height: 48px;

  object-fit: contain;

}


.bf-brand div {

  display: grid;

  line-height: 1.05;

}


.bf-brand span {

  color:
    var(--bf-muted);

  text-transform:
    uppercase;

  letter-spacing:
    0.16em;

  font-size:
    10px;

}


.bf-brand strong {

  margin-top:
    5px;

  font-family:
    "Playfair Display",
    Georgia,
    serif;

  font-size:
    20px;

  letter-spacing:
    0.08em;

}


/* =========================================================
   NAVEGACIÓN
========================================================= */

.bf-header__nav {

  display: flex;

  gap: 26px;

}


.bf-header__nav a,
.bf-link-system {

  text-decoration:
    none;

  color:
    var(--bf-muted);

  font-size:
    13px;

  transition:
    color 0.25s ease;

}


.bf-header__nav a:hover,
.bf-link-system:hover {

  color:
    var(--bf-gold-light);

}


.bf-header__actions {

  display: flex;

  align-items: center;

  gap: 14px;

}


/* =========================================================
   BOTONES
========================================================= */

.bf-btn {

  min-height:
    46px;

  padding:
    0 20px;

  display:
    inline-flex;

  align-items:
    center;

  justify-content:
    center;

  border-radius:
    999px;

  border:
    1px solid transparent;

  text-decoration:
    none;

  font:
    inherit;

  font-size:
    13px;

  font-weight:
    600;

  letter-spacing:
    0.02em;

  cursor:
    pointer;

  transition:

    transform 0.25s ease,
    border-color 0.25s ease,
    background 0.25s ease;

}


.bf-btn:hover {

  transform:
    translateY(-2px);

}


.bf-btn--gold {

  color:
    #08101b !important;

  background:

    linear-gradient(
      135deg,
      var(--bf-gold-light),
      var(--bf-gold)
    );

  box-shadow:

    0 14px 40px
    rgba(214, 177, 100, 0.16);

}


.bf-btn--outline,
.bf-btn--ghost {

  color:
    var(--bf-text);

  background:
    rgba(255, 255, 255, 0.03);

  border-color:
    var(--bf-line-soft);

}


.bf-btn--outline:hover,
.bf-btn--ghost:hover {

  border-color:
    rgba(214, 177, 100, 0.45);

  background:
    rgba(214, 177, 100, 0.06);

}


/* =========================================================
   HERO
========================================================= */

.bf-hero {

  position:
    relative;

  z-index:
    1;

  min-height:
    calc(100vh - 82px);

  display:
    grid;

  align-items:
    center;

  padding:
    90px 0 110px;

  border-bottom:
    1px solid var(--bf-line-soft);

}


.bf-hero::before {

  content:
    "";

  position:
    absolute;

  inset:
    0;

  pointer-events:
    none;

  background:

    linear-gradient(
      90deg,
      transparent 0 49.92%,
      rgba(255, 255, 255, 0.022) 50%,
      transparent 50.08%
    );

}


.bf-hero__grid {

  display:
    grid;

  grid-template-columns:

    minmax(0, 1.25fr)
    minmax(320px, 0.75fr);

  gap:
    clamp(56px, 8vw, 120px);

  align-items:
    center;

}


/* =========================================================
   EYEBROW
========================================================= */

.bf-eyebrow,
.bf-kicker {

  display:
    inline-flex;

  align-items:
    center;

  gap:
    11px;

  color:
    var(--bf-gold-light);

  text-transform:
    uppercase;

  letter-spacing:
    0.22em;

  font-size:
    11px;

  font-weight:
    700;

}


.bf-eyebrow span {

  width:
    38px;

  height:
    1px;

  background:
    var(--bf-gold);

}


/* =========================================================
   HERO TÍTULO
========================================================= */

.bf-hero h1 {

  margin:
    28px 0 24px;

  max-width:
    850px;

  font-family:
    "Playfair Display",
    Georgia,
    serif;

  font-size:
    clamp(54px, 7.3vw, 102px);

  font-weight:
    500;

  line-height:
    0.96;

  letter-spacing:
    -0.035em;

}


.bf-hero h1 em {

  display:
    block;

  margin-top:
    10px;

  color:
    var(--bf-gold-light);

  font-weight:
    400;

}


.bf-hero__lead {

  max-width:
    760px;

  color:
    var(--bf-muted);

  font-size:
    clamp(17px, 1.45vw, 21px);

  line-height:
    1.75;

}


.bf-hero__actions {

  display:
    flex;

  gap:
    12px;

  flex-wrap:
    wrap;

  margin-top:
    34px;

}


/* =========================================================
   ESTADO ACCESO
========================================================= */

.bf-access-state {

  margin-top:
    30px;

  display:
    inline-flex;

  gap:
    9px;

  align-items:
    center;

  color:
    var(--bf-muted-2);

  font-size:
    12px;

}


.bf-access-state__dot {

  width:
    7px;

  height:
    7px;

  border-radius:
    50%;

  background:
    var(--bf-gold);

  box-shadow:

    0 0 0 6px
    rgba(214, 177, 100, 0.07);

}


.bf-access-state.is-ready {

  color:
    var(--bf-muted);

}


/* =========================================================
   PANEL HERO
========================================================= */

.bf-hero__panel {

  padding:
    36px;

  border:
    1px solid var(--bf-line);

  border-radius:
    var(--bf-radius);

  background:

    linear-gradient(
      145deg,
      rgba(20, 39, 63, 0.72),
      rgba(8, 18, 31, 0.72)
    );

  box-shadow:
    var(--bf-shadow);

  backdrop-filter:
    blur(18px);

}


.bf-panel-kicker {

  color:
    var(--bf-gold);

  text-transform:
    uppercase;

  letter-spacing:
    0.18em;

  font-size:
    10px;

}


.bf-hero__panel h2 {

  margin:
    14px 0 28px;

  font-family:
    "Playfair Display",
    Georgia,
    serif;

  font-size:
    34px;

  font-weight:
    500;

  line-height:
    1.15;

}


/* =========================================================
   MÉTRICAS HERO
========================================================= */

.bf-hero__metrics {

  display:
    grid;

  grid-template-columns:
    repeat(3, 1fr);

  gap:
    14px;

}


.bf-hero__metrics div {

  padding:
    18px 12px;

  border-left:
    1px solid var(--bf-line-soft);

}


.bf-hero__metrics div:first-child {

  border-left:
    0;

  padding-left:
    0;

}


.bf-hero__metrics strong {

  display:
    block;

  font-family:
    "Playfair Display",
    Georgia,
    serif;

  color:
    var(--bf-gold-light);

  font-size:
    30px;

  font-weight:
    500;

}


.bf-hero__metrics span {

  color:
    var(--bf-muted-2);

  font-size:
    11px;

}


.bf-hero__line {

  height:
    1px;

  margin:
    26px 0 22px;

  background:

    linear-gradient(
      90deg,
      var(--bf-line),
      transparent
    );

}


.bf-hero__panel p {

  color:
    var(--bf-muted);

  line-height:
    1.7;

  font-size:
    13px;

}


/* =========================================================
   INDICADOR SCROLL
========================================================= */

.bf-hero__scroll {

  position:
    absolute;

  bottom:
    30px;

  left:
    50%;

  display:
    flex;

  align-items:
    center;

  gap:
    10px;

  transform:
    translateX(-50%);

  color:
    var(--bf-muted-2);

  text-transform:
    uppercase;

  letter-spacing:
    0.22em;

  font-size:
    9px;

}


.bf-hero__scroll span {

  width:
    32px;

  height:
    1px;

  background:
    var(--bf-line);

}


/* =========================================================
   SECCIONES
========================================================= */

.bf-section {

  position:
    relative;

  z-index:
    1;

  padding:
    110px 0;

}


.bf-section--collections {

  background:
    rgba(255, 255, 255, 0.012);

}


/* =========================================================
   ENCABEZADOS DE SECCIÓN
========================================================= */

.bf-section-head {

  display:
    grid;

  grid-template-columns:

    1fr
    minmax(280px, 460px);

  gap:
    60px;

  align-items:
    end;

  margin-bottom:
    54px;

}


.bf-section-head h2 {

  margin:
    14px 0 0;

  max-width:
    760px;

  font-family:
    "Playfair Display",
    Georgia,
    serif;

  font-size:
    clamp(38px, 5vw, 62px);

  line-height:
    1.03;

  font-weight:
    500;

}


.bf-section-head > p {

  margin:
    0;

  color:
    var(--bf-muted);

  line-height:
    1.8;

}


/* =========================================================
   COLECCIONES
========================================================= */

.bf-collection-grid {

  display:
    grid;

  grid-template-columns:
    repeat(4, 1fr);

  border-top:
    1px solid var(--bf-line-soft);

  border-left:
    1px solid var(--bf-line-soft);

}


.bf-collection {

  min-height:
    330px;

  padding:
    28px;

  display:
    flex;

  flex-direction:
    column;

  position:
    relative;

  background:
    rgba(255, 255, 255, 0.015);

  border-right:
    1px solid var(--bf-line-soft);

  border-bottom:
    1px solid var(--bf-line-soft);

  transition:

    background 0.3s ease,
    transform 0.3s ease,
    border-color 0.3s ease;

}


.bf-collection:hover {

  z-index:
    2;

  background:
    rgba(214, 177, 100, 0.055);

  transform:
    translateY(-5px);

}


.bf-collection--featured {

  background:

    linear-gradient(
      145deg,
      rgba(214, 177, 100, 0.08),
      rgba(30, 55, 88, 0.08)
    );

}


.bf-collection__number {

  color:
    var(--bf-muted-2);

  font-size:
    10px;

  letter-spacing:
    0.15em;

}


.bf-collection__icon {

  margin:
    34px 0 26px;

  color:
    var(--bf-gold);

  font-family:
    "Playfair Display",
    Georgia,
    serif;

  font-size:
    36px;

}


.bf-collection h3 {

  margin:
    0 0 12px;

  font-family:
    "Playfair Display",
    Georgia,
    serif;

  font-size:
    23px;

  font-weight:
    500;

}


.bf-collection p {

  margin:
    0 0 30px;

  color:
    var(--bf-muted);

  line-height:
    1.7;

  font-size:
    13px;

}


.bf-collection__action {

  margin-top:
    auto;

  width:
    fit-content;

  padding:
    0;

  color:
    var(--bf-gold-light);

  border:
    0;

  background:
    none;

  font:
    inherit;

  font-size:
    12px;

  cursor:
    pointer;

}


/* =========================================================
   EXPLORADOR
========================================================= */

.bf-section--explorer {

  padding-bottom:
    48px;

}


.bf-search-panel {

  padding:
    24px;

  border:
    1px solid var(--bf-line-soft);

  border-radius:
    var(--bf-radius);

  background:
    rgba(8, 18, 31, 0.7);

}


/* =========================================================
   BUSCADOR
========================================================= */

.bf-search {

  min-height:
    66px;

  display:
    grid;

  grid-template-columns:
    28px 1fr auto;

  align-items:
    center;

  gap:
    12px;

  padding:
    0 18px;

  border:
    1px solid rgba(214, 177, 100, 0.24);

  border-radius:
    16px;

  background:
    rgba(255, 255, 255, 0.025);

}


.bf-search > span {

  color:
    var(--bf-gold);

  font-size:
    23px;

}


.bf-search input {

  width:
    100%;

  border:
    0;

  outline:
    0;

  color:
    var(--bf-text);

  background:
    transparent;

  font:
    inherit;

  font-size:
    16px;

}


.bf-search input::placeholder {

  color:
    #647287;

}


.bf-search button {

  border:
    0;

  color:
    var(--bf-muted);

  background:
    transparent;

  font:
    inherit;

  font-size:
    12px;

  cursor:
    pointer;

}


/* =========================================================
   FILTROS
========================================================= */

.bf-filter-row {

  display:
    flex;

  gap:
    9px;

  flex-wrap:
    wrap;

  margin-top:
    18px;

}


.bf-filter-row button {

  padding:
    9px 13px;

  border:
    1px solid var(--bf-line-soft);

  border-radius:
    999px;

  color:
    var(--bf-muted);

  background:
    rgba(255, 255, 255, 0.02);

  font:
    inherit;

  font-size:
    11px;

  cursor:
    pointer;

  transition:
    0.25s ease;

}


.bf-filter-row button:hover,
.bf-filter-row button.is-active {

  color:
    #09111b;

  border-color:
    var(--bf-gold);

  background:
    var(--bf-gold);

}


/* =========================================================
   RESUMEN
========================================================= */

.bf-summary {

  margin-top:
    22px;

  display:
    flex;

  align-items:
    flex-start;

  justify-content:
    space-between;

  gap:
    30px;

}


.bf-summary__label {

  display:
    block;

  margin-bottom:
    12px;

  color:
    var(--bf-muted-2);

  text-transform:
    uppercase;

  letter-spacing:
    0.16em;

  font-size:
    9px;

}


.bf-summary__categories {

  display:
    flex;

  flex-wrap:
    wrap;

  gap:
    8px;

}


.resumen-item {

  display:
    inline-flex;

  align-items:
    center;

  gap:
    7px;

  padding:
    8px 11px;

  border:
    1px solid var(--bf-line-soft);

  border-radius:
    999px;

  background:
    rgba(255, 255, 255, 0.02);

  color:
    var(--bf-muted);

  font-size:
    10px;

}


.resumen-item strong {

  color:
    var(--bf-gold-light);

  font-size:
    11px;

}


.bf-results-count {

  flex:
    0 0 auto;

  text-align:
    right;

}


.bf-results-count strong {

  display:
    block;

  color:
    var(--bf-gold-light);

  font-family:
    "Playfair Display",
    Georgia,
    serif;

  font-size:
    34px;

  font-weight:
    500;

}


.bf-results-count span {

  color:
    var(--bf-muted-2);

  font-size:
    10px;

}


/* =========================================================
   RECURSOS
========================================================= */

.bf-section--resources {

  padding-top:
    36px;

}


.bf-resource-grid {

  display:
    grid;

  grid-template-columns:
    repeat(3, 1fr);

  gap:
    18px;

}


/* =========================================================
   TARJETAS FIRESTORE
========================================================= */

.recurso-card {

  min-height:
    420px;

  padding:
    25px;

  display:
    flex;

  flex-direction:
    column;

  border:
    1px solid var(--bf-line-soft);

  border-radius:
    20px;

  background:

    linear-gradient(
      155deg,
      rgba(16, 31, 51, 0.78),
      rgba(7, 16, 28, 0.9)
    );

  box-shadow:

    0 18px 42px
    rgba(0, 0, 0, 0.16);

  transition:

    transform 0.3s ease,
    border-color 0.3s ease,
    box-shadow 0.3s ease;

}


.recurso-card:hover {

  transform:
    translateY(-6px);

  border-color:
    rgba(214, 177, 100, 0.32);

  box-shadow:

    0 28px 60px
    rgba(0, 0, 0, 0.26);

}


/* =========================================================
   CABECERA TARJETA
========================================================= */

.recurso-ficha-top {

  display:
    flex;

  align-items:
    center;

  justify-content:
    space-between;

  gap:
    12px;

  margin-bottom:
    28px;

}


.recurso-clase,
.recurso-formato {

  text-transform:
    uppercase;

  letter-spacing:
    0.13em;

  font-size:
    9px;

}


.recurso-clase {

  color:
    var(--bf-gold-light);

}


.recurso-formato {

  color:
    var(--bf-muted-2);

}


/* =========================================================
   TÍTULO RECURSO
========================================================= */

.recurso-titulo {

  margin:
    0;

  font-family:
    "Playfair Display",
    Georgia,
    serif;

  font-size:
    25px;

  line-height:
    1.18;

  font-weight:
    500;

}


.recurso-descripcion {

  margin:
    14px 0 20px;

  color:
    var(--bf-muted);

  line-height:
    1.7;

  font-size:
    13px;

}


.recurso-separador {

  height:
    1px;

  margin:
    2px 0 18px;

  background:

    linear-gradient(
      90deg,
      var(--bf-line),
      transparent
    );

}


/* =========================================================
   METADATOS
========================================================= */

.recurso-meta {

  display:
    grid;

  grid-template-columns:
    1fr 1fr;

  gap:
    14px 16px;

}


.recurso-meta > div {

  min-width:
    0;

}


.recurso-meta small {

  display:
    block;

  margin-bottom:
    4px;

  color:
    var(--bf-muted-2);

  font-size:
    9px;

  text-transform:
    uppercase;

  letter-spacing:
    0.1em;

}


.recurso-meta strong {

  display:
    block;

  color:
    #d8dee6;

  font-size:
    11px;

  line-height:
    1.45;

  font-weight:
    500;

}


/* =========================================================
   TAGS
========================================================= */

.recurso-tags {

  display:
    flex;

  flex-wrap:
    wrap;

  gap:
    6px;

  margin-top:
    18px;

}


.recurso-tags span {

  padding:
    6px 8px;

  border-radius:
    999px;

  background:
    rgba(255, 255, 255, 0.04);

  color:
    var(--bf-muted);

  font-size:
    9px;

}


/* =========================================================
   BOTONES DE ARCHIVOS
========================================================= */

.recurso-accion {

  margin-top:
    auto;

  padding-top:
    22px;

  display:
    flex;

  flex-wrap:
    wrap;

  gap:
    8px;

}


.btn-acceso-mini {

  padding:
    9px 12px;

  border:
    1px solid rgba(214, 177, 100, 0.28);

  border-radius:
    999px;

  text-decoration:
    none;

  color:
    var(--bf-gold-light) !important;

  background:
    rgba(214, 177, 100, 0.05);

  font-size:
    10px;

  transition:
    0.2s ease;

}


.btn-acceso-mini:hover {

  background:
    rgba(214, 177, 100, 0.11);

  border-color:
    rgba(214, 177, 100, 0.52);

}


.badge-bloqueado {

  color:
    var(--bf-muted-2);

  font-size:
    10px;

}


/* =========================================================
   CARGANDO
========================================================= */

.bf-loading,
.bf-empty {

  min-height:
    260px;

  display:
    grid;

  place-items:
    center;

  align-content:
    center;

  gap:
    10px;

  text-align:
    center;

  color:
    var(--bf-muted);

}


.bf-loading__mark {

  width:
    32px;

  height:
    32px;

  border-radius:
    50%;

  border:
    1px solid rgba(214, 177, 100, 0.22);

  border-top-color:
    var(--bf-gold);

  animation:
    bf-spin 0.8s linear infinite;

}


@keyframes bf-spin {

  to {

    transform:
      rotate(360deg);

  }

}


/* =========================================================
   SIN RESULTADOS
========================================================= */

.bf-empty > span {

  color:
    var(--bf-gold);

  font-size:
    40px;

}


.bf-empty h3 {

  margin:
    4px 0 0;

  font-family:
    "Playfair Display",
    Georgia,
    serif;

  font-size:
    28px;

  font-weight:
    500;

}


.bf-empty p {

  margin:
    0;

}


/* =========================================================
   FRASE INSTITUCIONAL
========================================================= */

.bf-quote {

  position:
    relative;

  z-index:
    1;

  padding:
    110px 0;

  border-top:
    1px solid var(--bf-line-soft);

  border-bottom:
    1px solid var(--bf-line-soft);

  text-align:
    center;

}


.bf-quote__line {

  display:
    block;

  width:
    50px;

  height:
    1px;

  margin:
    0 auto 30px;

  background:
    var(--bf-gold);

}


.bf-quote blockquote {

  max-width:
    900px;

  margin:
    0 auto;

  font-family:
    "Playfair Display",
    Georgia,
    serif;

  font-size:
    clamp(30px, 4.8vw, 54px);

  font-weight:
    400;

  line-height:
    1.2;

}


.bf-quote p {

  margin:
    24px 0 0;

  color:
    var(--bf-muted-2);

  text-transform:
    uppercase;

  letter-spacing:
    0.16em;

  font-size:
    9px;

}


/* =========================================================
   FOOTER
========================================================= */

.bf-footer {

  position:
    relative;

  z-index:
    1;

  padding:
    74px 0 30px;

  background:
    #02070f;

}


.bf-footer__grid {

  display:
    grid;

  grid-template-columns:
    1.6fr 1fr 1fr 1fr;

  gap:
    48px;

}


.bf-footer__brand span {

  display:
    block;

  color:
    var(--bf-muted);

  text-transform:
    uppercase;

  letter-spacing:
    0.14em;

  font-size:
    10px;

}


.bf-footer__brand strong {

  display:
    block;

  margin:
    8px 0 14px;

  font-family:
    "Playfair Display",
    Georgia,
    serif;

  font-size:
    30px;

}


.bf-footer p {

  color:
    var(--bf-muted);

  line-height:
    1.7;

}


.bf-footer h3 {

  margin:
    0 0 16px;

  color:
    var(--bf-gold-light);

  font-size:
    11px;

  text-transform:
    uppercase;

  letter-spacing:
    0.13em;

}


.bf-footer__grid > div:not(:first-child) {

  display:
    flex;

  flex-direction:
    column;

  align-items:
    flex-start;

}


.bf-footer a {

  margin:
    5px 0;

  color:
    var(--bf-muted);

  text-decoration:
    none;

  font-size:
    12px;

}


.bf-footer a:hover {

  color:
    var(--bf-gold-light);

}


.bf-footer__bottom {

  margin-top:
    55px;

  padding-top:
    22px;

  display:
    flex;

  justify-content:
    space-between;

  gap:
    20px;

  border-top:
    1px solid var(--bf-line-soft);

  color:
    #5d6877;

  font-size:
    10px;

}


/* =========================================================
   ANIMACIONES / REVEAL
========================================================= */

.bf-reveal {

  opacity:
    0;

  transform:
    translateY(22px);

  transition:

    opacity 0.75s ease,
    transform 0.75s ease;

}


.bf-reveal.is-visible {

  opacity:
    1;

  transform:
    translateY(0);

}


/* =========================================================
   TABLET GRANDE
========================================================= */

@media
(max-width: 1100px) {

  .bf-header__nav {

    display:
      none;

  }


  .bf-collection-grid {

    grid-template-columns:
      repeat(2, 1fr);

  }


  .bf-resource-grid {

    grid-template-columns:
      repeat(2, 1fr);

  }


  .bf-footer__grid {

    grid-template-columns:
      repeat(2, 1fr);

  }

}


/* =========================================================
   TABLET
========================================================= */

@media
(max-width: 820px) {

  .bf-shell {

    width:
      min(
        calc(100% - 32px),
        var(--bf-max)
      );

  }


  .bf-header__inner {

    min-height:
      70px;

  }


  .bf-brand span,
  .bf-link-system {

    display:
      none;

  }


  .bf-hero {

    min-height:
      auto;

    padding:
      72px 0 90px;

  }


  .bf-hero__grid,
  .bf-section-head {

    grid-template-columns:
      1fr;

    gap:
      34px;

  }


  .bf-hero h1 {

    font-size:
      clamp(46px, 13vw, 72px);

  }


  .bf-section {

    padding:
      78px 0;

  }


  .bf-summary {

    flex-direction:
      column;

  }


  .bf-results-count {

    text-align:
      left;

  }

}


/* =========================================================
   MÓVIL
========================================================= */

@media
(max-width: 620px) {

  .bf-header__actions .bf-link-system {

    display:
      none;

  }


  .bf-brand img {

    width:
      40px;

    height:
      40px;

  }


  .bf-collection-grid,
  .bf-resource-grid,
  .bf-footer__grid {

    grid-template-columns:
      1fr;

  }


  .bf-collection {

    min-height:
      280px;

  }


  .bf-hero__panel {

    padding:
      25px;

  }


  .bf-hero__metrics {

    grid-template-columns:
      1fr 1fr;

  }


  .bf-search {

    grid-template-columns:
      24px 1fr;

  }


  .bf-search button {

    display:
      none;

  }


  .recurso-meta {

    grid-template-columns:
      1fr;

  }


  .bf-footer__bottom {

    flex-direction:
      column;

  }

}


/* =========================================================
   OCULTAR CORRECTAMENTE ESTADOS DINÁMICOS
========================================================= */

.bf-loading[hidden],
.bf-empty[hidden] {
  display: none !important;
}


/* =========================================================
   FILTROS SECUNDARIOS DE ESCRITOS
========================================================= */

.bf-filter-row--secondary {

  margin-top: 12px;

  padding-top: 14px;

  border-top:
    1px solid rgba(255, 255, 255, 0.06);

}


.bf-filter-row--secondary::before {

  content:
    "Filtrar escritos";

  width:
    100%;

  margin-bottom:
    3px;

  color:
    var(--bf-muted-2);

  text-transform:
    uppercase;

  letter-spacing:
    0.14em;

  font-size:
    9px;

}


.bf-filter-row--secondary[hidden] {

  display:
    none !important;

}


/* =========================================================
   BIBLIOTECA FALCO®
   FICHA TÉCNICA DE INSTRUMENTOS
========================================================= */


/* =========================================================
   HERO INSTRUMENTO
========================================================= */

.bf-instrument-hero {

  min-height:
    auto;

  padding-top:
    100px;

  padding-bottom:
    90px;

}


.bf-instrument-hero .bf-hero__content {

  max-width:
    820px;

}


/* =========================================================
   RESUMEN RÁPIDO
========================================================= */

.bf-instrument-summary {

  display:
    grid;

  grid-template-columns:
    1fr 1fr;

  gap:
    18px;

}


.bf-instrument-summary > div {

  padding:
    16px 0;

  border-bottom:
    1px solid var(--bf-line-soft);

}


.bf-instrument-summary small {

  display:
    block;

  margin-bottom:
    7px;

  color:
    var(--bf-muted-2);

  text-transform:
    uppercase;

  letter-spacing:
    0.12em;

  font-size:
    9px;

}


.bf-instrument-summary strong {

  display:
    block;

  color:
    var(--bf-text);

  font-size:
    13px;

  line-height:
    1.5;

  font-weight:
    500;

}


/* =========================================================
   ESTADO LEGAL / ACCESO
========================================================= */

.bf-instrument-access {

  display:
    flex;

  justify-content:
    space-between;

  gap:
    20px;

  padding:
    12px 0;

  border-bottom:
    1px solid var(--bf-line-soft);

}


.bf-instrument-access:last-child {

  border-bottom:
    0;

}


.bf-instrument-access span {

  color:
    var(--bf-muted-2);

  font-size:
    11px;

}


.bf-instrument-access strong {

  color:
    var(--bf-gold-light);

  text-align:
    right;

  font-size:
    11px;

  font-weight:
    600;

}


/* =========================================================
   AVISO DE USO RESPONSABLE
========================================================= */

.bf-section--instrument-note {

  padding:
    50px 0;

}


.bf-instrument-note {

  padding:
    28px 32px;

  border:
    1px solid rgba(214, 177, 100, 0.18);

  border-radius:
    20px;

  background:

    linear-gradient(
      145deg,
      rgba(214, 177, 100, 0.035),
      rgba(25, 49, 78, 0.07)
    );

}


.bf-instrument-note p {

  max-width:
    980px;

  margin:
    16px 0 0;

  color:
    var(--bf-muted);

  font-size:
    14px;

  line-height:
    1.8;

}


/* =========================================================
   NAVEGACIÓN SUPERIOR DE LA FICHA
========================================================= */

.bf-section--instrument-nav {

  padding:
    0 0 36px;

}


.bf-instrument-nav {

  display:
    flex;

  flex-wrap:
    wrap;

  gap:
    8px;

  padding:
    16px;

  border:
    1px solid var(--bf-line-soft);

  border-radius:
    18px;

  background:
    rgba(8, 18, 31, 0.66);

}


.bf-instrument-nav a {

  padding:
    9px 12px;

  border:
    1px solid transparent;

  border-radius:
    999px;

  text-decoration:
    none;

  color:
    var(--bf-muted);

  background:
    rgba(255, 255, 255, 0.025);

  font-size:
    10px;

  transition:
    0.2s ease;

}


.bf-instrument-nav a:hover {

  color:
    var(--bf-gold-light);

  border-color:
    rgba(214, 177, 100, 0.22);

  background:
    rgba(214, 177, 100, 0.05);

}


/* =========================================================
   LAYOUT PRINCIPAL
========================================================= */

.bf-section--instrument-content {

  padding-top:
    50px;

}


.bf-instrument-layout {

  display:
    grid;

  grid-template-columns:
    250px minmax(0, 1fr);

  gap:
    55px;

  align-items:
    start;

}


/* =========================================================
   ÍNDICE LATERAL
========================================================= */

.bf-instrument-sidebar {

  position:
    sticky;

  top:
    110px;

  padding:
    24px;

  border:
    1px solid var(--bf-line-soft);

  border-radius:
    20px;

  background:
    rgba(8, 18, 31, 0.72);

  backdrop-filter:
    blur(16px);

}


.bf-instrument-sidebar nav {

  display:
    flex;

  flex-direction:
    column;

  gap:
    5px;

  margin-top:
    18px;

}


.bf-instrument-sidebar a {

  padding:
    8px 0;

  text-decoration:
    none;

  color:
    var(--bf-muted);

  font-size:
    11px;

  line-height:
    1.45;

  border-bottom:
    1px solid rgba(255, 255, 255, 0.045);

  transition:
    color 0.2s ease,
    padding-left 0.2s ease;

}


.bf-instrument-sidebar a:last-child {

  border-bottom:
    0;

}


.bf-instrument-sidebar a:hover {

  color:
    var(--bf-gold-light);

  padding-left:
    4px;

}


/* =========================================================
   CONTENIDO CENTRAL
========================================================= */

.bf-instrument-main {

  min-width:
    0;

}


/* =========================================================
   SECCIONES
========================================================= */

.bf-instrument-section {

  position:
    relative;

  padding:
    42px 0 54px;

  border-bottom:
    1px solid var(--bf-line-soft);

}


.bf-instrument-section:first-child {

  padding-top:
    0;

}


.bf-instrument-section:last-child {

  border-bottom:
    0;

}


.bf-instrument-section--featured {

  margin:
    32px 0;

  padding:
    38px;

  border:
    1px solid rgba(214, 177, 100, 0.18);

  border-radius:
    24px;

  background:

    linear-gradient(
      145deg,
      rgba(214, 177, 100, 0.045),
      rgba(14, 31, 51, 0.55)
    );

}


.bf-instrument-number {

  position:
    absolute;

  top:
    40px;

  right:
    0;

  color:
    rgba(214, 177, 100, 0.22);

  font-family:
    "Playfair Display",
    Georgia,
    serif;

  font-size:
    54px;

  line-height:
    1;

}


.bf-instrument-section:first-child
.bf-instrument-number {

  top:
    0;

}


.bf-instrument-section--featured
.bf-instrument-number {

  top:
    32px;

  right:
    32px;

}


/* =========================================================
   TÍTULOS
========================================================= */

.bf-instrument-section h2 {

  max-width:
    850px;

  margin:
    12px 0 24px;

  padding-right:
    90px;

  font-family:
    "Playfair Display",
    Georgia,
    serif;

  font-size:
    clamp(30px, 4vw, 46px);

  font-weight:
    500;

  line-height:
    1.08;

}


/* =========================================================
   TEXTO DE LA FICHA
========================================================= */

.bf-instrument-content {

  max-width:
    900px;

  color:
    var(--bf-muted);

  font-size:
    14px;

  line-height:
    1.85;

}


.bf-instrument-content p {

  margin:
    0 0 18px;

}


.bf-instrument-content p:last-child {

  margin-bottom:
    0;

}


.bf-instrument-content strong {

  color:
    var(--bf-text);

  font-weight:
    600;

}


.bf-instrument-content em {

  color:
    var(--bf-gold-light);

}


/* =========================================================
   LISTAS
========================================================= */

.bf-instrument-content ul,
.bf-instrument-content ol {

  margin:
    18px 0 22px;

  padding-left:
    22px;

}


.bf-instrument-content li {

  margin-bottom:
    9px;

  padding-left:
    4px;

}


.bf-instrument-content li::marker {

  color:
    var(--bf-gold);

}


/* =========================================================
   TABLAS TÉCNICAS
========================================================= */

.bf-instrument-table {

  width:
    100%;

  margin:
    22px 0;

  border-collapse:
    collapse;

  overflow:
    hidden;

  border:
    1px solid var(--bf-line-soft);

  border-radius:
    14px;

}


.bf-instrument-table th,
.bf-instrument-table td {

  padding:
    13px 15px;

  border-bottom:
    1px solid var(--bf-line-soft);

  text-align:
    left;

  vertical-align:
    top;

}


.bf-instrument-table th {

  width:
    30%;

  color:
    var(--bf-gold-light);

  background:
    rgba(214, 177, 100, 0.04);

  font-size:
    10px;

  text-transform:
    uppercase;

  letter-spacing:
    0.08em;

}


.bf-instrument-table td {

  color:
    var(--bf-muted);

  font-size:
    12px;

  line-height:
    1.6;

}


.bf-instrument-table tr:last-child th,
.bf-instrument-table tr:last-child td {

  border-bottom:
    0;

}


/* =========================================================
   CAJAS INFORMATIVAS
========================================================= */

.bf-instrument-callout {

  margin:
    22px 0;

  padding:
    20px 22px;

  border-left:
    2px solid var(--bf-gold);

  border-radius:
    0 14px 14px 0;

  background:
    rgba(214, 177, 100, 0.045);

}


.bf-instrument-callout strong {

  display:
    block;

  margin-bottom:
    6px;

  color:
    var(--bf-gold-light);

}


/* =========================================================
   EJEMPLO DE REDACCIÓN
========================================================= */

.bf-instrument-example {

  margin:
    22px 0;

  padding:
    24px;

  border:
    1px solid var(--bf-line-soft);

  border-radius:
    16px;

  background:
    rgba(255, 255, 255, 0.025);

  color:
    #d5dce4;

  font-family:
    Georgia,
    "Times New Roman",
    serif;

  font-size:
    14px;

  line-height:
    1.85;

}


/* =========================================================
   BIBLIOGRAFÍA
========================================================= */

.bf-instrument-reference {

  margin:
    0 0 12px;

  padding-bottom:
    12px;

  border-bottom:
    1px solid var(--bf-line-soft);

}


.bf-instrument-reference:last-child {

  border-bottom:
    0;

}


/* =========================================================
   BADGES
========================================================= */

.bf-instrument-badges {

  display:
    flex;

  flex-wrap:
    wrap;

  gap:
    8px;

  margin:
    18px 0;

}


.bf-instrument-badge {

  padding:
    7px 10px;

  border:
    1px solid rgba(214, 177, 100, 0.18);

  border-radius:
    999px;

  color:
    var(--bf-gold-light);

  background:
    rgba(214, 177, 100, 0.04);

  font-size:
    9px;

  text-transform:
    uppercase;

  letter-spacing:
    0.08em;

}


/* =========================================================
   ESTADO DE CARGA
========================================================= */

.bf-instrument-loading {

  min-height:
    300px;

  display:
    grid;

  place-items:
    center;

  color:
    var(--bf-muted);

}


/* =========================================================
   RESPONSIVE
========================================================= */

@media
(max-width: 1050px) {

  .bf-instrument-layout {

    grid-template-columns:
      1fr;

  }


  .bf-instrument-sidebar {

    position:
      relative;

    top:
      auto;

  }


  .bf-instrument-sidebar nav {

    display:
      grid;

    grid-template-columns:
      repeat(3, 1fr);

    gap:
      8px;

  }

}


@media
(max-width: 760px) {

  .bf-instrument-summary {

    grid-template-columns:
      1fr;

  }


  .bf-instrument-nav {

    overflow-x:
      auto;

    flex-wrap:
      nowrap;

  }


  .bf-instrument-nav a {

    flex:
      0 0 auto;

  }


  .bf-instrument-sidebar nav {

    grid-template-columns:
      1fr 1fr;

  }


  .bf-instrument-section--featured {

    padding:
      26px;

  }


  .bf-instrument-section h2 {

    padding-right:
      60px;

  }


  .bf-instrument-number {

    font-size:
      42px;

  }

}


@media
(max-width: 520px) {

  .bf-instrument-sidebar nav {

    grid-template-columns:
      1fr;

  }


  .bf-instrument-section h2 {

    padding-right:
      0;

  }


  .bf-instrument-number {

    position:
      static;

    display:
      block;

    margin-bottom:
      10px;

    font-size:
      30px;

  }


  .bf-instrument-table th,
  .bf-instrument-table td {

    display:
      block;

    width:
      100%;

  }


  .bf-instrument-table th {

    border-bottom:
      0;

  }

}


/* =========================================================
   SERVICIO PROFESIONAL — INSTRUMENTOS
========================================================= */

.bf-section--instrument-service {
  padding: 80px 0 110px;
}


.bf-instrument-service {

  display: grid;

  grid-template-columns:
    minmax(0, 1.45fr)
    minmax(280px, 0.55fr);

  gap:
    50px;

  padding:
    42px;

  border:
    1px solid rgba(214, 177, 100, 0.20);

  border-radius:
    28px;

  background:

    linear-gradient(
      145deg,
      rgba(214, 177, 100, 0.045),
      rgba(12, 28, 47, 0.68)
    );

  box-shadow:
    0 28px 70px rgba(0, 0, 0, 0.22);

}


.bf-instrument-service__content h2 {

  max-width:
    800px;

  margin:
    14px 0 24px;

  font-family:
    "Playfair Display",
    Georgia,
    serif;

  font-size:
    clamp(34px, 4vw, 52px);

  font-weight:
    500;

  line-height:
    1.05;

}


.bf-instrument-service__content > p {

  max-width:
    850px;

  color:
    var(--bf-muted);

  font-size:
    14px;

  line-height:
    1.8;

}


.bf-instrument-service__grid {

  display:
    grid;

  grid-template-columns:
    repeat(2, 1fr);

  gap:
    14px;

  margin-top:
    32px;

}


.bf-instrument-service__grid > div {

  padding:
    20px;

  border:
    1px solid var(--bf-line-soft);

  border-radius:
    16px;

  background:
    rgba(255, 255, 255, 0.02);

}


.bf-instrument-service__grid span {

  display:
    block;

  margin-bottom:
    12px;

  color:
    rgba(214, 177, 100, 0.45);

  font-family:
    "Playfair Display",
    Georgia,
    serif;

  font-size:
    24px;

}


.bf-instrument-service__grid strong {

  display:
    block;

  margin-bottom:
    8px;

  color:
    var(--bf-gold-light);

  font-size:
    13px;

}


.bf-instrument-service__grid p {

  margin:
    0;

  color:
    var(--bf-muted);

  font-size:
    11px;

  line-height:
    1.7;

}


.bf-instrument-service__actions {

  display:
    flex;

  flex-wrap:
    wrap;

  gap:
    10px;

  margin-top:
    30px;

}


.bf-instrument-service__note {

  margin-top:
    20px !important;

  color:
    var(--bf-muted-2) !important;

  font-size:
    11px !important;

}


/* =========================================================
   PANEL LATERAL DEL SERVICIO
========================================================= */

.bf-instrument-service__aside {

  padding:
    30px;

  border:
    1px solid var(--bf-line-soft);

  border-radius:
    22px;

  background:
    rgba(5, 13, 24, 0.72);

}


.bf-instrument-service__aside > strong {

  display:
    block;

  margin:
    10px 0 14px;

  font-family:
    "Playfair Display",
    Georgia,
    serif;

  font-size:
    38px;

  font-weight:
    500;

  color:
    var(--bf-gold-light);

}


.bf-instrument-service__aside > p {

  margin:
    0 0 28px;

  color:
    var(--bf-muted);

  font-size:
    13px;

  line-height:
    1.7;

}


.bf-instrument-service__aside > div {

  padding:
    14px 0;

  border-top:
    1px solid var(--bf-line-soft);

}


.bf-instrument-service__aside small {

  display:
    block;

  margin-bottom:
    5px;

  color:
    var(--bf-muted-2);

  text-transform:
    uppercase;

  letter-spacing:
    0.12em;

  font-size:
    8px;

}


.bf-instrument-service__aside div span {

  color:
    var(--bf-text);

  font-size:
    11px;

  line-height:
    1.5;

}


/* =========================================================
   RESPONSIVE SERVICIO
========================================================= */

@media
(max-width: 900px) {

  .bf-instrument-service {

    grid-template-columns:
      1fr;

  }

}


@media
(max-width: 620px) {

  .bf-instrument-service {

    padding:
      26px;

  }


  .bf-instrument-service__grid {

    grid-template-columns:
      1fr;

  }

}


/* =========================================================
   OCULTAR BOTONES DINÁMICOS
========================================================= */

#instrumentoFuenteOficial[hidden],
#instrumentoFuenteOficialHero[hidden] {
  display: none !important;
}


/* =========================================================
   SOLICITUD DE NUEVOS ESCRITOS
========================================================= */

.bf-request {
  width: min(1180px, calc(100% - 80px));

  margin:
    70px auto
    50px;

  box-sizing: border-box;
}


.bf-request__inner {
    width: 100%;
box-sizing: border-box;
  position: relative;
  overflow: hidden;

  padding: 42px 44px;

  border:
    1px solid rgba(214, 177, 100, .22);

  border-radius: 22px;

  background:
    linear-gradient(
      135deg,
      rgba(214, 177, 100, .055),
      rgba(255, 255, 255, .018)
    );
}


.bf-request__inner::before {
  content: "";

  position: absolute;

  width: 260px;
  height: 260px;

  top: -150px;
  right: -90px;

  border-radius: 50%;

  background:
    radial-gradient(
      circle,
      rgba(214, 177, 100, .12),
      transparent 68%
    );

  pointer-events: none;
}


.bf-request__title {
  position: relative;

  max-width: 760px;

  margin:
    12px 0 18px;

  font-family:
    "Playfair Display",
    Georgia,
    serif;

  font-size:
    clamp(
      30px,
      4vw,
      46px
    );

  line-height: 1.1;

  font-weight: 500;
}


.bf-request__text {
  position: relative;

  max-width: 780px;

  margin:
    0 0 12px;

  color:
    var(--bf-muted);

  line-height: 1.75;
}


.bf-request__actions {
  position: relative;

  display: flex;
  flex-wrap: wrap;

  gap: 12px;

  margin-top: 26px;
}


.bf-request__note {
  position: relative;

  max-width: 800px;

  margin:
    24px 0 0;

  padding-top: 20px;

  border-top:
    1px solid rgba(255, 255, 255, .07);

  color:
    var(--bf-muted);

  font-size: 13px;

  line-height: 1.7;
}


@media (
  max-width: 680px
) {

  .bf-request {
    width: calc(100% - 32px);
  }

  .bf-request__inner {
    padding:
      32px 24px;
  }

  .bf-request__actions {
    flex-direction:
      column;
  }

  .bf-request__actions .bf-btn {
    width: 100%;
    justify-content: center;
  }

}
/* =========================================================
   PAGINACIÓN CATÁLOGO
========================================================= */

.bf-catalog-pagination {
  width: 100%;

  margin:
    42px 0
    24px;

  padding-top:
    26px;

  border-top:
    1px solid rgba(214, 177, 100, .14);

  text-align:
    center;
}


.bf-catalog-pagination__status {
  margin:
    0 0
    20px;

  color:
    var(--bf-muted);

  font-size:
    13px;
}


.bf-catalog-pagination__controls {
  display:
    flex;

  align-items:
    center;

  justify-content:
    center;

  gap:
    18px;

  flex-wrap:
    wrap;
}


.bf-catalog-pagination__page {
  min-width:
    130px;

  color:
    var(--bf-muted);

  font-size:
    13px;
}


.bf-catalog-pagination__page strong {
  color:
    var(--bf-gold-light);
}


.bf-catalog-pagination button:disabled {
  opacity:
    .35;

  cursor:
    default;

  pointer-events:
    none;
}


@media (
  max-width: 620px
) {

  .bf-catalog-pagination__controls {
    flex-direction:
      column;
  }


  .bf-catalog-pagination__controls .bf-btn {
    width:
      100%;

    justify-content:
      center;
  }

}

/* =========================================================
   CATÁLOGO DE ESCRITOS · AJUSTE FINAL
========================================================= */

.bf-catalog-group {
  width: 100%;
  margin: 0 0 42px;
}


.bf-catalog-group__head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;

  width: 100%;

  gap: 24px;

  margin: 0 0 18px;

  padding: 0 0 16px;

  border-bottom:
    1px solid rgba(214, 177, 100, .18);

  box-sizing: border-box;
}


.bf-catalog-group__head h2 {
  margin: 8px 0 0;

  font-family:
    "Playfair Display",
    Georgia,
    serif;

  font-size:
    clamp(26px, 3vw, 34px);

  line-height: 1.15;

  font-weight: 500;
}


.bf-catalog-group__count {
  flex: 0 0 auto;

  display: inline-flex;
  align-items: center;
  justify-content: center;

  padding: 7px 12px;

  border:
    1px solid rgba(214, 177, 100, .18);

  border-radius: 999px;

  color: var(--bf-muted);

  font-size: 12px;

  white-space: nowrap;
}



/* =========================================================
   FILAS DEL CATÁLOGO
========================================================= */

.bf-catalog-group__list {
  display: grid;

  width: 100%;

  gap: 10px;
}


.bf-catalog-item {
  display: flex;
  align-items: center;
  justify-content: space-between;

  width: 100%;

  gap: 24px;

  padding: 18px 20px;

  border:
    1px solid rgba(255, 255, 255, .055);

  border-radius: 14px;

  background:
    rgba(255, 255, 255, .018);

  box-sizing: border-box;

  transition:
    transform .2s ease,
    border-color .2s ease,
    background .2s ease;
}


.bf-catalog-item:hover {
  transform: translateY(-1px);

  border-color:
    rgba(214, 177, 100, .24);

  background:
    rgba(214, 177, 100, .03);
}


.bf-catalog-item__main {
  display: flex;
  align-items: center;

  min-width: 0;

  gap: 18px;

  flex: 1;
}


.bf-catalog-item__number {
  flex: 0 0 42px;

  color: var(--bf-gold-light);

  font-size: 13px;
  font-weight: 600;

  letter-spacing: .04em;
}


.bf-catalog-item__content {
  min-width: 0;

  flex: 1;
}


.bf-catalog-item__content h3 {
  margin: 0;

  font-size: 15px;
  line-height: 1.45;

  font-weight: 600;
}


.bf-catalog-item__meta {
  display: flex;
  flex-wrap: wrap;

  gap: 8px;

  margin-top: 7px;
}


.bf-catalog-item__meta span {
  display: inline-flex;
  align-items: center;

  padding: 4px 9px;

  border-radius: 999px;

  background:
    rgba(255, 255, 255, .035);

  color: var(--bf-muted);

  font-size: 11px;
}


.bf-catalog-item__action {
  flex: 0 0 auto;
}


.bf-catalog-item__action a {
  display: inline-flex;
  align-items: center;

  color: var(--bf-gold-light);

  font-size: 13px;

  text-decoration: none;

  white-space: nowrap;
}


.bf-catalog-item__action a:hover {
  text-decoration: underline;
}



/* =========================================================
   PAGINACIÓN · 10 ESCRITOS POR PÁGINA
========================================================= */

.bf-catalog-pagination {
  display: block;

  width: 100%;

  margin: 42px 0 24px;

  padding: 26px 0 0;

  border-top:
    1px solid rgba(214, 177, 100, .14);

  box-sizing: border-box;

  text-align: center;
}


.bf-catalog-pagination__status {
  display: block;

  margin: 0 0 20px;

  color: var(--bf-muted);

  font-size: 13px;

  line-height: 1.5;
}


.bf-catalog-pagination__controls {
  display: flex !important;

  align-items: center;
  justify-content: center;

  flex-wrap: wrap;

  width: 100%;

  gap: 18px;
}


.bf-catalog-pagination__page {
  display: inline-flex;

  align-items: center;
  justify-content: center;

  min-width: 150px;

  padding: 0 10px;

  color: var(--bf-muted);

  font-size: 13px;

  line-height: 1.4;

  white-space: nowrap;
}


.bf-catalog-pagination__page strong {
  margin: 0 4px;

  color: var(--bf-gold-light);
}


.bf-catalog-pagination__controls .bf-btn {
  flex: 0 0 auto;

  min-width: 145px;

  justify-content: center;
}


.bf-catalog-pagination button:disabled {
  opacity: .35;

  cursor: default;

  pointer-events: none;
}



/* =========================================================
   RESPONSIVE
========================================================= */

@media (max-width: 760px) {

  .bf-catalog-group__head {
    align-items: flex-start;
    flex-direction: column;

    gap: 12px;
  }


  .bf-catalog-item {
    align-items: flex-start;
    flex-direction: column;

    gap: 14px;
  }


  .bf-catalog-item__main {
    width: 100%;
  }


  .bf-catalog-item__action {
    width: 100%;
  }


  .bf-catalog-item__action a {
    width: 100%;

    justify-content: flex-end;
  }

}


@media (max-width: 620px) {

  .bf-catalog-pagination__controls {
    flex-direction: column;

    gap: 12px;
  }


  .bf-catalog-pagination__controls .bf-btn {
    width: 100%;

    justify-content: center;
  }


  .bf-catalog-pagination__page {
    order: -1;

    width: 100%;
  }

}


/* =========================================================
   GUÍA DE ADMINISTRACIÓN DE INSTRUMENTOS
========================================================= */

.bf-instrument-admin-block {
  margin: 0 0 30px;
}

.bf-instrument-admin-block:last-child {
  margin-bottom: 0;
}


.bf-instrument-admin-block + .bf-instrument-admin-block {
  padding-top: 26px;

  border-top:
    1px solid rgba(214, 177, 100, .14);
}


.bf-instrument-admin-block h3 {
  margin:
    0 0 14px;

  font-family:
    "Playfair Display",
    Georgia,
    serif;

  font-size:
    21px;

  line-height:
    1.25;

  font-weight:
    500;

  color:
    var(--bf-gold-light);
}


.bf-instrument-admin-block p {
  margin:
    0 0 14px;

  line-height:
    1.75;
}


.bf-instrument-admin-block p:last-child {
  margin-bottom: 0;
}


/* =========================================================
   LIBROS Y PUBLICACIONES
========================================================= */

#panelPublicaciones {
  width: min(1180px, calc(100% - 80px));
  margin-inline: auto;
  padding-block: 10px 20px;
  box-sizing: border-box;
}

@media (max-width: 760px) {
  #panelPublicaciones {
    width: calc(100% - 32px);
  }
}