/* Shared navigation, loaded after the page-specific styles. */
:root { --header-height: 88px; }
html { scroll-padding-top: calc(var(--header-height) + 20px); }
body .header.site-header {
  position: sticky;
  top: 0;
  z-index: 20;
  height: var(--header-height);
  min-height: var(--header-height);
  padding: 0 var(--gutter);
  gap: 28px;
  flex-wrap: nowrap;
}
.site-header .wordmark { flex-shrink: 0; }
.site-header .brand-kind { flex-shrink: 0; }
.site-header .site-nav { margin-left: auto; gap: 24px; }
.site-header .site-nav a { min-height: 44px; display: inline-flex; align-items: center; }
.site-header .header-contact {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: 0 18px;
  border: 1px solid #bfc0b8;
  font-size:var(--type-caption);
  white-space: nowrap;
}
.site-header .header-contact:hover { background: var(--paper); color: var(--ink); }
body .site-header .menu-toggle { display: none; }
@media (max-width: 1200px) {
  .site-header .brand-kind { display: none; }
  .site-header .site-nav { gap: 20px; }
}
@media (max-width: 1000px) {
  :root { --header-height: 74px; }
  body .header.site-header { gap: 12px; }
  .site-header .wordmark { font-size:var(--type-lead); letter-spacing: -1.2px; }
  .site-header .header-contact { margin-left: auto; padding: 0 12px; }
  body .site-header .menu-toggle { display: flex; align-items: center; justify-content: center; margin: 0; width: 44px; min-height: 44px; flex-shrink: 0; font-size:var(--type-subheading); }
  .site-header .site-nav {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    padding: 16px var(--gutter) 24px;
    background: var(--ink);
    flex-direction: column;
    align-items: stretch;
    gap: 4px;
    max-height: calc(100dvh - var(--header-height));
    overflow-y: auto;
  }
  .site-header.menu-open .site-nav { display: flex; }
  .site-header .site-nav a { font-size:var(--type-body); padding: 10px 0; }
}
@media (max-width: 380px) {
  body .header.site-header { gap: 4px; padding-inline: 16px; }
  .site-header .wordmark { font-size:var(--type-lead); letter-spacing: -1px; }
  .site-header .header-contact { font-size:var(--type-caption); padding: 0 6px; }
}
@media print { body .header.site-header { display: none; } }

/* Audit 10: at least 44px high touch targets across the site. */
@media(max-width:1000px){
  body a,body button{min-height:44px}
  body a:not([class]),body .wordmark,body .credit-case,body .profile-jump,body .lab-film-link{display:inline-flex;align-items:center}
  body .lab-film-link{vertical-align:middle}
  body .wordmark{padding-top:0;padding-bottom:0}
}


/* Second review: proof before examples, clearer contact hierarchy and image-first mobile hero. */
.hero h1{font-size:var(--type-display)}
.hero-content{padding-bottom:86px}
.hero-image-caption{position:absolute;left:var(--gutter);right:var(--gutter);bottom:18px;padding:0;background:transparent;color:var(--paper);font-size:var(--type-caption);max-width:600px}
.hero-facts{gap:0}
.hero-facts li{font-size:var(--type-body);padding-right:28px;max-width:none}
.hero-facts li+li{border-left:1px solid #f5f5f166;padding-left:28px}
.section-title sup{position:static;display:inline-block;vertical-align:super;margin-left:.6em;font-size:var(--type-caption);line-height:1}
.works>.section-title{padding-right:0}
.preparation{padding-top:80px;padding-bottom:70px;margin-top:80px;border-top:1px solid var(--line)}
.preparation-heading{margin-bottom:32px}
.preparation-heading h2{font-size:var(--type-subheading);letter-spacing:-.035em;line-height:1.15;margin:18px 0}
.preparation-heading>p:last-child{font-size:var(--type-body);line-height:1.5;color:var(--muted)}
.preparation-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px}
.preparation-card{min-width:0;display:grid;grid-template-rows:1fr 44px;gap:12px}
.preparation-card-link{display:flex;flex-direction:column;align-items:flex-start;height:auto}
.preparation-image{position:relative;display:block;width:100%;aspect-ratio:16/9;overflow:hidden;background:var(--ink)}
.preparation-image img{width:100%;height:100%;transition:transform .5s var(--ease)}
.preparation-image>span{position:absolute;right:16px;bottom:12px;color:white;font-size:var(--type-subheading);text-shadow:0 1px 5px #000}
.preparation-card-link:hover img{transform:scale(1.035)}
.preparation-card .work-type{margin:20px 0 12px}
.preparation-card h3{font-size:var(--type-subheading);letter-spacing:-.035em;line-height:1.15}
.preparation-card p{font-size:var(--type-body);color:var(--muted);line-height:1.5;margin:14px 0 24px}
.preparation-cta{font-size:var(--type-caption);padding:12px 0;border-bottom:1px solid;min-height:44px;margin-top:auto}
.preparation-extra{font-size:var(--type-caption);min-height:44px;align-self:start;margin-top:0;text-align:left;text-decoration:underline;text-underline-offset:4px}
.contact-method h3{font-size:var(--type-caption);color:var(--muted);letter-spacing:0;margin-bottom:10px}
.contact-method>.text-link{font-size:var(--type-subheading);letter-spacing:-.035em;overflow-wrap:anywhere;max-width:100%}
.footer-contacts a{font-size:var(--type-body)}
.strip-overflow{position:relative}
.strip-scroll-hint{display:none}
.service-card h3{font-size:var(--type-subheading)}
.service-card p,.order-details dd{font-size:var(--type-body)}
.hero-description{max-width:660px}
.hero h1{max-width:1200px}
.lab h2{font-size:var(--type-display)}
@media(max-width:1000px){.site-header .wordmark{font-size:var(--type-lead);letter-spacing:-1px}}
@media(max-width:767px){
 .hero{height:auto;min-height:0;max-height:none;background:var(--ink)}
 .hero-image{height:330px;object-position:63% center}
 .hero-shade{height:330px;background:linear-gradient(180deg,transparent 66%,var(--ink) 100%)}
 .hero-content{min-height:0;padding-top:330px;padding-bottom:32px;gap:24px}
 .hero h1{font-size:var(--type-title);line-height:1.05}
 .hero-image-caption{top:267px;bottom:auto;max-width:285px;text-shadow:0 1px 5px #000}
 .hero-facts{gap:0;padding-top:0;border-top:0}
 .hero-facts li{padding:12px 0;font-size:var(--type-body);border-top:1px solid #f5f5f166}
 .hero-facts li+li{border-left:0;padding-left:0}
 .hero-actions{margin-top:20px;gap:12px 20px}
 .hero-description p{font-size:var(--type-body)}
 .preparation{padding-top:44px;padding-bottom:45px;margin-top:48px}
 .preparation-cards{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:20px;padding-bottom:18px}
 .preparation-card{flex:0 0 87%;scroll-snap-align:start}
 .preparation-card-link{min-height:0}
 .strip-scroll-hint{display:flex;justify-content:space-between;gap:16px;font-size:var(--type-caption);line-height:1.5;margin-bottom:16px;color:var(--muted)}
 .lab .strip-scroll-hint{color:#c7c9c0}
 .strip-overflow[data-scrollable="true"]:not([data-at-end="true"]):after{content:"";position:absolute;right:0;top:0;bottom:18px;width:26px;background:linear-gradient(90deg,transparent,rgba(20,21,18,.2));pointer-events:none}
 .lab .strip-overflow[data-scrollable="true"]:not([data-at-end="true"]):after{width:36px;background:linear-gradient(90deg,transparent,var(--ink))}
 .contact-method>.text-link{font-size:var(--type-lead)}
 .services>.section-title,.section-title{font-size:var(--type-title)}
 .storyboard-service .case-intro h1,.concept-page .case-intro h1,.rate-intro h1,.profile-filmography-heading h2{font-size:var(--type-heading)}
 .profile-bio h1,.director-bio h1{font-size:var(--type-display)}
 .contact h2{font-size:var(--type-title)}
}
@media print{.strip-scroll-hint{display:none}.strip-overflow:after{display:none}}

/* Две языковые версии: на узком экране кнопка «Написать» уступает место переключателю языка –
   контакты есть в меню, а переключатель нужен всегда. */
@media(max-width:767px){
  .site-header .header-contact{display:none}
  .site-header .language{margin-left:auto;padding-left:0;border:0}
  .site-header .menu-toggle{margin-left:18px}
}