/* Mitchell overrides on top of Constra's style.css.
   Kept small on purpose: the template's look is unchanged, only Mitchell's assets are adapted. */

/* Mitchell's logo is a stacked lockup, so it needs more height than Constra's 35px wordmark */
.logo img { height: 72px; }
@media (max-width: 991px) { .logo img { height: 60px; } }

.top-certs { font-size: 14px; color: #2c2c2c; padding: 9px 12px; display: inline-block; }
.info-box-subtitle a { color: inherit; }

/* Footer logo: stacked white lockup */
.footer-logo { width: 150px; height: auto; }
.footer .working-hours a { color: #fff; }

/* Service icons are Mitchell's own line icons, recoloured to the template yellow */
.ts-service-box-img img { width: 60px; height: 60px; object-fit: contain; }

/* Certification rows on the home page */
.cert-box { margin-bottom: 25px; align-items: center; }
.cert-box .ts-service-box-img img { width: 80px; height: 80px; margin-right: 10px; }

/* Client and certification logos come in mixed sizes */
.clients-logo img { max-height: 48px; width: auto; max-width: 100%; }
.cert-logo { min-height: 120px; padding: 10px 20px; }
.cert-logo img { max-height: 90px; filter: none; }
.cert-caption { font-size: 14px; line-height: 1.4; }

.services-intro { max-width: 720px; margin: -20px auto 50px; }
.subscribe-call-to-acton h4 a.text-dark { color: #1f1f1f !important; }
.confirm-note { background: #fff4cc; color: #5c4700; padding: 6px 10px; font-size: 14px; display: inline-block; }

/* Constra's demo slides are pre-darkened photos; Mitchell's are bright site photos,
   so darken them in CSS to keep the slide text readable. */
.banner-carousel .banner-carousel-item { position: relative; }
.banner-carousel .banner-carousel-item::before {
  content: ""; position: absolute; inset: 0;
  background: linear-gradient(0deg, rgba(0,0,0,.55), rgba(0,0,0,.45));
}
.banner-carousel .slider-content { position: relative; z-index: 1; }
.banner-area::before { content: ""; position: absolute; inset: 0; background: rgba(0,0,0,.55); }
/* .banner-text is already absolutely centred with z-index 1 in style.css; don't override its position */

/* ---- Design review fixes (2026-09-27) ---- */

/* Body copy: 15px -> 16px for readability */
body, p { font-size: 16px; }

/* Contrast: white on #ffb600 is 1.8:1. Dark text on yellow is 11.9:1 and reads like site signage. */
.btn-primary, .header-get-a-quote .btn-primary { color: #1f1f1f; }
.slider.border { color: #fff; }
.slider.border:hover { color: #1f1f1f; }
.call-to-action-box .action-title, .slide-title-box { color: #1f1f1f; }

/* Contrast: yellow text on white is 1.8:1. Use a dark amber (5:1) where yellow sits on white. */
.accordion-group .card-header .btn[aria-expanded=true],
.quote-author,
.dropdown-menu li a:hover, .dropdown-menu li a:focus,
.dropdown-menu > li.active > a,
.ts-service-info .learn-more:hover,
.service-box-title a:hover { color: #946800; }

/* Visible keyboard focus */
a:focus-visible, button:focus-visible, .btn:focus-visible, label:focus-within {
  outline: 3px solid #ffb600; outline-offset: 2px;
}

/* Project cards: name and sector always visible (no hover on touch screens),
   whole photo links to the project page */
.shuffle-item .project-img-container:after {
  opacity: 1; pointer-events: none;
  background: linear-gradient(to top, rgba(0,0,0,.85) 0, rgba(0,0,0,.35) 40%, rgba(0,0,0,0) 65%);
}
.shuffle-item .project-img-container:hover:after { background: linear-gradient(to top, rgba(0,0,0,.9) 0, rgba(0,0,0,.5) 55%, rgba(0,0,0,.15) 100%); }
.shuffle-item .project-img-container .project-item-info {
  top: auto; bottom: 16px; margin-top: 0; padding: 0 20px; pointer-events: none;
}
.shuffle-item .project-img-container .project-item-info a { pointer-events: auto; }
.shuffle-item .project-img-container .project-item-info-content { opacity: 1; transform: none; }
.shuffle-item .project-img-container .project-item-info-content .project-item-title { margin-bottom: 6px; }
.shuffle-item .project-img-container .project-item-info-content .project-cat { font-size: 12px; }
.project-card-link { display: block; }

/* Project facts: values were 12px grey, smaller than their labels */
.project-info-label { font-size: 13px; text-transform: uppercase; letter-spacing: .03em; margin-bottom: 2px; color: #555; }
.project-info-content { font-size: 16px; color: #212121; margin-bottom: 14px; }
.back-link { display: inline-block; padding: 12px 0; font-weight: 700; color: #212121; }

/* Mobile header: the address/phone/email stack pushed the hero ~480px down.
   Keep a compact logo row; the phone number lives in the sticky nav bar instead. */
.nav-call { display: none; }
@media (max-width: 991px) {
  .top-bar, .header-right { display: none; }
  .header-one .logo-area { padding: 12px 0; }
  .header-one .logo { margin-bottom: 0 !important; }
  .logo img { height: 52px; }
  .nav-call {
    display: inline-flex; align-items: center; gap: 8px; margin-left: auto;
    min-height: 44px; padding: 0 4px; font-weight: 700; font-family: "Montserrat", sans-serif; font-size: 15px;
  }
  .site-navigation .nav-call { color: #fff; }
  .nav-call i { color: #ffb600; }
  .site-navigation .nav-call:hover { color: #ffb600; text-decoration: none; }
  .navbar-toggler { min-width: 44px; min-height: 44px; }
  .into-sub-title { font-size: 26px; line-height: 1.25; }
}

/* Service sidebar: active/hover item was white on yellow (1.8:1) */
.sidebar ul.service-menu li.active a, .sidebar ul.service-menu li:hover a { color: #1f1f1f; }

/* Compact footer */
.footer-main { padding: 40px 0 24px; }
.footer .widget-title { margin-bottom: 14px; }
.footer-logo { width: 110px; margin-bottom: 10px; }
.footer-about p { font-size: 14px; line-height: 22px; margin: 0; }
.footer .working-hours { font-size: 14px; line-height: 24px; }
.footer-widget ul.list-arrow { columns: 2; column-gap: 24px; }
.footer-widget ul.list-arrow li { padding: 4px 0; font-size: 14px; break-inside: avoid; }
.footer-widget ul.list-arrow li a, .footer-widget ul.list-arrow li:before { color: #a3a3a3; }
.copyright { padding: 12px 0; }
@media (max-width: 767px) {
  .footer-main { padding: 28px 0 12px; }
  .footer-widget { margin-top: 24px !important; }
  .footer-widget:first-child { margin-top: 0 !important; }
  .footer-widget ul.list-arrow { columns: 1; }
}