/* assets/css/style.css */

/* === CSS Custom Properties (Variables) === */
:root {
    /* Brand Colors */
    --color-primary-blue: #004080; /* Deep Corporate Blue */
    --color-primary-blue-light: #1F618D; /* Alternative/Complementary Blue */
    --color-accent-teal: #2ECC71;   /* Vibrant Teal/Aqua */
    --color-accent-teal-dark: #27AE60; /* Muted Professional Green */
    --color-cta-gold: #FFB200;      /* Warm Gold/Orange */
    --color-cta-orange: #FF8C00;    /* Slightly more vibrant Orange */

    /* Neutral Colors */
    --color-background-soft-white: #F8F9FA; /* Soft off-white */
    --color-background-light-grey: #E9ECEF; /* For subtle sections */
    --color-text-dark: #343A40;     /* Primary text, headings */
    --color-text-light: #6C757D;    /* Secondary text */
    --color-white: #FFFFFF;
    --color-black: #000000;
    --color-border-light: rgba(0, 0, 0, 0.08); /* Very subtle border */
}

/* === Basic Reset & Global Styles === */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
}

body {
    font-family: 'Open Sans', sans-serif; /* Body text */
    font-size: 14px; /* Base font size: 14px */
    line-height: 1.7; /* Slightly more line height for readability at small size */
    color: var(--color-text-dark);
    background-color: var(--color-background-soft-white);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

h1, h2, h3, h4, h5, h6 {
    font-family: 'Poppins', sans-serif; /* Headings */
    color: var(--color-primary-blue);
    margin-bottom: 0.5em;
    line-height: 1.3;
}

/* Headings relative to 14px base (1rem = 14px) */
h1 { font-size: 2.5rem; } /* 35px */
h2 { font-size: 2rem; }   /* 28px */
h3 { font-size: 1.5rem; } /* 21px */
h4 { font-size: 1.2rem; } /* 16.8px */

p {
    margin-bottom: 1em;
}

a {
    color: var(--color-primary-blue);
    text-decoration: none;
    transition: color 0.3s ease;
}

a:hover {
    color: var(--color-accent-teal);
}

ul {
    list-style: none;
}

.container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}

/* === Buttons === */
.btn {
    display: inline-block;
    padding: 10px 22px; /* Slightly smaller padding */
    border-radius: 5px;
    font-weight: 600;
    text-align: center;
    transition: all 0.3s ease;
    border: 1px solid transparent; /* Subtle border for clean look */
    cursor: pointer;
    font-size: 1rem; /* 14px */
}

.btn-primary {
    background-color: var(--color-primary-blue);
    color: var(--color-white);
}

.btn-primary:hover {
    background-color: var(--color-primary-blue-light);
}

.btn-accent {
    background-color: var(--color-accent-teal);
    color: var(--color-white);
}

.btn-accent:hover {
    background-color: var(--color-accent-teal-dark);
}

.btn-cta {
    background-color: var(--color-cta-gold);
    color: var(--color-primary-blue); /* Darker text for contrast */
    font-weight: 700;
}

.btn-cta:hover {
    background-color: var(--color-cta-orange);
}

/* Large button variant */
.btn-lg {
    padding: 14px 30px;
    font-size: 1.1rem; /* ~15.4px */
}


/* === Sections === */
section {
    padding: 80px 0; /* More vertical padding for whitespace */
}

.section-light-bg {
    background-color: var(--color-background-light-grey);
}

.text-center {
    text-align: center;
}

.mb-4 { margin-bottom: 1.5rem; }
.mb-5 { margin-bottom: 2.5rem; }
.lead-text {
    font-size: 1.15rem; /* ~16.1px - slightly larger than body for emphasis */
    color: var(--color-text-light);
    max-width: 800px;
    margin-left: auto;
    margin-right: auto;
}