/* ===========================
   SSE Undergraduate Quicklinks (Scoped) — v2
   Tulane Green: #255C4E
   =========================== */

.sse-ug-links--v1{
  --tulane-green:#255C4E;
  --border: rgba(0,0,0,.12);
  --muted: rgba(0,0,0,.68);
  --shadow: 0 10px 22px rgba(0,0,0,.06);
  --shadow-hover: 0 14px 28px rgba(0,0,0,.08);
}

/* Keep this section from inheriting odd link/button styles */
.sse-ug-links--v1 a{
  text-decoration: none !important;
}
/* Width container */
.sse-ug-links--v1 .sse-ug-links__inner{
  max-width: 1280px;   /* try 1240–1320 depending on taste */
  margin: 0 auto;
  padding: 0 1.25rem;
}
/* Section title/subhead */
.sse-ug-links--v1 .sse-ug-links__title{
  color: var(--tulane-green) !important;
  margin: 0 0 .35rem 0;
}

.sse-ug-links--v1 .sse-ug-links__sub{
  margin: 0 0 1.1rem 0;
  color: var(--muted);
  max-width: 95ch;
  font-size: 1.05rem;
  line-height: 1.55;
}

/* ===========================
   GRID — 4 columns (requested)
   =========================== */
.sse-ug-links--v1 .sse-ug-links__grid{
  display: grid;
  grid-template-columns: repeat(4, minmax(0,1fr));
  gap: 1rem;
}

/* Responsive breakpoints */
@media (max-width: 1100px){
  .sse-ug-links--v1 .sse-ug-links__grid{ grid-template-columns: repeat(3, minmax(0,1fr)); }
}
@media (max-width: 900px){
  .sse-ug-links--v1 .sse-ug-links__grid{ grid-template-columns: repeat(2, minmax(0,1fr)); }
}
@media (max-width: 600px){
  .sse-ug-links--v1 .sse-ug-links__grid{ grid-template-columns: 1fr; }
}

/* ===========================
   CARD (make the <a> the card)
   =========================== */
.sse-ug-links--v1 .sse-ug-card{
  display: flex;
  flex-direction: column;
  justify-content: flex-start;

  height: 100%;
  min-height: 150px;             /* helps keep rows visually consistent */
  padding: 1.05rem 1rem;

  border: 1px solid var(--border);
  border-radius: 14px;
  background: #fff;
  box-shadow: var(--shadow);

  transition: transform 160ms ease, box-shadow 160ms ease, border-color 160ms ease;
}

/* Hover/focus states on the card itself */
.sse-ug-links--v1 .sse-ug-card:hover,
.sse-ug-links--v1 .sse-ug-card:focus,
.sse-ug-links--v1 .sse-ug-card:focus-visible{
  transform: translateY(-2px);
  box-shadow: var(--shadow-hover);
  border-color: rgba(37,92,78,.35);
  outline: none;
}

/* Title / description / CTA text inside the card */
.sse-ug-links--v1 .sse-ug-card__title{
  margin: 0 0 .4rem 0;
  color: var(--tulane-green) !important;
  font-size: 1.05rem;
  font-weight: 800;
  line-height: 1.25;
}

.sse-ug-links--v1 .sse-ug-card__desc{
  margin: 0 0 .85rem 0;
  color: var(--muted);
  line-height: 1.45;
  font-size: .98rem;
}

/* CTA “link-like” label that lives inside the card */
.sse-ug-links--v1 .sse-ug-card__cta{
  margin-top: auto;              /* pushes CTA to bottom for alignment */
  color: var(--tulane-green) !important;
  font-weight: 800;
  font-size: .95rem;
}

/* Little arrow for the CTA */
.sse-ug-links--v1 .sse-ug-card__cta::after{
  content: " →";
}

/* ===========================
   IMPORTANT: Stop theme from
   styling inner elements as
   separate links/buttons
   =========================== */
/* If your markup is: <a class="sse-ug-card"><span>...</span></a>
   this makes only the <a> clickable, not inner spans. */
.sse-ug-links--v1 .sse-ug-card *{
  pointer-events: none;
}

/* Make inner spans block-level for consistent spacing */
.sse-ug-links--v1 .sse-ug-card__title,
.sse-ug-links--v1 .sse-ug-card__desc,
.sse-ug-links--v1 .sse-ug-card__cta{
  display: block;
}
/* Graduate hub — page polish */
.sse-ds.sse-grad-hub .sse-card__cta { font-weight: 700; }
.sse-ds.sse-grad-hub .sse-card .sse-eyebrow { margin-bottom: 2px; }

.sse-ds.sse-grad-hub .sse-h2 + .sse-p { max-width: 70ch; }
.sse-ds.sse-grad-hub .sse-btnrow { margin-top: 6px; }