:root {
    --bg:#080d20;
    --panel:#101831;
    --panel2:#0c142b;
    --text:#f4f7ff;
    --muted:#a5b0cc;
    --blue:#5a8cff;
    --cyan:#54e4ff;
    --violet:#a779ff;
    --line:rgba(174,195,255,.14);
    --radius:22px;
    --max:1180px
}
* {
    box-sizing:border-box
}
html {
    scroll-behavior:smooth;
    scroll-padding-top:90px
}
body {
    margin:0;
    background:radial-gradient(ellipse at 78% 8%,rgba(83,73,202,.16),transparent 35%),var(--bg);
    color:var(--text);
    font-family:'DM Sans',sans-serif;
    line-height:1.65
}
a {
    color:inherit;
    text-decoration:none
}
button,input,textarea {
    font:inherit
}
.container {
    width:min(var(--max),calc(100% - 44px));
    margin:auto
}
.nav {
    height:78px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:24px;
    position:sticky;
    top:0;
    z-index:20;
    background:rgba(8,13,32,.84);
    backdrop-filter:blur(18px);
    border-bottom:1px solid var(--line)
}
.nav-inner {
    display:flex;
    align-items:center;
    justify-content:space-between;
    width:min(var(--max),calc(100% - 44px));
    margin:auto
}
.brand {
    display:flex;
    align-items:center;
    gap:11px;
    font:800 1.18rem Manrope,sans-serif;
    letter-spacing:-.04em
}
.brand-mark {
    width:34px;
    height:34px;
    border-radius:11px;
    background:linear-gradient(135deg,var(--cyan),var(--blue) 50%,var(--violet));
    display:grid;
    place-items:center;
    color:#071027;
    font-weight:900;
    box-shadow:0 0 26px #5a8cff44
}
.brand span em {
    font-style:normal;
    color:#82cfff
}
.nav-links {
    display:flex;
    align-items:center;
    gap:28px;
    color:#c4cde4;
    font-size:.9rem
}
.nav-links a:hover {
    color:white
}
.nav-cta,.btn {
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:9px;
    padding:12px 18px;
    border-radius:12px;
    font-weight:700;
    font-size:.9rem;
    border:1px solid transparent;
    transition:.25s;
    cursor:pointer
}
.nav-cta,.btn-primary {
    background:linear-gradient(110deg,#3978ff,#7c69ff);
    box-shadow:0 8px 30px #456dff2e;
    color:white
}
.nav-cta:hover,.btn-primary:hover {
    transform:translateY(-2px);
    box-shadow:0 12px 36px #456dff55
}
.btn-secondary {
    border-color:var(--line);
    background:#ffffff06;
    color:#edf2ff
}
.btn-secondary:hover {
    background:#ffffff0c;
    border-color:#6c91ff66
}
.menu-btn {
    display:none;
    background:none;
    border:0;
    color:white;
    font-size:1.5rem
}
.hero {
    padding:94px 0 80px;
    position:relative;
    overflow:hidden
}
.hero:before {
    content:"";
    position:absolute;
    width:560px;
    height:560px;
    border-radius:50%;
    background:#376dff1b;
    filter:blur(75px);
    right:-170px;
    top:20px;
    pointer-events:none
}
.hero-grid {
    display:grid;
    grid-template-columns:1.04fr .96fr;
    gap:54px;
    align-items:center;
    position:relative
}
.eyebrow {
    display:inline-flex;
    align-items:center;
    gap:9px;
    padding:7px 12px;
    border:1px solid #7b9bff3b;
    border-radius:999px;
    color:#c5d4ff;
    background:#7898ff0c;
    font-size:.78rem;
    font-weight:700;
    letter-spacing:.04em
}
.pulse {
    width:7px;
    height:7px;
    border-radius:50%;
    background:#67e9c2;
    box-shadow:0 0 12px #67e9c2
}
.hero h1 {
    font:800 clamp(2.8rem,5.4vw,4.8rem)/1.08 Manrope,sans-serif;
    letter-spacing:-.065em;
    margin:23px 0
}
.gradient-text {
    background:linear-gradient(100deg,#8eeaff 0%,#759aff 48%,#c4a2ff 100%);
    -webkit-background-clip:text;
    background-clip:text;
    color:transparent
}
.hero p {
    font-size:1.1rem;
    max-width:590px;
    color:var(--muted);
    margin:0 0 28px
}
.hero-actions {
    display:flex;
    gap:13px;
    flex-wrap:wrap
}
.hero-note {
    display:flex;
    align-items:center;
    gap:12px;
    color:#8593b5;
    font-size:.82rem;
    margin-top:23px
}
.hero-note strong {
    color:#c5d2f2
}
.dashboard-wrap {
    position:relative;
    padding:16px
}
.dashboard-wrap:before {
    content:"";
    position:absolute;
    inset:4% 1%;
    background:linear-gradient(130deg,#4489ff66,#9d6cff44);
    filter:blur(50px);
    opacity:.45
}
.dashboard {
    position:relative;
    border:1px solid #a6baff32;
    border-radius:24px;
    background:linear-gradient(145deg,#121d3aee,#0c1329f7);
    padding:21px;
    box-shadow:0 28px 100px #0007;
    transform:perspective(1200px) rotateY(-4deg) rotateX(2deg)
}
.dash-top {
    display:flex;
    justify-content:space-between;
    align-items:center;
    padding-bottom:18px;
    border-bottom:1px solid var(--line)
}
.dash-label {
    font-size:.8rem;
    color:#aab8d8
}
.dash-title {
    font:700 1rem Manrope
}
.live {
    font-size:.72rem;
    color:#6fe3bc;
    background:#60e6b312;
    padding:5px 9px;
    border-radius:20px
}
.metric-grid {
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:10px;
    margin:17px 0
}
.metric {
    padding:13px;
    border:1px solid var(--line);
    border-radius:13px;
    background:#ffffff04
}
.metric small {
    display:block;
    color:#8999bd;
    font-size:.7rem
}
.metric strong {
    display:block;
    font:700 1.2rem Manrope;
    margin:6px 0 3px
}
.up {
    color:#67e3b2;
    font-size:.68rem
}
.chart-card {
    padding:15px;
    border:1px solid var(--line);
    border-radius:15px;
    background:#ffffff03
}
.chart-head {
    display:flex;
    justify-content:space-between;
    color:#dce5ff;
    font-size:.8rem;
    margin-bottom:12px
}
.chart-head span:last-child {
    color:#8d9bbb
}
.chart {
    height:118px;
    display:flex;
    align-items:end;
    gap:8px;
    padding:0 5px;
    border-bottom:1px solid #a9baff1d;
    background:repeating-linear-gradient(to bottom,transparent 0 28px,#a9baff0d 29px 30px)
}
.bar {
    flex:1;
    border-radius:5px 5px 0 0;
    background:linear-gradient(0deg,#596dff,#5ce0f5);
    opacity:.88;
    animation:grow 1s ease both;
    transform-origin:bottom
}
.bar:nth-child(2n) {
    background:linear-gradient(0deg,#7860ff,#a0a1ff)
}
.dash-bottom {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:10px;
    margin-top:11px
}
.mini-card {
    border:1px solid var(--line);
    border-radius:13px;
    padding:13px;
    font-size:.75rem;
    color:#a5b4d5
}
.mini-card strong {
    display:block;
    color:#eef3ff;
    font-size:.88rem;
    margin-top:5px
}
.section {
    padding:92px 0
}
.section-head {
    max-width:720px;
    margin:0 auto 44px;
    text-align:center
}
.kicker {
    color:#8daeff;
    font-size:.76rem;
    font-weight:800;
    text-transform:uppercase;
    letter-spacing:.16em
}
.section h2 {
    font:800 clamp(2rem,4vw,3.2rem)/1.16 Manrope,sans-serif;
    letter-spacing:-.05em;
    margin:13px 0 16px
}
.section-head p,.muted {
    color:var(--muted)
}
.cards {
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:17px
}
.card {
    border:1px solid var(--line);
    border-radius:var(--radius);
    padding:25px;
    background:linear-gradient(145deg,#111b35a8,#0d1429a8);
    transition:.25s
}
.card:hover {
    transform:translateY(-5px);
    border-color:#6b8cff65;
    background:linear-gradient(145deg,#172342,#0e1730)
}
.icon-box {
    width:46px;
    height:46px;
    border-radius:14px;
    display:grid;
    place-items:center;
    background:linear-gradient(135deg,#438aff24,#a26bff24);
    border:1px solid #8ba5ff2b;
    color:#9ecbff;
    font-size:1.3rem
}
.card h3 {
    font:700 1.1rem Manrope;
    margin:18px 0 8px
}
.card p {
    color:var(--muted);
    font-size:.92rem;
    margin:0
}
.concept {
    background:linear-gradient(180deg,transparent,#101a342e,transparent)
}
.concept-grid {
    display:grid;
    grid-template-columns:.9fr 1.1fr;
    gap:55px;
    align-items:center
}
.concept-copy h2 {
    font:800 clamp(2rem,4vw,3rem)/1.15 Manrope;
    letter-spacing:-.05em
}
.concept-copy p {
    color:var(--muted)
}
.steps {
    display:grid;
    gap:12px;
    margin-top:27px
}
.step {
    display:flex;
    gap:15px;
    align-items:flex-start;
    padding:14px 16px;
    border:1px solid var(--line);
    border-radius:15px;
    background:#ffffff04
}
.step-no {
    font:800 1rem Manrope;
    color:#83b7ff;
    background:#6c8dff18;
    border-radius:10px;
    padding:7px 10px
}
.step strong {
    display:block
}
.step span {
    color:var(--muted);
    font-size:.86rem
}
.flow-panel {
    border:1px solid var(--line);
    border-radius:24px;
    padding:25px;
    background:radial-gradient(ellipse at 90% 0%,#6f61ff1b,transparent 40%),#0e1730
}
.flow-panel-head {
    display:flex;
    justify-content:space-between;
    align-items:center;
    margin-bottom:23px
}
.flow-panel-head strong {
    font:700 1rem Manrope
}
.flow-panel-head span {
    font-size:.75rem;
    color:#9daed0
}
.flow-node {
    display:flex;
    align-items:center;
    gap:14px;
    padding:16px;
    border-radius:14px;
    background:#121f3c;
    border:1px solid #8ba6ff25;
    margin:10px 0
}
.flow-node .node-icon {
    width:38px;
    height:38px;
    display:grid;
    place-items:center;
    border-radius:11px;
    background:#638aff1e;
    color:#a5c5ff
}
.flow-node strong {
    display:block;
    font-size:.9rem
}
.flow-node small {
    color:#92a3c6
}
.flow-node .node-tag {
    margin-left:auto;
    color:#78e6c1;
    font-size:.7rem;
    background:#60e6b312;
    border-radius:7px;
    padding:5px 8px
}
.connector {
    height:17px;
    width:1px;
    background:linear-gradient(#5e87ff,#a477ff);
    margin-left:34px
}
.industry {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:18px
}
.industry-card {
    position:relative;
    overflow:hidden;
    border:1px solid var(--line);
    border-radius:24px;
    padding:29px;
    background:linear-gradient(145deg,#131f3c,#0c1429)
}
.industry-card.featured {
    border-color:#7294ff57;
    background:radial-gradient(ellipse at 100% 0%,#5e7dff21,transparent 45%),linear-gradient(145deg,#142346,#0c1429)
}
.industry-top {
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:12px
}
.pill {
    border:1px solid #8da8ff39;
    border-radius:999px;
    padding:5px 10px;
    font-size:.7rem;
    color:#aec7ff
}
.industry-card h3 {
    font:800 1.45rem Manrope;
    margin:20px 0 9px
}
.industry-card p {
    color:var(--muted);
    font-size:.93rem
}
.feature-list {
    list-style:none;
    padding:0;
    margin:22px 0 0;
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:11px
}
.feature-list li {
    color:#c8d3ee;
    font-size:.84rem;
    display:flex;
    gap:8px
}
.feature-list li:before {
    content:'✓';
    color:#72e3c1;
    font-weight:800
}
.roadmap {
    margin-top:18px;
    border:1px dashed #8ca6ff42;
    border-radius:20px;
    padding:24px;
    display:flex;
    gap:17px;
    align-items:center;
    background:#ffffff03
}
.roadmap .icon-box {
    flex-shrink:0
}
.roadmap p {
    color:var(--muted);
    margin:4px 0 0;
    font-size:.9rem
}
.ai-band {
    padding:35px;
    border:1px solid #8e91ff36;
    border-radius:25px;
    background:radial-gradient(ellipse at 90% 0%,#866bff25,transparent 42%),linear-gradient(120deg,#142447,#11162f);
    display:grid;
    grid-template-columns:1fr auto;
    gap:25px;
    align-items:center
}
.ai-band h3 {
    font:800 1.65rem Manrope;
    margin:8px 0
}
.ai-band p {
    color:var(--muted);
    margin:0;
    max-width:700px
}
.ai-bubbles {
    display:flex;
    gap:8px;
    flex-wrap:wrap;
    margin-top:17px
}
.ai-bubbles span {
    font-size:.75rem;
    color:#c8d5f5;
    border:1px solid var(--line);
    background:#ffffff05;
    border-radius:8px;
    padding:6px 10px
}
.leadership {
    display:grid;
    grid-template-columns:.72fr 1.28fr;
    gap:38px;
    align-items:stretch
}
.profile-visual {
    min-height:350px;
    border:1px solid #8ba4ff36;
    border-radius:25px;
    background:radial-gradient(circle at 50% 35%,#6688ff32,transparent 38%),linear-gradient(150deg,#152445,#0b1228);
    display:flex;
    align-items:center;
    justify-content:center;
    position:relative;
    overflow:hidden
}
.portrait-placeholder {
    width:150px;
    height:150px;
    border-radius:50%;
    display:grid;
    place-items:center;
    font:800 3rem Manrope;
    color:#dce9ff;
    background:linear-gradient(135deg,#5a9dff,#8668ed);
    border:5px solid #ffffff12;
    box-shadow:0 0 70px #628cff33
}
.photo-note {
    position:absolute;
    bottom:20px;
    left:20px;
    right:20px;
    text-align:center;
    color:#8396bd;
    font-size:.75rem
}
.profile-copy {
    padding:23px 0
}
.profile-copy h3 {
    font:800 2rem Manrope;
    letter-spacing:-.04em;
    margin:8px 0 2px
}
.role {
    color:#90b7ff;
    font-weight:700
}
.profile-copy p {
    color:var(--muted)
}
.profile-values {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:12px;
    margin-top:24px
}
.value {
    border:1px solid var(--line);
    border-radius:13px;
    padding:13px
}
.value strong {
    display:block;
    font-size:.87rem
}
.value span {
    font-size:.78rem;
    color:var(--muted)
}
.cta-section {
    padding:30px 0 95px
}
.cta-box {
    text-align:center;
    border:1px solid #829dff3c;
    border-radius:27px;
    padding:55px 24px;
    background:radial-gradient(ellipse at 50% 0%,#647bff25,transparent 60%),#101831
}
.cta-box h2 {
    font:800 clamp(2rem,4vw,3rem)/1.15 Manrope;
    letter-spacing:-.05em;
    margin:12px auto;
    max-width:750px
}
.cta-box p {
    color:var(--muted);
    max-width:620px;
    margin:0 auto 25px
}
.contact-form {
    max-width:650px;
    margin:25px auto 0;
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:10px
}
.contact-form input,.contact-form textarea {
    width:100%;
    background:#080f22;
    border:1px solid var(--line);
    color:white;
    border-radius:11px;
    padding:13px 14px;
    outline:none
}
.contact-form input:focus,.contact-form textarea:focus {
    border-color:#7294ff
}
.contact-form textarea {
    grid-column:1/-1;
    min-height:90px;
    resize:vertical
}
.contact-form button {
    grid-column:1/-1;
    justify-self:center
}
.form-note {
    font-size:.78rem;
    color:#8495b9;
    margin-top:12px
}
.footer {
    border-top:1px solid var(--line);
    padding:28px 0;
    color:#8493b5;
    font-size:.82rem
}
.footer-inner {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:18px;
    flex-wrap:wrap
}
.footer-links {
    display:flex;
    gap:18px
}
.footer a:hover {
    color:white
}
.reveal {
    opacity:0;
    transform:translateY(18px);
    transition:opacity .65s ease,transform .65s ease
}
.reveal.visible {
    opacity:1;
    transform:none
}
@keyframes grow {
    from {
        height:0
    }
    to {
        height:var(--h)
    }
}
@media(max-width:900px) {
    .hero-grid,.concept-grid,.leadership {
        grid-template-columns:1fr
    }
    .hero {
        padding-top:65px
    }
    .hero-copy {
        max-width:760px
    }
    .dashboard-wrap {
        max-width:650px;
        margin:auto;
        width:100%
    }
    .cards {
        grid-template-columns:repeat(2,1fr)
    }
    .concept-grid {
        gap:28px
    }
    .profile-visual {
        min-height:290px
    }
    .nav-links {
        gap:16px
    }
    .industry {
        grid-template-columns:1fr 1fr
    }
}
@media(max-width:680px) {
    .container,.nav-inner {
        width:min(100% - 30px,var(--max))
    }
    .nav {
        height:68px
    }
    .menu-btn {
        display:block
    }
    .nav-cta {
        display:none
    }
    .nav-links {
        display:none;
        position:absolute;
        top:67px;
        left:0;
        right:0;
        padding:18px 22px 22px;
        background:#0a1127;
        border-bottom:1px solid var(--line);
        flex-direction:column;
        align-items:stretch;
        gap:0
    }
    .nav-links.open {
        display:flex
    }
    .nav-links a {
        padding:11px 0
    }
    .nav-links a:last-child {
        display:block
    }
    .hero {
        padding:54px 0 55px
    }
    .hero h1 {
        font-size:clamp(2.5rem,12vw,3.7rem)
    }
    .hero p {
        font-size:1rem
    }
    .section {
        padding:66px 0
    }
    .cards,.industry {
        grid-template-columns:1fr
    }
    .card {
        padding:22px
    }
    .dashboard {
        padding:14px;
        transform:none
    }
    .metric-grid {
        gap:6px
    }
    .metric {
        padding:10px
    }
    .metric strong {
        font-size:1rem
    }
    .dash-bottom {
        grid-template-columns:1fr 1fr
    }
    .feature-list {
        grid-template-columns:1fr
    }
    .ai-band {
        grid-template-columns:1fr;
        padding:25px
    }
    .ai-band .btn {
        justify-self:start
    }
    .roadmap {
        align-items:flex-start
    }
    .profile-values {
        grid-template-columns:1fr 1fr
    }
    .contact-form {
        grid-template-columns:1fr
    }
    .contact-form textarea,.contact-form button {
        grid-column:1
    }
    .cta-box {
        padding:38px 18px
    }
    .footer-inner {
        align-items:flex-start;
        flex-direction:column
    }
    .hero-actions .btn {
        flex:1
    }
    .section-head {
        text-align:left;
        margin-bottom:30px
    }
    .section-head h2 {
        font-size:2.2rem
    }
}
@media(prefers-reduced-motion:reduce) {
    html {
        scroll-behavior:auto
    }
    *,*:before,*:after {
        animation-duration:.01ms!important;
        transition-duration:.01ms!important
    }
    .reveal {
        opacity:1;
        transform:none
    }
}
/* Motion polish and accessible contact-form validation */
@keyframes floatGlow {
    0%,100% {
        transform:translate3d(0,0,0) scale(1)
    }
    50% {
        transform:translate3d(-16px,18px,0) scale(1.06)
    }
}
.hero:before {
    animation:floatGlow 9s ease-in-out infinite alternate
}
.dashboard {
    animation:dashboardFloat 7s ease-in-out infinite
}
@keyframes dashboardFloat {
    0%,100% {
        translate:0 0
    }
    50% {
        translate:0 -9px
    }
}
.reveal {
    opacity:0;
    transform:translateY(22px);
    transition:opacity .7s ease,transform .7s cubic-bezier(.2,.7,.2,1)
}
.reveal.visible {
    opacity:1;
    transform:translateY(0)
}
.field {
    min-width:0;
    display:flex;
    flex-direction:column;
    gap:5px
}
.field-wide {
    grid-column:1/-1
}
.field-error {
    display:none;
    color:#ff9ca9;
    font-size:.76rem;
    padding:0 3px
}
.field.invalid .field-error {
    display:block
}
.contact-form .field.invalid input,.contact-form .field.invalid textarea {
    border-color:#ff7185;
    box-shadow:0 0 0 3px #ff71851a
}
.contact-form input:focus-visible,.contact-form textarea:focus-visible,.contact-form button:focus-visible {
    outline:2px solid #8ab7ff;
    outline-offset:3px
}
.contact-form button:disabled {
    opacity:.65;
    cursor:wait;
    transform:none
}
@media(prefers-reduced-motion:reduce) {
    html {
        scroll-behavior:auto
    }
    *,*::before,*::after {
        animation-duration:.01ms!important;
        animation-iteration-count:1!important;
        transition-duration:.01ms!important;
        scroll-behavior:auto!important
    }
    .reveal {
        opacity:1;
        transform:none
    }
}