/* Tipografía de lectura: EB Garamond; titular Cormorant Garamond. */
/* CATEDRAL SAN JUAN BAUTISTA — LECTURA DEVOCIONAL
   Se aplica SOLO a oracion.php. El catálogo conserva sus tarjetas actuales.
   Azul marino, marfil, oro champán y motivo arquitectónico vectorial propio. */
.prayer-reading--editorial {
  min-height: 0;
  padding: 24px 0 42px;
  background:
    radial-gradient(ellipse at 7% 12%,rgba(26,85,106,.055),transparent 36%),
    radial-gradient(ellipse at 95% 90%,rgba(190,152,91,.055),transparent 33%),
    linear-gradient(180deg,#f8f7f3 0%,#f5f3ee 100%);
}
.prayer-reading--editorial .prayer-reading__shell {
  width: min(790px,calc(100% - 52px));
  margin: 0 auto;
}
.prayer-reading--editorial .prayer-reading__nav {margin:0 0 13px}
.prayer-reading--editorial .prayer-reading__nav a {
  display:inline-flex; align-items:center; gap:10px;
  color:#185375; font:600 11px/1.4 'DM Sans',sans-serif;
  letter-spacing:.055em; text-decoration:none;
}
.prayer-reading--editorial .prayer-reading__nav a span {font:400 21px/1 Georgia,serif}
.prayer-reading--editorial .prayer-reading__nav a:hover {color:#0d3450; text-decoration:underline; text-underline-offset:5px}
.prayer-reading--editorial .prayer-reading__article {
  position:relative; isolation:isolate; overflow:hidden;
  background:#fffefa;
  border:1px solid rgba(177,146,96,.42);
  border-radius:16px;
  box-shadow:0 15px 39px rgba(22,49,56,.065),0 1px 1px rgba(60,65,55,.025);
}
.prayer-reading--editorial .prayer-reading__article::before {
  content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background-image:radial-gradient(rgba(47,66,72,.15) .48px,transparent .8px);
  background-size:20px 19px;opacity:.105;
}
.prayer-reading--editorial .prayer-reading__masthead {
  min-height:0;display:grid;grid-template-columns:minmax(0,1fr) 100px;
  align-items:center;gap:16px;
  padding:27px 42px 25px;
  border-bottom:1px solid rgba(28,81,107,.13);
  background:
    radial-gradient(circle at 90% 20%,rgba(225,232,229,.65),transparent 46%),
    linear-gradient(117deg,#f9fbf8 0%,#edf3f2 100%);
}
.prayer-reading--editorial .prayer-reading__masthead::before {
  content:"";position:absolute;left:42px;top:0;bottom:auto;
  width:52px;height:1px;border-radius:0;
  background:linear-gradient(90deg,#b29060,#d7c3a1,transparent);
}
.prayer-reading--editorial .prayer-reading__heading {position:relative;z-index:1}
.prayer-reading--editorial .prayer-eyebrow {
  display:inline-flex;align-items:center;gap:11px;
  color:#174766;letter-spacing:.17em;
  font:600 9px/1.4 'DM Sans',sans-serif;
}
.prayer-reading--editorial .prayer-eyebrow__mark {color:#bb9867;font-size:16px;letter-spacing:0}
.prayer-reading--editorial .prayer-reading__heading h1 {
  margin:9px 0 7px;
  font:400 clamp(40px,4.5vw,53px)/1.03 'Cormorant Garamond',Georgia,serif;
  color:#2b2c28;letter-spacing:-.028em;text-wrap:balance;
}
.prayer-reading--editorial .prayer-reading__subtitle {
  margin:0;max-width:440px;
  font:400 12px/1.55 'DM Sans',sans-serif;
  color:#69716e;
}
.prayer-reading--editorial .prayer-reading__symbol {
  display:flex;align-items:center;justify-content:center;
  height:109px;overflow:hidden;
  color:#63899a;opacity:.47;
}
.prayer-reading--editorial .prayer-reading__symbol svg {width:96px;height:116px;display:block}
.prayer-reading--editorial .prayer-reading__body {
  text-align:center;
  padding:25px 49px 26px;
  background:transparent;
}
.prayer-reading--editorial .prayer-reading__ornament {
  margin:0 auto 19px;gap:11px;
  font:400 13px/1 Georgia,serif;color:#c09d68;
}
.prayer-reading--editorial .prayer-reading__ornament span {width:30px;height:1px;background:#d9c5a7}
.prayer-reading--editorial .prayer-reading__text {
  max-width:610px;margin:0 auto;
  text-align:center;
}
.prayer-reading--editorial .prayer-reading__text p {
  margin:0 auto 15px;
  font:400 clamp(21px,1.9vw,24px)/1.52 'EB Garamond',Georgia,serif;
  color:#332e28;letter-spacing:.004em;text-wrap:pretty;
}
.prayer-reading--editorial .prayer-reading__text p:last-child {
  margin-top:17px;margin-bottom:0;
  font-style:italic;font-size:clamp(23px,2vw,25px);
  color:#315f70;
}
.prayer-reading--editorial .prayer-reading__closing {
  width:44px;height:1px;margin:17px auto 0;
  background:linear-gradient(90deg,transparent,#c5ad83,transparent);
}
.prayer-reading--editorial .prayer-reading__return {
  display:inline-flex;align-items:center;gap:11px;
  margin-top:12px;padding:6px 0;
  border:0;border-radius:0;background:transparent;
  box-shadow:none;color:#235b79;
  font:500 11px/1.4 'DM Sans',sans-serif;
  letter-spacing:.04em;text-decoration:none;
  transition:color .2s ease;
}
.prayer-reading--editorial .prayer-reading__return span {font:400 18px/1 Georgia,serif}
.prayer-reading--editorial .prayer-reading__return:hover {color:#10354e;text-decoration:underline;text-underline-offset:5px;background:transparent}
@media (max-width:700px) {
 .prayer-reading--editorial {padding:20px 0 34px}
 .prayer-reading--editorial .prayer-reading__shell {width:calc(100% - 30px)}
 .prayer-reading--editorial .prayer-reading__nav {margin-bottom:11px}
 .prayer-reading--editorial .prayer-reading__article {border-radius:14px}
 .prayer-reading--editorial .prayer-reading__masthead {
   display:block;padding:24px 25px 23px;
   background:
     url('../img/oraciones-trazo-arco.svg') calc(100% + 60px) center / 180px auto no-repeat,
     linear-gradient(115deg,#f9fbf8,#ecf3f1);
 }
 .prayer-reading--editorial .prayer-reading__masthead::before {left:25px;width:46px}
 .prayer-reading--editorial .prayer-reading__symbol {display:none}
 .prayer-reading--editorial .prayer-eyebrow {font-size:9px;letter-spacing:.15em}
 .prayer-reading--editorial .prayer-reading__heading h1 {font-size:clamp(36px,9.5vw,46px);line-height:1.04;margin:9px 0 7px}
 .prayer-reading--editorial .prayer-reading__subtitle {font-size:12px;max-width:290px}
 .prayer-reading--editorial .prayer-reading__body {padding:23px 25px 26px}
 .prayer-reading--editorial .prayer-reading__ornament {margin-bottom:18px}
 .prayer-reading--editorial .prayer-reading__text p {font-size:clamp(20px,5.7vw,23px);line-height:1.53;margin-bottom:15px}
 .prayer-reading--editorial .prayer-reading__text p:last-child {font-size:clamp(22px,5.9vw,24px);margin-top:15px}
}
@media (max-width:360px) {
 .prayer-reading--editorial .prayer-reading__shell {width:calc(100% - 22px)}
 .prayer-reading--editorial .prayer-reading__masthead {padding:23px 20px 21px}
 .prayer-reading--editorial .prayer-reading__masthead::before {left:20px}
 .prayer-reading--editorial .prayer-reading__heading h1 {font-size:clamp(34px,9.3vw,41px)}
 .prayer-reading--editorial .prayer-reading__body {padding:21px 18px 25px}
}
@media (prefers-reduced-motion:reduce) {
  .prayer-reading--editorial .prayer-reading__return {transition:none}
}


/* ============================================================
   FONDO FOTOGRÁFICO REAL EN LECTURAS INDIVIDUALES · NOV 2026
   Fotografía auténtica del altar de la Catedral San Juan Bautista.
   Solo el entorno de la tarjeta, nunca detrás del texto de oración.
   ============================================================ */
.prayer-reading--editorial {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  background: #f7f6f1;
}

/* Imagen visible en los laterales; no tapa la lectura. */
.prayer-reading--editorial::before {
  content: "";
  position: absolute;
  inset: -16px;
  z-index: 0;
  pointer-events: none;
  background-image: url('../img/oracion-fondo-altar-real.webp');
  background-repeat: no-repeat;
  background-size: cover;
  background-position: 50% 58%;
  opacity: .56;
  filter: blur(5px) saturate(.72);
  transform: scale(1.015);
}

/* Velo marfil: más transparente en los extremos y más claro en el centro. */
.prayer-reading--editorial::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background:
    linear-gradient(90deg,
      rgba(247,246,241,.70) 0%,
      rgba(247,246,241,.76) 23%,
      rgba(247,246,241,.90) 42%,
      rgba(247,246,241,.90) 58%,
      rgba(247,246,241,.76) 77%,
      rgba(247,246,241,.70) 100%),
    linear-gradient(180deg,
      rgba(247,246,241,.24) 0%,
      rgba(247,246,241,.05) 50%,
      rgba(247,246,241,.35) 100%);
}

.prayer-reading--editorial > .prayer-reading__shell {
  position: relative;
  z-index: 1;
}

/* La tarjeta conserva su fondo marfil opaco y su borde dorado. */
.prayer-reading--editorial .prayer-reading__article {
  background: #fffefa;
  box-shadow:
    0 19px 55px rgba(17,45,53,.12),
    0 2px 9px rgba(17,45,53,.035);
}

@media (max-width: 700px) {
  .prayer-reading--editorial::before {
    background-position: 50% 50%;
    opacity: .31;
    filter: blur(5px) saturate(.7);
  }
  .prayer-reading--editorial::after {
    background: linear-gradient(180deg,
      rgba(250,249,246,.79),
      rgba(248,247,243,.86) 38%,
      rgba(248,247,243,.91));
  }
  .prayer-reading--editorial .prayer-reading__article {
    box-shadow: 0 13px 34px rgba(17,45,53,.09);
  }
}

@media (prefers-reduced-motion: reduce) {
  .prayer-reading--editorial::before {transform:none}
}
