
:root{
  --ink:#10243d;
  --ink-soft:#253a54;
  --muted:#5f6f82;
  --line:#d7e3f1;
  --panel:#ffffff;
  --panel-soft:#f6f9fc;
  --navy:#123d73;
  --blue:#245e9a;
  --blue-soft:#e4eef9;
  --accent:#3879c3;
  --gold:#b3894f;
  --shadow:0 18px 45px rgba(16,36,61,.10);
  --radius:22px;
  --radius-sm:16px;
  --max:1180px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  color:var(--ink);
  background:
    radial-gradient(1000px 320px at 10% -10%, rgba(56,121,195,.20), transparent 55%),
    radial-gradient(800px 260px at 100% 0%, rgba(18,61,115,.11), transparent 50%),
    linear-gradient(180deg,#f8fbff 0%, #f5f8fc 100%);
  font:16px/1.65 ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}
img{max-width:100%; display:block}
a{color:var(--blue); text-decoration:none}
a:hover{text-decoration:underline}
.container{width:min(var(--max), calc(100% - 32px)); margin:0 auto}
.skip-link{
  position:absolute; left:-999px; top:0; background:#fff; color:#000; padding:8px 12px; z-index:1000;
}
.skip-link:focus{left:12px; top:12px}
.site-header{
  position:sticky; top:0; z-index:40;
  backdrop-filter: blur(14px);
  background:rgba(248,251,255,.84);
  border-bottom:1px solid rgba(215,227,241,.85);
}
.nav-wrap{
  display:flex; align-items:center; justify-content:space-between; gap:20px;
  min-height:76px;
}
.brand{
  display:flex; align-items:center; gap:14px;
  color:var(--ink); text-decoration:none;
}
.brand-logo{
  width:96px; height:auto; display:block; flex:0 0 auto;
  opacity:.96;
}
.brand-mark{
  width:46px; height:46px; border-radius:14px;
  background:linear-gradient(145deg, var(--navy), var(--accent));
  color:#fff; display:grid; place-items:center; font-weight:800; letter-spacing:.04em;
  box-shadow:0 10px 22px rgba(18,61,115,.28);
}
.brand-copy small{display:block; color:var(--muted); font-size:.68rem; letter-spacing:.06em; text-transform:uppercase}
.brand-copy strong{display:block; font-family:Georgia, "Times New Roman", serif; font-size:1rem; letter-spacing:.01em}
.nav-links{
  display:flex; flex-wrap:wrap; gap:18px 22px; align-items:center; justify-content:flex-end;
}
.nav-links a{
  color:var(--ink-soft); font-weight:600; font-size:.97rem; text-decoration:none;
}
.nav-links a:hover{color:var(--blue)}
.hero{
  padding:64px 0 36px;
}
.hero-grid{
  display:grid; grid-template-columns: 1.28fr .88fr; gap:28px; align-items:start;
}
.hero-panel{
  background:linear-gradient(145deg, rgba(255,255,255,.95), rgba(246,249,252,.92));
  border:1px solid rgba(215,227,241,.95);
  border-radius:calc(var(--radius) + 6px);
  box-shadow:var(--shadow);
  padding:34px;
}
.kicker{
  display:inline-flex; align-items:center; gap:10px;
  padding:8px 14px; border-radius:999px;
  background:var(--blue-soft);
  border:1px solid #d3e3f6;
  color:var(--navy); font-weight:700; letter-spacing:.06em; text-transform:uppercase; font-size:.78rem;
}
.hero h1{
  margin:18px 0 10px;
  font-family:Georgia, "Times New Roman", serif;
  font-size:clamp(2.2rem, 5vw, 4rem);
  line-height:1.08;
  letter-spacing:-.02em;
}
.hero .subtitle{
  margin:0 0 18px;
  font-size:1.08rem; color:var(--ink-soft); max-width:63ch;
}
.hero .lede{
  margin:0 0 24px;
  color:var(--muted); max-width:70ch;
}
.cta-row{display:flex; flex-wrap:wrap; gap:12px; margin-top:26px}
.button{
  display:inline-flex; align-items:center; justify-content:center; gap:10px;
  min-height:48px; padding:0 18px; border-radius:14px;
  border:1px solid transparent;
  font-weight:700; text-decoration:none;
}
.button.primary{
  background:linear-gradient(135deg, var(--navy), var(--blue));
  color:#fff;
  box-shadow:0 12px 26px rgba(23,74,130,.22);
}
.button.secondary{
  background:#fff; color:var(--ink); border-color:var(--line);
}
.button.secondary:hover, .button.primary:hover{text-decoration:none; transform:translateY(-1px)}
.hero-side{
  display:grid; gap:16px;
}
.metric-card{
  background:var(--panel);
  border:1px solid var(--line);
  border-radius:var(--radius);
  box-shadow:var(--shadow);
  padding:20px 22px;
}
.metric-card .label{
  color:var(--muted);
  text-transform:uppercase; letter-spacing:.06em; font-size:.74rem; font-weight:700;
}
.metric-card strong{
  display:block; margin-top:6px;
  font-family:Georgia, "Times New Roman", serif;
  font-size:1.45rem; line-height:1.2;
}
.metric-card p{
  margin:8px 0 0; color:var(--muted); font-size:.95rem;
}
section{
  padding:28px 0;
}
.section-head{
  display:flex; align-items:end; justify-content:space-between; gap:18px; margin-bottom:18px;
}
.section-head h2{
  margin:0;
  font-family:Georgia, "Times New Roman", serif;
  font-size:clamp(1.7rem, 2.4vw, 2.35rem);
  line-height:1.15;
}
.section-head p{
  margin:0; max-width:62ch; color:var(--muted);
}
.grid-2{
  display:grid; grid-template-columns:1fr 1fr; gap:24px;
}
.grid-3{
  display:grid; grid-template-columns:repeat(3,1fr); gap:20px;
}
.grid-4{
  display:grid; grid-template-columns:repeat(4,1fr); gap:18px;
}
.card{
  background:var(--panel);
  border:1px solid var(--line);
  border-radius:var(--radius);
  box-shadow:var(--shadow);
  padding:24px;
}
.card h3{
  margin:0 0 10px;
  font-family:Georgia, "Times New Roman", serif;
  font-size:1.3rem;
}
.card p{margin:0; color:var(--muted)}
.accent-line{
  width:72px; height:4px; border-radius:999px;
  background:linear-gradient(90deg,var(--navy),var(--accent));
  margin:0 0 16px;
}
.pill-list{
  display:flex; flex-wrap:wrap; gap:10px;
  margin-top:18px;
}
.pill{
  display:inline-flex; align-items:center;
  padding:8px 12px; border-radius:999px;
  border:1px solid #d6e3f2; background:#fff;
  color:var(--ink-soft); font-weight:700; font-size:.88rem;
}
.feature{
  display:grid; grid-template-columns:1.05fr .95fr; gap:26px; align-items:stretch;
}
.feature-media{
  min-height:100%;
  border-radius:calc(var(--radius) + 4px);
  overflow:hidden; position:relative;
  border:1px solid var(--line);
  box-shadow:var(--shadow);
  background:#dfe8f3;
}
.feature-media img{
  width:100%; height:100%; object-fit:cover; object-position:center;
}
.feature-media .caption{
  position:absolute; inset:auto 16px 16px 16px;
  background:rgba(16,36,61,.72); color:#fff;
  padding:10px 12px; border-radius:12px; font-size:.88rem; line-height:1.45;
}
.figure-card{
  background:#fff;
  border:1px solid var(--line);
  border-radius:var(--radius);
  box-shadow:var(--shadow);
  overflow:hidden;
}
.figure-card img{
  width:100%; aspect-ratio: 13 / 10; object-fit:contain; background:#fff;
}
.figure-card .figure-body{
  padding:18px 20px 22px;
}
.figure-card h3{
  margin:0 0 8px;
  font-family:Georgia, "Times New Roman", serif;
}
.figure-card p{margin:0; color:var(--muted)}
.people-grid{
  display:grid; grid-template-columns:repeat(3, 1fr); gap:20px;
}
.person-card{
  background:var(--panel);
  border:1px solid var(--line);
  border-radius:calc(var(--radius) + 2px);
  box-shadow:var(--shadow);
  overflow:hidden;
}
.person-card .photo{
  aspect-ratio: 4 / 4.55;
  overflow:hidden;
  background:#dbe6f2;
}
.person-card img{
  width:100%; height:100%; object-fit:cover; object-position:center top;
}
.person-card .body{
  padding:20px;
}
.person-card h3{
  margin:0 0 6px;
  font-family:Georgia, "Times New Roman", serif;
  font-size:1.35rem;
}
.affiliation{
  display:inline-block;
  margin:0 0 14px;
  padding:6px 10px;
  border-radius:999px;
  background:var(--blue-soft);
  color:var(--navy);
  font-weight:700;
  font-size:.86rem;
}
.person-card p{margin:0 0 14px; color:var(--muted)}
.link-row{
  display:flex; flex-wrap:wrap; gap:10px;
}
.link-row a{
  display:inline-flex; align-items:center; gap:8px;
  font-weight:700;
}
.note{
  color:var(--muted);
  font-size:.95rem;
}
.dual-list{
  display:grid; grid-template-columns:1fr 1fr; gap:18px;
}
.mini-list{
  background:#fff; border:1px solid var(--line); border-radius:18px; padding:18px 18px 16px;
}
.mini-list h3{
  margin:0 0 10px; font-size:1.15rem;
  font-family:Georgia, "Times New Roman", serif;
}
.mini-list ul{margin:0; padding-left:18px; color:var(--muted)}
.mini-list li + li{margin-top:8px}
.band{
  padding:22px 24px;
  border-radius:var(--radius);
  background:linear-gradient(135deg, rgba(23,74,130,.96), rgba(47,111,177,.96));
  color:#fff;
  box-shadow:0 18px 45px rgba(23,74,130,.20);
}
.band h2, .band h3{color:#fff}
.band p{color:rgba(255,255,255,.9)}
.band .button.secondary{
  background:rgba(255,255,255,.12);
  border-color:rgba(255,255,255,.25);
  color:#fff;
}
.footer{
  padding:28px 0 40px;
  color:var(--muted);
}
.footer-box{
  border-top:1px solid var(--line);
  padding-top:24px;
  display:flex; justify-content:space-between; gap:18px; flex-wrap:wrap;
}
.subnav{
  display:flex; flex-wrap:wrap; gap:12px 18px;
}
.subnav a{color:var(--muted); font-weight:600}
.hero-panel .small-stats{
  display:grid; grid-template-columns:repeat(3, 1fr); gap:12px; margin-top:28px;
}
.small-stat{
  padding:15px 14px;
  border:1px solid #e0e8f2;
  border-radius:16px;
  background:#fff;
}
.small-stat strong{
  display:block; font-size:1.15rem; font-family:Georgia, "Times New Roman", serif;
}
.small-stat span{
  display:block; margin-top:4px; color:var(--muted); font-size:.88rem;
}
.profile-layout{
  display:grid; gap:24px;
}
.profile-card{
  display:grid; grid-template-columns:260px 1fr; gap:24px;
  background:var(--panel); border:1px solid var(--line); border-radius:calc(var(--radius) + 4px);
  box-shadow:var(--shadow); overflow:hidden;
}
.profile-card .portrait{
  background:#dbe6f2;
}
.profile-card .portrait img{
  width:100%; height:100%; object-fit:cover; object-position:center top;
}
.profile-card .content{padding:24px 24px 26px}
.profile-card h2{
  margin:0 0 8px; font-family:Georgia, "Times New Roman", serif; font-size:2rem; line-height:1.1;
}
.profile-card .tagline{
  margin:10px 0 16px; color:var(--ink-soft); font-weight:700;
}
.profile-card p{margin:0 0 14px; color:var(--muted)}
.profile-card ul{
  margin:14px 0 0; padding-left:18px; color:var(--muted);
}
.profile-card li + li{margin-top:7px}
.badges{display:flex; flex-wrap:wrap; gap:10px; margin:14px 0 18px}
.badge{
  padding:7px 12px; border-radius:999px; background:var(--blue-soft); color:var(--navy);
  font-weight:700; font-size:.85rem;
}
.breadcrumb{
  display:flex; align-items:center; gap:10px; color:var(--muted); font-size:.95rem; margin-bottom:18px;
}
.callout{
  padding:18px 20px; border-radius:18px; background:linear-gradient(180deg, #ffffff, #f8fbff);
  border:1px solid var(--line);
}
.callout strong{display:block; margin-bottom:8px}

.section-subhead{margin:14px 0 10px}
.section-subhead h3{margin:0 0 6px; font-family:Georgia, "Times New Roman", serif; font-size:1.4rem}
.section-subhead p{margin:0; color:var(--muted)}
.event-stack{display:grid; gap:22px}
.event-card{background:linear-gradient(135deg, rgba(18,61,115,.98), rgba(36,94,154,.96)); color:#fff; border-radius:calc(var(--radius) + 4px); box-shadow:0 18px 45px rgba(18,61,115,.22); padding:28px; border:1px solid rgba(255,255,255,.12)}
.event-card h3{margin:8px 0 12px; font-family:Georgia, "Times New Roman", serif; font-size:1.7rem; line-height:1.18}
.event-card p{margin:0; color:rgba(255,255,255,.9)}
.event-tag{display:inline-flex; align-items:center; padding:7px 12px; border-radius:999px; background:rgba(255,255,255,.12); border:1px solid rgba(255,255,255,.2); font-weight:800; letter-spacing:.05em; text-transform:uppercase; font-size:.75rem}
.event-meta{display:flex; flex-wrap:wrap; gap:10px 12px; margin-top:16px}
.event-meta span{display:inline-flex; align-items:center; gap:8px; padding:8px 12px; border-radius:999px; background:rgba(255,255,255,.12); border:1px solid rgba(255,255,255,.16); font-weight:700; font-size:.9rem}
.footer-brand{display:flex; gap:16px; align-items:center}
.footer-logo{width:76px; height:auto; display:block; opacity:.95}

@media (max-width: 1080px){
  .hero-grid, .feature, .grid-4, .grid-3, .grid-2, .people-grid, .dual-list, .profile-card{
    grid-template-columns:1fr 1fr;
  }
  .grid-4{grid-template-columns:1fr 1fr}
  .people-grid{grid-template-columns:repeat(2,1fr)}
  .profile-card{grid-template-columns:220px 1fr}
}
@media (max-width: 760px){
  .nav-wrap{padding:10px 0}
  .brand-logo{width:84px}
  .footer-brand{align-items:flex-start; flex-direction:column}
  .footer-logo{width:64px}
  .nav-links{display:none}
  .hero{padding-top:40px}
  .hero-panel, .metric-card, .card{padding:22px}
  .hero-grid, .feature, .grid-4, .grid-3, .grid-2, .people-grid, .dual-list, .profile-card{
    grid-template-columns:1fr;
  }
  .hero-panel .small-stats{grid-template-columns:1fr}
  .profile-card .portrait{max-height:420px}
  .section-head{display:block}
  .section-head p{margin-top:10px}
}
