/* Editorial layer: one navy palette, one type scale. Loaded last.
   Palette is built only from the brand navy #082b63 (hue ~217deg). No warm hues. */
:root {
  --navy-900:#061b38; --navy-700:#082b63; --navy-500:#1d4a8c; --navy-100:#e6ecf5; --navy-50:#f2f5fa;
  --ink:#1a1f2b; --muted:#4a5263; --line:#e3e6ec; --bg:#ffffff; --bg-alt:#f6f7f9;

  --font-serif:'Fraunces',Georgia,'Times New Roman',serif;
  --font-sans:'Inter',system-ui,-apple-system,'Segoe UI',Arial,sans-serif;

  /* Type scale: fluid between 390px and 1440px viewports */
  --fs-h1:clamp(2.5rem,1.95rem + 2.3vw,4rem);      /* 40 -> 64 */
  --fs-h2:clamp(2rem,1.7rem + 1.25vw,2.75rem);     /* 32 -> 44 */
  --fs-h3:clamp(1.25rem,1.16rem + .38vw,1.5rem);   /* 20 -> 24 */
  --fs-h4:1.125rem; --fs-h5:1rem; --fs-h6:.875rem;
  --fs-lead:1.125rem; --fs-body:1rem; --fs-small:.875rem;
  --lh-tight:1.1; --lh-heading:1.2; --lh-body:1.7;

  /* Legacy tokens from refinement.css / brand.css, remapped onto the palette */
  --navy:var(--navy-700); --navy-secondary:var(--navy-500); --blue:var(--navy-500);
  --paper:var(--bg); --neutral:var(--bg-alt); --border:var(--line);
  --mb-navy:var(--navy-700); --mb-deep:var(--navy-900); --mb-blue:var(--navy-500); --mb-pink:var(--navy-500);
  --mb-muted:var(--muted); --mb-line:var(--line); --mb-serif:var(--font-serif); --mb-sans:var(--font-sans);
  --mh-navy:var(--navy-700); --mh-deep:var(--navy-900); --mh-blue:var(--navy-500); --mh-pink:var(--navy-500);
  --mh-muted:var(--muted); --mh-edge:var(--line);
}
.mubashir-page,.mubashir-services {
  --mp-navy:var(--navy-700); --mp-deep:var(--navy-900); --mp-ink:var(--ink); --mp-blue:var(--navy-500);
  --mp-pink:var(--navy-500); --mp-teal:var(--navy-500); --mp-muted:var(--muted); --mp-border:var(--line);
  --mp-soft-pink:var(--bg-alt); --mp-soft-blue:var(--bg-alt);
  --ms-navy:var(--navy-700); --ms-deep:var(--navy-900); --ms-blue:var(--navy-500); --ms-pink:var(--navy-500);
  --ms-muted:var(--muted); --ms-border:var(--line);
}

/* ---------- Base text ---------- */
body {font-family:var(--font-sans);font-size:var(--fs-body);line-height:var(--lh-body);color:var(--ink);background:var(--bg)}
main :is(p,li,dd,blockquote,#mg-type) {font-family:var(--font-sans);line-height:var(--lh-body)}
main :is(p,#mg-type) {font-size:var(--fs-body)}
main :is(.mh-hero-copy,.ms-intro,.mp-intro,.mp-hero-intro,.ar-prose p,#mg-type) {font-size:var(--fs-lead)}
main :is(small,figcaption,time,#mg-type) {font-size:var(--fs-small)}

/* ---------- Headings ----------
   The unmatched #mg-type in :is() lifts specificity to one id, so this single scale
   wins over the per-page heading sizes in the approved-*.css files without !important. */
:is(h1,h2,h3,h4,h5,h6,#mg-type) {font-family:var(--font-serif);font-optical-sizing:auto;color:var(--navy-700);font-style:normal}
:is(h1,#mg-type) {font-size:var(--fs-h1);line-height:var(--lh-tight);font-weight:500;letter-spacing:-.022em}
:is(h2,#mg-type) {font-size:var(--fs-h2);line-height:1.15;font-weight:500;letter-spacing:-.016em}
:is(h3,#mg-type) {font-size:var(--fs-h3);line-height:var(--lh-heading);font-weight:500;letter-spacing:-.008em}
:is(h4,#mg-type) {font-size:var(--fs-h4);line-height:var(--lh-heading);font-weight:600;letter-spacing:0}
:is(h5,h6,#mg-type) {font-family:var(--font-sans);line-height:1.4;font-weight:600;letter-spacing:0}
:is(h5,#mg-type) {font-size:var(--fs-h5)}
:is(h6,#mg-type) {font-size:var(--fs-h6)}

/* No coloured words or sub-sizes fighting the scale inside headings */
:is(h1,h2,h3,h4,#mg-type) :is(span,em,strong,b) {color:inherit;font-weight:inherit;font-style:inherit}
/* Home hero second line stays a quieter sub-line of the same heading */
.mh-hero :is(h1,#mg-type) span {font-size:.58em;line-height:1.2;letter-spacing:-.012em;margin-top:.35em}

/* Small card titles in the compact home university grid */
.mh-university-card :is(h3,#mg-type) {font-size:var(--fs-h4);line-height:1.25}

/* Headings that sit on the existing navy surfaces stay white */
:is(.mp-cta,.ar-cta,.ms-final,.mb-footer,#mg-type) :is(h1,h2,h3,h4,h5,h6) {color:#fff}

/* Footer column titles are UI labels, not editorial headings */
.mb-footer-col :is(h2,#mg-type) {font-family:var(--font-sans);font-size:.75rem;line-height:1.4;font-weight:600;letter-spacing:.08em;text-transform:uppercase}

/* Headings set over photos inside contact-page cards: white, card-title size */
:is(.mc-guide-copy,.mc-why-head,#mg-type) :is(h2) {color:#fff;font-size:var(--fs-h3);line-height:var(--lh-heading)}

/* Agency polish: quieter labels, distinct display/UI type, and open layouts.
   Component exceptions live here so the shared scale stays predictable. */
:root { --radius:4px; --control-radius:4px; }
main :is(.mh-eyebrow,.mp-eyebrow,.ms-eyebrow,.mh-pill,.mp-pill,.ms-hero-label,#mg-type),
:is(.mh-eyebrow,.mp-eyebrow,.ms-eyebrow,.mh-pill,.mp-pill,.ms-hero-label) {
  font-family:var(--font-sans);font-size:11px;font-weight:600;
  line-height:1.5;letter-spacing:.14em;text-transform:uppercase;
}
:is(.mh-button,.ms-button,.mp-button,.mp-btn,.mb-cta,.mh-text-link,.mh-card-link) {
  font-family:var(--font-sans);font-weight:600;font-size:13px;
}
.mb-nav-link {font-weight:500}
.mb-tagline {font-weight:500;letter-spacing:.16em}
.mh-section,.ms-section,.mp-section {padding-block:88px}
.mh-section-head {margin-bottom:40px;gap:40px}
.mh-section-head h2 {margin-bottom:16px}
.mh-section-head p:not(.mh-eyebrow) {max-width:600px}
.mh-text-link {border-bottom-color:var(--line);padding-block:12px;transition:border-color .2s}
.mh-text-link:hover {border-bottom-color:var(--navy)}

/* One headline, one supporting paragraph, one clear primary action. */
.mh-hero {padding:76px 0 64px}
.mh-hero-grid {grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:72px}
.mh-hero :is(h1,#mg-type) {font-size:clamp(48px,5.6vw,82px);line-height:1.04;letter-spacing:-.045em;margin:22px 0 26px}
.mh-hero-copy {max-width:470px}
.mh-hero .mh-actions {margin-top:30px;gap:20px}
.mh-hero .mh-button-light {padding-inline:0;border:0;background:transparent}
.mh-hero .mh-button-light:hover {color:var(--navy-500)!important}
.mh-hero-figure {align-self:center}
.mh-hero-figure img {aspect-ratio:1.08;height:auto;min-height:0;max-height:none;border-radius:3px}
.mh-hero-figure figcaption {font-size:11px;letter-spacing:.08em;padding-top:16px}
.mh-stats {margin-top:38px;padding-top:24px;gap:18px}
.mh-stats b {font-weight:500;font-size:25px;font-variant-numeric:tabular-nums}
.mh-stats small {font-size:11px;margin-top:8px}
.mh-stats div {border:0;padding:0}

/* Services read as a considered index, with shared rules rather than six boxes. */
.mh-services {background:var(--bg-alt);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.mh-services-grid {gap:0 36px}
.mh-service-card {position:relative;padding:28px 0 24px;border:0;border-top:1px solid #ccd3dd;border-radius:0;background:transparent;min-height:232px;box-shadow:none}
.mh-service-card:hover {background:transparent;border-color:var(--navy);box-shadow:none}
.mh-service-card .mh-icon {width:26px;height:26px;border-radius:0;background:none}
.mh-service-card .mh-icon svg {width:24px;height:24px;stroke-width:1.5}
.mh-service-card :is(h3,#mg-type) {font-family:var(--font-sans);font-size:18px;font-weight:500;letter-spacing:-.02em;margin:20px 0 12px}
.mh-service-card :is(p,#mg-type) {font-size:14px;line-height:1.75;max-width:340px}
.mh-card-link {font-size:12px;font-weight:500}
.mh-why-visual {gap:20px}
.mh-why-main {height:360px;border-radius:3px}
.mh-why-quote {font-family:var(--font-serif);font-style:normal;font-size:25px;line-height:1.3}
.mh-why-inset :is(p,#mg-type) {font-size:13px}
.mh-benefits>div {font-weight:500;line-height:1.6}
.mh-benefit-symbol {background:none}

/* Keep small functional headings compact; reserve the serif for display text. */
:is(.mh-step,.mp-feature,.mp-reason,.ma-value,.mc-card,.mr-hero-panel,#mg-type) :is(h2,h3) {
  font-family:var(--font-sans);font-size:18px;line-height:1.4;font-weight:500;letter-spacing:-.015em;
}
.mh-university-card {flex-basis:calc((100% - 64px)/5);border:0;background:transparent;border-radius:0}
.mh-university-row {gap:16px}
.mh-university-image {height:150px;border-radius:3px}
.mh-uni-fallback {background:var(--navy-100);color:var(--navy)}
.mh-uni-fallback em {color:var(--muted);font-size:9px;letter-spacing:.08em}
.mh-university-card :is(h3,#mg-type) {font-family:var(--font-sans);font-size:15px;font-weight:500;line-height:1.5;margin:18px 0 6px}
.mh-university-card small {margin-inline:0;color:var(--muted)}
.mh-university-card:hover {box-shadow:none}
.mh-steps {border:0;border-top:1px solid var(--line);border-radius:0;padding:32px 0 0;gap:24px}
.mh-step {text-align:left;padding-inline:0 20px}
.mh-step-icon {display:none}
.mh-step :is(small,#mg-type) {font-size:11px;font-weight:500;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.mh-step :is(p,#mg-type) {font-size:13px;line-height:1.7}
.mh-step :is(h3,#mg-type) {font-size:16px;margin-block:14px 10px}
.mh-founder-grid {gap:72px}
.mh-founder-copy blockquote {border-left:1px solid var(--navy);padding-left:24px;font-family:var(--font-serif);font-size:24px;font-weight:500}
.mh-testimonials {background:#fff;border-top:1px solid var(--line)}
.mh-testimonial {padding:0 28px 0 0;border:0;border-right:1px solid var(--line);border-radius:0;background:transparent}
.mh-testimonial:last-child {border:0}
.mh-testimonial-person strong {font-weight:500}
.mh-testimonial-person span {font-size:11px;letter-spacing:.12em}
.mh-closing .mh-wrap {padding-block:88px}
.mh-closing :is(h2,#mg-type) {font-size:clamp(34px,4vw,54px);max-width:800px;margin-inline:auto}
.mh-closing p:not(.mh-eyebrow) {max-width:560px;margin-inline:auto}
.mh-closing .mh-button-light {display:none}

@media(max-width:1179px) {
  .mh-hero-grid {gap:40px}
  .mh-stats {grid-template-columns:repeat(2,minmax(0,1fr))}
  .mh-university-card {flex-basis:calc((100% - 48px)/4)}
}
@media(max-width:850px) {
  .mh-hero {padding-block:44px}
  .mh-hero-grid {grid-template-columns:1fr;gap:32px}
  .mh-hero-copy {max-width:580px}
  .mh-hero-figure img {height:320px;aspect-ratio:auto}
  .mh-stats {grid-template-columns:repeat(4,minmax(0,1fr))}
  .mh-section,.ms-section,.mp-section {padding-block:64px}
  .mh-founder-grid {gap:32px}
  .mh-university-card {flex-basis:calc((100% - 32px)/3)}
}
@media(max-width:600px) {
  .mh-hero {padding-block:36px}
  .mh-hero :is(h1,#mg-type) {font-size:52px;margin-block:18px 22px}
  .mh-hero :is(.mh-hero-copy,#mg-type) {font-size:16px}
  .mh-hero .mh-actions {gap:12px 20px}
  .mh-stats {grid-template-columns:repeat(2,minmax(0,1fr));gap:22px;margin-top:28px}
  .mh-hero-figure img {height:240px}
  .mh-section,.ms-section,.mp-section {padding-block:52px}
  .mh-section-head {gap:16px;margin-bottom:28px}
  .mh-services-grid {gap:0}
  .mh-service-card {display:grid;grid-template-columns:26px minmax(0,1fr);gap:0 18px;min-height:0;padding-block:24px}
  .mh-service-card .mh-icon {grid-row:1/4;align-self:start}
  .mh-service-card :is(h3,#mg-type) {margin:0 0 10px}
  .mh-service-card :is(h3,p,.mh-card-link) {grid-column:2}
  .mh-service-card p {margin-bottom:6px}
  .mh-why-main {height:260px}
  .mh-university-card {flex-basis:72%}
  .mh-step {display:block;padding:0 0 20px}
  .mh-step :is(h3,#mg-type) {margin-block:8px}
  .mh-testimonial {border-right:0;border-bottom:1px solid var(--line);padding:0 0 28px}
  .mh-closing .mh-wrap {padding-block:56px}
}
