/* Startseite 4.4 – Struktur nach Freigabe. Gestaltung bleibt die der Originalseite; hier nur Fluss, Breite und neue Bausteine. */

/* ---------- Halle fliesst durchgehend: gedimmt statt abgeschaltet ---------- */
html.r44.sw-live.n30-stage-off .sw-stage { opacity: .3 !important; }
html.r44.sw-live main > section, html.r44.sw-live main > header { background-color: transparent !important; }

/* ---------- Gleiche zentrierte Inhaltsbreite, auch auf breiten Bildschirmen ---------- */
/* Die Halle steht fest dahinter und die Abschnitte sind durchsichtig: deshalb genuegt eine zentrierte Hauptspalte */
@media (min-width: 1600px) { html.r44 main { max-width: 1640px; margin-left: auto; margin-right: auto; } }
html.r44 .n30-hero .hero-copy { max-width: none !important; }
html.r44 .n30-hero h1 { max-width: none !important; }
html.r44 .n30-hero .v3-lead, html.r44 .n30-hero .hero-note { max-width: 62em !important; }
html.r44 .r43-diffs li { white-space: nowrap; }
html.r44 .n30-proof__head, html.r44 #nimbus-it .section-heading { max-width: 1100px !important; }
html.r44 .n30-people .team-ed__lead, html.r44 .n30-people .n30-people__copy { max-width: none !important; }
html.r44 .n30-people .team-ed__lead h2 { font-size: clamp(34px, 2.6vw, 48px) !important; max-width: none !important; text-wrap: balance; }
html.r44 main h2 { text-wrap: balance; }

/* ---------- Einstieg ---------- */
.r44-fit { margin-top: 10px !important; }
.r44-say { display: block; margin: 6px 0 2px; font-size: 13.5px; line-height: 1.4; font-style: italic; color: #cfe0e7; }
.r44-say[hidden] { display: none; }

/* ---------- Perspektive jederzeit wechselbar ---------- */
.r44-persp { position: fixed; left: 18px; bottom: 18px; z-index: 60; display: flex; align-items: center; gap: 6px; padding: 6px 6px 6px 14px; border-radius: 999px;
  background: rgba(3, 13, 21, .92); border: 1px solid rgba(53, 212, 255, .28); box-shadow: 0 16px 40px rgba(0, 0, 0, .5);
  transform: translateY(140%); opacity: 0; pointer-events: none; transition: transform .35s cubic-bezier(.2, .75, .15, 1), opacity .25s; }
html.r44-past-hero .r44-persp { transform: none; opacity: 1; pointer-events: auto; }
.r44-persp span { font-size: 13px; color: #a9c1cb; margin-right: 4px; white-space: nowrap; }
.r44-persp button { font: inherit; font-size: 13.5px; font-weight: 600; min-height: 36px; padding: 0 14px; border-radius: 999px; border: 1px solid transparent; background: none; color: #eef6f8; cursor: pointer; white-space: nowrap; }
.r44-persp button:hover { border-color: rgba(53, 212, 255, .5); }
.r44-persp button[aria-pressed="true"] { background: linear-gradient(120deg, #35d4ff, #2d8dff); color: #021018; }
.r44-persp button:focus-visible { outline: 2px solid #35d4ff; outline-offset: 2px; }
@media (max-width: 899px) {
  .r44-persp { left: 50%; transform: translate(-50%, 140%); bottom: 82px; padding: 4px; max-width: calc(100vw - 24px); }
  html.r44-past-hero .r44-persp { transform: translate(-50%, 0); }
  .r44-persp span { display: none; }
  .r44-persp button { padding: 0 10px; font-size: 12.5px; }
}

/* ---------- Erstgespraech an den Entscheidungsstellen ---------- */
.r44-cta { display: flex; align-items: center; justify-content: space-between; gap: 18px 28px; flex-wrap: wrap; margin: 48px auto 0; padding: 20px 26px; max-width: 1180px;
  border-radius: 20px; background: rgba(3, 13, 21, .86); border: 1px solid rgba(53, 212, 255, .22); position: relative; z-index: 2; }
.r44-cta p { margin: 0; flex: 1 1 360px; font-size: 16px; line-height: 1.5; color: #d3e3e9; }
.r44-cta--ablauf { margin: 0 auto 6vh; }
.r44-cta-wrap { position: relative; padding: 0 6vw; }

/* ---------- So arbeiten wir: wie es weitergeht ---------- */
.r44-next { display: inline-flex; align-items: center; gap: 8px; margin-top: 22px; padding: 10px 16px; border-radius: 999px; border: 1px solid rgba(53, 212, 255, .35);
  background: rgba(3, 13, 21, .7); color: #eef6f8; font-size: 14.5px; font-weight: 600; text-decoration: none; }
.r44-next::after { content: "↓"; color: #35d4ff; }
.r44-next:hover { border-color: #35d4ff; }

/* ---------- Partner als eigener Abschnitt ---------- */
.r44-partner { position: relative; padding: 12vh var(--n-pad) 8vh; }

/* ---------- Nimbus als Banner ---------- */
.r44-nimbus { position: relative; padding: 8vh var(--n-pad); }
.r44-nimbus__in { display: flex; align-items: center; justify-content: space-between; gap: 24px 40px; flex-wrap: wrap; max-width: 1180px; margin: 0 auto; padding: 30px 34px;
  border-radius: 24px; background: linear-gradient(135deg, rgba(3, 13, 21, .92), rgba(10, 30, 46, .88)); border: 1px solid rgba(53, 212, 255, .3); }
.r44-nimbus__copy { flex: 1 1 520px; }
.r44-nimbus__copy h2 { margin: 4px 0 6px; font-size: clamp(30px, 2.6vw, 42px); }
.r44-nimbus__copy .one67-home-lead { margin: 10px 0 0; max-width: 60em; color: #d3e3e9; }
.r44-nimbus__go { flex: none; }

/* ---------- Owner-Rueckmeldung 4.4 ---------- */
/* Keine Dopplung unter den Wegkarten: „Ihr Weg“ liegt ausserhalb des Seitenflusses und erscheint erst nach dem Einstieg,
   mitlaufend oben mittig, solange „Wie wir Sie unterstuetzen“ im Bild ist (Owner 30.10.) */
html.r44.v3-hall .v3-solve__bar { position: fixed !important; top: 92px !important; left: 50%; z-index: 55; display: flex !important; flex-wrap: wrap; align-items: center; gap: 6px 14px; padding: 8px 14px !important;
  width: max-content; max-width: calc(100vw - 24px); border-radius: 999px !important; background: rgba(2, 11, 18, .9) !important; box-shadow: 0 14px 34px rgba(0, 0, 0, .4);
  transform: translate(-50%, -14px); opacity: 0; visibility: hidden; pointer-events: none; transition: opacity .25s ease, transform .25s ease, visibility 0s linear .25s; }
html.r44.v3-hall.r44-solve-on .v3-solve__bar { transform: translate(-50%, 0); opacity: 1; visibility: visible; pointer-events: auto; transition: opacity .25s ease, transform .25s ease, visibility 0s; }
@media (max-width: 899px) { html.r44.v3-hall .v3-solve__bar { top: 80px !important; padding: 4px !important; gap: 2px 4px !important; flex-wrap: nowrap !important; border-radius: 16px !important; } html.r44.v3-hall .v3-solve__q { display: none; }
  html.r44.v3-hall .v3-solve__tabs { flex-wrap: nowrap !important; gap: 2px !important; min-width: 0; overflow-x: auto; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
  html.r44.v3-hall .v3-solve__tabs::-webkit-scrollbar { display: none; }
  html.r44.v3-hall .v3-solve__tab b { display: none; } html.r44.v3-hall .r44-short { display: inline; font-weight: 600; } }
.r44-short { display: none; }
@media (prefers-reduced-motion: reduce) { html.r44.v3-hall .v3-solve__bar { transition: none !important; } }
html.r44.v3-hall .v3-solve__q { margin: 0; font-size: 13px; letter-spacing: .1em; }
html.r44.v3-hall .v3-solve__tabs { display: flex !important; flex-wrap: wrap; gap: 4px 10px; grid-template-columns: none !important; }
html.r44.v3-hall .v3-solve__tab { min-height: 36px !important; padding: 4px 12px !important; border-radius: 999px !important; width: auto !important; }
html.r44.v3-hall .v3-solve__tab .v3-solve__tabicon, html.r44.v3-hall .v3-solve__tab em { display: none !important; }
html.r44.v3-hall .v3-solve__tab:not([aria-selected="true"]) { background: none !important; border-color: transparent !important; opacity: .75; }
html.r44.v3-hall .v3-solve__tab:not([aria-selected="true"]) b { font-weight: 500; text-decoration: underline; text-decoration-color: rgba(53, 212, 255, .5); text-underline-offset: 4px; }
/* Vorgehen je Weg: gleiche Icon-Kacheln wie bei „Interne IT ergaenzen“ */
html.r44.v3-hall .v3-method .v3-share__i { width: 40px; height: 40px; border-radius: 12px; }
html.r44.v3-hall .v3-method .v3-acc__btn { gap: 14px; }
/* Referenzen: vier gleich aufgebaute Karten, die Ausgangslage als Einstieg hervorgehoben */
.r44-cases { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px; margin-top: 28px; }
.r44-cases .case-card { margin: 0 !important; height: 100%; }
html.n30 .r44-cases .n30-case-facts { max-width: none; margin: 4px 0 14px; }
html.n30 .r44-cases .n30-case-facts > div { grid-template-columns: 1fr; gap: 2px; }
html.n30 .r44-cases .n30-case-facts > div:first-child { order: -1; margin-bottom: 8px; }
html.n30 .r44-cases .n30-case-facts > div:first-child dd { font-size: 19px; line-height: 1.35; font-weight: 700; color: #fff; }
@media (max-width: 899px) { .r44-cases { grid-template-columns: 1fr; } }
html.r44.v3-hall .v3-solve__tab, html.r44.v3-hall .v3-solve__tab b, html.r44.v3-hall .v3-solve__q { white-space: nowrap; }
html.r44.v3-hall .v3-solve__tablabel { display: block; }
html.r44.v3-hall .v3-solve__tab { display: inline-flex !important; flex: none !important; min-width: 0 !important; max-width: none !important; grid-template-columns: none !important; overflow: visible !important; }
html.r44.v3-hall .v3-solve__tablabel { overflow: visible !important; max-width: none !important; width: auto !important; }
html.r44 .n30-proc__svg, html.r44 .n30-proc__num { display: none !important; }   /* 4.4: keine Zeichnung ueber der Halle (Owner 30.10.) */
/* Fusszeile wie auf den Unterseiten (deckend), die Perspektiv-Leiste weicht ihr aus */
html.r44 footer.footer { background: #020b12 !important; position: relative; z-index: 3; }
html.r44.r44-at-foot .r44-persp, html.r44.r44-in-proc .r44-persp { transform: translateY(140%) !important; opacity: 0 !important; pointer-events: none !important; }
/* Handy: Wegwahl kompakt (am Dateiende, damit die allgemeinen Reiter-Regeln oben sie nicht ueberschreiben) */
@media (max-width: 899px) { html.r44.v3-hall .v3-solve__tab { min-height: 40px !important; padding: 2px 12px !important; font-size: 15px; }   /* Owner 31.10.: auf dem iPhone zu klein */
  html.r44.v3-hall .r44-short { font-size: 15px; }
  .r44-persp { gap: 2px; overflow-x: auto; scrollbar-width: none; } .r44-persp::-webkit-scrollbar { display: none; } .r44-persp button { flex: none; font-size: 13.5px; min-height: 40px; padding: 0 8px; }
  html.r44.v3-hall .v3-solve__tab:not([aria-selected="true"]) .r44-short { text-decoration: underline; text-decoration-color: rgba(53, 212, 255, .5); text-underline-offset: 4px; font-weight: 500; } }
