/* Shared responsive rules */
@media (max-width: 1280px) {
  .section-header { gap: var(--section-header-gap); }
}

@media (min-width: 901px) {
  .stage-name {
    white-space: nowrap;
  }

  .stage-desc {
    white-space: nowrap;
  }
}

@media (max-width: 1200px) and (min-width: 901px) {
  .stage {
    grid-template-columns: 120px minmax(220px, 28%) minmax(0, 1fr);
    column-gap: clamp(32px, 4vw, 72px);
    padding: clamp(40px, 4.5vw, 52px) 0;
  }

  .stage-num { font-size: 48px; }

  .stage-name {
    font-size: clamp(24px, 2.6vw, 34px);
    line-height: 1.12;
  }

  .stage-desc {
    font-size: clamp(14px, 1.2vw, 15.5px);
  }
}

@media (max-width: 900px) {
  .stage {
    --stage-num-width: 72px;
    grid-template-columns: var(--stage-num-width) minmax(0, 1fr);
    grid-template-areas:
      "num name"
      "desc desc";
    gap: 6px 18px;
    padding: 24px 0;
  }

  .stage-num {
    grid-area: num;
    font-size: 40px;
    line-height: 1;
  }

  .stage-name {
    grid-area: name;
    align-self: center;
    font-size: clamp(22px, 5vw, 28px);
    line-height: 1.15;
    white-space: normal;
  }

  .stage-desc {
    grid-area: desc;
    padding-left: calc(var(--stage-num-width) + 18px);
    font-size: 15px;
    line-height: 1.65;
    max-width: none;
    padding-top: 0;
    white-space: normal;
  }
}

@media (max-width: 1024px) {
  .section-header { grid-template-columns: 1fr; margin-bottom: var(--section-header-mb); align-items: start; }
  .section-title--editorial {
    font-size: clamp(30px, 7.8vw, 56px);
    line-height: 1.04;
  }
  #services .section-header { align-items: start; }
  .contact-grid { grid-template-columns: 1fr; gap: clamp(32px, 4vw, 48px); }
  .project-grid { grid-template-columns: 1fr; gap: 16px; }
  .project-card { height: 320px; }
  .services-hover { grid-template-columns: 1fr; gap: 32px; }
  .sh-preview { position: relative; top: auto; height: 380px; order: -1; }
  .about-body { grid-template-columns: 1fr; gap: 28px; }
  footer { padding: 48px var(--gutter) 32px; align-items: flex-start; }
  footer .footer-meta { align-items: flex-start; text-align: left; }
}

@media (max-width: 768px) {
  .nav-links, .nav-cta { display: none; }
  .menu-toggle { display: flex; }
  .mobile-nav { display: block; }

  .hero { padding: calc(var(--nav-height) + 36px) 0 44px; }
  .hero-title-block { padding: 0 var(--gutter) 36px; }
  .hero-image-frame { height: 52vh; min-height: 360px; }
  .sh-preview { height: 320px; }
  .about-header { padding: calc(var(--nav-height) + 32px) var(--gutter) 48px; }
  .about-body { padding: 0 var(--gutter) var(--section-pad-y); }
  .projects-header { padding: calc(var(--nav-height) + 32px) var(--gutter) 40px; }
  .projects-body { padding: 0 var(--gutter) var(--section-pad-y); }
  .consent-note { padding-left: 0; }
  .consent-panel { padding: 16px 18px; }
  .legal-modal {
    width: min(640px, calc(100vw - 24px));
    max-width: calc(100vw - 24px);
    max-height: min(88vh, 760px);
  }
  .legal-modal-panel {
    max-height: min(88vh, 760px);
  }
  .legal-modal-close {
    top: 10px;
    right: 10px;
  }
  .legal-modal-header {
    padding-right: 36px;
  }
}

@media (max-width: 480px) {
  .section-title--editorial {
    font-size: clamp(28px, 8.6vw, 40px);
    line-height: 1.06;
    letter-spacing: -0.03em;
  }

  .section-title--editorial .section-title-line2 {
    white-space: normal;
  }

  .hero { padding: calc(var(--nav-height) + 24px) 0 36px; }
  .hero-title-block { padding: 0 var(--gutter) 28px; }
  .hero-logo { max-width: 320px; }
  .hero-image-frame { height: 44vh; min-height: 280px; }
  .hero-slide-caption { left: 18px; bottom: 30px; font-size: 12px; }
  .hero-slide-meta { display: none; }
  .hero-indicators { bottom: 14px; }
  .hero-indicator { width: 22px; }
  .hero-indicator.active { width: 36px; }
  .scroll-cue { display: none; }
  .project-card { height: 300px; }
  .project-name { font-size: 23px; }
  .project-modal-panel { padding: 32px 22px 28px; width: 92vw; }
  .project-modal-photos { grid-template-columns: 1fr; gap: 12px; }
  .sh-row { grid-template-columns: 28px 1fr 22px; gap: 16px; padding: 22px 0; }
  .sh-preview { height: 320px; }
  .sh-desc { font-size: 13.5px; }
  .stage { --stage-num-width: 56px; padding: 20px 0; gap: 4px 14px; }
  .stage-num { font-size: 32px; }
  .stage-name { font-size: clamp(20px, 5.5vw, 24px); }
  .stage-desc { padding-left: calc(var(--stage-num-width) + 14px); font-size: 14.5px; }
  .field-group { grid-template-columns: 1fr; gap: 0; }
  .enquiry-form { padding: 28px 22px; }
  .legal-modal {
    width: calc(100vw - 20px);
    max-width: calc(100vw - 20px);
    max-height: 92vh;
    border-radius: 2px;
  }
  .legal-modal-panel {
    --legal-pad-y: clamp(24px, 6vw, 32px);
    --legal-pad-x: clamp(16px, 4.5vw, 22px);
    --legal-gap-section: clamp(14px, 3.5vw, 18px);
    max-height: 92vh;
  }
  .legal-modal-header {
    padding-right: 32px;
  }
  .legal-modal-header h2 {
    font-size: clamp(22px, 6.5vw, 28px);
  }
  footer { padding: 36px var(--gutter) 24px; flex-direction: column; gap: 10px; text-align: center; }
  .contact-detail { grid-template-columns: 90px 1fr; gap: 16px; }
  footer { flex-direction: column; gap: 24px; }
}