:root{
  --tinta-2:#1B2126;
  --tinta-3:#262D33;
  --brasa:#E8863A;
  --oro:#E3B866;
  --ease:cubic-bezier(.16,1,.3,1);
  --nav:76px;
  --ret-osc:linear-gradient(rgba(255,255,255,.028) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.028) 1px,transparent 1px);
  --ret-cla:linear-gradient(rgba(20,24,28,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(20,24,28,.05) 1px,transparent 1px);
}
body{counter-reset:cap ent}
h1,h2,h3{font-weight:700;letter-spacing:-.025em;font-variation-settings:'wdth' 112}

.progreso{position:fixed;left:0;top:0;height:3px;width:100%;transform-origin:0 50%;transform:scaleX(var(--sp,0));background:linear-gradient(90deg,var(--marca),var(--brasa));z-index:120;pointer-events:none}

.nav{height:var(--nav);transition:background .5s var(--ease),transform .6s var(--ease),border-color .5s}
.nav.oculta{transform:translateY(-100%)}
.nav.abierto{transform:none}
.nav__int{height:100%}
.nav.solida{background:rgba(20,24,28,.72);-webkit-backdrop-filter:blur(18px) saturate(1.4);backdrop-filter:blur(18px) saturate(1.4);border-bottom-color:rgba(255,255,255,.08)}
.nav__marca b{font-size:17px;font-weight:700}
@media(min-width:1181px){
  .nav__links{gap:clamp(18px,2.4vw,38px)}
  .nav__links a:not(.nav__cta){font-size:12px;letter-spacing:.13em;padding:6px 0;color:rgba(247,246,243,.72)}
  .nav__links a:not(.nav__cta)::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:var(--marca);transform:scaleX(0);transform-origin:0 50%;transition:transform .5s var(--ease)}
  .nav__links a:not(.nav__cta):hover,.nav__links a:not(.nav__cta).activo{color:#fff}
  .nav__links a:not(.nav__cta):hover::after{transform:scaleX(1)}
  .nav__links a.nav__cta{display:inline-flex;align-items:center;gap:10px;padding:12px 22px;border:0;border-radius:999px;background:var(--marca);color:#fff;
    font-family:var(--display);font-weight:600;font-size:14px;letter-spacing:-.005em;text-transform:none;font-variation-settings:'wdth' 108;transition:background .4s,color .4s}
  .nav__links a.nav__cta:hover{background:#fff;color:var(--tinta)}
  .nav__wa{display:block;width:17px;height:17px;fill:currentColor}
}

.indice-cabezal,.pieza-cabeza,.caso-cabeza{position:relative;overflow:hidden;background-color:var(--tinta);background-image:var(--ret-osc);background-size:72px 72px;background-position:-1px -1px}
.indice-cabezal::after,.pieza-cabeza::after,.caso-cabeza::after{content:"";position:absolute;left:0;right:0;bottom:0;height:3px;background:linear-gradient(90deg,var(--marca),var(--brasa) 38%,transparent 78%)}
.indice-cabezal>.contenedor::before,.pieza-cabeza>.contenedor::before,.caso-cabeza>.contenedor::before{content:"";position:absolute;left:var(--canalon);top:-30px;width:22px;height:22px;border-left:1px solid var(--oro);border-top:1px solid var(--oro);opacity:.7}
.indice-cabezal>.contenedor::after,.pieza-cabeza>.contenedor::after,.caso-cabeza>.contenedor::after{content:"";position:absolute;right:var(--canalon);bottom:-26px;width:22px;height:22px;border-right:1px solid var(--oro);border-bottom:1px solid var(--oro);opacity:.7}
.indice-cabezal .mono,.pieza-cabeza__cat,.caso-cabeza__cat{color:var(--oro)}
.indice-cabezal .mono::before,.pieza-cabeza__cat::before,.caso-cabeza__cat::before{content:"";display:inline-block;width:28px;height:1px;background:currentColor;vertical-align:middle;margin-right:12px;transform:translateY(-1px)}
.indice-cabezal h1{max-width:16ch;font-size:clamp(40px,6vw,96px);line-height:.98;font-weight:800;letter-spacing:-.035em;font-variation-settings:'wdth' 118}
.pieza-cabeza h1{max-width:22ch;font-size:clamp(32px,4.6vw,70px);line-height:1;font-weight:800;letter-spacing:-.03em;font-variation-settings:'wdth' 116}
.caso-cabeza h1{max-width:18ch;font-size:clamp(32px,4.4vw,66px);line-height:1;font-weight:800;letter-spacing:-.03em;font-variation-settings:'wdth' 116}
.pieza-cabeza__entradilla,.indice-cabezal p{color:rgba(247,246,243,.72)}
.migas a:hover{color:var(--oro)}

.p{display:inline-block;overflow:hidden;vertical-align:top;padding:.1em 0 .14em;margin:-.1em 0 -.14em}
.p>span{display:inline-block;transform:translateY(112%) rotate(4deg);transform-origin:0 100%;filter:blur(10px);opacity:0;
  transition:transform 1.15s var(--ease),filter 1s var(--ease),opacity .8s var(--ease);transition-delay:calc(var(--i,0) * 55ms)}
.vis .p>span{transform:none;filter:none;opacity:1}

.foto-principal__img{position:relative;border-radius:3px}
.foto-principal__img::before,.foto-principal__img::after{content:"";position:absolute;width:26px;height:26px;pointer-events:none;transition:all 1.1s var(--ease)}
.foto-principal__img::before{left:-14px;top:-14px;border-left:2px solid var(--marca);border-top:2px solid var(--marca)}
.foto-principal__img::after{right:-14px;bottom:-14px;border-right:2px solid var(--marca);border-bottom:2px solid var(--marca)}

.articulo__cuerpo h2{position:relative;font-variation-settings:'wdth' 114;font-weight:800}
.articulo__cuerpo h2::before{content:"";position:absolute;left:0;top:-1px;width:56px;height:3px;background:var(--marca)}
.articulo__cuerpo li::before{width:7px;height:7px;top:12px;background:var(--marca)}
.articulo__cuerpo blockquote{border-left-width:3px;font-variation-settings:'wdth' 120;font-weight:700;font-size:clamp(22px,2.6vw,32px)}
.articulo__cuerpo figure img{border-radius:3px}
.dato{position:relative;background:var(--hueso);border:0;border-left:3px solid var(--marca);border-radius:0 3px 3px 0}
.firma{border-top-color:var(--marca)}
.firma__foto{border-radius:3px}
.relacionadas{background-color:var(--hueso);background-image:var(--ret-cla);background-size:72px 72px}

.ideas{gap:clamp(22px,2.6vw,38px)}
.idea{border-top:0;padding-top:0}
.idea__foto{border-radius:3px;margin-bottom:22px;transition:transform 1.2s var(--ease)}
.idea:hover .idea__foto{transform:scale(1.025)}
.idea h3{font-variation-settings:'wdth' 108;font-weight:700;font-size:clamp(20px,1.9vw,26px)}

.indice-lista{border-top:1px solid var(--linea)}
.entrada{position:relative;counter-increment:ent}
.entrada::before{content:"";position:absolute;left:0;top:-1px;height:2px;width:0;background:var(--marca);transition:width .8s var(--ease)}
.entrada:hover::before{width:100%}
.entrada:hover{background:rgba(20,24,28,.025)}
.entrada__meta::before{content:counter(ent,decimal-leading-zero);font-family:var(--mono);font-size:11px;letter-spacing:.14em;color:var(--marca)}
.entrada__foto{position:relative;border-radius:3px;transition:filter .6s}
.entrada__foto::before,.entrada__foto::after{content:"";position:absolute;width:20px;height:20px;opacity:0;transition:all .7s var(--ease);pointer-events:none}
.entrada__foto::before{left:-10px;top:-10px;border-left:2px solid var(--marca);border-top:2px solid var(--marca)}
.entrada__foto::after{right:-10px;bottom:-10px;border-right:2px solid var(--marca);border-bottom:2px solid var(--marca)}
.entrada:hover .entrada__foto::before{left:-1px;top:-1px;opacity:1}
.entrada:hover .entrada__foto::after{right:-1px;bottom:-1px;opacity:1}
.entrada h2{font-variation-settings:'wdth' 110;font-weight:800}

.casos{gap:clamp(18px,2.2vw,32px)}
.caso-tarjeta{border-radius:4px;transition:transform .8s var(--ease),box-shadow .8s var(--ease)}
.caso-tarjeta:hover{transform:translateY(-6px);box-shadow:0 40px 70px -40px rgba(200,69,45,.6)}
.caso-tarjeta__foto{position:relative}
.caso-tarjeta__foto img{transition:transform 1.4s var(--ease)}
.caso-tarjeta:hover .caso-tarjeta__foto img{transform:scale(1.04)}
.caso-tarjeta__foto::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(20,24,28,0) 55%,rgba(20,24,28,.7));pointer-events:none}
.caso-tarjeta .mono{color:var(--oro)}
.caso-tarjeta__titular{font-weight:700;font-variation-settings:'wdth' 112}
.caso-tarjeta .enlace-mono{color:var(--brasa)}

.caso-cabeza__foto{position:relative}
.caso-cabeza__foto::before,.caso-cabeza__foto::after{content:"";position:absolute;width:26px;height:26px;pointer-events:none}
.caso-cabeza__foto::before{left:-12px;top:-12px;border-left:2px solid var(--oro);border-top:2px solid var(--oro)}
.caso-cabeza__foto::after{right:-12px;bottom:-12px;border-right:2px solid var(--oro);border-bottom:2px solid var(--oro)}
.capitulo{counter-increment:cap;background-image:var(--ret-cla);background-size:72px 72px;background-position:-1px -1px}
.capitulo__foto{position:relative;justify-self:start}
.capitulo__foto::before,.capitulo__foto::after{content:"";position:absolute;width:22px;height:22px;pointer-events:none}
.capitulo__foto::before{left:-10px;top:-10px;border-left:2px solid var(--marca);border-top:2px solid var(--marca)}
.capitulo__foto::after{right:-10px;bottom:-10px;border-right:2px solid var(--marca);border-bottom:2px solid var(--marca)}
.capitulo__int--inv .capitulo__foto{justify-self:end}
.capitulo__texto .mono::before{content:counter(cap,decimal-leading-zero) "  /  "}
.capitulo__texto h2{font-weight:800;font-variation-settings:'wdth' 114}
.galeria-caso img{border-radius:3px}
.caso-cierre{background-color:var(--tinta);background-image:var(--ret-osc);background-size:72px 72px;background-position:-1px -1px;position:relative}
.caso-cierre__frase{font-weight:800;font-variation-settings:'wdth' 118}
.caso-cierre__frase::before{width:3px;height:30px;background:linear-gradient(var(--marca),var(--brasa))}
.caso-sig{transition:border-color .5s}
.caso-sig:hover{border-color:var(--marca)}
.caso-sig__flecha{display:grid;place-items:center;width:44px;height:44px;border:1px solid currentColor;border-radius:50%;font-size:18px;transition:transform .5s var(--ease),background .4s,color .4s}
.caso-sig:hover .caso-sig__flecha{background:var(--marca);border-color:var(--marca);color:#fff}

.pie{background:var(--tinta);color:var(--papel)}
.pie__cta{position:relative;display:block;overflow:hidden;gap:0;align-items:initial;grid-template-columns:none;border-bottom:0;
  background-color:var(--papel);background-image:var(--ret-cla);background-size:72px 72px;background-position:-1px -1px;color:var(--tinta);padding:clamp(88px,10vw,160px) 0}
.pie__cta .contenedor{position:relative;display:grid;gap:clamp(32px,4vw,56px)}
.pie__cta .mono{color:var(--concreto-texto);margin:0}
.pie__cta .mono::before{content:"";display:inline-block;width:28px;height:1px;background:currentColor;vertical-align:middle;margin-right:12px;transform:translateY(-1px)}
.pie__cta h2{margin:0;font-size:clamp(38px,7vw,120px);line-height:.96;max-width:13ch;letter-spacing:-.04em;color:var(--tinta);font-weight:800;font-variation-settings:'wdth' 114}
.pie__cta-acc{display:flex;flex-direction:row;flex-wrap:wrap;align-items:center;gap:20px 36px}
.pie__cta .btn{display:inline-flex;align-items:center;gap:14px;padding:24px 38px;border:0;border-radius:999px;background:var(--tinta);color:#fff;
  font-family:var(--display);font-weight:600;font-size:18px;text-transform:none;letter-spacing:-.01em;font-variation-settings:'wdth' 108;transition:background .4s,transform .5s var(--ease)}
.pie__cta .btn:hover{background:var(--marca);color:#fff}
.pie__asistente{font-family:var(--mono);font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--tinta);border-bottom:1px solid var(--marca);padding:0 0 4px}
.pie__asistente:hover{color:var(--marca)}
.pie__trama{position:absolute;right:-4%;top:50%;width:min(56vw,760px);transform:translateY(-50%);pointer-events:none}
.pie__cuerpo{padding:clamp(56px,6vw,96px) var(--canalon) 28px;background-image:var(--ret-osc);background-size:72px 72px;background-position:-1px -1px;max-width:none}
.pie__cuerpo>*{max-width:1280px;margin-left:auto;margin-right:auto}
.pie__cols{display:grid;grid-template-columns:1.3fr .8fr 1fr 1.2fr;gap:clamp(28px,3vw,56px);padding:0}
.pie__col{display:grid;gap:12px;align-content:start;align-items:initial;flex-direction:initial}
.pie__col .mono{margin:0 0 10px;color:var(--oro)}
.pie__col .mono::before{display:none}
.pie__col a:not(.pie__marca):not(.pie__dato):not(.pie__equipo){color:rgba(247,246,243,.72);font-size:16px}
.pie__col a:not(.pie__marca):not(.pie__dato):not(.pie__equipo):hover{color:#fff}
.pie__marca{display:flex;align-items:center;gap:14px}
.pie__logo{height:34px;width:auto}
.pie__nombre{font-family:var(--display);font-weight:700;font-size:20px;line-height:1;letter-spacing:-.01em;font-variation-settings:'wdth' 112}
.pie__frase{margin:0;color:rgba(247,246,243,.62);font-size:16px;line-height:1.55;max-width:34ch}
.pie__social{display:flex;gap:18px;margin-top:6px}
.pie__icono{display:block;width:auto;height:auto;transition:transform .4s var(--ease),color .3s}
.pie__icono svg{width:22px;height:22px;fill:currentColor}
.pie__icono:hover{transform:translateY(-3px);color:var(--brasa)}
.pie__dato{display:grid;gap:2px;font-size:16px;color:rgba(247,246,243,.8)}
.pie__dato span{font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--concreto)}
.pie__dato:hover{color:#fff}
.pie__equipo{display:grid;gap:4px;padding:0;border:0;font-size:15px;line-height:1.45;color:rgba(247,246,243,.62);max-width:none}
.pie__equipo b{display:block;margin:0;color:#fff;font-family:var(--display);font-weight:700;font-size:17px;font-variation-settings:'wdth' 108}
a.pie__equipo:hover b{color:var(--brasa)}
.cajetin{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;margin-top:clamp(40px,5vw,72px);border:1px solid rgba(255,255,255,.22)}
.cajetin>div{padding:16px 20px;border-left:1px solid rgba(255,255,255,.22);display:grid;gap:6px;align-content:start}
.cajetin>div:first-child{border-left:0}
.cajetin span{font-family:var(--mono);font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--concreto)}
.cajetin b{font-family:var(--display);font-weight:700;font-size:clamp(16px,1.6vw,22px);letter-spacing:-.01em;font-variation-settings:'wdth' 110}
.cajetin>div:first-child b{font-size:clamp(22px,2.6vw,38px);font-weight:800;font-variation-settings:'wdth' 120;letter-spacing:-.03em}
.pie__legal{display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px;margin-top:clamp(40px,5vw,72px);padding:22px 0 0;border-top:1px solid rgba(255,255,255,.12);font-family:var(--cuerpo);font-size:14px;letter-spacing:0;text-transform:none;color:rgba(247,246,243,.5)}
.pie__legales{display:flex;gap:22px}
.pie__legales a{color:inherit}
.pie__legales a:hover{color:#fff}

@media(max-width:1040px){
  .pie__cols{grid-template-columns:1fr 1fr}
}
@media(max-width:700px){
  .pie__cols{grid-template-columns:1fr}
  .cajetin{grid-template-columns:1fr 1fr}
  .cajetin>div:nth-child(odd){border-left:0}
  .cajetin>div:nth-child(n+3){border-top:1px solid rgba(255,255,255,.22)}
  .pie__cta .btn{padding:20px 28px;font-size:16px}
}

@media(prefers-reduced-motion:reduce){
  .p>span{transform:none;filter:none;opacity:1;transition:none}
  .progreso{display:none}
}