html,
body,
*,
*::before,
*::after {
    box-sizing: border-box;
}

html {
    margin: 0;
    padding: 0;
    overflow-y: scroll; /* Always show vertical scrollbar */
}

/* Define global variables */
:root {
    /* Colors */
    --color-primary: #007AFF; /* Existing blue */
    --color-primary-hover: #005bb5; /* Darker blue for hover */
    --text-primary: #1d1d1f; /* Main dark text */
    --text-secondary: #6e6e73; /* Lighter grey text */
    --text-link: #06c; /* Standard link blue */
    --text-code: #333; /* Code block text */
    --text-placeholder: #888; /* Placeholder text */
    --background-body: #ffffff; /* Main page background - Changed to white */
    --background-light: #f5f5f7; /* Hero/CTA/Limitations background - Consolidated grey */
    --background-code: var(--background-body); /* Use white for inline code - updated */
    --background-feedback-response: #f5f5f7; /* Feedback response background - Consolidated grey */
    --border-color: #e0e0e0; /* Default border */
    --border-color-secondary: #d2d2d7; /* Slightly darker border */

    /* Fonts */
    --font-primary: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
    --font-code: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
    --font-size-base: 17px;
    --line-height-base: 1.6;
    --font-weight-regular: 400;
    --font-weight-medium: 500;
    --font-weight-bold: 600;

    /* Font Sizes */
    --h2-font-size: 3em; /* Added for h2 and page-intro consistency */

    /* Layout */
    --content-max-width: 1080px;
    --border-radius-section: 20px; /* Added */
}

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;700&display=swap');

/* General Styles */
body {
    font-family: var(--font-primary);
    margin: 0;
    padding: 0;
    line-height: var(--line-height-base);
    font-size: var(--font-size-base);
    color: var(--text-primary);
    background-color: var(--background-body);
    -webkit-font-smoothing: antialiased; /* Smoother font rendering */
    -moz-osx-font-smoothing: grayscale;
    /* Flexbox for sticky footer */
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}

a { /* Default link style */
    color: var(--text-link);
    text-decoration: none;
}
a:hover {
    text-decoration: underline;
}

/* Main Content Area Base */
main { /* Target main element directly */
    /* Basic structural rules, specific sections styled elsewhere */
    flex-grow: 1; /* Allow main content to expand and push footer down */
    overflow-x: hidden !important; /* Prevent potential horizontal overflow from children */
}

/* Base Heading Styles */
/* Apply core styles to H1 within page-title-section */
.page-title-section h1 {
    font-size: 1.5em; /* Adjusted size */
    font-weight: var(--font-weight-bold);
    margin-bottom: 0.5em;
    color: var(--text-primary);
    line-height: 1.1; /* Tighter line height for headings */
    letter-spacing: -0.01em; /* Negative letter spacing */
    text-align: center; /* Ensure title is centered */
}

main.content h2 { /* Often used for section titles */
    font-size: var(--h2-font-size); /* Use variable */
    font-weight: var(--font-weight-bold);
    margin-top: 0em;
    margin-bottom: 0; /* Remove bottom margin */
    color: var(--text-primary);
    line-height: 1.25; /* Adjusted line height */
    text-align: left; /* Set default alignment */
    letter-spacing: -0.005em; /* Negative letter spacing */
}
main.content h2:first-child {
    margin-top: 1em; /* No top margin for the first section title */
}

/* Horizontal Rules in Main Content */
main.content hr {
    margin: 5px 0;
    border: none; /* Often styled per-page or hidden */
}

/* Styles for header, footer, components, pages, and responsiveness are now in separate files */

/* Ensure main H1 is centered - REMOVED as handled by .page-title-section h1 now */
/* main.content h1 {
    text-align: center;
} */

/* Page Type Specific Styles */
/* REMOVED: body.page-specs .feature-category { font-size: 2em; } - Moved to specs-pages.css */

/* Add other page-type specific rules here... */