/*
  RESPONSIVE PASS 9.0
  iPhone / iPad art direction only.
  The approved desktop CSS remains untouched.
  All rules in this file are explicitly viewport-scoped.
*/

@media (max-width:1100px){
  html{
    -webkit-text-size-adjust:100%;
    text-size-adjust:100%;
  }
  body{
    overflow-x:hidden;
  }

  /* Header: retain the desktop identity, rebalance the proportions. */
  .site-header{
    min-height:72px;
    height:auto;
    padding:14px max(24px, env(safe-area-inset-right)) 14px max(24px, env(safe-area-inset-left));
    gap:24px;
  }
  .brand{
    font-size:15px;
    line-height:1.1;
    flex:0 1 auto;
    min-height:44px;
    display:flex;
    flex-direction:column;
    justify-content:center;
  }
  .brand span{
    margin-top:3px;
    font-size:9px;
    line-height:1.25;
  }
  .site-header nav{
    gap:20px;
    flex:0 0 auto;
  }
  .site-header nav a{
    min-height:44px;
    display:flex;
    align-items:center;
    padding:10px 0 8px;
  }

  /* Global page rhythm. */
  .viewport{
    padding:34px 28px 40px;
  }
  .page-head,
  .section-head{
    display:grid;
    grid-template-columns:minmax(0,1fr) minmax(260px,.75fr);
    gap:32px;
    align-items:end;
    margin-bottom:28px;
  }
  .page-head p,
  .section-head p{
    margin:0;
    color:#555;
    max-width:580px;
  }
  .footer{
    padding:22px 28px max(22px, env(safe-area-inset-bottom));
    gap:24px;
    line-height:1.35;
  }

  /* Home — tablet as an editorial single-page spread. */
  .home-grid{
    display:grid;
    grid-template-columns:1fr;
    gap:34px;
  }
  .home-grid .hero-img{
    min-height:0;
    height:min(68vh,760px);
  }
  .home-grid .hero-img img{
    object-position:center center;
  }
  .hero-copy{
    padding:0;
  }
  .hero-copy h1{
    max-width:920px;
    text-wrap:balance;
  }
  .hero-copy .lede{
    max-width:760px;
  }
  .stat-row{
    max-width:760px;
    grid-template-columns:repeat(3,1fr);
  }
  .home-footer-links{
    margin-top:34px;
  }
  .home-footer-links a{
    min-height:44px;
    display:flex;
    align-items:center;
  }

  /* Work — two-column iPad gallery, preserving titles. */
  .work-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:24px 18px;
  }
  .work-card.p6 .work-meta.work-meta-visible{
    min-height:52px !important;
  }

  /* Design Solutions landing — two-up on iPad, alternating rhythm retained. */
  .solutions-grid.v8{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  .solution-card.v8{
    min-height:0;
    border-right:1px solid var(--line);
    border-bottom:1px solid var(--line);
  }
  .solution-card.v8:nth-child(2n){
    border-right:0;
  }
  .solution-card.v8 .solution-visual{
    height:clamp(250px,38vw,430px);
  }
  .solution-card.v8 .solution-body{
    min-height:310px;
  }

  /* About / Press / Contact — same content, stronger tablet breathing room. */
  .about-grid,
  .press-grid,
  .contact-grid{
    gap:42px;
  }
  .about-copy .lede{
    font-size:22px;
  }
  .practice-block p,
  .about-history{
    max-width:760px;
  }
  .press-logos{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  /* Selected Work project pages.
     Restore paired editorial rows on iPad while retaining full image content. */
  .project-hero.p5{
    padding-top:24px;
  }
  .project-hero.p5 .hero-image{
    width:calc(100% - 56px);
    margin:0 28px;
    max-height:72vh;
    object-fit:contain;
  }
  .project-hero.p5 .project-title{
    padding:20px 28px 0;
  }
  .project-hero.p5 .project-title h1{
    font-size:clamp(44px,7vw,68px);
    text-wrap:balance;
  }
  .project-summary.p5{
    padding:24px 28px;
  }
  .gallery-p5{
    padding:12px 28px 38px;
    gap:18px;
  }
  .photo-row{
    display:flex;
    gap:18px;
    align-items:flex-start;
  }
  .photo-row figure{
    flex-grow:var(--ar,1);
    flex-basis:0;
    min-width:0;
    margin:0;
  }
  .photo-row.single{
    display:flex;
    justify-content:center;
  }
  .photo-row.single figure{
    flex:none;
    width:min(88%,920px);
  }
  .photo-row.portrait-heavy{
    max-width:900px;
    align-self:center;
  }
  .project-nav{
    margin:0 28px 36px;
  }
  .project-nav a{
    min-height:64px;
    display:flex;
    flex-direction:column;
    justify-content:center;
  }

  /* Design Solutions case studies — tablet narrative. */
  .case-study-v86{
    padding:36px 28px 24px;
  }
  .case-study-v86 .case-intro{
    grid-template-columns:1fr;
    gap:26px;
    padding-bottom:28px;
  }
  .case-study-v86 .case-heading{
    position:static;
  }
  .case-study-v86 .case-heading h1{
    max-width:900px;
    font-size:clamp(46px,7.4vw,72px);
    text-wrap:balance;
  }
  .case-study-v86 .case-copy{
    max-width:880px;
  }
  .case-study-v86 .case-evidence{
    display:grid;
    grid-template-columns:minmax(0,1fr) minmax(0,1fr);
    gap:28px 18px;
    padding:18px 0 38px;
  }
  .case-study-v86 .case-evidence figure,
  .case-study-v86 .case-evidence figure.portrait,
  .case-study-v86 .case-evidence figure.technical-plate{
    width:auto;
    max-width:none;
    margin:0;
  }
  .case-study-v86 .case-evidence figure.pair{
    grid-column:span 1 !important;
  }
  .case-study-v86 .case-evidence figure.wide,
  .case-study-v86 .case-evidence figure.portrait{
    grid-column:1 / -1 !important;
  }
  .case-study-v86 .case-evidence figure.portrait{
    width:min(68%,760px);
    justify-self:center;
  }
  .case-study-v86 .case-evidence figure.technical-plate{
    width:min(82%,980px);
    justify-self:center;
  }
  .case-study-v86 .case-outcome{
    grid-template-columns:.72fr 1.28fr;
    gap:34px;
  }
  .case-study-v86 .case-nav a{
    min-height:68px;
    display:flex;
    flex-direction:column;
    justify-content:center;
  }
}

/* iPad portrait / compact iPad. */
@media (max-width:900px){
  .site-header{
    display:block;
    padding-top:max(15px, env(safe-area-inset-top));
  }
  .site-header nav{
    margin-top:12px;
    overflow-x:auto;
    overflow-y:hidden;
    white-space:nowrap;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:none;
    overscroll-behavior-inline:contain;
  }
  .site-header nav::-webkit-scrollbar{display:none}
  .site-header nav a{
    flex:0 0 auto;
  }

  .page-head,
  .section-head{
    grid-template-columns:1fr;
    gap:14px;
  }

  .home-grid .hero-img{
    height:min(66vh,720px);
  }

  .press-grid{
    grid-template-columns:1fr;
  }

  .case-study-v86 .case-outcome{
    grid-template-columns:1fr;
    gap:20px;
  }
}

/* iPhone / narrow mobile — deliberate vertical edition. */
@media (max-width:700px){
  :root{
    --mobile-gutter:18px;
  }

  body{
    font-size:16px;
    line-height:1.5;
  }
  .site-header{
    padding-left:max(var(--mobile-gutter), env(safe-area-inset-left));
    padding-right:max(var(--mobile-gutter), env(safe-area-inset-right));
    border-bottom-color:rgba(17,18,20,.14);
  }
  .brand{
    font-size:14px;
    letter-spacing:.065em;
  }
  .brand span{
    font-size:8.5px;
  }
  .site-header nav{
    gap:18px;
    margin-inline:calc(-1 * var(--mobile-gutter));
    padding-inline:var(--mobile-gutter);
  }
  .site-header nav a{
    min-height:44px;
    font-size:11px;
    padding:9px 0 8px;
  }

  .viewport{
    padding:26px var(--mobile-gutter) 34px;
  }
  .eyebrow{
    font-size:10px;
  }
  .mini-rule{
    margin:17px 0;
  }
  h1{
    font-size:clamp(38px,11vw,50px);
    line-height:.97;
    letter-spacing:-.05em;
    text-wrap:balance;
  }
  h2{
    font-size:clamp(29px,8vw,38px);
    line-height:1;
    text-wrap:balance;
  }
  .lede{
    font-size:18px;
    line-height:1.43;
  }
  .btn{
    min-height:44px;
    display:flex;
    align-items:center;
    justify-content:center;
  }
  .footer{
    padding:20px var(--mobile-gutter) max(22px, env(safe-area-inset-bottom));
    display:block;
  }
  .footer span{
    display:block;
  }
  .footer span + span{
    margin-top:7px;
  }

  /* Home: image becomes a full-bleed opening plate. */
  .home-grid{
    gap:28px;
  }
  .home-grid .hero-img{
    width:100vw;
    height:clamp(470px,128vw,650px);
    margin-left:calc(50% - 50vw);
    margin-right:calc(50% - 50vw);
  }
  .hero-img:after{
    left:max(var(--mobile-gutter), env(safe-area-inset-left));
    bottom:14px;
    font-size:9px;
  }
  .hero-copy h1{
    font-size:clamp(40px,11.8vw,54px);
    line-height:.95;
  }
  .hero-copy .lede{
    margin-top:20px;
  }
  .stat-row{
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
    gap:0;
    margin-top:22px;
  }
  .stat{
    padding:12px 8px 12px 0;
  }
  .stat b{
    font-size:16px;
  }
  .stat span{
    font-size:10px;
    line-height:1.25;
    display:block;
    padding-right:5px;
  }
  .cta-row{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:10px;
  }
  .home-footer-links{
    grid-template-columns:1fr;
    gap:16px;
    margin-top:30px;
  }

  /* Work: full-bleed photographs, inset editorial captions. */
  .section-head,
  .page-head{
    margin-bottom:22px;
  }
  .work-grid{
    grid-template-columns:1fr;
    gap:10px;
    margin-left:calc(-1 * var(--mobile-gutter));
    margin-right:calc(-1 * var(--mobile-gutter));
  }
  .work-card.p6 .work-meta.work-meta-visible{
    padding:10px var(--mobile-gutter) 22px !important;
    min-height:0 !important;
  }
  .work-card.p6 .work-meta.work-meta-visible strong{
    font-size:17px !important;
  }
  .work-card.p6 .work-meta.work-meta-visible span{
    font-size:10px !important;
    margin-top:5px !important;
  }

  /* Solutions landing: each case becomes one vertically composed chapter. */
  .solutions-grid.v8{
    grid-template-columns:1fr;
    margin-left:calc(-1 * var(--mobile-gutter));
    margin-right:calc(-1 * var(--mobile-gutter));
    border-left:0;
    border-right:0;
  }
  .solution-card.v8{
    border-right:0 !important;
  }
  .solution-card.v8 .solution-visual{
    height:clamp(310px,82vw,470px);
  }
  .solution-card.v8 .solution-body{
    min-height:0;
    padding:22px var(--mobile-gutter) 26px;
  }
  .solution-card.v8 .short{
    font-size:clamp(27px,7.8vw,34px);
    line-height:.98;
  }
  .solution-card.v8 p{
    font-size:15px;
    line-height:1.5;
  }
  .solution-card.v8 .tag{
    min-height:0;
    margin-top:24px;
    padding-top:16px;
    font-size:10px;
  }

  /* About. */
  .about-grid{
    gap:34px;
  }
  .about-copy .lede{
    font-size:20px;
  }
  .practice-block{
    padding:20px 0 17px;
  }
  .practice-block h2{
    font-size:27px;
  }
  .practice-block p,
  .about-history{
    font-size:15px;
  }

  /* Press: editorial list remains complete; award panel goes full bleed. */
  .press-logos{
    grid-template-columns:1fr;
  }
  .press-item{
    font-size:19px;
    padding:16px 0;
  }
  .awards{
    margin-inline:calc(-1 * var(--mobile-gutter));
    padding:28px var(--mobile-gutter);
  }
  .awards .big{
    font-size:clamp(62px,20vw,86px);
  }

  /* Contact: preserve the authored WORK / RANGE line structure rather than
     allowing Safari to create an accidental extra orphan. */
  .contact-grid{
    gap:26px;
  }
  .contact-grid h1{
    white-space:nowrap;
    font-size:clamp(24px,6.15vw,31px);
    line-height:1.03;
    letter-spacing:-.055em;
  }
  .contact-list{
    margin-top:4px;
  }
  .contact-list a,
  .contact-list div{
    min-height:48px;
    align-items:center;
    gap:16px;
  }
  .contact-list a span:last-child,
  .contact-list div span:last-child{
    text-align:right;
    overflow-wrap:anywhere;
  }

  /* Selected Work project pages: gallery photographs become full bleed. */
  .project-hero.p5{
    padding-top:0;
  }
  .project-hero.p5 .hero-image{
    width:100%;
    max-height:none;
    margin:0;
  }
  .project-hero.p5 .project-title{
    padding:18px var(--mobile-gutter) 0;
  }
  .project-hero.p5 .project-title h1{
    font-size:clamp(40px,11.2vw,52px);
    line-height:.96;
  }
  .project-summary.p5{
    padding:18px var(--mobile-gutter) 24px;
  }
  .project-summary.p5 p{
    font-size:17px;
    line-height:1.5;
    margin-top:8px;
  }
  .gallery-p5{
    padding:4px 0 26px;
    gap:0;
  }
  .photo-row,
  .photo-row.portrait-heavy,
  .photo-row.single{
    display:block;
    width:100%;
    max-width:none;
  }
  .photo-row figure,
  .photo-row.single figure,
  .photo-row.portrait-heavy figure{
    width:100%;
    max-width:none;
    margin:0 0 14px;
  }
  .photo-row img{
    width:100%;
    height:auto;
  }
  .project-nav{
    margin:0 var(--mobile-gutter) 28px;
    grid-template-columns:1fr 1fr;
    gap:20px;
  }
  .project-nav a{
    min-height:66px;
    padding:13px 0;
    font-size:9px;
  }
  .project-nav span{
    font-size:14px;
    line-height:1.2;
  }

  /* Solution case studies: text inset, evidence photographs edge-to-edge. */
  .case-study-v86{
    padding:28px var(--mobile-gutter) 20px;
  }
  .case-study-v86 .case-heading h1{
    font-size:clamp(40px,11.4vw,54px);
    line-height:.94;
  }
  .case-study-v86 .case-location{
    font-size:9.5px;
    line-height:1.35;
  }
  .case-study-v86 .case-tag{
    margin-top:18px;
    font-size:9.5px;
    line-height:1.35;
  }
  .case-study-v86 .case-copy .lead{
    font-size:clamp(24px,6.8vw,31px);
    line-height:1.08;
    margin-bottom:22px;
  }
  .case-study-v86 .case-copy p{
    font-size:16px;
    line-height:1.55;
    margin-bottom:16px;
  }
  .case-study-v86 .case-pull{
    font-size:clamp(25px,7.2vw,32px);
    padding:18px 0;
    margin-top:24px;
  }
  .case-study-v86 .case-evidence{
    display:block;
    width:100vw;
    margin-left:calc(50% - 50vw);
    margin-right:calc(50% - 50vw);
    padding:16px 0 32px;
  }
  .case-study-v86 .case-evidence figure,
  .case-study-v86 .case-evidence figure.portrait,
  .case-study-v86 .case-evidence figure.technical-plate{
    width:100%;
    max-width:none;
    margin:0 0 20px;
  }
  .case-study-v86 .case-evidence figure img{
    width:100%;
    height:auto;
  }
  .case-study-v86 .case-evidence figcaption{
    padding:8px var(--mobile-gutter) 0;
    font-size:9px;
    line-height:1.4;
  }
  .case-study-v86 .case-outcome{
    display:block;
    padding:26px 0 32px;
  }
  .case-study-v86 .case-outcome h2{
    margin-bottom:18px;
  }
  .case-study-v86 .case-outcome p,
  .case-study-v86 .case-outcome > div p{
    font-size:16px;
    line-height:1.55;
  }
  .case-study-v86 .case-nav{
    margin-bottom:18px;
  }
  .case-study-v86 .case-nav a{
    min-height:68px;
    padding:12px 0;
  }
  .case-study-v86 .case-nav span{
    font-size:13px;
    line-height:1.2;
  }
}

/* Small iPhones: keep the full story, reduce only composition scale. */
@media (max-width:430px){
  .cta-row{
    grid-template-columns:1fr;
  }
  .home-grid .hero-img{
    height:clamp(440px,132vw,570px);
  }
  .hero-copy h1{
    font-size:clamp(38px,11.4vw,47px);
  }
  .stat b{
    font-size:15px;
  }
  .stat span{
    font-size:9.5px;
  }
  .contact-grid h1{
    font-size:clamp(22px,5.95vw,26px);
  }
  .project-nav,
  .case-study-v86 .case-nav{
    grid-template-columns:1fr;
    gap:0;
  }
  .project-nav a:last-child,
  .case-study-v86 .case-nav a:last-child{
    border-top:1px solid var(--line);
    text-align:right;
  }
}

/* iPhone landscape: use horizontal space without reverting to the desktop layout. */
@media (max-width:900px) and (orientation:landscape) and (max-height:520px){
  .site-header{
    display:flex;
    padding-top:10px;
    padding-bottom:10px;
  }
  .site-header nav{
    margin-top:0;
    margin-inline:0;
    padding-inline:0;
  }
  .brand span{
    display:none;
  }
  .home-grid .hero-img{
    height:74vh;
  }
  .work-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
    margin-inline:0;
  }
  .work-card.p6 .work-meta.work-meta-visible{
    padding-left:0 !important;
    padding-right:0 !important;
  }
  .solutions-grid.v8{
    grid-template-columns:repeat(2,minmax(0,1fr));
    margin-inline:0;
  }
  .solution-card.v8 .solution-visual{
    height:52vw;
    max-height:360px;
  }
  .case-study-v86 .case-evidence{
    width:auto;
    margin-inline:0;
  }
}

/* Coarse-pointer tuning — interaction only, never desktop composition. */
@media (max-width:1100px) and (hover:none) and (pointer:coarse){
  .work-card img{
    transition:none;
  }
  .work-card:hover img{
    transform:none;
  }
  a, .btn{
    -webkit-tap-highlight-color:rgba(17,18,20,.08);
  }
}