/* Hallmark · approved ARC.LAB city collage · desktop expansion
 * P5 H4 E4 S5 R4 V5 · static photographic artwork, asymmetrical poster spreads.
 * Existing mobile art, typography and palette are the source of truth. */
.desktop-only { display: none; }
.motion-paused { scroll-behavior: auto; }
.motion-paused .mural-layer.is-new { animation: none; }
.motion-paused .board-empty { transition: none; }
.motion-enabled .scroll-link > span { animation: scroll-nudge 2.5s ease-in-out infinite; }
@keyframes scroll-nudge { 0%,100% { translate: 0 0; } 50% { translate: 0 5px; } }
@media (min-width: 960px) {
  main { max-width: none; box-shadow: none; }
  .desktop-only { display: block; }
  .section-label { width: fit-content; }
  .hero { aspect-ratio: auto; height: max(660px,56.25vw); max-height: 1040px; overflow: clip; background: var(--city-wall); }
  .hero::after { content: ''; position: absolute; inset: 0; z-index: -1; pointer-events: none; background: linear-gradient(90deg,var(--city-panel-edge),var(--city-clear) 54%); }
  .hero-art { object-position: left center; }
  .site-header { top: 30px; left: 4.5%; right: 4.5%; z-index: 8; }
  .wordmark { font-size: 30px; }
  .desktop-nav { display: flex; gap: 30px; align-items: center; }
  .desktop-nav a { min-height: 44px; display: inline-flex; align-items: center; text-decoration: none; font: 700 11px/1 var(--font-brand); letter-spacing: .13em; white-space: nowrap; }
  .desktop-nav a:hover { color: var(--city-pink); }
  .menu-toggle { display: none; }
  .hero-copy { top: 20%; left: 4.5%; right: auto; width: 46%; z-index: 4; text-shadow: 0 3px 20px var(--city-shadow); pointer-events: none; }
  .hero-copy h1 { font-size: clamp(40px,4.25vw,80px); line-height: 1.28; letter-spacing: -.06em; }
  .hero-fields { margin-top: 28px; font-size: clamp(14px,1.25vw,22px); letter-spacing: .04em; }
  .hero-description { margin-top: 12px; font-size: clamp(12px,1vw,17px); letter-spacing: 0; }
  .hero-action { top: auto; bottom: 13%; left: 4.5%; width: auto; flex-direction: row; align-items: center; gap: 30px; z-index: 5; }
  .hero-action .pill { width: auto; min-width: 230px; justify-content: space-between; padding: 18px 28px; }
  .hero-action .scroll-link { gap: 9px; }
  .hero-edition { position: absolute; bottom: 24px; left: 4.5%; right: 4.5%; display: flex; justify-content: space-between; color: var(--city-chalk); font: 10px/1.4 var(--font-brand); letter-spacing: .24em; z-index: 5; pointer-events: none; }
  #about { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); column-gap: 8%; padding: 90px 7% 60px; background: var(--city-wall) url('assets/city-wall-v1.webp') right center/70% auto; }
  #about .about-city-art { width: 57%; object-position: 60% center; }
  #about::before { background: linear-gradient(90deg,var(--city-clear) 30%,var(--city-panel) 70%); }
  #about .about-billboard { grid-column: 1; grid-row: 1; }
  #about h2 { font-size: clamp(36px,4.15vw,70px); }
  #about .about-street { grid-column: 1; grid-row: 2; height: 23vw; min-height: 210px; }
  #about .about-street > span { font-size: clamp(40px,4.2vw,72px); }
  #about .about-copy { grid-column: 2; grid-row: 1/4; margin: 0; padding: 34px; align-self: center; font-size: 16px; }
  #about .about-opening { font-size: 20px; }
  #about .about-wall-note { grid-column: 1; grid-row: 3; }
  .activities { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 45px 6%; padding: 90px 7%; }
  .activities-heading { grid-column: 1/-1; padding: 0 0 20px; display: block; }
  .activities-heading::before { display: none; }
  .activities-heading h2 { font-size: clamp(60px,7.7vw,128px); word-spacing: .12em; transform: none; }
  .activities-heading h2 > span { display: inline; white-space: nowrap; }
  .activities-heading h2::after { width: 24%; margin-top: 1rem; transform: rotate(-1deg); }
  .activity { padding: 0; min-width: 0; }
  .activity-ai { grid-column: 1/-1; display: grid; grid-template-columns: minmax(0,1.12fr) minmax(0,1fr); gap: 7%; align-items: center; padding-bottom: 45px; }
  .activity-poster { container-type: inline-size; }
  .activity-ai .activity-poster { height: auto; min-height: 0; aspect-ratio: 1/1.14; }
  .activity-ai .activity-poster .school-name { font-size: 29cqw; }
  .activity-copy { margin: 24px 0 0; padding: 30px; }
  .activity-ai .activity-copy { margin: 0; }
  .activity-copy h3 { font-size: clamp(25px,2.3vw,38px); line-height: 1.55; }
  .activity-copy > p:not(.activity-category) { font-size: 16px; }
  .activity-category { font-size: 11px; }
  .activity-poster .poster-small { font-size: 10px; }
  .activity-poster .poster-note { font-size: 17px; }
  .learning-topics { font-size: 12px; gap: 12px 20px; }
  .practice-intro { grid-column: 1/-1; display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); column-gap: 8%; padding: 65px 0 75px; margin: 0; }
  .practice-intro .section-label { grid-column: 1/-1; }
  .practice-intro h3 { font-size: clamp(35px,4vw,62px); }
  .practice-intro > p:last-child { align-self: end; font-size: 17px; margin: 0; }
  .practice-intro::after { font-size: 13vw; right: 0; bottom: -8px; }
  .activity-investment .activity-poster, .activity-movie .activity-poster { aspect-ratio: 1.14; }
  .activity-investment .activity-poster strong { font-size: 17cqw; }
  .activity-movie .activity-poster strong { font-size: 25cqw; }
  .investment-tag, .movie-tag { font-size: 8cqw; }
  .school-tag { font-size: 8cqw; }
  .activity-investment .activity-copy { margin-right: 0; }
  .activity-movie { padding-top: 0; }
  .city-crossing { padding-block: 14px; }
  .city-crossing span { font-size: 32px; }
  .beliefs { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 55px 6%; padding: 70px 7% 80px; }
  .beliefs-heading { grid-column: 1/-1; display: flex; flex-wrap: wrap; justify-content: space-between; align-items: end; padding: 0 0 10px; gap: 25px; }
  .beliefs-heading::before { display: none; }
  .beliefs-heading .section-label { flex-basis: auto; margin-right: 80%; white-space: nowrap; }
  .beliefs-heading h2 { font-size: clamp(85px,9vw,150px); }
  .beliefs-heading .section-lead { font-size: 17px; margin: 0; padding-bottom: 20px; }
  .belief { padding: 0; min-width: 0; }
  .belief-poster { container-type: inline-size; }
  .belief-brush .belief-poster, .belief-challenge .belief-poster { height: auto; aspect-ratio: 3/4; padding: 8%; }
  .belief-brush h3 { font-size: 20cqw; }
  .belief-brush .poster-small { font-size: 8cqw; }
  .belief-challenge h3 { font-size: 17cqw; }
  .belief-challenge .poster-small { font-size: 10px; }
  .challenge-tag { font-size: 6cqw; }
  .belief .prose { font-size: 16px; padding: 30px; margin-top: 25px; }
  .belief-future { grid-column: 1/-1; display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 7%; align-items: center; padding-top: 40px; }
  .future-phrase { container-type: inline-size; height: auto; aspect-ratio: .8; padding: 10% 8%; }
  .future-phrase h3 { font-size: 9.5cqw; }
  .future-phrase > span { font-size: 12px; }
  .belief-future .prose { margin: 0; padding: 35px; }
  .paint-playground { display: grid; grid-template-columns: minmax(0,.85fr) minmax(0,1.15fr); gap: 16px 8%; align-items: start; padding: 110px 7% 80px; }
  .play-head { grid-column: 1; grid-row: 1/5; align-self: center; }
  .play-head h2 { font-size: clamp(57px,6vw,98px); }
  .paint-playground .section-lead { font-size: 16px; }
  .paint-board { grid-column: 2; grid-row: 1; margin: 0; width: 100%; container-type: inline-size; }
  .paint-layer-caption { grid-column: 2; margin: 5px 0 0; font-size: 10px; }
  .paint-controls { grid-column: 2; margin: 5px 0 0; }
  .paint-hint { grid-column: 2; margin: 0; }
  .board-meta, .board-note { font-size: 10px; }
  .company { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); column-gap: 12%; padding: 70px 9%; }
  .company > .section-label, .company > h2, .company-facts { grid-column: 1; }
  .company-facts { margin: 24px 0 0; }
  .contact-block { grid-column: 2; grid-row: 1/4; align-self: center; margin: 0; padding: 40px 8%; }
  .contact-block h3 { font-size: 54px; }
  .site-footer { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 15px 8%; padding: 55px 7%; }
  .footer-mark { font-size: 70px; width: fit-content; }
  .site-footer > p, .site-footer > small { grid-column: 1; }
  .site-footer nav { grid-column: 2; grid-row: 1/3; align-self: center; justify-content: flex-end; gap: 25px; }
  .site-footer nav a { font-size: 12px; }
}
@media (prefers-reduced-motion: reduce) { .motion-enabled .scroll-link > span { animation: none; } }