:root{
  --bg:#020617;
  --bg-card:#0b1220;
  --accent:#4af3ff;
  --accent-soft:#34D399;
  --text-main:#e5e7eb;
  --text-muted:#E0F2FE;
  --border-subtle:#1f2937;
  --radius-xl:20px;
  --radius-pill:999px;
  --shadow-soft:0 20px 40px rgba(0,0,0,.45);
  --maxw:1120px;
    /* Core dark palette (already implicit in ToolsRTM) */
  --vbl-bg-dark: #050b16;
  --vbl-card-dark: #071526;
  --vbl-card-dark-2: #091c33;

  --vbl-blue: #2f81f7;        /* accent blue */
  --vbl-blue-soft: #5aa2ff;

  --vbl-text-main: #e5e7eb;   /* main text */
  --vbl-text-muted: #9ca3af;  /* secondary text */

  --vbl-border-dark: rgba(255,255,255,0.08);

}

body {
  background:radial-gradient(circle at top,#0f172a 0%,#020617 55%,#000);
  color:var(--text-main);
  font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  line-height:1.6;
}

main.content {
  max-width:var(--maxw);
  margin:0 auto;
  padding:1.8rem 1.2rem 2.5rem;
}

a{color:var(--accent-soft);text-decoration:none}
a:hover{color:#f6c453}

/* NAVBAR (usamos .quarto-navbar-wrapper) */

.quarto-navbar {
  background:transparent;
  border:none;
}

.navbar-brand, .navbar-brand span {
  font-weight:650;
  font-size:1.1rem;
}

.navbar-nav .nav-link {
  font-size:.88rem;
  color:var(--text-muted) !important;
}

.navbar-nav .nav-link:hover {
  color:var(--accent-soft) !important;
}

/* HERO */

.hero-card{
  background:linear-gradient(135deg,#020617 0%,#111827 50%,#020617 100%);
  border-radius:var(--radius-xl);
  border:1px solid var(--border-subtle);
  padding:1.1rem 1.3rem 1.2rem;
  box-shadow:var(--shadow-soft);
  margin-bottom:2rem;
}

.hero-card h1{
  font-size:1.6rem;
  font-weight:650;
  margin-bottom:.4rem;
}

.hero-card h1 span{
  color:var(--accent);
}

.hero-text{
  font-size:.95rem;
  color:var(--text-muted);
  text-align:justify;
  text-justify:inter-word;
}

.hero-tags{
  margin-top:.6rem;
  display:flex;
  flex-wrap:wrap;
  gap:.4rem;
}

.tag-pill{
  padding:.18rem .7rem;
  border-radius:var(--radius-pill);
  border:1px solid rgba(148,163,184,.7);
  font-size:.72rem;
  text-transform:uppercase;
  letter-spacing:.14em;
  color:var(--text-muted);
}

/* SECCIONES */

section{
  margin-bottom:1.8rem;
}

.section-label{
  font-size:1rem;
  text-transform:uppercase;
  letter-spacing:.18em;
  color:var(--text-muted);
  margin-bottom:.35rem;
}

.section-title-strong{
  font-size:1.25rem;
  font-weight:620;
  margin-bottom:.25rem;
}

.section-intro{
  font-size:.94rem;
  color:var(--text-muted);
  text-align:justify;
  text-justify:inter-word;
  margin-bottom:.8rem;
}

/* CARDS */

/* Light touch: do NOT override body/main sizing like in the custom landing page */
.vbl-footer-classic { margin-top: 2rem; }
.vbl-footer-line{
  width: 100%;
  height: 1px;
  background: linear-gradient(to right, transparent, #4c5f7a, transparent);
  margin: 1rem 0 1.25rem;
}

/* Optional: make card look closer to your dark style without breaking Quarto */
.card{
  background: rgba(11,18,32,.85);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 18px;
}
.card .text-secondary{ opacity: 0.9; }
.card-grid{
  display:grid;
  gap:1rem;
  grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
}

.vbl-card{
  background:var(--bg-card);
  border-radius:var(--radius-xl);
  border:1px solid var(--border-subtle);
  box-shadow:var(--shadow-soft);
  padding:1rem 1.1rem 1.2rem;
}

.vbl-card h3{
  font-size:1rem;
  margin-bottom:.3rem;
}

.vbl-card p{
  font-size:.9rem;
  color:var(--text-muted);
  text-align:left;
  text-justify:inter-word;
}

.pill-mini{
  display:inline-flex;
  align-items:center;
  padding:.18rem .6rem;
  border-radius:var(--radius-pill);
  border:1px solid rgba(148,163,184,.7);
  font-size:.7rem;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:var(--text-muted);
  margin-bottom:.4rem;
}

ul, ol{
  margin-left:1.1rem;
  font-size:.9rem;
  color:var(--text-muted);
}

li{margin-bottom:.2rem}

/* STATUS BADGE */

.status-badge{
  display:inline-flex;
  align-items:center;
  gap:.4rem;
  padding:.2rem .7rem;
  border-radius:var(--radius-pill);
  background:#022c22;
  color:#bbf7d0;
  font-size:.78rem;
  border:1px solid #064e3b;
  margin-bottom:.5rem;
}

.status-badge span:first-child{font-size:.9rem}




/* Status page: conference card */
.status-card{
  background: linear-gradient(
    180deg,
    var(--vbl-card-dark),
    var(--vbl-card-dark-2)
  );

  border-radius: 22px;
  padding: 28px 30px;
  border: 1px solid var(--vbl-border-dark);

  box-shadow:
    0 0 0 1px rgba(47,129,247,0.08),
    0 25px 60px rgba(0,0,0,0.55);
}


.status-h2{
  color: var(--vbl-text-main);
  font-size: 1.3rem;
  font-weight: 600;
}

.status-lead{
  color: var(--vbl-text-muted);
  margin-bottom: 20px;
}


.status-list{
  list-style: none;
  padding: 0;
  margin: 0;
}

.status-list li{
  padding: 10px 0;
  border-top: 1px solid rgba(0,0,0,0.08);
}

.status-list li:first-child{
  border-top: none;
}

.status-item-title{
  font-weight: 600;
}

.status-item-sep{
  opacity: 0.55;
  padding: 0 6px;
}

.status-item-meta{
  opacity: 0.85;
}

.status-note{
  margin-top: 18px;
  padding: 14px 18px;
  border-radius: 16px;

  /* SAME color family as the card */
  background: #5aa2ff;
  border: 1px solid var(--vbl-border);

  /* Accent line using SAME blue as titles */
  border-left: 4px solid var(--vbl-blue);

  color: #1f2937;
  font-size: 0.95rem;
}

/* FOOTER */

.footer {
  margin-top:1.2rem;
  font-size:.78rem;
  color:var(--text-muted);
  text-align:center;
}
.vbl-footer {
  margin-top: 4rem;
  padding: 2rem 1rem;
  text-align: center;
  color: #c7d1e0;
  font-size: 0.9rem;
}

.footer-line {
  width: 100%;
  height: 1px;
  background: linear-gradient(to right, transparent, #4c5f7a, transparent);
  margin-bottom: 1.5rem;
}

.footer-text a {
  color: #c6e2ff;
  text-decoration: none;
  font-weight: 500;
}

.footer-text a:hover {
  text-decoration: underline;
  color: #ffffff;
}