/* plantpal.at – „Nachtgarten“: fast schwarzer Grund, Limette, Wasser-Cyan, Frost; Unbounded für Überschriften und Zahlen */
@font-face{font-family:"Unbounded";src:url("Unbounded.ttf") format("truetype");font-weight:200 900;font-display:swap}
:root{color-scheme:dark;--bg:#0A0F0C;--card:rgba(255,255,255,.035);--tint:rgba(255,255,255,.04);--line:rgba(255,255,255,.085);
  --ink:#EAF2EC;--soft:#C2CEC5;--mute:#97A79C;--accent:#C8F04A;--accent-line:rgba(200,240,74,.3);--cyan-t:#5CC8FF;--frost-t:#FF8A5B;
  --lime:#C8F04A;--cyan:#5CC8FF;--frost:#FF8A5B;--moss:#1F8F57;--r:28px;
  --top:rgba(10,15,12,.62);--glass:rgba(18,26,21,.66);--glass-line:rgba(255,255,255,.1);--ring-in:#101813;--ring-track:rgba(255,255,255,.08);
  --shadow:rgba(0,0,0,.85);--glow:.35;--glow-op:.9;--card-hi:rgba(255,255,255,.05);--card-lo:rgba(255,255,255,.015);
  --tick:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M6 10.5l2.6 2.6L14 7.5' fill='none' stroke='%23C8F04A' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  --disp:"Unbounded",ui-rounded,system-ui,sans-serif;--body:-apple-system,BlinkMacSystemFont,"SF Pro Text","Segoe UI",Roboto,system-ui,sans-serif}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:84px}
body{margin:0;background:var(--bg);color:var(--ink);font:17px/1.6 var(--body);-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{max-width:100%;height:auto;display:block}
a{color:var(--accent);text-decoration:none}
a:hover{text-decoration:underline}
h1,h2,h3{font-family:var(--disp);font-weight:600;letter-spacing:-.02em;line-height:1.08;margin:0 0 .5em}
h1{font-size:clamp(2.3rem,4.6vw,4rem);font-weight:700}
h2{font-size:clamp(1.9rem,4vw,3rem)}
h3{font-size:1.3rem;line-height:1.25}
p{margin:0 0 1em}
.wrap{max-width:1180px;margin:0 auto;padding:0 max(20px,env(safe-area-inset-left))}
.grain{position:fixed;inset:0;pointer-events:none;z-index:100;opacity:.06;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}

/* Hell: dieselben Elemente auf Salbei-Grund (wie „Glashaus“); folgt dem System, der Knopf oben überschreibt es */
@media (prefers-color-scheme:light){:root:not([data-theme=dark]){color-scheme:light;--bg:#F1F4EC;--card:rgba(255,255,255,.6);--tint:rgba(255,255,255,.75);--line:rgba(23,32,26,.1);
  --ink:#17201A;--soft:#3C4A40;--mute:#66736A;--accent:#3E7A10;--accent-line:rgba(62,122,16,.28);--cyan-t:#1B78B0;--frost-t:#C2531E;--moss:#2F6B47;
  --top:rgba(241,244,236,.72);--glass:rgba(255,255,255,.72);--glass-line:rgba(23,32,26,.08);--ring-in:#F7F9F3;--ring-track:rgba(23,32,26,.08);
  --shadow:rgba(30,45,35,.35);--glow:0;--glow-op:.55;--card-hi:rgba(255,255,255,.85);--card-lo:rgba(255,255,255,.5);
  --tick:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M6 10.5l2.6 2.6L14 7.5' fill='none' stroke='%233E7A10' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")}}
:root[data-theme=light]{color-scheme:light;--bg:#F1F4EC;--card:rgba(255,255,255,.6);--tint:rgba(255,255,255,.75);--line:rgba(23,32,26,.1);
  --ink:#17201A;--soft:#3C4A40;--mute:#66736A;--accent:#3E7A10;--accent-line:rgba(62,122,16,.28);--cyan-t:#1B78B0;--frost-t:#C2531E;--moss:#2F6B47;
  --top:rgba(241,244,236,.72);--glass:rgba(255,255,255,.72);--glass-line:rgba(23,32,26,.08);--ring-in:#F7F9F3;--ring-track:rgba(23,32,26,.08);
  --shadow:rgba(30,45,35,.35);--glow:0;--glow-op:.55;--card-hi:rgba(255,255,255,.85);--card-lo:rgba(255,255,255,.5);
  --tick:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M6 10.5l2.6 2.6L14 7.5' fill='none' stroke='%233E7A10' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")}
.th-l{display:none}
@media (prefers-color-scheme:light){:root:not([data-theme=dark]) .th-d{display:none}:root:not([data-theme=dark]) .th-l{display:block}}
:root[data-theme=light] .th-d{display:none}:root[data-theme=light] .th-l{display:block}
:root[data-theme=dark] .th-l{display:none}:root[data-theme=dark] .th-d{display:block}
.theme{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;border:1px solid var(--line);background:none;color:var(--mute);cursor:pointer;padding:0}
.theme:hover{color:var(--ink)}
.theme svg{width:18px;height:18px}
.theme .sun{display:none}
@media (prefers-color-scheme:light){:root:not([data-theme=dark]) .theme .sun{display:block}:root:not([data-theme=dark]) .theme .moon{display:none}}
:root[data-theme=light] .theme .sun{display:block}:root[data-theme=light] .theme .moon{display:none}

/* Kopfzeile */
.top{position:sticky;top:0;z-index:50;background:var(--top);backdrop-filter:blur(18px) saturate(1.4);-webkit-backdrop-filter:blur(18px) saturate(1.4);border-bottom:1px solid var(--line)}
.top-in{display:flex;align-items:center;gap:28px;height:66px}
.brand{display:flex;align-items:center;gap:10px;color:var(--ink);font:600 1.05rem var(--disp)}
.brand:hover{text-decoration:none}
.brand img{border-radius:9px}
.nav{display:flex;gap:26px;margin-left:auto}
.nav a{color:var(--mute);font-size:.95rem}
.nav a:hover{color:var(--ink);text-decoration:none}
.top-r{display:flex;align-items:center;gap:14px}
.lang{color:var(--mute);font-size:.85rem;font-weight:600;letter-spacing:.06em;border:1px solid var(--line);border-radius:99px;padding:4px 10px}
.lang:hover{color:var(--ink);text-decoration:none}
.langs{position:relative}.langs summary{list-style:none;cursor:pointer;user-select:none}.langs summary::-webkit-details-marker{display:none}
.langs[open] summary{color:var(--ink)}
.langs-menu{position:absolute;right:0;top:calc(100% + 8px);z-index:60;min-width:160px;padding:6px;background:var(--bg);border:1px solid var(--line);border-radius:14px;box-shadow:0 14px 34px var(--shadow)}
.langs-menu a{display:block;padding:7px 12px;border-radius:9px;color:var(--ink);font-size:.92rem;white-space:nowrap}
.langs-menu a:hover{background:var(--tint);text-decoration:none}.langs-menu a[aria-current]{color:var(--accent);font-weight:600}

/* Knöpfe */
.btn{display:inline-flex;align-items:center;gap:10px;border-radius:99px;font-weight:600;transition:transform .2s,box-shadow .2s}
.btn:hover{text-decoration:none;transform:translateY(-1px)}
.btn-s{background:var(--lime);color:#0A0F0C;padding:8px 16px;font-size:.9rem}
.btn-store{background:var(--lime);color:#0A0F0C;padding:12px 26px 12px 20px;box-shadow:0 0 0 1px rgba(200,240,74,.4),0 10px 40px -8px rgba(200,240,74,.55)}
.btn-store:hover{box-shadow:0 0 0 1px rgba(200,240,74,.6),0 14px 50px -6px rgba(200,240,74,.7)}
.btn-store svg{width:22px;height:26px}
.btn-store span{display:flex;flex-direction:column;line-height:1.1;font:600 1.15rem var(--disp)}
.btn-store small{font:500 .7rem var(--body);opacity:.75}

/* Hero */
.hero{position:relative;padding:72px 0 40px;overflow:hidden}
.hero-glow{position:absolute;inset:-10% -10% 0;background:
  radial-gradient(40% 50% at 78% 38%,rgba(92,200,255,.18),transparent 70%),
  radial-gradient(35% 45% at 62% 70%,rgba(200,240,74,.16),transparent 70%),
  url("glow.jpg") 75% 40%/60% auto no-repeat;filter:blur(70px) saturate(1.3);opacity:var(--glow-op)}
.hero-glow::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 60%,var(--bg))}
.hero-in{position:relative;display:grid;grid-template-columns:1.15fr .85fr;gap:40px;align-items:center;min-height:min(720px,calc(100vh - 110px))}
.kicker{display:inline-flex;align-items:center;gap:10px;color:var(--accent);font-weight:600;font-size:.88rem;letter-spacing:.08em;text-transform:uppercase;border:1px solid var(--accent-line);background:rgba(200,240,74,.1);padding:6px 14px;border-radius:99px;margin-bottom:26px}
.dot{width:8px;height:8px;border-radius:50%;background:var(--lime);box-shadow:0 0 12px var(--lime);animation:pulse 2.4s infinite}
@keyframes pulse{50%{opacity:.35}}
.hero h1 em{font-style:normal;color:var(--accent);text-shadow:0 0 40px rgba(200,240,74,var(--glow))}
.lead{font-size:1.18rem;color:var(--soft);max-width:33em;margin-bottom:32px}
.cta{display:flex;flex-wrap:wrap;align-items:center;gap:18px 24px}
.android{display:inline-flex;align-items:center;gap:8px;color:var(--mute);font-size:.92rem}
.android svg{width:20px;height:20px;color:var(--accent)}
.chips{display:flex;gap:8px;list-style:none;padding:0;margin:34px 0 0;flex-wrap:wrap}
.chips li{font-size:.82rem;color:var(--mute);border:1px solid var(--line);border-radius:99px;padding:4px 12px}

/* Telefone */
.phone{position:relative;border-radius:52px;padding:9px;background:linear-gradient(145deg,#2A322D,#121714 40%,#1C231F);
  box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.08),0 40px 80px -30px var(--shadow),0 0 0 1px rgba(0,0,0,.6)}
.phone img{border-radius:44px;width:100%}
.hero-art{position:relative;height:640px}
.hero-art .phone{position:absolute;width:290px}
.ph-front{right:16%;top:10px;z-index:2;transform:rotate(-4deg);animation:bob 7s ease-in-out infinite}
.ph-back{right:-2%;top:70px;transform:rotate(7deg) scale(.88);opacity:.55;filter:saturate(.8)}
@keyframes bob{50%{transform:rotate(-4deg) translateY(-12px)}}
.float{position:absolute;z-index:3;display:flex;align-items:center;gap:12px;padding:12px 18px 12px 12px;border-radius:22px;
  background:var(--glass);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border:1px solid var(--glass-line);
  box-shadow:0 20px 50px -20px var(--shadow);font:600 .95rem var(--disp);white-space:nowrap}
.float small{display:block;font:500 .72rem var(--body);color:var(--mute);letter-spacing:.04em;text-transform:uppercase}
.f-moist{left:2%;top:120px;animation:bob2 6s ease-in-out infinite}
.f-water{left:8%;bottom:110px;animation:bob2 7s ease-in-out .8s infinite}
.f-water svg{width:38px;height:38px;padding:9px;border-radius:50%;background:rgba(92,200,255,.14);color:var(--cyan-t);filter:drop-shadow(0 0 10px rgba(92,200,255,.6))}
.f-id{right:0;bottom:30px;animation:bob2 8s ease-in-out .4s infinite}
.f-id i{font:italic 500 .95rem Georgia,serif}
.pct{display:grid;place-items:center;width:46px;height:46px;border-radius:50%;background:rgba(200,240,74,.14);color:var(--accent);font-size:.78rem}
@keyframes bob2{50%{transform:translateY(-8px)}}

/* Ringe */
.ring{--p:50;--c:var(--lime);position:relative;display:grid;place-items:center;width:52px;height:52px;border-radius:50%;
  background:conic-gradient(var(--c) calc(var(--p)*1%),var(--ring-track) 0);filter:drop-shadow(0 0 10px color-mix(in srgb,var(--c) 55%,transparent))}
.ring::before{content:"";position:absolute;inset:5px;border-radius:50%;background:var(--ring-in)}
.ring b{position:relative;font:600 .9rem var(--disp)}
.ring.big{width:150px;height:150px}
.ring.big::before{inset:11px}
.ring.big b{font-size:1.45rem;display:flex;align-items:baseline;gap:3px}
.ring.big small{font-size:.7rem;color:var(--mute);font-weight:500}

/* Leiste */
.strip{border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:rgba(255,255,255,.015)}
.strip-in{display:grid;grid-template-columns:repeat(4,1fr)}
.strip-in div{padding:26px 20px;display:flex;align-items:center;gap:14px}
.strip-in div+div{border-left:1px solid var(--line)}
.strip b{font:700 2.1rem var(--disp);color:var(--accent)}
.strip span{color:var(--mute);font-size:.92rem;line-height:1.35}

/* Funktionen */
.feat{padding:110px 0 30px}
.feat-in{display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:center}
.rev .feat-txt{order:2}
.feat-txt>p{color:var(--soft);font-size:1.08rem}
.feat-art{display:flex;justify-content:center;position:relative}
.feat-art::before{content:"";position:absolute;width:80%;aspect-ratio:1;border-radius:50%;top:50%;left:50%;transform:translate(-50%,-50%);background:radial-gradient(circle,rgba(200,240,74,.13),transparent 65%);filter:blur(30px)}
.rev .feat-art::before{background:radial-gradient(circle,rgba(92,200,255,.14),transparent 65%)}
.feat-art .phone{width:min(320px,80vw)}
.eyebrow{display:flex;align-items:center;gap:12px;color:var(--mute);font-size:.85rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase}
.eyebrow span{font:600 .8rem var(--disp);color:var(--accent);border:1px solid var(--accent-line);border-radius:99px;padding:3px 10px;letter-spacing:0}
.ticks{list-style:none;padding:0;margin:20px 0 0}
.ticks li{position:relative;padding-left:32px;margin:10px 0;color:var(--soft)}
.ticks li::before{content:"";position:absolute;left:0;top:.28em;width:20px;height:20px;border-radius:50%;background:rgba(200,240,74,.14) var(--tick)}
.care{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:26px}
.care div{background:var(--card);border:1px solid var(--line);border-radius:18px;padding:14px 16px;font-weight:600}
.care svg{width:22px;height:22px;color:var(--accent);margin-bottom:8px}
.care div:first-child svg{color:var(--cyan-t)}
.care small{display:block;color:var(--mute);font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;font-weight:600}
.steps{list-style:none;padding:0;margin:22px 0 0;counter-reset:s}
.steps li{counter-increment:s;position:relative;padding:14px 16px 14px 60px;border:1px solid var(--line);background:var(--card);border-radius:18px;margin:10px 0;color:var(--soft)}
.steps li b{color:var(--ink)}
.steps li::before{content:counter(s);position:absolute;left:14px;top:50%;transform:translateY(-50%);width:32px;height:32px;border-radius:50%;display:grid;place-items:center;
  font:600 .85rem var(--disp);color:#0A0F0C;background:var(--frost);box-shadow:0 0 16px rgba(255,138,91,.5)}
.steps li:nth-child(2)::before{background:#FFB86B;box-shadow:0 0 16px rgba(255,184,107,.45)}
.steps li:nth-child(3)::before{background:var(--lime);box-shadow:0 0 16px rgba(200,240,74,.45)}

/* Karten */
.duo{padding:90px 0 10px}
.duo-in{display:grid;grid-template-columns:1fr 1fr;gap:22px}
.card{position:relative;background:linear-gradient(160deg,var(--card-hi),var(--card-lo));border:1px solid var(--line);border-radius:var(--r);padding:34px;overflow:hidden}
.card p{color:var(--soft)}
.card-lime{border-color:rgba(200,240,74,.3);background:linear-gradient(160deg,rgba(200,240,74,.1),rgba(200,240,74,.02))}
.tag{display:inline-block;font:600 .72rem var(--disp);color:#0A0F0C;background:var(--lime);border-radius:99px;padding:4px 11px;margin-bottom:14px}
.more{font-weight:600}
.diary{display:flex;gap:10px;margin-top:20px}
.diary span{flex:1;aspect-ratio:3/4;border-radius:16px;background:var(--img) center/cover;border:1px solid var(--line)}
.diary .add{display:grid;place-items:center;background:var(--card);filter:none;color:var(--accent);font:300 2rem var(--disp)}
.chat{margin-top:20px;display:flex;flex-direction:column;gap:10px}
.chat p{margin:0;padding:12px 16px;border-radius:20px;max-width:88%;font-size:.95rem}
.chat .q{align-self:flex-end;background:var(--moss);color:#fff;border-bottom-right-radius:6px}
.chat .a{background:var(--tint);border:1px solid var(--line);border-bottom-left-radius:6px;color:var(--ink)}

/* Sensor */
.sensor{padding:130px 0 40px;position:relative}
.sensor::before{content:"";position:absolute;inset:60px 0 auto;height:600px;background:radial-gradient(50% 60% at 50% 30%,rgba(92,200,255,.1),transparent 70%);pointer-events:none}
.sec-head{max-width:720px;margin:0 auto 50px;text-align:center;position:relative}
.sec-head .eyebrow{justify-content:center}
.sec-head>p{color:var(--soft);font-size:1.08rem}
.rings{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin-bottom:70px}
.rings .r{display:flex;flex-direction:column;align-items:center;gap:12px;font-weight:600}
.rings em{font-style:normal;font-size:.78rem;color:var(--accent);background:rgba(200,240,74,.14);padding:2px 10px;border-radius:99px;margin-top:-6px}
.sensor-row{display:grid;grid-template-columns:.9fr 1.1fr;gap:60px;align-items:center}
.sensor-cards{display:flex;flex-direction:column;gap:22px}

/* Haushalt, Wetter */
.household{list-style:none;padding:0;margin:20px 0 0;display:flex;flex-direction:column;gap:8px}
.household li{display:flex;align-items:center;gap:14px;background:var(--tint);border:1px solid var(--line);border-radius:18px;padding:10px 14px}
.household b{display:block;font-size:.95rem}
.household small{color:var(--mute)}
.av{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;font:600 .9rem var(--disp);background:hsl(var(--h) 55% 32%);color:#fff;flex:none}
.av-g{background:transparent;border:1.5px dashed var(--frost-t);color:var(--frost-t)}
.wx{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:20px}
.wx div{background:var(--tint);border:1px solid var(--line);border-radius:18px;padding:12px 6px;text-align:center;display:flex;flex-direction:column;align-items:center;gap:4px;font-size:.85rem}
.wx svg{width:30px;height:30px}
.wx b{font:600 1.05rem var(--disp)}
.wx small{color:var(--mute);font-size:.72rem;line-height:1.2}
.wx .rain{border-color:rgba(92,200,255,.35);background:rgba(92,200,255,.07)}
.wx .rain small{color:var(--cyan-t)}
.wx .frost{border-color:rgba(255,138,91,.4);background:rgba(255,138,91,.08)}
.wx .frost small{color:var(--frost-t)}

/* Geräte */
.devices{padding:130px 0 40px}
.dev-art{position:relative;max-width:1000px;margin:0 auto;padding-bottom:40px}
.dev-art .mac{width:94%;border-radius:14px;box-shadow:0 0 0 1px rgba(255,255,255,.1),0 40px 90px -30px var(--shadow),0 0 120px -40px rgba(200,240,74,.25)}
.ipad{position:absolute;right:-3%;bottom:0;width:40%;border-radius:26px;padding:10px;background:linear-gradient(145deg,#2A322D,#121714 40%,#1C231F);box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.08),0 30px 70px -20px var(--shadow)}
.ipad img{border-radius:17px}

/* Datenschutz */
.privacy{padding:130px 0 40px}
.tiles{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.tile{background:var(--card);border:1px solid var(--line);border-radius:24px;padding:26px}
.tile svg{width:34px;height:34px;color:var(--accent);margin-bottom:16px;filter:drop-shadow(0 0 10px rgba(200,240,74,var(--glow)))}
.tile h3{font-size:1.02rem;margin-bottom:.4em}
.tile p{color:var(--mute);font-size:.93rem;margin:0}
.fine{color:var(--mute);font-size:.88rem;text-align:center;max-width:760px;margin:30px auto 0}

/* Preise */
.prices{padding:130px 0 40px}
.plans{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;align-items:stretch}
.plan{position:relative;background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:34px 30px}
.plan h3{font-size:1.05rem;color:var(--mute);font-weight:500}
.price{font:700 2.8rem var(--disp);margin:6px 0 0;letter-spacing:-.03em}
.per{color:var(--mute);font-size:.9rem}
.plan-hi{border-color:rgba(200,240,74,.45);background:linear-gradient(170deg,rgba(200,240,74,.12),rgba(200,240,74,.02) 60%);box-shadow:0 30px 80px -40px rgba(200,240,74,.45)}
.plan-hi .tag{position:absolute;top:-12px;left:30px;margin:0}

/* FAQ */
.faq{padding:130px 0 40px}
.faq-in{max-width:820px}
.qs details{border-bottom:1px solid var(--line)}
.qs summary{cursor:pointer;list-style:none;padding:22px 40px 22px 0;font:600 1.05rem var(--disp);position:relative}
.qs summary::-webkit-details-marker{display:none}
.qs summary::after{content:"+";position:absolute;right:4px;top:50%;transform:translateY(-50%);font:300 1.6rem var(--disp);color:var(--accent);transition:transform .25s}
.qs details[open] summary::after{transform:translateY(-50%) rotate(45deg)}
.qs details p{color:var(--soft);margin:0 0 22px}

/* Schluss */
.final{padding:140px 0 120px;text-align:center;position:relative;overflow:hidden}
.final::before{content:"";position:absolute;left:50%;top:40%;width:900px;height:600px;transform:translate(-50%,-50%);background:radial-gradient(closest-side,rgba(200,240,74,.16),transparent);pointer-events:none}
.final-in{position:relative;display:flex;flex-direction:column;align-items:center}
.final img{border-radius:22px;box-shadow:0 0 60px rgba(200,240,74,.3);margin-bottom:30px}
.final h2{font-size:clamp(2.2rem,5vw,3.8rem);max-width:14em}
.final p{color:var(--soft);font-size:1.1rem;max-width:34em;margin-bottom:30px}
.final .req{font-size:.85rem;color:var(--mute);margin:26px 0 0}

/* Fuß */
.foot{border-top:1px solid var(--line);padding:30px 0 calc(30px + env(safe-area-inset-bottom))}
.foot-in{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;color:var(--mute);font-size:.88rem}
.foot p{margin:0}
.foot nav{display:flex;gap:22px;flex-wrap:wrap}
.foot a{color:var(--mute)}
.foot a:hover{color:var(--ink)}

/* Einblenden beim Scrollen (nur mit JavaScript) */
.js .rv{opacity:0;transform:translateY(28px);transition:opacity .8s ease,transform .8s cubic-bezier(.2,.7,.2,1)}
.js .rv.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}.js .rv{opacity:1;transform:none}html{scroll-behavior:auto}}

/* Schmal */
@media (max-width:960px){
  .nav{display:none}.top-r{margin-left:auto}
  .hero{padding-top:48px}
  .hero-in{grid-template-columns:1fr;min-height:0}
  .hero-art{height:560px;max-width:460px;width:100%;margin:0 auto}
  .hero-art .phone{width:250px}
  .ph-front{right:auto;left:50%;margin-left:-150px}
  .ph-back{right:0}
  .f-moist{left:0;top:80px}.f-water{left:0;bottom:70px}.f-id{right:0;bottom:10px}
  .strip-in{grid-template-columns:1fr 1fr}
  .strip-in div:nth-child(3){border-left:0}
  .strip-in div:nth-child(n+3){border-top:1px solid var(--line)}
  .feat{padding-top:80px}
  .feat-in,.duo-in,.sensor-row{grid-template-columns:1fr;gap:44px}
  .rev .feat-txt{order:0}
  .rings{grid-template-columns:1fr 1fr;row-gap:36px}
  .tiles{grid-template-columns:1fr 1fr}
  .plans{grid-template-columns:1fr;max-width:460px;margin:0 auto}
  .plan-hi{order:-1;margin-top:12px}
}
@media (max-width:560px){
  body{font-size:16px}
  .top-in{gap:12px}.btn-s{display:none}
  .hero-art{height:500px}
  .hero-art .phone{width:220px}.ph-front{margin-left:-130px}
  .float{font-size:.82rem;padding:9px 14px 9px 9px}
  .f-id{display:none}
  .ring.big{width:124px;height:124px}.ring.big b{font-size:1.15rem}
  .card{padding:26px 22px}
  .tiles{grid-template-columns:1fr}
  .ipad{width:48%;right:-2%}
  .wx{grid-template-columns:repeat(2,1fr)}
}

/* CJK: Überschriften nicht mitten im Wort umbrechen (ja/zh an Satzzeichen, ko zwischen Wörtern) */
:lang(ja) :is(h1,h2,h3),:lang(zh) :is(h1,h2,h3){word-break:keep-all;overflow-wrap:anywhere}
:lang(ko){word-break:keep-all;overflow-wrap:anywhere}
/* Datenschutz und Impressum */
.legal{padding:clamp(110px,14vw,150px) 0 90px}.legal-in{max-width:780px}
.legal h1{font-family:var(--disp);font-size:clamp(2rem,5vw,3rem);line-height:1.1;letter-spacing:-.02em;margin:0 0 .35em}
.legal h2{font-family:var(--disp);font-size:clamp(1.1rem,2.4vw,1.35rem);line-height:1.3;margin:2.2em 0 .6em}
.legal p,.legal li{color:var(--soft)}.legal strong{color:var(--ink)}.legal .muted{color:var(--mute);font-size:.95rem;margin-top:0}
.legal ul{padding-left:1.2em}.legal li{margin:.35em 0}.legal a{color:var(--accent)}