/* MDIX Konstruksi Prima — audit fixes */

/* The sixth team card now uses a different (square) photo file; crop it to the card shape. */
.single-team-member__image img {
  object-fit: cover;
}

/* ===== design-qa 2026-10-12 (round 1) ===== */

/* Logo wordmark (logo-mdix*.png, 2x): fixed display size on every header/footer. */
.brand-logo img,
.footer-widget__logo img {
  width: 158px;
  max-width: 100%;
  height: auto;
}

/* Phone/tablet menu button: 44x44 hit area (icon unchanged). */
.mobile-menu-trigger-wrapper {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  margin-right: -9px;
}
.mobile-menu-trigger {
  transform: translateY(-8px);
}

/* Testimonial arrows: 44x44 targets (were 20x20). */
.testimonial-slider-wrapper .slick-arrow,
.testimonial-multi-slider-wrapper .slick-arrow {
  width: 44px;
  height: 44px;
  bottom: -42px;
  background-position: center;
}
@media only screen and (max-width: 991px) {
  .testimonial-slider-wrapper .slick-arrow,
  .testimonial-multi-slider-wrapper .slick-arrow {
    bottom: -12px;
  }
}
.testimonial-slider-wrapper .slick-arrow.slick-prev,
.testimonial-multi-slider-wrapper .slick-arrow.slick-prev {
  transform: translateX(calc(-100% - 2px));
}
.testimonial-slider-wrapper .slick-arrow.slick-next,
.testimonial-multi-slider-wrapper .slick-arrow.slick-next {
  transform: translateX(2px);
}

/* Footer: the fence photo (light gravel on the right) made the contact text unreadable;
   dark overlay + cover so the photo never tiles. */
.footer-area {
  position: relative;
  background-size: cover;
  background-position: center;
}
.footer-area::before {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(30, 32, 40, 0.86);
}
.footer-area > .container {
  position: relative;
  z-index: 1;
}

/* Footer social icons: 40px squares (were 30px). */
.footer-widget .social-icons li {
  margin-right: 10px;
}
.footer-widget .social-icons li a {
  width: 40px;
  height: 40px;
  line-height: 40px;
  font-size: 16px;
  padding: 0;
}
.off-canvas-widget-social a {
  display: inline-block;
  min-width: 40px;
  line-height: 40px;
  text-align: center;
  margin: 0 4px;
}

/* Popular-post thumbnails now reuse the post photos (landscape) → crop to the square slot. */
.sidebar-blog .image img {
  width: 90px;
  height: 90px;
  object-fit: cover;
}

/* index.html: tall service photo poked 3px out of the viewport at 1200–1399px. */
@media (min-width: 992px) {
  .service-area img.float-lg-end,
  img.float-none.float-lg-end {
    max-width: 100%;
  }
}

/* index-2.html: hero title ran under the absolute photo on the right (992px+). */
@media (min-width: 992px) {
  .hero-area .hero-slider-content {
    max-width: 44%;
  }
}

/* Testimonial: the absolute opening quote sat on top of the first letter of long quotes. */
.single-testimonial__text {
  padding-left: 32px;
  padding-right: 32px;
}

/* CTA phone number broke at its hyphen ("+62 811-0000-" / "0000"). */
.cta-block__bold-text {
  white-space: nowrap;
}
.testimonial-cta-area .cta-block__bold-text {
  font-size: min(40px, 8.4vw);
}
@media (max-width: 479px) {
  .cta-block__bold-text {
    font-size: min(35px, 8.4vw);
  }
}

/* index: team card photos share one portrait shape. */
.team-slider-wrapper .single-team-member__image img {
  width: 100%;
  aspect-ratio: 510 / 775;
  object-fit: cover;
}

/* index-2.html hero: dark title sat on the black crane lattice → light wash behind the text side. */
.hero-area .single-hero-slider--background::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(255, 255, 255, 0.84) 0%, rgba(255, 255, 255, 0.72) 45%, rgba(255, 255, 255, 0) 80%);
}
.hero-area .single-hero-slider__abs-img {
  z-index: 1;
}
.hero-area .single-hero-slider--background > .container {
  position: relative;
  z-index: 2;
}

/* index: keep the tall service photo's proportions when it is narrowed to its column. */
@media (min-width: 992px) {
  img.float-none.float-lg-end {
    object-fit: cover;
  }
}

/* Phone/tablet header: the theme switched it to position:fixed after 180px of scroll, pulling
   the page up by the header height (CLS ≈ 0.25). Sticky keeps its space in the flow. */
.mobile-header.header-sticky,
.header-sticky.is-sticky.mobile-header {
  position: -webkit-sticky;
  position: sticky;
  top: 0;
  z-index: 999;
  width: 100%;
  animation: none;
}

/* Hero slider: slides stacked (2 × hero height) until slick initialised → content jumped up. */
.hero-slick-slider-wrapper:not(.slick-initialized) > .single-hero-slider ~ .single-hero-slider {
  display: none !important;
}

/* Contrast (AA): grey post dates, white text on the yellow brand colour. */
.blog-post-slider__content .post-date {
  color: #6b6b6b;
}
.page-pagination li.active a,
.page-pagination li a:hover,
.contact-form button,
.contact-form button:hover,
.comment-form input[type="submit"],
.comment-form input[type="submit"]:hover {
  color: #2B2D37;
}

/* Touch targets ≥ 24px: breadcrumb and "Selengkapnya" text links. */
.page-breadcrumb-links li a,
.see-more-link {
  display: inline-block;
  min-height: 24px;
  line-height: 24px;
}
.blog-details .meta li a {
  display: inline-block;
  min-height: 24px;
  line-height: 24px;
}

/* index-2.html hero below 992px: the small absolute photo covered the title; hide it and wash
   the whole B/W background so the dark title stays readable. */
@media (max-width: 991px) {
  .hero-area .single-hero-slider__abs-img {
    display: none;
  }
  .hero-area .single-hero-slider--background::before {
    background: rgba(255, 255, 255, 0.78);
  }
}

/* Final re-verification 2026-10-13: wordmark redrawn (MDIX box + "Konstruksi Prima" in one line; was two tiny lines ~6px). */
.brand-logo img, .footer-widget__logo img { width: 180px; max-width: 100%; }
/* Client-logo strip only shows the same seller placeholder mark ("CONSTRUCT") five times: hide it. */
.brand-logo-area { display: none !important; }