/*
Theme Name: VP Prestige Awards
Theme URI: http://example.com/vp-prestige
Author: Your Name
Author URI: http://example.com
Description: A prestigious black and gold theme for Virtual Photography awards, inspired by high-fashion aesthetics.
Version: 1.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: vp-prestige
*/

/* =========================================
   1. CSS Variables & Global Reset
========================================= */
:root {
    --color-bg-main: #0a0a0a;    /* Deep Near-Black */
    --color-bg-secondary: #111111; /* Slightly lighter black for cards/sections */
    --color-gold-accent: #D4AF37;  /* Rich Metallic Gold */
    --color-gold-text: #E5C15B;    /* Readable Text Gold */
    --color-text-light: #F4F4F4;   /* Off-white for body text */
    
    --font-headline: 'Oswald', sans-serif; /* Placeholder font */
    --font-body: 'Open Sans', sans-serif;  /* Placeholder font */
    
    --section-spacing: 120px; /* Consistent spacing between big sections */
}

/* A basic modern reset to ensure browsers behave the same */
*, *::before, *::after {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

html {
    scroll-behavior: smooth;
}

body {
    background-color: var(--color-bg-main);
    color: var(--color-text-light);
    font-family: var(--font-body);
    line-height: 1.6;
    overflow-x: hidden; /* Prevent horizontal scrollbars */
}

/* Global Typography Styling based on the inspiration */
h1, h2, h3, h4, h5, h6 {
    font-family: var(--font-headline);
    text-transform: uppercase;
    letter-spacing: 1px;
    font-weight: 700;
    line-height: 1.1;
    color: var(--color-gold-text); /* Default headlines to gold */
}

h1 {
    font-size: clamp(3rem, 8vw, 6rem); /* Massive responsive font size */
}

h2 {
    font-size: clamp(2rem, 5vw, 4rem);
}

a {
    text-decoration: none;
    color: var(--color-gold-accent);
    transition: all 0.3s ease;
}

a:hover {
    color: var(--color-text-light);
}

/* Standard Container */
.container {
    width: 90%;
    max-width: 1400px; /* Wide layout like the inspiration */
    margin: 0 auto;
}