/* The banner color is shared. All layout changes stay above the existing
   900px mobile/tablet breakpoint; preserve mobile styles in the other files. */
.site-header { background: var(--deep); border-bottom-color: rgba(255,255,255,.12); }
.assessment-pantry { display: none; }
.service-area-map { display: block; margin: 32px 0 0; }
.service-area-map img { display: block; width: 100%; height: auto; }
@media (max-width: 900px) {
  .service-area-map img { aspect-ratio: 680 / 1110; }
}

@media (min-width: 901px) {
  main { --desktop-gutter: max(48px, calc((100vw - 1280px) / 2)); }
  main > .section:not(.vending-showcase), .hero {
    padding: 88px var(--desktop-gutter);
  }
  main > section > div, .hero > * { min-width: 0; }
  main h2 { text-wrap: balance; }
  main .eyebrow { margin-bottom: 20px; }

  .hero { grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 64px; min-height: min(780px, calc(100vh - 112px)); }
  .hero h1 { font-size: clamp(3.1rem,4.55vw,4.8rem); line-height: .98; }
  .hero .lede { margin: 28px 0; font-size: 1.08rem; line-height: 1.7; }
  .hero-actions { gap: 22px; }
  .hero-actions > .button { justify-self: start; }
  .hero-media { box-shadow: 18px 18px 0 #d8b27a; }
  .hero-media figcaption strong { font-size: clamp(2rem,3vw,3.25rem); line-height: 1.02; }

  .care-layout-copy-only, .care-layout-copy-only .care-copy { max-width: none; }
  .care-copy { display: grid; grid-template-columns: minmax(0,1.2fr) minmax(0,.8fr); column-gap: 64px; align-items: start; }
  .care-copy .eyebrow { grid-column: 1 / -1; font-size: .8rem; }
  .care-copy h2 { grid-column: 1; grid-row: 2 / 4; max-width: none; font-size: clamp(2.7rem,4vw,4.2rem); line-height: 1.08; }
  .care-copy h2 em { padding-bottom: .08em; }
  .care-copy > p:not(.eyebrow) { grid-column: 2; margin: 8px 0 24px; font-size: 1.15rem; }
  .care-copy > .button { grid-column: 2; justify-self: start; min-width: 0; margin-top: 0; }

  .ai-experience { display: grid; grid-template-columns: minmax(0,.85fr) minmax(0,1.15fr); gap: 56px; align-items: center; }
  .ai-copy { max-width: none; }
  .ai-copy h2 { font-size: clamp(2.65rem,4vw,4.2rem); line-height: 1.02; }
  .ai-copy h3 { margin: 18px 0 24px; font-size: clamp(2.3rem,3.4vw,3.5rem); }
  .ai-copy p { margin: 0; font-size: 1.08rem; line-height: 1.7; }
  .process-video { width: 100%; padding: 7px; }

  .services-heading { margin-bottom: 36px; }
  .services-heading h2 { font-size: clamp(2.8rem,4.1vw,4.4rem); line-height: 1.08; }
  .service-row { gap: 24px; margin-bottom: 32px; align-items: stretch; }
  .service-card { display: flex; flex-direction: column; }
  .service-media { flex-shrink: 0; }
  .card-copy { padding: 24px 24px 30px; }
  .card-copy h3 { margin-bottom: 16px; font-size: clamp(1.65rem,2vw,2.1rem); line-height: 1.12; }
  .card-copy p { font-size: 1rem; line-height: 1.65; }

  .locations { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); align-items: stretch; }
  .locations-visual { min-height: 520px; }
  .locations-visual img { height: 100%; max-height: none; aspect-ratio: auto; object-fit: cover; }
  .locations-copy { display: flex; align-items: center; padding: 72px max(40px, calc((100vw - 1280px) / 2)) 72px 48px; }
  .locations-inner { max-width: none; width: 100%; }
  .locations-inner h2 { font-size: clamp(2.5rem,3.65vw,3.9rem); line-height: 1.08; }
  .locations-inner > p:not(.eyebrow) { margin: 28px 0; font-size: 1.08rem; line-height: 1.7; }
  .glass-pills { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; }
  .glass-pills span { min-height: 66px; padding: 12px 16px; font-size: .95rem; }

  .simple-steps { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 32px; }
  .steps-heading { grid-column: 1 / -1; width: 100%; max-width: none; margin: 0; padding-bottom: 4px; }
  .steps-heading h2 { font-size: clamp(2.8rem,4.1vw,4.4rem); line-height: 1.06; }
  .simple-step { width: 100%; max-width: none; min-height: 0; margin: 0; padding: 28px 0 0; }
  .step-icon { top: 28px; right: 0; width: 48px; height: 48px; }
  .simple-step h3 { margin: 30px 0 14px; font-size: clamp(1.7rem,2.15vw,2.2rem); line-height: 1.18; }
  .simple-step p { font-size: 1.08rem; line-height: 1.7; }

  .assessment-banner > div { display: grid; grid-template-columns: minmax(0,1.15fr) minmax(160px,.8fr) minmax(180px,.85fr); column-gap: clamp(24px,3vw,48px); align-items: center; max-width: none; }
  .assessment-banner .eyebrow { grid-column: 1; grid-row: 1; align-self: end; }
  .assessment-banner h2 { grid-column: 1; grid-row: 2; align-self: start; margin: 0; font-size: clamp(2.35rem,3.3vw,3.5rem); line-height: 1.1; }
  .assessment-banner .button { grid-column: 2; grid-row: 1 / 3; justify-self: center; width: auto; max-width: 100%; padding: 18px 24px; }
  .assessment-pantry { display: block; grid-column: 3; grid-row: 1 / 3; justify-self: end; width: min(100%,300px); margin: 0; }
  .assessment-pantry .cactus-assembly { position: relative; top: auto; left: auto; width: 100%; transform: none; }

  .story-inner { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 0 64px; max-width: none; }
  .story-inner > .eyebrow { grid-column: 1; grid-row: 1; }
  .story h2 { grid-column: 1; grid-row: 2 / 6; font-size: clamp(2.65rem,4vw,4.2rem); line-height: 1.08; }
  .story hr { display: none; }
  .story h3:not(.service-area) { grid-column: 2; grid-row: 1 / 3; align-self: start; margin: 0 0 24px; font-size: 1rem; }
  .story p:not(.eyebrow) { grid-column: 2; margin: 0 0 24px; font-size: 1.08rem; line-height: 1.75; }
  .service-area-map { display: block; grid-column: 1 / -1; grid-row: 6; margin: 32px 0 0; }
  .service-area-map img { display: block; width: 100%; max-width: 600px; height: auto; margin: 0 auto; }
  .story .service-area { grid-column: 2; margin: 4px 0 0; font-size: .9rem; }

  .catch-inner { max-width: none; }
  .catch h2 { margin-bottom: 36px; font-size: clamp(3rem,4.5vw,4.8rem); line-height: 1.02; }
  .promise-grid { gap: 24px; margin-bottom: 32px; }
  .promise { min-height: 340px; padding: 96px 28px 30px; border-radius: 10px; }
  .promise::before { display: none; }
  .promise-icon { top: 28px; right: auto; left: 28px; width: 48px; height: 48px; }
  .promise h3 { min-height: 2.3em; margin: 0 0 20px; font-size: clamp(1.7rem,2.15vw,2.3rem); line-height: 1.12; }
  .promise p { font-size: 1rem; font-weight: 500; line-height: 1.7; }
  .catch .button { width: auto; }

  .existing { text-align: left; }
  .existing-inner, .new-location-inner { display: grid; grid-template-columns: minmax(0,1.1fr) minmax(0,.9fr); column-gap: 64px; align-items: start; max-width: none; }
  .existing .eyebrow, .new-location .eyebrow { grid-column: 1 / -1; }
  .existing h2, .new-location h2 { grid-column: 1; grid-row: 2 / 4; font-size: clamp(2.8rem,4.1vw,4.4rem); line-height: 1.1; }
  .existing h2 span { text-decoration-thickness: 4px; text-underline-offset: 7px; }
  .existing-inner > p:not(.eyebrow), .new-location-inner > p:not(.eyebrow) { grid-column: 2; margin: 8px 0 28px; font-size: 1.1rem; line-height: 1.7; }
  .existing .button, .new-location .button { grid-column: 2; justify-self: start; min-width: 0; margin: 0; }

  .site-footer { padding-top: 64px; padding-bottom: 42px; }
  .footer-tagline { margin: 32px 0 28px; }
  .site-footer hr { margin: 32px auto 26px; }
}