:root {
  --u2g-blue: #0a72d8;
  --u2g-blue-dark: #073a83;
  --u2g-navy: #092b68;
  --u2g-green: #16a85b;
  --u2g-text: #3d4c63;
  --u2g-muted: #6e7d92;
  --u2g-border: #dce6f0;
  --u2g-bg: #f6f9fd;
  --container-xxl: 1320px;
  --u2g-font: "Poppins", sans-serif;
  --u2g-ease: cubic-bezier(.2, .72, .2, 1);
}

* {
  box-sizing: border-box;
}

html {
  font-size: 16px;
  scroll-behavior: smooth;
}

body {
  margin: 0;
  font-family: var(--u2g-font);
  font-size: 1rem;
  line-height: 1.6;
  color: var(--u2g-text);
  background: #fff;
  -webkit-font-smoothing: antialiased;
}

body,
button,
input {
  font-family: var(--u2g-font);
}

a {
  text-decoration: none;
  color: inherit;
}

img {
  display: block;
  max-width: 100%;
}

.container-xxl {
  width: 100%;
  max-width: var(--container-xxl);
  margin-inline: auto;
  padding-inline: 0;
}

.student-header {
  height: 88px;
  background: #fff;
  border-bottom: 1px solid #edf1f5;
  box-shadow: 0 2px 10px rgba(19, 55, 96, .04);
  display: flex;
  align-items: center;
}

.student-header.scrolled {
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  z-index: 999;
}

.header-inner {
  height: 100%;
  display: flex;
  align-items: center;
  gap: 28px;
}

.brand {
  width: 205px;
  flex: 0 0 205px
}

.brand img {
  width: 170px;
  height: auto
}

.top-search {
  height: 42px;
  max-width: 545px;
  flex: 1;
  margin-left: auto;
  margin-right: auto;
  background: #f1f3f8;
  border-radius: 6px;
  display: flex;
  align-items: center;
  padding: 0 16px;
  color: #0b2d66
}

.top-search i {
  font-size: 17px;
  margin-right: 10px
}

.top-search input {
  border: 0;
  outline: 0;
  background: transparent;
  width: 100%;
  font-size: 14px;
  color: #34445e
}

.top-search input::placeholder {
  color: #7e899b
}

.header-user {
  display: flex;
  align-items: center;
  gap: 16px;
  flex: 0 0 auto
}

.icon-btn {
  position: relative;
  width: 42px;
  height: 42px;
  border: 1px solid #dce3ed;
  border-radius: 50%;
  background: #fff;
  color: #1c3c6e;
  font-size: 18px
}

.notification-btn span {
  position: absolute;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #f04444;
  right: 9px;
  top: 8px;
  border: 1px solid #fff
}

.user-menu {
  display: flex;
  align-items: center;
  gap: 10px;
  background: transparent;
  border: 0;
  padding: 0;
  color: #263a59;
  text-align: left
}

.user-menu img {
  width: 38px;
  height: 38px;
  border-radius: 50%;
  object-fit: cover
}

.user-menu strong,
.user-menu small {
  display: block
}

.user-menu strong {
  font-size: 14px;
  font-weight: 500;
  line-height: 1.3
}

.user-menu small {
  font-size: 12px;
  color: #7a8597;
  margin-top: 2px
}

.user-menu>i {
  margin-left: 18px;
  font-size: 12px;
  color: #40536d
}

.dashboard-shell {
  display: grid;
  grid-template-columns: 276px minmax(0, 1fr);
  gap: 24px;
  padding-top: 46px;
  padding-bottom: 0;
}

.dashboard-sidebar {
  background: #f7faff;
  border: 1px solid #e2ebf4;
  border-radius: 8px;
  padding: 15px 0;
  display: flex;
  flex-direction: column;
  /* min-height: 930px */
}

.side-link {
  height: 50px;
  display: flex;
  align-items: center;
  gap: 9px;
  margin: 0 0 1px;
  padding: 0 21px;
  color: #0c1324;
  font-size: 15px;
  font-weight: 400;
  border-radius: 0 28px 28px 0;
  transition: .25s
}

.side-link i {
  width: 20px;
  text-align: center;
  font-size: 18px;
  color: #0c1324
}

.side-link:hover {
  background: #edf6ff;
  color: #0a72d8;
  margin-right: 15px;
}

.side-link.active {
  margin-right: 15px;
  background: #0878d8;
  color: #fff;
  /* font-weight: 600 */
}

.side-link.active i {
  color: #fff
}

.side-divider {
  height: 1px;
  background: #dce5ee;
  margin: 14px 20px 12px
}

.need-help {
  margin: auto 12px 0;
  background: #e4f1ff;
  border-radius: 8px;
  padding: 17px 14px 15px;
  display: grid;
  grid-template-columns: 30px 1fr;
  column-gap: 8px;
  align-items: center;
  color: #0b77d7
}

.help-icon {
  font-size: 28px;
  line-height: 1
}

.need-help strong {
  font-size: 14px;
  font-weight: 600;
  display: block
}

.need-help small {
  font-size: 12px;
  color: #4b78a6;
  display: block
}

.help-btn {
  grid-column: 1/-1;
  height: 37px;
  margin-top: 10px;
  background: #fff;
  border-radius: 20px;
  display: grid;
  place-items: center;
  color: #1977cf;
  font-size: 13px;
  box-shadow: 0 4px 12px rgba(19, 88, 151, .09)
}

.dashboard-main {
  min-width: 0
}

.welcome-banner {
  /* height: 184px; */
  border-radius: 8px;
  overflow: hidden;
  position: relative;
  background: url(../images/profile-bar.jpg);
  background-size: cover;
  background-position: right;
  background-repeat: no-repeat;
  display: flex;
  align-items: center;
  padding: 20px;
  padding-left: 35px
}

.welcome-copy {
  position: relative;
  z-index: 2
}
.welcome-copy::after {
  content: "";
  position: absolute;
  z-index: 2;
  width: 200px;
  height: 1px;
  top: 58%;
  left: 0px;
  transform: translateY(-60%);
  background: #89b9f3;
  opacity: .6;
}

.welcome-copy p {
  margin: 0 0 4px;
  font-size: 1rem;
  color: #244466;
  font-weight: 500;
  line-height: 1.2;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.welcome-copy h1 {
  margin: 0 0 14px;
  font-size: clamp(2rem, 2.4vw, 2.8rem);
  line-height: 1.12;
  font-weight: 600;
  color: #0a234d;
  letter-spacing: -0.05em;
}

.student-meta {
  font-size: 0.82rem;
  color: #425a75;
  line-height: 1.6;
}
.welcome-art {
  max-width: 140px;
  border: 2px solid #fff;
  border-radius: 50%;
  overflow: hidden;
  margin-right: 20px;
}





.profile-progress {
  height: 101px;
  margin-top: 22px;
  background: #f4f8fd;
  border-radius: 8px;
  display: flex;
  align-items: center;
  padding: 0 27px;
  gap: 20px
}

.profile-progress-left {
  display: flex;
  align-items: center;
  gap: 17px;
  min-width: 44%
}

.profile-ring {
  width: 65px;
  height: 65px;
  border-radius: 50%;
  background: #fff;
  border: 7px solid #cde3fa;
  color: #1681db;
  display: grid;
  place-items: center;
  font-size: 29px;
  position: relative
}

.profile-ring:before {
  content: "";
  position: absolute;
  inset: -7px;
  border: 7px solid #1381dc;
  border-right-color: transparent;
  border-bottom-color: transparent;
  border-radius: 50%;
  transform: rotate(12deg)
}

.profile-progress-left span {
  font-size: 14px;
  display: block;
  color: #596579
}

.profile-progress-left strong {
  font-size: 19px;
  display: block;
  font-weight: 500;
  color: #182842;
  line-height: 1.2
}

.progress {
  width: 290px;
  height: 10px;
  margin-top: 7px;
  border-radius: 20px;
  background: #d5e2f1;
  overflow: hidden
}

.progress-bar {
  background: #0b7bd8;
  border-radius: 20px
}

.profile-progress-copy {
  font-size: 13px;
  line-height: 1.35;
  text-align: right;
  margin-left: auto;
  color: #46556a
}

.primary-btn {
  height: 42px;
  padding: 0 22px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #0878d8;
  color: #fff;
  border-radius: 5px;
  font-size: 14px;
  font-weight: 500;
  white-space: nowrap;
  box-shadow: 0 5px 13px rgba(0, 104, 193, .13);
  transition: .25s
}

.primary-btn:hover {
  background: #086ac0;
  color: #fff;
  transform: translateY(-1px)
}

.quick-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
  margin-top: 23px;
}

.quick-card {
  min-height: 126px;
  border-radius: 10px;
  padding: 20px 18px 20px 22px;
  display: flex;
  align-items: center;
  gap: 17px;
  position: relative;
  overflow: hidden;
  transition: .25s;
  border: 1px solid rgba(18, 50, 85, 0.05);
}

.quick-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 9px 22px rgba(25, 71, 115, .1)
}

.card-blue {
  background: #eaf5ff
}

.card-green {
  background: #eaf7f3
}

.card-yellow {
  background: #fff8e8
}

.card-pink {
  background: #fff0f3
}

.card-purple {
  background: #f0f0ff
}

.card-cyan {
  background: #e6fbfd
}

.quick-icon {
  width: 50px;
  flex: 0 0 50px;
  text-align: center;
  font-size: 42px;
  line-height: 1;
  color: #0878d8
}

.card-green .quick-icon {
  color: #1e8061
}

.card-yellow .quick-icon {
  color: #e9a600
}

.card-pink .quick-icon {
  color: #fa7182
}

.card-purple .quick-icon {
  color: #6756db
}

.card-cyan .quick-icon {
  color: #0ca9bb
}

.quick-card h2 {
  font-size: 1.05rem;
  line-height: 1.25;
  margin: 0 0 5px;
  color: #182b45;
  font-weight: 600;
}

.quick-card p {
  font-size: 0.8rem;
  line-height: 1.45;
  margin: 0;
  color: #4e596b;
}

.round-arrow {
  position: absolute;
  right: 11px;
  bottom: 12px;
  width: 27px;
  height: 27px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: #fff;
  color: #0780df;
  box-shadow: 0 3px 9px rgba(34, 76, 116, .12);
  font-size: 20px;
  line-height: 1;
}

.next-row {
  display: grid;
  grid-template-columns: 280px minmax(0, 1fr);
  gap: 14px;
  margin-top: 23px
}

.next-steps {
  border: 1px solid #dbe4ee;
  border-radius: 8px;
  padding: 18px 19px;
  background: #fff
}

.next-steps h2 {
  font-size: 18px;
  color: #173567;
  font-weight: 500;
  margin: 0 0 13px
}

.next-steps ul {
  list-style: none;
  padding: 0;
  margin: 0
}

.next-steps li {
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 14px;
  line-height: 1.25;
  margin-bottom: 12px;
  color: #566173
}

.next-steps li i {
  font-size: 17px;
  color: #b8cbe0
}

.next-steps li.done i {
  color: #1ca568
}

.counselling-banner {
  max-height: 270px;
  border: 1px solid #dbe4ee;
  border-radius: 8px;
  overflow: hidden;
  position: relative;
  background: url(../images/booking_image.jpg) no-repeat center center;
  background-size: cover;
}

/* .counselling-banner>img {
  position: absolute;
  right: 0;
  top: 0;
  width: 62%;
  height: 100%;
  object-fit: cover
} */

/* .counselling-banner:after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, #edf8ff 0%, #edf8ff 42%, rgba(237, 248, 255, .75) 56%, rgba(237, 248, 255, 0) 76%);
  pointer-events: none
} */

.counselling-overlay {
  position: relative;
  z-index: 2;
  width: 55%;
  padding: 20px 0 0 24px;
  color: #073475
}

.available {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  position: absolute;
  right: -75%;
  top: 7px;
  background: #fff;
  border: 1px solid #dbe5ef;
  border-radius: 15px;
  padding: 5px 10px;
  font-size: 11px;
  color: #2d607f
}

.available b {
  width: 7px;
  height: 7px;
  background: #20bd67;
  border-radius: 50%
}

.counselling-overlay small {
  display: block;
  font-size: 13px;
  font-weight: 500;
  margin-top: 0
}

.counselling-overlay h2 {
  font-size: 24px;
  line-height: 1.1;
  margin: 3px 0 6px;
  font-weight: 600;
  color: #083878
}

.counselling-overlay p {
  font-size: 13px;
  line-height: 1.35;
  margin: 0 0 15px;
  color: #46617d
}

.banner-btn {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  background: #083f83;
  color: #fff;
  border-radius: 5px;
  padding: 9px 14px;
  font-size: 12px;
  font-weight: 500
}

.destination-strip {
  /* height: 181px; */
  margin-top: 30px;
  background: #06275f;
  border-radius: 8px;
  padding: 20px;
  display: flex;
  align-items: center;
  gap: 23px;
  color: #fff;
  overflow: hidden;
  margin-bottom: 50px;
}

.strip-title {
  width: 145px;
  flex: 0 0 145px;
  font-size: 24px;
  line-height: 1.15;
  font-weight: 500
}

.destination-list {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 10px;
  min-width: 0;
  flex: 1
}

.destination-card {
  /* height: 142px; */
  position: relative;
  border-radius: 6px;
  overflow: hidden;
  background: #163d78;
  border: none;
}

.destination-card:after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(0, 0, 0, 0) 48%, rgba(0, 0, 0, .38) 100%)
}

.destination-card img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .4s var(--u2g-ease)
}

.destination-card:hover img {
  transform: scale(1.06)
}

.destination-card span {
  position: absolute;
  z-index: 2;
  bottom: 8px;
  left: 50%;
  transform: translateX(-50%);
  width: 82%;
  height: 24px;
  display: grid;
  place-items: center;
  background: #004ac6;
  border-radius: 15px;
  color: #fff;
  font-size: 11px;
  font-weight: 600;
  white-space: nowrap
}



.mobile-nav {
  width: min(380px, 92vw);
  border: 0
}

.mobile-nav .offcanvas-header {
  padding: 20px 20px 14px;
  border-bottom: 1px solid #e7edf3
}

.mobile-nav .offcanvas-header img {
  width: 145px
}

.mobile-nav .offcanvas-body {
  padding: 20px
}

.mobile-profile {
  display: flex;
  align-items: center;
  gap: 12px;
  background: #f3f8fd;
  border-radius: 10px;
  padding: 12px;
  margin-bottom: 18px
}

.mobile-profile img {
  width: 44px;
  height: 44px;
  border-radius: 50%;
  object-fit: cover
}

.mobile-profile strong,
.mobile-profile span {
  display: block
}

.mobile-profile strong {
  font-size: 14px;
  color: #18345c;
  font-weight: 600
}

.mobile-profile span {
  font-size: 12px;
  color: #718097
}

.mobile-link {
  display: flex;
  align-items: center;
  gap: 13px;
  padding: 12px 10px;
  border-radius: 7px;
  font-size: 14px;
  color: #40526b;
  margin-bottom: 3px
}

.mobile-link i {
  width: 21px;
  font-size: 17px;
  color: #176bc0
}

.mobile-link.active {
  background: #0878d8;
  color: #fff;
  font-weight: 600
}

.mobile-link.active i {
  color: #fff
}

.mobile-nav hr {
  border-color: #e0e7ef;
  margin: 15px 0
}

/* explore-page-css */
.explore-content {
  min-width: 0
}

.explore-hero {
  height: 167px;
  border-radius: 7px;
  overflow: hidden;
  background: url(../images/explore-universities-bar.jpg) no-repeat center center;
  background-size: cover;
  position: relative;
  display: flex;
  align-items: center;
  padding-left: 32px;
  margin-bottom: 20px
}

.explore-hero-copy {
  position: relative;
  z-index: 2;
  max-width: 690px
}

.explore-hero-copy h1 {
  margin: 0 0 7px;
  color: #111d35;
  font-size: 30px;
  line-height: 1.2;
  font-weight: 600;
  letter-spacing: -.4px
}

.explore-hero-copy p {
  margin: 0 0 3px;
  color: #1c314c;
  font-size: 14px;
  line-height: 1.45;
  font-weight: 500
}

.explore-hero-copy span {
  display: block;
  color: #3e526b;
  font-size: 14px;
  line-height: 1.5
}

.explore-hero-art {
  position: absolute;
  inset: 0 0 0 52%;
  overflow: hidden
}

.explore-hero-art img {
  position: absolute;
  right: -10px;
  bottom: -95px;
  width: 470px;
  height: 310px;
  object-fit: cover;
  object-position: center 32%;
  filter: saturate(.95)
}

.explore-hero-art:after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, #dceeff 0%, rgba(220, 238, 255, .25) 38%, transparent 65%)
}

.hero-route {
  position: absolute;
  z-index: 3;
  right: 18px;
  top: 45px;
  color: #244775;
  font-size: 13px;
  line-height: 1.25;
  transform: rotate(-7deg);
  font-style: italic
}

.hero-route b {
  font-weight: 600
}

/* Search panel */
.explore-search-panel {
  background: #fff;
  border-radius: 10px;
  box-shadow: 0 7px 23px rgba(28, 72, 120, .10);
  padding: 0 8px 16px;
  margin-bottom: 28px
}

.explore-tabs {
  height: 52px;
  background: #f2f7fd;
  border-radius: 27px;
  display: flex;
  align-items: center;
  padding: 4px;
  gap: 4px;
  margin-bottom: 16px
}

.explore-tab {
  height: 44px;
  border: 0;
  background: transparent;
  color: #3f526d;
  border-radius: 23px;
  padding: 0 31px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 11px;
  white-space: nowrap;
  font-weight: 500;
  transition: .25s ease
}

.explore-tab i {
  font-size: 17px
}

.explore-tab.active {
  background: #087bd2;
  color: #fff;
  box-shadow: 0 3px 8px rgba(8, 123, 210, .18);
  font-weight: 600
}

.search-box-row {
  display: flex;
  gap: 0;
  margin: 0 12px 13px;
  height: 44px;
  border: 1px solid #dce5ef;
  border-radius: 4px;
  overflow: hidden;
  background: #fff
}

.search-input-wrap {
  display: flex;
  align-items: center;
  flex: 1;
  min-width: 0
}

.search-input-wrap i {
  color: #173d70;
  font-size: 16px;
  margin-left: 15px
}

.search-input-wrap input {
  border: 0;
  outline: 0;
  height: 100%;
  width: 100%;
  padding: 0 11px;
  color: #3f4d62
}

.search-input-wrap input::placeholder {
  color: #8a96a8
}

.primary-search-btn {
  width: 142px;
  border: 0;
  background: #087bd2;
  color: #fff;
  font-weight: 600
}

.filter-row {
  display: grid;
  grid-template-columns: 1fr 1.05fr 1fr .92fr 1.05fr;
  gap: 12px;
  margin: 0 12px
}

.filter-field {
  height: 48px;
  border: 1px solid #d9e2ec;
  border-radius: 4px;
  background: #fff;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 0 11px;
  position: relative
}

.filter-field span {
  font-size: 12px;
  color: #33475f;
  line-height: 1.15;
  margin-bottom: 2px
}

.filter-field select,
.sort-control select {
  appearance: none;
  border: 0;
  outline: 0;
  background: transparent;
  color: #69788d;
  padding: 0;
  width: 100%;
  font-size: 13px
}

.filter-field:after,
.sort-control:after {
  content: "\F282";
  font-family: "bootstrap-icons";
  position: absolute;
  right: 10px;
  bottom: 9px;
  color: #526177;
  font-size: 12px;
  pointer-events: none
}

.more-filter {
  height: 48px;
  border: 1px solid #d9e2ec;
  border-radius: 4px;
  background: #fff;
  color: #3f4d62;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  font-weight: 500
}

.more-filter i {
  font-size: 16px;
  color: #173d70
}

/* Sections */
.explore-section {
  margin-bottom: 28px
}

.section-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  margin-bottom: 12px
}

.section-heading h2 {
  margin: 0;
  color: #111d35;
  font-size: 23px;
  line-height: 1.25;
  font-weight: 600;
  letter-spacing: -.2px
}

.section-heading>a {
  color: #2b4e78;
  font-size: 12px;
  font-weight: 500;
  display: flex;
  align-items: center;
  gap: 9px
}

.section-heading>a i {
  font-size: 14px;
  color: #173f72
}

.destination-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 9px
}

.destination-card {
  /* border: 1px solid #e1e7ef; */
  border-radius: 6px;
  overflow: hidden;
  background: #fff;
  box-shadow: 0 4px 9px rgba(31, 63, 99, .07);
  transition: .25s ease
}

.destination-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 9px 20px rgba(31, 63, 99, .12)
}

.destination-card>img {
  width: 100%;
  /* height: 111px; */
  object-fit: cover
}

.destination-card>div {
  height: 65px;
  padding: 9px 11px 7px 47px;
  position: relative
}
.explore-section .destination-card::after {
  display: none;
}
.explore-section .destination-card .des_content {
  bottom: 65px;
  background: #fff ;
  position: relative;
}
.destination-card .flag {
  position: absolute;
  left: 11px;
  top: 11px;
  font-size: 24px;
  line-height: 1
}
.explore-section .destination-card .des_content .flag img{
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.explore-section .destination-card .des_content .flag {
  width: 30px;
  aspect-ratio: 1;
  height: auto;
  left: 8px;
  transform: unset;
}
.destination-card h3 {
  margin: 0;
  color: #17233b;
  font-size: 16px;
  line-height: 1.15;
  font-weight: 600
}

.destination-card p {
  margin: 3px 0 0;
  color: #6f7c90;
  font-size: 12px;
  line-height: 1.25
}

.universities-section {
  margin-bottom: 0
}

.sort-control {
  position: relative;
  display: flex;
  align-items: center;
  gap: 12px
}

.sort-control>span {
  font-size: 12px;
  color: #6f7d91
}

.sort-control select {
  width: 215px;
  height: 38px;
  border: 1px solid #d9e2ec;
  border-radius: 4px;
  padding: 0 31px 0 12px;
  background: #fff;
  color: #67758a
}

.sort-control:after {
  bottom: 12px
}

.university-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px 10px
}

.university-card {
  border: 1px solid #e0e7ef;
  border-radius: 6px;
  background: #fff;
  overflow: hidden;
  box-shadow: 0 4px 10px rgba(26, 62, 99, .07);
  transition: .25s ease
}

.university-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 10px 20px rgba(26, 62, 99, .12)
}

.uni-cover {
  width: 100%;
  height: 120px;
  object-fit: cover
}

.uni-body {
  padding: 10px 10px 11px
}

.uni-title {
  display: grid;
  grid-template-columns: 43px minmax(0, 1fr);
  gap: 9px;
  align-items: center;
  min-height: 61px
}

.uni-logo {
  width: 43px;
  height: 43px;
  border-radius: 4px;
  background: #0b427e;
  color: #fff;
  display: grid;
  place-items: center;
  font-size: 10px;
  font-weight: 700;
  border: 1px solid #d8e1eb
}

.uni-logo.red {
  background: #fff;
  color: #bd2739;
  border-color: #d9dfe8
}

.uni-logo.navy {
  background: #182e58;
  color: #fff
}

.uni-logo.stan {
  background: #8d2031;
  color: #fff;
  border-radius: 5px;
  font-size: 19px
}

.uni-title h3 {
  margin: 0;
  color: #1a2436;
  font-size: 14px;
  line-height: 1.2;
  font-weight: 600
}

.uni-title p {
  margin: 4px 0 0;
  color: #5e6b7e;
  font-size: 11px;
  line-height: 1.1
}

.uni-title p i {
  font-size: 10px;
  color: #303e52
}

.uni-stats {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 4px;
  margin: 8px 0
}

.uni-stats span {
  min-height: 44px;
  background: #f3f6fb;
  border-radius: 3px;
  padding: 7px 6px;
  color: #6b7789;
  font-size: 10px;
  line-height: 1.3;
  text-align: left
}

.uni-stats b {
  display: block;
  color: #273244;
  font-size: 13px;
  font-weight: 600;
  margin-bottom: 1px
}

.courses-btn {
  height: 36px;
  border: 1px solid #d7e0e9;
  border-radius: 3px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  color: #2f4f73;
  font-size: 11px !important;
  font-weight: 500;
  background: #fff
}

.courses-btn i {
  font-size: 15px;
  color: #0b70c8
}


/* =========================================================
   Uni2Go Compare Options — page-only layer
   Common typography, colors, header, footer and sidebar are
   inherited from style.css + dashboard.css.
   ========================================================= */
.compare-page {
   background: #fff
}

.compare-main {
   padding: 48px 0 34px
}

.compare-layout {
   display: grid;
   grid-template-columns: 276px minmax(0, 1fr);
   gap: 24px;
   align-items: start
}

.compare-sidebar {
   min-height: 1100px
}

.compare-content {
   min-width: 0
}

.compare-hero {
   position: relative;
   min-height: 172px;
   border-radius: 10px;
   overflow: hidden;
   background: linear-gradient(135deg, rgba(8, 120, 217, 0.08), rgba(17, 61, 110, 0.02)), url(../images/explore-universities-bar.jpg) no-repeat center center;
   background-size: cover;
   display: flex;
   align-items: center;
   padding: 30px 32px;
}

.compare-hero-copy {
   position: relative;
   z-index: 2;
   max-width: 680px;
}

.compare-hero h1 {
   margin: 0 0 7px;
  color: #111d35;
  font-size: 30px;
  line-height: 1.2;
  font-weight: 600;
  letter-spacing: -.4px;
}

.compare-hero p {
   margin: 0;
   color: #2a4366;
   font-size: 0.96rem;
   line-height: 1.5;
   font-weight: 400;
}

.compare-hero-art {
   position: absolute;
   right: 0;
   top: 0;
   width: 54%;
   height: 100%;
   overflow: hidden;
}

.compare-hero-art img {
   width: 100%;
   height: 100%;
   object-fit: cover;
   object-position: center 40%;
   mix-blend-mode: multiply;
   opacity: .92;
}

.hero-note {
   position: absolute;
   right: 20px;
   top: 48px;
   z-index: 2;
   color: #174274;
   font-size: 15px;
   line-height: 1.2;
   font-style: italic;
   transform: rotate(-8deg);
   text-align: center;
}

.hero-note b,
.hero-note strong {
   color: #0b65c9;
   font-weight: 600;
}

.hero-note:after {
   content: "";
   display: block;
   width: 43px;
   height: 2px;
   background: #15a85b;
   margin: 6px 0 0 auto;
   transform: rotate(-8deg);
}

.compare-benefits {
   display: grid;
   grid-template-columns: repeat(3, minmax(0, 1fr));
   align-items: center;
   gap: 16px;
   padding: 18px 24px;
   border: 1px solid #edf2f7;
   border-top: 0;
   border-radius: 0 0 10px 10px;
   background: #fff;
   box-shadow: 0 8px 22px rgba(18, 56, 94, .04);
}

.compare-benefits > div {
   display: flex;
   align-items: center;
   gap: 13px;
   min-width: 0;
}

.benefit-icon {
   width: 42px;
   height: 42px;
   flex: 0 0 42px;
   border-radius: 50%;
   display: grid;
   place-items: center;
   font-size: 20px;
}

.benefit-icon.green {
   background: #dff8eb;
   color: #17845f;
}

.benefit-icon.purple {
   background: #e9e4ff;
   color: #6654d7;
}

.benefit-icon.red {
   background: #ffe3e3;
   color: #d94a4a;
}

.benefit-icon.red {
   background: #ffe2df;
   color: #f15d4e
}

.compare-benefits p {
   margin: 0
}

.compare-benefits b,
.compare-benefits small {
   display: block
}

.compare-benefits b {
   color: #26354a;
   font-size: 14px;
   font-weight: 500;
   line-height: 1.25
}

.compare-benefits small {
   color: #5f6d80;
   font-size: 12px;
   line-height: 1.35;
   margin-top: 1px
}

.compare-filter-card {
   margin-top: 0;
   border: 1px solid #edf2f7;
   border-radius: 10px;
   background: #fff;
   box-shadow: 0 8px 22px rgba(16, 54, 94, .06);
   padding-bottom: 17px;
   overflow: hidden;
}

.compare-tabs {
   height: 53px;
   padding: 6px;
   border-radius: 0 0 28px 28px;
   background: #f2f7fd;
   display: grid;
   grid-template-columns: repeat(4, minmax(0, 1fr));
   gap: 5px;
}

.compare-tab {
   border: 0;
   background: transparent;
   border-radius: 25px;
   color: #405473;
   font-size: 0.88rem;
   font-weight: 500;
   display: flex;
   align-items: center;
   justify-content: center;
   gap: 9px;
   cursor: pointer;
   transition: all 0.25s ease;
}

.compare-tab i {
   font-size: 1.05rem;
}

.compare-tab.active {
   background: #087bd9;
   color: #fff;
   box-shadow: 0 3px 8px rgba(8, 123, 217, .15);
}

.compare-filters {
   display: grid;
   grid-template-columns: repeat(4, minmax(0, 1fr)) 1.02fr;
   gap: 11px;
   padding: 14px 17px 0;
}

.compare-filters label,
.more-filter {
   border: 1px solid #d7e0eb;
   border-radius: 4px;
   background: #fff;
}

.compare-filters label {
   display: flex;
   flex-direction: column;
   padding: 7px 13px 5px;
}

.compare-filters label span {
   font-size: 12px;
   color: #56657b;
   line-height: 1.2;
}

.compare-filters select {
   border: 0;
   outline: 0;
   background: transparent;
   padding: 2px 18px 0 0;
   font-family: inherit;
   font-size: 12px;
   color: #74839a;
   appearance: auto;
}

.more-filter {
   display: flex;
   align-items: center;
   justify-content: center;
   gap: 10px;
   color: #4b596e;
   font-size: 13px;
}

.more-filter i {
   font-size: 17px;
   color: #0a63c8;
}

.comparison-section {
   margin-top: 27px
}

.compare-heading {
   display: flex;
   align-items: flex-end;
   justify-content: space-between;
   gap: 15px;
   margin-bottom: 12px
}

.compare-heading h2,
.shortlist-section h2 {
   margin: 0;
   color: #17243a;
   font-size: 24px;
   line-height: 1.2;
   font-weight: 600
}

.compare-heading p {
   margin: 2px 0 0;
   color: #5d6a7c;
   font-size: 12px;
   line-height: 1.3
}

.compare-actions {
   display: flex;
   gap: 9px
}

.compare-actions button {
   height: 37px;
   border: 1px solid #d7e0eb;
   border-radius: 4px;
   background: #fff;
   font-size: 12px;
   color: #657287;
   padding: 0 13px
}

.compare-actions i {
   margin-right: 5px
}

.add-university i {
   color: #0a79d7
}

.clear-all i {
   color: #ef5b51
}

.comparison-wrap {
   display: grid;
   grid-template-columns: 154px minmax(0, 1fr);
   align-items: stretch
}

.comparison-labels {
   padding-top: 0
}

.comparison-labels>div {
   height: 39px;
   border-bottom: 1px solid #dfe6ee;
   background: #edf5fc;
   padding: 0 9px;
   display: flex;
   align-items: center;
   gap: 7px;
   color: #2b3d59;
   font-size: 11px;
   font-weight: 500
}

.comparison-labels>div:first-child {
   height: 200px;
   background: #fff;
   border: 0
}

.comparison-labels i {
   font-size: 14px;
   color: #173f75
}

.comparison-cards {
   display: grid;
   grid-template-columns: repeat(4, minmax(0, 1fr));
   gap: 9px;
   min-width: 0
}

.comparison-card {
   border: 1px solid #dce5ee;
   border-radius: 7px;
   background: #fff;
   overflow: hidden;
   box-shadow: 0 3px 10px rgba(26, 70, 110, .06);
   min-width: 0
}

.comparison-card .uni-photo {
   height: 128px;
   position: relative;
   overflow: hidden
}

.comparison-card .uni-photo img {
   width: 100%;
   height: 100%;
   object-fit: cover
}

.remove-uni {
   position: absolute;
   right: 7px;
   top: 7px;
   width: 27px;
   height: 27px;
   border: 0;
   border-radius: 50%;
   background: #fff;
   color: #6d7787;
   box-shadow: 0 2px 7px rgba(0, 0, 0, .14);
   font-size: 17px;
   line-height: 1
}

.uni-name {
   height: 71px;
   display: flex;
   align-items: center;
   gap: 9px;
   padding: 9px 10px;
   border-bottom: 1px solid #e5ebf1
}

.uni-logo-box {
   width: 43px;
   height: 43px;
   flex: 0 0 43px;
   border: 1px solid #d7e0e9;
   border-radius: 4px;
   display: grid;
   place-items: center;
   font-size: 10px;
   font-weight: 700;
   color: #fff;
   background: #123d77;
   text-align: center
}

.uni-logo-box.red {
   background: #d92838
}

.uni-logo-box.dark {
   background: #29333c
}

.uni-logo-box.navy {
   background: #174b78
}

.uni-name h3 {
   margin: 0;
   color: #17233a;
   font-size: 13px;
   line-height: 1.25;
   font-weight: 500
}

.uni-data {
   display: contents
}

.uni-data .data-row {
   height: 39px;
   padding: 0 10px;
   border-bottom: 1px solid #e1e7ee;
   display: flex;
   align-items: center;
   color: #58677e;
   font-size: 11px;
   line-height: 1.25
}

.uni-data .data-row strong {
   font-weight: 500;
   color: #263b70
}

.uni-data .data-row.highlights, .comparison-labels > div:last-child {
   height: 73px;
   align-items: flex-start;
   padding-top: 8px
}

.uni-data .data-row.highlights span {
   display: block
}

.shortlist-check {
   display: flex;
   align-items: center;
   gap: 6px;
   height: 36px;
   padding: 0 10px;
   color: #69768a;
   font-size: 11px
}

.shortlist-check input {
   width: 14px;
   height: 14px;
   accent-color: #0b7ad8
}

.details-btn {
   height: 39px;
   margin: 0 9px 9px;
   border: 1px solid #d5e0ea;
   background: #fff;
   color: #39709d;
   border-radius: 4px;
   width: calc(100% - 18px);
   font-size: 11px;
   letter-spacing: .15px
}

.details-btn i {
   font-size: 14px;
   margin-left: 5px
}

.comparison-card.is-hidden {
   display: none
}

.shortlist-section {
   margin-top: 26px
}

.shortlist-section h2 {
   font-size: 20px;
   margin-bottom: 11px
}

.shortlist-section h2 span {
   font-weight: 500
}

.shortlist-row {
   display: grid;
   grid-template-columns: 1.15fr 1.15fr 1.15fr 130px 136px;
   gap: 10px;
   align-items: stretch
}

.shortlist-item {
   height: 57px;
   border: 1px solid #e0e7ef;
   border-radius: 5px;
   background: #fff;
   display: flex;
   align-items: center;
   padding: 7px 9px;
   gap: 9px;
   position: relative;
   box-shadow: 0 3px 10px rgba(25, 68, 108, .04)
}

.mini-logo {
   width: 40px;
   height: 40px;
   flex: 0 0 40px;
   border-radius: 5px;
   display: grid;
   place-items: center;
   color: #fff;
   font-size: 9px;
   font-weight: 700;
   background: #123f7d
}

.mini-logo.red {
   background: #e02c3b
}

.mini-logo.dark {
   background: #29333b
}

.shortlist-item b,
.shortlist-item small {
   display: block
}

.shortlist-item b {
   font-size: 11px;
   color: #25324a;
   font-weight: 500;
   line-height: 1.2
}

.shortlist-item small {
   font-size: 10px;
   color: #637188;
   margin-top: 2px
}

.remove-shortlist {
   position: absolute;
   right: 6px;
   top: 5px;
   border: 0;
   background: none;
   color: #707a89;
   font-size: 14px
}

.add-shortlist {
   border: 1px dashed #0a77d7;
   border-radius: 5px;
   background: #fff;
   color: #507092;
   font-size: 9px;
   line-height: 1.3
}

.add-shortlist i {
   display: block;
   color: #087bd9;
   font-size: 17px;
   margin-bottom: 2px
}

.shortlist-buttons {
   display: grid;
   grid-template-rows: 1fr 1fr;
   gap: 4px
}

.shortlist-buttons button {
   border: 0;
   border-radius: 3px;
   font-size: 10px;
   letter-spacing: .25px
}

.save-comparison {
   background: #087bd8;
   color: #fff
}

.download-pdf {
   background: #dfeafb;
   color: #557092
}

.compare-footer {
   margin-top: 45px
}

.compare-footer .footer-grid {
   grid-template-columns: 1.15fr 1fr 1.05fr 1.05fr 1fr 1.15fr
}

.compare-footer .footer-brand img {
   width: 160px
}

.compare-footer .footer-grid>div:not(.footer-brand):not(.footer-map) a {
   font-size: 13px
}

@media(max-width:1199.98px) {
   .compare-main {
      padding-top: 32px
   }

   .compare-layout {
      grid-template-columns: 235px minmax(0, 1fr);
      gap: 18px
   }

   .compare-sidebar {
      min-height: 1000px
   }

   .compare-hero-art {
      width: 51%
   }

   .compare-tabs {
      overflow: auto;
      grid-template-columns: repeat(4, minmax(150px, 1fr))
   }

   .compare-filters {
      grid-template-columns: repeat(2, 1fr)
   }

   .comparison-wrap {
      grid-template-columns: 125px minmax(0, 1fr);
      overflow-x: auto
   }

   .comparison-cards {
      min-width: 860px
   }

   .shortlist-row {
      grid-template-columns: repeat(3, 1fr) 120px 130px
   }

   .shortlist-buttons {
      grid-column: 4/-1;
      grid-row: 2
   }

   .add-shortlist {
      grid-row: 2
   }

   .compare-footer {
      margin-top: 25px
   }
}

@media(max-width:767.98px) {
   .compare-main {
      padding: 18px 0
   }

   .compare-layout {
      display: block
   }

   .compare-sidebar {
      display: none
   }

   .compare-hero, .explore-hero {
      height: auto;
      display: flex;
      justify-content: center;
      align-items: center;
      text-align: center;
      padding: 20px;
   }

   .compare-hero-copy {
      padding: 27px 20px;
      max-width: 65%
   }

   .compare-hero h1 {
      font-size: 23px
   }

   .compare-hero p {
      font-size: 12px
   }

   .desktop-break {
      display: none
   }

   .compare-hero-art {
      width: 58%;
      opacity: .92
   }

   .hero-note {
      right: 7px;
      top: 25px;
      font-size: 11px
   }

   .compare-benefits {
      height: auto;
      grid-template-columns: 1fr;
      padding: 12px 17px;
      gap: 12px
   }

   .compare-benefits>div {
      gap: 10px
   }

   .benefit-icon {
      width: 36px;
      height: 36px;
      flex-basis: 36px;
      font-size: 17px
   }

   .compare-benefits b {
      font-size: 12px
   }

   .compare-benefits small {
      font-size: 11px
   }

   .compare-tabs {
      height: 48px;
      grid-template-columns: repeat(4, 155px)
   }

   .compare-tab {
      font-size: 12px
   }

   .compare-filters {
      grid-template-columns: 1fr 1fr;
      padding: 11px
   }

   .compare-filters label,
   .more-filter {
      height: 54px
   }

   .compare-filters label:last-of-type {
      grid-column: 1/-1
   }

   .more-filter {
      grid-column: 1/-1
   }

   .compare-heading {
      align-items: flex-start;
      flex-direction: column
   }

   .compare-heading h2,
   .shortlist-section h2 {
      font-size: 20px
   }

   .compare-heading p {
      font-size: 11px
   }

   .compare-actions {
      width: 100%
   }

   .compare-actions button {
      flex: 1;
      font-size: 11px
   }

   .comparison-wrap {
      grid-template-columns: 115px minmax(0, 1fr)
   }

   .comparison-cards {
      min-width: 820px;
      grid-template-columns: repeat(4, 190px)
   }

   .comparison-labels>div {
      font-size: 10px
   }

   .comparison-labels>div:first-child {
      height: 157px
   }

   .shortlist-row {
      grid-template-columns: 1fr 1fr
   }

   .shortlist-item.optional {
      display: none
   }

   .add-shortlist {
      min-height: 57px
   }

   .shortlist-buttons {
      grid-column: 1/-1;
      grid-row: auto;
      height: 57px;
      grid-template-columns: 1fr 1fr;
      grid-template-rows: 1fr
   }

   .compare-footer {
      margin-top: 20px
   }

   .compare-footer .footer-grid {
      grid-template-columns: 1fr 1fr
   }

   .compare-footer .footer-brand {
      grid-column: 1/-1
   }
}

@media(max-width:420px) {
   .compare-hero-copy {
      max-width:100%;
      padding: 24px 17px
   }

   .compare-hero-art {
      width: 64%;
      opacity: .75
   }

   .compare-filters {
      grid-template-columns: 1fr
   }

   .compare-filters label:last-of-type,
   .more-filter {
      grid-column: auto
   }

   .shortlist-row {
      grid-template-columns: 1fr
   }

   .shortlist-buttons {
      grid-column: auto
   }

   .compare-footer .footer-grid {
      grid-template-columns: 1fr
   }
}

.compare-mobile-trigger {
   display: none;
   width: 40px;
   height: 40px;
   border: 1px solid #dce5ee;
   background: #fff;
   border-radius: 8px;
   color: #173a6c;
   font-size: 22px;
   align-items: center;
   justify-content: center
}

.compare-mobile-menu {
   width: min(390px, 92vw)
}

.compare-mobile-menu .offcanvas-header {
   padding: 20px;
   border-bottom: 1px solid #e5ebf2
}

.compare-mobile-menu .offcanvas-header img {
   width: 145px
}

.compare-mobile-menu .offcanvas-body {
   padding: 20px
}

.compare-mobile-menu .mobile-profile {
   margin-bottom: 18px
}

.compare-mobile-menu .mobile-link {
   font-size: 14px;
   padding: 12px 10px
}

.compare-mobile-menu .mobile-link.active {
   background: #0878d8;
   color: #fff
}

.compare-mobile-menu .mobile-link.active i {
   color: #fff
}

@media(max-width:1199.98px) {
   .compare-mobile-trigger {
      display: inline-flex
   }

   .compare-sidebar {
      display: none
   }

   .compare-layout {
      display: block
   }

   .compare-main {
      padding-top: 30px
   }

   .header-inner {
      gap: 14px
   }

   .top-search {
      margin-left: 0;
      margin-right: 0
   }

   .header-user {
      margin-left: auto
   }
}

@media(max-width:767.98px) {
   .compare-main {
      padding-top: 18px
   }

   .header-inner {
      padding-inline: 16px
   }

   .brand {
      width: 145px;
      flex-basis: 145px
   }

   .brand img {
      width: 135px
   }

   .top-search {
      display: none
   }

   .compare-mobile-trigger {
      margin-left: auto
   }

   .header-user {
      margin-left: 0
   }

   .compare-hero-art {
      width: 58%
   }
}


/* Counselling page — reuses dashboard.css primitives and scopes only new UI. */
.counselling-page .dashboard-main{padding-bottom:30px}
.counselling-page .counsel-hero{position:relative;min-height:184px;border:1px solid #dce7f3;border-radius:8px;overflow:hidden;background:#dcedfc;margin-bottom:0}
.counselling-page .counsel-hero-bg{position:absolute;inset:0;background:linear-gradient(90deg,#dff0ff 0%,#d8ebfb 52%,rgba(216,235,251,.55) 100%)}
.counselling-page .counsel-hero-bg:after{content:"";position:absolute;right:0;top:0;width:49%;height:100%;background:url('https://images.unsplash.com/photo-1531482615713-2afd69097998?auto=format&fit=crop&w=1100&q=85') center 38%/cover no-repeat;opacity:.9;mix-blend-mode:multiply}
.counselling-page .counsel-hero-copy{position:relative;z-index:2;padding:29px 30px;max-width:650px}
.counselling-page .counsel-hero-copy h1{margin:0 0 6px;color:#101d35;font-size:28px;line-height:1.05;font-weight:600;letter-spacing:-.5px}
.counselling-page .counsel-hero-copy p{margin:0;color:#253c5b;font-size:14px;line-height:1.45;max-width:590px}
.counselling-page .counsel-features{display:grid;grid-template-columns:repeat(4,1fr);background:#f5f8fd;border:1px solid #e1e9f3;border-top:0;border-radius:0 0 8px 8px;min-height:70px;margin-bottom:21px}
.counselling-page .counsel-feature{display:flex;align-items:center;gap:11px;padding:12px 18px;border-right:1px solid #e0e8f1}
.counselling-page .counsel-feature:last-child{border-right:0}
.counselling-page .counsel-feature-icon{width:39px;height:39px;border:1px solid #79bdf2;border-radius:50%;display:grid;place-items:center;color:#0878d9;font-size:20px;background:#fff;flex:0 0 39px}
.counselling-page .counsel-feature strong{display:block;color:#283d5d;font-size:14px;font-weight:500;line-height:1.2}
.counselling-page .counsel-feature span{display:block;color:#6d788a;font-size:12px;line-height:1.2;margin-top:2px}
.counselling-page .section-heading{margin:0;color:#111d34;font-size:22px;line-height:1.2;font-weight:600}
.counselling-page .section-sub{margin:3px 0 9px;color:#68758a;font-size:12px}
.counselling-page .topics{margin-bottom:25px}
.counselling-page .topic-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.counselling-page .topic-card{height:51px;border:1px solid #e0e6ee;border-radius:5px;background:#fff;display:flex;align-items:center;gap:11px;padding:8px 12px;box-shadow:0 2px 6px rgba(30,60,100,.025);transition:.2s ease}
.counselling-page .topic-card:hover,.counselling-page .topic-card.active{border-color:#65aff0;background:#f2f8ff;box-shadow:0 5px 14px rgba(11,115,213,.08)}
.counselling-page .topic-icon{width:30px;height:30px;display:grid;place-items:center;color:#0878da;font-size:22px;flex:0 0 30px}
.counselling-page .topic-card strong{display:block;color:#17396c;font-size:16px;line-height:1.15;font-weight:600}
.counselling-page .topic-card span{display:block;color:#68778d;font-size:12px;line-height:1.2;margin-top:2px;white-space:nowrap}
.counselling-page .topic-card span > i {
  color: #0878d8;
  font-size: 30px;
}
.counselling-page .counsel-layout{display:grid;grid-template-columns:minmax(0,1fr) 315px;gap:13px;align-items:start}
.counselling-page .counsellor-heading{display:flex;align-items:flex-end;justify-content:space-between;margin-bottom:9px}
.counselling-page .filter-box{display:flex;align-items:center;gap:8px;color:#6d788a;font-size:12px}
.counselling-page .filter-select{height:37px;min-width:145px;border:1px solid #dfe5ed;border-radius:5px;background:#fff;padding:0 30px 0 12px;color:#53647d;font-family:inherit;font-size:12px}
.counsellor-list{display:grid;gap:10px}
.counsellor-card{min-height:125px;background:#fff;border:1px solid #e2e8f0;border-radius:7px;box-shadow:0 2px 8px rgba(28,59,96,.035);padding:17px 16px;display:grid;grid-template-columns:100px minmax(0,1fr) 154px;gap:15px;align-items:center}
.counsellor-photo{width:100px;height:120px;border-radius:7px;object-fit:cover;background:#e9eef4}
.counsellor-info h3{
  margin: 0;
  color: #0f3472;
  font-size: 18px;
  line-height: 1.2;
}
.counsellor-info .role{color:#49638a;font-size:14px;line-height:1.2;margin-top:2px}
.counsellor-rating{font-size:13px;color:#36506f;margin-top:5px}.counsellor-rating i{color:#f4a400}.counsellor-countries{display:flex;gap:9px;align-items:center;margin-top:5px;color:#53657e;font-size:13px;white-space:nowrap}.counsellor-countries img{width:20px;height:20px;object-fit:cover;border-radius:50%}
.counsellor-meta{margin-top:6px;color:#66758a;font-size:13px;white-space:nowrap}.counsellor-actions{display:flex;flex-direction:column;align-items:flex-end;gap:7px}
.available{min-width:145px;background:#eaf9f1;color:#239c61;border-radius:4px;padding:8px 9px;text-align:center;font-size:11px;line-height:1.3}.available i{font-size:17px;vertical-align:middle;margin-right:4px}.available small{display:block;color:#274d47;font-size:11px}
.action-row{display:flex;gap:7px}.circle-btn{width:46px;height:46px;border-radius:50%;border:1px solid #36a7f1;background:#fff;color:#167fd4;font-size:9px;line-height:1.05;text-align:center}.circle-btn.primary{background:#0b78d8;color:#fff;border-color:#0b78d8}.circle-btn i{display:block;font-size:15px;margin-top:2px}
.booking-panel {
  background: #eff7ff;
  border-radius: 7px;
  padding: 12px 12px 13px
}

.booking-panel h2 {
  margin: 0;
  color: #122f68;
  font-size: 18px;
  font-weight: 500
}

.booking-panel .panel-sub {
  margin: 1px 0 8px;
  color: #677890;
  font-size: 11px
}

.calendar {
  background: #fff;
  border-radius: 6px;
  padding: 10px 10px 8px
}

.cal-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  color: #17386e;
  font-size: 14px;
  font-weight: 600;
  margin-bottom: 7px
}

.cal-head button {
  border: 0;
  background: none;
  color: #0a72d8;
  font-size: 20px
}

.cal-grid {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 5px;
  text-align: center;
  font-size: 13px;
  color: #53677f
}

.cal-grid .day-name {
  font-weight: 500;
  color: #7a879a
}

.cal-day {
  width: 25px;
  height: 25px;
  display: grid;
  place-items: center;
  border-radius: 50%
}

.cal-day.active {
  background: #0877dc;
  color: #fff
}

.slots-title {
  margin: 10px 0 5px;
  color: #17386e;
  font-size: 14px;
  font-weight: 600
}

.slots {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 5px
}

.slot {
  height: 28px;
  border: 1px solid #cfe0ef;
  background: #fff;
  border-radius: 5px;
  color: #27466e;
  font-size: 14px
}

.slot.active {
  background: #0877dc;
  border-color: #0877dc;
  color: #fff
}

.confirm {
  width: 100%;
  height: 38px;
  border: 0;
  border-radius: 6px;
  background: #073d91;
  color: #fff;
  font-family: inherit;
  font-size: 14px;
  font-weight: 500;
  margin-top: 10px
}

.why-panel {
  margin-top: 12px;
  background: #eef7ff;
  border-radius: 7px;
  padding: 13px 13px 0;
  overflow: hidden
}

.why-panel h3 {
  margin: 0 0 7px;
  color: #132f68;
  font-size: 16px;
  font-weight: 600
}

.why-panel ul {
  list-style: none;
  padding: 0;
  margin: 0
}

.why-panel li {
  position: relative;
  padding-left: 19px;
  color: #536984;
  font-size: 12px;
  line-height: 1.35;
  margin-bottom: 5px
}

.why-panel li:before {
  content: "✓";
  position: absolute;
  left: 0;
  top: 0;
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background: #17a45d;
  color: #fff;
  font-size: 9px;
  display: grid;
  place-items: center
}

.why-person {
  width: 100%;
  height: 118px;
  object-fit: cover;
  object-position: center 22%;
  margin-top: 8px
}
.counselling-page .reveal{opacity:1;transform:none}
.counsellor-actions .available {
  position: relative;
  right: 0;
  margin-bottom: 10px;
}
.action-row .circle-btn {
  width: 55px;
  height: 55px;
  
  font-size: 12px;
  line-height: 1.05;
  text-align: center;
}
.action-row .circle-btn i {
  display: block;
  font-size: 13px;}
@media(max-width:1199.98px){.counselling-page .counsel-layout{grid-template-columns:1fr}.counselling-page .booking-side{display:grid;grid-template-columns:1fr 1fr;gap:12px}.counselling-page .why-panel{margin-top:0}.counselling-page .topic-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:767.98px) {
  .counselling-page .counsel-hero {
    min-height: 210px
  }

  .counselling-page .counsel-hero-bg:after {
    width: 48%;
    opacity: .6
  }

  .counselling-page .counsel-hero-copy {
    padding: 22px 18px;
    max-width: 68%
  }

  .counselling-page .counsel-hero-copy h1 {
    font-size: 23px
  }

  .counselling-page .counsel-features {
    grid-template-columns: repeat(2, 1fr)
  }

  .counselling-page .counsel-feature:nth-child(2) {
    border-right: 0
  }

  .counselling-page .counsel-feature:nth-child(-n+2) {
    border-bottom: 1px solid #e0e8f1
  }

  .counselling-page .topic-grid {
    grid-template-columns: 1fr
  }

  .counselling-page .counsellor-heading {
    align-items: flex-start;
    gap: 10px;
    flex-direction: column
  }

  .counselling-page .counsellor-card {
    grid-template-columns: 64px minmax(0, 1fr);
    padding: 13px;
    gap: 11px
  }

  .counselling-page .counsellor-photo {
    width: 64px;
    height: 75px
  }

  .counselling-page .counsellor-actions {
    grid-column: 1/-1;
    align-items: stretch;
    flex-direction: column;
    justify-content: space-between
  }

  .counselling-page .available {
    flex: 1
  }

  .counselling-page .action-row {
    flex: 0 0 auto
  }

  .counselling-page .booking-side {
    grid-template-columns: 1fr
  }

  .counselling-page .counsel-feature {
    padding: 11px
  }

  .counselling-page .counsel-feature strong {
    font-size: 12px
  }

  .counselling-page .counsel-feature span {
    font-size: 10px
  }
}
@media(max-width:430px) {
  .counselling-page .counsel-hero-copy {
    max-width: 75%
  }

  .counselling-page .counsel-hero-bg:after {
    width: 38%
  }

  .counselling-page .counsellor-info .role {
    font-size: 11px
  }

  .counselling-page .counsellor-countries {
    gap: 5px
  }

  .counselling-page .counsellor-meta {
    font-size: 9px
  }

  .counselling-page .action-row {
    gap: 4px
  }

  .counselling-page .circle-btn {
    width: 55px;
    height: 55px;
  }
}





/* =========================================================
   Uni2Go — Course Details
   Page-specific styles. Common dashboard styles are reused.
   ========================================================= */

.course-details-page{
  --course-blue:#0878d8;
  --course-navy:#092b68;
  --course-green:#14965d;
  --course-border:#dce6f0;
  --course-soft:#f5f9fe;
  --course-muted:#64748a;
  color:#283a56;
}

.course-details-page .course-hero{
  min-height:250px;
  border-radius:8px;
  overflow:hidden;
  position:relative;
  background:
    linear-gradient(90deg,rgba(9,35,77,.88) 0%,rgba(9,35,77,.56) 38%,rgba(9,35,77,.12) 72%),
    url("../images/melbourne.jpg") center 44%/cover no-repeat;
  color:#fff;
  padding:27px 34px 24px;
  display:flex;
  align-items:flex-end;
}
.course-details-page .course-hero::after{
  content:"";
  position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(255,255,255,.04),rgba(0,20,58,.08));
  pointer-events:none;
}
.course-details-page .course-hero-content{
  position:relative;z-index:2;
  width:100%;
}
.course-details-page .course-university{
  display:inline-flex;
  align-items:center;
  min-height:54px;
  background:#fff;
  border-radius:0 28px 28px 0;
  padding:7px 25px 7px 10px;
  margin-bottom:10px;
  box-shadow:0 5px 16px rgba(0,0,0,.09);
}
.course-details-page .course-university img{
  width:150px;height:40px;object-fit:contain;
}
.course-details-page .course-title{
  margin:0 0 5px;
  font-size:27px;
  line-height:1.15;
  font-weight:600;
  letter-spacing:-.2px;
}
.course-details-page .course-meta{
  display:flex;align-items:center;gap:20px;
  font-size:13px;
  margin-bottom:13px;
}
.course-details-page .course-meta span{
  display:inline-flex;align-items:center;gap:7px;
}
.course-details-page .course-tags{
  display:flex;flex-wrap:wrap;gap:9px;
}
.course-details-page .course-tag{
  padding:8px 22px;
  border-radius:22px;
  background:#fff;
  color:#23845f;
  font-size:12px;
  font-weight:500;
  text-transform:uppercase;
  letter-spacing:.2px;
}
.course-details-page .course-tag:nth-child(2){color:#e49a0b}
.course-details-page .course-tag:nth-child(3){color:#9a68df}

.course-details-page .course-tabs{
  min-height:51px;
  background:#fff;
  border-bottom:1px solid #dfe7ef;
  display:flex;align-items:stretch;
  overflow:auto;
  white-space:nowrap;
}
.course-details-page .course-tabs a{
  padding:0 20px;
  display:flex;align-items:center;justify-content:center;
  color:#28384f;
  font-size:13px;
  position:relative;
}
.course-details-page .course-tabs a.active{
  color:var(--course-blue);
  font-weight:500;
}
.course-details-page .course-tabs a.active::after{
  content:"";position:absolute;left:0;right:0;bottom:0;height:2px;
  background:var(--course-blue);
}

.course-details-page .course-info-strip{
  min-height:66px;
  margin:12px 0 15px;
  padding:0 18px;
  background:#eef7ff;
  border-radius:7px;
  display:grid;
  grid-template-columns:1.15fr 1fr 1fr 1.05fr;
  align-items:center;
}
.course-details-page .course-info-item{
  min-height:45px;
  display:flex;align-items:center;gap:12px;
  padding:0 18px;
  border-right:1px solid #d6e7f5;
}
.course-details-page .course-info-item:first-child{padding-left:0}
.course-details-page .course-info-item:last-child{border-right:0}
.course-details-page .course-info-icon{
  width:43px;height:43px;flex:0 0 43px;
  border-radius:50%;
  background:#fff;
  color:var(--course-blue);
  display:grid;place-items:center;
  font-size:22px;
  box-shadow:0 3px 10px rgba(21,91,147,.06);
}
.course-details-page .course-info-item strong{
  display:block;color:#17428a;font-size:13px;font-weight:600;line-height:1.3;
}
.course-details-page .course-info-item small{
  display:block;color:#566579;font-size:11px;line-height:1.35;
}

.course-details-page .course-layout{
  display:grid;
  grid-template-columns:minmax(0,1fr) 350px;
  gap:15px;
  align-items:start;
}
.course-details-page .course-left,
.course-details-page .course-right{
  min-width:0;
}
.course-details-page .course-panel{
  background:#fff;
  border:1px solid #e0e7ef;
  border-radius:8px;
  box-shadow:0 3px 12px rgba(25,61,98,.055);
  padding:20px 25px;
  margin-bottom:13px;
}
.course-details-page .course-panel h2{
  margin:0 0 7px;
  color:#092b68;
  font-size:19px;
  line-height:1.25;
  font-weight:500;
}
.course-details-page .course-panel p{
  margin:0;color:#465468;font-size:12px;line-height:1.5;
}
.course-details-page .show-more{
  color:var(--course-blue);font-size:11px;margin-left:6px;
}
.course-details-page .fee-panel{
  padding:15px;
}
.course-details-page .fee-price{
  color:#092b68;font-size:18px;font-weight:500;margin-bottom:15px;
}
.course-details-page .fee-price small{
  display:block;color:#64748a;font-size:10px;font-weight:400;
}
.course-details-page .course-btn{
  width:100%;height:41px;border-radius:4px;
  display:flex;align-items:center;justify-content:center;
  font-size:12px;font-weight:500;
  border:1px solid var(--course-blue);
  transition:.2s ease;
}
.course-details-page .course-btn-primary{
  background:var(--course-blue);color:#fff;
  margin-bottom:9px;
}
.course-details-page .course-btn-primary:hover{background:#0668bb;color:#fff}
.course-details-page .course-btn-outline{background:#fff;color:var(--course-blue)}
.course-details-page .course-btn-outline:hover{background:#eef7ff}

.course-details-page .feature-grid{
  display:grid;grid-template-columns:repeat(5,1fr);gap:7px;
}
.course-details-page .mini-feature{
  min-height:67px;
  border:1px solid #dce5ef;
  background:#fff;
  border-radius:3px;
  padding:8px 5px;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  text-align:center;
}
.course-details-page .mini-feature i{
  color:var(--course-blue);font-size:23px;line-height:1;margin-bottom:6px;
}
.course-details-page .mini-feature span{
  color:#53627a;font-size:10px;line-height:1.25;
}

.course-details-page .fee-grid,
.course-details-page .entry-grid{
  display:grid;grid-template-columns:repeat(3,1fr);gap:9px;
}
.course-details-page .fee-box,
.course-details-page .entry-box{
  min-height:66px;
  border:1px solid #dce5ef;
  border-radius:4px;
  background:#fbfdff;
  padding:9px 12px;
  display:flex;align-items:center;gap:10px;
}
.course-details-page .fee-box i,
.course-details-page .entry-box i{
  width:39px;height:39px;border-radius:50%;
  flex:0 0 39px;background:#e9f5ff;color:var(--course-blue);
  display:grid;place-items:center;font-size:19px;
}
.course-details-page .fee-box strong,
.course-details-page .entry-box strong{
  display:block;color:#092b68;font-size:12px;font-weight:500;line-height:1.2;
}
.course-details-page .fee-box span,
.course-details-page .entry-box span{
  display:block;color:#58677d;font-size:10px;line-height:1.35;
}

.course-details-page .career-layout{
  display:grid;grid-template-columns:145px 1fr;gap:24px;align-items:center;
}
.course-details-page .career-ring{
  width:68px;height:68px;border-radius:50%;
  border:10px solid #e4f0ff;border-top-color:#0878d8;border-right-color:#0878d8;
  display:grid;place-items:center;color:#092b68;font-size:14px;font-weight:500;
  margin-bottom:6px;
}
.course-details-page .career-copy small{font-size:10px;color:#5b687b}
.course-details-page .jobs h3{
  margin:0 0 8px;color:#092b68;font-size:15px;font-weight:500;
}
.course-details-page .jobs-grid{
  display:grid;grid-template-columns:1fr 1fr;gap:4px 16px;
}
.course-details-page .jobs-grid span{
  font-size:11px;color:#4e5b70;
}
.course-details-page .jobs-grid i{color:#15955b;margin-right:5px}

.course-details-page .review{
  display:grid;grid-template-columns:82px 1fr 70px;gap:15px;align-items:center;
}
.course-details-page .review-avatar{
  width:75px;height:75px;border-radius:6px;overflow:hidden;background:#eef3f8;
}
.course-details-page .review-avatar img{
  width:100%;height:100%;object-fit:cover;
}
.course-details-page .review-copy p{font-size:11px;line-height:1.45}
.course-details-page .review-copy strong{
  display:block;color:#173d78;font-size:11px;margin-top:7px;
}
.course-details-page .review-copy small{color:#55709c;font-size:10px}
.course-details-page .review-nav{display:flex;gap:8px}
.course-details-page .review-nav button{
  width:31px;height:31px;border:1px solid #e0e7ef;border-radius:50%;
  background:#fff;color:#718096;
}

.course-details-page .quick-actions h2{margin-bottom:13px}
.course-details-page .quick-action{
  height:38px;border:1px solid #d7e1ec;background:#fff;
  border-radius:3px;margin-bottom:7px;
  display:flex;align-items:center;gap:10px;padding:0 9px;
  color:#596579;font-size:10px;
}
.course-details-page .quick-action i{
  width:29px;height:29px;border-radius:3px;background:#e7f2ff;
  color:#0878d8;display:grid;place-items:center;font-size:15px;
}
.course-details-page .quick-action span{flex:1}
.course-details-page .quick-action .bi-chevron-right{background:transparent;color:#7b8798;width:auto}

.course-details-page .why-melbourne{
  background:#eaf9f2;border-color:#d9eee4;
}
.course-details-page .why-melbourne ul{
  list-style:none;margin:8px 0 12px;padding:0;
}
.course-details-page .why-melbourne li{
  font-size:11px;color:#46566a;margin:5px 0;
  display:flex;gap:7px;align-items:flex-start;
}
.course-details-page .why-melbourne li i{color:#11935a;font-size:14px}
.course-details-page .life-image{
  width:100%;height:116px;border-radius:5px;object-fit:cover;
  margin-bottom:9px;
}
.course-details-page .life-title{
  color:#092b68;font-size:13px;font-weight:500;margin-bottom:2px;
}
.course-details-page .life-copy{font-size:10px!important;margin-bottom:9px!important}

.course-details-page .course-map{
  height:205px;border-radius:7px;overflow:hidden;border:1px solid #dbe5ef;
  position:relative;background:#eef4f9;
}
.course-details-page .course-map iframe{
  width:100%;height:100%;border:0;
}
.course-details-page .map-button{
  position:absolute;right:12px;bottom:12px;
  background:#fff;color:#0878d8;border:1px solid #dce7f1;
  border-radius:20px;padding:8px 12px;font-size:10px;
  box-shadow:0 4px 12px rgba(25,61,98,.1);
}

.course-details-page .course-note{
  font-size:11px!important;
}

@media(max-width:1199.98px){
  .course-details-page .course-layout{grid-template-columns:minmax(0,1fr)}
  .course-details-page .course-right{
    display:grid;grid-template-columns:1fr 1fr;gap:13px;
  }
  .course-details-page .course-right > *{margin-bottom:0}
  .course-details-page .course-map{grid-column:1/-1}
}
@media(max-width:767.98px){
  .course-details-page .course-hero{
    min-height:310px;padding:20px 18px;
    align-items:flex-end;
    background-position:center;
  }
  .course-details-page .course-title{font-size:22px}
  .course-details-page .course-meta{gap:10px;flex-wrap:wrap}
  .course-details-page .course-tag{padding:7px 13px;font-size:10px}
  .course-details-page .course-university img{width:125px}
  .course-details-page .course-tabs a{padding:0 13px;font-size:11px}
  .course-details-page .course-info-strip{
    grid-template-columns:1fr 1fr;
    padding:8px;
  }
  .course-details-page .course-info-item{
    padding:8px 7px;border-right:0;
    border-bottom:1px solid #d6e7f5;
  }
  .course-details-page .course-info-item:nth-last-child(-n+2){border-bottom:0}
  .course-details-page .feature-grid{grid-template-columns:repeat(2,1fr)}
  .course-details-page .fee-grid,
  .course-details-page .entry-grid{grid-template-columns:1fr}
  .course-details-page .career-layout{grid-template-columns:1fr;gap:10px}
  .course-details-page .jobs-grid{grid-template-columns:1fr 1fr}
  .course-details-page .review{grid-template-columns:70px 1fr}
  .course-details-page .review-nav{grid-column:2}
  .course-details-page .course-right{grid-template-columns:1fr}
  .course-details-page .course-panel{padding:17px}
}
@media(max-width:430px){
  .course-details-page .course-hero{min-height:330px}
  .course-details-page .feature-grid{grid-template-columns:1fr 1fr}
  .course-details-page .course-info-strip{grid-template-columns:1fr}
  .course-details-page .course-info-item{border-bottom:1px solid #d6e7f5!important}
  .course-details-page .course-info-item:last-child{border-bottom:0!important}
}


/* My Profile page - scoped extensions only */
.my-profile-page{padding-bottom:28px}
.my-profile-page .my-profile-welcome{margin-bottom:16px}
.my-profile-content{
  display:grid;
  grid-template-columns:minmax(0, 1fr) 326px;
  gap:14px;
  align-items:start;
  padding-top: 20px;
}
.my-profile-left{min-width:0}
.my-profile-heading{margin:4px 0 10px}
.my-profile-heading h2{
  margin:0;
  color:#101d35;
  font-size:20px;
  line-height:1.25;
  font-weight:600;
}
.my-profile-heading p{
  margin:3px 0 0;
  color:#66748a;
  font-size:11px;
}
.profile-info-card{
  background:#fff;
  border:1px solid #dfe7ef;
  border-radius:7px;
  box-shadow:0 3px 12px rgba(22,58,100,.055);
  padding:14px 17px 15px;
  margin-bottom:12px;
}
.profile-card-head{
  display:grid;
  grid-template-columns:43px minmax(0,1fr) auto;
  gap:11px;
  align-items:center;
  margin-bottom:13px;
}
.profile-card-icon{
  width:43px;height:43px;border-radius:50%;
  background:#eaf5ff;color:#087bd9;
  display:grid;place-items:center;
  font-size:21px;
}
.profile-card-head h3{
  margin:0;color:#0d3479;font-size:18px;font-weight:600;line-height:1.2;
}
.profile-card-head p{
  margin:3px 0 0;color:#657897;font-size:13px;line-height:1.3;
}
.profile-edit{
  border:0;border-radius:14px;
  background:#e2f7ee;color:#269b66;
  height:23px;padding:0 13px;
  font-size:9px;font-weight:500;letter-spacing:.5px;
}
.profile-data-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  column-gap:30px;
  row-gap:9px;
}
.profile-data-grid>div{min-width:0}
.profile-data-grid span{
  display:block;color:#5c6471;font-size:13px;line-height:1.35;margin-bottom:1px;
}
.profile-data-grid strong{
  display:block;color:#202b3b;font-size:14px;font-weight:500;line-height:1.35;
}
.profile-data-three{grid-template-columns:repeat(3,minmax(0,1fr))}

.my-profile-right{min-width:0}
.profile-side-card{
  background:#fff;
  border:1px solid #dfe7ef;
  border-radius:7px;
  box-shadow:0 3px 12px rgba(22,58,100,.055);
  padding:14px 15px;
  margin-bottom:12px;
}
.profile-side-card h3{
  margin:0 0 12px;
  color:#0d3479;
  font-size:16px;
  line-height:1.25;
  font-weight:600;
}
.quick-actions-card a{
  height:38px;
  border:1px solid #bcd0e4;
  border-radius:4px;
  margin-bottom:6px;
  display:grid;
  grid-template-columns:29px minmax(0,1fr) 12px;
  align-items:center;
  gap:4px;
  padding:4px 9px;
  color:#657080;
  background:#fff;
  font-size:13px;
  letter-spacing:.25px;
}
.profile-side-card.counsellor-card {
  display: flex;
  flex-direction: column;
  align-items: baseline;
  justify-content: flex-start;
  gap: 0;
}
.quick-actions-card a:last-child{margin-bottom:0}
.quick-actions-card a>i:first-child{
  color:#0877db;font-size:15px;text-align:center;
}
.quick-actions-card a>i:last-child{font-size:10px;color:#758398}
.counsellor-person{
  display:grid;grid-template-columns:70px minmax(0,1fr);gap:10px;align-items:start;
}
.counsellor-person img{
  width:70px;height:75px;border-radius:7px;object-fit:cover;object-position:center 25%;
}
.counsellor-person strong{display:block;color:#0d3479;font-size:14px;font-weight:600}
.counsellor-person span{display:block;color:#6c7e9b;font-size:12px;line-height:1.3}
.counsellor-person b{
  display:inline-flex;align-items:center;gap:4px;
  margin-top:7px;padding:5px 9px;border-radius:12px;
  background:#e2f8ee;color:#25a267;font-size:9px;font-weight:500;
}
.profile-side-card.counsellor-card .profile-side-btn {
  padding-inline: 15px;
  font-size: 13px;
  gap: 4px;
}
.counsellor-countries{
  display:flex;flex-wrap:wrap;gap:9px;margin:12px 0;
  color:#5a687d;font-size:13px;
}
.profile-side-btn{
  height:31px;border:1px solid #087bd9;border-radius:4px;
  color:#087bd9;display:flex;align-items:center;justify-content:center;
  font-size:9px;font-weight:500;letter-spacing:.4px;
}
.profile-help-card{background:#eaf5ff;border-color:#eaf5ff}
.profile-help-card h3{font-size:14px;margin-bottom:3px}
.profile-help-card p{margin:0 0 12px;color:#62718a;font-size:10px}
.profile-help-card a{
  height:35px;background:#fff;border-radius:4px;
  display:flex;align-items:center;justify-content:center;gap:7px;
  color:#40536f;font-size:10px;
  box-shadow:0 2px 6px rgba(20,64,110,.05);
}
.profile-help-card a i{color:#087bd9}
.profile-promo{
  display:block;position:relative;height:123px;overflow:hidden;
  border-radius:7px;background:#edf7ff;border:1px solid #dcecf8;
}
.profile-promo img{
  position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
  object-position:center;
}
.profile-promo>div{
  position:absolute;left:14px;top:13px;width:57%;
  color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.15);
}
.profile-promo strong{display:block;font-size:14px;line-height:1.15}
.profile-promo span{display:block;font-size:8px;line-height:1.35;margin-top:7px}

@media(max-width:1199.98px){
  .my-profile-content{grid-template-columns:minmax(0,1fr) 290px;gap:12px}
  .profile-data-grid{column-gap:18px}
}
@media(max-width:991.98px){
  .my-profile-content{grid-template-columns:1fr}
  .my-profile-right{display:grid;grid-template-columns:1fr 1fr;gap:12px}
  .my-profile-right>*{margin-bottom:0}
  .profile-promo{grid-column:1/-1}
}
@media(max-width:767.98px){
  .my-profile-page{padding-bottom:15px}
  .my-profile-content{display:block}
  .my-profile-right{display:block;margin-top:14px}
  .my-profile-heading h2{font-size:19px}
  .profile-info-card{padding:13px;margin-bottom:10px}
  .profile-card-head{grid-template-columns:40px minmax(0,1fr) auto;gap:9px}
  .profile-card-icon{width:40px;height:40px;font-size:19px}
  .profile-data-grid,.profile-data-three{grid-template-columns:1fr 1fr;column-gap:15px}
  .profile-data-grid strong{font-size:10px}
  .profile-data-grid span{font-size:9px}
  .profile-edit{height:22px;padding-inline:10px}
}
@media(max-width:480px){
  .profile-data-grid,.profile-data-three{grid-template-columns:1fr}
  .profile-card-head p{font-size:9px}
}








/* Responsive */
@media (max-width:1399.98px){
 .explore-page .container-xxl{padding-inline:24px}
 .explore-layout{grid-template-columns:260px minmax(0,1fr);gap:20px}
 .destination-card>img{height:105px}
 .university-grid{gap:10px}
 
}
@media (max-width:1199.98px){
 .explore-tabs{overflow-x:auto;justify-content:flex-start}
 .explore-tab{padding-inline:22px}
 .destination-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
 .university-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media (max-width:991.98px){
 .explore-hero-art{left:45%}
 .filter-row{grid-template-columns:repeat(2,1fr)}
 .more-filter{grid-column:span 2}
 .destination-grid{grid-template-columns:repeat(2,1fr)}
 .university-grid{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:767.98px){
 /* .explore-hero{height:205px;padding:26px 22px;align-items:flex-start} */
 .explore-hero-copy{max-width:65%}
 .explore-hero-copy h1{font-size:24px}
 .explore-hero-copy p,.explore-hero-copy span{font-size:13px}
 .explore-hero-art{left:42%}
 .explore-hero-art img{right:-75px;bottom:-58px;width:390px;height:250px}
 .explore-tabs{height:auto;min-height:52px}
 .explore-tab{min-width:max-content;padding-inline:18px}
 .search-box-row{margin-inline:8px}
 .primary-search-btn{width:100px}
 .filter-row{margin-inline:8px;grid-template-columns:1fr}
 .more-filter{grid-column:auto}
 .section-heading h2{font-size:20px}
 .section-heading>a{font-size:10px}
 .sort-control>span{display:none}
 .sort-control select{width:180px}
 .destination-grid,.university-grid{grid-template-columns:1fr}
 .destination-card>img{height:150px}
 .uni-cover{height:170px}
}
@media (max-width:479.98px){
 .explore-hero-copy{max-width:100%}
 .explore-hero-art{opacity:.32;left:30%}
 .explore-hero-copy h1{font-size:22px}
 .section-heading{align-items:flex-end}
 .section-heading>a{white-space:nowrap}
}
@media (prefers-reduced-motion:reduce){
 .destination-card,.university-card{transition:none}
}



@media(max-width:1199.98px) {
  .container-xxl {
    max-width: calc(100% - 40px)
  }

  .header-inner {
    gap: 18px
  }

  .brand {
    width: 180px;
    flex-basis: 180px
  }

  .brand img {
    width: 150px
  }

  .top-search {
    max-width: none
  }

  .dashboard-shell {
    grid-template-columns: 235px minmax(0, 1fr);
    gap: 18px;
    padding-top: 35px
  }

  .dashboard-sidebar {
    min-height: auto
  }

  .side-link {
    padding-inline: 16px
  }

  .quick-grid {
    grid-template-columns: repeat(2, 1fr)
  }

  .destination-list {
    grid-template-columns: repeat(4, 1fr)
  }

  .destination-strip {
    height: auto
  }

  .footer-grid {
    grid-template-columns: repeat(3, 1fr)
  }

  .footer-map {
    display: none
  }
  .welcome-banner {background-position: left;}
}

@media(max-width:767.98px) {
  .container-xxl {
    max-width: 100%;
    padding-inline: 16px
  }

  .student-header {
    height: 66px
  }

  .header-inner {
    padding-inline: 16px
  }

  .brand {
    width: 150px;
    flex-basis: 150px
  }

  .brand img {
    width: 135px
  }

  .top-search {
    order: 3;
    display: none
  }

  .header-user {
    margin-left: auto
  }

  .notification-btn {
    width: 38px;
    height: 38px
  }

  .user-menu span,
  .user-menu>i {
    display: none
  }

  .user-menu img {
    width: 38px;
    height: 38px
  }

  .dashboard-shell {
    display: block;
    padding-top: 18px;
    padding-bottom: 18px
  }

  .dashboard-sidebar {
    display: none
  }

  .welcome-banner {
    /* height: 205px; */
    padding: 24px
  }

  .welcome-copy {
    align-self: flex-start
  }

  .welcome-copy p {
    font-size: 16px
  }

  .welcome-copy h1 {
    font-size: 23px
  }

  .student-meta {
    font-size: 12px
  }

    .welcome-art {
    width: 100%;
    max-width: 100px;
  }

  .welcome-message {
    right: 15px;
    top: auto;
    bottom: 18px
  }

  .welcome-message strong {
    font-size: 13px
  }

  .profile-progress {
    height: auto;
    min-height: 170px;
    padding: 18px;
    display: grid;
    grid-template-columns: 1fr;
    gap: 12px
  }

  .profile-progress-left {
    min-width: 0
  }

  .profile-progress-copy {
    text-align: left;
    margin: 0;
    font-size: 12px
  }

  .primary-btn {
    width: 100%
  }

  .progress {
    width: 100%;
    max-width: 260px
  }

  .quick-grid {
    grid-template-columns: 1fr;
    gap: 10px
  }

  .quick-card {
    height: 105px;
    padding: 16px
  }

  .quick-card h2 {
    font-size: 16px
  }

  .quick-card p {
    font-size: 12px
  }

  .next-row {
    grid-template-columns: 1fr;
    gap: 12px
  }

  .next-steps {
    padding: 17px
  }

  .counselling-banner {
    height: 280px
  }

  .counselling-banner>img {
    width: 100%;
    opacity: .55
  }

  .counselling-overlay {
    width: 100%;
    padding: 18px
  }

  .counselling-banner:after {
    background: linear-gradient(90deg, #edf8ff 0%, rgba(237, 248, 255, .9) 50%, rgba(237, 248, 255, .25) 100%)
  }

  .available {
    right: 12px
  }

  .destination-strip {
    padding: 17px;
    display: block
  }

  .strip-title {
    width: auto;
    margin-bottom: 13px;
    font-size: 21px
  }

  .destination-list {
    grid-template-columns: repeat(2, 1fr);
    gap: 8px
  }

  .destination-card {
    height: auto;
  }

 

  .desktop-only {
    display: none
  }
}


@media(max-width:576px) {
  
}
@media(max-width:420px) {
  .brand {
    width: 125px;
    flex-basis: 125px
  }

  .brand img {
    width: 120px
  }

  .header-user {
    gap: 7px
  }

  .destination-list {
    grid-template-columns: 1fr 1fr
  }

  .footer-grid {
    grid-template-columns: 1fr
  }

  .footer-brand {
    grid-column: auto
  }
   .welcome-copy h1 {
    font-size: 18px;
  }
   .welcome-copy p {
    font-size: 14px;
  }
  .welcome-art {
    max-width: 90px;
margin-right: 10px;
}
.welcome-banner {
padding: 15px;
  }
  .welcome-copy::after {display: none;}
  .profile-progress-left strong {
  font-size: 18px;}
   .counselling-banner {
    height: 180px;
  }
}