/* NLevia.org — componentes reutilizables (header, footer, botones, tarjetas) */

.nlv-container{
  max-width:var(--max-width);
  margin:0 auto;
  padding:0 24px;
}

/* Header */
.nlv-header{
  border-bottom:1px solid var(--border);
  background:var(--surface);
}
.nlv-header-inner{
  max-width:var(--max-width);
  margin:0 auto;
  padding:16px 24px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
}
.nlv-logo{
  display:flex;
  align-items:center;
  gap:8px;
  font-weight:700;
  font-size:18px;
  color:var(--text);
}
.nlv-logo:hover{text-decoration:none;color:var(--primary);}
.nlv-logo img{height:28px;width:28px;}
.nlv-nav{display:flex;align-items:center;gap:20px;}
.nlv-nav a{color:var(--text-muted);font-weight:500;}
.nlv-nav a:hover{color:var(--text);text-decoration:none;}

.nlv-lang-switch{
  display:flex;
  border:1px solid var(--border);
  border-radius:6px;
  overflow:hidden;
  font-size:13px;
}
.nlv-lang-switch a{
  padding:4px 10px;
  color:var(--text-muted);
  font-weight:600;
}
.nlv-lang-switch a:hover{background:var(--surface-2);text-decoration:none;}
.nlv-lang-switch a.active{background:var(--primary);color:var(--primary-fg);}

/* Footer */
.nlv-footer{
  border-top:1px solid var(--border);
  margin-top:64px;
  padding:32px 24px;
  color:var(--text-muted);
  font-size:14px;
}
.nlv-footer-inner{
  max-width:var(--max-width);
  margin:0 auto;
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:space-between;
  gap:12px;
}
.nlv-footer a{color:var(--text-muted);}
.nlv-footer a:hover{color:var(--primary);}
.nlv-footer-links{display:flex;gap:16px;flex-wrap:wrap;}

/* Botones */
.nlv-btn{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:10px 20px;
  border-radius:var(--radius);
  border:1px solid var(--border);
  background:var(--surface);
  color:var(--text);
  font-size:15px;
  font-weight:600;
  cursor:pointer;
  transition:filter 0.15s ease;
}
.nlv-btn:hover{text-decoration:none;filter:brightness(0.97);}
@media (prefers-color-scheme: dark){ .nlv-btn:hover{filter:brightness(1.15);} }

.nlv-btn--primary{
  background:var(--primary);
  border-color:var(--primary);
  color:var(--primary-fg);
}
.nlv-btn--primary:hover{background:var(--primary-hover);border-color:var(--primary-hover);filter:none;}

.nlv-btn--secondary{background:var(--surface-2);}

.nlv-cta-row{display:flex;gap:12px;flex-wrap:wrap;}

/* Hero */
.nlv-hero{
  padding:72px 24px 48px;
  text-align:center;
}
.nlv-hero h1{font-size:40px;}
.nlv-hero p{font-size:18px;color:var(--text-muted);max-width:640px;margin:0 auto 24px;}
.nlv-hero .nlv-cta-row{justify-content:center;}

/* Badge */
.nlv-badge{
  display:inline-flex;
  align-self:flex-start;
  align-items:center;
  gap:6px;
  padding:4px 12px;
  border-radius:999px;
  border:1px solid var(--border);
  background:var(--surface-2);
  color:var(--text-muted);
  font-size:13px;
  font-weight:600;
  margin-bottom:16px;
}

/* Secciones */
.nlv-section{padding:48px 24px;}
.nlv-section h2{font-size:28px;text-align:center;margin-bottom:32px;}
.nlv-section--alt{background:var(--surface);border-top:1px solid var(--border);border-bottom:1px solid var(--border);}

/* Tarjetas (proyectos en la home, características en la landing) */
.nlv-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(260px,1fr));
  gap:20px;
  max-width:var(--max-width);
  margin:0 auto;
}
.nlv-card{
  border:1px solid var(--border);
  border-radius:var(--radius);
  background:var(--surface);
  padding:24px;
  box-shadow:var(--shadow);
}
.nlv-card h3{font-size:17px;margin-bottom:8px;}
.nlv-card p{color:var(--text-muted);font-size:14px;margin-bottom:0;}

.nlv-project-card{
  display:flex;
  flex-direction:column;
  gap:12px;
}
.nlv-project-card .nlv-btn{align-self:flex-start;margin-top:8px;}

@media (max-width:640px){
  .nlv-header-inner{flex-direction:column;align-items:flex-start;gap:12px;}
  .nlv-hero h1{font-size:30px;}
}