/* ========================================================= fidelak.de – geteiltes Design-System (Indigo/Slate, 2026) Wird von allen neuen Seiten (Hub, Agile Coaching, Web & Software) sowie perspektivisch von Backoffice genutzt. ========================================================= */ /* Webfonts werden lokal ueber /res/fonts/fonts.css im geladen. */ html { scroll-behavior: smooth; } body { font-family: 'Inter', sans-serif; background-color: #f8fafc; /* slate-50 */ color: #0f172a; /* slate-900 */ } .font-display { font-family: 'Playfair Display', serif; } ::selection { background: #e0e7ff; color: #312e81; } .gradient-text { background: linear-gradient(90deg, #4338ca, #6366f1); -webkit-background-clip: text; -webkit-text-fill-color: transparent; } .no-scrollbar::-webkit-scrollbar { display: none; } .no-scrollbar { -ms-overflow-style: none; scrollbar-width: none; } /* Endlos-Karussell für Symptom-/Referenzkarten */ @keyframes fidelak-marquee { 0% { transform: translateX(0); } 100% { transform: translateX(-50%); } } .marquee-track { display: flex; width: max-content; animation: fidelak-marquee 45s linear infinite; } .marquee-track:hover { animation-play-state: paused; } /* Mobiles Menü */ /* Sanfter Card-Hover, sitewide */ .lift-on-hover { transition: transform .25s ease, box-shadow .25s ease; } .lift-on-hover:hover { transform: translateY(-4px); box-shadow: 0 20px 40px -12px rgba(49,46,129,0.25); } /* ========================================================= Desktop-Rahmen Ab 1024 px wirkt die Seite wie bei 90 % Browserzoom und bekommt links und rechts einen weissen Rand. Darunter (Handy, Tablet) bleibt die Darstellung unveraendert, damit auf kleinen Displays kein Platz verschenkt wird. ========================================================= */ @media (min-width: 1024px) { html { background-color: #ffffff; } body { zoom: 0.9; background-color: #ffffff; } /* Der weisse Rand links und rechts */ .site-frame { margin-left: 4rem; margin-right: 4rem; } /* Die feste Hauptnavigation zieht mit ein, sonst wuerde sie ueber den Rand hinauslaufen. */ body > nav { left: 4rem; right: 4rem; width: auto; } /* zoom skaliert vh-Einheiten nicht mit - der Einwilligungsdialog braucht deshalb eine eigene Obergrenze. */ .fd-consent { max-height: calc(100vh / 0.9 - 3rem); } }