/* Mobile layout: a single set of sizing rules shared by RU and EN. */
@media (max-width:700px) {
 html { scrollbar-gutter:auto; background:#141416; }
 body { width:100%; min-width:0; padding:0; background:#141416; }
 main { width:100%; max-width:none; margin:0; overflow:clip; }
 main > * { min-width:0; }
 .header, .hero, .discipline-bar, .section, footer { width:100%; max-width:none; margin-inline:0; }
 .header { gap:0 12px; }
 .header nav { min-width:0; gap:8px; flex-wrap:wrap; }
 .header nav a { min-height:44px; font-size:13px; gap:4px; }
 .hero.hero-noir { align-items:stretch; gap:0; padding-bottom:16px; border:0; }
 .noir-social { width:100%; min-width:0; left:auto; right:auto; bottom:auto; flex-wrap:wrap; gap:8px 28px; margin-top:22px; padding-top:0; border:0; }
 .noir-social a { min-height:44px; font-size:14px; }
 .discipline-bar { align-items:center; text-align:center; gap:12px; padding:24px 6% 30px; border:0; box-shadow:none; background:linear-gradient(180deg,#141416,#161619); }
 .discipline-bar > span { max-width:100%; overflow-wrap:break-word; }
 .section { padding-inline:6%; }
 .about { display:block; min-height:0; padding-top:30px; padding-bottom:56px; border:0; box-shadow:none; }
 .about .about-side { display:block; margin:0; }
 .about .about-side + div { display:block; min-width:0; }
 .about .section-index { position:relative; inset:auto; margin:0 0 320px; }
 .about::before { width:100%; background-size:auto 660px; background-position:58% top; mask-image:linear-gradient(180deg,transparent 0px,#000 120px); -webkit-mask-image:linear-gradient(180deg,transparent 0px,#000 120px); box-shadow:none; }
 .about::after { background:linear-gradient(180deg,#161619 0px,#161619cc 40px,#16161930 130px,#16161918 270px,#161619a8 365px,#161619f5 445px,#161619 560px); }
 .about h2 { font-size:clamp(28px,7.7vw,40px); line-height:1.17; margin:0 0 26px; }
 .about-description, .mission-description { max-width:100%; font-size:16px; line-height:1.75; overflow-wrap:break-word; }
 .about .about-description { margin:0 0 24px; }
 .expertise { display:flex; flex-wrap:wrap; gap:8px; margin:28px 0; }
 .expertise span { max-width:100%; font-size:12px; line-height:1.5; padding:8px 10px; overflow-wrap:break-word; }
 .about .text-link { display:inline-flex; max-width:100%; min-height:44px; }
 .mission { display:grid; grid-template-columns:minmax(0,1fr); gap:0; min-height:0; padding:24px 6% 60px; }
 .mission-copy { display:contents; }
 .mission .section-index { grid-row:1; margin:0 0 16px; }
 .mission-portrait { grid-row:2; position:relative; inset:auto; width:100%; height:clamp(280px,90vw,400px); margin:0 0 24px; z-index:0; overflow:hidden; }
 .mission-portrait img { object-position:50% 30%; mask-image:linear-gradient(180deg,transparent,#000 18%,#000 64%,transparent); -webkit-mask-image:linear-gradient(180deg,transparent,#000 18%,#000 64%,transparent); }
 .mission-portrait::after { background:linear-gradient(90deg,#161619,transparent 15%,transparent 85%,#161619),linear-gradient(180deg,#161619,transparent 20%,transparent 65%,#161619); }
 .mission h2 { grid-row:3; font-size:clamp(28px,7.5vw,38px); line-height:1.2; margin:0 0 24px; min-width:0; overflow-wrap:break-word; }
 .mission-description { grid-row:4; }
 .projects { padding-top:54px; padding-bottom:56px; }
 .projects h2 { font-size:clamp(30px,8.5vw,44px); line-height:1.15; margin:22px 0; }
 .project-count { margin:0 0 20px; }
 .project-grid.project-carousel { width:100%; margin-inline:0; }
 .carousel-stage { grid-template-columns:minmax(0,1fr); padding:16px 0 28px; }
 .project-carousel .project { width:82%; max-width:300px; min-width:0; box-shadow:0 12px 28px #0005; }
 .project-carousel .project-info { padding:14px 7px 0; }
 .project-carousel .project-meta { font-size:10px; letter-spacing:0; gap:6px; }
 .project-carousel .project-info p { font-size:14px; line-height:1.65; overflow-wrap:break-word; }
 .carousel-controls { gap:8px; max-width:100%; }
 .contact { padding-top:54px; padding-bottom:48px; }
 .contact-heading { display:block; }
 .contact h2 { font-size:clamp(40px,12vw,64px); line-height:1.12; margin:28px 0; }
 .contact-heading > p { min-width:0; margin:0 0 28px; }
 .email { display:flex; width:fit-content; max-width:100%; font-size:clamp(25px,7.5vw,36px); gap:12px; letter-spacing:0; }
 .email svg { width:22px; height:22px; }
 .contact-links { display:grid; grid-template-columns:minmax(0,1fr); gap:24px; }
 .contact-links > a { width:100%; min-width:0; }
 footer { gap:20px; padding:28px 6%; }
}
/* Stretch the native link over its card; side-card clicks still select a slide. */
.project-carousel .project { position:relative; }
.project-carousel .project[data-offset="0"] { cursor:pointer; }
.project-carousel .project h3 a { display:flex; justify-content:space-between; align-items:center; gap:12px; min-height:44px; }
.project-carousel .project h3 a::after { content:''; position:absolute; inset:0; z-index:4; border-radius:16px; }
.project-carousel .project h3 a:focus-visible { outline:none; }
.project-carousel .project[data-offset="0"] h3 a:focus-visible::after { outline:2px solid #f34460; outline-offset:-3px; }
.project-carousel .project h3 a svg { display:block; width:22px; height:22px; }
.project-carousel .project h3 a:hover { color:inherit; }
@media (hover:hover) {
 .project-carousel:not(.is-moving) .project[data-offset="0"] h3 a:hover { color:#f34460; }
}
/* Dim opaque cards instead of fading their entire surfaces through each other. */
.project-carousel .project[data-offset] {
 opacity:1; background:#1c1c20; border-color:#34343b;
 filter:brightness(.52); backface-visibility:hidden;
 transition:transform .38s cubic-bezier(.22,.61,.36,1),filter .38s ease;
}
.project-carousel .project[data-offset="-1"],
.project-carousel .project[data-offset="1"],
.project-carousel .project[data-offset="0"] {
 opacity:1; transition-delay:0s; visibility:visible;
}
.project-carousel .project[data-offset="0"] { filter:brightness(1); border-color:#8b3444; }
.project-carousel .project:not([data-offset="0"]) h3 a { pointer-events:none; }
.project-carousel.is-moving .project h3 a { pointer-events:none; }
.project-carousel.is-moving .project { will-change:transform; }