/* Three identical, compact white article cards. */
/* Upcoming learning opportunities and support, using the existing paper/navy palette. */
.upcoming-section { background: var(--navy); color: var(--paper); padding-block: 65px; }
.upcoming-layout { display: grid; grid-template-columns: .8fr 1.2fr; gap: 65px; align-items: center; }
.upcoming-heading .chapter-label { color: var(--gold-light); }
.upcoming-heading > p:last-child { font-size: 17px; line-height: 1.9; }
.upcoming-notice { position: relative; background: var(--paper); color: var(--navy); padding: 32px 36px; border-top: 3px solid var(--gold-light); }
.upcoming-status { display: flex; align-items: center; gap: 10px; font-size: 14px; color: var(--slate); }
.upcoming-status > span { width: 7px; height: 7px; border-radius: 50%; background: var(--gold-dark); flex-shrink: 0; }
.upcoming-notice h3 { font-size: clamp(23px, 2.3vw, 29px); line-height: 1.8; margin: 16px 0; }
.upcoming-notice > p:last-of-type { font-size: 16px; line-height: 1.9; }
.upcoming-notice .editorial-link { margin-top: 18px; padding-block: 12px; }
.support-section { background: var(--paper); }
.support-heading { text-align: center; margin-bottom: 52px; }
.support-heading h2 { font-size: clamp(26px, 3vw, 38px); }
.support-heading > p:last-child { font-size: 17px; line-height: 1.9; }
.support-layout { display: grid; grid-template-columns: 1fr 1fr; gap: 70px; align-items: start; }
.support-picture { position: sticky; top: 35px; padding: 0 18px 18px 0; }
.support-picture::before { content: ''; position: absolute; inset: 18px 0 0 18px; border: 1px solid var(--gold); pointer-events: none; }
.support-picture img { position: relative; width: 100%; height: auto; aspect-ratio: 4/3; object-fit: cover; }
.support-picture figcaption { position: relative; padding: 21px 20px 9px; font-size: 15px; }
.support-picture figcaption > span { display: block; color: #71603d; font: italic 32px/1.5 Georgia, serif; margin-bottom: 8px; }
.support-picture figcaption > small { display: block; font-size: 12px; margin-top: 9px; color: #566169; }
.support-item { border-top: 1px solid #a9925e88; padding: 23px 0 29px; }
.support-index { display: flex; align-items: center; gap: 17px; color: #71603d; font: italic 29px/1.4 Georgia, serif; }
.support-index > span { font: 500 12px/1.6 var(--sans); letter-spacing: .12em; }
.support-item h3 { color: var(--navy); font-size: 26px; line-height: 1.7; margin: 10px 0; }
.support-item > p:last-of-type { font-size: 16px; line-height: 1.95; }
.support-details { margin-top: 13px; }
.support-details summary { display: flex; justify-content: space-between; align-items: center; gap: 16px; min-height: 44px; font-size: 15px; list-style: none; color: var(--navy); }
.support-details summary::-webkit-details-marker { display: none; }
.support-details summary > span { color: #71603d; font-size: 22px; }
.support-details ul { margin: 10px 0 0; padding-left: 22px; font-size: 16px; line-height: 1.9; }
@media (max-width:760px) {
  .upcoming-section { padding-block: 42px; }
  .upcoming-layout, .support-layout { grid-template-columns: minmax(0, 1fr); gap: 28px; }
  .upcoming-heading { text-align: center; }
  .upcoming-heading h2 { margin-block: 10px 14px; }
  .upcoming-heading > p:last-child br { display: none; }
  .upcoming-notice { padding: 25px 23px; }
  .upcoming-notice .editorial-link { font-size: 14px; gap: 12px; }
  .support-heading { margin-bottom: 30px; }
  .support-picture { position: relative; top: auto; }
  .support-picture img { aspect-ratio: 16/9; }
  .support-picture figcaption > span { font-size: 28px; }
  .support-item h3 { font-size: 24px; }
}
.blog-showcase .journal-layout { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; align-items: start; }
.blog-showcase .journal-feature { display: grid; grid-template-columns: 32% minmax(0, 1fr); background: #fff; color: var(--ink); border: 1px solid var(--gold-light); }
.blog-showcase .journal-photo { min-height: 185px; align-self: stretch; }
.blog-showcase .journal-photo img { position: absolute; inset: 0; width: 100%; height: 100%; aspect-ratio: auto; object-fit: cover; }
.blog-showcase .journal-feature-copy { padding: 17px 16px 9px; }
.blog-showcase .journal-feature .article-category { font-size: 12px; margin-bottom: 8px; }
.blog-showcase .journal-feature h3 { font-size: 20px; line-height: 1.6; margin: 0; }
.blog-showcase .journal-feature .article-details { margin-top: 8px; border-bottom: 0; }
.blog-showcase .journal-feature summary { min-height: 44px; }
.blog-showcase .journal-colophon { margin-top: 22px; }
@media (max-width: 1179px) {
  .blog-showcase .journal-layout { grid-template-columns: minmax(0, 1fr); gap: 18px; }
  .blog-showcase .journal-photo { min-height: 170px; }
}

/* Equal card geometry; the full text lives on an individual article page. */
.blog-showcase .journal-feature { height: 220px; overflow: hidden; }
.blog-showcase .journal-photo { min-height: 0; }
.blog-showcase .journal-feature-copy { display: grid; grid-template-rows: 20px 90px 44px; align-content: space-between; min-width: 0; padding: 16px; }
.blog-showcase .journal-feature .article-category { margin: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.blog-showcase .journal-feature h3 { height: 90px; line-height: 30px; overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; }
.article-read-link { display: flex; justify-content: space-between; align-items: center; gap: 10px; min-height: 44px; font-size: 14px; color: var(--navy); border-top: 1px solid #a9925e66; }
.article-read-link > span { color: var(--gold-dark); font-size: 21px; }
.profile-page-link { display: inline-flex; align-items: center; gap: 17px; max-width: 100%; margin-top: -40px; padding: 10px 0 7px; border-bottom: 1px solid #8b7343; color: var(--navy); font-size: 15px; letter-spacing: .04em; }
.profile-page-link::after { content: "→"; color: #8b7343; font: 20px/1 Georgia, serif; transition: transform .2s ease; }
.profile-page-link:hover::after { transform: translateX(5px); }

/* Quiet circular control and an editorial full-screen index. */
.menu-button { position: fixed; top: 22px; right: 24px; z-index: 32; width: 70px; height: 70px; gap: 7px; border: 1px solid #b8c8cf; border-radius: 50%; background: #f7faf9f0; box-shadow: 0 8px 24px #001a2f1a; color: var(--navy); backdrop-filter: blur(8px); transition: background-color .2s, transform .2s, box-shadow .2s; }
.menu-button:hover { transform: translateY(-2px); box-shadow: 0 12px 28px #001a2f26; }
.menu-button:focus-visible { outline: 2px solid #b99b59; outline-offset: 4px; }
.menu-lines { width: 24px; gap: 6px; }
.menu-lines span { height: 1.5px; background: currentColor; transition: transform .25s, width .25s; }
.menu-lines span:last-child { align-self: flex-end; width: 70%; }
.menu-button[aria-expanded="true"] .menu-lines span:first-child { transform: translateY(3.75px) rotate(45deg); }
.menu-button[aria-expanded="true"] .menu-lines span:last-child { width: 100%; transform: translateY(-3.75px) rotate(-45deg); }
.menu-label { font-size: 9px; font-weight: 600; letter-spacing: .17em; }
.site-header { z-index: 30; }
.site-navigation { position: fixed; inset: 0; z-index: 31; display: flex; flex-direction: column; justify-content: safe center; width: 100%; height: 100dvh; max-height: none; padding: 92px 24px 45px; overflow-y: auto; background: #081f30; box-shadow: none; }
.site-navigation::before { content: ''; position: fixed; inset: 0; pointer-events: none; background: url('/assets/pattern-services.webp') center / cover no-repeat; opacity: .055; }
.navigation-eyebrow, .navigation-signature { position: relative; width: min(720px, 100%); margin-inline: auto; color: #aac0ca; }
.navigation-eyebrow { display: flex; align-items: baseline; justify-content: space-between; padding-bottom: 14px; border-bottom: 1px solid #dce6e53d; font: 400 15px/1.5 Georgia, serif; letter-spacing: .19em; }
.navigation-eyebrow small { font: 500 11px/1.5 var(--sans); letter-spacing: .12em; }
.site-navigation a { position: relative; width: min(720px, 100%); min-height: 54px; flex-shrink: 0; display: grid; grid-template-columns: 26px minmax(0, 1fr); align-items: center; gap: 20px; margin-inline: auto; padding: 9px 0; border-bottom: 1px solid #dce6e529; color: #f5f7f7; font: 500 clamp(19px, 2.25vw, 28px)/1.5 var(--serif); letter-spacing: .045em; transition: color .2s, padding-left .2s; }
.site-navigation a:hover, .site-navigation a:focus-visible { color: #e7d49f; padding-left: 7px; }
.site-navigation small { color: #aebec5; font: 400 12px/1.5 Georgia, serif; letter-spacing: .04em; }
.navigation-signature { margin-top: 22px; font: 500 11px/1.5 var(--sans); letter-spacing: .17em; }
body.menu-open { overflow: hidden; }
/* Masthead and desktop navigation are defined in header.css. */
.reading-page { padding: 165px 24px 80px; }
.reading-article { max-width: 760px; margin: 0 auto; }
.reading-article h1 { color: var(--navy); font: 500 clamp(28px, 4vw, 43px)/1.7 var(--serif); margin: 18px 0 35px; }
.reading-prose { font-size: 18px; line-height: 2.1; }
.reading-prose p + p { margin-top: 25px; }
.reading-prose h2 { font: 500 28px/1.8 var(--serif); margin-bottom: 24px; }
.profile-page-role { font-size: 14px; letter-spacing: .08em; }
.profile-page-drawing { width: min(360px, 85%); height: auto; margin: 25px auto 40px; }
.profile-activity-list { margin-top: 54px; padding-top: 38px; border-top: 1px solid #cbdce5; scroll-margin-top: 32px; }
.profile-activity-list > .chapter-label { margin-bottom: 6px; color: #587286; }
.profile-activity-list > h2 { margin-bottom: 20px; }
.profile-activity-list article { display: grid; grid-template-columns: 112px minmax(0,1fr) auto; align-items: center; gap: 16px; padding: 18px 0; border-top: 1px solid #dbe5ea; }
.profile-activity-list time { color: #587286; font: 14px/1.5 Georgia, serif; }
.profile-activity-list h3 { color: var(--navy); font: 500 18px/1.5 var(--serif); }
.profile-activity-list a { border-bottom: 1px solid #7894a4; color: var(--navy); font-size: 13px; }
.youtube-videos { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
.youtube-card { min-width: 0; border-bottom: 1px solid #a9925e66; padding-bottom: 20px; }
.youtube-player { width: 100%; aspect-ratio: 16/9; border: 0; display: block; }
.youtube-card h3 { font: 500 18px/1.7 var(--serif); margin: 16px 0 10px; }
.youtube-card a, .youtube-card time { font-size: 13px; color: #71603d; }
.youtube-card a { display: inline-block; padding: 8px 0; }
.video-status { grid-column: 1/-1; padding: 60px 20px; text-align: center; border: 1px solid #a9925e66; background: #ffffff99; font-size: 16px; }
.youtube-channel-link { display: block; text-align: center; color: #71603d; font-size: 15px; padding-top: 28px; }
.youtube-channel-link[hidden] { display: none; }
@media(max-width:760px){
  .menu-button { width: 62px; height: 62px; top: 14px; right: 15px; }
  .site-navigation { padding: 90px 24px 28px; }
  .site-navigation a { min-height: 53px; font-size: clamp(19px, 5.3vw, 24px); }
  .navigation-signature { margin-top: 18px; font-size: 10px; }
  .reading-page { padding-top: 130px; }
  .reading-prose { font-size: 17px; }
  .youtube-videos { grid-template-columns: minmax(0,1fr); gap: 28px; }
  .profile-page-link { margin-top: -50px; font-size: 14px; gap: 14px; }
  .profile-activity-list article { grid-template-columns: minmax(0,1fr); gap: 5px; }
}
@media(max-height:580px){.site-navigation{justify-content:flex-start;padding-top:80px}.site-navigation a{min-height:46px;padding:6px 0;font-size:20px}}
/* Illustration and floating editorial notes. */
.profile-map { background: #fbf7ee; text-align: center; padding: 58px 24px 30px; }
.profile-map-heading .chapter-label { display: inline-block; padding: 7px 28px; background: var(--navy); color: var(--gold-light); font-size: 18px; letter-spacing: .16em; transform: rotate(-3deg); }
.profile-map-heading h2 { margin: 22px 0 3px; font-size: 29px; letter-spacing: .16em; }
.profile-map-heading > p:last-child { font-size: 13px; letter-spacing: .11em; color: #566169; }
.portrait-map { position: relative; max-width: 900px; height: 480px; margin: 14px auto 0; }
.portrait-engraving { position: absolute; top: 0; left: 50%; width: 500px; aspect-ratio: 1; transform: translateX(-50%); -webkit-mask-image: radial-gradient(ellipse 76% 82% at 50% 48%, #000 68%, rgba(0,0,0,.82) 79%, transparent 100%); mask-image: radial-gradient(ellipse 76% 82% at 50% 48%, #000 68%, rgba(0,0,0,.82) 79%, transparent 100%); }
.portrait-engraving img { display: block; width: 100%; height: 100%; object-fit: cover; }
.portrait-callout { position: absolute; display: flex; width: 218px; min-height: 136px; padding: 23px 26px; align-items: center; justify-content: center; flex-direction: column; background: rgba(238,245,247,.92); box-shadow: 0 13px 30px rgba(0,26,47,.07); backdrop-filter: blur(6px); text-align: center; color: var(--slate); z-index: 2; }
.portrait-callout::after { content: ""; position: absolute; width: 13px; height: 13px; border-radius: 50%; background: #c5a96e; opacity: .65; }
.portrait-callout > span { display: block; color: #7d6940; font: 600 11px/1.4 Georgia, serif; letter-spacing: .12em; margin-bottom: 6px; }
.portrait-callout p { font: 500 17px/1.65 var(--serif); letter-spacing: .02em; }
.callout-work { top: 18px; left: 4%; border-radius: 53% 47% 58% 42% / 47% 56% 44% 53%; transform: rotate(-2deg); }
.callout-work::after { right: 12px; bottom: 9px; }
.callout-words { top: 215px; right: 4%; border-radius: 46% 54% 44% 56% / 56% 43% 57% 44%; background: rgba(250,240,215,.9); transform: rotate(2deg); }
.callout-words::after { left: 14px; top: 11px; background: #8ba8b7; }
.callout-together { bottom: 90px; left: -8%; border-radius: 57% 43% 49% 51% / 43% 53% 47% 57%; background: rgba(240,239,231,.94); transform: rotate(-1deg); }
.callout-together::after { right: 17px; top: 13px; }
.video-section { background: #f5f1e7; color: var(--navy); padding-bottom: 25px; border-bottom: 1px solid #a9925e66; }
.video-heading { text-align: center; margin-bottom: 34px; }
.video-heading .chapter-label { color: #71603d; }
.video-frame { position: relative; width: 100%; max-width: 960px; margin-inline: auto; aspect-ratio: 16/9; overflow: hidden; border: 1px solid #a9925e88; background: #0c2b40; }
.video-frame > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: .25; }
.video-placeholder { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 12px; }
.video-placeholder > span { font: 400 20px/1.5 Georgia, serif; letter-spacing: .15em; color: var(--gold-light); }
.video-placeholder > p { font-size: 16px; }
.video-bottom { display: flex; justify-content: space-between; align-items: center; gap: 20px; margin-top: 42px; padding-top: 23px; border-top: 1px solid #a9925e55; }
.video-bottom > span { font-size: 12px; letter-spacing: .08em; color: #566169; }
.video-bottom a { display: flex; gap: 25px; align-items: center; font-size: 14px; padding-block: 10px; }
.video-bottom a > span { color: #71603d; font-size: 22px; }
@media (max-width: 760px) {
  .profile-map { padding: 38px 16px 22px; }
  .profile-map-heading .chapter-label { font-size: 16px; padding: 7px 22px; }
  .profile-map-heading h2 { margin: 16px 0 4px; font-size: 25px; }
  .portrait-map { width: 100%; max-width: 400px; aspect-ratio: 350/410; height: auto; margin-top: 10px; }
  .portrait-engraving { top: 10%; width: 94%; max-width: 350px; }
  .portrait-callout { width: 45%; max-width: 168px; min-height: 100px; padding: 13px 12px; }
  .portrait-callout > span { font-size: 11px; margin-bottom: 4px; }
  .portrait-callout p { font-size: 14px; line-height: 1.55; letter-spacing: 0; }
  .callout-work { top: 0; left: -1%; }
  .callout-words { top: 34%; right: -1%; }
  .callout-together { bottom: 46px; left: 24%; width: 194px; max-width: 194px; transform: translateX(-50%) rotate(-1deg); }
  .video-section { padding-block: 46px 23px; }
  .video-heading { margin-bottom: 25px; }
  .video-heading h2 { font-size: 26px; }
  .video-placeholder > span { font-size: 16px; }
  .video-bottom { display: block; margin-top: 28px; }
  .video-bottom a { margin-top: 10px; justify-content: space-between; }
}