/* MDIX Hukum Sentosa — per-template audit fixes */

/* "Legal Awards": two of the four award logos are grey size-label placeholders. Hide the row. */
.text--center:has(.awards-img),
hr.divider:has(+ .text--center .awards-img) {
  display: none !important;
}

/* Footer: light text sat on a bright photo. Darken the photo so links read. */
.footer .bg-stretch::after {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(10, 24, 56, 0.82);
}

/* Header phone: the Indonesian number is longer than the original, keep it on one line. */
.header-inner__tel {
  white-space: nowrap;
  font-size: 22px;
}

/* Service tiles: white titles on bright photos. Add a soft dark layer behind the text. */
.service-card__bg::after {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(10, 24, 56, 0.45);
}

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

/* Sections whose numbers were invented by the theme (stats, Income/Expense chart) stay in the file but are hidden. */
.mdix-hide { display: none !important; }

/* Line icons that replace the placeholder/photo icons in service and value cards. */
.mdix-icon { display: block; width: 40px; height: 40px; flex-shrink: 0; }
.card__image .mdix-icon { color: #1d40ca; }
.card--overlay:hover .card__image .mdix-icon { color: #fff; }
.cta-wrap__icon .mdix-icon { color: #43b1e7; width: 36px; height: 36px; }

/* Phone menu: real button with a 44px hit area; closed menu is not focusable. */
.nav-opener { box-sizing: content-box; padding: 12px 10px; margin: -12px -10px; color: inherit; cursor: pointer; }
.nav-opener span { left: 10px; right: 10px; }
.nav-opener::after, .nav-opener::before { left: 10px; right: 10px; }
.nav-opener::after { top: 12px; }
.nav-opener::before { bottom: 12px; }
body.nav-active .nav-opener::after { top: 50%; }
body.nav-active .nav-opener::before { bottom: 50%; }
@media (max-width: 1023px) {
  .header--primary .nav-drop, .header--secondary .nav-drop { visibility: hidden; }
  body.nav-active .header--primary .nav-drop, body.nav-active .header--secondary .nav-drop { visibility: visible; }
}

/* Text over photos: dark layer so white titles stay readable on light photos. */
.hero-tile .bg-stretch::after,
.section-intro .bg-stretch::after,
.section-testimonial .bg-stretch::after,
.section.text--white .bg-stretch::after,
.contact-tile ~ .bg-stretch::after,
section:has(.contact-tile) > .bg-stretch::after {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(5, 20, 44, 0.55);
}
.section-testimonial .bg-stretch::after { background: rgba(5, 20, 44, 0.68); }
.hero-tile, .section-intro, .section-testimonial, .section.text--white, .footer { background-color: #0a1838; isolation: isolate; }

/* Touch targets >= 24px (WCAG 2.5.8). */
.footer-list__link { display: inline-block; padding: 4px 0; }
.btn.btn--link, .btn.btn--outline { min-height: 24px; }
.listing-meta__item a { display: inline-block; padding: 5px 0; }
.swiper-pagination-bullet { box-sizing: content-box; padding: 7px; background-clip: content-box; }

/* Sidebar promo that replaces a seller banner with English text baked into the image. */
.mdix-promo {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
  padding: 48px 28px;
  text-align: center;
  color: #fff;
  background: linear-gradient(160deg, #051c2c 0%, #042c7b 100%);
}
.mdix-promo:hover { color: #fff; text-decoration: none; }
.mdix-promo__title { font-family: "Libre Baskerville", serif; font-size: 26px; line-height: 1.3; }
.mdix-promo__text { font-size: 15px; line-height: 1.6; color: #d6e2f3; }

/* Contact tile: office hours line replaces the app-store badges. */
.contact-list p.contact-list__link { margin: 0; }
.hero-tile .bg-stretch::after { background: rgba(5, 20, 44, 0.4); }

/* Office hours line in the contact tile: same size as the e-mail line, not the big phone number. */
.contact-list p.contact-list__link { font-family: inherit; font-size: 16px; line-height: 1.5; }

/* Home header floats over the hero photo: soft dark gradient behind the white menu text. */
.header--secondary:not(.header--fixed) { background-image: linear-gradient(180deg, rgba(5, 20, 44, 0.6) 0%, rgba(5, 20, 44, 0) 100%); }

/* Social icons: 44px hit area without changing the visual spacing. */
.social__link { min-width: 44px; min-height: 44px; margin: -10px; }
.footer-list__link { padding: 5px 0; }

/* Light-blue buttons with white text fail AA (2.4:1): darker blue of the same hue (5:1). */
.btn--secondary, .search-form__btn { background-color: #1a73b5; border-color: #1a73b5; }
.btn--secondary:hover, .search-form__btn:hover { background-color: #051c2c; border-color: #051c2c; }

/* Contact tile sits on a photo: dark base colour so the text never lands on white. */
section:has(.contact-tile) { background-color: #0a1838; isolation: isolate; position: relative; }

/* More touch targets >= 24px. */
.breadcrumbs__link, .post-pagination__link, .list a, .blog-post__title a, .btn-share { display: inline-block; padding-top: 4px; padding-bottom: 4px; }
.btn-share { display: inline-flex; }
.tag-list__link { font-size: 12px; }

/* Team strip: names only appear on mouse hover. On phones/tablets and touch screens show name +
   role under each photo, two photos per row on phones. */
@media (hover: none), (max-width: 1023px) {
  .team:has(.team-member) { max-width: none; }
  .team__item:has(.team-member) { width: 50%; }
  .team-member__img { height: auto; aspect-ratio: 4 / 5; }
  .team-member__expanded { position: static; opacity: 1; padding: 12px 6px 22px; background: transparent; color: #fff; pointer-events: auto; }
  .team-member__expanded::before { display: none; }
  .team-member .team-title, .team-member .team-position { opacity: 1; transform: none; color: #fff; }
  .team-member .team-title { font-size: 17px; line-height: 1.3; margin-bottom: 4px; }
  .team-member .team-position { font-size: 13px; }
  .team-member .contact-info { display: none; }
}
@media (hover: none) and (min-width: 1024px) { .team__item:has(.team-member) { width: 25%; } }

/* Footer contact row: keep the phone number and e-mail on one line. */
.footer a[href^="tel:"], .footer a[href^="mailto:"] { white-space: nowrap; }

/* Contact tile phone number: one line on phones. */
.contact-list__link { white-space: nowrap; }
@media (max-width: 575px) { a.contact-list__link { font-size: 30px; } }

/* Lawyer profile: the name card sits on a desk photo; light veil keeps it calm and readable. */
.section-tile__item:has(.btn-holder) > .bg-stretch::after { content: ""; position: absolute; inset: 0; background: rgba(255, 255, 255, 0.72); }
