/*
 Theme Name:   Twenty Ten Child
 Template:     twentyten
 Version:      1.0
*/

@import url("../twentyten/style.css");

/* ====== Twenty Ten Child — Style Upgrade ====== */

/* 1. Widen the layout for modern screens */
#wrapper,
#access .menu-header,
div.menu,
#colophon,
#branding,
#main {
    max-width: 1100px;
    width: 92%;
    margin: 0 auto;
}
#access {
    width: 100%;
}
#access .menu-header,
div.menu {
    width: 100%;
    margin-left: 0;
}
#container {
    margin: 0;
}
#content {
    margin: 0 0 0 0;
    width: 100%;
}
#primary, #secondary {
    float: none;
    width: 100%;
}

/* 2. Modern fonts */
body, input, textarea {
    font-family: -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    font-size: 17px;
    line-height: 1.65;
    color: #3a3a3a;
}
h1, h2, h3, h4, h5, h6,
#site-title, .entry-title, .page-title, .widget-title {
    font-family: -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    font-weight: 700;
    letter-spacing: -0.01em;
    color: #1a3c1a;
}

/* 3. Header / Body background gradient */
body {
    background: linear-gradient(180deg, #eef2e8 0%, #dde7d3 100%);
}
#wrapper {
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 2px 20px rgba(0,0,0,0.06);
    margin-top: 30px;
    padding: 0 0 20px 0;
}
#header {
    padding: 0;
}
#branding img {
    width: 100%;
    height: auto;
    max-height: 320px;
    object-fit: cover;
    border: none;
    border-radius: 12px 12px 0 0;
    display: block;
    float: none;
}
#site-title {
    float: none;
    width: auto;
    text-align: center;
    padding: 30px 0 6px;
    margin-bottom: 10px;
    font-size: 32px;
}
#site-title a {
    color: #1a3c1a;
}
#site-description {
    float: none;
    width: auto;
    text-align: center;
    margin: 0 0 18px;
}
#branding {
    margin-bottom: 6px;
}

/* 4. Navigation menu */
#access {
    background: #1a3c1a;
    border-radius: 0;
}
#access .menu-header ul,
div.menu ul {
    display: flex;
    flex-wrap: wrap;