/* Sensus Communis | buttons.css
   Einheitliches Verhalten aller Buttons der Website. Wird auf jeder Seite als letztes Stylesheet
   geladen und gewinnt deshalb (auch gegen die per Skript eingesetzten Stile von Kopfzeile und
   Cookie-Hinweis).
   1. Die Buttons tragen das Enso-Blau (#8C9EF5) mit dunkelblauer Schrift (Farbregel 60/30/10, Nov. 2026; vorher #3240B6),
      auch die Glasbuttons auf dem Nachthimmel (Annual Forum, Zeitgeist, 404).
   2. Alle Buttons bekommen beim Ueberfahren und beim Klicken denselben Schein im Blau des
      Nacht-Enso (#8C9EF5). */

:root { --pl: 140 158 245; }          /* Blau des Nacht-Enso (vorher Rosa-Lavendel 226 178 240) */

/* ---------- 1. Dunkelblaue Buttons: Blau der Founding-Colloquium-Seite ---------- */
html body .pillar-cta,
html body .colloquium-cta,
html body .flow .colloquium-cta,
html body .send-btn,
html body .sc-glass-cta {
  background: linear-gradient(180deg, rgba(255,255,255,.22) 0%, rgba(255,255,255,.05) 40%, rgba(255,255,255,0) 60%), #8C9EF5 !important;
  border-color: rgba(255,255,255,.5) !important;
  color: #0A1A4F !important;
  box-shadow: 0 10px 24px rgba(30,40,130,.28), inset 0 1px 1px rgba(255,255,255,.5) !important;
}
html body .pillar-cta:hover,
html body .colloquium-cta:hover,
html body .flow .colloquium-cta:hover,
html body .send-btn:hover,
html body .sc-glass-cta:hover,
html body .sc-glass-cta:focus-visible,
html body .pillar-cta:focus-visible,
html body .colloquium-cta:focus-visible,
html body .send-btn:focus-visible {
  background: linear-gradient(180deg, rgba(255,255,255,.24) 0%, rgba(255,255,255,.06) 40%, rgba(255,255,255,0) 60%), #9DADF7 !important;
}

/* ---------- 2. Ein blauer Schein fuer alle Buttons ---------- */
/* Ueberfahren und Tastaturfokus */
html body .pillar-cta:hover,
html body .colloquium-cta:hover,
html body .send-btn:hover,
html body .sc-glass-cta:hover,
html body .founder-btn:hover,
html body .giants-more:hover,
html body .sc-nav-cta:hover,
html body .sc-nav.scrolled .sc-nav-cta:hover,
html body .flow .colloquium-cta:hover,
html body .flow .pillar-cta:hover,
html body .ocean-edition-label:hover,
html body .sc-noon-up:hover,
html body #sc-consent .sc-accept:hover,
html body .sc-intro__pill:hover,
html body #sc-consent-moon:hover,
html body .sc-intro__pill:focus-visible,
html body #sc-consent-moon:focus-visible,
html body .pillar-cta:focus-visible,
html body .colloquium-cta:focus-visible,
html body .send-btn:focus-visible,
html body .sc-glass-cta:focus-visible,
html body .founder-btn:focus-visible,
html body .giants-more:focus-visible,
html body .sc-nav-cta:focus-visible,
html body .ocean-edition-label:focus-visible,
html body .sc-noon-up:focus-visible,
html body #sc-consent .sc-accept:focus-visible {
  border-color: rgb(var(--pl) / .95) !important;
  box-shadow: 0 12px 28px rgba(30,40,130,.26),
    0 0 0 3px rgb(var(--pl) / .30),
    0 0 30px rgb(var(--pl) / .78),
    inset 0 1px 1px rgba(255,255,255,.45) !important;
}
/* Klicken: der Schein leuchtet kurz staerker auf */
html body .pillar-cta:active,
html body .colloquium-cta:active,
html body .send-btn:active,
html body .sc-glass-cta:active,
html body .founder-btn:active,
html body .giants-more:active,
html body .sc-nav-cta:active,
html body .sc-nav.scrolled .sc-nav-cta:active,
html body .flow .colloquium-cta:active,
html body .flow .pillar-cta:active,
html body .flow .colloquium-cta:active:hover,
html body .ocean-edition-label:active,
html body .sc-noon-up:active,
html body .sc-intro__pill:active,
html body #sc-consent-moon:active,
html body #sc-consent .sc-accept:active {
  border-color: rgb(var(--pl)) !important;
  box-shadow: 0 6px 16px rgba(30,40,130,.24),
    0 0 0 5px rgb(var(--pl) / .45),
    0 0 46px rgb(var(--pl) / .95),
    inset 0 1px 2px rgba(255,255,255,.4) !important;
}
/* Der Button "Founding Colloquium" im Startbild leuchtete beim Klicken cremeweiss: jetzt lila */
html body .ocean-edition-label:active {
  background: rgba(18,30,80,.5) !important;
  color: var(--c-cream) !important;
}

/* Textbutton im Newsletter-Formular ("Eintragen"): derselbe blaue Schein als Leuchten der Schrift */
html body .cta-form button {
  transition: color .3s, text-shadow .3s !important;
}
html body .cta-form button:hover,
html body .cta-form button:focus-visible {
  color: rgb(var(--pl)) !important;
  text-shadow: 0 0 14px rgb(var(--pl) / .85), 0 0 2px rgb(var(--pl) / .6);
}
html body .cta-form button:active {
  color: #E3E8FE !important;
  text-shadow: 0 0 20px rgb(var(--pl)), 0 0 4px rgb(var(--pl) / .9);
}


/* ---------- 3. Founding-Member-Button oben im Menue: im Enso-Blau der Buttons, dunkelblaue Schrift ----------
   Auf der Startseite bleibt er waehrend der schwarzen Oeffnung schwarz-weiss (css/intro.css,
   .sc-nav--hold) und wird erst danach blau. */
html body .sc-nav .sc-nav-cta,
html body .sc-nav.scrolled .sc-nav-cta,
html body .sc-nav.sc-nav--sky .sc-nav-cta {
  color: #0A1A4F !important;
  background: linear-gradient(180deg, rgba(255,255,255,.22) 0%, rgba(255,255,255,.05) 40%, rgba(255,255,255,0) 60%), #8C9EF5 !important;
  border-color: rgba(255,255,255,.55) !important;
  box-shadow: 0 6px 16px rgba(30,40,130,.22), inset 0 1px 1px rgba(255,255,255,.55) !important;
  -webkit-backdrop-filter: none !important; backdrop-filter: none !important;
  transition: transform .3s cubic-bezier(.2,.8,.2,1), background .6s ease, border-color .6s ease, box-shadow .3s, color .6s ease !important;
}
html body .sc-nav .sc-nav-cta::before { background: none !important; }
html body .sc-nav .sc-nav-cta:hover { background: linear-gradient(180deg, rgba(255,255,255,.24) 0%, rgba(255,255,255,.06) 40%, rgba(255,255,255,0) 60%), #9DADF7 !important; }

/* ---------- 4. Alle Buttons einheitlich: Enso-Blau, Schrift immer weiss (Nov. 2026) ----------
   Leichter Verlauf ins etwas tiefere Enso-Blau und ein zarter Schatten unter der Schrift,
   damit Weiss auf dem hellen Blau gut lesbar bleibt. Startseite: der Knopf im Startbild und
   der Menue-Button bleiben waehrend der schwarzen Oeffnung schwarz-weiss (html.sc-hold). */
html body .pillar-cta,
html body .colloquium-cta,
html body .flow .colloquium-cta,
html body .send-btn,
html body .sc-glass-cta,
html body .founder-btn,
html body .giants-more,
html body .sc-nav .sc-nav-cta,
html body .sc-nav.scrolled .sc-nav-cta,
html body .sc-nav.sc-nav--sky .sc-nav-cta,
html:not(.sc-hold) body #sc-consent .sc-accept,
html:not(.sc-hold) body .sc-intro__pill {
  color: #FFFFFF !important;
  background: linear-gradient(180deg, rgba(255,255,255,.18) 0%, rgba(255,255,255,0) 55%), linear-gradient(180deg, #8C9EF5 0%, #7389EE 100%) !important;
  border-color: rgba(255,255,255,.55) !important;
  text-shadow: 0 1px 2px rgba(20,30,100,.35);
}
html body .pillar-cta *, html body .colloquium-cta *, html body .sc-glass-cta *, html body .founder-btn *,
html body .giants-more *, html body .sc-nav-cta *, html body .send-btn * { color: #FFFFFF !important; }
html body .pillar-cta:hover, html body .colloquium-cta:hover, html body .send-btn:hover, html body .sc-glass-cta:hover,
html body .founder-btn:hover, html body .giants-more:hover, html body .sc-nav .sc-nav-cta:hover,
html:not(.sc-hold) body #sc-consent .sc-accept:hover, html:not(.sc-hold) body .sc-intro__pill:hover {
  background: linear-gradient(180deg, rgba(255,255,255,.22) 0%, rgba(255,255,255,0) 55%), linear-gradient(180deg, #97A8F7 0%, #7D92F1 100%) !important;
}
html body .sc-intro__pill { transition: background .6s ease, color .6s ease, border-color .6s ease, box-shadow .3s !important; }

/* ---------- 5. Schrift in allen Buttons: Manrope (auch der Knopf im Startbild, vorher Garamond) ---------- */
html body .pillar-cta, html body .colloquium-cta, html body .send-btn, html body .sc-glass-cta,
html body .founder-btn, html body .giants-more, html body .sc-nav-cta, html body #sc-consent .sc-accept,
html body .sc-intro__pill {
  font-family: "Manrope", system-ui, sans-serif !important;
  font-weight: 600 !important;
  letter-spacing: .02em !important;
  font-style: normal !important;
}
html body .sc-intro__pill { font-size: clamp(13.5px, 1.3vw, 15px) !important; padding: 10px 24px !important; }
html body .pillar-cta *, html body .colloquium-cta *, html body .sc-glass-cta *, html body .founder-btn *,
html body .giants-more *, html body .sc-nav-cta * { font-family: inherit !important; font-style: normal !important; font-weight: inherit !important; }
