/* David Lynn — pastoral design pass, 2026-09-17.
   Presentation only. See the local design-pass change log for scoped recovery.
   Each Dxx block is independently removable; D00 is the HTML stylesheet link. */

/* BEGIN D01 — Neutral ivory, charcoal and measured spacing */
:root {
  --ivory: #f4f3ed;
  --paper: #e8e9e1;
  --ink: #222923;
  --muted: #535950;
  --bronze: #5c6351;
  --line: #cdd0c5;
  --dark: #252d28;
}
body { color: var(--ink); }
.outer { width: calc(100% - 64px); max-width: 1440px; }
.content { width: calc(100% - 144px); max-width: 1256px; }
.section-space { padding-block: 100px; }
.eyebrow { letter-spacing: .12em; font-weight: 600; }
.button { border-radius: 2px; font-weight: 600; min-height: 54px; }
.button:hover { background: #394238; transform: none; }
.button.light:hover { background: #e2e5db; color: var(--ink); }
.button.outline:hover { background: var(--paper); color: var(--ink); }
.text-link { font-weight: 600; text-underline-offset: 5px; }
:focus-visible { outline: 2px solid #62794b; outline-offset: 5px; }
@media (max-width: 900px) {
  .outer { width: calc(100% - 40px); }
  .content { width: calc(100% - 64px); }
  .section-space { padding-block: 76px; }
}
@media (max-width: 620px) {
  .outer { width: calc(100% - 24px); }
  .content { width: calc(100% - 48px); }
  .section-space { padding-block: 58px; }
}
/* END D01 */

/* BEGIN D02 — Upright typography and a clear navigation hierarchy */
h1, h2, h3 { font-family: var(--sans); font-weight: 500; letter-spacing: -.055em; }
h2 { font-size: clamp(38px, 3.65vw, 56px); line-height: 1.09; }
h2 em { font-style: normal; color: inherit; }
.site-header { width: calc(100% - 80px); max-width: 1424px; height: 104px; gap: 24px; }
.wordmark { font-size: 19px; letter-spacing: .14em; font-weight: 600; }
.site-header .descriptor { font-size: 10px; color: var(--muted); }
.desktop-nav { gap: 28px; font-size: 13px; }
.desktop-nav a { padding-block: 12px; }
.desktop-nav a.active { font-weight: 600; }
.mobile-nav { top: 100%; }
.header-book { min-height: 48px; font-size: 12px; padding-inline: 18px; gap: 23px; }
.header-book .header-book-arrow { font-size: 22px; }
@media (max-width: 1150px) {
  .site-header { width: calc(100% - 56px); }
  .desktop-nav { gap: 18px; }
  .site-header .brand { gap: 12px; }
  .site-header .wordmark { font-size: 16px; }
  .site-header .descriptor { font-size: 9px; }
}
@media (max-width: 620px) {
  .site-header { width: calc(100% - 32px); min-height: 88px; height: auto; gap: 8px; padding-block: 14px; }
  .site-header .wordmark { font-size: 13px; letter-spacing: .11em; }
  .site-header .brand { gap: 8px; }
  .site-header .descriptor { font-size: 10px; line-height: 1.4; max-width: 125px; }
  .site-header .header-book { min-height: 44px; padding-inline: 10px; font-size: 11px; }
  .site-header .djl-monogram { width: 34px; }
  .mobile-nav { background: var(--ivory); border-color: var(--line); }
  .mobile-nav a { padding-block: 13px; font-weight: 500; }
}
@media (max-width: 380px) {
  .site-header { min-height: 76px; }
  .site-header .wordmark { font-size: 12px; }
}
/* END D02 */

/* BEGIN D03 — Authoritative, compact hero without content loss */
.hero { grid-template-columns: 53% 47%; min-height: 690px; border-radius: 7px; background: #e7e8e0; }
.hero-copy { padding: 48px 48px 38px; }
.hero-copy .eyebrow { color: var(--ink); font-size: 11px; letter-spacing: .12em; margin-bottom: 28px; max-width: 400px; }
.hero h1 { font-size: clamp(56px, 5.35vw, 80px); font-weight: 500; line-height: 1.005; letter-spacing: -.063em; margin-bottom: 26px; }
.hero h1 em { font-family: inherit; font-weight: 500; font-style: normal; color: var(--ink); }
.hero-lead { max-width: 465px; font-size: 16px; line-height: 1.65; color: var(--ink); }
.hero-note { max-width: 465px; font-size: 14px; line-height: 1.8; margin-top: 16px; color: #4e554d; }
.hero-action { margin-top: 26px; }
.hero-action .button { min-height: 54px; font-size: 13px; gap: 32px; }
.hero-secondary { margin-top: 12px; min-height: 38px; font-size: 13px; font-weight: 500; }
.member-link { font-size: 11px; line-height: 1.8; margin-top: 10px; max-width: 450px; color: #4e554d; }
.hero-photo > img { object-position: 50% 42%; }
.hero-caption { display: block; top: 27px; right: 28px; font-size: 11px; font-weight: 600; color: var(--ink); }
.hero-caption span { font-size: 11px; color: #535950; font-weight: 400; }
.floating-note { left: auto; right: 24px; bottom: 24px; width: 282px; padding: 23px 24px 18px; border-radius: 2px; background: var(--dark); color: var(--ivory); border: 1px solid #667064; }
.floating-note .eyebrow { color: #cdd3c7; font-size: 10px; letter-spacing: .13em; }
.floating-title { font-family: var(--sans); font-size: 16px; line-height: 1.55; letter-spacing: -.02em; margin-top: 14px; }
.floating-bottom { border-color: #596156; font-size: 12px; margin-top: 16px; padding-top: 13px; }
@media (max-width: 1150px) and (min-width: 901px) {
  .hero { grid-template-columns: 53% 47%; }
  .hero-copy { padding: 40px 32px 34px; }
  .hero h1 { font-size: 61px; }
  .floating-note { width: 250px; right: 18px; bottom: 18px; }
}
@media (max-width: 900px) and (min-width: 621px) {
  .hero { grid-template-columns: 55% 45%; min-height: 710px; }
  .hero-copy { padding: 32px 27px; }
  .hero h1 { font-size: 49px; }
  .hero-copy .eyebrow { font-size: 10px; margin-bottom: 24px; }
  .hero-lead { font-size: 15px; }
  .hero-note { font-size: 13px; }
  .hero-action .button { gap: 14px; padding-inline: 15px; font-size: 12px; }
  .hero-caption { top: 22px; right: 18px; font-size: 9px; }
  .hero-caption span { font-size: 9px; }
  .floating-note { width: 225px; right: 16px; bottom: 16px; padding: 20px; }
  .floating-title { font-size: 15px; }
}
@media (max-width: 620px) {
  .hero { display: flex; flex-direction: column; min-height: 0; border-radius: 5px; }
  .hero-copy { padding: 31px 24px 28px; }
  .hero-copy .eyebrow { font-size: 10px; max-width: 260px; margin-bottom: 24px; line-height: 1.65; }
  .hero h1 { font-size: clamp(43px, 11.3vw, 69px); line-height: 1.04; letter-spacing: -.06em; margin-bottom: 22px; }
  .hero-lead { font-size: 15px; line-height: 1.7; }
  .hero-note { font-size: 14px; line-height: 1.75; margin-top: 14px; }
  .hero-action { margin-top: 23px; }
  .hero-action .button { width: 100%; font-size: 13px; padding-inline: 17px; gap: 10px; justify-content: space-between; }
  .hero-secondary { font-size: 12px; min-height: 44px; margin-top: 8px; }
  .member-link { font-size: 11px; margin-top: 6px; max-width: 300px; }
  .hero-photo { height: 400px; min-height: 400px; }
  .hero-photo > img { object-position: 50% 39%; }
  .hero-caption { top: 20px; right: 19px; font-size: 9px; }
  .hero-caption span { font-size: 9px; }
  .floating-note { position: relative; inset: auto; width: auto; margin: 0; padding: 23px 24px 18px; border-radius: 0; border: 0; }
  .floating-title { font-size: 16px; margin-top: 10px; }
  .floating-bottom { margin-top: 15px; }
}
@media (max-width: 360px) {
  .hero-copy { padding-inline: 20px; }
  .hero h1 { font-size: 39px; }
  .hero-photo { height: 340px; min-height: 340px; }
}
/* END D03 */

/* BEGIN D04 — Visible pastoral credentials, without statistics cards */
.credentials { padding-block: 42px 45px; margin-bottom: 38px; border-bottom: 1px solid var(--line); }
.credentials > div { padding-left: 28px; }
.credentials strong { font-family: var(--sans); font-size: 30px; font-weight: 500; letter-spacing: -.045em; line-height: 1.3; }
.credentials strong span { font-size: 24px; }
.credentials p { font-size: 12px; margin-top: 8px; color: var(--muted); }
@media (max-width: 900px) {
  .credentials { gap: 25px; grid-template-columns: 1fr 1fr; margin-bottom: 24px; }
  .credentials > div { padding: 0; border: 0; }
}
@media (max-width: 620px) {
  .credentials { padding-block: 30px; gap: 27px 20px; margin-bottom: 20px; }
  .credentials strong { font-size: 23px; }
  .credentials strong span { font-size: 18px; }
  .credentials p { font-size: 11px; line-height: 1.6; margin-top: 5px; }
}
/* END D04 */

/* BEGIN D05 — Biblical approach as a calm, ordered teaching section */
.approach { background: var(--dark); padding: 64px 56px 31px; }
.approach-intro { grid-template-columns: 1.1fr 1fr; gap: 64px; }
.approach .eyebrow { color: #cbd1c4; margin-bottom: 27px; font-size: 11px; }
.approach h2 { font-size: clamp(37px, 3.75vw, 57px); line-height: 1.1; letter-spacing: -.055em; max-width: 600px; }
.approach-narrative { padding-top: 0; }
.approach-narrative p { font-size: 15px; line-height: 1.8; color: #e0e4db; }
.approach-narrative p + p { color: #c8cec2; margin-top: 16px; }
.principle-grid { margin-top: 48px; gap: 24px; }
.principle { padding: 22px 0 14px; margin: 0; border-color: #626c5f; }
.principle-number { font: 500 12px/1.5 var(--sans); color: #bbc7b1; letter-spacing: .1em; margin-bottom: 31px; }
.principle h3 { font-size: 24px; letter-spacing: -.04em; margin-bottom: 14px; }
.principle p { font-size: 14px; line-height: 1.8; max-width: 250px; color: #cbd1c5; }
.approach-foot { margin-top: 25px; border-color: #596252; padding-top: 22px; }
.approach-foot > span { color: #c4cbbb; font-size: 10px; }
@media (max-width: 900px) {
  .approach { padding: 46px 32px 28px; }
  .approach-intro { grid-template-columns: 1fr; gap: 30px; }
  .approach h2 { font-size: 44px; }
  .approach-narrative { gap: 27px; }
  .principle-grid { grid-template-columns: 1fr 1fr; gap: 27px; margin-top: 37px; }
}
@media (max-width: 620px) {
  .approach { padding: 38px 24px 25px; }
  .approach h2 { font-size: 35px; line-height: 1.12; }
  .approach .eyebrow { font-size: 10px; margin-bottom: 23px; }
  .approach-narrative { display: block; }
  .approach-narrative p { font-size: 15px; }
  .principle-grid { grid-template-columns: 1fr; gap: 0; margin-top: 31px; }
  .principle { grid-template-columns: 28px minmax(0, 1fr); gap: 9px 16px; padding-block: 23px; }
  .principle-number { font-size: 12px; margin-top: 6px; }
  .principle h3 { font-size: 24px; margin: 0; }
  .principle p { max-width: none; font-size: 14px; }
  .approach-foot { margin-top: 10px; gap: 15px; }
}
/* END D05 */

/* BEGIN D06 — Counseling, expectations and reflection in a consistent grid */
.marriage-heading, .turning-point { grid-template-columns: 24% minmax(0, 1fr); gap: 48px; }
.marriage-heading { margin-bottom: 42px; }
.marriage-heading h2, .turning-point h2 { font-size: clamp(37px, 3.55vw, 54px); line-height: 1.12; letter-spacing: -.052em; }
.marriage-heading .eyebrow, .section-label .eyebrow { color: var(--ink); font-size: 11px; }
.marriage-grid { grid-template-columns: 1.08fr .92fr; gap: 76px; }
.marriage-copy p { font-size: 15px; line-height: 1.85; }
.marriage-copy .section-lead { font: 500 24px/1.5 var(--serif); color: var(--ink); }
.marriage-topics { padding-left: 32px; }
.marriage-topics li { font-size: 15px; padding-block: 12px; }
.marriage-topics > p:last-child { font-size: 13px; line-height: 1.8; }
.expect-section { background: #e5e7de; padding: 61px 56px; gap: 76px; }
.expect-main h2 { font-size: clamp(39px, 3.7vw, 55px); line-height: 1.12; }
.expect-main > p:not(.eyebrow) { font-size: 15px; }
.expect-aside { border-color: #bbc2b4; padding-left: 42px; }
.editorial-statement { font: 500 34px/1.22 var(--serif); color: var(--ink); }
.editorial-statement span { color: #525d49; }
.communication-note { border-color: #bbc2b4; }
.communication-note ol { line-height: 1.8; }
.turning-copy { gap: 32px; }
.turning-copy p { font-size: 15px; }
.turning-resolution { font-size: 28px; line-height: 1.4; }
@media (max-width: 900px) {
  .marriage-heading, .turning-point { grid-template-columns: 1fr; gap: 23px; }
  .marriage-grid { grid-template-columns: 1fr; gap: 33px; }
  .marriage-heading h2, .turning-point h2 { font-size: 42px; }
  .marriage-topics { padding: 27px 0 0; }
  .expect-section { padding: 43px 32px; gap: 36px; }
  .expect-main h2 { font-size: 40px; }
  .expect-aside { padding-left: 28px; }
  .editorial-statement { font-size: 30px; }
}
@media (max-width: 620px) {
  .marriage-heading { margin-bottom: 26px; }
  .marriage-heading h2, .turning-point h2 { font-size: 34px; line-height: 1.15; }
  .marriage-copy .section-lead { font-size: 25px; line-height: 1.38; }
  .marriage-copy p { font-size: 15px; }
  .marriage-actions .button { font-size: 13px; }
  .marriage-topics li { font-size: 14px; }
  .expect-section { padding: 37px 24px; gap: 32px; }
  .expect-main h2 { font-size: 35px; }
  .expect-aside { padding: 28px 0 0; }
  .communication-note ol { font-size: 14px; }
  .turning-copy { margin-top: 23px; gap: 16px; }
  .turning-resolution { font-size: 27px; }
}
/* END D06 */

/* BEGIN D07 — Pastor and teacher: portrait paired with legible credentials */
.about { gap: 72px; align-items: start; }
.about-copy { padding-top: 13px; }
.about-copy > .eyebrow { color: var(--ink); font-size: 11px; margin-bottom: 24px; }
.about h2 { font-size: clamp(36px, 3.1vw, 47px); line-height: 1.14; letter-spacing: -.05em; }
.about-lead { font-size: 18px; line-height: 1.6; font-weight: 500; margin-top: 23px; }
.about-copy > p:not(.about-lead, .eyebrow) { font-size: 15px; line-height: 1.8; }
.image-wrap { height: auto; aspect-ratio: 4 / 5; border-radius: 3px; }
.image-wrap img { height: 100%; object-position: 50% 44%; filter: none; }
.image-wrap:hover img { transform: none; }
.image-credit { align-items: baseline; gap: 12px; }
.image-credit span:first-child { font-size: 10px; color: var(--muted); }
.image-credit span:last-child { font-size: 25px; font-style: normal; }
.bio-details { margin-top: 25px; }
.bio-details summary { font-size: 13px; min-height: 38px; }
.bio-details p { font-size: 14px; line-height: 1.8; }
@media (max-width: 900px) {
  .about { gap: 34px; }
  .about h2 { font-size: 35px; }
  .image-wrap { aspect-ratio: 3 / 4; }
}
@media (max-width: 620px) {
  .about { gap: 32px; }
  .about-copy { padding-top: 0; }
  .about h2 { font-size: 35px; }
  .about-lead { font-size: 17px; }
  .image-wrap { height: 400px; aspect-ratio: auto; }
  .image-credit span:first-child { font-size: 9px; }
  .image-credit span:last-child { font-size: 23px; }
}
/* END D07 */

/* BEGIN D08 — Book as the deliberate editorial serif accent */
.book-section { background: var(--dark); border-radius: 3px; }
.book-art { background: #343e35; padding: 40px; min-height: 725px; }
.book-art-label, .book-art-foot { color: #d0d6c9; }
.book-art-label .eyebrow, .book-art-label > span:last-child { font-size: 10px; }
.book-cover { max-width: 315px; width: 66%; }
.book-copy { padding: 52px 48px; }
.book-copy > .eyebrow { color: #cdd4c3; font-size: 10px; }
.book-copy h2 { font: 500 clamp(54px, 4.7vw, 71px)/1.01 var(--serif); letter-spacing: -.035em; }
.book-copy h2 em { color: #c9d0bd; font-style: normal; }
.book-copy h3 { font-family: var(--sans); font-size: 20px; line-height: 1.35; letter-spacing: -.035em; }
.book-copy > p:not(.eyebrow) { color: #d0d5ca; font-size: 15px; line-height: 1.8; }
.book-copy .book-since { color: #c9d0c0 !important; }
.book-lessons { border-color: #596452; }
.book-lessons > p, .book-lessons ul { font-size: 13px; color: #d0d5ca; }
.book-action { gap: 24px; }
.book-action .button { font-size: 13px; }
.book-secondary { color: #d0d5ca; font-size: 13px; }
@media (max-width: 900px) {
  .book-art { padding: 28px; min-height: 100%; }
  .book-copy { padding: 38px 28px; }
  .book-copy h2 { font-size: 56px; }
  .book-action { gap: 12px; }
  .book-action .button { font-size: 12px; padding-inline: 16px; gap: 14px; }
}
@media (max-width: 620px) {
  .book-art { min-height: 510px; padding: 28px 24px; }
  .book-cover { width: 66%; max-width: 255px; margin-block: 30px; }
  .book-copy { padding: 35px 24px 38px; }
  .book-copy h2 { font-size: 53px; }
  .book-copy h3 { font-size: 21px; }
  .book-action { flex-wrap: wrap; flex-direction: row; align-items: center; gap: 17px; }
  .book-action .button { font-size: 13px; }
}
/* END D08 */

/* BEGIN D09 — Consistent resource and community section hierarchy */
.care-statement { grid-template-columns: 24% minmax(0, 1fr); gap: 48px; }
.care-statement h2 { font-size: clamp(35px, 3.35vw, 51px); line-height: 1.13; }
.care-statement > .eyebrow { color: var(--ink); font-size: 11px; }
.care-statement div > p { font-size: 15px; line-height: 1.85; max-width: 720px; }
.care-values { font-size: 12px; gap: 25px; font-weight: 600; }
.resources { padding-bottom: 80px; }
.resources .section-top { align-items: flex-end; margin-bottom: 36px; }
.resources .section-top h2 { font-size: clamp(38px, 3.6vw, 55px); line-height: 1.12; }
.resources .section-top .eyebrow { color: var(--ink); font-size: 11px; }
.journal-grid { gap: 30px; }
.journal-image { aspect-ratio: 1.5; border-radius: 2px; }
.journal-card:hover .journal-image img { transform: none; }
.journal-meta { color: var(--muted); margin-top: 21px; font-size: 10px; letter-spacing: .08em; }
.journal-card h3 { font-size: 24px; line-height: 1.24; letter-spacing: -.04em; margin-top: 13px; }
.journal-card > p { font-size: 14px; line-height: 1.75; }
.journal-link { font-size: 12px; font-weight: 600; border-color: var(--line); }
.member-banner { grid-template-columns: .8fr 1.5fr 1fr; gap: 35px; padding-block: 36px; margin-bottom: 80px; border-color: var(--line); }
.member-banner > div { grid-row: auto; grid-column: auto; min-width: 0; }
.member-banner .eyebrow { color: var(--ink); font-size: 10px; }
.member-banner h2 { font-size: 31px; line-height: 1.15; }
.member-banner > div > p:not(.eyebrow) { font-size: 14px; line-height: 1.85; }
.member-banner > .text-link { font-size: 12px; gap: 15px; }
@media (max-width: 900px) {
  .care-statement { grid-template-columns: 1fr; gap: 25px; }
  .care-statement h2 { font-size: 39px; }
  .journal-grid { gap: 22px; }
  .journal-card h3 { font-size: 21px; }
  .member-banner { grid-template-columns: 1fr 1.5fr; gap: 25px; }
  .member-banner > .text-link { grid-column: 2; }
}
@media (max-width: 620px) {
  .care-statement h2 { font-size: 33px; }
  .care-values { gap: 12px; font-size: 12px; }
  .resources { padding-bottom: 52px; }
  .resources .section-top h2 { font-size: 35px; }
  .resources .section-top .text-link { margin-top: 18px; }
  .journal-grid { gap: 36px; }
  .journal-card h3 { font-size: 25px; }
  .journal-card > p { font-size: 15px; }
  .member-banner { display: grid; grid-template-columns: 1fr; gap: 23px; padding-block: 30px; margin-bottom: 54px; }
  .member-banner > .text-link { grid-column: auto; margin-top: 0; font-size: 13px; }
  .member-banner h2 { font-size: 31px; }
}
/* END D09 */

/* BEGIN D10 — Clear closing invitation and restrained footer */
.closing { background: var(--dark); text-align: left; padding: 67px 56px; border-radius: 3px; }
.closing > .eyebrow { margin: 0 0 24px; color: #cdd4c3; font-size: 11px; }
.closing h2 { font-size: clamp(42px, 4.3vw, 65px); line-height: 1.08; letter-spacing: -.055em; max-width: 1000px; margin: 0; }
.closing > p:not(.eyebrow) { max-width: 690px; margin: 26px 0 0; color: #d4d9ce; font-size: 16px; }
.closing > div { justify-content: flex-start; gap: 30px; margin-top: 30px; }
.closing .text-link { color: #d4d9ce; font-size: 13px; max-width: 365px; }
.footer { padding-top: 54px; }
.footer-main { padding-bottom: 32px; }
.footer-links, .footer-social { font-size: 13px; }
.footer-disclaimer { max-width: 1010px; color: #5a6056; font-size: 12px; line-height: 1.9; }
.footer-bottom { font-size: 11px; color: var(--muted); }
@media (max-width: 900px) {
  .closing { padding: 51px 32px; }
  .closing h2 { font-size: 49px; }
}
@media (max-width: 620px) {
  .closing { padding: 39px 24px; }
  .closing > .eyebrow { margin: 0 0 22px; }
  .closing h2 { font-size: 38px; line-height: 1.13; }
  .closing > p:not(.eyebrow) { font-size: 15px; margin-top: 23px; max-width: none; }
  .closing > div { gap: 20px; }
  .closing .button { font-size: 13px; }
  .closing .text-link { font-size: 12px; max-width: none; }
  .footer { padding-top: 40px; }
  .footer-main { padding-bottom: 22px; }
}
/* END D10 */

/* BEGIN D11 — Existing dialogs, articles and booking steps in the same system */
dialog { border-radius: 4px; background: var(--ivory); color: var(--ink); }
.dialog-title { font-family: var(--sans); font-size: 39px; line-height: 1.14; letter-spacing: -.05em; font-weight: 500; }
.dialog-eyebrow { color: var(--bronze); }
.dialog-close { color: var(--ink); border-radius: 2px; background: var(--paper); }
.integration-summary strong { font-family: var(--sans); font-size: 26px; letter-spacing: -.045em; }
.booking-step-number { font-family: var(--sans); font-size: 17px; line-height: 1.5; font-weight: 600; }
.booking-steps h3, .integration-body h3 { font: 500 24px/1.25 var(--sans); letter-spacing: -.04em; }
.booking-review h3 { font: 500 21px/1.3 var(--sans); letter-spacing: -.035em; }
.booking-existing, .booking-review { border-left-color: var(--bronze); }
.article-heading .dialog-title { font-size: 44px; }
.article-body h3 { font-family: var(--sans); font-size: 26px; line-height: 1.3; letter-spacing: -.035em; }
.article-body p, .article-body li { color: var(--muted); }
.checkout-preview h3 { font-size: 24px; line-height: 1.2; }
.counseling-dialog .dialog-description { font-family: var(--serif); }
@media (max-width: 620px) {
  dialog { border-radius: 4px; padding-inline: 23px; }
  .dialog-title { font-size: 31px; }
  .article-heading .dialog-title { font-size: 32px; }
  .article-body h3 { font-size: 24px; }
  .integration-summary strong { font-size: 25px; }
  .booking-steps h3, .integration-body h3 { font-size: 23px; }
  .booking-review h3 { font-size: 20px; }
  .checkout-preview h3 { font-size: 22px; }
}
/* END D11 */
