*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;background-color:#f5f5f5;min-height:100vh;display:flex;flex-direction:column}html{scroll-behavior:smooth}.navbar{position:fixed;top:0;width:100%;height:50px;background-color:#fff;display:flex;justify-content:space-between;align-items:center;padding:0 20px;box-shadow:0 2px 5px #0000001a;z-index:1000}.nav-left{display:flex;align-items:center;gap:15px;transform:translate(-50px);transition:transform .5s ease}.nav-left.visible{transform:translate(0)}.nav-avatar{width:35px;height:35px;border-radius:50%;object-fit:cover;opacity:0;transition:opacity .5s ease}.nav-avatar.visible{opacity:1}.nav-title{color:#339;font-size:1.2rem;font-weight:700}.menu-icon{display:block;cursor:pointer;padding:5px;z-index:1001}.bar{width:25px;height:2px;background-color:#000;margin:6px 0;transition:all .3s ease}.menu-icon.active .bar:nth-child(1){transform:rotate(-45deg) translate(-5px,6px)}.menu-icon.active .bar:nth-child(2){opacity:0}.menu-icon.active .bar:nth-child(3){transform:rotate(45deg) translate(-5px,-6px)}.nav-menu{position:absolute;top:50px;right:0;background-color:#fff;width:200px;padding:15px 0;box-shadow:0 2px 5px #0000001a;border-radius:0 0 5px 5px;opacity:0;visibility:hidden;transform:translateY(-10px);transition:all .3s ease;list-style:none}.nav-menu.active{opacity:1;visibility:visible;transform:translateY(0)}.nav-menu li{list-style:none}.nav-menu li a{color:#339;text-decoration:none;padding:12px 25px;display:block;transition:all .3s ease}.nav-menu li a:hover,.nav-menu li a.active{background-color:#f5f5f5;color:#252578}.profile-section{padding:0 20px;background-color:#fff;height:100vh;display:flex;align-items:center;justify-content:center;position:relative}.profile-container{max-width:800px;width:100%;display:flex;flex-direction:column;align-items:center;text-align:center;gap:30px;padding-top:50px}.profile-avatar{width:150px;height:150px;border-radius:50%;overflow:hidden;border:4px solid #f5f5f5;box-shadow:0 4px 10px #0000001a}.profile-avatar img{width:100%;height:100%;object-fit:cover}.profile-info h1{font-size:2.5rem;color:#339;margin-bottom:10px}.profile-title{font-size:1.2rem;color:#666;margin-bottom:20px}.profile-description p{font-size:1.1rem;line-height:1.6;color:#444;margin-bottom:15px}.profile-description p:last-child{margin-bottom:0}.scroll-hint{position:absolute;bottom:40px;left:50%;transform:translate(-50%);text-align:center;color:#339;opacity:.8;animation:fadeInOut 2s infinite}.scroll-hint p{font-size:14px;margin-bottom:8px}.scroll-hint i{font-size:20px;animation:bounce 2s infinite}@keyframes bounce{0%,20%,50%,80%,to{transform:translateY(0)}40%{transform:translateY(-10px)}60%{transform:translateY(-5px)}}@keyframes fadeInOut{0%,to{opacity:.5}50%{opacity:1}}.carousel{padding:0;background-color:#f5f5f5;width:100%;display:flex;justify-content:center;min-height:60vh}.carousel-container{width:100%;max-width:1200px;height:450px;position:relative;margin:20px 40px;align-self:center;border-radius:10px;overflow:hidden;box-shadow:0 4px 10px #0000001a}.carousel-slide{position:absolute;width:100%;height:100%;opacity:0;transition:opacity .5s ease;display:flex;justify-content:center;align-items:center}.carousel-slide.active{opacity:1}.carousel-slide img{max-width:100%;max-height:100%;object-fit:contain}.carousel-button{position:absolute;top:50%;transform:translateY(-50%);background:rgba(255,255,255,.7);border:none;width:40px;height:40px;border-radius:50%;cursor:pointer;z-index:10;display:flex;align-items:center;justify-content:center;transition:all .3s ease}.carousel-button:hover{background:rgba(255,255,255,.9)}.carousel-button.prev{left:10px}.carousel-button.next{right:10px}.carousel-button i{color:#339;font-size:20px}.showcase-section{padding:40px;background-color:#fff}.showcase-container{max-width:1200px;margin:0 auto;display:flex;gap:40px;justify-content:center}.showcase-card{flex:1;max-width:500px;background-color:#fff;border-radius:15px;box-shadow:0 4px 20px #0000001a;padding:30px;transition:transform .3s ease}.showcase-card:hover{transform:translateY(-5px)}.card-header{display:flex;align-items:center;gap:15px;margin-bottom:20px}.card-header i{font-size:24px;color:#339}.card-header h2{font-size:1.8rem;color:#000;margin:0}.card-content{display:flex;flex-direction:column;gap:20px}.card-content p{font-size:1.1rem;line-height:1.6;color:#666}.card-button{display:inline-block;padding:12px 25px;background-color:#339;color:#fff;text-decoration:none;border-radius:25px;align-self:flex-start;transition:all .3s ease}.card-button:hover{background-color:#252578;transform:translateY(-2px)}.services-section{padding:60px 0;background-color:#f8f8f8}.services-container{max-width:1200px;margin:0 auto;padding:0 20px}.services-header{text-align:center;margin-bottom:50px}.services-header i{font-size:40px;color:#339;margin-bottom:20px}.services-header h2{font-size:2rem;color:#333;margin-bottom:15px}.services-header p{font-size:1.1rem;color:#666}.services-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:30px}.service-card{background:#ffffff;padding:30px;border-radius:15px;text-align:center;box-shadow:0 4px 15px #0000001a;transition:transform .3s ease}.service-card:hover{transform:translateY(-5px)}.service-card i{font-size:40px;color:#339;margin-bottom:20px}.service-card h3{font-size:1.5rem;color:#333;margin-bottom:15px}.service-card p{color:#666;line-height:1.6}.contact-price{text-align:center;margin-top:50px;padding:20px}.price-button{background-color:#339;color:#fff;border:none;padding:15px 40px;font-size:1.2rem;border-radius:30px;cursor:pointer;display:inline-flex;align-items:center;gap:10px;transition:all .3s ease;box-shadow:0 4px 15px #0000001a}.price-button:hover{background-color:#252578;transform:translateY(-3px)}.contact-price p{margin-top:15px;color:#666;font-size:1rem}.social-links{width:100%;height:100px;background-color:#f8f8f8;display:flex;justify-content:center;align-items:center;padding:0 60px;margin-top:auto}.social-icons{display:flex;gap:40px}.social-icon{color:#339;text-decoration:none;font-size:22px;transition:all .3s ease;padding:10px}.social-icon:hover{color:#00a8ff;transform:translateY(-3px)}.page-header{margin-top:50px;padding:60px 20px;background-color:#fff;text-align:center}.header-content{max-width:800px;margin:0 auto}.header-content i{font-size:40px;color:#339;margin-bottom:20px}.header-content h1{font-size:2.5rem;color:#339;margin-bottom:10px}.header-content p{font-size:1.2rem;color:#666}.life-content{padding:40px;background-color:#f5f5f5}.life-grid{max-width:1200px;margin:0 auto;display:grid;grid-template-columns:repeat(3,1fr);gap:20px;padding:20px}.life-item{background:#ffffff;border-radius:12px;overflow:hidden;box-shadow:0 4px 12px #0000001a;transition:all .3s ease}.life-item:hover{transform:translateY(-5px);box-shadow:0 8px 25px #00000026}.life-item img{width:100%;height:200px;object-fit:cover;transition:transform .3s ease;cursor:pointer}.life-item:hover img{transform:scale(1.05)}.life-item-info{padding:15px;background:linear-gradient(to bottom,#ffffff 0%,#f8f8f8 100%)}.life-item-info h3{font-size:1.1rem;color:#000;margin-bottom:8px;font-weight:600}.life-item-info p{color:#666;font-size:.9rem}.life-item-info .description{color:#666;font-size:.95rem;line-height:1.5;margin-top:10px;font-style:italic}.life-category{position:relative;max-width:1200px;margin:0 auto 30px;padding:0 20px;text-align:left}.life-category:not(:first-child){margin-top:80px;padding-top:40px}.life-category:not(:first-child):before{content:"";position:absolute;top:0;left:50%;transform:translate(-50%);width:100px;height:2px;background-color:#e0e0e0}.life-category h2{font-size:2rem;color:#000;margin-bottom:10px;font-weight:600;position:relative;display:inline-block}.life-category h2:after{content:"";position:absolute;bottom:-5px;left:0;width:100%;height:3px;background-color:#339;border-radius:2px}.life-category p{color:#666;font-size:1.1rem;font-style:italic}.life-subcategory{max-width:1200px;margin:40px auto 20px;padding:0 20px;text-align:left;position:relative}.life-subcategory:before{content:"";position:absolute;left:20px;top:50%;width:3px;height:20px;background-color:#339;transform:translateY(-50%)}.life-subcategory h3{font-size:1.5rem;color:#333;margin-bottom:5px;padding-left:15px}.life-subcategory p{color:#666;font-size:1rem;padding-left:15px}.portfolio-content{padding:40px;background-color:#f5f5f5;min-height:60vh}.portfolio-grid{max-width:1200px;margin:0 auto;display:grid;grid-template-columns:repeat(auto-fill,minmax(350px,1fr));gap:30px}.portfolio-item{background:#ffffff;border-radius:10px;padding:30px;box-shadow:0 4px 10px #0000001a;transition:transform .3s ease}.portfolio-item:hover{transform:translateY(-5px)}.portfolio-item h3{font-size:1.5rem;color:#000;margin-bottom:15px}.portfolio-item-desc{color:#666;line-height:1.6;margin-bottom:20px}.portfolio-item-tech{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:20px}.portfolio-item-tech span{background:#f0f0f0;padding:5px 12px;border-radius:15px;font-size:.9rem;color:#333}.portfolio-item-link{display:inline-block;padding:10px 20px;background-color:#339;color:#fff;text-decoration:none;border-radius:20px;transition:all .3s ease}.portfolio-item-link:hover{background-color:#252578;transform:translateY(-2px)}.back-to-top{position:fixed;right:30px;bottom:100px;width:40px;height:40px;background-color:#339;color:#fff;border:none;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;opacity:0;visibility:hidden;transition:all .3s ease;z-index:999;box-shadow:0 2px 10px #0003}.back-to-top.visible{opacity:1;visibility:visible}.back-to-top:hover{background-color:#252578;transform:translateY(-3px)}.floating-buttons{position:fixed;right:20px;bottom:100px;display:flex;flex-direction:column;gap:10px;z-index:1000}.back-to-home{height:45px;background-color:#339;color:#fff;border-radius:25px;display:flex;align-items:center;padding:0 20px;text-decoration:none;transition:all .3s ease}.back-to-home i{margin-right:8px;font-size:1.2rem}.back-to-home span{font-size:14px;white-space:nowrap}.back-to-home:hover{background-color:#252578;transform:translateY(-3px)}.qr-modal,.qq-modal,.phone-modal,.price-modal{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#000000b3;display:flex;justify-content:center;align-items:center;z-index:2000}.qr-container,.qq-container,.phone-container,.price-container{background-color:#fff;padding:30px 40px;border-radius:20px;text-align:center;position:relative;box-shadow:0 5px 20px #0003;max-width:90%}.qr-container img{width:300px;height:300px;object-fit:cover;border-radius:15px;margin-bottom:20px}.qr-container p{color:#333;font-size:18px;font-weight:500}.qq-number,.phone-number{font-size:2rem;color:#339;font-weight:700;margin:20px 0;user-select:all}.copy-qq,.copy-phone,.copy-price-phone{background-color:#339;color:#fff;border:none;padding:10px 25px;border-radius:25px;font-size:1rem;cursor:pointer;transition:all .3s ease}.copy-qq:hover,.copy-phone:hover,.copy-price-phone:hover{background-color:#252578;transform:translateY(-2px)}.copy-qq.copied,.copy-phone.copied,.copy-price-phone.copied{background-color:#28a745}.close-modal,.close-qq-modal,.close-phone-modal,.close-price-modal{position:absolute;top:12px;right:12px;background:#f5f5f5;border:none;border-radius:50%;width:32px;height:32px;cursor:pointer;display:flex;align-items:center;justify-content:center;color:#666;transition:all .3s ease}.close-modal:hover,.close-qq-modal:hover,.close-phone-modal:hover,.close-price-modal:hover{background:#e0e0e0;transform:rotate(90deg)}.price-content{display:flex;justify-content:space-around;align-items:center;margin:20px 0;gap:30px}.price-qr{flex:1;max-width:250px}.price-qr img{width:100%;height:auto;border-radius:10px;margin-bottom:10px}.price-phone{flex:1;padding:20px;background-color:#f5f5f5;border-radius:10px}.price-number{font-size:1.8rem;color:#339;font-weight:700;margin:15px 0;letter-spacing:1px}.price-tip{color:#666;margin-top:10px}.image-viewer{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#000000e6;display:flex;justify-content:center;align-items:center;z-index:2000}.close-viewer{position:absolute;top:20px;right:30px;color:#fff;font-size:40px;cursor:pointer;z-index:2001}#viewer-image{max-width:90%;max-height:80vh;object-fit:contain}.image-description{position:absolute;bottom:20px;left:0;width:100%;text-align:center;color:#fff;padding:10px;font-size:16px}.viewer-info{position:absolute;top:20px;left:50%;transform:translate(-50%);text-align:center;color:#fff;z-index:2001}.viewer-title{font-size:1.5rem;color:#fff;margin-bottom:5px}.viewer-date{font-size:1rem;color:#fffc}.viewer-prev,.viewer-next{position:absolute;top:50%;transform:translateY(-50%);background:rgba(255,255,255,.2);border:none;width:50px;height:50px;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;color:#fff;font-size:24px;transition:all .3s ease}.viewer-prev{left:30px}.viewer-next{right:30px}.viewer-prev:hover,.viewer-next:hover{background:rgba(255,255,255,.3)}.certificate-viewer{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#000000e6;display:flex;justify-content:center;align-items:center;z-index:2000}.certificate-viewer img{max-width:90%;max-height:90vh;object-fit:contain}.close-certificate{position:absolute;top:20px;right:30px;color:#fff;font-size:40px;cursor:pointer;z-index:2001;background:none;border:none}.timeline-nav{position:fixed;right:30px;top:50%;transform:translateY(-50%);background:rgba(255,255,255,.95);padding:15px;border-radius:10px;box-shadow:0 2px 10px #0000001a;z-index:100}.timeline-item{padding:10px;cursor:pointer;transition:all .3s ease;position:relative;border-left:3px solid transparent}.timeline-item:hover{border-left-color:#339;background-color:#f5f5f5}.timeline-date{display:block;font-size:.8rem;color:#666}.timeline-title{display:block;font-size:1rem;color:#333;font-weight:500}.timeline-subitems{margin-left:10px;margin-top:5px;display:none}.timeline-item:hover .timeline-subitems{display:block}.timeline-subitem{padding:5px 10px;font-size:.9rem;color:#666;cursor:pointer;transition:all .3s ease}.timeline-subitem:hover{color:#339;background-color:#f0f0f0}@media (max-width: 768px){.profile-avatar{width:150px;height:150px}.profile-info h1{font-size:2rem}.carousel-container{height:350px;max-width:90%}.carousel-button{width:30px;height:30px}.carousel-button i{font-size:16px}.showcase-container{flex-direction:column;gap:30px}.showcase-card{padding:20px}.card-header h2{font-size:1.5rem}.services-grid{grid-template-columns:1fr}.life-grid{grid-template-columns:repeat(2,1fr);gap:10px;padding:10px}.life-item img{height:150px}.life-item-info{padding:8px}.life-item-info h3{font-size:.8rem}.life-item-info p,.life-item-info .description{font-size:.7rem}.life-category h2{font-size:1.5rem}.life-subcategory h3{font-size:1.3rem}.portfolio-content{padding:20px}.portfolio-grid{grid-template-columns:1fr}.portfolio-item{padding:20px}.page-header{padding:40px 20px}.header-content h1{font-size:2rem}.header-content i{font-size:30px}.social-links{height:auto;padding:20px;flex-direction:column;gap:15px}.social-icons{gap:30px}.social-icon{font-size:20px;padding:8px}.timeline-nav{right:10px;padding:10px}.timeline-item{padding:8px}.timeline-date{font-size:.7rem}.timeline-title{font-size:.9rem}.timeline-subitem{font-size:.8rem;padding:4px 8px}.viewer-prev,.viewer-next{width:40px;height:40px;font-size:20px}.viewer-prev{left:15px}.viewer-next{right:15px}#viewer-image{max-height:50vh}.viewer-title{font-size:1rem}.image-description{font-size:12px}.price-content{flex-direction:column}.price-container{padding:20px}.qr-container img{width:250px;height:250px}.back-to-top{right:20px;bottom:90px;width:35px;height:35px}.back-home{right:20px;bottom:90px;padding:10px 16px}}.portfolio-category{display:inline-block;padding:4px 12px;background-color:#eef0ff;color:#339;font-size:.8rem;border-radius:12px;margin-bottom:12px;font-weight:500;letter-spacing:.5px}
