
/* =========================================================
   JCCHT theme  ·  jccht.css  ·  loaded after the stock theme
   All classes are jc- prefixed so nothing collides.
   ========================================================= */
.jc{
  --paper:#FCFBFC; --surface:#FFFFFF; --surface-2:#F5F4F5; --surface-3:#ECEAEC;
  --line:#E3E1E3; --line-strong:#C6C2C6;
  --ink:#191719; --ink-2:#3B383B; --muted:#6A656A;
  --brand:#963094; --brand-text:#7E2A7C; --brand-deep:#7A2578; --brand-soft:#F4EFF4;
  --plum:#201C20; --plum-2:#4A1A49;
  --on-plum:#F0EEF0; --on-plum-muted:#A8A4A8;
  --gold:#96661B; --ok:#2C6D51;
  --shadow:0 1px 2px rgba(25,23,25,.05), 0 8px 24px -12px rgba(25,23,25,.18);
  --wrap:1180px;
  background:var(--paper); color:var(--ink);
  font-family:"Public Sans",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
  font-size:16px; line-height:1.6; -webkit-font-smoothing:antialiased;
}
.jc *{box-sizing:border-box}
.jc img{display:block;max-width:100%;height:auto}
.jc a{color:var(--brand-text);text-decoration:none}
.jc a:hover{text-decoration:underline}
.jc :focus-visible{outline:2px solid var(--brand);outline-offset:2px}
.jc h1,.jc h2,.jc h3,.jc h4{font-family:"Newsreader",Georgia,"Times New Roman",serif;font-weight:500;
  color:var(--ink);margin:0;text-wrap:balance;letter-spacing:-.01em;line-height:1.2}
.jc p{margin:0}
.jc ul{margin:0;padding:0}
.jc-wrap{max-width:var(--wrap);margin-left:auto;margin-right:auto;padding-left:24px;padding-right:24px}
.jc-eyebrow{font-size:12px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;
  color:var(--brand-text);font-family:"Public Sans",sans-serif;display:block}
.jc-lede{font-size:18px;color:var(--muted);max-width:62ch}
.jc-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;
  font-family:"Public Sans",sans-serif;font-size:14.5px;font-weight:600;letter-spacing:.01em;
  padding:11px 20px;border-radius:2px;border:1px solid transparent;cursor:pointer;text-decoration:none;
  white-space:nowrap;line-height:1.2}
.jc-btn:hover{text-decoration:none}
.jc-btn-primary{background:var(--brand);color:#fff;border-color:var(--brand)}
.jc-btn-primary:hover{background:var(--brand-deep);border-color:var(--brand-deep);color:#fff}
.jc-btn-ghost{background:transparent;color:var(--ink);border-color:var(--line-strong)}
.jc-btn-ghost:hover{border-color:var(--brand);color:var(--brand-text)}
.jc-btn-dark{background:transparent;color:#fff;border-color:rgba(255,255,255,.4)}
.jc-btn-dark:hover{background:rgba(255,255,255,.12);border-color:#fff;color:#fff}
.jc-btn-block{width:100%}

/* ---------- utility bar ---------- */
.jc-utility{background:var(--surface-2);color:var(--muted);font-size:13px;
  border-bottom:1px solid var(--line)}
.jc-utility .jc-wrap{display:flex;gap:22px;align-items:center;padding-top:8px;padding-bottom:8px;
  flex-wrap:wrap}
.jc-utility a{color:var(--ink-2);font-weight:500}
.jc-utility a:hover{color:var(--brand-text)}
.jc-utility .jc-right{margin-left:auto;display:flex;gap:18px;align-items:center;flex-wrap:wrap}

/* ---------- masthead ---------- */
.jc-masthead{background:var(--surface);border-bottom:1px solid var(--line);position:relative;z-index:30}
.jc-masthead .jc-wrap{display:flex;align-items:center;gap:18px;padding-top:14px;padding-bottom:14px}
.jc-crest{width:58px;flex:none}
.jc-wordmark{line-height:1.22;white-space:nowrap}
.jc-wordmark .n1{font-family:"Newsreader",Georgia,serif;font-size:19px;font-weight:600;color:var(--ink);
  display:block;letter-spacing:-.01em}
.jc-wordmark .n2{font-size:11.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);
  display:block}
.jc-nav{margin-left:auto;display:flex;align-items:center;gap:2px}
.jc-nav > a, .jc-nav .jc-drop > button{font-family:inherit;font-size:14px;font-weight:500;
  color:var(--ink-2);background:none;border:0;padding:10px 10px;cursor:pointer;border-radius:2px;
  display:inline-flex;align-items:center;gap:5px;white-space:nowrap;line-height:1.4}
.jc-nav > a:hover, .jc-nav .jc-drop > button:hover{color:var(--brand-text);text-decoration:none;
  background:var(--surface-2)}
.jc-nav > a.is-current{color:var(--brand-text)}
.jc-caret{width:7px;height:7px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;
  transform:rotate(45deg) translateY(-2px);opacity:.55;display:inline-block}
.jc-drop{position:relative}
.jc-drop-menu{position:absolute;top:100%;left:0;min-width:240px;background:var(--surface);
  border:1px solid var(--line);box-shadow:var(--shadow);padding:6px;display:none;z-index:40}
.jc-drop:hover .jc-drop-menu, .jc-drop:focus-within .jc-drop-menu{display:block}
.jc-drop-menu a{display:block;padding:8px 10px;font-size:14px;color:var(--ink-2)}
.jc-drop-menu a:hover{background:var(--surface-2);color:var(--brand-text);text-decoration:none}
.jc-nav .jc-btn{margin-left:12px;padding:10px 18px}
.jc-burger{display:none;margin-left:auto;background:none;border:1px solid var(--line-strong);
  border-radius:2px;padding:9px 12px;cursor:pointer;font-size:15px;color:var(--ink)}

/* ---------- hero slider ---------- */
.jc-hero{position:relative;background:#1B191B;overflow:hidden}
.jc-hero-bg{position:absolute;top:0;left:0;right:0;bottom:0}
.jc-hero-img{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover;opacity:0;
  transition:opacity 900ms ease}
.jc-hero-img.is-on{opacity:.62}
.jc-hero-scrim{position:absolute;top:0;left:0;right:0;bottom:0;
  background:linear-gradient(96deg, rgba(22,20,22,.93) 0%, rgba(22,20,22,.78) 48%, rgba(22,20,22,.34) 100%)}
.jc-hero-in{position:relative;padding-top:74px;padding-bottom:104px;max-width:640px}
.jc-hero h1{color:#fff;font-size:clamp(32px,5vw,52px);line-height:1.08;margin-top:14px;margin-bottom:18px}
.jc-hero p{color:var(--on-plum);opacity:.94;font-size:18px;max-width:52ch}
.jc-chip{display:inline-flex;align-items:center;gap:9px;font-size:12.5px;font-weight:600;
  letter-spacing:.08em;text-transform:uppercase;color:#EDEBED;
  border:1px solid rgba(255,255,255,.28);padding:6px 12px;border-radius:100px}
.jc-dot{width:7px;height:7px;border-radius:50%;background:#6FCFA4;flex:none;display:inline-block}
.jc-hero-actions{display:flex;gap:12px;margin-top:28px;flex-wrap:wrap}
.jc-hero-copy{transition:opacity 320ms ease}
.jc-hero-copy.is-fading{opacity:0}
.jc-hero-nav{position:relative;display:flex;align-items:center;gap:18px;margin-top:38px}
.jc-dots{display:flex;gap:9px}
.jc-dots button{width:9px;height:9px;padding:0;border-radius:50%;border:1px solid rgba(255,255,255,.55);
  background:transparent;cursor:pointer}
.jc-dots button[aria-current="true"]{background:#fff;border-color:#fff;width:26px;border-radius:100px}
.jc-arrows{display:flex;gap:8px}
.jc-arrows button{width:34px;height:34px;border:1px solid rgba(255,255,255,.35);background:transparent;
  color:#fff;cursor:pointer;border-radius:2px;font-size:16px;line-height:1;display:flex;
  align-items:center;justify-content:center}
.jc-arrows button:hover{background:rgba(255,255,255,.14);border-color:#fff}
.jc-count{font-size:12.5px;color:rgba(255,255,255,.7);font-variant-numeric:tabular-nums;letter-spacing:.06em}

/* ---------- quick actions ---------- */
.jc-quick{position:relative;margin-top:-46px;z-index:5}
.jc-quick-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);
  border:1px solid var(--line);box-shadow:var(--shadow)}
.jc-qa{background:var(--surface);padding:22px 24px;display:flex;gap:16px;align-items:flex-start}
.jc-qa:hover{background:var(--surface-2);text-decoration:none}
.jc-qa-num{font-family:"Newsreader",Georgia,serif;font-size:15px;color:var(--muted);
  border:1px solid var(--line-strong);width:34px;height:34px;flex:none;border-radius:50%;
  display:flex;align-items:center;justify-content:center}
.jc-qa h3{font-size:17px;margin-bottom:3px}
.jc-qa p{font-size:13.5px;color:var(--muted);line-height:1.45}

/* ---------- sections ---------- */
.jc-section{padding-top:72px;padding-bottom:72px}
.jc-section.is-tight{padding-top:52px;padding-bottom:52px}
.jc-section.is-alt{background:var(--surface-2)}
.jc-sec-head{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;
  padding-bottom:20px;margin-bottom:36px;border-bottom:1px solid var(--line);flex-wrap:wrap}
.jc-sec-head h2{font-size:clamp(25px,3vw,33px)}
.jc-sec-head .jc-eyebrow{margin-bottom:8px}
.jc-sec-head a{font-size:14px;font-weight:600;white-space:nowrap}

/* facts */
.jc-facts{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line);
  border-bottom:1px solid var(--line)}
.jc-fact{padding:26px 28px;border-right:1px solid var(--line)}
.jc-fact:last-child{border-right:0}
.jc-fact .n{font-family:"Newsreader",Georgia,serif;font-size:34px;line-height:1;color:var(--ink);
  font-variant-numeric:tabular-nums}
.jc-fact .l{font-size:12.5px;letter-spacing:.09em;text-transform:uppercase;color:var(--muted);margin-top:9px}

/* cards grid */
.jc-grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
.jc-grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.jc-card{background:var(--surface);border:1px solid var(--line);display:flex;flex-direction:column}
.jc-card img{width:100%;aspect-ratio:4/3;object-fit:cover}
.jc-card-body{padding:20px;display:flex;flex-direction:column;gap:9px;flex:1}
.jc-card h3{font-size:19px}
.jc-card .jc-meta{font-size:12.5px;color:var(--muted);line-height:1.45}
.jc-card .jc-more{margin-top:auto;padding-top:12px;font-size:13.5px;font-weight:600}

/* about / two column feature */
.jc-split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:48px;align-items:center}
.jc-split.is-narrow{grid-template-columns:minmax(0,320px) minmax(0,1fr);align-items:start}
.jc-split img{width:100%;border:1px solid var(--line)}
.jc-vm{display:grid;grid-template-columns:1fr 1fr;gap:26px;margin-top:26px}
.jc-vm h3{font-size:19px;margin-bottom:7px}
.jc-vm p{font-size:14.5px;color:var(--muted)}

/* facilities / gallery */
.jc-fac{border:1px solid var(--line);background:var(--surface)}
.jc-fac img{width:100%;aspect-ratio:3/2;object-fit:cover}
.jc-fac-cap{padding:15px 18px}
.jc-fac-cap h3{font-size:16.5px}

/* news + events */
.jc-two-col{display:grid;grid-template-columns:1.35fr 1fr;gap:52px}
.jc-news-item{display:flex;gap:18px;padding-top:18px;padding-bottom:18px;border-bottom:1px solid var(--line)}
.jc-news-item:first-child{padding-top:0}
.jc-date{flex:none;width:60px;text-align:center;border:1px solid var(--line);padding:8px 0;
  background:var(--surface)}
.jc-date .d{font-family:"Newsreader",Georgia,serif;font-size:22px;line-height:1;
  font-variant-numeric:tabular-nums}
.jc-date .m{font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin-top:3px}
.jc-news-item h3{font-size:17.5px;line-height:1.3}
.jc-news-item p{font-size:13.5px;color:var(--muted);margin-top:5px}
.jc-ev{background:var(--surface);border:1px solid var(--line);padding:18px;margin-bottom:14px}
.jc-ev h3{font-size:17px}
.jc-ev .jc-meta{font-size:12.5px;color:var(--muted);margin-top:6px}

/* testimonials */
.jc-quote{background:var(--surface);border:1px solid var(--line);padding:26px}
.jc-quote p{font-family:"Newsreader",Georgia,serif;font-size:17.5px;line-height:1.55;font-style:italic;
  color:var(--ink-2)}
.jc-quote .who{display:flex;align-items:center;gap:13px;margin-top:20px;padding-top:16px;
  border-top:1px solid var(--line)}
.jc-quote .who img{width:46px;height:46px;border-radius:50%;object-fit:cover}
.jc-quote .who b{font-size:14.5px;display:block}
.jc-quote .who span{font-size:12.5px;color:var(--muted)}

/* admissions band */
.jc-band{background:var(--plum-2);color:var(--on-plum)}
.jc-band .jc-wrap{padding-top:56px;padding-bottom:56px;display:grid;
  grid-template-columns:1.2fr 1fr;gap:48px;align-items:center}
.jc-band h2{color:#fff;font-size:clamp(25px,3vw,32px)}
.jc-band p{color:var(--on-plum);opacity:.92;margin-top:12px}

/* footer */
.jc-footer{background:var(--plum);color:var(--on-plum-muted);padding-top:56px}
.jc-foot-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:40px}
.jc-footer h4{color:#fff;font-family:"Public Sans",sans-serif;font-size:12px;font-weight:700;
  letter-spacing:.13em;text-transform:uppercase;margin-bottom:14px}
.jc-footer ul{list-style:none;display:flex;flex-direction:column;gap:9px;font-size:14px}
.jc-footer a{color:var(--on-plum-muted)}
.jc-footer a:hover{color:#fff}
.jc-foot-about{font-size:14px;line-height:1.65;max-width:34ch}
.jc-social{display:flex;gap:10px;margin-top:16px}
.jc-social a{width:34px;height:34px;border:1px solid rgba(255,255,255,.22);display:flex;
  align-items:center;justify-content:center;border-radius:50%}
.jc-social a:hover{background:var(--brand);border-color:var(--brand);color:#fff}
.jc-foot-bottom{margin-top:44px;border-top:1px solid rgba(255,255,255,.13);padding-top:20px;
  padding-bottom:20px;font-size:12.5px;display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap}

/* page banner + inner */
.jc-banner{background:var(--plum-2);color:#fff;padding-top:46px;padding-bottom:46px}
.jc-banner h1{color:#fff;font-size:clamp(27px,4vw,40px);margin-top:10px}
.jc-crumb{font-size:13px;color:var(--on-plum-muted)}
.jc-crumb a{color:var(--on-plum-muted)}
.jc-inner{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:52px;align-items:start}
.jc-prose{font-size:16.5px;color:var(--ink-2)}
.jc-prose p{margin-bottom:18px}
.jc-prose h2{font-size:26px;margin-top:34px;margin-bottom:14px}
.jc-prose h3{font-size:20px;margin-top:26px;margin-bottom:10px}
.jc-prose ul,.jc-prose ol{margin-bottom:18px;padding-left:22px}
.jc-prose li{margin-bottom:7px}
.jc-prose img{margin-bottom:18px}
.jc-prose table{width:100%;border-collapse:collapse;margin-bottom:18px}
.jc-prose td,.jc-prose th{border:1px solid var(--line);padding:9px 12px;text-align:left}
.jc-aside{background:var(--surface);border:1px solid var(--line);padding:22px}
.jc-aside h3{font-size:16px;margin-bottom:12px}
.jc-aside ul{list-style:none;display:flex;flex-direction:column;gap:10px;font-size:14px}
.jc-scroll{overflow-x:auto}

/* ---------- portal login ---------- */
.jc-login{display:grid;grid-template-columns:1.05fr 1fr;min-height:100vh}
.jc-login-media{position:relative;background:#1B191B;overflow:hidden;display:flex;
  align-items:flex-end;padding:40px}
.jc-login-media img{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover;opacity:.5}
.jc-login-media .jc-scrim{position:absolute;top:0;left:0;right:0;bottom:0;
  background:linear-gradient(180deg,rgba(20,18,20,.35) 0%,rgba(20,18,20,.9) 100%)}
.jc-login-media .cap{position:relative;color:#fff;max-width:38ch}
.jc-login-media .cap h2{color:#fff;font-size:26px}
.jc-login-media .cap p{color:#D9D6D9;font-size:14.5px;margin-top:10px}
.jc-login-panel{display:flex;align-items:center;justify-content:center;padding:56px 32px;
  background:var(--surface)}
.jc-login-card{width:100%;max-width:392px}
.jc-login-card .jc-crest{width:52px;margin-bottom:22px}
.jc-login-card h1{font-size:27px;margin-bottom:6px}
.jc-login-card .sub{color:var(--muted);font-size:14.5px;margin-bottom:26px}
.jc-field{margin-bottom:16px}
.jc-field label{display:block;font-size:12.5px;font-weight:600;letter-spacing:.06em;
  text-transform:uppercase;color:var(--muted);margin-bottom:7px}
.jc-field input{width:100%;font-family:inherit;font-size:15px;padding:11px 13px;
  border:1px solid var(--line-strong);border-radius:2px;background:var(--surface);color:var(--ink)}
.jc-field input:focus{outline:none;border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-soft)}
.jc-form-row{display:flex;align-items:center;justify-content:space-between;gap:16px;font-size:13.5px;
  margin:6px 0 22px}
.jc-form-row label{display:flex;align-items:center;gap:8px;color:var(--muted);margin:0}
.jc-login-alt{margin-top:28px;padding-top:22px;border-top:1px solid var(--line)}
.jc-login-alt h3{font-size:15px;margin-bottom:10px}
.jc-login-alt ul{list-style:none;display:flex;flex-direction:column;gap:9px;font-size:14px}
.jc-login-foot{margin-top:26px;font-size:12.5px;color:var(--muted);line-height:1.55}
.jc-alert{padding:11px 14px;border:1px solid var(--line-strong);border-left:3px solid var(--brand);
  background:var(--brand-soft);font-size:14px;margin-bottom:18px;color:var(--ink-2)}
.jc-alert.is-error{border-left-color:#B3261E;background:#FDF1F0;color:#7A1B15}

/* ---------- responsive ---------- */
@media (max-width:1080px){
  .jc-nav{display:none}
  .jc-nav.is-open{display:flex;position:absolute;top:100%;left:0;right:0;background:var(--surface);
    border-bottom:1px solid var(--line);flex-direction:column;align-items:stretch;padding:10px 16px 18px;
    gap:2px;box-shadow:var(--shadow)}
  .jc-nav.is-open .jc-drop-menu{position:static;display:block;border:0;box-shadow:none;padding:0 0 0 12px}
  .jc-nav.is-open .jc-drop > button{width:100%;justify-content:space-between}
  .jc-nav.is-open .jc-btn{margin-left:0;margin-top:10px}
  .jc-burger{display:block}
  .jc-masthead .jc-wrap{position:relative}
}
@media (max-width:960px){
  .jc-grid-4{grid-template-columns:repeat(2,1fr)}
  .jc-facts{grid-template-columns:repeat(2,1fr)}
  .jc-fact:nth-child(2){border-right:0}
  .jc-fact:nth-child(1),.jc-fact:nth-child(2){border-bottom:1px solid var(--line)}
  .jc-two-col,.jc-split,.jc-split.is-narrow,.jc-inner,.jc-band .jc-wrap,.jc-login{grid-template-columns:1fr;gap:34px}
  .jc-login{min-height:0}
  .jc-login-media{min-height:220px}
  .jc-quick-grid{grid-template-columns:1fr}
  .jc-quick{margin-top:-24px}
  .jc-grid-3{grid-template-columns:repeat(2,1fr)}
  .jc-foot-grid{grid-template-columns:1fr 1fr}
}
@media (max-width:620px){
  .jc-grid-4,.jc-grid-3,.jc-facts,.jc-vm,.jc-foot-grid{grid-template-columns:1fr}
  .jc-fact{border-right:0;border-bottom:1px solid var(--line)}
  .jc-section{padding-top:48px;padding-bottom:48px}
  .jc-hero-in{padding-top:52px;padding-bottom:84px}
  .jc-wordmark .n2{display:none}
  .jc-wordmark{white-space:normal}
}
@media (prefers-reduced-motion:reduce){
  .jc-hero-img,.jc-hero-copy{transition:none}
}


/* --- fit-and-finish --- */
.jc{overflow-x:hidden}
.jc-btn{max-width:100%}
.jc-hero-actions .jc-btn{display:inline-block;max-width:330px;overflow:hidden;
  text-overflow:ellipsis;white-space:nowrap;text-align:center}
.jc-wordmark{white-space:normal;max-width:400px}
.jc-wordmark .n1{font-size:16.5px;line-height:1.25}
.jc-wordmark .n2{font-size:10.5px;line-height:1.4;margin-top:2px}
.jc-nav > a, .jc-nav .jc-drop > button{font-size:13.5px;padding:10px 8px}
.jc-nav .jc-btn{padding:10px 14px;font-size:13.5px}
.jc-crest{width:52px}
.jc-drop-menu{right:auto}
.jc-drop:last-of-type .jc-drop-menu{left:auto;right:0}
@media (max-width:1240px){
  .jc-nav{display:none}
  .jc-nav.is-open{display:flex;position:absolute;top:100%;left:0;right:0;background:var(--surface);
    border-bottom:1px solid var(--line);flex-direction:column;align-items:stretch;padding:10px 16px 18px;
    gap:2px;box-shadow:var(--shadow);z-index:50}
  .jc-nav.is-open .jc-drop-menu{position:static;display:block;border:0;box-shadow:none;padding:0 0 0 12px}
  .jc-nav.is-open .jc-drop > button{width:100%;justify-content:space-between}
  .jc-nav.is-open .jc-btn{margin-left:0;margin-top:10px}
  .jc-burger{display:block}
  .jc-masthead .jc-wrap{position:relative}
}


/* --- fit-and-finish 2 --- */
.jc-masthead .jc-wrap > a:first-child{flex:none;line-height:0}
.jc-crest{flex:none;width:52px;height:auto}
.jc-wordmark{display:block;flex:1 1 auto;min-width:0;white-space:normal;max-width:360px}
.jc-wordmark .n1{font-size:16px}
.jc .jc-btn-primary, .jc a.jc-btn-primary{color:#fff}
.jc .jc-btn-primary:hover, .jc a.jc-btn-primary:hover{color:#fff}
.jc .jc-btn-dark, .jc a.jc-btn-dark{color:#fff}
.jc .jc-btn-ghost, .jc a.jc-btn-ghost{color:var(--ink)}
.jc .jc-qa h3, .jc .jc-card h3 a, .jc .jc-news-item h3 a, .jc .jc-ev h3 a{color:var(--ink)}
.jc .jc-utility a{color:var(--ink-2)}
.jc .jc-footer a{color:var(--on-plum-muted)}
.jc .jc-footer a:hover{color:#fff}
.jc-nav{flex:0 1 auto;min-width:0}
@media (max-width:1360px){
  .jc-nav{display:none}
  .jc-nav.is-open{display:flex;position:absolute;top:100%;left:0;right:0;background:var(--surface);
    border-bottom:1px solid var(--line);flex-direction:column;align-items:stretch;padding:10px 16px 18px;
    gap:2px;box-shadow:var(--shadow);z-index:50}
  .jc-nav.is-open .jc-drop-menu{position:static;display:block;border:0;box-shadow:none;padding:0 0 0 12px}
  .jc-nav.is-open .jc-drop > button{width:100%;justify-content:space-between}
  .jc-nav.is-open .jc-btn{margin-left:0;margin-top:10px;max-width:none}
  .jc-burger{display:block}
  .jc-masthead .jc-wrap{position:relative}
  .jc-wordmark{max-width:none}
}


/* --- two-row header --- */
.jc-navbar{background:var(--surface);border-bottom:1px solid var(--line);position:relative;z-index:25}
.jc-navbar .jc-wrap{display:flex;align-items:center}
.jc-nav{margin-left:-10px;display:flex;align-items:center;gap:2px;flex-wrap:wrap;width:100%}
.jc-nav > a, .jc-nav .jc-drop > button{font-size:14.5px;padding:14px 12px;border-radius:0}
.jc-nav .jc-btn{margin-left:auto;padding:9px 18px;font-size:14px;max-width:none}
.jc-wordmark{max-width:none}
.jc-wordmark .n1{font-size:19px}
.jc-masthead .jc-wrap{padding-top:16px;padding-bottom:16px}
@media (max-width:1360px){ .jc-nav{display:flex} .jc-burger{display:none} }
@media (max-width:980px){
  .jc-nav{display:none}
  .jc-navbar{display:none}
  .jc-nav.is-open{display:flex;position:absolute;top:100%;left:0;right:0;background:var(--surface);
    border-bottom:1px solid var(--line);flex-direction:column;align-items:stretch;padding:10px 16px 18px;
    gap:2px;box-shadow:var(--shadow);z-index:50;margin-left:0;width:auto}
  .jc-navbar.is-shown{display:block}
  .jc-navbar.is-shown .jc-nav{display:flex;flex-direction:column;align-items:stretch;margin-left:0;
    padding-top:6px;padding-bottom:14px}
  .jc-navbar.is-shown .jc-drop-menu{position:static;display:block;border:0;box-shadow:none;padding:0 0 0 14px}
  .jc-navbar.is-shown .jc-drop > button{width:100%;justify-content:space-between}
  .jc-navbar.is-shown .jc-btn{margin-left:0;margin-top:10px}
  .jc-burger{display:block}
}


/* === typography, motion, mobile === */

/* ---- reading type ---- */
.jc-prose{font-size:clamp(16px,0.4vw + 15px,17.5px);line-height:1.72;color:var(--ink-2);
  max-width:70ch;hyphens:auto}
.jc-prose > p:first-of-type{font-size:1.09em;line-height:1.62;color:var(--ink)}
.jc-prose p{margin:0 0 1.15em}
.jc-prose h2{font-size:clamp(22px,1.4vw + 18px,29px);margin:2.1em 0 .55em;padding-bottom:.32em;
  border-bottom:1px solid var(--line);color:var(--ink)}
.jc-prose h2:first-child{margin-top:0}
.jc-prose h3{font-size:clamp(18px,.7vw + 16px,21px);margin:1.7em 0 .45em;color:var(--ink)}
.jc-prose h4{font-size:16.5px;margin:1.4em 0 .4em;font-family:"Public Sans",sans-serif;font-weight:700;
  letter-spacing:.02em}
.jc-prose strong{color:var(--ink);font-weight:600}
.jc-prose em{color:var(--muted)}
.jc-prose a{text-decoration:underline;text-underline-offset:3px;
  text-decoration-color:color-mix(in srgb, var(--brand-text) 35%, transparent)}
.jc-prose a:hover{text-decoration-color:var(--brand-text)}
.jc-prose ul,.jc-prose ol{margin:0 0 1.15em;padding-left:1.35em}
.jc-prose li{margin-bottom:.5em;padding-left:.15em}
.jc-prose ul li::marker{color:var(--brand-text)}
.jc-prose ol li::marker{color:var(--brand-text);font-weight:600}
.jc-prose blockquote{margin:1.5em 0;padding:.2em 0 .2em 1.2em;border-left:3px solid var(--brand);
  font-family:"Newsreader",Georgia,serif;font-size:1.15em;font-style:italic;color:var(--ink)}
.jc-prose hr{border:0;border-top:1px solid var(--line);margin:2.2em 0}
.jc-prose img{border:1px solid var(--line);margin:0 0 1.4em}
.jc-prose > *:last-child{margin-bottom:0}

/* ---- tables that survive a phone ---- */
.jc-table-scroll{overflow-x:auto;margin:0 0 1.5em;border:1px solid var(--line);background:var(--surface);
  -webkit-overflow-scrolling:touch}
.jc-table-scroll table{margin:0;border:0;min-width:520px}
.jc-prose table{width:100%;border-collapse:collapse;font-size:15px;line-height:1.5}
.jc-prose th{background:var(--surface-2);font-family:"Public Sans",sans-serif;font-size:12px;
  font-weight:700;letter-spacing:.09em;text-transform:uppercase;color:var(--muted);
  text-align:left;padding:11px 14px;border-bottom:1px solid var(--line);white-space:nowrap}
.jc-prose td{padding:11px 14px;border-bottom:1px solid var(--line);vertical-align:top;
  font-variant-numeric:tabular-nums}
.jc-prose tr:last-child td{border-bottom:0}
.jc-prose tbody tr:nth-child(even) td{background:color-mix(in srgb, var(--surface-2) 55%, transparent)}
.jc-prose td:first-child{color:var(--ink)}

/* ---- links & buttons: micro-interaction ---- */
.jc a{transition:color 140ms ease}
.jc-btn{transition:background-color 160ms ease,border-color 160ms ease,transform 120ms ease}
.jc-btn:active{transform:translateY(1px)}
.jc-nav > a, .jc-nav .jc-drop > button{position:relative;transition:color 140ms ease,background-color 140ms ease}
.jc-nav > a::after, .jc-nav .jc-drop > button::after{content:"";position:absolute;left:10px;right:10px;
  bottom:6px;height:2px;background:var(--brand);transform:scaleX(0);transform-origin:left;
  transition:transform 200ms ease}
.jc-nav > a:hover::after, .jc-nav .jc-drop:hover > button::after, .jc-nav > a.is-current::after{transform:scaleX(1)}
.jc-nav > a.jc-btn::after{display:none}
.jc-drop-menu{transition:opacity 140ms ease}

/* ---- cards ---- */
.jc-card,.jc-fac,.jc-quote,.jc-ev{transition:border-color 180ms ease,box-shadow 180ms ease,
  transform 180ms ease}
.jc-card:hover,.jc-fac:hover{border-color:var(--line-strong);box-shadow:var(--shadow);
  transform:translateY(-2px)}
.jc-card a img,.jc-fac img{transition:transform 420ms cubic-bezier(.22,.61,.36,1)}
.jc-card:hover a img,.jc-fac:hover img{transform:scale(1.035)}
.jc-card,.jc-fac{overflow:hidden}
.jc-qa{transition:background-color 160ms ease}
.jc-qa-num{transition:border-color 160ms ease,color 160ms ease}
.jc-qa:hover .jc-qa-num{border-color:var(--brand);color:var(--brand-text)}
.jc-news-item h3 a,.jc-card h3 a{transition:color 140ms ease}
.jc-news-item:hover h3 a,.jc-card:hover h3 a{color:var(--brand-text)}

/* ---- reveal on scroll (class added by JS only, so no-JS shows everything) ---- */
.jc-reveal{opacity:0;transform:translateY(14px);
  transition:opacity 620ms cubic-bezier(.22,.61,.36,1),transform 620ms cubic-bezier(.22,.61,.36,1)}
.jc-reveal.is-in{opacity:1;transform:none}

/* ---- hero copy entrance ---- */
@keyframes jcRise{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
.jc-hero-in > *{animation:jcRise 700ms cubic-bezier(.22,.61,.36,1) both}
.jc-hero-in > *:nth-child(1){animation-delay:60ms}
.jc-hero-in > *:nth-child(2){animation-delay:150ms}
.jc-hero-in > *:nth-child(3){animation-delay:240ms}
.jc-hero-in > *:nth-child(4){animation-delay:330ms}

/* ---- mobile ---- */
@media (max-width:760px){
  .jc-wrap{padding-left:18px;padding-right:18px}
  .jc-utility{font-size:12.5px}
  .jc-utility .jc-wrap{gap:14px;row-gap:4px}
  .jc-utility .jc-right{margin-left:0;width:100%;gap:14px}
  .jc-masthead .jc-wrap{gap:12px;padding-top:12px;padding-bottom:12px}
  .jc-crest{width:44px}
  .jc-wordmark .n1{font-size:15px}
  .jc-wordmark .n2{font-size:10px;letter-spacing:.06em}
  .jc-hero h1{font-size:clamp(27px,7vw,36px)}
  .jc-hero p{font-size:16px}
  .jc-hero-in{padding-top:44px;padding-bottom:76px}
  .jc-hero-actions{gap:9px}
  .jc-hero-actions .jc-btn{flex:1 1 auto;max-width:none}
  .jc-hero-nav{margin-top:26px;gap:12px}
  .jc-sec-head{margin-bottom:26px}
  .jc-banner{padding-top:32px;padding-bottom:32px}
  .jc-banner h1{font-size:clamp(24px,6.4vw,32px)}
  .jc-inner{gap:28px}
  .jc-aside{padding:18px}
  .jc-prose{max-width:none}
  .jc-prose table{font-size:14px}
  .jc-prose th,.jc-prose td{padding:9px 11px}
  .jc-foot-grid{gap:28px}
  .jc-foot-bottom{flex-direction:column;gap:8px}
  .jc-quote{padding:20px}
}
@media (hover:none){
  .jc-card:hover,.jc-fac:hover{transform:none;box-shadow:none}
  .jc-card:hover a img,.jc-fac:hover img{transform:none}
}
@media (prefers-reduced-motion:reduce){
  .jc-reveal{opacity:1;transform:none;transition:none}
  .jc-hero-in > *{animation:none}
  .jc-card,.jc-fac,.jc-btn,.jc a{transition:none}
}


/* === mobile menu accordion === */
@media (max-width:980px){
  .jc-navbar.is-shown .jc-nav{max-height:calc(100vh - 150px);overflow-y:auto;
    -webkit-overflow-scrolling:touch}
  .jc-navbar.is-shown .jc-drop-menu{display:none;padding:2px 0 8px 14px;
    border-left:2px solid var(--line)}
  .jc-navbar.is-shown .jc-drop.is-open .jc-drop-menu{display:block}
  .jc-navbar.is-shown .jc-drop > button{border-bottom:1px solid var(--line);border-radius:0}
  .jc-navbar.is-shown .jc-nav > a{border-bottom:1px solid var(--line);border-radius:0}
  .jc-navbar.is-shown .jc-drop.is-open > button{color:var(--brand-text)}
  .jc-navbar.is-shown .jc-drop > button .jc-caret{transition:transform 180ms ease;
    transform:rotate(45deg) translateY(-2px)}
  .jc-navbar.is-shown .jc-drop.is-open > button .jc-caret{transform:rotate(-135deg) translateY(-2px)}
  .jc-navbar.is-shown .jc-nav > a::after{display:none}
  .jc-navbar.is-shown .jc-drop > button::after{display:none}
  .jc-drop-menu a{padding:9px 10px}
}


/* === page pictures + programme page === */
.jc-portrait{margin:0 0 20px;padding:0;border:1px solid var(--line);background:var(--surface-2)}
.jc-portrait img{width:100%;height:auto;display:block}
.jc-shots{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:16px;
  margin:34px 0 8px;clear:both}
.jc-shot{margin:0;border:1px solid var(--line);background:var(--surface);overflow:hidden}
.jc-shot img{width:100%;aspect-ratio:4/3;object-fit:cover;display:block;margin:0;border:0;
  transition:transform 420ms cubic-bezier(.22,.61,.36,1)}
.jc-shot:hover img{transform:scale(1.04)}
.jc-shot figcaption{padding:11px 14px;font-size:13px;color:var(--muted);line-height:1.45;
  border-top:1px solid var(--line)}
.jc-shots.is-single{grid-template-columns:1fr;max-width:620px}

/* programme (course) page */
.jc-hero-page{position:relative;background:#1B191B;overflow:hidden}
.jc-hero-page img{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover;opacity:.5}
.jc-hero-page .jc-scrim{position:absolute;top:0;left:0;right:0;bottom:0;
  background:linear-gradient(150deg,rgba(30,26,30,.86) 0%,rgba(20,16,20,.94) 100%)}
.jc-hero-page .jc-wrap{position:relative;padding-top:54px;padding-bottom:54px}
.jc-hero-page .jc-crumb{color:rgba(255,255,255,.7)}
.jc-hero-page .jc-crumb a{color:rgba(255,255,255,.7)}
.jc-hero-page h1{color:#fff;font-size:clamp(28px,4vw,42px);margin-top:10px;max-width:20ch}
.jc-hero-page .jc-dept{display:inline-block;margin-top:16px;font-size:11.5px;font-weight:700;
  letter-spacing:.16em;text-transform:uppercase;color:#E0BCDE;border:1px solid rgba(255,255,255,.28);
  padding:6px 12px;border-radius:100px}
.jc-facts-card{background:var(--surface);border:1px solid var(--line)}
.jc-facts-card h3{font-size:16px;padding:16px 18px;margin:0;border-bottom:1px solid var(--line);
  background:var(--surface-2)}
.jc-facts-card dl{margin:0;padding:6px 18px 14px}
.jc-facts-card dt{font-size:11.5px;font-weight:700;letter-spacing:.09em;text-transform:uppercase;
  color:var(--muted);margin-top:14px}
.jc-facts-card dd{margin:3px 0 0;font-size:15.5px;color:var(--ink)}
.jc-apply-card{background:var(--plum-2);color:var(--on-plum);padding:22px;margin-top:16px}
.jc-apply-card h3{color:#fff;font-size:19px;margin-bottom:8px}
.jc-apply-card p{font-size:14px;color:var(--on-plum);opacity:.9;margin-bottom:16px}
@media (max-width:760px){
  .jc-shots{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px;margin-top:26px}
  .jc-shot figcaption{padding:9px 11px;font-size:12.5px}
}


/* === careers === */
.jc-jobs{display:flex;flex-direction:column;gap:14px}
.jc-job{display:flex;gap:24px;align-items:center;justify-content:space-between;
  background:var(--surface);border:1px solid var(--line);padding:24px 26px;
  transition:border-color 180ms ease,box-shadow 180ms ease}
.jc-job:hover{border-color:var(--line-strong);box-shadow:var(--shadow)}
.jc-job-main{min-width:0}
.jc-job h2{font-size:22px;margin-bottom:6px}
.jc-job h2 a{color:var(--ink)}
.jc-job h2 a:hover{color:var(--brand-text);text-decoration:none}
.jc-job p{color:var(--muted);font-size:14.5px;max-width:62ch}
.jc-job-tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.jc-job-tags span{font-size:11.5px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;
  color:var(--brand-text);background:var(--brand-soft);border:1px solid var(--line);
  padding:4px 10px;border-radius:100px}
.jc-job-side{flex:none;text-align:right;display:flex;flex-direction:column;gap:12px;align-items:flex-end}
.jc-job-close{font-size:13px;color:var(--muted);line-height:1.3}
.jc-job-close span{display:block;font-size:11px;letter-spacing:.1em;text-transform:uppercase}
.jc-job-close strong{color:var(--ink);font-size:15px;font-variant-numeric:tabular-nums}
.jc-empty{background:var(--surface);border:1px solid var(--line);padding:44px 32px;text-align:center}
.jc-empty h2{font-size:24px;margin-bottom:10px}
.jc-empty p{color:var(--muted);max-width:52ch;margin:0 auto}
@media (max-width:760px){
  .jc-job{flex-direction:column;align-items:flex-start;gap:16px;padding:20px}
  .jc-job-side{text-align:left;align-items:flex-start;flex-direction:row;gap:18px;width:100%;
    justify-content:space-between}
}

/* --- home feature strip: stay balanced whatever the item count --- */
.jc .jc-facts{display:flex !important;flex-wrap:wrap;justify-content:center;align-items:stretch;gap:22px 26px}
.jc .jc-facts > .jc-fact{flex:1 1 250px;max-width:340px;min-width:230px;display:flex;flex-direction:column;justify-content:center}
@media (max-width:760px){.jc .jc-facts{gap:16px}.jc .jc-facts > .jc-fact{flex:1 1 100%;max-width:none;min-width:0}}

/* --- vacancy application form --- */
.jc .jc-applyform{background:#fff;border:1px solid #e7e1e8;border-radius:14px;padding:34px 32px;max-width:920px;margin:0 auto}
.jc .jc-applyform-head{margin-bottom:26px}
.jc .jc-applyform-head h2{font-size:clamp(23px,2.6vw,30px);margin:8px 0 8px}
.jc .jc-applyform-head p{color:var(--muted);margin:0;max-width:58ch}
.jc .jc-applyform .jc-fields{display:grid;grid-template-columns:1fr 1fr;gap:18px 24px}
.jc .jc-applyform .jc-fields > label{display:flex;flex-direction:column;gap:7px;font-size:14px}
.jc .jc-applyform .jc-fields > label > span{font-weight:600;color:#3c3540;letter-spacing:.01em}
.jc .jc-applyform .jc-fields > label > span i{color:#963094;font-style:normal}
.jc .jc-applyform .jc-fields input,
.jc .jc-applyform .jc-fields select,
.jc .jc-applyform .jc-fields textarea{font:inherit;font-size:15px;color:#191719;background:#fdfcfd;border:1px solid #ded6df;border-radius:9px;padding:11px 13px;width:100%;transition:border-color .15s ease,box-shadow .15s ease}
.jc .jc-applyform .jc-fields input:focus,
.jc .jc-applyform .jc-fields select:focus,
.jc .jc-applyform .jc-fields textarea:focus{outline:none;border-color:#963094;box-shadow:0 0 0 3px rgba(150,48,148,.13)}
.jc .jc-applyform .jc-fields textarea{resize:vertical;min-height:112px}
.jc .jc-applyform .jc-wide{grid-column:1 / -1}
.jc .jc-applyform-foot{display:flex;align-items:center;gap:18px;flex-wrap:wrap;margin-top:6px}
.jc .jc-applyform-foot span{font-size:13px;color:#7d7480}
.jc .jc-note{border-radius:10px;padding:13px 16px;margin-bottom:20px;font-size:14px;line-height:1.55}
.jc .jc-note.is-good{background:#f0f7f1;border:1px solid #cfe6d3;color:#245c31}
.jc .jc-note.is-bad{background:#fdf2f2;border:1px solid #f0d3d3;color:#8a2b2b}
@media (max-width:720px){
    .jc .jc-applyform{padding:26px 20px}
    .jc .jc-applyform .jc-fields{grid-template-columns:1fr}
}

/* --- page sidebar: travels with the reader, and ends with a way in --- */
.jc .jc-aside{align-self:start;position:sticky;top:24px}
@media (max-width:900px){ .jc .jc-aside{position:static} }

.jc .jc-side-news{list-style:none;margin:0;padding:0}
.jc .jc-side-news li{padding:9px 0;border-bottom:1px solid #ece7ed}
.jc .jc-side-news li:last-child{border-bottom:0}
.jc .jc-side-news li a{display:block;font-weight:600;line-height:1.4;font-size:14px}
.jc .jc-side-news li span{display:block;margin-top:3px;font-size:12px;color:#8a8090;letter-spacing:.02em}

.jc .jc-side-cta{margin-top:26px;padding:20px 20px 22px;border-radius:12px;background:#4A1A49;color:#fff}
.jc .jc-side-cta h3{margin:0 0 8px;color:#fff;font-size:17px}
.jc .jc-side-cta p{margin:0 0 16px;font-size:13.5px;line-height:1.6;color:#e6dbe6}
.jc .jc-side-cta .jc-btn-primary{display:inline-block;width:100%;text-align:center;margin-bottom:12px}
.jc .jc-side-cta .jc-side-link{display:block;font-size:13.5px;font-weight:600;color:#f0d9ef;padding:5px 0;text-decoration:none}
.jc .jc-side-cta .jc-side-link:hover{color:#fff;text-decoration:underline}

/* --- mobile: grid children must be allowed to shrink -----------------
   Grid and flex items default to min-width:auto, so a wide table inside
   the prose column pushed the whole page wider than the phone screen.
   That is what made the banner, header and footer stop short of the
   right edge. Letting the children shrink lets the table scroll inside
   its own wrapper instead of dragging the page sideways. */
.jc .jc-inner > *,
.jc .jc-prose,
.jc .jc-aside{min-width:0}

.jc .jc-table-scroll{max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}
.jc .jc-prose table{min-width:520px}

/* long, unbreakable strings (email addresses, URLs) must not set the floor */
.jc .jc-prose,
.jc .jc-aside{overflow-wrap:anywhere}

/* nothing on the page may scroll the body sideways */
.jc body,
body.jc{overflow-x:hidden}

/* ================= justified body text ================= */
.jc .jc-prose p,
.jc .jc-prose li{text-align:justify;text-justify:inter-word;hyphens:auto;-webkit-hyphens:auto}
.jc .jc-prose .jc-person p,
.jc .jc-prose .jc-profile p,
.jc .jc-prose figcaption,
.jc .jc-prose .jc-meta{text-align:left;hyphens:manual}

/* ================= people cards ================= */
.jc .jc-people{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:16px;margin:20px 0 30px}
.jc .jc-person{border:1px solid #e7e1e8;border-radius:12px;padding:18px 18px 16px;background:#fff;display:flex;flex-direction:column;gap:6px}
.jc .jc-person-role{font-size:11.5px;font-weight:700;letter-spacing:.09em;text-transform:uppercase;color:#963094}
.jc .jc-person-name{font-family:var(--display,Newsreader),Georgia,serif;font-size:19px;line-height:1.25;color:#191719}
.jc .jc-person-cred{font-size:12.5px;line-height:1.5;color:#6b6270}
.jc .jc-person-duty{font-size:13.5px;line-height:1.55;color:#4a444d;margin:4px 0 0;text-align:left}
.jc .jc-person.is-vacant{background:#fbf9fb;border-style:dashed}
.jc .jc-person.is-vacant .jc-person-name{color:#8a8090;font-style:italic;font-size:16px}

/* ================= single profile card ================= */
.jc .jc-profile{border:1px solid #e7e1e8;border-radius:14px;padding:24px 24px 20px;background:#fff;margin:20px 0 30px}
.jc .jc-profile-name{font-family:var(--display,Newsreader),Georgia,serif;font-size:clamp(21px,2.4vw,26px);line-height:1.2;color:#191719}
.jc .jc-profile-role{font-size:11.5px;font-weight:700;letter-spacing:.09em;text-transform:uppercase;color:#963094;margin-top:5px}
.jc .jc-profile-cred{list-style:none;margin:18px 0 0;padding:0;border-top:1px solid #efeaf0;padding-top:16px}
.jc .jc-profile-cred li{position:relative;padding-left:18px;margin:0 0 8px;font-size:14px;line-height:1.55;color:#4a444d;text-align:left}
.jc .jc-profile-cred li:before{content:"";position:absolute;left:0;top:8px;width:7px;height:7px;border-radius:50%;background:#963094}
.jc .jc-profile-meta{margin:18px 0 0;padding-top:16px;border-top:1px solid #efeaf0;display:grid;gap:12px}
.jc .jc-profile-meta > div{display:grid;grid-template-columns:132px 1fr;gap:10px}
.jc .jc-profile-meta dt{font-size:12px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:#8a8090;margin:0}
.jc .jc-profile-meta dd{margin:0;font-size:14px;line-height:1.5;color:#191719}
@media (max-width:560px){
  .jc .jc-profile{padding:20px 18px 18px}
  .jc .jc-profile-meta > div{grid-template-columns:1fr;gap:2px}
}

/* ============================================================
   FOOTER CARDS
   Each footer group sits in its own panel on the plum ground,
   with its own accent colour: orchid for the college block,
   gold for Our Links, teal for About, periwinkle for Portal.
   ============================================================ */
.jc .jc-foot-grid{align-items:stretch}

.jc .jc-foot-grid > div{
    --c:#C77DC4;
    position:relative;
    background:linear-gradient(180deg,rgba(255,255,255,.075),rgba(255,255,255,.025));
    border:1px solid rgba(255,255,255,.10);
    border-radius:14px;
    padding:20px 20px 17px;
    overflow:hidden;
    transition:border-color .2s ease,background-color .2s ease;
}
.jc .jc-foot-grid > div::before{
    content:'';position:absolute;left:0;right:0;top:0;height:3px;
    background:linear-gradient(90deg,var(--c),rgba(255,255,255,0));
}
.jc .jc-foot-grid > div:hover{border-color:rgba(255,255,255,.17)}
.jc .jc-foot-grid > div:nth-child(1){--c:#C77DC4}
.jc .jc-foot-grid > div:nth-child(2){--c:#E0B95C}
.jc .jc-foot-grid > div:nth-child(3){--c:#55C3B0}
.jc .jc-foot-grid > div:nth-child(4){--c:#93B4F2}

/* headings */
.jc .jc-footer .jc-foot-grid > div > h4{
    color:var(--c);
    font-size:11.5px;letter-spacing:.14em;
    margin:1px 0 13px;padding-bottom:10px;
    border-bottom:1px solid rgba(255,255,255,.09);
}
.jc .jc-footer .jc-foot-grid > div:first-child > h4{
    font-family:Newsreader,Georgia,'Times New Roman',serif;
    font-size:17px;line-height:1.32;font-weight:600;
    letter-spacing:.005em;text-transform:none;color:#fff;
}

/* link rows */
.jc .jc-footer .jc-foot-grid > div > ul{gap:1px}
.jc .jc-footer .jc-foot-grid > div > ul li a{
    display:block;border-radius:8px;
    padding:7px 9px 7px 9px;margin-left:-9px;
    color:rgba(255,255,255,.74);
    font-size:14px;line-height:1.35;
    transition:color .16s ease,background-color .16s ease,transform .16s ease;
}
.jc .jc-footer .jc-foot-grid > div > ul li a:hover{
    color:#fff;background:rgba(255,255,255,.075);transform:translateX(3px);
}

/* the college block */
.jc .jc-footer .jc-foot-grid > div:first-child p{
    color:rgba(255,255,255,.68);line-height:1.7;font-size:14px;
}
.jc .jc-footer .jc-foot-grid > div:first-child .jc-social a{
    border-color:rgba(255,255,255,.20);color:rgba(255,255,255,.8);
}
.jc .jc-footer .jc-foot-grid > div:first-child .jc-social a:hover{
    background:var(--c);border-color:var(--c);color:#201C20;
}

/* --- two-up from tablet down --- */
@media (max-width:900px){
    .jc .jc-foot-grid{grid-template-columns:1fr 1fr;gap:14px}
    .jc .jc-foot-grid > div:first-child{grid-column:1 / -1}
}
@media (max-width:520px){
    /* stay two-up on phones: a single column made the footer taller
       than the page above it */
    .jc .jc-foot-grid{grid-template-columns:1fr 1fr;gap:11px}
    .jc .jc-foot-grid > div{padding:15px 14px 12px}
    .jc .jc-foot-grid > div:first-child{padding:18px 17px 15px}
    .jc .jc-footer .jc-foot-grid > div > h4{font-size:10.5px;letter-spacing:.1em;margin-bottom:11px;padding-bottom:8px}
    .jc .jc-footer .jc-foot-grid > div:first-child > h4{font-size:16px}
    .jc .jc-footer .jc-foot-grid > div > ul li a{font-size:13.5px;padding:6px 7px;margin-left:-7px}
    /* the last card fills the row rather than sitting alone */
    .jc .jc-foot-grid > div:last-child{grid-column:1 / -1}
    .jc .jc-foot-grid > div:last-child > ul{display:grid;grid-template-columns:1fr 1fr;column-gap:12px}
}
