:root {
  --ink: #27292A;
  --ink-soft: #565F5D;
  --muted: #78807D;
  --green: #60A396;
  --green-dark: #326F65;
  --pale-green: #E5EFEB;
  --page: #F8F9F7;
  --white: #FFFFFF;
  --line: #E3E8E3;
  --warm: #C8A17B;
  --radius: 18px;
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Helvetica Neue', Arial, sans-serif;
  font-synthesis: none;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  color: var(--ink);
  background: var(--white);
  scroll-behavior: smooth;
}
*,*::before,*::after { box-sizing: border-box; }
body { margin:0; min-width:320px; }
img { max-width:100%; display:block; }
button, input { font:inherit; }
a { color:inherit; text-decoration:none; }
a:focus-visible, button:focus-visible, summary:focus-visible { outline:3px solid var(--green); outline-offset:4px; }
::selection { background:#c8e2d8; color:var(--ink); }
.container { width:min(100% - 96px, 1240px); margin-inline:auto; }
.skip-link { position:absolute; z-index:50; top:-100px; left:14px; padding:12px 15px; background:var(--ink); color:#fff; }
.skip-link:focus { top:12px; }
.site-header { background:var(--page); border-bottom:1px solid #EBEFEB; }
.header-grid { min-height:86px; display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:24px; }
.brand { display:flex; align-items:center; gap:9px; width:max-content; }
.brand-icon { width:40px; height:40px; object-fit:contain; }
.brand-name { width:134px; height:auto; }
.nav-links { display:flex; align-items:center; gap:27px; font-size:14px; color:#5C6461; }
.nav-links a:hover, .footer-top > a:hover, .footer-bottom a:hover { color:var(--green-dark); }
.nav-cta { justify-self:end; border:1px solid #CDDAD3; padding:11px 17px; border-radius:999px; font-size:14px; font-weight:600; transition:background .2s, border-color .2s; }
.nav-cta:hover { background:#EBF3EF; border-color:#A6C9BC; }
.nav-cta span { padding-left:8px; font-size:16px; }
.hero { background:var(--page); border-bottom:1px solid var(--line); overflow:hidden; }
.hero-grid { display:grid; grid-template-columns:1.1fr .9fr; min-height:740px; gap:7%; align-items:center; }
.hero-content { padding:90px 0 104px; position:relative; z-index:1; }
.eyebrow, .beta-eyebrow { display:inline-flex; align-items:center; gap:10px; font-size:11px; text-transform:uppercase; letter-spacing:.17em; font-weight:700; color:#5F706A; }
.status-dot { width:8px; height:8px; background:var(--green); border-radius:50%; flex:0 0 auto; }
h1,h2,h3,p { margin-top:0; }
h1 { margin:29px 0 27px; font-size:clamp(68px,6.15vw,100px); line-height:1.07; font-weight:640; letter-spacing:-.022em; }
.headline-accent { color:var(--green-dark); }
.hero-lead { max-width:540px; font-size:clamp(18px,1.6vw,22px); line-height:1.55; font-weight:400; letter-spacing:-.02em; }
.hero-support { color:var(--muted); font-size:15px; margin:24px 0 0; }
.hero-actions { display:flex; flex-wrap:wrap; align-items:center; gap:24px; margin-top:39px; }
.button { cursor:pointer; border:0; display:inline-flex; align-items:center; justify-content:space-between; min-height:54px; border-radius:11px; padding:16px 20px; font-weight:600; font-size:14px; transition:transform .18s,background .18s; gap:32px; }
.button:hover { transform:translateY(-2px); }
.button-dark { background:var(--ink); color:#fff; }
.button-dark:hover { background:#3B4442; }
.button span { font-size:17px; font-weight:400; }
.text-link { font-size:14px; font-weight:550; border-bottom:1px solid #B9C7BE; padding:7px 0; }
.text-link:hover { color:var(--green-dark); }
.text-link span { padding-left:8px; }
.hero-meta { margin-top:50px; display:flex; align-items:center; gap:17px; font-size:12px; color:#7B8681; }
.meta-divider { width:1px; height:15px; background:#CCD6CF; }
.tiny-icon { font-style:normal; font-size:20px; line-height:0; display:inline-block; vertical-align:-2px; margin-right:4px; }
.hero-visual { align-self:stretch; display:flex; align-items:center; flex-direction:column; justify-content:center; position:relative; padding:38px 0 30px; }
.hero-visual::before { content:""; position:absolute; width:610px; height:610px; background:radial-gradient(circle,#E3EEEA 0%,#ECF3F0 42%,rgba(236,243,240,0) 68%); border-radius:50%; transform:translate(0,8px); pointer-events:none; }
.device { width:353px; max-width:100%; min-height:685px; position:relative; border:1px solid #DEE5E1; background:#fff; border-radius:36px; padding:18px 22px 70px; box-shadow:0 22px 65px rgba(22,48,40,.11),0 5px 18px rgba(22,48,40,.04); overflow:hidden; transform:rotate(1.5deg); }
.device-status { display:flex; justify-content:space-between; padding:1px 7px 17px; font-size:11px; font-weight:750; letter-spacing:.02em; }
.device-brand { font-size:10px; font-weight:800; letter-spacing:.3em; color:#353B3A; margin-bottom:7px; }
.device-title { font-size:31px; font-weight:750; letter-spacing:-.02em; }
.device-top > p { margin:5px 0 20px; font-size:11px; color:#9BA3A0; }
.time-ring { display:flex; justify-content:center; margin:2px auto 16px; }
.ring-outer { width:190px; height:190px; border-radius:50%; background:conic-gradient(var(--green) 0 180deg,#E5EEE9 180deg 360deg); display:grid; place-items:center; }
.ring-inner { width:159px; height:159px; background:#fff; border-radius:50%; display:grid; place-items:center; position:relative; }
.ring-inner::after { content:""; position:absolute; inset:10px; border:9px solid transparent; border-top-color:var(--warm); border-right-color:var(--warm); border-radius:50%; transform:rotate(-45deg); }
.ring-core { display:grid; place-items:center; text-align:center; position:relative; z-index:1; }
.ring-core strong { font-size:61px; font-weight:550; letter-spacing:-.02em; line-height:1; }
.ring-core span { font-size:10px; letter-spacing:.16em; margin-top:5px; font-weight:700; }
.ring-data { display:flex; justify-content:center; gap:20px; color:#747F7A; font-size:11px; }
.legend-dot { display:inline-block; border-radius:50%; width:6px; height:6px; vertical-align:1px; margin-right:5px; }
.legend-available { background:var(--green); } .legend-used { background:var(--warm); }
.ring-footnote { margin:8px 0 21px; text-align:center; font-size:10px; color:#9BA3A0; }
.device-section-label { color:#697570; font-size:10px; font-weight:700; letter-spacing:.19em; margin-bottom:10px; }
.device-card { border:1px solid #E6EAE7; padding:13px 12px; border-radius:15px; background:#fff; display:grid; grid-template-columns:43px minmax(0,1fr) auto; align-items:center; gap:10px; margin-bottom:9px; }
.app-glyph { width:40px;height:40px;display:grid;place-items:center;border-radius:11px;background:#F4F5F3;color:#384B45;font-size:19px;font-weight:700; }
.app-glyph.math { background:#EBF3F0; color:var(--green-dark); font-size:26px; font-weight:400; }
.device-card strong { display:block; font-size:12px; font-weight:650; letter-spacing:-.015em; }
.device-card span:not(.card-progress span) { font-size:10px; color:#929C97; display:block; margin-top:5px; }
.reward-tag { font-size:10px; white-space:nowrap; color:var(--green-dark); font-weight:750; }
.device-card.active { background:#F3F8F5; border-color:#D5E8DE; padding-bottom:23px; }
.device-card .focus-tag { color:var(--green-dark); }
.card-progress { grid-column:2/-1; border-radius:5px; background:#D9E6E0; height:5px; overflow:hidden; margin-top:-2px; }
.card-progress span { display:block; height:100%; width:30%; border-radius:inherit; background:var(--green); }
.device-bottom { display:flex; justify-content:space-around; gap:8px; position:absolute; bottom:0; left:0; right:0; padding:10px 13px 13px; background:white; border-top:1px solid #E8EDE9; color:#9CA4A0; font-size:21px; text-align:center; }
.device-bottom > span { display:flex; align-items:center; flex-direction:column; justify-content:center; line-height:1.05; }
.device-bottom small { font-size:9px; margin-top:3px; }
.device-bottom .current { color:var(--green-dark); }
.preview-note { position:relative; text-align:center; font-size:11px; letter-spacing:.025em; color:#88968D; margin-top:25px; }
.section { padding:116px 0 125px; }
.section-heading { display:grid; grid-template-columns:1fr minmax(250px,360px); justify-content:space-between; gap:55px; align-items:end; margin-bottom:66px; }
.kicker { color:var(--green-dark); font-size:11px; letter-spacing:.19em; font-weight:750; margin-bottom:23px; }
h2 { font-weight:640; font-size:clamp(42px,3.8vw,58px); letter-spacing:-.012em; line-height:1.17; margin-bottom:0; }
.section-heading > p { font-size:17px; line-height:1.65; color:var(--ink-soft); margin-bottom:4px; }
.steps { display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid #D9E0DA; gap:36px; }
.step { padding-top:29px; }
.step-index { font-size:12px; font-weight:700; color:var(--green-dark); letter-spacing:.08em; }
.step-rule { margin:28px 0 25px; background:var(--line); height:1px; width:100%; position:relative; }
.step-rule::before { content:""; position:absolute; top:-2px; left:0; width:52px; height:4px; background:var(--green); }
.step h3 { font-size:21px; letter-spacing:-.012em; margin-bottom:13px; font-weight:650; }
.step p { max-width:310px; font-size:15px; line-height:1.7; color:#6D7772; }
/* BALANCE Quick Start – praktische Bedienungsanleitung */
.guide-section { background:#F7F9F7; border-top:1px solid var(--line); }
.guide-heading { margin-bottom:48px; }
.guide-heading-row { display:grid; grid-template-columns:1fr minmax(280px,360px); align-items:end; gap:60px; }
.guide-heading-row > p { margin:0 0 4px; max-width:360px; color:var(--ink-soft); line-height:1.72; font-size:16px; }
.guide-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:23px; align-items:stretch; }
.guide-card { border:1px solid #E1E8E2; background:#fff; border-radius:22px; padding:34px 37px 30px; display:flex; flex-direction:column; min-width:0; }
.guide-card-kids { background:#EAF2ED; border-color:#D9E6DF; }
.guide-card-head { display:flex; align-items:center; justify-content:space-between; gap:14px; margin-bottom:15px; }
.guide-category { color:var(--green-dark); font-weight:750; letter-spacing:.15em; font-size:11px; }
.guide-period { color:#718079; border:1px solid #D9E5DC; padding:6px 11px; border-radius:30px; font-size:11px; }
.guide-card h3 { font-size:clamp(23px,2.5vw,31px); letter-spacing:-.015em; font-weight:650; line-height:1.24; margin:0 0 16px; }
.guide-list { list-style:none; counter-reset:none; padding:0; margin:0; }
.guide-list li { display:grid; grid-template-columns:35px minmax(0,1fr); gap:14px; padding:20px 0 22px; border-bottom:1px solid #E7ECE8; }
.guide-card-kids .guide-list li { border-color:#D5E1D9; }
.guide-count { color:var(--green-dark); letter-spacing:.06em; font-size:12px; font-weight:720; padding-top:3px; }
.guide-list h4 { margin:0 0 7px; font-size:17px; font-weight:680; line-height:1.3; }
.guide-list p { margin:0; font-size:14px; line-height:1.68; color:#65716A; }
.guide-list strong { font-weight:660; color:#36453D; }
.guide-card-footnote { color:#65756B; margin:22px 0 0; font-size:13px; line-height:1.65; }
.guide-reminder { margin-top:25px; padding:25px 31px; border:1px solid #DCE8E1; border-radius:18px; background:#FFF; display:grid; grid-template-columns:155px minmax(0,1fr); gap:20px; align-items:center; }
.guide-reminder-label { display:flex; gap:10px; align-items:center; font-size:11px; font-weight:750; color:var(--green-dark); letter-spacing:.16em; }
.guide-reminder-dot { width:9px; height:9px; background:var(--green-dark); border-radius:100%; }
.guide-reminder p { margin:0; line-height:1.55; font-size:16px; }
.guide-reminder p strong { display:block; font-weight:680; letter-spacing:0; }
.guide-reminder p span { font-size:14px; color:#6A756D; display:block; margin-top:3px; }
@media (max-width:900px) {
  .guide-heading-row { grid-template-columns:1fr; gap:20px; }
  .guide-grid { grid-template-columns:1fr; gap:16px; }
  .guide-heading { margin-bottom:30px; }
}
@media (max-width:530px) {
  .guide-card { padding:27px 22px 25px; border-radius:18px; }
  .guide-card h3 { font-size:24px; }
  .guide-reminder { padding:22px 23px; grid-template-columns:1fr; gap:13px; }
  .guide-list li { gap:10px; }
}

.parent-section { background:#EFF3F0; }
.parent-layout { display:grid; grid-template-columns:1fr 1fr; gap:12%; }
.parent-main h2 > span { color:var(--green-dark); }
.parent-main > p:not(.kicker) { max-width:525px; margin-top:31px; font-size:17px; line-height:1.78; color:#56625D; }
.parent-caption { margin-top:52px; display:flex; align-items:center; gap:12px; font-size:12px; font-weight:600; color:#62766B; }
.caption-line { width:34px; height:1px; background:var(--green); }
.parent-features { padding-top:25px; }
.parent-features article { display:grid; grid-template-columns:55px 1fr; gap:17px; padding:23px 0 26px; border-bottom:1px solid #D5E0D8; }
.parent-features article:first-child { border-top:1px solid #D5E0D8; }
.feature-mark { font-size:27px; color:var(--green-dark); font-weight:300; }
.parent-features h3 { font-size:20px; letter-spacing:-.01em; margin-bottom:7px; }
.parent-features p { font-size:15px; line-height:1.62; color:#68766D; margin-bottom:0; }
.beta-section { padding:105px 0 110px; background:var(--ink); color:white; }
.beta-shell { display:grid; grid-template-columns:1.02fr .88fr; gap:12%; align-items:center; }
.beta-eyebrow { color:#ADD1C6; }
.beta-copy h2 { font-size:clamp(40px,3.6vw,56px); margin:26px 0 22px; }
.beta-copy > p { color:#C3CBC7; font-size:17px; line-height:1.67; max-width:550px; }
.beta-questions { margin-top:35px; border-top:1px solid #49514F; }
.beta-questions > p { padding:17px 0; border-bottom:1px solid #49514F; display:flex; gap:23px; align-items:baseline; font-size:15px; color:#EBF0ED; margin:0; }
.beta-questions > p > span { color:#84B8A8; font-size:11px; letter-spacing:.05em; }
.beta-card { padding:37px 35px; background:#F8FAF8; border-radius:19px; color:var(--ink); box-shadow:0 20px 70px rgba(0,0,0,.07); }
.beta-card-kicker { font-size:11px; letter-spacing:.15em; font-weight:700; color:var(--green-dark); margin-bottom:20px; }
.beta-card h3 { font-size:34px; line-height:1.15; letter-spacing:-.02em; max-width:335px; margin-bottom:16px; }
.beta-card > p:not(.beta-card-kicker) { font-size:15px; line-height:1.65; color:#66736D; }
.interest-button { width:100%; text-align:left; margin-top:19px; }
.beta-card > .contact-hint { font-size:12px !important; line-height:1.55 !important; margin-top:14px; margin-bottom:0; }
.contact-status { color:var(--green-dark) !important; font-weight:650; font-size:12px !important; margin:10px 0 0; min-height:0; }
.beta-fineprint { margin-top:29px; padding-top:20px; border-top:1px solid #DFE6E0; font-size:11px; line-height:1.65; color:#8B9890; }
.faq-section { background:#fff; }
.faq-layout { display:grid; grid-template-columns:.68fr 1fr; gap:15%; }
.faq-intro { margin-top:15px; color:#707C74; }
.faq-list { border-top:1px solid #DDE5DE; }
.faq-list details { border-bottom:1px solid #DDE5DE; }
.faq-list summary { list-style:none; font-size:18px; letter-spacing:-.02em; font-weight:550; line-height:1.48; padding:23px 36px 23px 0; position:relative; cursor:pointer; }
.faq-list summary::-webkit-details-marker { display:none; }
.faq-list summary::after { content:'+'; color:var(--green-dark); position:absolute; right:0; top:21px; font-weight:350; font-size:24px; }
.faq-list details[open] summary::after { content:'−'; }
.faq-list details p { margin:0; padding:0 30px 24px 0; font-size:15px; color:#69766E; line-height:1.72; }
.site-footer { padding:44px 0 23px; background:var(--page); border-top:1px solid var(--line); }
.footer-top { display:flex; align-items:center; gap:28px; padding-bottom:38px; }
.footer-brand { display:flex; align-items:center; gap:8px; margin-right:auto; }
.footer-brand img:first-child { height:38px; width:38px; }
.footer-brand img:last-child { width:132px; height:auto; }
.footer-top > p { margin:0; color:#758078; font-size:14px; }
.footer-top > a { font-size:13px; font-weight:600; }
.footer-bottom { display:flex; justify-content:space-between; align-items:center; border-top:1px solid #E2E8E1; padding-top:22px; color:#85918A; font-size:12px; }
.footer-bottom > p { margin:0; }
.footer-bottom > div { display:flex; gap:26px; }
/* Basic legal pages */
.legal { min-height:65vh; padding:85px 0 120px; }
.legal-content { max-width:780px; }
.legal h1 { font-size:54px; margin:18px 0 35px; }
.legal h2 { font-size:25px; margin:37px 0 15px; }
.legal p, .legal li { line-height:1.7; color:#58635C; font-size:16px; }
.legal-alert { border-left:4px solid var(--green); padding:20px 26px; background:#ECF2ED; margin:30px 0; line-height:1.5; }
@media (max-width:1060px) {
  .container { width:min(100% - 68px,1180px); }
  .hero-grid { gap:3%; grid-template-columns:1fr 0.85fr; }
  h1 { font-size:clamp(62px,6vw,80px); }
  .device { transform:scale(.90) rotate(1.5deg); }
  .nav-links { gap:22px; }
  .beta-shell { gap:7%; }
}
@media (max-width:790px) {
  .container { width:min(100% - 42px,620px); }
  .header-grid { min-height:72px; grid-template-columns:1fr auto; }
  .nav-links { display:none; }
  .brand-icon { width:34px; height:34px; }
  .brand-name { width:118px; }
  .nav-cta { padding:9px 13px; }
  .hero-grid { grid-template-columns:1fr; gap:0; }
  .hero-content { padding:74px 0 40px; }
  h1 { font-size:clamp(55px,10vw,82px); margin:25px 0 22px; }
  .hero-visual { padding:45px 0 65px; }
  .hero-meta { margin-top:32px; }
  .device { transform:none; }
  .hero-visual::before { width:500px; height:500px; }
  .section { padding:84px 0 88px; }
  .section-heading { grid-template-columns:1fr; gap:22px; margin-bottom:36px; }
  .section-heading > p { max-width:450px; }
  .steps { grid-template-columns:1fr; gap:0; }
  .step { padding:25px 0 19px; border-bottom:1px solid var(--line); }
  .step-rule { margin:17px 0 18px; }
  .step p { max-width:520px; }
  .parent-layout { grid-template-columns:1fr; gap:29px; }
  .parent-main > p:not(.kicker) { margin-top:26px; }
  .parent-caption { margin-top:30px; }
  .beta-section { padding:85px 0; }
  .beta-shell { grid-template-columns:1fr; gap:40px; }
  .faq-layout { grid-template-columns:1fr; gap:35px; }
  .faq-section { padding-bottom:95px; }
  .footer-top { gap:20px; flex-wrap:wrap; }
  .footer-top > p { display:none; }
}
@media (max-width:430px) {
  .container { width:calc(100% - 36px); }
  .header-grid { min-height:68px; }
  .brand-name { width:105px; }
  .nav-cta { font-size:12px; }
  h1 { font-size:clamp(51px,13vw,64px); }
  h2 { font-size:clamp(38px,10vw,46px); }
  .hero-lead { font-size:17px; }
  .hero-actions { flex-direction:column; align-items:flex-start; gap:15px; }
  .hero-actions .button { width:100%; }
  .device { width:334px; transform:scale(.96); transform-origin:top center; }
  .hero-visual { padding-bottom:31px; }
  .preview-note { margin-top:-3px; }
  .beta-card { padding:27px 23px; }
  .beta-card h3 { font-size:31px; }
  .beta-questions > p { font-size:14px; }
  .footer-bottom { align-items:flex-start; flex-direction:column; gap:16px; }
}
@media (prefers-reduced-motion:reduce) {
  :root { scroll-behavior:auto; }
  .button, .nav-cta { transition:none; }
  .button:hover { transform:none; }
}

/* Betatest: direkte Kontaktwege */
.interest-actions { display:flex; flex-direction:column; gap:11px; margin-top:19px; }
.interest-actions .interest-button { display:flex; justify-content:space-between; align-items:center; margin-top:0; text-decoration:none; cursor:pointer; }
.interest-actions [hidden] { display:none !important; }
.interest-actions .button-outline { background:transparent; color:var(--ink); border:1px solid rgba(38,45,43,.30); }
.interest-actions .button-outline:hover { background:rgba(53,126,115,.07); }
