/* Shared across all server-rendered language routes. */
header .language-switch{display:flex;align-items:center;gap:2px;flex:none;margin-left:4px;font:600 12px/1.2 Avenir,'Helvetica Neue',sans-serif;letter-spacing:.03em;padding:3px;border:1px solid #e4e4e4;border-radius:100px;background:#fff}
header .language-switch a{display:flex;align-items:center;justify-content:center;min-width:34px;min-height:34px;padding:0 7px;border-radius:100px;text-decoration:none;color:#73777c}
header .language-switch a[aria-current=true]{background:#242728;color:#fff}
header .language-switch a:hover:not([aria-current=true]){background:#fff0db;color:#b96000}
header .language-switch a:focus-visible{outline:2px solid #c46600;outline-offset:3px}
header>.brand{margin-right:auto;flex-shrink:0}
header>nav{margin-left:auto}
header.legal-header{gap:20px}
header.legal-header .legal-back{margin-left:auto}
@media(min-width:761px){header{gap:20px}header #main-nav{gap:24px}}
@media(max-width:1000px) and (min-width:761px){html[lang=fr] header #main-nav{gap:14px;font-size:12px}}
@media(max-width:760px){
 header .language-switch{margin-left:0;order:1}
 header .menu-toggle{order:2;flex-shrink:0}
 header #main-nav{order:3;margin-left:0}
 header{gap:12px}
 header.legal-header .legal-back{display:none}
 header .language-switch a{min-width:32px;min-height:36px;padding:0 5px}
 header:has(nav[aria-label="Sections"]){flex-wrap:wrap;padding:14px 0;row-gap:10px}
 header:has(nav[aria-label="Sections"])>.language-switch{order:0}
 header:has(nav[aria-label="Sections"])>nav{order:1;margin-left:0}
}
@media(max-width:370px){header .brand img{width:122px!important}header{gap:8px}}

/* Desktop language links stay visually secondary to the app CTA. */
@media(min-width:761px){
 header .language-switch{gap:14px;margin-left:8px;padding:0;border:0;border-radius:0;background:transparent;font-size:11px;font-weight:500}
 header .language-switch a{position:relative;min-width:0;min-height:34px;padding:0;border-radius:0;color:#797e83}
 header .language-switch a[aria-current=true]{background:transparent;color:#454a4e;font-weight:600}
 header .language-switch a+a::before{content:"/";position:absolute;left:-9px;color:#b6b9bc;font-weight:400}
 header .language-switch a:hover:not([aria-current=true]){background:transparent;color:#b96000;text-decoration:underline;text-underline-offset:4px}
}

@media(max-width:760px){
 html[lang=fr] #hero-title br{display:none}
 html[lang=fr] #hero-title{text-wrap:balance}
}