.header-actions{display:flex;align-items:center;gap:12px;white-space:nowrap}
.language-picker{position:relative}
.language-switch{border:1px solid #67735e;border-radius:5px;background:transparent;color:#dbe5d5;padding:10px 12px;font-size:13px;line-height:1.2;transition:.2s}
.language-switch:hover{border-color:var(--accent,#c4f779);color:var(--accent,#c4f779)}
.language-switch:focus-visible{outline:2px solid var(--accent,#c4f779);outline-offset:3px}
.language-switch{cursor:pointer}
.language-switch::after{content:"";display:inline-block;width:6px;height:6px;margin:0 0 3px 12px;border-right:1px solid currentColor;border-bottom:1px solid currentColor;transform:rotate(45deg)}
.language-switch[aria-expanded="true"]::after{transform:rotate(225deg);margin-bottom:0}
.language-options{position:absolute;z-index:20;top:calc(100% + 8px);right:0;min-width:170px;padding:6px;border:1px solid #485640;border-radius:7px;background:#172019;box-shadow:0 12px 30px #0008}
.language-options[hidden]{display:none}
.language-options:not([hidden]){display:grid;gap:3px}
.language-option{display:flex;align-items:center;justify-content:space-between;gap:22px;width:100%;padding:10px 11px;border:0;border-radius:4px;background:transparent;color:#e7eee3;text-align:left;font-size:13px;cursor:pointer}
.language-option:hover,.language-option:focus-visible{background:#263423;outline:none}
.language-option[aria-selected="true"]{color:var(--accent,#c4f779)}
.language-check[hidden]{visibility:hidden}
body:has(.demo-section) .language-switch{border-color:#4d633d;color:#dcebd2}
@media(max-width:1050px){.header nav{gap:18px}.header{padding-inline:30px}.header-cta{padding:11px 12px;gap:10px}}
@media(max-width:800px){body:has(.demo-section) .header{padding-inline:22px}.header nav{gap:12px;font-size:12px}.header .brand{font-size:19px}.header-actions{gap:7px}.header-cta{font-size:12px}}
@media(max-width:560px){body:has(.demo-section) .header nav{display:none}body:not(:has(.demo-section)) header .header-actions>a{display:none}.header{padding-inline:16px}body:not(:has(.demo-section)) header{gap:8px}.header-actions{gap:7px}.header-cta{padding:9px 10px;font-size:11px}.language-switch{padding:9px 8px;font-size:12px}}
@media(max-width:380px){body:has(.demo-section) .header{padding-inline:12px}.header .brand{font-size:17px}.header .brand-icon{width:34px}.header-cta{gap:5px;padding:8px;font-size:10px}.language-switch{padding:8px 6px;font-size:11px}}