   * {
       margin: 0;
       padding: 0;
       box-sizing: border-box;
   }

   body {
       background-color: #000;
       color: #fff;
       font-family: 'Montserrat', sans-serif;
       overflow-x: hidden;
   }

   /* Navbar */
   .navbar {
       position: fixed;
       top: 0;
       width: 100%;
       display: flex;
       justify-content: space-between;
       align-items: center;
       padding: 20px 5%;
       z-index: 1000;
       background: linear-gradient(180deg, rgba(0, 0, 0, 0.9) 0%, rgba(0, 0, 0, 0) 100%);
       transition: background 0.3s ease;
   }

   .navbar.scrolled {
       background: rgba(0, 0, 0, 0.95);
       backdrop-filter: blur(10px);
   }

   .navbar__brand {
       width: 140px;
       height: auto;
       transition: transform 0.3s ease;
   }

   .navbar__brand:hover {
       transform: scale(1.05);
   }

   .brand__logo {
       width: 100%;
       height: 100%;
       filter: drop-shadow(0 0 10px rgba(229, 9, 20, 0.5));
   }

   .language__drop__down {
       background: rgba(0, 0, 0, 0.5);
       border: 1px solid rgba(255, 255, 255, 0.3);
       color: white;
       padding: 8px 12px;
       border-radius: 4px;
       font-size: 14px;
       cursor: pointer;
       font-family: 'Montserrat', sans-serif;
       font-weight: 500;
       transition: all 0.3s ease;
   }

   .language__drop__down:hover {
       border-color: #fff;
       background: rgba(0, 0, 0, 0.7);
   }

   .language__drop__down:focus {
       outline: 2px solid #e50914;
       outline-offset: 2px;
   }

   .language__drop__down option {
       background-color: #000;
   }

   .sign_in_link {
       text-decoration: none;
       color: white;
   }

   .signin__button {
       background: linear-gradient(135deg, #e50914 0%, #b20710 100%);
       border: none;
       color: white;
       padding: 8px 18px;
       border-radius: 4px;
       font-size: 15px;
       font-weight: 600;
       cursor: pointer;
       transition: all 0.3s ease;
       font-family: 'Montserrat', sans-serif;
       box-shadow: 0 4px 15px rgba(229, 9, 20, 0.3);
   }

   .signin__button:hover {
       transform: translateY(-2px);
       box-shadow: 0 6px 20px rgba(229, 9, 20, 0.5);
       background: linear-gradient(135deg, #f40612 0%, #e50914 100%);
   }

   /* Sign In Modal */
   .signin__modal {
       display: none;
       position: fixed;
       top: 0;
       left: 0;
       width: 100%;
       height: 100%;
       background: rgba(0, 0, 0, 0.7);
       backdrop-filter: blur(5px);
       z-index: 2000;
       animation: fadeIn 0.3s ease;
   }

   .signin__modal.active {
       display: flex;
       justify-content: center;
       align-items: center;
       padding: 20px;
   }

   .signin__container {
       background: rgba(0, 0, 0, 0.85);
       padding: 60px 68px;
       border-radius: 8px;
       max-width: 450px;
       width: 100%;
       position: relative;
       animation: slideDown 0.4s ease;
       box-shadow: 0 20px 60px rgba(0, 0, 0, 0.8);
   }

   @keyframes slideDown {
       from {
           opacity: 0;
           transform: translateY(-50px);
       }

       to {
           opacity: 1;
           transform: translateY(0);
       }
   }

   .close__modal {
       position: absolute;
       top: 20px;
       right: 20px;
       background: transparent;
       border: none;
       color: #fff;
       font-size: 32px;
       cursor: pointer;
       transition: transform 0.3s ease;
       width: 40px;
       height: 40px;
       display: flex;
       align-items: center;
       justify-content: center;
       padding: 0;
   }

   .close__modal:hover {
       transform: rotate(90deg);
   }

   .signin__container h1 {
       font-family: 'Bebas Neue', cursive;
       font-size: 32px;
       margin-bottom: 28px;
       letter-spacing: 1px;
       font-weight: 700;
   }

   .signin__form {
       display: flex;
       flex-direction: column;
       gap: 16px;
   }

   .signin__input__group {
       position: relative;
   }

   .signin__input {
       width: 100%;
       padding: 16px 20px;
       background: #333;
       border: none;
       border-radius: 4px;
       color: #fff;
       font-size: 16px;
       font-family: 'Montserrat', sans-serif;
       transition: all 0.3s ease;
   }

   .signin__input:focus {
       outline: none;
       background: #454545;
       box-shadow: 0 0 0 2px #e50914;
   }

   .signin__input::placeholder {
       color: #8c8c8c;
   }

   .signin__submit {
       background: linear-gradient(135deg, #e50914 0%, #b20710 100%);
       border: none;
       color: white;
       padding: 16px;
       border-radius: 4px;
       font-size: 16px;
       font-weight: 700;
       cursor: pointer;
       transition: all 0.3s ease;
       font-family: 'Montserrat', sans-serif;
       letter-spacing: 1px;
       margin-top: 24px;
       box-shadow: 0 4px 15px rgba(229, 9, 20, 0.3);
   }

   .signin__submit:hover {
       background: linear-gradient(135deg, #f40612 0%, #e50914 100%);
       box-shadow: 0 6px 20px rgba(229, 9, 20, 0.5);
       transform: translateY(-2px);
   }

   .signin__options {
       display: flex;
       justify-content: space-between;
       align-items: center;
       margin-top: 12px;
       font-size: 13px;
       color: #b3b3b3;
   }

   .remember__me {
       display: flex;
       align-items: center;
       gap: 8px;
   }

   .remember__me input[type="checkbox"] {
       width: 16px;
       height: 16px;
       cursor: pointer;
       accent-color: #e50914;
   }

   .need__help {
       color: #b3b3b3;
       text-decoration: none;
       transition: color 0.3s ease;
   }

   .need__help:hover {
       color: #fff;
       text-decoration: underline;
   }

   .signup__link {
       margin-top: 16px;
       color: #737373;
       font-size: 16px;
   }

   .signup__link a {
       color: #fff;
       text-decoration: none;
       font-weight: 600;
       transition: color 0.3s ease;
   }

   .signup__link a:hover {
       text-decoration: underline;
       color: #e50914;
   }

   .signin__footer {
       margin-top: 20px;
       font-size: 13px;
       color: #737373;
       line-height: 1.5;
   }

   .signin__footer a {
       color: #0071eb;
       text-decoration: none;
   }

   .signin__footer a:hover {
       text-decoration: underline;
   }

   @media (max-width: 768px) {
       .signin__container {
           padding: 40px 30px;
           max-width: 100%;
       }

       .signin__container h1 {
           font-size: 28px;
       }
   }

   .navbar__nav__items {
       display: flex;
       gap: 15px;
       align-items: center;
   }

   /* Hero Section */
   .hero {
       position: relative;
       width: 100%;
       height: 100vh;
       overflow: hidden;
   }

   .hero__bg__image__container {
       width: 100%;
       height: 100%;
       position: absolute;
       top: 0;
       left: 0;
   }

   .hero__bg__image {
       width: 100%;
       height: 100%;
       object-fit: cover;
       animation: zoomIn 20s ease-in-out infinite alternate;
   }

   @keyframes zoomIn {
       0% {
           transform: scale(1);
       }

       100% {
           transform: scale(1.1);
       }
   }

   .hero__bg__overlay {
       position: absolute;
       inset: 0;
       width: 100%;
       height: 100%;
       background: radial-gradient(circle at center, rgba(0, 0, 0, 0.3) 0%, rgba(0, 0, 0, 0.8) 100%);
       z-index: 1;
   }

   .hero__card {
       position: absolute;
       top: 50%;
       left: 50%;
       transform: translate(-50%, -50%);
       text-align: center;
       z-index: 2;
       width: 90%;
       max-width: 900px;
       animation: fadeInUp 1s ease-out;
   }

   @keyframes fadeInUp {
       from {
           opacity: 0;
           transform: translate(-50%, -40%);
       }

       to {
           opacity: 1;
           transform: translate(-50%, -50%);
       }
   }

   .hero__title {
       font-family: 'Bebas Neue', cursive;
       font-weight: 700;
       font-size: clamp(2rem, 8vw, 4rem);
       line-height: 1.1;
       margin-bottom: 20px;
       text-shadow: 3px 3px 10px rgba(0, 0, 0, 0.8);
       letter-spacing: 2px;
   }

   .hero__subtitle {
       font-size: clamp(1rem, 3vw, 1.5rem);
       font-weight: 500;
       margin-bottom: 15px;
       text-shadow: 2px 2px 8px rgba(0, 0, 0, 0.8);
   }

   .hero__description {
       font-size: clamp(0.9rem, 2.5vw, 1.2rem);
       margin: 0 auto 30px;
       max-width: 600px;
       font-weight: 400;
       text-shadow: 2px 2px 8px rgba(0, 0, 0, 0.8);
   }

   .email__form__container {
       display: flex;
       flex-direction: column;
       gap: 15px;
       align-items: center;
       width: 100%;
       max-width: 700px;
       margin: 0 auto;
   }

   .form__container {
       background: rgba(255, 255, 255, 0.95);
       width: 100%;
       height: 60px;
       position: relative;
       border-radius: 4px;
       border: 2px solid transparent;
       transition: all 0.3s ease;
   }

   .form__container:focus-within {
       border-color: #e50914;
       box-shadow: 0 0 0 3px rgba(229, 9, 20, 0.2);
   }

   .email__input {
       border: none;
       background: transparent;
       width: 100%;
       height: 100%;
       padding: 20px 15px 5px;
       font-size: 16px;
       font-family: 'Montserrat', sans-serif;
       color: #000;
   }

   .email__input:focus {
       outline: none;
   }

   .email__label {
       position: absolute;
       top: 50%;
       left: 15px;
       transform: translateY(-50%);
       color: #666;
       transition: all 0.3s ease;
       pointer-events: none;
       font-size: 16px;
       font-weight: 500;
   }

   .email__input:focus+.email__label,
   .email__input:not(:placeholder-shown)+.email__label {
       top: 12px;
       font-size: 12px;
       transform: translateY(0);
       color: #e50914;
   }

   .primary__button {
       background: linear-gradient(135deg, #e50914 0%, #b20710 100%);
       border: none;
       color: white;
       padding: 18px 35px;
       border-radius: 4px;
       font-size: 18px;
       font-weight: 700;
       cursor: pointer;
       transition: all 0.3s ease;
       font-family: 'Montserrat', sans-serif;
       letter-spacing: 1px;
       box-shadow: 0 8px 25px rgba(229, 9, 20, 0.4);
       width: 100%;
   }

   .primary__button:hover {
       transform: translateY(-3px);
       box-shadow: 0 12px 35px rgba(229, 9, 20, 0.6);
       background: linear-gradient(135deg, #f40612 0%, #e50914 100%);
   }

   /* Features */
   .feature {
       border-top: 8px solid #222;
       padding: 70px 5%;
       display: flex;
       align-items: center;
       gap: 40px;
       flex-direction: column;
       background: linear-gradient(135deg, #000 0%, #0a0a0a 100%);
   }

   .feature:nth-child(even) {
       background: linear-gradient(135deg, #0a0a0a 0%, #000 100%);
   }

   .feature__details {
       text-align: center;
       animation: fadeIn 1s ease-out;
   }

   @keyframes fadeIn {
       from {
           opacity: 0;
       }

       to {
           opacity: 1;
       }
   }

   .feature__title {
       font-family: 'Bebas Neue', cursive;
       font-size: clamp(2rem, 5vw, 3.5rem);
       font-weight: 700;
       margin-bottom: 15px;
       letter-spacing: 2px;
       text-shadow: 2px 2px 8px rgba(229, 9, 20, 0.3);
   }

   .feature__sub__title {
       font-size: clamp(1rem, 2.5vw, 1.5rem);
       font-weight: 400;
       line-height: 1.6;
       color: #b3b3b3;
   }

   .feature__image__container {
       width: 100%;
       max-width: 550px;
       position: relative;
       transition: transform 0.5s ease;
   }

   .feature__image__container:hover {
       transform: scale(1.02);
   }

   .feature__image {
       width: 100%;
       border-radius: 8px;
       box-shadow: 0 10px 40px rgba(0, 0, 0, 0.5);
   }

   .feature__backgroud__video__container {
       position: absolute;
       width: 100%;
       top: 20%;
       left: 13%;
       height: 100%;
       max-width: 73%;
       max-height: 54%;
       z-index: -1;
       overflow: hidden;
   }

   .feature__backgroud__video {
       width: 100%;
       height: 100%;
       object-fit: cover;
   }

   .feature__2__poster__container {
       position: absolute;
       bottom: 8%;
       left: 50%;
       transform: translateX(-50%);
       width: 90%;
       max-width: 20em;
       display: flex;
       align-items: center;
       background: linear-gradient(135deg, #000 0%, #1a1a1a 100%);
       border: 2px solid rgba(255, 255, 255, 0.2);
       border-radius: 15px;
       padding: 12px 18px;
       gap: 15px;
       box-shadow: 0 8px 30px rgba(0, 0, 0, 0.8);
       animation: slideUp 1s ease-out;
   }

   @keyframes slideUp {
       from {
           opacity: 0;
           transform: translate(-50%, 20px);
       }

       to {
           opacity: 1;
           transform: translate(-50%, 0);
       }
   }

   .poster__container {
       width: 20%;
       border-radius: 8px;
       overflow: hidden;
   }

   .poster {
       width: 100%;
       height: 100%;
       object-fit: cover;
   }

   .poster__details {
       flex: 1;
   }

   .poster__details h4 {
       font-size: 16px;
       font-weight: 600;
       margin-bottom: 5px;
   }

   .poster__details h6 {
       font-size: 14px;
       font-weight: 400;
       color: #0071eb;
   }

   .download__gif__container {
       width: 50px;
       height: 50px;
   }

   .gif {
       width: 100%;
       height: 100%;
   }

   .feature__3__backgroud__video__container {
       max-width: 63%;
       max-height: 47%;
       top: 9%;
       left: 19%;
   }

   /* FAQ Section */
   .FAQ__list__container {
       border-top: 8px solid #222;
       padding: 70px 5%;
       background: linear-gradient(135deg, #000 0%, #0a0a0a 100%);
   }

   .FAQ__heading {
       font-family: 'Bebas Neue', cursive;
       font-size: clamp(2rem, 5vw, 3.5rem);
       text-align: center;
       font-weight: 700;
       margin-bottom: 40px;
       letter-spacing: 2px;
       text-shadow: 2px 2px 8px rgba(229, 9, 20, 0.3);
   }

   .FAQ__list {
       display: flex;
       flex-direction: column;
       gap: 10px;
       max-width: 900px;
       margin: 0 auto 50px;
   }

   .FAQ__accordian {
       width: 100%;
   }

   .FAQ__title {
       width: 100%;
       display: flex;
       justify-content: space-between;
       align-items: center;
       padding: 25px 30px;
       font-size: clamp(1rem, 2.5vw, 1.5rem);
       background: #2d2d2d;
       border: none;
       color: white;
       cursor: pointer;
       transition: all 0.3s ease;
       font-family: 'Montserrat', sans-serif;
       font-weight: 500;
       text-align: left;
       border-radius: 4px;
       margin-bottom: 2px;
   }

   .FAQ__title:hover {
       background: #3d3d3d;
       transform: translateX(5px);
   }

   .FAQ__title::after {
       content: '+';
       font-size: 2rem;
       font-weight: 300;
       transition: transform 0.3s ease;
   }

   .FAQ__title.active::after {
       transform: rotate(45deg);
   }

   .FAQ__visible {
       background: #2d2d2d;
       max-height: 0;
       overflow: hidden;
       transition: max-height 0.5s ease, padding 0.5s ease;
       border-radius: 0 0 4px 4px;
       margin-bottom: 8px;
   }

   .FAQ__visible.active {
       max-height: 500px;
       padding: 25px 30px;
   }

   .FAQ__visible p {
       font-size: clamp(0.9rem, 2vw, 1.2rem);
       line-height: 1.6;
       margin-bottom: 15px;
       color: #e0e0e0;
   }

   .FAQ__visible p:last-child {
       margin-bottom: 0;
   }

   .FAQ__get__started__email {
       text-align: center;
       max-width: 800px;
       margin: 0 auto;
   }

   .FAQ__get__started__email h3 {
       font-size: clamp(1rem, 2.5vw, 1.3rem);
       font-weight: 400;
       margin-bottom: 25px;
   }

   /* Footer */
   footer {
       border-top: 8px solid #222;
       padding: 70px 5%;
       color: #b3b3b3;
       background: #000;
   }

   .footer__row__1 h4 {
       font-size: clamp(0.9rem, 2vw, 1.1rem);
       font-weight: 400;
       margin-bottom: 30px;
   }

   .footer__row__2 {
       display: grid;
       grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
       gap: 20px;
       margin-bottom: 30px;
   }

   .footer__row__2 a {
       color: #b3b3b3;
       text-decoration: none;
       font-size: 14px;
       transition: color 0.3s ease;
   }

   .footer__row__2 a:hover {
       color: #fff;
       text-decoration: underline;
   }

   .footer__row__2 p {
       margin-bottom: 12px;
   }

   .footer__row__3 {
       margin: 30px 0;
   }

   .footer__row__4 p {
       font-size: 14px;
       color: #808080;
   }

   /* Responsive Design */
   @media (min-width: 768px) {
       .email__form__container {
           flex-direction: row;
           gap: 10px;
       }

       .form__container {
           flex: 1;
       }

       .primary__button {
           width: auto;
           padding: 18px 30px;
       }

       .feature {
           flex-direction: row;
           padding: 80px 5%;
       }

       .feature:nth-child(even) {
           flex-direction: row-reverse;
       }

       .feature__details {
           text-align: left;
           flex: 1;
       }

       .feature__image__container {
           flex: 1;
       }
   }

   @media (min-width: 1024px) {
       .navbar {
           padding: 25px 5%;
       }

       .feature {
           padding: 80px 10%;
       }

       .FAQ__list__container {
           padding: 70px 10%;
       }

       footer {
           padding: 70px 15%;
       }

       .footer__row__2 {
           grid-template-columns: repeat(4, 1fr);
       }
   }

   /* Loading Animation */
   @keyframes pulse {

       0%,
       100% {
           opacity: 1;
       }

       50% {
           opacity: 0.5;
       }
   }

   .loading {
       animation: pulse 2s ease-in-out infinite;
   }