body {box-sizing: border-box;}
* {font-family: 'Inter', sans-serif;}
.comfortaa {font-family: 'Comfortaa', cursive !important;}
html {scroll-behavior: auto !important;}
.logo img {max-width:220px !important;}
.hero-gradient {background: linear-gradient(135deg, rgba(15, 23, 42, 0.95) 0%, rgba(30, 41, 59, 0.9) 100%);}
.card-hover {transition: all 0.3s ease;}
.card-hover:hover {transform: translateY(-8px); box-shadow: 0 20px 40px rgba(0, 0, 0, 0.15);}
.gradient-text {background: linear-gradient(135deg, #3b82f6 0%, #2563eb 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;}
.btn-primary {background: linear-gradient(135deg, #3b82f6 0%, #2563eb 100%); transition: all 0.3s ease;}
.btn-primary:hover {transform: translateY(-2px); box-shadow: 0 10px 25px rgba(59, 130, 246, 0.3);}
.mobile-menu {transform: translateX(100%); transition: transform 0.3s ease;}
.mobile-menu.active {transform: translateX(0);} .slideshow-container {position: relative;}
.slide {position: absolute; top: 0; left: 0; width: 100%; height: 100%; opacity: 0; transition: opacity 2s ease-in-out;}
.slide.active {opacity: 1;}
.slide img {animation: kenburns 20s ease-out infinite;}
@keyframes kenburns {0% {transform: scale(1);} 50% {transform: scale(1.1);} 100% {transform: scale(1);}}
@keyframes gradient {0% {background-position: 0% 50%;} 50% {background-position: 100% 50%;} 100% {background-position: 0% 50%;}}
.animate-gradient {background-size: 200% auto; animation: gradient 3s ease infinite;} .advantage-slide {transition: opacity 1s ease-in-out;}
.advantage-slide.active {opacity: 1;}
.advantage-dot.active {background-color: white !important;}
.the_content p, .the_content li {font-size: 'Comfortaa', cursive; padding-bottom: 15px;}
.the_content ul, .the_content ol {padding-left: 20px;}
.the_content ul {list-style: inside disc;}
.the_content ol {list-style: inside decimal;}
.the_content h1, .the_content h2, .the_content h3, .the_content h4, .the_content h5, .the_content h6 {font-weight: 700;}
label.error {color: lightcoral; font-family: 'Comfortaa', cursive; font-size: 12px; padding-left: 5px;}
@media (max-width: 600px)
{
.hero-polygon {clip-path: polygon(0 0, 75% 0, 55% 100%, 0 100%) !important;}
.hero-polygon-transparent {clip-path: polygon(75% 0, 100% 0, 100% 100%, 55% 100%) !important;}
.custom-font-size-h3  {font-size: 22px !important;}
.hidden-mobile {display: none !important;}
}