/* General Styles */
   body {
       font-family: "Courier New", Courier, monospace;
       background: linear-gradient(to right, #f5f5f5, #eaeaea);
       color: #333;
       margin: 0;
       padding: 0;
   }

   /* Hero Section */
   .landing-container {
       display: flex;
       flex-direction: column;
       align-items: center;
       justify-content: center;
       height: 100vh;
       text-align: center;
       padding: 20px;
   }

   header h1 {
       font-size: 3em;
       color: #333;
       margin-bottom: 20px;
       animation: fadeInDown 1s ease-in-out;
   }

   header p {
       font-size: 1.2em;
       color: #666;
       margin-bottom: 40px;
       animation: fadeIn 2s ease-in-out;
   }

   /* Navigation Buttons */
   nav {
       margin-bottom: 40px;
       animation: fadeInUp 1.5s ease-in-out;
   }

   nav .btn {
       font-size: 1.1em;
       color: #fff;
       background-color: #8b4513;
       padding: 15px 30px;
       margin: 10px;
       border-radius: 30px;
       text-decoration: none;
       transition: background-color 0.3s ease, transform 0.3s ease;
   }

   nav .btn:hover {
       background-color: #5a2e0c;
       transform: translateY(-5px);
   }

   /* Features Section */
   .features {
       max-width: 800px;
       margin: 0 auto;
       text-align: left;
       padding: 20px;
       animation: fadeInUp 1.5s ease-in-out;
   }

   .features h2 {
       font-size: 2.5em;
       color: #333;
       margin-bottom: 20px;
   }

   .features ul {
       list-style: none;
       padding: 0;
   }

   .features ul li {
       margin-bottom: 15px;
       position: relative;
       padding-left: 30px;
       font-size: 1.2em;
       color: #555;
   }

   .features ul li:before {
       content: "✔";
       position: absolute;
       left: 0;
       top: 0;
       transform: translateY(0%);
       color: #8b4513;
       font-size: 1.5em;
   }

   /* Pricing Section */
   .pricing {
       max-width: 800px;
       margin: 40px auto;
       padding: 20px;
       text-align: center;
       background: #fff;
       border-radius: 10px;
       box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
       animation: fadeInUp 1.5s ease-in-out;
   }

   .pricing h2 {
       font-size: 2.5em;
       color: #333;
       margin-bottom: 20px;
   }

   .pricing-table {
       display: flex;
       justify-content: center;
       gap: 30px;
   }

   .pricing-plan {
       background: #fdf5e6;
       border-radius: 10px;
       padding: 20px;
       width: 300px;
       text-align: center;
       box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
   }

   .pricing-plan h3 {
       font-size: 1.8em;
       color: #333;
       margin-bottom: 10px;
   }

   .pricing-plan p {
       font-size: 1.2em;
       color: #555;
       margin-bottom: 20px;
   }

   .price {
       font-size: 2.5em;
       color: #8b4513;
       margin-bottom: 20px;
   }

   .price-period {
       font-size: 1em;
       color: #666;
   }

   .plan-description {
       font-size: 1em;
       color: #555;
       margin-bottom: 20px;
   }

   .pricing-plan button {
       padding: 10px 20px;
       font-size: 1.1em;
       color: #fff;
       background-color: #8b4513;
       border: none;
       border-radius: 5px;
       cursor: pointer;
       transition: background-color 0.3s ease, transform 0.3s ease;
   }

   .pricing-plan button:hover {
       background-color: #5a2e0c;
       transform: translateY(-3px);
   }

   /* Animations */
   @keyframes fadeInDown {
       from {
           opacity: 0;
           transform: translateY(-20px);
       }

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

   @keyframes fadeIn {
       from {
           opacity: 0;
       }

       to {
           opacity: 1;
       }
   }

   @keyframes fadeInUp {
       from {
           opacity: 0;
           transform: translateY(20px);
       }

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

   /* Responsive Design */
   @media (max-width: 768px) {
       header h1 {
           font-size: 2.5em;
       }

       nav .btn {
           font-size: 1em;
           padding: 12px 25px;
       }

       .features h2 {
           font-size: 2em;
       }

       .pricing-table {
           flex-direction: column;
       }

       .pricing-plan {
           width: 100%;
           margin-bottom: 20px;
       }
   }