@charset "utf-8";

/* Editorial about page: places, everyday moments, people, then the local network. */
.aboutRefined {
  --about-accent: var(--brand-accent);
  --about-orange: var(--brand-orange);
  --about-ink: #503e32;
  --about-muted: #766759;
  --about-paper: var(--brand-paper);
  --about-line: var(--brand-line);
  background: #fff;
  color: var(--about-ink);
}
.aboutRefined .aboutInner { width: min(1120px, calc(100% - 96px)); margin-inline: auto; }
.aboutRefined > section { padding: 96px 0; }
.aboutRefined [id] { scroll-margin-top: 110px; }
.aboutRefined :is(h1, h2, h3) {
  color: var(--about-ink);
  font-family: "Yu Mincho", "Hiragino Mincho ProN", serif;
  font-weight: 600;
  line-height: 1.65;
  line-break: strict;
}
.aboutRefined h2 { margin: 0; font-size: clamp(28px, 3vw, 40px); letter-spacing: .025em; }
.aboutRefined h2 em { color: var(--brand-heading); font-style: normal; }
.aboutRefined p { line-height: 1.95; }
.aboutRefined figure { margin: 0; }
.aboutRefined img { display: block; max-width: 100%; }
.aboutRefined .aboutEyebrow {
  display: flex; align-items: center; gap: 14px;
  margin: 0 0 20px; color: var(--about-accent); font-size: 13px;
  font-weight: 700; line-height: 1.7; letter-spacing: .1em;
}
.aboutEyebrow > span { font-family: Georgia, serif; font-size: 20px; font-weight: 400; letter-spacing: .04em; }
.aboutRefined a:focus-visible { outline: 3px solid var(--about-accent); outline-offset: 6px; }
.aboutRefined .aboutSectionDescription { max-width: 25em; margin: 22px 0 0; font-size: 15px; color: var(--about-muted); line-height: 2.1; }

/* A photograph fills the opening; the paper inset keeps every word readable. */
.aboutRefined .aboutStoryHero { padding-top: 26px; padding-bottom: 0; background: var(--about-paper); }
.aboutStoryHero > .aboutInner { width: min(1248px, calc(100% - 64px)); }
.aboutHeroStage { position: relative; min-height: 566px; }
.aboutHeroPhoto { position: absolute; inset: 0 0 20px 30%; }
.aboutHeroPhoto img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 67%; border-radius: 130px 8px 90px 8px; }
.aboutHeroPhoto figcaption { position: absolute; right: 26px; bottom: 20px; padding: 5px 16px; background: rgba(255,249,238,.96); color: var(--about-ink); font-size: 12px; letter-spacing: .06em; }
.aboutHeroCopy { position: relative; z-index: 1; width: fit-content; max-width: 58%; padding: 43px 46px 35px 24px; border-radius: 0 0 80px 0; background: var(--about-paper); }
.aboutRefined .aboutStoryHero h1 { margin: 0; font-size: clamp(36px, 4.3vw, 58px); line-height: 1.65; letter-spacing: .035em; }
.aboutStoryHero h1 span { display: block; }
.aboutHeroDescription { margin: 22px 0 0; color: var(--about-muted); font-size: 16px; letter-spacing: .04em; }
.aboutHeroSketch { position: absolute; bottom: -16px; left: 10%; z-index: 2; width: 190px; }
.aboutHeroSketch img { width: 100%; height: auto; }
.aboutLocationSeal { position: absolute; top: -14px; right: 20px; display: grid; align-content: center; width: 132px; height: 132px; margin: 0; border: 1px solid var(--about-accent); border-radius: 50%; outline: 6px solid var(--about-paper); color: var(--about-accent); background: var(--about-paper); text-align: center; transform: rotate(8deg); }
.aboutLocationSeal span { display: block; font-size: 10px; letter-spacing: .1em; }
.aboutLocationSeal strong { font-family: "Yu Mincho", "Hiragino Mincho ProN", serif; font-size: 23px; letter-spacing: .1em; }
.aboutPageNav { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 36px; padding: 34px 24px 0; }
.aboutPageNav a { display: flex; align-items: center; gap: 14px; min-height: 66px; border-bottom: 1px solid var(--about-line); color: var(--about-ink); font-size: 14px; font-weight: 700; text-decoration: none; }
.aboutPageNav small { color: var(--about-accent); font-family: Georgia, serif; font-size: 16px; font-weight: 400; }
.aboutPageNav a > span { display: grid; place-items: center; width: 28px; height: 28px; margin-left: auto; border: 1px solid #c6b39e; border-radius: 50%; color: var(--about-accent); transition: background .2s, color .2s; }
.aboutPageNav a:hover { color: var(--about-accent); border-color: currentColor; }
.aboutPageNav a:hover > span { color: #fff; background: var(--about-accent); border-color: var(--about-accent); }

/* Matching square frames unify the stories; staggered placement keeps the reading rhythm. */
.aboutRefined .aboutPrinciples { padding-top: 94px; padding-bottom: 116px; }
.aboutPrinciplesHeading { text-align: center; }
.aboutPrinciplesHeading .aboutEyebrow { justify-content: center; }
.aboutPrinciplesHeading h2 { font-size: clamp(31px, 3.3vw, 44px); }
.aboutPrinciplesHeading > p:last-child { margin: 22px 0 0; color: var(--about-muted); font-size: 15px; }
.aboutStoryList { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 48px; margin: 58px 0 0; padding: 0; list-style: none; }
.aboutStory { min-width: 0; }
.aboutStoryEnjoyment { padding-top: 92px; }
.aboutStoryTogether { padding-top: 24px; }
.aboutStoryVisual { position: relative; aspect-ratio: 1; border-radius: 16px; }
.aboutStoryVisual img { width: 100%; height: 100%; border-radius: inherit; object-fit: cover; }
.aboutStoryMovement .aboutStoryVisual img { object-position: 43% center; }
.aboutStoryVisual figcaption { margin-top: 9px; font-size: 10px; text-align: right; color: var(--about-muted); }
.aboutStoryTogether .aboutStoryVisual { background: transparent; }
.aboutStoryTogether .aboutStoryVisual img { padding: 0; object-fit: cover; object-position: center; }
.aboutStoryCopy { padding: 24px 5px 0; }
.aboutStoryCopy .aboutStoryLabel { display: flex; align-items: center; gap: 12px; margin: 0 0 10px; color: var(--about-accent); font-size: 12px; font-weight: 700; letter-spacing: .08em; }
.aboutStoryLabel > span { font-family: Georgia, serif; font-size: 35px; font-weight: 400; font-style: italic; line-height: 1.2; }
.aboutStoryCopy h3 { margin: 0; font-size: clamp(24px, 2.45vw, 31px); line-height: 1.6; letter-spacing: .015em; }
.aboutStoryCopy > p:last-child { margin: 17px 0 0; font-size: 14px; color: var(--about-muted); line-height: 2.05; }

/* The team is pictured together rather than presented as anonymous staff cards. */
.aboutRefined .aboutTeam { margin: 0 24px; padding: 80px 0 66px; border-radius: 110px 12px 110px 12px; background: var(--soft-yellow); }
.aboutTeam > .aboutInner { width: min(1120px, calc(100% - 80px)); }
.aboutTeamLead { display: grid; grid-template-columns: .9fr 1.35fr; gap: 30px; align-items: center; }
.aboutTeamLead header { position: relative; z-index: 1; }
.aboutTeamScene { position: relative; min-width: 0; width: 88%; max-width: 460px; justify-self: center; }
.aboutTeamScene::before { content: ""; position: absolute; width: 75%; aspect-ratio: 1; left: 15%; top: 0; border-radius: 50%; background: #fff; }
.aboutTeamScene img { position: relative; width: 100%; height: auto; }
.aboutTeamScene figcaption { position: relative; margin-top: 16px; font-size: 12px; text-align: center; letter-spacing: .06em; color: var(--muted); }
.aboutTeamRoles { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); margin: 46px 0 0; padding: 32px 0 0; border-top: 1px solid var(--brand-line); }
.aboutTeamRoles > div { min-width: 0; padding-inline: 28px; }
.aboutTeamRoles > div:first-child { padding-left: 0; }
.aboutTeamRoles > div:last-child { padding-right: 0; }
.aboutTeamRoles > div + div { border-left: 1px solid var(--brand-line); }
.aboutTeamRoles dt { font-size: 23px; font-family: "Yu Mincho", "Hiragino Mincho ProN", serif; font-weight: 600; }
.aboutTeamRoles dt small { display: block; margin-bottom: 7px; color: var(--muted); font-family: sans-serif; font-size: 12px; font-weight: 500; letter-spacing: .08em; }
.aboutTeamRoles dd { margin: 14px 0 0; font-size: 14px; color: var(--muted); line-height: 1.95; }
.aboutStaffAvailability { display: block; width: fit-content; margin-top: 14px; padding: 3px 9px; color: #705033; background: #fff; font-size: 11px; }
.aboutRefined .aboutTextLink { display: inline-flex; align-items: center; gap: 22px; min-height: 48px; margin-top: 22px; border-bottom: 1px solid #b39e89; color: var(--about-ink); font-size: 13px; font-weight: 700; text-decoration: none; }
.aboutTextLink > span { color: var(--about-accent); font-size: 20px; }
.aboutRefined .aboutTextLink:hover { color: var(--about-accent); border-color: currentColor; }

/* A small illustrated town conveys the three places and their roles. */
/* The network's illustration backings must match this white section. */
.aboutRefined .aboutNetwork { --about-paper: #fff; padding-top: 100px; padding-bottom: 100px; }
.aboutNetworkLayout { display: grid; grid-template-columns: .8fr 1.2fr; align-items: center; gap: 24px; }
.aboutTown { position: relative; isolation: isolate; width: 100%; min-height: 460px; aspect-ratio: 640 / 500; }
.aboutTownRoute { position: absolute; z-index: -1; left: 50%; top: 50%; width: 68%; height: auto; aspect-ratio: 1; transform: translate(-50%, -50%); fill: none; stroke: #bfb299; stroke-width: 1.8; stroke-dasharray: 3 7; stroke-linecap: round; }
/* Small opaque backings protect each building and label while leaving the circle visible. */
.aboutTown article { position: absolute; width: 42%; padding: 10px 4px; text-align: center; }
.aboutTown article > svg { position: relative; width: 112px; height: 94px; margin: 0 auto 3px; background: var(--about-paper); box-shadow: 0 0 0 8px var(--about-paper); fill: none; stroke: #827461; stroke-width: 1.65; stroke-linecap: round; stroke-linejoin: round; }
.aboutTownHome { top: 0; left: 29%; }
.aboutTownClinic { top: 50%; left: 0; }
.aboutTownDaycare { top: 50%; right: 0; }
.aboutTown article > div { position: relative; display: table; margin-inline: auto; padding: 8px 12px; background: var(--about-paper); }
.aboutTown p { margin: 0; color: var(--about-muted); font-size: 12px; }
.aboutTown p.aboutNetworkPlace { color: var(--about-accent); font-size: 11px; letter-spacing: .1em; }
.aboutTown h3 { margin: 2px 0 3px; font-size: 23px; }
.aboutTownCenter { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); color: var(--about-accent); font-size: 12px; letter-spacing: .09em; line-height: 1.8; text-align: center; }
.aboutTownCenter strong { font-family: "Yu Mincho", "Hiragino Mincho ProN", serif; font-size: 24px; font-weight: 500; }
.aboutTransport { display: grid; grid-template-columns: .85fr 1.15fr; gap: 44px; margin-top: 62px; padding: 32px 38px; border: 1px solid var(--about-line); border-radius: 6px; background: #fffcf7; }
.aboutTransportHeading { display: flex; align-items: center; gap: 22px; }
.aboutTransportHeading > svg { flex: 0 0 82px; width: 82px; height: 70px; fill: none; stroke: #827461; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.aboutTransportHeading .aboutEyebrow { margin-bottom: 9px; font-size: 11px; }
.aboutTransportHeading h3 { margin: 0; font-size: 25px; }
.aboutTransportCopy p { margin: 0; font-size: 13px; color: var(--about-muted); }
.aboutTransportCopy .aboutTransportCondition { margin-top: 12px; color: var(--about-ink); font-weight: 700; }
.aboutTransportCopy .aboutTransportNote { margin-top: 6px; font-size: 11px; }
.aboutTransportCopy .aboutTextLink { margin-top: 9px; }

/* A warm, unmistakable change of scene for the visit invitation. */
.aboutRefined .aboutVisitPrompt { position: relative; padding: 64px 0; border-radius: 100px 0 0 0; background: var(--closing-surface); color: var(--closing-ink); }
.aboutVisitPrompt > .aboutInner { position: relative; display: grid; grid-template-columns: .8fr 1.2fr; align-items: center; gap: 70px; max-width: 940px; }
.aboutVisitPrompt figure { padding: 10px; border: 1px solid var(--closing-line); border-radius: 50%; }
.aboutVisitPrompt figure img { width: 100%; height: auto; aspect-ratio: 1; object-fit: cover; object-position: 57% center; border-radius: 50%; }
.aboutVisitPrompt .aboutEyebrow { color: var(--closing-ink); font-size: 12px; }
.aboutVisitPrompt h2 { color: var(--closing-ink); font-size: clamp(32px, 3.6vw, 46px); }
.aboutVisitCopy > p:not(.aboutEyebrow) { margin: 16px 0 0; font-size: 13px; }
.aboutRefined .aboutPrimaryLink { display: flex; justify-content: space-between; align-items: center; gap: 32px; width: fit-content; min-width: 280px; min-height: 62px; margin-top: 27px; padding: 15px 25px; border: 1px solid var(--closing-line); border-radius: 3px; background: #fff; color: var(--closing-ink); font-size: 14px; font-weight: 700; text-decoration: none; transition: background .2s,color .2s; }
.aboutPrimaryLink > span { font-size: 24px; font-weight: 400; }
.aboutRefined .aboutPrimaryLink:hover { background: var(--brand-paper); }
.aboutVisitPrompt a:focus-visible { outline-color: var(--closing-ink); }
.aboutVisitSide { position: absolute; top: 0; right: -70px; margin: 0; writing-mode: vertical-rl; font-family: "Yu Mincho", "Hiragino Mincho ProN", serif; font-size: 13px; letter-spacing: .2em; }

@media (min-width: 1600px) {
  .aboutHeroStage { min-height: 570px; }
  .aboutHeroCopy { padding-top: 58px; }
}
@media (max-width: 1100px) {
  .aboutRefined .aboutInner { width: calc(100% - 64px); }
  .aboutHeroStage { min-height: 530px; }
  .aboutHeroCopy { padding-left: 0; padding-right: 32px; }
  .aboutHeroSketch { width: 200px; left: 8%; }
  .aboutPageNav { padding-inline: 0; gap: 25px; }
  .aboutPageNav a { font-size: 12px; gap: 9px; }
  .aboutStoryList { gap: 30px; }
  .aboutStoryCopy { padding-inline: 0; }
  .aboutStoryEnjoyment { padding-top: 62px; }
  .aboutTeamLead { grid-template-columns: .9fr 1.1fr; gap: 12px; }
  .aboutTeamRoles > div { padding-inline: 20px; }
  .aboutDesktopBreak { display: none; }
  .aboutNetworkLayout { grid-template-columns: .9fr 1.1fr; }
  .aboutTown article > svg { width: 92px; height: 80px; }
  .aboutTown h3 { font-size: 20px; }
  .aboutTown p { font-size: 10px; }
  .aboutTownCenter strong { font-size: 21px; }
  .aboutTransport { padding: 30px; gap: 26px; }
  .aboutTransportHeading { gap: 15px; }
  .aboutTransportHeading > svg { width: 66px; flex-basis: 66px; }
  .aboutTransportHeading h3 { font-size: 22px; }
  .aboutVisitPrompt > .aboutInner { width: min(850px, calc(100% - 96px)); gap: 55px; }
  .aboutVisitSide { right: -32px; }
}
@media (max-width: 800px) {
  .aboutRefined > section { padding-block: 70px; }
  .aboutHeroStage { min-height: 480px; }
  .aboutHeroPhoto { left: 25%; top: 35px; }
  .aboutHeroCopy { padding-top: 22px; padding-bottom: 24px; max-width: 70%; }
  .aboutRefined .aboutStoryHero h1 { font-size: 37px; }
  .aboutHeroDescription { font-size: 14px; }
  .aboutHeroSketch { width: 180px; left: 0; bottom: -5px; }
  .aboutLocationSeal { width: 108px; height: 108px; right: 12px; top: 15px; }
  .aboutLocationSeal strong { font-size: 20px; }
  .aboutLocationSeal span { font-size: 9px; }
  .aboutHeroPhoto figcaption { right: 15px; bottom: 26px; font-size: 10px; }
  .aboutStoryList { gap: 24px; }
  .aboutStoryCopy h3 { font-size: 22px; }
  .aboutStoryCopy > p:last-child { font-size: 13px; }
  .aboutStoryLabel > span { font-size: 28px; }
  .aboutStoryCopy .aboutStoryLabel { font-size: 10px; gap: 8px; }
  .aboutStoryTogether .aboutStoryVisual img { padding: 0; }
  .aboutRefined .aboutTeam { margin-inline: 16px; padding-top: 62px; border-radius: 80px 8px 80px 8px; }
  .aboutRefined .aboutTeam > .aboutInner { width: calc(100% - 48px); }
  .aboutTeamLead { grid-template-columns: 1fr 1fr; gap: 6px; }
  .aboutTeamLead h2 { font-size: 28px; }
  .aboutTeamScene figcaption { font-size: 10px; }
  .aboutTeamRoles { margin-top: 32px; }
  .aboutTeamRoles > div { padding-inline: 16px; }
  .aboutTeamRoles dt { font-size: 20px; }
  .aboutTeamRoles dd { font-size: 13px; }
  .aboutNetworkLayout { grid-template-columns: 1fr; gap: 12px; }
  .aboutNetworkLayout > header { text-align: center; }
  .aboutNetworkLayout > header .aboutEyebrow { justify-content: center; }
  .aboutNetworkLayout .aboutSectionDescription { margin-inline: auto; }
  .aboutTown { max-width: 580px; min-height: 500px; margin-inline: auto; }
  .aboutTown article > svg { width: 112px; height: 94px; }
  .aboutTown h3 { font-size: 23px; }
  .aboutTown p { font-size: 12px; }
  .aboutTransport { grid-template-columns: 1fr; gap: 22px; margin-top: 40px; }
  .aboutTransportHeading { align-items: center; }
  .aboutTransportHeading h3 br { display: none; }
  .aboutVisitPrompt > .aboutInner { grid-template-columns: .8fr 1.2fr; gap: 32px; }
  .aboutRefined .aboutPrimaryLink { min-width: 0; width: 100%; }
  .aboutVisitCopy > p:not(.aboutEyebrow) { max-width: 22em; }
}
@media (max-width: 600px) {
  .aboutRefined .aboutInner { width: calc(100% - 44px); }
  .aboutRefined h2 { font-size: clamp(27px, 7.3vw, 34px); }
  .aboutRefined .aboutEyebrow { margin-bottom: 16px; font-size: 11px; gap: 11px; }
  .aboutRefined .aboutSectionDescription { font-size: 14px; margin-top: 18px; }
  .aboutRefined .aboutStoryHero { padding-top: 32px; }
  .aboutHeroStage { min-height: 614px; }
  .aboutHeroCopy { padding: 6px 0 18px; max-width: none; background: transparent; }
  .aboutRefined .aboutStoryHero h1 { font-size: clamp(33px, 9vw, 46px); line-height: 1.6; }
  .aboutHeroDescription { margin-top: 14px; font-size: 14px; line-height: 1.9; }
  .aboutHeroPhoto { inset: 290px -22px 28px 26px; }
  .aboutHeroPhoto img { border-radius: 68px 0 0 8px; object-position: 56% 67%; }
  .aboutHeroPhoto figcaption { right: 12px; bottom: 14px; padding: 3px 8px; font-size: 9px; letter-spacing: .015em; }
  .aboutHeroSketch { width: 150px; bottom: -4px; left: -12px; }
  .aboutLocationSeal { top: 234px; right: -4px; width: 94px; height: 94px; z-index: 2; }
  .aboutLocationSeal span { font-size: 8px; }
  .aboutLocationSeal strong { font-size: 18px; }
  .aboutPageNav { grid-template-columns: 1fr; gap: 0; padding-top: 24px; }
  .aboutPageNav a { min-height: 54px; font-size: 13px; gap: 17px; }
  .aboutPageNav a > span { width: 26px; height: 26px; }
  .aboutRefined .aboutPrinciples { padding-top: 70px; padding-bottom: 70px; }
  .aboutPrinciplesHeading h2 { font-size: clamp(27px, 7.2vw, 35px); }
  .aboutPrinciplesHeading > p:last-child { margin-top: 18px; font-size: 13px; }
  .aboutStoryList { display: flex; flex-direction: column; gap: 48px; margin-top: 36px; }
  .aboutStory { width: 100%; max-width: 400px; }
  .aboutStoryEnjoyment { padding-top: 0; margin-left: auto; }
  .aboutStoryTogether { padding-top: 0; }
  .aboutStoryVisual { width: 86%; }
  .aboutStoryEnjoyment .aboutStoryVisual { margin-left: auto; }
  .aboutStoryTogether .aboutStoryVisual img { padding: 0; }
  .aboutStoryCopy { padding-top: 24px; padding-inline: 8px; max-width: 340px; }
  .aboutStoryEnjoyment .aboutStoryCopy { padding-left: 26px; margin-left: auto; }
  .aboutStoryCopy h3 { font-size: 28px; }
  .aboutStoryCopy .aboutStoryLabel { font-size: 11px; gap: 12px; }
  .aboutStoryLabel > span { font-size: 32px; }
  .aboutStoryCopy > p:last-child { font-size: 14px; margin-top: 14px; }
  .aboutRefined .aboutTeam { margin-inline: 10px; padding: 54px 0 46px; border-radius: 65px 6px 65px 6px; }
  .aboutRefined .aboutTeam > .aboutInner { width: calc(100% - 40px); }
  .aboutTeamLead { grid-template-columns: 1fr; gap: 34px; }
  .aboutTeamLead h2 { font-size: clamp(27px, 7.2vw, 34px); }
  .aboutTeamScene { width: 86%; max-width: 400px; margin-inline: auto; }
  .aboutTeamScene figcaption { font-size: 10px; margin-top: 12px; }
  .aboutTeamRoles { grid-template-columns: 1fr; margin-top: 28px; padding: 0; }
  .aboutTeamRoles > div { display: grid; grid-template-columns: 110px 1fr; gap: 17px; padding: 23px 0; }
  .aboutTeamRoles > div + div { border-left: 0; border-top: 1px solid var(--brand-line); }
  .aboutTeamRoles > div:last-child { padding-bottom: 0; }
  .aboutTeamRoles dt { font-size: 19px; }
  .aboutTeamRoles dt small { font-size: 10px; letter-spacing: 0; }
  .aboutTeamRoles dd { margin: 0; font-size: 13px; }
  .aboutStaffAvailability { margin-top: 10px; padding: 3px 6px; font-size: 10px; }
  .aboutRefined .aboutTextLink { margin-top: 16px; font-size: 12px; gap: 18px; }
  .aboutRefined .aboutNetwork { padding-top: 68px; padding-bottom: 60px; }
  .aboutNetworkLayout { gap: 28px; }
  .aboutNetworkLayout > header { text-align: left; }
  .aboutNetworkLayout > header .aboutEyebrow { justify-content: flex-start; }
  .aboutNetworkLayout .aboutSectionDescription { margin-left: 0; }
  .aboutTown { aspect-ratio: auto; min-height: 0; height: 440px; }
  .aboutTown article { width: 49%; }
  .aboutTown article > svg { width: 92px; height: 78px; }
  .aboutTownHome { left: 25.5%; }
  .aboutTownClinic { left: -3%; top: 56%; }
  .aboutTownDaycare { right: -3%; top: 56%; }
  .aboutTown h3 { font-size: 19px; }
  .aboutTown p { font-size: 10px; }
  .aboutTown p.aboutNetworkPlace { font-size: 10px; }
  .aboutTown article > div { padding-inline: 3px; }
  .aboutTownCenter { font-size: 10px; }
  .aboutTownCenter strong { font-size: 19px; }
  .aboutTownRoute { width: 88%; }
  .aboutTransport { margin-top: 20px; padding: 24px 20px; gap: 18px; }
  .aboutTransportHeading { gap: 14px; }
  .aboutTransportHeading > svg { width: 61px; flex-basis: 61px; }
  .aboutTransportHeading h3 { font-size: 21px; }
  .aboutTransportHeading h3 br { display: initial; }
  .aboutTransportHeading .aboutEyebrow { margin-bottom: 7px; }
  .aboutTransportCopy p { font-size: 13px; }
  .aboutRefined .aboutVisitPrompt { padding-top: 44px; padding-bottom: 48px; border-top-left-radius: 70px; }
  .aboutVisitPrompt > .aboutInner { display: flex; flex-direction: column; align-items: flex-start; gap: 28px; width: calc(100% - 56px); }
  .aboutVisitPrompt figure { width: 61%; margin-left: 10px; padding: 7px; }
  .aboutVisitCopy { width: 100%; }
  .aboutVisitPrompt h2 { font-size: 36px; }
  .aboutVisitPrompt .aboutEyebrow { font-size: 11px; }
  .aboutVisitCopy > p:not(.aboutEyebrow) { font-size: 12px; }
  .aboutRefined .aboutPrimaryLink { margin-top: 23px; min-height: 60px; padding-inline: 21px; font-size: 13px; }
  .aboutVisitSide { top: 5px; right: 14px; font-size: 12px; }
}
@media (max-width: 360px) {
  .aboutHeroStage { min-height: 590px; }
  .aboutHeroPhoto { top: 278px; }
  .aboutLocationSeal { top: 230px; }
  .aboutHeroSketch { width: 132px; }
  .aboutStoryCopy h3 { font-size: 25px; }
  .aboutTeamRoles > div { grid-template-columns: 1fr; gap: 10px; }
  .aboutTeamRoles dt small { display: inline; margin-right: 12px; }
  .aboutTeamRoles dt { display: flex; flex-direction: column; gap: 5px; }
  .aboutTown h3 { font-size: 17px; }
  .aboutTown p { font-size: 9px; }
}
@media (prefers-reduced-motion: reduce) {
  .aboutRefined *, .aboutRefined *::before, .aboutRefined *::after { scroll-behavior: auto; transition: none; }
}
