/* V31: loaded after each page's styles; desktop layout remains unchanged. */
.responsive-links { display:contents; }
.responsive-toggle, .mobile-brand { display:none; }
.responsive-links[hidden] { display:none !important; }
.responsive-toggle:focus-visible, .responsive-nav a:focus-visible { outline:2px solid var(--accent); outline-offset:5px; }
@media (max-width:900px) {
  .nav.responsive-nav, .case-page .nav.responsive-nav {
    position:relative; display:flex; flex-wrap:wrap; justify-content:space-between;
    gap:0; min-height:72px; padding:12px 24px; background:var(--ink); z-index:40;
  }
  .hero .nav.responsive-nav { position:absolute; inset:0 0 auto; }
  .hero { height:auto; min-height:0; }
  .hero-content { position:relative; left:auto; top:auto; transform:none; width:min(100%,720px); margin-inline:auto; padding:130px 32px 72px; }
  .nav .mobile-brand { display:block; font-size:13px; letter-spacing:.12em; }
  .responsive-toggle {
    display:flex; align-items:center; justify-content:center; gap:10px;
    min-width:44px; min-height:44px; padding:8px 0 8px 12px;
    background:none; border:0; color:inherit; font:inherit; cursor:pointer;
  }
  .hamburger { display:grid; gap:5px; width:22px; }
  .hamburger i { display:block; width:22px; height:1px; background:currentColor; }
  .is-expanded .hamburger i:nth-child(1) { transform:translateY(6px) rotate(45deg); }
  .is-expanded .hamburger i:nth-child(2) { opacity:0; }
  .is-expanded .hamburger i:nth-child(3) { transform:translateY(-6px) rotate(-45deg); }
  .responsive-nav .responsive-links {
    display:flex; flex-direction:column; align-items:flex-start; width:100%;
    gap:4px; padding:12px 0; max-height:65dvh; overflow-y:auto;
  }
  .responsive-links > a, .responsive-links > .disabled-link {
    display:flex; align-items:center; min-height:44px; padding:10px 0; font-size:13px;
  }
  .responsive-links > [hidden] { display:none !important; }
  .case-contents.responsive-nav { position:sticky; top:0; display:block; padding:6px 24px; z-index:30; }
  .case-contents .responsive-toggle { width:100%; justify-content:space-between; padding:8px 0; font-size:14px; }
  .is-expanded .section-chevron { transform:rotate(180deg); }
  .case-contents .responsive-links { max-height:55dvh; }
  .chapter { scroll-margin-top:70px; }
  .case-hero .case-brand h1 { overflow-wrap:anywhere; min-width:0; }
  .source-layout .comparison-row .ufo--column > .media-container { aspect-ratio:auto; }
  .source-layout .comparison-row .ufo--column > .media-container img { height:auto; }
  .source-layout .device-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .source-layout .device-carousel { gap:20px; }
  .source-layout .device-carousel > .gallery-item { flex:0 0 65%; }
  .source-layout .device-carousel > .gallery-item.wide-device { flex-basis:90%; }
  .contact input, .contact textarea { font-size:16px; }
}
@media (max-width:600px) {
  .hero { min-height:0; height:auto; }
  .hero-content { padding:118px 24px 64px; }
  .hero .tagline { font-size:22px; }
  .hero .intro { line-height:1.6; }
  .cards, .case-cards { grid-template-columns:minmax(0,1fr); }
  .card h3 { font-size:17.5px; line-height:1.45; }
  .section-title { font-size:20px; overflow-wrap:break-word; }
  .project-nav, .case-project-nav { display:grid; grid-template-columns:1fr 1fr; gap:8px 20px; padding:16px 24px; }
  .project-nav > :nth-child(2) { grid-column:1/-1; grid-row:1; justify-self:center; }
  .project-nav > :first-child { grid-column:1; grid-row:2; }
  .project-nav > :last-child { grid-column:2; grid-row:2; justify-self:end; text-align:right; }
  .project-nav a, .case-project-nav a { font-size:12px; min-height:44px; display:flex; align-items:center; }
  .case-hero { padding:40px 24px; --brand-offset:56px; }
  .case-logo { width:40px; }
  .case-hero .case-brand { gap:16px; }
  .case-hero .case-brand h1 { font-size:clamp(26px,7vw,38px); line-height:1.15; }
  .case-hero .eyebrow { font-size:10px; line-height:1.6; letter-spacing:.1em; }
  .case-hero .case-subtitle { font-size:18px; line-height:1.4; }
  .chapter { gap:14px; padding:24px; align-items:center; }
  .chapter > span { font-size:28px; flex-shrink:0; }
  .chapter h2 { font-size:17px; line-height:1.4; letter-spacing:.06em; min-width:0; }
  .source-layout .grid-wrapper { width:calc(100% - 48px); }
  .source-layout .grid { grid-template-columns:minmax(0,1fr); gap:28px; }
  .source-layout .col { grid-column:1/-1; }
  .source-layout .block-heading .text-container :is(h2,h3) { font-size:28px; line-height:1.3; }
  .source-layout .text-container { font-size:16px; line-height:1.6; }
  .source-layout .text-container :is(h2,h3,h4) { overflow-wrap:break-word; }
  .source-layout .device-grid { grid-template-columns:minmax(0,1fr); }
  .source-layout .device-grid > .gallery-item { width:100%; max-width:340px; margin-inline:auto; }
  .source-layout .device-grid > .gallery-item.wide-device { max-width:none; }
  .source-layout .device-carousel > .gallery-item { flex-basis:85%; }
  .source-layout .device-carousel > .gallery-item.wide-device { flex-basis:96%; }
  .video-slot { width:calc(100% - 48px); }
  .compact-grid .project-gallery { grid-template-columns:minmax(0,1fr); gap:28px; }
  .project-social .section-layout { width:calc(100% - 48px); }
  .project-page .section-copy { padding-inline:24px; }
  .project-page .section-copy-inner { width:100%; max-width:100%; }
  .footer { flex-wrap:wrap; gap:20px; }
  .case-viewer { padding:76px 16px 24px; }
  .viewer-close, .book-viewer-close, .book-viewer-prev, .book-viewer-next { min-width:44px; min-height:44px; }
}
