:root{font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:500;color-scheme:light dark;color:#ffffffde;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;--white: #f8f9fa;background-color:var(--white)}*{margin:0;padding:0;box-sizing:border-box}.home-container{background-color:var(--white);min-height:80vh;display:flex;justify-content:center;align-items:center;padding:2rem}.home{width:60%;max-width:1200px;margin:0 auto;color:#333;display:flex;flex-direction:column;gap:2rem}.line{width:100%;height:1px;background-color:#33333341;margin:1rem 0}.hero-section{display:flex;align-items:center;justify-content:center;margin:0 0 2rem}.introduction-section{width:100%;display:flex;flex-direction:row;align-items:center;height:100%;gap:2rem}.introduction-text{flex:1;width:100%;padding:1rem;display:flex;flex-direction:column;gap:.5rem}.introduction-text h1{font-size:clamp(2rem,5vw,3rem);margin-bottom:-.6rem}.introduction-text h2{font-size:clamp(1.5rem,4vw,2rem);margin:0}.introduction-text p{font-size:clamp(1rem,2vw,1.2rem);color:#333;font-weight:600;line-height:1.6}.introduction-text .cta{background-color:#2e2e2e;text-decoration:none;text-align:center;width:170px;color:var(--white);border:none;padding:.8rem 1.6rem;font-family:inherit;font-size:1rem;font-weight:700;border-radius:90px;cursor:pointer;transition:background-color .3s ease;margin-top:1rem}.introduction-text .cta:hover{background-color:#1e1e1e}.introduction-image{flex:0 0 250px;aspect-ratio:3/4;border-radius:8px;overflow:hidden}.introduction-image img{width:100%;height:100%;object-fit:cover;filter:grayscale(100%) brightness(.6);transition:filter .4s ease}.introduction-image img:hover{filter:grayscale(0%) brightness(1)}.blog-section{padding:1rem}.blog-section-title h1{font-size:clamp(1.5rem,3vw,2rem);margin-bottom:1.5rem}.recents-blog-grid{display:flex;flex-direction:column;gap:1.5rem;padding:1rem 0}.view-all-blogs{text-decoration:underline dotted;color:#333;width:fit-content;font-size:1rem;font-weight:500}.recents-blog-card{background:var(--white);border-radius:8px;overflow:hidden;transition:transform .2s ease,box-shadow .2s ease;position:relative;border:1px solid #33333373;text-decoration:none}.recents-blog-card:hover{transform:translateY(-2px);box-shadow:0 4px 8px #44444426}.recents-blog-card h3{font-size:clamp(1.2rem,2vw,1.4rem);color:#333;padding:1rem;margin-bottom:0;padding-bottom:0}.recents-blog-card .recents-blog-card-content{font-size:clamp(.9rem,1.5vw,1rem);color:#666;line-height:1.6;padding:1rem;margin-top:0;padding-top:0}.loading-spinner{display:flex;justify-content:center;align-items:center;padding:2rem}.error-message{text-align:center;padding:2rem;background:#f8f9fa;border-radius:8px;margin:2rem 0}.home-no-blogs-message{text-align:center;padding:2rem;background:#f8f9fa;border-radius:8px;margin:2rem 0;height:fit-content}.home-no-blogs-message p{color:#666;font-size:1.1rem;margin:0}.projects-section{padding:1rem}.projects-section-title h1{font-size:clamp(1.5rem,3vw,2rem);margin-bottom:1.5rem}.recent-projects-grid{display:flex;flex-wrap:wrap;gap:2rem}.recent-project-card{background:var(--white);border-radius:8px;overflow:hidden;transition:transform .2s ease,box-shadow .2s ease;position:relative;border:1px solid #33333373;text-decoration:none;display:flex;flex-direction:column;max-width:320px;gap:1rem}.recent-project-card:hover{transform:translateY(-2px);box-shadow:0 4px 8px #44444426}.project-image{flex:0 0 200px;overflow:hidden}.project-image img{width:100%;height:auto;object-fit:cover}.project-info{padding:0 1rem;flex:1;display:flex;flex-direction:column;gap:.5rem}.project-info h3{font-size:clamp(1rem,2vw,1.2rem);color:#333;margin:0}.project-info p{font-size:clamp(.9rem,1.5vw,1rem);color:#666;line-height:1.6;margin:0}.tech-tags{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:auto}.tech-tag{background:#e9ecef;color:#495057;padding:.25rem .75rem;border-radius:1rem;font-size:.8rem}.view-all-projects{text-decoration:underline dotted;color:#333;width:fit-content;font-size:1rem;font-weight:500;width:100%;margin-top:.6rem}.home-no-projects-message{text-align:center;padding:2rem;background:#f8f9fa;border-radius:8px;margin:2rem 0;height:fit-content}.home-no-projects-message p{color:#666;font-size:1.1rem;margin:0}@media screen and (max-width: 768px){.home{width:100%}.home-container{padding:1rem}.introduction-section{flex-direction:column;text-align:center}.introduction-text{align-items:center}.recents-blog-grid{grid-template-columns:1fr}.recent-project-card{flex-direction:column}.project-image{flex:0 0 200px;width:100%}}@media screen and (max-width: 480px){.home{gap:1rem;width:100%}.introduction-image{width:240px;height:500px}.recents-blog-grid{padding:0;margin:0}.recents-blog-card{padding:0}.recents-blog-card h3{font-size:1rem}.recents-blog-card .recents-blog-card-content{font-size:.8rem;font-weight:400}.project-image{height:200px}.tech-tag{font-size:.7rem}}.about-container{width:60%;max-width:1200px;margin:0 auto;padding:2rem;min-height:80vh}.about-content{display:flex;flex-direction:column;gap:2rem}.about-hero{text-align:center;padding:2rem 0}.about-hero h1{font-size:2.5rem;margin-bottom:.5rem;color:#333}.subtitle{color:#666;font-size:clamp(1rem,2vw,1.2rem);font-weight:400}.about-section{background:var(--white);padding:2rem;border-radius:8px;border:1px solid #e0e0e0;box-shadow:0 2px 4px #0000000d}.about-section h2{color:#333;margin-bottom:1.5rem;font-size:clamp(1.5rem,3vw,2rem)}.intro-text h2{color:#333;margin-bottom:1rem;font-size:clamp(1.8rem,4vw,2.5rem)}.intro-text p{color:#666;line-height:1.6;font-size:clamp(1rem,2vw,1.2rem)}.skills-tags{display:flex;flex-direction:column;gap:2rem}.skill-group h3{color:#444;margin-bottom:1rem;font-size:clamp(1.2rem,2.5vw,1.5rem)}.tags{display:flex;flex-wrap:wrap;gap:.8rem}.tag{background:#f0f0f0;padding:.5rem 1rem;border-radius:20px;color:#333;font-size:clamp(.8rem,1.5vw,.9rem);transition:background-color .3s ease}.tag:hover{background:#e0e0e0}.timeline{display:flex;flex-direction:column;gap:2rem;position:relative;padding-left:2rem}.timeline:before{content:"";position:absolute;left:7px;top:0;bottom:0;width:2px;background:#e0e0e0}.timeline-item{position:relative;padding:1.5rem;background:var(--white);border-radius:8px;transition:transform .3s ease}.timeline-item:hover{transform:translateY(-2px)}.timeline-item:before{content:"";position:absolute;left:-2rem;top:50%;width:1rem;height:1rem;background:#007bff;border-radius:50%;transform:translateY(-50%)}.timeline-date{color:#666;font-size:clamp(.8rem,1.5vw,.9rem);margin-bottom:.5rem}.timeline-header{margin-bottom:1rem}.timeline-header h3{color:#333;margin-bottom:.5rem;font-size:clamp(1.1rem,2vw,1.3rem)}.timeline-meta{display:flex;gap:1rem;color:#666;font-size:clamp(.8rem,1.5vw,.9rem);margin-bottom:1rem}.timeline-description{color:#666;line-height:1.6;font-size:clamp(.9rem,1.5vw,1rem)}.social-links{display:flex;flex-wrap:wrap;gap:1rem;justify-content:center}.social-link{background:#f0f0f0;padding:.8rem 1.5rem;border-radius:4px;color:#333;text-decoration:none;transition:all .3s ease;display:flex;align-items:center;gap:.5rem;font-size:clamp(.9rem,1.5vw,1rem)}.social-link:hover{background:#e0e0e0;transform:translateY(-2px);box-shadow:0 2px 4px #0000001a}.social-link i{font-size:1.2rem}.loading-spinner{display:flex;justify-content:center;align-items:center;min-height:80vh}.spinner{width:40px;height:40px;border:4px solid #f3f3f3;border-top:4px solid #333;border-radius:50%;animation:spin 1s linear infinite}.error-message{text-align:center;padding:2rem;background:#f8f9fa;border-radius:8px;margin:2rem}.error-message p{color:#dc3545;font-size:1.1rem;margin-bottom:1rem}.empty-message{color:#666;font-style:italic;text-align:center;padding:1rem;font-size:clamp(.9rem,1.5vw,1rem)}@media screen and (max-width: 768px){.about-container{padding:1rem}.about-section{padding:1.5rem;width:100%}.timeline{padding-left:1.5rem}.timeline-item{padding:1rem}.timeline-item:before{left:-1.5rem;width:.8rem;height:.8rem}.social-links{flex-direction:column;align-items:stretch}.social-link{justify-content:center}}@media screen and (max-width: 480px){.about-container{padding:.5rem;width:100%}.about-content{width:100%}.about-section{padding:1rem;width:100%}.timeline-meta{flex-direction:column;gap:.5rem}.tags{gap:.5rem}.tag{padding:.4rem .8rem}}.contact-container{min-height:80vh;width:100%;margin:0 auto;display:flex;justify-content:center;align-items:center;padding:2rem;background-color:var(--white)}.contact-content{width:60%;max-width:1200px;display:flex;flex-direction:column;gap:1rem;border-radius:12px}.contact-info h1{font-size:clamp(2rem,4vw,2.5rem);color:#333;margin-bottom:1rem}.contact-info>p{color:#666;margin-bottom:1.5rem;font-size:clamp(1rem,2vw,1.1rem);line-height:1.6}.contact-details{display:flex;flex-direction:column;gap:1rem}.contact-item{display:flex;align-items:center;gap:1rem;padding:1rem;background:#f8f9fa;border-radius:8px;transition:transform .3s ease}.contact-item:hover{transform:translateY(-2px)}.contact-icon{font-size:clamp(1.2rem,2.5vw,1.5rem);width:40px;height:40px;display:flex;align-items:center;justify-content:center;background:#fff;border-radius:50%;box-shadow:0 2px 4px #0000001a}.contact-text h3{font-size:clamp(1rem,2vw,1.2rem);color:#333;margin-bottom:.25rem}.contact-text p{color:#666;font-size:clamp(.9rem,1.8vw,1rem)}.contact-form-container{background:#f8f9fa;padding:2rem;border-radius:12px}.contact-form{display:flex;flex-direction:column;gap:1.5rem}.contact-form-group{display:flex;flex-direction:column;gap:.5rem}.contact-form-group label{font-size:clamp(.9rem,1.8vw,1rem);color:#333}.contact-form-group .contact-input{padding:.8rem;font-size:clamp(.9rem,1.8vw,1rem);background-color:#fff;border:1px solid #ddd;border-radius:8px;color:#333;transition:border-color .3s ease}.contact-form-group .contact-input:focus{outline:none;border-color:#333}.contact-form-group .contact-input::placeholder{color:#999;font-size:clamp(.9rem,1.8vw,1rem)}.submit-button{max-width:200px;background-color:#333;color:#fff;padding:1rem 2rem;border:none;border-radius:50px;font-size:clamp(.9rem,1.8vw,1rem);font-weight:600;cursor:pointer;transition:all .3s ease;align-self:flex-start}.submit-button:hover{background-color:#181818;transform:translateY(-2px)}.submit-button:disabled{background-color:#999;cursor:not-allowed}.success-message,.error-message{padding:1rem;border-radius:8px;text-align:center;margin-top:1rem;font-size:clamp(.9rem,1.8vw,1rem)}.success-message{background-color:#d4edda;color:#155724;border:1px solid #c3e6cb}.error-message{background-color:#f8d7da;color:#721c24;border:1px solid #f5c6cb}@media screen and (max-width: 968px){.contact-content{grid-template-columns:1fr;gap:2rem}.contact-info{text-align:center}.contact-details,.contact-item{justify-content:center}.submit-button{align-self:center}}@media screen and (max-width: 480px){.contact-container{padding:1rem}.contact-content{padding:1rem;width:100%}.contact-details{grid-template-columns:1fr}.contact-form-container{padding:0}.contact-form-group .contact-input{padding:.7rem}.submit-button{width:100%;max-width:none}}.blog-list-container{width:60%;max-width:1200px;margin:0 auto;padding:2rem;min-height:80vh}.blog-list-header{text-align:center;margin-bottom:3rem}.blog-list-header h1{font-size:clamp(2rem,5vw,3rem);color:#333;margin-bottom:1rem}.blog-list-header p{color:#666;font-size:clamp(1rem,2vw,1.2rem)}.blog-grid{display:flex;flex-direction:column;gap:2rem;padding:1rem 0}.list-blog-card{background:var(--white);border:1px solid #33333373;padding:0;border-radius:12px;overflow:hidden;box-shadow:0 2px 4px #0000001a;transition:transform .3s ease,box-shadow .3s ease;text-decoration:none;display:flex;flex-direction:column}.list-blog-card:hover{transform:translateY(-5px);box-shadow:0 4px 8px #00000026}.blog-image{width:100%;height:200px;overflow:hidden}.blog-image img{width:100%;height:100%;object-fit:cover;transition:transform .3s ease}.list-blog-card:hover .blog-image img{transform:scale(1.05)}.list-blog-content{padding:1rem 2rem;flex:1;display:flex;flex-direction:column}.list-blog-content .list-blog-title{color:#333;font-size:1.2rem;margin-bottom:.4rem;line-height:1.4;margin-top:0}.list-blog-meta{display:flex;justify-content:space-between;flex-wrap:wrap;margin:0;font-size:clamp(.8rem,1.5vw,.9rem)}.list-blog-date{color:#666;font-weight:400}.list-blog-tags{display:flex;flex-wrap:wrap;gap:.5rem}.list-blog-tag{background:#f0f0f0;color:#666;padding:.2rem .6rem;border-radius:4px;font-size:clamp(.7rem,1.5vw,.8rem)}.list-blog-excerpt{color:#666;line-height:1.6;margin-bottom:1rem;flex:1;font-size:clamp(.9rem,1.5vw,1rem)}.read-more{color:#007bff;font-weight:500;margin-top:auto;font-size:clamp(.9rem,1.5vw,1rem)}.no-blogs-message{display:flex;justify-content:center;align-items:center;min-height:400px}.no-blogs-content{text-align:center;padding:3rem;background:#fff;border-radius:12px;box-shadow:0 2px 4px #0000001a;border:2px dashed #e9ecef}.no-blogs-icon{font-size:clamp(2rem,5vw,3rem);margin-bottom:1rem}.no-blogs-content h2{color:#333;margin-bottom:1rem;font-size:clamp(1.5rem,3vw,2rem)}.no-blogs-content p{color:#666;font-size:clamp(1rem,2vw,1.2rem)}@media screen and (max-width: 768px){.blog-list-container{padding:1rem}.blog-list-header{margin-bottom:2rem}.blog-grid{gap:1.5rem}}@media screen and (max-width: 480px){.blog-list-container{width:100%;padding:.5rem}.blog-grid{gap:1rem;padding:.2rem}.list-blog-card{padding:0;margin:0}.list-blog-content{gap:.2rem}.list-blog-meta{flex-direction:column;gap:.5rem;padding:0;margin:0}.list-blog-content .list-blog-excerpt{font-size:.8rem;margin:0;margin-bottom:.5rem}.list-blog-content .list-blog-title{font-size:1rem;font-weight:800;margin:.5rem 0}.list-blog-date{font-size:.8rem}.list-blog-tag{padding:.2rem .4rem}}.blog-page{width:100%;margin:0 auto;padding:2rem;min-height:80vh;display:flex;flex-direction:column;align-items:center;justify-content:center}.blog-post{width:60%;border-radius:12px;overflow:hidden}.blog-header{padding:1rem;padding-bottom:0}.blog-header h1{font-size:clamp(1.8rem,4vw,2.5rem);margin-bottom:1.5rem;color:#333;line-height:1.3}.blog-meta{display:flex;flex-wrap:wrap;gap:1rem;padding:1rem}.status{padding:.25rem .75rem;background:#e9ecef;border-radius:4px;font-size:.9rem;color:#495057;text-transform:capitalize}.tag{background:#f0f0f0;color:#666;padding:.3rem .8rem;border-radius:4px;font-size:clamp(.8rem,1.5vw,.9rem)}.blog-content{padding:1rem;color:#333}.blog-content p{margin:1.5rem 0;line-height:1.6;color:#333;font-size:clamp(1rem,1.5vw,1.1rem);font-weight:400}.blog-content h1,.blog-content h2,.blog-content h3,.blog-content h4,.blog-content h5,.blog-content h6{margin:2rem 0 1rem;line-height:1.3}.blog-content h1{font-size:clamp(1.8rem,4vw,2.2rem)}.blog-content h2{font-size:clamp(1.6rem,3.5vw,2rem)}.blog-content h3{font-size:clamp(1.4rem,3vw,1.8rem)}.blog-content h4{font-size:clamp(1.2rem,2.5vw,1.6rem)}.blog-content h5{font-size:clamp(1.1rem,2vw,1.4rem)}.blog-content h6{font-size:clamp(1rem,1.8vw,1.2rem)}.blog-content ul,.blog-content ol{margin:1.5rem 0;padding-left:2rem}.blog-content li{margin-bottom:.5rem;line-height:1.6}.blog-content a{color:#007bff;text-decoration:none;transition:color .3s ease}.blog-content a:hover{color:#0056b3;text-decoration:underline}.blog-content img{max-width:100%;height:auto;border-radius:8px}.blog-content blockquote{border-left:4px solid #007bff;padding-left:1rem;margin:1.5rem 0;color:#666;font-style:italic}.blog-content pre{background-color:#1e1e1e;border-radius:8px;padding:1.5rem;margin:1.5rem 0;overflow-x:auto;position:relative;box-shadow:0 4px 6px #0000001a}.blog-content pre code{font-family:Fira Code,Consolas,Monaco,Andale Mono,Ubuntu Mono,monospace;font-size:.9rem;line-height:1.5;color:#d4d4d4;display:block;white-space:pre;word-spacing:normal;word-break:normal;word-wrap:normal;-moz-tab-size:4;tab-size:4;-webkit-hyphens:none;hyphens:none}.blog-content code:not(pre code){background-color:#f5f5f5;padding:.2em .4em;border-radius:4px;font-family:Fira Code,Consolas,Monaco,Andale Mono,Ubuntu Mono,monospace;font-size:.9em;color:#e83e8c}.blog-content pre:hover:before{opacity:1}.loading-spinner{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:400px}.spinner{width:40px;height:40px;border:4px solid #f3f3f3;border-top:4px solid #007bff;border-radius:50%;animation:spin 1s linear infinite;margin-bottom:1rem}.error-message{text-align:center;padding:2rem;background:#fff3cd;border-radius:8px;color:#856404;margin:2rem 0}.error-message p{margin-bottom:1rem;font-size:1.1rem}.retry-button{background-color:#007bff;color:#fff;border:none;padding:.5rem 1rem;border-radius:4px;cursor:pointer;transition:background-color .3s ease}.retry-button:hover{background-color:#0056b3}.not-found-message{text-align:center;padding:2rem;background:#f8f9fa;border-radius:8px;color:#6c757d;margin:2rem 0}.not-found-message p{font-size:1.1rem}@media screen and (max-width: 768px){.blog-page{padding:1rem}.blog-post{width:100%}.blog-header{padding:1.5rem}.blog-content{padding:0 1.5rem 1.5rem}.blog-content pre{padding:1rem;margin:1rem 0}.blog-content pre code{font-size:.8rem}}@media screen and (max-width: 480px){.blog-page{padding:.5rem}.blog-header{padding:0 1rem}.blog-content{padding:0 .8rem}.blog-content p{font-size:1rem;margin:.5rem 0;line-height:1.8}.blog-content pre{margin:0;padding:1rem}.blog-content pre code{font-size:.8rem}.blog-meta{flex-direction:column;gap:.5rem}}.blog-content pre code .keyword{color:#569cd6}.blog-content pre code .string{color:#ce9178}.blog-content pre code .number{color:#b5cea8}.blog-content pre code .comment{color:#6a9955}.blog-content pre code .function{color:#dcdcaa}.blog-content pre code .class{color:#4ec9b0}.blog-content pre code .operator{color:#d4d4d4}.blog-content pre code .variable{color:#9cdcfe}.blog-content pre code .constant{color:#4fc1ff}.project-card{background:#fff;border-radius:8px;max-width:300px;overflow:hidden;box-shadow:0 2px 4px #0000001a;transition:transform .3s ease,box-shadow .3s ease}.project-card a{text-decoration:none}.project-card:hover{transform:translateY(-2px);box-shadow:0 4px 8px #0003}.project-image{width:100%;overflow:hidden}.project-image img{width:100%;height:100%;object-fit:cover;transition:transform .3s ease}.project-card:hover .project-image img{transform:scale(1.05)}.project-card-content{padding:1rem;gap:0}.project-card-content h2{font-size:1.2rem;font-weight:600;color:#222}.project-card-content p{color:#666}.project-technologies{display:flex;flex-wrap:wrap;gap:.5rem;margin:0}.technology-tag{background:#c8c8c8;color:#333;padding:.25rem .75rem;border-radius:20px;font-size:.875rem;margin:0}.project-links{display:flex;gap:1rem}.project-link{display:inline-block;padding:.5rem 1rem;background:#007bff;color:#fff;text-decoration:none;border-radius:4px;transition:background-color .3s ease}.project-link:hover{background:#0056b3}@media (max-width: 768px){.project-image{height:180px}.project-card-content{padding:1rem}.project-card-content h2{font-size:1.1rem}.project-link{padding:.4rem .8rem;font-size:.9rem}}@media (max-width: 480px){.project-image{height:160px}.project-card-content{padding:.75rem}.project-card-content h2{font-size:1rem}.project-link{padding:.3rem .6rem;font-size:.8rem}}.projects-page{max-width:1200px;margin:0 auto;padding:2rem 1rem}.projects-header{text-align:center;margin-bottom:2rem}.projects-header h1{font-size:2.5rem;color:#333;margin-bottom:1rem}.projects-header p{font-size:1.1rem;color:#666}.projects-filters{display:flex;justify-content:center;flex-wrap:wrap;gap:1rem;margin-bottom:2rem}.filter-btn{padding:.5rem 1rem;background:#c8c8c8;border:none;border-radius:20px;cursor:pointer;transition:all .3s ease;font-size:.9rem}.filter-btn:hover{background:#e0e0e0}.filter-btn.active{background:#333;color:#fff}.projects-grid{display:flex;flex-wrap:wrap;width:60%;justify-content:center;gap:2rem;padding:1rem;margin:0 auto}.loading-spinner{display:flex;justify-content:center;align-items:center;min-height:300px}.spinner{width:40px;height:40px;border:4px solid #f3f3f3;border-top:4px solid #007bff;border-radius:50%;animation:spin 1s linear infinite}.error-message{text-align:center;padding:2rem;color:#dc3545}.error-message button{margin-top:1rem;padding:.5rem 1rem;background:#dc3545;color:#fff;border:none;border-radius:4px;cursor:pointer;transition:background-color .3s ease}.error-message button:hover{background:#c82333}.no-projects{text-align:center;padding:2rem;color:#666}@media (max-width: 768px){.projects-page{padding:1.5rem 1rem}.projects-header h1{font-size:2rem}.projects-header p{font-size:1rem}.projects-grid{grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:1.5rem}}@media (max-width: 480px){.projects-page{padding:1rem .5rem}.projects-header h1{font-size:1.75rem}.projects-filters{gap:.5rem}.filter-btn{padding:.4rem .8rem;font-size:.8rem}.projects-grid{grid-template-columns:1fr;gap:1rem}}.project-details-container{width:60%;max-width:1200px;margin:0 auto;padding:1rem 2rem}.project-details-header{margin-bottom:2rem;text-align:center}.project-details-header h1{font-size:clamp(1.8rem,4vw,2.5rem);color:#333;margin-bottom:1rem}.project-meta{display:flex;justify-content:center;gap:1rem;color:#666;font-size:.9rem}.category{font-weight:600;color:#333;margin:0 auto;background:#d4d4d4;padding:.25rem .75rem;border-radius:1rem;width:fit-content}.project-content{display:grid;gap:1rem}.project-image{width:100%;max-width:800px;margin:0 auto;border-radius:8px;overflow:hidden;box-shadow:0 4px 6px #0000001a}.project-image img{width:100%;height:auto;display:block}.project-description{font-size:1.1rem;line-height:1.6;color:#444}.project-description p{margin-bottom:1rem}.project-description h2,.project-description h3{color:#333;margin:2rem 0 1rem}.project-description ul,.project-description ol{margin:1rem 0;padding-left:2rem}.project-description li{margin-bottom:.5rem}.project-technologies{margin-top:1rem}.project-technologies h3{font-size:1.2rem;color:#333;margin-bottom:1rem}.tech-tags{display:flex;flex-wrap:wrap;gap:.5rem}.tech-tag{background:#e9ecef;color:#495057;padding:.25rem .75rem;border-radius:1rem;font-size:.9rem}.project-links{display:flex;gap:1rem;margin-top:2rem}.project-link{display:inline-block;padding:.75rem 1.5rem;border-radius:4px;text-decoration:none;font-weight:600;transition:all .2s}.project-link.github{background:#24292e;color:#fff}.project-link.live{background:#007bff;color:#fff}.project-link:hover{transform:translateY(-2px);box-shadow:0 4px 6px #0000001a}.spinner{width:40px;height:40px;border:4px solid #f3f3f3;border-top:4px solid #3498db;border-radius:50%;animation:spin 1s linear infinite}.error-message,.not-found{text-align:center;padding:2rem;background:#f8d7da;color:#721c24;border-radius:8px;margin:2rem 0}.error-message button,.not-found button{background:#721c24;color:#fff;border:none;padding:.75rem 1.5rem;border-radius:4px;cursor:pointer;margin-top:1rem;transition:background-color .2s}.error-message button:hover,.not-found button:hover{background:#5a151b}@media (max-width: 768px){.project-details-container{padding:1rem;width:90%}.project-image{width:100%;max-width:100%;height:auto}.project-content{gap:1.5rem}.project-links{flex-direction:row;max-width:100%}.project-link{text-align:center}}@media (max-width: 480px){.project-details-container{padding:0rem .5rem;width:90%}.project-details-header h1{font-size:1.5rem;color:#222}.project-image{width:100%;max-width:100%;height:auto}.project-meta{flex-direction:column;align-items:center}.project-description{font-size:1rem}}.navbar{background:var(--white);height:80px;display:flex;justify-content:center;align-items:center;font-size:1.2rem;width:60%;margin:0 auto;z-index:999}.navbar-container{display:flex;justify-content:space-between;align-items:center;height:80px;max-width:1200px;width:100%;padding:0 20px}.navbar-logo{color:#333;justify-self:center;cursor:pointer;text-decoration:none;font-size:1.6rem;font-weight:800;display:flex;margin:0 1rem;z-index:1000}.nav-menu{display:flex;align-items:center;justify-content:flex-end;list-style:none;text-align:center;gap:.6rem}.nav-item{height:60px}.nav-link{color:#333;display:flex;font-size:1rem;align-items:center;text-decoration:none;padding:.5rem 1rem;height:100%;transition:color .3s ease}.nav-link:hover{color:#007bff}.menu-icon{display:none;z-index:1000;cursor:pointer}.menu-icon span{display:block;width:25px;height:3px;background-color:#333;margin:5px 0;transition:all .3s ease}.menu-icon-open:nth-child(1){transform:rotate(40deg);transform-origin:left center}.menu-icon-open:nth-child(2){opacity:0}.menu-icon-open:nth-child(3){transform:rotate(-40deg);transform-origin:left center}@media screen and (max-width: 960px){.navbar{width:100%}.nav-menu{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:0;width:100%;height:100vh;position:absolute;top:0;left:-100%;opacity:0;transition:all .5s ease;background:var(--white);padding:2rem 0}.nav-menu.active{left:0;opacity:1;transition:all .5s ease;z-index:1}.nav-item{width:100%;height:auto;padding:1rem 0}.nav-link{text-align:center;padding:2rem;width:100%;font-size:1.5rem;display:table}.nav-link:hover{background-color:#f8f9fa;color:#007bff;border-radius:0}.menu-icon{display:block;position:absolute;top:0;right:0;transform:translate(-20px,20px)}.navbar-logo{position:absolute;top:0;left:0;transform:translate(20px,20px)}}.footer{background-color:var(--white);color:#333;padding:3rem 0 1rem;margin-top:1rem}.footer-container{width:60%;max-width:1200px;margin:0 auto;padding:0 2rem}.footer-content{display:flex;justify-content:space-between;gap:2rem;margin-bottom:2rem}.footer-section{display:flex;flex-direction:column;gap:1rem;text-align:center}.footer-info{display:flex;flex-direction:column;align-items:center;gap:.5rem}.footer-gif{position:relative;filter:opacity(.8)}.footer-name{font-size:clamp(1.2rem,2vw,1.5rem);font-weight:600;margin:0}.footer-designation{font-size:clamp(.9rem,1.5vw,1rem);color:#333;margin:0}.footer-title{font-size:clamp(1rem,1.8vw,1.2rem);color:#333}.footer-links{display:flex;flex-direction:column;gap:.8rem}.footer-link,.footer-social-link{color:#333;text-decoration:none;font-size:clamp(.9rem,1.5vw,1rem);transition:transform .3s ease}.footer-link:hover,.footer-social-link:hover{transform:translateY(-2px)}.footer-social{display:flex;flex-direction:column;align-items:center;gap:1rem}.footer-social-link{background-color:transparent;color:#000;font-size:clamp(.8rem,2vw,1rem);transition:transform .3s ease;text-decoration:none}.footer-social-link:hover{color:#333;font-weight:500}.footer-bottom{text-align:center;padding-top:2rem;border-top:1px solid rgba(255,255,255,.1)}.footer-copyright{font-size:clamp(.8rem,1.5vw,.9rem);color:#333;margin:0}.loading-spinner{display:flex;justify-content:center;align-items:center;min-height:200px}.spinner{width:30px;height:30px;border:3px solid rgba(255,255,255,.3);border-top:3px solid #fff;border-radius:50%;animation:spin 1s linear infinite}.error-message{text-align:center;padding:2rem;color:#ff6b6b}.error-message p{margin-bottom:1rem;font-size:1rem}.retry-button{background-color:#fff;color:#333;border:none;padding:.5rem 1rem;border-radius:4px;cursor:pointer;transition:background-color .3s ease}.retry-button:hover{background-color:#e6e6e6}.empty-message{color:#333;font-size:.9rem;font-style:italic}@media screen and (max-width: 768px){.footer{padding:2rem 0 1rem}.footer-container{padding:0 1.5rem}.footer-content{gap:1.5rem}}@media screen and (max-width: 480px){.footer{padding:1.5rem 0 1rem}.footer-container{padding:0 1rem;width:100%}.footer-content{flex-direction:column;gap:1.5rem}.footer-info{gap:0}.footer-name{font-size:clamp(2rem,2vw,2rem)}.footer-designation{font-size:clamp(1.2rem,2vw,1.2rem)}.footer-section{text-align:center}.footer-title{font-size:clamp(1.2rem,2vw,1.2rem)}.footer-bottom{padding-top:0}.footer-social{justify-content:center}}.auth-container{display:flex;justify-content:center;align-items:center;min-height:calc(100vh - 200px);padding:2rem}.auth-card{background-color:#fff;padding:2rem;border-radius:8px;box-shadow:0 2px 4px #0000001a;width:100%;max-width:400px}.auth-card h2{text-align:center;margin-bottom:2rem;color:#333}.form-group label{display:block;margin-bottom:.5rem;color:#666}.form-group input{width:100%;padding:.75rem;border:1px solid #ddd;border-radius:4px;font-size:1rem;transition:border-color .2s ease}.form-group input:focus{outline:none;border-color:#007bff}.form-group input.error{border-color:#dc3545}.error-text{color:#dc3545;font-size:.875rem;margin-top:.25rem;display:block}.auth-button{width:100%;padding:.75rem;background-color:#007bff;color:#fff;border:none;border-radius:4px;font-size:1rem;font-weight:500;cursor:pointer;transition:background-color .2s ease}.auth-button:hover{background-color:#0056b3}.auth-links{margin-top:1.5rem;text-align:center}.auth-links a{color:#007bff;text-decoration:none;transition:color .2s ease}.auth-links a:hover{color:#0056b3}.forgot-password{display:block;margin-top:.5rem}.dashboard-container{width:60%;max-width:1200px;margin:0 auto;padding:2rem;min-height:80vh}.dashboard-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:2rem}.dashboard-header h1{font-size:clamp(1.8rem,4vw,2.5rem);color:#333}.logout-button{background-color:#dc3545;color:#fff;border:none;padding:.5rem 1rem;border-radius:4px;cursor:pointer;transition:background-color .3s ease}.logout-button:hover{background-color:#c82333}.dashboard-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:2rem}.dashboard-card{background:#fff;border-radius:12px;padding:2rem;box-shadow:0 4px 6px #0000001a;cursor:pointer;transition:transform .3s ease,box-shadow .3s ease;display:flex;flex-direction:column;align-items:center;text-align:center}.dashboard-card:hover{transform:translateY(-5px);box-shadow:0 6px 12px #00000026}.card-icon{font-size:2.5rem;margin-bottom:1rem}.dashboard-card h2{font-size:1.5rem;color:#333;margin-bottom:.5rem}.dashboard-card p{color:#666;font-size:1rem;line-height:1.5}@media screen and (max-width: 768px){.dashboard-container{padding:1rem}.dashboard-grid{grid-template-columns:1fr}.dashboard-card{padding:1.5rem}}@media screen and (max-width: 480px){.dashboard-header{flex-direction:column;gap:1rem;text-align:center}.dashboard-card h2{font-size:1.3rem}.dashboard-card p{font-size:.9rem}.dashboard-container{width:100%}}.blog-dashboard{width:60%;max-width:1200px;margin:0 auto;padding:2rem 0;background-color:#fff}.blog-dashboard h1{font-size:2rem;color:#333;padding:0 2rem}.blog-form{display:flex;flex-direction:column;gap:1rem;margin-bottom:2rem;background:#f8f9fa;padding:2rem;border-radius:8px}.blog-form input,.blog-form textarea,.blog-form select{padding:.8rem;border:1px solid #ddd;border-radius:4px;font-size:1rem;background-color:#dcdcdc;color:#000}.blog-form textarea{min-height:200px;resize:vertical}.blog-form button{padding:.8rem 1.5rem;background:#007bff;color:#fff;border:none;border-radius:4px;cursor:pointer;font-size:1rem;transition:background .2s ease}.blog-form button:hover{background:#0056b3}.blog-list{margin-top:2rem;padding:0 2rem}.blog-list h2{color:#333;margin-bottom:1.5rem;font-size:1.5rem}.blog-list-items{list-style:none;padding:0;margin:0}.blog-list-item{background:#fff;border-radius:8px;box-shadow:0 2px 4px #0000001a;margin-bottom:1rem;transition:transform .2s ease,box-shadow .2s ease}.blog-list-item:hover{transform:translateY(-2px);box-shadow:0 4px 8px #0000001a}.blog-item-content{padding:1.5rem}.blog-item-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem}.blog-item-header h3{margin:0;color:#333;font-size:1.2rem}.status-badge{padding:.25rem .75rem;border-radius:4px;font-size:.8rem;font-weight:500;text-transform:capitalize}.status-badge.draft{background-color:#fff3cd;color:#856404;border:1px solid #ffeeba}.status-badge.published{background-color:#d4edda;color:#155724;border:1px solid #c3e6cb}.blog-item-meta{margin-bottom:1rem}.tags{display:flex;flex-wrap:wrap;gap:.5rem}.tag{background-color:#f1f3f5;color:#495057;padding:.25rem .75rem;border-radius:4px;font-size:.8rem}.blog-item-actions{display:flex;gap:1rem;margin-top:1rem}.blog-item-actions button{padding:.5rem 1rem;border:none;border-radius:4px;cursor:pointer;font-size:.9rem;transition:background-color .2s ease}.blog-item-actions button:first-child{background-color:#007bff;color:#fff}.blog-item-actions button:first-child:hover{background-color:#0056b3}.blog-item-actions button:last-child{background-color:#dc3545;color:#fff}.blog-item-actions button:last-child:hover{background-color:#c82333}.no-blogs-container{text-align:center;padding:3rem 2rem;background:#fff;border-radius:12px;box-shadow:0 4px 6px #0000001a;margin:2rem 0;border:2px dashed #e9ecef}.no-blogs-icon{font-size:3rem;margin-bottom:1rem}.no-blogs-container h3{color:#333;font-size:1.5rem;margin-bottom:1rem}.no-blogs-container p{color:#666;font-size:1.1rem;margin-bottom:.5rem;line-height:1.6}.no-blogs-tip{color:#007bff;font-size:.9rem;font-style:italic;margin-top:1rem}.error-message{background-color:#f8d7da;color:#721c24;padding:1rem;border-radius:4px;margin-bottom:1rem;text-align:center}.loading-message{text-align:center;padding:2rem;color:#666;font-size:1.1rem;background:#f8f9fa;border-radius:8px;margin:2rem 0}.editor-container{margin-bottom:2rem}.ql-container{min-height:300px;font-size:16px;border:1px solid #ddd;border-top:0;border-bottom-left-radius:4px;border-bottom-right-radius:4px}.ql-toolbar{background:#f8f9fa;border:1px solid #ddd;border-top-left-radius:4px;border-top-right-radius:4px;padding:8px}.ql-toolbar button{margin:0 2px}.ql-editor{min-height:300px;padding:20px;line-height:1.6}.ql-editor p{margin-bottom:1em}.ql-editor.ql-blank:before{font-style:italic;color:#6c757d}.ql-editor blockquote{border-left:4px solid #ccc;margin:1.5em 0;padding-left:1em;color:#666}.ql-editor pre{background:#f4f4f4;border-radius:3px;padding:1em;margin:1em 0}.ql-editor img{max-width:100%;height:auto;margin:1em 0}.ql-toolbar .ql-picker{color:#333}.ql-toolbar .ql-picker-options{background-color:#fff;border:1px solid #ddd;border-radius:4px;box-shadow:0 2px 4px #0000001a}@media (max-width: 768px){.blog-dashboard{width:100%}}@media (max-width: 460px){.blog-dashboard{width:100%}.blog-item-header{flex-direction:column;align-items:flex-start;gap:.5rem}.blog-item-header h3{font-size:.8rem}.blog-item-header .status-badge{font-size:.6rem;text-align:left}.blog-item-meta .tags .tag{font-size:.6rem}.blog-item-actions{justify-content:space-around}.blog-item-actions button{font-size:.8rem}}.about-dashboard{width:60%;max-width:1200px;margin:0 auto;padding:2rem 0}.about-dashboard h1{color:#333;font-size:2rem;margin-bottom:2rem}.dashboard-section{background:#fff;border-radius:8px;padding:2rem;margin-bottom:2rem;box-shadow:0 2px 4px #0000001a}.dashboard-section h2{margin-bottom:1.5rem;color:#333;font-size:1.5rem}.form-group{margin-bottom:1rem}.form-group label{display:block;margin-bottom:.5rem;color:#666;font-weight:500}.form-group input[type=text],.form-group input[type=url],.form-group input[type=date],.form-group select,.form-group textarea{width:100%;padding:.75rem;border:1px solid #ddd;border-radius:4px;font-size:1rem}.form-group textarea{min-height:100px;resize:vertical}.form-group.checkbox{display:flex;align-items:center;gap:.5rem}.form-group.checkbox input[type=checkbox]{width:auto}.form-group.checkbox label{margin-bottom:0}button{background:#007bff;color:#fff;border:none;padding:.75rem 1.5rem;border-radius:4px;cursor:pointer;font-size:1rem;transition:background-color .2s}button:hover{background:#0056b3}.categories-list{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:1rem}.category-tag{background:#e9ecef;padding:.5rem 1rem;border-radius:20px;font-size:.9rem;color:#495057;display:flex;align-items:center;gap:.5rem}.remove-category{background:none;border:none;color:#dc3545;font-size:1.2rem;cursor:pointer;padding:0;line-height:1}.remove-category:hover{color:#c82333}.skills-list{margin-top:1rem;display:flex;flex-wrap:wrap;gap:.5rem}.skill-item{background:#f8f9fa;padding:.5rem 1rem;border-radius:4px;display:flex;align-items:center;gap:.5rem}.skill-category{color:#6c757d;font-size:.8rem}.remove-skill{background:none;border:none;color:#dc3545;font-size:1.2rem;cursor:pointer;padding:0;line-height:1}.remove-skill:hover{color:#c82333}.date-inputs{display:flex;gap:1rem}.date-inputs select{flex:1;color:#666;padding:.75rem;border:1px solid #ddd;border-radius:4px;font-size:1rem;background-color:#fff}.social-media-input{position:relative}.form-group select{color:#333;background-color:#fff;font-size:1rem}.form-group input::placeholder{color:#6c757d;font-size:1rem}.social-media-input input{padding-left:2.5rem}.social-media-input .icon{position:absolute;left:.75rem;top:50%;transform:translateY(-50%);color:#6c757d}.experience-details p{margin:.5rem 0;line-height:1.5}.experience-details p:first-child{color:#495057;font-weight:500}.experience-details p:nth-child(2){color:#6c757d;font-size:.9rem}.experience-details p:last-child{margin-top:1rem;white-space:pre-line}.loading{text-align:center;padding:2rem;font-size:1.2rem;color:#666}.error{background:#ffebee;color:#c62828;padding:1rem;border-radius:4px;margin-bottom:1rem}.empty-state{text-align:center;padding:3rem;background:#f8f9fa;border-radius:8px;margin-bottom:2rem}.empty-state h2{color:#333;margin-bottom:1rem}.empty-state p{color:#666;font-size:1.1rem}.experience-list{margin-top:2rem;display:flex;flex-direction:column;gap:1.5rem}.experience-item{background:#f8f9fa;border-radius:8px;padding:1.5rem;box-shadow:0 2px 4px #0000000d}.experience-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem}.experience-header h3{margin:0;color:#333;font-size:1.2rem}.remove-experience{background:none;border:none;color:#dc3545;font-size:1.5rem;cursor:pointer;padding:0;line-height:1}.remove-experience:hover{color:#c82333}.social-links-container{display:flex;flex-direction:column;gap:1.5rem}.social-form{display:grid;grid-template-columns:1fr 1fr auto;gap:1rem;align-items:end}.social-links-list{display:flex;flex-direction:column;gap:.8rem}.social-link-item{display:flex;justify-content:space-between;align-items:center;padding:.8rem 1rem;background:#f8f9fa;border-radius:4px;border:1px solid #e9ecef}.social-link-info{display:flex;flex-direction:column;gap:.3rem}.social-platform{font-weight:500;color:#333}.social-url{font-size:.9rem;color:#666;word-break:break-all}.remove-social-btn{background:none;border:none;color:#dc3545;font-size:1.2rem;cursor:pointer;padding:.2rem .5rem;border-radius:4px;transition:background-color .2s}.remove-social-btn:hover{background-color:#f8d7da}.add-social-btn,.update-socials-btn{padding:.5rem 1rem;border:none;border-radius:4px;cursor:pointer;font-weight:500;transition:all .2s}.add-social-btn{background-color:#28a745;color:#fff}.add-social-btn:hover{background-color:#218838}.update-socials-btn{background-color:#007bff;color:#fff;align-self:flex-end;padding:.8rem 1.5rem}.update-socials-btn:hover{background-color:#0056b3}@media (max-width: 768px){.about-dashboard{padding:1rem}.dashboard-section{padding:1.5rem}.form-group input[type=text],.form-group input[type=url],.form-group input[type=date],.form-group select,.form-group textarea{font-size:16px;background-color:transparent;color:#333}.category-tag,.skill-item{font-size:.8rem;padding:.4rem .8rem}.experience-item{padding:1rem}.experience-header h3{font-size:1.1rem}.date-inputs{flex-direction:column;gap:.5rem}.date-inputs select{width:100%}.social-form{grid-template-columns:1fr}.social-link-item{flex-direction:column;align-items:flex-start;gap:.5rem}.remove-social-btn{align-self:flex-end}}@media (max-width: 460px){.about-dashboard,.update-socials-btn{width:100%}}.contact-dashboard{max-width:1200px;margin:0 auto;padding:2rem;min-height:80vh}.dashboard-header{text-align:center;margin-bottom:3rem}.dashboard-header h1{font-size:2.5rem;color:#333;margin-bottom:.5rem}.dashboard-header p{color:#666;font-size:1.1rem}.contact-list{display:flex;flex-direction:column;gap:1.5rem}.contact-card{background:#fff;border-radius:8px;box-shadow:0 1px 3px #0000001a;overflow:hidden;transition:transform .2s ease,box-shadow .2s ease;max-width:800px;margin:0 auto}.contact-card:hover{transform:translateY(-2px);box-shadow:0 4px 8px #00000026}.contact-card-header{background:#f8f9fa;padding:.75rem 1rem;border-bottom:1px solid #e9ecef;display:flex;justify-content:space-between;align-items:center}.contact-card-header h3{color:#333;margin:0;font-size:1rem;font-weight:600}.contact-date{color:#666;font-size:.8rem}.contact-card-content{padding:1rem}.sender-info{margin-bottom:.75rem;padding-bottom:.75rem;border-bottom:1px solid #e9ecef;display:flex;gap:1.5rem}.info-item{display:flex;gap:.5rem;font-size:.9rem}.info-item .label{color:#666;min-width:auto}.info-item .value{color:#333;font-weight:500}.message-content{color:#333;line-height:1.4;font-size:.9rem;max-height:100px;overflow-y:auto}.contact-card-actions{padding:.75rem 1rem;background:#f8f9fa;border-top:1px solid #e9ecef;display:flex;justify-content:flex-end}.reply-button{padding:.4rem .8rem;font-size:.8rem;background:#007bff;color:#fff;text-decoration:none;border-radius:4px;transition:background-color .2s ease}.reply-button:hover{background:#0056b3}.loading-spinner{text-align:center;padding:3rem}.spinner{border:4px solid #f3f3f3;border-top:4px solid #007bff;border-radius:50%;width:40px;height:40px;animation:spin 1s linear infinite;margin:0 auto 1rem}.error-container{text-align:center;padding:2rem}.retry-button{margin-top:1rem;padding:.5rem 1rem;background:#007bff;color:#fff;border:none;border-radius:4px;cursor:pointer}.no-contacts-container{display:flex;justify-content:center;align-items:center;min-height:400px}.no-contacts-content{text-align:center;padding:3rem;background:#fff;border-radius:12px;box-shadow:0 2px 4px #0000001a;border:2px dashed #e9ecef}.no-contacts-icon{font-size:3rem;margin-bottom:1rem}.no-contacts-content h2{color:#333;margin-bottom:1rem}.no-contacts-content p{color:#666}@media (max-width: 768px){.contact-dashboard{padding:1rem}.dashboard-header h1{font-size:2rem}.contact-card{margin:0 .5rem}.sender-info{flex-direction:column;gap:.5rem}.contact-card-header,.contact-card-content{padding:.75rem}}.projects-dashboard{width:60%;max-width:1200px;margin:0 auto;padding:2rem}.projects-dashboard h1{font-size:2rem;color:#333;margin-bottom:2rem;text-align:center}.project-form{background:#fff;padding:2rem;border-radius:8px;box-shadow:0 2px 4px #0000001a;margin-bottom:2rem}.form-group{margin-bottom:1.5rem}.form-group label{display:block;margin-bottom:.5rem;font-weight:600;color:#333}.form-group input[type=text],.form-group input[type=url]{width:100%;padding:.75rem;border-radius:4px;font-size:1rem}.form-group input{background-color:transparent;border:1px solid #333;color:#333}.tox-tinymce{border-radius:4px!important;border:1px solid #ddd!important}.tox .tox-toolbar__primary{background:#f8f9fa!important;border-bottom:1px solid #ddd!important}.tox .tox-tbtn{color:#333!important}.tox .tox-tbtn:hover{background:#e9ecef!important}.image-upload-container{margin-top:.5rem}.image-upload-input{margin-bottom:1rem}.image-preview{margin-top:1rem;position:relative;max-width:300px}.image-preview img{width:100%;height:auto;border-radius:4px}.remove-image{position:absolute;top:.5rem;right:.5rem;background:#f00c;color:#fff;border:none;border-radius:50%;width:24px;height:24px;cursor:pointer;display:flex;align-items:center;justify-content:center}.uploading-spinner{border:3px solid #f3f3f3;border-top:3px solid #3498db;border-radius:50%;width:20px;height:20px;animation:spin 1s linear infinite;margin:1rem 0}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.projects-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:2rem;margin-top:2rem}.project-item{background:#fff;padding:1.5rem;border-radius:8px;box-shadow:0 2px 4px #0000001a}.project-info h3{margin:0 0 1rem;color:#333}.project-info p{margin:0 0 1rem;color:#666;line-height:1.5}.project-meta{display:flex;flex-direction:column;gap:.5rem;margin-top:1rem;color:#666;font-size:.9rem}.project-actions{display:flex;gap:1rem;margin-top:1rem}.edit-btn,.delete-btn{padding:.5rem 1rem;border:none;border-radius:4px;cursor:pointer;font-weight:600;transition:background-color .2s}.edit-btn{background-color:#3498db;color:#fff}.delete-btn{background-color:#e74c3c;color:#fff}.edit-btn:hover{background-color:#2980b9}.delete-btn:hover{background-color:#c0392b}.loading-spinner{display:flex;justify-content:center;align-items:center;height:200px}.error-message{background-color:#f8d7da;color:#721c24;padding:1rem;border-radius:4px;margin-bottom:1rem}@media (max-width: 768px){.projects-dashboard,.project-form{padding:1rem}.projects-list{grid-template-columns:1fr}}@media (max-width: 480px){.projects-dashboard{padding:1rem .5rem}.project-form{padding:1rem}.form-group input,.form-group textarea{padding:.5rem}.project-meta{flex-direction:column;gap:.5rem}}
