:root {
     --primary-gold: #D4AF37;
     --primary-black: #0a0a0a;
     --secondary-black: #1a1a1a;
     --text-white: #ffffff;
     --whatsapp-green: #25D366;
 }

 header {
     background-color: var(--secondary-black);
     padding: 1rem 5%;
     position: sticky;
     top: 0;
     z-index: 1000;
     border-bottom: 2px solid var(--primary-gold);
     display: flex;
     justify-content: space-between;
     align-items: center;
     box-shadow: 0 2px 10px rgba(0, 0, 0, 0.5);
 }

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

 .logo-img {
     height: 60px;
     width: auto;
 }

 .brand-name {
     font-size: 1.5rem;
     font-weight: bold;
     color: var(--primary-gold);
     text-transform: uppercase;
     letter-spacing: 1px;
 }

 .cta-button {
     background-color: var(--primary-gold);
     color: var(--primary-black);
     padding: 10px 20px;
     text-decoration: none;
     font-weight: bold;
     border-radius: 5px;
     transition: 0.3s;
 }

 .cta-button:hover {
     background-color: #fff;
 }

 /* --- NAVIGATION BAR STYLING --- */
 .navbar {
     display: flex;
     gap: 25px;
 }

 .navbar a {
     color: var(--text-white);
     text-decoration: none;
     font-size: 1.1rem;
     font-weight: 500;
     text-transform: uppercase;
     letter-spacing: 0.5px;
     transition: 0.3s;
     position: relative;
 }

 /* Hover Effect: Gold Color + Underline */
 .navbar a:hover {
     color: var(--primary-gold);
 }

 .navbar a::after {
     content: '';
     position: absolute;
     width: 0;
     height: 2px;
     bottom: -5px;
     left: 0;
     background-color: var(--primary-gold);
     transition: width 0.3s;
 }

 .navbar a:hover::after {
     width: 100%;
 }

 /* Mobile Responsiveness for Nav */
 @media (max-width: 768px) {
     header {
         flex-wrap: wrap;
         /* Mobile par items niche aa jayein */
         gap: 15px;
         justify-content: center;
     }

     .navbar {
         order: 3;
         /* Nav sabse neeche aaye */
         width: 100%;
         justify-content: center;
         gap: 15px;
         background: #111;
         /* Thoda alag background */
         padding: 10px;
         border-top: 1px solid #333;
         border-bottom: 1px solid #333;
     }

     .navbar a {
         font-size: 0.9rem;
         /* Mobile par font thoda chota */
     }

     .logo-container {
         margin-right: auto;
         /* Logo left me rahe */
     }
 }

 /* --- LUXURY BLACK & GOLD THEME --- */

 body.luxury-theme {
     background-color: #000000;
     /* Pitch Black Background */
     color: #ffffff;
     /* White Text */
     font-family: 'Arial', sans-serif;
 }

 .page-title {
     text-align: center;
     padding: 50px 20px;
     border-bottom: 1px solid #333;
 }

 .page-title h1 {
     color: #D4AF37;
     /* Gold Color */
     font-size: 2.5rem;
     text-transform: uppercase;
     letter-spacing: 2px;
     margin-bottom: 10px;
 }

 /* Grid Container */
 .rate-container {
     display: flex;
     flex-wrap: wrap;
     justify-content: center;
     gap: 25px;
     padding: 50px 20px;
     max-width: 1200px;
     margin: 0 auto;
 }

 /* --- GOLD CARD DESIGN --- */
 .gold-card {
     background: #111111;
     /* Dark Grey (almost black) card bg */
     border: 1px solid #D4AF37;
     /* Gold Border */
     width: 300px;
     padding: 30px 20px;
     text-align: center;
     border-radius: 8px;
     transition: all 0.3s ease;
     position: relative;
 }

 .gold-card:hover {
     transform: translateY(-10px);
     box-shadow: 0 0 20px rgba(212, 175, 55, 0.4);
     /* Gold Glow effect */
     background: #1a1a1a;
 }

 /* Card Typography */
 .gold-card h3 {
     color: #fff;
     font-size: 22px;
     margin-bottom: 5px;
     text-transform: uppercase;
 }

 .car-names {
     color: #888;
     font-size: 14px;
     margin-bottom: 20px;
 }

 .price {
     font-size: 36px;
     color: #D4AF37;
     /* Gold Price */
     font-weight: bold;
     margin: 15px 0;
     font-family: serif;
     /* Thoda royal look ke liye */
 }

 /* Features List */
 .features {
     list-style: none;
     padding: 0;
     margin-bottom: 25px;
     color: #ccc;
     font-size: 14px;
 }

 .features li {
     margin: 8px 0;
 }

 .features i {
     color: #D4AF37;
     /* Icons bhi gold honge */
     margin-right: 8px;
 }

 /* --- BUTTON DESIGN --- */
 .gold-btn {
     display: inline-block;
     padding: 12px 30px;
     background: #D4AF37;
     /* Gold Background */
     color: #000000;
     /* Black Text for contrast */
     text-decoration: none;
     font-weight: bold;
     text-transform: uppercase;
     border-radius: 4px;
     transition: 0.3s;
     letter-spacing: 1px;
 }

 .gold-btn:hover {
     background: #fff;
     /* White on hover */
     color: #000;
     box-shadow: 0 0 15px rgba(255, 255, 255, 0.5);
 }

 /* --- SPECIAL HIGHLIGHT FOR CRYSTA --- */
 .premium-glow {
     border: 2px solid #D4AF37;
     box-shadow: 0 0 15px rgba(212, 175, 55, 0.2);
 }

 .badge {
     position: absolute;
     top: -12px;
     left: 50%;
     transform: translateX(-50%);
     background: #D4AF37;
     color: black;
     padding: 5px 15px;
     font-size: 12px;
     font-weight: bold;
     border-radius: 20px;
     letter-spacing: 1px;
 }