@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap');

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

html {
  scroll-behavior: smooth;
}

body {
  margin: 0;
  font-family: 'Inter', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  background: #f4f6fb;
  color: #1b2433;
}

/* Navbar */
header {
  background: #fff;
  padding: 8px 18px;
  position: relative;
  /* keep it on top so hero sits under it */
  left: 0;
  right: 0;
  top: 0;
  z-index: 500;
  /* allow header to grow rather than force fixed height
       (important: menu can either expand header or menu overlays page) */
  min-height: 64px;
  display: flex;
  align-items: center;
}

.navbar {
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.navbar .logo {
  color: white;
  font-weight: bold;
}

.inter-adi {
  font-family: "Inter", sans-serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
}

.navbar .logo img {
  max-height: 50px;
  width: auto;
  display: block;
}

/* Desktop nav default */
.navbar ul {
  list-style: none;
  display: flex;
  align-items: center;
  gap: 28px;
}

.navbar ul li a {
  color: #111;
  font-weight: 500;
  text-decoration: none;
  padding: 6px 4px;
  line-height: 1;
  font-family: "Inter", sans-serif;
}

.nav-cta {
  border: 1px solid #1E40AF;
  border-radius: 10px;
  color: #1E40AF;
}

.nav-cta-one {
  font-weight: bold;
  color: #1E40AF;
}

/* ---------- HAMBURGER (mobile only) ---------- */
/* default: hide hamburger on desktop; show only on mobile */
.hamburger {
  display: none;
  /* changed: don't show on desktop by default */
  background: white;
  border: none;
  cursor: pointer;
  padding: 8px;
  margin-left: 12px;
  z-index: 1100;
  /* ensure it's above the menu */
}

/* bars */
.hamburger .bar {
  display: block;
  width: 24px;
  height: 2.5px;
  margin: 5px 0;
  background: black;
  border-radius: 2px;
  transition: transform 0.25s ease, opacity 0.25s ease;
}

/* transform to "X" when open */
.hamburger.open .bar:nth-child(1) {
  transform: translateY(7px) rotate(45deg);
}

.hamburger.open .bar:nth-child(2) {
  opacity: 0;
  pointer-events: none;
}

.hamburger.open .bar:nth-child(3) {
  transform: translateY(-7px) rotate(-45deg);
}

/* ========== MOBILE NAV ========== */
/* Activate at mobile widths */
@media (max-width: 768px) {

  /* show hamburger button on mobile */
  .hamburger {
    display: block;
  }

  /* Layout tweaks for navbar */
  .navbar {
    align-items: center;
    justify-content: space-between;
    gap: 8px;
  }

  /* Make the nav an overlay that drops down from the header.
       Using absolute positioning avoids header height clipping.
       The nav will be limited to the viewport height and will scroll if content is long. */
  .nav-links {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    z-index: 1040;
    /* above header content but below hamburger if needed */
    width: 100%;
    list-style: none;
    margin: 8px 0 0 0;
    padding: 0;
    overflow: hidden;
    /* visually collapsed when closed */
    max-height: 0;
    /* collapsed */
    display: flex;
    /* keep it rendered */
    flex-direction: column;
    align-items: center;
    gap: 6px;
    background-color: white;
    /* visible overlay */
    transition: max-height 320ms ease, padding 220ms ease;
    box-shadow: 0 8px 20px rgba(2, 8, 23, 0.08);
    border-radius: 8px;
    /* allow vertical scrolling for long menus when open */
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    /* soft clip so we don't exceed viewport visually */
    max-width: 100%;
  }

  /* expanded state (JS toggles this class)
       Use calc(100vh - headerHeight) to occupy available viewport without covering the header */
  .nav-links.open {
    max-height: calc(100vh - 64px);
    /* full viewport minus header */
    padding: 12px 12px 18px 12px;
  }

  /* keep each item spaced comfortably */
  .nav-links li {
    width: auto;
    margin: 6px 0;
  }

  .nav-links li a {
    display: inline-block;
    padding: 8px 12px;
    font-size: 15px;
    color: #111;
    text-decoration: none;
    white-space: nowrap;
  }

  /* Make sure logo doesn't get too big on mobile */
  .navbar .logo img {
    max-height: 48px;
    width: auto;
    display: block;
  }

  /* adjust hero spacing to avoid overlap */
  .about-hero {
    padding-top: 60px;
    padding-left: 18px;
    padding-right: 18px;
    height: auto;
  }
}

/* extra tiny tweak */
@media (max-width: 380px) {
  .navbar .logo img {
    max-height: 45px;
  }

  .nav-links li a {
    font-size: 14px;
    padding: 7px 10px;
  }
}

/* Prevent horizontal scrollbars and white space on mobile */
html,
body {
  width: 100%;
  overflow-x: hidden;
}

/* Ensure desktop nav behaves correctly across all browsers */
.nav-links {
  display: flex;
  gap: 20px;
}

/* remove duplicate/overlapping mobile blocks (we already defined mobile styles above) */
/* Ensure no weird overflow from inner flex layouts */
.program,
.about,
.stats,
.news,
.research,
.publishers {
  width: 100%;
  max-width: 100vw;
  margin: 0 auto;
  overflow-x: hidden;
}

/* HERO */

.rs-hero {
  background: radial-gradient(circle at 0% 0%, #3ac0ff 0, #0050d8 40%, #012a8f 100%);
  color: #fff;
  padding: 32px 20px 90px 20px;
  text-align: center;
}

.rs-hero-inner {
  max-width: 760px;
  margin: 0 auto;
}

.rs-hero-tag {
  display: inline-block;
  padding: 4px 14px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.12);
  font-size: 10px;
  letter-spacing: 0.09em;
  text-transform: none;
  margin-bottom: 22px;
}

.rs-hero-title {
  font-size: 40px;
  line-height: 1.2;
  letter-spacing: -0.04em;
  font-weight: 700;
  margin: 0 0 14px 0;
}

.rs-hero-sub {
  font-size: 15px;
  line-height: 1.7;
  opacity: 0.9;
  margin: 0 0 26px 0;
}

.rs-btn-primary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 11px 26px;
  background: #ffc933;
  color: #10214f;
  border-radius: 999px;
  border: none;
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  box-shadow: 0 10px 26px rgba(0, 0, 0, 0.25);
}

.rs-btn-primary:hover {
  background: #ffdf71;
}

.rs-btn-arrow {
  font-size: 14px;
}

/* GENERIC SECTION WRAPPERS */

.rs-section-inner {
  max-width: 1180px;
  margin: 0 auto;
  padding: 60px 20px 40px 20px;
}

.rs-section-title {
  font-size: 30px;
  font-weight: 700;
  color: #26439a;
  text-align: center;
  margin: 0 0 8px 0;
  letter-spacing: 0.02em;
}

.rs-section-sub {
  font-size: 13px;
  color: #7c869f;
  text-align: center;
  margin: 0 0 32px 0;
}

/* SERVICES */

.rs-services {
  background: #f7f8fc;
}

/* blocks */

.rs-block {
  margin-top: 26px;
}

.rs-block-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 18px;
}

.rs-block-title-wrap {
  display: flex;
  align-items: center;
  gap: 10px;
}

/* vertical color bar on left */
.rs-block-color {
  width: 3px;
  height: 26px;
  border-radius: 999px;
}

.rs-block-color-blue {
  background: #26439a;
}
.rs-block-color-yellow {
  background: #ffcc33;
}

/* title text – bold, a bit tighter letter spacing */
.rs-block-title {
  font-size: 16px;
  letter-spacing: 0.11em;   /* slightly reduced */
  text-transform: uppercase;
  color: #252f4a;
  margin: 0;
  font-weight: 700;
}

/* level pills, with per-level color overrides */
.rs-level-pill {
  padding: 4px 10px;
  border-radius: 999px;
  background: #eef2ff;
  font-size: 11px;
  font-weight: 600;
}

/* B.Tech / UG – blue text */
.rs-level-pill--blue {
  color: #26439a;
  background: #e7efff;
}

/* M.Tech / PhD – yellow text */
.rs-level-pill--yellow {
  color: #f6c33b;
  background: #fff5d6;
}

/* Professional – blue text */
.rs-level-pill--blue-outline {
  color: #26439a;
  background: #e7efff;
}

/* card grids */

.rs-card-grid {
  display: grid;
  gap: 18px;
}

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

.rs-card {
  background: #ffffff;
  border-radius: 16px;
  padding: 20px 20px 18px 20px;
  box-shadow: 0 10px 28px rgba(15, 35, 95, 0.04);
}

/* card icon – fixed dark blue SVG inside soft container */
.rs-card-icon {
  width: 32px;
  height: 32px;
  border-radius: 11px;
  background: #f1f4ff;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 12px;
}

.rs-card-icon svg,
.rs-card-icon img {
  width: 18px;
  height: 18px;
  display: block;
}

/* all icons should use the same dark blue fill */
.rs-card-icon svg path,
.rs-card-icon svg rect,
.rs-card-icon svg circle {
  fill: #26439a;
}

.rs-card-title {
  font-size: 14px;
  font-weight: 600;
  color: #222c4b;
  margin: 0 0 6px 0;
}

.rs-card-text {
  font-size: 12px;
  line-height: 1.7;
  color: #7b879e;
  margin: 0;
}

/* CTA BAND (unchanged) */

.rs-cta {
  padding: 60px 20px;
  background: radial-gradient(circle at 12% 20%, rgba(255, 255, 255, 0.18) 0, rgba(255, 255, 255, 0) 40%), #f7f7fc;
}

.rs-cta-inner {
  max-width: 1080px;
  margin: 0 auto;
  background: linear-gradient(90deg, #12338f, #102f87);
  border-radius: 18px;
  text-align: center;
  padding: 40px 20px 42px 20px;
  color: #ffffff;
  box-shadow: 0 18px 40px rgba(6, 20, 70, 0.55);
}

.rs-cta-title {
  font-size: 26px;
  margin: 0 0 10px 0;
  letter-spacing: 0.01em;
}

.rs-cta-text {
  font-size: 12.5px;
  opacity: 0.92;
  margin: 0 0 22px 0;
}

.rs-btn-secondary {
  padding: 10px 26px;
  border-radius: 999px;
  border: none;
  background: #ffffff;
  color: #16306d;
  font-size: 12.5px;
  font-weight: 700;
  cursor: pointer;
  box-shadow: 0 8px 22px rgba(0, 0, 0, 0.25);
}

.rs-btn-secondary:hover {
  background: #f3f5ff;
}


/* WHY SECTION */

.rs-why {
  background: #f7f7fc;
  padding: 54px 0 70px 0;
}

.rs-why-inner {
  max-width: 1040px;
  margin: 0 auto;
  padding: 0 20px;
  text-align: center;
}

/* title + blue underline */

.rs-why-inner .rs-section-title {
  margin-bottom: 10px;
}

.rs-why-underline {
  width: 70px;
  height: 3px;
  background: #1f5bff;
  border-radius: 999px;
  margin: 0 auto;
}

.rs-why-grid {
  margin-top: 28px;
}

.rs-card-grid-2 {
  display: grid;
  gap: 18px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

/* cards – lighter fill, more height like main.jpg */

.rs-why-card {
  background: #ffffff;
  border-radius: 20px;
  padding: 22px 26px 22px 26px;
  box-shadow: 0 12px 28px rgba(15, 35, 95, 0.05);
  border-left: 5px solid #2f6bff;
  text-align: left;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  min-height: 120px;
}

.rs-why-card--yellow {
  border-left-color: #ffcc33;
}

.rs-why-card--lightblue {
  border-left-color: #44c4ff;
}

/* icon above text */

.rs-why-icon {
  width: 30px;
  height: 30px;
  border-radius: 10px;
  background: #f3f6ff;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 10px;
}

.rs-why-icon img {
  width: 18px;
  height: 18px;
  display: block;
}

/* text sizes / colors */

.rs-why-title {
  font-size: 18px;
  font-weight: 600;
  color: #1f2d5c;
  margin: 0 0 6px 0;
}

.rs-why-text {
  font-size: 14px;
  line-height: 1.7;
  color: #7b879e;
  margin: 0;
}


/* FOOTER CONTACT */

.rs-footer {
  background: #031840;              /* deep blue like main footer */
  color: #ffffff;
  padding: 80px 20px 90px 20px;
}

.rs-footer-inner {
  max-width: 960px;
  margin: 0 auto;
  text-align: center;
}

.rs-footer-tag {
  font-size: 11px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: #6c8cff;
  margin-bottom: 10px;
}

.rs-footer-title {
  font-size: 28px;
  font-weight: 700;
  margin: 0 0 10px 0;
}

.rs-footer-sub {
  font-size: 14px;
  line-height: 1.7;
  color: #d2ddff;
  margin: 0 0 40px 0;
}

/* card */

.rs-footer-card {
  max-width: 420px;
  min-height: 170px;
  margin: 0 auto;
  background: #06264d;
  border-radius: 22px;
  padding: 26px 32px 24px 32px;
  text-align: left;
  box-shadow:
    0 32px 80px rgba(0, 0, 0, 0.55),
    0 0 0 1px rgba(22, 44, 130, 0.5);
}

.rs-footer-card-header {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-bottom: 8px;
}

.rs-footer-card-icon {
  width: 46px;
  height: 46px;
  border-radius: 14px;
  background: #102b73;
  display: flex;
  align-items: center;
  justify-content: center;
}

.rs-footer-header-icon {
  width: 22px;
  height: 22px;
  display: block;
}

.rs-footer-card-header-text {
  display: flex;
  flex-direction: column;
}

.rs-footer-card-title {
  font-size: 15px;
  font-weight: 600;
  margin: 0 0 4px 0;
}

.rs-footer-card-text {
  font-size: 11.5px;
  color: #c5d1ff;
  margin: 0;
}

.rs-footer-card-divider {
  height: 1px;
  width: 100%;
  background: #23356d;
  margin: 14px 0 10px 0;
}

/* contact rows */

.rs-footer-contact-grid {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.rs-footer-contact-row {
  display: flex;
  align-items: center;
  font-size: 12.5px;
  color: #cfd8ff;
}

.rs-footer-contact-icon-box {
  width: 24px;
  height: 24px;
  border-radius: 7px;
  background: #111827;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-right: 10px;
  flex-shrink: 0;
}

.rs-footer-contact-icon {
  width: 12px;
  height: 12px;
  flex-shrink: 0;
  display: block;
  margin: 0;
  transform: none;
}

.rs-footer-contact-value {
  color: #ffffff;
  text-decoration: none;
  font-weight: 600;
}

.rs-footer-contact-value:hover {
  text-decoration: underline;
}

/* responsive */

@media (max-width: 480px) {
  .rs-footer-card {
    max-width: 100%;
    padding: 22px 20px 20px 20px;
  }
}

/* existing global responsive rules (unchanged) */

@media (max-width: 900px) {
  .rs-card-grid-3 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 720px) {
  .rs-hero-title {
    font-size: 30px;
  }
  .rs-card-grid-3,
  .rs-card-grid-2 {
    grid-template-columns: 1fr;
  }
  .rs-block-header {
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
  }
  .rs-cta-inner {
    padding: 32px 18px 34px 18px;
  }
}

@media (max-width: 480px) {
  .rs-hero {
    padding-bottom: 70px;
  }
  .rs-hero-title {
    font-size: 26px;
  }
}

/* MODAL STYLES */

.rs-modal-overlay {
  position: fixed;
  inset: 0;
  background: rgba(15, 23, 42, 0.55);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 9999;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.25s ease;
}

.rs-modal-overlay.rs-open {
  opacity: 1;
  pointer-events: auto;
}

.rs-modal {
  width: min(640px, 90vw);
  max-height: 90vh;
  background: #ffffff;
  border-radius: 16px;
  box-shadow: 0 24px 60px rgba(15, 23, 42, 0.45);
  overflow-y: auto;
  padding: 0 24px 24px 24px;
  position: relative;
}

.rs-modal-header {
  position: sticky;
  top: 0;
  background: #0f2d83;
  margin: 0 -24px 16px -24px;
  padding: 16px 24px;
  border-radius: 16px 16px 0 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  color: #ffffff;
}

.rs-modal-title {
  margin: 0;
  font-size: 18px;
  font-weight: 700;
}

.rs-modal-close {
  border: none;
  background: transparent;
  color: #ffffff;
  font-size: 22px;
  cursor: pointer;
  line-height: 1;
}

.rs-modal-intro {
  margin: 8px 0 16px 0;
  font-size: 13px;
  color: #4b5563;
}

#consultation-form {
  font-size: 13px;
}

.rs-field {
  margin-bottom: 14px;
}

.rs-field-row {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}

.rs-field-row .rs-field {
  flex: 1 1 0;
}

.rs-field label {
  display: block;
  margin-bottom: 4px;
  font-weight: 600;
  color: #111827;
}

.rs-required {
  color: #ef4444;
  margin-left: 2px;
}

.rs-field input[type="text"],
.rs-field input[type="email"],
.rs-field input[type="tel"],
.rs-field input[type="date"],
.rs-field select,
.rs-field textarea {
  width: 100%;
  padding: 8px 10px;
  border-radius: 8px;
  border: 1px solid #d1d5db;
  font: inherit;
  outline: none;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.rs-field input:focus,
.rs-field select:focus,
.rs-field textarea:focus {
  border-color: #2563eb;
  box-shadow: 0 0 0 1px rgba(37, 99, 235, 0.4);
}

/* Radio groups */

.rs-options {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 6px 16px;
  margin-top: 4px;
  font-size: 12px;
}

.rs-options label {
  display: flex;
  align-items: center;
  gap: 6px;
  cursor: pointer;
}

.rs-options input[type="radio"] {
  accent-color: #2563eb;
}

/* "Other" inline */

.rs-inline-other {
  display: flex;
  align-items: center;
  gap: 6px;
}

.rs-inline-other input[type="text"] {
  flex: 1 1 auto;
}

/* Consent */

.rs-consent {
  margin-top: 10px;
}

.rs-consent-label {
  display: flex;
  align-items: flex-start;
  gap: 6px;
  font-size: 12px;
  color: #374151;
}

.rs-consent-label input[type="checkbox"] {
  margin-top: 2px;
  accent-color: #2563eb;
}

/* Errors */

.rs-error {
  display: block;
  min-height: 14px;
  font-size: 11px;
  color: #b91c1c;
  margin-top: 2px;
}

/* Submit */

.rs-actions {
  margin-top: 18px;
  text-align: center;
}

.rs-submit-btn {
  padding: 10px 22px;
  border-radius: 999px;
  border: none;
  background: linear-gradient(90deg, #0f2d83, #2563eb);
  color: #ffffff;
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
  box-shadow: 0 14px 32px rgba(15, 23, 42, 0.35);
  transition: transform 0.15s ease, box-shadow 0.15s ease, filter 0.15s ease;
}

.rs-submit-btn:hover {
  filter: brightness(1.05);
  transform: translateY(-1px);
  box-shadow: 0 18px 40px rgba(15, 23, 42, 0.45);
}

/* Modal mobile */

@media (max-width: 640px) {
  .rs-modal {
    width: 95vw;
    padding: 0 16px 16px 16px;
  }

  .rs-modal-header {
    padding-inline: 16px;
  }
}

/* RESPONSIVE */

@media (max-width: 900px) {
  .rs-card-grid-3 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 720px) {
  .rs-hero-title {
    font-size: 30px;
  }
  .rs-card-grid-3,
  .rs-card-grid-2 {
    grid-template-columns: 1fr;
  }
  .rs-block-header {
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
  }
  .rs-cta-inner {
    padding: 32px 18px 34px 18px;
  }
}

@media (max-width: 480px) {
  .rs-hero {
    padding-bottom: 70px;
  }
  .rs-hero-title {
    font-size: 26px;
  }
}


/* Footer */
footer {
  background-color: #f5f5f5;
  color: #000;
  font-size: 14px;
}

.footer-top {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  padding: 20px 40px;
}

.footer-section {
  flex: 1 1 200px;
  margin-bottom: 12px;
}

.footer-section h4 {
  margin-bottom: 15px;
  font-size: 16px;
}

.footer-section ul {
  list-style: none;
}

.footer-section ul li {
  margin-bottom: 8px;
}

.footer-section a {
  color: inherit;
  text-decoration: none;
}

.footer-section a:hover {
  text-decoration: underline;
}

.social-icons {
  display: flex;
  gap: 12px;
  margin-bottom: 15px;
}

.social-icons a {
  font-size: 20px;
  color: #000;
  transition: color 0.3s;
}

.social-icons a:hover {
  color: #0073e6;
}

.bottom-links {
  display: flex;
  flex-direction: column;
  gap: 5px;
}

.footer-bottom {
  background-color: #1439b3;
  color: #fff;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  padding: 20px 40px;
}

.footer-bottom .left p:first-child {
  font-weight: bold;
  margin-bottom: 5px;
}

.footer-bottom .right {
  display: flex;
  gap: 20px;
  flex-wrap: wrap;
}

.footer-bottom .right a {
  color: #fff;
  text-decoration: none;
}

.footer-bottom .right a:hover {
  text-decoration: underline;
}

/* Responsive */
@media (max-width: 768px) {
  .footer-top {
    flex-direction: column;
    padding: 30px 20px;
  }

  .footer-bottom {
    flex-direction: column;
    text-align: center;
    gap: 15px;
  }

  .footer-bottom .right {
    justify-content: center;
  }

  .bottom-links {
    flex-direction: row;
    flex-wrap: wrap;
    gap: 15px;
    margin-top: 10px;
  }
}