/* 0.35.1 – Hinweis auf die native Sheshi-App: ruhiges Band auf der Startseite (Entwurf A, Platzierung P4 vom 14.09.2026) und eine Zeile im Footer. */

body.sheshi-home .sheshi-home-app {
  padding: 52px 0 !important;
  border-top: 1px solid var(--border) !important;
  border-bottom: 1px solid var(--border) !important;
  background: var(--surface-page) !important;
}

/* Dieselbe Spaltenachse wie die beiden Nachbarbaender (ui-0317): die rechte
   Spalte beginnt dort, wo auch die Schritte des Vorschlagsbandes und die
   Haken des Schlussabschnitts beginnen. */
body.sheshi-home .sheshi-home-app-inner {
  display: grid !important;
  grid-template-columns: minmax(0, 1.05fr) minmax(300px, .95fr) !important;
  gap: 24px 72px !important;
  align-items: center !important;
}

body.sheshi-home .sheshi-home-app h2 {
  margin: 0 !important;
  color: var(--text-primary) !important;
  font-family: var(--sheshi-font) !important;
  font-size: clamp(26px, 2.6vw, 38px) !important;
  font-weight: 790 !important;
  letter-spacing: -0.04em !important;
  line-height: 1.08 !important;
}

body.sheshi-home .sheshi-home-app-copy p {
  margin: 13px 0 0 !important;
  color: var(--text-secondary) !important;
  font-size: 16px !important;
  line-height: 1.55 !important;
}

body.sheshi-home .sheshi-home-app-actions {
  display: grid !important;
  justify-items: start !important;
  gap: 16px !important;
}

/* Offizielles Apple-Badge, unveraendert. Apple verlangt mindestens 40 px Hoehe
   und ringsum einen Freiraum von einem Viertel der Hoehe; 48 px Hoehe bedeuten
   also mindestens 12 px Abstand, den das Raster unten mit 16 px einhaelt. */
body.sheshi-home .sheshi-home-app-badge {
  display: inline-flex !important;
  align-items: center !important;
  padding: 0 !important;
  border: 0 !important;
  background: none !important;
  line-height: 0 !important;
  text-decoration: none !important;
}

body.sheshi-home .sheshi-home-app-badge:focus-visible {
  outline: 2px solid var(--focus) !important;
  outline-offset: 4px !important;
}

body.sheshi-home .sheshi-app-store-badge {
  display: block !important;
  /* Das Artwork misst 119,66407 x 40. Ohne dieses Verhaeltnis leitet der
     Browser es aus den width-/height-Attributen ab und zieht das Badge um
     0,3 Prozent in die Breite; Apple untersagt jede Aenderung am Artwork. */
  aspect-ratio: 119.66407 / 40 !important;
  width: auto !important;
  height: 48px !important;
  max-width: 100% !important;
}

body.sheshi-home .sheshi-home-app-soon {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  color: var(--text-muted) !important;
  font-size: 14px !important;
  line-height: 1.4 !important;
}

body.sheshi-home .sheshi-home-app-soon i {
  width: 7px;
  height: 7px;
  flex: 0 0 7px;
  border: 1px solid var(--border-strong);
  border-radius: 999px;
  background: var(--surface-sunken);
}

body.sheshi-home .sheshi-home-app-soon strong {
  color: var(--text-secondary);
  font-weight: 650;
}

@media (max-width: 1023px) {
  body.sheshi-home .sheshi-home-app-inner {
    column-gap: 44px !important;
  }
}

@media (max-width: 767px) {
  body.sheshi-home .sheshi-home-app {
    padding: 38px 0 !important;
  }

  body.sheshi-home .sheshi-home-app-inner {
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 26px !important;
  }
}

/* Footer: dieselbe Aussage als eine Zeile, auf jeder Seite. */

.sheshi-site-footer .sheshi-footer-app {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 8px 14px !important;
  align-items: center !important;
  max-width: 390px !important;
  margin: 20px 0 0 !important;
}

.sheshi-site-footer .sheshi-footer-app a {
  display: inline-flex !important;
  min-height: 40px !important;
  align-items: center !important;
  padding: 0 14px !important;
  border: 1px solid var(--dark-border-strong) !important;
  border-radius: 8px !important;
  font-size: 14px !important;
  line-height: 1.3 !important;
  text-decoration: none !important;
}

.sheshi-site-footer .sheshi-footer-brand-column p.sheshi-footer-app a,
.sheshi-site-footer .sheshi-footer-brand-column p.sheshi-footer-app a span {
  color: var(--dark-text-primary) !important;
}

.sheshi-site-footer .sheshi-footer-app a:hover,
.sheshi-site-footer .sheshi-footer-app a:focus-visible {
  border-color: var(--dark-text-secondary) !important;
  text-decoration: underline !important;
  text-underline-offset: 4px !important;
}

.sheshi-site-footer .sheshi-footer-app-soon {
  color: var(--dark-text-muted) !important;
  font-size: 13px !important;
  line-height: 1.4 !important;
}