/*--------------------------------------------------------------
 * Bloque · Niveles
 *-------------------------------------------------------------*/
.niv-arte{
  position:relative;
  padding:4rem 2rem;
  background:#f6f6f6;                 /* fallback si no hay imagen */
  background-size:cover;
  background-position:center;
  overflow:hidden;
  isolation:isolate;
}

.niv-overlay{                         /* oscurece fondo si existe */
  position:absolute;
  inset:0;
  background:rgba(255,255,255,.25);
  backdrop-filter:blur(2px);
  z-index:1;
}

.niv-container{
  position:relative;
  z-index:2;
  max-width:1200px;
  margin:0 auto;
  text-align:center;
}

.niv-titulo{
  font-family:'Playfair Display',serif;
  font-size:2rem;
  margin-bottom:1rem;
}

.niv-intro{
  font-family:'Karla',sans-serif;
  font-size:1.125rem;
  line-height:1.65;
  margin:0 auto 2.5rem;
  max-width:900px;
}

/* Cuadrícula 3 columnas */
.niv-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
  gap:2rem;
  text-align:left;
}

.niv-card{
  font-family:'Karla',sans-serif;
  background:rgba(255,255,255,.75);
  padding:1.5rem 1.25rem;
  border-radius:6px;
  box-shadow:0 3px 8px rgba(0,0,0,.05);
}

.niv-head{
  font-weight:700;
  margin-bottom:.75rem;
  display:flex;
  align-items:center;
  gap:.5rem;
}

/* Iconos con emojis por defecto */
.niv-card--1 .niv-icon::before{content:'🖐';}
.niv-card--2 .niv-icon::before{content:'✍️';}
.niv-card--3 .niv-icon::before{content:'🌀';}

.niv-icon::before{
  font-size:1.25rem;
}

/* Responsive smaller text */
@media(max-width:768px){
  .niv-titulo{font-size:1.75rem;}
  .niv-intro{font-size:1rem;}
}