/* Minimal qbiql connect hub */
:root{
  --bg:#0E0E0E;
  --text:#FFFFFF;
  --muted:#B5B5B5;
  --line:#5A5A5A;
}

*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  background:var(--bg);
  color:var(--text);
  font-family: "Circular Std", "CircularStd", "Avenir Next", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, "Apple Color Emoji","Segoe UI Emoji";
  display:flex;
  align-items:center;
  justify-content:center;
}

@font-face {
  font-family: "Circular Std";
  src: url("/fonts/CircularStd-Book.woff2") format("woff2"),
       url("/fonts/CircularStd-Book.woff") format("woff");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

.wrap{
  width:min(560px, 92vw);
  padding: 32px 16px 28px;
}

.hero{
  text-align:left;
  margin-bottom: 24px;
}

h1{
  margin:0 0 6px;
  text-transform: lowercase;
  font-weight: 700;
  letter-spacing: 0.2px;
  font-size: 40px;
}

.tagline{
  margin:0;
  color: var(--muted);
  text-transform: lowercase;
  letter-spacing: 0.3px;
}

.links{
  display:grid;
  gap: 12px;
  margin: 26px 0 12px;
}

.btn{
  display:block;
  text-decoration:none;
  text-align:center;
  padding: 14px 18px;
  border-radius: 14px;
  color: var(--text);
  background: transparent;
  border: 1px solid var(--line);
  text-transform: lowercase;
  letter-spacing: 0.2px;
  transition: transform .12s ease, border-color .12s ease, background .12s ease;
}

.btn:hover{
  transform: translateY(-1px);
  border-color: #8A8A8A;
  background: rgba(255,255,255,0.02);
}

.btn[aria-disabled="true"]{
  cursor: not-allowed;
  opacity: 0.7;
}

.footer{
  margin-top: 18px;
  color: var(--muted);
  text-align:left;
  font-size: 12px;
  text-transform: lowercase;
}