:root{
  --bg:#08111f;--panel:#0e1a2d;--panel2:#13233b;--text:#eef4fb;--muted:#a9b8ca;
  --accent:#67e8c3;--accent2:#8db7ff;--line:#253752;--paper:#f7f9fc;--ink:#0d1727;
  --max:1180px;--radius:22px;--shadow:0 24px 80px rgba(0,0,0,.24)
}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;background:var(--bg);color:var(--text);line-height:1.6}a{color:inherit}.wrap{width:min(calc(100% - 40px),var(--max));margin-inline:auto}.skip-link{position:absolute;left:-9999px}.skip-link:focus{left:16px;top:16px;background:#fff;color:#000;padding:10px 14px;z-index:999}.site-header{position:sticky;top:0;z-index:50;background:rgba(8,17,31,.88);backdrop-filter:blur(14px);border-bottom:1px solid rgba(255,255,255,.07)}.header-inner{min-height:74px;display:flex;align-items:center;justify-content:space-between;gap:24px}.brand{display:inline-flex;align-items:center;gap:10px;text-decoration:none;font-weight:800;letter-spacing:-.03em;font-size:1.22rem}.brand-mark{display:grid;place-items:center;width:34px;height:34px;border-radius:10px;background:linear-gradient(135deg,var(--accent),var(--accent2));color:#07101c;font-weight:900}.main-nav{display:flex;align-items:center;gap:26px}.main-nav a{text-decoration:none;color:var(--muted);font-weight:650}.main-nav a:hover,.main-nav a:focus{color:#fff}.main-nav a[aria-current="page"]{color:#fff}.main-nav .nav-cta{color:#07101c;background:var(--accent);padding:10px 16px;border-radius:999px}.nav-toggle{display:none;background:none;color:#fff;border:1px solid var(--line);border-radius:10px;padding:8px 12px}.hero{padding:92px 0 72px;overflow:hidden}.hero-grid{display:grid;grid-template-columns:1.08fr .92fr;gap:62px;align-items:center}.eyebrow{text-transform:uppercase;letter-spacing:.16em;font-size:.76rem;font-weight:800;color:var(--accent)}h1,h2,h3{line-height:1.08;letter-spacing:-.04em;margin-top:0}h1{font-size:clamp(3rem,7vw,6.5rem);max-width:920px;margin-bottom:24px}h2{font-size:clamp(2rem,4vw,3.8rem);margin-bottom:20px}h3{font-size:1.35rem}.hero p,.lead{font-size:clamp(1.08rem,2vw,1.32rem);color:var(--muted);max-width:760px}.actions{display:flex;gap:14px;flex-wrap:wrap;margin-top:32px}.btn{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 20px;border-radius:999px;text-decoration:none;font-weight:800;border:1px solid var(--line)}.btn.primary{background:var(--accent);color:#06111d;border-color:var(--accent)}.btn.secondary{background:rgba(255,255,255,.03)}.trust-row{display:flex;gap:24px;flex-wrap:wrap;margin-top:34px;color:var(--muted);font-size:.94rem}.trust-row span::before{content:'✓';color:var(--accent);margin-right:8px;font-weight:900}.browser{border:1px solid var(--line);border-radius:24px;background:linear-gradient(180deg,#13233b,#0c1829);box-shadow:var(--shadow);overflow:hidden;transform:rotate(1deg)}.browser-bar{height:45px;border-bottom:1px solid var(--line);display:flex;align-items:center;padding:0 15px;gap:7px}.dot{width:9px;height:9px;border-radius:50%;background:#49627e}.browser-body{padding:26px}.mock-kicker{width:35%;height:9px;border-radius:999px;background:var(--accent);opacity:.75}.mock-title{width:78%;height:35px;border-radius:8px;background:#e8f1fb;margin:16px 0 10px}.mock-copy{width:86%;height:10px;background:#6d829c;border-radius:999px;margin:8px 0}.mock-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:28px}.mock-card{height:112px;border-radius:15px;background:linear-gradient(135deg,#1c3657,#18304d);border:1px solid #294566}.section{padding:82px 0}.section.light{background:var(--paper);color:var(--ink)}.section.light .muted{color:#556277}.section-head{display:flex;justify-content:space-between;gap:40px;align-items:end;margin-bottom:36px}.section-head p{max-width:620px;color:var(--muted)}.section.light .section-head p{color:#5c687a}.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.card{padding:28px;border:1px solid var(--line);border-radius:var(--radius);background:rgba(255,255,255,.025)}.light .card{background:#fff;border-color:#dfe6ef;box-shadow:0 12px 42px rgba(23,37,58,.07)}.card .num{color:var(--accent);font-weight:900;margin-bottom:40px}.light .card .num{color:#0d7c6b}.card p{color:var(--muted)}.light .card p{color:#5c687a}.link-arrow{display:inline-flex;gap:8px;font-weight:800;text-decoration:none;margin-top:8px}.showcase{display:grid;grid-template-columns:1fr 1fr;gap:28px}.showcase-item{border-radius:28px;padding:34px;min-height:320px;display:flex;flex-direction:column;justify-content:end;text-decoration:none;border:1px solid var(--line);background:radial-gradient(circle at 80% 10%,rgba(103,232,195,.24),transparent 35%),linear-gradient(145deg,#152942,#0d192a)}.showcase-item:nth-child(2){background:radial-gradient(circle at 20% 10%,rgba(141,183,255,.3),transparent 38%),linear-gradient(145deg,#17233e,#0d192a)}.showcase-item small{color:var(--accent);font-weight:800;text-transform:uppercase;letter-spacing:.12em}.showcase-item p{max-width:520px;color:var(--muted)}.band{padding:55px 0;border-block:1px solid var(--line);background:rgba(255,255,255,.025)}.band-inner{display:flex;align-items:center;justify-content:space-between;gap:28px}.page-hero{padding:76px 0 48px}.page-hero h1{font-size:clamp(2.6rem,6vw,5.3rem)}.content-grid{display:grid;grid-template-columns:1fr 320px;gap:48px}.prose{font-size:1.06rem}.prose h2{margin-top:52px;font-size:2rem}.prose p,.prose li{color:#c2cedb}.section.light .prose p,.section.light .prose li{color:#536176}.sidebox{position:sticky;top:100px;height:max-content;border:1px solid var(--line);border-radius:20px;padding:24px;background:rgba(255,255,255,.03)}.sidebox ul{padding-left:20px;color:var(--muted)}.demo-badge{display:inline-flex;padding:7px 11px;border-radius:999px;background:#fff1c9;color:#684b00;font-weight:900;font-size:.78rem;letter-spacing:.08em}.demo-frame{margin-top:26px;border:1px solid var(--line);border-radius:24px;overflow:hidden;background:#fff;box-shadow:var(--shadow)}.demo-topbar{padding:11px 16px;background:#fff4cd;color:#4e3b00;font-size:.88rem;font-weight:750;display:flex;justify-content:space-between;gap:20px}.demo-topbar a{font-weight:900}.demo-preview{min-height:520px;background:#f6f1e8;color:#2a2a28;padding:56px;position:relative;overflow:hidden}.paint-splash{position:absolute;right:-70px;top:-60px;width:340px;height:340px;border-radius:40% 60% 55% 45%;background:linear-gradient(135deg,#e0a565,#cc6f42);transform:rotate(20deg);opacity:.9}.demo-preview h2{font-size:clamp(2.5rem,5vw,5.4rem);max-width:690px;position:relative}.demo-preview p{max-width:600px;position:relative}.demo-services{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:70px;position:relative}.demo-service{padding:20px;background:rgba(255,255,255,.83);border-radius:18px;border:1px solid #ded7ca}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}.field{display:flex;flex-direction:column;gap:7px}.field.full{grid-column:1/-1}.field label{font-weight:750}.field input,.field textarea,.field select{width:100%;padding:13px 14px;border:1px solid #42536c;border-radius:12px;background:#0c1727;color:#fff;font:inherit}.field textarea{min-height:140px;resize:vertical}.notice{padding:14px 16px;border-radius:12px;margin-bottom:20px}.notice.ok{background:#123d34;color:#bdf7e7}.notice.err{background:#4c2026;color:#ffd6db}.honeypot{position:absolute!important;left:-9999px!important}.legal-warning{padding:16px;background:#4d3414;color:#ffe3a5;border-radius:12px;margin:20px 0}.site-footer{border-top:1px solid var(--line);padding:54px 0 24px}.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr;gap:40px}.site-footer p{color:var(--muted);max-width:500px}.site-footer strong{display:block;margin-bottom:12px}.site-footer a:not(.brand){display:block;text-decoration:none;color:var(--muted);margin:7px 0}.footer-bottom{border-top:1px solid var(--line);margin-top:36px;padding-top:20px;color:#6f8298;font-size:.9rem}
@media(max-width:900px){.hero-grid,.showcase,.content-grid{grid-template-columns:1fr}.cards{grid-template-columns:1fr}.hero{padding-top:64px}.browser{max-width:650px}.section-head,.band-inner{align-items:flex-start;flex-direction:column}.sidebox{position:static}.main-nav{display:none;position:absolute;top:74px;left:20px;right:20px;background:#0e1a2d;border:1px solid var(--line);border-radius:16px;padding:18px;flex-direction:column;align-items:stretch}.main-nav.open{display:flex}.nav-toggle{display:block}.footer-grid{grid-template-columns:1fr 1fr}.demo-services{grid-template-columns:1fr}.demo-preview{padding:34px 24px}}
@media(max-width:600px){.wrap{width:min(calc(100% - 28px),var(--max))}.footer-grid,.form-grid{grid-template-columns:1fr}.hero{padding-bottom:54px}h1{font-size:3.15rem}.section{padding:64px 0}.mock-cards{grid-template-columns:1fr}.demo-topbar{flex-direction:column}.field.full{grid-column:auto}}

/* Startseite: freundlichere visuelle Ausarbeitung */
.hero-home{position:relative;padding:76px 0 78px;background:
  radial-gradient(circle at 78% 18%,rgba(103,232,195,.12),transparent 24%),
  radial-gradient(circle at 8% 74%,rgba(141,183,255,.10),transparent 24%),
  linear-gradient(180deg,#08111f 0%,#091525 100%)}
.hero-home::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:28px;background:var(--paper);clip-path:polygon(0 82%,100% 0,100% 100%,0 100%)}
.hero-copy h1{font-size:clamp(3rem,5.8vw,5.35rem);max-width:780px;margin-bottom:22px}
.hero-copy h1 span{color:var(--accent)}
.hero-copy p{max-width:720px}
.hero-visual{margin:0;position:relative;border-radius:28px;overflow:hidden;border:1px solid rgba(255,255,255,.11);box-shadow:0 28px 80px rgba(0,0,0,.36);background:#101f31;transform:rotate(.25deg)}
.hero-visual::after{content:"";position:absolute;inset:0;box-shadow:inset 0 0 0 1px rgba(255,255,255,.035);pointer-events:none}
.hero-visual img{width:100%;height:auto;display:block;aspect-ratio:801/397;object-fit:cover}
.hero-visual figcaption{position:absolute;right:13px;bottom:12px;padding:6px 10px;border-radius:999px;background:rgba(5,12,21,.78);backdrop-filter:blur(8px);color:#c9d6e6;font-size:.72rem;border:1px solid rgba(255,255,255,.11)}
.services-section{padding-top:86px}
.section-intro{max-width:760px;margin:0 auto 38px}.section-intro.centered{text-align:center}.section-intro h2{font-size:clamp(2rem,3.7vw,3.25rem);margin:8px 0 14px}.section-intro p{color:#5c687a;font-size:1.08rem;margin:0 auto;max-width:680px}
.service-cards{gap:22px}.service-card{padding:30px;transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease}.service-card:hover{transform:translateY(-4px);box-shadow:0 18px 48px rgba(23,37,58,.11);border-color:#cbd8e7}.service-icon{width:54px;height:54px;border-radius:18px;background:#dff9f2;display:grid;place-items:center;margin-bottom:24px}.service-icon svg{width:28px;height:28px;fill:none;stroke:#0b2735;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.service-card h3{margin-bottom:10px}.service-card .link-arrow{color:#087d6c}
.portfolio-section{background:linear-gradient(180deg,#edf7f7 0%,#f7fbfc 100%);color:var(--ink)}.portfolio-head p{color:#5b6879}.portfolio-grid{display:grid;grid-template-columns:1.25fr 1fr 1fr;gap:22px}.portfolio-card{background:#fff;border:1px solid #dce7ec;border-radius:24px;overflow:hidden;box-shadow:0 14px 42px rgba(29,53,67,.08);color:var(--ink);text-decoration:none;transition:transform .2s ease,box-shadow .2s ease}.portfolio-card.live:hover{transform:translateY(-4px);box-shadow:0 20px 52px rgba(29,53,67,.14)}.portfolio-preview{height:240px;position:relative;overflow:hidden;padding:24px}.portfolio-copy{padding:23px 24px 26px}.portfolio-copy small{color:#0a8271;font-weight:850;text-transform:uppercase;letter-spacing:.08em}.portfolio-copy h3{margin:8px 0 9px;font-size:1.34rem}.portfolio-copy p{margin:0;color:#647184}.preview-label{position:absolute;z-index:4;top:16px;right:16px;font-size:.68rem;letter-spacing:.09em;font-weight:900;padding:6px 9px;border-radius:999px;background:#d7fbf1;color:#087665}.muted-label{background:rgba(255,255,255,.84);color:#445267}.craft-preview{background:linear-gradient(145deg,#263338,#6f715f)}.craft-preview::before{content:"";position:absolute;width:210px;height:210px;border-radius:50%;right:-55px;bottom:-70px;background:#ce8d58;opacity:.9}.mini-browser{display:flex;gap:5px;position:absolute;left:22px;right:22px;top:22px;padding-bottom:12px;border-bottom:1px solid rgba(255,255,255,.25)}.mini-browser i{width:7px;height:7px;border-radius:50%;background:rgba(255,255,255,.55)}.mini-copy{position:absolute;left:28px;bottom:32px;z-index:2;color:#fff}.mini-copy b{font-size:1.7rem;line-height:1.03;display:block}.mini-copy span{display:block;width:145px;height:7px;background:rgba(255,255,255,.62);border-radius:999px;margin-top:14px}.mini-copy span.short{width:104px;margin-top:7px}.beauty-preview{background:linear-gradient(135deg,#efe8e2,#d8c8bd)}.beauty-shape{position:absolute;width:180px;height:260px;border-radius:90px 90px 20px 20px;right:22px;bottom:-68px;background:linear-gradient(160deg,#b08374,#714d48);opacity:.82}.mini-copy.dark{color:#382b2a}.mini-copy.dark span{background:rgba(56,43,42,.42)}.stay-preview{background:linear-gradient(160deg,#395d72,#b8d5df)}.stay-window{position:absolute;right:30px;top:34px;width:155px;height:150px;border:10px solid rgba(255,255,255,.82);background:linear-gradient(#8cc1db 0 48%,#537c60 48% 70%,#d3bd83 70%);box-shadow:0 13px 30px rgba(0,0,0,.14)}
.solution-section{background:linear-gradient(135deg,#071421,#0b1d2d);padding:86px 0}.solution-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:76px;align-items:center}.solution-grid h2{font-size:clamp(2.2rem,4vw,3.7rem)}.benefit-list{display:grid;gap:14px}.benefit{display:grid;grid-template-columns:58px 1fr;gap:18px;padding:22px;border:1px solid rgba(255,255,255,.09);border-radius:20px;background:rgba(255,255,255,.035)}.benefit>span{width:48px;height:48px;border-radius:16px;display:grid;place-items:center;background:rgba(103,232,195,.12);color:var(--accent);font-weight:900}.benefit h3{margin:2px 0 6px}.benefit p{margin:0;color:var(--muted)}
.friendly-band{background:linear-gradient(90deg,rgba(103,232,195,.07),rgba(141,183,255,.055))}.friendly-band p{color:var(--muted);margin:0}
@media(max-width:1000px){.portfolio-grid{grid-template-columns:1fr 1fr}.portfolio-card:first-child{grid-column:1/-1}.solution-grid{grid-template-columns:1fr;gap:42px}}
@media(max-width:900px){.hero-visual{max-width:760px}.hero-home::after{height:18px}.hero-copy h1{max-width:760px}.portfolio-grid{grid-template-columns:1fr}.portfolio-card:first-child{grid-column:auto}}
@media(max-width:600px){.hero-home{padding-top:54px}.hero-copy h1{font-size:3rem}.hero-visual figcaption{position:static;border:0;border-radius:0;background:#101f31;padding:8px 12px}.portfolio-preview{height:210px}.service-card{padding:24px}}

/* =========================================================
   Startseite – Umsetzung des freigegebenen Gestaltungskonzepts
   ========================================================= */
.site-header{background:#07111f}
.header-inner{min-height:58px}
.brand{font-size:1.08rem}.brand-mark{width:29px;height:29px;border-radius:8px}
.main-nav{gap:24px}.main-nav a{font-size:.88rem}.main-nav .nav-cta{padding:8px 16px}

.hero-home.hero-compact{
  position:relative;
  min-height:398px;
  padding:0;
  background:#071321;
  overflow:hidden;
}
.hero-overlay-grid{position:relative;z-index:3;min-height:398px;display:flex;align-items:center}
.hero-home .hero-copy{width:52%;max-width:620px;padding:42px 0 66px}
.hero-home .hero-copy .eyebrow{font-size:.66rem;letter-spacing:.17em;margin-bottom:14px}
.hero-home .hero-copy h1{font-size:clamp(2.55rem,4.4vw,4.15rem);line-height:1.01;max-width:600px;margin:0 0 18px}
.hero-home .hero-copy p{font-size:1rem;line-height:1.48;max-width:550px;color:#d0d9e6;margin:0}
.hero-actions{margin-top:22px;gap:11px}.hero-actions .btn{min-height:39px;padding:0 17px;font-size:.86rem}
.hero-home .hero-visual-bg{
  position:absolute;
  z-index:1;
  top:0;right:0;bottom:0;
  width:57%;
  margin:0;
  border:0;
  border-radius:0;
  box-shadow:none;
  transform:none;
  overflow:hidden;
  background:#0b1725;
}
.hero-home .hero-visual-bg img{width:100%;height:100%;object-fit:cover;object-position:center center;display:block;aspect-ratio:auto}
.hero-home .hero-visual-bg::before{
  content:"";position:absolute;z-index:2;inset:0;
  background:linear-gradient(90deg,#071321 0%,rgba(7,19,33,.83) 8%,rgba(7,19,33,.24) 30%,rgba(7,19,33,0) 52%);
  pointer-events:none;
}
.hero-home .hero-visual-bg::after{content:"";position:absolute;z-index:2;inset:0;background:linear-gradient(180deg,rgba(4,10,18,.08),transparent 58%,rgba(4,10,18,.10));pointer-events:none;box-shadow:none}
.hero-home .hero-visual-bg figcaption{display:none}
.hero-home::after{display:none}
.hero-wave{position:absolute;z-index:4;left:-3%;right:-3%;bottom:-51px;height:82px;background:var(--paper);border-radius:50% 50% 0 0 / 58% 58% 0 0;transform:rotate(-.6deg);transform-origin:center bottom}

.services-section.services-compact{padding:34px 0 20px;background:var(--paper)}
.compact-intro{margin-bottom:18px}.compact-intro h2{font-size:1.72rem;letter-spacing:-.025em;margin:0 0 4px;color:#122440}.compact-intro p{font-size:.9rem;color:#69788b}
.compact-service-cards{max-width:980px;margin:0 auto;gap:16px}
.compact-service-card{display:grid;grid-template-columns:48px 1fr;gap:16px;align-items:start;padding:17px 20px;border-radius:16px;box-shadow:0 8px 28px rgba(23,37,58,.07)}
.compact-service-card .service-icon{width:44px;height:44px;border-radius:50%;margin:0;background:#c9f5e9}
.compact-service-card .service-icon svg{width:24px;height:24px}.compact-service-card h3{font-size:1rem;letter-spacing:-.02em;margin:2px 0 5px;color:#162941}.compact-service-card p{font-size:.81rem;line-height:1.35;margin:0 0 5px;color:#647184}.compact-service-card .link-arrow{font-size:.77rem;margin-top:2px}

.demo-gallery-section{padding:18px 0 28px;background:linear-gradient(180deg,#eef8f8,#f6fbfc);color:var(--ink)}
.gallery-intro{margin-bottom:14px}.gallery-intro h2{font-size:1.62rem;letter-spacing:-.025em;margin:0 0 3px;color:#122440}.gallery-intro p{font-size:.82rem;color:#69788b}
.demo-gallery-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:18px;align-items:start}
.demo-gallery-card{display:block;color:#17263b;text-decoration:none;min-width:0;text-align:left}
.demo-gallery-card img{display:block;width:100%;height:84px;object-fit:cover;border-radius:8px;border:1px solid #d6e1e7;box-shadow:0 5px 13px rgba(26,52,68,.12);transition:transform .18s ease,box-shadow .18s ease}
a.demo-gallery-card:hover img{transform:translateY(-3px);box-shadow:0 9px 20px rgba(26,52,68,.18)}
.demo-gallery-card strong{display:block;font-size:.76rem;line-height:1.25;margin-top:8px;color:#17263b}.demo-gallery-card span{display:block;font-size:.67rem;color:#667487;margin-top:2px}
.gallery-more{text-align:right;margin-top:7px}.gallery-more a{font-size:.76rem;font-weight:800;color:#0a8c79;text-decoration:none}

.solution-section.solution-compact{padding:35px 0 38px;background:#061522}.solution-strip{display:grid;grid-template-columns:1.55fr repeat(3,1fr);gap:28px;align-items:center}
.solution-heading .eyebrow{font-size:.62rem}.solution-heading h2{font-size:1.55rem;line-height:1.1;margin:10px 0 0;max-width:360px}
.solution-point{display:grid;grid-template-columns:38px 1fr;gap:12px;align-items:start}.solution-point-icon{font-size:1.55rem;color:var(--accent);line-height:1}.solution-point h3{font-size:.9rem;letter-spacing:-.02em;margin:0 0 5px}.solution-point p{font-size:.75rem;line-height:1.4;color:#b6c3d1;margin:0}

@media (min-width:1300px){
  .wrap{--max:1200px}
  .hero-home .hero-visual-bg{width:56%}
}
@media(max-width:1000px){
  .hero-home.hero-compact,.hero-overlay-grid{min-height:430px}
  .hero-home .hero-copy{width:57%;padding-left:0}
  .hero-home .hero-visual-bg{width:55%}
  .demo-gallery-grid{grid-template-columns:repeat(3,1fr)}
  .demo-gallery-card img{height:110px}
  .solution-strip{grid-template-columns:1fr 1fr}.solution-heading{grid-column:1/-1}
}
@media(max-width:760px){
  .header-inner{min-height:64px}.main-nav{top:64px}
  .hero-home.hero-compact{min-height:auto;padding-bottom:0}
  .hero-overlay-grid{min-height:0;display:block}
  .hero-home .hero-copy{width:100%;max-width:none;padding:52px 0 34px}
  .hero-home .hero-copy h1{font-size:clamp(2.7rem,12vw,4.2rem);max-width:650px}
  .hero-home .hero-copy p{max-width:580px}
  .hero-home .hero-visual-bg{position:relative;top:auto;right:auto;bottom:auto;width:100%;height:300px}
  .hero-home .hero-visual-bg::before{background:linear-gradient(180deg,#071321 0%,rgba(7,19,33,.28) 22%,transparent 48%)}
  .hero-wave{bottom:-45px}
  .services-section.services-compact{padding-top:47px}
  .compact-service-cards{grid-template-columns:1fr}
  .demo-gallery-grid{grid-template-columns:repeat(2,1fr)}
  .demo-gallery-card img{height:105px}
  .solution-strip{grid-template-columns:1fr}.solution-heading{grid-column:auto}
}
@media(max-width:470px){
  .hero-home .hero-visual-bg{height:235px}
  .demo-gallery-grid{grid-template-columns:1fr 1fr;gap:14px 11px}
  .demo-gallery-card img{height:84px}
}

/* =========================================================
   Mobile Hero Fix – 2026-08-29
   Auf kleinen Displays: Inhalt zuerst, Bild danach und ohne Beschnitt.
   ========================================================= */
@media(max-width:760px){
  .hero-home.hero-compact{
    display:flex;
    flex-direction:column;
    min-height:0;
    padding:0 0 46px;
    overflow:hidden;
  }
  .hero-home .hero-overlay-grid{
    order:1;
    width:100%;
  }
  .hero-home .hero-copy{
    width:100%;
    max-width:none;
    padding:38px 0 26px;
  }
  .hero-home .hero-copy .eyebrow{
    font-size:.62rem;
    line-height:1.45;
    margin-bottom:12px;
  }
  .hero-home .hero-copy h1{
    font-size:clamp(2.35rem,10.6vw,3.3rem);
    line-height:1.01;
    max-width:100%;
    margin-bottom:16px;
  }
  .hero-home .hero-copy p{
    font-size:.98rem;
    line-height:1.48;
  }
  .hero-actions{
    margin-top:20px;
  }
  .hero-home .hero-visual-bg{
    order:2;
    position:relative;
    inset:auto;
    width:min(calc(100% - 28px),720px);
    height:auto;
    margin:0 auto;
    border-radius:18px;
    border:1px solid rgba(255,255,255,.10);
    overflow:hidden;
    background:#0b1725;
    box-shadow:0 16px 42px rgba(0,0,0,.26);
  }
  .hero-home .hero-visual-bg img{
    display:block;
    width:100%;
    height:auto;
    aspect-ratio:801 / 397;
    object-fit:contain;
    object-position:center;
  }
  .hero-home .hero-visual-bg::before,
  .hero-home .hero-visual-bg::after{
    display:none;
  }
  .hero-wave{
    order:3;
    bottom:-48px;
  }
  .services-section.services-compact{
    padding-top:32px;
  }
}

@media(max-width:470px){
  .hero-home .hero-visual-bg{
    width:calc(100% - 28px);
    height:auto;
  }
  .hero-home .hero-copy h1{
    font-size:clamp(2.25rem,10.8vw,2.95rem);
  }
}

/* Release 2026-09 – zusätzliche Inhalts- und SEO-Komponenten */
.four-cards{grid-template-columns:repeat(4,1fr)}
.feature-list{display:grid;gap:12px;padding:0;list-style:none}.feature-list li{padding:15px 16px;border:1px solid #dce4ee;border-radius:14px;background:#fff;color:#344258}.feature-list li::before{content:"✓";color:#0a8c79;font-weight:900;margin-right:9px}
.example-hero{padding-bottom:58px}.example-showcase{display:grid;grid-template-columns:1.45fr .55fr;gap:44px;align-items:center}.example-screenshot{display:block;width:100%;height:auto;border-radius:22px;border:1px solid #d9e3ed;box-shadow:0 20px 55px rgba(25,45,70,.13);background:#fff}.mini-example-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.mini-example{display:block;text-decoration:none;border:1px solid var(--line);border-radius:18px;padding:12px;background:rgba(255,255,255,.025);overflow:hidden;transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease}.mini-example:hover{transform:translateY(-2px);border-color:#2cc7b51f;box-shadow:0 18px 36px rgba(0,0,0,.15)}.light .mini-example{background:#fff;border-color:#dfe6ef}.mini-example img{display:block;width:100%;height:auto;max-height:none;aspect-ratio:auto;object-fit:contain;object-position:center center;border-radius:12px;border:1px solid #d8e2ec;background:#f5f9fb}.mini-example span{display:block;padding:14px 4px 4px}.mini-example strong{display:block;font-size:1.08rem;line-height:1.35}.mini-example small{display:block;color:var(--muted);margin-top:6px}.light .mini-example small{color:#667489}
.portfolio-catalog{display:grid;grid-template-columns:1fr 1fr;gap:24px}.catalog-card{display:grid;grid-template-columns:1.08fr .92fr;gap:0;text-decoration:none;background:#fff;color:var(--ink);border:1px solid #dce5ee;border-radius:24px;overflow:hidden;box-shadow:0 14px 40px rgba(25,45,70,.07);transition:.2s ease;align-items:start}.catalog-card:hover{transform:translateY(-3px);box-shadow:0 20px 50px rgba(25,45,70,.12)}.catalog-card img{width:100%;height:auto;display:block;aspect-ratio:8/7;object-fit:contain;object-position:center center;background:#f5f8fb;padding:14px;border-right:1px solid #e6edf3}.catalog-card>div{padding:27px}.catalog-card small{color:#078370;text-transform:uppercase;letter-spacing:.08em;font-weight:850}.catalog-card h2{font-size:1.7rem;margin:8px 0 10px}.catalog-card p{color:#617084;font-size:.94rem}.catalog-card .link-arrow{color:#087d6c}
.process-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.process-grid article{background:#fff;border:1px solid #dfe6ef;border-radius:20px;padding:26px;box-shadow:0 10px 32px rgba(23,37,58,.06)}.process-grid span{display:grid;place-items:center;width:42px;height:42px;border-radius:50%;background:#dff9f2;color:#087665;font-weight:900;margin-bottom:24px}.process-grid h2{font-size:1.35rem;margin-bottom:9px}.process-grid p{color:#617084;margin:0}
.article-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}.article-card{background:#fff;border:1px solid #dce5ef;border-radius:22px;padding:27px;box-shadow:0 12px 38px rgba(25,45,70,.07)}.article-card small{color:#0a8371;text-transform:uppercase;letter-spacing:.08em;font-weight:850}.article-card h2{font-size:1.55rem;margin:10px 0 12px}.article-card p{color:#627085}.article-hero h1{max-width:1050px}.article-layout{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:50px}.article-prose{max-width:820px}.article-prose h2{margin-top:44px}.article-prose h2:first-child{margin-top:0}.article-toc{position:sticky;top:100px;height:max-content}.legal-content{max-width:900px}.form-privacy-note{color:var(--muted);font-size:.88rem;margin:18px 0 0}.form-privacy-note a{color:#fff}.footer-contact a{display:inline!important}.footer-grid{grid-template-columns:1.6fr 1fr 1fr 1fr}
.home-seo-section .prose p{color:#536176}.home-seo-section .sidebox{color:var(--ink);background:#fff;border-color:#dfe6ef}.home-seo-section .sidebox p{color:#647184}

@media(max-width:1050px){.four-cards{grid-template-columns:1fr 1fr}.example-showcase{grid-template-columns:1fr}.portfolio-catalog{grid-template-columns:1fr}.article-grid{grid-template-columns:1fr 1fr}.footer-grid{grid-template-columns:1.5fr 1fr 1fr}.footer-grid>div:last-child{grid-column:2/4}}
@media(max-width:900px){.mini-example-grid,.process-grid,.article-layout{grid-template-columns:1fr}.article-toc{position:static}.catalog-card{grid-template-columns:1fr}.catalog-card img{min-height:0;aspect-ratio:16/10}.footer-grid{grid-template-columns:1fr 1fr}.footer-grid>div:last-child{grid-column:auto}}
@media(max-width:620px){.four-cards,.article-grid{grid-template-columns:1fr}.mini-example span{padding:12px 2px 2px}.footer-grid{grid-template-columns:1fr}}

.article-date{margin-top:16px;color:var(--muted);font-size:.9rem}

/* Startseite: Website- und Webapp-Beispiele – 2026-09-04 */
.demo-gallery-group{margin-top:16px}
.demo-gallery-group-head{display:flex;align-items:flex-end;justify-content:space-between;gap:18px;margin:0 0 10px}
.demo-gallery-group-head h3{font-size:.92rem;line-height:1.2;letter-spacing:-.02em;margin:0;color:#17263b}
.demo-gallery-group-head p{font-size:.72rem;line-height:1.4;color:#69788b;margin:3px 0 0}
.webapp-gallery-group{margin-top:22px;padding-top:19px;border-top:1px solid #d8e6ea}
.webapp-gallery-card img{object-fit:contain;background:#0b1a2c;padding:2px}
.gallery-all-links{display:flex;justify-content:flex-end;align-items:center;gap:18px;flex-wrap:wrap;margin-top:10px}
.gallery-all-links a{font-size:.76rem;font-weight:800;color:#0a8c79;text-decoration:none}
.gallery-all-links a:hover,.gallery-all-links a:focus{text-decoration:underline}
@media(max-width:760px){.demo-gallery-group-head{align-items:flex-start}.gallery-all-links{justify-content:flex-start;gap:10px 18px}.webapp-gallery-group{margin-top:20px;padding-top:17px}}