/* Products & links hub (products.html). */
.hub-page{--hub-green:#4ade80;background:#000}
.hub{max-width:1080px;margin:0 auto;padding:150px 40px 40px}
.hub-intro{max-width:760px;margin-bottom:64px}
.hub-intro .contact-back{margin-bottom:40px}
.hub-intro h1{margin:0 0 20px;font-size:clamp(44px,5.6vw,72px);line-height:1.04;letter-spacing:-.05em;font-weight:500}
.hub-intro h1>span{color:#8f93a6}
.hub-lead{margin:0;font-size:15px;line-height:1.8;color:#959cab;white-space:nowrap}

.hub-group{margin-bottom:56px}
.hub-group-head{display:flex;align-items:baseline;gap:16px;padding-bottom:18px;margin-bottom:22px;border-bottom:1px solid #ffffff12}
.hub-step{font-size:11px;letter-spacing:.08em;color:var(--hub-green);font-variant-numeric:tabular-nums}
.hub-group-head h2{margin:0;font-size:20px;font-weight:600;letter-spacing:-.02em}
.hub-group-head p{margin:0 0 0 auto;font-size:12px;color:#7e8596}

.hub-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.hub-card{position:relative;display:flex;flex-direction:column;padding:28px;border-radius:22px;background:linear-gradient(145deg,#161a2390,#0a0d1385);border:0;box-shadow:inset 0 1px 0 #ffffff0d;transition:border-color .25s ease,transform .3s cubic-bezier(.22,.8,.25,1)}
.hub-card>.dash-ring{--ring-r:22px}
.hub-card>.dash-ring rect{stroke:#ffffffa6}
.hub-card:hover>.dash-ring rect{stroke:#fff}
.hub-card:hover{transform:translateY(-2px)}
.hub-card-top{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:22px}
.hub-icon{display:block;width:56px;height:56px;border-radius:15px;object-fit:cover;box-shadow:0 10px 24px -12px #000}
/* Crops the wordmark to its "IQ" letters (x 1280-1625, y 325-610 of 1699x926), centred in the tile. */
.hub-icon--proteus{position:relative;overflow:hidden;background:#0b0e16;border:1px solid #ffffff14}
.hub-icon--proteus img{position:absolute;max-width:none;width:187px;height:auto;left:-132px;top:-24px;clip-path:inset(0 0 0 140px)}
.hub-icon--glyph{display:flex;align-items:center;justify-content:center;color:#cfd6ff;background:linear-gradient(145deg,#3b82f62e,#9d6bff26);border:1px solid #9fb4ff2b}
.hub-icon--glyph svg{width:26px;height:26px}
.hub-tag{font-size:10px;font-weight:600;letter-spacing:.04em;padding:6px 10px;border-radius:999px;color:#c9cfe0;background:#ffffff0d;border:1px solid #ffffff17}
.hub-tag--green{color:#86efac;background:#22c55e17;border-color:#4ade8040}
.hub-card h3{margin:0;font-size:24px;font-weight:600;letter-spacing:-.03em}
.hub-meta{margin:4px 0 0;font-size:12px;color:#7f8798}
.hub-text{margin:14px 0 26px;font-size:14px;line-height:1.7;color:#a3aab8}
.hub-action{margin-top:auto;display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:50px;padding:0 20px;border-radius:14px;font:600 14px var(--font-head);text-decoration:none;transition:filter .2s ease,transform .2s cubic-bezier(.34,1.56,.64,1),background .2s ease,border-color .2s ease}
.hub-action svg{width:18px;height:18px;flex-shrink:0}
.hub-action:active{transform:translateY(1px) scale(.99)}
.hub-action:focus-visible{outline:2px solid #c8d2ff;outline-offset:3px}
.hub-action--green{color:#04210f;background:linear-gradient(to bottom,#ffffff38,#fff0 55%),linear-gradient(to right,#6ee79a,#22c55e);box-shadow:0 14px 30px -14px #22c55ee6,inset 0 1px 2px #ffffff80}
.hub-action--green:focus-visible{outline-color:#86efac}
.hub-action--brand{color:#fff;background:linear-gradient(to bottom,#ffffff38,#fff0 55%),linear-gradient(to right,#29b6f6,#6a5fff,#ba4aff);box-shadow:0 14px 30px -14px #6a5fffe6,inset 0 1px 2px #ffffff70}
.hub-action--green:hover,.hub-action--brand:hover{filter:brightness(1.08)}
.hub-action--ghost{color:#e3e6f0;background:#8cafff0f;border:1px solid #8cb4ff29}
.hub-action--ghost:hover{background:#8cafff1c;border-color:#a0c3ff57}
.hub-fine{margin:10px 0 0;font-size:11px;color:#727a8b}
.hub-notice{margin:16px 0 0;padding:12px 14px;border-radius:12px;font-size:12px;line-height:1.6;color:#b9e8c8;background:#22c55e0f;border:1px solid #4ade802b}
.hub-footer{margin-top:40px}

@media(max-width:760px){
 .hub{padding:120px 16px 20px}
 .hub-intro{margin-bottom:44px}
 .hub-intro .contact-back{margin-bottom:28px}
 .hub-intro h1{font-size:44px}
 .hub-lead{font-size:14px;white-space:normal;text-wrap:balance}
 .hub-group{margin-bottom:40px}
 .hub-group-head{flex-wrap:wrap;gap:6px 12px}
 .hub-group-head p{margin:0;width:100%}
 .hub-grid{grid-template-columns:1fr;gap:14px}
 .hub-card{padding:22px}
 .hub-card h3{font-size:22px}
}
@media(prefers-reduced-motion:reduce){.hub-card,.hub-action{transition:none}.hub-card:hover{transform:none}}