.header{position:sticky;top:0;z-index:40;margin:0;padding:10px 0;padding-top:calc(10px + env(safe-area-inset-top));background:#14141459;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background-clip:padding-box;border-bottom:1px solid rgba(255,255,255,.06);border-radius:0;box-shadow:var(--shadow)}.header-inner{max-width:100%;margin:0 auto;padding:12px 20px;padding-left:calc(20px + env(safe-area-inset-left));padding-right:calc(20px + env(safe-area-inset-right));display:flex;align-items:center;justify-content:space-between}.brand{display:flex;align-items:center;gap:12px;letter-spacing:.3px}.brand-name{font-weight:600;color:var(--text)}.nav{display:flex;align-items:center;gap:8px}.nav a{position:relative;display:inline-flex;align-items:center;gap:8px;color:var(--muted);padding:8px 12px;border:1px solid transparent;text-decoration:none;transition:color .18s ease,border-color .18s ease,background .18s ease,transform .18s ease}.nav a:after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;background:linear-gradient(90deg,#d4af3700,#d4af37f2,#d4af3700);transform:scaleX(0);transform-origin:center;transition:transform .22s ease}.nav a:hover,.nav a:focus-visible{color:var(--text);border-color:var(--stroke);background:#ffffff0d;transform:translateY(-1px)}.nav a:hover:after,.nav a:focus-visible:after{transform:scaleX(1)}.nav a.active{color:var(--gold);background:#d4af371a;border-color:#d4af3740}.nav a.active:after{transform:scaleX(1)}.nav a:focus-visible{box-shadow:0 0 0 3px #d4af3740;border-color:#d4af3759}@media (prefers-reduced-motion: reduce){.nav a,.nav a:after{transition:none}}@supports not (padding: max(0px)){.header{padding-top:10px}.header-inner{padding-left:20px;padding-right:20px}}.project-card{display:flex;flex-direction:column;overflow:hidden;border-radius:16px;background:var(--glass);border:1px solid var(--stroke);box-shadow:var(--shadow);transition:transform .18s ease,background .18s ease}.project-card:hover{transform:translateY(-2px);background:#ffffff14}.project-image{width:100%;height:180px;object-fit:cover;display:block;border-bottom:1px solid var(--stroke)}.project-content{padding:16px 18px}.project-content h3{margin:0 0 4px;font-size:1.02rem;font-weight:600;letter-spacing:.1px}.project-content p{margin:0 0 4px;color:var(--text);opacity:.92;letter-spacing:.06px;overflow-wrap:break-word;white-space:normal;max-width:100%;line-height:1.25}@media (max-width: 540px){.project-content p{line-height:1.28;margin-bottom:.5rem}}.tech-list{display:flex;flex-wrap:wrap;gap:6px;margin:4px 0 10px}.tech-badge{border:1px solid var(--stroke);border-radius:999px;padding:5px 9px;background:#ffffff0a;color:var(--muted);font-size:.8rem;font-weight:500;letter-spacing:.05px}.project-links{display:flex;gap:12px;align-items:center}.project-links a{display:inline-flex;align-items:center;gap:6px;font-weight:600;color:var(--gold);letter-spacing:.05px;transition:color .2s ease}.project-links a:hover{color:var(--gold-2)}.skills-grid{display:flex;flex-wrap:wrap;gap:12px;margin-top:20px;justify-content:center}.skill-badge{background:#ffffff0a;color:var(--gold);padding:10px 16px;border-radius:999px;border:1px solid var(--stroke);font-weight:600;transition:transform .15s ease,background .15s ease}.skill-badge:hover{transform:translateY(-1px);background:#ffffff0f}html{margin:0;padding:0}body{margin:0;padding:0;overflow-x:hidden}.nav a{flex-shrink:0;display:inline-flex;align-items:center}.container{max-width:1120px;margin:0 auto;padding:0 24px}.section{padding:56px 0;border-bottom:1px solid rgba(255,255,255,.05)}.section:last-child{border-bottom:none}@media (max-width: 640px){.section{padding:36px 0}}.profile-card{margin-top:40px;display:flex;justify-content:center}.profile-card .profile-header{position:relative;text-align:center;display:flex;flex-direction:column;align-items:center;gap:8px;width:100%;max-width:700px;padding:clamp(20px,4vw,32px);border-radius:20px;background:#ffffff0f;border:1px solid rgba(255,255,255,.12);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);box-shadow:0 16px 42px #00000073;overflow:hidden}.profile-card .profile-header:before{content:"";position:absolute;top:-1px;right:-1px;bottom:-1px;left:-1px;background:radial-gradient(900px 380px at 50% -10%,rgba(212,175,55,.1),transparent 60%),radial-gradient(700px 260px at 110% 0%,rgba(212,175,55,.06),transparent 60%);pointer-events:none}.profile-name{margin:0;font-size:clamp(1.6rem,3.2vw,2.2rem);font-weight:700;letter-spacing:.4px;color:var(--text)}.profile-role{margin:0;font-size:clamp(.98rem,1.8vw,1.12rem);font-weight:500;color:var(--muted)}.section>h2{width:100%;max-width:700px;margin:0 auto 14px;text-align:center;font-weight:600;letter-spacing:.4px;font-size:clamp(1.25rem,2.2vw,1.6rem);color:var(--gold);text-shadow:0 1px 0 rgba(0,0,0,.25);text-wrap:balance}#about.section{display:flex;flex-direction:column;align-items:center}#about .about-title{width:100%;max-width:700px;display:flex;justify-content:center;align-items:center;margin-bottom:16px}#about .title-with-dot{width:100%;display:inline-flex;align-items:center;justify-content:center;gap:8px;line-height:1.2;font-size:clamp(1.35rem,2.6vw,1.8rem);font-weight:600;color:var(--gold);text-align:center}#about.section p,#contact p{max-width:700px;margin:0 auto;text-align:justify;line-height:1.6;color:#dcdcdc;text-justify:inter-word}#about.section p+p,#contact p+p{margin-top:12px}.grid-container{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:clamp(16px,3vw,24px);margin-top:20px;justify-items:center;align-items:stretch}.project-card{width:100%;max-width:380px}@media (min-width: 1280px){.grid-container{gap:26px}}.floating-brand{position:fixed;right:max(24px,env(safe-area-inset-right));bottom:max(24px,env(safe-area-inset-bottom));width:56px;height:56px;border-radius:50%;padding:4px;background:#ffffff0f;border:1px solid rgba(255,255,255,.14);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);box-shadow:0 10px 24px #0006,0 0 18px #d4af372e;opacity:0;transform:translateY(10px) scale(.92);pointer-events:none;transition:opacity .25s ease,transform .25s ease,box-shadow .25s ease;z-index:50}.floating-brand img{width:100%;height:100%;display:block;object-fit:cover;border-radius:50%;border:2px solid rgba(212,175,55,.55)}.floating-brand.show{opacity:1;transform:translateY(0) scale(1);pointer-events:auto;box-shadow:0 14px 30px #00000073,0 0 26px #d4af3747}.floating-brand.show:hover{transform:translateY(-2px) scale(1.02)}.btn-icon{display:inline-flex;align-items:center;padding:15px;gap:8px;line-height:1}@media (max-width: 540px){.floating-brand{right:max(16px,env(safe-area-inset-right));bottom:max(16px,env(safe-area-inset-bottom));width:48px;height:48px}.section p{line-height:1.35;margin-bottom:.65rem;text-align:left}.section h2,.profile-name,.profile-role{line-height:1.2}}@media (min-width: 768px){.section{padding:48px 0}.grid-container{gap:20px}.profile-card .profile-header{padding:32px}}@media (min-width: 1024px){.section{padding:64px 0}.grid-container{grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}.profile-name{font-size:2rem}}@media (min-width: 1440px){.container{max-width:1320px}.grid-container{gap:32px}}:root{--bg: #0b0c0f;--text: #e9e9e9;--muted: #bdbdbd;--gold: #d4af37;--gold-2: #e6c767;--glass: rgba(255,255,255,.06);--stroke: rgba(255,255,255,.12);--shadow: 0 12px 36px rgba(0,0,0,.45);--r-lg: 18px;--r-xl: 26px}*{box-sizing:border-box}html,body,#root{height:100%}html{background:var(--bg);scroll-padding-top:80px;scroll-padding-top:calc(80px + env(safe-area-inset-top))}body{margin:0;font-family:Poppins,ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Inter,Arial,sans-serif;color:var(--text);background:radial-gradient(900px 400px at 12% -8%,rgba(212,175,55,.08),transparent 60%),radial-gradient(700px 320px at 110% 0%,rgba(212,175,55,.06),transparent 60%),var(--bg)}a{color:var(--gold);text-decoration:none}a:hover{text-decoration:underline}.section{padding:60px 20px;max-width:1080px;margin:0 auto}.glass{background:var(--glass);border:1px solid var(--stroke);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-radius:var(--r-lg);box-shadow:var(--shadow)}h1,h2,h3{margin:0 0 12px}h2{font-size:1.6rem;color:var(--gold)}h3{font-size:1.15rem}.grid-container{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:22px}.text-muted{color:var(--muted)}.pad{padding:24px}.pad-lg{padding:28px}.round{border-radius:var(--r-xl)}.center{display:flex;align-items:center;justify-content:center}#contact p{text-align:center}.fullscreen,.hero{min-height:100svh}:target{scroll-margin-top:calc(80px + env(safe-area-inset-top))}@supports not (padding: max(0px)){:target{scroll-margin-top:80px}}
