/* MDIX Logistik Cakrawala — per-template fixes */

/* WOW.js kept whole sections hidden until scrolled into view (blank in previews and for
   fast scrollers); show the content immediately. */
.wow { visibility: visible !important; animation: none !important; opacity: 1 !important; }
.img-custom-anim-left, .img-custom-anim-right, .img-custom-anim-top { opacity: 1 !important; animation: none !important; }

/* Signature image reads "Kate Atkinson" — does not match the Indonesian director name. */
.trucker__about-content-writer-sign, img[src*="about-content-writer-sign"] { display: none !important; }

/* Brand strip used real third-party logos (DAMRI, Notion, …) as fake clients. */
.trucker__brand-area-home-1 { display: none; }

/* White headline sat on a light cardboard photo; darken the left side so it stays readable. */
.trucker__banner-counter-home-1-wrapper { position: relative; }
.trucker__banner-counter-home-1-wrapper::before {
  content: ""; position: absolute; inset: 0; z-index: 0; pointer-events: none;
  background: linear-gradient(90deg, rgba(6, 46, 57, .85) 0%, rgba(6, 46, 57, .55) 45%, rgba(6, 46, 57, 0) 75%);
}
.trucker__banner-counter-home-1-wrapper > .trucker__container { position: relative; z-index: 1; }

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

/* Footer photo (bulk-replaced, light ship on ice) left white footer text unreadable:
   dark brand overlay above the photo, below the content. */
.trucker__footer-area-home-2 { background-color: #062e39; box-shadow: inset 0 0 0 100vmax rgba(6, 46, 57, .9); }
.trucker__footer-area-home-2 .trucker__footer-info-hilight .trucker__footer-info-number { display: block; white-space: nowrap; }

/* Booking block: dark fallback under the parallax photo (text is white). */
.trucker__booking-system-area { background-color: #062e39; }

/* Branch strip over the map: solid enough to read on phones. */
.trucker__map-area-home-1 .trucker__map-wrapper .trucker__office-location-text-wrapper { background: rgba(6, 46, 57, .96); }

/* Closed phone menu: off-screen AND hidden (not focusable, not in full-page shots); scrolls when long. */
.trucker__mobile-menu { visibility: hidden; overflow-y: auto; transition: right .3s ease-in-out, visibility 0s linear .3s; }
.trucker__mobile-menu.trucker__active { visibility: visible; transition: right .3s ease-in-out, visibility 0s; }
.trucker__mobile-menu-bar { display: inline-flex; align-items: center; justify-content: center; min-width: 44px; min-height: 44px; }

/* WCAG AA: brand teal #2A9D8F with white text / as small text on white is 3.3:1 → #1f7a70 (5.1:1). */
.trucker__btn-style-1,
.trucker__booking-system-area .trucker__booking-system-wrapper .trucker__booking-form,
.trucker__faq-area-home-1 .trucker__faq-wrapper .trucker__faq-right .trucker__faq-contact,
.trucker__footer-area-home-2 .trucker__footer-info-hilight .trucker__footer-info-left,
.trucker__main-sitebar .trucker__search-field button[type=submit],
.trucker__mobile-menu-search button[type=submit],
.trucker__delivary-system .trucker__delivary-items .tucker__delivary-item-text .trucker__delivary-btn,
.trucker__blog-details-left-site .trucker__blog-page-swiching-wrapper .trucker__blog-page-swiching.trucker__current { background-color: #1f7a70; }
.trucker__title-wrapper .trucker__sub-titel,
.trucker__blog-area-home-1 .trucker__blog-inner .trucker__blog-info-box .trucker__blog-btn,
.trucker__comment-right-content .trucker__comment-reply-btn,
.trucker__mobile-menu-copyright .trucker__mobile-menu-copyright-text a { color: #1f7a70; }

/* Counter banner: phone number readable on the photo. */
.trucker__counter-area-home-1 .trucker__counter-banner-contact-number { color: #fff; }

/* Rupiah prices overflowed the cards on phones and at 1024–1440. */
.trucker__pricing-area-home-1 .trucker__pricing-inner .trucker__pricing-itme .trucker__price {
  display: flex; flex-wrap: wrap; justify-content: center; align-items: baseline; column-gap: 4px;
  font-size: clamp(28px, 2.4vw, 38px); line-height: 1.2; white-space: nowrap;
}
.trucker__pricing-area-home-1 .trucker__pricing-inner .trucker__pricing-itme .trucker__price .trucker__item-date { position: static; transform: none; }

@media (max-width: 575px) {
  /* Booking tabs: keep the three tabs on one row */
  .trucker__booking-system-area .trucker__booking-form .nav-pills { flex-wrap: nowrap; gap: 4px; }
  .trucker__booking-system-area .trucker__booking-form .nav-pills .nav-link { padding-left: 8px; padding-right: 8px; min-height: 44px; }
}

/* Sidebar banner image had English text baked in ("Rapid Delivery … Reddit") → HTML call-to-action */
.mdix-sitebar-cta { display: flex; flex-direction: column; gap: 14px; padding: 36px 30px; border-radius: 4px;
  background: linear-gradient(135deg, #062e39 0%, #1f7a70 100%); color: #fff; text-decoration: none; }
.mdix-sitebar-cta__title { font-size: 26px; line-height: 1.25; font-weight: 700; color: #fff; }
.mdix-sitebar-cta__text { font-size: 16px; line-height: 1.6; color: rgba(255, 255, 255, .9); }
.mdix-sitebar-cta__btn { align-self: flex-start; display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 10px 22px;
  background: #fff; color: #062e39; font-weight: 600; border-radius: 3px; transition: background-color .2s, color .2s; }
.mdix-sitebar-cta:hover .mdix-sitebar-cta__btn, .mdix-sitebar-cta:focus-visible .mdix-sitebar-cta__btn { background: #062e39; color: #fff; }

/* Transport cards: text block was 100% wide + 26px offset → poked out of the card on phones. */
@media (max-width: 575px) {
  .trucker__transport-system-home-1 .trucker__transport-system-inner .trucker__transport-system-item .trucker__transport-system-item-text-box .trucker__transport-system-item-text-info { width: auto; right: 26px; }
}
/* Decorative card shapes: keep proportions (crop instead of stretch), stripe stays on the right. */
.trucker__transport-system-home-1 .trucker__transport-system-item-text-box img { object-fit: cover; object-position: right center; }

/* Touch targets (WCAG 2.5.8 + 44px for social icons). */
.trucker__header-area-home-1 .trucker__topbar-social-media a,
.trucker__footer-area-home-2 .trucker__footer-newslatter-icons a,
.trucker__footer-area-home-2 .trucker__footer-copyright-icons a,
.mobile-menu-social-media a { display: inline-flex; align-items: center; justify-content: center; min-width: 44px; min-height: 44px; }
.trucker__footer-area-home-2 .trucker__footer-menu-list li a { display: inline-flex; align-items: center; min-height: 32px; }
.trucker__footer-area-home-2 .trucker__footer-copyright-menu a { display: inline-flex; align-items: center; min-height: 32px; }
.swiper-pagination-bullet { box-sizing: content-box; padding: 2px; background-clip: content-box; }

/* AA contrast on inner pages (grey/teal small text on light backgrounds). */
.trucker__skill-bar-sub-title, .trucker__progress-short-info.trucker__gray-3, .trucker__404-sub-title { color: #5c6670 !important; }
.trucker__blog-details-tranding-arrow-text { color: #1f7a70 !important; }
.trucker__comment-right-content .trucker__comment-reply-btn { color: #17615a; }

/* Pricing page: Rupiah price + button wrapped mid-phrase in the dark bar. */
.trucker__pricing-area-home-2 .trucker__pricing-inner .trucker__prcing-btn-wrapper { flex-wrap: wrap; gap: 8px 16px; padding: 24px 28px; }
.trucker__pricing-area-home-2 .trucker__pricing-inner .trucker__prcing-btn-wrapper:hover { background-color: #1f7a70; }
.trucker__pricing-area-home-2 .trucker__price-day { white-space: nowrap; }
.trucker__pricing-area-home-2 .trucker__price-day .trucker__price { font-size: 22px; }
.trucker__pricing-area-home-2 .trucker__price-day .trucker__days { font-size: 17px; }
.trucker__pricing-area-home-2 .trucker__prcing-btn-wrapper .trucker__pricing-btn { white-space: nowrap; display: inline-flex; align-items: center; min-height: 44px; }

/* Team share pop-up icons: 40×36 targets; header search icon 44px. */
.trucker__team-area-home-1 .trucker__team-inner .trucker__team-item .trucker__team-info .trucker__team-social-media-wrapper ul { background-color: #1f7a70; }
.trucker__team-area-home-1 .trucker__team-inner .trucker__team-item .trucker__team-info .trucker__team-social-media-wrapper ul li { padding: 0; }
.trucker__team-area-home-1 .trucker__team-inner .trucker__team-item .trucker__team-info .trucker__team-social-media-wrapper ul li a { display: flex; align-items: center; justify-content: center; width: 40px; height: 36px; }
.trucker__header-area-home-1 .trucker-search-mobile-menu-btn .trucker__search-icon { display: inline-flex; align-items: center; justify-content: center; min-width: 44px; min-height: 44px; }
/* Topbar icons: 44px targets with no extra gap (the theme's 15px gap pushed the last icon off-screen at 768). */
.trucker__header-area-home-1 .trucker__header-topbar .trucker__header-wrapper .trucker__topbar-right .trucker__topbar-social-media { gap: 0; }
@media (max-width: 991px) {
  .trucker__header-area-home-1 .trucker__header-topbar .trucker__header-wrapper .trucker__topbar-right { gap: 12px; }
  .trucker__header-area-home-1 .trucker__topbar-social-media a { min-width: 36px; }
}

/* Counter banner on phones/tablets: text spans the full width → even dark overlay + dark fallback under the parallax photo. */
.trucker__banner-counter-home-1-wrapper { background-color: #062e39; }
@media (max-width: 991px) {
  .trucker__banner-counter-home-1-wrapper::before { background: rgba(6, 46, 57, .82); }
}

/* Hero 576–1099px: the 2-row icon box sat on the last line of the headline → lift the text block. */
@media (min-width: 576px) and (max-width: 1099px) {
  .trucker__hero-area .trucker__hero-text-content { top: 33%; }
  .trucker__hero-area .trucker__hero-text-content .trucker__hero-title { font-size: 46px; line-height: 1.2; }
}
/* Topbar phone number wrapped mid-number at 768. */
.trucker__header-area-home-1 .trucker__header-topbar-info { white-space: nowrap; }

/* Footer 992–1199px: "Tautan Cepat" and "Buletin" headings touched. */
@media (min-width: 992px) {
  .trucker__footer-area-home-2 .trucker__footer-wrapper { column-gap: 32px; }
  .trucker__footer-area-home-2 .trucker__footer-wrapper .trucker__footer-menu-wrapper { column-gap: 24px; }
}
.trucker__blog-details-tranding-arrows a { display: inline-flex; align-items: center; min-height: 32px; }

/* Header CTA wrapped/clipped ("cak Pesanan") once the search/menu icons got 44px targets. */
.trucker__header-area-home-1 .trucker__header-menu .trucker__menu-wrapper .trucker__header-menu-right { gap: 20px; }
.trucker__header-area-home-1 .trucker__header-menu .trucker__menu-wrapper .trucker__header-menu-right .trucker-search-mobile-menu-btn { gap: 24px; }
.trucker__header-area-home-1 .trucker__header-menu-right .trucker__header-btn { flex-shrink: 0; }
.trucker__header-area-home-1 .trucker__header-btn .trucker__btn-style-1 { display: inline-block; white-space: nowrap; }

/* Verifikasi ulang akhir 2026-10-13: keterangan data contoh */
.mdix-sample-note { display: block; width: 100%; margin: 16px 0 0; font-size: 13px; line-height: 1.4; font-style: italic; font-weight: 400; letter-spacing: 0; text-transform: none; color: #12343b; text-align: center; }