:root {
    --pw-primary: #008B8B;   /* Dark Cyan */
    --pw-secondary: #263238; /* Charcoal */
    --pw-accent: #FFC400;    /* Warm Yellow */
    --pw-light: #F7F9FA;     /* Off-White */
    --pw-dark: #1C1C1C;      /* Deep Gray */

    --pw-success: #1B8751;   /* Sea Green */
    --pw-danger: #E57373;    /* Coral Red */
    --pw-info: #4DB6AC;      /* Light Teal */

    --pw-radius: 0.5rem;
    --pw-shadow: 0 2px 8px rgba(0,0,0,0.08);
    --pw-font: 'Inter', 'Nunito', system-ui, sans-serif;
}

/* Global */
body {
    background-color: var(--pw-light);
    color: var(--pw-secondary);
    font-family: var(--pw-font);
    line-height: 1.6;
    margin: 0;
    padding: 0;
}

h1, h2, h3, h4 {
    color: var(--pw-dark);
    font-weight: 600;
}

p {
    margin-bottom: 1rem;
}

/* Buttons */
.btn-pw {
    background-color: var(--pw-primary);
    color: white;
    border-radius: var(--pw-radius);
    border: none;
    padding: 0.6rem 1.2rem;
    font-weight: 500;
    transition: background-color 0.2s ease;
}

.btn-pw:hover {
    background-color: #007373;
    color: white;
}

.btn-accent {
    background-color: var(--pw-accent);
    color: var(--pw-dark);
    border-radius: var(--pw-radius);
    border: none;
}

.btn-accent:hover {
    background-color: #e6b000;
}

/* Cards */
.pw-card {
    background: white;
    border-radius: var(--pw-radius);
    box-shadow: var(--pw-shadow);
    padding: 1.5rem;
    margin-bottom: 1.5rem;
}

.pw-card-header {
    font-weight: 600;
    color: var(--pw-secondary);
    margin-bottom: 1rem;
}

/* Navbar */
.pw-navbar {
    background-color: var(--pw-primary);
    padding: 0.75rem 1.25rem;
}

.pw-navbar a {
    color: white;
    font-weight: 500;
    margin-right: 1.5rem;
    text-decoration: none;
}

.pw-navbar a:hover {
    color: var(--pw-accent);
}

/* Utility Classes */
.pw-center {
    display: flex;
    justify-content: center;
    align-items: center;
}

.pw-section {
    padding: 3rem 1rem;
}

.pw-hero {
    text-align: center;
    padding: 4rem 1rem;
}

.pw-muted {
    color: #6c757d;
}

.pw-shadow {
    box-shadow: var(--pw-shadow);
}

/* Logo sizing */
.pw-logo {
    height: 48px;
    width: auto;
}

.pw-logo-large {
    height: 96px;
    width: auto;
}
