/* Genehackers Outreach Toolkit — site styles
   Palette: cream #FDF9EE · ink #211F22 · body #3D3A3C · muted #6E6A66
   mint #1DC48E · mint-dark #0E9B6E · salmon #FB9CB4 · yellow #FDD42E
   germ red #FD4426 · germ blue #21A8D8 · germ purple #9B59B6
   (hex hardcoded on purpose so older renderers + non-devs can read it) */

@font-face{font-family:'Nunito';src:url('assets/fonts/Nunito-Regular.ttf') format('truetype');font-weight:400;font-style:normal;font-display:swap;}
@font-face{font-family:'Nunito';src:url('assets/fonts/Nunito-Bold.ttf') format('truetype');font-weight:700;font-style:normal;font-display:swap;}
@font-face{font-family:'Quicksand';src:url('assets/fonts/Quicksand-Regular.ttf') format('truetype');font-weight:400;font-style:normal;font-display:swap;}
@font-face{font-family:'Quicksand';src:url('assets/fonts/Quicksand-Bold.ttf') format('truetype');font-weight:700;font-style:normal;font-display:swap;}

*{box-sizing:border-box;}
html,body{margin:0;padding:0;}
body{
  font-family:'Quicksand',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  background:#FDF9EE;color:#3D3A3C;font-size:16px;line-height:1.62;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3,h4,.brand,.btn,.eyebrow,.navhead{font-family:'Nunito',sans-serif;}
a{color:#0E9B6E;text-decoration:none;}
a:hover{text-decoration:underline;}
img{max-width:100%;}

/* ---------- layout shell ---------- */
#sidebar{
  position:fixed;top:0;left:0;width:274px;height:100vh;overflow-y:auto;
  background:#FCF6E9;border-right:1px solid #EADFC8;
  padding:22px 0 40px;z-index:30;
}
#topbar{
  position:fixed;top:0;left:274px;right:0;height:58px;z-index:20;
  background:rgba(253,249,238,0.92);border-bottom:1px solid #EADFC8;
  display:flex;align-items:center;justify-content:flex-end;padding:0 26px;
}
.content-wrap{margin-left:274px;padding-top:58px;}
.container{max-width:1080px;margin:0 auto;padding:34px 44px 0;}
.page-row{display:flex;align-items:flex-start;}
.page-main{flex:1 1 auto;min-width:0;max-width:760px;}

/* ---------- sidebar brand + nav ---------- */
.brand{display:flex;align-items:center;gap:11px;padding:2px 20px 18px;color:#211F22;font-weight:700;font-size:1.12rem;line-height:1.15;}
.brand:hover{text-decoration:none;}
.brand img{width:34px;height:34px;flex:0 0 auto;}
.navgroup{margin:16px 0 4px;}
.navhead{padding:6px 22px 5px;font-size:.74rem;font-weight:700;letter-spacing:.09em;text-transform:uppercase;color:#A2946F;}
.navlist{list-style:none;margin:0;padding:0;}
.navlist a{
  display:block;padding:6px 22px 6px 21px;color:#46423F;font-size:.95rem;
  border-left:3px solid transparent;
}
.navlist a:hover{background:#F3ECDA;text-decoration:none;color:#211F22;}
.navlist a.active{
  background:#E7F7F0;border-left-color:#FB9CB4;color:#0E7A57;font-weight:700;
}
.navlist a.sub{padding-left:34px;font-size:.9rem;}

/* ---------- topbar ---------- */
.topbar-links{display:flex;align-items:center;gap:18px;}
.topbar-links a{color:#6E6A66;font-size:.92rem;}
.menu-toggle{display:none;position:absolute;left:16px;top:12px;background:none;border:1px solid #E2D6BC;border-radius:8px;width:36px;height:34px;font-size:18px;cursor:pointer;color:#211F22;}

/* ---------- buttons ---------- */
.btn{
  display:inline-block;background:#1DC48E;color:#fff;font-weight:700;font-size:.94rem;
  padding:9px 17px;border-radius:10px;border:none;cursor:pointer;line-height:1.1;
}
.btn:hover{background:#16A578;text-decoration:none;color:#fff;}
.btn.small{padding:7px 13px;font-size:.88rem;}
.btn.ghost{background:#fff;color:#0E7A57;border:1.5px solid #B7E7D5;}
.btn.ghost:hover{background:#EAF7F1;color:#0E7A57;}
.btn.salmon{background:#F7849B;}
.btn.salmon:hover{background:#F06A86;}

.full-toolkit-btn {
  margin-left: 8px;
}

/* ---------- typography ---------- */
h1{font-size:2.15rem;line-height:1.12;color:#211F22;margin:.1em 0 .35em;}
h2{font-size:1.42rem;color:#211F22;margin:1.7em 0 .55em;padding-top:.2em;}
h3{font-size:1.12rem;color:#211F22;margin:1.3em 0 .4em;}
.lead{font-size:1.18rem;color:#4A4644;line-height:1.55;margin:.2em 0 1.1em;}
.eyebrow{display:inline-block;font-size:.82rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:#0E9B6E;margin-bottom:.5em;}
p{margin:0 0 1em;}
ul,ol{margin:0 0 1.1em;padding-left:1.25em;}
li{margin:.3em 0;}
hr{border:none;border-top:1px solid #EADFC8;margin:2em 0;}
strong{color:#2C2A2B;}
.muted{color:#6E6A66;}
code{background:#F1E9D6;padding:1px 6px;border-radius:5px;font-size:.92em;font-family:ui-monospace,Menlo,Consolas,monospace;}

/* ---------- info bar (grade/time/cost) ---------- */
.infobar{display:flex;flex-wrap:wrap;gap:0;margin:0 0 24px;border:1px solid #ECE2CC;border-radius:12px;overflow:hidden;background:#fff;}
.infobar .cell{flex:1 1 0;padding:11px 16px;border-right:1px solid #F0E8D6;min-width:120px;}
.infobar .cell:last-child{border-right:none;}
.infobar .k{font-size:.72rem;text-transform:uppercase;letter-spacing:.05em;color:#9A8F76;font-weight:700;font-family:'Nunito';}
.infobar .v{font-size:1.02rem;color:#211F22;font-weight:700;font-family:'Nunito';}

/* ---------- cards ---------- */
.cardgrid{font-size:0;margin:6px 0 8px;}
.card{
  display:inline-block;vertical-align:top;width:232px;margin:0 14px 16px 0;
  background:#fff;border:1px solid #EFE7D5;border-radius:14px;padding:17px 17px 15px;
  font-size:16px;
}
.card .num{display:inline-block;width:30px;height:30px;border-radius:50%;color:#fff;font-family:'Nunito';font-weight:700;text-align:center;line-height:30px;font-size:1rem;margin-bottom:9px;}
.card h3{margin:.1em 0 .35em;font-size:1.04rem;}
.card p{font-size:.9rem;color:#5C5853;margin:0 0 .7em;line-height:1.45;}
.card .meta{font-size:.78rem;color:#8A8275;font-weight:700;font-family:'Nunito';}
.card a.cardlink{font-weight:700;font-size:.88rem;}

/* download list */
.dl{display:flex;align-items:center;justify-content:space-between;gap:14px;background:#fff;border:1px solid #EFE7D5;border-radius:12px;padding:13px 16px;margin:0 0 11px;}
.dl .dlinfo{min-width:0;}
.dl .dlinfo .t{font-weight:700;font-family:'Nunito';color:#211F22;}
.dl .dlinfo .d{font-size:.86rem;color:#6E6A66;}
.dl .ext{font-size:.72rem;font-weight:700;color:#9A8F76;font-family:'Nunito';text-transform:uppercase;}

/* callout / note */
.note{background:#FFF7E0;border:1px solid #F6E2A8;border-radius:12px;padding:14px 17px;margin:1.2em 0;font-size:.96rem;}
.note.mint{background:#E9F7F1;border-color:#BEE7D6;}
.note .nt{font-weight:700;font-family:'Nunito';color:#0E7A57;}

/* highlight strip on home */
.facts{display:flex;flex-wrap:wrap;gap:10px;margin:18px 0 6px;font-size:0;}
.fact{display:inline-block;vertical-align:top;background:#fff;border:1px solid #EFE7D5;border-radius:12px;padding:13px 16px;margin:0 10px 10px 0;font-size:16px;min-width:150px;}
.fact .big{font-family:'Nunito';font-weight:700;font-size:1.3rem;color:#0E9B6E;line-height:1.1;}
.fact .lbl{font-size:.84rem;color:#6E6A66;}

/* right-hand "on this page" TOC */
.toc{flex:0 0 196px;width:196px;margin-left:30px;position:sticky;top:78px;align-self:flex-start;padding:4px 0;}
.toc .th{font-size:.74rem;text-transform:uppercase;letter-spacing:.07em;color:#A2946F;font-weight:700;font-family:'Nunito';margin-bottom:8px;}
.toc a{display:block;color:#6E6A66;font-size:.88rem;padding:3px 0 3px 11px;border-left:2px solid #ECE2CC;}
.toc a:hover{color:#0E9B6E;border-left-color:#1DC48E;text-decoration:none;}

/* footer */
footer{border-top:1px solid #EADFC8;margin-top:46px;padding:20px 44px 34px;color:#8A8275;font-size:.86rem;}
footer .reportback{margin:0 0 6px;}
footer .reportback a{color:#0E9B6E;font-weight:700;}
footer .legal{color:#9A8F76;}

/* hero (home) */
.hero{padding:6px 0 2px;}
.hero .germ-row{margin:0 0 6px;}
.hero .germ-row img{height:46px;width:auto;margin-right:10px;vertical-align:middle;}

/* responsive */
@media (max-width: 880px){
  #sidebar{transform:translateX(-100%);transition:transform .2s ease;box-shadow:2px 0 18px rgba(0,0,0,.12);}
  body.nav-open #sidebar{transform:translateX(0);}
  #topbar{left:0;justify-content:space-between;padding-left:62px;}
  .content-wrap{margin-left:0;}
  footer{margin-left:0;}
  .menu-toggle{display:block;}
  main,main.has-toc{padding:24px 20px 70px;max-width:100%;}
  .toc{display:none;}
  .page-row{display:block;}
  .card{width:100%;margin-right:0;}
  .fact{min-width:0;width:46%;}
}

/* ---------- slide-deck preview carousel ---------- */
.slides{position:relative;margin:18px 0;background:#211F22;border-radius:14px;overflow:hidden;box-shadow:0 8px 24px rgba(33,31,34,.14);outline:none;}
.slides .stage{position:relative;width:100%;padding-top:56.25%;background:#211F22;cursor:pointer;}
.slides .stage img{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:contain;display:block;}
.slides .nav{position:absolute;top:calc(50% - 25px);width:50px;height:50px;padding:0;border:none;border-radius:50%;background:rgba(255,255,255,.92);color:#211F22;font-size:27px;line-height:48px;text-align:center;cursor:pointer;box-shadow:0 2px 10px rgba(0,0,0,.32);}
.slides .nav:hover{background:#fff;}
.slides .prev{left:14px;}
.slides .next{right:14px;}
.slides .bar{display:flex;align-items:center;gap:12px;background:#fff;padding:10px 14px;}
.slides .bar .count{font-family:'Nunito';font-weight:700;color:#211F22;font-size:.92rem;}
.slides .bar button{border:1px solid #D9CDB2;background:#fff;border-radius:8px;padding:6px 14px;font-family:'Nunito';font-weight:700;font-size:.85rem;color:#211F22;cursor:pointer;}
.slides .bar button:hover{background:#F3ECDA;}
.slides .bar .full{margin-left:auto;}
.slides:fullscreen{display:flex;flex-direction:column;width:100%;}
.slides:-webkit-full-screen{display:flex;flex-direction:column;width:100%;}
.slides:fullscreen .stage,.slides:-webkit-full-screen .stage{flex:1 1 auto;padding-top:0;}
@media (max-width:560px){.slides .nav{width:40px;height:40px;line-height:38px;font-size:22px;top:calc(50% - 20px);}}