:root{
    --bg:#02050b;
    --bg2:#07101a;
    --bg3:#0b1526;
    --text:#eef5ff;
    --muted:#91a4c6;
    --line:rgba(255,255,255,.08);
    --line-strong:rgba(255,255,255,.16);
    --blue:#63b3ff;
    --blue2:#8dd1ff;
    --violet:#8f71ff;
    --violet2:#c1abff;
    --green:#39e09d;
    --orange:#f2b24f;
    --glass:rgba(10,18,32,.68);
    --glass-strong:rgba(12,20,36,.84);
    --shadow:0 24px 70px rgba(0,0,0,.42);
    --radius-xl:30px;
    --radius-lg:22px;
    --radius-md:16px;
    --shell:min(1360px, calc(100% - 40px));
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}

.ac-page{
    position:relative;
    min-height:100vh;
    overflow:hidden;
    color:var(--text);
    background:
        radial-gradient(circle at 10% 10%, rgba(99,179,255,.12), transparent 24%),
        radial-gradient(circle at 90% 12%, rgba(143,113,255,.12), transparent 26%),
        radial-gradient(circle at 50% 100%, rgba(99,179,255,.06), transparent 22%),
        linear-gradient(180deg, #02050b 0%, #040913 30%, #07101a 65%, #03070d 100%);
}

.ac-shell{
    width:var(--shell);
    margin:0 auto;
    position:relative;
    z-index:2;
}

.ac-bg{
    position:absolute;
    inset:0;
    z-index:0;
    pointer-events:none;
}

.ac-grid{
    position:absolute;
    inset:0;
    background-image:
        linear-gradient(rgba(255,255,255,.03) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.03) 1px, transparent 1px);
    background-size:52px 52px;
    mask-image:linear-gradient(180deg, rgba(0,0,0,.6), transparent 88%);
    opacity:.18;
}

.ac-noise{
    position:absolute;
    inset:0;
    opacity:.05;
    background-image:
        radial-gradient(circle at 20% 20%, rgba(255,255,255,.7) .8px, transparent 1px),
        radial-gradient(circle at 70% 60%, rgba(255,255,255,.5) .8px, transparent 1px),
        radial-gradient(circle at 40% 80%, rgba(255,255,255,.45) .8px, transparent 1px);
    background-size:190px 190px;
}

.ac-vignette{
    position:absolute;
    inset:0;
    background:radial-gradient(circle, transparent 45%, rgba(0,0,0,.35) 100%);
}

.ac-mouse-glow{
    position:absolute;
    width:520px;
    height:520px;
    left:0;
    top:0;
    transform:translate(-50%, -50%);
    border-radius:999px;
    background:radial-gradient(circle, rgba(99,179,255,.16) 0%, rgba(143,113,255,.10) 35%, transparent 72%);
    filter:blur(28px);
    opacity:.9;
    transition:transform .08s linear;
}

.ac-top-beam{
    position:absolute;
    top:0;
    left:50%;
    transform:translateX(-50%);
    width:70%;
    height:1px;
    background:linear-gradient(90deg, transparent, rgba(255,255,255,.35), transparent);
    box-shadow:0 0 24px rgba(99,179,255,.35);
}

.ac-hero{
    padding:24px 0 56px;
}

.ac-topline{
    display:flex;
    align-items:center;
    gap:18px;
    justify-content:space-between;
    margin-bottom:34px;
}

.ac-brand{
    display:inline-flex;
    align-items:center;
    gap:10px;
    color:#dce9ff;
    font-size:.95rem;
    font-weight:700;
    letter-spacing:.08em;
    text-transform:uppercase;
}

.ac-dot{
    width:10px;
    height:10px;
    border-radius:999px;
    background:var(--green);
    box-shadow:0 0 18px var(--green);
}

.ac-ticker-wrap{
    position:relative;
    width:min(620px, 100%);
    overflow:hidden;
    border:1px solid var(--line);
    border-radius:999px;
    background:rgba(255,255,255,.03);
    mask-image:linear-gradient(90deg, transparent, black 8%, black 92%, transparent);
}

.ac-ticker{
    display:flex;
    gap:48px;
    padding:10px 18px;
    white-space:nowrap;
    min-width:max-content;
    color:#d9e6ff;
    font-weight:700;
    font-size:.84rem;
    letter-spacing:.08em;
    text-transform:uppercase;
    animation:tickerMove 22s linear infinite;
}

@keyframes tickerMove{
    from{transform:translateX(0)}
    to{transform:translateX(-40%)}
}

.ac-hero-grid{
    display:grid;
    grid-template-columns:1.08fr .92fr;
    gap:34px;
    align-items:center;
}

.ac-chip,
.ac-mini-chip,
.ac-overline,
.ac-core-badge{
    display:inline-flex;
    align-items:center;
    min-height:34px;
    padding:0 14px;
    border-radius:999px;
    border:1px solid var(--line-strong);
    background:rgba(255,255,255,.04);
    color:#d5e6ff;
    font-size:12px;
    font-weight:800;
    letter-spacing:.08em;
    text-transform:uppercase;
}

.ac-copy h1{
    margin:18px 0 0;
    font-size:clamp(3.2rem, 7vw, 6.4rem);
    line-height:.92;
    letter-spacing:-.06em;
    font-weight:950;
    max-width:780px;
}

.ac-copy h1 span{
    display:block;
    background:linear-gradient(90deg, #fff 0%, #8dd1ff 42%, #c1abff 100%);
    -webkit-background-clip:text;
    -webkit-text-fill-color:transparent;
}

.ac-lead{
    margin:24px 0 0;
    max-width:760px;
    color:var(--muted);
    font-size:1.08rem;
    line-height:1.9;
}

.ac-cta-row{
    display:flex;
    flex-wrap:wrap;
    gap:14px;
    margin-top:30px;
}

.ac-cta-row.center{
    justify-content:center;
}

.ac-btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:56px;
    padding:0 22px;
    border-radius:16px;
    text-decoration:none;
    font-weight:800;
    transition:transform .22s ease, box-shadow .22s ease, border-color .22s ease;
}

.ac-btn:hover{transform:translateY(-2px)}

.ac-btn-primary{
    color:#fff;
    background:linear-gradient(135deg, var(--blue), var(--violet));
    box-shadow:0 16px 42px rgba(99,179,255,.28);
}

.ac-btn-ghost{
    color:var(--text);
    border:1px solid var(--line-strong);
    background:rgba(255,255,255,.03);
}

.ac-stat-band{
    display:grid;
    grid-template-columns:repeat(3, 1fr);
    gap:16px;
    margin-top:30px;
}

.ac-stat-card{
    position:relative;
    overflow:hidden;
    padding:18px;
    border:1px solid var(--line);
    border-radius:22px;
    background:linear-gradient(180deg, rgba(255,255,255,.045), rgba(255,255,255,.02));
    box-shadow:var(--shadow);
}

.ac-stat-card::before{
    content:"";
    position:absolute;
    inset:0 auto 0 0;
    width:3px;
    background:linear-gradient(180deg, var(--blue), var(--violet));
}

.ac-stat-card span{
    display:block;
    color:var(--muted);
    font-size:.76rem;
    letter-spacing:.08em;
    text-transform:uppercase;
    margin-bottom:8px;
}

.ac-stat-card strong{
    display:block;
    font-size:1.08rem;
}

.ac-stat-card small{
    display:block;
    margin-top:8px;
    color:#bfd1ef;
}

.ac-visual{
    display:flex;
    align-items:center;
    justify-content:center;
    min-height:640px;
}

.ac-core-frame{
    position:relative;
    width:100%;
    max-width:610px;
    padding:18px;
    border-radius:34px;
    border:1px solid rgba(255,255,255,.1);
    background:
        linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.015));
    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.06),
        0 30px 90px rgba(0,0,0,.45);
}

.ac-frame-lines{
    position:absolute;
    inset:10px;
    border-radius:28px;
    border:1px solid rgba(255,255,255,.05);
    pointer-events:none;
}

.ac-core-panel{
    position:relative;
    overflow:hidden;
    border-radius:28px;
    padding:20px;
    border:1px solid var(--line);
    background:
        radial-gradient(circle at 50% 40%, rgba(99,179,255,.09), transparent 45%),
        linear-gradient(180deg, rgba(7,15,28,.95), rgba(10,18,32,.88));
    min-height:560px;
}

.ac-core-header{
    display:flex;
    justify-content:space-between;
    gap:16px;
    align-items:center;
}

.ac-core-live{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:30px;
    padding:0 12px;
    border-radius:999px;
    background:rgba(57,224,157,.14);
    border:1px solid rgba(57,224,157,.2);
    color:#dffff0;
    font-size:.8rem;
    font-weight:900;
    letter-spacing:.08em;
}

.ac-core-main{
    position:relative;
    height:400px;
    margin-top:18px;
    display:flex;
    align-items:center;
    justify-content:center;
}

.ac-core-ring{
    position:absolute;
    border-radius:999px;
    border:1px solid rgba(99,179,255,.16);
    box-shadow:inset 0 0 30px rgba(99,179,255,.04);
}

.ring-a{inset:28px}
.ring-b{inset:88px}
.ring-c{inset:148px}

.ac-core-center{
    position:relative;
    z-index:2;
    width:190px;
    height:190px;
    border-radius:50%;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:8px;
    border:1px solid rgba(255,255,255,.14);
    background:
        radial-gradient(circle at 30% 30%, rgba(255,255,255,.14), transparent 40%),
        linear-gradient(180deg, rgba(99,179,255,.18), rgba(143,113,255,.16));
    box-shadow:
        0 0 90px rgba(99,179,255,.22),
        inset 0 0 30px rgba(255,255,255,.04);
    text-align:center;
}

.ac-core-center small{
    color:#d7e8ff;
    font-size:.78rem;
    letter-spacing:.08em;
    text-transform:uppercase;
}

.ac-core-center strong{
    font-size:2.2rem;
    font-weight:950;
    letter-spacing:.08em;
}

.ac-core-center span{
    color:var(--blue2);
    font-weight:800;
}

.ac-node{
    position:absolute;
    z-index:2;
    min-width:96px;
    padding:10px 12px;
    text-align:center;
    border-radius:16px;
    border:1px solid var(--line-strong);
    background:rgba(8,16,29,.88);
    box-shadow:var(--shadow);
}

.ac-node b{
    display:block;
    font-size:.9rem;
    letter-spacing:.08em;
}

.ac-node small{
    display:block;
    margin-top:4px;
    color:var(--muted);
    font-size:.74rem;
}

.n1{top:34px; right:78px}
.n2{bottom:56px; right:34px}
.n3{top:94px; left:34px}
.n4{bottom:50px; left:56px}

.ac-core-footer{
    display:grid;
    grid-template-columns:repeat(3, 1fr);
    gap:12px;
}

.ac-core-footer div{
    padding:14px;
    border-radius:16px;
    border:1px solid var(--line);
    background:rgba(255,255,255,.03);
}

.ac-core-footer span{
    display:block;
    color:var(--muted);
    font-size:.76rem;
    margin-bottom:6px;
    text-transform:uppercase;
    letter-spacing:.08em;
}

.ac-core-footer strong{
    font-size:.98rem;
}

.ac-section{
    padding:42px 0;
}

.ac-section-head{
    display:flex;
    align-items:end;
    justify-content:space-between;
    gap:20px;
    margin-bottom:26px;
}

.ac-section-head h2{
    margin:12px 0 0;
    font-size:clamp(2rem, 4vw, 3.2rem);
    line-height:1;
    letter-spacing:-.05em;
}

.ac-section-head p{
    max-width:520px;
    color:var(--muted);
    line-height:1.75;
}

.ac-core-grid{
    display:grid;
    grid-template-columns:1.12fr .88fr;
    gap:22px;
}

.ac-side-column{
    display:grid;
    gap:22px;
}

.ac-panel,
.ac-asset,
.ac-sequence,
.ac-final-box{
    position:relative;
    overflow:hidden;
    border:1px solid var(--line);
    border-radius:30px;
    background:linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.02));
    box-shadow:var(--shadow);
    backdrop-filter:blur(18px);
    -webkit-backdrop-filter:blur(18px);
}

.ac-panel::after,
.ac-asset::after,
.ac-sequence::after,
.ac-final-box::after{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(130deg, rgba(255,255,255,.05), transparent 20%, transparent 80%, rgba(255,255,255,.03));
    pointer-events:none;
}

.ac-chart-panel,
.ac-signal-panel,
.ac-quote-panel,
.ac-overview{
    padding:22px;
}

.ac-panel-head{
    display:flex;
    justify-content:space-between;
    gap:18px;
    align-items:start;
    margin-bottom:18px;
}

.ac-panel-head h3{
    margin:12px 0 0;
    font-size:1.38rem;
    letter-spacing:-.03em;
}

.ac-panel-signal{
    display:inline-flex;
    align-items:center;
    gap:10px;
    min-height:40px;
    padding:0 14px;
    border-radius:999px;
    background:rgba(57,224,157,.14);
    border:1px solid rgba(57,224,157,.2);
    color:#dffff0;
    font-size:.92rem;
    font-weight:700;
}

.pulse{
    width:10px;
    height:10px;
    border-radius:999px;
    background:var(--green);
    box-shadow:0 0 0 0 rgba(57,224,157,.6);
    animation:ping 1.9s infinite;
}

@keyframes ping{
    0%{box-shadow:0 0 0 0 rgba(57,224,157,.6)}
    70%{box-shadow:0 0 0 12px rgba(57,224,157,0)}
    100%{box-shadow:0 0 0 0 rgba(57,224,157,0)}
}

.ac-tv-box{
    overflow:hidden;
    border-radius:20px;
    border:1px solid var(--line);
    background:linear-gradient(180deg, #030813, #07101d);
}

.ac-signal-panel h3,
.ac-quote-panel h3{
    margin:14px 0 12px;
    font-size:1.5rem;
    line-height:1.15;
    letter-spacing:-.04em;
}

.ac-signal-panel p{
    color:var(--muted);
    line-height:1.78;
}

.ac-feature-list{
    display:grid;
    gap:12px;
    margin-top:18px;
}

.ac-feature-list div{
    padding:14px 16px;
    border-radius:16px;
    border:1px solid var(--line);
    background:rgba(255,255,255,.03);
}

.ac-feature-list span{
    display:block;
    color:var(--muted);
    font-size:.78rem;
    margin-bottom:6px;
    text-transform:uppercase;
    letter-spacing:.08em;
}

.ac-quote-panel blockquote{
    margin:14px 0 0;
    font-size:1.65rem;
    line-height:1.36;
    font-weight:850;
    letter-spacing:-.035em;
}

.ac-board{
    display:grid;
    grid-template-columns:repeat(4, 1fr);
    gap:20px;
}

.ac-asset{
    padding:22px;
    min-height:320px;
    transform-style:preserve-3d;
    transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

.ac-asset.featured{
    border-color:rgba(99,179,255,.22);
    box-shadow:0 28px 80px rgba(0,0,0,.45), 0 0 55px rgba(99,179,255,.08);
}

.ac-asset-top{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
}

.ticker{
    color:var(--blue2);
    font-size:.92rem;
    font-weight:950;
    letter-spacing:.18em;
}

.state{
    display:inline-flex;
    align-items:center;
    min-height:30px;
    padding:0 10px;
    border-radius:999px;
    font-size:.76rem;
    font-weight:900;
    letter-spacing:.08em;
}

.state.live{
    color:#dffff0;
    background:rgba(57,224,157,.14);
    border:1px solid rgba(57,224,157,.2);
}
.state.arming{
    color:#fff1d7;
    background:rgba(242,178,79,.14);
    border:1px solid rgba(242,178,79,.2);
}
.state.pressure{
    color:#dbe9ff;
    background:rgba(99,179,255,.12);
    border:1px solid rgba(99,179,255,.18);
}
.state.watch{
    color:#f0e9ff;
    background:rgba(143,113,255,.14);
    border:1px solid rgba(143,113,255,.2);
}

.ac-asset h3{
    margin:18px 0 10px;
    font-size:1.55rem;
    letter-spacing:-.04em;
}

.ac-asset p{
    min-height:72px;
    color:var(--muted);
    line-height:1.72;
}

.ac-meter{
    margin-top:18px;
}

.ac-meter-top{
    display:flex;
    justify-content:space-between;
    gap:12px;
    margin-bottom:10px;
    color:#d4e3ff;
    font-size:.92rem;
}

.ac-meter-top strong{
    color:var(--text);
    font-size:1.2rem;
}

.ac-meter-bar{
    width:100%;
    height:10px;
    border-radius:999px;
    overflow:hidden;
    background:rgba(255,255,255,.06);
    border:1px solid rgba(255,255,255,.06);
}

.ac-meter-bar span{
    display:block;
    height:100%;
    border-radius:inherit;
    background:linear-gradient(90deg, var(--blue), var(--violet));
    box-shadow:0 0 18px rgba(99,179,255,.35);
}

.ac-asset-grid{
    display:grid;
    grid-template-columns:repeat(3, 1fr);
    gap:12px;
    margin-top:20px;
}

.ac-asset-grid div{
    padding:12px;
    border-radius:14px;
    border:1px solid var(--line);
    background:rgba(255,255,255,.03);
}

.ac-asset-grid span{
    display:block;
    color:var(--muted);
    font-size:.72rem;
    margin-bottom:6px;
    text-transform:uppercase;
    letter-spacing:.08em;
}

.ac-sequence{
    position:relative;
    display:grid;
    grid-template-columns:repeat(5, 1fr);
    gap:18px;
    padding:28px;
}

.ac-seq-line{
    position:absolute;
    left:40px;
    right:40px;
    top:78px;
    height:2px;
    background:linear-gradient(90deg, rgba(99,179,255,.75), rgba(143,113,255,.32), rgba(255,255,255,.05));
}

.ac-step{
    position:relative;
    z-index:1;
    padding:18px 16px;
    border-radius:18px;
    border:1px solid var(--line);
    background:rgba(255,255,255,.025);
}

.ac-step span{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    width:42px;
    height:42px;
    margin-bottom:14px;
    border-radius:999px;
    border:1px solid var(--line-strong);
    background:rgba(255,255,255,.05);
    font-weight:950;
}

.ac-step.done span,
.ac-step.current span{
    border-color:transparent;
    background:linear-gradient(135deg, var(--blue), var(--violet));
}

.ac-step.current{
    box-shadow:0 0 0 1px rgba(99,179,255,.18), 0 0 28px rgba(99,179,255,.1);
}

.ac-step h4{
    margin:0 0 10px;
    font-size:1.08rem;
}

.ac-step p{
    margin:0;
    color:var(--muted);
    line-height:1.65;
    font-size:.94rem;
}

.ac-final{
    padding:38px 0 80px;
}

.ac-final-box{
    padding:40px;
    text-align:center;
}

.ac-final-box h2{
    max-width:980px;
    margin:18px auto 16px;
    font-size:clamp(2.3rem, 5vw, 4.4rem);
    line-height:.98;
    letter-spacing:-.055em;
}

.ac-final-box h2 span{
    display:block;
    background:linear-gradient(90deg, #fff 0%, #8fd2ff 40%, #c4b0ff 100%);
    -webkit-background-clip:text;
    -webkit-text-fill-color:transparent;
}

.ac-final-box p{
    max-width:760px;
    margin:0 auto;
    color:var(--muted);
    line-height:1.85;
    font-size:1.03rem;
}

.tilt-card{
    will-change:transform;
}

/* responsive */
@media (max-width:1200px){
    .ac-hero-grid,
    .ac-core-grid{
        grid-template-columns:1fr;
    }

    .ac-board{
        grid-template-columns:repeat(2, 1fr);
    }

    .ac-sequence{
        grid-template-columns:repeat(2, 1fr);
    }

    .ac-visual{
        min-height:540px;
    }
}

@media (max-width:900px){
    .ac-topline,
    .ac-section-head,
    .ac-panel-head{
        flex-direction:column;
        align-items:flex-start;
    }

    .ac-stat-band,
    .ac-board,
    .ac-sequence{
        grid-template-columns:1fr;
    }

    .ac-copy h1{
        font-size:3rem;
    }

    .ac-core-main{
        height:340px;
    }

    .ring-a{inset:20px}
    .ring-b{inset:65px}
    .ring-c{inset:110px}

    .ac-core-center{
        width:150px;
        height:150px;
    }

    .n1{top:18px; right:30px}
    .n2{bottom:28px; right:8px}
    .n3{top:66px; left:8px}
    .n4{bottom:28px; left:18px}
}

@media (max-width:640px){
    :root{
        --shell:min(100% - 20px, 100%);
    }

    .ac-hero{
        padding-top:18px;
    }

    .ac-copy h1{
        font-size:2.35rem;
    }

    .ac-lead{
        font-size:1rem;
    }

    .ac-btn{
        width:100%;
    }

    .ac-ticker-wrap{
        width:100%;
    }

    .ac-core-footer,
    .ac-asset-grid{
        grid-template-columns:1fr;
    }

    .ac-final-box{
        padding:24px;
    }

    .ac-mouse-glow{
        width:320px;
        height:320px;
    }
}