/* css/layout.css (v1) */

/* 1) MAIN CONTAINER */
.container {
    max-width: 800px;
    margin: 2rem auto;
    padding: 0 1rem;
}

/* 2) HEADER & NAV */
header {
    background: var(--pp-blue);
    padding: 1.25rem 1rem;
    position: sticky;
    top: 0;
    z-index: 200;
    transition: padding 0.2s ease, background 0.2s ease;
}

.header-divider {
    border: none;
    height: 3px;
    background: var(--pp-yellow);
    margin: 0;
    width: 100%;
}

header.scrolled {
    padding: 0.5rem 1rem;
    background: rgba(10, 23, 78, 0.95);
}

header .container {
    display: flex;
    align-items: center;
    justify-content: flex-start;
}

header nav {
    margin-left: auto;
    display: flex;
    align-items: center;
    gap: 1rem;
}

/* 3) SECTION DIVIDER */
.section-divider {
    border: none;
    height: 4px;
    background: var(--pp-red);
    margin: 4rem auto;
    width: 80px;
}