.hero{
  position:relative;
  min-height:100svh;
  display:grid;
  place-items:center;
  padding:calc(var(--nav-height) + 24px) 0 44px 0;
  overflow:hidden;
  isolation:isolate;
}
.hero::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(135deg,rgba(61,43,31,.72),rgba(212,96,58,.40),rgba(232,160,69,.20)),
    url("../assets/images/oratorio_fronte2.jpeg") center/cover no-repeat;
  filter:saturate(1.05) contrast(1.05);
  transform:scale(1.02);
  pointer-events:none;
}
.hero::after{
  content:"";
  position:absolute;
  inset:-40px;
  background:
    radial-gradient(800px 380px at 15% 35%, rgba(244,201,122,.28), transparent 70%),
    radial-gradient(700px 420px at 80% 65%, rgba(232,160,69,.22), transparent 72%),
    radial-gradient(520px 320px at 60% 30%, rgba(212,96,58,.18), transparent 70%);
  mix-blend-mode:soft-light;
  pointer-events:none;
}
.hero-content{
  position:relative;
  z-index:5;
  width:min(920px,calc(100% - 40px));
  text-align:center;
  color:#fff;
}
.hero-content p{color:rgba(255,255,255,.88);font-weight:700;font-size:18px}
.hero-actions{margin-top:18px;display:flex;justify-content:center;gap:12px;flex-wrap:wrap}
.hero-actions,
.hero-actions .btn,
.hero-actions .btn.outline{
  position:relative;
  z-index:6;
  pointer-events:auto;
}

.section-title{
  text-align:center;
  margin-bottom:22px;
}
.section-title p{max-width:64ch;margin:10px auto 0 auto}

.space-card{
  overflow:hidden;
  display:flex;
  flex-direction:column;
  border:1px solid rgba(61,43,31,.10);
}
.space-card img{
  height:200px;
  width:100%;
  object-fit:cover;
  margin:0;
  border-radius:var(--radius-card) var(--radius-card) 0 0;
  transform:scale(1.01);
  filter:saturate(1.05) contrast(1.03);
}
.space-card .content{
  padding:18px 18px 20px 18px;
  background:
    linear-gradient(180deg, rgba(253,246,237,.65), rgba(255,255,255,1) 42%);
}
.space-card h3{margin:2px 0 8px 0}
.space-card p{margin:0;color:var(--color-text-light);font-weight:700}

.activities{
  position:relative;
  overflow:hidden;
  background:
    radial-gradient(900px 520px at 10% 20%, rgba(244,201,122,.38), transparent 70%),
    radial-gradient(900px 520px at 90% 30%, rgba(212,96,58,.18), transparent 72%),
    linear-gradient(180deg, rgba(255,255,255,.65), rgba(253,246,237,1));
  border-top:1px solid rgba(61,43,31,.08);
  border-bottom:1px solid rgba(61,43,31,.08);
  isolation:isolate;
}
.activities::before{
  content:"";
  position:absolute;
  inset:-2px;
  background:
    radial-gradient(420px 220px at 18% 68%, rgba(232,160,69,.18), transparent 70%),
    radial-gradient(460px 240px at 78% 74%, rgba(244,201,122,.18), transparent 70%);
  filter:blur(0.2px);
  pointer-events:none;
  z-index:-1;
}
.carousel-wrap{
  position:relative;
  margin-top:18px;
  padding:18px 16px 22px 16px;
  border-radius:32px;
  border:1px solid rgba(61,43,31,.10);
  background:rgba(255,255,255,.62);
  backdrop-filter:blur(10px);
  box-shadow:var(--shadow-warm);
  overflow:hidden;
}
.carousel-wrap::before,
.carousel-wrap::after{
  content:"";
  position:absolute;
  top:14px;
  bottom:18px;
  width:54px;
  pointer-events:none;
  z-index:6;
}
.carousel-wrap::before{
  left:10px;
  background:linear-gradient(90deg, rgba(255,255,255,.92), rgba(255,255,255,0));
}
.carousel-wrap::after{
  right:10px;
  background:linear-gradient(270deg, rgba(255,255,255,.92), rgba(255,255,255,0));
}
.carousel{
  display:flex;
  gap:14px;
  overflow:auto hidden;
  padding:8px 6px 16px 6px;
  scroll-snap-type:x mandatory;
  scroll-behavior:smooth;
  overscroll-behavior-x:contain;
  -webkit-overflow-scrolling:touch;
  scrollbar-width:thin;
  scrollbar-color:rgba(232,160,69,.55) rgba(61,43,31,.08);
  cursor:grab;
}
.carousel:active{cursor:grabbing}
.carousel:focus-visible{outline:none;box-shadow:var(--focus);border-radius:22px}
.carousel::-webkit-scrollbar{height:10px}
.carousel::-webkit-scrollbar-thumb{
  background:rgba(232,160,69,.40);
  border-radius:999px;
}
.activity-card{
  flex:0 0 min(240px,78vw);
  scroll-snap-align:start;
  overflow:hidden;
  position:relative;
  border:1px solid rgba(61,43,31,.10);
  box-shadow:0 16px 44px rgba(61,43,31,.08), 0 10px 28px rgba(232,160,69,.18);
  transform:translateZ(0);
}
.activity-card::before{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg, transparent 40%, rgba(0,0,0,.60));
  pointer-events:none;
  z-index:1;
}
.activity-card::after{
  content:"";
  position:absolute;
  inset:-40% -30%;
  background:linear-gradient(120deg, transparent 45%, rgba(255,255,255,.26), transparent 55%);
  transform:translateX(-30%) rotate(6deg);
  opacity:0;
  transition:opacity .22s ease, transform .5s ease;
  pointer-events:none;
  z-index:2;
}
.activity-card:hover::after{
  opacity:.9;
  transform:translateX(30%) rotate(6deg);
}
.activity-card img{
  height:220px;
  width:100%;
  margin:0;
  border-radius:var(--radius-card);
  object-fit:cover;
  transform:scale(1.03);
  filter:saturate(1.10) contrast(1.06);
}
.activity-card .label{
  position:absolute;
  left:12px;
  right:12px;
  bottom:12px;
  padding:12px 14px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  border-radius:18px;
  background:rgba(255,255,255,.16);
  border:1px solid rgba(255,255,255,.26);
  backdrop-filter:blur(10px);
  color:#fff;
  z-index:3;
}
.activity-card .label strong{font-weight:900;letter-spacing:.01em}
.badge{
  padding:8px 12px;
  border-radius:999px;
  font-weight:900;
  background:rgba(255,255,255,.18);
  border:1px solid rgba(255,255,255,.26);
  color:#fff;
}
.carousel-controls{
  position:absolute;
  inset:auto 0 -10px 0;
  display:none;
}
.carousel-controls button{
  pointer-events:auto;
  border:none;
  width:48px;height:48px;
  border-radius:999px;
  background:linear-gradient(135deg, rgba(255,255,255,.92), rgba(253,246,237,.78));
  border:1px solid rgba(61,43,31,.14);
  box-shadow:0 10px 26px rgba(61,43,31,.10), 0 10px 22px rgba(232,160,69,.16);
  cursor:pointer;
  display:grid;
  place-items:center;
  transition:transform .2s ease, filter .2s ease;
}
.carousel-controls button:hover{transform:translateY(-2px);filter:brightness(1.02)}
.carousel-controls button:focus-visible{outline:none;box-shadow:var(--shadow-warm),var(--focus)}
.arrow{
  width:12px;height:12px;
  border-right:3px solid rgba(61,43,31,.88);
  border-bottom:3px solid rgba(61,43,31,.88);
  transform:rotate(-45deg);
  margin-left:4px;
}
.arrow.left{transform:rotate(135deg);margin-left:0;margin-right:4px}

.cta-band{
  background:linear-gradient(135deg,rgba(244,201,122,.50),rgba(232,160,69,.22));
}

.parish-info{
  position:relative;
}
.parish-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:18px;
}
.parish-card{
  height:100%;
  overflow:hidden;
}
.parish-card-wide{
  grid-column:1 / -1;
}
.parish-card-media{
  display:block;
  width:100%;
  height:210px;
  object-fit:cover;
  border-bottom:1px solid rgba(61,43,31,.10);
}
.parish-card-media-wide{
  height:260px;
}
.parish-card-body{
  padding:24px;
  display:flex;
  flex-direction:column;
  gap:16px;
  background:
    linear-gradient(180deg, rgba(253,246,237,.78), rgba(255,255,255,1) 48%);
}
.parish-card-body h3{
  margin:0;
}
.parish-list,
.parish-scouts{
  display:grid;
  gap:14px;
}
.parish-scouts{
  grid-template-columns:repeat(2,minmax(0,1fr));
}
.parish-item{
  padding:16px 18px;
  border-radius:20px;
  border:1px solid rgba(61,43,31,.10);
  background:rgba(255,255,255,.72);
}
.parish-item strong{
  display:block;
  margin-bottom:6px;
  font-size:16px;
}
.parish-item p{
  margin:0;
  font-weight:700;
}
.parish-item p + p{
  margin-top:6px;
}
.parish-item a{
  font-weight:800;
}
.parish-item a:hover{
  text-decoration:underline;
}
.cta-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:22px;
  gap:22px;
  align-items:center;
}
.cta-grid img{
  border-radius:28px;
  border:1px solid rgba(61,43,31,.12);
  box-shadow:var(--shadow-warm);
  height:340px;
  width:100%;
  object-fit:cover;
}
.cta-grid .copy{
  padding:6px 0;
}
.cta-grid .copy h2{margin-bottom:10px}
.cta-grid .copy p{max-width:52ch}
.cta-grid .copy .btn{margin-top:6px}

@media (max-width:900px){
  .parish-grid,
  .parish-scouts{
    grid-template-columns:1fr;
  }
  .parish-card-media,
  .parish-card-media-wide{
    height:220px;
  }
  .cta-grid{grid-template-columns:1fr}
  .cta-grid img{height:280px}
}