.agent-page {
  color: #1f2937;
  background: #f8fafc;
  font-family: Inter, Arial, sans-serif;
  font-size: 16px;
  line-height: 26.4px;
}

.agent-page h1,
.agent-page h2,
.agent-page h3,
.agent-page p,
.agent-page figure,
.agent-page ul {
  margin: 0;
}

.agent-page ul {
  padding: 0;
}

.agent-page img {
  max-width: 100%;
}

/* The reference page uses a full desktop header through the 1024px layout. */
.agent-reference-layout .site-header {
  box-shadow: none;
}

.agent-reference-layout .desktop-nav .nav-link[href="/agent"] {
  color: #10192a;
  background: var(--navigation-accent);
}

.agent-reference-layout .brand {
  min-width: 250px;
  gap: 0;
}

.agent-reference-layout .brand__text {
  display: none;
}

.agent-reference-layout .brand__logo-wrap,
.agent-reference-layout .brand__logo {
  width: 250px;
  height: 50px;
}

@media (min-width: 921px) {
  .agent-reference-layout .contact-bar,
  .agent-reference-layout .identity-contacts,
  .agent-reference-layout .navbar-wrap {
    display: block;
  }

  .agent-reference-layout .identity-row__inner {
    min-height: 82px;
  }

  .agent-reference-layout .menu-toggle {
    display: none;
  }
}

@media (min-width: 921px) and (max-width: 1245px) {
  .agent-reference-layout .contact-bar {
    min-height: 54px;
  }

  .agent-reference-layout .contact-bar__inner {
    min-height: 53px;
  }

  .agent-reference-layout .navbar-wrap {
    display: block;
  }

  .agent-reference-layout .navbar {
    min-height: 60px;
    justify-content: flex-start;
  }

  .agent-reference-layout .desktop-nav,
  .agent-reference-layout .desktop-nav__list {
    width: 100%;
  }

  .agent-reference-layout .desktop-nav__list {
    flex-wrap: wrap;
    justify-content: flex-start;
  }
}

@media (max-width: 920px) {
  .agent-reference-layout .contact-bar,
  .agent-reference-layout .identity-contacts,
  .agent-reference-layout .navbar-wrap {
    display: none;
  }

  .agent-reference-layout .identity-row__inner {
    width: calc(100% - 40px);
    min-height: 80px;
    padding: 0;
  }

  .agent-reference-layout .brand {
    min-width: 250px;
  }

  .agent-reference-layout .apply-button--desktop {
    display: none;
  }

  .agent-reference-layout .menu-toggle {
    width: 42px;
    height: 42px;
    display: grid;
    place-items: center;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: var(--brand-primary);
  }

  .agent-reference-layout .menu-toggle > span {
    width: 20px;
    height: 2px;
    margin: 3px 0;
    background: #fff;
  }
}

.agent-hero {
  min-height: 274px;
  display: grid;
  place-items: center;
  overflow: hidden;
  background:
    linear-gradient(rgba(2, 13, 38, .74), rgba(6, 27, 70, .68)),
    #04183c url("/assets/university/mbbs/reference-inner-banner-bg.jpg") center / cover no-repeat;
}

.agent-hero__inner {
  width: 100%;
  padding: 0 10px;
  text-align: center;
}

.agent-hero h1 {
  color: #0f2d7a;
  font: 600 46px/64.4px Roboto, Arial, sans-serif;
}

.agent-hero p {
  margin: 20px 0 27.2px;
  color: #000;
  font: 400 17px/28.05px Roboto, Arial, sans-serif;
}

.agent-partner > .agent-content > h2 {
  padding: 56px 10px;
  color: #000;
  font: 600 30px/39px Roboto, Arial, sans-serif;
  text-align: center;
}

.agent-benefits h2 {
  padding: 55px 10px;
  color: #000;
  font: 600 30px/39px Roboto, Arial, sans-serif;
  text-align: center;
}

.agent-partner__grid {
  width: min(100%, 1140px);
  min-height: 916.7px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.agent-page .agent-reasons {
  padding: 10px;
  list-style: none;
}

.agent-reason {
  display: grid;
  grid-template-columns: 50px minmax(0, 1fr);
  gap: 15px;
  padding-right: 30px;
  margin: 0 0 20px;
}

.agent-reason:last-child {
  margin-bottom: 0;
}

.agent-reason__icon {
  width: 50px;
  height: 50px;
  display: grid;
  place-items: center;
  overflow: hidden;
}

.agent-reason__icon img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: contain;
}

.agent-reason__icon--brand {
  border-radius: 50%;
  background: #fff;
}

.agent-reason__icon--brand img {
  border-radius: 50%;
  object-fit: cover;
}

.agent-reason h3 {
  margin: 0 0 20px;
  color: #54595f;
  font: 600 25px/32.5px Roboto, Arial, sans-serif;
  text-align: justify;
}

.agent-reason p {
  color: #1f2937;
  font: 400 16px/26.4px Inter, Arial, sans-serif;
  text-align: justify;
}

.agent-partner__media {
  width: 100%;
  height: 916.7px;
  margin: 0;
}

.agent-partner__media img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
}

@media (max-width: 1024px) {
  .agent-partner__media {
    display: none;
  }
}

@media (min-width: 921px) and (max-width: 1245px) {
  .agent-partner__grid {
    height: 1022.3px;
    min-height: 0;
  }

  .agent-page .agent-reasons {
    height: 100%;
    min-height: 0;
  }
}

@media (min-width: 561px) and (max-width: 920px) {
  .agent-partner__grid {
    min-height: 1189.6px;
  }
}

@media (max-width: 767px) {
  .agent-partner__grid {
    grid-template-columns: 1fr;
  }

  .agent-reason {
    display: block;
    padding-right: 30px;
  }

  .agent-reason > div {
    margin-top: 15px;
  }
}

.agent-page .agent-benefits__grid {
  width: min(calc(100% - 56px), 1140px);
  min-height: 706.3px;
  margin: 0 auto;
  padding: 28px 0;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 56px 0;
  list-style: none;
}

.agent-benefit {
  min-width: 0;
  padding: 10px;
  text-align: center;
}

.agent-benefit:nth-child(3n + 2),
.agent-benefit:nth-child(3n + 3) {
  border-left: 1px solid #e9e9e9;
}

.agent-benefit img {
  display: block;
  width: 56px;
  max-width: none;
  height: 50px;
  margin: 0 0 22px 34.8%;
  object-fit: contain;
}

.agent-benefit:nth-child(2) img {
  width: 56px;
  height: 56px;
}

.agent-benefit:nth-child(3) img {
  width: 52px;
  height: 56px;
}

.agent-benefit:nth-child(4) img {
  width: 50px;
  height: 56px;
}

.agent-benefit:nth-child(5) img {
  width: 56px;
  height: 50px;
}

.agent-benefit:nth-child(6) img {
  width: 56px;
  height: 52px;
}

.agent-benefit h3 {
  margin: 0 0 20px;
  color: #284962;
  font: 600 18px/23.4px Roboto, Arial, sans-serif;
}

.agent-benefit p {
  color: #969a9e;
  font: 400 16px/26.4px Inter, Arial, sans-serif;
  text-align: center;
}

@media (min-width: 1246px) {
  .agent-benefit:nth-child(2) {
    padding-top: 33.1px;
  }

  .agent-benefit:nth-child(5) {
    padding-top: 25.9px;
  }

  .agent-benefit:nth-child(-n + 3) {
    min-height: 320.5px;
  }

  .agent-benefit:nth-child(n + 4) {
    min-height: 273.8px;
  }
}

/* Keep the full desktop navigation readable without creating a horizontal
   scrollbar on medium-wide screens.  The supplied reference is captured at
   a wider viewport, so its larger type and offset remain unchanged above
   1600px. */
@media (min-width: 1246px) and (max-width: 1600px) {
  html body.agent-reference-layout .site-header .desktop-nav__list {
    column-gap: 6px;
    transform: none;
  }

  html body.agent-reference-layout .site-header .nav-link {
    min-height: 64px !important;
    height: 64px !important;
    margin: 16px 0 !important;
    padding: 0 18px !important;
    font-size: 18px !important;
    line-height: 64px !important;
  }

  body.agent-reference-layout .agent-socials.social-share {
    right: 0;
  }
}

@media (min-width: 921px) and (max-width: 1245px) {
  .agent-benefit:nth-child(2) {
    padding-top: 46.6px;
  }

  .agent-benefit:nth-child(5) {
    padding-top: 26.2px;
  }

  .agent-page .agent-benefits__grid {
    min-height: 759.1px;
  }

  .agent-ways {
    min-height: 839.3px;
  }

  .agent-benefit:nth-child(-n + 3) {
    min-height: 346.9px;
  }

  .agent-benefit:nth-child(n + 4) {
    min-height: 300.1px;
  }
}

@media (min-width: 561px) and (max-width: 920px) {
  .agent-benefit:nth-child(2) {
    padding-top: 55.1px;
  }

  .agent-benefit:nth-child(5) {
    padding-top: 25.4px;
  }

  .agent-page .agent-benefits__grid {
    min-height: 869.9px;
  }

  .agent-benefit:nth-child(-n + 3) {
    min-height: 423.75px;
  }

  .agent-benefit:nth-child(n + 4) {
    min-height: 334.1px;
  }
}

.agent-ways {
  min-height: 812.9px;
  margin: 50px 0;
}

.agent-ways__inner {
  width: min(100%, 1140px);
  margin: 0 auto;
  padding: 10px;
}

.agent-ways h2 {
  margin: 0 0 70px;
  color: #000;
  font: 600 30px/39px Poppins, Arial, sans-serif;
  text-align: center;
}

.agent-ways article + article {
  margin-top: 20px;
}

.agent-ways article h2,
.agent-ways article h3 {
  margin: 0 0 20px;
  color: #54595f;
  font: 600 24px/31.2px Roboto, Arial, sans-serif;
}

.agent-ways article p {
  margin: 0 0 25.6px;
  color: #7a7a7a;
  font: 400 16px/26.4px Inter, Arial, sans-serif;
}

.agent-apply {
  min-height: 1232.2px;
  padding: 60px 0 71px;
  background: #1b63c7 url("/assets/agent/agent-application-campus.png") center / cover no-repeat;
}

.agent-apply__inner {
  width: 100%;
}

.agent-apply h2 {
  color: #fff;
  font: 600 45px/58.5px Roboto, Arial, sans-serif;
  text-align: center;
}

.agent-form-shell {
  width: min(100%, 676.7px);
  margin: 20px auto 0;
  padding: 10px;
  background: #fff;
}

.agent-form {
  width: 100%;
  margin: 24px 0;
  padding: 15px 0 0;
  color: #1f2937;
  background: transparent;
}

.agent-form > label,
.agent-form__phone {
  display: block;
  margin-bottom: 30px;
}

.agent-form input,
.agent-form select,
.agent-form textarea {
  width: 100%;
  min-width: 0;
  display: block;
  box-sizing: border-box;
  border: 1px solid #c9c9c9;
  border-radius: 0;
  color: rgba(0, 0, 0, .7);
  background: #fff;
  font: 400 16px/20.8px Inter, Arial, sans-serif;
}

.agent-form input,
.agent-form select {
  height: 43px;
  padding: 0 14px;
}

.agent-form input {
  line-height: 16px;
}

.agent-form select {
  line-height: 26.4px;
}

.agent-form textarea {
  height: 97.2px;
  min-height: 97.2px;
  padding: 14px;
  line-height: 20.8px;
  resize: vertical;
}

.agent-form input::placeholder,
.agent-form select,
.agent-form textarea::placeholder {
  color: #969a9e;
  opacity: 1;
}

.agent-form__date small {
  display: block;
  color: #7a7a7a;
  font: 400 16px/22px Inter, Arial, sans-serif;
}

.agent-form__phone {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 20px;
}

.agent-form__phone label {
  min-width: 0;
}

.agent-form > label.agent-form__wechat {
  margin-bottom: 0;
}

.agent-form__wechat > span {
  display: block;
  margin: 0 0 15px;
  color: #111;
  font: 700 16px/19px Inter, Arial, sans-serif;
}

.agent-form__turnstile {
  height: 107.4px;
  min-height: 0;
  display: block;
  overflow: hidden;
  font-size: 0;
}

.agent-form__turnstile[data-state="unavailable"] {
  height: auto;
  min-height: 65px;
  display: flex;
  align-items: flex-start;
  overflow: visible;
  color: #5b6472;
  font: 400 16px/26px Inter, Arial, sans-serif;
}

.agent-form button[type="submit"] {
  min-width: 86.9px;
  height: 41px;
  padding: 0 15px;
  border: 0;
  border-radius: 2px;
  color: #fff;
  background: #0d75b8;
  font: 500 17px/17px Inter, Arial, sans-serif;
  cursor: not-allowed;
}

.agent-form button[type="submit"]:disabled {
  opacity: 1;
}

.agent-form__status {
  min-height: 0;
  margin: 0;
  color: #5b6472;
  font: 400 14px/20px Inter, Arial, sans-serif;
}

@media (max-width: 920px) {
  .agent-page {
    font-size: 14.592px;
    line-height: 24.0768px;
  }

  .agent-partner > .agent-content > h2,
  .agent-benefits h2,
  .agent-ways h2 {
    font-size: 25px;
    line-height: 32.5px;
  }

  .agent-reason p,
  .agent-benefit p,
  .agent-ways article p {
    font-size: 14.592px;
    line-height: 24.0768px;
  }

  .agent-form-shell {
    width: 79.34%;
    position: relative;
    left: -2.5px;
  }

  .agent-ways {
    min-height: 817.8px;
  }

}

@media (max-width: 560px) {
  .agent-partner > .agent-content > h2,
  .agent-benefits h2,
  .agent-ways h2 {
    padding-right: 10px;
    padding-left: 10px;
  }

  .agent-page .agent-benefits__grid {
    width: calc(100% - 56px);
    min-height: 1739.5px;
    display: flex;
    flex-direction: column;
    row-gap: 0;
    padding: 28px 0;
  }

  .agent-benefit {
    flex: 0 0 auto;
  }

  .agent-benefit:nth-child(1) {
    height: 328.1px;
  }

  .agent-benefit:nth-child(2) {
    height: 261.9px;
  }

  .agent-benefit:nth-child(3) {
    height: 285.95px;
    margin-bottom: 56px;
  }

  .agent-benefit:nth-child(4) {
    height: 261.9px;
  }

  .agent-benefit:nth-child(5) {
    height: 231.8px;
  }

  .agent-benefit:nth-child(6) {
    height: 257.9px;
  }

  .agent-benefit:nth-child(3n + 2),
  .agent-benefit:nth-child(3n + 3) {
    border-left: 0;
  }

  .agent-ways__inner {
    width: 100%;
  }

  .agent-form-shell {
    width: 100%;
    left: 0;
    margin-top: 21px;
  }

  .agent-apply h2 {
    font-size: 35px;
    line-height: 58.5px;
  }

  .agent-form {
    padding-right: 1px;
    padding-left: 1px;
  }

  .agent-form__phone {
    gap: 22px;
  }

  .agent-form button[type="submit"] {
    margin-left: -1px;
  }

  .agent-partner__grid {
    min-height: 1337.6px;
  }

  .agent-ways {
    min-height: 1218.6px;
  }

  .agent-apply {
    min-height: 1292.4px;
  }
}

@media (min-width: 921px) {
  .agent-form-shell {
    position: relative;
    left: -3px;
  }
}

@media (min-width: 561px) and (max-width: 920px) {
  .agent-apply h2 {
    font-size: 42px;
    line-height: 58.5px;
  }
}

@media (min-width: 921px) and (max-width: 1245px) {
  .agent-ways {
    min-height: 839.3px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .agent-page *,
  .agent-page *::before,
  .agent-page *::after {
    transition-duration: .01ms;
    animation-duration: .01ms;
    animation-iteration-count: 1;
  }
}

/* Reference-page restoration. These route selectors intentionally outrank the
   shared card/hero treatment so the original large editorial layout remains. */
body.agent-reference-layout .agent-page {
  color: #1f2937;
  background: #fff;
}

body.agent-reference-layout .agent-hero {
  min-height: clamp(330px, 22vw, 412px) !important;
  height: auto !important;
  display: grid;
  place-items: center;
  padding: 0 !important;
  color: #fff;
  background:
    linear-gradient(rgba(2, 13, 38, .74), rgba(6, 27, 70, .68)),
    #04183c url("/assets/university/mbbs/reference-inner-banner-bg.jpg") center / cover no-repeat !important;
}

body.agent-reference-layout .agent-hero::before,
body.agent-reference-layout .agent-hero::after {
  display: none !important;
}

body.agent-reference-layout .agent-hero h1 {
  color: #fff;
  font: 600 clamp(48px, 3.8vw, 70px) / 1.14 Roboto, Arial, sans-serif;
  letter-spacing: -.035em;
}

body.agent-reference-layout .agent-hero p {
  max-width: none;
  margin: 34px 0 0;
  color: #000;
  font: 400 clamp(20px, 1.5vw, 28px) / 1.45 Roboto, Arial, sans-serif;
}

body.agent-reference-layout .agent-content,
body.agent-reference-layout .agent-benefits,
body.agent-reference-layout .agent-ways {
  background: #fff;
}

body.agent-reference-layout .agent-partner > .agent-content > h2,
body.agent-reference-layout .agent-benefits h2 {
  padding: clamp(68px, 6vw, 104px) 20px;
  color: #000;
  font: 600 clamp(34px, 2.45vw, 46px) / 1.28 Roboto, Arial, sans-serif;
  letter-spacing: -.025em;
}

body.agent-reference-layout .agent-partner__grid {
  width: min(calc(100% - clamp(40px, 6.5vw, 120px)), 1608px);
  min-height: 916px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0;
}

body.agent-reference-layout .agent-page .agent-reasons {
  padding: 16px 34px 16px 0;
}

body.agent-reference-layout .agent-reason,
body.agent-reference-layout .agent-benefit {
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  transform: none;
}

body.agent-reference-layout .agent-reason:hover,
body.agent-reference-layout .agent-benefit:hover {
  border: 0;
  box-shadow: none;
  transform: none;
}

body.agent-reference-layout .agent-reason {
  grid-template-columns: 66px minmax(0, 1fr);
  gap: 22px;
  padding: 0;
  margin-bottom: 34px;
}

body.agent-reference-layout .agent-reason__icon {
  width: 66px;
  height: 66px;
}

body.agent-reference-layout .agent-reason h3 {
  margin-bottom: 20px;
  color: #54595f;
  font: 600 clamp(27px, 2vw, 38px) / 1.24 Roboto, Arial, sans-serif;
  text-align: left;
}

body.agent-reference-layout .agent-reason p {
  color: #1f2937;
  font: 400 clamp(16px, 1.18vw, 20px) / 1.72 Inter, Arial, sans-serif;
  text-align: justify;
}

body.agent-reference-layout .agent-partner__media {
  height: 916px;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}

body.agent-reference-layout .agent-partner__media img {
  border-radius: 0;
}

body.agent-reference-layout .agent-page .agent-benefits__grid {
  width: min(calc(100% - 80px), 1500px);
  min-height: 706px;
  gap: 56px 0;
}

body.agent-reference-layout .agent-benefit p {
  font-size: 16px;
  line-height: 1.68;
}

body.agent-reference-layout .agent-ways {
  min-height: 0;
  margin: clamp(70px, 6vw, 110px) 0;
}

body.agent-reference-layout .agent-ways__inner {
  width: min(calc(100% - 64px), 1500px);
}

body.agent-reference-layout .agent-ways h2 {
  margin-bottom: 70px;
  font-size: clamp(34px, 2.45vw, 46px);
}

body.agent-reference-layout .agent-ways article + article {
  margin-top: 40px;
}

body.agent-reference-layout .agent-ways article h2,
body.agent-reference-layout .agent-ways article h3,
body.agent-reference-layout .agent-ways article h4 {
  margin: 0 0 20px;
  color: #54595f;
  font: 600 clamp(24px, 1.75vw, 32px) / 1.3 Roboto, Arial, sans-serif;
}

body.agent-reference-layout .agent-ways article h4 {
  color: #173f9c;
  font-size: clamp(20px, 1.45vw, 26px);
}

body.agent-reference-layout .agent-ways article p {
  color: #7a7a7a;
  font-size: clamp(16px, 1.15vw, 20px);
  line-height: 1.72;
}

body.agent-reference-layout .agent-ways article .agent-ways__lead {
  margin-bottom: 25.6px;
}

body.agent-reference-layout .agent-form-shell {
  border-radius: 0;
}

@media (max-width: 1024px) {
  body.agent-reference-layout .agent-partner__grid {
    width: min(calc(100% - 44px), 820px);
    min-height: 0;
    grid-template-columns: 1fr;
  }

  body.agent-reference-layout .agent-page .agent-reasons {
    padding-right: 0;
  }
}

@media (max-width: 700px) {
  body.agent-reference-layout .agent-hero {
    min-height: 300px !important;
    padding: 56px 18px !important;
  }

  body.agent-reference-layout .agent-hero h1 {
    font-size: 43px;
  }

  body.agent-reference-layout .agent-hero p {
    margin-top: 24px;
    font-size: 18px;
  }

  body.agent-reference-layout .agent-partner__grid,
  body.agent-reference-layout .agent-ways__inner {
    width: calc(100% - 28px);
  }

  body.agent-reference-layout .agent-reason {
    display: grid;
    grid-template-columns: 54px minmax(0, 1fr);
    gap: 16px;
  }

  body.agent-reference-layout .agent-reason__icon {
    width: 54px;
    height: 54px;
  }

  body.agent-reference-layout .agent-reason > div {
    margin-top: 0;
  }

  body.agent-reference-layout .agent-page .agent-benefits__grid {
    width: calc(100% - 28px);
    min-height: 0;
    display: grid;
    grid-template-columns: 1fr;
    gap: 32px;
  }

  body.agent-reference-layout .agent-benefit,
  body.agent-reference-layout .agent-benefit:nth-child(n) {
    height: auto;
    min-height: 0;
    margin: 0;
    padding: 24px 10px;
  }
}

/* Final reference alignment: the legacy page rules use an html+body selector,
   so keep these high-specificity values at the end of the stylesheet. */
html body.agent-reference-layout .agent-page,
html body.agent-reference-layout .agent-content,
html body.agent-reference-layout .agent-partner,
html body.agent-reference-layout .agent-benefits,
html body.agent-reference-layout .agent-ways,
html body.agent-reference-layout .agent-form-section {
  background: #f8fafc !important;
}

html body.agent-reference-layout .agent-hero {
  min-height: 274px !important;
  height: 274px !important;
  padding: 80px 20px !important;
  background: #fff !important;
}

html body.agent-reference-layout .agent-hero h1 {
  color: #123b82 !important;
  font: 600 46px/1.2 Roboto, Arial, sans-serif !important;
  letter-spacing: normal !important;
}

html body.agent-reference-layout .agent-hero p {
  margin-top: 36px !important;
  color: #000 !important;
  font: 400 24px/1.35 Roboto, Arial, sans-serif !important;
}

html body.agent-reference-layout .agent-partner__grid {
  width: min(100%, 1140px) !important;
  max-width: 1140px !important;
  min-height: 916.7px !important;
  margin: 0 auto !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 0 !important;
}

html body.agent-reference-layout .agent-partner__media {
  width: 100% !important;
  max-width: none !important;
  height: 916.7px !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

html body.agent-reference-layout .agent-partner__media img {
  border-radius: 0 !important;
}

html body.agent-reference-layout .agent-reason,
html body.agent-reference-layout .agent-benefit {
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  transform: none !important;
}

html body.agent-reference-layout .agent-partner h2,
html body.agent-reference-layout .agent-benefits h2,
html body.agent-reference-layout .agent-ways > h2,
html body.agent-reference-layout .agent-form-section > h2 {
  color: #000 !important;
  font: 600 30px/39px Roboto, Arial, sans-serif !important;
  letter-spacing: normal !important;
}

html body.agent-reference-layout .agent-page .agent-benefits__grid {
  width: min(calc(100% - 56px), 1140px) !important;
  max-width: 1140px !important;
  min-height: 706.3px !important;
  margin: 0 auto !important;
  padding: 28px 0 !important;
  gap: 56px 0 !important;
}

@media (min-width: 1025px) {
  html body.agent-reference-layout .site-header .navbar-wrap {
    height: 60px !important;
    min-height: 60px !important;
    background: var(--brand-primary) !important;
    border: 0 !important;
  }

  html body.agent-reference-layout .site-header .navbar {
    height: 60px !important;
    min-height: 60px !important;
  }

  html body.agent-reference-layout .site-header .desktop-nav__list {
    width: auto !important;
    min-width: 0 !important;
    column-gap: 0 !important;
    transform: none !important;
  }

  html body.agent-reference-layout .site-header .nav-link {
    min-height: 60px !important;
    height: 60px !important;
    margin: 0 !important;
    padding: 0 16px !important;
    border-radius: 0 !important;
    color: rgba(255, 255, 255, .92) !important;
    background: transparent !important;
    box-shadow: none !important;
    font: 600 16px/60px var(--font-display) !important;
  }

  html body.agent-reference-layout .site-header .nav-link:hover,
  html body.agent-reference-layout .site-header .nav-link:focus-visible,
  html body.agent-reference-layout .site-header .nav-link.is-active,
  html body.agent-reference-layout .site-header .nav-dropdown.is-open > .nav-link,
  html body.agent-reference-layout .site-header .nav-dropdown.is-open > .nav-link-group > .nav-link,
  html body.agent-reference-layout .site-header .nav-link-group:hover > .nav-link,
  html body.agent-reference-layout .site-header .nav-link-group:focus-within > .nav-link {
    color: #10192a !important;
    background: var(--navigation-accent) !important;
    box-shadow: none !important;
  }
}

/* Compact editorial layout: keep the supplied content and interactions while
   removing the legacy fixed-height bands that created large empty gaps. */
html body.agent-reference-layout .agent-page {
  overflow-x: clip;
}

@media (min-width: 1246px) {
  html body.agent-reference-layout .agent-hero {
    min-height: 412px !important;
    height: 412px !important;
    padding: 0 20px !important;
  }

  html body.agent-reference-layout .agent-hero h1 {
    font: 600 clamp(48px, 3.8vw, 70px) / 1.14 Roboto, Arial, sans-serif !important;
    letter-spacing: -.035em !important;
  }

  html body.agent-reference-layout .agent-hero p {
    margin: 34px 0 0 !important;
    font: 400 clamp(20px, 1.5vw, 28px) / 1.45 Roboto, Arial, sans-serif !important;
  }

  html body.agent-reference-layout .agent-partner > .agent-content > h2,
  html body.agent-reference-layout .agent-benefits h2 {
    padding: 64px 20px 52px !important;
    font: 600 clamp(34px, 2.45vw, 46px) / 1.28 Roboto, Arial, sans-serif !important;
    letter-spacing: -.025em !important;
  }

  html body.agent-reference-layout .agent-partner__grid {
    width: calc(100% - 240px) !important;
    max-width: 1700px !important;
    min-height: 0 !important;
    height: auto !important;
    margin: 0 auto !important;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
    align-items: start !important;
  }

  html body.agent-reference-layout .agent-page .agent-reasons {
    min-height: 0 !important;
    height: auto !important;
    padding: 0 34px 0 0 !important;
  }

  html body.agent-reference-layout .agent-reason {
    grid-template-columns: 66px minmax(0, 1fr) !important;
    gap: 22px !important;
    padding: 0 !important;
    margin: 0 0 26px !important;
  }

  html body.agent-reference-layout .agent-reason h3 {
    margin: 0 0 14px !important;
    font-size: clamp(25px, 1.8vw, 36px) !important;
    line-height: 1.24 !important;
    text-align: left !important;
  }

  html body.agent-reference-layout .agent-reason p {
    font-size: clamp(15px, 1.04vw, 18px) !important;
    line-height: 1.62 !important;
    text-align: left !important;
  }

  html body.agent-reference-layout .agent-partner__media {
    width: 100% !important;
    height: clamp(680px, 42vw, 820px) !important;
    min-height: 0 !important;
  }

  html body.agent-reference-layout .agent-partner__media img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center top !important;
  }

  html body.agent-reference-layout .agent-page .agent-benefits__grid {
    width: calc(100% - 240px) !important;
    max-width: 1700px !important;
    min-height: 0 !important;
    height: auto !important;
    padding: 0 0 42px !important;
    gap: 32px 0 !important;
  }

  html body.agent-reference-layout .agent-benefit,
  html body.agent-reference-layout .agent-benefit:nth-child(n) {
    min-height: 0 !important;
    height: auto !important;
    padding: 16px 18px !important;
  }

  html body.agent-reference-layout .agent-ways {
    min-height: 0 !important;
    height: auto !important;
    margin: 48px 0 !important;
  }

  html body.agent-reference-layout .agent-ways__inner {
    width: calc(100% - 240px) !important;
    max-width: 1700px !important;
    padding: 0 !important;
  }

  html body.agent-reference-layout .agent-ways h2 {
    margin-bottom: 40px !important;
    font: 600 clamp(34px, 2.45vw, 46px) / 1.28 Poppins, Arial, sans-serif !important;
  }

  html body.agent-reference-layout .agent-ways article + article {
    margin-top: 24px !important;
  }

  html body.agent-reference-layout .agent-apply {
    min-height: 0 !important;
    height: auto !important;
    padding: 52px 0 64px !important;
  }
}

@media (min-width: 1025px) and (max-width: 1245px) {
  html body.agent-reference-layout .agent-hero {
    min-height: 320px !important;
    height: 320px !important;
    padding: 0 20px !important;
  }

  html body.agent-reference-layout .agent-partner > .agent-content > h2,
  html body.agent-reference-layout .agent-benefits h2 {
    padding: 48px 20px 38px !important;
    font-size: 34px !important;
    line-height: 1.25 !important;
  }

  html body.agent-reference-layout .agent-partner__grid {
    width: calc(100% - 80px) !important;
    max-width: none !important;
    min-height: 0 !important;
    height: auto !important;
    margin: 0 auto !important;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
  }

  html body.agent-reference-layout .agent-page .agent-reasons {
    height: auto !important;
    min-height: 0 !important;
    padding: 0 24px 0 0 !important;
  }

  html body.agent-reference-layout .agent-partner__media {
    height: 680px !important;
    min-height: 0 !important;
  }

  html body.agent-reference-layout .agent-page .agent-benefits__grid,
  html body.agent-reference-layout .agent-ways__inner {
    width: calc(100% - 80px) !important;
    max-width: none !important;
  }

  html body.agent-reference-layout .agent-page .agent-benefits__grid {
    min-height: 0 !important;
    height: auto !important;
    padding: 0 0 36px !important;
    gap: 28px 0 !important;
  }

  html body.agent-reference-layout .agent-benefit,
  html body.agent-reference-layout .agent-benefit:nth-child(n) {
    min-height: 0 !important;
    height: auto !important;
    padding: 14px 12px !important;
  }

  html body.agent-reference-layout .agent-ways {
    min-height: 0 !important;
    height: auto !important;
    margin: 40px 0 !important;
  }

  html body.agent-reference-layout .agent-apply {
    min-height: 0 !important;
    height: auto !important;
    padding: 48px 0 58px !important;
  }
}

@media (max-width: 1024px) {
  html body.agent-reference-layout .agent-hero {
    min-height: 230px !important;
    height: auto !important;
    padding: 52px 18px !important;
  }

  html body.agent-reference-layout .agent-partner > .agent-content > h2,
  html body.agent-reference-layout .agent-benefits h2 {
    padding: 40px 16px 30px !important;
    font-size: clamp(26px, 6vw, 34px) !important;
    line-height: 1.25 !important;
  }

  html body.agent-reference-layout .agent-partner__grid {
    width: calc(100% - 32px) !important;
    max-width: none !important;
    min-height: 0 !important;
    height: auto !important;
    margin: 0 auto !important;
    grid-template-columns: minmax(0, 1fr) !important;
  }

  html body.agent-reference-layout .agent-page .agent-reasons {
    width: 100% !important;
    min-height: 0 !important;
    height: auto !important;
    padding: 0 !important;
  }

  html body.agent-reference-layout .agent-reason {
    grid-template-columns: 54px minmax(0, 1fr) !important;
    gap: 16px !important;
    padding: 0 !important;
    margin: 0 0 24px !important;
  }

  html body.agent-reference-layout .agent-reason__icon {
    width: 54px !important;
    height: 54px !important;
  }

  html body.agent-reference-layout .agent-reason h3 {
    margin: 0 0 10px !important;
    font-size: clamp(22px, 5.5vw, 30px) !important;
    line-height: 1.25 !important;
    text-align: left !important;
  }

  html body.agent-reference-layout .agent-reason p {
    font-size: 15px !important;
    line-height: 1.6 !important;
    text-align: left !important;
  }

  html body.agent-reference-layout .agent-partner__media {
    display: none !important;
  }

  html body.agent-reference-layout .agent-page .agent-benefits__grid {
    width: calc(100% - 32px) !important;
    max-width: none !important;
    min-height: 0 !important;
    height: auto !important;
    padding: 0 0 34px !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 24px !important;
  }

  html body.agent-reference-layout .agent-benefit,
  html body.agent-reference-layout .agent-benefit:nth-child(n) {
    min-height: 0 !important;
    height: auto !important;
    margin: 0 !important;
    padding: 18px 14px !important;
  }

  html body.agent-reference-layout .agent-ways {
    min-height: 0 !important;
    height: auto !important;
    margin: 40px 0 !important;
  }

  html body.agent-reference-layout .agent-ways__inner {
    width: calc(100% - 32px) !important;
    max-width: none !important;
    padding: 0 !important;
  }

  html body.agent-reference-layout .agent-ways h2 {
    margin-bottom: 32px !important;
    font-size: clamp(26px, 6vw, 34px) !important;
    line-height: 1.25 !important;
  }

  html body.agent-reference-layout .agent-ways article + article {
    margin-top: 24px !important;
  }

  html body.agent-reference-layout .agent-apply {
    min-height: 0 !important;
    height: auto !important;
    padding: 48px 16px 56px !important;
  }
}

/* Compact composition pass (agent page)
   -------------------------------------
   The route has accumulated several historical reference overrides above.
   Keep this final, route-scoped pass as the single source of truth for the
   vertical rhythm: the hero remains prominent, while the partner, benefits,
   and application sections size to their content instead of reserving large
   empty fixed-height bands.  The two-column reading composition is retained
   on desktop and collapses cleanly at the existing tablet breakpoint. */
html body.agent-reference-layout .agent-page {
  overflow-x: clip;
}

@media (min-width: 1246px) {
  html body.agent-reference-layout .agent-hero {
    min-height: 412px !important;
    height: 412px !important;
    padding: 0 20px !important;
  }

  html body.agent-reference-layout .agent-partner > .agent-content > h2 {
    padding: 64px 20px 52px !important;
  }

  html body.agent-reference-layout .agent-partner__grid {
    width: calc(100% - 240px) !important;
    max-width: 1700px !important;
    min-height: 0 !important;
    margin: 0 auto !important;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
    align-items: start !important;
  }

  html body.agent-reference-layout .agent-page .agent-reasons {
    min-height: 0 !important;
    padding: 0 34px 0 0 !important;
  }

  html body.agent-reference-layout .agent-reason {
    grid-template-columns: 66px minmax(0, 1fr) !important;
    gap: 22px !important;
    padding: 0 !important;
    margin: 0 0 26px !important;
  }

  html body.agent-reference-layout .agent-reason h3 {
    margin: 0 0 14px !important;
    font-size: clamp(25px, 1.8vw, 36px) !important;
    line-height: 1.24 !important;
  }

  html body.agent-reference-layout .agent-reason p {
    font-size: clamp(15px, 1.04vw, 18px) !important;
    line-height: 1.62 !important;
  }

  html body.agent-reference-layout .agent-partner__media {
    width: 100% !important;
    height: clamp(680px, 42vw, 820px) !important;
    min-height: 0 !important;
  }

  html body.agent-reference-layout .agent-partner__media img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center top !important;
  }

  html body.agent-reference-layout .agent-benefits h2 {
    padding: 48px 20px 30px !important;
  }

  html body.agent-reference-layout .agent-page .agent-benefits__grid {
    width: calc(100% - 240px) !important;
    max-width: 1700px !important;
    min-height: 0 !important;
    padding: 0 0 42px !important;
    gap: 32px 0 !important;
  }

  html body.agent-reference-layout .agent-benefit,
  html body.agent-reference-layout .agent-benefit:nth-child(n) {
    min-height: 0 !important;
    height: auto !important;
    padding: 16px 18px !important;
  }

  html body.agent-reference-layout .agent-ways {
    min-height: 0 !important;
    margin: 48px 0 !important;
  }

  html body.agent-reference-layout .agent-ways__inner {
    width: calc(100% - 240px) !important;
    max-width: 1700px !important;
    padding: 0 !important;
  }

  html body.agent-reference-layout .agent-ways h2 {
    margin-bottom: 40px !important;
  }

  html body.agent-reference-layout .agent-ways article + article {
    margin-top: 24px !important;
  }

  html body.agent-reference-layout .agent-apply {
    min-height: 0 !important;
    padding: 52px 0 64px !important;
  }
}

@media (min-width: 1025px) and (max-width: 1245px) {
  html body.agent-reference-layout .agent-hero {
    min-height: 320px !important;
    height: 320px !important;
    padding: 0 20px !important;
  }

  html body.agent-reference-layout .agent-partner > .agent-content > h2 {
    padding: 48px 20px 38px !important;
  }

  html body.agent-reference-layout .agent-partner__grid {
    width: calc(100% - 80px) !important;
    max-width: none !important;
    min-height: 0 !important;
    margin: 0 auto !important;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
  }

  html body.agent-reference-layout .agent-page .agent-reasons {
    padding: 0 24px 0 0 !important;
  }

  html body.agent-reference-layout .agent-partner__media {
    height: 680px !important;
    min-height: 0 !important;
  }

  html body.agent-reference-layout .agent-page .agent-benefits__grid,
  html body.agent-reference-layout .agent-ways__inner {
    width: calc(100% - 80px) !important;
    max-width: none !important;
  }

  html body.agent-reference-layout .agent-page .agent-benefits__grid {
    min-height: 0 !important;
    padding: 0 0 36px !important;
    gap: 28px 0 !important;
  }

  html body.agent-reference-layout .agent-benefit,
  html body.agent-reference-layout .agent-benefit:nth-child(n) {
    min-height: 0 !important;
    height: auto !important;
    padding: 14px 12px !important;
  }

  html body.agent-reference-layout .agent-ways {
    min-height: 0 !important;
    margin: 40px 0 !important;
  }

  html body.agent-reference-layout .agent-apply {
    min-height: 0 !important;
    padding: 48px 0 58px !important;
  }
}

@media (max-width: 1024px) {
  html body.agent-reference-layout .agent-hero {
    min-height: 230px !important;
    height: auto !important;
    padding: 52px 18px !important;
  }

  html body.agent-reference-layout .agent-hero h1 {
    font-size: clamp(34px, 9vw, 46px) !important;
    line-height: 1.14 !important;
  }

  html body.agent-reference-layout .agent-hero p {
    margin-top: 20px !important;
    font-size: clamp(16px, 4vw, 20px) !important;
    line-height: 1.45 !important;
  }

  html body.agent-reference-layout .agent-partner > .agent-content > h2,
  html body.agent-reference-layout .agent-benefits h2 {
    padding: 40px 16px 30px !important;
    font-size: clamp(26px, 6vw, 34px) !important;
    line-height: 1.25 !important;
  }

  /* The desktop html+body rule above is intentionally overridden here so
     narrow screens use one readable column rather than a 195px split. */
  html body.agent-reference-layout .agent-partner__grid {
    width: calc(100% - 32px) !important;
    max-width: none !important;
    min-height: 0 !important;
    margin: 0 auto !important;
    grid-template-columns: minmax(0, 1fr) !important;
  }

  html body.agent-reference-layout .agent-page .agent-reasons {
    width: 100% !important;
    min-height: 0 !important;
    padding: 0 !important;
  }

  html body.agent-reference-layout .agent-reason {
    grid-template-columns: 54px minmax(0, 1fr) !important;
    gap: 16px !important;
    padding: 0 !important;
    margin: 0 0 24px !important;
  }

  html body.agent-reference-layout .agent-reason__icon {
    width: 54px !important;
    height: 54px !important;
  }

  html body.agent-reference-layout .agent-reason h3 {
    margin: 0 0 10px !important;
    font-size: clamp(22px, 5.5vw, 30px) !important;
    line-height: 1.25 !important;
    text-align: left !important;
  }

  html body.agent-reference-layout .agent-reason p {
    font-size: 15px !important;
    line-height: 1.6 !important;
    text-align: left !important;
  }

  html body.agent-reference-layout .agent-partner__media {
    display: none !important;
  }

  html body.agent-reference-layout .agent-page .agent-benefits__grid {
    width: calc(100% - 32px) !important;
    max-width: none !important;
    min-height: 0 !important;
    padding: 0 0 34px !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 24px !important;
  }

  html body.agent-reference-layout .agent-benefit,
  html body.agent-reference-layout .agent-benefit:nth-child(n) {
    min-height: 0 !important;
    height: auto !important;
    margin: 0 !important;
    padding: 18px 14px !important;
  }

  html body.agent-reference-layout .agent-ways {
    min-height: 0 !important;
    margin: 40px 0 !important;
  }

  html body.agent-reference-layout .agent-ways__inner {
    width: calc(100% - 32px) !important;
    max-width: none !important;
    padding: 0 !important;
  }

  html body.agent-reference-layout .agent-ways h2 {
    margin-bottom: 32px !important;
    font-size: clamp(26px, 6vw, 34px) !important;
    line-height: 1.25 !important;
  }

  html body.agent-reference-layout .agent-ways article + article {
    margin-top: 24px !important;
  }

  html body.agent-reference-layout .agent-apply {
    min-height: 0 !important;
    padding: 48px 16px 56px !important;
  }
}

/* Match the reference desktop viewport: the shared contact and identity rows
   remain in the document flow, while the navigation becomes the taller,
   white row shown above the agent hero.  Keeping the rows in flow also means
   the layout aligns correctly when a visitor lands on a scrolled anchor. */
@media (min-width: 1246px) {
  html body.agent-reference-layout .site-header .navbar-wrap {
    height: 96px !important;
    min-height: 96px !important;
    background: #fff !important;
    border-top: 1px solid #edf0f8;
    border-bottom: 1px solid #edf0f8;
  }

  html body.agent-reference-layout .site-header .navbar {
    height: 96px !important;
    min-height: 96px !important;
  }

  html body.agent-reference-layout .site-header .desktop-nav__list {
    width: auto !important;
    min-width: 0 !important;
    column-gap: 9.5px;
    transform: translateX(36px);
  }

  html body.agent-reference-layout .site-header .nav-link {
    min-height: 68px !important;
    height: 68px !important;
    margin: 14px 0 !important;
    padding: 0 22px !important;
    border-radius: 999px !important;
    color: #3d465d !important;
    background: transparent !important;
    font: 600 20px/68px Roboto, Arial, sans-serif !important;
    letter-spacing: 0 !important;
  }

  html body.agent-reference-layout .site-header .nav-link:hover,
  html body.agent-reference-layout .site-header .nav-link:focus-visible,
  html body.agent-reference-layout .site-header .nav-link.is-active,
  html body.agent-reference-layout .site-header .nav-dropdown.is-open > .nav-link,
  html body.agent-reference-layout .site-header .nav-dropdown.is-open > .nav-link-group > .nav-link,
  html body.agent-reference-layout .site-header .nav-link-group:hover > .nav-link,
  html body.agent-reference-layout .site-header .nav-link-group:focus-within > .nav-link {
    color: #fff !important;
    background: linear-gradient(135deg, #2569ca, #4b8de4) !important;
    box-shadow: 0 12px 24px rgba(37, 105, 202, .2) !important;
  }

  html body.agent-reference-layout .site-header .nav-link__chevron {
    color: inherit;
  }

  html body.agent-reference-layout .agent-hero {
    min-height: 412px !important;
  }

  html body.agent-reference-layout .agent-page,
  html body.agent-reference-layout .agent-partner,
  html body.agent-reference-layout .agent-content,
  html body.agent-reference-layout .agent-benefits,
  html body.agent-reference-layout .agent-ways {
    background: #f8fafc;
  }

  html body.agent-reference-layout .agent-partner > .agent-content > h2 {
    padding: 90px 20px 78px !important;
  }

  html body.agent-reference-layout .agent-partner__grid {
    width: calc(100% - clamp(30px, 6.5vw, 120px) - clamp(20px, 1.8vw, 34px)) !important;
    max-width: none !important;
    margin: 0 clamp(20px, 1.8vw, 34px) 0 clamp(30px, 6.5vw, 120px) !important;
    grid-template-columns: minmax(0, 49.5fr) minmax(0, 50.5fr) !important;
  }
}

/* The reference keeps a generous desktop navigation at wide widths.  On
   medium desktop viewports, scale the same pill navigation proportionally so
   every item remains visible within the viewport instead of creating a
   horizontal page scroll. */
@media (min-width: 1246px) and (max-width: 1600px) {
  html body.agent-reference-layout .site-header .desktop-nav__list {
    column-gap: 4px !important;
    transform: none !important;
  }

  html body.agent-reference-layout .site-header .nav-link {
    min-height: 64px !important;
    height: 64px !important;
    margin: 16px 0 !important;
    padding: 0 14px !important;
    font: 600 18px/64px Roboto, Arial, sans-serif !important;
  }
}

/* Parent links and their submenu toggles share one compact pill.  The
   desktop reference keeps the chevron close to the label; these overrides
   also prevent the two-control markup from widening the navigation row. */
@media (min-width: 921px) {
  html body.agent-reference-layout .site-header .nav-link-group > .nav-link--parent {
    padding-right: 4px !important;
    border-top-right-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
  }

  html body.agent-reference-layout .site-header .nav-link-group > .nav-link--toggle {
    min-width: 30px !important;
    padding-left: 4px !important;
    padding-right: 14px !important;
    border-top-left-radius: 0 !important;
    border-bottom-left-radius: 0 !important;
  }
}

/* Restore the reference page's original editorial proportions after the
   shared site-modern layer has loaded. The source page uses a 1,140px,
   two-column reading width, compact 30px section headings, and a flat white
   surface rather than the rounded card treatment used elsewhere. */
body.agent-reference-layout .agent-page,
body.agent-reference-layout .agent-content,
body.agent-reference-layout .agent-benefits,
body.agent-reference-layout .agent-ways {
  color: #1f2937;
  background: #fff;
}

body.agent-reference-layout .agent-hero {
  min-height: 274px !important;
  height: 274px !important;
  padding: 0 !important;
  background:
    linear-gradient(rgba(2, 13, 38, .74), rgba(6, 27, 70, .68)),
    #04183c url("/assets/university/mbbs/reference-inner-banner-bg.jpg") center / cover no-repeat !important;
}

body.agent-reference-layout .agent-hero h1 {
  color: #fff;
  font: 600 46px/64.4px Roboto, Arial, sans-serif;
  letter-spacing: normal;
}

body.agent-reference-layout .agent-hero p {
  margin: 20px 0 27.2px;
  color: rgba(255, 255, 255, .9);
  font: 400 17px/28.05px Roboto, Arial, sans-serif;
}

body.agent-reference-layout .agent-partner > .agent-content > h2,
body.agent-reference-layout .agent-benefits h2 {
  padding: 56px 10px;
  color: #000;
  font: 600 30px/39px Roboto, Arial, sans-serif;
  letter-spacing: normal;
}

body.agent-reference-layout .agent-partner__grid {
  width: min(100%, 1140px) !important;
  min-height: 916.7px !important;
  margin: 0 auto !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 0 !important;
}

body.agent-reference-layout .agent-page .agent-reasons {
  padding: 10px;
}

body.agent-reference-layout .agent-reason,
body.agent-reference-layout .agent-benefit {
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  transform: none !important;
}

body.agent-reference-layout .agent-reason {
  grid-template-columns: 50px minmax(0, 1fr);
  gap: 15px;
  padding-right: 30px;
  margin-bottom: 20px;
}

body.agent-reference-layout .agent-reason__icon {
  width: 50px;
  height: 50px;
}

body.agent-reference-layout .agent-reason h3 {
  margin-bottom: 20px;
  color: #54595f;
  font: 600 25px/32.5px Roboto, Arial, sans-serif;
  letter-spacing: normal;
  text-align: justify;
}

body.agent-reference-layout .agent-reason p {
  color: #1f2937;
  font: 400 16px/26.4px Inter, Arial, sans-serif;
  text-align: justify;
}

body.agent-reference-layout .agent-partner__media {
  width: 100%;
  height: 916.7px;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

body.agent-reference-layout .agent-page .agent-benefits__grid {
  width: min(calc(100% - 56px), 1140px) !important;
  min-height: 706.3px !important;
  padding: 28px 0;
  gap: 56px 0 !important;
}

body.agent-reference-layout .agent-benefit {
  padding: 10px;
  text-align: center;
}

body.agent-reference-layout .agent-benefit h3 {
  color: #284962;
  font: 600 18px/23.4px Roboto, Arial, sans-serif;
  letter-spacing: normal;
}

body.agent-reference-layout .agent-benefit p {
  color: #969a9e;
  font: 400 16px/26.4px Inter, Arial, sans-serif;
}

body.agent-reference-layout .agent-ways {
  min-height: 812.9px;
  margin: 50px 0;
}

body.agent-reference-layout .agent-ways__inner {
  width: min(100%, 1140px);
  padding: 10px;
}

body.agent-reference-layout .agent-ways h2 {
  margin-bottom: 70px;
  color: #000;
  font: 600 30px/39px Poppins, Arial, sans-serif;
  letter-spacing: normal;
}

body.agent-reference-layout .agent-ways article + article {
  margin-top: 20px;
}

body.agent-reference-layout .agent-ways article h2,
body.agent-reference-layout .agent-ways article h3 {
  margin-bottom: 20px;
  color: #54595f;
  font: 600 24px/31.2px Roboto, Arial, sans-serif;
  letter-spacing: normal;
}

body.agent-reference-layout .agent-ways article p {
  margin-bottom: 25.6px;
  color: #7a7a7a;
  font: 400 16px/26.4px Inter, Arial, sans-serif;
}

body.agent-reference-layout .agent-form-shell {
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

body.agent-reference-layout .agent-form input,
body.agent-reference-layout .agent-form select,
body.agent-reference-layout .agent-form textarea {
  border-radius: 0;
}

@media (min-width: 921px) {
  body.agent-reference-layout .brand {
    min-width: 285px;
    gap: 14px;
  }

  body.agent-reference-layout .brand__text {
    display: flex;
  }

  body.agent-reference-layout .brand__logo-wrap {
    width: 78px;
    height: 78px;
  }

  body.agent-reference-layout .brand__logo {
    width: 76px;
    height: 76px;
  }

  body.agent-reference-layout .site-header .navbar-wrap {
    height: 60px !important;
    min-height: 60px !important;
    border: 0 !important;
    background: var(--brand-primary) !important;
  }

  body.agent-reference-layout .site-header .navbar {
    height: 60px !important;
    min-height: 60px !important;
  }

  body.agent-reference-layout .site-header .desktop-nav__list {
    width: auto !important;
    min-width: 0 !important;
    column-gap: 0 !important;
    transform: none !important;
  }

  body.agent-reference-layout .site-header .nav-link {
    min-height: 60px !important;
    height: 60px !important;
    margin: 0 !important;
    padding: 0 16px !important;
    border-radius: 0 !important;
    color: rgba(255, 255, 255, .92) !important;
    background: transparent !important;
    font: 600 16px/60px var(--font-display) !important;
  }

  body.agent-reference-layout .site-header .nav-link:hover,
  body.agent-reference-layout .site-header .nav-link:focus-visible,
  body.agent-reference-layout .site-header .nav-link.is-active,
  body.agent-reference-layout .site-header .nav-dropdown.is-open > .nav-link,
  body.agent-reference-layout .site-header .nav-dropdown.is-open > .nav-link-group > .nav-link,
  body.agent-reference-layout .site-header .nav-link-group:hover > .nav-link,
  body.agent-reference-layout .site-header .nav-link-group:focus-within > .nav-link {
    color: #10192a !important;
    background: var(--navigation-accent) !important;
    box-shadow: none !important;
  }
}

@media (max-width: 1024px) {
  body.agent-reference-layout .agent-partner__grid {
    width: min(calc(100% - 44px), 820px) !important;
    min-height: 0 !important;
    grid-template-columns: 1fr !important;
  }

  body.agent-reference-layout .agent-partner__media {
    display: none;
  }
}

@media (max-width: 700px) {
  body.agent-reference-layout .agent-hero {
    min-height: 300px !important;
    height: auto !important;
    padding: 56px 18px !important;
  }

  body.agent-reference-layout .agent-hero h1 {
    font-size: 43px;
    line-height: 1.14;
  }

  body.agent-reference-layout .agent-hero p {
    margin-top: 24px;
    font-size: 18px;
    line-height: 1.45;
  }

  body.agent-reference-layout .agent-partner__grid,
  body.agent-reference-layout .agent-ways__inner {
    width: calc(100% - 28px) !important;
  }

  body.agent-reference-layout .agent-reason {
    grid-template-columns: 54px minmax(0, 1fr);
    gap: 16px;
  }

  body.agent-reference-layout .agent-reason__icon {
    width: 54px;
    height: 54px;
  }

  body.agent-reference-layout .agent-reason > div {
    margin-top: 0;
  }

  body.agent-reference-layout .agent-page .agent-benefits__grid {
    width: calc(100% - 28px) !important;
    min-height: 0 !important;
    display: grid;
    grid-template-columns: 1fr;
    gap: 32px !important;
  }

  body.agent-reference-layout .agent-benefit,
  body.agent-reference-layout .agent-benefit:nth-child(n) {
    min-height: 0;
    height: auto;
    margin: 0;
    padding: 24px 10px;
  }
}

/* Final compact alignment for the supplied reference page (authoritative). */
html body.agent-reference-layout .agent-page,
html body.agent-reference-layout .agent-content,
html body.agent-reference-layout .agent-partner,
html body.agent-reference-layout .agent-benefits,
html body.agent-reference-layout .agent-ways,
html body.agent-reference-layout .agent-form-section {
  background: #f8fafc !important;
}

html body.agent-reference-layout .agent-hero {
  min-height: 412px !important;
  height: 412px !important;
  padding: 0 20px !important;
  background:
    linear-gradient(rgba(2, 13, 38, .74), rgba(6, 27, 70, .68)),
    #04183c url("/assets/university/mbbs/reference-inner-banner-bg.jpg") center / cover no-repeat !important;
}

html body.agent-reference-layout .agent-hero h1 {
  color: #fff !important;
  font: 600 clamp(48px, 3.8vw, 70px) / 1.14 Roboto, Arial, sans-serif !important;
  letter-spacing: -.035em !important;
}

html body.agent-reference-layout .agent-hero p {
  margin: 34px 0 0 !important;
  color: rgba(255, 255, 255, .9) !important;
  font: 400 clamp(20px, 1.5vw, 28px) / 1.45 Roboto, Arial, sans-serif !important;
}

html body.agent-reference-layout .agent-partner__grid {
  width: calc(100% - 240px) !important;
  max-width: 1700px !important;
  min-height: 0 !important;
  height: auto !important;
  margin: 0 auto !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 0 !important;
}

html body.agent-reference-layout .agent-partner__media {
  width: 100% !important;
  max-width: none !important;
  height: clamp(680px, 42vw, 820px) !important;
  min-height: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

html body.agent-reference-layout .agent-partner__media img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center top !important;
  border-radius: 0 !important;
}

html body.agent-reference-layout .agent-reason,
html body.agent-reference-layout .agent-benefit {
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  transform: none !important;
}

html body.agent-reference-layout .agent-partner > .agent-content > h2,
html body.agent-reference-layout .agent-benefits h2,
html body.agent-reference-layout .agent-ways > h2,
html body.agent-reference-layout .agent-form-section > h2 {
  color: #000 !important;
  font: 600 clamp(34px, 2.45vw, 46px) / 1.28 Roboto, Arial, sans-serif !important;
  letter-spacing: -.025em !important;
}

html body.agent-reference-layout .agent-page .agent-benefits__grid {
  width: calc(100% - 240px) !important;
  max-width: 1700px !important;
  min-height: 0 !important;
  height: auto !important;
  margin: 0 auto !important;
  padding: 0 0 42px !important;
  gap: 32px 0 !important;
}

html body.agent-reference-layout .agent-page .agent-reasons {
  min-height: 0 !important;
  height: auto !important;
  padding: 16px 34px 0 0 !important;
}

html body.agent-reference-layout .agent-reason {
  grid-template-columns: 66px minmax(0, 1fr) !important;
  gap: 22px !important;
  padding: 0 !important;
  margin: 0 0 26px !important;
}

html body.agent-reference-layout .agent-reason__icon {
  width: 66px !important;
  height: 66px !important;
}

html body.agent-reference-layout .agent-reason h3 {
  margin: 0 0 14px !important;
  font-size: clamp(25px, 1.8vw, 36px) !important;
  line-height: 1.24 !important;
  text-align: left !important;
}

html body.agent-reference-layout .agent-reason p {
  font-size: clamp(15px, 1.04vw, 18px) !important;
  line-height: 1.62 !important;
  text-align: left !important;
}

html body.agent-reference-layout .agent-partner__media {
  height: clamp(680px, 42vw, 820px) !important;
  min-height: 0 !important;
}

html body.agent-reference-layout .agent-partner__media img {
  object-fit: cover !important;
  object-position: center top !important;
}

html body.agent-reference-layout .agent-benefit,
html body.agent-reference-layout .agent-benefit:nth-child(n) {
  min-height: 0 !important;
  height: auto !important;
  padding: 16px 18px !important;
}

html body.agent-reference-layout .agent-ways {
  min-height: 0 !important;
  height: auto !important;
  margin: 48px 0 !important;
}

html body.agent-reference-layout .agent-ways__inner {
  width: calc(100% - 240px) !important;
  max-width: 1700px !important;
  padding: 0 !important;
}

html body.agent-reference-layout .agent-ways h2 {
  margin-bottom: 40px !important;
  font: 600 clamp(34px, 2.45vw, 46px) / 1.28 Poppins, Arial, sans-serif !important;
}

html body.agent-reference-layout .agent-ways article + article {
  margin-top: 24px !important;
}

html body.agent-reference-layout .agent-apply {
  min-height: 0 !important;
  height: auto !important;
  padding: 52px 0 64px !important;
  background-color: rgba(255, 255, 255, .16) !important;
  background-blend-mode: screen !important;
}

/* Keep intermediate desktop widths readable without reserving desktop-wide
   whitespace or forcing the two-column content beyond its container. */
@media (min-width: 1025px) and (max-width: 1245px) {
  html body.agent-reference-layout .agent-hero {
    min-height: 320px !important;
    height: 320px !important;
    padding: 0 20px !important;
  }

  html body.agent-reference-layout .agent-partner > .agent-content > h2,
  html body.agent-reference-layout .agent-benefits h2 {
    padding: 48px 20px 38px !important;
    font-size: 34px !important;
    line-height: 1.25 !important;
  }

  html body.agent-reference-layout .agent-partner__grid {
    width: calc(100% - 80px) !important;
    max-width: none !important;
    min-height: 0 !important;
    height: auto !important;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
  }

  html body.agent-reference-layout .agent-page .agent-reasons {
    min-height: 0 !important;
    height: auto !important;
    padding: 0 24px 0 0 !important;
  }

  html body.agent-reference-layout .agent-partner__media {
    height: 680px !important;
    min-height: 0 !important;
  }

  html body.agent-reference-layout .agent-page .agent-benefits__grid,
  html body.agent-reference-layout .agent-ways__inner {
    width: calc(100% - 80px) !important;
    max-width: none !important;
  }

  html body.agent-reference-layout .agent-page .agent-benefits__grid {
    min-height: 0 !important;
    height: auto !important;
    padding: 0 0 36px !important;
    gap: 28px 0 !important;
  }

  html body.agent-reference-layout .agent-benefit,
  html body.agent-reference-layout .agent-benefit:nth-child(n) {
    min-height: 0 !important;
    height: auto !important;
    padding: 14px 12px !important;
  }

  html body.agent-reference-layout .agent-ways {
    min-height: 0 !important;
    height: auto !important;
    margin: 40px 0 !important;
  }

  html body.agent-reference-layout .agent-apply {
    min-height: 0 !important;
    height: auto !important;
    padding: 48px 0 58px !important;
  }
}

/* Keep the compact flow on phones after the desktop overrides above. */
@media (max-width: 1024px) {
  html body.agent-reference-layout .agent-hero {
    min-height: 230px !important;
    height: auto !important;
    padding: 52px 18px !important;
  }

  html body.agent-reference-layout .agent-hero h1 {
    font-size: clamp(34px, 9vw, 46px) !important;
    line-height: 1.14 !important;
    letter-spacing: -.02em !important;
  }

  html body.agent-reference-layout .agent-hero p {
    margin: 20px 0 0 !important;
    font-size: clamp(16px, 4vw, 20px) !important;
    line-height: 1.45 !important;
  }

  html body.agent-reference-layout .agent-partner > .agent-content > h2,
  html body.agent-reference-layout .agent-benefits h2,
  html body.agent-reference-layout .agent-ways > h2 {
    padding: 40px 16px 30px !important;
    font-size: clamp(26px, 6vw, 34px) !important;
    line-height: 1.25 !important;
    letter-spacing: -.02em !important;
  }

  html body.agent-reference-layout .agent-partner__grid {
    width: calc(100% - 32px) !important;
    max-width: none !important;
    min-height: 0 !important;
    height: auto !important;
    grid-template-columns: minmax(0, 1fr) !important;
  }

  html body.agent-reference-layout .agent-page .agent-reasons {
    width: 100% !important;
    min-height: 0 !important;
    height: auto !important;
    padding: 0 !important;
  }

  html body.agent-reference-layout .agent-reason {
    grid-template-columns: 54px minmax(0, 1fr) !important;
    gap: 16px !important;
    padding: 0 !important;
    margin: 0 0 24px !important;
  }

  html body.agent-reference-layout .agent-reason__icon {
    width: 54px !important;
    height: 54px !important;
  }

  html body.agent-reference-layout .agent-reason h3 {
    margin: 0 0 10px !important;
    font-size: clamp(22px, 5.5vw, 30px) !important;
    line-height: 1.25 !important;
    text-align: left !important;
  }

  html body.agent-reference-layout .agent-reason p {
    font-size: 15px !important;
    line-height: 1.6 !important;
    text-align: left !important;
  }

  html body.agent-reference-layout .agent-partner__media {
    display: none !important;
  }

  html body.agent-reference-layout .agent-page .agent-benefits__grid {
    width: calc(100% - 32px) !important;
    max-width: none !important;
    min-height: 0 !important;
    height: auto !important;
    padding: 0 0 34px !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 24px !important;
  }

  html body.agent-reference-layout .agent-benefit,
  html body.agent-reference-layout .agent-benefit:nth-child(n) {
    min-height: 0 !important;
    height: auto !important;
    margin: 0 !important;
    padding: 18px 14px !important;
  }

  html body.agent-reference-layout .agent-ways {
    min-height: 0 !important;
    height: auto !important;
    margin: 40px 0 !important;
  }

  html body.agent-reference-layout .agent-ways__inner {
    width: calc(100% - 32px) !important;
    max-width: none !important;
    padding: 0 !important;
  }

  html body.agent-reference-layout .agent-ways h2 {
    margin-bottom: 32px !important;
  }

  html body.agent-reference-layout .agent-ways article + article {
    margin-top: 24px !important;
  }

  html body.agent-reference-layout .agent-apply {
    min-height: 0 !important;
    height: auto !important;
    padding: 48px 16px 56px !important;
  }
}

@media (min-width: 1025px) {
  html body.agent-reference-layout .site-header .navbar-wrap {
    height: 60px !important;
    min-height: 60px !important;
    background: var(--brand-primary) !important;
    border: 0 !important;
  }

  html body.agent-reference-layout .site-header .navbar {
    height: 60px !important;
    min-height: 60px !important;
  }

  html body.agent-reference-layout .site-header .desktop-nav__list {
    width: auto !important;
    min-width: 0 !important;
    column-gap: 0 !important;
    transform: none !important;
  }

  html body.agent-reference-layout .site-header .nav-link {
    min-height: 60px !important;
    height: 60px !important;
    margin: 0 !important;
    padding: 0 16px !important;
    border-radius: 0 !important;
    color: rgba(255, 255, 255, .92) !important;
    background: transparent !important;
    box-shadow: none !important;
    font: 600 16px/60px var(--font-display) !important;
  }

  html body.agent-reference-layout .site-header .nav-link:hover,
  html body.agent-reference-layout .site-header .nav-link:focus-visible,
  html body.agent-reference-layout .site-header .nav-link.is-active,
  html body.agent-reference-layout .site-header .nav-dropdown.is-open > .nav-link,
  html body.agent-reference-layout .site-header .nav-dropdown.is-open > .nav-link-group > .nav-link,
  html body.agent-reference-layout .site-header .nav-link-group:hover > .nav-link,
  html body.agent-reference-layout .site-header .nav-link-group:focus-within > .nav-link {
    color: #10192a !important;
    background: var(--navigation-accent) !important;
    box-shadow: none !important;
  }
}

/* Navy blue background matching the other pages */
html body.agent-reference-layout .agent-apply,
.agent-apply {
  background:
    radial-gradient(520px 240px at 88% 12%, rgba(22, 133, 255, .24), transparent 72%),
    linear-gradient(135deg, #020d26, #0b3b91) !important;
  background-blend-mode: normal !important;
}

.agent-form > label.agent-form__date {
  display: block;
  margin-bottom: 30px;
}

.agent-form__date > span {
  display: block;
  margin-bottom: 8px;
  color: #111827;
  font-weight: 600;
  font-size: 14px;
}

/* ==========================================================================
   Agent Hero Banner Redesign & Why Partner Section Refinements
   ========================================================================== */
html body.agent-reference-layout .agent-hero {
  position: relative !important;
  max-width: 1180px !important;
  margin: 0 auto !important;
  min-height: 250px !important; /* Shorter by 30-50px for balanced compact elegance */
  height: auto !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 44px 24px 48px !important; /* Slightly elevated vertical center */
  overflow: hidden !important;
  color: white !important;
  border-radius: 0 0 24px 24px !important;
  background:
    radial-gradient(520px 240px at 88% 12%, rgba(22, 133, 255, .24), transparent 72%),
    linear-gradient(135deg, #020d26, #0b3b91) !important;
  text-align: center !important;
  box-sizing: border-box !important;
}

/* Subtle world map dot pattern in background from homepage banner */
html body.agent-reference-layout .agent-hero::before {
  content: "" !important;
  display: block !important;
  position: absolute !important;
  inset: 0 !important;
  background: url("/assets/home/pattern-background.jpg") center / cover no-repeat !important;
  opacity: .13 !important;
  mix-blend-mode: screen !important;
  pointer-events: none !important;
  z-index: 1 !important;
}

/* Micro-grid overlay matching scholarship page banners */
html body.agent-reference-layout .agent-hero::after {
  content: "" !important;
  display: block !important;
  position: absolute !important;
  inset: 0 !important;
  opacity: .08 !important;
  pointer-events: none !important;
  background-image:
    linear-gradient(rgba(255, 255, 255, .12) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 255, 255, .12) 1px, transparent 1px) !important;
  background-size: 54px 54px !important;
  mask-image: linear-gradient(90deg, #000, transparent 84%) !important;
  z-index: 1 !important;
}

html body.agent-reference-layout .agent-hero__inner {
  position: relative !important;
  z-index: 2 !important;
  max-width: 900px !important;
  margin: 0 auto !important;
  padding: 0 10px !important;
  transform: translateY(-4px) !important; /* Move title slightly higher */
}

/* Bold title font matching "Apply ANSO Scholarship" */
html body.agent-reference-layout .agent-hero h1,
#agent-title {
  position: relative !important;
  z-index: 2 !important;
  color: #ffffff !important;
  font-family: var(--font-display, Poppins, sans-serif) !important;
  font-weight: 800 !important;
  font-size: clamp(30px, 3.8vw, 50px) !important;
  line-height: 1.15 !important;
  letter-spacing: -.04em !important;
  text-align: center !important;
  margin: 0 auto 12px !important;
}

/* Subtitle styling */
html body.agent-reference-layout .agent-hero p,
html body.agent-reference-layout .agent-hero__subtitle {
  position: relative !important;
  z-index: 2 !important;
  color: rgba(255, 255, 255, 0.92) !important;
  font-family: var(--font-body, Inter, sans-serif) !important;
  font-size: clamp(15px, 1.2vw, 17.5px) !important;
  line-height: 1.6 !important;
  max-width: 780px !important;
  margin: 0 auto 22px !important;
}

/* Action Buttons in university detail style */
.agent-hero__actions {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 16px !important;
  flex-wrap: wrap !important;
  margin-top: 20px !important;
  position: relative !important;
  z-index: 2 !important;
}

.agent-hero__btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 3.25rem !important;
  border-radius: 999px !important;
  padding: 0.75rem 1.85rem !important;
  font-family: var(--font-display, Poppins, sans-serif) !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  text-decoration: none !important;
  cursor: pointer !important;
  transition: transform 180ms ease, box-shadow 180ms ease, background-color 180ms ease, color 180ms ease !important;
}

/* Main button: "Become a Partner Agent" */
.agent-hero__btn--primary {
  color: #fff !important;
  background: #173b87 !important;
  box-shadow: 0 0.75rem 1.5rem rgba(23, 59, 135, 0.35) !important;
  border: 1px solid rgba(255, 255, 255, 0.28) !important;
}

.agent-hero__btn--primary:hover,
.agent-hero__btn--primary:focus-visible {
  color: #fff !important;
  background: #2859d8 !important;
  box-shadow: 0 1rem 2rem rgba(23, 59, 135, 0.5) !important;
  transform: translateY(-2px) !important;
}

/* Secondary lighter button: "Contact Us" */
.agent-hero__btn--secondary {
  color: #0b3b91 !important;
  background: #edf2ff !important;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.1) !important;
  border: 1px solid transparent !important;
}

.agent-hero__btn--secondary:hover,
.agent-hero__btn--secondary:focus-visible {
  color: #fff !important;
  background: #2859d8 !important;
  box-shadow: 0 0.75rem 1.5rem rgba(23, 59, 135, 0.35) !important;
  transform: translateY(-2px) !important;
}

/* Same bold font and dark navy color applied to all three section titles */
html body.agent-reference-layout .agent-partner > .agent-content > h2,
#agent-partner-title,
html body.agent-reference-layout .agent-benefits h2,
#agent-benefits-title,
html body.agent-reference-layout .agent-ways__main-title,
#agent-ways-title {
  font-family: var(--font-display, Poppins, sans-serif) !important;
  font-weight: 800 !important;
  font-size: clamp(28px, 3.2vw, 40px) !important;
  line-height: 1.25 !important;
  color: var(--site-ink, #081935) !important;
  letter-spacing: -.035em !important;
  text-align: center !important;
}

/* Move small icon next to each paragraph slightly to the left (about 12-16px) */
html body.agent-reference-layout .agent-reason {
  display: grid !important;
  grid-template-columns: 50px minmax(0, 1fr) !important;
  gap: 18px !important;
  padding-left: 14px !important;
  padding-right: 20px !important;
}

html body.agent-reference-layout .agent-reason__icon {
  transform: translateX(-14px) !important;
}

/* Photo on right matches the height of paragraphs list (from first item to last), keeping proportions */
@media (min-width: 1025px) {
  html body.agent-reference-layout .agent-partner__grid {
    width: min(100%, 1180px) !important;
    min-height: 0 !important;
    height: auto !important;
    margin: 0 auto !important;
    display: grid !important;
    grid-template-columns: 1.15fr 0.85fr !important;
    gap: clamp(32px, 4vw, 56px) !important;
    align-items: stretch !important;
  }

  html body.agent-reference-layout .agent-reasons {
    height: 100% !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: space-between !important;
    margin: 0 !important;
  }

  html body.agent-reference-layout .agent-partner__media {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    min-height: 100% !important;
    max-height: 100% !important;
    margin: 0 !important;
    position: relative !important;
    border-radius: 20px !important;
    overflow: hidden !important;
    border: 1px solid var(--site-line, #e2e8f0) !important;
    box-shadow: 0 16px 36px rgba(9, 31, 72, 0.1) !important;
  }

  html body.agent-reference-layout .agent-partner__media img {
    width: 100% !important;
    height: 100% !important;
    display: block !important;
    object-fit: cover !important;
    object-position: center top !important;
  }
}

@media (max-width: 768px) {
  html body.agent-reference-layout .agent-hero {
    min-height: 220px !important;
    padding: 38px 18px 42px !important;
    border-radius: 0 0 18px 18px !important;
  }

  html body.agent-reference-layout .agent-hero h1 {
    font-size: clamp(24px, 6.5vw, 36px) !important;
  }

  .agent-hero__actions {
    flex-direction: column !important;
    width: 100% !important;
  }

  .agent-hero__btn {
    width: min(100%, 300px) !important;
  }
}

/* ==========================================================================
   "Simple Ways to Work With Us as a Partner" Section Modern Refinements
   ========================================================================== */
/* Main title: unified to the same dark navy color, same bold font, and same size as other main titles */
html body.agent-reference-layout .agent-ways__main-title,
html body.agent-reference-layout #agent-ways-title {
  color: var(--site-ink, #081935) !important;
  font-family: var(--font-display, Poppins, sans-serif) !important;
  font-weight: 800 !important;
  font-size: clamp(28px, 3.2vw, 40px) !important;
  line-height: 1.25 !important;
  letter-spacing: -.035em !important;
  text-align: center !important;
  margin: 0 auto clamp(36px, 4vw, 54px) !important;
}

/* Limit content/paragraphs to about 800-900 px wide, so lines aren't too long */
html body.agent-reference-layout .agent-ways__content,
html body.agent-reference-layout .agent-ways article {
  max-width: 860px !important;
  width: 100% !important;
  margin-inline: auto !important;
  text-align: left !important;
}

/* Subtitles: black color, left aligned, smaller than main title, reduced space below */
html body.agent-reference-layout .agent-ways article h2,
html body.agent-reference-layout .agent-ways article h3,
html body.agent-reference-layout .agent-ways__subtitle {
  color: #000000 !important;
  font-family: var(--font-display, Poppins, sans-serif) !important;
  font-weight: 700 !important;
  font-size: clamp(22px, 1.8vw, 26px) !important;
  line-height: 1.3 !important;
  letter-spacing: -.02em !important;
  text-align: left !important;
  margin-top: 0 !important;
  margin-bottom: 8px !important;
}

/* Paragraphs: black color, left aligned, comfortable reading */
html body.agent-reference-layout .agent-ways article p,
html body.agent-reference-layout .agent-ways__content p {
  color: #000000 !important;
  font-family: var(--font-body, Inter, sans-serif) !important;
  font-size: 16px !important;
  line-height: 1.68 !important;
  text-align: left !important;
  max-width: 860px !important;
  margin: 0 0 16px !important;
}

/* Spacing: add a bit more space before the next subtitle */
html body.agent-reference-layout .agent-ways article + article {
  margin-top: 36px !important;
}

/* Steps: make each step title (like "Become a YS Global Study Agent") bold so it stands out */
html body.agent-reference-layout .agent-ways .agent-ways__step-title,
html body.agent-reference-layout .agent-ways .agent-ways__lead strong {
  display: block !important;
  font-family: var(--font-display, Poppins, sans-serif) !important;
  font-weight: 800 !important;
  color: #000000 !important;
  font-size: 17px !important;
  margin-bottom: 6px !important;
  letter-spacing: -.015em !important;
}

/* ==========================================================================
   FINAL OVERRIDE: Unify All 3 Section Titles on Agent Page
   - "Why Partner with YS Global Study?"
   - "Benefits of Becoming a YS Global Study Agent"
   - "Simple Ways to Work With Us as a Partner"
   ========================================================================== */
html body.agent-reference-layout #agent-partner-title,
html body.agent-reference-layout .agent-partner > .agent-content > h2,
html body.agent-reference-layout #agent-benefits-title,
html body.agent-reference-layout .agent-benefits h2,
html body.agent-reference-layout #agent-ways-title,
html body.agent-reference-layout .agent-ways__main-title,
html body.agent-reference-layout .agent-ways h2 {
  font-family: var(--font-display, Poppins, sans-serif) !important;
  font-weight: 800 !important;
  font-size: clamp(28px, 3.2vw, 40px) !important;
  line-height: 1.25 !important;
  letter-spacing: -.035em !important;
  color: var(--site-ink, #081935) !important;
  text-align: center !important;
}

/* All sections subtitles and paragraph titles unified to black color */
html body.agent-reference-layout .agent-reason h3,
html body.agent-reference-layout .agent-benefit h3,
.agent-reason h3,
.agent-benefit h3 {
  color: #000000 !important;
}