/* Language switcher (main header) and language list (mobile menu). Brand tokens from main.css. */
.lang-switch { position: relative; flex: none; }
.lang-switch__btn { position: relative; display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 0 12px 0 10px; border: 1px solid var(--ll-border); border-radius: 999px; background: linear-gradient(180deg, #fff, var(--ll-white-clinical)); color: var(--ll-navy); font: 600 14px/1 var(--ll-font-body); cursor: pointer; transition: border-color .25s, box-shadow .25s, background-color .25s; }
.lang-switch__btn:hover, .lang-switch.is-open .lang-switch__btn { border-color: var(--ll-green-clinical); box-shadow: 0 0 0 4px rgba(23, 195, 123, .14); }
.lang-switch__btn > .icon { color: var(--ll-green-clinical); }
.lang-switch__code { display: none; font: 700 12px/1 var(--ll-font-code); letter-spacing: .04em; }
.lang-switch__chev { opacity: .6; transition: transform .25s var(--ease); }
.lang-switch.is-open .lang-switch__chev { transform: rotate(180deg); }

.lang-switch__menu { position: absolute; z-index: 130; right: 0; top: calc(100% + 12px); width: 280px; padding: 10px; background: #fff; border: 1px solid var(--ll-border); border-radius: 16px; box-shadow: 0 30px 60px -20px rgba(11, 31, 58, .35), 0 2px 6px rgba(11, 31, 58, .06); opacity: 0; visibility: hidden; transform: translateY(-6px) scale(.98); transform-origin: top right; transition: opacity .2s, transform .25s var(--ease), visibility .2s; }
.lang-switch.is-open .lang-switch__menu { opacity: 1; visibility: visible; transform: none; }
.lang-switch__title { margin: 4px 8px 8px; color: var(--ll-steel); font-size: 11px; letter-spacing: .06em; text-transform: uppercase; }
.lang-switch__menu ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 2px; }
.lang-switch__menu a { display: flex; align-items: center; gap: 12px; padding: 10px; border-radius: 10px; color: var(--ll-navy); text-decoration: none; transition: background-color .2s; }
.lang-switch__menu a:hover { background: var(--ll-white-clinical); text-decoration: none; }
.lang-switch__menu b { display: inline-grid; place-items: center; width: 36px; height: 28px; flex: none; border-radius: 8px; background: var(--ll-white-clinical); border: 1px solid var(--ll-border); color: var(--ll-navy); font-size: 11.5px; }
.lang-switch__menu bdi { display: flex; flex-direction: column; flex: 1; font: 600 15px/1.25 var(--ll-font-body); }
.lang-switch__menu small { margin-top: 2px; color: var(--ll-steel); font: 400 12px/1.2 var(--ll-font-body); }
.lang-switch__menu a > .icon { color: var(--ll-green-clinical); }
.lang-switch__menu a[aria-current] { background: rgba(23, 195, 123, .1); }
.lang-switch__menu a[aria-current] b { background: var(--ll-green-clinical); border-color: var(--ll-green-clinical); color: #fff; }
html:not([dir="rtl"]) .lang-switch__menu bdi[dir="rtl"] { align-items: flex-end; }
[dir="rtl"] .lang-switch__menu { right: auto; left: 0; transform-origin: top left; }

/* Small laptops: code instead of the full name, so the menu still fits. */
@media (max-width: 1360px) and (min-width: 1181px) {
	.lang-switch__name { display: none; }
	.lang-switch__code { display: inline; }
}
@media (max-width: 640px) {
	.lang-switch__name { display: none; }
	.lang-switch__code { display: inline; }
	.lang-switch__btn { padding: 0 10px; }
	.lang-switch__menu { position: fixed; top: calc(var(--header-h) + 8px); left: 16px; right: 16px; width: auto; }
}

/* Mobile menu: languages as a row of chips */
.lang-list { display: flex; flex-wrap: wrap; gap: 8px; margin: 20px 0 4px; padding: 0; list-style: none; }
.mobile-nav .lang-list a { display: inline-flex; align-items: center; gap: 8px; padding: 8px 12px; border: 1px solid var(--ll-border); border-radius: 999px; font: 600 14px/1.2 var(--ll-font-body); color: var(--ll-navy); }
.mobile-nav .lang-list a[aria-current] { border-color: var(--ll-green-clinical); background: rgba(23, 195, 123, .1); }
.lang-list b { font: 500 11px/1 var(--ll-font-code); color: var(--ll-steel); }

/* Keep the full desktop header on one line in every language, measured with the site fonts:
   language code instead of its name, and "Book a call" as an icon (its name stays for screen readers and as a tooltip). */
@media (min-width: 1181px) {
	.lang-switch__name { display: none; }
	.lang-switch__code { display: inline; }
	.header-actions .btn-secondary { padding-left: 12px; padding-right: 12px; }
	.header-actions .btn-secondary .btn-label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
}
/* Longer menu words (es, fr, de, pt): the same compact header at every desktop width, and a tighter menu on laptops. */
@media (min-width: 1181px) {
	html:is([lang^="es"], [lang^="fr"], [lang^="de"], [lang^="pt"]) .lang-switch__name { display: none; }
	html:is([lang^="es"], [lang^="fr"], [lang^="de"], [lang^="pt"]) .lang-switch__code { display: inline; }
	html:is([lang^="es"], [lang^="fr"], [lang^="de"], [lang^="pt"]) .header-actions .btn-secondary { padding-left: 12px; padding-right: 12px; }
	html:is([lang^="es"], [lang^="fr"], [lang^="de"], [lang^="pt"]) .header-actions .btn-secondary .btn-label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
}
@media (min-width: 1181px) {
	html:is([lang^="es"], [lang^="fr"], [lang^="de"], [lang^="pt"]) .site-header .wrap { gap: 14px; }
	html:is([lang^="es"], [lang^="fr"], [lang^="de"], [lang^="pt"]) .nav { gap: 0; }
	html:is([lang^="es"], [lang^="fr"], [lang^="de"], [lang^="pt"]) .nav > a, html:is([lang^="es"], [lang^="fr"], [lang^="de"], [lang^="pt"]) .nav .nav-trigger { padding: 10px 7px; font-size: 14px; }
	html:is([lang^="es"], [lang^="fr"], [lang^="de"], [lang^="pt"]) .nav > a::after, html:is([lang^="es"], [lang^="fr"], [lang^="de"], [lang^="pt"]) .nav .nav-trigger::after { left: 7px; right: 7px; }
}