:root{
  --type-display:clamp(2.115rem,2.52vw,3.195rem);
  --type-section:clamp(1.845rem,2.25vw,2.88rem);
  --type-eyebrow:clamp(.88rem,.78vw,.98rem);
  --type-lead:clamp(1.02rem,1.06vw,1.16rem);
  --type-card-title:clamp(1.45rem,1.62vw,1.8rem);
  --type-body:clamp(.98rem,.92vw,1.06rem);
  --site-content-max:1380px;
  --site-gutter:6vw;
}

/* Mantiene el mismo ancho útil y los mismos márgenes laterales del resto del sitio. */
.catalog-hero,
.catalog-scope,
.catalog-cta{
  --catalog-inline-space:max(var(--site-gutter),calc((100vw - var(--site-content-max))/2));
  padding-left:var(--catalog-inline-space);
  padding-right:var(--catalog-inline-space);
}

.catalog-hero{
  column-gap:clamp(72px,8vw,128px);
}

.eyebrow{
  font-size:var(--type-eyebrow);
  line-height:1.45;
  letter-spacing:1.5px;
}

.catalog-copy h1{
  max-width:720px;
  margin:24px 0 26px;
  font-size:var(--type-display);
  line-height:1.04;
  letter-spacing:-.04em;
  font-weight:950;
  text-wrap:balance;
}

.hero-lead{
  max-width:680px;
  font-size:var(--type-lead);
  line-height:1.68;
}

.scope-head h2,
.catalog-cta h2{
  font-size:var(--type-section);
  line-height:1.02;
  letter-spacing:-.042em;
  font-weight:950;
  text-wrap:balance;
}

.scope-head>p,
.scope-grid p,
.catalog-cta>div:last-child p{
  font-size:var(--type-body);
}

.scope-grid h3{
  font-size:var(--type-card-title);
  line-height:1.16;
}

.catalog-cover-link{
  position:relative;
  z-index:2;
  display:block;
  width:min(420px,68%);
  transform:rotateY(-14deg) rotateX(3deg) rotateZ(-.6deg);
  transform-origin:center;
  transform-style:preserve-3d;
  transition:transform .25s ease,filter .25s ease;
}

.catalog-cover-link:before{
  content:"";
  position:absolute;
  z-index:-1;
  top:8px;
  right:-15px;
  bottom:3px;
  width:18px;
  background:
    repeating-linear-gradient(90deg,#ece8dc 0 2px,#d1caba 2px 3px,#faf8f0 3px 5px);
  border:1px solid #b8ad91;
  border-left:0;
  clip-path:polygon(0 0,100% 2%,100% 99%,0 100%);
  box-shadow:9px 13px 22px #0008;
  transform:translateZ(-8px);
}

.catalog-cover-link:after{
  content:"";
  position:absolute;
  z-index:-1;
  left:7px;
  right:-12px;
  bottom:-7px;
  height:9px;
  background:linear-gradient(180deg,#f7f3e8 0 28%,#c9c1b1 30% 43%,#eee9dd 45% 100%);
  border:1px solid #a99f89;
  border-top:0;
  clip-path:polygon(0 0,100% 0,99% 100%,1% 100%);
  box-shadow:0 13px 22px #0009;
  transform:translateZ(-7px);
}

.catalog-spine{
  position:absolute;
  z-index:4;
  inset:0 auto 0 0;
  width:18px;
  pointer-events:none;
  background:linear-gradient(90deg,#0008,#0002 45%,#fff2 72%,transparent);
  border-right:1px solid #0004;
  mix-blend-mode:multiply;
}

.catalog-cover-link:hover,
.catalog-cover-link:focus-visible{
  transform:rotateY(-7deg) rotateX(1deg) rotateZ(0) translateY(-6px);
  filter:brightness(1.03);
  outline:none;
}

.catalog-cover-link:focus-visible{
  box-shadow:0 0 0 4px var(--yellow);
}

.catalog-cover-original{
  display:block;
  width:100%;
  height:auto;
  aspect-ratio:577/749;
  object-fit:contain;
  border:1px solid #ffe988;
  box-shadow:-32px 35px 65px #000d,3px 4px 0 #a77e00;
}

@media(max-width:590px){
  :root{
    --type-display:clamp(2.15rem,10vw,2.65rem);
    --type-section:clamp(2rem,9vw,2.45rem);
    --type-eyebrow:.88rem;
    --type-lead:1.04rem;
    --type-card-title:1.48rem;
    --type-body:1rem;
  }

  .catalog-copy h1,
  .scope-head h2,
  .catalog-cta h2{
    line-height:1.06;
  }

  .catalog-hero,
  .catalog-scope,
  .catalog-cta{
    padding-left:20px;
    padding-right:20px;
  }

  .catalog-cover-link{
    width:min(330px,74vw);
    transform:rotateY(-9deg) rotateX(2deg) rotateZ(-.4deg);
  }
}

@media(prefers-reduced-motion:reduce){
  .catalog-cover-link{transition:none}
}