/* =========================
   RESET (removes default spacing)
========================= */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

/* =========================
   BODY (full page background)
========================= */
body {
    background-color: #B03737; /* base red */
    color: #FFFFFF; /* default text color */
}

/* =========================
   HEADER (top section)
========================= */
header {
    background-color: #BF2424; /* brighter red */
    padding: 50px 40px;
}

/* FLEX layout for header */
.header-row {
    display: flex;
    justify-content: space-between; /* pushes items apart */
    align-items: center;
}

/* =========================
   NAME / TITLE
========================= */
.site-title {
    font-family: "Jomolhari", serif;
    font-size: 85px;
    color: #FFFFFF;
}

/* =========================
   NAV BOX (pink rectangle)
========================= */
.nav-box {
    background-color: #E1ADAD; /* pink */
    padding: 50px 40px;
    width: 60%; /* controls size of box */
}

/* =========================
   NAVIGATION LINKS
========================= */
nav {
    display: flex;
    justify-content: space-between;
}

/* default nav links */
nav a {
    color: #000000; /* black */
    text-decoration: none;
    font-family: "Inter", sans-serif;
    font-size: 28px;
    font-weight: 700;
}

/* active page (About Me) */
nav a.active {
    color: #FFFFFF; /* white like your design */
}

/* hover effect */
nav a:hover {
    opacity: 0.7;
}

/* =========================
   MAIN SECTION
========================= */
main {
    background-color: #A83838; /* darker red */
    padding: 40px;
    height: 600px; /* controls section height */
}

/* =========================
   ABOUT TITLE
========================= */
.page-title {
    font-family: "Inter", sans-serif;
    font-size: 72px;
    font-weight: 700;
    margin-bottom: 60px;
}

/* =========================
   PARAGRAPH TEXT
========================= */
.about-copy p {
    font-family: "Inter", sans-serif;
    font-size: 36px;
    font-weight: 700;
    max-width: 700px; /* controls text width */
}

/* =========================
   FOOTER (bottom block)
========================= */
footer {
    background-color: #A26767; /* muted pink */
    height: 180px;
}