:root{color-scheme:light;--bg: #f5f8fd;--surface: #ffffff;--surface-muted: #eef3fb;--text: #101828;--text-muted: #475467;--border: #d7e1ee;--primary: #1f56d9;--primary-dark: #1b48b2;--accent: #0f766e;--shadow-md: 0 12px 30px rgba(15, 23, 42, .08);--shadow-lg: 0 24px 60px rgba(15, 23, 42, .14);--radius-lg: 20px;--radius-md: 12px;--container: 1140px}.portfolio-app.dark{color-scheme:dark;--bg: #070d17;--surface: #0f1a2b;--surface-muted: #121f33;--text: #f8fbff;--text-muted: #c6d0dd;--border: #28364a;--primary: #7fa8ff;--primary-dark: #9cbcff;--accent: #5eead4;--shadow-md: 0 14px 30px rgba(0, 0, 0, .35);--shadow-lg: 0 24px 60px rgba(0, 0, 0, .48)}html{scroll-behavior:smooth}*{box-sizing:border-box}body{margin:0;font-family:Inter,Segoe UI,system-ui,-apple-system,sans-serif;background:var(--bg);color:var(--text)}a{color:inherit;text-decoration:none}button,input,textarea{font:inherit}.portfolio-app{min-height:100vh;background:radial-gradient(1200px 600px at 100% -10%,rgba(31,86,217,.13),transparent 62%),radial-gradient(700px 350px at -10% 20%,rgba(15,118,110,.08),transparent 62%),var(--bg);color:var(--text);position:relative;overflow-x:clip}.scroll-progress{position:fixed;top:0;left:0;height:3px;width:100%;background:linear-gradient(90deg,var(--accent),var(--primary));transform-origin:0%;z-index:60}.background-accents{position:fixed;inset:0;pointer-events:none;z-index:0}.accent-orb{position:absolute;border-radius:999px;filter:blur(40px);opacity:.45;animation:floatDrift 14s ease-in-out infinite}.accent-orb-one{width:18rem;height:18rem;top:6%;right:-5%;background:color-mix(in srgb,var(--primary) 42%,transparent)}.accent-orb-two{width:14rem;height:14rem;bottom:8%;left:-4%;background:color-mix(in srgb,var(--accent) 45%,transparent);animation-delay:-5s}.accent-grid{position:absolute;inset:0;background-image:linear-gradient(color-mix(in srgb,var(--border) 50%,transparent) 1px,transparent 1px),linear-gradient(90deg,color-mix(in srgb,var(--border) 50%,transparent) 1px,transparent 1px);background-size:44px 44px;-webkit-mask-image:radial-gradient(circle at center,rgba(0,0,0,.15),transparent 75%);mask-image:radial-gradient(circle at center,rgba(0,0,0,.15),transparent 75%);opacity:.18}.container{width:min(100% - 2.5rem,var(--container));margin-inline:auto;position:relative;z-index:1}.section{padding:6rem 0;scroll-margin-top:5.5rem}.muted-section{background:color-mix(in srgb,var(--surface-muted) 88%,transparent)}.site-header{position:sticky;top:0;z-index:30;border-bottom:1px solid var(--border);background:color-mix(in srgb,var(--surface) 84%,transparent);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}.nav{display:flex;align-items:center;justify-content:space-between;gap:1.25rem;min-height:4.6rem}.brand{display:inline-flex;align-items:center;gap:.75rem;font-weight:700}.brand-mark{width:2.2rem;height:2.2rem;display:grid;place-items:center;border-radius:10px;overflow:hidden;box-shadow:0 6px 14px #1f56d947}.brand-mark img{width:100%;height:100%;display:block;object-fit:cover}.nav-links{display:flex;align-items:center;gap:1.1rem;color:var(--text-muted);font-weight:600;font-size:.93rem}.nav-links a:hover{color:var(--primary)}.nav-link-item{position:relative}.nav-link-item:after{content:"";position:absolute;left:0;bottom:-.35rem;width:100%;height:2px;background:var(--primary);transform:scaleX(0);transform-origin:left;transition:transform .25s ease}.nav-link-item:hover:after{transform:scaleX(1)}.theme-toggle{border:1px solid var(--border);border-radius:var(--radius-md);padding:.6rem .85rem;background:var(--surface);color:var(--text);cursor:pointer;transition:border-color .2s ease,transform .2s ease}.theme-toggle:hover{border-color:var(--primary);transform:translateY(-1px)}.button{border:1px solid transparent;border-radius:var(--radius-md);padding:.8rem 1rem;min-height:2.75rem;display:inline-flex;align-items:center;justify-content:center;font-weight:700;cursor:pointer;transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease}.button:hover{transform:translateY(-1px)}.button-primary{background:var(--primary);color:#fff;box-shadow:0 10px 24px #1d4ed840}.button-primary:hover{background:var(--primary-dark)}.button-secondary{background:var(--surface);border-color:var(--border);color:var(--text)}.button-secondary:hover{border-color:var(--primary);color:var(--primary)}.button-ghost{color:var(--primary)}.button-small{min-height:2.45rem;padding:.65rem .85rem;font-size:.9rem}.section-heading{max-width:48rem;margin-bottom:2rem}.section-heading-center{margin-inline:auto;text-align:center}.section-eyebrow{margin:0 0 .8rem;color:var(--accent);text-transform:uppercase;letter-spacing:.12em;font-size:.76rem;font-weight:800}.section-heading h2{margin:0;font-size:clamp(1.9rem,4vw,2.9rem);line-height:1.12;letter-spacing:-.02em}.section-description{margin:1rem 0 0;color:var(--text-muted);line-height:1.7}.hero{min-height:calc(100vh - 4.6rem);display:flex;align-items:center;padding-top:2.5rem}.hero-grid{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);gap:4rem;align-items:center}.hero h1{margin:0;font-size:clamp(2.2rem,6vw,4.25rem);line-height:.97}.hero-role{margin:1.1rem 0 0;color:var(--primary);font-size:clamp(1.02rem,2.2vw,1.35rem);font-weight:700}.hero-statement{margin:1rem 0 0;color:var(--text-muted);max-width:38rem;line-height:1.7;font-size:1.05rem}.hero-meta{margin:.8rem 0 0;color:var(--text-muted);font-weight:600}.hero-actions{display:flex;flex-wrap:wrap;gap:.8rem;margin-top:2rem}.profile-visual{border:1px solid var(--border);border-radius:var(--radius-lg);background:var(--surface);padding:1rem;box-shadow:var(--shadow-lg);transition:transform .35s ease,box-shadow .35s ease}.profile-visual:hover{transform:translateY(-4px);box-shadow:0 32px 66px #0f172a33}.profile-image{width:100%;max-height:27rem;object-fit:cover;border-radius:14px}.profile-caption{margin-top:1rem;display:grid;gap:.3rem}.profile-caption strong{font-size:.98rem}.profile-caption span{color:var(--text-muted);font-size:.92rem}.section-grid{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:3rem}.content-card{border:1px solid var(--border);border-radius:var(--radius-lg);background:var(--surface);padding:2rem;box-shadow:var(--shadow-md);transition:transform .25s ease,box-shadow .25s ease}.content-card:hover{transform:translateY(-3px);box-shadow:var(--shadow-lg)}.content-card p{margin:0;color:var(--text-muted);line-height:1.8}.content-card p+p{margin-top:1rem}.filter-row{display:flex;gap:.6rem;flex-wrap:wrap;margin-bottom:1.25rem}.filter-pill{border:1px solid var(--border);border-radius:999px;background:var(--surface);color:var(--text-muted);padding:.48rem .9rem;font-size:.86rem;font-weight:700;cursor:pointer;transition:all .25s ease}.filter-pill:hover{transform:translateY(-1px);border-color:color-mix(in srgb,var(--primary) 42%,var(--border))}.filter-pill-active{color:#fff;border-color:var(--primary);background:var(--primary)}.project-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem}.project-card{border:1px solid var(--border);border-radius:var(--radius-lg);padding:1.3rem;background:var(--surface);box-shadow:var(--shadow-md);display:flex;flex-direction:column;gap:.85rem;transition:transform .28s ease,border-color .28s ease,box-shadow .28s ease}.project-card:hover{transform:translateY(-4px);border-color:color-mix(in srgb,var(--primary) 42%,var(--border));box-shadow:var(--shadow-lg)}.project-card-featured{border-top:4px solid var(--primary)}.project-card-ongoing{border:2px solid #22c55e!important;box-shadow:0 0 20px #22c55e33,var(--shadow-md)}.project-flag{width:fit-content;border-radius:999px;background:color-mix(in srgb,var(--primary) 14%,transparent);color:var(--primary);font-size:.75rem;font-weight:800;padding:.3rem .55rem}.project-flag-ongoing{background:#dcfce7;color:#16a34a}.project-card h3{margin:.2rem 0 0}.project-content-block h4{margin:0;font-size:.83rem;text-transform:uppercase;letter-spacing:.06em;color:var(--text)}.project-content-block p{margin:.45rem 0 0;color:var(--text-muted);line-height:1.65;font-size:.95rem}.project-points{margin:.55rem 0 0;padding-left:1rem;color:var(--text-muted);display:grid;gap:.45rem;line-height:1.6;font-size:.94rem}.badge-list{display:flex;flex-wrap:wrap;gap:.45rem}.badge-list span{border:1px solid var(--border);border-radius:999px;padding:.35rem .6rem;background:var(--surface-muted);color:var(--text-muted);font-size:.78rem;font-weight:700}.project-actions{display:flex;gap:.6rem;margin-top:.35rem}.project-warning{margin:.6rem 0 0;padding:.6rem .75rem;background:#fef3c7;border-left:3px solid #f59e0b;color:#92400e;font-size:.85rem;line-height:1.5;border-radius:4px}.portfolio-app.dark .project-warning{background:#78350f;border-left-color:#d97706;color:#fcd34d}.timeline{display:grid;border-left:2px solid var(--border);margin-left:.5rem;gap:1rem}.timeline-item{display:grid;grid-template-columns:auto 1fr;gap:.85rem}.timeline-marker{width:.8rem;height:.8rem;margin-top:.65rem;margin-left:-.95rem;border-radius:50%;background:var(--primary)}.timeline-content{border:1px solid var(--border);border-radius:var(--radius-lg);padding:1.2rem;background:var(--surface);box-shadow:var(--shadow-md)}.timeline-meta{margin:0;color:var(--accent);text-transform:uppercase;letter-spacing:.08em;font-size:.75rem;font-weight:700}.timeline-company{margin:.2rem 0 0;color:var(--text-muted);font-weight:600}.timeline-content ul{margin:.9rem 0 0;padding-left:1.05rem;display:grid;gap:.5rem;color:var(--text-muted)}.skills-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:.9rem}.skill-card{border:1px solid var(--border);border-radius:var(--radius-md);background:var(--surface);padding:1.15rem;box-shadow:var(--shadow-md);transition:transform .24s ease,border-color .24s ease}.skill-card:hover{transform:translateY(-3px);border-color:color-mix(in srgb,var(--primary) 40%,var(--border))}.skill-card h3{margin:0;color:var(--primary);font-size:.98rem}.skill-card ul{margin:.75rem 0 0;padding:0;list-style:none;color:var(--text-muted);display:grid;gap:.52rem;font-size:.93rem}.building-list{margin:0;padding-left:1.1rem;display:grid;gap:.8rem;color:var(--text-muted)}.profiles-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.95rem}.profile-card{border:1px solid var(--border);border-radius:var(--radius-md);background:var(--surface);padding:1.2rem;transition:border-color .22s ease,transform .22s ease,box-shadow .22s ease;box-shadow:var(--shadow-md)}.profile-card:hover{border-color:var(--primary);transform:translateY(-3px);box-shadow:var(--shadow-lg)}.profile-card h3{margin:0}.profile-card p{margin:.65rem 0 0;color:var(--text-muted);line-height:1.6}.contact-grid{display:grid;grid-template-columns:minmax(0,.86fr) minmax(0,1.14fr);gap:2rem}.contact-links{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.75rem}.contact-panel{max-width:100%}.contact-link-card{border:1px solid var(--border);border-radius:var(--radius-md);background:var(--surface);padding:.9rem;display:grid;gap:.24rem;box-shadow:var(--shadow-md);transition:transform .2s ease,border-color .2s ease}.contact-link-card:hover{transform:translateY(-2px);border-color:var(--primary)}.contact-label{color:var(--text-muted);font-size:.76rem;text-transform:uppercase;letter-spacing:.08em}.contact-link-card strong{color:var(--primary);font-size:.96rem}.contact-form{border:1px solid var(--border);border-radius:var(--radius-lg);padding:1.4rem;background:var(--surface);box-shadow:var(--shadow-md);display:grid;gap:.95rem}.contact-form label{display:grid;gap:.45rem;font-size:.93rem;font-weight:700}.contact-form input,.contact-form textarea{border:1px solid var(--border);border-radius:var(--radius-md);padding:.78rem .9rem;background:var(--bg);color:var(--text);outline:none}.contact-form textarea{resize:vertical}.contact-form input:focus,.contact-form textarea:focus{border-color:var(--primary)}.form-status{margin:0;color:var(--accent)}.modal-backdrop{position:fixed;inset:0;background:#00000073;display:grid;place-items:center;padding:1rem;z-index:40}.modal-panel{width:min(980px,100%);border-radius:var(--radius-lg);border:1px solid var(--border);background:var(--surface);box-shadow:var(--shadow-lg);overflow:hidden}.modal-header,.modal-footer{padding:.9rem 1rem;border-bottom:1px solid var(--border);display:flex;justify-content:space-between;align-items:center}.modal-footer{border-bottom:0;border-top:1px solid var(--border)}.modal-header h3{margin:0}.modal-close{border:1px solid var(--border);border-radius:10px;padding:.45rem .7rem;background:var(--surface);color:var(--text);cursor:pointer}.modal-body{height:min(76vh,760px)}.modal-body iframe{width:100%;height:100%;border:0}.site-footer{border-top:1px solid var(--border);padding:1.25rem 0;background:var(--surface)}.scroll-top-button{position:fixed;right:1.1rem;bottom:1.1rem;width:2.8rem;height:2.8rem;border:1px solid color-mix(in srgb,var(--primary) 40%,var(--border));border-radius:999px;background:color-mix(in srgb,var(--surface) 80%,var(--primary) 20%);color:var(--text);display:grid;place-items:center;font-size:1.15rem;font-weight:800;cursor:pointer;z-index:35;box-shadow:var(--shadow-md);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);transition:transform .2s ease,border-color .2s ease}.scroll-top-button:hover{transform:translateY(-2px);border-color:var(--primary)}@keyframes floatDrift{0%,to{transform:translateY(0)}50%{transform:translateY(-14px)}}.footer-content{display:flex;justify-content:space-between;align-items:center;gap:1rem;color:var(--text-muted);font-size:.92rem}.footer-content p{margin:0}.footer-content a{color:var(--primary);font-weight:700}@media(max-width:1080px){.skills-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.profiles-grid,.project-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:900px){.nav{flex-wrap:wrap;padding:.75rem 0;align-items:flex-start}.nav-links{width:100%;overflow-x:auto;order:3;padding-bottom:.2rem}.hero{min-height:auto}.hero-grid,.section-grid,.contact-grid,.contact-links{grid-template-columns:1fr}}@media(max-width:640px){.container{width:min(100% - 1.2rem,var(--container))}.section{padding:4rem 0}.brand-text{display:none}.project-grid,.skills-grid,.profiles-grid{grid-template-columns:1fr}.hero-actions,.project-actions{flex-direction:column}.button{width:100%}.footer-content{flex-direction:column;align-items:flex-start}.scroll-top-button{right:.8rem;bottom:.8rem}}