@media (min-width: 861px) {
    .footer-col a.tel-link:hover {
      border-bottom-color: transparent;
      color: rgba(255,255,255,0.7);
    }
  }

@media (max-width: 860px) {
    .wrap { padding: 0 var(--sp-25); }
    .about { grid-template-columns: 1fr; gap: var(--sp-50); }
    .about-text { padding-left: 0; }
    .about::before { display: none; }
    .projects-grid { grid-template-columns: 1fr; }
    .hero-row { grid-template-columns: 1fr; gap: var(--sp-50); }
    .hero-title-col, .hero-meta-col { padding: 0; text-align: left; }
    .hero-title { font-size: 30px; }
    .hero-gutter { display: none; }
    .footer-grid { grid-template-columns: 1fr; gap: var(--sp-50); }
    .footer-col-right { text-align: left; align-items: flex-start; }
    .footer-bottom { grid-template-columns: 1fr; gap: var(--sp-25); text-align: center; }
    .footer-bottom-legal { justify-content: center !important; }
    .footer-bottom-credit { text-align: center; }
    nav ul { display: none; }
    .scroll-cue { padding: 8px; gap: 0; right: var(--sp-25); }
    .scroll-cue .label { display: none; }
    .scroll-cue .icon { width: 20px; height: 20px; }
    .scroll-cue .icon svg { width: 20px; height: 20px; }
  }

@media (max-width: 860px) {
    .quote-slide { padding: var(--sp-50) var(--sp-25); }
    .quote-slide p { font-size: 22px; }
    .quote-mark { font-size: 80px; left: var(--sp-25); }
  }

@media (max-width: 860px) {
    .page-banner { padding-top: 160px; }
    .page-title { font-size: 42px; }
    .bio-grid { grid-template-columns: 1fr; gap: var(--sp-50); }
    .edu-item { flex-direction: column; gap: 6px; }
    .edu-title { text-align: left; white-space: normal; }
    .pull-quote { font-size: 24px; }
  }

.slide2-composition {
    position: relative;
    height: 680px;
    max-width: 1900px;
    margin: 0 auto;
    padding: 50px;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    justify-content: flex-start;
    gap: var(--sp-50);
    overflow: hidden;
  }

.frame-horizontal {
    position: relative;
    flex: 0 0 723px;
    width: 723px;
    height: 384px;
    overflow: hidden;
    z-index: 2;
  }

.frame-vertical {
    position: relative;
    flex: 0 0 718px;
    width: 718px;
    height: 384px;
    overflow: hidden;
    z-index: 2;
  }

.frame-a {
    position: relative;
    flex: 0 0 824px;
    width: 824px;
    height: 700px;
    overflow: hidden;
    z-index: 2;
  }

.frame-b {
    position: relative;
    flex: 0 0 542px;
    width: 542px;
    height: 700px;
    overflow: hidden;
    z-index: 2;
  }

.frame-c {
    position: relative;
    flex: 0 0 971px;
    width: 971px;
    height: 680px;
    overflow: hidden;
    z-index: 2;
  }

.frame-d {
    position: relative;
    flex: 0 0 453px;
    width: 453px;
    height: 680px;
    overflow: hidden;
    z-index: 2;
  }

.slide3-bleed-wrap {
    position: relative;
    height: 680px;
    display: flex;
    align-items: center;
    padding-left: 50px;
    gap: 50px;
    overflow: hidden;
  }

.slide3-bleed-left {
    flex-shrink: 0;
    width: 801px;
    height: 680px;
    overflow: hidden;
  }

.slide3-bleed-right {
    flex-shrink: 0;
    width: 528px;
    height: 680px;
    margin-left: auto;
    overflow: hidden;
  }

.slide4-composition {
    position: relative;
    height: 680px;
    max-width: 1900px;
    margin: 0 auto;
    padding: 0 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
  }

.project-cover-img {
    width: 100%;
    height: 680px;
    overflow: hidden;
    position: relative;
    min-width: 0;
  }

@media (max-width: 860px) {
    .project-hero-row { grid-template-columns: 1fr; }
    .project-panel-gutter { display: none; }
    .project-slide-num {
      font-size: 80px;
      width: 65px;
      right: auto;
      left: -10px;
      margin-right: 0;
      z-index: 0;
    }
    .project-slide-desc { text-align: left; max-width: 100%; padding-right: 0; }
    .project-slide { padding: 20px 0; }
    .spec-row { margin-bottom: var(--sp-50); }
    .slide2-composition {
      height: auto;
      flex-direction: column;
      gap: var(--sp-50);
      padding: 50px;
    }
    .slide2-desc {
      padding-top: 0;
      padding-right: 0;
    }
    .slide2-images-row {
      flex-direction: column;
      align-items: center;
      gap: var(--sp-50);
    }
    .frame-horizontal, .frame-vertical, .frame-a, .frame-b, .frame-c, .frame-d {
      width: 100%;
      flex: none;
      height: auto;
    }
    .frame-horizontal img, .frame-vertical img, .frame-a img, .frame-b img, .frame-c img, .frame-d img {
      height: auto !important;
      object-fit: contain;
    }
    .slide3-bleed-wrap {
      width: 100%;
      height: auto !important;
      display: block !important;
      padding: var(--sp-50) var(--sp-25) !important;
    }
    .slide3-bleed-left, .slide3-bleed-right {
      display: block !important;
      width: 100% !important;
      height: auto !important;
      margin: 0 0 var(--sp-50) 0 !important;
      flex-shrink: initial;
    }
    .slide3-bleed-left img, .slide3-bleed-right img {
      width: 100% !important;
      height: auto !important;
      object-fit: contain;
    }
    .slide4-composition {
      width: 100%;
      height: auto;
      flex-direction: column;
      align-items: stretch;
      padding: var(--sp-50) var(--sp-25);
      gap: var(--sp-50);
    }
    .project-nav svg { width: 14px; height: 14px; }
    .project-wrap { padding: 0 var(--sp-25); }
  }