/* Desktop refinements. The established phone and tablet layout stays in style.css. */
@media (min-width: 901px) {
  .wrap { max-width: 1240px; width: calc(100% - clamp(64px, 8vw, 128px)); }
  .site-header { height: 104px; gap: 32px; }
  .site-header .brand-logo { width: 218px; }
  .site-header nav { gap: clamp(18px, 2vw, 30px); }
  .site-header nav a { font-size: 13px; }
  .site-header nav a:last-child { padding: 11px 20px; }

  /* Keep the introduction and the reference image in one balanced first section. */
  .hero {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.12fr);
    grid-template-areas: "heading visual" "copy visual" "meta meta";
    gap: 28px clamp(32px, 4vw, 60px);
    align-items: start;
    padding-top: 64px;
    padding-bottom: 32px;
  }
  .hero-heading { grid-area: heading; align-self: end; }
  .hero-heading .eyebrow { font-size: 10px; margin-bottom: 24px; letter-spacing: 1.35px; }
  .hero-heading h1 { font-size: clamp(42px, 4vw, 58px); line-height: 1.1; letter-spacing: -2px; }
  .hero-copy { grid-area: copy; display: flex; flex-wrap: wrap; align-items: center; gap: 0 22px; padding: 0; }
  .hero-copy .intro { flex-basis: 100%; max-width: 48ch; font-size: 16px; line-height: 1.75; margin-bottom: 16px; }
  .hero-copy .hero-audience { flex-basis: 100%; font-size: 12px; margin-bottom: 24px; }
  .hero-copy .button { font-size: 13px; padding: 14px 22px; }
  .hero-copy .text-link { display: inline-block; width: auto; margin: 12px 0; font-size: 13px; }
  .scan-figure {
    grid-area: visual;
    align-self: stretch;
    margin: 0;
    min-width: 0;
    display: grid;
    grid-template-rows: auto minmax(210px, 1fr) auto auto;
  }
  .scan-bar { padding: 17px 20px; font-size: 9px; letter-spacing: .65px; }
  .scan-bar > span:last-child { display: none; }
  .scan-figure img { width: 100%; height: 100%; min-height: 0; aspect-ratio: auto; object-fit: contain; }
  .scan-title { align-items: center; gap: 20px; padding: 22px 24px; }
  .scan-title > span { font-size: 25px; }
  .scan-title p { font-size: 9px; letter-spacing: .6px; text-align: right; }
  .scan-figure figcaption { padding: 12px 20px; font-size: 10px; line-height: 1.6; }
  .hero-foot { grid-area: meta; flex-wrap: wrap; gap: 12px 30px; padding: 2px 0 0; font-size: 10px; }
  .audience .wrap { padding: 24px 0; }
  .audience span:first-child { font-size: 10px; }
  .audience p { font-size: 16px; }

  /* Use a shared two-column rhythm instead of narrow, uneven three-column headings. */
  .section { padding-top: 80px; padding-bottom: 80px; }
  .section-heading, .process-head {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 20px clamp(40px, 5vw, 72px);
    align-items: start;
    margin-bottom: 40px;
  }
  .section-heading > .eyebrow, .process-head > .eyebrow { grid-column: 1 / -1; padding-top: 0; margin-bottom: 0; }
  .section-heading h2, .process-head h2 { margin: 0; font-size: clamp(34px, 3vw, 42px); line-height: 1.18; }
  .section-heading > p:last-child, .process-head > p:last-child { max-width: 48ch; font-size: 15px; line-height: 1.8; margin: 0; }
  .service-paths, .services { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 clamp(40px, 5vw, 72px); }
  .service-paths h3 { font-size: 30px; }
  .service-paths p:not(.eyebrow), .services p { max-width: 60ch; font-size: 15px; line-height: 1.8; }
  .service-paths .text-link { font-size: 13px; }
  .services article { padding: 30px 0; }
  .services h3 { font-size: 24px; }
  .services .rebranding-service { grid-column: 1 / -1; }
  .services .rebranding-service p { max-width: 85ch; }
  .practice-section, .about, .visual-approach { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(40px, 5vw, 72px); }
  .practice-section { padding-top: 12px; padding-bottom: 80px; }
  .practice-section h2, .visual-approach h2 { font-size: clamp(32px, 2.8vw, 38px); }
  .practice-section p:not(.eyebrow), .about p:not(.eyebrow):not(.about-lead), .visual-approach > div:last-child { font-size: 15px; line-height: 1.85; }
  .about h1 { font-size: clamp(34px, 3.2vw, 46px); line-height: 1.16; letter-spacing: -1.5px; }
  .about-lead { font-size: 27px; }

  .page-intro { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: 20px 56px; align-items: end; padding: 64px 0; }
  .page-intro > .eyebrow { grid-column: 1 / -1; margin: 0; }
  .page-intro h1 { font-size: clamp(40px, 3.8vw, 54px); line-height: 1.13; letter-spacing: -2px; margin: 0; }
  .page-intro > p:last-child { max-width: 48ch; font-size: 16px; line-height: 1.8; }
  .visual-focus { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(40px, 5vw, 72px); padding-top: 64px; }
  .visual-statement { min-height: 430px; padding: 40px; }
  .visual-statement h2 { font-size: clamp(48px, 4.5vw, 64px); }
  .visual-offer p { font-size: 15px; }
  .process { padding: 72px 0; }
  .steps { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 28px; }
  .steps p { font-size: 14px; line-height: 1.8; }
  .faq { grid-template-columns: minmax(0, .85fr) minmax(0, 1.4fr); gap: 64px; padding-top: 24px; }
  .faq summary { font-size: 16px; }
  .faq details p { font-size: 14px; line-height: 1.8; }

  .brief-section { padding: 64px 0 80px; }
  .brief-grid { grid-template-columns: minmax(0, .9fr) minmax(0, 1.15fr); gap: clamp(40px, 6vw, 88px); align-items: start; }
  .brief-grid h2 { font-size: clamp(32px, 3vw, 42px); line-height: 1.18; }
  .brief-grid > div > p:not(.eyebrow) { max-width: 45ch; font-size: 15px; line-height: 1.8; }
  .brief-grid form { padding: 32px; background: #fff; border: 1px solid var(--line); }
  .brief-grid label { font-size: 13px; margin-bottom: 8px; }
  .brief-grid input, .brief-grid select, .brief-grid textarea { font-size: 15px; padding: 13px; }
  .brief-grid .form-row { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
  .brief-grid .button { font-size: 14px; }
  .brief-grid .form-privacy { font-size: 12px; }
  .brief-grid .contact-phone { font-size: 20px; margin: 0 0 14px; }
  .brief-grid .contact-phone a { border-bottom: 1px solid #285cc4; padding-bottom: 3px; }
  .business-contact { max-width: 390px; }
  .contact-address { font-size: 13px; }

  .page-cta { padding: 52px 0; }
  .page-cta > .wrap { gap: 48px; }
  .page-cta h2 { font-size: 34px; }
  .page-cta p:last-child { max-width: 65ch; font-size: 15px; }
  .page-cta .button { font-size: 13px; }
  .site-footer { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; align-items: center; gap: 30px 36px; padding: 44px 0 28px; }
  .site-footer nav { max-width: none; gap: 14px 24px; padding: 0; }
  .site-footer nav a { font-size: 12px; }
  .site-footer > a:last-of-type { padding: 0; font-size: 12px; }
  .footer-legal { grid-column: 1 / -1; margin: 0; padding-top: 24px; font-size: 11px; }
  .footer-legal p { font-size: 11px; }
}

/* Small laptops keep comfortable line lengths without squeezing navigation or fields. */
@media (min-width: 901px) and (max-width: 1100px) {
  .site-header { gap: 20px; }
  .site-header .brand-logo { width: 190px; }
  .site-header nav { gap: 17px; }
  .site-header nav a { font-size: 12px; }
  .hero-heading h1 { font-size: 42px; }
  .hero-copy .intro { font-size: 15px; }
  .scan-title { flex-wrap: wrap; gap: 14px; }
  .scan-title p { text-align: left; }
  .brief-grid form { padding: 24px; }
  .brief-grid .form-row { grid-template-columns: minmax(0, 1fr); gap: 0; }
  .site-footer { grid-template-columns: minmax(0, 1fr) auto; }
  .site-footer nav { justify-content: flex-end; }
  .site-footer > a:last-of-type { grid-column: 1 / -1; }
  .footer-legal { flex-wrap: wrap; }
}
