:root{--navy:#092b50;--blue:#155a91;--sky:#eaf5ff;--gold:#c89b3c;--ink:#172331;--muted:#5d6977;--paper:#fff;--line:#dce6ef;--shadow:0 18px 48px rgba(9,43,80,.13)}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Georgia,"Times New Roman",serif;color:var(--ink);background:linear-gradient(180deg,#f7fbff 0,#fff 42rem);line-height:1.72}img{max-width:100%;height:auto}a{color:var(--blue)}a:hover{color:var(--navy)}.site-header{background:#fff;border-bottom:1px solid var(--line);position:relative;z-index:2}.header-inner{max-width:1120px;margin:auto;padding:.8rem 1rem;display:flex;align-items:center;gap:.85rem}.brand-logo img{display:block;border-radius:50%}.brand{font-family:Arial,sans-serif;font-weight:800;color:var(--navy);text-decoration:none;font-size:clamp(1.05rem,2vw,1.35rem)}.hero{max-width:1120px;margin:1.4rem auto 0;padding:0 1rem;position:relative}.hero picture img{width:100%;border-radius:24px;border:6px solid #fff;box-shadow:var(--shadow);display:block;aspect-ratio:19/5;object-fit:cover}.hero-overlay{margin:-4.2rem auto 0;position:relative;width:min(880px,calc(100% - 2rem));background:rgba(255,255,255,.96);border:1px solid var(--line);border-radius:22px;padding:1.25rem 1.4rem;text-align:center;box-shadow:var(--shadow)}.eyebrow{font-family:Arial,sans-serif;text-transform:uppercase;letter-spacing:.13em;font-weight:800;color:var(--gold);font-size:.78rem}.hero h1{margin:.15rem 0 .35rem;font-size:clamp(2rem,5vw,3.5rem);line-height:1.08;color:var(--navy)}.subtitle{margin:0;color:var(--muted);font-size:1.05rem}.breadcrumbs{max-width:1080px;margin:1rem auto;padding:0 1rem;font-family:Arial,sans-serif;font-size:.92rem;color:var(--muted)}.breadcrumbs ol{list-style:none;padding:0;margin:0;display:flex;flex-wrap:wrap;gap:.35rem}.breadcrumbs li+li:before{content:"›";margin-right:.35rem;color:var(--gold)}.breadcrumbs a{text-decoration:none}.main{max-width:1080px;margin:1.5rem auto;padding:0 1rem}.intro-card,.article,.faq,.subscribe,.related{background:var(--paper);border:1px solid var(--line);border-radius:24px;box-shadow:var(--shadow)}.intro-card{padding:clamp(1.4rem,4vw,2.5rem);display:grid;grid-template-columns:220px 1fr;gap:2rem;align-items:center}.intro-card figure{margin:0;text-align:center}.intro-card figure img{border-radius:18px;box-shadow:0 12px 28px rgba(9,43,80,.16)}h2{color:var(--navy);font-size:clamp(1.5rem,3vw,2.05rem);line-height:1.25;margin-top:2rem}h3{color:var(--blue);font-size:1.22rem;margin-top:1.7rem}.section-lead{font-size:1.12rem}.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;margin:1.5rem 0 2.2rem}.card{background:#fff;border:1px solid var(--line);border-radius:20px;padding:1.35rem;text-decoration:none;color:var(--ink);box-shadow:0 10px 28px rgba(9,43,80,.08);transition:.2s transform,.2s box-shadow}.card:hover{transform:translateY(-4px);box-shadow:var(--shadow)}.card strong{display:block;color:var(--navy);font-size:1.2rem;margin-bottom:.35rem}.card span{color:var(--muted)}.article{padding:clamp(1.25rem,4vw,3rem);overflow:hidden}.article>p{margin:1rem 0}.article h2{padding-bottom:.45rem;border-bottom:2px solid var(--sky)}.content-image{float:right;max-width:310px;margin:.35rem 0 1.2rem 2rem}.content-image img{border-radius:18px;box-shadow:0 12px 28px rgba(9,43,80,.15)}.prayer-box{background:linear-gradient(135deg,#eef7ff,#fffaf0);border-left:5px solid var(--gold);padding:1.25rem 1.4rem;border-radius:14px;font-size:1.08rem}.novena-nav{display:grid;grid-template-columns:repeat(3,1fr);gap:.55rem;margin:1.2rem 0}.novena-nav a{font-family:Arial,sans-serif;text-align:center;text-decoration:none;background:var(--sky);border-radius:999px;padding:.6rem}.faq,.subscribe,.related{margin-top:2rem;padding:clamp(1.25rem,4vw,2.2rem)}details{border-top:1px solid var(--line);padding:.9rem 0}details:first-of-type{border-top:0}summary{cursor:pointer;font-weight:700;color:var(--navy)}.subscribe{text-align:center;background:linear-gradient(135deg,#092b50,#155a91);color:#fff}.subscribe h2{color:#fff;margin-top:0}.subscribe p{color:#eaf5ff}.buttons{display:flex;flex-wrap:wrap;justify-content:center;gap:.8rem}.btn{font-family:Arial,sans-serif;display:inline-flex;align-items:center;justify-content:center;gap:.5rem;padding:.78rem 1.15rem;border-radius:999px;background:#fff;color:var(--navy);text-decoration:none;font-weight:800;box-shadow:0 7px 0 rgba(0,0,0,.18)}.btn:hover{transform:translateY(2px);box-shadow:0 5px 0 rgba(0,0,0,.18)}.related{margin-bottom:2rem}.related-links{display:grid;grid-template-columns:repeat(3,1fr);gap:.8rem}.related a{font-family:Arial,sans-serif;text-decoration:none;background:var(--sky);padding:1rem;border-radius:14px;font-weight:700}.footer{text-align:center;padding:1.5rem 1rem 2.5rem;color:var(--muted);font-family:Arial,sans-serif;font-size:.9rem}.share{display:flex;flex-wrap:wrap;gap:.65rem;margin-top:1rem}.share a{font-family:Arial,sans-serif;text-decoration:none;border:1px solid var(--line);border-radius:999px;padding:.55rem .8rem}.skip-link{position:absolute;left:-9999px}.skip-link:focus{left:1rem;top:1rem;background:#fff;padding:.7rem;z-index:10}@media(max-width:760px){.intro-card{grid-template-columns:1fr}.cards,.related-links{grid-template-columns:1fr}.hero-overlay{margin-top:-2.5rem}.content-image{float:none;margin:1rem auto;max-width:100%;text-align:center}.novena-nav{grid-template-columns:repeat(2,1fr)}.article{padding:1.2rem}.hero picture img{aspect-ratio:16/7}.buttons{flex-direction:column}.btn{width:100%}}@media print{.site-header,.subscribe,.related,.share,.breadcrumbs{display:none}.article{box-shadow:none;border:0}.hero-overlay{box-shadow:none}}
.microsite-nav,.share-section{background:var(--paper);border:1px solid var(--line);border-radius:24px;box-shadow:var(--shadow);margin-top:2rem;padding:clamp(1.25rem,4vw,2.2rem)}.microsite-nav h2,.share-section h2{margin-top:0}.microsite-links{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:.7rem}.microsite-links a{font-family:Arial,sans-serif;text-align:center;text-decoration:none;background:linear-gradient(180deg,#155a91,#092b50);color:#fff;padding:.75rem .55rem;border-radius:12px;font-weight:800;box-shadow:0 5px 0 rgba(0,0,0,.16)}.microsite-links a:hover{color:#fff;transform:translateY(2px);box-shadow:0 3px 0 rgba(0,0,0,.16)}.share-section{text-align:center}.share-section p{color:var(--muted)}.share{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:1rem;margin-top:1.2rem}.share-link{font-family:Arial,sans-serif;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.45rem;min-height:112px;padding:.8rem;border:1px solid var(--line);border-radius:18px;background:#fff;color:var(--navy);text-decoration:none;font-size:.95rem;cursor:pointer;transition:.2s transform,.2s box-shadow;box-shadow:0 8px 22px rgba(9,43,80,.08)}.share-link:hover{transform:translateY(-3px);box-shadow:var(--shadow);color:var(--navy)}.share-link svg{width:42px;height:42px;fill:currentColor}.copy-link{width:100%}.copy-status{min-height:1.5em;margin:.7rem 0 0;color:var(--blue)!important;font-family:Arial,sans-serif;font-weight:700}.intro-card .section-lead{font-size:1.06rem;line-height:1.75}.subscribe,.related,.share-section,.microsite-nav{overflow:hidden}@media(max-width:900px){.microsite-links{grid-template-columns:repeat(2,1fr)}.share{grid-template-columns:repeat(3,1fr)}}@media(max-width:560px){.microsite-links,.share{grid-template-columns:1fr 1fr}.share-link{min-height:100px}.share-link:last-child{grid-column:1/-1}}

/* Cabecera con la imagen principal vertical de San Bernardo */
.hero-portrait{
  min-height:390px;
  display:grid;
  grid-template-columns:minmax(220px,300px) minmax(0,1fr);
  align-items:center;
  gap:clamp(1.5rem,5vw,4.5rem);
  padding:clamp(1.3rem,4vw,2.5rem);
  border:6px solid #fff;
  border-radius:28px;
  background:
    radial-gradient(circle at 18% 18%,rgba(200,155,60,.22),transparent 30%),
    linear-gradient(135deg,#e9f4fc 0%,#fff 52%,#f8f0df 100%);
  box-shadow:var(--shadow);
  overflow:hidden;
}
.hero-portrait .hero-image-wrap{
  display:flex;
  justify-content:center;
  align-items:flex-end;
  align-self:stretch;
  position:relative;
}
.hero-portrait .hero-image-wrap:before{
  content:"";
  position:absolute;
  width:270px;
  height:270px;
  border-radius:50%;
  background:rgba(200,155,60,.15);
  top:50%;
  left:50%;
  transform:translate(-50%,-50%);
}
.hero-portrait .hero-image-wrap img{
  position:relative;
  z-index:1;
  width:min(236px,100%);
  height:auto;
  max-height:331px;
  object-fit:contain;
  filter:drop-shadow(0 16px 20px rgba(9,43,80,.22));
}
.hero-portrait .hero-overlay{
  margin:0;
  width:100%;
  padding:clamp(1.3rem,4vw,2.4rem);
  background:rgba(255,255,255,.9);
  backdrop-filter:blur(4px);
}

/* Colores reconocibles de los canales y redes sociales */
.btn-whatsapp{background:#25d366;color:#fff}
.btn-telegram{background:#229ed9;color:#fff}
.btn-whatsapp:hover,.btn-telegram:hover{color:#fff}
.share-link{color:#fff;border-color:transparent}
.share-link:hover{color:#fff}
.share-x{background:#000}
.share-facebook{background:#1877f2}
.share-whatsapp{background:#25d366}
.share-telegram{background:#229ed9}
.share-copy{background:#34495e;color:#fff}
.share-link svg{fill:#fff}

@media(max-width:760px){
  .hero-portrait{
    min-height:0;
    grid-template-columns:1fr;
    gap:.5rem;
    padding:1.1rem;
  }
  .hero-portrait .hero-image-wrap{min-height:245px}
  .hero-portrait .hero-image-wrap:before{width:225px;height:225px}
  .hero-portrait .hero-image-wrap img{max-height:270px;width:auto}
  .hero-portrait .hero-overlay{margin:0;padding:1.1rem}
}

/* Ajustes versión 4 */
.intro-card.intro-card-single{grid-template-columns:1fr}
.main>.cards,.main>.microsite-nav{margin-top:0;margin-bottom:2rem}

/* Navegación del micrositio integrada en la cabecera (versión 5) */
.header-inner{max-width:1220px;justify-content:space-between}.brand-group{display:flex;align-items:center;gap:.85rem;flex:0 0 auto}.header-microsite-nav{margin-left:auto;display:flex;align-items:center;justify-content:flex-end;gap:.45rem;font-family:Arial,sans-serif}.header-microsite-nav a{display:inline-flex;align-items:center;justify-content:center;min-height:40px;padding:.55rem .72rem;border:1px solid #c9d9e7;border-radius:10px;background:linear-gradient(180deg,#17669f,#0a365f);color:#fff;text-decoration:none;font-size:.78rem;font-weight:800;line-height:1.15;text-align:center;box-shadow:0 3px 0 rgba(9,43,80,.2);white-space:nowrap}.header-microsite-nav a:hover{color:#fff;transform:translateY(1px);box-shadow:0 2px 0 rgba(9,43,80,.2)}.header-microsite-nav a.is-current{background:linear-gradient(180deg,#d8aa48,#b8811c);border-color:#a97618;color:#fff;box-shadow:0 3px 0 rgba(116,77,9,.25)}
@media(max-width:1020px){.header-inner{flex-wrap:wrap}.header-microsite-nav{order:2;width:100%;margin-left:0;justify-content:center;padding-top:.2rem}.header-microsite-nav a{flex:1 1 150px;white-space:normal}}
@media(max-width:600px){.header-inner{padding:.7rem .75rem}.brand-logo img{width:52px;height:52px}.brand{font-size:1.05rem}.header-microsite-nav{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.5rem}.header-microsite-nav a{width:100%;min-height:44px;padding:.55rem .45rem}.header-microsite-nav a:last-child{grid-column:1/-1}}
@media print{.header-microsite-nav{display:none}}

/* Ajustes versión 6 */
.site-header .brand-group{gap:.55rem}
.site-header .brand-logo{display:flex;align-items:center;flex:0 0 auto}
.site-header .brand{display:flex;align-items:center;margin:0}
.main>.intro-card:first-child{margin-top:0;margin-bottom:1.5rem}
.main>.intro-card:first-child+.cards{margin-top:0}