@import url('https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=Manrope:wght@400;500;600;700;800&family=Playfair+Display:ital,wght@0,600;0,700;1,600;1,700&display=swap');

:root { --ink:#07131f; --slate:#102536; --paper:#f6f8fb; --lime:#73fbd3; --teal:#38bdf8; --violet:#a78bfa; --muted:#9cb0bf; --line:rgba(246,248,251,.16); --pointer-x:50vw; --pointer-y:30vh; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--paper); color:var(--ink); font-family:Manrope,Arial,sans-serif; }
a { color:inherit; text-decoration:none; }
.topbar { height:82px; padding:0 clamp(24px,6vw,96px); display:flex; align-items:center; justify-content:space-between; background:rgba(7,19,31,.72); color:#f4f8fb; border-bottom:1px solid rgba(255,255,255,.1); backdrop-filter:blur(18px) saturate(130%); -webkit-backdrop-filter:blur(18px) saturate(130%); position:sticky; top:0; z-index:10; }
.brand { display:inline-flex; align-items:center; gap:11px; font-family:'DM Mono',monospace; font-size:14px; letter-spacing:.12em; font-weight:500; }
.brand img { width:34px; height:34px; object-fit:contain; }
nav { display:flex; gap:30px; font-size:13px; font-weight:700; }
nav a { opacity:.66; transition:opacity .2s,color .2s; } nav a:hover { opacity:1; color:var(--lime); }
.nav-cta { padding:12px 17px; border:1px solid rgba(115,251,211,.6); border-radius:100px; font-size:12px; font-weight:800; color:var(--lime); background:rgba(115,251,211,.06); box-shadow:inset 0 0 20px rgba(115,251,211,.04); transition:transform .2s,background .2s; }.nav-cta:hover { transform:translateY(-2px); background:rgba(115,251,211,.13); }
.nav-cta span { margin-left:7px; }
.hero { min-height:650px; padding:clamp(80px,11vw,162px) clamp(24px,14vw,216px) 74px; background:radial-gradient(circle at 76% 20%,rgba(56,189,248,.24),transparent 29%),radial-gradient(circle at 20% 90%,rgba(167,139,250,.18),transparent 30%),#07131f; color:var(--paper); position:relative; overflow:hidden; isolation:isolate; }
.hero:before { content:''; position:absolute; z-index:-1; inset:-30%; background:conic-gradient(from 180deg at 50% 50%,rgba(56,189,248,.02),rgba(115,251,211,.17),rgba(167,139,250,.12),rgba(56,189,248,.02)); filter:blur(60px); animation:aurora 16s linear infinite; }
.hero:after { content:''; position:absolute; z-index:-1; inset:0; pointer-events:none; background:radial-gradient(390px circle at var(--pointer-x) var(--pointer-y),rgba(115,251,211,.15),transparent 58%); transition:background .08s linear; }
.grid-orbit { position:absolute; width:600px; height:600px; right:-125px; top:-170px; border:1px solid rgba(115,251,211,.21); border-radius:46% 54% 68% 32% / 40% 45% 55% 60%; box-shadow:0 0 0 78px rgba(115,251,211,.035),0 0 0 156px rgba(56,189,248,.025),0 0 120px rgba(56,189,248,.15); animation:float 15s ease-in-out infinite; }
.grid-orbit:after { content:''; position:absolute; inset:24%; border-radius:50%; background:radial-gradient(circle,#73fbd3 0,rgba(56,189,248,.54) 16%,rgba(7,19,31,0) 67%); opacity:.52; }
.eyebrow { font-family:'DM Mono',monospace; font-size:11px; letter-spacing:.11em; color:var(--muted); margin:0 0 27px; display:flex; gap:9px; align-items:center; }
.eyebrow span { width:8px; height:8px; border-radius:2px; background:var(--lime); display:inline-block; }
h1,h2,h3,p { margin-top:0; } h1,h2 { letter-spacing:-.055em; line-height:.95; }
h1 { max-width:740px; font-size:clamp(54px,8vw,116px); margin-bottom:28px; position:relative; } h1 em,h2 em { font-family:'Playfair Display',Georgia,serif; color:var(--lime); font-weight:600; }
.hero-copy { max-width:505px; color:#c9d0cc; line-height:1.66; font-size:17px; position:relative; }
.hero-actions { display:flex; align-items:center; gap:26px; margin-top:35px; position:relative; }
.primary-button { background:linear-gradient(110deg,var(--lime),#b6f3ff); color:var(--ink); padding:16px 20px; border-radius:100px; font-size:13px; font-weight:800; box-shadow:0 12px 35px rgba(115,251,211,.2); transition:transform .2s,box-shadow .2s; } .primary-button:hover { transform:translateY(-3px); box-shadow:0 17px 42px rgba(115,251,211,.31); } .primary-button span { margin-left:14px; }
.text-button { font-size:13px; font-weight:700; } .text-button span { margin-left:9px; }
.hero-proof { position:absolute; display:flex; gap:16px; right:clamp(24px,7vw,105px); bottom:54px; color:#d1d8d3; font-family:'DM Mono',monospace; font-size:11px; line-height:1.65; } .hero-proof span { color:var(--lime); }
.principles { padding:130px clamp(24px,14vw,216px); display:grid; grid-template-columns:1fr 1fr; gap:100px; }
h2 { font-size:clamp(42px,5.4vw,76px); margin:0; }
.principle-list { border-top:1px solid #c9c9bf; }
.principle-list article { padding:23px 0 25px; border-bottom:1px solid #c9c9bf; display:grid; grid-template-columns:46px 1fr; column-gap:12px; }
.principle-list span { color:#778184; font:11px 'DM Mono',monospace; padding-top:4px; }.principle-list h3 { font-size:18px; margin:0 0 10px; }.principle-list p { grid-column:2; color:#667276; font-size:14px; line-height:1.6; margin:0; }
.projects { color:var(--paper); background:var(--slate); padding:112px clamp(24px,8vw,122px) 125px; }.section-heading { display:flex; justify-content:space-between; align-items:end; gap:35px; margin-bottom:50px; }.section-heading .eyebrow { color:#8b9da2; }.section-heading > p { max-width:335px; color:#b8c3c5; font-size:14px; line-height:1.65; margin:0; }
.project-grid { display:grid; grid-template-columns:1.25fr 1fr 1fr; gap:14px; }.project-card { min-height:440px; display:flex; flex-direction:column; justify-content:space-between; padding:25px; border-radius:6px; color:var(--ink); transition:transform .25s ease; }.project-card:hover { transform:translateY(-6px); }.audit { background:var(--lime); }.security { background:#e4eeea; }.future { background:#286470; color:var(--paper); }.card-top { display:flex; justify-content:space-between; font:10px 'DM Mono',monospace; letter-spacing:.08em; }.card-mark { font:700 70px 'DM Mono',monospace; letter-spacing:-.14em; opacity:.74; }.shield { display:grid; place-items:center; width:72px; height:82px; clip-path:polygon(50% 0,90% 16%,83% 69%,50% 100%,17% 69%,10% 16%); background:var(--teal); color:var(--ink); font:700 31px 'DM Mono',monospace; }.plus { font-size:76px; color:var(--lime); }.project-card h3 { font-size:26px; letter-spacing:-.04em; margin:0 0 10px; }.project-card p { font-size:14px; line-height:1.55; max-width:350px; margin-bottom:24px; }.project-card .card-kicker { margin:0 0 8px; font:600 10px 'DM Mono',monospace; letter-spacing:.09em; color:#627079; }.card-link { font:700 12px Manrope,sans-serif; }.card-link b { margin-left:8px; }.muted { opacity:.52; }
.contact { padding:130px clamp(24px,14vw,216px); display:grid; grid-template-columns:1fr 1.1fr; gap:80px; }.contact-links { border-top:1px solid #c9c9bf; }.contact-links a { padding:22px 0; border-bottom:1px solid #c9c9bf; display:flex; justify-content:space-between; font-size:15px; font-weight:700; transition:padding .2s; }.contact-links a:hover { padding-left:8px; }.contact-links b { color:#6e797b; }
footer { padding:26px clamp(24px,6vw,96px); display:flex; align-items:center; justify-content:space-between; background:var(--ink); color:#d8e0dc; } footer .brand img { width:29px; height:29px; } footer p { margin:0; font:10px 'DM Mono',monospace; color:#809196; }
@keyframes aurora { from { transform:rotate(0deg) scale(1); } 50% { transform:rotate(180deg) scale(1.16); } to { transform:rotate(360deg) scale(1); } }
@keyframes float { 0%,100% { transform:translate3d(0,0,0) rotate(0deg); } 50% { transform:translate3d(-35px,35px,0) rotate(9deg); } }
.cursor-light { position:fixed; width:12px; height:12px; border-radius:50%; top:calc(var(--pointer-y) - 6px); left:calc(var(--pointer-x) - 6px); background:var(--lime); mix-blend-mode:screen; opacity:.55; pointer-events:none; z-index:99; transition:width .2s,height .2s,opacity .2s; }
@media (hover:none) { .cursor-light { display:none; } }
@media (max-width:800px) { .topbar { height:68px; } nav { display:none; }.nav-cta { font-size:11px; padding:10px 12px; }.hero { min-height:620px; padding-top:105px; }.hero-proof { position:relative; right:auto; bottom:auto; margin-top:70px; }.principles,.contact { grid-template-columns:1fr; gap:52px; padding-top:82px; padding-bottom:82px; }.project-grid { grid-template-columns:1fr; }.section-heading { display:block; }.section-heading > p { margin-top:27px; }.project-card { min-height:360px; } footer { gap:22px; flex-direction:column; align-items:flex-start; } }

/* Final synthesis: architectural foundation, calm editorial tone, purposeful motion. */
:root { --ink:#17202a; --paper:#f0efe9; --slab:#1e2934; --cobalt:#1d4ed8; --sky:#74b9e5; --warm:#e8e4d8; --lime:#74b9e5; --teal:#74b9e5; }
.topbar { background:rgba(240,239,233,.93); color:var(--ink); border-bottom:1px solid rgba(23,32,42,.16); box-shadow:none; }
nav a:hover { color:var(--cobalt); }.nav-cta { color:var(--ink); border-color:var(--ink); background:transparent; box-shadow:none; }.nav-cta:hover { color:var(--paper); background:var(--ink); }
.foundation-hero { display:grid; grid-template-columns:minmax(0,1fr) minmax(390px,.95fr); gap:clamp(44px,7vw,120px); align-items:center; min-height:670px; padding:clamp(72px,9vw,135px) clamp(24px,10vw,152px) 82px; background:var(--paper); color:var(--ink); }
.foundation-hero:before,.foundation-hero:after,.foundation-hero .grid-orbit { display:none; }.hero-copy-block { position:relative; z-index:1; }.foundation-hero h1 { max-width:740px; font-size:clamp(54px,6.7vw,98px); }.foundation-hero h1 em { color:var(--cobalt); }.foundation-hero .eyebrow { color:#63717b; }.foundation-hero .eyebrow span { background:var(--cobalt); }.foundation-hero .hero-copy { color:#57636d; }.foundation-hero .primary-button { border-radius:0; background:var(--ink); color:var(--paper); box-shadow:none; }.foundation-hero .primary-button:hover { background:var(--cobalt); transform:translateY(-2px); box-shadow:none; }.foundation-hero .primary-button span { color:var(--sky); }
.foundation-diagram { align-self:end; min-height:445px; padding:23px 23px 0; background:linear-gradient(140deg,#d9e2e3,#bfcbd0); position:relative; overflow:hidden; }.foundation-diagram:before { content:''; position:absolute; inset:0; opacity:.5; background:repeating-linear-gradient(90deg,transparent 0 31px,rgba(23,32,42,.06) 32px),repeating-linear-gradient(0deg,transparent 0 31px,rgba(23,32,42,.06) 32px); pointer-events:none; }.foundation-diagram>p { position:relative; font:500 10px 'DM Mono',monospace; letter-spacing:.1em; color:#53616c; margin:0; }.diagram-columns { height:310px; display:flex; align-items:flex-end; justify-content:center; gap:18px; padding:0 10px; position:relative; }.diagram-column { width:112px; display:flex; min-height:180px; flex-direction:column; justify-content:space-between; padding:13px; color:var(--ink); background:#f6f5f0; transition:transform .3s cubic-bezier(.2,.8,.2,1),box-shadow .3s; }.diagram-column:hover { transform:translateY(-18px); box-shadow:0 18px 0 rgba(23,32,42,.14); }.diagram-column span,.diagram-column small { font:500 10px 'DM Mono',monospace; }.diagram-column strong { writing-mode:vertical-rl; font-size:17px; letter-spacing:.04em; }.diagram-column i { height:1px; background:currentColor; opacity:.35; }.diagram-column small { color:var(--cobalt); }.audit-pillar { height:228px; border-top:5px solid var(--sky); }.security-pillar { height:286px; border-top:5px solid var(--cobalt); background:#e5eaf4; }.future-pillar { height:170px; background:transparent; border:1px dashed #88949b; color:#627079; }.future-pillar strong { font-size:13px; }.diagram-slab { height:76px; display:flex; align-items:center; justify-content:space-between; padding:0 24px; margin:0 -23px; background:var(--slab); color:var(--paper); font:500 16px 'DM Mono',monospace; letter-spacing:.12em; }.diagram-slab small { font:400 10px 'DM Mono',monospace; letter-spacing:0; color:#aab4b8; }
.principles { background:var(--slab); color:var(--paper); padding-top:125px; padding-bottom:125px; }.principles .eyebrow { color:#aab7ba; }.principles .eyebrow span { background:var(--sky); }.principles h2 em { color:var(--sky); }.principle-list { border-color:rgba(255,255,255,.22); }.principle-list article { border-color:rgba(255,255,255,.22); }.principle-list p { color:#bdc6c8; }.principle-list span { color:var(--sky); }
.projects { background:var(--warm); color:var(--ink); }.section-heading .eyebrow { color:#596771; }.section-heading .eyebrow span { background:var(--cobalt); }.section-heading > p { color:#53616b; }.project-card { border-radius:0; }.audit { background:#d6e7ed; }.security { background:#e5e9f4; }.future { background:#c8d0d1; color:var(--ink); }.shield { background:var(--cobalt); color:var(--paper); }.plus { color:var(--cobalt); }.project-card:hover { transform:translateY(-7px); }
.contact { background:var(--paper); }.contact .eyebrow span { background:var(--cobalt); }.contact h2 em { color:var(--cobalt); }.cursor-light { display:none; }
@media (max-width:800px) { .foundation-hero { grid-template-columns:1fr; gap:60px; min-height:auto; padding-top:82px; }.foundation-diagram { min-height:390px; }.diagram-columns { height:260px; gap:8px; padding:0; }.diagram-column { width:31%; min-width:0; padding:10px; }.diagram-slab small { display:none; } }

/* Google concept adaptation: dark glass, cyan/violet product signals, live geometric backbone. */
html{background:#030712}body{background:#030712!important;color:#f3f4f6!important;font-family:Inter,Arial,sans-serif}#stylobate-backbone{position:fixed;inset:0;width:100vw;height:100vh;z-index:0;pointer-events:none}.cursor-light{display:none!important}.topbar,main,footer{position:relative;z-index:1}.topbar{background:rgba(3,7,18,.84)!important;color:#f3f4f6!important;border-color:rgba(255,255,255,.11)!important;backdrop-filter:blur(18px)}.brand span{color:#fff!important}.topbar nav a{color:#b7c0cf!important}.topbar nav a:hover{color:#fff!important}.nav-cta{color:#7eeeff!important;border-color:rgba(0,242,254,.55)!important;background:rgba(0,242,254,.08)!important;border-radius:12px!important}.foundation-hero{min-height:690px!important;grid-template-columns:1fr!important;place-items:center!important;text-align:center!important;padding:110px 10vw 90px!important;background:transparent!important;color:#fff!important}.hero-copy-block{max-width:920px}.foundation-hero h1{font-size:clamp(52px,7vw,92px)!important;max-width:none!important;letter-spacing:-.065em}.foundation-hero h1 em{color:#00f2fe!important;font-style:normal;background:linear-gradient(120deg,#fff,#00f2fe 65%,#a78bfa);-webkit-background-clip:text;-webkit-text-fill-color:transparent}.foundation-hero .eyebrow{display:inline-block;color:#b9c5d6!important;border:1px solid rgba(0,242,254,.28);background:rgba(15,23,42,.75);padding:9px 15px;border-radius:99px;font:600 11px 'DM Mono',monospace}.foundation-hero .eyebrow span{background:#00f2fe!important;border-radius:50%}.foundation-hero .hero-copy{margin:26px auto 0!important;color:#cbd5e1!important;max-width:670px;font-size:18px!important}.hero-actions{justify-content:center!important;margin-top:36px!important}.foundation-hero .primary-button{border-radius:13px!important;background:linear-gradient(110deg,#00f2fe,#32b9f4)!important;color:#07111d!important;box-shadow:0 0 28px rgba(0,242,254,.25)!important}.foundation-hero .text-button{color:#d9e2ee!important;border:1px solid rgba(167,139,250,.48);padding:14px 21px;border-radius:13px}.foundation-diagram{display:none!important}.principles{background:rgba(15,23,42,.62)!important;color:#fff!important;border-top:1px solid rgba(255,255,255,.1);backdrop-filter:blur(14px)}.principles .eyebrow{color:#00f2fe!important}.principles h2 em{color:#a78bfa!important}.principle-list,.principle-list article{border-color:rgba(255,255,255,.14)!important}.principle-list p{color:#9eabbc!important}.principle-list span{color:#00f2fe!important}.projects{background:transparent!important;color:#fff!important;border-top:1px solid rgba(255,255,255,.1)}.section-heading .eyebrow{color:#00f2fe!important}.section-heading > p{color:#aab7c6!important}.project-card{background:rgba(15,23,42,.67)!important;color:#fff!important;border:1px solid rgba(255,255,255,.12)!important;border-radius:24px!important;backdrop-filter:blur(18px)}.project-card.audit{border-top:4px solid #00f2fe!important}.project-card.security{border-top:4px solid #a78bfa!important}.project-card.future{background:rgba(15,23,42,.35)!important}.project-card p{color:#bdc8d5!important}.project-card .card-kicker{margin:0 0 8px!important;color:#a78bfa!important;font-size:10px!important}.audit .card-mark{color:#00f2fe!important}.shield{background:rgba(139,92,246,.22)!important;color:#a78bfa!important}.plus{color:#a78bfa!important}.card-link{color:#dceafa!important}.contact{background:rgba(2,5,12,.55)!important;color:#fff!important;border-top:1px solid rgba(255,255,255,.1)}.contact .eyebrow{color:#00f2fe!important}.contact h2 em{color:#a78bfa!important}.contact-links a{background:rgba(15,23,42,.62)!important;color:#e6edf6!important;border-color:rgba(255,255,255,.14)!important;border-radius:16px;backdrop-filter:blur(15px)}footer{background:#02050c!important;color:#718096!important;border-color:rgba(255,255,255,.1)!important}