﻿/* Shared header and footer of the collegiate site: the homepage and every inner page link this file.
   Rules are scoped to .site-header / .site-footer, and the palette is set on them, so an inner page's own
   tokens (its --paper, --ink, .brand ...) neither change the shell nor are changed by it. */
@font-face{font-family:EditorialSerif;src:url('63af50883524-serif.woff2?v=collegiate7') format('woff2');font-weight:200 900;font-display:swap}
@font-face{font-family:EditorialSans;src:url('dda18643aa79-sans.woff2?v=collegiate7') format('woff2');font-weight:100 900;font-display:swap}
@font-face{font-family:EditorialLatin;src:url('2a58a76e1b33-cinzel.woff2?v=collegiate7') format('woff2');font-weight:400 900;font-display:swap}
.site-header,.site-footer{--paper:#faf9f6;--ink:#272725;--muted:#615d58;--accent:#702a36;--rule:#d7d3cb;--serif:EditorialSerif,'Songti SC',serif;--sans:EditorialSans,'PingFang SC',sans-serif;--latin:EditorialLatin,Georgia,serif;--gutter:clamp(24px,4.45vw,72px);--ease:cubic-bezier(.16,1,.3,1);--header-h:84px;--bar-h:56px;font:400 17px/1.75 var(--sans);-webkit-font-smoothing:antialiased;font-synthesis:none;overflow-wrap:normal}
.site-header *,.site-footer *{box-sizing:border-box}
.site-header :is(h2,p,ul,ol,address),.site-footer :is(h2,p,ul,ol,address){margin:0;padding:0;list-style:none}
.site-header a,.site-footer a{color:inherit;text-decoration:none;transition:color .18s var(--ease)}
.site-header a:hover,.site-footer a:hover{text-decoration:underline;text-underline-offset:5px}
.site-header a:focus-visible,.site-header summary:focus-visible{outline:2px solid var(--accent);outline-offset:5px}
.site-footer a:focus-visible{outline:2px solid var(--paper);outline-offset:5px}
.site-footer .arrow{font-family:var(--sans);font-weight:400;margin-left:12px;font-size:1em}
.site-footer .text-link{display:inline-flex;align-items:center;min-height:44px;font-size:14px;white-space:nowrap}
.site-footer .text-link .arrow{margin-left:22px}

/* Header: full masthead at the top of the page, a compact bar that hides on the way down and returns on the way up. */
.site-header{position:relative;z-index:10;height:var(--header-h);color:var(--ink)}
.site-header .header-bar{background:var(--paper)}
.site-header .header-inner{display:flex;align-items:center;justify-content:space-between;gap:28px;height:var(--header-h)}
.site-header:not([data-state="top"]) .header-bar{position:fixed;top:0;left:0;right:0;border-bottom:1px solid var(--rule);transition:transform .22s var(--ease)}
.site-header[data-state="hidden"] .header-bar{transform:translateY(calc(-100% - 1px))}
.site-header.instant .header-bar{transition:none}
.site-header:not([data-state="top"]) .header-inner{height:var(--bar-h)}
.site-header .brand{display:block;flex-shrink:0;padding:0;line-height:normal;color:var(--accent)}
.site-header .brand:hover{text-decoration:none}
.site-header .brand-cn{display:block;font:600 22px/1.4 var(--serif);letter-spacing:.045em;white-space:nowrap}
.site-header .brand-en{display:block;font:500 11px/1.5 var(--latin);letter-spacing:.13em;margin-top:5px}
.site-header:not([data-state="top"]) .brand-cn{font-size:18px}
.site-header:not([data-state="top"]) .brand-en{display:none}
.site-header .desktop-nav{display:flex;gap:clamp(16px,1.85vw,29px);align-items:center;font-size:14px}
.site-header .desktop-nav a{position:relative;display:flex;align-items:center;min-height:44px;white-space:nowrap}
.site-header .desktop-nav a::after{position:absolute;bottom:4px;left:0;right:0;height:1px;background:var(--accent);content:'';transform:scaleX(0);transform-origin:left;transition:transform .22s var(--ease)}
.site-header .desktop-nav a:hover,.site-header .desktop-nav a[aria-current]{text-decoration:none;color:var(--accent)}
.site-header .desktop-nav a:hover::after,.site-header .desktop-nav a[aria-current]::after{transform:scaleX(1)}
.site-header .mobile-menu{display:none}
.site-header .mobile-menu summary{display:flex;align-items:center;gap:10px;min-height:44px;font-size:15px;list-style:none;cursor:pointer;transition:transform .15s var(--ease)}
.site-header .mobile-menu summary:active{transform:translateY(1px)}
.site-header .mobile-menu summary::-webkit-details-marker{display:none}
.site-header .mobile-menu svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.4}
.site-header .menu-current{display:none;color:var(--muted)}
.site-header .menu-current::after{content:'·';margin-left:8px}
.site-header:not([data-state="top"]) .menu-current:not(:empty){display:inline}
.site-header .mobile-menu nav{position:absolute;top:100%;left:var(--gutter);right:var(--gutter);display:grid;grid-template-columns:1fr 1fr;column-gap:24px;padding:14px 20px;background:var(--paper);border:1px solid var(--rule);animation:sheet-open .24s var(--ease)}
.site-header .mobile-menu nav a{display:flex;align-items:center;min-height:44px;font-size:15px}
.site-header .mobile-menu nav a[aria-current]{color:var(--accent)}
.site-header .mobile-menu[open] summary{color:var(--accent)}
@keyframes sheet-open{from{opacity:.88;transform:translateY(-6px)}to{opacity:1;transform:none}}

/* Footer: identity, platforms, contact. */
.site-footer{padding-block:50px 26px;background:var(--accent);color:var(--paper)}
.site-footer .footer-top{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1.2fr) minmax(0,1fr);gap:56px;padding-bottom:37px}
.site-footer .footer-dept{font:500 38px/1.4 var(--serif);letter-spacing:.06em}
.site-footer .footer-inst{margin-top:13px;font:500 18px/1.7 var(--serif)}
.site-footer .footer-en{max-width:400px;margin-top:10px;font:400 12px/1.9 var(--latin);letter-spacing:.06em}
.site-footer .footer-label{margin-bottom:14px;font:400 22px/1.6 var(--serif)}
.site-footer .footer-platforms li{padding:7px 0;border-top:1px solid #ffffff2e;font-size:15px;line-height:1.7}
.site-footer .footer-platforms li:first-child{border-top:0;padding-top:0}
.site-footer .contact-data address{font-style:normal;font-size:16px;line-height:2}
.site-footer .contact-data .text-link{margin-top:10px}
.site-footer .recruit{margin:0 0 18px;padding:0 0 16px;border-top:0;border-bottom:1px solid #ffffff2e}
.site-footer .recruit-title{font:500 15px/1.7 var(--sans)}
.site-footer .recruit-empty,.site-footer .recruit-list{margin-top:4px;font-size:15px;line-height:1.8;opacity:.86}
.site-footer .footer-nav{display:flex;flex-wrap:wrap;align-items:center;gap:15px 27px;padding-top:17px;border-top:1px solid #ffffff3a;font-size:13px}
.site-footer .footer-link{display:flex;align-items:center;min-height:36px}
.site-footer .to-top{display:flex;align-items:center;gap:20px;min-height:36px;margin-left:auto}

@media(max-width:1100px){
  .site-header .desktop-nav{gap:15px;font-size:13px}
  .site-header .brand-cn{font-size:21px}
  .site-footer .footer-top{grid-template-columns:1fr 1fr;gap:40px}
  .site-footer .footer-id{grid-column:1/-1}
}
@media(max-width:900px){
  .site-header{--header-h:80px}
  .site-header .desktop-nav{display:none}
  .site-header .mobile-menu{display:block}
  .site-footer .footer-nav{gap:12px 20px}
}
@media(max-width:650px){
  .site-header,.site-footer{--gutter:24px}
  .site-header{--header-h:76px;--bar-h:52px}
  .site-header .header-inner{gap:18px}
  .site-header .brand-cn{font-size:20px}
  .site-header .brand-en{margin-top:4px}
  .site-header:not([data-state="top"]) .brand-cn{font-size:17px}
  .site-header .mobile-menu summary{gap:8px;font-size:14px}
  .site-header .mobile-menu nav{left:20px;right:20px}
  .site-footer{padding-block:36px 22px}
  .site-footer .footer-top{grid-template-columns:1fr;gap:28px;padding-bottom:27px}
  .site-footer .footer-dept{font-size:34px}
  .site-footer .footer-inst{margin-top:9px;font-size:17px}
  .site-footer .footer-en{max-width:315px;font-size:11px;line-height:1.8;letter-spacing:.03em}
  .site-footer .footer-label{margin-bottom:10px;font-size:21px}
  .site-footer .contact-data address{font-size:15px}
  .site-footer .footer-nav{display:grid;grid-template-columns:1fr 1fr;gap:8px 15px}
  .site-footer .footer-link{min-height:44px}
  .site-footer .to-top{grid-column:1/-1;margin:10px 0 0;min-height:44px;font-size:14px}
}
@media(prefers-reduced-motion:reduce){.site-header *,.site-footer *{transition:none!important;animation:none!important}}
html[data-motion="reduced"] .site-header *,html[data-motion="reduced"] .site-footer *{transition:none!important;animation:none!important}
