/* Design-law fixes, section (a) of brands/carcrazytint/design-law-findings.md (content-engine).
   Loaded last on every page so it overrides the compiled Gantry/Salient CSS. Button colors
   (section b) are not touched here. */

/* web.type-scale: H2 at least 1.35x body (body measures 22px on the home and FAQ pages, so the
   "Address" H2 needs about 30px), and H2 at least 1.15x the H3 "Testimonials" title. */
h2.g-title {
  font-size: 2rem !important;
}
h3.g-title {
  font-size: 1.625rem !important;
}
/* On the inner pages the only long paragraphs are the testimonial quotes (1.75rem from 960px,
   1.5rem from 768px, 1.25rem below), so the page-title and section H2s must clear 1.35x of those. */
@media (min-width: 60rem) {
  h2.g-title,
  h2.g-layercontent-title {
    font-size: 2.375rem !important;
  }
}
@media (min-width: 48rem) and (max-width: 59.99rem) {
  h2.g-title,
  h2.g-layercontent-title {
    font-size: 2.0625rem !important;
  }
}
/* The page H1 (WA tint laws, 404) stays at least 1.15x the largest H2 at each width. */
.entry-content h1 {
  font-size: 2.375rem;
}
@media (min-width: 48rem) and (max-width: 59.99rem) {
  .entry-content h1 {
    font-size: 2.4rem;
  }
}
@media (min-width: 60rem) {
  .entry-content h1 {
    font-size: 2.75rem;
  }
}

/* web.measure: page copy (WA tint laws, FAQ, contact, 404) keeps to about 75 characters a line. */
.entry-content p,
.entry-content li {
  max-width: 65ch;
}

/* web.text-size: tablet nav items render at 12px; the reading-text floor is 14px. */
@media (min-width: 48rem) and (max-width: 59.99rem) {
  .g-main-nav .g-toplevel > li > .g-menu-item-container,
  .g-main-nav .g-toplevel > li > .g-menu-item-container .g-menu-item-title {
    font-size: 0.875rem !important;
  }
}

/* web.targets: tap targets at least 44x44px on phones. */
@media (max-width: 47.99rem) {
  .g-social a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 44px;
    min-height: 44px;
    margin: 0 4px;
  }
  .g-promocontent .g-tags a,
  .g-testimonial-author-company a,
  .g-particle > a[href*="ownzered.com"] {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
  }
  .g-promocontent .button-arrow.nopaddingall {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 44px;
    min-height: 44px;
  }
  a.g-footer-logo {
    display: inline-block;
    min-height: 44px;
  }
  /* Links inside page copy (the RCW citations, the contact email): a 44px tap area whose negative
     margin keeps the line spacing as it was. */
  .entry-content p a,
  .entry-content li a {
    display: inline-block;
    min-width: 44px;
    padding: 10px 0;
    margin: -10px 0;
  }
  /* 20px between list items keeps the tap areas of links on neighboring items from overlapping. */
  .entry-content li {
    margin-bottom: 20px;
  }
  #g-totop {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 44px;
    min-height: 44px;
  }
}

/* web.contrast, section (b) approved 2026-11-02: white text on #f6881f (2.48:1) moves to #b75d07
   (4.58:1), same hue. Hover and active shades step darker in the same hue (#8f4805) so white
   text still passes and the hover stays visible. Orange used for lines, borders and dark-text
   accents is unchanged. */
.button {
  background: #b75d07;
}
.button:hover,
.button:active,
.button:focus {
  background: #8f4805;
}
#g-navigation .g-main-nav .g-dropdown {
  background: #b75d07;
  border-color: #8f4805;
}
#g-navigation .g-main-nav .g-dropdown a:hover {
  color: #fff;
}
#g-navigation .g-main-nav .g-sublevel > li:hover > .g-menu-item-container,
#g-navigation .g-main-nav .g-sublevel > li.active > .g-menu-item-container,
#g-navigation .g-main-nav .g-sublevel > li:hover > .g-menu-item-container > .g-selected,
#g-navigation .g-main-nav .g-sublevel > li.active > .g-menu-item-container > .g-selected {
  background: #8f4805;
}
#g-offcanvas,
#g-offcanvas #g-mobilemenu-container ul {
  background: #b75d07;
}
#g-offcanvas #g-mobilemenu-container ul > li:not(.g-menu-item-type-particle):not(.g-menu-item-type-module).active,
#g-offcanvas #g-mobilemenu-container ul > li:not(.g-menu-item-type-particle):not(.g-menu-item-type-module):hover {
  background: #8f4805;
}
#g-offcanvas #g-mobilemenu-container ul > li.g-menu-item-link-parent > .g-menu-item-container > .g-menu-parent-indicator {
  background: #8f4805;
  border-color: #8f4805;
}
#g-offcanvas #g-mobilemenu-container ul > li.g-menu-item-link-parent > .g-menu-item-container > .g-menu-parent-indicator:hover {
  background: #6e3804;
}
/* The phone and email box (.box1) is white text on a second orange, #e37409 (3.11:1). */
.box1.g-outer-box {
  background-color: #b75d07 !important;
}
.box1.moduletable,
.box1.widget,
.box1 > .g-content {
  background-color: #b75d07;
}
/* The theme's translucent white tile texture lifts the box to about 3.5:1 on the home page (the
   other pages already render it flat, since their copy of the texture points at a dead URL). */
body .box1.g-outer-box,
body .box1.moduletable,
body .box1.widget,
body .box1 > .g-content {
  background-image: none !important;
}

/* web.contrast, approved 2026-11-03 (d-20261103-002): orange text on white (#f6881f, 2.48:1) moves
   to the same #b75d07 (4.58:1). Every orange-text link on these pages sits on white; links on the
   dark and orange sections set their own colors and are unchanged. */
a {
  color: #b75d07;
}
#g-navigation .g-main-nav .g-toplevel > li:hover > .g-menu-item-container,
#g-navigation .g-main-nav .g-toplevel > li:hover > .g-menu-item-container > .g-selected,
#g-navigation .g-main-nav .g-toplevel > li.active > .g-menu-item-container,
#g-navigation .g-main-nav .g-toplevel > li.active > .g-menu-item-container > .g-selected,
body .g-offcanvas-toggle,
body .g-offcanvas-toggle:hover,
#g-navigation .g-social a:hover,
#g-copyright a:hover {
  color: #b75d07;
}

/* The empty arrow link keeps the theme's transparent background on hover and focus. */
.button.button-arrow:hover,
.button.button-arrow:active,
.button.button-arrow:focus {
  background: transparent;
}