/* =========================================================
   GAOS – Markenfarben
   PLATZHALTER: hier die Farben aus dem Logo eintragen.
   ========================================================= */
:root {
  --gaos-bg:        #0b0b0f;   /* Hintergrund dunkel */
  --gaos-bg-alt:    #121218;   /* Abschnitt alternierend */
  --gaos-card:      #17171f;   /* Karten */
  --gaos-line:      #26262f;   /* Linien/Rahmen */
  --gaos-text:      #f4f4f6;   /* Haupttext */
  --gaos-muted:     #9a9aa8;   /* Nebentext */
  --gaos-accent:    #3d7bff;   /* Markenfarbe 1 (Logo) */
  --gaos-accent-2:  #7aa5ff;   /* Markenfarbe 2 (Logo) */
  --gaos-on-accent: #ffffff;   /* Text auf Button */

  /* System-Schriften: keine Google-Fonts-Anfrage (DSGVO) */
  --gaos-font: "Inter", "Segoe UI", system-ui, -apple-system, Roboto, Helvetica, Arial, sans-serif;
}

html { scroll-behavior: smooth; scroll-padding-top: 80px; }
body {
  background: var(--gaos-bg);
  color: var(--gaos-text);
  font-family: var(--gaos-font);
  -webkit-font-smoothing: antialiased;
}
a { color: var(--gaos-accent-2); text-decoration: none; }
a:hover { color: var(--gaos-text); }

/* ---------- Navigation ---------- */
.gaos-nav {
  background: rgba(11, 11, 15, .8);
  backdrop-filter: blur(12px);
  border-bottom: 1px solid var(--gaos-line);
  padding: .9rem 0;
}
.gaos-logo { font-weight: 800; font-size: 1.5rem; letter-spacing: .08em; color: var(--gaos-text); }
.gaos-nav .navbar-brand:hover { color: var(--gaos-text); }
.gaos-nav .nav-link { color: var(--gaos-muted); font-weight: 500; }
.gaos-nav .nav-link:hover { color: var(--gaos-text); }
.navbar-toggler { border: 0; box-shadow: none !important; padding: .5rem; }
.gaos-burger, .gaos-burger::before, .gaos-burger::after {
  display: block; width: 24px; height: 2px; background: var(--gaos-text); position: relative; content: "";
}
.gaos-burger::before { position: absolute; top: -7px; }
.gaos-burger::after  { position: absolute; top: 7px; }

/* ---------- Buttons ---------- */
.gaos-btn {
  background: var(--gaos-accent);
  color: var(--gaos-on-accent);
  font-weight: 700;
  padding: .9rem 1.8rem;
  border-radius: 999px;
  border: 0;
  transition: transform .15s ease, filter .15s ease;
}
.gaos-btn:hover { color: var(--gaos-on-accent); background: var(--gaos-accent); filter: brightness(1.12); transform: translateY(-1px); }
.gaos-btn-sm { padding: .55rem 1.2rem; font-size: .95rem; }
.gaos-btn-ghost {
  color: var(--gaos-text); font-weight: 600; padding: .9rem 1.8rem;
  border-radius: 999px; border: 1px solid var(--gaos-line);
}
.gaos-btn-ghost:hover { border-color: var(--gaos-muted); color: var(--gaos-text); }

/* ---------- Typo ---------- */
.gaos-eyebrow {
  color: var(--gaos-accent-2); text-transform: uppercase; letter-spacing: .14em;
  font-size: .8rem; font-weight: 700; margin-bottom: 1rem;
}
.gaos-h2 { font-size: clamp(2rem, 4vw, 3rem); font-weight: 800; letter-spacing: -.02em; line-height: 1.1; }
.gaos-lead { color: var(--gaos-muted); font-size: 1.15rem; line-height: 1.6; max-width: 46ch; }
.gaos-accent { color: var(--gaos-accent); }

/* ---------- Hero ---------- */
.gaos-hero {
  min-height: 100vh; display: flex; align-items: center;
  padding: 140px 0 100px;
  background:
    radial-gradient(60% 60% at 85% 20%, color-mix(in srgb, var(--gaos-accent) 22%, transparent), transparent 70%),
    var(--gaos-bg);
}
.gaos-hero-title {
  font-size: clamp(2.8rem, 8vw, 6rem); font-weight: 800;
  letter-spacing: -.035em; line-height: 1;
}
.gaos-hero-sub { color: var(--gaos-muted); font-size: clamp(1.15rem, 2vw, 1.5rem); margin-top: 1.5rem; }

/* ---------- Sections ---------- */
.gaos-section { padding: 120px 0; }
.gaos-section-alt { background: var(--gaos-bg-alt); border-top: 1px solid var(--gaos-line); border-bottom: 1px solid var(--gaos-line); }

.gaos-card, .gaos-why, .gaos-result, .gaos-step {
  background: var(--gaos-card); border: 1px solid var(--gaos-line);
  border-radius: 20px; padding: 1.75rem; height: 100%;
}
.gaos-card h3, .gaos-why h3, .gaos-step h3 { font-size: 1.2rem; font-weight: 700; margin: .5rem 0 .6rem; }
.gaos-card p, .gaos-why p, .gaos-step p, .gaos-result p { color: var(--gaos-muted); margin: 0; line-height: 1.6; }
.gaos-num { color: var(--gaos-accent-2); font-weight: 700; font-size: .85rem; }
.gaos-why { border-top: 3px solid var(--gaos-accent); }

/* Gründer: rechteckige Porträts */
.gaos-founder {
  background: var(--gaos-card); border: 1px solid var(--gaos-line);
  border-radius: 20px; padding: .75rem .75rem 1.5rem; height: 100%;
}
.gaos-portrait {
  aspect-ratio: 4 / 5; width: 100%; border-radius: 14px; overflow: hidden;
  display: flex; align-items: flex-end; padding: 1.25rem 1.5rem;
  background:
    linear-gradient(160deg, color-mix(in srgb, var(--gaos-accent) 85%, #000) 0%, color-mix(in srgb, var(--gaos-accent) 35%, var(--gaos-bg)) 100%);
}
.gaos-portrait span {
  font-weight: 800; font-size: clamp(3.5rem, 8vw, 6rem); line-height: .85;
  letter-spacing: -.04em; color: var(--gaos-on-accent); opacity: .9;
}
.gaos-portrait img { width: calc(100% + 3rem); height: calc(100% + 2.5rem); margin: -1.25rem -1.5rem; object-fit: cover; }
.gaos-founder-info { padding: 1.25rem .75rem 0; }
.gaos-founder-info strong { display: block; font-size: clamp(1.3rem, 2vw, 1.55rem); font-weight: 800; letter-spacing: -.01em; line-height: 1.2; }
.gaos-founder-info small {
  display: block; margin-top: .4rem; color: var(--gaos-accent-2);
  text-transform: uppercase; letter-spacing: .12em; font-size: .85rem; font-weight: 700;
}

/* Ergebnisse */
.gaos-shot {
  aspect-ratio: 4 / 3; border-radius: 12px; margin-bottom: 1.25rem;
  border: 1px dashed var(--gaos-line); display: grid; place-items: center; text-align: center;
  color: var(--gaos-muted); font-size: .9rem; background: var(--gaos-bg);
}
.gaos-shot-img { background: #fff; border: 0; padding: .5rem; overflow: hidden; transition: transform .2s ease; }
.gaos-shot-img:hover { transform: scale(1.02); }
.gaos-shot img { width: 100%; height: 100%; object-fit: contain; }
.gaos-result-total { display: flex; flex-direction: column; justify-content: center; border-top: 3px solid var(--gaos-accent); }
.gaos-result-total .gaos-metric { margin-bottom: 1.5rem; }
.gaos-metric { color: var(--gaos-muted); font-weight: 600; margin-bottom: .4rem; }
.gaos-metric span { display: block; color: var(--gaos-text); font-size: 2.4rem; font-weight: 800; letter-spacing: -.02em; }

/* Prozess */
.gaos-step span {
  display: inline-grid; place-items: center; width: 44px; height: 44px; border-radius: 50%;
  background: var(--gaos-accent); color: var(--gaos-on-accent); font-weight: 800;
}

/* Call buchen */
.gaos-cta {
  background:
    radial-gradient(50% 70% at 10% 90%, color-mix(in srgb, var(--gaos-accent) 18%, transparent), transparent 70%),
    var(--gaos-bg);
}
.gaos-phones { display: grid; gap: .8rem; max-width: 340px; }
.gaos-phone {
  display: block; padding: 1rem 1.25rem; border-radius: 14px;
  background: var(--gaos-card); border: 1px solid var(--gaos-line);
  color: var(--gaos-text); font-size: 1.25rem; font-weight: 700;
}
.gaos-phone small { display: block; color: var(--gaos-muted); font-size: .75rem; font-weight: 600; text-transform: uppercase; letter-spacing: .1em; }
.gaos-phone:hover { border-color: var(--gaos-accent); color: var(--gaos-text); }
.gaos-cal {
  min-height: 560px; border-radius: 20px; overflow: hidden;
  background: var(--gaos-card); border: 1px solid var(--gaos-line);
}
.gaos-cal-placeholder {
  min-height: 560px; display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: .5rem; text-align: center; color: var(--gaos-muted); padding: 2rem;
}
.gaos-cal-placeholder strong { color: var(--gaos-text); font-size: 1.2rem; }
.gaos-cal-placeholder code { color: var(--gaos-accent-2); }

/* Footer */
.gaos-footer { border-top: 1px solid var(--gaos-line); padding: 70px 0 30px; color: var(--gaos-muted); }
.gaos-footer h4 { color: var(--gaos-text); font-size: .9rem; text-transform: uppercase; letter-spacing: .12em; margin-bottom: 1rem; }
.gaos-legal {
  display: flex; flex-wrap: wrap; justify-content: space-between; gap: 1rem;
  border-top: 1px solid var(--gaos-line); margin-top: 50px; padding-top: 25px; font-size: .9rem;
}

/* Rechtliche Unterseiten */
.gaos-page { padding: 140px 0 100px; max-width: 760px; }
.gaos-page h1 { font-weight: 800; margin-bottom: 2rem; }
.gaos-page h2 { font-size: 1.2rem; font-weight: 700; margin-top: 2rem; }
.gaos-page p, .gaos-page li { color: var(--gaos-muted); line-height: 1.7; }
.gaos-todo { color: #ffb347; }

@media (max-width: 991px) {
  .gaos-nav .navbar-collapse { padding: 1rem 0; }
  .gaos-section { padding: 80px 0; }
}
@media (max-width: 575px) {
  .row.g-5 { --bs-gutter-x: 1.5rem; }
}