/* Secciones comunes de las plantillas religiosas (comunión, bautizo, presentación).
   Va después de kit/base.css; cada diseño pone su portada y su carácter en css/app.css. */

.rel { --k-orn-1: var(--k-primary); --k-orn-2: var(--k-secondary); --k-orn-3: var(--k-accent); }
.rel h2 { font-weight: 500; }
.rel-hero { position: relative; display: flex; flex-direction: column; align-items: center; gap: .9rem; padding: clamp(36px, 8vw, 64px) var(--k-gap) clamp(48px, 10vw, 88px); overflow: hidden; text-align: center; }
.rel-name { margin: .2rem 0 0; font-size: clamp(2.8rem, 13vw, 5.4rem); font-weight: 500; line-height: 1.04; }
.rel-date { margin: 0; font-size: 1.05rem; }
.rel-countdown strong { font-family: var(--k-font-body); font-weight: 600; }
.rel-countdown > div { box-shadow: 0 0 0 1px var(--k-secondary); }

/* Bienvenida con frase bíblica */
.rel-welcome .k-divider { width: 72px; }
.rel-message { margin: 0 auto; max-width: 30em; font-size: clamp(1.1rem, 4.2vw, 1.3rem); line-height: 1.6; }
.rel-verse { max-width: 30em; margin: 1.8rem auto 0; padding: 1.2rem 1.4rem; border-left: 3px solid var(--k-accent); border-radius: 0 var(--k-radius) var(--k-radius) 0; background: var(--k-soft); text-align: left; }
.rel-verse p { margin: 0; font-family: var(--k-font-body); font-size: 1.08rem; font-style: italic; line-height: 1.6; }
.rel-verse cite { display: block; margin-top: .6rem; font: 600 .82rem/1.4 var(--k-font-body); font-style: normal; letter-spacing: .14em; text-transform: uppercase; }
.rel-parents { display: grid; gap: .3rem; margin: 1.6rem 0 0; font-weight: 600; font-size: 1.1rem; }
.rel-parents .k-eyebrow { margin: 0; }

/* Tarjetas, misa y recepción */
.rel-soft { background: color-mix(in srgb, var(--k-secondary) 26%, transparent); }
.rel-card h3 { font-family: var(--k-font-body); font-size: 1.3rem; font-weight: 600; }
.rel-note { color: var(--k-muted); font-style: italic; }

/* Padrinos */
.rel-people { display: grid; gap: 1rem; grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr)); }
.rel-people .k-person { margin: 0; }
.rel-people .k-person__name { font-family: var(--k-font-body); font-size: 1.25rem; font-weight: 600; }

/* Regalos, confirmación, compartir, pie */
.rel .rel-sobres { background: var(--k-primary); color: var(--k-on-primary); }
.rel-sobres h3 { margin: 0 0 .4rem; font-family: var(--k-font-body); font-size: 1.3rem; font-weight: 700; }
.rel-sobres p { margin: 0; }
.rel-rsvp { text-align: left; }
.rel-share { display: flex; flex-direction: column; align-items: center; gap: 1rem; }
.rel-footer { display: flex; flex-direction: column; align-items: center; gap: .5rem; }
.rel-footer-orn { display: block; width: 64px; }
.rel-footer .k-quote { font-family: var(--k-font-body); font-size: 1.15rem; }
.rel:not(.rel--orn) .rel-orn { display: none; }