
:root {
  color-scheme: dark;
  /* Flaechen */
  --bg-top:#07111f; --bg-bottom:#030913;
  --glow-cyan:rgba(16,232,237,.11); --glow-violet:rgba(149,84,255,.1); --grid-line:rgba(255,255,255,.04); --grid-opacity:.16;
  --nav-bg:rgb(3,9,19); --menu-bg:#07111f;
  --card-1:rgba(13,32,51,.75); --card-2:rgba(6,16,29,.7); --card-flat:rgba(8,23,39,.76); --card-quiet:rgba(3,9,19,.44);
  --commerce-1:rgba(14,36,57,.94); --commerce-2:rgba(5,15,28,.9); --commerce-ring:rgba(255,255,255,.016);
  --featured-1:rgba(18,53,70,.9); --featured-2:rgba(13,24,50,.86);
  --phone-1:rgba(10,24,40,.92); --phone-2:rgba(4,12,22,.95); --phone-head:rgba(255,255,255,.025);
  --tint:rgba(255,255,255,.03); --tint-2:rgba(255,255,255,.05); --tint-3:rgba(255,255,255,.06);
  --accent-tint:rgba(16,232,237,.1); --accent-tint-2:rgba(16,232,237,.12); --accent-line:rgba(16,232,237,.35); --accent-line-2:rgba(16,232,237,.4);
  --violet-tint:rgba(149,84,255,.12); --violet-line:rgba(200,168,255,.25);
  --privacy-1:rgba(149,84,255,.05); --privacy-2:rgba(16,232,237,.06);
  --final-1:rgba(16,232,237,.1); --final-2:rgba(149,84,255,.12); --final-glow-opacity:.16;
  /* Linien, Schatten */
  --line:rgba(150,199,225,.17); --line-strong:rgba(135,249,251,.28); --line-hover:rgba(135,249,251,.45);
  --shadow:0 24px 80px rgba(0,0,0,.35); --shadow-glow:rgba(16,232,237,.07);
  /* Text */
  --text:#f7fbff; --text-2:#c3d0df; --muted:#8798aa; --dim:#7a8ca0;
  --accent:#87f9fb;            /* Akzent-TEXT (Eyebrow, Nummern, BRAIN) */
  --accent-strong:#10e8ed;     /* Punkte, Linien, Glow */
  --violet-text:#c8a8ff; --focus:#c8a8ff;
  --grad-1:#87f9fb; --grad-2:#10e8ed; --grad-3:#c8a8ff;   /* Headline-Verlauf */
  /* Buttons, Chat */
  --btn-1:#87f9fb; --btn-2:#10e8ed; --btn-text:#00191d; --btn-shadow:rgba(16,232,237,.18); --btn-shadow-hover:rgba(16,232,237,.28);
  --bubble-user:linear-gradient(135deg,#1b6b78,#155a72); --bubble-user-text:#eafcff; --bubble-ai:#122638;
  --skip-bg:#f7fbff; --skip-text:#030913;
  --radius:22px; --max:1180px;
}
@media (prefers-color-scheme: light) {
  :root {
    color-scheme: light;
    --bg-top:#f4f8fb; --bg-bottom:#eaf1f7;
    --glow-cyan:rgba(14,116,144,.08); --glow-violet:rgba(109,40,217,.06); --grid-line:rgba(11,26,43,.05); --grid-opacity:.5;
    --nav-bg:rgb(244,248,251); --menu-bg:#f4f8fb;
    --card-1:#ffffff; --card-2:#f7fafc; --card-flat:#ffffff; --card-quiet:#ffffff;
    --commerce-1:#ffffff; --commerce-2:#f7fafc; --commerce-ring:rgba(11,26,43,.03);
    --featured-1:#e9f7fa; --featured-2:#f1edfd;
    --phone-1:#ffffff; --phone-2:#f9fbfd; --phone-head:#f4f8fb;
    --tint:rgba(11,26,43,.03); --tint-2:rgba(11,26,43,.05); --tint-3:rgba(11,26,43,.06);
    --accent-tint:rgba(14,116,144,.08); --accent-tint-2:rgba(14,116,144,.1); --accent-line:rgba(14,116,144,.35); --accent-line-2:rgba(14,116,144,.45);
    --violet-tint:rgba(109,40,217,.08); --violet-line:rgba(109,40,217,.25);
    --privacy-1:rgba(109,40,217,.04); --privacy-2:rgba(14,116,144,.05);
    --final-1:rgba(14,116,144,.08); --final-2:rgba(109,40,217,.08); --final-glow-opacity:.08;
    --line:#c9d6e2; --line-strong:rgba(14,116,144,.35); --line-hover:rgba(14,116,144,.55);
    --shadow:0 18px 50px rgba(11,26,43,.08); --shadow-glow:rgba(14,116,144,.06);
    --text:#0b1a2b; --text-2:#33475b; --muted:#4b5d70; --dim:#566a7e;
    --accent:#0e7490; --accent-strong:#0e7490;
    --violet-text:#6d28d9; --focus:#6d28d9;
    --grad-1:#0e7490; --grad-2:#0b7a8f; --grad-3:#6d28d9;
    --btn-1:#0e7490; --btn-2:#0b5f75; --btn-text:#ffffff; --btn-shadow:rgba(14,116,144,.18); --btn-shadow-hover:rgba(14,116,144,.28);
    --bubble-user:linear-gradient(135deg,#0e7490,#155e75); --bubble-user-text:#ffffff; --bubble-ai:#eef3f8;
    --skip-bg:#0b1a2b; --skip-text:#ffffff;
  }
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:90px}
body{margin:0;background:var(--bg-bottom);color:var(--text);font:16px/1.65 Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;overflow-x:hidden}
body:before{content:"";position:fixed;inset:0;transform:translateZ(0);will-change:transform;contain:strict;pointer-events:none;z-index:-2;background:radial-gradient(circle at 78% 15%,var(--glow-cyan),transparent 28%),radial-gradient(circle at 17% 46%,var(--glow-violet),transparent 31%),linear-gradient(180deg,var(--bg-top) 0%,var(--bg-bottom) 65%)}
body:after{content:"";position:fixed;inset:0;transform:translateZ(0);will-change:transform;contain:strict;z-index:-1;pointer-events:none;opacity:var(--grid-opacity);background-image:linear-gradient(var(--grid-line) 1px,transparent 1px),linear-gradient(90deg,var(--grid-line) 1px,transparent 1px);background-size:48px 48px;mask-image:linear-gradient(to bottom,black,transparent 60%)}
a{color:inherit;text-decoration:none}
button,a{touch-action:manipulation}
img{max-width:100%}
.wrap{width:min(calc(100% - 40px),var(--max));margin-inline:auto}
.skip{position:fixed;left:16px;top:-60px;z-index:99;background:var(--skip-bg);color:var(--skip-text);padding:10px 16px;border-radius:10px}
.skip:focus{top:16px}
:focus-visible{outline:1px solid var(--focus);outline-offset:1px}

/* NAV */
.nav{position:sticky;top:0;z-index:30;border-bottom:1px solid transparent;background:var(--nav-bg);transition:border-color .25s}
.nav.scrolled{border-color:var(--line)}
.nav-inner{height:72px;display:flex;align-items:center;gap:28px}
.brand{display:flex;align-items:center;gap:10px;margin-right:auto;font-weight:850;letter-spacing:.04em}
.brand-logo{width:40px;height:auto;filter:drop-shadow(0 0 10px var(--btn-shadow))}
.brand em{color:var(--accent);font-style:normal}
.nav-links{display:flex;gap:26px;color:var(--text-2);font-size:.94rem}
.nav-links a:hover{color:var(--text)}
.actions{display:flex;gap:10px}
.menu{display:none;border:1px solid var(--line);background:none;color:var(--text);border-radius:10px;width:44px;height:44px;font-size:1.25rem;cursor:pointer}

.lang-switch{position:relative;display:inline-grid;grid-template-columns:1fr 1fr;align-self:center;flex:none;padding:3px;border:1px solid var(--line);border-radius:99px;background:var(--tint)}
.lang-switch button{position:relative;z-index:1;min-width:42px;height:34px;padding:0 10px;border:0;border-radius:99px;background:none;color:var(--text-2);font-family:inherit;font-size:.78rem;font-weight:800;line-height:1;letter-spacing:.08em;cursor:pointer;transition:color .2s}
.lang-switch button:hover{color:var(--text)}
.lang-switch button[aria-pressed="true"]{color:var(--btn-text)}
.lang-switch button:focus-visible{outline-offset:1px}
.lang-marker{position:absolute;z-index:0;top:3px;bottom:3px;left:3px;width:calc((100% - 6px) / 2);border-radius:99px;background:linear-gradient(135deg,var(--btn-1),var(--btn-2));box-shadow:0 4px 14px var(--btn-shadow);transition:transform .2s ease}
.lang-switch[data-active="en"] .lang-marker{transform:translateX(100%)}
@media (prefers-reduced-motion:reduce){.lang-marker,.lang-switch button{transition:none}}
.nav-links .nav-lang{display:none}

/* BUTTONS */
.btn{min-height:46px;display:inline-flex;align-items:center;justify-content:center;gap:9px;padding:0 20px;border:1px solid var(--line);border-radius:12px;font-weight:750;letter-spacing:-.01em;transition:transform .2s,background .2s,border-color .2s,box-shadow .2s}
.btn:hover{transform:translateY(-2px);border-color:var(--line-hover)}
.btn.primary{color:var(--btn-text);background:linear-gradient(135deg,var(--btn-1),var(--btn-2));border-color:transparent;box-shadow:0 10px 32px var(--btn-shadow)}
.btn.primary:hover{box-shadow:0 14px 38px var(--btn-shadow-hover)}
.btn.ghost{background:var(--tint)}

/* TYPO */
h1,h2,h3,p{margin-top:0}
.eyebrow{display:inline-flex;align-items:center;gap:10px;color:var(--accent);font-size:.78rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase}
.eyebrow:before{content:"";width:28px;height:1px;background:var(--accent-strong)}
.gradient{white-space:nowrap;color:transparent;background:linear-gradient(90deg,var(--grad-1),var(--grad-2) 42%,var(--grad-3));-webkit-background-clip:text;background-clip:text}
.num{color:var(--accent);font:800 .75rem/1 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.1em}

/* HERO */
.hero{min-height:560px;display:grid;grid-template-columns:.9fr 1.1fr;align-items:center;gap:56px;padding:40px 0 40px}
.hero-logo{display:block;width:150px;height:auto;margin-bottom:26px;filter:drop-shadow(0 0 28px var(--btn-shadow))}
h1{font-size:clamp(3rem,4.9vw,4.7rem);line-height:.98;letter-spacing:-.06em;margin:18px 0 24px}
.lead{max-width:560px;color:var(--text-2);font-size:clamp(1.03rem,1.5vw,1.18rem);line-height:1.6;margin-bottom:22px}
.micro{display:flex;gap:18px;flex-wrap:wrap;color:var(--muted);font-size:.84rem}
.micro span{display:flex;align-items:center;gap:8px}
.micro i{width:6px;height:6px;border-radius:50%;background:var(--accent-strong);box-shadow:0 0 10px var(--accent-strong)}

.hero-commerce{position:relative;padding:22px;border:1px solid var(--line-strong);border-radius:28px;background:linear-gradient(145deg,var(--commerce-1),var(--commerce-2));box-shadow:var(--shadow),0 0 0 8px var(--commerce-ring)}
.commerce-head{display:flex;align-items:end;justify-content:space-between;gap:20px;padding:2px 3px 17px}
.commerce-head h2{font-size:1.18rem;margin:0 0 2px}
.commerce-head p{color:var(--muted);font-size:.84rem;margin:0}
.commerce-kicker{color:var(--accent);font-size:.75rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase}
.hero-plans{display:grid;grid-template-columns:1fr 1.06fr;gap:12px}
.price-card{padding:22px;border:1px solid var(--line);border-radius:19px;background:var(--card-flat);display:flex;flex-direction:column}
.price-card.featured{background:linear-gradient(145deg,var(--featured-1),var(--featured-2));border-color:var(--accent-line-2);box-shadow:0 22px 70px var(--shadow-glow)}
.price-label{display:flex;align-items:center;justify-content:space-between;font-weight:800}
.badge{padding:5px 10px;border-radius:99px;background:var(--accent-tint-2);color:var(--accent);font-size:.7rem;text-transform:uppercase;letter-spacing:.08em}
.price{font-size:clamp(2.6rem,4vw,3.6rem);line-height:1;letter-spacing:-.06em;margin:20px 0 8px}
.price small{font-size:.9rem;color:var(--muted);letter-spacing:0}
.price-card>p{color:var(--muted);font-size:.88rem;margin-bottom:4px;flex:1}
.price-card .btn{width:100%;margin-top:13px;padding-inline:12px}
.plan-includes{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:12px}
.plan-includes span{padding:9px;text-align:center;border:1px solid var(--line);border-radius:10px;color:var(--muted);font-size:.74rem}
.plan-includes b{color:var(--text)}
.commerce-note{margin:14px 0 0;text-align:center;color:var(--muted);font-size:.82rem}

/* SECTIONS */
.section{padding:104px 0}
.section-head{display:grid;grid-template-columns:.85fr 1.15fr;gap:50px;align-items:end;margin-bottom:44px}
.section h2{font-size:clamp(2.2rem,4.2vw,4.1rem);line-height:1.05;letter-spacing:-.05em;margin:12px 0 0}
.section-intro{color:var(--text-2);font-size:1.08rem;max-width:620px;margin:0 0 8px}

/* DEMO: Tabs */
.tabs{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:22px}
.tab{padding:9px 18px;border-radius:99px;border:1px solid var(--line);background:var(--tint);color:var(--text-2);font:600 .88rem/1 inherit;font-family:inherit;cursor:pointer;transition:background .15s,color .15s,border-color .15s}
.tab:hover{color:var(--text);border-color:var(--line-hover)}
.tab[aria-selected="true"]{background:linear-gradient(135deg,var(--btn-1),var(--btn-2));color:var(--btn-text);border-color:transparent}

/* DEMO: Messenger */
.chat-grid{display:grid;grid-template-columns:1fr 1fr;gap:22px}
.phone{display:flex;flex-direction:column;height:500px;border:1px solid var(--line);border-radius:26px;background:linear-gradient(180deg,var(--phone-1),var(--phone-2));box-shadow:var(--shadow);overflow:hidden}
.phone-good{border-color:var(--line-strong);box-shadow:var(--shadow),0 0 50px var(--shadow-glow)}
.phone-head{display:flex;align-items:center;gap:12px;padding:16px 20px;border-bottom:1px solid var(--line);background:var(--phone-head)}
.avatar{width:40px;height:40px;flex:none;border-radius:50%;display:grid;place-items:center;background:var(--accent-tint);border:1px solid var(--accent-line)}
.avatar img{width:26px;height:auto}
.avatar-plain{background:var(--tint-3);border-color:var(--line);color:var(--muted);font-size:.78rem;font-weight:800}
.phone-title{display:flex;flex-direction:column;line-height:1.3}
.phone-title strong{font-size:.95rem}
.phone-title span{font-size:.76rem;color:var(--dim)}
.phone-title .online{color:var(--accent);display:flex;align-items:center;gap:6px}
.phone-title .online:before{content:"";width:7px;height:7px;border-radius:50%;background:var(--accent-strong);box-shadow:0 0 8px var(--accent-strong)}
.phone-body{flex:1;display:flex;flex-direction:column;gap:16px;padding:22px 20px;overflow:hidden}
.day{align-self:center;padding:4px 12px;border-radius:99px;background:var(--tint-2);color:var(--dim);font-size:.72rem;font-weight:600}
.msg{max-width:84%;display:flex;flex-direction:column;gap:5px;animation:pop .28s ease-out both}
.msg.user{align-self:flex-end;align-items:flex-end}
.msg.ai{align-self:flex-start}
.bubble{padding:12px 16px;border-radius:18px;font-size:.92rem;line-height:1.55}
.msg.user .bubble{background:var(--bubble-user);color:var(--bubble-user-text);border-bottom-right-radius:6px}
.msg.ai .bubble{background:var(--bubble-ai);color:var(--text-2);border:1px solid var(--line);border-bottom-left-radius:6px}
.phone-good .msg.ai .bubble{color:var(--text);border-color:var(--accent-line)}
.meta{display:flex;align-items:center;gap:6px;padding:0 6px;color:var(--dim);font-size:.7rem}
.ticks{color:var(--accent);letter-spacing:-.2em}
.recall{display:inline-flex;align-items:center;gap:6px;align-self:flex-start;margin-top:2px;padding:4px 10px;border-radius:99px;background:var(--violet-tint);border:1px solid var(--violet-line);color:var(--violet-text);font-size:.7rem;font-weight:600}
.typing{align-self:flex-start;display:flex;gap:4px;padding:14px 16px;border-radius:18px;border-bottom-left-radius:6px;background:var(--bubble-ai);border:1px solid var(--line)}
.typing span{width:6px;height:6px;border-radius:50%;background:var(--muted);animation:dot 1.2s infinite}
.typing span:nth-child(2){animation-delay:.15s}
.typing span:nth-child(3){animation-delay:.3s}
.phone-input{display:flex;align-items:center;gap:10px;margin:0 14px 14px;padding:11px 12px 11px 18px;border:1px solid var(--line);border-radius:99px;color:var(--dim);font-size:.86rem}
.phone-input span{flex:1}
.phone-input b{width:32px;height:32px;display:grid;place-items:center;border-radius:50%;background:var(--accent-tint-2);color:var(--accent);font-size:.8rem}
.demo-note{margin:18px 0 0;color:var(--dim);font-size:.8rem;text-align:center}
@keyframes pop{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
@keyframes dot{0%,60%,100%{transform:translateY(0)}30%{transform:translateY(-4px)}}

/* FEATURES */
.feature-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:16px}
.feature{grid-column:span 4;min-height:270px;padding:28px;border:1px solid var(--line);border-radius:var(--radius);background:linear-gradient(145deg,var(--card-1),var(--card-2));overflow:hidden;position:relative}
.feature.wide{grid-column:span 8}
.feature.tall{min-height:350px}
.feature h3{font-size:1.35rem;letter-spacing:-.025em;margin:50px 0 12px}
.feature p{color:var(--text-2);margin:0;max-width:44ch}
.trace{position:absolute;right:-20px;top:-25px;width:170px;height:170px;border:1px solid var(--accent-tint-2);border-radius:50%}
.trace:before,.trace:after{content:"";position:absolute;border:inherit;border-radius:inherit;inset:23px}
.trace:after{inset:48px;background:var(--violet-tint)}
.api-card{display:grid;grid-template-columns:1fr 1.1fr;gap:26px;align-items:center}
/* Code-Kasten bleibt in beiden Modi dunkel (feste Farben, eigener Kontrast) */
.terminal{margin:0;border:1px solid var(--line);background:#02070d;border-radius:16px;padding:18px;font:500 .78rem/1.8 ui-monospace,SFMono-Regular,Menlo,monospace;color:#a9bacb;overflow:auto;white-space:pre}
.terminal .c{color:#c8a8ff}
.terminal .v{color:#87f9fb}
.terminal .r{color:#f7fbff}
.terminal .m{color:#8798aa}

/* SCHRITTE */
.steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.step{padding:28px;border:1px solid var(--line);border-radius:var(--radius);background:var(--card-flat)}
.step h3{font-size:1.2rem;margin:22px 0 8px}
.step p{color:var(--text-2);margin:0;font-size:.95rem}

/* DATENSCHUTZ */
.privacy{position:relative;border-block:1px solid var(--line);background:linear-gradient(90deg,var(--privacy-1),var(--privacy-2))}
.privacy-grid{display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:center}
.principles{display:grid;gap:12px}
.principle{display:grid;grid-template-columns:48px 1fr;gap:16px;padding:20px;border:1px solid var(--line);border-radius:16px;background:var(--card-quiet)}
.principle b{width:48px;height:48px;border-radius:12px;display:grid;place-items:center;background:var(--accent-tint);color:var(--accent);font-size:.85rem}
.principle h3{font-size:1rem;margin:0 0 4px}
.principle p{color:var(--muted);font-size:.88rem;margin:0}

/* FAQ */
.faq-section .section-head{margin-bottom:28px}
.faq{max-width:860px;border-top:1px solid var(--line)}
.faq details{border-bottom:1px solid var(--line);padding:20px 4px}
.faq summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:20px;font-weight:650;font-size:1.02rem}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";color:var(--muted);font-size:1.4rem;font-weight:300;line-height:1}
.faq details[open] summary::after{content:"−";color:var(--accent)}
.faq details p{color:var(--text-2);margin:12px 0 0;max-width:72ch}

/* ABSCHLUSS + FOOTER */
.final{padding:30px 0 110px}
.final-panel{position:relative;overflow:hidden;text-align:center;padding:80px 24px;border:1px solid var(--accent-line);border-radius:30px;background:linear-gradient(135deg,var(--final-1),var(--final-2))}
.final-panel:before{content:"";position:absolute;width:560px;height:560px;border-radius:50%;left:50%;top:-360px;transform:translateX(-50%);background:radial-gradient(circle closest-side,var(--accent-strong),transparent);opacity:var(--final-glow-opacity)}
.final h2{font-size:clamp(2.3rem,5vw,4.4rem);line-height:1.05;letter-spacing:-.05em;max-width:820px;margin:0 auto 20px}
.final p{color:var(--text-2);margin:0 auto 30px;max-width:560px}
footer{border-top:1px solid var(--line);padding:28px 0;color:var(--muted);font-size:.84rem}
.footer-inner{display:flex;align-items:center;gap:20px}
.footer-inner .brand{margin-right:0}
.footer-inner nav{margin-left:auto;display:flex;gap:20px}
.footer-inner a:hover{color:var(--text)}
/* Tap-Ziel mind. 24 px hoch (WCAG 2.5.8), Optik unveraendert */
.footer-inner nav a{display:inline-flex;align-items:center;min-height:24px}
/* Hinweis "Rechtstexte nur auf Deutsch": nur in der englischen Ansicht (html lang="en") */
.legal-note{display:none;margin:14px auto 0;color:var(--muted);font-size:.8rem}
html[lang="en"] .legal-note{display:block}

/* RESPONSIVE */
@media (max-width:980px){
  .nav-links{display:none}
  .menu{display:block}
  .nav.open .nav-links{display:flex;position:absolute;top:72px;left:0;right:0;padding:20px;flex-direction:column;background:var(--menu-bg);border-bottom:1px solid var(--line)}
  .actions .ghost{display:none}
  .hero{grid-template-columns:1fr;gap:36px;min-height:auto;padding-top:36px}
  .section-head,.privacy-grid{grid-template-columns:1fr}
  .section-head{gap:16px}
  .feature{grid-column:span 6}
  .feature.wide{grid-column:span 12}
  .steps{grid-template-columns:1fr}
  .privacy-grid{gap:36px}
  .section{padding:80px 0}
}
@media (max-width:760px){
  .chat-grid{grid-template-columns:1fr}
  .phone{height:auto;min-height:420px}
}
@media (max-width:640px){
  .wrap{width:min(calc(100% - 32px),var(--max))}
  .nav-inner{height:64px;gap:14px}
  .nav.open .nav-links{top:64px}
  /* Schriftzug bleibt sichtbar; dafuer wandert DE/EN ins Menue */
  .brand span{white-space:nowrap}
  .actions .lang-switch{display:none}
  .nav.open .nav-links .nav-lang{display:inline-grid;align-self:flex-start;margin-top:6px}
  .actions .btn{white-space:nowrap}
  .actions .btn{min-height:40px;padding:0 14px;font-size:.88rem}
  .lang-switch button{min-width:36px;height:30px;padding:0 8px}
  .hero{padding:28px 0 56px;gap:28px}
  .hero-logo{width:110px;margin-bottom:18px}
  h1{font-size:3rem;margin:14px 0 18px}
  .hero-commerce{padding:14px;border-radius:22px}
  .commerce-head{align-items:start}
  .hero-plans{grid-template-columns:1fr}
  .plan-includes{grid-template-columns:1fr 1fr}
  .plan-includes span:last-child{grid-column:1/-1}
  .feature,.feature.wide{grid-column:span 12;min-height:auto}
  .feature h3{margin-top:34px}
  .api-card{grid-template-columns:1fr}
  .section{padding:64px 0}
  .section h2{font-size:2.4rem}
  .msg{max-width:92%}
  .final-panel{padding:56px 18px}
  .footer-inner{align-items:flex-start;flex-direction:column}
  .footer-inner nav{margin-left:0;flex-wrap:wrap}
}
@media (max-width:400px){
  .nav-inner{gap:10px}
  .actions{gap:6px}
  .actions .btn{padding:0 10px;font-size:.82rem}
  .lang-switch button{min-width:32px;padding:0 6px}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*:before,*:after{transition:none!important;animation:none!important}
}
