/* ======================================================
   LuxeDrive - Global Page Styles (page.css) V1.1 (Final)
   Location: /assests/css/page.css
   - Added rule to prevent underline on contact email link hover
   ====================================================== */

/* --- 1. Core Variables --- */
:root {
    /* Colors */
    --LuxeDrive_dark-base: #0f0f1a; 
    --LuxeDrive_dark-surface: #17172d; 
    --LuxeDriveHeader_dark-elevated: #1e1e38; 
    --LuxeDrive_text-primary: #ffffff; 
    --LuxeDrive_text-secondary: #c1c1e1; 
    --LuxeDriveHeader_sky-blue: #43c6fc;
    --LuxeDriveHeader_nebula-purple: #9448ff; 
    --LuxeDriveHeader_cosmic-gradient: linear-gradient(135deg, var(--LuxeDriveHeader_sky-blue), var(--LuxeDriveHeader_nebula-purple));
    --LuxeDrive_dark-border: rgba(255, 255, 255, 0.1); 
    --LuxeDrive_light-border: rgba(255, 255, 255, 0.05); 

    /* Typography */
    --LuxeDrive_font-family: 'Outfit', sans-serif;
    --LuxeDrive_base-font-size: 16px;
    --LuxeDrive_line-height: 1.6;

    /* Spacing */
    --LuxeDrive_spacing-sm: 8px; 
    --LuxeDrive_spacing-md: 16px; 
    --LuxeDrive_spacing-lg: 24px; 
    --LuxeDrive_spacing-xl: 32px;
    --LuxeDrive_spacing-xxl: 48px; 

    /* Borders & Radius */
    --LuxeDrive_border-radius-lg: 8px; 
    --LuxeDrive_border-radius: 6px;   
    --LuxeDrive_border-radius-sm: 4px; 

    /* Effects */
    --LuxeDrive_shadow-subtle: 0 4px 15px rgba(0, 0, 0, 0.2);
    --LuxeDrive_shadow-medium: 0 8px 25px rgba(0, 0, 0, 0.4);
    --LuxeDrive_neon-blue-glow: 0 0 12px rgba(67, 198, 252, 0.6);

    /* Header Heights */
    --LuxeDriveHeader_height-desktop: 70px; 
    --LuxeDriveHeader_height-mobile: 60px; 
    --LuxeDriveHeader_height: var(--LuxeDriveHeader_height-desktop); /* Default */
    --LuxeDriveHeader_mobile-breakpoint: 768px;
}

/* --- 2. Base HTML & Body Styles --- */
html {
    font-size: var(--LuxeDrive_base-font-size);
    height: 100%;
    box-sizing: border-box;
    scroll-behavior: smooth;
    scroll-padding-top: var(--LuxeDriveHeader_height); 
}

*, *::before, *::after {
    box-sizing: inherit;
    margin: 0;
    padding: 0;
}

body {
    font-family: var(--LuxeDrive_font-family);
    background-color: var(--LuxeDrive_dark-base);
    color: var(--LuxeDrive_text-primary);
    line-height: var(--LuxeDrive_line-height);
    margin: 0;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    min-height: 100vh; 
    display: flex;      
    flex-direction: column; 
}

body.LuxeDriveHeader_mobile-nav-open {
    overflow: hidden;
}

/* --- 3. Main Content Wrapper --- */
.page-content {
    width: 100%;
    padding-top: calc(var(--LuxeDriveHeader_height) + var(--LuxeDrive_spacing-xl)); 
    padding-bottom: var(--LuxeDrive_spacing-xxl); 
    padding-left: var(--LuxeDrive_spacing-lg);
    padding-right: var(--LuxeDrive_spacing-lg);
    position: relative;
    z-index: 1;
    overflow-x: hidden;
    flex-grow: 1; 
    display: flex; 
    flex-direction: column; 
    align-items: center; 
}

/* Background Pattern */
.page-content::before {
    content: "";
    position: absolute;
    top: 0; left: 0; width: 100%; height: 100%;
    background-image: repeating-linear-gradient(-45deg, rgba(67, 198, 252, 0.05), rgba(67, 198, 252, 0.05) 1px, transparent 1px, transparent 15px), 
                      repeating-linear-gradient(45deg, rgba(148, 72, 255, 0.05), rgba(148, 72, 255, 0.05) 1px, transparent 1px, transparent 15px);
    z-index: -1; 
    opacity: 0.04; 
    pointer-events: none;
}

/* --- 4. Basic Typography --- */
h1, h2, h3, h4, h5, h6 {
    color: var(--LuxeDrive_text-primary);
    line-height: 1.3;
    margin-bottom: var(--LuxeDrive_spacing-md);
    font-weight: 600; 
}

h1 { font-size: clamp(1.8rem, 5vw, 2.5rem); font-weight: 700; }
h2 { font-size: clamp(1.5rem, 4vw, 2rem); }
h3 { font-size: clamp(1.2rem, 3vw, 1.5rem); }
h4 { font-size: clamp(1.0rem, 2.5vw, 1.2rem); }

p {
    margin-bottom: var(--LuxeDrive_spacing-md);
    color: var(--LuxeDrive_text-secondary);
}
p:last-child { margin-bottom: 0; }

/* General Link Style */
a {
    color: var(--LuxeDriveHeader_sky-blue);
    text-decoration: none;
    transition: color 0.3s ease, opacity 0.3s ease;
}

/* General Link Hover Style (with underline) */
a:hover, a:focus-visible {
    color: var(--LuxeDrive_text-primary);
    opacity: 0.9;
    text-decoration: underline; /* DEFAULT hover effect */
}

strong, b { font-weight: 700; color: var(--LuxeDrive_text-primary); }

hr {
    border: none;
    height: 1px;
    background-color: var(--LuxeDrive_dark-border);
    margin: var(--LuxeDrive_spacing-lg) 0;
}

/* --- 5. Utility Classes --- */
.text-center { text-align: center; }
.text-gradient {
    background: var(--LuxeDriveHeader_cosmic-gradient);
    -webkit-background-clip: text; background-clip: text;
    -webkit-text-fill-color: transparent; color: var(--LuxeDriveHeader_sky-blue); 
}
.icon-gradient { 
     background: var(--LuxeDriveHeader_cosmic-gradient);
    -webkit-background-clip: text; background-clip: text;
    -webkit-text-fill-color: transparent; color: var(--LuxeDriveHeader_sky-blue); 
}


/* --- 6. Common Components --- */

/* Generic Content Container */
.page-container {
    width: 100%;
    max-width: 860px; 
    background: var(--LuxeDrive_dark-surface);
    border-radius: var(--LuxeDrive_border-radius-lg); 
    box-shadow: var(--LuxeDrive_shadow-medium); 
    border: 1px solid var(--LuxeDrive_light-border);
    padding: var(--LuxeDrive_spacing-lg) var(--LuxeDrive_spacing-xl);
    position: relative; 
    overflow: hidden; 
    margin-bottom: var(--LuxeDrive_spacing-lg);
    z-index: 2; 
}
.page-container h1,
.page-container h2 { 
    margin-bottom: var(--LuxeDrive_spacing-lg);
}

/* Optional Glow for Containers */
.page-container.has-glow::after {
    content: ""; position: absolute; inset: 0;
    border-radius: inherit; padding: 2px; 
    background: var(--LuxeDriveHeader_cosmic-gradient);
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0); 
    -webkit-mask-composite: xor; mask-composite: exclude;
    opacity: 0.4; pointer-events: none; z-index: 0; 
}

/* Inner Info Box */
.info-box {
     background: var(--LuxeDriveHeader_dark-elevated); 
     padding: var(--LuxeDrive_spacing-lg);
     border-radius: var(--LuxeDrive_border-radius); 
     margin-bottom: var(--LuxeDrive_spacing-lg);
     border: 1px solid var(--LuxeDrive_light-border);
}
.info-box:last-child { margin-bottom: 0; }

.info-box h2, .info-box h3 { 
    color: var(--LuxeDriveHeader_sky-blue); 
    font-size: 1.25rem; 
    margin-bottom: var(--LuxeDrive_spacing-md);
    text-align: center; 
    font-weight: 600;
}
.info-box p { text-align: center; }

/* Specific style for contact email link area */
.contact-email-link {
    font-size: 1.1rem; 
    word-break: break-word; 
    padding: var(--LuxeDrive_spacing-sm) 0; 
}
.contact-email-link i {
    color: var(--LuxeDriveHeader_sky-blue); 
    margin-right: var(--LuxeDrive_spacing-sm);
    vertical-align: middle; 
}
.contact-email-link a {
    color: var(--LuxeDriveHeader_sky-blue); 
    text-decoration: none; /* Ensure no default underline */
    vertical-align: middle;
}

/* *** ADDED/MODIFIED RULE for Email Link Hover *** */
/* Prevent underline ONLY on contact email link hover, override general rule */
.contact-email-link a:hover, 
.contact-email-link a:focus-visible {
    color: var(--LuxeDrive_text-primary); /* Still change color */
    opacity: 0.9;
    text-decoration: none; /* NO underline */
}


/* Buttons */
.btn {
    display: inline-block;
    padding: var(--LuxeDrive_spacing-md) var(--LuxeDrive_spacing-xl);
    border-radius: var(--LuxeDrive_border-radius-lg); 
    font-size: clamp(0.9rem, 2vw, 1rem);
    font-weight: 600;
    text-decoration: none;
    cursor: pointer;
    transition: transform 0.3s ease, box-shadow 0.3s ease, background-color 0.3s ease, color 0.3s ease, border-color 0.3s ease;
    text-align: center;
    border: 2px solid transparent; 
    line-height: 1; 
    vertical-align: middle; 
}
.btn i { 
    margin-right: var(--LuxeDrive_spacing-sm); 
    vertical-align: middle; 
    line-height: 1; 
    display: inline-block; 
}

.btn-primary {
    background: var(--LuxeDriveHeader_cosmic-gradient);
    color: var(--LuxeDrive_text-primary);
    box-shadow: var(--LuxeDrive_shadow-subtle);
}

.btn-secondary {
    background-color: transparent;
    border: 2px solid var(--LuxeDriveHeader_sky-blue);
    color: var(--LuxeDriveHeader_sky-blue);
}

@media (hover: hover) {
    .btn-primary:hover {
        transform: translateY(-3px);
        box-shadow: 0 6px 20px rgba(67, 198, 252, 0.4);
    }
    .btn-secondary:hover {
        background-color: rgba(67, 198, 252, 0.1);
        color: var(--LuxeDrive_text-primary);
        border-color: rgba(67, 198, 252, 0.5);
        transform: translateY(-2px); 
    }
    /* General button hover - ensure no unwanted underline */
    .btn:hover {
        text-decoration: none;
    }
}
 .btn:active {
     transform: translateY(0px) scale(0.98); 
     box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);
 }

/* --- 7. Animations --- */
@keyframes appearEffect { 
    0% { opacity: 0; transform: translateY(10px); } 
    100% { opacity: 1; transform: translateY(0); } 
}

/* --- 8. Responsive Adjustments --- */
@media (max-width: var(--LuxeDriveHeader_mobile-breakpoint)) {
    html { scroll-padding-top: var(--LuxeDriveHeader_height-mobile); }

    .page-content {
        padding-top: calc(var(--LuxeDriveHeader_height-mobile) + var(--LuxeDrive_spacing-lg));
        padding-left: var(--LuxeDrive_spacing-md);
        padding-right: var(--LuxeDrive_spacing-md);
        padding-bottom: var(--LuxeDrive_spacing-xl); 
    }

    .page-container {
        padding: var(--LuxeDrive_spacing-md) var(--LuxeDrive_spacing-lg);
    }
    .page-container h1,
    .page-container h2 {
        margin-bottom: var(--LuxeDrive_spacing-md); 
    }

    .info-box {
        padding: var(--LuxeDrive_spacing-md);
    }

    .btn {
        padding: var(--LuxeDrive_spacing-sm) var(--LuxeDrive_spacing-lg);
        font-size: 0.9rem;
    }
}

@media (max-width: 480px) {
    .page-content {
        padding-left: var(--LuxeDrive_spacing-sm);
        padding-right: var(--LuxeDrive_spacing-sm);
    }
    .page-container {
        padding: var(--LuxeDrive_spacing-sm) var(--LuxeDrive_spacing-md);
        border-radius: var(--LuxeDrive_border-radius); 
    }
    .info-box {
        padding: var(--LuxeDrive_spacing-md);
        border-radius: var(--LuxeDrive_border-radius-sm);
    }
    .btn {
         border-radius: var(--LuxeDrive_border-radius); 
         font-size: 0.85rem;
    }
}

/* --- 9. Reduced Motion --- */
@media (prefers-reduced-motion: reduce) { 
    html { scroll-behavior: auto; }
    *, *::before, *::after { 
        animation-duration: 0.01ms !important; 
        animation-iteration-count: 1 !important; 
        transition-duration: 0.01ms !important; 
        scroll-behavior: auto !important; 
    } 
}

/* Add these rules to your existing FINAL page.css */

/* --- Styles specific to Disclaimer/Policy pages --- */

/* Container for sections with left border */
.policy-section {
    /* Slightly transparent elevated background */
    background: rgba(30, 30, 56, 0.7); /* Corresponds to rgba(26, 34, 53, 0.7) adjusted */
    padding: var(--LuxeDrive_spacing-lg);
    border-radius: var(--LuxeDrive_border-radius); /* Match info-box radius */
    margin-bottom: var(--LuxeDrive_spacing-lg);
    border-left: 4px solid var(--LuxeDriveHeader_sky-blue);
}
.policy-section:last-child {
    margin-bottom: 0;
}

/* Titles within policy sections */
.policy-section h2 {
    /* Match original styles: white, specific size */
    color: var(--LuxeDrive_text-primary); 
    font-size: 1.4rem; /* Approx 22px */
    margin-bottom: var(--LuxeDrive_spacing-md);
    font-weight: 600;
    text-align: left; /* Override text-center if applied generally */
}

/* Lists within policy sections */
.policy-section ul {
    padding-left: 25px; /* Indentation */
    list-style: disc; /* Standard bullets */
    margin-bottom: var(--LuxeDrive_spacing-md);
}
.policy-section ul li {
    margin-bottom: var(--LuxeDrive_spacing-sm); /* Space between list items */
    color: var(--LuxeDrive_text-secondary); /* Match paragraph color */
}
.policy-section ul li::marker { /* Style bullet color if needed */
    color: var(--LuxeDriveHeader_sky-blue);
}

/* Last updated line style */
.last-updated {
    font-size: 1.1rem; /* Slightly larger */
    margin-bottom: var(--LuxeDrive_spacing-lg);
}
.last-updated strong {
    color: var(--LuxeDriveHeader_sky-blue); /* Highlight "Last Updated:" */
}

/* Specific style for DMCA link (dashed underline) */
a.link-dashed {
    /* Inherit color from standard 'a' */
    text-decoration: none;
    border-bottom: 1px dashed var(--LuxeDriveHeader_sky-blue);
    transition: border-color 0.3s ease, color 0.3s ease;
}
a.link-dashed:hover,
a.link-dashed:focus-visible {
    border-bottom-color: var(--LuxeDrive_text-primary);
    text-decoration: none; /* Override general hover underline */
}

/* Adjustments for the main page container on this page */
.page-container.disclaimer-container {
     max-width: 900px; /* Wider container for disclaimer */
     /* Add gradient background from original style */
     background: linear-gradient(145deg, var(--LuxeDrive_dark-base), var(--LuxeDrive_dark-surface)); 
     border-radius: 15px; /* Match original */
     padding: var(--LuxeDrive_spacing-xl); /* Match original */
     box-shadow: 0 5px 30px rgba(0,0,0,0.3); /* Match original */
}
.page-container.disclaimer-container h1 {
     color: var(--LuxeDriveHeader_sky-blue); /* Match original */
     font-size: 2rem; /* Approx 32px */
     text-shadow: 0 2px 4px rgba(0,0,0,0.3); /* Match original */
     letter-spacing: 0.5px; /* Match original */
}
/* Add these rules to your existing FINAL page.css */

/* --- Styles specific to DMCA Page --- */

/* Box for designated agent email */
.dmca-agent-box {
    background: rgba(13, 17, 24, 0.6); /* Darker inner background */
    padding: var(--LuxeDrive_spacing-lg);
    border-radius: var(--LuxeDrive_border-radius);
    text-align: center;
}
.dmca-agent-box strong {
    color: #64b5f6; /* Specific blue color for heading */
    font-size: 1.2rem;
    display: block;
    margin-bottom: var(--LuxeDrive_spacing-sm);
}
.dmca-agent-box a {
    font-size: 1.2rem; /* Larger email link */
    font-weight: 600;
    /* Use dashed link style */
    border-bottom: 1px dashed var(--LuxeDriveHeader_sky-blue);
    text-decoration: none;
}
.dmca-agent-box a:hover,
.dmca-agent-box a:focus-visible {
    border-bottom-color: var(--LuxeDrive_text-primary);
    text-decoration: none; /* Override general hover */
}

/* List for DMCA requirements */
.dmca-requirements-list {
    list-style-type: none;
    padding: var(--LuxeDrive_spacing-lg);
    background: rgba(13, 17, 24, 0.6); /* Darker inner background */
    border-radius: var(--LuxeDrive_border-radius);
}
.dmca-requirements-list li {
    padding-left: 30px; /* Space for icon */
    position: relative;
    line-height: 1.5;
    margin-bottom: var(--LuxeDrive_spacing-md); /* More space between items */
    color: var(--LuxeDrive_text-primary); /* Use primary text color for list items */
}
.dmca-requirements-list li:last-child {
    margin-bottom: 0;
}
.dmca-requirements-list li i {
    color: var(--LuxeDriveHeader_sky-blue);
    position: absolute;
    left: 0;
    top: 4px; /* Adjust vertical alignment */
    font-size: 1.1em; /* Slightly larger icon */
}

/* Code block example style */
.code-block {
    background: var(--LuxeDrive_dark-base); /* Use darkest background */
    padding: var(--LuxeDrive_spacing-md);
    border-radius: var(--LuxeDrive_border-radius-sm);
    font-family: monospace;
    font-size: 0.95rem;
    overflow-x: auto; /* Allow horizontal scrolling */
    border: 1px solid var(--LuxeDrive_light-border);
    word-break: break-all; /* Break long URLs */
}

/* Note below code block */
.code-block-note {
    font-size: 0.9rem;
    margin-top: var(--LuxeDrive_spacing-md);
    font-style: italic;
    color: var(--LuxeDrive_text-secondary);
}

/* Ordered list styling within policy sections */
.policy-section ol {
    padding-left: 25px; /* Indentation for numbers */
    margin-bottom: var(--LuxeDrive_spacing-md);
}
.policy-section ol li {
    margin-bottom: var(--LuxeDrive_spacing-sm);
    color: var(--LuxeDrive_text-secondary);
}
.policy-section ol li::marker {
    color: var(--LuxeDriveHeader_sky-blue); /* Style numbers */
    font-weight: 600;
}

/* Specific strong tag color in disclaimers */
.policy-section ul strong.highlight {
    color: #64b5f6; /* Specific blue color */
}

/* Modifier for warning section */
.policy-section--warning {
    border-left-color: #ff9800; /* Orange border */
}
.policy-section--warning h2 {
    /* Optionally change title color too */
    /* color: #ff9800; */
}
/* Add these rules to your existing FINAL page.css */

/* --- Styles specific to Privacy Policy Page --- */

/* Container adjustments for Privacy Policy */
.page-container.privacy-container {
    max-width: 800px; /* Specific width for privacy page */
    background: var(--LuxeDrive_dark-surface); /* Use surface, or #121824 if exact match needed */
    border-radius: 10px; /* Specific radius */
    box-shadow: 0 0 20px rgba(0,0,0,0.2); /* Specific shadow */
    padding: var(--LuxeDrive_spacing-lg); /* Approx 20px */
}
.page-container.privacy-container h1 {
     color: var(--LuxeDriveHeader_sky-blue);
     font-size: 1.75rem; /* Approx 28px */
     margin-bottom: var(--LuxeDrive_spacing-lg);
     font-weight: 600; /* Slightly less bold than default h1 */
}

/* Content boxes within privacy policy */
.content-box {
    background: var(--LuxeDriveHeader_dark-elevated); /* Use elevated bg, or #1a2235 if exact match needed */
    padding: var(--LuxeDrive_spacing-lg); /* Approx 20px */
    border-radius: var(--LuxeDrive_border-radius); /* Match 8px */
    margin-bottom: var(--LuxeDrive_spacing-lg); /* Approx 20px */
    border: 1px solid var(--LuxeDrive_light-border); /* Add subtle border */
}
.content-box:last-child {
    margin-bottom: 0;
}

/* Section titles within content boxes */
.content-box h2 {
    color: var(--LuxeDriveHeader_sky-blue);
    font-size: 1.25rem; /* Approx 20px */
    margin-bottom: var(--LuxeDrive_spacing-md); /* Approx 15px */
    font-weight: 600;
    text-align: left;
}

/* Paragraphs within content boxes */
.content-box p {
    color: var(--LuxeDrive_text-primary); /* Use primary text color */
    line-height: 1.6;
    margin-bottom: var(--LuxeDrive_spacing-md); /* Add default margin */
}
.content-box p:last-child {
    margin-bottom: 0;
}

/* Last updated paragraph */
.content-box .last-updated-text {
    /* Specific styling if needed, otherwise inherits from p */
    color: var(--LuxeDrive_text-secondary);
}

/* Custom icon list */
.icon-list {
    list-style-type: none;
    padding: 0;
    color: var(--LuxeDrive_text-primary); /* Text color for list items */
}
.icon-list li {
    padding-left: 25px; /* Space for icon */
    position: relative;
    margin-bottom: var(--LuxeDrive_spacing-sm); /* Approx 10px */
    line-height: 1.5; /* Adjust line height */
}
.icon-list li:last-child {
    margin-bottom: 0;
}
.icon-list li i {
    color: var(--LuxeDriveHeader_sky-blue);
    position: absolute;
    left: 0;
    top: 5px; /* Adjust vertical alignment */
    font-size: 1em; /* Adjust icon size if needed */
    width: 16px; /* Ensure consistent width for alignment */
    text-align: center;
}

/* Contact info link in content box */
.content-box .contact-link a {
    color: var(--LuxeDriveHeader_sky-blue);
    text-decoration: none;
}
.content-box .contact-link a:hover {
    text-decoration: underline;
}
/* Add these rules to your existing FINAL page.css */

/* --- Styles specific to 404 Error Page --- */

/* Container for the error message */
.page-container.error-page-container {
    max-width: 600px; /* Specific width */
    text-align: center;
    padding: var(--LuxeDrive_spacing-xl) var(--LuxeDrive_spacing-lg); /* Approx 40px 20px */
    /* Background, border, shadow inherited from .page-container */
}

/* Large error icon */
.error-icon {
    font-size: 4rem;
    color: #dc3545; /* Specific red color */
    margin-bottom: var(--LuxeDrive_spacing-lg); /* Approx 20px */
}

/* Error page H1 override */
.error-page-container h1 {
    color: var(--LuxeDrive_text-primary);
    font-size: 1.8rem;
    margin-bottom: var(--LuxeDrive_spacing-md); /* Approx 15px */
    /* Reset potential global h1 styles if needed */
    padding: 0;
    background: none;
    text-shadow: none;
    letter-spacing: normal;
}

/* Main error message paragraph */
.error-message {
    color: var(--LuxeDrive_text-secondary);
    font-size: 1.1rem;
    margin-bottom: var(--LuxeDrive_spacing-lg); /* Approx 25px */
}

/* Red notice box for DMCA info */
.error-notice {
    /* Use CSS variables for colors if available, or define specific ones */
    --LuxeDrive_color-danger: #dc3545;
    --LuxeDrive_color-danger-bg: rgba(220, 53, 69, 0.1);
    --LuxeDrive_color-danger-border: rgba(220, 53, 69, 0.2);

    background: var(--LuxeDrive_color-danger-bg);
    border: 1px solid var(--LuxeDrive_color-danger-border);
    border-radius: var(--LuxeDrive_border-radius); /* Approx 6px */
    padding: var(--LuxeDrive_spacing-md); /* Approx 15px */
    margin: var(--LuxeDrive_spacing-lg) auto; /* Approx 20px auto */
    max-width: 95%; /* Use percentage */
    display: flex;
    align-items: flex-start; /* Align icon to top */
    gap: var(--LuxeDrive_spacing-md); /* Approx 12px */
    text-align: left;
}
.error-notice i {
    color: var(--LuxeDrive_color-danger);
    font-size: 1.2rem;
    margin-top: 3px; /* Fine-tune vertical alignment */
    flex-shrink: 0; /* Prevent icon shrinking */
}
.error-notice p {
    color: var(--LuxeDrive_text-secondary);
    font-size: 0.95rem;
    line-height: 1.5;
    margin: 0;
}

/* Container for action buttons */
.error-actions {
    margin-top: var(--LuxeDrive_spacing-lg); /* Approx 25px */
    display: flex;
    justify-content: center;
    gap: var(--LuxeDrive_spacing-md); /* Approx 15px */
    flex-wrap: wrap; /* Allow wrapping on small screens */
}

/* Style buttons specifically within error actions if needed */
/* .error-actions .btn { ... } */
/* Using global .btn-primary and .btn-secondary from page.css */

/* Responsive adjustments for error page */
@media (max-width: 768px) {
    .page-container.error-page-container {
        padding: var(--LuxeDrive_spacing-lg) var(--LuxeDrive_spacing-md); /* Approx 30px 15px */
        margin-top: var(--LuxeDrive_spacing-md);
        margin-bottom: var(--LuxeDrive_spacing-md);
    }
    .error-notice {
        padding: var(--LuxeDrive_spacing-sm); /* Approx 12px */
        max-width: 100%;
    }
    .error-actions {
        flex-direction: column; /* Stack buttons vertically */
        gap: var(--LuxeDrive_spacing-sm); /* Approx 10px */
    }
     .error-actions .btn { /* Make buttons full width */
        width: 100%;
        justify-content: center;
     }
}
.LuxeDriveIndex_main-content { 
    /* Adjust padding if header height variable is different globally */
    padding-top: calc(var(--LuxeDriveHeader_height, 70px) + var(--LuxeDriveHeader_spacing-xl, 32px)); 
    padding-bottom: var(--LuxeDriveHeader_spacing-xl, 32px); 
    padding-left: var(--LuxeDriveHeader_spacing-lg, 24px); 
    padding-right: var(--LuxeDriveHeader_spacing-lg, 24px); 
    width: 100%; 
    display: flex; 
    flex-direction: column; 
    align-items: center; 
    position: relative; 
    z-index: 1; 
    overflow-x: hidden; 
    flex-grow: 1; 
}
.LuxeDriveIndex_main-content::before { 
    content: ""; 
    position: absolute; 
    top: 0; left: 0; 
    width: 100%; height: 100%; 
    background-image: repeating-linear-gradient(-45deg, rgba(67, 198, 252, 0.05), rgba(67, 198, 252, 0.05) 1px, transparent 1px, transparent 15px), repeating-linear-gradient(45deg, rgba(148, 72, 255, 0.05), rgba(148, 72, 255, 0.05) 1px, transparent 1px, transparent 15px); 
    z-index: -1; 
    opacity: 0.04; 
    pointer-events: none; 
}

/* Hero Section */
.LuxeDriveIndex_hero { 
    text-align: center; 
    padding: var(--LuxeDriveHeader_spacing-xl, 32px) 0; 
    margin-bottom: var(--LuxeDriveHeader_spacing-xl, 32px); 
    max-width: 800px; 
    width: 100%; 
    animation: appearEffect 0.8s cubic-bezier(0.2, 0.8, 0.2, 1); 
}
.LuxeDriveIndex_hero h1 { 
    font-size: clamp(1.8rem, 5vw, 2.8rem); 
    font-weight: 700; 
    background: var(--LuxeDriveHeader_cosmic-gradient); 
    -webkit-background-clip: text; background-clip: text; 
    -webkit-text-fill-color: transparent; 
    color: var(--LuxeDriveHeader_sky-blue); 
    margin-bottom: var(--LuxeDriveHeader_spacing-md, 16px); 
    line-height: 1.2; 
}
.LuxeDriveIndex_hero p { 
    font-size: clamp(1rem, 2.5vw, 1.15rem); 
    color: var(--LuxeDrive_text-secondary); 
    margin-bottom: var(--LuxeDriveHeader_spacing-lg, 24px); 
    max-width: 600px; 
    margin-left: auto; 
    margin-right: auto; 
}
.LuxeDriveIndex_hero-buttons { 
    display: flex; 
    justify-content: center; 
    align-items: center; 
    gap: var(--LuxeDriveHeader_spacing-md, 16px); 
    flex-wrap: wrap; 
}

/* Button Styles - Ensure text-decoration: none is here */
.LuxeDriveIndex_btn { 
    display: inline-block; 
    padding: var(--LuxeDriveHeader_spacing-md, 16px) var(--LuxeDriveHeader_spacing-xl, 32px); 
    border-radius: var(--LuxeDrive_border-radius-lg, 8px); 
    font-size: clamp(0.9rem, 2vw, 1rem); 
    font-weight: 600; 
    text-decoration: none !important; /* Add !important as a safeguard if needed, but try without first */
    cursor: pointer; 
    transition: transform 0.3s ease, box-shadow 0.3s ease, background-color 0.3s ease, color 0.3s ease, border-color 0.3s ease; 
    text-align: center; 
    border: 2px solid transparent; 
}
.LuxeDriveIndex_btn-primary { 
    background: var(--LuxeDriveHeader_cosmic-gradient); 
    color: var(--LuxeDrive_text-primary); 
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2); 
}
.LuxeDriveIndex_btn-secondary {
    background-color: transparent; 
    border: 2px solid var(--LuxeDriveHeader_sky-blue); 
    color: var(--LuxeDriveHeader_sky-blue); 
    /* text-decoration: none; /* Already in .LuxeDriveIndex_btn */
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2); 
}
@media (hover: hover) {
    .LuxeDriveIndex_btn-primary:hover { 
        transform: translateY(-3px); 
        box-shadow: 0 6px 20px rgba(67, 198, 252, 0.4); 
    }
    .LuxeDriveIndex_btn-secondary:hover { 
        background-color: rgba(67, 198, 252, 0.1); 
        color: var(--LuxeDrive_text-primary); 
        border-color: rgba(67, 198, 252, 0.5); 
        transform: translateY(-2px); 
    }
}
.LuxeDriveIndex_btn:active { 
    transform: translateY(0px) scale(0.98); 
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2); 
}

/* Features Section */
.LuxeDriveIndex_features { 
    width: 100%; 
    max-width: 1100px; 
    padding: var(--LuxeDriveHeader_spacing-xl, 32px) 0; 
    margin-bottom: var(--LuxeDriveHeader_spacing-xl, 32px); 
}
.LuxeDriveIndex_features h2 { 
    text-align: center; 
    font-size: clamp(1.5rem, 4vw, 2rem); 
    font-weight: 600; 
    margin-bottom: var(--LuxeDriveHeader_spacing-lg, 24px); 
    color: var(--LuxeDrive_text-primary); 
    position: relative; 
    display: inline-block; 
    left: 50%; 
    transform: translateX(-50%); 
}
.LuxeDriveIndex_features h2::after { 
    content: ''; 
    position: absolute; 
    bottom: -8px; 
    left: 10%; 
    width: 80%; 
    height: 3px; 
    background: var(--LuxeDriveHeader_cosmic-gradient); 
    border-radius: 2px; 
}
.LuxeDriveIndex_features-grid { 
    display: grid; 
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); 
    gap: var(--LuxeDriveHeader_spacing-lg, 24px); 
}
.LuxeDriveIndex_feature-item { 
    background: var(--LuxeDrive_dark-surface); 
    padding: var(--LuxeDriveHeader_spacing-lg, 24px); 
    border-radius: var(--LuxeDrive_border-radius-lg, 8px); 
    text-align: center; 
    border: 1px solid rgba(255, 255, 255, 0.05); 
    transition: transform 0.3s ease, box-shadow 0.3s ease; 
    position: relative; 
    overflow: hidden; 
}
.LuxeDriveIndex_feature-item::after { 
    content: ""; 
    position: absolute; 
    inset: 0; 
    border-radius: inherit; 
    padding: 1px; 
    background: var(--LuxeDriveHeader_cosmic-gradient); 
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0); 
    -webkit-mask-composite: xor; mask-composite: exclude; 
    opacity: 0; 
    transition: opacity 0.3s ease; 
    pointer-events: none; 
    z-index: 0; 
}
@media (hover: hover) {
    .LuxeDriveIndex_feature-item:hover { 
        transform: translateY(-5px); 
        box-shadow: 0 8px 25px rgba(0, 0, 0, 0.5); 
    }
    .LuxeDriveIndex_feature-item:hover::after { 
        opacity: 0.3; 
    }
}
.LuxeDriveIndex_feature-item i { 
    font-size: 2.5rem; 
    margin-bottom: var(--LuxeDriveHeader_spacing-md, 16px); 
    background: var(--LuxeDriveHeader_cosmic-gradient); 
    -webkit-background-clip: text; background-clip: text; 
    -webkit-text-fill-color: transparent; 
    color: var(--LuxeDriveHeader_sky-blue); 
}
.LuxeDriveIndex_feature-item h3 { 
    font-size: 1.2rem; 
    font-weight: 600; 
    color: var(--LuxeDrive_text-primary); 
    margin-bottom: var(--LuxeDriveHeader_spacing-sm, 8px); 
}
.LuxeDriveIndex_feature-item p { 
    font-size: 0.9rem; 
    color: var(--LuxeDrive_text-secondary); 
    line-height: 1.6; 
}
@keyframes appearEffect { 
    0% { opacity: 0; transform: translateY(10px); } 
    100% { opacity: 1; transform: translateY(0); } 
}

/* Responsive Adjustments */
@media (max-width: var(--LuxeDriveHeader_mobile-breakpoint, 768px)) {
    /* html { scroll-padding-top: var(--LuxeDriveHeader_height-mobile, 60px); } */ /* Ensure this doesn't conflict with global */
    .LuxeDriveIndex_main-content { 
        padding-top: calc(var(--LuxeDriveHeader_height-mobile, 60px) + var(--LuxeDriveHeader_spacing-lg, 24px)); 
        padding-left: var(--LuxeDriveHeader_spacing-md, 16px); 
        padding-right: var(--LuxeDriveHeader_spacing-md, 16px); 
    }
    .LuxeDriveIndex_hero h1 { 
        font-size: clamp(1.6rem, 7vw, 2.2rem); 
    }
    .LuxeDriveIndex_hero p { 
        font-size: clamp(0.9rem, 3vw, 1rem); 
    }
    .LuxeDriveIndex_hero-buttons { 
        flex-direction: column; 
        align-items: stretch; 
        gap: var(--LuxeDriveHeader_spacing-sm, 8px); 
    }
    .LuxeDriveIndex_btn { 
        width: 100%; 
        max-width: 350px; 
        margin-left: auto; 
        margin-right: auto; 
    }
    .LuxeDriveIndex_features h2 { 
        font-size: clamp(1.3rem, 5vw, 1.7rem); 
    }
    .LuxeDriveIndex_features-grid { 
        gap: var(--LuxeDriveHeader_spacing-md, 16px); 
    }
    .LuxeDriveIndex_feature-item { 
        padding: var(--LuxeDriveHeader_spacing-md, 16px); 
    }
}
@media (max-width: 480px) {
     .LuxeDriveIndex_btn { 
         padding: var(--LuxeDriveHeader_spacing-sm, 8px) var(--LuxeDriveHeader_spacing-lg, 24px); 
         font-size: 0.85rem; 
     }
 }

/* Modal Styles */
.LuxeDriveIndex_modal-overlay {
    position: fixed;
    top: 0; left: 0; width: 100%; height: 100%;
    background-color: rgba(15, 15, 26, 0.8); 
    backdrop-filter: blur(4px);
    display: none; 
    align-items: center;
    justify-content: center;
    z-index: 2000; 
    opacity: 0;
    transition: opacity 0.3s ease;
}
.LuxeDriveIndex_modal-overlay.modal-active {
    display: flex; 
    opacity: 1;
}

.LuxeDriveIndex_modal {
    background: var(--LuxeDrive_dark-surface);
    padding: var(--LuxeDriveHeader_spacing-lg, 24px) var(--LuxeDriveHeader_spacing-xl, 32px);
    border-radius: var(--LuxeDrive_border-radius-lg, 8px);
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.5);
    border: 1px solid rgba(255, 255, 255, 0.1);
    position: relative;
    max-width: 90%;
    width: 450px; 
    text-align: center;
    transform: scale(0.95);
    transition: transform 0.3s ease;
}
.LuxeDriveIndex_modal-overlay.modal-active .LuxeDriveIndex_modal {
    transform: scale(1);
}

.LuxeDriveIndex_modal h3 {
    margin-top: 0;
    margin-bottom: var(--LuxeDriveHeader_spacing-sm, 8px);
    font-size: 1.2rem;
    color: var(--LuxeDrive_text-primary);
}

.LuxeDriveIndex_modal p {
    color: var(--LuxeDrive_text-secondary);
    font-size: 0.95rem;
    margin-bottom: var(--LuxeDriveHeader_spacing-lg, 24px);
    line-height: 1.5;
}

.LuxeDriveIndex_modal-close {
    position: absolute;
    top: 10px;
    right: 10px;
    background: none;
    border: none;
    font-size: 1.8rem;
    color: var(--LuxeDrive_text-secondary);
    cursor: pointer;
    padding: 5px;
    line-height: 1;
    transition: color 0.2s ease, transform 0.2s ease;
}
.LuxeDriveIndex_modal-close:hover {
    color: var(--LuxeDrive_text-primary);
    transform: scale(1.1);
}

.LuxeDriveIndex_modal .LuxeDriveIndex_btn {
    margin-top: var(--LuxeDriveHeader_spacing-sm);
}

/* ============================================= */
/* == End Index Page Styles                  == */
/* ============================================= */


/* --- Ensure Global Anchor Styles Don't Underline Buttons --- */
/* Add this rule globally if not already present, or ensure it exists */
a.btn, /* Target Bootstrap buttons if used elsewhere */
a.LuxeDriveIndex_btn, /* Target index page buttons */
a.button /* Common class name */
/* Add other button-like anchor classes */
{
    text-decoration: none !important; /* Force no underline */
}