:root {
  --bg: #050914;
  --bg-soft: #091121;
  --panel: rgba(12, 23, 42, .72);
  --line: rgba(145, 190, 228, .14);
  --text: #f1f7ff;
  --muted: #94a7bc;
  --cyan: #49d9ff;
  --cyan-soft: #9beaff;
  --blue: #3978ff;
  --green: #3fe6a0;
  --max: 1180px;
  --radius: 24px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; min-width: 320px; color: var(--text); background: var(--bg); font-family: Inter, "Segoe UI", Arial, sans-serif; line-height: 1.6; overflow-x: hidden; }
body::before { content: ""; position: fixed; inset: -64px; z-index: -3; opacity: .25; background-image: linear-gradient(rgba(73,217,255,.045) 1px, transparent 1px), linear-gradient(90deg, rgba(73,217,255,.045) 1px, transparent 1px); background-size: 64px 64px; mask-image: linear-gradient(to bottom, #000, transparent 82%); animation: grid-navigation 16s linear infinite; }
a { color: inherit; }
img { max-width: 100%; display: block; }
button, a { -webkit-tap-highlight-color: transparent; }
:focus-visible { outline: 2px solid var(--cyan); outline-offset: 4px; }
.container { width: min(calc(100% - 40px), var(--max)); margin-inline: auto; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
.skip-link { position: fixed; top: 12px; left: 12px; z-index: 1000; padding: 10px 16px; background: var(--cyan); color: #031018; border-radius: 8px; transform: translateY(-150%); font-weight: 800; }
.skip-link:focus { transform: none; }
.ambient { position: fixed; width: 560px; aspect-ratio: 1; border-radius: 50%; filter: blur(120px); opacity: .12; pointer-events: none; z-index: -2; }
.ambient-one { background: var(--blue); top: -280px; right: -180px; }
.ambient-two { background: var(--cyan); bottom: -360px; left: -220px; }
@keyframes grid-navigation { to { transform: translate3d(64px, 64px, 0); } }
@keyframes ambient-one-navigation { 50% { translate: -55px 85px; scale: 1.12; opacity: .18; } }
@keyframes ambient-two-navigation { 50% { translate: 70px -65px; scale: .92; opacity: .17; } }
.ambient-one { animation: ambient-one-navigation 13s ease-in-out infinite; }
.ambient-two { animation: ambient-two-navigation 16s ease-in-out infinite; }

.site-header { position: sticky; top: 0; z-index: 100; height: 86px; border-bottom: 1px solid transparent; transition: .3s ease; }
.site-header.scrolled { height: 72px; background: rgba(5,9,20,.86); border-color: var(--line); backdrop-filter: blur(18px); }
.nav-wrap { height: 100%; display: flex; align-items: center; justify-content: space-between; }
.brand { display: inline-flex; align-items: center; justify-content: center; width: 154px; height: 70px; text-decoration: none; }
.brand img { width: auto; height: 100%; max-width: 100%; object-fit: contain; filter: drop-shadow(0 0 18px rgba(73,217,255,.18)); }
.main-nav { display: flex; align-items: center; gap: 32px; }
.main-nav a { color: var(--muted); font-size: .88rem; font-weight: 700; text-decoration: none; transition: .2s; }
.main-nav a:hover, .main-nav a.active { color: var(--text); }
.main-nav .nav-cta { padding: 11px 18px; color: var(--cyan-soft); border: 1px solid rgba(73,217,255,.35); border-radius: 999px; background: rgba(73,217,255,.06); }
.menu-toggle { display: none; width: 44px; height: 44px; border: 1px solid var(--line); border-radius: 12px; color: white; background: rgba(255,255,255,.03); padding: 11px; }
.menu-toggle > span:not(.sr-only) { display: block; height: 2px; background: currentColor; margin: 4px 0; transition: .2s; }

.hero { min-height: calc(100vh - 86px); display: grid; grid-template-columns: 1.05fr .95fr; gap: 44px; align-items: center; padding-block: 70px 100px; }
.eyebrow { margin: 0 0 22px; color: var(--cyan-soft); letter-spacing: .18em; font-size: .72rem; font-weight: 800; text-transform: uppercase; }
.eyebrow span { display: inline-block; width: 28px; height: 1px; margin: 0 10px 3px 0; background: var(--cyan); box-shadow: 0 0 10px var(--cyan); }
h1, h2, h3, p { margin-top: 0; }
h1, h2, h3 { line-height: 1.08; letter-spacing: -.035em; overflow-wrap: normal; word-break: normal; hyphens: none; }
h1 { max-width: 760px; margin-bottom: 26px; font-size: clamp(3.3rem, 6.5vw, 6.5rem); font-weight: 750; }
h1 em, h2 em { color: transparent; font-style: normal; background: linear-gradient(90deg, var(--cyan-soft), var(--cyan), #71a5ff); background-clip: text; -webkit-background-clip: text; }
.hero-text { max-width: 650px; margin-bottom: 34px; color: var(--muted); font-size: clamp(1rem, 1.5vw, 1.17rem); }
.hero-actions { display: flex; flex-wrap: wrap; gap: 14px; }
.button { display: inline-flex; min-height: 52px; align-items: center; justify-content: center; gap: 12px; padding: 13px 22px; border: 1px solid transparent; border-radius: 12px; font-size: .9rem; font-weight: 800; text-decoration: none; transition: .25s ease; }
.button:hover { transform: translateY(-3px); }
.button-primary { color: #03131d; background: linear-gradient(120deg, #8cecff, var(--cyan)); box-shadow: 0 12px 35px rgba(73,217,255,.22), inset 0 1px rgba(255,255,255,.65); }
.button-primary:hover { box-shadow: 0 16px 45px rgba(73,217,255,.34); }
.button-ghost { color: var(--text); border-color: var(--line); background: rgba(255,255,255,.03); }
.trust-row { display: flex; gap: 28px; margin-top: 52px; padding-top: 26px; border-top: 1px solid var(--line); }
.trust-row div { display: grid; }
.trust-row strong { color: var(--cyan-soft); font-size: 1.35rem; }
.trust-row span { color: var(--muted); font-size: .73rem; }

.hero-visual { position: relative; min-height: 570px; perspective: 1000px; }
.orbital-scene { position: absolute; inset: 5% 0 0; transform-style: preserve-3d; transition: transform .15s linear; }
.particle-canvas { position: absolute; inset: 0; width: 100%; height: 100%; filter: drop-shadow(0 0 22px rgba(73,217,255,.2)); }
.particle-core { position: absolute; z-index: 3; top: 50%; left: 50%; width: 112px; height: 112px; display: flex; flex-direction: column; align-items: center; justify-content: center; transform: translate(-50%,-50%) translateZ(70px); color: var(--cyan-soft); border: 1px solid rgba(73,217,255,.38); border-radius: 50%; background: radial-gradient(circle, rgba(15,36,61,.82), rgba(5,10,22,.7) 68%, transparent 70%); box-shadow: 0 0 45px rgba(73,217,255,.18), inset 0 0 28px rgba(73,217,255,.08); backdrop-filter: blur(5px); pointer-events: none; }
.particle-core::before, .particle-core::after { content: ""; position: absolute; border: 1px solid rgba(73,217,255,.18); border-radius: 50%; animation: core-ring 5s linear infinite; }
.particle-core::before { inset: -15px; border-style: dashed; }
.particle-core::after { inset: 10px; animation-direction: reverse; animation-duration: 3.5s; }
.particle-core span { font-size: 1.65rem; font-weight: 900; letter-spacing: -.08em; }
.particle-core small { color: var(--muted); font-size: .42rem; letter-spacing: .17em; }
.interaction-hint { position: absolute; z-index: 4; left: 50%; bottom: 3%; display: flex; align-items: center; gap: 8px; transform: translateX(-50%); color: #70849a; font-size: .56rem; font-weight: 800; letter-spacing: .13em; text-transform: uppercase; white-space: nowrap; }
.interaction-hint i { width: 5px; height: 5px; border-radius: 50%; background: var(--cyan); box-shadow: 0 0 9px var(--cyan); }
.interaction-hint span { color: var(--cyan-soft); }
@keyframes core-ring { to { transform: rotate(360deg); } }
.radar-grid { position: absolute; inset: 12%; border: 1px solid rgba(73,217,255,.2); border-radius: 50%; transform: rotateX(62deg) rotateZ(-15deg); background: radial-gradient(circle, rgba(73,217,255,.18) 0 2px, transparent 3px), repeating-radial-gradient(circle, transparent 0 44px, rgba(73,217,255,.12) 45px 46px); box-shadow: 0 0 100px rgba(57,120,255,.18), inset 0 0 80px rgba(73,217,255,.08); }
.radar-grid::after { content: ""; position: absolute; inset: 50%; width: 45%; height: 1px; transform-origin: left; background: linear-gradient(90deg, var(--cyan), transparent); animation: scan 6s linear infinite; }
.orbit { position: absolute; top: 50%; left: 50%; border: 1px solid rgba(73,217,255,.28); border-radius: 50%; transform-style: preserve-3d; }
.orbit-one { width: 75%; aspect-ratio: 1; transform: translate(-50%,-50%) rotateX(68deg) rotateZ(20deg); }
.orbit-two { width: 58%; aspect-ratio: 1; transform: translate(-50%,-50%) rotateY(62deg) rotateZ(-28deg); }
.core-shield { position: absolute; top: 50%; left: 50%; width: 170px; aspect-ratio: .86; display: flex; flex-direction: column; align-items: center; justify-content: center; transform: translate(-50%,-50%) translateZ(60px); color: var(--cyan-soft); background: linear-gradient(145deg, rgba(48,100,151,.35), rgba(7,16,31,.9)); border: 1px solid rgba(73,217,255,.55); clip-path: polygon(50% 0, 92% 18%, 86% 72%, 50% 100%, 14% 72%, 8% 18%); filter: drop-shadow(0 0 35px rgba(73,217,255,.35)); }
.core-shield::before { content: ""; position: absolute; inset: 9%; clip-path: inherit; border: 1px solid rgba(255,255,255,.16); background: linear-gradient(140deg, rgba(73,217,255,.1), transparent 60%); }
.core-shield span { position: relative; font-size: 2.5rem; font-weight: 900; letter-spacing: -.08em; }
.core-shield small { position: relative; font-size: .55rem; letter-spacing: .25em; }
.data-card { position: absolute; z-index: 4; padding: 14px 17px; border: 1px solid rgba(145,190,228,.2); border-radius: 14px; background: rgba(9,18,34,.76); box-shadow: 0 20px 55px rgba(0,0,0,.35); backdrop-filter: blur(12px); transform: translateZ(90px); }
.data-card span, .data-card small { display: block; color: var(--muted); font-size: .64rem; }
.data-card strong { display: block; font-size: .82rem; }
.card-status { top: 18%; left: -2%; padding-left: 42px; }
.card-status i { position: absolute; left: 17px; top: 23px; width: 10px; height: 10px; border-radius: 50%; background: var(--green); box-shadow: 0 0 16px var(--green); }
.card-response { right: 0; bottom: 17%; }
.card-response strong { color: var(--cyan-soft); font-size: 1.6rem; }
.node { position: absolute; width: 9px; height: 9px; border-radius: 50%; background: var(--cyan); box-shadow: 0 0 18px var(--cyan); animation: pulse 2s ease-in-out infinite; }
.node-one { top: 14%; right: 27%; }.node-two { bottom: 20%; left: 20%; animation-delay: .5s; }.node-three { top: 47%; right: 6%; animation-delay: 1s; }
@keyframes scan { to { transform: rotate(360deg); } }
@keyframes pulse { 50% { transform: scale(1.8); opacity: .45; } }

.signal-bar { overflow: hidden; border-block: 1px solid var(--line); background: rgba(73,217,255,.025); -webkit-mask-image: linear-gradient(90deg, transparent, #000 7%, #000 93%, transparent); mask-image: linear-gradient(90deg, transparent, #000 7%, #000 93%, transparent); }
.signal-track { width: max-content; height: 62px; display: flex; align-items: center; color: #7890a8; font-size: .64rem; font-weight: 800; letter-spacing: .2em; animation: signal-scroll 24s linear infinite; will-change: transform; }
.signal-set { display: flex; flex: none; min-width: 100vw; align-items: center; justify-content: space-around; gap: 34px; padding-inline: 17px; white-space: nowrap; }
.signal-track i { flex: 0 0 4px; width: 4px; height: 4px; border-radius: 50%; background: var(--cyan); box-shadow: 0 0 10px var(--cyan); }
@keyframes signal-scroll { to { transform: translate3d(-50%, 0, 0); } }
.section { padding-block: 120px; }
.section-heading { display: grid; grid-template-columns: 1.4fr .6fr; gap: 60px; align-items: end; margin-bottom: 52px; }
.section-heading h2, .advantage-copy h2, .cta-panel h2, .detail-copy h1 { margin: 0; font-size: clamp(2.3rem, 4.5vw, 4.2rem); }
.section-heading > p { max-width: 390px; margin: 0; color: var(--muted); }
.services-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; align-items: start; }
.service-card { position: relative; overflow: hidden; color: inherit; border: 1px solid var(--line); border-radius: var(--radius); background: linear-gradient(160deg, rgba(20,37,62,.72), rgba(7,14,27,.92)); text-decoration: none; transition: transform .35s ease, border-color .35s, box-shadow .35s; }
.service-card.featured { margin-top: -22px; }
.service-card:hover { transform: translateY(-10px); border-color: rgba(73,217,255,.45); box-shadow: 0 30px 70px rgba(0,0,0,.3), 0 0 35px rgba(73,217,255,.08); }
.service-image { position: relative; aspect-ratio: 1; overflow: hidden; }
.service-image::after { content: ""; position: absolute; inset: 0; background: linear-gradient(to top, #0b1528, transparent 60%); }
.service-image img { width: 100%; height: 100%; object-fit: cover; filter: saturate(.75) contrast(1.1); transition: .5s; }
.service-card:hover img { transform: scale(1.05); filter: saturate(1); }
.service-number { position: absolute; z-index: 2; top: 16px; right: 17px; color: rgba(255,255,255,.7); font-size: .7rem; letter-spacing: .1em; }
.service-content { padding: 2px 26px 28px; }
.service-tag { color: var(--cyan); font-size: .59rem; font-weight: 900; letter-spacing: .14em; }
.service-card h3 { margin: 10px 0 13px; font-size: 1.55rem; }
.service-card p { min-height: 76px; color: var(--muted); font-size: .9rem; }
.card-link { display: flex; align-items: center; justify-content: space-between; padding-top: 17px; color: var(--cyan-soft); border-top: 1px solid var(--line); font-size: .75rem; font-weight: 800; }
.card-link b { font-size: 1.1rem; }

.section-panel { border-block: 1px solid var(--line); background: radial-gradient(circle at 70% 40%, rgba(48,116,199,.13), transparent 38%), rgba(8,15,29,.66); }
.advantage-layout { display: grid; grid-template-columns: .75fr 1.25fr; gap: 80px; align-items: center; }
.advantage-copy > p:not(.eyebrow) { margin: 28px 0; color: var(--muted); }
.text-link { display: inline-flex; gap: 20px; align-items: center; color: var(--cyan-soft); font-size: .87rem; font-weight: 800; text-decoration: none; }
.text-link span { font-size: 1.3rem; transition: .2s; }.text-link:hover span { transform: translateX(5px); }
.advantage-grid { display: grid; grid-template-columns: repeat(2,1fr); gap: 16px; }
.advantage-card { min-height: 220px; padding: 28px; border: 1px solid var(--line); border-radius: 18px; background: rgba(255,255,255,.025); transition: .3s; }
.advantage-card:hover { background: rgba(73,217,255,.045); border-color: rgba(73,217,255,.32); transform: translateY(-5px); }
.advantage-card > span { display: grid; width: 38px; height: 38px; place-items: center; margin-bottom: 28px; color: var(--cyan); border: 1px solid rgba(73,217,255,.32); border-radius: 10px; background: rgba(73,217,255,.07); }
.advantage-card h3 { margin-bottom: 10px; font-size: 1.08rem; }
.advantage-card p { color: var(--muted); font-size: .85rem; }
.cta-panel { position: relative; overflow: hidden; padding: 80px 8%; text-align: center; border: 1px solid rgba(73,217,255,.2); border-radius: 32px; background: linear-gradient(145deg, rgba(18,40,67,.8), rgba(7,15,29,.9)); box-shadow: inset 0 1px rgba(255,255,255,.04); }
.cta-panel .eyebrow span { display: none; }
.cta-panel h2 { position: relative; }
.cta-panel > p:not(.eyebrow) { position: relative; max-width: 660px; margin: 24px auto 30px; color: var(--muted); }
.cta-panel .button { position: relative; }
.cta-glow { position: absolute; top: -180px; left: 50%; width: 500px; height: 300px; transform: translateX(-50%); border-radius: 50%; background: var(--cyan); filter: blur(120px); opacity: .16; }

.site-footer { padding-top: 58px; border-top: 1px solid var(--line); background: #030711; }
.footer-main { display: grid; grid-template-columns: .7fr 1fr 1fr; gap: 50px; align-items: center; padding-bottom: 48px; }
.footer-brand { width: 145px; }
.footer-main > p { margin: 0; color: var(--muted); font-size: .84rem; }
.footer-main nav { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 22px; }
.footer-main nav a { color: var(--muted); font-size: .77rem; text-decoration: none; }
.footer-main nav a:hover { color: var(--cyan-soft); }
.footer-bottom { display: flex; justify-content: space-between; padding-block: 20px; color: #63758a; border-top: 1px solid var(--line); font-size: .7rem; }
.whatsapp-float { position: fixed; right: 22px; bottom: 22px; z-index: 90; display: flex; align-items: center; gap: 10px; padding: 9px 15px 9px 9px; color: #041510; border: 1px solid rgba(255,255,255,.4); border-radius: 999px; background: #42e89c; box-shadow: 0 12px 35px rgba(0,0,0,.4); font-size: .74rem; text-decoration: none; }
.whatsapp-float span { display: grid; width: 30px; height: 30px; place-items: center; border-radius: 50%; background: rgba(0,0,0,.12); font-size: .62rem; font-weight: 900; }
.motion-toggle { position: fixed; z-index: 89; left: 18px; bottom: 18px; display: flex; align-items: center; gap: 8px; padding: 8px 12px; color: var(--muted); border: 1px solid var(--line); border-radius: 999px; background: rgba(5,9,20,.82); box-shadow: 0 10px 30px rgba(0,0,0,.25); backdrop-filter: blur(12px); font: inherit; font-size: .64rem; cursor: pointer; }
.motion-toggle i { width: 7px; height: 7px; border-radius: 50%; background: var(--green); box-shadow: 0 0 10px var(--green); }
.reduce-motion .motion-toggle i { background: var(--muted); box-shadow: none; }
.motion-toggle:hover { color: var(--cyan-soft); border-color: rgba(73,217,255,.35); }

/* Service detail pages */
.detail-hero { min-height: 72vh; display: grid; grid-template-columns: 1fr 1fr; gap: 70px; align-items: center; padding-block: 70px 90px; }
.breadcrumb { display: flex; gap: 10px; margin-bottom: 30px; color: var(--muted); font-size: .72rem; }
.breadcrumb a { color: var(--cyan-soft); text-decoration: none; }
.detail-copy .hero-text { margin-block: 24px 32px; }
.detail-badge { display: inline-flex; gap: 8px; align-items: center; margin-top: 28px; color: var(--muted); font-size: .72rem; }
.detail-badge i { width: 7px; height: 7px; border-radius: 50%; background: var(--green); box-shadow: 0 0 12px var(--green); }
.detail-media { position: relative; perspective: 1100px; }
.detail-frame { position: relative; aspect-ratio: 1.05; overflow: hidden; border: 1px solid rgba(73,217,255,.28); border-radius: 34px; transform: rotateY(-7deg) rotateX(3deg); box-shadow: 30px 35px 80px rgba(0,0,0,.35), -1px -1px rgba(255,255,255,.08); }
.detail-frame::before { content: ""; position: absolute; inset: 0; z-index: 1; background: linear-gradient(135deg, rgba(73,217,255,.12), transparent 45%, rgba(4,9,18,.5)); }
.detail-frame img { width: 100%; height: 100%; object-fit: cover; }
.detail-frame.monitoring-frame { aspect-ratio: 1.4; }
.detail-frame.monitoring-frame img { object-fit: contain; background: #07101f; }
.floating-metric { position: absolute; z-index: 2; right: -15px; bottom: 28px; padding: 15px 20px; border: 1px solid rgba(73,217,255,.3); border-radius: 14px; background: rgba(7,16,31,.88); box-shadow: 0 18px 45px rgba(0,0,0,.35); backdrop-filter: blur(12px); }
.floating-metric small, .floating-metric strong { display: block; }.floating-metric small { color: var(--muted); font-size: .62rem; }.floating-metric strong { color: var(--cyan-soft); font-size: 1.05rem; }
.feature-section { padding-block: 100px 120px; }
.feature-intro { max-width: 720px; margin-bottom: 46px; }.feature-intro p { color: var(--muted); }.feature-intro h2 { font-size: clamp(2rem, 4vw, 3.6rem); }
.feature-list { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; counter-reset: feature; }
.feature-item { position: relative; min-height: 170px; padding: 28px; border: 1px solid var(--line); border-radius: 18px; background: var(--panel); counter-increment: feature; }
.feature-item::before { content: "0" counter(feature); display: block; margin-bottom: 24px; color: var(--cyan); font-size: .62rem; font-weight: 900; letter-spacing: .12em; }
.feature-item h3 { margin-bottom: 8px; font-size: 1rem; }.feature-item p { margin: 0; color: var(--muted); font-size: .8rem; }

/* Systems hub */
.systems-hero { max-width: 900px; padding-block: 95px 64px; text-align: center; }
.systems-hero .breadcrumb { justify-content: center; }
.systems-hero .eyebrow span { display: none; }
.systems-hero h1 { max-width: 900px; margin-inline: auto; font-size: clamp(3rem, 6vw, 5.7rem); }
.systems-hero .hero-text { max-width: 700px; margin-inline: auto; }
.systems-section { padding-bottom: 120px; }
.systems-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 22px; }
.system-card { position: relative; overflow: hidden; display: grid; grid-template-columns: .82fr 1.18fr; min-height: 360px; border: 1px solid var(--line); border-radius: 26px; background: linear-gradient(145deg, rgba(18,38,65,.78), rgba(7,14,28,.96)); box-shadow: 0 24px 70px rgba(0,0,0,.22); transition: .35s ease; }
.system-card:hover { transform: translateY(-7px); border-color: rgba(73,217,255,.42); box-shadow: 0 30px 80px rgba(0,0,0,.32), 0 0 36px rgba(73,217,255,.07); }
.system-visual { position: relative; display: grid; place-items: center; overflow: hidden; border-right: 1px solid var(--line); background: radial-gradient(circle, rgba(73,217,255,.2), transparent 48%), linear-gradient(160deg, rgba(57,120,255,.13), transparent); }
.system-visual::before { content: ""; position: absolute; inset: 0; opacity: .35; background-image: linear-gradient(rgba(73,217,255,.1) 1px, transparent 1px), linear-gradient(90deg, rgba(73,217,255,.1) 1px, transparent 1px); background-size: 30px 30px; transform: perspective(250px) rotateY(8deg) scale(1.2); }
.system-code { position: relative; z-index: 2; display: grid; width: 102px; height: 102px; place-items: center; color: var(--cyan-soft); border: 1px solid rgba(73,217,255,.55); border-radius: 28px; background: rgba(7,18,34,.82); box-shadow: 0 0 45px rgba(73,217,255,.22), inset 0 1px rgba(255,255,255,.12); font-size: 1.65rem; font-weight: 900; letter-spacing: -.04em; transform: rotate(-5deg); }
.visual-sal .system-code { color: #b6c9ff; border-color: rgba(113,165,255,.55); box-shadow: 0 0 45px rgba(57,120,255,.25), inset 0 1px rgba(255,255,255,.12); transform: rotate(5deg); }
.system-rings { position: absolute; inset: 50%; width: 220px; aspect-ratio: 1; transform: translate(-50%,-50%); }
.system-rings i { position: absolute; inset: 0; border: 1px solid rgba(73,217,255,.18); border-radius: 50%; }
.system-rings i:nth-child(2) { inset: 18%; }.system-rings i:nth-child(3) { inset: 35%; border-color: rgba(73,217,255,.35); }
.system-content { display: flex; flex-direction: column; align-items: flex-start; justify-content: center; padding: 34px; }
.system-status { display: flex; align-items: center; gap: 8px; margin-bottom: 20px; color: var(--muted); font-size: .62rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.system-status i { width: 7px; height: 7px; border-radius: 50%; background: var(--green); box-shadow: 0 0 12px var(--green); }
.system-content h2 { margin-bottom: 13px; font-size: 1.8rem; }
.system-content p { margin-bottom: 28px; color: var(--muted); font-size: .86rem; }
.system-button { width: 100%; }
.systems-note { display: flex; align-items: center; justify-content: center; gap: 12px; margin-top: 28px; color: var(--muted); font-size: .75rem; }
.systems-note span { display: grid; flex: 0 0 24px; height: 24px; place-items: center; color: var(--cyan-soft); border: 1px solid rgba(73,217,255,.3); border-radius: 50%; font-size: .7rem; font-weight: 800; }
.systems-note p { margin: 0; }

/* Digital transformation landing page */
.digital-hero { min-height: calc(100vh - 86px); display: grid; grid-template-columns: 1.02fr .98fr; gap: 64px; align-items: center; padding-block: 68px 100px; }
.digital-hero-copy h1 { margin-bottom: 26px; font-size: clamp(3.2rem, 5.7vw, 5.9rem); }
.digital-hero-copy .hero-text { max-width: 690px; }
.digital-proof { display: flex; flex-wrap: wrap; gap: 12px 22px; margin-top: 30px; color: var(--muted); font-size: .72rem; }
.digital-proof span { display: inline-flex; align-items: center; gap: 8px; }
.digital-proof i { width: 6px; height: 6px; border-radius: 50%; background: var(--green); box-shadow: 0 0 11px var(--green); }
.digital-visual { position: relative; min-height: 570px; perspective: 1200px; }
.digital-console { position: absolute; inset: 7% 3% 8%; overflow: hidden; border: 1px solid rgba(73,217,255,.3); border-radius: 30px; background: linear-gradient(150deg, rgba(18,37,62,.94), rgba(5,11,23,.98)); box-shadow: 40px 45px 90px rgba(0,0,0,.38), 0 0 55px rgba(73,217,255,.1), inset 0 1px rgba(255,255,255,.08); transform: rotateY(-6deg) rotateX(2deg); transform-style: preserve-3d; transition: transform .18s linear; }
.digital-console::before { content: ""; position: absolute; inset: 0; opacity: .38; background-image: linear-gradient(rgba(73,217,255,.055) 1px, transparent 1px), linear-gradient(90deg, rgba(73,217,255,.055) 1px, transparent 1px); background-size: 36px 36px; pointer-events: none; }
.console-top { position: relative; z-index: 2; height: 54px; display: flex; align-items: center; gap: 16px; padding: 0 20px; border-bottom: 1px solid var(--line); color: var(--muted); font-size: .55rem; letter-spacing: .13em; }
.console-top > span { display: flex; gap: 6px; margin-right: 4px; }
.console-top > span i { width: 6px; height: 6px; border-radius: 50%; background: #37506b; }
.console-top > span i:first-child { background: var(--cyan); box-shadow: 0 0 8px var(--cyan); }
.console-top strong { color: var(--cyan-soft); }
.console-top small { margin-left: auto; color: var(--green); font-size: .5rem; font-weight: 900; }
.console-body { position: relative; z-index: 2; height: calc(100% - 54px); display: grid; grid-template-columns: 64px 1fr; }
.console-body aside { display: flex; flex-direction: column; align-items: center; gap: 22px; padding-top: 24px; border-right: 1px solid var(--line); background: rgba(3,8,17,.35); }
.console-body aside b { display: grid; width: 30px; height: 30px; place-items: center; color: #05111b; border-radius: 9px; background: var(--cyan); font-size: .64rem; }
.console-body aside i { width: 20px; height: 3px; border-radius: 99px; background: #29405a; }
.console-content { padding: 28px; }
.console-heading { display: flex; justify-content: space-between; align-items: center; margin-bottom: 22px; }
.console-heading span { font-size: 1.05rem; font-weight: 800; }
.console-heading small { color: var(--muted); font-size: .55rem; }
.console-metrics { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.console-metrics > div { position: relative; overflow: hidden; min-height: 94px; padding: 17px; border: 1px solid var(--line); border-radius: 14px; background: rgba(255,255,255,.025); }
.console-metrics small, .console-metrics strong { display: block; }
.console-metrics small { color: var(--muted); font-size: .48rem; letter-spacing: .12em; }
.console-metrics strong { margin-top: 8px; color: var(--cyan-soft); font-size: .82rem; }
.console-metrics i { position: absolute; right: -10px; bottom: -14px; width: 54px; height: 54px; border: 1px solid rgba(73,217,255,.22); border-radius: 50%; box-shadow: 0 0 28px rgba(73,217,255,.1); }
.console-chart { height: 135px; display: flex; align-items: flex-end; gap: 9px; margin-top: 14px; padding: 20px 22px 0; border: 1px solid var(--line); border-radius: 14px 14px 0 0; background: linear-gradient(to top, rgba(73,217,255,.045), transparent); }
.console-chart span { flex: 1; height: var(--bar); min-width: 8px; border-radius: 5px 5px 0 0; background: linear-gradient(to top, rgba(57,120,255,.48), var(--cyan)); box-shadow: 0 0 16px rgba(73,217,255,.13); animation: console-bars 3.8s ease-in-out infinite alternate; }
.console-chart span:nth-child(2n) { animation-delay: -.9s; }
.console-flow { display: flex; align-items: center; justify-content: center; gap: 10px; padding: 15px 8px; color: var(--muted); border: 1px solid var(--line); border-top: 0; border-radius: 0 0 14px 14px; font-size: .52rem; text-transform: uppercase; letter-spacing: .08em; }
.console-flow i { color: var(--cyan); font-style: normal; }
.digital-float { position: absolute; z-index: 5; min-width: 170px; padding: 14px 17px; border: 1px solid rgba(145,190,228,.22); border-radius: 14px; background: rgba(6,14,28,.9); box-shadow: 0 18px 45px rgba(0,0,0,.38); backdrop-filter: blur(12px); }
.digital-float small, .digital-float strong { display: block; }
.digital-float small { color: var(--muted); font-size: .5rem; letter-spacing: .15em; }
.digital-float strong { margin-top: 5px; font-size: .75rem; }
.float-sheet { top: 2%; left: -2%; }
.float-sheet strong { color: #aebbc9; }
.float-system { right: -2%; bottom: 3%; }
.float-system strong { color: var(--green); }
@keyframes console-bars { to { filter: brightness(1.35); transform: scaleY(.84); transform-origin: bottom; } }
.digital-impact { border-block: 1px solid var(--line); background: rgba(73,217,255,.025); }
.digital-impact-grid { display: grid; grid-template-columns: repeat(3, 1fr); }
.digital-impact-grid > div { min-height: 112px; display: flex; flex-direction: column; justify-content: center; padding: 20px 34px; border-right: 1px solid var(--line); }
.digital-impact-grid > div:first-child { border-left: 1px solid var(--line); }
.digital-impact-grid strong { color: var(--cyan-soft); font-size: 1.05rem; }
.digital-impact-grid span { color: var(--muted); font-size: .73rem; }
.digital-offers { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; counter-reset: feature; }
.digital-offers .feature-item { min-height: 220px; }
.digital-compare-section { padding-block: 110px; }
.digital-compare-heading { max-width: 780px; margin-bottom: 48px; }
.digital-compare-heading h2, .digital-fit h2, .digital-faq-intro h2 { margin: 0; font-size: clamp(2.3rem, 4.5vw, 4.2rem); }
.digital-compare { display: grid; grid-template-columns: 1fr 110px 1fr; align-items: stretch; }
.compare-card { padding: 38px; border: 1px solid var(--line); border-radius: 24px; background: rgba(6,14,27,.72); }
.compare-before { border-color: rgba(174,187,201,.17); }
.compare-after { border-color: rgba(73,217,255,.3); background: linear-gradient(145deg, rgba(16,38,63,.82), rgba(6,14,27,.9)); box-shadow: 0 24px 70px rgba(0,0,0,.2), 0 0 40px rgba(73,217,255,.06); }
.compare-label { display: inline-flex; margin-bottom: 20px; padding: 6px 10px; color: var(--muted); border: 1px solid var(--line); border-radius: 99px; font-size: .52rem; font-weight: 900; letter-spacing: .15em; }
.compare-after .compare-label { color: var(--green); border-color: rgba(63,230,160,.25); background: rgba(63,230,160,.06); }
.compare-card h3 { max-width: 390px; font-size: 1.6rem; }
.compare-card ul { display: grid; gap: 14px; margin: 26px 0 0; padding: 0; list-style: none; }
.compare-card li { position: relative; padding-left: 22px; color: var(--muted); font-size: .86rem; }
.compare-card li::before { content: "×"; position: absolute; left: 0; color: #718297; font-weight: 900; }
.compare-after li::before { content: "✓"; color: var(--green); }
.compare-arrow { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; color: var(--cyan); }
.compare-arrow span { font-size: 2.2rem; text-shadow: 0 0 20px rgba(73,217,255,.55); }
.compare-arrow small { font-size: .46rem; font-weight: 900; letter-spacing: .12em; writing-mode: vertical-rl; }
.digital-steps { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; margin: 0; padding: 0; list-style: none; }
.digital-steps li { position: relative; min-height: 250px; padding: 28px; overflow: hidden; border: 1px solid var(--line); border-radius: 20px; background: linear-gradient(155deg, rgba(17,35,59,.62), rgba(6,13,26,.9)); }
.digital-steps li::after { content: ""; position: absolute; right: -38px; bottom: -38px; width: 110px; height: 110px; border: 1px solid rgba(73,217,255,.13); border-radius: 50%; }
.digital-steps li > span { display: block; margin-bottom: 58px; color: var(--cyan); font-size: .65rem; font-weight: 900; letter-spacing: .16em; }
.digital-steps h3 { margin-bottom: 10px; font-size: 1.15rem; }
.digital-steps p { margin: 0; color: var(--muted); font-size: .81rem; }
.digital-fit { padding-block: 105px; }
.digital-fit-layout { display: grid; grid-template-columns: .9fr 1.1fr; gap: 85px; align-items: center; }
.digital-fit-layout > div:first-child > p:not(.eyebrow) { max-width: 660px; margin: 28px 0 0; color: var(--muted); }
.digital-tags { display: flex; flex-wrap: wrap; gap: 12px; }
.digital-tags span { padding: 12px 16px; color: var(--cyan-soft); border: 1px solid rgba(73,217,255,.18); border-radius: 999px; background: rgba(73,217,255,.045); font-size: .74rem; font-weight: 700; }
.digital-faq-section { display: grid; grid-template-columns: .7fr 1.3fr; gap: 80px; align-items: start; }
.digital-faq-intro > p:last-child { max-width: 430px; margin-top: 24px; color: var(--muted); }
.digital-faq { display: grid; gap: 12px; }
.digital-faq details { padding: 0 24px; border: 1px solid var(--line); border-radius: 16px; background: rgba(255,255,255,.022); }
.digital-faq details[open] { border-color: rgba(73,217,255,.3); background: rgba(73,217,255,.035); }
.digital-faq summary { position: relative; padding: 22px 36px 22px 0; cursor: pointer; font-size: .9rem; font-weight: 800; list-style: none; }
.digital-faq summary::-webkit-details-marker { display: none; }
.digital-faq summary::after { content: "+"; position: absolute; top: 18px; right: 0; color: var(--cyan); font-size: 1.3rem; font-weight: 400; }
.digital-faq details[open] summary::after { content: "−"; }
.digital-faq details p { margin: 0; padding: 0 28px 22px 0; color: var(--muted); font-size: .8rem; }
.digital-final-cta { padding-top: 20px; }

.reveal { --reveal-x: 0px; --reveal-y: 34px; --reveal-rotate: 0deg; --reveal-scale: 1; opacity: 0; filter: blur(7px); transform: translate3d(var(--reveal-x), var(--reveal-y), 0) rotate(var(--reveal-rotate)) scale(var(--reveal-scale)); transition: opacity .85s ease var(--reveal-delay, 0ms), transform .95s cubic-bezier(.16,1,.3,1) var(--reveal-delay, 0ms), filter .8s ease var(--reveal-delay, 0ms); }
.reveal-left { --reveal-x: -72px; --reveal-y: 12px; --reveal-rotate: -1.5deg; }
.reveal-right { --reveal-x: 72px; --reveal-y: 12px; --reveal-rotate: 1.5deg; }
.reveal-up { --reveal-y: 76px; }
.reveal-scale { --reveal-y: 46px; --reveal-scale: .88; }
.reveal.visible { opacity: 1; filter: blur(0); transform: none; }

.typewriter { position: relative; }
.typewriter-visual { display: inline; overflow-wrap: normal; word-break: normal; hyphens: none; }
.type-word { display: inline-block; white-space: nowrap; }
.type-char { display: inline-block; opacity: 0; filter: blur(6px); transform: translateY(.55em) rotateX(-55deg); transform-origin: bottom; transition: opacity .32s ease calc(var(--char-index) * 18ms), transform .48s cubic-bezier(.16,1,.3,1) calc(var(--char-index) * 18ms), filter .38s ease calc(var(--char-index) * 18ms); }
.typewriter.typing-visible .type-char { opacity: 1; filter: blur(0); transform: none; }
/* iOS Safari can lose background-clipped text when the typewriter splits it into spans. */
.typewriter em,
.typewriter em .type-word,
.typewriter em .type-char {
  color: var(--cyan);
  -webkit-text-fill-color: var(--cyan);
  background: none;
}
.typewriter::after { content: ""; display: inline-block; width: 2px; height: .78em; margin-left: .08em; vertical-align: .02em; opacity: 0; background: var(--cyan); box-shadow: 0 0 12px var(--cyan); }
.typewriter.typing-visible::after { opacity: 1; animation: typing-cursor .7s step-end infinite; }
.typewriter.typed::after { opacity: 0; animation: none; transition: opacity .3s; }
@keyframes typing-cursor { 50% { opacity: 0; } }

/* Site-wide interactive motion */
.scroll-progress { position: fixed; z-index: 1000; top: 0; left: 0; width: 100%; height: 2px; transform: scaleX(0); transform-origin: left; background: linear-gradient(90deg, var(--blue), var(--cyan-soft)); box-shadow: 0 0 12px var(--cyan); pointer-events: none; }
.cursor-aura { position: fixed; z-index: 2; top: 0; left: 0; width: 240px; height: 240px; opacity: 0; transform: translate(calc(var(--cursor-x, -300px) - 50%), calc(var(--cursor-y, -300px) - 50%)); border-radius: 50%; background: radial-gradient(circle, rgba(73,217,255,.09), rgba(57,120,255,.035) 38%, transparent 70%); filter: blur(10px); pointer-events: none; transition: opacity .25s ease; }
.cursor-aura.active { opacity: 1; }
.motion-ready .ambient-one { transform: translate(calc(var(--scene-x, 0) * -26px), calc(var(--scene-y, 0) * -20px)); }
.motion-ready .ambient-two { transform: translate(calc(var(--scene-x, 0) * 20px), calc(var(--scene-y, 0) * 26px)); }
.motion-ready .ambient { transition: transform .8s cubic-bezier(.22,.61,.36,1); }
.interactive-3d { --card-rx: 0deg; --card-ry: 0deg; --glow-x: 50%; --glow-y: 50%; transform-style: preserve-3d; will-change: transform; transition: transform .25s cubic-bezier(.22,.61,.36,1), border-color .35s, box-shadow .35s; }
.reveal.interactive-3d { transition: opacity .85s ease var(--reveal-delay, 0ms), transform .95s cubic-bezier(.16,1,.3,1) var(--reveal-delay, 0ms), filter .8s ease var(--reveal-delay, 0ms), border-color .35s, box-shadow .35s; }
.interactive-3d.visible, .interactive-3d:not(.reveal) { transform: perspective(1000px) rotateX(var(--card-rx)) rotateY(var(--card-ry)) translateY(0); }
.interactive-3d:hover { transform: perspective(1000px) rotateX(var(--card-rx)) rotateY(var(--card-ry)) translateY(-7px); }
.reveal.interactive-3d:not(.visible) { transform: translate3d(var(--reveal-x), var(--reveal-y), 0) rotate(var(--reveal-rotate)) scale(var(--reveal-scale)); }
.interactive-3d::after { content: ""; position: absolute; z-index: 8; inset: 0; opacity: 0; border-radius: inherit; background: radial-gradient(340px circle at var(--glow-x) var(--glow-y), rgba(105,224,255,.13), transparent 58%); pointer-events: none; transition: opacity .25s ease; }
.interactive-3d:hover::after { opacity: 1; }
.interactive-3d > * { transform: translateZ(18px); }
.interactive-3d > .cta-glow { transform: translateX(-50%) translateZ(0); }
.interactive-3d .service-image, .interactive-3d .system-visual { transform: translateZ(10px); }
.magnetic { --magnetic-x: 0px; --magnetic-y: 0px; transform: translate(var(--magnetic-x), var(--magnetic-y)); transition: transform .18s ease, box-shadow .25s ease, background-color .25s ease; will-change: transform; }
.button.magnetic:hover { transform: translate(var(--magnetic-x), calc(var(--magnetic-y) - 3px)); }
.motion-frame .detail-frame { --frame-rx: 3deg; --frame-ry: -7deg; transform: perspective(1100px) rotateX(var(--frame-rx)) rotateY(var(--frame-ry)); transition: transform .22s cubic-bezier(.22,.61,.36,1), box-shadow .3s ease; will-change: transform; }
.motion-frame:hover .detail-frame { box-shadow: 38px 44px 95px rgba(0,0,0,.42), 0 0 42px rgba(73,217,255,.12); }
.motion-frame .detail-frame::after { content: ""; position: absolute; z-index: 2; inset: 0; opacity: 0; background: radial-gradient(300px circle at var(--frame-x, 50%) var(--frame-y, 50%), rgba(154,235,255,.18), transparent 55%); transition: opacity .25s; pointer-events: none; }
.motion-frame:hover .detail-frame::after { opacity: 1; }
.motion-frame .floating-metric { animation: metric-float 4s ease-in-out infinite; }
.motion-ready .system-rings { animation: system-orbit 12s linear infinite; }
.motion-ready .visual-sal .system-rings { animation-direction: reverse; animation-duration: 10s; }
.motion-ready .system-code { animation: system-code-float 4.8s ease-in-out infinite; }
.motion-ready .advantage-card > span { animation: icon-pulse 3.4s ease-in-out infinite; }
.scroll-details { position: fixed; z-index: 1; inset: 0; overflow: hidden; pointer-events: none; }
.scroll-details i { position: absolute; width: 6px; height: 6px; border: 1px solid rgba(73,217,255,.55); border-radius: 50%; box-shadow: 0 0 12px rgba(73,217,255,.35); opacity: .45; }
.scroll-details i:nth-child(1) { top: 18%; left: 4%; transform: translate3d(calc(var(--page-progress, 0) * 80px), calc(var(--page-progress, 0) * 220px), 0); }
.scroll-details i:nth-child(2) { top: 48%; right: 5%; width: 10px; height: 10px; transform: translate3d(calc(var(--page-progress, 0) * -110px), calc(var(--page-progress, 0) * -170px), 0); }
.scroll-details i:nth-child(3) { bottom: 13%; left: 18%; width: 4px; height: 4px; transform: translate3d(calc(var(--page-progress, 0) * 150px), calc(var(--page-progress, 0) * -250px), 0); }
.service-image img { transform: translateY(var(--scroll-shift, 0)) scale(1.04); }
.service-card:hover .service-image img { transform: translateY(var(--scroll-shift, 0)) scale(1.09); }
.detail-frame img { transform: translateY(var(--scroll-shift, 0)) scale(1.055); transition: transform .25s ease; }
.detail-frame.monitoring-frame img { transform: translateY(var(--scroll-shift, 0)) scale(1.02); }
.system-visual { translate: 0 var(--scroll-shift, 0); }
@keyframes ambient-breathe { to { opacity: .19; filter: blur(105px); } }
@keyframes metric-float { 50% { transform: translateY(-9px) translateZ(35px); } }
@keyframes system-orbit { to { transform: translate(-50%,-50%) rotate(360deg); } }
@keyframes system-code-float { 50% { translate: 0 -8px; } }
@keyframes icon-pulse { 50% { color: #d6f8ff; border-color: rgba(73,217,255,.7); box-shadow: 0 0 24px rgba(73,217,255,.18); } }

@media (max-width: 1024px) {
  .site-header, .site-header.scrolled { height: 72px; background: rgba(5,9,20,.88); border-color: var(--line); backdrop-filter: blur(18px); }
  .menu-toggle { display: block; }
  .main-nav { position: fixed; top: 72px; left: 20px; right: 20px; display: grid; gap: 0; max-height: calc(100dvh - 92px); padding: 14px; overflow-y: auto; border: 1px solid var(--line); border-radius: 18px; background: rgba(5,9,20,.97); box-shadow: 0 30px 80px rgba(0,0,0,.5); transform: translateY(-20px) scale(.98); transform-origin: top; opacity: 0; visibility: hidden; transition: transform .25s ease, opacity .25s ease, visibility .25s; }
  .main-nav.open { transform: none; opacity: 1; visibility: visible; }
  .main-nav a { padding: 13px 14px; border-radius: 10px; }
  .main-nav a:hover, .main-nav a.active { background: rgba(73,217,255,.055); }
  .main-nav .nav-cta { margin-top: 7px; text-align: center; }
  .hero { min-height: auto; grid-template-columns: 1fr; gap: 30px; padding-top: 72px; }
  .hero-copy { max-width: 780px; }
  .hero-visual { width: min(100%, 680px); min-height: 520px; margin-inline: auto; }
  .services-grid { grid-template-columns: 1fr 1fr; }.service-card.featured { margin-top: 0; }
  .advantage-layout { grid-template-columns: 1fr; gap: 55px; }
  .advantage-copy { max-width: 720px; }
  .detail-hero { min-height: auto; grid-template-columns: 1fr; gap: 56px; padding-top: 70px; }.detail-media { width: min(100%, 680px); max-width: none; margin-inline: auto; }.feature-list { grid-template-columns: 1fr 1fr; }
  .systems-grid { grid-template-columns: 1fr; }
  .systems-grid .system-card { min-height: 320px; }
  .footer-main { grid-template-columns: .55fr 1fr; gap: 30px 50px; }
  .footer-main nav { grid-column: 1 / -1; justify-content: flex-start; }
}
@media (max-width: 760px) {
  .container { width: min(calc(100% - 28px), var(--max)); }
  .main-nav { left: 14px; right: 14px; padding: 12px; }
  .brand { width: 132px; height: 62px; }
  h1 { font-size: clamp(2.85rem, 13.5vw, 4.4rem); }
  .section-heading h2, .advantage-copy h2, .cta-panel h2, .detail-copy h1 { font-size: clamp(2.15rem, 10vw, 3.3rem); }
  .hero { min-height: auto; padding-block: 52px 70px; }
  .hero-text { font-size: 1rem; }
  .hero-actions { display: grid; grid-template-columns: 1fr; }
  .hero-actions .button { width: 100%; }
  .hero-visual { min-height: 410px; }
  .core-shield { width: 125px; }.card-status { left: 0; }.card-response { right: 0; }
  .particle-core { width: 88px; height: 88px; }.particle-core span { font-size: 1.3rem; }.particle-core small { font-size: .34rem; }
  .interaction-hint span { display: none; }
  .trust-row { gap: 18px; justify-content: space-between; }.trust-row strong { font-size: 1.1rem; }.trust-row span { font-size: .62rem; }
  .section { padding-block: 80px; }.section-heading { grid-template-columns: 1fr; gap: 22px; }.services-grid, .advantage-grid, .feature-list { grid-template-columns: 1fr; }
  .section-heading { margin-bottom: 38px; }
  .service-card p { min-height: 0; }.advantage-card { min-height: auto; }
  .cta-panel { padding: 62px 20px; }.cta-panel .button { width: 100%; }
  .footer-main { grid-template-columns: 1fr; gap: 24px; }.footer-main nav { justify-content: flex-start; }.footer-bottom { gap: 12px; flex-direction: column; }
  .whatsapp-float b { display: none; }.whatsapp-float { padding: 7px; }
  .detail-hero { gap: 45px; padding-block: 45px 70px; }.detail-frame { transform: rotateY(-3deg); border-radius: 26px; }.floating-metric { right: 8px; }
  .detail-copy .button { width: 100%; }
  .feature-section { padding-block: 76px 86px; }
  .systems-hero { padding-block: 62px 42px; }
  .systems-section { padding-bottom: 80px; }
  .system-card { grid-template-columns: 1fr; }
  .system-visual { min-height: 220px; border-right: 0; border-bottom: 1px solid var(--line); }
  .system-content { padding: 28px; }
  .systems-note { align-items: flex-start; padding-inline: 10px; text-align: left; }
}
@media (max-width: 480px) {
  .container { width: min(calc(100% - 22px), var(--max)); }
  .site-header, .site-header.scrolled { height: 66px; }
  .brand { width: 112px; height: 54px; }
  .menu-toggle { width: 40px; height: 40px; padding: 9px; }
  .main-nav { top: 66px; max-height: calc(100dvh - 80px); }
  h1 { font-size: clamp(2.45rem, 12.5vw, 3.25rem); }
  .section-heading h2, .advantage-copy h2, .cta-panel h2, .detail-copy h1 { font-size: clamp(2rem, 10.5vw, 2.7rem); }
  .eyebrow { margin-bottom: 16px; font-size: .62rem; letter-spacing: .14em; }
  .hero { padding-block: 40px 58px; }
  .hero-text { margin-bottom: 26px; }
  .button { min-height: 50px; padding-inline: 16px; }
  .trust-row { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin-top: 38px; padding-top: 20px; }
  .trust-row span { line-height: 1.35; }
  .hero-visual { min-height: 345px; }
  .orbital-scene { inset: 0; }
  .particle-core { width: 74px; height: 74px; }
  .particle-core span { font-size: 1.12rem; }
  .data-card { padding: 10px 12px; }
  .data-card span, .data-card small { font-size: .54rem; }
  .data-card strong { font-size: .69rem; }
  .card-status { top: 10%; padding-left: 34px; }
  .card-status i { left: 14px; top: 18px; width: 8px; height: 8px; }
  .card-response { bottom: 12%; }
  .card-response strong { font-size: 1.25rem; }
  .interaction-hint { bottom: 1%; font-size: .49rem; }
  .signal-track { height: 54px; }
  .section { padding-block: 64px; }
  .section-heading { margin-bottom: 30px; }
  .services-grid, .advantage-grid, .feature-list { gap: 14px; }
  .service-content { padding: 2px 21px 23px; }
  .service-card h3 { font-size: 1.35rem; }
  .advantage-card, .feature-item { padding: 23px; }
  .advantage-card > span { margin-bottom: 22px; }
  .section-panel .advantage-layout { gap: 42px; }
  .cta-panel { padding: 52px 16px; border-radius: 24px; }
  .detail-hero { padding-block: 34px 58px; }
  .breadcrumb { margin-bottom: 22px; }
  .detail-frame { border-radius: 22px; }
  .floating-metric { right: 6px; bottom: 14px; padding: 11px 14px; }
  .floating-metric strong { font-size: .88rem; }
  .feature-section { padding-block: 62px 70px; }
  .feature-intro { margin-bottom: 32px; }
  .feature-item { min-height: 145px; }
  .systems-hero { padding-block: 48px 32px; }
  .systems-grid .system-card { min-height: 0; border-radius: 22px; }
  .system-visual { min-height: 180px; }
  .system-code { width: 82px; height: 82px; border-radius: 22px; font-size: 1.35rem; }
  .system-content { padding: 24px 20px; }
  .system-content h2 { font-size: 1.55rem; }
  .footer-main { gap: 20px; padding-bottom: 36px; }
  .footer-main nav { display: grid; grid-template-columns: 1fr 1fr; gap: 12px 18px; }
  .footer-bottom { font-size: .64rem; }
  .motion-toggle { left: 12px; bottom: 12px; width: 42px; height: 42px; justify-content: center; padding: 0; }
  .motion-toggle span { display: none; }
  .whatsapp-float { right: 12px; bottom: 12px; }
}
@media (max-width: 1024px) {
  .digital-hero { min-height: auto; grid-template-columns: 1fr; gap: 25px; padding-top: 72px; }
  .digital-hero-copy { max-width: 820px; }
  .digital-visual { width: min(100%, 720px); min-height: 540px; margin-inline: auto; }
  .digital-offers { grid-template-columns: repeat(2, 1fr); }
  .digital-steps { grid-template-columns: repeat(2, 1fr); }
  .digital-steps li { min-height: 220px; }
  .digital-fit-layout { grid-template-columns: 1fr; gap: 48px; }
  .digital-faq-section { grid-template-columns: 1fr; gap: 45px; }
}
@media (max-width: 760px) {
  .digital-hero { padding-block: 50px 76px; }
  .digital-hero-copy h1 { font-size: clamp(2.7rem, 12vw, 4.2rem); }
  .digital-proof { display: grid; gap: 9px; }
  .digital-visual { min-height: 455px; }
  .digital-console { inset: 5% 0 7%; border-radius: 24px; transform: rotateY(-3deg) rotateX(1deg); }
  .console-content { padding: 20px; }
  .console-chart { height: 110px; }
  .digital-float { min-width: 145px; padding: 11px 13px; }
  .float-sheet { left: -5px; }
  .float-system { right: -5px; }
  .digital-impact-grid { grid-template-columns: 1fr; padding-block: 8px; }
  .digital-impact-grid > div, .digital-impact-grid > div:first-child { min-height: 86px; padding: 15px 8px; border: 0; border-bottom: 1px solid var(--line); }
  .digital-impact-grid > div:last-child { border-bottom: 0; }
  .digital-offers { grid-template-columns: 1fr; }
  .digital-offers .feature-item { min-height: 0; }
  .digital-compare-section { padding-block: 80px; }
  .digital-compare { grid-template-columns: 1fr; gap: 16px; }
  .compare-arrow { min-height: 70px; transform: rotate(90deg); }
  .compare-arrow small { display: none; }
  .compare-card { padding: 28px; }
  .digital-fit { padding-block: 80px; }
  .digital-final-cta { padding-top: 0; }
}
@media (max-width: 480px) {
  .digital-hero { padding-block: 38px 62px; }
  .digital-hero-copy h1 { font-size: clamp(2.35rem, 11.8vw, 3.2rem); }
  .digital-visual { min-height: 390px; }
  .digital-console { inset: 7% 0 8%; }
  .console-top { height: 46px; padding-inline: 14px; }
  .console-top strong { font-size: .48rem; }
  .console-body { height: calc(100% - 46px); grid-template-columns: 42px 1fr; }
  .console-body aside { gap: 18px; padding-top: 18px; }
  .console-body aside b { width: 25px; height: 25px; }
  .console-body aside i { width: 14px; }
  .console-content { padding: 15px 13px; }
  .console-heading { margin-bottom: 12px; }
  .console-heading span { font-size: .78rem; }
  .console-metrics { gap: 7px; }
  .console-metrics > div { min-height: 70px; padding: 11px; }
  .console-metrics strong { font-size: .63rem; }
  .console-chart { height: 78px; gap: 5px; margin-top: 8px; padding: 13px 12px 0; }
  .console-flow { gap: 5px; padding: 10px 4px; font-size: .41rem; }
  .digital-float { min-width: 128px; }
  .digital-float strong { font-size: .64rem; }
  .float-sheet { top: 0; }
  .float-system { bottom: 0; }
  .digital-compare-heading h2, .digital-fit h2, .digital-faq-intro h2 { font-size: clamp(2rem, 10.5vw, 2.7rem); }
  .compare-card { padding: 24px 20px; }
  .compare-card h3 { font-size: 1.35rem; }
  .digital-steps { grid-template-columns: 1fr; }
  .digital-steps li { min-height: 0; padding: 24px; }
  .digital-steps li > span { margin-bottom: 32px; }
  .digital-tags { gap: 8px; }
  .digital-tags span { padding: 9px 12px; font-size: .66rem; }
  .digital-faq details { padding-inline: 18px; }
  .digital-faq summary { font-size: .82rem; }
}
.reduce-motion { scroll-behavior: auto; }
.reduce-motion *, .reduce-motion *::before, .reduce-motion *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
.reduce-motion .reveal { opacity: 1; transform: none; }
.reduce-motion .cursor-aura, .reduce-motion .scroll-progress, .reduce-motion .scroll-details { display: none; }
.reduce-motion .type-char { opacity: 1; filter: none; transform: none; }