.khabeer-hero,
.khabeer-page-header,
.khabeer-section {
    max-width: 1200px;
    margin: 0 auto;
    padding: 24px 16px;
}

.khabeer-hero {
    display: grid;
    grid-template-columns: minmax(0, 1.2fr) minmax(280px, 0.8fr);
    gap: 28px;
    align-items: center;
    min-height: 62vh;
    box-sizing: border-box;
    width: 100%;
    margin-top: 24px;
    margin-bottom: 24px;
}

.khabeer-hero__content h1,
.khabeer-page-header h1,
.khabeer-section h2 {
    margin: 0 0 12px;
    line-height: 1.1;
}

.khabeer-hero__content h1 {
    font-size: clamp(2.4rem, 5vw, 4.6rem);
}

.khabeer-hero__content h1 em,
.khabeer-section-title em { color: #1769e8; font-style: normal; }

.khabeer-hero__content p,
.khabeer-page-header p {
    font-size: 1.05rem;
    color: #54607a;
    max-width: 60ch;
}

.khabeer-badge {
    display: inline-flex;
    background: #eaf2ff;
    color: #1d4ed8;
    border-radius: 999px;
    padding: 8px 14px;
    font-size: 0.85rem;
    margin-bottom: 16px;
}

.khabeer-hero__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 22px;
}

.khabeer-hero__panel,
.khabeer-search-card {
    background: linear-gradient(180deg, #ffffff, #f7faff);
    border: 1px solid #e8eef7;
    border-radius: 22px;
    box-shadow: 0 14px 38px rgba(16, 40, 96, 0.08);
}

.khabeer-hero__panel {
    padding: 20px;
}

.khabeer-search-card {
    padding: 28px;
}

.khabeer-search-card h3,
.khabeer-searchbar {
    margin-top: 0;
}

.khabeer-ai-entry { max-width: 620px; margin-top: 24px; padding: 18px; border: 1px solid #e0eaf7; border-radius: 17px; background: #fff; box-shadow: 0 12px 26px rgba(16,40,96,.06); }
.khabeer-ai-entry label { display: block; margin-bottom: 8px; color: #102a5c; font-size: 14px; font-weight: 800; }
.khabeer-ai-entry textarea { width: 100%; min-height: 74px; padding: 10px 0; border: 0; border-bottom: 1px solid #e5edf8; outline: 0; resize: vertical; color: #40516f; font: inherit; }
.khabeer-ai-entry > div { display: flex; gap: 15px; align-items: center; justify-content: space-between; padding-top: 12px; }
.khabeer-ai-entry small { color: #6d7c94; font-size: 11px; line-height: 1.45; }
.khabeer-ai-entry .button { min-height: 42px; white-space: nowrap; }
.khabeer-popular-topics { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-top: 15px; color: #64748b; font-size: 12px; }
.khabeer-popular-topics a { padding: 5px 9px; border-radius: 999px; background: #f0f4fa; color: #354866; font-weight: 700; text-decoration: none; }
.khabeer-hero-flow { display: grid; gap: 11px; min-height: 310px; place-content: center; text-align: center; color: #102a5c; }
.khabeer-hero-flow__step { display: grid; width: 30px; height: 30px; place-items: center; justify-self: center; border-radius: 50%; background: #1769e8; color: #fff; font-size: 13px; font-weight: 800; }
.khabeer-hero-flow__people { display: flex; gap: 14px; align-items: center; justify-content: center; margin: 8px 0; }
.khabeer-hero-flow__people span { display: grid; width: 92px; height: 92px; place-items: center; border: 7px solid #e6efff; border-radius: 50%; background: linear-gradient(145deg, #dfeeff, #fff); color: #1769e8; font-size: 12px; font-weight: 800; }
.khabeer-hero-flow__people span:last-child { border-color: #d9f6eb; color: #099467; }
.khabeer-hero-flow__people b { color: #1769e8; }
.khabeer-section-title { text-align: center; }
.khabeer-step-number { display: grid; width: 28px; height: 28px; place-items: center; margin-bottom: 12px; border-radius: 50%; background: #1769e8; color: #fff; font-size: 12px; font-weight: 800; }

.khabeer-searchbar {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
    margin-bottom: 20px;
}

.khabeer-searchbar input {
    flex: 1 1 320px;
    min-height: 48px;
    border: 1px solid #dbe4f2;
    border-radius: 14px;
    padding: 0 16px;
}

.khabeer-searchbar button,
.button.button-primary,
.button.button-secondary {
    border-radius: 14px;
    min-height: 48px;
    padding: 0 18px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
}

.button.button-primary {
    background: #1d4ed8;
    color: #fff;
}

.button.button-secondary {
    background: #eef4ff;
    color: #1d4ed8;
}

.khabeer-page-header {
    border-bottom: 1px solid #edf1f7;
}

.khabeer-process-hero { display: grid; grid-template-columns: minmax(0, .9fr) minmax(360px, 1.1fr); gap: 54px; align-items: center; max-width: 1380px; margin: 0 auto; padding: 58px 48px 46px; border-bottom: 1px solid #e7edf7; background: radial-gradient(circle at 78% 22%, #eaf3ff 0, transparent 27%), #fff; }
.khabeer-process-hero h1 { margin: 18px 0 13px; color: #102a5c; font-size: clamp(38px, 4vw, 60px); line-height: 1.05; letter-spacing: -1.6px; }
.khabeer-process-hero h1 em, .khabeer-pricing-page h1 em { color: #1769e8; font-style: normal; }
.khabeer-process-hero p { max-width: 460px; margin: 0; color: #5b6c88; font-size: 17px; line-height: 1.65; }
.khabeer-process-hero__steps { display: grid; grid-template-columns: repeat(3, 1fr); gap: 13px; padding: 0; list-style: none; }
.khabeer-process-hero__steps li { display: grid; gap: 11px; justify-items: center; color: #1d315c; font-size: 13px; font-weight: 800; text-align: center; }
.khabeer-process-hero__steps span { display: grid; width: 66px; height: 66px; place-items: center; border: 10px solid #e6f0ff; border-radius: 50%; background: #1769e8; color: #fff; font-size: 18px; box-shadow: 0 8px 22px rgba(23,105,232,.16); }
.khabeer-process-hero__steps li:nth-child(2) span { background: #13a889; border-color: #e2f8f0; }
.khabeer-process-hero__steps li:nth-child(3) span { background: #7449e8; border-color: #eee9ff; }
.khabeer-process { max-width: 1180px; margin: 0 auto; padding: 54px 24px; }
.khabeer-process > header { max-width: 720px; margin: 0 auto 32px; text-align: center; }
.khabeer-process > header h2 { margin: 0 0 10px; color: #102a5c; font-size: clamp(27px, 3vw, 38px); letter-spacing: -.7px; }
.khabeer-process > header p { margin: 0; color: #63728d; line-height: 1.6; }
.khabeer-process__cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.khabeer-process__cards article { position: relative; min-height: 315px; padding: 28px; border: 1px solid #e0eaf7; border-radius: 19px; background: linear-gradient(150deg, #fff, #f8fbff); box-shadow: 0 12px 26px rgba(16,40,96,.05); }
.khabeer-process__number { position: absolute; top: 17px; left: 17px; display: grid; width: 27px; height: 27px; place-items: center; border-radius: 50%; background: #1769e8; color: #fff; font-size: 12px; font-weight: 800; }
.khabeer-process__icon { display: grid; width: 66px; height: 66px; place-items: center; margin: 15px 0 22px; border-radius: 50%; background: #eaf2ff; color: #1769e8; font-size: 28px; font-weight: 800; }
.khabeer-process__cards article:nth-child(2) .khabeer-process__icon { background: #e5f8f1; color: #099467; }.khabeer-process__cards article:nth-child(3) .khabeer-process__icon { background: #f0ebff; color: #7449e8; }
.khabeer-process__cards h3 { margin: 0 0 9px; color: #102a5c; font-size: 20px; }.khabeer-process__cards p { margin: 0; color: #63728d; font-size: 14px; line-height: 1.65; }.khabeer-process__cards ul { display: grid; gap: 8px; margin: 18px 0 0; padding: 0; list-style: none; color: #405271; font-size: 12px; font-weight: 600; }.khabeer-process__cards li::before { content: '✓'; margin-right: 8px; color: #1769e8; }
.khabeer-trust-strip { display: grid; grid-template-columns: repeat(4, 1fr); gap: 15px; margin-top: 32px; padding: 22px 28px; border-radius: 16px; background: linear-gradient(100deg, #eff5ff, #fbfaff); color: #24385f; font-size: 13px; font-weight: 700; }.khabeer-trust-strip b { display: inline-grid; width: 28px; height: 28px; place-items: center; margin-right: 8px; border-radius: 50%; background: #fff; color: #1769e8; }

.khabeer-pricing-page { max-width: 1200px; margin: 0 auto; padding: 54px 24px 66px; text-align: center; }.khabeer-pricing-page > header { max-width: 720px; margin: 0 auto 34px; }.khabeer-pricing-page h1 { margin: 13px 0; color: #102a5c; font-size: clamp(38px, 4.4vw, 58px); letter-spacing: -1.5px; }.khabeer-pricing-page > header p { margin: 0; color: #63728d; font-size: 17px; line-height: 1.6; }.khabeer-pricing-page__cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; text-align: left; }.khabeer-pricing-page__cards article { min-height: 248px; padding: 29px; border: 1px solid #e0eaf7; border-radius: 19px; background: #fff; box-shadow: 0 12px 26px rgba(16,40,96,.05); }.khabeer-pricing-page__cards article.is-featured { border-color: #8db8ff; background: linear-gradient(145deg, #f5f9ff, #fff); box-shadow: 0 15px 34px rgba(23,105,232,.12); }.khabeer-pricing-page__icon { display: grid; width: 52px; height: 52px; place-items: center; border-radius: 50%; background: #eaf2ff; color: #1769e8; font-size: 15px; font-weight: 800; }.khabeer-pricing-page__cards h2 { margin: 19px 0 9px; color: #102a5c; font-size: 20px; }.khabeer-pricing-page__cards p { min-height: 65px; margin: 0 0 17px; color: #63728d; font-size: 14px; line-height: 1.6; }.khabeer-pricing-page__cards strong { color: #1769e8; font-size: 13px; }.khabeer-pricing-page__example { max-width: 850px; margin: 36px auto 0; padding: 29px; border-radius: 18px; background: linear-gradient(100deg, #f0f6ff, #f9f7ff); }.khabeer-pricing-page__example h2 { margin: 0 0 8px; color: #102a5c; font-size: 23px; }.khabeer-pricing-page__example p { max-width: 660px; margin: 0 auto 19px; color: #53647f; font-size: 14px; line-height: 1.65; }

.khabeer-section h2 {
    font-size: clamp(1.5rem, 2.4vw, 2.2rem);
}

.khabeer-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 20px;
    margin: 20px 0;
}

.khabeer-card {
    background: #fff;
    border: 1px solid #e8eef7;
    border-radius: 18px;
    padding: 20px;
    box-shadow: 0 10px 30px rgba(16, 40, 96, 0.06);
}

.khabeer-card h3 {
    margin: 0 0 10px;
    font-size: 20px;
}

.khabeer-card p {
    margin: 0 0 12px;
    color: #54607a;
}

.khabeer-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    font-size: 13px;
    color: #1d3f9f;
}

.khabeer-card__thumb img {
    width: 100%;
    height: auto;
    border-radius: 14px;
    margin-bottom: 14px;
}

.khabeer-directory {
    display: grid;
    grid-template-columns: 230px minmax(0, 1fr);
    gap: 34px;
    max-width: 1440px;
    margin: 34px auto;
    padding: 0 24px;
}

.khabeer-directory__sidebar {
    align-self: start;
    padding: 18px;
    border: 1px solid #e5edf8;
    border-radius: 16px;
    background: #fbfdff;
}

.khabeer-directory__sidebar h3 { margin: 14px 0 10px; color: #102a5c; font-size: 16px; }
.khabeer-directory__sidebar > a { display: block; padding: 10px 11px; border-radius: 9px; color: #51617d; font-size: 14px; font-weight: 600; text-decoration: none; }
.khabeer-directory__sidebar > a:hover,
.khabeer-directory__sidebar > a.is-active { background: #eaf2ff; color: #1769e8; }
.khabeer-directory__content { min-width: 0; }
.khabeer-directory__intro { min-height: 145px; padding: 12px 0 26px; border-bottom: 1px solid #e9eff8; }
.khabeer-directory__intro h1 { margin: 15px 0 8px; color: #102a5c; font-size: clamp(30px, 3.3vw, 44px); letter-spacing: -1px; }
.khabeer-directory__intro p { margin: 0; color: #61708b; font-size: 16px; }
.khabeer-breadcrumb { color: #9aa8bd; font-size: 12px; font-weight: 600; }
.khabeer-directory__help { margin-top: 28px; padding: 16px; border-radius: 13px; background: linear-gradient(145deg, #edf5ff, #f8faff); color: #53627e; font-size: 13px; }
.khabeer-directory__help strong { display: block; color: #102a5c; margin-bottom: 8px; }
.khabeer-directory__help p { margin: 0 0 10px; }
.khabeer-directory__help a { color: #1769e8; font-weight: 700; text-decoration: none; }
.khabeer-directory__count,
.khabeer-catalogue__heading { margin: 22px 0 14px; color: #52627d; font-size: 13px; }

.khabeer-experts-list { display: grid; gap: 12px; }
.khabeer-expert-row { display: grid; grid-template-columns: 70px minmax(0, 1fr) minmax(150px, .4fr) auto; gap: 16px; align-items: center; padding: 16px 20px; border: 1px solid #e5edf8; border-radius: 15px; background: #fff; box-shadow: 0 8px 22px rgba(16,40,96,.04); }
.khabeer-expert-card { display: grid; grid-template-columns: 74px 1fr; gap: 14px; }
.khabeer-expert-card__photo { display: grid; width: 70px; height: 70px; place-items: center; overflow: hidden; border-radius: 50%; background: #eaf2ff; color: #1769e8; font-weight: 800; text-decoration: none; }
.khabeer-expert-card__photo img { width: 100%; height: 100%; object-fit: cover; }
.khabeer-expert-card__main h3 { margin: 0 0 4px; color: #102a5c; font-size: 17px; }
.khabeer-expert-card__main > a { text-decoration: none; }
.khabeer-expert-card__main p { margin: 0 0 9px; color: #687790; font-size: 13px; }
.khabeer-verified { color: #1769e8; font-size: 13px; }
.khabeer-expert-tags { display: flex; flex-wrap: wrap; gap: 6px; }
.khabeer-expert-tags span { padding: 4px 7px; border-radius: 999px; background: #f0f4ff; color: #4766b4; font-size: 10px; font-weight: 700; }
.khabeer-expert-card__details { display: grid; gap: 7px; color: #273957; font-size: 13px; }
.khabeer-expert-card__details strong { color: #eaa300; }
.khabeer-expert-card__details small { color: #7a879b; font-size: 11px; }
.khabeer-expert-card__details small.is-available { color: #099467; font-weight: 700; }
.khabeer-expert-card__action { padding: 9px 12px; border: 1px solid #cddff9; border-radius: 9px; color: #1769e8; font-size: 12px; font-weight: 700; text-decoration: none; white-space: nowrap; }

.khabeer-category-card { display: grid; grid-template-columns: 68px minmax(0, 1fr); gap: 16px; align-items: start; min-height: 150px; }
.khabeer-category-card__icon { display: grid; width: 58px; height: 58px; place-items: center; border-radius: 50%; background: color-mix(in srgb, var(--khabeer-category-color) 14%, white); color: var(--khabeer-category-color); font-size: 17px; font-weight: 800; }
.khabeer-category-card__icon img { width: 100%; height: 100%; border-radius: inherit; object-fit: cover; }
.khabeer-category-card h3 { color: #102a5c; font-size: 17px; }
.khabeer-category-card p { color: #63728d; font-size: 13px; line-height: 1.6; }
.khabeer-category-card small { display: block; margin-bottom: 10px; color: #63728d; font-size: 11px; }
.khabeer-category-card a { color: #1769e8; font-size: 12px; font-weight: 700; text-decoration: none; }

.khabeer-expert-services-public { max-width: 1050px; margin: 34px auto; padding: 26px 22px; border-radius: 18px; background: linear-gradient(145deg, #f5f9ff, #fff); }
.khabeer-expert-services-public > h2 { margin: 0 0 8px; color: #102a5c; }
.khabeer-expert-services-public > p { margin: 0; color: #66758d; }
.khabeer-expert-services-public .khabeer-card > strong,
.khabeer-expert-services-public .khabeer-card > small { display: block; margin: 10px 0; color: #102a5c; }
.khabeer-expert-services-public .khabeer-card > small { color: #6b7a93; font-size: 12px; }
.khabeer-consultation-request-form { display: grid; gap: 10px; margin-top: 15px; }
.khabeer-consultation-request-form label { display: grid; gap: 5px; color: #40516f; font-size: 12px; font-weight: 700; }
.khabeer-consultation-request-form input,
.khabeer-consultation-request-form textarea { width: 100%; padding: 9px; border: 1px solid #d6e2f2; border-radius: 9px; font: inherit; }

.khabeer-pricing {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 20px;
}

.khabeer-auth {
    max-width: 720px;
    margin: 40px auto;
    padding: 0 16px;
}

.khabeer-auth--split { display: grid; grid-template-columns: minmax(240px, .72fr) minmax(0, 1fr); max-width: 1020px; overflow: hidden; padding: 0; border: 1px solid #e0eaf7; border-radius: 20px; background: #fff; box-shadow: 0 18px 46px rgba(16,40,96,.09); }
.khabeer-auth__aside { padding: 44px 34px; background: linear-gradient(155deg, #eff6ff, #f4efff); color: #50617d; }
.khabeer-auth__aside h2 { margin: 20px 0 12px; color: #102a5c; font-size: clamp(24px, 2.8vw, 34px); line-height: 1.15; }
.khabeer-auth__aside p { line-height: 1.6; }
.khabeer-auth__aside ul { display: grid; gap: 13px; margin: 30px 0 0; padding: 0; list-style: none; color: #273d66; font-size: 13px; font-weight: 700; }
.khabeer-auth__aside li::before { content: '✓'; display: inline-grid; width: 20px; height: 20px; place-items: center; margin-right: 8px; border-radius: 50%; background: #dbeaff; color: #1769e8; }
.khabeer-auth--split .khabeer-auth__card { padding: 40px; border: 0; border-radius: 0; box-shadow: none; }
.khabeer-auth--split .khabeer-auth__card h1 { margin-bottom: 7px; color: #102a5c; font-size: 32px; letter-spacing: -.6px; }
.khabeer-auth--split .khabeer-auth__card > p { margin: 0 0 20px; color: #687790; }
.khabeer-auth--split .khabeer-auth__card form > p { display: grid; gap: 7px; color: #263c63; font-size: 13px; font-weight: 700; }
.khabeer-auth--split .khabeer-auth__card input,
.khabeer-auth--split .khabeer-auth__card textarea,
.khabeer-auth--split .khabeer-auth__card select { box-sizing: border-box; border-color: #d9e4f4; background: #fcfdff; color: #263c63; font-size: 14px; font-weight: 400; }
.khabeer-auth--split .khabeer-auth__card input:focus,
.khabeer-auth--split .khabeer-auth__card textarea:focus,
.khabeer-auth--split .khabeer-auth__card select:focus { border-color: #1769e8; box-shadow: 0 0 0 3px rgba(23,105,232,.1); outline: 0; }
.khabeer-auth--split .button.button-primary { width: 100%; border: 0; border-radius: 10px; background: linear-gradient(100deg, #1769e8, #5d3df0); font-weight: 700; }
.khabeer-auth--split .khabeer-role-switch { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; padding: 4px; border-radius: 13px; background: #f3f6fb; }
.khabeer-auth--split .khabeer-role-switch .button { min-height: 40px; border: 0; border-radius: 9px; background: transparent; color: #53647f; font-size: 14px; }
.khabeer-auth--split .khabeer-role-switch .button.button-primary { background: linear-gradient(100deg, #1769e8, #5d3df0); color: #fff; }

.khabeer-auth__card,
.khabeer-dashboard__card {
    background: #fff;
    border: 1px solid #e8eef7;
    border-radius: 20px;
    box-shadow: 0 12px 30px rgba(16, 40, 96, 0.08);
    padding: 24px;
}

.khabeer-auth__card h1,
.khabeer-dashboard__card h2 {
    margin-top: 0;
}

.khabeer-auth__footnote { color: #66758d; font-size: 13px; text-align: center; }
.khabeer-auth__footnote a { color: #1769e8; font-weight: 700; text-decoration: none; }

.khabeer-auth__card form p {
    margin-bottom: 14px;
}

.khabeer-upload-section {
    margin: 22px 0;
    padding: 20px;
    border: 1px solid #dce8fb;
    border-radius: 16px;
    background: linear-gradient(135deg, #f8fbff 0%, #eef5ff 100%);
}

.khabeer-profile-photo-upload { display: grid; grid-template-columns: 112px minmax(0, 1fr); gap: 15px; align-items: center; margin: 20px 0; padding: 16px; border: 1px solid #dce8fb; border-radius: 16px; background: linear-gradient(135deg, #fbfdff 0%, #eef5ff 100%); }
.khabeer-profile-photo-upload > input { position: absolute; width: 1px; height: 1px; overflow: hidden; opacity: 0; }
.khabeer-profile-photo-upload__tile { position: relative; display: block; width: 102px; height: 102px; cursor: pointer; }
.khabeer-profile-photo-upload__preview { display: grid; width: 100%; height: 100%; place-items: center; overflow: hidden; border: 2px dashed #9ebcf1; border-radius: 18px; background: #eaf2ff; }
.khabeer-profile-photo-upload__preview img { width: 100%; height: 100%; object-fit: cover; }
.khabeer-profile-photo-upload__silhouette { color: #8ca4c9; font-size: 56px; line-height: 1; text-shadow: 0 15px 0 #8ca4c9; }
.khabeer-profile-photo-upload__add { position: absolute; right: -7px; bottom: -7px; display: grid; width: 37px; height: 37px; place-items: center; border: 3px solid #fff; border-radius: 50%; background: #1769e8; box-shadow: 0 5px 14px rgba(23,105,232,.28); color: #fff; font-size: 28px; font-weight: 500; line-height: 1; }
.khabeer-profile-photo-upload__tile:hover .khabeer-profile-photo-upload__preview, .khabeer-profile-photo-upload__tile:focus-within .khabeer-profile-photo-upload__preview { border-color: #1769e8; box-shadow: 0 0 0 4px rgba(23,105,232,.1); }
.khabeer-profile-photo-upload__copy { display: grid; gap: 5px; color: #102a5c; }
.khabeer-profile-photo-upload__copy strong { font-size: 15px; }
.khabeer-profile-photo-upload__copy em { margin-left: 5px; color: #d73a49; font-size: 11px; font-style: normal; text-transform: uppercase; }
.khabeer-profile-photo-upload__copy small { color: #64748b; font-size: 12px; line-height: 1.45; }
.khabeer-profile-photo-upload__remove { justify-self: start; padding: 2px 0; border: 0; background: transparent; color: #1769e8; cursor: pointer; font-size: 12px; font-weight: 700; }

.khabeer-upload-section h4 {
    margin: 0 0 5px;
    color: #102a5c;
}

.khabeer-upload-section__intro {
    margin: 0 0 14px !important;
    color: #64748b;
    font-size: 13px;
}

.khabeer-upload-field-wrap {
    position: relative;
}

.khabeer-supporting-document-title {
    display: grid;
    gap: 6px;
    margin: 14px 0 5px;
    color: #30466e;
    font-size: 12px;
    font-weight: 700;
}

.khabeer-supporting-document-title input {
    min-height: 40px !important;
    padding: 8px 11px !important;
    border: 1px solid #cbdcf4 !important;
    border-radius: 9px !important;
    background: #fff;
}

.khabeer-upload-field {
    display: grid;
    grid-template-columns: 38px minmax(0, 1fr);
    gap: 11px;
    align-items: center;
    position: relative;
    min-height: 72px;
    margin: 10px 0;
    padding: 13px 52px 13px 14px;
    border: 1px dashed #9ebcf1;
    border-radius: 13px;
    background: #fff;
    color: #102a5c;
    cursor: pointer;
}

.khabeer-upload-field:hover,
.khabeer-upload-field:focus-within {
    border-color: #1769e8;
    box-shadow: 0 0 0 3px rgba(23, 105, 232, 0.1);
}

.khabeer-upload-field__icon {
    display: grid;
    width: 38px;
    height: 38px;
    place-items: center;
    border-radius: 50%;
    background: #eaf2ff;
    color: #1769e8;
    font-size: 22px;
    font-weight: 700;
}

.khabeer-upload-field strong,
.khabeer-upload-field small {
    display: block;
}

.khabeer-upload-field small {
    margin-top: 3px;
    color: #64748b;
    font-size: 12px;
}

.khabeer-upload-field input[type="file"] {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    min-height: 0;
    padding: 0;
    border: 0;
    opacity: 0;
    cursor: pointer;
}

.khabeer-add-document,
.khabeer-remove-document {
    border: 0;
    background: transparent;
    color: #1769e8;
    cursor: pointer;
    font-weight: 700;
}

.khabeer-add-document {
    margin-top: 5px;
    padding: 7px 2px;
}

.khabeer-remove-document {
    position: absolute;
    z-index: 2;
    top: 50%;
    right: 14px;
    padding: 6px;
    transform: translateY(-50%);
    font-size: 22px;
    line-height: 1;
}

.khabeer-auth__card input,
.khabeer-auth__card textarea,
.khabeer-auth__card select {
    width: 100%;
    min-height: 46px;
    border: 1px solid #dbe4f2;
    border-radius: 12px;
    padding: 10px 14px;
}

.khabeer-role-switch {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    margin: 18px 0 24px;
}

.khabeer-role-switch .button {
    border-radius: 999px;
}

.khabeer-alert {
    background: #fff4e5;
    color: #8a4b00;
    border: 1px solid #ffd59e;
    border-radius: 12px;
    padding: 12px 14px;
    margin-bottom: 16px;
}

.khabeer-dashboard-shell {
    display: grid;
    grid-template-columns: 250px minmax(0, 1fr);
    max-width: 1440px;
    min-height: 720px;
    margin: 28px auto;
    overflow: hidden;
    border: 1px solid #e2eaf7;
    border-radius: 22px;
    background: #f6f9ff;
    box-shadow: 0 18px 50px rgba(16, 40, 96, .1);
}

.khabeer-dashboard-sidebar {
    display: flex;
    flex-direction: column;
    padding: 26px 16px 18px;
    background: #fff;
    border-right: 1px solid #e2eaf7;
}

.khabeer-dashboard-brand {
    display: inline-flex;
    gap: 8px;
    align-items: center;
    margin: 0 12px 28px;
    color: #102a5c;
    font-size: 28px;
    font-weight: 800;
    letter-spacing: -.8px;
    text-decoration: none;
}

.khabeer-dashboard-brand__mark { display: grid; width: 31px; height: 31px; place-items: center; border: 3px solid #1769e8; border-radius: 9px; color: #102a5c; font-size: 17px; font-weight: 900; line-height: 1; }

.khabeer-dashboard-user {
    display: flex;
    gap: 10px;
    align-items: center;
    margin: 0 4px 24px;
    padding: 12px;
    border-radius: 14px;
    background: #f5f8ff;
    color: #102a5c;
}

.khabeer-dashboard-user__avatar {
    display: grid;
    flex: 0 0 36px;
    width: 36px;
    height: 36px;
    place-items: center;
    border-radius: 50%;
    background: #1769e8;
    color: #fff;
    font-weight: 700;
}

.khabeer-dashboard-user strong,
.khabeer-dashboard-user small { display: block; }
.khabeer-dashboard-user strong { font-size: 13px; }
.khabeer-dashboard-user small { margin-top: 2px; color: #64748b; font-size: 11px; }

.khabeer-dashboard-nav { display: grid; gap: 4px; }
.khabeer-dashboard-nav a,
.khabeer-dashboard-logout {
    padding: 11px 12px;
    border-radius: 10px;
    color: #43516e;
    font-weight: 600;
    font-size: 14px;
    text-decoration: none;
}
.khabeer-dashboard-nav a:hover,
.khabeer-dashboard-nav a.is-active { background: #eaf2ff; color: #1769e8; }
.khabeer-dashboard-logout { margin-top: auto; color: #b42318; }

.khabeer-dashboard-main { min-width: 0; padding: 38px; }
.khabeer-dashboard-heading { display: flex; gap: 18px; align-items: flex-start; justify-content: space-between; margin-bottom: 28px; }
.khabeer-dashboard-heading h1 { margin: 2px 0 7px; color: #102a5c; font-size: clamp(28px, 3vw, 38px); letter-spacing: -.8px; }
.khabeer-dashboard-heading p { margin: 0; color: #64748b; }
.khabeer-dashboard-role { color: #1769e8 !important; font-weight: 700; font-size: 13px; text-transform: uppercase; letter-spacing: .7px; }
.khabeer-dashboard-home { padding: 9px 13px; border: 1px solid #d7e4f8; border-radius: 10px; background: #fff; color: #1769e8; font-size: 13px; font-weight: 700; text-decoration: none; white-space: nowrap; }

.khabeer-dashboard-stats { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; margin-bottom: 22px; }
.khabeer-dashboard-stats article,
.khabeer-dashboard-panel { border: 1px solid #e0e9f6; border-radius: 16px; background: #fff; box-shadow: 0 8px 22px rgba(16, 40, 96, .04); }
.khabeer-dashboard-stats article { display: grid; gap: 7px; padding: 18px; }
.khabeer-dashboard-stats span { color: #64748b; font-size: 13px; }
.khabeer-dashboard-stats strong { color: #102a5c; font-size: 30px; line-height: 1; }
.khabeer-dashboard-stats a { color: #1769e8; font-size: 12px; font-weight: 700; text-decoration: none; }
.khabeer-dashboard-stats small { color: #64748b; font-size: 12px; }
.khabeer-dashboard-panel { padding: 22px; }
.khabeer-dashboard-panel h2 { margin: 0 0 16px; color: #102a5c; font-size: 20px; }
.khabeer-dashboard-actions { display: flex; flex-wrap: wrap; gap: 10px; }
.khabeer-dashboard-actions a,
.khabeer-dashboard-primary { display: inline-flex; padding: 10px 14px; border-radius: 10px; background: #1769e8; color: #fff; font-weight: 700; font-size: 13px; text-decoration: none; }
.khabeer-dashboard-table-wrap { overflow-x: auto; }
.khabeer-dashboard-table { width: 100%; border-collapse: collapse; font-size: 14px; }
.khabeer-dashboard-table th { padding: 11px 10px; border-bottom: 1px solid #dfe8f5; color: #64748b; text-align: left; font-size: 12px; }
.khabeer-dashboard-table td { padding: 13px 10px; border-bottom: 1px solid #edf2f8; color: #33415c; vertical-align: middle; }
.khabeer-dashboard-table td strong,
.khabeer-dashboard-table td small { display: block; }
.khabeer-dashboard-table td small { margin-top: 3px; color: #71809a; }
.khabeer-status { display: inline-block; padding: 4px 8px; border-radius: 999px; background: #fff3d7; color: #a15c00; font-size: 11px; font-weight: 700; }
.khabeer-table-actions { display: flex; flex-wrap: wrap; gap: 7px; }

.khabeer-manager-form {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
    align-items: end;
}

.khabeer-manager-form label,
.khabeer-manager-inline-form {
    display: grid;
    gap: 5px;
    color: #43526b;
    font-size: 12px;
    font-weight: 700;
}

.khabeer-manager-form select,
.khabeer-manager-form input,
.khabeer-manager-form textarea,
.khabeer-manager-inline-form select,
.khabeer-manager-inline-form input,
.khabeer-manager-inline-form textarea {
    width: 100%;
    padding: 8px 9px;
    border: 1px solid #cfdced;
    border-radius: 8px;
    background: #fff;
    color: #243653;
    font: inherit;
    font-weight: 400;
}

.khabeer-manager-form__wide { grid-column: span 2; }
.khabeer-manager-form button,
.khabeer-manager-inline-form button {
    justify-self: start;
    padding: 8px 11px;
    border: 0;
    border-radius: 8px;
    background: #1769e8;
    color: #fff;
    cursor: pointer;
    font-size: 12px;
    font-weight: 700;
}

.khabeer-manager-inline-form { min-width: 190px; }

/* Dashboard follows the standalone Figma workspace rather than the public Astra layout. */
.khabeer-dashboard-page #masthead,
.khabeer-dashboard-page .site-header,
.khabeer-dashboard-page #colophon,
.khabeer-dashboard-page .site-footer,
.khabeer-dashboard-page .ast-footer-overlay,
.khabeer-dashboard-page .entry-header { display: none; }
.khabeer-dashboard-page .site-content,
.khabeer-dashboard-page .ast-container,
.khabeer-dashboard-page .ast-article-single { max-width: none; margin: 0; padding: 0; background: transparent; }
.khabeer-dashboard-page .site-content > .ast-container { display: block; max-width: none; }
.khabeer-dashboard-page .entry-content { margin: 0; }
.khabeer-dashboard-page { background: #f6f9ff; }
.khabeer-dashboard-page .khabeer-dashboard-shell { max-width: none; min-height: 100vh; margin: 0; border: 0; border-radius: 0; box-shadow: none; }
.khabeer-table-actions a { padding: 6px 8px; border: 1px solid #cdddf5; border-radius: 7px; color: #1769e8; font-size: 12px; font-weight: 700; text-decoration: none; }
.khabeer-table-actions a.is-danger { border-color: #f5c7c2; color: #c43225; }
.khabeer-category-list { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 13px; }
.khabeer-category-list article { padding: 16px; border: 1px solid #e1e9f6; border-radius: 13px; background: #fbfdff; }
.khabeer-category-list h3 { margin: 0 0 7px; color: #102a5c; font-size: 16px; }
.khabeer-category-list p { min-height: 38px; margin: 0 0 8px; color: #64748b; font-size: 13px; }
.khabeer-category-list small { color: #1769e8; font-weight: 700; }

/* Account control for the Astra Header Builder HTML element. */
.khabeer-account-menu {
    display: inline-flex;
    align-items: center;
    position: relative;
}

.khabeer-login-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 42px;
    padding: 0 18px;
    border: 1px solid #1d4ed8;
    border-radius: 999px;
    background: #1d4ed8;
    color: #fff;
    font-weight: 600;
    line-height: 1;
    text-decoration: none;
}

.khabeer-login-button:hover,
.khabeer-login-button:focus {
    background: #1e40af;
    border-color: #1e40af;
    color: #fff;
}

.khabeer-account-dropdown {
    position: relative;
}

.khabeer-account-dropdown__toggle {
    display: flex;
    cursor: pointer;
    list-style: none;
}

.khabeer-account-dropdown__toggle::-webkit-details-marker {
    display: none;
}

.khabeer-account-dropdown__avatar,
.khabeer-account-dropdown__avatar img {
    display: block;
    width: 40px;
    height: 40px;
    border-radius: 50%;
}

.khabeer-account-dropdown__avatar img {
    border: 2px solid #e8eef7;
    object-fit: cover;
}

.khabeer-account-dropdown__panel {
    position: absolute;
    z-index: 9999;
    top: calc(100% + 10px);
    right: 0;
    width: 230px;
    padding: 8px;
    border: 1px solid #e8eef7;
    border-radius: 14px;
    background: #fff;
    box-shadow: 0 16px 38px rgba(16, 40, 96, 0.16);
}

.khabeer-account-dropdown__identity {
    display: grid;
    gap: 3px;
    padding: 10px 12px;
    border-bottom: 1px solid #edf1f7;
    color: #172554;
    font-size: 13px;
}

.khabeer-account-dropdown__identity span {
    overflow: hidden;
    color: #64748b;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.khabeer-account-dropdown__panel a {
    display: block;
    padding: 10px 12px;
    border-radius: 9px;
    color: #172554;
    font-size: 14px;
    text-decoration: none;
}

.khabeer-account-dropdown__panel a:hover,
.khabeer-account-dropdown__panel a:focus {
    background: #eef4ff;
    color: #1d4ed8;
}

.khabeer-category-picker select {
    display: block;
    width: 100%;
    min-height: 110px;
    margin-top: 7px;
    padding: 8px;
    border: 1px solid #cbd8ed;
    border-radius: 10px;
    background: #fff;
    color: #172554;
}

.khabeer-category-picker small {
    display: block;
    margin-top: 6px;
    color: #64748b;
}

@media (max-width: 900px) {
    .khabeer-hero {
        grid-template-columns: 1fr;
        min-height: auto;
    }

    .khabeer-dashboard-shell { grid-template-columns: 1fr; margin: 16px; }
    .khabeer-dashboard-sidebar { padding: 16px; border-right: 0; border-bottom: 1px solid #e2eaf7; }
    .khabeer-dashboard-brand { margin: 0 4px 14px; }
    .khabeer-dashboard-user { display: none; }
    .khabeer-dashboard-nav { display: flex; overflow-x: auto; padding-bottom: 2px; }
    .khabeer-dashboard-nav a { flex: 0 0 auto; }
    .khabeer-dashboard-logout { display: none; }
    .khabeer-dashboard-main { padding: 24px 18px; }
    .khabeer-dashboard-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .khabeer-directory { grid-template-columns: 1fr; gap: 18px; margin: 18px auto; padding: 0 16px; }
    .khabeer-directory__sidebar { display: flex; gap: 5px; overflow-x: auto; align-items: center; padding: 10px; white-space: nowrap; }
    .khabeer-directory__sidebar h3,
    .khabeer-directory__sidebar .khabeer-breadcrumb,
    .khabeer-directory__help { display: none; }
    .khabeer-directory__sidebar > a { flex: 0 0 auto; }
    .khabeer-expert-row { grid-template-columns: 60px minmax(0, 1fr) auto; padding: 14px; }
    .khabeer-expert-card__details { display: none; }
    .khabeer-process-hero { grid-template-columns: 1fr; gap: 30px; padding: 42px 24px; }
    .khabeer-process__cards, .khabeer-pricing-page__cards { grid-template-columns: 1fr; }
    .khabeer-process__cards article, .khabeer-pricing-page__cards article { min-height: 0; }
    .khabeer-trust-strip { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 640px) {
    .khabeer-hero,
    .khabeer-page-header,
    .khabeer-section {
        padding-left: 14px;
        padding-right: 14px;
    }

    .khabeer-hero__content h1 {
        font-size: 2.1rem;
    }

    .khabeer-ai-entry > div { display: grid; }
    .khabeer-ai-entry .button { width: 100%; }
    .khabeer-hero-flow { min-height: 220px; }

    .khabeer-searchbar input,
    .khabeer-searchbar button,
    .button.button-primary,
    .button.button-secondary {
        width: 100%;
    }

    .khabeer-dashboard-shell { margin: 0; border-right: 0; border-left: 0; border-radius: 0; }
    .khabeer-dashboard-heading { display: block; }
    .khabeer-dashboard-home { display: inline-flex; margin-top: 14px; }
    .khabeer-dashboard-stats { grid-template-columns: 1fr; }
    .khabeer-dashboard-panel { padding: 16px; }
    .khabeer-manager-form { grid-template-columns: 1fr; }
    .khabeer-manager-form__wide { grid-column: auto; }
    .khabeer-expert-row { grid-template-columns: 54px minmax(0, 1fr); gap: 11px; }
    .khabeer-expert-row .khabeer-expert-card__action { grid-column: 2; justify-self: start; }
    .khabeer-expert-card__photo { width: 54px; height: 54px; }
    .khabeer-category-card { grid-template-columns: 52px minmax(0, 1fr); }
    .khabeer-category-card__icon { width: 46px; height: 46px; }
    .khabeer-auth--split { grid-template-columns: 1fr; margin: 20px 14px; border-radius: 16px; }
    .khabeer-auth__aside { padding: 24px; }
    .khabeer-auth__aside h2 { margin-top: 12px; }
    .khabeer-auth__aside ul { display: none; }
    .khabeer-profile-photo-upload { grid-template-columns: 86px minmax(0, 1fr); padding: 13px; }
    .khabeer-profile-photo-upload__tile { width: 78px; height: 78px; }
    .khabeer-profile-photo-upload__add { width: 31px; height: 31px; font-size: 23px; }
    .khabeer-process-hero { padding: 34px 18px; }.khabeer-process-hero__steps { gap: 7px; }.khabeer-process-hero__steps span { width: 51px; height: 51px; border-width: 7px; font-size: 14px; }.khabeer-process-hero__steps li { font-size: 11px; }.khabeer-process { padding: 40px 16px; }.khabeer-process__cards article { padding: 23px; }.khabeer-trust-strip { grid-template-columns: 1fr; padding: 18px; }.khabeer-pricing-page { padding: 40px 16px; }.khabeer-pricing-page__cards article { padding: 24px; }
}

/* Keep Astra's mobile menu toggle visible on Khabeer's white header. */
@media (max-width: 921px) {
    .ast-header-break-point .ast-button-wrap .menu-toggle,
    .ast-header-break-point .ast-mobile-menu-trigger-minimal,
    .ast-header-break-point .main-header-menu-toggle {
        color: #102a5c !important;
    }

    .ast-header-break-point .ast-button-wrap .menu-toggle svg,
    .ast-header-break-point .ast-mobile-menu-trigger-minimal svg,
    .ast-header-break-point .main-header-menu-toggle svg {
        fill: currentColor !important;
        stroke: currentColor !important;
    }
}