/*
 * Public school profile — a reusable editorial layer for every JKUSA school.
 * It intentionally augments the global site rather than introducing another UI kit.
 */
:root { --school-ink:#10213e; --school-blue:#1657b8; --school-teal:#0c8273; --school-mist:#f4f8fc; --school-rule:#dce6f0; }
body { color:var(--school-ink); }
.hero { min-height:clamp(29rem, 62vw, 42rem); isolation:isolate; background-position:center; }
.hero::after { content:""; position:absolute; z-index:-1; inset:auto -8% -15rem auto; width:32rem; height:32rem; border-radius:50%; background:radial-gradient(circle,rgba(47,161,222,.35),transparent 68%); }
.hero::before { background:linear-gradient(90deg,rgba(7,18,39,.93) 0%,rgba(9,28,57,.79) 49%,rgba(8,24,47,.24) 100%); }
.hero .inner { padding-block:5.5rem 4rem; }
.hero h1 { max-width:850px; font-size:clamp(2.65rem,6vw,5.35rem); letter-spacing:-.06em; }
.hero .tag { max-width:620px; font-size:clamp(1.05rem,2vw,1.27rem); }
.hero .breadcrumb { font-size:.8rem; letter-spacing:.03em; }
.hero-actions .btn { min-height:46px; display:inline-flex; align-items:center; gap:.45rem; }
.sticky-nav { box-shadow:0 8px 28px rgba(16,33,62,.06); }
.sticky-nav .nav-link { letter-spacing:.01em; }
.sec { padding-block:clamp(3.7rem,7vw,6.8rem); }
.sec-alt { background:linear-gradient(180deg,#f7faff 0%,#f3f8f8 100%); }
.sec-title { color:var(--school-ink); font-size:clamp(2rem,3.4vw,3.1rem); letter-spacing:-.045em; }
.section-kicker { color:var(--school-teal); }
.facts-grid { gap:0; border:1px solid var(--school-rule); border-radius:1.25rem; overflow:hidden; background:#fff; box-shadow:0 18px 40px rgba(21,55,90,.07); }
.fact { border:0; border-right:1px solid var(--school-rule); border-radius:0; padding:1.5rem 1rem; }
.fact:last-child { border-right:0; }
.fact .num { color:var(--school-blue); }
.quick-action { display:flex; align-items:center; gap:1rem; padding:1rem 1.1rem; color:var(--school-ink); text-decoration:none; background:#fff; border:1px solid var(--school-rule); border-radius:1rem; transition:transform .2s, box-shadow .2s, border-color .2s; }
.quick-action:hover { color:var(--school-ink); transform:translateX(5px); border-color:#90b4df; box-shadow:0 12px 22px rgba(22,87,184,.1); }
.qa-icon { flex:0 0 2.65rem; width:2.65rem; height:2.65rem; display:grid; place-items:center; color:var(--school-blue); background:#eaf2ff; border-radius:.8rem; }
.dept-block { position:relative; overflow:hidden; border:1px solid var(--school-rule); border-radius:1.25rem; padding:clamp(1.3rem,3vw,2.2rem); }
.dept-block::before { content:""; position:absolute; width:5rem; height:5rem; right:-2.25rem; top:-2.25rem; border-radius:50%; background:#e9f6f3; }
.prog-card { height:100%; border-color:#e3ebf4; background:#fbfdff; }
.announce-featured { background:linear-gradient(125deg,#10213e,#1657b8); box-shadow:0 20px 38px rgba(16,33,62,.19); }
.event-featured { border-radius:1.25rem; }
.rep-hero-card { border-color:#cde2de; box-shadow:0 15px 28px rgba(12,130,115,.08); }
.representation-divider { height:1px; background:var(--school-rule); margin:2.5rem 0; }
.dept-rep-card { height:100%; display:flex; align-items:center; gap:.85rem; padding:1rem; background:#fff; border:1px solid var(--school-rule); border-radius:1rem; }
.dept-rep-card img { width:3rem; height:3rem; object-fit:cover; border-radius:50%; border:2px solid #e7f1ef; }
.dept-rep-school { margin-bottom:.12rem; color:var(--school-teal); font-size:.72rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase; }
.resource-link { margin-bottom:.65rem; border-color:var(--school-rule); }
.contact-card { border-color:var(--school-rule); box-shadow:0 16px 35px rgba(16,33,62,.06); }
.related-card { padding:1.2rem; border-radius:1rem; }
@media (max-width:767.98px) { .hero .inner { padding-block:4.5rem 2.5rem; } .facts-grid { border-radius:1rem; } .fact:nth-child(2n) { border-right:0; } .fact:nth-child(-n+2) { border-bottom:1px solid var(--school-rule); } .sticky-nav .nav-link { padding-inline:.85rem; } }
