/* ==========================================================================
   UNICOHS — page layout polish (design only, no wording touched).
   Loaded after site-v2.css. Remove its <link> in includes/header.php to undo.
   ========================================================================== */

/* ---------- Reading experience ---------- */
.prose { font-size: 16.5px; line-height: 1.8; color: #2B3446; }
.prose h2 { font-size: clamp(24px, 2.6vw, 32px); margin: 44px 0 14px; position: relative; padding-top: 18px; }
.prose h2::before { content: ''; position: absolute; top: 0; left: 0; width: 44px; height: 4px; border-radius: 4px; background: linear-gradient(90deg, var(--gold-500), #FFD370); }
.prose h2:first-child { margin-top: 0; }
.prose h3 { font-size: 19px; margin: 28px 0 10px; color: var(--navy-800); }
.prose p { margin-bottom: 16px; }
.prose ul { margin: 6px 0 20px; display: grid; gap: 10px; }
.prose ul li { position: relative; padding: 12px 16px 12px 44px; background: var(--navy-50); border-radius: 12px; border: 1px solid rgba(8,26,56,.05); transition: transform .25s var(--ease), background .25s; }
.prose ul li::before { content: ''; position: absolute; left: 16px; top: 50%; width: 14px; height: 14px; margin-top: -7px; border-radius: 50%; background: radial-gradient(circle, var(--gold-500) 38%, rgba(244,163,0,.22) 42%); }
.prose ul li:hover { transform: translateX(4px); background: #fff; box-shadow: var(--shadow-sm); }
.prose a { color: var(--navy-700); font-weight: 600; text-decoration: underline; text-decoration-color: var(--gold-500); text-underline-offset: 3px; }

/* ---------- Two-column pages: content + floating sidebar ---------- */
.content-grid { align-items: start; gap: 48px; }
.content-grid > aside, .content-grid > div:last-child:not(.prose) { position: sticky; top: 128px; }
.sidebar-box {
  background: #fff; border: 1px solid rgba(8,26,56,.08); border-radius: 20px; padding: 26px;
  box-shadow: var(--shadow-sm); position: relative; overflow: hidden;
  transition: box-shadow .3s var(--ease), transform .3s var(--ease);
}
.sidebar-box::before { content: ''; position: absolute; left: 0; right: 0; top: 0; height: 4px; background: linear-gradient(90deg, var(--gold-500), #FFD370 60%, transparent); }
.sidebar-box:hover { box-shadow: var(--shadow-md); transform: translateY(-3px); }
.sidebar-box + .sidebar-box { margin-top: 22px; }
.sidebar-box h3, .sidebar-box h4 { font-size: 16.5px; margin-bottom: 14px; }

/* Key dates / date tiles */
.datebox {
  width: 58px; min-width: 58px; border-radius: 14px; overflow: hidden; text-align: center;
  background: var(--navy-900); color: #fff; box-shadow: 0 8px 18px -8px rgba(8,26,56,.6);
}
.datebox strong, .datebox b { color: var(--gold-500); }
.notice-item { border-radius: 16px; transition: transform .3s var(--ease), box-shadow .3s var(--ease), border-color .3s; }
.notice-item:hover { transform: translateX(6px); box-shadow: var(--shadow-md); border-color: rgba(244,163,0,.5); }

/* ---------- Four simple steps: cards on a connecting line ---------- */
.steps { gap: 22px; position: relative; counter-reset: step; }
.steps::before { content: ''; position: absolute; left: 6%; right: 6%; top: 42px; height: 2px; background: repeating-linear-gradient(90deg, var(--gold-500) 0 8px, transparent 8px 16px); opacity: .55; }
.step {
  position: relative; padding: 26px 24px 28px; background: #fff; border: 1px solid rgba(8,26,56,.08);
  border-radius: 20px; box-shadow: var(--shadow-sm); transition: transform .3s var(--ease), box-shadow .3s var(--ease), border-color .3s;
}
.step:hover { transform: translateY(-8px); box-shadow: var(--shadow-md); border-color: rgba(244,163,0,.5); }
.step::before {
  width: 54px; height: 54px; font-size: 20px; margin-bottom: 18px; position: relative; z-index: 1;
  background: linear-gradient(145deg, var(--navy-800), var(--navy-950)); border: 3px solid #fff;
  box-shadow: 0 0 0 2px var(--gold-500), 0 10px 20px -8px rgba(8,26,56,.5);
}
.step h3, .step h4 { font-size: 17px; margin-bottom: 8px; }
.step p { font-size: 14.5px; color: var(--gray-600); line-height: 1.65; }
@media (max-width: 980px) { .steps::before { display: none; } }

/* ---------- Message / leadership cards ---------- */
.message-card { border-radius: 28px; box-shadow: var(--shadow-lg); position: relative; overflow: hidden; }
.message-card::after { content: '“'; position: absolute; right: 28px; top: -30px; font-family: 'Poppins', sans-serif; font-size: 220px; line-height: 1; color: rgba(244,163,0,.14); pointer-events: none; }
.message-card-header img, .message-card .avatar-wrap { box-shadow: 0 0 0 3px var(--gold-500), 0 14px 28px -10px rgba(0,0,0,.5); }
.leader-card { border-radius: 20px; transition: transform .35s var(--ease), box-shadow .35s var(--ease); }
.leader-card:hover { transform: translateY(-8px); box-shadow: var(--shadow-md); }
.leader-card img { transition: transform .6s var(--ease); }
.leader-card:hover img { transform: scale(1.06); }

/* ---------- Mission / values / footprint ---------- */
.footprint-item, .value-card, .vm-card, .core-value { border-radius: 18px; transition: transform .3s var(--ease), box-shadow .3s var(--ease); }
.footprint-item:hover, .value-card:hover, .vm-card:hover, .core-value:hover { transform: translateY(-5px); box-shadow: var(--shadow-md); }
.footprint-item .ico { border-radius: 14px; background: linear-gradient(145deg, var(--navy-800), var(--navy-950)); color: var(--gold-500); }
.pull-quote, blockquote { border-left: 4px solid var(--gold-500); border-radius: 0 18px 18px 0; background: linear-gradient(90deg, var(--navy-50), transparent); padding: 24px 28px; font-size: 20px; line-height: 1.6; }

/* ---------- Tables ---------- */
table.simple { border-collapse: separate; border-spacing: 0; }
table.simple td, table.simple th { padding: 15px 18px; }
table.simple tbody tr:nth-child(even) td { background: #FAFBFE; }
table.simple td:first-child { color: var(--navy-800); }

/* ---------- Forms (apply, contact) ---------- */
.form-grid { gap: 20px 22px; }
form#contactForm, .contact-form, .apply-card {
  background: #fff; padding: 34px; border-radius: 24px; border: 1px solid rgba(8,26,56,.08); box-shadow: var(--shadow-md);
}
.form-group label { text-transform: none; font-weight: 650; }
.btn[type="submit"], button.btn { cursor: pointer; }
.apply-stepper { background: #fff; border-radius: 20px; padding: 22px; box-shadow: var(--shadow-sm); border: 1px solid rgba(8,26,56,.07); }

/* ---------- CTA banner secondary button was dark-on-dark ---------- */
.cta-banner .btn-ghost { border-color: rgba(255,255,255,.55); color: #fff; background: rgba(255,255,255,.06); }
.cta-banner .btn-ghost:hover { background: #fff; color: var(--navy-900); }
.cta-banner .btn-gold { color: var(--navy-900); }
.hero-actions .btn-ghost, .page-hero .btn-ghost { border-color: rgba(255,255,255,.6); color: #fff; }
.page-hero .btn-ghost:hover { background: #fff; color: var(--navy-900); }

/* ---------- Faculty photo cards: same treatment wherever they appear ---------- */
.faculty-card { border-radius: 20px; }
.faculty-card .thumb { height: 150px; background: linear-gradient(135deg, var(--navy-800), var(--navy-950)); }
.faculty-card:hover .thumb { background: linear-gradient(135deg, var(--navy-700), var(--navy-900)); }

/* ---------- Library, calendar, notices ---------- */
.resource-card, .library-card, .cal-card, .cal-month { border-radius: 18px; transition: transform .3s var(--ease), box-shadow .3s var(--ease); }
.resource-card:hover, .library-card:hover { transform: translateY(-5px); box-shadow: var(--shadow-md); }

/* ---------- Better section rhythm ---------- */
.section + .section:not(.section-alt):not(.section-navy) { border-top: 1px solid rgba(8,26,56,.04); }
.section.section-alt + .section.section-alt { padding-top: 40px; }
.cta-banner { margin-top: 8px; }

/* ---------- Scrollbar + selection polish ---------- */
html { scrollbar-color: var(--navy-700) var(--navy-50); scrollbar-width: thin; }

@media (max-width: 980px) {
  .content-grid > aside, .content-grid > div:last-child:not(.prose) { position: static; }
  .prose { font-size: 16px; }
  form#contactForm, .contact-form, .apply-card { padding: 24px; }
}