/* Soester Mannenkoor Apollo - ontwerp v1.
   Kleuren uit de huidige apollo-soest.nl: bordeaux, crème en goud.
   De structuur komt uit het framework (base.css); hier alleen tokens en wat
   cosmetiek op het vaste class-contract. Zodra de huisstijl in Ocean staat
   (Site-instellingen), kunnen de tokens hier weg. */

:root {
    --site-accent:          #7A003A;   /* bordeaux */
    --site-accent-hover:    #943558;
    --site-accent-contrast: #FFF6DB;   /* crème op bordeaux */
    --site-ink:             #333333;
    --site-link:            #7A003A;
    --site-bg:              #FFFFFF;
    --site-surface:         #FFF6DB;
    --site-line:            #EADFC2;
    --site-focus:           #DCA057;   /* goud */
    --site-font:            "Open Sans", system-ui, sans-serif;
    --site-font-head:       "Open Sans", system-ui, sans-serif;
    --site-weight-head:     700;
    --site-container:       1100px;
    --site-radius:          6px;
}

/* Kop en menu: bordeaux balk met crème tekst, zoals de huidige site. */
.site-header {
    background: var(--site-accent);
    color: var(--site-accent-contrast);
}
.site-header a,
.site-nav a {
    color: var(--site-accent-contrast);
}
.site-nav a:hover,
.site-nav a[aria-current="page"] {
    background: #333333;
    color: var(--site-accent-contrast);
}

/* Goud als dun accent onder koppen. */
.site-main h1 {
    border-bottom: 3px solid var(--site-focus);
    padding-bottom: .3em;
}

.site-footer {
    background: #333333;
    color: var(--site-accent-contrast);
}
.site-footer a {
    color: var(--site-accent-contrast);
}