/* Helmi AI v2 */
:root{
    --bg:#080713;
    --bg-2:#0b0918;
    --surface:rgba(255,255,255,.045);
    --surface-2:rgba(255,255,255,.065);
    --surface-3:rgba(255,255,255,.085);
    --border:rgba(255,255,255,.09);
    --border-strong:rgba(255,255,255,.15);
    --text:#f7f7fb;
    --muted:#a8adc0;
    --muted-2:#7d8295;
    --blue:#6f65ff;
    --violet:#9a76ff;
    --cyan:#78e8ff;
    --success:#8ce9b5;
    --shadow:0 30px 80px rgba(0,0,0,.36);
    --radius:26px;
    --container:1700px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
    margin:0;
    min-width:320px;
    overflow-x:hidden;
    color:var(--text);
    background:
        radial-gradient(circle at 8% 0%,rgba(78,53,211,.12),transparent 28rem),
        radial-gradient(circle at 92% 8%,rgba(102,73,235,.09),transparent 34rem),
        linear-gradient(180deg,#080713 0%,#090814 42%,#070610 100%);
    font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
    -webkit-font-smoothing:antialiased;
    text-rendering:optimizeLegibility;
}
body.menu-open{overflow:hidden}
a{color:inherit;text-decoration:none}
button,input,textarea{font:inherit}
button{color:inherit}
svg{display:block}
.container{
    width:min(calc(100% - 64px),var(--container));
    margin-inline:auto;
}
.section{
    position:relative;
    padding:138px 0;
}
.section-shell{position:relative;overflow:hidden}
h1,h2,h3,.brand-text{font-family:Manrope,Inter,sans-serif}
h1,h2,h3,p{margin-top:0}
h2{
    font-size:clamp(2.7rem,4.7vw,5.2rem);
    line-height:.99;
    letter-spacing:-.055em;
    font-weight:600;
}
h3{letter-spacing:-.028em}
p{line-height:1.72}
.gradient-text{
    background:linear-gradient(100deg,#fff 0%,#c7c5ff 18%,#9e8cff 52%,#74e4ff 100%);
    -webkit-background-clip:text;
    background-clip:text;
    color:transparent;
}
.btn{
    min-height:48px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:10px;
    padding:0 19px;
    border:1px solid transparent;
    border-radius:14px;
    font-size:.88rem;
    font-weight:600;
    transition:transform .22s ease,border-color .22s ease,background .22s ease,box-shadow .22s ease;
}
.btn:hover{transform:translateY(-2px)}
.btn-lg{min-height:56px;padding:0 24px;border-radius:16px}
.btn-primary{
    background:linear-gradient(135deg,#6d63ff 0%,#5449f7 60%,#7b50ff 100%);
    border-color:rgba(255,255,255,.18);
    box-shadow:0 14px 34px rgba(82,67,255,.28),inset 0 1px rgba(255,255,255,.18);
}
.btn-primary:hover{
    box-shadow:0 18px 42px rgba(82,67,255,.38),inset 0 1px rgba(255,255,255,.22);
}
.btn-ghost{
    background:rgba(255,255,255,.04);
    border-color:var(--border);
    color:#ebebf2;
    backdrop-filter:blur(14px);
}
.btn-ghost:hover{
    background:rgba(255,255,255,.07);
    border-color:var(--border-strong);
}
.btn-svg{width:17px;height:17px}
.inline-svg{width:17px;height:17px;display:inline-block;vertical-align:-3px}
.text-link{
    display:inline-flex;
    align-items:center;
    gap:8px;
    font-weight:600;
    color:#d8dae7;
}

/* Header */
.site-header{
    position:fixed;
    inset:0 0 auto;
    z-index:1000;
    padding:15px 0;
    transition:background .25s ease,border-color .25s ease,backdrop-filter .25s ease;
}
.site-header.scrolled{
    background:rgba(8,7,19,.72);
    border-bottom:1px solid rgba(255,255,255,.07);
    backdrop-filter:blur(22px);
}
.nav-wrap{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:28px;
}
.brand{
    display:inline-flex;
    align-items:center;
    gap:11px;
    font-weight:700;
}
.brand-mark{
    width:38px;
    height:38px;
    border-radius:12px;
    display:grid;
    place-items:center;
    background:linear-gradient(145deg,rgba(112,101,255,.18),rgba(120,232,255,.055));
    border:1px solid rgba(255,255,255,.1);
}
.brand-mark svg{width:100%;height:100%}
.brand-text{
    font-size:1.04rem;
    letter-spacing:-.025em;
}
.brand-text span{color:#a19cff}
.desktop-nav{
    display:flex;
    align-items:center;
    gap:4px;
    padding:5px;
    border:1px solid rgba(255,255,255,.07);
    border-radius:16px;
    background:rgba(255,255,255,.023);
    backdrop-filter:blur(16px);
}
.desktop-nav a{
    color:#aeb2c2;
    font-size:.78rem;
    font-weight:600;
    padding:9px 13px;
    border-radius:11px;
    transition:.2s ease;
}
.desktop-nav a:hover{
    color:#fff;
    background:rgba(255,255,255,.065);
}
.nav-actions{
    display:flex;
    align-items:center;
    gap:8px;
}
.menu-toggle{
    display:none;
    width:44px;
    height:44px;
    border:1px solid var(--border);
    border-radius:13px;
    background:rgba(255,255,255,.04);
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:6px;
}
.menu-toggle span{
    width:19px;
    height:1.5px;
    background:#fff;
    transition:.25s;
}
.mobile-menu{display:none}

/* Hero */
.hero{
    min-height:980px;
    padding:182px 0 54px;
    display:flex;
    flex-direction:column;
    justify-content:center;
}
.hero-inner{
    display:grid;
    grid-template-columns:minmax(0,1.06fr) minmax(520px,.94fr);
    gap:112px;
    align-items:center;
    position:relative;
    z-index:2;
}
.hero-copy{max-width:880px}
.hero-title{
    font-size:clamp(3.7rem,5.7vw,7rem);
    line-height:.94;
    letter-spacing:-.067em;
    font-weight:600;
    margin:0 0 30px;
}
.hero-lead{
    max-width:800px;
    color:#b1b5c7;
    font-size:1.08rem;
    line-height:1.8;
}
.hero-actions{
    display:flex;
    gap:11px;
    flex-wrap:wrap;
    margin-top:34px;
}
.hero-points{
    display:flex;
    flex-wrap:wrap;
    gap:24px;
    margin-top:30px;
    color:#adb1c0;
    font-size:.82rem;
}
.hero-points div{
    display:flex;
    align-items:center;
    gap:8px;
}
.point-icon{
    width:18px;
    height:18px;
    display:grid;
    place-items:center;
    color:#aba6ff;
}
.point-icon svg{width:16px;height:16px}
.hero-aurora{
    position:absolute;
    border-radius:50%;
    filter:blur(12px);
    pointer-events:none;
}
.hero-aurora-a{
    width:950px;
    height:670px;
    left:-390px;
    top:-300px;
    background:radial-gradient(circle,rgba(83,59,232,.34),rgba(58,39,161,.12) 40%,transparent 72%);
}
.hero-aurora-b{
    width:1040px;
    height:760px;
    right:-410px;
    top:-190px;
    background:radial-gradient(circle,rgba(103,74,245,.27),rgba(121,80,244,.11) 38%,transparent 73%);
}
.hero-curve{
    position:absolute;
    right:-180px;
    border-radius:50%;
    border:1px solid rgba(138,124,255,.14);
    filter:drop-shadow(0 0 28px rgba(112,87,255,.11));
    pointer-events:none;
}
.hero-curve-one{
    width:1180px;
    height:560px;
    top:38px;
    transform:rotate(-14deg);
}
.hero-curve-two{
    width:980px;
    height:470px;
    top:114px;
    right:-20px;
    transform:rotate(-14deg);
    border-color:rgba(112,229,255,.07);
}

/* Chat mockup */
.hero-product{
    position:relative;
    min-height:670px;
    display:flex;
    align-items:center;
    justify-content:center;
}
.product-halo{
    position:absolute;
    width:650px;
    height:650px;
    border-radius:50%;
    background:radial-gradient(circle,rgba(92,72,255,.31),rgba(151,86,255,.12) 35%,transparent 69%);
    filter:blur(20px);
}
.chat-window{
    position:relative;
    z-index:3;
    width:min(100%,560px);
    overflow:hidden;
    border:1px solid rgba(255,255,255,.11);
    border-radius:30px;
    background:linear-gradient(180deg,rgba(28,25,58,.93),rgba(13,12,30,.96));
    box-shadow:0 44px 110px rgba(0,0,0,.5),0 0 95px rgba(75,57,218,.15);
    backdrop-filter:blur(24px);
}
.chat-topbar{
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding:19px 21px;
    border-bottom:1px solid rgba(255,255,255,.075);
}
.chat-identity{
    display:flex;
    align-items:center;
    gap:11px;
}
.chat-avatar{
    width:41px;
    height:41px;
    display:grid;
    place-items:center;
    border:1px solid rgba(255,255,255,.09);
    border-radius:13px;
    background:linear-gradient(145deg,rgba(112,101,255,.18),rgba(121,232,255,.045));
}
.chat-avatar svg{width:36px;height:36px}
.chat-identity strong{
    display:block;
    font-size:.9rem;
}
.chat-identity small{
    display:flex;
    align-items:center;
    gap:6px;
    margin-top:3px;
    color:#83889a;
    font-size:.67rem;
}
.status-dot{
    width:6px;
    height:6px;
    border-radius:50%;
    background:var(--success);
    box-shadow:0 0 9px rgba(140,233,181,.74);
}
.icon-button{
    width:32px;
    height:32px;
    display:grid;
    place-items:center;
    border:0;
    border-radius:9px;
    background:transparent;
    color:#757a8d;
}
.icon-button svg{width:18px;height:18px}
.chat-body{
    min-height:430px;
    padding:27px 21px 18px;
}
.chat-date{
    margin-bottom:25px;
    text-align:center;
    color:#656a7d;
    font-size:.6rem;
    font-weight:700;
    letter-spacing:.15em;
}
.message{
    width:fit-content;
    max-width:84%;
    margin:0 0 12px;
    padding:12px 14px;
    border-radius:15px;
    font-size:.8rem;
    line-height:1.55;
}
.ai-message{
    border:1px solid rgba(255,255,255,.07);
    border-bottom-left-radius:5px;
    background:rgba(255,255,255,.055);
    color:#e8e9f0;
}
.user-message{
    margin-left:auto;
    border-bottom-right-radius:5px;
    background:linear-gradient(135deg,#635bf5,#754fdd);
    color:#fff;
}
.ai-rich-message p{
    margin:0 0 12px;
    line-height:1.5;
}
.time-options{
    display:flex;
    gap:7px;
}
.time-options button{
    padding:8px 11px;
    border:1px solid rgba(144,132,255,.24);
    border-radius:9px;
    background:rgba(104,91,255,.075);
    color:#d9d6ff;
    font-size:.72rem;
    cursor:pointer;
}
.integration-status{
    display:flex;
    align-items:center;
    gap:11px;
    margin-top:20px;
    padding:13px;
    border:1px solid rgba(255,255,255,.075);
    border-radius:14px;
    background:rgba(255,255,255,.032);
}
.integration-icon{
    width:35px;
    height:35px;
    display:grid;
    place-items:center;
    border:1px solid rgba(119,106,255,.18);
    border-radius:11px;
    background:rgba(100,88,255,.1);
    color:#aaa4ff;
}
.integration-icon svg{width:18px;height:18px}
.integration-status strong{
    display:block;
    font-size:.72rem;
}
.integration-status small{
    display:block;
    margin-top:2px;
    color:#70758a;
    font-size:.63rem;
}
.status-pill{
    margin-left:auto;
    padding:5px 7px;
    border:1px solid rgba(111,227,160,.15);
    border-radius:7px;
    background:rgba(61,173,112,.09);
    color:#9aeabf;
    font-size:.56rem;
    font-weight:800;
    letter-spacing:.08em;
}
.chat-input{
    display:flex;
    align-items:center;
    justify-content:space-between;
    margin:0 15px 15px;
    padding:9px 9px 9px 14px;
    border:1px solid rgba(255,255,255,.085);
    border-radius:14px;
    background:rgba(255,255,255,.03);
    color:#666c7f;
    font-size:.72rem;
}
.chat-input button{
    width:33px;
    height:33px;
    display:grid;
    place-items:center;
    border:0;
    border-radius:10px;
    background:linear-gradient(135deg,#6f63ff,#7e4cff);
    color:#fff;
}
.chat-input button svg{width:18px;height:18px}
.floating-card{
    position:absolute;
    z-index:4;
    display:flex;
    align-items:center;
    gap:11px;
    max-width:250px;
    padding:12px 14px;
    border:1px solid rgba(255,255,255,.095);
    border-radius:15px;
    background:rgba(18,16,38,.88);
    box-shadow:0 18px 45px rgba(0,0,0,.31);
    backdrop-filter:blur(16px);
}
.floating-card-one{
    left:-44px;
    top:158px;
    animation:float 5s ease-in-out infinite;
}
.floating-card-two{
    right:-28px;
    bottom:116px;
    animation:float 6s ease-in-out infinite reverse;
}
.floating-icon{
    width:32px;
    height:32px;
    flex:0 0 32px;
    display:grid;
    place-items:center;
    border:1px solid rgba(140,233,181,.14);
    border-radius:10px;
    background:rgba(75,207,151,.09);
    color:#8de8b7;
}
.floating-icon.purple{
    border-color:rgba(183,175,255,.14);
    background:rgba(127,98,255,.1);
    color:#b7afff;
}
.floating-icon svg{width:18px;height:18px}
.floating-card strong{
    display:block;
    font-size:.68rem;
}
.floating-card small{
    display:block;
    margin-top:3px;
    color:#74798c;
    font-size:.58rem;
    line-height:1.45;
}
@keyframes float{50%{transform:translateY(-8px)}}

.trust-row{
    position:relative;
    z-index:2;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:24px;
    margin-top:92px;
    padding-top:27px;
    border-top:1px solid rgba(255,255,255,.06);
}
.trust-row p{
    margin:0;
    color:#757a8c;
    font-size:.73rem;
}
.trust-tags{
    display:flex;
    flex-wrap:wrap;
    justify-content:flex-end;
    gap:8px;
}
.trust-tags span{
    padding:7px 11px;
    border:1px solid rgba(255,255,255,.065);
    border-radius:99px;
    background:rgba(255,255,255,.023);
    color:#8f94a6;
    font-size:.64rem;
    font-weight:600;
}

/* Section heading */
.section-heading{
    max-width:900px;
    margin-bottom:62px;
}
.section-heading.centered{
    margin-inline:auto;
    margin-bottom:66px;
    text-align:center;
}
.section-heading h2{
    margin:0 0 26px;
}
.section-heading p{
    max-width:760px;
    color:var(--muted);
    font-size:1.02rem;
}
.section-heading.centered p{margin-inline:auto}

/* Features */
.benefits{
    background:linear-gradient(180deg,rgba(12,10,27,.14),rgba(15,12,34,.48),rgba(9,8,23,0));
}
.feature-grid{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:18px;
}
.feature-card{
    position:relative;
    min-height:320px;
    overflow:hidden;
    padding:31px;
    border:1px solid var(--border);
    border-radius:26px;
    background:linear-gradient(155deg,rgba(255,255,255,.048),rgba(255,255,255,.021));
    transition:transform .28s ease,border-color .28s ease,background .28s ease;
}
.feature-card:hover{
    transform:translateY(-5px);
    border-color:rgba(143,128,255,.2);
    background:linear-gradient(155deg,rgba(255,255,255,.062),rgba(255,255,255,.025));
}
.feature-card:after{
    content:"";
    position:absolute;
    width:280px;
    height:280px;
    top:-180px;
    right:-120px;
    border-radius:50%;
    background:radial-gradient(circle,rgba(110,90,255,.11),transparent 68%);
    pointer-events:none;
}
.feature-card-large{
    grid-column:span 2;
    min-height:420px;
    display:grid;
    grid-template-columns:minmax(0,1.06fr) minmax(340px,.94fr);
    align-items:center;
    gap:46px;
    padding:38px;
    background:linear-gradient(145deg,rgba(84,66,192,.11),rgba(255,255,255,.022) 55%,rgba(60,196,229,.025));
}
.feature-icon{
    width:48px;
    height:48px;
    display:grid;
    place-items:center;
    margin-bottom:28px;
    border:1px solid rgba(151,137,255,.17);
    border-radius:15px;
    background:linear-gradient(145deg,rgba(109,93,255,.1),rgba(255,255,255,.025));
    color:#b7b1ff;
}
.feature-icon.cyan{color:#8ceafb}
.feature-icon.blue{color:#9da7ff}
.feature-icon.purple{color:#c4abff}
.feature-icon svg{width:22px;height:22px}
.card-kicker{
    color:#777d96;
    font-size:.64rem;
    font-weight:700;
    letter-spacing:.14em;
}
.feature-card h3{
    max-width:520px;
    margin:11px 0 15px;
    font-size:1.46rem;
    line-height:1.18;
}
.feature-card p{
    max-width:620px;
    margin:0;
    color:#9297a9;
    font-size:.88rem;
}
.knowledge-visual{
    position:relative;
    min-height:300px;
    display:flex;
    align-items:center;
    justify-content:center;
}
.knowledge-core{
    position:relative;
    z-index:3;
    width:142px;
    height:142px;
    display:grid;
    place-items:center;
    border:1px solid rgba(132,120,255,.2);
    border-radius:50%;
    background:radial-gradient(circle,rgba(100,84,255,.18),rgba(95,77,223,.035) 52%,transparent 72%);
    box-shadow:0 0 58px rgba(91,74,230,.16);
}
.knowledge-core svg{width:52px;height:52px}
.knowledge-ring{
    position:absolute;
    border:1px solid rgba(133,119,255,.13);
    border-radius:50%;
}
.ring-one{width:220px;height:220px}
.ring-two{width:285px;height:285px;border-color:rgba(121,232,255,.06)}
.knowledge-chip{
    position:absolute;
    z-index:4;
    padding:9px 12px;
    border:1px solid rgba(255,255,255,.075);
    border-radius:11px;
    background:rgba(16,14,36,.9);
    color:#999eb2;
    font-size:.66rem;
    box-shadow:0 12px 30px rgba(0,0,0,.18);
}
.chip-a{left:1%;top:34px}
.chip-b{right:2%;top:54px}
.chip-c{left:6%;bottom:48px}
.chip-d{right:0;bottom:40px}

/* Integrations */
.integration-section{
    overflow:hidden;
    background:linear-gradient(180deg,rgba(8,7,18,0),rgba(17,13,42,.54),rgba(8,7,18,0));
}
.integration-glow{
    position:absolute;
    width:900px;
    height:650px;
    left:67%;
    top:52%;
    transform:translate(-50%,-50%);
    border-radius:50%;
    background:radial-gradient(circle,rgba(97,69,255,.16),rgba(107,84,255,.05) 42%,transparent 72%);
    filter:blur(15px);
    pointer-events:none;
}
.integration-layout{
    position:relative;
    display:grid;
    grid-template-columns:minmax(0,.86fr) minmax(650px,1.14fr);
    align-items:center;
    gap:100px;
}
.integration-copy{
    max-width:740px;
}
.integration-copy h2{
    margin:18px 0 25px;
}
.integration-copy>p{
    max-width:670px;
    color:#a0a5b7;
}
.integration-list{
    margin-top:42px;
}
.integration-list-item{
    display:grid;
    grid-template-columns:46px 1fr;
    gap:20px;
    padding:23px 0;
    border-top:1px solid rgba(255,255,255,.07);
}
.integration-list-item:last-child{border-bottom:1px solid rgba(255,255,255,.07)}
.list-number{
    padding-top:3px;
    color:#6e7487;
    font-size:.65rem;
}
.integration-list-item strong{
    font-size:.96rem;
}
.integration-list-item p{
    max-width:610px;
    margin:6px 0 0;
    color:#858a9d;
    font-size:.82rem;
    line-height:1.68;
}
.integration-stage{
    position:relative;
    width:100%;
    min-height:620px;
}
.stage-halo{
    position:absolute;
    left:50%;
    top:50%;
    width:460px;
    height:460px;
    transform:translate(-50%,-50%);
    border-radius:50%;
    background:radial-gradient(circle,rgba(105,82,255,.18),rgba(93,70,235,.07) 45%,transparent 71%);
}
.stage-core{
    position:absolute;
    z-index:3;
    left:50%;
    top:50%;
    width:205px;
    height:205px;
    transform:translate(-50%,-50%);
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    border:1px solid rgba(139,126,255,.2);
    border-radius:50%;
    background:radial-gradient(circle at 50% 42%,rgba(104,89,255,.24),rgba(29,22,74,.89) 46%,rgba(13,12,31,.96) 72%);
    box-shadow:0 0 95px rgba(85,62,232,.22),inset 0 0 34px rgba(117,94,255,.07);
}
.stage-logo{
    width:56px;
    height:56px;
    display:grid;
    place-items:center;
    margin-bottom:13px;
    border:1px solid rgba(255,255,255,.085);
    border-radius:18px;
    background:rgba(255,255,255,.045);
}
.stage-logo svg{width:46px;height:46px}
.stage-core strong{
    font-family:Manrope;
    font-size:1.05rem;
}
.stage-core small{
    margin-top:4px;
    color:#74798b;
    font-size:.65rem;
}
.integration-lines{
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    z-index:1;
}
.integration-node{
    position:absolute;
    z-index:2;
    width:220px;
    display:flex;
    align-items:center;
    gap:13px;
    padding:15px;
    border:1px solid rgba(255,255,255,.085);
    border-radius:18px;
    background:linear-gradient(145deg,rgba(22,19,49,.92),rgba(14,12,32,.9));
    box-shadow:0 18px 48px rgba(0,0,0,.22);
    backdrop-filter:blur(14px);
}
.node-a{left:1%;top:12%}
.node-b{right:0;top:17%}
.node-c{left:0;bottom:14%}
.node-d{right:2%;bottom:11%}
.node-icon{
    width:42px;
    height:42px;
    flex:0 0 42px;
    display:grid;
    place-items:center;
    border:1px solid rgba(128,112,255,.15);
    border-radius:13px;
    background:rgba(104,88,255,.09);
    color:#b2adff;
}
.node-icon svg{width:21px;height:21px}
.integration-node strong{
    display:block;
    font-size:.76rem;
}
.integration-node small{
    display:block;
    margin-top:3px;
    color:#73798b;
    font-size:.62rem;
}

/* Process */
.process-section{padding-top:118px}
.process-grid{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:18px;
}
.process-card{
    position:relative;
    min-height:340px;
    overflow:hidden;
    padding:32px;
    border:1px solid var(--border);
    border-radius:26px;
    background:linear-gradient(150deg,rgba(255,255,255,.046),rgba(255,255,255,.018));
}
.process-card:before{
    content:"";
    position:absolute;
    right:-130px;
    bottom:-160px;
    width:250px;
    height:250px;
    border-radius:50%;
    background:radial-gradient(circle,rgba(103,83,255,.11),transparent 70%);
}
.process-top{
    display:flex;
    align-items:center;
    justify-content:space-between;
    margin-bottom:68px;
}
.process-number{
    color:#5f6578;
    font-size:.66rem;
}
.process-icon{
    width:54px;
    height:54px;
    display:grid;
    place-items:center;
    border:1px solid rgba(128,111,255,.16);
    border-radius:17px;
    background:rgba(103,84,255,.075);
    color:#b8b2ff;
}
.process-icon svg{width:23px;height:23px}
.process-card h3{
    margin-bottom:11px;
    font-size:1.55rem;
}
.process-card p{
    max-width:500px;
    margin:0;
    color:#8e93a6;
    font-size:.87rem;
}

/* Use cases */
.usecases{
    background:linear-gradient(180deg,transparent,rgba(20,15,50,.42),transparent);
}
.usecase-tabs{
    width:max-content;
    max-width:100%;
    margin:0 auto 20px;
    display:flex;
    gap:5px;
    overflow:auto;
    padding:5px;
    border:1px solid rgba(255,255,255,.07);
    border-radius:15px;
    background:rgba(255,255,255,.03);
}
.usecase-tab{
    white-space:nowrap;
    padding:11px 16px;
    border:0;
    border-radius:11px;
    background:transparent;
    color:#858a9c;
    font-size:.76rem;
    font-weight:600;
    cursor:pointer;
}
.usecase-tab.active{
    background:rgba(255,255,255,.085);
    color:#fff;
    box-shadow:inset 0 1px rgba(255,255,255,.06);
}
.usecase-panel{
    min-height:520px;
    display:grid;
    grid-template-columns:1fr 1fr;
    overflow:hidden;
    border:1px solid rgba(255,255,255,.085);
    border-radius:30px;
    background:linear-gradient(140deg,rgba(255,255,255,.045),rgba(42,29,92,.07));
}
.usecase-copy{
    display:flex;
    flex-direction:column;
    justify-content:center;
    padding:68px;
}
.usecase-copy h3{
    max-width:680px;
    margin:16px 0 20px;
    font-size:2.45rem;
    line-height:1.08;
}
.usecase-copy>p{
    max-width:640px;
    color:#969bad;
}
.usecase-checks{
    display:flex;
    flex-wrap:wrap;
    gap:9px;
    margin-top:28px;
}
.usecase-checks span{
    position:relative;
    padding:8px 11px 8px 28px;
    border:1px solid rgba(255,255,255,.075);
    border-radius:10px;
    background:rgba(255,255,255,.03);
    color:#c1c4d1;
    font-size:.7rem;
}
.usecase-checks span:before{
    content:"";
    position:absolute;
    left:10px;
    top:50%;
    width:7px;
    height:4px;
    transform:translateY(-60%) rotate(-45deg);
    border-left:1.5px solid #9f98ff;
    border-bottom:1.5px solid #9f98ff;
}
.usecase-demo{
    position:relative;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:48px;
    background:radial-gradient(circle at 50% 47%,rgba(94,74,242,.16),transparent 60%);
}
.mini-chat{
    width:min(100%,450px);
    overflow:hidden;
    border:1px solid rgba(255,255,255,.095);
    border-radius:24px;
    background:rgba(15,13,34,.88);
    box-shadow:0 30px 80px rgba(0,0,0,.32);
}
.mini-chat-head{
    display:flex;
    align-items:center;
    gap:10px;
    padding:16px 18px;
    border-bottom:1px solid rgba(255,255,255,.065);
}
.mini-chat-avatar{
    width:34px;
    height:34px;
    display:grid;
    place-items:center;
    border:1px solid rgba(255,255,255,.08);
    border-radius:11px;
    background:rgba(255,255,255,.035);
}
.mini-chat-avatar svg{width:29px;height:29px}
.mini-chat-head strong{
    display:block;
    font-size:.77rem;
}
.mini-chat-head small{
    display:flex;
    align-items:center;
    gap:5px;
    color:#6d7285;
    font-size:.59rem;
}
.mini-chat-body{padding:22px 18px}
.message.small{font-size:.73rem}
.mini-action{
    margin-top:20px;
    padding:14px;
    border:1px solid rgba(128,111,255,.14);
    border-radius:14px;
    background:rgba(103,86,255,.07);
}
.mini-action span{
    display:block;
    margin-bottom:6px;
    color:#73788c;
    font-size:.58rem;
    letter-spacing:.08em;
}
.mini-action strong{
    display:flex;
    align-items:center;
    justify-content:space-between;
    font-size:.73rem;
}


/* Pricing */
.pricing-section{
    overflow:hidden;
    background:linear-gradient(180deg,transparent,rgba(18,14,42,.46),transparent);
}
.pricing-glow{
    position:absolute;
    width:900px;
    height:620px;
    right:-250px;
    top:50%;
    transform:translateY(-50%);
    border-radius:50%;
    background:radial-gradient(circle,rgba(104,79,255,.15),rgba(86,65,220,.045) 45%,transparent 72%);
    filter:blur(18px);
    pointer-events:none;
}
.pricing-layout{
    position:relative;
    display:grid;
    grid-template-columns:minmax(0,1fr) minmax(500px,.72fr);
    gap:110px;
    align-items:center;
}
.pricing-heading{
    max-width:820px;
    margin-bottom:0;
}
.pricing-heading h2{
    margin:0 0 28px;
}
.pricing-heading p{
    max-width:720px;
}
.pricing-card{
    position:relative;
    overflow:hidden;
    padding:38px;
    border:1px solid rgba(255,255,255,.11);
    border-radius:30px;
    background:
        radial-gradient(circle at 100% 0%,rgba(111,86,255,.14),transparent 38%),
        linear-gradient(145deg,rgba(255,255,255,.055),rgba(255,255,255,.022));
    box-shadow:0 32px 85px rgba(0,0,0,.25);
}
.pricing-card-top{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:20px;
}
.pricing-name{
    display:block;
    margin-bottom:6px;
    font-family:Manrope,Inter,sans-serif;
    font-size:1.25rem;
    font-weight:700;
}
.pricing-card-top p{
    margin:0;
    color:#83889a;
    font-size:.8rem;
}
.pricing-badge{
    padding:7px 9px;
    border:1px solid rgba(139,126,255,.18);
    border-radius:9px;
    background:rgba(107,89,255,.075);
    color:#bdb7ff;
    font-size:.58rem;
    font-weight:800;
    letter-spacing:.11em;
}
.price-row{
    display:flex;
    align-items:flex-end;
    gap:10px;
    margin:34px 0 24px;
}
.price{
    font-family:Manrope,Inter,sans-serif;
    font-size:clamp(3.4rem,5vw,5.2rem);
    line-height:.9;
    font-weight:600;
    letter-spacing:-.06em;
}
.price-period{
    padding-bottom:7px;
    color:#17192A;
    font-size:.83rem;
}
.setup-price{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:18px;
    padding:15px 16px;
    border:1px solid rgba(255,255,255,.075);
    border-radius:14px;
    background:rgba(255,255,255,.028);
    font-size:.8rem;
}
.setup-price span{color:#8d92a4}
.setup-price strong{font-size:.85rem}
.pricing-divider{
    height:1px;
    margin:28px 0;
    background:rgba(255,255,255,.075);
}
.pricing-features{
    display:grid;
    gap:15px;
    margin:0;
    padding:0;
    list-style:none;
}
.pricing-features li{
    display:grid;
    grid-template-columns:24px 1fr;
    gap:11px;
    align-items:start;
    color:#c1c4d0;
    font-size:.83rem;
    line-height:1.6;
}
.pricing-check{
    width:22px;
    height:22px;
    display:grid;
    place-items:center;
    margin-top:1px;
    border:1px solid rgba(142,125,255,.16);
    border-radius:7px;
    background:rgba(102,85,255,.07);
    color:#aaa4ff;
}
.pricing-check svg{width:14px;height:14px}
.pricing-note{
    margin:25px 0 0;
    color:#73788a;
    font-size:.72rem;
    line-height:1.65;
}
.pricing-cta{
    width:100%;
    margin-top:25px;
}

/* CTA */
.cta-card{
    position:relative;
    min-height:510px;
    overflow:hidden;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    padding:76px 34px;
    border:1px solid rgba(255,255,255,.1);
    border-radius:34px;
    background:
        radial-gradient(circle at 50% 100%,rgba(108,77,255,.22),transparent 47%),
        linear-gradient(145deg,rgba(41,28,93,.39),rgba(13,12,31,.84));
    text-align:center;
    box-shadow:inset 0 1px rgba(255,255,255,.045);
}
.cta-glow{
    position:absolute;
    top:-180px;
    left:50%;
    width:660px;
    height:290px;
    transform:translateX(-50%);
    background:radial-gradient(ellipse,rgba(138,103,255,.33),transparent 68%);
    filter:blur(12px);
}
.cta-card h2{
    max-width:980px;
    margin:20px 0 23px;
}
.cta-card p{
    max-width:750px;
    margin-bottom:31px;
    color:#9ea3b5;
}
.cta-actions{
    display:flex;
    flex-wrap:wrap;
    justify-content:center;
    gap:10px;
}

/* FAQ */
.faq-section{
    padding-top:120px;
    padding-bottom:130px;
}
.faq-layout{
    display:grid;
    grid-template-columns:minmax(0,.78fr) minmax(650px,1.22fr);
    align-items:start;
    gap:110px;
}
.faq-heading{
    position:sticky;
    top:120px;
    margin-bottom:0;
}
.faq-heading h2{
    max-width:600px;
}
.faq-heading p{
    max-width:500px;
}
.faq-list{
    border-top:1px solid rgba(255,255,255,.075);
}
.faq-item{
    border-bottom:1px solid rgba(255,255,255,.075);
}
.faq-item summary{
    list-style:none;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:28px;
    min-height:82px;
    padding:20px 0;
    cursor:pointer;
}
.faq-item summary::-webkit-details-marker{display:none}
.faq-question{
    font-size:.96rem;
    font-weight:600;
}
.faq-toggle{
    width:34px;
    height:34px;
    flex:0 0 34px;
    display:grid;
    place-items:center;
    border:1px solid rgba(255,255,255,.11);
    border-radius:9px;
    background:rgba(255,255,255,.018);
    color:#a6aabb;
    transition:background .22s ease,border-color .22s ease,color .22s ease;
}
.faq-toggle svg{
    width:18px;
    height:18px;
}
.faq-item:hover .faq-toggle{
    border-color:rgba(151,137,255,.22);
    background:rgba(113,96,255,.055);
    color:#d2ceff;
}
.faq-plus-v{
    transform-origin:10px 10px;
    transition:transform .22s ease,opacity .22s ease;
}
.faq-item[open] .faq-plus-v{
    transform:rotate(90deg);
    opacity:0;
}
.faq-item[open] .faq-toggle{
    border-color:rgba(151,137,255,.22);
    background:rgba(113,96,255,.07);
    color:#d5d1ff;
}
.faq-answer{
    overflow:hidden;
}
.faq-answer p{
    max-width:760px;
    margin:0;
    padding:0 54px 26px 0;
    color:#9095a8;
    font-size:.87rem;
}

/* Footer */
.site-footer{
    position:relative;
    overflow:hidden;
    padding:112px 0 30px;
    border-top:1px solid rgba(255,255,255,.065);
    background:linear-gradient(180deg,#080711,#070610);
}
.footer-glow{
    position:absolute;
    border-radius:50%;
    pointer-events:none;
}
.footer-glow-one{
    width:760px;
    height:460px;
    left:-290px;
    bottom:-230px;
    background:radial-gradient(circle,rgba(76,58,214,.16),transparent 70%);
}
.footer-glow-two{
    width:760px;
    height:460px;
    right:-310px;
    top:-230px;
    background:radial-gradient(circle,rgba(129,79,255,.095),transparent 70%);
}
.footer-top{
    position:relative;
    z-index:2;
    display:grid;
    grid-template-columns:1.5fr .5fr;
    gap:130px;
}
.footer-brand{margin-bottom:30px}
.footer-main h2{
    max-width:930px;
    margin:0 0 23px;
    font-size:clamp(2.5rem,4vw,4.7rem);
}
.footer-main p{
    max-width:760px;
    color:#8f94a6;
}
.footer-cta-row{
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:26px;
    margin-top:32px;
}
.footer-links{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:38px;
    padding-top:8px;
}
.footer-links div{
    display:flex;
    flex-direction:column;
    gap:14px;
}
.footer-links a{
    color:#8d92a4;
    font-size:.8rem;
}
.footer-links a:hover{color:#fff}
.footer-label{
    margin-bottom:6px!important;
    color:#d0d3df!important;
    font-size:.65rem!important;
    font-weight:700;
    letter-spacing:.13em;
}
.footer-bottom{
    display:flex;
    justify-content:space-between;
    gap:20px;
    margin-top:84px;
    padding-top:21px;
    border-top:1px solid rgba(255,255,255,.065);
    color:#555a6d;
    font-size:.65rem;
}
.footer-bottom p{margin:0}

/* Reveal */
.reveal{
    opacity:0;
    transform:translateY(18px);
    transition:opacity .7s cubic-bezier(.22,.61,.36,1),transform .7s cubic-bezier(.22,.61,.36,1);
}
.reveal.visible{
    opacity:1;
    transform:none;
}
.delay-1{transition-delay:.08s}
.delay-2{transition-delay:.16s}
.delay-3{transition-delay:.24s}
.delay-4{transition-delay:.32s}

/* Responsive */
@media (max-width:1450px){
    .container{width:min(calc(100% - 52px),var(--container))}
    .hero-inner{grid-template-columns:minmax(0,1fr) minmax(480px,.9fr);gap:70px}
    .integration-layout{grid-template-columns:minmax(0,.88fr) minmax(590px,1.12fr);gap:70px}
    .faq-layout{grid-template-columns:minmax(0,.8fr) minmax(580px,1.2fr);gap:70px}
}
@media (max-width:1180px){
    .desktop-nav{display:none}
    .hero{padding-top:150px}
    .hero-inner{grid-template-columns:1fr;gap:32px}
    .hero-copy{
        max-width:980px;
        margin-inline:auto;
        text-align:center;
    }
        .hero-lead{margin-inline:auto}
    .hero-actions,.hero-points{justify-content:center}
    .hero-product{min-height:640px}
    .trust-row{margin-top:50px}
    .feature-grid{grid-template-columns:1fr 1fr}
    .feature-card-large{grid-column:span 2}
    .integration-layout{grid-template-columns:1fr;gap:42px}
    .integration-copy{max-width:850px}
    .integration-stage{max-width:860px;margin-inline:auto}
    .pricing-layout{grid-template-columns:1fr;gap:48px}
    .pricing-card{max-width:720px;width:100%}
    .faq-layout{grid-template-columns:1fr;gap:34px}
    .faq-heading{position:static}
    .faq-heading p{max-width:700px}
    .footer-top{grid-template-columns:1fr;gap:62px}
    .footer-links{max-width:480px}
}
@media (max-width:820px){
    .container{width:min(calc(100% - 30px),var(--container))}
    .section{padding:94px 0}
    .desktop-cta{display:none}
    .menu-toggle{display:flex}
    .menu-toggle.active span:first-child{transform:translateY(3.75px) rotate(45deg)}
    .menu-toggle.active span:last-child{transform:translateY(-3.75px) rotate(-45deg)}
    .mobile-menu{
        display:block;
        position:absolute;
        top:70px;
        left:15px;
        right:15px;
        opacity:0;
        visibility:hidden;
        transform:translateY(-8px);
        border:1px solid rgba(255,255,255,.095);
        border-radius:20px;
        background:rgba(13,11,30,.97);
        box-shadow:0 25px 70px rgba(0,0,0,.4);
        backdrop-filter:blur(22px);
        transition:.25s ease;
    }
    .mobile-menu.open{
        opacity:1;
        visibility:visible;
        transform:none;
    }
    .mobile-menu-inner{
        width:100%;
        display:flex;
        flex-direction:column;
        padding:12px;
    }
    .mobile-menu a{
        padding:13px 11px;
        color:#c4c7d5;
        font-size:.9rem;
    }
    .mobile-menu-actions{
        display:grid;
        grid-template-columns:1fr 1fr;
        gap:8px;
        margin-top:8px;
        padding-top:12px;
        border-top:1px solid rgba(255,255,255,.065);
    }
    .mobile-menu-actions a{padding:0 10px}
    .hero{
        min-height:auto;
        padding:132px 0 38px;
    }
    .hero-title{font-size:clamp(3rem,12.5vw,5rem)}
    .hero-lead{font-size:.96rem}
    .hero-product{min-height:560px}
    .chat-window{width:min(100%,470px)}
    .floating-card-one{left:-4px;top:128px}
    .floating-card-two{right:-4px;bottom:90px}
    .trust-row{
        align-items:flex-start;
        flex-direction:column;
    }
    .trust-tags{justify-content:flex-start}
    .feature-grid{grid-template-columns:1fr}
    .feature-card-large{
        grid-column:auto;
        grid-template-columns:1fr;
        min-height:auto;
    }
    .knowledge-visual{min-height:280px}
    .process-grid{grid-template-columns:1fr}
    .usecase-panel{grid-template-columns:1fr}
    .usecase-copy{padding:42px}
    .pricing-card{padding:32px}
    .usecase-demo{padding:36px 26px}
    .integration-stage{min-height:560px}
    .integration-node{width:190px}
    .footer-bottom{flex-direction:column}
}
@media (max-width:560px){
    .hero-title{font-size:clamp(2.75rem,14vw,4rem)}
    h2{font-size:clamp(2.3rem,10.5vw,3.5rem)}
    .hero-points{
        display:grid;
        gap:11px;
        text-align:left;
    }
    .hero-product{min-height:520px}
    .floating-card{display:none}
    .chat-body{min-height:380px}
    .time-options{flex-wrap:wrap}
    .feature-card,.process-card{padding:24px}
    .feature-card-large{padding-bottom:16px}
    .knowledge-ring.ring-two{width:245px;height:245px}
    .integration-stage{min-height:590px}
    .stage-core{width:160px;height:160px}
    .integration-node{width:156px;padding:11px}
    .node-a{left:0;top:8%}
    .node-b{right:0;top:18%}
    .node-c{left:0;bottom:18%}
    .node-d{right:0;bottom:8%}
    .integration-lines{display:none}
    .usecase-tabs{
        justify-content:flex-start;
        margin-inline:0;
    }
    .usecase-copy{padding:30px 23px}
    .usecase-copy h3{font-size:1.8rem}
    .pricing-card{padding:26px 22px}
    .price-row{margin-top:28px}
    .setup-price{align-items:flex-start;flex-direction:column;gap:5px}
    .cta-card{
        min-height:440px;
        padding:58px 21px;
    }
    .faq-item summary{
        min-height:76px;
        gap:16px;
    }
    .faq-question{font-size:.9rem}
    .faq-answer p{padding-right:0}
    .footer-links{grid-template-columns:1fr 1fr}
}
@media (prefers-reduced-motion:reduce){
    html{scroll-behavior:auto}
    *,*:before,*:after{
        animation-duration:.01ms!important;
        animation-iteration-count:1!important;
        transition-duration:.01ms!important;
    }
    .reveal{
        opacity:1;
        transform:none;
    }
}


/* Helmi AI benefits — clean single implementation */
.hai-benefits{
    position:relative;
    padding:126px 0 132px;
    background:
        radial-gradient(circle at 12% 34%,rgba(84,61,219,.075),transparent 32rem),
        linear-gradient(180deg,rgba(12,10,27,.08),rgba(14,11,33,.32),rgba(9,8,23,0));
}
.hai-benefits-head{
    display:grid;
    grid-template-columns:minmax(0,1fr) minmax(420px,.72fr);
    align-items:end;
    gap:90px;
    margin-bottom:52px;
}
.hai-benefits-head h2{
    max-width:900px;
    margin:0;
    font-size:clamp(2.7rem,4.7vw,5.2rem);
    line-height:.99;
    letter-spacing:-.055em;
    font-weight:600;
}
.hai-benefits-head p{
    max-width:650px;
    margin:0 0 6px;
    color:#9ca1b4;
    font-size:.98rem;
    line-height:1.8;
}
.hai-benefits-main{
    overflow:hidden;
    border:1px solid rgba(255,255,255,.085);
    border-radius:30px;
    background:linear-gradient(150deg,rgba(255,255,255,.043),rgba(255,255,255,.016));
}
.hai-knowledge{
    display:grid;
    grid-template-columns:minmax(350px,.72fr) minmax(620px,1.28fr);
    align-items:center;
    gap:64px;
    padding:42px 46px;
    border-bottom:1px solid rgba(255,255,255,.075);
}
.hai-knowledge-copy{
    max-width:560px;
}
.hai-kicker{
    display:block;
    margin-bottom:14px;
    color:#7f8499;
    font-size:.64rem;
    font-weight:700;
    letter-spacing:.14em;
}
.hai-knowledge-copy h3{
    margin:0 0 15px;
    font-size:clamp(1.7rem,2.25vw,2.45rem);
    line-height:1.09;
}
.hai-knowledge-copy p{
    max-width:550px;
    margin:0;
    color:#9297a9;
    font-size:.86rem;
    line-height:1.75;
}
.hai-knowledge-visual{
    display:grid;
    grid-template-columns:180px minmax(0,1fr);
    gap:24px;
    align-items:center;
}
.hai-source-grid{
    display:grid;
    gap:9px;
}
.hai-source{
    min-height:43px;
    display:flex;
    align-items:center;
    gap:10px;
    padding:0 13px;
    border:1px solid rgba(255,255,255,.075);
    border-radius:12px;
    background:rgba(13,12,31,.68);
    color:#a7acbd;
    font-size:.68rem;
}
.hai-source svg{
    width:17px;
    height:17px;
    flex:0 0 17px;
    color:#aaa4ff;
}
.hai-chat-example{
    width:100%;
    max-width:480px;
    justify-self:end;
    padding:17px;
    border:1px solid rgba(255,255,255,.085);
    border-radius:21px;
    background:linear-gradient(160deg,rgba(25,22,53,.92),rgba(13,12,31,.92));
    box-shadow:0 24px 60px rgba(0,0,0,.2);
}
.hai-chat-head{
    display:flex;
    align-items:center;
    gap:10px;
    padding-bottom:14px;
    margin-bottom:16px;
    border-bottom:1px solid rgba(255,255,255,.06);
}
.hai-orb{
    width:32px;
    height:32px;
    flex:0 0 32px;
    border-radius:10px;
    border:1px solid rgba(255,255,255,.08);
    background:
        radial-gradient(circle at 48% 48%,#fff 0 9%,#b8b3ff 10% 20%,#7167ff 30% 45%,transparent 47%),
        rgba(108,91,255,.06);
}
.hai-chat-head strong{
    display:block;
    font-size:.72rem;
}
.hai-chat-head small{
    display:block;
    margin-top:2px;
    color:#74798c;
    font-size:.58rem;
}
.hai-msg{
    width:fit-content;
    max-width:88%;
    margin-bottom:10px;
    padding:10px 12px;
    border-radius:13px;
    font-size:.68rem;
    line-height:1.55;
}
.hai-msg-user{
    margin-left:auto;
    border-bottom-right-radius:5px;
    background:linear-gradient(135deg,#665cf2,#7651df);
}
.hai-msg-ai{
    border:1px solid rgba(255,255,255,.065);
    border-bottom-left-radius:5px;
    background:rgba(255,255,255,.045);
    color:#d7d9e4;
}
.hai-chat-action{
    display:grid;
    grid-template-columns:34px 1fr 18px;
    gap:10px;
    align-items:center;
    margin-top:16px;
    padding:11px 12px;
    border:1px solid rgba(130,115,255,.15);
    border-radius:12px;
    background:rgba(105,88,255,.065);
}
.hai-chat-action>svg:first-child{
    width:18px;
    height:18px;
    color:#aaa4ff;
}
.hai-chat-action small{
    display:block;
    margin-bottom:3px;
    color:#747a8e;
    font-size:.52rem;
    font-weight:700;
    letter-spacing:.08em;
}
.hai-chat-action strong{
    display:block;
    font-size:.67rem;
}
.hai-arrow{
    width:17px;
    height:17px;
    color:#9c96ff;
}
.hai-benefit-list{
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
}
.hai-benefit-list article{
    min-width:0;
    padding:29px 28px 31px;
    border-right:1px solid rgba(255,255,255,.075);
}
.hai-benefit-list article:last-child{
    border-right:0;
}
.hai-benefit-icon{
    width:42px;
    height:42px;
    display:grid;
    place-items:center;
    margin-bottom:19px;
    border:1px solid rgba(139,126,255,.15);
    border-radius:13px;
    background:linear-gradient(145deg,rgba(111,93,255,.085),rgba(255,255,255,.018));
    color:#b0aaff;
}
.hai-benefit-icon svg{
    width:20px;
    height:20px;
}
.hai-benefit-list h3{
    max-width:320px;
    margin:0 0 10px;
    font-size:1.01rem;
    line-height:1.32;
}
.hai-benefit-list p{
    max-width:330px;
    margin:0;
    color:#8e93a6;
    font-size:.78rem;
    line-height:1.7;
}
.hai-benefits-bottom{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:36px;
    margin-top:20px;
    padding:21px 25px;
    border:1px solid rgba(255,255,255,.07);
    border-radius:17px;
    background:rgba(255,255,255,.022);
}
.hai-benefits-bottom>div{
    display:flex;
    align-items:baseline;
    flex-wrap:wrap;
    gap:7px 13px;
}
.hai-benefits-bottom strong{
    font-size:.82rem;
}
.hai-benefits-bottom p{
    margin:0;
    color:#858a9d;
    font-size:.75rem;
}
.hai-benefits-bottom .text-link{
    flex:0 0 auto;
    color:#aaa5ff;
    font-size:.76rem;
}

@media (max-width:1250px){
    .hai-benefits-head{
        grid-template-columns:1fr;
        gap:20px;
    }
    .hai-benefits-head p{
        max-width:820px;
    }
    .hai-knowledge{
        grid-template-columns:1fr;
        gap:32px;
    }
    .hai-knowledge-copy{
        max-width:760px;
    }
    .hai-knowledge-visual{
        grid-template-columns:180px minmax(0,1fr);
    }
    .hai-chat-example{
        max-width:none;
    }
    .hai-benefit-list{
        grid-template-columns:1fr 1fr;
    }
    .hai-benefit-list article{
        border-bottom:1px solid rgba(255,255,255,.075);
    }
    .hai-benefit-list article:nth-child(2n){
        border-right:0;
    }
    .hai-benefit-list article:nth-last-child(-n+2){
        border-bottom:0;
    }
}
@media (max-width:760px){
    .hai-benefits{
        padding:92px 0 96px;
    }
    .hai-benefits-head{
        margin-bottom:36px;
    }
    .hai-knowledge{
        padding:27px 22px;
    }
    .hai-knowledge-visual{
        grid-template-columns:1fr;
    }
    .hai-source-grid{
        grid-template-columns:1fr 1fr;
    }
    .hai-benefit-list{
        grid-template-columns:1fr;
    }
    .hai-benefit-list article,
    .hai-benefit-list article:nth-child(2n),
    .hai-benefit-list article:nth-last-child(-n+2){
        padding:25px 22px;
        border-right:0;
        border-bottom:1px solid rgba(255,255,255,.075);
    }
    .hai-benefit-list article:last-child{
        border-bottom:0;
    }
    .hai-benefits-bottom{
        align-items:flex-start;
        flex-direction:column;
    }
}
@media (max-width:480px){
    .hai-source-grid{
        grid-template-columns:1fr;
    }
}



/* Integrations v11 */
.hai-integrations{
    position:relative;
    overflow:hidden;
    padding:126px 0;
    background:
        radial-gradient(circle at 78% 50%,rgba(91,70,235,.11),transparent 34rem),
        linear-gradient(180deg,rgba(8,7,18,0),rgba(17,13,42,.42),rgba(8,7,18,0));
}
.hai-integrations-layout{
    display:grid;
    grid-template-columns:minmax(0,1.18fr) minmax(480px,.82fr);
    gap:84px;
    align-items:center;
}
.hai-integrations-copy{
    max-width:980px;
}
.hai-integrations-copy h2{
    max-width:940px;
    margin:0 0 28px;
    font-size:clamp(2.8rem,4.9vw,5.4rem);
    line-height:.98;
    letter-spacing:-.058em;
    font-weight:600;
}
.hai-integrations-lead{
    max-width:900px;
    margin:0;
    color:#9fa4b7;
    font-size:1rem;
    line-height:1.82;
}
.hai-integration-points{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:0;
    margin-top:46px;
    border-top:1px solid rgba(255,255,255,.075);
    border-bottom:1px solid rgba(255,255,255,.075);
}
.hai-integration-points article{
    display:grid;
    grid-template-columns:34px 1fr;
    gap:14px;
    min-width:0;
    padding:25px 22px 27px 0;
    border-right:1px solid rgba(255,255,255,.075);
}
.hai-integration-points article:not(:first-child){
    padding-left:22px;
}
.hai-integration-points article:last-child{
    border-right:0;
    padding-right:0;
}
.hai-integration-number{
    padding-top:2px;
    color:#676d80;
    font-size:.61rem;
}
.hai-integration-points h3{
    margin:0 0 8px;
    font-size:.96rem;
}
.hai-integration-points p{
    margin:0;
    color:#858a9d;
    font-size:.76rem;
    line-height:1.7;
}
.hai-integration-visual{
    width:100%;
    max-width:600px;
    justify-self:end;
}
.hai-integration-card{
    overflow:hidden;
    border:1px solid rgba(255,255,255,.09);
    border-radius:26px;
    background:linear-gradient(155deg,rgba(27,23,58,.86),rgba(13,12,31,.94));
    box-shadow:0 30px 90px rgba(0,0,0,.26);
}
.hai-integration-card-head{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:18px;
    padding:17px 19px;
    border-bottom:1px solid rgba(255,255,255,.065);
}
.hai-integration-brand{
    display:flex;
    align-items:center;
    gap:10px;
}
.hai-integration-orb{
    width:32px;
    height:32px;
    border-radius:10px;
    border:1px solid rgba(255,255,255,.08);
    background:
        radial-gradient(circle at 46% 43%,#fff 0 8%,#bebaff 9% 19%,#756bff 30% 47%,transparent 49%),
        rgba(107,91,255,.07);
}
.hai-integration-brand strong{
    display:block;
    font-size:.72rem;
}
.hai-integration-brand small{
    display:block;
    margin-top:2px;
    color:#73788b;
    font-size:.57rem;
}
.hai-live{
    padding:6px 8px;
    border:1px solid rgba(130,115,255,.14);
    border-radius:8px;
    background:rgba(105,88,255,.055);
    color:#aaa4ff;
    font-size:.52rem;
    font-weight:700;
    letter-spacing:.08em;
}
.hai-integration-map{
    position:relative;
    min-height:365px;
}
.hai-map-lines{
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
}
.hai-map-center{
    position:absolute;
    z-index:3;
    left:50%;
    top:50%;
    width:118px;
    height:118px;
    transform:translate(-50%,-50%);
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:8px;
    border:1px solid rgba(139,126,255,.18);
    border-radius:50%;
    background:radial-gradient(circle,rgba(102,85,255,.22),rgba(18,15,43,.95) 66%);
    box-shadow:0 0 55px rgba(86,66,232,.2);
}
.hai-map-orb{
    width:26px;
    height:26px;
    border-radius:9px;
    background:radial-gradient(circle at 35% 30%,#fff,#aaa4ff 26%,#675cf2 58%,#33238f);
    box-shadow:0 0 18px rgba(105,91,255,.45);
}
.hai-map-center strong{
    font-size:.74rem;
}
.hai-map-item{
    position:absolute;
    z-index:2;
    width:172px;
    display:flex;
    align-items:center;
    gap:10px;
    padding:11px 12px;
    border:1px solid rgba(255,255,255,.075);
    border-radius:14px;
    background:rgba(17,15,38,.9);
}
.hai-map-booking{left:18px;top:34px}
.hai-map-table{right:18px;top:52px}
.hai-map-api{left:18px;bottom:42px}
.hai-map-auto{right:18px;bottom:32px}
.hai-map-icon{
    width:34px;
    height:34px;
    flex:0 0 34px;
    display:grid;
    place-items:center;
    border:1px solid rgba(131,115,255,.14);
    border-radius:10px;
    background:rgba(104,88,255,.07);
    color:#b1abff;
}
.hai-map-icon svg{width:17px;height:17px}
.hai-map-item strong{
    display:block;
    font-size:.65rem;
}
.hai-map-item small{
    display:block;
    margin-top:2px;
    color:#70758a;
    font-size:.54rem;
}
.hai-integration-example{
    display:grid;
    grid-template-columns:72px 1fr;
    gap:12px;
    padding:15px 19px 17px;
    border-top:1px solid rgba(255,255,255,.065);
    background:rgba(255,255,255,.018);
}
.hai-integration-example span{
    color:#686e82;
    font-size:.52rem;
    font-weight:700;
    letter-spacing:.09em;
}
.hai-integration-example p{
    margin:0;
    color:#969bad;
    font-size:.67rem;
    line-height:1.55;
}

/* Dynamic use-case demo v11 */
.usecase-demo{
    overflow:hidden;
}
.mini-chat{
    transition:transform .24s ease,opacity .24s ease;
}
.usecase-tab{
    transition:background .2s ease,color .2s ease,box-shadow .2s ease;
}
#usecase-user-message,
#usecase-ai-message,
#usecase-action-label,
#usecase-action-text{
    transition:opacity .18s ease;
}

@media (max-width:1320px){
    .hai-integrations-layout{
        grid-template-columns:minmax(0,1fr) minmax(430px,.72fr);
        gap:52px;
    }
    .hai-integration-points{
        grid-template-columns:1fr;
    }
    .hai-integration-points article,
    .hai-integration-points article:not(:first-child){
        padding:20px 0;
        border-right:0;
        border-bottom:1px solid rgba(255,255,255,.07);
    }
    .hai-integration-points article:last-child{
        border-bottom:0;
    }
}
@media (max-width:980px){
    .hai-integrations-layout{
        grid-template-columns:1fr;
    }
    .hai-integrations-copy{
        max-width:900px;
    }
    .hai-integration-visual{
        max-width:650px;
        justify-self:start;
    }
}
@media (max-width:620px){
    .hai-integrations{
        padding:92px 0;
    }
    .hai-integration-map{
        min-height:430px;
    }
    .hai-map-center{
        width:105px;
        height:105px;
    }
    .hai-map-item{
        width:145px;
        padding:9px;
    }
    .hai-map-booking{left:10px;top:32px}
    .hai-map-table{right:10px;top:90px}
    .hai-map-api{left:10px;bottom:92px}
    .hai-map-auto{right:10px;bottom:32px}
    .hai-map-lines{display:none}
    .hai-integration-example{
        grid-template-columns:1fr;
        gap:5px;
    }
}



/* v12 — slightly lighter overall theme */
:root{
    --bg:#0d0c1d;
    --bg-soft:#121126;
    --surface:#17152d;
    --surface-2:#1b1835;
    --surface-3:#211d40;
    --border:rgba(255,255,255,.105);
    --muted:#a6abbd;
}

body{
    background:
        radial-gradient(circle at 16% 9%,rgba(90,72,235,.12),transparent 31rem),
        radial-gradient(circle at 88% 22%,rgba(76,131,255,.085),transparent 34rem),
        linear-gradient(180deg,#0e0d20 0%,#0c0b1b 48%,#100e24 100%);
}

.site-header{
    background:rgba(14,13,31,.72);
    border-bottom-color:rgba(255,255,255,.07);
}

.hero{
    background:
        radial-gradient(circle at 72% 36%,rgba(102,81,255,.18),transparent 30rem),
        radial-gradient(circle at 24% 10%,rgba(68,129,255,.08),transparent 26rem);
}

.hero::before{
    opacity:.78;
}

.glass-card,
.hero-chat,
.price-card,
.faq-item,
.cta-card{
    border-color:rgba(255,255,255,.105);
    background:linear-gradient(145deg,rgba(31,28,59,.82),rgba(18,17,39,.86));
}

.hai-benefits{
    background:
        radial-gradient(circle at 12% 34%,rgba(94,74,235,.12),transparent 34rem),
        linear-gradient(180deg,rgba(18,16,42,.14),rgba(22,18,50,.46),rgba(13,12,29,.12));
}

.hai-benefits-main{
    border-color:rgba(255,255,255,.105);
    background:linear-gradient(145deg,rgba(34,30,65,.64),rgba(20,18,43,.58));
}

.hai-source{
    border-color:rgba(255,255,255,.095);
    background:rgba(27,24,54,.82);
}

.hai-chat-example{
    border-color:rgba(255,255,255,.11);
    background:linear-gradient(155deg,rgba(38,33,76,.95),rgba(22,19,48,.95));
}

.hai-benefits-bottom{
    border-color:rgba(255,255,255,.09);
    background:rgba(255,255,255,.035);
}

.hai-integrations{
    background:
        radial-gradient(circle at 78% 50%,rgba(101,81,242,.17),transparent 35rem),
        linear-gradient(180deg,rgba(15,13,34,.08),rgba(27,21,59,.52),rgba(14,12,31,.08));
}

.hai-integration-card{
    border-color:rgba(255,255,255,.115);
    background:linear-gradient(150deg,rgba(39,34,78,.94),rgba(21,18,48,.96));
    box-shadow:0 30px 90px rgba(0,0,0,.2);
}

.hai-map-item{
    border-color:rgba(255,255,255,.1);
    background:rgba(30,27,62,.94);
}

.hai-map-center{
    border-color:rgba(150,138,255,.24);
    background:radial-gradient(circle,rgba(113,95,255,.29),rgba(27,23,60,.96) 68%);
}

.usecases,
.pricing,
.faq{
    background:
        radial-gradient(circle at 50% 0%,rgba(94,74,224,.055),transparent 35rem);
}

.usecase-shell,
.usecase-panel{
    border-color:rgba(255,255,255,.1);
    background:linear-gradient(145deg,rgba(31,28,61,.7),rgba(19,17,42,.72));
}

.usecase-tabs{
    border-color:rgba(255,255,255,.095);
    background:rgba(26,23,52,.8);
}

.usecase-tab.active{
    background:rgba(255,255,255,.105);
}

.mini-chat{
    border-color:rgba(255,255,255,.11);
    background:rgba(20,18,46,.94);
}

.ai-message{
    border-color:rgba(255,255,255,.095);
    background:rgba(255,255,255,.06);
}

.mini-action{
    border-color:rgba(127,112,255,.22);
    background:rgba(105,88,255,.09);
}

.price-card.featured{
    background:
        radial-gradient(circle at 84% 0%,rgba(100,83,255,.16),transparent 25rem),
        linear-gradient(145deg,rgba(37,32,73,.9),rgba(21,18,48,.92));
}

.faq-item{
    background:rgba(27,24,55,.5);
}

.faq-item[open]{
    background:rgba(32,28,64,.68);
}

.cta-card{
    background:
        radial-gradient(circle at 80% 25%,rgba(89,153,255,.13),transparent 25rem),
        radial-gradient(circle at 25% 50%,rgba(113,91,255,.15),transparent 28rem),
        linear-gradient(145deg,rgba(38,33,76,.88),rgba(21,18,48,.9));
}

footer{
    background:rgba(13,12,29,.88);
}


/* v13 — noticeably lighter dark theme */
:root{
    --bg:#151329;
    --bg-soft:#1a1732;
    --surface:#201d3b;
    --surface-2:#262146;
    --surface-3:#2b2650;
    --border:rgba(255,255,255,.13);
    --muted:#b2b6c8;
}

html{
    background:#151329;
}

body{
    background:
        radial-gradient(circle at 13% 8%,rgba(113,91,255,.18),transparent 34rem),
        radial-gradient(circle at 88% 18%,rgba(71,151,255,.13),transparent 38rem),
        radial-gradient(circle at 52% 64%,rgba(105,76,221,.08),transparent 44rem),
        linear-gradient(180deg,#17152e 0%,#121126 48%,#18152f 100%);
}

.site-header{
    background:rgba(23,21,46,.78);
    border-bottom-color:rgba(255,255,255,.09);
}

.hero{
    background:
        radial-gradient(circle at 72% 36%,rgba(116,92,255,.24),transparent 31rem),
        radial-gradient(circle at 23% 9%,rgba(76,150,255,.13),transparent 29rem);
}

.glass-card,
.hero-chat,
.price-card,
.faq-item,
.cta-card{
    border-color:rgba(255,255,255,.135);
    background:linear-gradient(145deg,rgba(43,38,80,.9),rgba(27,24,57,.9));
}

.hai-benefits{
    background:
        radial-gradient(circle at 13% 34%,rgba(113,88,245,.17),transparent 36rem),
        linear-gradient(180deg,rgba(27,24,57,.2),rgba(34,27,70,.58),rgba(21,19,43,.16));
}

.hai-benefits-main{
    border-color:rgba(255,255,255,.135);
    background:linear-gradient(145deg,rgba(47,41,88,.74),rgba(28,25,60,.72));
}

.hai-source{
    border-color:rgba(255,255,255,.125);
    background:rgba(40,35,76,.9);
}

.hai-chat-example{
    border-color:rgba(255,255,255,.14);
    background:linear-gradient(155deg,rgba(51,44,96,.97),rgba(31,27,66,.97));
}

.hai-benefits-bottom{
    border-color:rgba(255,255,255,.115);
    background:rgba(255,255,255,.05);
}

.hai-integrations{
    background:
        radial-gradient(circle at 78% 50%,rgba(117,92,255,.22),transparent 37rem),
        linear-gradient(180deg,rgba(23,20,50,.14),rgba(39,30,80,.61),rgba(22,19,47,.14));
}

.hai-integration-card{
    border-color:rgba(255,255,255,.145);
    background:linear-gradient(150deg,rgba(53,45,101,.96),rgba(30,26,65,.97));
    box-shadow:0 30px 90px rgba(0,0,0,.17);
}

.hai-map-item{
    border-color:rgba(255,255,255,.13);
    background:rgba(43,38,83,.96);
}

.hai-map-center{
    border-color:rgba(158,145,255,.3);
    background:radial-gradient(circle,rgba(126,105,255,.37),rgba(38,32,79,.97) 68%);
}

.usecases,
.pricing,
.faq{
    background:
        radial-gradient(circle at 50% 0%,rgba(112,88,238,.095),transparent 38rem);
}

.usecase-shell,
.usecase-panel{
    border-color:rgba(255,255,255,.13);
    background:linear-gradient(145deg,rgba(45,39,85,.82),rgba(28,25,61,.82));
}

.usecase-tabs{
    border-color:rgba(255,255,255,.125);
    background:rgba(39,34,74,.9);
}

.usecase-tab.active{
    background:rgba(255,255,255,.14);
}

.mini-chat{
    border-color:rgba(255,255,255,.14);
    background:rgba(32,28,68,.97);
}

.ai-message{
    border-color:rgba(255,255,255,.125);
    background:rgba(255,255,255,.075);
}

.mini-action{
    border-color:rgba(140,124,255,.27);
    background:rgba(111,93,255,.13);
}

.price-card.featured{
    background:
        radial-gradient(circle at 84% 0%,rgba(119,97,255,.22),transparent 27rem),
        linear-gradient(145deg,rgba(51,44,96,.94),rgba(30,26,65,.95));
}

.faq-item{
    background:rgba(41,36,78,.66);
}

.faq-item[open]{
    background:rgba(48,41,90,.82);
}

.cta-card{
    background:
        radial-gradient(circle at 80% 25%,rgba(86,166,255,.19),transparent 27rem),
        radial-gradient(circle at 25% 50%,rgba(126,102,255,.22),transparent 30rem),
        linear-gradient(145deg,rgba(52,45,99,.94),rgba(31,27,66,.95));
}

footer{
    background:rgba(20,18,41,.94);
}


/* FAQ v14 */
.faq-v14{position:relative;padding:126px 0 132px;background:radial-gradient(circle at 12% 24%,rgba(115,91,255,.11),transparent 30rem),radial-gradient(circle at 88% 70%,rgba(74,157,255,.07),transparent 30rem)}
.faq-v14-layout{display:grid;grid-template-columns:minmax(360px,.72fr) minmax(620px,1.28fr);gap:92px;align-items:start}
.faq-v14-intro{position:sticky;top:120px;max-width:620px}
.faq-v14-intro h2{margin:0 0 28px;font-size:clamp(3rem,4.9vw,5.7rem);line-height:.98;letter-spacing:-.06em;font-weight:600}
.faq-v14-intro>p{max-width:560px;margin:0;color:#a8adbf;font-size:.98rem;line-height:1.8}
.faq-v14-meta{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-top:38px;padding-top:24px;border-top:1px solid rgba(255,255,255,.09)}
.faq-v14-meta>div{display:flex;align-items:center;gap:12px}.faq-v14-meta-icon{width:38px;height:38px;flex:0 0 38px;display:grid;place-items:center;border:1px solid rgba(151,137,255,.18);border-radius:12px;background:rgba(111,93,255,.08);color:#b4aeff}.faq-v14-meta-icon svg{width:19px;height:19px}.faq-v14-meta strong{display:block;font-size:.74rem}.faq-v14-meta small{display:block;margin-top:3px;color:#787e91;font-size:.62rem;line-height:1.45}.faq-v14-meta .text-link{flex:0 0 auto;font-size:.72rem;color:#b5afff}
.faq-v14-list{overflow:hidden;border:1px solid rgba(255,255,255,.105);border-radius:24px;background:linear-gradient(150deg,rgba(43,38,82,.78),rgba(28,25,59,.78));box-shadow:0 26px 70px rgba(0,0,0,.13)}
.faq-v14-item{border-bottom:1px solid rgba(255,255,255,.09);background:transparent;transition:background .22s ease}.faq-v14-item:last-child{border-bottom:0}.faq-v14-item:hover{background:rgba(255,255,255,.025)}.faq-v14-item[open]{background:linear-gradient(90deg,rgba(112,94,255,.075),rgba(255,255,255,.025))}
.faq-v14-item summary{list-style:none;display:flex;align-items:center;justify-content:space-between;gap:28px;min-height:82px;padding:20px 22px 20px 26px;cursor:pointer}.faq-v14-item summary::-webkit-details-marker{display:none}
.faq-v14-question{display:flex;align-items:center;gap:18px;min-width:0;font-size:.94rem;font-weight:600;line-height:1.35}.faq-v14-index{flex:0 0 28px;color:#71778b;font-size:.57rem;font-weight:700;letter-spacing:.08em}
.faq-v14-toggle{width:38px;height:38px;flex:0 0 38px;display:grid;place-items:center;border:1px solid rgba(255,255,255,.12);border-radius:10px;background:rgba(255,255,255,.03);color:#b4b8c8;transition:transform .22s ease,background .22s ease,border-color .22s ease,color .22s ease,box-shadow .22s ease}.faq-v14-toggle svg{width:18px;height:18px}.faq-v14-item:hover .faq-v14-toggle{border-color:rgba(151,137,255,.28);background:rgba(112,94,255,.09);color:#d1cdff}.faq-v14-item[open] .faq-v14-toggle{border-color:rgba(151,137,255,.32);background:linear-gradient(145deg,rgba(119,99,255,.18),rgba(86,144,255,.09));color:#e1deff;box-shadow:0 8px 24px rgba(80,65,205,.14)}
.faq-v14-plus-v{transform-origin:10px 10px;transition:opacity .2s ease,transform .2s ease}.faq-v14-item[open] .faq-v14-plus-v{opacity:0;transform:scaleY(0)}
.faq-v14-answer{overflow:hidden}.faq-v14-answer p{max-width:820px;margin:0;padding:13px 80px 26px 72px;color:#989daf;font-size:.84rem;line-height:1.75}.faq-v14-answer strong{color:#3f2ca8;font-weight:600}
@media(max-width:1120px){.faq-v14-layout{grid-template-columns:1fr;gap:42px}.faq-v14-intro{position:static;max-width:850px}.faq-v14-intro>p{max-width:720px}}
@media(max-width:700px){.faq-v14{padding:92px 0 96px}.faq-v14-meta{align-items:flex-start;flex-direction:column}.faq-v14-list{border-radius:20px}.faq-v14-item summary{min-height:76px;gap:16px;padding:18px 16px 18px 18px}.faq-v14-question{gap:11px;font-size:.87rem}.faq-v14-index{flex-basis:22px}.faq-v14-toggle{width:36px;height:36px;flex-basis:36px}.faq-v14-answer p{padding:9px 18px 23px 51px;font-size:.8rem}}
@media(max-width:460px){.faq-v14-index{display:none}.faq-v14-answer p{padding-left:18px}}



/* v15 — clearly lighter navy / violet theme */
:root{
    --bg:#24213b;
    --bg-2:#292542;
    --surface:rgba(255,255,255,.085);
    --surface-2:rgba(255,255,255,.11);
    --surface-3:rgba(255,255,255,.14);
    --border:rgba(255,255,255,.16);
    --border-strong:rgba(255,255,255,.22);
    --text:#fbfbfe;
    --muted:#c3c6d4;
    --muted-2:#9ca1b7;
}

html{
    background:#24213b;
}

body{
    background:
        radial-gradient(circle at 11% 6%,rgba(117,96,255,.26),transparent 34rem),
        radial-gradient(circle at 88% 15%,rgba(83,171,255,.18),transparent 38rem),
        radial-gradient(circle at 50% 58%,rgba(140,92,255,.10),transparent 50rem),
        linear-gradient(180deg,#292643 0%,#211f37 46%,#292542 100%);
}

.site-header{
    background:rgba(38,35,63,.76);
    border-bottom-color:rgba(255,255,255,.11);
    backdrop-filter:blur(22px);
}

.site-header.scrolled{
    background:rgba(36,33,59,.88);
    border-bottom-color:rgba(255,255,255,.13);
}

.desktop-nav{
    background:rgba(255,255,255,.055);
    border-color:rgba(255,255,255,.11);
}

.desktop-nav a{
    color:#c7cad8;
}

.desktop-nav a:hover{
    background:rgba(255,255,255,.10);
}

.btn-ghost{
    background:rgba(255,255,255,.075);
    border-color:rgba(255,255,255,.14);
    color:#f3f3f8;
}

.btn-ghost:hover{
    background:rgba(255,255,255,.115);
    border-color:rgba(255,255,255,.20);
}

.hero{
    background:
        radial-gradient(circle at 73% 36%,rgba(126,101,255,.30),transparent 32rem),
        radial-gradient(circle at 21% 10%,rgba(86,170,255,.17),transparent 30rem);
}

.hero-aurora-a{
    background:radial-gradient(circle,rgba(116,88,255,.36),rgba(84,63,201,.16) 42%,transparent 72%);
}
.hero-aurora-b{
    background:radial-gradient(circle,rgba(113,168,255,.23),rgba(137,90,255,.15) 40%,transparent 73%);
}

.chat-window{
    border-color:rgba(255,255,255,.16);
    background:linear-gradient(180deg,rgba(57,51,95,.96),rgba(36,32,67,.97));
    box-shadow:0 38px 90px rgba(22,18,54,.26),0 0 95px rgba(92,71,228,.18);
}

.chat-topbar,
.integration-status,
.chat-input{
    border-color:rgba(255,255,255,.12);
}

.ai-message{
    border-color:rgba(255,255,255,.11);
    background:rgba(255,255,255,.09);
}

.integration-status{
    background:rgba(255,255,255,.06);
}

.chat-input{
    background:rgba(255,255,255,.055);
}

.floating-card{
    border-color:rgba(255,255,255,.14);
    background:rgba(48,43,82,.95);
    box-shadow:0 18px 42px rgba(23,18,57,.20);
}

.trust-tags span{
    background:rgba(255,255,255,.055);
    border-color:rgba(255,255,255,.11);
    color:#b7bbca;
}

/* Benefits */
.hai-benefits{
    background:
        radial-gradient(circle at 12% 34%,rgba(124,100,255,.20),transparent 36rem),
        linear-gradient(180deg,rgba(53,47,86,.12),rgba(61,49,102,.52),rgba(39,35,66,.15));
}

.hai-benefits-main{
    border-color:rgba(255,255,255,.15);
    background:linear-gradient(145deg,rgba(75,66,118,.72),rgba(45,40,78,.76));
    box-shadow:0 26px 65px rgba(24,19,56,.12);
}

.hai-source{
    border-color:rgba(255,255,255,.14);
    background:rgba(59,52,97,.92);
    color:#c4c8d6;
}

.hai-chat-example{
    border-color:rgba(255,255,255,.16);
    background:linear-gradient(155deg,rgba(70,60,117,.98),rgba(44,38,80,.98));
    box-shadow:0 22px 50px rgba(24,19,56,.16);
}

.hai-benefits-bottom{
    border-color:rgba(255,255,255,.13);
    background:rgba(255,255,255,.07);
}

.hai-benefit-list article{
    border-color:rgba(255,255,255,.11);
}

/* Integrations */
.hai-integrations{
    background:
        radial-gradient(circle at 78% 50%,rgba(128,105,255,.26),transparent 38rem),
        linear-gradient(180deg,rgba(46,41,78,.12),rgba(65,52,108,.56),rgba(43,38,73,.12));
}

.hai-integration-card{
    border-color:rgba(255,255,255,.16);
    background:linear-gradient(150deg,rgba(78,66,129,.97),rgba(45,39,82,.98));
    box-shadow:0 28px 70px rgba(24,19,56,.16);
}

.hai-map-item{
    border-color:rgba(255,255,255,.14);
    background:rgba(61,53,102,.97);
}

.hai-map-center{
    border-color:rgba(178,164,255,.34);
    background:radial-gradient(circle,rgba(139,116,255,.43),rgba(49,42,91,.98) 68%);
}

.hai-integration-example{
    background:rgba(255,255,255,.045);
}

/* Process */
.process-card{
    border-color:rgba(255,255,255,.14);
    background:linear-gradient(150deg,rgba(74,65,114,.60),rgba(45,40,78,.64));
}

/* Use cases */
.usecases{
    background:
        radial-gradient(circle at 50% 5%,rgba(120,95,247,.14),transparent 40rem),
        linear-gradient(180deg,rgba(52,47,85,.10),rgba(61,50,103,.42),rgba(45,40,75,.10));
}

.usecase-tabs{
    border-color:rgba(255,255,255,.14);
    background:rgba(61,54,101,.88);
}

.usecase-tab{
    color:#b6bac9;
}

.usecase-tab.active{
    background:rgba(255,255,255,.17);
    color:#fff;
}

.usecase-panel{
    border-color:rgba(255,255,255,.15);
    background:linear-gradient(140deg,rgba(76,66,119,.73),rgba(50,42,90,.66));
    box-shadow:0 26px 70px rgba(24,19,56,.11);
}

.mini-chat{
    border-color:rgba(255,255,255,.16);
    background:rgba(47,41,87,.98);
    box-shadow:0 26px 60px rgba(24,19,56,.15);
}

.mini-action{
    border-color:rgba(151,135,255,.28);
    background:rgba(120,101,255,.16);
}

/* Pricing */
.pricing-section{
    background:
        radial-gradient(circle at 74% 44%,rgba(117,92,255,.18),transparent 32rem),
        linear-gradient(180deg,rgba(48,43,80,.09),rgba(61,51,101,.42),rgba(44,39,75,.09));
}

.pricing-card{
    border-color:rgba(255,255,255,.16);
    background:
        radial-gradient(circle at 100% 0%,rgba(129,105,255,.22),transparent 40%),
        linear-gradient(145deg,rgba(76,66,121,.78),rgba(47,41,84,.82));
    box-shadow:0 28px 70px rgba(24,19,56,.14);
}

.setup-price{
    border-color:rgba(255,255,255,.13);
    background:rgba(255,255,255,.07);
}

/* CTA */
.cta-card{
    border-color:rgba(255,255,255,.17);
    background:
        radial-gradient(circle at 80% 25%,rgba(93,178,255,.22),transparent 28rem),
        radial-gradient(circle at 25% 50%,rgba(139,113,255,.27),transparent 31rem),
        linear-gradient(145deg,rgba(79,67,129,.95),rgba(46,40,84,.96));
    box-shadow:0 30px 80px rgba(24,19,56,.14);
}

/* FAQ */
.faq-v14{
    background:
        radial-gradient(circle at 12% 24%,rgba(132,105,255,.18),transparent 31rem),
        radial-gradient(circle at 88% 70%,rgba(86,172,255,.11),transparent 31rem);
}

.faq-v14-list{
    border-color:rgba(255,255,255,.16);
    background:linear-gradient(150deg,rgba(75,66,120,.84),rgba(47,41,83,.86));
    box-shadow:0 24px 58px rgba(24,19,56,.11);
}

.faq-v14-item{
    border-bottom-color:rgba(255,255,255,.12);
}

.faq-v14-item:hover{
    background:rgba(255,255,255,.05);
}

.faq-v14-item[open]{
    background:linear-gradient(90deg,rgba(135,111,255,.14),rgba(255,255,255,.045));
}

.faq-v14-toggle{
    border-color:rgba(255,255,255,.15);
    background:rgba(255,255,255,.06);
    color:#d0d3df;
}

.faq-v14-item:hover .faq-v14-toggle{
    border-color:rgba(173,159,255,.33);
    background:rgba(131,110,255,.15);
}

.faq-v14-answer p{
    color:#bcc0ce;
}

/* Footer */
.site-footer,
footer{
    background:
        radial-gradient(circle at 15% 100%,rgba(113,91,255,.12),transparent 28rem),
        linear-gradient(180deg,#24213c,#201d36);
    border-top-color:rgba(255,255,255,.11);
}

.footer-links a,
.footer-main p{
    color:#aeb2c3;
}

.footer-bottom{
    border-top-color:rgba(255,255,255,.10);
    color:#858a9f;
}



/* =========================================================
   v16 – WCAG 2.1 AA accessibility/readability layer
   ========================================================= */

/* Skip navigation */
.skip-link{
    position:fixed;
    left:18px;
    top:14px;
    z-index:99999;
    transform:translateY(-160%);
    padding:12px 16px;
    border:2px solid #ffffff;
    border-radius:10px;
    background:#24213b;
    color:#ffffff;
    font-size:1rem;
    font-weight:700;
    box-shadow:0 8px 30px rgba(0,0,0,.25);
}
.skip-link:focus{
    transform:none;
}

/* Strong, consistent keyboard focus */
:where(
    a,
    button,
    summary,
    [role="tab"],
    [tabindex]:not([tabindex="-1"])
):focus-visible{
    outline:3px solid #8ceafb;
    outline-offset:4px;
    border-radius:10px;
}

#main-content:focus{
    outline:none;
}

/* Ensure links do not rely on color alone */
main p a,
.site-footer p a{
    text-decoration:underline;
    text-decoration-thickness:.08em;
    text-underline-offset:.18em;
}

/* Readability: meaningful secondary text remains >= 4.5:1 on the
   lightest purple surfaces used by this design. */
.hero-lead,
.section-heading p,
.hai-benefits-head p,
.hai-knowledge-copy p,
.hai-benefit-list p,
.hai-integrations-lead,
.hai-integration-points p,
.usecase-copy>p,
.process-card p,
.pricing-heading p,
.pricing-note,
.faq-v14-intro>p,
.faq-v14-answer p,
.footer-main p,
.footer-links a,
.integration-list-item p{
    color:#d0d3df !important;
}

/* Important metadata/helper text: brighter and no microscopic type */
.chat-identity small,
.integration-status small,
.floating-card small,
.trust-row p,
.trust-tags span,
.card-kicker,
.hai-kicker,
.hai-chat-head small,
.hai-integration-brand small,
.hai-map-item small,
.hai-integration-example span,
.hai-integration-example p,
.hai-integration-number,
.process-number,
.mini-chat-head small,
.mini-action span,
.pricing-badge,
.setup-price span,
.pricing-note,
.faq-v14-index,
.faq-v14-meta small,
.footer-label,
.footer-bottom{
    color:#c6cad8 !important;
}

/* Minimum practical type sizes for content users need to read */
body{
    font-size:16px;
    line-height:1.6;
}

.hero-lead,
.section-heading p,
.hai-benefits-head p,
.hai-integrations-lead,
.usecase-copy>p,
.pricing-heading p,
.faq-v14-intro>p,
.footer-main p{
    font-size:1rem !important;
}

.feature-card p,
.hai-knowledge-copy p,
.hai-benefit-list p,
.hai-integration-points p,
.process-card p,
.faq-v14-answer p{
    font-size:.875rem !important;
}

.chat-identity small,
.integration-status small,
.floating-card small,
.trust-row p,
.trust-tags span,
.card-kicker,
.hai-kicker,
.hai-chat-head small,
.hai-integration-brand small,
.hai-map-item small,
.hai-integration-example span,
.hai-integration-example p,
.hai-integration-number,
.process-number,
.mini-chat-head small,
.mini-action span,
.pricing-badge,
.price-period,
.pricing-note,
.faq-v14-index,
.faq-v14-meta small,
.footer-label,
.footer-bottom{
    font-size:.8125rem !important;
    line-height:1.5;
}

/* Buttons and controls: readable labels + comfortable target size */
.btn,
.usecase-tab,
.menu-toggle,
.faq-v14-item summary{
    min-height:44px;
}

.btn{
    font-size:.9375rem;
}

.usecase-tab{
    padding:11px 17px;
    font-size:.875rem;
}

.menu-toggle{
    min-width:44px;
}

/* FAQ toggle remains a true square and large enough to see */
.faq-v14-toggle{
    width:42px;
    height:42px;
    flex:0 0 42px;
    border-color:rgba(255,255,255,.24);
    background:rgba(255,255,255,.09);
    color:#ffffff;
}

.faq-v14-question{
    color:#ffffff;
    font-size:1rem;
}

/* Tabs: selected state is not color-only */
.usecase-tab{
    border:1px solid transparent;
}
.usecase-tab.active,
.usecase-tab[aria-selected="true"]{
    border-color:rgba(255,255,255,.22);
    background:rgba(255,255,255,.18);
    box-shadow:inset 0 0 0 1px rgba(255,255,255,.04);
}
.usecase-tab[aria-selected="true"]::after{
    content:"";
    display:block;
    width:18px;
    height:2px;
    margin:5px auto -3px;
    border-radius:2px;
    background:#8ceafb;
}

/* Fake hero chat controls are visual only */
.demo-control,
.demo-send{
    display:grid;
    place-items:center;
}

.demo-send{
    width:33px;
    height:33px;
    border-radius:10px;
    background:linear-gradient(135deg,#6f63ff,#7e4cff);
    color:#fff;
}

.demo-send svg{
    width:18px;
    height:18px;
}

.time-options{
    display:flex;
    flex-wrap:wrap;
    gap:7px;
}

.time-options span{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:34px;
    padding:8px 11px;
    border:1px solid rgba(196,190,255,.35);
    border-radius:9px;
    background:rgba(104,91,255,.12);
    color:#ffffff;
    font-size:.8125rem;
}

/* Preserve text during zoom/reflow and avoid fixed-height clipping */
section,
.chat-window,
.hai-integration-card,
.hai-benefits-main,
.usecase-panel,
.pricing-card,
.faq-v14-list{
    height:auto;
}

p,
h1,
h2,
h3,
a,
button,
summary,
span{
    overflow-wrap:anywhere;
}

/* Visible hover is additional, never the only indicator */
a:hover{
    text-decoration-thickness:.12em;
}

/* Motion sensitivity */
@media (prefers-reduced-motion:reduce){
    html{
        scroll-behavior:auto !important;
    }
    .reveal,
    .floating-card,
    .hero-aurora,
    .hero-curve{
        animation:none !important;
        transition:none !important;
        transform:none !important;
    }
}

/* High contrast preference */
@media (prefers-contrast:more){
    :root{
        --border:rgba(255,255,255,.28);
        --border-strong:rgba(255,255,255,.38);
    }
    body{
        color:#ffffff;
    }
    .hero-lead,
    .section-heading p,
    .hai-benefits-head p,
    .hai-knowledge-copy p,
    .hai-benefit-list p,
    .hai-integrations-lead,
    .hai-integration-points p,
    .usecase-copy>p,
    .process-card p,
    .faq-v14-answer p{
        color:#ffffff !important;
    }
}

/* Reflow at 320px / 400% zoom friendly */
@media (max-width:420px){
    .container{
        width:min(calc(100% - 24px),var(--container));
    }

    .hero-actions,
    .cta-actions,
    .footer-cta-row{
        display:grid;
        grid-template-columns:1fr;
        width:100%;
    }

    .hero-actions .btn,
    .cta-actions .btn,
    .footer-cta-row .btn{
        width:100%;
    }

    .usecase-tabs{
        width:100%;
        max-width:100%;
        overflow-x:auto;
        justify-content:flex-start;
    }

    .faq-v14-item summary{
        align-items:flex-start;
    }
}


/* Helmi Desk brand logo */
.brand-logo{
    width:46px;
    height:46px;
    object-fit:contain;
    flex:0 0 auto;
    display:block;
}
.brand-logo-footer{
    width:52px;
    height:52px;
}
@media (max-width:640px){
    .brand-logo{width:40px;height:40px}
    .brand-logo-footer{width:46px;height:46px}
}

/* =========================================================
   v21 – compact hero + SVG safety + FAQ CTA responsive fix
   ========================================================= */

/* Inline SVG safety: prevents any icon from growing with an unconstrained parent. */
.btn-svg,
.inline-svg,
.hero-chat-send svg,
.faq-v14-meta-icon svg,
.faq-v14-toggle svg{
    width:18px;
    height:18px;
    max-width:18px;
    max-height:18px;
    flex:0 0 18px;
}

/* Compact centered hero */
.hero.hero-compact{
    min-height:0;
    padding:132px 0 72px;
    overflow:hidden;
    display:block;
    background:
        radial-gradient(circle at 18% 8%,rgba(111,91,255,.18),transparent 28rem),
        radial-gradient(circle at 82% 22%,rgba(85,157,255,.12),transparent 32rem);
}

.hero-compact-inner{
    position:relative;
    z-index:2;
}

.hero-compact-copy{
    width:min(100%,980px);
    margin:0 auto;
    text-align:center;
}

.hero-compact .hero-title{
    margin:0 auto 24px;
    font-size:clamp(3rem,5.3vw,6rem);
    line-height:.98;
    letter-spacing:-.06em;
}

.hero-compact .hero-lead{
    width:min(100%,850px);
    margin:0 auto;
    color:#d0d3df;
    font-size:1.04rem !important;
    line-height:1.78;
}

.hero-compact .hero-actions{
    justify-content:center;
    margin-top:30px;
}

.hero-compact-glow{
    position:absolute;
    border-radius:999px;
    pointer-events:none;
    filter:blur(28px);
}

.hero-compact-glow-a{
    width:460px;
    height:460px;
    left:-170px;
    top:20px;
    background:rgba(119,91,255,.16);
}

.hero-compact-glow-b{
    width:520px;
    height:520px;
    right:-210px;
    top:130px;
    background:rgba(70,166,255,.11);
}

/* Chat placeholder */
.hero-chat-shell{
    width:min(100%,1100px);
    margin:54px auto 0;
    overflow:hidden;
    border:1px solid rgba(255,255,255,.16);
    border-radius:26px;
    background:linear-gradient(145deg,rgba(72,63,116,.80),rgba(42,37,76,.90));
    box-shadow:0 30px 80px rgba(24,19,56,.20);
    backdrop-filter:blur(18px);
}

.hero-chat-head{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:18px;
    padding:18px 22px;
    border-bottom:1px solid rgba(255,255,255,.11);
}

.hero-chat-brand{
    display:flex;
    align-items:center;
    gap:12px;
    min-width:0;
}

.hero-chat-brand strong,
.hero-chat-brand small{
    display:block;
}

.hero-chat-brand strong{
    font-family:Manrope,Inter,sans-serif;
    font-size:.94rem;
}

.hero-chat-brand small{
    margin-top:2px;
    color:#c6cad8;
    font-size:.78rem;
}

.hero-chat-orb{
    width:38px;
    height:38px;
    flex:0 0 38px;
    border-radius:13px;
    border:1px solid rgba(255,255,255,.14);
    background:
        radial-gradient(circle at 34% 30%,#8ceafb 0 8%,transparent 9%),
        linear-gradient(145deg,#7567ff,#4d7cff 56%,#6ce7ff);
    box-shadow:0 8px 22px rgba(87,75,230,.28);
}

.hero-chat-status{
    display:inline-flex;
    align-items:center;
    gap:7px;
    flex:0 0 auto;
    color:#d7dae5;
    font-size:.79rem;
}

.hero-chat-status>span{
    width:8px;
    height:8px;
    border-radius:50%;
    background:#8ce9b5;
    box-shadow:0 0 0 4px rgba(140,233,181,.10);
}

.hero-chat-body{
    padding:24px;
}

.hero-chat-intro{
    width:min(100%,760px);
    margin:0 auto 22px;
    text-align:center;
}

.hero-chat-intro strong{
    display:block;
    margin-bottom:8px;
    font-family:Manrope,Inter,sans-serif;
    font-size:1.05rem;
}

.hero-chat-intro p{
    margin:0;
    color:#d0d3df;
    font-size:.9rem;
    line-height:1.7;
}

.hero-chat-placeholder{
    width:min(100%,840px);
    margin:0 auto;
    padding:20px;
    border:1px solid rgba(255,255,255,.12);
    border-radius:20px;
    background:rgba(34,30,64,.62);
}

.hero-chat-message{
    width:fit-content;
    max-width:min(76%,620px);
    margin-bottom:12px;
    padding:12px 15px;
    border-radius:15px;
    font-size:.86rem;
    line-height:1.55;
}

.hero-chat-message-user{
    margin-left:auto;
    border:1px solid rgba(167,150,255,.22);
    background:rgba(118,97,255,.18);
}

.hero-chat-message-ai{
    margin-right:auto;
    border:1px solid rgba(255,255,255,.10);
    background:rgba(255,255,255,.065);
    color:#eef0f7;
}

.hero-chat-inputbar{
    min-height:50px;
    margin-top:18px;
    padding:7px 8px 7px 16px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:14px;
    border:1px solid rgba(255,255,255,.12);
    border-radius:14px;
    background:rgba(255,255,255,.045);
    color:#c8ccda;
    font-size:.84rem;
}

.hero-chat-inputbar>span:first-child{
    min-width:0;
}

.hero-chat-send{
    width:36px;
    height:36px;
    flex:0 0 36px;
    display:grid;
    place-items:center;
    border-radius:11px;
    color:#fff;
    background:linear-gradient(135deg,#7165ff,#6258ff 54%,#6baeff);
}

.hero-chat-send svg{
    display:block;
}

/* Buttons must never split their label over multiple lines. */
.btn,
.btn *{
    white-space:nowrap;
    overflow-wrap:normal;
    word-break:normal;
}

/* FAQ contact block: copy first, CTAs on their own row beneath it. */
.faq-v14-meta{
    display:flex;
    flex-direction:column;
    align-items:stretch;
    justify-content:flex-start;
    gap:20px;
}

.faq-v14-meta>div:first-child{
    width:100%;
}

.faq-v14-actions{
    width:100%;
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:10px;
}

.faq-v14-actions .btn{
    width:auto;
    max-width:100%;
    min-height:50px;
    padding-inline:18px;
}

/* Two buttons stay side-by-side while there is genuinely enough room. */
@media (max-width:620px){
    .faq-v14-actions{
        display:grid;
        grid-template-columns:1fr;
    }

    .faq-v14-actions .btn{
        width:100%;
    }
}

@media (max-width:760px){
    .hero.hero-compact{
        padding:112px 0 58px;
    }

    .hero-compact .hero-title{
        font-size:clamp(2.65rem,11.5vw,4.35rem);
    }

    .hero-compact .hero-actions{
        display:grid;
        grid-template-columns:1fr;
        width:100%;
    }

    .hero-compact .hero-actions .btn{
        width:100%;
    }

    .hero-chat-shell{
        margin-top:38px;
        border-radius:21px;
    }

    .hero-chat-head,
    .hero-chat-body{
        padding-left:16px;
        padding-right:16px;
    }

    .hero-chat-message{
        max-width:90%;
    }
}

@media (min-width:1100px){
    .hero.hero-compact{
        padding-top:118px;
        padding-bottom:58px;
    }
}


/* v22 — tighter section rhythm + improved integration example */
@media (min-width: 761px){
    .section{
        padding-top:104px;
        padding-bottom:104px;
    }

    .hai-benefits{
        padding-top:104px;
        padding-bottom:108px;
    }

    .hai-integrations{
        padding-top:102px;
        padding-bottom:102px;
    }

    .process-section{
        padding-top:94px;
        padding-bottom:102px;
    }

    .usecases{
        padding-top:102px;
        padding-bottom:102px;
    }

    .pricing-section{
        padding-top:102px;
        padding-bottom:102px;
    }

    .cta-section{
        padding-top:72px;
        padding-bottom:72px;
    }

    .faq-section,
    .faq-v14{
        padding-top:98px;
        padding-bottom:106px;
    }
}

.hai-integration-example{
    display:flex;
    align-items:center;
    gap:14px;
    padding:17px 19px;
}

.hai-example-icon{
    width:38px;
    height:38px;
    flex:0 0 38px;
    display:grid;
    place-items:center;
    border:1px solid rgba(151,135,255,.22);
    border-radius:12px;
    background:linear-gradient(145deg,rgba(130,108,255,.17),rgba(92,157,255,.08));
    color:#c4bcff;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.06);
}

.hai-example-icon svg{
    width:19px;
    height:19px;
    display:block;
}

.hai-example-content{
    min-width:0;
    display:flex;
    align-items:baseline;
    gap:14px;
}

.hai-integration-example .hai-example-label{
    flex:0 0 auto;
    white-space:nowrap;
    color:#c6cad8 !important;
    font-size:.72rem !important;
    line-height:1.2 !important;
    font-weight:700;
    letter-spacing:.1em;
}

.hai-integration-example .hai-example-content p{
    min-width:0;
    margin:0;
    color:#d0d3df !important;
    font-size:.875rem !important;
    line-height:1.55;
}

.hai-integration-example .hai-example-content p strong{
    color:#ffffff;
    font-weight:600;
}

@media (max-width:760px){
    .section{
        padding-top:78px;
        padding-bottom:78px;
    }

    .hai-benefits,
    .hai-integrations{
        padding-top:82px;
        padding-bottom:82px;
    }

    .process-section,
    .usecases,
    .pricing-section{
        padding-top:78px;
        padding-bottom:78px;
    }

    .cta-section{
        padding-top:54px;
        padding-bottom:54px;
    }

    .faq-section,
    .faq-v14{
        padding-top:78px;
        padding-bottom:84px;
    }

    .hai-integration-example{
        display:flex;
        align-items:flex-start;
        gap:12px;
        padding:15px;
    }

    .hai-example-content{
        display:block;
    }

    .hai-integration-example .hai-example-label{
        display:block;
        margin-bottom:5px;
    }
}

@media (max-width:420px){
    .hai-example-icon{
        width:34px;
        height:34px;
        flex-basis:34px;
    }

    .hai-integration-example .hai-example-content p{
        font-size:.82rem !important;
    }
}


/* v23 — integration section refinement */
.hai-integration-points article,
.hai-integration-points article:not(:first-child){
    display:block;
}

.hai-integration-point-head{
    display:flex;
    align-items:flex-start;
    gap:12px;
    margin-bottom:12px;
}

.hai-integration-number{
    flex:0 0 auto;
    min-width:34px;
    padding-top:1px;
    font-size:.78rem;
    line-height:1.4;
    color:#c9c4ff;
}

.hai-integration-point-head h3{
    margin:0;
    font-size:1rem;
    line-height:1.4;
}

.hai-integration-points article > p{
    margin:0;
    max-width:31ch;
    color:#d0d3df;
    font-size:.88rem;
    line-height:1.72;
}

.hai-integration-logo{
    width:38px;
    height:38px;
    flex:0 0 38px;
    display:block;
    object-fit:contain;
    filter:drop-shadow(0 8px 18px rgba(87,72,220,.22));
}

.hai-map-center{
    gap:10px;
}

.hai-map-logo{
    width:46px;
    height:46px;
    display:block;
    object-fit:contain;
    filter:drop-shadow(0 10px 22px rgba(91,76,235,.34));
}

.hai-integration-example{
    display:block;
    padding:18px 20px 20px;
    border-top:1px solid rgba(255,255,255,.075);
    background:
        linear-gradient(90deg,rgba(121,103,255,.07),rgba(96,176,255,.025) 62%,transparent),
        rgba(255,255,255,.015);
}

.hai-example-topline{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:14px;
    margin-bottom:10px;
}

.hai-integration-example .hai-example-label{
    display:inline-flex;
    align-items:center;
    width:max-content;
    white-space:nowrap;
    color:#d7d3ff !important;
    font-size:.66rem !important;
    line-height:1 !important;
    font-weight:700;
    letter-spacing:.105em;
}

.hai-integration-example > p{
    display:flex;
    align-items:baseline;
    gap:6px;
    flex-wrap:wrap;
    margin:0;
    color:#d0d3df !important;
    font-size:.88rem !important;
    line-height:1.6;
}

.hai-integration-example > p strong{
    color:#fff;
    font-weight:650;
}

.hai-integration-example > p span{
    color:#d0d3df !important;
    font-size:inherit !important;
    font-weight:400;
    letter-spacing:0;
}

@media (max-width:1320px){
    .hai-integration-points article > p{
        max-width:none;
    }
}

@media (max-width:620px){
    .hai-integration-point-head{
        gap:10px;
        margin-bottom:9px;
    }

    .hai-integration-number{
        min-width:28px;
        font-size:.72rem;
    }

    .hai-integration-points article > p{
        font-size:.86rem;
    }

    .hai-integration-example{
        padding:16px;
    }

    .hai-example-topline{
        margin-bottom:9px;
    }

    .hai-integration-example > p{
        display:block;
        font-size:.84rem !important;
    }

    .hai-integration-example > p strong,
    .hai-integration-example > p span{
        display:inline;
    }

    .hai-map-logo{
        width:42px;
        height:42px;
    }
}


/* v24 — integration point alignment requested */
.hai-integration-point-head{
    display:flex;
    align-items:flex-start;
    margin-bottom:12px;
}

.hai-integration-number{
    flex:0 0 auto;
    min-width:28px;
    padding-top:1px;
    font-size:.78rem;
    line-height:1.4;
    color:#c9c4ff;
}

/* =========================================================
   v26 — Helmi Desk light theme
   ========================================================= */
:root{
    --bg:#f8f8fc;
    --bg-2:#ffffff;
    --surface:#ffffff;
    --surface-soft:#f4f2fb;
    --surface-purple:#f0edff;
    --text:#202234;
    --text-strong:#151725;
    --muted:#64697d;
    --muted-2:#7d8295;
    --line:rgba(72,62,124,.13);
    --line-strong:rgba(102,82,198,.22);
    --brand:#6f5cff;
    --brand-2:#8a63ff;
    --brand-blue:#4f8cff;
    --brand-cyan:#51c9e8;
}

html{ background:#f8f8fc !important; }
body{
    background:
        radial-gradient(circle at 10% 2%,rgba(111,92,255,.10),transparent 25%),
        radial-gradient(circle at 90% 8%,rgba(79,140,255,.08),transparent 23%),
        linear-gradient(180deg,#fcfcfe 0%,#f7f7fb 100%) !important;
    color:var(--text) !important;
}

body::before, body::after{ opacity:.22 !important; }

h1,h2,h3,h4,h5,h6,
.hero h1,.section-title,.section-heading h2,
.hai-benefits h2,.hai-integrations h2,.faq-v14 h2{
    color:var(--text-strong) !important;
}

p,.hero p,.section-heading p,.section-lead,
.hai-benefits p,.hai-integrations p,.process-section p,
.usecases p,.pricing-section p,.faq-v14 p{
    color:var(--muted) !important;
}

.gradient-text{
    background:linear-gradient(90deg,#765eff 0%,#8d68ff 38%,#4f8cff 75%,#49c5e7 100%) !important;
    -webkit-background-clip:text !important;
    background-clip:text !important;
    color:transparent !important;
}

/* Header */
.site-header, header{
    background:rgba(252,252,254,.88) !important;
    border-bottom:1px solid rgba(73,63,125,.09) !important;
    backdrop-filter:blur(18px);
}
.site-header a, header a{ color:#34374b !important; }
.site-header a:hover, header a:hover{ color:#6654dd !important; }

/* Main surfaces */
.hero,.section,.hai-benefits,.hai-integrations,.process-section,
.usecases,.pricing-section,.faq-v14,.faq-section{
    background:transparent !important;
}

.card,.glass-card,.feature-card,.process-card,.pricing-card,
.hero-chat-shell,.hai-main-card,.hai-side-card,.hai-integration-card,
.usecase-panel,.faq-v14-list{
    background:rgba(255,255,255,.90) !important;
    border-color:var(--line) !important;
    box-shadow:0 18px 48px rgba(54,45,106,.08) !important;
}

/* Buttons */
.btn-primary,.faq-v14-primary{
    background:linear-gradient(135deg,#6f5cff 0%,#8962ff 50%,#4f8cff 100%) !important;
    color:#fff !important;
    border-color:rgba(111,92,255,.44) !important;
    box-shadow:0 10px 26px rgba(111,92,255,.20) !important;
}
.btn-primary:hover,.faq-v14-primary:hover{
    box-shadow:0 14px 34px rgba(111,92,255,.27) !important;
}
.btn-ghost,.faq-v14-secondary{
    background:#fff !important;
    color:#413b6d !important;
    border-color:rgba(100,82,193,.22) !important;
}
.btn-ghost:hover,.faq-v14-secondary:hover{
    background:#f2efff !important;
    border-color:rgba(100,82,193,.34) !important;
}

/* Hero chat */
.hero-chat-shell{
    background:#fff !important;
    border:1px solid rgba(89,73,170,.15) !important;
    box-shadow:0 24px 60px rgba(64,51,126,.10) !important;
}
.hero-chat-head{
    border-color:rgba(83,70,151,.11) !important;
}
.hero-chat-brand strong,.hero-chat-intro strong{ color:#222538 !important; }
.hero-chat-brand small,.hero-chat-intro p{ color:#72778a !important; }
.hero-chat-status{
    background:#f1efff !important;
    color:#6756d4 !important;
    border-color:rgba(111,92,255,.16) !important;
}
.hero-chat-message-ai{
    background:#f4f2fb !important;
    color:#34384d !important;
    border-color:rgba(83,70,151,.10) !important;
}
.hero-chat-message-user{
    background:linear-gradient(135deg,#6f5cff,#8962ff) !important;
    color:#fff !important;
}
.hero-chat-inputbar{
    background:#fafafe !important;
    border-color:rgba(83,70,151,.12) !important;
    color:#7a7f92 !important;
}

/* Real Helmi Desk logo in the chat headers */
.hero-chat-orb.hero-chat-logo,
.hai-orb.hai-chat-logo{
    width:42px !important;
    height:42px !important;
    min-width:42px !important;
    display:grid !important;
    place-items:center !important;
    padding:4px !important;
    overflow:hidden !important;
    border-radius:13px !important;
    background:#f1efff !important;
    border:1px solid rgba(111,92,255,.16) !important;
    box-shadow:none !important;
}
.hero-chat-logo img,
.hai-chat-logo img{
    display:block !important;
    width:100% !important;
    height:100% !important;
    object-fit:contain !important;
}

/* Benefits / knowledge section */
.hai-benefit-grid,.hai-benefit-main,.hai-benefit-side,
.hai-knowledge-card,.hai-chat-example{
    border-color:var(--line) !important;
}
.hai-benefit-main,.hai-benefit-side,.hai-knowledge-card,.hai-chat-example{
    background:rgba(255,255,255,.88) !important;
}
.hai-benefit-main h3,.hai-benefit-side h3,.hai-chat-head strong{ color:#222538 !important; }
.hai-benefit-main p,.hai-benefit-side p,.hai-chat-head small{ color:#686d80 !important; }
.hai-label,.section-kicker,.eyebrow{ color:#6756cf !important; }
.hai-knowledge-item,.hai-source-item,.hai-chip{
    background:#f5f3fc !important;
    color:#4e5368 !important;
    border-color:rgba(98,81,188,.14) !important;
}
.hai-msg-ai{
    background:#f4f2fb !important;
    color:#383c52 !important;
}
.hai-msg-user{
    background:linear-gradient(135deg,#6f5cff,#8962ff) !important;
    color:#fff !important;
}
.hai-chat-action{
    background:#faf9fe !important;
    border-color:rgba(102,82,198,.16) !important;
    color:#393d52 !important;
}
.hai-chat-action small{ color:#7a69d9 !important; }
.hai-chat-action strong{ color:#2d3042 !important; }

/* Integrations */
.hai-integration-point,.hai-integration-card,.hai-map-item,.hai-integration-example{
    background:rgba(255,255,255,.90) !important;
    border-color:rgba(86,72,159,.14) !important;
}
.hai-integration-point h3,.hai-integration-brand strong,.hai-map-item strong,
.hai-map-center strong,.hai-integration-example strong{
    color:#232638 !important;
}
.hai-integration-point p,.hai-integration-brand small,.hai-map-item small,
.hai-integration-example span,.hai-integration-example p{
    color:#666b80 !important;
}
.hai-integration-number{ color:#7464dd !important; }
.hai-live{
    background:#f1eeff !important;
    color:#6957d7 !important;
    border-color:rgba(111,92,255,.15) !important;
}
.hai-integration-logo,.hai-map-logo{
    filter:none !important;
}
.hai-map-center{
    background:linear-gradient(145deg,#f0edff,#ffffff) !important;
    border-color:rgba(111,92,255,.18) !important;
    box-shadow:0 14px 30px rgba(74,61,145,.09) !important;
}
.hai-map-icon{
    background:#f1efff !important;
    color:#6c5ada !important;
    border-color:rgba(111,92,255,.14) !important;
}
.hai-map-lines{ opacity:.55 !important; }
.hai-example-label{ color:#6756cf !important; }

/* Process / use cases */
.process-card,.usecase-panel,.usecase-copy,.usecase-conversation{
    background:#fff !important;
    border-color:var(--line) !important;
}
.process-card h3,.usecase-copy h3{ color:#222538 !important; }
.usecase-tab{ color:#64697d !important; }
.usecase-tab[aria-selected="true"],.usecase-tab.active{
    background:linear-gradient(135deg,#6f5cff,#8962ff) !important;
    color:#fff !important;
}
.usecase-message{ background:#f4f2fb !important; color:#34384d !important; }
.usecase-message.user{ background:#6f5cff !important; color:#fff !important; }

/* Pricing */
.pricing-section{
    background:linear-gradient(180deg,rgba(246,245,252,.70),rgba(250,250,254,.96)) !important;
}
.pricing-card{
    background:#fff !important;
    border-color:rgba(111,92,255,.16) !important;
    box-shadow:0 24px 54px rgba(74,61,145,.10) !important;
}
.price,.pricing-price{ color:#211f35 !important; }
.pricing-list li{ color:#575c70 !important; }

/* CTA remains strongly branded */
.cta-section,.cta-card{
    background:linear-gradient(135deg,#6957e5 0%,#7e5ff0 52%,#4f8cff 100%) !important;
    color:#fff !important;
}
.cta-section h2,.cta-section p,.cta-card h2,.cta-card p{ color:#fff !important; }
.cta-section .btn-ghost,.cta-card .btn-ghost{
    background:rgba(255,255,255,.12) !important;
    color:#fff !important;
    border-color:rgba(255,255,255,.34) !important;
}

/* FAQ */
.faq-v14-list,.faq-v14-item,.faq-v14 details,.faq-v14-meta{
    background:#fff !important;
    border-color:rgba(84,72,153,.13) !important;
}
.faq-v14 summary,.faq-v14-question,.faq-v14-meta strong{ color:#242738 !important; }
.faq-v14-answer p,.faq-v14-meta small{ color:#666b7e !important; }
.faq-v14-index{ color:#7564dd !important; }

/* Footer */
.site-footer,footer{
    background:#f1f0f7 !important;
    color:#5b6074 !important;
    border-color:rgba(84,72,153,.10) !important;
}
.site-footer a,footer a{ color:#45495e !important; }
.site-footer a:hover,footer a:hover{ color:#6654dd !important; }

/* Focus */
:focus-visible{
    outline:3px solid rgba(111,92,255,.42) !important;
    outline-offset:3px !important;
}

@media (max-width:760px){
    body{
        background:linear-gradient(180deg,#fbfbfe 0%,#f7f7fb 100%) !important;
    }
    .hero-chat-shell,.hai-integration-card,.pricing-card,.faq-v14-list{
        box-shadow:0 14px 34px rgba(59,48,119,.08) !important;
    }
}


/* =========================================================
   v27 — WCAG 2.1 readability focused light theme
   High-contrast copy, lighter surfaces, simpler navigation.
   ========================================================= */

:root{
    --hd-bg:#fafafe;
    --hd-bg-alt:#f5f3fb;
    --hd-surface:#ffffff;
    --hd-surface-soft:#f7f5ff;
    --hd-text:#1c2033;
    --hd-muted:#50566b;
    --hd-subtle:#6b7280;
    --hd-purple:#6750f5;
    --hd-purple-dark:#5b43df;
    --hd-purple-soft:#eeeaff;
    --hd-blue:#416fe8;
    --hd-border:#dedbea;
    --hd-border-strong:#cfc9e6;
    --hd-focus:#5b43df;
}

html{
    background:var(--hd-bg) !important;
    color-scheme:light;
}

body{
    background:
        radial-gradient(circle at 8% 2%,rgba(103,80,245,.065),transparent 24rem),
        radial-gradient(circle at 92% 6%,rgba(65,111,232,.055),transparent 24rem),
        var(--hd-bg) !important;
    color:var(--hd-text) !important;
}

body::before,
body::after{
    display:none !important;
}

/* ---------- Typography / contrast ---------- */

body,
button,
input,
textarea,
select{
    color:var(--hd-text);
}

p,
li{
    color:var(--hd-muted);
}

.hero-lead,
.section-heading p,
.hai-benefits-head p,
.hai-knowledge-copy p,
.hai-benefit-list p,
.hai-integration-point p,
.process-card p,
.usecase-copy > p,
.pricing-heading p,
.pricing-note,
.faq-v14-answer p,
.faq-v14-meta small{
    color:var(--hd-muted) !important;
}

.hai-benefit-list p,
.process-card p,
.hai-integration-point p,
.usecase-copy > p,
.pricing-note,
.faq-v14-answer p{
    font-size:max(.94rem,15px) !important;
    line-height:1.7 !important;
}

.hai-kicker,
.card-kicker,
.section-kicker,
.pricing-badge,
.hai-example-label{
    color:#5945c7 !important;
}

h1,h2,h3,h4,h5,h6,
.hero-title,
.hai-benefits-head h2,
.hai-knowledge-copy h3,
.hai-benefit-list h3,
.hai-integration-point h3,
.process-card h3,
.usecase-copy h3,
.pricing-heading h2,
.faq-v14 h2{
    color:var(--hd-text) !important;
}

.gradient-text{
    background:linear-gradient(90deg,#654fe5 0%,#7556ee 42%,#416fe8 76%,#2589b8 100%) !important;
    -webkit-background-clip:text !important;
    background-clip:text !important;
    color:transparent !important;
}

/* ---------- Navigation ---------- */

.site-header,
.site-header.scrolled{
    background:rgba(255,255,255,.94) !important;
    border-bottom:1px solid #e6e3ef !important;
    box-shadow:0 8px 28px rgba(44,38,79,.05) !important;
}

.nav-wrap{
    min-height:76px;
}

.brand{
    color:var(--hd-text) !important;
}

.brand-text{
    color:var(--hd-text) !important;
}

.brand-text span{
    color:var(--hd-purple-dark) !important;
}

.desktop-nav{
    gap:4px !important;
    padding:4px !important;
    background:transparent !important;
    border:0 !important;
    backdrop-filter:none !important;
}

.desktop-nav a{
    min-height:44px;
    display:flex;
    align-items:center;
    padding:0 13px !important;
    color:#3f4559 !important;
    font-size:.86rem !important;
    font-weight:650 !important;
}

.desktop-nav a:hover{
    background:var(--hd-purple-soft) !important;
    color:#4938ae !important;
}

.nav-actions{
    gap:8px !important;
}

.nav-actions .btn{
    min-height:44px;
}

.menu-toggle{
    background:#fff !important;
    border-color:var(--hd-border) !important;
}

.menu-toggle span{
    background:var(--hd-text) !important;
}

.mobile-menu{
    background:#fff !important;
    border-bottom:1px solid var(--hd-border) !important;
}

.mobile-menu a{
    color:var(--hd-text) !important;
}

/* ---------- Buttons ---------- */

.btn-primary,
.faq-v14-primary{
    background:linear-gradient(135deg,var(--hd-purple-dark),var(--hd-purple),var(--hd-blue)) !important;
    color:#fff !important;
    border:1px solid var(--hd-purple-dark) !important;
    box-shadow:0 9px 22px rgba(91,67,223,.18) !important;
}

.btn-primary:hover,
.faq-v14-primary:hover{
    background:linear-gradient(135deg,#5037ce,#6048e6,#3564d7) !important;
    box-shadow:0 12px 28px rgba(91,67,223,.24) !important;
}

.btn-ghost,
.faq-v14-secondary{
    background:#fff !important;
    color:#3d355f !important;
    border:1px solid #cbc5e0 !important;
}

.btn-ghost:hover,
.faq-v14-secondary:hover{
    background:var(--hd-purple-soft) !important;
    color:#4233a4 !important;
    border-color:#a99ee0 !important;
}

/* ---------- Main section rhythm ---------- */

.hero,
.hai-benefits,
.hai-integrations,
.process-section,
.usecases,
.pricing-section,
.faq-section,
.faq-v14{
    background:transparent !important;
}

.hai-benefits{
    background:linear-gradient(180deg,#fbfafe 0%,#f6f4fb 100%) !important;
}

.process-section{
    background:#fff !important;
}

.usecases{
    background:linear-gradient(180deg,#f8f7fc 0%,#f5f3fa 100%) !important;
}

.faq-section,
.faq-v14{
    background:#fff !important;
}

/* ---------- Hero demo ---------- */

.hero-chat-shell{
    background:#fff !important;
    border:1px solid var(--hd-border) !important;
    box-shadow:0 22px 54px rgba(47,40,91,.09) !important;
}

.hero-chat-head{
    border-bottom:1px solid #e8e5f0 !important;
}

.hero-chat-brand strong,
.hero-chat-intro strong{
    color:var(--hd-text) !important;
}

.hero-chat-brand small,
.hero-chat-intro p{
    color:var(--hd-muted) !important;
}

.hero-chat-message-ai{
    background:#f4f2fa !important;
    border:1px solid #e3dfed !important;
    color:#30364b !important;
}

.hero-chat-message-user{
    background:linear-gradient(135deg,var(--hd-purple-dark),var(--hd-purple)) !important;
    color:#fff !important;
}

.hero-chat-inputbar{
    background:#faf9fd !important;
    border-color:#ddd9e8 !important;
    color:#62697c !important;
}

/* ---------- Benefit section: fix dark/purple block ---------- */

.hai-benefits-main{
    background:#fff !important;
    border:1px solid var(--hd-border) !important;
    box-shadow:0 18px 48px rgba(47,40,91,.07) !important;
}

.hai-knowledge{
    background:#fff !important;
    border-bottom:1px solid var(--hd-border) !important;
}

.hai-knowledge-copy h3{
    color:var(--hd-text) !important;
}

.hai-knowledge-copy p{
    color:var(--hd-muted) !important;
}

.hai-source{
    background:#f4f1fb !important;
    color:#383f56 !important;
    border:1px solid #dcd6ec !important;
}

.hai-source svg{
    color:#5945c7 !important;
}

.hai-chat-example{
    background:#fbfafe !important;
    border:1px solid #dcd8e8 !important;
    box-shadow:0 15px 38px rgba(47,40,91,.08) !important;
}

.hai-chat-head{
    border-bottom:1px solid #e3dfeb !important;
}

.hai-chat-head strong{
    color:var(--hd-text) !important;
}

.hai-chat-head small{
    color:var(--hd-muted) !important;
}

.hai-msg-user{
    background:linear-gradient(135deg,var(--hd-purple-dark),var(--hd-purple)) !important;
    color:#fff !important;
}

.hai-msg-ai{
    background:#f0edf7 !important;
    border:1px solid #ddd8e8 !important;
    color:#30364b !important;
}

.hai-chat-action{
    background:#fff !important;
    border:1px solid #ccc5e5 !important;
}

.hai-chat-action small{
    color:#5945c7 !important;
}

.hai-chat-action strong{
    color:var(--hd-text) !important;
}

.hai-benefit-list{
    background:#fff !important;
}

.hai-benefit-list article{
    background:#fff !important;
    border-right:1px solid var(--hd-border) !important;
}

.hai-benefit-list article:last-child{
    border-right:0 !important;
}

.hai-benefit-icon{
    background:var(--hd-purple-soft) !important;
    color:#5945c7 !important;
    border:1px solid #d4cdf1 !important;
}

.hai-benefit-list h3{
    color:var(--hd-text) !important;
}

.hai-benefit-list p{
    color:var(--hd-muted) !important;
}

.hai-benefits-bottom{
    background:#fff !important;
    border:1px solid var(--hd-border) !important;
    box-shadow:0 8px 24px rgba(47,40,91,.04) !important;
}

.hai-benefits-bottom strong{
    color:var(--hd-text) !important;
}

.hai-benefits-bottom p{
    color:var(--hd-muted) !important;
}

.hai-benefits-bottom .text-link{
    color:#4938ae !important;
    font-weight:700;
}

/* ---------- Integrations ---------- */

.hai-integration-point{
    background:#fff !important;
    border-color:var(--hd-border) !important;
}

.hai-integration-point h3{
    color:var(--hd-text) !important;
}

.hai-integration-point p{
    color:var(--hd-muted) !important;
}

.hai-integration-number{
    color:#5945c7 !important;
}

.hai-integration-card{
    background:#fff !important;
    border-color:var(--hd-border) !important;
    box-shadow:0 18px 45px rgba(47,40,91,.07) !important;
}

.hai-integration-brand strong,
.hai-map-item strong,
.hai-map-center strong{
    color:var(--hd-text) !important;
}

.hai-integration-brand small,
.hai-map-item small{
    color:var(--hd-muted) !important;
}

.hai-map-item{
    background:#f8f7fc !important;
    border-color:#ddd9e8 !important;
}

.hai-map-icon{
    background:var(--hd-purple-soft) !important;
    color:#5945c7 !important;
    border-color:#d6cff1 !important;
}

.hai-map-center{
    background:#fff !important;
    color:var(--hd-text) !important;
    border-color:#cfc8e8 !important;
}

.hai-integration-example{
    background:#f8f7fc !important;
    border-top:1px solid var(--hd-border) !important;
}

.hai-integration-example strong{
    color:var(--hd-text) !important;
}

.hai-integration-example span,
.hai-integration-example p{
    color:var(--hd-muted) !important;
}

/* ---------- Process cards ---------- */

.process-grid{
    gap:18px !important;
}

.process-card{
    background:#fff !important;
    border:1px solid var(--hd-border) !important;
    box-shadow:0 14px 36px rgba(47,40,91,.06) !important;
}

.process-card:before{
    background:linear-gradient(90deg,var(--hd-purple),var(--hd-blue)) !important;
    opacity:.45 !important;
}

.process-number{
    color:#706a87 !important;
}

.process-icon{
    background:var(--hd-purple-soft) !important;
    border-color:#d4cdf1 !important;
    color:#5945c7 !important;
}

.process-card h3{
    color:var(--hd-text) !important;
}

.process-card p{
    color:var(--hd-muted) !important;
}

/* ---------- Use case tabs and panel ---------- */

.usecase-tabs{
    background:#fff !important;
    border:1px solid #d8d3e5 !important;
    box-shadow:0 8px 24px rgba(47,40,91,.05) !important;
}

.usecase-tab{
    min-height:44px;
    color:#41475c !important;
    background:transparent !important;
    font-size:.84rem !important;
}

.usecase-tab:hover{
    background:#f2effa !important;
    color:#3f31a0 !important;
}

.usecase-tab[aria-selected="true"],
.usecase-tab.active{
    background:linear-gradient(135deg,var(--hd-purple-dark),var(--hd-purple)) !important;
    color:#fff !important;
    box-shadow:none !important;
}

.usecase-panel{
    background:#fff !important;
    border:1px solid var(--hd-border) !important;
    box-shadow:0 18px 45px rgba(47,40,91,.07) !important;
}

.usecase-copy{
    background:#fff !important;
}

.usecase-copy h3{
    color:var(--hd-text) !important;
}

.usecase-copy > p{
    color:var(--hd-muted) !important;
}

.usecase-checks span{
    background:#f5f3fb !important;
    border:1px solid #ddd8e9 !important;
    color:#43495e !important;
}

.usecase-checks span:before{
    border-left-color:#5945c7 !important;
    border-bottom-color:#5945c7 !important;
}

.usecase-demo{
    background:
        radial-gradient(circle at 50% 48%,rgba(103,80,245,.09),transparent 55%),
        #faf9fd !important;
}

/* The mini chat was too dark and had low-contrast labels. */
.mini-chat{
    background:#fff !important;
    border:1px solid #d7d2e4 !important;
    box-shadow:0 22px 52px rgba(47,40,91,.12) !important;
}

.mini-chat-head{
    background:#fff !important;
    border-bottom:1px solid #e3dfeb !important;
}

.mini-chat-head strong{
    color:var(--hd-text) !important;
}

.mini-chat-head small{
    color:#4f566a !important;
}

.status-dot{
    background:#1d9d64 !important;
}

.mini-chat-logo{
    width:38px !important;
    height:38px !important;
    display:grid !important;
    place-items:center !important;
    padding:3px !important;
    overflow:hidden !important;
    border-radius:12px !important;
    background:var(--hd-purple-soft) !important;
    border:1px solid #d4cdf1 !important;
}

.mini-chat-logo img{
    width:100% !important;
    height:100% !important;
    display:block !important;
    object-fit:contain !important;
}

.mini-chat-body{
    background:#faf9fd !important;
}

.message.ai-message,
.ai-message{
    background:#efedf5 !important;
    border:1px solid #dcd7e6 !important;
    color:#30364b !important;
}

.message.user-message,
.user-message{
    background:linear-gradient(135deg,var(--hd-purple-dark),var(--hd-purple)) !important;
    color:#fff !important;
}

.mini-action{
    background:#fff !important;
    border:1px solid #cfc8e7 !important;
    color:var(--hd-text) !important;
}

.mini-action > span{
    color:#5945c7 !important;
}

.mini-action strong{
    color:var(--hd-text) !important;
}

/* ---------- Pricing ---------- */

.pricing-section{
    background:linear-gradient(180deg,#f7f5fb 0%,#fbfafe 100%) !important;
}

.pricing-card{
    background:#fff !important;
    border:1px solid var(--hd-border) !important;
    box-shadow:0 20px 48px rgba(47,40,91,.08) !important;
}

.pricing-name,
.pricing-price,
.price{
    color:var(--hd-text) !important;
}

.pricing-features li,
.pricing-note{
    color:var(--hd-muted) !important;
}

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

.cta-section,
.cta-card{
    background:linear-gradient(135deg,#5b43df 0%,#6750f5 52%,#416fe8 100%) !important;
}

.cta-section h2,
.cta-section p,
.cta-card h2,
.cta-card p{
    color:#fff !important;
}

.cta-section .btn-ghost,
.cta-card .btn-ghost{
    background:#fff !important;
    color:#3f31a0 !important;
    border-color:#fff !important;
}

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

.faq-v14-list,
.faq-v14-item,
.faq-v14 details,
.faq-v14-meta{
    background:#fff !important;
    border-color:var(--hd-border) !important;
}

.faq-v14 summary,
.faq-v14-question,
.faq-v14-meta strong{
    color:var(--hd-text) !important;
}

.faq-v14-answer p,
.faq-v14-meta small{
    color:var(--hd-muted) !important;
}

.faq-v14-index{
    color:#5945c7 !important;
}

/* ---------- Footer ---------- */

.site-footer,
footer{
    background:#f1eff7 !important;
    color:#4f566a !important;
    border-top:1px solid #ded9e8 !important;
}

.site-footer a,
footer a{
    color:#3f4559 !important;
}

.site-footer a:hover,
footer a:hover{
    color:#4938ae !important;
}

/* ---------- Focus / targets ---------- */

a,
button,
summary{
    -webkit-tap-highlight-color:transparent;
}

:focus-visible{
    outline:3px solid var(--hd-focus) !important;
    outline-offset:3px !important;
}

.faq-v14 summary,
.btn,
.usecase-tab,
.desktop-nav a,
.mobile-menu a{
    min-height:44px;
}

/* ---------- Responsive ---------- */

@media (max-width:1100px){
    .desktop-nav{
        display:none !important;
    }

    .desktop-cta{
        display:none !important;
    }

    .menu-toggle{
        display:flex !important;
    }
}

@media (max-width:900px){
    .hai-benefit-list{
        grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    }

    .hai-benefit-list article{
        border-right:1px solid var(--hd-border) !important;
        border-bottom:1px solid var(--hd-border) !important;
    }

    .hai-benefit-list article:nth-child(2n){
        border-right:0 !important;
    }

    .hai-benefit-list article:nth-last-child(-n+2){
        border-bottom:0 !important;
    }
}

@media (max-width:760px){
    body{
        background:#fafafe !important;
    }

    .hai-benefit-list{
        grid-template-columns:1fr !important;
    }

    .hai-benefit-list article{
        border-right:0 !important;
        border-bottom:1px solid var(--hd-border) !important;
    }

    .hai-benefit-list article:last-child{
        border-bottom:0 !important;
    }

    .hai-benefits-head p,
    .hero-lead,
    .section-heading p{
        font-size:1rem !important;
        line-height:1.7 !important;
    }

    .usecase-tabs{
        width:100% !important;
        justify-content:flex-start !important;
    }

    .usecase-tab{
        min-height:46px !important;
    }

    .hero-chat-shell,
    .hai-benefits-main,
    .hai-integration-card,
    .usecase-panel,
    .pricing-card{
        box-shadow:0 12px 32px rgba(47,40,91,.07) !important;
    }
}


/* =========================================================
   v28 — refined light + purple brand balance
   Strong readable CTAs, accessible purple bands and footer.
   ========================================================= */

:root{
    --hd-bg:#fbfbfe;
    --hd-bg-alt:#f6f4fb;
    --hd-surface:#ffffff;
    --hd-surface-soft:#f8f7fc;

    --hd-text:#171a2b;
    --hd-muted:#4f566b;
    --hd-muted-soft:#687087;

    --hd-purple:#6f58f5;
    --hd-purple-dark:#4f38c9;
    --hd-purple-deep:#3f2ca8;
    --hd-blue:#3e67df;
    --hd-cyan:#2f95b8;

    --hd-purple-band-1:#5b43df;
    --hd-purple-band-2:#654df0;
    --hd-purple-band-3:#4169de;

    --hd-border:#ddd9e9;
    --hd-border-strong:#c9c3df;
}

/* Base */
body{
    background:
        radial-gradient(circle at 10% 2%,rgba(111,88,245,.055),transparent 24rem),
        radial-gradient(circle at 90% 3%,rgba(62,103,223,.045),transparent 25rem),
        var(--hd-bg) !important;
    color:var(--hd-text) !important;
}

p,
li,
.hero-lead,
.section-heading p,
.hai-benefits-head p,
.hai-knowledge-copy p,
.hai-benefit-list p,
.hai-integration-point p,
.process-card p,
.usecase-copy > p,
.pricing-heading p,
.pricing-note,
.faq-v14-answer p,
.faq-v14-meta small{
    color:var(--hd-muted) !important;
}

/* Navbar CTA: force readable white text */
.site-header .btn-primary,
.nav-actions .btn-primary,
.desktop-cta{
    background:linear-gradient(135deg,#5338cf 0%,#6548e8 55%,#3f66d8 100%) !important;
    color:#ffffff !important;
    border:1px solid #4a33ba !important;
    box-shadow:0 10px 22px rgba(71,48,180,.20) !important;
    font-weight:750 !important;
}

.site-header .btn-primary *,
.nav-actions .btn-primary *,
.desktop-cta *{
    color:#ffffff !important;
    stroke:#ffffff !important;
}

.site-header .btn-primary:hover,
.nav-actions .btn-primary:hover,
.desktop-cta:hover{
    background:linear-gradient(135deg,#452bb9 0%,#5639d0 55%,#3458c2 100%) !important;
    color:#ffffff !important;
    box-shadow:0 13px 28px rgba(71,48,180,.27) !important;
}

.site-header .btn-primary:focus-visible,
.nav-actions .btn-primary:focus-visible,
.desktop-cta:focus-visible{
    outline:3px solid #2e217e !important;
    outline-offset:3px !important;
}

/* All primary CTA buttons: readable white-on-purple */
.btn-primary,
.faq-v14-primary{
    background:linear-gradient(135deg,#5338cf 0%,#6548e8 55%,#3f66d8 100%) !important;
    color:#fff !important;
    border-color:#4a33ba !important;
    font-weight:750 !important;
}

.btn-primary *,
.faq-v14-primary *{
    color:#fff !important;
    stroke:#fff !important;
}

.btn-primary:hover,
.faq-v14-primary:hover{
    background:linear-gradient(135deg,#452bb9 0%,#5639d0 55%,#3458c2 100%) !important;
    color:#fff !important;
}

/* Hero / main light surfaces */
.hero,
.process-section,
.faq-section,
.faq-v14{
    background:transparent !important;
}

.hai-benefits{
    background:linear-gradient(180deg,#fbfbfe 0%,#f6f4fb 100%) !important;
}

.usecases{
    background:linear-gradient(180deg,#f7f5fb 0%,#f3f0f8 100%) !important;
}

/* Strong purple CTA band, but keep every text element readable */
.cta-section{
    background:
        radial-gradient(circle at 20% 0%,rgba(255,255,255,.10),transparent 28rem),
        linear-gradient(135deg,var(--hd-purple-band-1) 0%,var(--hd-purple-band-2) 48%,var(--hd-purple-band-3) 100%) !important;
    padding-top:84px !important;
    padding-bottom:84px !important;
}

.cta-card{
    background:rgba(255,255,255,.045) !important;
    border:1px solid rgba(255,255,255,.22) !important;
    box-shadow:0 24px 62px rgba(43,31,119,.20) !important;
}

.cta-section h2,
.cta-section h2 *,
.cta-card h2,
.cta-card h2 *,
.cta-section p,
.cta-card p{
    color:#ffffff !important;
    -webkit-text-fill-color:#ffffff !important;
}

.cta-section .gradient-text,
.cta-card .gradient-text{
    background:none !important;
    -webkit-background-clip:initial !important;
    background-clip:initial !important;
    color:#ffffff !important;
    -webkit-text-fill-color:#ffffff !important;
}

.cta-section p,
.cta-card p{
    max-width:760px;
    margin-left:auto;
    margin-right:auto;
    color:rgba(255,255,255,.92) !important;
}

/* In purple CTA section use white / translucent buttons for a clean hierarchy */
.cta-section .btn-primary,
.cta-card .btn-primary{
    background:#ffffff !important;
    color:#3f2ca8 !important;
    border:1px solid #ffffff !important;
    box-shadow:0 10px 24px rgba(31,22,91,.16) !important;
}

.cta-section .btn-primary *,
.cta-card .btn-primary *{
    color:#3f2ca8 !important;
    stroke:#3f2ca8 !important;
}

.cta-section .btn-primary:hover,
.cta-card .btn-primary:hover{
    background:#f4f1ff !important;
    color:#32227f !important;
}

.cta-section .btn-ghost,
.cta-card .btn-ghost{
    background:rgba(255,255,255,.10) !important;
    color:#ffffff !important;
    border:1px solid rgba(255,255,255,.58) !important;
    box-shadow:none !important;
}

.cta-section .btn-ghost *,
.cta-card .btn-ghost *{
    color:#ffffff !important;
    stroke:#ffffff !important;
}

.cta-section .btn-ghost:hover,
.cta-card .btn-ghost:hover{
    background:rgba(255,255,255,.18) !important;
    color:#ffffff !important;
    border-color:#ffffff !important;
}

/* Footer repeats the same purple family */
.site-footer,
footer{
    background:
        radial-gradient(circle at 88% 4%,rgba(105,85,246,.20),transparent 24rem),
        linear-gradient(135deg,#34256f 0%,#3e2c86 50%,#304f9a 100%) !important;
    color:rgba(255,255,255,.86) !important;
    border-top:0 !important;
}

.site-footer h2,
.site-footer h3,
.site-footer h4,
.site-footer strong,
.site-footer .brand-text,
footer h2,
footer h3,
footer h4,
footer strong,
footer .brand-text{
    color:#ffffff !important;
}

.site-footer .brand-text span,
footer .brand-text span{
    color:#b9c8ff !important;
}

.site-footer p,
.site-footer small,
.site-footer .footer-note,
footer p,
footer small,
footer .footer-note{
    color:rgba(255,255,255,.78) !important;
}

.site-footer a,
footer a{
    color:rgba(255,255,255,.90) !important;
}

.site-footer a:hover,
footer a:hover{
    color:#ffffff !important;
}

.site-footer .footer-label,
footer .footer-label{
    color:#c8c2ff !important;
}

.site-footer .btn-primary,
footer .btn-primary{
    background:#ffffff !important;
    color:#37258f !important;
    border-color:#ffffff !important;
}

.site-footer .btn-primary *,
footer .btn-primary *{
    color:#37258f !important;
    stroke:#37258f !important;
}

.site-footer .btn-primary:hover,
footer .btn-primary:hover{
    background:#f2efff !important;
    color:#2d1f76 !important;
}

/* Footer light separators, if present */
.site-footer hr,
footer hr{
    border-color:rgba(255,255,255,.16) !important;
}

/* Maintain clear readable card surfaces */
.process-card,
.hai-integration-card,
.usecase-panel,
.pricing-card,
.faq-v14-list,
.hai-benefits-main{
    background:#ffffff !important;
    border-color:var(--hd-border) !important;
}

/* Secondary outlined CTAs on light background */
.btn-ghost,
.faq-v14-secondary{
    background:#ffffff !important;
    color:#382f61 !important;
    border:1px solid #c9c2dc !important;
    font-weight:700 !important;
}

.btn-ghost:hover,
.faq-v14-secondary:hover{
    background:#f3efff !important;
    color:#392999 !important;
    border-color:#9f93ce !important;
}

/* Text links */
.text-link,
.footer-link{
    color:#4d36bd !important;
    font-weight:700;
}

.text-link:hover,
.footer-link:hover{
    color:#34248a !important;
}

/* Ensure dark readable text inside process cards and use-case copy */
.process-card h3,
.usecase-copy h3,
.hai-integration-point h3,
.hai-benefit-list h3,
.hai-knowledge-copy h3,
.pricing-name,
.pricing-price{
    color:#181b2d !important;
}

/* Better small-label contrast */
.process-number,
.hai-integration-number,
.faq-v14-index{
    color:#5742c2 !important;
}

.usecase-checks span{
    color:#3d4358 !important;
}

/* Mobile */
@media (max-width:760px){
    .cta-section{
        padding-top:64px !important;
        padding-bottom:64px !important;
    }

    .cta-card{
        border-radius:24px !important;
    }

    .site-footer,
    footer{
        background:
            radial-gradient(circle at 95% 0%,rgba(105,85,246,.16),transparent 18rem),
            linear-gradient(150deg,#34256f 0%,#3b2a80 58%,#304b93 100%) !important;
    }
}


/* =========================================================
   v29 — WCAG 2.1 contrast cleanup
   - darker body/supporting text
   - vertical separators for integration steps
   - FAQ purple + controls restored
   ========================================================= */

:root{
    --hd-text:#17192b;
    --hd-body:#3f465b;
    --hd-body-strong:#343a4f;
    --hd-subtle:#565e75;
    --hd-border:#d7d3e4;
    --hd-purple-dark:#4f38c9;
    --hd-purple-deep:#3d299f;
    --hd-purple-soft:#f0edff;
}

/* General light-background readability */
body{
    color:var(--hd-text) !important;
}

p,
li,
small{
    color:var(--hd-body) !important;
}

/* Integration copy: stronger contrast */
.hai-integration-point-head h3{
    color:#17192b !important;
    font-weight:750 !important;
}

.hai-integration-points article > p,
.hai-integration-point p{
    color:#42495f !important;
    opacity:1 !important;
}

.hai-integration-number{
    color:#4f38c9 !important;
    opacity:1 !important;
    font-weight:700 !important;
}

/* The practical example was too pale */
.hai-integration-example{
    background:#f8f7fc !important;
    border-top:1px solid #d7d3e4 !important;
}

.hai-integration-example .hai-example-label,
.hai-example-label{
    color:#4f38c9 !important;
    opacity:1 !important;
    font-weight:800 !important;
}

.hai-integration-example strong,
.hai-example-content strong{
    color:#17192b !important;
}

.hai-integration-example p,
.hai-integration-example span:not(.hai-example-label),
.hai-example-content p,
.hai-example-content p span{
    color:#444b60 !important;
    opacity:1 !important;
}

.hai-example-badge,
.hai-integration-example .hai-example-badge{
    color:#39288f !important;
    background:#f0edff !important;
    border-color:#cfc7f3 !important;
}

/* Three integration steps — visible vertical separators on desktop */
@media (min-width: 901px){
    .hai-integration-points{
        display:grid !important;
        grid-template-columns:repeat(3,minmax(0,1fr)) !important;
        gap:0 !important;
    }

    .hai-integration-points article{
        position:relative !important;
        padding:0 38px !important;
        min-width:0 !important;
    }

    .hai-integration-points article:first-child{
        padding-left:0 !important;
    }

    .hai-integration-points article:last-child{
        padding-right:0 !important;
    }

    .hai-integration-points article + article::before{
        content:"" !important;
        position:absolute !important;
        left:0 !important;
        top:0 !important;
        bottom:0 !important;
        width:1px !important;
        background:#d8d3e6 !important;
    }

    .hai-integration-points article > p{
        max-width:none !important;
    }
}

/* On tablet/mobile use horizontal separators instead */
@media (max-width:900px){
    .hai-integration-points article{
        padding:22px 0 !important;
        border-bottom:1px solid #d8d3e6 !important;
    }

    .hai-integration-points article:first-child{
        padding-top:0 !important;
    }

    .hai-integration-points article:last-child{
        padding-bottom:0 !important;
        border-bottom:0 !important;
    }
}

/* FAQ intro text: increase contrast */
.faq-v14-intro > p,
.faq-v14-meta small{
    color:#4a5167 !important;
    opacity:1 !important;
}

/* FAQ row */
.faq-v14-item,
.faq-v14 details{
    background:#ffffff !important;
}

.faq-v14-item summary{
    display:flex !important;
    align-items:center !important;
    justify-content:space-between !important;
    gap:18px !important;
    min-height:82px !important;
    padding:18px 22px 18px 26px !important;
    cursor:pointer !important;
    color:#17192b !important;
}

.faq-v14-question{
    color:#17192b !important;
    font-weight:750 !important;
}

.faq-v14-index{
    color:#4f38c9 !important;
    font-weight:800 !important;
}

/* Restore + / − control explicitly */
.faq-v14-toggle{
    width:38px !important;
    height:38px !important;
    min-width:38px !important;
    flex:0 0 38px !important;
    display:grid !important;
    place-items:center !important;
    border-radius:11px !important;
    background:#4f38c9 !important;
    border:1px solid #432dad !important;
    color:#ffffff !important;
    opacity:1 !important;
    visibility:visible !important;
    overflow:visible !important;
    box-shadow:0 6px 16px rgba(79,56,201,.16) !important;
}

.faq-v14-toggle svg{
    display:block !important;
    width:18px !important;
    height:18px !important;
    color:#ffffff !important;
    overflow:visible !important;
}

.faq-v14-toggle svg path{
    stroke:#ffffff !important;
}

.faq-v14-item[open] .faq-v14-plus-v{
    opacity:0 !important;
}

.faq-v14-item summary:hover .faq-v14-toggle{
    background:#3f2ca8 !important;
    border-color:#34228f !important;
}

/* Answer readability */
.faq-v14-answer{
    border-top:1px solid #e4e1ec !important;
}

.faq-v14-answer p{
    color:#41485d !important;
    opacity:1 !important;
    line-height:1.72 !important;
}

/* FAQ CTA support text */
.faq-v14-meta strong{
    color:#17192b !important;
}

.faq-v14-meta small{
    color:#4b5268 !important;
}

/* FAQ little help icon */
.faq-v14-meta-icon{
    color:#4f38c9 !important;
    background:#f0edff !important;
    border-color:#d2cbf2 !important;
}

/* Keep secondary / tertiary light copy readable elsewhere */
.process-card p,
.usecase-copy > p,
.pricing-note,
.hai-benefit-list p,
.hai-knowledge-copy p{
    color:#444b60 !important;
    opacity:1 !important;
}

/* Do not allow pale inherited text on light surfaces */
.process-card,
.hai-integration-point,
.faq-v14-list,
.faq-v14-meta{
    --muted:#444b60;
    --muted-2:#565e75;
}

/* Mobile FAQ keeps visible + button */
@media (max-width:760px){
    .faq-v14-item summary{
        min-height:72px !important;
        padding:15px 14px 15px 16px !important;
        gap:12px !important;
    }

    .faq-v14-toggle{
        width:36px !important;
        height:36px !important;
        min-width:36px !important;
        flex-basis:36px !important;
    }

    .faq-v14-question{
        font-size:.95rem !important;
        line-height:1.45 !important;
    }
}


/* =========================================================
   v30 — typography scale + readable light-theme contrast
   ========================================================= */

:root{
    /* Core text colours on light surfaces */
    --hd-ink:#17192a;
    --hd-copy:#40475b;
    --hd-copy-soft:#51596e;
    --hd-label:#5546b8;

    /* A simple, consistent type scale */
    --fs-body:1rem;
    --fs-small:.875rem;
    --fs-label:.75rem;
    --fs-h3:clamp(1.12rem,1.25vw,1.35rem);
    --fs-h2:clamp(2.45rem,3.75vw,4rem);
    --fs-display:clamp(3rem,4.85vw,5.2rem);

    --lh-body:1.72;
    --lh-heading:1.02;
}

/* ---------------------------------------------------------
   Base typography
   --------------------------------------------------------- */

body{
    color:var(--hd-ink) !important;
}

p{
    font-size:var(--fs-body);
    line-height:var(--lh-body);
}

h1,
h2,
h3{
    color:var(--hd-ink) !important;
}

h1,
h2{
    font-weight:600 !important;
}

h3{
    font-size:var(--fs-h3) !important;
    line-height:1.28 !important;
    font-weight:650 !important;
    letter-spacing:-.025em !important;
}

/* Main display title */
.hero-title{
    max-width:1220px;
    margin-inline:auto;
    font-size:var(--fs-display) !important;
    line-height:.98 !important;
    letter-spacing:-.058em !important;
    font-weight:600 !important;
}

/* All major section titles use one scale instead of several oversized values */
.hai-benefits-head h2,
.hai-integrations-copy h2,
.section-heading h2,
.usecases .section-heading h2,
.pricing-heading h2,
.faq-v14 h2{
    font-size:var(--fs-h2) !important;
    line-height:var(--lh-heading) !important;
    letter-spacing:-.05em !important;
    font-weight:600 !important;
}

/* Keep narrower headings visually controlled on very wide monitors */
.hai-benefits-head h2{
    max-width:900px;
}

.hai-integrations-copy h2{
    max-width:820px;
}

.section-heading h2{
    max-width:900px;
}

.faq-v14 h2{
    max-width:650px;
}

/* ---------------------------------------------------------
   Paragraph contrast
   The previous pale grey was too faint on #fff / #fbfbfe.
   --------------------------------------------------------- */

.hero-lead,
.hai-benefits-head > p,
.hai-knowledge-copy > p,
.hai-benefit-list article > p,
.hai-benefits-bottom p,
.hai-integrations-lead,
.hai-integration-points article > p,
.section-heading > p,
.process-card > p,
.usecase-copy > p,
.pricing-heading > p,
.pricing-note,
.pricing-features li,
.faq-v14-intro > p,
.faq-v14-answer p,
.faq-v14-meta small{
    color:var(--hd-copy) !important;
    opacity:1 !important;
}

/* Lead copy can be a touch larger, but stays restrained */
.hero-lead{
    max-width:900px;
    margin-inline:auto;
    font-size:clamp(1rem,1.15vw,1.08rem) !important;
    line-height:1.75 !important;
}

.hai-benefits-head > p,
.hai-integrations-lead,
.section-heading > p,
.pricing-heading > p,
.faq-v14-intro > p{
    font-size:1rem !important;
    line-height:1.72 !important;
}

/* Card/body copy */
.hai-knowledge-copy > p,
.hai-benefit-list article > p,
.hai-integration-points article > p,
.process-card > p,
.usecase-copy > p,
.pricing-note,
.faq-v14-answer p{
    font-size:.95rem !important;
    line-height:1.7 !important;
}

/* Supporting metadata should still be secondary, but readable */
.hero-chat-brand small,
.hero-chat-intro p,
.hai-chat-head small,
.hai-integration-brand small,
.hai-map-item small,
.mini-chat-head small,
.pricing-subtitle,
.faq-v14-meta small{
    color:var(--hd-copy-soft) !important;
    opacity:1 !important;
}

/* Labels / eyebrows */
.hai-kicker,
.card-kicker,
.section-kicker,
.hai-example-label,
.pricing-badge,
.faq-v14-index,
.hai-integration-number,
.process-number{
    color:var(--hd-label) !important;
    opacity:1 !important;
    font-size:var(--fs-label) !important;
    font-weight:700 !important;
}

/* ---------------------------------------------------------
   Component heading cleanup
   --------------------------------------------------------- */

.hai-knowledge-copy h3{
    font-size:clamp(1.65rem,2vw,2.25rem) !important;
    line-height:1.12 !important;
    font-weight:600 !important;
}

.hai-benefit-list h3,
.process-card h3,
.hai-integration-points h3{
    font-size:1.05rem !important;
    line-height:1.32 !important;
    font-weight:650 !important;
}

.usecase-copy h3{
    font-size:clamp(1.8rem,2.5vw,2.75rem) !important;
    line-height:1.08 !important;
    font-weight:600 !important;
}

/* Pricing: keep the price dominant, not the surrounding heading */
.pricing-price,
.price{
    color:var(--hd-ink) !important;
}

.pricing-card h3,
.pricing-name{
    font-size:1.2rem !important;
    font-weight:650 !important;
}

/* ---------------------------------------------------------
   Integration section readability
   --------------------------------------------------------- */

.hai-integration-point-head{
    align-items:flex-start !important;
}

.hai-integration-number{
    flex:0 0 auto;
    min-width:28px;
    padding-top:1px;
    line-height:1.4;
}

.hai-integration-point-head h3{
    color:var(--hd-ink) !important;
}

.hai-integration-example .hai-example-label{
    color:#4a36b3 !important;
}

.hai-integration-example strong{
    color:var(--hd-ink) !important;
}

.hai-integration-example p,
.hai-integration-example p span{
    color:var(--hd-copy) !important;
}

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

.faq-v14-question{
    color:var(--hd-ink) !important;
    font-size:.98rem !important;
    line-height:1.45 !important;
    font-weight:650 !important;
}

.faq-v14-answer p{
    color:var(--hd-copy) !important;
}

/* ---------------------------------------------------------
   Preserve readable inverse text on the brand-purple areas
   --------------------------------------------------------- */

.cta-section,
.cta-card,
.site-footer,
footer{
    color:#fff !important;
}

.cta-section p,
.cta-card p{
    color:rgba(255,255,255,.94) !important;
}

.site-footer p,
.site-footer small,
footer p,
footer small{
    color:rgba(255,255,255,.82) !important;
}

/* ---------------------------------------------------------
   Responsive type scale
   --------------------------------------------------------- */

@media (max-width:900px){
    :root{
        --fs-display:clamp(2.75rem,8vw,4.5rem);
        --fs-h2:clamp(2.2rem,6.5vw,3.5rem);
    }

    .hero-title,
    .hai-benefits-head h2,
    .hai-integrations-copy h2,
    .section-heading h2,
    .pricing-heading h2,
    .faq-v14 h2{
        letter-spacing:-.045em !important;
    }
}

@media (max-width:600px){
    :root{
        --fs-display:clamp(2.45rem,12vw,3.45rem);
        --fs-h2:clamp(2rem,10vw,2.8rem);
        --fs-body:.975rem;
    }

    .hero-title{
        line-height:1.02 !important;
        letter-spacing:-.042em !important;
    }

    .hai-benefits-head h2,
    .hai-integrations-copy h2,
    .section-heading h2,
    .pricing-heading h2,
    .faq-v14 h2{
        line-height:1.05 !important;
        letter-spacing:-.04em !important;
    }

    .hero-lead,
    .hai-benefits-head > p,
    .hai-integrations-lead,
    .section-heading > p,
    .pricing-heading > p,
    .faq-v14-intro > p{
        font-size:.975rem !important;
        line-height:1.68 !important;
    }
}

/* =========================================================
   Helmi Desk — compact footer refinement
   Final override layer
   ========================================================= */

.site-footer{
    position:relative;
    overflow:hidden;
    padding:76px 0 26px !important;
    border-top:0 !important;
    background:
        radial-gradient(circle at 88% 4%,rgba(105,85,246,.20),transparent 24rem),
        linear-gradient(135deg,#34256f 0%,#3e2c86 50%,#304f9a 100%) !important;
    color:#fff !important;
}

.footer-glow{
    position:absolute;
    border-radius:50%;
    pointer-events:none;
}

.footer-glow-one{
    width:620px !important;
    height:380px !important;
    left:-260px !important;
    bottom:-220px !important;
    background:radial-gradient(circle,rgba(111,88,245,.22),transparent 70%) !important;
}

.footer-glow-two{
    width:620px !important;
    height:380px !important;
    right:-250px !important;
    top:-220px !important;
    background:radial-gradient(circle,rgba(91,124,255,.16),transparent 70%) !important;
}

.footer-top{
    position:relative;
    z-index:2;
    display:grid;
    grid-template-columns:minmax(0,1.35fr) minmax(320px,.65fr);
    gap:80px;
    align-items:start;
}

.footer-main{
    max-width:840px;
}

.footer-brand{
    margin-bottom:22px !important;
}

.brand-logo-footer{
    width:46px;
    height:46px;
}

.footer-brand .brand-text{
    font-size:1.02rem;
    font-weight:700;
    letter-spacing:-.025em;
}

.footer-main h2{
    max-width:800px !important;
    margin:0 0 18px !important;
    font-family:Manrope,Inter,sans-serif;
    font-size:clamp(2rem,2.8vw,3.15rem) !important;
    line-height:1.08 !important;
    letter-spacing:-.045em !important;
    font-weight:600 !important;
    color:#fff !important;
}

.footer-main > p{
    max-width:700px !important;
    margin:0 !important;
    color:rgba(255,255,255,.82) !important;
    font-size:.95rem !important;
    line-height:1.7 !important;
}

.footer-cta-row{
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:22px !important;
    margin-top:26px !important;
}

.site-footer .btn-lg{
    min-height:50px;
    padding:0 20px;
    border-radius:14px;
    font-size:.86rem;
}

.site-footer .text-link{
    gap:7px;
    color:rgba(255,255,255,.88) !important;
    font-size:.84rem;
    font-weight:600;
}

.site-footer .text-link:hover{
    color:#fff !important;
}

.footer-links{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:48px !important;
    padding-top:5px !important;
}

.footer-links > div{
    display:flex;
    flex-direction:column;
    gap:11px !important;
}

.site-footer .footer-label{
    margin:0 0 5px !important;
    color:#cfc9ff !important;
    font-size:.65rem !important;
    line-height:1.3 !important;
    font-weight:750 !important;
    letter-spacing:.12em !important;
}

.site-footer .footer-links a{
    width:max-content;
    max-width:100%;
    color:rgba(255,255,255,.78) !important;
    font-size:.8rem !important;
    line-height:1.45;
    font-weight:500;
    transition:color .2s ease;
}

.site-footer .footer-links a:hover{
    color:#fff !important;
}

.footer-bottom{
    position:relative;
    z-index:2;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:24px;
    margin-top:56px !important;
    padding-top:20px !important;
    border-top:1px solid rgba(255,255,255,.15) !important;
    color:rgba(255,255,255,.62) !important;
    font-size:.69rem !important;
}

.footer-bottom p{
    margin:0 !important;
    color:rgba(255,255,255,.62) !important;
    line-height:1.5 !important;
}

@media (max-width:1180px){
    .footer-top{
        grid-template-columns:1fr;
        gap:48px;
    }

    .footer-main{
        max-width:820px;
    }

    .footer-links{
        max-width:520px;
    }
}

@media (max-width:760px){
    .site-footer{
        padding:62px 0 24px !important;
    }

    .footer-top{
        gap:40px;
    }

    .footer-main h2{
        max-width:650px !important;
        font-size:clamp(1.9rem,8vw,2.65rem) !important;
        line-height:1.1 !important;
        letter-spacing:-.04em !important;
    }

    .footer-main > p{
        font-size:.92rem !important;
        line-height:1.65 !important;
    }

    .footer-cta-row{
        gap:16px !important;
        margin-top:22px !important;
    }

    .footer-links{
        gap:34px !important;
    }

    .footer-bottom{
        flex-direction:column;
        align-items:flex-start;
        gap:7px;
        margin-top:42px !important;
    }
}

@media (max-width:520px){
    .site-footer{
        padding-top:54px !important;
    }

    .footer-brand{
        margin-bottom:18px !important;
    }

    .brand-logo-footer{
        width:42px;
        height:42px;
    }

    .footer-main h2{
        font-size:clamp(1.8rem,9.5vw,2.35rem) !important;
    }

    .footer-cta-row{
        align-items:flex-start;
        flex-direction:column;
    }

    .site-footer .btn-lg{
        width:100%;
    }

    .footer-links{
        width:100%;
        grid-template-columns:1fr 1fr;
        gap:28px 22px !important;
    }
}

/* =========================================================
   Helmi Desk — pricing section redesign
   ========================================================= */

.pricing-section{
    position:relative;
    overflow:hidden;
    padding-top:112px !important;
    padding-bottom:112px !important;
}

.pricing-layout{
    position:relative;
    z-index:2;
    display:grid !important;
    grid-template-columns:minmax(0,.82fr) minmax(520px,.68fr) !important;
    gap:clamp(72px,8vw,150px) !important;
    align-items:center !important;
}

.pricing-intro{
    max-width:680px;
}

.pricing-kicker{
    display:inline-block;
    margin-bottom:20px;
    color:#5546b8;
    font-size:.72rem;
    line-height:1.2;
    font-weight:700;
    letter-spacing:.14em;
}

.pricing-intro h2{
    max-width:660px;
    margin:0 0 24px;
    font-family:Manrope,Inter,sans-serif;
    font-size:clamp(2.55rem,3.5vw,4rem) !important;
    line-height:1.04 !important;
    letter-spacing:-.052em !important;
    font-weight:600 !important;
    color:#17192a;
}

.pricing-intro-lead{
    max-width:620px;
    margin:0;
    color:#40475b !important;
    font-size:1rem !important;
    line-height:1.75 !important;
}

.pricing-intro-points{
    max-width:610px;
    display:grid;
    gap:0;
    margin-top:34px;
    border-top:1px solid #ded9e9;
    border-bottom:1px solid #ded9e9;
}

.pricing-intro-point{
    display:grid;
    grid-template-columns:38px 1fr;
    gap:15px;
    align-items:start;
    padding:19px 0;
}

.pricing-intro-point + .pricing-intro-point{
    border-top:1px solid #e6e2ee;
}

.pricing-intro-icon{
    width:34px;
    height:34px;
    display:grid;
    place-items:center;
    border:1px solid #d9d2fb;
    border-radius:10px;
    background:#f3f0ff;
    color:#5b47d6;
}

.pricing-intro-icon svg{
    width:17px;
    height:17px;
}

.pricing-intro-point strong{
    display:block;
    margin:1px 0 4px;
    color:#17192a;
    font-size:.9rem;
    line-height:1.4;
    font-weight:650;
}

.pricing-intro-point p{
    max-width:520px;
    margin:0;
    color:#51596e !important;
    font-size:.84rem !important;
    line-height:1.6 !important;
}

.pricing-vat-note{
    margin:18px 0 0;
    color:#656c7e !important;
    font-size:.76rem !important;
    line-height:1.5 !important;
}

/* Keep the existing pricing card as the visual anchor. */
.pricing-layout .pricing-card{
    width:100%;
    max-width:665px;
    justify-self:end;
}

/* Improve text contrast inside the light pricing card. */
.pricing-card .pricing-card-top p,
.pricing-card .setup-price span,
.pricing-card .pricing-note{
    color:#51596e !important;
}

.pricing-card .pricing-features li{
    color:#343b50 !important;
}

.pricing-card .price-period{
    color:#17192a !important;
}

@media (max-width:1180px){
    .pricing-layout{
        grid-template-columns:1fr !important;
        gap:48px !important;
    }

    .pricing-intro{
        max-width:760px;
    }

    .pricing-intro h2{
        max-width:720px;
    }

    .pricing-intro-lead,
    .pricing-intro-points{
        max-width:680px;
    }

    .pricing-layout .pricing-card{
        max-width:720px;
        justify-self:start;
    }
}

@media (max-width:760px){
    .pricing-section{
        padding-top:88px !important;
        padding-bottom:88px !important;
    }

    .pricing-layout{
        gap:38px !important;
    }

    .pricing-kicker{
        margin-bottom:16px;
    }

    .pricing-intro h2{
        margin-bottom:19px;
        font-size:clamp(2.15rem,10vw,3rem) !important;
        line-height:1.06 !important;
        letter-spacing:-.045em !important;
    }

    .pricing-intro-lead{
        font-size:.94rem !important;
        line-height:1.68 !important;
    }

    .pricing-intro-points{
        margin-top:27px;
    }

    .pricing-intro-point{
        grid-template-columns:34px 1fr;
        gap:13px;
        padding:17px 0;
    }

    .pricing-intro-icon{
        width:32px;
        height:32px;
    }
}

@media (max-width:520px){
    .pricing-section{
        padding-top:76px !important;
        padding-bottom:76px !important;
    }

    .pricing-intro h2{
        font-size:clamp(2rem,10.5vw,2.65rem) !important;
    }

    .pricing-intro-point p{
        font-size:.81rem !important;
    }
}