#inicio {
  padding: 0;
  overflow: hidden;
  background: rgb(var(--aiw-fondo));
}
#inicio .inicio__rejilla {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.9fr);
  align-items: center;
  gap: clamp(2rem, 5vw, 5rem);
  min-height: max(640px, 92svh);
  padding-top: calc(var(--aiw-cabecera-alto) + 2.5rem);
  padding-bottom: 3.5rem;
}

/* ---------- texto ---------- */
#inicio .inicio__texto {
  max-width: 38rem;
}
#inicio .inicio__ante,
#inicio .inicio__titular,
#inicio .inicio__entradilla,
#inicio .inicio__acciones,
#inicio .inicio__nota {
  opacity: 0;
  transform: translate3d(0, 16px, 0);
  transition:
    opacity 0.8s var(--curva),
    transform 1s var(--curva);
}
#inicio .inicio__titular {
  margin: 0;
  font-size: clamp(2.6rem, 5vw, 4.6rem);
  line-height: 1;
  max-width: 13ch;
  transition-delay: 0.1s;
}
#inicio .inicio__entradilla {
  margin-top: 1.4rem;
  max-width: 34rem;
  font-size: clamp(1.05rem, 1.25vw, 1.2rem);
  line-height: 1.55;
  transition-delay: 0.22s;
}
#inicio .inicio__acciones {
  margin-top: 2rem;
  transition-delay: 0.34s;
}
#inicio .inicio__nota {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  margin-top: 1.5rem;
  font-size: 0.95rem;
  color: rgb(var(--aiw-suave));
  transition-delay: 0.46s;
}
#inicio .inicio__notaicono {
  display: inline-grid;
  color: rgb(var(--aiw-acentotexto));
}
#inicio .inicio__notaicono svg {
  width: 1.1rem;
  height: 1.1rem;
}
#inicio .inicio--listo .inicio__ante,
#inicio .inicio--listo .inicio__titular,
#inicio .inicio--listo .inicio__entradilla,
#inicio .inicio--listo .inicio__acciones,
#inicio .inicio--listo .inicio__nota {
  opacity: 1;
  transform: none;
}

/* ---------- el libro de pie, en 3D ---------- */
#inicio .inicio__escena {
  position: relative;
  display: grid;
  place-items: center;
  padding-block: 2rem 3rem;
  perspective: 1600px;
}
#inicio .inicio__libro {
  --ancho: clamp(210px, 23vw, 320px);
  --alto: calc(var(--ancho) * 1.6);
  --grosor: clamp(18px, 1.9vw, 26px);
  --ry: 30deg;
  --rx: 5deg;
  position: relative;
  width: var(--ancho);
  height: var(--alto);
  transform-style: preserve-3d;
  transform: rotateX(var(--rx)) rotateY(var(--ry));
  opacity: 0;
  transition: opacity 1.1s var(--curva);
}
#inicio .inicio--listo .inicio__libro {
  opacity: 1;
}
#inicio .inicio__cara {
  position: absolute;
  backface-visibility: hidden;
}
#inicio .inicio__cara--frente {
  inset: 0;
  transform: translateZ(calc(var(--grosor) / 2));
  border-radius: 0 3px 3px 0;
  overflow: hidden;
  box-shadow: 0 0 0 1px rgb(var(--aiw-texto) / 0.06);
}
/* brillo de la luz sobre la cubierta y el pliegue junto al lomo */
#inicio .inicio__cara--frente::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    linear-gradient(90deg, rgb(0 0 0 / 0.22) 0, rgb(255 255 255 / 0.14) 1.6%, transparent 5%),
    linear-gradient(115deg, rgb(255 255 255 / 0.16), transparent 32%, transparent 70%, rgb(0 0 0 / 0.06));
}
#inicio .inicio__cubierta,
#inicio .inicio__cubierta img,
#inicio .inicio__cubierta .foto__img {
  display: block;
  width: 100%;
  height: 100%;
  margin: 0;
  aspect-ratio: auto;
  object-fit: contain;
  border-radius: 0;
}
#inicio .inicio__cara--trasera {
  inset: 0;
  transform: rotateY(180deg) translateZ(calc(var(--grosor) / 2));
  background: rgb(var(--aiw-profundo));
}
#inicio .inicio__cara--lomo {
  top: 0;
  left: calc(50% - var(--grosor) / 2);
  width: var(--grosor);
  height: 100%;
  transform: rotateY(-90deg) translateZ(calc(var(--ancho) / 2));
  background:
    linear-gradient(90deg, rgb(0 0 0 / 0.28), rgb(255 255 255 / 0.1) 45%, rgb(0 0 0 / 0.18)),
    rgb(var(--aiw-acento));
}
#inicio .inicio__cara--canto {
  top: 2px;
  left: calc(50% - var(--grosor) / 2);
  width: var(--grosor);
  height: calc(100% - 4px);
  transform: rotateY(90deg) translateZ(calc(var(--ancho) / 2 - 2px));
  background:
    repeating-linear-gradient(90deg, rgb(var(--aiw-texto) / 0.08) 0 1px, transparent 1px 3px),
    rgb(var(--aiw-superficie));
}
#inicio .inicio__cara--arriba {
  top: calc(50% - var(--grosor) / 2);
  left: 0;
  width: calc(100% - 2px);
  height: var(--grosor);
  transform: rotateX(90deg) translateZ(calc(var(--alto) / 2 - 2px));
  background:
    repeating-linear-gradient(0deg, rgb(var(--aiw-texto) / 0.08) 0 1px, transparent 1px 3px),
    rgb(var(--aiw-superficie));
}
#inicio .inicio__sombra {
  position: absolute;
  left: 50%;
  bottom: 1.4rem;
  width: clamp(220px, 26vw, 360px);
  height: 34px;
  transform: translateX(-46%);
  border-radius: 50%;
  background: radial-gradient(closest-side, rgb(var(--aiw-texto) / 0.32), transparent);
  filter: blur(6px);
}
html[data-tema="oscuro"] #inicio .inicio__sombra {
  background: radial-gradient(closest-side, rgb(0 0 0 / 0.7), transparent);
}

/* ---------- tableta y móvil: el libro arriba, más pequeño ---------- */
@media (max-width: 900px) {
  #inicio .inicio__rejilla {
    grid-template-columns: 1fr;
    min-height: 0;
    gap: 1rem;
    padding-top: calc(var(--aiw-cabecera-alto) + 1.5rem);
  }
  #inicio .inicio__escena {
    order: -1;
    padding-block: 1rem 2.5rem;
  }
  #inicio .inicio__libro {
    --ancho: clamp(160px, 42vw, 230px);
    --grosor: 16px;
  }
  #inicio .inicio__sombra {
    width: clamp(170px, 46vw, 260px);
    bottom: 1rem;
  }
  #inicio .inicio__titular {
    font-size: clamp(2.3rem, 9vw, 3.3rem);
  }
}