/* AISIGNO Website: Sprachwahl (Weltkugel in der Kopfzeile, Vorschlag der Browsersprache)
   und Typografie für Japanisch und vereinfachtes Chinesisch. Gilt für Startseite, Unterseiten
   und Anmeldung (lang.js). Kein letter-spacing, Knöpfe mit 8 px Rundung wie im Designsystem. */

.lang-menu{position:relative;flex:none}
.lang-btn{display:grid;place-items:center;width:40px;height:40px;padding:0;border:0;border-radius:8px;background:none;color:inherit;cursor:pointer;transition:background .2s}
.lang-btn:hover,.lang-btn[aria-expanded="true"]{background:#10171010}
.lang-btn:focus-visible{outline:2px solid currentColor;outline-offset:2px}
.lang-btn .ico{width:21px;height:21px}
.lang-list{position:absolute;right:0;top:calc(100% + 10px);z-index:80;min-width:196px;margin:0;padding:6px;list-style:none;border-radius:14px;background:#0d100f;color:#f4f7e9;font-family:var(--font,"Aisigno Sans",sans-serif);font-size:15px;font-weight:600;box-shadow:0 30px 70px -20px #10171080,0 0 0 1px #ffffff10;opacity:0;translate:0 -6px;transition:opacity .2s,translate .25s cubic-bezier(.2,.7,.2,1)}
.lang-list::before{content:"";position:absolute;left:0;right:0;top:-12px;height:12px}
.lang-list.is-open{opacity:1;translate:0 0}
.lang-item{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:40px;padding:0 12px;border-radius:9px;color:inherit!important;text-decoration:none;white-space:nowrap}
.lang-item:hover,.lang-item:focus-visible{background:#ffffff12;outline:0}
.lang-item[aria-current]{color:#ccff00!important}
.lang-item .ico{width:17px;height:17px;flex:none}

/* Anmeldeseite: Weltkugel rechts oben, auf Höhe des Logos. */
.login-lang{position:fixed;z-index:11;top:max(calc(var(--gutter,24px) * .75),env(safe-area-inset-top));right:max(var(--gutter,24px),env(safe-area-inset-right));color:#101710}
.login-lang .lang-btn{background:#ffffffb3;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.login-lang .lang-btn:hover,.login-lang .lang-btn[aria-expanded="true"]{background:#fff}

/* Vorschlag der Browsersprache: kleine Karte unten rechts, in der vorgeschlagenen Sprache. */
.lang-hint{position:fixed;right:max(16px,env(safe-area-inset-right));bottom:max(16px,env(safe-area-inset-bottom));z-index:90;display:grid;grid-template-columns:1fr auto;align-items:center;gap:10px 14px;width:min(360px,calc(100vw - 32px));padding:16px 16px 16px 18px;border-radius:14px;background:#0d100f;color:#f4f7e9;font-family:var(--font,"Aisigno Sans",sans-serif);box-shadow:0 30px 70px -20px #10171099,0 0 0 1px #ffffff12;opacity:0;translate:0 12px;transition:opacity .25s,translate .3s cubic-bezier(.2,.7,.2,1)}
.lang-hint.is-in{opacity:1;translate:0 0}
.lang-hint p{grid-column:1;margin:0;font-size:15px;line-height:1.4}
.lang-hint-go{grid-column:1;justify-self:start;display:inline-flex;align-items:center;min-height:38px;padding:0 14px;border-radius:8px;background:#ccff00;color:#101710!important;font-size:14px;font-weight:700;text-decoration:none}
.lang-hint-x{grid-column:2;grid-row:1/span 2;align-self:start;width:32px;height:32px;border:0;border-radius:8px;background:#ffffff12;color:inherit;font:inherit;font-size:20px;line-height:1;cursor:pointer}

/* --- Japanisch und vereinfachtes Chinesisch -------------------------------------------
   Lateinische Zeichen bleiben in der Hausschrift, die Schriftzeichen kommen aus den
   Systemschriften (keine gekürzten Werbescreen-Schriften für Fließtext). */
html:lang(ja){--font:"Aisigno Sans","Hiragino Sans","Hiragino Kaku Gothic ProN","Noto Sans JP","Noto Sans CJK JP","Yu Gothic UI","Yu Gothic",Meiryo,sans-serif}
html:lang(zh-Hans){--font:"Aisigno Sans","PingFang SC","Hiragino Sans GB","Noto Sans SC","Noto Sans CJK SC","Source Han Sans SC","Microsoft YaHei",sans-serif}
html:lang(ja),html:lang(ja) body,html:lang(zh-Hans),html:lang(zh-Hans) body{font-family:var(--font)}
html:lang(ja),html:lang(zh-Hans){line-break:strict;overflow-wrap:break-word}
/* Wortgruppen nicht mitten im Wort trennen, wo der Browser es kann. */
html:lang(ja) :is(h1,h2,h3,.lead,.kicker,.hdr-drop-item b){word-break:auto-phrase}
/* Kursiv gibt es in diesen Schriften nicht – schräg gerechnete Zeichen wirken falsch. */
html:lang(ja) :is(em,i),html:lang(zh-Hans) :is(em,i){font-style:normal}
/* Überschriften: etwas mehr Zeilenabstand für die höheren Zeichen. */
html:lang(ja) :is(h1,h2,h3),html:lang(zh-Hans) :is(h1,h2,h3){line-height:1.2}

/* Startseite, Karussell-Arten unter dem KI-Screen: längere Wörter (fr, ja …) bekommen auf dem
   Handy die Breite nach Inhalt statt gleich breiter Knöpfe; Deutsch bleibt unverändert. */
@media(max-width:560px){html:not(:lang(de)) .ai-seg-sub button{flex:1 1 auto;padding:0 5px}}
