/* MDIX Konstruksi Sentosa — audit fixes */

/* Scroll-reveal (AOS) kept whole sections invisible until they were scrolled into view;
   show the content immediately so nothing reads as an empty block. */
[data-aos] {
  opacity: 1 !important;
  transform: none !important;
}

/* The team paragraph broke words in the middle ("sat-u", "kepad-a"). */
.team_main-text {
  word-break: normal !important;
  overflow-wrap: break-word;
}

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

/* Hero decoration/photo slots on the homepage never had a real image (1×1 placeholder). */
.hero_deco,
.hero_media {
  display: none !important;
}

/* 404: the background was the grey theme placeholder; light concrete texture keeps the dark text readable. */
.error {
  background: linear-gradient(rgba(255, 255, 255, 0.72), rgba(255, 255, 255, 0.72)), #eef0f2 url(img/mdix/error.jpg) center / cover no-repeat !important;
}

/* Keyless Google Maps embed replaces the theme's JS map (seller API key). */
#map iframe {
  display: block;
  width: 100%;
  height: 100%;
  border: 0;
}

/* Contrast (WCAG AA): theme green #0da574 is 3.16:1 on white → darker green for text on light
   sections; the original green stays on the navy sections where it passes. */
.link-arrow,
.question,
.faq .trigger .question {
  color: #087a55;
}
.primary-bg .link-arrow,
.primary-bg .question {
  color: #0da574;
}
.name,
.contact-info_group .name {
  color: #6b6b6b;
}
.primary-bg .name,
.primary-bg .contact-info_group .name {
  color: #a9a9a9;
}

/* Menu button: 30×28 → 44×44 touch target (lines keep their look). */
.header_trigger {
  width: 44px;
  height: 44px;
  padding: 8px 7px;
  box-sizing: border-box;
}

/* Small text links → at least 24px tall touch targets. */
.link-arrow,
a.category,
.footer .nav-link.link,
.footer a[href^="tel:"],
.footer a[href^="mailto:"],
.info a.link,
.contact_info a.link,
a.link[href^="tel:"],
a.link[href^="mailto:"] {
  min-height: 24px;
  display: inline-flex;
  align-items: center;
}

/* Inner-page banner: the rotated photo sits under the menu and the page title; tone it into the
   navy so white text stays readable (the theme showed a flat grey shape here). */
.page .media {
  opacity: 0.35;
}

/* Video (preload="none" so the 24 MB file is not downloaded on page load): keep the frame size
   without the video's metadata. */
.video video {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 9;
  max-height: 620px;
  object-fit: cover;
}

/* Video play button: navy ring on a light photo was hard to see → solid yellow disc. */
.video_btn {
  background: #ffc631;
  border-color: #ffc631;
  color: #001f3f;
}
.video_btn:focus,
.video_btn:hover {
  background: #fff;
  border-color: #fff;
}
.video_btn:focus i,
.video_btn:hover i {
  color: #001f3f;
}

/* The menu sits on a transparent fixed header over navy sections; give the header that navy itself
   so the white links never depend on what scrolls underneath (same colour as the sticky state). */
.header {
  background-color: #001f3f;
}

/* More small links → 24px touch targets (breadcrumbs, pagination, blog sidebar, post meta). */
.breadcrumbs_item a,
.pagination_list-item_link,
.widgets_widget .link,
.post_article .metadata a,
.metadata .author a {
  min-height: 24px;
  min-width: 24px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.widgets_widget .link {
  justify-content: flex-start;
}
.navigation_control {
  min-height: 24px;
  display: inline-flex;
  align-items: center;
}
.post_article-link {
  display: inline-block;
  padding: 2px 0;
}

/* More AA contrast fixes on white: team roles, reply links, active filter/tab (green → darker green),
   calendar/post navigation labels (light grey → mid grey). */
.main_position,
.comment_panel-action,
.gallery_filters-filter.current,
.tabs .trigger.active,
.tabs h5.trigger.active,
h5.trigger.active {
  color: #087a55;
}
.navigation_control,
.post_nav-item_hint .label {
  color: #6b6b6b;
}
/* Masonry captions sit on a 70% navy layer over the photo (hover/focus only); same look, expressed
   as a layer so the caption is judged against the photo like the other galleries. */
.gallery_masonry-item .overlay {
  background: linear-gradient(rgba(0, 31, 63, 0.7), rgba(0, 31, 63, 0.7));
}
.team_list-item .main_position,
.post_comments .list-item .comment_panel-action,
.tabs_content-item .trigger[aria-expanded="true"],
.faq_accordion-item .trigger[aria-expanded="true"] {
  color: #087a55;
}
.post_comments .list-item .comment_panel-action:hover {
  color: #001f3f;
}

/* Phones: logo name and menu button did not fit on one line (button dropped under the logo). */
@media (max-width: 575.98px) {
  .header .brand_name {
    font-size: 18px;
    line-height: 1.2;
  }
}
/* inline-flex drops the space between a nested <span> and the text ("AdminSolusi", "2Komentar"). */
.widgets_widget .link,
.post_article .metadata a,
.metadata .author a {
  gap: 0.3em;
}

/* Verifikasi ulang akhir 2026-10-13: keterangan data contoh di bawah angka statistik */
.mdix-sample-note {
  display: block;
  width: 100%;
  flex-basis: 100%;
  margin: 12px 0 0;
  font-size: 13px;
  line-height: 1.4;
  font-style: italic;
  font-weight: 400;
  letter-spacing: 0;
  text-transform: none;
  color: inherit;
}
.hero_main .numbers .mdix-sample-note { text-align: right; color: #fff; }
.numbers_list > .mdix-sample-note { grid-column: 1 / -1; list-style: none; max-width: 100%; }
