.site-header{display:grid;grid-template-columns:auto 1fr auto;gap:30px}
.site-header #main-nav{justify-self:end;gap:28px}
.site-header .nav-contact{margin-left:8px;gap:20px}
.header-controls{display:flex;align-items:center;gap:16px}
.language-switch{display:flex;border:1px solid var(--line);flex-shrink:0}
.language-switch a{display:grid;place-items:center;min-width:44px;min-height:44px;font-size:12px;letter-spacing:.6px;line-height:1;transition:background .2s,color .2s}
.language-switch a+a{border-left:1px solid var(--line)}
.language-switch a[aria-current=true]{background:var(--wine);color:var(--cream)}
.language-switch a:hover{background:var(--wine);color:var(--cream)}
:lang(sr-Latn) .hero-copy h1{font-size:clamp(62px,6.4vw,104px);line-height:1.02}
:lang(sr-Latn) .page-hero>h1{font-size:clamp(52px,6.4vw,106px)}
:lang(sr-Latn) .about-manifesto h2{font-size:clamp(50px,6.2vw,96px)}
:lang(sr-Latn) .service-detail h2{font-size:clamp(38px,3.9vw,58px)}
:lang(sr-Latn) .service-detail h2 br{display:block}
:lang(sr-Latn) .service-detail h2 em{margin-left:0}
@media(max-width:1100px){.site-header{gap:22px}.site-header #main-nav{gap:22px}.site-header .nav-contact{margin-left:0;gap:10px}}
@media(max-width:960px){
  .site-header{height:94px;grid-template-columns:minmax(0,1fr) auto;gap:15px}
  .header-controls{justify-self:end;gap:14px}
  .menu-toggle{display:flex;align-items:center;gap:12px;background:none;border:0;padding:8px 0;font-size:14px;z-index:20;min-height:44px}
  .menu-toggle span{font-size:25px}
  .site-header #main-nav{display:none;position:absolute;z-index:15;top:94px;left:0;right:0;padding:18px var(--gutter) 24px;background:var(--cream);border-bottom:1px solid var(--line);flex-direction:column;align-items:stretch;gap:4px;font-size:25px;box-shadow:0 18px 25px #46000110;max-height:calc(100vh - 94px);max-height:calc(100dvh - 94px);overflow-y:auto;overscroll-behavior:contain}
  .site-header #main-nav>a{display:flex;align-items:center;min-height:52px;padding:8px 0}
  .site-header #main-nav>a:after{bottom:5px}
  .site-header #main-nav.is-open{display:flex}
  .site-header #main-nav{width:100%;justify-self:stretch}
  .site-header .nav-contact{font-size:25px;gap:20px}
}
@media(max-width:700px){
  .brand-logo{width:42px;height:42px}.brand-lockup{gap:9px}.brand-name{font-size:29px}
  .header-controls{gap:12px}.menu-toggle{gap:9px;min-width:76px;justify-content:space-between}
  .footer-bottom>div{column-gap:24px;row-gap:0}.footer-bottom a{display:flex;align-items:center;min-height:44px;font-size:14px}
  .hero-footnote{align-items:center}.hero-footnote a,.text-link{min-height:44px;align-items:center}
  .service-detail summary{grid-template-columns:23px minmax(0,1fr) 37px}
  .service-detail h2{font-size:clamp(30px,7.6vw,36px);overflow-wrap:break-word}
  .hero-art{aspect-ratio:1.25}
  .hero-copy h1{font-size:clamp(56px,17vw,98px)}
  :lang(sr-Latn) .hero-copy h1{font-size:clamp(47px,11vw,77px)}
  :lang(sr-Latn) .hero-copy h1 br:nth-child(2){display:block}
  :lang(sr-Latn) .page-hero>h1{font-size:clamp(39px,9.8vw,66px)}
  :lang(sr-Latn) .about-manifesto h2{font-size:clamp(31px,8vw,51px)}
  :lang(sr-Latn) .service-detail h2{font-size:clamp(28px,7.2vw,32px)}
  :lang(sr-Latn) .footer-top>a{font-size:31px}
  :lang(sr-Latn) .contact-intro h1{font-size:clamp(43px,10.7vw,70px)}
}
@media(max-width:440px){.brand-name{display:none}.service-content{margin-left:0}.about-manifesto{padding:24px}.portfolio-empty{padding:24px}}