//*==================================================
MEDORBIT GLOBAL WEBSITE CSS
PART 1

Global foundation
Animated premium backgrounds
Header and navigation
Hero section
Forms and buttons
Trust strip
Choose your pathway
Education overview
Study in India
==================================================*/


/*==================================================
ROOT VARIABLES
==================================================*/

:root{

  /* Brand colours */

  --primary:#8f2341;
  --primary-dark:#68152c;
  --primary-deep:#45101f;
  --primary-soft:#f3dce3;

  --secondary:#245c63;
  --secondary-dark:#173f44;
  --secondary-soft:#dcebee;

  --gold:#a77632;
  --gold-dark:#79501b;
  --gold-soft:#f3e5cb;

  --sage:#5f7866;
  --sage-soft:#e3ece4;

  --blue-grey:#496775;
  --blue-grey-soft:#dee9ee;

  --lavender:#6e6388;
  --lavender-soft:#e8e3f0;

  --peach:#a75e4e;
  --peach-soft:#f2dfd8;

  /* Text colours */

  --text-dark:#25343a;
  --text-heading:#29383e;
  --text-body:#526369;
  --text-soft:#6a777c;
  --text-light:#f8eff1;

  /* Premium light backgrounds -- never pure white */

  --surface-rose:#f8edf0;
  --surface-champagne:#f5ecdc;
  --surface-sand:#eee7db;
  --surface-sage:#e6eee7;
  --surface-lavender:#ebe7f1;
  --surface-peach:#f4e5df;
  --surface-blue:#e4edf1;
  --surface-grey:#e8eceb;
  --surface-maroon:#eadde1;
  --surface-cream:#f6efe3;

  /* Cards */

  --card-rose:#f3e1e6;
  --card-champagne:#efe2cc;
  --card-sage:#dfe9e0;
  --card-blue:#dce8ed;
  --card-lavender:#e5e0ed;
  --card-peach:#eedbd4;
  --card-grey:#e1e7e5;

  /* Borders */

  --border-soft:#d7c7ca;
  --border-dark:#b99da5;
  --border-sage:#c2d1c5;
  --border-blue:#bdced6;

  /* Shadows */

  --shadow-small:
    0 8px 22px rgba(55,35,40,.08);

  --shadow-medium:
    0 18px 45px rgba(55,35,40,.12);

  --shadow-large:
    0 26px 70px rgba(55,35,40,.16);

  /* Shape */

  --radius-small:10px;
  --radius-medium:18px;
  --radius-large:28px;
  --radius-pill:999px;

  /* Layout */

  --container-width:1240px;
  --section-space:clamp(70px,8vw,112px);
  --header-height:76px;

  /* Transitions */

  --transition-fast:.22s ease;
  --transition-normal:.35s ease;
}


/*==================================================
GLOBAL RESET
==================================================*/

*,
*::before,
*::after{
  box-sizing:border-box;
}

html{
  width:100%;
  max-width:100%;
  margin:0;
  padding:0;
  scroll-behavior:smooth;
  scroll-padding-top:90px;
  overflow-x:clip;
  -webkit-text-size-adjust:100%;
  text-size-adjust:100%;
}

body{
  width:100%;
  max-width:100%;
  min-height:100vh;
  margin:0;
  padding:0;
  overflow-x:hidden;

  color:var(--text-body);
  background:var(--surface-rose);

  font-family:
    Inter,
    -apple-system,
    BlinkMacSystemFont,
    "Segoe UI",
    Roboto,
    Helvetica,
    Arial,
    sans-serif;

  font-size:16px;
  line-height:1.7;
  letter-spacing:.01em;

  animation:
    medorbit-page-background 60s ease-in-out infinite;
}

body,
button,
input,
select,
textarea{
  font-family:
    Inter,
    -apple-system,
    BlinkMacSystemFont,
    "Segoe UI",
    Roboto,
    Helvetica,
    Arial,
    sans-serif;
}

main{
  display:block;
  width:100%;
  max-width:100%;
  overflow:hidden;
}

header,
footer,
section,
article,
aside,
nav,
div,
form{
  min-width:0;
}

img,
picture,
video,
canvas,
svg,
iframe{
  display:block;
  max-width:100%;
  height:auto;
}

button,
input,
select,
textarea{
  max-width:100%;
}

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

button,
select{
  cursor:pointer;
}

button{
  border:0;
}

ul,
ol{
  margin:0;
  padding:0;
}

li{
  list-style:none;
}

h1,
h2,
h3,
h4,
h5,
h6,
p{
  margin-top:0;
}

h1,
h2,
h3,
h4,
h5,
h6{
  color:var(--text-heading);
  font-weight:800;
  line-height:1.18;
  letter-spacing:-.025em;

  word-break:normal;
  overflow-wrap:normal;
  hyphens:none;

  text-wrap:balance;
}

p,
li,
a,
span,
label,
button,
input,
select,
textarea{
  word-break:normal;
  overflow-wrap:normal;
  hyphens:none;
}

p{
  text-wrap:pretty;
}

::selection{
  color:var(--text-light);
  background:var(--primary);
}


/*==================================================
SAFE RESPONSIVE TEXT BEHAVIOUR
==================================================*/

h1{
  font-size:clamp(2.35rem,5.5vw,5rem);
}

h2{
  font-size:clamp(1.9rem,4vw,3.35rem);
}

h3{
  font-size:clamp(1.08rem,2vw,1.45rem);
}

p{
  font-size:clamp(.94rem,1.3vw,1.04rem);
}

small{
  font-size:.8rem;
}

input,
select,
textarea,
button{
  font-size:16px;
}


/*==================================================
ANIMATED GLOBAL BACKGROUNDS

Each background holds its colour and softly changes
approximately every 15 seconds.
==================================================*/

@ keyframes medorbit-page-background{

  0%,
  20%{
    background-color:var(--surface-rose);
  }

  25%,
  45%{
    background-color:var(--surface-champagne);
  }

  50%,
  70%{
    background-color:var(--surface-sage);
  }

  75%,
  95%{
    background-color:var(--surface-blue);
  }

  100%{
    background-color:var(--surface-rose);
  }

}

@ keyframes medorbit-surface-warm{

  0%,
  20%{
    background-color:#f7e8ec;
  }

  25%,
  45%{
    background-color:#f3e8d6;
  }

  50%,
  70%{
    background-color:#e8eee5;
  }

  75%,
  95%{
    background-color:#e4ebef;
  }

  100%{
    background-color:#f7e8ec;
  }

}

@ keyframes medorbit-surface-cool{

  0%,
  20%{
    background-color:#e3edf0;
  }

  25%,
  45%{
    background-color:#e6ede5;
  }

  50%,
  70%{
    background-color:#ece6f1;
  }

  75%,
  95%{
    background-color:#f0e5df;
  }

  100%{
    background-color:#e3edf0;
  }

}

@ keyframes medorbit-surface-soft{

  0%,
  20%{
    background-color:#eee4e7;
  }

  25%,
  45%{
    background-color:#efe7d8;
  }

  50%,
  70%{
    background-color:#e3ece5;
  }

  75%,
  95%{
    background-color:#e6e5ee;
  }

  100%{
    background-color:#eee4e7;
  }

}


/*==================================================
GLOBAL SECTION BACKGROUNDS

All listed sections always have a visible,
non-white, non-transparent background.
==================================================*/

.hero-section,
.pathway-section,
.study-abroad-section,
.popular-courses-section,
.latest-jobs-section,
.training-section,
.journeys-section,
.faq-section,
.final-guidance-section{
  background-color:var(--surface-rose);
  animation:
    medorbit-surface-warm 60s ease-in-out infinite;
}

.trust-strip-section,
.study-india-section,
.destination-section,
.documents-section,
.job-sectors-section,
.employer-services-section,
.platform-statistics-section,
.mobile-app-section,
.important-notice-section{
  background-color:var(--surface-blue);
  animation:
    medorbit-surface-cool 60s ease-in-out infinite;
}

.education-overview-section,
.institutions-section,
.admission-process-section,
.career-overview-section,
.employment-process-section,
.why-choose-section,
.counsellor-support-section,
.legal-disclaimer-section{
  background-color:var(--surface-sage);
  animation:
    medorbit-surface-soft 60s ease-in-out infinite;
}


/*==================================================
ACCESSIBILITY
==================================================*/

.skip-link{
  position:fixed;
  top:12px;
  left:12px;
  z-index:99999;

  padding:10px 16px;
  border-radius:var(--radius-small);

  color:var(--text-light);
  background:var(--primary-dark);

  font-size:.88rem;
  font-weight:800;

  transform:translateY(-160%);
  transition:transform var(--transition-fast);
}

.skip-link:focus{
  transform:translateY(0);
}

.visually-hidden{
  position:absolute !important;
  width:1px !important;
  height:1px !important;
  padding:0 !important;
  margin:-1px !important;
  overflow:hidden !important;
  clip:rect(0,0,0,0) !important;
  white-space:nowrap !important;
  border:0 !important;
}


/*==================================================
CONTAINER AND SECTION LAYOUT
==================================================*/

.container{
  width:min(var(--container-width),calc(100% - 40px));
  max-width:100%;
  margin-inline:auto;
}

section{
  position:relative;
  width:100%;
  max-width:100%;
  padding:var(--section-space) 0;
  overflow:hidden;
}

.section-heading{
  width:min(780px,100%);
  margin:0 auto clamp(34px,5vw,58px);
  text-align:center;
}

.section-heading-left{
  width:min(800px,100%);
  margin-right:auto;
  margin-left:0;
  text-align:left;
}

.section-kicker,
.section-label{
  display:inline-flex;
  align-items:center;
  gap:8px;

  margin-bottom:12px;

  color:var(--primary);
  font-size:clamp(.7rem,1vw,.8rem);
  font-weight:900;
  letter-spacing:.16em;
  line-height:1.4;
  text-transform:uppercase;
}

.section-kicker::before{
  width:24px;
  height:2px;
  flex:0 0 auto;

  content:"";
  border-radius:var(--radius-pill);
  background:var(--primary);
}

.section-heading h2{
  margin-bottom:14px;
}

.section-heading p{
  width:min(680px,100%);
  margin:0 auto;
  color:var(--text-body);
}

.section-heading-left p{
  margin-left:0;
}

.section-button-wrapper,
.center-button{
  display:flex;
  justify-content:center;
  align-items:center;
  margin-top:clamp(30px,5vw,48px);
}


/*==================================================
BUTTONS
==================================================*/

.button{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;

  min-height:50px;
  max-width:100%;
  padding:13px 22px;

  border:1px solid transparent;
  border-radius:var(--radius-pill);

  font-size:clamp(.86rem,1.1vw,.96rem);
  font-weight:800;
  line-height:1.25;
  text-align:center;

  transition:
    transform var(--transition-fast),
    box-shadow var(--transition-fast),
    background-color var(--transition-fast),
    color var(--transition-fast),
    border-color var(--transition-fast);
}

.button:hover{
  transform:translateY(-3px);
}

.button:active{
  transform:translateY(0);
}

.button-primary{
  color:var(--text-light);
  background:linear-gradient(
    135deg,
    var(--primary),
    var(--primary-dark)
  );
  box-shadow:
    0 12px 26px rgba(143,35,65,.22);
}

.button-primary:hover{
  box-shadow:
    0 17px 34px rgba(143,35,65,.3);
}

.button-secondary{
  color:var(--secondary-dark);
  background:var(--secondary-soft);
  border-color:#aac3c9;
}

.button-secondary:hover{
  color:var(--text-light);
  background:var(--secondary-dark);
}

.button-light{
  color:var(--primary-dark);
  background:var(--surface-cream);
  border-color:var(--border-soft);
}

.button-light:hover{
  color:var(--text-light);
  background:var(--primary-dark);
  border-color:var(--primary-dark);
}

.button-full{
  width:100%;
}

.text-link,
.text-button{
  display:inline-flex;
  align-items:center;
  gap:7px;

  color:var(--primary);
  font-size:.94rem;
  font-weight:850;

  transition:
    color var(--transition-fast),
    transform var(--transition-fast);
}

.text-link:hover,
.text-button:hover{
  color:var(--primary-dark);
  transform:translateX(4px);
}


/*==================================================
FORM ELEMENTS
==================================================*/

.form-field{
  display:flex;
  min-width:0;
  flex-direction:column;
  gap:7px;
}

.form-field label{
  color:var(--text-heading);
  font-size:.82rem;
  font-weight:800;
}

.form-field input,
.form-field select,
.form-field textarea{
  width:100%;
  min-width:0;
  min-height:49px;
  padding:12px 14px;

  color:var(--text-dark);
  background:#f5ece7;

  border:1px solid #d3c2bd;
  border-radius:12px;
  outline:none;

  line-height:1.4;

  transition:
    border-color var(--transition-fast),
    box-shadow var(--transition-fast),
    background-color var(--transition-fast);
}

.form-field textarea{
  min-height:110px;
  resize:vertical;
}

.form-field input::placeholder,
.form-field textarea::placeholder{
  color:#7e7774;
  opacity:1;
}

.form-field input:focus,
.form-field select:focus,
.form-field textarea:focus{
  background:#f3e7e1;
  border-color:var(--primary);
  box-shadow:
    0 0 0 4px rgba(143,35,65,.12);
}

.form-field select{
  appearance:none;
  -webkit-appearance:none;

  background-image:
    linear-gradient(45deg,transparent 50%,var(--primary) 50%),
    linear-gradient(135deg,var(--primary) 50%,transparent 50%);

  background-position:
    calc(100% - 19px) 21px,
    calc(100% - 14px) 21px;

  background-size:
    5px 5px,
    5px 5px;

  background-repeat:no-repeat;
  padding-right:38px;
}

.form-consent{
  display:grid;
  grid-template-columns:20px minmax(0,1fr);
  align-items:start;
  gap:9px;
}

.form-consent input{
  width:17px;
  height:17px;
  margin-top:4px;

  accent-color:var(--primary);
}

.form-consent label{
  color:var(--text-soft);
  font-size:.76rem;
  line-height:1.55;
}

.form-security-note{
  margin:0;
  color:var(--text-soft);
  font-size:.72rem;
  line-height:1.5;
  text-align:center;
}


/*==================================================
TOP INFORMATION BAR
==================================================*/

.top-information-bar{
  position:relative;
  z-index:101;

  width:100%;
  min-height:36px;

  color:#f9eef1;
  background:var(--primary-deep);
}

.top-information-wrapper{
  display:flex;
  min-height:36px;
  align-items:center;
  justify-content:space-between;
  gap:18px;
}

.top-information-wrapper p{
  margin:0;
  color:#f9eef1;
  font-size:.73rem;
  font-weight:700;
  letter-spacing:.04em;
}

.top-information-links{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:18px;
}

.top-information-links a{
  position:relative;
  color:#f9eef1;
  font-size:.73rem;
  font-weight:700;
}

.top-information-links a:not(:last-child)::after{
  position:absolute;
  top:50%;
  right:-10px;

  width:3px;
  height:3px;

  content:"";
  border-radius:50%;
  background:#cda8b3;

  transform:translateY(-50%);
}


/*==================================================
HEADER
==================================================*/

.site-header{
  position:relative;
  z-index:100;

  width:100%;
  min-height:var(--header-height);

  background:#f3e6e9;
  border-bottom:1px solid #d7c5ca;

  box-shadow:
    0 8px 22px rgba(45,29,34,.07);
}

.header-wrapper{
  display:flex;
  min-height:var(--header-height);
  align-items:center;
  justify-content:space-between;
  gap:28px;
}

.brand-logo{
  display:inline-flex;
  min-width:0;
  flex:0 1 auto;
  align-items:center;
  gap:11px;
}

.brand-logo-mark{
  display:grid;
  width:45px;
  height:45px;
  flex:0 0 45px;
  place-items:center;

  color:#f9eef1;
  background:linear-gradient(
    145deg,
    var(--primary),
    var(--primary-dark)
  );

  border:2px solid #dec0c8;
  border-radius:14px;

  font-size:1.35rem;
  font-weight:950;
  line-height:1;

  box-shadow:
    0 9px 20px rgba(143,35,65,.2);
}

.brand-logo-content{
  display:flex;
  min-width:0;
  flex-direction:column;
  line-height:1.18;
}

.brand-logo-content strong{
  color:var(--primary-dark);
  font-size:clamp(1.13rem,2vw,1.34rem);
  font-weight:950;
  letter-spacing:-.025em;
}

.brand-logo-content small{
  color:var(--text-soft);
  font-size:clamp(.59rem,.9vw,.72rem);
  font-weight:750;
  letter-spacing:.02em;
}

.menu-toggle{
  display:none;
  width:44px;
  height:44px;
  flex:0 0 44px;
  padding:10px;

  background:var(--card-rose);
  border:1px solid var(--border-soft);
  border-radius:12px;
}

.menu-toggle span{
  display:block;
  width:100%;
  height:2px;
  margin:5px 0;

  border-radius:var(--radius-pill);
  background:var(--primary-dark);

  transition:
    transform var(--transition-fast),
    opacity var(--transition-fast);
}

.menu-toggle.active span:nth-child(1){
  transform:translateY(7px) rotate(45deg);
}

.menu-toggle.active span:nth-child(2){
  opacity:0;
}

.menu-toggle.active span:nth-child(3){
  transform:translateY(-7px) rotate(-45deg);
}

.main-navigation{
  display:flex;
  min-width:0;
  align-items:center;
  justify-content:flex-end;
  gap:clamp(12px,1.5vw,22px);
}

.main-navigation > a,
.navigation-dropdown-button{
  position:relative;

  padding:8px 0;

  color:var(--text-dark);
  background:none;

  font-size:clamp(.78rem,1vw,.91rem);
  font-weight:800;
  white-space:nowrap;
}

.main-navigation > a:not(.navigation-cta)::after,
.navigation-dropdown-button::after{
  position:absolute;
  right:0;
  bottom:2px;
  left:0;

  height:2px;

  content:"";
  border-radius:var(--radius-pill);
  background:var(--primary);

  transform:scaleX(0);
  transform-origin:center;
  transition:transform var(--transition-fast);
}

.main-navigation > a:hover::after,
.main-navigation > a.active::after,
.navigation-dropdown:hover
.navigation-dropdown-button::after{
  transform:scaleX(1);
}

.main-navigation > a:hover,
.main-navigation > a.active,
.navigation-dropdown-button:hover{
  color:var(--primary);
}

.navigation-cta{
  min-height:42px;
  padding:10px 18px !important;

  color:#f9eef1 !important;
  background:linear-gradient(
    135deg,
    var(--primary),
    var(--primary-dark)
  );

  border-radius:var(--radius-pill);

  box-shadow:
    0 10px 22px rgba(143,35,65,.19);
}

.navigation-cta:hover{
  transform:translateY(-2px);
}

.navigation-dropdown{
  position:relative;
  min-width:0;
}

.navigation-dropdown-button{
  display:flex;
  align-items:center;
  gap:5px;
}

.navigation-dropdown-button span{
  font-size:.78rem;
  transition:transform var(--transition-fast);
}

.navigation-dropdown:hover
.navigation-dropdown-button span{
  transform:rotate(180deg);
}

.navigation-dropdown-menu{
  position:absolute;
  top:calc(100% + 15px);
  left:50%;

  display:flex;
  width:230px;
  padding:10px;
  flex-direction:column;
  gap:3px;

  visibility:hidden;
  opacity:0;

  background:#efe3e6;
  border:1px solid #d5c1c6;
  border-radius:16px;

  box-shadow:var(--shadow-medium);

  transform:
    translate(-50%,12px);

  transition:
    opacity var(--transition-fast),
    visibility var(--transition-fast),
    transform var(--transition-fast);
}

.navigation-dropdown:hover
.navigation-dropdown-menu,
.navigation-dropdown.active
.navigation-dropdown-menu{
  visibility:visible;
  opacity:1;

  transform:
    translate(-50%,0);
}

.navigation-dropdown-menu::before{
  position:absolute;
  top:-10px;
  right:0;
  left:0;

  height:12px;

  content:"";
}

.navigation-dropdown-menu a{
  display:block;
  padding:10px 12px;

  color:var(--text-dark);
  background:#f3e8e9;

  border-radius:10px;

  font-size:.82rem;
  font-weight:750;

  transition:
    color var(--transition-fast),
    background-color var(--transition-fast),
    transform var(--transition-fast);
}

.navigation-dropdown-menu a:hover{
  color:var(--primary-dark);
  background:var(--card-rose);
  transform:translateX(3px);
}


/*==================================================
HERO SECTION
==================================================*/

.hero-section{
  isolation:isolate;
  min-height:calc(100vh - 112px);
  padding:
    clamp(58px,8vw,110px)
    0
    clamp(68px,8vw,112px);
}

.hero-section::before{
  position:absolute;
  z-index:-2;
  inset:0;

  content:"";

  background:
    radial-gradient(
      circle at 10% 18%,
      rgba(143,35,65,.13),
      transparent 30%
    ),
    radial-gradient(
      circle at 88% 26%,
      rgba(36,92,99,.13),
      transparent 28%
    ),
    linear-gradient(
      135deg,
      rgba(245,230,234,.95),
      rgba(237,231,215,.92),
      rgba(226,237,232,.95)
    );
}

.hero-background-shape{
  position:absolute;
  z-index:-1;

  border-radius:50%;
  pointer-events:none;
}

.hero-shape-one{
  top:5%;
  left:-100px;

  width:260px;
  height:260px;

  background:rgba(143,35,65,.08);
}

.hero-shape-two{
  top:15%;
  right:-120px;

  width:340px;
  height:340px;

  background:rgba(36,92,99,.09);
}

.hero-shape-three{
  right:35%;
  bottom:-140px;

  width:280px;
  height:280px;

  background:rgba(167,118,50,.07);
}

.hero-layout{
  display:grid;
  grid-template-columns:
    minmax(0,1.18fr)
    minmax(320px,.82fr);

  align-items:center;
  gap:clamp(36px,6vw,82px);
}

.hero-content{
  min-width:0;
}

.hero-badge{
  display:inline-flex;
  max-width:100%;
  align-items:center;
  gap:9px;

  margin-bottom:18px;
  padding:8px 13px;

  color:var(--primary-dark);
  background:var(--card-rose);

  border:1px solid #d8bbc3;
  border-radius:var(--radius-pill);

  font-size:clamp(.72rem,1vw,.82rem);
  font-weight:850;
  letter-spacing:.04em;
}

.hero-badge-icon{
  display:grid;
  width:22px;
  height:22px;
  flex:0 0 22px;
  place-items:center;

  color:#f9eef1;
  background:var(--primary);
  border-radius:50%;

  font-size:.7rem;
}

.hero-content h1{
  max-width:820px;
  margin-bottom:20px;
}

.hero-content h1 span{
  display:block;
  color:var(--primary);
}

.hero-description{
  max-width:730px;
  margin-bottom:27px;

  color:var(--text-body);
  font-size:clamp(1rem,1.6vw,1.16rem);
  line-height:1.75;
}

.hero-actions{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:12px;

  margin-bottom:25px;
}

.hero-trust-list{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:10px 18px;

  margin-bottom:30px;
}

.hero-trust-item{
  display:inline-flex;
  align-items:center;
  gap:7px;

  color:var(--text-dark);
  font-size:clamp(.77rem,1vw,.88rem);
  font-weight:750;
}

.hero-trust-icon{
  display:grid;
  width:20px;
  height:20px;
  flex:0 0 20px;
  place-items:center;

  color:#eaf2ec;
  background:var(--sage);

  border-radius:50%;

  font-size:.7rem;
  font-weight:900;
}

.hero-mini-statistics{
  display:grid;
  grid-template-columns:
    repeat(3,minmax(0,1fr));

  width:min(680px,100%);
  overflow:hidden;

  background:var(--card-champagne);
  border:1px solid #d7c4a5;
  border-radius:18px;
}

.hero-mini-statistic{
  position:relative;

  display:flex;
  min-width:0;
  padding:15px 17px;
  flex-direction:column;
  gap:2px;
}

.hero-mini-statistic:not(:last-child)::after{
  position:absolute;
  top:20%;
  right:0;

  width:1px;
  height:60%;

  content:"";
  background:#cdbb9d;
}

.hero-mini-statistic strong{
  color:var(--primary-dark);
  font-size:clamp(.86rem,1.2vw,1rem);
  line-height:1.25;
}

.hero-mini-statistic span{
  color:var(--text-soft);
  font-size:clamp(.65rem,.9vw,.76rem);
  font-weight:700;
}


/*==================================================
HERO GUIDANCE CARD
==================================================*/

.hero-guidance-card{
  width:100%;
  max-width:490px;
  justify-self:end;
  padding:clamp(22px,3vw,32px);

  background:#eee2e2;
  border:1px solid #d3bdc1;
  border-radius:var(--radius-large);

  box-shadow:var(--shadow-large);
}

.guidance-card-header{
  margin-bottom:22px;
}

.guidance-card-label{
  display:inline-block;
  margin-bottom:8px;

  color:var(--primary);
  font-size:.7rem;
  font-weight:900;
  letter-spacing:.15em;
}

.guidance-card-header h2{
  margin-bottom:9px;
  font-size:clamp(1.55rem,2.8vw,2.15rem);
}

.guidance-card-header p{
  margin:0;
  color:var(--text-soft);
  font-size:.9rem;
  line-height:1.6;
}

.guidance-form{
  display:grid;
  grid-template-columns:
    repeat(2,minmax(0,1fr));

  gap:15px;
}

.guidance-form .form-field:nth-child(3),
.guidance-form .form-field:nth-child(4),
.guidance-form .form-field:nth-child(5),
.guidance-form .form-consent,
.guidance-form .button,
.guidance-form .form-security-note{
  grid-column:1 / -1;
}


/*==================================================
TRUST STRIP
==================================================*/

.trust-strip-section{
  padding:
    clamp(28px,4vw,45px)
    0;
}

.trust-strip-grid{
  display:grid;
  grid-template-columns:
    repeat(4,minmax(0,1fr));

  gap:14px;
}

.trust-strip-card{
  display:grid;
  grid-template-columns:46px minmax(0,1fr);
  align-items:center;
  gap:13px;

  min-width:0;
  padding:17px;

  background:var(--card-blue);
  border:1px solid var(--border-blue);
  border-radius:16px;

  box-shadow:var(--shadow-small);
}

.trust-strip-icon{
  display:grid;
  width:46px;
  height:46px;
  place-items:center;

  background:var(--secondary-soft);
  border:1px solid #b5cbd0;
  border-radius:14px;

  font-size:1.25rem;
}

.trust-strip-card strong{
  display:block;
  margin-bottom:2px;

  color:var(--secondary-dark);
  font-size:clamp(.82rem,1.2vw,.96rem);
}

.trust-strip-card p{
  margin:0;

  color:var(--text-soft);
  font-size:clamp(.68rem,.9vw,.78rem);
  line-height:1.45;
}


/*==================================================
CHOOSE YOUR PATH
==================================================*/

.pathway-grid{
  display:grid;
  grid-template-columns:
    repeat(2,minmax(0,1fr));

  align-items:stretch;
  gap:clamp(20px,3vw,34px);
}

.pathway-card{
  position:relative;
  isolation:isolate;

  display:flex;
  min-width:0;
  height:100%;
  padding:clamp(24px,4vw,40px);
  flex-direction:column;

  border:1px solid;
  border-radius:var(--radius-large);

  box-shadow:var(--shadow-medium);
  overflow:hidden;
}

.pathway-card::after{
  position:absolute;
  z-index:-1;
  top:-110px;
  right:-110px;

  width:240px;
  height:240px;

  content:"";
  border-radius:50%;
}

.education-pathway-card{
  background:var(--card-rose);
  border-color:#d6b7c0;
}

.education-pathway-card::after{
  background:rgba(143,35,65,.09);
}

.career-pathway-card{
  background:var(--card-blue);
  border-color:#b8cdd4;
}

.career-pathway-card::after{
  background:rgba(36,92,99,.1);
}

.pathway-card-top{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;

  margin-bottom:20px;
}

.pathway-card-icon{
  display:grid;
  width:58px;
  height:58px;
  flex:0 0 58px;
  place-items:center;

  background:var(--surface-cream);
  border:1px solid var(--border-soft);
  border-radius:18px;

  font-size:1.65rem;

  box-shadow:var(--shadow-small);
}

.pathway-card-badge{
  max-width:100%;
  padding:7px 11px;

  color:var(--primary-dark);
  background:#edd7dd;

  border:1px solid #d3b5bd;
  border-radius:var(--radius-pill);

  font-size:clamp(.62rem,.9vw,.73rem);
  font-weight:900;
  letter-spacing:.1em;
  line-height:1.35;
  text-align:center;
}

.career-pathway-card
.pathway-card-badge{
  color:var(--secondary-dark);
  background:#d6e5e8;
  border-color:#b8ced3;
}

.pathway-card h3{
  margin-bottom:12px;
  font-size:clamp(1.45rem,2.8vw,2.25rem);
}

.pathway-card > p{
  margin-bottom:24px;
  color:var(--text-body);
}

.pathway-feature-grid{
  display:grid;
  grid-template-columns:
    repeat(2,minmax(0,1fr));

  gap:11px;

  margin-bottom:28px;
}

.pathway-feature-item{
  display:grid;
  grid-template-columns:21px minmax(0,1fr);
  align-items:start;
  gap:8px;

  min-width:0;

  color:var(--text-dark);
  font-size:clamp(.76rem,1vw,.88rem);
  font-weight:700;
  line-height:1.5;
}

.pathway-feature-item span{
  display:grid;
  width:20px;
  height:20px;
  place-items:center;

  color:#edf5ef;
  background:var(--sage);
  border-radius:50%;

  font-size:.68rem;
}

.pathway-card-actions{
  display:flex;
  flex-wrap:wrap;
  gap:11px;

  margin-top:auto;
}


/*==================================================
EDUCATION OVERVIEW
==================================================*/

.education-overview-layout{
  display:grid;
  grid-template-columns:
    minmax(0,.9fr)
    minmax(0,1.1fr);

  align-items:center;
  gap:clamp(38px,6vw,82px);
}

.education-overview-visual{
  position:relative;

  display:grid;
  min-height:560px;
  place-items:center;
}

.education-overview-visual::before{
  position:absolute;
  inset:8% 9%;

  content:"";

  background:
    linear-gradient(
      145deg,
      #d9e7dc,
      #eee0d2
    );

  border:1px solid #c6d4c8;
  border-radius:36px;

  transform:rotate(-3deg);
}

.education-visual-main-card{
  position:relative;
  z-index:2;

  width:min(410px,82%);
  padding:clamp(28px,4vw,42px);

  color:#f8eff1;
  background:linear-gradient(
    145deg,
    var(--primary-dark),
    var(--primary-deep)
  );

  border:1px solid #7d3c4d;
  border-radius:28px;

  box-shadow:var(--shadow-large);
}

.visual-label{
  display:block;
  margin-bottom:12px;

  color:#e8c8d0;
  font-size:.7rem;
  font-weight:900;
  letter-spacing:.15em;
}

.education-visual-main-card h3{
  margin-bottom:14px;

  color:#faeff2;
  font-size:clamp(1.55rem,3vw,2.25rem);
}

.education-visual-main-card p{
  margin:0;
  color:#eadde1;
  line-height:1.65;
}

.education-floating-card{
  position:absolute;
  z-index:3;

  display:grid;
  grid-template-columns:42px minmax(0,1fr);
  align-items:center;
  gap:11px;

  width:min(245px,58%);
  padding:13px;

  background:var(--surface-cream);
  border:1px solid var(--border-soft);
  border-radius:16px;

  box-shadow:var(--shadow-medium);
}

.education-floating-card > span{
  display:grid;
  width:42px;
  height:42px;
  place-items:center;

  background:var(--card-champagne);
  border-radius:12px;

  font-size:1.15rem;
}

.education-floating-card strong{
  display:block;

  color:var(--text-heading);
  font-size:clamp(.72rem,1.1vw,.88rem);
  line-height:1.35;
}

.education-floating-card small{
  display:block;
  margin-top:2px;

  color:var(--text-soft);
  font-size:clamp(.58rem,.85vw,.69rem);
  line-height:1.35;
}

.education-floating-card-one{
  top:6%;
  left:0;
}

.education-floating-card-two{
  top:25%;
  right:0;
}

.education-floating-card-three{
  right:7%;
  bottom:5%;
}

.education-overview-content > h2{
  margin-bottom:17px;
}

.education-overview-content > p{
  margin-bottom:28px;
}

.education-service-list{
  display:grid;
  gap:13px;
  margin-bottom:28px;
}

.education-service-item{
  display:grid;
  grid-template-columns:48px minmax(0,1fr);
  align-items:start;
  gap:13px;

  min-width:0;
  padding:16px;

  background:var(--card-sage);
  border:1px solid var(--border-sage);
  border-radius:16px;

  transition:
    transform var(--transition-fast),
    box-shadow var(--transition-fast);
}

.education-service-item:hover{
  transform:translateX(5px);
  box-shadow:var(--shadow-small);
}

.education-service-number{
  display:grid;
  width:48px;
  height:48px;
  place-items:center;

  color:#edf4ee;
  background:var(--sage);
  border-radius:14px;

  font-size:.77rem;
  font-weight:900;
}

.education-service-item h3{
  margin-bottom:4px;
  font-size:clamp(.9rem,1.4vw,1.04rem);
}

.education-service-item p{
  margin:0;

  color:var(--text-soft);
  font-size:clamp(.76rem,1vw,.86rem);
  line-height:1.55;
}


/*==================================================
STUDY IN INDIA
==================================================*/

.study-india-layout{
  display:grid;
  grid-template-columns:
    minmax(0,1.35fr)
    minmax(300px,.65fr);

  align-items:stretch;
  gap:clamp(24px,4vw,42px);
}

.study-india-highlight-grid{
  display:grid;
  grid-template-columns:
    repeat(2,minmax(0,1fr));

  gap:18px;
}

.study-india-highlight-card{
  display:flex;
  min-width:0;
  height:100%;
  padding:clamp(20px,3vw,28px);
  flex-direction:column;

  background:var(--card-blue);
  border:1px solid var(--border-blue);
  border-radius:20px;

  box-shadow:var(--shadow-small);

  transition:
    transform var(--transition-fast),
    box-shadow var(--transition-fast);
}

.study-india-highlight-card:nth-child(2){
  background:var(--card-champagne);
  border-color:#d6c3a4;
}

.study-india-highlight-card:nth-child(3){
  background:var(--card-sage);
  border-color:var(--border-sage);
}

.study-india-highlight-card:nth-child(4){
  background:var(--card-lavender);
  border-color:#cbc2da;
}

.study-india-highlight-card:hover{
  transform:translateY(-6px);
  box-shadow:var(--shadow-medium);
}

.highlight-card-icon{
  display:grid;
  width:52px;
  height:52px;
  place-items:center;

  margin-bottom:17px;

  background:var(--surface-cream);
  border:1px solid var(--border-soft);
  border-radius:16px;

  font-size:1.38rem;
}

.study-india-highlight-card h3{
  margin-bottom:9px;
}

.study-india-highlight-card p{
  margin-bottom:17px;
  color:var(--text-body);
  font-size:clamp(.78rem,1vw,.9rem);
}

.study-india-highlight-card a{
  display:inline-flex;
  align-items:center;

  margin-top:auto;

  color:var(--primary);
  font-size:clamp(.75rem,1vw,.85rem);
  font-weight:850;

  transition:
    color var(--transition-fast),
    transform var(--transition-fast);
}

.study-india-highlight-card a:hover{
  color:var(--primary-dark);
  transform:translateX(4px);
}

.study-india-information-card{
  display:flex;
  min-width:0;
  height:100%;
  padding:clamp(22px,3vw,32px);
  flex-direction:column;

  background:var(--card-rose);
  border:1px solid #d5b9c1;
  border-radius:24px;

  box-shadow:var(--shadow-medium);
}

.information-card-label{
  display:inline-block;
  align-self:flex-start;

  margin-bottom:10px;
  padding:6px 10px;

  color:var(--primary-dark);
  background:#ead3d9;

  border:1px solid #d5b6bf;
  border-radius:var(--radius-pill);

  font-size:.65rem;
  font-weight:900;
  letter-spacing:.12em;
}

.study-india-information-card h3{
  margin-bottom:20px;
  font-size:clamp(1.25rem,2.4vw,1.75rem);
}

.information-checklist{
  display:grid;
  gap:13px;
  margin-bottom:26px;
}

.information-checklist li{
  display:grid;
  grid-template-columns:23px minmax(0,1fr);
  align-items:start;
  gap:9px;

  min-width:0;

  color:var(--text-dark);
  font-size:clamp(.76rem,1vw,.88rem);
  font-weight:700;
  line-height:1.5;
}

.information-checklist li span{
  display:grid;
  width:21px;
  height:21px;
  place-items:center;

  color:#edf4ee;
  background:var(--sage);
  border-radius:50%;

  font-size:.68rem;
}

.study-india-information-card .button{
  margin-top:auto;
}


/*==================================================
CATALOG AND GRID GLOBAL PROTECTION

Use these classes across all pages so cards always
fit the screen and text remains properly adjusted.
==================================================*/

.catalog-grid,
.course-grid,
.college-grid,
.university-grid,
.country-grid,
.service-grid,
.card-grid,
.footer-catalog-grid{
  display:grid;
  grid-template-columns:
    repeat(
      auto-fit,
      minmax(min(100%,220px),1fr)
    );

  width:100%;
  max-width:100%;
  gap:clamp(12px,2vw,20px);
}

.catalog-grid > *,
.course-grid > *,
.college-grid > *,
.university-grid > *,
.country-grid > *,
.service-grid > *,
.card-grid > *,
.footer-catalog-grid > *{
  min-width:0;
  max-width:100%;
}

.catalog-card,
.course-card,
.college-card,
.university-card,
.country-card,
.service-card{
  display:flex;
  min-width:0;
  max-width:100%;
  height:100%;
  padding:clamp(16px,2.5vw,24px);
  flex-direction:column;

  background:var(--card-rose);
  border:1px solid var(--border-soft);
  border-radius:18px;
}

.catalog-card h3,
.course-card h3,
.college-card h3,
.university-card h3,
.country-card h3,
.service-card h3{
  max-width:100%;
  margin-bottom:8px;

  font-size:clamp(.92rem,1.5vw,1.14rem);
  line-height:1.3;
}

.catalog-card p,
.course-card p,
.college-card p,
.university-card p,
.country-card p,
.service-card p{
  max-width:100%;
  margin-bottom:12px;

  font-size:clamp(.74rem,1vw,.88rem);
  line-height:1.55;
}


/*==================================================
GLOBAL FOCUS STYLES
==================================================*/

a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible{
  outline:3px solid rgba(143,35,65,.28);
  outline-offset:3px;
}


/*==================================================
REDUCED MOTION ACCESSIBILITY
==================================================*/

@media (prefers-reduced-motion:reduce){

  html{
    scroll-behavior:auto;
  }

  *,
  *::before,
  *::after{
    scroll-behavior:auto !important;
    animation-duration:.01ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.01ms !important;
  }

}


/*==================================================
END OF STYLE.CSS PART 1
CONTINUES WITH STUDY ABROAD IN PART 2
==================================================*/

/*==================================================
MEDORBIT GLOBAL WEBSITE CSS
PART 2

Study Abroad
Popular Courses
Institutions
Destinations
Admission Process
Documents Section
Animated icons and cards
==================================================*/


/*==================================================
GLOBAL CARD MOTION
==================================================*/

@keyframes medorbit-float{

  0%,
  100%{
    transform:translateY(0);
  }

  50%{
    transform:translateY(-8px);
  }

}

@keyframes medorbit-soft-pulse{

  0%,
  100%{
    transform:scale(1);
    box-shadow:
      0 8px 20px rgba(55,35,40,.09);
  }

  50%{
    transform:scale(1.04);
    box-shadow:
      0 14px 28px rgba(55,35,40,.15);
  }

}

@keyframes medorbit-glow{

  0%,
  100%{
    opacity:.45;
  }

  50%{
    opacity:.9;
  }

}

@keyframes medorbit-slide-soft{

  0%,
  100%{
    transform:translateX(0);
  }

  50%{
    transform:translateX(5px);
  }

}

.popular-course-icon,
.destination-flag,
.institution-category-icon,
.admission-process-icon,
.study-abroad-feature-icon,
.abroad-main-icon,
.document-checklist-icon{
  animation:
    medorbit-float 4.5s ease-in-out infinite;
}

.popular-course-card:nth-child(2n)
.popular-course-icon,
.destination-card:nth-child(2n)
.destination-flag,
.institution-category-card:nth-child(2)
.institution-category-icon{
  animation-delay:.8s;
}

.popular-course-card:nth-child(3n)
.popular-course-icon,
.destination-card:nth-child(3n)
.destination-flag,
.institution-category-card:nth-child(3)
.institution-category-icon{
  animation-delay:1.4s;
}


/*==================================================
STUDY ABROAD SECTION
==================================================*/

.study-abroad-layout{
  display:grid;
  grid-template-columns:
    minmax(0,1.08fr)
    minmax(320px,.92fr);

  align-items:center;
  gap:clamp(38px,6vw,84px);
}

.study-abroad-content > h2{
  max-width:760px;
  margin-bottom:17px;
}

.study-abroad-content > p{
  max-width:760px;
  margin-bottom:30px;
}

.study-abroad-feature-grid{
  display:grid;
  grid-template-columns:
    repeat(2,minmax(0,1fr));

  gap:15px;
  margin-bottom:30px;
}

.study-abroad-feature{
  display:grid;
  grid-template-columns:48px minmax(0,1fr);
  align-items:start;
  gap:13px;

  min-width:0;
  padding:17px;

  background:var(--card-rose);
  border:1px solid #d7bcc3;
  border-radius:17px;

  box-shadow:var(--shadow-small);

  transition:
    transform var(--transition-fast),
    box-shadow var(--transition-fast),
    border-color var(--transition-fast);
}

.study-abroad-feature:nth-child(2),
.study-abroad-feature:nth-child(5){
  background:var(--card-blue);
  border-color:var(--border-blue);
}

.study-abroad-feature:nth-child(3),
.study-abroad-feature:nth-child(6){
  background:var(--card-sage);
  border-color:var(--border-sage);
}

.study-abroad-feature:nth-child(4){
  background:var(--card-champagne);
  border-color:#d7c3a3;
}

.study-abroad-feature:hover{
  transform:translateY(-5px);
  box-shadow:var(--shadow-medium);
}

.study-abroad-feature-icon{
  display:grid;
  width:48px;
  height:48px;
  place-items:center;

  background:var(--surface-cream);
  border:1px solid var(--border-soft);
  border-radius:15px;

  font-size:1.25rem;
}

.study-abroad-feature h3{
  margin-bottom:5px;
  font-size:clamp(.88rem,1.3vw,1rem);
}

.study-abroad-feature p{
  margin:0;

  color:var(--text-soft);
  font-size:clamp(.72rem,.95vw,.83rem);
  line-height:1.5;
}

.study-abroad-actions{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:12px;
}


/*==================================================
STUDY ABROAD VISUAL
==================================================*/

.study-abroad-visual{
  position:relative;

  display:grid;
  min-height:580px;
  place-items:center;
}

.study-abroad-visual::before{
  position:absolute;
  inset:8% 8%;

  content:"";

  background:
    linear-gradient(
      145deg,
      #dbe7eb,
      #e8e3ed,
      #f0e2dc
    );

  border:1px solid #c2cfd4;
  border-radius:38px;

  transform:rotate(3deg);
}

.study-abroad-visual::after{
  position:absolute;
  top:10%;
  right:12%;

  width:110px;
  height:110px;

  content:"";

  background:
    radial-gradient(
      circle,
      rgba(143,35,65,.18),
      rgba(143,35,65,0)
    );

  border-radius:50%;

  animation:
    medorbit-glow 4s ease-in-out infinite;
}

.abroad-main-card{
  position:relative;
  z-index:3;

  width:min(430px,82%);
  padding:clamp(28px,4vw,42px);

  color:#edf5f6;
  background:
    linear-gradient(
      145deg,
      var(--secondary-dark),
      #102f34
    );

  border:1px solid #3f6970;
  border-radius:30px;

  box-shadow:var(--shadow-large);
}

.abroad-main-icon{
  display:grid;
  width:62px;
  height:62px;
  place-items:center;

  margin-bottom:18px;

  background:#dce9eb;
  border:1px solid #a9c4c9;
  border-radius:20px;

  font-size:1.8rem;
}

.abroad-main-label{
  display:block;
  margin-bottom:10px;

  color:#b9d4d7;
  font-size:.68rem;
  font-weight:900;
  letter-spacing:.15em;
}

.abroad-main-card h3{
  margin-bottom:14px;

  color:#edf5f6;
  font-size:clamp(1.5rem,3vw,2.2rem);
}

.abroad-main-card p{
  margin:0;

  color:#cfe0e2;
  font-size:clamp(.84rem,1.2vw,.97rem);
  line-height:1.65;
}

.abroad-destination-card{
  position:absolute;
  z-index:4;

  display:grid;
  grid-template-columns:45px minmax(0,1fr);
  align-items:center;
  gap:11px;

  width:min(215px,50%);
  padding:12px;

  background:var(--surface-cream);
  border:1px solid var(--border-soft);
  border-radius:16px;

  box-shadow:var(--shadow-medium);

  animation:
    medorbit-float 5s ease-in-out infinite;
}

.abroad-destination-card:nth-of-type(2){
  animation-delay:.5s;
}

.abroad-destination-card:nth-of-type(3){
  animation-delay:1s;
}

.abroad-destination-card:nth-of-type(4){
  animation-delay:1.5s;
}

.abroad-destination-card:nth-of-type(5){
  animation-delay:2s;
}

.destination-icon{
  display:grid;
  width:45px;
  height:45px;
  place-items:center;

  background:var(--card-blue);
  border:1px solid var(--border-blue);
  border-radius:13px;

  font-size:1.2rem;
}

.abroad-destination-card strong{
  display:block;

  color:var(--text-heading);
  font-size:clamp(.74rem,1.1vw,.88rem);
}

.abroad-destination-card small{
  display:block;
  margin-top:2px;

  color:var(--text-soft);
  font-size:clamp(.58rem,.8vw,.68rem);
  line-height:1.35;
}

.destination-card-one{
  top:4%;
  left:0;
}

.destination-card-two{
  top:21%;
  right:0;
}

.destination-card-three{
  bottom:17%;
  left:0;
}

.destination-card-four{
  right:6%;
  bottom:2%;
}


/*==================================================
POPULAR COURSES
==================================================*/

.popular-course-grid{
  display:grid;
  grid-template-columns:
    repeat(4,minmax(0,1fr));

  gap:clamp(15px,2vw,22px);
}

.popular-course-card{
  position:relative;
  isolation:isolate;

  display:flex;
  min-width:0;
  height:100%;
  padding:clamp(20px,2.7vw,28px);
  flex-direction:column;

  background:var(--card-rose);
  border:1px solid #d7bac2;
  border-radius:21px;

  box-shadow:var(--shadow-small);
  overflow:hidden;

  transition:
    transform var(--transition-fast),
    box-shadow var(--transition-fast),
    border-color var(--transition-fast);
}

.popular-course-card::before{
  position:absolute;
  z-index:-1;
  top:-72px;
  right:-72px;

  width:160px;
  height:160px;

  content:"";
  border-radius:50%;

  background:rgba(143,35,65,.08);
}

.popular-course-card:hover{
  transform:translateY(-7px);
  box-shadow:var(--shadow-medium);
}

.course-card-dental,
.course-card-paramedical{
  background:var(--card-blue);
  border-color:var(--border-blue);
}

.course-card-dental::before,
.course-card-paramedical::before{
  background:rgba(36,92,99,.09);
}

.course-card-ayush,
.course-card-engineering{
  background:var(--card-sage);
  border-color:var(--border-sage);
}

.course-card-ayush::before,
.course-card-engineering::before{
  background:rgba(95,120,102,.11);
}

.course-card-nursing,
.course-card-management{
  background:var(--card-lavender);
  border-color:#cac0d9;
}

.course-card-pharmacy{
  background:var(--card-champagne);
  border-color:#d6c29f;
}

.popular-course-icon{
  display:grid;
  width:57px;
  height:57px;
  place-items:center;

  margin-bottom:17px;

  background:var(--surface-cream);
  border:1px solid var(--border-soft);
  border-radius:17px;

  font-size:1.5rem;
}

.popular-course-category{
  display:inline-flex;
  align-self:flex-start;

  margin-bottom:8px;
  padding:5px 9px;

  color:var(--primary-dark);
  background:#ead4da;

  border:1px solid #d4b7c0;
  border-radius:var(--radius-pill);

  font-size:.62rem;
  font-weight:900;
  letter-spacing:.12em;
}

.course-card-dental
.popular-course-category,
.course-card-paramedical
.popular-course-category{
  color:var(--secondary-dark);
  background:#d2e3e7;
  border-color:#b7cdd2;
}

.course-card-ayush
.popular-course-category,
.course-card-engineering
.popular-course-category{
  color:#395441;
  background:#d7e4d9;
  border-color:#bdcfbf;
}

.popular-course-card h3{
  margin-bottom:8px;
  font-size:clamp(1.15rem,1.8vw,1.45rem);
}

.popular-course-card p{
  margin-bottom:17px;

  color:var(--text-body);
  font-size:clamp(.76rem,1vw,.88rem);
  line-height:1.6;
}

.popular-course-meta{
  display:flex;
  flex-wrap:wrap;
  gap:7px;

  margin-bottom:17px;
}

.popular-course-meta span{
  padding:5px 8px;

  color:var(--text-dark);
  background:rgba(244,235,229,.8);

  border:1px solid var(--border-soft);
  border-radius:var(--radius-pill);

  font-size:clamp(.59rem,.8vw,.69rem);
  font-weight:750;
  line-height:1.3;
}

.popular-course-card > a{
  display:inline-flex;
  align-items:center;

  margin-top:auto;

  color:var(--primary);
  font-size:clamp(.73rem,.95vw,.84rem);
  font-weight:850;

  transition:
    transform var(--transition-fast),
    color var(--transition-fast);
}

.popular-course-card > a:hover{
  color:var(--primary-dark);
  transform:translateX(4px);
}


/*==================================================
INSTITUTIONS SECTION
==================================================*/

.institution-category-grid{
  display:grid;
  grid-template-columns:
    repeat(3,minmax(0,1fr));

  gap:clamp(17px,2.5vw,25px);
}

.institution-category-card{
  position:relative;

  display:flex;
  min-width:0;
  height:100%;
  padding:clamp(23px,3vw,32px);
  flex-direction:column;

  background:var(--card-sage);
  border:1px solid var(--border-sage);
  border-radius:23px;

  box-shadow:var(--shadow-small);
  overflow:hidden;

  transition:
    transform var(--transition-fast),
    box-shadow var(--transition-fast);
}

.institution-category-card:nth-child(2){
  background:var(--card-champagne);
  border-color:#d6c19e;
}

.institution-category-card:nth-child(3){
  background:var(--card-blue);
  border-color:var(--border-blue);
}

.institution-category-card::after{
  position:absolute;
  top:-65px;
  right:-65px;

  width:145px;
  height:145px;

  content:"";

  background:rgba(95,120,102,.1);
  border-radius:50%;
}

.institution-category-card:nth-child(2)::after{
  background:rgba(167,118,50,.09);
}

.institution-category-card:nth-child(3)::after{
  background:rgba(36,92,99,.09);
}

.institution-category-card:hover{
  transform:translateY(-7px);
  box-shadow:var(--shadow-medium);
}

.institution-category-icon{
  display:grid;
  width:60px;
  height:60px;
  place-items:center;

  margin-bottom:18px;

  background:var(--surface-cream);
  border:1px solid var(--border-soft);
  border-radius:18px;

  font-size:1.55rem;
}

.institution-category-label{
  display:inline-block;
  align-self:flex-start;

  margin-bottom:8px;
  padding:5px 9px;

  color:#405f49;
  background:#d5e3d7;

  border:1px solid #bbcebe;
  border-radius:var(--radius-pill);

  font-size:.62rem;
  font-weight:900;
  letter-spacing:.12em;
}

.institution-category-card:nth-child(2)
.institution-category-label{
  color:var(--gold-dark);
  background:#eadcbc;
  border-color:#d4c096;
}

.institution-category-card:nth-child(3)
.institution-category-label{
  color:var(--secondary-dark);
  background:#d2e2e6;
  border-color:#b6cbd0;
}

.institution-category-card h3{
  margin-bottom:10px;
  font-size:clamp(1.18rem,2vw,1.58rem);
}

.institution-category-card p{
  margin-bottom:17px;
  color:var(--text-body);
}

.institution-category-card ul{
  display:grid;
  gap:9px;
  margin-bottom:22px;
}

.institution-category-card li{
  position:relative;
  padding-left:19px;

  color:var(--text-dark);
  font-size:clamp(.75rem,1vw,.86rem);
  font-weight:700;
  line-height:1.5;
}

.institution-category-card li::before{
  position:absolute;
  top:.65em;
  left:0;

  width:7px;
  height:7px;

  content:"";

  background:var(--sage);
  border-radius:50%;
}

.institution-category-card:nth-child(2)
li::before{
  background:var(--gold);
}

.institution-category-card:nth-child(3)
li::before{
  background:var(--secondary);
}

.institution-category-card .text-link{
  margin-top:auto;
}


/*==================================================
INSTITUTION SEARCH BANNER
==================================================*/

.institution-search-banner{
  position:relative;
  isolation:isolate;

  display:grid;
  grid-template-columns:
    minmax(0,1fr)
    auto;

  align-items:center;
  gap:30px;

  margin-top:clamp(28px,4vw,46px);
  padding:clamp(24px,4vw,40px);

  color:#f4ecef;
  background:
    linear-gradient(
      135deg,
      var(--primary-dark),
      var(--secondary-dark)
    );

  border:1px solid #70414d;
  border-radius:27px;

  box-shadow:var(--shadow-large);
  overflow:hidden;
}

.institution-search-banner::before{
  position:absolute;
  z-index:-1;
  top:-100px;
  right:-80px;

  width:280px;
  height:280px;

  content:"";

  background:rgba(237,224,227,.08);
  border-radius:50%;
}

.institution-search-banner span{
  display:block;
  margin-bottom:7px;

  color:#e3c8d0;
  font-size:.68rem;
  font-weight:900;
  letter-spacing:.14em;
}

.institution-search-banner h3{
  margin-bottom:8px;

  color:#f8eff1;
  font-size:clamp(1.28rem,2.5vw,2rem);
}

.institution-search-banner p{
  max-width:700px;
  margin:0;

  color:#ddd1d4;
  font-size:clamp(.8rem,1.1vw,.93rem);
}

.institution-search-actions{
  display:flex;
  flex-wrap:wrap;
  justify-content:flex-end;
  gap:10px;
}


/*==================================================
DESTINATION SECTION
==================================================*/

.destination-grid{
  display:grid;
  grid-template-columns:
    repeat(3,minmax(0,1fr));

  gap:clamp(16px,2.3vw,24px);
}

.destination-card{
  position:relative;

  display:flex;
  min-width:0;
  height:100%;
  padding:clamp(21px,3vw,29px);
  flex-direction:column;

  background:var(--card-blue);
  border:1px solid var(--border-blue);
  border-radius:22px;

  box-shadow:var(--shadow-small);
  overflow:hidden;

  transition:
    transform var(--transition-fast),
    box-shadow var(--transition-fast);
}

.destination-card:nth-child(2),
.destination-card:nth-child(5){
  background:var(--card-sage);
  border-color:var(--border-sage);
}

.destination-card:nth-child(3),
.destination-card:nth-child(6){
  background:var(--card-champagne);
  border-color:#d5c09d;
}

.destination-card:nth-child(4){
  background:var(--card-lavender);
  border-color:#c9bfda;
}

.destination-card::after{
  position:absolute;
  top:-58px;
  right:-58px;

  width:130px;
  height:130px;

  content:"";

  background:rgba(36,92,99,.09);
  border-radius:50%;
}

.destination-card:hover{
  transform:translateY(-7px);
  box-shadow:var(--shadow-medium);
}

.destination-flag{
  display:grid;
  width:58px;
  height:58px;
  place-items:center;

  margin-bottom:17px;

  background:var(--surface-cream);
  border:1px solid var(--border-soft);
  border-radius:18px;

  font-size:1.7rem;
}

.destination-type{
  display:inline-block;
  align-self:flex-start;

  margin-bottom:7px;
  padding:5px 9px;

  color:var(--secondary-dark);
  background:#d2e2e5;

  border:1px solid #b7cbd0;
  border-radius:var(--radius-pill);

  font-size:.61rem;
  font-weight:900;
  letter-spacing:.12em;
}

.destination-card:nth-child(2)
.destination-type,
.destination-card:nth-child(5)
.destination-type{
  color:#405b48;
  background:#d4e2d6;
  border-color:#b9cbbb;
}

.destination-card:nth-child(3)
.destination-type,
.destination-card:nth-child(6)
.destination-type{
  color:var(--gold-dark);
  background:#e9daba;
  border-color:#d2bd94;
}

.destination-card h3{
  margin-bottom:9px;
  font-size:clamp(1.16rem,1.9vw,1.46rem);
}

.destination-card p{
  margin-bottom:17px;

  color:var(--text-body);
  font-size:clamp(.76rem,1vw,.88rem);
}

.destination-details{
  display:flex;
  flex-wrap:wrap;
  gap:7px;

  margin-bottom:18px;
}

.destination-details span{
  padding:5px 8px;

  color:var(--text-dark);
  background:rgba(244,235,229,.78);

  border:1px solid var(--border-soft);
  border-radius:var(--radius-pill);

  font-size:clamp(.58rem,.8vw,.68rem);
  font-weight:750;
}

.destination-card > a{
  display:inline-flex;
  margin-top:auto;

  color:var(--primary);
  font-size:clamp(.73rem,.95vw,.84rem);
  font-weight:850;

  transition:
    color var(--transition-fast),
    transform var(--transition-fast);
}

.destination-card > a:hover{
  color:var(--primary-dark);
  transform:translateX(4px);
}


/*==================================================
ADMISSION PROCESS
==================================================*/

.admission-process-grid{
  display:grid;
  grid-template-columns:
    repeat(3,minmax(0,1fr));

  gap:clamp(16px,2.2vw,23px);
}

.admission-process-card{
  position:relative;

  display:flex;
  min-width:0;
  height:100%;
  padding:clamp(21px,3vw,28px);
  flex-direction:column;

  background:var(--card-sage);
  border:1px solid var(--border-sage);
  border-radius:21px;

  box-shadow:var(--shadow-small);
  overflow:hidden;

  transition:
    transform var(--transition-fast),
    box-shadow var(--transition-fast);
}

.admission-process-card:nth-child(2),
.admission-process-card:nth-child(5){
  background:var(--card-blue);
  border-color:var(--border-blue);
}

.admission-process-card:nth-child(3),
.admission-process-card:nth-child(6){
  background:var(--card-rose);
  border-color:#d6bac2;
}

.admission-process-card:nth-child(4){
  background:var(--card-champagne);
  border-color:#d4bf9b;
}

.admission-process-card:hover{
  transform:translateY(-6px);
  box-shadow:var(--shadow-medium);
}

.admission-process-number{
  position:absolute;
  top:15px;
  right:18px;

  color:rgba(41,56,62,.19);
  font-size:clamp(2.1rem,4vw,3.3rem);
  font-weight:950;
  line-height:1;
}

.admission-process-icon{
  display:grid;
  width:54px;
  height:54px;
  place-items:center;

  margin-bottom:17px;

  background:var(--surface-cream);
  border:1px solid var(--border-soft);
  border-radius:17px;

  font-size:1.4rem;
}

.admission-process-card h3{
  margin-bottom:8px;
  font-size:clamp(1rem,1.6vw,1.25rem);
}

.admission-process-card p{
  margin:0;

  color:var(--text-body);
  font-size:clamp(.75rem,1vw,.87rem);
  line-height:1.6;
}

.admission-process-note{
  display:grid;
  grid-template-columns:48px minmax(0,1fr);
  align-items:start;
  gap:14px;

  margin-top:clamp(25px,4vw,42px);
  padding:clamp(18px,3vw,25px);

  background:var(--card-champagne);
  border:1px solid #d5c09c;
  border-radius:19px;

  box-shadow:var(--shadow-small);
}

.admission-note-icon{
  display:grid;
  width:48px;
  height:48px;
  place-items:center;

  color:#f4ebdb;
  background:var(--gold-dark);
  border-radius:15px;

  font-size:1.1rem;
  font-weight:900;
}

.admission-process-note p{
  margin:0;
  color:var(--text-dark);
  font-size:clamp(.77rem,1vw,.89rem);
  line-height:1.65;
}


/*==================================================
DOCUMENTS SECTION
==================================================*/

.documents-layout{
  display:grid;
  grid-template-columns:
    minmax(0,1.15fr)
    minmax(300px,.85fr);

  align-items:start;
  gap:clamp(30px,5vw,62px);
}

.documents-content > h2{
  margin-bottom:16px;
}

.documents-content > p{
  margin-bottom:28px;
}

.document-list-grid{
  display:grid;
  grid-template-columns:
    repeat(2,minmax(0,1fr));

  gap:12px;
  margin-bottom:28px;
}

.document-list-item{
  display:grid;
  grid-template-columns:23px minmax(0,1fr);
  align-items:start;
  gap:9px;

  min-width:0;
  padding:13px 14px;

  background:var(--card-blue);
  border:1px solid var(--border-blue);
  border-radius:14px;
}

.document-list-item:nth-child(2n){
  background:var(--card-sage);
  border-color:var(--border-sage);
}

.document-list-item:nth-child(3n){
  background:var(--card-champagne);
  border-color:#d6c29f;
}

.document-list-item span{
  display:grid;
  width:21px;
  height:21px;
  place-items:center;

  color:#edf5ef;
  background:var(--sage);
  border-radius:50%;

  font-size:.68rem;
}

.document-list-item p{
  margin:0;

  color:var(--text-dark);
  font-size:clamp(.73rem,.98vw,.85rem);
  font-weight:700;
  line-height:1.5;
}


/*==================================================
DOCUMENT CHECKLIST CARD
==================================================*/

.document-checklist-card{
  position:relative;
  overflow:hidden;

  padding:clamp(23px,3.5vw,34px);

  background:var(--card-rose);
  border:1px solid #d5b8c0;
  border-radius:25px;

  box-shadow:var(--shadow-medium);
}

.document-checklist-card::after{
  position:absolute;
  top:-80px;
  right:-80px;

  width:190px;
  height:190px;

  content:"";

  background:rgba(143,35,65,.08);
  border-radius:50%;
}

.document-checklist-header{
  position:relative;
  z-index:2;

  display:grid;
  grid-template-columns:58px minmax(0,1fr);
  align-items:center;
  gap:14px;

  margin-bottom:24px;
}

.document-checklist-icon{
  display:grid;
  width:58px;
  height:58px;
  place-items:center;

  background:var(--surface-cream);
  border:1px solid var(--border-soft);
  border-radius:18px;

  font-size:1.45rem;
}

.document-checklist-header span{
  display:block;
  margin-bottom:4px;

  color:var(--primary);
  font-size:.65rem;
  font-weight:900;
  letter-spacing:.13em;
}

.document-checklist-header h3{
  margin:0;
  font-size:clamp(1.12rem,2vw,1.48rem);
}

.document-checklist-step{
  position:relative;
  z-index:2;

  display:grid;
  grid-template-columns:38px minmax(0,1fr);
  align-items:start;
  gap:11px;

  padding:13px 0;

  border-bottom:1px solid #d9c5ca;
}

.document-checklist-step:last-child{
  border-bottom:0;
}

.document-checklist-step > span{
  display:grid;
  width:36px;
  height:36px;
  place-items:center;

  color:#f5ecef;
  background:var(--primary-dark);
  border-radius:12px;

  font-size:.69rem;
  font-weight:900;
}

.document-checklist-step p{
  margin:0;
  padding-top:5px;

  color:var(--text-dark);
  font-size:clamp(.74rem,.98vw,.86rem);
  font-weight:700;
  line-height:1.5;
}


/*==================================================
GLOBAL THREE-BY-THREE AND TWO-BY-TWO GRID HELPERS
==================================================*/

.grid-3,
.catalog-grid-3,
.cards-3{
  display:grid;
  grid-template-columns:
    repeat(3,minmax(0,1fr));

  width:100%;
  gap:clamp(14px,2.2vw,22px);
}

.grid-2,
.catalog-grid-2,
.cards-2{
  display:grid;
  grid-template-columns:
    repeat(2,minmax(0,1fr));

  width:100%;
  gap:clamp(14px,2.2vw,22px);
}

.grid-3 > *,
.catalog-grid-3 > *,
.cards-3 > *,
.grid-2 > *,
.catalog-grid-2 > *,
.cards-2 > *{
  min-width:0;
  max-width:100%;
}


/*==================================================
CATALOG CARD TEXT PROTECTION
==================================================*/

.popular-course-card,
.destination-card,
.institution-category-card,
.admission-process-card,
.study-abroad-feature,
.document-list-item,
.document-checklist-card{
  contain:layout paint;
}

.popular-course-card *,
.destination-card *,
.institution-category-card *,
.admission-process-card *,
.study-abroad-feature *,
.document-list-item *,
.document-checklist-card *{
  max-width:100%;
}


/*==================================================
TABLET RESPONSIVE LAYOUT
==================================================*/

@media (max-width:1100px){

  .study-abroad-layout{
    grid-template-columns:
      minmax(0,1fr)
      minmax(300px,.82fr);

    gap:38px;
  }

  .popular-course-grid{
    grid-template-columns:
      repeat(3,minmax(0,1fr));
  }

  .institution-category-grid,
  .destination-grid,
  .admission-process-grid{
    grid-template-columns:
      repeat(2,minmax(0,1fr));
  }

  .documents-layout{
    grid-template-columns:
      minmax(0,1fr)
      minmax(290px,.78fr);
  }

}


/*==================================================
SMALL TABLET RESPONSIVE LAYOUT
==================================================*/

@media (max-width:900px){

  .study-abroad-layout,
  .documents-layout{
    grid-template-columns:1fr;
  }

  .study-abroad-visual{
    width:min(680px,100%);
    min-height:540px;
    margin-inline:auto;
  }

  .document-checklist-card{
    width:min(700px,100%);
    margin-inline:auto;
  }

  .institution-search-banner{
    grid-template-columns:1fr;
  }

  .institution-search-actions{
    justify-content:flex-start;
  }

  .popular-course-grid{
    grid-template-columns:
      repeat(2,minmax(0,1fr));
  }

  .grid-3,
  .catalog-grid-3,
  .cards-3{
    grid-template-columns:
      repeat(2,minmax(0,1fr));
  }

}


/*==================================================
MOBILE RESPONSIVE LAYOUT
==================================================*/

@media (max-width:640px){

  .study-abroad-feature-grid,
  .document-list-grid{
    grid-template-columns:1fr;
  }

  .popular-course-grid,
  .institution-category-grid,
  .destination-grid,
  .admission-process-grid,
  .grid-3,
  .catalog-grid-3,
  .cards-3,
  .grid-2,
  .catalog-grid-2,
  .cards-2{
    grid-template-columns:
      repeat(2,minmax(0,1fr));

    gap:11px;
  }

  .popular-course-card,
  .institution-category-card,
  .destination-card,
  .admission-process-card{
    padding:16px;
    border-radius:17px;
  }

  .popular-course-icon,
  .institution-category-icon,
  .destination-flag,
  .admission-process-icon{
    width:47px;
    height:47px;

    margin-bottom:13px;

    border-radius:14px;
    font-size:1.2rem;
  }

  .popular-course-card h3,
  .institution-category-card h3,
  .destination-card h3,
  .admission-process-card h3{
    font-size:clamp(.88rem,3.7vw,1.04rem);
    line-height:1.3;
  }

  .popular-course-card p,
  .institution-category-card p,
  .destination-card p,
  .admission-process-card p{
    font-size:clamp(.67rem,2.7vw,.78rem);
    line-height:1.48;
  }

  .popular-course-category,
  .institution-category-label,
  .destination-type{
    padding:4px 7px;
    font-size:.52rem;
    letter-spacing:.08em;
  }

  .popular-course-meta,
  .destination-details{
    gap:5px;
    margin-bottom:13px;
  }

  .popular-course-meta span,
  .destination-details span{
    padding:4px 6px;
    font-size:.54rem;
  }

  .popular-course-card > a,
  .destination-card > a,
  .institution-category-card .text-link{
    font-size:.68rem;
    line-height:1.35;
  }

  .institution-category-card ul{
    gap:7px;
    margin-bottom:16px;
  }

  .institution-category-card li{
    padding-left:14px;
    font-size:.67rem;
  }

  .admission-process-number{
    top:11px;
    right:12px;
    font-size:2rem;
  }

  .admission-process-note{
    grid-template-columns:40px minmax(0,1fr);
    gap:10px;
    padding:15px;
  }

  .admission-note-icon{
    width:40px;
    height:40px;
  }

  .study-abroad-visual{
    min-height:480px;
  }

  .abroad-main-card{
    width:84%;
    padding:24px;
  }

  .abroad-destination-card{
    width:min(180px,49%);
    grid-template-columns:38px minmax(0,1fr);
    gap:8px;
    padding:9px;
  }

  .destination-icon{
    width:38px;
    height:38px;
    font-size:1rem;
  }

  .destination-card-one{
    top:3%;
  }

  .destination-card-two{
    top:18%;
  }

  .destination-card-three{
    bottom:15%;
  }

  .destination-card-four{
    bottom:1%;
  }

}


/*==================================================
VERY SMALL MOBILE PROTECTION
==================================================*/

@media (max-width:390px){

  .popular-course-grid,
  .institution-category-grid,
  .destination-grid,
  .admission-process-grid,
  .grid-3,
  .catalog-grid-3,
  .cards-3,
  .grid-2,
  .catalog-grid-2,
  .cards-2{
    grid-template-columns:1fr;
  }

  .popular-course-card,
  .institution-category-card,
  .destination-card,
  .admission-process-card{
    padding:18px;
  }

  .study-abroad-visual{
    min-height:520px;
  }

  .abroad-destination-card{
    width:min(175px,54%);
  }

  .destination-card-one{
    left:1%;
  }

  .destination-card-two{
    right:1%;
  }

  .destination-card-three{
    left:1%;
  }

  .destination-card-four{
    right:1%;
  }

}


/*==================================================
END OF STYLE.CSS PART 2
CONTINUES WITH CAREER AND JOB SECTIONS IN PART 3
==================================================*/

/*==================================================
MEDORBIT GLOBAL WEBSITE CSS
PART 3

Career Overview
Job Sectors
Latest Jobs
Employment Process
Training Support
Employer Services
Why Choose MedOrbit
Counsellor Support
Responsive career grids
==================================================*/


/*==================================================
SHARED CAREER ANIMATIONS
==================================================*/

@keyframes medorbit-icon-breathe{

  0%,
  100%{
    transform:translateY(0) scale(1);
  }

  50%{
    transform:translateY(-5px) scale(1.04);
  }

}

@keyframes medorbit-card-shine{

  0%{
    transform:translateX(-160%) rotate(22deg);
  }

  100%{
    transform:translateX(420%) rotate(22deg);
  }

}

@keyframes medorbit-arrow-motion{

  0%,
  100%{
    transform:translateX(0);
    opacity:.6;
  }

  50%{
    transform:translateX(6px);
    opacity:1;
  }

}

@keyframes medorbit-border-pulse{

  0%,
  100%{
    border-color:rgba(143,35,65,.22);
  }

  50%{
    border-color:rgba(143,35,65,.48);
  }

}

.career-feature-icon,
.career-profile-card-icon,
.job-sector-icon,
.latest-job-icon,
.employment-step-icon,
.training-feature-icon,
.employer-visual-icon,
.why-choose-icon{
  animation:
    medorbit-icon-breathe 4.8s ease-in-out infinite;
}

.career-overview-feature:nth-child(2n)
.career-feature-icon,
.job-sector-card:nth-child(2n)
.job-sector-icon,
.latest-job-card:nth-child(2n)
.latest-job-icon,
.why-choose-card:nth-child(2n)
.why-choose-icon{
  animation-delay:.8s;
}

.career-overview-feature:nth-child(3n)
.career-feature-icon,
.job-sector-card:nth-child(3n)
.job-sector-icon,
.latest-job-card:nth-child(3n)
.latest-job-icon,
.why-choose-card:nth-child(3n)
.why-choose-icon{
  animation-delay:1.4s;
}


/*==================================================
CAREER OVERVIEW
==================================================*/

.career-overview-layout{
  display:grid;
  grid-template-columns:
    minmax(0,1.12fr)
    minmax(310px,.88fr);

  align-items:center;
  gap:clamp(34px,6vw,78px);
}

.career-overview-content > h2{
  max-width:760px;
  margin-bottom:17px;
}

.career-overview-content > p{
  max-width:780px;
  margin-bottom:30px;
}

.career-overview-features{
  display:grid;
  grid-template-columns:
    repeat(2,minmax(0,1fr));

  gap:15px;
  margin-bottom:30px;
}

.career-overview-feature{
  display:grid;
  grid-template-columns:50px minmax(0,1fr);
  align-items:start;
  gap:13px;

  min-width:0;
  padding:17px;

  background:var(--card-sage);
  border:1px solid var(--border-sage);
  border-radius:17px;

  box-shadow:var(--shadow-small);

  transition:
    transform var(--transition-fast),
    box-shadow var(--transition-fast),
    border-color var(--transition-fast);
}

.career-overview-feature:nth-child(2){
  background:var(--card-blue);
  border-color:var(--border-blue);
}

.career-overview-feature:nth-child(3){
  background:var(--card-champagne);
  border-color:#d5c09b;
}

.career-overview-feature:nth-child(4){
  background:var(--card-rose);
  border-color:#d5b9c1;
}

.career-overview-feature:hover{
  transform:translateY(-5px);
  box-shadow:var(--shadow-medium);
  border-color:var(--primary);
}

.career-feature-icon{
  display:grid;
  width:50px;
  height:50px;
  place-items:center;

  background:var(--surface-cream);
  border:1px solid var(--border-soft);
  border-radius:15px;

  font-size:1.28rem;
}

.career-overview-feature h3{
  margin-bottom:5px;
  font-size:clamp(.88rem,1.35vw,1.02rem);
}

.career-overview-feature p{
  margin:0;

  color:var(--text-soft);
  font-size:clamp(.72rem,.96vw,.83rem);
  line-height:1.52;
}

.career-overview-actions{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:12px;
}


/*==================================================
CAREER PROFILE CARD
==================================================*/

.career-profile-card{
  position:relative;
  isolation:isolate;

  min-width:0;
  padding:clamp(23px,3.5vw,35px);

  background:var(--card-rose);
  border:1px solid #d5b9c1;
  border-radius:26px;

  box-shadow:var(--shadow-large);
  overflow:hidden;
}

.career-profile-card::before{
  position:absolute;
  z-index:-1;
  top:-90px;
  right:-90px;

  width:210px;
  height:210px;

  content:"";

  background:rgba(143,35,65,.09);
  border-radius:50%;
}

.career-profile-card::after{
  position:absolute;
  z-index:-1;
  bottom:-85px;
  left:-85px;

  width:190px;
  height:190px;

  content:"";

  background:rgba(36,92,99,.07);
  border-radius:50%;
}

.career-profile-card-header{
  display:grid;
  grid-template-columns:60px minmax(0,1fr);
  align-items:center;
  gap:14px;

  margin-bottom:24px;
}

.career-profile-card-icon{
  display:grid;
  width:60px;
  height:60px;
  place-items:center;

  background:var(--surface-cream);
  border:1px solid var(--border-soft);
  border-radius:19px;

  font-size:1.52rem;
}

.career-profile-card-header span{
  display:block;
  margin-bottom:4px;

  color:var(--primary);
  font-size:.65rem;
  font-weight:900;
  letter-spacing:.13em;
}

.career-profile-card-header h3{
  margin:0;
  font-size:clamp(1.18rem,2vw,1.55rem);
}

.career-qualification-list{
  display:grid;
  grid-template-columns:
    repeat(2,minmax(0,1fr));

  gap:11px;
  margin-bottom:24px;
}

.career-qualification-item{
  min-width:0;
  padding:14px;

  background:var(--surface-cream);
  border:1px solid var(--border-soft);
  border-radius:14px;

  transition:
    transform var(--transition-fast),
    background-color var(--transition-fast),
    border-color var(--transition-fast);
}

.career-qualification-item:hover{
  transform:translateY(-3px);
  background:var(--card-champagne);
  border-color:#ccb993;
}

.career-qualification-item strong{
  display:block;
  margin-bottom:3px;

  color:var(--primary-dark);
  font-size:clamp(.75rem,1.1vw,.89rem);
}

.career-qualification-item span{
  display:block;

  color:var(--text-soft);
  font-size:clamp(.61rem,.84vw,.72rem);
  line-height:1.4;
}


/*==================================================
JOB SECTOR CATALOG
==================================================*/

.job-sector-grid{
  display:grid;
  grid-template-columns:
    repeat(4,minmax(0,1fr));

  gap:clamp(14px,2vw,21px);
}

.job-sector-card{
  position:relative;
  isolation:isolate;

  display:flex;
  min-width:0;
  height:100%;
  padding:clamp(19px,2.5vw,26px);
  flex-direction:column;

  background:var(--card-blue);
  border:1px solid var(--border-blue);
  border-radius:20px;

  box-shadow:var(--shadow-small);
  overflow:hidden;

  transition:
    transform var(--transition-fast),
    box-shadow var(--transition-fast),
    border-color var(--transition-fast);
}

.job-sector-card:nth-child(4n + 2){
  background:var(--card-sage);
  border-color:var(--border-sage);
}

.job-sector-card:nth-child(4n + 3){
  background:var(--card-champagne);
  border-color:#d5c09c;
}

.job-sector-card:nth-child(4n){
  background:var(--card-rose);
  border-color:#d5b8c0;
}

.job-sector-card::before{
  position:absolute;
  z-index:-1;
  top:-55px;
  right:-55px;

  width:125px;
  height:125px;

  content:"";

  background:rgba(36,92,99,.08);
  border-radius:50%;
}

.job-sector-card:nth-child(4n + 2)::before{
  background:rgba(95,120,102,.09);
}

.job-sector-card:nth-child(4n + 3)::before{
  background:rgba(167,118,50,.08);
}

.job-sector-card:nth-child(4n)::before{
  background:rgba(143,35,65,.08);
}

.job-sector-card::after{
  position:absolute;
  top:-30%;
  left:-35%;

  width:45%;
  height:180%;

  content:"";

  background:
    linear-gradient(
      90deg,
      transparent,
      rgba(248,239,241,.22),
      transparent
    );

  transform:rotate(22deg);
  pointer-events:none;
}

.job-sector-card:hover{
  transform:translateY(-7px);
  box-shadow:var(--shadow-medium);
  border-color:var(--primary);
}

.job-sector-card:hover::after{
  animation:
    medorbit-card-shine .9s ease forwards;
}

.job-sector-icon{
  display:grid;
  width:54px;
  height:54px;
  place-items:center;

  margin-bottom:16px;

  background:var(--surface-cream);
  border:1px solid var(--border-soft);
  border-radius:17px;

  font-size:1.42rem;
}

.job-sector-card h3{
  margin-bottom:8px;
  font-size:clamp(.98rem,1.55vw,1.18rem);
}

.job-sector-card p{
  margin-bottom:17px;

  color:var(--text-body);
  font-size:clamp(.72rem,.96vw,.84rem);
  line-height:1.55;
}

.job-sector-tag{
  display:inline-flex;
  align-self:flex-start;

  margin-top:auto;
  padding:6px 9px;

  color:var(--secondary-dark);
  background:rgba(225,237,239,.88);

  border:1px solid #b9ccd1;
  border-radius:var(--radius-pill);

  font-size:clamp(.57rem,.78vw,.68rem);
  font-weight:800;
  line-height:1.3;
}

.job-sector-card:nth-child(4n + 2)
.job-sector-tag{
  color:#3f5946;
  background:#d8e4da;
  border-color:#becfbe;
}

.job-sector-card:nth-child(4n + 3)
.job-sector-tag{
  color:var(--gold-dark);
  background:#eadcbc;
  border-color:#d2bd93;
}

.job-sector-card:nth-child(4n)
.job-sector-tag{
  color:var(--primary-dark);
  background:#ead4da;
  border-color:#d4b6bf;
}


/*==================================================
LATEST JOB CARDS
==================================================*/

.latest-job-grid{
  display:grid;
  grid-template-columns:
    repeat(3,minmax(0,1fr));

  gap:clamp(16px,2.3vw,24px);
}

.latest-job-card{
  position:relative;

  display:flex;
  min-width:0;
  height:100%;
  padding:clamp(21px,3vw,29px);
  flex-direction:column;

  background:var(--card-rose);
  border:1px solid #d5b8c0;
  border-radius:22px;

  box-shadow:var(--shadow-small);
  overflow:hidden;

  transition:
    transform var(--transition-fast),
    box-shadow var(--transition-fast),
    border-color var(--transition-fast);
}

.latest-job-card:nth-child(2),
.latest-job-card:nth-child(5){
  background:var(--card-blue);
  border-color:var(--border-blue);
}

.latest-job-card:nth-child(3),
.latest-job-card:nth-child(6){
  background:var(--card-sage);
  border-color:var(--border-sage);
}

.latest-job-card:nth-child(4){
  background:var(--card-champagne);
  border-color:#d5c09b;
}

.latest-job-card::before{
  position:absolute;
  top:-75px;
  right:-75px;

  width:170px;
  height:170px;

  content:"";

  background:rgba(143,35,65,.07);
  border-radius:50%;
}

.latest-job-card:hover{
  transform:translateY(-7px);
  box-shadow:var(--shadow-medium);
  border-color:var(--primary);
}

.latest-job-header{
  position:relative;
  z-index:2;

  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;

  margin-bottom:17px;
}

.latest-job-icon{
  display:grid;
  width:52px;
  height:52px;
  flex:0 0 52px;
  place-items:center;

  background:var(--surface-cream);
  border:1px solid var(--border-soft);
  border-radius:16px;

  font-size:1.36rem;
}

.latest-job-status{
  max-width:55%;
  padding:6px 9px;

  color:#3e5d46;
  background:#d7e4d8;

  border:1px solid #bccdbd;
  border-radius:var(--radius-pill);

  font-size:clamp(.55rem,.75vw,.66rem);
  font-weight:850;
  line-height:1.3;
  text-align:center;
}

.latest-job-card h3{
  margin-bottom:4px;
  font-size:clamp(1.03rem,1.7vw,1.3rem);
}

.latest-job-company{
  margin-bottom:15px;

  color:var(--primary);
  font-size:clamp(.68rem,.9vw,.79rem);
  font-weight:850;
}

.latest-job-details{
  display:grid;
  gap:8px;

  margin-bottom:16px;
  padding:13px;

  background:rgba(245,236,231,.76);
  border:1px solid var(--border-soft);
  border-radius:14px;
}

.latest-job-details span{
  color:var(--text-dark);
  font-size:clamp(.66rem,.88vw,.77rem);
  font-weight:700;
  line-height:1.4;
}

.latest-job-card > p:not(.latest-job-company){
  margin-bottom:18px;

  color:var(--text-body);
  font-size:clamp(.73rem,.97vw,.85rem);
  line-height:1.58;
}

.latest-job-card > a{
  display:inline-flex;
  align-items:center;

  margin-top:auto;

  color:var(--primary);
  font-size:clamp(.72rem,.94vw,.83rem);
  font-weight:850;

  transition:
    color var(--transition-fast),
    transform var(--transition-fast);
}

.latest-job-card > a:hover{
  color:var(--primary-dark);
  transform:translateX(4px);
}


/*==================================================
LATEST JOB NOTICE
==================================================*/

.latest-jobs-note{
  display:grid;
  grid-template-columns:auto minmax(0,1fr);
  align-items:start;
  gap:13px;

  margin-top:clamp(26px,4vw,42px);
  padding:clamp(17px,2.7vw,24px);

  background:var(--card-champagne);
  border:1px solid #d5bf9b;
  border-radius:18px;

  box-shadow:var(--shadow-small);
}

.latest-jobs-note > span{
  display:inline-flex;
  align-items:center;
  justify-content:center;

  min-height:34px;
  padding:7px 11px;

  color:#f6edde;
  background:var(--gold-dark);

  border-radius:var(--radius-pill);

  font-size:.66rem;
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
}

.latest-jobs-note p{
  margin:0;

  color:var(--text-dark);
  font-size:clamp(.75rem,1vw,.87rem);
  line-height:1.62;
}


/*==================================================
EMPLOYMENT PROCESS
==================================================*/

.employment-process-wrapper{
  display:grid;
  grid-template-columns:
    minmax(0,1fr)
    35px
    minmax(0,1fr)
    35px
    minmax(0,1fr)
    35px
    minmax(0,1fr)
    35px
    minmax(0,1fr);

  align-items:stretch;
  gap:8px;
}

.employment-process-step{
  position:relative;

  display:flex;
  min-width:0;
  height:100%;
  padding:clamp(18px,2.4vw,25px);
  flex-direction:column;

  background:var(--card-sage);
  border:1px solid var(--border-sage);
  border-radius:19px;

  box-shadow:var(--shadow-small);

  transition:
    transform var(--transition-fast),
    box-shadow var(--transition-fast);
}

.employment-process-step:nth-of-type(2){
  background:var(--card-blue);
  border-color:var(--border-blue);
}

.employment-process-step:nth-of-type(3){
  background:var(--card-champagne);
  border-color:#d5c09b;
}

.employment-process-step:nth-of-type(4){
  background:var(--card-rose);
  border-color:#d5b8c0;
}

.employment-process-step:nth-of-type(5){
  background:var(--card-lavender);
  border-color:#c9bfd8;
}

.employment-process-step:hover{
  transform:translateY(-6px);
  box-shadow:var(--shadow-medium);
}

.employment-step-number{
  position:absolute;
  top:13px;
  right:15px;

  color:rgba(41,56,62,.18);
  font-size:clamp(1.75rem,3vw,2.5rem);
  font-weight:950;
  line-height:1;
}

.employment-step-icon{
  display:grid;
  width:50px;
  height:50px;
  place-items:center;

  margin-bottom:16px;

  background:var(--surface-cream);
  border:1px solid var(--border-soft);
  border-radius:15px;

  font-size:1.28rem;
}

.employment-process-step h3{
  margin-bottom:8px;
  font-size:clamp(.88rem,1.35vw,1.03rem);
}

.employment-process-step p{
  margin:0;

  color:var(--text-body);
  font-size:clamp(.68rem,.9vw,.79rem);
  line-height:1.55;
}

.employment-process-arrow{
  display:grid;
  place-items:center;

  color:var(--primary);
  font-size:1.5rem;
  font-weight:900;

  animation:
    medorbit-arrow-motion 2.4s ease-in-out infinite;
}

.employment-process-actions{
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  gap:12px;

  margin-top:clamp(28px,4vw,44px);
}


/*==================================================
TRAINING SECTION
==================================================*/

.training-layout{
  display:grid;
  grid-template-columns:
    minmax(0,1.12fr)
    minmax(300px,.88fr);

  align-items:center;
  gap:clamp(34px,6vw,74px);
}

.training-content > h2{
  margin-bottom:16px;
}

.training-content > p{
  margin-bottom:28px;
}

.training-feature-list{
  display:grid;
  grid-template-columns:
    repeat(2,minmax(0,1fr));

  gap:14px;
  margin-bottom:28px;
}

.training-feature-item{
  display:grid;
  grid-template-columns:49px minmax(0,1fr);
  align-items:start;
  gap:12px;

  min-width:0;
  padding:16px;

  background:var(--card-rose);
  border:1px solid #d5b9c1;
  border-radius:16px;

  transition:
    transform var(--transition-fast),
    box-shadow var(--transition-fast);
}

.training-feature-item:nth-child(2){
  background:var(--card-blue);
  border-color:var(--border-blue);
}

.training-feature-item:nth-child(3){
  background:var(--card-sage);
  border-color:var(--border-sage);
}

.training-feature-item:nth-child(4){
  background:var(--card-champagne);
  border-color:#d5c09c;
}

.training-feature-item:hover{
  transform:translateY(-5px);
  box-shadow:var(--shadow-small);
}

.training-feature-icon{
  display:grid;
  width:49px;
  height:49px;
  place-items:center;

  background:var(--surface-cream);
  border:1px solid var(--border-soft);
  border-radius:15px;

  font-size:1.25rem;
}

.training-feature-item h3{
  margin-bottom:4px;
  font-size:clamp(.85rem,1.3vw,.98rem);
}

.training-feature-item p{
  margin:0;

  color:var(--text-soft);
  font-size:clamp(.69rem,.9vw,.8rem);
  line-height:1.5;
}


/*==================================================
INTERVIEW CHECKLIST
==================================================*/

.interview-checklist-card{
  position:relative;
  isolation:isolate;

  min-width:0;
  padding:clamp(23px,3.4vw,34px);

  background:var(--card-blue);
  border:1px solid var(--border-blue);
  border-radius:25px;

  box-shadow:var(--shadow-medium);
  overflow:hidden;
}

.interview-checklist-card::before{
  position:absolute;
  z-index:-1;
  top:-90px;
  right:-90px;

  width:210px;
  height:210px;

  content:"";

  background:rgba(36,92,99,.09);
  border-radius:50%;
}

.interview-checklist-label{
  display:inline-flex;

  margin-bottom:10px;
  padding:6px 10px;

  color:var(--secondary-dark);
  background:#d3e3e6;

  border:1px solid #b7cbd0;
  border-radius:var(--radius-pill);

  font-size:.63rem;
  font-weight:900;
  letter-spacing:.12em;
}

.interview-checklist-card h3{
  margin-bottom:20px;
  font-size:clamp(1.18rem,2.2vw,1.6rem);
}

.interview-checklist-item{
  display:grid;
  grid-template-columns:23px minmax(0,1fr);
  align-items:start;
  gap:10px;

  padding:12px 0;

  border-bottom:1px solid #bed0d4;
}

.interview-checklist-item:last-child{
  border-bottom:0;
}

.interview-checklist-item span{
  display:grid;
  width:21px;
  height:21px;
  place-items:center;

  color:#edf5ef;
  background:var(--sage);
  border-radius:50%;

  font-size:.68rem;
}

.interview-checklist-item p{
  margin:0;

  color:var(--text-dark);
  font-size:clamp(.73rem,.96vw,.84rem);
  font-weight:700;
  line-height:1.52;
}


/*==================================================
EMPLOYER SERVICES
==================================================*/

.employer-services-layout{
  display:grid;
  grid-template-columns:
    minmax(320px,.9fr)
    minmax(0,1.1fr);

  align-items:center;
  gap:clamp(36px,6vw,80px);
}

.employer-services-visual{
  position:relative;

  display:grid;
  min-height:560px;
  place-items:center;
}

.employer-services-visual::before{
  position:absolute;
  inset:8% 8%;

  content:"";

  background:
    linear-gradient(
      145deg,
      #d9e7dc,
      #e4e9ef,
      #ede0d4
    );

  border:1px solid #c5d1c7;
  border-radius:37px;

  transform:rotate(-3deg);
}

.employer-visual-card{
  position:relative;
  z-index:3;

  width:min(420px,82%);
  padding:clamp(28px,4vw,42px);

  color:#eff5f1;
  background:
    linear-gradient(
      145deg,
      #395747,
      #20392c
    );

  border:1px solid #62806c;
  border-radius:29px;

  box-shadow:var(--shadow-large);
}

.employer-visual-icon{
  display:grid;
  width:62px;
  height:62px;
  place-items:center;

  margin-bottom:18px;

  background:#e1ebe2;
  border:1px solid #b9cbbd;
  border-radius:19px;

  font-size:1.65rem;
}

.employer-visual-label{
  display:block;
  margin-bottom:10px;

  color:#c3d8c8;
  font-size:.67rem;
  font-weight:900;
  letter-spacing:.15em;
}

.employer-visual-card h3{
  margin-bottom:13px;

  color:#f1f6f2;
  font-size:clamp(1.45rem,2.8vw,2.1rem);
}

.employer-visual-card p{
  margin:0;

  color:#d2e0d5;
  font-size:clamp(.82rem,1.15vw,.95rem);
  line-height:1.64;
}

.employer-small-card{
  position:absolute;
  z-index:4;

  width:min(225px,52%);
  padding:14px;

  background:var(--surface-cream);
  border:1px solid var(--border-soft);
  border-radius:15px;

  box-shadow:var(--shadow-medium);

  animation:
    medorbit-float 5.2s ease-in-out infinite;
}

.employer-small-card strong{
  display:block;
  margin-bottom:3px;

  color:var(--text-heading);
  font-size:clamp(.72rem,1.05vw,.86rem);
}

.employer-small-card span{
  display:block;

  color:var(--text-soft);
  font-size:clamp(.59rem,.8vw,.69rem);
  line-height:1.35;
}

.employer-small-card-one{
  top:7%;
  left:0;
}

.employer-small-card-two{
  top:30%;
  right:0;
  animation-delay:.9s;
}

.employer-small-card-three{
  right:8%;
  bottom:5%;
  animation-delay:1.7s;
}

.employer-services-content > h2{
  margin-bottom:16px;
}

.employer-services-content > p{
  margin-bottom:28px;
}

.employer-service-grid{
  display:grid;
  grid-template-columns:
    repeat(2,minmax(0,1fr));

  gap:13px;
  margin-bottom:28px;
}

.employer-service-item{
  display:grid;
  grid-template-columns:43px minmax(0,1fr);
  align-items:start;
  gap:11px;

  min-width:0;
  padding:15px;

  background:var(--card-sage);
  border:1px solid var(--border-sage);
  border-radius:15px;

  transition:
    transform var(--transition-fast),
    box-shadow var(--transition-fast);
}

.employer-service-item:nth-child(2){
  background:var(--card-blue);
  border-color:var(--border-blue);
}

.employer-service-item:nth-child(3){
  background:var(--card-champagne);
  border-color:#d5c09b;
}

.employer-service-item:nth-child(4){
  background:var(--card-rose);
  border-color:#d5b8c0;
}

.employer-service-item:hover{
  transform:translateY(-4px);
  box-shadow:var(--shadow-small);
}

.employer-service-item > span{
  display:grid;
  width:43px;
  height:43px;
  place-items:center;

  color:#edf5ef;
  background:var(--sage);
  border-radius:13px;

  font-size:.7rem;
  font-weight:900;
}

.employer-service-item:nth-child(2) > span{
  background:var(--secondary);
}

.employer-service-item:nth-child(3) > span{
  background:var(--gold-dark);
}

.employer-service-item:nth-child(4) > span{
  background:var(--primary-dark);
}

.employer-service-item h3{
  margin-bottom:4px;
  font-size:clamp(.83rem,1.25vw,.96rem);
}

.employer-service-item p{
  margin:0;

  color:var(--text-soft);
  font-size:clamp(.68rem,.9vw,.79rem);
  line-height:1.48;
}


/*==================================================
WHY CHOOSE MEDORBIT
==================================================*/

.why-choose-grid{
  display:grid;
  grid-template-columns:
    repeat(4,minmax(0,1fr));

  gap:clamp(14px,2vw,21px);
}

.why-choose-card{
  position:relative;
  isolation:isolate;

  display:flex;
  min-width:0;
  height:100%;
  padding:clamp(19px,2.5vw,26px);
  flex-direction:column;

  background:var(--card-sage);
  border:1px solid var(--border-sage);
  border-radius:20px;

  box-shadow:var(--shadow-small);
  overflow:hidden;

  transition:
    transform var(--transition-fast),
    box-shadow var(--transition-fast),
    border-color var(--transition-fast);
}

.why-choose-card:nth-child(4n + 2){
  background:var(--card-blue);
  border-color:var(--border-blue);
}

.why-choose-card:nth-child(4n + 3){
  background:var(--card-champagne);
  border-color:#d5c09b;
}

.why-choose-card:nth-child(4n){
  background:var(--card-rose);
  border-color:#d5b8c0;
}

.why-choose-card::after{
  position:absolute;
  z-index:-1;
  top:-50px;
  right:-50px;

  width:120px;
  height:120px;

  content:"";

  background:rgba(95,120,102,.08);
  border-radius:50%;
}

.why-choose-card:hover{
  transform:translateY(-7px);
  box-shadow:var(--shadow-medium);
  border-color:var(--primary);
}

.why-choose-icon{
  display:grid;
  width:53px;
  height:53px;
  place-items:center;

  margin-bottom:16px;

  background:var(--surface-cream);
  border:1px solid var(--border-soft);
  border-radius:16px;

  font-size:1.35rem;
}

.why-choose-card h3{
  margin-bottom:8px;
  font-size:clamp(.92rem,1.45vw,1.1rem);
}

.why-choose-card p{
  margin:0;

  color:var(--text-body);
  font-size:clamp(.71rem,.94vw,.82rem);
  line-height:1.55;
}


/*==================================================
COUNSELLOR SUPPORT BANNER
==================================================*/

.counsellor-support-section{
  padding:
    clamp(48px,6vw,78px)
    0;
}

.counsellor-support-card{
  position:relative;
  isolation:isolate;

  display:grid;
  grid-template-columns:
    minmax(0,1fr)
    auto;

  align-items:center;
  gap:clamp(24px,4vw,45px);

  padding:clamp(27px,4vw,44px);

  background:
    linear-gradient(
      135deg,
      #ead9de,
      #dce9e5,
      #e8dfd0
    );

  border:1px solid #cdbcc0;
  border-radius:28px;

  box-shadow:var(--shadow-large);
  overflow:hidden;

  animation:
    medorbit-border-pulse 5s ease-in-out infinite;
}

.counsellor-support-card::before{
  position:absolute;
  z-index:-1;
  top:-100px;
  right:-70px;

  width:280px;
  height:280px;

  content:"";

  background:rgba(143,35,65,.08);
  border-radius:50%;
}

.counsellor-support-card::after{
  position:absolute;
  z-index:-1;
  bottom:-120px;
  left:-90px;

  width:300px;
  height:300px;

  content:"";

  background:rgba(36,92,99,.07);
  border-radius:50%;
}

.counsellor-support-content{
  min-width:0;
}

.counsellor-support-content h2{
  max-width:780px;
  margin-bottom:12px;
}

.counsellor-support-content p{
  max-width:760px;
  margin-bottom:18px;
}

.counsellor-support-tags{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}

.counsellor-support-tags span{
  padding:6px 10px;

  color:var(--text-dark);
  background:rgba(244,235,229,.8);

  border:1px solid var(--border-soft);
  border-radius:var(--radius-pill);

  font-size:clamp(.62rem,.85vw,.74rem);
  font-weight:800;
  line-height:1.3;
}

.counsellor-support-actions{
  display:flex;
  min-width:190px;
  flex-direction:column;
  gap:10px;
}


/*==================================================
CAREER CATALOG PROTECTION
==================================================*/

.career-overview-feature,
.career-profile-card,
.job-sector-card,
.latest-job-card,
.employment-process-step,
.training-feature-item,
.interview-checklist-card,
.employer-service-item,
.why-choose-card,
.counsellor-support-card{
  contain:layout paint;
}

.career-overview-feature *,
.career-profile-card *,
.job-sector-card *,
.latest-job-card *,
.employment-process-step *,
.training-feature-item *,
.interview-checklist-card *,
.employer-service-item *,
.why-choose-card *,
.counsellor-support-card *{
  max-width:100%;
}


/*==================================================
DESKTOP AND TABLET ADJUSTMENTS
==================================================*/

@media (max-width:1180px){

  .job-sector-grid,
  .why-choose-grid{
    grid-template-columns:
      repeat(3,minmax(0,1fr));
  }

  .employment-process-wrapper{
    grid-template-columns:
      repeat(3,minmax(0,1fr));

    gap:18px;
  }

  .employment-process-arrow{
    display:none;
  }

  .employment-process-step:nth-of-type(4),
  .employment-process-step:nth-of-type(5){
    grid-column:auto;
  }

}


/*==================================================
TABLET LAYOUT
==================================================*/

@media (max-width:1000px){

  .career-overview-layout,
  .training-layout,
  .employer-services-layout{
    grid-template-columns:1fr;
  }

  .career-profile-card,
  .interview-checklist-card{
    width:min(760px,100%);
    margin-inline:auto;
  }

  .employer-services-visual{
    width:min(680px,100%);
    min-height:540px;
    margin-inline:auto;
  }

  .latest-job-grid{
    grid-template-columns:
      repeat(2,minmax(0,1fr));
  }

  .job-sector-grid,
  .why-choose-grid{
    grid-template-columns:
      repeat(3,minmax(0,1fr));
  }

  .counsellor-support-card{
    grid-template-columns:1fr;
  }

  .counsellor-support-actions{
    min-width:0;
    flex-direction:row;
    flex-wrap:wrap;
  }

}


/*==================================================
SMALL TABLET LAYOUT
==================================================*/

@media (max-width:820px){

  .career-overview-features,
  .training-feature-list,
  .employer-service-grid{
    grid-template-columns:
      repeat(2,minmax(0,1fr));
  }

  .job-sector-grid,
  .why-choose-grid{
    grid-template-columns:
      repeat(2,minmax(0,1fr));
  }

  .employment-process-wrapper{
    grid-template-columns:
      repeat(2,minmax(0,1fr));
  }

  .employment-process-step:last-of-type{
    grid-column:1 / -1;
    width:min(480px,100%);
    justify-self:center;
  }

}


/*==================================================
MOBILE LAYOUT
==================================================*/

@media (max-width:640px){

  .career-overview-features,
  .training-feature-list,
  .employer-service-grid{
    grid-template-columns:1fr;
  }

  .career-qualification-list{
    grid-template-columns:
      repeat(2,minmax(0,1fr));

    gap:9px;
  }

  .job-sector-grid,
  .latest-job-grid,
  .why-choose-grid{
    grid-template-columns:
      repeat(2,minmax(0,1fr));

    gap:11px;
  }

  .job-sector-card,
  .latest-job-card,
  .why-choose-card{
    padding:16px;
    border-radius:17px;
  }

  .job-sector-icon,
  .latest-job-icon,
  .why-choose-icon{
    width:46px;
    height:46px;

    margin-bottom:12px;

    border-radius:14px;
    font-size:1.15rem;
  }

  .job-sector-card h3,
  .latest-job-card h3,
  .why-choose-card h3{
    font-size:clamp(.82rem,3.6vw,1rem);
    line-height:1.28;
  }

  .job-sector-card p,
  .latest-job-card > p:not(.latest-job-company),
  .why-choose-card p{
    font-size:clamp(.64rem,2.65vw,.76rem);
    line-height:1.46;
  }

  .job-sector-tag{
    padding:4px 7px;
    font-size:.52rem;
  }

  .latest-job-header{
    align-items:flex-start;
    gap:7px;
  }

  .latest-job-status{
    max-width:58%;
    padding:5px 6px;
    font-size:.5rem;
  }

  .latest-job-company{
    font-size:.63rem;
  }

  .latest-job-details{
    gap:6px;
    padding:9px;
  }

  .latest-job-details span{
    font-size:.59rem;
  }

  .latest-job-card > a{
    font-size:.66rem;
    line-height:1.35;
  }

  .employment-process-wrapper{
    grid-template-columns:1fr;
  }

  .employment-process-step:last-of-type{
    grid-column:auto;
    width:100%;
  }

  .employment-process-step{
    display:grid;
    grid-template-columns:48px minmax(0,1fr);
    align-items:start;
    gap:11px;

    padding:16px;
  }

  .employment-step-icon{
    grid-row:1 / 3;

    width:48px;
    height:48px;
    margin:0;

    border-radius:14px;
  }

  .employment-process-step h3{
    margin-top:2px;
    margin-bottom:4px;
  }

  .employment-process-step p{
    grid-column:2;
  }

  .employment-step-number{
    top:10px;
    right:12px;
    font-size:1.7rem;
  }

  .employer-services-visual{
    min-height:490px;
  }

  .employer-visual-card{
    width:84%;
    padding:24px;
  }

  .employer-small-card{
    width:min(180px,50%);
    padding:10px;
  }

  .employer-small-card-one{
    left:1%;
  }

  .employer-small-card-two{
    right:1%;
  }

  .employer-small-card-three{
    right:2%;
  }

  .counsellor-support-card{
    padding:22px 18px;
    border-radius:22px;
  }

  .counsellor-support-actions{
    display:grid;
    grid-template-columns:
      repeat(2,minmax(0,1fr));

    width:100%;
  }

  .counsellor-support-actions .button{
    width:100%;
    min-height:46px;
    padding:11px 12px;

    font-size:.76rem;
  }

}


/*==================================================
VERY SMALL MOBILE LAYOUT
==================================================*/

@media (max-width:390px){

  .job-sector-grid,
  .latest-job-grid,
  .why-choose-grid{
    grid-template-columns:1fr;
  }

  .career-qualification-list{
    grid-template-columns:1fr;
  }

  .job-sector-card,
  .latest-job-card,
  .why-choose-card{
    padding:18px;
  }

  .latest-jobs-note{
    grid-template-columns:1fr;
  }

  .latest-jobs-note > span{
    justify-self:start;
  }

  .counsellor-support-actions{
    grid-template-columns:1fr;
  }

  .employer-services-visual{
    min-height:520px;
  }

  .employer-small-card{
    width:min(175px,55%);
  }

}


/*==================================================
END OF STYLE.CSS PART 3
CONTINUES WITH FAQ, APP, FORMS AND FOOTER IN PART 4
==================================================*/

/*==================================================
MEDORBIT GLOBAL WEBSITE CSS
PART 4

Guidance Journeys
Platform Statistics
FAQ
MedOrbit Mobile App
Final Guidance Form
Important Notice
Legal Disclaimer
Premium Footer
Mobile Quick Actions
Responsive layouts
==================================================*/


/*==================================================
SHARED ANIMATIONS
==================================================*/

@keyframes medorbit-icon-rotate-soft{

  0%,
  100%{
    transform:rotate(0deg) translateY(0);
  }

  50%{
    transform:rotate(3deg) translateY(-5px);
  }

}

@keyframes medorbit-phone-float{

  0%,
  100%{
    transform:translateY(0) rotate(-1deg);
  }

  50%{
    transform:translateY(-10px) rotate(1deg);
  }

}

@keyframes medorbit-notification-pulse{

  0%,
  100%{
    transform:scale(1);
    opacity:.88;
  }

  50%{
    transform:scale(1.06);
    opacity:1;
  }

}

@keyframes medorbit-background-drift{

  0%,
  100%{
    transform:
      translate3d(0,0,0)
      rotate(0deg);
  }

  50%{
    transform:
      translate3d(10px,-8px,0)
      rotate(4deg);
  }

}

@keyframes medorbit-footer-glow{

  0%,
  100%{
    opacity:.22;
  }

  50%{
    opacity:.48;
  }

}

.journey-avatar,
.platform-statistic-icon,
.faq-support-icon,
.mobile-app-feature > span,
.important-notice-icon{
  animation:
    medorbit-icon-rotate-soft 4.8s ease-in-out infinite;
}


/*==================================================
GUIDANCE JOURNEYS
==================================================*/

.journey-card-grid{
  display:grid;
  grid-template-columns:
    repeat(4,minmax(0,1fr));

  gap:clamp(15px,2vw,22px);
}

.journey-card{
  position:relative;
  isolation:isolate;

  display:flex;
  min-width:0;
  height:100%;
  padding:clamp(20px,2.8vw,28px);
  flex-direction:column;

  background:var(--card-rose);
  border:1px solid #d5b8c0;
  border-radius:22px;

  box-shadow:var(--shadow-small);
  overflow:hidden;

  transition:
    transform var(--transition-fast),
    box-shadow var(--transition-fast),
    border-color var(--transition-fast);
}

.journey-card:nth-child(2){
  background:var(--card-blue);
  border-color:var(--border-blue);
}

.journey-card:nth-child(3){
  background:var(--card-sage);
  border-color:var(--border-sage);
}

.journey-card:nth-child(4){
  background:var(--card-champagne);
  border-color:#d5c09c;
}

.journey-card::after{
  position:absolute;
  z-index:-1;
  top:-58px;
  right:-58px;

  width:135px;
  height:135px;

  content:"";

  background:rgba(143,35,65,.08);
  border-radius:50%;
}

.journey-card:nth-child(2)::after{
  background:rgba(36,92,99,.08);
}

.journey-card:nth-child(3)::after{
  background:rgba(95,120,102,.09);
}

.journey-card:nth-child(4)::after{
  background:rgba(167,118,50,.08);
}

.journey-card:hover{
  transform:translateY(-7px);
  box-shadow:var(--shadow-medium);
  border-color:var(--primary);
}

.journey-card-top{
  display:grid;
  grid-template-columns:54px minmax(0,1fr);
  align-items:center;
  gap:13px;

  margin-bottom:17px;
}

.journey-avatar{
  display:grid;
  width:54px;
  height:54px;
  place-items:center;

  background:var(--surface-cream);
  border:1px solid var(--border-soft);
  border-radius:17px;

  font-size:1.4rem;
}

.journey-type{
  display:block;
  margin-bottom:3px;

  color:var(--primary);
  font-size:clamp(.56rem,.78vw,.67rem);
  font-weight:900;
  letter-spacing:.11em;
}

.journey-card:nth-child(2)
.journey-type{
  color:var(--secondary-dark);
}

.journey-card:nth-child(3)
.journey-type{
  color:#405b47;
}

.journey-card:nth-child(4)
.journey-type{
  color:var(--gold-dark);
}

.journey-card h3{
  margin:0;
  font-size:clamp(.94rem,1.5vw,1.13rem);
  line-height:1.3;
}

.journey-card > p{
  margin-bottom:18px;

  color:var(--text-body);
  font-size:clamp(.72rem,.96vw,.84rem);
  line-height:1.58;
}

.journey-tags{
  display:flex;
  flex-wrap:wrap;
  gap:7px;

  margin-top:auto;
}

.journey-tags span{
  padding:5px 8px;

  color:var(--text-dark);
  background:rgba(245,236,231,.78);

  border:1px solid var(--border-soft);
  border-radius:var(--radius-pill);

  font-size:clamp(.57rem,.76vw,.67rem);
  font-weight:800;
  line-height:1.3;
}


/*==================================================
PLATFORM STATISTICS
==================================================*/

.platform-statistics-section{
  padding:
    clamp(36px,5vw,58px)
    0;
}

.platform-statistics-grid{
  display:grid;
  grid-template-columns:
    repeat(4,minmax(0,1fr));

  gap:15px;
}

.platform-statistic-card{
  position:relative;

  display:grid;
  min-width:0;
  min-height:190px;
  padding:clamp(19px,2.5vw,27px);
  place-items:center;
  align-content:center;

  text-align:center;

  background:var(--card-blue);
  border:1px solid var(--border-blue);
  border-radius:21px;

  box-shadow:var(--shadow-small);

  transition:
    transform var(--transition-fast),
    box-shadow var(--transition-fast);
}

.platform-statistic-card:nth-child(2){
  background:var(--card-sage);
  border-color:var(--border-sage);
}

.platform-statistic-card:nth-child(3){
  background:var(--card-champagne);
  border-color:#d5c09b;
}

.platform-statistic-card:nth-child(4){
  background:var(--card-rose);
  border-color:#d5b8c0;
}

.platform-statistic-card:hover{
  transform:translateY(-6px);
  box-shadow:var(--shadow-medium);
}

.platform-statistic-icon{
  display:grid;
  width:58px;
  height:58px;
  place-items:center;

  margin-bottom:13px;

  background:var(--surface-cream);
  border:1px solid var(--border-soft);
  border-radius:18px;

  font-size:1.48rem;
}

.platform-statistic-card strong{
  display:block;
  margin-bottom:7px;

  color:var(--text-heading);
  font-size:clamp(1rem,1.6vw,1.23rem);
}

.platform-statistic-card p{
  max-width:230px;
  margin:0;

  color:var(--text-body);
  font-size:clamp(.69rem,.93vw,.81rem);
  line-height:1.5;
}


/*==================================================
FAQ SECTION
==================================================*/

.faq-layout{
  display:grid;
  grid-template-columns:
    minmax(280px,.72fr)
    minmax(0,1.28fr);

  align-items:start;
  gap:clamp(34px,6vw,74px);
}

.faq-introduction{
  position:sticky;
  top:24px;
}

.faq-introduction > h2{
  margin-bottom:15px;
}

.faq-introduction > p{
  margin-bottom:26px;
}

.faq-support-card{
  position:relative;
  isolation:isolate;

  padding:clamp(22px,3vw,30px);

  background:var(--card-champagne);
  border:1px solid #d4bf9b;
  border-radius:22px;

  box-shadow:var(--shadow-medium);
  overflow:hidden;
}

.faq-support-card::before{
  position:absolute;
  z-index:-1;
  top:-60px;
  right:-60px;

  width:145px;
  height:145px;

  content:"";

  background:rgba(167,118,50,.09);
  border-radius:50%;
}

.faq-support-icon{
  display:grid;
  width:55px;
  height:55px;
  place-items:center;

  margin-bottom:15px;

  color:#f6edde;
  background:var(--gold-dark);
  border-radius:17px;

  font-size:1.4rem;
  font-weight:950;
}

.faq-support-card h3{
  margin-bottom:9px;
  font-size:clamp(1.08rem,1.8vw,1.35rem);
}

.faq-support-card p{
  margin-bottom:18px;

  color:var(--text-body);
  font-size:clamp(.75rem,1vw,.87rem);
}

.faq-list{
  display:grid;
  gap:12px;
}

.faq-item{
  min-width:0;
  overflow:hidden;

  background:var(--card-rose);
  border:1px solid #d5b8c0;
  border-radius:17px;

  box-shadow:var(--shadow-small);

  transition:
    border-color var(--transition-fast),
    box-shadow var(--transition-fast),
    transform var(--transition-fast);
}

.faq-item:nth-child(3n + 2){
  background:var(--card-blue);
  border-color:var(--border-blue);
}

.faq-item:nth-child(3n){
  background:var(--card-sage);
  border-color:var(--border-sage);
}

.faq-item:hover{
  transform:translateY(-2px);
  box-shadow:var(--shadow-medium);
}

.faq-item.active{
  border-color:var(--primary);
  box-shadow:var(--shadow-medium);
}

.faq-question{
  display:grid;
  grid-template-columns:
    minmax(0,1fr)
    38px;

  width:100%;
  min-width:0;
  align-items:center;
  gap:15px;

  padding:17px 19px;

  color:var(--text-heading);
  background:none;

  font-size:clamp(.81rem,1.2vw,.96rem);
  font-weight:850;
  line-height:1.4;
  text-align:left;
}

.faq-toggle-icon{
  display:grid;
  width:36px;
  height:36px;
  place-items:center;

  color:#f8eff1;
  background:var(--primary-dark);
  border-radius:12px;

  font-size:1.2rem;
  font-weight:500;
  line-height:1;

  transition:
    transform var(--transition-fast),
    background-color var(--transition-fast);
}

.faq-item.active
.faq-toggle-icon{
  background:var(--secondary-dark);
  transform:rotate(45deg);
}

.faq-answer{
  display:grid;
  grid-template-rows:0fr;

  opacity:0;

  transition:
    grid-template-rows var(--transition-normal),
    opacity var(--transition-normal);
}

.faq-answer > *{
  overflow:hidden;
}

.faq-answer p{
  margin:0;
  padding:
    0
    19px
    0;

  color:var(--text-body);
  font-size:clamp(.74rem,.98vw,.86rem);
  line-height:1.65;

  transition:
    padding var(--transition-normal);
}

.faq-item.active
.faq-answer{
  grid-template-rows:1fr;
  opacity:1;
}

.faq-item.active
.faq-answer p{
  padding:
    0
    19px
    18px;
}


/*==================================================
MEDORBIT MOBILE APP SECTION
==================================================*/

.mobile-app-section{
  isolation:isolate;
}

.mobile-app-section::before{
  position:absolute;
  z-index:-1;
  top:6%;
  right:-120px;

  width:340px;
  height:340px;

  content:"";

  background:
    radial-gradient(
      circle,
      rgba(143,35,65,.12),
      transparent 68%
    );

  border-radius:50%;

  animation:
    medorbit-background-drift 9s ease-in-out infinite;
}

.mobile-app-layout{
  display:grid;
  grid-template-columns:
    minmax(0,1.12fr)
    minmax(300px,.88fr);

  align-items:center;
  gap:clamp(40px,7vw,90px);
}

.mobile-app-content > h2{
  max-width:760px;
  margin-bottom:16px;
}

.mobile-app-content > p{
  max-width:760px;
  margin-bottom:28px;
}

.mobile-app-badge{
  display:inline-flex;

  margin-bottom:13px;
  padding:7px 11px;

  color:#f8eff1;
  background:var(--primary-dark);

  border-radius:var(--radius-pill);

  font-size:.64rem;
  font-weight:900;
  letter-spacing:.13em;

  animation:
    medorbit-notification-pulse 3s ease-in-out infinite;
}

.mobile-app-feature-grid{
  display:grid;
  grid-template-columns:
    repeat(2,minmax(0,1fr));

  gap:14px;
  margin-bottom:28px;
}

.mobile-app-feature{
  display:grid;
  grid-template-columns:49px minmax(0,1fr);
  align-items:start;
  gap:12px;

  min-width:0;
  padding:16px;

  background:var(--card-blue);
  border:1px solid var(--border-blue);
  border-radius:16px;

  transition:
    transform var(--transition-fast),
    box-shadow var(--transition-fast);
}

.mobile-app-feature:nth-child(2){
  background:var(--card-sage);
  border-color:var(--border-sage);
}

.mobile-app-feature:nth-child(3){
  background:var(--card-champagne);
  border-color:#d5c09b;
}

.mobile-app-feature:nth-child(4){
  background:var(--card-rose);
  border-color:#d5b8c0;
}

.mobile-app-feature:hover{
  transform:translateY(-5px);
  box-shadow:var(--shadow-small);
}

.mobile-app-feature > span{
  display:grid;
  width:49px;
  height:49px;
  place-items:center;

  background:var(--surface-cream);
  border:1px solid var(--border-soft);
  border-radius:15px;

  font-size:1.25rem;
}

.mobile-app-feature h3{
  margin-bottom:4px;
  font-size:clamp(.85rem,1.3vw,.98rem);
}

.mobile-app-feature p{
  margin:0;

  color:var(--text-soft);
  font-size:clamp(.68rem,.9vw,.79rem);
  line-height:1.48;
}

.mobile-app-actions{
  display:flex;
  flex-wrap:wrap;
  gap:11px;

  margin-bottom:22px;
}

.app-store-placeholder-row{
  display:flex;
  flex-wrap:wrap;
  gap:11px;
}

.app-store-placeholder{
  display:grid;
  grid-template-columns:35px minmax(0,1fr);
  align-items:center;
  gap:9px;

  min-width:155px;
  padding:10px 13px;

  background:var(--card-lavender);
  border:1px solid #c8bfd6;
  border-radius:13px;
}

.app-store-placeholder > span{
  display:grid;
  width:34px;
  height:34px;
  place-items:center;

  color:#f3ecf7;
  background:var(--lavender);
  border-radius:10px;

  font-size:.9rem;
}

.app-store-placeholder small{
  display:block;

  color:var(--text-soft);
  font-size:.58rem;
  line-height:1.2;
}

.app-store-placeholder strong{
  display:block;

  color:var(--text-heading);
  font-size:.78rem;
  line-height:1.2;
}


/*==================================================
MOBILE PHONE PREVIEW
==================================================*/

.mobile-app-preview{
  position:relative;

  display:grid;
  min-height:610px;
  place-items:center;
}

.mobile-app-preview::before{
  position:absolute;
  inset:8% 5%;

  content:"";

  background:
    linear-gradient(
      145deg,
      #dce7e9,
      #e6e1ed,
      #eee0d5
    );

  border:1px solid #c5cfd1;
  border-radius:48% 52% 45% 55% / 55% 45% 55% 45%;

  animation:
    medorbit-background-drift 10s ease-in-out infinite;
}

.mobile-phone-frame{
  position:relative;
  z-index:2;

  width:min(315px,80%);
  padding:12px;

  background:#1e292d;
  border:5px solid #3c494e;
  border-radius:38px;

  box-shadow:
    0 30px 65px rgba(27,37,41,.28);

  animation:
    medorbit-phone-float 6s ease-in-out infinite;
}

.mobile-phone-speaker{
  width:68px;
  height:6px;
  margin:
    3px
    auto
    9px;

  background:#5e6a6e;
  border-radius:var(--radius-pill);
}

.mobile-phone-screen{
  min-height:530px;
  padding:19px 15px;

  background:
    linear-gradient(
      165deg,
      #f1e5e8,
      #e5ece8,
      #e5eaef
    );

  border-radius:27px;
  overflow:hidden;
}

.app-preview-header{
  display:grid;
  grid-template-columns:40px minmax(0,1fr);
  align-items:center;
  gap:10px;

  margin-bottom:24px;
}

.app-preview-logo{
  display:grid;
  width:40px;
  height:40px;
  place-items:center;

  color:#f8eff1;
  background:var(--primary);

  border-radius:12px;

  font-size:1.1rem;
  font-weight:950;
}

.app-preview-header strong{
  display:block;

  color:var(--primary-dark);
  font-size:.89rem;
}

.app-preview-header small{
  display:block;

  color:var(--text-soft);
  font-size:.58rem;
}

.app-preview-greeting{
  margin-bottom:16px;
}

.app-preview-greeting span{
  display:block;
  margin-bottom:2px;

  color:var(--primary);
  font-size:.62rem;
  font-weight:850;
}

.app-preview-greeting h3{
  margin:0;
  font-size:1.15rem;
}

.app-preview-search{
  display:grid;
  grid-template-columns:27px minmax(0,1fr);
  align-items:center;
  gap:8px;

  margin-bottom:17px;
  padding:10px 11px;

  background:var(--card-blue);
  border:1px solid var(--border-blue);
  border-radius:12px;
}

.app-preview-search span{
  font-size:.85rem;
}

.app-preview-search p{
  margin:0;

  color:var(--text-soft);
  font-size:.62rem;
}

.app-preview-choice-grid{
  display:grid;
  grid-template-columns:
    repeat(2,minmax(0,1fr));

  gap:9px;
  margin-bottom:16px;
}

.app-preview-choice{
  display:grid;
  min-width:0;
  min-height:83px;
  place-items:center;
  align-content:center;
  gap:5px;

  padding:10px;

  background:var(--card-rose);
  border:1px solid #d5b8c0;
  border-radius:13px;

  text-align:center;
}

.app-preview-choice:nth-child(2){
  background:var(--card-sage);
  border-color:var(--border-sage);
}

.app-preview-choice:nth-child(3){
  background:var(--card-champagne);
  border-color:#d5c09b;
}

.app-preview-choice:nth-child(4){
  background:var(--card-blue);
  border-color:var(--border-blue);
}

.app-preview-choice span{
  font-size:1.15rem;
}

.app-preview-choice strong{
  color:var(--text-heading);
  font-size:.64rem;
}

.app-preview-notice{
  display:grid;
  grid-template-columns:35px minmax(0,1fr);
  align-items:center;
  gap:9px;

  margin-bottom:16px;
  padding:11px;

  background:var(--card-lavender);
  border:1px solid #c9bfd7;
  border-radius:13px;
}

.app-preview-notice > span{
  display:grid;
  width:35px;
  height:35px;
  place-items:center;

  color:#f2ebf6;
  background:var(--lavender);
  border-radius:10px;

  font-size:.8rem;
}

.app-preview-notice strong{
  display:block;

  color:var(--text-heading);
  font-size:.65rem;
}

.app-preview-notice p{
  margin:2px 0 0;

  color:var(--text-soft);
  font-size:.55rem;
  line-height:1.35;
}

.app-preview-button{
  width:100%;
  min-height:42px;

  color:#f8eff1;
  background:
    linear-gradient(
      135deg,
      var(--primary),
      var(--primary-dark)
    );

  border-radius:var(--radius-pill);

  font-size:.68rem;
  font-weight:850;
}


/*==================================================
FINAL GUIDANCE SECTION
==================================================*/

.final-guidance-card{
  position:relative;
  isolation:isolate;

  display:grid;
  grid-template-columns:
    minmax(0,.88fr)
    minmax(380px,1.12fr);

  align-items:center;
  gap:clamp(34px,6vw,72px);

  padding:clamp(27px,5vw,50px);

  background:
    linear-gradient(
      135deg,
      #ead8dd,
      #dce8e4,
      #ece0d2
    );

  border:1px solid #cbb9be;
  border-radius:30px;

  box-shadow:var(--shadow-large);
  overflow:hidden;
}

.final-guidance-card::before{
  position:absolute;
  z-index:-1;
  top:-130px;
  left:-100px;

  width:330px;
  height:330px;

  content:"";

  background:rgba(143,35,65,.08);
  border-radius:50%;
}

.final-guidance-card::after{
  position:absolute;
  z-index:-1;
  right:-130px;
  bottom:-150px;

  width:360px;
  height:360px;

  content:"";

  background:rgba(36,92,99,.08);
  border-radius:50%;
}

.final-guidance-content h2{
  margin-bottom:14px;
}

.final-guidance-content > p{
  margin-bottom:20px;
}

.final-guidance-points{
  display:grid;
  grid-template-columns:
    repeat(2,minmax(0,1fr));

  gap:9px;
}

.final-guidance-points span{
  min-width:0;
  padding:9px 11px;

  color:var(--text-dark);
  background:rgba(245,236,231,.75);

  border:1px solid var(--border-soft);
  border-radius:11px;

  font-size:clamp(.65rem,.88vw,.77rem);
  font-weight:800;
}

.final-guidance-form{
  display:grid;
  gap:15px;

  min-width:0;
  padding:clamp(20px,3vw,29px);

  background:var(--card-rose);
  border:1px solid #d5b8c0;
  border-radius:22px;

  box-shadow:var(--shadow-medium);
}

.final-form-grid{
  display:grid;
  grid-template-columns:
    repeat(2,minmax(0,1fr));

  gap:14px;
}


/*==================================================
IMPORTANT NOTICE
==================================================*/

.important-notice-section{
  padding:
    clamp(34px,5vw,56px)
    0;
}

.important-notice-card{
  display:grid;
  grid-template-columns:58px minmax(0,1fr);
  align-items:start;
  gap:16px;

  padding:clamp(20px,3vw,29px);

  background:var(--card-champagne);
  border:1px solid #d3bd98;
  border-radius:21px;

  box-shadow:var(--shadow-small);
}

.important-notice-icon{
  display:grid;
  width:58px;
  height:58px;
  place-items:center;

  color:#f6edde;
  background:var(--gold-dark);
  border-radius:18px;

  font-size:1.35rem;
  font-weight:900;
}

.important-notice-card h2{
  margin-bottom:7px;
  font-size:clamp(1.1rem,1.9vw,1.45rem);
}

.important-notice-card p{
  margin:0;

  color:var(--text-dark);
  font-size:clamp(.75rem,1vw,.87rem);
  line-height:1.64;
}


/*==================================================
LEGAL DISCLAIMER
==================================================*/

.legal-disclaimer-section{
  padding:
    clamp(40px,6vw,68px)
    0;
}

.legal-disclaimer-content{
  padding:clamp(22px,4vw,38px);

  background:var(--card-sage);
  border:1px solid var(--border-sage);
  border-radius:23px;

  box-shadow:var(--shadow-small);
}

.legal-disclaimer-content h2{
  margin-bottom:14px;
  font-size:clamp(1.15rem,2vw,1.55rem);
}

.legal-disclaimer-content p{
  margin-bottom:12px;

  color:var(--text-body);
  font-size:clamp(.72rem,.95vw,.84rem);
  line-height:1.65;
}

.legal-disclaimer-content p:last-child{
  margin-bottom:0;
}


/*==================================================
PREMIUM FOOTER
==================================================*/

.site-footer{
  position:relative;
  isolation:isolate;

  width:100%;
  max-width:100%;

  color:#eadde1;
  background:
    linear-gradient(
      150deg,
      #421322,
      #2e2027,
      #17373b
    );

  overflow:hidden;
}

.site-footer::before{
  position:absolute;
  z-index:-1;
  top:-180px;
  right:-150px;

  width:430px;
  height:430px;

  content:"";

  background:
    radial-gradient(
      circle,
      rgba(211,168,180,.18),
      transparent 66%
    );

  border-radius:50%;

  animation:
    medorbit-footer-glow 7s ease-in-out infinite;
}

.site-footer::after{
  position:absolute;
  z-index:-1;
  bottom:-220px;
  left:-170px;

  width:480px;
  height:480px;

  content:"";

  background:
    radial-gradient(
      circle,
      rgba(144,188,193,.16),
      transparent 68%
    );

  border-radius:50%;

  animation:
    medorbit-footer-glow 8s ease-in-out infinite;
}

.footer-top-section{
  padding:
    clamp(38px,6vw,66px)
    0;

  background:rgba(38,25,31,.34);
  border-bottom:1px solid rgba(229,205,212,.14);
}

.footer-top-layout{
  display:grid;
  grid-template-columns:
    minmax(0,1.08fr)
    minmax(320px,.92fr);

  align-items:center;
  gap:clamp(30px,6vw,80px);
}

.footer-brand-logo{
  margin-bottom:17px;
}

.footer-brand-logo
.brand-logo-mark{
  color:#f8eff1;
  background:
    linear-gradient(
      145deg,
      #a52f51,
      #6d1832
    );

  border-color:#c27a8f;
}

.footer-brand-logo
.brand-logo-content strong{
  color:#f8eff1;
}

.footer-brand-logo
.brand-logo-content small{
  color:#d6c5ca;
}

.footer-brand-column > p{
  max-width:650px;
  margin-bottom:17px;

  color:#d6c8cc;
  font-size:clamp(.76rem,1vw,.9rem);
}

.footer-service-badges{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}

.footer-service-badges span{
  padding:6px 10px;

  color:#e8dce0;
  background:rgba(239,224,228,.09);

  border:1px solid rgba(235,211,218,.18);
  border-radius:var(--radius-pill);

  font-size:clamp(.61rem,.82vw,.72rem);
  font-weight:800;
}

.footer-newsletter-column{
  min-width:0;
  padding:clamp(20px,3vw,29px);

  background:rgba(232,219,223,.08);
  border:1px solid rgba(235,211,218,.17);
  border-radius:20px;

  box-shadow:
    0 18px 40px rgba(0,0,0,.16);
}

.footer-column-label{
  display:block;
  margin-bottom:7px;

  color:#d8a8b6;
  font-size:.64rem;
  font-weight:900;
  letter-spacing:.14em;
}

.footer-newsletter-column h3{
  margin-bottom:8px;

  color:#f8eff1;
  font-size:clamp(1.05rem,1.8vw,1.38rem);
}

.footer-newsletter-column p{
  margin-bottom:14px;

  color:#d4c5ca;
  font-size:clamp(.7rem,.94vw,.82rem);
}

.footer-update-form{
  display:grid;
  grid-template-columns:
    minmax(0,1fr)
    48px;

  gap:8px;
}

.footer-update-form input{
  width:100%;
  min-width:0;
  min-height:46px;
  padding:11px 13px;

  color:#f6ecef;
  background:rgba(241,227,231,.1);

  border:1px solid rgba(233,209,216,.19);
  border-radius:12px;
  outline:none;
}

.footer-update-form input::placeholder{
  color:#bcaeb2;
}

.footer-update-form input:focus{
  border-color:#d39bab;
  box-shadow:
    0 0 0 3px rgba(211,155,171,.13);
}

.footer-update-form button{
  display:grid;
  width:48px;
  min-height:46px;
  place-items:center;

  color:#f8eff1;
  background:var(--primary);

  border-radius:12px;

  font-size:1.1rem;

  transition:
    transform var(--transition-fast),
    background-color var(--transition-fast);
}

.footer-update-form button:hover{
  background:#a52f51;
  transform:translateX(3px);
}


/*==================================================
FOOTER MAIN ROW
==================================================*/

.footer-main-section{
  padding:
    clamp(42px,6vw,72px)
    0;
}

.footer-main-grid{
  display:grid;
  grid-template-columns:
    .9fr
    .9fr
    1.35fr
    .78fr;

  align-items:start;
  gap:clamp(24px,4vw,50px);
}

.footer-link-column{
  display:flex;
  min-width:0;
  flex-direction:column;
  gap:9px;
}

.footer-link-column h3{
  position:relative;

  margin-bottom:9px;
  padding-bottom:10px;

  color:#f6ecef;
  font-size:clamp(.88rem,1.3vw,1.02rem);
}

.footer-link-column h3::after{
  position:absolute;
  bottom:0;
  left:0;

  width:34px;
  height:2px;

  content:"";
  border-radius:var(--radius-pill);
  background:#c6748c;
}

.footer-link-column > a{
  display:inline-flex;
  align-self:flex-start;

  color:#cfc1c5;
  font-size:clamp(.68rem,.92vw,.8rem);
  font-weight:650;
  line-height:1.45;

  transition:
    color var(--transition-fast),
    transform var(--transition-fast);
}

.footer-link-column > a:hover{
  color:#f1dce2;
  transform:translateX(4px);
}


/*==================================================
FOOTER 2×3 CATALOG
==================================================*/

.footer-catalog-grid{
  display:grid;
  grid-template-columns:
    repeat(2,minmax(0,1fr));

  gap:9px;
}

.footer-catalog-grid a{
  display:grid;
  grid-template-columns:31px minmax(0,1fr);
  align-items:center;
  gap:8px;

  min-width:0;
  min-height:49px;
  padding:8px 9px;

  color:#e2d4d8;
  background:rgba(238,222,227,.08);

  border:1px solid rgba(230,207,213,.14);
  border-radius:12px;

  font-size:clamp(.61rem,.82vw,.72rem);
  font-weight:750;
  line-height:1.3;

  transition:
    transform var(--transition-fast),
    background-color var(--transition-fast),
    border-color var(--transition-fast);
}

.footer-catalog-grid a:hover{
  color:#f7edf0;
  background:rgba(238,222,227,.14);
  border-color:rgba(222,177,190,.3);

  transform:translateY(-3px);
}

.footer-catalog-grid a span{
  display:grid;
  width:31px;
  height:31px;
  place-items:center;

  background:rgba(238,222,227,.1);
  border-radius:9px;

  font-size:.85rem;

  animation:
    medorbit-icon-breathe 4.8s ease-in-out infinite;
}


/*==================================================
FOOTER BOTTOM
==================================================*/

.footer-bottom-section{
  padding:
    17px
    0
    calc(17px + env(safe-area-inset-bottom));

  background:rgba(12,19,21,.28);
  border-top:1px solid rgba(235,211,218,.12);
}

.footer-bottom-wrapper{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
}

.footer-bottom-wrapper p{
  margin:0;

  color:#bdaeb3;
  font-size:clamp(.62rem,.84vw,.73rem);
  font-weight:650;
}


/*==================================================
MOBILE QUICK ACTIONS
==================================================*/

.mobile-quick-actions{
  position:fixed;
  z-index:500;
  right:10px;
  bottom:
    calc(
      10px +
      env(safe-area-inset-bottom)
    );
  left:10px;

  display:none;
  grid-template-columns:
    repeat(5,minmax(0,1fr));

  align-items:end;
  gap:5px;

  min-height:64px;
  padding:7px;

  background:rgba(238,227,229,.96);
  border:1px solid #cfbbc0;
  border-radius:19px;

  box-shadow:
    0 18px 48px rgba(40,24,30,.25);

  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
}

.mobile-quick-actions a{
  display:flex;
  min-width:0;
  min-height:50px;
  padding:5px 2px;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:2px;

  color:var(--text-dark);
  background:var(--card-rose);

  border:1px solid transparent;
  border-radius:12px;

  font-size:.75rem;
}

.mobile-quick-actions a span{
  font-size:1rem;
  line-height:1;
}

.mobile-quick-actions a small{
  max-width:100%;

  font-size:.53rem;
  font-weight:800;
  line-height:1.2;
  text-align:center;
}

.mobile-quick-action-main{
  position:relative;
  top:-15px;

  color:#f8eff1 !important;
  background:
    linear-gradient(
      145deg,
      var(--primary),
      var(--primary-dark)
    ) !important;

  border:4px solid #eadde1 !important;
  border-radius:50% !important;

  box-shadow:
    0 10px 24px rgba(143,35,65,.34);
}

.mobile-quick-action-main span{
  font-size:1.35rem !important;
  font-weight:600;
}


/*==================================================
SECTION CONTENT PROTECTION
==================================================*/

.journey-card,
.platform-statistic-card,
.faq-item,
.faq-support-card,
.mobile-app-feature,
.mobile-phone-frame,
.final-guidance-card,
.final-guidance-form,
.important-notice-card,
.legal-disclaimer-content,
.footer-newsletter-column,
.footer-catalog-grid a{
  contain:layout paint;
}

.journey-card *,
.platform-statistic-card *,
.faq-item *,
.faq-support-card *,
.mobile-app-feature *,
.mobile-phone-frame *,
.final-guidance-card *,
.final-guidance-form *,
.important-notice-card *,
.legal-disclaimer-content *,
.footer-newsletter-column *,
.footer-catalog-grid a *{
  max-width:100%;
}


/*==================================================
LARGE TABLET
==================================================*/

@media (max-width:1100px){

  .journey-card-grid{
    grid-template-columns:
      repeat(2,minmax(0,1fr));
  }

  .platform-statistics-grid{
    grid-template-columns:
      repeat(2,minmax(0,1fr));
  }

  .footer-main-grid{
    grid-template-columns:
      repeat(2,minmax(0,1fr));

    gap:35px;
  }

  .footer-catalog-column{
    grid-column:auto;
  }

}


/*==================================================
TABLET
==================================================*/

@media (max-width:950px){

  .faq-layout,
  .mobile-app-layout,
  .final-guidance-card,
  .footer-top-layout{
    grid-template-columns:1fr;
  }

  .faq-introduction{
    position:relative;
    top:auto;
  }

  .faq-support-card{
    width:min(680px,100%);
  }

  .mobile-app-preview{
    width:min(650px,100%);
    min-height:590px;
    margin-inline:auto;
  }

  .mobile-phone-frame{
    width:min(315px,70%);
  }

  .final-guidance-content{
    width:min(780px,100%);
  }

  .final-guidance-form{
    width:min(800px,100%);
  }

  .footer-newsletter-column{
    width:min(650px,100%);
  }

}


/*==================================================
SMALL TABLET
==================================================*/

@media (max-width:760px){

  .journey-card-grid,
  .platform-statistics-grid{
    grid-template-columns:
      repeat(2,minmax(0,1fr));

    gap:12px;
  }

  .mobile-app-feature-grid{
    grid-template-columns:
      repeat(2,minmax(0,1fr));
  }

  .footer-main-grid{
    grid-template-columns:
      repeat(2,minmax(0,1fr));

    gap:28px 20px;
  }

  .footer-bottom-wrapper{
    flex-direction:column;
    align-items:flex-start;
    gap:4px;
  }

}


/*==================================================
MOBILE
==================================================*/

@media (max-width:640px){

  body{
    padding-bottom:
      calc(
        82px +
        env(safe-area-inset-bottom)
      );
  }

  .journey-card-grid,
  .platform-statistics-grid{
    grid-template-columns:
      repeat(2,minmax(0,1fr));

    gap:10px;
  }

  .journey-card,
  .platform-statistic-card{
    padding:15px;
    border-radius:16px;
  }

  .journey-card-top{
    grid-template-columns:44px minmax(0,1fr);
    gap:9px;
    margin-bottom:12px;
  }

  .journey-avatar,
  .platform-statistic-icon{
    width:44px;
    height:44px;

    border-radius:13px;
    font-size:1.1rem;
  }

  .journey-card h3,
  .platform-statistic-card strong{
    font-size:clamp(.8rem,3.4vw,.96rem);
  }

  .journey-card > p,
  .platform-statistic-card p{
    font-size:clamp(.63rem,2.55vw,.74rem);
    line-height:1.45;
  }

  .journey-tags{
    gap:5px;
  }

  .journey-tags span{
    padding:4px 6px;
    font-size:.5rem;
  }

  .platform-statistic-card{
    min-height:155px;
  }

  .faq-question{
    grid-template-columns:
      minmax(0,1fr)
      33px;

    gap:10px;
    padding:15px;
  }

  .faq-toggle-icon{
    width:32px;
    height:32px;
    border-radius:10px;
  }

  .faq-answer p{
    padding:
      0
      15px
      0;
  }

  .faq-item.active
  .faq-answer p{
    padding:
      0
      15px
      16px;
  }

  .mobile-app-feature-grid{
    grid-template-columns:1fr;
  }

  .mobile-app-preview{
    min-height:550px;
  }

  .mobile-phone-frame{
    width:min(290px,83%);
  }

  .mobile-phone-screen{
    min-height:500px;
  }

  .mobile-app-actions{
    display:grid;
    grid-template-columns:
      repeat(2,minmax(0,1fr));
  }

  .mobile-app-actions .button{
    width:100%;
    padding:11px 10px;
    font-size:.72rem;
  }

  .app-store-placeholder-row{
    display:grid;
    grid-template-columns:
      repeat(2,minmax(0,1fr));
  }

  .app-store-placeholder{
    min-width:0;
  }

  .final-guidance-card{
    padding:22px 17px;
    border-radius:23px;
  }

  .final-guidance-points{
    grid-template-columns:
      repeat(2,minmax(0,1fr));

    gap:7px;
  }

  .final-guidance-points span{
    padding:8px;
    font-size:.61rem;
  }

  .final-form-grid{
    grid-template-columns:1fr;
  }

  .important-notice-card{
    grid-template-columns:46px minmax(0,1fr);
    gap:11px;
    padding:16px;
  }

  .important-notice-icon{
    width:46px;
    height:46px;
    border-radius:14px;
    font-size:1.05rem;
  }

  .legal-disclaimer-content{
    padding:18px;
    border-radius:18px;
  }

  .footer-top-section{
    padding:
      38px
      0;
  }

  .footer-main-section{
    padding:
      40px
      0;
  }

  .footer-main-grid{
    grid-template-columns:
      repeat(2,minmax(0,1fr));

    gap:28px 16px;
  }

  .footer-link-column h3{
    font-size:.84rem;
  }

  .footer-link-column > a{
    font-size:.65rem;
  }

  .footer-catalog-grid{
    grid-template-columns:
      repeat(2,minmax(0,1fr));

    gap:7px;
  }

  .footer-catalog-grid a{
    grid-template-columns:27px minmax(0,1fr);
    gap:6px;

    min-height:44px;
    padding:7px;

    font-size:.57rem;
  }

  .footer-catalog-grid a span{
    width:27px;
    height:27px;

    border-radius:8px;
    font-size:.72rem;
  }

  .mobile-quick-actions{
    display:grid;
  }

}


/*==================================================
VERY SMALL MOBILE
==================================================*/

@media (max-width:390px){

  .journey-card-grid,
  .platform-statistics-grid{
    grid-template-columns:1fr;
  }

  .journey-card,
  .platform-statistic-card{
    padding:17px;
  }

  .platform-statistic-card{
    min-height:150px;
  }

  .mobile-app-actions,
  .app-store-placeholder-row,
  .final-guidance-points{
    grid-template-columns:1fr;
  }

  .mobile-phone-frame{
    width:min(280px,90%);
  }

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

  .footer-catalog-grid{
    grid-template-columns:
      repeat(2,minmax(0,1fr));
  }

  .footer-link-column{
    padding-bottom:18px;
    border-bottom:1px solid rgba(235,211,218,.12);
  }

  .footer-link-column:last-child{
    border-bottom:0;
  }

}


/*==================================================
EXTREME SMALL SCREEN PROTECTION
==================================================*/

@media (max-width:330px){

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

  .mobile-quick-actions{
    right:5px;
    left:5px;
    gap:3px;
    padding:5px;
  }

  .mobile-quick-actions a small{
    font-size:.48rem;
  }

}


/*==================================================
END OF STYLE.CSS PART 4

Next:
STYLE.CSS PART 5
Global final responsive corrections
Header mobile menu
Hero mobile layout
All remaining cross-device protection
==================================================*/

/*==================================================
MEDORBIT GLOBAL WEBSITE CSS
PART 5 -- FINAL RESPONSIVE FOUNDATION

Mobile navigation
Hero responsive layout
Global grid protection
Landscape devices
Forms and tables
Overflow prevention
Cross-device corrections
==================================================*/


/*==================================================
FINAL GLOBAL SAFETY
==================================================*/

html,
body{
  min-width:0;
  max-width:100%;
}

body{
  position:relative;
}

main,
.site-header,
.site-footer,
.top-information-bar{
  width:100%;
  max-width:100%;
}

section,
.container,
.header-wrapper,
.hero-layout,
.footer-main-grid,
.footer-top-layout{
  min-width:0;
}

.container{
  padding-left:0;
  padding-right:0;
}

section > .container{
  position:relative;
  z-index:2;
}

img,
video,
iframe,
object,
embed{
  max-width:100%;
}

iframe{
  border:0;
}

pre,
code{
  max-width:100%;
}

pre{
  overflow-x:auto;
  white-space:pre-wrap;
}

table{
  width:100%;
  max-width:100%;
  border-collapse:collapse;
}

.table-wrapper,
.responsive-table,
.data-table-wrapper{
  width:100%;
  max-width:100%;
  overflow-x:auto;

  background:var(--card-blue);
  border:1px solid var(--border-blue);
  border-radius:16px;

  -webkit-overflow-scrolling:touch;
}

table th,
table td{
  min-width:120px;
  padding:12px 14px;

  color:var(--text-dark);
  border:1px solid #c9d4d7;

  font-size:clamp(.7rem,.95vw,.84rem);
  line-height:1.5;
  text-align:left;
  vertical-align:top;
}

table th{
  color:var(--secondary-dark);
  background:var(--secondary-soft);
  font-weight:850;
}

table td{
  background:var(--surface-blue);
}


/*==================================================
UNIVERSAL CONTENT WRAPPING
==================================================*/

h1,
h2,
h3,
h4,
h5,
h6,
p,
li,
a,
span,
strong,
small,
label,
button{
  max-width:100%;
}

h1,
h2,
h3,
h4,
h5,
h6{
  overflow-wrap:break-word;
}

p,
li,
label{
  overflow-wrap:anywhere;
}

a,
button,
span,
strong,
small{
  word-break:normal;
  overflow-wrap:break-word;
}

input,
select,
textarea{
  min-width:0;
}

input[type="file"]{
  width:100%;
  padding:10px;

  color:var(--text-dark);
  background:var(--surface-cream);

  border:1px solid var(--border-soft);
  border-radius:12px;
}

input[type="file"]::file-selector-button{
  margin-right:10px;
  padding:8px 12px;

  color:var(--text-light);
  background:var(--primary);

  border:0;
  border-radius:9px;

  font-weight:750;
}


/*==================================================
GLOBAL CARD HEIGHT AND BUTTON ALIGNMENT
==================================================*/

.popular-course-card,
.institution-category-card,
.destination-card,
.admission-process-card,
.job-sector-card,
.latest-job-card,
.why-choose-card,
.journey-card,
.catalog-card,
.course-card,
.college-card,
.university-card,
.country-card,
.service-card{
  min-height:100%;
}

.popular-course-card > a,
.institution-category-card > a,
.destination-card > a,
.latest-job-card > a,
.catalog-card > a,
.course-card > a,
.college-card > a,
.university-card > a,
.country-card > a,
.service-card > a{
  margin-top:auto;
}


/*==================================================
GLOBAL SECTION DIVIDERS
==================================================*/

section + section{
  border-top:1px solid rgba(92,70,76,.08);
}

.hero-section + .trust-strip-section{
  border-top:0;
}


/*==================================================
HEADER LARGE DEVICE CONTROL
==================================================*/

@media (min-width:1201px){

  .header-wrapper{
    gap:32px;
  }

  .main-navigation{
    flex-wrap:nowrap;
  }

  .navigation-dropdown-menu{
    max-height:70vh;
    overflow-y:auto;
  }

}


/*==================================================
HEADER TABLET AND MOBILE MENU
==================================================*/

@media (max-width:1024px){

  :root{
    --header-height:70px;
  }

  .top-information-wrapper{
    gap:12px;
  }

  .top-information-links{
    gap:13px;
  }

  .header-wrapper{
    position:relative;
    min-height:var(--header-height);
  }

  .menu-toggle{
    position:relative;
    z-index:104;

    display:block;
  }

  .main-navigation{
    position:absolute;
    z-index:103;
    top:calc(100% + 10px);
    right:0;
    left:0;

    display:flex;
    max-height:0;
    padding:0 14px;
    flex-direction:column;
    align-items:stretch;
    gap:5px;

    visibility:hidden;
    opacity:0;
    overflow:hidden;

    background:#eee1e4;
    border:1px solid #d2bdc3;
    border-radius:18px;

    box-shadow:var(--shadow-large);

    transform:translateY(-8px);

    transition:
      max-height .45s ease,
      padding .35s ease,
      opacity .25s ease,
      visibility .25s ease,
      transform .25s ease;
  }

  .main-navigation.active{
    max-height:calc(100vh - 125px);
    padding:14px;

    visibility:visible;
    opacity:1;
    overflow-y:auto;

    transform:translateY(0);
  }

  .main-navigation > a,
  .navigation-dropdown-button{
    width:100%;
    min-height:45px;
    padding:11px 13px;

    color:var(--text-dark);
    background:var(--surface-rose);

    border:1px solid #d7c3c8;
    border-radius:11px;

    font-size:.84rem;
    text-align:left;
  }

  .main-navigation > a:not(.navigation-cta)::after,
  .navigation-dropdown-button::after{
    display:none;
  }

  .main-navigation > a:hover,
  .main-navigation > a.active,
  .navigation-dropdown-button:hover{
    color:var(--primary-dark);
    background:var(--card-rose);
  }

  .navigation-cta{
    display:flex;
    justify-content:center;

    min-height:47px;
    margin-top:5px;
    padding:12px 15px !important;

    color:var(--text-light) !important;
    text-align:center;
  }

  .navigation-dropdown{
    width:100%;
  }

  .navigation-dropdown-button{
    display:flex;
    align-items:center;
    justify-content:space-between;
  }

  .navigation-dropdown:hover
  .navigation-dropdown-button span{
    transform:none;
  }

  .navigation-dropdown.active
  .navigation-dropdown-button span{
    transform:rotate(180deg);
  }

  .navigation-dropdown-menu{
    position:relative;
    top:auto;
    left:auto;

    display:grid;
    width:100%;
    max-height:0;
    margin-top:0;
    padding:0;
    gap:4px;

    visibility:hidden;
    opacity:0;
    overflow:hidden;

    background:var(--surface-blue);
    border:0;
    border-radius:12px;

    box-shadow:none;

    transform:none;

    transition:
      max-height .35s ease,
      padding .3s ease,
      margin .3s ease,
      opacity .25s ease,
      visibility .25s ease;
  }

  .navigation-dropdown:hover
  .navigation-dropdown-menu{
    visibility:hidden;
    opacity:0;
  }

  .navigation-dropdown.active
  .navigation-dropdown-menu{
    max-height:430px;
    margin-top:6px;
    padding:7px;

    visibility:visible;
    opacity:1;
  }

  .navigation-dropdown-menu::before{
    display:none;
  }

  .navigation-dropdown-menu a{
    padding:10px 11px;

    background:var(--card-blue);
    border:1px solid var(--border-blue);

    font-size:.78rem;
  }

}


/*==================================================
TOP INFORMATION BAR RESPONSIVE
==================================================*/

@media (max-width:820px){

  .top-information-bar{
    min-height:32px;
  }

  .top-information-wrapper{
    min-height:32px;
    justify-content:center;
  }

  .top-information-wrapper p{
    font-size:.66rem;
    text-align:center;
  }

  .top-information-links{
    display:none;
  }

}


/*==================================================
HERO LARGE TABLET
==================================================*/

@media (max-width:1120px){

  .hero-layout{
    grid-template-columns:
      minmax(0,1.05fr)
      minmax(320px,.95fr);

    gap:38px;
  }

  .hero-content h1{
    font-size:clamp(2.55rem,5vw,4.25rem);
  }

  .hero-mini-statistics{
    width:100%;
  }

}


/*==================================================
HERO TABLET STACK
==================================================*/

@media (max-width:900px){

  .hero-section{
    min-height:auto;
  }

  .hero-layout{
    grid-template-columns:1fr;
  }

  .hero-content{
    text-align:center;
  }

  .hero-badge{
    justify-content:center;
  }

  .hero-content h1,
  .hero-description{
    margin-right:auto;
    margin-left:auto;
  }

  .hero-actions,
  .hero-trust-list{
    justify-content:center;
  }

  .hero-mini-statistics{
    width:min(680px,100%);
    margin-inline:auto;
  }

  .hero-guidance-card{
    max-width:720px;
    justify-self:center;
  }

  .guidance-form{
    grid-template-columns:
      repeat(2,minmax(0,1fr));
  }

  .education-overview-layout{
    grid-template-columns:1fr;
  }

  .education-overview-visual{
    width:min(680px,100%);
    min-height:520px;
    margin-inline:auto;
  }

  .study-india-layout{
    grid-template-columns:1fr;
  }

  .study-india-information-card{
    width:min(720px,100%);
    margin-inline:auto;
  }

}


/*==================================================
GENERAL TABLET GRID SYSTEM
==================================================*/

@media (max-width:900px){

  .trust-strip-grid{
    grid-template-columns:
      repeat(2,minmax(0,1fr));
  }

  .pathway-grid{
    grid-template-columns:1fr;
  }

  .pathway-card{
    width:min(850px,100%);
    margin-inline:auto;
  }

  .education-service-list{
    grid-template-columns:
      repeat(2,minmax(0,1fr));
  }

  .study-india-highlight-grid{
    grid-template-columns:
      repeat(2,minmax(0,1fr));
  }

}


/*==================================================
MOBILE GLOBAL LAYOUT
==================================================*/

@media (max-width:640px){

  :root{
    --section-space:64px;
    --header-height:64px;
  }

  html{
    scroll-padding-top:72px;
  }

  .container{
    width:calc(100% - 24px);
  }

  section{
    padding:
      clamp(54px,14vw,72px)
      0;
  }

  .section-heading{
    margin-bottom:30px;
  }

  .section-heading h2{
    font-size:clamp(1.72rem,7.3vw,2.35rem);
  }

  .section-heading p{
    font-size:.88rem;
  }

  .section-kicker,
  .section-label{
    font-size:.64rem;
    letter-spacing:.12em;
  }

  .section-kicker::before{
    width:18px;
  }

  .button{
    min-height:46px;
    padding:11px 15px;

    font-size:.78rem;
  }

  .header-wrapper{
    gap:12px;
  }

  .brand-logo{
    gap:8px;
  }

  .brand-logo-mark{
    width:40px;
    height:40px;
    flex-basis:40px;

    border-radius:12px;

    font-size:1.15rem;
  }

  .brand-logo-content strong{
    font-size:1.05rem;
  }

  .brand-logo-content small{
    max-width:180px;
    font-size:.56rem;
  }

  .menu-toggle{
    width:42px;
    height:42px;
    flex-basis:42px;
  }

  .main-navigation{
    top:calc(100% + 7px);
  }

}


/*==================================================
HERO MOBILE
==================================================*/

@media (max-width:640px){

  .hero-section{
    padding:
      48px
      0
      64px;
  }

  .hero-section::before{
    background:
      radial-gradient(
        circle at 12% 12%,
        rgba(143,35,65,.12),
        transparent 33%
      ),
      radial-gradient(
        circle at 90% 32%,
        rgba(36,92,99,.12),
        transparent 31%
      ),
      linear-gradient(
        145deg,
        #f1e2e6,
        #eee5d7,
        #e2ece8
      );
  }

  .hero-layout{
    gap:32px;
  }

  .hero-badge{
    margin-bottom:15px;
    padding:7px 10px;

    font-size:.67rem;
  }

  .hero-content h1{
    margin-bottom:16px;

    font-size:clamp(2rem,10vw,3rem);
    line-height:1.12;
  }

  .hero-description{
    margin-bottom:22px;

    font-size:.92rem;
    line-height:1.65;
  }

  .hero-actions{
    display:grid;
    grid-template-columns:
      repeat(2,minmax(0,1fr));

    width:100%;
    gap:9px;
  }

  .hero-actions .button{
    width:100%;
    min-width:0;
    padding:11px 9px;

    font-size:.72rem;
  }

  .hero-trust-list{
    display:grid;
    grid-template-columns:
      repeat(2,minmax(0,1fr));

    width:100%;
    gap:9px;
  }

  .hero-trust-item{
    justify-content:flex-start;
    min-width:0;

    padding:8px 9px;

    background:rgba(238,226,229,.74);
    border:1px solid #d7c3c8;
    border-radius:11px;

    font-size:.68rem;
  }

  .hero-mini-statistics{
    grid-template-columns:
      repeat(3,minmax(0,1fr));

    border-radius:15px;
  }

  .hero-mini-statistic{
    padding:11px 8px;
    text-align:center;
  }

  .hero-mini-statistic strong{
    font-size:.72rem;
  }

  .hero-mini-statistic span{
    font-size:.57rem;
  }

  .hero-guidance-card{
    padding:20px 16px;
    border-radius:22px;
  }

  .guidance-card-header{
    margin-bottom:18px;
    text-align:left;
  }

  .guidance-card-header h2{
    font-size:1.55rem;
  }

  .guidance-card-header p{
    font-size:.82rem;
  }

  .guidance-form{
    grid-template-columns:1fr;
    gap:13px;
  }

  .guidance-form .form-field,
  .guidance-form .form-consent,
  .guidance-form .button,
  .guidance-form .form-security-note{
    grid-column:1;
  }

}


/*==================================================
TRUST STRIP MOBILE
==================================================*/

@media (max-width:640px){

  .trust-strip-section{
    padding:
      30px
      0;
  }

  .trust-strip-grid{
    grid-template-columns:
      repeat(2,minmax(0,1fr));

    gap:9px;
  }

  .trust-strip-card{
    grid-template-columns:39px minmax(0,1fr);
    gap:9px;

    padding:11px;

    border-radius:13px;
  }

  .trust-strip-icon{
    width:39px;
    height:39px;

    border-radius:11px;
    font-size:1rem;
  }

  .trust-strip-card strong{
    font-size:.69rem;
  }

  .trust-strip-card p{
    font-size:.57rem;
  }

}


/*==================================================
PATHWAY MOBILE
==================================================*/

@media (max-width:640px){

  .pathway-grid{
    gap:16px;
  }

  .pathway-card{
    padding:20px 16px;
    border-radius:22px;
  }

  .pathway-card-top{
    margin-bottom:16px;
  }

  .pathway-card-icon{
    width:49px;
    height:49px;
    flex-basis:49px;

    border-radius:15px;
    font-size:1.35rem;
  }

  .pathway-card-badge{
    max-width:65%;
    padding:6px 8px;

    font-size:.55rem;
    letter-spacing:.07em;
  }

  .pathway-card h3{
    font-size:1.42rem;
  }

  .pathway-card > p{
    margin-bottom:18px;
    font-size:.84rem;
  }

  .pathway-feature-grid{
    grid-template-columns:
      repeat(2,minmax(0,1fr));

    gap:9px;
  }

  .pathway-feature-item{
    grid-template-columns:18px minmax(0,1fr);
    gap:6px;

    font-size:.65rem;
  }

  .pathway-feature-item span{
    width:18px;
    height:18px;

    font-size:.58rem;
  }

  .pathway-card-actions{
    display:grid;
    grid-template-columns:
      repeat(2,minmax(0,1fr));

    width:100%;
    gap:8px;
  }

  .pathway-card-actions .button{
    width:100%;
    padding:10px 8px;

    font-size:.69rem;
  }

}


/*==================================================
EDUCATION OVERVIEW MOBILE
==================================================*/

@media (max-width:640px){

  .education-overview-layout{
    gap:32px;
  }

  .education-overview-visual{
    min-height:470px;
  }

  .education-overview-visual::before{
    inset:9% 5%;
    border-radius:27px;
  }

  .education-visual-main-card{
    width:82%;
    padding:24px 20px;
    border-radius:23px;
  }

  .education-visual-main-card h3{
    font-size:1.5rem;
  }

  .education-visual-main-card p{
    font-size:.79rem;
  }

  .education-floating-card{
    width:min(185px,55%);
    grid-template-columns:38px minmax(0,1fr);
    gap:8px;

    padding:9px;
  }

  .education-floating-card > span{
    width:38px;
    height:38px;

    font-size:1rem;
  }

  .education-floating-card strong{
    font-size:.67rem;
  }

  .education-floating-card small{
    font-size:.54rem;
  }

  .education-floating-card-one{
    top:3%;
  }

  .education-floating-card-two{
    top:24%;
  }

  .education-floating-card-three{
    bottom:2%;
  }

  .education-service-list{
    grid-template-columns:1fr;
  }

  .education-service-item{
    grid-template-columns:42px minmax(0,1fr);
    padding:13px;
  }

  .education-service-number{
    width:42px;
    height:42px;

    border-radius:12px;
  }

}


/*==================================================
STUDY INDIA MOBILE
==================================================*/

@media (max-width:640px){

  .study-india-highlight-grid{
    grid-template-columns:
      repeat(2,minmax(0,1fr));

    gap:10px;
  }

  .study-india-highlight-card{
    padding:15px;
    border-radius:16px;
  }

  .highlight-card-icon{
    width:44px;
    height:44px;

    margin-bottom:12px;

    border-radius:13px;
    font-size:1.13rem;
  }

  .study-india-highlight-card h3{
    font-size:.86rem;
  }

  .study-india-highlight-card p{
    font-size:.66rem;
    line-height:1.45;
  }

  .study-india-highlight-card a{
    font-size:.62rem;
  }

  .study-india-information-card{
    padding:20px 16px;
    border-radius:20px;
  }

  .information-checklist{
    gap:10px;
  }

  .information-checklist li{
    font-size:.7rem;
  }

}


/*==================================================
FORM MOBILE SAFETY
==================================================*/

@media (max-width:640px){

  .form-field label{
    font-size:.74rem;
  }

  .form-field input,
  .form-field select,
  .form-field textarea{
    min-height:47px;
    padding:11px 12px;

    border-radius:11px;
  }

  .form-field textarea{
    min-height:105px;
  }

  .form-consent{
    grid-template-columns:18px minmax(0,1fr);
    gap:8px;
  }

  .form-consent input{
    width:16px;
    height:16px;
  }

  .form-consent label{
    font-size:.68rem;
  }

}


/*==================================================
FOOTER FINAL RESPONSIVE ROW CONTROL
==================================================*/

@media (min-width:1101px){

  .footer-main-grid{
    grid-template-columns:
      .9fr
      .9fr
      1.35fr
      .78fr;
  }

  .footer-main-grid > *{
    min-width:0;
  }

}

@media (min-width:641px) and (max-width:1100px){

  .footer-main-grid{
    grid-template-columns:
      repeat(2,minmax(0,1fr));
  }

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

}


/*==================================================
MOBILE GRID FORCE-FIT SYSTEM
==================================================*/

@media (max-width:640px){

  .catalog-grid,
  .course-grid,
  .college-grid,
  .university-grid,
  .country-grid,
  .service-grid,
  .card-grid{
    grid-template-columns:
      repeat(2,minmax(0,1fr));

    gap:10px;
  }

  .catalog-card,
  .course-card,
  .college-card,
  .university-card,
  .country-card,
  .service-card{
    padding:15px;
    border-radius:16px;
  }

  .catalog-card h3,
  .course-card h3,
  .college-card h3,
  .university-card h3,
  .country-card h3,
  .service-card h3{
    font-size:.82rem;
  }

  .catalog-card p,
  .course-card p,
  .college-card p,
  .university-card p,
  .country-card p,
  .service-card p{
    font-size:.65rem;
    line-height:1.46;
  }

}


/*==================================================
VERY SMALL MOBILE
==================================================*/

@media (max-width:390px){

  .container{
    width:calc(100% - 20px);
  }

  .hero-actions,
  .pathway-card-actions{
    grid-template-columns:1fr;
  }

  .hero-trust-list{
    grid-template-columns:1fr;
  }

  .hero-mini-statistics{
    grid-template-columns:1fr;
  }

  .hero-mini-statistic{
    align-items:center;
  }

  .hero-mini-statistic:not(:last-child)::after{
    top:auto;
    right:10%;
    bottom:0;
    left:10%;

    width:80%;
    height:1px;
  }

  .trust-strip-grid{
    grid-template-columns:1fr;
  }

  .pathway-feature-grid{
    grid-template-columns:1fr;
  }

  .study-india-highlight-grid,
  .catalog-grid,
  .course-grid,
  .college-grid,
  .university-grid,
  .country-grid,
  .service-grid,
  .card-grid{
    grid-template-columns:1fr;
  }

  .education-overview-visual{
    min-height:500px;
  }

  .education-floating-card{
    width:min(180px,58%);
  }

  .footer-catalog-grid{
    grid-template-columns:
      repeat(2,minmax(0,1fr));
  }

}


/*==================================================
LANDSCAPE MOBILE DEVICES
==================================================*/

@media (
  max-height:520px
)
and
(
  orientation:landscape
){

  .main-navigation.active{
    max-height:calc(100vh - 92px);
  }

  .hero-section{
    min-height:auto;
  }

  .mobile-quick-actions{
    display:none;
  }

  body{
    padding-bottom:0;
  }

  .mobile-phone-frame{
    animation:none;
  }

}


/*==================================================
TOUCH DEVICE HOVER CORRECTION
==================================================*/

@media (hover:none){

  .button:hover,
  .popular-course-card:hover,
  .institution-category-card:hover,
  .destination-card:hover,
  .admission-process-card:hover,
  .job-sector-card:hover,
  .latest-job-card:hover,
  .why-choose-card:hover,
  .journey-card:hover{
    transform:none;
  }

}


/*==================================================
PRINT STYLES
==================================================*/

@media print{

  body{
    padding:0;
    color:#222;
    background:#eee;
    animation:none;
  }

  .top-information-bar,
  .site-header,
  .mobile-quick-actions,
  .hero-guidance-card,
  .final-guidance-form,
  .footer-update-form{
    display:none !important;
  }

  section{
    padding:28px 0;
    break-inside:avoid;
  }

  .site-footer{
    color:#222;
    background:#ddd;
  }

}


/*==================================================
FINAL OVERRIDE -- NEVER PURE WHITE
==================================================*/

body,
main,
section,
article,
aside,
form,
.site-header,
.site-footer,
.footer-top-section,
.footer-main-section,
.footer-bottom-section{
  background-clip:padding-box;
}

article,
aside,
form{
  background-color:var(--card-rose);
}

article[class],
aside[class],
form[class]{
  background-color:initial;
}

input,
select,
textarea{
  background-color:#f5ece7;
}

input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus{
  -webkit-text-fill-color:var(--text-dark);
  -webkit-box-shadow:
    0 0 0 1000px #f2e7e3 inset;

  transition:
    background-color 9999s ease-out;
}


/*==================================================
FINAL OVERFLOW LOCK
==================================================*/

body,
main,
section,
.site-header,
.site-footer{
  overflow-x:hidden;
}

.container,
[class*="grid"],
[class*="layout"],
[class*="wrapper"],
[class*="card"],
[class*="content"]{
  min-width:0;
  max-width:100%;
}


/*==================================================
END OF STYLE.CSS
==================================================*/
/*==================================================
MEDORBIT MBBS INDIA CSS
PART 1
==================================================*/


/*==================================================
ROOT
==================================================*/

:root{

  --primary:#842b48;
  --secondary:#1d6fa5;
  --accent:#f39c12;

  --dark:#28333d;
  --text:#4e5a64;
  --light:#ffffff;

  --border:#e5d9dc;

  --shadow:0 15px 35px rgba(0,0,0,.08);

  --radius:18px;

  --transition:.35s ease;

}


/*==================================================
RESET
==================================================*/

*{
  margin:0;
  padding:0;
  box-sizing:border-box;
}

html{
  scroll-behavior:smooth;
}

body{

  font-family:"Inter",sans-serif;

  color:var(--dark);

  line-height:1.7;

  overflow-x:hidden;

  background:linear-gradient(
      135deg,
      #fff5f7,
      #f7efe7,
      #eef8ff,
      #f6f1ff,
      #eef9f3
  );

  background-size:500% 500%;

  animation:pageBackground 15s ease infinite;

}


/*==================================================
BACKGROUND ANIMATION
==================================================*/

@keyframes pageBackground{

0%{
background-position:0% 50%;
}

25%{
background-position:50% 100%;
}

50%{
background-position:100% 50%;
}

75%{
background-position:50% 0%;
}

100%{
background-position:0% 50%;
}

}


/*==================================================
COMMON
==================================================*/

img{

  max-width:100%;

  display:block;

}

a{

  color:inherit;

  text-decoration:none;

}

button{

  border:none;

  outline:none;

  cursor:pointer;

  font-family:inherit;

}

section{

  position:relative;

  padding:90px 0;

}

.container{

  width:min(1240px,92%);

  margin:auto;

}


/*==================================================
SECTION TITLE
==================================================*/

.section-title{

  max-width:760px;

  margin:0 auto 55px;

  text-align:center;

}

.section-title span{

  display:inline-block;

  margin-bottom:12px;

  color:var(--primary);

  font-size:.82rem;

  font-weight:800;

  letter-spacing:2px;

  text-transform:uppercase;

}

.section-title h2{

  margin-bottom:18px;

  color:var(--dark);

  font-size:clamp(2rem,4vw,3.3rem);

  line-height:1.2;

}

.section-title p{

  color:var(--text);

  font-size:1rem;

}


/*==================================================
BUTTONS
==================================================*/

.btn{

  display:inline-flex;

  align-items:center;

  justify-content:center;

  gap:10px;

  padding:14px 30px;

  border-radius:999px;

  font-weight:700;

  transition:var(--transition);

}

.btn-primary{

  color:#fff;

  background:linear-gradient(
      135deg,
      #842b48,
      #b44569
  );

}

.btn-primary:hover{

  transform:translateY(-3px);

  box-shadow:0 12px 30px rgba(132,43,72,.25);

}

.btn-secondary{

  color:#fff;

  background:linear-gradient(
      135deg,
      #0f7ac6,
      #46a5e7
  );

}

.btn-secondary:hover{

  transform:translateY(-3px);

}

.btn-outline{

  color:var(--primary);

  background:#ffffffdd;

  border:2px solid rgba(132,43,72,.18);

}

.btn-outline:hover{

  background:var(--primary);

  color:#fff;

}


/*==================================================
COMMON CARDS
==================================================*/

.info-card,
.overview-card,
.fact-box,
.fee-card,
.career-card,
.featured-college-card,
.college-card,
.document-card,
.counselling-card{

  background:rgba(255,255,255,.88);

  border:1px solid rgba(255,255,255,.45);

  backdrop-filter:blur(12px);

  border-radius:20px;

  box-shadow:var(--shadow);

  transition:var(--transition);

}

.info-card:hover,
.overview-card:hover,
.fact-box:hover,
.fee-card:hover,
.career-card:hover,
.featured-college-card:hover,
.college-card:hover,
.document-card:hover,
.counselling-card:hover{

  transform:translateY(-8px);

}
/*==================================================
MEDORBIT MBBS INDIA CSS
PART 2
HEADER, NAVIGATION, HERO & STATS
==================================================*/


/*==================================================
HEADER
==================================================*/

.site-header{
  position:relative;
  z-index:1000;
  width:100%;
  padding:16px 0;
  background:linear-gradient(
    135deg,
    rgba(255,239,244,.96),
    rgba(239,247,255,.96)
  );
  border-bottom:1px solid rgba(132,43,72,.12);
  box-shadow:0 8px 28px rgba(58,43,48,.08);
}

.site-header .container{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:28px;
}

.logo{
  display:flex;
  align-items:center;
  flex-shrink:0;
}

.logo img{
  width:170px;
  max-height:58px;
  object-fit:contain;
}


/*==================================================
NAVIGATION
==================================================*/

.navbar{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:24px;
  flex:1;
}

.navbar a{
  position:relative;
  color:#3f454d;
  font-size:.92rem;
  font-weight:700;
  white-space:nowrap;
  transition:var(--transition);
}

.navbar a::after{
  content:"";
  position:absolute;
  left:0;
  bottom:-7px;
  width:0;
  height:2px;
  border-radius:999px;
  background:linear-gradient(
    90deg,
    var(--primary),
    #b44569
  );
  transition:var(--transition);
}

.navbar a:hover{
  color:var(--primary);
}

.navbar a:hover::after{
  width:100%;
}


/*==================================================
HEADER ACTIONS
==================================================*/

.header-actions{
  display:flex;
  align-items:center;
  gap:12px;
  flex-shrink:0;
}

.header-actions .btn{
  padding:11px 21px;
  font-size:.88rem;
}

.menu-toggle{
  display:none;
  width:46px;
  height:46px;
  align-items:center;
  justify-content:center;
  border-radius:14px;
  color:#fff;
  background:linear-gradient(
    135deg,
    var(--primary),
    #b44569
  );
  font-size:1.45rem;
  line-height:1;
  box-shadow:0 10px 24px rgba(132,43,72,.2);
}


/*==================================================
HERO SECTION
==================================================*/

.hero{
  min-height:720px;
  display:flex;
  align-items:center;
  overflow:hidden;
  padding:105px 0;
  background:
    radial-gradient(
      circle at 10% 20%,
      rgba(180,69,105,.16),
      transparent 30%
    ),
    radial-gradient(
      circle at 90% 15%,
      rgba(29,111,165,.16),
      transparent 30%
    ),
    linear-gradient(
      135deg,
      #fce9ef,
      #edf5fb,
      #f8f1e8
    );
}

.hero::before{
  content:"";
  position:absolute;
  top:-140px;
  right:-100px;
  width:430px;
  height:430px;
  border-radius:50%;
  background:linear-gradient(
    135deg,
    rgba(132,43,72,.14),
    rgba(29,111,165,.12)
  );
  filter:blur(5px);
}

.hero::after{
  content:"";
  position:absolute;
  left:-130px;
  bottom:-180px;
  width:420px;
  height:420px;
  border-radius:50%;
  background:rgba(243,156,18,.1);
}

.hero-layout{
  position:relative;
  z-index:2;
  display:grid;
  grid-template-columns:minmax(0,1.12fr) minmax(380px,.88fr);
  align-items:center;
  gap:64px;
}


/*==================================================
HERO CONTENT
==================================================*/

.hero-content{
  min-width:0;
}

.hero-badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  margin-bottom:22px;
  padding:9px 16px;
  border:1px solid rgba(132,43,72,.18);
  border-radius:999px;
  color:var(--primary);
  background:rgba(255,240,245,.82);
  font-size:.78rem;
  font-weight:900;
  letter-spacing:1.7px;
  text-transform:uppercase;
  box-shadow:0 8px 24px rgba(132,43,72,.08);
}

.hero-content h1{
  max-width:820px;
  margin-bottom:24px;
  color:#26323b;
  font-size:clamp(2.8rem,5.4vw,5.3rem);
  font-weight:900;
  line-height:1.05;
  letter-spacing:-2.5px;
}

.hero-content h1 span{
  display:block;
  margin-top:8px;
  color:var(--primary);
  background:linear-gradient(
    135deg,
    #842b48,
    #b44569,
    #1d6fa5
  );
  -webkit-background-clip:text;
  background-clip:text;
  -webkit-text-fill-color:transparent;
}

.hero-content > p{
  max-width:760px;
  margin-bottom:32px;
  color:#59646d;
  font-size:1.06rem;
  line-height:1.8;
}


/*==================================================
HERO BUTTONS
==================================================*/

.hero-buttons{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:14px;
  margin-bottom:38px;
}

.hero-buttons .btn{
  min-width:180px;
}


/*==================================================
HERO IMAGE
==================================================*/

.hero-image{
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
  min-width:0;
  padding:24px;
}

.hero-image::before{
  content:"";
  position:absolute;
  inset:8%;
  border-radius:36% 64% 58% 42% / 48% 44% 56% 52%;
  background:linear-gradient(
    135deg,
    rgba(132,43,72,.2),
    rgba(29,111,165,.18),
    rgba(243,156,18,.13)
  );
  animation:heroBlob 9s ease-in-out infinite alternate;
}

.hero-image::after{
  content:"";
  position:absolute;
  inset:14%;
  border:1px solid rgba(132,43,72,.14);
  border-radius:50%;
}

.hero-image img{
  position:relative;
  z-index:2;
  width:100%;
  max-width:520px;
  max-height:560px;
  object-fit:contain;
  filter:drop-shadow(0 28px 38px rgba(45,57,67,.18));
}

@keyframes heroBlob{
  0%{
    border-radius:36% 64% 58% 42% / 48% 44% 56% 52%;
    transform:rotate(0deg) scale(1);
  }

  100%{
    border-radius:60% 40% 42% 58% / 38% 56% 44% 62%;
    transform:rotate(5deg) scale(1.05);
  }
}


/*==================================================
HERO STATS
==================================================*/

.hero-stats{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:13px;
  max-width:800px;
}

.stat-card{
  min-width:0;
  padding:16px 12px;
  text-align:center;
  background:linear-gradient(
    145deg,
    rgba(255,244,247,.95),
    rgba(239,247,252,.9)
  );
  border:1px solid rgba(132,43,72,.12);
  border-radius:16px;
  box-shadow:0 10px 28px rgba(62,49,54,.08);
  transition:var(--transition);
}

.stat-card:hover{
  transform:translateY(-5px);
  border-color:rgba(132,43,72,.28);
}

.stat-card h3{
  margin-bottom:4px;
  color:var(--primary);
  font-size:1.25rem;
  font-weight:900;
  line-height:1.15;
}

.stat-card p{
  color:#5f6971;
  font-size:.72rem;
  font-weight:700;
  line-height:1.35;
}


/*==================================================
TABLET HEADER
==================================================*/

@media (max-width:1100px){

  .navbar{
    gap:15px;
  }

  .navbar a{
    font-size:.84rem;
  }

  .header-actions .btn{
    display:none;
  }

  .hero-layout{
    grid-template-columns:minmax(0,1fr) minmax(320px,.8fr);
    gap:38px;
  }

  .hero-content h1{
    letter-spacing:-1.8px;
  }

}


/*==================================================
MOBILE NAVIGATION
==================================================*/

@media (max-width:900px){

  .site-header .container{
    position:relative;
  }

  .logo img{
    width:145px;
  }

  .menu-toggle{
    display:flex;
  }

  .navbar{
    position:absolute;
    top:calc(100% + 16px);
    left:0;
    right:0;
    display:none;
    align-items:stretch;
    flex-direction:column;
    gap:0;
    padding:16px;
    border:1px solid rgba(132,43,72,.12);
    border-radius:20px;
    background:linear-gradient(
      135deg,
      #fbeef2,
      #edf6fc
    );
    box-shadow:0 18px 40px rgba(48,42,45,.16);
  }

  .navbar.active{
    display:flex;
  }

  .navbar a{
    width:100%;
    padding:12px 14px;
    border-radius:12px;
  }

  .navbar a::after{
    display:none;
  }

  .navbar a:hover{
    background:rgba(132,43,72,.09);
  }

  .hero{
    min-height:auto;
    padding:82px 0;
  }

  .hero-layout{
    grid-template-columns:1fr;
    gap:44px;
    text-align:center;
  }

  .hero-content > p{
    margin-left:auto;
    margin-right:auto;
  }

  .hero-buttons{
    justify-content:center;
  }

  .hero-stats{
    margin:0 auto;
  }

  .hero-image{
    order:-1;
    max-width:520px;
    margin:0 auto;
  }

}


/*==================================================
SMALL MOBILE
==================================================*/

@media (max-width:620px){

  .site-header{
    padding:12px 0;
  }

  .logo img{
    width:128px;
  }

  .menu-toggle{
    width:42px;
    height:42px;
    border-radius:12px;
  }

  .hero{
    padding:60px 0 70px;
  }

  .hero-content h1{
    font-size:clamp(2.15rem,11vw,3.2rem);
    letter-spacing:-1.2px;
  }

  .hero-content > p{
    font-size:.94rem;
  }

  .hero-buttons{
    display:grid;
    grid-template-columns:1fr;
    width:100%;
  }

  .hero-buttons .btn{
    width:100%;
    min-width:0;
  }

  .hero-stats{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:10px;
  }

  .stat-card{
    padding:14px 8px;
  }

  .stat-card h3{
    font-size:1.08rem;
  }

  .stat-card p{
    font-size:.68rem;
  }

  .hero-image{
    padding:10px;
  }

}
/*==================================================
MEDORBIT MBBS INDIA CSS
PART 3
OVERVIEW, FACTS, ELIGIBILITY, TIMELINE & DOCUMENTS
==================================================*/


/*==================================================
ALTERNATE SECTION BACKGROUND
==================================================*/

.section-alt{
  background:linear-gradient(
    135deg,
    #f5e9ed,
    #edf5f8,
    #f5f1e8
  );
  border-top:1px solid rgba(132,43,72,.08);
  border-bottom:1px solid rgba(132,43,72,.08);
}


/*==================================================
OVERVIEW GRID
==================================================*/

.overview-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:24px;
}

.overview-card{
  position:relative;
  overflow:hidden;
  padding:30px 24px;
  text-align:center;
  background:linear-gradient(
    145deg,
    #fceef2,
    #edf5fa
  );
}

.overview-card::before{
  content:"";
  position:absolute;
  top:-55px;
  right:-55px;
  width:130px;
  height:130px;
  border-radius:50%;
  background:rgba(132,43,72,.08);
}

.overview-icon{
  position:relative;
  z-index:2;
  display:flex;
  align-items:center;
  justify-content:center;
  width:68px;
  height:68px;
  margin:0 auto 20px;
  border-radius:20px;
  background:linear-gradient(
    135deg,
    #f4dfe6,
    #daeaf5
  );
  font-size:2rem;
  box-shadow:0 10px 25px rgba(56,50,53,.1);
}

.overview-card h3{
  position:relative;
  z-index:2;
  margin-bottom:10px;
  color:#303b44;
  font-size:1.15rem;
  font-weight:800;
}

.overview-card p{
  position:relative;
  z-index:2;
  color:#626d75;
  font-size:.92rem;
  line-height:1.65;
}


/*==================================================
QUICK FACTS
==================================================*/

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

.fact-box{
  padding:26px 22px;
  background:linear-gradient(
    135deg,
    #f8e9ee,
    #eaf3f8
  );
  border-left:5px solid var(--primary);
}

.fact-box:nth-child(2n){
  border-left-color:var(--secondary);
}

.fact-box:nth-child(3n){
  border-left-color:var(--accent);
}

.fact-box h3{
  margin-bottom:8px;
  color:#313c44;
  font-size:1.05rem;
  font-weight:850;
}

.fact-box p{
  color:#606b73;
  font-size:.9rem;
}


/*==================================================
ELIGIBILITY GRID
==================================================*/

.eligibility-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:25px;
}

.info-card{
  padding:30px 26px;
  background:linear-gradient(
    145deg,
    #f9e9ef,
    #edf4f7
  );
}

.card-icon{
  display:flex;
  align-items:center;
  justify-content:center;
  width:62px;
  height:62px;
  margin-bottom:20px;
  border-radius:18px;
  background:linear-gradient(
    135deg,
    #ecd1da,
    #d7e9f3
  );
  font-size:1.8rem;
}

.info-card h3{
  margin-bottom:16px;
  color:#303a42;
  font-size:1.2rem;
  font-weight:850;
}

.info-card ul{
  display:grid;
  gap:12px;
  list-style:none;
}

.info-card li{
  position:relative;
  padding-left:24px;
  color:#5c6770;
  font-size:.9rem;
  line-height:1.6;
}

.info-card li::before{
  content:"✓";
  position:absolute;
  left:0;
  top:0;
  color:var(--primary);
  font-weight:900;
}


/*==================================================
ADMISSION TIMELINE
==================================================*/

.timeline{
  position:relative;
  display:grid;
  gap:20px;
  max-width:900px;
  margin:0 auto;
}

.timeline::before{
  content:"";
  position:absolute;
  top:25px;
  bottom:25px;
  left:28px;
  width:3px;
  border-radius:999px;
  background:linear-gradient(
    to bottom,
    var(--primary),
    var(--secondary),
    var(--accent)
  );
}

.timeline-item{
  position:relative;
  display:grid;
  grid-template-columns:58px minmax(0,1fr);
  gap:20px;
  align-items:start;
  padding:24px;
  border:1px solid rgba(132,43,72,.12);
  border-radius:20px;
  background:linear-gradient(
    135deg,
    #faedf1,
    #edf5f8
  );
  box-shadow:0 12px 30px rgba(55,48,51,.07);
  transition:var(--transition);
}

.timeline-item:hover{
  transform:translateX(8px);
  border-color:rgba(132,43,72,.24);
}

.timeline-number{
  position:relative;
  z-index:2;
  display:flex;
  align-items:center;
  justify-content:center;
  width:56px;
  height:56px;
  border-radius:18px;
  color:#fff;
  background:linear-gradient(
    135deg,
    var(--primary),
    #b44569
  );
  font-weight:900;
  box-shadow:0 10px 24px rgba(132,43,72,.22);
}

.timeline-item h3{
  margin-bottom:7px;
  color:#303b43;
  font-size:1.1rem;
  font-weight:850;
}

.timeline-item p{
  color:#616c74;
  font-size:.91rem;
}


/*==================================================
DOCUMENT GRID
==================================================*/

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

.document-card{
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:118px;
  padding:20px 16px 20px 48px;
  color:#3e4951;
  background:linear-gradient(
    145deg,
    #faebf0,
    #ebf4f8
  );
  font-size:.85rem;
  font-weight:750;
  line-height:1.5;
  text-align:left;
}

.document-card::before{
  content:"✓";
  position:absolute;
  left:16px;
  display:flex;
  align-items:center;
  justify-content:center;
  width:24px;
  height:24px;
  border-radius:50%;
  color:#fff;
  background:var(--primary);
  font-size:.72rem;
  font-weight:900;
}

.document-card:nth-child(2n)::before{
  background:var(--secondary);
}

.document-card:nth-child(3n)::before{
  background:#b26a1c;
}


/*==================================================
TABLET
==================================================*/

@media (max-width:1024px){

  .overview-grid,
  .facts-grid,
  .eligibility-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  .documents-grid{
    grid-template-columns:repeat(3,minmax(0,1fr));
  }

}


/*==================================================
MOBILE
==================================================*/

@media (max-width:700px){

  section{
    padding:68px 0;
  }

  .section-title{
    margin-bottom:38px;
  }

  .section-title h2{
    font-size:clamp(1.75rem,8vw,2.4rem);
  }

  .section-title p{
    font-size:.92rem;
  }

  .overview-grid,
  .facts-grid,
  .eligibility-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:12px;
  }

  .overview-card,
  .fact-box,
  .info-card{
    padding:20px 14px;
    border-radius:16px;
  }

  .overview-icon{
    width:52px;
    height:52px;
    margin-bottom:14px;
    border-radius:15px;
    font-size:1.45rem;
  }

  .overview-card h3,
  .fact-box h3,
  .info-card h3{
    font-size:.9rem;
  }

  .overview-card p,
  .fact-box p,
  .info-card li{
    font-size:.76rem;
  }

  .card-icon{
    width:50px;
    height:50px;
    margin-bottom:14px;
    font-size:1.4rem;
  }

  .info-card li{
    padding-left:19px;
  }

  .timeline::before{
    left:22px;
  }

  .timeline-item{
    grid-template-columns:44px minmax(0,1fr);
    gap:14px;
    padding:18px 15px;
  }

  .timeline-number{
    width:44px;
    height:44px;
    border-radius:14px;
    font-size:.85rem;
  }

  .timeline-item h3{
    font-size:.95rem;
  }

  .timeline-item p{
    font-size:.8rem;
  }

  .documents-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:11px;
  }

  .document-card{
    min-height:100px;
    padding:16px 11px 16px 39px;
    border-radius:15px;
    font-size:.72rem;
  }

  .document-card::before{
    left:11px;
    width:21px;
    height:21px;
  }

}


/*==================================================
VERY SMALL MOBILE
==================================================*/

@media (max-width:390px){

  .overview-grid,
  .facts-grid,
  .eligibility-grid,
  .documents-grid{
    grid-template-columns:1fr;
  }

  .overview-card,
  .fact-box,
  .info-card,
  .document-card{
    min-height:auto;
  }

}
/*==================================================
MEDORBIT MBBS INDIA CSS
PART 4
COLLEGE DIRECTORY, FEATURED COLLEGES & FEES
==================================================*/


/*==================================================
COLLEGE FILTER PANEL
==================================================*/

.college-filter-panel{
  display:grid;
  grid-template-columns:
    minmax(220px,1.5fr)
    repeat(3,minmax(150px,1fr))
    auto;
  gap:16px;
  align-items:end;
  margin-bottom:34px;
  padding:24px;
  border:1px solid rgba(132,43,72,.12);
  border-radius:24px;
  background:linear-gradient(
    135deg,
    #f9e8ee,
    #eaf3f8,
    #f6efe5
  );
  box-shadow:0 16px 38px rgba(58,48,52,.09);
}

.filter-field{
  min-width:0;
}

.filter-field label{
  display:block;
  margin-bottom:8px;
  color:#3d474f;
  font-size:.78rem;
  font-weight:850;
}

.filter-field input,
.filter-field select{
  width:100%;
  min-height:48px;
  padding:0 14px;
  border:1px solid rgba(132,43,72,.16);
  border-radius:13px;
  outline:none;
  color:#354048;
  background:#f8edf1;
  font-family:inherit;
  font-size:.85rem;
  transition:var(--transition);
}

.filter-field input::placeholder{
  color:#858d93;
}

.filter-field input:focus,
.filter-field select:focus{
  border-color:var(--primary);
  box-shadow:0 0 0 4px rgba(132,43,72,.09);
}

.filter-button{
  min-height:48px;
  padding:12px 22px;
  white-space:nowrap;
}


/*==================================================
RESULT HEADER
==================================================*/

.college-results-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  margin-bottom:24px;
  padding:18px 20px;
  border:1px solid rgba(29,111,165,.13);
  border-radius:18px;
  background:linear-gradient(
    135deg,
    #eef5f9,
    #f8e9ee
  );
}

.college-results-label{
  display:block;
  margin-bottom:4px;
  color:var(--primary);
  font-size:.72rem;
  font-weight:900;
  letter-spacing:1px;
  text-transform:uppercase;
}

.college-results-header h3{
  color:#303b43;
  font-size:1.15rem;
}

.college-results-header .btn{
  padding:10px 18px;
  font-size:.8rem;
}


/*==================================================
DYNAMIC COLLEGE GRID
==================================================*/

.college-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:22px;
}

.college-card{
  position:relative;
  overflow:hidden;
  display:flex;
  flex-direction:column;
  min-height:100%;
  background:linear-gradient(
    145deg,
    #faedf1,
    #edf5f8
  );
}

.college-card::before{
  content:"";
  position:absolute;
  top:-70px;
  right:-70px;
  width:160px;
  height:160px;
  border-radius:50%;
  background:rgba(132,43,72,.08);
}

.college-card-image{
  position:relative;
  height:190px;
  overflow:hidden;
  background:linear-gradient(
    135deg,
    #ead4dc,
    #d9e9f2
  );
}

.college-card-image img{
  width:100%;
  height:100%;
  object-fit:cover;
  transition:transform .55s ease;
}

.college-card:hover .college-card-image img{
  transform:scale(1.06);
}

.college-card-body{
  position:relative;
  z-index:2;
  display:flex;
  flex-direction:column;
  flex:1;
  padding:24px;
}

.college-type-badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:max-content;
  max-width:100%;
  margin-bottom:15px;
  padding:7px 11px;
  border-radius:999px;
  color:#fff;
  background:linear-gradient(
    135deg,
    #65717a,
    #404b53
  );
  font-size:.68rem;
  font-weight:900;
  letter-spacing:.6px;
  text-transform:uppercase;
}

.college-type-badge.government{
  background:linear-gradient(
    135deg,
    #1d6fa5,
    #4a9dca
  );
}

.college-type-badge.private{
  background:linear-gradient(
    135deg,
    #842b48,
    #b44569
  );
}

.college-type-badge.deemed{
  background:linear-gradient(
    135deg,
    #a86217,
    #d59742
  );
}

.college-card h3{
  margin-bottom:8px;
  color:#303a42;
  font-size:1.16rem;
  line-height:1.4;
}

.college-location{
  margin-bottom:14px;
  color:#68727a;
  font-size:.82rem;
  font-weight:650;
}

.college-meta{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px;
  margin-bottom:18px;
}

.college-meta div{
  padding:10px;
  border:1px solid rgba(132,43,72,.09);
  border-radius:12px;
  background:#f5e9ed;
}

.college-meta span{
  display:block;
  margin-bottom:3px;
  color:#737d84;
  font-size:.65rem;
  font-weight:750;
  text-transform:uppercase;
}

.college-meta strong{
  display:block;
  color:#38434b;
  font-size:.77rem;
}

.college-card-actions{
  display:flex;
  gap:9px;
  margin-top:auto;
}

.college-card-actions .btn{
  flex:1;
  padding:10px 13px;
  font-size:.76rem;
}

.college-loading-card{
  grid-column:1/-1;
  min-height:210px;
  align-items:center;
  justify-content:center;
  text-align:center;
}


/*==================================================
COLLEGE ACTIONS
==================================================*/

.college-actions{
  display:flex;
  align-items:center;
  justify-content:center;
  flex-wrap:wrap;
  gap:14px;
  margin-top:34px;
}


/*==================================================
FEATURED COLLEGE SECTIONS
==================================================*/

.government-colleges-section{
  background:linear-gradient(
    135deg,
    #e8f2f8,
    #f2e7ec
  );
}

.private-colleges-section{
  background:linear-gradient(
    135deg,
    #f6e6ec,
    #f2ecdf,
    #eaf2f5
  );
}

.featured-college-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:20px;
}

.featured-college-card{
  position:relative;
  overflow:hidden;
  padding:26px 22px;
  background:linear-gradient(
    145deg,
    #f9e9ef,
    #edf4f8
  );
}

.featured-college-card::after{
  content:"";
  position:absolute;
  right:-42px;
  bottom:-42px;
  width:110px;
  height:110px;
  border-radius:50%;
  background:rgba(29,111,165,.08);
}

.featured-college-icon{
  display:flex;
  align-items:center;
  justify-content:center;
  width:58px;
  height:58px;
  margin-bottom:16px;
  border-radius:17px;
  background:linear-gradient(
    135deg,
    #ecd5dd,
    #dcebf3
  );
  font-size:1.7rem;
}

.featured-college-card h3{
  position:relative;
  z-index:2;
  margin-bottom:7px;
  color:#303a42;
  font-size:1.03rem;
  line-height:1.4;
}

.featured-college-card ul{
  position:relative;
  z-index:2;
  display:grid;
  gap:9px;
  margin-top:16px;
  list-style:none;
}

.featured-college-card li{
  position:relative;
  padding-left:20px;
  color:#5f6a72;
  font-size:.79rem;
  line-height:1.5;
}

.featured-college-card li::before{
  content:"✓";
  position:absolute;
  left:0;
  color:var(--primary);
  font-weight:900;
}


/*==================================================
FEE GRID
==================================================*/

.fee-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:24px;
}

.fee-card{
  position:relative;
  overflow:hidden;
  padding:30px 25px;
  background:linear-gradient(
    145deg,
    #f9e7ed,
    #e9f2f7
  );
}

.fee-card:nth-child(2){
  background:linear-gradient(
    145deg,
    #e7f1f7,
    #f3e8ec
  );
}

.fee-card:nth-child(3){
  background:linear-gradient(
    145deg,
    #f4eadc,
    #ede8f3
  );
}

.fee-icon{
  display:flex;
  align-items:center;
  justify-content:center;
  width:64px;
  height:64px;
  margin-bottom:20px;
  border-radius:18px;
  background:linear-gradient(
    135deg,
    #ead0da,
    #d8e9f2
  );
  font-size:1.9rem;
}

.fee-card h3{
  margin-bottom:12px;
  color:#303a42;
  font-size:1.14rem;
  line-height:1.4;
}

.fee-card h4{
  margin-bottom:18px;
  color:var(--primary);
  font-size:1.2rem;
  font-weight:900;
}

.fee-card ul{
  display:grid;
  gap:10px;
  list-style:none;
}

.fee-card li{
  position:relative;
  padding-left:22px;
  color:#5e6971;
  font-size:.86rem;
}

.fee-card li::before{
  content:"✓";
  position:absolute;
  left:0;
  color:var(--secondary);
  font-weight:900;
}


/*==================================================
TABLET
==================================================*/

@media (max-width:1100px){

  .college-filter-panel{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  .filter-button{
    width:100%;
  }

  .college-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  .featured-college-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

}


/*==================================================
MOBILE
==================================================*/

@media (max-width:700px){

  .college-filter-panel{
    grid-template-columns:1fr;
    gap:13px;
    padding:18px;
    border-radius:18px;
  }

  .college-results-header{
    align-items:flex-start;
    flex-direction:column;
  }

  .college-results-header .btn{
    width:100%;
  }

  .college-grid{
    grid-template-columns:1fr;
    gap:15px;
  }

  .college-card-image{
    height:175px;
  }

  .college-card-body{
    padding:19px;
  }

  .featured-college-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:12px;
  }

  .featured-college-card{
    padding:18px 14px;
    border-radius:16px;
  }

  .featured-college-icon{
    width:48px;
    height:48px;
    margin-bottom:13px;
    border-radius:14px;
    font-size:1.35rem;
  }

  .featured-college-card h3{
    font-size:.86rem;
  }

  .featured-college-card .college-location,
  .featured-college-card li{
    font-size:.7rem;
  }

  .fee-grid{
    grid-template-columns:1fr;
    gap:15px;
  }

  .fee-card{
    padding:22px 19px;
  }

}


/*==================================================
VERY SMALL MOBILE
==================================================*/

@media (max-width:390px){

  .featured-college-grid{
    grid-template-columns:1fr;
  }

  .college-card-actions{
    flex-direction:column;
  }

}
/*==================================================
MEDORBIT MBBS INDIA CSS
PART 5
COUNSELLING, CAREER, CTA, FAQ, DISCLAIMER & FOOTER
==================================================*/


/*==================================================
COUNSELLING GRID
==================================================*/

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

.counselling-card{
  position:relative;
  overflow:hidden;
  min-height:240px;
  padding:28px 22px;
  background:linear-gradient(
    145deg,
    #f8e8ee,
    #eaf3f8
  );
}

.counselling-card::after{
  content:"";
  position:absolute;
  right:-45px;
  bottom:-45px;
  width:120px;
  height:120px;
  border-radius:50%;
  background:rgba(132,43,72,.07);
}

.step-number{
  display:flex;
  align-items:center;
  justify-content:center;
  width:58px;
  height:58px;
  margin-bottom:20px;
  border-radius:18px;
  color:#fff;
  background:linear-gradient(
    135deg,
    var(--primary),
    #b44569
  );
  font-size:1rem;
  font-weight:900;
  box-shadow:0 10px 24px rgba(132,43,72,.2);
}

.counselling-card:nth-child(2) .step-number{
  background:linear-gradient(
    135deg,
    #1d6fa5,
    #52a6d2
  );
}

.counselling-card:nth-child(3) .step-number{
  background:linear-gradient(
    135deg,
    #a6651a,
    #d79a48
  );
}

.counselling-card:nth-child(4) .step-number{
  background:linear-gradient(
    135deg,
    #5d4b8c,
    #8c78bd
  );
}

.counselling-card h3{
  position:relative;
  z-index:2;
  margin-bottom:10px;
  color:#303b43;
  font-size:1.05rem;
  line-height:1.4;
}

.counselling-card p{
  position:relative;
  z-index:2;
  color:#606b73;
  font-size:.86rem;
}


/*==================================================
CAREER GRID
==================================================*/

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

.career-card{
  min-height:190px;
  padding:28px 22px;
  text-align:center;
  background:linear-gradient(
    145deg,
    #f9e8ee,
    #ebf4f8
  );
  font-size:2rem;
}

.career-card h3{
  margin:14px 0 7px;
  color:#303b43;
  font-size:1.02rem;
}

.career-card p{
  color:#667179;
  font-size:.82rem;
}


/*==================================================
CTA SECTION
==================================================*/

.cta-section{
  background:linear-gradient(
    135deg,
    #ead3dc,
    #dcecf4,
    #f0e5d6
  );
}

.cta-wrapper{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:40px;
  padding:42px;
  border:1px solid rgba(132,43,72,.14);
  border-radius:28px;
  background:linear-gradient(
    135deg,
    #f8e8ee,
    #eaf3f8
  );
  box-shadow:0 20px 50px rgba(58,48,52,.12);
}

.cta-wrapper > div:first-child{
  max-width:760px;
}

.cta-badge{
  display:inline-block;
  margin-bottom:12px;
  color:var(--primary);
  font-size:.75rem;
  font-weight:900;
  letter-spacing:1.5px;
  text-transform:uppercase;
}

.cta-wrapper h2{
  margin-bottom:14px;
  color:#2d3941;
  font-size:clamp(2rem,4vw,3.3rem);
  line-height:1.15;
}

.cta-wrapper p{
  color:#5d6870;
}

.cta-buttons{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  flex-shrink:0;
}


/*==================================================
FAQ
==================================================*/

.faq-list{
  display:grid;
  gap:14px;
  max-width:900px;
  margin:0 auto;
}

.faq-item{
  overflow:hidden;
  border:1px solid rgba(132,43,72,.12);
  border-radius:18px;
  background:linear-gradient(
    135deg,
    #f8e9ee,
    #edf5f8
  );
  box-shadow:0 10px 26px rgba(55,48,51,.07);
}

.faq-item summary{
  position:relative;
  padding:20px 54px 20px 22px;
  color:#354048;
  font-size:.98rem;
  font-weight:800;
  list-style:none;
  cursor:pointer;
}

.faq-item summary::-webkit-details-marker{
  display:none;
}

.faq-item summary::after{
  content:"+";
  position:absolute;
  top:50%;
  right:20px;
  display:flex;
  align-items:center;
  justify-content:center;
  width:28px;
  height:28px;
  border-radius:50%;
  color:#fff;
  background:var(--primary);
  font-size:1.15rem;
  transform:translateY(-50%);
  transition:var(--transition);
}

.faq-item[open] summary::after{
  content:"−";
  transform:translateY(-50%) rotate(180deg);
}

.faq-item p{
  padding:0 22px 22px;
  color:#616c74;
  font-size:.88rem;
}


/*==================================================
DISCLAIMER
==================================================*/

.disclaimer-box{
  padding:28px 30px;
  border:1px solid rgba(166,101,26,.18);
  border-radius:20px;
  background:linear-gradient(
    135deg,
    #f5ead9,
    #f2e6ea
  );
  box-shadow:0 12px 30px rgba(76,58,37,.07);
}

.disclaimer-box h3{
  margin-bottom:10px;
  color:#8e5717;
  font-size:1.1rem;
}

.disclaimer-box p{
  color:#685f54;
  font-size:.8rem;
  line-height:1.7;
}


/*==================================================
FOOTER
==================================================*/

.footer{
  position:relative;
  overflow:hidden;
  padding:70px 0 24px;
  color:#eaf1f5;
  background:linear-gradient(
    135deg,
    #402330,
    #263d4b,
    #4a3827
  );
}

.footer::before{
  content:"";
  position:absolute;
  top:-110px;
  right:-90px;
  width:310px;
  height:310px;
  border-radius:50%;
  background:rgba(255,255,255,.05);
}

.footer::after{
  content:"";
  position:absolute;
  left:-110px;
  bottom:-140px;
  width:340px;
  height:340px;
  border-radius:50%;
  background:rgba(255,255,255,.035);
}

.footer .container{
  position:relative;
  z-index:2;
}

.footer-grid{
  display:grid;
  grid-template-columns:1.5fr repeat(3,1fr);
  gap:34px;
}

.footer-logo{
  width:175px;
  max-height:60px;
  margin-bottom:18px;
  object-fit:contain;
}

.footer-about p,
.footer-contact p{
  color:#cbd6dc;
  font-size:.82rem;
  line-height:1.7;
}

.footer-links h3,
.footer-contact h3{
  margin-bottom:16px;
  color:#fff2f6;
  font-size:1rem;
}

.footer-links ul{
  display:grid;
  gap:10px;
  list-style:none;
}

.footer-links a{
  color:#cbd6dc;
  font-size:.82rem;
  transition:var(--transition);
}

.footer-links a:hover{
  color:#fff;
  padding-left:5px;
}

.footer-contact{
  display:grid;
  align-content:start;
  gap:8px;
}

.footer-bottom{
  margin-top:42px;
  padding-top:20px;
  border-top:1px solid rgba(255,255,255,.12);
  text-align:center;
}

.footer-bottom p{
  color:#becbd2;
  font-size:.76rem;
}


/*==================================================
TABLET RESPONSIVE
==================================================*/

@media (max-width:1024px){

  .counselling-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  .career-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  .cta-wrapper{
    align-items:flex-start;
    flex-direction:column;
  }

  .footer-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

}


/*==================================================
MOBILE RESPONSIVE
==================================================*/

@media (max-width:700px){

  .counselling-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:12px;
  }

  .counselling-card{
    min-height:210px;
    padding:20px 14px;
    border-radius:16px;
  }

  .step-number{
    width:46px;
    height:46px;
    margin-bottom:14px;
    border-radius:14px;
    font-size:.8rem;
  }

  .counselling-card h3{
    font-size:.86rem;
  }

  .counselling-card p{
    font-size:.72rem;
  }

  .career-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:12px;
  }

  .career-card{
    min-height:155px;
    padding:20px 12px;
    border-radius:16px;
    font-size:1.55rem;
  }

  .career-card h3{
    font-size:.84rem;
  }

  .career-card p{
    font-size:.7rem;
  }

  .cta-wrapper{
    padding:28px 20px;
    border-radius:22px;
    text-align:center;
  }

  .cta-wrapper h2{
    font-size:clamp(1.8rem,8vw,2.5rem);
  }

  .cta-wrapper p{
    font-size:.88rem;
  }

  .cta-buttons{
    display:grid;
    grid-template-columns:1fr;
    width:100%;
  }

  .cta-buttons .btn{
    width:100%;
  }

  .faq-item summary{
    padding:18px 50px 18px 16px;
    font-size:.84rem;
  }

  .faq-item summary::after{
    right:14px;
  }

  .faq-item p{
    padding:0 16px 18px;
    font-size:.76rem;
  }

  .disclaimer-box{
    padding:22px 18px;
  }

  .disclaimer-box p{
    font-size:.72rem;
  }

  .footer{
    padding:55px 0 22px;
  }

  .footer-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:24px 16px;
  }

  .footer-about{
    grid-column:1/-1;
  }

  .footer-logo{
    width:150px;
  }

  .footer-links h3,
  .footer-contact h3{
    font-size:.88rem;
  }

  .footer-links a,
  .footer-about p,
  .footer-contact p{
    font-size:.72rem;
  }

}


/*==================================================
VERY SMALL MOBILE
==================================================*/

@media (max-width:390px){

  .counselling-grid,
  .career-grid{
    grid-template-columns:1fr;
  }

  .counselling-card,
  .career-card{
    min-height:auto;
  }

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

  .footer-about{
    grid-column:auto;
  }

}


/*==================================================
ACCESSIBILITY & REDUCED MOTION
==================================================*/

@media (prefers-reduced-motion:reduce){

  html{
    scroll-behavior:auto;
  }

  *,
  *::before,
  *::after{
    animation-duration:.01ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.01ms !important;
  }

}
/*==================================================
MEDORBIT GLOBAL JSON LOADER
==================================================*/

.medorbit-json-grid{
  display:grid;
  grid-template-columns:
    repeat(3,minmax(0,1fr));
  gap:20px;
}

.medorbit-json-card{
  min-width:0;
  padding:24px;

  display:flex;
  flex-direction:column;

  border:1px solid #c9c1d3;
  border-radius:20px;

  background:
    linear-gradient(
      145deg,
      #e4ddec,
      #dce7e8,
      #ede1cf
    );

  box-shadow:
    0 14px 32px
    rgba(41,34,67,.12);

  transition:
    transform .25s ease,
    box-shadow .25s ease;
}

.medorbit-json-card:hover{
  transform:translateY(-6px);

  box-shadow:
    0 22px 48px
    rgba(41,34,67,.18);
}

.medorbit-json-card-icon{
  width:58px;
  height:58px;

  display:grid;
  place-items:center;

  margin-bottom:15px;

  border-radius:18px;

  color:#f6eff8;

  background:
    linear-gradient(
      145deg,
      #493071,
      #70405f
    );

  font-size:1.6rem;
}

.medorbit-json-card-category{
  display:inline-flex;
  align-self:flex-start;

  margin-bottom:10px;
  padding:5px 9px;

  border-radius:999px;

  color:#342047;
  background:#d8cbe2;

  font-size:.68rem;
  font-weight:850;
  text-transform:capitalize;
}

.medorbit-json-card h3{
  margin-bottom:9px;
  overflow-wrap:anywhere;
}

.medorbit-json-card p{
  margin-bottom:18px;

  color:#53636d;
  font-size:.9rem;
}

.medorbit-json-card .button{
  margin-top:auto;
  align-self:flex-start;
}

.medorbit-loader-status{
  grid-column:1/-1;

  padding:28px;

  border:1px dashed #b8afc5;
  border-radius:18px;

  color:#53636d;
  text-align:center;

  background:
    linear-gradient(
      145deg,
      #e2dbe9,
      #dce7e6
    );
}

.route-unavailable{
  opacity:.55;
  cursor:not-allowed;
  pointer-events:none;
}

@media(max-width:900px){

  .medorbit-json-grid{
    grid-template-columns:
      repeat(2,minmax(0,1fr));
  }

}

@media(max-width:520px){

  .medorbit-json-grid{
    grid-template-columns:1fr;
  }

}
/*==================================================
FOOTER
==================================================*/

.footer{
  position:relative;
  overflow:hidden;

  padding:70px 0 25px;

  color:#eef2f7;

  background:
    radial-gradient(
      circle at 15% 10%,
      rgba(213,163,45,.08),
      transparent 28%
    ),
    radial-gradient(
      circle at 90% 90%,
      rgba(15,143,135,.10),
      transparent 30%
    ),
    linear-gradient(
      135deg,
      #1d2432,
      #283346,
      #202938
    );
}

.footer::before{
  content:"";

  position:absolute;
  inset:0;

  background:
    linear-gradient(
      90deg,
      transparent,
      rgba(255,255,255,.02),
      transparent
    );

  animation:footerGlow 15s linear infinite;
}

.footer .container{
  position:relative;
  z-index:2;
}

.footer-grid{
  display:grid;
  grid-template-columns:
    1.4fr
    repeat(3,1fr);

  gap:35px;

  margin-bottom:40px;
}

.footer-column h3{
  margin-bottom:18px;

  color:#ffffff;

  font-size:1.2rem;
}

.footer-column p{
  color:#c7d0dc;
  line-height:1.8;
}

.footer-links{
  display:grid;
  gap:11px;

  list-style:none;
}

.footer-links li{
  list-style:none;
}

.footer-links a{
  color:#c7d0dc;

  transition:.25s;
}

.footer-links a:hover{
  color:#f4c85b;
  padding-left:6px;
}

.footer-bottom{
  padding-top:22px;

  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:20px;
  flex-wrap:wrap;

  border-top:1px solid rgba(255,255,255,.08);
}

.footer-bottom p{
  color:#aeb8c5;
}

.footer-bottom-links{
  display:flex;
  gap:20px;
  flex-wrap:wrap;
}

.footer-bottom-links a{
  color:#aeb8c5;

  transition:.25s;
}

.footer-bottom-links a:hover{
  color:#ffd46c;
}


/*==================================================
RESPONSIVE
==================================================*/

@media (max-width:992px){

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

}

@media (max-width:600px){

.footer{
padding:55px 0 22px;
}

.footer-grid{
grid-template-columns:1fr;
gap:28px;
}

.footer-bottom{
flex-direction:column;
text-align:center;
}

.footer-bottom-links{
justify-content:center;
}

}


/*==================================================
FOOTER ANIMATION
==================================================*/

@ keyframes footerGlow{

0%{
transform:translateX(-100%);
}

100%{
transform:translateX(100%);
}

}
/medorbit/career/recruitment-modes/direct-hiring.html 

@media(max-width:768px){

.hero h1{

font-size:38px;

}

.hero{

padding:70px 0;

}

.university-grid{

grid-template-columns:1fr;

}

.feature-grid{

grid-template-columns:1fr;

}

.two-col{

grid-template-columns:1fr;

}

.stats-grid{

grid-template-columns:repeat(2,1fr);

}

.filter-bar{

grid-template-columns:1fr;

}

.button{

width:100%;

}

}

/*==================================================
MEDORBIT IT JOBS
assets/css/it-jobs.css
==================================================*/

:root{
  --it-primary:#1859c9;
  --it-primary-dark:#103f92;
  --it-primary-soft:#dce7fb;

  --it-secondary:#d89d31;
  --it-secondary-dark:#9f6c14;
  --it-secondary-soft:#f5e5bd;

  --it-accent:#117b79;
  --it-accent-dark:#095a59;
  --it-accent-soft:#d9eeeb;

  --it-heading:#1c3550;
  --it-text:#445f70;
  --it-muted:#6d818d;

  --it-border:rgba(24,89,201,.17);

  --it-shadow:
    0 18px 48px rgba(30,68,111,.10);

  --it-shadow-hover:
    0 26px 60px rgba(30,68,111,.16);

  --it-radius:24px;
  --it-transition:all .28s ease;
}


/*==================================================
RESET AND PAGE FOUNDATION
==================================================*/

*,
*::before,
*::after{
  box-sizing:border-box;
}

html{
  scroll-behavior:smooth;
  scroll-padding-top:90px;
}

body.it-page{
  margin:0;
  overflow-x:hidden;

  color:var(--it-text);

  font-family:
    Inter,
    "Segoe UI",
    Roboto,
    Arial,
    sans-serif;

  line-height:1.7;

  background:
    radial-gradient(
      circle at 8% 8%,
      rgba(24,89,201,.14),
      transparent 28%
    ),
    radial-gradient(
      circle at 92% 12%,
      rgba(216,157,49,.15),
      transparent 28%
    ),
    linear-gradient(
      145deg,
      #e5edf7,
      #f1e7d8
    );

  background-size:170% 170%;

  animation:
    itPageShift 15s ease-in-out infinite alternate;
}

@keyframes itPageShift{

  0%{
    background-position:0% 15%;
  }

  50%{
    background-position:65% 72%;
  }

  100%{
    background-position:100% 25%;
  }

}

body.it-page.menu-open{
  overflow:hidden;
}

body.it-page img{
  display:block;
  max-width:100%;
}

body.it-page a{
  color:inherit;
  text-decoration:none;
}

body.it-page button,
body.it-page input,
body.it-page select,
body.it-page textarea{
  font:inherit;
}

body.it-page button{
  border:0;
}

body.it-page ul{
  margin:0;
  padding:0;

  list-style:none;
}

body.it-page main{
  width:100%;
  overflow:hidden;
}

body.it-page .container{
  width:min(1180px, calc(100% - 40px));
  margin-inline:auto;
}

body.it-page :focus-visible{
  outline:3px solid rgba(216,157,49,.65);
  outline-offset:4px;
}

body.it-page ::selection{
  color:var(--it-heading);
  background:#efca69;
}


/*==================================================
BREADCRUMB
==================================================*/

body.it-page .page-header{
  position:relative;
  z-index:30;

  padding:14px 0;

  border-bottom:1px solid rgba(24,89,201,.13);

  background:
    linear-gradient(
      135deg,
      #e2ebf7,
      #f0e3ce
    );

  box-shadow:
    0 8px 24px rgba(30,68,111,.06);
}

body.it-page .breadcrumb{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:9px;

  color:#5f7482;

  font-size:.83rem;
  font-weight:750;
}

body.it-page .breadcrumb a{
  transition:var(--it-transition);
}

body.it-page .breadcrumb a:hover{
  color:var(--it-primary);
}

body.it-page .breadcrumb span{
  color:var(--it-secondary-dark);
}

body.it-page .breadcrumb strong{
  color:var(--it-heading);
}


/*==================================================
BUTTONS
==================================================*/

body.it-page .button{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:9px;

  min-height:49px;
  padding:13px 22px;

  border:1px solid transparent;
  border-radius:14px;

  cursor:pointer;

  font-size:.91rem;
  font-weight:850;
  line-height:1.25;
  text-align:center;

  transition:var(--it-transition);
}

body.it-page .button:hover{
  transform:translateY(-3px);
}

body.it-page .button-primary{
  color:#f3f8ff;

  background:
    linear-gradient(
      135deg,
      var(--it-primary),
      var(--it-primary-dark)
    );

  box-shadow:
    0 12px 27px rgba(24,89,201,.23);
}

body.it-page .button-primary:hover{
  box-shadow:
    0 17px 34px rgba(24,89,201,.31);
}

body.it-page .button-secondary{
  color:#3f2d08;

  background:
    linear-gradient(
      135deg,
      #eeb84c,
      #ce8519
    );

  box-shadow:
    0 12px 27px rgba(160,105,13,.20);
}

body.it-page .button-outline{
  color:var(--it-primary-dark);

  border-color:rgba(24,89,201,.27);

  background:
    linear-gradient(
      145deg,
      #e3ebf7,
      #f1e2cb
    );
}

body.it-page .section-buttons{
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  gap:14px;

  margin-top:42px;
}


/*==================================================
HERO
==================================================*/

body.it-page .hero-section{
  position:relative;
  isolation:isolate;
  overflow:hidden;

  min-height:620px;
  padding:clamp(76px, 9vw, 120px) 0;

  background:
    radial-gradient(
      circle at 84% 16%,
      rgba(216,157,49,.23),
      transparent 30%
    ),
    radial-gradient(
      circle at 10% 88%,
      rgba(17,123,121,.10),
      transparent 29%
    ),
    linear-gradient(
      135deg,
      #dce7f7,
      #f1dfc1
    );
}

body.it-page .hero-section::before{
  content:"";

  position:absolute;
  top:-155px;
  right:-110px;

  width:400px;
  height:400px;

  border:58px solid rgba(24,89,201,.065);
  border-radius:50%;

  animation:
    itHeroRing 9s ease-in-out infinite alternate;
}

body.it-page .hero-section::after{
  content:"";

  position:absolute;
  bottom:-95px;
  left:-75px;

  width:255px;
  height:255px;

  border-radius:36% 64% 58% 42%;

  background:
    linear-gradient(
      135deg,
      rgba(216,157,49,.12),
      rgba(24,89,201,.09)
    );

  transform:rotate(17deg);

  animation:
    itHeroShape 11s ease-in-out infinite alternate;
}

@keyframes itHeroRing{

  to{
    transform:
      translate(-34px, 28px)
      rotate(18deg);
  }

}

@keyframes itHeroShape{

  to{
    transform:
      translate(25px, -22px)
      rotate(37deg);
  }

}

body.it-page .hero-layout{
  position:relative;
  z-index:2;

  display:grid;
  grid-template-columns:
    minmax(0, 1.07fr)
    minmax(330px, .93fr);

  align-items:center;
  gap:clamp(40px, 7vw, 82px);
}

body.it-page .hero-content{
  min-width:0;
}

body.it-page .hero-badge{
  display:inline-flex;
  align-items:center;
  gap:9px;

  margin-bottom:18px;
  padding:9px 16px;

  border:1px solid rgba(24,89,201,.20);
  border-radius:999px;

  color:var(--it-primary-dark);
  background:#dce7f8;

  font-size:.77rem;
  font-weight:900;
  letter-spacing:1.3px;
  text-transform:uppercase;
}

body.it-page .hero-badge::before{
  content:"";

  width:8px;
  height:8px;

  border-radius:50%;

  background:var(--it-secondary);

  box-shadow:
    0 0 0 6px rgba(216,157,49,.15);
}

body.it-page .hero-content h1{
  margin:0 0 20px;

  color:var(--it-heading);

  font-size:clamp(2.7rem, 6vw, 5.2rem);
  line-height:1.02;
  letter-spacing:-3px;
}

body.it-page .hero-content > p{
  max-width:690px;
  margin:0;

  color:#4c6879;

  font-size:clamp(1rem, 1.8vw, 1.16rem);
}

body.it-page .hero-actions{
  display:flex;
  flex-wrap:wrap;
  gap:14px;

  margin-top:31px;
}

body.it-page .hero-trust-list{
  display:grid;
  grid-template-columns:
    repeat(4, minmax(0, 1fr));

  gap:11px;
  margin-top:33px;
}

body.it-page .hero-trust-item{
  min-width:0;
  padding:14px 10px;

  border:1px solid rgba(24,89,201,.14);
  border-radius:15px;

  text-align:center;

  background:
    linear-gradient(
      145deg,
      #e7eef9,
      #f4e7d0
    );
}

body.it-page .hero-trust-item strong{
  display:block;

  color:var(--it-primary-dark);

  font-size:.98rem;
}

body.it-page .hero-trust-item span{
  display:block;
  margin-top:3px;

  color:var(--it-muted);

  font-size:.68rem;
  font-weight:800;
  line-height:1.3;
}

body.it-page .hero-card{
  position:relative;

  min-width:0;
  padding:15px;

  border:1px solid rgba(24,89,201,.18);
  border-radius:30px;

  background:
    linear-gradient(
      145deg,
      #e5ecf8,
      #f3e2c6
    );

  box-shadow:
    0 32px 70px rgba(30,68,111,.18);

  transform:rotate(1.2deg);
}

body.it-page .hero-card::before{
  content:"Technology Careers";

  position:absolute;
  z-index:3;
  right:-15px;
  bottom:28px;

  padding:10px 15px;

  border-radius:13px;

  color:#f4f8ff;

  background:
    linear-gradient(
      135deg,
      var(--it-primary),
      var(--it-primary-dark)
    );

  font-size:.76rem;
  font-weight:900;
  letter-spacing:.4px;

  box-shadow:
    0 13px 28px rgba(24,89,201,.25);
}

body.it-page .hero-card img{
  width:100%;
  min-height:420px;
  object-fit:cover;

  border-radius:20px;
}


/*==================================================
COMMON SECTIONS
==================================================*/

body.it-page .section{
  position:relative;
  isolation:isolate;

  padding:clamp(70px, 8vw, 108px) 0;

  border-top:1px solid rgba(24,89,201,.06);
  border-bottom:1px solid rgba(216,157,49,.07);

  background:
    radial-gradient(
      circle at 90% 10%,
      rgba(24,89,201,.08),
      transparent 27%
    ),
    linear-gradient(
      145deg,
      #e8eef7,
      #f3ebdf
    );
}

body.it-page .section:nth-of-type(even){
  background:
    radial-gradient(
      circle at 8% 85%,
      rgba(17,123,121,.07),
      transparent 26%
    ),
    linear-gradient(
      145deg,
      #f3eadc,
      #e5ecf5
    );
}

body.it-page .section-alt{
  background:
    radial-gradient(
      circle at 85% 12%,
      rgba(216,157,49,.13),
      transparent 28%
    ),
    radial-gradient(
      circle at 5% 80%,
      rgba(24,89,201,.09),
      transparent 25%
    ),
    linear-gradient(
      135deg,
      #e2eaf6,
      #f1e4cf
    ) !important;
}

body.it-page .section-title{
  max-width:790px;
  margin:0 auto 45px;

  text-align:center;
}

body.it-page .section-title > span{
  display:inline-flex;

  margin-bottom:12px;
  padding:8px 15px;

  border:1px solid rgba(24,89,201,.18);
  border-radius:999px;

  color:var(--it-primary-dark);
  background:rgba(220,231,249,.86);

  font-size:.75rem;
  font-weight:900;
  letter-spacing:1.7px;
  text-transform:uppercase;
}

body.it-page .section-title h2{
  margin:0 0 14px;

  color:var(--it-heading);

  font-size:clamp(2rem, 4.5vw, 3.3rem);
  line-height:1.14;
  letter-spacing:-1.4px;
}

body.it-page .section-title p{
  max-width:690px;
  margin:0 auto;

  color:var(--it-muted);

  font-size:1rem;
}


/*==================================================
IT JOB SEARCH TOOLBAR
==================================================*/

.it-job-toolbar{
  display:grid;
  grid-template-columns:
    minmax(0, 1.35fr)
    repeat(5, minmax(145px, .55fr));

  gap:14px;

  margin-bottom:24px;
  padding:19px;

  border:1px solid var(--it-border);
  border-radius:22px;

  background:
    radial-gradient(
      circle at 94% 8%,
      rgba(216,157,49,.11),
      transparent 27%
    ),
    linear-gradient(
      145deg,
      #e1e9f5,
      #f2e3ca
    );

  box-shadow:
    0 15px 36px rgba(30,68,111,.08);
}

.it-filter-group{
  min-width:0;
}

.it-filter-group label{
  display:block;

  margin-bottom:7px;

  color:var(--it-heading);

  font-size:.75rem;
  font-weight:850;
  line-height:1.35;
}

.it-filter-control{
  width:100%;
  min-height:50px;
  padding:12px 14px;

  border:1px solid rgba(24,89,201,.19);
  border-radius:13px;

  color:var(--it-heading);
  background:#eaf0f8;

  outline:none;

  transition:
    border-color .25s ease,
    box-shadow .25s ease,
    background .25s ease;
}

.it-filter-control::placeholder{
  color:#7a8c98;
}

.it-filter-control:focus{
  border-color:var(--it-primary);
  background:#edf3fb;

  box-shadow:
    0 0 0 4px rgba(24,89,201,.10);
}


/*==================================================
RESULTS BAR
==================================================*/

.it-results-bar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;

  margin-bottom:22px;

  color:var(--it-muted);

  font-size:.84rem;
  font-weight:750;
}

.it-results-bar strong{
  color:var(--it-primary-dark);
}


/*==================================================
IT JOB CARDS
==================================================*/

.it-job-grid{
  display:grid;
  grid-template-columns:
    repeat(3, minmax(0, 1fr));

  gap:21px;
}

.it-job-card{
  position:relative;
  isolation:isolate;
  overflow:hidden;

  display:flex;
  flex-direction:column;

  min-width:0;
  min-height:485px;
  padding:25px;

  border:1px solid var(--it-border);
  border-radius:24px;

  background:
    radial-gradient(
      circle at 92% 8%,
      rgba(216,157,49,.12),
      transparent 28%
    ),
    linear-gradient(
      145deg,
      #e9eff8,
      #f6ead6
    );

  box-shadow:var(--it-shadow);

  transition:var(--it-transition);
}

.it-job-card::before{
  content:"";

  position:absolute;
  z-index:-1;
  right:-75px;
  bottom:-82px;

  width:180px;
  height:180px;

  border-radius:50%;

  background:rgba(24,89,201,.065);
}

.it-job-card:hover{
  transform:translateY(-8px);

  border-color:rgba(24,89,201,.34);

  box-shadow:var(--it-shadow-hover);
}

.it-job-top{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:15px;

  margin-bottom:17px;
}

.it-job-icon{
  display:grid;
  place-items:center;

  width:60px;
  height:60px;

  border:1px solid rgba(24,89,201,.13);
  border-radius:18px;

  background:
    linear-gradient(
      135deg,
      #d7e3f7,
      #efd083
    );

  font-size:1.65rem;
}

.it-job-badge{
  display:inline-flex;
  align-items:center;

  padding:6px 10px;

  border-radius:999px;

  color:#1f6750;
  background:rgba(38,113,86,.11);

  font-size:.62rem;
  font-weight:900;
  letter-spacing:.5px;
  text-transform:uppercase;
}

.it-job-card h3{
  margin:0 0 6px;

  color:var(--it-heading);

  font-size:1.18rem;
  line-height:1.3;
}

.it-job-company{
  margin:0 0 14px;

  color:var(--it-primary-dark);

  font-size:.78rem;
  font-weight:900;
}

.it-job-description{
  margin:0 0 17px;

  color:var(--it-muted);

  font-size:.83rem;
  line-height:1.58;
}

.it-job-meta{
  display:grid;
  gap:9px;

  margin-bottom:18px;
}

.it-job-meta span{
  display:flex;
  align-items:flex-start;
  gap:8px;

  color:#5a7180;

  font-size:.75rem;
  line-height:1.42;
}

.it-job-tags{
  display:flex;
  flex-wrap:wrap;
  gap:7px;

  margin-bottom:20px;
}

.it-job-tags span{
  padding:6px 9px;

  border:1px solid rgba(24,89,201,.14);
  border-radius:999px;

  color:#566c7b;
  background:rgba(220,231,249,.76);

  font-size:.64rem;
  font-weight:800;
}

.it-job-card .button{
  position:relative;
  z-index:2;

  width:100%;
  margin-top:auto;
}


/*==================================================
JOB STATES
==================================================*/

.it-loading-state,
.it-empty-state,
.it-error-state{
  grid-column:1 / -1;

  padding:32px;

  border:1px dashed rgba(24,89,201,.30);
  border-radius:20px;

  color:var(--it-heading);

  background:
    linear-gradient(
      145deg,
      #e3eaf5,
      #f1e3cc
    );

  text-align:center;
  font-weight:800;
}

.it-loading-state::before{
  content:"";

  display:inline-block;

  width:18px;
  height:18px;
  margin-right:10px;

  border:3px solid rgba(24,89,201,.22);
  border-top-color:var(--it-primary);
  border-radius:50%;

  vertical-align:-4px;

  animation:
    itLoader .75s linear infinite;
}

.it-error-state{
  color:#743347;

  border-color:rgba(163,62,85,.27);

  background:
    linear-gradient(
      145deg,
      #f1e2e6,
      #f2e5d2
    );
}

@keyframes itLoader{

  to{
    transform:rotate(360deg);
  }

}


/*==================================================
POPULAR IT ROLES
==================================================*/

.it-role-grid{
  display:grid;
  grid-template-columns:
    repeat(3, minmax(0, 1fr));

  gap:21px;
}

.it-role-card{
  position:relative;
  isolation:isolate;
  overflow:hidden;

  display:flex;
  flex-direction:column;

  min-width:0;
  min-height:420px;
  padding:25px;

  border:1px solid var(--it-border);
  border-radius:23px;

  background:
    radial-gradient(
      circle at 92% 8%,
      rgba(216,157,49,.12),
      transparent 28%
    ),
    linear-gradient(
      145deg,
      #e8eef8,
      #f5e8d3
    );

  box-shadow:
    0 17px 42px rgba(30,68,111,.09);

  transition:var(--it-transition);
}

.it-role-card::after{
  content:"";

  position:absolute;
  z-index:-1;
  right:-72px;
  bottom:-78px;

  width:175px;
  height:175px;

  border-radius:50%;

  background:rgba(24,89,201,.065);
}

.it-role-card:hover{
  transform:translateY(-7px);

  border-color:rgba(24,89,201,.34);

  box-shadow:var(--it-shadow-hover);
}

.it-role-icon{
  display:grid;
  place-items:center;

  width:60px;
  height:60px;
  margin-bottom:16px;

  border-radius:18px;

  background:
    linear-gradient(
      135deg,
      #d7e3f7,
      #efd083
    );

  font-size:1.65rem;
}

.it-role-level{
  display:inline-flex;
  align-self:flex-start;

  margin-bottom:10px;
  padding:6px 10px;

  border-radius:999px;

  color:var(--it-primary-dark);
  background:rgba(24,89,201,.10);

  font-size:.63rem;
  font-weight:900;
  letter-spacing:.4px;
  text-transform:uppercase;
}

.it-role-card h3{
  margin:0 0 9px;

  color:var(--it-heading);

  font-size:1.14rem;
  line-height:1.3;
}

.it-role-card > p{
  margin:0 0 16px;

  color:var(--it-muted);

  font-size:.83rem;
  line-height:1.58;
}

.it-role-card ul{
  display:grid;
  gap:8px;

  margin-bottom:20px;
}

.it-role-card li{
  position:relative;

  padding-left:21px;

  color:#586f7d;

  font-size:.77rem;
  font-weight:700;
}

.it-role-card li::before{
  content:"✓";

  position:absolute;
  left:0;

  color:var(--it-primary);

  font-weight:950;
}

.it-role-card .button{
  width:100%;
  margin-top:auto;
}


/*==================================================
ELIGIBILITY
==================================================*/

.it-info-grid{
  display:grid;
  grid-template-columns:
    repeat(3, minmax(0, 1fr));

  gap:21px;
}

.it-info-card{
  min-width:0;
  padding:27px;

  border:1px solid var(--it-border);
  border-radius:23px;

  background:
    linear-gradient(
      145deg,
      #e7edf7,
      #f5e8d3
    );

  box-shadow:
    0 17px 42px rgba(30,68,111,.09);
}

.it-info-icon{
  display:grid;
  place-items:center;

  width:60px;
  height:60px;
  margin-bottom:19px;

  border-radius:18px;

  background:
    linear-gradient(
      135deg,
      #d7e3f7,
      #efd083
    );

  font-size:1.65rem;
}

.it-info-card h3{
  margin:0 0 12px;

  color:var(--it-heading);

  font-size:1.17rem;
}

.it-info-list{
  display:grid;
  gap:9px;
}

.it-info-list li{
  position:relative;

  padding-left:22px;

  color:#586f7d;

  font-size:.79rem;
  font-weight:700;
  line-height:1.5;
}

.it-info-list li::before{
  content:"✓";

  position:absolute;
  left:0;

  color:var(--it-primary);

  font-weight:950;
}


/*==================================================
IT SKILLS
==================================================*/

.it-skills-grid{
  display:grid;
  grid-template-columns:
    repeat(4, minmax(0, 1fr));

  gap:19px;
}

.it-skill-card{
  min-width:0;
  padding:24px;

  border:1px solid var(--it-border);
  border-radius:21px;

  background:
    linear-gradient(
      145deg,
      #e7edf7,
      #f4e7d1
    );

  box-shadow:
    0 14px 35px rgba(30,68,111,.08);

  transition:var(--it-transition);
}

.it-skill-card:hover{
  transform:translateY(-6px);

  box-shadow:
    0 21px 46px rgba(30,68,111,.13);
}

.it-skill-icon{
  display:grid;
  place-items:center;

  width:54px;
  height:54px;
  margin-bottom:16px;

  border-radius:16px;

  background:
    linear-gradient(
      135deg,
      #d7e3f7,
      #efd083
    );

  font-size:1.45rem;
}

.it-skill-card h3{
  margin:0 0 8px;

  color:var(--it-heading);

  font-size:.98rem;
  line-height:1.3;
}

.it-skill-card p{
  margin:0;

  color:var(--it-muted);

  font-size:.76rem;
  line-height:1.55;
}


/*==================================================
SALARY
==================================================*/

.it-salary-section{
  background:
    radial-gradient(
      circle at 12% 15%,
      rgba(17,123,121,.10),
      transparent 28%
    ),
    linear-gradient(
      145deg,
      #e2eaf5,
      #f1e7d8
    ) !important;
}

.it-salary-grid{
  display:grid;
  grid-template-columns:
    repeat(4, minmax(0, 1fr));

  gap:19px;
}

.it-salary-card{
  min-width:0;
  padding:25px;

  border:1px solid var(--it-border);
  border-radius:22px;

  background:
    linear-gradient(
      145deg,
      #e7edf7,
      #f5e7d0
    );

  box-shadow:
    0 15px 38px rgba(30,68,111,.09);
}

.it-salary-card span{
  display:inline-flex;

  padding:6px 10px;

  border-radius:999px;

  color:var(--it-primary-dark);
  background:rgba(24,89,201,.10);

  font-size:.64rem;
  font-weight:900;
  text-transform:uppercase;
}

.it-salary-card h3{
  margin:13px 0 9px;

  color:var(--it-heading);

  font-size:1.4rem;
  line-height:1.2;
}

.it-salary-card p{
  margin:0;

  color:var(--it-muted);

  font-size:.76rem;
  line-height:1.55;
}

.it-salary-note{
  display:grid;
  grid-template-columns:auto minmax(0, 1fr);
  gap:13px;

  margin-top:22px;
  padding:18px;

  border:1px solid rgba(216,157,49,.22);
  border-radius:17px;

  color:#6c531e;
  background:rgba(246,229,185,.66);
}

.it-salary-note span{
  font-size:1.2rem;
}

.it-salary-note p{
  margin:0;

  font-size:.79rem;
  line-height:1.6;
}


/*==================================================
CAREER GROWTH
==================================================*/

.it-growth-grid{
  display:grid;
  grid-template-columns:
    repeat(4, minmax(0, 1fr));

  gap:19px;
}

.it-growth-card{
  position:relative;

  min-width:0;
  padding:26px;

  border:1px solid var(--it-border);
  border-radius:22px;

  background:
    linear-gradient(
      145deg,
      #e7edf7,
      #f4e7d1
    );

  box-shadow:
    0 15px 38px rgba(30,68,111,.09);
}

.it-growth-number{
  position:absolute;
  top:17px;
  right:17px;

  display:grid;
  place-items:center;

  width:37px;
  height:37px;

  border-radius:50%;

  color:#f3f8ff;
  background:var(--it-primary);

  font-size:.77rem;
  font-weight:900;
}

.it-growth-icon{
  display:grid;
  place-items:center;

  width:55px;
  height:55px;
  margin-bottom:18px;

  border-radius:17px;

  background:
    linear-gradient(
      135deg,
      #d7e3f7,
      #efd083
    );

  font-size:1.5rem;
}

.it-growth-card h3{
  margin:0 0 8px;

  color:var(--it-heading);

  font-size:1.02rem;
  line-height:1.3;
}

.it-growth-card p{
  margin:0;

  color:var(--it-muted);

  font-size:.77rem;
  line-height:1.55;
}


/*==================================================
WORK ARRANGEMENTS
==================================================*/

.it-work-section{
  background:
    radial-gradient(
      circle at 90% 10%,
      rgba(216,157,49,.12),
      transparent 28%
    ),
    linear-gradient(
      145deg,
      #e1e9f5,
      #eee5d8
    ) !important;
}

.it-work-grid{
  display:grid;
  grid-template-columns:
    repeat(4, minmax(0, 1fr));

  gap:19px;
}

.it-work-card{
  min-width:0;
  padding:25px;

  border:1px solid var(--it-border);
  border-radius:22px;

  background:
    linear-gradient(
      145deg,
      #e7edf7,
      #f4e7d1
    );

  box-shadow:
    0 15px 38px rgba(30,68,111,.09);

  transition:var(--it-transition);
}

.it-work-card:hover{
  transform:translateY(-6px);

  box-shadow:
    0 22px 48px rgba(30,68,111,.14);
}

.it-work-icon{
  display:grid;
  place-items:center;

  width:56px;
  height:56px;
  margin-bottom:17px;

  border-radius:17px;

  background:
    linear-gradient(
      135deg,
      #d7e3f7,
      #efd083
    );

  font-size:1.52rem;
}

.it-work-card h3{
  margin:0 0 8px;

  color:var(--it-heading);

  font-size:1.06rem;
  line-height:1.3;
}

.it-work-card p{
  margin:0;

  color:var(--it-muted);

  font-size:.78rem;
  line-height:1.55;
}


/*==================================================
FAQ
==================================================*/

body.it-page .faq-list{
  display:grid;
  gap:14px;

  max-width:900px;
  margin:0 auto;
}

body.it-page .faq-item{
  overflow:hidden;

  border:1px solid var(--it-border);
  border-radius:18px;

  background:
    linear-gradient(
      145deg,
      #e8eef8,
      #f5e9d7
    );

  box-shadow:
    0 10px 30px rgba(30,68,111,.07);
}

body.it-page .faq-question{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;

  width:100%;
  min-height:70px;
  padding:18px 21px;

  cursor:pointer;

  color:var(--it-heading);
  background:transparent;

  font-weight:850;
  line-height:1.45;
  text-align:left;
}

body.it-page .faq-question i{
  flex:0 0 auto;

  display:grid;
  place-items:center;

  width:34px;
  height:34px;

  border-radius:50%;

  color:#f3f8ff;
  background:var(--it-primary);

  font-size:1.25rem;
  font-style:normal;

  transition:
    transform .25s ease,
    background .25s ease;
}

body.it-page .faq-answer{
  display:grid;
  grid-template-rows:0fr;

  transition:grid-template-rows .32s ease;
}

body.it-page .faq-answer-inner{
  overflow:hidden;
}

body.it-page .faq-answer p{
  margin:0;
  padding:0 21px;

  color:var(--it-muted);

  transition:padding .32s ease;
}

body.it-page .faq-item.active .faq-answer{
  grid-template-rows:1fr;
}

body.it-page .faq-item.active .faq-answer p{
  padding:0 21px 21px;
}

body.it-page .faq-item.active .faq-question i{
  transform:rotate(45deg);
  background:var(--it-secondary-dark);
}


/*==================================================
CTA
==================================================*/

.it-cta-box{
  display:grid;
  grid-template-columns:
    minmax(0, 1fr)
    auto;

  align-items:center;
  gap:28px;

  padding:42px;

  border:1px solid rgba(24,89,201,.20);
  border-radius:30px;

  background:
    radial-gradient(
      circle at 92% 15%,
      rgba(216,157,49,.21),
      transparent 31%
    ),
    linear-gradient(
      135deg,
      #dce7f7,
      #f2dfbd
    );

  box-shadow:
    0 24px 60px rgba(30,68,111,.13);
}

.it-cta-content > span{
  display:block;
  margin-bottom:8px;

  color:var(--it-primary-dark);

  font-size:.75rem;
  font-weight:900;
  letter-spacing:1.5px;
  text-transform:uppercase;
}

.it-cta-content h2{
  margin:0 0 10px;

  color:var(--it-heading);

  font-size:clamp(1.8rem, 4vw, 3rem);
  line-height:1.15;
}

.it-cta-content p{
  margin:0;

  color:#596f7d;
}

.it-cta-actions{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
}


/*==================================================
FOOTER
==================================================*/

body.it-page .footer{
  position:relative;
  overflow:hidden;

  padding:
    70px 0
    calc(32px + env(safe-area-inset-bottom));

  color:#f5edf1;

  background:
    radial-gradient(
      circle at 12% 10%,
      rgba(54,91,171,.22),
      transparent 30%
    ),
    radial-gradient(
      circle at 88% 88%,
      rgba(11,119,128,.24),
      transparent 34%
    ),
    linear-gradient(
      145deg,
      #1a2944,
      #192b31
    );
}

body.it-page .footer-grid{
  display:grid;
  grid-template-columns:
    repeat(2, minmax(0, 1fr));

  gap:34px 24px;
}

body.it-page .footer-column{
  min-width:0;
}

body.it-page .footer-column h3{
  display:flex;
  align-items:center;
  gap:10px;

  margin:0 0 15px;

  color:#5cc8cf;

  font-size:1.1rem;
}

body.it-page .footer-column h3::before{
  display:grid;
  place-items:center;

  flex:0 0 auto;

  width:42px;
  height:42px;

  border:1px solid rgba(255,255,255,.17);
  border-radius:12px;

  background:rgba(255,255,255,.07);
}

body.it-page .footer-column:nth-child(1) h3::before{
  content:"💼";
}

body.it-page .footer-column:nth-child(2) h3::before{
  content:"💻";
}

body.it-page .footer-column:nth-child(3) h3::before{
  content:"📂";
}

body.it-page .footer-column:nth-child(4) h3::before{
  content:"🛡️";
}

body.it-page .footer-links{
  display:grid;
  grid-template-columns:
    repeat(2, minmax(0, 1fr));

  gap:10px;
}

body.it-page .footer-links a{
  display:flex;
  align-items:center;
  gap:10px;

  min-height:62px;
  padding:11px 13px;

  border:1px solid rgba(255,255,255,.16);
  border-radius:15px;

  color:#f8f1f4;
  background:rgba(255,255,255,.06);

  font-size:.81rem;
  font-weight:750;
  line-height:1.3;

  transition:var(--it-transition);
}

body.it-page .footer-links a:hover{
  transform:translateY(-3px);

  border-color:rgba(92,200,207,.45);
}

body.it-page .footer-links a::before{
  content:"↗";

  display:grid;
  place-items:center;

  flex:0 0 auto;

  width:33px;
  height:33px;

  border-radius:10px;

  background:rgba(255,255,255,.08);
}

body.it-page .footer-bottom{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;

  margin-top:44px;
  padding-top:28px;

  border-top:1px solid rgba(255,255,255,.14);
}

body.it-page .footer-bottom p{
  margin:0;

  color:#d7dce5;

  font-size:.82rem;
  font-weight:700;
}

body.it-page .footer-bottom-links{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
}

body.it-page .footer-bottom-links a{
  color:#e6e8ee;

  font-size:.8rem;
  font-weight:750;
}


/*==================================================
LARGE TABLET
==================================================*/

@media (max-width:1180px){

  .it-job-toolbar{
    grid-template-columns:
      repeat(3, minmax(0, 1fr));
  }

  .it-search-group{
    grid-column:1 / -1;
  }

}


/*==================================================
TABLET
==================================================*/

@media (max-width:1024px){

  body.it-page .hero-layout{
    grid-template-columns:
      minmax(0, 1fr)
      minmax(300px, .82fr);
  }

  body.it-page .hero-trust-list{
    grid-template-columns:
      repeat(2, minmax(0, 1fr));
  }

  .it-job-grid,
  .it-role-grid{
    grid-template-columns:
      repeat(2, minmax(0, 1fr));
  }

  .it-skills-grid,
  .it-salary-grid,
  .it-growth-grid,
  .it-work-grid{
    grid-template-columns:
      repeat(2, minmax(0, 1fr));
  }

}


/*==================================================
MOBILE AND SMALL TABLET
==================================================*/

@media (max-width:760px){

  body.it-page .container{
    width:min(100% - 28px, 1180px);
  }

  body.it-page .hero-section{
    min-height:auto;
    padding:65px 0 75px;
  }

  body.it-page .hero-layout{
    grid-template-columns:1fr;
    gap:38px;
  }

  body.it-page .hero-content{
    text-align:center;
  }

  body.it-page .hero-badge{
    margin-inline:auto;
  }

  body.it-page .hero-content h1{
    font-size:clamp(2.4rem, 13vw, 4.1rem);
    letter-spacing:-1.8px;
  }

  body.it-page .hero-content > p{
    margin-inline:auto;
  }

  body.it-page .hero-actions{
    justify-content:center;
  }

  body.it-page .hero-actions .button{
    flex:1 1 190px;
  }

  body.it-page .hero-card{
    width:min(100%, 520px);
    margin-inline:auto;

    transform:none;
  }

  body.it-page .hero-card img{
    min-height:310px;
  }

  body.it-page .hero-card::before{
    right:12px;
    bottom:22px;
  }

  .it-job-toolbar{
    grid-template-columns:1fr;
  }

  .it-search-group{
    grid-column:auto;
  }

  .it-job-grid,
  .it-role-grid,
  .it-info-grid{
    grid-template-columns:1fr;
  }

  .it-cta-box{
    grid-template-columns:1fr;

    text-align:center;
  }

  .it-cta-actions{
    justify-content:center;
  }

  body.it-page .footer-grid{
    grid-template-columns:
      repeat(2, minmax(0, 1fr));
  }

  body.it-page .footer-links{
    grid-template-columns:1fr;
  }

  body.it-page .footer-bottom{
    flex-direction:column;
    align-items:flex-start;
  }

}


/*==================================================
SMALL MOBILE
==================================================*/

@media (max-width:480px){

  body.it-page .container{
    width:min(100% - 22px, 1180px);
  }

  body.it-page .hero-actions{
    display:grid;
    grid-template-columns:1fr;
  }

  body.it-page .hero-content h1{
    font-size:2.45rem;
    line-height:1.06;
  }

  body.it-page .hero-card{
    padding:10px;
    border-radius:22px;
  }

  body.it-page .hero-card img{
    min-height:250px;
    border-radius:15px;
  }

  .it-results-bar{
    align-items:flex-start;
    flex-direction:column;
  }

  .it-results-bar .button{
    width:100%;
  }

  .it-skills-grid,
  .it-salary-grid,
  .it-growth-grid,
  .it-work-grid{
    grid-template-columns:1fr;
  }

  .it-job-card,
  .it-role-card,
  .it-info-card,
  .it-skill-card,
  .it-salary-card,
  .it-growth-card,
  .it-work-card{
    padding:22px 19px;
    border-radius:19px;
  }

  .it-salary-note{
    grid-template-columns:1fr;
  }

  .it-cta-box{
    padding:28px 20px;
    border-radius:22px;
  }

  .it-cta-actions{
    display:grid;
    grid-template-columns:1fr;
  }

  .it-cta-actions .button{
    width:100%;
  }

  body.it-page .footer-grid{
    gap:27px 14px;
  }

  body.it-page .footer-links a{
    padding:9px;
    font-size:.74rem;
  }

}


/*==================================================
VERY SMALL DEVICES
==================================================*/

@media (max-width:350px){

  body.it-page .hero-trust-list,
  body.it-page .footer-grid{
    grid-template-columns:1fr;
  }

}


/*==================================================
REDUCED MOTION
==================================================*/

@media (prefers-reduced-motion:reduce){

  *,
  *::before,
  *::after{
    scroll-behavior:auto !important;
    animation-duration:.01ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.01ms !important;
  }

}

/*==================================================
UNIVERSITIES PAGE
FAQ + FOOTER MOBILE OVERRIDE
Makes second screenshot closer to first screenshot
==================================================*/


/*==================================================
FAQ SECTION BACKGROUND
==================================================*/

.universities-page .universities-faq-section{
  position:relative;
  isolation:isolate;
  overflow:hidden;

  padding:
    70px
    0
    46px;

  background:
    radial-gradient(
      circle at 88% 10%,
      rgba(118,92,156,.16),
      transparent 31%
    ),
    radial-gradient(
      circle at 8% 84%,
      rgba(41,108,116,.11),
      transparent 34%
    ),
    linear-gradient(
      145deg,
      #e9e7f3,
      #e3edf0 52%,
      #e7ecef
    ) !important;
}


.universities-page .universities-faq-section::before{
  content:"";

  position:absolute;
  z-index:-1;

  width:360px;
  height:360px;

  top:-180px;
  right:-150px;

  border-radius:50%;

  background:
    rgba(122,92,158,.08);

  filter:blur(10px);
}


/*==================================================
FAQ LAYOUT
==================================================*/

.universities-page .universities-faq-section .faq-layout{
  display:grid;
  grid-template-columns:
    minmax(250px,.7fr)
    minmax(0,1.3fr);

  align-items:start;
  gap:28px;
}


/*==================================================
FAQ INTRODUCTION CARD
==================================================*/

.universities-page .universities-faq-section .faq-introduction{
  position:sticky;
  top:24px;

  padding:25px;

  border:
    1px solid rgba(255,255,255,.18);
  border-radius:24px;

  background:
    linear-gradient(
      145deg,
      rgba(25,39,57,.96),
      rgba(30,58,67,.95)
    );

  box-shadow:
    0 20px 50px rgba(15,29,42,.22);
}


.universities-page .universities-faq-section .faq-introduction h2{
  margin:
    8px
    0
    12px;

  color:#f2f5f7;
}


.universities-page .universities-faq-section .faq-introduction > p{
  margin:0;

  color:#c6d1d8;

  line-height:1.7;
}


.universities-page .universities-faq-section .faq-support-card{
  margin-top:22px;
  padding:20px;

  border:
    1px solid rgba(255,255,255,.12);
  border-radius:18px;

  background:
    linear-gradient(
      145deg,
      rgba(255,255,255,.07),
      rgba(255,255,255,.03)
    );

  box-shadow:none;
}


.universities-page .universities-faq-section .faq-support-card h3{
  color:#f5f7f9;
}


.universities-page .universities-faq-section .faq-support-card p{
  color:#c5d1d8;
}


.universities-page .universities-faq-section .faq-support-icon{
  color:#d6b45a;

  background:
    rgba(214,180,90,.12);
}


/*==================================================
FAQ LIST
==================================================*/

.universities-page .universities-faq-section .faq-list{
  display:grid;
  gap:12px;
}


/*==================================================
FAQ ITEM
==================================================*/

.universities-page .universities-faq-section .faq-item{
  overflow:hidden;

  border:
    1px solid rgba(255,255,255,.12) !important;
  border-radius:19px !important;

  background:
    linear-gradient(
      145deg,
      rgba(26,42,58,.98),
      rgba(31,61,70,.96)
    ) !important;

  box-shadow:
    0 12px 30px rgba(15,29,42,.14);

  transition:
    transform .28s ease,
    border-color .28s ease,
    box-shadow .28s ease;
}


.universities-page .universities-faq-section .faq-item:hover{
  transform:translateY(-2px);

  border-color:
    rgba(214,180,90,.34) !important;

  box-shadow:
    0 18px 38px rgba(15,29,42,.2);
}


.universities-page .universities-faq-section .faq-item.active{
  border-color:
    rgba(214,180,90,.42) !important;

  background:
    radial-gradient(
      circle at 94% 10%,
      rgba(214,180,90,.11),
      transparent 27%
    ),
    linear-gradient(
      145deg,
      #1c3042,
      #214451
    ) !important;
}


/*==================================================
FAQ QUESTION
==================================================*/

.universities-page .universities-faq-section .faq-question{
  width:100%;

  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;

  padding:
    20px
    21px;

  border:0 !important;
  border-radius:0 !important;

  color:#eef3f6 !important;

  background:transparent !important;

  font-size:.86rem;
  font-weight:800;
  line-height:1.45;
  text-align:left;

  cursor:pointer;
}


.universities-page .universities-faq-section .faq-question > span:first-child{
  min-width:0;
  flex:1;
}


.universities-page .universities-faq-section .faq-toggle-icon{
  width:34px;
  height:34px;

  display:grid;
  place-items:center;

  flex:0 0 34px;

  border-radius:10px;

  color:#d9bf75 !important;

  background:
    rgba(255,255,255,.07);

  transition:
    transform .28s ease,
    background .28s ease;
}


.universities-page .universities-faq-section .faq-item.active .faq-toggle-icon{
  transform:rotate(180deg);

  background:
    rgba(214,180,90,.13);
}


/*==================================================
FAQ ANSWER
==================================================*/

.universities-page .universities-faq-section .faq-answer{
  overflow:hidden;

  background:transparent !important;
}


.universities-page .universities-faq-section .accordion-content{
  padding:
    0
    21px
    21px;
}


.universities-page .universities-faq-section .accordion-content p{
  margin:0;

  color:#c5d2d9 !important;

  font-size:.72rem;
  line-height:1.75;
}


/*==================================================
REMOVE LARGE EMPTY SPACE AFTER FAQ
==================================================*/

.universities-page .universities-faq-section + footer,
.universities-page .universities-faq-section + .site-footer{
  margin-top:0 !important;
}


.universities-page .universities-faq-section{
  min-height:auto !important;
}


.universities-page main{
  padding-bottom:0 !important;
}


/*==================================================
FOOTER DARK PREMIUM STYLE
==================================================*/

.universities-page .site-footer{
  position:relative;
  overflow:hidden;

  margin-top:0 !important;

  color:#e7edf1;

  background:
    radial-gradient(
      circle at 92% 8%,
      rgba(80,140,151,.16),
      transparent 28%
    ),
    linear-gradient(
      145deg,
      #172536,
      #173642 50%,
      #18404b
    ) !important;
}


.universities-page .footer-top-section,
.universities-page .footer-main-section,
.universities-page .footer-bottom-section{
  background:transparent !important;
}


.universities-page .footer-main-section{
  border-top:
    1px solid rgba(255,255,255,.08);
}


.universities-page .footer-bottom-section{
  border-top:
    1px solid rgba(255,255,255,.10);
}


.universities-page .site-footer h2,
.universities-page .site-footer h3,
.universities-page .site-footer strong{
  color:#f3f6f8;
}


.universities-page .site-footer p,
.universities-page .site-footer small{
  color:#c7d2d8;
}


.universities-page .site-footer a{
  color:#dbe4e8;
}


.universities-page .site-footer a:hover{
  color:#e3c56e;
}


/*==================================================
FOOTER LINKS LIKE FIRST SCREENSHOT
==================================================*/

.universities-page .footer-main-grid{
  display:grid;
  grid-template-columns:
    repeat(4,minmax(0,1fr));

  gap:22px;
}


.universities-page .footer-link-column nav{
  display:grid;
  gap:10px;
}


.universities-page .footer-link-column nav a{
  display:flex;
  align-items:center;
  gap:10px;

  min-height:50px;

  padding:
    12px
    14px;

  border:
    1px solid rgba(255,255,255,.13);
  border-radius:14px;

  background:
    linear-gradient(
      145deg,
      rgba(255,255,255,.08),
      rgba(255,255,255,.035)
    );

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.04);

  font-size:.68rem;
  font-weight:700;

  transition:
    transform .25s ease,
    border-color .25s ease,
    background .25s ease;
}


.universities-page .footer-link-column nav a::before{
  content:"↗";

  width:28px;
  height:28px;

  display:grid;
  place-items:center;

  flex:0 0 28px;

  border-radius:9px;

  color:#eaf0f3;

  background:
    linear-gradient(
      145deg,
      rgba(111,160,177,.30),
      rgba(255,255,255,.08)
    );

  font-size:.7rem;
  font-weight:900;
}


.universities-page .footer-link-column nav a:hover{
  transform:translateY(-2px);

  border-color:
    rgba(227,197,110,.30);

  background:
    linear-gradient(
      145deg,
      rgba(255,255,255,.11),
      rgba(255,255,255,.055)
    );
}


/*==================================================
FOOTER CATALOG GRID
==================================================*/

.universities-page .footer-catalog-grid{
  display:grid;
  grid-template-columns:
    repeat(2,minmax(0,1fr));

  gap:10px;
}


.universities-page .footer-catalog-grid a{
  min-height:74px;

  display:flex;
  align-items:center;
  gap:10px;

  padding:13px;

  border:
    1px solid rgba(255,255,255,.13);
  border-radius:14px;

  background:
    linear-gradient(
      145deg,
      rgba(255,255,255,.08),
      rgba(255,255,255,.035)
    );
}


.universities-page .footer-catalog-grid i{
  width:30px;
  height:30px;

  display:grid;
  place-items:center;

  flex:0 0 30px;

  border-radius:9px;

  color:#e3c56e;

  background:
    rgba(255,255,255,.07);
}


/*==================================================
FOOTER BOTTOM
==================================================*/

.universities-page .footer-bottom-wrapper{
  display:flex;
  align-items:center;
  justify-content:space-between;
  flex-wrap:wrap;
  gap:16px;
}


.universities-page .footer-bottom-wrapper p{
  margin:0;

  color:#d3dce1;

  font-weight:700;
}


.universities-page .footer-bottom-links{
  display:flex;
  flex-wrap:wrap;
  gap:14px;
}


/*==================================================
MOBILE QUICK ACTION BAR
==================================================*/

.universities-page .mobile-quick-actions{
  border:
    1px solid rgba(83,58,125,.18);

  background:
    linear-gradient(
      145deg,
      rgba(236,233,244,.96),
      rgba(223,233,235,.96)
    ) !important;

  box-shadow:
    0 -12px 34px rgba(35,42,58,.13);
}


.universities-page .mobile-quick-actions a{
  color:#232b3d;
}


.universities-page .mobile-quick-actions a.active,
.universities-page .mobile-quick-actions .mobile-quick-action-main{
  color:#fff;

  background:
    linear-gradient(
      145deg,
      #593187,
      #35175f
    );

  box-shadow:
    0 10px 24px rgba(75,43,116,.24);
}


/*==================================================
BACK TO TOP FIX
==================================================*/

.universities-page .back-to-top{
  right:18px !important;
  bottom:105px !important;

  width:46px;
  height:46px;

  display:grid;
  place-items:center;

  border:
    1px solid rgba(255,255,255,.2);
  border-radius:14px;

  color:#fff;

  background:
    linear-gradient(
      145deg,
      #2d6871,
      #21444f
    );

  box-shadow:
    0 12px 28px rgba(24,53,62,.22);
}


/*==================================================
TABLET
==================================================*/

@media(max-width:991px){

  .universities-page .universities-faq-section .faq-layout{
    grid-template-columns:1fr;
  }

  .universities-page .universities-faq-section .faq-introduction{
    position:relative;
    top:auto;
  }

  .universities-page .footer-main-grid{
    grid-template-columns:
      repeat(2,minmax(0,1fr));
  }

}


/*==================================================
MOBILE
==================================================*/

@media(max-width:767px){

  .universities-page .universities-faq-section{
    padding:
      44px
      0
      28px;
  }

  .universities-page .universities-faq-section .faq-layout{
    gap:18px;
  }

  .universities-page .universities-faq-section .faq-introduction{
    padding:19px;

    border-radius:19px;
  }

  .universities-page .universities-faq-section .faq-question{
    padding:
      17px
      16px;

    font-size:.75rem;
  }

  .universities-page .universities-faq-section .faq-item{
    border-radius:16px !important;
  }

  .universities-page .universities-faq-section .accordion-content{
    padding:
      0
      16px
      17px;
  }

  .universities-page .universities-faq-section .accordion-content p{
    font-size:.64rem;
  }

  .universities-page .footer-main-grid{
    grid-template-columns:
      repeat(2,minmax(0,1fr));

    gap:16px 12px;
  }

  .universities-page .footer-link-column h3{
    margin-bottom:12px;

    font-size:.79rem;
  }

  .universities-page .footer-link-column nav{
    gap:8px;
  }

  .universities-page .footer-link-column nav a{
    min-height:54px;

    padding:
      10px
      11px;

    border-radius:13px;

    font-size:.59rem;
  }

  .universities-page .footer-link-column nav a::before{
    width:27px;
    height:27px;

    flex-basis:27px;
  }

  .universities-page .footer-catalog-grid{
    grid-template-columns:1fr;
  }

  .universities-page .footer-catalog-grid a{
    min-height:54px;

    padding:
      10px
      11px;

    font-size:.59rem;
  }

  .universities-page .footer-bottom-wrapper{
    align-items:flex-start;
    flex-direction:column;

    padding-bottom:
      calc(98px + env(safe-area-inset-bottom));
  }

  .universities-page .footer-bottom-wrapper p{
    font-size:.64rem;
    line-height:1.6;
  }

  .universities-page .footer-bottom-links{
    gap:11px;

    font-size:.58rem;
  }

}


/*==================================================
SMALL MOBILE
==================================================*/

@media(max-width:389px){

  .universities-page .footer-main-grid{
    grid-template-columns:1fr;
  }

  .universities-page .footer-catalog-grid{
    grid-template-columns:
      repeat(2,minmax(0,1fr));
  }

}

/*==================================================
BROCHURE PAGE
==================================================*/

/* brochure page styles here */


/*==================================================
BROCHURE PAGE
==================================================*/

body.brochure-page{

  background:
    linear-gradient(
      180deg,
      #f5f0fb 0%,
      #eef8f6 50%,
      #fff9ef 100%
    );

}


.hero{

  position:relative;

  overflow:hidden;

  padding:90px 0;

  background:
    radial-gradient(
      circle at 90% 15%,
      rgba(104,71,168,.15),
      transparent 32%
    ),
    linear-gradient(
      135deg,
      #6847a8,
      #0b8c82
    );

  color:#fff;

}


.hero-grid{

  display:grid;

  grid-template-columns:
    minmax(0,1.2fr)
    minmax(320px,.8fr);

  gap:42px;

  align-items:center;

}


.hero-panel{

  background:rgba(255,255,255,.12);

  backdrop-filter:blur(18px);

  border:1px solid rgba(255,255,255,.18);

  border-radius:26px;

  padding:28px;

}


.hero-list{

  display:grid;

  gap:18px;

  margin-top:22px;

}


.hero-list-item{

  display:flex;

  gap:14px;

  align-items:flex-start;

}


.hero-list-icon{

  width:52px;

  height:52px;

  border-radius:16px;

  display:grid;

  place-items:center;

  background:#ffffff22;

  font-size:24px;

}


.category-nav{

  display:flex;

  flex-wrap:wrap;

  gap:12px;

  justify-content:center;

  margin:35px 0;

}


.filter-button{

  border:none;

  border-radius:999px;

  padding:12px 22px;

  cursor:pointer;

  background:#ece7fb;

  color:#56329f;

  font-weight:700;

  transition:.25s;

}


.filter-button.active{

  background:#6847a8;

  color:#fff;

}


.brochure-search-panel{

  display:flex;

  gap:18px;

  flex-wrap:wrap;

  justify-content:space-between;

  align-items:center;

  margin:35px 0;

}


.brochure-search-field{

  flex:1;

  display:flex;

  align-items:center;

  gap:12px;

  background:#fff;

  border-radius:18px;

  border:1px solid rgba(104,71,168,.12);

  padding:14px 18px;

}


.brochure-search-field input{

  flex:1;

  border:none;

  background:none;

  outline:none;

}


.brochure-grid{

  display:grid;

  grid-template-columns:
    repeat(auto-fit,minmax(300px,1fr));

  gap:28px;

}


.brochure-card{

  display:flex;

  flex-direction:column;

  overflow:hidden;

  border-radius:24px;

  background:#fff;

  box-shadow:
    0 18px 40px rgba(0,0,0,.08);

  transition:.3s;

}


.brochure-card:hover{

  transform:translateY(-8px);

}


.brochure-cover{

  height:190px;

  display:grid;

  place-items:center;

  color:#fff;

  text-align:center;

}


.cover-content{

  padding:20px;

}


.cover-icon{

  display:grid;

  place-items:center;

  width:72px;

  height:72px;

  margin:0 auto 18px;

  border-radius:50%;

  background:#ffffff25;

  font-size:34px;

}


.cover-blue{

  background:linear-gradient(135deg,#0756a3,#3d8bff);

}

.cover-red{

  background:linear-gradient(135deg,#bb1f42,#ff6a6a);

}

.cover-green{

  background:linear-gradient(135deg,#198754,#5fd188);

}

.cover-purple{

  background:linear-gradient(135deg,#6847a8,#9d7dff);

}

.cover-orange{

  background:linear-gradient(135deg,#d97b12,#ffb347);

}

.cover-indigo{

  background:linear-gradient(135deg,#304ffe,#6b8cff);

}

.cover-dark{

  background:linear-gradient(135deg,#263238,#455a64);

}

.cover-gold{

  background:linear-gradient(135deg,#b7860b,#e6b800);

}

.cover-teal{

  background:linear-gradient(135deg,#00897b,#37c8b2);

}

.cover-pink{

  background:linear-gradient(135deg,#d63384,#ff85b5);

}


.brochure-body{

  display:flex;

  flex-direction:column;

  gap:18px;

  padding:24px;

  flex:1;

}


.brochure-list{

  margin:0;

  padding-left:20px;

  display:grid;

  gap:8px;

}


.brochure-actions{

  display:flex;

  gap:12px;

  flex-wrap:wrap;

  margin-top:auto;

}


.feature-grid{

  display:grid;

  grid-template-columns:
    repeat(auto-fit,minmax(240px,1fr));

  gap:24px;

}


.feature-card{

  background:#fff;

  border-radius:22px;

  padding:28px;

  text-align:center;

  box-shadow:
    0 12px 28px rgba(0,0,0,.07);

}


.steps-grid{

  display:grid;

  grid-template-columns:
    repeat(auto-fit,minmax(220px,1fr));

  gap:22px;

}


.step-card{

  background:#fff;

  border-radius:22px;

  padding:24px;

}


.step-number{

  width:50px;

  height:50px;

  border-radius:50%;

  display:grid;

  place-items:center;

  margin-bottom:16px;

  background:#6847a8;

  color:#fff;

  font-weight:700;

}


.enquiry-grid{

  display:grid;

  grid-template-columns:
    minmax(0,1fr)
    minmax(360px,.9fr);

  gap:40px;

  align-items:start;

}


.enquiry-form{

  background:#fff;

  border-radius:24px;

  padding:28px;

}


.form-grid{

  display:grid;

  gap:18px;

}


.disclaimer{

  padding:28px;

  border-radius:22px;

  background:#fff8e5;

  border-left:6px solid #e6a700;

}


.catalogue-empty-state{

  text-align:center;

  padding:60px 20px;

}


.catalogue-empty-icon{

  font-size:54px;

  margin-bottom:16px;

  color:#6847a8;

}


@media(max-width:900px){

.hero-grid,
.enquiry-grid{

grid-template-columns:1fr;

}

.hero{

padding:70px 0;

}

.hero-panel{

order:-1;

}

}


@media(max-width:640px){

.brochure-actions{

flex-direction:column;

}

.filter-button{

width:100%;

}

.brochure-search-panel{

flex-direction:column;

}

}


/*==================================================
SCHOLARSHIPS PAGE
==================================================*/

body.scholarships-page{
  overflow-x:hidden;
  color:#243b3f;
  background:
    radial-gradient(
      circle at 12% 8%,
      rgba(231,196,90,.14),
      transparent 28%
    ),
    radial-gradient(
      circle at 88% 20%,
      rgba(73,139,143,.12),
      transparent 30%
    ),
    linear-gradient(
      145deg,
      #f4f0df,
      #e6f1ee 48%,
      #eee8f5
    );
}


/*==================================================
SCHOLARSHIP HERO
==================================================*/

.scholarships-page .scholarships-hero-section{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  min-height:650px;
  padding:86px 0;
  background:
    radial-gradient(
      circle at 86% 12%,
      rgba(246,210,91,.26),
      transparent 28%
    ),
    radial-gradient(
      circle at 18% 86%,
      rgba(99,187,177,.19),
      transparent 32%
    ),
    linear-gradient(
      135deg,
      #283d4c,
      #305f61 48%,
      #756124
    );
}

.scholarships-page .scholarships-hero-section::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  background:
    linear-gradient(
      rgba(255,255,255,.025) 1px,
      transparent 1px
    ),
    linear-gradient(
      90deg,
      rgba(255,255,255,.025) 1px,
      transparent 1px
    );
  background-size:38px 38px;
  mask-image:
    linear-gradient(
      to bottom,
      rgba(0,0,0,.88),
      transparent
    );
}

.scholarships-page .scholarships-hero-section .background-media{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  z-index:-3;
  opacity:.14;
  filter:saturate(.9) contrast(1.08);
}

.scholarships-page .scholarships-hero-section::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:-2;
  background:
    linear-gradient(
      90deg,
      rgba(22,38,47,.93) 0%,
      rgba(29,63,64,.84) 52%,
      rgba(83,71,32,.68) 100%
    );
}

.scholarships-page .hero-layout{
  display:grid;
  grid-template-columns:
    minmax(0,1.08fr)
    minmax(320px,.72fr);
  align-items:center;
  gap:clamp(32px,6vw,76px);
}

.scholarships-page .hero-content{
  max-width:780px;
}

.scholarships-page .breadcrumb-navigation{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:9px;
  margin-bottom:22px;
  color:rgba(255,255,255,.7);
  font-size:.82rem;
}

.scholarships-page .breadcrumb-navigation a{
  color:rgba(255,255,255,.78);
}

.scholarships-page .breadcrumb-navigation a:hover{
  color:#f4d86d;
}

.scholarships-page .hero-badge{
  display:inline-flex;
  align-items:center;
  gap:10px;
  margin-bottom:20px;
  padding:9px 15px;
  border:1px solid rgba(255,255,255,.18);
  border-radius:999px;
  color:#fff3bd;
  background:rgba(255,255,255,.08);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
  font-size:.76rem;
  font-weight:800;
  letter-spacing:.4px;
}

.scholarships-page .hero-badge-icon{
  display:grid;
  place-items:center;
  width:30px;
  height:30px;
  border-radius:50%;
  color:#273842;
  background:#f2d061;
}

.scholarships-page .hero-content h1{
  max-width:760px;
  margin:0 0 22px;
  color:#f7f8f3;
  font-size:clamp(2.65rem,6vw,5.4rem);
  line-height:1.03;
  letter-spacing:-2.2px;
}

.scholarships-page .text-gradient{
  display:inline;
  color:#f3d35f;
  background:
    linear-gradient(
      90deg,
      #f7dd75,
      #f6b95d,
      #a8e2da
    );
  -webkit-background-clip:text;
  background-clip:text;
  -webkit-text-fill-color:transparent;
}

.scholarships-page .hero-description{
  max-width:700px;
  margin-bottom:27px;
  color:rgba(241,247,246,.8);
  font-size:1.02rem;
  line-height:1.8;
}

.scholarships-page .hero-actions{
  display:flex;
  flex-wrap:wrap;
  gap:13px;
  margin-top:24px;
}

.scholarships-page .hero-trust-list{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  margin-top:28px;
}

.scholarships-page .hero-trust-item{
  display:flex;
  align-items:center;
  gap:9px;
  padding:10px 13px;
  border:1px solid rgba(255,255,255,.11);
  border-radius:14px;
  color:rgba(255,255,255,.86);
  background:rgba(255,255,255,.055);
  font-size:.75rem;
  font-weight:700;
}

.scholarships-page .hero-trust-icon{
  display:grid;
  place-items:center;
  width:29px;
  height:29px;
  border-radius:9px;
  color:#f4d66b;
  background:rgba(255,255,255,.08);
}


/*==================================================
SCHOLARSHIP FINDER CARD
==================================================*/

.scholarships-page .scholarship-finder-card{
  position:relative;
  overflow:hidden;
  padding:27px;
  border:1px solid rgba(255,255,255,.16);
  border-radius:26px;
  background:
    radial-gradient(
      circle at 92% 0%,
      rgba(246,212,105,.16),
      transparent 34%
    ),
    linear-gradient(
      145deg,
      rgba(255,255,255,.13),
      rgba(255,255,255,.055)
    );
  box-shadow:
    0 26px 70px rgba(9,25,30,.31);
  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);
}

.scholarships-page .guidance-card-header{
  display:flex;
  align-items:center;
  gap:14px;
  margin-bottom:22px;
}

.scholarships-page .guidance-card-icon{
  display:grid;
  place-items:center;
  flex:0 0 54px;
  width:54px;
  height:54px;
  border-radius:17px;
  color:#273e43;
  background:
    linear-gradient(
      145deg,
      #f6d86b,
      #f0bb57
    );
  box-shadow:
    0 12px 26px rgba(240,187,87,.21);
  font-size:1.22rem;
}

.scholarships-page .guidance-card-header h2{
  margin:4px 0 0;
  color:#fff;
  font-size:1.42rem;
}

.scholarships-page .scholarship-finder-card .section-kicker{
  color:#f5d979;
}

.scholarships-page .guidance-form{
  display:grid;
  gap:15px;
}

.scholarships-page .guidance-form .form-field{
  display:grid;
  gap:7px;
}

.scholarships-page .guidance-form label{
  color:rgba(255,255,255,.82);
  font-size:.73rem;
  font-weight:800;
}

.scholarships-page .guidance-form select,
.scholarships-page .guidance-form input{
  width:100%;
  min-height:48px;
  padding:0 14px;
  border:1px solid rgba(255,255,255,.14);
  border-radius:13px;
  outline:none;
  color:#294044;
  background:#edf5f2;
  font:inherit;
}

.scholarships-page .guidance-form select:focus,
.scholarships-page .guidance-form input:focus{
  border-color:#f0cd5c;
  box-shadow:
    0 0 0 4px rgba(240,205,92,.14);
}


/*==================================================
SCHOLARSHIP SUMMARY STRIP
==================================================*/

.scholarships-page .scholarship-summary-strip{
  position:relative;
  padding:34px 0;
  background:
    linear-gradient(
      135deg,
      #eee8d3,
      #dfefeb
    );
}

.scholarships-page .scholarship-summary-strip .trust-strip-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:15px;
}

.scholarships-page .scholarship-summary-strip .trust-strip-card{
  display:flex;
  align-items:center;
  gap:14px;
  min-height:104px;
  padding:19px;
  border:1px solid rgba(71,105,103,.12);
  border-radius:19px;
  background:
    linear-gradient(
      145deg,
      #f4f0df,
      #e9f3f0
    );
  box-shadow:
    0 12px 30px rgba(47,76,74,.08);
}

.scholarships-page .scholarship-summary-strip .trust-strip-icon{
  display:grid;
  place-items:center;
  flex:0 0 49px;
  width:49px;
  height:49px;
  border-radius:15px;
  color:#f4d369;
  background:
    linear-gradient(
      145deg,
      #304f57,
      #466f6d
    );
  font-size:1.1rem;
}

.scholarships-page .scholarship-summary-strip strong{
  display:block;
  margin-bottom:3px;
  color:#273e42;
  font-size:1.18rem;
}

.scholarships-page .scholarship-summary-strip p{
  margin:0;
  color:#607477;
  font-size:.74rem;
  line-height:1.45;
}


/*==================================================
DIRECTORY SECTION
==================================================*/

.scholarships-page .scholarship-directory-section{
  padding:82px 0;
  background:
    radial-gradient(
      circle at 10% 10%,
      rgba(216,186,84,.11),
      transparent 29%
    ),
    linear-gradient(
      145deg,
      #eee9d8,
      #e2f0ed
    );
}

.scholarships-page .scholarship-catalogue-stage{
  display:grid;
  grid-template-columns:
    minmax(255px,.34fr)
    minmax(0,1fr);
  align-items:start;
  gap:25px;
  margin-top:38px;
}

.scholarships-page .scholarship-filter-panel{
  position:sticky;
  top:22px;
  padding:22px;
  border:1px solid rgba(67,100,98,.13);
  border-radius:23px;
  background:
    linear-gradient(
      145deg,
      #f3eedc,
      #e7f1ee
    );
  box-shadow:
    0 18px 40px rgba(47,77,74,.09);
}

.scholarships-page .catalogue-filter-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  margin-bottom:19px;
}

.scholarships-page .catalogue-filter-header h3{
  margin:4px 0 0;
  color:#2b4548;
  font-size:1.16rem;
}

.scholarships-page .filter-close-button{
  display:none;
  width:39px;
  height:39px;
  border:0;
  border-radius:11px;
  color:#fff;
  background:#355b5d;
  cursor:pointer;
}

.scholarships-page .catalogue-filter-form{
  display:grid;
  gap:14px;
}

.scholarships-page .catalogue-filter-form .form-field{
  display:grid;
  gap:7px;
}

.scholarships-page .catalogue-filter-form label{
  color:#425f61;
  font-size:.72rem;
  font-weight:800;
}

.scholarships-page .catalogue-filter-form input,
.scholarships-page .catalogue-filter-form select{
  width:100%;
  min-height:46px;
  padding:0 13px;
  border:1px solid rgba(55,94,93,.14);
  border-radius:12px;
  outline:none;
  color:#2a4245;
  background:#edf4f1;
  font:inherit;
}

.scholarships-page .catalogue-filter-form input:focus,
.scholarships-page .catalogue-filter-form select:focus{
  border-color:#8b7b36;
  box-shadow:
    0 0 0 4px rgba(139,123,54,.11);
}

.scholarships-page .search-input-wrapper{
  position:relative;
}

.scholarships-page .search-input-wrapper i{
  position:absolute;
  left:14px;
  top:50%;
  transform:translateY(-50%);
  color:#788b89;
  pointer-events:none;
}

.scholarships-page .search-input-wrapper input{
  padding-left:39px;
}


/*==================================================
SCHOLARSHIP RESULTS TOOLBAR
==================================================*/

.scholarships-page .scholarship-results-panel{
  min-width:0;
}

.scholarships-page .catalogue-results-toolbar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  margin-bottom:18px;
  padding:17px 18px;
  border:1px solid rgba(66,101,98,.12);
  border-radius:18px;
  background:
    linear-gradient(
      145deg,
      #f4efdf,
      #e8f2ef
    );
  box-shadow:
    0 12px 28px rgba(45,75,72,.07);
}

.scholarships-page .catalogue-results-summary{
  display:flex;
  align-items:center;
  gap:13px;
}

.scholarships-page .catalogue-results-summary p{
  margin:0;
  color:#52696b;
  font-size:.82rem;
}

.scholarships-page .catalogue-results-summary strong{
  color:#263f42;
  font-size:1.12rem;
}

.scholarships-page .filter-toggle-button{
  display:none;
  align-items:center;
  justify-content:center;
  gap:8px;
  min-height:42px;
  padding:0 14px;
  border:0;
  border-radius:12px;
  color:#fff;
  background:
    linear-gradient(
      145deg,
      #355b5d,
      #6f6430
    );
  font-weight:800;
  cursor:pointer;
}

.scholarships-page .catalogue-sort-wrapper{
  display:flex;
  align-items:center;
  gap:9px;
}

.scholarships-page .catalogue-sort-wrapper label{
  color:#607375;
  font-size:.72rem;
  font-weight:800;
}

.scholarships-page .catalogue-sort-wrapper select{
  min-height:42px;
  padding:0 12px;
  border:1px solid rgba(59,94,92,.13);
  border-radius:11px;
  color:#2c4547;
  background:#edf4f1;
  outline:none;
}


/*==================================================
ACTIVE FILTER CHIPS
==================================================*/

.scholarships-page .active-filter-list{
  display:flex;
  flex-wrap:wrap;
  gap:9px;
  min-height:0;
  margin-bottom:16px;
}

.scholarships-page .active-filter-chip{
  display:inline-flex;
  align-items:center;
  gap:8px;
  min-height:34px;
  padding:0 11px;
  border:1px solid rgba(114,98,42,.13);
  border-radius:999px;
  color:#4a5738;
  background:#eee6c8;
  font-size:.7rem;
  font-weight:800;
  cursor:pointer;
}

.scholarships-page .active-filter-chip:hover{
  color:#fff;
  background:#6e6330;
}


/*==================================================
SCHOLARSHIP RESULT GRID
==================================================*/

.scholarships-page .scholarship-result-grid{
  display:grid;
  grid-template-columns:
    repeat(3,minmax(0,1fr));
  gap:18px;
}

.scholarships-page .scholarship-result-card{
  position:relative;
  overflow:hidden;
  display:flex;
  flex-direction:column;
  min-width:0;
  padding:21px;
  border:1px solid rgba(61,96,93,.13);
  border-radius:22px;
  background:
    radial-gradient(
      circle at 100% 0%,
      rgba(225,197,91,.13),
      transparent 31%
    ),
    linear-gradient(
      145deg,
      #f3eedc,
      #e8f2ef
    );
  box-shadow:
    0 16px 34px rgba(42,72,69,.09);
  transition:
    transform .28s ease,
    box-shadow .28s ease,
    border-color .28s ease;
}

.scholarships-page .scholarship-result-card:hover{
  transform:translateY(-5px);
  border-color:rgba(127,111,47,.24);
  box-shadow:
    0 22px 42px rgba(42,72,69,.13);
}

.scholarships-page .scholarship-card-top{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  margin-bottom:17px;
}

.scholarships-page .scholarship-type-badge,
.scholarships-page .scholarship-status{
  display:inline-flex;
  align-items:center;
  min-height:29px;
  padding:0 10px;
  border-radius:999px;
  font-size:.65rem;
  font-weight:900;
  text-transform:capitalize;
}

.scholarships-page .scholarship-type-badge{
  color:#4d5739;
  background:#eee4bd;
}

.scholarships-page .scholarship-status-open{
  color:#245f4f;
  background:#d8eee6;
}

.scholarships-page .scholarship-status-upcoming{
  color:#36597c;
  background:#dfeaf4;
}

.scholarships-page .scholarship-status-closing-soon{
  color:#8a581e;
  background:#f6e5c9;
}

.scholarships-page .scholarship-status-closed{
  color:#7c4148;
  background:#f0dcdf;
}

.scholarships-page .scholarship-card-icon{
  display:grid;
  place-items:center;
  width:54px;
  height:54px;
  margin-bottom:16px;
  border-radius:17px;
  color:#f1d56c;
  background:
    linear-gradient(
      145deg,
      #304f56,
      #5f6b38
    );
  font-size:1.25rem;
}

.scholarships-page .scholarship-result-card h3{
  margin:0 0 8px;
  color:#294245;
  font-size:1.05rem;
  line-height:1.35;
}

.scholarships-page .scholarship-provider{
  margin:0 0 13px;
  color:#77692d;
  font-size:.72rem;
  font-weight:800;
}

.scholarships-page .scholarship-result-card > p:not(.scholarship-provider){
  margin:0 0 18px;
  color:#627678;
  font-size:.75rem;
  line-height:1.68;
}

.scholarships-page .scholarship-meta-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px;
  margin-top:auto;
  margin-bottom:17px;
}

.scholarships-page .scholarship-meta-grid > div{
  min-width:0;
  padding:12px;
  border:1px solid rgba(65,97,94,.1);
  border-radius:14px;
  background:rgba(255,255,255,.42);
}

.scholarships-page .scholarship-meta-grid span{
  display:block;
  margin-bottom:4px;
  color:#758688;
  font-size:.62rem;
  font-weight:800;
}

.scholarships-page .scholarship-meta-grid strong{
  display:block;
  color:#2e494b;
  font-size:.72rem;
  line-height:1.4;
  overflow-wrap:anywhere;
}

.scholarships-page .scholarship-card-actions{
  display:grid;
  grid-template-columns:1fr auto;
  gap:9px;
}

.scholarships-page .scholarship-card-actions .button{
  min-width:0;
  padding-inline:13px;
  font-size:.7rem;
}


/*==================================================
EMPTY, ERROR AND LOADER STATES
==================================================*/

.scholarships-page .section-loader,
.scholarships-page .catalogue-empty-state{
  grid-column:1 / -1;
  text-align:center;
}

.scholarships-page .section-loader{
  display:grid;
  justify-items:center;
  gap:13px;
  padding:58px 20px;
  color:#647779;
}

.scholarships-page .catalogue-empty-state{
  padding:58px 22px;
  border:1px solid rgba(63,98,95,.12);
  border-radius:22px;
  background:
    linear-gradient(
      145deg,
      #f3eedc,
      #e8f2ef
    );
}

.scholarships-page .catalogue-empty-icon{
  display:grid;
  place-items:center;
  width:66px;
  height:66px;
  margin:0 auto 16px;
  border-radius:20px;
  color:#f1d46b;
  background:#35575c;
  font-size:1.45rem;
}

.scholarships-page .catalogue-empty-state h3{
  margin:0 0 8px;
  color:#2b4548;
}

.scholarships-page .catalogue-empty-state p{
  max-width:540px;
  margin:0 auto 19px;
  color:#627679;
  font-size:.8rem;
  line-height:1.65;
}


/*==================================================
PAGINATION
==================================================*/

.scholarships-page .pagination-wrapper{
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  gap:8px;
  margin-top:26px;
}

.scholarships-page .pagination-button{
  display:grid;
  place-items:center;
  min-width:40px;
  height:40px;
  padding:0 11px;
  border:1px solid rgba(60,94,92,.13);
  border-radius:11px;
  color:#395356;
  background:#e8f1ed;
  font-weight:800;
  cursor:pointer;
}

.scholarships-page .pagination-button:hover,
.scholarships-page .pagination-button.active{
  color:#fff;
  border-color:transparent;
  background:
    linear-gradient(
      145deg,
      #365b5d,
      #75682f
    );
}

.scholarships-page .pagination-button:disabled{
  opacity:.45;
  cursor:not-allowed;
}


/*==================================================
SCHOLARSHIP CATEGORIES
==================================================*/

.scholarships-page .scholarship-category-section{
  padding:82px 0;
  background:
    radial-gradient(
      circle at 88% 12%,
      rgba(151,118,172,.1),
      transparent 29%
    ),
    linear-gradient(
      145deg,
      #ece7d8,
      #e3efec
    );
}

.scholarships-page .institution-category-grid{
  display:grid;
  grid-template-columns:
    repeat(3,minmax(0,1fr));
  gap:18px;
}

.scholarships-page .institution-category-card{
  display:flex;
  flex-direction:column;
  min-height:250px;
  padding:23px;
  border:1px solid rgba(65,99,96,.12);
  border-radius:21px;
  color:inherit;
  background:
    linear-gradient(
      145deg,
      #f4efdf,
      #e8f2ef
    );
  box-shadow:
    0 15px 32px rgba(44,73,71,.08);
  transition:
    transform .28s ease,
    box-shadow .28s ease;
}

.scholarships-page .institution-category-card:hover{
  transform:translateY(-5px);
  box-shadow:
    0 22px 40px rgba(44,73,71,.12);
}

.scholarships-page .institution-category-icon{
  display:grid;
  place-items:center;
  width:54px;
  height:54px;
  margin-bottom:17px;
  border-radius:17px;
  color:#f3d66e;
  background:
    linear-gradient(
      145deg,
      #32565a,
      #736731
    );
  font-size:1.2rem;
}

.scholarships-page .institution-category-card h3{
  margin:0 0 9px;
  color:#2b4447;
  font-size:1.02rem;
}

.scholarships-page .institution-category-card p{
  margin:0 0 18px;
  color:#647779;
  font-size:.76rem;
  line-height:1.65;
}

.scholarships-page .institution-category-card .text-link{
  margin-top:auto;
  color:#76682c;
  font-size:.7rem;
  font-weight:900;
}


/*==================================================
ELIGIBILITY CHECKER
==================================================*/

.scholarships-page .scholarship-eligibility-section{
  padding:82px 0;
  background:
    radial-gradient(
      circle at 8% 15%,
      rgba(213,183,73,.11),
      transparent 31%
    ),
    linear-gradient(
      145deg,
      #e8eee5,
      #eee7d7
    );
}

.scholarships-page .calculator-layout{
  display:grid;
  grid-template-columns:
    minmax(0,.92fr)
    minmax(0,1.08fr);
  align-items:start;
  gap:24px;
  margin-top:35px;
}

.scholarships-page .calculator-card,
.scholarships-page .calculator-result-card{
  padding:25px;
  border:1px solid rgba(61,96,93,.13);
  border-radius:23px;
  background:
    linear-gradient(
      145deg,
      #f3eedc,
      #e7f1ee
    );
  box-shadow:
    0 17px 36px rgba(43,72,69,.09);
}

.scholarships-page .calculator-card{
  display:grid;
  gap:15px;
}

.scholarships-page .calculator-card .form-field{
  display:grid;
  gap:7px;
}

.scholarships-page .calculator-card label{
  color:#425e60;
  font-size:.72rem;
  font-weight:800;
}

.scholarships-page .calculator-card input,
.scholarships-page .calculator-card select{
  width:100%;
  min-height:47px;
  padding:0 13px;
  border:1px solid rgba(58,92,90,.14);
  border-radius:12px;
  outline:none;
  color:#2c4547;
  background:#edf4f1;
  font:inherit;
}

.scholarships-page .calculator-result-card h3{
  margin:5px 0 14px;
  color:#294245;
}

.scholarships-page .scholarship-eligibility-result{
  min-height:250px;
  display:grid;
  place-items:center;
  padding:20px;
  border:1px dashed rgba(77,102,96,.2);
  border-radius:18px;
  color:#617477;
  background:rgba(255,255,255,.28);
  text-align:center;
}

.scholarships-page .eligibility-result-success{
  text-align:left;
}

.scholarships-page .eligibility-result-success > span{
  display:grid;
  place-items:center;
  width:55px;
  height:55px;
  margin-bottom:15px;
  border-radius:17px;
  color:#f1d56a;
  background:#35585b;
  font-size:1.2rem;
}

.scholarships-page .eligibility-result-success h4{
  margin:0 0 12px;
  color:#2a4446;
}

.scholarships-page .eligibility-result-success ul{
  display:grid;
  gap:9px;
  margin:0 0 14px;
  padding-left:19px;
  color:#50686a;
  font-size:.78rem;
}

.scholarships-page .eligibility-result-success p{
  margin:0;
  color:#6b7d7e;
  font-size:.72rem;
  line-height:1.65;
}
/*==================================================
SCHOLARSHIP APPLICATION PROCESS
==================================================*/

.scholarships-page .scholarship-process-section{
  padding:82px 0;
  background:
    radial-gradient(
      circle at 90% 10%,
      rgba(144,112,165,.09),
      transparent 29%
    ),
    linear-gradient(
      145deg,
      #eee7d7,
      #e2efeb
    );
}

.scholarships-page .admission-process-grid{
  display:grid;
  grid-template-columns:
    repeat(3,minmax(0,1fr));
  gap:18px;
  margin-top:36px;
}

.scholarships-page .admission-process-card{
  position:relative;
  overflow:hidden;
  min-width:0;
  padding:23px;
  border:1px solid rgba(62,97,94,.12);
  border-radius:21px;
  background:
    radial-gradient(
      circle at 100% 0%,
      rgba(223,193,86,.13),
      transparent 31%
    ),
    linear-gradient(
      145deg,
      #f3eedc,
      #e8f2ef
    );
  box-shadow:
    0 15px 32px rgba(44,73,70,.08);
}

.scholarships-page .admission-process-number{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:31px;
  margin-bottom:16px;
  padding:0 11px;
  border-radius:999px;
  color:#5e5528;
  background:#ede3bb;
  font-size:.66rem;
  font-weight:900;
}

.scholarships-page .admission-process-icon{
  display:grid;
  place-items:center;
  width:54px;
  height:54px;
  margin-bottom:16px;
  border-radius:17px;
  color:#f3d66b;
  background:
    linear-gradient(
      145deg,
      #31545a,
      #74682f
    );
  font-size:1.18rem;
}

.scholarships-page .admission-process-card h3{
  margin:0 0 9px;
  color:#2b4447;
  font-size:1rem;
}

.scholarships-page .admission-process-card p{
  margin:0;
  color:#637779;
  font-size:.75rem;
  line-height:1.68;
}


/*==================================================
SCHOLARSHIP DOCUMENTS
==================================================*/

.scholarships-page .scholarship-documents-section{
  padding:82px 0;
  background:
    radial-gradient(
      circle at 10% 12%,
      rgba(210,181,73,.11),
      transparent 30%
    ),
    linear-gradient(
      145deg,
      #e5efeb,
      #efe8d8
    );
}

.scholarships-page .documents-layout{
  display:grid;
  grid-template-columns:
    minmax(0,1fr)
    minmax(300px,.72fr);
  gap:26px;
  align-items:start;
}

.scholarships-page .documents-content{
  min-width:0;
}

.scholarships-page .documents-content h2{
  margin:7px 0 13px;
  color:#294346;
  font-size:clamp(2rem,4vw,3.15rem);
  line-height:1.12;
}

.scholarships-page .documents-content > p{
  max-width:740px;
  margin:0 0 25px;
  color:#617577;
  line-height:1.75;
}

.scholarships-page .document-list-grid{
  display:grid;
  grid-template-columns:
    repeat(2,minmax(0,1fr));
  gap:13px;
}

.scholarships-page .document-list-item{
  display:flex;
  align-items:center;
  gap:12px;
  min-width:0;
  min-height:72px;
  padding:15px;
  border:1px solid rgba(64,99,96,.11);
  border-radius:16px;
  color:#3c5658;
  background:
    linear-gradient(
      145deg,
      #f4efdf,
      #e9f2ef
    );
  font-size:.76rem;
  font-weight:700;
  line-height:1.5;
}

.scholarships-page .document-list-item i{
  display:grid;
  place-items:center;
  flex:0 0 40px;
  width:40px;
  height:40px;
  border-radius:13px;
  color:#f0d166;
  background:#36595c;
}

.scholarships-page .document-checklist-card{
  position:sticky;
  top:22px;
  padding:23px;
  border:1px solid rgba(63,98,95,.13);
  border-radius:23px;
  background:
    radial-gradient(
      circle at 100% 0%,
      rgba(226,194,85,.15),
      transparent 34%
    ),
    linear-gradient(
      145deg,
      #f3eedc,
      #e8f1ee
    );
  box-shadow:
    0 18px 38px rgba(43,72,69,.1);
}

.scholarships-page .document-checklist-header{
  display:flex;
  align-items:center;
  gap:13px;
  margin-bottom:20px;
}

.scholarships-page .document-checklist-icon{
  display:grid;
  place-items:center;
  flex:0 0 52px;
  width:52px;
  height:52px;
  border-radius:16px;
  color:#f2d46a;
  background:
    linear-gradient(
      145deg,
      #31545a,
      #70652f
    );
  font-size:1.15rem;
}

.scholarships-page .document-checklist-header h3{
  margin:0 0 4px;
  color:#294245;
  font-size:1rem;
}

.scholarships-page .document-checklist-header p{
  margin:0;
  color:#6b7d7e;
  font-size:.69rem;
}

.scholarships-page .document-checklist-steps{
  display:grid;
  gap:11px;
}

.scholarships-page .document-checklist-step{
  display:grid;
  grid-template-columns:38px 1fr;
  gap:11px;
  align-items:center;
  min-height:59px;
  padding:11px 12px;
  border:1px solid rgba(65,98,95,.1);
  border-radius:14px;
  background:rgba(255,255,255,.34);
}

.scholarships-page .document-checklist-step span{
  display:grid;
  place-items:center;
  width:38px;
  height:38px;
  border-radius:12px;
  color:#fff;
  background:#5e6537;
  font-size:.68rem;
  font-weight:900;
}

.scholarships-page .document-checklist-step p{
  margin:0;
  color:#526a6c;
  font-size:.72rem;
  line-height:1.48;
}


/*==================================================
DEADLINE TIMELINE
==================================================*/

.scholarships-page .scholarship-deadline-section{
  padding:82px 0;
  background:
    radial-gradient(
      circle at 88% 12%,
      rgba(121,157,151,.12),
      transparent 30%
    ),
    linear-gradient(
      145deg,
      #eee8d8,
      #e3efeb
    );
}

.scholarships-page .timeline-grid{
  display:grid;
  grid-template-columns:
    repeat(3,minmax(0,1fr));
  gap:18px;
  margin-top:36px;
}

.scholarships-page .timeline-card{
  min-width:0;
  padding:22px;
  border:1px solid rgba(63,97,94,.12);
  border-radius:20px;
  background:
    linear-gradient(
      145deg,
      #f3eedc,
      #e8f2ef
    );
  box-shadow:
    0 15px 32px rgba(44,73,70,.08);
}

.scholarships-page .timeline-step{
  display:grid;
  place-items:center;
  width:48px;
  height:48px;
  margin-bottom:15px;
  border-radius:15px;
  color:#f2d369;
  background:
    linear-gradient(
      145deg,
      #315359,
      #70642f
    );
  font-size:.76rem;
  font-weight:900;
}

.scholarships-page .timeline-card h3{
  margin:0 0 8px;
  color:#294245;
  font-size:.98rem;
}

.scholarships-page .timeline-card strong{
  display:block;
  margin-bottom:7px;
  color:#77692e;
  font-size:.75rem;
}

.scholarships-page .timeline-card p{
  margin:0;
  color:#627678;
  font-size:.72rem;
  line-height:1.55;
}


/*==================================================
GUIDANCE CTA
==================================================*/

.scholarships-page .scholarship-guidance-section{
  padding:70px 0;
  background:
    linear-gradient(
      145deg,
      #e4efeb,
      #eee6d3
    );
}

.scholarships-page .counsellor-support-card{
  display:grid;
  grid-template-columns:
    minmax(0,1fr)
    auto;
  align-items:center;
  gap:28px;
  padding:32px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:26px;
  background:
    radial-gradient(
      circle at 92% 8%,
      rgba(245,211,99,.19),
      transparent 31%
    ),
    linear-gradient(
      135deg,
      #304e55,
      #506b54 58%,
      #75642e
    );
  box-shadow:
    0 22px 54px rgba(40,67,65,.18);
}

.scholarships-page .counsellor-support-content h2{
  margin:6px 0 11px;
  color:#fff;
  font-size:clamp(1.8rem,3.5vw,2.8rem);
  line-height:1.15;
}

.scholarships-page .counsellor-support-content p{
  max-width:720px;
  margin:0;
  color:rgba(255,255,255,.76);
  line-height:1.7;
}

.scholarships-page .counsellor-support-content .section-kicker{
  color:#f4d66c;
}

.scholarships-page .counsellor-support-tags{
  display:flex;
  flex-wrap:wrap;
  gap:9px;
  margin-top:18px;
}

.scholarships-page .counsellor-support-tags span{
  padding:8px 11px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:999px;
  color:rgba(255,255,255,.84);
  background:rgba(255,255,255,.06);
  font-size:.66rem;
  font-weight:800;
}

.scholarships-page .counsellor-support-actions{
  display:grid;
  gap:11px;
  min-width:220px;
}


/*==================================================
FAQ
==================================================*/

.scholarships-page .scholarship-faq-section{
  padding:82px 0;
  background:
    radial-gradient(
      circle at 12% 10%,
      rgba(211,180,75,.1),
      transparent 30%
    ),
    linear-gradient(
      145deg,
      #eee8d8,
      #e4efeb
    );
}

.scholarships-page .faq-list{
  max-width:920px;
  margin:36px auto 0;
  display:grid;
  gap:13px;
}

.scholarships-page .faq-item{
  overflow:hidden;
  border:1px solid rgba(62,97,94,.12);
  border-radius:18px;
  background:
    linear-gradient(
      145deg,
      #f3eedc,
      #e9f2ef
    );
  box-shadow:
    0 12px 28px rgba(44,73,70,.07);
}

.scholarships-page .faq-question{
  width:100%;
  min-height:65px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  padding:17px 19px;
  border:0;
  color:#2b4548;
  background:transparent;
  text-align:left;
  font:inherit;
  font-size:.83rem;
  font-weight:900;
  cursor:pointer;
}

.scholarships-page .faq-question i{
  flex:0 0 auto;
  color:#75692f;
  transition:transform .25s ease;
}

.scholarships-page .faq-item.active .faq-question i{
  transform:rotate(180deg);
}

.scholarships-page .faq-answer{
  overflow:hidden;
}

.scholarships-page .accordion-content{
  padding:0 19px 18px;
  color:#627678;
  font-size:.76rem;
  line-height:1.75;
}


/*==================================================
FILTER OVERLAY
==================================================*/

.scholarships-page .filter-overlay{
  position:fixed;
  inset:0;
  z-index:998;
  visibility:hidden;
  opacity:0;
  background:rgba(20,35,40,.56);
  transition:
    opacity .25s ease,
    visibility .25s ease;
}

.scholarships-page .filter-overlay.active{
  visibility:visible;
  opacity:1;
}


/*==================================================
RESPONSIVE
==================================================*/

@media(max-width:1180px){

  .scholarships-page .scholarship-result-grid{
    grid-template-columns:
      repeat(2,minmax(0,1fr));
  }

  .scholarships-page .scholarship-summary-strip .trust-strip-grid{
    grid-template-columns:
      repeat(2,minmax(0,1fr));
  }

}


@media(max-width:960px){

  .scholarships-page .hero-layout,
  .scholarships-page .documents-layout,
  .scholarships-page .calculator-layout,
  .scholarships-page .counsellor-support-card{
    grid-template-columns:1fr;
  }

  .scholarships-page .scholarship-catalogue-stage{
    grid-template-columns:1fr;
  }

  .scholarships-page .scholarship-filter-panel{
    position:fixed;
    top:0;
    left:0;
    z-index:999;
    width:min(88vw,360px);
    height:100dvh;
    overflow-y:auto;
    border-radius:0 24px 24px 0;
    transform:translateX(-105%);
    transition:transform .28s ease;
  }

  .scholarships-page .scholarship-filter-panel.active{
    transform:translateX(0);
  }

  .scholarships-page .filter-close-button,
  .scholarships-page .filter-toggle-button{
    display:inline-flex;
  }

  .scholarships-page .document-checklist-card{
    position:static;
  }

  .scholarships-page .institution-category-grid,
  .scholarships-page .admission-process-grid,
  .scholarships-page .timeline-grid{
    grid-template-columns:
      repeat(2,minmax(0,1fr));
  }

  .scholarships-page .counsellor-support-actions{
    min-width:0;
    grid-template-columns:
      repeat(2,minmax(0,1fr));
  }

}


@media(max-width:700px){

  .scholarships-page .scholarships-hero-section{
    min-height:auto;
    padding:68px 0;
  }

  .scholarships-page .hero-content h1{
    font-size:clamp(2.35rem,12vw,3.85rem);
    letter-spacing:-1.4px;
  }

  .scholarships-page .scholarship-result-grid,
  .scholarships-page .institution-category-grid,
  .scholarships-page .admission-process-grid,
  .scholarships-page .timeline-grid,
  .scholarships-page .document-list-grid{
    grid-template-columns:1fr;
  }

  .scholarships-page .catalogue-results-toolbar{
    align-items:stretch;
    flex-direction:column;
  }

  .scholarships-page .catalogue-results-summary,
  .scholarships-page .catalogue-sort-wrapper{
    justify-content:space-between;
  }

  .scholarships-page .catalogue-sort-wrapper select{
    flex:1;
  }

  .scholarships-page .scholarship-card-actions{
    grid-template-columns:1fr;
  }

  .scholarships-page .counsellor-support-actions{
    grid-template-columns:1fr;
  }

}


@media(max-width:520px){

  .scholarships-page .scholarship-summary-strip .trust-strip-grid{
    grid-template-columns:1fr;
  }

  .scholarships-page .hero-actions{
    display:grid;
    grid-template-columns:1fr;
  }

  .scholarships-page .hero-actions .button{
    width:100%;
  }

  .scholarships-page .hero-trust-list{
    display:grid;
    grid-template-columns:1fr;
  }

  .scholarships-page .scholarship-finder-card,
  .scholarships-page .calculator-card,
  .scholarships-page .calculator-result-card,
  .scholarships-page .document-checklist-card,
  .scholarships-page .counsellor-support-card{
    padding:21px;
    border-radius:20px;
  }

  .scholarships-page .scholarship-result-card{
    padding:18px;
  }

  .scholarships-page .scholarship-meta-grid{
    grid-template-columns:1fr;
  }

}
/*==================================================
NOTIFICATIONS PAGE
==================================================*/

body.notifications-page{
  overflow-x:hidden;
  color:#243c42;
  background:
    radial-gradient(
      circle at 10% 8%,
      rgba(84,147,158,.13),
      transparent 28%
    ),
    radial-gradient(
      circle at 90% 18%,
      rgba(137,103,171,.1),
      transparent 30%
    ),
    linear-gradient(
      145deg,
      #e8f0ef,
      #eee7f2 50%,
      #f3eddc
    );
}


/*==================================================
NOTIFICATIONS HERO
==================================================*/

.notifications-page .notifications-hero-section{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  min-height:650px;
  padding:86px 0;
  background:
    radial-gradient(
      circle at 87% 12%,
      rgba(111,204,193,.2),
      transparent 29%
    ),
    radial-gradient(
      circle at 14% 88%,
      rgba(177,130,197,.18),
      transparent 32%
    ),
    linear-gradient(
      135deg,
      #263d4b,
      #315f68 52%,
      #66517d
    );
}

.notifications-page .notifications-hero-section::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  background:
    linear-gradient(
      rgba(255,255,255,.026) 1px,
      transparent 1px
    ),
    linear-gradient(
      90deg,
      rgba(255,255,255,.026) 1px,
      transparent 1px
    );
  background-size:38px 38px;
  mask-image:
    linear-gradient(
      to bottom,
      rgba(0,0,0,.9),
      transparent
    );
}

.notifications-page .notifications-hero-section::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:-2;
  background:
    linear-gradient(
      90deg,
      rgba(20,37,46,.94) 0%,
      rgba(35,76,82,.84) 53%,
      rgba(83,61,101,.69) 100%
    );
}

.notifications-page .notifications-hero-section .background-media{
  position:absolute;
  inset:0;
  z-index:-3;
  width:100%;
  height:100%;
  object-fit:cover;
  opacity:.13;
  filter:saturate(.9) contrast(1.06);
}

.notifications-page .hero-layout{
  display:grid;
  grid-template-columns:
    minmax(0,1.08fr)
    minmax(320px,.72fr);
  align-items:center;
  gap:clamp(32px,6vw,76px);
}

.notifications-page .hero-content{
  max-width:790px;
}

.notifications-page .breadcrumb-navigation{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:9px;
  margin-bottom:22px;
  color:rgba(255,255,255,.7);
  font-size:.82rem;
}

.notifications-page .breadcrumb-navigation a{
  color:rgba(255,255,255,.8);
}

.notifications-page .breadcrumb-navigation a:hover{
  color:#8ee0d5;
}

.notifications-page .hero-badge{
  display:inline-flex;
  align-items:center;
  gap:10px;
  margin-bottom:20px;
  padding:9px 15px;
  border:1px solid rgba(255,255,255,.18);
  border-radius:999px;
  color:#b9eee7;
  background:rgba(255,255,255,.08);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
  font-size:.76rem;
  font-weight:800;
  letter-spacing:.4px;
}

.notifications-page .hero-badge-icon{
  display:grid;
  place-items:center;
  width:30px;
  height:30px;
  border-radius:50%;
  color:#29434a;
  background:#8dded3;
}

.notifications-page .hero-content h1{
  max-width:780px;
  margin:0 0 22px;
  color:#f6f8f7;
  font-size:clamp(2.65rem,6vw,5.35rem);
  line-height:1.03;
  letter-spacing:-2.2px;
}

.notifications-page .text-gradient{
  display:inline;
  color:#9ce1d9;
  background:
    linear-gradient(
      90deg,
      #9de6dc,
      #8bc9dd,
      #d5afe8
    );
  background-clip:text;
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;
}

.notifications-page .hero-description{
  max-width:700px;
  margin-bottom:27px;
  color:rgba(241,247,247,.81);
  font-size:1.02rem;
  line-height:1.8;
}

.notifications-page .hero-actions{
  display:flex;
  flex-wrap:wrap;
  gap:13px;
  margin-top:24px;
}

.notifications-page .hero-trust-list{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  margin-top:28px;
}

.notifications-page .hero-trust-item{
  display:flex;
  align-items:center;
  gap:9px;
  padding:10px 13px;
  border:1px solid rgba(255,255,255,.11);
  border-radius:14px;
  color:rgba(255,255,255,.86);
  background:rgba(255,255,255,.055);
  font-size:.75rem;
  font-weight:700;
}

.notifications-page .hero-trust-icon{
  display:grid;
  place-items:center;
  width:29px;
  height:29px;
  border-radius:9px;
  color:#9fe6dd;
  background:rgba(255,255,255,.08);
}


/*==================================================
NOTIFICATION FINDER
==================================================*/

.notifications-page .notification-finder-card{
  position:relative;
  overflow:hidden;
  padding:27px;
  border:1px solid rgba(255,255,255,.16);
  border-radius:26px;
  background:
    radial-gradient(
      circle at 92% 0%,
      rgba(140,221,212,.16),
      transparent 34%
    ),
    linear-gradient(
      145deg,
      rgba(255,255,255,.13),
      rgba(255,255,255,.055)
    );
  box-shadow:
    0 26px 70px rgba(9,25,30,.31);
  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);
}

.notifications-page .guidance-card-header{
  display:flex;
  align-items:center;
  gap:14px;
  margin-bottom:22px;
}

.notifications-page .guidance-card-icon{
  display:grid;
  place-items:center;
  flex:0 0 54px;
  width:54px;
  height:54px;
  border-radius:17px;
  color:#284349;
  background:
    linear-gradient(
      145deg,
      #9de4da,
      #8ac6d6
    );
  box-shadow:
    0 12px 26px rgba(108,202,190,.2);
  font-size:1.22rem;
}

.notifications-page .guidance-card-header h2{
  margin:4px 0 0;
  color:#fff;
  font-size:1.42rem;
}

.notifications-page .notification-finder-card .section-kicker{
  color:#9fe5dc;
}

.notifications-page .guidance-form{
  display:grid;
  gap:15px;
}

.notifications-page .guidance-form .form-field{
  display:grid;
  gap:7px;
}

.notifications-page .guidance-form label{
  color:rgba(255,255,255,.82);
  font-size:.73rem;
  font-weight:800;
}

.notifications-page .guidance-form select,
.notifications-page .guidance-form input{
  width:100%;
  min-height:48px;
  padding:0 14px;
  border:1px solid rgba(255,255,255,.14);
  border-radius:13px;
  outline:none;
  color:#294248;
  background:#eaf3f1;
  font:inherit;
}

.notifications-page .guidance-form select:focus,
.notifications-page .guidance-form input:focus{
  border-color:#82d5cb;
  box-shadow:
    0 0 0 4px rgba(130,213,203,.14);
}


/*==================================================
NOTIFICATION SUMMARY STRIP
==================================================*/

.notifications-page .notification-summary-strip{
  position:relative;
  padding:34px 0;
  background:
    linear-gradient(
      135deg,
      #e4efed,
      #ece5f1
    );
}

.notifications-page .notification-summary-strip .trust-strip-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:15px;
}

.notifications-page .notification-summary-strip .trust-strip-card{
  display:flex;
  align-items:center;
  gap:14px;
  min-height:104px;
  padding:19px;
  border:1px solid rgba(68,103,107,.12);
  border-radius:19px;
  background:
    linear-gradient(
      145deg,
      #edf4f2,
      #eee8f3
    );
  box-shadow:
    0 12px 30px rgba(47,76,78,.08);
}

.notifications-page .notification-summary-strip .trust-strip-icon{
  display:grid;
  place-items:center;
  flex:0 0 49px;
  width:49px;
  height:49px;
  border-radius:15px;
  color:#a8e8e0;
  background:
    linear-gradient(
      145deg,
      #31545c,
      #5b5271
    );
  font-size:1.1rem;
}

.notifications-page .notification-summary-strip strong{
  display:block;
  margin-bottom:3px;
  color:#273f45;
  font-size:1.18rem;
}

.notifications-page .notification-summary-strip p{
  margin:0;
  color:#607579;
  font-size:.74rem;
  line-height:1.45;
}


/*==================================================
FEATURED NOTIFICATIONS
==================================================*/

.notifications-page .featured-notification-section{
  padding:82px 0;
  background:
    radial-gradient(
      circle at 88% 12%,
      rgba(146,105,177,.1),
      transparent 30%
    ),
    linear-gradient(
      145deg,
      #e4efed,
      #eee7f1
    );
}

.notifications-page .featured-notification-grid{
  display:grid;
  grid-template-columns:
    repeat(4,minmax(0,1fr));
  gap:18px;
  margin-top:36px;
}

.notifications-page .featured-notification-card{
  position:relative;
  overflow:hidden;
  display:flex;
  flex-direction:column;
  min-width:0;
  padding:22px;
  border:1px solid rgba(64,99,104,.13);
  border-radius:22px;
  background:
    radial-gradient(
      circle at 100% 0%,
      rgba(144,214,205,.15),
      transparent 31%
    ),
    linear-gradient(
      145deg,
      #edf4f2,
      #eee8f2
    );
  box-shadow:
    0 17px 36px rgba(43,72,75,.1);
  transition:
    transform .28s ease,
    box-shadow .28s ease;
}

.notifications-page .featured-notification-card:hover{
  transform:translateY(-5px);
  box-shadow:
    0 23px 44px rgba(43,72,75,.14);
}

.notifications-page .featured-notification-card::before{
  content:"";
  position:absolute;
  top:0;
  left:0;
  width:100%;
  height:4px;
  background:
    linear-gradient(
      90deg,
      #66cbbf,
      #9b76b9
    );
}


/*==================================================
NOTIFICATION DIRECTORY
==================================================*/

.notifications-page .notification-directory-section{
  padding:82px 0;
  background:
    radial-gradient(
      circle at 10% 10%,
      rgba(94,165,167,.1),
      transparent 29%
    ),
    linear-gradient(
      145deg,
      #e7f0ee,
      #ede6f1
    );
}

.notifications-page .notification-catalogue-stage{
  display:grid;
  grid-template-columns:
    minmax(255px,.34fr)
    minmax(0,1fr);
  align-items:start;
  gap:25px;
  margin-top:38px;
}

.notifications-page .notification-filter-panel{
  position:sticky;
  top:22px;
  padding:22px;
  border:1px solid rgba(63,99,103,.13);
  border-radius:23px;
  background:
    linear-gradient(
      145deg,
      #edf4f2,
      #eee8f2
    );
  box-shadow:
    0 18px 40px rgba(47,77,79,.09);
}

.notifications-page .catalogue-filter-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  margin-bottom:19px;
}

.notifications-page .catalogue-filter-header h3{
  margin:4px 0 0;
  color:#2b454b;
  font-size:1.16rem;
}

.notifications-page .filter-close-button{
  display:none;
  width:39px;
  height:39px;
  border:0;
  border-radius:11px;
  color:#fff;
  background:#355d65;
  cursor:pointer;
}

.notifications-page .catalogue-filter-form{
  display:grid;
  gap:14px;
}

.notifications-page .catalogue-filter-form .form-field{
  display:grid;
  gap:7px;
}

.notifications-page .catalogue-filter-form label{
  color:#426066;
  font-size:.72rem;
  font-weight:800;
}

.notifications-page .catalogue-filter-form input,
.notifications-page .catalogue-filter-form select{
  width:100%;
  min-height:46px;
  padding:0 13px;
  border:1px solid rgba(55,94,98,.14);
  border-radius:12px;
  outline:none;
  color:#2a4248;
  background:#e9f2f0;
  font:inherit;
}

.notifications-page .catalogue-filter-form input:focus,
.notifications-page .catalogue-filter-form select:focus{
  border-color:#7088a2;
  box-shadow:
    0 0 0 4px rgba(112,136,162,.12);
}

.notifications-page .search-input-wrapper{
  position:relative;
}

.notifications-page .search-input-wrapper i{
  position:absolute;
  top:50%;
  left:14px;
  transform:translateY(-50%);
  color:#788c8f;
  pointer-events:none;
}

.notifications-page .search-input-wrapper input{
  padding-left:39px;
}

/*==================================================
NOTIFICATION RESULTS TOOLBAR
==================================================*/

.notifications-page .notification-results-panel{
  min-width:0;
}

.notifications-page .catalogue-results-toolbar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  margin-bottom:18px;
  padding:17px 18px;
  border:1px solid rgba(66,101,105,.12);
  border-radius:18px;
  background:
    linear-gradient(
      145deg,
      #edf4f2,
      #eee8f3
    );
  box-shadow:
    0 12px 28px rgba(45,75,78,.07);
}

.notifications-page .catalogue-results-summary{
  display:flex;
  align-items:center;
  gap:13px;
}

.notifications-page .catalogue-results-summary p{
  margin:0;
  color:#526b70;
  font-size:.82rem;
}

.notifications-page .catalogue-results-summary strong{
  color:#263f45;
  font-size:1.12rem;
}

.notifications-page .filter-toggle-button{
  display:none;
  align-items:center;
  justify-content:center;
  gap:8px;
  min-height:42px;
  padding:0 14px;
  border:0;
  border-radius:12px;
  color:#fff;
  background:
    linear-gradient(
      145deg,
      #355d65,
      #66527e
    );
  font-weight:800;
  cursor:pointer;
}

.notifications-page .catalogue-sort-wrapper{
  display:flex;
  align-items:center;
  gap:9px;
}

.notifications-page .catalogue-sort-wrapper label{
  color:#607579;
  font-size:.72rem;
  font-weight:800;
}

.notifications-page .catalogue-sort-wrapper select{
  min-height:42px;
  padding:0 12px;
  border:1px solid rgba(59,94,98,.13);
  border-radius:11px;
  color:#2c454b;
  background:#e9f2f0;
  outline:none;
}


/*==================================================
ACTIVE FILTER CHIPS
==================================================*/

.notifications-page .active-filter-list{
  display:flex;
  flex-wrap:wrap;
  gap:9px;
  min-height:0;
  margin-bottom:16px;
}

.notifications-page .active-filter-chip{
  display:inline-flex;
  align-items:center;
  gap:8px;
  min-height:34px;
  padding:0 11px;
  border:1px solid rgba(93,78,118,.13);
  border-radius:999px;
  color:#52606d;
  background:#e8e0ee;
  font-size:.7rem;
  font-weight:800;
  cursor:pointer;
}

.notifications-page .active-filter-chip:hover{
  color:#fff;
  background:#65517c;
}


/*==================================================
NOTIFICATION RESULT GRID
==================================================*/

.notifications-page .notification-result-grid{
  display:grid;
  grid-template-columns:
    repeat(3,minmax(0,1fr));
  gap:18px;
}

.notifications-page .notification-result-card,
.notifications-page .featured-notification-card{
  position:relative;
  overflow:hidden;
  display:flex;
  flex-direction:column;
  min-width:0;
  padding:21px;
  border:1px solid rgba(61,96,101,.13);
  border-radius:22px;
  background:
    radial-gradient(
      circle at 100% 0%,
      rgba(120,203,193,.13),
      transparent 31%
    ),
    linear-gradient(
      145deg,
      #edf4f2,
      #eee8f2
    );
  box-shadow:
    0 16px 34px rgba(42,72,75,.09);
  transition:
    transform .28s ease,
    box-shadow .28s ease,
    border-color .28s ease;
}

.notifications-page .notification-result-card:hover,
.notifications-page .featured-notification-card:hover{
  transform:translateY(-5px);
  border-color:rgba(96,86,124,.24);
  box-shadow:
    0 22px 42px rgba(42,72,75,.13);
}

.notifications-page .notification-card-top{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  margin-bottom:17px;
}

.notifications-page .notification-category-badge,
.notifications-page .notification-status{
  display:inline-flex;
  align-items:center;
  min-height:29px;
  padding:0 10px;
  border-radius:999px;
  font-size:.65rem;
  font-weight:900;
  text-transform:capitalize;
}

.notifications-page .notification-category-badge{
  color:#38585d;
  background:#d9ece8;
}

.notifications-page .notification-status-latest{
  color:#31566d;
  background:#dce9f1;
}

.notifications-page .notification-status-open{
  color:#245f52;
  background:#d8eee7;
}

.notifications-page .notification-status-upcoming{
  color:#3c5980;
  background:#e0e8f2;
}

.notifications-page .notification-status-closing-soon{
  color:#89551d;
  background:#f5e4c6;
}

.notifications-page .notification-status-closed{
  color:#7a4148;
  background:#efdce0;
}

.notifications-page .notification-status-updated{
  color:#604879;
  background:#e8def0;
}

.notifications-page .notification-card-icon{
  display:grid;
  place-items:center;
  width:54px;
  height:54px;
  margin-bottom:16px;
  border-radius:17px;
  color:#b5eee6;
  background:
    linear-gradient(
      145deg,
      #31545d,
      #605273
    );
  font-size:1.25rem;
}

.notifications-page .notification-priority-urgent{
  color:#ffd6d6;
  background:
    linear-gradient(
      145deg,
      #7d2c38,
      #b54f58
    );
}

.notifications-page .notification-priority-high{
  color:#ffe9c0;
  background:
    linear-gradient(
      145deg,
      #805321,
      #b2803d
    );
}

.notifications-page .notification-priority-normal{
  color:#b9eee7;
  background:
    linear-gradient(
      145deg,
      #31555d,
      #625473
    );
}

.notifications-page .notification-priority-low{
  color:#d7e5ee;
  background:
    linear-gradient(
      145deg,
      #46616c,
      #667b85
    );
}

.notifications-page .notification-result-card h3,
.notifications-page .featured-notification-card h3{
  margin:0 0 8px;
  color:#294248;
  font-size:1.05rem;
  line-height:1.35;
}

.notifications-page .notification-authority{
  margin:0 0 13px;
  color:#68587f;
  font-size:.72rem;
  font-weight:800;
}

.notifications-page .notification-description{
  margin:0 0 18px;
  color:#62777b;
  font-size:.75rem;
  line-height:1.68;
}

.notifications-page .notification-meta-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px;
  margin-top:auto;
  margin-bottom:17px;
}

.notifications-page .notification-meta-grid > div{
  min-width:0;
  padding:12px;
  border:1px solid rgba(65,97,101,.1);
  border-radius:14px;
  background:rgba(255,255,255,.42);
}

.notifications-page .notification-meta-grid span{
  display:block;
  margin-bottom:4px;
  color:#75898c;
  font-size:.62rem;
  font-weight:800;
}

.notifications-page .notification-meta-grid strong{
  display:block;
  color:#2e4a4f;
  font-size:.72rem;
  line-height:1.4;
  overflow-wrap:anywhere;
}

.notifications-page .notification-card-actions{
  display:grid;
  grid-template-columns:1fr auto;
  gap:9px;
}

.notifications-page .notification-card-actions .button{
  min-width:0;
  padding-inline:13px;
  font-size:.7rem;
}


/*==================================================
LOADER, EMPTY AND ERROR STATES
==================================================*/

.notifications-page .section-loader,
.notifications-page .catalogue-empty-state{
  grid-column:1 / -1;
  text-align:center;
}

.notifications-page .section-loader{
  display:grid;
  justify-items:center;
  gap:13px;
  padding:58px 20px;
  color:#64797d;
}

.notifications-page .catalogue-empty-state{
  padding:58px 22px;
  border:1px solid rgba(63,98,102,.12);
  border-radius:22px;
  background:
    linear-gradient(
      145deg,
      #edf4f2,
      #eee8f2
    );
}

.notifications-page .catalogue-empty-icon{
  display:grid;
  place-items:center;
  width:66px;
  height:66px;
  margin:0 auto 16px;
  border-radius:20px;
  color:#acebe3;
  background:#355a63;
  font-size:1.45rem;
}

.notifications-page .catalogue-empty-state h3{
  margin:0 0 8px;
  color:#2b464c;
}

.notifications-page .catalogue-empty-state p{
  max-width:540px;
  margin:0 auto 19px;
  color:#62787c;
  font-size:.8rem;
  line-height:1.65;
}


/*==================================================
PAGINATION
==================================================*/

.notifications-page .pagination-wrapper{
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  gap:8px;
  margin-top:26px;
}

.notifications-page .pagination-button{
  display:grid;
  place-items:center;
  min-width:40px;
  height:40px;
  padding:0 11px;
  border:1px solid rgba(60,94,98,.13);
  border-radius:11px;
  color:#39565b;
  background:#e6f0ed;
  font-weight:800;
  cursor:pointer;
}

.notifications-page .pagination-button:hover,
.notifications-page .pagination-button.active{
  color:#fff;
  border-color:transparent;
  background:
    linear-gradient(
      145deg,
      #365d65,
      #66527d
    );
}

.notifications-page .pagination-button:disabled{
  opacity:.45;
  cursor:not-allowed;
}


/*==================================================
NOTIFICATION CATEGORIES
==================================================*/

.notifications-page .notification-category-section{
  padding:82px 0;
  background:
    radial-gradient(
      circle at 88% 12%,
      rgba(147,111,176,.1),
      transparent 29%
    ),
    linear-gradient(
      145deg,
      #e6efed,
      #ece6f1
    );
}

.notifications-page .institution-category-grid{
  display:grid;
  grid-template-columns:
    repeat(3,minmax(0,1fr));
  gap:18px;
}

.notifications-page .institution-category-card{
  display:flex;
  flex-direction:column;
  min-height:250px;
  padding:23px;
  border:1px solid rgba(65,99,103,.12);
  border-radius:21px;
  color:inherit;
  background:
    linear-gradient(
      145deg,
      #edf4f2,
      #eee8f2
    );
  box-shadow:
    0 15px 32px rgba(44,73,76,.08);
  transition:
    transform .28s ease,
    box-shadow .28s ease;
}

.notifications-page .institution-category-card:hover{
  transform:translateY(-5px);
  box-shadow:
    0 22px 40px rgba(44,73,76,.12);
}

.notifications-page .institution-category-icon{
  display:grid;
  place-items:center;
  width:54px;
  height:54px;
  margin-bottom:17px;
  border-radius:17px;
  color:#b3ece5;
  background:
    linear-gradient(
      145deg,
      #32575f,
      #65527b
    );
  font-size:1.2rem;
}

.notifications-page .institution-category-card h3{
  margin:0 0 9px;
  color:#2b454b;
  font-size:1.02rem;
}

.notifications-page .institution-category-card p{
  margin:0 0 18px;
  color:#64797c;
  font-size:.76rem;
  line-height:1.65;
}

.notifications-page .institution-category-card .text-link{
  margin-top:auto;
  color:#64527b;
  font-size:.7rem;
  font-weight:900;
}


/*==================================================
DEADLINE TIMELINE
==================================================*/

.notifications-page .notification-deadline-section{
  padding:82px 0;
  background:
    radial-gradient(
      circle at 10% 12%,
      rgba(88,159,162,.11),
      transparent 30%
    ),
    linear-gradient(
      145deg,
      #e4efed,
      #ece6f1
    );
}

.notifications-page .timeline-grid{
  display:grid;
  grid-template-columns:
    repeat(3,minmax(0,1fr));
  gap:18px;
  margin-top:36px;
}

.notifications-page .timeline-card{
  min-width:0;
  padding:22px;
  border:1px solid rgba(63,97,101,.12);
  border-radius:20px;
  background:
    linear-gradient(
      145deg,
      #edf4f2,
      #eee8f2
    );
  box-shadow:
    0 15px 32px rgba(44,73,76,.08);
}

.notifications-page .timeline-step{
  display:grid;
  place-items:center;
  width:48px;
  height:48px;
  margin-bottom:15px;
  border-radius:15px;
  color:#b1ece4;
  background:
    linear-gradient(
      145deg,
      #31565e,
      #65527a
    );
  font-size:.76rem;
  font-weight:900;
}

.notifications-page .timeline-card h3{
  margin:0 0 8px;
  color:#294348;
  font-size:.98rem;
}

.notifications-page .timeline-card strong{
  display:block;
  margin-bottom:7px;
  color:#65517c;
  font-size:.75rem;
}

.notifications-page .timeline-card p{
  margin:0;
  color:#62777b;
  font-size:.72rem;
  line-height:1.55;
}

/*==================================================
NOTIFICATION SUBSCRIPTION SECTION
==================================================*/

.notifications-page .notification-subscription-section{
  position:relative;
  overflow:hidden;
  padding:82px 0;

  background:
    radial-gradient(
      circle at 90% 10%,
      rgba(150,112,181,.13),
      transparent 30%
    ),
    radial-gradient(
      circle at 8% 85%,
      rgba(74,153,159,.11),
      transparent 32%
    ),
    linear-gradient(
      145deg,
      #e5efed,
      #ece6f1
    );
}

.notifications-page .notification-subscription-card{
  display:grid;

  grid-template-columns:
    minmax(0,1fr)
    minmax(320px,.72fr);

  align-items:center;
  gap:34px;

  padding:34px;

  border:
    1px solid
    rgba(255,255,255,.14);

  border-radius:27px;

  background:
    radial-gradient(
      circle at 94% 8%,
      rgba(153,226,216,.19),
      transparent 32%
    ),
    linear-gradient(
      135deg,
      #304f58,
      #476a70 55%,
      #66517c
    );

  box-shadow:
    0 24px 56px
    rgba(40,68,72,.2);
}

.notifications-page
.notification-subscription-content{
  min-width:0;
}

.notifications-page
.notification-subscription-content
.section-kicker{
  color:#a8e8df;
}

.notifications-page
.notification-subscription-content h2{
  max-width:680px;

  margin:
    7px 0 13px;

  color:#fff;

  font-size:
    clamp(
      2rem,
      4vw,
      3.2rem
    );

  line-height:1.12;
}

.notifications-page
.notification-subscription-content > p{
  max-width:710px;

  margin:0;

  color:
    rgba(
      255,
      255,
      255,
      .77
    );

  line-height:1.75;
}

.notifications-page
.notification-subscription-points{
  display:flex;
  flex-wrap:wrap;
  gap:10px;

  margin-top:21px;
}

.notifications-page
.notification-subscription-points span{
  display:inline-flex;
  align-items:center;
  gap:8px;

  min-height:37px;

  padding:
    0 12px;

  border:
    1px solid
    rgba(
      255,
      255,
      255,
      .13
    );

  border-radius:999px;

  color:
    rgba(
      255,
      255,
      255,
      .88
    );

  background:
    rgba(
      255,
      255,
      255,
      .07
    );

  font-size:.68rem;
  font-weight:800;
}

.notifications-page
.notification-subscription-points i{
  color:#9ce4da;
}


/*==================================================
NOTIFICATION SUBSCRIPTION FORM
==================================================*/

.notifications-page
.notification-subscription-form{
  display:grid;
  gap:14px;

  min-width:0;

  padding:24px;

  border:
    1px solid
    rgba(
      255,
      255,
      255,
      .15
    );

  border-radius:22px;

  background:
    linear-gradient(
      145deg,
      rgba(
        255,
        255,
        255,
        .15
      ),
      rgba(
        255,
        255,
        255,
        .07
      )
    );

  box-shadow:
    0 16px 38px
    rgba(19,42,47,.16);

  backdrop-filter:
    blur(17px);

  -webkit-backdrop-filter:
    blur(17px);
}

.notifications-page
.notification-subscription-form
.form-field{
  display:grid;
  gap:7px;

  min-width:0;
}

.notifications-page
.notification-subscription-form label{
  color:
    rgba(
      255,
      255,
      255,
      .86
    );

  font-size:.72rem;
  font-weight:800;
}

.notifications-page
.notification-subscription-form input,
.notifications-page
.notification-subscription-form select{
  width:100%;
  min-width:0;
  min-height:47px;

  padding:
    0 13px;

  border:
    1px solid
    rgba(
      255,
      255,
      255,
      .15
    );

  border-radius:12px;

  outline:none;

  color:#2c454b;

  background:#eaf3f1;

  font:inherit;
}

.notifications-page
.notification-subscription-form input::placeholder{
  color:#798c8f;
}

.notifications-page
.notification-subscription-form input:focus,
.notifications-page
.notification-subscription-form select:focus{
  border-color:#92ddd3;

  box-shadow:
    0 0 0 4px
    rgba(
      146,
      221,
      211,
      .14
    );
}


/*==================================================
NOTIFICATION GUIDANCE SECTION
==================================================*/

.notifications-page
.notification-guidance-section{
  padding:72px 0;

  background:
    radial-gradient(
      circle at 8% 12%,
      rgba(77,151,156,.1),
      transparent 30%
    ),
    linear-gradient(
      145deg,
      #e3efec,
      #eee6f1
    );
}

.notifications-page
.notification-guidance-section
.counsellor-support-card{
  display:grid;

  grid-template-columns:
    minmax(0,1fr)
    auto;

  align-items:center;
  gap:28px;

  padding:32px;

  border:
    1px solid
    rgba(
      255,
      255,
      255,
      .13
    );

  border-radius:26px;

  background:
    radial-gradient(
      circle at 92% 8%,
      rgba(
        146,
        219,
        210,
        .19
      ),
      transparent 31%
    ),
    linear-gradient(
      135deg,
      #304f58,
      #486a70 58%,
      #65517b
    );

  box-shadow:
    0 22px 54px
    rgba(40,67,70,.19);
}

.notifications-page
.notification-guidance-section
.counsellor-support-content{
  min-width:0;
}

.notifications-page
.notification-guidance-section
.section-kicker{
  color:#9fe4db;
}

.notifications-page
.notification-guidance-section
.counsellor-support-content h2{
  margin:
    6px 0 11px;

  color:#fff;

  font-size:
    clamp(
      1.8rem,
      3.5vw,
      2.8rem
    );

  line-height:1.15;
}

.notifications-page
.notification-guidance-section
.counsellor-support-content p{
  max-width:720px;

  margin:0;

  color:
    rgba(
      255,
      255,
      255,
      .78
    );

  line-height:1.7;
}

.notifications-page
.notification-guidance-section
.counsellor-support-tags{
  display:flex;
  flex-wrap:wrap;
  gap:9px;

  margin-top:18px;
}

.notifications-page
.notification-guidance-section
.counsellor-support-tags span{
  padding:
    8px 11px;

  border:
    1px solid
    rgba(
      255,
      255,
      255,
      .13
    );

  border-radius:999px;

  color:
    rgba(
      255,
      255,
      255,
      .86
    );

  background:
    rgba(
      255,
      255,
      255,
      .065
    );

  font-size:.66rem;
  font-weight:800;
}

.notifications-page
.notification-guidance-section
.counsellor-support-actions{
  display:grid;
  gap:11px;

  min-width:220px;
}


/*==================================================
NOTIFICATION FAQ
==================================================*/

.notifications-page
.notification-faq-section{
  padding:82px 0;

  background:
    radial-gradient(
      circle at 12% 10%,
      rgba(91,157,161,.11),
      transparent 30%
    ),
    linear-gradient(
      145deg,
      #e5efed,
      #eee7f1
    );
}

.notifications-page
.notification-faq-section
.faq-list{
  display:grid;
  gap:13px;

  max-width:920px;

  margin:
    36px auto 0;
}

.notifications-page
.notification-faq-section
.faq-item{
  overflow:hidden;

  border:
    1px solid
    rgba(
      62,
      97,
      101,
      .13
    );

  border-radius:18px;

  background:
    linear-gradient(
      145deg,
      #edf4f2,
      #eee8f2
    );

  box-shadow:
    0 12px 28px
    rgba(44,73,76,.08);
}

.notifications-page
.notification-faq-section
.faq-question{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;

  width:100%;
  min-height:65px;

  padding:
    17px 19px;

  border:0;

  color:#2b454b;

  background:transparent;

  text-align:left;

  font:inherit;
  font-size:.83rem;
  font-weight:900;

  cursor:pointer;
}

.notifications-page
.notification-faq-section
.faq-question i{
  flex:0 0 auto;

  color:#65517c;

  transition:
    transform .25s ease;
}

.notifications-page
.notification-faq-section
.faq-item.active
.faq-question i{
  transform:
    rotate(180deg);
}

.notifications-page
.notification-faq-section
.faq-answer{
  overflow:hidden;
}

.notifications-page
.notification-faq-section
.accordion-content{
  padding:
    0 19px 18px;

  color:#62777b;

  font-size:.76rem;

  line-height:1.75;
}


/*==================================================
IMPORTANT NOTICE
==================================================*/

.notifications-page
.important-notice-section{
  padding:52px 0;

  background:
    linear-gradient(
      145deg,
      #eee8d9,
      #e5efed
    );
}

.notifications-page
.important-notice-card{
  display:flex;
  align-items:flex-start;
  gap:18px;

  padding:25px;

  border:
    1px solid
    rgba(
      137,
      92,
      35,
      .16
    );

  border-radius:21px;

  background:
    radial-gradient(
      circle at 94% 5%,
      rgba(190,139,61,.09),
      transparent 34%
    ),
    linear-gradient(
      145deg,
      #f3ead4,
      #ece7de
    );

  box-shadow:
    0 14px 30px
    rgba(83,67,43,.09);
}

.notifications-page
.important-notice-icon{
  display:grid;
  place-items:center;

  flex:0 0 52px;

  width:52px;
  height:52px;

  border-radius:16px;

  color:#ffe5a5;

  background:
    linear-gradient(
      145deg,
      #8b5d2e,
      #b17a3e
    );

  font-size:1.18rem;
}

.notifications-page
.important-notice-card h2{
  margin:
    0 0 8px;

  color:#62482d;

  font-size:1.18rem;
}

.notifications-page
.important-notice-card p{
  margin:0;

  color:#73624f;

  font-size:.78rem;

  line-height:1.7;
}


/*==================================================
LEGAL DISCLAIMER
==================================================*/

.notifications-page
.legal-disclaimer-section{
  padding:48px 0;

  background:
    linear-gradient(
      145deg,
      #e2eeeb,
      #ebe6ef
    );
}

.notifications-page
.legal-disclaimer-content{
  padding:24px;

  border:
    1px solid
    rgba(
      65,
      98,
      102,
      .13
    );

  border-radius:20px;

  background:
    linear-gradient(
      145deg,
      #edf4f2,
      #eee8f2
    );

  box-shadow:
    0 12px 28px
    rgba(44,73,76,.07);
}

.notifications-page
.legal-disclaimer-content h2{
  margin:
    0 0 9px;

  color:#2d474c;

  font-size:1.08rem;
}

.notifications-page
.legal-disclaimer-content p{
  margin:
    0 0 12px;

  color:#62777b;

  font-size:.76rem;

  line-height:1.7;
}


/*==================================================
FILTER OVERLAY
==================================================*/

.notifications-page
.filter-overlay{
  position:fixed;
  inset:0;

  z-index:998;

  visibility:hidden;
  opacity:0;

  background:
    rgba(
      20,
      35,
      40,
      .58
    );

  transition:
    opacity .25s ease,
    visibility .25s ease;
}

.notifications-page
.filter-overlay.active{
  visibility:visible;
  opacity:1;
}

body.filter-panel-open{
  overflow:hidden;
}


/*==================================================
NOTIFICATION TOAST
==================================================*/

.notifications-page
.toast-container{
  position:fixed;

  right:18px;
  bottom:95px;

  z-index:1200;

  display:grid;
  gap:10px;

  width:
    min(
      330px,
      calc(100vw - 36px)
    );
}

.notifications-page .toast{
  padding:
    14px 16px;

  border-radius:14px;

  color:#fff;

  background:
    linear-gradient(
      145deg,
      #315b62,
      #635177
    );

  box-shadow:
    0 16px 34px
    rgba(26,48,52,.25);

  font-size:.76rem;
  font-weight:800;

  animation:
    notificationToastIn
    .28s ease both;
}

@keyframes notificationToastIn{

  from{
    opacity:0;

    transform:
      translateY(12px);
  }

  to{
    opacity:1;

    transform:
      translateY(0);
  }

}


/*==================================================
RESPONSIVE -- LARGE TABLET
==================================================*/

@media(max-width:1180px){

  .notifications-page
  .featured-notification-grid{
    grid-template-columns:
      repeat(2,minmax(0,1fr));
  }

  .notifications-page
  .notification-result-grid{
    grid-template-columns:
      repeat(2,minmax(0,1fr));
  }

  .notifications-page
  .notification-summary-strip
  .trust-strip-grid{
    grid-template-columns:
      repeat(2,minmax(0,1fr));
  }

}


/*==================================================
RESPONSIVE -- TABLET
==================================================*/

@media(max-width:960px){

  .notifications-page .hero-layout,
  .notifications-page
  .notification-subscription-card,
  .notifications-page
  .notification-guidance-section
  .counsellor-support-card{
    grid-template-columns:1fr;
  }

  .notifications-page
  .notification-catalogue-stage{
    grid-template-columns:1fr;
  }

  .notifications-page
  .notification-filter-panel{
    position:fixed;

    top:0;
    left:0;

    z-index:999;

    width:
      min(
        88vw,
        365px
      );

    height:100dvh;

    overflow-y:auto;
    overscroll-behavior:contain;

    border-radius:
      0 24px 24px 0;

    transform:
      translateX(-105%);

    transition:
      transform .28s ease;
  }

  .notifications-page
  .notification-filter-panel.active{
    transform:
      translateX(0);
  }

  .notifications-page
  .filter-close-button,
  .notifications-page
  .filter-toggle-button{
    display:inline-flex;
  }

  .notifications-page
  .institution-category-grid,
  .notifications-page
  .timeline-grid{
    grid-template-columns:
      repeat(2,minmax(0,1fr));
  }

  .notifications-page
  .notification-guidance-section
  .counsellor-support-actions{
    grid-template-columns:
      repeat(2,minmax(0,1fr));

    min-width:0;
  }

}


/*==================================================
RESPONSIVE -- MOBILE
==================================================*/

@media(max-width:700px){

  .notifications-page
  .notifications-hero-section{
    min-height:auto;

    padding:
      68px 0;
  }

  .notifications-page
  .hero-content h1{
    font-size:
      clamp(
        2.35rem,
        12vw,
        3.85rem
      );

    letter-spacing:-1.4px;
  }

  .notifications-page
  .featured-notification-grid,
  .notifications-page
  .notification-result-grid,
  .notifications-page
  .institution-category-grid,
  .notifications-page
  .timeline-grid{
    grid-template-columns:1fr;
  }

  .notifications-page
  .catalogue-results-toolbar{
    align-items:stretch;
    flex-direction:column;
  }

  .notifications-page
  .catalogue-results-summary,
  .notifications-page
  .catalogue-sort-wrapper{
    justify-content:space-between;
  }

  .notifications-page
  .catalogue-sort-wrapper select{
    flex:1;
    min-width:0;
  }

  .notifications-page
  .notification-card-actions{
    grid-template-columns:1fr;
  }

  .notifications-page
  .notification-guidance-section
  .counsellor-support-actions{
    grid-template-columns:1fr;
  }

  .notifications-page
  .notification-subscription-card{
    padding:25px;
  }

}


/*==================================================
RESPONSIVE -- SMALL MOBILE
==================================================*/

@media(max-width:520px){

  .notifications-page
  .notification-summary-strip
  .trust-strip-grid{
    grid-template-columns:1fr;
  }

  .notifications-page
  .hero-actions{
    display:grid;
    grid-template-columns:1fr;
  }

  .notifications-page
  .hero-actions .button{
    width:100%;
  }

  .notifications-page
  .hero-trust-list{
    display:grid;
    grid-template-columns:1fr;
  }

  .notifications-page
  .notification-finder-card,
  .notifications-page
  .notification-subscription-card,
  .notifications-page
  .notification-subscription-form,
  .notifications-page
  .notification-guidance-section
  .counsellor-support-card{
    padding:21px;

    border-radius:20px;
  }

  .notifications-page
  .notification-result-card,
  .notifications-page
  .featured-notification-card{
    padding:18px;
  }

  .notifications-page
  .notification-meta-grid{
    grid-template-columns:1fr;
  }

  .notifications-page
  .important-notice-card{
    display:grid;
    grid-template-columns:1fr;
  }

  .notifications-page
  .notification-subscription-points{
    display:grid;
    grid-template-columns:1fr;
  }

  .notifications-page
  .notification-subscription-points span{
    width:100%;
  }

}

/*==================================================
FOOTER
==================================================*/

.notifications-page .site-footer{
  position:relative;
  overflow:hidden;
  color:#edf7f6;
  background:
    radial-gradient(
      circle at 88% 12%,
      rgba(108,195,187,.14),
      transparent 28%
    ),
    linear-gradient(
      145deg,
      #243942,
      #2d5059 50%,
      #514567
    );
}

.notifications-page .footer-top-section{
  padding:70px 0 46px;
  border-bottom:1px solid rgba(255,255,255,.08);
}

.notifications-page .footer-top-layout{
  display:grid;
  grid-template-columns:
    minmax(0,1fr)
    minmax(320px,.72fr);
  gap:42px;
  align-items:center;
}

.notifications-page .footer-brand-column p{
  max-width:560px;
  margin:18px 0;
  color:rgba(255,255,255,.74);
  line-height:1.8;
}

.notifications-page .footer-service-badges{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
}

.notifications-page .footer-service-badges span{
  padding:9px 13px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.1);
  background:rgba(255,255,255,.06);
  font-size:.7rem;
  font-weight:700;
}

.notifications-page .footer-update-column h2{
  margin:10px 0;
  color:#fff;
}

.notifications-page .footer-update-column p{
  color:rgba(255,255,255,.72);
  line-height:1.75;
}

.notifications-page .footer-contact-actions{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  margin-top:24px;
}

.notifications-page .footer-main-section{
  padding:54px 0;
}

.notifications-page .footer-main-grid{
  display:grid;
  grid-template-columns:
    repeat(4,minmax(0,1fr));
  gap:28px;
}

.notifications-page .footer-link-column h3{
  margin-bottom:16px;
  color:#fff;
  font-size:1rem;
}

.notifications-page .footer-link-column nav{
  display:grid;
  gap:11px;
}

.notifications-page .footer-link-column a{
  color:rgba(255,255,255,.72);
  text-decoration:none;
  transition:.25s;
}

.notifications-page .footer-link-column a:hover{
  color:#9fe4dc;
}

.notifications-page .footer-bottom-section{
  padding:22px 0;
  border-top:1px solid rgba(255,255,255,.08);
}

.notifications-page .footer-bottom-wrapper{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:20px;
  flex-wrap:wrap;
}

.notifications-page .footer-bottom-wrapper p{
  margin:0;
  color:rgba(255,255,255,.65);
}

.notifications-page .footer-bottom-links{
  display:flex;
  flex-wrap:wrap;
  gap:18px;
}

.notifications-page .footer-bottom-links a{
  color:rgba(255,255,255,.72);
  text-decoration:none;
}

.notifications-page .footer-bottom-links a:hover{
  color:#9ce4da;
}


/*==================================================
MOBILE QUICK ACTION BAR
==================================================*/

.notifications-page .mobile-quick-actions{
  display:none;
}

@media(max-width:768px){

  .notifications-page .mobile-quick-actions{
    position:fixed;
    left:0;
    right:0;
    bottom:0;
    z-index:1000;

    display:grid;
    grid-template-columns:repeat(5,1fr);

    padding:8px 8px calc(8px + env(safe-area-inset-bottom));

    background:
      rgba(37,58,66,.97);

    backdrop-filter:blur(18px);
    -webkit-backdrop-filter:blur(18px);

    border-top:
      1px solid
      rgba(255,255,255,.08);
  }

  .notifications-page .mobile-quick-actions a{
    display:grid;
    justify-items:center;
    gap:4px;

    color:#d9efec;
    text-decoration:none;

    font-size:.68rem;

    padding:8px 0;
  }

  .notifications-page .mobile-quick-actions a span{
    display:grid;
    place-items:center;

    width:42px;
    height:42px;

    border-radius:14px;

    background:
      rgba(255,255,255,.06);

    font-size:1rem;
  }

  .notifications-page
  .mobile-quick-action-main span{
    background:
      linear-gradient(
        145deg,
        #60c7bb,
        #8661a6
      );

    color:#fff;
  }

  .notifications-page
  .mobile-quick-actions
  a.active{
    color:#9ce5db;
  }

}


/*==================================================
BACK TO TOP
==================================================*/

.notifications-page .back-to-top{
  position:fixed;

  right:22px;
  bottom:100px;

  z-index:999;

  display:grid;
  place-items:center;

  width:52px;
  height:52px;

  border:none;
  border-radius:50%;

  color:#fff;

  cursor:pointer;

  background:
    linear-gradient(
      145deg,
      #355d65,
      #67537e
    );

  box-shadow:
    0 16px 34px
    rgba(30,52,58,.22);

  transition:
    .28s;
}

.notifications-page .back-to-top:hover{
  transform:
    translateY(-4px);
}


/*==================================================
SMALL DEVICES
==================================================*/

@media(max-width:900px){

  .notifications-page .footer-top-layout,
  .notifications-page .footer-main-grid{
    grid-template-columns:1fr 1fr;
  }

}

@media(max-width:600px){

  .notifications-page .footer-top-layout,
  .notifications-page .footer-main-grid{
    grid-template-columns:1fr;
  }

  .notifications-page .footer-contact-actions{
    display:grid;
    grid-template-columns:1fr;
  }

  .notifications-page .footer-bottom-wrapper{
    text-align:center;
    justify-content:center;
  }

  .notifications-page .footer-bottom-links{
    justify-content:center;
  }

}

/*==================================================
SECTION HEADING
==================================================*/

.education-notifications-page .section-heading{
  max-width:760px;
  margin:0 auto 38px;
  text-align:center;
}

.education-notifications-page .section-heading h2{
  margin:8px 0 13px;
  color:#294248;
  font-size:clamp(2rem,4vw,3.2rem);
  line-height:1.14;
}

.education-notifications-page .section-heading p{
  margin:0;
  color:#62777b;
  line-height:1.75;
}


/*==================================================
SUMMARY COUNTERS
==================================================*/

.education-notifications-page .education-notification-summary{
  padding:34px 0;
  background:
    linear-gradient(
      145deg,
      #e4efed,
      #eee7f1
    );
}

.education-notifications-page .education-notification-summary-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:15px;
}

.education-notifications-page .education-summary-card{
  display:flex;
  align-items:center;
  gap:14px;
  min-height:104px;
  padding:19px;
  border:1px solid var(--edu-notification-border);
  border-radius:19px;
  background:
    linear-gradient(
      145deg,
      #edf4f2,
      #eee8f2
    );
  box-shadow:0 12px 30px rgba(47,76,78,.08);
}

.education-notifications-page .education-summary-icon{
  display:grid;
  place-items:center;
  flex:0 0 49px;
  width:49px;
  height:49px;
  border-radius:15px;
  color:#a8e8e0;
  background:
    linear-gradient(
      145deg,
      #31545c,
      #5b5271
    );
  font-size:1.1rem;
}

.education-notifications-page .education-summary-card strong{
  display:block;
  margin-bottom:3px;
  color:#273f45;
  font-size:1.18rem;
}

.education-notifications-page .education-summary-card p{
  margin:0;
  color:#607579;
  font-size:.74rem;
  line-height:1.45;
}


/*==================================================
FEATURED NOTIFICATIONS
==================================================*/

.education-notifications-page .featured-education-notification-section{
  padding:82px 0;
  background:
    radial-gradient(
      circle at 88% 12%,
      rgba(146,105,177,.1),
      transparent 30%
    ),
    linear-gradient(
      145deg,
      #e4efed,
      #eee7f1
    );
}

.education-notifications-page .featured-education-notification-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:18px;
}

.education-notifications-page .education-notification-card,
.education-notifications-page .featured-education-notification-card{
  position:relative;
  overflow:hidden;
  display:flex;
  flex-direction:column;
  min-width:0;
  padding:21px;
  border:1px solid rgba(61,96,101,.13);
  border-radius:22px;
  background:
    radial-gradient(
      circle at 100% 0%,
      rgba(120,203,193,.13),
      transparent 31%
    ),
    linear-gradient(
      145deg,
      #edf4f2,
      #eee8f2
    );
  box-shadow:var(--edu-notification-shadow);
  transition:
    transform .28s ease,
    box-shadow .28s ease,
    border-color .28s ease;
}

.education-notifications-page .featured-education-notification-card::before{
  content:"";
  position:absolute;
  top:0;
  left:0;
  width:100%;
  height:4px;
  background:
    linear-gradient(
      90deg,
      #66cbbf,
      #9b76b9
    );
}

.education-notifications-page .education-notification-card:hover,
.education-notifications-page .featured-education-notification-card:hover{
  transform:translateY(-5px);
  border-color:rgba(96,86,124,.24);
  box-shadow:0 22px 42px rgba(42,72,75,.13);
}

.education-notifications-page .education-notification-card-top{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  margin-bottom:17px;
}

.education-notifications-page .education-notification-category-badge,
.education-notifications-page .education-notification-status{
  display:inline-flex;
  align-items:center;
  min-height:29px;
  padding:0 10px;
  border-radius:999px;
  font-size:.65rem;
  font-weight:900;
  text-transform:capitalize;
}

.education-notifications-page .education-notification-category-badge{
  color:#38585d;
  background:#d9ece8;
}

.education-notifications-page .education-notification-status-latest{
  color:#31566d;
  background:#dce9f1;
}

.education-notifications-page .education-notification-status-open{
  color:#245f52;
  background:#d8eee7;
}

.education-notifications-page .education-notification-status-upcoming{
  color:#3c5980;
  background:#e0e8f2;
}

.education-notifications-page .education-notification-status-closing-soon{
  color:#89551d;
  background:#f5e4c6;
}

.education-notifications-page .education-notification-status-updated{
  color:#604879;
  background:#e8def0;
}

.education-notifications-page .education-notification-status-closed{
  color:#7a4148;
  background:#efdce0;
}

.education-notifications-page .education-notification-card-icon{
  display:grid;
  place-items:center;
  width:54px;
  height:54px;
  margin-bottom:16px;
  border-radius:17px;
  color:#b5eee6;
  background:
    linear-gradient(
      145deg,
      #31545d,
      #605273
    );
  font-size:1.25rem;
}

.education-notifications-page .education-priority-urgent{
  color:#ffd6d6;
  background:
    linear-gradient(
      145deg,
      #7d2c38,
      #b54f58
    );
}

.education-notifications-page .education-priority-high{
  color:#ffe9c0;
  background:
    linear-gradient(
      145deg,
      #805321,
      #b2803d
    );
}

.education-notifications-page .education-priority-normal{
  color:#b9eee7;
  background:
    linear-gradient(
      145deg,
      #31555d,
      #625473
    );
}

.education-notifications-page .education-priority-low{
  color:#d7e5ee;
  background:
    linear-gradient(
      145deg,
      #46616c,
      #667b85
    );
}

.education-notifications-page .education-notification-card h3,
.education-notifications-page .featured-education-notification-card h3{
  margin:0 0 8px;
  color:#294248;
  font-size:1.05rem;
  line-height:1.35;
}

.education-notifications-page .education-notification-authority{
  margin:0 0 13px;
  color:#68587f;
  font-size:.72rem;
  font-weight:800;
}

.education-notifications-page .education-notification-description{
  margin:0 0 18px;
  color:#62777b;
  font-size:.75rem;
  line-height:1.68;
}

.education-notifications-page .education-notification-meta{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px;
  margin-top:auto;
  margin-bottom:17px;
}

.education-notifications-page .education-notification-meta > div{
  min-width:0;
  padding:12px;
  border:1px solid rgba(65,97,101,.1);
  border-radius:14px;
  background:rgba(255,255,255,.42);
}

.education-notifications-page .education-notification-meta span{
  display:block;
  margin-bottom:4px;
  color:#75898c;
  font-size:.62rem;
  font-weight:800;
}

.education-notifications-page .education-notification-meta strong{
  display:block;
  color:#2e4a4f;
  font-size:.72rem;
  line-height:1.4;
  overflow-wrap:anywhere;
}

.education-notifications-page .education-notification-card-actions{
  display:grid;
  grid-template-columns:1fr auto;
  gap:9px;
}

.education-notifications-page .education-notification-card-actions .button{
  min-width:0;
  padding-inline:13px;
  font-size:.7rem;
}


/*==================================================
DIRECTORY
==================================================*/

.education-notifications-page .education-notification-directory{
  padding:82px 0;
  background:
    radial-gradient(
      circle at 10% 10%,
      rgba(94,165,167,.1),
      transparent 29%
    ),
    linear-gradient(
      145deg,
      #e7f0ee,
      #ede6f1
    );
}

.education-notifications-page .education-notification-catalogue{
  display:grid;
  grid-template-columns:
    minmax(255px,.34fr)
    minmax(0,1fr);
  align-items:start;
  gap:25px;
}

.education-notifications-page .education-notification-filter-panel{
  position:sticky;
  top:22px;
  padding:22px;
  border:1px solid var(--edu-notification-border);
  border-radius:23px;
  background:
    linear-gradient(
      145deg,
      #edf4f2,
      #eee8f2
    );
  box-shadow:0 18px 40px rgba(47,77,79,.09);
}

.education-notifications-page .education-filter-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  margin-bottom:19px;
}

.education-notifications-page .education-filter-header h3{
  margin:4px 0 0;
  color:#2b454b;
  font-size:1.16rem;
}

.education-notifications-page .education-filter-close{
  display:none;
  width:39px;
  height:39px;
  border:0;
  border-radius:11px;
  color:#fff;
  background:#355d65;
  cursor:pointer;
}

.education-notifications-page #educationNotificationFilterForm{
  display:grid;
  gap:14px;
}

.education-notifications-page #educationNotificationFilterForm label{
  color:#426066;
  font-size:.72rem;
  font-weight:800;
}

.education-notifications-page #educationNotificationFilterForm input,
.education-notifications-page #educationNotificationFilterForm select,
.education-notifications-page .education-alert-form input,
.education-notifications-page .education-alert-form select{
  width:100%;
  min-width:0;
  min-height:46px;
  padding:0 13px;
  border:1px solid rgba(55,94,98,.14);
  border-radius:12px;
  outline:none;
  color:#2a4248;
  background:#e9f2f0;
  font:inherit;
}

.education-notifications-page #educationNotificationFilterForm input:focus,
.education-notifications-page #educationNotificationFilterForm select:focus,
.education-notifications-page .education-alert-form input:focus,
.education-notifications-page .education-alert-form select:focus{
  border-color:#7088a2;
  box-shadow:0 0 0 4px rgba(112,136,162,.12);
}

.education-notifications-page .education-search-wrapper{
  position:relative;
}

.education-notifications-page .education-search-wrapper i{
  position:absolute;
  top:50%;
  left:14px;
  transform:translateY(-50%);
  color:#788c8f;
  pointer-events:none;
}

.education-notifications-page .education-search-wrapper input{
  padding-left:39px !important;
}

.education-notifications-page .education-notification-results-panel{
  min-width:0;
}

.education-notifications-page .education-results-toolbar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  margin-bottom:18px;
  padding:17px 18px;
  border:1px solid rgba(66,101,105,.12);
  border-radius:18px;
  background:
    linear-gradient(
      145deg,
      #edf4f2,
      #eee8f3
    );
  box-shadow:0 12px 28px rgba(45,75,78,.07);
}

.education-notifications-page .education-results-summary{
  display:flex;
  align-items:center;
  gap:13px;
}

.education-notifications-page .education-results-summary p{
  margin:0;
  color:#526b70;
  font-size:.82rem;
}

.education-notifications-page .education-results-summary strong{
  color:#263f45;
  font-size:1.12rem;
}

.education-notifications-page .education-filter-toggle{
  display:none;
  align-items:center;
  justify-content:center;
  gap:8px;
  min-height:42px;
  padding:0 14px;
  border:0;
  border-radius:12px;
  color:#fff;
  background:
    linear-gradient(
      145deg,
      #355d65,
      #66527e
    );
  font-weight:800;
  cursor:pointer;
}

.education-notifications-page .education-sort-wrapper{
  display:flex;
  align-items:center;
  gap:9px;
}

.education-notifications-page .education-sort-wrapper label{
  color:#607579;
  font-size:.72rem;
  font-weight:800;
}

.education-notifications-page .education-sort-wrapper select{
  min-height:42px;
  padding:0 12px;
  border:1px solid rgba(59,94,98,.13);
  border-radius:11px;
  color:#2c454b;
  background:#e9f2f0;
  outline:none;
}

.education-notifications-page .education-active-filter-list{
  display:flex;
  flex-wrap:wrap;
  gap:9px;
  margin-bottom:16px;
}

.education-notifications-page .education-active-filter-chip{
  display:inline-flex;
  align-items:center;
  gap:8px;
  min-height:34px;
  padding:0 11px;
  border:1px solid rgba(93,78,118,.13);
  border-radius:999px;
  color:#52606d;
  background:#e8e0ee;
  font-size:.7rem;
  font-weight:800;
  cursor:pointer;
}

.education-notifications-page .education-active-filter-chip:hover{
  color:#fff;
  background:#65517c;
}

.education-notifications-page .education-notification-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:18px;
}


/*==================================================
STATES AND PAGINATION
==================================================*/

.education-notifications-page .section-loader,
.education-notifications-page .education-empty-state{
  grid-column:1 / -1;
  text-align:center;
}

.education-notifications-page .section-loader{
  display:grid;
  justify-items:center;
  gap:13px;
  padding:58px 20px;
  color:#64797d;
}

.education-notifications-page .education-empty-state{
  padding:58px 22px;
  border:1px solid var(--edu-notification-border);
  border-radius:22px;
  background:
    linear-gradient(
      145deg,
      #edf4f2,
      #eee8f2
    );
}

.education-notifications-page .education-empty-icon{
  display:grid;
  place-items:center;
  width:66px;
  height:66px;
  margin:0 auto 16px;
  border-radius:20px;
  color:#acebe3;
  background:#355a63;
  font-size:1.45rem;
}

.education-notifications-page .education-empty-state h3{
  margin:0 0 8px;
  color:#2b464c;
}

.education-notifications-page .education-empty-state p{
  max-width:540px;
  margin:0 auto 19px;
  color:#62787c;
  font-size:.8rem;
  line-height:1.65;
}

.education-notifications-page .education-pagination{
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  gap:8px;
  margin-top:26px;
}

.education-notifications-page .education-pagination-button{
  display:grid;
  place-items:center;
  min-width:40px;
  height:40px;
  padding:0 11px;
  border:1px solid rgba(60,94,98,.13);
  border-radius:11px;
  color:#39565b;
  background:#e6f0ed;
  font-weight:800;
  cursor:pointer;
}

.education-notifications-page .education-pagination-button:hover,
.education-notifications-page .education-pagination-button.active{
  color:#fff;
  border-color:transparent;
  background:
    linear-gradient(
      145deg,
      #365d65,
      #66527d
    );
}

.education-notifications-page .education-pagination-button:disabled{
  opacity:.45;
  cursor:not-allowed;
}


/*==================================================
CATEGORY SECTION
==================================================*/

.education-notifications-page .education-notification-category-section{
  padding:82px 0;
  background:
    radial-gradient(
      circle at 88% 12%,
      rgba(147,111,176,.1),
      transparent 29%
    ),
    linear-gradient(
      145deg,
      #e6efed,
      #ece6f1
    );
}

.education-notifications-page .education-category-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:18px;
}

.education-notifications-page .education-category-card{
  display:flex;
  flex-direction:column;
  min-height:250px;
  padding:23px;
  border:1px solid var(--edu-notification-border);
  border-radius:21px;
  color:inherit;
  background:
    linear-gradient(
      145deg,
      #edf4f2,
      #eee8f2
    );
  box-shadow:0 15px 32px rgba(44,73,76,.08);
  transition:
    transform .28s ease,
    box-shadow .28s ease;
}

.education-notifications-page .education-category-card:hover{
  transform:translateY(-5px);
  box-shadow:0 22px 40px rgba(44,73,76,.12);
}

.education-notifications-page .education-category-icon{
  display:grid;
  place-items:center;
  width:54px;
  height:54px;
  margin-bottom:17px;
  border-radius:17px;
  color:#b3ece5;
  background:
    linear-gradient(
      145deg,
      #32575f,
      #65527b
    );
  font-size:1.2rem;
}

.education-notifications-page .education-category-card h3{
  margin:0 0 9px;
  color:#2b454b;
  font-size:1.02rem;
}

.education-notifications-page .education-category-card p{
  margin:0 0 18px;
  color:#64797c;
  font-size:.76rem;
  line-height:1.65;
}

.education-notifications-page .education-category-card .text-link{
  margin-top:auto;
  color:#64527b;
  font-size:.7rem;
  font-weight:900;
}


/*==================================================
DEADLINES
==================================================*/

.education-notifications-page .education-deadline-section{
  padding:82px 0;
  background:
    linear-gradient(
      145deg,
      #e4efed,
      #ece6f1
    );
}

.education-notifications-page .education-deadline-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:18px;
}

.education-notifications-page .education-deadline-card{
  min-width:0;
  padding:22px;
  border:1px solid var(--edu-notification-border);
  border-radius:20px;
  background:
    linear-gradient(
      145deg,
      #edf4f2,
      #eee8f2
    );
  box-shadow:0 15px 32px rgba(44,73,76,.08);
}

.education-notifications-page .education-deadline-number{
  display:grid;
  place-items:center;
  width:48px;
  height:48px;
  margin-bottom:15px;
  border-radius:15px;
  color:#b1ece4;
  background:
    linear-gradient(
      145deg,
      #31565e,
      #65527a
    );
  font-size:.76rem;
  font-weight:900;
}

.education-notifications-page .education-deadline-card h3{
  margin:0 0 8px;
  color:#294348;
  font-size:.98rem;
}

.education-notifications-page .education-deadline-card strong{
  display:block;
  margin-bottom:7px;
  color:#65517c;
  font-size:.75rem;
}

.education-notifications-page .education-deadline-card p{
  margin:0;
  color:#62777b;
  font-size:.72rem;
  line-height:1.55;
}


/*==================================================
ALERT REQUEST
==================================================*/

.education-notifications-page .education-alert-request-section{
  padding:82px 0;
  background:
    radial-gradient(
      circle at 90% 10%,
      rgba(150,112,181,.13),
      transparent 30%
    ),
    linear-gradient(
      145deg,
      #e5efed,
      #ece6f1
    );
}

.education-notifications-page .education-alert-request-card{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(320px,.72fr);
  align-items:center;
  gap:34px;
  padding:34px;
  border:1px solid rgba(255,255,255,.14);
  border-radius:27px;
  background:
    radial-gradient(
      circle at 94% 8%,
      rgba(153,226,216,.19),
      transparent 32%
    ),
    linear-gradient(
      135deg,
      #304f58,
      #476a70 55%,
      #66517c
    );
  box-shadow:0 24px 56px rgba(40,68,72,.2);
}

.education-notifications-page .education-alert-request-content .section-kicker{
  color:#a8e8df;
}

.education-notifications-page .education-alert-request-content h2{
  margin:7px 0 13px;
  color:#fff;
  font-size:clamp(2rem,4vw,3.2rem);
  line-height:1.12;
}

.education-notifications-page .education-alert-request-content > p{
  margin:0;
  color:rgba(255,255,255,.77);
  line-height:1.75;
}

.education-notifications-page .education-alert-points{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:21px;
}

.education-notifications-page .education-alert-points span{
  display:inline-flex;
  align-items:center;
  gap:8px;
  min-height:37px;
  padding:0 12px;
  border:1px solid rgba(255,255,255,.13);
  border-radius:999px;
  color:rgba(255,255,255,.88);
  background:rgba(255,255,255,.07);
  font-size:.68rem;
  font-weight:800;
}

.education-notifications-page .education-alert-points i{
  color:#9ce4da;
}

.education-notifications-page .education-alert-form{
  display:grid;
  gap:14px;
  min-width:0;
  padding:24px;
  border:1px solid rgba(255,255,255,.15);
  border-radius:22px;
  background:
    linear-gradient(
      145deg,
      rgba(255,255,255,.15),
      rgba(255,255,255,.07)
    );
  box-shadow:0 16px 38px rgba(19,42,47,.16);
  backdrop-filter:blur(17px);
  -webkit-backdrop-filter:blur(17px);
}

.education-notifications-page .education-alert-form label{
  color:rgba(255,255,255,.86);
  font-size:.72rem;
  font-weight:800;
}


/*==================================================
GUIDANCE AND FAQ
==================================================*/

.education-notifications-page .education-notification-guidance-section{
  padding:72px 0;
  background:
    linear-gradient(
      145deg,
      #e3efec,
      #eee6f1
    );
}

.education-notifications-page .education-guidance-card{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:center;
  gap:28px;
  padding:32px;
  border-radius:26px;
  background:
    radial-gradient(
      circle at 92% 8%,
      rgba(146,219,210,.19),
      transparent 31%
    ),
    linear-gradient(
      135deg,
      #304f58,
      #486a70 58%,
      #65517b
    );
  box-shadow:0 22px 54px rgba(40,67,70,.19);
}

.education-notifications-page .education-guidance-card .section-kicker{
  color:#9fe4db;
}

.education-notifications-page .education-guidance-card h2{
  margin:6px 0 11px;
  color:#fff;
  font-size:clamp(1.8rem,3.5vw,2.8rem);
  line-height:1.15;
}

.education-notifications-page .education-guidance-card p{
  margin:0;
  color:rgba(255,255,255,.78);
  line-height:1.7;
}

.education-notifications-page .education-guidance-tags{
  display:flex;
  flex-wrap:wrap;
  gap:9px;
  margin-top:18px;
}

.education-notifications-page .education-guidance-tags span{
  padding:8px 11px;
  border:1px solid rgba(255,255,255,.13);
  border-radius:999px;
  color:rgba(255,255,255,.86);
  background:rgba(255,255,255,.065);
  font-size:.66rem;
  font-weight:800;
}

.education-notifications-page .education-guidance-actions{
  display:grid;
  gap:11px;
  min-width:220px;
}

.education-notifications-page .education-notification-faq-section{
  padding:82px 0;
  background:
    linear-gradient(
      145deg,
      #e5efed,
      #eee7f1
    );
}

.education-notifications-page .education-faq-list{
  display:grid;
  gap:13px;
  max-width:920px;
  margin:36px auto 0;
}

.education-notifications-page .education-faq-item{
  overflow:hidden;
  border:1px solid var(--edu-notification-border);
  border-radius:18px;
  background:
    linear-gradient(
      145deg,
      #edf4f2,
      #eee8f2
    );
  box-shadow:0 12px 28px rgba(44,73,76,.08);
}

.education-notifications-page .education-faq-question{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  width:100%;
  min-height:65px;
  padding:17px 19px;
  border:0;
  color:#2b454b;
  background:transparent;
  text-align:left;
  font:inherit;
  font-size:.83rem;
  font-weight:900;
  cursor:pointer;
}

.education-notifications-page .education-faq-question i{
  color:#65517c;
  transition:transform .25s ease;
}

.education-notifications-page .education-faq-item.active .education-faq-question i{
  transform:rotate(180deg);
}

.education-notifications-page .education-faq-answer{
  display:none;
  padding:0 19px 18px;
}

.education-notifications-page .education-faq-item.active .education-faq-answer{
  display:block;
}

.education-notifications-page .education-faq-answer p{
  margin:0;
  color:#62777b;
  font-size:.76rem;
  line-height:1.75;
}


/*==================================================
NOTICE AND DISCLAIMER
==================================================*/

.education-notifications-page .education-important-notice-section,
.education-notifications-page .education-notification-disclaimer-section{
  padding:52px 0;
  background:
    linear-gradient(
      145deg,
      #eee8d9,
      #e5efed
    );
}

.education-notifications-page .education-important-notice-card{
  display:flex;
  align-items:flex-start;
  gap:18px;
  padding:25px;
  border:1px solid rgba(137,92,35,.16);
  border-radius:21px;
  background:
    linear-gradient(
      145deg,
      #f3ead4,
      #ece7de
    );
}

.education-notifications-page .education-important-notice-icon{
  display:grid;
  place-items:center;
  flex:0 0 52px;
  width:52px;
  height:52px;
  border-radius:16px;
  color:#ffe5a5;
  background:
    linear-gradient(
      145deg,
      #8b5d2e,
      #b17a3e
    );
  font-size:1.18rem;
}

.education-notifications-page .education-important-notice-card h2,
.education-notifications-page .education-notification-disclaimer-card h2{
  margin:0 0 8px;
  color:#62482d;
  font-size:1.18rem;
}

.education-notifications-page .education-important-notice-card p,
.education-notifications-page .education-notification-disclaimer-card p{
  margin:0;
  color:#73624f;
  font-size:.78rem;
  line-height:1.7;
}

.education-notifications-page .education-notification-disclaimer-card{
  padding:24px;
  border:1px solid var(--edu-notification-border);
  border-radius:20px;
  background:
    linear-gradient(
      145deg,
      #edf4f2,
      #eee8f2
    );
}


/*==================================================
FOOTER
==================================================*/

.education-notifications-page .education-notification-footer{
  color:#edf7f6;
  background:
    radial-gradient(
      circle at 88% 12%,
      rgba(108,195,187,.14),
      transparent 28%
    ),
    linear-gradient(
      145deg,
      #243942,
      #2d5059 50%,
      #514567
    );
}

.education-notifications-page .education-footer-top{
  padding:70px 0 46px;
  border-bottom:1px solid rgba(255,255,255,.08);
}

.education-notifications-page .education-footer-top-grid{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(320px,.72fr);
  gap:42px;
  align-items:center;
}

.education-notifications-page .education-footer-brand p,
.education-notifications-page .education-footer-support p{
  color:rgba(255,255,255,.74);
  line-height:1.8;
}

.education-notifications-page .education-footer-badges{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
}

.education-notifications-page .education-footer-badges span{
  padding:9px 13px;
  border:1px solid rgba(255,255,255,.1);
  border-radius:999px;
  background:rgba(255,255,255,.06);
  font-size:.7rem;
}

.education-notifications-page .education-footer-support .section-kicker{
  color:#9fe4db;
}

.education-notifications-page .education-footer-support h2{
  margin:10px 0;
  color:#fff;
}

.education-notifications-page .education-footer-actions{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  margin-top:24px;
}

.education-notifications-page .education-footer-main{
  padding:54px 0;
}

.education-notifications-page .education-footer-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:28px;
}

.education-notifications-page .education-footer-column h3{
  margin-bottom:16px;
  color:#fff;
}

.education-notifications-page .education-footer-column nav{
  display:grid;
  gap:11px;
}

.education-notifications-page .education-footer-column a{
  color:rgba(255,255,255,.72);
}

.education-notifications-page .education-footer-column a:hover{
  color:#9fe4dc;
}

.education-notifications-page .education-footer-bottom{
  padding:22px 0;
  border-top:1px solid rgba(255,255,255,.08);
}

.education-notifications-page .education-footer-bottom-wrapper{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  flex-wrap:wrap;
}

.education-notifications-page .education-footer-bottom-wrapper p{
  margin:0;
  color:rgba(255,255,255,.65);
}

.education-notifications-page .education-footer-bottom-links{
  display:flex;
  flex-wrap:wrap;
  gap:18px;
}

.education-notifications-page .education-footer-bottom-links a{
  color:rgba(255,255,255,.72);
}


/*==================================================
MOBILE ACTIONS, OVERLAYS AND MODAL
==================================================*/

.education-notifications-page .education-mobile-quick-actions{
  display:none;
}

.education-notifications-page .education-filter-overlay,
.education-notifications-page .education-navigation-overlay{
  position:fixed;
  inset:0;
  z-index:998;
  visibility:hidden;
  opacity:0;
  background:rgba(20,35,40,.58);
  transition:.25s ease;
}

.education-notifications-page .education-filter-overlay.active,
.education-notifications-page .education-navigation-overlay.active{
  visibility:visible;
  opacity:1;
}

.education-notifications-page .education-notification-modal{
  position:fixed;
  inset:0;
  z-index:2000;
  display:grid;
  place-items:center;
  padding:20px;
}

.education-notifications-page .education-notification-modal[hidden]{
  display:none;
}

.education-notifications-page .education-notification-modal-overlay{
  position:absolute;
  inset:0;
  background:rgba(20,35,40,.72);
}

.education-notifications-page .education-notification-modal-dialog{
  position:relative;
  z-index:1;
  width:min(700px,100%);
  max-height:90dvh;
  overflow-y:auto;
  padding:28px;
  border-radius:24px;
  background:
    linear-gradient(
      145deg,
      #edf4f2,
      #eee8f2
    );
  box-shadow:0 30px 80px rgba(17,37,42,.35);
}

.education-notifications-page .education-notification-modal-close{
  position:absolute;
  top:16px;
  right:16px;
  width:42px;
  height:42px;
  border:0;
  border-radius:12px;
  color:#fff;
  background:#355d65;
  cursor:pointer;
}

.education-notifications-page .education-notification-modal-header{
  display:flex;
  align-items:center;
  gap:15px;
  padding-right:52px;
}

.education-notifications-page .education-notification-modal-icon{
  display:grid;
  place-items:center;
  flex:0 0 58px;
  width:58px;
  height:58px;
  border-radius:18px;
  color:#b5eee6;
  background:
    linear-gradient(
      145deg,
      #31545d,
      #605273
    );
}

.education-notifications-page .education-notification-modal-category{
  color:#65517c;
  font-size:.7rem;
  font-weight:900;
  text-transform:uppercase;
}

.education-notifications-page .education-notification-modal-header h2{
  margin:5px 0 0;
  color:#294248;
}

.education-notifications-page .education-notification-modal-authority{
  margin:22px 0 10px;
  color:#65517c;
  font-weight:800;
}

.education-notifications-page .education-notification-modal-description{
  color:#62777b;
  line-height:1.75;
}

.education-notifications-page .education-notification-modal-meta{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:10px;
  margin:20px 0;
}

.education-notifications-page .education-notification-modal-meta > div{
  padding:13px;
  border-radius:14px;
  background:rgba(255,255,255,.42);
}

.education-notifications-page .education-notification-modal-meta span{
  display:block;
  margin-bottom:4px;
  color:#75898c;
  font-size:.62rem;
  font-weight:800;
}

.education-notifications-page .education-notification-modal-tags{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}

.education-notifications-page .education-notification-modal-tags span{
  padding:7px 10px;
  border-radius:999px;
  color:#38585d;
  background:#d9ece8;
  font-size:.68rem;
  font-weight:800;
}

.education-notifications-page .education-notification-modal-actions{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:22px;
}

.education-notifications-page .education-toast-container{
  position:fixed;
  right:18px;
  bottom:95px;
  z-index:2100;
  display:grid;
  gap:10px;
  width:min(330px,calc(100vw - 36px));
}

.education-notifications-page .education-toast{
  padding:14px 16px;
  border-radius:14px;
  color:#fff;
  background:
    linear-gradient(
      145deg,
      #315b62,
      #635177
    );
  box-shadow:0 16px 34px rgba(26,48,52,.25);
  font-size:.76rem;
  font-weight:800;
}

.education-notifications-page .education-back-to-top{
  position:fixed;
  right:22px;
  bottom:100px;
  z-index:999;
  display:grid;
  place-items:center;
  width:52px;
  height:52px;
  border:0;
  border-radius:50%;
  color:#fff;
  background:
    linear-gradient(
      145deg,
      #355d65,
      #67537e
    );
  box-shadow:0 16px 34px rgba(30,52,58,.22);
  cursor:pointer;
}


/*==================================================
RESPONSIVE
==================================================*/

@media(max-width:1180px){

  .education-notifications-page .featured-education-notification-grid,
  .education-notifications-page .education-notification-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  .education-notifications-page .education-notification-summary-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

}

@media(max-width:960px){

  .education-notifications-page .education-notification-catalogue,
  .education-notifications-page .education-alert-request-card,
  .education-notifications-page .education-guidance-card,
  .education-notifications-page .education-footer-top-grid{
    grid-template-columns:1fr;
  }

  .education-notifications-page .education-notification-filter-panel{
    position:fixed;
    top:0;
    left:0;
    z-index:999;
    width:min(88vw,365px);
    height:100dvh;
    overflow-y:auto;
    border-radius:0 24px 24px 0;
    transform:translateX(-105%);
    transition:transform .28s ease;
  }

  .education-notifications-page .education-notification-filter-panel.active{
    transform:translateX(0);
  }

  .education-notifications-page .education-filter-close,
  .education-notifications-page .education-filter-toggle{
    display:inline-flex;
  }

  .education-notifications-page .education-category-grid,
  .education-notifications-page .education-deadline-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  .education-notifications-page .education-guidance-actions{
    grid-template-columns:repeat(2,minmax(0,1fr));
    min-width:0;
  }

  .education-notifications-page .education-footer-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

}

@media(max-width:768px){

  .education-notifications-page{
    padding-bottom:82px;
  }

  .education-notifications-page .education-mobile-quick-actions{
    position:fixed;
    left:0;
    right:0;
    bottom:0;
    z-index:1000;
    display:grid;
    grid-template-columns:repeat(5,1fr);
    padding:8px 8px calc(8px + env(safe-area-inset-bottom));
    background:rgba(37,58,66,.97);
    backdrop-filter:blur(18px);
    -webkit-backdrop-filter:blur(18px);
    border-top:1px solid rgba(255,255,255,.08);
  }

  .education-notifications-page .education-mobile-quick-actions a{
    display:grid;
    justify-items:center;
    gap:4px;
    padding:8px 0;
    color:#d9efec;
    font-size:.68rem;
  }

  .education-notifications-page .education-mobile-quick-actions a span{
    display:grid;
    place-items:center;
    width:42px;
    height:42px;
    border-radius:14px;
    background:rgba(255,255,255,.06);
  }

  .education-notifications-page .education-mobile-main-action span{
    color:#fff;
    background:
      linear-gradient(
        145deg,
        #60c7bb,
        #8661a6
      );
  }

}

@media(max-width:700px){

  .education-notifications-page .featured-education-notification-grid,
  .education-notifications-page .education-notification-grid,
  .education-notifications-page .education-category-grid,
  .education-notifications-page .education-deadline-grid{
    grid-template-columns:1fr;
  }

  .education-notifications-page .education-results-toolbar{
    align-items:stretch;
    flex-direction:column;
  }

  .education-notifications-page .education-results-summary,
  .education-notifications-page .education-sort-wrapper{
    justify-content:space-between;
  }

  .education-notifications-page .education-sort-wrapper select{
    flex:1;
    min-width:0;
  }

  .education-notifications-page .education-notification-card-actions,
  .education-notifications-page .education-guidance-actions{
    grid-template-columns:1fr;
  }

  .education-notifications-page .education-notification-modal-meta{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

}

@media(max-width:520px){

  .education-notifications-page .education-notification-summary-grid{
    grid-template-columns:1fr;
  }

  .education-notifications-page .education-alert-request-card,
  .education-notifications-page .education-alert-form,
  .education-notifications-page .education-guidance-card{
    padding:21px;
    border-radius:20px;
  }

  .education-notifications-page .education-notification-card,
  .education-notifications-page .featured-education-notification-card{
    padding:18px;
  }

  .education-notifications-page .education-notification-meta,
  .education-notifications-page .education-notification-modal-meta{
    grid-template-columns:1fr;
  }

  .education-notifications-page .education-footer-grid{
    grid-template-columns:1fr;
  }

  .education-notifications-page .education-footer-bottom-wrapper{
    justify-content:center;
    text-align:center;
  }

  .education-notifications-page .education-important-notice-card{
    display:grid;
  }

}
/*==================================================
CAREER NOTIFICATIONS PAGE
==================================================*/

body.career-notifications-page{
  overflow-x:hidden;
  color:#2b4148;
  background:
    radial-gradient(
      circle at 10% 8%,
      rgba(67,145,158,.13),
      transparent 28%
    ),
    radial-gradient(
      circle at 90% 18%,
      rgba(126,91,156,.12),
      transparent 30%
    ),
    linear-gradient(
      145deg,
      #e6f0ed,
      #eee8f2 52%,
      #f0eadc
    );
}

.career-notifications-page *{
  box-sizing:border-box;
}

.career-notifications-page img{
  display:block;
  max-width:100%;
}

.career-notifications-page a{
  text-decoration:none;
}

.career-notifications-page .container{
  width:min(1180px,calc(100% - 32px));
  margin-inline:auto;
}


/*==================================================
COMMON BUTTONS AND HEADINGS
==================================================*/

.career-notifications-page .section-heading{
  max-width:760px;
  margin:0 auto 38px;
  text-align:center;
}

.career-notifications-page .section-heading h2{
  margin:8px 0 13px;
  color:#29434b;
  font-size:clamp(2rem,4vw,3.2rem);
  line-height:1.14;
}

.career-notifications-page .section-heading p{
  margin:0;
  color:#63777c;
  line-height:1.75;
}

.career-notifications-page .section-kicker{
  display:inline-flex;
  align-items:center;
  gap:8px;
  color:#6c527f;
  font-size:.69rem;
  font-weight:900;
  letter-spacing:1.35px;
  text-transform:uppercase;
}

.career-notifications-page .button{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:9px;
  min-height:46px;
  padding:0 17px;
  border:0;
  border-radius:13px;
  font:inherit;
  font-size:.76rem;
  font-weight:900;
  cursor:pointer;
  transition:
    transform .25s ease,
    box-shadow .25s ease;
}

.career-notifications-page .button:hover{
  transform:translateY(-2px);
}

.career-notifications-page .button-primary{
  color:#fff;
  background:
    linear-gradient(
      145deg,
      #315c67,
      #6c527f
    );
  box-shadow:0 13px 28px rgba(36,70,75,.2);
}

.career-notifications-page .button-secondary{
  color:#2e4b52;
  background:
    linear-gradient(
      145deg,
      #e8f3f0,
      #eee7f2
    );
  box-shadow:0 13px 28px rgba(36,70,75,.13);
}

.career-notifications-page .button-block{
  width:100%;
}


/*==================================================
PAGE LOADER
==================================================*/

.career-notifications-page .page-loader{
  position:fixed;
  inset:0;
  z-index:3000;
  display:grid;
  place-items:center;
  background:
    radial-gradient(
      circle at 50% 20%,
      rgba(98,182,181,.18),
      transparent 34%
    ),
    linear-gradient(
      145deg,
      #243d46,
      #315e68 54%,
      #604c74
    );
  transition:
    opacity .35s ease,
    visibility .35s ease;
}

.career-notifications-page .page-loader.hidden{
  opacity:0;
  visibility:hidden;
  pointer-events:none;
}

.career-notifications-page .loader-spinner{
  width:46px;
  height:46px;
  border:4px solid rgba(255,255,255,.17);
  border-top-color:#9ce5dc;
  border-radius:50%;
  animation:careerNotificationSpin .8s linear infinite;
}

@keyframes careerNotificationSpin{
  to{
    transform:rotate(360deg);
  }
}


/*==================================================
HEADER
==================================================*/

.career-notifications-page .header{
  position:relative;
  z-index:60;
  border-bottom:1px solid rgba(56,94,99,.11);
  background:
    linear-gradient(
      145deg,
      #edf4f2,
      #eee8f2
    );
  box-shadow:0 8px 24px rgba(42,69,72,.07);
}

.career-notifications-page .header-wrapper{
  min-height:82px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:22px;
}

.career-notifications-page .brand{
  display:inline-flex;
  align-items:center;
  gap:12px;
  color:#29434a;
  flex:0 0 auto;
}

.career-notifications-page .brand img{
  width:52px;
  height:52px;
  border-radius:16px;
  object-fit:contain;
  background:#e5f0ed;
  box-shadow:0 10px 24px rgba(44,76,79,.1);
}

.career-notifications-page .brand > div{
  display:grid;
  line-height:1.05;
}

.career-notifications-page .brand strong{
  font-size:1.24rem;
}

.career-notifications-page .brand small{
  margin-top:4px;
  color:#718287;
  font-size:.66rem;
  letter-spacing:1.1px;
  text-transform:uppercase;
}

.career-notifications-page .navigation{
  display:flex;
  align-items:center;
  gap:22px;
}

.career-notifications-page .navigation a{
  color:#3d585f;
  font-size:.76rem;
  font-weight:800;
}

.career-notifications-page .navigation a:hover,
.career-notifications-page .navigation a[aria-current="page"]{
  color:#6b527f;
}

.career-notifications-page .menu-toggle{
  display:none;
  width:46px;
  height:46px;
  padding:0;
  border:0;
  border-radius:14px;
  color:#fff;
  background:
    linear-gradient(
      145deg,
      #315e67,
      #6b527f
    );
  cursor:pointer;
}


/*==================================================
HERO
==================================================*/

.career-notifications-page .hero{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  min-height:640px;
  padding:86px 0;
  background:
    radial-gradient(
      circle at 87% 12%,
      rgba(108,205,194,.2),
      transparent 29%
    ),
    radial-gradient(
      circle at 14% 88%,
      rgba(174,127,194,.18),
      transparent 32%
    ),
    linear-gradient(
      135deg,
      #263f4a,
      #315f68 52%,
      #65517d
    );
}

.career-notifications-page .hero::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  background:
    linear-gradient(
      rgba(255,255,255,.026) 1px,
      transparent 1px
    ),
    linear-gradient(
      90deg,
      rgba(255,255,255,.026) 1px,
      transparent 1px
    );
  background-size:38px 38px;
  mask-image:
    linear-gradient(
      to bottom,
      rgba(0,0,0,.9),
      transparent
    );
}

.career-notifications-page .hero-grid{
  display:grid;
  grid-template-columns:
    minmax(0,1.08fr)
    minmax(320px,.72fr);
  align-items:center;
  gap:clamp(32px,6vw,76px);
}

.career-notifications-page .hero-content{
  max-width:790px;
}

.career-notifications-page .hero-content .section-kicker{
  padding:9px 15px;
  border:1px solid rgba(255,255,255,.16);
  border-radius:999px;
  color:#a9e8df;
  background:rgba(255,255,255,.075);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
}

.career-notifications-page .hero-content h1{
  max-width:790px;
  margin:20px 0 22px;
  color:#f7f9f8;
  font-size:clamp(2.65rem,6vw,5.15rem);
  line-height:1.03;
  letter-spacing:-2px;
}

.career-notifications-page .hero-content > p{
  max-width:700px;
  margin:0;
  color:rgba(241,247,247,.81);
  font-size:1rem;
  line-height:1.8;
}

.career-notifications-page .hero-points{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
  margin-top:28px;
}

.career-notifications-page .hero-points span{
  display:flex;
  align-items:center;
  gap:10px;
  min-width:0;
  padding:12px 13px;
  border:1px solid rgba(255,255,255,.11);
  border-radius:14px;
  color:rgba(255,255,255,.86);
  background:rgba(255,255,255,.055);
  font-size:.75rem;
  font-weight:750;
}

.career-notifications-page .hero-points i{
  color:#9fe6dd;
}


/*==================================================
HERO FILTER FORM
==================================================*/

.career-notifications-page .hero-form{
  position:relative;
  overflow:hidden;
  padding:27px;
  border:1px solid rgba(255,255,255,.16);
  border-radius:26px;
  background:
    radial-gradient(
      circle at 92% 0%,
      rgba(140,221,212,.16),
      transparent 34%
    ),
    linear-gradient(
      145deg,
      rgba(255,255,255,.13),
      rgba(255,255,255,.055)
    );
  box-shadow:0 26px 70px rgba(9,25,30,.31);
  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);
}

.career-notifications-page .hero-form h2{
  margin:0 0 22px;
  color:#fff;
  font-size:1.45rem;
}

.career-notifications-page .hero-form .form-field{
  display:grid;
  gap:7px;
  margin-bottom:15px;
}

.career-notifications-page .hero-form label{
  color:rgba(255,255,255,.83);
  font-size:.73rem;
  font-weight:800;
}

.career-notifications-page .hero-form select,
.career-notifications-page .hero-form input{
  width:100%;
  min-width:0;
  min-height:48px;
  padding:0 14px;
  border:1px solid rgba(255,255,255,.14);
  border-radius:13px;
  outline:none;
  color:#294248;
  background:#eaf3f1;
  font:inherit;
}

.career-notifications-page .hero-form select:focus,
.career-notifications-page .hero-form input:focus{
  border-color:#82d5cb;
  box-shadow:0 0 0 4px rgba(130,213,203,.14);
}


/*==================================================
SUMMARY COUNTERS
==================================================*/

.career-notifications-page .career-notification-summary{
  padding:34px 0;
  background:
    linear-gradient(
      145deg,
      #e3efec,
      #eee7f1
    );
}

.career-notifications-page .career-notification-summary-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:15px;
}

.career-notifications-page .career-summary-card{
  display:flex;
  align-items:center;
  gap:14px;
  min-height:104px;
  padding:19px;
  border:1px solid rgba(60,96,101,.13);
  border-radius:19px;
  background:
    linear-gradient(
      145deg,
      #edf4f2,
      #eee8f2
    );
  box-shadow:0 12px 30px rgba(47,76,78,.08);
}

.career-notifications-page .career-summary-icon{
  display:grid;
  place-items:center;
  flex:0 0 49px;
  width:49px;
  height:49px;
  border-radius:15px;
  color:#a8e8e0;
  background:
    linear-gradient(
      145deg,
      #31545c,
      #5b5271
    );
  font-size:1.1rem;
}

.career-notifications-page .career-summary-card strong{
  display:block;
  margin-bottom:3px;
  color:#273f45;
  font-size:1.18rem;
}

.career-notifications-page .career-summary-card p{
  margin:0;
  color:#607579;
  font-size:.74rem;
  line-height:1.45;
}


/*==================================================
FEATURED CAREER NOTIFICATIONS
==================================================*/

.career-notifications-page .featured-career-notification-section{
  padding:82px 0;
  background:
    radial-gradient(
      circle at 88% 12%,
      rgba(146,105,177,.1),
      transparent 30%
    ),
    linear-gradient(
      145deg,
      #e4efed,
      #eee7f1
    );
}

.career-notifications-page .featured-career-notification-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:18px;
}

.career-notifications-page .career-notification-card,
.career-notifications-page .featured-career-notification-card{
  position:relative;
  overflow:hidden;
  display:flex;
  flex-direction:column;
  min-width:0;
  padding:21px;
  border:1px solid rgba(61,96,101,.13);
  border-radius:22px;
  background:
    radial-gradient(
      circle at 100% 0%,
      rgba(120,203,193,.13),
      transparent 31%
    ),
    linear-gradient(
      145deg,
      #edf4f2,
      #eee8f2
    );
  box-shadow:0 18px 42px rgba(40,72,76,.11);
  transition:
    transform .28s ease,
    box-shadow .28s ease,
    border-color .28s ease;
}

.career-notifications-page .featured-career-notification-card::before{
  content:"";
  position:absolute;
  top:0;
  left:0;
  width:100%;
  height:4px;
  background:
    linear-gradient(
      90deg,
      #61c9be,
      #9b76b9
    );
}

.career-notifications-page .career-notification-card:hover,
.career-notifications-page .featured-career-notification-card:hover{
  transform:translateY(-5px);
  border-color:rgba(96,86,124,.24);
  box-shadow:0 22px 42px rgba(42,72,75,.13);
}

.career-notifications-page .career-notification-card-top{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  margin-bottom:17px;
}

.career-notifications-page .career-notification-category-badge,
.career-notifications-page .career-notification-status{
  display:inline-flex;
  align-items:center;
  min-height:29px;
  padding:0 10px;
  border-radius:999px;
  font-size:.65rem;
  font-weight:900;
  text-transform:capitalize;
}

.career-notifications-page .career-notification-category-badge{
  color:#38585d;
  background:#d9ece8;
}

.career-notifications-page .career-notification-status-latest{
  color:#31566d;
  background:#dce9f1;
}

.career-notifications-page .career-notification-status-open{
  color:#245f52;
  background:#d8eee7;
}

.career-notifications-page .career-notification-status-upcoming{
  color:#3c5980;
  background:#e0e8f2;
}

.career-notifications-page .career-notification-status-closing-soon{
  color:#89551d;
  background:#f5e4c6;
}

.career-notifications-page .career-notification-status-updated{
  color:#604879;
  background:#e8def0;
}

.career-notifications-page .career-notification-status-shortlisted{
  color:#6b4a13;
  background:#f4e2ad;
}

.career-notifications-page .career-notification-status-closed{
  color:#7a4148;
  background:#efdce0;
}

.career-notifications-page .career-notification-card-icon{
  display:grid;
  place-items:center;
  width:54px;
  height:54px;
  margin-bottom:16px;
  border-radius:17px;
  color:#b5eee6;
  background:
    linear-gradient(
      145deg,
      #31545d,
      #605273
    );
  font-size:1.25rem;
}

.career-notifications-page .career-priority-urgent{
  color:#ffd6d6;
  background:
    linear-gradient(
      145deg,
      #7d2c38,
      #b54f58
    );
}

.career-notifications-page .career-priority-high{
  color:#ffe9c0;
  background:
    linear-gradient(
      145deg,
      #805321,
      #b2803d
    );
}

.career-notifications-page .career-priority-normal{
  color:#b9eee7;
  background:
    linear-gradient(
      145deg,
      #31555d,
      #625473
    );
}

.career-notifications-page .career-priority-low{
  color:#d7e5ee;
  background:
    linear-gradient(
      145deg,
      #46616c,
      #667b85
    );
}

.career-notifications-page .career-notification-card h3,
.career-notifications-page .featured-career-notification-card h3{
  margin:0 0 8px;
  color:#294248;
  font-size:1.05rem;
  line-height:1.35;
}

.career-notifications-page .career-notification-authority{
  margin:0 0 13px;
  color:#68587f;
  font-size:.72rem;
  font-weight:800;
}

.career-notifications-page .career-notification-description{
  margin:0 0 18px;
  color:#62777b;
  font-size:.75rem;
  line-height:1.68;
}

.career-notifications-page .career-notification-meta{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px;
  margin-top:auto;
  margin-bottom:17px;
}

.career-notifications-page .career-notification-meta > div{
  min-width:0;
  padding:12px;
  border:1px solid rgba(65,97,101,.1);
  border-radius:14px;
  background:rgba(255,255,255,.42);
}

.career-notifications-page .career-notification-meta span{
  display:block;
  margin-bottom:4px;
  color:#75898c;
  font-size:.62rem;
  font-weight:800;
}

.career-notifications-page .career-notification-meta strong{
  display:block;
  color:#2e4a4f;
  font-size:.72rem;
  line-height:1.4;
  overflow-wrap:anywhere;
}

.career-notifications-page .career-notification-card-actions{
  display:grid;
  grid-template-columns:1fr auto;
  gap:9px;
}

.career-notifications-page .career-notification-card-actions .button{
  min-width:0;
  padding-inline:13px;
  font-size:.7rem;
}

/*==================================================
CAREER FOOTER
==================================================*/

.career-notification-footer{
  margin-top:90px;
  color:#eef7f6;
  background:
    linear-gradient(
      145deg,
      #233942,
      #315964 52%,
      #5e4d74
    );
}

.career-footer-top{
  padding:70px 0 40px;
  border-bottom:1px solid rgba(255,255,255,.08);
}

.career-footer-top-grid{
  display:grid;
  grid-template-columns:1.2fr .9fr;
  gap:40px;
  align-items:center;
}

.career-footer-brand p{
  margin:18px 0;
  color:rgba(255,255,255,.78);
  line-height:1.8;
}

.career-footer-badges{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
}

.career-footer-badges span{
  padding:8px 14px;
  border-radius:999px;
  background:rgba(255,255,255,.08);
  font-size:.72rem;
}

.career-footer-support h2{
  margin:10px 0 16px;
  color:#fff;
}

.career-footer-support p{
  color:rgba(255,255,255,.78);
}

.career-footer-actions{
  display:flex;
  gap:14px;
  flex-wrap:wrap;
  margin-top:24px;
}

.career-footer-main{
  padding:55px 0;
}

.career-footer-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:30px;
}

.career-footer-column h3{
  margin-bottom:18px;
  color:#fff;
}

.career-footer-column nav{
  display:grid;
  gap:12px;
}

.career-footer-column nav a{
  color:rgba(255,255,255,.75);
  transition:.25s;
}

.career-footer-column nav a:hover{
  color:#9be6dc;
}

.career-footer-bottom{
  border-top:1px solid rgba(255,255,255,.08);
}

.career-footer-bottom-wrapper{
  min-height:72px;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:20px;
  flex-wrap:wrap;
}

.career-footer-bottom p{
  margin:0;
  color:rgba(255,255,255,.7);
}

.career-footer-bottom-links{
  display:flex;
  flex-wrap:wrap;
  gap:18px;
}

.career-footer-bottom-links a{
  color:rgba(255,255,255,.75);
}

.career-footer-bottom-links a:hover{
  color:#9be6dc;
}
/*==================================================
CAREER MODAL
==================================================*/

.career-notification-modal{
  position:fixed;
  inset:0;
  z-index:3000;
  display:grid;
  place-items:center;
  padding:24px;
}

.career-notification-modal[hidden]{
  display:none;
}

.career-notification-modal-overlay{
  position:absolute;
  inset:0;
  background:rgba(20,28,35,.65);
  backdrop-filter:blur(4px);
}

.career-notification-modal-dialog{
  position:relative;
  width:min(760px,100%);
  max-height:90vh;
  overflow:auto;
  border-radius:26px;
  background:linear-gradient(145deg,#edf4f2,#efe9f3);
  box-shadow:0 30px 80px rgba(0,0,0,.25);
  z-index:2;
}

.career-notification-modal-close{
  position:absolute;
  top:18px;
  right:18px;
  width:44px;
  height:44px;
  border:0;
  border-radius:50%;
  cursor:pointer;
  color:#fff;
  background:#315b66;
}

.career-notification-modal-header{
  display:flex;
  gap:18px;
  align-items:center;
  padding:32px;
  border-bottom:1px solid rgba(0,0,0,.08);
}

.career-notification-modal-icon{
  width:64px;
  height:64px;
  border-radius:18px;
  display:grid;
  place-items:center;
  color:#fff;
  background:linear-gradient(145deg,#315c67,#705585);
  font-size:1.5rem;
}

.career-notification-modal-category{
  display:inline-block;
  margin-bottom:6px;
  color:#6f567f;
  font-size:.72rem;
  font-weight:800;
  text-transform:uppercase;
}

.career-notification-modal-header h2{
  margin:0;
  color:#284047;
}

.career-notification-modal-content{
  padding:30px;
}

.career-notification-modal-authority{
  margin-bottom:14px;
  color:#6d567f;
  font-weight:700;
}

.career-notification-modal-description{
  color:#5f7378;
  line-height:1.8;
}

.career-notification-modal-meta{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:15px;
  margin:30px 0;
}

.career-notification-modal-meta>div{
  padding:14px;
  border-radius:14px;
  background:#fff;
}

.career-notification-modal-meta span{
  display:block;
  font-size:.68rem;
  color:#74858a;
}

.career-notification-modal-meta strong{
  display:block;
  margin-top:4px;
  color:#284047;
}

.career-notification-modal-tags{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-bottom:28px;
}

.career-notification-modal-tags span{
  padding:8px 14px;
  border-radius:999px;
  background:#dbece9;
  font-size:.72rem;
  font-weight:700;
}

.career-notification-modal-actions{
  display:flex;
  gap:14px;
  flex-wrap:wrap;
}


/*==================================================
FILTER PANEL
==================================================*/

.career-filter-panel{
  background:#edf4f2;
  border-radius:24px;
  padding:26px;
  border:1px solid rgba(0,0,0,.08);
}

.career-filter-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:18px;
}

.career-filter-group{
  display:flex;
  flex-direction:column;
  gap:7px;
}

.career-filter-group label{
  font-size:.72rem;
  font-weight:800;
  color:#3a5158;
}

.career-filter-group input,
.career-filter-group select{
  min-height:48px;
  padding:0 14px;
  border-radius:12px;
  border:1px solid rgba(0,0,0,.08);
  background:#fff;
}

.career-filter-actions{
  display:flex;
  gap:14px;
  margin-top:22px;
  flex-wrap:wrap;
}


/*==================================================
TOAST
==================================================*/

.career-toast-container{
  position:fixed;
  right:20px;
  bottom:20px;
  z-index:4000;
  display:grid;
  gap:12px;
}

.career-toast{
  min-width:280px;
  padding:15px 18px;
  border-radius:14px;
  color:#fff;
  background:linear-gradient(145deg,#315d67,#705585);
  box-shadow:0 15px 35px rgba(0,0,0,.2);
  animation:careerToast .35s ease;
}

@keyframes careerToast{

  from{
    opacity:0;
    transform:translateY(20px);
  }

  to{
    opacity:1;
    transform:none;
  }

}


/*==================================================
BACK TO TOP
==================================================*/

.career-back-to-top{
  position:fixed;
  right:22px;
  bottom:95px;
  width:52px;
  height:52px;
  border:0;
  border-radius:50%;
  cursor:pointer;
  color:#fff;
  background:linear-gradient(145deg,#315c67,#6f547f);
  box-shadow:0 15px 30px rgba(0,0,0,.2);
  z-index:200;
}

.career-back-to-top:hover{
  transform:translateY(-3px);
}


/*==================================================
BOTTOM MOBILE BAR
==================================================*/

.career-mobile-quick-actions{
  position:fixed;
  left:0;
  right:0;
  bottom:0;
  display:none;
  justify-content:space-around;
  align-items:center;
  min-height:72px;
  background:#ffffff;
  border-top:1px solid rgba(0,0,0,.08);
  z-index:500;
  box-shadow:0 -8px 24px rgba(0,0,0,.08);
}

.career-mobile-quick-actions a{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:4px;
  color:#4d656b;
  font-size:.68rem;
  font-weight:700;
}

.career-mobile-quick-actions a span{
  width:42px;
  height:42px;
  display:grid;
  place-items:center;
  border-radius:50%;
}

.career-mobile-main-action span{
  color:#fff;
  background:linear-gradient(145deg,#315d67,#705585);
}

.career-mobile-quick-actions a.active{
  color:#315d67;
}


/*==================================================
RESPONSIVE
==================================================*/

@media(max-width:900px){

  .career-filter-grid{
    grid-template-columns:1fr 1fr;
  }

  .career-notification-modal-meta{
    grid-template-columns:1fr;
  }

}

@media(max-width:768px){

  .career-filter-grid{
    grid-template-columns:1fr;
  }

  .career-notification-modal{
    padding:14px;
  }

  .career-notification-modal-header,
  .career-notification-modal-content{
    padding:22px;
  }

  .career-notification-modal-actions{
    flex-direction:column;
  }

  .career-notification-modal-actions .button{
    width:100%;
  }

  .career-mobile-quick-actions{
    display:flex;
  }

  body.career-notifications-page{
    padding-bottom:82px;
  }

}

@media(max-width:480px){

  .career-toast{
    min-width:unset;
    width:calc(100vw - 32px);
  }

  .career-back-to-top{
    right:14px;
    bottom:88px;
  }

}

/*==================================================
NEW CAREER NOTIFICATIONS PAGE
ISOLATED CLASS SYSTEM
==================================================*/

body.career-notifications-page{
  margin:0;
  overflow-x:hidden;

  color:#263f46;

  background:
    radial-gradient(
      circle at 10% 8%,
      rgba(66,145,154,.11),
      transparent 28%
    ),
    radial-gradient(
      circle at 90% 15%,
      rgba(124,92,157,.1),
      transparent 30%
    ),
    linear-gradient(
      145deg,
      #e5efec,
      #eee8f2 52%,
      #f0eadf
    );
}

body.career-notifications-page,
body.career-notifications-page *{
  box-sizing:border-box;
}

body.career-notifications-page img{
  display:block;
  max-width:100%;
}

body.career-notifications-page a{
  text-decoration:none;
}

body.career-notifications-page button,
body.career-notifications-page input,
body.career-notifications-page select{
  font:inherit;
}

body.career-notifications-page h1,
body.career-notifications-page h2,
body.career-notifications-page h3,
body.career-notifications-page p,
body.career-notifications-page span,
body.career-notifications-page strong,
body.career-notifications-page small,
body.career-notifications-page a,
body.career-notifications-page label{
  word-break:normal;
  overflow-wrap:break-word;
  writing-mode:horizontal-tb;
}

.career-notifications-page .container{
  width:min(1180px,calc(100% - 32px));
  margin-inline:auto;
}


/*==================================================
COMMON BUTTONS
==================================================*/

.career-notifications-page .career-button{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:9px;

  min-height:47px;
  min-width:0;

  padding:0 18px;

  border:0;
  border-radius:13px;

  cursor:pointer;

  font-size:.76rem;
  font-weight:900;

  transition:
    transform .25s ease,
    box-shadow .25s ease,
    opacity .25s ease;
}

.career-notifications-page .career-button:hover{
  transform:translateY(-2px);
}

.career-notifications-page .career-button-primary{
  color:#fff;

  background:
    linear-gradient(
      145deg,
      #315d66,
      #6a527f
    );

  box-shadow:
    0 13px 28px
    rgba(42,72,78,.2);
}

.career-notifications-page .career-button-light{
  color:#2d4a50;

  background:
    linear-gradient(
      145deg,
      #e7f2ef,
      #eee8f2
    );

  box-shadow:
    0 12px 25px
    rgba(43,72,76,.12);
}

.career-notifications-page .career-button-block{
  width:100%;
}


/*==================================================
LOADER
==================================================*/

.career-notifications-page .career-notification-loader{
  position:fixed;
  inset:0;
  z-index:5000;

  display:grid;
  place-items:center;

  padding:24px;

  background:
    radial-gradient(
      circle at 50% 18%,
      rgba(112,203,193,.18),
      transparent 31%
    ),
    linear-gradient(
      145deg,
      #243b45,
      #315d67 54%,
      #604d74
    );

  transition:
    opacity .35s ease,
    visibility .35s ease;
}

.career-notifications-page .career-notification-loader.hidden{
  opacity:0;
  visibility:hidden;
  pointer-events:none;
}

.career-notifications-page .career-notification-loader-content{
  display:grid;
  justify-items:center;
  gap:14px;

  width:min(340px,100%);

  padding:28px;

  border:1px solid rgba(255,255,255,.13);
  border-radius:24px;

  color:#fff;
  text-align:center;

  background:
    rgba(255,255,255,.075);

  backdrop-filter:blur(16px);
  -webkit-backdrop-filter:blur(16px);

  box-shadow:
    0 28px 70px
    rgba(14,31,37,.28);
}

.career-notifications-page .career-notification-loader-icon{
  display:grid;
  place-items:center;

  width:58px;
  height:58px;

  border-radius:18px;

  color:#29464c;

  background:
    linear-gradient(
      145deg,
      #9de4da,
      #8ecad8
    );

  font-size:1.25rem;
}

.career-notifications-page .career-notification-loader-spinner{
  width:38px;
  height:38px;

  border:4px solid rgba(255,255,255,.17);
  border-top-color:#9fe5dc;
  border-radius:50%;

  animation:
    careerNotificationLoaderSpin
    .8s linear infinite;
}

@keyframes careerNotificationLoaderSpin{
  to{
    transform:rotate(360deg);
  }
}


/*==================================================
TOP BAR
==================================================*/

.career-notifications-page .career-notification-topbar{
  position:relative;
  z-index:60;

  padding:10px 0;

  color:#eaf7f5;

  background:
    linear-gradient(
      90deg,
      #274b54,
      #315f68 55%,
      #5f4d73
    );
}

.career-notifications-page .career-notification-topbar-inner{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
}

.career-notifications-page .career-notification-topbar p{
  display:flex;
  align-items:center;
  gap:9px;

  margin:0;

  font-size:.75rem;
  font-weight:750;
}

.career-notifications-page .career-notification-topbar-links{
  display:flex;
  align-items:center;
  gap:15px;
}

.career-notifications-page .career-notification-topbar-links a{
  display:inline-flex;
  align-items:center;
  gap:7px;

  color:rgba(255,255,255,.82);

  font-size:.71rem;
  font-weight:800;
}

.career-notifications-page .career-notification-topbar-links a:hover{
  color:#9fe6dc;
}


/*==================================================
HEADER
==================================================*/

.career-notifications-page .career-notification-header{
  position:relative;
  z-index:80;

  border-bottom:
    1px solid
    rgba(56,94,99,.11);

  background:
    linear-gradient(
      145deg,
      #edf4f2,
      #eee8f2
    );

  box-shadow:
    0 8px 24px
    rgba(42,69,72,.07);
}

.career-notifications-page .career-notification-header-inner{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:22px;

  min-height:82px;
}

.career-notifications-page .career-notification-brand{
  display:inline-flex;
  align-items:center;
  gap:12px;

  flex:0 0 auto;

  min-width:0;

  color:#29434a;
}

.career-notifications-page .career-notification-brand-mark{
  display:grid;
  place-items:center;

  flex:0 0 52px;

  width:52px;
  height:52px;

  border-radius:16px;

  overflow:hidden;

  background:#e4efec;

  box-shadow:
    0 10px 24px
    rgba(44,76,79,.1);
}

.career-notifications-page .career-notification-brand-mark img{
  width:45px;
  height:45px;

  object-fit:contain;
}

.career-notifications-page .career-notification-brand-copy{
  display:grid;

  min-width:0;

  line-height:1.05;
}

.career-notifications-page .career-notification-brand-copy strong{
  color:#29434a;
  font-size:1.23rem;
}

.career-notifications-page .career-notification-brand-copy small{
  margin-top:4px;

  color:#718287;

  font-size:.66rem;
  letter-spacing:1.1px;
  text-transform:uppercase;
}

.career-notifications-page .career-notification-menu-toggle{
  display:none;

  flex:0 0 46px;

  width:46px;
  height:46px;

  padding:0;

  border:0;
  border-radius:14px;

  background:
    linear-gradient(
      145deg,
      #315d66,
      #6a527f
    );

  cursor:pointer;
}

.career-notifications-page .career-notification-menu-toggle span{
  display:block;

  width:22px;
  height:2px;

  margin:5px auto;

  border-radius:999px;

  background:#fff;
}

.career-notifications-page .career-notification-navigation{
  display:flex;
  align-items:center;
  gap:19px;

  min-width:0;
}

.career-notifications-page .career-notification-navigation > a{
  flex:0 0 auto;

  color:#3e595f;

  font-size:.74rem;
  font-weight:850;
}

.career-notifications-page .career-notification-navigation > a:hover,
.career-notifications-page .career-notification-navigation > a.active{
  color:#6a527f;
}

.career-notifications-page .career-notification-header-cta{
  display:inline-flex;
  align-items:center;
  justify-content:center;

  min-height:42px;

  padding:0 16px;

  border-radius:12px;

  color:#fff !important;

  background:
    linear-gradient(
      145deg,
      #315d66,
      #6a527f
    );

  box-shadow:
    0 11px 22px
    rgba(48,82,88,.15);
}

.career-notifications-page .career-notification-navigation-overlay{
  position:fixed;
  inset:0;
  z-index:998;

  visibility:hidden;
  opacity:0;

  background:
    rgba(19,34,40,.58);

  transition:
    opacity .25s ease,
    visibility .25s ease;
}

.career-notifications-page .career-notification-navigation-overlay.active{
  visibility:visible;
  opacity:1;
}


/*==================================================
HERO
==================================================*/

.career-notifications-page .career-notification-hero{
  position:relative;
  isolation:isolate;

  overflow:hidden;

  min-height:650px;

  padding:86px 0;

  background:
    radial-gradient(
      circle at 87% 12%,
      rgba(112,207,197,.2),
      transparent 29%
    ),
    radial-gradient(
      circle at 14% 88%,
      rgba(174,127,194,.18),
      transparent 32%
    ),
    linear-gradient(
      135deg,
      #263f49,
      #315f68 52%,
      #65517d
    );
}

.career-notifications-page .career-notification-hero::before{
  content:"";

  position:absolute;
  inset:0;
  z-index:-1;

  background:
    linear-gradient(
      rgba(255,255,255,.027) 1px,
      transparent 1px
    ),
    linear-gradient(
      90deg,
      rgba(255,255,255,.027) 1px,
      transparent 1px
    );

  background-size:38px 38px;
}

.career-notifications-page .career-notification-hero-decoration{
  position:absolute;

  border-radius:50%;

  filter:blur(2px);

  pointer-events:none;
}

.career-notifications-page .career-notification-hero-decoration.decoration-one{
  top:70px;
  right:-90px;

  width:310px;
  height:310px;

  background:
    rgba(121,214,202,.08);
}

.career-notifications-page .career-notification-hero-decoration.decoration-two{
  bottom:-110px;
  left:-80px;

  width:280px;
  height:280px;

  background:
    rgba(188,137,210,.08);
}

.career-notifications-page .career-notification-hero-grid{
  position:relative;
  z-index:2;

  display:grid;

  grid-template-columns:
    minmax(0,1.08fr)
    minmax(320px,.72fr);

  align-items:center;

  gap:
    clamp(
      34px,
      6vw,
      76px
    );
}

.career-notifications-page .career-notification-hero-content{
  min-width:0;
  max-width:790px;
}

.career-notifications-page .career-notification-breadcrumb{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:9px;

  margin-bottom:22px;

  color:
    rgba(
      255,
      255,
      255,
      .7
    );

  font-size:.78rem;
}

.career-notifications-page .career-notification-breadcrumb a{
  color:
    rgba(
      255,
      255,
      255,
      .8
    );
}

.career-notifications-page .career-notification-breadcrumb a:hover{
  color:#9ce4da;
}

.career-notifications-page .career-notification-hero-badge{
  display:inline-flex;
  align-items:center;
  gap:9px;

  margin-bottom:20px;

  padding:9px 14px;

  border:
    1px solid
    rgba(
      255,
      255,
      255,
      .16
    );

  border-radius:999px;

  color:#b5ece5;

  background:
    rgba(
      255,
      255,
      255,
      .075
    );

  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);

  font-size:.73rem;
  font-weight:850;
}

.career-notifications-page .career-notification-hero h1{
  max-width:760px;

  margin:0 0 22px;

  color:#f6f8f7;

  font-size:
    clamp(
      2.7rem,
      6vw,
      5.2rem
    );

  line-height:1.03;
  letter-spacing:-2px;
}

.career-notifications-page .career-notification-hero h1 span{
  display:block;

  background:
    linear-gradient(
      90deg,
      #9de6dc,
      #8bc9dd,
      #d5afe8
    );

  background-clip:text;
  -webkit-background-clip:text;

  -webkit-text-fill-color:transparent;
}

.career-notifications-page .career-notification-hero-description{
  max-width:700px;

  margin:0;

  color:
    rgba(
      241,
      247,
      247,
      .81
    );

  font-size:1rem;
  line-height:1.8;
}

.career-notifications-page .career-notification-hero-actions{
  display:flex;
  flex-wrap:wrap;
  gap:13px;

  margin-top:27px;
}

.career-notifications-page .career-notification-hero-points{
  display:grid;

  grid-template-columns:
    repeat(
      2,
      minmax(0,1fr)
    );

  gap:12px;

  margin-top:28px;
}

.career-notifications-page .career-notification-hero-point{
  display:flex;
  align-items:center;
  gap:11px;

  min-width:0;

  padding:12px 13px;

  border:
    1px solid
    rgba(
      255,
      255,
      255,
      .11
    );

  border-radius:14px;

  color:
    rgba(
      255,
      255,
      255,
      .88
    );

  background:
    rgba(
      255,
      255,
      255,
      .055
    );
}

.career-notifications-page .career-notification-hero-point > span{
  display:grid;
  place-items:center;

  flex:0 0 36px;

  width:36px;
  height:36px;

  border-radius:11px;

  color:#9fe6dd;

  background:
    rgba(
      255,
      255,
      255,
      .08
    );
}

.career-notifications-page .career-notification-hero-point > div{
  min-width:0;
}

.career-notifications-page .career-notification-hero-point strong{
  display:block;

  color:#fff;

  font-size:.76rem;
}

.career-notifications-page .career-notification-hero-point small{
  display:block;

  margin-top:3px;

  color:
    rgba(
      255,
      255,
      255,
      .64
    );

  font-size:.64rem;
}


/*==================================================
HERO FINDER CARD
==================================================*/

.career-notifications-page .career-notification-finder-card{
  position:relative;

  overflow:hidden;

  min-width:0;

  padding:27px;

  border:
    1px solid
    rgba(
      255,
      255,
      255,
      .16
    );

  border-radius:26px;

  background:
    radial-gradient(
      circle at 92% 0%,
      rgba(140,221,212,.16),
      transparent 34%
    ),
    linear-gradient(
      145deg,
      rgba(255,255,255,.13),
      rgba(255,255,255,.055)
    );

  box-shadow:
    0 26px 70px
    rgba(9,25,30,.31);

  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);
}

.career-notifications-page .career-notification-finder-heading{
  display:flex;
  align-items:center;
  gap:14px;

  margin-bottom:22px;
}

.career-notifications-page .career-notification-finder-heading > span{
  display:grid;
  place-items:center;

  flex:0 0 54px;

  width:54px;
  height:54px;

  border-radius:17px;

  color:#29434a;

  background:
    linear-gradient(
      145deg,
      #9de4da,
      #8ac6d6
    );

  font-size:1.2rem;
}

.career-notifications-page .career-notification-finder-heading > div{
  min-width:0;
}

.career-notifications-page .career-notification-finder-heading small{
  display:block;

  color:#9fe5dc;

  font-size:.67rem;
  font-weight:900;
  letter-spacing:1.2px;
  text-transform:uppercase;
}

.career-notifications-page .career-notification-finder-heading h2{
  margin:5px 0 0;

  color:#fff;

  font-size:1.4rem;
}

.career-notifications-page .career-notification-finder-card form{
  display:grid;
  gap:15px;
}

.career-notifications-page .career-notification-form-field{
  display:grid;
  gap:7px;

  min-width:0;
}

.career-notifications-page .career-notification-form-field label{
  color:#405d63;

  font-size:.71rem;
  font-weight:850;
}

.career-notifications-page .career-notification-finder-card label{
  color:
    rgba(
      255,
      255,
      255,
      .84
    );
}

.career-notifications-page .career-notification-form-field input,
.career-notifications-page .career-notification-form-field select{
  width:100%;
  max-width:100%;
  min-width:0;
  min-height:48px;

  padding:0 14px;

  border:
    1px solid
    rgba(
      57,
      94,
      99,
      .14
    );

  border-radius:13px;

  outline:none;

  color:#294248;

  background:#eaf3f1;
}

.career-notifications-page .career-notification-form-field input:focus,
.career-notifications-page .career-notification-form-field select:focus{
  border-color:#82d5cb;

  box-shadow:
    0 0 0 4px
    rgba(130,213,203,.14);
}


/*==================================================
SUMMARY
==================================================*/

.career-notifications-page .career-notification-summary-section{
  padding:34px 0;

  background:
    linear-gradient(
      145deg,
      #e3efec,
      #eee7f1
    );
}

.career-notifications-page .career-notification-summary-grid{
  display:grid;

  grid-template-columns:
    repeat(
      4,
      minmax(0,1fr)
    );

  gap:15px;
}

.career-notifications-page .career-notification-summary-card{
  display:flex;
  align-items:center;
  gap:14px;

  min-width:0;
  min-height:104px;

  padding:19px;

  border:
    1px solid
    rgba(
      60,
      96,
      101,
      .13
    );

  border-radius:19px;

  background:
    linear-gradient(
      145deg,
      #edf4f2,
      #eee8f2
    );

  box-shadow:
    0 12px 30px
    rgba(47,76,78,.08);
}

.career-notifications-page .career-notification-summary-icon{
  display:grid;
  place-items:center;

  flex:0 0 49px;

  width:49px;
  height:49px;

  border-radius:15px;

  color:#a8e8e0;

  background:
    linear-gradient(
      145deg,
      #31545c,
      #5b5271
    );

  font-size:1.1rem;
}

.career-notifications-page .career-notification-summary-card > div{
  min-width:0;
}

.career-notifications-page .career-notification-summary-card strong{
  display:block;

  margin-bottom:3px;

  color:#273f45;

  font-size:1.18rem;
}

.career-notifications-page .career-notification-summary-card p{
  margin:0;

  color:#607579;

  font-size:.73rem;
  line-height:1.45;
}
/*==================================================
FEATURED SECTION
==================================================*/

.career-notifications-page .career-notification-featured-section{
  padding:82px 0;

  background:
    radial-gradient(
      circle at 88% 12%,
      rgba(146,105,177,.1),
      transparent 30%
    ),
    linear-gradient(
      145deg,
      #e4efed,
      #eee7f1
    );
}

.career-notifications-page .career-notification-section-heading{
  max-width:760px;
  margin:0 auto 38px;
  text-align:center;
}

.career-notifications-page .career-notification-section-heading > span,
.career-notifications-page .career-notification-section-kicker{
  display:inline-block;

  color:#6b527f;

  font-size:.68rem;
  font-weight:900;
  letter-spacing:1.3px;
  text-transform:uppercase;
}

.career-notifications-page .career-notification-section-heading h2{
  margin:8px 0 13px;

  color:#294248;

  font-size:
    clamp(
      2rem,
      4vw,
      3.2rem
    );

  line-height:1.14;
}

.career-notifications-page .career-notification-section-heading p{
  margin:0;

  color:#62777b;

  line-height:1.75;
}

.career-notifications-page .career-notification-featured-grid{
  display:grid;

  grid-template-columns:
    repeat(
      4,
      minmax(0,1fr)
    );

  gap:18px;
}


/*==================================================
NOTIFICATION CARDS
==================================================*/

.career-notifications-page .career-notification-card,
.career-notifications-page .career-notification-featured-card{
  position:relative;

  overflow:hidden;

  display:flex;
  flex-direction:column;

  min-width:0;

  padding:21px;

  border:
    1px solid
    rgba(61,96,101,.13);

  border-radius:22px;

  background:
    radial-gradient(
      circle at 100% 0%,
      rgba(120,203,193,.13),
      transparent 31%
    ),
    linear-gradient(
      145deg,
      #edf4f2,
      #eee8f2
    );

  box-shadow:
    0 18px 42px
    rgba(40,72,76,.11);

  transition:
    transform .28s ease,
    box-shadow .28s ease,
    border-color .28s ease;
}

.career-notifications-page .career-notification-featured-card::before{
  content:"";

  position:absolute;
  top:0;
  left:0;

  width:100%;
  height:4px;

  background:
    linear-gradient(
      90deg,
      #61c9be,
      #9b76b9
    );
}

.career-notifications-page .career-notification-card:hover,
.career-notifications-page .career-notification-featured-card:hover{
  transform:translateY(-5px);

  border-color:
    rgba(96,86,124,.24);

  box-shadow:
    0 22px 42px
    rgba(42,72,75,.13);
}

.career-notifications-page .career-notification-card-top{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;

  min-width:0;

  margin-bottom:17px;
}

.career-notifications-page .career-notification-category-badge,
.career-notifications-page .career-notification-status-badge{
  display:inline-flex;
  align-items:center;

  min-height:29px;
  min-width:0;

  padding:0 10px;

  border-radius:999px;

  font-size:.64rem;
  font-weight:900;
  text-transform:capitalize;
}

.career-notifications-page .career-notification-category-badge{
  color:#38585d;
  background:#d9ece8;
}

.career-notifications-page .career-notification-status-latest{
  color:#31566d;
  background:#dce9f1;
}

.career-notifications-page .career-notification-status-open{
  color:#245f52;
  background:#d8eee7;
}

.career-notifications-page .career-notification-status-upcoming{
  color:#3c5980;
  background:#e0e8f2;
}

.career-notifications-page .career-notification-status-closing-soon{
  color:#89551d;
  background:#f5e4c6;
}

.career-notifications-page .career-notification-status-updated{
  color:#604879;
  background:#e8def0;
}

.career-notifications-page .career-notification-status-shortlisted{
  color:#6b4a13;
  background:#f4e2ad;
}

.career-notifications-page .career-notification-status-closed{
  color:#7a4148;
  background:#efdce0;
}

.career-notifications-page .career-notification-card-icon{
  display:grid;
  place-items:center;

  width:54px;
  height:54px;

  margin-bottom:16px;

  border-radius:17px;

  color:#b5eee6;

  background:
    linear-gradient(
      145deg,
      #31545d,
      #605273
    );

  font-size:1.22rem;
}

.career-notifications-page .career-notification-priority-urgent{
  color:#ffd6d6;

  background:
    linear-gradient(
      145deg,
      #7d2c38,
      #b54f58
    );
}

.career-notifications-page .career-notification-priority-high{
  color:#ffe9c0;

  background:
    linear-gradient(
      145deg,
      #805321,
      #b2803d
    );
}

.career-notifications-page .career-notification-priority-normal{
  color:#b9eee7;

  background:
    linear-gradient(
      145deg,
      #31555d,
      #625473
    );
}

.career-notifications-page .career-notification-priority-low{
  color:#d7e5ee;

  background:
    linear-gradient(
      145deg,
      #46616c,
      #667b85
    );
}

.career-notifications-page .career-notification-card h3,
.career-notifications-page .career-notification-featured-card h3{
  margin:0 0 8px;

  color:#294248;

  font-size:1.04rem;
  line-height:1.35;
}

.career-notifications-page .career-notification-card-authority{
  margin:0 0 13px;

  color:#68587f;

  font-size:.71rem;
  font-weight:800;
}

.career-notifications-page .career-notification-card-description{
  margin:0 0 18px;

  color:#62777b;

  font-size:.74rem;
  line-height:1.68;
}

.career-notifications-page .career-notification-card-meta{
  display:grid;

  grid-template-columns:
    repeat(
      2,
      minmax(0,1fr)
    );

  gap:10px;

  margin-top:auto;
  margin-bottom:17px;
}

.career-notifications-page .career-notification-card-meta > div{
  min-width:0;

  padding:12px;

  border:
    1px solid
    rgba(65,97,101,.1);

  border-radius:14px;

  background:
    rgba(255,255,255,.42);
}

.career-notifications-page .career-notification-card-meta span{
  display:block;

  margin-bottom:4px;

  color:#75898c;

  font-size:.61rem;
  font-weight:800;
}

.career-notifications-page .career-notification-card-meta strong{
  display:block;

  color:#2e4a4f;

  font-size:.71rem;
  line-height:1.4;

  overflow-wrap:break-word;
}

.career-notifications-page .career-notification-card-actions{
  display:grid;

  grid-template-columns:
    minmax(0,1fr)
    auto;

  gap:9px;
}

.career-notifications-page .career-notification-card-actions .career-button{
  min-width:0;

  padding-inline:13px;

  font-size:.69rem;
}


/*==================================================
LOADING STATE
==================================================*/

.career-notifications-page .career-notification-loading-state{
  grid-column:1 / -1;

  display:grid;
  justify-items:center;
  gap:13px;

  min-width:0;

  padding:58px 20px;

  color:#64797d;

  text-align:center;
}

.career-notifications-page .career-notification-loading-state .career-notification-loader-spinner{
  border-color:
    rgba(49,93,102,.16);

  border-top-color:#315d66;
}


/*==================================================
DIRECTORY SECTION
==================================================*/

.career-notifications-page .career-notification-directory-section{
  padding:82px 0;

  background:
    radial-gradient(
      circle at 10% 10%,
      rgba(94,165,167,.1),
      transparent 29%
    ),
    linear-gradient(
      145deg,
      #e7f0ee,
      #ede6f1
    );
}

.career-notifications-page .career-notification-directory-layout{
  display:grid;

  grid-template-columns:
    minmax(260px,.34fr)
    minmax(0,1fr);

  align-items:start;

  gap:25px;
}


/*==================================================
FILTER PANEL
==================================================*/

.career-notifications-page .career-notification-filter-panel{
  position:sticky;
  top:22px;

  min-width:0;

  padding:22px;

  border:
    1px solid
    rgba(60,96,101,.13);

  border-radius:23px;

  background:
    linear-gradient(
      145deg,
      #edf4f2,
      #eee8f2
    );

  box-shadow:
    0 18px 40px
    rgba(47,77,79,.09);
}

.career-notifications-page .career-notification-filter-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;

  margin-bottom:19px;
}

.career-notifications-page .career-notification-filter-header > div{
  min-width:0;
}

.career-notifications-page .career-notification-filter-header small{
  display:block;

  color:#6a527f;

  font-size:.65rem;
  font-weight:900;
  letter-spacing:1.2px;
  text-transform:uppercase;
}

.career-notifications-page .career-notification-filter-header h3{
  margin:4px 0 0;

  color:#2b454b;

  font-size:1.14rem;
}

.career-notifications-page .career-notification-filter-close{
  display:none;

  flex:0 0 39px;

  width:39px;
  height:39px;

  border:0;
  border-radius:11px;

  color:#fff;

  background:
    linear-gradient(
      145deg,
      #355d65,
      #66527e
    );

  cursor:pointer;
}

.career-notifications-page #careerNotificationFilterForm{
  display:grid;
  gap:14px;

  min-width:0;
}

.career-notifications-page .career-notification-search-box{
  position:relative;

  min-width:0;
}

.career-notifications-page .career-notification-search-box i{
  position:absolute;
  top:50%;
  left:14px;

  transform:translateY(-50%);

  color:#788c8f;

  pointer-events:none;
}

.career-notifications-page .career-notification-search-box input{
  padding-left:39px;
}

.career-notifications-page .career-notification-filter-actions{
  display:grid;
  gap:10px;

  margin-top:4px;
}


/*==================================================
RESULTS PANEL
==================================================*/

.career-notifications-page .career-notification-results-panel{
  min-width:0;
}

.career-notifications-page .career-notification-results-toolbar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;

  min-width:0;

  margin-bottom:18px;

  padding:17px 18px;

  border:
    1px solid
    rgba(66,101,105,.12);

  border-radius:18px;

  background:
    linear-gradient(
      145deg,
      #edf4f2,
      #eee8f3
    );

  box-shadow:
    0 12px 28px
    rgba(45,75,78,.07);
}

.career-notifications-page .career-notification-results-summary{
  display:flex;
  align-items:center;
  gap:13px;

  min-width:0;
}

.career-notifications-page .career-notification-results-summary p{
  margin:0;

  color:#526b70;

  font-size:.81rem;
}

.career-notifications-page .career-notification-results-summary strong{
  color:#263f45;

  font-size:1.1rem;
}

.career-notifications-page .career-notification-filter-toggle{
  display:none;

  align-items:center;
  justify-content:center;
  gap:8px;

  min-height:42px;

  padding:0 14px;

  border:0;
  border-radius:12px;

  color:#fff;

  background:
    linear-gradient(
      145deg,
      #355d65,
      #66527e
    );

  font-weight:800;

  cursor:pointer;
}

.career-notifications-page .career-notification-sort-wrapper{
  display:flex;
  align-items:center;
  gap:9px;

  min-width:0;
}

.career-notifications-page .career-notification-sort-wrapper label{
  flex:0 0 auto;

  color:#607579;

  font-size:.71rem;
  font-weight:800;
}

.career-notifications-page .career-notification-sort-wrapper select{
  min-width:0;
  min-height:42px;

  padding:0 12px;

  border:
    1px solid
    rgba(59,94,98,.13);

  border-radius:11px;

  color:#2c454b;

  background:#e9f2f0;

  outline:none;
}


/*==================================================
ACTIVE FILTERS
==================================================*/

.career-notifications-page .career-notification-active-filters{
  display:flex;
  flex-wrap:wrap;
  gap:9px;

  min-width:0;

  margin-bottom:16px;
}

.career-notifications-page .career-notification-filter-chip{
  display:inline-flex;
  align-items:center;
  gap:8px;

  min-height:34px;
  min-width:0;

  padding:0 11px;

  border:
    1px solid
    rgba(93,78,118,.13);

  border-radius:999px;

  color:#52606d;

  background:#e8e0ee;

  font-size:.69rem;
  font-weight:800;

  cursor:pointer;
}

.career-notifications-page .career-notification-filter-chip:hover{
  color:#fff;
  background:#65517c;
}


/*==================================================
RESULT GRID
==================================================*/

.career-notifications-page .career-notification-grid{
  display:grid;

  grid-template-columns:
    repeat(
      3,
      minmax(0,1fr)
    );

  gap:18px;

  min-width:0;
}


/*==================================================
EMPTY AND ERROR STATES
==================================================*/

.career-notifications-page .career-notification-empty-state{
  padding:58px 22px;

  border:
    1px solid
    rgba(60,96,101,.13);

  border-radius:22px;

  text-align:center;

  background:
    linear-gradient(
      145deg,
      #edf4f2,
      #eee8f2
    );
}

.career-notifications-page .career-notification-empty-state > span{
  display:grid;
  place-items:center;

  width:66px;
  height:66px;

  margin:0 auto 16px;

  border-radius:20px;

  color:#acebe3;

  background:#355a63;

  font-size:1.42rem;
}

.career-notifications-page .career-notification-empty-state h3{
  margin:0 0 8px;

  color:#2b464c;
}

.career-notifications-page .career-notification-empty-state p{
  max-width:540px;

  margin:0 auto 19px;

  color:#62787c;

  font-size:.79rem;
  line-height:1.65;
}


/*==================================================
PAGINATION
==================================================*/

.career-notifications-page .career-notification-pagination{
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  gap:8px;

  margin-top:26px;
}

.career-notifications-page .career-notification-pagination-button{
  display:grid;
  place-items:center;

  min-width:40px;
  height:40px;

  padding:0 11px;

  border:
    1px solid
    rgba(60,94,98,.13);

  border-radius:11px;

  color:#39565b;

  background:#e6f0ed;

  font-weight:800;

  cursor:pointer;
}

.career-notifications-page .career-notification-pagination-button:hover,
.career-notifications-page .career-notification-pagination-button.active{
  color:#fff;

  border-color:transparent;

  background:
    linear-gradient(
      145deg,
      #365d65,
      #66527d
    );
}

.career-notifications-page .career-notification-pagination-button:disabled{
  opacity:.45;
  cursor:not-allowed;
}


/*==================================================
FILTER OVERLAY
==================================================*/

.career-notifications-page .career-notification-filter-overlay{
  position:fixed;
  inset:0;
  z-index:998;

  visibility:hidden;
  opacity:0;

  background:
    rgba(20,35,40,.58);

  transition:
    opacity .25s ease,
    visibility .25s ease;
}

.career-notifications-page .career-notification-filter-overlay.active{
  visibility:visible;
  opacity:1;
}


/*==================================================
TABLET GRID ADJUSTMENT
==================================================*/

@media(max-width:1180px){

  .career-notifications-page .career-notification-featured-grid{
    grid-template-columns:
      repeat(
        2,
        minmax(0,1fr)
      );
  }

  .career-notifications-page .career-notification-grid{
    grid-template-columns:
      repeat(
        2,
        minmax(0,1fr)
      );
  }

  .career-notifications-page .career-notification-summary-grid{
    grid-template-columns:
      repeat(
        2,
        minmax(0,1fr)
      );
  }

}

/*==================================================
CATEGORY SECTION
==================================================*/

.career-notifications-page .career-notification-categories-section{
  padding:82px 0;

  background:
    radial-gradient(
      circle at 88% 12%,
      rgba(146,105,177,.09),
      transparent 30%
    ),
    linear-gradient(
      145deg,
      #e5efed,
      #eee7f1
    );
}

.career-notifications-page .career-notification-category-grid{
  display:grid;

  grid-template-columns:
    repeat(
      4,
      minmax(0,1fr)
    );

  gap:18px;
}

.career-notifications-page .career-notification-category-card{
  display:flex;
  flex-direction:column;
  align-items:flex-start;

  min-width:0;
  min-height:230px;

  padding:22px;

  border:
    1px solid
    rgba(61,96,101,.13);

  border-radius:21px;

  color:#294248;
  text-align:left;

  background:
    linear-gradient(
      145deg,
      #edf4f2,
      #eee8f2
    );

  box-shadow:
    0 15px 32px
    rgba(44,73,76,.08);

  cursor:pointer;

  transition:
    transform .28s ease,
    box-shadow .28s ease,
    border-color .28s ease;
}

.career-notifications-page .career-notification-category-card:hover{
  transform:translateY(-5px);

  border-color:
    rgba(104,82,128,.23);

  box-shadow:
    0 22px 40px
    rgba(44,73,76,.12);
}

.career-notifications-page .career-notification-category-card > span{
  display:grid;
  place-items:center;

  width:54px;
  height:54px;

  margin-bottom:17px;

  border-radius:17px;

  color:#b3ece5;

  background:
    linear-gradient(
      145deg,
      #32575f,
      #65527b
    );

  font-size:1.2rem;
}

.career-notifications-page .career-notification-category-card h3{
  margin:0 0 9px;

  color:#2b454b;

  font-size:1rem;
  line-height:1.35;
}

.career-notifications-page .career-notification-category-card p{
  margin:0;

  color:#64797c;

  font-size:.75rem;
  line-height:1.65;
}


/*==================================================
DEADLINE SECTION
==================================================*/

.career-notifications-page .career-notification-deadline-section{
  padding:82px 0;

  background:
    linear-gradient(
      145deg,
      #e4efed,
      #ece6f1
    );
}

.career-notifications-page .career-notification-deadline-grid{
  display:grid;

  grid-template-columns:
    repeat(
      3,
      minmax(0,1fr)
    );

  gap:18px;
}

.career-notifications-page .career-notification-deadline-card{
  min-width:0;

  padding:22px;

  border:
    1px solid
    rgba(61,96,101,.13);

  border-radius:20px;

  background:
    linear-gradient(
      145deg,
      #edf4f2,
      #eee8f2
    );

  box-shadow:
    0 15px 32px
    rgba(44,73,76,.08);
}

.career-notifications-page .career-notification-deadline-number{
  display:grid;
  place-items:center;

  width:48px;
  height:48px;

  margin-bottom:15px;

  border-radius:15px;

  color:#b1ece4;

  background:
    linear-gradient(
      145deg,
      #31565e,
      #65527a
    );

  font-size:.75rem;
  font-weight:900;
}

.career-notifications-page .career-notification-deadline-card h3{
  margin:0 0 8px;

  color:#294348;

  font-size:.97rem;
  line-height:1.4;
}

.career-notifications-page .career-notification-deadline-card strong{
  display:block;

  margin-bottom:7px;

  color:#65517c;

  font-size:.74rem;
}

.career-notifications-page .career-notification-deadline-card p{
  margin:0;

  color:#62777b;

  font-size:.71rem;
  line-height:1.55;
}


/*==================================================
CAREER ALERT REQUEST SECTION
==================================================*/

.career-notifications-page .career-alert-request-section{
  padding:82px 0;

  background:
    radial-gradient(
      circle at 90% 10%,
      rgba(150,112,181,.13),
      transparent 30%
    ),
    linear-gradient(
      145deg,
      #e5efed,
      #ece6f1
    );
}

.career-notifications-page .career-alert-request-layout{
  display:grid;

  grid-template-columns:
    minmax(0,1fr)
    minmax(320px,.72fr);

  align-items:center;

  gap:34px;

  padding:34px;

  border:
    1px solid
    rgba(255,255,255,.14);

  border-radius:27px;

  background:
    radial-gradient(
      circle at 94% 8%,
      rgba(153,226,216,.19),
      transparent 32%
    ),
    linear-gradient(
      135deg,
      #304f58,
      #476a70 55%,
      #66517c
    );

  box-shadow:
    0 24px 56px
    rgba(40,68,72,.2);
}

.career-notifications-page .career-alert-request-content{
  min-width:0;
}

.career-notifications-page .career-alert-request-content .career-notification-section-kicker{
  color:#a8e8df;
}

.career-notifications-page .career-alert-request-content h2{
  margin:8px 0 14px;

  color:#fff;

  font-size:
    clamp(
      2rem,
      4vw,
      3.2rem
    );

  line-height:1.13;
}

.career-notifications-page .career-alert-request-content > p{
  margin:0;

  color:
    rgba(
      255,
      255,
      255,
      .77
    );

  line-height:1.75;
}

.career-notifications-page .career-alert-benefits{
  display:grid;

  grid-template-columns:
    repeat(
      2,
      minmax(0,1fr)
    );

  gap:10px;

  margin-top:22px;
}

.career-notifications-page .career-alert-benefits > div{
  display:flex;
  align-items:center;
  gap:9px;

  min-width:0;

  padding:11px 12px;

  border:
    1px solid
    rgba(255,255,255,.12);

  border-radius:13px;

  color:
    rgba(
      255,
      255,
      255,
      .88
    );

  background:
    rgba(
      255,
      255,
      255,
      .065
    );

  font-size:.7rem;
  font-weight:800;
}

.career-notifications-page .career-alert-benefits i{
  color:#9ce4da;
}

.career-notifications-page .career-alert-request-card{
  min-width:0;

  padding:24px;

  border:
    1px solid
    rgba(255,255,255,.15);

  border-radius:22px;

  background:
    linear-gradient(
      145deg,
      rgba(255,255,255,.15),
      rgba(255,255,255,.07)
    );

  box-shadow:
    0 16px 38px
    rgba(19,42,47,.16);

  backdrop-filter:blur(17px);
  -webkit-backdrop-filter:blur(17px);
}

.career-notifications-page .career-alert-request-card form{
  display:grid;
  gap:14px;
}

.career-notifications-page .career-alert-request-card label{
  color:
    rgba(
      255,
      255,
      255,
      .86
    );
}


/*==================================================
INTERVIEW SUPPORT SECTION
==================================================*/

.career-notifications-page .career-notification-support-section{
  padding:72px 0;

  background:
    linear-gradient(
      145deg,
      #e3efec,
      #eee6f1
    );
}

.career-notifications-page .career-notification-support-card{
  display:grid;

  grid-template-columns:
    minmax(0,1fr)
    auto;

  align-items:center;

  gap:28px;

  padding:32px;

  border-radius:26px;

  background:
    radial-gradient(
      circle at 92% 8%,
      rgba(146,219,210,.19),
      transparent 31%
    ),
    linear-gradient(
      135deg,
      #304f58,
      #486a70 58%,
      #65517b
    );

  box-shadow:
    0 22px 54px
    rgba(40,67,70,.19);
}

.career-notifications-page .career-notification-support-content{
  min-width:0;
}

.career-notifications-page .career-notification-support-content .career-notification-section-kicker{
  color:#9fe4db;
}

.career-notifications-page .career-notification-support-content h2{
  margin:7px 0 12px;

  color:#fff;

  font-size:
    clamp(
      1.8rem,
      3.5vw,
      2.8rem
    );

  line-height:1.15;
}

.career-notifications-page .career-notification-support-content p{
  margin:0;

  color:
    rgba(
      255,
      255,
      255,
      .78
    );

  line-height:1.7;
}

.career-notifications-page .career-notification-support-tags{
  display:flex;
  flex-wrap:wrap;
  gap:9px;

  margin-top:18px;
}

.career-notifications-page .career-notification-support-tags span{
  padding:8px 11px;

  border:
    1px solid
    rgba(255,255,255,.13);

  border-radius:999px;

  color:
    rgba(
      255,
      255,
      255,
      .86
    );

  background:
    rgba(
      255,
      255,
      255,
      .065
    );

  font-size:.65rem;
  font-weight:800;
}

.career-notifications-page .career-notification-support-actions{
  display:grid;
  gap:11px;

  min-width:230px;
}


/*==================================================
FAQ SECTION
==================================================*/

.career-notifications-page .career-notification-faq-section{
  padding:82px 0;

  background:
    linear-gradient(
      145deg,
      #e5efed,
      #eee7f1
    );
}

.career-notifications-page .career-notification-faq-list{
  display:grid;
  gap:13px;

  max-width:920px;

  margin:36px auto 0;
}

.career-notifications-page .career-notification-faq-item{
  overflow:hidden;

  border:
    1px solid
    rgba(60,96,101,.13);

  border-radius:18px;

  background:
    linear-gradient(
      145deg,
      #edf4f2,
      #eee8f2
    );

  box-shadow:
    0 12px 28px
    rgba(44,73,76,.08);
}

.career-notifications-page .career-notification-faq-question{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;

  width:100%;
  min-width:0;
  min-height:66px;

  padding:17px 19px;

  border:0;

  color:#2b454b;
  text-align:left;

  background:transparent;

  cursor:pointer;

  font-size:.82rem;
  font-weight:900;
}

.career-notifications-page .career-notification-faq-question span{
  min-width:0;
}

.career-notifications-page .career-notification-faq-question i{
  flex:0 0 auto;

  color:#65517c;

  transition:
    transform .25s ease;
}

.career-notifications-page .career-notification-faq-item.active .career-notification-faq-question i{
  transform:rotate(180deg);
}

.career-notifications-page .career-notification-faq-answer{
  display:none;

  padding:
    0 19px 18px;
}

.career-notifications-page .career-notification-faq-item.active .career-notification-faq-answer{
  display:block;
}

.career-notifications-page .career-notification-faq-answer p{
  margin:0;

  color:#62777b;

  font-size:.75rem;
  line-height:1.75;
}


/*==================================================
IMPORTANT NOTICE
==================================================*/

.career-notifications-page .career-notification-important-section{
  padding:52px 0;

  background:
    linear-gradient(
      145deg,
      #eee8d9,
      #e5efed
    );
}

.career-notifications-page .career-notification-important-card{
  display:flex;
  align-items:flex-start;
  gap:18px;

  padding:25px;

  border:
    1px solid
    rgba(137,92,35,.16);

  border-radius:21px;

  background:
    linear-gradient(
      145deg,
      #f3ead4,
      #ece7de
    );
}

.career-notifications-page .career-notification-important-icon{
  display:grid;
  place-items:center;

  flex:0 0 52px;

  width:52px;
  height:52px;

  border-radius:16px;

  color:#ffe5a5;

  background:
    linear-gradient(
      145deg,
      #8b5d2e,
      #b17a3e
    );

  font-size:1.18rem;
}

.career-notifications-page .career-notification-important-card > div{
  min-width:0;
}

.career-notifications-page .career-notification-important-card h2{
  margin:0 0 8px;

  color:#62482d;

  font-size:1.17rem;
}

.career-notifications-page .career-notification-important-card p{
  margin:0;

  color:#73624f;

  font-size:.77rem;
  line-height:1.7;
}


/*==================================================
DISCLAIMER
==================================================*/

.career-notifications-page .career-notification-disclaimer-section{
  padding:52px 0;

  background:
    linear-gradient(
      145deg,
      #e5efed,
      #eee7f1
    );
}

.career-notifications-page .career-notification-disclaimer-card{
  padding:24px;

  border:
    1px solid
    rgba(60,96,101,.13);

  border-radius:20px;

  background:
    linear-gradient(
      145deg,
      #edf4f2,
      #eee8f2
    );
}

.career-notifications-page .career-notification-disclaimer-card h2{
  margin:0 0 8px;

  color:#294248;

  font-size:1.16rem;
}

.career-notifications-page .career-notification-disclaimer-card p{
  margin:0 0 14px;

  color:#62777b;

  font-size:.77rem;
  line-height:1.7;
}

.career-notifications-page .career-notification-text-link{
  display:inline-flex;
  align-items:center;
  gap:8px;

  color:#65517c;

  font-size:.73rem;
  font-weight:900;
}

/*==================================================
FOOTER
==================================================*/

.career-notifications-page .career-notification-footer{
  color:#edf7f6;

  background:
    radial-gradient(
      circle at 88% 12%,
      rgba(108,195,187,.14),
      transparent 28%
    ),
    linear-gradient(
      145deg,
      #243942,
      #2d5059 50%,
      #514567
    );
}

.career-notifications-page .career-notification-footer-top{
  padding:68px 0 44px;

  border-bottom:
    1px solid
    rgba(255,255,255,.08);
}

.career-notifications-page .career-notification-footer-top-grid{
  display:grid;

  grid-template-columns:
    minmax(0,1fr)
    minmax(320px,.72fr);

  align-items:center;

  gap:42px;
}

.career-notifications-page .career-notification-footer-brand,
.career-notifications-page .career-notification-footer-support{
  min-width:0;
}

.career-notifications-page .career-notification-footer .career-notification-brand-copy strong{
  color:#fff;
}

.career-notifications-page .career-notification-footer .career-notification-brand-copy small{
  color:rgba(255,255,255,.62);
}

.career-notifications-page .career-notification-footer-brand > p,
.career-notifications-page .career-notification-footer-support > p{
  margin:18px 0 0;

  color:rgba(255,255,255,.73);

  font-size:.78rem;
  line-height:1.8;
}

.career-notifications-page .career-notification-footer-badges{
  display:flex;
  flex-wrap:wrap;
  gap:9px;

  margin-top:19px;
}

.career-notifications-page .career-notification-footer-badges span{
  padding:8px 11px;

  border:
    1px solid
    rgba(255,255,255,.1);

  border-radius:999px;

  color:rgba(255,255,255,.82);

  background:
    rgba(255,255,255,.06);

  font-size:.65rem;
  font-weight:750;
}

.career-notifications-page .career-notification-footer-support .career-notification-section-kicker{
  color:#9fe4db;
}

.career-notifications-page .career-notification-footer-support h2{
  margin:8px 0 11px;

  color:#fff;

  font-size:
    clamp(
      1.65rem,
      3vw,
      2.5rem
    );

  line-height:1.15;
}

.career-notifications-page .career-notification-footer-actions{
  display:flex;
  flex-wrap:wrap;
  gap:11px;

  margin-top:22px;
}

.career-notifications-page .career-notification-footer-main{
  padding:52px 0;
}

.career-notifications-page .career-notification-footer-grid{
  display:grid;

  grid-template-columns:
    repeat(
      4,
      minmax(0,1fr)
    );

  gap:28px;
}

.career-notifications-page .career-notification-footer-column{
  min-width:0;
}

.career-notifications-page .career-notification-footer-column h3{
  margin:0 0 16px;

  color:#fff;

  font-size:.95rem;
}

.career-notifications-page .career-notification-footer-column nav{
  display:grid;
  gap:10px;
}

.career-notifications-page .career-notification-footer-column a{
  color:rgba(255,255,255,.7);

  font-size:.72rem;
  line-height:1.5;

  transition:color .22s ease;
}

.career-notifications-page .career-notification-footer-column a:hover,
.career-notifications-page .career-notification-footer-column a[aria-current="page"]{
  color:#9fe4dc;
}

.career-notifications-page .career-notification-footer-bottom{
  padding:21px 0;

  border-top:
    1px solid
    rgba(255,255,255,.08);
}

.career-notifications-page .career-notification-footer-bottom-inner{
  display:flex;
  align-items:center;
  justify-content:space-between;
  flex-wrap:wrap;
  gap:18px;
}

.career-notifications-page .career-notification-footer-bottom p{
  margin:0;

  color:rgba(255,255,255,.62);

  font-size:.7rem;
}

.career-notifications-page .career-notification-footer-bottom-links{
  display:flex;
  flex-wrap:wrap;
  gap:16px;
}

.career-notifications-page .career-notification-footer-bottom-links a{
  color:rgba(255,255,255,.68);

  font-size:.68rem;
}

.career-notifications-page .career-notification-footer-bottom-links a:hover{
  color:#9fe4dc;
}


/*==================================================
NOTIFICATION MODAL
==================================================*/

.career-notifications-page .career-notification-modal{
  position:fixed;
  inset:0;
  z-index:3000;

  display:grid;
  place-items:center;

  padding:20px;
}

.career-notifications-page .career-notification-modal[hidden]{
  display:none;
}

.career-notifications-page .career-notification-modal-overlay{
  position:absolute;
  inset:0;

  background:
    rgba(17,31,37,.72);

  backdrop-filter:blur(5px);
  -webkit-backdrop-filter:blur(5px);
}

.career-notifications-page .career-notification-modal-dialog{
  position:relative;
  z-index:1;

  width:min(720px,100%);
  max-height:90dvh;

  overflow-y:auto;

  padding:28px;

  border:
    1px solid
    rgba(63,97,102,.14);

  border-radius:24px;

  background:
    linear-gradient(
      145deg,
      #edf4f2,
      #eee8f2
    );

  box-shadow:
    0 30px 80px
    rgba(13,31,36,.35);
}

.career-notifications-page .career-notification-modal-close{
  position:absolute;
  top:15px;
  right:15px;

  display:grid;
  place-items:center;

  width:42px;
  height:42px;

  border:0;
  border-radius:12px;

  color:#fff;

  background:
    linear-gradient(
      145deg,
      #315d66,
      #6a527f
    );

  cursor:pointer;
}

.career-notifications-page .career-notification-modal-header{
  display:flex;
  align-items:center;
  gap:15px;

  min-width:0;

  padding-right:50px;
}

.career-notifications-page .career-notification-modal-icon{
  display:grid;
  place-items:center;

  flex:0 0 58px;

  width:58px;
  height:58px;

  border-radius:18px;

  color:#b5eee6;

  background:
    linear-gradient(
      145deg,
      #31545d,
      #605273
    );

  font-size:1.25rem;
}

.career-notifications-page .career-notification-modal-header > div{
  min-width:0;
}

.career-notifications-page .career-notification-modal-category{
  color:#65517c;

  font-size:.68rem;
  font-weight:900;
  letter-spacing:.6px;
  text-transform:uppercase;
}

.career-notifications-page .career-notification-modal-header h2{
  margin:5px 0 0;

  color:#294248;

  font-size:
    clamp(
      1.35rem,
      3vw,
      2rem
    );

  line-height:1.25;
}

.career-notifications-page .career-notification-modal-content{
  min-width:0;
}

.career-notifications-page .career-notification-modal-authority{
  margin:22px 0 10px;

  color:#65517c;

  font-size:.77rem;
  font-weight:850;
}

.career-notifications-page .career-notification-modal-description{
  margin:0;

  color:#62777b;

  font-size:.79rem;
  line-height:1.75;
}

.career-notifications-page .career-notification-modal-meta{
  display:grid;

  grid-template-columns:
    repeat(
      3,
      minmax(0,1fr)
    );

  gap:10px;

  margin:21px 0;
}

.career-notifications-page .career-notification-modal-meta > div{
  min-width:0;

  padding:13px;

  border:
    1px solid
    rgba(63,97,102,.1);

  border-radius:14px;

  background:
    rgba(255,255,255,.42);
}

.career-notifications-page .career-notification-modal-meta span{
  display:block;

  margin-bottom:4px;

  color:#75898c;

  font-size:.61rem;
  font-weight:800;
}

.career-notifications-page .career-notification-modal-meta strong{
  display:block;

  color:#2e4a4f;

  font-size:.71rem;
  line-height:1.45;
}

.career-notifications-page .career-notification-modal-tags{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}

.career-notifications-page .career-notification-modal-tags span{
  padding:7px 10px;

  border-radius:999px;

  color:#38585d;

  background:#d9ece8;

  font-size:.66rem;
  font-weight:800;
}

.career-notifications-page .career-notification-modal-actions{
  display:flex;
  flex-wrap:wrap;
  gap:10px;

  margin-top:22px;
}


/*==================================================
TOAST
==================================================*/

.career-notifications-page .career-notification-toast-container{
  position:fixed;
  right:18px;
  bottom:92px;
  z-index:3500;

  display:grid;
  gap:10px;

  width:min(330px,calc(100vw - 36px));
}

.career-notifications-page .career-notification-toast{
  padding:14px 16px;

  border-radius:14px;

  color:#fff;

  background:
    linear-gradient(
      145deg,
      #315b62,
      #635177
    );

  box-shadow:
    0 16px 34px
    rgba(26,48,52,.25);

  font-size:.74rem;
  font-weight:800;
}


/*==================================================
BACK TO TOP
==================================================*/

.career-notifications-page .career-notification-back-to-top{
  position:fixed;
  right:20px;
  bottom:26px;
  z-index:950;

  display:grid;
  place-items:center;

  width:50px;
  height:50px;

  border:0;
  border-radius:50%;

  color:#fff;

  background:
    linear-gradient(
      145deg,
      #355d65,
      #67537e
    );

  box-shadow:
    0 16px 34px
    rgba(30,52,58,.22);

  cursor:pointer;
}

.career-notifications-page .career-notification-back-to-top[hidden]{
  display:none;
}


/*==================================================
MOBILE QUICK ACTIONS
==================================================*/

.career-notifications-page .career-notification-mobile-actions{
  display:none;
}


/*==================================================
NOSCRIPT
==================================================*/

.career-notifications-page .career-notification-noscript{
  padding:16px;

  color:#fff;
  text-align:center;

  background:#7d3541;
}


/*==================================================
TABLET LAYOUT
==================================================*/

@media(max-width:1050px){

  .career-notifications-page .career-notification-menu-toggle{
    display:block;
  }

  .career-notifications-page .career-notification-navigation{
    position:fixed;
    top:0;
    right:0;
    z-index:1000;

    display:grid;
    align-content:start;
    gap:8px;

    width:min(88vw,390px);
    height:100dvh;

    padding:
      92px 22px
      calc(26px + env(safe-area-inset-bottom));

    overflow-y:auto;

    transform:translateX(105%);

    background:
      linear-gradient(
        145deg,
        #eaf3f1,
        #eee8f2
      );

    box-shadow:
      -22px 0 50px
      rgba(34,58,62,.2);

    transition:
      transform .3s ease;
  }

  .career-notifications-page .career-notification-navigation.active{
    transform:translateX(0);
  }

  .career-notifications-page .career-notification-navigation > a{
    width:100%;
    min-height:45px;

    display:flex;
    align-items:center;

    padding:0 12px;

    border-radius:11px;

    background:
      rgba(255,255,255,.42);
  }

  .career-notifications-page .career-notification-header-cta{
    justify-content:center;
  }

  .career-notifications-page .career-notification-hero-grid{
    grid-template-columns:1fr;
  }

  .career-notifications-page .career-notification-finder-card{
    max-width:680px;
  }

  .career-notifications-page .career-notification-directory-layout,
  .career-notifications-page .career-alert-request-layout,
  .career-notifications-page .career-notification-support-card,
  .career-notifications-page .career-notification-footer-top-grid{
    grid-template-columns:1fr;
  }

  .career-notifications-page .career-notification-filter-panel{
    position:fixed;
    top:0;
    left:0;
    z-index:1000;

    width:min(88vw,370px);
    height:100dvh;

    overflow-y:auto;

    border-radius:0 24px 24px 0;

    transform:translateX(-105%);

    transition:
      transform .28s ease;
  }

  .career-notifications-page .career-notification-filter-panel.active{
    transform:translateX(0);
  }

  .career-notifications-page .career-notification-filter-close,
  .career-notifications-page .career-notification-filter-toggle{
    display:inline-flex;
  }

  .career-notifications-page .career-notification-support-actions{
    grid-template-columns:
      repeat(
        2,
        minmax(0,1fr)
      );

    min-width:0;
  }

  .career-notifications-page .career-notification-footer-grid{
    grid-template-columns:
      repeat(
        2,
        minmax(0,1fr)
      );
  }

}


/*==================================================
MOBILE LAYOUT
==================================================*/

@media(max-width:768px){

  body.career-notifications-page{
    padding-bottom:
      calc(
        74px +
        env(safe-area-inset-bottom)
      );
  }

  .career-notifications-page .career-notification-topbar-inner{
    align-items:flex-start;
    flex-direction:column;
    gap:7px;
  }

  .career-notifications-page .career-notification-topbar-links{
    flex-wrap:wrap;
  }

  .career-notifications-page .career-notification-hero{
    min-height:auto;
    padding:64px 0;
  }

  .career-notifications-page .career-notification-hero h1{
    font-size:
      clamp(
        2.35rem,
        12vw,
        3.8rem
      );

    letter-spacing:-1.4px;
  }

  .career-notifications-page .career-notification-hero-actions{
    display:grid;
    grid-template-columns:1fr;
  }

  .career-notifications-page .career-notification-hero-actions .career-button{
    width:100%;
  }

  .career-notifications-page .career-notification-summary-grid{
    grid-template-columns:
      repeat(
        2,
        minmax(0,1fr)
      );
  }

  .career-notifications-page .career-notification-featured-grid,
  .career-notifications-page .career-notification-grid,
  .career-notifications-page .career-notification-category-grid,
  .career-notifications-page .career-notification-deadline-grid{
    grid-template-columns:1fr;
  }

  .career-notifications-page .career-notification-results-toolbar{
    align-items:stretch;
    flex-direction:column;
  }

  .career-notifications-page .career-notification-results-summary,
  .career-notifications-page .career-notification-sort-wrapper{
    justify-content:space-between;
  }

  .career-notifications-page .career-notification-sort-wrapper select{
    flex:1;
  }

  .career-notifications-page .career-notification-card-actions,
  .career-notifications-page .career-notification-support-actions{
    grid-template-columns:1fr;
  }

  .career-notifications-page .career-notification-card-actions .career-button,
  .career-notifications-page .career-notification-support-actions .career-button{
    width:100%;
  }

  .career-notifications-page .career-notification-modal-meta{
    grid-template-columns:
      repeat(
        2,
        minmax(0,1fr)
      );
  }

  .career-notifications-page .career-notification-mobile-actions{
    position:fixed;
    left:0;
    right:0;
    bottom:0;
    z-index:1100;

    display:grid;

    grid-template-columns:
      repeat(
        5,
        minmax(0,1fr)
      );

    padding:
      7px 7px
      calc(
        7px +
        env(safe-area-inset-bottom)
      );

    border-top:
      1px solid
      rgba(255,255,255,.08);

    background:
      rgba(37,58,66,.97);

    backdrop-filter:blur(18px);
    -webkit-backdrop-filter:blur(18px);
  }

  .career-notifications-page .career-notification-mobile-actions a{
    display:grid;
    justify-items:center;
    gap:4px;

    min-width:0;

    padding:6px 0;

    color:#d9efec;

    font-size:.62rem;
  }

  .career-notifications-page .career-notification-mobile-actions a > span{
    display:grid;
    place-items:center;

    width:39px;
    height:39px;

    border-radius:13px;

    background:
      rgba(255,255,255,.06);
  }

  .career-notifications-page .career-notification-mobile-main > span{
    color:#fff;

    background:
      linear-gradient(
        145deg,
        #60c7bb,
        #8661a6
      ) !important;
  }

  .career-notifications-page .career-notification-mobile-actions a.active{
    color:#9fe5dc;
  }

  .career-notifications-page .career-notification-back-to-top{
    bottom:
      calc(
        88px +
        env(safe-area-inset-bottom)
      );
  }

  .career-notifications-page .career-notification-toast-container{
    bottom:
      calc(
        88px +
        env(safe-area-inset-bottom)
      );
  }

}


/*==================================================
SMALL MOBILE
==================================================*/

@media(max-width:540px){

  .career-notifications-page .container{
    width:min(100% - 22px,1180px);
  }

  .career-notifications-page .career-notification-header-inner{
    min-height:72px;
  }

  .career-notifications-page .career-notification-brand-mark{
    flex-basis:46px;
    width:46px;
    height:46px;
  }

  .career-notifications-page .career-notification-brand-mark img{
    width:40px;
    height:40px;
  }

  .career-notifications-page .career-notification-brand-copy strong{
    font-size:1.08rem;
  }

  .career-notifications-page .career-notification-hero-points,
  .career-notifications-page .career-alert-benefits{
    grid-template-columns:1fr;
  }

  .career-notifications-page .career-notification-finder-card,
  .career-notifications-page .career-alert-request-layout,
  .career-notifications-page .career-alert-request-card,
  .career-notifications-page .career-notification-support-card{
    padding:20px;
    border-radius:20px;
  }

  .career-notifications-page .career-notification-summary-grid{
    grid-template-columns:1fr;
  }

  .career-notifications-page .career-notification-card,
  .career-notifications-page .career-notification-featured-card{
    padding:18px;
  }

  .career-notifications-page .career-notification-card-meta,
  .career-notifications-page .career-notification-modal-meta{
    grid-template-columns:1fr;
  }

  .career-notifications-page .career-notification-important-card{
    display:grid;
  }

  .career-notifications-page .career-notification-footer-grid{
    grid-template-columns:1fr;
  }

  .career-notifications-page .career-notification-footer-bottom-inner{
    justify-content:center;
    text-align:center;
  }

  .career-notifications-page .career-notification-footer-bottom-links{
    justify-content:center;
  }

  .career-notifications-page .career-notification-modal{
    padding:12px;
  }

  .career-notifications-page .career-notification-modal-dialog{
    padding:21px;
    border-radius:20px;
  }

  .career-notifications-page .career-notification-modal-header{
    align-items:flex-start;
  }

  .career-notifications-page .career-notification-modal-actions{
    display:grid;
    grid-template-columns:1fr;
  }

  .career-notifications-page .career-notification-modal-actions .career-button{
    width:100%;
  }

}

/*==================================================
APPLY JOB PAGE
GLOBAL CSS
==================================================*/

body.apply-job-page{
  margin:0;
  overflow-x:hidden;
  color:#263f46;
  background:
    radial-gradient(
      circle at 10% 8%,
      rgba(64,142,153,.12),
      transparent 28%
    ),
    radial-gradient(
      circle at 90% 14%,
      rgba(127,91,159,.1),
      transparent 30%
    ),
    linear-gradient(
      145deg,
      #e5efec,
      #eee8f2 52%,
      #f1eadf
    );
}

body.apply-job-page,
body.apply-job-page *{
  box-sizing:border-box;
}

body.apply-job-page img{
  display:block;
  max-width:100%;
}

body.apply-job-page a{
  text-decoration:none;
}

body.apply-job-page button,
body.apply-job-page input,
body.apply-job-page select,
body.apply-job-page textarea{
  font:inherit;
}

body.apply-job-page h1,
body.apply-job-page h2,
body.apply-job-page h3,
body.apply-job-page h4,
body.apply-job-page p,
body.apply-job-page span,
body.apply-job-page strong,
body.apply-job-page small,
body.apply-job-page label,
body.apply-job-page a{
  word-break:normal;
  overflow-wrap:break-word;
  writing-mode:horizontal-tb;
}

.apply-job-page .container{
  width:min(1180px,calc(100% - 32px));
  margin-inline:auto;
}


/*==================================================
COMMON BUTTONS
==================================================*/

.apply-job-page .apply-job-button{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:9px;
  min-height:47px;
  min-width:0;
  padding:0 18px;
  border:0;
  border-radius:13px;
  cursor:pointer;
  font-size:.76rem;
  font-weight:900;
  transition:
    transform .25s ease,
    box-shadow .25s ease,
    opacity .25s ease;
}

.apply-job-page .apply-job-button:hover{
  transform:translateY(-2px);
}

.apply-job-page .apply-job-button-primary{
  color:#fff;
  background:
    linear-gradient(
      145deg,
      #315d66,
      #6b527f
    );
  box-shadow:
    0 13px 28px
    rgba(42,72,78,.2);
}

.apply-job-page .apply-job-button-secondary{
  color:#2d4a50;
  background:
    linear-gradient(
      145deg,
      #e7f2ef,
      #eee8f2
    );
  box-shadow:
    0 12px 25px
    rgba(43,72,76,.12);
}

.apply-job-page .apply-job-button-danger{
  color:#fff;
  background:
    linear-gradient(
      145deg,
      #8b3947,
      #b14e5c
    );
}

.apply-job-page .apply-job-button-block{
  width:100%;
}


/*==================================================
TOP BAR
==================================================*/

.apply-job-page .apply-job-topbar{
  position:relative;
  z-index:60;
  padding:10px 0;
  color:#eaf7f5;
  background:
    linear-gradient(
      90deg,
      #274b54,
      #315f68 55%,
      #5f4d73
    );
}

.apply-job-page .apply-job-topbar-inner{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
}

.apply-job-page .apply-job-topbar p{
  display:flex;
  align-items:center;
  gap:9px;
  margin:0;
  font-size:.75rem;
  font-weight:750;
}

.apply-job-page .apply-job-topbar-links{
  display:flex;
  align-items:center;
  gap:15px;
}

.apply-job-page .apply-job-topbar-links a{
  display:inline-flex;
  align-items:center;
  gap:7px;
  color:rgba(255,255,255,.82);
  font-size:.71rem;
  font-weight:800;
}

.apply-job-page .apply-job-topbar-links a:hover{
  color:#9fe6dc;
}


/*==================================================
HEADER
==================================================*/

.apply-job-page .apply-job-header{
  position:relative;
  z-index:80;
  border-bottom:1px solid rgba(56,94,99,.11);
  background:
    linear-gradient(
      145deg,
      #edf4f2,
      #eee8f2
    );
  box-shadow:
    0 8px 24px
    rgba(42,69,72,.07);
}

.apply-job-page .apply-job-header-inner{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:22px;
  min-height:82px;
}

.apply-job-page .apply-job-brand{
  display:inline-flex;
  align-items:center;
  gap:12px;
  flex:0 0 auto;
  min-width:0;
  color:#29434a;
}

.apply-job-page .apply-job-brand-mark{
  display:grid;
  place-items:center;
  flex:0 0 52px;
  width:52px;
  height:52px;
  border-radius:16px;
  overflow:hidden;
  background:#e4efec;
  box-shadow:
    0 10px 24px
    rgba(44,76,79,.1);
}

.apply-job-page .apply-job-brand-mark img{
  width:45px;
  height:45px;
  object-fit:contain;
}

.apply-job-page .apply-job-brand-copy{
  display:grid;
  min-width:0;
  line-height:1.05;
}

.apply-job-page .apply-job-brand-copy strong{
  color:#29434a;
  font-size:1.23rem;
}

.apply-job-page .apply-job-brand-copy small{
  margin-top:4px;
  color:#718287;
  font-size:.66rem;
  letter-spacing:1.1px;
  text-transform:uppercase;
}

.apply-job-page .apply-job-menu-toggle{
  display:none;
  flex:0 0 46px;
  width:46px;
  height:46px;
  padding:0;
  border:0;
  border-radius:14px;
  background:
    linear-gradient(
      145deg,
      #315d66,
      #6a527f
    );
  cursor:pointer;
}

.apply-job-page .apply-job-menu-toggle span{
  display:block;
  width:22px;
  height:2px;
  margin:5px auto;
  border-radius:999px;
  background:#fff;
}

.apply-job-page .apply-job-navigation{
  display:flex;
  align-items:center;
  gap:19px;
  min-width:0;
}

.apply-job-page .apply-job-navigation > a{
  flex:0 0 auto;
  color:#3e595f;
  font-size:.74rem;
  font-weight:850;
}

.apply-job-page .apply-job-navigation > a:hover,
.apply-job-page .apply-job-navigation > a.active{
  color:#6a527f;
}

.apply-job-page .apply-job-header-cta{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:42px;
  padding:0 16px;
  border-radius:12px;
  color:#fff !important;
  background:
    linear-gradient(
      145deg,
      #315d66,
      #6a527f
    );
  box-shadow:
    0 11px 22px
    rgba(48,82,88,.15);
}

.apply-job-page .apply-job-navigation-overlay{
  position:fixed;
  inset:0;
  z-index:998;
  visibility:hidden;
  opacity:0;
  background:rgba(19,34,40,.58);
  transition:
    opacity .25s ease,
    visibility .25s ease;
}

.apply-job-page .apply-job-navigation-overlay.active{
  visibility:visible;
  opacity:1;
}


/*==================================================
HERO
==================================================*/

.apply-job-page .apply-job-hero{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  padding:82px 0;
  background:
    radial-gradient(
      circle at 87% 12%,
      rgba(112,207,197,.2),
      transparent 29%
    ),
    radial-gradient(
      circle at 14% 88%,
      rgba(174,127,194,.18),
      transparent 32%
    ),
    linear-gradient(
      135deg,
      #263f49,
      #315f68 52%,
      #65517d
    );
}

.apply-job-page .apply-job-hero::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  background:
    linear-gradient(
      rgba(255,255,255,.027) 1px,
      transparent 1px
    ),
    linear-gradient(
      90deg,
      rgba(255,255,255,.027) 1px,
      transparent 1px
    );
  background-size:38px 38px;
}

.apply-job-page .apply-job-hero-grid{
  display:grid;
  grid-template-columns:
    minmax(0,1fr)
    minmax(320px,.72fr);
  align-items:center;
  gap:clamp(34px,6vw,76px);
}

.apply-job-page .apply-job-hero-content{
  min-width:0;
  max-width:790px;
}

.apply-job-page .apply-job-breadcrumb{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:9px;
  margin-bottom:22px;
  color:rgba(255,255,255,.7);
  font-size:.78rem;
}

.apply-job-page .apply-job-breadcrumb a{
  color:rgba(255,255,255,.8);
}

.apply-job-page .apply-job-breadcrumb a:hover{
  color:#9ce4da;
}

.apply-job-page .apply-job-hero-badge{
  display:inline-flex;
  align-items:center;
  gap:9px;
  margin-bottom:20px;
  padding:9px 14px;
  border:1px solid rgba(255,255,255,.16);
  border-radius:999px;
  color:#b5ece5;
  background:rgba(255,255,255,.075);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
  font-size:.73rem;
  font-weight:850;
}

.apply-job-page .apply-job-hero h1{
  max-width:760px;
  margin:0 0 22px;
  color:#f6f8f7;
  font-size:clamp(2.7rem,6vw,5.2rem);
  line-height:1.03;
  letter-spacing:-2px;
}

.apply-job-page .apply-job-hero h1 span{
  display:block;
  background:
    linear-gradient(
      90deg,
      #9de6dc,
      #8bc9dd,
      #d5afe8
    );
  background-clip:text;
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;
}

.apply-job-page .apply-job-hero-description{
  max-width:700px;
  margin:0;
  color:rgba(241,247,247,.81);
  font-size:1rem;
  line-height:1.8;
}

.apply-job-page .apply-job-hero-points{
  display:grid;
  grid-template-columns:
    repeat(2,minmax(0,1fr));
  gap:12px;
  margin-top:28px;
}

.apply-job-page .apply-job-hero-point{
  display:flex;
  align-items:center;
  gap:11px;
  min-width:0;
  padding:12px 13px;
  border:1px solid rgba(255,255,255,.11);
  border-radius:14px;
  color:rgba(255,255,255,.88);
  background:rgba(255,255,255,.055);
}

.apply-job-page .apply-job-hero-point > span{
  display:grid;
  place-items:center;
  flex:0 0 36px;
  width:36px;
  height:36px;
  border-radius:11px;
  color:#9fe6dd;
  background:rgba(255,255,255,.08);
}

.apply-job-page .apply-job-hero-point > div{
  min-width:0;
}

.apply-job-page .apply-job-hero-point strong{
  display:block;
  color:#fff;
  font-size:.76rem;
}

.apply-job-page .apply-job-hero-point small{
  display:block;
  margin-top:3px;
  color:rgba(255,255,255,.64);
  font-size:.64rem;
}


/*==================================================
JOB SUMMARY CARD
==================================================*/

.apply-job-page .apply-job-summary-card{
  min-width:0;
  padding:26px;
  border:1px solid rgba(255,255,255,.16);
  border-radius:26px;
  background:
    radial-gradient(
      circle at 92% 0%,
      rgba(140,221,212,.16),
      transparent 34%
    ),
    linear-gradient(
      145deg,
      rgba(255,255,255,.13),
      rgba(255,255,255,.055)
    );
  box-shadow:
    0 26px 70px
    rgba(9,25,30,.31);
  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);
}

.apply-job-page .apply-job-summary-card h2{
  margin:0 0 8px;
  color:#fff;
  font-size:1.45rem;
}

.apply-job-page .apply-job-summary-card > p{
  margin:0 0 20px;
  color:rgba(255,255,255,.72);
  font-size:.77rem;
  line-height:1.7;
}

.apply-job-page .apply-job-summary-list{
  display:grid;
  gap:12px;
}

.apply-job-page .apply-job-summary-item{
  display:flex;
  align-items:flex-start;
  gap:12px;
  min-width:0;
  padding:13px;
  border:1px solid rgba(255,255,255,.11);
  border-radius:14px;
  background:rgba(255,255,255,.06);
}

.apply-job-page .apply-job-summary-item > span{
  display:grid;
  place-items:center;
  flex:0 0 40px;
  width:40px;
  height:40px;
  border-radius:12px;
  color:#29454b;
  background:#9fe4db;
}

.apply-job-page .apply-job-summary-item > div{
  min-width:0;
}

.apply-job-page .apply-job-summary-item small{
  display:block;
  color:rgba(255,255,255,.63);
  font-size:.63rem;
  font-weight:800;
}

.apply-job-page .apply-job-summary-item strong{
  display:block;
  margin-top:3px;
  color:#fff;
  font-size:.76rem;
  line-height:1.4;
}


/*==================================================
APPLICATION LAYOUT
==================================================*/

.apply-job-page .apply-job-form-section{
  padding:82px 0;
  background:
    radial-gradient(
      circle at 10% 10%,
      rgba(94,165,167,.1),
      transparent 29%
    ),
    linear-gradient(
      145deg,
      #e7f0ee,
      #ede6f1
    );
}

.apply-job-page .apply-job-layout{
  display:grid;
  grid-template-columns:
    minmax(0,1fr)
    minmax(280px,.34fr);
  align-items:start;
  gap:25px;
}

.apply-job-page .apply-job-form-card{
  min-width:0;
  padding:28px;
  border:1px solid rgba(60,96,101,.13);
  border-radius:24px;
  background:
    linear-gradient(
      145deg,
      #edf4f2,
      #eee8f2
    );
  box-shadow:
    0 18px 40px
    rgba(47,77,79,.09);
}

.apply-job-page .apply-job-form-header{
  margin-bottom:24px;
}

.apply-job-page .apply-job-form-header span{
  display:inline-block;
  color:#6b527f;
  font-size:.68rem;
  font-weight:900;
  letter-spacing:1.3px;
  text-transform:uppercase;
}

.apply-job-page .apply-job-form-header h2{
  margin:7px 0 10px;
  color:#294248;
  font-size:clamp(1.8rem,3.6vw,2.8rem);
  line-height:1.15;
}

.apply-job-page .apply-job-form-header p{
  margin:0;
  color:#62777b;
  line-height:1.7;
}


/*==================================================
STEP NAVIGATION
==================================================*/

.apply-job-page .apply-job-step-navigation{
  display:grid;
  grid-template-columns:
    repeat(6,minmax(0,1fr));
  gap:10px;
  margin-bottom:28px;
}

.apply-job-page .apply-job-step-button{
  min-width:0;
  min-height:72px;
  padding:10px;
  border:1px solid rgba(63,97,102,.12);
  border-radius:15px;
  color:#607579;
  background:rgba(255,255,255,.42);
  cursor:pointer;
  text-align:center;
}

.apply-job-page .apply-job-step-button span{
  display:grid;
  place-items:center;
  width:32px;
  height:32px;
  margin:0 auto 7px;
  border-radius:10px;
  color:#4d686d;
  background:#dcebe8;
  font-size:.72rem;
  font-weight:900;
}

.apply-job-page .apply-job-step-button strong{
  display:block;
  font-size:.65rem;
  line-height:1.35;
}

.apply-job-page .apply-job-step-button.active{
  color:#fff;
  border-color:transparent;
  background:
    linear-gradient(
      145deg,
      #315d66,
      #6b527f
    );
}

.apply-job-page .apply-job-step-button.active span{
  color:#29454b;
  background:#9fe4db;
}

.apply-job-page .apply-job-step-button.completed{
  border-color:rgba(56,139,117,.22);
  color:#2d6557;
  background:#dceee8;
}


/*==================================================
FORM STEPS
==================================================*/

.apply-job-page .apply-job-step{
  display:none;
}

.apply-job-page .apply-job-step.active{
  display:block;
}

.apply-job-page .apply-job-step-heading{
  margin-bottom:20px;
}

.apply-job-page .apply-job-step-heading h3{
  margin:0 0 7px;
  color:#294248;
  font-size:1.3rem;
}

.apply-job-page .apply-job-step-heading p{
  margin:0;
  color:#667b7f;
  font-size:.77rem;
  line-height:1.65;
}

.apply-job-page .apply-job-form-grid{
  display:grid;
  grid-template-columns:
    repeat(2,minmax(0,1fr));
  gap:17px;
}

.apply-job-page .apply-job-form-field{
  display:grid;
  gap:7px;
  min-width:0;
}

.apply-job-page .apply-job-form-field.full-width{
  grid-column:1 / -1;
}

.apply-job-page .apply-job-form-field label{
  color:#405d63;
  font-size:.71rem;
  font-weight:850;
}

.apply-job-page .apply-job-required{
  color:#9d3d49;
}

.apply-job-page .apply-job-form-field input,
.apply-job-page .apply-job-form-field select,
.apply-job-page .apply-job-form-field textarea{
  width:100%;
  max-width:100%;
  min-width:0;
  border:1px solid rgba(57,94,99,.14);
  border-radius:13px;
  outline:none;
  color:#294248;
  background:#eaf3f1;
}

.apply-job-page .apply-job-form-field input,
.apply-job-page .apply-job-form-field select{
  min-height:48px;
  padding:0 14px;
}

.apply-job-page .apply-job-form-field textarea{
  min-height:120px;
  padding:13px 14px;
  resize:vertical;
}

.apply-job-page .apply-job-form-field input:focus,
.apply-job-page .apply-job-form-field select:focus,
.apply-job-page .apply-job-form-field textarea:focus{
  border-color:#82d5cb;
  box-shadow:
    0 0 0 4px
    rgba(130,213,203,.14);
}

.apply-job-page .apply-job-form-field small{
  color:#75898c;
  font-size:.62rem;
  line-height:1.45;
}


/*==================================================
RADIO AND CHECKBOXES
==================================================*/

.apply-job-page .apply-job-choice-grid{
  display:grid;
  grid-template-columns:
    repeat(2,minmax(0,1fr));
  gap:12px;
}

.apply-job-page .apply-job-choice-card{
  position:relative;
  min-width:0;
}

.apply-job-page .apply-job-choice-card input{
  position:absolute;
  opacity:0;
  pointer-events:none;
}

.apply-job-page .apply-job-choice-card label{
  display:flex;
  align-items:flex-start;
  gap:12px;
  min-height:92px;
  padding:15px;
  border:1px solid rgba(60,96,101,.13);
  border-radius:16px;
  background:rgba(255,255,255,.42);
  cursor:pointer;
}

.apply-job-page .apply-job-choice-card label > span{
  display:grid;
  place-items:center;
  flex:0 0 40px;
  width:40px;
  height:40px;
  border-radius:12px;
  color:#4d686d;
  background:#dcebe8;
}

.apply-job-page .apply-job-choice-card label > div{
  min-width:0;
}

.apply-job-page .apply-job-choice-card strong{
  display:block;
  color:#2d4a50;
  font-size:.76rem;
}

.apply-job-page .apply-job-choice-card small{
  display:block;
  margin-top:4px;
  color:#6e8286;
  font-size:.64rem;
  line-height:1.45;
}

.apply-job-page .apply-job-choice-card input:checked + label{
  border-color:transparent;
  color:#fff;
  background:
    linear-gradient(
      145deg,
      #315d66,
      #6b527f
    );
  box-shadow:
    0 14px 30px
    rgba(43,73,78,.16);
}

.apply-job-page .apply-job-choice-card input:checked + label strong,
.apply-job-page .apply-job-choice-card input:checked + label small{
  color:#fff;
}

.apply-job-page .apply-job-choice-card input:checked + label > span{
  color:#29454b;
  background:#9fe4db;
}


/*==================================================
PLAN CARDS
==================================================*/

.apply-job-page .apply-job-plan-grid{
  display:grid;
  grid-template-columns:
    repeat(3,minmax(0,1fr));
  gap:14px;
}

.apply-job-page .apply-job-plan-card{
  position:relative;
  min-width:0;
}

.apply-job-page .apply-job-plan-card input{
  position:absolute;
  opacity:0;
  pointer-events:none;
}

.apply-job-page .apply-job-plan-card label{
  display:flex;
  flex-direction:column;
  min-height:180px;
  padding:18px;
  border:1px solid rgba(60,96,101,.13);
  border-radius:18px;
  background:rgba(255,255,255,.42);
  cursor:pointer;
}

.apply-job-page .apply-job-plan-card .plan-badge{
  display:inline-flex;
  align-items:center;
  align-self:flex-start;
  min-height:28px;
  padding:0 9px;
  border-radius:999px;
  color:#46636a;
  background:#dbece9;
  font-size:.62rem;
  font-weight:900;
}

.apply-job-page .apply-job-plan-card h4{
  margin:15px 0 6px;
  color:#294248;
  font-size:1rem;
}

.apply-job-page .apply-job-plan-card strong{
  color:#65517c;
  font-size:1.45rem;
}

.apply-job-page .apply-job-plan-card p{
  margin:8px 0 0;
  color:#687d81;
  font-size:.67rem;
  line-height:1.55;
}

.apply-job-page .apply-job-plan-card input:checked + label{
  border-color:transparent;
  background:
    linear-gradient(
      145deg,
      #315d66,
      #6b527f
    );
  box-shadow:
    0 18px 36px
    rgba(43,73,78,.17);
}

.apply-job-page .apply-job-plan-card input:checked + label h4,
.apply-job-page .apply-job-plan-card input:checked + label strong,
.apply-job-page .apply-job-plan-card input:checked + label p{
  color:#fff;
}


/*==================================================
FILE UPLOAD
==================================================*/

.apply-job-page .apply-job-upload-grid{
  display:grid;
  grid-template-columns:
    repeat(2,minmax(0,1fr));
  gap:14px;
}

.apply-job-page .apply-job-upload-card{
  position:relative;
  min-width:0;
}

.apply-job-page .apply-job-upload-card input{
  position:absolute;
  width:1px;
  height:1px;
  opacity:0;
}

.apply-job-page .apply-job-upload-card label{
  display:flex;
  align-items:flex-start;
  gap:12px;
  min-height:108px;
  padding:16px;
  border:1px dashed rgba(61,98,103,.28);
  border-radius:17px;
  background:rgba(255,255,255,.38);
  cursor:pointer;
}

.apply-job-page .apply-job-upload-card label:hover{
  border-color:#65517c;
  background:#e6efed;
}

.apply-job-page .apply-job-upload-card label > span{
  display:grid;
  place-items:center;
  flex:0 0 44px;
  width:44px;
  height:44px;
  border-radius:13px;
  color:#b4ece4;
  background:
    linear-gradient(
      145deg,
      #31565e,
      #65527a
    );
}

.apply-job-page .apply-job-upload-card label > div{
  min-width:0;
}

.apply-job-page .apply-job-upload-card strong{
  display:block;
  color:#2d4a50;
  font-size:.75rem;
}

.apply-job-page .apply-job-upload-card small{
  display:block;
  margin-top:4px;
  color:#718589;
  font-size:.62rem;
  line-height:1.45;
}

.apply-job-page .apply-job-file-name{
  display:block;
  margin-top:7px;
  color:#65517c;
  font-size:.62rem;
  font-weight:800;
}


/*==================================================
FORM NAVIGATION
==================================================*/

.apply-job-page .apply-job-form-actions{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-top:28px;
  padding-top:20px;
  border-top:1px solid rgba(60,96,101,.1);
}

.apply-job-page .apply-job-form-actions-right{
  display:flex;
  align-items:center;
  gap:10px;
}


/*==================================================
SIDE PANEL
==================================================*/

.apply-job-page .apply-job-side-panel{
  position:sticky;
  top:22px;
  display:grid;
  gap:18px;
  min-width:0;
}

.apply-job-page .apply-job-info-card{
  min-width:0;
  padding:22px;
  border:1px solid rgba(60,96,101,.13);
  border-radius:21px;
  background:
    linear-gradient(
      145deg,
      #edf4f2,
      #eee8f2
    );
  box-shadow:
    0 15px 32px
    rgba(44,73,76,.08);
}

.apply-job-page .apply-job-info-card h3{
  margin:0 0 10px;
  color:#294248;
  font-size:1rem;
}

.apply-job-page .apply-job-info-card > p{
  margin:0;
  color:#64797c;
  font-size:.73rem;
  line-height:1.65;
}

.apply-job-page .apply-job-info-list{
  display:grid;
  gap:10px;
  margin-top:16px;
}

.apply-job-page .apply-job-info-list > div{
  display:flex;
  align-items:flex-start;
  gap:10px;
  min-width:0;
  padding:11px;
  border:1px solid rgba(61,96,101,.1);
  border-radius:13px;
  background:rgba(255,255,255,.42);
}

.apply-job-page .apply-job-info-list i{
  margin-top:2px;
  color:#65517c;
}

.apply-job-page .apply-job-info-list span{
  color:#536c71;
  font-size:.69rem;
  line-height:1.5;
}

.apply-job-page .apply-job-security-card{
  padding:22px;
  border-radius:21px;
  color:#fff;
  background:
    radial-gradient(
      circle at 92% 8%,
      rgba(146,219,210,.19),
      transparent 31%
    ),
    linear-gradient(
      135deg,
      #304f58,
      #486a70 58%,
      #65517b
    );
  box-shadow:
    0 22px 54px
    rgba(40,67,70,.19);
}

.apply-job-page .apply-job-security-card > span{
  display:grid;
  place-items:center;
  width:52px;
  height:52px;
  margin-bottom:15px;
  border-radius:16px;
  color:#29454b;
  background:#9fe4db;
  font-size:1.15rem;
}

.apply-job-page .apply-job-security-card h3{
  margin:0 0 8px;
  color:#fff;
}

.apply-job-page .apply-job-security-card p{
  margin:0;
  color:rgba(255,255,255,.76);
  font-size:.72rem;
  line-height:1.65;
}


/*==================================================
DECLARATION
==================================================*/

.apply-job-page .apply-job-declaration{
  display:flex;
  align-items:flex-start;
  gap:11px;
  margin-top:20px;
  padding:14px;
  border:1px solid rgba(60,96,101,.12);
  border-radius:15px;
  background:rgba(255,255,255,.42);
}

.apply-job-page .apply-job-declaration input{
  flex:0 0 auto;
  margin-top:3px;
}

.apply-job-page .apply-job-declaration label{
  color:#566e73;
  font-size:.68rem;
  line-height:1.55;
}


/*==================================================
SUCCESS STATE
==================================================*/

.apply-job-page .apply-job-success{
  display:none;
  padding:58px 22px;
  text-align:center;
}

.apply-job-page .apply-job-success.active{
  display:block;
}

.apply-job-page .apply-job-success-icon{
  display:grid;
  place-items:center;
  width:76px;
  height:76px;
  margin:0 auto 18px;
  border-radius:24px;
  color:#d9fff8;
  background:
    linear-gradient(
      145deg,
      #2d715f,
      #58a68f
    );
  font-size:1.7rem;
}

.apply-job-page .apply-job-success h2{
  margin:0 0 9px;
  color:#294248;
}

.apply-job-page .apply-job-success p{
  max-width:560px;
  margin:0 auto 22px;
  color:#62777b;
  line-height:1.7;
}


/*==================================================
FOOTER
==================================================*/

.apply-job-page .apply-job-footer{
  color:#edf7f6;
  background:
    radial-gradient(
      circle at 88% 12%,
      rgba(108,195,187,.14),
      transparent 28%
    ),
    linear-gradient(
      145deg,
      #243942,
      #2d5059 50%,
      #514567
    );
}

.apply-job-page .apply-job-footer-main{
  padding:52px 0;
}

.apply-job-page .apply-job-footer-grid{
  display:grid;
  grid-template-columns:
    repeat(4,minmax(0,1fr));
  gap:28px;
}

.apply-job-page .apply-job-footer-column{
  min-width:0;
}

.apply-job-page .apply-job-footer-column h3{
  margin:0 0 16px;
  color:#fff;
  font-size:.95rem;
}

.apply-job-page .apply-job-footer-column nav{
  display:grid;
  gap:10px;
}

.apply-job-page .apply-job-footer-column a{
  color:rgba(255,255,255,.7);
  font-size:.72rem;
  line-height:1.5;
}

.apply-job-page .apply-job-footer-column a:hover{
  color:#9fe4dc;
}

.apply-job-page .apply-job-footer-bottom{
  padding:21px 0;
  border-top:1px solid rgba(255,255,255,.08);
}

.apply-job-page .apply-job-footer-bottom-inner{
  display:flex;
  align-items:center;
  justify-content:space-between;
  flex-wrap:wrap;
  gap:18px;
}

.apply-job-page .apply-job-footer-bottom p{
  margin:0;
  color:rgba(255,255,255,.62);
  font-size:.7rem;
}

.apply-job-page .apply-job-footer-bottom-links{
  display:flex;
  flex-wrap:wrap;
  gap:16px;
}

.apply-job-page .apply-job-footer-bottom-links a{
  color:rgba(255,255,255,.68);
  font-size:.68rem;
}


/*==================================================
MOBILE ACTIONS
==================================================*/

.apply-job-page .apply-job-mobile-actions{
  display:none;
}


/*==================================================
TABLET
==================================================*/

@media(max-width:1050px){

  .apply-job-page .apply-job-menu-toggle{
    display:block;
  }

  .apply-job-page .apply-job-navigation{
    position:fixed;
    top:0;
    right:0;
    z-index:1000;
    display:grid;
    align-content:start;
    gap:8px;
    width:min(88vw,390px);
    height:100dvh;
    padding:
      92px 22px
      calc(26px + env(safe-area-inset-bottom));
    overflow-y:auto;
    transform:translateX(105%);
    background:
      linear-gradient(
        145deg,
        #eaf3f1,
        #eee8f2
      );
    box-shadow:
      -22px 0 50px
      rgba(34,58,62,.2);
    transition:transform .3s ease;
  }

  .apply-job-page .apply-job-navigation.active{
    transform:translateX(0);
  }

  .apply-job-page .apply-job-navigation > a{
    width:100%;
    min-height:45px;
    display:flex;
    align-items:center;
    padding:0 12px;
    border-radius:11px;
    background:rgba(255,255,255,.42);
  }

  .apply-job-page .apply-job-hero-grid,
  .apply-job-page .apply-job-layout{
    grid-template-columns:1fr;
  }

  .apply-job-page .apply-job-side-panel{
    position:static;
    grid-template-columns:
      repeat(2,minmax(0,1fr));
  }

  .apply-job-page .apply-job-step-navigation{
    grid-template-columns:
      repeat(3,minmax(0,1fr));
  }

  .apply-job-page .apply-job-plan-grid{
    grid-template-columns:
      repeat(2,minmax(0,1fr));
  }

  .apply-job-page .apply-job-footer-grid{
    grid-template-columns:
      repeat(2,minmax(0,1fr));
  }

}


/*==================================================
MOBILE
==================================================*/

@media(max-width:768px){

  body.apply-job-page{
    padding-bottom:
      calc(
        74px +
        env(safe-area-inset-bottom)
      );
  }

  .apply-job-page .apply-job-topbar-inner{
    align-items:flex-start;
    flex-direction:column;
    gap:7px;
  }

  .apply-job-page .apply-job-topbar-links{
    flex-wrap:wrap;
  }

  .apply-job-page .apply-job-hero{
    padding:64px 0;
  }

  .apply-job-page .apply-job-hero h1{
    font-size:clamp(2.35rem,12vw,3.8rem);
    letter-spacing:-1.4px;
  }

  .apply-job-page .apply-job-hero-points{
    grid-template-columns:1fr;
  }

  .apply-job-page .apply-job-form-grid,
  .apply-job-page .apply-job-choice-grid,
  .apply-job-page .apply-job-upload-grid,
  .apply-job-page .apply-job-side-panel{
    grid-template-columns:1fr;
  }

  .apply-job-page .apply-job-step-navigation{
    grid-template-columns:
      repeat(2,minmax(0,1fr));
  }

  .apply-job-page .apply-job-plan-grid{
    grid-template-columns:1fr;
  }

  .apply-job-page .apply-job-form-actions{
    align-items:stretch;
    flex-direction:column;
  }

  .apply-job-page .apply-job-form-actions-right{
    display:grid;
    grid-template-columns:1fr;
  }

  .apply-job-page .apply-job-form-actions .apply-job-button{
    width:100%;
  }

  .apply-job-page .apply-job-mobile-actions{
    position:fixed;
    left:0;
    right:0;
    bottom:0;
    z-index:1100;
    display:grid;
    grid-template-columns:
      repeat(5,minmax(0,1fr));
    padding:
      7px 7px
      calc(7px + env(safe-area-inset-bottom));
    border-top:1px solid rgba(255,255,255,.08);
    background:rgba(37,58,66,.97);
    backdrop-filter:blur(18px);
    -webkit-backdrop-filter:blur(18px);
  }

  .apply-job-page .apply-job-mobile-actions a{
    display:grid;
    justify-items:center;
    gap:4px;
    min-width:0;
    padding:6px 0;
    color:#d9efec;
    font-size:.62rem;
  }

  .apply-job-page .apply-job-mobile-actions a > span{
    display:grid;
    place-items:center;
    width:39px;
    height:39px;
    border-radius:13px;
    background:rgba(255,255,255,.06);
  }

  .apply-job-page .apply-job-mobile-actions a.active{
    color:#9fe5dc;
  }

}


/*==================================================
SMALL MOBILE
==================================================*/

@media(max-width:540px){

  .apply-job-page .container{
    width:min(100% - 22px,1180px);
  }

  .apply-job-page .apply-job-header-inner{
    min-height:72px;
  }

  .apply-job-page .apply-job-brand-mark{
    flex-basis:46px;
    width:46px;
    height:46px;
  }

  .apply-job-page .apply-job-brand-mark img{
    width:40px;
    height:40px;
  }

  .apply-job-page .apply-job-brand-copy strong{
    font-size:1.08rem;
  }

  .apply-job-page .apply-job-form-card,
  .apply-job-page .apply-job-summary-card{
    padding:20px;
    border-radius:20px;
  }

  .apply-job-page .apply-job-step-navigation{
    grid-template-columns:1fr;
  }

  .apply-job-page .apply-job-step-button{
    display:flex;
    align-items:center;
    gap:10px;
    min-height:54px;
    text-align:left;
  }

  .apply-job-page .apply-job-step-button span{
    flex:0 0 32px;
    margin:0;
  }

  .apply-job-page .apply-job-footer-grid{
    grid-template-columns:1fr;
  }

  .apply-job-page .apply-job-footer-bottom-inner{
    justify-content:center;
    text-align:center;
  }

  .apply-job-page .apply-job-footer-bottom-links{
    justify-content:center;
  }

}


