
    * { margin: 0; padding: 0; box-sizing: border-box; }
    html { font-size: 16px; scroll-behavior: smooth; }
    @media (max-width: 768px) { html { font-size: 15px; } }
    @media (max-width: 480px) { html { font-size: 14px; } }
    @media (max-width: 768px) { body { padding-top: 68px; } }
    .container { 
    width: 100%; margin: 0 auto; padding: 0 var(--space-lg); }
    @media (min-width: 640px) { .container { max-width: 640px; } }
    @media (min-width: 768px) { .container { max-width: 768px; } }
    @media (min-width: 1024px) { .container { max-width: 1024px; } }
    @media (min-width: 1280px) { .container { max-width: 1280px; } }
    @media (min-width: 1536px) { .container { max-width: 1400px; } }

   .hero {
      background: linear-gradient(120deg, var(--primary-blue) 0%, #2b4a9e 100%);
      color: white;
      padding: var(--space-2xl) var(--space-lg);
      text-align: center;
      border-radius: 0 0 var(--radius-xl) var(--radius-xl);
      margin-bottom: var(--space-xl);
      position: relative;
    }
    
    .hero-badge {
      display: inline-block;
      background: rgba(245,166,35,0.12);
      backdrop-filter: blur(4px);
      padding: 0.5rem 1rem;
      border-radius: var(--radius-full);
      font-size: 0.75rem;
      font-weight: 600;
      letter-spacing: 0.5px;
      color: var(--primary-gold);
      margin-bottom: 1.5rem;
      border: 1px solid rgba(245,166,35,0.2);
    }


    .hero h1, .hero p { 
      color: white; 
    }

    .hero p { 
      max-width: 680px; 
      margin: var(--space-md) auto 0; 
      opacity: 0.9; 
      padding-bottom: 30px;
    }

    
    .btn-primary {
      background: var(--primary-gold);
      padding: 0.9rem 2rem;
      border-radius: var(--radius-full);
      font-weight: 700;
      font-size: 1rem;
      color: var(--primary-blue);
      text-decoration: none;
      transition: all 0.3s ease;
      display: inline-flex;
      align-items: center;
      gap: 10px;
      border: none;
      cursor: pointer;
    }
    
    .btn-primary:hover {
      background: var(--primary-gold-dark);
      transform: translateY(-3px);
      box-shadow: var(--shadow-lg);
    }
    
    .btn-outline {
      background: transparent;
      border: 2px solid var(--primary-gold);
      padding: 0.9rem 2rem;
      border-radius: var(--radius-full);
      font-weight: 600;
      color: white;
      text-decoration: none;
      transition: all 0.3s ease;
      display: inline-flex;
      align-items: center;
      gap: 8px;
    }
    
    .btn-outline:hover {
      background: rgba(245, 158, 11, 0.15);
      transform: translateY(-3px);
    }

    @media (max-width: 768px) {
.hero {
   padding: 40px 0;
         text-align: center;
       }
       .hero h1 {
         font-size: 1.8rem;
         line-height: 1.3;
       }
       .hero p {
         font-size: 0.95rem;
         padding: 0 10px;
       }
       .hero .cta-buttons {
         display: flex;
         flex-direction: column;
         gap: 12px;
         align-items: center;
         justify-content: center;
       }
       .hero .cta-buttons a {
         width: 100%;
         max-width: 250px;
         justify-content: center;
       }
     }

     @media (max-width: 480px) {
       .hero h1 {
         font-size: 1.5rem;
       }
       .hero .hero-badge {
         font-size: 0.7rem;
         padding: 4px 12px;
       }
     }


    
    /* Universities Marquee */

    .section-title{
      align-content: center;
    }
    .universities-section {
      background: var(--soft-blue);
      padding: 30px;
      margin: var(--space-2xl) 0;
      border-radius: var(--radius-xl);
    }
    
    .marquee-wrapper {
      overflow: hidden;
      white-space: nowrap;
      margin-top: var(--space-lg);
    }
    
    .marquee {
      display: flex;
      gap: 2rem;
      animation: scroll 25s linear infinite;
      width: max-content;
    }
    
    .marquee-item {
      display: inline-flex;
      align-items: center;
      gap: 0.75rem;
      background: var(--bg-white);
      padding: 0.6rem 1.5rem;
      border-radius: var(--radius-full);
      box-shadow: var(--shadow-sm);
      font-weight: 600;
      font-size: 0.9rem;
      color: var(--primary-blue);
      border: 1px solid var(--border-light);
    }
    
    .marquee-item i {
      color: var(--primary-gold);
    }
    
    @keyframes scroll {
      0% { transform: translateX(0); }
      100% { transform: translateX(-50%); }
    }
    

    /* ----- Essential Tools Grid: 2 on mobile, 4 on large screens ----- */
    .quick-grid {
      display: grid;
      gap: var(--space-lg);
      grid-template-columns: repeat(2, 1fr);
    }

    @media (min-width: 1024px) {
      .quick-grid { grid-template-columns: repeat(4, 1fr); 
      }
    }

    .quick-card {
      background: var(--bg-white);
      border-radius: var(--radius-lg);
      padding: var(--space-lg);
      box-shadow: var(--shadow-sm);
      border: 1px solid var(--border-light);
      transition: var(--transition);
      cursor: pointer;
      display: flex;
      flex-direction: column;
      align-items: flex-start;
      gap: var(--space-sm);
    }

    .quick-card:hover {
      transform: translateY(-6px);
      box-shadow: var(--shadow-lg);
      border-color: var(--primary-gold);
    }

    .quick-icon {
      font-size: 2rem;
      color: var(--primary-gold);
      background: linear-gradient(135deg, var(--soft-blue) 0%, #FEF9E6 100%);
      width: 56px;
      height: 56px;
      display: flex;
      align-items: center;
      justify-content: center;
      border-radius: var(--radius-md);
      margin-bottom: var(--space-xs);
    }

    .quick-card h3 { 
      font-size: 1.2rem; 
      margin-bottom: 4px; 
    }

    .quick-card p { 
      font-size: 0.8rem; 
      color: var(--slate-light); 
      line-height: 1.4; 
    }

    .quick-link { 
      font-weight: 600; 
      color: var(--primary-gold); 
      display: flex; 
      align-items: center; 
      gap: 6px; 
      font-size: 0.8rem; 
      margin-top: auto; 
    }

    /* New sections styling (4 relevant sections) */
    .section-highlight {
      margin: var(--space-2xl) 0 var(--space-xl);
    }

    .section-header {
      display: flex;
      align-items: center;
      gap: 10px;
      margin-bottom: var(--space-lg);
      border-left: 5px solid var(--primary-gold);
      padding-left: var(--space-md);
    }

    .grid-3cols {
      display: grid;
      gap: var(--space-lg);
      grid-template-columns: 1fr;
    }

    @media (min-width: 768px) { 
      .grid-3cols { 
        grid-template-columns: repeat(3, 1fr); 
      } 
    }

    .feature-card {
      background: var(--bg-white);
      border-radius: var(--radius-lg);
      padding: var(--space-lg);
      border: 1px solid var(--border-light);
      transition: var(--transition);
      text-align: center;
    }

    .feature-card:hover { 
      transform: translateY(-5px); 
      box-shadow: var(--shadow-md); 
    }

    .feature-icon {
      font-size: 2.2rem;
      background: var(--soft-blue);
      width: 70px;
      height: 70px;
      display: flex;
      align-items: center;
      justify-content: center;
      border-radius: 50%;
      margin: 0 auto var(--space-md);
      color: var(--primary-gold);
    }

    .feature-card h3 { 
      font-size: 1.2rem; 
      margin-bottom: var(--space-sm); 
    }

    .btn-sm {
      display: inline-block;
      margin-top: var(--space-md);
      background: transparent;
      border: 1px solid var(--primary-gold);
      padding: 0.4rem 1rem;
      border-radius: var(--radius-full);
      font-weight: 600;
      font-size: 0.8rem;
      color: var(--primary-gold);
      cursor: pointer;
      transition: 0.2s;
    }

    .btn-sm:hover { 
      background: var(--primary-gold); 
      color: white; 
    }

    
    /* CTA Section */
    .cta-section {
      background: linear-gradient(135deg, var(--primary-blue) 0%, var(--primary-blue-dark) 100%);
      border-radius: var(--radius-xl);
      padding: var(--space-2xl);
      text-align: center;
      margin: var(--space-2xl) 0;
    }
    
    .cta-section h2 {
      color: white;
      font-size: 1.8rem;
      margin-bottom: var(--space-md);
    }
    
    .cta-section p {
      color: rgba(255,255,255,0.85);
      margin-bottom: var(--space-lg);
    }
    
    .cta-section .btn-primary {
      display: inline-flex;
      margin-top: var(--space-sm);
    }
    


    @media (min-width: 1024px) { 
      .resource-grid { 
        grid-template-columns: repeat(3, 1fr); 
      } 
    }

   
    @media (max-width: 640px) {
      .quick-card { 
        padding: var(--space-md); 
      }

      .feature-icon { 
        width: 55px; 
        height: 55px; 
        font-size: 1.8rem; 
      }
    } 

    
     /* Trust Banner */
     .trust-banner {
       background: var(--bg-white);
       padding: 12px 0;
       border-bottom: 1px solid var(--border-light);
       margin-bottom: 30px;
     }
     .trust-items {
       display: flex;
       justify-content: center;
       align-items: center;
       gap: 24px;
       flex-wrap: wrap;
     }
     .trust-item {
       display: flex;
       align-items: center;
       gap: 8px;
       font-size: 0.8rem;
       color: var(--slate-light);
     }
     .trust-item i { color: var(--primary-gold); font-size: 0.9rem; }
     
     /* Features Showcase - New class names to avoid conflict */
     .marketing-features-grid {
       display: grid;
       grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
       gap: 24px;
       margin: 40px 0;
     }
     .marketing-feature-card {
       background: var(--bg-white);
       border-radius: var(--radius-lg);
       padding: 24px;
       text-align: center;
       transition: all 0.3s ease;
       border: 1px solid var(--border-light);
     }
     .marketing-feature-card:hover {
       transform: translateY(-5px);
       border-color: var(--primary-gold);
       box-shadow: var(--shadow-md);
     }
     .marketing-feature-icon {
       width: 60px;
       height: 60px;
       background: var(--soft-blue);
       border-radius: var(--radius-md);
       display: flex;
       align-items: center;
       justify-content: center;
       margin: 0 auto 16px;
     }
     .marketing-feature-icon i { font-size: 1.6rem; color: var(--primary-gold); }
     .marketing-feature-card h3 { font-size: 1.1rem; margin-bottom: 8px; }
     .marketing-feature-card p { font-size: 0.85rem; color: var(--slate-light); }
     
     /* Stats Counter */
     .marketing-stats {
       display: grid;
       grid-template-columns: repeat(4, 1fr);
       gap: 20px;
       text-align: center;
       background: var(--bg-white);
       border-radius: var(--radius-lg);
       padding: 30px 20px;
       margin: 40px 0;
       border: 1px solid var(--border-light);
     }
     @media (max-width: 640px) {
       .marketing-stats { grid-template-columns: repeat(2, 1fr); gap: 20px; }
     }
     .marketing-stat h3 { font-size: 1.8rem; color: var(--primary-gold); margin-bottom: 5px; }
     .marketing-stat p { font-size: 0.75rem; color: var(--slate-light); text-transform: uppercase; letter-spacing: 1px; }
     
     /* Testimonials Grid */
     .marketing-testimonials {
       display: grid;
       grid-template-columns: repeat(3, 1fr);
       gap: 24px;
       margin: 40px 0;
     }
     @media (max-width: 900px) { .marketing-testimonials { grid-template-columns: repeat(2, 1fr); } }
     @media (max-width: 600px) { .marketing-testimonials { grid-template-columns: 1fr; } }
     .marketing-testimonial-card {
       background: var(--bg-white);
       border-radius: var(--radius-lg);
       padding: 20px;
       border: 1px solid var(--border-light);
       position: relative;
     }
     .marketing-testimonial-card::before {
       content: '"';
       position: absolute;
       top: 10px;
       right: 20px;
       font-size: 3rem;
       color: var(--primary-gold);
       opacity: 0.2;
       font-family: serif;
     }
     .testimonial-text { font-style: italic; margin-bottom: 16px; color: var(--slate); font-size: 0.9rem; line-height: 1.5; }
     .testimonial-author { display: flex; align-items: center; gap: 12px; }
     .testimonial-avatar {
       width: 45px;
       height: 45px;
       background: var(--soft-blue);
       border-radius: 50%;
       display: flex;
       align-items: center;
       justify-content: center;
     }
     .testimonial-avatar i { color: var(--primary-gold); font-size: 1.2rem; }
     .testimonial-name { font-weight: 700; font-size: 0.9rem; }
     .testimonial-title { font-size: 0.7rem; color: var(--slate-light); }
     
     /* Pricing Grid */
     .marketing-pricing {
       display: grid;
       grid-template-columns: repeat(3, 1fr);
       gap: 24px;
       margin: 40px 0;
     }
     @media (max-width: 900px) { .marketing-pricing { grid-template-columns: repeat(2, 1fr); } }
     @media (max-width: 600px) { .marketing-pricing { grid-template-columns: 1fr; } }
     .marketing-pricing-card {
       background: var(--bg-white);
       border-radius: var(--radius-lg);
       padding: 24px;
       text-align: center;
       border: 1px solid var(--border-light);
       position: relative;
       transition: all 0.3s;
     }
     .marketing-pricing-card.popular { border: 2px solid var(--primary-gold); transform: scale(1.02); }
     @media (max-width: 600px) { .marketing-pricing-card.popular { transform: scale(1); } }
     .popular-badge {
       position: absolute;
       top: -12px;
       left: 50%;
       transform: translateX(-50%);
       background: var(--primary-gold);
       color: var(--primary-blue);
       padding: 4px 16px;
       border-radius: 30px;
       font-size: 0.7rem;
       font-weight: 700;
       white-space: nowrap;
     }
     .marketing-pricing-card h3 { font-size: 1.3rem; margin-bottom: 10px; }
     .price { font-size: 2rem; font-weight: 800; color: var(--primary-blue); margin: 15px 0; }
     .price span { font-size: 0.8rem; font-weight: normal; color: var(--slate-light); }
     .pricing-features-list { list-style: none; margin: 20px 0; }
     .pricing-features-list li { padding: 8px 0; font-size: 0.85rem; display: flex; align-items: center; gap: 8px; justify-content: center; }
     .pricing-features-list li i { color: var(--success-green); font-size: 0.8rem; }
     
     /* CTA Banner */
     .marketing-cta {
       background: linear-gradient(135deg, var(--primary-blue), var(--primary-blue-dark));
       border-radius: var(--radius-lg);
       padding: 40px;
       text-align: center;
       margin: 40px 0;
     }
     .marketing-cta h2 { color: white; font-size: 1.6rem; margin-bottom: 10px; }
     .marketing-cta p { color: rgba(255,255,255,0.8); margin-bottom: 20px; }
     
     /* Newsletter */
     .marketing-newsletter {
       background: var(--bg-white);
       border-radius: var(--radius-lg);
       padding: 40px;
       text-align: center;
       border: 1px solid var(--border-light);
       margin: 40px 0;
     }
     .marketing-newsletter h3 { font-size: 1.3rem; margin-bottom: 10px; }
     .newsletter-form-group {
       display: flex;
       gap: 10px;
       max-width: 450px;
       margin: 20px auto 0;
     }
     .newsletter-form-group input {
       flex: 2;
       padding: 12px 16px;
       border: 1px solid var(--border-light);
       border-radius: 50px;
       background: var(--bg-white);
     }
     .newsletter-form-group button {
       padding: 12px 24px;
       background: var(--primary-gold);
       border: none;
       border-radius: 50px;
       font-weight: 600;
       cursor: pointer;
       white-space: nowrap;
     }
     @media (max-width: 500px) {
       .newsletter-form-group { flex-direction: column; }
       .marketing-cta { padding: 30px 20px; }
       .marketing-newsletter { padding: 30px 20px; }
     }
     
     /* Section Headers */
     .marketing-section-header {
       text-align: center;
       margin-bottom: 30px;
     }
     .marketing-section-header h2 {
       font-size: 1.8rem;
       margin-bottom: 8px;
     }
     .marketing-section-header p {
       color: var(--slate-light);
       max-width: 600px;
       margin: 0 auto;
     }