/* ===== STAFF DIVIDER (signature element) ===== */
  .staff{
    position:relative;
    max-width:1120px;
    margin:0 auto;
    padding:0 32px;
  }

.staff.dark{ }

/* ===== HERO ===== */
  .hero{
    padding:88px 0 40px;
    position:relative;
    overflow:hidden;
  }

.hero-figure{
    position:relative;
    aspect-ratio:4/5;
    border:1px solid var(--line);
    border-radius:2px;
    box-shadow:var(--shadow);
    overflow:hidden;
  }

.hero-figure img{
    width:100%; height:100%;
    object-fit:cover;
    display:block;
    filter:grayscale(1) contrast(1.08) brightness(0.92);
  }

.hero-figure .tint{
    position:absolute; inset:0;
    background:linear-gradient(165deg, rgba(31,51,80,0.62), rgba(122,31,43,0.5));
    mix-blend-mode:multiply;
  }

.hero-figure::before{
    content:"";
    position:absolute; inset:14px;
    border:1px solid rgba(239,230,212,0.55);
    z-index:2;
    pointer-events:none;
  }

.hero-figure .staff-accent{
    position:absolute; left:24px; right:24px; bottom:26px;
    z-index:2;
    opacity:0.85;
  }

.hero-figure .caption{
    position:absolute; top:22px; left:26px; right:26px;
    z-index:2;
    font-family:'Jost', sans-serif;
    font-size:11.5px;
    letter-spacing:0.08em;
    text-transform:uppercase;
    color:rgba(239,230,212,0.85);
  }

.photo-duotone img{
    width:100%; height:100%;
    object-fit:cover;
    display:block;
    filter:grayscale(1) contrast(1.05) brightness(0.96);
  }

.photo-duotone::after{
    content:"";
    position:absolute; inset:0;
    background:linear-gradient(160deg, rgba(31,51,80,0.55), rgba(122,31,43,0.42));
    mix-blend-mode:multiply;
  }

.photo-band img{
    width:100%; height:100%;
    object-fit:cover;
    display:block;
    filter:grayscale(0.35) contrast(1.05) brightness(0.85);
  }

.photo-band .scrim{
    position:absolute; inset:0;
    background:linear-gradient(180deg, rgba(31,51,80,0.35) 0%, rgba(31,51,80,0.15) 40%, rgba(43,36,28,0.75) 100%);
  }

.photo-band .band-text{
    display:inline-block;
    background:rgba(18,14,10,0.72);
    padding:10px 25px;
  }

.photo-band .band-content p.band-line{
    font-family:'Fraunces', serif;
    font-style:italic;
    font-size:clamp(19px,2vw,24px);
    color:#F3ECDA;
    margin-top:10px;
    max-width:52ch;
  }

/* ===== COMPOSERS HEAD ASIDE ===== */
  .composers-head-row{
    display:grid;
    grid-template-columns:1fr auto;
    align-items:end;
    gap:40px;
    margin-bottom:48px;
  }

.cecilia-inset{
    width:132px;
    flex-shrink:0;
    border:1px solid var(--line);
    box-shadow:var(--shadow);
  }

.cecilia-inset img{
    width:100%; display:block;
    aspect-ratio:3/3.6;
    object-fit:cover;
    filter:sepia(0.25) contrast(1.05);
  }

.cecilia-inset .cecilia-label{
    font-family:'Jost', sans-serif;
    font-size:10.5px;
    letter-spacing:0.05em;
    text-align:center;
    padding:8px 6px;
    color:var(--ink-soft);
    background:var(--paper-card);
    border-top:1px solid var(--line);
  }

/* ===== QUOTE / MARGINALIA ===== */
  .quote-section{
    padding:10px 0 90px;
  }

.quote-box p.quote-text{
    font-family:'Fraunces', serif;
    font-style:italic;
    font-size:clamp(22px,2.4vw,28px);
    line-height:1.5;
    color:var(--ink);
    max-width:62ch;
  }

/* ===== COMPOSERS ===== */
  .composers{ padding:20px 0 88px; }

@media (max-width:860px){
    .staff{ height:56px; overflow:hidden; }
    .staff svg{ width:auto; height:100%; position:relative; left:50%; transform:translateX(-50%); }
    .hero-grid{ grid-template-columns:1fr; gap:40px; }
    .hero-figure{ order:-1; aspect-ratio:16/10; }
    .pillars-grid{ grid-template-columns:1fr; }
    .pillar{ border-right:none; border-bottom:1px solid var(--line); padding:30px 0; }
    .pillar:first-child{ padding-top:34px; }
    .composers-grid{ grid-template-columns:1fr; }
    .scores-grid{ grid-template-columns:1fr; }
    .footer-grid{ grid-template-columns:1fr; gap:32px; }
    nav.links{
      display:none;
      position:absolute; top:100%; left:0; right:0;
      flex-direction:column;
      gap:0;
      background:var(--paper);
      border-bottom:1px solid var(--line);
      padding:6px 32px 18px;
    }
    nav.links.is-open{ display:flex; }
    nav.links a{ padding:13px 0; border-bottom:1px solid var(--line); }
    nav.links a:last-child{ border-bottom:none; }
    nav.links a::after{ display:none; }
    .nav-toggle{ display:flex; }
    .quote-box{ grid-template-columns:1fr; padding-left:20px; }
    .photo-band{ height:280px; }
    .composers-head-row{ grid-template-columns:1fr; }
    .cecilia-inset{ width:104px; }
  }

/* ===== PAGE HERO (simple) ===== */
.hero-lede-row{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:40px;
  padding:64px 0 46px;
}

.page-hero{
  flex:1;
}

.page-hero h1{
  font-size:clamp(38px,4.6vw,54px);
  line-height:1.06;
  margin-top:14px;
}

.page-hero .lede{
  margin-top:20px;
  font-size:19px;
  color:var(--ink-soft);
  max-width:60ch;
}

.jubileu-emblem-frame{
  width:128px;
  height:128px;
  border-radius:50%;
  background:#fff;
  border:1px solid var(--line);
  box-shadow:var(--shadow);
  padding:9px;
  flex-shrink:0;
  display:flex;
}

.jubileu-emblem{
  width:100%;
  height:100%;
  object-fit:cover;
  border-radius:50%;
}

/* ===== CREDITS ===== */
.credits{ padding:0px 0 10px 20px; }

.credits-list{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
}

.credit-item{
  padding:28px 30px 28px 0;
  border-right:1px solid var(--line);
}

.credit-item:last-child{ border-right:none; padding-right:0; }

.credit-item:not(:first-child){ padding-left:30px; }

.credit-item .credit-label{
  font-family:'Jost', sans-serif;
  font-size:11.5px;
  letter-spacing:0.08em;
  text-transform:uppercase;
  color:var(--wine);
  display:block;
  margin-bottom:8px;
}

.credit-item .credit-value{
  font-family:'Fraunces', serif;
  font-style:italic;
  font-size:19px;
}

.credit-item .credit-sub{
  font-size:14.5px;
  color:var(--ink-soft);
  margin-top:2px;
}

.cta-block{
  padding:44px 0 50px;
  text-align:center;
}

.cta-block .btn-primary{
  font-size:15px;
  padding:16px 32px;
}

/* ===== JUBILEU QUOTE ===== */
.jubileu-quote{
  border-left:2px solid var(--wine);
  padding:2px 0 2px 34px;
  margin:25px 0 30px;
}

.jubileu-quote p{
  font-family:'Fraunces', serif;
  font-style:italic;
  font-size:clamp(22px,2.4vw,28px);
  line-height:1.5;
  color:var(--ink);
}

/* ===== DONATE ===== */
.donate{ padding:20px 0 88px; }

.donate-box{
  display:grid;
  grid-template-columns:1.3fr 0.7fr;
  align-items:stretch;
  border:1px solid var(--line);
  border-radius:2px;
  box-shadow:var(--shadow);
  overflow:hidden;
}

.donate-photo{ position:relative; min-height:340px; }

.donate-photo img{
  width:100%; height:100%;
  object-fit:cover;
  display:block;
  filter:sepia(0.2) contrast(1.05);
}

.donate-photo::after{
  content:"";
  position:absolute; inset:0;
  background:linear-gradient(160deg, rgba(31,51,80,0.4), rgba(122,31,43,0.35));
  mix-blend-mode:multiply;
}

.donate-photo.qr-card{
  background:#FBF8F1;
  display:flex;
  align-items:center;
  justify-content:center;
  align-self:center;
  padding:24px;
  min-height:0;
}

.donate-photo.qr-card::after{ content:none; }

.donate-photo.qr-card img{
  width:auto; height:auto;
  max-width:260px;
  max-height:340px;
  object-fit:contain;
  filter:none;
  box-shadow:var(--shadow);
}

.donate-body{
  background:var(--navy);
  color:#F3ECDA;
  padding:56px 56px;
  display:flex;
  flex-direction:column;
  justify-content:center;
}

.donate-body .rubric{ color:var(--gold-soft); }

.donate-body .rubric::before{ background:var(--gold-soft); }

.donate-body h2{
  color:#F6F0DE;
  font-size:clamp(28px,3vw,36px);
  margin-top:14px;
  margin-bottom:16px;
}

.donate-body p{
  color:rgba(243,236,218,0.75);
  max-width:44ch;
  margin-bottom:28px;
}

.donate-body .btn-primary{
  align-self:flex-start;
  background:var(--gold);
  color:var(--ink);
}

.donate-body .btn-primary:hover{ background:var(--gold-soft); }

@media (max-width:820px){
  .credits-list{ grid-template-columns:1fr; }
  .credit-item{ border-right:none; border-bottom:1px solid var(--line); padding:22px 0; }
  .credit-item:first-child{ padding-top:0; }
  .donate-box{ grid-template-columns:1fr; }
  .donate-photo{ min-height:260px; }
  .donate-body{ padding:40px 28px; }
  .hero-lede-row{ flex-wrap:wrap; }
  .jubileu-emblem-frame{ width:96px; height:96px; padding:7px; }
}
