/* =========================================================================
   BioExplorer homepage rebuild
   Enqueue on the front page only. Class names match
   bioexplorer-home.gutenberg.txt and the shortcode output.

   Brand values taken from the live site:
     green #116E02 (nav link), gold #FDDD68 (button), Lato body, Caprasimo headings.
   ========================================================================= */

:root{
  --be-green:#116E02;
  --be-green-hi:#0B4A01;
  --be-green-soft:#EAF3E5;
  --be-gold:#FDDD68;
  --be-gold-deep:#B98A05;

  --be-paper:#FAFAF7;
  --be-surface:#FFFFFF;
  --be-surface-2:#F1F3EA;
  --be-ink:#16180F;
  --be-ink-soft:#3A3E30;
  --be-muted:#5F6553;
  --be-rule:#E0E4D6;

  --be-band:#0E2A06;
  --be-band-2:#153E0B;
  --be-on-band:#E4EFDE;
  --be-on-band-muted:#A8C09C;

  --be-shadow:0 1px 2px rgba(22,24,15,.05),0 8px 24px -12px rgba(22,24,15,.18);
  --be-mono:"IBM Plex Mono",ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  --be-sans:"Lato",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
  --be-display:"Caprasimo","Lato",Georgia,serif;
}

/* -------------------------------------------------------------------------
   Typography correction.
   Caprasimo currently sets the nav, the buttons and every heading. Demote it
   to display only. This single change does more for how modern the site
   feels than any other rule in this file.
   ------------------------------------------------------------------------- */
.home .be-hero__title,
.home .be-section-title{ font-family:var(--be-display); letter-spacing:-.02em; line-height:1.1; }
.home .wp-block-navigation a,
.home .wp-block-button__link,
.home .be-pillar__title{ font-family:var(--be-sans); }

/* ---------- shared section scaffolding ---------- */
.be-section{ padding-block:clamp(3rem,6vw,5rem); border-top:1px solid var(--be-rule); }
.be-section--paper{ background:var(--be-paper); }
.be-section--surface{ background:var(--be-surface); }
.be-section-title{ font-size:clamp(1.75rem,3.4vw,2rem); margin:.4rem 0 0; }
.be-section-lede{ color:var(--be-muted); max-width:56ch; margin-top:.6rem; }
.be-section > .wp-block-columns{ margin-top:2rem; }

.be-eyebrow{
  font:600 .8125rem/1 var(--be-mono);
  letter-spacing:.1em; text-transform:uppercase; color:var(--be-muted); margin:0;
}

.be-band{ background:var(--be-band); color:var(--be-on-band); border-top:0; }
.be-band .be-eyebrow{ color:var(--be-gold); }
.be-band .be-section-title{ color:var(--be-on-band); }
.be-band .be-section-lede{ color:var(--be-on-band-muted); }
.be-band a{ color:var(--be-on-band); }
.be-band a:hover{ color:var(--be-gold); }

/* ---------- band 1 : hero ---------- */
.be-hero{ background:var(--be-surface); padding-block:clamp(2.5rem,5vw,4.25rem) clamp(2rem,4vw,3rem); }
.be-hero__grid{ gap:clamp(2rem,4vw,3.5rem); }
.be-hero__title{ font-size:clamp(2.25rem,5.2vw,3.5rem); margin:.85rem 0 0; }
.be-hero__title em{ font-style:normal; color:var(--be-green); }
.be-hero__sub{ font-size:1.25rem; color:var(--be-ink-soft); max-width:34ch; margin-top:1rem; }

.be-search{ margin-top:1.75rem; }
.be-search__row{ display:flex; gap:.5rem; }
.be-search__field{
  flex:1; display:flex; align-items:center; gap:.65rem; min-width:0;
  background:var(--be-surface); border:2px solid var(--be-ink); border-radius:10px;
  padding:.2rem .2rem .2rem .9rem;
}
.be-search__field:focus-within{ border-color:var(--be-green); box-shadow:0 0 0 4px var(--be-green-soft); }
.be-search__field svg{ flex:none; color:var(--be-muted); }
.be-search__field input{
  flex:1; min-width:0; border:0; background:transparent; color:var(--be-ink);
  font:400 1.0625rem/1 var(--be-sans); padding:.85rem 0;
}
.be-search__field input:focus{ outline:none; }
.be-search__btn{
  border:0; cursor:pointer; background:var(--be-gold); color:var(--be-ink);
  font:900 .875rem/1 var(--be-sans); letter-spacing:.08em; text-transform:uppercase;
  padding:0 1.5rem; border-radius:10px;
}
.be-search__btn:hover{ background:var(--be-gold-deep); color:#fff; }
.be-search__hint{ margin-top:.8rem; font-size:.8125rem; color:var(--be-muted); display:flex; gap:.5rem; flex-wrap:wrap; align-items:baseline; }
.be-chip{
  display:inline-block; text-decoration:none; font-size:.8125rem;
  border:1px solid var(--be-rule); border-radius:999px; padding:.25rem .6rem;
  color:var(--be-ink-soft); background:var(--be-paper);
}
.be-chip:hover{ border-color:var(--be-green); color:var(--be-green); }

.be-sugg{ list-style:none; margin:.6rem 0 0; padding:0; border:1px solid var(--be-rule); border-radius:10px; background:var(--be-surface); box-shadow:var(--be-shadow); overflow:hidden; }
.be-sugg:empty{ display:none; }
.be-sugg li{ border-bottom:1px solid var(--be-rule); }
.be-sugg li:last-child{ border-bottom:0; }
.be-sugg a{ display:flex; justify-content:space-between; gap:1rem; padding:.6rem .9rem; text-decoration:none; font-size:.9375rem; }
.be-sugg a:hover{ background:var(--be-green-soft); }
.be-sugg span{ font:400 .8125rem/1.6 var(--be-mono); color:var(--be-muted); }

.be-proof{ border:1px solid var(--be-rule); border-radius:14px; background:var(--be-paper); padding:1.4rem 1.5rem; box-shadow:var(--be-shadow); }
.be-proof h2{ font:900 .8125rem/1 var(--be-sans); letter-spacing:.1em; text-transform:uppercase; color:var(--be-muted); margin:0; }
.be-proof dl{ margin:1.1rem 0 0; display:grid; gap:.9rem; }
.be-proof div{ display:flex; align-items:baseline; gap:.7rem; border-bottom:1px dotted var(--be-rule); padding-bottom:.85rem; }
.be-proof div:last-child{ border-bottom:0; padding-bottom:0; }
.be-proof dt{ font:600 1.5rem/1 var(--be-mono); color:var(--be-green); font-variant-numeric:tabular-nums; flex:none; min-width:5.5ch; }
.be-proof dd{ margin:0; font-size:.9375rem; color:var(--be-ink-soft); }

/* ---------- band 2 : trust rule ---------- */
.be-trust{ padding-block:0; }
.be-trust__list{ list-style:none; margin:0; padding:1rem 0; display:flex; gap:1.75rem; flex-wrap:wrap; align-items:center; }
.be-trust__list li{ display:flex; align-items:center; gap:.55rem; font-size:.9375rem; }
.be-trust__list svg{ color:var(--be-gold); flex:none; }
.be-trust__list a{ text-underline-offset:3px; }

/* ---------- band 3 : pillars ---------- */
.be-pillars{ gap:1.25rem; }
.be-pillar{
  display:flex; flex-direction:column; height:100%; text-decoration:none; color:inherit;
  border:1px solid var(--be-rule); border-radius:14px; overflow:hidden; background:var(--be-surface);
  transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.be-pillar:hover{ transform:translateY(-3px); box-shadow:var(--be-shadow); border-color:var(--be-green); }
.be-pillar__art{
  aspect-ratio:16/10; display:grid; place-items:center;
  background:linear-gradient(150deg,var(--be-green-soft),var(--be-surface-2));
  border-bottom:1px solid var(--be-rule);
}
.be-pillar__art svg{ width:44%; height:auto; color:var(--be-green); opacity:.9; }
.be-pillar__body{ padding:1.1rem 1.2rem 1.3rem; display:flex; flex-direction:column; gap:.5rem; flex:1; }
.be-pillar__title{ font:400 1.5rem/1.1 var(--be-display); }
.be-pillar__desc{ font-size:.9375rem; color:var(--be-muted); }
.be-pillar__count{ margin-top:auto; font:500 .8125rem/1 var(--be-mono); color:var(--be-green); padding-top:.6rem; }

/* ---------- band 4 : tools ---------- */
.be-branches{
  display:grid; grid-template-columns:repeat(3,1fr); gap:1px;
  background:rgba(255,255,255,.14); border:1px solid rgba(255,255,255,.14);
  border-radius:12px; overflow:hidden; margin-top:2rem;
}
@media (max-width:920px){ .be-branches{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:560px){ .be-branches{ grid-template-columns:1fr; } }
.be-branch{ background:var(--be-band-2); padding:1.15rem 1.25rem 1.35rem; display:flex; flex-direction:column; gap:.75rem; }
.be-branch__head{ display:flex; align-items:baseline; justify-content:space-between; gap:.75rem; padding-bottom:.7rem; border-bottom:1px solid rgba(255,255,255,.16); }
.be-branch__head h3{ font:700 1rem/1.2 var(--be-sans); color:var(--be-on-band); margin:0; }
.be-branch__n{ font:600 .8125rem/1 var(--be-mono); color:var(--be-gold); font-variant-numeric:tabular-nums; flex:none; }
.be-branch ul{ list-style:none; margin:0; padding:0; display:grid; gap:.3rem; }
.be-branch a{ display:block; text-decoration:none; color:var(--be-on-band-muted); font:400 .8125rem/1.45 var(--be-mono); }
.be-branch a:hover{ color:var(--be-gold); }

.be-soon{ margin-top:1.25rem; padding:.9rem 1.15rem; border:1px dashed rgba(255,255,255,.28); border-radius:10px; font-size:.875rem; color:var(--be-on-band-muted); }
.be-soon b{ color:var(--be-on-band); font-weight:700; }

.be-tools__cta{ margin-top:1.75rem; }
.be-tools .be-btn-gold .wp-block-button__link{
  background:var(--be-gold); color:var(--be-ink);
  font:900 .875rem/1 var(--be-sans); letter-spacing:.08em; text-transform:uppercase;
  padding:.95rem 1.6rem; border-radius:999px;
}
.be-tools .be-btn-gold .wp-block-button__link:hover{ background:#fff; }
.be-tools__note{ font-size:.9375rem; color:var(--be-on-band-muted); margin-top:.9rem; }

/* ---------- band 5 : glossary ---------- */
.be-gloss{ gap:clamp(1.5rem,4vw,3rem); }
.be-az{ display:flex; flex-wrap:wrap; gap:.3rem; margin-top:1.4rem; }
.be-az button{
  font:500 .875rem/1 var(--be-mono); cursor:pointer;
  width:2.15rem; height:2.15rem; border-radius:6px;
  border:1px solid var(--be-rule); background:var(--be-surface); color:var(--be-ink-soft);
}
.be-az button:hover{ border-color:var(--be-green); color:var(--be-green); }
.be-az button[aria-pressed="true"]{ background:var(--be-green); border-color:var(--be-green); color:#fff; }

.be-terms{ border:1px solid var(--be-rule); border-radius:14px; background:var(--be-surface); overflow:hidden; }
.be-terms__head{ display:flex; justify-content:space-between; align-items:baseline; gap:1rem; padding:.9rem 1.2rem; border-bottom:1px solid var(--be-rule); background:var(--be-surface-2); }
.be-terms__head b{ font:900 .8125rem/1 var(--be-sans); letter-spacing:.1em; text-transform:uppercase; }
.be-terms__head span{ font:400 .8125rem/1 var(--be-mono); color:var(--be-muted); }
.be-terms ul{ list-style:none; margin:0; padding:0; max-height:23rem; overflow:auto; }
.be-terms li{ border-bottom:1px solid var(--be-rule); }
.be-terms li:last-child{ border-bottom:0; }
.be-terms a{ display:grid; grid-template-columns:1fr auto; gap:.3rem 1rem; padding:.75rem 1.2rem; text-decoration:none; }
.be-terms a:hover{ background:var(--be-green-soft); }
.be-terms b{ font-weight:700; font-size:.9375rem; }
.be-terms em{ grid-column:1/-1; font-style:normal; font-size:.875rem; color:var(--be-muted); }
.be-terms span{ font:400 .6875rem/1.6 var(--be-mono); letter-spacing:.04em; text-transform:uppercase; color:var(--be-green); white-space:nowrap; }

/* ---------- band 6 : latest ---------- */
.be-posts{ gap:1.5rem !important; margin-top:2rem; }
.be-post__art img{ border-radius:12px; border:1px solid var(--be-rule); }
.be-post__kicker{ font:500 .6875rem/1 var(--be-mono); letter-spacing:.1em; text-transform:uppercase; color:var(--be-green); margin:.7rem 0 .35rem; }
.be-post__kicker a{ text-decoration:none; color:inherit; }
.be-post__title{ font:900 1.25rem/1.28 var(--be-sans); margin:0; }
.be-post__title a{ text-decoration:none; color:var(--be-ink); }
.be-post__title a:hover{ color:var(--be-green); }
.be-byline{ gap:.6rem !important; margin-top:.75rem; padding-top:.7rem; border-top:1px solid var(--be-rule); align-items:center; }
.be-byline__badge{
  width:1.75rem; height:1.75rem; border-radius:50%; flex:none; display:grid; place-items:center;
  background:var(--be-green-soft); color:var(--be-green); border:1px solid var(--be-green);
}
.be-byline__text{ display:grid; gap:0; }
.be-byline__label{ font:700 .8125rem/1.35 var(--be-sans); color:var(--be-ink-soft); margin:0; }
.be-byline__date{ font-size:.8125rem; color:var(--be-muted); font-variant-numeric:tabular-nums; }

/* ---------- band 7 : cited ---------- */
.be-cited{ background:var(--be-surface-2); }
.be-cited__logos{ display:flex; flex-wrap:wrap; gap:.6rem 2rem; align-items:center; padding:1.4rem 0; border-block:1px solid var(--be-rule); margin:1.5rem 0; }
.be-cited__logos span{ font:700 .9375rem/1.2 var(--be-sans); color:var(--be-ink-soft); }
.be-cited__logos span.num{ font:600 .9375rem/1.2 var(--be-mono); color:var(--be-green); }
.be-cited__pair{ display:grid; grid-template-columns:1fr 1fr; gap:1.25rem; }
@media (max-width:760px){ .be-cited__pair{ grid-template-columns:1fr; } }
.be-cite{ background:var(--be-surface); border:1px solid var(--be-rule); border-left:4px solid var(--be-gold); border-radius:0 12px 12px 0; padding:1.25rem 1.4rem; }
.be-cite b{ display:block; font-size:1.25rem; font-weight:900; margin-bottom:.4rem; }
.be-cite p{ font-size:.9375rem; color:var(--be-muted); }
.be-cite a{ color:var(--be-green); font-weight:700; font-size:.875rem; text-decoration:none; border-bottom:1px solid currentColor; display:inline-block; margin-top:.8rem; }

/* ---------- band 8 : how we work ---------- */
.be-how{ gap:2rem; }
.be-how h3{ font:900 1.25rem/1.2 var(--be-sans); margin-bottom:.5rem; }
.be-how p, .be-how li{ color:var(--be-muted); font-size:.9375rem; }
.be-how a{ color:var(--be-green); font-weight:700; }
.be-quals{ list-style:none; display:grid; gap:.5rem; margin:1.1rem 0 0; padding:0; }
.be-quals li{ display:flex; align-items:baseline; gap:.7rem; border:1px solid var(--be-rule); border-radius:8px; padding:.55rem .85rem; background:var(--be-surface); }
.be-quals b{ font:600 .8125rem/1.3 var(--be-mono); color:var(--be-green); flex:none; min-width:4.5ch; }
.be-quals span{ font-size:.875rem; color:var(--be-ink-soft); }

/* ---------- band 9 : explore ---------- */
.be-explore{ display:grid; grid-template-columns:repeat(4,1fr); gap:1.5rem 2rem; margin-top:2rem; }
@media (max-width:900px){ .be-explore{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:520px){ .be-explore{ grid-template-columns:1fr; } }
.be-explore h3{ font:500 .75rem/1 var(--be-mono); letter-spacing:.1em; text-transform:uppercase; color:var(--be-muted); margin:0 0 .9rem; padding-bottom:.6rem; border-bottom:1px solid var(--be-rule); }
.be-explore ul{ list-style:none; margin:0; padding:0; display:grid; gap:.45rem; }
.be-explore a{ text-decoration:none; font-size:.9375rem; color:var(--be-ink-soft); }
.be-explore a:hover{ color:var(--be-green); }

/* ---------- accessibility ---------- */
.be-sr{ position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }
.home :focus-visible{ outline:3px solid var(--be-gold-deep); outline-offset:3px; }
@media (prefers-reduced-motion:reduce){ .be-pillar{ transition:none; } }