/* Schriften lokal eingebunden (SIL Open Font License) */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(fonts/Inter-400-latin-ext.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: 'Inter';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(fonts/Inter-400-latin.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: 'Inter';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(fonts/Inter-500-latin-ext.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: 'Inter';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(fonts/Inter-500-latin.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: 'Inter';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(fonts/Inter-600-latin-ext.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: 'Inter';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(fonts/Inter-600-latin.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: 'Inter';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(fonts/Inter-700-latin-ext.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: 'Inter';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(fonts/Inter-700-latin.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: 'Noto Naskh Arabic';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(fonts/NotoNaskhArabic-500-arabic.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: 'Noto Naskh Arabic';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(fonts/NotoNaskhArabic-500-latin-ext.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: 'Noto Naskh Arabic';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(fonts/NotoNaskhArabic-500-latin.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: 'Noto Naskh Arabic';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(fonts/NotoNaskhArabic-700-arabic.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: 'Noto Naskh Arabic';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(fonts/NotoNaskhArabic-700-latin-ext.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: 'Noto Naskh Arabic';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(fonts/NotoNaskhArabic-700-latin.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: 'Noto Sans Arabic';
  font-style: normal;
  font-weight: 400;
  font-stretch: 100%;
  font-display: swap;
  src: url(fonts/NotoSansArabic-400-arabic.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: 'Noto Sans Arabic';
  font-style: normal;
  font-weight: 400;
  font-stretch: 100%;
  font-display: swap;
  src: url(fonts/NotoSansArabic-400-latin-ext.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: 'Noto Sans Arabic';
  font-style: normal;
  font-weight: 400;
  font-stretch: 100%;
  font-display: swap;
  src: url(fonts/NotoSansArabic-400-latin.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: 'Noto Sans Arabic';
  font-style: normal;
  font-weight: 600;
  font-stretch: 100%;
  font-display: swap;
  src: url(fonts/NotoSansArabic-600-arabic.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: 'Noto Sans Arabic';
  font-style: normal;
  font-weight: 600;
  font-stretch: 100%;
  font-display: swap;
  src: url(fonts/NotoSansArabic-600-latin-ext.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: 'Noto Sans Arabic';
  font-style: normal;
  font-weight: 600;
  font-stretch: 100%;
  font-display: swap;
  src: url(fonts/NotoSansArabic-600-latin.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: 'Source Serif 4';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(fonts/SourceSerif4-500-latin-ext.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: 'Source Serif 4';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(fonts/SourceSerif4-500-latin.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: 'Source Serif 4';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(fonts/SourceSerif4-600-latin-ext.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: 'Source Serif 4';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(fonts/SourceSerif4-600-latin.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: 'Source Serif 4';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(fonts/SourceSerif4-700-latin-ext.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: 'Source Serif 4';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(fonts/SourceSerif4-700-latin.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;
}

:root{
  --green:#0f3d2e; --green2:#1b5e45; --green-soft:#e6efe9;
  --gold:#b48a35; --gold-soft:#f5ecd9;
  --bg:#f7f5ef; --card:#fff; --ink:#1b2a23; --muted:#56655d; --line:#e3ded2;
  --warn:#8a5a00; --warn-bg:#fff4dc; --miss:#a33b2b;
  --radius:16px; --shadow:0 1px 2px rgba(15,61,46,.06),0 8px 24px rgba(15,61,46,.07);
  --serif:"Source Serif 4",Georgia,serif; --sans:Inter,system-ui,"Segoe UI",Arial,sans-serif;
}
*{box-sizing:border-box}
html,body{margin:0}
body{background:#d9d6cc;font-family:var(--sans);color:var(--ink)}
button,input,select,textarea{font:inherit;color:inherit}
a{color:inherit}

/* ---------- Mockup-Werkzeugleiste (nicht Teil der Website) ---------- */
.tool{position:sticky;top:env(safe-area-inset-top,0px);z-index:50;background:#22302a;color:#eef;display:flex;flex-wrap:wrap;gap:8px 16px;align-items:center;padding:8px 16px;font-size:13px}
.tool b{color:#f3d58a;letter-spacing:.04em}
.seg{display:inline-flex;background:#34443c;border-radius:999px;padding:3px}
.seg button{border:0;background:none;color:#cfd8d2;padding:5px 12px;border-radius:999px;cursor:pointer}
.seg button[aria-pressed=true]{background:#f3d58a;color:#22302a;font-weight:600}
.tool label{display:inline-flex;gap:6px;align-items:center;cursor:pointer}
.stage{padding:24px 16px 60px;display:flex;justify-content:center}
.stage.desktop .site{width:100%;max-width:1280px;border-radius:12px;overflow:hidden;box-shadow:0 10px 40px rgba(0,0,0,.18)}
.stage.phone .site{width:390px;height:820px;border:12px solid #111;border-radius:48px;overflow-y:auto;overflow-x:hidden;box-shadow:0 10px 40px rgba(0,0,0,.3);scrollbar-width:none}
.stage.phone .site::-webkit-scrollbar{display:none}
body.nohints .mock{display:none!important}

/* ---------- Website ---------- */
.site{container-type:inline-size;background:var(--bg);position:relative}
.site[dir=rtl]{font-family:"Noto Sans Arabic",var(--sans)}
.site[dir=rtl] h1,.site[dir=rtl] h2,.site[dir=rtl] h3,.site[dir=rtl] .brand{font-family:"Noto Naskh Arabic",var(--serif)}
.site[dir=rtl] .arr{transform:scaleX(-1)}
.wrap{max-width:1180px;margin:0 auto;padding:0 16px}
h1,h2,h3{font-family:var(--serif);color:var(--green);margin:0;line-height:1.15}
h2{font-size:28px}
h3{font-size:20px}
p{line-height:1.6;margin:.4em 0}
.muted{color:var(--muted)}
.mock{display:inline-flex;align-items:center;gap:6px;font:500 12px/1.3 var(--sans);background:var(--warn-bg);color:var(--warn);border:1px dashed #d8b46a;border-radius:8px;padding:4px 8px}
.ph{background:repeating-linear-gradient(135deg,#efebe1 0 10px,#e9e4d8 10px 20px);color:var(--muted);display:grid;place-items:center;text-align:center;font-size:14px;padding:16px;border-radius:12px}
.miss{border-bottom:2px dotted var(--miss);cursor:help}
.miss::after{content:"⚑";color:var(--miss);font-size:.7em;margin-inline-start:3px;vertical-align:super}
.draftbar{background:var(--gold-soft);color:#6b4e12;text-align:center;font-size:13px;padding:6px 12px}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:48px;padding:0 22px;border-radius:12px;border:2px solid var(--green);background:var(--green);color:#fff;font-weight:600;font-size:16px;cursor:pointer;text-decoration:none}
.btn.ghost{background:#fff;color:var(--green)}
.btn.gold{background:var(--gold);border-color:var(--gold)}
.btn.sm{min-height:38px;padding:0 14px;font-size:14px;border-radius:10px}
.btn:focus-visible,.chip:focus-visible,a:focus-visible,button:focus-visible{outline:3px solid var(--gold);outline-offset:2px}
.chip{border:1px solid var(--line);background:#fff;border-radius:999px;padding:8px 14px;font-size:14px;cursor:pointer}
.chip[aria-pressed=true]{background:var(--green);border-color:var(--green);color:#fff}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.tag{display:inline-block;font-size:12px;font-weight:600;padding:3px 8px;border-radius:6px;background:var(--green-soft);color:var(--green)}
.tag.gold{background:var(--gold-soft);color:#7a5a17}
.tag.int{background:#f3e1df;color:#8b2c22}
.card{background:var(--card);border-radius:var(--radius);box-shadow:var(--shadow);padding:20px}
.grid{display:grid;gap:16px}
section{padding:28px 0}
.sec-head{display:flex;justify-content:space-between;align-items:end;gap:12px;margin-bottom:16px;flex-wrap:wrap}
.link{color:var(--green);font-weight:600;text-decoration:none;display:inline-flex;gap:6px;align-items:center;background:none;border:0;cursor:pointer;padding:0}

/* Kopfbereich */
header.top{background:#fff;border-bottom:1px solid var(--line);position:relative;z-index:20}
.topin{display:flex;flex-wrap:wrap;align-items:center;gap:6px 12px;min-height:68px;padding-top:8px}
.brand{min-width:0;font-family:var(--serif);font-size:24px;font-weight:700;color:var(--green);text-decoration:none;display:flex;flex-direction:column;line-height:1.1;cursor:pointer;background:none;border:0;padding:0;text-align:start}
.brand small{font:500 12px var(--sans);color:var(--muted)}
.brandwrap{display:flex;align-items:center;gap:10px;flex:1;min-width:0}
.brandwrap img{height:46px;width:auto;flex:0 0 auto}
.brandwrap .brand{flex:1}
.flogo{width:220px;max-width:100%;height:auto;margin-bottom:10px}
.mainnav{display:none;gap:4px;flex-wrap:wrap}
.mainnav a{text-decoration:none;display:inline-block}
.mainnav button,.mainnav a{background:none;border:0;padding:8px 10px;border-radius:8px;cursor:pointer;font-size:15px;color:var(--ink)}
.mainnav a[aria-current=page],.mainnav button[aria-current=page]{color:var(--green);font-weight:700;box-shadow:inset 0 -2px 0 var(--gold)}
.langs{display:flex;gap:2px;font-size:14px;order:3;width:100%;padding-bottom:6px}
.langs a{text-decoration:none}
.langs button,.langs a{background:none;border:0;padding:6px 8px;cursor:pointer;border-radius:6px;color:var(--muted)}
.langs a[aria-pressed=true],.langs button[aria-pressed=true]{color:var(--green);font-weight:700;background:var(--green-soft)}
.langs .ar{font-family:"Noto Sans Arabic"}
.langs{align-items:center;flex-wrap:wrap}
.langs button,.langs a{display:inline-flex;align-items:center;gap:6px}
.lic{width:20px;height:14px;border-radius:3px;flex:0 0 auto;box-shadow:0 0 0 1px rgba(0,0,0,.12)}
.lic.txt{width:20px;height:20px;border-radius:50%;display:inline-grid;place-items:center;background:var(--green);color:#fff;font:700 12px/1 "Noto Sans Arabic",sans-serif;box-shadow:none}
.langs .a11ybtn{margin-inline-start:6px;border:1.5px solid var(--line);color:var(--ink)}
.langs .a11ybtn[aria-pressed=true]{border-color:var(--green)}
.a11yic{width:20px;height:20px;flex:0 0 auto;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
/* Barrierefrei: größere Schrift, stärkere Kontraste, unterstrichene Links, keine Zierflächen und Animationen */
.site.a11y{--muted:#26322c;--line:#7d8a83;--ink:#000;--gold-soft:#fbf3e0}
.site.a11y main,.site.a11y footer{zoom:1.18}
.site.a11y .pattern{background-image:none}
.site.a11y .link,.site.a11y main a{text-decoration:underline;text-underline-offset:3px}
.site.a11y .btn{border-width:3px}
.site.a11y .hero .ctas{flex-direction:column;align-items:flex-start}
.site.a11y .btn{white-space:nowrap}
.site.a11y :focus-visible{outline-width:4px}
.site.a11y *{animation:none!important;transition:none!important}
.burger{width:44px;height:44px;border-radius:10px;border:1px solid var(--line);background:#fff;cursor:pointer;font-size:20px}
.boardlink{display:none}
.drawer{background:#fff;border-bottom:1px solid var(--line);padding:8px 16px 16px}
.drawer a{text-decoration:none;color:inherit}
.drawer button,.drawer a{display:block;width:100%;text-align:start;background:none;border:0;border-bottom:1px solid var(--line);padding:14px 4px;font-size:18px;cursor:pointer}

/* Hero */
.hero{position:relative;display:grid;background:var(--bg)}
.hero-img{position:relative;min-height:260px;aspect-ratio:5/4;max-height:340px;width:calc(100% - 32px);margin:16px auto 0;border-radius:var(--radius);overflow:hidden;background:#cfd6d0 center/cover no-repeat url(img/hero-innen-800.jpg)}
.hero-txt{padding:24px 16px 28px}
.hero h1{font-size:40px;letter-spacing:-.01em}
.hero .sub{font-size:19px;color:var(--ink);margin:10px 0 20px}
.hero .ctas{display:flex;flex-direction:column;gap:10px}
.hero .bar{width:44px;height:3px;background:var(--gold);margin-bottom:14px}
.hero .imgnote{position:absolute;top:12px;inset-inline-start:12px;z-index:2}

/* Gebetszeiten */
.pray{position:relative;margin-top:16px}
/* Kasten als Inhaltsspalte: gleiche Breite wie die übrigen Abschnitte, eigener Innenabstand */
.wrap.card{width:calc(100% - 32px);max-width:1116px;padding:22px 20px}
.pray-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:14px}
.pt{border:1px solid var(--line);border-radius:12px;padding:12px 6px;text-align:center;background:#fff}
.pt .n{font-size:14px;color:var(--muted);overflow-wrap:anywhere;hyphens:auto}
.pt .t{font:600 24px var(--serif);color:var(--ink);margin-top:2px}
.pt.sun{background:#faf8f3}
.pt.sun .t{font-size:20px;color:var(--muted)}
.pt.next{background:var(--green);border-color:var(--green);color:#fff}
.pt.next .n,.pt.next .t{color:#fff}
.pt .jm{margin-top:6px;font-size:11px;overflow-wrap:anywhere;hyphens:auto;background:var(--gold-soft);color:#6b4e12;border-radius:6px;padding:3px 4px;line-height:1.3}
.pt .jm b{font-size:14px}
.pt .lbl{font-size:12px;margin-top:4px;color:#f3d58a;font-weight:600}
.friday{display:flex;flex-wrap:wrap;gap:8px 16px;align-items:center;justify-content:space-between;margin-top:12px;padding:14px;border-radius:12px;background:var(--gold-soft)}
.countdown{font-weight:600;color:var(--green)}
.cdbar{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:14px;padding:12px 16px;border-radius:12px;background:var(--green);color:#fff;font-size:18px}
.cdbar svg{width:26px;height:26px;stroke:#f3d58a;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;flex:0 0 auto}
.cdbar b{font:700 26px/1 var(--serif);color:#f3d58a;font-variant-numeric:tabular-nums;letter-spacing:.02em}
.pt .cd{margin-top:2px;font:600 13px/1.2 var(--sans);font-variant-numeric:tabular-nums;color:#fff;opacity:.9}
.pattern{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='48' height='48' viewBox='0 0 48 48'%3E%3Cg fill='none' stroke='%23b48a35' stroke-opacity='.12'%3E%3Crect x='14' y='14' width='20' height='20'/%3E%3Crect x='14' y='14' width='20' height='20' transform='rotate(45 24 24)'/%3E%3C/g%3E%3C/svg%3E")}

/* Karten / Teaser */
.ev{display:flex;gap:14px;align-items:flex-start;padding:14px;border:1px solid var(--line);border-radius:14px;background:#fff;cursor:pointer;text-align:start;width:100%}
.ev .d{flex:0 0 58px;text-align:center;border-radius:10px;background:var(--green-soft);padding:8px 4px;color:var(--green)}
.ev .d b{display:block;font:700 22px var(--serif)}
.ev .d span{font-size:12px;text-transform:uppercase}
.ev h3{font-size:17px;margin-bottom:4px}
.tease{overflow:hidden;padding:0;display:flex;flex-direction:column}
.tease .img{height:180px;background:center/cover no-repeat}
.tease .body{padding:18px;display:flex;flex-direction:column;gap:8px;flex:1}
.hint{display:flex;gap:12px;align-items:flex-start;border-inline-start:4px solid var(--gold);background:#fff;padding:14px;border-radius:10px}
.hoca{display:grid;gap:16px;align-items:center}
.portrait{width:120px;height:120px;border-radius:50%;background:var(--green-soft);display:grid;place-items:center;color:var(--green);font-size:13px;text-align:center;border:2px dashed #9fb8aa}

/* Seitenkopf */
.pagehead{background:var(--green);color:#fff;padding:32px 0 26px}
/* Wissensbeiträge (Blog) */
.blogcard .img{height:200px}
.blogcard h3 a{color:inherit;text-decoration:none}
.blogcard h3 a:hover,.blogcard h3 a:focus-visible{text-decoration:underline}
.blogmeta{display:flex;gap:8px;flex-wrap:wrap;align-items:center;font-size:13px;color:var(--muted)}
.pagehead .crumb{margin:0 0 10px;font-size:15px}
.pagehead .blogmeta{color:#d8e6de;margin-top:10px}
.post{display:grid;gap:22px;grid-template-columns:minmax(0,1fr)}
.post-side{display:grid;gap:22px;align-content:start}
.post-img{width:100%;aspect-ratio:16/9;max-height:460px;object-fit:cover;border-radius:var(--radius);display:block;background:var(--line)}
.post-body h2{font-size:24px;margin:26px 0 8px}
.post-body h2:first-child{margin-top:0}
.post-body p,.post-body li{font-size:18px;line-height:1.65}
.post-body ul{padding-inline-start:22px;margin:8px 0}
.post-body li{margin:6px 0}
.post-quellen{font-size:14px;color:var(--muted)}
.post-quellen ul{margin:6px 0 0;padding-inline-start:20px}
.pagehead h1{color:#fff;font-size:34px}
.pagehead p{color:#d8e6de;max-width:720px}

/* Tabellen */
table{width:100%;border-collapse:collapse;font-size:15px}
th,td{padding:10px 8px;border-bottom:1px solid var(--line);text-align:start}
th{font-size:13px;color:var(--muted);font-weight:600}
tr.today td{background:var(--green-soft);font-weight:600}
.tablewrap{overflow-x:auto}

/* Monatskalender */
.cal{display:grid;grid-template-columns:repeat(7,1fr);gap:4px}
.cal .h{font-size:12px;color:var(--muted);text-align:center;padding:4px}
.cal .c{min-height:56px;border-radius:8px;background:#fff;border:1px solid var(--line);padding:4px;font-size:13px}
.cal .c.o{opacity:.35}
.cal .c.t{border-color:var(--green);box-shadow:inset 0 0 0 1px var(--green)}
.cal .dot{display:block;font-size:11px;background:var(--green);color:#fff;border-radius:4px;padding:1px 4px;margin-top:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;cursor:pointer}

/* Kinder */
.age{border-radius:18px;padding:22px;color:#fff;min-height:150px;display:flex;flex-direction:column;justify-content:space-between}
.age b{font:700 30px var(--serif)}
.a1{background:#3f8f6b}.a2{background:#c58b2a}.a3{background:#2f6f8f}
.ram{display:grid;grid-template-columns:repeat(6,1fr);gap:6px}
.ram button{aspect-ratio:1;border-radius:10px;border:1px solid var(--line);background:#fff;cursor:pointer;font:600 16px var(--serif);color:var(--green)}
.ram button.open{background:var(--gold-soft)}

/* Videos */
.vid .img{height:150px;background:var(--green) center/cover;position:relative;display:grid;place-items:center}
.vid .play{width:56px;height:56px;border-radius:50%;background:rgba(255,255,255,.92);display:grid;place-items:center;color:var(--green);font-size:22px}

/* Anfahrt */
.ic{width:26px;height:26px;flex:0 0 auto;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.way{display:flex;flex-direction:column;gap:12px}
.way .hd{display:flex;align-items:center;gap:12px}
.way .hd .bub{width:48px;height:48px;border-radius:14px;display:grid;place-items:center;background:var(--green-soft);color:var(--green);flex:0 0 auto}
.way.best{border:2px solid var(--green)}
.badge{display:inline-block;font-size:12px;font-weight:700;letter-spacing:.03em;padding:3px 9px;border-radius:999px;background:var(--green);color:#fff}
.stops{display:grid;gap:8px;margin:0;padding:0;list-style:none}
.stops li{display:grid;grid-template-columns:auto 1fr;gap:4px 12px;align-items:center;padding:10px 12px;border-radius:10px;background:#faf8f3;border:1px solid var(--line)}
.stops .min{grid-row:span 2;font:700 20px var(--serif);color:var(--green);text-align:center;min-width:56px;font-variant-numeric:tabular-nums}
.stops .min small{display:block;font:500 11px var(--sans);color:var(--muted)}
.lines{display:flex;flex-wrap:wrap;gap:4px}
.ln{font:700 12px/1 var(--sans);padding:4px 6px;border-radius:5px;color:#fff;min-width:24px;text-align:center}
.ln.s{background:#2e7d32}.ln.u{background:#1f5aa6}.ln.t{background:#b3261e}.ln.b{background:#6b4fa0}
.rules{display:grid;gap:10px;margin:0;padding:0;list-style:none}
.rules li{display:flex;gap:12px;align-items:flex-start;padding:12px 14px;border-radius:12px;background:#fff;color:var(--ink);font-size:16px;border:1px solid var(--line);line-height:1.45}
.rules .ok{color:#1d7a46}.rules .no{color:#b3261e}
.nb{background:var(--green);color:#fff;border-radius:var(--radius);padding:22px}
.nb h2{color:#fff}.nb p{color:#d8e6de}

/* Hausordnung */
.ho-sec{display:grid;grid-template-columns:auto 1fr;gap:6px 16px;padding:20px;break-inside:avoid}
.ho-num{width:42px;height:42px;border-radius:12px;background:var(--green);color:#fff;display:grid;place-items:center;font:700 18px var(--serif);grid-row:span 2}
.ho-sec h3{font-size:19px;align-self:center}
.ho-sec p{margin:.35em 0}
.ho-pre{background:var(--gold-soft);border-radius:var(--radius);padding:22px;font-size:17px}
.ho-toc{display:flex;flex-wrap:wrap;gap:6px}
.ho-toc a{font-size:13px;text-decoration:none;padding:5px 9px;border-radius:999px;background:#fff;border:1px solid var(--line);color:var(--green)}
/* Punktekarte */
.pk{background:linear-gradient(135deg,#0f3d2e,#1b5e45);color:#fff;border-radius:20px;padding:22px;box-shadow:var(--shadow);position:relative;overflow:hidden;max-width:560px}
.pk::after{content:"";position:absolute;inset:0;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='48' height='48' viewBox='0 0 48 48'%3E%3Cg fill='none' stroke='%23f3d58a' stroke-opacity='.12'%3E%3Crect x='14' y='14' width='20' height='20'/%3E%3Crect x='14' y='14' width='20' height='20' transform='rotate(45 24 24)'/%3E%3C/g%3E%3C/svg%3E");pointer-events:none}
.pk .top{display:flex;align-items:center;gap:12px;position:relative;z-index:1}
.pk .top img{height:46px}
.pk h3{color:#fff;font-size:22px}
.pk .top small{display:block;color:#f3d58a;font:600 13px var(--sans)}
.pk .grid10{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;margin:18px 0 12px;position:relative;z-index:1}
.pk .st{aspect-ratio:1;border-radius:50%;border:2px dashed rgba(255,255,255,.45);display:grid;place-items:center;font:700 14px var(--sans);color:rgba(255,255,255,.6);background:rgba(255,255,255,.04)}
.pk .st.on{border:2px solid #f3d58a;background:#f3d58a;color:#0f3d2e}
.pk .st.on svg{width:60%;height:60%;fill:#0f3d2e}
.pk .st.gift{border:2px solid #f3d58a;color:#f3d58a;background:rgba(243,213,138,.15)}
.pk .st.gift svg{width:62%;height:62%;stroke:#f3d58a;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.pk .name{position:relative;z-index:1;display:flex;justify-content:space-between;gap:10px;font-size:14px;color:#d8e6de;border-top:1px dashed rgba(255,255,255,.3);padding-top:10px}
.pk-steps{display:grid;gap:10px;margin:0;padding:0;list-style:none}
.pk-steps li{display:flex;gap:12px;align-items:flex-start;background:#fff;border:1px solid var(--line);border-radius:12px;padding:12px 14px}
.pk-steps .nr{flex:0 0 32px;height:32px;border-radius:50%;background:var(--gold);color:#fff;display:grid;place-items:center;font-weight:700}

/* Organigramm */
.org{display:flex;flex-direction:column;gap:10px}
.org .box{background:#fff;border:1px solid var(--line);border-radius:14px;padding:14px;text-align:center}
.org .row{display:grid;gap:10px}

/* Fußbereich */
footer{background:var(--green);color:#d8e6de;padding:32px 0 100px;margin-top:20px;font-size:14px}
footer h3{color:#fff;font-size:18px;margin-bottom:8px}
footer a{color:#fff}
.bottombar{position:sticky;bottom:0;z-index:25;display:grid;grid-template-columns:repeat(4,1fr);background:#fff;border-top:1px solid var(--line);box-shadow:0 -4px 16px rgba(0,0,0,.06)}
.bottombar a{text-decoration:none}
.bottombar button,.bottombar a{background:none;border:0;padding:9px 2px 11px;display:flex;flex-direction:column;align-items:center;gap:2px;font-size:12px;cursor:pointer;color:var(--ink)}
.bottombar svg{width:22px;height:22px;stroke:var(--green)}

/* Dialog */
.modal{position:fixed;inset:0;background:rgba(10,30,22,.45);display:grid;place-items:center;z-index:100;padding:16px}
.modal .card{max-width:560px;width:100%;max-height:90vh;overflow:auto}

/* Formulare */
.field{display:flex;flex-direction:column;gap:6px;margin-bottom:14px}
.field label{font-weight:600}
.field input,.field select,.field textarea{min-height:48px;border:1.5px solid #bfc9c2;border-radius:10px;padding:10px 12px;background:#fff;font-size:16px}
.field .err{color:var(--miss);font-weight:600;font-size:15px}
.field.bad input{border-color:var(--miss)}

/* ---------- Vorstandsbereich ---------- */
.vb{font-size:18px;min-height:700px;background:#f3f1ea}
.vb header{background:var(--green);color:#fff;padding:16px 0}
.vb header .wrap{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}
.vb header b{font:700 22px var(--serif)}
.vb .big{width:100%;min-height:96px;font-size:24px;border-radius:18px;gap:14px}
.vb .tiles{display:grid;gap:12px}
.vb .tile{background:#fff;border:2px solid var(--line);border-radius:16px;padding:18px;display:flex;gap:14px;align-items:center;cursor:pointer;text-align:start;font-size:19px;font-weight:600;width:100%}
.vb .tile .ic{flex:0 0 52px;height:52px;border-radius:12px;background:var(--green-soft);display:grid;place-items:center;font-size:26px}
.vb .tile[aria-pressed=true]{border-color:var(--green);background:var(--green-soft)}
.vb .tile small{display:block;font-weight:400;font-size:15px;color:var(--muted)}
.steps{display:flex;gap:6px;margin:6px 0 18px}
.steps span{flex:1;height:8px;border-radius:4px;background:#d9ded9}
.steps span.on{background:var(--green)}
.vb .field input,.vb .field select{min-height:58px;font-size:20px}
.vb details{background:#fff;border-radius:14px;padding:4px 16px;border:1px solid var(--line);margin-bottom:16px}
.vb summary{padding:14px 0;font-weight:600;cursor:pointer}
.vb .navbtns{display:flex;gap:12px;justify-content:space-between;margin-top:8px}
.help{background:#fff;border-radius:12px;padding:12px 14px;border:1px solid var(--line);font-size:16px;color:var(--muted)}
.spin{width:18px;height:18px;border:3px solid rgba(255,255,255,.4);border-top-color:#fff;border-radius:50%;animation:sp .8s linear infinite}
.toast{position:fixed;left:50%;bottom:calc(24px + env(safe-area-inset-bottom,0px));transform:translateX(-50%);z-index:200;background:#22302a;color:#fff;padding:12px 18px;border-radius:12px;max-width:min(520px,calc(100vw - 32px));font-size:15px;box-shadow:0 8px 24px rgba(0,0,0,.25)}
@keyframes sp{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.spin{animation-duration:2.4s}}

/* ---------- Breitere Darstellung (Container-Abfragen) ---------- */
@container (min-width: 760px){
  .wrap{padding:0 32px}
  /* Titelbild in derselben Inhaltsspalte wie alle Kästen (links und rechts bündig) */
  .hero{grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);min-height:480px;align-items:stretch;width:calc(100% - 64px);max-width:1116px;margin:28px auto 0;column-gap:40px}
  .hero-img{grid-column:2;grid-row:1;aspect-ratio:auto;max-height:none;min-height:100%;width:100%;margin:0;border-radius:var(--radius);overflow:hidden;background-image:url(img/hero-innen-1200.jpg)}
  .hero-txt{grid-column:1;grid-row:1;align-self:center;padding:32px 0}
  .site[dir=rtl] .hero-txt{padding:32px 0}
  .hero h1{font-size:56px;max-width:560px}
  .hero .sub{font-size:22px}
  .hero .ctas{flex-direction:row}
  .pray{margin-top:28px}
  .wrap.card{width:calc(100% - 64px);padding:28px}
  .pray-grid{grid-template-columns:repeat(6,minmax(0,1fr))}
  .g2{grid-template-columns:1fr 1fr}
  .g3{grid-template-columns:repeat(3,1fr)}
  .g4{grid-template-columns:repeat(4,1fr)}
  .g21{grid-template-columns:2fr 1fr}
  .hoca{grid-template-columns:140px 1fr}
  .org .row{grid-template-columns:repeat(3,1fr)}
  .rules{grid-template-columns:1fr 1fr}
  .ram{grid-template-columns:repeat(10,1fr)}
  .vb .tiles{grid-template-columns:1fr 1fr}
  .bottombar{display:none}
  footer{padding-bottom:32px}
  .pagehead h1{font-size:44px}
}
@container (min-width: 1060px){
  .post{grid-template-columns:minmax(0,1fr) 300px;align-items:start}
  .post-img{grid-column:1/-1}
  .post-side{position:sticky;top:20px}
  .mainnav{display:flex;order:3;width:100%;border-top:1px solid var(--line);padding:4px 0;justify-content:space-between}
  .burger,.drawer{display:none}
  .boardlink{display:inline-flex}
  .topin{gap:8px 16px;padding-top:6px}
  .brandwrap{flex:0 1 auto}
  .brand{white-space:nowrap}
  .langs{order:0;width:auto;padding:0;margin-inline-start:auto}
}
@media print{
  .tool,header.top,footer,.bottombar,.noprint,.draftbar{display:none!important}
  body,.stage,.site{background:#fff!important;box-shadow:none!important;border:0!important;height:auto!important;width:auto!important}
}

/* ---- Live-Betrieb (WordPress) ---- */
body{background:var(--bg)}
.stage{padding:0!important;display:block}
.stage.desktop .site{max-width:none!important;width:100%;border-radius:0!important;box-shadow:none!important;overflow:visible}
body.nohints .mock{display:none!important}
.miss{border:0!important;cursor:auto}.miss::after{display:none!important}
.admin-bar header.top{top:32px}
@media (max-width:782px){.admin-bar header.top{top:46px}}
.noscript{max-width:760px;margin:0 auto;padding:32px 16px;font:16px/1.6 Inter,system-ui,sans-serif}
