/*
 * HiLine corporate interface
 * Visual thesis: one dependable line connecting cloud, network and IDC.
 * Glass is intentionally limited to navigation; the rest uses quiet,
 * architectural surfaces inspired by precision infrastructure hardware.
 */

:root {
    --hl-ink: #0b0d10;
    --hl-ink-2: #171b21;
    --hl-paper: #f4f6f8;
    --hl-white: #ffffff;
    --hl-steel: #677180;
    --hl-steel-2: #8b95a3;
    --hl-line: #dfe4ea;
    --hl-line-dark: rgba(255, 255, 255, 0.12);
    --hl-blue: #0969e8;
    --hl-blue-deep: #064da9;
    --hl-blue-pale: #eaf3ff;
    --hl-signal: #73c5ff;
    --hl-green: #31c16b;
    --hl-dark: #080b0f;
    --hl-radius: 16px;
    --hl-ease: cubic-bezier(0.2, 0.8, 0.2, 1);
}

html {
    scroll-behavior: smooth;
    scroll-padding-top: 76px;
    background: var(--hl-paper);
}

body.hiline-ui {
    margin: 0;
    color: var(--hl-ink);
    background: var(--hl-paper) !important;
    font-family: "Avenir Next", Avenir, "PingFang SC", "Noto Sans SC", "Microsoft YaHei", sans-serif !important;
    font-synthesis: none;
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
    overflow-x: clip;
}

body.hiline-ui * {
    box-sizing: border-box;
}

body.hiline-ui ::selection {
    color: #fff;
    background: var(--hl-blue);
}

body.hiline-ui :focus-visible {
    outline: 3px solid rgba(9, 105, 232, 0.34) !important;
    outline-offset: 3px;
}

body.hiline-ui a,
body.hiline-ui button,
body.hiline-ui input,
body.hiline-ui select,
body.hiline-ui textarea {
    -webkit-tap-highlight-color: transparent;
    touch-action: manipulation;
}

.hiline-skip-link {
    position: fixed;
    z-index: 1000;
    top: 12px;
    left: 16px;
    padding: 0.7rem 1rem;
    border: 1px solid rgba(255, 255, 255, 0.68);
    border-radius: 12px;
    color: #fff;
    background: #31323a;
    box-shadow: 0 12px 30px rgba(31, 32, 38, 0.22);
    transform: translateY(-160%);
    transition: transform 160ms ease;
}

.hiline-skip-link:focus-visible {
    transform: translateY(0);
}

body.hiline-ui h1,
body.hiline-ui h2,
body.hiline-ui h3,
body.hiline-ui h4 {
    color: var(--hl-ink) !important;
    text-wrap: balance;
}

body.hiline-ui .text-gray-900,
body.hiline-ui .text-dark {
    color: var(--hl-ink) !important;
}

body.hiline-ui .text-gray-700,
body.hiline-ui .text-gray-600 {
    color: var(--hl-steel) !important;
}

body.hiline-ui .text-gray-500,
body.hiline-ui .text-gray-400 {
    color: var(--hl-steel-2) !important;
}

body.hiline-ui .text-primary {
    color: var(--hl-blue) !important;
}

/* Navigation — a quiet, full-width translucent system bar. */
body.hiline-ui nav.hiline-nav {
    top: 0 !important;
    right: 0 !important;
    left: 0 !important;
    width: 100%;
    min-height: 68px;
    border: 0 !important;
    border-bottom: 1px solid rgba(11, 13, 16, 0.08) !important;
    border-radius: 0;
    background: rgba(248, 249, 251, 0.82) !important;
    box-shadow: none !important;
    transform: none;
    -webkit-backdrop-filter: saturate(160%) blur(22px);
    backdrop-filter: saturate(160%) blur(22px);
    transition: background-color 220ms ease, border-color 220ms ease;
}

body.hiline-ui nav.hiline-nav.is-scrolled {
    background: rgba(248, 249, 251, 0.94) !important;
    border-bottom-color: rgba(11, 13, 16, 0.12) !important;
}

body.hiline-ui nav.hiline-nav > .max-w-7xl,
body.hiline-ui nav.hiline-nav > .container {
    width: min(100%, 1380px);
    max-width: 1380px !important;
}

body.hiline-ui nav.hiline-nav [class~="h-16"] {
    height: 68px !important;
}

body.hiline-ui nav.hiline-nav img {
    width: auto;
    height: 34px !important;
    object-fit: contain;
}

body.hiline-ui nav.hiline-nav a,
body.hiline-ui nav.hiline-nav button {
    color: rgba(11, 13, 16, 0.76) !important;
    font-size: 13px;
    font-weight: 570;
    letter-spacing: 0.005em;
    white-space: nowrap;
}

body.hiline-ui nav.hiline-nav a:not(.hiline-action):hover,
body.hiline-ui nav.hiline-nav button:hover {
    color: var(--hl-blue) !important;
}

body.hiline-ui nav.hiline-nav [class*="space-x-8"] > :not([hidden]) ~ :not([hidden]) {
    margin-left: clamp(0.8rem, 1.7vw, 1.75rem) !important;
}

body.hiline-ui nav.hiline-nav .group > div[class*="absolute"][class*="top-full"],
body.hiline-ui #lang-dropdown {
    margin-top: 10px !important;
    padding: 6px;
    border: 1px solid rgba(11, 13, 16, 0.09) !important;
    border-radius: 12px !important;
    background: rgba(250, 251, 252, 0.94) !important;
    box-shadow: 0 18px 50px rgba(11, 13, 16, 0.13) !important;
    -webkit-backdrop-filter: blur(22px);
    backdrop-filter: blur(22px);
    overflow: hidden;
}

body.hiline-ui nav.hiline-nav .group > div[class*="absolute"][class*="top-full"] a,
body.hiline-ui #lang-dropdown button {
    border-radius: 8px;
}

body.hiline-ui nav.hiline-nav .group > div[class*="absolute"][class*="top-full"] a:hover,
body.hiline-ui #lang-dropdown button:hover,
body.hiline-ui #lang-dropdown .lang-option.active {
    background: var(--hl-blue-pale) !important;
}

body.hiline-ui nav.hiline-nav > .hiline-lang-floating {
    position: absolute !important;
    top: 12px !important;
    right: 24px !important;
    z-index: 60;
}

body.hiline-ui nav.hiline-nav #lang-dropdown-btn {
    min-height: 42px;
    padding: 0 13px !important;
    border: 1px solid rgba(11, 13, 16, 0.1) !important;
    border-radius: 10px !important;
    background: rgba(255, 255, 255, 0.56) !important;
    box-shadow: none !important;
}

body.hiline-subpage nav.hiline-nav [class~="h-16"] > a:last-child:not(:first-child) {
    margin-right: 146px !important;
}

body.hiline-ui #mobile-menu {
    margin: 0;
    padding: 8px 10px 12px;
    border: 0 !important;
    border-top: 1px solid rgba(11, 13, 16, 0.08) !important;
    border-radius: 0;
    background: rgba(248, 249, 251, 0.98) !important;
    box-shadow: 0 20px 45px rgba(11, 13, 16, 0.1);
}

body.hiline-ui #mobile-menu a {
    padding: 12px 10px !important;
    border-radius: 7px !important;
}

body.hiline-ui #mobile-menu a:hover {
    background: var(--hl-blue-pale) !important;
}

/* Hero — the network is the product, not decoration. */
body.hiline-ui .hiline-hero {
    position: relative;
    isolation: isolate;
    min-height: 540px;
    padding-top: clamp(8.5rem, 12vw, 10.5rem) !important;
    padding-bottom: clamp(5rem, 8vw, 7rem) !important;
    background:
        linear-gradient(rgba(11, 13, 16, 0.035) 1px, transparent 1px),
        linear-gradient(90deg, rgba(11, 13, 16, 0.035) 1px, transparent 1px),
        #f7f8fa !important;
    background-size: 64px 64px, 64px 64px, auto !important;
    overflow: hidden;
}

body.hiline-ui .hiline-hero::after {
    position: absolute;
    z-index: -1;
    right: -18%;
    bottom: -65%;
    width: 70%;
    aspect-ratio: 1;
    border: 1px solid rgba(9, 105, 232, 0.12);
    border-radius: 50%;
    box-shadow: 0 0 0 80px rgba(9, 105, 232, 0.025), 0 0 0 160px rgba(9, 105, 232, 0.018);
    content: "";
}

body.hiline-ui.hiline-home .hiline-hero {
    min-height: min(880px, 94vh);
    display: flex;
    align-items: center;
}

body.hiline-ui.hiline-home .hiline-hero > div {
    width: min(100%, 1380px);
    max-width: 1380px !important;
}

body.hiline-ui.hiline-home .hiline-hero > div > .grid {
    grid-template-columns: minmax(0, 0.9fr) minmax(520px, 1.1fr) !important;
    gap: clamp(3rem, 6vw, 6.5rem) !important;
}

body.hiline-ui .hiline-hero h1 {
    margin: 0 0 1.5rem;
    color: var(--hl-ink) !important;
    font-size: clamp(3.4rem, 6.6vw, 6.3rem) !important;
    font-weight: 660 !important;
    line-height: 0.98 !important;
    letter-spacing: -0.072em;
}

body.hiline-ui .hiline-hero h1 span,
body.hiline-ui .hiline-hero h1 .text-black,
body.hiline-ui .hiline-hero h1 .text-primary {
    color: inherit !important;
}

body.hiline-ui.hiline-home .hiline-hero h1 span:last-child {
    color: var(--hl-blue) !important;
}

body.hiline-ui.hiline-subpage .hiline-hero h1 {
    max-width: 1050px;
    margin-right: auto;
    margin-left: auto;
    font-size: clamp(3rem, 5.6vw, 5.4rem) !important;
    line-height: 1.02 !important;
    text-align: center;
}

body.hiline-ui .hiline-hero p {
    max-width: 690px;
    color: var(--hl-steel) !important;
    font-size: clamp(1.05rem, 1.5vw, 1.25rem) !important;
    line-height: 1.72 !important;
    letter-spacing: -0.012em;
}

body.hiline-ui.hiline-subpage .hiline-hero p {
    margin-right: auto;
    margin-left: auto;
    text-align: center;
}

body.hiline-ui .hiline-hero [class*="inline-flex"][class*="rounded-full"] {
    min-height: 30px;
    padding: 0 0 0 14px !important;
    border: 0 !important;
    border-left: 3px solid var(--hl-blue) !important;
    border-radius: 0 !important;
    color: var(--hl-blue) !important;
    background: transparent !important;
    box-shadow: none !important;
    font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.09em;
    text-transform: uppercase;
}

body.hiline-ui .hiline-hero [class*="inline-flex"][class*="rounded-full"] svg {
    display: none;
}

body.hiline-ui .hiline-proof {
    width: min(100%, 600px);
    padding-top: 1.5rem !important;
    border-top: 1px solid var(--hl-line);
}

body.hiline-ui .hiline-proof > div {
    text-align: left !important;
}

body.hiline-ui .hiline-proof > div + div {
    padding-left: 1.4rem;
    border-left: 1px solid var(--hl-line);
}

body.hiline-ui .hiline-proof .text-3xl {
    color: var(--hl-ink) !important;
    font-size: 1.5rem !important;
    font-weight: 650 !important;
    letter-spacing: -0.04em;
}

body.hiline-ui .hiline-proof .text-sm {
    margin-top: 3px;
    color: var(--hl-steel-2) !important;
    font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
    font-size: 10px !important;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

/* Signature element: HiLine infrastructure fabric. */
.hiline-network-wrap {
    perspective: 1400px;
}

.hiline-network {
    position: relative;
    border: 1px solid rgba(255, 255, 255, 0.11);
    border-radius: 18px;
    color: #fff;
    background: var(--hl-dark);
    box-shadow: 0 30px 90px rgba(11, 18, 30, 0.25), 0 1px rgba(255, 255, 255, 0.07) inset;
    transform: rotateY(-2.5deg) rotateX(0.8deg);
    overflow: hidden;
}

.hiline-network::after {
    position: absolute;
    inset: 0;
    border-radius: inherit;
    background: linear-gradient(115deg, transparent 42%, rgba(115, 197, 255, 0.055) 62%, transparent 78%);
    content: "";
    pointer-events: none;
}

.hiline-network__bar,
.hiline-network__footer {
    position: relative;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
    letter-spacing: 0.08em;
}

.hiline-network__bar {
    height: 52px;
    padding: 0 20px;
    border-bottom: 1px solid var(--hl-line-dark);
    color: rgba(255, 255, 255, 0.55);
    font-size: 10px;
}

.hiline-network__live {
    display: flex;
    gap: 8px;
    align-items: center;
    color: rgba(255, 255, 255, 0.86);
}

.hiline-network__live i {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--hl-green);
    box-shadow: 0 0 0 5px rgba(49, 193, 107, 0.1), 0 0 14px rgba(49, 193, 107, 0.7);
    animation: network-pulse 2.4s ease-in-out infinite;
}

.hiline-network__map {
    display: block;
    width: 100%;
    height: auto;
}

.network-backbone,
.network-backbone--ghost,
.network-branch {
    fill: none;
    vector-effect: non-scaling-stroke;
}

.network-backbone--ghost {
    stroke: rgba(9, 105, 232, 0.2);
    stroke-width: 14;
    filter: url(#backboneGlow);
}

.network-backbone {
    stroke: url(#backboneGradient);
    stroke-width: 3;
    stroke-linecap: round;
    stroke-dasharray: 850;
    stroke-dashoffset: 850;
    filter: url(#backboneGlow);
    animation: draw-network 1.9s 280ms var(--hl-ease) forwards;
}

.network-branch {
    stroke: rgba(115, 197, 255, 0.35);
    stroke-width: 1.25;
    stroke-dasharray: 5 7;
}

.network-node {
    opacity: 0;
    animation: reveal-node 500ms var(--hl-ease) forwards;
}

.network-node:nth-of-type(1) { animation-delay: 0.55s; }
.network-node:nth-of-type(2) { animation-delay: 0.72s; }
.network-node:nth-of-type(3) { animation-delay: 0.88s; }
.network-node:nth-of-type(4) { animation-delay: 1.02s; }
.network-node:nth-of-type(5) { animation-delay: 1.16s; }
.network-node:nth-of-type(6) { animation-delay: 1.3s; }
.network-node:nth-of-type(7) { animation-delay: 1.44s; }

.network-node__ring {
    fill: rgba(9, 105, 232, 0.08);
    stroke: rgba(115, 197, 255, 0.52);
    stroke-width: 1;
}

.network-node__core {
    fill: var(--hl-signal);
    filter: url(#backboneGlow);
}

.network-node--core .network-node__ring {
    fill: rgba(9, 105, 232, 0.16);
    stroke: var(--hl-signal);
}

.network-node--core .network-node__core,
.network-node--aws .network-node__core {
    fill: #fff;
}

.network-node text {
    fill: rgba(255, 255, 255, 0.82);
    font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
    font-size: 10px;
    font-weight: 650;
    letter-spacing: 0.06em;
    text-anchor: middle;
}

.network-node text.network-node__meta {
    fill: rgba(255, 255, 255, 0.34);
    font-size: 8px;
    font-weight: 500;
}

.network-node--aws text {
    text-anchor: start;
}

.hiline-network__footer {
    min-height: 64px;
    padding: 0 20px;
    border-top: 1px solid var(--hl-line-dark);
    color: rgba(255, 255, 255, 0.38);
    font-size: 8px;
}

.hiline-network__footer b {
    display: block;
    margin-bottom: 3px;
    color: rgba(255, 255, 255, 0.9);
    font-size: 12px;
    font-weight: 620;
    letter-spacing: 0.01em;
}

/* Multi-cloud canvas — an iOS-like material layer with a real information model. */
body.hiline-ui #multi-cloud.hiline-ecosystem {
    padding-top: clamp(6rem, 9vw, 9rem) !important;
    padding-bottom: clamp(6rem, 9vw, 9rem) !important;
    background:
        radial-gradient(circle at 12% 14%, rgba(47, 129, 247, 0.09), transparent 28%),
        radial-gradient(circle at 88% 88%, rgba(110, 200, 255, 0.08), transparent 25%),
        var(--hl-paper) !important;
}

body.hiline-ui .hiline-ecosystem__intro {
    display: grid;
    grid-template-columns: minmax(0, 0.9fr) minmax(360px, 1.1fr);
    gap: clamp(2.5rem, 7vw, 7rem);
    align-items: end;
    margin-bottom: clamp(3rem, 5vw, 4.75rem);
}

body.hiline-ui .hiline-ecosystem__eyebrow {
    margin-bottom: 1rem;
    color: var(--hl-blue);
    font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.11em;
}

body.hiline-ui .hiline-ecosystem__intro h2 {
    max-width: 720px;
    margin: 0;
}

body.hiline-ui .hiline-ecosystem__copy {
    max-width: 620px;
    justify-self: end;
}

body.hiline-ui .hiline-ecosystem__copy p {
    margin: 0;
    color: var(--hl-steel) !important;
    font-size: clamp(1rem, 1.35vw, 1.16rem);
    line-height: 1.75;
}

body.hiline-ui .hiline-ecosystem__open {
    display: inline-flex;
    gap: 9px;
    align-items: center;
    color: var(--hl-blue) !important;
    font-size: 14px;
    font-weight: 650;
}

body.hiline-ui .hiline-ecosystem__open span:last-child {
    transition: transform 180ms var(--hl-ease);
}

body.hiline-ui .hiline-ecosystem__open:hover span:last-child {
    transform: translate(3px, -3px);
}

body.hiline-ui .hiline-ecosystem-canvas {
    position: relative;
    border: 1px solid rgba(255, 255, 255, 0.9);
    border-radius: 26px;
    background: rgba(255, 255, 255, 0.7);
    box-shadow:
        0 42px 100px rgba(29, 52, 78, 0.15),
        0 2px 9px rgba(29, 52, 78, 0.06),
        inset 0 1px rgba(255, 255, 255, 0.95);
    -webkit-backdrop-filter: blur(30px) saturate(145%);
    backdrop-filter: blur(30px) saturate(145%);
    overflow: hidden;
}

body.hiline-ui .hiline-ecosystem-canvas::before {
    position: absolute;
    z-index: 4;
    top: 0;
    right: 8%;
    width: 36%;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.95), transparent);
    content: "";
    pointer-events: none;
}

body.hiline-ui .hiline-ecosystem-canvas__bar,
body.hiline-ui .hiline-ecosystem-canvas__footer {
    position: relative;
    z-index: 5;
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    color: rgba(11, 13, 16, 0.48);
    font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
    font-size: 9px;
    font-weight: 650;
    letter-spacing: 0.08em;
}

body.hiline-ui .hiline-ecosystem-canvas__bar {
    min-height: 52px;
    padding: 0 18px;
    border-bottom: 1px solid rgba(11, 13, 16, 0.08);
    background: rgba(250, 251, 252, 0.72);
}

.hiline-window-controls {
    display: flex;
    gap: 6px;
}

.hiline-window-controls i {
    width: 8px;
    height: 8px;
    border: 1px solid rgba(11, 13, 16, 0.1);
    border-radius: 50%;
    background: rgba(103, 113, 128, 0.17);
}

.hiline-canvas-live {
    display: flex;
    gap: 7px;
    align-items: center;
    justify-self: end;
}

.hiline-canvas-live i,
body.hiline-ui .hiline-ecosystem-canvas__footer i {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--hl-green);
    box-shadow: 0 0 0 4px rgba(49, 193, 107, 0.1);
}

body.hiline-ui .hiline-architecture-stage {
    position: relative;
    min-height: 560px;
    background:
        linear-gradient(rgba(11, 13, 16, 0.035) 1px, transparent 1px),
        linear-gradient(90deg, rgba(11, 13, 16, 0.035) 1px, transparent 1px),
        linear-gradient(135deg, rgba(245, 249, 255, 0.88), rgba(255, 255, 255, 0.62));
    background-size: 38px 38px, 38px 38px, auto;
    overflow: hidden;
}

body.hiline-ui .hiline-architecture-stage::after {
    position: absolute;
    right: 28%;
    bottom: -150px;
    width: 440px;
    height: 440px;
    border-radius: 50%;
    background: rgba(47, 129, 247, 0.07);
    filter: blur(70px);
    content: "";
    pointer-events: none;
}

body.hiline-ui .hiline-architecture-routes {
    position: absolute;
    z-index: 0;
    inset: 0;
    width: 100%;
    height: 100%;
    overflow: visible;
}

.hiline-route path,
.hiline-route__backbone {
    fill: none;
    stroke: url(#ecosystemRoute);
    stroke-linecap: round;
    stroke-linejoin: round;
    vector-effect: non-scaling-stroke;
}

.hiline-route path {
    stroke-width: 1.25;
}

.hiline-route--input path {
    stroke-dasharray: 4 6;
}

.hiline-route__backbone {
    stroke-width: 2.2;
    stroke-dasharray: 12 800;
    filter: url(#ecosystemGlow);
    animation: ecosystem-signal 5.2s linear infinite;
}

.hiline-route__pulse {
    fill: #fff;
    stroke: var(--hl-blue);
    stroke-width: 2;
    filter: url(#ecosystemGlow);
}

body.hiline-ui .hiline-architecture-grid {
    position: relative;
    z-index: 2;
    display: grid;
    grid-template-columns: 214px 214px 220px 180px;
    justify-content: space-between;
    min-height: 560px;
    padding: 24px 34px 38px;
}

body.hiline-ui .hiline-architecture-column {
    min-width: 0;
}

body.hiline-ui .hiline-architecture-label {
    height: 28px;
    color: rgba(11, 13, 16, 0.42);
    font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 0.11em;
    text-transform: uppercase;
}

body.hiline-ui .hiline-architecture-list {
    display: flex;
    min-height: 468px;
    flex-direction: column;
    justify-content: space-between;
}

body.hiline-ui .hiline-provider-node,
body.hiline-ui .hiline-service-node,
body.hiline-ui .hiline-industry-node {
    position: relative;
    display: flex;
    min-height: 72px;
    align-items: center;
    border: 1px solid rgba(11, 13, 16, 0.09);
    color: var(--hl-ink) !important;
    background: rgba(255, 255, 255, 0.84);
    box-shadow: 0 9px 24px rgba(29, 52, 78, 0.055), inset 0 1px rgba(255, 255, 255, 0.95);
    transition: border-color 180ms ease, box-shadow 220ms ease, transform 220ms var(--hl-ease);
}

body.hiline-ui .hiline-provider-node {
    gap: 12px;
    padding: 10px 12px;
    border-radius: 15px;
}

body.hiline-ui .hiline-provider-icon {
    display: grid;
    width: 42px;
    height: 42px;
    flex: 0 0 42px;
    place-items: center;
    border: 1px solid rgba(11, 13, 16, 0.07);
    border-radius: 11px;
    background: #fff;
}

body.hiline-ui .hiline-provider-icon img,
body.hiline-ui .hiline-provider-icon svg {
    width: 28px;
    height: 28px;
    object-fit: contain;
}

body.hiline-ui .hiline-provider-icon svg {
    fill: none;
    stroke: var(--hl-steel);
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 1.5;
}

body.hiline-ui .hiline-provider-node b,
body.hiline-ui .hiline-service-node > span,
body.hiline-ui .hiline-industry-node > span {
    display: block;
    font-size: 13px;
    font-weight: 650;
    letter-spacing: -0.01em;
}

body.hiline-ui .hiline-provider-node small,
body.hiline-ui .hiline-service-node small {
    display: block;
    margin-top: 4px;
    color: var(--hl-steel-2);
    font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
    font-size: 7px;
    font-weight: 650;
    letter-spacing: 0.08em;
}

body.hiline-ui .hiline-architecture-column--core {
    display: flex;
    align-items: center;
}

body.hiline-ui .hiline-core-node {
    position: relative;
    width: 100%;
    padding: 22px;
    border: 1px solid rgba(255, 255, 255, 0.18);
    border-radius: 24px;
    color: #fff;
    background:
        radial-gradient(circle at 78% 18%, rgba(115, 197, 255, 0.3), transparent 28%),
        linear-gradient(145deg, #0c74ed, #064aaf 68%, #053376);
    box-shadow: 0 24px 54px rgba(9, 105, 232, 0.28), inset 0 1px rgba(255, 255, 255, 0.18);
    overflow: hidden;
}

body.hiline-ui .hiline-core-node::after {
    position: absolute;
    inset: 0;
    background: linear-gradient(115deg, transparent 40%, rgba(255, 255, 255, 0.1), transparent 66%);
    content: "";
    transform: translateX(-110%);
    animation: ecosystem-sheen 6s var(--hl-ease) infinite;
}

body.hiline-ui .hiline-core-node__status {
    position: relative;
    z-index: 1;
    display: flex;
    gap: 7px;
    align-items: center;
    margin-bottom: 24px;
    color: rgba(255, 255, 255, 0.62);
    font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
    font-size: 8px;
    font-weight: 700;
    letter-spacing: 0.08em;
}

body.hiline-ui .hiline-core-node__status span {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #8ce2ff;
    box-shadow: 0 0 10px rgba(140, 226, 255, 0.9);
}

body.hiline-ui .hiline-core-node img {
    position: relative;
    z-index: 1;
    width: auto;
    height: 29px;
    margin-bottom: 15px;
    border: 0 !important;
    filter: brightness(0) invert(1);
}

body.hiline-ui .hiline-core-node h3 {
    position: relative;
    z-index: 1;
    margin: 0 0 7px;
    color: #fff !important;
    font-size: 17px;
}

body.hiline-ui .hiline-core-node p {
    position: relative;
    z-index: 1;
    margin: 0;
    color: rgba(255, 255, 255, 0.64) !important;
    font-size: 10px;
    letter-spacing: 0.02em;
}

body.hiline-ui .hiline-core-node__availability {
    position: relative;
    z-index: 1;
    margin-top: 22px;
    padding-top: 12px;
    border-top: 1px solid rgba(255, 255, 255, 0.16);
    color: rgba(255, 255, 255, 0.52);
    font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
    font-size: 8px;
    letter-spacing: 0.09em;
}

body.hiline-ui .hiline-service-node {
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    padding: 12px 38px 12px 16px;
    border-radius: 15px;
}

body.hiline-ui .hiline-service-node::after {
    position: absolute;
    top: 50%;
    right: 14px;
    color: var(--hl-blue);
    content: "→";
    font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
    font-size: 14px;
    transform: translateY(-50%);
    transition: transform 180ms var(--hl-ease);
}

body.hiline-ui .hiline-service-node:hover,
body.hiline-ui .hiline-industry-node:hover {
    border-color: rgba(9, 105, 232, 0.3);
    box-shadow: 0 15px 34px rgba(29, 52, 78, 0.1), inset 0 1px #fff;
    transform: translateY(-2px);
}

body.hiline-ui .hiline-service-node:hover::after {
    transform: translate(3px, -50%);
}

body.hiline-ui .hiline-industry-node {
    justify-content: space-between;
    padding: 13px 14px;
    border-radius: 13px;
    background: rgba(248, 250, 253, 0.82);
}

body.hiline-ui .hiline-industry-node i {
    color: var(--hl-blue);
    font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
    font-size: 12px;
    font-style: normal;
}

body.hiline-ui .hiline-ecosystem-canvas__footer {
    min-height: 48px;
    grid-template-columns: 1fr 1fr;
    padding: 0 18px;
    border-top: 1px solid rgba(11, 13, 16, 0.08);
    background: rgba(250, 251, 252, 0.72);
}

body.hiline-ui .hiline-ecosystem-canvas__footer span:first-child {
    display: flex;
    gap: 8px;
    align-items: center;
}

body.hiline-ui .hiline-ecosystem-canvas__footer span:last-child {
    justify-self: end;
    color: rgba(11, 13, 16, 0.34);
    letter-spacing: 0.02em;
}

/* Section rhythm and editorial headings. */
body.hiline-ui .hiline-section {
    position: relative;
    padding-top: clamp(5.5rem, 8vw, 8rem) !important;
    padding-bottom: clamp(5.5rem, 8vw, 8rem) !important;
    border-top: 1px solid rgba(11, 13, 16, 0.055);
    background: var(--hl-white) !important;
}

body.hiline-ui .hiline-section.hiline-muted:not(.hiline-dark) {
    background: var(--hl-paper) !important;
}

body.hiline-ui .hiline-section > .max-w-7xl,
body.hiline-ui .hiline-section > .container {
    width: min(100%, 1280px);
    max-width: 1280px !important;
}

body.hiline-ui .hiline-section h2,
body.hiline-ui .hiline-heading {
    color: var(--hl-ink) !important;
    font-size: clamp(2.45rem, 4.6vw, 4.4rem) !important;
    font-weight: 630 !important;
    line-height: 1.04 !important;
    letter-spacing: -0.058em;
}

body.hiline-ui .hiline-section h3 {
    font-weight: 620 !important;
    letter-spacing: -0.026em;
}

body.hiline-ui .hiline-section p {
    line-height: 1.72;
}

body.hiline-ui .hiline-section .grid {
    gap: clamp(1.2rem, 2.5vw, 2rem) !important;
}

body.hiline-ui.hiline-home #services > div > .text-center,
body.hiline-ui.hiline-home #cases > div > .text-center,
body.hiline-ui.hiline-home #solutions > div > .text-center,
body.hiline-ui.hiline-home #contact > div > .text-center {
    display: grid;
    grid-template-columns: minmax(0, 0.85fr) minmax(320px, 1.15fr);
    gap: clamp(2rem, 7vw, 7rem);
    align-items: end;
    margin-bottom: clamp(3.5rem, 6vw, 5.5rem) !important;
    text-align: left !important;
}

body.hiline-ui.hiline-home #services > div > .text-center p,
body.hiline-ui.hiline-home #cases > div > .text-center p,
body.hiline-ui.hiline-home #solutions > div > .text-center p,
body.hiline-ui.hiline-home #contact > div > .text-center p {
    max-width: 650px !important;
    margin: 0 !important;
    justify-self: end;
}

/* Cards are architectural modules, not glass tiles. */
body.hiline-ui .hiline-card {
    position: relative;
    border: 1px solid var(--hl-line) !important;
    border-radius: var(--hl-radius) !important;
    color: var(--hl-ink);
    background: var(--hl-white) !important;
    box-shadow: none !important;
    transition: border-color 220ms ease, background-color 220ms ease, transform 280ms var(--hl-ease) !important;
    overflow: hidden;
}

body.hiline-ui a.hiline-card:hover,
body.hiline-ui .hiline-card[data-hiline-interactive="true"]:hover {
    border-color: #bcc7d4 !important;
    background: #f9fbfd !important;
    transform: translateY(-3px);
}

body.hiline-ui .hiline-card h3,
body.hiline-ui .hiline-card h4,
body.hiline-ui .hiline-card .text-primary {
    color: var(--hl-ink) !important;
}

body.hiline-ui .hiline-card > [class*="w-"][class*="h-"][class*="bg-"],
body.hiline-ui .hiline-card > div > [class*="w-"][class*="h-"][class*="bg-"]:first-child {
    border: 0;
    border-radius: 11px !important;
    background: var(--hl-blue) !important;
    box-shadow: none !important;
}

body.hiline-ui .hiline-card > [class*="w-"][class*="h-"][class*="bg-"] svg,
body.hiline-ui .hiline-card > div > [class*="w-"][class*="h-"][class*="bg-"]:first-child svg,
body.hiline-ui .hiline-card > [class*="w-"][class*="h-"][class*="bg-"] i,
body.hiline-ui .hiline-card > div > [class*="w-"][class*="h-"][class*="bg-"]:first-child i {
    color: #fff !important;
}

/* Service capability matrix. */
body.hiline-ui #services > div > .grid {
    gap: 0 !important;
    border-top: 1px solid var(--hl-line);
    border-left: 1px solid var(--hl-line);
}

body.hiline-ui #services > div > .grid > .hiline-card {
    min-height: 350px;
    padding: clamp(2rem, 3.8vw, 3.5rem) !important;
    border-width: 0 1px 1px 0 !important;
    border-color: var(--hl-line) !important;
    border-radius: 0 !important;
    background: transparent !important;
}

body.hiline-ui #services > div > .grid > .hiline-card:hover {
    background: #f5f8fc !important;
    transform: none;
}

body.hiline-ui #services .hiline-card h3 {
    max-width: calc(100% - 48px);
    font-size: clamp(1.35rem, 2.1vw, 1.8rem);
}

body.hiline-ui #services .hiline-card::after {
    position: absolute;
    top: clamp(2rem, 3.8vw, 3.5rem);
    right: clamp(2rem, 3.8vw, 3.5rem);
    color: var(--hl-blue);
    content: "↗";
    font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
    font-size: 18px;
    transition: transform 220ms var(--hl-ease);
}

body.hiline-ui #services .hiline-card:hover::after {
    transform: translate(3px, -3px);
}

/* Case studies are presented like a portfolio, on a single dark field. */
body.hiline-ui #cases {
    color: #fff !important;
    background: var(--hl-dark) !important;
}

body.hiline-ui #cases h2,
body.hiline-ui #cases h3,
body.hiline-ui #cases .text-primary,
body.hiline-ui #cases .text-gray-900 {
    color: #fff !important;
}

body.hiline-ui #cases p,
body.hiline-ui #cases li,
body.hiline-ui #cases .text-gray-600,
body.hiline-ui #cases .text-gray-500 {
    color: rgba(255, 255, 255, 0.57) !important;
}

body.hiline-ui #cases div:has(> .case-filter-btn) {
    width: fit-content;
    max-width: 100%;
    margin-right: auto;
    margin-left: auto;
    padding: 5px;
    border: 1px solid var(--hl-line-dark);
    border-radius: 11px;
    background: rgba(255, 255, 255, 0.04);
}

body.hiline-ui .case-filter-btn {
    min-height: 38px;
    padding: 0 15px !important;
    border: 0 !important;
    border-radius: 7px !important;
    color: rgba(255, 255, 255, 0.55) !important;
    background: transparent !important;
    box-shadow: none !important;
    font-size: 12px;
}

body.hiline-ui .case-filter-btn.active {
    color: #fff !important;
    background: var(--hl-blue) !important;
}

body.hiline-ui #cases .case-item {
    min-height: 100%;
    border-color: rgba(255, 255, 255, 0.12) !important;
    background: rgba(255, 255, 255, 0.035) !important;
}

body.hiline-ui #cases .case-item:hover {
    border-color: rgba(115, 197, 255, 0.5) !important;
    background: rgba(9, 105, 232, 0.08) !important;
}

body.hiline-ui #cases .case-item > div:last-child {
    padding-top: 1rem;
    border-top: 1px solid var(--hl-line-dark);
}

body.hiline-ui #prevPage,
body.hiline-ui #nextPage {
    border: 1px solid rgba(255, 255, 255, 0.13) !important;
    color: #fff !important;
    background: rgba(255, 255, 255, 0.08) !important;
    box-shadow: none !important;
    -webkit-backdrop-filter: blur(12px);
    backdrop-filter: blur(12px);
}

body.hiline-ui #prevPage { left: -24px !important; }
body.hiline-ui #nextPage { right: -24px !important; }

body.hiline-ui #prevPage svg,
body.hiline-ui #nextPage svg {
    color: #fff !important;
}

/* Brand matrix — equal prominence, no floating-logo collage. */
body.hiline-ui .hiline-brand-strip .hiline-logo-grid {
    gap: 0 !important;
    border-top: 1px solid var(--hl-line);
    border-left: 1px solid var(--hl-line);
}

body.hiline-ui .hiline-logo-tile {
    min-height: 132px;
    padding: 24px !important;
    border: 0 !important;
    border-right: 1px solid var(--hl-line) !important;
    border-bottom: 1px solid var(--hl-line) !important;
    background: #fff !important;
    transition: background-color 200ms ease, box-shadow 260ms ease !important;
}

body.hiline-ui .hiline-logo-tile:hover {
    position: relative;
    z-index: 1;
    background: #f8fbff !important;
    box-shadow: 0 18px 38px rgba(28, 55, 90, 0.09) !important;
    transform: none !important;
}

body.hiline-ui .hiline-logo-tile img {
    max-width: 150px;
    filter: none;
    opacity: 1 !important;
    transition: filter 220ms ease, transform 260ms var(--hl-ease) !important;
}

body.hiline-ui .hiline-logo-tile:hover img {
    filter: saturate(1.08);
    transform: scale(1.035);
}

body.hiline-ui .hiline-feature-layout {
    padding: clamp(1.25rem, 3vw, 2.5rem);
    border: 1px solid var(--hl-line);
    background: var(--hl-paper);
}

body.hiline-ui #about > div > .grid {
    gap: clamp(3rem, 7vw, 7rem) !important;
}

body.hiline-ui #about .shadow-2xl {
    border: 1px solid var(--hl-line) !important;
    border-radius: var(--hl-radius) !important;
    background: #fff !important;
    box-shadow: none !important;
}

body.hiline-ui img[class*="rounded"]:not(.check-icon) {
    border: 1px solid var(--hl-line);
    border-radius: var(--hl-radius) !important;
    box-shadow: none;
}

/* Subpage system — one editorial language for solutions, cases and insights. */
body.hiline-ui.hiline-subpage .hiline-hero {
    display: flex;
    min-height: min(760px, 82vh);
    align-items: center;
    padding-top: clamp(9.5rem, 13vw, 12rem) !important;
    padding-bottom: clamp(9rem, 12vw, 11rem) !important;
    background:
        radial-gradient(circle at 84% 34%, rgba(9, 105, 232, 0.12), transparent 22%),
        linear-gradient(rgba(11, 13, 16, 0.032) 1px, transparent 1px),
        linear-gradient(90deg, rgba(11, 13, 16, 0.032) 1px, transparent 1px),
        #f7f9fc !important;
    background-size: auto, 72px 72px, 72px 72px, auto !important;
}

body.hiline-ui.hiline-subpage .hiline-hero::before {
    position: absolute;
    z-index: -1;
    top: 21%;
    right: 7%;
    width: clamp(230px, 30vw, 460px);
    aspect-ratio: 1;
    border: 1px solid rgba(9, 105, 232, 0.14);
    border-radius: 50%;
    box-shadow:
        0 0 0 48px rgba(9, 105, 232, 0.025),
        0 0 0 96px rgba(9, 105, 232, 0.018);
    content: "";
}

body.hiline-ui.hiline-subpage .hiline-hero > div:not(.hiline-hero-system) {
    position: relative;
    z-index: 2;
    width: min(100%, 1280px);
    max-width: 1280px !important;
    text-align: left !important;
}

body.hiline-ui.hiline-subpage .hiline-hero h1 {
    max-width: 1020px;
    margin-right: 0;
    margin-left: 0;
    text-align: left;
}

body.hiline-ui.hiline-subpage .hiline-hero p {
    max-width: 760px !important;
    margin-right: 0;
    margin-left: 0;
    text-align: left;
}

body.hiline-ui .hiline-hero-system {
    position: absolute !important;
    z-index: 3 !important;
    right: 0;
    bottom: 0;
    left: 0;
    display: grid;
    width: 100% !important;
    max-width: none !important;
    min-height: 76px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    padding-right: max(2rem, calc((100vw - 1280px) / 2));
    padding-left: max(2rem, calc((100vw - 1280px) / 2));
    border-top: 1px solid rgba(11, 13, 16, 0.09);
    background: rgba(248, 250, 253, 0.78);
    -webkit-backdrop-filter: blur(24px) saturate(140%);
    backdrop-filter: blur(24px) saturate(140%);
}

body.hiline-ui .hiline-hero-system span {
    display: flex;
    gap: 13px;
    align-items: center;
    border-right: 1px solid rgba(11, 13, 16, 0.08);
    color: rgba(11, 13, 16, 0.52);
    font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
    font-size: 9px;
    font-weight: 680;
    letter-spacing: 0.08em;
}

body.hiline-ui .hiline-hero-system span + span {
    padding-left: clamp(1rem, 3vw, 2.5rem);
}

body.hiline-ui .hiline-hero-system span:last-child {
    border-right: 0;
}

body.hiline-ui .hiline-hero-system i {
    color: var(--hl-blue);
    font-style: normal;
}

body.hiline-ui.hiline-subpage .hiline-section:not(.hiline-hero) {
    padding-top: clamp(5rem, 7vw, 7rem) !important;
    padding-bottom: clamp(5rem, 7vw, 7rem) !important;
}

body.hiline-ui.hiline-subpage .hiline-section:not(.hiline-hero) > .max-w-7xl,
body.hiline-ui.hiline-subpage .hiline-section:not(.hiline-hero) > .max-w-6xl,
body.hiline-ui.hiline-subpage .hiline-section:not(.hiline-hero) > .container {
    width: min(100%, 1200px);
    max-width: 1200px !important;
}

body.hiline-ui.hiline-subpage .hiline-section:not(.hiline-hero) h2,
body.hiline-ui.hiline-subpage .hiline-section:not(.hiline-hero) .hiline-heading {
    font-size: clamp(2.35rem, 4.2vw, 3.85rem) !important;
}

body.hiline-ui.hiline-subpage .hiline-section:not(.hiline-hero) > div > .text-center:first-child {
    max-width: 900px;
    margin-right: auto;
    margin-left: auto;
}

body.hiline-ui.hiline-subpage .hiline-card {
    border-color: rgba(26, 51, 82, 0.11) !important;
    border-radius: 14px !important;
}

body.hiline-ui.hiline-case-page .metric-card {
    min-height: 170px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    border-radius: 0 !important;
    background: transparent !important;
}

body.hiline-ui.hiline-case-page .metric-card .text-4xl {
    color: var(--hl-ink) !important;
    font-size: clamp(2.5rem, 4.6vw, 4.2rem) !important;
    letter-spacing: -0.055em;
}

body.hiline-ui.hiline-case-page section[class*="bg-primary"][class*="text-white"],
body.hiline-ui.hiline-solution-page section[class*="bg-primary"][class*="text-white"] {
    background:
        radial-gradient(circle at 84% 30%, rgba(42, 136, 255, 0.25), transparent 28%),
        var(--hl-dark) !important;
}

body.hiline-ui .hiline-architecture-host {
    margin-top: clamp(5rem, 8vw, 8rem) !important;
    margin-bottom: clamp(5rem, 8vw, 8rem) !important;
}

body.hiline-ui .hiline-architecture-heading {
    margin-bottom: 2rem !important;
    color: var(--hl-ink) !important;
    font-size: clamp(2.25rem, 4.3vw, 4rem) !important;
    line-height: 1.03 !important;
    letter-spacing: -0.055em;
    text-align: left !important;
}

body.hiline-ui .hiline-case-architecture {
    border: 1px solid rgba(11, 13, 16, 0.11);
    border-radius: 22px;
    background: #fff;
    box-shadow: 0 34px 90px rgba(27, 50, 81, 0.14);
    overflow: hidden;
}

body.hiline-ui .hiline-case-architecture img {
    display: block;
    width: 100%;
    height: auto;
    aspect-ratio: 16 / 9;
    object-fit: contain;
    background: #fff;
}

/* Homepage edit — fewer walls, stronger hierarchy, cleaner proof. */
body.hiline-ui.hiline-home .hiline-section:not(.hiline-hero):not(#multi-cloud) {
    padding-top: clamp(4.75rem, 6.5vw, 6.5rem) !important;
    padding-bottom: clamp(4.75rem, 6.5vw, 6.5rem) !important;
}

body.hiline-ui .hiline-core-node img {
    height: 32px;
    margin-bottom: 18px;
}

body.hiline-ui .hiline-core-node p {
    font-size: 11px;
    letter-spacing: 0.045em;
}

body.hiline-ui.hiline-home #services > div > .grid > .hiline-card {
    min-height: 290px;
    padding: clamp(1.75rem, 3vw, 2.65rem) !important;
}

body.hiline-ui.hiline-home #services .hiline-card::after {
    top: clamp(1.75rem, 3vw, 2.65rem);
    right: clamp(1.75rem, 3vw, 2.65rem);
}

body.hiline-ui.hiline-home #cases > div > .mb-12 {
    margin-bottom: 2.25rem !important;
}

body.hiline-ui.hiline-home #cases .case-item {
    padding: clamp(1.65rem, 2.5vw, 2.25rem) !important;
}

body.hiline-ui.hiline-home #cases .case-item > p,
body.hiline-ui.hiline-home #cases .case-item > .space-y-3 {
    margin-bottom: 1.25rem !important;
}

body.hiline-ui.hiline-home #partners,
body.hiline-ui.hiline-home #customers {
    padding-top: clamp(4rem, 5.5vw, 5.25rem) !important;
    padding-bottom: clamp(4rem, 5.5vw, 5.25rem) !important;
}

body.hiline-ui.hiline-home #partners > div > .text-center,
body.hiline-ui.hiline-home #customers > div > .text-center {
    display: grid;
    grid-template-columns: minmax(0, 0.8fr) minmax(320px, 1.2fr);
    gap: clamp(2rem, 7vw, 7rem);
    align-items: end;
    margin-bottom: 2.75rem !important;
    text-align: left !important;
}

body.hiline-ui.hiline-home #partners > div > .text-center h2,
body.hiline-ui.hiline-home #customers > div > .text-center h2 {
    margin: 0 !important;
    font-size: clamp(2rem, 3.4vw, 3.4rem) !important;
}

body.hiline-ui.hiline-home #partners > div > .text-center p,
body.hiline-ui.hiline-home #customers > div > .text-center p {
    max-width: 610px;
    margin: 0;
    justify-self: end;
}

body.hiline-ui.hiline-home #solutions .hiline-feature-layout {
    gap: clamp(2.5rem, 6vw, 6rem) !important;
    margin-bottom: 0 !important;
    padding: 0;
    border: 0;
    background: transparent;
}

body.hiline-ui.hiline-home #solutions .hiline-feature-layout > .space-y-8 {
    border-top: 1px solid var(--hl-line);
}

body.hiline-ui.hiline-home #solutions .hiline-feature-layout > .space-y-8 > * + * {
    margin-top: 0 !important;
}

body.hiline-ui.hiline-home #solutions .hiline-feature-layout > .space-y-8 > a {
    padding: 1.75rem 0 !important;
    border-width: 0 0 1px !important;
    border-radius: 0 !important;
    background: transparent !important;
}

body.hiline-ui.hiline-home #solutions .hiline-feature-layout > .space-y-8 > a:hover {
    padding-right: 1rem !important;
    padding-left: 1rem !important;
    background: var(--hl-paper) !important;
    transform: none;
}

body.hiline-ui.hiline-home #solutions .hiline-feature-layout > .relative > div {
    padding: 0 !important;
    border-radius: 20px !important;
    background: linear-gradient(145deg, #eef6ff, #f7fbff) !important;
}

body.hiline-ui.hiline-home #solutions .hiline-feature-layout > .relative > div > div {
    padding: clamp(2rem, 4vw, 3.25rem) !important;
    border: 1px solid rgba(9, 105, 232, 0.12) !important;
    border-radius: 20px !important;
    background: rgba(255, 255, 255, 0.78) !important;
    box-shadow: 0 28px 70px rgba(27, 61, 102, 0.1) !important;
    -webkit-backdrop-filter: blur(20px) saturate(135%);
    backdrop-filter: blur(20px) saturate(135%);
}

body.hiline-ui.hiline-home #solutions .hiline-industry-grid {
    display: none !important;
}

body.hiline-ui.hiline-home #about > div > .grid > div:first-child > .grid,
body.hiline-ui.hiline-home #about > div > .grid > div:first-child > .space-y-6:last-child,
body.hiline-ui.hiline-home #about > div > .grid > div:last-child > .space-y-6:first-child {
    display: none !important;
}

body.hiline-ui.hiline-home #about > div > .grid {
    grid-template-columns: minmax(0, 1.05fr) minmax(420px, 0.95fr) !important;
    align-items: center !important;
}

body.hiline-ui.hiline-home #about > div > .grid > div:first-child {
    max-width: 690px;
}

body.hiline-ui.hiline-home #about > div > .grid > div:last-child {
    position: static !important;
}

body.hiline-ui.hiline-home #about .shadow-2xl {
    margin-top: 0 !important;
    padding: clamp(1.5rem, 3vw, 2.25rem) !important;
}

body.hiline-ui.hiline-home #about .shadow-2xl > div > .grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 0 !important;
    border-top: 1px solid var(--hl-line);
    border-left: 1px solid var(--hl-line);
}

body.hiline-ui.hiline-home #about .shadow-2xl > div > .grid > div {
    min-height: 100px;
    padding: 12px !important;
    border-right: 1px solid var(--hl-line);
    border-bottom: 1px solid var(--hl-line);
}

body.hiline-ui.hiline-home #about .shadow-2xl img {
    max-height: 70px !important;
    opacity: 1 !important;
    filter: none !important;
}

body.hiline-ui.hiline-home #contact > div > .grid {
    gap: clamp(2.5rem, 5vw, 5rem) !important;
}

body.hiline-ui.hiline-home #contact form.space-y-6 > * + * {
    margin-top: 1rem !important;
}

body.hiline-ui.hiline-home #contact textarea {
    min-height: 104px;
}

/* Actions: one filled action, one quiet action. */
body.hiline-ui .hiline-action {
    display: inline-flex;
    min-height: 48px;
    align-items: center;
    justify-content: center;
    padding: 0 22px !important;
    border: 1px solid transparent !important;
    border-radius: 10px !important;
    font-weight: 620 !important;
    letter-spacing: -0.01em;
    box-shadow: none !important;
    transition: color 180ms ease, background-color 180ms ease, border-color 180ms ease, transform 180ms ease !important;
}

body.hiline-ui .hiline-action[class~="bg-primary"],
body.hiline-ui button.hiline-action[type="submit"] {
    color: #fff !important;
    background: var(--hl-blue) !important;
}

body.hiline-ui .hiline-action[class~="bg-primary"]:hover,
body.hiline-ui button.hiline-action[type="submit"]:hover {
    background: var(--hl-blue-deep) !important;
}

body.hiline-ui .hiline-action:not([class~="bg-primary"]):not([type="submit"]) {
    color: var(--hl-blue) !important;
    border-color: var(--hl-line) !important;
    background: transparent !important;
}

body.hiline-ui .hiline-action:hover {
    transform: translateY(-1px) !important;
}

body.hiline-ui .hiline-action:active {
    transform: translateY(0) scale(0.985) !important;
}

body.hiline-ui button:disabled {
    opacity: 0.46 !important;
}

/* Dark sections and contact. */
body.hiline-ui .hiline-dark {
    color: #fff !important;
    border-top-color: rgba(255, 255, 255, 0.1);
    background: var(--hl-dark) !important;
}

body.hiline-ui .hiline-dark h1,
body.hiline-ui .hiline-dark h2,
body.hiline-ui .hiline-dark h3,
body.hiline-ui .hiline-dark h4,
body.hiline-ui .hiline-dark .text-primary,
body.hiline-ui .hiline-dark .text-gray-900,
body.hiline-ui footer h2,
body.hiline-ui footer h3 {
    color: #fff !important;
}

body.hiline-ui .hiline-dark p,
body.hiline-ui .hiline-dark li,
body.hiline-ui .hiline-dark .text-gray-600,
body.hiline-ui .hiline-dark .text-gray-500,
body.hiline-ui .hiline-dark .text-gray-400,
body.hiline-ui footer p,
body.hiline-ui footer .text-gray-400 {
    color: rgba(255, 255, 255, 0.58) !important;
}

body.hiline-ui .hiline-dark .hiline-card {
    border-color: var(--hl-line-dark) !important;
    color: #fff;
    background: rgba(255, 255, 255, 0.035) !important;
}

body.hiline-ui .hiline-dark .hiline-card h3,
body.hiline-ui .hiline-dark .hiline-card h4 {
    color: #fff !important;
}

body.hiline-ui #contact > div > .grid {
    gap: clamp(2.5rem, 7vw, 7rem) !important;
    align-items: start;
}

body.hiline-ui .hiline-dark input,
body.hiline-ui .hiline-dark textarea,
body.hiline-ui .hiline-dark select {
    min-height: 50px;
    border: 1px solid rgba(255, 255, 255, 0.14) !important;
    border-radius: 9px !important;
    color: #fff !important;
    background: rgba(255, 255, 255, 0.055) !important;
    box-shadow: none !important;
}

body.hiline-ui .hiline-dark textarea {
    min-height: 128px;
}

body.hiline-ui .hiline-dark input::placeholder,
body.hiline-ui .hiline-dark textarea::placeholder {
    color: rgba(255, 255, 255, 0.3) !important;
}

body.hiline-ui .hiline-dark input:focus,
body.hiline-ui .hiline-dark textarea:focus,
body.hiline-ui .hiline-dark select:focus {
    border-color: var(--hl-signal) !important;
    background: rgba(255, 255, 255, 0.08) !important;
    box-shadow: 0 0 0 3px rgba(9, 105, 232, 0.2) !important;
}

body.hiline-ui .hiline-dark select option {
    color: #fff;
    background: var(--hl-dark);
}

/* Policy documents are clean reading sheets, not oversized glass panels. */
body.hiline-ui main.hiline-legal {
    min-height: calc(100vh - 180px);
    padding-top: 9rem !important;
    padding-bottom: 6rem !important;
    background: var(--hl-paper);
}

body.hiline-ui .hiline-document {
    padding: clamp(2rem, 5vw, 5rem) !important;
    border: 1px solid var(--hl-line) !important;
    border-radius: var(--hl-radius) !important;
    background: #fff !important;
    box-shadow: none !important;
}

body.hiline-ui .hiline-document h1 {
    color: var(--hl-ink) !important;
    font-size: clamp(2.8rem, 5vw, 4.8rem) !important;
    line-height: 1.02;
    letter-spacing: -0.065em;
}

body.hiline-ui .hiline-document section {
    padding: 1.35rem 0 1.85rem;
    border-bottom: 1px solid var(--hl-line);
}

body.hiline-ui .hiline-document section:last-child {
    margin-top: 2rem !important;
    padding: 1.5rem !important;
    border: 1px solid var(--hl-line) !important;
    border-radius: 10px !important;
    background: var(--hl-paper) !important;
}

body.hiline-ui .hiline-document section h2 {
    border: 0 !important;
    color: var(--hl-ink) !important;
    font-size: 1.18rem !important;
    letter-spacing: -0.02em;
}

body.hiline-ui .hiline-document p,
body.hiline-ui .hiline-document li {
    color: var(--hl-steel) !important;
    line-height: 1.85;
}

body.hiline-ui footer {
    position: relative;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
    color: #fff !important;
    background: #05070a !important;
}

body.hiline-ui footer a {
    color: rgba(255, 255, 255, 0.52) !important;
}

body.hiline-ui footer a:hover {
    color: #fff !important;
}

/* One restrained reveal system. */
body.hiline-ui [data-hiline-reveal] {
    opacity: 0;
    transform: translateY(20px);
    transition: opacity 760ms var(--hl-ease), transform 760ms var(--hl-ease);
    transition-delay: var(--hiline-delay, 0ms);
}

body.hiline-ui [data-hiline-reveal].is-visible {
    opacity: 1;
    transform: translateY(0);
}

@keyframes draw-network {
    to { stroke-dashoffset: 0; }
}

@keyframes reveal-node {
    from { opacity: 0; }
    to { opacity: 1; }
}

@keyframes network-pulse {
    0%, 100% { opacity: 0.65; }
    50% { opacity: 1; }
}

@keyframes ecosystem-signal {
    to { stroke-dashoffset: -812; }
}

@keyframes ecosystem-sheen {
    0%, 60% { transform: translateX(-110%); }
    82%, 100% { transform: translateX(110%); }
}

/* Homepage portfolio — editorial spotlight instead of a legacy card carousel. */
body.hiline-ui.hiline-home #cases {
    position: relative;
    overflow: hidden;
    background:
        radial-gradient(circle at 12% 8%, rgba(24, 117, 255, 0.22), transparent 27%),
        linear-gradient(rgba(255, 255, 255, 0.025) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, 0.025) 1px, transparent 1px),
        #06080b !important;
    background-size: auto, 80px 80px, 80px 80px, auto !important;
}

body.hiline-ui.hiline-home #cases::before {
    position: absolute;
    top: -240px;
    right: -120px;
    width: 620px;
    height: 620px;
    border: 1px solid rgba(126, 185, 255, 0.14);
    border-radius: 50%;
    box-shadow: 0 0 0 72px rgba(72, 146, 255, 0.025), 0 0 0 144px rgba(72, 146, 255, 0.018);
    content: "";
    pointer-events: none;
}

body.hiline-ui.hiline-home #cases > div {
    position: relative;
    z-index: 1;
}

body.hiline-ui.hiline-home #cases div:has(> .case-filter-btn) {
    display: flex;
    width: 100%;
    padding: 0 0 16px;
    gap: 8px;
    justify-content: flex-start;
    overflow-x: auto;
    border: 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 0;
    background: transparent;
    scrollbar-width: none;
}

body.hiline-ui.hiline-home #cases div:has(> .case-filter-btn)::-webkit-scrollbar {
    display: none;
}

body.hiline-ui.hiline-home .case-filter-btn {
    flex: 0 0 auto;
    min-height: 34px;
    padding: 0 13px !important;
    border-radius: 999px !important;
    font-size: 11px;
    letter-spacing: 0.025em;
}

body.hiline-ui.hiline-home .case-filter-btn.active {
    color: #fff !important;
    background: var(--hl-blue) !important;
}

body.hiline-ui.hiline-home .hiline-case-stage {
    min-height: 510px;
}

body.hiline-ui.hiline-home #cases-grid {
    grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr) minmax(0, 1fr) !important;
    gap: 16px !important;
}

body.hiline-ui.hiline-home #cases .case-item {
    position: relative;
    min-height: 430px;
    padding: 34px !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
    border-radius: 28px !important;
    background: linear-gradient(145deg, rgba(255, 255, 255, 0.075), rgba(255, 255, 255, 0.025)) !important;
    box-shadow: inset 0 1px rgba(255, 255, 255, 0.06) !important;
    overflow: hidden;
    transition: transform 420ms var(--hl-ease), border-color 300ms ease, background 300ms ease !important;
}

body.hiline-ui.hiline-home #cases .case-item::before {
    position: absolute;
    top: 22px;
    right: 26px;
    color: rgba(255, 255, 255, 0.35);
    content: attr(data-category);
    font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
    font-size: 8px;
    letter-spacing: 0.13em;
    text-transform: uppercase;
}

body.hiline-ui.hiline-home #cases .case-item::after {
    position: absolute;
    right: 28px;
    bottom: 25px;
    display: grid;
    width: 30px;
    height: 30px;
    place-items: center;
    border: 1px solid rgba(255, 255, 255, 0.17);
    border-radius: 50%;
    color: rgba(255, 255, 255, 0.78);
    content: "↗";
    font-size: 13px;
    transition: transform 260ms var(--hl-ease), background-color 260ms ease;
}

body.hiline-ui.hiline-home #cases .case-item:hover {
    border-color: rgba(126, 185, 255, 0.38) !important;
    background: linear-gradient(145deg, rgba(21, 97, 202, 0.15), rgba(255, 255, 255, 0.035)) !important;
    transform: translateY(-6px);
}

body.hiline-ui.hiline-home #cases .case-item:hover::after {
    transform: translate(3px, -3px);
    background: rgba(255, 255, 255, 0.1);
}

body.hiline-ui.hiline-home #cases .case-item.is-featured {
    border-color: rgba(255, 255, 255, 0.92) !important;
    background:
        radial-gradient(circle at 90% 10%, rgba(46, 130, 255, 0.2), transparent 30%),
        linear-gradient(145deg, #fff, #edf4ff) !important;
    box-shadow: 0 30px 90px rgba(0, 74, 173, 0.24) !important;
}

body.hiline-ui.hiline-home #cases .case-item.is-featured::before {
    color: rgba(6, 16, 29, 0.4);
}

body.hiline-ui.hiline-home #cases .case-item.is-featured::after {
    border-color: rgba(6, 16, 29, 0.15);
    color: #06101d;
}

body.hiline-ui.hiline-home #cases .case-item.is-featured h3,
body.hiline-ui.hiline-home #cases .case-item.is-featured .text-primary,
body.hiline-ui.hiline-home #cases .case-item.is-featured .text-gray-900 {
    color: #06101d !important;
}

body.hiline-ui.hiline-home #cases .case-item.is-featured p,
body.hiline-ui.hiline-home #cases .case-item.is-featured li,
body.hiline-ui.hiline-home #cases .case-item.is-featured .text-gray-500,
body.hiline-ui.hiline-home #cases .case-item.is-featured .text-gray-600 {
    color: rgba(6, 16, 29, 0.62) !important;
}

body.hiline-ui.hiline-home #cases .case-item.is-featured > div:last-child {
    border-color: rgba(6, 16, 29, 0.12);
}

body.hiline-ui.hiline-home #cases .case-item > div:first-child {
    width: 48px !important;
    height: 48px !important;
    border-radius: 14px !important;
}

body.hiline-ui.hiline-home #cases .case-item h3 {
    max-width: 88%;
    margin-top: 34px;
    font-size: clamp(1.35rem, 1.8vw, 1.75rem) !important;
    line-height: 1.14;
}

body.hiline-ui.hiline-home #cases .case-item.is-featured h3 {
    max-width: 78%;
    font-size: clamp(1.75rem, 2.5vw, 2.45rem) !important;
}

body.hiline-ui.hiline-home #pagination-dots {
    align-items: center;
    gap: 7px;
}

body.hiline-ui.hiline-home #pagination-dots .case-page-dot {
    width: 6px !important;
    min-width: 0 !important;
    height: 6px !important;
    min-height: 0 !important;
    flex: 0 0 6px;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 999px !important;
    background: rgba(255, 255, 255, 0.28) !important;
    box-shadow: none !important;
    transition: width 240ms var(--hl-ease), flex-basis 240ms var(--hl-ease), background-color 240ms ease;
}

body.hiline-ui.hiline-home #pagination-dots .case-page-dot.is-active {
    width: 28px !important;
    flex-basis: 28px;
    background: #58a6ff !important;
}

body.hiline-ui.hiline-home #page-info {
    color: rgba(255, 255, 255, 0.45) !important;
    font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
    font-size: 9px;
    letter-spacing: 0.1em;
}

/* Homepage technology radar. */
body.hiline-ui.hiline-home .hiline-tech-radar {
    color: var(--hl-ink);
    background: #f5f7fa !important;
}

.hiline-tech-radar-head {
    display: grid;
    grid-template-columns: minmax(0, 0.92fr) minmax(320px, 1.08fr);
    gap: clamp(2rem, 7vw, 7rem);
    align-items: end;
    margin-bottom: clamp(3rem, 5vw, 4.75rem);
}

.hiline-kicker {
    display: block;
    margin-bottom: 20px;
    color: var(--hl-blue);
    font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 0.13em;
}

.hiline-tech-radar-head h2 {
    margin: 0;
    color: var(--hl-ink);
    font-size: clamp(2.7rem, 5vw, 4.7rem) !important;
    line-height: 0.98;
    letter-spacing: -0.065em;
}

.hiline-tech-radar-head > p {
    max-width: 620px;
    margin: 0;
    justify-self: end;
    color: var(--hl-steel);
    font-size: 1.05rem;
    line-height: 1.72;
}

.hiline-tech-radar-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.15fr) minmax(0, 0.85fr);
    gap: 16px;
}

.hiline-tech-lead,
.hiline-tech-note {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    border: 1px solid rgba(11, 13, 16, 0.1);
    color: inherit;
    text-decoration: none;
    overflow: hidden;
    transition: transform 360ms var(--hl-ease), border-color 260ms ease, box-shadow 360ms ease;
}

.hiline-tech-lead {
    min-height: 570px;
    padding: clamp(2rem, 4vw, 4rem);
    border-radius: 30px;
    color: #fff;
    background:
        radial-gradient(circle at 78% 24%, rgba(87, 158, 255, 0.55), transparent 25%),
        radial-gradient(circle at 90% 85%, rgba(48, 89, 218, 0.32), transparent 32%),
        #07101f;
}

.hiline-tech-lead::before {
    position: absolute;
    top: 12%;
    right: -7%;
    width: 62%;
    aspect-ratio: 1;
    border: 1px solid rgba(255, 255, 255, 0.16);
    border-radius: 50%;
    box-shadow: 0 0 0 54px rgba(255, 255, 255, 0.025), 0 0 0 108px rgba(255, 255, 255, 0.015);
    content: "";
}

.hiline-tech-stack {
    display: grid;
    gap: 16px;
}

.hiline-tech-note {
    min-height: 277px;
    padding: clamp(1.75rem, 3vw, 2.7rem);
    border-radius: 24px;
    background: #fff;
}

.hiline-tech-note:nth-child(2) {
    background: linear-gradient(145deg, #e9f2ff, #f8fbff);
}

.hiline-tech-lead:hover,
.hiline-tech-note:hover {
    transform: translateY(-5px);
    border-color: rgba(9, 105, 232, 0.32);
    box-shadow: 0 28px 70px rgba(31, 58, 91, 0.13);
}

.hiline-tech-meta {
    position: relative;
    z-index: 1;
    display: flex;
    justify-content: space-between;
    font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
    font-size: 8px;
    letter-spacing: 0.11em;
    opacity: 0.58;
}

.hiline-tech-lead > div:last-child,
.hiline-tech-note > div:last-child {
    position: relative;
    z-index: 1;
}

.hiline-tech-index {
    color: var(--hl-blue);
    font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
    font-size: 10px;
}

.hiline-tech-lead h3,
.hiline-tech-note h3 {
    margin: 16px 0 14px;
    color: inherit !important;
    line-height: 1.03;
    letter-spacing: -0.05em;
}

body.hiline-ui .hiline-tech-lead h3 {
    color: #fff !important;
}

.hiline-tech-lead h3 {
    font-size: clamp(3.3rem, 6vw, 6.2rem) !important;
}

.hiline-tech-note h3 {
    max-width: 520px;
    font-size: clamp(1.45rem, 2.3vw, 2.15rem) !important;
}

.hiline-tech-lead p,
.hiline-tech-note p {
    max-width: 580px;
    margin: 0;
    line-height: 1.7;
}

.hiline-tech-lead p {
    color: rgba(255, 255, 255, 0.66) !important;
}

.hiline-tech-note p {
    color: var(--hl-steel) !important;
}

.hiline-tech-link {
    display: inline-block;
    margin-top: 26px;
    color: #7fbcff;
    font-size: 0.9rem;
}

/* Technical briefs — concise, sourced, and deliberately editorial. */
body.hiline-ui.hiline-insight-page .hiline-hero {
    min-height: 690px;
    background:
        radial-gradient(circle at 82% 32%, rgba(38, 126, 255, 0.17), transparent 25%),
        linear-gradient(rgba(11, 13, 16, 0.035) 1px, transparent 1px),
        linear-gradient(90deg, rgba(11, 13, 16, 0.035) 1px, transparent 1px),
        #f5f7fa !important;
    background-size: auto, 72px 72px, 72px 72px, auto !important;
}

body.hiline-ui.hiline-insight-page .hiline-hero h1 {
    max-width: 980px;
}

.tech-brief-heading {
    display: grid;
    grid-template-columns: minmax(0, 0.92fr) minmax(320px, 1.08fr);
    gap: clamp(2rem, 7vw, 7rem);
    align-items: end;
    margin-bottom: clamp(3rem, 5vw, 4.5rem);
}

.tech-brief-heading h2 {
    margin: 0;
    color: var(--hl-ink);
    font-size: clamp(2.5rem, 4.6vw, 4.5rem) !important;
    line-height: 1;
    letter-spacing: -0.06em;
}

.tech-brief-heading > p {
    max-width: 620px;
    margin: 0;
    justify-self: end;
    color: var(--hl-steel);
    line-height: 1.75;
}

.tech-brief-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}

.tech-source-card {
    display: flex;
    min-height: 430px;
    flex-direction: column;
    justify-content: space-between;
    padding: clamp(2rem, 3.6vw, 3.5rem);
    border: 1px solid rgba(11, 13, 16, 0.1);
    border-radius: 26px;
    background: #fff;
}

.tech-source-card--dark {
    color: #fff;
    background:
        radial-gradient(circle at 88% 12%, rgba(75, 146, 255, 0.42), transparent 30%),
        #07101f;
}

.tech-source-card--blue {
    background: linear-gradient(145deg, #e7f1ff, #f9fbff);
}

.tech-source-meta,
.tech-source-foot {
    display: flex;
    gap: 1rem;
    align-items: center;
    justify-content: space-between;
}

.tech-source-meta {
    font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
    font-size: 8px;
    letter-spacing: 0.11em;
    opacity: 0.5;
}

.tech-source-card h3 {
    margin: auto 0 1.3rem;
    color: inherit !important;
    font-size: clamp(2.35rem, 4.2vw, 4.5rem) !important;
    line-height: 1;
    letter-spacing: -0.055em;
}

body.hiline-ui .tech-source-card--dark h3 {
    color: #fff !important;
}

.tech-source-card > p {
    max-width: 660px;
    margin: 0 0 2.4rem;
    color: var(--hl-steel) !important;
    line-height: 1.75;
}

.tech-source-card--dark > p {
    color: rgba(255, 255, 255, 0.66) !important;
}

.tech-source-foot {
    padding-top: 1rem;
    border-top: 1px solid rgba(11, 13, 16, 0.1);
    color: var(--hl-steel);
    font-size: 0.78rem;
}

.tech-source-card--dark .tech-source-foot {
    border-color: rgba(255, 255, 255, 0.13);
    color: rgba(255, 255, 255, 0.58);
}

.tech-source-foot a {
    flex: 0 0 auto;
    color: var(--hl-blue);
    font-size: 0.72rem;
    text-decoration: none;
}

.tech-source-card--dark .tech-source-foot a {
    color: #7fbcff;
}

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

.tech-decision-grid > div {
    min-height: 300px;
    padding: clamp(1.8rem, 3vw, 2.7rem);
    border-right: 1px solid var(--hl-line);
    border-bottom: 1px solid var(--hl-line);
    background: rgba(255, 255, 255, 0.6);
}

.tech-decision-grid span {
    color: var(--hl-blue);
    font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
    font-size: 9px;
}

.tech-decision-grid h3 {
    margin: 4rem 0 1rem;
    color: var(--hl-ink) !important;
    font-size: 1.35rem !important;
}

.tech-decision-grid p {
    margin: 0;
    color: var(--hl-steel) !important;
    line-height: 1.7;
}

@media (min-width: 1024px) {
    body.hiline-ui #services > div > .grid {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    }

    body.hiline-ui .hiline-feature-layout {
        grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr) !important;
    }

    body.hiline-ui #about > div > .grid > div:last-child {
        position: sticky;
        top: 100px;
        align-self: start;
    }

    body.hiline-ui #contact > div > .grid {
        grid-template-columns: minmax(0, 1.1fr) minmax(340px, 0.9fr) !important;
    }
}

@media (max-width: 1100px) {
    body.hiline-home nav.hiline-nav .hidden[class~="md:flex"] {
        display: none !important;
    }

    body.hiline-home nav.hiline-nav button[onclick*="toggleMobileMenu"] {
        display: flex !important;
        align-items: center;
        justify-content: center;
    }

    body.hiline-home nav.hiline-nav #mobile-menu:not(.hidden) {
        display: block !important;
    }

    body.hiline-ui #prevPage {
        right: auto !important;
        left: 8px !important;
    }

    body.hiline-ui #nextPage {
        right: 8px !important;
        left: auto !important;
    }
}

@media (max-width: 1023px) {
    .tech-brief-heading {
        grid-template-columns: 1fr;
        gap: 1.4rem;
    }

    .tech-brief-heading > p {
        justify-self: start;
    }

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

    body.hiline-ui.hiline-home #cases-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    body.hiline-ui.hiline-home #cases .case-item.is-featured {
        grid-column: 1 / -1;
    }

    .hiline-tech-radar-head,
    .hiline-tech-radar-grid {
        grid-template-columns: 1fr;
        gap: 1.5rem;
    }

    .hiline-tech-radar-head > p {
        justify-self: start;
    }

    .hiline-tech-lead {
        min-height: 480px;
    }

    body.hiline-ui.hiline-subpage .hiline-hero {
        min-height: 640px;
    }

    body.hiline-ui .hiline-hero-system {
        padding-right: 1.5rem;
        padding-left: 1.5rem;
    }

    body.hiline-ui.hiline-home .hiline-hero > div > .grid {
        grid-template-columns: 1fr !important;
    }

    body.hiline-ui.hiline-home .hiline-hero {
        min-height: auto;
    }

    .hiline-network {
        max-width: 760px;
        margin: 1rem auto 0;
        transform: none;
    }

    body.hiline-ui.hiline-home #services > div > .text-center,
    body.hiline-ui.hiline-home #cases > div > .text-center,
    body.hiline-ui.hiline-home #solutions > div > .text-center,
    body.hiline-ui.hiline-home #contact > div > .text-center {
        grid-template-columns: 1fr;
        gap: 1.35rem;
    }

    body.hiline-ui.hiline-home #services > div > .text-center p,
    body.hiline-ui.hiline-home #cases > div > .text-center p,
    body.hiline-ui.hiline-home #solutions > div > .text-center p,
    body.hiline-ui.hiline-home #contact > div > .text-center p {
        justify-self: start;
    }

    body.hiline-ui.hiline-home #partners > div > .text-center,
    body.hiline-ui.hiline-home #customers > div > .text-center {
        grid-template-columns: 1fr;
        gap: 1rem;
    }

    body.hiline-ui.hiline-home #partners > div > .text-center p,
    body.hiline-ui.hiline-home #customers > div > .text-center p {
        justify-self: start;
    }

    body.hiline-ui.hiline-home #about > div > .grid {
        grid-template-columns: 1fr !important;
    }

    body.hiline-ui .hiline-ecosystem__intro {
        grid-template-columns: 1fr;
        gap: 1.4rem;
    }

    body.hiline-ui .hiline-ecosystem__copy {
        max-width: 680px;
        justify-self: start;
    }

    body.hiline-ui .hiline-architecture-stage {
        min-height: 0;
    }

    body.hiline-ui .hiline-architecture-routes {
        display: none;
    }

    body.hiline-ui .hiline-architecture-grid {
        grid-template-columns: 1fr;
        gap: 34px;
        min-height: 0;
        padding: 28px;
    }

    body.hiline-ui .hiline-architecture-column {
        position: relative;
    }

    body.hiline-ui .hiline-architecture-column:not(:last-child)::after {
        position: absolute;
        bottom: -27px;
        left: 50%;
        width: 1px;
        height: 19px;
        background: linear-gradient(var(--hl-blue), rgba(9, 105, 232, 0.12));
        content: "";
    }

    body.hiline-ui .hiline-architecture-label {
        height: auto;
        margin-bottom: 12px;
    }

    body.hiline-ui .hiline-architecture-list {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 12px;
        min-height: 0;
    }

    body.hiline-ui .hiline-architecture-column--core {
        justify-content: center;
    }

    body.hiline-ui .hiline-core-node {
        max-width: 460px;
    }
}

@media (max-width: 767px) {
    .tech-brief-grid,
    .tech-decision-grid {
        grid-template-columns: 1fr;
    }

    .tech-source-card {
        min-height: 410px;
        padding: 28px;
        border-radius: 22px;
    }

    .tech-source-foot {
        align-items: flex-start;
        flex-direction: column;
    }

    .tech-decision-grid > div {
        min-height: 250px;
    }

    .tech-decision-grid h3 {
        margin-top: 3rem;
    }

    body.hiline-ui.hiline-home #cases-grid {
        grid-template-columns: 1fr !important;
    }

    body.hiline-ui.hiline-home #cases .case-item.is-featured {
        grid-column: auto;
    }

    body.hiline-ui.hiline-home .hiline-case-stage {
        min-height: 0;
        padding-bottom: 3.5rem;
    }

    body.hiline-ui.hiline-home #cases .case-item {
        min-height: 400px;
        padding: 28px !important;
        border-radius: 22px !important;
    }

    body.hiline-ui.hiline-home #prevPage,
    body.hiline-ui.hiline-home #nextPage {
        top: auto !important;
        bottom: 0;
        width: 38px !important;
        min-width: 38px !important;
        height: 38px !important;
        min-height: 38px !important;
        transform: none !important;
    }

    .hiline-tech-radar-head {
        margin-bottom: 2.5rem;
    }

    .hiline-tech-radar-grid,
    .hiline-tech-stack {
        gap: 12px;
    }

    .hiline-tech-lead {
        min-height: 430px;
        padding: 28px;
        border-radius: 22px;
    }

    .hiline-tech-note {
        min-height: 280px;
        padding: 28px;
        border-radius: 20px;
    }

    html {
        scroll-padding-top: 68px;
    }

    body.hiline-ui nav.hiline-nav [class~="h-16"] {
        height: 64px !important;
    }

    body.hiline-ui nav.hiline-nav img {
        height: 30px !important;
    }

    body.hiline-ui nav.hiline-nav > .hiline-lang-floating {
        top: 11px !important;
        right: 12px !important;
    }

    body.hiline-ui nav.hiline-nav > .hiline-lang-floating #lang-dropdown-btn {
        min-height: 40px;
        padding: 0 10px !important;
    }

    body.hiline-ui nav.hiline-nav > .hiline-lang-floating #current-lang,
    body.hiline-ui nav.hiline-nav > .hiline-lang-floating #lang-dropdown-btn svg:last-child {
        display: none;
    }

    body.hiline-subpage nav.hiline-nav [class~="h-16"] > a:last-child:not(:first-child) {
        margin-right: 50px !important;
        font-size: 12px;
    }

    body.hiline-ui .hiline-hero,
    body.hiline-ui.hiline-home .hiline-hero {
        min-height: 0;
        padding-top: 7rem !important;
        padding-bottom: 4.75rem !important;
        background-size: 40px 40px, 40px 40px, auto !important;
    }

    body.hiline-ui.hiline-subpage .hiline-hero {
        min-height: 600px;
        padding-top: 8rem !important;
        padding-bottom: 8.75rem !important;
        background-size: auto, 44px 44px, 44px 44px, auto !important;
    }

    body.hiline-ui.hiline-subpage .hiline-hero::before {
        top: 31%;
        right: -24%;
        width: 280px;
    }

    body.hiline-ui .hiline-hero-system {
        min-height: 68px;
        padding: 0 1rem;
    }

    body.hiline-ui .hiline-hero-system span {
        gap: 5px;
        font-size: 6px;
        letter-spacing: 0.035em;
    }

    body.hiline-ui .hiline-hero-system span + span {
        padding-left: 0.5rem;
    }

    body.hiline-ui .hiline-architecture-heading {
        margin-bottom: 1.25rem !important;
    }

    body.hiline-ui .hiline-case-architecture {
        border-radius: 14px;
        box-shadow: 0 22px 54px rgba(27, 50, 81, 0.12);
    }

    body.hiline-ui .hiline-hero h1,
    body.hiline-ui.hiline-subpage .hiline-hero h1 {
        font-size: clamp(2.8rem, 14vw, 4.25rem) !important;
        line-height: 1 !important;
        letter-spacing: -0.065em;
    }

    body.hiline-ui .hiline-hero p {
        font-size: 1rem !important;
        line-height: 1.65 !important;
    }

    body.hiline-ui .hiline-proof {
        gap: 0.8rem !important;
    }

    body.hiline-ui .hiline-proof > div + div {
        padding-left: 0.8rem;
    }

    .hiline-network {
        border-radius: 13px;
    }

    .hiline-network__bar {
        height: 46px;
        padding: 0 14px;
        font-size: 8px;
    }

    .hiline-network__footer {
        min-height: 58px;
        padding: 0 12px;
        gap: 10px;
        font-size: 6px;
    }

    .hiline-network__footer b {
        font-size: 9px;
    }

    body.hiline-ui .hiline-section {
        padding-top: 4.75rem !important;
        padding-bottom: 4.75rem !important;
    }

    body.hiline-ui .hiline-section h2,
    body.hiline-ui .hiline-heading {
        font-size: clamp(2.2rem, 11vw, 3.1rem) !important;
    }

    body.hiline-ui #multi-cloud.hiline-ecosystem {
        padding-top: 5.25rem !important;
        padding-bottom: 5.25rem !important;
    }

    body.hiline-ui .hiline-ecosystem__intro {
        margin-bottom: 2.5rem;
    }

    body.hiline-ui .hiline-ecosystem-canvas {
        border-radius: 18px;
        box-shadow: 0 24px 60px rgba(29, 52, 78, 0.13), inset 0 1px #fff;
    }

    body.hiline-ui .hiline-ecosystem-canvas__bar {
        grid-template-columns: auto 1fr auto;
        gap: 12px;
        padding: 0 12px;
        font-size: 7px;
    }

    body.hiline-ui .hiline-architecture-grid {
        gap: 30px;
        padding: 22px 16px 26px;
    }

    body.hiline-ui .hiline-architecture-column--providers .hiline-architecture-list {
        grid-template-columns: 1fr;
    }

    body.hiline-ui .hiline-provider-node,
    body.hiline-ui .hiline-service-node,
    body.hiline-ui .hiline-industry-node {
        min-height: 66px;
    }

    body.hiline-ui .hiline-service-node,
    body.hiline-ui .hiline-industry-node {
        padding-right: 12px;
        padding-left: 12px;
    }

    body.hiline-ui .hiline-service-node::after {
        display: none;
    }

    body.hiline-ui .hiline-ecosystem-canvas__footer {
        display: flex;
        min-height: 58px;
        flex-wrap: wrap;
        gap: 6px 14px;
        justify-content: space-between;
        padding: 10px 12px;
        font-size: 7px;
    }

    body.hiline-ui .hiline-ecosystem-canvas__footer span:last-child {
        justify-self: auto;
    }

    body.hiline-ui #services > div > .grid {
        grid-template-columns: 1fr !important;
    }

    body.hiline-ui #services > div > .grid > .hiline-card {
        min-height: 0;
        padding: 2rem !important;
    }

    body.hiline-ui #services .hiline-card::after {
        top: 2rem;
        right: 2rem;
    }

    body.hiline-ui.hiline-home #about .shadow-2xl > div > .grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    body.hiline-ui .hiline-card {
        border-radius: 12px !important;
    }

    body.hiline-ui a.hiline-card:hover,
    body.hiline-ui .hiline-card[data-hiline-interactive="true"]:hover {
        transform: none;
    }

    body.hiline-ui .hiline-action {
        width: 100%;
    }

    body.hiline-ui .case-filter-btn {
        width: auto;
    }

    body.hiline-ui main.hiline-legal {
        padding-top: 7rem !important;
        padding-bottom: 4rem !important;
    }

    body.hiline-ui .hiline-document {
        padding: 1.5rem !important;
        border-radius: 12px !important;
    }
}

/* ================================================================
   GLACIER GLASS — 2026 material revision
   A cloud-company interface should feel like looking through a calm
   operations window: layered, legible and precise. No opaque white
   cards, decorative grids or black template sections.
   ================================================================ */

:root {
    --hl-ink: #142538;
    --hl-ink-2: #24384d;
    --hl-paper: #d9e4ef;
    --hl-white: #e7eff7;
    --hl-steel: #52677c;
    --hl-steel-2: #718499;
    --hl-line: rgba(63, 88, 114, 0.17);
    --hl-line-dark: rgba(225, 239, 251, 0.2);
    --hl-blue: #0b66d4;
    --hl-blue-deep: #0755b4;
    --hl-blue-pale: rgba(91, 157, 225, 0.13);
    --hl-signal: #8bc9f4;
    --hl-dark: #1b344d;
    --hl-glass: rgba(224, 235, 246, 0.54);
    --hl-glass-strong: rgba(218, 231, 243, 0.72);
    --hl-glass-deep: rgba(24, 52, 78, 0.86);
    --hl-glass-line: rgba(255, 255, 255, 0.52);
    --hl-glass-shadow: 0 24px 64px rgba(44, 69, 95, 0.12), inset 0 1px rgba(255, 255, 255, 0.56);
    --hl-radius: 22px;
}

html {
    background: #d7e2ed;
}

body.hiline-ui {
    min-height: 100vh;
    background:
        linear-gradient(118deg, rgba(238, 245, 251, 0.44) 0%, rgba(205, 220, 234, 0.14) 38%, rgba(169, 195, 218, 0.24) 64%, rgba(226, 236, 245, 0.3) 100%),
        linear-gradient(180deg, #dce6f0 0%, #cbd9e7 48%, #d9e4ee 100%) !important;
    background-attachment: fixed !important;
}

body.hiline-ui::before {
    position: fixed;
    z-index: -1;
    top: -18vh;
    right: 8vw;
    width: min(56vw, 920px);
    height: 132vh;
    border-right: 1px solid rgba(255, 255, 255, 0.34);
    border-left: 1px solid rgba(85, 119, 151, 0.09);
    background: linear-gradient(180deg, rgba(235, 244, 251, 0.5), rgba(139, 179, 214, 0.1) 55%, rgba(235, 243, 250, 0.28));
    transform: rotate(14deg);
    content: "";
    pointer-events: none;
}

body.hiline-ui nav.hiline-nav {
    border-bottom-color: rgba(65, 90, 116, 0.14) !important;
    background: rgba(211, 225, 238, 0.68) !important;
    box-shadow: inset 0 1px rgba(255, 255, 255, 0.58) !important;
    -webkit-backdrop-filter: blur(28px) saturate(132%);
    backdrop-filter: blur(28px) saturate(132%);
}

body.hiline-ui nav.hiline-nav.is-scrolled {
    background: rgba(210, 224, 237, 0.84) !important;
}

body.hiline-ui nav.hiline-nav #lang-dropdown-btn,
body.hiline-ui nav.hiline-nav .group > div[class*="absolute"][class*="top-full"],
body.hiline-ui #lang-dropdown,
body.hiline-ui #mobile-menu {
    border-color: var(--hl-glass-line) !important;
    background: rgba(218, 231, 243, 0.8) !important;
    box-shadow: var(--hl-glass-shadow) !important;
    -webkit-backdrop-filter: blur(28px) saturate(128%);
    backdrop-filter: blur(28px) saturate(128%);
}

body.hiline-ui .hiline-hero,
body.hiline-ui.hiline-subpage .hiline-hero,
body.hiline-ui.hiline-insight-page .hiline-hero,
body.hiline-ui #multi-cloud.hiline-ecosystem,
body.hiline-ui .hiline-section,
body.hiline-ui .hiline-section.hiline-muted:not(.hiline-dark),
body.hiline-ui main.hiline-legal {
    border-top-color: rgba(55, 83, 110, 0.1) !important;
    background: transparent !important;
    background-image: none !important;
}

body.hiline-ui .hiline-hero::after,
body.hiline-ui.hiline-subpage .hiline-hero::before,
body.hiline-ui.hiline-home #cases::before {
    display: none !important;
}

body.hiline-ui .hiline-hero h1,
body.hiline-ui .hiline-section h2,
body.hiline-ui .hiline-heading,
.tech-brief-heading h2 {
    font-weight: 610 !important;
    letter-spacing: -0.048em !important;
}

body.hiline-ui.hiline-home .hiline-hero h1 {
    max-width: 760px;
    font-size: clamp(3.4rem, 6vw, 5.55rem) !important;
}

body.hiline-ui.hiline-home .hiline-proof {
    display: none !important;
}

body.hiline-ui .hiline-hero [class*="inline-flex"][class*="rounded-full"],
body.hiline-ui .hiline-ecosystem__eyebrow,
body.hiline-ui .hiline-kicker {
    font-family: "Avenir Next", Avenir, "PingFang SC", sans-serif !important;
    letter-spacing: 0.075em !important;
}

body.hiline-ui .hiline-proof {
    border-top-color: rgba(54, 82, 109, 0.17);
}

body.hiline-ui .hiline-proof > div + div {
    border-left-color: rgba(54, 82, 109, 0.17);
}

/* The network remains the signature, but reads as a real control surface. */
.hiline-network {
    border-color: rgba(225, 239, 251, 0.28);
    border-radius: 28px;
    background:
        linear-gradient(145deg, rgba(37, 73, 105, 0.88), rgba(23, 51, 78, 0.76)),
        rgba(28, 58, 86, 0.78);
    box-shadow: 0 34px 90px rgba(36, 62, 88, 0.22), inset 0 1px rgba(255, 255, 255, 0.2);
    transform: none;
    -webkit-backdrop-filter: blur(30px) saturate(120%);
    backdrop-filter: blur(30px) saturate(120%);
}

.hiline-network::after {
    display: none;
}

.hiline-network__live i,
.network-backbone,
.network-node {
    animation: none !important;
}

.network-backbone {
    stroke-dashoffset: 0;
}

.network-node {
    opacity: 1;
}

/* One consistent frosted material for content, proof and brand surfaces. */
body.hiline-ui .hiline-card,
body.hiline-ui .hiline-logo-tile,
body.hiline-ui #about .shadow-2xl,
body.hiline-ui .hiline-document,
body.hiline-ui .tech-source-card,
body.hiline-ui .tech-decision-grid > div {
    border-color: var(--hl-glass-line) !important;
    color: var(--hl-ink) !important;
    background: var(--hl-glass) !important;
    box-shadow: var(--hl-glass-shadow) !important;
    -webkit-backdrop-filter: blur(26px) saturate(124%);
    backdrop-filter: blur(26px) saturate(124%);
}

body.hiline-ui .hiline-card > [class*="w-"][class*="h-"][class*="bg-"],
body.hiline-ui .hiline-card > div > [class*="w-"][class*="h-"][class*="bg-"]:first-child {
    border: 1px solid rgba(11, 102, 212, 0.16) !important;
    color: var(--hl-blue) !important;
    background: rgba(11, 102, 212, 0.1) !important;
    box-shadow: inset 0 1px rgba(255, 255, 255, 0.42) !important;
}

body.hiline-ui .hiline-card > [class*="w-"][class*="h-"][class*="bg-"] svg,
body.hiline-ui .hiline-card > div > [class*="w-"][class*="h-"][class*="bg-"]:first-child svg,
body.hiline-ui .hiline-card > [class*="w-"][class*="h-"][class*="bg-"] i,
body.hiline-ui .hiline-card > div > [class*="w-"][class*="h-"][class*="bg-"]:first-child i {
    color: var(--hl-blue) !important;
}

body.hiline-ui a.hiline-card:hover,
body.hiline-ui .hiline-card[data-hiline-interactive="true"]:hover,
body.hiline-ui .hiline-logo-tile:hover {
    border-color: rgba(255, 255, 255, 0.72) !important;
    background: rgba(224, 237, 248, 0.7) !important;
    box-shadow: 0 28px 70px rgba(42, 71, 99, 0.15), inset 0 1px rgba(255, 255, 255, 0.7) !important;
}

body.hiline-ui .bg-white,
body.hiline-ui .bg-gray-50,
body.hiline-ui .bg-gray-100,
body.hiline-ui [class*="from-blue-50"],
body.hiline-ui [class*="from-cyan-50"],
body.hiline-ui [class*="from-indigo-50"],
body.hiline-ui [class*="from-green-50"],
body.hiline-ui [class*="from-orange-50"],
body.hiline-ui [class*="from-purple-50"],
body.hiline-ui [class*="from-emerald-50"],
body.hiline-ui [class*="from-teal-50"] {
    background-color: rgba(221, 233, 244, 0.38) !important;
    background-image: none !important;
}

body.hiline-ui #services > div > .grid {
    gap: 1px !important;
    border: 1px solid var(--hl-glass-line);
    border-radius: 28px;
    background: rgba(76, 103, 130, 0.12);
    box-shadow: var(--hl-glass-shadow);
    overflow: hidden;
    -webkit-backdrop-filter: blur(24px);
    backdrop-filter: blur(24px);
}

body.hiline-ui #services > div > .grid > .hiline-card {
    border: 0 !important;
    background: rgba(224, 235, 246, 0.48) !important;
    box-shadow: inset 0 1px rgba(255, 255, 255, 0.34) !important;
}

body.hiline-ui #services > div > .grid > .hiline-card:hover {
    background: rgba(224, 237, 248, 0.7) !important;
}

body.hiline-ui .hiline-ecosystem-canvas {
    border-color: var(--hl-glass-line);
    background: rgba(214, 228, 241, 0.56);
    box-shadow: var(--hl-glass-shadow);
    -webkit-backdrop-filter: blur(30px) saturate(124%);
    backdrop-filter: blur(30px) saturate(124%);
}

body.hiline-ui .hiline-provider-node,
body.hiline-ui .hiline-service-node,
body.hiline-ui .hiline-industry-node,
body.hiline-ui .hiline-core-node,
body.hiline-ui .hiline-ecosystem-canvas__bar,
body.hiline-ui .hiline-ecosystem-canvas__footer {
    border-color: rgba(255, 255, 255, 0.48) !important;
    background: rgba(222, 234, 245, 0.48) !important;
    box-shadow: inset 0 1px rgba(255, 255, 255, 0.54) !important;
}

/* Case studies: blue-grey glass, never a black wall or white spotlight card. */
body.hiline-ui #cases,
body.hiline-ui.hiline-home #cases {
    color: var(--hl-ink) !important;
    background: rgba(115, 145, 174, 0.16) !important;
    background-image: none !important;
    -webkit-backdrop-filter: blur(22px);
    backdrop-filter: blur(22px);
}

body.hiline-ui #cases h2,
body.hiline-ui #cases h3,
body.hiline-ui #cases .text-primary,
body.hiline-ui #cases .text-gray-900 {
    color: var(--hl-ink) !important;
}

body.hiline-ui #cases p,
body.hiline-ui #cases li,
body.hiline-ui #cases .text-gray-600,
body.hiline-ui #cases .text-gray-500 {
    color: var(--hl-steel) !important;
}

body.hiline-ui #cases div:has(> .case-filter-btn),
body.hiline-ui.hiline-home #cases div:has(> .case-filter-btn) {
    border-color: rgba(63, 88, 114, 0.18) !important;
    background: rgba(214, 228, 241, 0.28) !important;
}

body.hiline-ui .case-filter-btn {
    color: rgba(20, 37, 56, 0.58) !important;
}

body.hiline-ui .case-filter-btn:hover:not(.active) {
    color: var(--hl-ink) !important;
    background: rgba(220, 234, 246, 0.55) !important;
}

body.hiline-ui #cases .case-filter-btn.active,
body.hiline-ui.hiline-home #cases .case-filter-btn.active {
    color: #fff !important;
    background: var(--hl-blue) !important;
}

body.hiline-ui #cases .case-item,
body.hiline-ui.hiline-home #cases .case-item,
body.hiline-ui.hiline-home #cases .case-item.is-featured {
    border-color: var(--hl-glass-line) !important;
    background: rgba(218, 231, 243, 0.52) !important;
    box-shadow: var(--hl-glass-shadow) !important;
    -webkit-backdrop-filter: blur(28px) saturate(124%);
    backdrop-filter: blur(28px) saturate(124%);
}

body.hiline-ui.hiline-home #cases .case-item.is-featured {
    background: rgba(204, 224, 242, 0.68) !important;
    box-shadow: 0 30px 78px rgba(46, 78, 108, 0.16), inset 0 1px rgba(255, 255, 255, 0.68) !important;
}

body.hiline-ui.hiline-home #cases .case-item:hover,
body.hiline-ui.hiline-home #cases .case-item.is-featured:hover {
    border-color: rgba(255, 255, 255, 0.78) !important;
    background: rgba(215, 232, 246, 0.74) !important;
}

body.hiline-ui.hiline-home #cases .case-item::before,
body.hiline-ui.hiline-home #cases .case-item.is-featured::before {
    color: rgba(20, 37, 56, 0.38);
}

body.hiline-ui.hiline-home #cases .case-item::after,
body.hiline-ui.hiline-home #cases .case-item.is-featured::after {
    border-color: rgba(20, 37, 56, 0.16);
    color: var(--hl-ink);
}

body.hiline-ui.hiline-home #cases .case-item h3,
body.hiline-ui.hiline-home #cases .case-item.is-featured h3,
body.hiline-ui.hiline-home #cases .case-item .text-primary,
body.hiline-ui.hiline-home #cases .case-item .text-gray-900 {
    color: var(--hl-ink) !important;
}

body.hiline-ui.hiline-home #cases .case-item p,
body.hiline-ui.hiline-home #cases .case-item li,
body.hiline-ui.hiline-home #cases .case-item .text-gray-500,
body.hiline-ui.hiline-home #cases .case-item .text-gray-600 {
    color: var(--hl-steel) !important;
}

body.hiline-ui.hiline-home #pagination-dots .case-page-dot {
    background: rgba(44, 68, 92, 0.24) !important;
}

body.hiline-ui.hiline-home #pagination-dots .case-page-dot.is-active {
    background: var(--hl-blue) !important;
}

body.hiline-ui.hiline-home #page-info {
    color: rgba(20, 37, 56, 0.48) !important;
}

body.hiline-ui #prevPage,
body.hiline-ui #nextPage {
    border-color: var(--hl-glass-line) !important;
    color: var(--hl-ink) !important;
    background: rgba(218, 231, 243, 0.72) !important;
    box-shadow: var(--hl-glass-shadow) !important;
}

body.hiline-ui #prevPage svg,
body.hiline-ui #nextPage svg {
    color: var(--hl-ink) !important;
}

body.hiline-ui .hiline-brand-strip .hiline-logo-grid,
body.hiline-ui.hiline-home #about .shadow-2xl > div > .grid,
.tech-decision-grid {
    border-color: transparent;
    gap: 1px !important;
    border-radius: 24px;
    background: rgba(72, 98, 124, 0.11);
    box-shadow: var(--hl-glass-shadow);
    overflow: hidden;
}

body.hiline-ui .hiline-logo-tile,
body.hiline-ui.hiline-home #about .shadow-2xl > div > .grid > div,
.tech-decision-grid > div {
    border: 0 !important;
}

body.hiline-ui.hiline-home #solutions .hiline-feature-layout > .relative > div,
body.hiline-ui.hiline-home #solutions .hiline-feature-layout > .relative > div > div,
body.hiline-ui .hiline-feature-layout {
    border-color: var(--hl-glass-line) !important;
    background: rgba(216, 230, 242, 0.52) !important;
    background-image: none !important;
    box-shadow: var(--hl-glass-shadow) !important;
    -webkit-backdrop-filter: blur(28px) saturate(122%);
    backdrop-filter: blur(28px) saturate(122%);
}

body.hiline-ui.hiline-home #solutions .hiline-feature-layout > .space-y-8 > a:hover {
    background: rgba(218, 233, 246, 0.58) !important;
}

/* Subpages keep the same material hierarchy as the homepage. */
body.hiline-ui .hiline-hero-system {
    border-top-color: var(--hl-glass-line);
    background: rgba(211, 225, 238, 0.66);
    -webkit-backdrop-filter: blur(28px) saturate(126%);
    backdrop-filter: blur(28px) saturate(126%);
}

body.hiline-ui.hiline-subpage .hiline-card {
    border-color: var(--hl-glass-line) !important;
    border-radius: 22px !important;
}

body.hiline-ui .hiline-case-architecture {
    border-color: var(--hl-glass-line);
    background: rgba(211, 226, 239, 0.62);
    box-shadow: var(--hl-glass-shadow);
    -webkit-backdrop-filter: blur(26px) saturate(122%);
    backdrop-filter: blur(26px) saturate(122%);
}

body.hiline-ui .hiline-case-architecture img {
    background: #e7eff6;
}

body.hiline-ui.hiline-case-page section[class*="bg-primary"][class*="text-white"],
body.hiline-ui.hiline-solution-page section[class*="bg-primary"][class*="text-white"],
body.hiline-ui .hiline-dark,
body.hiline-ui footer {
    color: #eef6fd !important;
    border-color: rgba(226, 239, 251, 0.16) !important;
    background:
        linear-gradient(138deg, rgba(52, 91, 124, 0.34), rgba(19, 48, 74, 0.08)),
        var(--hl-glass-deep) !important;
    -webkit-backdrop-filter: blur(30px) saturate(118%);
    backdrop-filter: blur(30px) saturate(118%);
}

body.hiline-ui .hiline-dark .hiline-card,
body.hiline-ui .hiline-dark input,
body.hiline-ui .hiline-dark textarea,
body.hiline-ui .hiline-dark select {
    border-color: rgba(227, 240, 251, 0.18) !important;
    background: rgba(224, 237, 248, 0.08) !important;
    box-shadow: inset 0 1px rgba(255, 255, 255, 0.08) !important;
    -webkit-backdrop-filter: blur(20px);
    backdrop-filter: blur(20px);
}

/* Insights use information density, not oversized black/white feature cards. */
.tech-source-card,
.tech-source-card--dark,
.tech-source-card--blue {
    color: var(--hl-ink) !important;
    background: rgba(218, 231, 243, 0.56) !important;
    background-image: none !important;
}

.tech-source-card--dark {
    background: rgba(196, 219, 239, 0.7) !important;
}

.tech-source-card h3,
body.hiline-ui .tech-source-card--dark h3 {
    color: var(--hl-ink) !important;
    font-size: clamp(2.15rem, 3.5vw, 3.45rem) !important;
}

.tech-source-card > p,
.tech-source-card--dark > p {
    color: var(--hl-steel) !important;
}

.tech-source-card--dark .tech-source-foot {
    border-color: rgba(63, 88, 114, 0.16);
    color: var(--hl-steel);
}

.tech-source-card--dark .tech-source-foot a {
    color: var(--hl-blue);
}

body.hiline-ui .hiline-document section:last-child {
    border-color: var(--hl-glass-line) !important;
    background: rgba(209, 225, 239, 0.48) !important;
}

@media (max-width: 767px) {
    body.hiline-ui::before {
        right: -42vw;
        width: 110vw;
        opacity: 0.58;
    }

    body.hiline-ui .hiline-hero,
    body.hiline-ui.hiline-subpage .hiline-hero {
        background-image: none !important;
    }

    .hiline-network,
    body.hiline-ui .hiline-card,
    body.hiline-ui .hiline-case-architecture,
    .tech-source-card {
        border-radius: 18px !important;
    }
}

/* ================================================================
   PRISM GLASS — neutral material system + interactive AI graph
   ================================================================ */
:root {
    --hl-ink: #202126;
    --hl-ink-2: #2b2d34;
    --hl-paper: #cbc9c6;
    --hl-white: #f7f7f5;
    --hl-steel: #62656f;
    --hl-steel-2: #878a92;
    --hl-line: rgba(49, 52, 61, 0.13);
    --hl-blue: #5859d6;
    --hl-blue-deep: #4344b1;
    --hl-blue-pale: rgba(88, 89, 214, 0.09);
    --hl-signal: #46c2c7;
    --hl-green: #2ea974;
    --hl-glass: rgba(247, 247, 245, 0.34);
    --hl-glass-strong: rgba(250, 250, 248, 0.48);
    --hl-glass-deep: rgba(35, 37, 44, 0.82);
    --hl-glass-line: rgba(255, 255, 255, 0.52);
    --hl-glass-shadow: 0 26px 72px rgba(43, 45, 52, 0.13), inset 0 1px rgba(255, 255, 255, 0.64);
    --hl-prism-violet: #7470ee;
    --hl-prism-cyan: #56c5c7;
    --hl-prism-warm: #e8a073;
}

html {
    background: #cbc9c6;
}

body.hiline-ui {
    background:
        radial-gradient(circle at 9% 12%, rgba(255, 236, 219, 0.62), transparent 25rem),
        radial-gradient(circle at 88% 17%, rgba(189, 188, 246, 0.4), transparent 31rem),
        radial-gradient(circle at 74% 70%, rgba(174, 224, 223, 0.3), transparent 34rem),
        linear-gradient(135deg, #d7d2cd 0%, #c5c6c9 48%, #cfcbc7 100%) fixed !important;
}

body.hiline-ui::before {
    top: 2vh;
    right: -11vw;
    width: min(56vw, 880px);
    height: min(56vw, 880px);
    border: 1px solid rgba(255, 255, 255, 0.38);
    background:
        radial-gradient(circle at 38% 36%, rgba(255, 255, 255, 0.72), transparent 14%),
        radial-gradient(circle at 51% 49%, transparent 31%, rgba(117, 112, 238, 0.17) 32%, transparent 50%),
        conic-gradient(from 202deg, rgba(86, 197, 199, 0.14), rgba(255, 255, 255, 0.04), rgba(232, 160, 115, 0.17), rgba(117, 112, 238, 0.14), rgba(86, 197, 199, 0.14));
    filter: blur(2px);
    opacity: 0.74;
}

body.hiline-ui::after {
    position: fixed;
    z-index: -1;
    bottom: -26vw;
    left: -15vw;
    width: min(52vw, 780px);
    aspect-ratio: 1;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(255, 255, 255, 0.48), rgba(232, 160, 115, 0.13) 30%, transparent 68%);
    content: "";
    pointer-events: none;
}

body.hiline-ui nav.hiline-nav,
body.hiline-ui nav.hiline-nav.is-scrolled {
    border-bottom-color: rgba(49, 52, 61, 0.1) !important;
    background: rgba(216, 214, 211, 0.64) !important;
    box-shadow: inset 0 1px rgba(255, 255, 255, 0.7) !important;
    -webkit-backdrop-filter: blur(30px) saturate(145%);
    backdrop-filter: blur(30px) saturate(145%);
}

body.hiline-ui .bg-white,
body.hiline-ui .bg-gray-50,
body.hiline-ui .bg-gray-100,
body.hiline-ui [class*="from-blue-50"],
body.hiline-ui [class*="from-cyan-50"],
body.hiline-ui [class*="from-indigo-50"],
body.hiline-ui [class*="from-green-50"],
body.hiline-ui [class*="from-orange-50"],
body.hiline-ui [class*="from-purple-50"],
body.hiline-ui [class*="from-emerald-50"],
body.hiline-ui [class*="from-teal-50"] {
    background-color: rgba(247, 247, 245, 0.13) !important;
    background-image: none !important;
}

body.hiline-ui .hiline-card,
body.hiline-ui .hiline-document,
body.hiline-ui .tech-source-card,
body.hiline-ui .tech-decision-grid > div,
body.hiline-ui.hiline-home #solutions .hiline-feature-layout > .relative > div,
body.hiline-ui.hiline-home #solutions .hiline-feature-layout > .relative > div > div,
body.hiline-ui .hiline-feature-layout {
    border-color: rgba(255, 255, 255, 0.48) !important;
    background: rgba(247, 247, 245, 0.3) !important;
    box-shadow: var(--hl-glass-shadow) !important;
    -webkit-backdrop-filter: blur(30px) saturate(132%);
    backdrop-filter: blur(30px) saturate(132%);
}

body.hiline-ui a.hiline-card:hover,
body.hiline-ui .hiline-card[data-hiline-interactive="true"]:hover {
    border-color: rgba(255, 255, 255, 0.78) !important;
    background: rgba(253, 253, 251, 0.45) !important;
    box-shadow: 0 30px 80px rgba(49, 49, 58, 0.16), inset 0 1px rgba(255, 255, 255, 0.82) !important;
}

body.hiline-ui #services > div > .grid,
body.hiline-ui .hiline-brand-strip .hiline-logo-grid,
body.hiline-ui.hiline-home #about .shadow-2xl > div > .grid,
.tech-decision-grid {
    border-color: rgba(255, 255, 255, 0.48);
    background: rgba(66, 67, 75, 0.08);
}

body.hiline-ui #services > div > .grid > .hiline-card {
    background: rgba(247, 247, 245, 0.25) !important;
}

body.hiline-ui .hiline-card > [class*="w-"][class*="h-"][class*="bg-"],
body.hiline-ui .hiline-card > div > [class*="w-"][class*="h-"][class*="bg-"]:first-child {
    border-color: rgba(88, 89, 214, 0.16) !important;
    color: var(--hl-blue) !important;
    background: linear-gradient(135deg, rgba(116, 112, 238, 0.13), rgba(86, 197, 199, 0.08)) !important;
}

body.hiline-ui #cases,
body.hiline-ui.hiline-home #cases {
    background: rgba(80, 80, 88, 0.07) !important;
}

body.hiline-ui #cases div:has(> .case-filter-btn),
body.hiline-ui.hiline-home #cases div:has(> .case-filter-btn) {
    border-color: rgba(255, 255, 255, 0.42) !important;
    background: rgba(247, 247, 245, 0.22) !important;
}

body.hiline-ui #cases .case-filter-btn.active,
body.hiline-ui.hiline-home #cases .case-filter-btn.active {
    color: #fff !important;
    background: #31323a !important;
    box-shadow: 0 10px 26px rgba(31, 32, 38, 0.18) !important;
}

body.hiline-ui #cases .case-item,
body.hiline-ui.hiline-home #cases .case-item,
body.hiline-ui.hiline-home #cases .case-item.is-featured {
    background: rgba(247, 247, 245, 0.28) !important;
}

/* Partner and customer marks float inside one glass ribbon, never a table. */
body.hiline-ui.hiline-home #partners,
body.hiline-ui.hiline-home #customers {
    background: transparent !important;
}

body.hiline-ui.hiline-home #partners > div > .grid,
body.hiline-ui.hiline-home #customers > div > .grid {
    gap: clamp(1rem, 2.5vw, 2.4rem) !important;
    padding: clamp(1.35rem, 2.8vw, 2.5rem);
    border: 1px solid rgba(255, 255, 255, 0.52);
    border-radius: 30px;
    background:
        linear-gradient(115deg, rgba(255, 255, 255, 0.2), rgba(255, 255, 255, 0.06)),
        rgba(188, 188, 186, 0.22);
    box-shadow: 0 24px 70px rgba(48, 49, 56, 0.11), inset 0 1px rgba(255, 255, 255, 0.72);
    -webkit-backdrop-filter: blur(34px) saturate(125%);
    backdrop-filter: blur(34px) saturate(125%);
}

body.hiline-ui.hiline-home #partners .hiline-logo-tile,
body.hiline-ui.hiline-home #customers .hiline-logo-tile {
    min-height: 88px;
    padding: 0.75rem !important;
    border: 0 !important;
    border-radius: 18px !important;
    background: transparent !important;
    box-shadow: none !important;
    opacity: 1;
    transition: background-color 220ms ease, transform 220ms var(--hl-ease);
}

body.hiline-ui.hiline-home #partners .hiline-logo-tile:hover,
body.hiline-ui.hiline-home #customers .hiline-logo-tile:hover {
    background: rgba(255, 255, 255, 0.25) !important;
    transform: translateY(-3px);
}

body.hiline-ui.hiline-home #partners .hiline-logo-tile img,
body.hiline-ui.hiline-home #customers .hiline-logo-tile img {
    max-width: 150px;
    opacity: 1 !important;
    filter: saturate(0.9) contrast(1.06);
    mix-blend-mode: multiply;
}

/* Signature canvas: cloud resources → HiLine → industry → AI solutions → stack. */
.hiline-ai-explorer {
    position: relative;
    padding-top: clamp(5.5rem, 9vw, 9rem);
    padding-bottom: clamp(5.5rem, 9vw, 9rem);
    overflow: clip;
}

.hiline-ai-explorer::before {
    position: absolute;
    top: 10%;
    left: 50%;
    width: min(86vw, 1180px);
    height: 72%;
    border-radius: 50%;
    background: radial-gradient(ellipse, rgba(255, 255, 255, 0.48), rgba(116, 112, 238, 0.06) 42%, transparent 72%);
    content: "";
    transform: translateX(-50%);
    pointer-events: none;
}

.hiline-ai-explorer__intro {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1.05fr) minmax(300px, 0.72fr);
    gap: clamp(2rem, 8vw, 8rem);
    align-items: end;
    margin-bottom: clamp(2rem, 4vw, 3.5rem);
}

.hiline-ai-explorer__eyebrow {
    margin-bottom: 1rem;
    color: var(--hl-blue);
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.2em;
}

.hiline-ai-explorer__intro h2 {
    max-width: 760px;
    margin: 0;
    font-size: clamp(3rem, 6.2vw, 6.4rem) !important;
    font-weight: 650 !important;
    letter-spacing: -0.065em;
    line-height: 0.95;
}

.hiline-ai-explorer__intro p {
    max-width: 520px;
    margin: 0 0 0.45rem;
    color: var(--hl-steel);
    font-size: clamp(1rem, 1.3vw, 1.16rem);
    line-height: 1.8;
}

.hiline-ai-graph {
    position: relative;
    border: 1px solid rgba(255, 255, 255, 0.62);
    border-radius: 34px;
    background:
        linear-gradient(120deg, rgba(255, 255, 255, 0.4), rgba(255, 255, 255, 0.14) 48%, rgba(116, 112, 238, 0.05)),
        rgba(238, 238, 236, 0.24);
    box-shadow: 0 38px 110px rgba(41, 42, 48, 0.16), inset 0 1px rgba(255, 255, 255, 0.78);
    overflow: hidden;
    isolation: isolate;
    -webkit-backdrop-filter: blur(38px) saturate(130%);
    backdrop-filter: blur(38px) saturate(130%);
}

.hiline-ai-graph::before {
    position: absolute;
    top: -18%;
    right: 9%;
    width: 48%;
    aspect-ratio: 1.7;
    border-radius: 50%;
    background: radial-gradient(ellipse, rgba(116, 112, 238, 0.15), rgba(86, 197, 199, 0.07) 45%, transparent 70%);
    content: "";
    filter: blur(22px);
    pointer-events: none;
}

.hiline-ai-graph__bar,
.hiline-ai-graph__footer {
    position: relative;
    z-index: 2;
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    min-height: 52px;
    padding: 0 1.35rem;
    color: rgba(48, 50, 58, 0.62);
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 0.15em;
}

.hiline-ai-graph__bar {
    border-bottom: 1px solid rgba(54, 56, 65, 0.09);
    background: rgba(255, 255, 255, 0.12);
}

.hiline-ai-graph__bar > :nth-child(2) {
    justify-self: center;
}

.hiline-ai-graph__live {
    justify-self: end;
}

.hiline-ai-graph__live i,
.hiline-ai-graph__footer i,
.hiline-ai-cloud-map__core-status i {
    display: inline-block;
    width: 6px;
    height: 6px;
    margin-right: 7px;
    border-radius: 50%;
    background: var(--hl-green);
    box-shadow: 0 0 0 4px rgba(46, 169, 116, 0.1);
}

.hiline-ai-cloud-map {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: minmax(250px, 1.06fr) minmax(70px, 0.24fr) minmax(220px, 0.84fr) minmax(70px, 0.24fr) minmax(225px, 0.9fr);
    align-items: stretch;
    gap: 0;
    padding: clamp(1.5rem, 3vw, 2.6rem);
}

.hiline-ai-cloud-map__group,
.hiline-ai-graph__panel {
    min-width: 0;
}

.hiline-ai-graph__label {
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 22px;
    margin-bottom: 0.85rem;
    color: rgba(48, 50, 58, 0.52);
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.hiline-ai-cloud-map__provider-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.65rem;
}

.hiline-ai-cloud-map__provider-grid > div,
.hiline-ai-industry-node,
.hiline-ai-solution-node,
.hiline-ai-service-node,
.hiline-ai-scenario-node {
    border: 1px solid rgba(255, 255, 255, 0.5);
    background: rgba(248, 248, 246, 0.28);
    box-shadow: inset 0 1px rgba(255, 255, 255, 0.68), 0 10px 30px rgba(48, 49, 56, 0.06);
    -webkit-backdrop-filter: blur(20px) saturate(122%);
    backdrop-filter: blur(20px) saturate(122%);
}

.hiline-ai-cloud-map__provider-grid > div {
    display: flex;
    gap: 0.65rem;
    align-items: center;
    min-height: 72px;
    padding: 0.8rem;
    border-radius: 16px;
}

.hiline-ai-cloud-map__provider-grid img,
.hiline-ai-cloud-map__provider-grid > div > i {
    display: grid;
    flex: 0 0 34px;
    width: 34px;
    height: 34px;
    place-items: center;
    border-radius: 10px;
    object-fit: contain;
    font-size: 20px;
    font-style: normal;
}

.hiline-ai-cloud-map__provider-grid span,
.hiline-ai-industry-node span,
.hiline-ai-solution-node span,
.hiline-ai-service-node span {
    min-width: 0;
}

.hiline-ai-cloud-map__provider-grid b,
.hiline-ai-industry-node b,
.hiline-ai-solution-node b,
.hiline-ai-service-node b {
    display: block;
    overflow: hidden;
    color: var(--hl-ink);
    font-size: 12px;
    font-weight: 650;
    letter-spacing: -0.01em;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.hiline-ai-cloud-map__provider-grid small,
.hiline-ai-industry-node small,
.hiline-ai-solution-node small,
.hiline-ai-service-node small,
.hiline-ai-scenario-node small {
    display: block;
    margin-top: 4px;
    overflow: hidden;
    color: rgba(72, 74, 83, 0.46);
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
    font-size: 7px;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.hiline-ai-cloud-map__connector {
    position: relative;
    display: block;
    align-self: center;
    height: 1px;
    margin: 1rem 0.7rem 0;
    background: linear-gradient(90deg, rgba(88, 89, 214, 0.15), rgba(88, 89, 214, 0.68), rgba(86, 197, 199, 0.55));
}

.hiline-ai-cloud-map__connector::after {
    position: absolute;
    top: -3px;
    right: -1px;
    width: 7px;
    height: 7px;
    border: solid var(--hl-signal);
    border-width: 1px 1px 0 0;
    content: "";
    transform: rotate(45deg);
}

.hiline-ai-cloud-map__connector i {
    position: absolute;
    top: -3px;
    left: 52%;
    width: 7px;
    height: 7px;
    border: 2px solid #e9e9e7;
    border-radius: 50%;
    background: var(--hl-blue);
    box-shadow: 0 0 0 5px rgba(88, 89, 214, 0.1);
}

.hiline-ai-cloud-map__core-card {
    display: grid;
    min-height: 162px;
    padding: 1.25rem;
    border: 1px solid rgba(255, 255, 255, 0.38);
    border-radius: 24px;
    color: #f6f6f3;
    background:
        radial-gradient(circle at 80% 5%, rgba(86, 197, 199, 0.2), transparent 32%),
        linear-gradient(145deg, rgba(54, 55, 65, 0.94), rgba(41, 42, 50, 0.82));
    box-shadow: 0 24px 48px rgba(39, 40, 48, 0.18), inset 0 1px rgba(255, 255, 255, 0.18);
}

.hiline-ai-cloud-map__core-status {
    align-self: start;
    color: rgba(247, 247, 244, 0.56);
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
    font-size: 8px;
    font-weight: 700;
    letter-spacing: 0.14em;
}

.hiline-ai-cloud-map__core-card img {
    width: 128px;
    max-height: 44px;
    margin: 1rem 0 0.7rem;
    object-fit: contain;
    object-position: left center;
}

.hiline-ai-cloud-map__core-card p {
    align-self: end;
    margin: 0;
    color: rgba(247, 247, 244, 0.62);
    font-size: 11px;
    line-height: 1.6;
}

.hiline-ai-graph__nodes,
.hiline-ai-graph__services {
    display: grid;
    gap: 0.65rem;
}

.hiline-ai-industry-node,
.hiline-ai-solution-node {
    position: relative;
    display: flex;
    width: 100%;
    gap: 0.75rem;
    align-items: center;
    min-height: 56px;
    padding: 0.72rem 0.8rem;
    border-radius: 16px;
    text-align: left;
    transition: border-color 200ms ease, background-color 200ms ease, box-shadow 200ms ease, transform 200ms var(--hl-ease);
}

.hiline-ai-industry-node:hover,
.hiline-ai-solution-node:hover {
    transform: translateY(-2px);
}

.hiline-ai-industry-node > i,
.hiline-ai-solution-node > i {
    flex: 0 0 8px;
    width: 8px;
    height: 8px;
    border: 1px solid rgba(88, 89, 214, 0.34);
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.6);
}

.hiline-ai-industry-node[aria-pressed="true"],
.hiline-ai-solution-node[aria-pressed="true"] {
    border-color: rgba(88, 89, 214, 0.42);
    background: linear-gradient(115deg, rgba(116, 112, 238, 0.16), rgba(86, 197, 199, 0.09));
    box-shadow: inset 0 1px rgba(255, 255, 255, 0.74), 0 12px 32px rgba(88, 89, 214, 0.1);
}

.hiline-ai-industry-node[aria-pressed="true"] > i,
.hiline-ai-solution-node[aria-pressed="true"] > i {
    border-color: #fff;
    background: var(--hl-blue);
    box-shadow: 0 0 0 5px rgba(88, 89, 214, 0.1);
}

.hiline-ai-graph__bridge {
    position: relative;
    z-index: 2;
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    gap: 1rem;
    align-items: center;
    padding: 0 clamp(1.5rem, 3vw, 2.6rem);
    color: var(--hl-blue);
}

.hiline-ai-graph__bridge span {
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(88, 89, 214, 0.28));
}

.hiline-ai-graph__bridge span:last-child {
    background: linear-gradient(90deg, rgba(86, 197, 199, 0.3), transparent);
}

.hiline-ai-graph__bridge i {
    display: grid;
    width: 34px;
    height: 34px;
    place-items: center;
    border: 1px solid rgba(255, 255, 255, 0.56);
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.25);
    box-shadow: inset 0 1px rgba(255, 255, 255, 0.64);
    font-size: 12px;
    font-style: normal;
}

.hiline-ai-graph__body {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: minmax(190px, 0.62fr) minmax(250px, 0.95fr) minmax(300px, 1.18fr);
    gap: 1rem;
    padding: clamp(1.5rem, 3vw, 2.6rem);
}

.hiline-ai-graph__panel {
    padding: 1rem;
    border: 1px solid rgba(255, 255, 255, 0.42);
    border-radius: 22px;
    background: rgba(245, 245, 243, 0.18);
    box-shadow: inset 0 1px rgba(255, 255, 255, 0.52);
}

.hiline-ai-graph__panel--scenario {
    background: linear-gradient(145deg, rgba(116, 112, 238, 0.09), rgba(245, 245, 243, 0.16));
}

.hiline-ai-scenario-node {
    padding: 1.2rem;
    border-radius: 18px;
}

.hiline-ai-scenario-node > i {
    display: block;
    width: 22px;
    height: 22px;
    margin-bottom: 1.2rem;
    border: 6px solid rgba(88, 89, 214, 0.12);
    border-radius: 50%;
    background: var(--hl-blue);
    box-shadow: 0 0 0 1px rgba(88, 89, 214, 0.18);
}

.hiline-ai-scenario-node strong {
    display: block;
    color: var(--hl-ink);
    font-size: clamp(1.2rem, 2vw, 1.7rem);
    font-weight: 650;
    letter-spacing: -0.04em;
}

.hiline-ai-graph__panel--scenario > p {
    margin: 1rem 0 0;
    color: var(--hl-steel);
    font-size: 11px;
    line-height: 1.65;
}

.hiline-ai-graph__panel--services .hiline-ai-graph__label strong {
    overflow: hidden;
    max-width: 54%;
    color: var(--hl-blue);
    font-size: 9px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.hiline-ai-service-node {
    display: flex;
    gap: 0.75rem;
    align-items: center;
    min-height: 49px;
    padding: 0.65rem 0.8rem;
    border-radius: 14px;
}

.hiline-ai-service-node > i {
    flex: 0 0 18px;
    width: 18px;
    height: 18px;
    border: 1px solid rgba(86, 197, 199, 0.26);
    border-radius: 6px;
    background: linear-gradient(135deg, rgba(86, 197, 199, 0.34), rgba(116, 112, 238, 0.18));
}

.hiline-ai-graph__foundation {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1px;
    margin: 0 clamp(1.5rem, 3vw, 2.6rem) clamp(1.5rem, 3vw, 2.6rem);
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.4);
    border-radius: 15px;
    background: rgba(54, 56, 65, 0.08);
}

.hiline-ai-graph__foundation span {
    padding: 0.8rem;
    color: rgba(52, 54, 62, 0.52);
    background: rgba(248, 248, 246, 0.2);
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
    font-size: 8px;
    font-weight: 700;
    letter-spacing: 0.11em;
    text-align: center;
}

.hiline-ai-graph__footer {
    grid-template-columns: auto 1fr;
    gap: 2rem;
    border-top: 1px solid rgba(54, 56, 65, 0.09);
    background: rgba(255, 255, 255, 0.1);
}

.hiline-ai-graph__footer > :last-child {
    justify-self: end;
    color: rgba(48, 50, 58, 0.44);
    letter-spacing: 0.07em;
}

body.hiline-ui.hiline-solution-page section[class*="bg-primary"][class*="text-white"],
body.hiline-ui .hiline-dark,
body.hiline-ui footer {
    color: #efefec !important;
    border-color: rgba(255, 255, 255, 0.12) !important;
    background:
        radial-gradient(circle at 85% 15%, rgba(116, 112, 238, 0.14), transparent 28rem),
        linear-gradient(145deg, rgba(48, 49, 57, 0.94), rgba(34, 35, 41, 0.88)) !important;
}

@media (max-width: 1100px) {
    .hiline-ai-cloud-map {
        grid-template-columns: minmax(220px, 1fr) 54px minmax(190px, 0.75fr) 54px minmax(200px, 0.85fr);
        padding-right: 1.4rem;
        padding-left: 1.4rem;
    }

    .hiline-ai-cloud-map__provider-grid {
        grid-template-columns: 1fr;
    }

    .hiline-ai-cloud-map__provider-grid > div {
        min-height: 55px;
    }

    .hiline-ai-graph__body {
        grid-template-columns: 0.66fr 0.95fr 1.1fr;
        padding-right: 1.4rem;
        padding-left: 1.4rem;
    }
}

@media (max-width: 900px) {
    .hiline-ai-explorer__intro {
        grid-template-columns: 1fr;
        gap: 1.25rem;
    }

    .hiline-ai-cloud-map {
        grid-template-columns: 1fr;
        gap: 0.9rem;
    }

    .hiline-ai-cloud-map__provider-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .hiline-ai-cloud-map__connector {
        width: 1px;
        height: 32px;
        margin: 0 auto;
        background: linear-gradient(180deg, rgba(88, 89, 214, 0.18), rgba(86, 197, 199, 0.58));
    }

    .hiline-ai-cloud-map__connector::after {
        top: auto;
        right: -3px;
        bottom: -1px;
        transform: rotate(135deg);
    }

    .hiline-ai-cloud-map__connector i {
        top: 45%;
        left: -3px;
    }

    .hiline-ai-cloud-map__core-card {
        min-height: 150px;
    }

    .hiline-ai-cloud-map__industries .hiline-ai-graph__nodes {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .hiline-ai-graph__body {
        grid-template-columns: 1fr;
    }

    .hiline-ai-graph__panel--solutions .hiline-ai-graph__nodes,
    .hiline-ai-graph__services {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 767px) {
    body.hiline-ui::before {
        right: -52vw;
        width: 125vw;
        opacity: 0.52;
    }

    .hiline-ai-explorer {
        padding-top: 4.5rem;
        padding-bottom: 4.5rem;
    }

    .hiline-ai-explorer__intro h2 {
        font-size: clamp(2.7rem, 14vw, 4.4rem) !important;
    }

    .hiline-ai-graph {
        border-radius: 22px;
    }

    .hiline-ai-graph__bar {
        grid-template-columns: auto 1fr;
        min-height: 46px;
        padding: 0 0.9rem;
    }

    .hiline-ai-graph__bar > :nth-child(2) {
        display: none;
    }

    .hiline-ai-cloud-map,
    .hiline-ai-graph__body {
        padding: 1rem;
    }

    .hiline-ai-cloud-map__provider-grid,
    .hiline-ai-cloud-map__industries .hiline-ai-graph__nodes,
    .hiline-ai-graph__panel--solutions .hiline-ai-graph__nodes,
    .hiline-ai-graph__services {
        grid-template-columns: 1fr;
    }

    .hiline-ai-graph__foundation {
        grid-template-columns: repeat(2, 1fr);
        margin: 0 1rem 1rem;
    }

    .hiline-ai-graph__footer {
        display: flex;
        flex-direction: column;
        gap: 0.45rem;
        align-items: flex-start;
        padding: 0.8rem 1rem;
        line-height: 1.5;
    }

    .hiline-ai-graph__footer > :last-child {
        justify-self: auto;
    }

    body.hiline-ui.hiline-home #partners > div > .grid,
    body.hiline-ui.hiline-home #customers > div > .grid {
        gap: 0.5rem !important;
        padding: 0.8rem;
        border-radius: 22px;
    }

    body.hiline-ui.hiline-home #partners .hiline-logo-tile,
    body.hiline-ui.hiline-home #customers .hiline-logo-tile {
        min-height: 74px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .hiline-ai-industry-node,
    .hiline-ai-solution-node,
    body.hiline-ui.hiline-home #partners .hiline-logo-tile,
    body.hiline-ui.hiline-home #customers .hiline-logo-tile {
        transition: none !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    html {
        scroll-behavior: auto;
    }

    body.hiline-ui *,
    body.hiline-ui *::before,
    body.hiline-ui *::after {
        scroll-behavior: auto !important;
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }

    body.hiline-ui [data-hiline-reveal] {
        opacity: 1;
        transform: none;
    }

    body.hiline-ui .hiline-route__pulse {
        display: none;
    }

    body.hiline-ui .hiline-route__backbone {
        stroke-dasharray: none;
    }
}

/* ================================================================
   AURORA GLASS — luminous surfaces and a true connected AI canvas
   ================================================================ */
:root {
    --hl-ink: #11182a;
    --hl-ink-2: #202a42;
    --hl-paper: #eef5ff;
    --hl-steel: #52627a;
    --hl-steel-2: #76849a;
    --hl-line: rgba(77, 99, 137, 0.14);
    --hl-blue: #5257e7;
    --hl-blue-deep: #3d42bd;
    --hl-signal: #12bfd2;
    --hl-glass: rgba(255, 255, 255, 0.48);
    --hl-glass-strong: rgba(255, 255, 255, 0.68);
    --hl-glass-line: rgba(255, 255, 255, 0.86);
    --hl-glass-shadow: 0 26px 70px rgba(69, 86, 132, 0.13), inset 0 1px rgba(255, 255, 255, 0.95);
}

html {
    background: #eef5ff;
}

body.hiline-ui {
    color: var(--hl-ink);
    background:
        radial-gradient(circle at 2% 8%, rgba(255, 255, 255, 0.98), transparent 25rem),
        radial-gradient(circle at 92% 12%, rgba(200, 210, 255, 0.68), transparent 32rem),
        radial-gradient(circle at 82% 62%, rgba(195, 247, 243, 0.62), transparent 36rem),
        radial-gradient(circle at 13% 78%, rgba(255, 224, 210, 0.55), transparent 31rem),
        linear-gradient(135deg, #f7faff 0%, #eaf3ff 43%, #f6f1ff 100%) fixed !important;
}

body.hiline-ui::before {
    border-color: rgba(255, 255, 255, 0.72);
    background:
        radial-gradient(circle at 35% 34%, rgba(255, 255, 255, 0.92), transparent 14%),
        radial-gradient(circle at 51% 49%, transparent 31%, rgba(116, 112, 238, 0.22) 32%, transparent 50%),
        conic-gradient(from 202deg, rgba(66, 218, 223, 0.24), rgba(255, 255, 255, 0.08), rgba(255, 176, 133, 0.23), rgba(111, 106, 242, 0.22), rgba(66, 218, 223, 0.24));
    opacity: 0.88;
}

body.hiline-ui::after {
    background: radial-gradient(circle, rgba(255, 255, 255, 0.68), rgba(255, 179, 137, 0.19) 32%, transparent 69%);
}

body.hiline-ui nav.hiline-nav,
body.hiline-ui nav.hiline-nav.is-scrolled {
    border-bottom-color: rgba(79, 98, 135, 0.11) !important;
    background: rgba(248, 251, 255, 0.7) !important;
    box-shadow: 0 12px 40px rgba(75, 93, 132, 0.08), inset 0 1px rgba(255, 255, 255, 0.96) !important;
}

body.hiline-ui .hiline-section:not(.hiline-dark),
body.hiline-ui .bg-white,
body.hiline-ui .bg-gray-50,
body.hiline-ui .bg-gray-100,
body.hiline-ui [class*="from-blue-50"],
body.hiline-ui [class*="from-cyan-50"],
body.hiline-ui [class*="from-indigo-50"],
body.hiline-ui [class*="from-green-50"],
body.hiline-ui [class*="from-orange-50"],
body.hiline-ui [class*="from-purple-50"],
body.hiline-ui [class*="from-emerald-50"],
body.hiline-ui [class*="from-teal-50"] {
    background-color: transparent !important;
    background-image: none !important;
}

body.hiline-ui .hiline-card,
body.hiline-ui .hiline-document,
body.hiline-ui .tech-source-card,
body.hiline-ui .tech-decision-grid > div,
body.hiline-ui .hiline-feature-layout {
    border-color: rgba(255, 255, 255, 0.84) !important;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.66), rgba(246, 250, 255, 0.34)) !important;
    box-shadow: 0 24px 66px rgba(70, 90, 138, 0.12), inset 0 1px rgba(255, 255, 255, 0.96) !important;
    -webkit-backdrop-filter: blur(28px) saturate(138%);
    backdrop-filter: blur(28px) saturate(138%);
}

body.hiline-ui a.hiline-card:hover,
body.hiline-ui .hiline-card[data-hiline-interactive="true"]:hover {
    border-color: rgba(111, 112, 242, 0.3) !important;
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.76), rgba(233, 239, 255, 0.5)) !important;
    box-shadow: 0 30px 76px rgba(75, 89, 167, 0.16), inset 0 1px rgba(255, 255, 255, 1) !important;
}

/* Home service cards are independent glass modules, not one ruled table. */
body.hiline-ui #services > div > .grid {
    gap: clamp(1rem, 2vw, 1.6rem) !important;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    overflow: visible;
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
}

body.hiline-ui #services > div > .grid > .hiline-card {
    border: 1px solid rgba(255, 255, 255, 0.86) !important;
    border-radius: 26px !important;
    background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.7), rgba(237, 244, 255, 0.37)) !important;
    box-shadow: 0 22px 58px rgba(65, 85, 132, 0.11), inset 0 1px #fff !important;
}

body.hiline-ui #services > div > .grid > .hiline-card:nth-child(3n + 2) {
    background: linear-gradient(145deg, rgba(247, 246, 255, 0.74), rgba(226, 236, 255, 0.44)) !important;
}

body.hiline-ui #services > div > .grid > .hiline-card:nth-child(3n) {
    background: linear-gradient(145deg, rgba(246, 255, 255, 0.74), rgba(222, 246, 246, 0.4)) !important;
}

body.hiline-ui #services > div > .grid > .hiline-card:hover {
    border-color: rgba(82, 87, 231, 0.25) !important;
    background: linear-gradient(145deg, rgba(255, 255, 255, 0.82), rgba(232, 239, 255, 0.54)) !important;
    transform: translateY(-5px);
}

/* Case studies regain contrast and separation without a dark wall. */
body.hiline-ui #cases,
body.hiline-ui.hiline-home #cases {
    background:
        radial-gradient(circle at 15% 35%, rgba(207, 227, 255, 0.54), transparent 28rem),
        radial-gradient(circle at 86% 62%, rgba(217, 204, 255, 0.43), transparent 30rem),
        rgba(239, 246, 255, 0.35) !important;
}

body.hiline-ui #cases div:has(> .case-filter-btn),
body.hiline-ui.hiline-home #cases div:has(> .case-filter-btn) {
    gap: 0.3rem !important;
    padding: 0.38rem !important;
    border-color: rgba(255, 255, 255, 0.82) !important;
    border-radius: 18px !important;
    background: rgba(255, 255, 255, 0.46) !important;
    box-shadow: 0 14px 36px rgba(69, 88, 131, 0.08), inset 0 1px #fff !important;
}

body.hiline-ui #cases .case-filter-btn.active,
body.hiline-ui.hiline-home #cases .case-filter-btn.active {
    color: #fff !important;
    background: linear-gradient(135deg, #5d62eb, #4349cb) !important;
    box-shadow: 0 10px 26px rgba(76, 81, 210, 0.24) !important;
}

body.hiline-ui #cases .case-item,
body.hiline-ui.hiline-home #cases .case-item,
body.hiline-ui.hiline-home #cases .case-item.is-featured {
    border: 1px solid rgba(255, 255, 255, 0.9) !important;
    background: linear-gradient(145deg, rgba(255, 255, 255, 0.72), rgba(236, 245, 255, 0.38)) !important;
    box-shadow: 0 24px 64px rgba(67, 86, 134, 0.12), inset 0 1px #fff !important;
}

body.hiline-ui.hiline-home #cases .case-item.is-featured {
    background:
        radial-gradient(circle at 90% 5%, rgba(169, 213, 255, 0.38), transparent 17rem),
        linear-gradient(145deg, rgba(255, 255, 255, 0.78), rgba(230, 242, 255, 0.48)) !important;
}

body.hiline-ui #prevPage,
body.hiline-ui #nextPage {
    border-color: rgba(255, 255, 255, 0.9) !important;
    background: rgba(255, 255, 255, 0.66) !important;
}

/* Brand ribbons stay airy and luminous; the marks carry the color. */
body.hiline-ui.hiline-home #partners > div > .grid,
body.hiline-ui.hiline-home #customers > div > .grid {
    border-color: rgba(255, 255, 255, 0.88);
    background:
        radial-gradient(circle at 12% 20%, rgba(255, 255, 255, 0.76), transparent 24rem),
        linear-gradient(120deg, rgba(255, 255, 255, 0.5), rgba(224, 237, 255, 0.3));
    box-shadow: 0 24px 66px rgba(66, 87, 136, 0.11), inset 0 1px #fff;
}

body.hiline-ui.hiline-home #partners .hiline-logo-tile,
body.hiline-ui.hiline-home #customers .hiline-logo-tile {
    min-height: 104px;
    border: 1px solid rgba(255, 255, 255, 0.88) !important;
    background: rgba(255, 255, 255, 0.66) !important;
    box-shadow: inset 0 1px #fff, 0 10px 28px rgba(73, 92, 133, 0.06) !important;
    overflow: hidden;
}

body.hiline-ui.hiline-home #partners .hiline-logo-tile img,
body.hiline-ui.hiline-home #customers .hiline-logo-tile img {
    width: 82%;
    height: 58px;
    max-width: none;
    max-height: none;
    object-fit: contain;
    object-position: center;
    transform: scale(var(--hiline-logo-scale, 1));
    transform-origin: center;
}

/* The source files contain very different amounts of internal whitespace.
   Calibrate visible mark area rather than distorting brand proportions. */
body.hiline-ui.hiline-home #partners .hiline-logo-tile:nth-child(1) { --hiline-logo-scale: 1.06; }
body.hiline-ui.hiline-home #partners .hiline-logo-tile:nth-child(2) { --hiline-logo-scale: 1.04; }
body.hiline-ui.hiline-home #partners .hiline-logo-tile:nth-child(3) { --hiline-logo-scale: 1.92; }
body.hiline-ui.hiline-home #partners .hiline-logo-tile:nth-child(4) { --hiline-logo-scale: 2.05; }
body.hiline-ui.hiline-home #partners .hiline-logo-tile:nth-child(5) { --hiline-logo-scale: 2.08; }
body.hiline-ui.hiline-home #partners .hiline-logo-tile:nth-child(6) { --hiline-logo-scale: 1.08; }

body.hiline-ui.hiline-home #customers .hiline-logo-tile:nth-child(1) { --hiline-logo-scale: 1.32; }
body.hiline-ui.hiline-home #customers .hiline-logo-tile:nth-child(2) { --hiline-logo-scale: 1.42; }
body.hiline-ui.hiline-home #customers .hiline-logo-tile:nth-child(3) { --hiline-logo-scale: 1.02; }
body.hiline-ui.hiline-home #customers .hiline-logo-tile:nth-child(4) { --hiline-logo-scale: 1.96; }
body.hiline-ui.hiline-home #customers .hiline-logo-tile:nth-child(5) { --hiline-logo-scale: 1.08; }
body.hiline-ui.hiline-home #customers .hiline-logo-tile:nth-child(6) { --hiline-logo-scale: 1.02; }
body.hiline-ui.hiline-home #customers .hiline-logo-tile:nth-child(7) { --hiline-logo-scale: 1.58; }
body.hiline-ui.hiline-home #customers .hiline-logo-tile:nth-child(8) { --hiline-logo-scale: 1.04; }
body.hiline-ui.hiline-home #customers .hiline-logo-tile:nth-child(9) { --hiline-logo-scale: 0.94; }
body.hiline-ui.hiline-home #customers .hiline-logo-tile:nth-child(10) { --hiline-logo-scale: 0.94; }
body.hiline-ui.hiline-home #customers .hiline-logo-tile:nth-child(11) { --hiline-logo-scale: 1.98; }
body.hiline-ui.hiline-home #customers .hiline-logo-tile:nth-child(12) { --hiline-logo-scale: 1.02; }

body.hiline-ui.hiline-home #partners .hiline-logo-tile:hover,
body.hiline-ui.hiline-home #customers .hiline-logo-tile:hover {
    border-color: rgba(101, 106, 232, 0.2) !important;
    background: rgba(255, 255, 255, 0.82) !important;
}

/* Remove opaque inset blocks in the solutions/about compositions. */
body.hiline-ui.hiline-home #solutions .hiline-feature-layout,
body.hiline-ui.hiline-home #solutions .hiline-feature-layout > .relative > div,
body.hiline-ui.hiline-home #solutions .hiline-feature-layout > .relative > div > div,
body.hiline-ui.hiline-home #about .shadow-2xl,
body.hiline-ui.hiline-home #about .shadow-2xl > div,
body.hiline-ui.hiline-home #about .shadow-2xl [class*="bg-"] {
    border-color: rgba(255, 255, 255, 0.82) !important;
    background:
        linear-gradient(140deg, rgba(255, 255, 255, 0.62), rgba(232, 242, 255, 0.32)) !important;
    box-shadow: 0 26px 70px rgba(67, 86, 132, 0.12), inset 0 1px #fff !important;
}

body.hiline-ui.hiline-home #about .shadow-2xl > div > .grid {
    gap: 1rem !important;
    padding: 1rem;
    border: 0;
    background: transparent;
}

/* The interactive map itself is bright glass, never a grey overlay. */
.hiline-ai-explorer::before {
    background: radial-gradient(ellipse, rgba(255, 255, 255, 0.88), rgba(150, 167, 255, 0.14) 42%, transparent 72%);
}

.hiline-ai-graph {
    border-color: rgba(255, 255, 255, 0.92);
    background:
        linear-gradient(120deg, rgba(255, 255, 255, 0.68), rgba(240, 247, 255, 0.38) 48%, rgba(219, 216, 255, 0.22)),
        rgba(238, 247, 255, 0.36);
    box-shadow: 0 38px 100px rgba(64, 83, 142, 0.15), inset 0 1px #fff;
}

.hiline-ai-graph::before {
    background: radial-gradient(ellipse, rgba(120, 115, 255, 0.23), rgba(45, 212, 220, 0.13) 45%, transparent 70%);
}

.hiline-ai-graph__bar,
.hiline-ai-graph__footer {
    color: rgba(40, 56, 88, 0.62);
    background: rgba(255, 255, 255, 0.28);
}

.hiline-ai-cloud-map__provider-grid > div,
.hiline-ai-industry-node,
.hiline-ai-scenario-option,
.hiline-ai-service-node {
    border-color: rgba(255, 255, 255, 0.92);
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.74), rgba(235, 244, 255, 0.4));
    box-shadow: inset 0 1px #fff, 0 12px 30px rgba(64, 84, 133, 0.08);
}

.hiline-ai-cloud-map__core-card {
    background:
        radial-gradient(circle at 83% 8%, rgba(74, 207, 215, 0.3), transparent 34%),
        linear-gradient(145deg, rgba(67, 73, 112, 0.94), rgba(45, 49, 80, 0.92));
    box-shadow: 0 24px 56px rgba(47, 55, 103, 0.24), inset 0 1px rgba(255, 255, 255, 0.24);
}

.hiline-ai-industry-node[aria-pressed="true"],
.hiline-ai-scenario-option[aria-pressed="true"] {
    border-color: rgba(102, 105, 239, 0.52);
    background: linear-gradient(120deg, rgba(226, 230, 255, 0.88), rgba(215, 249, 248, 0.62));
    box-shadow: inset 0 1px #fff, 0 14px 34px rgba(80, 88, 205, 0.15);
}

/* Clickable scenarios → selected AI solution → delivery stack. */
.hiline-ai-graph__flow {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: minmax(290px, 1.08fr) minmax(68px, 0.24fr) minmax(190px, 0.68fr) minmax(68px, 0.24fr) minmax(300px, 1.08fr);
    gap: 0;
    align-items: center;
    padding: clamp(1.6rem, 3.2vw, 3rem);
}

.hiline-ai-flow-column {
    position: relative;
    min-width: 0;
}

.hiline-ai-flow-column--scenarios .hiline-ai-graph__label strong {
    color: var(--hl-blue);
    font-size: 9px;
}

.hiline-ai-flow-column--scenarios .hiline-ai-graph__nodes,
.hiline-ai-flow-column--services .hiline-ai-graph__services {
    position: relative;
    gap: 0.75rem;
}

.hiline-ai-flow-column--scenarios .hiline-ai-graph__nodes::after,
.hiline-ai-flow-column--services .hiline-ai-graph__services::before {
    position: absolute;
    top: 9%;
    bottom: 9%;
    width: 1px;
    background: linear-gradient(180deg, transparent, rgba(82, 87, 231, 0.38) 16%, rgba(18, 191, 210, 0.4) 84%, transparent);
    content: "";
    pointer-events: none;
}

.hiline-ai-flow-column--scenarios .hiline-ai-graph__nodes::after {
    right: -12px;
}

.hiline-ai-flow-column--services .hiline-ai-graph__services::before {
    left: -12px;
}

.hiline-ai-scenario-option {
    position: relative;
    display: flex;
    width: 100%;
    gap: 0.8rem;
    align-items: center;
    min-height: 62px;
    padding: 0.78rem 0.9rem;
    border: 1px solid rgba(255, 255, 255, 0.92);
    border-radius: 17px;
    text-align: left;
    transition: transform 180ms var(--hl-ease), border-color 180ms ease, box-shadow 180ms ease, background-color 180ms ease;
}

.hiline-ai-scenario-option::after,
.hiline-ai-service-node::before {
    position: absolute;
    top: 50%;
    width: 12px;
    height: 1px;
    background: rgba(82, 87, 231, 0.32);
    content: "";
}

.hiline-ai-scenario-option::after {
    right: -13px;
}

.hiline-ai-service-node::before {
    left: -13px;
}

.hiline-ai-scenario-option:hover {
    border-color: rgba(82, 87, 231, 0.34);
    transform: translateX(4px);
}

.hiline-ai-scenario-option > i {
    flex: 0 0 10px;
    width: 10px;
    height: 10px;
    border: 2px solid rgba(82, 87, 231, 0.28);
    border-radius: 50%;
    background: #fff;
}

.hiline-ai-scenario-option[aria-pressed="true"] > i {
    border-color: #fff;
    background: var(--hl-blue);
    box-shadow: 0 0 0 5px rgba(82, 87, 231, 0.12);
}

.hiline-ai-scenario-option span,
.hiline-ai-scenario-option b,
.hiline-ai-scenario-option small {
    min-width: 0;
}

.hiline-ai-scenario-option b {
    display: block;
    overflow: hidden;
    color: var(--hl-ink);
    font-size: 12px;
    font-weight: 650;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.hiline-ai-scenario-option small {
    display: block;
    margin-top: 4px;
    overflow: hidden;
    color: var(--hl-blue);
    font-size: 9px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.hiline-ai-flow-connector {
    position: relative;
    display: block;
    height: 1px;
    margin: 1rem 0.8rem 0;
    background: linear-gradient(90deg, rgba(82, 87, 231, 0.25), rgba(82, 87, 231, 0.75), rgba(18, 191, 210, 0.68));
}

.hiline-ai-flow-connector::after {
    position: absolute;
    top: -3px;
    right: -1px;
    width: 7px;
    height: 7px;
    border: solid var(--hl-signal);
    border-width: 1px 1px 0 0;
    content: "";
    transform: rotate(45deg);
}

.hiline-ai-flow-connector i {
    position: absolute;
    top: -4px;
    left: 50%;
    width: 9px;
    height: 9px;
    border: 2px solid #f6faff;
    border-radius: 50%;
    background: var(--hl-blue);
    box-shadow: 0 0 0 6px rgba(82, 87, 231, 0.1);
}

.hiline-ai-active-solution {
    display: grid;
    width: 100%;
    min-height: 210px;
    padding: 1.4rem;
    place-items: center;
    border: 1px solid rgba(255, 255, 255, 0.9);
    border-radius: 28px;
    color: #fff;
    background:
        radial-gradient(circle at 82% 11%, rgba(49, 222, 221, 0.3), transparent 35%),
        linear-gradient(145deg, #6669ed, #454bc6);
    box-shadow: 0 26px 60px rgba(71, 78, 197, 0.25), inset 0 1px rgba(255, 255, 255, 0.32);
    text-align: center;
}

.hiline-ai-active-solution > span {
    display: grid;
    width: 46px;
    height: 46px;
    place-items: center;
    border: 1px solid rgba(255, 255, 255, 0.38);
    border-radius: 15px;
    background: rgba(255, 255, 255, 0.14);
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
    font-size: 12px;
    font-weight: 750;
    letter-spacing: 0.12em;
}

.hiline-ai-active-solution > b {
    color: #fff;
    font-size: clamp(1.35rem, 2.1vw, 2rem);
    font-weight: 680;
    letter-spacing: -0.045em;
}

.hiline-ai-active-solution > small {
    color: rgba(255, 255, 255, 0.66);
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
    font-size: 8px;
    font-weight: 700;
    letter-spacing: 0.14em;
}

.hiline-ai-service-node {
    position: relative;
}

.hiline-ai-graph__foundation {
    border-color: rgba(255, 255, 255, 0.78);
    background: rgba(101, 118, 157, 0.08);
}

.hiline-ai-graph__foundation span {
    color: rgba(39, 56, 90, 0.58);
    background: rgba(255, 255, 255, 0.38);
}

@media (max-width: 1000px) {
    .hiline-ai-graph__flow {
        grid-template-columns: minmax(250px, 1fr) 50px minmax(180px, 0.7fr) 50px minmax(260px, 1fr);
        padding-right: 1.4rem;
        padding-left: 1.4rem;
    }
}

@media (max-width: 900px) {
    .hiline-ai-graph__flow {
        grid-template-columns: 1fr;
        gap: 0.9rem;
    }

    .hiline-ai-flow-connector {
        width: 1px;
        height: 34px;
        margin: 0 auto;
        background: linear-gradient(180deg, rgba(82, 87, 231, 0.32), rgba(18, 191, 210, 0.68));
    }

    .hiline-ai-flow-connector::after {
        top: auto;
        right: -3px;
        bottom: -1px;
        transform: rotate(135deg);
    }

    .hiline-ai-flow-connector i {
        top: 48%;
        left: -4px;
    }

    .hiline-ai-flow-column--scenarios .hiline-ai-graph__nodes,
    .hiline-ai-flow-column--services .hiline-ai-graph__services {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .hiline-ai-flow-column--scenarios .hiline-ai-graph__nodes::after,
    .hiline-ai-flow-column--services .hiline-ai-graph__services::before,
    .hiline-ai-scenario-option::after,
    .hiline-ai-service-node::before {
        display: none;
    }

    .hiline-ai-active-solution {
        min-height: 180px;
    }
}

@media (max-width: 767px) {
    .hiline-ai-flow-column--scenarios .hiline-ai-graph__nodes,
    .hiline-ai-flow-column--services .hiline-ai-graph__services {
        grid-template-columns: 1fr;
    }

    .hiline-ai-graph__flow {
        padding: 1rem;
    }

    .hiline-ai-active-solution {
        min-height: 160px;
        border-radius: 22px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .hiline-ai-scenario-option {
        transition: none !important;
    }
}

/* Unified home modules — one glass color language, no clipped split panels. */
body.hiline-ui #services > div > .grid > .hiline-card,
body.hiline-ui #services > div > .grid > .hiline-card:nth-child(3n + 2),
body.hiline-ui #services > div > .grid > .hiline-card:nth-child(3n) {
    background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.72), rgba(234, 243, 255, 0.4)) !important;
}

body.hiline-ui #services > div > .grid > .hiline-card:hover,
body.hiline-ui #services > div > .grid > .hiline-card:nth-child(3n + 2):hover,
body.hiline-ui #services > div > .grid > .hiline-card:nth-child(3n):hover {
    background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.84), rgba(229, 239, 255, 0.52)) !important;
}

body.hiline-ui.hiline-home #solutions .hiline-feature-layout {
    gap: clamp(1.5rem, 3vw, 2.5rem) !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    overflow: visible !important;
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
}

body.hiline-ui.hiline-home #solutions .hiline-feature-layout > .space-y-8 {
    display: grid;
    gap: 0.9rem;
    padding: 0;
    border: 0 !important;
    background: transparent !important;
}

body.hiline-ui.hiline-home #solutions .hiline-feature-layout > .space-y-8 > * + * {
    margin-top: 0 !important;
}

body.hiline-ui.hiline-home #solutions .hiline-feature-layout > .space-y-8 > a {
    margin: 0;
    padding: clamp(1.25rem, 2.2vw, 1.75rem) !important;
    border: 1px solid rgba(255, 255, 255, 0.88) !important;
    border-radius: 24px !important;
    background:
        linear-gradient(140deg, rgba(255, 255, 255, 0.7), rgba(234, 243, 255, 0.38)) !important;
    box-shadow: 0 18px 46px rgba(68, 88, 135, 0.09), inset 0 1px #fff !important;
    -webkit-backdrop-filter: blur(24px) saturate(135%);
    backdrop-filter: blur(24px) saturate(135%);
}

body.hiline-ui.hiline-home #solutions .hiline-feature-layout > .space-y-8 > a:hover {
    padding-right: clamp(1.25rem, 2.2vw, 1.75rem) !important;
    padding-left: clamp(1.25rem, 2.2vw, 1.75rem) !important;
    border-color: rgba(89, 94, 230, 0.26) !important;
    background:
        linear-gradient(140deg, rgba(255, 255, 255, 0.84), rgba(228, 239, 255, 0.52)) !important;
    box-shadow: 0 23px 56px rgba(71, 88, 151, 0.13), inset 0 1px #fff !important;
    transform: translateY(-3px);
}

body.hiline-ui.hiline-home #solutions .hiline-feature-layout > .relative,
body.hiline-ui.hiline-home #solutions .hiline-feature-layout > .relative > div {
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
}

body.hiline-ui.hiline-home #solutions .hiline-feature-layout > .relative > div > div {
    height: 100%;
    padding: clamp(2rem, 4vw, 3.4rem) !important;
    border: 1px solid rgba(255, 255, 255, 0.88) !important;
    border-radius: 28px !important;
    background:
        radial-gradient(circle at 82% 10%, rgba(194, 231, 255, 0.34), transparent 18rem),
        linear-gradient(140deg, rgba(255, 255, 255, 0.72), rgba(234, 243, 255, 0.4)) !important;
    box-shadow: 0 24px 62px rgba(68, 87, 134, 0.12), inset 0 1px #fff !important;
    -webkit-backdrop-filter: blur(26px) saturate(138%);
    backdrop-filter: blur(26px) saturate(138%);
}

body.hiline-ui.hiline-home #solutions .hiline-feature-layout > .relative .grid > div {
    border: 1px solid rgba(255, 255, 255, 0.72) !important;
    color: var(--hl-steel) !important;
    background: rgba(243, 248, 255, 0.72) !important;
    box-shadow: inset 0 1px rgba(255, 255, 255, 0.86) !important;
}

body.hiline-ui.hiline-home #solutions .hiline-feature-layout > .relative .grid > div [class*="text-"] {
    color: var(--hl-blue) !important;
}

@media (max-width: 1023px) {
    body.hiline-ui.hiline-home #solutions .hiline-feature-layout {
        gap: 1.25rem !important;
    }
}