:root{color-scheme:light;--page-background: #eff6ff;--page-text: #0f172a;--page-muted: #475569;--surface: rgba(255, 255, 255, 0.78);--surface-border: rgba(15, 23, 42, 0.1)}*{box-sizing:border-box}body.navigation-page{min-height:100vh;margin:0;background:radial-gradient(circle at top right, rgba(59, 130, 246, 0.18), transparent 30%),linear-gradient(180deg, #f8fbff 0%, var(--page-background) 100%);color:var(--page-text);font-family:"Segoe UI",Tahoma,Geneva,Verdana,sans-serif}.page-shell{width:min(1160px,100% - 2rem);margin:0 auto;padding:3rem 0 4rem}.page-header{max-width:56rem;margin-bottom:2rem}.eyebrow,.demo-label{margin:0 0 .6rem;color:#2563eb;font-size:.78rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase}h1,h2,h3,p{margin:0}h1{font-size:clamp(2.6rem,6vw,4.75rem);line-height:.94}h2{font-size:1.5rem}h3{font-size:1.8rem}.page-copy,.demo-copy,.phone__screen p,.workspace-panel p{margin-top:.9rem;color:var(--page-muted);line-height:1.7}.demo-grid{display:grid;grid-template-columns:repeat(auto-fit, minmax(300px, 1fr));gap:1.25rem}.demo-card{display:grid;gap:1.4rem;min-height:520px;padding:1.5rem;border:1px solid var(--surface-border);border-radius:1.5rem;background:var(--surface);backdrop-filter:blur(12px);box-shadow:0 24px 40px rgba(15,23,42,.08)}.demo-card--sidenav{overflow:hidden}.sidenav-stage{position:relative;min-height:320px;border-radius:1.25rem;background:linear-gradient(135deg, #dbeafe, #f8fafc)}.sidenav{position:absolute;inset:1.25rem auto 1.25rem 0}.sidenav__link{position:absolute;left:-84px;width:112px;padding:.95rem 1rem;border-radius:0 .75rem .75rem 0;color:#fff;font-size:1rem;font-weight:700;text-decoration:none;transition:left .3s ease}.sidenav__link:hover{left:0}.sidenav__link--about{top:12px;background:#04aa6d}.sidenav__link--blog{top:82px;background:#2196f3}.sidenav__link--projects{top:152px;background:#f44336}.sidenav__link--contact{top:222px;background:#555}.demo-card--phone{background:linear-gradient(180deg, rgba(168, 85, 247, 0.18), rgba(255, 255, 255, 0.88))}.phone{position:relative;overflow:hidden;width:min(340px,100%);height:600px;margin:0 auto;border:3px solid #eef2ff;border-radius:1.25rem;background:#fff}.phone__screen{position:absolute;inset:0 0 60px;display:grid;align-content:end;padding:1.5rem;opacity:0;transition:opacity .4s ease;background-size:cover;background-position:center;color:#fff}.phone__screen::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg, rgba(15, 23, 42, 0.14), rgba(15, 23, 42, 0.72))}.phone__screen>*{position:relative;z-index:1}.phone__screen--show{opacity:1}.phone__screen:nth-of-type(1){background-image:linear-gradient(135deg, #38bdf8, #0f172a)}.phone__screen:nth-of-type(2){background-image:linear-gradient(135deg, #fb7185, #7c3aed)}.phone__screen:nth-of-type(3){background-image:linear-gradient(135deg, #34d399, #065f46)}.phone__screen:nth-of-type(4){background-image:linear-gradient(135deg, #f59e0b, #7c2d12)}.phone__eyebrow{display:inline-block;margin-bottom:.65rem;font-size:.75rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase}.phone__screen p{color:hsla(0,0%,100%,.84)}.phone-nav{position:absolute;right:0;bottom:0;left:0;display:grid;grid-template-columns:repeat(4, minmax(0, 1fr));height:60px;background:#fff}.phone-nav__item{display:grid;place-items:center;gap:.15rem;border:0;background:rgba(0,0,0,0);color:#64748b;cursor:pointer;font:inherit}.phone-nav__item.is-active,.phone-nav__item:hover{color:#8b5cf6}.phone-nav__icon{font-size:1.05rem;line-height:1}.phone-nav__item span:last-child{font-size:.73rem}.demo-card--segmented{background:linear-gradient(180deg, rgba(14, 165, 233, 0.14), rgba(255, 255, 255, 0.9))}.workspace-shell{display:grid;gap:1rem;align-content:start}.workspace-nav{display:flex;flex-wrap:wrap;gap:.6rem;padding:.4rem;border-radius:999px;background:rgba(15,23,42,.06)}.workspace-nav__item{padding:.8rem 1rem;border:0;border-radius:999px;background:rgba(0,0,0,0);color:#475569;cursor:pointer;font:inherit;font-weight:700;transition:background .2s ease,color .2s ease,transform .2s ease}.workspace-nav__item:hover,.workspace-nav__item.is-active{background:#0f172a;color:#fff;transform:translateY(-1px)}.workspace-panel{display:none;min-height:280px;padding:1.5rem;border-radius:1.25rem;background:linear-gradient(135deg, rgba(15, 23, 42, 0.96), rgba(30, 64, 175, 0.84));color:#fff}.workspace-panel--show{display:block}.workspace-panel__eyebrow{display:inline-block;margin-bottom:.65rem;font-size:.75rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:hsla(0,0%,100%,.72)}.workspace-panel p{color:hsla(0,0%,100%,.84)}