/* Match the public landing page shell while keeping the Q&A content on its own page. */
body:is(.page-faq, .page-privacy, .page-content-policy) { --font-body: ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", "Avenir Next", sans-serif; --font-display: var(--font-body); --mdb-career-navy: #202c43; --mdb-career-green: #5e5bc8; --mdb-career-green-dark: #4b48ae; --mdb-career-green-soft: #f0effb; --mdb-career-paper: #faf9f7; --mdb-career-line: #e5e7eb; --mdb-career-muted: #647386; color: #273247; background: #faf9f7; font-family: var(--font-body); font-size: 15px; line-height: 1.4; }
:is(.page-faq, .page-privacy, .page-content-policy) :is(button, input) { font: inherit; }
:is(.page-faq, .page-privacy, .page-content-policy) :is(h1, h2, h3) { font-family: inherit; letter-spacing: -.025em; }
:is(.page-faq, .page-privacy, .page-content-policy) .app-shell { padding-bottom: 0; }
body:is(.page-faq, .page-privacy, .page-content-policy) .topbar { position: sticky; top: 0; z-index: 60; padding: 0; border-bottom: 1px solid #e5e7eb; background: rgba(255,255,255,.96); backdrop-filter: blur(14px); }
body:is(.page-faq, .page-privacy, .page-content-policy) .topbar > .container, body:is(.page-faq, .page-privacy, .page-content-policy) .hero > .container, body:is(.page-faq, .page-privacy, .page-content-policy) footer > .container { width: min(1180px, calc(100% - 70px)) !important; max-width: 1180px !important; padding-inline: 0; }
body:is(.page-faq, .page-privacy, .page-content-policy) .topbar-shell { min-height: 70px; padding: 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; }
body:is(.page-faq, .page-privacy, .page-content-policy) .brand { min-height: 70px; gap: 10px; padding: 7px 0; }
body:is(.page-faq, .page-privacy, .page-content-policy) .brand-mark { width: 48px; height: 48px; flex-basis: 48px; padding: 4px; border: 1px solid #e5e7eb; border-radius: 11px; background: #fff; box-shadow: none; }
body:is(.page-faq, .page-privacy, .page-content-policy) .brand-mark img { width: 100%; height: 100%; object-fit: contain; }
body:is(.page-faq, .page-privacy, .page-content-policy) .desktop-nav a { padding: 10px 13px; border-radius: 9px; color: #647386; background: transparent; box-shadow: none; font-size: 13.5px; font-weight: 500; line-height: 1.25; }
body:is(.page-faq, .page-privacy, .page-content-policy) .desktop-nav a::after { display: none; }
body:is(.page-faq, .page-privacy, .page-content-policy) .desktop-nav a:hover, body:is(.page-faq, .page-privacy, .page-content-policy) .desktop-nav a.active { color: #4b48ae; background: #f0effb; }
:is(.page-faq, .page-privacy, .page-content-policy) .language-switch { min-height: 35px; border-color: #e5e7eb; box-shadow: none; }
:is(.page-faq, .page-privacy, .page-content-policy) .language-switch a { min-height: 27px; font-weight: 550; }
body:is(.page-faq, .page-privacy, .page-content-policy) .language-switch a.active, body:is(.page-faq, .page-privacy, .page-content-policy) .language-switch a[aria-current="true"] { color: #fff; background: #5e5bc8; box-shadow: none; }
:is(.page-faq, .page-privacy, .page-content-policy) .hero { padding: 0; background: #faf9f7; }

.public-faq { min-height: 58vh; padding: clamp(28px, 4vw, 48px) 0 64px; }
.public-faq__hero { position: relative; isolation: isolate; display: flex; justify-content: space-between; align-items: end; gap: 24px; min-height: 250px; overflow: hidden; margin-bottom: 28px; padding: clamp(26px, 4vw, 46px); border: 1px solid #35415b; border-radius: 16px; color: #fff; background: linear-gradient(110deg, rgba(27,39,62,.98), rgba(32,44,67,.92) 58%, rgba(32,44,67,.72)), url("../img/mdb-career-hero.webp") center / cover; }
.public-faq__hero::after { content: ""; position: absolute; z-index: -1; right: -3%; bottom: -12%; width: min(32%, 290px); height: 100%; background: url("../images/aceh-corner-motif-light.svg?v=2026092703") right bottom / contain no-repeat; opacity: .14; pointer-events: none; }
.public-faq__back { display: inline-flex; align-items: center; gap: 8px; margin-bottom: 26px; color: #d7deeb; font-size: 12.5px; font-weight: 550; text-decoration: none; }
.public-faq__back:hover { color: #fff; }
.public-faq__eyebrow { display: block; color: #c9d3ff; font-size: 12px; font-weight: 600; letter-spacing: .045em; }
.public-faq__hero h1 { margin: 10px 0; color: #fff; font-size: clamp(30px, 4vw, 46px); font-weight: 620; line-height: 1.1; }
.public-faq__hero p { max-width: 680px; margin: 0; color: #d0d9e8; font-size: 14px; line-height: 1.5; }
.public-faq__total { flex: 0 0 auto; padding: 9px 14px; border: 1px solid rgba(255,255,255,.22); border-radius: 999px; background: rgba(255,255,255,.1); color: #fff; font-size: 13px; font-weight: 600; white-space: nowrap; }
.public-faq__toolbar { display: grid; gap: 8px; margin-bottom: 18px; }
.public-faq__toolbar label { display: flex; align-items: center; gap: 10px; width: 100%; min-width: 0; border: 1px solid #dce3eb; border-radius: 10px; background: #fff; padding: 0 15px; color: #6e79a8; box-shadow: 0 8px 24px rgba(32,44,67,.035); }
.public-faq__toolbar input { flex: 1; width: 100%; min-width: 0; min-height: 46px; border: 0; outline: 0; background: transparent; color: #273247; font-size: 14px; }
.public-faq__toolbar label:focus-within { border-color: #7774c7; box-shadow: 0 0 0 3px rgba(102,98,186,.1); }
.public-faq__toolbar output { justify-self: end; color: #647386; font-size: 13px; white-space: nowrap; }
.public-faq__list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; gap: 14px; }
.public-faq__item { scroll-margin-top: 96px; overflow: hidden; border: 1px solid #e1e6ec; border-radius: 12px; background: #fff; box-shadow: 0 10px 28px rgba(32,44,67,.045); }
.public-faq__item[hidden] { display: none; }
.public-faq__item:target, .public-faq__item:focus-within { border-color: #7774c7; box-shadow: 0 0 0 3px rgba(102,98,186,.1); }
.public-faq__item summary { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 18px 21px; color: #273247; cursor: pointer; font-size: 15.5px; font-weight: 620; line-height: 1.35; list-style: none; }
.public-faq__item summary::-webkit-details-marker { display: none; }
.public-faq__item summary i { flex: 0 0 auto; color: #5e5bc8; font-size: 18px; transition: transform .18s ease; }
.public-faq__item[open] summary i { transform: rotate(45deg); }
.public-faq__item > div { padding: 0 21px 20px; color: #607086; font-size: 14px; line-height: 1.58; }
.public-faq__empty { padding: 26px; border: 1px dashed #cfd6e1; border-radius: 12px; color: #607086; background: #fff; }
.public-faq__empty[hidden] { display: none; }
.public-faq__support { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-top: 28px; padding: 24px 28px; border: 1px solid #deddf1; border-radius: 15px; background: #f0effb; color: #273247; }
.public-faq__support strong { font-size: 18px; font-weight: 620; }
.public-faq__support p { margin: 5px 0 0; color: #617187; font-size: 13px; line-height: 1.45; }
.public-faq__support a { display: inline-flex; align-items: center; justify-content: center; gap: 8px; flex: 0 0 auto; padding: 11px 16px; border-radius: 9px; background: #202c43; color: #fff; font-size: 13px; font-weight: 600; text-decoration: none; white-space: nowrap; }
.public-faq__support a:hover { background: #34405a; color: #fff; }

:is(.page-faq, .page-privacy, .page-content-policy) footer { display: flow-root; margin-top: 0; background: #202c43; }
:is(.page-faq, .page-privacy, .page-content-policy) footer .footer-wrap { margin-top: 0; padding: 0; }
:is(.page-faq, .page-privacy, .page-content-policy) .career-footer { gap: 42px; padding: 42px 0 22px; }
:is(.page-faq, .page-privacy, .page-content-policy) .career-footer .brand { min-height: 0; }
:is(.page-faq, .page-privacy, .page-content-policy) .career-footer__brand > p, :is(.page-faq, .page-privacy, .page-content-policy) .career-footer__links a, :is(.page-faq, .page-privacy, .page-content-policy) .career-footer__links span { color: #b8c4d5; }
:is(.page-faq, .page-privacy, .page-content-policy) .career-footer__brand > p { margin-top: 13px; font-size: 13px; line-height: 1.45; }
:is(.page-faq, .page-privacy, .page-content-policy) .career-footer__links strong { margin-bottom: 2px; font-size: 12px; font-weight: 600; letter-spacing: .02em; text-transform: none; }
:is(.page-faq, .page-privacy, .page-content-policy) .career-footer__links a, :is(.page-faq, .page-privacy, .page-content-policy) .career-footer__links span { font-size: 12.5px; }
:is(.page-faq, .page-privacy, .page-content-policy) .career-footer__links a:hover { color: #d1d1ff; }
:is(.page-faq, .page-privacy, .page-content-policy) .career-footer__bottom { margin-top: 9px; padding-top: 16px; color: #aab7c8; font-size: 12px; }
@media (max-width: 991.98px) {
    :is(.page-faq, .page-privacy, .page-content-policy) footer { padding-bottom: calc(70px + env(safe-area-inset-bottom)); }
    :is(.page-faq, .page-privacy, .page-content-policy) .bottom-nav { padding: 0 0 env(safe-area-inset-bottom); border-top: 1px solid #e5e7eb; background: rgba(255,255,255,.97); }
    :is(.page-faq, .page-privacy, .page-content-policy) .bottom-nav-inner { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 4px; padding: 6px 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; }
    :is(.page-faq, .page-privacy, .page-content-policy) .bottom-link { min-width: 0; padding: 4px 8px; border-radius: 8px; color: #647386; font-size: 11px; font-weight: 500; text-align: center; }
    :is(.page-faq, .page-privacy, .page-content-policy) .bottom-link i { margin-bottom: 2px; font-size: 16px; }
    :is(.page-faq, .page-privacy, .page-content-policy) .bottom-link.active { color: #4b48ae; background: #f0effb; box-shadow: none; font-weight: 600; }
}
@media (max-width: 767.98px) {
    body:is(.page-faq, .page-privacy, .page-content-policy) .topbar-shell, body:is(.page-faq, .page-privacy, .page-content-policy) .brand { min-height: 66px; }
    body:is(.page-faq, .page-privacy, .page-content-policy) .topbar .row > div:first-child { width: 100%; }
}
@media (max-width: 860px) {
    .public-faq__list { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 680px) {
    .public-faq { padding: 24px 0 48px; }
    .public-faq__hero { align-items: flex-start; flex-direction: column; min-height: 0; gap: 20px; padding: 25px; }
    .public-faq__back { margin-bottom: 34px; }
    .public-faq__support { align-items: flex-start; flex-direction: column; }
    .public-faq__support { padding: 23px; }
}
@media (max-width: 540px) {
    body:is(.page-faq, .page-privacy, .page-content-policy) .hero > .container, body:is(.page-faq, .page-privacy, .page-content-policy) footer > .container { width: calc(100% - 40px) !important; }
    .public-faq__hero { padding: 22px; }
    .public-faq__hero h1 { font-size: clamp(28px, 8vw, 36px); }
    .public-faq__item summary { padding: 16px; }
    .public-faq__item > div { padding: 0 16px 17px; }
    .public-faq__support a { width: 100%; }
}
@media (prefers-reduced-motion: reduce) { .public-faq__item summary i { transition: none; } }