:root {
  color-scheme: light dark;
  --bg: #f7f9fc;
  --surface: #ffffff;
  --surface-2: #edf3f8;
  --hero-bg: #f3f7fb;
  --text: #0b1830;
  --muted: #5c6b80;
  --line: rgba(12, 31, 58, .11);
  --line-strong: rgba(12, 31, 58, .18);
  --blue: #0d7cff;
  --blue-2: #145be7;
  --green: #08cf93;
  --green-2: #00a875;
  --navy: #07101d;
  --navy-2: #0b1727;
  --white: #f7fbff;
  --shadow: 0 18px 55px rgba(28, 55, 85, .09);
  --shadow-lg: 0 36px 90px rgba(17, 42, 73, .16);
  --radius: 24px;
  --container: 1180px;
  --header-height: 84px;
  --ease: cubic-bezier(.22,.8,.2,1);
}

@media (prefers-color-scheme: dark) {
  html[data-theme="auto"] {
    --bg: #08111d;
    --surface: #0d1827;
    --surface-2: #111f31;
    --hero-bg: #07101d;
    --text: #edf6ff;
    --muted: #92a3ba;
    --line: rgba(218, 235, 255, .1);
    --line-strong: rgba(218, 235, 255, .18);
    --shadow: 0 20px 65px rgba(0,0,0,.26);
    --shadow-lg: 0 38px 110px rgba(0,0,0,.36);
  }
}

html[data-theme="dark"] {
  --bg: #08111d;
  --surface: #0d1827;
  --surface-2: #111f31;
  --hero-bg: #07101d;
  --text: #edf6ff;
  --muted: #92a3ba;
  --line: rgba(218, 235, 255, .1);
  --line-strong: rgba(218, 235, 255, .18);
  --shadow: 0 20px 65px rgba(0,0,0,.26);
  --shadow-lg: 0 38px 110px rgba(0,0,0,.36);
}

html[data-theme="light"] {
  --bg: #f7f9fc;
  --surface: #ffffff;
  --surface-2: #edf3f8;
  --hero-bg: #f3f7fb;
  --text: #0b1830;
  --muted: #5c6b80;
  --line: rgba(12, 31, 58, .11);
  --line-strong: rgba(12, 31, 58, .18);
  --shadow: 0 18px 55px rgba(28, 55, 85, .09);
  --shadow-lg: 0 36px 90px rgba(17, 42, 73, .16);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; overflow-x: hidden; }
body {
  margin: 0;
  background: var(--bg);
  color: var(--text);
  font-family: "Segoe UI Variable", "Segoe UI", Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
  font-size: 16px;
  line-height: 1.55;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}
body.menu-open { overflow: hidden; }
a { color: inherit; text-decoration: none; }
button, input, textarea, select { font: inherit; }
button { color: inherit; }
img, svg { display: block; max-width: 100%; }
svg { fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.container { width: min(calc(100% - 48px), var(--container)); margin-inline: auto; }
.section { padding: 116px 0; }
.site-shell { position: relative; }
.hero-surface { background: var(--hero-bg); }

.skip-link { position: fixed; top: 8px; left: 8px; z-index: 9999; transform: translateY(-140%); padding: 10px 14px; border-radius: 8px; background: var(--text); color: var(--bg); }
.skip-link:focus { transform: translateY(0); }

.site-header {
  height: var(--header-height);
  background: var(--hero-bg);
  position: sticky;
  top: 0;
  z-index: 100;
  transition: box-shadow .3s ease, border-color .3s ease, background-color .3s ease;
  border-bottom: 1px solid transparent;
}
.site-header.is-scrolled { border-color: var(--line); box-shadow: 0 10px 35px rgba(6,22,40,.08); }
.header-inner { height: 100%; display: flex; align-items: center; gap: 32px; }
.brand { display: inline-flex; align-items: center; gap: 11px; min-width: max-content; }
.brand-icon { position: relative; width: 43px; height: 43px; flex: 0 0 auto; }
.brand-icon img { width: 100%; height: 100%; object-fit: contain; filter: drop-shadow(0 8px 16px rgba(13,124,255,.14)); }
.brand-wordmark { display: flex; align-items: baseline; gap: 5px; letter-spacing: -.035em; font-size: 19px; line-height: 1; }
.brand-wordmark span { font-weight: 420; }
.brand-wordmark strong { font-weight: 760; }
.brand-shine { isolation: isolate; }
.brand-shine::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;
  background: linear-gradient(112deg, transparent 30%, rgba(255,255,255,.2) 43%, rgba(255,255,255,.98) 50%, rgba(174,235,255,.5) 56%, transparent 68%);
  transform: translateX(-140%);
  -webkit-mask: url('../img/icon-informatica-medios.png') center / contain no-repeat;
  mask: url('../img/icon-informatica-medios.png') center / contain no-repeat;
  animation: iconShine 5.2s var(--ease) infinite 1s;
}
@keyframes iconShine { 0%, 65% { transform: translateX(-140%); opacity: 0; } 72% { opacity: 1; } 88%, 100% { transform: translateX(140%); opacity: 0; } }

.desktop-nav { margin-left: auto; display: flex; align-items: center; gap: clamp(18px, 2vw, 32px); }
.desktop-nav a { position: relative; color: var(--muted); font-size: 14px; font-weight: 650; transition: color .2s ease; }
.desktop-nav a::after { content: ""; position: absolute; left: 0; right: 100%; bottom: -8px; height: 1px; background: linear-gradient(90deg,var(--blue),var(--green)); transition: right .25s var(--ease); }
.desktop-nav a:hover { color: var(--text); }
.desktop-nav a:hover::after { right: 0; }
.header-actions { display: flex; align-items: center; gap: 10px; }
.theme-toggle, .menu-toggle { width: 42px; height: 42px; border-radius: 50%; border: 1px solid var(--line); background: color-mix(in srgb, var(--surface) 55%, transparent); display: grid; place-items: center; cursor: pointer; transition: background .2s ease, transform .2s ease; }
.theme-toggle:hover, .menu-toggle:hover { background: var(--surface); transform: translateY(-1px); }
.theme-toggle svg { width: 18px; height: 18px; }
.icon-sun { display: none; }
html[data-theme="dark"] .icon-sun, html[data-theme="auto"] .icon-sun { display: block; }
html[data-theme="dark"] .icon-moon { display: none; }
html[data-theme="light"] .icon-sun { display: none; }
html[data-theme="light"] .icon-moon { display: block; }
@media (prefers-color-scheme: light) { html[data-theme="auto"] .icon-sun { display: none; } html[data-theme="auto"] .icon-moon { display: block; } }
.button { min-height: 48px; padding: 0 22px; border-radius: 14px; border: 1px solid transparent; display: inline-flex; align-items: center; justify-content: center; gap: 10px; font-weight: 700; font-size: 14px; letter-spacing: -.01em; transition: transform .2s var(--ease), box-shadow .2s ease, background .2s ease, border .2s ease; cursor: pointer; }
.button:hover { transform: translateY(-2px); }
.button-small { min-height: 42px; padding: 0 16px; border-radius: 12px; }
.button-primary { background: linear-gradient(135deg, var(--blue), var(--blue-2)); color: white; box-shadow: 0 15px 30px rgba(13,124,255,.22); }
.button-primary:hover { box-shadow: 0 20px 40px rgba(13,124,255,.3); }
.button-ghost { border-color: var(--line-strong); background: transparent; }
.menu-toggle { display: none; }
.menu-toggle span { width: 17px; height: 1.5px; background: currentColor; transition: transform .25s ease; }
.menu-toggle span + span { transform: translateY(4px); }
.menu-toggle[aria-expanded="true"] span:first-child { transform: translateY(1px) rotate(45deg); }
.menu-toggle[aria-expanded="true"] span:last-child { transform: translateY(-1px) rotate(-45deg); }
.mobile-menu { position: fixed; inset: var(--header-height) 0 0; z-index: 99; background: var(--hero-bg); border-top: 1px solid var(--line); }
.mobile-menu nav { display: grid; padding-top: 28px; }
.mobile-menu a { padding: 18px 0; border-bottom: 1px solid var(--line); display: flex; justify-content: space-between; font-size: clamp(22px, 6vw, 36px); font-weight: 700; letter-spacing: -.04em; }
.mobile-menu a span { color: var(--muted); font-size: 12px; letter-spacing: .1em; font-weight: 700; }

.hero { min-height: calc(100svh - var(--header-height)); padding-top: 54px; padding-bottom: 62px; display: grid; align-content: center; position: relative; }
.hero::before { content: ""; position: absolute; inset: 0 -200px; pointer-events: none; opacity: .55; background: radial-gradient(circle at 50% 45%, color-mix(in srgb, var(--blue) 9%, transparent), transparent 36%), radial-gradient(circle at 58% 50%, color-mix(in srgb, var(--green) 8%, transparent), transparent 32%); }
.hero-copy { text-align: center; max-width: 900px; margin: 0 auto 30px; position: relative; z-index: 3; }
.eyebrow { margin: 0 0 18px; display: flex; align-items: center; gap: 10px; color: var(--muted); text-transform: uppercase; letter-spacing: .15em; font-size: 11px; font-weight: 800; }
.hero-copy .eyebrow { justify-content: center; }
.eyebrow > span { width: 34px; height: 1px; background: linear-gradient(90deg,var(--blue),var(--green)); }
.hero h1 { margin: 0; font-size: clamp(48px, 7.2vw, 92px); line-height: .92; letter-spacing: -.068em; font-weight: 780; }
.hero h1 em { font-style: normal; color: transparent; background: linear-gradient(95deg, var(--blue), var(--green)); -webkit-background-clip: text; background-clip: text; }
.hero-lead { max-width: 780px; margin: 26px auto 0; color: var(--muted); font-size: clamp(17px, 1.65vw, 21px); line-height: 1.55; }

.hero-stage { width: min(100%, 840px); height: 480px; margin: 0 auto; position: relative; z-index: 2; }
.stage-grid { position: absolute; inset: 32px 140px; border-radius: 50%; opacity: .65; background-image: linear-gradient(var(--line) 1px, transparent 1px), linear-gradient(90deg,var(--line) 1px,transparent 1px); background-size: 26px 26px; -webkit-mask-image: radial-gradient(circle, #000 20%, transparent 72%); mask-image: radial-gradient(circle, #000 20%, transparent 72%); }
.orbit { position: absolute; left: 50%; top: 50%; translate: -50% -50%; border: 1px solid var(--line); border-radius: 50%; }
.orbit-a { width: 430px; height: 430px; }
.orbit-b { width: 310px; height: 310px; border-style: dashed; opacity: .7; }
.orbit::before, .orbit::after { content: ""; position: absolute; width: 5px; height: 5px; border-radius: 50%; background: var(--blue); box-shadow: 0 0 18px var(--blue); }
.orbit-a::before { top: 11%; left: 20%; background: var(--green); box-shadow: 0 0 18px var(--green); }
.orbit-a::after { right: 2%; top: 50%; }
.orbit-b::before { left: 13%; bottom: 16%; }
.orbit-b::after { right: 16%; top: 11%; background: var(--green); box-shadow: 0 0 18px var(--green); }
.orbit-runner { position: absolute; left: calc(50% - 3px); top: calc(50% - 3px); width: 6px; height: 6px; border-radius: 50%; transform-origin: 3px 3px; background: var(--green); box-shadow: 0 0 16px var(--green); }
.runner-a { animation: orbitA 11s linear infinite; }
.runner-b { background: var(--blue); box-shadow: 0 0 16px var(--blue); animation: orbitB 8s linear infinite reverse; }
@keyframes orbitA { to { transform: rotate(360deg) translateX(215px) rotate(-360deg); } }
@keyframes orbitB { to { transform: rotate(360deg) translateX(155px) rotate(-360deg); } }

.hero-logo { position: absolute; left: 50%; top: 50%; width: 220px; aspect-ratio: 1; translate: -50% -50%; z-index: 4; display: grid; place-items: center; }
.hero-logo::before { content: ""; position: absolute; inset: 16%; border-radius: 50%; background: radial-gradient(circle, color-mix(in srgb,var(--blue) 24%, transparent), color-mix(in srgb,var(--green) 11%, transparent) 40%, transparent 70%); filter: blur(30px); animation: breathe 4.5s ease-in-out infinite; }
.hero-logo img { position: relative; z-index: 1; width: 100%; height: 100%; object-fit: contain; filter: drop-shadow(0 28px 38px rgba(13,124,255,.16)); animation: logoFloat 5.5s ease-in-out infinite; }
.hero-logo.brand-shine::after { animation-duration: 4.4s; }
@keyframes breathe { 50% { transform: scale(1.16); opacity: .75; } }
@keyframes logoFloat { 50% { transform: translateY(-7px) rotate(.6deg); } }

.service-node { position: absolute; z-index: 6; min-width: 188px; padding: 12px 14px 12px 12px; border: 1px solid var(--line); background: color-mix(in srgb, var(--surface) 82%, transparent); backdrop-filter: blur(14px); border-radius: 16px; box-shadow: var(--shadow); display: flex; align-items: center; gap: 11px; transition: transform .25s var(--ease), border-color .25s ease, box-shadow .25s ease; }
.service-node:hover { transform: translateY(-4px); border-color: color-mix(in srgb,var(--blue) 42%, var(--line)); box-shadow: var(--shadow-lg); }
.node-icon { width: 38px; height: 38px; border-radius: 12px; flex: 0 0 auto; display: grid; place-items: center; color: var(--blue); background: color-mix(in srgb,var(--blue) 10%, transparent); }
.node-icon svg { width: 20px; height: 20px; }
.node-copy { display: grid; line-height: 1.2; }
.node-copy small { font-size: 9px; letter-spacing: .14em; color: var(--green-2); font-weight: 800; }
.node-copy strong { font-size: 13px; margin: 2px 0 3px; }
.node-copy span { color: var(--muted); font-size: 10px; }
.node-software { left: 2%; top: 20%; }
.node-ai { right: 0; top: 19%; }
.node-network { left: 0; bottom: 12%; }
.node-cctv { right: 0; bottom: 12%; }
.node-it { left: 50%; bottom: -2%; translate: -50% 0; }

.hero-actions { margin: 20px auto 0; display: flex; justify-content: center; align-items: center; gap: 28px; position: relative; z-index: 4; }
.text-link { display: inline-flex; align-items: center; gap: 10px; color: var(--text); font-weight: 720; font-size: 14px; }
.text-link span { color: var(--blue); transition: transform .2s ease; }
.text-link:hover span { transform: translate(2px,-2px); }
.hero-meta { margin-top: 62px; padding-top: 24px; border-top: 1px solid var(--line); display: grid; grid-template-columns: repeat(3, 1fr); position: relative; z-index: 4; }
.hero-meta > div { display: grid; gap: 3px; }
.hero-meta > div + div { border-left: 1px solid var(--line); padding-left: 34px; }
.hero-meta strong { font-size: 18px; letter-spacing: -.02em; }
.hero-meta span { color: var(--muted); font-size: 12px; }

.section-head { display: grid; grid-template-columns: minmax(0,1.5fr) minmax(280px,.65fr); gap: 80px; align-items: end; margin-bottom: 50px; }
.section-head.compact { grid-template-columns: 1fr; }
.section-head h2, .systems-copy h2, .smarttech-inner h2, .cta-card h2 { margin: 0; font-size: clamp(36px, 4vw, 58px); line-height: 1; letter-spacing: -.055em; }
.section-head > p { margin: 0 0 4px; color: var(--muted); font-size: 16px; }
.capabilities { background: var(--bg); }
.capability-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; }
.capability-card { min-height: 350px; position: relative; overflow: hidden; padding: 30px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface); box-shadow: 0 0 0 transparent; transition: transform .25s var(--ease), border-color .25s ease, box-shadow .25s ease; }
.capability-card::before { content: ""; position: absolute; width: 260px; height: 260px; border-radius: 50%; right: -130px; bottom: -140px; background: radial-gradient(circle, color-mix(in srgb,var(--blue) 10%, transparent), transparent 68%); transition: transform .5s var(--ease); }
.capability-card:hover { transform: translateY(-5px); border-color: var(--line-strong); box-shadow: var(--shadow); }
.capability-card:hover::before { transform: scale(1.35); }
.capability-featured { grid-row: span 2; min-height: 716px; background: linear-gradient(145deg, color-mix(in srgb,var(--surface) 96%, var(--blue)), var(--surface)); }
.capability-featured::after { content: ""; position: absolute; inset: auto 28px 28px auto; width: 270px; height: 270px; border-radius: 50%; border: 1px solid var(--line); box-shadow: inset 0 0 0 46px transparent, inset 0 0 0 47px var(--line), inset 0 0 0 92px transparent, inset 0 0 0 93px var(--line); opacity: .7; }
.card-index { color: var(--muted); font-size: 11px; letter-spacing: .12em; text-transform: uppercase; font-weight: 800; }
.card-icon { width: 54px; height: 54px; margin-top: 62px; border-radius: 16px; display: grid; place-items: center; color: white; background: linear-gradient(135deg,var(--blue),var(--green)); box-shadow: 0 14px 30px rgba(13,124,255,.18); }
.capability-featured .card-icon { margin-top: 180px; width: 62px; height: 62px; }
.card-icon svg { width: 27px; height: 27px; }
.capability-card h3 { max-width: 470px; margin: 22px 0 12px; font-size: clamp(26px, 2.5vw, 38px); line-height: 1.03; letter-spacing: -.045em; }
.capability-featured h3 { font-size: clamp(38px, 4vw, 58px); }
.capability-card p { max-width: 560px; color: var(--muted); margin: 0; font-size: 15px; }
.capability-featured p { max-width: 500px; font-size: 17px; }
.card-tags { position: absolute; left: 30px; bottom: 32px; max-width: 340px; display: flex; flex-wrap: wrap; gap: 8px; z-index: 2; }
.card-tags span { border: 1px solid var(--line); background: color-mix(in srgb,var(--surface) 80%,transparent); padding: 8px 11px; border-radius: 999px; font-size: 10px; color: var(--muted); }
.card-arrow { position: absolute; top: 28px; right: 28px; width: 42px; height: 42px; border-radius: 50%; border: 1px solid var(--line); display: grid; place-items: center; font-size: 17px; transition: background .2s ease, color .2s ease; }
.capability-card:hover .card-arrow { background: var(--text); color: var(--bg); }

.systems-section { background: var(--navy); color: var(--white); position: relative; overflow: hidden; }
.systems-section::before { content: ""; position: absolute; inset: 0; opacity: .24; background-image: linear-gradient(rgba(123,158,199,.08) 1px, transparent 1px),linear-gradient(90deg,rgba(123,158,199,.08) 1px,transparent 1px); background-size: 38px 38px; -webkit-mask-image: radial-gradient(circle at 70% 50%,#000,transparent 65%); mask-image: radial-gradient(circle at 70% 50%,#000,transparent 65%); }
.systems-grid { display: grid; grid-template-columns: .85fr 1.15fr; gap: 90px; align-items: center; position: relative; }
.eyebrow-light { color: #8aa0bb; }
.systems-copy p:not(.eyebrow) { color: #91a5bd; font-size: 17px; max-width: 520px; }
.text-link-light { color: #f0f7ff; margin-top: 22px; }
.system-console { min-height: 500px; border: 1px solid rgba(214,232,255,.12); border-radius: 26px; background: linear-gradient(145deg, rgba(17,36,59,.95), rgba(7,15,27,.95)); box-shadow: 0 35px 100px rgba(0,0,0,.35); overflow: hidden; }
.console-topbar { height: 52px; border-bottom: 1px solid rgba(214,232,255,.09); display: flex; align-items: center; gap: 8px; padding: 0 18px; }
.console-topbar > span { width: 7px; height: 7px; border-radius: 50%; background: #264260; }
.console-topbar > span:first-child { background: #0d7cff; }
.console-topbar > span:nth-child(2) { background: #08cf93; }
.console-topbar small { margin-left: auto; color: #69809a; font-family: ui-monospace,SFMono-Regular,Menlo,monospace; font-size: 10px; }
.console-body { position: relative; min-height: 448px; }
.console-body::before { content: ""; position: absolute; inset: 0; background: radial-gradient(circle at 50% 50%,rgba(13,124,255,.11),transparent 40%); }
.console-core { position: absolute; left: 50%; top: 50%; translate: -50% -50%; width: 160px; height: 160px; border-radius: 50%; border: 1px solid rgba(214,232,255,.12); display: grid; place-items: center; text-align: center; box-shadow: inset 0 0 55px rgba(13,124,255,.07); }
.console-core::before, .console-core::after { content: ""; position: absolute; border-radius: 50%; border: 1px solid rgba(214,232,255,.08); }
.console-core::before { inset: -40px; }
.console-core::after { inset: -85px; border-style: dashed; }
.console-core img { width: 82px; }
.console-core span { position: absolute; bottom: 16px; color: #6e88a6; text-transform: uppercase; letter-spacing: .14em; font-size: 8px; }
.console-flow { position: absolute; width: 155px; padding: 12px 14px 12px 31px; border: 1px solid rgba(214,232,255,.1); border-radius: 12px; background: rgba(13,27,44,.85); display: grid; line-height: 1.2; }
.console-flow i { position: absolute; left: 13px; top: 18px; width: 7px; height: 7px; border-radius: 50%; background: var(--green); box-shadow: 0 0 14px var(--green); }
.console-flow strong { font-size: 12px; }
.console-flow small { color: #7289a4; font-size: 9px; margin-top: 4px; font-family: ui-monospace,SFMono-Regular,Menlo,monospace; }
.flow-a { left: 7%; top: 15%; }.flow-b { right: 7%; top: 17%; }.flow-c { left: 7%; bottom: 15%; }.flow-d { right: 7%; bottom: 15%; }
.console-pulse { position: absolute; width: 8px; height: 8px; border-radius: 50%; background: var(--blue); box-shadow: 0 0 18px var(--blue); }
.pulse-1 { left: 50%; top: 50%; animation: consoleOrbit 8s linear infinite; }.pulse-2 { left: 50%; top: 50%; background: var(--green); box-shadow: 0 0 18px var(--green); animation: consoleOrbit 11s linear infinite reverse; }
@keyframes consoleOrbit { to { transform: rotate(360deg) translateX(122px) rotate(-360deg); } }
.console-status { position: absolute; bottom: 18px; left: 50%; translate: -50%; color: #7088a4; font-size: 9px; letter-spacing: .12em; text-transform: uppercase; display: flex; align-items: center; gap: 8px; }
.console-status span { width: 6px; height: 6px; border-radius: 50%; background: var(--green); box-shadow: 0 0 12px var(--green); }

.method { background: var(--surface); }
.method-list { list-style: none; padding: 0; margin: 56px 0 0; display: grid; grid-template-columns: repeat(4,1fr); }
.method-list li { min-height: 210px; padding: 0 26px; position: relative; border-left: 1px solid var(--line); }
.method-list li:first-child { padding-left: 0; border-left: 0; }
.method-list > li > span { display: block; color: var(--blue); font-size: 11px; letter-spacing: .14em; font-weight: 800; margin-bottom: 70px; }
.method-list h3 { margin: 0 0 9px; font-size: 23px; letter-spacing: -.03em; }
.method-list p { margin: 0; color: var(--muted); font-size: 14px; max-width: 220px; }

.smarttech-strip { padding: 70px 0; background: var(--surface-2); border-block: 1px solid var(--line); }
.smarttech-inner { display: grid; grid-template-columns: 90px 1.35fr 1fr auto; align-items: center; gap: 40px; }
.smarttech-mark { width: 76px; height: 76px; border: 1px solid var(--line-strong); border-radius: 20px; display: grid; place-items: center; font-size: 25px; font-weight: 800; letter-spacing: -.08em; background: var(--surface); }
.smarttech-mark span { color: var(--green); }
.smarttech-inner .eyebrow { margin-bottom: 12px; }
.smarttech-inner h2 { font-size: clamp(28px, 2.5vw, 40px); }
.smarttech-inner h2 strong { color: var(--blue); font-weight: inherit; }
.smarttech-inner > p { color: var(--muted); font-size: 14px; margin: 0; }

.cta-section { background: var(--bg); }
.cta-card { min-height: 380px; padding: 58px; border-radius: 32px; position: relative; overflow: hidden; display: grid; grid-template-columns: 1.35fr .65fr; gap: 70px; align-items: end; color: var(--white); background: linear-gradient(135deg,#07101d 0%,#0a1d32 55%,#0a2b38 100%); box-shadow: 0 35px 90px rgba(7,16,29,.22); }
.cta-card::before { content: ""; position: absolute; right: -120px; top: -200px; width: 560px; height: 560px; border-radius: 50%; background: radial-gradient(circle, rgba(8,207,147,.16), transparent 62%); }
.cta-grid { position: absolute; inset: 0; opacity: .22; background-image: linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px); background-size: 32px 32px; -webkit-mask-image: linear-gradient(90deg,transparent,#000); mask-image: linear-gradient(90deg,transparent,#000); }
.cta-card > *:not(.cta-grid) { position: relative; z-index: 2; }
.cta-side p { color: #96aac2; margin: 0 0 24px; }
.cta-actions { display: flex; flex-wrap: wrap; gap: 10px; }
.button-light { background: white; color: #07101d; }
.button-outline-light { color: white; background: transparent; border-color: rgba(255,255,255,.18); }

.site-footer { padding: 75px 0 24px; background: #050c15; color: #eaf4ff; }
.footer-grid { display: grid; grid-template-columns: .8fr 1.2fr; gap: 100px; }
.brand-footer .brand-wordmark { color: #f3f8ff; }
.footer-brand p { color: #7f93aa; margin: 26px 0 5px; font-size: 13px; }
.footer-brand small { color: #536b84; }
.footer-nav { display: grid; grid-template-columns: repeat(3,1fr); gap: 40px; }
.footer-nav > div { display: grid; align-content: start; gap: 10px; }
.footer-nav strong { color: #f0f6ff; font-size: 11px; text-transform: uppercase; letter-spacing: .14em; margin-bottom: 8px; }
.footer-nav a, .footer-nav span { color: #70869e; font-size: 13px; transition: color .2s ease; }
.footer-nav a:hover { color: white; }
.footer-bottom { margin-top: 60px; padding-top: 20px; border-top: 1px solid rgba(255,255,255,.08); display: flex; justify-content: space-between; color: #50647b; font-size: 11px; }

.quick-contact { position: fixed; right: 24px; bottom: 24px; z-index: 90; min-height: 50px; border: 1px solid rgba(255,255,255,.18); border-radius: 999px; padding: 0 18px 0 14px; color: white; background: #07101d; box-shadow: 0 18px 42px rgba(0,0,0,.24); display: flex; align-items: center; gap: 9px; cursor: pointer; }
.quick-contact svg { width: 20px; height: 20px; color: var(--green); }
.quick-contact > span:last-child { font-size: 12px; font-weight: 750; }
.quick-pulse { width: 7px; height: 7px; border-radius: 50%; background: var(--green); box-shadow: 0 0 0 0 rgba(8,207,147,.5); animation: quickPulse 2.2s infinite; }
@keyframes quickPulse { 70% { box-shadow: 0 0 0 9px rgba(8,207,147,0); } 100% { box-shadow: 0 0 0 0 rgba(8,207,147,0); } }
.contact-panel { position: fixed; right: 24px; bottom: 88px; z-index: 95; width: min(390px, calc(100vw - 32px)); border: 1px solid var(--line); border-radius: 22px; background: var(--surface); box-shadow: 0 30px 90px rgba(6,22,40,.24); transform: translateY(18px) scale(.96); opacity: 0; pointer-events: none; transition: transform .25s var(--ease), opacity .2s ease; overflow: hidden; }
.contact-panel.is-open { transform: none; opacity: 1; pointer-events: auto; }
.contact-panel-head { padding: 20px 20px 18px; display: flex; justify-content: space-between; align-items: start; color: white; background: linear-gradient(120deg,#07101d,#0a2130); }
.contact-panel-head div { display: grid; }
.contact-panel-head small { color: #7eecc9; font-size: 9px; letter-spacing: .15em; text-transform: uppercase; }
.contact-panel-head strong { margin-top: 4px; font-size: 18px; }
.contact-close { width: 32px; height: 32px; border: 1px solid rgba(255,255,255,.16); border-radius: 50%; background: transparent; color: white; font-size: 21px; cursor: pointer; }
.contact-panel-body { padding: 20px; }
.contact-panel-body > p { color: var(--muted); margin: 0 0 16px; font-size: 13px; }
.contact-people { display: grid; gap: 8px; }
.person-option { width: 100%; border: 1px solid var(--line); border-radius: 14px; padding: 10px; background: var(--surface-2); display: grid; grid-template-columns: 46px 1fr auto; align-items: center; gap: 11px; text-align: left; cursor: pointer; transition: border .2s ease, transform .2s ease; }
.person-option:hover { border-color: var(--line-strong); transform: translateY(-2px); }
.person-option img { width: 46px; height: 46px; border-radius: 50%; object-fit: cover; filter: grayscale(1) contrast(1.05); }
.person-option span { display: grid; }
.person-option small { color: var(--muted); font-size: 10px; }
.person-option strong { font-size: 13px; }
.person-option i { font-style: normal; color: var(--blue); }
.contact-divider { height: 32px; display: grid; place-items: center; position: relative; margin-top: 5px; }
.contact-divider::before { content: ""; width: 100%; height: 1px; background: var(--line); position: absolute; }
.contact-divider span { position: relative; padding: 0 10px; background: var(--surface); color: var(--muted); font-size: 9px; text-transform: uppercase; letter-spacing: .12em; }
.contact-panel-body > a { display: block; color: var(--muted); font-size: 12px; margin-top: 6px; }
.toast { position: fixed; left: 50%; bottom: 24px; z-index: 200; translate: -50% 20px; max-width: min(560px, calc(100vw - 32px)); padding: 12px 16px; border-radius: 12px; background: #07101d; color: white; font-size: 12px; box-shadow: 0 20px 50px rgba(0,0,0,.25); opacity: 0; pointer-events: none; transition: opacity .2s ease, translate .2s ease; }
.toast.is-visible { opacity: 1; translate: -50% 0; }

.reveal { opacity: 0; transform: translateY(24px); transition: opacity .7s var(--ease), transform .7s var(--ease); }
.reveal.is-visible { opacity: 1; transform: none; }
.capability-grid .reveal:nth-child(2), .method-list .reveal:nth-child(2) { transition-delay: .08s; }
.capability-grid .reveal:nth-child(3), .method-list .reveal:nth-child(3) { transition-delay: .14s; }
.capability-grid .reveal:nth-child(4), .method-list .reveal:nth-child(4) { transition-delay: .2s; }

@media (max-width: 980px) {
  .desktop-nav, .contact-desktop { display: none; }
  .menu-toggle { display: grid; }
  .header-actions { margin-left: auto; }
  .hero { padding-top: 34px; }
  .hero-stage { height: 520px; }
  .node-software { left: 0; }.node-ai { right: 0; }.node-network { left: 0; }.node-cctv { right: 0; }
  .section-head { grid-template-columns: 1fr; gap: 20px; }
  .capability-grid { grid-template-columns: 1fr; }
  .capability-featured { grid-row: auto; min-height: 520px; }
  .capability-featured .card-icon { margin-top: 110px; }
  .systems-grid { grid-template-columns: 1fr; gap: 55px; }
  .method-list { grid-template-columns: repeat(2,1fr); row-gap: 45px; }
  .method-list li:nth-child(3) { border-left: 0; padding-left: 0; }
  .smarttech-inner { grid-template-columns: 72px 1fr; }
  .smarttech-inner > p, .smarttech-inner > a { grid-column: 2; }
  .cta-card { grid-template-columns: 1fr; gap: 30px; }
  .footer-grid { grid-template-columns: 1fr; gap: 50px; }
}

@media (max-width: 720px) {
  :root { --header-height: 72px; }
  .container { width: min(calc(100% - 32px), var(--container)); }
  .section { padding: 84px 0; }
  .brand-icon { width: 38px; height: 38px; }
  .brand-wordmark { font-size: 17px; }
  .hero { min-height: auto; padding-top: 38px; padding-bottom: 44px; }
  .hero-copy { margin-bottom: 14px; }
  .hero h1 { font-size: clamp(46px, 14vw, 68px); }
  .hero-lead { font-size: 16px; }
  .hero-stage { height: 520px; width: 100%; }
  .stage-grid { inset: 70px 30px; }
  .orbit-a { width: 320px; height: 320px; }.orbit-b { width: 230px; height: 230px; }
  .runner-a { animation-name: orbitAMobile; }.runner-b { animation-name: orbitBMobile; }
  @keyframes orbitAMobile { to { transform: rotate(360deg) translateX(160px) rotate(-360deg); } }
  @keyframes orbitBMobile { to { transform: rotate(360deg) translateX(115px) rotate(-360deg); } }
  .hero-logo { width: 170px; top: 45%; }
  .service-node { min-width: 0; width: 48px; height: 48px; padding: 0; border-radius: 14px; justify-content: center; }
  .service-node .node-icon { width: 34px; height: 34px; background: transparent; }
  .service-node .node-copy { position: absolute; top: 56px; width: 110px; text-align: center; }
  .service-node .node-copy small, .service-node .node-copy span { display: none; }
  .service-node .node-copy strong { font-size: 10px; }
  .node-software { left: 4%; top: 17%; }.node-ai { right: 4%; top: 17%; }.node-network { left: 8%; bottom: 16%; }.node-cctv { right: 8%; bottom: 16%; }.node-it { bottom: 3%; }
  .hero-actions { margin-top: 0; flex-direction: column; gap: 15px; }
  .hero-actions .button { width: 100%; }
  .hero-meta { margin-top: 42px; grid-template-columns: 1fr; gap: 0; }
  .hero-meta > div { padding: 14px 0; }
  .hero-meta > div + div { border-left: 0; border-top: 1px solid var(--line); padding-left: 0; }
  .section-head { margin-bottom: 35px; }
  .section-head h2, .systems-copy h2, .cta-card h2 { font-size: clamp(38px, 11vw, 52px); }
  .capability-card, .capability-featured { min-height: 390px; padding: 24px; }
  .capability-featured .card-icon, .card-icon { margin-top: 72px; }
  .capability-featured h3 { font-size: 38px; }
  .card-tags { left: 24px; bottom: 24px; }
  .system-console { min-height: 470px; }
  .console-flow { width: 128px; padding-left: 27px; }.flow-a,.flow-c { left: 3%; }.flow-b,.flow-d { right: 3%; }
  .console-core { width: 130px; height: 130px; }.console-core::before { inset: -32px; }.console-core::after { inset: -65px; }.console-core img { width: 68px; }
  .pulse-1, .pulse-2 { display: none; }
  .method-list { grid-template-columns: 1fr; margin-top: 35px; }
  .method-list li, .method-list li:nth-child(3) { min-height: 0; padding: 0 0 28px 0; border-left: 0; border-bottom: 1px solid var(--line); display: grid; grid-template-columns: 52px 1fr; gap: 10px; }
  .method-list li:last-child { border-bottom: 0; }
  .method-list > li > span { margin: 3px 0 0; }
  .smarttech-inner { grid-template-columns: 1fr; gap: 22px; }
  .smarttech-inner > p, .smarttech-inner > a { grid-column: 1; }
  .smarttech-mark { width: 62px; height: 62px; border-radius: 16px; }
  .cta-card { min-height: 0; padding: 34px 24px; border-radius: 24px; }
  .cta-actions { flex-direction: column; }.cta-actions .button { width: 100%; }
  .footer-nav { grid-template-columns: 1fr; gap: 30px; }
  .footer-bottom { flex-direction: column; gap: 6px; }
  .quick-contact { right: 16px; bottom: 16px; width: 50px; padding: 0; justify-content: center; }
  .quick-contact > span:last-child { display: none; }
  .contact-panel { right: 16px; bottom: 80px; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .001ms !important; animation-iteration-count: 1 !important; transition-duration: .001ms !important; }
  .reveal { opacity: 1; transform: none; }
}

/* ==========================================================
   HOME V2 — refinement pass
   ========================================================== */

/* Theme control: show only the current visual state. */
.theme-toggle .icon-sun,
.theme-toggle .icon-moon { display: none; }
html[data-theme="dark"] .theme-toggle .icon-moon { display: block; }
html[data-theme="light"] .theme-toggle .icon-sun { display: block; }
@media (prefers-color-scheme: dark) {
  html[data-theme="auto"] .theme-toggle .icon-moon { display: block; }
  html[data-theme="auto"] .theme-toggle .icon-sun { display: none; }
}
@media (prefers-color-scheme: light) {
  html[data-theme="auto"] .theme-toggle .icon-sun { display: block; }
  html[data-theme="auto"] .theme-toggle .icon-moon { display: none; }
}

/* Hero: CTA first, system map second. */
.hero {
  min-height: auto;
  padding-top: 52px;
  padding-bottom: 82px;
}
.hero-copy { margin-bottom: 22px; }
.hero-lead { margin-top: 24px; }
.hero-actions {
  margin: 30px auto 0;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 12px;
  position: relative;
  z-index: 8;
}
.button-secondary {
  color: var(--text);
  border-color: var(--line-strong);
  background: color-mix(in srgb, var(--surface) 72%, transparent);
  backdrop-filter: blur(12px);
}
.button-secondary:hover {
  border-color: color-mix(in srgb,var(--blue) 42%, var(--line));
  box-shadow: 0 16px 34px rgba(13,124,255,.09);
}

.hero-stage {
  width: min(100%, 920px);
  height: 510px;
  margin: 18px auto 0;
  position: relative;
  z-index: 2;
  perspective: 1200px;
}
.stage-motion {
  position: absolute;
  inset: 0;
  transform-style: preserve-3d;
  transform: perspective(1200px) rotateX(var(--stage-rx, 0deg)) rotateY(var(--stage-ry, 0deg));
  transition: transform .24s var(--ease);
  will-change: transform;
}
.stage-grid {
  inset: 38px 128px;
  border-radius: 44%;
  opacity: .55;
  background-image:
    linear-gradient(color-mix(in srgb,var(--blue) 13%, transparent) 1px, transparent 1px),
    linear-gradient(90deg,color-mix(in srgb,var(--blue) 13%, transparent) 1px,transparent 1px);
  background-size: 28px 28px;
  -webkit-mask-image: radial-gradient(ellipse at center, #000 16%, rgba(0,0,0,.72) 52%, transparent 78%);
  mask-image: radial-gradient(ellipse at center, #000 16%, rgba(0,0,0,.72) 52%, transparent 78%);
}
.stage-radar {
  position: absolute;
  left: 50%;
  top: 50%;
  translate: -50% -50%;
  border-radius: 50%;
  border: 1px solid color-mix(in srgb,var(--blue) 18%, var(--line));
  pointer-events: none;
}
.radar-a { width: 430px; height: 430px; }
.radar-b { width: 292px; height: 292px; border-style: dashed; opacity: .66; }
.stage-radar::before,
.stage-radar::after {
  content: "";
  position: absolute;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: var(--blue);
  box-shadow: 0 0 17px color-mix(in srgb,var(--blue) 85%, transparent);
}
.radar-a::before { top: 10%; left: 20%; background: var(--green); box-shadow: 0 0 17px color-mix(in srgb,var(--green) 86%, transparent); }
.radar-a::after { right: 2%; top: 50%; }
.radar-b::before { left: 12%; bottom: 16%; }
.radar-b::after { right: 17%; top: 10%; background: var(--green); box-shadow: 0 0 17px color-mix(in srgb,var(--green) 86%, transparent); }

.hero-connections {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  overflow: visible;
  pointer-events: none;
  z-index: 2;
}
.connection-line {
  fill: none;
  stroke: color-mix(in srgb,var(--blue) 22%, var(--line));
  stroke-width: 1.1;
  opacity: .42;
  vector-effect: non-scaling-stroke;
  transition: opacity .2s ease, stroke-width .2s ease, filter .2s ease;
}
.connection-line.is-active {
  stroke: url(#connectionGradient);
  stroke-width: 2;
  opacity: 1;
  stroke-dasharray: 7 9;
  animation: connectionFlow .75s linear infinite;
  filter: drop-shadow(0 0 5px rgba(13,124,255,.8)) drop-shadow(0 0 8px rgba(8,207,147,.38));
}
@keyframes connectionFlow { to { stroke-dashoffset: -32; } }

.signal-points i {
  position: absolute;
  z-index: 3;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: var(--green);
  box-shadow: 0 0 16px color-mix(in srgb,var(--green) 88%, transparent);
  animation: signalBlink 4.4s ease-in-out infinite;
}
.signal-points i:nth-child(1) { left: 28%; top: 19%; }
.signal-points i:nth-child(2) { right: 27%; top: 24%; animation-delay: -.8s; }
.signal-points i:nth-child(3) { left: 31%; bottom: 21%; background: var(--blue); animation-delay: -1.4s; }
.signal-points i:nth-child(4) { right: 23%; bottom: 24%; background: var(--blue); animation-delay: -2.1s; }
.signal-points i:nth-child(5) { left: 50%; bottom: 9%; animation-delay: -2.7s; }
@keyframes signalBlink { 0%,100% { opacity:.35; transform:scale(.8); } 50% { opacity:1; transform:scale(1.35); } }

.hero-logo {
  width: 214px;
  transition: transform .28s var(--ease), filter .28s ease;
}
.hero-logo::before { display: none; }
.hero-logo img {
  animation: none;
  filter: drop-shadow(0 26px 44px rgba(13,124,255,.14));
}
.hero-stage[data-active] .hero-logo {
  transform: translateZ(24px) scale(1.035);
}
.hero-stage[data-active] .hero-logo img {
  filter: drop-shadow(0 24px 38px rgba(13,124,255,.24)) drop-shadow(0 0 18px rgba(8,207,147,.08));
}

.service-node {
  min-width: 196px;
  padding: 13px 15px 13px 12px;
  background: color-mix(in srgb, var(--surface) 88%, transparent);
  border-color: color-mix(in srgb,var(--line-strong) 72%, transparent);
  box-shadow: 0 16px 42px rgba(6,25,47,.08);
  transition: transform .28s var(--ease), border-color .22s ease, box-shadow .22s ease, background .22s ease;
  transform: translateZ(0);
}
.service-node:hover,
.service-node.is-active {
  transform: translateY(-5px) translateZ(30px) scale(1.025);
  border-color: color-mix(in srgb,var(--blue) 48%, var(--line));
  background: color-mix(in srgb, var(--surface) 96%, var(--blue) 4%);
  box-shadow: 0 24px 58px rgba(6,25,47,.15), 0 0 0 1px color-mix(in srgb,var(--blue) 8%, transparent);
}
.service-node:hover .node-icon,
.service-node.is-active .node-icon {
  color: white;
  background: linear-gradient(135deg,var(--blue),var(--green));
  box-shadow: 0 10px 22px rgba(13,124,255,.2);
}
.node-icon { transition: color .22s ease, background .22s ease, box-shadow .22s ease; }

/* Uniform service cards with service-specific technical textures. */
.capability-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 18px; }
.capability-card,
.capability-featured {
  min-height: 410px;
  padding: 30px;
  grid-row: auto;
  background: var(--surface);
  isolation: isolate;
}
.capability-card::before {
  content: "";
  position: absolute;
  inset: 0;
  width: auto;
  height: auto;
  border-radius: inherit;
  pointer-events: none;
  opacity: .7;
  transition: opacity .3s ease, transform .5s var(--ease);
}
.capability-card:hover::before { transform: scale(1.015); opacity: 1; }
.capability-card > * { position: relative; z-index: 2; }
.card-software::before {
  background-image:
    linear-gradient(color-mix(in srgb,var(--blue) 9%, transparent) 1px, transparent 1px),
    linear-gradient(90deg,color-mix(in srgb,var(--blue) 9%, transparent) 1px,transparent 1px),
    radial-gradient(circle at 83% 23%, color-mix(in srgb,var(--blue) 14%, transparent), transparent 27%);
  background-size: 26px 26px, 26px 26px, auto;
  -webkit-mask-image: linear-gradient(135deg, transparent 12%, #000 52%, #000 100%);
  mask-image: linear-gradient(135deg, transparent 12%, #000 52%, #000 100%);
}
.card-network::before {
  background:
    radial-gradient(circle at 76% 28%, color-mix(in srgb,var(--green) 18%, transparent) 0 2px, transparent 3px),
    radial-gradient(circle at 88% 48%, color-mix(in srgb,var(--blue) 16%, transparent) 0 2px, transparent 3px),
    linear-gradient(145deg, transparent 53%, color-mix(in srgb,var(--green) 10%, transparent) 53.3% 53.8%, transparent 54.1%),
    linear-gradient(34deg, transparent 66%, color-mix(in srgb,var(--blue) 9%, transparent) 66.3% 66.8%, transparent 67.1%);
}
.card-security::before {
  background:
    conic-gradient(from 206deg at 82% 24%, transparent 0 78%, color-mix(in srgb,var(--blue) 11%, transparent) 79% 86%, transparent 87%),
    repeating-radial-gradient(circle at 82% 24%, color-mix(in srgb,var(--blue) 10%, transparent) 0 1px, transparent 1px 30px);
  -webkit-mask-image: radial-gradient(circle at 82% 24%, #000, transparent 63%);
  mask-image: radial-gradient(circle at 82% 24%, #000, transparent 63%);
}
.card-it::before {
  background:
    radial-gradient(circle at 82% 25%, transparent 0 31px, color-mix(in srgb,var(--green) 11%, transparent) 32px 33px, transparent 34px 62px, color-mix(in srgb,var(--green) 8%, transparent) 63px 64px, transparent 65px),
    linear-gradient(90deg, transparent 0 69%, color-mix(in srgb,var(--blue) 7%, transparent) 69.2% 69.5%, transparent 69.7%);
}
.card-icon,
.capability-featured .card-icon { margin-top: 64px; width: 58px; height: 58px; }
.capability-card h3,
.capability-featured h3 { font-size: clamp(30px,3vw,42px); }
.capability-card p,
.capability-featured p { font-size: 15px; max-width: 520px; }
.card-network .card-icon { background: linear-gradient(135deg,#0d7cff,#0aa6d8); }
.card-security .card-icon { background: linear-gradient(135deg,#0d7cff,#1559d8); }
.card-it .card-icon { background: linear-gradient(135deg,#08cf93,#07a976); }
.card-tags { bottom: 28px; }

/* Distinct architecture/blueprint visual: no orbital repetition. */
.blueprint-panel {
  min-height: 500px;
  border: 1px solid rgba(214,232,255,.12);
  border-radius: 26px;
  background: linear-gradient(145deg, rgba(15,31,51,.98), rgba(6,15,27,.98));
  box-shadow: 0 35px 100px rgba(0,0,0,.35);
  overflow: hidden;
}
.blueprint-head {
  min-height: 54px;
  padding: 0 18px;
  border-bottom: 1px solid rgba(214,232,255,.09);
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 14px;
}
.blueprint-head > div { display: flex; gap: 7px; }
.blueprint-head > div span { width: 7px; height: 7px; border-radius: 50%; background: #284563; }
.blueprint-head > div span:first-child { background: var(--blue); }
.blueprint-head > div span:nth-child(2) { background: var(--green); }
.blueprint-head small,
.blueprint-head b { color: #6f87a1; font-family: ui-monospace,SFMono-Regular,Menlo,monospace; font-size: 9px; letter-spacing: .08em; font-weight: 600; }
.blueprint-head b { justify-self: end; color: #8ba0b9; }
.blueprint-canvas {
  min-height: 446px;
  position: relative;
  padding: 42px 34px 54px 70px;
  background-image:
    linear-gradient(rgba(126,158,193,.055) 1px, transparent 1px),
    linear-gradient(90deg,rgba(126,158,193,.055) 1px,transparent 1px);
  background-size: 28px 28px;
}
.blueprint-scan {
  position: absolute;
  inset: 0 0 auto;
  height: 1px;
  background: linear-gradient(90deg,transparent 8%,rgba(13,124,255,.5),rgba(8,207,147,.52),transparent 92%);
  box-shadow: 0 0 14px rgba(13,124,255,.18);
  animation: blueprintScan 6.5s ease-in-out infinite;
  opacity: .75;
}
@keyframes blueprintScan { 0%,100% { transform:translateY(34px); opacity:.12; } 50% { transform:translateY(370px); opacity:.75; } }
.blueprint-rail {
  position: absolute;
  left: 38px;
  top: 68px;
  bottom: 102px;
  width: 1px;
  background: linear-gradient(var(--blue), color-mix(in srgb,var(--blue) 35%, var(--green)), var(--green));
  opacity: .55;
}
.blueprint-rail i { position:absolute; left:50%; translate:-50% -50%; width:7px; height:7px; border-radius:50%; background:#07101d; border:1px solid var(--blue); box-shadow:0 0 14px rgba(13,124,255,.45); }
.blueprint-rail i:nth-child(1){top:0}.blueprint-rail i:nth-child(2){top:50%;border-color:color-mix(in srgb,var(--blue) 50%,var(--green));}.blueprint-rail i:nth-child(3){top:100%;border-color:var(--green);box-shadow:0 0 14px rgba(8,207,147,.4)}
.blueprint-layer {
  min-height: 92px;
  display: grid;
  grid-template-columns: 36px minmax(135px,.7fr) 1.3fr;
  align-items: center;
  gap: 18px;
  padding: 15px 18px;
  border: 1px solid rgba(214,232,255,.1);
  background: rgba(10,24,40,.78);
  backdrop-filter: blur(8px);
  border-radius: 16px;
  position: relative;
}
.blueprint-layer + .blueprint-layer { margin-top: 16px; }
.blueprint-layer::before {
  content:"";
  position:absolute;
  left:-33px;
  top:50%;
  width:32px;
  height:1px;
  background:rgba(13,124,255,.32);
}
.layer-architecture { border-color: rgba(13,124,255,.22); box-shadow: 0 15px 38px rgba(0,0,0,.12), inset 3px 0 0 rgba(13,124,255,.55); }
.layer-operation { box-shadow: inset 3px 0 0 rgba(8,207,147,.36); }
.layer-number { color:#6f87a1; font-family:ui-monospace,SFMono-Regular,Menlo,monospace; font-size:10px; }
.blueprint-layer > div { display:grid; }
.blueprint-layer small { color:#657f9b; font-size:8px; letter-spacing:.16em; }
.blueprint-layer strong { margin-top:4px; font-size:14px; }
.blueprint-layer ul { list-style:none; padding:0; margin:0; display:flex; justify-content:flex-end; flex-wrap:wrap; gap:7px; }
.blueprint-layer li { padding:6px 9px; border:1px solid rgba(214,232,255,.09); border-radius:999px; color:#8ca1ba; background:rgba(255,255,255,.025); font-size:9px; }
.blueprint-caption { position:absolute; left:70px; bottom:22px; display:flex; align-items:center; gap:8px; color:#607b98; font-size:9px; letter-spacing:.06em; }
.blueprint-caption span { width:7px; height:7px; border-radius:50%; background:var(--green); box-shadow:0 0 12px rgba(8,207,147,.55); }

/* Relationship between both brands. */
.smarttech-strip { padding: 78px 0; }
.smarttech-inner {
  display: grid;
  grid-template-columns: minmax(300px,.85fr) minmax(360px,1.15fr) auto;
  align-items: center;
  gap: 54px;
}
.brand-bridge { display:flex; align-items:center; justify-content:center; gap:13px; min-width:0; }
.bridge-logo {
  width: 94px;
  height: 94px;
  border: 1px solid var(--line-strong);
  border-radius: 24px;
  background: color-mix(in srgb,var(--surface) 86%, transparent);
  display:grid;
  place-items:center;
  box-shadow: 0 18px 42px rgba(10,35,63,.08);
  overflow:hidden;
}
.bridge-logo img { width:72%; height:72%; object-fit:contain; }
.bridge-smarttech img { width:76%; height:76%; }
.bridge-connector { min-width:98px; display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:7px; }
.bridge-connector i { height:1px; background:linear-gradient(90deg,var(--blue),var(--green)); opacity:.62; position:relative; }
.bridge-connector i:first-child::after { content:""; position:absolute; right:-2px; top:50%; translate:0 -50%; width:5px; height:5px; border-radius:50%; background:var(--green); box-shadow:0 0 12px rgba(8,207,147,.5); }
.bridge-connector span { color:var(--muted); font-size:8px; text-transform:uppercase; letter-spacing:.12em; white-space:nowrap; }
.smarttech-copy .eyebrow { margin-bottom: 12px; }
.smarttech-copy h2 { margin:0; font-size:clamp(30px,3.1vw,46px); line-height:1.02; letter-spacing:-.05em; }
.smarttech-copy h2 strong { color: var(--blue); font-weight: inherit; }
.smarttech-copy > p:not(.eyebrow) { margin:18px 0 0; color:var(--muted); max-width:680px; font-size:14px; }
.smarttech-link { white-space:nowrap; justify-self:end; }

/* Contact panel: larger choices, channel email inside each choice. */
.contact-panel { width: min(430px, calc(100vw - 32px)); }
.contact-panel-body { padding: 22px; }
.contact-panel-body > p { margin-bottom: 18px; }
.contact-people { gap: 10px; }
.person-option {
  min-height: 86px;
  padding: 13px 14px;
  grid-template-columns: 56px 1fr auto;
  gap: 13px;
  border-radius: 16px;
}
.person-option-sales {
  min-height: 94px;
  border-color: color-mix(in srgb,var(--green) 28%, var(--line));
  background: linear-gradient(115deg,color-mix(in srgb,var(--green) 5%, var(--surface-2)),var(--surface-2));
}
.person-option img { width:56px; height:56px; }
.person-option small { font-size:10px; letter-spacing:.02em; }
.person-option strong { margin-top:2px; font-size:14px; }
.person-email { margin-top:4px; color:var(--muted); font-size:10.5px; font-weight:520; letter-spacing:0; overflow-wrap:anywhere; }
.person-option i { font-size:16px; }

@media (max-width: 980px) {
  .hero-stage { width:min(100%,820px); }
  .capability-grid { grid-template-columns:1fr; }
  .capability-card,
  .capability-featured { min-height:390px; }
  .smarttech-inner { grid-template-columns:1fr 1fr; gap:36px; }
  .brand-bridge { justify-content:flex-start; }
  .smarttech-link { grid-column:2; justify-self:start; }
}

@media (max-width: 720px) {
  .hero { padding-top:34px; padding-bottom:64px; }
  .hero-copy { margin-bottom:26px; }
  .hero-actions { flex-direction:column; gap:10px; margin-top:26px; }
  .hero-actions .button { width:100%; }
  .hero-stage { height:525px; margin-top:6px; }
  .stage-motion { transform:none !important; }
  .stage-grid { inset:76px 22px; }
  .radar-a { width:322px; height:322px; }
  .radar-b { width:228px; height:228px; }
  .hero-logo { width:166px; top:45%; }
  .service-node { width:52px; height:52px; min-width:0; padding:0; border-radius:15px; justify-content:center; }
  .service-node:hover,
  .service-node.is-active { transform:translateY(-3px) scale(1.035); }
  .service-node .node-icon { width:38px; height:38px; }
  .service-node .node-copy { top:60px; width:116px; }
  .service-node .node-copy strong { font-size:10.5px; }
  .node-software { left:3%; top:14%; }
  .node-ai { right:3%; top:14%; }
  .node-network { left:7%; bottom:15%; }
  .node-cctv { right:7%; bottom:15%; }
  .node-it { bottom:2%; }
  .signal-points i { width:4px; height:4px; }
  .capability-card,
  .capability-featured { min-height:405px; padding:24px; }
  .card-icon,
  .capability-featured .card-icon { margin-top:70px; }
  .card-tags { left:24px; right:24px; bottom:24px; }
  .blueprint-panel { min-height:520px; }
  .blueprint-canvas { min-height:466px; padding:32px 18px 54px 50px; }
  .blueprint-rail { left:28px; top:58px; bottom:98px; }
  .blueprint-layer { grid-template-columns:28px 1fr; gap:10px; min-height:116px; padding:14px; }
  .blueprint-layer ul { grid-column:2; justify-content:flex-start; margin-top:2px; }
  .blueprint-layer::before { left:-23px; width:22px; }
  .blueprint-caption { left:50px; right:18px; }
  .smarttech-inner { grid-template-columns:1fr; gap:28px; }
  .brand-bridge { justify-content:flex-start; }
  .bridge-logo { width:76px; height:76px; border-radius:20px; }
  .bridge-connector { min-width:76px; }
  .bridge-connector span { font-size:7px; }
  .smarttech-link { grid-column:1; }
  .person-option { grid-template-columns:52px 1fr auto; }
  .person-option img { width:52px; height:52px; }
}

@media (prefers-reduced-motion: reduce) {
  .stage-motion { transform:none !important; }
  .connection-line.is-active,
  .signal-points i,
  .blueprint-scan { animation:none !important; }
}

/* ==========================================================
   HOME V3 — correction pass after review
   ========================================================== */

/* Remove shine/ghost treatment from menu logo and hero logo. */
.brand-shine::after { display: none !important; }
.brand-icon::before,
.hero-logo::after { content: none !important; }
.hero-logo::before { display: none !important; }

/* Theme toggle: show exactly one icon only. */
.theme-toggle svg { display: none !important; }
html[data-theme="dark"] .theme-toggle .icon-moon { display: block !important; }
html[data-theme="dark"] .theme-toggle .icon-sun { display: none !important; }
html[data-theme="light"] .theme-toggle .icon-sun { display: block !important; }
html[data-theme="light"] .theme-toggle .icon-moon { display: none !important; }
@media (prefers-color-scheme: dark) {
  html[data-theme="auto"] .theme-toggle .icon-moon { display: block !important; }
  html[data-theme="auto"] .theme-toggle .icon-sun { display: none !important; }
}
@media (prefers-color-scheme: light) {
  html[data-theme="auto"] .theme-toggle .icon-sun { display: block !important; }
  html[data-theme="auto"] .theme-toggle .icon-moon { display: none !important; }
}

/* Hero refinement. */
.hero-stage { height: 530px; }
.node-it { bottom: 1%; }

/* Capabilities section: cleaner layout + stronger tech treatment. */
.capability-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-auto-rows: 1fr;
  gap: 18px;
}
.capability-card {
  min-height: 392px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  padding: 30px;
  overflow: hidden;
}
.capability-card::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(120deg, transparent 18%, rgba(255,255,255,.045) 46%, transparent 61%);
  opacity: 0;
  transform: translateX(-18%);
  transition: transform .5s var(--ease), opacity .28s ease;
}
.capability-card:hover::after {
  opacity: 1;
  transform: translateX(10%);
}
.capability-card h3 {
  margin: 22px 0 12px;
  max-width: 420px;
}
.capability-card p {
  max-width: 520px;
  margin: 0;
}
.card-tags {
  position: static;
  left: auto;
  right: auto;
  bottom: auto;
  max-width: none;
  margin-top: 18px;
  margin-bottom: 0;
}
.card-tags span {
  background: color-mix(in srgb, var(--surface) 86%, transparent);
  backdrop-filter: blur(8px);
}
.card-arrow {
  top: auto;
  right: 28px;
  bottom: 28px;
}
.card-software::before {
  background-image:
    linear-gradient(rgba(13,124,255,.12) 1px, transparent 1px),
    linear-gradient(90deg, rgba(13,124,255,.12) 1px, transparent 1px),
    radial-gradient(circle at 22% 18%, rgba(13,124,255,.18), transparent 18%),
    radial-gradient(circle at 82% 78%, rgba(8,207,147,.12), transparent 20%);
  background-size: 26px 26px, 26px 26px, auto, auto;
}
.card-network::before {
  background-image:
    linear-gradient(135deg, transparent 34%, rgba(13,124,255,.14) 35%, rgba(13,124,255,.14) 36%, transparent 37%),
    linear-gradient(45deg, transparent 58%, rgba(8,207,147,.10) 59%, rgba(8,207,147,.10) 60%, transparent 61%),
    radial-gradient(circle at 76% 28%, rgba(8,207,147,.12), transparent 18%);
}
.card-security::before {
  background-image:
    radial-gradient(circle at 82% 24%, transparent 0 14%, rgba(13,124,255,.12) 14.4% 15%, transparent 15.4% 23%, rgba(13,124,255,.09) 23.4% 24%, transparent 24.4% 32%, rgba(13,124,255,.06) 32.4% 33%, transparent 33.4%),
    linear-gradient(150deg, transparent 64%, rgba(13,124,255,.08) 65%, transparent 78%);
}
.card-it::before {
  background-image:
    linear-gradient(90deg, transparent 78%, rgba(13,124,255,.10) 78.4%, rgba(13,124,255,.10) 79.1%, transparent 79.4%),
    radial-gradient(circle at 82% 26%, transparent 0 12%, rgba(8,207,147,.11) 12.4% 13%, transparent 13.4% 23%, rgba(8,207,147,.08) 23.4% 24%, transparent 24.4%),
    radial-gradient(circle at 82% 26%, rgba(8,207,147,.10), transparent 22%);
}

/* SmartTech relation CTA should feel like an actual button. */
.smarttech-button {
  white-space: nowrap;
  justify-self: end;
  align-self: center;
  min-height: 48px;
  padding-inline: 20px;
  box-shadow: 0 14px 28px rgba(13,124,255,.08);
}
.smarttech-button span { color: var(--blue); }
.smarttech-button:hover { box-shadow: 0 18px 34px rgba(13,124,255,.12); }

@media (max-width: 980px) {
  .smarttech-button { justify-self: start; }
}

@media (max-width: 720px) {
  .hero-stage { height: 540px; }
  .node-it { bottom: 4%; }
  .capability-grid { grid-template-columns: 1fr; }
  .capability-card { min-height: 402px; padding: 24px; }
  .card-arrow { right: 24px; bottom: 24px; }
  .card-tags { margin-top: 16px; }
  .smarttech-button { width: 100%; justify-content: center; }
}

/* ==========================================================
   HOME V4 — services showcase + responsive polish
   ========================================================== */

.theme-glyph { width: 18px; height: 18px; display: grid; place-items: center; }
.theme-glyph svg { width: 18px; height: 18px; display: block; }

/* Guarantee the fifth hero service has a visible physical link to the core. */
.node-it::before {
  content: "";
  position: absolute;
  left: 50%;
  bottom: calc(100% + 1px);
  width: 1.5px;
  height: 105px;
  transform: translateX(-50%);
  background: linear-gradient(to top, color-mix(in srgb,var(--blue) 54%, var(--green)), color-mix(in srgb,var(--green) 42%, transparent) 66%, transparent);
  box-shadow: 0 0 8px color-mix(in srgb,var(--blue) 34%, transparent);
  opacity: .48;
  pointer-events: none;
  transition: opacity .25s ease, box-shadow .25s ease;
}
.node-it::after {
  content: "";
  position: absolute;
  left: 50%;
  top: -107px;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  transform: translateX(-50%);
  background: var(--green);
  box-shadow: 0 0 12px color-mix(in srgb,var(--green) 78%, transparent);
  opacity: .66;
  pointer-events: none;
}
.node-it:hover::before,
.node-it.is-active::before {
  opacity: 1;
  box-shadow: 0 0 12px rgba(13,124,255,.7), 0 0 18px rgba(8,207,147,.35);
  background: linear-gradient(to top, var(--blue), var(--green) 58%, rgba(255,255,255,.75) 80%, transparent);
  background-size: 100% 220%;
  animation: serviceLinkFlow .9s linear infinite;
}
.node-it:hover::after,
.node-it.is-active::after { opacity: 1; animation: serviceNodePulse 1s ease-in-out infinite; }
@keyframes serviceLinkFlow { to { background-position: 0 -110%; } }
@keyframes serviceNodePulse { 50% { transform: translateX(-50%) scale(1.55); } }
.connection-line[data-connection="it"] { opacity: .62; stroke-width: 1.35; }
.connection-line[data-connection="it"].is-active { opacity: 1; stroke-width: 2.2; }

/* SERVICES — new visual system */
.services-section {
  position: relative;
  background: var(--bg);
  overflow: hidden;
}
.services-section::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    radial-gradient(circle at 8% 10%, color-mix(in srgb,var(--blue) 6%, transparent), transparent 25%),
    radial-gradient(circle at 94% 76%, color-mix(in srgb,var(--green) 5%, transparent), transparent 22%);
}
.services-intro {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: minmax(0,1.35fr) minmax(280px,.55fr);
  gap: 86px;
  align-items: end;
  margin-bottom: 46px;
}
.services-intro h2 {
  margin: 0;
  font-size: clamp(40px, 4.2vw, 62px);
  line-height: .98;
  letter-spacing: -.058em;
}
.services-intro > p {
  margin: 0 0 4px;
  color: var(--muted);
  font-size: 15px;
  line-height: 1.65;
}
.service-showcase {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: minmax(0,1.48fr) minmax(330px,.72fr);
  gap: 18px;
  align-items: stretch;
}

.service-feature {
  min-height: 710px;
  position: relative;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 30px;
  padding: 36px;
  background:
    linear-gradient(145deg, color-mix(in srgb,var(--surface) 96%, var(--blue) 4%), var(--surface));
  display: grid;
  grid-template-columns: minmax(0,.88fr) minmax(330px,1.12fr);
  gap: 30px;
  align-items: stretch;
  isolation: isolate;
  box-shadow: 0 22px 80px rgba(6,25,47,.07);
  transition: transform .35s var(--ease), border-color .3s ease, box-shadow .3s ease;
}
.service-feature::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    radial-gradient(circle at 76% 38%, color-mix(in srgb,var(--blue) 11%, transparent), transparent 28%),
    radial-gradient(circle at 70% 76%, color-mix(in srgb,var(--green) 9%, transparent), transparent 25%);
  opacity: .82;
  z-index: 0;
}
.service-feature:hover {
  transform: translateY(-5px);
  border-color: color-mix(in srgb,var(--blue) 35%, var(--line));
  box-shadow: 0 28px 96px rgba(6,25,47,.11);
}
.service-feature-copy,
.software-system { position: relative; z-index: 2; }
.service-feature-copy { display: flex; flex-direction: column; align-items: flex-start; }
.service-label {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: .14em;
  font-weight: 800;
  font-size: 10px;
}
.service-label span {
  display: grid;
  place-items: center;
  width: 26px;
  height: 26px;
  border-radius: 8px;
  color: var(--blue);
  background: color-mix(in srgb,var(--blue) 8%, transparent);
  border: 1px solid color-mix(in srgb,var(--blue) 18%, var(--line));
}
.service-feature-icon {
  width: 66px;
  height: 66px;
  margin-top: 70px;
  border-radius: 19px;
  display: grid;
  place-items: center;
  color: white;
  background: linear-gradient(135deg,var(--blue),var(--green));
  box-shadow: 0 18px 42px rgba(13,124,255,.2);
}
.service-feature-icon svg { width: 31px; height: 31px; }
.service-feature h3 {
  max-width: 540px;
  margin: 24px 0 15px;
  font-size: clamp(38px,4vw,58px);
  line-height: .96;
  letter-spacing: -.058em;
}
.service-feature-copy > p {
  max-width: 500px;
  margin: 0;
  color: var(--muted);
  font-size: 16px;
  line-height: 1.62;
}
.software-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 24px;
}
.software-chips span {
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 8px 11px;
  background: color-mix(in srgb,var(--surface-2) 82%, transparent);
  color: var(--muted);
  font-size: 10px;
  backdrop-filter: blur(8px);
}
.service-feature-link {
  margin-top: auto;
  padding-top: 36px;
  display: inline-flex;
  align-items: center;
  gap: 9px;
  font-size: 13px;
  font-weight: 760;
}
.service-feature-link b { color: var(--blue); font-size: 16px; transition: transform .2s ease; }
.service-feature:hover .service-feature-link b { transform: translate(3px,-3px); }

/* Software architecture visual */
.software-system {
  min-height: 100%;
  border: 1px solid color-mix(in srgb,var(--line-strong) 80%, transparent);
  border-radius: 24px;
  overflow: hidden;
  background: color-mix(in srgb,var(--hero-bg) 94%, transparent);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.015), 0 24px 60px rgba(6,25,47,.08);
  transform: perspective(1000px) rotateY(-2deg) rotateX(.8deg);
  transition: transform .4s var(--ease), box-shadow .3s ease;
}
.service-feature:hover .software-system {
  transform: perspective(1000px) rotateY(0deg) rotateX(0deg) translateY(-2px);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.02), 0 28px 70px rgba(6,25,47,.12);
}
.system-topline {
  height: 48px;
  padding: 0 16px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-bottom: 1px solid color-mix(in srgb,var(--line) 90%, transparent);
  font-family: ui-monospace,SFMono-Regular,Menlo,monospace;
  font-size: 8px;
  letter-spacing: .11em;
  color: var(--muted);
}
.system-topline b {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: var(--green);
  font-weight: 700;
}
.system-topline b::before {
  content: "";
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--green);
  box-shadow: 0 0 12px color-mix(in srgb,var(--green) 80%, transparent);
}
.system-grid {
  position: absolute;
  inset: 48px 0 0;
  opacity: .52;
  background-image:
    linear-gradient(color-mix(in srgb,var(--blue) 8%, transparent) 1px, transparent 1px),
    linear-gradient(90deg,color-mix(in srgb,var(--blue) 8%, transparent) 1px,transparent 1px);
  background-size: 30px 30px;
  -webkit-mask-image: radial-gradient(circle at 50% 48%,#000 28%,transparent 82%);
  mask-image: radial-gradient(circle at 50% 48%,#000 28%,transparent 82%);
}
.system-core {
  position: absolute;
  left: 50%;
  top: 49%;
  translate: -50% -50%;
  width: 132px;
  height: 132px;
  border-radius: 26px;
  display: grid;
  place-items: center;
  text-align: center;
  border: 1px solid color-mix(in srgb,var(--blue) 30%, var(--line));
  background: color-mix(in srgb,var(--surface) 90%, transparent);
  box-shadow: 0 24px 50px rgba(13,124,255,.12), inset 0 0 45px color-mix(in srgb,var(--blue) 6%, transparent);
}
.system-core::before,
.system-core::after {
  content: "";
  position: absolute;
  border-radius: 32px;
  border: 1px solid color-mix(in srgb,var(--blue) 11%, var(--line));
}
.system-core::before { inset: -22px; }
.system-core::after { inset: -46px; border-style: dashed; opacity: .7; }
.system-core i {
  width: 16px;
  height: 16px;
  border-radius: 5px;
  background: linear-gradient(135deg,var(--blue),var(--green));
  box-shadow: 0 0 22px rgba(13,124,255,.35);
  margin-top: 18px;
}
.system-core strong {
  font-family: ui-monospace,SFMono-Regular,Menlo,monospace;
  font-size: 15px;
  letter-spacing: .11em;
}
.system-core small { color: var(--muted); font-size: 9px; margin-bottom: 18px; }
.system-track {
  position: absolute;
  left: 18%;
  right: 18%;
  height: 1px;
  background: linear-gradient(90deg,transparent,var(--blue),color-mix(in srgb,var(--blue) 40%, var(--green)),var(--green),transparent);
  opacity: .28;
}
.track-a { top: 34%; }
.track-b { top: 49%; }
.track-c { top: 64%; }
.system-packet {
  position: absolute;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--blue);
  box-shadow: 0 0 14px rgba(13,124,255,.75);
  z-index: 4;
}
.packet-a { top: calc(34% - 3px); left: 20%; animation: packetA 5.2s ease-in-out infinite; }
.packet-b { top: calc(64% - 3px); right: 20%; background: var(--green); box-shadow: 0 0 14px rgba(8,207,147,.65); animation: packetB 6.1s ease-in-out infinite; }
@keyframes packetA { 0%,100% { left:20%; opacity:.25; } 50% { left:76%; opacity:1; } }
@keyframes packetB { 0%,100% { right:20%; opacity:.25; } 50% { right:76%; opacity:1; } }
.system-module {
  position: absolute;
  min-width: 126px;
  padding: 12px 13px;
  border: 1px solid var(--line);
  border-radius: 13px;
  background: color-mix(in srgb,var(--surface) 90%, transparent);
  box-shadow: 0 14px 34px rgba(6,25,47,.08);
  display: grid;
}
.system-module small {
  color: var(--muted);
  font-family: ui-monospace,SFMono-Regular,Menlo,monospace;
  font-size: 7px;
  letter-spacing: .12em;
}
.system-module strong { margin-top: 3px; font-size: 11px; }
.module-process { left: 7%; top: 21%; }
.module-data { left: 7%; bottom: 20%; }
.module-api { right: 7%; top: 21%; }
.module-auto { right: 7%; bottom: 20%; }
.system-float {
  position: absolute;
  z-index: 4;
  padding: 8px 10px;
  border: 1px solid color-mix(in srgb,var(--green) 22%, var(--line));
  border-radius: 999px;
  background: color-mix(in srgb,var(--surface) 88%, transparent);
  color: var(--muted);
  font-size: 8px;
  box-shadow: 0 10px 28px rgba(6,25,47,.08);
  backdrop-filter: blur(8px);
  animation: systemFloat 4.8s ease-in-out infinite;
}
.float-ai { top: 12%; left: 50%; translate: -50% 0; }
.float-int { bottom: 11%; left: 50%; translate: -50% 0; animation-delay: -2.2s; }
@keyframes systemFloat { 50% { transform: translateY(-5px); } }
.system-status {
  position: absolute;
  left: 16px;
  bottom: 15px;
  display: flex;
  align-items: center;
  gap: 7px;
  color: var(--muted);
  font-family: ui-monospace,SFMono-Regular,Menlo,monospace;
  font-size: 7px;
  letter-spacing: .06em;
}
.system-status span {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--green);
  box-shadow: 0 0 10px rgba(8,207,147,.58);
}

.service-stack { display: grid; grid-template-rows: repeat(3,1fr); gap: 18px; }
.service-module {
  min-height: 0;
  position: relative;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 24px;
  padding: 25px;
  background: var(--surface);
  isolation: isolate;
  transition: transform .28s var(--ease), border-color .22s ease, box-shadow .25s ease;
}
.service-module:hover {
  transform: translateY(-4px);
  border-color: color-mix(in srgb,var(--blue) 32%, var(--line));
  box-shadow: 0 22px 60px rgba(6,25,47,.1);
}
.service-module-head {
  position: relative;
  z-index: 3;
  display: grid;
  grid-template-columns: auto auto 1fr;
  align-items: center;
  gap: 10px;
}
.service-module-index {
  color: var(--muted);
  font-size: 9px;
  font-weight: 800;
  letter-spacing: .13em;
}
.service-module-icon {
  width: 40px;
  height: 40px;
  border-radius: 12px;
  display: grid;
  place-items: center;
  color: white;
  background: linear-gradient(135deg,var(--blue),#0aa6d8);
}
.service-module-security .service-module-icon { background: linear-gradient(135deg,var(--blue),#1559d8); }
.service-module-it .service-module-icon { background: linear-gradient(135deg,var(--green),#07a976); }
.service-module-icon svg { width: 20px; height: 20px; }
.service-module-head i {
  justify-self: end;
  width: 34px;
  height: 34px;
  border-radius: 50%;
  border: 1px solid var(--line);
  display: grid;
  place-items: center;
  color: var(--blue);
  font-style: normal;
  transition: transform .2s ease, background .2s ease, color .2s ease;
}
.service-module:hover .service-module-head i { transform: translate(2px,-2px); background: var(--text); color: var(--bg); }
.service-module > div:nth-child(2) { position: relative; z-index: 3; margin-top: 28px; }
.service-module > div:nth-child(2) small {
  color: var(--muted);
  font-size: 9px;
  text-transform: uppercase;
  letter-spacing: .12em;
  font-weight: 800;
}
.service-module h3 {
  max-width: 330px;
  margin: 7px 0 9px;
  font-size: clamp(24px,2.1vw,34px);
  line-height: 1;
  letter-spacing: -.045em;
}
.service-module p {
  max-width: 330px;
  margin: 0;
  color: var(--muted);
  font-size: 12.5px;
  line-height: 1.55;
}
.module-visual { position: absolute; inset: 0; z-index: 1; pointer-events: none; opacity: .72; }
.visual-network::before,
.visual-network::after {
  content: "";
  position: absolute;
  width: 220px;
  height: 1px;
  right: -34px;
  top: 55%;
  transform-origin: right center;
  background: linear-gradient(90deg,transparent,var(--blue));
  opacity: .3;
}
.visual-network::before { rotate: 28deg; }
.visual-network::after { rotate: -28deg; background: linear-gradient(90deg,transparent,var(--green)); }
.visual-network span {
  position: absolute;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: var(--blue);
  box-shadow: 0 0 12px rgba(13,124,255,.5);
}
.visual-network span:nth-child(1){right:14%;top:24%}.visual-network span:nth-child(2){right:28%;top:52%;background:var(--green)}.visual-network span:nth-child(3){right:10%;bottom:18%}.visual-network span:nth-child(4){right:39%;bottom:12%;background:var(--green)}
.visual-security::before,
.visual-security::after,
.visual-security span {
  content: "";
  position: absolute;
  border-radius: 50%;
  border: 1px solid color-mix(in srgb,var(--blue) 17%, transparent);
}
.visual-security::before { width:150px;height:150px;right:-28px;top:50%;translate:0 -50%; }
.visual-security::after { width:92px;height:92px;right:1px;top:50%;translate:0 -50%; }
.visual-security span:nth-child(1) { width:34px;height:34px;right:30px;top:50%;translate:0 -50%;border-color:color-mix(in srgb,var(--blue) 25%, transparent); }
.visual-security span:nth-child(2) { width:240px;height:1px;border:0;border-top:1px solid color-mix(in srgb,var(--blue) 12%, transparent);right:-100px;top:50%;transform:rotate(-19deg);border-radius:0; }
.visual-security span:nth-child(3) { width:6px;height:6px;right:45px;top:50%;translate:0 -50%;background:var(--blue);border:0;box-shadow:0 0 12px rgba(13,124,255,.45); }
.visual-it::before { content:"";position:absolute;right:11%;top:21%;width:1px;height:58%;background:linear-gradient(transparent,var(--green),transparent);opacity:.22; }
.visual-it span { position:absolute;width:7px;height:7px;border-radius:50%;border:1px solid color-mix(in srgb,var(--green) 35%, transparent);right:calc(11% - 3px);background:var(--surface);box-shadow:0 0 12px rgba(8,207,147,.18); }
.visual-it span:nth-child(1){top:24%}.visual-it span:nth-child(2){top:40%}.visual-it span:nth-child(3){top:58%}.visual-it span:nth-child(4){top:74%}

@media (max-width: 1100px) {
  .service-showcase { grid-template-columns: 1fr; }
  .service-feature { min-height: 660px; grid-template-columns: .9fr 1.1fr; }
  .service-stack { grid-template-columns: repeat(3,1fr); grid-template-rows: none; }
  .service-module { min-height: 300px; }
  .service-module h3 { font-size: 29px; }
}

@media (max-width: 820px) {
  .services-intro { grid-template-columns:1fr; gap:18px; margin-bottom:34px; }
  .services-intro > p { max-width:560px; }
  .service-feature {
    min-height: 0;
    grid-template-columns: 1fr;
    padding: 28px;
    gap: 28px;
  }
  .service-feature-icon { margin-top: 38px; }
  .service-feature h3 { max-width:620px; }
  .service-feature-link { margin-top: 28px; padding-top:0; }
  .software-system { min-height: 470px; transform:none; }
  .service-feature:hover .software-system { transform:none; }
  .service-stack { grid-template-columns:1fr; }
  .service-module { min-height: 260px; }
}

@media (max-width: 720px) {
  .services-section { padding-top: 78px; padding-bottom: 78px; }
  .services-intro h2 { font-size: clamp(38px,11vw,52px); }
  .service-showcase { gap: 14px; }
  .service-feature { border-radius:24px; padding:22px; }
  .service-feature-icon { width:58px;height:58px;margin-top:30px;border-radius:16px; }
  .service-feature h3 { font-size: clamp(38px,11vw,50px); }
  .service-feature-copy > p { font-size:14px; }
  .software-chips { gap:6px; }
  .software-chips span { padding:7px 9px; font-size:9px; }
  .software-system { min-height:410px; border-radius:20px; }
  .system-core { width:108px;height:108px;border-radius:22px; }
  .system-core::before { inset:-16px; }.system-core::after { inset:-32px; }
  .system-module { min-width:104px;padding:10px; }
  .system-module strong { font-size:10px; }
  .module-process,.module-data { left:5%; }.module-api,.module-auto { right:5%; }
  .system-float { font-size:7px;padding:7px 8px; }
  .service-module { min-height:250px;padding:22px;border-radius:20px; }
  .service-module > div:nth-child(2) { margin-top:26px; }
  .service-module h3 { font-size:32px; max-width:280px; }
  .service-module p { max-width:285px; }
  .node-it::before { height: 142px; }
  .node-it::after { top: -144px; }
}

@media (max-width: 420px) {
  .software-system { min-height:390px; }
  .system-module { min-width:92px; padding:9px; }
  .system-module strong { font-size:9px; }
  .module-process,.module-data { left:3%; }.module-api,.module-auto { right:3%; }
  .float-ai { top:11%; }.float-int { bottom:10%; }
}

@media (prefers-reduced-motion: reduce) {
  .system-packet,
  .system-float,
  .node-it::before,
  .node-it::after { animation:none !important; }
}
.theme-toggle .theme-glyph svg { display: block !important; }

/* ==========================================================
   SOFTWARE PAGE — customer-first service page
   ========================================================== */
.desktop-nav a.is-active { color: var(--text); }
.desktop-nav a.is-active::after { right: 0; }
.mobile-menu a.is-active { color: var(--blue); }

.software-page { background: var(--bg); }
.service-intro {
  position: relative;
  overflow: hidden;
  padding: 72px 0 90px;
  background: var(--hero-bg);
  border-bottom: 1px solid var(--line);
}
.service-intro::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    radial-gradient(circle at 72% 44%, color-mix(in srgb,var(--blue) 10%, transparent), transparent 30%),
    radial-gradient(circle at 80% 52%, color-mix(in srgb,var(--green) 7%, transparent), transparent 26%);
}
.service-intro-grid {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, .93fr) minmax(500px, 1.07fr);
  gap: 72px;
  align-items: center;
}
.service-intro-copy { position: relative; z-index: 2; }
.service-intro-copy h1 {
  margin: 0;
  font-size: clamp(50px, 5.3vw, 76px);
  line-height: .96;
  letter-spacing: -.065em;
  font-weight: 790;
}
.service-intro-copy h1 em {
  font-style: normal;
  color: transparent;
  background: linear-gradient(100deg,var(--blue),var(--green));
  -webkit-background-clip: text;
  background-clip: text;
}
.service-intro-lead {
  max-width: 660px;
  margin: 26px 0 0;
  color: var(--muted);
  font-size: clamp(17px,1.55vw,20px);
  line-height: 1.6;
}
.service-intro-actions { margin-top: 31px; display: flex; align-items: center; gap: 22px; flex-wrap: wrap; }
.service-intro-note {
  max-width: 650px;
  margin: 28px 0 0;
  padding-top: 20px;
  border-top: 1px solid var(--line);
  color: var(--muted);
  font-size: 13px;
  display: flex;
  align-items: flex-start;
  gap: 10px;
}
.service-intro-note > span { width: 7px; height: 7px; flex: 0 0 auto; margin-top: 7px; border-radius: 50%; background: var(--green); box-shadow: 0 0 15px color-mix(in srgb,var(--green) 65%, transparent); }

.project-map {
  min-height: 520px;
  position: relative;
  overflow: hidden;
  border: 1px solid var(--line-strong);
  border-radius: 30px;
  background: color-mix(in srgb,var(--surface) 88%, transparent);
  box-shadow: 0 32px 86px rgba(12,40,72,.11);
  isolation: isolate;
}
.project-map::before {
  content: "";
  position: absolute;
  width: 330px;
  height: 330px;
  left: 50%;
  top: 53%;
  translate: -50% -50%;
  border-radius: 50%;
  background: radial-gradient(circle, color-mix(in srgb,var(--blue) 12%, transparent), transparent 64%);
  filter: blur(8px);
}
.project-map-grid {
  position: absolute;
  inset: 0;
  opacity: .54;
  background-image:
    linear-gradient(var(--line) 1px, transparent 1px),
    linear-gradient(90deg,var(--line) 1px,transparent 1px);
  background-size: 30px 30px;
  -webkit-mask-image: radial-gradient(circle at center,#000 25%,transparent 79%);
  mask-image: radial-gradient(circle at center,#000 25%,transparent 79%);
}
.project-map-top {
  min-height: 46px;
  position: absolute;
  inset: 0 0 auto;
  z-index: 5;
  padding: 0 16px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-bottom: 1px solid var(--line);
  color: var(--muted);
  font-family: ui-monospace,SFMono-Regular,Menlo,monospace;
  font-size: 8px;
  letter-spacing: .1em;
}
.project-map-top b { color: var(--green-2); font-weight: 700; }
.project-core {
  position: absolute;
  left: 50%;
  top: 53%;
  translate: -50% -50%;
  width: 154px;
  height: 154px;
  z-index: 5;
  border-radius: 34px;
  border: 1px solid color-mix(in srgb,var(--blue) 28%, var(--line));
  background: linear-gradient(145deg,color-mix(in srgb,var(--surface) 96%,var(--blue) 4%),var(--surface));
  box-shadow: 0 24px 65px rgba(13,124,255,.14), inset 0 0 40px color-mix(in srgb,var(--blue) 4%,transparent);
  display: grid;
  place-content: center;
  text-align: center;
}
.project-core::before,
.project-core::after {
  content: "";
  position: absolute;
  border: 1px solid var(--line);
  border-radius: 44px;
}
.project-core::before { inset: -24px; }
.project-core::after { inset: -48px; border-style: dashed; opacity: .7; }
.project-core small { color: var(--muted); font-size: 9px; letter-spacing: .17em; font-weight: 800; }
.project-core strong { margin-top: 3px; font-size: 18px; letter-spacing: -.025em; }
.project-core span { color: var(--blue); margin-top: 2px; font-size: 10px; }
.project-node {
  position: absolute;
  z-index: 6;
  min-width: 132px;
  padding: 12px 14px 12px 30px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: color-mix(in srgb,var(--surface) 90%,transparent);
  box-shadow: 0 13px 32px rgba(10,35,62,.08);
  backdrop-filter: blur(10px);
  display: grid;
  transition: transform .25s var(--ease), border-color .2s ease, box-shadow .2s ease;
}
.project-node:hover { transform: translateY(-4px); border-color: color-mix(in srgb,var(--blue) 35%,var(--line)); box-shadow: 0 18px 40px rgba(10,35,62,.13); }
.project-node i { position: absolute; left: 13px; top: 50%; translate: 0 -50%; width: 7px; height: 7px; border-radius: 50%; background: var(--blue); box-shadow: 0 0 13px color-mix(in srgb,var(--blue) 70%,transparent); }
.project-node small { color: var(--muted); font-size: 7.5px; letter-spacing: .12em; font-weight: 800; }
.project-node strong { font-size: 12px; margin-top: 2px; }
.project-mobile i,.project-auto i { background: var(--green); box-shadow: 0 0 13px color-mix(in srgb,var(--green) 70%,transparent); }
.project-web { left: 5%; top: 22%; }
.project-mobile { right: 5%; top: 22%; }
.project-systems { left: 4%; bottom: 18%; }
.project-auto { right: 4%; bottom: 18%; }
.project-integration { left: 50%; bottom: 5%; translate: -50% 0; }
.project-line { position: absolute; z-index: 2; height: 1px; transform-origin: left center; background: linear-gradient(90deg,color-mix(in srgb,var(--blue) 55%,transparent),color-mix(in srgb,var(--green) 38%,transparent)); opacity: .45; }
.line-web { width: 155px; left: 20%; top: 38%; rotate: 18deg; }
.line-mobile { width: 155px; right: 20%; top: 38%; rotate: -18deg; transform-origin: right center; }
.line-systems { width: 155px; left: 20%; bottom: 34%; rotate: -17deg; }
.line-auto { width: 155px; right: 20%; bottom: 34%; rotate: 17deg; transform-origin: right center; }
.line-integration { width: 78px; left: 50%; bottom: 17%; rotate: 90deg; transform-origin: left center; }
.project-status { position: absolute; left: 17px; bottom: 14px; display: flex; align-items: center; gap: 7px; color: var(--muted); font-size: 8px; letter-spacing: .06em; }
.project-status span { width: 6px; height: 6px; border-radius: 50%; background: var(--green); box-shadow: 0 0 12px rgba(8,207,147,.5); }

.software-services { background: var(--bg); }
.software-section-head { display: grid; grid-template-columns: minmax(0,1.25fr) minmax(300px,.65fr); gap: 70px; align-items: end; margin-bottom: 50px; }
.software-section-head h2 { margin: 0; font-size: clamp(38px,4.4vw,62px); line-height: .98; letter-spacing: -.058em; }
.software-section-head > p { margin: 0 0 5px; color: var(--muted); font-size: 15px; line-height: 1.65; }
.software-bento { display: grid; grid-template-columns: repeat(12,1fr); gap: 16px; }
.software-bento > article { position: relative; overflow: hidden; border: 1px solid var(--line); border-radius: 26px; background: var(--surface); transition: transform .28s var(--ease), border-color .22s ease, box-shadow .25s ease; }
.software-bento > article:hover { transform: translateY(-4px); border-color: color-mix(in srgb,var(--blue) 30%,var(--line)); box-shadow: 0 24px 65px rgba(10,35,62,.1); }
.software-bento-main { grid-column: span 7; min-height: 450px; padding: 36px; display: flex; flex-direction: column; justify-content: flex-end; }
.software-bento-main::before { content: ""; position: absolute; inset: 0; opacity: .65; background-image: linear-gradient(color-mix(in srgb,var(--blue) 9%,transparent) 1px,transparent 1px),linear-gradient(90deg,color-mix(in srgb,var(--blue) 9%,transparent) 1px,transparent 1px); background-size: 30px 30px; -webkit-mask-image: linear-gradient(120deg,transparent 12%,#000 80%); mask-image: linear-gradient(120deg,transparent 12%,#000 80%); }
.bento-number { position: absolute; left: 35px; top: 30px; color: var(--muted); font-size: 10px; letter-spacing: .14em; font-weight: 800; }
.bento-main-copy { position: relative; z-index: 3; max-width: 570px; }
.bento-kicker { color: var(--blue); font-size: 10px; text-transform: uppercase; letter-spacing: .13em; font-weight: 800; }
.software-bento h3 { margin: 9px 0 11px; font-size: clamp(27px,2.6vw,40px); line-height: 1.02; letter-spacing: -.048em; }
.software-bento p { margin: 0; color: var(--muted); font-size: 14px; line-height: 1.6; }
.bento-orbit { position: absolute; right: -15px; top: -4px; width: 250px; height: 250px; border: 1px solid var(--line); border-radius: 50%; opacity: .72; }
.bento-orbit::before,.bento-orbit::after { content: ""; position: absolute; inset: 30px; border: 1px dashed var(--line); border-radius: 50%; }
.bento-orbit::after { inset: 72px; border-style: solid; }
.bento-orbit i { position: absolute; width: 7px; height: 7px; border-radius: 50%; background: var(--blue); box-shadow: 0 0 15px rgba(13,124,255,.5); }
.bento-orbit i:first-child { left: 16%; top: 24%; }.bento-orbit i:nth-child(2) { right: 4%; top: 48%; background: var(--green); }.bento-orbit i:nth-child(3) { left: 46%; bottom: 2%; background: var(--green); }
.bento-orbit span { position: absolute; left: 50%; top: 50%; translate: -50% -50%; color: var(--muted); font-size: 9px; letter-spacing: .1em; }
.software-bento-card { grid-column: span 5; min-height: 310px; padding: 28px; }
.bento-icon { width: 48px; height: 48px; margin-bottom: 55px; border-radius: 14px; display: grid; place-items: center; color: white; background: linear-gradient(135deg,var(--blue),var(--green)); box-shadow: 0 12px 28px rgba(13,124,255,.16); }
.bento-icon svg { width: 23px; height: 23px; }
.software-bento-wide { grid-column: span 7; min-height: 310px; padding: 30px; display: grid; grid-template-columns: .9fr 1.1fr; gap: 28px; align-items: center; }
.flow-visual { position: relative; min-height: 180px; display: grid; grid-template-columns: 1fr 34px 1.2fr 34px 1fr; align-items: center; }
.flow-box { min-height: 70px; padding: 12px; border: 1px solid var(--line); border-radius: 15px; background: var(--surface-2); display: grid; place-items: center; text-align: center; color: var(--muted); font-size: 10px; font-weight: 700; }
.flow-highlight { color: var(--text); border-color: color-mix(in srgb,var(--green) 30%,var(--line)); box-shadow: inset 0 0 28px color-mix(in srgb,var(--green) 5%,transparent); }
.flow-visual i { height: 1px; background: linear-gradient(90deg,var(--blue),var(--green)); position: relative; }
.flow-visual i::after { content: ""; position: absolute; width: 5px; height: 5px; right: -1px; top: 50%; translate: 0 -50%; border-radius: 50%; background: var(--green); box-shadow: 0 0 10px rgba(8,207,147,.55); }

.project-entry { background: var(--surface); border-block: 1px solid var(--line); }
.entry-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 16px; }
.entry-card { min-height: 290px; padding: 30px; border: 1px solid var(--line); border-radius: 24px; background: var(--bg); position: relative; overflow: hidden; }
.entry-card::before { content: ""; position: absolute; width: 170px; height: 170px; right: -80px; bottom: -90px; border-radius: 50%; background: radial-gradient(circle,color-mix(in srgb,var(--blue) 10%,transparent),transparent 68%); }
.entry-card > span { color: var(--green-2); font-size: 10px; letter-spacing: .14em; font-weight: 800; }
.entry-card h3 { margin: 86px 0 10px; font-size: 27px; letter-spacing: -.04em; }
.entry-card p { margin: 0; color: var(--muted); font-size: 14px; line-height: 1.6; }

.software-process { background: var(--navy); color: var(--white); position: relative; overflow: hidden; }
.software-process::before { content: ""; position: absolute; inset: 0; opacity: .18; background-image: linear-gradient(rgba(130,161,194,.08) 1px,transparent 1px),linear-gradient(90deg,rgba(130,161,194,.08) 1px,transparent 1px); background-size: 38px 38px; -webkit-mask-image: radial-gradient(circle at 80% 50%,#000,transparent 66%); mask-image: radial-gradient(circle at 80% 50%,#000,transparent 66%); }
.software-process-grid { position: relative; display: grid; grid-template-columns: .82fr 1.18fr; gap: 90px; align-items: start; }
.software-process-copy { position: sticky; top: calc(var(--header-height) + 45px); }
.software-process-copy h2 { margin: 0; font-size: clamp(40px,4.5vw,62px); line-height: .98; letter-spacing: -.058em; }
.software-process-copy > p:not(.eyebrow) { max-width: 520px; color: #91a5bd; font-size: 16px; line-height: 1.65; }
.team-note { margin-top: 34px; padding-top: 22px; border-top: 1px solid rgba(218,235,255,.1); display: flex; gap: 12px; color: #8298b2; font-size: 13px; }
.team-note span { width: 7px; height: 7px; margin-top: 7px; flex: 0 0 auto; border-radius: 50%; background: var(--green); box-shadow: 0 0 12px rgba(8,207,147,.5); }
.team-note p { margin: 0; }
.software-process-list { margin: 0; padding: 0; list-style: none; border-top: 1px solid rgba(218,235,255,.11); }
.software-process-list li { min-height: 150px; padding: 28px 0; display: grid; grid-template-columns: 70px 1fr; gap: 12px; border-bottom: 1px solid rgba(218,235,255,.11); }
.software-process-list > li > span { color: #5d7793; font-size: 10px; letter-spacing: .14em; font-weight: 800; padding-top: 5px; }
.software-process-list h3 { margin: 0 0 7px; font-size: 23px; letter-spacing: -.03em; }
.software-process-list p { margin: 0; max-width: 520px; color: #8399b3; font-size: 13.5px; }

.adaptive-team { background: var(--bg); }
.adaptive-team-grid { display: grid; grid-template-columns: 1fr .86fr; gap: 90px; align-items: center; }
.adaptive-team-visual { min-height: 490px; position: relative; border: 1px solid var(--line); border-radius: 28px; overflow: hidden; background: var(--surface); box-shadow: var(--shadow); }
.team-grid-bg { position: absolute; inset: 0; opacity: .55; background-image: linear-gradient(var(--line) 1px,transparent 1px),linear-gradient(90deg,var(--line) 1px,transparent 1px); background-size: 30px 30px; -webkit-mask-image: radial-gradient(circle,#000,transparent 74%); mask-image: radial-gradient(circle,#000,transparent 74%); }
.team-core { position: absolute; left: 50%; top: 50%; translate: -50% -50%; width: 150px; height: 150px; border-radius: 50%; border: 1px solid color-mix(in srgb,var(--blue) 26%,var(--line)); background: var(--surface); box-shadow: 0 24px 60px rgba(13,124,255,.12); display: grid; place-content: center; text-align: center; z-index: 3; }
.team-core::before { content:""; position:absolute; inset:-35px; border-radius:50%; border:1px dashed var(--line); }
.team-core small { color: var(--muted); font-size: 8px; letter-spacing:.15em; font-weight:800; }.team-core strong { font-size:16px; }.team-core span { color:var(--green-2); font-size:9px; }
.expert { position: absolute; z-index: 4; min-width: 110px; padding: 10px 13px; border: 1px solid var(--line); border-radius: 999px; background: color-mix(in srgb,var(--surface) 88%,transparent); backdrop-filter: blur(9px); box-shadow: 0 13px 30px rgba(10,35,62,.07); text-align: center; color: var(--muted); font-size: 10px; font-weight: 700; }
.expert-dev { left: 7%; top: 19%; }.expert-design { right: 8%; top: 18%; }.expert-mobile { left: 5%; bottom: 22%; }.expert-integration { right: 5%; bottom: 22%; }.expert-infra { left: 50%; top: 8%; translate:-50% 0; }.expert-security { left:50%; bottom:8%; translate:-50% 0; }
.adaptive-team-copy h2 { margin: 0; font-size: clamp(40px,4.4vw,60px); line-height: .98; letter-spacing: -.058em; }
.adaptive-team-copy > p:not(.eyebrow) { color: var(--muted); font-size: 16px; line-height: 1.7; }
.adaptive-team-highlight { margin-top: 28px !important; padding: 20px 22px; border-left: 2px solid var(--green); background: color-mix(in srgb,var(--surface) 72%,transparent); color: var(--text) !important; font-weight: 620; }

.ai-assist-strip { padding: 62px 0; background: var(--surface-2); border-block: 1px solid var(--line); }
.ai-assist-inner { display: grid; grid-template-columns: 90px .9fr 1.1fr; gap: 38px; align-items: center; }
.ai-assist-mark { width: 78px; height: 78px; border: 1px solid var(--line-strong); border-radius: 22px; background: var(--surface); display: grid; place-items: center; position: relative; }
.ai-assist-mark::before { content:""; width:30px; height:30px; border:1px solid color-mix(in srgb,var(--blue) 38%,var(--line)); border-radius:9px; box-shadow: inset 0 0 16px color-mix(in srgb,var(--blue) 7%,transparent); }
.ai-assist-mark span { position:absolute; width:6px; height:6px; border-radius:50%; background:var(--green); box-shadow:0 0 10px rgba(8,207,147,.55); }.ai-assist-mark span:nth-child(1){left:15px;top:20px}.ai-assist-mark span:nth-child(2){right:14px;top:28px;background:var(--blue)}.ai-assist-mark span:nth-child(3){left:28px;bottom:13px}
.ai-assist-inner small { color:var(--blue); text-transform:uppercase; letter-spacing:.13em; font-size:9px; font-weight:800; }.ai-assist-inner h2 { margin:5px 0 0; font-size:clamp(26px,2.5vw,38px); line-height:1.02; letter-spacing:-.045em; }.ai-assist-inner > p { margin:0; color:var(--muted); font-size:14px; line-height:1.65; }

.software-cta { background: var(--bg); }
.software-cta-card { min-height: 360px; position: relative; overflow: hidden; border-radius: 30px; padding: 54px; color: var(--white); background: linear-gradient(135deg,#07101d,#0a1e33 60%,#0a2f3e); box-shadow: 0 34px 90px rgba(7,16,29,.2); display: grid; grid-template-columns: 1.2fr .8fr; gap: 70px; align-items: end; }
.software-cta-card::before { content:""; position:absolute; width:500px; height:500px; right:-120px; top:-220px; border-radius:50%; background:radial-gradient(circle,rgba(8,207,147,.17),transparent 64%); }
.software-cta-grid { position:absolute; inset:0; opacity:.22; background-image:linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px); background-size:32px 32px; -webkit-mask-image:linear-gradient(90deg,transparent,#000); mask-image:linear-gradient(90deg,transparent,#000); }
.software-cta-card > *:not(.software-cta-grid) { position:relative; z-index:2; }
.software-cta-card h2 { margin:0; max-width:750px; font-size:clamp(40px,4.6vw,64px); line-height:.98; letter-spacing:-.058em; }.software-cta-card > div > p:not(.eyebrow) { max-width:690px; color:#96aac2; font-size:15px; }.software-cta-actions { display:flex; flex-wrap:wrap; gap:10px; align-items:center; justify-content:flex-end; }

@media (max-width: 1060px) {
  .service-intro-grid { grid-template-columns: 1fr; gap: 45px; }
  .project-map { width: min(100%,760px); margin: 0 auto; }
  .software-bento-main { grid-column: span 12; }
  .software-bento-card { grid-column: span 6; }
  .software-bento-wide { grid-column: span 12; }
  .software-process-grid { grid-template-columns: 1fr; gap: 50px; }
  .software-process-copy { position: static; }
  .adaptive-team-grid { grid-template-columns: 1fr; gap: 50px; }
  .adaptive-team-visual { width:min(100%,760px); }
  .ai-assist-inner { grid-template-columns: 78px 1fr; }.ai-assist-inner > p { grid-column: 2; }
  .software-cta-card { grid-template-columns: 1fr; gap: 35px; }.software-cta-actions { justify-content:flex-start; }
}

@media (max-width: 720px) {
  .service-intro { padding: 44px 0 64px; }
  .service-intro-grid { gap: 34px; }
  .service-intro-copy h1 { font-size: clamp(44px,13vw,62px); }
  .service-intro-lead { font-size: 16px; }
  .service-intro-actions { flex-direction: column; align-items: stretch; gap: 14px; }.service-intro-actions .button { width:100%; }.service-intro-actions .text-link { justify-content:center; }
  .project-map { min-height: 455px; border-radius: 24px; }
  .project-core { width:120px; height:120px; border-radius:28px; }.project-core::before{inset:-18px}.project-core::after{inset:-34px}.project-core strong{font-size:14px}
  .project-node { min-width: 0; width: 104px; padding: 10px 8px 10px 23px; }.project-node i{left:9px}.project-node small{font-size:6px}.project-node strong{font-size:9px}
  .project-web { left:3%;top:21%; }.project-mobile{right:3%;top:21%;}.project-systems{left:3%;bottom:19%;}.project-auto{right:3%;bottom:19%;}.project-integration{bottom:5%;width:112px;}
  .project-line { opacity:.3; }
  .software-section-head { grid-template-columns:1fr; gap:18px; margin-bottom:34px; }.software-section-head h2{font-size:clamp(38px,11vw,52px)}
  .software-bento { grid-template-columns:1fr; }.software-bento-main,.software-bento-card,.software-bento-wide{grid-column:1;}.software-bento-main{min-height:420px;padding:25px}.software-bento-card{min-height:290px;padding:24px}.bento-icon{margin-bottom:50px}.bento-orbit{width:200px;height:200px;right:-35px;top:-20px}.software-bento-wide{min-height:410px;padding:24px;grid-template-columns:1fr;}.flow-visual{min-height:150px;grid-template-columns:1fr 22px 1.2fr 22px 1fr}.flow-box{padding:8px;font-size:8px}
  .entry-grid { grid-template-columns:1fr; }.entry-card{min-height:250px;padding:24px}.entry-card h3{margin-top:62px}
  .software-process-list li { grid-template-columns:48px 1fr; }
  .adaptive-team-visual { min-height:440px; }.team-core{width:125px;height:125px}.team-core::before{inset:-26px}.expert{min-width:94px;padding:8px 9px;font-size:8px}.expert-dev{left:3%;top:20%}.expert-design{right:3%;top:20%}.expert-mobile{left:3%;bottom:23%}.expert-integration{right:3%;bottom:23%}
  .adaptive-team-copy h2 { font-size:clamp(38px,11vw,52px); }
  .ai-assist-strip { padding:48px 0; }.ai-assist-inner{grid-template-columns:1fr;gap:20px}.ai-assist-inner > p{grid-column:1}.ai-assist-mark{width:66px;height:66px;border-radius:18px}
  .software-cta-card{min-height:0;padding:34px 24px;border-radius:24px}.software-cta-card h2{font-size:clamp(38px,11vw,52px)}.software-cta-actions{flex-direction:column}.software-cta-actions .button{width:100%}
}

@media (max-width: 420px) {
  .project-map { min-height: 430px; }
  .project-node { width: 92px; }
  .project-integration { width: 104px; }
  .expert { min-width: 84px; padding-inline:7px; }
}

/* ==========================================================
   INTERNAL SERVICE PAGES / V6
   ========================================================== */
.desktop-nav a.is-active { color: var(--text); }
.desktop-nav a.is-active::after { right: 0; }
.mobile-menu a.is-active { color: var(--blue); }
.person-phone { margin-top: 2px; color: var(--muted); font-size: 10.5px; font-weight: 520; }
.footer-contact span { line-height: 1.45; }

.inner-intro { position: relative; overflow: hidden; background: var(--hero-bg); padding: 78px 0 88px; }
.inner-intro::before { content:""; position:absolute; inset:0; pointer-events:none; background: radial-gradient(circle at 74% 45%, color-mix(in srgb,var(--blue) 7%, transparent), transparent 34%), radial-gradient(circle at 70% 58%, color-mix(in srgb,var(--green) 5%, transparent), transparent 31%); }
.inner-intro-grid { position:relative; display:grid; grid-template-columns:minmax(0,.9fr) minmax(480px,1.1fr); gap:72px; align-items:center; }
.inner-intro-copy { position:relative; z-index:2; }
.inner-intro-copy h1 { margin:0; font-size:clamp(48px,5.7vw,78px); line-height:.94; letter-spacing:-.064em; font-weight:780; }
.inner-intro-copy h1 em { font-style:normal; color:transparent; background:linear-gradient(95deg,var(--blue),var(--green)); -webkit-background-clip:text; background-clip:text; }
.inner-lead { margin:26px 0 0; max-width:650px; color:var(--muted); font-size:clamp(17px,1.5vw,20px); }
.inner-actions { margin-top:30px; display:flex; align-items:center; flex-wrap:wrap; gap:20px; }
.service-head, .company-section-head { display:grid; grid-template-columns:minmax(0,1.35fr) minmax(280px,.65fr); gap:80px; align-items:end; margin-bottom:54px; }
.service-head.compact, .company-section-head.compact { grid-template-columns:1fr; }
.service-head h2, .company-section-head h2 { margin:0; font-size:clamp(38px,4vw,58px); line-height:1; letter-spacing:-.055em; }
.service-head > p, .company-section-head > p { margin:0 0 4px; color:var(--muted); font-size:16px; }
.service-final { background:var(--bg); }
.service-final-card { position:relative; overflow:hidden; min-height:330px; padding:50px 54px; border-radius:30px; display:grid; grid-template-columns:1.25fr .75fr; gap:64px; align-items:center; background:linear-gradient(135deg,#07101d,#0a1f35 58%,#0a2d38); color:white; box-shadow:0 30px 80px rgba(7,16,29,.2); }
.service-final-card::after { content:""; position:absolute; width:430px; height:430px; right:-180px; top:-230px; border-radius:50%; background:radial-gradient(circle,rgba(8,207,147,.15),transparent 64%); }
.service-final-card > * { position:relative; z-index:2; }
.service-final-card h2 { margin:0; max-width:720px; font-size:clamp(35px,4vw,54px); line-height:1; letter-spacing:-.052em; }
.service-final-card p:not(.eyebrow) { color:#96aac2; max-width:670px; }
.service-final-card > div:last-child { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:10px; }

/* Infrastructure — floor-plan visual language */
.infra-map { min-height:470px; position:relative; border:1px solid var(--line); border-radius:28px; background:color-mix(in srgb,var(--surface) 88%, transparent); box-shadow:var(--shadow-lg); overflow:hidden; }
.infra-map::before { content:""; position:absolute; inset:0; background-image:linear-gradient(var(--line) 1px,transparent 1px),linear-gradient(90deg,var(--line) 1px,transparent 1px); background-size:24px 24px; opacity:.5; }
.infra-floor { position:absolute; inset:46px 42px 48px; border:1px solid color-mix(in srgb,var(--blue) 24%,var(--line)); border-radius:18px; }
.floor-label { position:absolute; top:-30px; left:0; color:var(--muted); font-size:9px; letter-spacing:.15em; font-weight:800; }
.wall { position:absolute; background:var(--line-strong); }
.w1 { left:35%; top:0; bottom:44%; width:1px; }.w2 { right:30%; top:30%; bottom:0; width:1px; }.w3 { left:35%; right:30%; top:56%; height:1px; }
.infra-rack { position:absolute; left:50%; top:50%; translate:-50% -50%; width:96px; height:120px; border:1px solid var(--line-strong); border-radius:15px; background:var(--surface); padding:17px 14px; box-shadow:0 20px 42px rgba(13,124,255,.12); z-index:3; }
.infra-rack span { display:block; height:12px; margin-bottom:8px; border-radius:4px; border:1px solid var(--line); background:linear-gradient(90deg,color-mix(in srgb,var(--blue) 10%,transparent),transparent); }
.infra-rack small { position:absolute; bottom:8px; left:0; right:0; text-align:center; color:var(--muted); font-size:8px; text-transform:uppercase; }
.infra-ap { position:absolute; z-index:4; display:grid; place-items:center; width:48px; height:48px; border-radius:50%; border:1px solid color-mix(in srgb,var(--green) 40%,var(--line)); background:var(--surface); box-shadow:0 0 0 18px color-mix(in srgb,var(--green) 5%,transparent),0 0 0 36px color-mix(in srgb,var(--green) 3%,transparent); }
.infra-ap b { width:7px; height:7px; border-radius:50%; background:var(--green); box-shadow:0 0 14px var(--green); }
.infra-ap span { position:absolute; top:55px; font-size:8px; color:var(--muted); }.ap1{left:12%;top:18%}.ap2{right:10%;top:18%}
.infra-device { position:absolute; width:13px; height:13px; border:2px solid var(--blue); border-radius:4px; box-shadow:0 0 12px rgba(13,124,255,.25); z-index:2; }.d1{left:12%;bottom:14%}.d2{right:10%;bottom:13%}.d3{right:12%;top:48%}
.infra-lines { position:absolute; inset:0; width:100%; height:100%; z-index:1; color:color-mix(in srgb,var(--blue) 48%,transparent); }.infra-lines path{stroke-dasharray:6 8;animation:infraFlow 2.2s linear infinite}.infra-status{position:absolute;left:28px;bottom:16px;display:flex;align-items:center;gap:8px;color:var(--muted);font-size:9px;letter-spacing:.08em;text-transform:uppercase}.infra-status i{width:6px;height:6px;border-radius:50%;background:var(--green);box-shadow:0 0 12px var(--green)}
@keyframes infraFlow{to{stroke-dashoffset:-28}}
.infra-needs { background:var(--bg); }.infra-needs-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:18px}.infra-need{position:relative;min-height:330px;padding:30px;border:1px solid var(--line);border-radius:24px;background:var(--surface);overflow:hidden}.infra-need>span{color:var(--blue);font-size:10px;letter-spacing:.14em;font-weight:800}.infra-need h3{margin:86px 0 10px;font-size:31px;letter-spacing:-.045em}.infra-need p{max-width:470px;margin:0;color:var(--muted)}.need-wave,.need-rings,.need-lines,.need-stack{position:absolute;right:26px;top:24px;width:116px;height:82px;opacity:.8}.need-wave{background:repeating-radial-gradient(ellipse at 50% 100%,transparent 0 14px,color-mix(in srgb,var(--green) 22%,transparent) 15px 16px,transparent 17px 28px)}.need-rings{border-radius:50%;border:1px solid color-mix(in srgb,var(--blue) 24%,transparent);box-shadow:inset 0 0 0 14px var(--surface),inset 0 0 0 15px color-mix(in srgb,var(--blue) 15%,transparent),inset 0 0 0 29px var(--surface),inset 0 0 0 30px color-mix(in srgb,var(--green) 14%,transparent)}.need-lines{background:linear-gradient(155deg,transparent 45%,color-mix(in srgb,var(--blue) 22%,transparent) 46% 47%,transparent 48%),linear-gradient(25deg,transparent 53%,color-mix(in srgb,var(--green) 19%,transparent) 54% 55%,transparent 56%)}.need-stack{display:grid;gap:7px;padding-top:6px}.need-stack i{display:block;height:16px;border:1px solid var(--line-strong);border-radius:5px;background:linear-gradient(90deg,color-mix(in srgb,var(--blue) 10%,transparent),transparent)}
.infra-process{background:#07101d;color:white}.infra-process-grid{display:grid;grid-template-columns:.78fr 1.22fr;gap:90px}.infra-process-copy h2{margin:0;font-size:clamp(38px,4vw,58px);line-height:1;letter-spacing:-.055em}.infra-process-copy p:not(.eyebrow){color:#90a4bc;font-size:17px}.infra-process-list{list-style:none;margin:0;padding:0;border-top:1px solid rgba(255,255,255,.11)}.infra-process-list li{display:grid;grid-template-columns:58px 1fr;gap:16px;padding:24px 0;border-bottom:1px solid rgba(255,255,255,.11)}.infra-process-list b{color:#6f89a5;font-size:10px;letter-spacing:.14em}.infra-process-list h3{margin:0 0 5px;font-size:20px}.infra-process-list p{margin:0;color:#8096af;font-size:13px}.space-types{background:var(--surface)}.space-strip{display:flex;align-items:center;justify-content:space-between;gap:14px;border-block:1px solid var(--line);padding:34px 0}.space-strip span{font-size:clamp(19px,2vw,28px);font-weight:700;letter-spacing:-.03em}.space-strip i{width:5px;height:5px;border-radius:50%;background:var(--green)}

/* CCTV — surveillance / coverage language */
.cctv-intro{background:#060e18;color:#f4f9ff}.cctv-intro .inner-lead,.cctv-intro .eyebrow,.cctv-intro .text-link{color:#91a6bf}.cctv-view{min-height:470px;border:1px solid rgba(218,235,255,.12);border-radius:28px;background:#091523;box-shadow:0 34px 90px rgba(0,0,0,.34);padding:20px;position:relative}.cctv-screen{position:absolute;inset:20px 20px 50px;border-radius:18px;overflow:hidden;background:linear-gradient(145deg,#102236,#07111e)}.scan-grid{position:absolute;inset:0;background-image:linear-gradient(rgba(128,167,205,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(128,167,205,.07) 1px,transparent 1px);background-size:30px 30px}.camera-fov{position:absolute;left:50%;top:50%;translate:-50% -50%;width:390px;height:300px;border-radius:50%;background:conic-gradient(from 205deg at 50% 50%,transparent 0 18%,rgba(13,124,255,.12) 18% 43%,rgba(8,207,147,.07) 43% 47%,transparent 47%);animation:cctvSweep 5s ease-in-out infinite}.tracking-box{position:absolute;border:1px solid var(--green);box-shadow:0 0 20px rgba(8,207,147,.13)}.tracking-box span{position:absolute;left:-1px;bottom:100%;padding:3px 6px;background:var(--green);color:#07101d;font-size:7px;font-weight:800}.t1{left:15%;top:26%;width:130px;height:100px}.t2{right:13%;bottom:23%;width:105px;height:82px;border-color:var(--blue)}.t2 span{background:var(--blue);color:white}.cctv-reticle{position:absolute;left:50%;top:50%;translate:-50% -50%;width:70px;height:70px;border:1px solid rgba(255,255,255,.16);border-radius:50%}.cctv-reticle i:first-child{position:absolute;left:50%;top:-14px;bottom:-14px;width:1px;background:rgba(255,255,255,.13)}.cctv-reticle i:last-child{position:absolute;top:50%;left:-14px;right:-14px;height:1px;background:rgba(255,255,255,.13)}.cctv-hud{position:absolute;left:18px;right:18px;bottom:15px;display:flex;justify-content:space-between;color:#758da8;font-size:8px;text-transform:uppercase;letter-spacing:.08em}.cctv-hud b{color:#cfe3f7;font-weight:700}.cctv-caption{position:absolute;left:24px;bottom:15px;color:#68829f;font-size:8px;text-transform:uppercase;letter-spacing:.1em;display:flex;align-items:center;gap:8px}.cctv-caption i{width:6px;height:6px;border-radius:50%;background:var(--green);box-shadow:0 0 12px var(--green)}@keyframes cctvSweep{0%,100%{transform:rotate(-3deg)}50%{transform:rotate(7deg)}}
.cctv-coverage{background:var(--bg)}.coverage-board{display:grid;grid-template-columns:1.2fr .8fr;border:1px solid var(--line);border-radius:28px;overflow:hidden;background:var(--surface);box-shadow:var(--shadow)}.coverage-plan{min-height:510px;position:relative;background-image:linear-gradient(var(--line) 1px,transparent 1px),linear-gradient(90deg,var(--line) 1px,transparent 1px);background-size:28px 28px;border-right:1px solid var(--line)}.zone{position:absolute;border:1px solid var(--line-strong);border-radius:12px;padding:11px;color:var(--muted);font-size:9px;text-transform:uppercase;letter-spacing:.12em}.z1{left:9%;top:10%;width:36%;height:31%}.z2{right:8%;top:10%;width:38%;height:50%}.z3{left:9%;bottom:9%;width:45%;height:39%}.z4{right:8%;bottom:9%;width:28%;height:27%;border-color:color-mix(in srgb,var(--green) 35%,var(--line))}.cam{position:absolute;width:12px;height:12px;border:2px solid var(--blue);border-radius:3px;box-shadow:0 0 16px rgba(13,124,255,.28)}.cam::after{content:"";position:absolute;width:88px;height:88px;left:4px;top:4px;background:conic-gradient(from 260deg,rgba(13,124,255,.12) 0 25%,transparent 25%);border-radius:50%;transform-origin:0 0}.c1{left:18%;top:18%}.c2{right:18%;top:20%;transform:rotate(90deg)}.c3{left:18%;bottom:18%;transform:rotate(-45deg)}.c4{right:19%;bottom:17%;transform:rotate(160deg)}.coverage-notes{padding:38px}.coverage-notes article{padding:25px 0;border-bottom:1px solid var(--line)}.coverage-notes article:first-child{padding-top:0}.coverage-notes article:last-child{border-bottom:0}.coverage-notes span{color:var(--blue);font-size:9px;letter-spacing:.15em}.coverage-notes h3{margin:7px 0 6px;font-size:24px;letter-spacing:-.035em}.coverage-notes p{margin:0;color:var(--muted);font-size:13px}
.cctv-modules{background:var(--surface)}.cctv-module-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.cctv-module{position:relative;overflow:hidden;min-height:360px;padding:28px;border:1px solid var(--line);border-radius:24px;background:var(--bg)}.cctv-module>small{display:block;margin-top:110px;color:var(--blue);font-size:9px;letter-spacing:.14em}.cctv-module h3{margin:10px 0;font-size:28px;line-height:1.05;letter-spacing:-.04em}.cctv-module p{margin:0;color:var(--muted);font-size:14px}.module-signal{position:absolute;right:28px;top:24px;width:92px;height:92px;border-radius:50%;border:1px solid color-mix(in srgb,var(--green) 28%,var(--line));box-shadow:inset 0 0 0 16px var(--bg),inset 0 0 0 17px color-mix(in srgb,var(--green) 19%,var(--line)),inset 0 0 0 32px var(--bg),inset 0 0 0 33px color-mix(in srgb,var(--green) 12%,var(--line))}.module-storage{position:absolute;right:28px;top:27px;width:100px}.module-storage i{display:block;height:18px;border:1px solid var(--line-strong);border-radius:5px;margin-bottom:8px;background:linear-gradient(90deg,color-mix(in srgb,var(--blue) 14%,transparent),transparent)}.module-link{position:absolute;right:28px;top:45px;width:118px;display:flex;align-items:center}.module-link i{width:22px;height:22px;border:2px solid var(--blue);border-radius:6px}.module-link span{height:1px;flex:1;background:linear-gradient(90deg,var(--blue),var(--green));position:relative}.module-link span::after{content:"";position:absolute;width:5px;height:5px;border-radius:50%;background:var(--green);top:50%;left:20%;translate:0 -50%;animation:linkPacket 1.7s linear infinite}@keyframes linkPacket{to{left:88%}}
.cctv-maintenance{background:#07101d;color:white}.cctv-maintenance-grid{display:grid;grid-template-columns:.95fr 1.05fr;gap:80px;align-items:center}.cctv-maintenance h2{margin:0;font-size:clamp(38px,4vw,56px);line-height:1;letter-spacing:-.05em}.cctv-maintenance p:not(.eyebrow){color:#8da3bc}.maintenance-pulse{display:flex;align-items:center;justify-content:space-between;gap:10px}.maintenance-pulse span{padding:12px 14px;border:1px solid rgba(255,255,255,.1);border-radius:999px;color:#abc0d6;font-size:10px}.maintenance-pulse i{flex:1;height:1px;background:linear-gradient(90deg,var(--blue),var(--green));opacity:.5}

/* IT services — operations / service desk language */
.ops-console{min-height:470px;border:1px solid var(--line);border-radius:28px;background:linear-gradient(145deg,color-mix(in srgb,var(--surface) 96%,var(--blue) 4%),var(--surface));box-shadow:var(--shadow-lg);overflow:hidden;position:relative}.ops-top{height:56px;border-bottom:1px solid var(--line);display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:12px;padding:0 18px}.ops-top>span{width:7px;height:7px;border-radius:50%;background:var(--green);box-shadow:0 0 11px var(--green)}.ops-top b,.ops-top small{font-size:9px;letter-spacing:.13em}.ops-top b{color:var(--muted)}.ops-top small{color:var(--muted)}.ops-score{position:absolute;left:42px;top:96px}.score-ring{width:170px;height:170px;border-radius:50%;display:grid;place-items:center;text-align:center;border:1px solid var(--line-strong);box-shadow:inset 0 0 0 17px var(--surface),inset 0 0 0 18px color-mix(in srgb,var(--green) 23%,var(--line)),inset 0 0 0 37px var(--surface),inset 0 0 0 38px color-mix(in srgb,var(--blue) 18%,var(--line))}.score-ring strong{font-size:33px;letter-spacing:-.05em;color:var(--green)}.score-ring span{position:absolute;margin-top:56px;color:var(--muted);font-size:8px;text-transform:uppercase;letter-spacing:.13em}.ops-stream{position:absolute;right:32px;top:95px;width:48%}.ops-stream article{display:grid;grid-template-columns:8px 1fr auto;align-items:center;gap:12px;padding:17px 0;border-bottom:1px solid var(--line)}.ops-stream i{width:7px;height:7px;border-radius:50%}.ops-stream i.green{background:var(--green);box-shadow:0 0 11px var(--green)}.ops-stream i.blue{background:var(--blue);box-shadow:0 0 11px var(--blue)}.ops-stream div{display:grid}.ops-stream small{color:var(--muted);font-size:8px;letter-spacing:.13em}.ops-stream strong{font-size:14px}.ops-stream>article>span{color:var(--green);font-size:8px}.ops-pulse{position:absolute;left:32px;right:32px;bottom:36px;height:62px;background:linear-gradient(180deg,color-mix(in srgb,var(--blue) 7%,transparent),transparent);border-bottom:1px solid color-mix(in srgb,var(--blue) 28%,var(--line));clip-path:polygon(0 74%,8% 62%,16% 68%,24% 34%,32% 54%,40% 48%,48% 66%,56% 31%,64% 42%,72% 24%,80% 53%,88% 44%,100% 59%,100% 100%,0 100%)}
.it-scope{background:var(--bg)}.it-scope-grid{display:grid;grid-template-columns:1.25fr .75fr .75fr;gap:18px}.it-scope-main{grid-row:span 2;min-height:560px;position:relative;padding:32px;border-radius:26px;background:#07101d;color:white;overflow:hidden}.it-scope-main::before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px);background-size:28px 28px;mask-image:linear-gradient(#000,transparent)}.it-scope-main>span,.it-scope-card>span{color:var(--green);font-size:9px;letter-spacing:.14em}.it-scope-main h3{margin:150px 0 12px;font-size:clamp(35px,4vw,51px);line-height:1;letter-spacing:-.05em}.it-scope-main p{color:#8fa4bd;max-width:520px}.ticket-flow{position:absolute;left:32px;right:32px;bottom:38px;display:flex;align-items:center;gap:9px}.ticket-flow b{padding:10px 12px;border:1px solid rgba(255,255,255,.1);border-radius:10px;color:#c6d6e7;font-size:9px;font-weight:600}.ticket-flow i{height:1px;flex:1;background:linear-gradient(90deg,var(--blue),var(--green));opacity:.58}.it-scope-card{min-height:270px;padding:26px;border:1px solid var(--line);border-radius:24px;background:var(--surface)}.it-scope-card h3{margin:76px 0 8px;font-size:26px;letter-spacing:-.04em}.it-scope-card p{margin:0;color:var(--muted);font-size:13px}
.support-rhythm{background:#07101d;color:white}.support-rhythm-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:90px;align-items:center}.support-rhythm-copy h2{margin:0;font-size:clamp(38px,4vw,56px);line-height:1;letter-spacing:-.05em}.support-rhythm-copy p:not(.eyebrow){color:#8fa4bd}.support-modes{display:grid;gap:12px}.support-modes article{position:relative;padding:22px 24px;border:1px solid rgba(255,255,255,.1);border-radius:18px;background:rgba(255,255,255,.025);transition:transform .25s var(--ease),border-color .25s ease}.support-modes article.active{border-color:rgba(8,207,147,.28);background:linear-gradient(90deg,rgba(8,207,147,.07),rgba(255,255,255,.02));transform:translateX(-12px)}.support-modes span{color:#6f8ba7;font-size:8px;letter-spacing:.15em}.support-modes h3{margin:5px 0 3px;font-size:19px}.support-modes p{margin:0;color:#8096ae;font-size:12px}.incident-path{background:var(--surface)}.incident-line{display:grid;grid-template-columns:auto 1fr auto 1fr auto 1fr auto 1fr auto;align-items:center;gap:12px}.incident-line>span{display:grid;gap:6px;font-weight:700;font-size:13px}.incident-line b{color:var(--blue);font-size:9px}.incident-line i{height:1px;background:linear-gradient(90deg,var(--blue),var(--green));opacity:.5}

/* Company */
.company-intro{padding:96px 0;background:var(--hero-bg);overflow:hidden}.company-intro-grid{display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:center}.company-copy h1{margin:0;font-size:clamp(52px,6vw,82px);line-height:.93;letter-spacing:-.067em}.company-copy h1 em{font-style:normal;color:transparent;background:linear-gradient(95deg,var(--blue),var(--green));-webkit-background-clip:text;background-clip:text}.company-copy>p:last-child{max-width:620px;color:var(--muted);font-size:18px}.company-brand-system{min-height:390px;display:flex;align-items:center;justify-content:center;gap:18px;position:relative}.company-brand-system::before{content:"";position:absolute;inset:10% 0;background:radial-gradient(circle at 50%,color-mix(in srgb,var(--blue) 8%,transparent),transparent 58%)}.company-im,.company-st{position:relative;width:170px;height:190px;border:1px solid var(--line);border-radius:28px;background:var(--surface);display:grid;place-items:center;box-shadow:var(--shadow)}.company-im img,.company-st img{width:100px}.company-im small,.company-st small{position:absolute;bottom:20px;color:var(--muted);font-size:7px;letter-spacing:.13em}.company-link{position:relative;display:grid;grid-template-columns:42px auto 42px;gap:8px;align-items:center}.company-link i{height:1px;background:linear-gradient(90deg,var(--blue),var(--green))}.company-link span{font-size:9px;color:var(--muted)}
.history-section{background:var(--bg)}.history-timeline{position:relative;margin-top:16px}.history-timeline::before{content:"";position:absolute;left:108px;top:0;bottom:0;width:1px;background:linear-gradient(var(--blue),var(--green));opacity:.3}.history-timeline article{display:grid;grid-template-columns:108px 1fr;gap:40px;min-height:190px;padding-bottom:40px;position:relative}.history-timeline>article>span{font-size:13px;font-weight:800;color:var(--blue);letter-spacing:.05em}.history-timeline>article>span::after{content:"";position:absolute;left:104px;top:5px;width:9px;height:9px;border-radius:50%;background:var(--surface);border:2px solid var(--blue);box-shadow:0 0 14px rgba(13,124,255,.25)}.history-timeline article.history-key>span{color:var(--green)}.history-timeline article.history-key>span::after{border-color:var(--green);box-shadow:0 0 14px rgba(8,207,147,.3)}.history-timeline small{color:var(--muted);font-size:8px;letter-spacing:.14em}.history-timeline h3{margin:7px 0 8px;font-size:30px;letter-spacing:-.04em}.history-timeline p{max-width:720px;margin:0;color:var(--muted)}
.purpose-section{background:var(--surface)}.purpose-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}.purpose-card{min-height:380px;padding:36px;border:1px solid var(--line);border-radius:28px;background:var(--bg);display:flex;flex-direction:column;justify-content:flex-end}.purpose-card>span{margin-bottom:auto;color:var(--blue);font-size:9px;letter-spacing:.15em;font-weight:800}.purpose-card h2{margin:0 0 12px;font-size:45px;letter-spacing:-.055em}.purpose-card p{max-width:520px;margin:0;color:var(--muted)}.purpose-dark{background:#07101d;color:white;border-color:#07101d}.purpose-dark>span{color:var(--green)}.purpose-dark p{color:#8ea4bd}
.principles-section{background:var(--bg)}.principles-grid{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line)}.principles-grid article{min-height:270px;padding:28px 24px;border-right:1px solid var(--line)}.principles-grid article:first-child{padding-left:0}.principles-grid article:last-child{border-right:0}.principles-grid b{color:var(--blue);font-size:9px;letter-spacing:.14em}.principles-grid h3{margin:86px 0 8px;font-size:23px;letter-spacing:-.035em}.principles-grid p{margin:0;color:var(--muted);font-size:13px}
.team-section{background:#07101d;color:white}.team-section .company-section-head>p{color:#8fa5bd}.leaders-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}.leader-card{min-height:430px;display:grid;grid-template-columns:44% 56%;border:1px solid rgba(255,255,255,.1);border-radius:28px;overflow:hidden;background:#0b1828}.leader-card img{width:100%;height:100%;object-fit:cover;filter:grayscale(1) contrast(1.05)}.leader-card>div{padding:34px;display:flex;flex-direction:column;justify-content:flex-end}.leader-card small{color:var(--green);font-size:9px;letter-spacing:.15em}.leader-card h3{margin:8px 0 5px;font-size:34px;letter-spacing:-.045em}.leader-card p{margin:0 0 24px;color:#89a0b9}.leader-card span{font-size:11px;color:#718ba6;margin-top:5px;overflow-wrap:anywhere}.company-final{background:var(--bg)}.company-final-card{display:grid;grid-template-columns:auto 1fr auto;gap:40px;align-items:center;padding:38px;border:1px solid var(--line);border-radius:28px;background:var(--surface)}.company-final-icons{display:flex;align-items:center;gap:12px}.company-final-icons img{width:58px;height:58px;object-fit:contain}.company-final-icons i{width:35px;height:1px;background:linear-gradient(90deg,var(--blue),var(--green))}.company-final-card h2{margin:0;font-size:31px;line-height:1.05;letter-spacing:-.045em}

/* Contact */
.contact-intro{min-height:calc(100svh - var(--header-height));padding:74px 0 90px;background:var(--hero-bg)}.contact-intro-grid{display:grid;grid-template-columns:.82fr 1.18fr;gap:78px;align-items:start}.contact-copy h1{margin:0;font-size:clamp(54px,6vw,84px);line-height:.92;letter-spacing:-.068em}.contact-copy h1 em{font-style:normal;color:transparent;background:linear-gradient(95deg,var(--blue),var(--green));-webkit-background-clip:text;background-clip:text}.contact-copy>p:not(.eyebrow):not(.coverage-note){max-width:590px;color:var(--muted);font-size:17px}.contact-direct{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:34px}.contact-direct article{padding:18px;border:1px solid var(--line);border-radius:16px;background:var(--surface);display:grid}.contact-direct small{color:var(--muted);font-size:8px;letter-spacing:.12em}.contact-direct strong{font-size:16px;margin:4px 0 10px}.contact-direct span{color:var(--muted);font-size:11px}.contact-whatsapp{margin-top:12px;padding:0;border:0;background:none;color:var(--blue);font-size:11px;font-weight:750;text-align:left;cursor:pointer}.coverage-note{display:flex;align-items:center;gap:8px;margin-top:20px;color:var(--muted);font-size:12px}.coverage-note i{width:6px;height:6px;border-radius:50%;background:var(--green);box-shadow:0 0 12px var(--green)}
.contact-form-shell{position:relative;min-height:675px;border:1px solid var(--line);border-radius:28px;background:var(--surface);box-shadow:var(--shadow-lg);overflow:hidden}.form-top{height:54px;padding:0 22px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;color:var(--muted);font-size:8px;letter-spacing:.13em}.contact-form{padding:28px;display:grid;gap:18px;transition:opacity .25s ease}.field-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.contact-form label{display:grid;gap:7px}.contact-form label>span{color:var(--muted);font-size:10px;font-weight:700}.contact-form input,.contact-form select,.contact-form textarea{width:100%;border:1px solid var(--line);border-radius:12px;background:var(--bg);color:var(--text);padding:13px 14px;outline:none;transition:border .2s ease,box-shadow .2s ease}.contact-form textarea{resize:vertical;min-height:120px}.contact-form input:focus,.contact-form select:focus,.contact-form textarea:focus{border-color:color-mix(in srgb,var(--blue) 54%,var(--line));box-shadow:0 0 0 3px color-mix(in srgb,var(--blue) 8%,transparent)}.contact-form .is-invalid{border-color:#df5560;box-shadow:0 0 0 3px rgba(223,85,96,.08)}.privacy-check{display:grid!important;grid-template-columns:18px 1fr!important;align-items:start;gap:9px!important}.privacy-check input{width:16px;height:16px;margin:2px 0 0;padding:0}.privacy-check span{font-weight:400!important;line-height:1.45}.privacy-check a{color:var(--blue);text-decoration:underline;text-underline-offset:2px}.form-submit{justify-self:start}.form-copy-note{margin:-5px 0 0;color:var(--muted);font-size:10px}.form-honeypot{position:absolute!important;left:-10000px!important;width:1px!important;height:1px!important;opacity:0!important}.form-transmission,.form-success{position:absolute;inset:54px 0 0;display:grid;place-items:center;text-align:center;padding:40px;opacity:0;pointer-events:none;transition:opacity .3s ease;background:var(--surface)}.contact-form-shell.is-sending .contact-form{opacity:0;pointer-events:none}.contact-form-shell.is-sending .form-transmission{opacity:1}.contact-form-shell.is-success .contact-form,.contact-form-shell.is-success .form-transmission{opacity:0;pointer-events:none}.contact-form-shell.is-success .form-success{opacity:1;pointer-events:auto}.transmission-grid{position:absolute;inset:0;background-image:linear-gradient(var(--line) 1px,transparent 1px),linear-gradient(90deg,var(--line) 1px,transparent 1px);background-size:27px 27px;mask-image:radial-gradient(circle,#000,transparent 70%)}.transmission-core{position:relative;width:200px;height:200px;border-radius:50%;border:1px solid var(--line-strong);display:flex;flex-direction:column;align-items:center;justify-content:center;box-shadow:inset 0 0 0 34px color-mix(in srgb,var(--blue) 3%,transparent)}.transmission-core span{width:9px;height:9px;border-radius:50%;background:var(--green);box-shadow:0 0 20px var(--green);animation:transPulse 1.2s ease-in-out infinite}.transmission-core strong{margin-top:17px;font-size:12px;letter-spacing:.13em}.transmission-core small{margin-top:5px;color:var(--muted);font-size:8px}.transmission-line{position:absolute;height:1px;width:220px;background:linear-gradient(90deg,transparent,var(--blue),var(--green),transparent);animation:transLine 1.7s linear infinite}.l1{rotate:0deg}.l2{rotate:60deg}.l3{rotate:120deg}@keyframes transPulse{50%{transform:scale(1.5);box-shadow:0 0 32px var(--green)}}@keyframes transLine{0%{opacity:.1;transform:scaleX(.3)}50%{opacity:1;transform:scaleX(1)}100%{opacity:.1;transform:scaleX(.3)}}.form-success{align-content:center}.success-orbit{width:110px;height:110px;margin:0 auto 22px;border-radius:50%;border:1px solid color-mix(in srgb,var(--green) 35%,var(--line));display:grid;place-items:center;box-shadow:0 0 0 18px color-mix(in srgb,var(--green) 5%,transparent),0 0 0 36px color-mix(in srgb,var(--green) 2%,transparent)}.success-orbit span{width:46px;height:46px;border-radius:50%;display:grid;place-items:center;background:var(--green);color:#07101d;font-weight:900;font-size:23px}.form-success>small{color:var(--green);letter-spacing:.14em;font-size:9px}.form-success h2{margin:10px 0 8px;font-size:35px;letter-spacing:-.045em}.form-success p{max-width:430px;margin:0 auto 22px;color:var(--muted)}

/* Legal + 404 */
.legal-page{background:var(--bg);min-height:70svh}.legal-wrap{max-width:860px}.legal-wrap h1{margin:0;font-size:clamp(48px,6vw,72px);letter-spacing:-.06em}.legal-updated{color:var(--muted);font-size:12px;margin:10px 0 48px}.legal-content{padding:36px;border:1px solid var(--line);border-radius:24px;background:var(--surface);margin-bottom:28px}.legal-content h2{margin:30px 0 8px;font-size:20px}.legal-content h2:first-child{margin-top:0}.legal-content p{color:var(--muted)}
.notfound-main{min-height:calc(100svh - var(--header-height));display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;position:relative;overflow:hidden;padding:60px 24px;background:var(--hero-bg)}.notfound-grid{position:absolute;inset:0;background-image:linear-gradient(var(--line) 1px,transparent 1px),linear-gradient(90deg,var(--line) 1px,transparent 1px);background-size:32px 32px;mask-image:radial-gradient(circle,#000,transparent 62%)}.notfound-code{position:absolute;font-size:min(36vw,420px);font-weight:900;letter-spacing:-.09em;color:color-mix(in srgb,var(--text) 3%,transparent);line-height:1}.notfound-icon{width:118px;position:relative;z-index:2;margin-bottom:24px;filter:drop-shadow(0 20px 35px rgba(13,124,255,.18))}.notfound-main .eyebrow,.notfound-main h1,.notfound-main>p,.notfound-main>div:last-child{position:relative;z-index:2}.notfound-main h1{margin:0;font-size:clamp(44px,6vw,72px);letter-spacing:-.06em}.notfound-main>p{color:var(--muted);max-width:550px}.notfound-main>div:last-child{display:flex;gap:10px;margin-top:18px}

@media (max-width: 980px){
  .inner-intro-grid,.contact-intro-grid,.company-intro-grid{grid-template-columns:1fr;gap:46px}.inner-intro-grid{grid-template-columns:1fr}.infra-map,.cctv-view,.ops-console{min-height:430px}.service-head,.company-section-head{grid-template-columns:1fr;gap:20px}.infra-process-grid,.cctv-maintenance-grid,.support-rhythm-grid{grid-template-columns:1fr;gap:50px}.cctv-module-grid{grid-template-columns:1fr}.it-scope-grid{grid-template-columns:1fr 1fr}.it-scope-main{grid-column:1/-1;grid-row:auto;min-height:430px}.purpose-grid,.leaders-grid{grid-template-columns:1fr}.principles-grid{grid-template-columns:repeat(2,1fr)}.principles-grid article:nth-child(2){border-right:0}.principles-grid article:nth-child(n+3){border-top:1px solid var(--line)}.company-final-card{grid-template-columns:auto 1fr}.company-final-card>a{grid-column:2;justify-self:start}.coverage-board{grid-template-columns:1fr}.coverage-plan{border-right:0;border-bottom:1px solid var(--line)}.service-final-card{grid-template-columns:1fr;gap:30px}.service-final-card>div:last-child{justify-content:flex-start}.contact-direct{max-width:620px}
}
@media (max-width:720px){
  .inner-intro,.company-intro,.contact-intro{padding:52px 0 68px}.inner-intro-copy h1,.company-copy h1,.contact-copy h1{font-size:clamp(45px,13vw,64px)}.inner-actions{flex-direction:column;align-items:stretch}.inner-actions .button{width:100%}.inner-actions .text-link{justify-content:center}.infra-map,.cctv-view,.ops-console{min-height:390px;border-radius:22px}.infra-floor{inset:48px 18px 50px}.infra-rack{width:76px;height:104px}.infra-ap{width:38px;height:38px}.infra-lines{display:none}.infra-needs-grid{grid-template-columns:1fr}.infra-need{min-height:300px}.infra-need h3{margin-top:82px}.infra-process-list li{grid-template-columns:44px 1fr}.space-strip{display:grid;grid-template-columns:1fr;gap:0}.space-strip span{padding:16px 0;border-bottom:1px solid var(--line)}.space-strip i{display:none}.service-final-card{padding:32px 24px;border-radius:24px}.service-final-card>div:last-child{flex-direction:column}.service-final-card .button{width:100%}.cctv-screen{inset:14px 14px 46px}.camera-fov{width:300px;height:230px}.tracking-box.t1{left:8%;width:95px}.tracking-box.t2{right:8%;width:80px}.cctv-hud{gap:9px;flex-wrap:wrap}.coverage-plan{min-height:400px}.coverage-notes{padding:26px}.cctv-module{min-height:330px}.cctv-maintenance-grid{gap:34px}.maintenance-pulse{display:grid;grid-template-columns:1fr 1fr}.maintenance-pulse i{display:none}.ops-score{left:50%;top:78px;translate:-50% 0}.score-ring{width:140px;height:140px}.ops-stream{left:20px;right:20px;top:245px;width:auto}.ops-pulse{display:none}.it-scope-grid{grid-template-columns:1fr}.it-scope-main{min-height:470px}.it-scope-main h3{margin-top:110px}.ticket-flow{display:grid;grid-template-columns:1fr}.ticket-flow i{display:none}.support-modes article.active{transform:none}.incident-line{display:grid;grid-template-columns:1fr}.incident-line i{height:24px;width:1px;margin-left:12px}.company-brand-system{min-height:300px}.company-im,.company-st{width:116px;height:145px;border-radius:22px}.company-im img,.company-st img{width:72px}.company-link{grid-template-columns:20px auto 20px}.history-timeline::before{left:68px}.history-timeline article{grid-template-columns:68px 1fr;gap:22px;min-height:220px}.history-timeline>article>span::after{left:64px}.purpose-card{min-height:330px;padding:28px}.purpose-card h2{font-size:39px}.principles-grid{grid-template-columns:1fr}.principles-grid article{border-right:0!important;border-top:1px solid var(--line);padding:26px 0;min-height:210px}.principles-grid article:first-child{border-top:0}.principles-grid h3{margin-top:60px}.leader-card{grid-template-columns:1fr;min-height:0}.leader-card img{height:320px}.leader-card>div{padding:26px}.company-final-card{grid-template-columns:1fr;gap:24px}.company-final-card>a{grid-column:1;width:100%}.contact-intro-grid{gap:38px}.contact-direct{grid-template-columns:1fr}.contact-form-shell{min-height:720px;border-radius:22px}.field-grid{grid-template-columns:1fr}.contact-form{padding:22px}.form-submit{width:100%}.form-transmission,.form-success{padding:26px}.legal-content{padding:24px}.notfound-main>div:last-child{flex-direction:column;width:100%;max-width:360px}.notfound-main .button{width:100%}
}

/* ==========================================================
   HOME 2.0 — editorial / premium reformulation
   ========================================================== */

.home2-page .site-header {
  background: transparent;
  border-bottom: 0;
  padding-top: 16px;
  pointer-events: none;
}
.home2-page .header-inner {
  height: 64px;
  padding: 0 14px 0 18px;
  border: 1px solid color-mix(in srgb,var(--line-strong) 86%, transparent);
  border-radius: 20px;
  background: color-mix(in srgb,var(--hero-bg) 78%, transparent);
  backdrop-filter: blur(18px) saturate(1.15);
  box-shadow: 0 14px 44px rgba(5,20,38,.08);
  pointer-events: auto;
}
.home2-page .site-header.is-scrolled .header-inner {
  background: color-mix(in srgb,var(--surface) 90%, transparent);
  box-shadow: 0 18px 44px rgba(5,20,38,.13);
}
.home2-page .site-header.is-scrolled { box-shadow: none; border-bottom: 0; }
.home2-page .mobile-menu { pointer-events: auto; }
.home2-page .hero { padding-top: 72px; }

.home2-nav { gap: clamp(14px,1.5vw,24px); }
.nav-dropdown { position: relative; display: inline-flex; align-items: center; }
.nav-dropdown > button {
  appearance: none;
  border: 0;
  background: transparent;
  padding: 0;
  color: var(--muted);
  font-size: 14px;
  font-weight: 650;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 5px;
}
.nav-dropdown > button > span { font-size: 13px; transition: transform .2s ease; }
.nav-dropdown:hover > button,
.nav-dropdown:focus-within > button { color: var(--text); }
.nav-dropdown:hover > button > span,
.nav-dropdown:focus-within > button > span { transform: rotate(180deg); }
.nav-dropdown-menu {
  position: absolute;
  top: calc(100% + 18px);
  left: 50%;
  translate: -50% -8px;
  width: 250px;
  padding: 8px;
  border: 1px solid var(--line-strong);
  border-radius: 16px;
  background: color-mix(in srgb,var(--surface) 94%, transparent);
  backdrop-filter: blur(18px);
  box-shadow: 0 22px 60px rgba(4,20,42,.18);
  opacity: 0;
  pointer-events: none;
  transition: opacity .2s ease, translate .2s var(--ease);
}
.nav-dropdown:hover .nav-dropdown-menu,
.nav-dropdown:focus-within .nav-dropdown-menu { opacity: 1; pointer-events: auto; translate: -50% 0; }
.nav-dropdown-menu a {
  display: grid;
  grid-template-columns: 30px 1fr;
  align-items: center;
  gap: 6px;
  padding: 12px;
  border-radius: 11px;
}
.nav-dropdown-menu a::after { display: none; }
.nav-dropdown-menu a:hover { background: var(--surface-2); }
.nav-dropdown-menu small { color: var(--blue); font-size: 9px; letter-spacing: .12em; }
.nav-dropdown-menu span { color: var(--text); font-size: 13px; font-weight: 720; }

.home2-services { padding: 124px 0 0; background: var(--bg); }
.home2-intro {
  display: grid;
  grid-template-columns: minmax(0,1.35fr) minmax(280px,.65fr);
  gap: 90px;
  align-items: end;
  margin-bottom: 52px;
}
.home2-intro h2,
.home2-cyber h2,
.home2-consulting h2,
.home2-why h2,
.home2-process h2,
.home2-faq h2,
.home2-cta h2 {
  margin: 0;
  font-size: clamp(38px,4.8vw,68px);
  line-height: .98;
  letter-spacing: -.058em;
}
.home2-intro > p { margin: 0 0 4px; color: var(--muted); font-size: 16px; }
.home2-kicker {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: color-mix(in srgb,var(--blue) 88%, white);
  text-transform: uppercase;
  font-size: 10px;
  letter-spacing: .14em;
  font-weight: 820;
}
.home2-inline-link {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  margin-top: 28px;
  font-weight: 760;
  font-size: 14px;
}
.home2-inline-link b { color: var(--blue); font-weight: 600; transition: transform .2s ease; }
.home2-inline-link:hover b { transform: translate(3px,-3px); }

.home2-software {
  min-height: 610px;
  padding: 64px;
  position: relative;
  overflow: hidden;
  display: grid;
  grid-template-columns: .9fr 1.1fr;
  gap: 60px;
  align-items: center;
  border-radius: 34px;
  color: #edf6ff;
  background:
    radial-gradient(circle at 80% 20%,rgba(8,207,147,.13),transparent 26%),
    radial-gradient(circle at 60% 70%,rgba(13,124,255,.18),transparent 30%),
    linear-gradient(135deg,#07101d 0%,#0a1628 52%,#071523 100%);
  box-shadow: 0 36px 110px rgba(7,16,29,.18);
}
.home2-software::before {
  content:"";
  position:absolute;
  inset:0;
  opacity:.18;
  background-image:
    linear-gradient(rgba(255,255,255,.055) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.055) 1px,transparent 1px);
  background-size:34px 34px;
  -webkit-mask-image:linear-gradient(90deg,transparent 0%,#000 45%,#000 100%);
  mask-image:linear-gradient(90deg,transparent 0%,#000 45%,#000 100%);
}
.home2-software-copy,
.home2-software-visual { position:relative; z-index:2; }
.home2-software-copy h3 {
  margin:16px 0 18px;
  font-size:clamp(42px,4.5vw,66px);
  line-height:.98;
  letter-spacing:-.058em;
  max-width:620px;
}
.home2-software-copy > p { color:#9eb0c6; max-width:560px; font-size:17px; }
.home2-floating-tags { display:flex; flex-wrap:wrap; gap:8px; margin-top:26px; }
.home2-floating-tags span {
  padding:8px 11px;
  border:1px solid rgba(220,238,255,.12);
  border-radius:999px;
  color:#afc1d6;
  background:rgba(255,255,255,.035);
  font-size:10px;
  backdrop-filter:blur(8px);
}
.home2-software .home2-inline-link { color:white; }

.home2-software-visual { min-height:440px; perspective:1200px; }
.home2-ui-window {
  position:absolute;
  border:1px solid rgba(215,235,255,.13);
  background:linear-gradient(145deg,rgba(18,37,60,.94),rgba(7,16,29,.94));
  box-shadow:0 28px 80px rgba(0,0,0,.32);
}
.window-main {
  width:82%;
  height:330px;
  right:2%;
  top:48px;
  border-radius:24px;
  overflow:hidden;
  transform:rotateY(-4deg) rotateX(2deg);
}
.ui-top { height:46px; padding:0 16px; display:flex; align-items:center; gap:7px; border-bottom:1px solid rgba(215,235,255,.08); }
.ui-top i { width:7px; height:7px; border-radius:50%; background:#27425f; }
.ui-top i:first-child{background:#0d7cff}.ui-top i:nth-child(2){background:#08cf93}
.ui-top span { margin-left:auto; color:#69809b; font-size:9px; font-family:ui-monospace,monospace; }
.ui-layout { height:calc(100% - 46px); display:grid; grid-template-columns:54px 1fr; }
.ui-sidebar { padding:18px 13px; border-right:1px solid rgba(215,235,255,.08); display:grid; align-content:start; gap:13px; }
.ui-sidebar b { width:28px; height:7px; border-radius:4px; background:#1a314b; }
.ui-sidebar b:nth-child(2){background:#0d7cff66}.ui-sidebar b:nth-child(4){background:#08cf9344}
.ui-canvas { padding:28px; position:relative; }
.ui-line { height:8px; border-radius:5px; background:#213954; margin-bottom:10px; }
.ui-line.w72{width:72%}.ui-line.w48{width:48%}
.ui-cards { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-top:30px; }
.ui-cards span { height:74px; border:1px solid rgba(215,235,255,.09); border-radius:13px; background:rgba(255,255,255,.025); }
.ui-cards span:nth-child(2){box-shadow:inset 0 -3px 0 #0d7cff}.ui-cards span:nth-child(3){box-shadow:inset 0 -3px 0 #08cf93}
.ui-chart { position:absolute; left:28px; right:28px; bottom:26px; height:72px; display:flex; align-items:end; gap:9px; }
.ui-chart i { flex:1; border-radius:7px 7px 2px 2px; background:linear-gradient(#0d7cff,#0d7cff33); }
.ui-chart i:nth-child(1){height:30%}.ui-chart i:nth-child(2){height:54%}.ui-chart i:nth-child(3){height:42%}.ui-chart i:nth-child(4){height:78%;background:linear-gradient(#08cf93,#08cf9333)}.ui-chart i:nth-child(5){height:62%}
.window-mobile {
  width:112px;
  height:210px;
  left:2%;
  bottom:14px;
  border-radius:26px;
  padding:18px 14px;
  display:grid;
  gap:12px;
  align-content:start;
  transform:rotate(-4deg);
}
.window-mobile span { width:42px; height:5px; border-radius:3px; background:#2a4765; justify-self:center; }
.window-mobile i { height:34px; border-radius:10px; background:#142943; border:1px solid rgba(215,235,255,.08); }
.window-mobile i:nth-child(3){background:linear-gradient(90deg,#0d7cff33,#08cf9333)}
.home2-data-pill { position:absolute; z-index:4; padding:8px 11px; border-radius:999px; border:1px solid rgba(215,235,255,.15); background:rgba(10,25,43,.88); color:#8da5c0; font-size:8px; letter-spacing:.12em; box-shadow:0 10px 30px rgba(0,0,0,.2); animation:home2Float 4.6s ease-in-out infinite; }
.pill-a{right:8%;top:10px}.pill-b{right:0;bottom:25px;animation-delay:-1.3s}.pill-c{left:20%;top:0;animation-delay:-2.1s}
@keyframes home2Float{50%{transform:translateY(-7px)}}
.home2-data-line { position:absolute; height:1px; transform-origin:left center; background:linear-gradient(90deg,#0d7cff88,#08cf9388,transparent); opacity:.48; }
.line-a{width:190px;left:18%;top:28%;rotate:19deg}.line-b{width:150px;right:9%;bottom:20%;rotate:-28deg}

.home2-split-services { padding:22px 0 120px; display:grid; grid-template-columns:1.08fr .92fr; gap:22px; }
.home2-editorial {
  min-height:520px;
  position:relative;
  overflow:hidden;
  padding:48px;
  border-top:1px solid var(--line-strong);
  border-bottom:1px solid var(--line-strong);
  background:var(--surface);
}
.home2-infra { border-radius:28px 0 0 28px; }
.home2-cctv { border-radius:0 28px 28px 0; background:color-mix(in srgb,var(--surface) 95%,var(--blue) 5%); }
.home2-editorial-copy { position:relative; z-index:3; max-width:560px; }
.home2-editorial h3 { margin:14px 0 14px; font-size:clamp(34px,3vw,48px); line-height:1; letter-spacing:-.05em; }
.home2-editorial p { color:var(--muted); max-width:500px; }
.home2-editorial a { display:inline-flex; gap:8px; margin-top:20px; font-size:13px; font-weight:760; }
.home2-editorial a b { color:var(--blue); }
.home2-network-map { position:absolute; right:-30px; bottom:-30px; width:58%; aspect-ratio:1.2; opacity:.9; }
.network-core,.network-node { position:absolute; border:1px solid color-mix(in srgb,var(--blue) 28%,var(--line)); border-radius:12px; padding:8px 10px; color:var(--muted); background:color-mix(in srgb,var(--surface) 86%,transparent); font-size:9px; letter-spacing:.12em; }
.network-core { left:37%; top:38%; color:var(--text); font-weight:800; border-color:color-mix(in srgb,var(--green) 42%,var(--line)); box-shadow:0 0 0 12px color-mix(in srgb,var(--green) 5%,transparent); }
.nn1{left:5%;top:8%}.nn2{right:6%;top:16%}.nn3{right:10%;bottom:10%}
.network-line{position:absolute;height:1px;background:linear-gradient(90deg,var(--blue),var(--green));transform-origin:left center;opacity:.4}.n1{width:165px;left:17%;top:23%;rotate:27deg}.n2{width:145px;left:48%;top:39%;rotate:-36deg}.n3{width:160px;left:47%;top:45%;rotate:34deg}
.home2-camera-visual { height:220px; margin:-48px -48px 30px; position:relative; overflow:hidden; background:linear-gradient(145deg,#0b1727,#0a2030); border-bottom:1px solid rgba(220,238,255,.09); }
.camera-frame{position:absolute;inset:32px 54px;border:1px solid rgba(13,124,255,.34);border-radius:16px}.camera-frame::before,.camera-frame::after{content:"";position:absolute;width:26px;height:26px;border-color:#08cf93;border-style:solid;opacity:.6}.camera-frame::before{left:-1px;top:-1px;border-width:1px 0 0 1px}.camera-frame::after{right:-1px;bottom:-1px;border-width:0 1px 1px 0}
.camera-scan{position:absolute;left:54px;right:54px;top:50%;height:1px;background:linear-gradient(90deg,transparent,#08cf93,#0d7cff,transparent);box-shadow:0 0 12px rgba(8,207,147,.4);animation:cameraScan 4.8s ease-in-out infinite}@keyframes cameraScan{0%,100%{transform:translateY(-64px);opacity:.2}50%{transform:translateY(64px);opacity:1}}
.camera-dot{position:absolute;width:7px;height:7px;border-radius:50%;background:#08cf93;box-shadow:0 0 14px #08cf93}.d1{left:26%;top:34%}.d2{right:24%;top:46%;background:#0d7cff;box-shadow:0 0 14px #0d7cff}.d3{left:48%;bottom:23%}.home2-camera-visual small{position:absolute;left:22px;bottom:18px;color:#6e88a6;font-size:8px;letter-spacing:.14em}

.home2-cyber { padding:126px 0; color:#edf6ff; background:radial-gradient(circle at 90% 15%,rgba(8,207,147,.10),transparent 28%),radial-gradient(circle at 0 60%,rgba(13,124,255,.12),transparent 30%),linear-gradient(120deg,#0b0d22,#06141d); }
.home2-cyber-grid { display:grid; grid-template-columns:.78fr 1.22fr; gap:84px; align-items:center; }
.home2-cyber-copy > p:not(.eyebrow) { color:#92a3ba; font-size:17px; max-width:520px; }
.home2-cyber-points { display:grid; grid-template-columns:1fr 1fr; gap:10px; margin:28px 0 30px; }
.home2-cyber-points span { position:relative; padding:13px 14px 13px 32px; border-top:1px solid rgba(214,232,255,.10); color:#b1c2d5; font-size:12px; }
.home2-cyber-points span::before { content:""; position:absolute; left:12px; top:18px; width:6px; height:6px; border-radius:50%; background:#08cf93; box-shadow:0 0 12px rgba(8,207,147,.5); }
.home2-threat-panel { min-height:480px; border:1px solid rgba(214,232,255,.12); border-radius:28px; background:rgba(7,16,29,.70); box-shadow:0 35px 100px rgba(0,0,0,.34); overflow:hidden; }
.threat-head { height:56px; padding:0 20px; display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid rgba(214,232,255,.08); color:#6e8198; font:10px ui-monospace,monospace; }
.threat-head b { color:#91a5bd; font-weight:600; letter-spacing:.1em; }.threat-head b i{display:inline-block;width:6px;height:6px;border-radius:50%;background:#08cf93;box-shadow:0 0 12px #08cf93;margin-right:7px}
.threat-grid { min-height:350px; position:relative; background-image:linear-gradient(rgba(126,158,193,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(126,158,193,.045) 1px,transparent 1px); background-size:30px 30px; }
.threat-shield { position:absolute; left:50%; top:50%; translate:-50% -50%; width:116px; height:136px; display:grid; place-items:center; color:#07101d; font-size:34px; font-weight:900; background:linear-gradient(145deg,#08cf93,#0d7cff); clip-path:polygon(50% 0,92% 17%,88% 64%,70% 86%,50% 100%,30% 86%,12% 64%,8% 17%); box-shadow:0 0 50px rgba(8,207,147,.18); }
.threat-node { position:absolute; min-width:84px; padding:8px 10px; border:1px solid rgba(214,232,255,.12); border-radius:10px; background:#0b1929; color:#8ba0b8; font:8px ui-monospace,monospace; text-align:center; letter-spacing:.12em; }.tn1{left:8%;top:20%}.tn2{right:8%;top:20%}.tn3{left:9%;bottom:18%}.tn4{right:7%;bottom:18%}
.threat-path{position:absolute;height:1px;background:linear-gradient(90deg,#0d7cff,#08cf93);opacity:.42;transform-origin:left center}.tp1{width:34%;left:18%;top:29%;rotate:24deg}.tp2{width:32%;left:50%;top:50%;rotate:-29deg}.tp3{width:35%;left:18%;bottom:27%;rotate:-26deg}.tp4{width:33%;left:50%;top:51%;rotate:29deg}
.pulse-dot{position:absolute;width:6px;height:6px;border-radius:50%;background:#08cf93;box-shadow:0 0 14px #08cf93;animation:signalBlink 3.6s ease-in-out infinite}.pd1{left:33%;top:36%}.pd2{right:30%;top:38%;animation-delay:-1.1s}.pd3{right:34%;bottom:30%;animation-delay:-2.1s}
.threat-status { min-height:72px; padding:0 20px; display:grid; grid-template-columns:repeat(3,1fr); align-items:center; border-top:1px solid rgba(214,232,255,.08); }
.threat-status span { color:#758ba4; font-size:10px; display:flex; align-items:center; gap:8px; }.threat-status i{width:6px;height:6px;border-radius:50%;background:#0d7cff}.threat-status span:nth-child(2) i{background:#08cf93}

.home2-consulting { background:var(--surface-2); }
.home2-consulting-grid { display:grid; grid-template-columns:.85fr 1.15fr; gap:90px; align-items:center; }
.home2-consulting-copy > p:not(.eyebrow) { color:var(--muted); font-size:17px; max-width:540px; }
.home2-roadmap { display:grid; grid-template-columns:1fr 72px 1fr 72px 1fr; align-items:center; }
.home2-roadmap > div { min-height:245px; padding:26px 22px; border-top:2px solid var(--line-strong); position:relative; }
.home2-roadmap > div::before { content:""; position:absolute; left:0; top:-5px; width:8px; height:8px; border-radius:50%; background:var(--blue); box-shadow:0 0 14px color-mix(in srgb,var(--blue) 56%,transparent); }
.home2-roadmap > div:nth-of-type(2)::before { background:var(--green); }
.home2-roadmap > div:nth-of-type(3)::before { background:color-mix(in srgb,var(--blue) 50%,var(--green)); }
.home2-roadmap span { color:var(--blue); font-size:10px; letter-spacing:.14em; font-weight:800; }
.home2-roadmap strong { display:block; margin-top:54px; font-size:21px; letter-spacing:-.03em; }
.home2-roadmap p { color:var(--muted); font-size:13px; }
.home2-roadmap > i { height:1px; background:linear-gradient(90deg,var(--blue),var(--green)); opacity:.4; }

.home2-why { padding:120px 0; color:#edf6ff; background:#07101d; overflow:hidden; }
.home2-why-grid { display:grid; grid-template-columns:.82fr 1.18fr; gap:84px; align-items:center; }
.home2-juan { min-height:620px; position:relative; overflow:hidden; border-radius:36px; background:radial-gradient(circle at 30% 24%,rgba(13,124,255,.22),transparent 26%),linear-gradient(145deg,#0b1929,#07101d); }
.home2-juan::after { content:""; position:absolute; inset:0; background-image:linear-gradient(rgba(126,158,193,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(126,158,193,.045) 1px,transparent 1px); background-size:30px 30px; -webkit-mask-image:linear-gradient(180deg,#000,transparent 72%); mask-image:linear-gradient(180deg,#000,transparent 72%); }
.home2-juan img { position:absolute; z-index:3; left:50%; bottom:0; translate:-50% 0; width:min(78%,390px); height:auto; filter:grayscale(1) contrast(1.08); mix-blend-mode:screen; opacity:.95; }
.home2-juan-shape { position:absolute; z-index:1; border-radius:42px; }
.shape-a { width:72%; height:42%; left:-8%; top:8%; rotate:-9deg; background:linear-gradient(135deg,#0d7cff,#08cf93); opacity:.9; }
.shape-b { width:54%; height:32%; right:-16%; bottom:18%; border:1px solid rgba(215,235,255,.18); rotate:12deg; }
.home2-juan-label { position:absolute; z-index:5; left:26px; bottom:26px; display:grid; padding:12px 14px; border:1px solid rgba(215,235,255,.12); border-radius:14px; background:rgba(7,16,29,.78); backdrop-filter:blur(10px); }
.home2-juan-label span { font-weight:800; font-size:13px; }.home2-juan-label small{color:#7d94af;font-size:9px;letter-spacing:.1em;text-transform:uppercase}
.home2-why-copy > p:not(.eyebrow) { color:#91a6be; font-size:17px; max-width:660px; }
.home2-why-list { margin-top:36px; display:grid; grid-template-columns:1fr 1fr; gap:0 28px; }
.home2-why-list > div { min-height:145px; padding:22px 0; border-top:1px solid rgba(215,235,255,.1); display:grid; grid-template-columns:38px 1fr; column-gap:12px; }
.home2-why-list span { color:#08cf93; font-size:9px; letter-spacing:.14em; padding-top:4px; }
.home2-why-list strong { font-size:19px; letter-spacing:-.025em; }
.home2-why-list p { grid-column:2; margin:7px 0 0; color:#758ba4; font-size:12px; }

.home2-process { background:var(--bg); }
.home2-process-head { max-width:780px; }
.home2-process-line { list-style:none; margin:62px 0 0; padding:0; display:grid; grid-template-columns:repeat(4,1fr); position:relative; }
.home2-process-line::before { content:""; position:absolute; left:0; right:0; top:24px; height:1px; background:linear-gradient(90deg,var(--blue),color-mix(in srgb,var(--blue) 50%,var(--green)),var(--green)); opacity:.36; }
.home2-process-line li { position:relative; padding:0 28px 0 0; }
.home2-process-line span { position:relative; z-index:2; display:grid; place-items:center; width:48px; height:48px; border-radius:999px; border:1px solid var(--line-strong); background:var(--bg); color:var(--blue); font-size:10px; font-weight:800; }
.home2-process-line strong { display:block; margin-top:36px; font-size:21px; letter-spacing:-.03em; }
.home2-process-line p { color:var(--muted); font-size:13px; max-width:200px; }

.home2-faq { background:var(--surface-2); }
.home2-faq-grid { display:grid; grid-template-columns:.72fr 1.28fr; gap:90px; align-items:center; }
.home2-faq-visual { min-height:590px; position:relative; overflow:hidden; border-radius:34px; color:#edf6ff; background:linear-gradient(145deg,#07101d,#0b1a2b); box-shadow:0 28px 90px rgba(5,20,40,.16); }
.faq-symbol { position:absolute; left:50%; top:50%; translate:-50% -50%; width:170px; height:170px; display:grid; place-items:center; border-radius:50%; border:1px solid rgba(215,235,255,.13); box-shadow:inset 0 0 60px rgba(13,124,255,.08); z-index:3; }
.faq-symbol img{width:110px}.faq-ring{position:absolute;left:50%;top:50%;translate:-50% -50%;border:1px solid rgba(215,235,255,.08);border-radius:50%}.r1{width:270px;height:270px}.r2{width:390px;height:390px;border-style:dashed}.r3{width:510px;height:510px;opacity:.55}.faq-signal{position:absolute;width:8px;height:8px;border-radius:50%;background:#08cf93;box-shadow:0 0 18px #08cf93}.s1{left:23%;top:28%}.s2{right:20%;top:40%;background:#0d7cff;box-shadow:0 0 18px #0d7cff}.s3{left:34%;bottom:18%}.home2-faq-visual small{position:absolute;left:26px;bottom:24px;color:#617994;font-size:8px;letter-spacing:.16em}
.home2-faq-copy h2 { font-size:clamp(38px,4vw,58px); margin-bottom:28px; }
.home2-accordion { display:grid; gap:10px; }
.home2-accordion details { border-bottom:1px solid var(--line-strong); background:var(--surface); }
.home2-accordion summary { list-style:none; cursor:pointer; padding:20px 44px 20px 2px; position:relative; font-weight:760; font-size:16px; }
.home2-accordion summary::-webkit-details-marker{display:none}.home2-accordion summary::after{content:"+";position:absolute;right:4px;top:16px;color:var(--blue);font-size:24px;font-weight:350}.home2-accordion details[open] summary::after{content:"−"}.home2-accordion details p{margin:0;padding:0 44px 22px 2px;color:var(--muted);font-size:14px;max-width:720px}

.home2-cta { background:var(--bg); }
.home2-cta-box { min-height:420px; padding:62px; border-radius:34px; overflow:hidden; position:relative; display:grid; grid-template-columns:1.1fr .9fr; align-items:center; color:#edf6ff; background:linear-gradient(115deg,#07101d 0%,#0a1f35 45%,#064a4a 100%); box-shadow:0 34px 100px rgba(7,16,29,.2); }
.home2-cta-box::before { content:"";position:absolute;inset:0;opacity:.20;background-image:linear-gradient(rgba(255,255,255,.055) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.055) 1px,transparent 1px);background-size:34px 34px;-webkit-mask-image:linear-gradient(90deg,transparent,#000);mask-image:linear-gradient(90deg,transparent,#000)}
.home2-cta-copy,.home2-cta-art{position:relative;z-index:2}.home2-cta-copy>p:not(.eyebrow){color:#9db0c6;max-width:590px;font-size:16px}.home2-cta-copy>div{display:flex;gap:10px;flex-wrap:wrap;margin-top:28px}
.home2-cta-art { min-height:300px; display:grid; place-items:center; }
.home2-cta-art img { width:170px; position:relative; z-index:4; filter:drop-shadow(0 20px 35px rgba(0,0,0,.18)); }.cta-orbit{position:absolute;border:1px solid rgba(215,235,255,.12);border-radius:50%}.co1{width:260px;height:260px}.co2{width:360px;height:360px;border-style:dashed;opacity:.65}.cta-ray{position:absolute;width:130px;height:1px;background:linear-gradient(90deg,#0d7cff,#08cf93);opacity:.5;transform-origin:left center}.cr1{left:10%;top:30%;rotate:18deg}.cr2{right:16%;top:38%;rotate:145deg}.cr3{right:22%;bottom:22%;rotate:-145deg}

.home2-footer { padding-top:78px; }
.home2-footer-main { display:grid; grid-template-columns:.8fr 1.2fr; gap:100px; }
.home2-footer-brand p { color:#7f93aa; margin:28px 0 7px; max-width:360px; font-size:13px; }
.home2-footer-brand small { color:#536b84; }.home2-footer-brand small a{color:#8ea4bc}.home2-footer-brand small a:hover{color:white}
.home2-footer-nav { display:grid; grid-template-columns:1.1fr .75fr 1.15fr; gap:42px; }
.home2-footer-nav>div{display:grid;align-content:start;gap:10px}.home2-footer-nav strong{color:#f0f6ff;font-size:10px;text-transform:uppercase;letter-spacing:.15em;margin-bottom:8px}.home2-footer-nav a,.home2-footer-nav span{color:#70869e;font-size:12px}.home2-footer-nav a:hover{color:white}
.home2-footer-bottom { margin-top:60px; padding-top:20px; border-top:1px solid rgba(255,255,255,.08); display:flex; justify-content:space-between; color:#50647b; font-size:10px; }

@media (max-width: 1100px) {
  .home2-nav { gap:14px; }
  .home2-nav a,.nav-dropdown>button{font-size:12.5px}
  .home2-software{grid-template-columns:1fr;gap:24px}.home2-software-visual{min-height:390px}.home2-split-services{grid-template-columns:1fr}.home2-infra,.home2-cctv{border-radius:28px}.home2-cyber-grid,.home2-consulting-grid,.home2-why-grid,.home2-faq-grid{grid-template-columns:1fr;gap:54px}.home2-cyber-copy{max-width:720px}.home2-roadmap{max-width:850px}.home2-juan{min-height:540px;max-width:720px}.home2-faq-visual{min-height:460px;max-width:720px}.home2-footer-main{grid-template-columns:1fr;gap:50px}
}

@media (max-width: 980px) {
  .home2-page .site-header { padding-top:10px; }
  .home2-page .header-inner { height:58px; border-radius:17px; }
  .home2-page .mobile-menu { top:0; inset:0; padding-top:calc(var(--header-height) + 6px); background:var(--hero-bg); }
}

@media (max-width: 720px) {
  .home2-page .site-header{height:72px}.home2-page .header-inner{padding:0 10px 0 14px}.home2-page .hero{padding-top:46px}
  .home2-services{padding-top:88px}.home2-intro{grid-template-columns:1fr;gap:18px;margin-bottom:34px}.home2-intro h2,.home2-cyber h2,.home2-consulting h2,.home2-why h2,.home2-process h2,.home2-faq h2,.home2-cta h2{font-size:clamp(38px,11vw,52px)}
  .home2-software{min-height:0;padding:28px 22px;border-radius:24px}.home2-software-copy h3{font-size:38px}.home2-software-copy>p{font-size:15px}.home2-floating-tags{gap:6px}.home2-floating-tags span{font-size:9px;padding:7px 9px}.home2-software-visual{min-height:330px}.window-main{width:90%;height:260px;right:0;top:36px}.ui-canvas{padding:20px}.ui-cards{gap:8px}.ui-cards span{height:54px}.ui-chart{left:20px;right:20px;bottom:20px;height:56px}.window-mobile{width:84px;height:160px;left:0;bottom:4px;border-radius:20px;padding:14px 10px}.home2-data-pill{font-size:7px}.pill-b{display:none}
  .home2-split-services{padding:16px 0 84px;gap:14px}.home2-editorial{min-height:460px;padding:28px 22px;border-radius:22px}.home2-infra,.home2-cctv{border-radius:22px}.home2-editorial h3{font-size:36px}.home2-network-map{width:80%;right:-50px}.home2-camera-visual{height:190px;margin:-28px -22px 26px}
  .home2-cyber{padding:88px 0}.home2-cyber-grid{gap:36px}.home2-cyber-copy>p:not(.eyebrow){font-size:15px}.home2-cyber-points{grid-template-columns:1fr}.home2-threat-panel{min-height:420px}.threat-grid{min-height:300px}.threat-node{min-width:70px;font-size:7px}.threat-shield{width:90px;height:108px}.threat-status{grid-template-columns:1fr 1fr 1fr;gap:6px}.threat-status span{font-size:8px}
  .home2-consulting-grid{gap:36px}.home2-roadmap{grid-template-columns:1fr}.home2-roadmap>i{width:1px;height:34px;margin-left:3px}.home2-roadmap>div{min-height:0;padding:22px 0 20px}.home2-roadmap strong{margin-top:26px}
  .home2-why{padding:84px 0}.home2-why-grid{gap:38px}.home2-juan{min-height:480px;border-radius:24px}.home2-juan img{width:85%}.home2-why-copy>p:not(.eyebrow){font-size:15px}.home2-why-list{grid-template-columns:1fr}.home2-why-list>div{min-height:0}
  .home2-process-line{grid-template-columns:1fr;margin-top:42px}.home2-process-line::before{left:24px;top:0;bottom:0;right:auto;width:1px;height:auto;background:linear-gradient(var(--blue),var(--green))}.home2-process-line li{padding:0 0 32px 76px;min-height:120px}.home2-process-line span{position:absolute;left:0;top:0}.home2-process-line strong{margin-top:0;padding-top:8px}
  .home2-faq-grid{gap:34px}.home2-faq-visual{min-height:360px;border-radius:24px}.faq-symbol{width:130px;height:130px}.faq-symbol img{width:84px}.r1{width:210px;height:210px}.r2{width:300px;height:300px}.r3{width:390px;height:390px}.home2-faq-copy h2{font-size:38px}.home2-accordion summary{font-size:14px;padding-right:34px}.home2-accordion details p{padding-right:34px}
  .home2-cta-box{min-height:0;padding:30px 22px;border-radius:24px;grid-template-columns:1fr}.home2-cta-art{min-height:230px;order:-1}.home2-cta-art img{width:120px}.co1{width:190px;height:190px}.co2{width:260px;height:260px}.home2-cta-copy>div{flex-direction:column}.home2-cta-copy .button{width:100%}
  .home2-footer-main{gap:40px}.home2-footer-nav{grid-template-columns:1fr;gap:28px}.home2-footer-bottom{flex-direction:column;gap:7px}
}

@media (prefers-reduced-motion: reduce) {
  .home2-data-pill,.camera-scan,.pulse-dot { animation:none !important; }
}

/* --- Home v2.1 refinements --- */
.nav-dropdown { position: relative; }
.nav-dropdown > button[aria-expanded="true"] > span { transform: rotate(180deg); }
.nav-dropdown > button[aria-expanded="true"] + .nav-dropdown-menu,
.nav-dropdown:hover .nav-dropdown-menu,
.nav-dropdown:focus-within .nav-dropdown-menu { opacity:1; pointer-events:auto; translate:-50% 0; }
.nav-dropdown-menu { padding:12px; min-width:236px; }
.nav-dropdown-menu a { border-radius:14px; }

.mobile-submenu { border-bottom:1px solid var(--line); }
.mobile-submenu summary { list-style:none; cursor:pointer; padding:18px 0; display:flex; align-items:center; justify-content:space-between; font-size:clamp(22px, 6vw, 36px); font-weight:700; letter-spacing:-.04em; }
.mobile-submenu summary::-webkit-details-marker { display:none; }
.mobile-submenu summary span { color:var(--muted); font-size:12px; letter-spacing:.1em; font-weight:700; }
.mobile-submenu summary::after { content:"+"; color:var(--blue); font-size:26px; font-weight:300; margin-left:auto; margin-right:8px; }
.mobile-submenu[open] summary::after { content:"−"; }
.mobile-submenu-links { display:grid; padding:0 0 12px 18px; }
.mobile-submenu-links a { font-size:18px; padding:14px 0; }

.home2-editorial-points { display:flex; gap:8px; flex-wrap:wrap; margin-top:18px; }
.home2-editorial-points span { padding:8px 10px; border-radius:999px; border:1px solid var(--line-strong); color:var(--muted); font-size:10px; letter-spacing:.12em; }
.home2-network-map { right:0; bottom:0; width:62%; height:100%; aspect-ratio:auto; }
.network-core { left:38%; top:47%; transform:translate(-50%, -50%); box-shadow:0 0 0 18px color-mix(in srgb,var(--green) 6%,transparent); }
.nn1{left:8%;top:16%}.nn2{right:4%;top:18%}.nn3{right:8%;bottom:12%}.nn4{left:14%;bottom:12%}.nn5{left:38%;top:6%}
.n1{width:170px;left:21%;top:29%;rotate:30deg}.n2{width:150px;left:49%;top:44%;rotate:-33deg}.n3{width:168px;left:49%;top:50%;rotate:35deg}.n4{width:154px;left:23%;top:57%;rotate:-28deg}.n5{width:112px;left:43%;top:21%;rotate:87deg}
.network-stat { position:absolute; display:grid; gap:4px; padding:12px 14px; border-radius:18px; border:1px solid color-mix(in srgb,var(--blue) 20%,var(--line)); background:color-mix(in srgb,var(--surface) 88%,transparent); box-shadow:0 16px 40px rgba(7,16,29,.08); }
.network-stat b { color:var(--text); font-size:15px; letter-spacing:-.03em; }
.network-stat small { color:var(--muted); font-size:10px; letter-spacing:.12em; text-transform:uppercase; }
.ns1 { left:4%; bottom:24%; }
.ns2 { right:4%; bottom:28%; }

.home2-consulting-grid { gap:72px; }
.home2-consulting-stage { position:relative; min-height:420px; padding:26px; border-radius:34px; overflow:hidden; background:linear-gradient(145deg,#07101d,#0b1a2b); color:#edf6ff; box-shadow:0 30px 90px rgba(5,20,40,.18); }
.home2-consulting-stage::before { content:""; position:absolute; inset:0; opacity:.22; background-image:linear-gradient(rgba(255,255,255,.055) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.055) 1px,transparent 1px); background-size:30px 30px; }
.consult-panel,.consult-tags,.consult-signal { position:relative; z-index:2; }
.consult-panel { position:absolute; max-width:270px; padding:18px 20px 20px; border-radius:24px; border:1px solid rgba(214,232,255,.10); background:rgba(8,20,35,.9); box-shadow:0 20px 50px rgba(0,0,0,.18); }
.consult-panel small { color:#08cf93; font-size:10px; letter-spacing:.16em; }
.consult-panel strong { display:block; margin-top:12px; font-size:23px; line-height:1.05; letter-spacing:-.04em; }
.consult-panel p { margin:12px 0 0; color:#8ea3bb; font-size:13px; }
.consult-panel-main { left:24px; top:28px; }
.consult-panel-secondary { right:24px; top:122px; }
.consult-panel-result { left:110px; bottom:34px; max-width:310px; }
.consult-signal { position:absolute; height:1px; background:linear-gradient(90deg,#0d7cff,#08cf93); opacity:.55; transform-origin:left center; }
.consult-signal-a { width:210px; left:220px; top:148px; rotate:14deg; }
.consult-signal-b { width:200px; left:188px; bottom:136px; rotate:40deg; }
.consult-tags { position:absolute; right:26px; bottom:24px; display:flex; gap:8px; flex-wrap:wrap; justify-content:flex-end; max-width:300px; }
.consult-tags span { padding:8px 11px; border-radius:999px; border:1px solid rgba(214,232,255,.14); color:#9eb2c8; font-size:10px; letter-spacing:.12em; }

.home2-why { background:linear-gradient(180deg,#06111f 0%, #07101d 100%); }
.home2-why-grid { align-items:stretch; }
.home2-juan { min-height:650px; background:radial-gradient(circle at 30% 15%,rgba(13,124,255,.16),transparent 30%),linear-gradient(145deg,#0b1929,#07101d); }
.home2-juan img { width:min(88%,460px); left:46%; filter:none; mix-blend-mode:normal; opacity:1; }
.shape-c { width:164px; height:164px; right:34px; bottom:54px; border-radius:50%; background:radial-gradient(circle at 35% 35%, #08cf93 0, #08cf93 42%, #0d7cff 43%, #0d7cff 76%, #edf6ff 77%, #edf6ff 100%); opacity:.96; }
.home2-juan-card { position:absolute; z-index:4; left:26px; top:24px; max-width:260px; padding:16px 18px; border-radius:20px; border:1px solid rgba(214,232,255,.14); background:rgba(9,23,39,.88); box-shadow:0 18px 40px rgba(0,0,0,.18); }
.home2-juan-card span { color:#08cf93; font-size:10px; letter-spacing:.14em; text-transform:uppercase; }
.home2-juan-card strong { display:block; margin-top:10px; font-size:22px; line-height:1.08; letter-spacing:-.04em; }
.home2-juan-label { background:rgba(9,23,39,.92); }

.home2-process-head p:not(.eyebrow) { color:var(--muted); font-size:16px; max-width:620px; }
.home2-process-board { margin-top:40px; display:grid; grid-template-columns:repeat(4,1fr); gap:18px; }
.process-card { min-height:238px; padding:22px; border-radius:26px; background:linear-gradient(180deg,var(--surface), color-mix(in srgb,var(--surface) 96%,var(--blue) 4%)); border:1px solid var(--line-strong); box-shadow:0 18px 45px rgba(7,16,29,.05); }
.process-card span { display:inline-flex; align-items:center; gap:8px; padding:10px 14px; border-radius:14px; background:color-mix(in srgb,var(--surface-2) 84%,transparent); color:var(--blue); font-size:10px; font-weight:800; letter-spacing:.18em; }
.process-card strong { display:block; margin-top:28px; font-size:24px; line-height:1.05; letter-spacing:-.04em; }
.process-card p { margin-top:14px; color:var(--muted); font-size:14px; max-width:230px; }

.home2-faq-grid { align-items:stretch; }
.home2-faq-visual { display:flex; align-items:stretch; padding:24px; }
.faq-mockup { position:relative; width:100%; border-radius:28px; border:1px solid rgba(214,232,255,.10); background:linear-gradient(145deg,rgba(9,23,39,.96),rgba(8,20,35,.92)); overflow:hidden; }
.faq-mockup::before { content:""; position:absolute; inset:0; opacity:.18; background-image:linear-gradient(rgba(255,255,255,.055) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.055) 1px,transparent 1px); background-size:26px 26px; }
.faq-mockup-head { position:relative; z-index:2; height:58px; padding:0 20px; display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid rgba(214,232,255,.08); color:#7389a2; font:10px ui-monospace,monospace; }
.faq-mockup-head b { color:#a9bdd1; letter-spacing:.14em; }
.faq-mockup-body { position:relative; z-index:2; min-height:470px; padding:28px; }
.faq-window { position:absolute; border-radius:22px; border:1px solid rgba(214,232,255,.10); background:rgba(10,24,39,.9); box-shadow:0 18px 40px rgba(0,0,0,.22); }
.fw-main { left:26px; right:70px; top:34px; padding:24px; }
.fw-main strong { display:block; font-size:26px; line-height:1.05; letter-spacing:-.04em; }
.fw-main p { margin-top:12px; max-width:350px; color:#8da3ba; font-size:14px; }
.fw-mini { display:grid; place-items:center; min-width:126px; height:62px; }
.fw-mini span { color:#e6f0fb; font-size:11px; letter-spacing:.15em; }
.fw-mini.a { left:28px; bottom:118px; }
.fw-mini.b { right:38px; top:164px; }
.fw-mini.c { left:118px; bottom:42px; }
.fw-mini.d { right:106px; bottom:56px; }
.faq-glow { position:absolute; width:10px; height:10px; border-radius:50%; background:#08cf93; box-shadow:0 0 18px #08cf93; }
.g1 { left:28%; top:50%; }
.g2 { right:28%; top:44%; background:#0d7cff; box-shadow:0 0 18px #0d7cff; }
.g3 { left:56%; bottom:34%; }

.home2-cta-box { grid-template-columns:1.06fr .94fr; }
.home2-cta-art { min-height:320px; }
.home2-cta-art img { display:none; }
.cta-flow-node { position:absolute; z-index:3; padding:10px 14px; border-radius:999px; border:1px solid rgba(214,232,255,.14); background:rgba(7,16,29,.78); color:#edf6ff; font-size:10px; letter-spacing:.14em; font-weight:800; box-shadow:0 14px 40px rgba(0,0,0,.16); }
.cfn-core { left:50%; top:50%; translate:-50% -50%; padding:18px 22px; background:linear-gradient(135deg,#0d7cff,#08cf93); color:#07101d; }
.cfn-a { left:8%; top:18%; }
.cfn-b { right:10%; top:24%; }
.cfn-c { left:16%; bottom:18%; }
.cfn-d { right:12%; bottom:14%; }
.co1{width:220px;height:220px}.co2{width:320px;height:320px;border-style:dashed;opacity:.65}
.cr1{left:19%;top:31%;width:146px;rotate:25deg}.cr2{right:19%;top:34%;width:134px;rotate:153deg}.cr3{left:25%;bottom:31%;width:128px;rotate:-25deg}.cr4{right:24%;bottom:25%;width:120px;rotate:205deg}

@media (max-width: 1100px) {
  .home2-network-map { width:100%; min-height:280px; margin-top:22px; position:relative; right:auto; bottom:auto; }
  .network-core { left:50%; top:50%; }
  .home2-consulting-stage { min-height:500px; }
  .home2-process-board { grid-template-columns:repeat(2,1fr); }
}

@media (max-width: 720px) {
  .mobile-submenu summary { font-size:clamp(22px, 8vw, 32px); }
  .home2-editorial-points { margin-top:16px; }
  .home2-network-map { min-height:260px; width:100%; margin-top:26px; }
  .network-core { left:50%; top:50%; }
  .network-stat { padding:9px 11px; }
  .ns1 { left:0; bottom:18%; }
  .ns2 { right:0; bottom:24%; max-width:150px; }
  .home2-consulting-stage { min-height:0; padding:24px 18px 112px; border-radius:24px; }
  .consult-panel { position:relative; left:auto; right:auto; top:auto; bottom:auto; max-width:none; margin-bottom:12px; }
  .consult-signal { display:none; }
  .consult-tags { left:18px; right:18px; bottom:18px; max-width:none; justify-content:flex-start; }
  .home2-juan { min-height:540px; }
  .home2-juan img { width:min(92%, 410px); left:50%; }
  .home2-juan-card { max-width:220px; }
  .home2-process-board { grid-template-columns:1fr; gap:14px; }
  .process-card { min-height:0; padding:20px; border-radius:22px; }
  .home2-faq-visual { padding:14px; min-height:420px; }
  .faq-mockup-body { min-height:330px; padding:18px; }
  .fw-main { left:18px; right:18px; top:18px; padding:18px; }
  .fw-main strong { font-size:22px; }
  .fw-mini { min-width:92px; height:54px; }
  .fw-mini.a { left:18px; bottom:108px; }
  .fw-mini.b { right:18px; top:146px; }
  .fw-mini.c { left:74px; bottom:34px; }
  .fw-mini.d { right:64px; bottom:38px; }
  .home2-cta-box { grid-template-columns:1fr; }
  .home2-cta-art { order:-1; min-height:260px; }
  .cfn-a { left:4%; top:18%; } .cfn-b { right:4%; top:24%; } .cfn-c { left:8%; bottom:18%; } .cfn-d { right:6%; bottom:16%; }
}