/* Readable type, consistent surfaces and clear actions across Anton's public site. */
:root {
  --reading-copy: #414d69;
  --surface-blue: #f3f6fc;
  --surface-pink: #fff7fb;
  --refined-border: #dce3f0;
  --card-radius: 14px;
  --pink-text: #b92863;
}

body { font-size: 19px; line-height: 1.72; }
.wrap { max-width: 1320px; }
.section { padding-top: 112px; padding-bottom: 112px; }
h2 { font-size: clamp(40px, 4.25vw, 58px); font-weight: 700; letter-spacing: -.048em; line-height: 1.1; }
h3 { font-weight: 700; }
.section-label, .eyebrow { font-size: 14px; letter-spacing: .095em; line-height: 1.5; }
.section-label { gap: 15px; margin-bottom: 23px; }
.section-label > span { font-weight: 700; }
.section-label > span, .route-number, .panel-label { color: var(--pink-text); }
.button { min-height: 50px; padding: 15px 24px; border-radius: 8px; font-size: 16px; font-weight: 700; }
.text-link { font-size: 16px; font-weight: 700; min-height: 44px; gap: 14px; }
.outline { border-color: #9eaed1; }
.button:hover { transform: translateY(-1px); }

/* Keep the header compact while making every destination easy to read. */
.topline { font-size: 14px; letter-spacing: .015em; }
.topline .wrap { padding-top: 9px; padding-bottom: 9px; gap: 20px; }
.topline a { font-weight: 600; }
.site-header { border-color: var(--refined-border); box-shadow: 0 3px 18px #16275305; }
.nav-wrap { height: 92px; gap: 24px; }
.wordmark { font-size: 33px; }
#main-nav { font-size: 16px; gap: 27px; }
#main-nav > a { font-weight: 700; }
.nav-contact { min-height: 48px; padding: 12px 18px; border-radius: 8px; }
.menu-toggle { width: 48px; height: 48px; border-radius: 8px; }

.hero { padding-top: 66px; min-height: 748px; }
.hero-copy { padding-top: 10px; }
.hero-slogan { font-size: 27px; font-weight: 700; line-height: 1.32; margin-top: 32px; }
.hero-slogan > span { font-size: 21px; font-weight: 600; }
.hero-intro { font-size: 20px; color: var(--reading-copy); line-height: 1.65; max-width: 520px; margin-top: 23px; margin-bottom: 29px; }
.hero-footnote { font-size: 14px; letter-spacing: .01em; line-height: 1.55; margin-top: 31px; }
.hero-footnote b { font-size: 15px; font-weight: 700; }
.portrait { height: 653px; }
.portrait img { mix-blend-mode: normal; }
.portrait-name { border-radius: 9px; padding: 16px 25px; box-shadow: 0 12px 32px #15275b26; }
.portrait-name span { font-size: 12px; letter-spacing: .1em; }
.portrait-name strong { font-size: 20px; font-weight: 700; }
.portrait-caption { font-size: 11px; }

/* First choices have the same hierarchy as the contact and story cards. */
.visitor-routes { border-radius: var(--card-radius); border-color: var(--refined-border); box-shadow: 0 10px 30px #16275306; }
.visitor-routes > a { padding: 28px 27px; gap: 18px; min-height: 142px; border-color: var(--refined-border); }
.visitor-routes > a:hover { background: var(--surface-blue); }
.visitor-routes strong { font-size: 19px; line-height: 1.3; font-weight: 700; }
.visitor-routes div > span { font-size: 16px; line-height: 1.5; margin-top: 8px; color: var(--reading-copy); }
.route-number { font-size: 14px; font-weight: 700; margin-top: 4px; }
.route-arrow { font-size: 25px; }

.about-section { gap: 86px; }
.about-copy p { font-size: 18px; color: var(--reading-copy); line-height: 1.75; }
.about-copy .large-copy { font-size: 23px; line-height: 1.55; font-weight: 600; }
.about-copy h2 { margin-bottom: 31px; }
.profile-panel { background: var(--surface-blue); border-color: var(--refined-border); border-radius: var(--card-radius); padding: 34px; }
.profile-photo { height: 260px; border-radius: 8px; margin-bottom: 25px; }
.profile-heading { font-size: 14px; letter-spacing: .085em; padding-bottom: 21px; }
.roles > div { padding: 24px 0; gap: 24px; grid-template-columns: 1fr 1.2fr; border-color: #d8e0ed; }
.roles > div:last-child { padding-bottom: 0; border-bottom: 0; }
.roles dt { font-size: 18px; font-weight: 700; line-height: 1.45; }
.roles dd { font-size: 16px; line-height: 1.6; color: var(--reading-copy); }

.journey-section { gap: 80px; padding-bottom: 112px; }
.journey-section h2 { font-size: 43px; }
.journey-list li { padding-bottom: 33px; }
.journey-list time { font-size: 16px; padding-top: 3px; }
.journey-list h3 { font-size: 24px; line-height: 1.25; font-weight: 700; margin-bottom: 10px; }
.journey-list p { font-size: 18px; line-height: 1.7; color: var(--reading-copy); margin-bottom: 7px; }
.journey-list a { font-size: 15px; min-height: 44px; display: inline-flex; align-items: center; font-weight: 700; }
.journey-list li::before { border-color: #d8deee; }
.journey-list li::after { top: 8px; width: 10px; height: 10px; }

.work-section { background: var(--surface-pink); border-color: #f1e4ec; }
.section-heading { gap: 50px; margin-bottom: 47px; }
.section-heading > p { font-size: 18px; max-width: 330px; color: var(--reading-copy); line-height: 1.65; }
.work-list { border-top: 0; display: grid; gap: 16px; }
.work-item { grid-template-columns: 44px 132px 1fr 48px; gap: 27px; padding: 27px 29px; border: 1px solid #e6dfe9; border-radius: var(--card-radius); background: white; transition: border-color .2s, box-shadow .2s; }
.work-item:hover { padding-left: 29px; border-color: #a8b7d7; box-shadow: 0 8px 24px #17285308; }
.work-number { font-size: 15px; font-weight: 700; padding-top: 5px; }
.work-thumb { width: 132px; height: 112px; border-radius: 8px; }
.work-item h3 { font-size: 29px; font-weight: 700; line-height: 1.22; margin-bottom: 10px; }
.work-item p { font-size: 18px; line-height: 1.65; color: var(--reading-copy); max-width: 730px; }
.round-arrow { width: 48px; height: 48px; border-color: #c8d2e6; }

.field-gallery { padding-bottom: 24px; }
.gallery-grid { grid-template-rows: repeat(2, 285px); gap: 22px; }
.gallery-card { background: var(--surface-blue); border-color: var(--refined-border); border-radius: var(--card-radius); }
.gallery-card figcaption { padding: 17px 20px; gap: 15px; }
.gallery-card figcaption strong { font-size: 17px; font-weight: 700; line-height: 1.4; }
.gallery-card figcaption > span { font-size: 14px; color: var(--reading-copy); line-height: 1.45; }
.gallery-tall figcaption { gap: 5px; }
.gallery-frame > span { width: 40px; height: 40px; top: 15px; right: 15px; }

.featured-update { border-color: var(--refined-border); border-radius: var(--card-radius); background: var(--surface-blue); margin-bottom: 39px; }
.featured-content { padding: 43px 44px; }
.featured-content h3 { font-size: 39px; line-height: 1.16; font-weight: 700; margin-top: 19px; }
.featured-content p { font-size: 18px; color: var(--reading-copy); line-height: 1.72; }
.featured-tag { font-size: 14px; letter-spacing: .06em; padding: 9px 14px; border-radius: 5px; }
.article-meta { font-size: 14px; letter-spacing: .025em; gap: 12px; line-height: 1.55; }
.article-meta > span { font-weight: 700; }
.article-meta time { color: var(--reading-copy); font-weight: 600; }
.news-search-row { padding-top: 29px; margin-bottom: 24px; }
.news-search-row > label { font-size: 17px; font-weight: 700; }
.news-search-input input { font-size: 17px; border-radius: 8px; min-height: 52px; padding: 13px 16px; }
#news-reset { font-size: 15px; font-weight: 700; border-radius: 8px; min-height: 50px; padding: 12px 17px; }
.filter { font-size: 15px; font-weight: 700; padding: 10px 18px; min-height: 46px; }
#results-count { font-size: 14px; line-height: 1.5; }
.news-grid { gap: 28px; }
.news-card { padding: 0 0 24px; border: 1px solid var(--refined-border); border-radius: var(--card-radius); background: white; overflow: hidden; }
.news-image-button { border-radius: 0; margin-bottom: 22px; }
.news-card > .article-meta, .news-card > h3, .news-card > p, .news-card > .text-link { margin-left: 23px; margin-right: 23px; }
.news-card .article-meta { margin-bottom: 14px; font-size: 14px; }
.news-card h3 { font-size: 25px; line-height: 1.28; font-weight: 700; margin-bottom: 14px; }
.news-card p { font-size: 17px; line-height: 1.7; color: var(--reading-copy); margin-bottom: 14px; }
.news-card .text-link { font-size: 16px; min-height: 44px; }
.news-image-button .date-tile { font-size: 14px; font-weight: 700; padding: 8px 12px; border-radius: 4px; }
.news-art small { font-size: 14px; }
.updates-note { font-size: 15px; line-height: 1.7; max-width: 800px; }
.news-empty { font-size: 18px; border-radius: var(--card-radius); }
.no-script-news { font-size: 17px; }

/* The music section uses the same card rhythm on a deeper blue surface. */
.music-section { background: #162753; }
.music-intro { gap: 72px; margin-bottom: 45px; }
.music-intro p { font-size: 19px; line-height: 1.75; max-width: 630px; color: #dce3f4; }
.music-portrait { border-radius: var(--card-radius); border: 1px solid #ffffff2b; }
.music-portrait figcaption { font-size: 14px; letter-spacing: .065em; padding: 17px 20px; color: var(--navy); font-weight: 700; }
.streaming-links { gap: 10px; }
.streaming-links a { font-size: 15px; font-weight: 700; border-color: #ffffff65; border-radius: 8px; min-height: 48px; padding: 11px 15px; }
.music-grid { gap: 25px; }
.music-card { border-color: #ffffff36; border-radius: var(--card-radius); background: #233661; }
.music-card-copy { padding: 26px 25px 25px; }
.music-type { font-size: 14px; line-height: 1.6; color: #dbe3f7; letter-spacing: .045em; font-weight: 600; }
.video-label { font-size: 14px; line-height: 1.5; left: 20px; bottom: 16px; letter-spacing: .06em; font-weight: 700; }
.music-card h3 { font-size: 43px; margin: 13px 0 15px; }
.music-card p { font-size: 17px; line-height: 1.7; color: #dce3f4; min-height: 57px; margin-bottom: 13px; }
.music-card-copy a { font-size: 16px; font-weight: 700; min-height: 44px; color: #ffc3de; }
.play-circle { width: 60px; height: 60px; }
.covers-heading { margin-top: 51px; margin-bottom: 25px; }
.covers-heading h3 { font-size: 28px; font-weight: 700; }
.covers-heading p { font-size: 16px; color: #dce3f4; }
.cover-grid { gap: 25px; }
.cover-card { padding: 13px; border: 1px solid #ffffff32; border-radius: var(--card-radius); background: #1b2e58; }
.cover-preview { border-radius: 8px; }
.cover-card > div:last-child { padding: 16px 5px 7px; gap: 12px; }
.cover-card h4 { font-size: 18px; font-weight: 700; line-height: 1.4; }
.cover-card > div:last-child > span { font-size: 14px; color: #ffc3de; font-weight: 600; }
.cover-card .play-circle { width: 51px; height: 51px; }

.community-band .wrap { padding-top: 77px; padding-bottom: 77px; }
.community-band .section-label { font-size: 14px; }
.community-band p { font-size: 21px; line-height: 1.65; }
.community-band .button { font-size: 16px; }
.contact-section { gap: 80px; align-items: start; padding-bottom: 70px; }
.contact-intro { font-size: 19px; line-height: 1.7; color: var(--reading-copy); max-width: 630px; }
.contact-intents { margin-bottom: 31px; }
.contact-intents > a { padding: 22px 0; }
.contact-intents strong { font-size: 20px; font-weight: 700; }
.contact-intents div > span { font-size: 17px; color: var(--reading-copy); line-height: 1.6; margin-top: 6px; }
.contact-section .button { font-size: 16px; }
.email-line { font-size: 16px; line-height: 1.6; gap: 13px; }
.email-line > span { overflow-wrap: anywhere; }
.email-line button { font-size: 14px; min-height: 44px; padding: 9px 14px; font-weight: 700; border-radius: 7px; }
.copy-status { font-size: 14px; min-height: 23px; }
.contact-panel { margin-top: 10px; padding: 34px; border-color: var(--refined-border); border-radius: var(--card-radius); background: var(--surface-blue); }
.panel-label { font-size: 14px; font-weight: 700; letter-spacing: .085em; }
.contact-panel h3 { font-size: 32px; line-height: 1.25; font-weight: 700; margin-top: 15px; }
.contact-panel dl > div { margin-top: 28px; }
.contact-panel dt { font-size: 15px; font-weight: 600; margin-bottom: 10px; color: var(--reading-copy); }
.contact-panel dd { font-size: 18px; line-height: 1.65; }
.contact-panel dd a { font-size: 17px; font-weight: 700; }
.faq-section { gap: 65px; padding-bottom: 112px; }
.faq-section > h3 { font-size: 27px; font-weight: 700; }
.faq-list summary { font-size: 18px; font-weight: 700; padding: 23px 0; }
.faq-list summary span { font-size: 24px; }
.faq-list details p { font-size: 17px; color: var(--reading-copy); line-height: 1.75; margin-bottom: 24px; }
.footer-top { padding-top: 56px; padding-bottom: 49px; }
.footer-top p { font-size: 16px; }
.footer-top > div { gap: 24px; font-size: 16px; font-weight: 600; }
.footer-top button { font-size: 16px; font-weight: 600; min-height: 44px; }
.footer-top > div > a { min-height: 44px; display: inline-flex; align-items: center; }
.footer-bottom { font-size: 12px; gap: 25px; }
.footer-bottom p:nth-child(2) { max-width: 500px; }

/* Source footnotes keep their existing discreet size. Dialog reading copy grows. */
#story-dialog { width: min(770px, calc(100% - 32px)); border-radius: var(--card-radius); }
.dialog-inner { padding: 57px 43px 36px; }
.dialog-close, .video-close, .photo-close { width: 44px; height: 44px; }
#story-dialog h2 { font-size: 39px; line-height: 1.18; }
#story-body p { font-size: 18px; line-height: 1.8; color: var(--reading-copy); }
.story-actions .button { font-size: 15px; min-height: 48px; }
.dialog-note { font-size: 12px; line-height: 1.7; }
.video-dialog-inner h2 { font-size: 31px; font-weight: 700; }
.video-dialog-inner .text-link { font-size: 16px; min-height: 44px; }
.photo-dialog-inner h2 { font-size: 29px; font-weight: 700; }
.photo-dialog-inner .text-link { font-size: 16px; min-height: 44px; }

@media (min-width: 1550px) {
  .hero { min-height: 790px; }
  .portrait { height: 695px; }
}

@media (max-width: 1100px) {
  .section { padding-top: 94px; padding-bottom: 94px; }
  #main-nav { font-size: 15px; gap: 20px; }
  .nav-contact { padding-left: 16px; padding-right: 16px; }
  .nav-contact span { padding-left: 9px; }
  .hero { min-height: 704px; padding-top: 49px; }
  .portrait { height: 604px; }
  .hero-slogan { font-size: 25px; }
  .hero-intro { font-size: 19px; }
  .visitor-routes > a { padding: 25px 19px; gap: 13px; min-height: 158px; }
  .visitor-routes strong { font-size: 18px; }
  .visitor-routes div > span { font-size: 15px; }
  .route-number { display: none; }
  .about-section { gap: 50px; }
  .profile-panel { padding: 28px; }
  .profile-photo { height: 230px; }
  .roles > div { gap: 18px; }
  .roles dt { font-size: 17px; }
  .roles dd { font-size: 15px; }
  .journey-section { gap: 45px; padding-bottom: 94px; }
  .journey-section h2 { font-size: 39px; }
  .work-item { grid-template-columns: 32px 112px 1fr 44px; gap: 21px; padding: 25px; }
  .work-item:hover { padding-left: 25px; }
  .work-thumb { width: 112px; height: 108px; }
  .work-item h3 { font-size: 26px; }
  .work-item p { font-size: 17px; }
  .gallery-grid { grid-template-rows: repeat(2, 270px); gap: 18px; }
  .gallery-card figcaption { padding: 15px 18px; align-items: flex-start; gap: 5px; }
  .gallery-card figcaption strong { font-size: 16px; }
  .featured-content { padding: 35px; }
  .featured-content h3 { font-size: 35px; }
  .news-card > .article-meta, .news-card > h3, .news-card > p, .news-card > .text-link { margin-left: 20px; margin-right: 20px; }
  .news-card h3 { font-size: 24px; }
  .music-intro { gap: 42px; }
  .music-intro p { font-size: 18px; }
  .music-card-copy { padding: 24px 21px; }
  .music-card h3 { font-size: 39px; }
  .music-type { font-size: 13px; }
  .cover-card > div:last-child { flex-direction: column; align-items: flex-start; gap: 7px; }
  .contact-section { gap: 46px; }
  .contact-panel { padding: 29px; }
  .faq-section { padding-bottom: 94px; }
}

@media (max-width: 820px) {
  .section { padding-top: 80px; padding-bottom: 80px; }
  .nav-wrap { height: 80px; }
  #main-nav { top: 80px; gap: 0; font-size: 17px; padding: 15px 22px 23px; }
  #main-nav > a { font-size: 17px; min-height: 49px; padding: 13px 10px; }
  #main-nav .nav-contact { margin-top: 10px; text-align: center; }
  .hero { min-height: 640px; padding-top: 42px; gap: 8px; }
  .hero .button-row { gap: 12px; }
  .hero .text-link { font-size: 16px; }
  .hero-intro { font-size: 18px; }
  .hero-slogan { font-size: 23px; }
  .hero-slogan > span { font-size: 19px; }
  .portrait { height: 535px; }
  .portrait-name { padding: 13px 18px; left: 3%; }
  .portrait-name strong { font-size: 17px; }
  .portrait-caption { font-size: 10px; }
  .visitor-routes { grid-template-columns: 1fr; }
  .visitor-routes > a { min-height: 103px; padding: 22px 26px; border-right: 0; border-bottom: 1px solid var(--refined-border); gap: 19px; }
  .visitor-routes > a:last-child { border-bottom: 0; }
  .visitor-routes strong { font-size: 19px; }
  .visitor-routes div > span { font-size: 16px; margin-top: 5px; }
  .route-number { display: inline; font-size: 14px; }
  .route-arrow { font-size: 25px; }
  .about-section { gap: 38px; }
  .profile-photo { height: 270px; }
  .profile-panel { padding: 32px; }
  .roles dt { font-size: 18px; }
  .roles dd { font-size: 16px; }
  .journey-section { gap: 31px; padding-bottom: 80px; }
  .journey-section h2 { font-size: 42px; }
  .section-heading { flex-direction: column; align-items: flex-start; gap: 22px; }
  .section-heading > p { padding-top: 0; max-width: 540px; font-size: 18px; }
  .work-item { grid-template-columns: 106px 1fr 42px; gap: 21px; padding: 24px; }
  .work-item:hover { padding-left: 24px; }
  .work-number { display: none; }
  .work-thumb { width: 106px; height: 113px; }
  .work-item h3 { font-size: 25px; }
  .work-item p { font-size: 17px; }
  .gallery-grid { grid-template-rows: repeat(3, 265px); gap: 18px; }
  .gallery-card figcaption strong { font-size: 17px; }
  .featured-update { grid-template-columns: 1fr; }
  .featured-art { min-height: 0; aspect-ratio: 16 / 10; }
  .featured-content { padding: 31px; }
  .featured-content h3 { font-size: 36px; }
  .featured-content p { font-size: 18px; }
  .news-search-row { gap: 20px; }
  .news-search-row > label { font-size: 16px; }
  .news-grid { gap: 24px; }
  .article-meta, .news-card .article-meta { font-size: 14px; }
  .news-card p { font-size: 17px; }
  .news-image-button .date-tile { font-size: 14px; }
  .music-intro { grid-template-columns: 1fr; gap: 31px; }
  .music-intro h2 { font-size: 44px; }
  .music-intro p { font-size: 19px; }
  .music-portrait { max-width: 620px; }
  .music-portrait figcaption { font-size: 14px; }
  .streaming-links a { font-size: 15px; }
  .music-grid { grid-template-columns: 1fr; gap: 27px; }
  .music-card-copy { padding: 25px 28px; }
  .music-card h3 { font-size: 44px; }
  .music-card p { font-size: 18px; min-height: 0; }
  .music-type, .video-label { font-size: 14px; }
  .music-card-copy a { font-size: 16px; }
  .play-circle { width: 62px; height: 62px; font-size: 20px; }
  .covers-heading { flex-direction: column; align-items: flex-start; gap: 10px; }
  .cover-grid { grid-template-columns: 1fr; gap: 23px; }
  .cover-card > div:last-child { flex-direction: row; flex-wrap: wrap; align-items: center; gap: 13px; }
  .cover-card h4 { font-size: 19px; }
  .cover-card > div:last-child > span { font-size: 15px; }
  .community-band .wrap { gap: 34px; }
  .community-band p { font-size: 19px; }
  .contact-section { gap: 31px; padding-bottom: 56px; }
  .contact-panel { margin-top: 0; padding: 31px; }
  .faq-section { gap: 24px; padding-bottom: 80px; padding-top: 0; }
  .footer-top > div { gap: 20px; }
  .footer-bottom { gap: 15px; }
}

@media (max-width: 600px) {
  body { font-size: 18px; line-height: 1.72; }
  .wrap { width: calc(100% - 36px); }
  .section { padding-top: 69px; padding-bottom: 69px; }
  h2 { font-size: clamp(36px, 9.8vw, 44px); line-height: 1.13; letter-spacing: -.045em; }
  .section-label, .eyebrow { font-size: 14px; letter-spacing: .06em; }
  .topline .wrap { flex-direction: column; align-items: flex-start; gap: 1px; padding-top: 8px; padding-bottom: 8px; font-size: 12px; }
  .topline a { font-size: 12px; }
  .nav-wrap { height: 76px; }
  .wordmark { font-size: 31px; }
  #main-nav { top: 76px; padding-left: 18px; padding-right: 18px; }
  #main-nav > a { font-size: 17px; }
  .hero { padding-top: 36px; padding-bottom: 22px; min-height: 0; gap: 0; }
  .hero .eyebrow { margin-bottom: 26px; }
  .hero-slogan { font-size: 26px; margin-top: 27px; }
  .hero-slogan > span { font-size: 20px; }
  .hero-intro { font-size: 19px; margin-top: 23px; margin-bottom: 24px; line-height: 1.65; }
  .hero .button-row { flex-direction: row; gap: 13px 22px; align-items: center; }
  .hero .button { font-size: 16px; padding: 14px 20px; gap: 16px; }
  .hero .text-link { font-size: 16px; gap: 12px; }
  .hero-footnote { font-size: 14px; margin-top: 25px; }
  .hero-footnote b { font-size: 15px; }
  .portrait { height: 415px; margin-top: 22px; }
  .portrait-name { left: 8%; padding: 13px 19px; bottom: 29px; }
  .portrait-name strong { font-size: 18px; }
  .portrait-name span { font-size: 12px; }
  .portrait-caption { font-size: 10px; letter-spacing: .08em; }
  .visitor-routes { margin-top: 18px; }
  .visitor-routes > a { padding: 23px 21px; gap: 16px; min-height: 109px; }
  .visitor-routes strong { font-size: 18px; }
  .visitor-routes div > span { font-size: 15px; }
  .route-number { display: none; }
  .route-arrow { font-size: 24px; }
  .about-copy .large-copy { font-size: 21px; line-height: 1.55; }
  .about-copy p { font-size: 18px; }
  .profile-panel { padding: 24px; }
  .profile-photo { height: 225px; margin-bottom: 23px; }
  .profile-heading { font-size: 14px; }
  .roles > div { grid-template-columns: 1fr; gap: 8px; padding: 22px 0; }
  .roles dt { font-size: 18px; }
  .roles dd { font-size: 16px; }
  .journey-section { padding-bottom: 69px; gap: 30px; }
  .journey-section h2 { font-size: 36px; }
  .journey-list li { grid-template-columns: 48px 1fr; gap: 26px; padding-bottom: 29px; }
  .journey-list li::before { left: 58px; top: 9px; }
  .journey-list li::after { left: 54px; top: 9px; }
  .journey-list time { font-size: 15px; }
  .journey-list h3 { font-size: 22px; line-height: 1.3; }
  .journey-list p { font-size: 17px; }
  .journey-list a { font-size: 15px; }
  .section-heading { gap: 20px; margin-bottom: 30px; }
  .section-heading > p { font-size: 17px; }
  .work-list { gap: 16px; }
  .work-item { grid-template-columns: 80px minmax(0,1fr); gap: 14px 17px; padding: 22px 18px; align-items: start; }
  .work-item:hover { padding-left: 18px; }
  .work-thumb { grid-column: 1; grid-row: 1 / span 2; width: 80px; height: 112px; }
  .work-item > div { grid-column: 2; grid-row: 1; min-width: 0; }
  .work-item h3 { font-size: 22px; line-height: 1.28; margin-bottom: 10px; }
  .work-item p { font-size: 16px; line-height: 1.68; }
  .round-arrow { grid-column: 2; grid-row: 2; width: 42px; height: 42px; font-size: 23px; }
  .field-gallery { padding-bottom: 18px; }
  .gallery-grid { grid-template-rows: auto; gap: 15px; }
  .gallery-frame { height: 175px; }
  .gallery-tall .gallery-frame { height: 320px; }
  .gallery-wide .gallery-frame { height: 220px; }
  .gallery-card figcaption { padding: 14px; gap: 6px; min-height: 86px; }
  .gallery-card figcaption strong { font-size: 16px; }
  .gallery-card figcaption > span { font-size: 14px; white-space: normal; }
  .gallery-tall figcaption, .gallery-wide figcaption { min-height: 0; padding: 17px 18px; }
  .gallery-frame > span { width: 38px; height: 38px; right: 12px; top: 12px; }
  .featured-content { padding: 27px 24px; }
  .featured-content h3 { font-size: 33px; }
  .featured-content p { font-size: 17px; }
  .featured-content .article-meta { font-size: 14px; }
  .featured-tag { font-size: 14px; top: 17px; left: 17px; }
  .news-search-row { gap: 11px; padding-top: 22px; }
  .news-search-row > label { font-size: 17px; }
  .news-search-input { gap: 9px; }
  .news-search-input input { font-size: 16px; padding: 12px 13px; }
  #news-reset { font-size: 15px; padding: 12px; }
  .filter { font-size: 15px; min-height: 47px; padding: 10px 12px; }
  .feed-tools { gap: 15px; }
  #results-count { font-size: 14px; }
  .news-grid { gap: 25px; }
  .news-card { padding-bottom: 22px; }
  .news-card > .article-meta, .news-card > h3, .news-card > p, .news-card > .text-link { margin-left: 22px; margin-right: 22px; }
  .news-card h3 { font-size: 25px; }
  .news-card p { font-size: 17px; }
  .article-meta, .news-card .article-meta { font-size: 14px; }
  .news-image-button .date-tile { font-size: 14px; }
  .news-card .text-link { font-size: 16px; }
  .updates-note { font-size: 15px; }
  .music-intro h2 { font-size: 37px; }
  .music-intro p { font-size: 18px; }
  .music-portrait figcaption { font-size: 14px; letter-spacing: .045em; padding: 15px 17px; }
  .streaming-links { gap: 10px; }
  .streaming-links a { font-size: 15px; padding: 11px 13px; }
  .music-card-copy { padding: 25px 24px; }
  .music-card h3 { font-size: 43px; }
  .music-card p { font-size: 17px; }
  .music-type { font-size: 14px; letter-spacing: .035em; }
  .video-label { font-size: 14px; }
  .music-card-copy a { font-size: 16px; }
  .covers-heading h3 { font-size: 27px; }
  .covers-heading p { font-size: 16px; }
  .cover-card { padding: 12px; }
  .cover-card h4 { font-size: 18px; }
  .cover-card > div:last-child > span { font-size: 14px; }
  .community-band .wrap { grid-template-columns: 1fr; padding-top: 62px; padding-bottom: 63px; gap: 29px; }
  .community-band .section-label { font-size: 14px; }
  .community-band p { font-size: 19px; }
  .community-band .button { font-size: 16px; padding: 14px 18px; }
  .contact-section { padding-bottom: 43px; gap: 27px; }
  .contact-intro { font-size: 18px; margin-top: 24px; }
  .contact-intents strong { font-size: 19px; }
  .contact-intents div > span { font-size: 16px; }
  .contact-section .button-row { gap: 12px; }
  .contact-section .button { font-size: 15px; padding: 14px 18px; gap: 15px; }
  .email-line { font-size: 16px; gap: 11px; }
  .email-line button { font-size: 14px; }
  .contact-panel { padding: 26px; }
  .contact-panel dd { font-size: 18px; }
  .contact-panel dd a { font-size: 17px; }
  .faq-section { padding-bottom: 69px; }
  .faq-section > h3 { font-size: 25px; }
  .faq-list summary { font-size: 17px; line-height: 1.55; padding: 21px 0; }
  .faq-list details p { font-size: 17px; margin-right: 0; }
  .footer-top { padding-top: 45px; padding-bottom: 34px; gap: 28px; }
  .footer-top p { font-size: 16px; }
  .footer-top > div { font-size: 16px; gap: 10px 23px; }
  .footer-top button { font-size: 16px; }
  .footer-bottom { font-size: 11px; gap: 12px; }
  .footer-bottom p:nth-child(2) { max-width: 290px; }
  .dialog-inner { padding: 60px 25px 31px; }
  #story-dialog h2 { font-size: 31px; }
  #story-body p { font-size: 18px; line-height: 1.8; }
  .story-actions .button { font-size: 15px; padding: 13px 16px; }
  .dialog-note { font-size: 12px; }
  .video-dialog-inner { padding: 30px 17px 24px; }
  .video-dialog-inner h2 { font-size: 27px; margin-top: 25px; }
  .video-dialog-inner .music-type { font-size: 14px; padding-right: 28px; display: block; }
  .video-dialog-inner .text-link { font-size: 15px; }
  .photo-dialog-inner { padding: 30px 17px 23px; }
  .photo-dialog-inner h2 { font-size: 25px; }
  .photo-dialog-inner .text-link { font-size: 15px; }
}

@media (max-width: 360px) {
  .hero h1 { font-size: 106px; }
  .hero .text-link { font-size: 16px; }
  .work-item { grid-template-columns: 70px minmax(0,1fr); gap: 14px; padding: 21px 17px; }
  .work-item:hover { padding-left: 17px; }
  .work-thumb { width: 70px; height: 105px; }
  .work-item h3 { font-size: 21px; }
  .gallery-card figcaption { padding: 13px 12px; }
  .gallery-card figcaption strong { font-size: 15px; }
  .roles dt { font-size: 18px; }
  .roles dd { font-size: 16px; }
}

@media (prefers-reduced-motion: reduce) {
  .button:hover, .gallery-frame:hover img, .news-image-button:hover img,
  .video-preview:hover img, .cover-card:hover img { transform: none; }
}

/* Enlarged navigation switches to the menu before labels become cramped. */
@media (min-width: 821px) and (max-width: 960px) {
  .nav-wrap { height: 80px; }
  .menu-toggle { display: flex; flex-direction: column; gap: 7px; justify-content: center; align-items: center; border: 1px solid var(--line); background: white; }
  .menu-toggle span { width: 19px; height: 2px; background: var(--blue); }
  .menu-toggle[aria-expanded=true] span:first-child { transform: translateY(4.5px) rotate(45deg); }
  .menu-toggle[aria-expanded=true] span:last-child { transform: translateY(-4.5px) rotate(-45deg); }
  #main-nav { display: none; position: absolute; top: 80px; left: 0; right: 0; background: white; flex-direction: column; gap: 0; align-items: stretch; padding: 15px 22px 23px; box-shadow: 0 15px 25px #1a285718; border-bottom: 1px solid var(--line); }
  #main-nav.open { display: flex; }
  #main-nav > a { font-size: 17px; min-height: 49px; padding: 13px 10px; }
  #main-nav .nav-contact { margin-top: 10px; text-align: center; padding: 12px; }
}