@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap');

:root {
--navy: #001A4D;
--navy-light: #0A2A6E;
--navy-dark: #000F2E;
--sky: #3399FF;
--sky-light: #66B3FF;
--cyan: #00D4FF;
--white: #FFFFFF;
--gray-50: #F7F9FC;
--gray-100: #EEF1F6;
--gray-400: #94A3B8;
--gray-600: #64748B;
}

body {
font-family: 'Inter', sans-serif;
@apply antialiased text-navy;
}

.bg-pattern {
background-image: radial-gradient(rgba(255, 255, 255, 0.1) 1px, transparent 1px);
background-size: 30px 30px;
}

.bg-pattern-dark {
background-image: radial-gradient(rgba(0, 26, 77, 0.05) 1px, transparent 1px);
background-size: 30px 30px;
}

/* .heading-dot::after {
content: ".";
color: #3399FF;
} */

.gradient-dark {
background: linear-gradient(135deg, #000F2E 0%, #001A4D 100%);
}

.glass-card {
@apply bg-white/5 backdrop-blur-sm border border-white/10;
}

.btn-primary {
@apply bg-sky text-white px-8 py-4 rounded-lg font-bold transition-all duration-300 shadow-lg shadow-sky/20 hover:shadow-sky/40 hover:-translate-y-0.5;
}

.btn-secondary {
@apply px-8 py-4 border border-white/20 text-white rounded-lg font-bold transition-all duration-300 hover:bg-white/10;
}

@keyframes float {
0% {
transform: translateY(0px);
}
50% {
transform: translateY(-10px);
}
100% {
transform: translateY(0px);
}
}

.float {
animation: float 6s ease-in-out infinite;
}

/* Custom Scrollbar */
::-webkit-scrollbar {
width: 10px;
}

::-webkit-scrollbar-track {
background: var(--navy-dark);
}

::-webkit-scrollbar-thumb {
background: var(--navy-light);
border: 2px solid var(--navy-dark);
border-radius: 5px;
}

::-webkit-scrollbar-thumb:hover {
background: var(--sky);
}

/* Firefox */
* {
scrollbar-width: thin;
scrollbar-color: var(--navy-light) var(--navy-dark);
}

html {
overflow-x: hidden;
width: 100%;
max-width: 100%;
position: relative;
touch-action: pan-y; /* Nur vertikales Scroll erlauben */
}

body {
overflow-x: hidden;
width: 100vw;
max-width: 100vw;
margin: 0;
padding: 0;
box-sizing: border-box;
position: relative;
left: 0;
}

* {
box-sizing: border-box;
max-width: 100%;
}

/* Neue Klasse für no-break mobil */
.no-break-mobile {
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

@media screen and (max-width: 640px) {
.max-w-7xl, .max-w-5xl {
max-width: 100vw !important;
padding-left: 1rem !important;
padding-right: 1rem !important;
}

h1, p {
word-break: keep-all !important;
overflow-wrap: normal !important;
hyphens: none !important;
padding-left: 0.25rem;
padding-right: 0.25rem;
}
}