:root{--color-void:#faf8f5;--color-deep:#f0ede6;--color-surface:#fff;--color-surface-2:#f5f2ed;--color-border:#e8e0d4;--color-border-bright:#e8a83866;--color-cyan:#22d3ee;--color-cyan-dim:#22d3ee14;--color-cyan-glow:#22d3ee33;--color-amber:#e8a838;--color-amber-dim:#e8a8381f;--color-amber-glow:#e8a8384d;--color-coral:#ff7b54;--color-coral-dim:#ff7b541a;--color-text:#2d2420;--color-text-muted:#7a6b5e;--color-text-faint:#c4b8ad;--font-display:"Syne", sans-serif;--font-body:"DM Sans", sans-serif;--font-mono:"Space Mono", monospace;--space-1:8px;--space-2:16px;--space-3:24px;--space-4:32px;--space-5:48px;--space-6:64px;--space-7:80px;--space-8:120px;--radius-sm:6px;--radius-md:12px;--radius-lg:20px;--radius-xl:28px;--section-padding:var(--space-8) var(--space-3);--container-max:1200px;--ease-out:cubic-bezier(.25, .1, .25, 1);--ease-spring:cubic-bezier(.34, 1.56, .64, 1)}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth;font-size:16px}body{font-family:var(--font-body);background:var(--color-void);color:var(--color-text);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;min-width:320px;line-height:1.7;overflow-x:hidden}::-webkit-scrollbar{width:4px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:var(--color-border-bright);border-radius:2px}::-webkit-scrollbar-thumb:hover{background:var(--color-amber-glow)}::selection{background:var(--color-amber-dim);color:var(--color-amber)}:focus-visible{outline:2px solid var(--color-amber);outline-offset:3px;border-radius:var(--radius-sm)}.container{max-width:var(--container-max);padding:0 var(--space-3);margin:0 auto}.section{padding:var(--section-padding);z-index:1;position:relative}.section-alt{background:var(--color-surface-2)}.section-label{font-family:var(--font-mono);text-transform:uppercase;letter-spacing:5px;color:var(--color-coral);margin-bottom:var(--space-2);font-size:.7rem;font-weight:700;display:block}.section-title{font-family:var(--font-display);color:var(--color-text);letter-spacing:-.02em;margin-bottom:var(--space-3);font-size:clamp(2rem,4.5vw,3.2rem);font-weight:700;line-height:1.1}.section-subtitle{color:var(--color-text-muted);max-width:540px;font-size:1.05rem;line-height:1.8}h1,h2,h3,h4,h5,h6{font-family:var(--font-display);color:var(--color-text);line-height:1.2}a{color:inherit;text-decoration:none}.card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);transition:border-color .25s var(--ease-out), box-shadow .25s var(--ease-out), transform .25s var(--ease-out);cursor:pointer}.card:hover{border-color:var(--color-border-bright);box-shadow:0 0 30px var(--color-amber-dim), 0 8px 24px #b48c641f;transform:translateY(-4px)}.tech-tag{font-family:var(--font-mono);color:var(--color-amber);background:var(--color-amber-dim);border-radius:var(--radius-sm);letter-spacing:.3px;white-space:nowrap;border:1px solid #e8a83826;padding:4px 12px;font-size:.68rem;font-weight:400;display:inline-block}.btn{font-family:var(--font-body);border-radius:var(--radius-md);cursor:pointer;transition:transform .12s var(--ease-out), box-shadow .2s var(--ease-out), background .2s var(--ease-out);border:none;align-items:center;gap:8px;padding:12px 28px;font-size:.9rem;font-weight:500;text-decoration:none;display:inline-flex}.btn:active{transform:scale(.97)}.btn-primary{background:var(--color-amber);color:#06060c;font-weight:600}.btn-primary:hover{box-shadow:0 0 24px var(--color-amber-glow);background:#f0b030}.btn-ghost{color:var(--color-text-muted);border:1px solid var(--color-border);background:0 0}.btn-ghost:hover{border-color:var(--color-amber);color:var(--color-amber)}.bg-grid{background-image:linear-gradient(#e8a83806 1px,#0000 1px),linear-gradient(90deg,#e8a83806 1px,#0000 1px);background-size:60px 60px}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-8px)}}@keyframes pulse-glow{0%,to{box-shadow:0 0 20px var(--color-amber-glow)}50%{box-shadow:0 0 40px var(--color-amber-glow), 0 0 60px #e8a8381a}}@keyframes spin-slow{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@media (max-width:768px){:root{--section-padding:var(--space-7) var(--space-2)}.section-title{font-size:clamp(1.6rem,7vw,2.2rem)}}@media (max-width:480px){:root{--section-padding:64px var(--space-2)}}