:root { --bg: #0b1120; --surface: #111b30; --surface-2: #16233d; --text: #f1f5f9; --muted: #a8b5ca; --primary: #38bdf8; --primary-dark: #0284c7; --border: rgba(148,163,184,.18); }
html { scroll-behavior: smooth; scroll-padding-top: 82px; }
body { background: var(--bg); color: var(--text); font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; line-height: 1.65; }
.skip-link { position:absolute; left:-999px; top:0; z-index:1000; background:#fff; color:#000; padding:.5rem 1rem; }.skip-link:focus { left:1rem; top:1rem; }
.site-header { position:absolute; z-index:10; inset:0 0 auto; }.navbar-brand { display:flex; align-items:center; gap:.55rem; font-weight:800; letter-spacing:.02em; }.brand-mark { display:grid; place-items:center; width:2rem; height:2rem; color:#001018; background:var(--primary); border-radius:.45rem; }.nav-link { color:#cbd5e1!important; }.nav-link:hover,.nav-link:focus { color:#fff!important; }.btn { border-radius:.55rem; font-weight:700; padding:.7rem 1.15rem; }.btn-primary { background:var(--primary); border-color:var(--primary); color:#062033; }.btn-primary:hover,.btn-primary:focus { background:#7dd3fc; border-color:#7dd3fc; color:#062033; }.btn-success { background:#16a34a; border-color:#16a34a; }.btn-success:hover { background:#22c55e; border-color:#22c55e; }
.hero { position:relative; overflow:hidden; background:radial-gradient(circle at 78% 28%, #123a62 0, transparent 28%), linear-gradient(135deg,#070c17 0%,#0b1730 100%); }.min-vh-75 { min-height: 740px; }.hero-glow { position:absolute; border-radius:50%; filter:blur(5px); opacity:.35; }.glow-one { width:380px; height:380px; background:#0ea5e9; top:18%; right:-120px; }.glow-two { width:300px; height:300px; background:#4338ca; bottom:-160px; left:12%; }.eyebrow { color:#7dd3fc; font-size:.78rem; font-weight:800; letter-spacing:.14em; margin-bottom:.85rem; }.hero h1 { max-width:800px; font-size:clamp(2.6rem,6vw,5.3rem); font-weight:800; line-height:1.05; letter-spacing:-.045em; }.hero h1 span { color:var(--primary); }.hero-copy { max-width:650px; margin-top:1.5rem; font-size:1.15rem; color:#c5d2e5; }.hero-points { display:flex; flex-wrap:wrap; gap:1rem 1.35rem; margin-top:2rem; font-size:.9rem; color:#d9e4f3; }.hero-points i { color:#4ade80; margin-right:.25rem; }
.terminal-card { position:relative; border:1px solid rgba(125,211,252,.28); border-radius:1rem; overflow:hidden; background:#07101e; box-shadow:0 28px 70px rgba(0,0,0,.35); transform:rotate(2deg); }.terminal-top { display:flex; align-items:center; gap:.35rem; min-height:45px; padding:0 .9rem; background:#111c2d; }.terminal-top span { display:block; width:.65rem; height:.65rem; border-radius:50%; background:#fb7185; }.terminal-top span:nth-child(2) { background:#fbbf24; }.terminal-top span:nth-child(3) { background:#4ade80; }.terminal-top small { margin-left:.4rem; color:#94a3b8; font-family:ui-monospace,monospace; }.terminal-content { padding:1.7rem; min-height:260px; font-family:ui-monospace,SFMono-Regular,Consolas,monospace; color:#cbd5e1; }.terminal-content p { margin-bottom:.85rem; }.prompt { color:#38bdf8; }.terminal-success { color:#86efac; }.cursor { display:inline-block; width:.55rem; height:1rem; vertical-align:-.15rem; background:#38bdf8; animation:blink 1s infinite; }@keyframes blink {50%{opacity:0}}
.section { padding:6rem 0; }.section-muted { background:#0e1729; }.section-heading { max-width:700px; }.section h2,.contact-section h2 { font-size:clamp(2rem,3.5vw,3rem); font-weight:800; line-height:1.14; letter-spacing:-.03em; }.section-heading>p:last-child { color:var(--muted); }.service-card { height:100%; padding:1.75rem; border:1px solid var(--border); border-radius:1rem; background:linear-gradient(145deg,rgba(22,35,61,.9),rgba(12,20,35,.9)); transition:transform .2s ease,border-color .2s ease; }.service-card:hover { transform:translateY(-5px); border-color:rgba(56,189,248,.65); }.service-card>i { display:grid; place-items:center; width:3rem; height:3rem; margin-bottom:1.2rem; border-radius:.75rem; background:rgba(56,189,248,.13); color:var(--primary); font-size:1.45rem; }.service-card h3 { font-size:1.18rem; font-weight:750; }.service-card p { color:var(--muted); margin:0; font-size:.95rem; }
.lead { color:#e2e8f0; }.section-muted p:not(.eyebrow) { color:var(--muted); }.principles-card { padding:1.3rem; border:1px solid var(--border); border-radius:1rem; background:#111d33; }.principles-card>div { display:flex; align-items:center; gap:1rem; padding:1.1rem .6rem; }.principles-card>div+div { border-top:1px solid var(--border); }.principles-card i { display:grid; flex:0 0 2.75rem; place-items:center; width:2.75rem; height:2.75rem; border-radius:.65rem; color:#7dd3fc; background:rgba(56,189,248,.12); font-size:1.2rem; }.principles-card strong,.principles-card small { display:block; }.principles-card small { color:var(--muted); }
.technology-list { display:flex; flex-wrap:wrap; justify-content:center; gap:.8rem; margin-top:2.2rem; }.technology-list span { padding:.75rem 1rem; border:1px solid var(--border); border-radius:.55rem; background:var(--surface); font-weight:650; color:#d8e4f3; }.technology-list i { color:var(--primary); margin-right:.4rem; }
.contact-section { padding:6rem 0; background:linear-gradient(120deg,#0b3d63,#111b48); }.contact-box { display:flex; justify-content:space-between; align-items:center; gap:2rem; padding:clamp(2rem,5vw,4rem); border:1px solid rgba(125,211,252,.28); border-radius:1.2rem; background:rgba(5,14,29,.36); }.contact-box p:not(.eyebrow) { max-width:650px; color:#c7d7ea; }.contact-actions { display:flex; flex-wrap:wrap; gap:.7rem; flex:0 0 auto; }.site-footer { padding:1.6rem 0; color:#8fa0b8; font-size:.9rem; }.site-footer a { color:#b8e7ff; text-decoration:none; }.site-footer a:hover { color:#fff; }
@media (max-width: 991.98px) { .site-header { position:relative; background:#0b1120; }.navbar-collapse { margin-top:1rem; padding:1rem; border-radius:.7rem; background:#111b30; }.min-vh-75 { min-height:auto; padding:4rem 0 5rem; }.terminal-card { max-width:480px; margin:auto; transform:none; }.contact-box { display:block; }.contact-actions { margin-top:1.5rem; } }
@media (max-width: 575.98px) { .section,.contact-section { padding:4.5rem 0; }.hero h1 { font-size:2.55rem; }.hero-points { display:grid; gap:.5rem; }.contact-actions .btn { width:100%; }.terminal-content { padding:1.2rem; font-size:.86rem; } }