/* MDIX Konstruksi Harmoni — audit fixes */

/* Theme-shop style switcher (gear icon on the left edge). */
.switcher-container {
  display: none !important;
}

/* Google Maps fails without a valid key: hide its error message, keep the grey band behind the form. */
#flat-map > * {
  visibility: hidden !important;
}

@media (max-width: 767px) {
  /* Slider arrow thumbnails covered the hero text on phones. */
  #rev_slider_1078_1 .tparrows {
    display: none !important;
  }
}

@media (max-width: 991px) {
  /* Negative right margin pushed the "Tentang Kami" text past the screen edge. */
  .widget.widget_text.widget_info {
    margin-right: 0;
  }
}

/* ===== design-qa 2026-10-12 ===== */

/* Keyless map embed fills the map band (index + contact). */
#flat-map > * { visibility: visible !important; }
#flat-map .mdix-map { display: block; width: 100%; height: 100%; border: 0; }

/* Fictional partner logos (Viento, Digitalside, "COMPANY") hidden: no real clients yet. */
.flat-row.background-client { display: none; }

/* Hero: darker layer behind the white headline (light concrete photo). */
.rev_slider .slotholder:after { content: ""; opacity: .45; z-index: 1; }
@media (max-width: 1279px) {
  /* Thumbnail arrows overlapped the left-aligned headline. */
  #rev_slider_1078_1 .tparrows { display: none !important; }
}

/* AA contrast: brand yellow #f7c20a stays as background; text on light uses a darker shade. */
#mainnav > ul > li > a:hover,
#mainnav > ul > li.home > a,
.iconbox .box-redmore,
.iconbox .box-title a:hover,
ul.portfolio-filter > li a:hover,
.widget.widget-recent-news ul li .text p,
.widget.widget_categories ul li a:hover,
article ul.meta-post li a:hover,
.breadcrumbs ul li a:hover,
.about-content-title,
.blog-shortcode .more-link a,
a:hover, a:focus { color: #7f5f00; }
.flat-information > li > a:hover, .social-links a:hover, footer a:hover,
.widget_tweets ul li a, .footer a:hover { color: #f7c20a; }
.flat-button, .flat-button.bg-theme, .comment-submit, .comment-reply-link,
.tp-caption.flat-button-slider.bg-orange, ul.portfolio-filter.style1 > li.active a,
.flat-tabs.v1 ul.menu-tab li.active, .flat-tabs.v1 ul.menu-tab li.active a,
.widget.widget_tag .tag-list a.active, .widget.widget_tag .tag-list a:hover,
.accent-button a, .go-top, .go-top i, .sidebar-nav ul li a.active, .sidebar-nav ul li a:hover,
.post-comment li.date, .post-comment li.date .day, .entry-post .more-link a, .entry-post.excerpt .more-link a,
#mainnav ul.submenu > li > a:hover, .flat-accordion .toggle-title.active { color: #1d1d1d; }
.mail-chimp h3, .mail-chimp p { color: #1d1d1d; }
.footer, .footer p, .footer .textwidget p, .footer .widget_nav_menu a, .footer .widget_tweets li,
.bottom .copyright p, footer .widget ul li a { color: #b3b3b3; }

/* Menu button: 44x44 hit area (lines stay 26px). */
@media (max-width: 991px) {
  .btn-menu { width: 44px; height: 44px; margin: 28px 6px 28px 0; }
  .btn-menu:before, .btn-menu:after, .btn-menu span { left: 9px; width: 26px; }
  .btn-menu:focus-visible { outline: 2px solid #7f5f00; outline-offset: 2px; }
  .menu.menu-extra li a { display: inline-block; min-width: 44px; min-height: 44px; line-height: 44px; text-align: center; }
}

/* Touch targets >= 24px for small text links; social icons 44px. */
.social-links a { display: inline-block; min-width: 44px; min-height: 44px; line-height: 44px; text-align: center; }
.top .social-links a { min-height: 40px; line-height: 40px; }
.iconbox .box-title a, .iconbox .box-redmore, ul.portfolio-filter > li a, footer .widget ul li a,
.widget_tweets ul li a, .breadcrumbs ul li a, article ul.meta-post li a, .widget.widget_categories ul li a,
.widget.widget-recent-news ul li .text h6 a, .flat-information > li > a, .comment-reply-link { display: inline-block; min-height: 24px; line-height: 24px; }
.iconbox .box-redmore { display: block; width: max-content; }

/* Contact form over the map: in flow on tablets/phones with 16px gutters. */
@media (max-width: 991px) {
  .flat-row.map .flat-contact-form.inner-map { position: relative; top: auto; left: auto; width: auto; margin: 30px 16px; }
  #flat-map { height: 320px; }
  .mail-chimp .col-sm-7, .mail-chimp .col-sm-5 { width: 100%; float: none; }
  .mail-chimp .subscribe { text-align: left; }
  .mail-chimp .subscribe-form { display: flex; }
  .mail-chimp input[type="email"] { width: auto; flex: 1 1 auto; margin-right: 0; min-width: 0; }
  .mail-chimp input[type="submit"] { position: static; flex: 0 0 auto; }
}
@media (max-width: 767px) {
  .flat-contact-form.style2 { padding: 0; }
  .title-section .title, .mail-chimp h3 { line-height: 1.2; }
}

/* Contact page: address & hours block above the form. */
.mdix-contact-info { max-width: 770px; margin: 0 auto 40px; }
.mdix-contact-title { font-size: 28px; line-height: 1.3; margin-bottom: 12px; color: #222; }
.mdix-contact-list { margin: 20px 0 0; padding: 0; list-style: none; display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 12px 24px; }
.mdix-contact-list li { display: flex; align-items: center; gap: 12px; min-height: 32px; }
.mdix-contact-list i { color: #7f5f00; font-size: 18px; width: 20px; text-align: center; }
.mdix-contact-list a { color: #222; text-decoration: underline; text-underline-offset: 3px; }
.contact-page .flat-contact-form.style2 { max-width: 770px; margin: 0 auto; padding: 0; }

/* Blog: former video slot is now a photo. */
.blog-posts .featured-post > a > img { width: 100%; height: auto; display: block; }
.widget-recent-news .thumb img { width: 90px; height: 90px; object-fit: cover; }

/* CLS: Revolution Slider (fullscreen) is display:none until its JS runs; reserve its height. */
#rev_slider_1078_1_wrapper { min-height: 100vh; background: #303030; }
/* CLS: flexslider hides all slides until init; show the first one from the start. */
.flat-blog-slider .flexslider .slides > li:first-child { display: block; }
.flat-blog-slider .flexslider .slides img { width: 100%; height: auto; }
.flat-blog-slider .flexslider { overflow: hidden; aspect-ratio: 770 / 365; }
.flat-blog-slider .flexslider:has(img[src*="portfolio/s"]) { aspect-ratio: 770 / 513; }
/* Logo link wraps the whole image (was an inline 19px-high box). */
#logo a { display: inline-block; line-height: 0; }
@media (max-width: 767px) {
  /* Revolution scales the hero buttons down to 11px on phones. */
  #rev_slider_1078_1 .tp-caption.flat-button-slider { font-size: 13px !important; }
}

/* AA contrast on inner pages (blog meta, comments, project details, about titles). */
.about-content-text h4.about-content-title, .page-about .about-content-title { color: #7f5f00; }
article ul.meta-post li, article ul.meta-post li a,
.widget.widget_categories ul li a span, .widget.widget_categories .pull-right,
.comments-area ol.comment-list article .comment-metadata .date,
.entry-details-content li p, .entry-details-content li p a { color: #616161; }
.comments-area ol.comment-list article .reply .comment-reply-link,
.comment-respond .comment-submit, .flat-tabs.v1 ul.menu-tab li.active a { color: #1d1d1d; }
.comments-area ol.comment-list article .reply .comment-reply-link:hover,
.comment-respond .comment-submit:hover { color: #fff; }

/* Touch targets >= 24px on inner pages. */
article ul.meta-post li.vote a { display: inline-block; min-width: 24px; text-align: center; }
.widget.widget_search .search-form .search-submit { min-width: 44px; min-height: 44px; }
.flat-tabs ul.menu-tab li a { display: block; min-height: 24px; line-height: 24px; }
.widget-dowload ul.dowload li a { display: inline-block; min-height: 24px; line-height: 24px; }
.entry-details-content li p a { display: inline-block; min-height: 24px; line-height: 24px; }

/* Readable two-line subtitles on about / project detail. */
.about-content-text h6 { line-height: 1.45; }
/* Tweet link stays recognisable as a link on the dark footer. */
footer .widget_tweets ul li a { color: #f7c20a; }

/* Header 992–1199px: menu did not fit (BLOG and search wrapped onto extra rows). */
@media (min-width: 992px) and (max-width: 1199px) {
  #header .header-wrap > .col-md-4 { width: 25%; }
  #header .header-wrap > .col-md-8 { width: 75%; }
  #mainnav > ul > li > a { padding: 0 12px; font-size: 13px; }
  #mainnav > ul > li:last-child > a { padding: 0 0 0 12px; }
  .nav-wrap .menu.menu-extra { padding-left: 8px; }
  .menu.menu-extra li a { padding: 0 8px; }
}
/* Header ≤991px: search icon sits next to the menu button on one row (wrapped below it at 360px). */
@media (max-width: 991px) {
  #header .container { position: relative; }
  #header .header-wrap > .col-md-8 { position: static; min-height: 0; }
  #header .nav-wrap { position: absolute; top: 28px; right: 66px; float: none; }
  #header .nav-wrap .menu.menu-extra { padding-left: 0; }
  #header .menu.menu-extra li a { height: 44px; line-height: 44px; padding: 0; }
}
.widget.widget_categories ul li a { display: block; }
/* Sticky header was 90% white: section titles showed through behind the menu. */
.header.downscrolled { background-color: #fff; }
