/* =========================================================
   SSE Graduate Quick Links (standalone injector)
   Scope: ONLY elements inside .sse-grad-links
   ========================================================= */

.sse-grad-links{
  --sse-max: 1120px;
  --sse-pad: clamp(16px, 3vw, 28px);
  --sse-gap: clamp(12px, 2vw, 18px);

  --sse-radius: 16px;
  --sse-border: 1px solid rgba(0,0,0,.10);
  --sse-shadow: 0 10px 24px rgba(0,0,0,.08);
  --sse-shadow-hover: 0 14px 30px rgba(0,0,0,.12);

  --sse-bg: #fff;
  --sse-text: rgba(0,0,0,.88);
  --sse-muted: rgba(0,0,0,.65);

  /* Tulane Green */
  --tulane-green: #255C4E;
}

.sse-grad-links .sse-grad-links__inner{
  max-width: var(--sse-max);
  margin: 0 auto;
  padding: clamp(26px, 4vw, 46px) var(--sse-pad);
}

/* Title in Tulane Green (to match other hubs) */
.sse-grad-links .sse-grad-links__title{
  font-size: clamp(22px, 2.2vw, 32px);
  line-height: 1.15;
  margin: 0 0 8px 0;
  color: var(--tulane-green);
}

.sse-grad-links .sse-grad-links__sub{
  margin: 0 0 18px 0;
  max-width: 80ch;
  color: var(--sse-muted);
  line-height: 1.55;
  font-size: 16px;
}

/* GRID */
.sse-grad-links .sse-grad-links__grid{
  display: grid !important;
  gap: var(--sse-gap);
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

/* CMS sometimes wraps children in <p> */
.sse-grad-links .sse-grad-links__grid > p{
  margin: 0 !important;
  display: contents;
}

@media (max-width: 980px){
  .sse-grad-links .sse-grad-links__grid{
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 640px){
  .sse-grad-links .sse-grad-links__grid{
    grid-template-columns: 1fr;
  }
}

/* CARD = DIV, link fills card */
.sse-grad-links .sse-grad-card{
  background: var(--sse-bg);
  border: var(--sse-border);
  border-radius: var(--sse-radius);
  box-shadow: var(--sse-shadow);
  overflow: hidden;
  transition: transform .15s ease, box-shadow .15s ease;
  height: 100%;
}

.sse-grad-links .sse-grad-card__link{
  display: block;
  height: 100%;
  text-decoration: none;
  color: inherit;
}

.sse-grad-links .sse-grad-card:hover,
.sse-grad-links .sse-grad-card:focus-within{
  transform: translateY(-2px);
  box-shadow: var(--sse-shadow-hover);
}

.sse-grad-links .sse-grad-card__title,
.sse-grad-links .sse-grad-card__desc,
.sse-grad-links .sse-grad-card__cta{
  display: block;
  padding: 0 clamp(16px, 2vw, 20px);
}

.sse-grad-links .sse-grad-card__title{
  padding-top: clamp(16px, 2vw, 20px);
  font-size: 18px;
  line-height: 1.25;
  font-weight: 800;
  color: var(--tulane-green);
}

.sse-grad-links .sse-grad-card__desc{
  padding-top: 8px;
  padding-bottom: 12px;
  color: var(--sse-muted);
  line-height: 1.5;
}

.sse-grad-links .sse-grad-card__cta{
  padding-bottom: clamp(16px, 2vw, 20px);
  color: var(--tulane-green);
}
.sse-grad-links .sse-grad-card__cta strong{ font-weight: 800; }



/* =========================================================
   SSE Masters + PhD Programs (shared styles)
   Applies to BOTH pages because PhD uses .masters-program-* classes
   ========================================================= */

.masters-program-intro{
  max-width: 82ch;
  margin: 0 auto 18px auto;
  line-height: 1.55;
  font-size: 16px;
  color: rgba(0,0,0,.70);
}

/* Controls / search */
.masters-program-controls{
  max-width: 1120px;
  margin: 0 auto 14px auto;
}

.masters-search{
  width: 100%;
  max-width: 520px;
  padding: 12px 14px;
  border: 1px solid rgba(0,0,0,.15);
  border-radius: 12px;
  font-size: 16px;
  outline: none;
}

.masters-search:focus{
  border-color: rgba(37,92,78,.55);
  box-shadow: 0 0 0 4px rgba(37,92,78,.15);
}

/* GRID */
.masters-program-grid{
  display: grid !important;
  gap: clamp(12px, 2vw, 18px);
  grid-template-columns: repeat(4, minmax(0, 1fr));
  max-width: 1120px;
  margin: 0 auto;
}

/* CMS wrapper safety */
.masters-program-grid > p{
  margin: 0 !important;
  display: contents;
}

@media (max-width: 980px){
  .masters-program-grid{
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 640px){
  .masters-program-grid{
    grid-template-columns: 1fr;
  }
}

/* CARDS */
.masters-program-card{
  background: #fff;
  border: 1px solid rgba(0,0,0,.10);
  border-radius: 16px;
  box-shadow: 0 10px 24px rgba(0,0,0,.08);
  overflow: hidden;
  transition: transform .15s ease, box-shadow .15s ease;
  height: 100%;
  padding: clamp(16px, 2vw, 20px);
}

.masters-program-card:hover{
  transform: translateY(-2px);
  box-shadow: 0 14px 30px rgba(0,0,0,.12);
}

/* Title + link in Tulane Green */
.masters-program-title{
  margin: 0 0 8px 0;
  font-size: 18px;
  line-height: 1.25;
  font-weight: 800;
}

.masters-program-title a{
  color: #255C4E;
  text-decoration: none;
}

.masters-program-title a:hover{
  text-decoration: underline;
  text-underline-offset: 3px;
}

/* Description */
.masters-program-desc{
  margin: 0;
  color: rgba(0,0,0,.65);
  line-height: 1.5;
}

/* Empty-state message created by your JS */
.masters-program-empty{
  max-width: 1120px;
  margin: 10px auto 18px auto;
  color: rgba(0,0,0,.70);
}

/* DO NOT style global h2 here (it caused side effects).
   If you want to style only the "Professional Development" heading,
   add a class to that h2 and style it explicitly. */
/* =========================================================
   Masters + PhD FINAL OVERRIDE
   Goals:
   - Align with the page content column (no extra injected padding)
   - Force 4 columns on desktop when space allows
   - Prevent odd wrapping/overflow that causes 3 columns
   ========================================================= */

:root{ --tulane-green: #255C4E; }

/* 1) Align to the same content column as surrounding text */
.masters-program-intro,
.masters-program-controls,
.masters-program-grid,
.masters-program-empty{
  /* stop previous overrides from “indenting” or widening */
  max-width: none !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* Keep the typography consistent */
.masters-program-intro{
  margin-top: 0 !important;
  margin-bottom: 18px !important;
  line-height: 1.55 !important;
  font-size: 16px !important;
  color: rgba(0,0,0,.70) !important;
}

.masters-program-controls{ margin-bottom: 14px !important; }

.masters-search{
  width: 100% !important;
  max-width: 520px !important;
  padding: 12px 14px !important;
  border: 1px solid rgba(0,0,0,.15) !important;
  border-radius: 12px !important;
  font-size: 16px !important;
  outline: none !important;
}
.masters-search:focus{
  border-color: rgba(37,92,78,.60) !important;
  box-shadow: 0 0 0 4px rgba(37,92,78,.15) !important;
}

/* 2) The grid: make 4 columns possible in a narrower CMS column
      (min card width is the reason you were falling back to 3) */
.masters-program-grid{
  display: grid !important;
  gap: clamp(12px, 2vw, 18px) !important;

  /* Key change: allow smaller cards so 4 columns can fit */
  grid-template-columns: repeat(4, minmax(180px, 1fr)) !important;

  /* prevents weird overflow causing wrap */
  min-width: 0 !important;
}

/* If the CMS wraps items in <p>, neutralize it */
.masters-program-grid > p{
  margin: 0 !important;
  display: contents !important;
}

/* Responsive behavior */
@media (max-width: 980px){
  .masters-program-grid{
    grid-template-columns: repeat(2, minmax(180px, 1fr)) !important;
  }
}
@media (max-width: 640px){
  .masters-program-grid{
    grid-template-columns: 1fr !important;
  }
}

/* Cards: match your newer hub “lift” look */
.masters-program-card{
  background: #fff !important;
  border: 1px solid rgba(0,0,0,.10) !important;
  border-radius: 16px !important;
  box-shadow: 0 10px 24px rgba(0,0,0,.08) !important;
  overflow: hidden !important;
  transition: transform .15s ease, box-shadow .15s ease !important;
  padding: clamp(16px, 2vw, 20px) !important;

  /* critical for grids in constrained containers */
  min-width: 0 !important;
  width: 100% !important;
}

.masters-program-card:hover{
  transform: translateY(-2px) !important;
  box-shadow: 0 14px 30px rgba(0,0,0,.12) !important;
}

.masters-program-title{
  margin: 0 0 8px 0 !important;
  font-size: 18px !important;
  line-height: 1.25 !important;
  font-weight: 800 !important;
}

.masters-program-title a{
  color: var(--tulane-green) !important;
  text-decoration: none !important;
}
.masters-program-title a:hover{
  text-decoration: underline !important;
  text-underline-offset: 3px !important;
}

.masters-program-desc{
  margin: 0 !important;
  color: rgba(0,0,0,.65) !important;
  line-height: 1.5 !important;
}
