/* Shared compact navigation. */
@media (max-width:1100px) {
 .menu-open .header{position:fixed;background:rgba(29,33,28,.96)}
 .header nav{height:calc(100dvh - var(--nav-height));max-height:calc(100dvh - var(--nav-height));padding:12px max(24px,calc((100vw - 640px)/2)) max(32px,env(safe-area-inset-bottom));background:rgba(29,33,28,.97);color:#f4f4ee;box-shadow:none;scrollbar-width:thin;scrollbar-color:#7a8273 transparent}
 .header nav>a,.header .nav-group{flex:0 0 auto;border-color:#ffffff24}
 .header nav>a,.header .nav-parent>a{min-height:76px;padding:15px 0;font-size:20px;letter-spacing:2px}
 .header .nav-parent{min-height:76px}
 .header .nav-label-en{font-size:11px;letter-spacing:1.5px;opacity:.65;margin-top:1px}
 .header .nav-submenu{background:transparent;border-left:1px solid #8b987d;padding:0 0 0 19px;margin:0 0 20px 2px;width:calc(100% - 2px)}
 .header .nav-submenu a{padding:12px 4px;font-size:15px;line-height:1.6;border-color:#ffffff18;white-space:normal}
 .header .nav-submenu .nav-label-en{font-size:10px;letter-spacing:1px;color:#b7c0ad}
 .header .nav-submenu a:hover,.header .nav-submenu a:focus-visible{background:#ffffff0b;color:#fff}
 .header nav>a:last-child{margin-top:20px;padding:17px 20px;border:1px solid #ffffff45;min-height:76px}
}

/* Mobile spacing, reading rhythm and touch targets. */
@media (max-width:800px) {
 :root{--mobile-gutter:24px;--content-width:calc(100% - var(--mobile-gutter)*2)}
 .home-studio,.home-awards,.home-news,.works-intro,.works-collection,.media-collection,.journal-collection,.contact-layout,.project-story{padding-left:0;padding-right:0;margin-left:auto;margin-right:auto}
 .home-studio{gap:36px}
 .contact-layout{grid-template-columns:1fr}
 .works-toolbar{width:100%;align-items:start}
 .works-filters{min-width:0;width:100%}
 .pagination{flex-wrap:wrap;justify-content:center;gap:12px}
 .pagination .page-numbers{order:3;width:100%;display:flex;justify-content:center;flex-wrap:wrap;gap:6px}
 .pagination .page-number{width:40px;min-width:40px;height:44px;display:grid;place-items:center;font-size:14px}
 .pagination .page-step{min-height:44px;display:inline-flex;align-items:center;justify-content:center;padding:10px 22px}
 .pagination .page-ellipsis{height:44px}
 .project-story,.works-collection,.journal-collection,.media-collection{scroll-margin-top:100px}
 .detail .hero-content{width:var(--content-width)}
 .contact-form-panel{padding:32px 28px}
 .studio-contact-list>div:has(address){grid-template-columns:1fr;gap:6px}
 .studio-map{min-height:320px}
 .journal-body iframe,.journal-body video{max-width:100%}
}

@media (max-width:600px) {
 :root{--mobile-gutter:20px}
 html{scroll-padding-top:96px}
 .header{--nav-height:76px;padding:0 var(--mobile-gutter)}
 .header .brand-logo{width:120px}
 .menu-toggle{margin-right:-8px}
 .header nav{padding-left:24px;padding-right:24px}
 .header nav>a,.header .nav-parent>a{min-height:72px;font-size:19px;padding:13px 0}
 .header .nav-parent{min-height:72px}
 .works-intro{padding-top:120px;padding-bottom:32px;gap:16px}
 .works-intro h1{font-size:29px;line-height:1.5;letter-spacing:3px;margin-top:10px}
 .works-intro p{font-size:14px;line-height:1.9}
 .eyebrow{font-size:10px;letter-spacing:2px}
 .opening-scene{height:100svh;min-height:540px;max-height:none}
 .opening-copy{top:auto;bottom:14%;left:var(--mobile-gutter);right:var(--mobile-gutter);transform:none}
 .opening-copy h1{font-size:32px;letter-spacing:3px;line-height:1.55;margin-bottom:16px}
 .opening-subtitle{font-size:17px;line-height:1.6}
 .opening-scene[data-tone=dark] .opening-shade{background:linear-gradient(0deg,#16201695,transparent 70%)}
 .home-studio{padding-top:48px;padding-bottom:56px;gap:32px}
 .studio-portrait>img{aspect-ratio:4/5}
 .story-chapter h2{font-size:26px;letter-spacing:1.5px;line-height:1.65;margin-bottom:20px}
 .story-chapter>p:not(.chapter-label){font-size:15px;line-height:2.05;margin-top:16px}
 .story-chapter p.story-english{font-size:17px;line-height:1.8;margin-top:20px}
 .story-chapter+.story-chapter{padding-top:30px;margin-top:32px}
 .home-awards{padding-top:32px;margin-top:0;margin-bottom:64px}
 .awards-heading{margin-bottom:28px}
 .awards-heading h2{font-size:26px;letter-spacing:3px;margin-top:10px}
 .award-gallery{--award-columns:3;--award-gap:16px;row-gap:22px}
 .award-history{margin-top:30px}
 .award-history>summary{padding:20px 0;gap:10px}
 .award-history-title{font-size:16px;letter-spacing:.5px}
 .award-history-toggle{width:32px;height:32px}
 .award-history-more{min-height:48px}
 .award-history-entry{font-size:14px;line-height:1.9}
 .home-news{margin-bottom:64px}
 .news-heading{margin-bottom:30px}
 .news-heading h2{font-size:27px;letter-spacing:3px}
 .home-news-grid{gap:28px}
 .news-card-image{aspect-ratio:1.08}
 .news-card-body{padding:22px 22px 26px}
 .news-card-body h3{font-size:17px;line-height:1.8;letter-spacing:.5px;margin-bottom:0}
 .news-card-category{font-size:11px;letter-spacing:1px;margin-bottom:12px}
 .works-banner{height:78svh;min-height:440px}
 .works-banner+.works-intro{padding-top:36px;padding-bottom:24px}
 .works-toolbar{margin-bottom:28px;padding-bottom:0;border-bottom:0}
 .works-filters{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;font-size:13px;letter-spacing:.5px}
 .works-filters a,.works-filters span{display:flex;align-items:center;justify-content:center;text-align:center;min-height:44px;padding:10px 8px;border:1px solid #dfe3da;line-height:1.5}
 .works-filters [aria-current]{background:#30372b;border-color:#30372b;color:#fff}
 .works-filters [aria-current]:after{display:none}
 .media-collection .works-filters{grid-template-columns:repeat(2,minmax(0,1fr))}
 .media-collection .works-filters>:first-child{grid-column:1/-1}
 .works-gallery{gap:32px}
 .works-row{gap:24px 14px}
 .works-caption{padding-top:12px}
 .works-caption h2{font-size:14px;letter-spacing:0}
 .works-caption p{font-size:11px;letter-spacing:.5px;margin-top:6px}
 .journal-intro{padding-bottom:20px}
 .journal-intro h1{letter-spacing:3px}
 .journal-grid{grid-template-columns:1fr;gap:64px}
 .journal-caption{padding-top:22px}
 .journal-caption h2{font-size:17px;line-height:1.85;letter-spacing:.3px;margin-bottom:26px}
 .journal-meta{font-size:11px;letter-spacing:.7px}
 .journal-excerpt{padding-top:18px}
 .journal-excerpt p{font-size:14px;line-height:1.95}
 .featured-video{margin-bottom:32px}
 .featured-video .video-caption{padding:22px}
 .featured-video .video-caption h2,.video-caption h2{font-size:15px;line-height:1.85;letter-spacing:.3px}
 .video-grid{grid-template-columns:1fr;gap:32px}
 .video-category{font-size:11px;letter-spacing:.8px;margin-bottom:10px}
 .video-caption{padding-top:16px}
 .video-play{width:48px;height:48px}
 .video-feature-label{font-size:11px;top:12px;left:12px}
 .video-dialog-panel{width:calc(100% - 24px);margin:12svh auto 24px;padding:14px}
 .video-dialog-heading h2{font-size:14px;line-height:1.75}
 .video-dialog-heading{padding-bottom:14px}
 .video-external{min-height:44px;display:inline-flex;align-items:center;margin-top:8px}
 .about-intro{padding-bottom:28px}
 .about-intro h1{font-size:20px;letter-spacing:1.5px;margin:0}
 .about-director{padding:32px 0 40px}
 .director-inner{gap:28px}
 .director-portrait{padding:0}
 .director-portrait img{aspect-ratio:4/5;height:auto;object-fit:cover;object-position:center 20%}
 .director-portrait figcaption{font-size:11px;letter-spacing:1px;margin-top:14px}
 .director-role{margin:0 0 8px;font-size:13px;line-height:1.8}
 .director-profile h2{font-size:34px;letter-spacing:5px;margin-bottom:20px}
 .director-description{font-size:15px;line-height:2}
 .director-credentials{margin-top:24px}
 .director-credentials>div{grid-template-columns:1fr;gap:8px;padding:18px 0;font-size:14px;line-height:1.9}
 .director-credentials dt{font-size:12px;letter-spacing:1.5px}
 .about-director+.about-overview{margin-top:48px}
 .about-overview{gap:28px;margin-bottom:36px}
 .about-manifesto h2{font-size:27px;line-height:1.65;letter-spacing:1px;margin:0 0 22px}
 .about-manifesto>p{font-size:15px;line-height:2.05}
 .about-manifesto>p.about-english{font-size:17px;line-height:1.8;margin-top:20px}
 .about-space img{aspect-ratio:4/3}
 .about-principles{grid-template-columns:1fr;gap:0;padding:0;margin-bottom:52px}
 .about-principles article{padding:24px 0;border-bottom:1px solid var(--line)}
 .about-principles h3{font-size:23px;margin:0 0 12px;letter-spacing:2px}
 .about-principles p{font-size:15px;line-height:2}
 .about-section-heading{gap:12px;margin-bottom:26px}
 .about-section-heading h2{font-size:27px;letter-spacing:3px}
 .process-grid{gap:14px}
 .process-step{padding:18px 20px}
 .process-step summary{gap:16px;min-height:44px}
 .process-number{font-size:23px}
 .process-name{font-size:19px;letter-spacing:1px}
 .process-content{margin-top:12px;padding-top:18px}
 .process-content h3{font-size:15px}
 .process-content p{font-size:14px;line-height:1.95}
 .contact-layout{margin-bottom:56px}
 .contact-visual{min-width:0;min-height:0;height:clamp(280px,83vw,360px);aspect-ratio:auto}
 .contact-visual-caption{left:24px;right:24px;bottom:24px}
 .contact-visual-caption>span{font-size:10px;letter-spacing:2px}
 .contact-visual-caption h2{font-size:23px;letter-spacing:1px;margin:12px 0}
 .contact-visual-caption p{font-size:14px;line-height:1.9;letter-spacing:.5px}
 .contact-form-panel{padding:28px 22px 30px}
 .contact-form-heading{gap:6px;margin-bottom:28px}
 .contact-form-heading h2{font-size:20px;letter-spacing:1px;line-height:1.6}
 .contact-form-heading p{font-size:11px}
 #consultation-form fieldset{margin-bottom:30px}
 #consultation-form legend{padding-bottom:14px;margin-bottom:22px;font-size:14px;letter-spacing:1.5px}
 .contact-fields{grid-template-columns:1fr;gap:22px}
 .contact-field label{font-size:14px;margin-bottom:8px}
 .contact-field input,.contact-field select{min-height:52px;font-size:16px;padding:13px 12px;border-radius:2px}
 .contact-field select{padding-right:36px}
 .input-with-unit input{padding-right:44px}
 .contact-submit-row{padding-top:24px}
 .contact-submit-row .contact-submit{width:100%;min-height:52px}
 .consultation-location{gap:32px;margin-bottom:64px}
 .consultation-details h2{font-size:28px;letter-spacing:1px;line-height:1.6;margin-top:14px}
 .studio-contact-list{margin:28px 0 24px}
 .studio-contact-list>div{padding:18px 0;gap:6px}
 .studio-contact-list dd{font-size:16px}
 .studio-contact-list address{font-size:15px;letter-spacing:0}
 .studio-social-links{gap:10px;max-width:none}
 .studio-social-links :is(a,button){min-height:48px;padding:12px 14px}
 .studio-map{min-height:300px}
 .studio-map-caption{gap:12px;padding:18px 0}
 .studio-map-caption>a{gap:10px;font-size:11px;letter-spacing:.5px;min-height:44px}
 .review-panel{width:calc(100% - 24px);padding:26px 20px;margin:24px auto max(24px,env(safe-area-inset-bottom))}
 .review-heading{gap:10px;margin-bottom:22px}
 .review-heading h2{font-size:22px;letter-spacing:1px}
 .review-data>div{grid-template-columns:80px minmax(0,1fr);gap:12px;font-size:14px}
 .review-actions{gap:12px;flex-wrap:wrap}
 .review-actions button{min-height:48px}
 .review-actions .contact-submit{flex:1;padding:12px 16px;letter-spacing:1px}
 .review-note{font-size:14px;line-height:1.9}
 .detail .project-hero{min-height:620px;height:90svh}
 .detail .hero-content h1{font-size:26px;line-height:1.6;letter-spacing:.5px;text-wrap:pretty}
 .detail .project-info dt{min-width:76px}
 .detail .project-info>div{gap:16px}
 .project-story{padding-top:30px;padding-bottom:64px}
 .work-copy{font-size:15px;line-height:2.05;margin:30px auto}
 .detail .project-navigation{flex-wrap:wrap;gap:16px;justify-content:space-between}
 .detail .project-navigation a{min-height:44px;display:inline-flex;align-items:center}
 .detail .project-navigation .back-link{order:3;width:100%;justify-content:center}
 .journal-article{padding-top:118px;padding-bottom:64px}
 .journal-breadcrumb{margin-bottom:24px;min-height:44px;display:inline-flex;align-items:center}
 .journal-article-head h1{font-size:25px;line-height:1.65;letter-spacing:.5px;text-wrap:pretty}
 .journal-body{font-size:16px;line-height:2.05}
 .journal-body h2,.journal-body h3{font-size:23px;line-height:1.7}
 .journal-body ul,.journal-body ol{padding-left:24px}
 .journal-article-nav{gap:20px}
 .journal-article-nav .back-link{min-height:44px;display:inline-flex;align-items:center}
 footer{padding:42px var(--mobile-gutter) max(24px,env(safe-area-inset-bottom))}
 .footer-top{gap:26px;padding-bottom:32px}
 .footer-top p{font-size:15px;line-height:1.9;letter-spacing:1px}
 .footer-top p span{font-size:12px;letter-spacing:.5px}
 .footer-bottom{gap:12px;padding-top:20px;letter-spacing:.5px}
 .top-button{min-height:44px;display:inline-flex;align-items:center;white-space:nowrap}
}
@media (max-width:360px) {
 :root{--mobile-gutter:18px}
 .opening-copy h1{font-size:29px}
 .opening-subtitle{font-size:16px}
 .works-row{grid-template-columns:1fr}
 .works-row .works-image{aspect-ratio:4/3}
 .works-row .works-card:first-child:nth-last-child(3) .works-image{aspect-ratio:4/3}
 .contact-form-panel{padding-left:18px;padding-right:18px}
 .contact-visual-caption{left:20px;right:20px}
 .contact-visual-caption h2{font-size:21px}
 .studio-contact-list address{font-size:14px}
 .studio-map-caption{align-items:start;flex-wrap:wrap}
 .award-history-period{font-size:10px;letter-spacing:0}
 .award-history-title{font-size:15px}
 .award-history>summary{gap:8px}
 .award-history-more{gap:14px;font-size:12px}
}
@media (max-width:1100px) and (max-height:500px) and (orientation:landscape) {
 .header{--nav-height:64px}
 .header .brand-logo{width:106px}
 .header nav{padding-top:4px}
 .header nav>a,.header .nav-parent>a{min-height:64px;padding:10px 0}
 .header .nav-parent{min-height:64px}
}
