.nexa-page { background: #f5f8fc; }
.nexa-hero { position: relative; min-height: 780px; display: flex; align-items: center; overflow: hidden; padding: 10rem 0 7rem; color: var(--white); background: radial-gradient(circle at 75% 25%, rgba(22,198,212,.18), transparent 27%), radial-gradient(circle at 15% 90%, rgba(139,79,232,.2), transparent 30%), linear-gradient(135deg, var(--navy-950), #082852 62%, #071d3c); }
.nexa-hero::before { content: ""; position: absolute; inset: 0; opacity: .15; background-image: linear-gradient(rgba(255,255,255,.08) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.08) 1px, transparent 1px); background-size: 52px 52px; mask-image: linear-gradient(to bottom, black, transparent 90%); }
.nexa-orb { position: absolute; border: 1px solid rgba(142,243,248,.28); border-radius: 50%; box-shadow: 0 0 80px rgba(22,198,212,.12); }.nexa-orb-one { width: 560px; height: 560px; right: -220px; top: 8%; }.nexa-orb-two { width: 330px; height: 330px; right: -105px; top: 22%; border-color: rgba(255,107,36,.3); }
.nexa-brand-mark { display: grid; width: 68px; height: 68px; margin-bottom: 1rem; place-items: center; border-radius: 20px; color: white; background: linear-gradient(135deg, var(--cyan), var(--purple) 52%, var(--orange)); box-shadow: 0 15px 35px rgba(22,198,212,.2); transform: rotate(-8deg); }.nexa-brand-mark span { font-size: 2.3rem; font-weight: 800; transform: rotate(8deg); }.nexa-version { margin: 0 0 1rem; color: #92eaf0; font-size: .73rem; font-weight: 800; letter-spacing: .14em; }.nexa-hero h1 { margin: 0; font-size: clamp(3rem, 6vw, 5.9rem); line-height: 1.03; font-weight: 800; letter-spacing: -.055em; }.nexa-hero h1 em { color: transparent; font-style: normal; background: linear-gradient(90deg, var(--cyan), #d2c1ff); background-clip: text; -webkit-background-clip: text; }.nexa-lead { max-width: 660px; margin: 1.7rem 0 2rem; color: #c6d4e8; font-size: 1.07rem; line-height: 1.85; }.nexa-actions { display: flex; flex-wrap: wrap; gap: .8rem; }.nexa-meta { display: flex; flex-wrap: wrap; align-items: center; gap: .55rem; margin-top: 1.7rem; color: #a6b8cf; font-size: .78rem; }.nexa-meta span { width: 4px; height: 4px; border-radius: 50%; background: var(--orange); }
.nexa-console { position: relative; z-index: 1; max-width: 430px; margin: auto; padding: 1rem; border: 1px solid rgba(255,255,255,.18); border-radius: 2rem; background: rgba(3,15,35,.72); box-shadow: 0 28px 80px rgba(0,0,0,.34); backdrop-filter: blur(18px); transform: rotate(2deg); }.console-top { display: flex; align-items: center; justify-content: space-between; padding: .4rem .5rem 1rem; color: #8ea4c1; font-size: .7rem; letter-spacing: .12em; }.console-top span { display: flex; gap: .35rem; }.console-top i { width: 8px; height: 8px; border-radius: 50%; background: var(--orange); }.console-top i:nth-child(2) { background: #f6c452; }.console-top i:nth-child(3) { background: var(--cyan); }.console-orb { display: grid; aspect-ratio: 1; place-items: center; border-radius: 1.35rem; background: radial-gradient(circle, rgba(22,198,212,.25), transparent 45%), repeating-radial-gradient(circle, transparent 0 46px, rgba(142,243,248,.1) 47px 48px), linear-gradient(145deg, #0b2f5b, #061429); }.console-core { display: grid; width: 130px; height: 130px; place-items: center; border: 1px solid rgba(142,243,248,.6); border-radius: 50%; color: white; background: radial-gradient(circle at 35% 25%, #8ef3f8, #177caa 33%, #32216a 70%); box-shadow: 0 0 50px rgba(22,198,212,.48), inset 0 0 30px rgba(255,255,255,.28); }.console-core i { font-size: 2.5rem; }.console-status, .console-command { display: flex; align-items: center; gap: .65rem; margin-top: .8rem; padding: .85rem 1rem; border-radius: .85rem; color: #b9c9df; background: rgba(255,255,255,.06); font-size: .8rem; }.console-status strong { margin-left: auto; color: var(--cyan); font-size: .68rem; }.pulse { width: 8px; height: 8px; border-radius: 50%; background: #60e6c1; box-shadow: 0 0 0 5px rgba(96,230,193,.12); }.console-command { color: white; }.console-command i:first-child { color: var(--orange); }
.nexa-intro { background: white; }.nexa-feature { position: relative; height: 100%; padding: 2rem; border: 1px solid #dce6f2; border-radius: 1.35rem; background: #fff; box-shadow: 0 14px 34px rgba(6,27,58,.05); transition: transform .25s ease, border-color .25s ease; }.nexa-feature:hover { transform: translateY(-5px); border-color: rgba(22,198,212,.65); }.nexa-feature > span { position: absolute; top: 1.35rem; right: 1.45rem; color: #a8b6c7; font-size: .72rem; font-weight: 800; }.nexa-feature i { display: grid; width: 50px; height: 50px; margin-bottom: 1.5rem; place-items: center; border-radius: 1rem; color: white; background: linear-gradient(135deg, var(--cyan), #087f8b); font-size: 1.25rem; }.nexa-feature:nth-child(2) i, .nexa-feature:nth-child(5) i { background: linear-gradient(135deg, var(--purple), #6230b8); }.nexa-feature:nth-child(3) i, .nexa-feature:nth-child(6) i { background: linear-gradient(135deg, var(--orange), #e95616); }.nexa-feature h3 { margin: 0 0 .65rem; font-size: 1.12rem; font-weight: 800; }.nexa-feature p { margin: 0; color: var(--muted); line-height: 1.75; font-size: .9rem; }
.nexa-highlight { padding: 7rem 0; color: white; background: var(--navy-900); }.nexa-highlight .section-kicker { color: #8ee8ef; }.nexa-highlight h2, .nexa-notes h2 { margin: 0; font-size: clamp(2.3rem, 4vw, 3.6rem); line-height: 1.1; letter-spacing: -.045em; }.nexa-steps { display: grid; gap: 1.35rem; margin: 2.5rem 0 0; padding: 0; list-style: none; }.nexa-steps li { display: flex; gap: 1rem; align-items: flex-start; }.nexa-steps b { display: grid; width: 44px; height: 44px; flex: 0 0 auto; place-items: center; border: 1px solid rgba(142,243,248,.35); border-radius: 50%; color: var(--cyan); font-size: .78rem; }.nexa-steps h3 { margin: .1rem 0 .3rem; font-size: 1rem; }.nexa-steps p { margin: 0; color: #adbed3; font-size: .88rem; line-height: 1.6; }.nexa-download-card { padding: 2rem; border-radius: 1.5rem; color: var(--ink); background: white; box-shadow: 0 25px 60px rgba(0,0,0,.2); }.download-icon { display: grid; width: 56px; height: 56px; margin-bottom: 1.5rem; place-items: center; border-radius: 1rem; color: white; background: linear-gradient(135deg, var(--cyan), #087f8b); font-size: 1.5rem; }.nexa-download-card h3 { margin: 0 0 .35rem; font-size: 1.5rem; }.nexa-download-card > p:not(.nexa-version) { margin-bottom: 1.5rem; color: var(--muted); }.nexa-download-card small { display: block; margin-top: 1rem; color: var(--muted); font-size: .73rem; text-align: center; }
.nexa-notes { background: var(--surface); }.nexa-note-grid { display: grid; grid-template-columns: 1.25fr 1fr 1fr 1fr; gap: 1rem; align-items: stretch; }.nexa-note { display: flex; gap: .8rem; padding: 1.25rem; border: 1px solid #dce6f2; border-radius: 1rem; background: white; }.nexa-note > i { color: var(--cyan); font-size: 1.2rem; }.nexa-note h3 { margin: 0 0 .5rem; font-size: .95rem; }.nexa-note p { margin: 0; color: var(--muted); font-size: .78rem; line-height: 1.65; }
@media (max-width: 991.98px) { .nexa-hero { padding-top: 8rem; }.nexa-console { max-width: 480px; transform: none; }.nexa-note-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 575.98px) { .nexa-hero { min-height: auto; padding: 7.5rem 0 4.5rem; }.nexa-actions .btn { width: 100%; }.nexa-meta { line-height: 1.7; }.nexa-meta span { display: none; }.nexa-highlight { padding: 4.5rem 0; }.nexa-note-grid { grid-template-columns: 1fr; }.nexa-download-card { padding: 1.5rem; } }
