/* AEVORON labs: well scene, CFD, Lift Select, mesh, translator, Connect v2, mega menu v2. */
html { scrollbar-color: #2A3A3E #0B1113; }
p { text-wrap: pretty; }
.fi, .arc-card, .tl-c { position: relative; }
.fi::after, .tl-c::after { content: ""; position: absolute; inset: 0; border-radius: inherit; pointer-events: none; opacity: 0; transition: opacity .35s; background: radial-gradient(220px circle at var(--mx, 50%) var(--my, 0%), color-mix(in srgb, var(--pa) 12%, transparent), transparent 70%); }
.fi:hover::after, .tl-c:hover::after { opacity: 1; }
.btn { overflow: hidden; }
.btn-ice::before { content: ""; position: absolute; inset: 0; background: linear-gradient(105deg, transparent 35%, rgba(255,255,255,.2) 50%, transparent 65%); transform: translateX(-110%); transition: transform .9s var(--ease); pointer-events: none; }
.btn-ice:hover::before { transform: translateX(110%); }

/* Scroll-driven motion where the browser supports it; other browsers simply show the content */
@supports (animation-timeline: view()) {
  @media (prefers-reduced-motion: no-preference) {
    .demo { animation: sdIn linear both; animation-timeline: view(); animation-range: entry 0% entry 34%; }
  }
  @media (prefers-reduced-motion: no-preference) and (max-width: 1079px) {
    .hdr::after { content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 1px; background: var(--brand-lite); transform-origin: left; animation: sdBar linear both; animation-timeline: scroll(root); }
  }
}
@keyframes sdIn { from { opacity: .35; transform: translateY(26px) scale(.985); } }
@keyframes sdBar { from { transform: scaleX(0); } to { transform: scaleX(1); } }

/* Mega menu v2: modules, then products */
.mega { max-height: calc(100vh - 72px); max-height: calc(100svh - 72px); overflow-y: auto; overscroll-behavior: contain; }
.mega-in { grid-template-columns: minmax(0, 1.08fr) minmax(0, 1fr) minmax(0, .72fr) minmax(0, .82fr); padding-block: 22px; }
.mega-lb { display: block; margin: 6px 0 2px; font-family: var(--mono); font-size: .58rem; letter-spacing: .14em; text-transform: uppercase; color: #5E7375; }
.mega-ms { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 8px; }
.nav .mega a.mega-m { display: flex; align-items: center; gap: 8px; padding: 5px 6px; margin-inline: -6px; font-size: .8rem; line-height: 1.2; border-radius: 3px; color: #C5D2D2; transition: background .2s, color .2s; }
.nav .mega a.mega-m:hover { background: rgba(255,255,255,.055); color: #fff; }
.mega-m .pic-i { width: 15px; height: 15px; }
.mega-side .mega-lb:first-child { margin-top: 0; }
.nav .mega a.mega-l { padding: 5px 8px; }
.hdr-light .hdr.scrolled .nav .mega a.mega-m { color: #C5D2D2; }

/* Mobile menu accordion */
.mnav .m-d { margin: -2px 0 4px; border: 1px solid rgba(255,255,255,.08); border-top: 0; border-radius: 0 0 4px 4px; }
.mnav .m-d summary { padding: 9px 12px; font-family: var(--mono); font-size: .62rem; letter-spacing: .12em; text-transform: uppercase; color: #8DA3A4; cursor: pointer; min-height: 36px; }
.mnav .m-d div { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 10px; padding: 0 12px 10px; }
.mnav .m-d a { display: flex; align-items: center; gap: 8px; padding: 8px 0; font-family: var(--body); font-size: .86rem; letter-spacing: 0; line-height: 1.2; border-bottom: 0; }
.mnav .m-d a .pic-i, .mnav .m-d a img { width: 18px; height: 18px; flex: none; }
.mnav .m-d .mega-lb { grid-column: 1 / -1; margin-top: 8px; }

/* Shared scenario buttons */
.wl-sc { display: flex; flex-wrap: wrap; gap: 6px; padding: 10px 14px; border-bottom: 1px solid var(--dl2); }
.wl-sc button { font: inherit; font-size: .76rem; padding: 6px 11px; min-height: 36px; color: var(--dm); background: none; border: 1px solid var(--dl); border-radius: 18px; cursor: pointer; transition: color .2s, border-color .2s, background .2s; }
.wl-sc button:hover { color: var(--df); }
.wl-sc button[aria-pressed="true"] { color: var(--df); border-color: var(--brand-lite); background: rgba(255,255,255,.04); }
.wl-sc .wl-raw { margin-left: auto; font-family: var(--mono); font-size: .66rem; letter-spacing: .06em; border-style: dashed; }
.demo-h b { min-width: 0; }

/* Well scene */
.wl-g3 { display: grid; grid-template-columns: minmax(0, 120px) minmax(0, 1fr) minmax(0, 210px); gap: 12px; padding: 14px; align-items: start; }
.wl-g3 figure { margin: 0; min-width: 0; }
.wl-g3 figcaption { font-family: var(--mono); font-size: .58rem; letter-spacing: .08em; text-transform: uppercase; color: var(--dm); margin-bottom: 8px; min-height: 2.6em; line-height: 1.3; }
.wl-s, .wl-t { width: 100%; height: 360px; display: block; }
.wl-c canvas { display: block; width: 100%; height: 320px; margin-top: 30px; border-radius: 3px; background: #080E11; }
.wl-air { fill: #0D1417; }
.wl-b { stroke: rgba(255,255,255,.05); }
svg .wl-a { fill: #201F1B; } svg .wl-b { fill: #1C211F; } svg .wl-c { fill: #222522; } svg .wl-d { fill: #1D2221; } svg .wl-r { fill: #3A331C; } svg .wl-e { fill: #1A1E1F; }
.wl-g { stroke: #8DA3A4; stroke-width: 1; fill: none; }
.wl-cem { fill: rgba(141,163,164,.15); }
.wl-cs { stroke: #8DA3A4; stroke-width: 1.4; fill: none; }
.wl-tb { stroke: #C5D2D2; stroke-width: 1.2; fill: none; }
.wl-pump { fill: #5BB8E6; }
.wl-pf { stroke: #E0A036; stroke-width: 1.4; }
.wl-fb { stroke: #5CBCAE; stroke-width: 1.2; fill: none; }
.wl-pulse { stroke: #fff; stroke-width: 2; stroke-dasharray: 8 90; animation: wlP 1.8s linear infinite; }
@keyframes wlP { to { stroke-dashoffset: -98; } }
.wl-box { fill: #131E22; stroke: #5CBCAE; }
.wl-s text { font-family: var(--mono); font-size: 6.5px; fill: #E6EDEC; }
.wl-m { stroke: #E0A036; stroke-width: 1.6; fill: none; }
.wl-m2 { stroke: #E0A036; stroke-width: 1.4; fill: rgba(224,160,54,.2); animation: lv 1.6s infinite; }
.wl-t text { font-family: var(--mono); font-size: 8px; fill: var(--dm); }
.wl-t .g { stroke: var(--dl2); }
.wl-t .geo { fill: none; stroke: var(--brand-lite); stroke-dasharray: 3 3; stroke-width: 1.2; }
.wl-t .now { fill: none; stroke: var(--signal); stroke-width: 1.8; }
.wl-note { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 3fr) minmax(0, 3fr); gap: 8px 18px; padding: 12px 14px; border-top: 1px solid var(--dl); font-size: .82rem; line-height: 1.45; color: var(--dm); }
.wl-note b { color: var(--df); font-family: var(--display); font-weight: 500; font-size: .96rem; }
.wl-note i { display: block; font-style: normal; font-family: var(--mono); font-size: .58rem; letter-spacing: .12em; color: var(--brand-lite); }
@media (max-width: 760px) {
  .wl-g3 { grid-template-columns: minmax(0, 92px) minmax(0, 1fr); }
  .wl-c { grid-column: 1 / -1; grid-row: 2; }
  .wl-c canvas { height: 230px; margin-top: 0; }
  .wl-s, .wl-t { height: 300px; }
  .wl-note { grid-template-columns: minmax(0, 1fr); }
  .wl-sc .wl-raw { margin-left: 0; }
}

/* CFD */
.cf-c { display: block; width: 100%; height: auto; background: #080E11; }
.cf-b { display: grid; grid-template-columns: minmax(0, 2fr) auto; gap: 12px 24px; align-items: center; padding: 10px 14px; border-top: 1px solid var(--dl2); }
.cf-r { display: flex; flex-wrap: wrap; gap: 6px 14px; color: var(--dm); text-transform: none; letter-spacing: .03em; }
.cf-r b { color: var(--df); font-weight: 500; }
.cf-n { padding: 0 14px 10px; font-size: .84rem; color: var(--dm); line-height: 1.45; }
.cf-lg { display: flex; align-items: center; gap: 8px; padding: 0 14px 12px; font-family: var(--mono); font-size: .58rem; letter-spacing: .06em; color: var(--dm); }
.cf-lg i { flex: 0 1 160px; height: 5px; border-radius: 3px; background: linear-gradient(90deg, #080E11, #0B3E42, #12897C, #5CBCAE, #E0A036, #FFF0D6); border: 1px solid var(--dl2); }
@media (max-width: 620px) { .cf-b { grid-template-columns: minmax(0, 1fr); } }

/* FAQ */
.faq { border-top: 1px solid var(--line); }
.faq details { border-bottom: 1px solid var(--line); }
.faq summary { display: flex; justify-content: space-between; gap: 20px; align-items: center; padding: 16px 0; min-height: 48px; cursor: pointer; list-style: none; font-family: var(--display); font-weight: 500; font-size: 1.02rem; line-height: 1.3; }
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: ""; flex: none; width: 9px; height: 9px; border-right: 1.5px solid var(--acc); border-bottom: 1.5px solid var(--acc); transform: rotate(45deg) translate(-2px, -2px); transition: transform .3s var(--ease); }
.faq details[open] summary::after { transform: rotate(-135deg) translate(-2px, -2px); }
.faq p { padding-bottom: 18px; max-width: 72ch; color: var(--fg-mute); font-size: .94rem; }

/* Lift Select */
.ls-g { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); }
.ls-i { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px 18px; padding: 16px; border-right: 1px solid var(--dl); align-content: start; }
.ls-r0 { min-width: 0; }
.ls-o { display: grid; border-bottom: 1px solid var(--dl); }
.ls-b { position: relative; display: grid; grid-template-columns: 22px minmax(0, 1fr) auto; gap: 8px; align-items: center; min-height: 46px; padding: 8px 14px; background: none; border: 0; border-bottom: 1px solid var(--dl2); color: var(--df); font: inherit; text-align: left; cursor: pointer; overflow: hidden; }
.ls-b:last-child { border-bottom: 0; }
.ls-b i { position: absolute; left: 0; bottom: 0; height: 2px; width: var(--w); background: var(--dm); transition: width .6s var(--ease); }
.ls-b:first-child i { background: var(--brand-lite); }
.ls-b.on { background: rgba(255,255,255,.045); }
.ls-b b { font-weight: 500; font-size: .92rem; }
.ls-n { font-family: var(--mono); font-size: .66rem; color: var(--dm); }
.ls-b em { font-style: normal; font-family: var(--display); font-size: 1.12rem; font-variant-numeric: tabular-nums; }
.ls-d { padding: 14px; display: grid; gap: 10px; }
.ls-d h4 { font-family: var(--display); font-size: 1.04rem; font-weight: 500; letter-spacing: 0; }
.ls-k { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1px; background: var(--dl2); border: 1px solid var(--dl2); border-radius: 4px; overflow: hidden; }
.ls-k div { background: var(--dbg); padding: 8px 10px; min-width: 0; }
.ls-k span { display: block; font-size: .68rem; color: var(--dm); line-height: 1.25; }
.ls-k b { display: block; margin-top: 2px; font-weight: 500; font-size: .86rem; line-height: 1.3; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.ls-r { list-style: none; margin: 0; padding: 0; display: grid; gap: 4px; font-size: .8rem; line-height: 1.35; color: var(--dm); }
.ls-r li { padding-left: 16px; position: relative; }
.ls-r li::before { content: "·"; position: absolute; left: 3px; }
.ls-r li.p::before { content: "+"; color: var(--ok); }
.ls-r li.m::before { content: "−"; color: var(--signal); }
@media (max-width: 860px) { .ls-g { grid-template-columns: minmax(0, 1fr); } .ls-i { border-right: 0; border-bottom: 1px solid var(--dl); } }
@media (max-width: 420px) { .ls-i { grid-template-columns: minmax(0, 1fr); } }

/* Mesh */
.mh-c { display: flex; flex-wrap: wrap; gap: 6px; padding: 10px 14px; border-bottom: 1px solid var(--dl2); }
.mh-t { display: inline-flex; align-items: center; gap: 7px; min-height: 36px; padding: 5px 11px; border: 1px solid var(--dl); border-radius: 18px; font-size: .76rem; cursor: pointer; }
.mh-t input { accent-color: var(--brand-lite); width: 15px; height: 15px; margin: 0; }
.mh svg { display: block; width: 100%; height: auto; }
.mh-l { stroke-width: 1.5; stroke-dasharray: 4 4; vector-effect: non-scaling-stroke; transition: stroke .3s, opacity .3s; }
.mh-l.bt { stroke: #5CBCAE; } .mh-l.lora { stroke: #5BB8E6; } .mh-l.wifi { stroke: #C5D2D2; } .mh-l.sat { stroke: #E2A765; }
.mh-l.off { opacity: .12; }
.mh-l.act { stroke-width: 3; stroke-dasharray: none; }
.mh-n rect, .mh-n path, .mh-n circle { fill: #131E22; stroke: #C5D2D2; stroke-width: 1.2; }
.mh-n text { font-size: 10px; font-family: var(--mono); fill: var(--dm); stroke: #0E1619; stroke-width: 3px; paint-order: stroke; }
.mh-d { fill: var(--signal); stroke: #fff; stroke-width: 1; }
.mh-f { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 12px 18px; align-items: center; padding: 12px 14px; border-top: 1px solid var(--dl); }
.mh-res { display: grid; gap: 1px; font-size: .8rem; color: var(--dm); line-height: 1.35; }
.mh-res b { font-weight: 500; font-size: .9rem; color: var(--ok); }
.mh-res.q b { color: var(--signal); }
.mh-s { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.mh-s select { min-height: 40px; background: var(--dbg2); color: var(--df); border: 1px solid var(--dl); border-radius: 3px; padding: 6px 8px; font: inherit; font-size: .8rem; }
@media (max-width: 620px) { .mh-f { grid-template-columns: minmax(0, 1fr); } }

/* Translator */
.tn-g { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.tn-b { padding: 16px; min-height: 174px; display: grid; gap: 10px; align-content: start; position: relative; min-width: 0; }
.tn-b + .tn-b { border-left: 1px solid var(--dl); background: rgba(92,188,174,.035); }
.tn-src, .tn-out { font-size: 1.04rem; line-height: 1.5; overflow-wrap: anywhere; }
.tn-b mark { background: rgba(92,188,174,.16); color: #BDEDE4; padding: 0 3px; border-radius: 2px; }
.tn-h { color: var(--dm); }
.tn-l { display: flex; flex-wrap: wrap; gap: 4px; }
.tn-l button { font: inherit; font-size: .72rem; min-height: 32px; padding: 4px 9px; color: var(--dm); background: none; border: 1px solid transparent; border-radius: 3px; cursor: pointer; }
.tn-l button[aria-pressed="true"] { color: var(--df); border-color: var(--brand-lite); }
.tn-wave { display: none; gap: 3px; align-items: center; height: 28px; }
.tn-wave.on { display: flex; }
.tn-wave i { width: 3px; height: 100%; background: var(--brand-lite); border-radius: 2px; transform-origin: center; animation: tnW .9s ease-in-out infinite; }
.tn-wave i:nth-child(2n) { animation-delay: -.3s; } .tn-wave i:nth-child(3n) { animation-delay: -.55s; } .tn-wave i:nth-child(5n) { animation-delay: -.15s; }
@keyframes tnW { 0%, 100% { transform: scaleY(.25); } 50% { transform: scaleY(1); } }
.tn-f { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 10px; padding: 10px 14px; border-top: 1px solid var(--dl); }
.tn-info { text-transform: none; letter-spacing: .03em; color: var(--dm); }
.tn-act { display: flex; flex-wrap: wrap; gap: 8px; }
@media (max-width: 680px) { .tn-g { grid-template-columns: minmax(0, 1fr); } .tn-b + .tn-b { border-left: 0; border-top: 1px solid var(--dl); } .tn-b { min-height: 138px; } }

/* Connect v2 */
.cn-in.cn2 { grid-template-rows: auto auto minmax(0, 1fr); height: 620px; }
.cn-t { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border-bottom: 1px solid var(--dl); background: var(--dbg2); }
.cn-t button { font: inherit; font-size: .72rem; min-height: 38px; padding: 6px 2px; color: var(--dm); background: none; border: 0; border-bottom: 2px solid transparent; cursor: pointer; }
.cn-t button[aria-selected="true"] { color: var(--df); border-bottom-color: var(--brand-lite); }
.cn-p { min-height: 0; overflow-y: auto; overscroll-behavior: contain; }
.cn-chat { display: grid; grid-template-rows: auto minmax(0, 1fr) auto; overflow: hidden; }
.mt, .wa { padding: 12px; display: grid; gap: 10px; align-content: start; font-size: .8rem; }
.mt-h b { display: block; font-weight: 500; font-size: .9rem; }
.mt-h small { color: var(--dm); font-size: .68rem; }
.mt-w { display: flex; gap: 6px; }
.mt-w span { display: grid; place-items: center; width: 36px; height: 36px; border-radius: 50%; background: var(--dbg2); border: 1px solid var(--dl); font-family: var(--mono); font-size: .6rem; transition: box-shadow .3s, border-color .3s; }
.mt-w span.sp { border-color: var(--brand-lite); box-shadow: 0 0 0 3px rgba(92,188,174,.2); }
.mt-cap { min-height: 94px; padding: 9px 10px; border-radius: 6px; background: var(--dbg2); line-height: 1.4; }
.mt-cap small { display: block; font-family: var(--mono); font-size: .54rem; color: var(--dm); margin-bottom: 3px; }
.mt-cap .tr { margin-top: 4px; color: #BDEDE4; font-size: .74rem; }
.mt-l { font-size: .58rem; }
.mt-a { list-style: none; margin: 0; padding: 0; display: grid; gap: 4px; min-height: 104px; align-content: start; }
.mt-a li { display: flex; justify-content: space-between; gap: 8px; padding: 6px 8px; border: 1px solid var(--dl2); border-radius: 4px; font-size: .72rem; animation: slIn .4s var(--ease) both; }
.mt-a b { font-weight: 500; }
.mt-a span { color: var(--dm); text-align: right; }
.wa-k { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; }
.wa-k div { padding: 7px; background: var(--dbg2); border-radius: 4px; min-width: 0; }
.wa-k span { display: block; font-size: .6rem; color: var(--dm); }
.wa-k b { display: block; font-weight: 500; font-size: .78rem; line-height: 1.2; }
.wa-s { display: block; width: 100%; height: auto; }
.wa-s text { font-family: var(--mono); font-size: 8px; fill: var(--dm); }
.wa-t { list-style: none; margin: 0; padding: 0 0 0 10px; display: grid; gap: 5px; border-left: 1px solid var(--dl); font-size: .72rem; color: var(--dm); line-height: 1.3; }
.wa-t b { display: inline-block; width: 36px; color: var(--df); font-weight: 500; font-family: var(--mono); font-size: .64rem; }
.wa-ai { padding: 8px 10px; border: 1px solid rgba(92,188,174,.35); border-radius: 5px; }
.wa-ai .mono { font-size: .54rem; }
.wa-ai p { font-size: .74rem; line-height: 1.38; margin-top: 2px; }
.wa .dbtn { width: 100%; }

/* Technology teasers */
.tl { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.tl-c { display: grid; gap: 10px; align-content: start; padding: 22px; border: 1px solid var(--line); border-radius: 6px; background: var(--ink); --fg: #E6EDEC; --fg-mute: #8DA3A4; overflow: hidden; color: var(--fg); transition: border-color .3s, transform .5s var(--ease); }
.tl-c:hover { border-color: var(--pa); transform: translateY(-3px); }
.tl-c svg.art { width: 100%; height: 92px; display: block; }
.tl-c h3 { font-size: 1.14rem; font-weight: 500; }
.tl-c p { font-size: .9rem; line-height: 1.5; color: var(--fg-mute); }
@media (max-width: 860px) { .tl { grid-template-columns: minmax(0, 1fr); } }

/* 3D ground */
.gd { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 4fr); }
.gd canvas { display: block; width: 100%; height: 420px; cursor: grab; touch-action: pan-y; background: radial-gradient(closest-side, #1a1610, #0B1113); }
.gd canvas:active { cursor: grabbing; }
.gd-l { padding: 18px; border-left: 1px solid var(--dl); display: grid; gap: 10px; align-content: center; font-size: .84rem; }
.gd-l div { display: flex; align-items: center; gap: 10px; }
.gd-l i { width: 14px; height: 14px; border-radius: 2px; flex: none; }
.gd-l small { color: var(--dm); display: block; font-size: .72rem; }
@media (max-width: 760px) { .gd { grid-template-columns: minmax(0, 1fr); } .gd canvas { height: 300px; } .gd-l { border-left: 0; border-top: 1px solid var(--dl); } }
.tl-p { animation: wlP 1.6s linear infinite; }
.tl-f { animation: tlF 1.1s linear infinite; }
@keyframes tlF { to { stroke-dashoffset: -40; } }
@media (prefers-reduced-motion: reduce) { .tl-p, .tl-f, .wl-pulse, .wl-m2, .tn-wave i { animation: none; } }
.ls-as { font-size: .7rem; line-height: 1.4; color: var(--df3); }
@media (max-width: 620px) { .mh-n text { font-size: 17px; stroke-width: 4px; } .mh-d { r: 7; } }
/* Short laptop screens: the sheet caption would run into the depth scale */
@media (min-width: 1080px) and (max-height: 820px) { .rail .rt { display: none; } }
/* Phones and tablets: the X-ray lens stays behind the text and never covers it */
@media (max-width: 1079px) {
  .hero .hero-body { position: relative; z-index: 2; }
  .hero .xray { z-index: 1; opacity: .42; pointer-events: none; }
}

/* Uzbek okina: IBM Plex Sans draws it with a wide gap. A later face of the same family takes over
   only these two code points, using Manrope's narrower glyph (the file is already loaded for headings). */
@font-face { font-family: "IBM Plex Sans"; src: url(fonts/manrope-latin.woff2) format("woff2"); font-weight: 400 600; font-style: normal; font-display: swap; unicode-range: U+02BB-02BC; }

/* Phones: Safari balances the words before they are split into lines, which leaves one-word lines */
@media (max-width: 680px) { .hero h1, .phero h1 { text-wrap: wrap; } }