.library-wrapper{--primary-color: #2563eb;--secondary-color: #3b82f6;--accent-color: #06b6d4;--success-color: #10b981;--warning-color: #f59e0b;--error-color: #ef4444;--dark-color: #0f172a;--darker-color: #1e293b;--card-bg: #1e293b;--section-bg: #0f172a;--alt-section-bg: #1e293b;--text-color: #f1f5f9;--text-muted: #94a3b8;--text-light: #64748b;--white: #ffffff;--transition: all .3s cubic-bezier(.4, 0, .2, 1);font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif;background:var(--dark-color);color:var(--text-color);line-height:1.6;min-height:100vh}.library-wrapper *{margin:0;padding:0;box-sizing:border-box}.library-wrapper .navbar{background:#0f172af2;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px solid rgba(59,130,246,.2);position:sticky;top:0;z-index:1000;width:100%}.library-wrapper .nav-container{position:static;width:100%;background:transparent;box-shadow:none;padding:1rem 2rem;max-width:1400px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;border:none}.library-wrapper .nav-brand{display:flex;align-items:center;gap:.5rem;font-size:1.5rem;font-weight:700;color:var(--accent-color);text-decoration:none}.library-wrapper .nav-brand i{font-size:1.8rem}.library-wrapper .nav-menu{display:flex;gap:2rem;align-items:center}.library-wrapper .nav-link{color:var(--text-muted);text-decoration:none;font-weight:500;padding:.5rem 1rem;border-radius:.5rem;transition:var(--transition);background:transparent;border:none;cursor:pointer;font-family:inherit;font-size:1rem}.library-wrapper .nav-link:hover,.library-wrapper .nav-link.active{color:var(--primary-color);background:#2563eb1a;transform:none}.library-wrapper .nav-link:after,.library-wrapper .nav-link:before{display:none}.library-wrapper .nav-user{display:flex;align-items:center;gap:.5rem;color:var(--text-color);font-weight:500}.library-wrapper .nav-user i{font-size:1.5rem;color:var(--accent-color)}.library-wrapper .main-content{max-width:1400px;margin:0 auto;padding:2rem}.library-wrapper .content-section{display:block}.library-wrapper .section-header{margin-bottom:2rem}.library-wrapper .section-header h1{font-size:2.5rem;font-weight:700;color:var(--text-color);margin-bottom:.5rem}.library-wrapper .section-header p{color:var(--text-muted);font-size:1.1rem}.library-wrapper .header-actions{display:flex;gap:1rem;margin-left:auto}.library-wrapper .btn{padding:.75rem 1.5rem;border:none;border-radius:.5rem;font-weight:600;cursor:pointer;transition:var(--transition);display:inline-flex;align-items:center;gap:.5rem;text-decoration:none}.library-wrapper .btn-primary{background:var(--primary-color);color:#fff}.library-wrapper .btn-primary:hover{background:#1d4ed8;transform:translateY(-2px);box-shadow:0 10px 25px #2563eb4d}.library-wrapper .btn-secondary{background:var(--darker-color);color:var(--text-color);border:1px solid rgba(59,130,246,.3)}.library-wrapper .btn-secondary:hover{background:var(--card-bg);border-color:var(--primary-color)}.library-wrapper .stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:1.5rem;margin-bottom:3rem}.library-wrapper .stat-card{background:var(--card-bg);padding:2rem;border-radius:1rem;border:1px solid rgba(59,130,246,.2);display:flex;align-items:center;gap:1.5rem;transition:var(--transition)}.library-wrapper .stat-card:hover{transform:translateY(-5px);box-shadow:0 20px 40px #0000004d;border-color:var(--primary-color)}.library-wrapper .stat-icon{width:60px;height:60px;border-radius:1rem;background:linear-gradient(135deg,var(--primary-color),var(--accent-color));display:flex;align-items:center;justify-content:center;font-size:1.5rem;color:#fff}.library-wrapper .stat-info h3{font-size:2rem;font-weight:700;color:var(--text-color);margin-bottom:.25rem}.library-wrapper .stat-info p{color:var(--text-muted);font-size:.9rem}.library-wrapper .dashboard-card{background:var(--card-bg);padding:2rem;border-radius:1rem;border:1px solid rgba(59,130,246,.2);margin-bottom:2rem}.library-wrapper .dashboard-card h3{font-size:1.5rem;font-weight:600;color:var(--text-color);margin-bottom:1.5rem}.library-wrapper .quick-actions{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1rem}.library-wrapper .action-btn{background:var(--darker-color);color:var(--text-color);border:1px solid rgba(59,130,246,.3);padding:1rem;border-radius:.75rem;cursor:pointer;transition:var(--transition);display:flex;align-items:center;gap:.75rem;font-weight:500}.library-wrapper .action-btn:hover{background:var(--primary-color);color:#fff;transform:translateY(-2px);box-shadow:0 10px 25px #2563eb4d}.library-wrapper .action-btn i{font-size:1.2rem}.library-wrapper .search-filters{display:flex;gap:1rem;margin-bottom:2rem;flex-wrap:wrap}.library-wrapper .search-box{position:relative;flex:1;min-width:300px}.library-wrapper .search-box i{position:absolute;left:1rem;top:50%;transform:translateY(-50%);color:var(--text-muted)}.library-wrapper .search-box input{width:100%;padding:.75rem 1rem .75rem 3rem;background:var(--card-bg);border:1px solid rgba(59,130,246,.3);border-radius:.5rem;color:var(--text-color);font-size:1rem}.library-wrapper .search-box input:focus{outline:none;border-color:var(--primary-color);box-shadow:0 0 0 3px #2563eb1a}.library-wrapper .filter-select{padding:.75rem 1rem;background:var(--card-bg);border:1px solid rgba(59,130,246,.3);border-radius:.5rem;color:var(--text-color);font-size:1rem;cursor:pointer}.library-wrapper .filter-select:focus{outline:none;border-color:var(--primary-color)}.library-wrapper .books-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:1.5rem}.library-wrapper .book-card{background:var(--card-bg);border:1px solid rgba(59,130,246,.2);border-radius:1rem;padding:1.5rem;transition:var(--transition)}.library-wrapper .book-card:hover{transform:translateY(-5px);box-shadow:0 20px 40px #0000004d;border-color:var(--primary-color)}.library-wrapper .book-card h3{color:var(--text-color);margin-bottom:.5rem;font-size:1.2rem}.library-wrapper .book-card p{color:var(--text-muted);margin-bottom:.5rem}.library-wrapper .book-status{display:inline-block;padding:.25rem .75rem;border-radius:1rem;font-size:.8rem;font-weight:600;margin-top:1rem}.library-wrapper .status-available{background:#10b98133;color:var(--success-color)}.library-wrapper .status-borrowed{background:#f59e0b33;color:var(--warning-color)}.library-wrapper .table-container{background:var(--card-bg);border-radius:1rem;border:1px solid rgba(59,130,246,.2);overflow:hidden;margin-bottom:2rem}.library-wrapper .members-table,.library-wrapper .transactions-table{width:100%;border-collapse:collapse}.library-wrapper .members-table th,.library-wrapper .transactions-table th{background:var(--darker-color);color:var(--text-color);padding:1rem;text-align:left;font-weight:600;border-bottom:1px solid rgba(59,130,246,.2)}.library-wrapper .members-table td,.library-wrapper .transactions-table td{padding:1rem;border-bottom:1px solid rgba(59,130,246,.1);color:var(--text-muted)}.library-wrapper .members-table tr:hover,.library-wrapper .transactions-table tr:hover{background:#3b82f60d}.library-wrapper .status-badge{display:inline-block;padding:.25rem .75rem;border-radius:1rem;font-size:.8rem;font-weight:600}.library-wrapper .status-active{background:#10b98133;color:var(--success-color)}.library-wrapper .status-inactive{background:#64748b33;color:var(--text-light)}.library-wrapper .status-overdue{background:#ef444433;color:var(--error-color)}.library-wrapper .table-actions{display:flex;gap:.5rem}.library-wrapper .action-icon{padding:.5rem;border:none;background:transparent;color:var(--text-muted);cursor:pointer;border-radius:.25rem;transition:var(--transition)}.library-wrapper .action-icon:hover{background:var(--primary-color);color:#fff}@media(max-width:768px){.library-wrapper .nav-container{padding:1rem;flex-direction:column;gap:1rem}.library-wrapper .nav-menu{gap:1rem}.library-wrapper .main-content{padding:1rem}.library-wrapper .stats-grid{grid-template-columns:1fr}.library-wrapper .search-filters{flex-direction:column}.library-wrapper .search-box{min-width:auto}.library-wrapper .quick-actions,.library-wrapper .books-grid{grid-template-columns:1fr}.library-wrapper .table-container{overflow-x:auto}}@media(max-width:480px){.library-wrapper .section-header h1{font-size:2rem}.library-wrapper .stat-card{padding:1.5rem}.library-wrapper .stat-icon{width:50px;height:50px;font-size:1.2rem}.library-wrapper .stat-info h3{font-size:1.5rem}}:root{--primary-color: #2563eb;--secondary-color: #3b82f6;--accent-color: #06b6d4;--success-color: #10b981;--warning-color: #f59e0b;--error-color: #ef4444;--dark-color: #0f172a;--darker-color: #1e293b;--card-bg: #1e293b;--glass-bg: rgba(30, 41, 59, .8);--section-bg: #0f172a;--alt-section-bg: #1e293b;--text-color: #f1f5f9;--text-muted: #94a3b8;--text-light: #64748b;--white: #ffffff;--nav-text: #e2e8f0;--gradient-primary: linear-gradient(135deg, #2563eb 0%, #3b82f6 100%);--gradient-secondary: linear-gradient(135deg, #06b6d4 0%, #10b981 100%);--gradient-success: linear-gradient(135deg, #065f46 0%, #047857 100%);--gradient-hero: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);--gradient-cards: linear-gradient(135deg, #1e293b 0%, #334155 100%);--transition: all .3s cubic-bezier(.4, 0, .2, 1);--transition-smooth: all .4s cubic-bezier(.4, 0, .2, 1);--transition-bounce: all .5s cubic-bezier(.68, -.55, .265, 1.55);--shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, .05);--shadow-md: 0 4px 6px -1px rgba(0, 0, 0, .1), 0 2px 4px -1px rgba(0, 0, 0, .06);--shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, .1), 0 4px 6px -2px rgba(0, 0, 0, .05);--shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, .1), 0 10px 10px -5px rgba(0, 0, 0, .04);--shadow-glow: 0 0 20px rgba(59, 130, 246, .15);--shadow-card: 0 4px 6px -1px rgba(0, 0, 0, .1);--hero-bg: linear-gradient(135deg, #0f172a 0%, #1e293b 50%, #334155 100%)}body.logo-theme{--primary-color: #22d3ee;--secondary-color: #60a5fa;--accent-color: #a78bfa;--success-color: #10b981;--warning-color: #f59e0b;--error-color: #ef4444;--dark-color: #0b1220;--darker-color: #0f1629;--card-bg: #0f1b2d;--glass-bg: rgba(15, 23, 42, .7);--section-bg: #0b1220;--alt-section-bg: #0f182a;--text-color: #e6efff;--text-muted: #9fb3c8;--text-light: #7b8aa0;--nav-text: #e6efff;--gradient-primary: linear-gradient(135deg, #22d3ee 0%, #60a5fa 50%, #a78bfa 100%);--gradient-secondary: linear-gradient(135deg, #0ea5e9 0%, #22d3ee 100%);--gradient-success: linear-gradient(135deg, #065f46 0%, #047857 100%);--gradient-hero: linear-gradient(135deg, #0b1220 0%, #0f182a 50%, #132035 100%);--gradient-cards: linear-gradient(135deg, #0f1b2d 0%, #132035 100%)}body.logo-theme .nav-container{background:#0a1020eb;border-color:#22d3ee2e}body.logo-theme .nav-container.scrolled{background:#0a1020f7;border-bottom-color:#22d3ee38}body.logo-theme .nav-indicator{background:#22d3ee1f;border:1px solid rgba(34,211,238,.28);box-shadow:0 8px 24px #22d3ee2e}body.logo-theme .nav-link:hover{background:#22d3ee1f}.nav-indicator{position:absolute;top:50%;left:0;height:36px;width:60px;transform:translateY(-50%) translate(0);border-radius:999px;background:#3b82f61f;border:1px solid rgba(59,130,246,.25);box-shadow:0 8px 24px #3b82f626;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);pointer-events:none;transition:transform .24s cubic-bezier(.22,1,.36,1),width .24s cubic-bezier(.22,1,.36,1),opacity .2s ease;opacity:0}.nav-link:after{content:"";position:absolute;left:10%;bottom:-3px;width:80%;height:2px;background:var(--primary-color);transform:scaleX(0);transform-origin:left center;transition:transform .18s ease}.nav-link:hover:after,.nav-link.active:after{transform:scaleX(1)}@media(prefers-reduced-motion:reduce){.nav-indicator,.nav-link{transition:none}.nav-link:after{transition:none}}html{overflow-x:hidden;width:100%}*{margin:0;padding:0;box-sizing:border-box;scroll-behavior:smooth}body{font-family:Poppins,Arial,sans-serif;line-height:1.6;color:var(--text-color);background-color:var(--dark-color);overflow-x:hidden;text-align:center;width:100%;min-height:100vh}.skip-link{position:absolute;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden}.skip-link:focus{position:fixed;left:16px;top:16px;width:auto;height:auto;padding:10px 14px;background:var(--primary-color);color:#fff;border-radius:6px;z-index:2000}.page-transition{position:fixed;inset:0;background:#0f172a;z-index:20000;pointer-events:none;display:none}.page-transition.pt-fade{opacity:0;transition:opacity .16s ease}.page-transition.pt-fade.is-active{opacity:1;pointer-events:auto;display:block}.page-transition.pt-wipe-right{transform:translate(-100%);transition:transform .2s ease}.page-transition.pt-wipe-right.is-active{transform:translate(0);pointer-events:auto;display:block}.page-transition.pt-wipe-left{transform:translate(100%);transition:transform .2s ease}.page-transition.pt-wipe-left.is-active{transform:translate(0);pointer-events:auto;display:block}.page-transition.pt-slide-up{transform:translateY(100%);transition:transform .2s ease}.page-transition.pt-slide-up.is-active{transform:translateY(0);pointer-events:auto;display:block}.page-transition.pt-slide-down{transform:translateY(-100%);transition:transform .2s ease}.page-transition.pt-slide-down.is-active{transform:translateY(0);pointer-events:auto;display:block}.section-title{font-size:2.5rem;margin-bottom:50px;color:var(--text-color);text-align:center;font-weight:600}h1,h2,h3,h4,h5,h6,p{text-align:center}.preloader{position:fixed;top:0;left:0;width:100%;height:100%;background:var(--white);display:flex;justify-content:center;align-items:center;z-index:9999;transition:opacity .5s ease-out}.lottie-container{width:200px;height:200px}.nav-container{position:fixed;top:0;width:100%;z-index:1000;background:#0f172af2;backdrop-filter:blur(20px) saturate(180%);-webkit-backdrop-filter:blur(20px) saturate(180%);border:1px solid rgba(59,130,246,.2);border-top:none;padding:15px 0;transition:all .5s cubic-bezier(.4,0,.2,1);box-shadow:0 5px 15px #0000001a,0 15px 35px #0000000d}.nav-container.scrolled{padding:10px 0;background:#0f172afa;backdrop-filter:blur(25px) saturate(200%);-webkit-backdrop-filter:blur(25px) saturate(200%);box-shadow:var(--shadow-md);border-bottom:1px solid rgba(59,130,246,.2)}.nav-content{display:flex;justify-content:space-between;align-items:center;margin:0 auto;padding:0 20px;width:100%;max-width:1200px;box-sizing:border-box}.nav-container .logo{font-size:1.5rem;font-weight:700;text-decoration:none;color:#e2e8f0;display:flex;align-items:center}#logo-video{width:88px;height:48px;border-radius:12px;object-fit:cover;display:block;background:#ffffff08;border:1px solid rgba(255,255,255,.15);filter:saturate(1.15) contrast(1.05) drop-shadow(0 4px 12px rgba(0,0,0,.35));pointer-events:none;transition:transform .18s ease,filter .18s ease,width .2s ease,height .2s ease}.nav-container.scrolled #logo-video{width:72px;height:40px;border-radius:10px}.logo:hover #logo-video{transform:translateY(-1px) scale(1.03);filter:saturate(1.25) contrast(1.1) drop-shadow(0 6px 16px rgba(59,130,246,.25))}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,1px,1px);white-space:nowrap;border:0}.nav-container .logo.musical-orchestra-logo{color:inherit!important;perspective:1000px;position:relative}.nav-container .logo.musical-orchestra-logo .navbar-logo-text{display:flex!important;flex-direction:row!important;align-items:center!important;gap:.2em!important;transform-style:preserve-3d}.nav-container .logo.musical-orchestra-logo span{display:inline-block!important;opacity:1!important;color:inherit!important}.nav-container .logo.musical-orchestra-logo .navbar-letter{animation:letter3DRotate 4s ease-in-out infinite,rainbowGradient 8s linear infinite,letterPulse 2s ease-in-out infinite!important;transform-origin:center;transition:all .3s cubic-bezier(.68,-.55,.265,1.55);position:relative;background:linear-gradient(45deg,currentColor,currentColor);-webkit-background-clip:text;background-clip:text;filter:drop-shadow(0 0 8px currentColor)}.nav-container .logo.musical-orchestra-logo .navbar-space{display:inline-block;width:.3em}.nav-container .logo.musical-orchestra-logo .navbar-letter:nth-child(1){animation-delay:0s,0s,0s!important}.nav-container .logo.musical-orchestra-logo .navbar-letter:nth-child(2){animation-delay:.1s,1s,.2s!important}.nav-container .logo.musical-orchestra-logo .navbar-letter:nth-child(3){animation-delay:.2s,2s,.4s!important}.nav-container .logo.musical-orchestra-logo .navbar-letter:nth-child(4){animation-delay:.3s,3s,.6s!important}.nav-container .logo.musical-orchestra-logo .navbar-letter:nth-child(5){animation-delay:.4s,4s,.8s!important}.nav-container .logo.musical-orchestra-logo .navbar-letter:nth-child(6){animation-delay:.5s,5s,1s!important}.nav-container .logo.musical-orchestra-logo .navbar-letter:nth-child(7){animation-delay:.6s,6s,1.2s!important}.nav-container .logo.musical-orchestra-logo .navbar-letter:nth-child(8){animation-delay:.7s,7s,1.4s!important}.nav-container .logo.musical-orchestra-logo .navbar-letter:nth-child(9){animation-delay:.8s,0s,1.6s!important}.nav-container .logo.musical-orchestra-logo .navbar-letter:nth-child(10){animation-delay:.9s,1s,1.8s!important}.nav-container .logo.musical-orchestra-logo .navbar-letter:nth-child(11){animation-delay:1s,2s,2s!important}.nav-container .logo.musical-orchestra-logo .navbar-letter:nth-child(12){animation-delay:1.1s,3s,2.2s!important}.nav-container .logo.musical-orchestra-logo:hover .navbar-letter{animation:magneticBounce .8s cubic-bezier(.68,-.55,.265,1.55) infinite!important;transform:scale(1.2) rotateY(360deg);filter:drop-shadow(0 0 20px currentColor) drop-shadow(0 0 40px currentColor)}@keyframes letter3DRotate{0%,to{transform:perspective(500px) rotateY(0) rotateX(0) translateZ(0)}25%{transform:perspective(500px) rotateY(10deg) rotateX(5deg) translateZ(20px)}50%{transform:perspective(500px) rotateY(0) rotateX(-5deg) translateZ(0)}75%{transform:perspective(500px) rotateY(-10deg) rotateX(5deg) translateZ(20px)}}@keyframes rainbowGradient{0%{filter:hue-rotate(0deg) brightness(1.2) saturate(1.5) drop-shadow(0 0 10px currentColor)}25%{filter:hue-rotate(90deg) brightness(1.3) saturate(1.8) drop-shadow(0 0 15px currentColor)}50%{filter:hue-rotate(180deg) brightness(1.4) saturate(2) drop-shadow(0 0 20px currentColor)}75%{filter:hue-rotate(270deg) brightness(1.3) saturate(1.8) drop-shadow(0 0 15px currentColor)}to{filter:hue-rotate(360deg) brightness(1.2) saturate(1.5) drop-shadow(0 0 10px currentColor)}}@keyframes letterPulse{0%,to{transform:scale(1);opacity:1}50%{transform:scale(1.1);opacity:.9}}@keyframes magneticBounce{0%,to{transform:translateY(0) scale(1.2) rotate(0)}25%{transform:translateY(-15px) scale(1.3) rotate(-10deg)}50%{transform:translateY(-8px) scale(1.25) rotate(5deg)}75%{transform:translateY(-12px) scale(1.28) rotate(-5deg)}}.animated-logo .letter:first-child,.animated-logo .letter:nth-child(9){font-weight:800;color:var(--accent-color)}@media(max-width:768px){.animated-logo{font-size:1.2rem!important;letter-spacing:.5px!important;margin-left:20px!important}}@media(max-width:480px){.animated-logo{font-size:1rem!important;letter-spacing:.2px!important;margin-left:15px!important}}.nav-links{display:flex;gap:30px;margin-left:auto;position:relative}.nav-link{color:var(--nav-text);text-decoration:none;font-weight:500;position:relative;padding:.5rem 1rem;transition:all .3s ease}.nav-link:before,.nav-link:after{content:"";position:absolute;bottom:0;left:50%;width:0;height:2px;background:var(--primary-color);transition:all .3s ease;transform:translate(-50%)}.nav-link:after{bottom:-2px;background:var(--accent-color)}.nav-link:hover{color:var(--primary-color);transform:translateY(-2px)}.nav-link:hover:before,.nav-link:hover:after{width:80%}.nav-link:before{box-shadow:0 0 10px var(--primary-color)}.nav-link{letter-spacing:0;transition:letter-spacing .3s ease,color .3s ease;will-change:transform}.nav-link:hover{letter-spacing:1px}.nav-link{padding:5px 10px;border-radius:4px;background:transparent;transition:all .3s ease}.nav-link:hover{background:#2563eb26}.nav-link{position:relative;overflow:hidden}.nav-link:after{content:"";position:absolute;top:50%;left:50%;width:5px;height:5px;background:#f05a284d;opacity:0;border-radius:100%;transform:scale(1) translate(-50%);transform-origin:50% 50%}.nav-link:focus:not(:active):after{animation:ripple 1s ease-out}@keyframes ripple{0%{transform:scale(0);opacity:.5}to{transform:scale(20);opacity:0}}.hamburger{display:none;background:none;border:none;color:var(--white);font-size:1.5rem;cursor:pointer;transition:all .3s ease;padding:5px;margin-left:20px}.hamburger:hover{color:var(--primary-color);transform:rotate(90deg)}.hero{height:100vh;display:flex;align-items:center;justify-content:center;text-align:center;background:var(--hero-bg) center/cover;position:relative;overflow:hidden}.hero-content{padding:0 20px;opacity:1;transform:translateY(0);transition:var(--transition);box-sizing:border-box;width:100%;max-width:800px;margin:0 auto}.hero h1{font-size:3.5rem;margin-bottom:20px;color:var(--text-color)}.typing-text{font-size:2rem;color:var(--primary-color);margin-bottom:30px;width:100%;text-align:center;height:2.4rem;display:flex;align-items:center;justify-content:center;white-space:nowrap;overflow:hidden}.typing-text .typed-cursor,.typed-cursor,#typed .typed-cursor,.typed-cursor-blink{display:none!important;opacity:0!important;visibility:hidden!important}@keyframes blink{0%,to{opacity:0}50%{opacity:0}}.typed-cursor{animation:none!important}.hero-buttons{display:flex;gap:20px;justify-content:center;align-items:center;flex-wrap:wrap}.btn{display:inline-flex;align-items:center;justify-content:center;margin:0 auto;padding:12px 30px;border-radius:30px;text-decoration:none;font-weight:600;transition:var(--transition-bounce);will-change:transform,background-color}.primary-btn{background:var(--primary-color);color:var(--white)}.primary-btn:hover{background:#2563eb;transform:translateY(-3px)}.secondary-btn{background:transparent;color:var(--primary-color);border:2px solid var(--primary-color)}.secondary-btn:hover{background:var(--primary-color);color:var(--white);transform:translateY(-3px)}.about{padding:100px 20px;background-color:var(--section-bg);width:100%;box-sizing:border-box}.about-content{display:grid;grid-template-columns:1fr 2fr;gap:60px;align-items:center;max-width:1200px;margin:0 auto;padding:0 20px}.profile-image-container{display:flex;justify-content:center;align-items:center;position:relative}.profile-image-wrapper{position:relative;width:300px;height:300px;display:flex;justify-content:center;align-items:center}.profile-image{width:250px;height:250px;border-radius:50%;object-fit:cover;border:4px solid rgba(59,130,246,.3);box-shadow:0 20px 40px #0f172a4d,0 0 60px #3b82f633,inset 0 0 20px #ffffff1a;transition:all .6s cubic-bezier(.4,0,.2,1);position:relative;z-index:3}.profile-image:hover{transform:scale(1.05) rotate(2deg);border-color:#3b82f699;box-shadow:0 30px 60px #0f172a66,0 0 80px #3b82f666,inset 0 0 30px #ffffff26}.profile-glow{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:350px;height:350px;background:radial-gradient(circle,rgba(59,130,246,.1) 0%,rgba(6,182,212,.05) 30%,transparent 70%);border-radius:50%;animation:profileGlow 4s ease-in-out infinite;z-index:1}@keyframes profileGlow{0%,to{opacity:.6;transform:translate(-50%,-50%) scale(1)}50%{opacity:1;transform:translate(-50%,-50%) scale(1.1)}}.profile-particles{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:2}.profile-particles:before,.profile-particles:after{content:"";position:absolute;width:8px;height:8px;background:var(--primary-color);border-radius:50%;opacity:.7;animation:floatParticle 6s ease-in-out infinite}.profile-particles:before{top:20%;left:10%;animation-delay:0s}.profile-particles:after{top:70%;right:15%;animation-delay:3s;background:var(--accent-color)}@keyframes floatParticle{0%,to{transform:translateY(0) scale(1);opacity:.7}50%{transform:translateY(-20px) scale(1.2);opacity:1}}.profile-image-wrapper:before{content:"";position:absolute;top:15%;right:20%;width:12px;height:12px;background:var(--accent-color);border-radius:50%;opacity:.8;animation:floatParticle 8s ease-in-out infinite;animation-delay:1.5s;z-index:2}.profile-image-wrapper:after{content:"";position:absolute;bottom:25%;left:25%;width:6px;height:6px;background:var(--secondary-color);border-radius:50%;opacity:.6;animation:floatParticle 7s ease-in-out infinite;animation-delay:2.5s;z-index:2}.about-text{max-width:none;width:100%;margin:0;padding:0;box-sizing:border-box;text-align:left;display:flex;flex-direction:column;justify-content:center}.about-text p{text-align:left;margin-bottom:1.5rem;line-height:1.8;color:var(--text-color);font-size:1.1rem;padding:0}.about-text p:first-child{font-size:1.2rem;font-weight:500;text-align:left}.skills{padding:120px 20px;background:var(--alt-section-bg);position:relative;overflow:hidden;text-align:center;width:100%;box-sizing:border-box;min-height:100vh;display:flex;flex-direction:column;justify-content:center}.skills:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 15% 25%,rgba(59,130,246,.15) 0%,transparent 40%),radial-gradient(circle at 85% 75%,rgba(139,92,246,.15) 0%,transparent 40%),radial-gradient(circle at 45% 15%,rgba(245,158,11,.1) 0%,transparent 35%),radial-gradient(circle at 75% 35%,rgba(59,130,246,.08) 0%,transparent 30%),radial-gradient(circle at 25% 85%,rgba(139,92,246,.08) 0%,transparent 30%);animation:neuralPulse 12s ease-in-out infinite;pointer-events:none;z-index:0}.skills:after{content:"";position:absolute;inset:0;background-image:linear-gradient(45deg,transparent 45%,rgba(59,130,246,.1) 50%,transparent 55%),linear-gradient(-45deg,transparent 45%,rgba(139,92,246,.1) 50%,transparent 55%),linear-gradient(90deg,transparent 48%,rgba(245,158,11,.08) 50%,transparent 52%);background-size:200px 200px,180px 180px,250px 250px;animation:neuralFlow 20s linear infinite;pointer-events:none;z-index:0}.skills .section-title{font-size:3.5rem;margin-bottom:30px;background:linear-gradient(135deg,#3b82f6,#8b5cf6,#f59e0b);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;position:relative;z-index:2;font-weight:800;letter-spacing:-1px;text-shadow:0 0 30px rgba(59,130,246,.3);animation:titlePulse 4s ease-in-out infinite}.skills .section-title:after{content:"";position:absolute;bottom:-15px;left:50%;transform:translate(-50%);width:120px;height:3px;background:linear-gradient(90deg,transparent 0%,rgba(59,130,246,.8) 25%,rgba(139,92,246,.8) 50%,rgba(245,158,11,.8) 75%,transparent 100%);border-radius:2px;animation:titleUnderline 3s ease-in-out infinite}@keyframes titlePulse{0%,to{filter:brightness(1);transform:scale(1)}50%{filter:brightness(1.2);transform:scale(1.02)}}@keyframes titleUnderline{0%,to{opacity:.6;transform:translate(-50%) scaleX(1)}50%{opacity:1;transform:translate(-50%) scaleX(1.1)}}.skills-categories{display:flex;justify-content:center;flex-wrap:wrap;gap:15px;margin-bottom:60px;position:relative;z-index:2}.category-filter{padding:12px 24px;background:var(--glass-bg);border:1px solid rgba(255,255,255,.1);border-radius:50px;color:var(--text-light);cursor:pointer;transition:var(--transition);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);font-weight:500;letter-spacing:.5px}.category-filter:hover,.category-filter.active{background:linear-gradient(135deg,#0f172a,#1e293b);color:var(--white);transform:translateY(-2px);box-shadow:0 0 25px #0f172a99;border-color:transparent}.skill-container{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:25px;max-width:1400px;margin:0 auto;justify-items:center;width:100%;position:relative;z-index:2;padding:40px 0}.skill{position:relative;width:280px;height:240px;opacity:0;transform:translateY(60px) scale(.8);transition:all .8s cubic-bezier(.175,.885,.32,1.275);will-change:transform,opacity;perspective:1000px}.skill.animate{opacity:1;transform:translateY(0) scale(1)}.skill-card{position:relative;width:100%;height:100%;background:var(--glass-bg);border:1px solid rgba(59,130,246,.2);border-radius:20px;padding:20px 18px;-webkit-backdrop-filter:blur(25px);backdrop-filter:blur(25px);transition:all .4s cubic-bezier(.175,.885,.32,1.275);cursor:pointer;overflow:hidden;display:flex;flex-direction:column;justify-content:space-between;box-shadow:0 8px 32px #3b82f61a,inset 0 1px #ffffff1a}.skill-card:before{content:"";position:absolute;inset:0;background:var(--gradient-primary);opacity:0;border-radius:20px;transition:all .4s ease;z-index:-1}.skill-card:after{content:"";position:absolute;inset:-2px;background:var(--gradient-primary);border-radius:22px;opacity:0;transition:all .4s ease;z-index:-2}.skill:hover .skill-card{transform:translateY(-15px) scale(1.03);border-color:#0f172ae6;box-shadow:0 20px 60px #0f172a99,0 8px 32px #0f172a66,inset 0 1px #ffffff0d}.skill:hover .skill-card:before{opacity:.2}.skill:hover .skill-card:after{opacity:.8}.skill-header{display:flex;align-items:center;gap:12px;margin-bottom:15px}.skill-icon{position:relative;width:42px;height:42px;display:flex;align-items:center;justify-content:center;background:#3b82f61a;border:1px solid rgba(59,130,246,.3);border-radius:10px;transition:all .4s ease;flex-shrink:0}.skill-icon img{width:24px;height:24px;transition:all .4s ease;filter:drop-shadow(0 0 8px rgba(59,130,246,.4))}.skill:hover .skill-icon{background:#0f172acc;border-color:#0f172a;box-shadow:0 0 25px #0f172acc;transform:scale(1.1)}.skill:hover .skill-icon img{filter:drop-shadow(0 0 15px rgba(15,23,42,1))}.skill-progress{width:100%;height:6px;background:#ffffff1a;border-radius:3px;overflow:hidden;position:relative;margin-bottom:10px}.progress-bar{height:100%;background:var(--gradient-primary);border-radius:3px;width:0%;transition:width 1.5s cubic-bezier(.4,0,.2,1);position:relative}.skill.animate .progress-bar{width:var(--percentage)}.progress-bar:after{content:"";position:absolute;top:0;right:0;width:20px;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.3));animation:progressShine 2s ease-in-out infinite}@keyframes progressShine{0%{transform:translate(-20px)}to{transform:translate(100px)}}.skill-name{font-size:1rem;font-weight:700;color:var(--text-color);letter-spacing:.3px;transition:all .4s ease;margin:0;flex:1}.skill:hover .skill-name{color:#f1f5f9;text-shadow:0 0 12px rgba(241,245,249,.6)}.skill-description{font-size:.8rem;color:var(--text-muted);line-height:1.4;margin-bottom:15px;transition:all .4s ease}.skill:hover .skill-description{color:#cbd5e1}.skill-details{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}.skill-level{font-size:.75rem;color:var(--text-muted);font-weight:600;text-transform:uppercase;letter-spacing:.5px;transition:all .4s ease}.skill:hover .skill-level{color:#e2e8f0}.skill-years{font-size:.75rem;color:var(--text-muted);font-weight:500;transition:all .4s ease}.skill:hover .skill-years{color:#cbd5e1}.skill-percentage{position:absolute;top:-25px;right:0;font-size:.75rem;font-weight:600;color:var(--primary-color);opacity:0;transition:all .4s ease;transform:translateY(10px)}.skill.animate .skill-percentage{opacity:1;transform:translateY(0)}.skill[data-category=programming] .skill-card:after{background:linear-gradient(135deg,#1e40af,#2563eb)}.skill[data-category=web] .skill-card:after{background:linear-gradient(135deg,#0891b2,#06b6d4)}.skill[data-category=database] .skill-card:after{background:linear-gradient(135deg,#047857,#10b981)}.skill[data-category=networking] .skill-card:after{background:linear-gradient(135deg,#7c2d12,#ea580c)}@keyframes neuralPulse{0%,to{opacity:.8;transform:scale(1)}50%{opacity:1;transform:scale(1.05)}}@keyframes neuralFlow{0%{background-position:0% 0%,0% 0%,0% 0%}to{background-position:200px 200px,-180px -180px,250px 0%}}@keyframes neuralPulseRing{0%{opacity:0;transform:scale(.8)}50%{opacity:.6;transform:scale(1.1)}to{opacity:0;transform:scale(1.3)}}@keyframes neuralActivation{0%{opacity:0;transform:scale(.8);border-color:#3b82f633}50%{opacity:1;transform:scale(1.1);border-color:#3b82f6cc}to{opacity:.7;transform:scale(1.2);border-color:#3b82f666}}.skill:nth-child(odd){animation:organicFloat 8s ease-in-out infinite}.skill:nth-child(2n){animation:organicFloat 8s ease-in-out infinite;animation-delay:4s;animation-direction:reverse}@keyframes organicFloat{0%,to{transform:translateY(0) rotate(0)}25%{transform:translateY(-15px) rotate(1deg)}50%{transform:translateY(-8px) rotate(0)}75%{transform:translateY(-20px) rotate(-1deg)}}.skill:hover{animation:none!important}.skills:after{content:"";position:absolute;top:0;left:0;width:0;height:0}.projects{padding:100px 20px;background-color:var(--section-bg);text-align:center;width:100%;box-sizing:border-box;overflow:hidden;position:relative}.project-filters{display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:15px;margin-bottom:40px}.filter-btn{display:flex;align-items:center;justify-content:center;padding:8px 20px;border:2px solid #e2e8f0;background:var(--white);color:var(--text-muted);border-radius:25px;cursor:pointer;transition:all .3s ease;font-weight:500;box-shadow:var(--shadow-sm)}.filter-btn:hover,.filter-btn.active{background:var(--primary-color);color:var(--white);border-color:var(--primary-color);transform:translateY(-2px);box-shadow:var(--shadow-md)}.project-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:20px;max-width:1000px;margin:0 auto;width:100%;padding:0 20px;box-sizing:border-box;justify-items:center;align-items:start}.project-card{width:100%;max-width:280px;height:260px;margin:0 auto;transform:translateY(50px);opacity:0;transition:all .8s ease;position:relative;z-index:1;perspective:1000px}.project-card.visible{transform:translateY(0);opacity:1}.project-card-inner{position:relative;width:100%;height:100%;text-align:center;transition:transform .8s;transform-style:preserve-3d;cursor:pointer;transform-origin:center}.project-card-inner.flipped{transform:rotateY(180deg)!important}.project-card-front,.project-card-back{position:absolute;width:100%;height:100%;backface-visibility:hidden;-webkit-backface-visibility:hidden;border-radius:20px;background:#1e293bf2;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border:1px solid rgba(59,130,246,.2);box-shadow:0 8px 32px #0000001a,0 2px 8px #0000000d;overflow:hidden}.project-card-front{transform:rotateY(0);z-index:2}.project-card-back{transform:rotateY(180deg);display:flex;flex-direction:column;justify-content:center;align-items:center;padding:20px;background:#334155;color:#f1f5f9}.project-card-back p{margin-bottom:20px;font-size:.95em;line-height:1.5}.project-card-back .view-project-btn{color:#fff;background:#3b82f6;padding:8px 18px;border-radius:8px;text-decoration:none;transition:all .3s ease}.project-card-back .view-project-btn:hover{background:#2563eb;transform:translateY(-2px)}.project-image{position:relative;height:150px;overflow:hidden;border-radius:16px 16px 0 0}.project-image img{width:100%;height:100%;object-fit:cover;transition:all .3s ease}.project-title{margin:12px 0;color:#f1f5f9;background:#1e293bd9;padding:4px 12px;border-radius:8px;font-size:1.1em;position:absolute;bottom:20px;left:50%;transform:translate(-50%);white-space:nowrap;max-width:90%;overflow:hidden;text-overflow:ellipsis}.project-content{padding:12px 15px 10px;height:calc(100% - 150px);display:flex;flex-direction:column;justify-content:flex-start;position:relative;margin-top:6px}.project-content h3{color:#f1f5f9;font-weight:700;font-size:1.1rem;margin-bottom:6px;text-align:center;line-height:1.3}.project-content p{color:#94a3b8;font-size:.85rem;line-height:1.5;text-align:center;margin:0;opacity:0;transform:translateY(10px);transition:all .3s ease}.project-card:hover .project-content p{opacity:1;transform:translateY(0)}.project-bottom{padding:15px 20px 20px;position:absolute;bottom:0;left:0;right:0;display:flex;align-items:center;justify-content:center;background:linear-gradient(to top,#fff,#ffffffe6)}.project-links{display:flex;gap:15px}.project-link{width:40px;height:40px;background:linear-gradient(135deg,#f05a28,#728fbf);border-radius:12px;display:flex;align-items:center;justify-content:center;text-decoration:none;color:#fff;font-size:1rem;transition:all .3s ease;position:relative;overflow:hidden}.project-link:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(135deg,#728fbf,#f05a28);transition:left .3s ease}.project-link:hover:before{left:0}.project-link i{position:relative;z-index:1}.project-link:hover{transform:translateY(-3px);box-shadow:0 8px 25px #f05a284d}.project-tech{display:none}.project-logo{position:absolute;top:12px;right:12px;width:50px;height:50px;background:#fffffff2;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:12px;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 20px #0000001a;transition:all .3s ease;z-index:10}.project-card:hover .project-logo{transform:scale(1.1) rotate(5deg);box-shadow:0 8px 30px #f05a2833}.project-logo .circle{display:none}.project-logo .circle4{display:flex;width:100%;height:100%;align-items:center;justify-content:center;background:transparent}.project-logo .circle4 .project-icon{width:28px;height:28px;border-radius:8px;background-size:cover;background-position:center;background-repeat:no-repeat;box-shadow:0 2px 8px #00000026}.contact{padding:100px 20px;background-color:var(--alt-section-bg);text-align:center;width:100%;box-sizing:border-box}.contact-container{margin:0 auto;display:grid;grid-template-columns:1fr 1fr;gap:50px;opacity:0;transform:translateY(30px);transition:var(--transition);will-change:transform,opacity;text-align:center;width:100%;max-width:1200px;box-sizing:border-box}.contact.visible .contact-container{opacity:1;transform:translateY(0)}.contact-form{display:flex;flex-direction:column;align-items:center;width:100%;max-width:600px;margin:0 auto;background:var(--card-bg);padding:30px;border-radius:20px;box-shadow:var(--shadow-lg);border:1px solid rgba(59,130,246,.2)}.form-group{width:100%;display:flex;flex-direction:column;align-items:center;margin-bottom:20px}.form-group input,.form-group textarea{width:100%;text-align:center;padding:15px;background:#334155;border:2px solid rgba(59,130,246,.3);border-radius:12px;color:var(--text-color);font-size:1rem;transition:all .3s ease;font-family:inherit}.form-group input:focus,.form-group textarea:focus{outline:none;border-color:var(--primary-color);background:#475569;box-shadow:0 0 0 3px #3b82f61a}.submit-btn{margin:20px auto;display:flex;align-items:center;justify-content:center;background:var(--primary-color);color:var(--white);border:none;padding:12px 30px;border-radius:25px;cursor:pointer;font-size:1rem;font-weight:600;transition:all .3s ease}.submit-btn:hover{background:#2563eb;transform:translateY(-3px);box-shadow:var(--shadow-md)}.contact-info{display:flex;flex-direction:column;align-items:center;gap:30px;width:100%;max-width:600px;margin:0 auto}.contact-item{display:flex;flex-direction:column;align-items:center;text-align:center;gap:10px;color:var(--text-muted)}.contact-item i{margin-bottom:10px;font-size:1.5rem;color:var(--primary-color)}@media(max-width:768px){.contact-item i{font-size:1.8rem;margin-bottom:12px}}@media(max-width:480px){.contact-item i{font-size:1.6rem;margin-bottom:10px}}.contact-item a{color:var(--text-muted);text-decoration:none;transition:all .3s ease}.contact-item a:hover{color:var(--primary-color);transform:translate(3px)}.footer{background-color:var(--section-bg);padding:30px 20px;text-align:center;border-top:1px solid #e2e8f0}.social-links{display:flex;justify-content:center;gap:20px;margin-bottom:20px}.social-links a{color:var(--text-muted);font-size:1.5rem;transition:var(--transition)}@media(max-width:768px){.social-links a{font-size:1.8rem}}@media(max-width:480px){.social-links a{font-size:1.6rem}}.social-links a:hover{color:var(--primary-color);transform:translateY(-3px)}.footer p{color:var(--text-muted)}.scroll-top{position:fixed;bottom:30px;right:30px;width:50px;height:50px;background:var(--primary-color);border-radius:50%;display:flex;align-items:center;justify-content:center;color:var(--white);font-size:1.5rem;cursor:pointer;opacity:0;visibility:hidden;transition:all .3s ease;z-index:1000}@media(max-width:768px){.scroll-top{width:55px;height:55px;font-size:1.6rem;bottom:20px;right:20px}}@media(max-width:480px){.scroll-top{width:50px;height:50px;font-size:1.4rem;bottom:15px;right:15px}}.scroll-top.active{opacity:1;visibility:visible}.scroll-top:hover{background:#2563eb;transform:translateY(-5px);box-shadow:var(--shadow-md)}.mobile-nav{position:fixed;top:0;right:-100%;width:100%;height:100vh;background:#0f172afa;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:30px;transition:var(--transition);z-index:1001;box-shadow:var(--shadow-lg)}.close-menu{position:absolute;top:20px;right:20px;background:none;border:none;color:var(--text-color);font-size:1.5rem;cursor:pointer}@media(max-width:1200px){.nav-content,.project-grid,.contact-container{max-width:95%;padding:0 20px}.hero h1{font-size:3rem;text-align:center}.typing-text{font-size:1.8rem;text-align:center}.section-title{text-align:center}}@media(max-width:992px){.hero h1{font-size:2.8rem;text-align:center}.typing-text{font-size:1.6rem;text-align:center}.section-title{font-size:2.2rem;text-align:center}.skill-container{grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:30px}.skill{width:130px}.circle{width:110px;height:110px}.inner-circle{width:75px;height:75px}.about-content{grid-template-columns:1fr;gap:50px;text-align:center;align-items:center;max-width:800px;min-height:auto}.profile-image-wrapper{width:250px;height:250px;margin:0 auto}.profile-image{width:200px;height:200px}.profile-glow{width:280px;height:280px}.about-image{max-width:320px;justify-self:center;margin:0 auto;aspect-ratio:1}.about-text{text-align:center;padding-top:0;max-width:600px;margin:0 auto;font-size:1.1rem;align-items:center}.about-text p{text-align:center;margin-bottom:22px}.about-text p:first-child{font-size:1.15rem;text-align:center}.cv-button{text-align:center;margin-top:30px}}@media(max-width:768px){body{padding-top:70px}.nav-container{padding:0 15px;width:100%;box-sizing:border-box;height:70px;position:fixed;top:0;left:0;right:0;z-index:1000}.nav-content{display:flex;justify-content:space-between;align-items:center;width:100%;height:100%;max-width:none;padding:0}.nav-container .logo{font-size:1.5rem;flex-shrink:0}.nav-links{display:none}.hamburger{display:block;background:none;border:none;color:var(--white);font-size:1.5rem;cursor:pointer;padding:8px;margin:0;z-index:1100;position:relative}.hamburger:hover{color:var(--primary-color)}.hero-content{padding:0 15px;text-align:center;width:100%;box-sizing:border-box}.hero-content h1{font-size:2rem}.hero-content p{font-size:1rem}.typing-text{font-size:1.4rem;width:100%;white-space:normal;height:auto;line-height:1.2}.about{padding:60px 15px;width:100%}.about-text{padding:0 15px;text-align:center;width:100%;align-items:center}.about-text p{font-size:.9rem;text-align:center;margin-bottom:1.2rem}.profile-image-wrapper{width:200px;height:200px}.profile-image{width:160px;height:160px}.profile-glow{width:230px;height:230px}.skill-container{grid-template-columns:repeat(3,1fr)!important;gap:6px!important;padding:0 4px!important}.skill{width:100%!important;max-width:100%!important;height:80px!important;margin-bottom:4px!important}.circle{width:80px;height:80px}.inner-circle{width:55px;height:55px}.inner-circle img{width:35%;height:35%}.skill p{font-size:.85rem;margin-top:8px}.skill-card{padding:4px 3px!important;background:#fffffff2!important;border:1px solid rgba(59,130,246,.3)!important;box-shadow:0 2px 8px #0000001a!important}.skill-header{margin-bottom:2px!important}.skill-icon{width:24px!important;height:24px!important}.skill-icon img{width:16px!important;height:16px!important}.skill-name{font-size:.6rem!important;color:#1f2937!important;font-weight:700!important}.skill-description{font-size:.45rem!important;margin-bottom:2px!important;line-height:1.1!important;color:#374151!important}.skill-details{margin-bottom:2px!important}.skill-level{font-size:.45rem!important;color:#6b7280!important;font-weight:600!important}.skill-progress{height:2px!important;margin-bottom:2px!important}.contact-container{padding:0 15px;grid-template-columns:1fr;width:100%}.contact-form{width:100%;padding:20px;box-sizing:border-box}.contact-form input,.contact-form textarea{width:100%;box-sizing:border-box}.contact-info{width:100%;margin-top:30px}.contact-info-item{text-align:center}.contact-info-item i{margin-bottom:10px}.project-card{width:100%;margin:10px auto;height:200px;perspective:600px}.project-grid{grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:15px;padding:0 10px}.project-card-inner{border-radius:15px}.project-glass{border-radius:10px 30% 10px 10px;background:#ffffff1f;backdrop-filter:blur(15px) saturate(120%);-webkit-backdrop-filter:blur(15px) saturate(120%)}.project-content{padding:8px 12px 0}.project-image{height:80px}.project-content h3{font-size:1rem;margin-bottom:0;padding:8px 12px;text-align:center}.project-content p{display:none}.project-content{padding:0}.project-logo .circle1{width:80px}.project-logo .circle2{width:65px;top:12px;right:12px}.project-logo .circle3{width:50px;top:20px;right:20px}.project-logo .circle4{width:35px;top:28px;right:28px}.project-logo .circle4 .project-icon{width:18px;height:18px}.project-bottom{padding:10px 15px}.project-tech{max-width:65%}.project-tech span{font-size:.75rem;padding:3px 6px}.project-link{width:35px;height:35px;font-size:1rem}.experience-item{width:100%;margin:10px 0}.skills-container{padding:0 15px}.category-btn{width:100%;margin:5px 0}.category-section{padding:0 15px}.mobile-nav{width:100%;padding:20px}.mobile-nav a{font-size:1.2rem;padding:15px 0;color:var(--nav-text);text-decoration:none;transition:color .3s ease}.mobile-nav a:hover{color:var(--primary-color)}.close-menu{top:20px;right:20px}.hero-buttons{flex-direction:column;width:100%}.btn{width:100%;max-width:300px}.contact-form{padding:20px}.form-group input,.form-group textarea{text-align:center}.submit-btn{width:100%;max-width:300px}.contact-info{align-items:center}.contact-item{text-align:center}.project-filters{flex-direction:column;align-items:center}.filter-btn{width:100%;max-width:300px}.experience-item{text-align:center}.cv-button{text-align:center;margin-top:30px}}@media screen and (max-width:768px){.project-card{max-width:100%;height:auto;min-height:320px}.project-grid{grid-template-columns:1fr;gap:20px;padding:0 10px}.project-card-inner{height:auto;min-height:320px}.project-content{padding:25px 20px 20px;height:auto;min-height:100px;position:relative;margin-top:15px}.project-content h3{font-size:1.2rem;margin-bottom:10px;color:#2c3e50}.project-content p{opacity:1;transform:translateY(0);font-size:.9rem;line-height:1.5}.project-image{height:150px}.project-logo{top:12px;right:12px;width:50px;height:50px}.project-logo .circle4 .project-icon{width:30px;height:30px}.project-bottom{padding:15px 20px 20px;position:relative;background:#334155}.project-link{width:45px;height:45px;font-size:1.1rem}}@media screen and (max-width:480px){.project-card,.project-card-inner{min-height:300px}.project-content{padding:20px 15px 15px;min-height:90px;margin-top:12px}.project-content h3{font-size:1.1rem;margin-bottom:8px}.project-content p{font-size:.85rem;line-height:1.4}.project-image{height:130px}.project-logo{width:45px;height:45px}.project-logo .circle4 .project-icon{width:25px;height:25px}.project-link{width:40px;height:40px;font-size:1rem}}@media screen and (max-width:360px){.project-card,.project-card-inner{min-height:280px}.project-content{padding:18px 12px 12px;min-height:80px;margin-top:10px}.project-content h3{font-size:1rem;margin-bottom:6px}.project-content p{font-size:.8rem;line-height:1.3}.project-image{height:120px}.project-bottom{padding:12px 15px 15px}.project-link{width:38px;height:38px;font-size:.95rem}.skill{height:130px;margin-bottom:6px}.skill-card{padding:6px 4px}.skill-header{margin-bottom:3px}.skill-icon{width:20px;height:20px}.skill-icon img{width:12px;height:12px}.skill-name{font-size:.7rem}.skill-description{font-size:.55rem;margin-bottom:3px;line-height:1.1}.skill-details{margin-bottom:2px}.skill-level{font-size:.5rem}.skill-progress{height:2px;margin-bottom:2px}.skill-percentage{font-size:.55rem}}.cv-button{margin-top:auto;text-align:center;padding-top:10px}.cv-button .btn{display:inline-flex;align-items:center;gap:.5rem;padding:.8rem 1.5rem;transition:all .3s ease}.cv-button .btn:hover{transform:translateY(-2px);box-shadow:0 4px 12px #00000026}.cv-button .btn i{font-size:1.1rem}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}@keyframes floatReverse{0%,to{transform:translateY(0)}50%{transform:translateY(10px)}}.skill:nth-child(odd){animation:float 6s ease-in-out infinite}.skill:nth-child(2n){animation:floatReverse 6s ease-in-out infinite;animation-delay:1s}.experience{padding:100px 20px;background-color:var(--section-bg);text-align:center;width:100%;box-sizing:border-box}.experience-container{display:flex;flex-direction:column;align-items:center;gap:30px;max-width:800px;margin:0 auto}.experience-item{width:100%;text-align:center;background:var(--card-bg);border:1px solid rgba(59,130,246,.2);border-radius:20px;padding:30px;transition:all .6s cubic-bezier(.4,0,.2,1);opacity:0;transform:translate(-50px) translateY(20px);will-change:transform,opacity;box-shadow:var(--shadow-sm);position:relative;overflow:hidden}.experience-item:before{content:"";position:absolute;top:0;left:0;width:4px;height:100%;background:linear-gradient(180deg,var(--primary-color),var(--secondary-color));opacity:0;transition:all .4s ease;transform:scaleY(0);transform-origin:top}.experience-item:after{content:"";position:absolute;top:-50%;left:-50%;width:200%;height:200%;background:radial-gradient(circle,rgba(59,130,246,.05) 0%,transparent 70%);opacity:0;transition:all .6s ease;transform:scale(0);pointer-events:none}.experience-item.visible{opacity:1;transform:translate(0) translateY(0)}.experience-item:nth-child(2n){transform:translate(50px) translateY(20px)}.experience-item:nth-child(2n).visible{transform:translate(0) translateY(0)}.experience-item:hover{transform:translateY(-8px) scale(1.01);box-shadow:var(--shadow-lg);border-color:var(--primary-color);background:#334155}.experience-item:hover:before{opacity:1;transform:scaleY(1)}.experience-item:hover:after{opacity:1;transform:scale(1)}.experience-header{margin-bottom:20px}.experience-header h3{color:var(--text-color);font-size:1.4rem;margin-bottom:8px;font-weight:600;transition:all .3s ease;text-align:center}.experience-item:hover .experience-header h3{color:var(--primary-color);transform:translateY(-2px)}.company{color:var(--primary-color);font-size:1.1rem;font-weight:500;margin-bottom:5px;transition:all .3s ease;text-align:center}.experience-item:hover .company{transform:translate(3px);text-shadow:0 0 8px rgba(59,130,246,.3)}.duration{color:var(--text-muted);font-size:.95rem;font-style:italic;transition:all .3s ease;text-align:center}.experience-item:hover .duration{color:var(--text-color);transform:translate(3px)}.experience-content ul{display:flex;flex-direction:column;align-items:center;list-style:none;padding:0;margin-bottom:20px}.experience-content li{text-align:center;padding-left:0;color:var(--text-muted);margin-bottom:12px;position:relative;line-height:1.6;transition:all .3s ease}.experience-content li:before{display:none}.experience-item:hover .experience-content li{transform:translate(2px)}.experience-item:hover .experience-content li:before{transform:scale(1.1) translate(1px);color:var(--text-color);text-shadow:0 0 3px var(--primary-color)}.experience-tech{justify-content:center;display:flex;flex-wrap:wrap;gap:8px;margin-top:15px}.experience-tech span{background:#3b82f61a;color:var(--primary-color);padding:6px 12px;border-radius:15px;font-size:.85rem;font-weight:500;border:1px solid rgba(59,130,246,.2);transition:all .3s ease}.experience-tech span:hover{background:#3b82f633;transform:translateY(-2px);box-shadow:0 4px 12px #3b82f633}.notification{position:fixed;top:20px;right:20px;z-index:99999;background:#1e293bf2;backdrop-filter:blur(20px) saturate(150%);-webkit-backdrop-filter:blur(20px) saturate(150%);border-radius:12px;box-shadow:0 8px 32px #0000004d,0 0 0 1px #fff3;border-left:4px solid var(--primary-color);opacity:0;transform:translate(100%);transition:all .4s cubic-bezier(.4,0,.2,1);max-width:400px;min-width:300px;pointer-events:auto}.notification.show{opacity:1;transform:translate(0)}.notification-success{border-left-color:#10b981;background:#10b9811a}.notification-error{border-left-color:#ef4444;background:#ef44441a}.notification-content{padding:20px 24px;display:flex;align-items:flex-start;justify-content:space-between;gap:16px}.notification-message{color:var(--text-color);font-size:15px;font-weight:500;line-height:1.5;flex:1}.notification-close{background:none;border:none;color:var(--text-color);cursor:pointer;font-size:20px;font-weight:700;padding:0;margin:0;line-height:1;transition:color .2s ease;flex-shrink:0;opacity:.7}.notification-close:hover{opacity:1;color:var(--primary-color)}.notification-success .notification-message,.notification-success .notification-close{color:#065f46}.notification-error .notification-message,.notification-error .notification-close{color:#7f1d1d}.contact-form .submit-btn:disabled{opacity:.7;cursor:not-allowed;background:#888}@media(max-width:768px){.notification{position:fixed!important;top:20px!important;right:10px!important;left:10px!important;z-index:999999!important;max-width:none!important;min-width:auto!important;width:calc(100vw - 20px)!important;margin:0!important;box-sizing:border-box!important;transform:translateY(-100%)!important;opacity:0!important;transition:all .4s cubic-bezier(.4,0,.2,1)!important}.notification.show{opacity:1!important;transform:translateY(0)!important}.notification-content{padding:16px 20px!important;font-size:14px!important}.notification-message{font-size:14px!important;line-height:1.4!important}.notification-close{font-size:18px!important;padding:4px!important;margin:-4px!important}}@media(max-width:480px){.notification{top:10px!important;right:5px!important;left:5px!important;width:calc(100vw - 10px)!important}.notification-content{padding:12px 16px!important}.notification-message{font-size:13px!important}}.skill-container,.project-grid,.contact-container,.experience-container{width:100%;max-width:1200px;margin:0 auto;box-sizing:border-box}img{max-width:100%;height:auto;box-sizing:border-box}section{width:100%;overflow-x:hidden;box-sizing:border-box}@media screen and (min-width:390px)and (max-width:428px){.project-content{display:flex!important;flex-direction:column!important;justify-content:flex-end!important;padding:15px 10px 10px!important;height:80px!important;position:absolute!important;bottom:50px!important;left:0!important;right:0!important;background:linear-gradient(to top,rgba(0,0,0,.8) 0%,transparent 100%)!important;z-index:5!important;margin-top:15px!important}.project-content h3{display:block!important;visibility:visible!important;opacity:1!important;color:#fff!important;font-size:1rem!important;font-weight:700!important;text-align:center!important;padding:8px 12px!important;margin:0!important;background:#00000080!important;border-radius:8px!important;z-index:10!important;position:relative!important;text-shadow:2px 2px 4px rgba(0,0,0,.8)!important;border:1px solid rgba(255,255,255,.2)!important;-webkit-backdrop-filter:blur(5px)!important;backdrop-filter:blur(5px)!important}.project-card{height:280px!important;width:100%!important;max-width:350px!important;margin:0 auto!important}.project-image{height:200px!important;border-radius:15px 15px 0 0!important}.project-bottom{padding:15px!important;margin-top:10px!important;background:#ffffff1a!important;-webkit-backdrop-filter:blur(10px)!important;backdrop-filter:blur(10px)!important;border-radius:0 0 15px 15px!important}}@media screen and (max-width:480px){.notification{top:10px!important;right:5px!important;left:5px!important;width:calc(100vw - 10px)!important}.notification-content{padding:12px 16px!important}.notification-message{font-size:13px!important}.skill{height:160px;margin-bottom:10px}.skill-card{padding:10px 8px}.skill-header{margin-bottom:6px}.skill-icon{width:28px;height:28px}.skill-icon img{width:16px;height:16px}.skill-name{font-size:.8rem}.skill-description{font-size:.65rem;margin-bottom:6px;line-height:1.2}.skill-details{margin-bottom:4px}.skill-level{font-size:.6rem}.skill-progress{height:3px;margin-bottom:4px}.skill-percentage{font-size:.65rem}}.admin-access-btn{transition:all .3s ease;border-top:1px solid rgba(255,255,255,.1);margin-top:20px!important;opacity:.3}.admin-access-btn:hover{opacity:.7!important;background:#f05a281a!important;transform:translate(5px)}.admin-access-btn:active{opacity:1!important;background:#f05a2833!important;transform:scale(.98)}.admin-access-btn i{transition:all .3s ease}.admin-access-btn:hover i{transform:rotate(90deg);color:#f05a28}@media(min-width:769px){.admin-access-btn{display:none!important}}@media(max-width:768px){.admin-access-btn{font-size:16px;padding:18px 0!important;position:relative;overflow:hidden}.admin-access-btn:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(240,90,40,.1),transparent);transition:left .5s ease}.admin-access-btn:active:before{left:100%}}.animated-name{display:none}.ai-assistant{position:fixed;bottom:30px;right:30px;z-index:1000;cursor:pointer;display:flex;align-items:center;transition:transform .3s ease}.ai-assistant:hover{transform:scale(1.05)}.ai-animation{width:80px;height:80px;background:var(--white);border-radius:50%;box-shadow:var(--shadow-lg);display:flex;justify-content:center;align-items:center;transition:all .3s ease}.ai-tooltip{position:absolute;right:100%;top:50%;transform:translateY(-50%);background:var(--white);padding:8px 12px;border-radius:8px;font-size:14px;color:var(--text-color);box-shadow:var(--shadow-md);margin-right:10px;opacity:0;pointer-events:none;transition:opacity .3s ease;white-space:nowrap}.ai-assistant:hover .ai-tooltip{opacity:1}@media(max-width:768px){.ai-assistant{bottom:20px;right:20px}.ai-animation{width:60px;height:60px}}@media(max-width:768px){.hamburger{display:block}.nav-links{display:none}}.typing-text{min-width:320px;width:100%;max-width:100%;text-align:center;height:2.4rem;display:flex;align-items:center;justify-content:center;white-space:nowrap;overflow:hidden}.hamburger i{color:#e2e8f0!important;font-size:2rem!important;display:inline-block!important;vertical-align:middle}@media(max-width:768px){.hamburger i{font-size:2.2rem!important}}@media(max-width:480px){.hamburger i{font-size:2rem!important}}.mobile-menu-overlay{display:none;position:fixed;inset:0;background:#000000b3;z-index:1000;opacity:0;transition:opacity .3s}.mobile-menu-overlay.active{display:block;opacity:1}.mobile-nav{position:fixed;top:0;right:-100vw;width:85vw;max-width:400px;height:100vh;background:linear-gradient(135deg,#0f172a,#1e293b);color:#fff;z-index:1001;display:flex;flex-direction:column;padding:2rem 1.5rem;box-shadow:-4px 0 20px #0000004d;transition:right .4s cubic-bezier(.77,.2,.05,1);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-left:1px solid rgba(59,130,246,.2)}.mobile-nav.active{right:0}.mobile-nav-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:2rem}.mobile-nav-logo{font-size:2rem;font-weight:700;letter-spacing:2px;color:#06b6d4}.close-menu{background:none;border:none;color:#fff;font-size:2rem;cursor:pointer}.mobile-nav .nav-link{opacity:0;transform:translate(30px);transition:opacity .3s,transform .3s;font-size:1.2rem;margin:1rem 0;color:#fff;text-decoration:none;border-bottom:1px solid rgba(59,130,246,.1);padding-bottom:.5rem}.mobile-nav.active .nav-link{opacity:1;transform:translate(0)}.mobile-nav .nav-link:nth-child(2){transition-delay:.05s}.mobile-nav .nav-link:nth-child(3){transition-delay:.1s}.mobile-nav .nav-link:nth-child(4){transition-delay:.15s}.mobile-nav .nav-link:nth-child(5){transition-delay:.2s}.mobile-nav .nav-link:nth-child(6){transition-delay:.25s}.mobile-nav .nav-link:nth-child(7){transition-delay:.3s}.mobile-nav .nav-link:nth-child(8){transition-delay:.35s}@media(min-width:768px){.mobile-nav,.mobile-menu-overlay{display:none!important}}.hamburger{display:block;position:relative;z-index:1100}@media(min-width:768px){.hamburger{display:none}}.fab-container{position:fixed;bottom:30px;right:30px;z-index:1000;display:none}.fab-button{width:60px;height:60px;border-radius:50%;background:linear-gradient(135deg,#06b6d4,#2563eb);border:none;color:#fff;font-size:1.5rem;cursor:pointer;box-shadow:0 4px 20px #06b6d44d;transition:all .3s cubic-bezier(.68,-.55,.265,1.55);position:relative;z-index:1002}.fab-button:hover{transform:scale(1.1);box-shadow:0 6px 25px #06b6d466}.fab-button.active{transform:rotate(45deg);background:linear-gradient(135deg,#dc2626,#ea580c)}.fab-menu{position:absolute;bottom:70px;right:0;display:flex;flex-direction:column;gap:15px;opacity:0;visibility:hidden;transform:scale(.8) translateY(20px);transition:all .3s cubic-bezier(.68,-.55,.265,1.55)}.fab-menu.active{opacity:1;visibility:visible;transform:scale(1) translateY(0)}.fab-item{width:50px;height:50px;border-radius:50%;background:#1e293bf2;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:2px solid rgba(59,130,246,.2);color:#f1f5f9;display:flex;align-items:center;justify-content:center;text-decoration:none;font-size:1.2rem;box-shadow:0 4px 15px #0000001a;transition:all .3s ease;position:relative}.fab-item svg{width:20px;height:20px;fill:currentColor}.fab-item:hover{transform:scale(1.1);box-shadow:0 6px 20px #0003}.fab-home{background:linear-gradient(135deg,#ff6b6b,#ee5a24);color:#fff}.fab-home:hover{background:linear-gradient(135deg,#ff5252,#d63031)}.fab-about{background:linear-gradient(135deg,#4ecdc4,#00b894);color:#fff}.fab-about:hover{background:linear-gradient(135deg,#00cec9,#00a085)}.fab-experience{background:linear-gradient(135deg,#fdcb6e,#e17055);color:#fff}.fab-experience:hover{background:linear-gradient(135deg,#fdcb6e,#d63031)}.fab-skills{background:linear-gradient(135deg,#6c5ce7,#a29bfe);color:#fff}.fab-skills:hover{background:linear-gradient(135deg,#5f3dc4,#845ef7)}.fab-projects{background:linear-gradient(135deg,#fd79a8,#e84393);color:#fff}.fab-projects:hover{background:linear-gradient(135deg,#f783ac,#e91e63)}.fab-contact{background:linear-gradient(135deg,#74b9ff,#0984e3);color:#fff}.fab-contact:hover{background:linear-gradient(135deg,#5dade2,#3498db)}.fab-library{background:linear-gradient(135deg,#a8e6cf,#2ecc71);color:#fff}.fab-library:hover{background:linear-gradient(135deg,#87d37c,#27ae60)}@media(max-width:768px){.fab-container{display:block}.fab-item{width:55px;height:55px;font-size:1.3rem}.fab-item svg{width:22px;height:22px}.fab-button{width:65px;height:65px;font-size:1.6rem}}@media(min-width:769px){.fab-container{display:none!important}}@media screen and (max-width:480px){.skill{height:120px;margin-bottom:6px}.skill-card{padding:6px 4px;background:#fffffff2!important;border:1px solid rgba(59,130,246,.3)!important;box-shadow:0 2px 8px #0000001a!important}.skill-header{margin-bottom:2px}.skill-icon{width:28px;height:28px}.skill-icon img{width:18px;height:18px}.skill-name{font-size:.7rem;color:#1f2937!important;font-weight:700!important}.skill-description{font-size:.55rem;margin-bottom:2px;line-height:1.1;color:#374151!important}.skill-details{margin-bottom:2px}.skill-level{font-size:.5rem;color:#6b7280!important;font-weight:600!important}.skill-progress{height:2px;margin-bottom:2px}.skill-percentage{font-size:.55rem}}@media screen and (max-width:360px){.skill{height:100px;margin-bottom:4px}.skill-card{padding:3px 2px;background:#fffffff2!important;border:1px solid rgba(59,130,246,.3)!important;box-shadow:0 2px 8px #0000001a!important}.skill-header{margin-bottom:1px}.skill-icon{width:22px;height:22px}.skill-icon img{width:14px;height:14px}.skill-name{font-size:.6rem;color:#1f2937!important;font-weight:700!important}.skill-description{font-size:.45rem;margin-bottom:1px;line-height:1.05;color:#374151!important}.skill-details{margin-bottom:1px}.skill-level{font-size:.4rem;color:#6b7280!important;font-weight:600!important}.skill-progress{height:1px;margin-bottom:1px}.skill-percentage{font-size:.45rem}}@media screen and (max-width:480px){.skill-container{grid-template-columns:repeat(2,1fr);gap:10px;padding:0 4px}}@media screen and (max-width:360px){.skill-container{grid-template-columns:1fr;gap:6px;padding:0 2px}}@media screen and (max-width:900px){.skill-container{display:grid!important;grid-template-columns:repeat(3,1fr)!important;gap:14px!important;padding:0 8px!important}.skill,.skill-card{width:100%!important;max-width:none!important;min-width:0!important;box-sizing:border-box!important}}@media screen and (max-width:600px){.skill-container{display:grid!important;grid-template-columns:repeat(2,1fr)!important;gap:8px!important;padding:0 4px!important}.skill,.skill-card{width:100%!important;max-width:none!important;min-width:0!important;box-sizing:border-box!important}}@media screen and (max-width:360px){.skill-container{display:grid!important;grid-template-columns:1fr!important;gap:6px!important;padding:0 2px!important}.skill,.skill-card{width:100%!important;max-width:none!important;min-width:0!important;box-sizing:border-box!important}}@media screen and (max-width:600px){.skill,.skill-card{height:90px!important;min-height:0!important;padding:6px 4px!important;border:1px solid rgba(59,130,246,.3)!important;background:#fffffff2!important;box-shadow:0 2px 8px #0000001a!important}.skill-header{margin-bottom:2px!important}.skill-icon{width:20px!important;height:20px!important}.skill-icon img{width:14px!important;height:14px!important}.skill-name{font-size:.65rem!important;color:#1f2937!important;font-weight:700!important}.skill-description{font-size:.5rem!important;margin-bottom:2px!important;line-height:1.1!important;color:#374151!important}.skill-details{margin-bottom:2px!important}.skill-level{font-size:.45rem!important;color:#6b7280!important;font-weight:600!important}.skill-progress{height:2px!important;margin-bottom:2px!important}.skill-percentage{font-size:.45rem!important}}@media(max-width:768px){.nav-link,.fab-item,.contact-item,.social-links a,.scroll-top{min-height:44px;min-width:44px}.skill-icon{border-width:2px;box-shadow:0 2px 8px #3b82f633}.fab-item{box-shadow:0 6px 20px #00000026}.contact-item i{text-shadow:0 1px 3px rgba(59,130,246,.3)}.skill:active .skill-card,.skill-card:active{transform:scale(.98)!important;background:#1e293b!important;border-color:#2563ebb3!important;box-shadow:0 4px 12px #2563eb66!important}.skill:active .skill-name{color:#2563eb!important}.skill:active .skill-description{color:#e2e8f0!important}.skill:active .skill-level{color:#2563eb!important}}.fab-icon-label{display:none;position:absolute;right:100%;top:50%;transform:translateY(-50%) translate(-8px);background:#000000b3;color:#fff;font-size:.65rem;font-weight:500;padding:2px 8px;border-radius:4px;white-space:nowrap;z-index:10;pointer-events:none;opacity:.95;border:1px solid rgba(255,255,255,.1);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}@media(max-width:600px){.fab-item{position:relative}.fab-icon-label{display:block}}
