/* T1 Template - Bare Bones */
:root {
    --t1-accent:      #2a6ebb;
    --t1-font:        system-ui;
    --t1-page-bg:     #888888;
    --t1-wrap-bg:     #ffffff;
    --t1-wrap-width:  100%;
    --t1-header-bg:   #ffffff;
    --t1-header-text: #333333;
}

*, *::before, *::after { box-sizing: border-box; }

body {
    margin: 0;
    font-family: var(--t1-font);
    color: #333;
    background: var(--t1-page-bg);
}

#wrapper {
    background: var(--t1-wrap-bg);
    max-width: var(--t1-wrap-width);
    margin: 0 auto;
}

a             { color: var(--t1-accent); }
a:hover       { text-decoration: underline; }

/* ---- Shared container ---- */
#menu-top,
#header,
#menu-bottom,
#utility-bar,
#main-wrap,
#blurb-row,
#footer-row,
#full-footer {
    width: 100%;
    padding: 0 1rem;
}

/* ---- Header ---- */
#header {
    padding: 1rem;
    border-bottom: 2px solid var(--t1-accent);
    background: var(--t1-header-bg);
}
#header-image      { width: 100%; overflow: hidden; }
#header-image img  { width: 100%; height: auto; display: block; }
#site-title        { font-size: 1.8rem; font-weight: bold; color: var(--t1-header-text); }
#site-title a      { text-decoration: none; color: inherit; }
#site-tagline      { font-size: 0.95rem; color: var(--t1-header-text); opacity: 0.75; }

/* ---- Menu bars ---- */
#menu-top    { background: var(--t1-accent); }
#menu-bottom { background: #f0f0f0; border-bottom: 1px solid #ddd; }

/* ---- Utility bar ---- */
#utility-bar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.4rem 1rem;
    background: #f5f5f5;
    border-bottom: 1px solid #ddd;
}

/* ---- Main content area ---- */
#main-wrap {
    display: flex;
    gap: 1rem;
    padding: 1rem;
    align-items: flex-start;
}
#left-sidebar,
#right-sidebar { flex: 0 0 200px; }
#content       { flex: 1 1 auto; min-width: 0; }

/* ---- Blurb row ---- */
#blurb-row {
    display: flex;
    gap: 1rem;
    padding: 1rem;
}
.blurb-col { flex: 1; }

/* ---- Footer ---- */
#footer-row {
    display: flex;
    gap: 1rem;
    padding: 1rem;
    border-top: 1px solid #ddd;
}
.footer-col { flex: 1; }

#full-footer {
    padding: 0.75rem 1rem;
    background: #f5f5f5;
    border-top: 1px solid #ccc;
    text-align: center;
    font-size: 0.85rem;
}

/* ---- Responsive ---- */
@media (max-width: 768px) {
    #main-wrap,
    #blurb-row,
    #footer-row { flex-direction: column; }
    #left-sidebar,
    #right-sidebar { flex: 1 1 auto; }
    #utility-bar { flex-direction: column; align-items: flex-start; gap: 0.25rem; }
}