/* BiblioHelp landing — violet house style (cris-eilein), the same design
   language as fair-repo-audit and coara-action-planner. Chrome tokens are
   violet; the DATA palette is BiblioHelp's own: the three verdict states
   (verified / review / likely-fake) it sorts every reference into. */
/* Self-hosted Inter (variable) — no external CDN, so the "private by design"
   promise holds. Latin + latin-ext cover ES/EN/DE. */
@font-face{
  font-family:'Inter Variable'; font-style:normal; font-display:swap; font-weight:100 900;
  src:url(./fonts/inter-latin-wght-normal.woff2) format('woff2-variations');
  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+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face{
  font-family:'Inter Variable'; font-style:normal; font-display:swap; font-weight:100 900;
  src:url(./fonts/inter-latin-ext-wght-normal.woff2) format('woff2-variations');
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
:root{
  --paper:#f7f6fb; --surface:#fff; --surface-2:#f1f0f7; --surface-3:#eae8f3;
  --ink:#17151f; --ink-2:#52505e; --muted:#8a8895; --hairline:#e5e3ef;
  --brand:#6d4aff; --brand-soft:#eeebff;
  --shadow:0 1px 2px rgba(23,21,31,.06), 0 8px 24px rgba(23,21,31,.05);
  --r:14px; --r-sm:9px;
  --disp:"Inter Variable","Inter","Helvetica Neue",Helvetica,Arial,system-ui,sans-serif;
  --body:"Inter Variable","Inter",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --mono:ui-monospace,"SF Mono","JetBrains Mono",Menlo,Consolas,monospace;
  /* verdict palette — light */
  --ok:#1f9670; --ok-soft:#e4f4ee; --warn:#c08519; --warn-soft:#f7efdc; --bad:#c0463d; --bad-soft:#f8e7e4;
}
:root[data-theme="dark"]{
  --paper:#121118; --surface:#1b1a22; --surface-2:#232230; --surface-3:#2c2a3a;
  --ink:#eceaf3; --ink-2:#a9a7b5; --muted:#8a8895; --hairline:#2c2a38;
  --brand:#8b7bff; --brand-soft:#221f35;
  --shadow:0 1px 2px rgba(0,0,0,.4), 0 10px 30px rgba(0,0,0,.35);
  --ok:#2aa87a; --ok-soft:#16281f; --warn:#d99a2b; --warn-soft:#2a2213; --bad:#d1544b; --bad-soft:#2a1715;
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    --paper:#121118; --surface:#1b1a22; --surface-2:#232230; --surface-3:#2c2a3a;
    --ink:#eceaf3; --ink-2:#a9a7b5; --muted:#8a8895; --hairline:#2c2a38;
    --brand:#8b7bff; --brand-soft:#221f35;
    --shadow:0 1px 2px rgba(0,0,0,.4), 0 10px 30px rgba(0,0,0,.35);
    --ok:#2aa87a; --ok-soft:#16281f; --warn:#d99a2b; --warn-soft:#2a2213; --bad:#d1544b; --bad-soft:#2a1715;
  }
}
*{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;}
body{margin:0;font-family:var(--body);background:var(--paper);color:var(--ink);
  line-height:1.55;font-size:15.5px;-webkit-font-smoothing:antialiased;
  transition:background .25s,color .25s;
  min-height:100vh;display:flex;flex-direction:column;}
main{flex:1;}
a{color:var(--brand);text-underline-offset:2px;}
h1,h2{font-family:var(--disp);font-weight:800;letter-spacing:-.022em;text-wrap:balance;margin:0;}
.eyebrow{font-family:var(--mono);font-size:11px;letter-spacing:.15em;text-transform:uppercase;color:var(--brand);font-weight:600;}
::selection{background:var(--brand);color:#fff;}
:focus-visible{outline:2px solid var(--brand);outline-offset:2px;border-radius:5px;}

.wrap{max-width:1020px;margin:0 auto;padding:0 32px;}

/* ── top bar ── */
.bar{position:sticky;top:0;z-index:40;backdrop-filter:saturate(1.5) blur(10px);
  background:color-mix(in oklab,var(--paper),transparent 12%);border-bottom:1px solid var(--hairline);}
.bar-in{display:flex;align-items:center;gap:12px;height:60px;}
.brand{display:flex;align-items:center;gap:11px;text-decoration:none;color:inherit;}
.glyph{width:34px;height:34px;border-radius:9px;flex:none;position:relative;
  background:linear-gradient(135deg,var(--brand),color-mix(in oklab,var(--brand),#db2777 52%));
  box-shadow:0 4px 14px color-mix(in oklab,var(--brand),transparent 62%);}
.glyph::after{content:"B";position:absolute;inset:0;display:grid;place-items:center;
  font-family:var(--mono);font-size:16px;font-weight:700;color:rgba(255,255,255,.94);}
.brand-name{font-family:var(--disp);font-weight:800;letter-spacing:-.02em;font-size:16px;line-height:1;}
.brand-sub{font-family:var(--mono);font-size:9.5px;color:var(--muted);letter-spacing:.04em;margin-top:3px;}
.spacer{flex:1;}
.langs{display:flex;gap:1px;}
.langs button{border:none;background:none;color:var(--ink-2);padding:6px 8px;border-radius:6px;
  cursor:pointer;font-family:var(--mono);font-size:11.5px;}
.langs button[aria-current="true"]{color:var(--ink);background:var(--surface-2);font-weight:600;}
.iconbtn{width:34px;height:34px;border-radius:var(--r-sm);border:1px solid var(--hairline);
  background:var(--surface);display:grid;place-items:center;color:var(--ink-2);cursor:pointer;}
.iconbtn:hover{color:var(--ink);border-color:var(--ink-2);}
.iconbtn svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:1.8;}
.ghost{font-family:var(--mono);font-size:12px;color:var(--ink-2);border:1px solid var(--hairline);
  background:var(--surface);border-radius:8px;padding:7px 12px;cursor:pointer;text-decoration:none;white-space:nowrap;}
.ghost:hover{color:var(--brand);border-color:var(--ink-2);}
@media (max-width:560px){.ghost.hide-sm{display:none;}}

/* ── hero ── */
.hero{padding:64px 0 12px;text-align:center;}
.hero h1{font-size:clamp(2.2rem,5vw,3.2rem);line-height:1.04;margin:16px 0 0;}
.hero h1 em{font-style:normal;color:var(--brand);}
.lede{color:var(--ink-2);font-size:1.05rem;max-width:62ch;margin:18px auto 0;}
.lede b{color:var(--ink);font-weight:600;}
.cta{display:flex;flex-wrap:wrap;gap:11px;margin-top:26px;justify-content:center;}
.btn{font-family:var(--mono);font-size:.9rem;font-weight:600;letter-spacing:.01em;border-radius:var(--r-sm);
  padding:13px 22px;cursor:pointer;text-decoration:none;display:inline-flex;align-items:center;gap:8px;border:1px solid transparent;}
.btn-primary{background:var(--brand);color:#fff;box-shadow:0 6px 20px color-mix(in oklab,var(--brand),transparent 66%);}
.btn-primary:hover{filter:brightness(1.07);transform:translateY(-1px);}
.btn-ghost{background:var(--surface);border-color:var(--hairline);color:var(--ink);}
.btn-ghost:hover{border-color:var(--brand);color:var(--brand);}
.btn{transition:transform .15s,filter .15s,border-color .15s,color .15s;}

/* ── three verdicts ── */
.verdicts-sec{padding:44px 0 8px;}
.verdicts-sec h2{font-size:1.15rem;text-align:center;margin-bottom:20px;color:var(--ink-2);font-weight:700;}
.verdicts{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;}
/* status accent = 3px LEFT border, the family convention (fair-repo-audit .chk) */
.vc{background:var(--surface);border:1px solid var(--hairline);border-radius:var(--r);padding:18px;
  box-shadow:var(--shadow);border-left:3px solid var(--vc);display:flex;flex-direction:column;gap:11px;}
.vc.ok{--vc:var(--ok);} .vc.warn{--vc:var(--warn);} .vc.bad{--vc:var(--bad);}
.vc-top{display:flex;align-items:center;gap:9px;}
.vc-badge{font-family:var(--mono);font-size:.68rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;
  color:#fff;background:var(--vc);padding:3px 9px;border-radius:20px;}
.vc-icon{margin-left:auto;font-size:1.1rem;color:var(--vc);}
.vc-ref{font-family:var(--mono);font-size:.76rem;color:var(--ink-2);line-height:1.55;}
.vc-ref b{color:var(--ink);font-weight:600;}
.vc-why{font-size:.88rem;color:var(--ink-2);margin-top:auto;padding-top:4px;}
.vc-why b{color:var(--ink);font-weight:600;}

/* ── about line ── */
.about{color:var(--ink-2);font-size:.92rem;text-align:center;max-width:66ch;margin:0 auto;padding:20px 0 40px;}

footer{border-top:1px solid var(--hairline);}
.foot{display:flex;flex-wrap:wrap;align-items:center;gap:8px 16px;padding:22px 0 30px;
  font-family:var(--mono);font-size:.78rem;color:var(--muted);}
.foot a{color:var(--ink-2);text-decoration:none;} .foot a:hover{color:var(--brand);}
.foot .spacer{flex:1;min-width:20px;}

@media (max-width:880px){
  .hero{padding:44px 0 8px;}
  .verdicts{grid-template-columns:1fr;}
}
@media (max-width:600px){.wrap{padding:0 20px;}}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;}}