/* MDIX Pertanian Sentosa — audit fixes */

/* WOW.js leaves most sections hidden (visibility:hidden) until a scroll check catches them,
   so fast scrolling showed large empty areas. Keep content visible regardless. */
.wow {
  visibility: visible !important;
}

/* Brand strip only contained grey placeholder logos. */
.brand-area {
  display: none !important;
}

/* Hero headline sat on a bright, busy cow photo; darken the left side for legibility. */
.slider-area .single-slider {
  position: relative;
}
.slider-area .single-slider::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(0, 0, 0, 0.6) 0%, rgba(0, 0, 0, 0.35) 45%, rgba(0, 0, 0, 0) 75%);
  pointer-events: none;
}
.slider-area .single-slider > .container {
  position: relative;
  z-index: 1;
}

/* ===== Design QA 2026-10-12 ===== */

/* Body text #777 failed AA on white (4.48:1) and on the cream cards (4.08:1). */
body { color: #5c5c5c; }
.services-content-05 p, .services-box-05 p, .portfolio .button-group button, .button-group button { color: #5c5c5c; }

/* "25+ Years Of Experience" badge is an English text graphic and its play icon led to a seller video. */
.s-about-img .about-text.second-about { display: none !important; }

/* Hero: on phones/tablets the headline spans the whole photo, so the left-only gradient is not enough. */
@media (max-width: 991.98px) {
  .slider-area .single-slider::before { background: rgba(0, 0, 0, 0.5); }
}

/* Phone menu toggle 42x40 -> 44x44 */
.mean-container a.meanmenu-reveal { min-width: 44px; min-height: 44px; box-sizing: border-box; display: flex !important; flex-direction: column; justify-content: center; align-items: center; }
.mean-container a.meanmenu-reveal span { width: 22px; }

/* Blog meta was 11px on phones */
.meta-info ul li, .b-meta ul li { font-size: 12px !important; }

/* Slider dots were 10x10 touch targets: keep the 10px dot, enlarge the hit area to 24px */
.testimonial-active .slick-dots li button,
.services-active .slick-dots li button,
.team-active .slick-dots li button {
  width: 24px !important; height: 24px !important; margin-left: 2px !important;
  background-color: transparent !important; position: relative;
}
.testimonial-active .slick-dots li button::after,
.services-active .slick-dots li button::after,
.team-active .slick-dots li button::after {
  content: ""; position: absolute; left: 7px; top: 7px; width: 10px; height: 10px; border-radius: 50%; background: #cccccc;
}
.testimonial-active .slick-dots .slick-active button::after,
.services-active .slick-dots .slick-active button::after,
.team-active .slick-dots .slick-active button::after { background: #00715d; }

/* Footer links were 18px tall touch targets */
.footer-widget ul li a, .footer-link ul li a, .f-widget-title + .footer-link a, .recent-blog-footer a, .copyright-wrap a, .footer-bottom a { display: inline-block; min-height: 24px; line-height: 24px; }

/* Testimonial name was squeezed by the quote mark on phones ("Wulandari" broke) */
@media (max-width: 575.98px) {
  .testimonial-active .qt-img { right: 16px; top: 16px; }
  .testimonial-active .qt-img img { width: 36px; height: auto; }
  .testimonial-active .testi-author img { width: 60px; height: 60px; object-fit: cover; }
  .testimonial-active .ta-info { padding-right: 40px; }
  .testimonial-active .ta-info h6 { font-size: 17px; }
}

/* Legal links in the footer bar: centred and wrapping as whole items on phones */
@media (max-width: 767.98px) {
  .copyright-wrap ul, .footer-bottom ul { display: flex; flex-wrap: wrap; justify-content: center; gap: 4px 14px; }
  .copyright-wrap li, .footer-bottom li { white-space: nowrap; }
}

/* 404 page message */
.event03 h2.mt-50 { margin-top: 40px; font-size: clamp(26px, 4vw, 40px); }

/* Round 2 */
/* Logo links were 18px tall (inline <a> around a block image) */
.logo a, .f-widget-title a { display: inline-block; }

/* Active gallery filter: keep black on yellow (overridden by the body-text fix above) */
.portfolio .button-group button.active, .button-group button.active { color: #000; }

/* Yellow text on white failed AA (1.52:1): darker amber for text only */
.pro-cat a, .details-price span, .comment-text .avatar-name span, .product-desc-area .nav-link.active, .product-desc .nav-link.active, #desc-tab.active, .nav-tabs .nav-link.active { color: #8a5a00 !important; }
.price span.old-price, .details-price span.old-price { color: #6b6b6b !important; }
.sidebar-widget a, .widget a, .post__tag ul li a, .tag-cloud-link { color: #5c5c5c; }

/* Team role in yellow on green failed AA (3.93:1) */
.team-info p { color: #ffffff; }

/* Gallery filter was a hidden horizontal scroller on phones/tablets (only 2 of 5 buttons visible): wrap instead */
@media (max-width: 991.98px) {
  .button-group { flex-wrap: wrap; justify-content: center; overflow: visible !important; gap: 8px; }
  .button-group button { flex: 0 0 auto !important; margin: 0 !important; min-height: 36px; padding: 6px 14px; }
}

/* Product detail: large photo kept a 180px right margin (room for the side thumbnails) even on phones */
@media (max-width: 767.98px) {
  .product-details-img { margin-right: 0; }
  .product-large-img img { width: 100%; height: auto; }
}

/* Desktop menu wrapped to two lines at 992–1399px ("Hubungi Kami" dropped under the row) */
@media (min-width: 992px) and (max-width: 1399.98px) {
  .second-menu > .row > [class*="col-"]:first-child,
  .second-menu > .row > [class*="col-"]:nth-child(3) { flex: 0 0 auto; width: auto; }
  .second-menu > .row > [class*="col-"]:nth-child(2) { flex: 1 1 0; width: auto; min-width: 0; }
  .second-menu .main-menu > nav > ul { white-space: nowrap; }
  .second-menu .main-menu ul li { margin-left: 18px; }
  .second-menu .main-menu ul li ul li { margin-left: 0; }
}
@media (min-width: 992px) and (max-width: 1199.98px) {
  .second-menu .main-menu ul li { margin-left: 12px; }
  .second-menu .main-menu ul li a { font-size: 15px; }
  .second-header-btn .btn { padding-left: 16px; padding-right: 16px; }
}
@media (min-width: 992px) and (max-width: 1399.98px) {
  .second-menu .logo img { max-width: 200px; height: auto; }
  .second-menu .main-menu ul li { margin-left: 16px; }
}
@media (min-width: 992px) and (max-width: 1199.98px) {
  /* not enough room for six menu items + phone button: keep the search icon, phone stays in footer/offcanvas */
  .second-menu .second-header-btn { display: none; }
}
@media (min-width: 992px) and (max-width: 1399.98px) {
  .second-menu .main-menu { padding-right: 28px; }
}

/* Image links were inline (18px tall hit box around a block photo) */
.team-thumb .brd > a, .services-icon-05 > a, .product__img > a { display: block; }
/* Small text links / icons on product and blog detail */
.product-cat a { display: inline-block; min-height: 24px; line-height: 24px; }
.avatar__info-social a { display: inline-flex; align-items: center; justify-content: center; min-width: 32px; min-height: 32px; }
.widget_recent_entries ul li a, .sidebar-widget .widget ul li a { display: inline-block; min-height: 24px; line-height: 24px; }
.pro-cat a { display: inline-block; min-height: 24px; line-height: 24px; }

/* Newsletter band: background image used background-size: contain, so at 768–1399px the green ended
   before the (longer Indonesian) heading and the form -> "Spesial" was cut by the white brush edge */
@media (max-width: 1399.98px) {
  .newslater-area { background-size: 100% 100% !important; background-color: transparent; }
}
@media (max-width: 991.98px) {
  .newslater-area form.newslater { margin-bottom: 40px; }
}
@media (max-width: 767.98px) {
  .newslater-area.pb-200 { padding-bottom: 240px !important; }
}