/* MDIX Agensi Sentosa — design-QA fixes (2026-10-13). Linked last in <head>. */

/* ---------- Header: phone/tablet menu up to 991px ---------- */
@media (max-width: 991px) {
  .main-header .main-navigation-area { display: none !important; }
  .main-header .tel-head-sidebar { display: none !important; }
  .main-header .mobile_menu_button {
    display: flex !important;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    line-height: 1;
    top: -2px;
  }
  .main-header .menu-side-option { margin-right: 52px; }
  .main-header .menu-side-option button { width: 40px; height: 40px; }
}
.mobile_menu_button:focus-visible { outline: 2px solid #ffaea1; outline-offset: 2px; }
/* closed off-canvas menu: not reachable by keyboard/screen reader */
.mobile_menu_wrap:not(.mobile_menu_on) .mobile_menu_content { visibility: hidden; }
.mobile_menu .mobile_menu_close { width: 44px; height: 44px; display: flex; align-items: center; justify-content: center; top: 12px; right: 12px; }
.mobile_menu .dropdown .dropdown-btn { width: 44px; height: 36px; text-align: center; top: 0; }
.mobile_menu .mobile-main-navigation .navbar-nav li a { display: block; padding-top: 8px; padding-bottom: 8px; }

/* ---------- Hero (Beranda): title must not run under the photo ---------- */
@media (min-width: 1025px) {
  .slider-style-one .slider-img-wrap { right: 4vw; }
  .slider-style-one .slider-main-img img { width: min(705px, 40vw); height: auto; }
  .slider-main-wrap .slider-text-wrap h1 { font-size: clamp(56px, 6.2vw, 100px); }
}
@media (min-width: 1200px) {
  .slider-style-one .slider-main-wrap .slider-text-wrap { max-width: calc(56vw - (100vw - 1140px) / 2 - 40px); }
}
@media (min-width: 1025px) and (max-width: 1199px) {
  .slider-style-one .slider-main-wrap .slider-text-wrap { max-width: calc(56vw - (100vw - 960px) / 2 - 40px); }
}

/* ---------- Footer ---------- */
/* decorative trailing dot sat outside the heading box */
.footer-widget-content .footer-widget .widget-title { padding-right: 8px; }
.footer-section-1 .footer-copyright h3 { text-transform: none; }
.footer-social a, .side-follow-icon a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 44px;
  min-height: 44px;
}
.footer-widget .w-contact-text a { display: inline-block; padding: 4px 0; }
.footer-widget-content .footer-widget .footer-menu li a { display: inline-block; padding: 3px 0; }
.mdix-footer-map iframe { width: 100%; height: 180px; border: 0; border-radius: 4px; display: block; }

/* ---------- Text contrast (AA) ---------- */
/* salmon #ffaea1 on white/light grey fails AA for small text */
.testimonial-name-degi span,
.counter-author-text span { color: #b4462f !important; }
/* white meta text on the salmon blog card */
.blog-feed-wrap .blog-img-text .blog-text-wrap .blog-post-meta a,
.blog-img-text-innerbox .blog-text-wrap .blog-post-meta a { color: inherit; }
.blog-section-1 .blog-feed-wrap .blog-img-text .blog-text-wrap { color: inherit; }

/* ---------- Touch: portfolio captions are hover-only in the theme ---------- */
@media (hover: none), (max-width: 1199px) {
  .portfolio-section .portfolio-img-item .portfolio-text {
    opacity: 1;
    top: auto;
    bottom: 16px;
    height: auto;
    width: calc(100% - 32px);
    padding: 12px 16px;
    transform: none;
    -webkit-transform: none;
    background-color: rgba(18, 30, 45, 0.88);
  }
  .portfolio-section .portfolio-img-item .portfolio-text h3 { font-size: 22px; padding-top: 4px; }
  .portfolio-section .portfolio-img-item .portfolio-text span { font-size: 15px; }
}

/* ---------- Client name marks (replacing grey 183×43 logo placeholders) ---------- */
.partner-img .mdix-client-mark {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: 0 8px;
  font-family: "Oswald", sans-serif;
  font-size: 22px;
  font-weight: 600;
  letter-spacing: 0.02em;
  color: #4f5965;
  white-space: nowrap;
}

/* ---------- Contact page map (keyless embed) ---------- */
.taeled-googlemap .mdix-map { width: 100%; height: 480px; border: 0; display: block; }
@media (max-width: 767px) { .taeled-googlemap .mdix-map { height: 320px; } }

/* ---------- Phones ---------- */
@media (max-width: 575px) {
  .container { padding-left: 16px; padding-right: 16px; }
}

/* ---------- Round 1 follow-ups ---------- */
.footer-widget-content .footer-widget .widget-title:after { right: 0; }
.slider-style-one .slider-main-img img { max-width: 100%; height: auto; }
[class*="slider-deco"] img { height: auto; max-width: none; }
/* header sits over the dark hero: give it the hero colour so text has a real background */
.header-style-one:not(.sticky-on) { background-color: rgba(18, 30, 45, 0.92); }
/* salmon blog card: dark text instead of white (1.78:1 -> AA) */
.blog-content-wrap .col-lg-4:nth-child(3) .blog-feed-wrap .blog-text-wrap .blog-post-meta,
.blog-content-wrap .col-lg-4:nth-child(3) .blog-feed-wrap .blog-text-wrap .blog-post-meta a,
.blog-content-wrap .col-lg-4:nth-child(3) .blog-feed-wrap .blog-text-wrap h3,
.blog-content-wrap .col-lg-4:nth-child(3) .blog-feed-wrap .blog-text-wrap h3 a { color: #121e2d; }
/* touch targets */
.brand-logo a, .footer-logo a { display: inline-block; padding: 6px 0; }
.blog-feed-wrap .blog-img-text .blog-text-wrap .blog-post-meta a,
.widget-recent-blog .widget-blog-img-text .widget-blog-text .blog-meta a { display: inline-block; line-height: 24px; }
.portfolio-section .portfolio-img-item .portfolio-text span a { display: inline-block; padding: 6px 0; }
.testimonial-section-1 .slick-arrow { width: 32px; height: 32px; font-size: 12px; color: transparent; }

/* ---------- D-20: orange #ff4a17 (3.36:1 on white) darkened to #c43a10 for AA — generated from style.css ---------- */
.blog_pagination .pagination li a:hover { background-color: #c43a10; }
.error-content-area .taeled-btn { background-color: #c43a10; }
.main-header .dropdown-menu li:hover { background-color: #c43a10; }
.header-style-three .menu-side-option button:hover { background-color: #c43a10; }
.header-style-five .header-menu-wrap { background-color: #c43a10; }
.slider-style-three { background-color: #c43a10; }
.slider-style-three .slider-main-wrap .slider-text-wrap p span { background-color: #c43a10; }
.slider-style-three .slider-main-wrap .slider-text-wrap h1 { background-color: #c43a10; }
.feature-content-3 .feature-innerbox-area .feature-box-icon i { color: #c43a10; }
.feature-content-3 .feature-innerbox-area:hover { background-color: #c43a10; }
.about-content-3 .about-mission-vission .ab-mission-vission-wrap:before { background-color: #c43a10; }
.about-page-about-section .about-page-text-wrapper .about-award-icon-text .about-award-icon i { color: #c43a10; }
.about-page-about-section .about-page-text-wrapper .about-award-icon-text .about-award-text h4 { color: #c43a10; }
.case-study-img-text .case-study-img .taeled-btn { background-color: #c43a10; }
.case-study-img-text .case-study-text h3:hover { color: #c43a10; }
.portfolio-pagination li a:hover { background-color: #c43a10; }
.portfolio-details-section .portfolio-details-overview .taeled-btn i { background-color: #c43a10; }
.portfolio-details-section .portfolio-details-video-play i { color: #c43a10; }
.portfolio-details-section .portfolio-next-prev-post .portfolio-np-text span { color: #c43a10; }
.portfolio-details-section .portfolio-details-post-area .col-md-6:nth-child(2) .portfolio-next-prev-post { background-color: #c43a10; }
.faq-page-ques-section .faq-ques-ans .td-faq-header button:after { background-color: #c43a10; }
.faq-contact-innerbox .faq-contact-icon i { color: #c43a10; }
.faq-page-contact-wrapper .col-lg-4:nth-child(2) .faq-contact-innerbox { background-color: #c43a10; }
.faq-contact-area { background-color: #c43a10; }
.faq-contact-area .contact-form-wrapper .taeled-btn button i { background-color: #c43a10; }
.testimonial-section-2 .testimonial-content-wrapper-2 .testimonial-slider-btn2:hover, .testimonial-section-2 .testimonial-content-wrapper-2 .testimonial-slider-btn2:active, .testimonial-section-2 .testimonial-content-wrapper-2 .testimonial-slider-btn2:focus { background-color: #c43a10; }
.testimonial-inner-wrap .testimonial-text .testimonial-author p { color: #c43a10; }
.blog-img-text-innerbox .blog-feed-img:after { background-color: #c43a10; }
.blog-img-text-innerbox .blog-text-wrap .blog-post-meta a:nth-child(2) { color: #c43a10; }
.news_post_item .post_cat { background-color: #c43a10; }
.news_qoute:before { background-color: #c43a10; }
.site_sidebar .single_widget .widget_title:before { background-color: #c43a10; }
.about_widget .ab_widget_social li:hover { color: #c43a10; }
.search_widget button { background-color: #c43a10; }
.wicat_item li .post_counter { background-color: #c43a10; }
.wicat_item li:after { background-color: #c43a10; }
.wicat_item li:hover .post_counter { background-color: #c43a10; }
.social_widget li:hover { background-color: #c43a10; }
.twitter_update .twitter_icon i { color: #c43a10; }
.instagram_feed li { background-color: #c43a10; }
.popular_tag li a:hover { background-color: #c43a10; }
.blog_details_area .s_blog_tag { background-color: #c43a10; }
.blog_details_text blockquote { background-color: #c43a10; }
.blog_details_extra_text .share_post li a:hover { color: #c43a10; }
.blog_details_extra_text .next_prev_post a span { color: #c43a10; }
.blog_details_extra_text .next_prev_post .bar_point i { color: #c43a10; }
.blog_details_extra_text .related_postview .blog-meta { color: #c43a10; }
.blog_details_extra_text .postby_author span { color: #c43a10; }
.comment_formfield .quote_form .contact-info .icon-bg i { color: #c43a10; }
.comment_formfield .quote_form .sub-button button { background-color: #c43a10; }
.service-innerbox-wrap:before { background-color: #c43a10; }
.service-process-icon-text .service-process-icon:before { border-color: #c43a10; }
.service-process-icon-text .service-process-icon:after { color: #c43a10; }
.service-process-icon-text .service-process-icon .sp-serial-no { background-color: #c43a10; }
.service-page-service-section .section-title span { color: #c43a10; }
.service-page-service-inner .service-page-service-icon { background-color: #c43a10; }
.service-tab-wrapper .section-title span { color: #c43a10; }
.service-tab-wrapper .service-tab-btn li a:after { background-color: #c43a10; }
.contact-section-2 { background-color: #c43a10; }
.contact-section-2 .contact-content-innerbox .contact-form-wrapper .taeled-btn button, .contact-section-2 .contact-content-innerbox .contact-form-wrapper .taeled-btn { background-color: #c43a10; }
.contact-section-2 .contact-content-innerbox .contact-form-wrapper .contact-info .icon-bg i { color: #c43a10; }
.contact-section-2 .contact-content-innerbox .section-title span { color: #c43a10; }
.contact-location .td-location-img-text .td-location-text a i { color: #c43a10; }
.skill-progress-bar .skill-set-percent .progress-bar { background-color: #c43a10; }
.skill-progress-bar .skill-set-percent .progress-bar:after { background-color: #c43a10; }
.team-section .section-title span { color: #c43a10; }
.team-img-text-wrapper .team-member-img .member-social-btn .member-social-icon li a { background-color: #c43a10; }
.team-img-text-wrapper .team-member-img .member-social-btn .member-social-icon li a:hover { color: #c43a10; }
.team-img-text-wrapper .team-member-text .team-degi { color: #c43a10; }
.team-service-section .section-title span { color: #c43a10; }
.team-service-section .team-service-skill .skill-progress-bar .skill-set-percent .progress span { color: #c43a10; }
.team-details-section .team-details-text .section-title span { color: #c43a10; }
.team-details-section .team-details-text .team-details-info li i { color: #c43a10; }
.team-details-section .team-details-text .taeled-btn { background-color: #c43a10; }
.taeled-bredcrumb-section .breadcrumb-item-wrap .breadcrumb .breadcrumb-item.active { color: #c43a10; }
.taeled-product .hover-content li { background-color: #c43a10; }
.taeled-product .taeled-product-text .product-price strong { color: #c43a10; }
.shop-color-widget .shop-color-pick:checked ~ .color-value:before { color: #c43a10; }
.shop-color-widget .shop-color-pick:checked ~ .color-value:after { border-color: #c43a10; }
.shop-size-widget .shop-size-pick:checked ~ .size-value:before, .shop-size-widget .shop-size-pick:checked ~ .size-value { color: #c43a10; }
.price-filter-widget .fliter-range-bar { background-color: #c43a10; }
.price-filter-widget .fliter-range-bar::-webkit-slider-thumb { background-color: #c43a10; }
.price-filter-widget .fliter-range-bar::-moz-range-thumb { background-color: #c43a10; }
.price-range-slider .range-value input { color: #c43a10; }
.price-range-slider .range-bar .ui-slider-range { background-color: #c43a10; }
.price-range-slider .range-bar .ui-slider-handle { background-color: #c43a10; }
.price-range-slider .range-bar .ui-slider-handle + span { background-color: #c43a10; }
.product-details-text .product-details-title h4 { color: #c43a10; }
.product-details-price h3 { color: #c43a10; }
.product-details-price .product-rating ul li { color: #c43a10; }
.refresh-shop-option a { color: #c43a10; }
.shop-details-s-btn a:hover { border-color: #c43a10; background-color: #c43a10; }
.share-product-area a:hover { color: #c43a10; }
.product-review-tab-btn .nav-tabs .nav-link:after { background-color: #c43a10; }
.product-review-tab-btn .nav-tabs .nav-link.active { color: #c43a10; }
.review-comment-area .buyer-review-text .buyer-review-rate a { color: #c43a10; }
.review-comment-area .buyer-review-comment-box .customer-rate-option .customer-rate:checked ~ .rate-value:before { color: #c43a10; }
.review-comment-area .buyer-review-comment-box button { background-color: #c43a10; }
.taeled-cart-coupon .taeled-coupon-code button { background-color: #c43a10; }
.taeled-cart-total-area .cart-total-price .v-price { color: #c43a10; }
.footer-section-3 .footer-widget-content .footer-widget .widget-title:after, .footer-section-3 .footer-widget-content .footer-widget .contact-icon-text .w-contact-icon i, .footer-section-3 .footer-bottom-area .footer-bottom-menu a:after, .footer-section-3 .footer-bottom-area .footer-bottom-copyright h4 a { color: #c43a10; }
.footer-section-3 .footer-bottom-area .footer-bottom-menu a:hover:before { background-color: #c43a10; }
.widget-recent-blog .widget-blog-img-text .widget-blog-text .blog-meta a:nth-child(2) { color: #c43a10; }
.line_animation:before { background-color: #c43a10; }
.line_animation .line_area:before { background-color: #c43a10; }
.split-header-area .split-header-share { background-color: #c43a10; }
.split-text-wrap .slider-btn .taeled-btn:nth-child(1) { background-color: #c43a10; }
.taeled-split-section .section-title span { color: #c43a10; }
.taeled-split-section .title-border h2:after { background-color: #c43a10; }
.taeled-split-section .intro-video-form form .taeled-btn, .taeled-split-section .intro-video-form form .taeled-btn button { background-color: #c43a10; }
.dark-version .section-title span { color: #c43a10; }

/* pagination words did not fit the 70px squares */
.portfolio-pagination li:first-child, .portfolio-pagination li:last-child { width: auto; padding: 0 14px; }

/* ---------- Round 1b: phones ---------- */
/* slick arrows of the vertical testimonial list carried hidden "Previous/Next" text; the list itself is clickable/swipeable */
.testimonial-section-1 .slick-arrow { display: none !important; }
/* orange on the dark sections needs the lighter tone, not the darkened one */
.team-service-section .section-title span,
.team-service-section .skill-set-percent span,
.footer-widget .widget-blog-text .blog-meta a,
.widget-recent-blog .widget-blog-img-text .widget-blog-text .blog-meta a { color: #ff8a66; }
/* touch targets (≥24px) */
.header-top-wrapper .header-top-contact a,
.header-top-wrapper .header-top-location a,
.faq-contact-text p a,
.blog_meta li a, .news_more a, .author_img span a, .post_cat a,
.blog_details_text .blog-meta a, .postby_author h3 a,
.latest-blog-widget .blog-meta a, .related_postitem .blog-meta a,
.wicat_item li a, .popular_tag li a { display: inline-block; padding-top: 6px; padding-bottom: 6px; }
.ab_widget_social li a, .social_widget li a, .share_post li a {
  display: inline-flex; align-items: center; justify-content: center; min-width: 32px; min-height: 32px;
}
.reply-btn a { display: inline-block; font-size: 12px; padding: 8px 0; }
.footer-widget .widget-recent-blog .widget-blog-img-text .widget-blog-text .blog-meta a:nth-child(2) { color: #ff8a66; }
.instagram_widget li a, .add_banner a, [class*="instagram"] li a { display: block; }
blockquote span a { display: inline-block; padding: 4px 0; }
/* cart.html (not linked from the menu) */
.taeled-cart-table .product-remove a, .cart-table .product-remove a, td.product-remove a { display: inline-flex; min-width: 32px; min-height: 32px; align-items: center; justify-content: center; }
.quantity-field input.minus, .quantity-field input.plus, input.b-minus, input.b-plus { min-height: 32px; }
.product-delete a { display: inline-flex; min-width: 32px; min-height: 32px; align-items: center; justify-content: center; }

/* ---------- Round 2 ---------- */
@media (max-width: 767px) {
  .footer-bottom-area .footer-bottom-menu { display: flex; flex-wrap: wrap; justify-content: center; gap: 0 18px; float: none; width: 100%; text-align: center; }
  .footer-bottom-area .footer-bottom-menu a { margin: 0 !important; }
  .footer-bottom-area { padding-bottom: 64px; }
  .slider-main-wrap .slider-text-wrap .slider-tag-item span { font-size: 15px; padding-right: 22px; }
  .slider-main-wrap .slider-text-wrap .slider-tag-item span:after { right: 9px; }
}
.footer-section-1 .footer-top-area .footer-social { white-space: nowrap; }
.footer-section-1 .footer-top-area .footer-social a { margin-left: 16px; }
@media (max-width: 767px) { .footer-section-1 .footer-top-area .footer-social a { margin-left: 4px; } }
.footer-widget-content .footer-widget .contact-icon-text .w-contact-text { max-width: 260px; }
/* service-single pricing: text sat directly on a busy keyboard photo */
.service-pricing { position: relative; }
.service-pricing::before { content: ""; position: absolute; inset: 0; background: rgba(238, 242, 245, 0.82); pointer-events: none; }
.service-pricing > .container { position: relative; z-index: 1; }
.pricing-plan-item-list .pricing-table-inner:nth-child(2) .currency-sign { color: #b4462f; }
.team-details-section .team-details-text .team-details-info li span { font-weight: 700; font-family: "Oswald", sans-serif; text-transform: uppercase; color: #121e2d; }
/* FAQ answers were drawn straight onto the background photo */
.td-faq .td-faq-body { background-color: rgba(255, 255, 255, 0.96); padding: 14px 20px; margin-top: -4px; }
/* contact cards: equal height */
.faq-page-contact-wrapper .row > [class*="col-"] { display: flex; }
.faq-page-contact-wrapper .faq-contact-innerbox { flex: 1; }
.blog_details_extra_text { clear: both; padding-top: 24px; }
/* testimonial photo overlapped the quote between 992 and 1399px */
@media (max-width: 1399px) { .testimonial-slider-for .testimonial-main-img { display: none; } }
.footer-widget .w-contact-text span { display: block; }
.about-left-text .section-title h2 { max-width: 470px; }

/* ---------- Round 3: phones ---------- */
.faq-ques-ans .td-faq-header button { padding-right: 64px; }
/* active testimonial name: salmon on light grey was hard to read */
.testimonial-slider-nav .slick-current.slick-center .tst-author-text h3 { color: #b4462f; }
@media (max-width: 767px) {
  .portfolio-section .portfolio-img-item img { height: 280px; width: 100%; object-fit: cover; }
  .tst-author-nav .tst-author-img { width: 56px; height: 56px; margin-right: 14px; }
  .tst-author-nav .tst-author-text { overflow: hidden; }
  .tst-author-nav .tst-author-text h3 { font-size: 17px; }
  .tst-author-nav .tst-author-text h3 .tst-degi { display: block; }
}
/* feature cards: keep the description in its own column next to the icon */
.feature-inner-box .feature-text { overflow: hidden; }
/* decorative triangle sat on the hero title once the hero stacks */
@media (max-width: 1024px) { .slider-style-one .slider-deco1, .slider-style-one .slider-deco2 { display: none; } }

/* Final re-verification 2026-10-13: larger SVG wordmark (the PNG text was ~10px). Theme CSS pins
   the logo to 90–100px wide on phones; size it by height instead. */
.brand-logo img, .m-brand-logo img, .footer-logo img { width: auto !important; height: 26px; max-width: 70vw; }
@media (min-width: 992px) { .brand-logo img, .footer-logo img { height: 30px; } }