/* ==========================================================================
   St. Michael Catholic Church - Lincoln, NE
   Parish (church side) rebrand 2026 - colors and fonts
   Ticket #36762
   --------------------------------------------------------------------------
   Scoped to .site-1 (parish) only. The school side uses .site-2 and loads
   its own override-school.css, so it is intentionally NOT touched here.
   Values come from the client Brand Kit (Warm Red / Warm Ochre / Libre
   Baskerville / Jost). Loads after override.css (priority 0) and wins on
   specificity (html body.site-1).
   ========================================================================== */

@import url('https://fonts.googleapis.com/css2?family=Libre+Baskerville:ital,wght@0,400;0,700;1,400;1,700&family=Jost:ital,wght@0,300;0,400;0,500;0,600;0,700;1,300;1,400;1,500&display=swap');

html body.site-1 {
    --primary-color: #a3473f;   /* Warm Red   (Primary)   */
    --secondary-color: #e0b36e; /* Warm Ochre (Primary)   */
    --tertiary-color: #4a3f3a;  /* Dark Brown (Tertiary)  */

    --primary-rgb: 163,71,63;
    --secondary-rgb: 224,179,110;
    --tertiary-rgb: 74,63,58;

    --title-font-family: 'Libre Baskerville', serif;
    --body-font-family: 'Jost', sans-serif;
}

/* --------------------------------------------------------------------------
   Logo sizing - the new Classic mark is a 1:1 stacked lockup, so it needs an
   explicit height (the stock rules set width:100% / width:20vw for the old
   wide SVG + crest icon). Parish (.site-1) only.
   -------------------------------------------------------------------------- */
@media only screen and (min-width: 50.99rem) {
    html body.site-1 #g-navigation .g-logo img {
        width: auto;
        height: 16vw;
        max-height: 300px;
    }
    html body.site-1 #g-navigation > .g-container > .g-grid:has(.g-logo) {
        padding: 0.8vw !important;
        align-items: center;
    }
    html body.site-1 .footer-icon img {
        width: auto;
        height: 14vw;
        max-height: 250px;
        margin-top: 0 !important;
    }
}
@media only screen and (max-width: 50.99rem) {
    html body.site-1 #g-navigation .g-logo img {
        width: auto;
        height: 34vw;
        max-height: 300px;
    }
    html body.site-1 .footer-icon img {
        width: auto;
        height: 38vw;
        max-height: 250px;
    }
}
