/* EN / DE language switcher (identical on every page) + German heading entrance */
.am-lang{display:inline-flex;align-items:center;flex:none;gap:2px;height:40px;padding:3px;margin-right:12px;border:1px solid var(--color-text-primary,#201f1d);border-radius:999px;background:var(--color-bg-warm,#fff)}
.am-lang button{appearance:none;-webkit-appearance:none;border:0;margin:0;height:100%;min-width:40px;padding:0 10px;border-radius:999px;background:transparent;color:var(--color-text-primary,#201f1d);font:600 13px/1 "Manrope","Manrope Placeholder",sans-serif;letter-spacing:.02em;cursor:pointer;transition:background .25s ease,color .25s ease}
.am-lang button[aria-pressed="true"]{background:var(--color-text-primary,#201f1d);color:var(--color-bg-warm,#fff)}
.am-lang button[aria-pressed="false"]:hover{background:var(--color-accent-yellow,#BCE8D2)}
.am-lang button:focus-visible{outline:2px solid var(--color-text-primary,#201f1d);outline-offset:2px}
[data-name="Button-Container"]:has(>.am-lang){display:flex!important;flex-direction:row!important;align-items:center!important}
@media (max-width:809.98px){.am-lang{height:36px;margin-right:8px}.am-lang button{min-width:34px;padding:0 8px;font-size:12px}}

/* static pages (case studies, legal, …): same switcher inside the existing nav */
header.nav{--color-text-primary:#201f1d;--color-bg-warm:#fef7f0;--color-accent-yellow:#BCE8D2}
header.nav .nav-r .am-lang{margin-right:0}
/* the legal pages used to carry their own toggle; the site-wide switcher replaces it */
.legal-switch{display:none!important}

/* German headings replace Framer's letter-split spans */
.am-h-de>:not(.am-de){display:none!important}
.am-de .am-w{white-space:nowrap}
@media (max-width:1199.98px){h2.am-h-de[data-am-en^="Structured, but not rigid"] .am-de-mark{white-space:nowrap!important}}
.am-l{display:inline-block;opacity:0}
.am-de.am-in .am-l{animation:am-l-in .6s cubic-bezier(.2,.7,.2,1) both;animation-delay:calc(var(--i)*22ms)}
@keyframes am-l-in{from{opacity:0;transform:translateY(.35em)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.am-l{opacity:1!important}.am-de.am-in .am-l{animation:none}}
:has(>h2.am-h-de[data-am-en="Where my skills shine"]),:has(>h2.am-h-de[data-am-en="How I got here"]){width:auto!important;max-width:100%!important}
h2.am-h-de[data-am-en="Where my skills shine"]{width:6.8em!important;max-width:100%!important}
h2.am-h-de[data-am-en="How I got here"]{width:8.4em!important;max-width:100%!important}

/* the button zone may grow past its 1fr share when the German labels are wider (keeps the links centred otherwise) */
[data-name="Button-Container"]:has(>.am-lang){min-width:max-content}
html[lang="de"] [data-name="Button-Container"]>.am-lang{margin-right:8px}
/* German nav labels are wider: tighten the link gaps so the logo is never squeezed on tablets */
html[lang="de"] nav [data-name="Links"]{gap:18px!important}

/* German compounds are long: let static pages hyphenate / break instead of overflowing narrow columns */
html[lang="de"] main :is(h1,h2,h3,h4,p,li,dt,dd,figcaption,blockquote){overflow-wrap:break-word}
html[lang="de"] .step :is(h3,p){hyphens:auto;-webkit-hyphens:auto}
/* long e-mail addresses inside the legal text must never widen the page */
.legal-body a[href^="mailto:"]{overflow-wrap:anywhere}

/* labels that the case-study stylesheet generates with CSS (not real text nodes) */
html[lang="de"] .dec h3 s::before{content:"statt "}
html[lang="de"] .rsplit blockquote::before{content:"was sich verändert hat"}
html[lang="de"] .people .risk::before{content:"größtes Risiko"}

/* ---- German text-fit: keep case-study headings close to their English line counts ----
   German runs ~15–20 % longer; serif display headings are set ~8 % smaller and balanced instead of rewording the meaning. */
html[lang="de"] :is(.ch h2,.results h2,.impact-head h2,.role-head h2,.h3,.flow h3,.stepfig h3,.ba-head h3,.card h3,.dec h3,.q h4,.dir h4,.next-card h3,.cta-box h2){text-wrap:balance}
html[lang="de"] :is(.ch h2,.results h2){font-size:clamp(36px,4.2vw,62px)}
html[lang="de"] :is(.impact-head h2,.role-head h2){font-size:clamp(36px,4vw,58px)}
html[lang="de"] :is(.h3,.flow h3,.stepfig h3,.ba-head h3,.card h3){font-size:27px}
html[lang="de"] :is(.refl .card h3,.people .card h3){font-size:25px}
html[lang="de"] .two .card h3{font-size:22px}
html[lang="de"] .dec h3{font-size:clamp(24px,2.2vw,31px)}
html[lang="de"] .q h4{font-size:23px}
html[lang="de"] .dir h4{font-size:22px}
html[lang="de"] .next-card h3{font-size:clamp(32px,3.3vw,49px)}
html[lang="de"] .cta-box h2{font-size:clamp(40px,5.1vw,76px)}

/* hero / page H1: German words are longer ("komplexe Produkte") — set ~16 % smaller so the headline keeps its two-line composition */
html[lang="de"] .ui-VrdHj .style-preset-ox49xu:not(.rich-text-wrapper){--ui-font-size:92px!important}
@media (max-width:1199px){html[lang="de"] .ui-VrdHj .style-preset-ox49xu:not(.rich-text-wrapper){--ui-font-size:76px!important}}
@media (max-width:809px){html[lang="de"] .ui-VrdHj .style-preset-ox49xu:not(.rich-text-wrapper){--ui-font-size:38px!important}}
html[lang="de"] .ui-qrljzp .style-preset-ox49xu{--ui-font-size:48px!important}
@media (max-width:1199.98px){html[lang="de"] .ui-qrljzp .style-preset-ox49xu{--ui-font-size:46px!important}}
@media (max-width:809.98px){html[lang="de"] .ui-qrljzp .style-preset-ox49xu{--ui-font-size:23px!important}}
@media (max-width:809px){html[lang="de"] .style-preset-1cne3ze{--ui-font-size:33px!important}}
/* Home intro statement (class-less h2 inside .ui-interactive-text): ~10 % tighter in German to stay close to the English line count */
html[lang="de"] .ui-interactive-text>h2:not([class]){zoom:.9}
/* hero sub-line: give the longer German line (…Fließend Englisch · Deutsch B2 ·) room so "B2" never drops to a new line alone */
html[lang="de"] .ui-1v89jti{width:min(580px,100%)!important;max-width:580px!important}
/* German mono/caps labels are longer: tighter tracking so tags and meta rows keep one line where the English does */
html[lang="de"] :is(.kick,.read,.side .who){letter-spacing:.08em}
html[lang="de"] .chip,html[lang="de"] .ba .tag{letter-spacing:.05em}
@media (max-width:700px){html[lang="de"] :is(.kick,.read,.side .who){font-size:11px;letter-spacing:.05em}html[lang="de"] .read{gap:10px}}
/* About "skills" rows (big serif word + handwritten caption): keep long German words whole instead of breaking mid-word */
@media (max-width:1199px){
  html[lang="de"] .ui-VrdHj .ui-1r19vwc .style-preset-ox49xu:not(.rich-text-wrapper){--ui-font-size:48px!important}
  html[lang="de"] .ui-1r19vwc>div>div{flex-shrink:1;min-width:0}
}
@media (max-width:809px){html[lang="de"] .ui-VrdHj .ui-1r19vwc .style-preset-ox49xu:not(.rich-text-wrapper){--ui-font-size:24px!important}}
html[lang="de"] .ui-1r19vwc>div>div,html[lang="de"] .ui-1r19vwc>div>div p{white-space:normal!important}
@media (min-width:810px) and (max-width:1199px){html[lang="de"] .ui-1r19vwc>div>div:not([class*="9kxz4d"]):not([class*="80lw5d"]):not([class*="15bkwht"]):not([class*="55c31e"]):not([class*="1wtbdoo"]):not([class*="11wfyh7"]){max-width:52%}}
/* About hero statement: longest heading on the site — ~12 % smaller in German */
html[lang="de"] h2.am-h-de[data-am-en^="Structured, but not rigid"],html[lang="de"] h1.am-h-de[data-am-en^="Structured, but not rigid"]{zoom:.88}
@media (max-width:809px){html[lang="de"] .am-h-de[data-am-en^="Structured, but not rigid"]{zoom:.94}html[lang="de"] .style-preset-1cne3ze{--ui-font-size:30px!important}}

/* ---- stroke-weight parity ----
   German display headings are set a little smaller to keep the English line count, which thins the serif strokes.
   A hairline text-stroke (em-based, ≈ the lost stem width) restores the same visual weight as in English. */
html[lang="de"] .style-preset-ox49xu{-webkit-text-stroke:.0105em currentColor}
html[lang="de"] .am-h-de[data-am-en^="Structured, but not rigid"]{-webkit-text-stroke:.0075em currentColor}
html[lang="de"] :is(.ch h2,.results h2,.impact-head h2,.role-head h2,.h3,.flow h3,.stepfig h3,.ba-head h3,.card h3,.dec h3,.q h4,.dir h4,.next-card h3,.cta-box h2){-webkit-text-stroke:.005em currentColor}
