/* CATEDRAL SAN JUAN BAUTISTA — ACABADO FOTOGRAFICO / INDEX 2026
   Una sola capa de diseño, sin tocar la introduccion cinematografica. */

/* Fondo con variacion de luz y textura, sin tarjetas adicionales. */
.sv-home {
  background:
    radial-gradient(ellipse 55% 22% at 87% 31%,rgba(208,219,222,.27),transparent 72%),
    radial-gradient(ellipse 45% 17% at 8% 77%,rgba(218,208,189,.20),transparent 78%),
    #f8f6f1;
}
.sv-home .sv-today{
  position:relative;
  border-bottom:1px solid rgba(25,69,99,.18);
  background:linear-gradient(100deg,rgba(255,255,255,.42),rgba(244,244,238,.07) 46%,rgba(240,247,246,.34));
}
.sv-home .sv-today::before{
  content:"";position:absolute;left:0;right:0;bottom:-1px;height:1px;
  background:linear-gradient(90deg,rgba(181,154,108,.62),transparent 26%,transparent 80%,rgba(24,72,104,.31));
  pointer-events:none;
}
.sv-home .sv-today__stamp{background:rgba(234,241,243,.85);border-left-color:#1a5477;box-shadow:0 9px 22px rgba(25,53,67,.065)}
.sv-home .sv-today__dot{background:#bd9e71;box-shadow:0 0 0 6px rgba(192,165,123,.14)}

/* El versiculo respira sobre el lienzo continuo. */
.sv-home .sv-verse{padding-bottom:88px}
.sv-home .sv-verse__content{filter:drop-shadow(0 12px 25px rgba(120,111,93,.042))}
.sv-home .sv-prayer__figure::after{
  background:linear-gradient(142deg,rgba(183,203,204,.28),rgba(190,169,136,.09) 68%,transparent);
}

/* Fotografia escenografica: descanso visual entre zonas tipograficas. */
.sv-highlight{
  position:relative;isolation:isolate;overflow:hidden;
  min-height:285px;display:flex;align-items:center;
  background:linear-gradient(105deg,#0b304e,#164b70);
  color:#fffdf6;margin:0;
  border-block:1px solid rgba(218,199,158,.37);
}
.sv-highlight::before{
  content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  background:
    linear-gradient(90deg,rgba(5,30,52,.98) 0%,rgba(8,43,69,.93) 33%,rgba(8,46,72,.61) 56%,rgba(8,45,71,.12) 100%),
    linear-gradient(0deg,rgba(2,24,44,.30),transparent 38%);
}
.sv-highlight::after{
  content:"";position:absolute;z-index:2;inset:13px 14px;pointer-events:none;
  border:1px solid rgba(223,213,191,.13);
}
.sv-highlight__art{
  position:absolute;z-index:0;inset:0 0 0 33%;display:grid;grid-template-columns:1.12fr .7fr .72fr;
  gap:3px;overflow:hidden;
}
.sv-highlight__art img{
  display:block;min-width:0;width:100%;height:100%;object-fit:cover;
  filter:saturate(.81) contrast(1.04);transition:transform 1.1s cubic-bezier(.2,.7,.2,1);
}
.sv-highlight__art img:first-child{object-position:50% 46%}
.sv-highlight__art img:nth-child(2){object-position:52% 45%}
.sv-highlight__art img:nth-child(3){object-position:center 63%}
.sv-highlight:hover .sv-highlight__art img{transform:scale(1.035)}
.sv-highlight__inner{position:relative;z-index:3;width:min(var(--sv-width),calc(100% - 72px));padding-block:39px 42px}
.sv-highlight__copy{max-width:550px}
.sv-highlight__eyebrow{
  margin:0 0 12px;font:700 10px/1.5 'DM Sans',sans-serif;
  letter-spacing:.21em;color:#d3dfdf;
}
.sv-highlight__eyebrow span{font-size:15px;vertical-align:-1px;color:#d9bd95;margin-right:10px}
.sv-highlight h2{
  margin:0;color:#fffefa;font:500 clamp(42px,4.5vw,65px)/.94 'Cormorant Garamond',Georgia,serif;
  letter-spacing:-.035em;text-wrap:balance;
}
.sv-highlight h2 em{font-style:italic;color:#e4d1b0!important;font-weight:400}
.sv-highlight__description{margin:15px 0 16px;color:#e0eaf0;font:400 14px/1.6 'DM Sans',Arial,sans-serif;max-width:395px}
.sv-highlight__link{
  display:inline-flex;align-items:center;gap:13px;padding:7px 0 9px;
  font:700 12px/1.35 'DM Sans',Arial,sans-serif;color:#fff!important;
  text-decoration:none!important;border-bottom:1px solid rgba(226,213,188,.64);
  transition:gap .25s,border-color .25s;
}
.sv-highlight__link span{display:grid;place-items:center;width:27px;height:27px;border-radius:50%;background:rgba(255,255,255,.14);transition:transform .25s}
.sv-highlight__link:hover{gap:19px;border-color:white}
.sv-highlight__link:hover span{transform:translate(2px,-2px)}
.sv-highlight__link:focus-visible{outline:3px solid #f3ca80;outline-offset:4px}

/* Vida comunitaria mas contrastada: mejor recorte, sombras y jerarquia. */
.sv-home .sv-life{padding-top:72px;padding-bottom:56px}
.sv-home .sv-life::before{display:none}
.sv-home .sv-life__heading{padding-bottom:32px}
.sv-home .sv-life-card{
  border-color:rgba(25,64,89,.15);
  box-shadow:0 12px 28px rgba(21,47,61,.07),0 2px 6px rgba(13,38,51,.02);
}
.sv-home .sv-life-card::before{
  content:"";position:absolute;z-index:3;inset:0 auto 0 0;width:3px;pointer-events:none;
  background:linear-gradient(180deg,rgba(25,78,110,.76),rgba(189,162,117,.43),transparent);
}
.sv-home .sv-life-card__image img{transition:transform .8s cubic-bezier(.22,.72,.28,1)}
.sv-home .sv-life-card:hover .sv-life-card__image img{transform:scale(1.055)}
.sv-home .sv-announcements--editorial{background:linear-gradient(125deg,#f3f7f7,#e9f0ef)}
.sv-home .sv-closing{padding-bottom:48px}

/* Footer: fotografia REAL visible bajo azul institucional; no logo gigante. */
.sv-footer{
  background:#082e4e!important;
  border-top:1px solid rgba(194,166,123,.65);
}
.sv-footer::before{
  content:"";position:absolute;inset:0;z-index:-1;opacity:1;
  background:
    linear-gradient(96deg,rgba(5,31,51,.96) 0%,rgba(7,37,61,.92) 28%,rgba(8,43,69,.77) 59%,rgba(6,34,59,.80) 100%),
    url('../img/fachada-hero.png') center 52% / cover no-repeat !important;
}
.sv-footer::after{
  content:"";position:absolute;inset:0;z-index:-1;
  background:
    radial-gradient(ellipse at 79% 44%,rgba(83,142,177,.16),transparent 52%),
    linear-gradient(90deg,transparent 60%,rgba(8,43,65,.04) 100%);
  opacity:1;pointer-events:none;filter:none;
}
.sv-footer__inner{position:relative;z-index:1;padding-block:45px 24px}
.sv-footer__brand h2{color:#fff!important;text-shadow:0 2px 12px rgba(4,21,38,.13)}
.sv-footer__kicker{color:#c7dce8}
.sv-footer__contact a{color:#fff!important}
.sv-footer__bottom{border-top-color:rgba(232,244,246,.25)}
.sv-footer__social a{background:rgba(255,255,255,.06);border-color:rgba(224,241,248,.32)}
.sv-footer__social a:hover{background:rgba(255,255,255,.18)}

/* Animaciones de aparicion progresiva, desactivadas cuando se reduce movimiento. */
@media(prefers-reduced-motion:no-preference){
  .sv-motion-enabled .sv-highlight__copy,
  .sv-motion-enabled .sv-life__heading,
  .sv-motion-enabled .sv-life-card{
    opacity:0;transform:translate3d(0,22px,0);
    transition:opacity .84s ease,transform .92s cubic-bezier(.2,.75,.25,1);
  }
  .sv-motion-enabled .sv-highlight__copy.sv-is-visible,
  .sv-motion-enabled .sv-life__heading.sv-is-visible,
  .sv-motion-enabled .sv-life-card.sv-is-visible{
    opacity:1;transform:translate3d(0,0,0);
  }
  .sv-motion-enabled .sv-life-card:nth-child(2){transition-delay:.12s}
  .sv-home .sv-life-card:hover{transform:translateY(-5px)}
}

/* Tableta: espacio cuidado, sin dos columnas forzadas. */
@media(max-width:960px){
  .sv-highlight{min-height:265px}
  .sv-highlight__art{left:28%;grid-template-columns:1.4fr .75fr}
  .sv-highlight__art img:nth-child(3){display:none}
  .sv-highlight::before{background:linear-gradient(90deg,rgba(4,30,51,.97),rgba(8,45,72,.82) 48%,rgba(8,45,72,.18))}
}

/* Movil propio: una imagen de arquitectura y un titular corto; nada de tarjetas gigantes. */
@media(max-width:760px){
  .sv-home .sv-today{background:linear-gradient(115deg,rgba(255,255,255,.50),rgba(239,245,246,.24))}
  .sv-home .sv-verse{padding-bottom:69px}
  .sv-highlight{min-height:255px;align-items:end}
  .sv-highlight::after{inset:9px}
  .sv-highlight__art{inset:0;width:100%;display:block}
  .sv-highlight__art img{display:none}
  .sv-highlight__art img:first-child{display:block;width:100%;object-position:50% 49%;filter:brightness(.92) saturate(.82)}
  .sv-highlight::before{
    background:linear-gradient(90deg,rgba(5,30,51,.92),rgba(6,37,60,.67) 67%,rgba(7,41,67,.33)),
               linear-gradient(0deg,rgba(3,23,43,.58),transparent 74%);
  }
  .sv-highlight__inner{width:calc(100% - 44px);padding-block:33px 34px}
  .sv-highlight h2{font-size:clamp(36px,9.5vw,46px);max-width:340px;line-height:.98}
  .sv-highlight__eyebrow{font-size:9px;letter-spacing:.16em;margin-bottom:9px}
  .sv-highlight__description{font-size:12px;max-width:305px;margin:10px 0 13px;line-height:1.45}
  .sv-highlight__link{font-size:11px;gap:9px;padding-bottom:5px}
  .sv-highlight__link span{width:25px;height:25px}
  .sv-home .sv-life{padding-top:45px;padding-bottom:34px}
  .sv-home .sv-life__heading{padding-bottom:23px}
  .sv-home .sv-closing{padding-bottom:27px}
  .sv-footer::before{
    background:
      linear-gradient(90deg,rgba(5,30,51,.96),rgba(7,39,64,.88) 68%,rgba(6,35,58,.86)),
      url('../img/fachada-hero.png') 55% center / cover no-repeat !important;
  }
  .sv-footer__inner{padding-top:31px;padding-bottom:20px}
  .sv-footer__bottom{margin-top:17px}
}
@media(max-width:380px){
  .sv-highlight{min-height:245px}
  .sv-highlight h2{font-size:37px}
  .sv-highlight__inner{width:calc(100% - 34px)}
}
@media(prefers-reduced-motion:reduce){
  .sv-highlight__art img,.sv-home .sv-life-card__image img,.sv-highlight__link,
  .sv-highlight__link span{transition:none!important;animation:none!important}
}