/* ============================================================
   IQ CONNECT — HELP CENTER V2
   FULL PREMIUM UI / UX
============================================================ */

.hc{
    --hc-bg:#ffffff;
    --hc-soft:#f4f8fc;
    --hc-soft-2:#edf5fb;
    --hc-ink:#0b1d34;
    --hc-text:#38536b;
    --hc-muted:#7b91a4;
    --hc-line:#dce7ef;

    --hc-night:#020914;
    --hc-night-2:#061426;
    --hc-night-3:#0a284d;

    --hc-blue:#1687ff;
    --hc-blue-2:#315cff;
    --hc-cyan:#43e1ef;
    --hc-green:#45e09e;
    --hc-violet:#8d7cff;
    --hc-amber:#ffbd57;

    width:100%;
    overflow:hidden;
    color:var(--hc-ink);
    background:#fff;
    font-family:inherit;
}

.hc *,
.hc *::before,
.hc *::after{
    box-sizing:border-box;
}

.hc img{
    display:block;
    max-width:100%;
}

.hc a{
    color:inherit;
    text-decoration:none;
}

.hc button,
.hc input{
    font:inherit;
}

.hc button{
    cursor:pointer;
}

.hc-container{
    width:min(1240px,calc(100% - 48px));
    margin-inline:auto;
}


/* ============================================================
   SHARED
============================================================ */

.hc-eyebrow{
    display:inline-flex;
    align-items:center;
    gap:9px;
    color:var(--hc-blue);
    font-size:10px;
    line-height:1;
    font-weight:900;
    letter-spacing:.17em;
}

.hc-eyebrow::before{
    content:"";
    width:19px;
    height:1px;
    background:currentColor;
}

.hc-btn{
    min-height:51px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:11px;
    padding:0 22px;
    border:1px solid transparent;
    border-radius:12px;
    font-size:11px;
    font-weight:900;
    transition:
        transform .25s ease,
        background .25s ease,
        border-color .25s ease,
        box-shadow .25s ease;
}

.hc-btn:hover{
    transform:translateY(-3px);
}

.hc-btn--primary{
    color:#fff;
    border-color:rgba(93,197,255,.24);
    background:linear-gradient(135deg,var(--hc-blue),var(--hc-blue-2));
    box-shadow:0 18px 45px rgba(22,110,255,.23);
}

.hc-btn--ghost{
    color:#c7d7e4;
    border-color:rgba(255,255,255,.12);
    background:rgba(255,255,255,.035);
}


/* ============================================================
   HERO
============================================================ */

.hc-hero{
    position:relative;
    min-height:790px;
    display:flex;
    align-items:center;
    overflow:hidden;
    padding:62px 0 80px;
    color:#fff;
    background:
        radial-gradient(
            circle at 82% 28%,
            rgba(27,127,255,.23),
            transparent 30%
        ),
        radial-gradient(
            circle at 10% 88%,
            rgba(67,225,239,.08),
            transparent 26%
        ),
        linear-gradient(
            120deg,
            #020914 0%,
            #061426 50%,
            #0b2c56 100%
        );
}

.hc-hero__grid{
    position:absolute;
    inset:0;
    opacity:.32;
    pointer-events:none;
    background-image:
        linear-gradient(
            rgba(75,150,210,.065) 1px,
            transparent 1px
        ),
        linear-gradient(
            90deg,
            rgba(75,150,210,.065) 1px,
            transparent 1px
        );
    background-size:48px 48px;
}

.hc-hero__glow{
    position:absolute;
    border-radius:50%;
    filter:blur(80px);
    pointer-events:none;
}

.hc-hero__glow--one{
    width:550px;
    height:550px;
    right:-180px;
    top:-220px;
    background:rgba(24,127,255,.16);
}

.hc-hero__glow--two{
    width:430px;
    height:430px;
    left:-190px;
    bottom:-230px;
    background:rgba(67,225,239,.08);
}

.hc-breadcrumb{
    position:relative;
    z-index:3;
    display:flex;
    align-items:center;
    gap:9px;
    margin-bottom:55px;
    color:#6d899f;
    font-size:11px;
}

.hc-breadcrumb a{
    color:#91a7b9;
}

.hc-breadcrumb strong{
    color:#e3edf4;
}

.hc-hero__layout{
    position:relative;
    z-index:3;
    display:grid;
    grid-template-columns:
        minmax(0,.9fr)
        minmax(530px,1.1fr);
    align-items:center;
    gap:70px;
}

.hc-kicker{
    display:flex;
    align-items:center;
    gap:10px;
    margin-bottom:18px;
    color:var(--hc-cyan);
    font-size:10px;
    font-weight:900;
    letter-spacing:.17em;
}

.hc-kicker i{
    width:7px;
    height:7px;
    flex:none;
    border-radius:50%;
    background:var(--hc-green);
    box-shadow:0 0 18px rgba(69,224,158,.7);
}

.hc-hero__copy h1{
    max-width:700px;
    margin:0;
    color:#fff;
    font-size:clamp(57px,5.2vw,81px);
    line-height:.91;
    letter-spacing:-.068em;
}

.hc-hero__copy h1 span{
    display:block;
    margin-top:9px;
    color:transparent;
    background:
        linear-gradient(
            90deg,
            #43e1ef,
            #39a9ff 43%,
            #8c7bff
        );
    -webkit-background-clip:text;
    background-clip:text;
}

.hc-hero__copy > p{
    max-width:620px;
    margin:27px 0 0;
    color:#8aa4b9;
    font-size:14px;
    line-height:1.85;
}


/* ============================================================
   HERO SEARCH
============================================================ */

.hc-search{
    width:min(650px,100%);
    min-height:65px;
    display:grid;
    grid-template-columns:35px minmax(0,1fr) auto;
    align-items:center;
    gap:7px;
    margin-top:31px;
    padding:6px 6px 6px 17px;
    border:1px solid rgba(109,187,244,.16);
    border-radius:15px;
    background:rgba(255,255,255,.055);
    box-shadow:
        0 25px 60px rgba(0,0,0,.2),
        inset 0 1px rgba(255,255,255,.035);
    backdrop-filter:blur(12px);
}

.hc-search > span{
    color:#6289a6;
    font-size:20px;
}

.hc-search input{
    width:100%;
    min-width:0;
    border:0;
    outline:0;
    color:#e8f0f6;
    background:transparent;
    font-size:11px;
}

.hc-search input::placeholder{
    color:#66849b;
}

.hc-search button{
    min-height:51px;
    display:flex;
    align-items:center;
    gap:12px;
    padding:0 19px;
    border:1px solid rgba(89,194,255,.2);
    border-radius:10px;
    color:#fff;
    background:
        linear-gradient(
            135deg,
            var(--hc-blue),
            var(--hc-blue-2)
        );
    font-size:9px;
    font-weight:900;
}

.hc-popular{
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:7px;
    margin-top:16px;
}

.hc-popular > span{
    margin-right:3px;
    color:#466a84;
    font-size:6px;
    font-weight:900;
    letter-spacing:.13em;
}

.hc-popular button{
    min-height:27px;
    padding:0 10px;
    border:1px solid rgba(255,255,255,.075);
    border-radius:999px;
    color:#6f8ba1;
    background:rgba(255,255,255,.025);
    font-size:6px;
    font-weight:800;
    transition:.2s ease;
}

.hc-popular button:hover{
    color:var(--hc-cyan);
    border-color:rgba(67,225,239,.2);
    background:rgba(67,225,239,.05);
}


/* ============================================================
   SUPPORT COMMAND CENTER
============================================================ */

.hc-command{
    position:relative;
    min-width:0;
    overflow:hidden;
    border:1px solid rgba(100,184,248,.17);
    border-radius:23px;
    background:
        radial-gradient(
            circle at 95% 0%,
            rgba(37,132,255,.12),
            transparent 30%
        ),
        linear-gradient(
            180deg,
            rgba(12,31,54,.98),
            rgba(4,14,27,.99)
        );
    box-shadow:
        0 45px 110px rgba(0,0,0,.43),
        inset 0 1px rgba(255,255,255,.04);
    transform-style:preserve-3d;
}

.hc-command::before{
    content:"";
    position:absolute;
    inset:0;
    opacity:.23;
    pointer-events:none;
    background-image:
        linear-gradient(
            rgba(75,150,210,.05) 1px,
            transparent 1px
        ),
        linear-gradient(
            90deg,
            rgba(75,150,210,.05) 1px,
            transparent 1px
        );
    background-size:30px 30px;
}

.hc-command__top{
    position:relative;
    z-index:2;
    min-height:66px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:20px;
    padding:0 19px;
    border-bottom:1px solid rgba(255,255,255,.07);
}

.hc-command__top > div{
    display:flex;
    align-items:center;
    gap:11px;
}

.hc-live{
    width:9px;
    height:9px;
    flex:none;
    border-radius:50%;
    background:var(--hc-green);
    box-shadow:0 0 17px rgba(69,224,158,.7);
}

.hc-command__top small{
    display:block;
    color:#4e718b;
    font-size:6px;
    font-weight:900;
    letter-spacing:.14em;
}

.hc-command__top strong{
    display:block;
    margin-top:3px;
    color:#d9e7f1;
    font-size:10px;
}

.hc-command__status{
    padding:7px 10px;
    border:1px solid rgba(69,224,158,.15);
    border-radius:7px;
    color:#65e5aa;
    background:rgba(69,224,158,.045);
    font-size:6px;
    font-weight:900;
}

.hc-command__body{
    position:relative;
    z-index:2;
    display:grid;
    grid-template-columns:135px minmax(0,1fr);
    min-height:475px;
}

.hc-command__nav{
    padding:13px 8px;
    border-right:1px solid rgba(255,255,255,.07);
}

.hc-command__nav button{
    width:100%;
    min-height:51px;
    display:grid;
    grid-template-columns:26px 1fr;
    align-items:center;
    gap:7px;
    padding:0 8px;
    border:1px solid transparent;
    border-radius:8px;
    color:#607d94;
    background:transparent;
    font-size:7px;
    text-align:left;
    transition:.2s ease;
}

.hc-command__nav button i{
    color:#4d7088;
    font-size:8px;
    font-style:normal;
}

.hc-command__nav button:hover,
.hc-command__nav button.is-active{
    color:#d8e6f0;
    border-color:rgba(67,225,239,.11);
    background:rgba(67,225,239,.045);
}

.hc-command__nav button.is-active i{
    color:var(--hc-cyan);
}

.hc-command__workspace{
    min-width:0;
    padding:24px;
}

.hc-command__head{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:20px;
}

.hc-command__head > div > span{
    color:var(--hc-cyan);
    font-size:6px;
    font-weight:900;
    letter-spacing:.14em;
}

.hc-command__head h3{
    margin:6px 0 0;
    color:#fff;
    font-size:22px;
    letter-spacing:-.035em;
}

.hc-command__head > button{
    width:35px;
    height:35px;
    flex:none;
    border:1px solid rgba(255,255,255,.08);
    border-radius:8px;
    color:#7590a5;
    background:rgba(255,255,255,.025);
}

.hc-command__workspace > p{
    max-width:470px;
    margin:11px 0 0;
    color:#68839a;
    font-size:8px;
    line-height:1.7;
}

.hc-command__metrics{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:7px;
    margin-top:20px;
}

.hc-command__metrics article{
    min-height:88px;
    padding:13px;
    border:1px solid rgba(255,255,255,.065);
    border-radius:10px;
    background:rgba(255,255,255,.018);
}

.hc-command__metrics article > span{
    color:#4c6d86;
    font-size:5px;
    font-weight:900;
    letter-spacing:.12em;
}

.hc-command__metrics strong{
    display:block;
    margin-top:11px;
    color:#d3e2ed;
    font-size:10px;
}

.hc-command__metrics small{
    display:block;
    margin-top:4px;
    color:#536f86;
    font-size:5px;
}

.hc-command__visual{
    display:grid;
    grid-template-columns:minmax(0,1fr) 130px;
    gap:8px;
    margin-top:9px;
}

.hc-support-map,
.hc-command__signal{
    min-height:185px;
    border:1px solid rgba(255,255,255,.065);
    border-radius:10px;
    background:rgba(255,255,255,.016);
}


/* ============================================================
   SUPPORT MAP
============================================================ */

.hc-support-map{
    position:relative;
    overflow:hidden;
}

.hc-support-map__ring{
    position:absolute;
    left:50%;
    top:50%;
    transform:translate(-50%,-50%);
    border:1px solid rgba(68,171,239,.1);
    border-radius:50%;
}

.hc-support-map__ring--one{
    width:160px;
    height:160px;
}

.hc-support-map__ring--two{
    width:105px;
    height:105px;
}

.hc-support-map__core{
    position:absolute;
    z-index:3;
    left:50%;
    top:50%;
    width:69px;
    height:69px;
    transform:translate(-50%,-50%);
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    border:1px solid rgba(67,225,239,.28);
    border-radius:50%;
    background:#09213a;
    box-shadow:0 0 35px rgba(22,135,255,.18);
}

.hc-support-map__core strong{
    color:#fff;
    font-size:20px;
    letter-spacing:-.06em;
}

.hc-support-map__core span{
    color:var(--hc-cyan);
    font-size:5px;
    font-weight:900;
}

.hc-support-node{
    position:absolute;
    z-index:4;
    min-width:35px;
    height:22px;
    display:grid;
    place-items:center;
    padding:0 7px;
    border:1px solid rgba(255,255,255,.09);
    border-radius:999px;
    color:#7997ac;
    background:#0a1c30;
    font-size:5px;
    font-weight:900;
}

.hc-support-node--one{
    left:50%;
    top:15px;
    transform:translateX(-50%);
}

.hc-support-node--two{
    right:20px;
    top:55px;
}

.hc-support-node--three{
    right:25px;
    bottom:24px;
}

.hc-support-node--four{
    left:25px;
    bottom:24px;
}

.hc-support-node--five{
    left:20px;
    top:55px;
}

.hc-command__signal{
    display:flex;
    flex-direction:column;
    justify-content:center;
    padding:14px;
}

.hc-command__signal > span{
    color:var(--hc-green);
    font-size:5px;
    font-weight:900;
    letter-spacing:.11em;
}

.hc-command__signal strong{
    margin-top:11px;
    color:#fff;
    font-size:11px;
    line-height:1.35;
}

.hc-command__signal p{
    margin:8px 0 0;
    color:#617e95;
    font-size:6px;
    line-height:1.65;
}

.hc-command__signal a{
    margin-top:15px;
    color:var(--hc-cyan);
    font-size:6px;
    font-weight:900;
}

.hc-command__footer{
    position:relative;
    z-index:2;
    min-height:39px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:20px;
    padding:0 18px;
    border-top:1px solid rgba(255,255,255,.06);
    color:#45647c;
    font-size:5px;
    font-weight:800;
}


/* ============================================================
   QUICK ACCESS
============================================================ */

.hc-quick{
    border-bottom:1px solid var(--hc-line);
    background:#fff;
}

.hc-quick__grid{
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    border-left:1px solid var(--hc-line);
}

.hc-quick-card{
    position:relative;
    min-height:175px;
    display:grid;
    grid-template-columns:42px 1fr;
    align-content:center;
    gap:11px;
    padding:25px;
    border-right:1px solid var(--hc-line);
    background:#fff;
    transition:.25s ease;
}

.hc-quick-card:hover{
    z-index:2;
    background:#f8fbfe;
    box-shadow:0 20px 45px rgba(18,52,79,.07);
}

.hc-quick-card__number{
    position:absolute;
    top:18px;
    right:19px;
    color:#a0b2c0;
    font-size:7px;
    font-weight:900;
}

.hc-quick-card__icon{
    width:42px;
    height:42px;
    display:grid;
    place-items:center;
    border:1px solid #dbe7ef;
    border-radius:10px;
    color:var(--hc-blue);
    background:#f5f9fd;
    font-size:14px;
}

.hc-quick-card strong{
    display:block;
    color:#17354d;
    font-size:12px;
}

.hc-quick-card p{
    margin:5px 0 0;
    color:#8396a6;
    font-size:8px;
    line-height:1.6;
}

.hc-quick-card > i{
    position:absolute;
    right:20px;
    bottom:18px;
    color:var(--hc-blue);
    font-style:normal;
    font-size:11px;
}


/* ============================================================
   SHARED SECTION HEAD
============================================================ */

.hc-categories,
.hc-faq,
.hc-support{
    padding:105px 0;
}

.hc-section-head{
    display:grid;
    grid-template-columns:minmax(0,1fr) minmax(280px,430px);
    align-items:end;
    gap:50px;
    margin-bottom:50px;
}

.hc-section-head h2,
.hc-support__header h2,
.hc-final h2{
    max-width:740px;
    margin:13px 0 0;
    color:var(--hc-ink);
    font-size:clamp(40px,4.5vw,62px);
    line-height:.96;
    letter-spacing:-.058em;
}

.hc-section-head h2 span,
.hc-support__header h2 span{
    color:var(--hc-blue);
}

.hc-section-head > p{
    margin:0;
    color:var(--hc-muted);
    font-size:13px;
    line-height:1.8;
}


/* ============================================================
   PRODUCT HELP CATEGORIES
============================================================ */

.hc-categories{
    background:#fff;
}

.hc-category-grid{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:14px;
}

.hc-category-card{
    position:relative;
    min-height:350px;
    display:flex;
    flex-direction:column;
    padding:27px;
    overflow:hidden;
    border:1px solid var(--hc-line);
    border-radius:17px;
    background:
        linear-gradient(
            180deg,
            #fff,
            #fbfdff
        );
    box-shadow:0 14px 40px rgba(15,49,76,.035);
    transition:
        transform .25s ease,
        box-shadow .25s ease,
        border-color .25s ease;
}

.hc-category-card::before{
    content:"";
    position:absolute;
    left:0;
    top:0;
    width:100%;
    height:3px;
    opacity:0;
    background:
        linear-gradient(
            90deg,
            var(--hc-cyan),
            var(--hc-blue),
            var(--hc-violet)
        );
    transition:.25s ease;
}

.hc-category-card:hover{
    transform:translateY(-6px);
    border-color:rgba(22,135,255,.2);
    box-shadow:0 25px 60px rgba(15,49,76,.09);
}

.hc-category-card:hover::before{
    opacity:1;
}

.hc-category-card__top{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:20px;
}

.hc-category-card__top > span{
    color:#9aafbf;
    font-size:8px;
    font-weight:900;
}

.hc-category-card__top > i{
    width:43px;
    height:43px;
    display:grid;
    place-items:center;
    border:1px solid #d9e6ef;
    border-radius:11px;
    color:var(--hc-blue);
    background:#f3f8fd;
    font-size:8px;
    font-style:normal;
    font-weight:900;
}

.hc-category-card h3{
    margin:30px 0 0;
    color:#17354d;
    font-size:23px;
    line-height:1.08;
    letter-spacing:-.035em;
}

.hc-category-card > p{
    margin:12px 0 0;
    color:#7a8f9f;
    font-size:10px;
    line-height:1.75;
}

.hc-category-card__links{
    margin-top:auto;
    padding-top:25px;
}

.hc-category-card__links button,
.hc-category-card__links a{
    width:100%;
    min-height:39px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    padding:0;
    border:0;
    border-top:1px solid #edf2f6;
    color:#5e788d;
    background:transparent;
    font-size:8px;
    font-weight:800;
    text-align:left;
}

.hc-category-card__links button:first-child,
.hc-category-card__links a:first-child{
    border-top:1px solid var(--hc-line);
}

.hc-category-card__links button span,
.hc-category-card__links a span{
    color:var(--hc-blue);
    transition:transform .2s ease;
}

.hc-category-card__links button:hover,
.hc-category-card__links a:hover{
    color:var(--hc-blue);
}

.hc-category-card__links button:hover span,
.hc-category-card__links a:hover span{
    transform:translateX(4px);
}

.hc-empty{
    margin-top:22px;
    padding:40px;
    border:1px dashed #cad9e5;
    border-radius:16px;
    background:#f8fbfd;
    text-align:center;
}

.hc-empty strong{
    color:#17354d;
    font-size:17px;
}

.hc-empty p{
    margin:8px 0 0;
    color:#7b91a3;
    font-size:10px;
}

.hc-empty button{
    min-height:39px;
    margin-top:17px;
    padding:0 15px;
    border:0;
    border-radius:8px;
    color:#fff;
    background:var(--hc-blue);
    font-size:8px;
    font-weight:900;
}


/* ============================================================
   GETTING STARTED
============================================================ */

.hc-start{
    position:relative;
    padding:110px 0;
    color:#fff;
    background:
        radial-gradient(
            circle at 80% 30%,
            rgba(22,135,255,.13),
            transparent 30%
        ),
        #04101e;
}

.hc-section-head--dark h2{
    color:#fff;
}

.hc-section-head--dark h2 span{
    color:var(--hc-cyan);
}

.hc-section-head--dark > p{
    color:#6e899f;
}

.hc-start__layout{
    display:grid;
    grid-template-columns:220px minmax(0,1fr);
    gap:13px;
}

.hc-start__timeline,
.hc-start__workspace{
    border:1px solid rgba(255,255,255,.075);
    border-radius:17px;
    background:rgba(255,255,255,.025);
}

.hc-start__timeline{
    padding:9px;
}

.hc-start__timeline button{
    width:100%;
    min-height:74px;
    display:grid;
    grid-template-columns:32px 1fr;
    align-items:center;
    gap:10px;
    padding:0 12px;
    border:1px solid transparent;
    border-radius:10px;
    color:#617e94;
    background:transparent;
    text-align:left;
    transition:.2s ease;
}

.hc-start__timeline button + button{
    margin-top:4px;
}

.hc-start__timeline button > span{
    color:#42647e;
    font-size:8px;
    font-weight:900;
}

.hc-start__timeline strong{
    display:block;
    color:#91a9ba;
    font-size:9px;
}

.hc-start__timeline small{
    display:block;
    margin-top:4px;
    color:#4d6b82;
    font-size:6px;
}

.hc-start__timeline button:hover,
.hc-start__timeline button.is-active{
    border-color:rgba(67,225,239,.13);
    background:rgba(67,225,239,.055);
}

.hc-start__timeline button.is-active > span{
    color:var(--hc-cyan);
}

.hc-start__timeline button.is-active strong{
    color:#fff;
}

.hc-start__workspace{
    min-width:0;
    padding:31px;
}

.hc-start__top{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:25px;
}

.hc-start__top > div > span{
    color:var(--hc-cyan);
    font-size:7px;
    font-weight:900;
    letter-spacing:.13em;
}

.hc-start__top h3{
    margin:8px 0 0;
    color:#fff;
    font-size:28px;
    letter-spacing:-.04em;
}

.hc-start__progress{
    min-width:70px;
    padding:9px 10px;
    border:1px solid rgba(69,224,158,.13);
    border-radius:9px;
    color:#507f69;
    background:rgba(69,224,158,.035);
    font-size:5px;
    font-weight:900;
    text-align:center;
}

.hc-start__progress b{
    display:block;
    margin-bottom:3px;
    color:var(--hc-green);
    font-size:11px;
}

.hc-start__workspace > p{
    max-width:650px;
    margin:14px 0 0;
    color:#6d879c;
    font-size:9px;
    line-height:1.75;
}

.hc-start__diagram{
    position:relative;
    width:410px;
    max-width:100%;
    height:330px;
    margin:24px auto;
}

.hc-start__diagram::before,
.hc-start__diagram::after{
    content:"";
    position:absolute;
    left:50%;
    top:50%;
    transform:translate(-50%,-50%);
    border:1px solid rgba(69,168,236,.11);
    border-radius:50%;
}

.hc-start__diagram::before{
    width:280px;
    height:280px;
}

.hc-start__diagram::after{
    width:195px;
    height:195px;
}

.hc-start__core{
    position:absolute;
    z-index:3;
    left:50%;
    top:50%;
    width:112px;
    height:112px;
    transform:translate(-50%,-50%);
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    border:1px solid rgba(67,225,239,.3);
    border-radius:50%;
    background:#09213a;
    box-shadow:0 0 60px rgba(22,135,255,.2);
}

.hc-start__core strong{
    color:#fff;
    font-size:29px;
    letter-spacing:-.07em;
}

.hc-start__core span{
    color:var(--hc-cyan);
    font-size:6px;
    font-weight:900;
}

.hc-start__orbit{
    position:absolute;
    z-index:4;
    min-width:82px;
    height:32px;
    display:grid;
    place-items:center;
    padding:0 10px;
    border:1px solid rgba(255,255,255,.09);
    border-radius:999px;
    color:#8ca6b9;
    background:#0a1c30;
    font-size:7px;
    font-weight:800;
}

.hc-start__orbit--one{
    left:50%;
    top:8px;
    transform:translateX(-50%);
}

.hc-start__orbit--two{
    right:0;
    top:50%;
    transform:translateY(-50%);
}

.hc-start__orbit--three{
    left:50%;
    bottom:8px;
    transform:translateX(-50%);
}

.hc-start__orbit--four{
    left:0;
    top:50%;
    transform:translateY(-50%);
}

.hc-start__footer{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:25px;
    padding-top:18px;
    border-top:1px solid rgba(255,255,255,.07);
}

.hc-start__footer > div > span{
    color:#486a83;
    font-size:6px;
    font-weight:900;
}

.hc-start__footer strong{
    display:block;
    margin-top:6px;
    color:#b8cad7;
    font-size:8px;
}

.hc-start__footer button{
    min-width:110px;
    height:38px;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:9px;
    border:1px solid rgba(67,225,239,.15);
    border-radius:8px;
    color:var(--hc-cyan);
    background:rgba(67,225,239,.04);
    font-size:7px;
    font-weight:900;
}


/* ============================================================
   FAQ
============================================================ */

.hc-faq{
    background:#fff;
}

.hc-faq__layout{
    display:grid;
    grid-template-columns:minmax(0,1fr) 330px;
    gap:20px;
}

.hc-faq__list{
    border-top:1px solid var(--hc-line);
}

.hc-faq-item{
    border-bottom:1px solid var(--hc-line);
}

.hc-faq-item > button{
    width:100%;
    min-height:84px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:25px;
    padding:0 7px;
    border:0;
    color:#18364e;
    background:transparent;
    text-align:left;
}

.hc-faq-item > button span{
    font-size:13px;
    font-weight:900;
}

.hc-faq-item > button i{
    width:31px;
    height:31px;
    flex:none;
    display:grid;
    place-items:center;
    border:1px solid var(--hc-line);
    border-radius:50%;
    color:var(--hc-blue);
    font-style:normal;
}

.hc-faq-item__answer{
    display:none;
    max-width:760px;
    padding:0 60px 25px 7px;
}

.hc-faq-item.is-open .hc-faq-item__answer{
    display:block;
}

.hc-faq-item__answer p{
    margin:0;
    color:#748a9b;
    font-size:10px;
    line-height:1.8;
}

.hc-faq__aside{
    position:relative;
    overflow:hidden;
    padding:31px;
    border-radius:19px;
    color:#fff;
    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(67,225,239,.12),
            transparent 35%
        ),
        linear-gradient(
            145deg,
            #061426,
            #0a2b4f
        );
}

.hc-faq__aside::before{
    content:"";
    position:absolute;
    inset:0;
    opacity:.2;
    background-image:
        linear-gradient(
            rgba(75,150,210,.06) 1px,
            transparent 1px
        ),
        linear-gradient(
            90deg,
            rgba(75,150,210,.06) 1px,
            transparent 1px
        );
    background-size:30px 30px;
}

.hc-faq__aside > *{
    position:relative;
    z-index:2;
}

.hc-faq__aside > span{
    color:var(--hc-cyan);
    font-size:7px;
    font-weight:900;
    letter-spacing:.14em;
}

.hc-faq__aside h3{
    margin:25px 0 0;
    color:#fff;
    font-size:27px;
    line-height:1.03;
    letter-spacing:-.04em;
}

.hc-faq__aside > p{
    margin:16px 0 0;
    color:#7f99ad;
    font-size:10px;
    line-height:1.75;
}

.hc-faq__aside > a{
    min-height:43px;
    display:inline-flex;
    align-items:center;
    gap:10px;
    margin-top:25px;
    padding:0 15px;
    border:1px solid rgba(67,225,239,.15);
    border-radius:9px;
    color:var(--hc-cyan);
    background:rgba(67,225,239,.04);
    font-size:8px;
    font-weight:900;
}

.hc-faq__signal{
    margin-top:40px;
    padding-top:20px;
    border-top:1px solid rgba(255,255,255,.08);
}

.hc-faq__signal > div{
    display:flex;
    align-items:center;
    gap:8px;
}

.hc-faq__signal i{
    width:6px;
    height:6px;
    border-radius:50%;
    background:var(--hc-green);
    box-shadow:0 0 12px rgba(69,224,158,.6);
}

.hc-faq__signal span{
    color:#52758e;
    font-size:6px;
    font-weight:900;
}

.hc-faq__signal strong{
    display:block;
    margin-top:11px;
    color:#afc4d2;
    font-size:9px;
}


/* ============================================================
   SUPPORT PATH
============================================================ */

.hc-support{
    background:var(--hc-soft);
}

.hc-support__header{
    margin-bottom:45px;
}

.hc-support__grid{
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    border-top:1px solid var(--hc-line);
    border-left:1px solid var(--hc-line);
}

.hc-support-card{
    position:relative;
    min-height:270px;
    padding:27px;
    border-right:1px solid var(--hc-line);
    border-bottom:1px solid var(--hc-line);
    background:#fff;
    transition:.25s ease;
}

.hc-support-card:hover{
    z-index:2;
    transform:translateY(-5px);
    box-shadow:0 24px 55px rgba(17,52,80,.08);
}

.hc-support-card > span{
    color:#9aafbf;
    font-size:7px;
    font-weight:900;
}

.hc-support-card > i{
    position:absolute;
    right:27px;
    top:25px;
    width:39px;
    height:39px;
    display:grid;
    place-items:center;
    border:1px solid var(--hc-line);
    border-radius:10px;
    color:var(--hc-blue);
    background:#f6fafe;
    font-style:normal;
}

.hc-support-card > strong{
    display:block;
    margin-top:68px;
    color:#17354d;
    font-size:18px;
}

.hc-support-card > p{
    margin:10px 0 0;
    color:#7b90a1;
    font-size:9px;
    line-height:1.7;
}

.hc-support-card > b{
    position:absolute;
    left:27px;
    bottom:25px;
    color:var(--hc-blue);
    font-size:8px;
}


/* ============================================================
   FINAL CTA
============================================================ */

.hc-final{
    position:relative;
    overflow:hidden;
    padding:120px 0;
    color:#fff;
    background:
        linear-gradient(
            135deg,
            #020914,
            #081d36
        );
}

.hc-final__grid{
    position:absolute;
    inset:0;
    opacity:.3;
    pointer-events:none;
    background-image:
        linear-gradient(
            rgba(69,145,205,.06) 1px,
            transparent 1px
        ),
        linear-gradient(
            90deg,
            rgba(69,145,205,.06) 1px,
            transparent 1px
        );
    background-size:45px 45px;
}

.hc-final__glow{
    position:absolute;
    width:600px;
    height:600px;
    right:-200px;
    top:-230px;
    border-radius:50%;
    background:rgba(22,135,255,.15);
    filter:blur(90px);
}

.hc-final__layout{
    position:relative;
    z-index:2;
    display:grid;
    grid-template-columns:minmax(0,1fr) 430px;
    align-items:center;
    gap:70px;
}

.hc-final h2{
    color:#fff;
}

.hc-final h2 span{
    display:block;
    color:var(--hc-cyan);
}

.hc-final p{
    max-width:590px;
    margin:20px 0 0;
    color:#7892a7;
    font-size:13px;
    line-height:1.8;
}

.hc-final__actions{
    display:flex;
    flex-wrap:wrap;
    gap:10px;
    margin-top:29px;
}

.hc-final__visual{
    position:relative;
    width:390px;
    max-width:100%;
    height:390px;
    margin:auto;
}

.hc-final__ring{
    position:absolute;
    left:50%;
    top:50%;
    transform:translate(-50%,-50%);
    border:1px solid rgba(71,170,240,.13);
    border-radius:50%;
}

.hc-final__ring--one{
    width:360px;
    height:360px;
}

.hc-final__ring--two{
    width:270px;
    height:270px;
}

.hc-final__ring--three{
    width:180px;
    height:180px;
}

.hc-final__core{
    position:absolute;
    z-index:3;
    left:50%;
    top:50%;
    width:125px;
    height:125px;
    transform:translate(-50%,-50%);
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    border:1px solid rgba(67,225,239,.28);
    border-radius:50%;
    background:#09213a;
    box-shadow:0 0 65px rgba(22,135,255,.2);
}

.hc-final__core strong{
    color:#fff;
    font-size:35px;
    letter-spacing:-.07em;
}

.hc-final__core span{
    color:var(--hc-cyan);
    font-size:6px;
    font-weight:900;
}

.hc-final__node{
    position:absolute;
    z-index:4;
    min-width:68px;
    height:31px;
    display:grid;
    place-items:center;
    padding:0 10px;
    border:1px solid rgba(255,255,255,.1);
    border-radius:999px;
    color:#88a4b8;
    background:#0a1d32;
    font-size:6px;
    font-style:normal;
    font-weight:900;
}

.hc-final__node--one{
    left:50%;
    top:0;
    transform:translateX(-50%);
}

.hc-final__node--two{
    right:0;
    top:50%;
    transform:translateY(-50%);
}

.hc-final__node--three{
    left:50%;
    bottom:0;
    transform:translateX(-50%);
}

.hc-final__node--four{
    left:0;
    top:50%;
    transform:translateY(-50%);
}


/* ============================================================
   MODAL
============================================================ */

.hc-modal{
    position:fixed;
    z-index:99999;
    inset:0;
    display:grid;
    place-items:center;
    padding:20px;
    opacity:0;
    visibility:hidden;
    pointer-events:none;
    transition:.25s ease;
}

.hc-modal[aria-hidden="false"]{
    opacity:1;
    visibility:visible;
    pointer-events:auto;
}

.hc-modal__backdrop{
    position:absolute;
    inset:0;
    background:rgba(2,9,18,.82);
    backdrop-filter:blur(10px);
}

.hc-modal__dialog{
    position:relative;
    z-index:2;
    width:min(560px,100%);
    max-height:calc(100vh - 40px);
    overflow:auto;
    padding:36px;
    border:1px solid rgba(105,182,239,.16);
    border-radius:22px;
    color:#dbe8f1;
    background:
        radial-gradient(
            circle at 90% 0%,
            rgba(22,135,255,.13),
            transparent 30%
        ),
        #071729;
    box-shadow:0 45px 120px rgba(0,0,0,.52);
}

.hc-modal__close{
    position:absolute;
    right:16px;
    top:16px;
    width:35px;
    height:35px;
    border:1px solid rgba(255,255,255,.1);
    border-radius:50%;
    color:#9cb1c0;
    background:rgba(255,255,255,.035);
    font-size:18px;
}

.hc-modal__top{
    display:flex;
    align-items:center;
    gap:9px;
    color:#56788f;
    font-size:7px;
    font-weight:900;
}

.hc-modal__top > span{
    color:var(--hc-cyan);
}

.hc-modal__top i{
    width:4px;
    height:4px;
    border-radius:50%;
    background:#4b6c84;
}

.hc-modal__icon{
    width:68px;
    height:68px;
    display:grid;
    place-items:center;
    margin-top:30px;
    border:1px solid rgba(67,225,239,.2);
    border-radius:18px;
    color:#fff;
    background:rgba(67,225,239,.06);
    font-size:18px;
    font-weight:900;
}

.hc-modal__dialog h3{
    margin:22px 0 0;
    color:#fff;
    font-size:32px;
    line-height:1.05;
    letter-spacing:-.045em;
}

.hc-modal__dialog > p{
    margin:14px 0 0;
    color:#7690a5;
    font-size:11px;
    line-height:1.75;
}

.hc-modal__steps{
    margin-top:26px;
    border-top:1px solid rgba(255,255,255,.075);
}

.hc-modal__steps > div{
    display:grid;
    grid-template-columns:31px 1fr;
    gap:12px;
    padding:15px 0;
    border-bottom:1px solid rgba(255,255,255,.075);
}

.hc-modal__steps span{
    color:var(--hc-cyan);
    font-size:8px;
    font-weight:900;
}

.hc-modal__steps strong{
    color:#b8cad7;
    font-size:9px;
}

.hc-modal__actions{
    margin-top:25px;
}

.hc-modal__actions a{
    min-height:43px;
    display:inline-flex;
    align-items:center;
    gap:10px;
    padding:0 15px;
    border:1px solid rgba(67,225,239,.15);
    border-radius:9px;
    color:var(--hc-cyan);
    background:rgba(67,225,239,.04);
    font-size:8px;
    font-weight:900;
}


/* ============================================================
   SEARCH STATES
============================================================ */

.hc-category-card[hidden]{
    display:none !important;
}

.hc-search.is-active{
    border-color:rgba(67,225,239,.35);
    box-shadow:
        0 25px 60px rgba(0,0,0,.2),
        0 0 0 3px rgba(67,225,239,.035);
}


/* ============================================================
   RESPONSIVE
============================================================ */

@media(max-width:1150px){

    .hc-hero__layout{
        grid-template-columns:1fr;
        gap:55px;
    }

    .hc-command{
        width:min(800px,100%);
    }

    .hc-category-grid{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .hc-quick__grid{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .hc-quick-card{
        border-bottom:1px solid var(--hc-line);
    }

    .hc-support__grid{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}


@media(max-width:900px){

    .hc-section-head{
        grid-template-columns:1fr;
        gap:20px;
    }

    .hc-start__layout{
        grid-template-columns:1fr;
    }

    .hc-start__timeline{
        display:flex;
        overflow-x:auto;
    }

    .hc-start__timeline button{
        width:160px;
        flex:none;
    }

    .hc-faq__layout{
        grid-template-columns:1fr;
    }

    .hc-faq__aside{
        min-height:330px;
    }

    .hc-final__layout{
        grid-template-columns:1fr;
    }
}


@media(max-width:720px){

    .hc-container{
        width:calc(100% - 28px);
    }

    .hc-hero{
        min-height:auto;
        padding:44px 0 65px;
    }

    .hc-breadcrumb{
        margin-bottom:38px;
    }

    .hc-hero__copy h1{
        font-size:47px;
    }

    .hc-search{
        grid-template-columns:30px minmax(0,1fr);
        padding:10px 14px;
    }

    .hc-search button{
        grid-column:1/-1;
        width:100%;
    }

    .hc-command__body{
        grid-template-columns:1fr;
    }

    .hc-command__nav{
        display:flex;
        overflow-x:auto;
        border-right:0;
        border-bottom:1px solid rgba(255,255,255,.07);
    }

    .hc-command__nav button{
        width:125px;
        flex:none;
    }

    .hc-command__visual{
        grid-template-columns:1fr;
    }

    .hc-command__signal{
        min-height:130px;
    }

    .hc-categories,
    .hc-start,
    .hc-faq,
    .hc-support,
    .hc-final{
        padding:78px 0;
    }

    .hc-category-grid{
        grid-template-columns:1fr;
    }

    .hc-start__workspace{
        padding:22px 16px;
    }

    .hc-start__top{
        flex-direction:column;
    }

    .hc-start__footer{
        align-items:flex-start;
        flex-direction:column;
    }

    .hc-support__grid{
        grid-template-columns:1fr;
    }

    .hc-final__visual{
        height:340px;
    }
}


@media(max-width:520px){

    .hc-hero__copy h1{
        font-size:41px;
    }

    .hc-command__top{
        align-items:flex-start;
        flex-direction:column;
        padding:15px;
    }

    .hc-command__workspace{
        padding:17px 13px;
    }

    .hc-command__metrics{
        grid-template-columns:1fr;
    }

    .hc-quick__grid{
        grid-template-columns:1fr;
    }

    .hc-section-head h2,
    .hc-support__header h2,
    .hc-final h2{
        font-size:38px;
    }

    .hc-start__diagram{
        height:290px;
    }

    .hc-start__diagram::before{
        width:245px;
        height:245px;
    }

    .hc-start__diagram::after{
        width:170px;
        height:170px;
    }

    .hc-final__actions{
        display:grid;
    }

    .hc-final__actions .hc-btn{
        width:100%;
    }

    .hc-final__visual{
        height:300px;
    }

    .hc-final__ring--one{
        width:290px;
        height:290px;
    }

    .hc-final__ring--two{
        width:220px;
        height:220px;
    }

    .hc-final__ring--three{
        width:150px;
        height:150px;
    }

    .hc-modal__dialog{
        padding:28px 20px;
    }
}


/* ============================================================
   REDUCED MOTION
============================================================ */

@media(prefers-reduced-motion:reduce){

    .hc *,
    .hc *::before,
    .hc *::after{
        scroll-behavior:auto !important;
        animation:none !important;
        transition:none !important;
    }

    .hc-category-card:hover,
    .hc-support-card:hover,
    .hc-btn:hover{
        transform:none;
    }
}