/* Handytech footer photo — approved Option 2, six service tools.
   Image reuses the existing optimized service illustration; no third-party requests. */
footer.footer.ht-final-footer {
  background-color: #13221a;
  background-image:
    linear-gradient(90deg, rgba(12,25,20,.94) 0%, rgba(12,25,20,.84) 50%, rgba(12,25,20,.80) 100%),
    url("../service-cards/equipment.webp");
  background-position: center center;
  background-size: cover;
  background-repeat: no-repeat;
  color: #f4f0e8;
}
/* Contrast and focus rings match the existing olive/orange brand styling. */
footer.footer.ht-final-footer .footer-brand p,
footer.footer.ht-final-footer .footer-col ul a,
footer.footer.ht-final-footer .footer-legal,
footer.footer.ht-final-footer .footer-bottom {
  color: #e0e8de;
}
footer.footer.ht-final-footer a:focus-visible,
footer.footer.ht-final-footer button:focus-visible {
  outline: 2px solid #f7ca68;
  outline-offset: 3px;
}
@media (max-width: 790px) {
  footer.footer.ht-final-footer { background-position: 60% center; }
}

/* v4 semantic accessibility: footer section titles use h2 instead of h4.
   Match the prior h4 look exactly; this footer stylesheet loads after the page styles. */
footer.footer.ht-final-footer .footer-col h2 {
  margin: 0 0 15px;
  padding: 0;
  color: #f4f0e8;
  font-size: 14px;
  font-weight: 800;
  line-height: 1.4;
  letter-spacing: .08em;
  text-transform: uppercase;
}
footer.footer.ht-final-footer .footer-col h2:after {
  content: '';
  display: block;
  width: 25px;
  height: 2px;
  background: #e8784c;
  margin-top: 10px;
}

/* Match the home hero height on inner pages (About, Services index). */
@media (min-width: 801px) {
  .inner-hero { min-height: 49vw; }
}

/* Shared header: keep the six nav links on one line on tablet-width screens.
   The small "Call" button steps aside (WhatsApp button and footer contact
   remain available) so nothing overlaps or gets clipped. */
@media (min-width: 801px) and (max-width: 1020px) {
  header.site-header .shared-header-inner { gap: 20px; }
  header.site-header .shared-nav { gap: 16px; }
  header.site-header .shared-actions { gap: 10px; }
  header.site-header .shared-actions .button.button-dark { display: none; }
}

/* --------------------------------------------------------------------------
   No pure-white surfaces.
   Every light panel, note and control uses the site paper colour (#f4f0e8)
   so nothing reads as stark white against the cream theme.
   -------------------------------------------------------------------------- */
html,
body { background-color: #f4f0e8 !important; }

#ht-home .ht-close,
#ht-menu-close,
.hc-demo .hc-review-band .hc-google-panel,
.hc-demo .hc-form .hc-attachment,
.hc-demo .hc-draft,
.hc-demo .hc-contact-note,
.hc-demo .hc-dialog .hc-draft-note,
.hc-demo .hc-guide,
.ht-quick-form,
.ht-offer-strip,
.service-refreshed .ht-price-section,
.ht-contact-steps b,
.ht-info-dialog,
.ht-legal .ht-legal-summary,
.ht-legal .ht-legal-section .ht-legal-note,
.ht-pref-dialog .ht-pref-always,
.ht-pref-dialog .ht-pref-button--secondary:hover,
.eh-veil,
.ht-gallery .steps,
.ht-gallery .icon-button,
.ht-gallery .header-example,
.ht-gallery .photo-upload,
.ht-gallery .album-empty,
.ht-gallery .album-row.is-current,
.ht-gallery .photo-item select,
.ht-gallery .sample-button,
.ht-gallery .photo-item img,
.ht-gallery .dialog-photo {
  background-color: #f4f0e8 !important;
  background-image: none !important;
}

/* --------------------------------------------------------------------------
   Projects gallery cards.
   The site-wide .project-card styles (made for the home page tiles) also match
   the gallery cards, which pushed the photo, text and buttons on top of each
   other and faded the photo. These scoped rules restore the stacked layout.
   -------------------------------------------------------------------------- */
.ht-gallery .project-card {
  background: #f4f0e8;
  color: #20231f;
}

/* Photo box keeps its own positioning and drops the offsets from the generic rule. */
.ht-gallery .project-card > .project-card-media {
  position: relative;
  right: auto;
  bottom: auto;
  left: auto;
}

/* Text block sits under the photo again instead of overlapping it. */
.ht-gallery .project-card > .project-card-body {
  position: static;
  right: auto;
  bottom: auto;
  left: auto;
}

/* Full-strength photo: no 360px floor, no fade, no butter strip. */
.ht-gallery .project-card-media img {
  min-height: 0;
  opacity: 1;
  filter: none;
  border-bottom: 0;
}

.ht-gallery .project-card:hover img { transform: none; }
.ht-gallery .service-tag { text-transform: none; letter-spacing: 0; }