/* ===========================================================================
   Hub pages — Downloads and Support. Same visual language as the Arvia page:
   mono eyebrows, Outfit headings and copy, panel cards, full-bleed bands
   separated by hairlines.
   =========================================================================== */

.hub-hero, .hub-band { padding:0; }
.hub-hero { padding:72px 0 64px;
  background:
    radial-gradient(55% 90% at 0% 0%, rgba(246,182,24,.08), transparent 60%),
    radial-gradient(50% 80% at 100% 100%, rgba(34,199,184,.06), transparent 60%),
    var(--bg); }
.hub-band { border-top:1px solid var(--line-soft); padding:72px 0; }

.hub-crumb { font-size:11px; letter-spacing:.2em; text-transform:uppercase; color:var(--ink-dim);
  margin-bottom:22px; }
.hub-crumb a { color:var(--amber); }

.hub-hero h1, .hub-band h2 { font-family:var(--brand-sans); color:var(--ink); }
.hub-hero h1 { font-size:clamp(44px,5.5vw,72px); font-weight:300; letter-spacing:-.045em; line-height:1; }
.hub-band h2 { font-size:clamp(26px,3vw,34px); font-weight:500; letter-spacing:-.025em;
  line-height:1.15; margin-bottom:28px; max-width:24ch; }
.hub-lede { font-family:var(--brand-sans); color:var(--ink-mid); font-size:17px; line-height:1.65;
  max-width:52ch; margin-top:20px; }

.hub-eyebrow { font-family:var(--mono); font-size:10.5px; font-weight:500; letter-spacing:.24em;
  text-transform:uppercase; margin-bottom:18px; }
.hub-amber { color:var(--amber); }
.hub-teal { color:var(--teal); }

.hub-btn-primary, .hub-btn-ghost { border-radius:999px; font-size:12.5px; padding:12px 20px; white-space:nowrap; }
.hub-btn-primary { background:var(--amber); color:#151004; }
.hub-btn-primary:hover { background:#ffc744; transform:translateY(-1px); }
.hub-btn-ghost { background:transparent; color:var(--amber); border-color:var(--amber); }
.hub-btn-ghost:hover { background:rgba(246,182,24,.1); color:#ffc744; border-color:#ffc744; }

/* ---------- available apps ---------- */
.hub-available { display:grid; gap:16px; }
.hub-app { display:grid; grid-template-columns:96px 1fr; gap:28px; align-items:center;
  background:var(--panel); border:1px solid var(--line); border-radius:16px; padding:28px; }
.hub-app-icon img { display:block; width:96px; height:96px; }
.hub-app h2 { margin-bottom:6px; font-size:24px; }
.hub-app p { font-family:var(--brand-sans); color:var(--ink-mid); font-size:15px; line-height:1.6; max-width:60ch; }
.hub-app .hub-meta { font-family:var(--mono); font-size:11px; letter-spacing:.08em; color:var(--ink-dim);
  margin-top:10px; }
.hub-actions { display:flex; flex-wrap:wrap; gap:12px; margin-top:20px; }

/* ---------- trial ---------- */
.hub-steps { list-style:none; display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
.hub-steps li { background:var(--panel); border:1px solid var(--line); border-radius:14px; padding:22px 22px 24px; }
.hub-num { display:block; font-family:var(--mono); font-size:11px; color:var(--ink-mid); margin-bottom:12px; }
.hub-steps b, .hub-faq dt { display:block; font-family:var(--brand-sans); font-weight:500; font-size:16px;
  color:var(--ink); margin-bottom:6px; }
.hub-steps p, .hub-faq dd { font-family:var(--brand-sans); color:var(--ink-mid); font-size:14.5px; line-height:1.6; }
.hub-faq { display:grid; grid-template-columns:1fr 1fr; gap:24px 48px; margin-top:40px; }

/* ---------- in development ---------- */
.hub-upcoming { list-style:none; display:grid; grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); gap:16px; }
.hub-card { display:flex; flex-direction:column; height:100%; background:var(--panel);
  border:1px solid var(--line); border-radius:14px; padding:22px; color:inherit;
  transition:border-color .15s ease, transform .15s ease; }
.hub-card-plain { opacity:.85; }
a.hub-card:hover { text-decoration:none; border-color:var(--ink-dim); transform:translateY(-2px); }
.hub-card img, .hub-icon-blank { width:56px; height:56px; margin-bottom:18px; }
.hub-icon-blank { display:flex; align-items:center; justify-content:center; border-radius:14px;
  background:linear-gradient(145deg,#2a2a30 0%,#101013 78%); border:1px solid #333339; opacity:.6; }
.hub-icon-blank svg { width:34px; height:34px; }
.hub-card b { font-family:var(--brand-sans); font-weight:500; font-size:18px; color:var(--ink); }
.hub-status { font-family:var(--mono); font-size:10px; letter-spacing:.18em; text-transform:uppercase;
  color:var(--amber); margin-top:6px; }
.hub-card p { font-family:var(--brand-sans); color:var(--ink-mid); font-size:14px; line-height:1.6;
  margin-top:12px; flex:1; }
.hub-more { font-family:var(--mono); font-size:12px; font-weight:700; color:var(--teal); margin-top:16px; }
@media (prefers-reduced-motion:reduce) { a.hub-card:hover { transform:none; } }

/* ---------- notify ---------- */
.hub-notify { text-align:center;
  background:
    radial-gradient(60% 90% at 0% 0%, rgba(246,182,24,.07), transparent 60%),
    radial-gradient(60% 90% at 100% 100%, rgba(34,199,184,.07), transparent 60%),
    var(--bg); }
.hub-notify h2 { margin:0 auto; max-width:none; }
.hub-notify .hub-lede { margin:16px auto 0; }
.hub-signup { display:flex; justify-content:center; flex-wrap:wrap; gap:10px; margin-top:28px; }
.hub-signup input[type=email] { font-family:var(--mono); font-size:13px; color:var(--ink);
  background:var(--panel-2); border:1px solid var(--line); border-radius:999px;
  padding:12px 20px; width:280px; max-width:100%; outline:none; }
.hub-signup input[type=email]:focus { border-color:var(--amber-dim); }
.hub-signup .cf-turnstile { order:99; flex-basis:100%; display:flex; justify-content:center; }

@media (max-width:760px) {
  .hub-steps, .hub-faq { grid-template-columns:1fr; }
  .hub-app { grid-template-columns:1fr; gap:18px; }
  .hub-band { padding:56px 0; }
}
@media (max-width:560px) {
  .hub-signup input[type=email], .hub-signup .btn { width:100%; }
}

/* ---------- support: quick-answer links and the FAQ ---------- */
.hub-card p a { color:var(--amber); }
.hub-faq-list { border-top:1px solid var(--line); max-width:860px; }
.hub-faq-list details { border-bottom:1px solid var(--line); }
.hub-faq-list summary { list-style:none; cursor:pointer; display:flex; justify-content:space-between;
  gap:16px; padding:20px 0; font-family:var(--brand-sans); font-weight:500; font-size:17px; color:var(--ink); }
.hub-faq-list summary::-webkit-details-marker { display:none; }
.hub-faq-list summary::after { content:"+"; font-family:var(--mono); color:var(--amber); }
.hub-faq-list details[open] summary::after { content:"–"; }
.hub-faq-list details p { font-family:var(--brand-sans); color:var(--ink-mid); font-size:15px;
  line-height:1.7; max-width:68ch; padding:0 0 22px; }
.hub-hero .hub-lede a { color:var(--amber); }