/* =====================================================================
   Sentinel Systems — homepage premium layer (v40)
   Loaded after home.css on the homepage only. Everything here is scoped to
   homepage components, so no other page is touched.
   ===================================================================== */

.home-pro {
  --hp-edge: rgba(148, 178, 226, 0.16);
  --hp-edge-hot: rgba(96, 165, 250, 0.45);
  --hp-glass: linear-gradient(180deg, rgba(21, 33, 56, 0.86), rgba(12, 19, 34, 0.92));
  --hp-sheen: linear-gradient(180deg, rgba(255, 255, 255, 0.09), rgba(255, 255, 255, 0) 42%);
  --hp-ring: 0 0 0 1px var(--hp-edge);
  --hp-lift: 0 32px 70px -38px rgba(0, 0, 0, 0.95);
}

/* ---------------------------------------------------------------- hero */

.home-pro .hx {
  padding: clamp(4rem, 9vw, 8rem) 0 clamp(3.5rem, 7vw, 6rem);
  border-bottom: 1px solid var(--hp-edge);
}

/* soft aurora field behind the hero */
.home-pro .hx::before,
.home-pro .hx::after {
  content: "";
  position: absolute;
  pointer-events: none;
  border-radius: 50%;
  filter: blur(90px);
  z-index: 0;
}
.home-pro .hx::before {
  width: 46vw; height: 46vw; left: -12vw; top: -14vw;
  background: radial-gradient(circle, rgba(59, 130, 246, 0.30), transparent 68%);
  animation: hp-drift 26s var(--ease) infinite alternate;
}
.home-pro .hx::after {
  width: 34vw; height: 34vw; right: -8vw; bottom: -18vw;
  background: radial-gradient(circle, rgba(52, 211, 153, 0.16), transparent 70%);
  animation: hp-drift 34s var(--ease) infinite alternate-reverse;
}
@keyframes hp-drift {
  from { transform: translate3d(0, 0, 0) scale(1); }
  to   { transform: translate3d(5%, 7%, 0) scale(1.14); }
}
.home-pro .hx-inner { z-index: 1; }

.home-pro .hx-grid { background-size: 78px 78px; opacity: .75; }

.home-pro .hx .eyebrow {
  display: inline-flex; align-items: center; gap: .55rem;
  padding: .4rem .85rem .4rem .65rem;
  border: 1px solid var(--hp-edge);
  border-radius: 999px;
  background: rgba(59, 130, 246, 0.10);
  backdrop-filter: blur(10px);
  color: #cddcf6;
  font-size: .72rem; font-weight: 650;
  letter-spacing: .16em; text-transform: uppercase;
}

.home-pro .hx-copy h1 {
  font-size: clamp(2.5rem, 5.6vw, 4.15rem);
  letter-spacing: -.042em;
  font-weight: 700;
  background: linear-gradient(168deg, #ffffff 18%, #cbdcfa 58%, #8fb3ea);
  -webkit-background-clip: text; background-clip: text; color: transparent;
  text-wrap: balance;
}
.home-pro .hx-copy .lead {
  font-size: clamp(1.02rem, 1.5vw, 1.18rem);
  color: #a9bcda;
  max-width: 48ch;
  text-wrap: pretty;
}

/* CTAs */
.home-pro .hx-cta .btn {
  border-radius: 12px;
  font-weight: 620;
  letter-spacing: -.01em;
  transition: transform .28s var(--ease), box-shadow .28s var(--ease), background .28s var(--ease);
}
.home-pro .hx-cta .btn-primary {
  position: relative;
  background: linear-gradient(180deg, #4f90ff, var(--brand-strong));
  box-shadow: 0 14px 34px -16px rgba(59, 130, 246, .95), inset 0 1px 0 rgba(255, 255, 255, .22);
  border: 1px solid rgba(147, 189, 255, .5);
}
.home-pro .hx-cta .btn-primary:hover { transform: translateY(-2px); box-shadow: 0 20px 42px -16px rgba(59, 130, 246, 1); }
.home-pro .hx-cta .btn-ghost:hover,
.home-pro .hx-cta .btn-discord:hover { transform: translateY(-2px); }

/* proof numbers */
.home-pro .hx-proof {
  border-top: 1px solid var(--hp-edge);
  gap: .75rem;
}
.home-pro .hx-proof li {
  position: relative;
  padding: .9rem 1rem;
  border: 1px solid transparent;
  border-radius: 14px;
  transition: background .3s var(--ease), border-color .3s var(--ease);
}
.home-pro .hx-proof li:hover {
  background: rgba(23, 36, 61, .55);
  border-color: var(--hp-edge);
}
.home-pro .hx-proof strong {
  font-variant-numeric: tabular-nums;
  font-size: clamp(1.45rem, 2.6vw, 2rem);
}
.home-pro .hx-proof span { letter-spacing: .06em; text-transform: uppercase; font-size: .68rem; }

/* ------------------------------------------------------ hero console */

.home-pro .hx-console {
  position: relative;
  border-radius: 22px;
  border: 1px solid var(--hp-edge);
  background: var(--hp-glass);
  box-shadow: var(--hp-lift);
  overflow: hidden;
  backdrop-filter: blur(16px);
}
.home-pro .hx-console::before {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background: var(--hp-sheen);
}
.home-pro .hx-console::after {
  content: ""; position: absolute; inset: -1px; border-radius: inherit; pointer-events: none;
  padding: 1px;
  background: linear-gradient(150deg, rgba(129, 178, 255, .55), rgba(129, 178, 255, 0) 38%, rgba(52, 211, 153, .28));
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor; mask-composite: exclude;
}
.home-pro .hx-console-bar {
  border-bottom: 1px solid var(--hp-edge);
  background: rgba(9, 15, 28, .55);
}
.home-pro .hx-search input {
  border-radius: 11px;
}
.home-pro .hx-search input:focus {
  outline: none;
  border-color: var(--hp-edge-hot);
  box-shadow: 0 0 0 4px rgba(59, 130, 246, .16);
}
.home-pro .hx-meta li {
  border-radius: 12px;
  background: rgba(12, 20, 36, .6);
  border: 1px solid var(--hp-edge);
}

/* --------------------------------------------------------- trust strip */

.home-pro .hp-trust {
  border-bottom: 1px solid var(--hp-edge);
  background: linear-gradient(180deg, rgba(12, 19, 34, .7), transparent);
}
.home-pro .hp-trust-inner {
  display: flex; flex-wrap: wrap; align-items: center; gap: 1rem 2.4rem;
  padding: 1.1rem 0;
  justify-content: space-between;
}
.home-pro .hp-trust-item {
  display: inline-flex; align-items: center; gap: .6rem;
  color: #9db0cf; font-size: .84rem; font-weight: 550;
}
.home-pro .hp-trust-item svg { width: 17px; height: 17px; color: var(--info); flex: none; }
.home-pro .hp-trust-item strong { color: #dfe8fb; font-weight: 620; }

/* --------------------------------------------------------------- bento */

.home-pro .hx-cell {
  position: relative;
  border-radius: 20px;
  border: 1px solid var(--hp-edge);
  background: var(--hp-glass);
  overflow: hidden;
  transition: transform .35s var(--ease), border-color .35s var(--ease), box-shadow .35s var(--ease);
}
.home-pro .hx-cell::before {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background: radial-gradient(420px 220px at var(--mx, 50%) var(--my, 0%), rgba(96, 165, 250, .16), transparent 70%);
  opacity: 0; transition: opacity .35s var(--ease);
}
.home-pro .hx-cell:hover {
  transform: translateY(-4px);
  border-color: var(--hp-edge-hot);
  box-shadow: var(--hp-lift);
}
.home-pro .hx-cell:hover::before { opacity: 1; }
.home-pro .hx-cell h3 { letter-spacing: -.02em; font-size: 1.14rem; }
.home-pro .hx-cell p { color: #a3b5d3; }
.home-pro .card-icon {
  display: grid; place-items: center;
  width: 44px; height: 44px; border-radius: 13px;
  border: 1px solid rgba(129, 178, 255, .34);
  background: linear-gradient(180deg, rgba(59, 130, 246, .26), rgba(59, 130, 246, .08));
  color: #bcd6ff;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .16);
}
.home-pro .card-icon svg { width: 22px; height: 22px; }
.home-pro .tick-list li { color: #b5c6e2; }
.home-pro .hx-code {
  border-radius: 14px;
  border: 1px solid var(--hp-edge);
  background: rgba(7, 12, 23, .82);
}

/* --------------------------------------------------------------- steps */

.home-pro .section-head h2 {
  font-size: clamp(1.7rem, 3.4vw, 2.5rem);
  letter-spacing: -.032em;
  background: linear-gradient(170deg, #ffffff, #b6cbee);
  -webkit-background-clip: text; background-clip: text; color: transparent;
  text-wrap: balance;
}
.home-pro .section-head .eyebrow {
  color: #7fa8e8; letter-spacing: .18em; text-transform: uppercase; font-size: .72rem; font-weight: 650;
}

.home-pro .hx-step {
  position: relative;
  border-radius: 18px;
  border: 1px solid var(--hp-edge);
  background: linear-gradient(180deg, rgba(20, 31, 52, .72), rgba(11, 18, 32, .82));
  transition: transform .3s var(--ease), border-color .3s var(--ease);
}
.home-pro .hx-step:hover { transform: translateY(-3px); border-color: var(--hp-edge-hot); }
.home-pro .hx-step-n {
  font-family: 'Sora', sans-serif;
  background: linear-gradient(180deg, #7fb0ff, rgba(127, 176, 255, .25));
  -webkit-background-clip: text; background-clip: text; color: transparent;
  font-size: 1.5rem; font-weight: 700; letter-spacing: -.02em;
}

/* ---------------------------------------------------------- news cards */

.home-pro .hx-news-card {
  border-radius: 18px;
  border: 1px solid var(--hp-edge);
  background: var(--hp-glass);
  overflow: hidden;
  transition: transform .3s var(--ease), border-color .3s var(--ease), box-shadow .3s var(--ease);
}
.home-pro .hx-news-card:hover {
  transform: translateY(-4px);
  border-color: var(--hp-edge-hot);
  box-shadow: var(--hp-lift);
}
.home-pro .hx-news-thumb img { transition: transform .5s var(--ease); }
.home-pro .hx-news-card:hover .hx-news-thumb img { transform: scale(1.05); }
.home-pro .hx-news-card h3 { letter-spacing: -.02em; }

/* ------------------------------------------------------------ partners */

.home-pro .hx-partner {
  border-radius: 14px;
  border: 1px solid var(--hp-edge);
  background: rgba(16, 25, 43, .6);
  transition: border-color .3s var(--ease), transform .3s var(--ease), filter .3s var(--ease);
  filter: saturate(.75);
}
.home-pro .hx-partner:hover { border-color: var(--hp-edge-hot); transform: translateY(-2px); filter: none; }

/* ----------------------------------------------------------------- FAQ */

.home-pro .faq-item {
  border-radius: 14px;
  border: 1px solid var(--hp-edge);
  background: rgba(15, 24, 42, .58);
  overflow: hidden;
  transition: border-color .3s var(--ease);
}
.home-pro .faq-item:hover { border-color: var(--hp-edge-hot); }
.home-pro .faq-q { font-weight: 600; letter-spacing: -.01em; }

/* ----------------------------------------------------------- final CTA */

.home-pro .hx-final {
  position: relative;
  overflow: hidden;
  border-radius: 24px;
  border: 1px solid var(--hp-edge);
  background:
    radial-gradient(720px 320px at 12% -30%, rgba(59, 130, 246, .30), transparent 65%),
    linear-gradient(180deg, rgba(20, 32, 55, .92), rgba(10, 17, 32, .96));
  box-shadow: var(--hp-lift);
  padding: clamp(1.8rem, 4vw, 3rem);
}
.home-pro .hx-final::after {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background-image:
    linear-gradient(rgba(148, 178, 226, .05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(148, 178, 226, .05) 1px, transparent 1px);
  background-size: 54px 54px;
  mask-image: radial-gradient(80% 100% at 100% 0%, #000, transparent 75%);
  -webkit-mask-image: radial-gradient(80% 100% at 100% 0%, #000, transparent 75%);
}
.home-pro .hx-final h2 { letter-spacing: -.03em; }

/* --------------------------------------------------------- reveal-in */

.home-pro .reveal { will-change: transform, opacity; }

@media (max-width: 860px) {
  .home-pro .hp-trust-inner { gap: .75rem 1.4rem; }
}
@media (prefers-reduced-motion: reduce) {
  .home-pro .hx::before,
  .home-pro .hx::after { animation: none; }
  .home-pro .hx-cell:hover,
  .home-pro .hx-step:hover,
  .home-pro .hx-news-card:hover,
  .home-pro .hx-cta .btn:hover { transform: none; }
}