.sermon-notes-page {
  --notes-green: #163a25;
  color: var(--v-black);
  background: var(--v-white);
}

.sermon-notes-page .notes-hero {
  position: relative;
  min-height: max(760px, 94vh);
  overflow: hidden;
  padding: 175px 4vw 105px;
  color: var(--v-white);
  background: var(--notes-green);
}

.sermon-notes-page .notes-hero::before {
  position: absolute;
  content: "";
  inset: 0;
  opacity: .1;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  pointer-events: none;
}

.sermon-notes-page .notes-hero-kicker,
.sermon-notes-page .notes-hero-title { position: relative; z-index: 1; }
.sermon-notes-page .notes-hero-kicker {
  display: flex;
  justify-content: space-between;
  gap: 30px;
  padding-bottom: 22px;
  border-bottom: 1px solid rgba(245,244,239,.35);
  font-size: 9px;
  font-weight: 800;
  letter-spacing: .14em;
  text-transform: uppercase;
}
.sermon-notes-page .notes-hero-kicker p { margin: 0; }
.sermon-notes-page .notes-hero-kicker span { color: var(--v-lime); }

.sermon-notes-page .notes-hero-title {
  display: grid;
  grid-template-columns: minmax(0, 1.3fr) minmax(280px, .7fr);
  gap: 7vw;
  align-items: end;
  margin-top: clamp(90px, 11vw, 175px);
}
.sermon-notes-page .notes-hero h1,
.sermon-notes-page .notes-archive-intro h2 {
  margin: 0;
  font: 900 clamp(90px, 13.5vw, 220px)/.7 "Libre Franklin", sans-serif;
  letter-spacing: -.105em;
  text-transform: uppercase;
}
.sermon-notes-page .notes-hero h1 em,
.sermon-notes-page .notes-archive-intro h2 em,
.sermon-notes-page .notes-reflection h2 em {
  color: var(--v-lime);
  font-family: "Playfair Display", serif;
  font-weight: 600;
  text-transform: none;
}
.sermon-notes-page .notes-hero-title > p {
  max-width: 520px;
  margin: 0 0 10px;
  color: rgba(245,244,239,.75);
  font-size: clamp(17px, 1.4vw, 22px);
  line-height: 1.55;
}
.sermon-notes-page .notes-hero-marquee {
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  overflow: hidden;
  padding: 15px 0;
  color: var(--v-black);
  background: var(--v-lime);
  white-space: nowrap;
}
.sermon-notes-page .notes-hero-marquee span {
  display: block;
  width: max-content;
  font: 900 13px/1 "Libre Franklin", sans-serif;
  letter-spacing: .11em;
  text-transform: uppercase;
}

.sermon-notes-page .notes-message { background: var(--v-white); }
.sermon-notes-page .notes-message-header {
  display: grid;
  grid-template-columns: minmax(0, 1.3fr) minmax(320px, .7fr);
  gap: clamp(45px, 8vw, 150px);
  align-items: end;
  padding: clamp(100px, 10vw, 170px) 4vw clamp(80px, 8vw, 130px);
}
.sermon-notes-page .notes-message-header .section-index { margin-bottom: 45px; color: var(--notes-green); }
.sermon-notes-page .notes-message-header h2 {
  max-width: 1200px;
  margin: 0;
  font: 900 clamp(68px, 9vw, 148px)/.78 "Libre Franklin", sans-serif;
  letter-spacing: -.085em;
  text-transform: uppercase;
}
.sermon-notes-page .notes-message-details {
  display: grid;
  gap: 25px;
  padding: 30px 0 7px;
  border-top: 2px solid;
}
.sermon-notes-page .notes-message-details p { margin: 0; }
.sermon-notes-page .notes-message-details span { display: block; margin-bottom: 7px; font-size: 9px; font-weight: 800; letter-spacing: .13em; text-transform: uppercase; }
.sermon-notes-page .notes-message-details strong { font-size: clamp(18px, 1.45vw, 23px); line-height: 1.35; }

.sermon-notes-page .notes-thesis {
  padding: clamp(72px, 8vw, 125px) 4vw;
  color: var(--v-white);
  background: var(--v-black);
}
.sermon-notes-page .notes-thesis p {
  max-width: 1500px;
  margin: 0;
  font: 800 clamp(42px, 6.3vw, 102px)/.95 "Libre Franklin", sans-serif;
  letter-spacing: -.055em;
}

.sermon-notes-page .notes-points { margin: 0; padding: 0; list-style: none; }
.sermon-notes-page .notes-points li {
  display: grid;
  grid-template-columns: minmax(80px, .18fr) 1fr;
  gap: 4vw;
  padding: clamp(65px, 7vw, 115px) 4vw;
  border-bottom: 2px solid var(--v-black);
}
.sermon-notes-page .notes-points > li > span {
  color: var(--notes-green);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .12em;
}
.sermon-notes-page .notes-points li > div {
  display: grid;
  min-width: 0;
  grid-template-columns: minmax(0, 1.35fr) minmax(260px, .65fr);
  gap: 4vw;
  align-items: end;
}
.sermon-notes-page .notes-points p { grid-column: 1 / -1; margin: 0 0 32px; color: var(--notes-green); font-size: 9px; font-weight: 800; letter-spacing: .13em; text-transform: uppercase; }
.sermon-notes-page .notes-points h3 { min-width: 0; margin: 0; overflow-wrap: anywhere; font: 900 clamp(48px, 5.2vw, 84px)/.84 "Libre Franklin", sans-serif; letter-spacing: -.07em; text-transform: uppercase; }
.sermon-notes-page .notes-points strong { min-width: 0; max-width: 540px; font-size: clamp(18px, 1.6vw, 25px); line-height: 1.4; }

.sermon-notes-page .notes-reflection {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(320px, .9fr);
  gap: 8vw;
  align-items: end;
  padding: clamp(90px, 9vw, 150px) 4vw;
  color: var(--v-black);
  background: var(--v-lime);
}
.sermon-notes-page .notes-reflection .section-index { margin-bottom: 38px; }
.sermon-notes-page .notes-reflection h2 { margin: 0; font: 900 clamp(68px, 9vw, 145px)/.76 "Libre Franklin", sans-serif; letter-spacing: -.09em; text-transform: uppercase; }
.sermon-notes-page .notes-reflection h2 em { color: var(--notes-green); }
.sermon-notes-page .notes-reflection > div:last-child { padding-bottom: 7px; }
.sermon-notes-page .notes-reflection > div:last-child > p { margin: 0; padding: 22px 0; border-bottom: 1px solid rgba(9,9,9,.45); font-size: clamp(18px, 1.6vw, 25px); font-weight: 700; line-height: 1.4; }
.sermon-notes-page .notes-reflection .vous-pill { margin-top: 38px; color: var(--v-white); background: var(--v-black); }

.sermon-notes-page .notes-archive-intro {
  display: grid;
  grid-template-columns: .25fr 1fr;
  gap: 5vw;
  padding: clamp(100px, 10vw, 170px) 4vw;
  color: var(--v-white);
  background: var(--notes-green);
}
.sermon-notes-page .notes-archive-intro h2 { font-size: clamp(72px, 10vw, 160px); }
.sermon-notes-page .notes-archive-intro > div > p { max-width: 650px; margin: 45px 0 0; color: rgba(245,244,239,.72); font-size: clamp(17px, 1.45vw, 22px); line-height: 1.55; }

.sermon-notes-page .notes-single-title {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: minmax(0, 1.3fr) minmax(280px, .7fr);
  gap: 7vw;
  align-items: end;
  margin-top: clamp(80px, 9vw, 145px);
}
.sermon-notes-page .notes-single-title > p { grid-column: 1 / -1; margin: 0 0 -25px; color: var(--v-lime); font-size: 9px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; }
.sermon-notes-page .notes-single-title h1 { font-size: clamp(62px, 8.7vw, 142px); line-height: .78; overflow-wrap: anywhere; }
.sermon-notes-page .notes-single-title > div { display: grid; gap: 8px; padding-bottom: 8px; }
.sermon-notes-page .notes-single-title > div span { margin-top: 18px; color: var(--v-lime); font-size: 9px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.sermon-notes-page .notes-single-title > div strong { font-size: clamp(18px, 1.45vw, 23px); line-height: 1.35; }
.sermon-notes-page .notes-single-points li > div { grid-template-columns: 1fr; }

.sermon-notes-page .notes-body {
  display: grid;
  grid-template-columns: minmax(120px, .28fr) minmax(0, 1fr);
  gap: 6vw;
  padding: clamp(90px, 9vw, 145px) 4vw;
  color: var(--v-black);
  background: var(--v-white);
}
.sermon-notes-page .notes-body-content { max-width: 900px; font-size: clamp(17px, 1.35vw, 21px); line-height: 1.7; }
.sermon-notes-page .notes-body-content > *:first-child { margin-top: 0; }
.sermon-notes-page .notes-body-content h2 { margin: 0 0 40px; font: 900 clamp(50px, 6.2vw, 96px)/.82 "Libre Franklin", sans-serif; letter-spacing: -.075em; text-transform: uppercase; }
.sermon-notes-page .notes-body-content h3 { margin: 55px 0 16px; font: 800 clamp(27px, 3vw, 45px)/1 "Libre Franklin", sans-serif; letter-spacing: -.045em; }
.sermon-notes-page .notes-body-content p { margin: 0 0 22px; }
.sermon-notes-page .notes-body-download { margin-top: 28px; color: var(--v-white); background: var(--v-black); }

.sermon-notes-page .notes-actions {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(300px, .9fr);
  gap: 7vw;
  align-items: end;
  padding: clamp(85px, 9vw, 145px) 4vw;
  color: var(--v-black);
  background: var(--v-lime);
}
.sermon-notes-page .notes-actions h2 { margin: 38px 0 0; font: 900 clamp(62px, 8.5vw, 136px)/.77 "Libre Franklin", sans-serif; letter-spacing: -.085em; text-transform: uppercase; }
.sermon-notes-page .notes-actions h2 em { color: var(--notes-green); font-family: "Playfair Display", serif; font-weight: 600; text-transform: none; }
.sermon-notes-page .notes-action-links { display: flex; flex-wrap: wrap; gap: 26px; align-items: center; padding-bottom: 8px; }
.sermon-notes-page .notes-action-links .vous-pill { color: var(--v-white); background: var(--v-black); }
.sermon-notes-page .notes-action-links .vous-arrow-link { margin-top: 0; }

.sermon-notes-page .notes-archive-list { padding: clamp(95px, 9vw, 150px) 4vw; }
.sermon-notes-page .notes-archive-list > header { display: grid; grid-template-columns: .28fr 1fr; gap: 5vw; align-items: end; margin-bottom: clamp(58px, 7vw, 105px); }
.sermon-notes-page .notes-archive-list > header h2 { margin: 0; font: 900 clamp(72px, 10vw, 160px)/.72 "Libre Franklin", sans-serif; letter-spacing: -.095em; text-transform: uppercase; }
.sermon-notes-page .notes-archive-list > header h2 em { color: var(--notes-green); font-family: "Playfair Display", serif; font-weight: 600; text-transform: none; }
.sermon-notes-page .notes-archive-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.sermon-notes-page .notes-archive-card {
  position: relative;
  display: flex;
  min-height: 440px;
  flex-direction: column;
  padding: clamp(32px, 4vw, 58px);
  color: var(--v-white);
  background: var(--notes-green);
  border: 2px solid var(--v-black);
  text-decoration: none;
  transition: color 220ms ease, background 220ms ease;
}
.sermon-notes-page .notes-archive-card:nth-child(4n + 2),
.sermon-notes-page .notes-archive-card:nth-child(4n + 3) { color: var(--v-black); background: var(--v-lime); }
.sermon-notes-page .notes-archive-card > p { display: flex; justify-content: space-between; gap: 24px; margin: 0; font-size: 9px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.sermon-notes-page .notes-archive-card h3 { max-width: 760px; margin: auto 0 25px; font: 900 clamp(42px, 4.6vw, 76px)/.82 "Libre Franklin", sans-serif; letter-spacing: -.07em; text-transform: uppercase; }
.sermon-notes-page .notes-archive-card > strong { max-width: 520px; font-size: 13px; line-height: 1.4; }
.sermon-notes-page .notes-archive-card > b { position: absolute; right: 30px; bottom: 28px; font-size: 28px; transition: transform 220ms ease; }
.sermon-notes-page .notes-archive-card:hover > b { transform: translate(4px, -4px); }
.sermon-notes-page .notes-archive-card:focus-visible > b { transform: translate(4px, -4px); }
.sermon-notes-page .notes-pagination { margin-top: 45px; }
.sermon-notes-page .notes-pagination .nav-links { display: flex; gap: 9px; }
.sermon-notes-page .notes-pagination a,
.sermon-notes-page .notes-pagination .current { display: grid; width: 44px; height: 44px; place-items: center; border: 1px solid; text-decoration: none; }
.sermon-notes-page .notes-pagination .current { color: var(--v-black); background: var(--v-lime); }

@media (max-width: 900px) {
  .sermon-notes-page .notes-hero-title,
  .sermon-notes-page .notes-message-header,
  .sermon-notes-page .notes-reflection { grid-template-columns: 1fr; }
  .sermon-notes-page .notes-hero-title > p { margin-top: 45px; }
  .sermon-notes-page .notes-message-details { max-width: 620px; }
  .sermon-notes-page .notes-points li > div { grid-template-columns: 1fr; }
  .sermon-notes-page .notes-single-title,
  .sermon-notes-page .notes-actions { grid-template-columns: 1fr; }
  .sermon-notes-page .notes-body { grid-template-columns: 1fr; }
}

@media (max-width: 720px) {
  .sermon-notes-page .notes-hero { min-height: 720px; padding: 145px 18px 90px; }
  .sermon-notes-page .notes-hero-title { margin-top: 105px; }
  .sermon-notes-page .notes-hero h1 { font-size: clamp(74px, 23vw, 104px); }
  .sermon-notes-page .notes-hero-kicker span { text-align: right; }
  .sermon-notes-page .notes-message-header { padding: 88px 18px 72px; }
  .sermon-notes-page .notes-message-header h2 { font-size: clamp(54px, 16vw, 72px); }
  .sermon-notes-page .notes-thesis { padding: 72px 18px; }
  .sermon-notes-page .notes-thesis p { font-size: 38px; }
  .sermon-notes-page .notes-points li { grid-template-columns: 42px 1fr; gap: 12px; padding: 62px 18px; }
  .sermon-notes-page .notes-points p { margin-bottom: 18px; }
  .sermon-notes-page .notes-points h3 { font-size: clamp(34px, 9vw, 48px); }
  .sermon-notes-page .notes-reflection { padding: 82px 18px; }
  .sermon-notes-page .notes-reflection h2 { font-size: 63px; }
  .sermon-notes-page .notes-archive-intro { grid-template-columns: 1fr; padding: 86px 18px; }
  .sermon-notes-page .notes-archive-intro .section-index { margin-bottom: 35px; }
  .sermon-notes-page .notes-archive-intro h2 { font-size: 71px; }
  .sermon-notes-page .notes-single-title { margin-top: 82px; }
  .sermon-notes-page .notes-single-title > p { margin-bottom: -10px; }
  .sermon-notes-page .notes-single-title h1 { font-size: clamp(49px, 14vw, 65px); }
  .sermon-notes-page .notes-body { padding: 78px 18px; }
  .sermon-notes-page .notes-body-content h2 { font-size: 48px; }
  .sermon-notes-page .notes-actions { padding: 78px 18px; }
  .sermon-notes-page .notes-actions h2 { font-size: 58px; }
  .sermon-notes-page .notes-archive-list { padding: 82px 18px; }
  .sermon-notes-page .notes-archive-list > header { grid-template-columns: 1fr; }
  .sermon-notes-page .notes-archive-list > header h2 { font-size: 70px; }
  .sermon-notes-page .notes-archive-grid { grid-template-columns: 1fr; }
  .sermon-notes-page .notes-archive-card { min-height: 380px; }
}
