/* ARP 02 — a precise, theme-aware infrastructure identity. */
.technology-catalog {display:grid;gap:30px;}
.technology-family {padding:34px;border:1px solid var(--line);border-radius:18px;background:var(--surface-2);}
.technology-family header {display:flex;gap:24px;align-items:flex-start;margin-bottom:28px;}
.technology-index {font:600 .75rem ui-monospace,monospace;color:var(--accent);padding-top:5px;}
.technology-family h2 {font-size:1.65rem;margin-bottom:10px;}
.technology-family header p {margin:0;font-size:.91rem;color:var(--muted);}
.technology-tiles {display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px;list-style:none;margin:0;padding:0;}
.technology-tiles li {display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:17px;text-align:center;background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:24px 12px;min-width:0;color:var(--ink);font-size:.83rem;font-weight:600;transition:border-color .2s,transform .2s;}
.technology-tiles li:hover {border-color:var(--accent);transform:translateY(-3px);}
.technology-logo {display:grid;place-items:center;width:82px;height:68px;border-radius:10px;flex:none;}
.vendor-logo {background:#fff;border:1px solid #e1e8ef;}
.technology-logo img {width:60px;height:44px;object-fit:contain;}
.capability-icon {color:var(--accent);background:var(--surface-2);border:1px solid var(--line);}
@media(max-width:900px){.technology-tiles{grid-template-columns:repeat(3,minmax(0,1fr));}}
@media(max-width:540px){.technology-family{padding:22px 16px;}.technology-family header{gap:12px;}.technology-family h2{font-size:1.4rem;}.technology-tiles{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;}.technology-tiles li{font-size:.78rem;padding:18px 8px;}}
:root { --container:min(1280px,calc(100% - 64px)); --radius:20px; --hero-bg:#f5f9fc; --accent:#0864d9; --grid-color:rgba(20,84,133,.065); }
html[data-theme="dark"] { --surface:#050f1d; --surface-2:#091827; --surface-3:#102238; --line:#1c3044; --ink:#edf7ff; --text:#a9bdd0; --muted:#8ba6bc; --hero-bg:#03101d; --accent:#5cddf7; --grid-color:rgba(66,167,218,.065); }
body { overflow-wrap:break-word; }
.site-header { height:94px; --header:94px; background:color-mix(in srgb,var(--surface) 94%,transparent); }
.official-brand { display:block; width:146px; flex:none; }
.official-brand img { width:100%; height:66px; object-fit:contain; border-radius:5px; }
.theme-dark { display:none; }
html[data-theme="dark"] .theme-dark { display:block; }
html[data-theme="dark"] .theme-light { display:none; }
.brand { flex:none; }
.site-nav { gap:22px; }
.site-nav .button { padding:0 16px; font-size:.77rem; }
.theme-control { padding:4px; border-radius:9px; }
.theme-control button { width:46px; height:34px; border-radius:6px; font-size:.67rem; font-weight:700; }
.theme-control button[aria-pressed="true"] { background:var(--blue); color:#fff; }
.button { gap:18px; border-radius:7px; box-shadow:none; font-size:.83rem; }
.button:hover { box-shadow:0 8px 30px #1360e62b; }
.core-hero { position:relative; isolation:isolate; overflow:hidden; background:var(--hero-bg); border-bottom:1px solid var(--line); }
.hero-grid-lines { position:absolute; z-index:-1; inset:0; background-image:linear-gradient(var(--grid-color) 1px,transparent 1px),linear-gradient(90deg,var(--grid-color) 1px,transparent 1px); background-size:72px 72px; mask-image:linear-gradient(90deg,transparent,#000); }
.core-layout { display:grid; grid-template-columns:1.02fr 1fr; align-items:center; gap:22px; min-height:700px; padding-block:70px; }
.core-copy { position:relative; z-index:3; }
.core-eyebrow { display:flex; align-items:center; gap:10px; color:var(--accent); font:600 .64rem/1.6 ui-monospace,monospace; letter-spacing:.13em; margin-bottom:29px; }
.signal-dot { display:inline-block; flex:none; width:6px; height:6px; background:var(--accent); border-radius:50%; box-shadow:0 0 0 5px color-mix(in srgb,var(--accent) 10%,transparent); animation:signal-breathe 3s ease-in-out infinite; }
.core-copy h1 { margin-bottom:28px; font-size:clamp(2.8rem,4.7vw,4.65rem); line-height:1.08; letter-spacing:-.065em; font-weight:650; }
.core-copy h1>span { color:var(--accent); }
.core-description { max-width:500px; color:var(--text); font-size:1rem; line-height:1.8; margin-bottom:30px; }
.core-secondary { display:inline-flex; align-items:center; justify-content:center; gap:22px; padding:12px 6px; color:var(--ink); font-size:.8rem; text-decoration:none; }
.core-secondary:hover { color:var(--accent); }
.core-coverage { display:flex; flex-wrap:wrap; gap:10px 22px; margin-top:36px; font-size:.65rem; color:var(--muted); }
.core-coverage span { display:flex; align-items:center; gap:8px; }
.core-coverage .icon { width:15px; height:15px; color:var(--accent); }
.core-scene { position:relative; height:540px; min-width:0; }
.core-render { position:absolute; inset:20px -35px 0; }
.core-render img { width:100%; height:100%; object-fit:contain; mask-image:radial-gradient(ellipse 70% 60% at 50% 52%,#000 55%,transparent 100%); }
.scene-topline,.scene-bottomline { position:absolute; right:0; left:0; display:flex; align-items:center; justify-content:space-between; gap:10px; color:var(--muted); font:500 .53rem/1.6 ui-monospace,monospace; letter-spacing:.13em; }
.scene-topline { top:0; border-top:1px solid var(--line); padding-top:15px; }
.scene-bottomline { bottom:0; justify-content:flex-start; border-bottom:1px solid var(--line); padding-bottom:15px; }
.scene-bottomline .signal-dot { width:4px; height:4px; }
.scene-routes { position:absolute; inset:0; width:100%; height:100%; pointer-events:none; }
.scene-routes path { stroke:var(--accent); stroke-width:1; opacity:.25; stroke-dasharray:4 6; }
.flow-packet { fill:var(--accent); filter:drop-shadow(0 0 5px var(--accent)); animation:route-flow 9s linear infinite; }
.flow-one { offset-path:path('M55 130H180L300 250 460 340H550'); }
.flow-two { offset-path:path('M85 390H190L300 250 440 150H550'); animation-delay:-4s; }
.scene-chip { position:absolute; display:flex; align-items:center; gap:12px; padding:14px 18px; text-decoration:none; color:var(--ink); background:color-mix(in srgb,var(--surface) 90%,transparent); border:1px solid color-mix(in srgb,var(--accent) 25%,var(--line)); border-radius:10px; backdrop-filter:blur(16px); box-shadow:0 12px 40px #00152c18; animation:chip-float 7s ease-in-out infinite; }
.scene-chip .icon { width:23px; height:23px; color:var(--accent); }
.scene-chip span { font-size:.71rem; font-weight:650; }
.scene-chip small { display:block; font:500 .49rem/1.6 ui-monospace,monospace; letter-spacing:.14em; color:var(--muted); margin-bottom:3px; }
.scene-chip b { font-weight:400; color:var(--accent); margin-left:6px; }
.scene-chip:hover { border-color:var(--accent); }
.chip-cloud { top:70px; left:5%; }
.chip-ops { right:-8px; top:210px; animation-delay:-2s; }
.chip-devops { left:5%; bottom:62px; animation-delay:-4s; }
.mini-wave { display:flex; align-items:center; gap:3px; height:15px; margin-left:auto; }
.mini-wave i { width:2px; height:6px; background:var(--accent); animation:wave 2s ease-in-out infinite alternate; }
.mini-wave i:nth-child(2n) { animation-delay:-.5s; height:13px; }
.mini-wave i:nth-child(3n) { animation-delay:-1s; height:9px; }
.hero-footnote { display:flex; justify-content:space-between; align-items:center; padding:20px 0; border-top:1px solid var(--line); color:var(--muted); font:500 .55rem ui-monospace,monospace; letter-spacing:.13em; }
.motion-toggle { border:0; background:none; color:var(--muted); padding:8px 0 8px 16px; cursor:pointer; font:inherit; letter-spacing:0; }
.tech-ribbon { background:var(--surface); }
.tech-ribbon .container { flex-wrap:wrap; justify-content:center; gap:18px 32px; padding:27px 0; }
.tech-ribbon span { text-transform:none; font-size:.8rem; letter-spacing:-.01em; color:var(--text); }
.section { padding-block:100px; }
.section h2 { font-weight:600; letter-spacing:-.05em; }
.section-dark { background:var(--surface-2); color:var(--text); border-block:1px solid var(--line); }
.section-dark h2,.section-dark h3 { color:var(--ink); }
.section-dark .eyebrow,.text-link.light { color:var(--accent); }
.outcome-grid { border:0; gap:24px; background:none; }
.outcome-grid article { padding:35px 0 0; border-top:1px solid var(--line); background:none; }
.outcome-grid span { margin-bottom:28px; color:var(--accent); font-family:ui-monospace,monospace; }
.service-card,.light-grid .service-card,.related:not(.section-dark) .service-card { background:var(--surface); border:1px solid var(--line); border-radius:16px; overflow:hidden; color:var(--text); }
.service-card:hover,.light-grid .service-card:hover,.related:not(.section-dark) .service-card:hover { background:var(--surface-3); border-color:color-mix(in srgb,var(--accent) 55%,var(--line)); }
.service-card:before { content:''; position:absolute; top:0; left:20%; right:20%; height:1px; background:linear-gradient(90deg,transparent,var(--accent),transparent); opacity:0; transition:opacity .3s; }
.service-card:hover:before { opacity:1; }
.service-card .icon-box,.light-grid .service-card .icon-box,.related:not(.section-dark) .icon-box { border-color:var(--line); background:var(--surface-2); color:var(--accent); }
.service-card .text-link,.light-grid .service-card .text-link,.related:not(.section-dark) .service-card .text-link { color:var(--accent); }
.card-kicker { color:var(--muted)!important; }
.eyebrow,.text-link,.process-list li>span,.article-card>p:first-child,.section-label,.feature-grid article>span,.timeline article>span,.location-card>span,.location-card b,.contact-direct a,.form-status { color:var(--accent); }
.button-secondary { color:var(--accent); border-color:var(--accent); }
.visual-frame { margin:0; border-radius:18px; min-height:520px; }
.visual-frame picture,.visual-frame img { min-height:520px; }
.solution-grid { border:0; gap:12px; background:none; }
.solution-card { border:1px solid var(--line); border-radius:14px; padding:25px; }
.solution-card>span { font-family:ui-monospace,monospace; color:var(--accent); }
.solution-card b { color:var(--accent); }
.coverage-section { background:var(--surface-2); color:var(--text); border-block:1px solid var(--line); }
.coverage-section h2 { color:var(--ink); }
.coverage-actions,.coverage-actions a { border-color:var(--line); }
.coverage-actions a { color:var(--text); }
.site-footer { background:var(--surface); color:var(--muted); border-top:1px solid var(--line); }
.site-footer h2 { color:var(--ink); }
.site-footer a,.footer-email { color:var(--text)!important; }
.footer-bottom { border-color:var(--line); }
.network-visual path { stroke-dasharray:8 6; animation:trace-data 30s linear infinite; }
.network-visual circle:not(.packet) { animation:signal-breathe 4s ease-in-out infinite; }
.network-visual circle:nth-child(2n) { animation-delay:-2s; }
.animate-in { animation:arrive .7s cubic-bezier(.2,.65,.3,1) both; }
@keyframes arrive { from { opacity:.45; translate:0 18px; } to { opacity:1; translate:0 0; } }
@keyframes chip-float { 0%,100% { transform:translateY(0); } 50% { transform:translateY(-9px); } }
@keyframes signal-breathe { 0%,100% { opacity:.7; } 50% { opacity:1; } }
@keyframes trace-data { to { stroke-dashoffset:-280; } }
@keyframes route-flow { to { offset-distance:100%; } }
@keyframes wave { to { transform:scaleY(.35); } }
html[data-motion="paused"] *,html[data-motion="paused"] *:before { animation-play-state:paused!important; }
@media(min-width:1051px) and (max-width:1200px) { .site-nav { gap:14px; } .site-nav .button { display:none; } }
@media(max-width:1050px) { .core-layout { grid-template-columns:1fr 1fr; padding-block:55px; min-height:600px; } .core-scene { height:460px; } .core-copy h1 { font-size:3.25rem; } .scene-chip { padding:10px; gap:8px; } .scene-chip span { font-size:.6rem; } .chip-ops { right:0; } .core-coverage { margin-top:24px; } .site-nav { gap:15px; } }
@media(max-width:780px) { :root { --container:calc(100% - 36px); --header:78px; } .site-header { height:78px; --header:78px; } .official-brand { width:124px; } .official-brand img { height:58px; } .site-nav { top:78px; } .core-layout { grid-template-columns:1fr; gap:30px; padding:54px 0 25px; } .core-copy h1 { font-size:clamp(2.65rem,7.8vw,4.3rem); } .core-description { font-size:.94rem; } .core-scene { width:100%; max-width:560px; margin:auto; height:450px; } .core-render { inset:20px -15px 0; } .chip-cloud { top:60px; left:0; } .chip-ops { top:180px; right:0; } .chip-devops { bottom:55px; left:0; } .scene-chip span { font-size:.7rem; } .hero-footnote { font-size:.46rem; gap:16px; } .section { padding-block:72px; } .card-grid.three { grid-template-columns:1fr; } .visual-frame,.visual-frame picture,.visual-frame img { min-height:360px; } .core-copy .hero-actions { flex-direction:row; } .core-copy .hero-actions .button { width:auto; } }
@media(max-width:400px) { :root { --container:calc(100% - 28px); } .core-copy h1 { font-size:2.55rem; } .core-eyebrow { font-size:.53rem; } .core-copy .hero-actions { flex-direction:column; align-items:stretch; } .core-copy .hero-actions .button { width:100%; } .core-scene { height:370px; } .scene-chip span { font-size:.6rem; } .scene-chip .icon { width:18px; } .chip-ops { top:145px; } .scene-topline { font-size:.45rem; } .core-coverage { gap:12px; } }
@media(prefers-reduced-motion:reduce) { *,*:before { animation:none!important; } .core-scene .flow-packet { display:none; } }