:root {
  --bg: #f7faff;
  --bg-soft: #eef5ff;
  --surface: #ffffff;
  --surface-2: #eaf2fc;
  --line: rgba(23, 64, 108, .13);
  --text: #10233b;
  --muted: #587087;
  --primary: #174a96;
  --primary-2: #78bd2b;
  --success: #4f9825;
  --danger: #c43f4c;
  --radius: 18px;
  --shadow: 0 22px 60px rgba(35, 81, 129, .13);
  --container: 1180px;
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 88px; }
body { margin: 0; min-width: 0; color: var(--text); background: var(--bg); font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; font-size: 16px; line-height: 1.65; overflow-x: hidden; }
body.menu-open { overflow: hidden; }
a { color: inherit; text-decoration: none; }
img { display: block; max-width: 100%; }
button, input, select, textarea { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
:focus-visible { outline: 3px solid var(--primary); outline-offset: 3px; }
.container { width: min(100% - 32px, var(--container)); margin-inline: auto; }
.section { position: relative; padding: 82px 0; }
.section-alt { background: linear-gradient(180deg, rgba(255,255,255,.018), rgba(255,255,255,.035)); border-block: 1px solid var(--line); }
.skip-link { position: fixed; z-index: 999; top: 12px; left: 12px; padding: 10px 16px; color: #001521; background: var(--primary); border-radius: 8px; transform: translateY(-150%); }
.skip-link:focus { transform: none; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
.eyebrow { margin: 0 0 14px; color: var(--primary); font-size: .76rem; font-weight: 800; letter-spacing: .16em; text-transform: uppercase; }
.eyebrow span { display: inline-block; width: 7px; height: 7px; margin-right: 9px; background: var(--primary); border-radius: 50%; box-shadow: 0 0 16px var(--primary); }
h1, h2, h3, p { margin-top: 0; }
h1, h2, h3 { line-height: 1.12; letter-spacing: -.035em; }
h1 { max-width: 780px; margin-bottom: 22px; font-size: clamp(2.55rem, 6.7vw, 5rem); }
h2 { margin-bottom: 18px; font-size: clamp(2rem, 4.5vw, 3.4rem); }
h3 { font-size: 1.18rem; }
.section-heading { max-width: 720px; margin-bottom: 42px; }
.section-heading > p:not(.eyebrow) { color: var(--muted); font-size: 1.06rem; }
.section-heading.centered { margin-inline: auto; text-align: center; }
.button { display: inline-flex; min-height: 50px; align-items: center; justify-content: center; gap: 12px; padding: 12px 21px; color: #001522; background: linear-gradient(135deg, var(--primary), #66e6ff); border: 1px solid transparent; border-radius: 10px; box-shadow: 0 10px 34px rgba(45,216,245,.18); font-weight: 800; cursor: pointer; transition: transform .2s ease, box-shadow .2s ease; }
.button:hover { transform: translateY(-2px); box-shadow: 0 14px 38px rgba(45,216,245,.28); }
.button-secondary { color: var(--text); background: rgba(255,255,255,.035); border-color: var(--line); box-shadow: none; }
.button-small { min-height: 42px; padding: 8px 15px; font-size: .88rem; }
.text-link { color: var(--primary); font-weight: 750; }

.site-header { position: fixed; z-index: 100; inset: 0 0 auto; height: 74px; border-bottom: 1px solid transparent; transition: background .25s ease, border-color .25s ease, box-shadow .25s ease; }
.site-header.is-scrolled { background: rgba(6,16,29,.92); border-color: var(--line); box-shadow: 0 10px 32px rgba(0,0,0,.22); backdrop-filter: blur(14px); }
.header-inner { display: flex; height: 100%; align-items: center; justify-content: space-between; }
.brand { display: inline-flex; align-items: center; gap: 10px; font-size: .98rem; font-weight: 600; letter-spacing: -.02em; }
.brand img { border-radius: 9px; object-fit: cover; box-shadow: 0 5px 16px rgba(19,45,28,.18); }
.brand strong { color: var(--primary); }
.menu-toggle { display: grid; width: 46px; height: 46px; place-content: center; gap: 5px; color: var(--text); background: transparent; border: 1px solid var(--line); border-radius: 9px; cursor: pointer; }
.menu-toggle > span:not(.sr-only) { width: 21px; height: 2px; background: currentColor; transition: transform .2s ease, opacity .2s ease; }
.menu-toggle[aria-expanded="true"] > span:nth-child(2) { transform: translateY(7px) rotate(45deg); }
.menu-toggle[aria-expanded="true"] > span:nth-child(3) { opacity: 0; }
.menu-toggle[aria-expanded="true"] > span:nth-child(4) { transform: translateY(-7px) rotate(-45deg); }
.main-nav { position: fixed; inset: 74px 0 auto; display: grid; padding: 20px 24px 28px; background: #081523; border-bottom: 1px solid var(--line); box-shadow: var(--shadow); transform: translateY(-130%); visibility: hidden; transition: transform .25s ease, visibility .25s; }
.main-nav.is-open { transform: none; visibility: visible; }
.main-nav > a:not(.button) { padding: 10px 0; color: var(--muted); font-weight: 650; }

.hero { position: relative; display: grid; min-height: 820px; align-items: center; padding: 126px 0 72px; overflow: hidden; isolation: isolate; }
.hero::before { position: absolute; z-index: -2; inset: 0; background-image: linear-gradient(rgba(45,216,245,.035) 1px, transparent 1px), linear-gradient(90deg, rgba(45,216,245,.035) 1px, transparent 1px); background-size: 46px 46px; mask-image: linear-gradient(to bottom, black, transparent 90%); content: ""; }
.hero-glow { position: absolute; z-index: -1; top: -180px; right: -150px; width: 700px; height: 700px; background: radial-gradient(circle, rgba(45,216,245,.16), rgba(61,126,255,.05) 42%, transparent 70%); }
.hero-grid { display: grid; gap: 58px; align-items: center; }
.hero-lead { max-width: 690px; margin-bottom: 30px; color: var(--muted); font-size: clamp(1.05rem, 2.4vw, 1.25rem); }
.hero-actions { display: flex; flex-wrap: wrap; gap: 12px; }
.hero-tags { display: flex; flex-wrap: wrap; gap: 9px 20px; margin: 28px 0 0; padding: 0; color: #c9d6e6; list-style: none; font-size: .9rem; }
.hero-tags li::before { margin-right: 8px; color: var(--success); content: "✓"; font-weight: 900; }
.tech-visual { position: relative; min-height: 430px; border: 1px solid var(--line); border-radius: 28px; background: radial-gradient(circle at 50% 50%, rgba(45,216,245,.09), transparent 50%), rgba(8,23,39,.7); box-shadow: var(--shadow); overflow: hidden; }
.visual-grid { position: absolute; inset: 0; opacity: .5; background-image: linear-gradient(rgba(91,170,225,.08) 1px, transparent 1px), linear-gradient(90deg, rgba(91,170,225,.08) 1px, transparent 1px); background-size: 32px 32px; }
.core { position: absolute; top: 50%; left: 50%; display: grid; width: 104px; height: 104px; place-items: center; background: #0c2034; border: 1px solid rgba(45,216,245,.42); border-radius: 26px; box-shadow: 0 0 60px rgba(45,216,245,.2); transform: translate(-50%,-50%) rotate(45deg); }
.core img { transform: rotate(-45deg); }
.orbit { position: absolute; top: 50%; left: 50%; border: 1px solid rgba(45,216,245,.25); border-radius: 50%; transform: translate(-50%,-50%); }
.orbit-one { width: 250px; height: 250px; }
.orbit-two { width: 390px; height: 390px; border-style: dashed; }
.node { position: absolute; display: flex; align-items: center; gap: 8px; padding: 8px 11px; color: #d8e6f3; background: #0c1d2f; border: 1px solid var(--line); border-radius: 8px; box-shadow: 0 8px 26px rgba(0,0,0,.25); font-size: .76rem; }
.node span { color: var(--primary); font-family: ui-monospace, monospace; font-size: .68rem; }
.node-a { top: 14%; left: 9%; }.node-b { top: 18%; right: 7%; }.node-c { bottom: 22%; left: 6%; }.node-d { right: 6%; bottom: 25%; }
.status-card { position: absolute; right: 6%; bottom: 5%; left: 6%; display: grid; grid-template-columns: auto 1fr auto; gap: 10px; align-items: center; padding: 13px 16px; color: var(--muted); background: rgba(6,16,29,.88); border: 1px solid var(--line); border-radius: 10px; font-size: .77rem; }
.status-card i { width: 8px; height: 8px; background: var(--success); border-radius: 50%; box-shadow: 0 0 12px var(--success); }.status-card strong { color: var(--success); }

.services-grid, .project-grid { display: grid; gap: 15px; }
.service-card { display: flex; min-height: 310px; flex-direction: column; padding: 25px; background: linear-gradient(145deg, rgba(18,39,62,.9), rgba(10,25,42,.9)); border: 1px solid var(--line); border-radius: var(--radius); transition: border-color .25s ease, transform .25s ease, background .25s ease; }
.service-card:hover, .service-card:focus-within { border-color: rgba(45,216,245,.46); transform: translateY(-5px); }
.service-card .icon-box { display: grid; width: 46px; height: 46px; margin-bottom: 30px; place-items: center; color: var(--primary); background: rgba(45,216,245,.08); border: 1px solid rgba(45,216,245,.25); border-radius: 10px; font-family: ui-monospace, monospace; font-weight: 800; }
.icon-box svg { width: 24px; height: 24px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.service-card p { color: var(--muted); font-size: .93rem; }
.service-card a { margin-top: auto; color: var(--primary); font-weight: 750; }
.about-grid { display: grid; gap: 46px; align-items: center; }
.large-copy { color: #dce8f4; font-size: 1.15rem; }
.about-grid p:not(.eyebrow) { color: var(--muted); }
.about-note { display: grid; gap: 4px; margin-top: 30px; padding: 20px; background: rgba(45,216,245,.055); border: 1px solid rgba(45,216,245,.19); border-radius: 12px; }
.about-note strong { color: var(--primary); }.about-note span { color: var(--muted); font-size: .92rem; }
.check-grid { display: grid; gap: 10px; margin: 0; padding: 18px; background: rgba(255,255,255,.02); border: 1px solid var(--line); border-radius: var(--radius); list-style: none; }
.check-grid li { padding: 17px; background: rgba(255,255,255,.024); border-radius: 10px; color: #dce7f2; font-weight: 650; }
.check-grid li::before { display: inline-grid; width: 25px; height: 25px; margin-right: 11px; place-items: center; color: var(--primary); background: rgba(45,216,245,.09); border-radius: 50%; content: "✓"; }
.process-list { display: grid; gap: 12px; margin: 0; padding: 0; list-style: none; }
.process-list li { position: relative; padding: 24px; background: var(--surface); border: 1px solid var(--line); border-radius: 14px; }
.process-list li > span { display: block; margin-bottom: 30px; color: var(--primary); font-family: ui-monospace, monospace; font-weight: 800; }
.process-list h3 { margin-bottom: 10px; }.process-list p { margin: 0; color: var(--muted); font-size: .9rem; }
.project-grid article { position: relative; min-height: 200px; padding: 25px; background: var(--surface); border: 1px solid var(--line); border-radius: 14px; overflow: hidden; }
.project-grid article::after { position: absolute; right: -38px; bottom: -48px; width: 130px; height: 130px; background: radial-gradient(circle, rgba(45,216,245,.14), transparent 66%); content: ""; }
.project-grid article > span { display: block; margin-bottom: 30px; color: var(--primary); font-size: .7rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.project-grid p, .project-note { color: var(--muted); }
.project-note { max-width: 680px; margin: 28px auto 0; text-align: center; font-size: .92rem; }
.features { display: grid; gap: 10px; }.features div { padding: 21px; background: var(--surface); border-left: 3px solid var(--primary); border-radius: 8px; font-weight: 700; }
.coverage { background: linear-gradient(120deg, #0c2138, #0a1829); border-block: 1px solid var(--line); }
.coverage-inner { display: grid; gap: 32px; align-items: center; }
.coverage-inner > div:first-child p:last-child { max-width: 650px; color: var(--muted); }
.coverage-card { display: flex; gap: 18px; padding: 26px; background: rgba(5,15,27,.55); border: 1px solid var(--line); border-radius: var(--radius); }
.coverage-card small, .coverage-card strong { display: block; }.coverage-card small { color: var(--muted); }.coverage-card strong { margin: 4px 0 10px; font-size: 1.2rem; }.coverage-card p { margin: 0; color: var(--muted); font-size: .9rem; }
.pulse { flex: 0 0 13px; height: 13px; margin-top: 7px; background: var(--primary); border: 3px solid #0b283e; border-radius: 50%; box-shadow: 0 0 0 5px rgba(45,216,245,.14); }
.faq-layout { display: grid; gap: 35px; }
.faq-item { border-bottom: 1px solid var(--line); }.faq-item h3 { margin: 0; }
.faq-question { display: flex; width: 100%; min-height: 68px; align-items: center; justify-content: space-between; gap: 20px; padding: 15px 0; color: var(--text); background: none; border: 0; text-align: left; cursor: pointer; font-weight: 700; }
.faq-question span { color: var(--primary); font-size: 1.5rem; transition: transform .2s; }.faq-question[aria-expanded="true"] span { transform: rotate(45deg); }
.faq-answer { padding: 0 38px 16px 0; color: var(--muted); }.faq-answer p { margin: 0; }

.contact-section { background: radial-gradient(circle at 20% 20%, rgba(45,216,245,.07), transparent 35%), var(--bg-soft); border-top: 1px solid var(--line); }
.contact-grid { display: grid; gap: 24px; }
.contact-details { display: grid; gap: 10px; align-content: start; }
.contact-card { display: grid; min-height: 76px; grid-template-columns: 42px 1fr auto; gap: 13px; align-items: center; padding: 14px 16px; background: var(--surface); border: 1px solid var(--line); border-radius: 12px; }
a.contact-card:hover { border-color: rgba(45,216,245,.4); }
.contact-card > span { display: grid; width: 42px; height: 42px; place-items: center; color: var(--primary); background: rgba(45,216,245,.08); border-radius: 9px; font-weight: 800; }
.contact-card small, .contact-card strong { display: block; }.contact-card small, .hours small { color: var(--muted); }.contact-card strong { font-size: .87rem; overflow-wrap: anywhere; }.contact-card b { color: var(--primary); }
.hours { margin-top: 8px; padding: 20px; border-left: 2px solid var(--primary); }.hours strong { display: block; }.hours p { margin: 6px 0 0; color: var(--muted); font-size: .85rem; }
.contact-form { padding: 22px; background: rgba(13,28,46,.9); border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow); }
.form-row { display: grid; gap: 16px; }
.field { margin-bottom: 17px; }
.field label { display: block; margin-bottom: 7px; color: #dce7f4; font-size: .88rem; font-weight: 700; }.field label span, .field > small { color: var(--muted); font-weight: 400; }
.field input, .field select, .field textarea { width: 100%; color: var(--text); background: #081522; border: 1px solid #294058; border-radius: 8px; }
.field input, .field select { height: 48px; padding: 0 13px; }.field textarea { min-height: 130px; padding: 12px 13px; resize: vertical; }
.field input:hover, .field select:hover, .field textarea:hover { border-color: #406581; }.field input:focus, .field select:focus, .field textarea:focus { border-color: var(--primary); outline: 2px solid rgba(45,216,245,.15); }
.field [aria-invalid="true"] { border-color: var(--danger); }.field-error { display: block; margin-top: 5px; color: var(--danger); font-size: .8rem; }
.checkbox { display: flex; gap: 10px; align-items: flex-start; margin: 4px 0 20px; color: var(--muted); font-size: .84rem; }.checkbox input { flex: 0 0 auto; width: 19px; height: 19px; margin-top: 2px; accent-color: var(--primary); }.checkbox a { color: var(--primary); text-decoration: underline; }
.submit-button { width: 100%; border: 0; }.submit-button:disabled { opacity: .7; cursor: wait; }.submit-button i { display: none; width: 17px; height: 17px; border: 2px solid currentColor; border-top-color: transparent; border-radius: 50%; animation: spin .7s linear infinite; }.submit-button.is-loading i { display: block; }
.form-status { margin-top: 14px; padding: 12px; background: rgba(255,255,255,.04); border-left: 3px solid var(--primary); border-radius: 6px; font-size: .88rem; }.form-status[data-type="success"] { color: var(--success); border-color: var(--success); }.form-status[data-type="error"] { color: var(--danger); border-color: var(--danger); }
.honeypot { position: absolute !important; left: -10000px !important; width: 1px; height: 1px; overflow: hidden; }

.site-footer { padding: 60px 0 24px; background: #040b14; border-top: 1px solid var(--line); }
.footer-grid { display: grid; gap: 35px; }.footer-grid > div { display: grid; align-content: start; gap: 9px; }.footer-grid > div:first-child p { max-width: 320px; margin: 10px 0 0; color: var(--muted); }
.footer-grid h2 { margin: 0 0 9px; font-size: .86rem; letter-spacing: .08em; text-transform: uppercase; }.footer-grid a, .footer-grid span { color: var(--muted); font-size: .88rem; }.footer-grid a:hover { color: var(--primary); }
.footer-bottom { display: flex; flex-wrap: wrap; gap: 5px 30px; justify-content: space-between; margin-top: 42px; padding-top: 20px; color: #8295a9; border-top: 1px solid var(--line); font-size: .78rem; }.footer-bottom p { margin: 0; }
.whatsapp-float, .back-to-top { position: fixed; z-index: 80; right: 18px; display: grid; width: 52px; height: 52px; place-items: center; border-radius: 50%; font-weight: 900; }
.whatsapp-float { bottom: 18px; color: #001d11; background: #54dd96; box-shadow: 0 10px 30px rgba(0,0,0,.35); }
.back-to-top { bottom: 82px; color: var(--text); background: #15283d; border: 1px solid var(--line); opacity: 0; transform: translateY(10px); visibility: hidden; transition: .2s; cursor: pointer; }.back-to-top.is-visible { opacity: 1; transform: none; visibility: visible; }
[data-reveal] { opacity: 1; transform: none; }
.js [data-reveal] { opacity: 0; transform: translateY(20px); transition: opacity .6s ease, transform .6s ease; }
.js [data-reveal].is-visible { opacity: 1; transform: none; }
@keyframes spin { to { transform: rotate(360deg); } }

/* Identidad clara: superficies luminosas, profundidad suave y movimiento técnico. */
.section-alt { background: linear-gradient(180deg, #f1f6fd, #f8fbff); }
.skip-link { color: #fff; }
.eyebrow span { box-shadow: 0 0 12px rgba(8,104,242,.45); }
.button { color: #fff; background: linear-gradient(135deg, #174a96, #2868ae); box-shadow: 0 10px 30px rgba(23,74,150,.2); }
.button:hover { box-shadow: 0 15px 38px rgba(8,104,242,.28); }
.button-secondary { color: var(--primary); background: rgba(255,255,255,.78); border-color: rgba(8,104,242,.22); box-shadow: 0 8px 24px rgba(35,81,129,.07); }
.site-header.is-scrolled { background: rgba(255,255,255,.9); box-shadow: 0 10px 32px rgba(35,81,129,.08); }
.main-nav { background: #fff; }
.hero::before { background-image: linear-gradient(rgba(8,104,242,.055) 1px, transparent 1px), linear-gradient(90deg, rgba(8,104,242,.055) 1px, transparent 1px); }
.hero-glow { background: radial-gradient(circle, rgba(120,189,43,.2), rgba(23,74,150,.09) 42%, transparent 70%); animation: glow-drift 8s ease-in-out infinite alternate; }
.hero-tags { color: #38546d; }
.tech-visual { border-color: rgba(23,74,150,.14); background: radial-gradient(circle at 50% 50%, rgba(120,189,43,.16), rgba(23,74,150,.06) 48%, transparent 68%), rgba(255,255,255,.74); }
.visual-grid { opacity: .7; background-image: linear-gradient(rgba(8,104,242,.07) 1px, transparent 1px), linear-gradient(90deg, rgba(8,104,242,.07) 1px, transparent 1px); }
.core { width: 126px; height: 126px; background: rgba(255,255,255,.96); border: 1px solid rgba(23,74,150,.18); border-radius: 50%; box-shadow: 0 20px 60px rgba(23,74,150,.16), 0 0 0 12px rgba(120,189,43,.07); transform: translate(-50%,-50%); animation: core-float 4.5s ease-in-out infinite; overflow: visible; }
.live-graph { width: 106px; height: 106px; overflow: visible; }
.graph-ring { fill: none; stroke: rgba(23,74,150,.12); stroke-width: 1.5; stroke-dasharray: 5 5; transform-origin: center; animation: graph-ring-spin 18s linear infinite; }
.graph-area { fill: url(#graph-gradient); opacity: .09; }
.graph-line { fill: none; stroke: url(#graph-gradient); stroke-width: 4; stroke-linecap: round; stroke-linejoin: round; stroke-dasharray: 150; stroke-dashoffset: 150; animation: graph-draw 3.2s ease-in-out infinite alternate; }
.graph-points circle { fill: #fff; stroke: #78bd2b; stroke-width: 3; transform-box: fill-box; transform-origin: center; animation: graph-point 1.8s ease-in-out infinite; }
.graph-points circle:nth-child(2), .graph-points circle:nth-child(5) { animation-delay: -.6s; }
.graph-points circle:nth-child(3), .graph-points circle:nth-child(6) { animation-delay: -1.1s; }
.system-scanner { position: absolute; inset: 70px 18% 82px; }
.scanner-window { position: absolute; inset: 0; background: rgba(255,255,255,.9); border: 1px solid rgba(23,74,150,.18); border-radius: 22px; box-shadow: 0 22px 55px rgba(35,81,129,.14); overflow: hidden; animation: scanner-float 5s ease-in-out infinite; }
.scanner-bar { display: flex; align-items: center; gap: 6px; height: 38px; padding: 0 14px; background: linear-gradient(90deg, #eef5ff, #f5faee); border-bottom: 1px solid rgba(23,74,150,.11); }
.scanner-bar > span { width: 7px; height: 7px; background: #b9c9d8; border-radius: 50%; }.scanner-bar > span:first-child { background: #78bd2b; }.scanner-bar > span:nth-child(2) { background: #67cddd; }
.scanner-bar small { margin-left: auto; color: #49657d; font-size: .56rem; font-weight: 800; letter-spacing: .09em; text-transform: uppercase; }
.scanner-body { position: relative; display: grid; height: calc(100% - 38px); place-content: center; text-align: center; background: radial-gradient(circle at 50% 42%, rgba(120,189,43,.15), transparent 38%), linear-gradient(rgba(8,104,242,.035) 1px, transparent 1px), linear-gradient(90deg, rgba(8,104,242,.035) 1px, transparent 1px); background-size: auto, 18px 18px, 18px 18px; overflow: hidden; }
.scan-beam { position: absolute; z-index: 4; top: 18%; right: 8%; left: 8%; height: 2px; background: linear-gradient(90deg, transparent, #55c6dc 18%, #78bd2b 50%, #55c6dc 82%, transparent); box-shadow: 0 0 20px rgba(120,189,43,.72), 0 10px 34px rgba(85,198,220,.24); animation: scan-system 3.8s ease-in-out infinite; }
.scan-beam::after { position: absolute; right: 0; bottom: 0; left: 0; height: 46px; background: linear-gradient(to top, rgba(120,189,43,.09), transparent); content: ""; }
.scan-target { position: relative; display: grid; width: 104px; height: 104px; margin: 0 auto 17px; place-items: center; }
.scan-target i { position: absolute; inset: 0; border: 1px solid rgba(23,74,150,.18); border-radius: 50%; animation: scan-pulse 2.6s ease-out infinite; }.scan-target i:nth-child(2) { inset: 15px; border-style: dashed; animation-delay: -1.3s; }
.scan-target b { position: relative; z-index: 2; display: grid; width: 58px; height: 58px; place-items: center; color: #fff; background: linear-gradient(145deg, #1d6fb6, #58b76f); border: 5px solid rgba(255,255,255,.92); border-radius: 19px; box-shadow: 0 14px 32px rgba(23,74,150,.2); font-size: 1.55rem; transform: rotate(-4deg); }
.scanner-copy { display: grid; gap: 3px; }.scanner-copy strong { color: #163c63; font-size: .95rem; }.scanner-copy span { color: #607b91; font-size: .65rem; }
.scanner-progress { width: 142px; height: 5px; margin: 13px auto 0; background: #e6eef5; border-radius: 99px; overflow: hidden; }.scanner-progress i { display: block; width: 68%; height: 100%; background: linear-gradient(90deg, #2c83c7, #78bd2b); border-radius: inherit; animation: scan-progress 3.8s ease-in-out infinite; }
.scan-spark { position: absolute; width: 10px; height: 10px; background: #78bd2b; border: 2px solid #fff; border-radius: 50%; box-shadow: 0 0 0 5px rgba(120,189,43,.1), 0 0 16px rgba(120,189,43,.48); animation: spark-float 4s ease-in-out infinite; }.spark-one { top: 8%; left: -8%; }.spark-two { top: 45%; right: -10%; background: #2e83c7; animation-delay: -1.4s; }.spark-three { bottom: 5%; left: -2%; width: 8px; height: 8px; animation-delay: -2.5s; }
.orbit { border-color: rgba(8,104,242,.23); }
.orbit-two { animation: orbit-spin 30s linear infinite; }
.node { color: #244661; background: rgba(255,255,255,.94); box-shadow: 0 8px 26px rgba(35,81,129,.12); animation: node-float 5s ease-in-out infinite; }
.node-b, .node-c { animation-delay: -2.2s; }
.status-card { background: rgba(255,255,255,.92); box-shadow: 0 8px 24px rgba(35,81,129,.09); }
.service-card { background: #fff; box-shadow: 0 12px 36px rgba(35,81,129,.06); transition: border-color .25s ease, transform .25s ease, box-shadow .25s ease; }
.service-card:hover, .service-card:focus-within { border-color: rgba(8,104,242,.36); transform: translateY(-6px); box-shadow: 0 20px 44px rgba(35,81,129,.12); }
.service-card .icon-box { background: rgba(8,104,242,.07); border-color: rgba(8,104,242,.18); transition: transform .3s ease, background .3s ease; }
.service-card:hover .icon-box { transform: rotate(-5deg) scale(1.08); background: rgba(8,104,242,.12); }
.large-copy { color: #294861; }
.about-note { background: rgba(8,104,242,.055); border-color: rgba(8,104,242,.16); }
.check-grid { background: #fff; box-shadow: var(--shadow); }
.check-grid li { color: #294861; background: #f5f8fc; }
.check-grid li::before { background: rgba(8,104,242,.08); }
.process-list li, .project-grid article, .features div { box-shadow: 0 10px 28px rgba(35,81,129,.055); }
.project-grid article::after { background: radial-gradient(circle, rgba(8,104,242,.12), transparent 66%); transition: transform .35s ease; }
.project-grid article:hover::after { transform: scale(1.35); }
.coverage { background: linear-gradient(120deg, #e8f2ff, #f3fbff); }
.coverage-card { background: rgba(255,255,255,.84); box-shadow: 0 14px 34px rgba(35,81,129,.08); }
.pulse { border-color: #dcecff; box-shadow: 0 0 0 5px rgba(8,104,242,.12); animation: pulse-ring 2.2s ease-out infinite; }
.contact-section { background: radial-gradient(circle at 20% 20%, rgba(8,169,202,.09), transparent 35%), var(--bg-soft); }
.contact-card { transition: transform .22s ease, border-color .22s ease, box-shadow .22s ease; }
a.contact-card:hover { border-color: rgba(8,104,242,.34); transform: translateX(4px); box-shadow: 0 10px 26px rgba(35,81,129,.08); }
.contact-card > span { background: rgba(8,104,242,.08); }
.contact-card > span.whatsapp-mark { background: #38b875; }
.whatsapp-mark img, .whatsapp-float img { display: block; }
.contact-form { background: rgba(255,255,255,.94); }
.field label { color: #294861; }
.field input, .field select, .field textarea { color: var(--text); background: #fff; border-color: #b9cada; }
.field input:hover, .field select:hover, .field textarea:hover { border-color: #7595b1; }
.field input:focus, .field select:focus, .field textarea:focus { outline-color: rgba(8,104,242,.11); }
.form-status { background: rgba(8,104,242,.05); }
.site-footer { color: #edf5ff; background: #10233b; border-color: rgba(255,255,255,.1); }
.site-footer .brand strong { color: #9ed65d; }
.footer-grid > div:first-child p, .footer-grid a, .footer-grid span { color: #b8c8d8; }
.footer-grid a:hover { color: #67d8ef; }
.footer-bottom { color: #98adc2; border-color: rgba(255,255,255,.12); }
.whatsapp-float { box-shadow: 0 10px 30px rgba(35,81,129,.24); animation: float-button 3s ease-in-out infinite; }
.back-to-top { background: #fff; box-shadow: 0 8px 24px rgba(35,81,129,.12); }
.js [data-reveal] { transform: translateY(24px) scale(.985); transition-duration: .7s; }
.js [data-reveal].is-visible { transform: translateY(0) scale(1); }

@keyframes glow-drift { to { transform: translate(-55px, 40px) scale(1.08); } }
@keyframes orbit-spin { to { transform: translate(-50%,-50%) rotate(360deg); } }
@keyframes core-float { 0%,100% { transform: translate(-50%,-50%) translateY(0); } 50% { transform: translate(-50%,-50%) translateY(-8px); } }
@keyframes node-float { 0%,100% { translate: 0 0; } 50% { translate: 0 -5px; } }
@keyframes pulse-ring { 0%,100% { box-shadow: 0 0 0 4px rgba(8,104,242,.12); } 50% { box-shadow: 0 0 0 9px rgba(8,104,242,0); } }
@keyframes float-button { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-5px); } }
@keyframes graph-draw { 55%,100% { stroke-dashoffset: 0; } }
@keyframes graph-ring-spin { to { transform: rotate(360deg); } }
@keyframes graph-point { 0%,100% { transform: scale(.8); opacity: .7; } 50% { transform: scale(1.35); opacity: 1; } }
@keyframes scanner-float { 0%,100% { transform: translateY(0) rotate(-.4deg); } 50% { transform: translateY(-7px) rotate(.4deg); } }
@keyframes scan-system { 0%,100% { top: 18%; opacity: .55; } 50% { top: 76%; opacity: 1; } }
@keyframes scan-pulse { 0% { opacity: .8; transform: scale(.78); } 75%,100% { opacity: 0; transform: scale(1.2); } }
@keyframes scan-progress { 0%,100% { width: 28%; } 50% { width: 94%; } }
@keyframes spark-float { 0%,100% { transform: translate(0,0); } 50% { transform: translate(7px,-10px); } }

/* Páginas internas */
.inner-hero { position: relative; padding: 154px 0 76px; overflow: hidden; background: linear-gradient(145deg, #f7faff, #edf5ff 64%, #f2fae9); border-bottom: 1px solid var(--line); }
.inner-hero::after { position: absolute; top: -170px; right: -120px; width: 500px; height: 500px; border-radius: 50%; background: radial-gradient(circle, rgba(120,189,43,.2), transparent 68%); content: ""; animation: glow-drift 8s ease-in-out infinite alternate; }
.inner-hero .container { position: relative; z-index: 1; }
.inner-hero h1 { max-width: 850px; margin-bottom: 18px; font-size: clamp(2.5rem, 6vw, 4.7rem); }
.inner-hero p:not(.eyebrow) { max-width: 740px; margin-bottom: 0; color: var(--muted); font-size: 1.14rem; }
.breadcrumbs { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 24px; color: var(--muted); font-size: .84rem; }
.breadcrumbs a { color: var(--primary); font-weight: 700; }
.page-content { padding: 72px 0 92px; }
.content-grid { display: grid; gap: 18px; }
.detail-card { padding: 28px; background: #fff; border: 1px solid var(--line); border-radius: var(--radius); box-shadow: 0 12px 36px rgba(35,81,129,.06); transition: transform .25s ease, border-color .25s ease, box-shadow .25s ease; }
.detail-card:hover, .detail-card:focus-within { transform: translateY(-5px); border-color: rgba(120,189,43,.55); box-shadow: 0 20px 44px rgba(35,81,129,.11); }
.detail-card .number { display: inline-grid; width: 40px; height: 40px; margin-bottom: 22px; place-items: center; color: #fff; background: linear-gradient(135deg, var(--primary), #2868ae); border-radius: 10px; font-weight: 800; }
.detail-card p, .detail-card li { color: var(--muted); }
.detail-card ul { margin: 16px 0 0; padding-left: 20px; }
.detail-card .text-link { display: inline-block; margin-top: 14px; }
.page-cta { display: grid; gap: 18px; align-items: center; margin-top: 50px; padding: 34px; color: #fff; background: linear-gradient(125deg, #123c7e, #174a96 60%, #477f29); border-radius: 22px; box-shadow: var(--shadow); }
.page-cta h2 { margin-bottom: 8px; font-size: clamp(1.7rem, 4vw, 2.5rem); }
.page-cta p { margin: 0; color: #dbe7f7; }
.page-cta .button { background: #fff; color: #174a96; box-shadow: none; }
.active-page { color: var(--primary) !important; }
.main-nav > a.active-page:not(.button) { position: relative; }
.main-nav > a.active-page:not(.button)::after { position: absolute; right: 0; bottom: 3px; left: 0; height: 2px; background: var(--primary-2); border-radius: 2px; content: ""; }
.detail-card h2 { font-size: 1.42rem; }
.faq-item h2 { margin: 0; font-size: inherit; }
.contact-form > h2 { margin-bottom: 24px; font-size: 1.8rem; }
.faq-page .faq-list { max-width: 860px; margin-inline: auto; }
.contact-page-grid { display: grid; gap: 26px; }
.approach-visual { position: relative; min-height: 460px; max-width: 520px; margin-inline: auto; padding: 52px 54px 88px; background: linear-gradient(145deg, #edf6ff, #f8fbff 56%, #eff8e6); border: 1px solid rgba(23,74,150,.14); border-radius: 30px; box-shadow: 0 25px 70px rgba(35,81,129,.13); overflow: hidden; }
.approach-visual::before { position: absolute; inset: 0; opacity: .52; background-image: linear-gradient(rgba(8,104,242,.055) 1px, transparent 1px), linear-gradient(90deg, rgba(8,104,242,.055) 1px, transparent 1px); background-size: 28px 28px; content: ""; }
.approach-glow { position: absolute; top: -80px; right: -80px; width: 260px; height: 260px; background: radial-gradient(circle, rgba(120,189,43,.27), transparent 68%); border-radius: 50%; animation: glow-drift 7s ease-in-out infinite alternate; }
.approach-panel { position: relative; z-index: 2; display: grid; gap: 10px; padding: 20px; background: rgba(255,255,255,.9); border: 1px solid rgba(23,74,150,.13); border-radius: 20px; box-shadow: 0 18px 42px rgba(35,81,129,.12); transform: rotate(-1.2deg); }
.approach-heading { display: flex; align-items: center; justify-content: space-between; margin-bottom: 4px; color: #607b91; font-size: .67rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }.approach-heading b { padding: 5px 8px; color: #39722a; background: #edf8e4; border-radius: 99px; font-size: .58rem; }
.approach-step { position: relative; display: grid; grid-template-columns: auto 1fr auto; gap: 11px; align-items: center; padding: 12px; background: #f7faff; border: 1px solid #e0eaf3; border-radius: 13px; animation: approach-step 5.4s ease-in-out infinite; }.approach-step::after { position: absolute; bottom: -11px; left: 25px; height: 10px; border-left: 1px dashed rgba(23,74,150,.3); content: ""; }.approach-step:last-child::after { display: none; }
.approach-step > i { display: grid; width: 30px; height: 30px; place-items: center; color: #1c68ab; background: #e7f2ff; border-radius: 9px; font-size: .72rem; font-style: normal; font-weight: 900; }.approach-step div { display: grid; }.approach-step small { color: #6c8599; font-size: .59rem; }.approach-step strong { color: #173b5e; font-size: .78rem; }.approach-step > span { display: grid; width: 22px; height: 22px; place-items: center; color: #fff; background: #78bd2b; border-radius: 50%; font-size: .65rem; box-shadow: 0 0 0 5px rgba(120,189,43,.1); }
.approach-step.step-two { animation-delay: -1.8s; }.approach-step.step-three { animation-delay: -3.6s; }
.approach-result { position: absolute; z-index: 3; right: 28px; bottom: 34px; display: grid; grid-template-columns: auto 1fr; gap: 11px; align-items: center; padding: 14px 18px; background: linear-gradient(135deg, #1d65a4, #247eb6 62%, #5d9f3b); border: 4px solid rgba(255,255,255,.94); border-radius: 16px; box-shadow: 0 17px 34px rgba(23,74,150,.25); animation: result-float 4.2s ease-in-out infinite; }.approach-result > span { display: grid; width: 28px; height: 28px; place-items: center; color: #39722a; background: #eaf8dd; border-radius: 9px; font-weight: 900; }.approach-result div { display: grid; }.approach-result small { color: #d8ebf6; font-size: .58rem; }.approach-result strong { color: #fff; font-size: .75rem; }
@keyframes approach-step { 0%,100% { transform: translateX(0); } 50% { transform: translateX(4px); } }
@keyframes result-float { 0%,100% { transform: translateY(0) rotate(1deg); } 50% { transform: translateY(-7px) rotate(-1deg); } }

@media (min-width: 700px) {
  .content-grid.two { grid-template-columns: repeat(2, 1fr); }
  .content-grid.three { grid-template-columns: repeat(3, 1fr); }
  .page-cta { grid-template-columns: 1fr auto; }
}
@media (min-width: 900px) {
  .contact-page-grid { grid-template-columns: .8fr 1.2fr; }
}
@media (max-width: 1079px) {
  .main-nav > a.active-page:not(.button)::after { right: auto; width: 42px; }
}

.simple-page { min-height: 100vh; padding-top: 110px; }.prose { max-width: 820px; }.prose h1 { font-size: clamp(2.2rem, 6vw, 4rem); }.prose h2 { margin-top: 36px; font-size: 1.45rem; }.prose p, .prose li { color: var(--muted); }.prose a { color: var(--primary); text-decoration: underline; }.error-page { display: grid; min-height: 100vh; place-items: center; text-align: center; }.error-code { margin: 0; color: var(--primary); font: 800 clamp(6rem, 24vw, 12rem)/1 ui-monospace, monospace; opacity: .14; }

@media (min-width: 600px) {
  .services-grid, .project-grid, .features { grid-template-columns: repeat(2, 1fr); }
  .check-grid, .form-row, .footer-grid { grid-template-columns: repeat(2, 1fr); }
  .contact-form { padding: 32px; }
}
@media (min-width: 850px) {
  .hero-grid { grid-template-columns: 1.08fr .92fr; }
  .about-grid, .contact-grid, .coverage-inner { grid-template-columns: repeat(2, 1fr); }
  .faq-layout { grid-template-columns: .8fr 1.2fr; gap: 70px; }
  .process-list { grid-template-columns: repeat(5, 1fr); }
  .process-list li:not(:last-child)::after { position: absolute; z-index: 2; top: 38px; right: -17px; width: 22px; border-top: 1px dashed var(--primary); content: ""; }
  .footer-grid { grid-template-columns: 1.5fr repeat(3, 1fr); }
}
@media (min-width: 1080px) {
  .menu-toggle { display: none; }
  .main-nav { position: static; display: flex; align-items: center; gap: 22px; padding: 0; background: none; border: 0; box-shadow: none; transform: none; visibility: visible; }
  .main-nav > a:not(.button) { padding: 8px 0; font-size: .82rem; }
  .services-grid, .project-grid { grid-template-columns: repeat(3, 1fr); }
  .features { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 420px) {
  .container { width: min(100% - 24px, var(--container)); }
  .hero-actions .button { width: 100%; }
  .tech-visual { min-height: 380px; }.orbit-two { width: 320px; height: 320px; }.node { font-size: .67rem; }.node-b, .node-d { right: 3%; }.node-a, .node-c { left: 3%; }
  .system-scanner { inset: 76px 15% 84px; }
  .scanner-window { animation-duration: 6s; }
  .approach-visual { min-height: 420px; padding: 42px 22px 82px; }
  .approach-result { right: 16px; bottom: 28px; }
}
@media (max-width: 600px) {
  .whatsapp-float { transition: opacity .22s ease, transform .22s ease, visibility .22s; }
  .whatsapp-float.is-hero-visible { opacity: 0; transform: translateY(14px); visibility: hidden; animation: none; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
  .js [data-reveal] { opacity: 1; transform: none; }
}