/* HumanPeace v2.3 — Language Experience
   Complete redesign of the language selector and browser-language suggestion.
*/
:root{
  --hp-lx-navy:#031d45;
  --hp-lx-blue:#063f84;
  --hp-lx-blue-2:#075db7;
  --hp-lx-cyan:#59e7ef;
  --hp-lx-mint:#8ff8df;
  --hp-lx-white:#fff;
  --hp-lx-muted:rgba(232,246,255,.74);
  --hp-lx-line:rgba(131,229,244,.25);
  --hp-lx-card:rgba(3,35,78,.72);
  --hp-lx-shadow:0 32px 100px rgba(0,14,42,.58),0 10px 35px rgba(0,0,0,.30);
}
html.hp-language-dialog-open,
body.hp-language-dialog-open{overflow:hidden}

/* Header trigger — deliberately overrides the older inline language-menu styles. */
nav > .language-menu{
  position:relative!important;
  z-index:100!important;
  margin:0!important;
}
nav > .language-menu > summary{
  min-height:46px!important;
  display:inline-flex!important;
  align-items:center!important;
  gap:10px!important;
  list-style:none!important;
  cursor:pointer!important;
  color:#fff!important;
  padding:9px 15px 9px 10px!important;
  border:1px solid rgba(105,226,243,.52)!important;
  border-radius:15px!important;
  background:
    linear-gradient(135deg,rgba(91,231,239,.16),rgba(255,255,255,.04)),
    rgba(3,37,81,.52)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.10),0 10px 30px rgba(0,22,63,.18)!important;
  backdrop-filter:blur(12px) saturate(140%);
  -webkit-backdrop-filter:blur(12px) saturate(140%);
  font:800 14px/1.1 Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important;
  letter-spacing:.01em!important;
  transition:transform .18s ease,border-color .18s ease,background .18s ease,box-shadow .18s ease!important;
}
nav > .language-menu > summary::-webkit-details-marker{display:none!important}
nav > .language-menu > summary:hover{
  transform:translateY(-1px);
  border-color:rgba(127,244,255,.95)!important;
  background:
    linear-gradient(135deg,rgba(91,231,239,.24),rgba(255,255,255,.08)),
    rgba(3,45,98,.68)!important;
  box-shadow:0 0 0 4px rgba(89,231,239,.08),0 13px 34px rgba(0,23,65,.25)!important;
}
nav > .language-menu > summary:focus-visible{
  outline:3px solid rgba(143,248,223,.88)!important;
  outline-offset:3px!important;
}
.hp-language-trigger__globe{
  width:28px;height:28px;display:grid;place-items:center;flex:0 0 28px;
  border:1px solid rgba(143,248,223,.58);border-radius:50%;
  color:var(--hp-lx-mint);background:rgba(22,128,181,.20);
  box-shadow:0 0 18px rgba(89,231,239,.18);
  font-size:15px;
}
.hp-language-trigger__text{display:grid;gap:2px;text-align:start}
.hp-language-trigger__label{font-size:13px;font-weight:900;white-space:nowrap}
.hp-language-trigger__current{
  color:rgba(231,247,255,.70);font-size:10px;font-weight:750;
  letter-spacing:.055em;text-transform:uppercase;white-space:nowrap
}
.hp-language-trigger__chevron{
  width:16px;height:16px;margin-inline-start:1px;color:var(--hp-lx-cyan);
  transition:transform .2s ease
}
.language-menu[open] .hp-language-trigger__chevron{transform:rotate(180deg)}
/* Hide the old native list: JS opens the premium modal instead. */
.language-menu > .language-options{display:none!important}

/* Backdrop and dialog */
.hp-language-suggestion[hidden]{display:none!important}
.hp-language-suggestion{
  position:fixed!important;z-index:10000!important;inset:0!important;
  width:auto!important;margin:0!important;padding:clamp(14px,3vw,34px)!important;
  display:grid!important;place-items:center!important;
  color:#fff!important;text-align:start!important;
  background:
    radial-gradient(circle at 18% 12%,rgba(24,151,207,.22),transparent 34%),
    radial-gradient(circle at 84% 86%,rgba(31,198,146,.16),transparent 35%),
    rgba(0,14,39,.74)!important;
  backdrop-filter:blur(14px) saturate(125%)!important;
  -webkit-backdrop-filter:blur(14px) saturate(125%)!important;
  box-sizing:border-box!important;
}
.hp-language-dialog{
  position:relative;
  width:min(1040px,100%);
  max-height:min(850px,calc(100vh - 40px));
  overflow:auto;
  padding:clamp(22px,3.2vw,38px);
  border:1px solid rgba(102,231,244,.72);
  border-radius:28px;
  background:
    radial-gradient(circle at 8% 0%,rgba(54,220,218,.13),transparent 30%),
    radial-gradient(circle at 100% 0%,rgba(26,118,221,.22),transparent 35%),
    linear-gradient(145deg,rgba(4,36,82,.985),rgba(2,30,70,.985) 54%,rgba(3,58,105,.985));
  box-shadow:var(--hp-lx-shadow),inset 0 1px 0 rgba(255,255,255,.10);
  scrollbar-width:thin;
  scrollbar-color:rgba(98,228,242,.45) transparent;
}
.hp-language-dialog::before{
  content:"";position:absolute;inset:0;pointer-events:none;border-radius:inherit;
  background:
    linear-gradient(90deg,transparent,rgba(99,234,242,.09),transparent) top/100% 1px no-repeat,
    radial-gradient(circle at 12% 12%,rgba(120,250,235,.13),transparent 24%);
}
.hp-language-dialog__header{
  position:relative;display:grid;grid-template-columns:70px minmax(0,1fr) auto;
  gap:18px;align-items:center;margin-bottom:28px;padding-inline-end:2px;
}
.hp-language-dialog__icon{
  width:66px;height:66px;display:grid;place-items:center;border-radius:50%;
  border:1px solid rgba(104,236,246,.78);
  background:radial-gradient(circle at 35% 25%,rgba(143,248,223,.30),rgba(8,80,151,.55));
  color:#dffcff;box-shadow:0 0 0 6px rgba(80,224,236,.06),0 0 32px rgba(77,225,239,.24);
}
.hp-language-dialog__icon svg{width:39px;height:39px}
.hp-language-dialog__heading{min-width:0}
.hp-language-dialog__eyebrow{
  margin:0 0 5px!important;color:var(--hp-lx-mint)!important;
  font:850 12px/1.25 Inter,system-ui,sans-serif!important;
  letter-spacing:.11em!important;text-transform:uppercase!important
}
.hp-language-dialog__title{
  margin:0!important;color:#fff!important;
  font:900 clamp(25px,3vw,38px)/1.08 Georgia,"Times New Roman",serif!important;
  letter-spacing:-.025em!important
}
.hp-language-dialog__subtitle{
  margin:7px 0 0!important;color:var(--hp-lx-cyan)!important;
  font:700 clamp(14px,1.6vw,18px)/1.4 Inter,system-ui,sans-serif!important
}
.hp-language-suggestion__close{
  position:relative!important;inset:auto!important;width:50px!important;height:50px!important;
  display:grid!important;place-items:center!important;flex:0 0 50px!important;
  border:1px solid rgba(86,221,240,.46)!important;border-radius:50%!important;
  background:rgba(20,105,168,.18)!important;color:#e8fcff!important;
  font:300 31px/1 Inter,system-ui,sans-serif!important;cursor:pointer!important;
  transition:transform .17s ease,background .17s ease,border-color .17s ease!important;
}
.hp-language-suggestion__close:hover{
  transform:rotate(4deg);background:rgba(47,161,207,.26)!important;
  border-color:rgba(112,238,248,.9)!important;color:#fff!important
}
.hp-language-suggestion__close:focus-visible,
.hp-language-option:focus-visible,
.hp-language-dialog__stay:focus-visible{
  outline:3px solid var(--hp-lx-mint)!important;outline-offset:3px!important
}

/* Suggested language statement */
.hp-language-dialog__suggestion{
  display:flex;align-items:center;justify-content:space-between;gap:16px;
  margin:-4px 0 20px;padding:14px 16px;border:1px solid rgba(104,225,239,.22);
  border-radius:16px;background:rgba(67,181,211,.07)
}
.hp-language-dialog__suggestion[hidden]{display:none!important}
.hp-language-dialog__suggestion-text{
  margin:0!important;color:rgba(239,250,255,.84)!important;
  font:650 14px/1.5 Inter,system-ui,sans-serif!important
}
.hp-language-dialog__suggestion-text strong{color:var(--hp-lx-mint);font-weight:900}
.hp-language-dialog__suggestion-badge{
  flex:0 0 auto;padding:6px 10px;border:1px solid rgba(143,248,223,.30);
  border-radius:999px;color:var(--hp-lx-mint);background:rgba(143,248,223,.08);
  font:850 10px/1 Inter,system-ui,sans-serif;letter-spacing:.08em;text-transform:uppercase
}

/* Language grid */
.hp-language-grid{
  position:relative;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px 14px;margin:0;padding:0;list-style:none
}
.hp-language-option{
  min-height:72px;display:grid;grid-template-columns:46px minmax(0,1fr) auto;
  align-items:center;gap:14px;padding:10px 15px;
  border:1px solid rgba(116,198,231,.22);border-radius:15px;
  color:#fff!important;text-decoration:none!important;background:rgba(1,28,68,.34);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.025);
  transition:transform .17s ease,border-color .17s ease,background .17s ease,box-shadow .17s ease;
}
.hp-language-option:hover{
  transform:translateY(-2px);border-color:rgba(97,231,242,.65);
  background:linear-gradient(135deg,rgba(34,166,202,.14),rgba(8,54,113,.44));
  box-shadow:0 10px 26px rgba(0,15,45,.18),inset 0 1px 0 rgba(255,255,255,.07)
}
.hp-language-option[aria-current="page"]{
  border-color:rgba(104,239,241,.94);
  background:
    linear-gradient(135deg,rgba(54,213,205,.20),rgba(11,70,135,.54));
  box-shadow:0 0 0 2px rgba(91,231,239,.11),0 0 28px rgba(81,226,236,.16),inset 0 1px 0 rgba(255,255,255,.10)
}
.hp-language-option[data-suggested="true"]:not([aria-current="page"]){
  border-color:rgba(143,248,223,.48);
  background:linear-gradient(135deg,rgba(58,200,168,.13),rgba(9,60,116,.40))
}
.hp-language-option__flag{
  width:42px;height:30px;display:grid;place-items:center;
  border-radius:7px;background:rgba(255,255,255,.08);
  font-size:27px;line-height:1;filter:drop-shadow(0 3px 5px rgba(0,0,0,.30))
}
.hp-language-option__copy{min-width:0;display:grid;gap:4px}
.hp-language-option__name{
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
  font:850 clamp(15px,1.7vw,18px)/1.25 Inter,system-ui,sans-serif
}
.hp-language-option__meta{
  color:rgba(222,242,250,.58);font:750 10px/1.15 Inter,system-ui,sans-serif;
  letter-spacing:.08em;text-transform:uppercase
}
.hp-language-option__code{
  color:rgba(232,246,255,.80);font:750 14px/1 Inter,system-ui,sans-serif;
  letter-spacing:.035em;text-transform:uppercase
}
.hp-language-option__check{
  width:25px;height:25px;display:none;place-items:center;margin-inline-start:2px;
  border-radius:50%;color:#042e58;background:var(--hp-lx-mint);font-weight:1000
}
.hp-language-option[aria-current="page"] .hp-language-option__code{display:none}
.hp-language-option[aria-current="page"] .hp-language-option__check{display:grid}

/* Footer */
.hp-language-dialog__footer{
  position:relative;display:grid;grid-template-columns:auto minmax(0,1fr) auto;
  align-items:center;gap:15px;margin-top:22px;padding-top:20px;
  border-top:1px solid rgba(114,220,236,.20)
}
.hp-language-dialog__privacy-icon{
  width:36px;height:36px;display:grid;place-items:center;border-radius:50%;
  color:var(--hp-lx-cyan);background:rgba(64,206,222,.08)
}
.hp-language-dialog__privacy-icon svg{width:24px;height:24px}
.hp-language-dialog__privacy{
  margin:0!important;color:rgba(229,244,251,.77)!important;
  font:600 12px/1.55 Inter,system-ui,sans-serif!important
}
.hp-language-dialog__privacy strong{color:#fff;font-weight:850}
.hp-language-dialog__stay{
  min-height:42px;display:inline-flex;align-items:center;justify-content:center;
  padding:9px 14px;border:1px solid rgba(116,219,235,.30);border-radius:12px;
  color:#eafcff;background:rgba(62,172,203,.08);
  font:800 12px/1.2 Inter,system-ui,sans-serif;cursor:pointer;
  transition:background .16s ease,border-color .16s ease
}
.hp-language-dialog__stay:hover{
  border-color:rgba(122,237,247,.70);background:rgba(62,172,203,.17)
}

/* RTL */
html[dir="rtl"] .hp-language-trigger__text{text-align:end}
html[dir="rtl"] .hp-language-dialog__header{padding-inline-end:0}
html[dir="rtl"] .hp-language-dialog__title,
html[dir="rtl"] .hp-language-dialog__subtitle,
html[dir="rtl"] .hp-language-dialog__eyebrow,
html[dir="rtl"] .hp-language-dialog__privacy{text-align:start}

/* Responsive */
@media(max-width:760px){
  nav > .language-menu > summary{padding:8px 10px!important}
  .hp-language-trigger__current{display:none}
  .hp-language-dialog{
    max-height:calc(100vh - 20px);padding:20px 15px 16px;border-radius:22px
  }
  .hp-language-dialog__header{
    grid-template-columns:52px minmax(0,1fr) 43px;gap:12px;margin-bottom:19px
  }
  .hp-language-dialog__icon{width:50px;height:50px}
  .hp-language-dialog__icon svg{width:30px;height:30px}
  .hp-language-suggestion__close{width:43px!important;height:43px!important;flex-basis:43px!important;font-size:27px!important}
  .hp-language-grid{grid-template-columns:1fr;gap:8px}
  .hp-language-option{min-height:59px;grid-template-columns:40px minmax(0,1fr) auto;padding:8px 11px}
  .hp-language-option__flag{width:36px;height:27px;font-size:24px}
  .hp-language-dialog__suggestion{align-items:flex-start;flex-direction:column;gap:7px}
  .hp-language-dialog__footer{grid-template-columns:34px minmax(0,1fr)}
  .hp-language-dialog__stay{grid-column:1/-1;width:100%}
}
@media(max-width:430px){
  .hp-language-trigger__label{font-size:12px}
  .hp-language-trigger__globe{width:26px;height:26px;flex-basis:26px}
  .hp-language-dialog__subtitle{font-size:13px!important}
  .hp-language-dialog__privacy{font-size:11px!important}
}
@media(prefers-reduced-motion:no-preference){
  .hp-language-suggestion:not([hidden]){animation:hp-lx-backdrop .22s ease-out both}
  .hp-language-suggestion:not([hidden]) .hp-language-dialog{animation:hp-lx-dialog .28s cubic-bezier(.2,.75,.25,1) both}
  @keyframes hp-lx-backdrop{from{opacity:0}to{opacity:1}}
  @keyframes hp-lx-dialog{from{opacity:0;transform:translateY(14px) scale(.975)}to{opacity:1;transform:translateY(0) scale(1)}}
}
@media(prefers-reduced-motion:reduce){
  nav > .language-menu > summary,.hp-language-option,.hp-language-suggestion__close{transition:none!important}
}
@media(prefers-contrast:more){
  nav > .language-menu > summary,.hp-language-dialog,.hp-language-option{border-color:#fff!important}
}