Delete style.css

style.css

@@ -1,224 +0,0 @@
-/* Linear Portfolio Template Styles */
-@import url('https://fonts.googleapis.com/css2?family=Syne:wght@300;400;500;600;700;800;900&display=swap');
-
-* {
-  margin: 0;
-  padding: 0;
-  box-sizing: border-box;
-}
-
-html {
-  scroll-behavior: smooth;
-}
-
-body {
-  font-family: 'Syne', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
-  line-height: 1.6;
-  color: #1f2937;
-  /* Enable hardware acceleration */
-  transform: translateZ(0);
-  -webkit-transform: translateZ(0);
-  /* Optimize rendering */
-  will-change: transform;
-}
-
-/* Custom animations - optimized for performance */
-@keyframes fadeInUp {
-  from {
-    opacity: 0;
-    transform: translateY3d(30px, 0, 0);
-  }
-  to {
-    opacity: 1;
-    transform: translateY3d(0, 0, 0);
-  }
-}
-
-@keyframes slideInLeft {
-  from {
-    opacity: 0;
-    transform: translate3d(-30px, 0, 0);
-  }
-  to {
-    opacity: 1;
-    transform: translate3d(0, 0, 0);
-  }
-}
-
-@keyframes slideInRight {
-  from {
-    opacity: 0;
-    transform: translate3d(30px, 0, 0);
-  }
-  to {
-    opacity: 1;
-    transform: translate3d(0, 0, 0);
-  }
-}
-
-/* Animation classes - optimized with will-change */
-.animate-fade-in-up {
-  animation: fadeInUp 0.8s ease-out forwards;
-  will-change: opacity, transform;
-}
-
-.animate-slide-in-left {
-  animation: slideInLeft 0.8s ease-out forwards;
-  will-change: opacity, transform;
-}
-
-.animate-slide-in-right {
-  animation: slideInRight 0.8s ease-out forwards;
-  will-change: opacity, transform;
-}
-
-/* Custom scrollbar - simplified for performance */
-::-webkit-scrollbar {
-  width: 6px;
-}
-
-::-webkit-scrollbar-track {
-  background: #f1f5f9;
-}
-
-::-webkit-scrollbar-thumb {
-  background: #cbd5e1;
-  border-radius: 3px;
-}
-
-::-webkit-scrollbar-thumb:hover {
-  background: #94a3b8;
-}
-
-/* Form styles - fixed ring property */
-input:focus,
-textarea:focus {
-  outline: none;
-  box-shadow: 0 0 0 2px #000000;
-  border-color: #000000;
-}
-
-/* Smooth transitions - limited to transform and opacity for better performance */
-a,
-button {
-  transition: transform 0.2s ease-in-out, opacity 0.2s ease-in-out;
-}
-
-/* Mobile optimizations */
-@media (max-width: 768px) {
-  .mobile-menu {
-    border-top: 1px solid #f1f5f9;
-    margin-top: 1rem;
-    padding-top: 1rem;
-  }
-}
-
-/* Hero section responsive text */
-@media (max-width: 640px) {
-  .hero-text {
-    font-size: 3rem;
-    line-height: 1.1;
-  }
-}
-
-/* Loading animation for images - optimized with will-change */
-img {
-  transition: opacity 0.3s ease-in-out;
-  will-change: opacity;
-}
-
-img[loading] {
-  opacity: 0;
-}
-
-img[loaded] {
-  opacity: 1;
-}
-
-/* Custom focus styles for accessibility */
-a:focus,
-button:focus {
-  outline: 2px solid #000000;
-  outline-offset: 2px;
-}
-
-/* Gradient text effect - optimized with will-change */
-.gradient-text {
-  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
-  -webkit-background-clip: text;
-  -webkit-text-fill-color: transparent;
-  background-clip: text;
-  will-change: transform;
-}
-
-/* Card hover effects - optimized with transform3d and will-change */
-.card-hover {
-  transition: transform 0.3s ease-in-out, box-shadow 0.3s ease-in-out;
-  will-change: transform, box-shadow;
-}
-
-.card-hover:hover {
-  transform: translateY3d(-4px, 0, 0);
-  box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
-}
-
-/* Button press effect - optimized with transform3d */
-.btn-press:active {
-  transform: scale3d(0.98, 0.98, 1);
-}
-
-/* Custom spacing for sections */
-.section-padding {
-  padding-top: 6rem;
-  padding-bottom: 6rem;
-}
-
-@media (max-width: 768px) {
-  .section-padding {
-    padding-top: 4rem;
-    padding-bottom: 4rem;
-  }
-}
-
-/* Glass morphism effect - optimized with will-change */
-.glass {
-  background: rgba(255, 255, 255, 0.25);
-  backdrop-filter: blur(10px);
-  border: 1px solid rgba(255, 255, 255, 0.18);
-  will-change: transform;
-}
-
-/* Notification styles - optimized with transform3d and will-change */
-.notification {
-  position: fixed;
-  top: 20px;
-  right: 20px;
-  background: white;
-  border: 1px solid #e5e7eb;
-  border-radius: 8px;
-  padding: 16px;
-  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1);
-  z-index: 1000;
-  transform: translate3d(100%, 0, 0);
-  transition: transform 0.3s ease-in-out;
-  will-change: transform;
-}
-
-.notification.show {
-  transform: translate3d(0, 0, 0);
-}
-
-/* Dark mode support */
-@media (prefers-color-scheme: dark) {
-  .dark-mode-toggle {
-    background: #1f2937;
-    color: #f9fafb;
-  }
-}
-
-/* Performance optimization class for elements that frequently change */
-.gpu-accelerated {
-  transform: translateZ(0);
-  -webkit-transform: translateZ(0);
-  will-change: transform;
-}