#primary_nav a:focus,
#primary_nav button:focus,
#dd-primary_nav a:focus,
#dd-primary_nav button:focus {
  scroll-margin-top: 110px;
}

#dd-primary_nav button {
  display: block;
  width: 100%;
  padding: 0 5px 0 0;
  border: 0;
  background: transparent;
  color: inherit;
  cursor: pointer;
  font: inherit;
  line-height: inherit;
  text-align: left;
}

/* Visible keyboard-focus indicator for the primary nav, utility bar, and
   footer links (axe/keyboard audit: no focus ring anywhere in the header). */
#primary_nav a:focus-visible,
#dd-primary_nav button:focus-visible,
.utility_wrap a:focus-visible,
.nav a:focus-visible,
#footer_wrap a:focus-visible,
.custom_button_1 a:focus-visible {
  outline: 3px solid #231f20;
  outline-offset: 2px;
  border-radius: 2px;
}

/* ============================================================
   MobileCTA.tsx: mobile only bottom action bar. Moved out of a
   body <style> element (Nu validator disallows <style> in body)
   into this site wide, head loaded stylesheet. Fully static, no
   props or state involved. Loads after vortala-style.css and
   responsive-overrides.css so equal specificity ties still
   resolve the same way they did as an inline block.
   ============================================================ */
.mobile-cta-bar {
  display: flex !important;
}

@media (min-width: 769px) {
  .mobile-cta-bar {
    display: none !important;
  }
}

/* ============================================================
   FloatingReviewWidget.tsx: desktop review card vs mobile
   compact badge. Moved out of a body <style> element for the
   same Nu validator reason. Fully static, no props or state
   involved.
   ============================================================ */
.review-widget-desktop {
  display: block;
}

.review-widget-mobile {
  display: none;
}

@media (max-width: 767px) {
  .review-widget-desktop {
    display: none !important;
  }

  .review-widget-mobile {
    display: flex !important;
  }
}

/* ============================================================
   Home.tsx home page: moved out of a body <style> element for
   the same Nu validator reason.

   #banner-4166, .home #container_wrap, and the 960px media
   query below are fully static (carried over verbatim; note
   #banner-4166 does not currently match any element in the
   Home.tsx markup, so this rule is inert until/unless that id
   is reintroduced, and is kept as is to preserve prior
   behavior).

   #banner-3580's background-image is the one genuinely dynamic
   declaration (its URL depends on the cfHeroImage() build time
   Cloudflare image resizing flag). It is set directly as an
   inline style on the element in Home.tsx instead of living
   here, since it only ever feeds that one property.
   ============================================================ */
#banner-4166 {
  position: fixed;
  bottom: 20px;
  left: 5%;
  z-index: 999;
}

.home #container_wrap {
  z-index: 1001;
}

@media screen and (max-width: 960px) {
  #banner-4166 {
    display: none;
    pointer-events: none;
  }
}

/* Blog subscribe buttons: white on #ff850b is 2.4:1. Keep the protected
   orange (responsive-overrides.css) and switch the label to the site ink
   color: #231f20 is 6.6:1 on #ff850b and 4.9:1 on the #e9651f hover. */
.blog_subscribe_form .blog-subscribe-open.button,
.blog-subscribe-modal-form .blog-subscribe-submit.button,
.blog_subscribe_form .blog-subscribe-open.button:hover,
.blog_subscribe_form .blog-subscribe-open.button:focus,
.blog-subscribe-modal-form .blog-subscribe-submit.button:hover,
.blog-subscribe-modal-form .blog-subscribe-submit.button:focus {
  color: #231f20 !important;
}

/* unsized-images / image-aspect-ratio: the blog card crops are square by
   design (130x130 / 200x200) but sources are 4:3; height:auto on mobile left
   them unsized. aspect-ratio + object-fit keeps the crop honest and sized. */
.blog #content .blog-image {
  aspect-ratio: 1 / 1;
  object-fit: cover;
}
.blog #container_wrap .blog-entry-photo .blog-image {
  height: auto;
}
#container_wrap .latest-post .blog-entry-photo img {
  object-fit: cover;
}