@import"https://fonts.googleapis.com/css2?family=Rubik:wght@300;400;500;600;700&family=Parkinsans:wght@300;400;500;600;700;800&family=Fira+Code:wght@400;500&display=swap";:root{--color-dark-cyan: #184c53;--color-deep-sea: #2a6c78;--color-teal: #2e9ca3;--color-sky-blue: #66c8e3;--color-light-cyan: #b9eaf7;--color-warm-orange: #f28c1e;--color-warm-orange-hover: #ffb24a;--color-text-primary: #f6fbfd;--color-text-muted: rgba(246, 251, 253, .7);--color-text-subtle: rgba(246, 251, 253, .45);--surface-base: rgba(46, 156, 163, .12);--surface-card: rgba(102, 200, 227, .15);--surface-card-hover: rgba(102, 200, 227, .22);--surface-footer: rgba(24, 76, 83, .7);--border-subtle: rgba(185, 234, 247, .18);--border-card: rgba(102, 200, 227, .3);--border-card-hover: rgba(102, 200, 227, .5);--border-focus: rgba(185, 234, 247, .6);--fg1: var(--color-text-primary);--fg2: var(--color-text-muted);--fg3: var(--color-text-subtle);--accent: var(--color-warm-orange);--accent-hover: var(--color-warm-orange-hover);--bg-page: var(--color-dark-cyan);--bg-card: var(--surface-card);--brand-highlight: var(--color-light-cyan);--gradient-page: linear-gradient(160deg, var(--color-dark-cyan), var(--color-deep-sea));--gradient-shell: linear-gradient(180deg, rgba(185,234,247,.15), rgba(24,76,83,.25));--font-display: "Parkinsans", "Rubik", system-ui, sans-serif;--font-body: "Rubik", system-ui, sans-serif;--font-mono: "Fira Code", "Cascadia Code", ui-monospace, monospace;--text-xs: .75rem;--text-sm: .875rem;--text-base: 1rem;--text-md: 1.125rem;--text-lg: 1.25rem;--text-xl: 1.5rem;--text-2xl: 2rem;--text-3xl: 3rem;--text-hero: clamp(2.4rem, 3.2vw + 1rem, 3.6rem);--weight-light: 300;--weight-regular: 400;--weight-medium: 500;--weight-semibold: 600;--weight-bold: 700;--weight-black: 800;--leading-tight: 1.1;--leading-snug: 1.25;--leading-normal: 1.5;--leading-loose: 1.75;--tracking-tight: -.02em;--tracking-normal: 0em;--tracking-wide: .08em;--tracking-wider: .12em;--tracking-widest: .2em;--space-1: .25rem;--space-2: .5rem;--space-3: .75rem;--space-4: 1rem;--space-5: 1.25rem;--space-6: 1.5rem;--space-8: 2rem;--space-10: 2.5rem;--space-12: 3rem;--space-16: 4rem;--radius-sm: 8px;--radius-md: 12px;--radius-lg: 20px;--radius-xl: 24px;--radius-pill: 999px;--shadow-card: 0 22px 38px -24px rgba(24, 76, 83, .65);--shadow-btn: 0 10px 20px -12px rgba(102, 200, 227, .6);--shadow-link: 0 12px 24px -18px rgba(102, 200, 227, .65);--shadow-glow: 0 0 24px 0 rgba(102, 200, 227, .25);--transition-fast: .15s ease;--transition-base: .2s ease;--transition-medium: .35s ease;--transition-slow: .6s ease;--blur-card: blur(18px);--blur-shell: blur(12px);--blur-sm: blur(6px);--layout-content: min(94vw, 1220px);--layout-nav: min(90vw, 1080px)}*,*:before,*:after{box-sizing:border-box}html,body{margin:0;padding:0}body{font-family:var(--font-body);font-size:var(--text-base);line-height:var(--leading-normal);color:var(--fg1);background:var(--gradient-page);min-height:100vh;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}:focus-visible{outline:3px solid var(--border-focus);outline-offset:3px;border-radius:4px}#root{min-height:100vh;display:flex;flex-direction:column}.header{position:fixed;top:0;left:0;right:0;z-index:100;padding:1.1rem 3rem;background:linear-gradient(180deg,rgba(24,76,83,.78) 0%,rgba(24,76,83,.2) 80%,transparent 100%);transition:background .45s ease,backdrop-filter .45s ease}.header.scrolled{background:#184c53bd;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px)}.header-inner{max-width:1200px;margin:0 auto;display:flex;align-items:center;gap:2rem}.wordmark{font-family:var(--font-body);font-weight:var(--weight-medium);font-size:var(--text-base);letter-spacing:.07em;text-transform:uppercase;color:var(--fg1);text-decoration:none;white-space:nowrap;flex-shrink:0;opacity:0;pointer-events:none;transition:opacity .4s ease}.header.scrolled .wordmark{opacity:.88;pointer-events:auto}.header.scrolled .wordmark:hover{opacity:1}.header-tagline{font-family:var(--font-display);font-weight:var(--weight-black);font-size:.9rem;letter-spacing:var(--tracking-wider);text-transform:uppercase;color:var(--brand-highlight);white-space:nowrap;flex-shrink:0;max-width:0;overflow:hidden;opacity:0;transition:max-width .45s ease,opacity .35s ease,margin .45s ease;margin-left:0}.header.scrolled .header-tagline{max-width:260px;opacity:1;margin-left:.5rem}.nav{display:flex;gap:0;margin-left:auto}.nav-link{font-size:.76rem;letter-spacing:.1em;text-transform:uppercase;font-weight:var(--weight-medium);color:var(--fg3);padding:.4rem .8rem;text-decoration:none;position:relative;transition:color var(--transition-base)}.nav-link:after{content:"";position:absolute;bottom:0;left:.8rem;right:.8rem;height:1px;background:var(--color-sky-blue);transform:scaleX(0);transform-origin:left;transition:transform .22s ease}.nav-link:hover{color:var(--fg1)}.nav-link:hover:after{transform:scaleX(1)}.nav-link.active{color:var(--fg1)}.nav-link.active:after{transform:scaleX(1);background:var(--accent)}.header-actions{display:flex;gap:8px;align-items:center;flex-shrink:0}.btn-text{background:none;border:none;cursor:pointer;padding:0;font-family:var(--font-body);font-size:.76rem;font-weight:var(--weight-medium);letter-spacing:.08em;text-transform:uppercase;color:var(--fg2);text-decoration:none;display:inline-flex;align-items:center;gap:4px;position:relative;transition:color var(--transition-base)}.btn-text:after{content:"";position:absolute;bottom:-2px;left:0;right:0;height:1px;background:currentColor;transform:scaleX(0);transform-origin:left;transition:transform var(--transition-base)}.btn-text:hover{color:var(--fg1)}.btn-text:hover:after{transform:scaleX(1)}.btn-text svg{width:9px;height:9px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;opacity:.6;transition:opacity var(--transition-base),transform var(--transition-base)}.btn-text:hover svg{opacity:1;transform:translate(1px,-1px)}.btn-cta{display:inline-flex;align-items:center;gap:6px;padding:.42rem 1rem;border-radius:6px;border:1px solid rgba(242,140,30,.5);background:#f28c1e1a;color:var(--accent);font-family:var(--font-body);font-size:.76rem;font-weight:var(--weight-semibold);letter-spacing:.08em;text-transform:uppercase;cursor:pointer;text-decoration:none;transition:all var(--transition-base)}.btn-cta:hover{background:#f28c1e33;border-color:#f28c1ebf;color:var(--accent-hover);transform:translateY(-1px);box-shadow:0 6px 18px -8px #f28c1e66}.btn-cta svg{width:10px;height:10px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;transition:transform var(--transition-base)}.btn-cta:hover svg{transform:translate(2px)}@media (max-width: 768px){.header{padding:1rem 1.25rem}.header-actions{display:none}}@media (max-width: 700px){.nav{gap:0}}.photo-wrap{position:relative}.photo-wrap:after{content:"";position:absolute;bottom:-18px;left:10%;right:10%;height:24px;background:#123a40b3;filter:blur(14px);border-radius:50%;z-index:-1}.photo-outer{position:relative;width:100%;border-radius:var(--radius-lg);overflow:hidden}.photo-outer.hero-frame{max-width:380px}.photo-outer.about-frame{border-radius:var(--radius-md)}.photo-img{width:100%;display:block}.work-card{border-radius:16px;border:1px solid var(--border-card);background:#66c8e31a;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);overflow:hidden;transition:all .22s ease;cursor:pointer;text-decoration:none;display:flex;flex-direction:column;color:inherit}.work-card:hover{background:#66c8e329;border-color:var(--border-card-hover);transform:translateY(-3px);box-shadow:0 20px 40px -20px #184c53b3}.work-card__thumb{height:160px;background:#2e9ca32e;display:flex;align-items:center;justify-content:center;border-bottom:1px solid var(--border-card);font-size:.65rem;letter-spacing:.2em;text-transform:uppercase;color:var(--fg3);transition:background .22s ease}.work-card:hover .work-card__thumb{background:#2e9ca347}.work-card__thumb.soon{border-style:dashed;border-color:#b9eaf738;background:#2e9ca314}.work-card__body{padding:1.25rem 1.4rem;flex:1;display:flex;flex-direction:column;gap:.5rem}.work-card__title{font-family:var(--font-display);font-size:1.1rem;font-weight:var(--weight-bold);letter-spacing:.06em;text-transform:uppercase;color:var(--brand-highlight)}.work-card__desc{font-size:.82rem;color:var(--fg2);line-height:1.55;flex:1}.work-card__tag{display:inline-block;font-size:.65rem;letter-spacing:.14em;text-transform:uppercase;color:var(--fg3);border:1px solid rgba(185,234,247,.14);border-radius:4px;padding:2px 7px;align-self:flex-start}.page-container{max-width:1200px;margin:0 auto;padding:0 3rem 6rem}@keyframes fade-up{0%{opacity:0;transform:translateY(24px)}to{opacity:1;transform:translateY(0)}}.hero{padding-top:90px;display:grid;grid-template-columns:1fr 1fr;gap:3rem;align-items:center;min-height:100vh}.hero-left{display:flex;flex-direction:column;gap:1.5rem;animation:fade-up 1.2s ease-out both}.hero-eyebrow{font-size:.7rem;letter-spacing:.22em;text-transform:uppercase;color:var(--fg3);font-weight:var(--weight-medium)}.hero-title-group{display:flex;flex-direction:column;gap:.15rem}.hero-title{font-family:var(--font-display);font-weight:var(--weight-black);font-size:clamp(3.5rem,5.5vw + 1rem,6.5rem);letter-spacing:.06em;text-transform:uppercase;color:var(--brand-highlight);line-height:.92;display:flex;flex-direction:column;gap:0;margin:0}.hero-title span{display:block}.hero-name{font-family:var(--font-display);font-weight:var(--weight-black);font-size:clamp(1.8rem,2.8vw + .6rem,2.6rem);letter-spacing:.1em;text-transform:uppercase;color:var(--accent);margin-top:.1rem;line-height:.92;overflow:hidden;max-height:120px;transition:opacity .4s ease,transform .4s ease,max-height .4s ease,margin-top .4s ease}.hero-name.hidden{opacity:0;transform:translateY(-8px);max-height:0;margin-top:0}.hero-body{font-size:var(--text-base);color:var(--fg2);line-height:1.7;max-width:420px;font-weight:var(--weight-light);margin:0}.hero-links{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.tag-link{display:inline-block;padding:.45rem 1rem;border-radius:var(--radius-sm);border:1px solid rgba(102,200,227,.28);background:#66c8e314;color:var(--fg2);font-family:var(--font-body);font-size:.8rem;font-weight:var(--weight-medium);text-decoration:none;letter-spacing:.05em;transition:all var(--transition-base)}.tag-link:hover{background:#66c8e329;border-color:#66c8e37a;color:var(--fg1);transform:translateY(-1px)}.hero-right{display:flex;justify-content:center;align-items:center;animation:fade-up 1.2s ease-out .5s both}.section-label{font-size:.68rem;letter-spacing:.22em;text-transform:uppercase;color:var(--fg3);font-weight:var(--weight-medium);margin-bottom:1.5rem;display:flex;align-items:center;gap:12px}.section-label:after{content:"";flex:1;height:1px;background:#b9eaf71f}.work{padding-top:5rem}.work-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.25rem}.about{padding-top:5rem;display:grid;grid-template-columns:1fr 1fr;gap:3rem;align-items:center}.about-text{display:flex;flex-direction:column;gap:1.25rem}.about-heading{font-family:var(--font-display);font-size:2.2rem;font-weight:var(--weight-black);letter-spacing:.1em;text-transform:uppercase;color:var(--brand-highlight);line-height:1;margin:0}.about-body{font-size:.95rem;color:var(--fg2);line-height:1.75;font-weight:var(--weight-light);margin:0}.skills{display:flex;flex-wrap:wrap;gap:8px}.skill{padding:.35rem .85rem;border-radius:6px;font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;font-weight:var(--weight-medium);border:1px solid rgba(102,200,227,.22);color:var(--fg2)}.about-photos{display:grid;grid-template-columns:1fr 1fr;gap:12px;align-items:start}.about-photo-offset{margin-top:2rem}@media (max-width: 768px){.page-container{padding:0 1.5rem 4rem}.hero{grid-template-columns:1fr;min-height:auto;padding-top:120px;gap:2rem}.hero-right{order:-1}.work-grid{grid-template-columns:repeat(2,1fr)}}@media (max-width: 700px){.page-container{padding:0 1.25rem 4rem}.hero,.work-grid,.about{grid-template-columns:1fr}.about-photos{grid-template-columns:1fr 1fr}}.placeholder-page{display:flex;align-items:center;justify-content:center;min-height:calc(100vh - 60px);padding:var(--space-12)}.placeholder-inner{display:flex;flex-direction:column;align-items:center;text-align:center;gap:var(--space-4);max-width:380px}.placeholder-icon{color:var(--fg3);margin-bottom:var(--space-2);transition:color var(--transition-base)}.placeholder-icon svg{width:48px;height:48px}.placeholder-label{font-size:var(--text-xs);letter-spacing:var(--tracking-widest);text-transform:uppercase;color:var(--fg3);font-weight:var(--weight-medium);margin:0}.placeholder-heading{font-family:var(--font-display);font-weight:var(--weight-black);font-size:var(--text-3xl);letter-spacing:var(--tracking-wide);text-transform:uppercase;color:var(--brand-highlight);line-height:var(--leading-tight);margin:0}.placeholder-body{font-size:var(--text-sm);color:var(--fg2);line-height:var(--leading-loose);font-weight:var(--weight-light);margin:0}