@font-face { font-family: "Larken_Bold"; src: url("../assets/fonts/larken-bold.woff2") format("woff2"), url("../assets/fonts/larken-bold.woff") format("woff"); font-weight: normal; font-style: normal; font-display: swap; } @font-face { font-family: "Larken_Regular"; src: url("../assets/fonts/larken-regular.woff2") format("woff2"), url("../assets/fonts/larken-regular.woff") format("woff"); font-weight: normal; font-style: normal; font-display: swap; } @font-face { font-family: "Larken_Medium"; src: url("../assets/fonts/larken-medium.woff2") format("woff2"), url("../assets/fonts/larken-medium.woff") format("woff"); font-weight: normal; font-style: normal; font-display: swap; } @font-face { font-family: "Larken_Medium_Italic"; src: url("../assets/fonts/larken-medium-italic.woff2") format("woff2"), url("../assets/fonts/larken-medium-italic.woff") format("woff"); font-weight: normal; font-style: normal; font-display: swap; } @import url('https://fonts.googleapis.com/css2?family=Chivo:ital,wght@0,100..900;1,100..900&display=swap'); /* IMS Noida Brand LP — Vanilla CSS (mobile-first) */ :root { --color-orange: #BE9259; --color-gold: #eac875; --color-text: #000; --color-muted: #717171; --color-paragraph: #666666; --color-border: #dbdbdb; --color-white: #ffffff; --color-track: #ccc; --color-dots: #234016; --color-admission-track: var(--color-dots); --color-dark-bg: #1d3a13; --green-grad: linear-gradient(90.05deg, #274417 -19.5%, #5B7A32 21.17%, #3F5D21 69.5%, #1C3913 99.16%); ; --hero-grad-text: linear-gradient(180deg, #09331c 30%, #4b6f1e 89%); --testimonial-grad: linear-gradient(123.787deg, rgb(91, 122, 50) 1.18%, rgb(63, 93, 33) 39.94%, rgb(28, 57, 19) 93.37%); --font-display: "Larken_Regular"; --font-ui: "Chivo", sans-serif; --font-form-title: "Chivo", sans-serif; --font-form: "Chivo", sans-serif; --font-small: "Chivo", sans-serif; --max-content: 1720px; --radius-pill: 60px; --shadow-cta: 2px 2px 1px rgba(0, 0, 0, 0.25); --shadow-card: 4px 4px 24px rgba(0, 0, 0, 0.1); --swiper-theme-color: var(--color-orange); } *, *::before, *::after { box-sizing: border-box; } html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; } body.page { margin: 0; font-family: var(--font-ui); font-weight: 400; color: var(--color-text); background: var(--color-white); overflow-x: hidden; font-synthesis: none; } .u-skip:focus { position: fixed; z-index: 10000; left: 8px; top: 8px; padding: 12px; background: var(--color-orange); color: #fff; clip-path: none !important; width: auto; height: auto; } .u-visually-hidden { clip: rect(0 0 0 0); clip-path: inset(50%); height: 1px; width: 1px; overflow: hidden; position: absolute; } .u-mobile-only { display: block; } .u-desktop-only { display: none !important; } .blockNextLine { display: block; } .site-header { position: sticky; top: 0; z-index: 100; background: #fff; border-bottom: 1px solid transparent; transition: border-color 0.25s, box-shadow 0.25s; } .site-header.scrolled { border-color: #e5e7eb; box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08); } /* ── Banner Closing Strip ──────────────────────────────── */ .banner-closing-strip { display: inline-block; background-color: var(--color-orange); color: #fff; padding: clamp(8px, 2vw, 10px) clamp(12px, 3vw, 24px); border-radius: 6px; font-family: var(--font-ui); font-weight: 600; font-size: clamp(10px, 2.5vw, 18px); text-transform: uppercase; letter-spacing: 0.05em; margin-bottom: 24px; box-shadow: 0 4px 12px rgba(190, 146, 89, 0.3); white-space: nowrap; } .banner-closing-strip strong { font-weight: 800; font-size: 1.1em; } /* ── / Banner Closing Strip ────────────────────────────── */ /* ── Countdown Bar ────────────────────────────────────── */ .countdown-bar { background: #fff; border-bottom: 1px solid #f0f0f0; padding: 6px 0; } .countdown-bar__inner { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px; } .countdown-bar__label { font-family: var(--font-ui); font-weight: 700; font-size: clamp(12px, 3.2vw, 17px); color: #000; white-space: nowrap; letter-spacing: 0.01em; } .countdown-bar__timer { display: flex; align-items: center; gap: 4px; } .countdown-unit { display: flex; flex-direction: column; align-items: center; justify-content: center; background: var(--color-orange); border-radius: 5px; min-width: clamp(36px, 9vw, 58px); padding: 4px 6px 3px; } .countdown-unit__val { font-family: var(--font-ui); font-weight: 700; font-size: clamp(14px, 4vw, 22px); color: #fff; line-height: 1.15; letter-spacing: 0.02em; } .countdown-unit__lbl { font-family: var(--font-ui); font-size: clamp(7px, 1.8vw, 10px); font-weight: 600; color: rgba(255, 255, 255, 0.85); letter-spacing: 0.06em; text-transform: uppercase; line-height: 1.2; } .countdown-sep { font-family: var(--font-ui); font-weight: 700; font-size: clamp(14px, 4vw, 22px); color: var(--color-orange); line-height: 1; padding-bottom: 8px; align-self: center; } /* Tablet 768px+ */ @media (min-width: 768px) { .countdown-bar { padding: 7px 0; } .countdown-unit { min-width: 52px; padding: 5px 8px 4px; } } /* Desktop 1024px+ */ @media (min-width: 1024px) { .countdown-bar { padding: 8px 0; } .countdown-bar__inner { gap: 8px; } .countdown-unit { min-width: 58px; padding: 6px 10px 5px; border-radius: 6px; } } /* ── / Countdown Bar ──────────────────────────────────── */ .page__container { width: min(var(--max-content), 95%); margin-inline: auto; } .cta-button { display: inline-flex; align-items: center; justify-content: center; padding: 12px 24px; background: var(--color-orange); color: var(--color-white); font-family: var(--font-ui); font-weight: 700; font-size: clamp(14px, 4.2vw, 18px); line-height: 1.5; border: none; border-radius: 30px; box-shadow: var(--shadow-cta); cursor: pointer; text-decoration: none; } .cta-button--block { width: 100%; } .cta-button--wide { font-size: 20px; padding-inline: 32px; } @media (max-width: 1024px) { .cta-button, .cta-button--wide { font-size: 14px; } } /* Header */ .site-header { background: var(--color-white); border-bottom: 1px solid #f2f2f2; } .site-header__inner { display: flex; align-items: center; gap: 12px; min-height: 60px; padding-block: 10px; } .site-header__brand{ margin-right: auto; /* HEADER CTA RIGHT ALIGN (after countdown removed) */ } .site-header__apply{ text-transform: uppercase; } .site-header__logo { width: clamp(135px, 36vw, 496px); height: auto; } .site-header__nav { display: none !important; gap: clamp(14px, 2vw, 28px); flex: 1; justify-content: center; } .site-header__link { font-size: clamp(13px, 1.1vw, 16px); color: #1f1f1f; text-decoration: none; font-family: var(--font-ui); font-weight: 500; } .site-header__menu { position: relative; flex-shrink: 0; width: 44px; height: 44px; border: 0; padding: 0; background: none; cursor: pointer; } .site-header__menu-ring, .site-header__menu-icon { position: absolute; inset: 0; } .site-header__menu-icon { width: 24px !important; height: 24px !important; left: 50%; top: 50%; transform: translate(-50%, -55%); } .nav-drawer[hidden] { display: none; } .nav-drawer { position: fixed; inset: 0; z-index: 9000; background: rgba(0, 0, 0, 0.4); } .nav-drawer__panel { position: absolute; right: 0; top: 0; width: min(340px, 88vw); height: 100%; padding: 24px; background: #fff; box-shadow: -6px 0 24px rgba(0, 0, 0, 0.12); } .nav-drawer__list { list-style: none; margin: 0; padding: 0; display: grid; gap: 14px; font-family: var(--font-ui); } .nav-drawer__list a { color: #123; } /* Hero */ .section-hero { position: relative; isolation: isolate; padding-block: clamp(24px, 6vw, 48px); padding-inline: clamp(12px, 4vw, 50px); min-height: clamp(620px, 110vw, 700px); } .section-hero-wrapper{ background: url(../assets/images/banner_hero_2.webp) no-repeat center center/ auto 100%, url(../assets/images/banner_hero_1.webp) no-repeat center center/ cover; border-radius: clamp(22px, 2vw, 60px); } .section-hero__bg { position: absolute; inset: 0; z-index: -2; background-image: url("../assets/images/hero-banner-mobile.webp"); background-size: cover; background-position: top center; background-repeat: no-repeat; width: 95%; transform: translateX(-50%); left: 50%; border-radius: 50px; } .section-hero__grid { display: grid; gap: clamp(20px, 4vw, 40px); align-items: start; } .section-hero__copy { text-align: center; padding-inline: 20px; } .section-hero__title { margin: 0; font-family: var(--font-display); font-weight: 400; } .section-hero__line { display: block; font-size: clamp(26px, 7.3vw, 56px); line-height: 1.35; } .section-hero__line--accent { font-family: "Larken_Medium_Italic"; font-size: clamp(22px, 5.8vw, 40px); line-height: 1.35; } .section-hero__ugpg { font-size: clamp(30px, 8.4vw, 60px); font-family: var(--font-display); font-style: italic; font-weight: 600; } .section-hero__and { font-size: clamp(20px, 5.8vw, 40px); font-weight: 400; font-style: normal; } .section-hero__sub { margin: 12px 0 8px; font-family: var(--font-display); font-weight: 300; font-size: clamp(18px, 4.5vw, 32px); line-height: 1.45; } .section-hero__brand-mark { margin: 0; font-family: "Larken_Bold"; font-weight: 700; letter-spacing: 0.045em; font-size: clamp(30px, 8.8vw, 60px); background: linear-gradient(360deg, #09331C 30%, #4B6F1E 89.44%); -webkit-background-clip: text; background-clip: text; color: transparent; } /* .admission-card { background: linear-gradient( 228.26deg, rgba(255, 255, 255, 0) 36%, rgba(255, 255, 255, 0.75) 62% ); border: 1px solid #fff; border-radius: 16px; padding: clamp(18px, 4vw, 28px); box-shadow: 15px 10px 25px rgba(0, 0, 0, 0.15); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); max-width: 440px; margin-inline: auto; } .admission-card__title { margin: 0; font-family: var(--font-form-title); font-weight: 700; font-size: clamp(18px, 4.5vw, 24px); line-height: 1.4; } .admission-card__dek { margin: 4px 0 0; font-family: Poppins, sans-serif; font-size: clamp(13px, 3.8vw, 16px); line-height: 1.45; } .admission-form { margin-top: 16px; display: flex; flex-direction: column; gap: clamp(11px, 3vw, 15px); } .admission-field { width: 100%; min-height: 44px; padding: 10px 18px; border: 1px solid var(--color-border); border-radius: 7px; font-family: var(--font-form); font-size: clamp(13px, 3.9vw, 15px); color: var(--color-paragraph); background: #fff; } .admission-field--select { appearance: none; background-repeat: no-repeat; background-position: right 12px center; background-size: 16px; padding-right: 40px; background-image: url("../assets/icons/form-caret.svg"); } .admission-field--phone .admission-phone__input { border: none; flex: 1; outline: none; font-family: inherit; font-size: inherit; } .admission-field--phone { display: flex; align-items: center; padding: 0; gap: 0; } .admission-phone__country { display: flex; align-items: center; gap: 6px; padding: 0 10px 0 14px; border-right: 1px solid var(--color-track); } .admission-phone__caret { display: block; } .admission-form__row--split { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(10px, 3vw, 15px); } .admission-form__checks { display: flex; gap: 8px; align-items: flex-start; font-family: var(--font-form); font-size: clamp(13px, 3.9vw, 18px); color: var(--color-paragraph); } .admission-form__checks input { margin-top: 3px; flex-shrink: 0; } .admission-form__submit { width: fit-content; align-self: center; } .mobile-cta-bar { position: fixed; inset-inline: 0; bottom: 0; z-index: 8000; padding: 12px clamp(14px, 4vw, 20px); background: rgba(255, 255, 255, 0.96); border-top: 1px solid #eee; box-shadow: 0 -8px 24px rgba(0, 0, 0, 0.06); } */ /* Stats */ .section-stats { padding: 20px 0 40px; } .section-stats__inner { display: grid; gap: 0; align-items: center; border-radius: 20px; padding: 20px 50px; background-image: var(--green-grad); color: #fff; text-align: center; grid-template-columns: repeat(2, minmax(0, 1fr)); } .section-stats__inner.page__container { width: min(1876px, 95%); } .section-stats__item { padding: clamp(14px, 3vw, 20px); border-bottom: 1px solid rgba(255, 255, 255, 0.35); border-right: 1px solid rgba(255, 255, 255, 0.35); } .section-stats__value { margin: 0; font-family: var(--font-display); font-weight: 600; font-size: clamp(26px, 7vw, 38px); line-height: 1.2; } .section-stats__value-small { font-size: clamp(16px, 4.5vw, 20px); font-weight: 500; margin-inline-end: 4px; } .section-stats__label { margin: 4px 0 0; font-family: var(--font-ui); font-size: clamp(12px, 3.8vw, 20px); line-height: 1.35; } .section-stats__tnc { font-size: clamp(13px, 3.8vw, 16px); } /* Programs — shared */ .section-programs { padding-block: clamp(36px, 8vw, 100px); } .section-programs__heading { display: flex; flex-direction: column; gap: clamp(14px, 3vw, 26px); margin-bottom: clamp(24px, 5vw, 48px); } .section-programs__title-italic { margin: 0; font-family: var(--font-display); font-weight: 500; font-style: italic; font-size: clamp(32px, 8.5vw, 60px); line-height: 1.1; } .section-programs__title-plain { margin: 8px 0 0; font-family: var(--font-display); font-weight: 400; font-size: clamp(22px, 6.2vw, 40px); line-height: 1.2; } .section-programs__dek { margin: 0; font-family: var(--font-ui); font-size: clamp(14px, 3.5vw, 20px); line-height: 1.55; } .section-programs__toolbar { display: grid; grid-template-columns: 1fr auto auto 1fr; gap: clamp(10px, 2vw, 20px); align-items: center; justify-items: center; margin-bottom: clamp(24px, 5vw, 48px); } .section-programs__spacer { min-height: 1px; } .program-tab { font-family: var(--font-display); border-radius: var(--radius-pill); font-size: clamp(14px, 3vw, 28px); line-height: 1.35; padding: 10px clamp(14px, 3vw, 40px); cursor: pointer; border: 1px solid var(--color-gold); background: var(--color-white); color: var(--color-muted); box-shadow: var(--shadow-cta); transition: background 0.2s ease, color 0.2s ease; } .program-tab.program-tab--active { background: var(--color-orange); color: var(--color-white); border-color: var(--color-orange); } .program-tab:not(.program-tab--active) .program-tab:active { filter: brightness(0.95); } .section-programs__pg-note-box { margin-top: clamp(16px, 3vw, 28px); padding: 16px 18px; border-radius: 12px; border: 1px dashed var(--color-gold); font-family: var(--font-ui); font-size: clamp(14px, 3.8vw, 18px); line-height: 1.5; } .program-stack { display: grid; gap: clamp(10px, 2vw, 18px); } .card-program, a.card-program, a.card-program:link, a.card-program:visited, a.card-program:hover, a.card-program:focus, a.card-program:active { background: #f8f8f8; border-radius: 10px; display: flex; flex-direction: column; min-height: clamp(620px, 120vw, 730px); overflow: clip; text-decoration: none; color: var(--color-text); cursor: pointer; } a.card-program h3, a.card-program p, a.card-program li, a.card-program span { text-decoration: none; color: inherit; } .card-program__chrome { flex: 0 1 auto; } .card-program__heading { display: flex; align-items: center; gap: 10px; background: var(--color-white); margin-inline: clamp(-14px, -2vw, -24px); padding: 10px clamp(18px, 4vw, 40px); border-radius: 0; } .card-program__badge { width: clamp(52px, 12vw, 60px); height: clamp(52px, 12vw, 60px); border-radius: 50%; display: grid; place-items: center; background-image: var(--green-grad); } .card-program__badge img { width: clamp(28px, 7vw, 38px); height: clamp(28px, 7vw, 38px); } .card-program__cluster { margin: 0; font-family: var(--font-ui); font-weight: 600; text-transform: uppercase; font-size: clamp(20px, 4.5vw, 34px); } .card-program__degree { margin: clamp(12px, 2.5vw, 20px) 0 0 clamp(26px, 5vw, 40px); font-family: var(--font-ui); font-weight: 700; font-size: clamp(18px, 4vw, 28px); } .card-program__subs { margin: 10px 0 0 clamp(26px, 5vw, 40px); font-family: var(--font-display); font-weight: 500; font-style: italic; font-size: clamp(17px, 3.9vw, 24px); } .card-program__list { margin: 10px 0 0 clamp(26px, 5vw, 40px); padding: 0; list-style: none; font-family: var(--font-ui); font-size: clamp(13px, 3.8vw, 20px); line-height: 1.48; } .card-program__list li { position: relative; padding-left: 19px; margin-bottom: 4px; } .card-program__list li::before { content: ""; position: absolute; left: 0; top: 0.62em; width: clamp(6px, 1.8vw, 8px); height: clamp(6px, 1.8vw, 8px); border-radius: 50%; background: #09331c; } .card-program__list--law li::before { display: none; } .card-program__list--law li { position: relative; padding-left: 18px !important; } .card-program__bull { position: absolute; left: 0; top: 0.75em; width: 8px; height: 8px; border-radius: 50%; background: #09331c; } .card-program__photo { position: relative; margin-top: auto; aspect-ratio: 429 / 302; overflow: hidden; } /* CSS background-image variants for program cards */ .card-program__photo--management { background-image: url("../assets/images/program-card-management.webp"); background-size: cover; background-position: center; } .card-program__photo--it { background-image: url("../assets/images/program-card-it.webp"); background-size: cover; background-position: center; } .card-program__photo--journalism { background-image: url("../assets/images/program-card-journalism.webp"); background-size: cover; background-position: center; } .card-program__photo img { width: 100%; height: 100%; object-fit: cover; } .card-program__photo--law { display: block; background: #232323; background-image: url("../assets/images/program-card-law-accent.webp"), url("../assets/images/program-card-law.webp"); background-size: 123% 102%, 138% 104%; background-position: -13.5% 0, -22% -6%; background-repeat: no-repeat, no-repeat; mix-blend-mode: normal; } .card-program__photo--postmanagement { background-image: url("../assets/images/postProgram2.webp"); background-size: cover; background-position: center; } .card-program__post_mca{ background-image: url("../assets/images/postProgram1.webp"); background-size: cover; background-position: center; } /* Mobile: below 768px */ /* About */ .section-about { background: var(--color-dark-bg); padding-block: clamp(28px, 6vw, 80px); color: #111; } .section-about__shell { background: var(--color-white); border-radius: clamp(22px, 2vw, 40px); padding: clamp(22px, 2vw, 80px); } .section-about__cols { display: grid; gap: clamp(24px, 5vw, 40px); } .section-about__story { max-width: 52ch; } .section-about__title--split { margin: 0; font-family: var(--font-display); font-size: clamp(22px, 5.8vw, 40px); line-height: 1.38; font-weight: 400; } .section-about__title--since { margin: clamp(12px, 2vw, 28px) 0 0; font-family: "Larken_Medium"; font-weight: 400; font-size: clamp(30px, 8vw, 60px); line-height: 1; } .section-about__dek { margin-top: clamp(18px, 4vw, 40px); font-family: var(--font-ui); font-size: clamp(13px, 3.9vw, 20px); line-height: 1.54; } .section-about__visual-wrap { position: relative; } .section-about__visuals { display: none; gap: 16px; } .section-about__cols { grid-template-columns: minmax(0, 579px) minmax(320px, 1fr); align-items: end; position: relative; } .section-about__legacy { background: var(--color-orange); color: var(--color-white); padding: clamp(40px, 10vw, 106px) 15px clamp(24px, 5vw, 32px); border-radius: 16px; max-width: 279px; } .section-about__legacy-big { margin: 0; font-family: "Larken_Medium_Italic"; font-weight: 400; font-style: italic; font-size: clamp(46px, 12vw, 80px); line-height: 0.92; } .section-about__plus { font-style: normal; font-weight: 800; font-family: var(--font-display); } .section-about__legacy-label { margin: 14px 0 0; font-family: "Larken_Medium"; font-weight: 400; font-size: clamp(19px, 4.8vw, 34px); line-height: 1; } .section-about__slide { position: relative; margin: 0; border-radius: 12px; overflow: hidden; background-size: cover; background-position: center; background-repeat: no-repeat; min-height: 490px; } .section-about__slide--faculty { background-image: url("../assets/images/section-about-faculty.webp"); } .section-about__slide--campus { background-image: url("../assets/images/section-about-campus.webp"); } .section-about__slide img { width: 100%; height: 100%; object-fit: cover; } .section-about__figcaption { position: absolute; left: clamp(14px, 3vw, 20px); bottom: clamp(14px, 3vw, 28px); color: var(--color-white); font-family: "Larken_Medium"; font-weight: 400; font-size: clamp(18px, 4.5vw, 34px); line-height: 1.22; } .section-about__badge { display: none; } .section-about-mobile { margin-top: 24px; } .about-mob-banner { display: flex; gap: 10px; align-items: center; } .about-mob-legacy.section-about__legacy { flex: 0 1 136px; padding: 20px 10px; max-width: none; } .about-mob-legacy .section-about__legacy-big { font-size: clamp(28px, 8vw, 36px); } .about-mob-legacy .section-about__legacy-label { font-size: clamp(12px, 3.8vw, 16px); } .about-mob-badge { flex: 1; height: auto; max-height: 94px; object-fit: contain; } .about-mob-gallery { margin-top: 16px; display: grid; gap: 12px; } .about-mob-gallery__img { width: 100%; position: relative; overflow: hidden; display: flex; align-items: flex-end; padding: 10px; border-radius: 10px; background-size: cover; background-position: center; background-repeat: no-repeat; min-height: 200px; } .about-mob-gallery__img::before { content: ""; position: absolute; inset: 0; background: linear-gradient(0deg, rgba(0,0,0,0.7) 0%, rgba(0,0,0,0) 55%); } .about-mob-gallery__label { position: relative; z-index: 1; margin: 0; font-family: var(--font-display); font-weight: 600; font-size: clamp(14px, 4vw, 16px); line-height: 1.1; color: #fff; text-shadow: 0 2px 10px rgba(0,0,0,0.35); } .about-mob-gallery__img--1 { background-image: url("../assets/images/about-mobile-gallery-1.webp"); } .about-mob-gallery__img--2 { background-image: url("../assets/images/about-mobile-gallery-2.webp"); } .about-mob-gallery img { width: 100%; border-radius: 10px; object-fit: cover; } .section-about .u-mobile-only { margin-top: 16px; } /* Placement */ .section-placement { padding-block: clamp(30px, 6vw, 80px); overflow: hidden; } .section-placement__block { display: grid; gap: clamp(26px, 5vw, 48px); } .section-placement__h-italic { font-family: "Larken_Medium_Italic"; font-style: italic; font-weight: 500; margin: 0; font-size: clamp(26px, 6.5vw, 60px); line-height: 1; } .section-placement__h-plain { font-family: var(--font-display); margin: 10px 0 0; font-size: clamp(20px, 3.2vw, 40px); line-height: 1.25; text-transform: uppercase; } .section-placement__subtitle { margin: clamp(32px, 5vw, 48px) 0 clamp(16px, 3vw, 28px); text-align: center; font-family: var(--font-display); font-size: clamp(24px, 5.5vw, 40px); font-weight: 400; } .section-placement__lead p { margin: 14px 0 0; font-family: var(--font-ui); font-size: clamp(13px, 3.7vw, 20px); line-height: 1.55; } .placement-kpi-grid { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(14px, 3vw, 20px); background: transparent; } .placement-kpi-cell { padding: clamp(16px, 3vw, 22px) 10px; text-align: center; border-right: 5px solid var(--color-orange); background: #fff; min-height: 120px; display: flex; flex-direction: column; justify-content: center; gap: 6px; } .placement-kpi-cell strong { font-family: var(--font-display); font-weight: 500; font-size: clamp(28px, 6vw, 50px); line-height: 1; } .placement-kpi-cell span { font-family: var(--font-ui); font-size: clamp(13px, 3.5vw, 20px); line-height: 1.35; } .recruiter-grid--desktop { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 220px)); gap: clamp(12px, 2vw, 20px); justify-content: center; max-width: 1400px; margin-inline: auto; } .recruiter-chip { border-radius: 8px; box-shadow: var(--shadow-card); padding: clamp(18px, 3vw, 28px); background: rgba(255, 255, 255, 0.22); width: min(270px, 100%); display: flex; align-items: center; justify-content: center; min-height: 100px; } .recruiter-chip img { max-width: 100%; max-height: clamp(42px, 10vw, 55px); object-fit: contain; } .recruiter-swiper .swiper-slide { height: auto; width: 180px; } .recruiter-swiper { overflow: visible; padding-block: 4px; } .mou-card { background: var(--color-white); border-radius: 10px; box-shadow: 4px 4px 4px rgba(176, 181, 130, 0.2); padding: clamp(16px, 3vw, 20px); text-align: center; height: 100%; min-height: clamp(180px, 58vw, 285px); display: flex; flex-direction: column; align-items: center; gap: clamp(12px, 3vw, 24px); justify-content: space-between; } .mou-card img { max-width: clamp(180px, 30vw, 220px); height: auto; object-fit: contain; } .mou-card p { margin: 0; font-family: var(--font-ui); font-size: clamp(13px, 3.8vw, 20px); line-height: 1.42; } .mou-swiper { overflow: visible; padding-inline: clamp(12px, 3vw, 40px); margin-bottom: 32px; } .mou-swiper .swiper-slide { width: min(290px, 78vw); height: auto; } /* Admission */ .section-admission { padding-block: clamp(40px, 5vw, 60px) clamp(28px, 4vw, 40px); } .section-admission h2 { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin: 0 0 clamp(32px, 6vw, 60px); font-size: clamp(20px, 5vw, 40px); line-height: 1.5; } .section-admission__italic { font-family: var(--font-display); font-style: italic; margin-right: 0; } .section-admission__plain { font-family: var(--font-display); font-weight: 400; } .admission-timeline { display: flex; gap: clamp(6px, 1vw, 12px); align-items: flex-start; justify-content: space-between; width: 100%; } .admission-step-wrap { flex: 1; display: flex; flex-direction: column; align-items: center; min-width: 0; } .admission-step-graphic { display: flex; align-items: center; gap: clamp(3px, 1.2vw, 10px); width: 100%; } @media (max-width: 768px) { .admission-step-graphic { gap: clamp(3px, 1.2vw, 5px); width: 100%; } } .admission-step-ring { flex-shrink: 0; width: clamp(116px, 12vw, 180px); height: clamp(116px, 12vw, 180px); border-radius: 50%; display: grid; place-items: center; padding: clamp(14px, 2.5vw, 18px); background-image: var(--green-grad); } .admission-step-ring img { width: clamp(72px, 10vw, 95px); height: clamp(72px, 10vw, 95px); object-fit: contain; background: #ffffffde; border-radius: 9999px; } .admission-track { flex: 1; min-width: 8px; height: 0; align-self: center; margin-top: 0; border-top: 2px dashed var(--color-dots); } .admission-step-wrap--end .admission-track { display: none; } .admission-step-copy { align-self: flex-start; box-sizing: border-box; display: flex; flex-direction: column; align-items: center; gap: 0; padding: clamp(14px, 2vw, 24px) 0 0; text-align: center; width: clamp(116px, 12vw, 180px); } .admission-step-wrap--end .admission-step-copy { padding-top: clamp(14px, 2.6vw, 28px); } .admission-step-ring.sm { display: flex; flex-direction: row; gap: clamp(14px, 4vw, 28px); align-items: center; padding: 0; margin: 0; border-radius: 0; } .admission-step-ring.sm img { border-radius: 50%; background-image: var(--green-grad); padding: 12px; } .mob-step-text span { display: block; font-size: clamp(10px, 2.9vw, 18px); color: var(--color-text); font-family: var(--font-ui); } .mob-step-text strong { display: block; font-family: var(--font-display); font-size: clamp(16px, 4.8vw, 24px); font-weight: 400; } .admission-steps-mobile { list-style: none; padding: 0; margin: 0; } .admission-dots { display: block; width: min(240px, 88vw); margin: clamp(14px, 4vw, 22px) auto 0; border: 0; border-top: 2px dashed var(--color-dots); opacity: 0.55; background: transparent; } .admission-steps-mobile li { display: flex; flex-direction: column; } .admission-steps-mobile>li:last-child .admission-dots { display: none; } .step-line1 { margin: 0; width: 100%; font-family: var(--font-ui); font-size: clamp(12px, 2.5vw, 18px); line-height: 1.5; text-align: center; } .step-line2 { margin: 0; width: 100%; font-family: var(--font-display); font-weight: 400; font-size: clamp(16px, 3.5vw, 24px); line-height: 1.5; text-align: center; } /* Campus */ .section-campus { overflow-x: clip; } .section-campus__head { text-align: center; padding-bottom: clamp(18px, 4vw, 40px); } .section-campus__head h2 { margin: 0 0 clamp(14px, 3vw, 24px); font-size: clamp(20px, 6vw, 40px); line-height: 1.38; } .section-campus__plain { font-family: var(--font-display); } .section-campus__accent { font-family: var(--font-display); font-style: italic; font-weight: 500; } .section-campus__head p { margin: 0 auto; font-family: var(--font-ui); font-size: clamp(13px, 3.9vw, 20px); line-height: 1.53; } /* ── Scroll-driven campus slider ── */ .campus-scroll-slider { --count: var(--slide-count, 5); --large-w: clamp(300px, 38vw, 560px); --large-h: clamp(320px, 44vw, 600px); --small-w: clamp(140px, 18vw, 284px); --small-h: clamp(160px, 20vw, 290px); --gap: 20px; position: relative; height: calc(100vh + (var(--count) - 1) * 100vh); } .campus-scroll-sticky { position: sticky; top: 0; height: 100vh; display: flex; align-items: center; justify-content: center; overflow: hidden; } .campus-slider-shell { width: 100%; display: flex; flex-direction: column; align-items: center; gap: clamp(24px, 4vw, 40px); } .campus-slider-stage { position: relative; width: 100%; height: var(--large-h); display: flex; align-items: center; justify-content: center; } /* Background small-slide swiper */ .campus-swiper-bg { position: absolute; top: 50%; left: 0; right: 0; width: 100%; transform: translateY(-50%); z-index: 1; overflow: visible; } .campus-swiper-bg .swiper-wrapper { align-items: center; will-change: transform; transition: none !important; } .campus-swiper-bg .swiper-slide { width: var(--small-w); height: var(--small-h); flex-shrink: 0; transition: opacity 0.3s ease; } .campus-slide-small { width: 100%; height: 100%; border-radius: 8px; overflow: hidden; box-shadow: 0 4px 15px rgba(0, 0, 0, 0.12); } .campus-slide-small img { width: 100%; height: 100%; object-fit: cover; display: block; } /* Center large-slide wrapper */ .campus-center-wrap { position: relative; width: var(--large-w); height: var(--large-h); z-index: 2; overflow: hidden; } .campus-swiper-center { width: 100%; height: 100%; } .campus-swiper-center .swiper-wrapper { will-change: transform; transition: none !important; } .campus-swiper-center .swiper-slide { width: var(--large-w); height: var(--large-h); flex-shrink: 0; } .campus-slide-large { width: 100%; height: 100%; } .campus-slide-large img { width: 100%; height: 100%; object-fit: cover; display: block; } /* Dashed focus frame */ .campus-focus-frame { position: absolute; inset: 0; border: 2px dashed rgba(0, 0, 0, 0.4); border-radius: 4px; pointer-events: none; z-index: 3; } /* Scroll hint */ .campus-scroll-hint { display: flex; align-items: center; justify-content: center; gap: 12px; opacity: 1; transition: opacity 0.4s ease; } .campus-scroll-hint.hide { opacity: 0; } .campus-scroll-hint__icon { width: clamp(40px, 7vw, 48px); height: clamp(40px, 7vw, 48px); border-radius: 50%; background: var(--color-orange); color: #fff; display: grid; place-items: center; animation: campusBounce 2s ease-in-out infinite; flex-shrink: 0; } @keyframes campusBounce { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-7px); } } .campus-scroll-hint__label { font-family: var(--font-ui); font-weight: 700; font-size: clamp(13px, 2.5vw, 16px); letter-spacing: 0.05em; color: var(--color-text); } /* Mobile: collapse scroll height, show as simple single swiper */ /* Testimonials */ .section-testimonials { background-image: var(--testimonial-grad); color: var(--color-white); padding-top: clamp(40px, 7vw, 60px); } .section-testimonials .page__container { padding-bottom: 0; } .section-testimonials-head h2 { text-align: center; margin: 0 auto clamp(28px, 5vw, 40px); font-family: var(--font-display); font-size: clamp(18px, 5.2vw, 40px); line-height: 1.32; font-weight: 400; } .section-testimonials-head em { font-style: italic; } .testimonial-card { position: relative; background: #28571733; border-radius: 20px; padding: clamp(32px, 6vw, 60px) clamp(20px, 4vw, 37px); min-height: 0; height: auto; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: clamp(24px, 5vw, 40px); box-sizing: border-box; } .testimonial-card__deco { display: none; } .testimonial-card__quote { margin: 0; font-family: var(--font-ui); font-weight: 200; font-size: clamp(14px, 3.8vw, 18px); line-height: 1.5; text-align: center; } .testimonial-card__foot { margin: 0; padding: 0; text-align: center; } .testimonial-card__author { display: block; font-family: var(--font-display); font-style: normal; font-weight: 300; font-size: clamp(20px, 4.5vw, 28px); line-height: 1.5; } .testimonial-card__meta { margin: 6px 0 0; font-family: var(--font-display); font-size: clamp(14px, 3.8vw, 20px); line-height: 1.5; } .section-testimonials__nav { display: flex; justify-content: center; gap: 20px; margin: clamp(18px, 4vw, 40px) 0 clamp(28px, 5vw, 60px); } .testimonial-nav { border: 0; background: none; padding: 0; cursor: pointer; width: clamp(30px, 6vw, 40px); height: clamp(30px, 6vw, 40px); } .testimonial-nav img { width: 100%; height: 100%; object-fit: contain; display: block; } /* Closing CTA */ .closing-cta { position: relative; border-radius: clamp(22px, 4vw, 40px); overflow: hidden; min-height: clamp(320px, 86vw, 792px); display: flex; align-items: flex-start; justify-content: center; padding: clamp(40px, 8vw, 40px) clamp(16px, 4vw, 48px); margin-bottom: 40px; } .closing-cta__photo { position: absolute; inset: 0; width: 100%; height: 100%; background-image: url("../assets/images/closing-cta-mobile-bg.webp"); background-size: cover; background-position: center top; background-repeat: no-repeat; } .closing-cta__overlay { position: absolute; inset: 0; background: linear-gradient(180deg, #000 0.2%, rgba(0, 0, 0, 0) 36%); pointer-events: none; } @media (max-width: 768px) { .closing-cta__overlay { position: absolute; inset: 0; background: linear-gradient(180deg, #000 0.2%, rgb(0 0 0 / 38%) 36%); pointer-events: none; } } .closing-cta__content { position: relative; z-index: 1; text-align: center; } .closing-cta__title { margin: 0 0 clamp(18px, 4vw, 28px); font-family: var(--font-display); font-size: clamp(22px, 6.2vw, 40px); line-height: 1.35; color: var(--color-white); } .closing-cta__title .italic { font-style: italic; font-weight: 500; } .site-footer { background-image: var(--green-grad); color: var(--color-white); text-align: center; padding: 18px 12px; font-family: Poppins, sans-serif; font-size: clamp(14px, 3.8vw, 18px); line-height: 1.35; } .site-footer p { margin: 0; } body:has(.mobile-cta-bar) { padding-bottom: 72px; } .mobile-cta-bar { position: fixed; left: 0; bottom: 10px; z-index: 999; width: 100%; display: flex; } /* formContainer CsS */ main { position: relative; } .formContainer{ position: absolute; width: 450px; right: 5%; top: 60px; z-index: 99; border: 1px solid #ffffff; background: linear-gradient(221.63deg, rgba(255, 255, 255, 0) -36.01%, rgba(255, 255, 255, 0.75) 61.74%); backdrop-filter: blur(25px); box-shadow: 15px 10px 25px 0px #00000026; border-radius: 20px; overflow: hidden; } .formHeader{ padding: 10px; } .formContainer h3{ font-weight: 700; font-style: Bold; font-size: 24px; leading-trim: NONE; line-height: 120%; letter-spacing: 0%; margin-bottom: 0; font-family: var(--font-display); margin-top: 0; } .formContainer p{ font-weight: 400; font-style: Regular; font-size: 16px; leading-trim: NONE; line-height: 140%; letter-spacing: 0%; margin: 0; } .thankyouContainer{ min-height: 80vh; display:flex; align-items: center; justify-content: center; flex-direction: column; padding: 20px; } .thankyouContainer h2{ font-size: 50px; margin-bottom: 0; } .thankyouContainer p{ font-size: 20px; } #panel-ug[hidden], #panel-pg[hidden], #programs-postgrad-help[hidden] { display: none; } .logo-section { padding: 1.5rem 0; overflow: hidden; } .logo-section .swiper { width: 100%; overflow: hidden; padding: 20px 0} .logo-section .swiper-wrapper { align-items: center;} /* Linear marquee transitions — avoids ease-out stall between autoplay steps */ .logo-section .swiper-row1 .swiper-wrapper, .logo-section .swiper-row2 .swiper-wrapper { transition-timing-function: linear !important; } .logo-section .swiper-slide { display: flex; align-items: center; justify-content: center; background: #fff; border-radius: 8px; padding: 10px 18px; height: 100px; width: 270px !important; } .logo-section .swiper-slide img { max-width: 100%; object-fit: contain; box-shadow: 4px 4px 24px 0px #0000001A; border-radius: 8px; } .logo-section .row-gap { height: 0px; } .marquee-wrapper { width: 100%; overflow: hidden; display: flex; flex-direction: column; gap: 14px; /* Fade edges */ -webkit-mask-image: linear-gradient( to right, transparent 0%, black 8%, black 92%, transparent 100% ); mask-image: linear-gradient( to right, transparent 0%, black 8%, black 92%, transparent 100% ); } /* ── One marquee row ── */ .marquee-row { display: flex; width: max-content; will-change: transform; } /* Row 1 → left */ .marquee-row--ltr { animation: marquee-ltr 35s linear infinite; } /* Row 2 → right */ .marquee-row--rtl { animation: marquee-rtl 38s linear infinite; } /* Pause on hover */ .marquee-wrapper:hover .marquee-row { animation-play-state: paused; } /* ── Logo pill ── */ .logo-pill { display: flex; align-items: center; justify-content: center; width: auto; max-height: 100px; margin: 20px 16px; background: #ffffff; border-radius: 8px; cursor: default; border: 1.5px solid #e2e8f0; box-shadow: 0 2px 8px rgba(0,0,0,0.07); transition: box-shadow 0.25s ease, transform 0.25s ease, border-color 0.25s ease; flex-shrink: 0; } .logo-pill img { width: 100%; display: block; /* Greyscale → color on hover of the pill */ filter: grayscale(40%); transition: filter 0.25s ease; } .logo-pill:hover img { filter: grayscale(0%); } /* ── Keyframes ── */ @keyframes marquee-ltr { 0% { transform: translateX(0); } 100% { transform: translateX(-50%); } } @keyframes marquee-rtl { 0% { transform: translateX(-50%); } 100% { transform: translateX(0); } } /* ── Fallback placeholder when image missing ── */ .logo-pill img[src=""], .logo-pill img:not([src]) { visibility: hidden; } /* --- Mobile-first breakpoints (min-width) --- */ /* Tablet and up */ @media (min-width: 768px) { .u-mobile-only { display: none !important; } .u-desktop-only { display: revert !important; } .site-header__inner { min-height: 120px; } .site-header__nav { display: flex !important; } .section-stats__item { border-right: 1px solid #fff; border-bottom: 0; } .section-stats__item--last { border-right: none; } .section-about__visuals { grid-template-columns: clamp(260px, 28vw, 279px) minmax(0, 429px) minmax(0, 429px); align-items: end; justify-content: flex-end; display: grid; } .admission-steps-mobile { display: none !important; } .closing-cta__photo { background-image: url("../assets/images/closing-cta-background.webp"); } body:has(.mobile-cta-bar) { padding-bottom: 0; } } /* Small desktop and up */ @media (min-width: 900px) { .section-placement__block { grid-template-columns: minmax(260px, 1fr) minmax(300px, 650px); align-items: flex-start; gap: clamp(32px, 6vw, 145px); padding-inline: clamp(0px, 6vw, 90px); justify-content: center; } } /* Desktop and up */ @media (min-width: 992px) { .section-about__badge { display: block; position: absolute; width: clamp(120px, 18vw, 193px); height: auto; left: clamp(140px, 18vw, 167px); top: clamp(-52px, -8vw, -32px); z-index: 2; pointer-events: none; } .section-about-mobile { display: none !important; } .section-about .u-mobile-only { display: none !important; } } @media (max-width: 991px) { .section-about__cols { display: unset; } .campus-scroll-slider { height: auto; } .campus-scroll-sticky { display: contents; } .campus-slider-shell { padding-block: clamp(16px, 5vw, 32px); padding-inline: 2.5%; align-items: stretch; } .campus-slider-stage { display: block; height: auto; overflow: visible; } .campus-swiper-bg { display: block; position: relative; top: auto; transform: none; width: 100%; margin-bottom: clamp(12px, 3vw, 20px); } .campus-swiper-bg .swiper-wrapper { transition: transform 0.3s ease !important; } .campus-swiper-bg .swiper-slide { width: auto; height: clamp(130px, 22vw, 200px); } .campus-center-wrap { display: none !important; } .campus-focus-frame { display: none; } .campus-scroll-hint { display: none !important; } } @media (min-width: 992px) { .campus-scroll-slider { height: calc(100vh + (var(--slide-count, 5) - 1) * 100vh); } .campus-scroll-sticky { display: flex; position: sticky; top: 0; height: 100vh; align-items: center; justify-content: center; overflow: hidden; } .campus-slider-shell { padding-block: 0; } .campus-slider-stage { position: relative; display: flex; align-items: center; justify-content: center; width: 100%; height: var(--large-h); overflow: hidden; } .campus-swiper-bg { position: absolute; top: 50%; left: 0; right: 0; width: 100%; transform: translateY(-50%); margin-bottom: 0; z-index: 1; } .campus-swiper-bg .swiper-wrapper { transition: none !important; } .campus-swiper-bg .swiper-slide { width: var(--small-w); height: var(--small-h); } .campus-center-wrap { display: block; position: relative; width: var(--large-w); height: var(--large-h); z-index: 2; } .campus-swiper-center .swiper-slide { width: var(--large-w); height: var(--large-h); } .campus-focus-frame { display: block; } } @media (max-width: 767px) { .campus-swiper-bg .swiper-slide { height: clamp(110px, 32vw, 160px); } } /* Desktop and up */ @media (min-width: 1025px) { .section-hero__bg { background-image: url("../assets/images/hero-banner.webp"); } } @media (max-width: 767px) { .program-grid--desktop { display: flex; flex-direction: column; gap: 16px; } } @media (min-width: 768px) { .program-grid--desktop { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; } } /* Wide tablet / desktop and up */ @media (min-width: 1080px) { .section-hero__grid { grid-template-columns: minmax(0, 1fr) minmax(340px, 470px); align-items: center; gap: clamp(24px, 3vw, 80px); } .section-hero__copy { text-align: left; padding-inline: 50px; padding-block: 156px; } .admission-card { margin-inline: 0; } .program-grid--desktop { grid-template-columns: repeat(4, minmax(0, 1fr)); } .program-stack { display: none; } .testimonial-card__deco { display: block; position: absolute; left: -40px; top: 0; width: min(360px, 70vw); opacity: 0.25; pointer-events: none; } .testimonial-card__quote { font-size: 18px; line-height: 1.5; } .testimonial-card__foot { margin: 0; padding: 0; } .testimonial-card__author { font-size: 28px; line-height: 1.5; } .testimonial-card__meta { font-size: clamp(14px, 3.8vw, 20px); line-height: 1.5; } .testimonial-swiper { overflow: visible; } .testimonial-swiper .swiper-slide { height: auto; } .testimonial-swiper .swiper-slide { width: calc(33.333% - 14px); } .section-testimonials-head h2 { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px 10px; } } /* Desktop and up */ @media (min-width: 1100px) { .recruiter-grid--desktop { grid-template-columns: repeat(5, 1fr); } } /* Large desktop and up */ @media (min-width: 1280px) { .section-stats__inner { grid-template-columns: repeat(6, minmax(0, 1fr)); } .section-programs__heading { flex-flow: row wrap; justify-content: space-between; align-items: flex-end; } .section-programs__dek { max-width: clamp(460px, 52vw, 1028px); } } /* ========================================================================== Responsive styles Organized breakpoint-wise: max-width (large → small), then min-width ========================================================================== */ /* --- Desktop / tablet down (max-width) --- */ /* Large desktop down */ @media (max-width: 1600px) { .formContainer { width: 410px; } .section-hero { min-height: 562px; } .section-hero-wrapper { background-size: auto 80%, cover; background-position: center bottom, center center; min-height: 650px; } .section-hero__copy { padding-block: 86px; padding-inline: 22px; } .section-hero__line { font-size: clamp(24px, 6.2vw, 35px); } .section-hero__ugpg { font-size: clamp(32px, 8.4vw, 43px); } .section-stats__inner { padding: 5px 5px; } .section-stats__value { font-size: 30px; } .section-stats__label { font-size: 17px; } .section-programs { padding: 43px 0; } .card-program__cluster { font-size: 26px; } .card-program__degree { font-size: 22px; } .card-program__subs { font-size: 19px; } .card-program__list { font-size: 17px; } .card-program__heading { padding: 11px 22px; } .card-program { min-height: 626px; } .section-programs__dek { max-width: 86vw; } .section-about__title--split { font-size: 35px; } .section-about__cols { grid-template-columns: minmax(0, 518px) minmax(346px, 1fr); } .section-about__slide { min-height: 400px; } .section-about__visuals { grid-template-columns: clamp(112px, 16vw, 301px) minmax(0, 463px) minmax(0, 463px); } .section-about__legacy { max-width: 220px; padding: 32px 16px 26px; } .section-about__legacy-big { font-size: 73px; } .section-about__legacy-label, .section-about__figcaption { font-size: 26px; } .recruiter-chip { width: min(200px, 100%); } } @media (max-width: 1440px) { .formContainer{ width: 380px; } .section-hero{ min-height: 520px; } .section-hero-wrapper { background-size: auto 60%, cover; background-position: center bottom, center center; } .section-hero__copy{ padding-block: 80px; padding-inline: 20px; } .section-hero__line{ font-size: clamp(22px, 6.2vw, 32px); } .section-hero__ugpg{ font-size: clamp(30px, 8.4vw, 40px); } .section-stats__inner{ padding: 5px 5px; } .section-stats__value{ font-size: 28px; } .section-stats__label{ font-size: 16px; } .section-programs{ padding: 40px 0; } .card-program__cluster{ font-size: 24px; } .card-program__degree{ font-size: 20px; } .card-program__subs{ font-size: 18px; } .card-program__list{ font-size: 16px; } .card-program__heading{ padding: 10px 20px; } .card-program{ min-height: 580px; } .section-programs__dek{ max-width: 80vw; } .section-about__title--split{ font-size: 32px; } .section-about__cols{ grid-template-columns: minmax(0, 480px) minmax(320px, 1fr); } .section-about__slide{ min-height: 370px; } .section-about__visuals{ grid-template-columns: clamp(104px, 16vw, 279px) minmax(0, 429px) minmax(0, 429px); } .section-about__legacy{ max-width: 204px; padding: 30px 15px 24px; } .section-about__legacy-big{ font-size: 68px; } .section-about__legacy-label, .section-about__figcaption{ font-size: 24px; } .section-placement { padding-block: 2vw; } .section-placement__lead p { font-size: 16px; } .section-placement__block { padding-inline: 0; gap: 2vw; } } @media (max-width: 1280px) { .section-stats__item { border-bottom: none; border-right: none; margin-bottom: 10px; } /* Header buttons at 1280px */ .site-header__apply { font-size: 13px; padding: 9px 16px; } /* Countdown timer in header at 1280px */ .countdown-bar__inner { gap: 5px; } .countdown-unit__val { font-size: 14px; } .countdown-unit__lbl { font-size: 7px; } .countdown-bar__label { font-size: 11px; } .countdown-sep { font-size: 14px; } .countdown-unit { min-width: 36px; padding: 4px 6px 3px; } .admission-step-ring { flex-shrink: 0; width: clamp(100px, 10vw, 180px); height: clamp(100px, 10vw, 180px); } .admission-step-ring img { width: clamp(72px, 10vw, 80px); height: clamp(72px, 10vw, 80px); } .admission-step-wrap { align-items: stretch; } .admission-step-graphic { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; width: 100%; } .admission-step-copy { width: 100%; max-width: 100%; align-self: stretch; margin-inline: 0; padding-inline: 2px; box-sizing: border-box; } .admission-step-copy .step-line1, .admission-step-copy .step-line2 { overflow-wrap: break-word; word-break: normal; } .step-line2 { font-size: 20px; } } /* Desktop down */ @media (max-width: 1200px) { .section-about__cols { grid-template-columns: minmax(0, 1fr) minmax(320px, 600px); align-items: end; position: relative; } .section-about__title--split{ font-size: 32px; } .section-about__title--since{ font-size: 40px; } .section-about__dek{ font-size: 16px; } .section-about__legacy{ max-width: 180px; } .section-about__visuals{ grid-template-columns:clamp(170px, 28vw, 170px) minmax(0, 429px) minmax(0, 429px) } .section-about__slide{ min-height: 390px; } .section-about__badge{ width: 148px; top: -18px; } .section-about__figcaption, .section-about__legacy-label{ font-size: 20px; } .section-about__legacy-big { font-size: 58px; } .section-about__legacy-label{ font-size: 18px; } .section-about__legacy{ padding-top: 40px; } } /* Tablet landscape down */ @media (max-width: 1100px) { .section-hero-wrapper { padding-bottom: 400px; background-size: auto 400px, cover; background-position: center bottom, center center; } } /* Tablet down */ @media (max-width: 1080px) { .formContainer{ position: unset; width: 95%; margin: 0 auto; max-width: 400px; } .admission-timeline { gap: clamp(2px, 0.4vw, 6px); } .admission-step-ring img { width: clamp(40px, 10vw, 60px); height: clamp(40px, 10vw, 60px); } .step-line1 { font-size: 14px; } .step-line2 { font-size: 18px; } } /* Tablet portrait / small tablet */ @media (max-width: 768px) { .section-hero__copy { padding-block: 30px; } .section-hero-wrapper { padding-bottom: 340px; background-size: auto 320px, cover; background-position: center bottom, center center; } .placement-kpi-cell { border-left: none; } .section-admission { padding-block: 40px; padding-inline: 20px; } .section-admission .page__container { width: 100%; max-width: none; margin-inline: 0; } .section-admission h2 { font-size: 20px; line-height: 1.5; margin-bottom: 32px; } .admission-timeline { flex-direction: column; align-items: stretch; gap: 0; overflow-x: visible; padding-bottom: 0; position: relative; } .admission-timeline::before { content: ""; position: absolute; border-left: 2px dashed var(--color-admission-track); width: 0; height: calc(100% - 120px); left: 40px; top: 60px; z-index: 0; } .admission-step-wrap { display: flex; flex: 0 0 auto; flex-direction: row; align-items: center; gap: 20px; width: 100%; min-width: 0; position: relative; z-index: 1; } .admission-step-wrap:not(:last-child) { margin-bottom: 40px; } .admission-track { display: none; } .admission-step-graphic { flex-shrink: 0; width: auto; display: flex; align-items: center; } .admission-step-ring { width: 80px; height: 80px; padding: 10px; box-sizing: border-box; } .admission-step-ring img { width: 40px; height: 40px; } .admission-step-copy { flex: 1; align-self: center; align-items: flex-start; width: auto; max-width: none; margin-inline: 0; padding: 0 10px; text-align: left; display: flex; flex-direction: column; gap: 10px; justify-content: center; box-sizing: border-box; } .admission-step-copy .step-line1, .admission-step-copy .step-line2 { width: 100%; text-align: left; } .admission-step-copy .step-line1 { font-size: 16px; line-height: 1.5; } .admission-step-copy .step-line2 { font-size: 20px; line-height: 1.5; } .admission-step-wrap--end .admission-step-copy { padding: 0 10px; } .testimonial-card blockquote { margin: 0; } .logo-pill { width: auto; max-height: 70px; } .logo-pill img{ max-height: 60px; } .section-about__slide { min-height: 245px; } } /* About: horizontal 3-card row on small tablets */ @media (min-width: 520px) and (max-width: 767px) { .section-about-mobile { display: none !important; } .section-about__shell { display: flex; flex-direction: column; gap: clamp(20px, 4vw, 28px); } .section-about__cols { display: contents; } .section-about__copy { order: 1; } .section-about .section-about__dek.u-mobile-only { order: 2; margin-top: 0; } .section-about__visual-wrap { order: 3; width: 100%; } .section-about__visuals { display: grid !important; grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr) minmax(0, 1.15fr); align-items: end; gap: clamp(8px, 1.5vw, 12px); } .section-about__legacy { max-width: none; width: 100%; padding: clamp(24px, 5vw, 32px) clamp(12px, 2vw, 16px) clamp(18px, 3vw, 24px); } .section-about__legacy-big { font-size: clamp(36px, 8vw, 52px); } .section-about__legacy-label, .section-about__figcaption { font-size: clamp(14px, 3vw, 18px); } .section-about__slide { min-height: 245px; } .section-about__badge { display: none; } } /* Mobile */ @media (max-width: 767px) { .admission-field--select { background-image: url("../assets/icons/form-caret-mobile.svg"); } .section-stats__item:nth-last-child(-n + 2) { border-bottom: none; } .section-stats__item { border-bottom: none; border-right: none; margin-bottom: 10px; } .section-stats__item:nth-child(odd) { border-right: 2px solid rgba(255, 255, 255, 0.685); } /* Card layout: image on top, content below */ .card-program { flex-direction: column; min-height: unset; border-radius: 12px; } /* Photo sits on top */ .card-program__photo { order: -1; margin-top: 0; aspect-ratio: 16 / 9; border-radius: 12px 12px 0 0; } /* Chrome (text content) padding */ .card-program__chrome { padding: clamp(14px, 4vw, 20px); } /* Header bar full width */ .card-program__heading { margin-inline: clamp(-14px, -4vw, -20px); padding-inline: clamp(14px, 4vw, 20px); } /* Degree, subs, list — reduce left indent */ .card-program__degree, .card-program__subs, .card-program__list { margin-left: 12px; } .card-program__cluster { font-size: clamp(18px, 5vw, 24px); } .card-program__degree { font-size: clamp(16px, 4.5vw, 22px); } .card-program__subs { font-size: clamp(14px, 4vw, 18px); } .card-program__list { font-size: clamp(13px, 3.5vw, 16px); } /* Tab toolbar: stack buttons */ .section-programs__toolbar { grid-template-columns: 1fr 1fr; grid-template-rows: auto auto; } .section-programs__spacer { display: none; } .program-tab { width: 100%; font-size: clamp(13px, 3.8vw, 16px); padding: 10px 12px; text-align: center; } .recruiter-swiper { overflow: visible; } .recruiter-swiper .swiper-slide { width: clamp(120px, 38vw, 160px); height: auto; } .admission-timeline.u-desktop-only { display: none !important; } } /* Highlights: grid only on large desktop */ @media (min-width: 1400px) { .bba-highlights-grid.u-desktop-only { display: grid !important; } .bba-highlights-swiper.u-mobile-only { display: none !important; } } @media (max-width: 1399px) { .bba-highlights-grid.u-desktop-only { display: none !important; } .bba-highlights-swiper.u-mobile-only { display: block !important; } } /* NPF chatbot — lift above mobile sticky CTA bar */ .npf_chatbot_button { bottom: 60px !important; }