/* Estilo «Editorial»: blanco, foto a sangre arriba, nombres enormes a la izquierda, filetes y
   números de sección. Contraste sobre blanco: texto 17,9 · suave 6,7 · arcilla 6,1 · cobalto 8,7 ·
   verde inglés 8,1; blanco sobre cada acento ≥ 6,1. */
.boda--editorial {
  --b-fondo: #FFFFFF;
  --b-tarjeta: #F3F2EE;
  --b-texto: #171717;
  --b-suave: #5C5C58;
  --b-borde: #171717;
  --b-sobre-acento: #FFFFFF;
  --b-radio: 0;
  --b-ancho: 44rem;
  counter-reset: seccion;
}
.boda--editorial[data-color="tinta"] { --b-acento: #171717; --b-acento-texto: #171717; }
.boda--editorial[data-color="arcilla"] { --b-acento: #9A4B32; --b-acento-texto: #9A4B32; }
.boda--editorial[data-color="cobalto"] { --b-acento: #2442A8; --b-acento-texto: #2442A8; }
.boda--editorial[data-color="verde-ingles"] { --b-acento: #1F5A45; --b-acento-texto: #1F5A45; }

/* Portada: la foto es el fondo de la portada y los nombres van encima, abajo a la izquierda, sobre un
   velo oscuro que garantiza que se lean (texto blanco sobre ≥ 62 % de negro). Sin foto: tipografía sola. */
.boda--editorial .b-portada {
  display: grid; justify-items: start; text-align: left; gap: 1rem;
  padding: 0 0 3rem; max-width: 64rem; margin-inline: auto;
}
.boda--editorial .b-portada > :not(.b-foto):not(.b-portada-marco):not(.b-adorno) { margin-inline: 1.25rem; }
.boda--editorial[data-foto="si"] .b-foto,
.boda--editorial[data-foto="si"] .b-portada-marco { grid-area: 1 / 1; }
.boda--editorial .b-foto {
  /* Móvil: la foto ENTERA a su proporción (si los nombres no caben encima, crece un poco y recorta por
     los lados). Ordenador: alto limitado y, si hay que recortar, se guarda la parte de arriba (caras). */
  display: block; width: 100%; max-width: none; height: auto; align-self: stretch; aspect-ratio: auto;
  object-fit: cover; object-position: center 25%; border-radius: 0;
}
@media (min-width: 48rem) { .boda--editorial .b-foto { height: min(85vh, 46rem); } }
.boda--editorial[data-foto="si"] .b-portada-marco {
  display: grid; align-content: end; justify-items: start; gap: .7rem; width: 100%;
  padding: 6rem 1.25rem 1.6rem;
  background: linear-gradient(180deg, transparent 35%, rgb(10 10 10 / .35) 55%, rgb(10 10 10 / .72) 100%);
  color: #FFFFFF;
}
@media (min-width: 48rem) { .boda--editorial[data-foto="si"] .b-portada-marco { padding: 8rem 3rem 2.5rem; } }
.boda--editorial[data-foto="si"] .b-antes,
.boda--editorial[data-foto="si"] .b-nombres,
.boda--editorial[data-foto="si"] .b-y,
.boda--editorial[data-foto="si"] .b-fecha,
.boda--editorial[data-foto="si"] .b-cuenta { color: #FFFFFF; }
.boda--editorial[data-foto="si"] .b-fecha { border-top-color: rgb(255 255 255 / .7); }
.boda--editorial[data-foto="no"] .b-portada-marco { display: grid; gap: .9rem; justify-items: start; padding: 4rem 1.25rem 0; border-top: 10px solid var(--b-acento); width: 100%; }
.boda--editorial .b-antes { color: var(--b-acento-texto); font-weight: 600; letter-spacing: .3em; }
.boda--editorial .b-nombres {
  justify-items: start; text-align: left; line-height: .92; letter-spacing: -.02em;
  font-size: clamp(3.2rem, 15vw, 7.5rem); color: var(--b-texto);
}
.boda--editorial[data-tipografia="minimal"] .b-nombres { letter-spacing: .02em; font-size: clamp(3rem, 14vw, 6.4rem); }
.boda--editorial[data-tipografia="moderna"] .b-nombres { font-weight: 300; }
.boda--editorial .b-y { font-size: .45em; color: var(--b-acento-texto); font-style: italic; }
.boda--editorial .b-fecha { font-weight: 600; text-transform: uppercase; letter-spacing: .12em; font-size: .9rem; border-top: 1px solid var(--b-borde); padding-top: .8rem; width: 100%; max-width: 36rem; }
.boda--editorial .b-mensaje { max-width: 34ch; font-size: 1.15rem; margin-top: 1.4rem; }
.boda--editorial .b-boton { text-transform: uppercase; letter-spacing: .14em; font-size: .85rem; }

/* Secciones numeradas como en una revista (el orden de la web sí es una secuencia) */
.boda--editorial .b-seccion { border-top: 1px solid var(--b-borde); }
.boda--editorial .b-seccion h2 { text-align: left; font-size: clamp(2.2rem, 9vw, 3.4rem); line-height: 1; color: var(--b-texto); counter-increment: seccion; }
.boda--editorial .b-seccion h2::before {
  content: counter(seccion, decimal-leading-zero); display: block; font: 600 .8rem/1 var(--b-letra-texto);
  letter-spacing: .2em; color: var(--b-acento-texto); margin-bottom: .8rem;
}
.boda--editorial .b-tarjeta { text-align: left; border-left: 3px solid var(--b-acento); }
.boda--editorial .b-autobus { text-align: left; }
.boda--editorial .b-galeria { gap: 2px; }
