/* ===== Grid (3 cols by default; shrinks responsively) ===== */
.dcms-alum-grid{
  --gap: 24px; --dcms-cols: 3;
  display:grid; gap:var(--gap);
  grid-template-columns: repeat(var(--dcms-cols), minmax(0,1fr));
}
@media (max-width: 992px){ .dcms-alum-grid{ --dcms-cols:2 } }
@media (max-width: 576px){ .dcms-alum-grid{ --dcms-cols:1 } }

/* Card */
.dcms-alum-card{ position:relative; overflow:hidden; border-radius:12px; box-shadow:0 6px 18px rgba(0,0,0,.08); }
.dcms-alum-imgwrap{ position:relative; aspect-ratio: 3/4; background:#f2f4f7; }
.dcms-alum-imgwrap img{ width:100%; height:100%; object-fit:cover; display:block; }
.dcms-alum-imgph{ width:100%; height:100%; display:flex; align-items:center; justify-content:center; font-size:56px; color:#7a7a7a; background:linear-gradient(135deg,#f6f7f9,#eceff3); }

/* Overlay (name + passout + see) */
.dcms-alum-overlay{
  position:absolute; inset:auto 0 0 0; padding:18px 20px;
  background:linear-gradient(0deg, rgba(0,0,0,.68), rgba(0,0,0,0));
  color:#fff; display:flex; flex-direction:column; gap:6px;
}
.dcms-alum-name{ font-weight:700; letter-spacing:.2px; }
.dcms-alum-sub{ opacity:.9; font-size:.95rem; }

/* Reset theme button styles – remove pink */
.dcms-alum-see{
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  appearance: none;
  padding: 0;
  color: #fff;
  font-weight: 600;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  cursor: pointer;

  /* hidden by default; show on hover */
  opacity: 0;
  transform: translateY(6px);
  transition: opacity .2s ease, transform .2s ease;
}
.dcms-alum-card:hover .dcms-alum-see{
  opacity: 1;
  transform: translateY(0);
}
.dcms-alum-arrow{ display:inline-block; transform:translateX(0); transition:transform .2s; }
.dcms-alum-see:hover .dcms-alum-arrow{ transform:translateX(3px); }

/* ===== Modal ===== */
.dcms-alum-modal{ position:fixed; inset:0; display:none; z-index:99999; }
.dcms-alum-modal.open{
  display:flex; align-items:center; justify-content:center; padding:20px;
}
.dcms-alum-backdrop{ position:absolute; inset:0; background:rgba(0,0,0,.55); }

.dcms-alum-dialog{
  position:relative; z-index:1;
  width:min(980px,96vw); max-height:92vh; margin:0;
  background:#fff; border-radius:14px; overflow:hidden;
  box-shadow:0 18px 50px rgba(0,0,0,.25);
}

.dcms-alum-close{
  position:absolute; top:10px; right:12px;
  background:#fff; border:0; width:38px; height:38px; border-radius:50%;
  color:#111; box-shadow:0 1px 8px rgba(0,0,0,.15);
  display:flex; align-items:center; justify-content:center; cursor:pointer;
}
.dcms-alum-close:hover{ filter:brightness(.95); }
.dcms-alum-close i{ pointer-events:none; }

/* Layout inside dialog */
.dcms-alum-body{ display:grid; grid-template-columns: 1.2fr 1fr; }
@media (max-width: 780px){ .dcms-alum-body{ grid-template-columns: 1fr; } }

/* Left image + bottom quote overlay */
.dcms-alum-modal-img{
  position:relative; background:#f6f7f9;
  display:flex; align-items:center; justify-content:center;
  padding:10px; min-height:280px;
}
.dcms-alum-modal-img img{
  max-width:100%; max-height:76vh; object-fit:contain; display:block;
}
.dcms-alum-quote-wrap{
  position:absolute; left:0; right:0; bottom:0;
  padding:16px 18px;
  background:linear-gradient(0deg, rgba(0,0,0,.75), rgba(0,0,0,0));
}
.dcms-alum-quote{
  display:block; color:#fff; font-style:italic; line-height:1.4;
}

/* Right text */
.dcms-alum-modal-info{ padding:22px 24px; }
.dcms-alum-modal-name{ margin:0 0 10px; font-size:22px; font-weight:700; }
.dcms-alum-meta{ color:#333; opacity:.9; display:flex; align-items:center; gap:10px; }
.dcms-alum-dot{ opacity:.6; }

/* Prevent body scroll when modal is open */
body.dcms-locked{ overflow:hidden; }