/* Florian Heeb — personal homepage.
   Layout: sticky profile sidebar (photo, roles, links, address) beside a 44rem reading column;
   the Dear Chair card is the only card on the page and the only place with the explorable's airmail look. */

/* Fonts are served from this site (no third-party font requests). Latin subsets; licences in fonts/. */
@font-face{font-family:"IBM Plex Sans";font-style:normal;font-weight:400 600;font-display:swap;src:url("fonts/ibm-plex-sans-400-600.woff2") format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"IBM Plex Sans";font-style:italic;font-weight:400;font-display:swap;src:url("fonts/ibm-plex-sans-400-italic.woff2") format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Source Serif 4";font-style:normal;font-weight:400 700;font-display:swap;src:url("fonts/source-serif-4-400-700.woff2") format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
/* Subset to the glyphs of the Dear Chair kicker and title only */
@font-face{font-family:"IBM Plex Mono";font-style:normal;font-weight:500;font-display:swap;src:url("fonts/ibm-plex-mono-500.woff2") format("woff2");unicode-range:U+20,U+41-5A,U+61-7A}
@font-face{font-family:"Besley";font-style:normal;font-weight:700;font-display:swap;src:url("fonts/besley-700.woff2") format("woff2");unicode-range:U+20,U+43-44,U+61,U+65,U+68-69,U+72}

:root{
  color-scheme:light;
  --bg:#f4f6f8;
  --ink:#15202b;
  --ink-2:#44525f;
  --ink-3:#5b6976;
  --line:#d9e0e6;
  --accent:#155e75;
  --accent-hover:#0d4556;
  --accent-soft:#e0ebef;
  --accent-line:rgba(21,94,117,.36);
  --chip:#ffffff;
  --chip-line:#d3dbe2;
  --photo-bg:#d8e6ea;
  --ring:rgba(21,32,43,.10);
  --air-blue:#2147b3;
  --air-red:#c93d2b;
  --air-paper:#e9eef4;
  --air-ink:#131b27;
  --air-text:#2b3647;
  --air-kick:#2147b3;
  --air-btn:#2147b3;
  --air-btn-hover:#18368c;
  --air-btn-ink:#ffffff;
  --air-frame:rgba(19,27,39,.16);
  --air-shadow:rgba(19,27,39,.30);
  --img-filter:none;
  --skip-bg:#15202b;
  --skip-ink:#ffffff;
  --f-sans:"IBM Plex Sans","Segoe UI","Helvetica Neue",Arial,sans-serif;
  --f-serif:"Source Serif 4","Source Serif Pro",Charter,"Bitstream Charter",Georgia,Cambria,"Times New Roman",serif;
  --f-mono:"IBM Plex Mono",ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  --f-display:"Besley",var(--f-serif);
  --fs-xs:.8125rem;--fs-sm:.90625rem;--fs-md:1rem;--fs-lg:1.1875rem;--fs-xl:1.375rem;--fs-2xl:1.75rem;--fs-3xl:2.25rem;
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    --bg:#0e151b;--ink:#e4eaef;--ink-2:#aab6c0;--ink-3:#8e9ba6;--line:#22303a;
    --accent:#7cc3d6;--accent-hover:#a6dbe9;--accent-soft:#14303a;--accent-line:rgba(124,195,214,.42);
    --chip:#131c24;--chip-line:#2a3843;--photo-bg:#2a3540;--ring:rgba(228,234,239,.12);
    --air-blue:#4e74e4;--air-red:#dc5a45;--air-paper:#131b27;--air-ink:#eef2f7;--air-text:#c5cfdb;
    --air-kick:#9db3f7;--air-btn:#3d63d8;--air-btn-hover:#3054c4;--air-btn-ink:#ffffff;
    --air-frame:rgba(233,238,244,.14);--air-shadow:rgba(0,0,0,.55);--img-filter:brightness(.9);
    --skip-bg:#e4eaef;--skip-ink:#0e151b;
    color-scheme:dark;
  }
}
:root[data-theme="dark"]{
  --bg:#0e151b;--ink:#e4eaef;--ink-2:#aab6c0;--ink-3:#8e9ba6;--line:#22303a;
  --accent:#7cc3d6;--accent-hover:#a6dbe9;--accent-soft:#14303a;--accent-line:rgba(124,195,214,.42);
  --chip:#131c24;--chip-line:#2a3843;--photo-bg:#2a3540;--ring:rgba(228,234,239,.12);
  --air-blue:#4e74e4;--air-red:#dc5a45;--air-paper:#131b27;--air-ink:#eef2f7;--air-text:#c5cfdb;
  --air-kick:#9db3f7;--air-btn:#3d63d8;--air-btn-hover:#3054c4;--air-btn-ink:#ffffff;
  --air-frame:rgba(233,238,244,.14);--air-shadow:rgba(0,0,0,.55);--img-filter:brightness(.9);
  --skip-bg:#e4eaef;--skip-ink:#0e151b;
  color-scheme:dark;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font:400 var(--fs-md)/1.6 var(--f-sans);overflow-wrap:break-word;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
img{display:block;max-width:100%;height:auto}
h1,h2,h3{margin:0;text-wrap:balance}
p{margin:0;text-wrap:pretty}
ul,ol,dl,dd{margin:0;padding:0;list-style:none}
address{font-style:normal}
cite{font-style:italic}
a{color:var(--accent);text-decoration-line:underline;text-decoration-thickness:1px;text-underline-offset:.22em;text-decoration-color:var(--accent-line)}
a:hover{color:var(--accent-hover);text-decoration-color:currentColor}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:3px}
::selection{background:var(--accent-soft);color:var(--ink)}
.vh{position:absolute!important;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0}
.sprite{position:absolute;width:0;height:0;overflow:hidden}
.i{display:inline-block;width:1.125rem;height:1.125rem;flex:none;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.i-sm{width:.875rem;height:.875rem;stroke-width:1.7}
.nw{white-space:nowrap}
.skip{position:absolute;left:max(16px,env(safe-area-inset-left,0px));top:-80px;z-index:10;padding:10px 14px;border-radius:4px;background:var(--skip-bg);color:var(--skip-ink);font-weight:600;text-decoration:none}
.skip:focus{top:12px}

/* Layout (phone first) */
.wrap{max-width:1180px;margin:0 auto;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px));padding-block:0 max(24px,env(safe-area-inset-bottom,0px))}
main{min-width:0;padding-block:28px 0}

/* Profile: compact header on phones, sticky sidebar on desktop */
.profile{display:grid;grid-template-columns:auto minmax(0,1fr);gap:14px 16px;align-items:center;padding-block:28px 24px;border-bottom:1px solid var(--line)}
.photo{width:84px;height:84px;border-radius:18px;object-fit:cover;background:var(--photo-bg);box-shadow:0 0 0 1px var(--ring)}
.ident{min-width:0}
.name{font:600 var(--fs-2xl)/1.1 var(--f-serif);letter-spacing:-.012em}
.role{margin-top:5px;font-size:var(--fs-sm);font-weight:500;line-height:1.45}
.role span{display:block}
.role .dot{display:none}
.role .dot+span{margin-top:.3em}
.affil{grid-column:1/-1;min-width:0;font-size:var(--fs-sm);line-height:1.5;color:var(--ink-2)}
.affil p{text-wrap:wrap}
.affil p+p{margin-top:4px}
.links{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:8px}
.links li{min-width:0}
.links a{display:inline-flex;align-items:center;gap:7px;min-height:36px;padding:6px 12px 6px 10px;border:1px solid var(--chip-line);border-radius:999px;background:var(--chip);color:var(--ink);font-size:var(--fs-sm);font-weight:500;line-height:1.25;text-decoration:none}
.links a .i{color:var(--accent)}
.links a:hover{border-color:var(--accent);color:var(--accent-hover)}
.side-addr{display:none}

@media (min-width:600px){
  .profile{gap:18px 24px;padding-block:40px 28px}
  .photo{width:120px;height:120px;border-radius:22px}
  .name{font-size:var(--fs-3xl)}
  .role{font-size:var(--fs-md)}
}

/* Bio and sections */
.bio{max-width:40rem;font:400 var(--fs-lg)/1.55 var(--f-serif);color:var(--ink)}
.sec{margin-top:44px;padding-top:30px;border-top:1px solid var(--line)}
.sec h2{font:600 var(--fs-2xl)/1.15 var(--f-serif);letter-spacing:-.01em}
.sec h3{margin:40px 0 18px;font-size:var(--fs-xs);font-weight:600;line-height:1.35;letter-spacing:.09em;text-transform:uppercase;color:var(--accent)}
.sec h2+h3{margin-top:22px}

/* Paper entries */
.papers>li+li{margin-top:30px}
.ptitle{font:600 var(--fs-lg)/1.35 var(--f-serif);letter-spacing:-.003em;text-wrap:balance}
.ptitle a{color:var(--ink)}
.ptitle a:hover{color:var(--accent-hover)}
.authors{margin-top:4px;font-size:var(--fs-sm);color:var(--ink-2)}
.meta{margin-top:8px;display:flex;flex-wrap:wrap;align-items:center;gap:6px 14px;font-size:var(--fs-sm);line-height:1.45;color:var(--ink-2)}
.venue cite{color:var(--ink)}
.status{display:inline-block;padding:3px 9px;border-radius:4px;background:var(--accent-soft);color:var(--ink);font-size:var(--fs-xs);font-weight:500;line-height:1.45}
.note{margin-top:8px;display:flex;gap:7px;align-items:flex-start;font-size:var(--fs-sm);font-weight:500;line-height:1.45;color:var(--accent)}
.note .i{margin-top:.15em}
.sum{margin-top:8px;max-width:40rem}

/* Dear Chair: the airmail identity lives only here */
.dc{display:block;margin-top:20px;padding:6px;border-radius:4px;color:var(--air-ink);text-decoration:none;background:repeating-linear-gradient(-45deg,var(--air-red) 0 10px,var(--air-paper) 10px 15px,var(--air-blue) 15px 25px,var(--air-paper) 25px 30px)}
.dc:hover{color:var(--air-ink);box-shadow:0 12px 28px -16px var(--air-shadow)}
.dc:focus-visible{outline:3px solid var(--accent);outline-offset:4px;border-radius:5px}
.dc-in{display:grid;grid-template-columns:minmax(0,1fr);background:var(--air-paper)}
/* Phones: a 16:10 crop of the title slide (headline, letter and button), zoomed so the slide's own stripes don't double the card's */
.dc-media{display:block;overflow:hidden;aspect-ratio:16/10;border-bottom:1px solid var(--air-frame)}
.dc img{width:100%;height:100%;object-fit:cover;object-position:50% 21%;transform:scale(1.045);transform-origin:50% 21%;filter:var(--img-filter)}
.dc-body{display:block;min-width:0;padding:18px 18px 20px}
.dc-kick{display:flex;align-items:center;gap:8px;font:500 var(--fs-xs)/1.2 var(--f-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--air-kick)}
.dc-kick::before{content:"";width:8px;height:8px;border-radius:1px;background:var(--air-blue)}
.dc-title{display:block;margin-top:10px;font:700 var(--fs-2xl)/1.1 var(--f-display);letter-spacing:-.01em;color:var(--air-ink)}
.dc-text{display:block;margin-top:10px;font-size:var(--fs-sm);line-height:1.55;color:var(--air-text)}
.dc-cta{display:inline-flex;align-items:center;gap:8px;margin-top:16px;padding:9px 16px;border-radius:4px;background:var(--air-btn);color:var(--air-btn-ink);font-size:var(--fs-sm);font-weight:600;line-height:1.2}
.dc:hover .dc-cta{background:var(--air-btn-hover)}
@media (min-width:600px){
  .dc-in{grid-template-columns:200px minmax(0,1fr);gap:24px;align-items:center;padding:16px 20px 16px 16px}
  .dc-media{aspect-ratio:1;border-bottom:0;border-radius:2px;box-shadow:0 0 0 1px var(--air-frame)}
  .dc img{object-position:50% 50%;transform:scale(1.035);transform-origin:50% 50%}
  .dc-body{padding:0}
}

/* Practitioner & policy writing, grouped by year */
.row2{display:grid;grid-template-columns:minmax(0,1fr);row-gap:4px}
.wg{padding-block:14px;border-top:1px solid var(--line)}
.wg:first-child{border-top:0;padding-top:0}
.yr{font-size:var(--fs-sm);font-weight:500;line-height:1.55;color:var(--ink-3);font-variant-numeric:tabular-nums;white-space:nowrap}
.wg dd{min-width:0}
.wg dd+dd{margin-top:12px}
@media (min-width:480px){
  .row2{grid-template-columns:5rem minmax(0,1fr);column-gap:16px;align-items:baseline}
  .row2>.yr{grid-column:1}
  .row2>:not(.yr){grid-column:2}
}
.wt{font:500 var(--fs-md)/1.45 var(--f-serif);text-wrap:balance}
.wt a{color:var(--ink)}
.wt a:hover{color:var(--accent-hover)}
.src{margin-top:2px;font-size:var(--fs-sm);color:var(--ink-2)}

/* Teaching */
.teach{margin-top:22px}
.teach li+li{margin-top:20px}
.ctitle{font:600 var(--fs-lg)/1.35 var(--f-serif);text-wrap:balance}
.cmeta{margin-top:3px;font-size:var(--fs-sm);color:var(--ink-2)}

/* Footer */
.foot{margin-top:56px;padding-block:20px 8px;border-top:1px solid var(--line);font-size:var(--fs-xs);color:var(--ink-3)}
.foot-addr{margin-bottom:12px;font-size:var(--fs-sm);line-height:1.55;color:var(--ink-2)}
.foot-meta{display:flex;flex-wrap:wrap;gap:4px 18px}
.foot a{color:var(--ink-2);text-decoration-color:var(--line)}
.foot a:hover{color:var(--accent-hover);text-decoration-color:currentColor}

/* Desktop: sticky profile sidebar */
@media (min-width:960px){
  .wrap{display:grid;grid-template-columns:clamp(248px,24vw,296px) minmax(0,44rem);column-gap:clamp(48px,6vw,96px);justify-content:center;align-items:start}
  .profile{grid-column:1;grid-row:1/span 2;position:sticky;top:0;display:block;padding-block:48px 32px;border-bottom:0}
  .photo{width:184px;height:184px;border-radius:24px}
  .name{margin-top:24px;font-size:var(--fs-3xl);line-height:1.05}
  .role{margin-top:12px;font-size:var(--fs-md);line-height:1.4}
  .affil{margin-top:16px}
  .affil p+p{margin-top:8px}
  .links{display:grid;grid-template-columns:repeat(2,max-content);gap:2px clamp(20px,2.6vw,36px);margin-top:20px;padding-top:16px;border-top:1px solid var(--line)}
  .links .email{grid-column:1/-1}
  .links a{min-height:30px;padding:3px 0;border:0;border-radius:3px;background:none}
  .links a:hover{color:var(--accent-hover);text-decoration:underline;text-decoration-color:var(--accent-line)}
  .side-addr{display:block;text-wrap:balance;margin-top:16px;padding-top:14px;border-top:1px solid var(--line);font-size:var(--fs-xs);line-height:1.6;color:var(--ink-3)}
  main{grid-column:2;grid-row:1;padding-block:48px 0}
  .bio{font-size:var(--fs-xl);line-height:1.5}
  .foot{grid-column:2;grid-row:2}
  .foot-addr{display:none}
}

/* Legal notice: one short reading column, small type */
.page{max-width:40rem;margin:0 auto;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px));padding-block:40px max(24px,env(safe-area-inset-bottom,0px));font-size:var(--fs-sm);color:var(--ink-2)}
.legal h1{margin:32px 0 8px;font-size:var(--fs-md);font-weight:600;color:var(--ink)}

@media (prefers-reduced-motion:no-preference){
  html{scroll-behavior:smooth}
  a,.dc-cta{transition:color .15s,background-color .15s,border-color .15s,text-decoration-color .15s,box-shadow .2s,transform .2s}
  .dc:hover{transform:translateY(-2px)}
}

@media print{
  :root{--bg:#fff;--ink:#000;--ink-2:#333;--ink-3:#444;--accent:#000}
  .skip,.links,.dc{display:none!important}
  .wrap{display:block}
  .profile{position:static}
  a{text-decoration:none;color:inherit}
}
