.site-header--solid { position: relative; background: var(--night); }
.support-page h1 { margin: 0; font: 400 clamp(4rem, 7.5vw, 8rem)/.9 var(--serif); letter-spacing: -.05em; }
.support-page h2 { margin: 0 0 1.8rem; font: 400 clamp(2.4rem, 4vw, 4.5rem)/1 var(--serif); letter-spacing: -.04em; }
.support-page .eyebrow { font-size: .75rem; }
.support-page .text-link { font-size: .75rem; min-height: 44px; align-items: center; }
.support-page p { text-wrap: pretty; }
.support-page main a:not(.text-link):not(.button) { text-decoration: underline; text-underline-offset: .22em; }
a:focus-visible, summary:focus-visible { outline: 2px solid currentColor; outline-offset: 6px; }
.about-intro { display: grid; grid-template-columns: 1.05fr .85fr; gap: 6vw; padding: 6rem 5vw; align-items: center; }
.about-intro__copy { max-width: 44rem; }
.about-intro__copy > p:not(.eyebrow) { max-width: 33rem; font: 1.15rem/1.7 var(--serif); }
.about-intro__copy > .page-lead { margin: 2.5rem 0 1.5rem; font-size: 1.6rem; line-height: 1.45; }
.about-intro figure img { aspect-ratio: 3/4; height: auto; object-fit: cover; }
.about-story { display: grid; grid-template-columns: .6fr 1.4fr; gap: 6vw; padding: 6rem 8vw; border-top: 1px solid var(--line); }
.about-story > div { max-width: 43rem; }
.about-story p:not(.eyebrow), .about-note > p:not(.eyebrow) { font: 1.15rem/1.75 var(--serif); }
.about-note { padding: 6rem 8vw; color: var(--paper); background: var(--navy); }
.about-note > p:not(.eyebrow) { max-width: 33rem; }
.help-main { max-width: 1500px; margin: auto; padding: 0 6vw 5rem; }
.help-intro { display: grid; grid-template-columns: 1fr 1fr; gap: 7vw; padding: 6rem 0 4.5rem; align-items: end; }
.help-contact { padding-bottom: .5rem; }
.help-contact > p:first-child { max-width: 29rem; margin-top: 0; font: 1.5rem/1.5 var(--serif); }
.contact-email { font: 1.3rem/1.5 var(--serif); overflow-wrap: anywhere; }
.help-hint { max-width: 28rem; margin-top: 1.8rem; font-size: .9rem; color: #525955; }
.help-topics { display: flex; flex-wrap: wrap; gap: .25rem 2.5rem; padding: .8rem 0; border-block: 1px solid var(--line); }
.help-topics a { display: inline-flex; align-items: center; min-height: 44px; font-size: .875rem; }
.help-sections section { display: grid; grid-template-columns: 1fr 1.6fr; gap: 7vw; padding: 4rem 0; border-bottom: 1px solid var(--line); scroll-margin-top: 2rem; }
.help-sections section > div { max-width: 42rem; }
.help-sections p:not(.eyebrow) { font: 1.15rem/1.7 var(--serif); }
.help-sections .eyebrow { padding-top: .7rem; }
.not-found { display: flex; flex-direction: column; align-items: flex-start; gap: 1.8rem; min-height: 65svh; padding: 6rem 8vw; }
.not-found > p { margin: 0; }
@media (max-width: 680px) {
  .about-intro { grid-template-columns: 1fr; padding: 4rem 1.15rem; gap: 3rem; }
  .about-story { grid-template-columns: 1fr; gap: 1.5rem; padding: 4rem 1.15rem; }
  .about-note { padding: 4rem 1.15rem; }
  .help-main { padding: 0 1.15rem 3rem; }
  .help-intro { grid-template-columns: 1fr; gap: 3rem; padding: 4rem 0 3rem; }
  .help-topics { gap: .25rem 1.5rem; }
  .help-sections section { grid-template-columns: 1fr; gap: 1rem; padding: 3rem 0; }
  .help-sections .eyebrow { margin: 0; }
  .not-found { padding: 4rem 1.15rem; }
}

/* Custom designs: an invitation to bring a crew's story to the collection. */
.custom-intro { max-width: 1500px; margin-inline: auto; padding-block: 4.5rem; }
.custom-intro .about-intro__copy > .page-lead { font-size: 1.6rem; line-height: 1.45; }
.custom-intro figure { max-width: 35rem; justify-self: end; }
.custom-intro figcaption { margin-top: .8rem; font-size: .7rem; letter-spacing: .025em; color: #525955; }
.custom-intro .text-link { margin-top: 1rem; }
.custom-stories { max-width: 1600px; margin-inline: auto; display: grid; grid-template-columns: 1fr 1fr; gap: 8vw; padding: 5rem 8vw; border-top: 1px solid var(--line); }
.custom-stories__intro > p:not(.eyebrow), .custom-occasions p, .custom-process li p { font: 1.15rem/1.65 var(--serif); }
.custom-stories__intro > p:not(.eyebrow) { max-width: 31rem; }
.custom-page h3 { margin: 0 0 .7rem; font: 400 1.7rem/1.15 var(--serif); letter-spacing: -.02em; }
.custom-occasions > div { padding-block: 1.5rem; border-bottom: 1px solid var(--line); }
.custom-occasions > div:first-child { padding-top: 0; }
.custom-occasions p { margin: 0; max-width: 29rem; }
.custom-process { padding: 4.5rem max(8vw, calc((100% - 1240px) / 2)) 5.5rem; background: #e7e1d6; }
.custom-process ol { list-style: none; padding: 0; margin: 3rem 0 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 4vw; }
.custom-process li { border-top: 1px solid var(--line); padding-top: 1.2rem; }
.custom-step { display: block; margin-bottom: 2rem; font-size: .7rem; letter-spacing: .12em; }
.custom-process li p { margin-bottom: 0; }
.custom-contact { padding: 5.5rem max(8vw, calc((100% - 1240px) / 2)); display: grid; grid-template-columns: 1.2fr 1fr; gap: 8vw; align-items: center; color: var(--paper); background: var(--navy); scroll-margin-top: 1rem; }
.custom-contact > div > p:not(.eyebrow):not(.custom-email) { max-width: 30rem; font: 1.4rem/1.5 var(--serif); }
.custom-contact .button { min-height: 48px; margin-top: 1rem; font-size: .72rem; }
.custom-contact .custom-email { margin-top: 1.3rem; font-size: .85rem; overflow-wrap: anywhere; }
.custom-brief { padding-left: 3vw; border-left: 1px solid rgba(242,238,230,.3); }
.custom-brief ul { padding-left: 1.15rem; font: 1.1rem/1.65 var(--serif); }
.custom-brief li { padding: .25rem 0; }
.custom-brief > p { max-width: 28rem; margin: 1.8rem 0 0; font-size: .875rem; line-height: 1.6; }
@media (max-width: 900px) {
  .custom-intro { gap: 4vw; }
  .custom-contact { gap: 4vw; }
}
@media (max-width: 680px) {
  .custom-intro { padding-block: 3.5rem; gap: 2.5rem; }
  .custom-intro figure { width: 100%; max-width: none; }
  .custom-stories { grid-template-columns: 1fr; padding: 3.5rem 1.15rem; gap: 2rem; }
  .custom-process { padding: 3.5rem 1.15rem; }
  .custom-process ol { grid-template-columns: 1fr; gap: 2rem; margin-top: 2rem; }
  .custom-step { margin-bottom: 1rem; }
  .custom-contact { grid-template-columns: 1fr; padding: 3.5rem 1.15rem; gap: 2.5rem; }
  .custom-brief { padding: 2rem 0 0; border-left: 0; border-top: 1px solid rgba(242,238,230,.3); }
}
