/* --- Self-hosted fonts (no third-party requests) --- */
/* latin-ext */
@font-face {
  font-family: 'Atkinson Hyperlegible';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(assets/fonts/9Bt23C1KxNDXMspQ1lPyU89-1h6ONRlW45G07JIoSwQ.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;
}
/* latin */
@font-face {
  font-family: 'Atkinson Hyperlegible';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(assets/fonts/9Bt23C1KxNDXMspQ1lPyU89-1h6ONRlW45G04pIo.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;
}
/* latin-ext */
@font-face {
  font-family: 'Atkinson Hyperlegible';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(assets/fonts/9Bt73C1KxNDXMspQ1lPyU89-1h6ONRlW45G8Wbc9eiWPVFw.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;
}
/* latin */
@font-face {
  font-family: 'Atkinson Hyperlegible';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(assets/fonts/9Bt73C1KxNDXMspQ1lPyU89-1h6ONRlW45G8Wbc9dCWP.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;
}
/* devanagari */
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(assets/fonts/pxiByp8kv8JHgFVrLEj6Z11lFc-K.woff2) format('woff2');
  unicode-range: U+0900-097F, U+1CD0-1CF9, U+200C-200D, U+20A8, U+20B9, U+20F0, U+25CC, U+A830-A839, U+A8E0-A8FF, U+11B00-11B09;
}
/* latin-ext */
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(assets/fonts/pxiByp8kv8JHgFVrLEj6Z1JlFc-K.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;
}
/* latin */
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(assets/fonts/pxiByp8kv8JHgFVrLEj6Z1xlFQ.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;
}
/* devanagari */
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(assets/fonts/pxiByp8kv8JHgFVrLCz7Z11lFc-K.woff2) format('woff2');
  unicode-range: U+0900-097F, U+1CD0-1CF9, U+200C-200D, U+20A8, U+20B9, U+20F0, U+25CC, U+A830-A839, U+A8E0-A8FF, U+11B00-11B09;
}
/* latin-ext */
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(assets/fonts/pxiByp8kv8JHgFVrLCz7Z1JlFc-K.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;
}
/* latin */
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(assets/fonts/pxiByp8kv8JHgFVrLCz7Z1xlFQ.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;
}
/* devanagari */
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url(assets/fonts/pxiByp8kv8JHgFVrLDD4Z11lFc-K.woff2) format('woff2');
  unicode-range: U+0900-097F, U+1CD0-1CF9, U+200C-200D, U+20A8, U+20B9, U+20F0, U+25CC, U+A830-A839, U+A8E0-A8FF, U+11B00-11B09;
}
/* latin-ext */
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url(assets/fonts/pxiByp8kv8JHgFVrLDD4Z1JlFc-K.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;
}
/* latin */
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url(assets/fonts/pxiByp8kv8JHgFVrLDD4Z1xlFQ.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{
    --navy:#1B3A5C;
    --navy-ink:#122A45;
    --amber-l:#FFC773;
    --amber-d:#E08A1A;
    --teal:#3E7C6E;
    --paper:#F3F5F4;
    --card:#FFFFFF;
    --ink:#2C3A42;
    --ink-soft:#5B6B72;
    --border:#E1E6E4;
    --font-display:'Poppins',sans-serif;
    --font-body:'Atkinson Hyperlegible',sans-serif;
    --font-mono:ui-monospace,'SFMono-Regular',Menlo,Consolas,monospace;
    --radius-lg:28px;
    --radius-md:18px;
    --wrap:1120px;
  }
  *{box-sizing:border-box;}
  html{scroll-behavior:smooth;}
  @media (prefers-reduced-motion:reduce){ html{scroll-behavior:auto;} *{animation-duration:0.001ms !important; transition-duration:0.001ms !important;} }

  body{
    margin:0; background:var(--paper); color:var(--ink);
    font-family:var(--font-body); font-size:18px; line-height:1.6;
    -webkit-font-smoothing:antialiased;
  }
  h1,h2,h3{ font-family:var(--font-display); color:var(--navy); margin:0; line-height:1.12; letter-spacing:-0.01em; }
  p{margin:0;}
  a{color:inherit;}
  .wrap{max-width:var(--wrap); margin:0 auto; padding:0 28px;}
  section{padding:120px 0;}
  .skip-link{
    position:absolute; left:-999px; top:0; background:var(--navy); color:#fff;
    padding:12px 20px; border-radius:0 0 10px 0; z-index:200; font-family:var(--font-body); font-weight:700;
  }
  .skip-link:focus{ left:0; }
  :focus-visible{ outline:3px solid var(--amber-d); outline-offset:3px; border-radius:4px; }

  /* ---------- NAV ---------- */
  header{
    position:sticky; top:0; z-index:100; background:rgba(243,245,244,0.88);
    backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px);
    border-bottom:1px solid var(--border);
  }
  .navbar{ display:flex; align-items:center; justify-content:space-between; padding:16px 28px; max-width:var(--wrap); margin:0 auto; gap:16px; flex-wrap:wrap; row-gap:12px;}
  .brand{ display:flex; align-items:center; gap:12px; text-decoration:none; }
  .brand svg{ width:40px; height:40px; flex-shrink:0; }
  .brand span{ font-family:var(--font-display); font-weight:800; font-size:22px; color:var(--navy); letter-spacing:0.02em; }
  nav.links{ display:flex; gap:32px; font-weight:700; font-size:15px; }
  nav.links a{ text-decoration:none; color:var(--ink-soft); padding:6px 2px; border-bottom:2px solid transparent; transition:color .15s, border-color .15s;}
  nav.links a:hover{ color:var(--navy); border-color:var(--amber-d); }
  .nav-right{ display:flex; align-items:center; gap:18px; }

  .lang-toggle{
    display:flex; align-items:center; gap:8px; background:var(--card); border:1.5px solid var(--border);
    border-radius:999px; padding:5px 6px 5px 14px; cursor:pointer; font-family:var(--font-mono);
    font-size:12.5px; font-weight:600; color:var(--ink-soft); letter-spacing:0.02em;
  }
  .lang-toggle .knob{
    width:38px; height:22px; border-radius:999px; background:var(--border); position:relative; transition:background .2s;
  }
  .lang-toggle .knob::after{
    content:""; position:absolute; top:2px; left:2px; width:18px; height:18px; border-radius:50%;
    background:var(--navy); transition:transform .2s ease;
  }
  body.simple .lang-toggle .knob{ background:var(--amber-l); }
  body.simple .lang-toggle .knob::after{ transform:translateX(16px); background:var(--amber-d); }

  .btn{
    display:inline-flex; align-items:center; gap:8px; font-family:var(--font-body); font-weight:700; font-size:15px;
    padding:12px 22px; border-radius:999px; text-decoration:none; border:1.5px solid transparent; cursor:pointer;
    transition:transform .15s ease, box-shadow .15s ease, background .15s ease;
  }
  .btn:hover{ transform:translateY(-1px); }
  .btn-amber{ background:var(--amber-d); color:#fff; box-shadow:0 6px 16px rgba(224,138,26,0.28); }
  .btn-amber:hover{ background:#C97A17; }
  .btn-ghost{ background:transparent; border-color:var(--navy); color:var(--navy); }
  .btn-ghost:hover{ background:var(--navy); color:#fff; }

  /* ---------- Toggle text mechanics ---------- */
  .lang-std, .lang-simple{ display:block; }
  body.simple .lang-std{ display:none; }
  body:not(.simple) .lang-simple{ display:none; }

  .swap{ display:grid; }
  .swap > span{ grid-row:1; grid-column:1; transition:opacity .22s ease; }
  .swap .lang-std{ opacity:1; }
  .swap .lang-simple{ opacity:0; }
  body.simple .swap .lang-std{ opacity:0; }
  body.simple .swap .lang-simple{ opacity:1; }
  .swap .lang-std, .swap .lang-simple{ display:block !important; } /* override default display swap inside grid */
  body:not(.simple) .swap .lang-simple{ display:block !important; pointer-events:none; }
  body.simple .swap .lang-std{ display:block !important; pointer-events:none; }

  .eyebrow{
    display:inline-flex; align-items:center; gap:8px; font-family:var(--font-mono); font-size:12.5px;
    font-weight:700; letter-spacing:0.08em; text-transform:uppercase; color:var(--teal);
    background:rgba(62,124,110,0.1); border:1px solid rgba(62,124,110,0.25); padding:7px 14px; border-radius:999px;
  }
  .eyebrow .dot{ width:7px; height:7px; border-radius:50%; background:var(--teal); }

  /* ---------- HERO ---------- */
  .hero{ padding:96px 0 80px; }
  .hero .wrap{ display:grid; grid-template-columns:1.1fr 0.9fr; gap:64px; align-items:center; }
  .hero h1{ font-size:52px; margin-top:22px; }
  .hero .sub{ font-size:19px; color:var(--ink-soft); margin-top:22px; max-width:52ch; }
  .hero .cta-row{ display:flex; gap:16px; margin-top:36px; flex-wrap:wrap; }
  .hero-visual{ display:flex; align-items:center; justify-content:center; position:relative; }
  .hero-visual .halo{
    position:absolute; width:340px; height:340px; border-radius:50%;
    background:radial-gradient(circle, rgba(255,199,115,0.35) 0%, rgba(255,199,115,0) 70%);
    animation:breathe 5s ease-in-out infinite;
  }
  @keyframes breathe{ 0%,100%{ transform:scale(1); opacity:0.8;} 50%{ transform:scale(1.12); opacity:1;} }
  .hero-visual svg{ width:220px; height:220px; position:relative; filter:drop-shadow(0 18px 34px rgba(27,58,92,0.25)); }

  /* ---------- PROBLEM ---------- */
  .section-head{ max-width:640px; margin-bottom:52px; }
  .section-head .eyebrow{ margin-bottom:18px; }
  .section-head h2{ font-size:36px; }
  .section-head .sub{ color:var(--ink-soft); margin-top:16px; font-size:17px; }

  .grid-3{ display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
  .card{ background:var(--card); border:1px solid var(--border); border-radius:var(--radius-md); padding:32px; }
  .card .icon-wrap{
    width:52px; height:52px; border-radius:14px; background:var(--navy); display:flex; align-items:center; justify-content:center; margin-bottom:20px;
  }
  .card .icon-wrap svg{ width:26px; height:26px; }
  .card h3{ font-size:20px; margin-bottom:10px; }
  .card p{ color:var(--ink-soft); font-size:15.5px; line-height:1.6; }

  /* ---------- MODULES ---------- */
  .modules-list{ display:flex; flex-direction:column; gap:1px; background:var(--border); border:1px solid var(--border); border-radius:var(--radius-md); overflow:hidden; }
  .module-row{ background:var(--card); display:grid; grid-template-columns:60px 1fr; gap:24px; padding:34px 36px; align-items:start; }
  .module-row .icon-wrap{ width:52px; height:52px; border-radius:14px; background:var(--paper); border:1.5px solid var(--border); display:flex; align-items:center; justify-content:center; }
  .module-row .icon-wrap svg{ width:24px; height:24px; }
  .module-row h3{ font-size:21px; margin-bottom:8px; display:flex; align-items:center; gap:10px; flex-wrap:wrap;}
  .module-row p{ color:var(--ink-soft); font-size:16px; max-width:66ch; }
  .badge-local{
    font-family:var(--font-mono); font-size:11px; font-weight:700; letter-spacing:0.05em; text-transform:uppercase;
    background:rgba(62,124,110,0.12); color:var(--teal); border:1px solid rgba(62,124,110,0.3);
    padding:4px 10px; border-radius:999px;
  }
  .badge-optin{
    font-family:var(--font-mono); font-size:11px; font-weight:700; letter-spacing:0.05em; text-transform:uppercase;
    background:rgba(224,138,26,0.12); color:var(--amber-d); border:1px solid rgba(224,138,26,0.3);
    padding:4px 10px; border-radius:999px;
  }

  /* ---------- PRIVACY ---------- */
  .privacy{ background:var(--navy); color:#fff; border-radius:36px; margin:0 28px; padding:88px 64px; }
  .privacy .wrap{ max-width:960px; padding:0; margin:0 auto; }
  .privacy-grid{ display:grid; grid-template-columns:1fr 1fr; gap:56px; align-items:center; }
  .privacy h2{ color:#fff; font-size:36px; }
  .privacy .sub{ color:rgba(255,255,255,0.78); margin-top:18px; font-size:17px; }
  .device-diagram{ border:1.5px dashed rgba(255,255,255,0.35); border-radius:24px; padding:28px; }
  .device-diagram .row{ display:flex; align-items:center; gap:14px; padding:12px 0; font-family:var(--font-mono); font-size:13.5px; color:rgba(255,255,255,0.85); }
  .device-diagram .row.blocked{ color:rgba(255,199,115,0.95); }
  .device-diagram hr{ border:none; border-top:1px solid rgba(255,255,255,0.18); margin:6px 0; }
  .check{ width:20px; height:20px; flex-shrink:0; }

  /* ---------- ZIELGRUPPEN ---------- */
  .aud-grid{ display:grid; grid-template-columns:1fr 1fr; gap:24px; }
  .aud-card{ background:var(--card); border:1px solid var(--border); border-radius:var(--radius-md); padding:36px; }
  .aud-card .eyebrow{ margin-bottom:16px; }
  .aud-card h3{ font-size:22px; margin-bottom:12px; }
  .aud-card p{ color:var(--ink-soft); font-size:16px; }

  /* ---------- PARTNER / CTA ---------- */
  .partner{ text-align:center; max-width:680px; margin:0 auto; }
  .partner h2{ font-size:38px; }
  .partner .sub{ color:var(--ink-soft); margin-top:18px; font-size:18px; }
  .partner .cta-row{ display:flex; justify-content:center; gap:16px; margin-top:32px; flex-wrap:wrap; }

  footer{ border-top:1px solid var(--border); padding:56px 0 40px; }
  footer .wrap{ display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:20px; }
  .foot-brand{ display:flex; align-items:center; gap:10px; }
  .foot-brand svg{ width:28px; height:28px; }
  .foot-brand span{ font-family:var(--font-display); font-weight:800; color:var(--navy); }
  footer .foot-links{ display:flex; gap:26px; font-size:14px; color:var(--ink-soft); }
  footer .foot-links a{ text-decoration:none; }
  footer .foot-links a:hover{ color:var(--navy); }
  footer .legal{ font-size:13px; color:var(--ink-soft); margin-top:28px; }

  [data-reveal]{ opacity:1; }
  html.js [data-reveal]{ opacity:0; transform:translateY(18px); transition:opacity .6s ease, transform .6s ease; }
  html.js [data-reveal].in{ opacity:1; transform:translateY(0); }

  @media (max-width:920px){
    .hero .wrap{ grid-template-columns:1fr; }
    .hero-visual{ order:-1; }
    .hero h1{ font-size:38px; }
    .grid-3{ grid-template-columns:1fr; }
    .privacy-grid{ grid-template-columns:1fr; }
    .aud-grid{ grid-template-columns:1fr; }
    nav.links{ display:none; }
    section{ padding:80px 0; }
    .privacy{ padding:56px 28px; margin:0 14px; border-radius:24px;}
  }
  @media (max-width:480px){
    .navbar{ justify-content:center; }
    .nav-right{ width:100%; justify-content:center; }
    .lang-toggle{ font-size:12px; padding:5px 5px 5px 12px; }
    .hero{ padding:56px 0 64px; }
    .hero h1{ font-size:32px; }
    section{ padding:64px 0; }
  }

/* ---------- LEGAL PAGES ---------- */
.legal-page{ padding:80px 0 100px; }
.legal-page .back-link{
  display:inline-flex; align-items:center; gap:6px; font-weight:700; font-size:14px;
  color:var(--navy); text-decoration:none; margin-bottom:28px;
}
.legal-page .back-link:hover{ text-decoration:underline; }
.legal-page h1{ font-size:34px; margin-bottom:8px; }
.legal-page .updated{ color:var(--ink-soft); font-size:14px; margin-bottom:48px; display:block; }
.legal-content{ max-width:72ch; }
.legal-content h2{ font-size:21px; margin-top:44px; margin-bottom:14px; }
.legal-content p{ margin-bottom:14px; color:var(--ink); font-size:16px; line-height:1.7; }
.legal-content ul{ margin:0 0 14px; padding-left:22px; color:var(--ink); font-size:16px; line-height:1.7; }
.legal-content li{ margin-bottom:6px; }
.ph{
  background:rgba(255,199,115,0.35); border:1px dashed var(--amber-d); border-radius:4px;
  padding:1px 6px; font-family:var(--font-mono); font-size:0.92em; color:#8a5a10; font-weight:600;
}
.todo-banner{
  background:rgba(224,138,26,0.1); border:1.5px solid rgba(224,138,26,0.35); border-radius:var(--radius-md);
  padding:20px 24px; margin-bottom:44px; font-size:15px; color:var(--ink);
}
.todo-banner strong{ color:var(--amber-d); }