/* ============================================================
   LuvionBio Research — premium lab-report stylesheet
   Display: Newsreader · Body: Inter · Data/labels: IBM Plex Mono
   ============================================================ */
@import url('https://fonts.googleapis.com/css2?family=Newsreader:ital,opsz,wght@0,6..72,400;0,6..72,500;1,6..72,400;1,6..72,500&family=Inter:wght@400;500;600&family=IBM+Plex+Mono:wght@400;500&display=swap');

:root{
  --paper:#F4F5F6;        /* soft cool paper the sheet floats on */
  --surface:#FFFFFF;      /* the report sheet */
  --ink:#102234;          /* deep navy ink — headings */
  --ink-soft:#2C3947;     /* body text */
  --slate:#5C6675;        /* secondary text */
  --signal:#1668B0;       /* LuvionBio blue — the live accent */
  --signal-deep:#10548C;
  --brass:#B08A4F;        /* the LB diamond gold — hairlines, markers */
  --line:#E4E7EA;
  --line-soft:#EEF0F2;
  --no:#B0573F;

  --serif:'Newsreader',Georgia,'Times New Roman',serif;
  --sans:'Inter',-apple-system,'Helvetica Neue',Arial,sans-serif;
  --mono:'IBM Plex Mono',ui-monospace,'SF Mono',Menlo,monospace;
}

*{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;}
body{
  margin:0;
  padding:clamp(0px,4vw,44px) clamp(0px,3vw,28px);
  background:var(--paper);
  color:var(--ink-soft);
  font-family:var(--sans);
  font-size:16px;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
a{color:var(--signal); text-decoration:none;}
img{max-width:100%; height:auto;}

/* floating sheet */
.top-rule{max-width:880px; margin:0 auto; height:3px; background:var(--signal);}
.card{
  max-width:880px; margin:0 auto; background:var(--surface);
  border:1px solid var(--line); border-top:none;
  box-shadow:0 24px 60px -34px rgba(16,34,52,.28);
}
.inner{padding:0 clamp(22px,5vw,60px) 12px;}

/* header */
.masthead{text-align:center; padding:clamp(30px,5vw,44px) 24px 6px;}
.site-logo{width:clamp(186px,42vw,244px);}
.logo-link{display:inline-block;}
.nav-back{
  display:inline-block; margin-top:18px; font-family:var(--mono);
  font-size:11px; letter-spacing:1.5px; text-transform:uppercase; color:var(--slate);
}
.nav-back:hover{color:var(--signal);}

/* type */
h1{
  font-family:var(--serif); font-weight:400; color:var(--ink);
  font-size:clamp(30px,6vw,44px); line-height:1.12; letter-spacing:-.01em;
  text-align:center; margin:20px 0 0;
}
.section-title{
  font-family:var(--serif); font-weight:400; color:var(--ink);
  font-size:clamp(24px,4.6vw,31px); line-height:1.16; text-align:center; margin:0;
}
.lede{
  text-align:center; color:var(--slate); font-size:clamp(15px,2.2vw,17px);
  line-height:1.6; margin:16px auto 0; max-width:600px;
}
.sublede{
  font-family:var(--mono); text-align:center; color:var(--slate);
  font-size:12px; line-height:1.65; letter-spacing:.2px; margin:13px auto 0; max-width:660px;
}
.eyebrow{
  font-family:var(--mono); font-size:11px; letter-spacing:2.5px; text-transform:uppercase;
  color:var(--signal); font-weight:500; margin:0 0 8px;
}
h2{font-family:var(--serif); font-weight:400; color:var(--ink); font-size:clamp(20px,3.6vw,25px); line-height:1.25; margin:38px 0 8px;}
h3{font-family:var(--sans); font-weight:600; color:var(--ink); font-size:16px; margin:24px 0 4px;}
p{margin:0 0 15px;}
.muted{color:var(--slate); font-size:13px;}
ul{margin:0 0 15px; padding-left:20px;}
li{margin:5px 0;}
strong{color:var(--ink);}

/* markers */
.tick{width:11px; height:11px; margin:0 auto 16px; transform:rotate(45deg); border:1.5px solid var(--brass);}
.hairline{width:64px; height:1px; background:var(--brass); opacity:.6; margin:24px auto;}
.divider{border:0; border-top:1px solid var(--line); margin:40px 0;}

/* hub cards */
.hub{margin:30px 0 8px;}
.hub-card{
  display:block; position:relative; color:inherit; background:var(--surface);
  border:1px solid var(--line); border-radius:5px; padding:22px 56px 22px 24px; margin:0 0 14px;
  transition:border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}
a.hub-card:hover{border-color:var(--signal); box-shadow:0 16px 34px -22px rgba(22,104,176,.5); transform:translateY(-1px);}
.hc-title{font-family:var(--serif); font-size:20px; color:var(--ink); line-height:1.2;}
.hc-desc{font-size:14px; color:var(--slate); margin-top:5px;}
.hc-arrow{position:absolute; top:24px; right:24px; color:var(--brass); font-size:18px; transition:transform .18s ease, color .18s ease;}
a.hub-card:hover .hc-arrow{color:var(--signal); transform:translateX(3px);}

/* study cards */
.study{border:1px solid var(--line); border-top:3px solid var(--brass); border-radius:5px; padding:26px 28px; margin:24px 0; background:var(--surface);}
.study h3{font-family:var(--serif); font-weight:400; font-size:23px; color:var(--ink); margin:3px 0 2px;}
.study .tag{font-family:var(--mono); font-size:11px; letter-spacing:1.5px; text-transform:uppercase; color:var(--slate);}
.metrics{display:flex; flex-wrap:wrap; gap:14px; margin:20px 0;}
.metric{flex:1 1 150px; border:1px solid var(--line); border-radius:5px; padding:16px 18px; background:var(--paper);}
.metric .big{font-family:var(--serif); font-size:26px; color:var(--ink); line-height:1.1;}
.metric .lbl{font-family:var(--mono); font-size:10px; letter-spacing:.4px; text-transform:uppercase; color:var(--slate); margin-top:9px; line-height:1.45;}
.metric .tier{display:inline-block; margin-top:8px; font-family:var(--mono); font-size:10px; font-weight:500; color:var(--signal); letter-spacing:.3px;}

/* buttons */
.btn{display:inline-block; font-family:var(--sans); font-size:14px; font-weight:600; letter-spacing:.2px; padding:14px 28px; border-radius:4px; transition:background .18s ease, color .18s ease, border-color .18s ease;}
.btn-primary{background:var(--signal); color:#fff;}
.btn-primary:hover{background:var(--signal-deep);}
.btn-outline{background:transparent; color:var(--ink); border:1px solid var(--ink);}
.btn-outline:hover{background:var(--ink); color:#fff;}
.btn-row{text-align:center; margin:18px 0;}

/* tables — horizontal rules only, mono headers */
.tbl-wrap{overflow-x:auto; margin:16px 0; -webkit-overflow-scrolling:touch;}
table{border-collapse:collapse; width:100%; font-size:14px;}
th{font-family:var(--mono); font-weight:500; font-size:11px; letter-spacing:.6px; text-transform:uppercase; color:var(--ink); text-align:left; padding:11px 14px; border-bottom:1.5px solid var(--brass); vertical-align:bottom;}
td{padding:11px 14px; border-bottom:1px solid var(--line-soft); text-align:left; vertical-align:top; color:var(--ink-soft);}
tbody tr:last-child td{border-bottom:1px solid var(--line);}
.yes{color:var(--signal); font-weight:600;}
.no{color:var(--no); font-weight:600;}
.sub{color:var(--slate); font-size:12.5px; line-height:1.55;}

/* callouts */
.callout{background:#F1F5FA; border-left:3px solid var(--signal); padding:14px 18px; margin:18px 0; font-size:14.5px; color:var(--ink-soft);}
.callout b{color:var(--ink);}
.statement{border:1px solid var(--line); border-left:3px solid var(--brass); background:var(--paper); padding:16px 20px; margin:20px 0; font-family:var(--serif); font-size:17px; line-height:1.4; color:var(--ink);}
.note{background:#FBF7EE; border-left:3px solid var(--brass); padding:12px 16px; font-size:12.5px; color:var(--slate); margin:18px 0; line-height:1.55;}

/* FAQ */
.faq{border-top:1px solid var(--line); padding:26px 0 8px;}
.faq .q{display:flex; gap:16px; align-items:baseline; margin-bottom:8px;}
.faq .qnum{font-family:var(--mono); font-size:13px; color:var(--brass); flex:0 0 auto; letter-spacing:1px;}
.faq .qtext{font-family:var(--serif); font-size:21px; color:var(--ink); line-height:1.25;}

/* pillars */
.pillar-head{margin:34px 0 6px;}
.pillar-head .pnum{font-family:var(--mono); color:var(--brass); font-size:12px; letter-spacing:2px;}
.pillar-head .ptitle{font-family:var(--serif); color:var(--ink); font-size:23px; line-height:1.2; margin-top:3px;}
.pillar-head .pdesc{font-size:14px; color:var(--slate); margin-top:6px; max-width:640px;}

/* footer */
.footer{background:var(--ink); padding:30px 40px; text-align:center; margin-top:12px;}
.footer .brand{font-family:var(--mono); font-size:12px; letter-spacing:2px; color:#9FB0C2; margin:0 0 10px;}
.footer .small{font-size:11.5px; line-height:1.6; color:#7C8A9A; margin:0 0 10px;}
.footer a{color:#B7C4D2; text-decoration:underline;}

/* a11y + motion */
a:focus-visible,.btn:focus-visible,.hub-card:focus-visible{outline:2px solid var(--signal); outline-offset:3px;}
@media (prefers-reduced-motion:reduce){*{transition:none !important;}}

/* mobile */
@media (max-width:600px){
  .inner{padding-left:20px; padding-right:20px;}
  .metric{flex:1 1 100%;}
  .faq .qtext{font-size:19px;}
  a.hub-card{padding:20px 46px 20px 20px;}
  .study{padding:22px 20px;}
}

/* jump nav (Advanced Testing sections) */
.jumpnav{ text-align:center; font-family:var(--mono); font-size:12px; letter-spacing:1px; text-transform:uppercase; margin:4px 0 10px; }
.jumpnav a{ color:var(--signal); }
.jumpnav span{ color:var(--line); margin:0 6px; }

/* button group (study + outbound buttons) */
.btn-group{ display:flex; flex-wrap:wrap; gap:12px; justify-content:center; margin:18px 0; }

/* coming-soon resource cards (non-link variant) */
.hub-card.soon{ opacity:.72; }
.soon-tag{ display:inline-block; margin-top:10px; font-family:var(--mono); font-size:10px; letter-spacing:1px; text-transform:uppercase; color:var(--slate); border:1px solid var(--line); border-radius:3px; padding:3px 8px; }

/* ===== update: bold left-aligned return button ===== */
.topbar{ display:flex; align-items:center; gap:12px; flex-wrap:wrap; padding:clamp(16px,3vw,24px) clamp(22px,5vw,60px) 0; }
.btn-return{ display:inline-block; background:var(--signal); color:#fff; font-family:var(--sans); font-weight:600; font-size:14.5px; letter-spacing:.2px; padding:11px 22px; border-radius:5px; }
.btn-return:hover{ background:var(--signal-deep); color:#fff; }
.register-cta{ margin-left:auto; display:inline-block; background:#1a3a8a; color:#fff; font-family:var(--sans); font-weight:600; font-size:14.5px; letter-spacing:.2px; padding:11px 22px; border-radius:5px; white-space:nowrap; transition:background .18s ease; }
.register-cta:hover{ background:#16307a; color:#fff; }
@media (max-width:520px){ .register-cta{ font-size:13px; padding:9px 16px; } }

/* ===== update: equal-width grouped buttons ===== */
.btn-group .btn{ flex:1 1 180px; max-width:300px; text-align:center; }

/* FAQ Q&A items */
.qa{ border-top:1px solid var(--line-soft); padding:18px 0 2px; }
.qa:first-of-type{ border-top:none; }
.qa-q{ font-family:var(--serif); font-size:18px; color:var(--ink); margin:0 0 6px; line-height:1.3; }
.faq-cat{ margin-top:34px; }

/* legal document */
.legal-toc{ background:var(--paper); border:1px solid var(--line); border-radius:5px; padding:16px 20px; margin:18px 0 8px; }
.legal-toc-title{ font-family:var(--mono); font-size:11px; letter-spacing:1.5px; text-transform:uppercase; color:var(--slate); margin:0 0 8px; }
.legal-toc a{ display:inline-block; margin:3px 14px 3px 0; font-size:13.5px; }
.legal-sec{ border-top:1px solid var(--line); padding:28px 0 2px; }
.legal-eff{ font-family:var(--mono); font-size:11px; letter-spacing:.5px; text-transform:uppercase; color:var(--slate); margin:2px 0 12px; }
.legal-sec h3{ font-size:15px; margin:18px 0 4px; }
.backtop{ display:inline-block; margin:6px 0 2px; font-family:var(--mono); font-size:11px; letter-spacing:1px; text-transform:uppercase; color:var(--slate); }

/* news article */
.article-meta{ font-family:var(--mono); font-size:11px; letter-spacing:1.5px; text-transform:uppercase; color:var(--signal); text-align:center; margin:0 0 6px; }
