@import "https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;600;800&family=Plus+Jakarta+Sans:ital,wght@0,300;0,400;0,500;0,700;1,400&display=swap";:root{--hue-primary:145;--hue-secondary:190;--hue-accent:35;--bg-primary:oklch(99% .005 var(--hue-primary));--bg-secondary:oklch(97% .01 var(--hue-primary));--card-bg:oklch(100% 0 0);--text-primary:oklch(20% .02 var(--hue-primary));--text-secondary:oklch(45% .02 var(--hue-primary));--accent-primary:oklch(65% .2 var(--hue-primary));--accent-secondary:oklch(85% .15 var(--hue-secondary));--accent-tertiary:oklch(75% .18 var(--hue-accent));--border-subtle:oklch(92% .01 var(--hue-primary));--card-shadow:0 4px 24px -6px oklch(20% .02 var(--hue-primary) / .08);--font-display:"Outfit", system-ui, sans-serif;--font-body:"Plus Jakarta Sans", system-ui, sans-serif;--step-0:clamp(1rem, .15vw + .96rem, 1.05rem);--step-1:clamp(1.25rem, .25vw + 1.19rem, 1.31rem);--step-2:clamp(1.56rem, .4vw + 1.46rem, 1.64rem);--step-3:clamp(1.95rem, .63vw + 1.8rem, 2.05rem);--step-4:clamp(2.44rem, .98vw + 2.2rem, 2.56rem);--step-5:clamp(3.05rem, 1.51vw + 2.67rem, 3.2rem);--space-unit:clamp(1rem, 2vw, 1.5rem)}[data-theme=dark]{--bg-primary:oklch(14% .015 var(--hue-primary));--bg-secondary:oklch(18% .02 var(--hue-primary));--card-bg:oklch(22% .025 var(--hue-primary));--text-primary:oklch(95% .01 var(--hue-primary));--text-secondary:oklch(80% .02 var(--hue-primary));--accent-primary:oklch(75% .15 var(--hue-primary));--accent-secondary:oklch(85% .1 var(--hue-secondary));--accent-tertiary:oklch(80% .15 var(--hue-accent));--border-subtle:oklch(25% .02 var(--hue-primary));--card-shadow:0 10px 40px -10px oklch(0% 0 0/.6)}*{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--font-body);font-size:var(--step-0);background-color:var(--bg-primary);color:var(--text-primary);-webkit-font-smoothing:antialiased;line-height:1.6;transition:background-color .5s cubic-bezier(.4,0,.2,1),color .5s cubic-bezier(.4,0,.2,1)}h1,h2,h3,h4{font-family:var(--font-display);color:var(--text-primary);letter-spacing:-.02em;text-wrap:balance;font-weight:800;line-height:1.1}:focus-visible{outline:3px solid var(--accent-primary);outline-offset:4px}@media (prefers-reduced-motion:reduce){*,:before,:after{background-attachment:initial!important;scroll-behavior:auto!important;transition-duration:1ms!important;transition-delay:-1ms!important;animation-duration:1ms!important;animation-iteration-count:1!important;animation-delay:-1ms!important}}a{color:var(--accent-primary);text-decoration:none;transition:all .2s}button{cursor:pointer;background:0 0;border:none;font-family:inherit}.container{max-width:1200px;padding:0 var(--space-unit);margin:0 auto}.fade-in{animation:1s cubic-bezier(.2,1,.3,1) forwards reveal}@keyframes reveal{0%{opacity:0;transform:translateY(24px)}to{opacity:1;transform:translateY(0)}}.app-shell{flex-direction:column;min-height:100vh;display:flex}.header{background-color:oklch(from var(--bg-primary) l c h / .8);border-bottom:1px solid var(--border-subtle);z-index:100;backdrop-filter:blur(12px);align-items:center;height:clamp(60px,10vh,80px);display:flex;position:sticky;top:0}.header-content{justify-content:space-between;align-items:center;width:100%;display:flex}.logo-group{align-items:center;gap:.75rem;display:flex}.logo-text{font-family:var(--font-display);font-size:var(--step-1);color:var(--accent-primary);letter-spacing:-.03em;font-weight:800}.badge{background-color:var(--accent-secondary);color:oklch(20% .1 var(--hue-secondary));font-size:var(--step--1);text-transform:uppercase;letter-spacing:.05em;border-radius:100px;padding:4px 12px;font-weight:800}.theme-toggle{background:var(--bg-secondary);border:1px solid var(--border-subtle);width:44px;height:44px;box-shadow:var(--card-shadow);border-radius:12px;justify-content:center;align-items:center;font-size:1.25rem;transition:all .3s cubic-bezier(.34,1.56,.64,1);display:flex}.theme-toggle:hover{background-color:var(--bg-primary);transform:scale(1.05)rotate(12deg)}.hero{padding-block:var(--step-5) var(--step-4);position:relative;overflow:hidden}.hero:before{content:"";background:radial-gradient(circle, var(--accent-secondary) 0%, transparent 70%);opacity:.15;filter:blur(80px);z-index:-1;width:40%;height:60%;position:absolute;top:-10%;right:-10%}.hero h1{font-size:var(--step-5);max-width:16ch;color:var(--text-primary);margin-bottom:1.5rem}.hero h1 span{color:var(--accent-primary);letter-spacing:-.04em;font-style:italic;font-weight:300;display:block}.hero p{font-size:var(--step-1);color:var(--text-secondary);max-width:45ch;margin-bottom:3rem;line-height:1.4}.hero-stats{gap:var(--step-3);display:flex}.stat-item strong{font-size:var(--step-3);color:var(--accent-primary);display:block}.stat-item span{color:var(--text-secondary);text-transform:uppercase;font-size:var(--step--1);letter-spacing:.1em;font-weight:700}.projects-section{padding-block:var(--step-5);background-color:var(--bg-secondary);border-radius:clamp(2rem,5vw,4rem) clamp(2rem,5vw,4rem) 0 0}.projects-toolbar{margin-bottom:var(--step-3);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:2rem;display:flex}.section-header{margin-bottom:0}.section-header h2{font-size:var(--step-3);margin-bottom:.5rem}.filter-hint{color:var(--accent-primary);font-weight:700;font-size:var(--step--1);text-transform:uppercase;letter-spacing:.1em}.category-filter{-webkit-overflow-scrolling:touch;scrollbar-width:none;-ms-overflow-style:none;gap:.5rem;width:100%;min-width:0;padding-bottom:.5rem;display:flex;overflow-x:auto}.category-filter::-webkit-scrollbar{display:none}.filter-btn{font-size:var(--step--1);color:var(--text-secondary);background:var(--bg-primary);border:1px solid var(--border-subtle);white-space:nowrap;border-radius:100px;padding:8px 16px;font-weight:700;transition:all .3s}.filter-btn:hover{background:var(--bg-secondary);border-color:var(--accent-primary)}.filter-btn.active{background:var(--accent-primary);color:#fff;border-color:var(--accent-primary);box-shadow:0 4px 12px -4px oklch(from var(--accent-primary) l c h / .4)}.project-grid{gap:var(--space-unit);grid-template-columns:repeat(auto-fill,minmax(min(100%,320px),1fr));display:grid}.project-card{background-color:var(--card-bg);box-shadow:var(--card-shadow);border:1px solid var(--border-subtle);cursor:pointer;border-radius:2rem;flex-direction:column;transition:all .4s cubic-bezier(.2,1,.3,1);display:flex;overflow:hidden}.project-card:hover{border-color:var(--accent-primary);box-shadow:0 20px 40px -20px oklch(from var(--accent-primary) l c h / .3);transform:translateY(-12px)}.card-visual{justify-content:center;align-items:center;height:240px;display:flex;position:relative}.card-pattern{opacity:.15;background-image:radial-gradient(circle at 2px 2px,#fff 1px,#0000 0),linear-gradient(45deg,#0000 48%,#fff 50%,#0000 52%);background-size:24px 24px,100% 100%;position:absolute;inset:0}.category-tag{backdrop-filter:blur(8px);color:#fff;font-size:var(--step--1);background:oklch(0% 0 0/.2);border-radius:100px;padding:6px 14px;font-weight:800;position:absolute;top:1.25rem;left:1.25rem}.card-info{flex-grow:1;padding:2rem}.card-info h3{font-size:var(--step-2);margin-bottom:.5rem;line-height:1.2}.student-name{color:var(--accent-primary);font-weight:800;font-size:var(--step--1);margin-bottom:1rem}.description{color:var(--text-secondary);font-size:var(--step-0);line-height:1.5}.modal-overlay{backdrop-filter:blur(8px);z-index:1000;background:oklch(0% 0 0/.4);justify-content:center;align-items:center;padding:1.5rem;animation:.3s fadeIn;display:flex;position:fixed;inset:0}.modal-content{background:var(--bg-primary);width:min(700px,100%);max-height:90vh;box-shadow:var(--card-shadow);border-radius:2rem;flex-direction:column;animation:.4s cubic-bezier(.34,1.56,.64,1) slideUp;display:flex;position:relative;overflow:hidden}.modal-scroll-area{flex-direction:column;flex:1;display:flex;overflow-y:auto}.modal-header{justify-content:center;align-items:center;height:240px;min-height:240px;display:flex;position:relative}.modal-body{padding:var(--step-2)}.modal-body h2{font-size:var(--step-3);margin-block:.5rem 1rem}.project-process{background:var(--bg-secondary);border-left:4px solid var(--accent-primary);border-radius:1rem;margin-block:2rem;padding:1.5rem}.project-process h4{text-transform:uppercase;font-size:var(--step--1);margin-bottom:.5rem}.modal-actions{justify-content:flex-end;display:flex}.primary-button{background:var(--accent-primary);color:#fff;border-radius:1rem;padding:12px 24px;font-weight:700;transition:all .3s}.primary-button:hover{box-shadow:0 4px 12px oklch(from var(--accent-primary) l c h / .3);transform:translateY(-2px)}.close-btn{z-index:10;background:#fff;border-radius:50%;justify-content:center;align-items:center;width:40px;height:40px;font-size:1.5rem;transition:all .2s;display:flex;position:absolute;top:1rem;right:1rem;box-shadow:0 2px 8px oklch(0% 0 0/.1)}.close-btn:hover{background:var(--accent-secondary);transform:rotate(90deg)}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideUp{0%{opacity:0;transform:translateY(40px)}to{opacity:1;transform:translateY(0)}}.footer{padding-block:var(--step-4);background-color:var(--bg-primary);text-align:center}.footer p{color:var(--text-secondary);margin-bottom:1.5rem;max-width:40ch;margin-inline:auto}.footer-links{justify-content:center;gap:2rem;display:flex}.footer-links a{font-size:var(--step--1);color:var(--text-secondary);text-transform:uppercase;letter-spacing:.05em;font-weight:700}.footer-links a:hover{color:var(--accent-primary)}@media (width<=850px){.projects-toolbar{flex-direction:column;align-items:flex-start;gap:1.5rem}}@media (width<=600px){.hero-stats{flex-direction:column;gap:1.5rem}}
