/* polyglot.doma – Landingpage
   Farben: Tinte #0E1B4D · Kobalt #1D3A9A · Mittelblau #4A68C2 · Aquarell #9FB3E3
           Nebel #D5DEF3 · Porzellan #F4F6FB · Messing #B88A4A */
/* Schriften – lokal eingebunden (SIL Open Font License 1.1, siehe assets/fonts/OFL-*.txt) */
@font-face{font-family:'Bricolage Grotesque';font-style:normal;font-weight:200 800;font-display:swap;src:url(../fonts/bricolage-grotesque-latin-ext-opsz-normal.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Bricolage Grotesque';font-style:normal;font-weight:200 800;font-display:swap;src:url(../fonts/bricolage-grotesque-latin-opsz-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Instrument Serif';font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/instrument-serif-latin-ext-400-normal.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Instrument Serif';font-style:italic;font-weight:400;font-display:swap;src:url(../fonts/instrument-serif-latin-ext-400-italic.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Instrument Serif';font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/instrument-serif-latin-400-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Instrument Serif';font-style:italic;font-weight:400;font-display:swap;src:url(../fonts/instrument-serif-latin-400-italic.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Alexandria';font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/alexandria-arabic-400-normal.woff2) format('woff2');unicode-range:U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0897-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC,U+102E0-102FB,U+10E60-10E7E,U+10EC2-10EC4,U+10EFC-10EFF,U+1EE00-1EE03,U+1EE05-1EE1F,U+1EE21-1EE22,U+1EE24,U+1EE27,U+1EE29-1EE32,U+1EE34-1EE37,U+1EE39,U+1EE3B,U+1EE42,U+1EE47,U+1EE49,U+1EE4B,U+1EE4D-1EE4F,U+1EE51-1EE52,U+1EE54,U+1EE57,U+1EE59,U+1EE5B,U+1EE5D,U+1EE5F,U+1EE61-1EE62,U+1EE64,U+1EE67-1EE6A,U+1EE6C-1EE72,U+1EE74-1EE77,U+1EE79-1EE7C,U+1EE7E,U+1EE80-1EE89,U+1EE8B-1EE9B,U+1EEA1-1EEA3,U+1EEA5-1EEA9,U+1EEAB-1EEBB,U+1EEF0-1EEF1}
@font-face{font-family:'Alexandria';font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/alexandria-latin-ext-400-normal.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Alexandria';font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/alexandria-latin-400-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Alexandria';font-style:normal;font-weight:600;font-display:swap;src:url(../fonts/alexandria-arabic-600-normal.woff2) format('woff2');unicode-range:U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0897-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC,U+102E0-102FB,U+10E60-10E7E,U+10EC2-10EC4,U+10EFC-10EFF,U+1EE00-1EE03,U+1EE05-1EE1F,U+1EE21-1EE22,U+1EE24,U+1EE27,U+1EE29-1EE32,U+1EE34-1EE37,U+1EE39,U+1EE3B,U+1EE42,U+1EE47,U+1EE49,U+1EE4B,U+1EE4D-1EE4F,U+1EE51-1EE52,U+1EE54,U+1EE57,U+1EE59,U+1EE5B,U+1EE5D,U+1EE5F,U+1EE61-1EE62,U+1EE64,U+1EE67-1EE6A,U+1EE6C-1EE72,U+1EE74-1EE77,U+1EE79-1EE7C,U+1EE7E,U+1EE80-1EE89,U+1EE8B-1EE9B,U+1EEA1-1EEA3,U+1EEA5-1EEA9,U+1EEAB-1EEBB,U+1EEF0-1EEF1}
@font-face{font-family:'Alexandria';font-style:normal;font-weight:600;font-display:swap;src:url(../fonts/alexandria-latin-ext-600-normal.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Alexandria';font-style:normal;font-weight:600;font-display:swap;src:url(../fonts/alexandria-latin-600-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}


body{margin:0;background:#F4F6FB;color:#0E1B4D;font-family:'Bricolage Grotesque',system-ui,sans-serif;-webkit-font-smoothing:antialiased}
a{color:#1D3A9A}a:hover{color:#0E1B4D}
.serif{font-family:'Instrument Serif',Georgia,serif;font-style:italic;font-weight:400}
.ar{font-family:'Alexandria',sans-serif}
a:focus-visible,button:focus-visible,summary:focus-visible,select:focus-visible,input:focus-visible,textarea:focus-visible{outline:3px solid #B88A4A;outline-offset:3px}
html{scroll-behavior:smooth}
section{scroll-margin-top:96px}
[hidden]{display:none !important}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

.pd-btn{transition:transform .3s cubic-bezier(.2,.8,.2,1),box-shadow .3s,background-color .3s}
.pd-btn:hover{transform:translateY(-3px);box-shadow:0 14px 28px -12px rgba(14,27,77,.6)}
.pd-card{transition:transform .45s cubic-bezier(.2,.8,.2,1),box-shadow .45s}
.pd-card:hover{transform:translateY(-8px) rotate(-.6deg);box-shadow:0 28px 48px -28px rgba(14,27,77,.65)}
.pd-lang{transition:transform .35s cubic-bezier(.2,.8,.2,1),background-color .35s,color .35s}
.pd-lang:hover{transform:translateX(8px);background-color:#1D3A9A !important;color:#F4F6FB}
.pd-play{transition:transform .35s cubic-bezier(.2,.8,.2,1)}
.pd-play:hover{transform:scale(1.1)}

/* Zähler im Hero */
@property --n{syntax:'<integer>';inherits:false;initial-value:0}
.pd-count{counter-reset:n var(--n)}
.pd-count::after{content:counter(n)}
.pd-pct::after{content:counter(n) " %"}

.pd-prog,.pd-route-cover{display:none}
.pd-short{display:none}
.pd-menubtn .ic-close{display:none}
.pd-menubtn[aria-expanded="true"] .ic-open{display:none}
.pd-menubtn[aria-expanded="true"] .ic-close{display:block}
.pd-menu[hidden]{display:none !important}

@media (max-width: 1000px){.pd-oder{display:none !important}}
@media (max-width: 1320px){.pd-navlinks{display:none !important}.pd-menubtn{display:inline-flex !important}}
@media (max-width: 960px){.pd-switch{display:none !important}.pd-long{display:none}.pd-short{display:inline}.pd-wm{font-size:22px !important}}
@media (max-width: 560px){
  .pd-cta{display:none !important}
  .pd-wrap{padding-left:20px !important;padding-right:20px !important}
  .pd-map{padding:48px 20px 64px !important;border-radius:32px !important}
  .pd-formcard{padding:26px !important;border-radius:28px !important}
  .pd-offer{padding:28px !important;border-radius:32px !important}
  .pd-hero-fig .pd-bob{left:-8px !important}
  .pd-hero-fig .pd-bob2{right:-6px !important}
}
.pd-route-cover{stroke-dashoffset:-1}
.pd-map{view-timeline-name:--route}

/* ---------- FAQ (natives Akkordeon) ---------- */
.pd-faq{border-bottom:1.5px solid #0E1B4D}
.pd-faq summary{list-style:none;min-height:72px;padding:22px 4px;display:flex;align-items:center;justify-content:space-between;gap:20px;cursor:pointer;color:#0E1B4D;font-size:22px;font-weight:700;letter-spacing:-0.02em}
.pd-faq summary::-webkit-details-marker{display:none}
.pd-faq .pd-sign{flex:none;width:40px;height:40px;border-radius:50%;background:#1D3A9A;color:#F4F6FB;display:flex;align-items:center;justify-content:center;transition:transform .35s cubic-bezier(.2,.8,.2,1)}
.pd-faq .pd-sign svg{display:block}
.pd-faq summary:hover .pd-sign{transform:rotate(90deg)}
.pd-faq[open] .pd-sign{transform:rotate(45deg)}
.pd-faq .pd-a{padding:0 64px 26px 4px;max-width:760px}
.pd-faq .pd-a p{margin:0 0 14px;font-size:18px;line-height:1.6}
.pd-faq .pd-a p:last-child{margin-bottom:0}
@media (max-width:560px){.pd-faq summary{font-size:19px}.pd-faq .pd-a{padding-right:4px}}

/* ---------- Formular ---------- */
.pd-field{width:100%;box-sizing:border-box;min-height:52px;border:1.5px solid #0E1B4D;border-radius:16px;padding:12px 16px;font-family:inherit;font-size:17px;color:#0E1B4D;background:#FFFFFF}
textarea.pd-field{min-height:140px;resize:vertical;line-height:1.5}
.pd-label{display:block;font-size:14px;font-weight:700;margin-bottom:8px;padding:0}
.pd-label small{font-weight:400;color:#1D3A9A;font-size:14px}
fieldset{border:none;margin:0;padding:0;min-width:0}
.pd-chips{display:flex;flex-wrap:wrap;gap:8px}
.pd-chip{position:relative}
.pd-chip input{position:absolute;opacity:0;inset:0;margin:0;cursor:pointer}
.pd-chip span{display:inline-flex;align-items:center;gap:6px;min-height:44px;box-sizing:border-box;border:1.5px solid #0E1B4D;border-radius:999px;background:#FFFFFF;color:#0E1B4D;font-size:16px;font-weight:500;padding:0 18px;cursor:pointer;transition:background-color .25s,color .25s,transform .3s cubic-bezier(.2,.8,.2,1)}
.pd-chip:hover span{transform:translateY(-2px)}
.pd-chip input:checked + span{background:#1D3A9A;border-color:#1D3A9A;color:#F4F6FB;font-weight:700}
.pd-chip input:checked + span::before{content:"\2713"}
.pd-chip input:focus-visible + span{outline:3px solid #B88A4A;outline-offset:3px}
.pd-error{margin:0;font-size:15px;font-weight:700;color:#A33B2A}
.pd-error[hidden]{display:none}
.pd-submit[disabled]{opacity:.6;cursor:progress}

/* ---------- Unterseiten (Impressum, Datenschutz) ---------- */
.pd-legal{max-width:760px;margin:0 auto;padding:40px 32px 112px;box-sizing:border-box}
.pd-legal h1{font-size:clamp(40px,5vw,64px);line-height:1;letter-spacing:-0.04em;font-weight:800;margin:24px 0 32px}
.pd-legal h2{font-size:24px;letter-spacing:-0.02em;margin:40px 0 12px}
.pd-legal p,.pd-legal li{font-size:18px;line-height:1.6}
.pd-legal .pd-todo{background:#D5DEF3;border-radius:24px;padding:18px 22px;font-size:16px;line-height:1.5}

/* ---------- Bewegung ---------- */
@keyframes pdWord{from{opacity:0;translate:0 0.6em;rotate:4deg}to{opacity:1;translate:0 0;rotate:0deg}}
@keyframes pdUp{from{opacity:0;translate:0 32px}to{opacity:1;translate:0 0}}
@keyframes pdIn{from{opacity:0;scale:.92}to{opacity:1;scale:1}}
@keyframes pdBob{0%,100%{translate:0 0}50%{translate:0 -14px}}
@keyframes pdSpin{to{transform:rotate(360deg)}}
@keyframes pdCount{from{--n:0}}
@keyframes pdFade{from{opacity:0;translate:0 -8px}to{opacity:1;translate:0 0}}
@keyframes pdRise{from{opacity:0;translate:0 64px}to{opacity:1;translate:0 0}}
@keyframes pdLeft{from{opacity:0;translate:-80px 0}to{opacity:1;translate:0 0}}
@keyframes pdRight{from{opacity:0;translate:80px 0}to{opacity:1;translate:0 0}}
@keyframes pdZoom{from{opacity:.2;scale:.82;rotate:-3deg}to{opacity:1;scale:1;rotate:0deg}}
@keyframes pdPop{from{scale:0;rotate:-120deg}70%{scale:1.2}to{scale:1;rotate:0deg}}
@keyframes pdPar{from{translate:0 60px}to{translate:0 -60px}}
@keyframes pdDrift{from{translate:-160px 30px}to{translate:120px -30px}}
@keyframes pdSun{from{translate:0 140px}to{translate:0 0}}
@keyframes pdRoute{from{stroke-dashoffset:0}to{stroke-dashoffset:-1}}
@keyframes pdHead{from{box-shadow:0 0 0 rgba(14,27,77,0)}to{box-shadow:0 10px 30px -18px rgba(14,27,77,.55)}}
@keyframes pdGrow{from{scale:0 1}to{scale:1 1}}
@media (prefers-reduced-motion: no-preference){
.pd-w{display:inline-block;animation:pdWord 1s cubic-bezier(.2,.8,.2,1) both}
.pd-load{animation:pdUp 1s cubic-bezier(.2,.8,.2,1) both}
.pd-loadin{animation:pdIn 1.2s cubic-bezier(.2,.8,.2,1) both}
.d1{animation-delay:.05s}.d2{animation-delay:.12s}.d3{animation-delay:.19s}.d4{animation-delay:.26s}.d5{animation-delay:.33s}.d6{animation-delay:.4s}.d7{animation-delay:.47s}.d8{animation-delay:.6s}.d9{animation-delay:.75s}.d10{animation-delay:.9s}
.pd-bob{animation:pdBob 6s ease-in-out infinite}
.pd-bob2{animation:pdBob 7.5s ease-in-out -3s infinite}
.pd-spin{transform-box:fill-box;transform-origin:center;animation:pdSpin 40s linear infinite}
.pd-count{animation:pdCount 1.8s cubic-bezier(.2,.8,.2,1) .7s both}
.pd-answer,.pd-faq[open] .pd-a{animation:pdFade .4s cubic-bezier(.2,.8,.2,1) both}
@supports (animation-timeline: view()){
.pd-reveal{animation:pdRise linear both;animation-timeline:view();animation-range:entry 0px entry 280px}
.pd-r2{animation-range:entry 40px entry 320px}
.pd-r3{animation-range:entry 80px entry 360px}
.pd-left{animation:pdLeft linear both;animation-timeline:view();animation-range:entry 0px entry 280px}
.pd-right{animation:pdRight linear both;animation-timeline:view();animation-range:entry 0px entry 280px}
.pd-left:nth-child(3),.pd-right:nth-child(3){animation-range:entry 40px entry 320px}
.pd-left:nth-child(4),.pd-right:nth-child(4){animation-range:entry 80px entry 360px}
.pd-right:nth-child(5){animation-range:entry 120px entry 400px}
.pd-zoom{animation:pdZoom linear both;animation-timeline:view();animation-range:entry 0px entry 280px}
.pd-pop{animation:pdPop linear both;animation-timeline:view();animation-range:entry 0px entry 280px}
.pd-par{animation:pdPar linear both;animation-timeline:view();animation-range:cover 0% cover 100%}
.pd-drift{animation:pdDrift linear both;animation-timeline:view();animation-range:cover 0% cover 100%}
.pd-sun{animation:pdSun linear both;animation-timeline:view();animation-range:entry 0% cover 55%}
.pd-route-cover{display:inline;animation:pdRoute linear both;animation-timeline:--route;animation-range:cover 12% cover 88%}
.pd-head{animation:pdHead linear both;animation-timeline:scroll(root);animation-range:0px 160px}
.pd-prog{display:block;transform-origin:left;animation:pdGrow linear both;animation-timeline:scroll(root)}
}
}

/* ---------- Sprachfassungen ---------- */
.pd-note{background:#D5DEF3;border-radius:24px;padding:14px 20px;font-size:15px !important;line-height:1.5}
html[lang="en"] .pd-pct::after,html[lang="bs"] .pd-pct::after{content:counter(n) "%"}
/* Arabisch: eigene Schrift, keine Laufweite (würde die Buchstaben trennen), arabisch-indische Ziffern, gespiegelte Richtungen */
html[lang="ar"] body,html[lang="ar"] .pd-field,html[lang="ar"] button{font-family:'Alexandria','Bricolage Grotesque',sans-serif}
html[lang="ar"] .serif,html[lang="ar"] .pd-oder{font-family:'Alexandria',sans-serif !important;font-style:normal !important;font-weight:600 !important}
html[lang="ar"] body *{letter-spacing:0 !important}
html[lang="ar"] [dir="ltr"],html[lang="ar"] .pd-switch{letter-spacing:normal}
html[lang="ar"] h1,html[lang="ar"] h2{line-height:1.25 !important}
html[lang="ar"] h3{line-height:1.35 !important}
html[lang="ar"] .pd-count::after{content:counter(n, arabic-indic)}
html[lang="ar"] .pd-pct::after{content:counter(n, arabic-indic) "٪"}
[dir="rtl"] .pd-lang:hover{transform:translateX(-8px)}
[dir="rtl"] .pd-faq .pd-a{padding:0 4px 26px 64px}
[dir="rtl"] .pd-submit svg{transform:scaleX(-1)}
[dir="rtl"] .pd-prog{transform-origin:right}
[dir="rtl"] .pd-card:hover{transform:translateY(-8px) rotate(.6deg)}
@media (max-width:560px){[dir="rtl"] .pd-faq .pd-a{padding-left:4px}}

/* ---------- Sprachseite Arabisch: Lernwege ---------- */
.pl-ways{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,340px),1fr));gap:28px;margin-top:48px}
.pl-way{background:#F4F6FB;color:#0E1B4D;border-radius:40px;padding:36px;display:flex;flex-direction:column;gap:16px}
.pl-way-dark{background:#1D3A9A;color:#F4F6FB}
.pl-way-top{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:96px}
.pl-num{flex:none;width:56px;height:56px;border-radius:50%;background:#B88A4A;color:#0E1B4D;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:20px}
.pl-glyph{font-size:68px;line-height:1.4;color:#1D3A9A;direction:rtl}
.pl-way-dark .pl-glyph{color:#9FB3E3}
.pl-way h3{margin:4px 0 0;font-size:clamp(30px,2.8vw,38px);letter-spacing:-0.035em;font-weight:800;line-height:1.05}
.pl-way dl{margin:0}
.pl-way dt{margin:16px 0 0;font-size:12px;letter-spacing:0.12em;text-transform:uppercase;font-weight:700;color:#1D3A9A}
.pl-way-dark dt{color:#9FB3E3}
.pl-way dd{margin:4px 0 0;font-size:17px;line-height:1.55}
.pl-way-dark dd{color:#F4F6FB}
.pl-way-btn{margin-top:auto;align-self:flex-start;text-decoration:none;background:#1D3A9A;color:#F4F6FB;border-radius:999px;padding:15px 26px;font-size:17px;font-weight:700}
.pl-way-btn:hover{color:#F4F6FB}
.pl-way-dark .pl-way-btn{background:#F4F6FB;color:#0E1B4D}
.pl-way dl+.pl-way-btn{margin-top:auto;padding-top:15px}
.pl-way dl{margin-bottom:12px}

/* ---------- Mini-Lektion ---------- */
/* Markazi Text (OFL 1.1): klassische Naskh-Formen mit gut erkennbaren Vokalzeichen – für Lehrtexte */
@font-face{font-family:'Markazi Text';font-style:normal;font-weight:400 700;font-display:swap;src:url(../fonts/markazi-text-arabic-wght-normal.woff2) format('woff2');unicode-range:U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0897-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC}
.pl-lesson .ar,.pl-glyph,.pd-teaser-word .ar{font-family:'Markazi Text','Alexandria',serif;font-weight:500}
.pl-lesson{max-width:920px;margin:48px auto 0;background:#D5DEF3;border-radius:48px;padding:28px 36px 32px;box-sizing:border-box}
.pl-progress{display:flex;align-items:center;gap:14px}
.pl-bar{flex:1;height:6px;border-radius:3px;background:#F4F6FB;overflow:hidden}
.pl-fill{height:100%;width:0;background:#B88A4A;border-radius:3px;transition:width .5s cubic-bezier(.2,.8,.2,1)}
.pl-count{font-size:14px;font-weight:700;min-width:44px;text-align:right}
.pl-stage{margin-top:18px;background:#F4F6FB;border-radius:32px;padding:36px 32px;min-height:460px;box-sizing:border-box;display:flex;flex-direction:column;justify-content:center;text-align:center}
.pl-step{display:flex;flex-direction:column;align-items:center;gap:14px}
.pl-say{margin:0;font-size:22px;line-height:1.45;max-width:600px}
.pl-hint{margin:0;font-size:17px;line-height:1.55;max-width:560px;color:#1D3A9A}
.pl-big{font-size:170px;line-height:1.35}
.pl-lesson .c1{color:#1D3A9A}.pl-lesson .c2{color:#B88A4A}.pl-lesson .c3{color:#4A68C2}
.pl-eq{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:16px}
.pl-tile{background:#D5DEF3;border-radius:24px;padding:4px 26px 12px;min-width:96px}
.pl-tile .ar{display:block;font-size:92px;line-height:1.4}
.pl-tile b{font-size:20px}
.pl-plus{font-size:19px;color:#4A68C2;font-weight:500}
.pl-quiz{display:flex;flex-wrap:wrap;justify-content:center;gap:10px}
.pl-quiz button,.pl-nav button,.pl-play,.pl-restart{font-family:inherit;font-size:17px;font-weight:700;min-height:48px;padding:0 24px;border-radius:999px;border:1.5px solid #0E1B4D;background:#FFFFFF;color:#0E1B4D;cursor:pointer;transition:transform .3s cubic-bezier(.2,.8,.2,1),background-color .25s,color .25s}
.pl-quiz button{min-width:96px}
.pl-quiz button:hover,.pl-nav button:hover,.pl-restart:hover{transform:translateY(-2px)}
.pl-quiz button.ok{background:#1D3A9A;border-color:#1D3A9A;color:#F4F6FB}
.pl-quiz button.no{background:#F1DCD6;border-color:#A33B2A;color:#A33B2A}
.pl-fb{margin:0;min-height:26px;font-size:17px;font-weight:700}
.pl-fb.ok{color:#1D3A9A}.pl-fb.no{color:#A33B2A}
.pl-row,.pl-join{display:flex;direction:rtl;justify-content:center;align-items:baseline;font-size:150px;line-height:1.4}
.pl-row{gap:56px}
.pl-join{gap:64px;transition:gap 1.3s cubic-bezier(.6,0,.2,1)}
.pl-join span{transition:color 1s ease}
.pl-dir{margin:-14px 0 0;display:flex;align-items:center;gap:8px;font-size:12px;letter-spacing:0.12em;text-transform:uppercase}
.pl-ex{margin:0;font-size:18px;line-height:1.5;max-width:560px;min-height:54px}
.pl-play{background:#1D3A9A;border-color:#1D3A9A;color:#F4F6FB}
.pl-end{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:12px;margin-top:6px}
.pl-restart{background:none}
.pl-nav{display:flex;justify-content:space-between;gap:12px;margin-top:18px}
.pl-nav .pl-next{background:#1D3A9A;border-color:#1D3A9A;color:#F4F6FB}
.pl-nav [hidden]{display:inline-flex !important;visibility:hidden}
.pl-pop{animation:pdFade .7s cubic-bezier(.2,.8,.2,1) both}
@media (prefers-reduced-motion: no-preference){.pl-step.pl-in{animation:pdFade .45s cubic-bezier(.2,.8,.2,1) both}}
@media (prefers-reduced-motion: reduce){.pl-join,.pl-join span,.pl-fill{transition:none}}
@media (max-width:560px){
  .pl-lesson{padding:16px 14px 18px;border-radius:32px}
  .pl-stage{padding:24px 14px;min-height:420px;border-radius:24px}
  .pl-say{font-size:19px}.pl-hint{font-size:16px}
  .pl-big{font-size:112px}
  .pl-row,.pl-join{font-size:92px}.pl-row{gap:28px}.pl-join{gap:36px}
  .pl-way{padding:28px;border-radius:32px}
  .pl-eq{flex-wrap:nowrap;gap:8px}.pl-tile{padding:2px 14px 10px;min-width:0}.pl-tile .ar{font-size:72px}.pl-plus{font-size:15px}
}

/* ---------- Startseite: Hinweis auf die Arabisch-Seite ---------- */
.pd-teaser{margin-top:56px;background:#0E1B4D;color:#F4F6FB;border-radius:40px;padding:44px 48px;display:flex;flex-wrap:wrap;align-items:center;gap:40px;position:relative;overflow:hidden;text-decoration:none}
.pd-teaser-word{flex:1 1 260px;display:flex;flex-direction:column;align-items:center;gap:4px}
.pd-teaser-word .ar{font-size:120px;line-height:1.5;color:#F4F6FB;direction:rtl}
.pd-hint-link{align-self:flex-start;display:inline-flex;align-items:center;gap:10px;font-size:16px;font-weight:500;color:#0E1B4D;text-decoration:none;border-bottom:1.5px solid #B88A4A;padding-bottom:3px}
.pd-hint-link:hover{color:#1D3A9A}
.pd-lang a{color:inherit;text-decoration:none;display:flex;align-items:center;justify-content:space-between;gap:12px}
.pd-lang-name{display:flex;flex-direction:column;gap:2px;min-width:0}
.pd-lang a small{font-size:15px;font-weight:500;letter-spacing:0;line-height:1.3;color:#1D3A9A}
.pd-lang:hover a small{color:#D5DEF3}
.pd-lang-go{flex:none;width:44px;height:44px;border-radius:50%;background:#1D3A9A;color:#F4F6FB;display:flex;align-items:center;justify-content:center;transition:transform .35s cubic-bezier(.2,.8,.2,1),background-color .35s,color .35s}
.pd-lang-go svg{display:block}
.pd-lang:hover .pd-lang-go{background:#F4F6FB;color:#1D3A9A;transform:translateX(4px)}
[dir="rtl"] .pd-lang-go svg{transform:scaleX(-1)}
@media (max-width:560px){.pd-teaser{padding:30px 24px;border-radius:32px;gap:24px}.pd-teaser-word .ar{font-size:92px}}

/* ---------- Fahnen-Icons (assets/img/flags/, 4:3) ---------- */
[data-flag]::before{content:"";flex:none;display:inline-block;width:1.333em;height:1em;border-radius:.18em;background:var(--flag) center/cover no-repeat;box-shadow:inset 0 0 0 1px rgba(14,27,77,.16)}
a[data-flag]{display:inline-flex !important;align-items:center;gap:.4em}
.pd-lang[data-flag]{display:flex;align-items:center;gap:14px}
.pd-lang[data-flag]>a{flex:1;min-width:0}
.pd-lang[data-flag]:hover::before{box-shadow:0 0 0 1.5px rgba(244,246,251,.7)}
[data-flag="de"]{--flag:url(../img/flags/de.svg)}
[data-flag="en"]{--flag:url(../img/flags/en.svg)}
[data-flag="ba"]{--flag:url(../img/flags/ba.svg)}
[data-flag="ar"]{--flag:url(../img/flags/ar.svg)}
[data-flag="tr"]{--flag:url(../img/flags/tr.svg)}
[data-flag="fr"]{--flag:url(../img/flags/fr.svg)}
[data-flag="lb"]{--flag:url(../img/flags/lb.svg)}

/* ---------- Formular als Pop-up ---------- */
html.pd-modal{overflow:hidden}
.pd-dialog{border:none;padding:0;background:none;width:min(640px,calc(100% - 24px));max-width:none;max-height:calc(100% - 24px);overflow:auto;overscroll-behavior:contain;color:#0E1B4D;scrollbar-width:thin}
.pd-dialog[open]{display:flex;flex-direction:column}
.pd-dialog::backdrop{background:rgba(14,27,77,.72);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}
.pd-dialog .pd-formcard{animation:none !important;flex:none !important;width:100%}
.pd-x{position:sticky;top:0;z-index:1;align-self:flex-end;flex:none;width:48px;height:48px;margin-bottom:10px;border:none;border-radius:50%;background:#F4F6FB;color:#0E1B4D;display:flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 10px 24px -12px rgba(14,27,77,.8);transition:transform .3s cubic-bezier(.2,.8,.2,1)}
.pd-x:hover{transform:rotate(90deg)}
@media (prefers-reduced-motion: no-preference){.pd-dialog[open]{animation:pdUp .45s cubic-bezier(.2,.8,.2,1) both}.pd-dialog[open]::backdrop{animation:pdFade .3s ease both}}
@media (max-width:560px){.pd-dialog{width:calc(100% - 16px);max-height:calc(100% - 16px)}}

/* Impressum/Datenschutz: Kopfzeile auf dem Handy – Button einzeilig, Schriftzug ausgeblendet (Bildmarke bleibt) */
@media (max-width:560px){.pd-lwm{display:none}.pd-back{font-size:15px;padding:9px 16px !important}}