/* Startseite: gleiche Marke wie die App (Figtree, Indigo), keine Drittanbieter */
:root{--bg:#F7F5EF;--surface:#fff;--fg:#1C1F3A;--muted:#5D6178;--line:#E4E1D8;--accent:#4F46E5;--accent-fg:#fff;--accent-soft:#F1F0FB;--heading:#1A237E;--grad:linear-gradient(135deg,#00B4D8 0%,#4F46E5 55%,#F72585 100%);--font:"Figtree",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;--r:14px}
@media(prefers-color-scheme:dark){:root{--bg:#14152B;--surface:#1D1F3F;--fg:#ECEBFA;--muted:#A5A8C4;--line:#2E3160;--accent:#8B86FF;--accent-fg:#14152B;--accent-soft:#2A2C5E;--heading:#C9CCFF}}
*{box-sizing:border-box}html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--fg);font:17px/1.55 var(--font)}
a{color:var(--accent)}
.top{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px max(20px,calc((100vw - 1120px)/2));position:sticky;top:0;background:color-mix(in srgb,var(--bg) 92%,transparent);backdrop-filter:blur(8px);border-bottom:1px solid var(--line);z-index:5}
.logo{display:flex;align-items:center;gap:9px;text-decoration:none}.wm{font-size:24px;font-weight:800;letter-spacing:-.02em}.wm-a{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}.wm-b{color:var(--fg)}
.top nav{display:flex;align-items:center;gap:20px}.top nav a:not(.btn){text-decoration:none;color:var(--fg);font-weight:600}
.btn{display:inline-block;padding:10px 18px;border-radius:999px;background:var(--accent);color:var(--accent-fg);font-weight:700;text-decoration:none;border:2px solid var(--accent)}
.btn.small{padding:7px 14px}.btn.big{padding:14px 26px;font-size:18px}.btn.ghost{background:none;color:var(--accent)}
.btn:hover{filter:brightness(1.08)}
.tp-bar{background:var(--accent-soft);color:var(--heading);text-align:center;padding:9px 16px;font-weight:600}
main>section{padding:56px max(20px,calc((100vw - 1120px)/2))}
h1,h2,h3{font-family:var(--font);letter-spacing:-.02em;line-height:1.12;margin:0}
h2{font-size:clamp(26px,4vw,38px);font-weight:800;margin-bottom:12px;color:var(--heading)}
h3{font-size:20px;margin-bottom:6px}
.hero{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:40px;align-items:center;padding-top:48px}
.chip{display:inline-block;margin:0 0 14px;padding:4px 12px;border-radius:999px;background:var(--accent-soft);font-weight:700;font-size:14px;letter-spacing:.04em}
.hero h1{font-size:clamp(36px,6vw,62px);font-weight:800;margin-bottom:16px}.hero h1 em{font-style:normal;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.sub{font-size:20px;color:var(--muted);max-width:34em;margin:0 0 24px}
.cta{display:flex;flex-wrap:wrap;gap:12px;margin-bottom:20px}
.trust{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px 20px;color:var(--muted);font-weight:600;font-size:15px}.trust li::before{content:"✓ ";color:#1a9a55;font-weight:800}
.hero-img{position:relative;height:clamp(320px,42vw,520px)}
.hero-img img{position:absolute;width:56%;border-radius:8px;box-shadow:0 14px 40px rgba(20,21,43,.28);background:#fff;height:auto}
.hero-img .h1{left:0;top:6%;transform:rotate(-5deg)}.hero-img .h2{left:22%;top:0;transform:rotate(2deg);z-index:2}.hero-img .h3{right:0;top:12%;transform:rotate(7deg)}
.steps ol{list-style:none;margin:20px 0 0;padding:0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:14px}
.steps li{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:16px;display:flex;flex-direction:column;gap:6px}
.steps b{width:32px;height:32px;border-radius:50%;background:var(--accent);color:var(--accent-fg);display:grid;place-items:center}.steps span{color:var(--muted);font-size:15px}
.feat .grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:20px}
.feat article{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:20px}.feat p{margin:0;color:var(--muted)}
.lead{color:var(--muted);max-width:44em;margin:0 0 24px}
.lays{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:18px}
.lay{margin:0}.lay img{width:100%;height:auto;border-radius:6px;border:1px solid var(--line);box-shadow:0 6px 18px rgba(20,21,43,.14);background:#fff;display:block}
.lay figcaption{display:flex;flex-direction:column;margin-top:8px;font-size:14px}.lay figcaption span{color:var(--muted)}
.center{text-align:center;margin-top:32px}
.prices{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px}
.pcard{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:20px;display:flex;flex-direction:column;gap:8px}
.pcard.best{border:2px solid var(--accent)}.pcard h3{font-size:18px}.pcard .p{font-size:34px;font-weight:800;letter-spacing:-.02em}.pcard p{margin:0;color:var(--muted);font-size:15px}.pcard .d{font-weight:700;color:var(--heading)}
.hint{color:var(--muted);font-size:14px;margin-top:14px}
.faq details{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:14px 18px;margin-bottom:10px}.faq summary{cursor:pointer;font-weight:700}.faq details p{margin:10px 0 0;color:var(--muted)}
.final{text-align:center;background:var(--accent-soft)}.final p{color:var(--muted);margin:0 0 20px}
.foot{display:flex;flex-wrap:wrap;gap:12px 24px;justify-content:space-between;padding:24px max(20px,calc((100vw - 1120px)/2));color:var(--muted);font-size:14px;border-top:1px solid var(--line)}.foot nav{display:flex;flex-wrap:wrap;gap:6px 18px}
@media(max-width:900px){.hero{grid-template-columns:1fr}.hero-img{height:300px;order:-1}.steps ol{grid-template-columns:repeat(2,minmax(0,1fr))}.feat .grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:560px){.top nav a:not(.btn){display:none}.steps ol,.feat .grid{grid-template-columns:1fr}.lays{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}main>section{padding-top:40px;padding-bottom:40px}.hero-img{height:240px}}
.pcard .btn{margin-top:auto;text-align:center}

.portal .pt{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:36px;align-items:center;margin:34px 0}
.portal .pt.rev{grid-template-columns:minmax(0,1fr) minmax(0,1.5fr)}.portal .pt.rev figure{order:2}
.portal .pt figure{margin:0}.portal .pt img{width:100%;height:auto;display:block;border-radius:12px;border:1px solid var(--line);box-shadow:0 14px 40px rgba(20,21,43,.2);background:#fff}
.pt-txt h3{font-size:26px;margin:6px 0 10px}.pt-txt p{color:var(--muted);margin:0}
@media(max-width:900px){.portal .pt,.portal .pt.rev{grid-template-columns:1fr;gap:16px}.portal .pt.rev figure{order:0}}

/* Auf dem Handy: feste Start-Leiste unten, immer erreichbar */
.mobile-cta { display: none; }
@media (max-width: 700px) { .mobile-cta { display: block; position: fixed; left: 0; right: 0; bottom: 0; z-index: 30; padding: 10px 16px calc(10px + env(safe-area-inset-bottom)); background: color-mix(in srgb, var(--bg) 94%, transparent); backdrop-filter: blur(6px); border-top: 1px solid var(--line); } .mobile-cta .btn { display: block; text-align: center; } body { padding-bottom: 76px; } }
.cookie-banner { position: fixed; left: 16px; right: 16px; bottom: 16px; z-index: 50; max-width: 720px; margin: 0 auto; background: #fff; color: #1a1a2e; border: 1px solid #d9d9e6; border-radius: 14px; box-shadow: 0 8px 30px rgba(0,0,0,.2); padding: 16px 18px; }
.cookie-banner p { margin: 0 0 12px; font-size: 14px; line-height: 1.45; }
.cookie-act { display: flex; gap: 10px; justify-content: flex-end; }
.cookie-act button { min-width: 120px; padding: 10px 16px; border-radius: 10px; border: 2px solid #4f46e5; background: #fff; color: #4f46e5; font-weight: 700; font-size: 15px; cursor: pointer; }
.cookie-act button#ckYes { background: #4f46e5; color: #fff; }