@font-face {
    font-family: 'Power Grotesk';
    src: url('../fonts/PowerGrotesk.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

:root{
    --primary-color: #1D0856;
    --secondary-color: #E0FF6D;
    --tertiary-color: #B7A5FF;
    --quaternary-color: #555555; 
  }

.hero-section{
    background-color: var(--primary-color); 
}

.loader-icon {
    z-index: 1000;
    position: fixed;
    display: flex;
    justify-content: center;
    align-items: center;
    /* box-shadow: 0 0 6px #000; */
    /* color: #fff; */
    left: 50%;
    margin-left: -50px;
    top: 50%;
    margin-top: -50px;
  }
  
  .img-thumbnail {
    padding: 0.25rem;
    background-color: #f3f3f9;
    border: 1px solid #dee2e6;
    border-radius: 0.25rem;
    max-width: 100%;
    height: auto;
  }
  
  .avatar-img {
    border-radius: 50px;
    width: 2.5rem;
    position: absolute;
    top: 1.2rem;
  }
  
  .avatar-icon {
    border-radius: 50px;
    width: 2.5rem;
    position: absolute;
    top: 0.9625rem;
    height: 2.5rem;
    padding: 0.625rem 0.8125rem;
  }
  
  .user-avatar {
    margin-left: 0.625rem;
    font-size: 0.875rem;
    font-weight: 700;
  }
  
  
  /* Footer */
  .footer {
    background-color: #0E1114;
    color: white;
    padding: 40px 0;
    box-sizing: border-box; 
  }
  
  .footer ul {
    list-style: none;
    padding: 0;
    margin: 0;
  }
  
  .footer ul li {
    display: inline-block;
    margin-right: 20px;
  }
  
  .footer ul li:last-child {
    margin-right: 0;
  }
  
  .footer ul li a {
    color: white;
    text-decoration: none;
    transition: color 0.3s ease;
  }
  
  .footer ul li a:hover {
    color: #E02F2F;
  }
  
  .footer p,
  .footer .newsletter p {
    color: #919AA7;
    margin-top: 20px;
  }
  
  .footer h2 {
    color: white;
    margin-bottom: 20px;
  }
  
  .newsletter form {
    display: flex;
    width: 100%;
    max-width: 400px;
    align-items: center;
  }
  
  .newsletter input[type="email"] {
    flex: 1;
    background-color: #141B23;
    border: none;
    color: white;
    height: 48px;
    padding: 0 12px;
  }
  
  .newsletter input::placeholder {
    color: #344252 !important;
  }
  
  .newsletter button {
    background-color: #E02F2F;
    color: white;
    border: none;
    padding: 10px 20px;
    margin-left: 8px;
    cursor: pointer;
    transition: background-color 0.3s ease;
  }
  
  
  .social-icons {
    margin-top: 16px;
  }
  
  .social-icons a {
    color: #919AA7;
    font-size: 20px;
    text-decoration: none;
    margin-right: 20px;
    transition: color 0.3s ease;
  }
  
  .social-icons a:last-child {
    margin-right: 0;
  }
  
  .social-icons a:hover {
    color: #E02F2F;
  }
  
  /* Utility */
  .footer .small {
    font-size: 1.2rem;
  }
  
  @media (max-width: 575.98px) {
    .footer-menue li {
      display: block;
      margin: 0.25rem 0;
    }
    .newsletter form {
      align-items: stretch;
    }
  }
  
  .newsletter input[type="email"] {
    background-color: #141B23;
    border: none;
    color: white;
    height: 48px;
    padding: 0 12px;
  }
  
  .newsletter input::placeholder {
    color: #344252 !important;
  }
  
  .newsletter button {
    background: linear-gradient(90deg, #B3D633 0%, #E0FF6D 100%);
    color: #1D0856; 
    border: none;
    padding: 10px 20px;
    font-size: 15px;
    font-family: 'Poppins', sans-serif;
    font-weight: 600;
    transition: background-color 0.3s ease;
  }
  
  
  .social-icons a {
    color: #919AA7;
    font-size: 20px;
    transition: color 0.3s ease;
  }
  
  .social-icons a:hover {
    color: #B3D633 ;
  }
  
  /* Contact Page */
  #contact-section {
      max-width: 800px;
      margin: 50px auto;
      background-color: white;
      border-radius: 8px;
      padding: 40px 30px;
  }
  
  *{
      font-family: 'figtree' ,sans-serif;
  }
  .contact-head h2{
      font-weight: 700;
      color:#0E1114;
  }
  
  .contact-head p{
      font-weight: 600;
  }
  
  #contact-section label{
      font-weight: 600;
      color:#0E1114;
      font-size: 18px;
  }
  
  .form-control-lg {
      font-size: 16px;
      padding: 20px;
  }