/* =========================================================
   rnbth: Variables de color y resets básicos
   ========================================================= */
:root{
  --rnbth-negro: #000000;
  --rnbth-azul-oscuro: #2BB7E4;  /* Botones y acentos */
  --rnbth-azul-claro: #8CE3FF;   /* Separadores y detalles */
  --rnbth-gris-10: rgba(0,0,0,.10);
  --rnbth-gris-60: rgba(0,0,0,.60);
  --rnbth-gris-70: rgba(0,0,0,.70);
  --rnbth-white: #ffffff;
}
.rnbth-body{
  margin: 0;
  font-family: Montserrat, "Open Sans", Arial, Verdana, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji';
  color: var(--rnbth-negro);
  background: var(--rnbth-white);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.rnbth-sr-only{ position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.rnbth-icon{padding-right: 5px;}
/* =========================================================
   rnbth: CONTENIDO PRINCIPAL
   ========================================================= */
.rnbth-main{ padding: 24px 0 40px; max-width: 1200px;}
.rnbth-intro{ max-width: 720px; }
.rnbth-intro h1{ font-size: clamp(28px, 4vw, 40px); font-weight: 600; letter-spacing: -.02em; }
.rnbth-intro p{ margin-top: 8px; color: var(--rnbth-gris-70); }

/* =========================================================
   rnbth: BOTONES (acciones)
   ========================================================= */
.rnbth-btn{
  --shadow: 0 8px 20px rgba(43,183,228,.25);
  background: var(--rnbth-azul-oscuro);
  color: white;
  border: none;
  padding: 10px 18px;
  border-radius: 10px;
  font-weight: 600;
  cursor: pointer;
  box-shadow: var(--shadow);
  transition: transform .15s ease, filter .15s ease, box-shadow .15s ease;
}
.rnbth-btn:hover{ filter: brightness(.95); transform: translateY(-1px); box-shadow: 0 10px 24px rgba(43,183,228,.35); }
.rnbth-btn:focus-visible{ outline: 3px solid color-mix(in oklab, var(--rnbth-azul-oscuro) 55%, transparent); outline-offset: 2px; }
.rnbth-btn--ghostless{ text-decoration: none; display: inline-block; white-space: nowrap; }

/* =========================================================
   rnbth: LISTADO DE CLIENTES (cards)
   ========================================================= */
.rnbth-cards{ margin-top: 32px; display: grid; gap: 28px; }
.rnbth-card{
  border-top: 3px solid var(--rnbth-azul-claro);
  padding-top: 18px;
  display: grid;
  gap: 12px;
}
@media (min-width: 768px){
  .rnbth-card{
    grid-template-columns: 1fr auto;
    align-items: start;
  }
}
.rnbth-card__body{ padding-right: 12px; }
.rnbth-card__body h3{ font-size: clamp(20px, 3vw, 24px); font-weight: 600; }
.rnbth-card__meta{ margin-top: 4px; font-size: 13px; letter-spacing: .08em; }
.rnbth-card__desc{ margin-top: 12px; max-width: 66ch; color: rgba(0,0,0,.75); }