/* Shared adaptations of ForestSAT 2026's Bootstrap structure and theme. */
:root { --site-header-height: 80px; }
html { scroll-padding-top: 100px; }
body { font-size: 1rem; line-height: 1.65; background: white; }
img { max-width: 100%; height: auto; }
a { overflow-wrap: anywhere; }
a:focus-visible, button:focus-visible, [tabindex]:focus-visible { outline: 3px solid #d1691f; outline-offset: 4px; }
.skip-link { position: fixed; left: 1rem; top: -5rem; z-index: 2000; background: white; padding: .75rem 1rem; }
.skip-link:focus { top: 1rem; }
.navbar { min-height: var(--site-header-height); }
.navbar-brand { font-size: 1.8rem; font-weight: 800; letter-spacing: -.04em; }
.navbar-brand img { width: 54px; height: 54px; object-fit: contain; }
.navbar .nav-link { font-size: 1rem; padding: .65rem .75rem; }
.navbar .nav-link[aria-current=page] { text-decoration: underline; text-underline-offset: .4rem; }
.navbar .dropdown-menu { --bs-dropdown-bg: #fff; --bs-dropdown-color: #212529; --bs-dropdown-link-color: #212529; --bs-dropdown-link-hover-bg: #edf0e9; --bs-dropdown-link-hover-color: #324123; --bs-dropdown-link-active-bg: #324123; }
.dropdown-item[aria-current=page] { background: #edf0e9; font-weight: 700; }
.page-content { padding-top: 130px; padding-bottom: 80px; min-height: 75vh; }
article, .legacy-content { margin: 0; min-width: 0; }
.sidebar-panel { top: 112px; background: #f5f5f5; }
.sidebar-links { display: grid; gap: .15rem; }
.section-link { display: block; padding: .5rem .6rem; color: #324123; text-decoration: none; border-bottom: 1px solid #ddd; }
.section-link:hover, .section-link[aria-current=page] { background: #e5eadf; font-weight: 600; }
#heroarea { margin-top: var(--site-header-height); height: auto; min-height: 565px; padding: 60px 0; isolation: isolate; overflow: hidden; background: linear-gradient(#191e0fc9,#191e0f85),url('video-first-second.jpg') center/cover no-repeat; }
video#bgvideo { position: absolute; inset: 0; transform: none; min-width: 0; min-height: 0; width: 100%; height: 100%; object-fit: cover; z-index: -2; background: none; }
#heroarea::after { content: ''; position: absolute; inset: 0; z-index: -1; background: #191e0f66; pointer-events: none; }
.hero-content { max-width: 960px; }
.hero-content h1 { color: white; font-size: clamp(2.5rem,8vw,6.5rem); font-weight: 900; line-height: 1.05; overflow-wrap: anywhere; }
.hero-subtitle { font-family: var(--bs-font-headings); font-size: clamp(1.3rem,3vw,2.2rem); font-weight: 600; line-height: 1.3; margin-top: 1.4rem; }
.hero-label { font-size: 1.2rem; border: 2px solid white; border-radius: .4rem; padding: .6rem; margin-bottom: 0; }
.overview { max-width: 1040px; }
.director-photo { width: 180px!important; height: 180px; object-fit: cover; border-radius: 50%; border: 5px solid #e4e8df; }
.director-details { max-width: 740px; margin: auto; }
.social-links { display: flex; flex-wrap: wrap; gap: .8rem; margin: 1.5rem 0; }
.social-links img { width: 36px!important; height: 36px; }
.affiliations { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 2rem; margin: 2.5rem 0; }
.affiliations img { width: 230px; max-height: 100px; object-fit: contain; }
.legacy-content h2 { font-weight: 700; font-size: 1.7rem; margin: 2rem 0 1rem; }
.legacy-content h3 { font-weight: 600; font-size: 1.3rem; margin: 1.5rem 0 .75rem; }
.legacy-content p, .legacy-content .prose { font-size: 1rem; font-weight: 400; margin-bottom: 1rem; color: #343a40; }
.legacy-content > img, .legacy-content > a > img { display: block; margin: 1.5rem auto; }
.legacy-content .portrait { width: 170px!important; height: 170px; object-fit: cover; border-radius: 50%; }
.content-row { display: flex; gap: 1.5rem; padding: 1.5rem 0; border-bottom: 1px solid #e1e5dd; align-items: flex-start; }
.content-cell { min-width: 0; flex: 1 1 0; }
.content-row > .content-cell:first-child:not(:only-child) { flex: 0 1 32%; }
.content-row.single { display: block; }
.content-row h2:first-child { margin-top: 0; }
.content-group { margin: 1rem 0; }
.table-responsive { margin: 1.5rem 0; }
.table { font-size: 1rem; min-width: 520px; }
.table td, .table th { padding: .85rem; }
.table h2 { font-size: 1.15rem; }
iframe { width: 100%; min-height: 460px; border: 1px solid #d9dfd3; }
form { margin: 2rem 0; padding: 1.5rem; background: #f5f5f5; border-radius: .4rem; }
form label { display: block; font-size: 1rem; }
form input, form textarea, form select { max-width: 100%; }
form button { margin-top: 1rem; }
.red { color: #b12823; }
.updates { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 1.5rem; }
.updates blockquote { font-size: .95rem; padding: 1rem; border-top: 3px solid #647d4b; background: #f5f5f5; overflow-wrap: anywhere; }
.footer a { color: #fff; }
.footer { margin: 0; }
.project-facts { padding: 1.5rem; background: #f5f5f5; border-left: 4px solid #647d4b; }
@media(max-width:1399px) { .navbar-collapse { max-height: calc(100dvh - 90px); overflow-y: auto; padding-bottom: 1rem; } }
@media(max-width:991px) { .sidebar-panel { position: static; } .page-content { padding-top: 110px; } .updates { grid-template-columns: 1fr; } }
@media(max-width:640px) { #heroarea { min-height: 430px; padding: 45px 0; } .hero-label { font-size: 1rem; } .content-row { display: block; } .content-cell { margin-bottom: 1rem; } .legacy-content h2 { font-size: 1.45rem; } .navbar-brand { font-size: 1.5rem; } .navbar-brand img { width: 44px; height: 44px; } }
@media(prefers-reduced-motion:reduce) { html { scroll-behavior: auto; } #bgvideo { display: none; } }
@media print { .page-content { padding-top: 0; } .content-row { break-inside: avoid; } a { color: #324123; } }
.navbar-nav { gap: .65rem; }
.navbar .nav-link { padding: .65rem 1rem; background: #41552d; border-radius: .3rem; }
.navbar .nav-link:hover, .navbar .nav-link:focus { background: #53693b; }
.navbar .subscribe-link { background: #647d4b; white-space: nowrap; }
.subscribe-link span { margin-right: .35rem; }
.navbar-brand { margin-right: 1.6rem; }
.subscribe-item { margin-left: .65rem; }
.latest-news { margin-top: 1.5rem; padding: 1.25rem; border-radius: .5rem; background: #41552d; color: white; box-shadow: 0 3px 7px #0002; }
.latest-news h2 { font: 700 1.1rem var(--bs-font-sans-serif); color: white; margin: 0 0 .6rem; }
.latest-news ul { padding-left: 1.1rem; margin: 0; }
.latest-news li { margin: .65rem 0; line-height: 1.5; }
.latest-news li::marker, .latest-news a { color: #ffd34f; }
.latest-news a { font-weight: 700; }
.latest-news time { display: block; color: #e1e8da; font-size: .85rem; }
.news-band { background: #324123; padding: 1rem 0 1.5rem; }
.news-band .latest-news { margin-top: 0; }
.news-band ul { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 2rem; }
.photo-carousel { background: white; }
.gallery-controls { display: flex; gap: 1rem; justify-content: center; align-items: center; padding: .8rem; }
.gallery-controls button { border: 0; background: transparent; color: #515b47; padding: .4rem .7rem; font: inherit; }
.gallery-previous, .gallery-next { font-size: 1.8rem!important; }
.gallery-viewport { overflow: hidden; }
.gallery-track { display: flex; transition: transform .6s ease; }
.gallery-slide { flex: 0 0 25%; min-width: 0; }
.gallery-slide img { display: block; width: 100%; aspect-ratio: 16 / 9; object-fit: cover; }
@media(min-width:1400px) { .navbar > .container { max-width: 1600px; } }
@media(max-width:1399px) { .navbar-nav { gap: .6rem; } .subscribe-item { margin-left: 0; } }
@media(max-width:767px) { .news-band ul { grid-template-columns: 1fr; gap: 0; } .gallery-slide { flex-basis: 50%; } }
@media(prefers-reduced-motion:reduce) { .gallery-track { transition: none; } }

/* Academic forest palette — shared by SilvaLab and its project sites. */
:root, [data-bs-theme=light] {
  --forest: #234437;
  --ivory: #FAFAF5;
  --copper: #B86136;
  --bs-primary: var(--forest);
  --bs-primary-rgb: 35,68,55;
  --bs-secondary: #52685c;
  --bs-secondary-rgb: 82,104,92;
  --bs-body-bg: var(--ivory);
  --bs-body-color: #28382f;
  --bs-heading-color: var(--forest);
  --bs-link-color: #A3512D;
  --bs-link-color-rgb: 163,81,45;
  --bs-link-hover-color: #803C20;
  --bs-link-hover-color-rgb: 128,60,32;
  --bs-border-color: #dce3d9;
}
body, main, .bg-white, .photo-carousel { background-color: var(--ivory)!important; }
.navbar, .footer, .news-band { background-color: var(--forest)!important; }
.navbar .nav-link { background: transparent; border-radius: .2rem; }
.navbar .nav-link:hover, .navbar .nav-link:focus { background: #365848; }
.navbar .nav-link[aria-current=page] { background: #365848; text-decoration-color: #e7ad8c; }
.navbar .subscribe-link { background: var(--copper); }
.navbar .subscribe-link:hover, .navbar .subscribe-link:focus { background: #A3512D; }
.navbar .dropdown-menu { --bs-dropdown-bg: var(--ivory); --bs-dropdown-link-color: var(--forest); --bs-dropdown-link-hover-bg: #eaf0e7; --bs-dropdown-link-hover-color: var(--forest); --bs-dropdown-link-active-bg: var(--forest); }
.dropdown-item[aria-current=page] { background: #eaf0e7; }
h1, h2, h3, h4, h5, h6, .heading { color: var(--forest); }
.hero-content h1, .latest-news h2, .footer h2 { color: var(--ivory); }
.hero-label { border-color: #fafaf5bf; }
#heroarea { background-image: linear-gradient(#234437d9,#23443788),url('video-first-second.jpg'); }
#heroarea::after { background: #23443770; }
.sidebar-panel, form, .project-facts, .updates blockquote { background: #edf1e9; }
.section-link { color: var(--forest); border-color: #dce3d9; }
.section-link:hover, .section-link[aria-current=page] { background: #dde7db; }
.latest-news { background: #365848; box-shadow: none; border-top: 3px solid var(--copper); }
.latest-news li::marker, .latest-news a { color: #F1B797; }
.latest-news time { color: #dfe8db; }
.btn-primary {
  --bs-btn-bg: var(--copper)!important;
  --bs-btn-border-color: var(--copper)!important;
  --bs-btn-color: #fff;
  --bs-btn-hover-bg: #A3512D!important;
  --bs-btn-hover-border-color: #A3512D!important;
  --bs-btn-active-bg: #803C20!important;
  --bs-btn-active-border-color: #803C20!important;
  --bs-btn-disabled-bg: var(--copper)!important;
  --bs-btn-disabled-border-color: var(--copper)!important;
}
.btn-outline-primary { --bs-btn-color: var(--forest); --bs-btn-border-color: var(--forest); --bs-btn-hover-bg: var(--forest); --bs-btn-hover-border-color: var(--forest); --bs-btn-active-bg: var(--forest); --bs-btn-active-border-color: var(--forest); }
.btn { border-radius: .25rem; }
.gallery-controls button { color: var(--forest); }
.project-facts { border-left-color: var(--copper); }
.updates blockquote { border-top-color: var(--copper); }
.director-photo { border-color: #dce3d9; }
.legacy-content p, .legacy-content .prose { color: #34453a; }
.legacy-content h2 { font-size: 1.9rem; margin-top: 2.5rem; }
.legacy-content { line-height: 1.8; }
.content-row { padding: 2rem 0; border-color: #dce3d9; }
a:focus-visible, button:focus-visible, [tabindex]:focus-visible { outline-color: var(--copper); }
@media(max-width:640px) { .legacy-content h2 { font-size: 1.55rem; } }


/* Neutral video treatment with the chosen academic forest palette. */
video#bgvideo { object-fit: cover; object-position: center; }
#heroarea { background-image: url('video-first-second.jpg'); background-size: cover; background-position: center; }
#heroarea::after { background: rgb(0 0 0 / 60%); }
.video-overlay-control {
 position: absolute; right: 1.25rem; bottom: 1rem; z-index: 2;
 padding: .4rem .7rem; border: 1px solid #ffffffb3; border-radius: .25rem;
 background: #0009; color: #fff; font-size: .875rem; line-height: 1.4;
 cursor: pointer;
}
.video-overlay-control:hover { background: #000c; }
.video-divider { height: 8px; background: var(--ivory); }
@media(max-width:640px) { .video-overlay-control { right: .75rem; bottom: .75rem; } }

/* Match the ivory divider below the video with one above it. */
#heroarea { border-top: 8px solid var(--ivory); }

/* Overlay slideshow controls at the bottom-left of the photo strip. */
.photo-carousel { position: relative; }
.gallery-controls {
 position: absolute; left: .75rem; bottom: .75rem; z-index: 2;
 justify-content: flex-start; gap: .25rem; padding: .15rem .3rem;
 background: rgb(0 0 0 / 70%); border: 1px solid #ffffff9e; border-radius: .25rem;
}
.gallery-controls button { color: #fff; padding: .25rem .5rem; font-size: .875rem; line-height: 1.4; }
.gallery-controls button:hover { background: #ffffff26; border-radius: .2rem; }
.gallery-controls .gallery-previous, .gallery-controls .gallery-next { font-size: 1.3rem!important; }
/* Homepage visitor globe. */
.visitor-globe-section { padding: 2rem 0; background: var(--ivory); }
.visitor-globe-section h2 { font-size: 1.6rem; font-weight: 700; margin-bottom: 1rem; }
.visitor-globe-widget { width: min(100%, 320px); min-height: 320px; margin: 0 auto; }
.visitor-globe-widget canvas, .visitor-globe-widget img, .visitor-globe-widget iframe { max-width: 100%; }

/* Alternating full-width homepage sections. */
.home-updates-section { background: #EDF1E9; padding: 3rem 0; }
.home-updates-section h2 { margin-top: 0; margin-bottom: 1.75rem; }
.home-updates-section .updates blockquote { background: var(--ivory); }
.visitor-globe-section { background: var(--ivory); padding: 3rem 0; }
.visitor-globe-widget { width: min(100%,320px); min-height: 350px; }
.visitor-globe-widget .visitor-globe-frame { display: block; width: 100%; height: 350px; min-height: 0; border: 0; }
.globe-service-link { margin: 1rem 0 0; }

/* Center the homepage Lab updates heading and social embeds. */
.home-updates-section h2 { text-align: center; }
.home-updates-section .updates { justify-items: center; }
.home-updates-section .updates > * { width: 100%; max-width: 550px; margin-left: auto!important; margin-right: auto!important; }

/* Center the entire updates container; legacy-content resets its margins. */
.home-updates-section > .container.overview.legacy-content { width: 100%; max-width: 1040px; margin-left: auto; margin-right: auto; }

/* Consistent homepage section titles, including the lab director. */
h2.home-section-heading {
  color: var(--forest);
  font-family: var(--bs-font-headings);
  font-size: 1.9rem;
  font-weight: 700;
  line-height: 1.25;
}
@media (max-width: 640px) {
  h2.home-section-heading { font-size: 1.55rem; }
}
/* The director name sits one step below section titles. */
h2.home-section-heading.director-heading { font-size: 1.65rem; }
@media (max-width: 640px) {
  h2.home-section-heading.director-heading { font-size: 1.35rem; }
}
/* Compact affiliation labels below the homepage video subtitle. */
.hero-affiliation-boxes {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: .65rem;
  margin: 1rem auto 0;
}
.hero-affiliation-boxes span {
  min-width: 210px;
  padding: .35rem .85rem;
  border: 1px solid rgb(250 250 245 / 45%);
  border-radius: .3rem;
  background: rgb(35 68 55 / 65%);
  color: #FAFAF5;
  font-size: .9rem;
  font-weight: 500;
  line-height: 1.4;
}
@media (max-width: 480px) {
  .hero-affiliation-boxes { gap: .5rem; }
  .hero-affiliation-boxes span { min-width: 0; padding: .35rem .6rem; font-size: .8rem; }
}
/* Awards use the shared academic forest palette. */
.award-entry { display:grid; grid-template-columns:4.5rem 1fr; gap:1rem; padding:1.25rem 0; border-bottom:1px solid var(--bs-border-color); }
.award-year { color:var(--copper); font-weight:700; padding-top:.15rem; }
.legacy-content .award-entry h3 { margin:0 0 .4rem; color:var(--forest); }
.legacy-content .award-entry p { margin:0; }
@media(max-width:480px) { .award-entry { grid-template-columns:1fr; gap:.3rem; } }

.award-photo { margin:1rem 0 0; max-width:360px; }
.award-photo img { display:block; width:100%; height:auto; border-radius:.35rem; }

.tool-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1.5rem; }
.tool-card { border:1px solid var(--bs-border-color); border-radius:.4rem; overflow:hidden; background:#fff; }
.tool-card > div { padding:1.1rem; }
.tool-card img { display:block; width:100%; aspect-ratio:16/9; object-fit:contain; background:#fff; }
.legacy-content .tool-card h3 { margin:0 0 .7rem; }
.tool-card h3 a { color:var(--forest); }
@media(max-width:700px) { .tool-grid { grid-template-columns:1fr; } }

/* Compact package covers retain the full scientific artwork. */
.package-grid .package-cover{display:flex;align-items:center;justify-content:center;padding:12px;background:#fff}
.package-grid .package-cover img{width:100%;height:170px;aspect-ratio:auto;object-fit:contain;background:#fff}

.latest-news li[hidden]{display:none!important}.news-controls{display:flex;gap:.4rem;flex-wrap:wrap;margin-top:.8rem}.news-controls button{background:#fff;color:#234437;border:1px solid #b8c8bd;border-radius:4px;padding:.25rem .5rem;font-size:.8rem}.news-controls button:focus-visible{outline:2px solid #B86136;outline-offset:2px}

.latest-news ul{display:flex;flex-direction:column}.news-band .latest-news ul{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.5rem}.news-band .latest-news li{min-width:0}@media(max-width:650px){.news-band .latest-news ul{grid-template-columns:1fr;gap:0}}
/* Keep the expanded mobile menu in document flow, above page content. */
@media(max-width:1399.98px){
 body > header.fixed-top{position:relative;top:auto}
 #heroarea{margin-top:0}
 .page-content{padding-top:2rem}
 #site-nav .navbar-nav{gap:.2rem;width:100%;margin:0!important}
 #site-nav .nav-item{width:100%;margin:0}
 #site-nav .nav-link{display:block;width:100%;text-align:center;padding:.65rem 1rem}
 #site-nav .dropdown-menu{text-align:center}
 #site-nav .dropdown-item{white-space:normal}
 #site-nav{max-height:calc(100dvh - 90px);overflow-y:auto}
 .news-band .latest-news{height:auto;max-height:none;overflow:visible}
 .news-band .latest-news h2{line-height:1.4;margin-top:0}
 .news-band .latest-news li{overflow-wrap:break-word;min-width:0}
}

/* Keep the poster background visible until the first video frame is ready. */
video#bgvideo { opacity: 0; transition: opacity .2s ease; }
video#bgvideo.video-ready { opacity: 1; }

/* Three highlights per rotation, with full-width cards on phones. */
.highlights-track { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1.25rem; align-items:start; }
.highlight-card { min-width:0; background:#fff; border-radius:8px; overflow:hidden; }
.highlight-card[hidden] { display:none!important; }
.highlight-card iframe { display:block; width:100%; max-width:100%; border:0; }
.highlight-card > p { padding:.6rem 1rem; margin:0; }
.highlight-card .twitter-tweet { margin:0 auto!important; }
.highlights-carousel .news-controls { justify-content:center; margin-top:1rem; }
@media(max-width:767px) { .highlights-track { grid-template-columns:1fr; } }

/* Long project narratives use the full content width, with figures below. */
.project-prose-row { display: block; }
.project-prose-row > .content-cell { width: 100%; margin-bottom: 1.5rem; }
.project-prose-row > .content-cell:last-child { margin-bottom: 0; }
.project-prose-row > .content-cell img { display: block; height: auto; max-width: 100%; margin: 1rem auto; }