:root{--background:#f5f7f9;--surface:#fff;--surface-alt:#edf2f5;--text:#18232d;--text-muted:#64727f;--primary:#245b78;--primary-dark:#18445d;--border:#dce3e8;--warning-bg:#fff0d5;--warning-text:#865800;--footer:#18232d;--footer-text:#dce5eb;--radius:18px;--radius-small:10px;--shadow:0 12px 34px rgba(24,35,45,.08);--max-width:1180px}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;color:var(--text);background:var(--background);line-height:1.65}a{color:var(--primary)}a:hover{color:var(--primary-dark)}.wrap{width:min(calc(100% - 40px),var(--max-width));margin:0 auto}.site-header{position:sticky;top:0;z-index:100;background:rgba(255,255,255,.96);border-bottom:1px solid var(--border);backdrop-filter:blur(12px)}.header-inner{min-height:78px;display:flex;align-items:center;justify-content:space-between;gap:30px}.logo{font-size:1.35rem;font-weight:800;color:var(--text);text-decoration:none}.main-nav{display:flex;align-items:center;flex-wrap:wrap;gap:26px}.main-nav a{color:var(--text-muted);text-decoration:none;font-size:.95rem;font-weight:600}.hero{padding:78px 0 82px;background:linear-gradient(135deg,#f7f9fb 0%,#edf3f6 100%);border-bottom:1px solid var(--border)}.hero-inner{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(380px,.85fr);gap:72px;align-items:center}.hero-content{max-width:720px}.eyebrow{margin:0 0 14px;color:var(--primary);font-size:.78rem;font-weight:800;text-transform:uppercase;letter-spacing:.16em}.hero h1,.app-hero h1{margin:0;max-width:760px;font-size:clamp(3rem,5vw,4.8rem);line-height:1.02;letter-spacing:-.04em}.hero-text,.app-lead{max-width:680px;margin:26px 0 0;font-size:1.18rem;line-height:1.6;color:var(--text-muted)}.hero-buttons{display:flex;flex-wrap:wrap;gap:14px;margin-top:30px}.hero-projects{display:flex;flex-direction:column;gap:16px}.hero-project-card{display:grid;grid-template-columns:56px 1fr;gap:18px;align-items:center;padding:22px 24px;background:rgba(255,255,255,.92);border:1px solid var(--border);border-radius:16px;box-shadow:0 8px 25px rgba(24,35,45,.055);text-decoration:none;color:inherit}.hero-project-icon{width:52px;height:52px;display:flex;align-items:center;justify-content:center;border-radius:13px;background:var(--primary);color:#fff;font-size:1.25rem;font-weight:800}.hero-project-label{display:block;margin-bottom:3px;color:var(--primary);font-size:.72rem;font-weight:800;text-transform:uppercase;letter-spacing:.1em}.hero-project-card h3{margin:0 0 4px;font-size:1.18rem}.hero-project-card p{margin:0;color:var(--text-muted);font-size:.92rem;line-height:1.45}.section{padding:96px 0;background:var(--surface)}.section.alt{background:var(--surface-alt)}.section-heading{max-width:760px;margin-bottom:48px}.section-heading h2,.section h2{margin-top:0;font-size:clamp(2.2rem,5vw,3.4rem);line-height:1.08;letter-spacing:-.025em}.section-heading>p:last-child{margin-bottom:0;color:var(--text-muted);font-size:1.06rem}.button{display:inline-flex;align-items:center;justify-content:center;min-height:46px;padding:11px 19px;border:1px solid var(--primary);border-radius:var(--radius-small);color:var(--primary);background:var(--surface);text-decoration:none;font-weight:700}.button.primary{color:#fff;background:var(--primary)}.button.disabled{cursor:not-allowed;color:#8a969f;background:#f1f3f5;border-color:#c8d0d6}.large-button{min-height:52px;padding:14px 24px}.cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}.card{display:flex;flex-direction:column;min-height:305px;padding:30px;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:0 5px 18px rgba(24,35,45,.035)}.featured-card{border-color:#bed1dc;background:linear-gradient(180deg,#fff,#f8fbfc)}.card-topline{margin-bottom:12px;color:var(--primary);font-size:.76rem;font-weight:800;text-transform:uppercase;letter-spacing:.08em}.card h3{margin:0 0 14px;font-size:1.45rem}.card p{color:var(--text-muted)}.soft-status{font-size:.7rem;font-weight:700;color:var(--warning-text);background:var(--warning-bg);padding:4px 8px;border-radius:999px;vertical-align:middle;white-space:nowrap}.card-actions{margin-top:auto;display:flex;flex-wrap:wrap;align-items:center;gap:12px}.text-link{font-size:.9rem;font-weight:600}.notice{position:relative;margin-top:34px;padding:24px 28px 24px 34px;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-small);color:var(--text-muted)}.notice::before{content:"";position:absolute;top:0;bottom:0;left:0;width:6px;background:var(--primary);border-radius:var(--radius-small) 0 0 var(--radius-small)}.notice strong{color:var(--text)}.data-overview{display:grid;gap:16px}.data-card{display:grid;grid-template-columns:minmax(220px,.8fr) minmax(0,2fr);gap:30px;align-items:center;padding:24px 28px;background:var(--surface);border:1px solid var(--border);border-radius:16px}.data-card-title h3{margin:0;font-size:1.2rem}.data-status-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.data-status{display:flex;flex-direction:column;gap:7px}.data-label{color:var(--text-muted);font-size:.78rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em}.data-badge{display:inline-flex;align-items:center;justify-content:center;width:fit-content;min-width:54px;padding:5px 12px;border-radius:999px;font-size:.82rem;font-weight:800}.data-badge.yes{color:#23633b;background:#e5f4e9;border:1px solid #c6e6cf}.data-badge.no{color:#69747d;background:#f0f2f4;border:1px solid #d8dee3}.pending-badge{color:#76551a;background:#fff3dc;border:1px solid #ecd19a}.data-card.pending .data-status-grid{grid-template-columns:1fr}.split{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(300px,.65fr);gap:80px;align-items:center}.split>div:first-child p{max-width:760px;color:var(--text-muted)}.status{display:inline-flex;align-items:center;margin:2px 0 20px;padding:6px 13px;border-radius:999px;font-size:.78rem;font-weight:800}.status.building{color:var(--warning-text);background:var(--warning-bg)}.project-box,.quote-box,.app-badge-panel{padding:38px;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow)}.project-label{margin:0 0 8px;color:var(--primary);font-size:.78rem;font-weight:800;text-transform:uppercase;letter-spacing:.12em}.quote-box p{margin:0;color:var(--text);font-size:2rem;font-weight:800;line-height:1.25}.quote-box small{display:block;margin-top:24px;color:var(--text-muted)}.legal-wrap{max-width:900px}.legal h3{margin-top:44px;margin-bottom:12px;font-size:1.35rem}.legal p{color:#4b5965}.legal-links{display:flex;flex-wrap:wrap;gap:14px;margin:22px 0 32px}.app-hero{padding:86px 0;background:radial-gradient(circle at 85% 25%,rgba(36,91,120,.12),transparent 34%),linear-gradient(135deg,#f7f9fb 0%,#edf3f6 100%);border-bottom:1px solid var(--border)}.app-hero-inner{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(300px,.75fr);gap:70px;align-items:center}.app-badge-icon{width:66px;height:66px;margin-bottom:24px;display:flex;align-items:center;justify-content:center;border-radius:16px;background:var(--primary);color:#fff;font-size:1.6rem;font-weight:800}.content-narrow{max-width:900px}.content-narrow>p{color:var(--text-muted);font-size:1.04rem}.info-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin-top:38px}.info-box{padding:26px;background:var(--surface);border:1px solid var(--border);border-radius:15px}.info-kicker{display:block;margin-bottom:6px;color:var(--primary);font-size:.72rem;font-weight:800;text-transform:uppercase;letter-spacing:.08em}.info-box h3{margin:0 0 10px}.info-box p{margin:0;color:var(--text-muted)}.site-footer{padding:34px 0;color:var(--footer-text);background:var(--footer)}.footer-inner{display:flex;justify-content:space-between;align-items:center;gap:30px}.footer-links{display:flex;flex-wrap:wrap;gap:22px}.footer-links a{color:var(--footer-text);text-decoration:none;font-size:.92rem}@media(max-width:1000px){.hero-inner,.split,.app-hero-inner{grid-template-columns:1fr;gap:42px}.cards{grid-template-columns:repeat(2,minmax(0,1fr))}.info-grid{grid-template-columns:1fr}}@media(max-width:760px){.wrap{width:min(calc(100% - 28px),var(--max-width))}.site-header{position:relative}.header-inner{padding:18px 0;align-items:flex-start;flex-direction:column;gap:14px}.main-nav{width:100%;gap:8px 18px}.hero,.app-hero{padding:58px 0 62px}.hero h1,.app-hero h1{font-size:3rem}.cards{grid-template-columns:1fr}.data-card{grid-template-columns:1fr;gap:18px}.data-status-grid{grid-template-columns:1fr}.data-status{flex-direction:row;align-items:center;justify-content:space-between;gap:15px;padding:10px 0;border-bottom:1px solid var(--border)}.section{padding:72px 0}.footer-inner{align-items:flex-start;flex-direction:column}}@media(max-width:480px){.hero h1,.app-hero h1{font-size:2.55rem}.hero-buttons,.card-actions{flex-direction:column;align-items:stretch}.hero-buttons .button,.card-actions .button{width:100%}.hero-project-card{grid-template-columns:1fr}.card{padding:24px}}


.available-card {
  border-color: #b9d8c4;
  background: linear-gradient(180deg, #ffffff 0%, #f7fcf8 100%);
}

.available-topline {
  color: #23633b;
}


/* =========================================================
   APP-SEITEN – BEREINIGTER HERO
   ========================================================= */

.app-hero {
  padding: 68px 0 72px;
}

.app-hero-inner {
  display: block;
}

.app-hero-inner > div:first-child {
  max-width: 900px;
}

.app-badge-panel {
  display: none !important;
}


/* =========================================================
   VERSION
   ========================================================= */

.app-meta-strip {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
  margin: 28px 0 8px;
}

.app-meta-item {
  padding: 16px 18px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 12px;
}

.app-meta-label {
  display: block;
  margin-bottom: 4px;
  color: var(--text-muted);
  font-size: 0.74rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.07em;
}

.app-meta-value {
  font-weight: 800;
  color: var(--text);
}


/* =========================================================
   SCREENSHOT-GALERIE
   ========================================================= */

.screenshot-gallery {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 22px;
  margin-top: 30px;
  align-items: start;
}

.screenshot-card {
  margin: 0;
  min-height: 0;
  overflow: hidden;
  background: transparent;
  border: 0;
  border-radius: 18px;
  box-shadow: 0 8px 24px rgba(24, 35, 45, 0.08);
}

.screenshot-card img {
  display: block;
  width: 100%;
  height: auto;
  min-height: 0;
  max-height: 620px;
  object-fit: contain;
  background: #ffffff;
}

.screenshot-placeholder {
  display: none !important;
}

.screenshot-card.missing {
  display: none !important;
}


/* =========================================================
   BEWERTUNG / KRITIK / ANREGUNG
   ========================================================= */

.feedback-box {
  margin-top: 30px;
  padding: 30px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  box-shadow: 0 8px 24px rgba(24, 35, 45, 0.05);
}

.feedback-form {
  display: grid;
  gap: 22px;
}

.feedback-field {
  display: grid;
  gap: 8px;
}

.feedback-field label,
.feedback-label {
  font-weight: 800;
  color: var(--text);
}

.feedback-help {
  margin: 0;
  color: var(--text-muted);
  font-size: 0.9rem;
}

.feedback-select,
.feedback-textarea {
  width: 100%;
  padding: 12px 14px;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: #ffffff;
  color: var(--text);
  font: inherit;
}

.feedback-textarea {
  min-height: 150px;
  resize: vertical;
}

.feedback-select:focus,
.feedback-textarea:focus {
  outline: 2px solid rgba(36, 91, 120, 0.18);
  border-color: var(--primary);
}

.rating-group {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.rating-option {
  position: relative;
}

.rating-option input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.rating-option span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 58px;
  min-height: 44px;
  padding: 8px 12px;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: #ffffff;
  color: var(--text);
  font-weight: 800;
  cursor: pointer;
  transition: 0.15s ease;
}

.rating-option input:checked + span {
  color: #ffffff;
  background: var(--primary);
  border-color: var(--primary);
}

.rating-option input:focus-visible + span {
  outline: 3px solid rgba(36, 91, 120, 0.22);
}

.feedback-submit {
  justify-self: start;
}

.feedback-privacy {
  margin: 0;
  color: var(--text-muted);
  font-size: 0.88rem;
}

.feedback-honeypot {
  position: absolute !important;
  left: -10000px !important;
  width: 1px !important;
  height: 1px !important;
  overflow: hidden !important;
}

.feedback-success {
  display: none;
  margin-bottom: 22px;
  padding: 16px 18px;
  border: 1px solid #c6e6cf;
  border-radius: 10px;
  background: #e5f4e9;
  color: #23633b;
  font-weight: 700;
}

.feedback-success.show {
  display: block;
}


/* =========================================================
   RESPONSIVE ERGÄNZUNGEN
   ========================================================= */

@media (max-width: 1000px) {
  .screenshot-gallery {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 760px) {
  .app-hero {
    padding: 52px 0 56px;
  }

  .app-meta-strip {
    grid-template-columns: 1fr;
  }

  .screenshot-gallery {
    display: flex;
    gap: 16px;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    padding-bottom: 8px;
  }

  .screenshot-card {
    flex: 0 0 82%;
    scroll-snap-align: start;
  }

  .screenshot-card img {
    max-height: 520px;
  }

  .feedback-box {
    padding: 22px;
  }

  .feedback-submit {
    width: 100%;
  }
}


/* =========================================================
   VERSION-BADGE NEBEN APP-NAME
   ========================================================= */

.app-title {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 14px;
}

.version-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 6px 11px;
  border: 1px solid #bfd0da;
  border-radius: 999px;
  background: #ffffff;
  color: var(--primary);
  font-size: 0.9rem;
  font-weight: 800;
  letter-spacing: 0.02em;
  line-height: 1;
  white-space: nowrap;
  box-shadow: 0 4px 12px rgba(24, 35, 45, 0.05);
}

.upload-grid {
  display: grid;
  gap: 16px;
  margin-top: 28px;
}

.upload-card {
  padding: 22px 24px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 14px;
}

.upload-card h3 {
  margin: 0 0 8px;
}

.upload-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 18px;
  margin-bottom: 16px;
  color: var(--text-muted);
  font-size: 0.92rem;
}

.upload-form {
  display: grid;
  gap: 14px;
}

.upload-file {
  width: 100%;
  padding: 12px;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: #ffffff;
}

.upload-message {
  margin: 22px 0;
  padding: 16px 18px;
  border-radius: 10px;
  border: 1px solid #c6e6cf;
  background: #e5f4e9;
  color: #23633b;
  font-weight: 700;
}

.upload-error {
  margin: 22px 0;
  padding: 16px 18px;
  border-radius: 10px;
  border: 1px solid #efcaca;
  background: #fff0f0;
  color: #8a2b2b;
  font-weight: 700;
}

@media (max-width: 760px) {
  .app-title {
    gap: 10px;
  }

  .version-badge {
    font-size: 0.82rem;
  }
}