/* Reset and Base Styles */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    /*outline: 1px solid red !important;*/
}

.page-container {
  max-width: 1440px;
  margin: 0 auto; /* Centers the container */
  padding: 0 2rem; /* Adds padding on the sides for smaller screens */
}

html, body {
    height: 100%;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    overflow-x: hidden;
}

html {
    scroll-behavior: smooth;
    scroll-padding-top: 80px; /* prevents fixed header covering anchors */
}

/* Add padding to the body to account for the fixed header */
body {
    padding-top: 64px; /* Height of your fixed header */
}

/* CSS Variables for Component System */
:root {
    --form-padding: 12px;
    --form-border: 2px solid #ddd;
    --form-border-radius: 8px;
    --form-font-size: 16px;
    --form-transition: all 0.3s ease;
    --primary-color: #00A3E4;
    --primary-hover: #33B5E8;
    --text-color: #333;
    --border-color: #ddd;
    --border-hover: #bbb;
    --focus-shadow: 0 0 0 3px rgba(0, 163, 228, 0.1);
    --icon-color: #666;
    --icon-size: 14px;
    --spacing-sm: 8px;
    --spacing-md: 12px;
    --spacing-lg: 16px;
}

/* Background */
.parallax-bg {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    background-image: url('https://external-content.duckduckgo.com/iu/?u=https%3A%2F%2Fpictures.porsche.com%2Frtt%2Firis%3FCOSY-EU-100-1711coMvsi60AAt5FwcmBEgA4qP8iBUDxPE3Cb9pNXkBuNYdMGF4tl3U0%2525z8rMHIspbWvanYb%25255y%2525oq%2525vSTmjMXD4qAZeoNBPUSfUx4RmHlCgI7Zl2dioCxkF%2525vUqCNwuWXsO7QNeV6iTxjgzhRc2LUjqA7fQrmVOJUPYDImTB8VuyY0oVk0DBRlqvzpQNqjdtAsvyJ5I&f=1&nofb=1&ipt=3e4ca436eea447a62a3b03b91dbac994aeb97c1b613f6079ddf84d0236cc7ab1');
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    background-attachment: fixed;
    z-index: -10;
}

/* Gradient overlay div to fade background to black at bottom */
.parallax-gradient-overlay {
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 70vh;
    background: linear-gradient(
        to bottom,
        rgba(0, 0, 0, 0) 0%,
        rgba(0, 0, 0, 0.3) 25%,
        rgba(0, 0, 0, 0.6) 50%,
        rgba(0, 0, 0, 0.9) 75%,
        rgba(0, 0, 0, 1) 100%
    );
    pointer-events: none;
    z-index: -9;
}

/* REMOVED: .main-content-wrapper is no longer needed */
/* The content-wrapper was also an unnecessary layer */
.content-wrapper {
    /* position: relative; */ /* Removed */
    /* z-index: 1; */ /* Removed */
    /* min-height: 100vh; */ /* Removed */
}

/* Content Sections */
.content-section {
    background: rgba(255, 255, 255, 0.95);

    margin-bottom: 2rem; /* Keep bottom margin */
    /* Restore padding to give the white background box internal spacing */
    padding: 4rem 2rem; /* Restore horizontal padding here */
    border-radius: 8px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.1);
    border: 1px solid rgba(255, 255, 255, 0.2);
    position: relative;
    /* Margin for the content-section itself, to create spacing from page edges */
    margin-left: 2rem;
    margin-right: 2rem;
}

.section-title {
    font-size: 2.5rem;
    color: #2a5298;
    text-align: center;
    margin-bottom: 2rem;
    font-weight: 700;
}
