/* BGHRA shared geometry. This file is the single layout source for both sites.
   Only outer shells, mastheads and campus feature frames are normalized.
   Cards, portraits, scans, document readers and filter layouts keep their rules. */
@layer bghra-shared-layout {
  :root { --bghra-content-max:1120px; --bghra-content-width:88%; --bghra-edge:max(6%,calc((100% - 1120px)/2)); --bghra-feature-gap:28px; }

  /* Main website: full-width section backgrounds with one aligned content shell. */
  html body:not(.et-fb) #page-container#page-container #et-boc #et-main-area #main-content#main-content :is(.bl-wrap,.bs-wrap,.hub-main,.culture-hub,.resource-copy,.film-inner,.reading-intro,.bghra-about-hub,.adoptee-news-body,.history-navigation,.history-copy,.history-intro,.redress-copy,.bghra-travel,.rcta-wrap,.bghra-us-content,.bghra-history-topic-content,.book-filter-main,.bghra-tracing-content,.adoption-resource>.resource-copy,.bghra-directory>.inner),
  html body:not(.et-fb) #page-container#page-container #et-boc #et-main-area #main-content#main-content .et_pb_section>.et_pb_row {
    box-sizing:border-box!important; width:var(--bghra-content-width)!important; max-width:var(--bghra-content-max)!important; margin-left:auto!important; margin-right:auto!important; padding-left:0!important; padding-right:0!important;
  }
  /* A shell inside an existing row must not receive a second set of gutters. */
  html body:not(.et-fb) #page-container#page-container #et-boc #et-main-area #main-content#main-content .et_pb_row :is(.hub-main,.culture-hub,.resource-copy,.film-inner,.reading-intro,.bghra-about-hub,.adoptee-news-body,.history-navigation,.bghra-tracing-content),
  html body:not(.et-fb) #page-container#page-container #et-boc #et-main-area #main-content#main-content :is(.hub-main,.culture-hub,.resource-copy,.film-inner,.reading-intro,.bghra-about-hub,.adoptee-news-body,.history-navigation,.bghra-tracing-content) :is(.bghra-intro-panel,.bghra-collection-tools,.bghra-universal-intro) {
    width:100%!important; max-width:100%!important;
  }
  html body:not(.et-fb) #page-container#page-container #et-boc #et-main-area #main-content#main-content :is(.bghra-conference-grid,.bghra-intro-panel,.bghra-collection-tools) {
    box-sizing:border-box!important; width:var(--bghra-content-width)!important; max-width:var(--bghra-content-max)!important; margin-left:auto!important; margin-right:auto!important;
  }
  html body:not(.et-fb) #page-container#page-container #et-boc #et-main-area #main-content#main-content .et_pb_row :is(.bghra-intro-panel,.bghra-collection-tools,.bghra-conference-grid) {width:100%!important;max-width:100%!important;}

  /* Main website masthead: same image, crop and title alignment as the archive. */
  html body:not(.et-fb) #page-container#page-container #et-boc #et-main-area #main-content#main-content :is(.bl-brand-hero,.bghra-page-photo-header,.redress-hero,.history-hero),
  html body.single-post #page-container#page-container #et-boc .et-l--body::before,
  html body.bghra-community-page #page-container#page-container #et-boc #main-content::before {
    box-sizing:border-box!important; display:flex!important; flex-direction:column!important; justify-content:flex-end!important; align-items:flex-start!important; width:100%!important; max-width:none!important; height:auto!important; min-height:300px!important; aspect-ratio:auto!important; padding:24px var(--bghra-edge)!important; margin:0 0 var(--bghra-feature-gap)!important;
    background:linear-gradient(112deg,rgba(0,8,135,.44) 0%,rgba(0,8,135,.27) 46%,rgba(0,8,135,.06) 62%,transparent 72%),url('https://bghra.org/wp-content/uploads/2021/11/IMAGE-0001.jpg') center top/cover no-repeat #080e53!important; border:0!important; border-radius:0!important;
  }
  html body:not(.et-fb) #page-container#page-container #et-boc #et-main-area #main-content#main-content :is(.bl-brand-hero,.redress-hero)>.bl-wrap {width:100%!important;max-width:none!important;margin:0!important;padding:0!important;}
  html body:not(.et-fb) #page-container#page-container #et-boc #et-main-area #main-content#main-content :is(.bl-brand-hero,.bghra-page-photo-header,.redress-hero,.history-hero) h1 {width:100%!important;max-width:100%!important;margin:0!important;padding:0!important;font-size:38px!important;line-height:1.16!important;letter-spacing:0!important;overflow-wrap:break-word!important;}

  /* The campus feature is a frame, never a rule for every image on a page. */
  html body:not(.et-fb) #page-container#page-container #et-boc #et-main-area #main-content#main-content :is(.bl-campus-hero,.bghra-library-hero-photo):has(img[src*='IMG_1036']),
  html body:not(:has(#page-container)) #archive-campus-banner {
    box-sizing:border-box!important; width:var(--bghra-content-width)!important; max-width:var(--bghra-content-max)!important; height:auto!important; margin:var(--bghra-feature-gap) auto!important; padding:8px!important; border:1px solid #bdd5d7!important; border-top:3px solid #29b8d0!important; border-radius:6px!important; background:#fff!important; box-shadow:0 3px 12px #133b3b0d!important; overflow:hidden!important;
  }
  html body:not(.et-fb) #page-container#page-container #et-boc #et-main-area #main-content#main-content :is(.bl-campus-hero,.bghra-library-hero-photo) img[src*='IMG_1036'],
  html body:not(:has(#page-container)) #archive-campus-banner img {
    display:block!important; width:100%!important; height:clamp(200px,25vw,340px)!important; max-height:none!important; aspect-ratio:auto!important; object-fit:cover!important; object-position:center!important; filter:brightness(1.08)!important; border-radius:2px!important;
  }
  html body:not(.et-fb) #page-container#page-container #et-boc #et-main-area #main-content#main-content :is(.bl-campus-hero,.bghra-library-hero-photo):has(img[src*='IMG_1036']) figcaption,
  html body:not(:has(#page-container)) #archive-campus-banner figcaption {
    margin:0!important; padding:8px 8px 1px!important; font:400 12px/1.5 Arial,Helvetica,sans-serif!important; text-align:center!important; color:#486066!important; background:white!important;
  }
  html body:not(.et-fb) #page-container#page-container #et-boc #et-main-area #main-content#main-content .et_pb_row :is(.bl-campus-hero,.bghra-library-hero-photo):has(img[src*='IMG_1036']) {width:100%!important;max-width:100%!important;}
  html body:not(.et-fb) #page-container#page-container #et-boc #et-main-area #main-content#main-content :is(.history-copy,.resource-copy)>p {max-width:76ch;}
  html body:not(.et-fb) #page-container#page-container #et-boc #main-content .bl-brand-hero:has(+.bl-campus-hero) {margin-bottom:0!important;}

  /* Archive shells: retain existing grids and document-reader dimensions. */
  html body:not(:has(#page-container)) :is(body>main:not(:has(>#top.hero)),main.wrap,main.catalog-main,main.hub-main) {box-sizing:border-box!important;width:var(--bghra-content-width)!important;max-width:var(--bghra-content-max)!important;margin-left:auto!important;margin-right:auto!important;padding-left:0!important;padding-right:0!important;}
  html body:not(:has(#page-container)) main:has(>#top.hero)>.section-shell,
  html body:not(:has(#page-container)) main:has(>#top.hero)>.archive-intro {box-sizing:border-box!important;width:100%!important;max-width:none!important;margin-left:0!important;margin-right:0!important;padding-left:var(--bghra-edge)!important;padding-right:var(--bghra-edge)!important;}

  /* Shared archive banners, including collection hubs and collection pages. */
  html body:not(:has(#page-container)) :is(main>#top.hero,body>.hero:has(h1),body>.banner:has(h1)) {
    box-sizing:border-box!important; position:relative!important; isolation:isolate; display:flex!important; flex-direction:column!important; align-items:flex-start!important; justify-content:flex-end!important; width:100%!important; max-width:none!important; height:auto!important; min-height:300px!important; aspect-ratio:auto!important; margin:0 0 var(--bghra-feature-gap)!important; padding:24px var(--bghra-edge)!important; gap:8px!important; overflow:hidden!important;
    background:linear-gradient(112deg,rgba(0,8,135,.44) 0%,rgba(0,8,135,.27) 46%,rgba(0,8,135,.06) 62%,transparent 72%),url('https://bghra.org/wp-content/uploads/2021/11/IMAGE-0001.jpg') center top/cover no-repeat #080e53!important; border:0!important; border-radius:0!important; color:white!important;
  }
  html body:not(:has(#page-container)) :is(main>#top.hero,body>.hero:has(h1),body>.banner:has(h1))::after {display:none!important;content:none!important;}
  html body:not(:has(#page-container)) #top.hero:has(+ #archive-campus-banner) {margin-bottom:0!important;}
  html body:not(:has(#page-container)) #top .hero-art {display:none!important;}
  html body:not(:has(#page-container)) #top .hero-copy {box-sizing:border-box!important;display:flex!important;flex-direction:column!important;justify-content:flex-end!important;align-items:flex-start!important;width:100%!important;max-width:none!important;min-height:0!important;height:auto!important;padding:0!important;margin:0!important;background:none!important;}
  html body:not(:has(#page-container)) :is(#top.hero,.hero,.banner):has(h1) h1 {box-sizing:border-box!important;width:100%!important;max-width:100%!important;margin:0!important;padding:0!important;color:white!important;font:800 38px/1.16 Arial,Helvetica,sans-serif!important;letter-spacing:0!important;text-transform:uppercase!important;overflow-wrap:break-word!important;text-shadow:0 2px 5px #000a!important;}
  html body:not(:has(#page-container)) #top h1 span {display:inline!important;}
  html body:not(:has(#page-container)) #top h1 span+span::before {content:' ';}
  html body:not(:has(#page-container)) :is(.hero,.banner):has(h1) :is(.eyebrow,.kicker),
  html body:not(:has(#page-container)) .banner>p:first-child {max-width:100%!important;margin:0 0 8px!important;padding:0!important;font:700 11px/1.5 Arial,sans-serif!important;letter-spacing:.08em!important;text-transform:uppercase!important;background:none!important;border:0!important;}
  html body:not(:has(#page-container)) :is(body>.hero,body>.banner)>p {max-width:80ch!important;padding:0!important;background:none!important;border:0!important;color:white!important;}
  html body:not(:has(#page-container)) #top .hero-link {margin-top:12px!important;font-size:11px!important;line-height:1.5!important;}

  /* Navigation shell alignment; menu behavior and destinations stay intact. */
  html body:not(.et-fb) #page-container#page-container #et-boc .et-l--header .et_pb_row {box-sizing:border-box!important;width:var(--bghra-content-width)!important;max-width:var(--bghra-content-max)!important;margin-left:auto!important;margin-right:auto!important;}
  html body:not(:has(#page-container)) .site-header {box-sizing:border-box!important;padding-left:var(--bghra-edge)!important;padding-right:var(--bghra-edge)!important;min-height:74px!important;}

  @media(max-width:980px) {
    :root {--bghra-feature-gap:20px;}
    html body:not(.et-fb) #page-container#page-container #et-boc #et-main-area #main-content#main-content :is(.bl-brand-hero,.bghra-page-photo-header,.redress-hero,.history-hero),
    html body.single-post #page-container#page-container #et-boc .et-l--body::before,
    html body.bghra-community-page #page-container#page-container #et-boc #main-content::before,
    html body:not(:has(#page-container)) :is(main>#top.hero,body>.hero:has(h1),body>.banner:has(h1)) {min-height:clamp(180px,24vw,260px)!important;height:auto!important;aspect-ratio:auto!important;padding:20px var(--bghra-edge)!important;background-size:cover!important;background-position:center top!important;}
    html body:not(.et-fb) #page-container#page-container #et-boc #et-main-area #main-content#main-content :is(.bl-brand-hero,.bghra-page-photo-header,.redress-hero,.history-hero) h1,
    html body:not(:has(#page-container)) :is(#top.hero,.hero,.banner):has(h1) h1 {font-size:clamp(20px,4.6vw,30px)!important;line-height:1.16!important;width:100%!important;max-width:100%!important;}
    html body:not(.et-fb) #page-container#page-container #et-boc #et-main-area #main-content#main-content :is(.bl-campus-hero,.bghra-library-hero-photo) img[src*='IMG_1036'],
    html body:not(:has(#page-container)) #archive-campus-banner img {height:auto!important;aspect-ratio:16/9!important;max-height:none!important;object-fit:cover!important;}
  }
}