
:root{
  --ink:#16232c; --ink-soft:#4b5a64; --sea:#0e3d56; --sea-deep:#0a2d41;
  --link:#17647a; --mist:#eff3f5; --rule:#d3dce1; --paper:#fff;
  --ff-sans:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  --ff-serif:"Iowan Old Style","Palatino Linotype",Palatino,"Book Antiqua",Georgia,serif;
  --ff-hum:"Segoe UI","Gill Sans","Gill Sans MT",Calibri,Candara,Optima,"Trebuchet MS",sans-serif;
  --ff-classic:"Times New Roman",Times,"Liberation Serif",serif;
  --ff-wide:Verdana,Geneva,Tahoma,"DejaVu Sans",sans-serif;
  /* the Appearance settings override these */
  --sans:var(--ff-sans); --serif:var(--ff-serif);
  --fs:16px; --body-size:1.0625rem; --lh:1.65; --pgap:1em; --hs:1; --on-accent:#fff;
}
*{box-sizing:border-box}
[hidden]{display:none!important}
html{-webkit-text-size-adjust:100%;font-size:var(--fs)}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);font-size:var(--body-size);line-height:var(--lh)}
a{color:var(--link);text-underline-offset:.15em}
a:focus-visible,button:focus-visible{outline:2px solid var(--link);outline-offset:2px}

.skip{position:absolute;left:-9999px;top:8px;background:#fff;color:var(--ink);padding:8px 12px;z-index:100}
.skip:focus{left:8px}

.site{display:flex;flex-direction:column;min-height:100vh}
.wrap{width:100%;max-width:1180px;margin:0 auto;padding:0 24px}

/* Header: name on the left, logos on the right */
.masthead{order:1}
/* the rule under the header is as wide as the page content; it meets the top of the menu bar when the menu is below, or divides header from page body when the menu is above */
.mast{display:flex;align-items:center;justify-content:space-between;gap:32px;padding:30px 0 24px;border-bottom:2px solid var(--sea)}
.titles{min-width:0}
.dept{margin:0;font:600 clamp(1.65rem,3.3vw,2.4rem)/1.15 var(--serif);color:var(--sea);letter-spacing:-.005em}
.inst{margin:8px 0 0;font:400 clamp(1.05rem,1.9vw,1.3rem)/1.3 var(--sans);color:var(--ink-soft)}
.logos{display:flex;align-items:center;gap:22px;flex:none}
.logos img{display:block;height:96px;width:auto;max-width:220px;object-fit:contain}

/* Menu: sits below the header (or above, with class nav-above) */
.mainnav{order:2;background:var(--sea)}
.nav-above .mainnav{order:0}
.mainnav .top{list-style:none;margin:0 0 0 -18px;padding:0;display:flex;flex-wrap:wrap}
.mainnav li{position:relative}
.mainnav a{display:block;padding:7px 18px;line-height:1.3;color:var(--on-accent);text-decoration:none}
.mainnav a:hover{background:var(--sea-deep)}
.mainnav a[aria-current="page"],.mainnav a.here{box-shadow:inset 0 -3px 0 var(--on-accent)}
.mainnav a[aria-current="page"]{font-weight:600}
.mainnav a:focus-visible,.sub-toggle:focus-visible{outline:2px solid var(--on-accent);outline-offset:-3px}
/* optional dropdowns */
.mainnav li.has-sub{display:flex;align-items:stretch}
.mainnav li.has-sub>a{padding-right:6px}
.sub-toggle{display:flex;align-items:center;padding:0 14px 0 4px;border:0;background:none;color:var(--on-accent);cursor:pointer}
.sub-toggle:hover{background:var(--sea-deep)}
.sub-toggle::before{content:"";width:7px;height:7px;margin-top:-3px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg)}
.sub{list-style:none;margin:0;padding:6px 0;display:none;position:absolute;top:100%;left:0;z-index:30;min-width:240px;background:var(--sea-deep)}
.mainnav li.has-sub.open>.sub{display:block}
@media (hover:hover){.mainnav li.has-sub:hover>.sub{display:block}}
.sub a{padding:8px 18px}
.mainnav .sub a{box-shadow:none}
.sub a:hover{background:rgba(255,255,255,.16)}
.mainnav .top>li:nth-last-child(-n+2)>.sub{left:auto;right:0}

/* Body: two-thirds / one-third */
.page{order:3;flex:1}
.page>.wrap{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,1fr);gap:48px;padding-top:0;padding-bottom:60px;align-items:start}
.col>*+*{margin-top:40px}
.col-side>*+*{margin-top:28px}

.blk{line-height:var(--lh)}
.blk h2{margin:0 0 .6em;font:600 calc(1.55rem * var(--hs))/1.25 var(--serif);color:var(--sea)}
.blk p,.blk .rich ul,.blk .rich ol{max-width:none}
.blk p{margin:0 0 var(--pgap)}
.blk .rich>:last-child{margin-bottom:0}
.blk .rich ul,.blk .rich ol{margin:0 0 var(--pgap);padding-left:1.3em}
.blk figure{margin:0}
.blk figure img,.blk figure video{display:block;width:100%;height:auto;max-height:560px;object-fit:cover}
.blk figcaption,.blk .figcap{margin:8px 0 0;font-size:.9rem;color:var(--ink-soft)}

/* Right column: news, seminars, publications */
.col-side .blk{background:var(--mist);border-top:3px solid var(--sea);padding:20px 22px 24px}
.col-side .blk h2{font-size:calc(1.25rem * var(--hs));margin-bottom:.8em}
.items{list-style:none;margin:0;padding:0}
.items li{padding:12px 0;border-top:1px solid var(--rule);font-size:.97rem;line-height:1.5}
.items li:first-child{border-top:0;padding-top:0}
.items li:last-child{padding-bottom:0}

.sem{padding:14px 0;border-top:1px solid var(--rule)}
.sem:first-of-type{border-top:0;padding-top:0}
.sem p{margin:0;max-width:none}
.sem-when{font-weight:650;color:var(--sea)}
.sem-series{font-size:.92rem;color:var(--ink-soft)}
.talk{margin-top:8px;line-height:1.45}
.talk-speaker{font-weight:600}
.talk-title{font-family:var(--serif);font-style:italic}
.sem-venue{margin-top:6px;font-size:.92rem;color:var(--ink-soft)}
.sem-links{display:flex;flex-wrap:wrap;gap:6px 18px;margin-top:8px;font-size:.95rem}
.sem-empty{margin:0;color:var(--ink-soft)}

/* People pages (faculty, staff, postdocs, students) */
.page>.wrap.one{grid-template-columns:minmax(0,1fr)}
.page-head{background:var(--mist);border-top:3px solid var(--sea);padding:20px 24px 22px}
.page-title{margin:0;font:600 calc(1.7rem * var(--hs))/1.2 var(--serif);color:var(--sea)}
.page-head .rich{margin-top:.7em}
.page-head .rich p{margin:0 0 var(--pgap);max-width:72ch}
.page-head .rich ul,.page-head .rich ol{max-width:72ch;margin:0 0 var(--pgap);padding-left:1.3em}
.page-head .rich>:last-child{margin-bottom:0}
.people-body{margin-top:36px}
.people-body>*+*{margin-top:46px}
.grp h3{margin:0 0 20px;padding-bottom:8px;border-bottom:1px solid var(--rule);font:600 calc(1.4rem * var(--hs))/1.25 var(--serif);color:var(--sea)}
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:34px 26px}
.pcard{display:flex;flex-direction:column;gap:12px}
.pcard .ph{display:block;width:100%;aspect-ratio:4/5;object-fit:cover;object-position:center top;background:var(--mist)}
.p-name{margin:0;font:600 1.12rem/1.3 var(--serif);color:var(--ink)}
.p-title{margin:2px 0 0;font-size:.95rem;color:var(--ink-soft)}
.p-line{margin:6px 0 0;font-size:.93rem;line-height:1.5;overflow-wrap:anywhere}
.p-line .lbl{color:var(--ink-soft)}
.plist .prow{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1.5fr) minmax(0,1fr);gap:6px 24px;padding:16px 0;border-top:1px solid var(--rule)}
.plist .prow:first-child{border-top:0;padding-top:4px}
.plist.with-photo .prow{grid-template-columns:var(--tw,182px) minmax(0,1.1fr) minmax(0,1.5fr) minmax(0,1fr);align-items:start}
.prow .thumb{display:block;width:100%;height:auto;aspect-ratio:4/5;object-fit:cover;object-position:center top;background:var(--mist)}
.prow .p-title:first-child,.prow .p-line:first-child{margin-top:0}
.prow .cell>:first-child{margin-top:0}

/* inline formatting chosen inside text sections (sizes are fixed steps, never compounding) */
.sz-1{font-size:calc(var(--body-size) * .75)}
.sz-2{font-size:calc(var(--body-size) * .85)}
.sz-3{font-size:var(--body-size)}
.sz-4{font-size:calc(var(--body-size) * 1.2)}
.sz-5{font-size:calc(var(--body-size) * 1.5)}
.sz-6{font-size:calc(var(--body-size) * 2)}
.ff-default{font-family:var(--sans)}
.ff-sans{font-family:var(--ff-sans)}
.ff-serif{font-family:var(--ff-serif)}
.ff-hum{font-family:var(--ff-hum)}
.ff-classic{font-family:var(--ff-classic)}
.ff-wide{font-family:var(--ff-wide)}

/* font chosen for a whole section (lists, seminars, details, featured work, pictures) */
.bf-sans.bf-sans h2,.bf-sans.bf-sans h3,.bf-sans.bf-sans p,.bf-sans.bf-sans li,.bf-sans.bf-sans .sem,.bf-sans.bf-sans .xtra,.bf-sans.bf-sans figcaption,.bf-sans.bf-sans dt,.bf-sans.bf-sans dd,.bf-sans.bf-sans .rich,.bf-sans.bf-sans .lbl{font-family:var(--ff-sans)}
.bf-serif.bf-serif h2,.bf-serif.bf-serif h3,.bf-serif.bf-serif p,.bf-serif.bf-serif li,.bf-serif.bf-serif .sem,.bf-serif.bf-serif .xtra,.bf-serif.bf-serif figcaption,.bf-serif.bf-serif dt,.bf-serif.bf-serif dd,.bf-serif.bf-serif .rich,.bf-serif.bf-serif .lbl{font-family:var(--ff-serif)}
.bf-hum.bf-hum h2,.bf-hum.bf-hum h3,.bf-hum.bf-hum p,.bf-hum.bf-hum li,.bf-hum.bf-hum .sem,.bf-hum.bf-hum .xtra,.bf-hum.bf-hum figcaption,.bf-hum.bf-hum dt,.bf-hum.bf-hum dd,.bf-hum.bf-hum .rich,.bf-hum.bf-hum .lbl{font-family:var(--ff-hum)}
.bf-classic.bf-classic h2,.bf-classic.bf-classic h3,.bf-classic.bf-classic p,.bf-classic.bf-classic li,.bf-classic.bf-classic .sem,.bf-classic.bf-classic .xtra,.bf-classic.bf-classic figcaption,.bf-classic.bf-classic dt,.bf-classic.bf-classic dd,.bf-classic.bf-classic .rich,.bf-classic.bf-classic .lbl{font-family:var(--ff-classic)}
.bf-wide.bf-wide h2,.bf-wide.bf-wide h3,.bf-wide.bf-wide p,.bf-wide.bf-wide li,.bf-wide.bf-wide .sem,.bf-wide.bf-wide .xtra,.bf-wide.bf-wide figcaption,.bf-wide.bf-wide dt,.bf-wide.bf-wide dd,.bf-wide.bf-wide .rich,.bf-wide.bf-wide .lbl{font-family:var(--ff-wide)}
.c-default{color:var(--ink)}
.c-accent{color:var(--sea)}
.c-red{color:#b3261e}
.c-green{color:#2e7d32}
.c-orange{color:#b45309}
.c-grey{color:#5f6b73}
/* spacing presets chosen per text section */
.sp-compact{--lh:1.4;--pgap:.5em}
.sp-roomy{--lh:1.9;--pgap:1.5em}

/* extra labelled details */
.xtra{margin:4px 0 0;font-size:.93rem;line-height:1.5;overflow-wrap:anywhere}
.xtra .lbl{color:var(--ink-soft)}
.sem .xtra{margin-top:6px}
/* drop cap: a large first letter on a paragraph */
.rich p.dropcap::first-letter{float:left;font-family:var(--serif);font-weight:600;font-size:3.6em;line-height:.78;padding:.05em .1em 0 0;color:var(--sea)}
.rich p.dropcap{overflow:visible}
/* picture / slideshow */
.slide-stage{display:grid}
.slide{grid-area:1/1}
.multi .slide{opacity:0;visibility:hidden;transition:opacity .9s ease,visibility 0s linear .9s}
.multi .slide.on{opacity:1;visibility:visible;transition:opacity .9s ease}
.multi .slide img,.multi .slide video{height:auto;aspect-ratio:var(--ratio,16/7)}
.slide-img{display:block}
.blk-slides figure img,.blk-slides figure video{object-fit:contain;background:var(--mist)}
.blk-slides figure video{display:block;width:100%;height:auto;max-height:560px;background:#000}
.blk-slides.fit-fill figure img,.blk-slides.fit-fill figure video{object-fit:cover}
.blk-slides.fit-original figure img,.blk-slides.fit-original figure video{width:auto;max-width:100%;max-height:none;height:auto;aspect-ratio:auto!important;margin:0 auto}
.slide-img:hover img{opacity:.93}
.blk figcaption a{color:var(--link)}
.slide-ctl{display:flex;align-items:center;justify-content:flex-end;gap:8px;margin-top:10px;font-size:.88rem;color:var(--ink-soft)}
.slide-ctl .s-count{margin-right:auto}
.slide-ctl button{font:inherit;padding:3px 11px;border:1px solid var(--rule);border-radius:4px;background:#fff;color:var(--ink);cursor:pointer}
.slide-ctl button:hover{background:var(--mist)}
/* sliding: the next picture pushes the current one out sideways */
.trans-slide .slide-stage{overflow:hidden}
.trans-slide .slide{opacity:1;transform:translateX(100%);visibility:hidden;transition:transform .7s ease,visibility 0s linear .7s}
.trans-slide .slide.on{transform:translateX(0);visibility:visible;transition:transform .7s ease}
.trans-slide .slide.left{transform:translateX(-100%)}
.trans-slide .slide.snap{transition:none}
@media (prefers-reduced-motion:reduce){.multi .slide,.multi .slide.on,.trans-slide .slide,.trans-slide .slide.on{transition:none}}
/* first paragraph of the main text keeps a little air when the section has no title */
.col-main>.blk-text.no-title:first-child .rich{padding-top:1.4rem}

.foot{order:4;background:var(--mist);border-top:1px solid var(--rule);padding:24px 0;font-size:.92rem;color:var(--ink-soft)}
.foot p{margin:0 0 .4em;max-width:none}

@media (max-width:860px){
  .page>.wrap{grid-template-columns:minmax(0,1fr);gap:40px}
  .logos img{height:64px}
  .plist .prow,.plist.with-photo .prow{grid-template-columns:min(var(--tw,182px),34vw) minmax(0,1fr)}
  .prow .thumb{grid-row:1 / span 3}
}
@media (max-width:600px){
  .mast{flex-direction:column;align-items:flex-start;gap:18px}
  .logos img{height:52px}
  .mainnav a{padding:7px 12px}
  .mainnav li.has-sub{flex-wrap:wrap}
  .sub{position:static;flex-basis:100%;min-width:0}
  .wrap{padding:0 18px}
}


/* ==========================================================================
   Student pages
   ========================================================================== */
.page.student>.wrap{padding-top:32px}
.stu-facts{display:grid;grid-template-columns:max-content minmax(0,1fr);gap:4px 18px;margin:.9em 0 0;font-size:.98rem;line-height:1.5}
.stu-facts dt{color:var(--ink-soft)}
.stu-facts dd{margin:0}
.stu-photo{display:block;width:100%;aspect-ratio:4/5;object-fit:cover;object-position:center top;background:var(--mist)}
.col-side .blk.photo{background:none;border-top:0;padding:0}
.feat{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:24px;align-items:start}
.feat+.feat{margin-top:34px;padding-top:28px;border-top:1px solid var(--rule)}
.feat h3{margin:0 0 .5em;font:600 calc(1.2rem * var(--hs))/1.3 var(--serif);color:var(--ink)}
.feat p{margin:0 0 var(--pgap);max-width:none}
.feat figure{margin:0}
.feat figure img{display:block;width:100%;height:auto}
.feat figcaption{margin:8px 0 0;font-size:.9rem;color:var(--ink-soft)}
.feat.wide{grid-template-columns:minmax(0,1fr)}
.dept-line{margin:6px 0 0;font:600 clamp(1.1rem,2.1vw,1.45rem)/1.25 var(--serif);color:var(--ink)}
.dept-line+.inst{margin-top:4px}
.page-name{font-size:clamp(2rem,4.2vw,3rem)}
/* research page: topic cards and highlights */
.page.research>.wrap{padding-top:32px}
.topics{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:12px}
.topics li{background:var(--mist);border-left:3px solid var(--sea);padding:12px 14px;font-weight:600;line-height:1.35;color:var(--ink)}
.topics li a{color:inherit;text-decoration:none}
.topics li a:hover{text-decoration:underline}
.feat .refs{margin:0 0 var(--pgap);padding:0;list-style:none;font-size:.93rem;color:var(--ink-soft)}
.feat .refs li{margin:0 0 .25em}
.feat .who{margin:0 0 .6em;font-size:.93rem;color:var(--ink-soft)}
.feat figure video{display:block;width:100%;height:auto;background:#000}
.specs{width:100%;border-collapse:collapse;font-size:.95rem;line-height:1.45;margin:0 0 var(--pgap)}
.specs th,.specs td{text-align:left;vertical-align:top;padding:8px 10px;border-top:1px solid var(--rule)}
.specs tr:last-child th,.specs tr:last-child td{border-bottom:1px solid var(--rule)}
.specs th{width:9.5em;font-weight:600;color:var(--ink-soft)}
.feat .counts{margin:0 0 var(--pgap);padding-left:1.3em}
.pubs{margin:0;padding-left:1.4em}
.pubs li{margin:0 0 .85em;line-height:1.55}
.pubs .venue{font-style:italic}
.pubs .me{font-weight:600}
.pubs .tag{font-size:.88rem;color:var(--ink-soft)}
@media (max-width:860px){.feat{grid-template-columns:minmax(0,1fr)}}

.logos a{display:block;line-height:0}
.logos a:hover img{opacity:.85}

/* ==========================================================================
 Colours, fonts and sizes of the whole site. Change them in the CAOS page
 editor (Appearance button) or by hand; keep the two CAOS-THEME marker lines.
 ========================================================================== */
/*CAOS-THEME-START {"body":"sans","head":"hum","size":"15","hscale":"0.85","lh":"1.4","pgap":"0.5","ink":"#16232c","accent":"#0e3d56","link":"#17647a"}*/
:root{--sans:var(--ff-sans);--serif:var(--ff-hum);--fs:15px;--hs:0.85;--lh:1.4;--pgap:0.5em;--ink:#16232c;--ink-soft:#505a61;--sea:#0e3d56;--sea-deep:#0b2e41;--link:#17647a;--on-accent:#ffffff}
/*CAOS-THEME-END*/
