.nivels-portfolio-premium{
  background:var(--nivels-bg,#050506);
  color:var(--nivels-text,#fff);
  padding:min(var(--nivels-pt,64px),72px) 20px min(var(--nivels-pb,64px),72px);
  position:relative;
  overflow:hidden;
  isolation:isolate;
}
.nivels-portfolio-premium:before{
  content:"";
  position:absolute;
  width:520px;
  height:520px;
  right:-260px;
  top:-260px;
  background:radial-gradient(circle,rgba(215,25,32,.13),transparent 68%);
  pointer-events:none;
  z-index:-1;
}
.nivels-portfolio-wrap{max-width:var(--nivels-max,1280px);margin:0 auto}
.nivels-portfolio-head{
  display:grid;
  grid-template-columns:minmax(0,1.12fr) minmax(280px,.72fr);
  gap:clamp(28px,5vw,72px);
  align-items:end;
  margin-bottom:clamp(26px,3.5vw,46px);
}
.nivels-portfolio-eyebrow{
  display:flex;
  align-items:center;
  gap:12px;
  margin:0 0 12px;
  color:#d71920;
  font-family:Inter,Arial,sans-serif;
  font-size:11px;
  line-height:1.2;
  font-weight:800;
  letter-spacing:.16em;
  text-transform:uppercase;
}
.nivels-portfolio-eyebrow:before{content:"";width:34px;height:2px;background:currentColor;flex:0 0 auto}
.nivels-portfolio-title{
  margin:0;
  max-width:760px;
  color:var(--nivels-text,#fff);
  font-family:"Arial Narrow","Roboto Condensed",Impact,sans-serif;
  font-size:clamp(42px,5.2vw,76px);
  line-height:.93;
  font-weight:900;
  letter-spacing:-.035em;
  text-transform:uppercase;
}
.nivels-portfolio-title em{font:inherit;color:#d71920}
.nivels-portfolio-desc{
  margin:0 0 18px;
  max-width:520px;
  color:var(--nivels-muted,rgba(255,255,255,.72));
  font-family:Inter,Arial,sans-serif;
  font-size:15px;
  line-height:1.62;
}
.nivels-portfolio-more{
  display:inline-flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  min-width:220px;
  padding:14px 16px;
  border:1px solid rgba(255,255,255,.45);
  color:var(--nivels-text,#fff);
  font-family:Inter,Arial,sans-serif;
  font-size:11px;
  line-height:1;
  font-weight:800;
  letter-spacing:.11em;
  text-transform:uppercase;
  text-decoration:none;
  transition:background .22s ease,color .22s ease,border-color .22s ease;
}
.nivels-portfolio-more span{font-size:18px;line-height:1;transition:transform .22s ease}
.nivels-portfolio-more:hover{background:#d71920;border-color:#d71920;color:#fff}
.nivels-portfolio-more:hover span{transform:translateX(4px)}
.nivels-project-grid{
  display:grid;
  grid-template-columns:repeat(var(--nivels-cols,4),minmax(0,1fr));
  gap:clamp(12px,1.5vw,20px);
}
.nivels-project-card{
  display:flex;
  flex-direction:column;
  min-width:0;
  min-height:100%;
  overflow:hidden;
  background:#d71920;
  color:#fff;
  text-decoration:none;
  cursor:pointer;
  position:relative;
  transform:translateZ(0);
  transition:transform .28s ease,filter .28s ease;
}
.nivels-project-card:hover{transform:translateY(-5px);filter:brightness(1.04);color:#fff}
.nivels-project-card:focus-visible{outline:3px solid #fff;outline-offset:4px}
.nivels-project-image{
  aspect-ratio:16/10;
  overflow:hidden;
  background:#151515;
  position:relative;
}
.nivels-project-image img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  transition:transform .48s cubic-bezier(.2,.75,.25,1),filter .3s ease;
}
.nivels-project-card:hover .nivels-project-image img{transform:scale(1.045)}
.nivels-project-body{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  grid-template-areas:"kicker arrow" "name arrow" "text arrow";
  column-gap:14px;
  align-items:center;
  padding:18px 18px 19px;
  background:#d71920;
  color:#fff;
}
.nivels-project-kicker{
  grid-area:kicker;
  margin:0 0 6px;
  color:rgba(255,255,255,.78);
  font-family:Inter,Arial,sans-serif;
  font-size:10px;
  line-height:1.25;
  font-weight:800;
  letter-spacing:.12em;
  text-transform:uppercase;
}
.nivels-project-name{
  grid-area:name;
  margin:0;
  color:#fff;
  font-family:"Arial Narrow","Roboto Condensed",Impact,sans-serif;
  font-size:clamp(23px,2vw,31px);
  line-height:.98;
  font-weight:900;
  letter-spacing:-.02em;
  text-transform:uppercase;
}
.nivels-project-text{
  grid-area:text;
  margin:8px 0 0;
  color:rgba(255,255,255,.86);
  font-family:Inter,Arial,sans-serif;
  font-size:13px;
  line-height:1.45;
}
.nivels-project-arrow{
  grid-area:arrow;
  align-self:center;
  color:#fff;
  font-family:Arial,sans-serif;
  font-size:28px;
  line-height:1;
  transform:translateX(-3px);
  transition:transform .24s ease;
}
.nivels-project-card:hover .nivels-project-arrow{transform:translateX(3px)}
/* Compatibilidad con el HTML guardado por la versión 1.0.1 */
article.nivels-project-card{display:flex}
article.nivels-project-card .nivels-project-link{
  grid-area:arrow;
  align-self:center;
  display:flex;
  align-items:center;
  justify-content:center;
  width:34px;
  height:34px;
  overflow:hidden;
  color:transparent;
  text-decoration:none;
}
article.nivels-project-card .nivels-project-link span{color:#fff;font-size:28px;line-height:1;transition:transform .24s ease}
article.nivels-project-card:hover .nivels-project-link span{transform:translateX(4px)}
@media(max-width:1024px){
  .nivels-portfolio-head{grid-template-columns:1fr;gap:20px}
  .nivels-project-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .nivels-portfolio-desc{max-width:700px}
}
@media(max-width:640px){
  .nivels-portfolio-premium{padding-left:16px;padding-right:16px}
  .nivels-project-grid{grid-template-columns:1fr;gap:14px}
  .nivels-portfolio-title{font-size:42px}
  .nivels-project-body{padding:16px}
  .nivels-project-text{font-size:13px}
  .nivels-portfolio-more{width:100%}
}
@media(prefers-reduced-motion:reduce){
  .nivels-project-card,.nivels-project-image img,.nivels-project-arrow,.nivels-portfolio-more,.nivels-portfolio-more span{transition:none!important}
}