/* ============================================================
   01 · PORTADA (hero)
   Anatomy unlike siblings: masthead editorial ASIMÉTRICO.
   Columna de texto ancha a la izquierda (folio + titular + dos
   entradas con capitular) y una plancha-rodillo alta a la derecha,
   descolgada ópticamente. Sin centrar, sin triplete eyebrow→h2→lead.
   ============================================================ */

.portada {
  position: relative;
  padding: clamp(3.4rem, 2rem + 6vw, 6.5rem) var(--canal) var(--seccion-y);
  background:
    radial-gradient(circle at 86% 16%, rgba(212,175,55,0.20) 0%, transparent 42%),
    radial-gradient(circle at 92% 8%, rgba(190,20,48,0.10) 0%, transparent 34%),
    linear-gradient(168deg, var(--papel-claro) 0%, var(--papel) 60%, var(--vitela) 100%);
  overflow: hidden;
}

.portada__rejilla {
  width: var(--medida); max-width: 1320px; margin-inline: auto;
  display: grid;
  grid-template-columns: 1.16fr 0.84fr;
  gap: clamp(2rem, 4vw, 5.5rem);
  align-items: start;
}

/* ---- columna de texto ---- */
.portada__texto { padding-top: 0.6rem; }

.portada__folio { margin-bottom: 1.6rem; }

.portada__rotulo {
  display: inline-flex; align-items: center; gap: 0.8ch;
  font-family: "Public Sans", sans-serif;
  font-size: 0.84rem; font-weight: 700; letter-spacing: 0.26em;
  text-transform: uppercase; color: var(--rojo);
  margin-bottom: 1.5rem;
}
.portada__rotulo::before { content: ""; width: 2.4rem; height: 2px; background: var(--rojo); }

.portada__titulo {
  font-size: var(--t-portada);
  letter-spacing: -0.012em;
  margin-bottom: 1.7rem;
  max-width: 17ch;
}

/* capitular (humanización) en el primer párrafo */
.portada__entrada {
  font-size: var(--t-lead);
  color: var(--tinta);
  max-width: 54ch;
  margin-bottom: 1.3rem;
}
.portada__entrada--cap::first-letter {
  float: left;
  font-family: "Cormorant Garamond", serif;
  font-weight: 700; font-size: 4.4em; line-height: 0.74;
  padding: 0.06em 0.16em 0 0; color: var(--oro-hondo);
}
.portada__nota {
  font-size: var(--t-cuerpo); color: var(--tinta-media);
  max-width: 56ch; margin-bottom: 2.4rem;
}

.portada__cta { display: flex; flex-wrap: wrap; gap: 1.1rem 1.6rem; align-items: center; }

/* ---- plancha-rodillo (descolgada) ---- */
.portada__media { position: relative; margin-top: 2.4rem; }
.portada__plancha { aspect-ratio: 3 / 3.4; }
.portada__plancha > img { aspect-ratio: 3 / 3.4; }

/* línea de pago sobre la plancha */
.portada__pago {
  position: absolute; left: -0.9rem; right: 1.8rem; top: 38%;
  height: 2px; background: var(--oro-grad); z-index: 3;
  box-shadow: 0 0 16px rgba(212,175,55,0.5);
}
.portada__ficha {
  position: absolute; right: -0.6rem; bottom: 2.2rem; z-index: 4;
  background: var(--papel-claro); border: 1px solid var(--oro-hondo);
  padding: 0.9rem 1.2rem; box-shadow: var(--sombra-plancha);
  transform: rotate(-2.4deg);                 /* pegado "a mano" */
}
.portada__ficha b {
  display: block; font-family: "Cormorant Garamond", serif;
  font-size: 2rem; font-weight: 700; color: var(--tinta); line-height: 1;
}
.portada__ficha span {
  font-family: "Public Sans", sans-serif; font-size: 0.72rem;
  letter-spacing: 0.2em; text-transform: uppercase; color: var(--tinta-tenue);
}

@media (max-width: 1024px) {
  .portada__rejilla { grid-template-columns: 1fr; gap: 2.6rem; }
  .portada__titulo, .portada__entrada, .portada__nota { max-width: none; }
  .portada__media { margin-top: 0.4rem; }
  .portada__plancha, .portada__plancha > img { aspect-ratio: 3 / 2.4; }
  .portada__cta { flex-direction: column; align-items: stretch; }
  .portada__cta .rubrica { justify-content: center; }
}