:root {--bg-color:#121212;--primary-color:#0059ff;--secondary-color:#6408bb;--card-bg-color:#1e1e1e;--text-color:#e0e0e0;--text-secondary-color:#a0a0a0;--border-color:#333;--card-hover-shadow:0 8px 30px rgba(84,11,179,0.1);}* {margin:0;padding:0;box-sizing:border-box;font-family:'Poppins',sans-serif;scroll-behavior:smooth;}body {background-color:var(--bg-color);color:var(--text-color);}html,body {max-width:100%;overflow-x:hidden;}.intro-popup {position:fixed;top:0;left:0;width:100%;height:100%;background-color:rgba(0,0,0,0.8);backdrop-filter:blur(5px);z-index:10000;display:flex;justify-content:center;align-items:center;padding:20px;opacity:1;transition:opacity 0.5s ease;}.intro-popup.hidden {opacity:0;pointer-events:none;}.popup-card {position:relative;background:#0f0f0f;padding:30px;padding-top:80px;border-radius:25px;text-align:center;max-width:420px;width:90%;border:1px solid #333;box-shadow:0 0 35px rgba(0,0,0,0.5),0 0 20px rgba(70,70,200,0.2);transform:scale(0.9);animation:popup-appear 0.4s 0.2s ease-out forwards;}@keyframes popup-appear {to {transform:scale(1);}}.popup-wings {position:absolute;top:50%;left:50%;transform:translate(-50%,-65%);width:150%;z-index:-1;opacity:0.8;}.popup-wings img {width:100%;}.profile-image-wrapper {position:absolute;top:0;left:50%;transform:translate(-50%,-50%);}.profile-image {width:150px;height:150px;border-radius:50%;border:5px solid #1A1A1A;background-color:#1A1A1A;}.verified-badge {position:absolute;bottom:5px;right:5px;width:30px;height:30px;background-color:#1DA1F2;border-radius:50%;display:flex;align-items:center;justify-content:center;color:white;font-size:1rem;border:2px solid #1A1A1A;}.intro-greeting {color:#a0a0a0;font-size:1rem;margin:0;}.popup-card h2 {color:#ffffff;font-size:2.2rem;margin:5px 0 20px 0;}.intro-details {color:#a0a0a0;line-height:1.6;margin-bottom:30px;}.intro-details p {margin:0;font-size:1.1rem;}.portfolio-button {display:inline-block;padding:12px 35px;background-color:#5D26C1;color:white;text-decoration:none;border-radius:50px;font-weight:600;transition:all 0.3s ease;cursor:pointer;}.portfolio-button:hover {background-color:#a026c1;transform:scale(1.05);box-shadow:0 5px 15px rgba(93,38,193,0.4);}.navbar {position:fixed;top:20px;left:50%;transform:translateX(-50%);z-index:1000;width:90%;max-width:500px;padding:10px 20px;background:rgba(30,30,30,0.7);backdrop-filter:blur(10px);border-radius:50px;border:1px solid var(--border-color);transition:top 0.3s ease-in-out,opacity 0.3s ease-in-out;}.navbar nav {display:flex;justify-content:center;align-items:center;width:100%;}.navbar ul {list-style:none;display:flex;flex-direction:row;gap:30px;padding:0;margin:0;}.navbar ul li a {text-decoration:none;color:var(--text-color);font-weight:500;transition:color 0.3s ease;position:relative;padding:5px 0;font-size:1rem;}.navbar ul li a::after {content:'';position:absolute;width:0;height:2px;bottom:0;left:50%;transform:translateX(-50%);background-color:var(--primary-color);transition:width 0.3s ease;}.navbar ul li a:hover,.navbar ul li a.active {color:var(--primary-color);}.navbar ul li a:hover::after,.navbar ul li a.active::after {width:100%;}.menu-toggle {display:none;background:none;border:none;color:var(--text-color);font-size:1.5rem;cursor:pointer;}@media (max-width:768px) {.navbar {display:none !important;max-width:none;width:90%;}.navbar nav {justify-content:flex-end;}.menu-toggle {display:block;}.navbar ul {display:flex;position:absolute;top:calc(100% + 10px);right:0;width:250px;flex-direction:column;gap:0;background:rgba(30,30,30,0.9);backdrop-filter:blur(10px);border:1px solid var(--border-color);border-radius:15px;max-height:0;padding:0;overflow:hidden;transition:max-height 0.4s ease-in-out,padding 0.4s ease-in-out;}.navbar ul.active {max-height:500px;padding:10px 0;}.navbar ul li {width:100%;}.navbar ul li a {display:block;padding:12px 25px;text-align:left;}.navbar ul li a::after {display:none;}}header#home {min-height:100vh;padding-top:180px;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;padding:0 20px;position:relative;}.profile-img {width:160px;height:160px;border-radius:50%;border:5px solid var(--primary-color);object-fit:cover;margin-top:60px;margin-bottom:20px;animation:fadeIn 1s ease-in-out;}.header-buttons {margin-top:25px;display:flex;gap:15px;flex-wrap:wrap;justify-content:center;color:#ffffff;}.welcome-text {font-size:2.5rem;font-weight:700;line-height:1.2;animation:slideInUp 1s ease-out;}.welcome-text:nth-of-type(2){color:var(--primary-color);animation-delay:0.2s;}.about-content {margin-top:15px;max-width:600px;animation:fadeIn 1s ease-in-out 0.5s;animation-fill-mode:backwards;}.about-content h2{font-size:1.5rem;color:var(--text-color);}.about-content p {font-size:1rem;color:var(--text-secondary-color);}.scroll-down {position:absolute;bottom:20px;font-size:1.5rem;color:var(--text-color);animation:bounce 2s infinite;}@keyframes bounce {0%,20%,50%,80%,100% {transform:translateY(0);}40% {transform:translateY(-15px);}60% {transform:translateY(-8px);}}.aurora-bg {position:fixed;top:0;left:0;width:100%;height:100%;z-index:-1;overflow:hidden;filter:blur(100px);}.aurora-bg .aurora-dot {position:absolute;border-radius:50%;}.aurora-bg .aurora-dot:nth-child(1) {top:-20%;left:-10%;width:500px;height:500px;background:rgba(0,170,255,0.4);animation:float 20s infinite alternate;}.aurora-bg .aurora-dot:nth-child(2) {top:40%;left:60%;width:600px;height:600px;background:rgba(170,0,255,0.3);animation:float 25s infinite alternate-reverse;}@keyframes float {0% {transform:translateY(0px) translateX(0px) rotate(0deg);}100% {transform:translateY(100px) translateX(-100px) rotate(180deg);}}section {padding:100px 10%;}.section-title {text-align:center;font-size:2.5rem;margin-bottom:50px;font-weight:700;position:relative;}.section-title::after {content:'';position:absolute;width:80px;height:4px;bottom:-10px;left:50%;transform:translateX(-50%);background-color:var(--primary-color);border-radius:2px;}#gallery {-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);text-align:center;overflow:hidden;}.swiper-container {width:100%;max-width:1200px;margin:0 auto 30px auto;position:relative;}.swiper-slide img {width:100%;height:400px;object-fit:cover;border-radius:15px;}#gallery .swiper-slide {width:65%;transition:transform 0.5s,opacity 0.5s,filter 0.5s;opacity:0.3;filter:blur(4px);transform:scale(0.85);}#gallery .swiper-slide-active {opacity:1;filter:blur(0);transform:scale(1);}.swiper-button-next,.swiper-button-prev {color:var(--primary-color);background:rgba(30,30,30,0.5);width:50px;height:50px;border-radius:50%;transition:background 0.3s;}.swiper-button-next:hover,.swiper-button-prev:hover {background:rgba(0,188,212,0.5);color:white;}.animated-btn {display:inline-block;padding:12px 30px;background-color:rgb(19,19,19);color:#ffffff;text-decoration:none;border-radius:15px;font-weight:600;transition:transform 0.3s ease,background-color 0.3s ease,box-shadow 0.3s;border:1px solid rgb(44,44,44);}.animated-btn:hover {transform:translateY(-5px);color:white;border-color:var(--secondary-color);box-shadow:0 0 25px rgba(0,132,255,0.5);background-color:transparent;}.animated-btn.secondary {background-color:var(--secondary-color);border-color:var(--secondary-color);}.animated-btn.secondary:hover {color:var(--secondary-color);}.portfolio-grid {display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:30px;}.portfolio-card {-webkit-backdrop-filter:blur(30px);backdrop-filter:blur(20px);border-radius:15px;overflow:hidden;transition:transform 0.3s ease,box-shadow 0.3s ease;border:1px solid var(--border-color);position:relative;display:flex;flex-direction:column;}.portfolio-card::after {content:'';position:absolute;bottom:0;left:0;height:4px;width:0;background:linear-gradient(90deg,var(--primary-color),var(--secondary-color));transition:width 0.4s ease-out;}.portfolio-card:hover {transform:translateY(-10px);box-shadow:var(--card-hover-shadow);}.portfolio-card:hover::after {width:100%;}.portfolio-content {padding:25px;display:flex;flex-direction:column;flex-grow:1;}.portfolio-description {color:var(--text-secondary-color);margin-bottom:20px;flex-grow:1;}.portfolio-img {width:100%;height:220px;object-fit:cover;}.portfolio-title {font-size:1.5rem;color:white;margin-bottom:10px;}.portfolio-btn {display:inline-flex;align-items:center;justify-content:center;padding:10px 25px;background-color:transparent;color:white;text-decoration:none;border-radius:10px;font-weight:600;border:2px solid var(--primary-color);transition:all 0.3s ease;align-self:flex-start;}.portfolio-btn:hover {background-color:var(--primary-color);color:white;}.portfolio-card::before {content:'';position:absolute;left:var(--mouse-x,-100%);top:var(--mouse-y,-100%);width:0;height:0;background:radial-gradient(circle closest-side,rgba(84,11,179,0.2),transparent);transform:translate(-50%,-50%);transition:width 0.2s ease,height 0.2s ease;z-index:0;}.portfolio-card:hover::before {width:300px;height:300px;}.portfolio-card .portfolio-content {z-index:2;position:relative;}#projects {text-align:center;}.project-intro {max-width:700px;margin:0 auto 50px auto;color:var(--text-secondary-color);}.project-stats {display:flex;justify-content:center;gap:50px;margin-bottom:30px;flex-wrap:wrap;}.stat-item {text-align:center;}.stat-number {font-size:2.5rem;font-weight:700;color:var(--primary-color);}.stat-label {font-size:1rem;color:var(--text-secondary-color);}.review-link {display:block;margin-bottom:50px;color:var(--primary-color);text-decoration:none;transition:color 0.3s;}.review-link:hover {text-decoration:underline;}.project-cards-grid {display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:30px;}.project-card {-webkit-backdrop-filter:blur(30px);backdrop-filter:blur(20px);border:1px solid var(--border-color);border-radius:15px;padding:30px;text-align:center;position:relative;overflow:visible;cursor:pointer;transition:all 0.4s ease;}.project-card:hover {transform:translateY(-10px);box-shadow:var(--card-hover-shadow);}.project-card-image {position:absolute;bottom:105%;left:0;width:100%;height:100%;object-fit:cover;opacity:0;border-radius:15px;box-shadow:0 15px 35px rgba(0,0,0,0.4);transform:scale(0.8) translateY(20px);transition:all 0.4s cubic-bezier(0.175,0.885,0.32,1.275);z-index:10;pointer-events:none;}.project-card:hover .project-card-image {opacity:1;transform:scale(1) translateY(0);}.project-card-content {position:relative;z-index:2;}.project-card .icon {font-size:3rem;color:var(--primary-color);margin-bottom:15px;transition:transform 0.3s ease;}.project-card:hover .icon {transform:scale(1.1);}.project-card h3 {font-size:1.5rem;margin-bottom:10px;}.project-card p {color:var(--text-secondary-color);}.price-accordion {max-width:800px;margin:0 auto;}.accordion-item {-webkit-backdrop-filter:blur(30px);backdrop-filter:blur(20px);margin-bottom:10px;border-radius:10px;border:1px solid var(--border-color);overflow:hidden;}.accordion-header {padding:20px;cursor:pointer;display:flex;justify-content:space-between;align-items:center;font-size:1.2rem;font-weight:600;transition:background-color 0.3s ease;}.accordion-header:hover {background-color:#2a2a2a;}.accordion-header i {transition:transform 0.4s ease;}.accordion-item.active .accordion-header i {transform:rotate(180deg);}.accordion-content {max-height:0;overflow:hidden;transition:max-height 0.5s cubic-bezier(0.25,0.8,0.25,1),padding 0.5s ease;padding:0 20px;}.accordion-content-inner {padding:20px 0;border-top:1px solid var(--border-color);}.price-detail {display:flex;justify-content:space-between;padding:10px 0;border-bottom:1px dashed #444;}.price-detail:last-child {border-bottom:none;}.price-detail .item-name {color:var(--text-secondary-color);}.price-detail .price {font-weight:600;color:var(--primary-color);}.price-detail .note {font-size:0.8rem;color:#888;}#order-now {padding:100px 10%;}.order-card {max-width:800px;margin:0 auto;padding:40px;background:rgba(30,30,30,0.7);backdrop-filter:blur(20px);border-radius:20px;border:1px solid var(--border-color);}.form-group {margin-bottom:20px;}.form-group label {display:block;margin-bottom:8px;color:var(--text-secondary-color);font-weight:500;}.form-control {width:100%;padding:12px 15px;background-color:#121212;border:1px solid var(--border-color);border-radius:10px;color:var(--text-color);font-size:1rem;}.form-control:focus {outline:none;border-color:var(--primary-color);box-shadow:0 0 0 3px rgba(84,11,179,0.2);}textarea.form-control {resize:vertical;min-height:120px;}.agreement-group {display:flex;align-items:center;gap:10px;margin-top:20px;}#agreement {width:18px;height:18px;}.send-btn {display:inline-block;padding:12px 30px;background-color:var(--primary-color);color:#ffffff;text-decoration:none;border-radius:15px;font-weight:600;transition:all 0.3s ease;border:2px solid var(--primary-color);cursor:pointer;margin-left:auto;}.send-btn:disabled {background-color:#555;border-color:#555;cursor:not-allowed;}.form-row {display:flex;align-items:center;gap:20px;}#about-me {display:flex;flex-direction:column;align-items:center;text-align:center;gap:30px;}.about-image {flex-shrink:0;}.about-image img {width:200px;height:200px;border-radius:50%;border:5px solid var(--primary-color);object-fit:cover;}.about-details {width:100%;max-width:800px;}.about-details h1 {font-size:2.2rem;margin-bottom:5px;}.about-details .subtitle {font-size:1.2rem;color:var(--primary-color);font-weight:600;margin-bottom:30px;}.info-section {margin-bottom:25px;text-align:left;}.info-section h3 {font-size:1.3rem;border-bottom:2px solid var(--primary-color);padding-bottom:5px;margin-bottom:15px;display:inline-block;}.info-section ul {list-style:none;}.info-section ul li {margin-bottom:10px;display:flex;}.info-section ul li strong {width:120px;display:inline-block;color:var(--text-secondary-color);}.pro-skills-grid {display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:15px;}.skill-item {background:var(--card-bg-color);padding:15px;border-radius:10px;text-align:center;border:1px solid var(--border-color);}.about-details .animated-btn {margin-top:20px;}#main-footer {position:relative;background-color:#141414;color:#ffffff;padding:100px 10% 20px 10%;margin-top:150px;}.thank-you-banner {position:absolute;top:0;left:50%;transform:translate(-50%,-50%);background-color:#141414;padding:15px 50px;border-radius:10px;text-align:center;border:1px solid var(--border-color);}.thank-you-banner h3 {margin:0;font-size:1.5rem;color:white;}.thank-you-banner p {margin:0;color:var(--text-secondary-color);}.footer-content {display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr 1.5fr;gap:30px;margin-bottom:50px;}.footer-column {font-size:0.9rem;}.footer-column h4 {font-weight:bold;margin-bottom:20px;font-size:1rem;}.footer-column ul {list-style:none;padding:0;}.footer-column ul li {margin-bottom:10px;}.footer-column ul li a {color:var(--text-secondary-color);text-decoration:none;transition:color 0.3s ease;}.footer-column ul li a:hover {color:var(--primary-color);}#footer-logo-col .footer-logo {max-width:150px;}#footer-contact-col .footer-qr {width:120px;height:120px;border-radius:10px;margin-bottom:15px;}#footer-contact-col .contact-details p {margin:5px 0;color:var(--text-secondary-color);}#footer-contact-col .footer-badges {margin-top:15px;}#footer-contact-col .footer-badges img {width:40px;height:40px;margin-right:10px;}.floating-profile {position:absolute;right:2%;bottom:90px;width:250px;text-align:center;}.floating-profile img {width:100%;bottom:30px;margin-bottom:-10px;}.floating-profile .profile-details {color:var(--text-secondary-color);font-size:0.9rem;}.profile-details h4 {color:white;font-size:1.1rem;margin:5px 0;}.footer-bottom {border-top:1px solid var(--border-color);padding-top:20px;display:flex;justify-content:center;align-items:center;text-align:center;}.footer-bottom .footer-social-icons {display:none;}.footer-bottom .footer-credit {color:var(--text-secondary-color);font-size:0.8rem;}@media (max-width:1200px) {.floating-profile {display:none;}}@media (max-width:768px) {.footer-content {grid-template-columns:1fr 1fr;text-align:center;}#footer-logo-col,#footer-contact-col {grid-column:1 / -1;display:flex;flex-direction:column;align-items:center;}.footer-bottom {flex-direction:column-reverse;gap:15px;}.footer-bottom .footer-social-icons {display:flex;gap:20px;font-size:1.2rem;}.footer-bottom .footer-social-icons a {color:var(--text-secondary-color);}}.go-to-top,.whatsapp-icon {position:fixed;bottom:30px;width:50px;height:50px;background-color:var(--primary-color);color:white;border-radius:50%;display:flex;justify-content:center;align-items:center;font-size:1.5rem;text-decoration:none;cursor:pointer;z-index:999;transition:opacity 0.3s,transform 0.3s,background-color 0.3s;opacity:0;pointer-events:none;}.go-to-top {right:30px;}.whatsapp-icon {left:30px;opacity:1;pointer-events:auto;background-color:#25D366;}.go-to-top.show {opacity:1;pointer-events:auto;}.go-to-top:hover {transform:scale(1.1);background-color:var(--secondary-color);}.whatsapp-icon:hover {transform:scale(1.1);background-color:#128C7E;}@keyframes fadeIn {from {opacity:0;}to {opacity:1;}}@keyframes slideInUp {from {opacity:0;transform:translateY(50px);}to {opacity:1;transform:translateY(0);}}@media (max-width:768px) {.welcome-text {font-size:1.8rem;}.section-title {font-size:2rem;}.navbar {width:95%;max-width:none;transition:transform 0.4s ease-out;}.navbar.hide {transform:translate(-50%,-150px);}.navbar ul {gap:10px;padding:0 10px;}.navbar ul li a {font-size:0.8rem;}section {padding:80px 5%;}#order-now {padding:80px 5%;}.portfolio-grid {grid-template-columns:1fr;}.project-cards-grid {grid-template-columns:1fr;}.about-details .info-section {display:flex;flex-direction:column;align-items:center;text-align:center;}.about-details .info-section ul {width:100%;max-width:350px;}.go-to-top {right:20px;bottom:20px;}.whatsapp-icon {left:20px;bottom:20px;}.order-card {padding:25px;}.form-row {flex-direction:column;align-items:stretch;gap:0;}.agreement-group {margin-bottom:20px;}.send-btn {margin-left:0;width:100%;text-align:center;}}.preloader {position:fixed;top:0;left:0;width:100%;height:100%;background-color:var(--bg-color);z-index:99999;display:flex;justify-content:center;align-items:center;transition:opacity 0.7s ease,visibility 0.7s ease;}.preloader.hidden {opacity:0;visibility:hidden;}.spinner {width:50px;height:50px;border:5px solid #444;border-top-color:var(--primary-color);border-radius:50%;animation:spin 1s linear infinite;}@keyframes spin {from {transform:rotate(0deg);}to {transform:rotate(360deg);}}#testimonials {padding:100px 10%;}.testimonials-slider {padding-bottom:50px;}.testimonial-card {-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);padding:30px;border-radius:15px;text-align:center;border:1px solid var(--border-color);}#testimonials .testimonial-card .client-photo {width:70px;height:70px;border-radius:50%;border:3px solid var(--primary-color);object-fit:cover;margin:0 auto 20px;}.rating {color:#fdd835;margin-bottom:15px;}.testimonial-text {color:var(--text-secondary-color);font-style:italic;line-height:1.7;margin-bottom:20px;min-height:120px;}.client-name {color:var(--text-color);font-weight:600;}.client-company {color:var(--primary-color);font-size:0.9rem;}.testimonials-slider .swiper-pagination-bullet-active {background-color:var(--primary-color);}.qr-popup {display:none;position:fixed;bottom:30px;right:30px;background:var(--card-bg-color);padding:20px;border-radius:15px;border:1px solid var(--border-color);box-shadow:0 10px 30px rgba(0,0,0,0.3);z-index:1001;text-align:center;width:220px;}@media (min-width:769px) {.qr-popup {display:block;animation:slideInUp 0.5s ease-out forwards;}}.qr-popup.hidden {animation:slideOutDown 0.5s ease-in forwards;}.qr-popup .qr-code-img {width:150px;height:150px;margin-bottom:10px;border-radius:10px;}.qr-popup p {margin:0;color:var(--text-secondary-color);font-weight:500;}.qr-popup .close-btn {position:absolute;top:5px;right:10px;font-size:1.8rem;color:var(--text-secondary-color);cursor:pointer;transition:color 0.3s ease;}.qr-popup .close-btn:hover {color:var(--text-color);}.initial-hide {display:none !important;}@keyframes slideInUp {from {transform:translateY(100%);opacity:0;}to {transform:translateY(0);opacity:1;}}@keyframes slideOutDown {from {transform:translateY(0);opacity:1;}to {transform:translateY(100%);opacity:0;visibility:hidden;}}.showcase-final-container {display:none;}@media (min-width:769px) {.showcase-final-container {display:flex;justify-content:center;align-items:center;position:absolute;top:80px;left:0;width:100%;z-index:501;}.line-segment {height:1px;width:120px;background-color:var(--border-color);}.button-wrapper {position:relative;margin:0 15px;}.showcase-button {display:block;padding:8px 30px;border-radius:50px;border:1px solid var(--border-color);background-color:var(--bg-color);color:var(--text-color);text-decoration:none;font-weight:500;transition:all 0.3s ease;}.showcase-card {position:absolute;top:calc(100% + 15px);left:50%;transform:translateX(-50%) translateY(20px);width:400px;-webkit-backdrop-filter:blur(30px);backdrop-filter:blur(20px);border:1px solid var(--border-color);border-radius:15px;box-shadow:0 15px 40px rgba(0,0,0,0.5);padding:20px;opacity:0;visibility:hidden;pointer-events:none;transition:all 0.4s cubic-bezier(0.25,0.8,0.25,1);}.button-wrapper:hover .showcase-card {opacity:1;visibility:visible;pointer-events:auto;transform:translateX(-50%) translateY(0);}.button-wrapper:hover .showcase-button {color:white;border-color:var(--secondary-color);box-shadow:0 0 25px rgba(0,132,255,0.5);}.card-pointer {position:absolute;top:-10px;left:50%;transform:translateX(-50%);width:0;height:0;border-left:10px solid transparent;border-right:10px solid transparent;border-bottom:10px solid #1A1A1A;}.card-content {display:flex;align-items:center;gap:15px;}.card-content img {width:100px;height:100px;object-fit:cover;border-radius:10px;flex-shrink:0;}.card-text h4 {font-size:1.2rem;color:white;margin-bottom:8px;}.card-text p {font-size:0.9rem;color:var(--text-secondary-color);line-height:1.6;}}#tsparticles {position:fixed;top:0;left:0;width:100%;height:100%;z-index:-1;}.skills-list {width:100%;max-width:700px;padding:0 15px;}.skill-bar {margin-bottom:25px;}.skill-info {display:flex;justify-content:space-between;margin-bottom:8px;color:var(--text-color);}.skill-name {font-weight:500;}.skill-percent {font-weight:600;}.progress-line {height:8px;width:100%;background-color:#333;border-radius:10px;position:relative;}.progress-line span {height:100%;width:0;background:linear-gradient(90deg,var(--primary-color),var(--secondary-color));border-radius:10px;position:absolute;top:0;left:0;transition:width 1.5s ease-in-out;}