body{
    font-family: system-ui!important;
}

a{
    color:white!important;
}

.dropdown-item{
    color:blue!important;
}

.title-contact-form{
    font-size: 60px !important;
    font-weight: 600 !important;
}

.title-home{
    font-size: 40px;
    font-weight: 600;
}

.subtitile-home{
    font-size: 23px;
}

.postalcodeinput {
    text-align: center!important;
}

.selecting-country{
    font-size : 20px;
}

.form-select-region{
    padding-top:50px;
}
.link-auth{
    display: inline-block;
    margin-inline: 25px;    
}
.logo-website{
    display: inline-block;
}
.alert{
    font-size: 22px;
    z-index: 1000;
    text-align: center;
}

.price{
    font-size: 78px!important;
}

.butt-offers {
    padding: 10px!important;
}

.form-contact-label{
    text-align: start!important;
}

.slides-form input, .slides-form textArea{
    max-width:100%!important;
}

.slides-form button{
    font-size: 20px!important;
    font-weight: 600;
    padding: 10px;
    width: 300px;
    margin-top: 20px!important;
}

.countries-list {
    align-self: center;
    margin-left: auto!important;
    margin-right: auto!important;
    text-align: center!important;
}

.postalcodeinput,  .countries-list{
    /*
    padding: 0.65rem 0.75rem!important;
    border-radius: 5px!important;
    border: 1px solid #ced4da!important;
    transition: border-color .2s ease, box-shadow .2s ease!important; 
    font-size: 21px !important;*/
}

.countries-select:focus {
    border-color: #0d6efd!important;
    box-shadow: 0 0 0 0.15rem rgba(13,110,253,0.2)!important;
}


@media (min-width: 768px) {
    .form-select-region input{
        /*max-width: 300px!important;*/
    }
}

.about-text{
    padding-top: 30px;
}

.about-download-title{
    font-size: 30px;
    font-weight: 600;
    margin-bottom: 30px;
}

.about-download-container{
    text-align: center;
    padding:25px;
}

.News-section{
    display:contents!important;
}

.short-description div{
    font-size: 16px;
}

p{
    font-size: 16px!important;
}

.duration-billing{
    background-color: #1effff;
}

.conact-us-link{
    color : black!important;
}

.row-social-media{
    padding-left: 0px;
    margin-bottom: 0px;
}

.share .container{
    padding-block: 0rem;
}

@media (max-width: 513px) {
    .dropdown, .dropdownTrigger {
        display: none!important;
    }
}

/* Ultimate Pure CSS Animated Background (2025 edition) */
.ultimate-bg {
  /* Full viewport */
  position: fixed;
  inset: 0;
  width: 100vw;
  height: 100vh;
  overflow: hidden;
  z-index: -1;

  /* Animated gradient that slowly rotates */
  background: linear-gradient(45deg, 
    #0f0c29, #302b63, #24243e, 
    #1a1a2e, #16213e, #0f3460, 
    #1e1e3f, #522d80);
  background-size: 400% 400%;
  animation: gradientShift 25s ease infinite;

  /* Glassmorphism overlay */
  backdrop-filter: blur(10px);
}

/* Floating particles layer */
.ultimate-bg::before {
  content: "";
  position: absolute;
  inset: 0;
  background: 
    radial-gradient(circle at 20% 80%, rgba(120, 119, 198, 0.3) 0%, transparent 50%),
    radial-gradient(circle at 80% 20%, rgba(255, 119, 198, 0.25) 0%, transparent 50%),
    radial-gradient(circle at 40% 40%, rgba(120, 255, 255, 0.2) 0%, transparent 50%);
  animation: float 20s ease-in-out infinite;
}

/* Tiny sparkling stars / particles */
.ultimate-bg::after {
  content: "";
  position: absolute;
  inset: 0;
  background-image: 
    radial-gradient(2px 2px at 20px 30px, #eee, transparent),
    radial-gradient(2px 2px at 40px 70px, rgba(255,255,255,0.8), transparent),
    radial-gradient(1px 1px at 90px 40px, #fff, transparent),
    radial-gradient(1px 1px at 130px 80px, rgba(255,255,255,0.9), transparent),
    radial-gradient(2px 2px at 170px 30px, #fff, transparent);
  background-repeat: repeat;
  background-size: 200px 100px;
  animation: sparkle 12s linear infinite;
}

/* Mouse parallax effect (optional but awesome) */
.ultimate-bg {
  transform: perspective(1000px) rotateX(var(--rotateX, 0deg)) rotateY(var(--rotateY, 0deg));
  transition: transform 0.1s;
}

/* Keyframes */
@keyframes gradientShift {
  0%   { background-position: 0% 50%; }
  50%  { background-position: 100% 50%; }
  100% { background-position: 0% 50%; }
}

@keyframes float {
  0%, 100% { transform: translateY(0px) translateX(0px); }
  50%      { transform: translateY(-40px) translateX(30px); }
}

@keyframes sparkle {
  from { transform: translateY(0px); }
  to   { transform: translateY(-100px); }
}

/* JavaScript for mouse parallax (only 6 lines – optional but recommended) */