/* Home-page composition. Shared detail pages retain their own layouts. */
/* Hero layouts are device-specific: keep desktop changes out of mobile. */
.hero-profile-card { margin-top: 0; }
.hero-profile-description > .profile-detail { display: block; margin-top: 12px; font-size: 15px; line-height: 1.9; }
.portrait-callout p, .portrait-callout > span { white-space: nowrap; }
.concept h2 span { display: inline-block; }
.hero-desktop-intro { display: none; }
.hero-portrait-caption { display: none; }
.hero-desktop-evidence { display: none; }
/* Carry the approved navy / paper / gold palette through the lower page. */
#events .event-card .event-date, #events .event-date strong { color: var(--navy); }
#video { background-color: var(--paper); }
#video .chapter-label { color: #71603d; }

@media (min-width: 761px) {
  .site-header { position: relative; height: 86px; background: #f7f5f0; }
  .hero { display: flex; align-items: center; height: auto; min-height: clamp(520px, 42vw, 680px); aspect-ratio: auto; padding: clamp(42px, 4.2vw, 70px) 7%; }
  /* Keep the original artwork and its scale, trimming the lower edge for a compact desktop hero. */
  .hero-media { inset: 0; }
  .hero-media img { object-fit: cover; object-position: center top; transform: scaleX(-1); }
  .hero::after { inset: 0; background: linear-gradient(270deg, transparent 36%, rgba(250, 248, 242, .06) 52%, rgba(250, 248, 242, .2) 73%, transparent 92%); }
  .hero-copy { position: relative; top: auto; left: auto; right: auto; width: 59%; max-width: 750px; transform: none; text-shadow: 0 1px 0 rgba(255, 255, 255, .65); }
  .hero-copy h1 { margin: 0; writing-mode: horizontal-tb; line-height: 1.25; letter-spacing: .01em; }
  .hero-copy h1 .hero-mobile-title { display: none; }
  .hero-desktop-role { margin: 0; font: 500 clamp(12px, 1.2vw, 17px)/1.8 var(--serif); letter-spacing: .12em; }
  .hero-copy-name { display: block; margin: 0; color: #796843; font: 400 clamp(18px, 2vw, 28px)/1.4 Georgia, serif; letter-spacing: .035em; }
  .hero-desktop-intro { display: block; margin-top: clamp(14px, 2vw, 28px); font-family: var(--serif); }
  .hero-desktop-focus { margin: 0 0 12px; font-size: clamp(15px, 1.6vw, 23px); line-height: 1.7; }
  .hero-desktop-focus span { display: inline-block; white-space: nowrap; }
  .hero-desktop-lead { margin: 0; font-size: clamp(14px, 1.45vw, 21px); line-height: 1.8; }
  .hero-desktop-lead span { display: block; }
  .hero-desktop-detail { max-width: 36em; margin: 10px 0 0; color: #405362; font-size: clamp(12px, 1.1vw, 16px); line-height: 1.85; text-wrap: pretty; }
  .hero-profile-panel { display: none; }

  .concept { padding: 62px 5%; border-top: 12px solid var(--navy); }
  .concept-art { opacity: .28; }
  .concept-content { grid-template-columns: minmax(280px, .8fr) minmax(0, 1.6fr); column-gap: clamp(36px, 5vw, 76px); max-width: 1320px; text-align: left; align-items: start; }
  .concept-lead { padding: 0; border: 0; }
  .concept-lead .section-label { font-size: 29px; }
  .concept-body { width: 100%; max-width: none; padding: 0 0 0 36px; border-left: 1px solid #bda87277; }
  .concept h2 { max-width: none; margin: 25px 0 0; font-size: clamp(25px, 2.1vw, 32px); line-height: 1.8; }
  .concept h2 span { display: block; white-space: nowrap; }
  .concept-prose { display: block; font-size: clamp(19px, 1.55vw, 23px); line-height: 1.95; letter-spacing: .015em; }
  .concept-prose br { display: none; }
  .concept-prose p + p { margin-top: 20px; }
  .concept-closing { margin: 28px 0 18px; font-size: 24px; }
  .concept-closing br { display: none; }
  .concept-closing span { display: inline-block; font-size: inherit; }
  .concept-signoff { justify-content: flex-start; }
  .concept-body .concept-page-link { justify-self: start; justify-content: flex-start; gap: 14px; min-height: 44px; margin: 12px 0 0; padding: 6px 0; border: 0; background: transparent; color: #63717a; font-size: 14px; text-align: left; }
  .concept-body .concept-page-link::after { content: "→"; color: #8b7952; font-size: 23px; line-height: 1; transition: transform .2s; }
  .concept-body .concept-page-link:hover { color: var(--navy); background: transparent; }
  .concept-body .concept-page-link:hover::after { transform: translateX(4px); }
  .concept-body .concept-page-link:focus-visible { outline: 2px solid var(--gold); outline-offset: 4px; }

  #journal { padding: 54px 5%; }
  #journal > .chapter-inner { max-width: 1320px; }
  #journal .journal-heading { flex-direction: row; justify-content: space-between; align-items: baseline; text-align: left; margin-bottom: 24px; }
  #journal .journal-heading h2 { margin-top: 6px; font-size: 34px; }
  #journal .journal-gallery-wrap { display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(0, 1fr); gap: 32px; max-width: none; padding: 26px; }
  #journal .journal-hero { margin: 0; padding: 0 30px 0 0; border-bottom: 0; border-right: 1px solid #d3e0e6; }
  #journal .journal-hero-link { display: flex; flex-direction: column; min-height: 0; height: 100%; gap: 18px; }
  #journal .journal-hero-copy { order: 2; }
  #journal .journal-hero-link > .journal-image { order: 1; flex: 1; height: auto; min-height: clamp(220px, 22vw, 350px); aspect-ratio: auto; }
  #journal .journal-hero h3 { font-size: clamp(26px, 2.5vw, 37px); line-height: 1.5; }
  #journal .journal-title-line { display: block; }
  #journal .journal-title-phrase { display: inline; white-space: normal; }
  #journal .journal-latest-label { margin-bottom: 8px; }
  #journal .journal-read-link { margin-top: 12px; }
  #journal .journal-gallery { grid-template-columns: minmax(0, 1fr); gap: 0; }
  #journal .journal-gallery-card { padding: 14px 0; border-bottom: 1px solid #d3e0e6; }
  #journal .journal-gallery-card:first-child { padding-top: 0; }
  #journal .journal-gallery-card:last-child { padding-bottom: 0; border: 0; }
  #journal .journal-gallery-link { display: grid; grid-template-columns: 32% minmax(0, 1fr); grid-template-rows: auto 1fr; gap: 4px 18px; min-height: 105px; height: 100%; padding: 0; border: 0; box-shadow: none; background: transparent; }
  #journal .journal-gallery .journal-image { grid-row: 1 / 3; height: 100%; min-height: 105px; aspect-ratio: auto; }
  #journal .journal-gallery-category { margin: 0; align-self: end; font-size: 12px; }
  #journal .journal-gallery h3 { padding: 0; font-size: clamp(16px, 1.4vw, 20px); line-height: 1.6; }
  #journal .journal-footer { max-width: none; justify-content: flex-end; margin-top: 18px; }

  #video { padding: 48px 5%; }
  #video > .chapter-inner { display: grid; grid-template-columns: minmax(220px, .65fr) minmax(0, 1.65fr); gap: 16px 48px; max-width: 1320px; }
  #video .video-heading { grid-column: 1; grid-row: 1; align-items: flex-start; text-align: left; margin: 0; }
  #video .video-heading h2 { font-size: clamp(28px, 2.6vw, 38px); white-space: normal; }
  #video .video-heading h2 span { display: inline-block; }
  #video .youtube-videos { grid-column: 2; grid-row: 1 / 4; align-self: start; padding: 20px; box-shadow: 6px 6px 0 #b6cbd5; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  #video .youtube-card:first-child { grid-column: 1 / -1; }
  #video .video-status { min-height: 200px; padding: 30px; }
  #video .youtube-channel-link, #video .section-page-link { grid-column: 1; justify-self: start; margin: 0; text-align: left; font-size: 14px; }
  #video .video-bottom { display: none; }
}

@media (min-width: 1100px) {
  .profile-activity-layout { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); background: #fbf7ee; }
  .profile-activity-layout > section { min-width: 0; padding: 46px clamp(24px, 3vw, 54px) 36px; background: transparent; }
  .profile-activity-layout > .activity-records { background: var(--activity-surface); border-top: 0; border-left: 1px solid #a9925e55; }
  .profile-activity-layout > section + section { border-left: 1px solid #b7ae9855; }
  .profile-activity-layout > section > .chapter-inner { display: flex; flex-direction: column; height: 100%; }
  .profile-activity-layout .profile-map-heading,
  .profile-activity-layout .activity-heading { min-height: 126px; margin: 0 0 20px; text-align: center; }
  .profile-activity-layout .profile-map-heading .chapter-label,
  .profile-activity-layout .activity-heading .chapter-label { display: block; padding: 0; background: transparent; color: #7d6940; font: 400 15px/1.5 Georgia, serif; letter-spacing: .17em; transform: none; }
  .profile-activity-layout .profile-map-heading h2,
  .profile-activity-layout .activity-heading h2 { margin: 12px 0 8px; font-size: 30px; line-height: 1.65; }
  .profile-activity-layout .profile-map-heading > p:last-child,
  .profile-activity-layout .activity-heading > p:last-child { color: #566169; font-size: 13px; line-height: 1.8; letter-spacing: .03em; }
  .profile-activity-layout .portrait-map { width: 100%; max-width: 660px; height: auto; min-height: 470px; flex: 1; }
  .profile-activity-layout .portrait-engraving { top: 35px; width: min(100%, 440px); }
  .profile-activity-layout .portrait-callout { width: 39%; min-height: 126px; padding: 18px 10px; }
  .profile-activity-layout .portrait-callout p { font-size: clamp(16px, 1.25vw, 20px); }
  .profile-activity-layout .callout-work { top: 12px; left: -2%; }
  .profile-activity-layout .callout-words { top: 195px; right: -2%; }
  .profile-activity-layout .callout-together { top: 316px; bottom: auto; left: 0; }
  .profile-activity-layout .profile-page-link { align-self: center; position: relative; margin-top: 20px; }
  .profile-activity-layout .activity-list,
  .profile-activity-layout .activity-footnote { width: 100%; }
  .profile-activity-layout .activity-item { grid-template-columns: 34% minmax(0, 1fr); min-height: 172px; box-shadow: none; }
  .profile-activity-layout .activity-thumbnail { min-height: 172px; }
  .profile-activity-layout .activity-thumbnail img { position: absolute; inset: 0; }
  .profile-activity-layout .activity-copy { padding: 14px 16px; }
  .profile-activity-layout .activity-item time { font-size: 13px; }
  .profile-activity-layout .activity-type { margin-top: 4px; font-size: 11px; }
  .profile-activity-layout .activity-item h3 { font-size: 19px; line-height: 1.5; }
  .profile-activity-layout .activity-item h3 + p { margin-top: 5px; font-size: 12px; line-height: 1.65; }
  .profile-activity-layout .activity-item a { padding-top: 6px; font-size: 12px; }
  .profile-activity-layout .activity-footnote { font-size: 11px; }
  .profile-activity-layout .activity-list-link { margin-top: auto; align-self: center; }
  .profile-activity-layout .activity-footnote { margin-bottom: 20px; }
  .profile-activity-layout .profile-page-link,
  .profile-activity-layout .activity-list-link { min-height: 44px; padding: 8px 0 6px; font-size: 15px; line-height: 1.9; border-color: #8b7343; }
  .profile-activity-layout .activity-heading .chapter-label { color: #71603d; }
}

@media (min-width: 761px) and (max-width: 1099px) {
  .concept-content { grid-template-columns: 250px minmax(0, 1fr); gap: 28px; }
  .concept-body { padding-left: 24px; }
  .concept-prose { grid-template-columns: 1fr; gap: 18px; }
  .concept-closing { font-size: 22px; }
  .concept h2 { font-size: 23px; }
  #journal .journal-gallery-wrap { gap: 20px; padding: 20px; }
  #journal .journal-hero { padding-right: 20px; }
  #video > .chapter-inner { gap: 16px 28px; }
}

@media (max-width: 760px) {
  .site-header { position: absolute; height: 84px; background: transparent; border: 0; box-shadow: none; }
  .hero { height: auto; min-height: 0; aspect-ratio: 1080 / 1350; container-type: inline-size; }
  .hero-media img { object-fit: contain; object-position: center top; transform: none; }
  .hero-copy { top: 24%; left: auto; right: 10%; width: auto; transform: none; }
  .hero-copy h1 { margin: 0; writing-mode: vertical-rl; font-size: 8.2vw; font-size: 8.2cqw; line-height: 1.5; letter-spacing: .02em; }
  .hero-copy h1 .hero-mobile-title { display: contents; }
  .hero-mobile-title > span:first-child { letter-spacing: .30em; }
  .hero-mobile-title > span:last-child { letter-spacing: .02em; }
  .hero-copy h1 .hero-desktop-focus, .hero-desktop-role, .hero-copy-name { display: none; }
  .hero-profile-panel { display: block; }
  .hero-profile-description > .profile-detail { font-size: 13px; }
  .copy-phrase { display: inline-block; white-space: nowrap; }
  .hero-profile-description, .hero-profile-focus, .concept-prose p, .concept-closing { text-wrap: balance; }
  .concept-prose p { max-width: 32em; margin-inline: auto; }
  .concept-closing .copy-phrase { display: block; font-size: inherit; }
  .concept h2 span { display: block; }
  .callout-work { top: -16px; }
  .portrait-callout p { font-size: clamp(12px, 3.55vw, 14px); }
}