/* Header & Navigation */
header {position: fixed;width: 100%;top: 0;z-index: 1000;box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);}

/* Contact bar */
.contact-bar {background-color:rgba(0, 7, 36, 0.7);padding: 10px 2rem;display: flex;justify-content: space-between;align-items: center;flex-wrap: wrap;}
.contact-info-left > :nth-child(1),.contact-info-left > :nth-child(3) {display: none;}
.contact-info-left {color:#fff;font-size: 0.9rem;}
.contact-info-left div {align-items: center;}
.contact-info-left i {color: #ff9d4d;}
.contact-info-right{display: flex;gap:10px;margin-left: auto;}
.social-links-header { display: flex;gap: 15px;}
.social-links-header a {color: white;transition:0.3s;}
.social-links-header a:active {color: #ff9d4d;}

.header-container.fixed {position:fixed;top:0;background: rgba(0, 51, 102, 1);box-shadow: 0 5px 20px rgba(0, 0, 0, 0.1);}
.header-container {background-color: rgba(0, 34, 112, 0.8);display: flex;justify-content: space-between;align-items: center;padding: 15px 2rem;}
.logo {display: flex;align-items: center;color: white;text-decoration: none;font-size:2rem;font-weight: 700;}
.logo i {color: var(--accent);margin-right: 10px;font-size: 28px;}

.nav-menu {display: flex;list-style: none;position: absolute;top: 70px;left: 0;background: var(--primary-dark);width: 100%;flex-direction: column;align-items: center;padding: 20px 0;clip-path: polygon(0 0, 100% 0, 100% 0, 0 0);transition: var(--transition);z-index: 1000;}
.nav-menu.active { display: block;clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);}
.nav-menu li {position: relative;margin: 15px 0;width: 100%;}
.nav-menu a {color: white;text-decoration: none;font-weight: 500;font-size: 1rem;transition: var(--transition);position: relative;padding: 8px 0;display: block;width: 100%;padding-left: 30px;padding-right: 30px;}
.sub-menu {list-style: none;transition: max-height 0.4s ease;max-height: 0;overflow: hidden;}
.nav-menu > li.has-submenu.active-submenu .sub-menu {max-height: 500px;}
.sub-menu li{padding: 0 30px 0 30px;;}
.sub-menu li a {display: flex;align-items: center;text-decoration: none;color: #ecf0f1;border-bottom: 1px solid rgba(255, 255, 255, 0.05);transition: all 0.2s ease;font-size: 1rem;}
.sub-menu li a:hover {color:var(--accent);}
.sub-menu li a i {margin-right: 12px;width: 20px;text-align: center;font-size: 0.9rem;}
.submenu-toggle {position: absolute;right: 20px; top: 30px;  transform: translateY(-50%); width: 40px; height: 40px; display: flex;justify-content: center;align-items: center;cursor: pointer;transition: var(--transition);z-index: 10; }
.submenu-toggle::after {content: '';display: block;width: 0;height: 0;border-left: 5px solid transparent;border-right: 5px solid transparent;border-top: 8px solid #ecf0f1;transition: transform 0.3s ease;}
.nav-menu > li.has-submenu.active-submenu .submenu-toggle::after {transform: rotate(180deg);}
.nav-menu > li.has-submenu > a {padding-right: 60px;}

.hamburger {display: block;cursor: pointer;}
.hamburger div {width: 25px;height: 3px;background: white;margin: 5px;transition: var(--transition);}
.hamburger.active div:nth-child(1) {transform: rotate(-45deg) translate(-5px, 6px);}
.hamburger.active div:nth-child(2) {opacity: 0;}
.hamburger.active div:nth-child(3) {transform: rotate(45deg) translate(-5px, -6px);}

/* Carousel Section */
.carousel {height: 500px;width: 100%;overflow: hidden;position: relative;}
.carousel-inner {position: relative;width: 100%;height: 100%;}
.carousel-item {position: absolute;top: 0;left: 0;width: 100%;height: 100%;opacity: 0;transition: opacity 1s ease-in-out;background-size: cover;background-position: center;display: flex;align-items: center;}
.carousel-item.active {opacity: 1;}
.carousel-item img{width: 100%;height: 100%;object-fit: cover;object-position:70% center;}

.carousel-content{position: absolute;left: 0;width: 90%;height: 500px;padding: 0 50px;display: flex;flex-direction: column;justify-content: center;text-align: center;color:#4e4e4e;margin: 0 auto;}
.carousel-content h1 {font-size: 1.3rem;margin-top:20px;text-transform: uppercase;letter-spacing: 1px;text-align:left;}
.carousel-content-detail{text-align:left;}
.carousel-content p {display:none;}
.carousel-content-btns {position: absolute;bottom: 80px;left:50px;display: flex;justify-content: center;gap: 20px;}
.carousel-content-btns a{width: 39vw;text-align: center;padding: 0.6rem;}
.carousel-content-btns .btn-outline{display: none;}

.carousel-controls {position: absolute;bottom: 30px;left: 50%;transform: translateX(-50%);display: flex;gap: 10px;}
.carousel-dot {width: 12px;height: 12px;border-radius: 50%;background-color: rgba(255,255,255,0.5);cursor: pointer;transition: background-color 0.3s;}
.carousel-dot.active {background-color: #ff9d4d;}

/* Products Section */
.products {background-color: var(--light);}
.products-container {display: flex;gap: 30px;}
.product-categories {border-radius: 8px;padding:0;margin-bottom: 20px;}
.category-list {display: flex;list-style: none;justify-content: center;flex-wrap: wrap;}
.categorylists {padding: 10px;border-radius: 4px;cursor: pointer;transition: var(--transition);margin-left: 15px;background: #ffffff;}
.categorylists:hover, .categorylists.active {background: var(--accent );color: white;}
.pro-category{background:var(--light);}
.products-grid {display: none;}
.products-grid.active {flex: 1;display: grid;grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));gap: 25px;}
.product-card {display: flex;background: white;border-radius: 8px;overflow: hidden;box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);transition: var(--transition);}
.product-img {position: relative;width: 40%; display: flex;align-items: center;justify-content: center;overflow: hidden;}
.product-img img {width: 100%;height: 100%;object-fit: cover;transition: transform 0.5s ease;padding:10px;}
.product-info {width: 60%;padding: 20px;display: flex;flex-direction: column;justify-content: center;}
.product-info p {margin-bottom: 10px; font-weight:500;}
.product-info p a {display:block;text-decoration: none;color:#000;}
.product-info p a:hover{color:var(--accent)}
.product-tags {display: flex;flex-wrap: wrap;gap: 8px;margin-bottom: 15px;justify-content: left;align-items: center;}
.product-tag {background: #f5f5f5;color: #666;padding: 5px 12px;border-radius: 15px;font-size: 0.8rem;font-weight: 500;border: 1px solid #e0e0e0;}
.list-btn{text-align: left;}  
.list-btn a{padding:5px 10px;font-size:0.8rem;}

/* Features Section */
.features{background-image: url(../images/banner-bg.jpg);background-size: cover;background-position: center;background-repeat: no-repeat;position: relative;min-height: 390px;color:white;}
.features::before {content: '';position: absolute;top: 0;left: 0;width: 100%;height: 100%;background: rgba(0, 51, 102, 0.9);z-index: 1;}
.features > * {position: relative;z-index: 2;}
.features-container {align-items: center;}
.features-list{display:flex;justify-content:center;flex-wrap: wrap;gap: 25px;}
.feature-item {display:flex;width: 100%;flex-direction:column;align-items: center;text-align: center;min-width: 140px;}
.feature-icon {width: 60px;height: 60px;background:rgba(255,255,255,0.9);border-radius: 50%;display: flex;align-items: center;justify-content: center;flex-shrink: 0;color: var(--accent);font-size: 1.5rem;}
.feature-content{margin-top:10px;}
.feature-content h3 {margin-bottom: 8px;font-weight:600;}
.feature-content p{color:rgba(255,255,255,0.9)}

/* Application Cases Section */
.cases-container {display: grid;grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));gap: 30px;}
.case-card {background: white;border-radius: 8px;overflow: hidden;box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);transition: var(--transition);}
.case-card img {width: 100%;height: 220px;object-fit: cover;}
.case-img {height: 220px;;display: flex;align-items: center;justify-content: center;position: relative;}
.industry-tag {position: absolute;top: 15px;right: 15px;background: var(--accent);color: white;padding: 5px 15px;border-radius: 20px;font-size: 0.8rem;font-weight: 500;}
.case-info {padding: 25px;}
.case-info a {color:var(--dark);margin-bottom: 10px;font-weight: bold;font-size: 1.17em;text-decoration:none}
.case-info p {color: var(--gray);margin-bottom: 15px;font-size: 0.95rem;}
.home-btn{text-align: center;margin:2rem auto 0 auto}

/*testing section*/
.test {background-color: var(--light);display: flex;gap: 30px;}
.testing-container{display: grid;grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));gap: 25px;padding-bottom: 30px;}
.testing-slide{display: flex;background: white;border-radius: 8px;overflow: hidden;box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);transition: var(--transition);}
.testing-slide video{width:50%;}
.testing-info{padding: 10px 15px 20px 15px;align-content: center; min-height: 150px}
.testing-info h3{margin-bottom: 10px;}

/* Testimonials Section */
.testimonials {background: linear-gradient(to right, var(--primary-dark), var(--primary-medium));color: white;}
.testimonials .section-title:after {background: var(--accent);}
.testimonials-container {display: grid;grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));gap: 30px;}
.testimonial-card {background: rgba(255, 255, 255, 0.1);padding: 30px;border-radius: 8px;backdrop-filter: blur(10px);transition: var(--transition);}
.testimonial-text {font-style: italic;margin-bottom: 20px;position: relative;}
.testimonial-text:before,
.testimonial-text:after {content: '"';font-size: 3rem;color: var(--accent);position: absolute;}
.testimonial-text:before {top: -20px;left: -25px;}
.testimonial-text:after {content: '"';bottom: -40px;right: -10px;}
.client-info {display: flex;align-items: center;gap: 15px;}
.client-avatar {width: 50px;height: 50px;border-radius: 50%;overflow: hidden;background-color:var(--accent);display: flex;align-items: center;justify-content: center;font-weight: bold;color:#fff;}
.client-details h4 {margin-bottom: 5px;}
.client-details p {font-size: 0.9rem;}

/* Certifications Section */
.certifications {display:none;background-color:#fff;}
.certs-container {display: grid;grid-template-columns: repeat(auto-fit, minmax(40%, 1fr));gap: 1.5em;padding-bottom: 30px;}
.cert-card {background: white;border-radius: 8px;padding: 15px;text-align: center;box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);transition: var(--transition);}
.cert-img {display: flex;align-items: center;justify-content: center;margin: 0 auto 20px;}
.cert-img img{width: 100%;height: auto;}
.cert-content h3 {color: var(--primary-dark);margin-bottom: 15px;}
.cert-content p {color: var(--gray);font-size: 0.95rem;}

/* About Section */
.about{background-color:var(--light);}
.about-container{margin-top: 2rem;margin-bottom:3rem;}
.about-content {margin-top: 30px;}
.about-content h2,.factory-gllery{font-size:1.3em;margin-bottom: 20px;border-bottom:1px solid #DCDCDC;padding-bottom:10px;}
.about-content p {font-size:18px;margin-bottom: 30px;text-align: justify;word-spacing: -0.05em;}
.about-img{display:none;position: relative;width: 100%; overflow: hidden;text-align: center;border-radius:8px;box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);}
.about-img img{width:100%;height:100%;object-fit: cover;}
.about-img video{width: 70%;height: 100%;object-fit: cover;}


/* factory-numbers */
.factory-numbers{padding:0;background:white;}
.milestones {display:flex;justify-content:center;flex-wrap: wrap;gap: 25px;margin:60px 0 50px 0; }
.milestone-item {display: flex;width: 45%;flex-direction:row;align-items: center;min-width: 140px;gap:10px;}
.milestone-icon {width: 50px;height: 50px;border-radius: 50%;display: flex;align-items: center;justify-content: center;background:white;color: var(--accent);font-size: 1.2rem;flex-shrink: 0;}
.milestone-text h3 {margin-bottom:0;font-size:1.5rem;}
.milestone-text p{font-size:0.9em;color: var(--gray);}

/* Factory */
.factory-showcase {width: 100%;position: relative;display: flex;align-items: center;justify-content: space-between;margin-top:30px;}
.showcase-container {flex: 1;overflow: hidden;}
.showcase-track {display: flex;transition: transform 0.5s ease;gap: 15px;}     
.factory-item {border-radius: 8px;overflow: hidden;box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);background: #fff;transition: transform 0.3s ease, box-shadow 0.3s ease;flex-shrink: 0;width: calc(100% - 15px);min-height: 160px; }
.factory-item:hover {transform: translateY(-5px);box-shadow: 0 8px 15px rgba(0, 0, 0, 0.15);}
.factory-image {width: 100%;height: 160px;object-fit:cover;display: block;border-bottom: 1px solid #f0f0f0;}
.factory-info {padding: 12px;background: #fff;}
.factory-name {font-weight: 600; margin-bottom: 6px;color: #333;}
.factory-desc {font-size: 13px;color: #666;line-height: 1.4;}
.showcase-nav {width: 30px;height: 30px;background: rgba(255, 255, 255, 0.8);border-radius:50%;border: none;cursor: pointer;display: flex;align-items: center;justify-content: center;z-index: 10;transition: opacity 0.3s ease;flex-shrink: 0;position: absolute; top: 50%;transform: translateY(-50%);box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);}
.showcase-nav:hover {background: rgba(255, 255, 255, 0.95); box-shadow: 0 3px 8px rgba(0, 0, 0, 0.3); }
.nav-icon {width: 10px;height:10px;border: solid #333;border-width: 0 2px 2px 0;display: inline-block;} 
.prev .nav-icon {transform: rotate(135deg);}
.next .nav-icon {transform: rotate(-45deg);}
.showcase-nav.prev {left: 15px; }
.showcase-nav.next {right: 15px; }

/*CTA*/
.cta-content{background-image: url(../images/global-map.png);background-size: cover;background-position: center;background-repeat: no-repeat;}
.cta-container{text-align:center;font-size:1.17em;}
.cta-description{margin-bottom:30px;line-height:1.6;}
.cta-features{display:flex;justify-content:center;margin-bottom:30px;flex-wrap: wrap;gap: 25px;}
.cta-feature {display:flex;width: 45%;flex-direction:column;align-items: center;text-align: center;min-width: 140px;}
.cta-feature-text{margin-top:10px;font-size:1em;font-weight:500;}
.cta-icon {width: 60px;height: 60px;background: rgba(0, 102, 178, 0.1);border-radius: 50%;display: flex;align-items: center;justify-content: center;flex-shrink: 0;color: var(--accent);font-size: 1.5rem;}
.cta-whatsapp-button {display: inline-flex;align-items: center;gap: 12px;background: linear-gradient(135deg, #FF7A00 0%, #FF9A42 100%);color: white;padding: 16px 32px;font-size: 1.1rem;font-weight: 600;border-radius: 50px;text-decoration: none;transition: all 0.3s ease;box-shadow: 0 4px 15px rgba(255, 122, 0, 0.3);margin-top: 10px;}
.cta-whatsapp-button:hover {transform: translateY(-3px);box-shadow: 0 6px 20px rgba(255, 122, 0, 0.4);}

/* Footer */
footer {background: var(--primary-dark);color: white;padding: 60px 0 30px;}
.footer-container > div:not(:first-child){display: none;}
.footer-container{margin-bottom: 1rem;}
.footer-col h3 {position: relative;padding-bottom: 15px;margin-bottom: 20px;color: white;}
.footer-col h3:after {content: '';position: absolute;bottom: 0;left: 0;width: 50px;height: 3px;background: var(--accent);}
.footer-links {list-style: none;}
.footer-links li {margin-bottom: 12px;}
.footer-links a {color: #ccc;text-decoration: none;transition: var(--transition);}
.footer-links a:active {color: var(--accent);padding-left: 5px;} 
.contact-info {list-style: none;}
.contact-info li {display: flex;gap: 15px;margin-bottom: 15px;align-items: flex-start;}
.contact-info li a{color: #fff;text-decoration:none;}
.contact-info i {color: var(--accent);margin-top: 5px;}
.social-links {display: flex;gap: 15px;margin-top: 20px;}
.social-links a {display: flex;align-items: center;justify-content: center;width: 40px;height: 40px;background: rgba(255, 255, 255, 0.1);border-radius: 50%;color: white;transition: var(--transition);text-decoration: none;}
.social-links a:active{background: var(--accent);} 
.copyright {text-align: center;padding-top: 30px;border-top: 1px solid rgba(255, 255, 255, 0.1);color: #aaa;font-size: 0.9rem;}

/*section-header*/
.section-container{width: 100vw;height: 100vh;}
.header-container-sec {background-color: rgba(0, 51, 102, 1);display: flex;justify-content: space-between;align-items: center;padding: 15px 2rem;}
.section-header {height: 200px;width: 100%;overflow: hidden;background: var(--light);margin-top: 68px;}
.section-header img{width: 100%;height: 100%;object-fit: cover;object-position: center;}
.overlay{position: absolute;top: 0;left: 0;width: 100%;height: 200px;display: flex;flex-direction: column;justify-content: center;align-items: center;text-align: center;padding: 30px;margin-top: 68px;color: white;background: rgba(0, 0, 0, 0.4);}

/*banner-breadcrumbs*/
.banner-breadcrumbs {background:#FAFAFA;width: 100%;padding: 18px 30px;justify-content: space-between;align-items:center;}

.search-home-container {position: relative;display: flex;justify-content: center;text-align: center;}
.search-form-wrapper-small {width: 100%;}
.search-form-wrapper-small form {display: flex;flex-direction: column;}
.search-form-wrapper-small input[type="text"] {width:230px;padding: 4px 10px;border: 1px solid #e0e0e0;font-size:0.9em;outline: none;background: #fff;box-sizing: border-box;transition: border-color 0.3s ease;}
.search-form-wrapper-small input[type="text"]:focus {border-color: #1a73e8}
.search-form-wrapper-small input[type="submit"] {padding: 5px 10px;border: none;background: linear-gradient(to right, #ff6b00, #ff3c00);color: white;font-size: 0.9em;font-weight: 500;cursor: pointer;transition: background 0.3s ease;}
.search-form-wrapper-small input[type="submit"]:hover {background: linear-gradient(to right, #ff3c00, #ff6b00);}

.breadcrumbs-home-container{display:none;}
.breadcrumbs-home-container li span{color:var(--gray);font-size:1em;}
.breadcrumbs-home-container li > span:last-child {display: inline-block;max-width: 150px;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;vertical-align: bottom;}
.breadcrumbs-home-container a{text-decoration: none;color:var(--gray);font-size:1em;}
.breadcrumbs-home-container a:active{color:var(--primary-dark) ;}

/* Sidebar Styles */
.sidebar{display:none;}
.sidebar h3,.sidebar-title {font-size: 1.1rem;margin-top: 0;color: #222;padding-bottom: 10px;border-bottom: 1px solid #eee;position: relative;}
.detail-category-list {list-style: none;padding: 0;margin: 0;}
.detail-category-list li {padding: 10px 0;cursor: pointer;transition: color 0.3s;border-bottom: 1px solid #DCDCDC}
.detail-category-list li a {text-decoration: none;color: #000;}

.sidebar-menu,.sidebar-recommended{background: #fcfcfc;padding: 20px;margin-bottom: 20px;}
.sidebar h3::after,.sidebar-title::after {content: '';position: absolute;bottom: -2px;left: 0;width: 80px;height: 3px;background:var(--accent)}
.sidebar-title{font-weight: bold;}
.sidebar-prolist li{display: flex;align-items: center;margin-top: 1em;}
.sidebar-prolist li:active a{color: var(--accent);}
.sidebar-prolist li>a{flex: 0 0 30%;;overflow: hidden;}
.sidebar-prolist li div>a{text-decoration: none;color: #000;font-weight: bold;}
.sidebar-prolist li div{flex: 1;padding-left: 6px;overflow: hidden;}
.sidebar-prolist li img{width: 80px;}

/*Product-detail*/
.container_product {display: flex;flex-wrap: wrap;margin: 2rem auto;gap: 20px;}
.main-content {flex: 1;min-width: 0;}
.product-container {display: flex; flex-direction: column;}
.carousel-container {flex: 1;position: relative;border-radius: 8px;}
.main-carousel {position: relative;overflow: hidden;}
.carousel-slide {display: none;width: 100%;}
.carousel-slide.active {display: block;}
.carousel-slide video,.carousel-slide img {width: 100%;height: auto;display: block;}
.carousel-btn {position: absolute;top: 50%;transform: translateY(-50%);background: rgba(0,0,0,0.2);color: white;border: none;width: 40px;height: 40px;display: flex;align-items: center;justify-content: center;cursor: pointer;border-radius: 50%;font-size: 1.125rem;z-index: 10;}
.carousel-btn.prev {left: 20px;}
.carousel-btn.next {right: 20px;}

.thumbnail-nav {display: flex;gap: 10px;padding: 15px;justify-content: center;background: #f8f8f8;border-radius: 0 0 8px 8px;}
.thumbnail {width: 80px;height: 80px;border-radius: 4px;overflow: hidden;cursor: pointer;border: 2px solid transparent;transition: all 0.3s;}
.thumbnail.active {border-color: #0066cc;}
.thumbnail img {width: 100%;height: 100%;object-fit: cover;}

.spec-section {flex: 0 0 60%;background: #fff;margin-left: auto;padding-top: 20px;border-radius: 8px;}
.spec-section h1 {font-size: 1.5rem;margin-top: 0;color: #222;}

.spec-table p {line-height:2em;}
.spec-section-btn{display: flex;}
.spec-section-btn a{text-decoration:none;color: #fff;}
.buy-btn {padding: 12px;margin-right: 10px;margin-top:20px;background-color: var(--accent);color: white;border: none;border-radius: 4px;font-size: 16px;cursor: pointer;transition: background-color 0.3s;}
.buy-btn:active {background-color:var(--accent-light);}

.detail-tabs {background: #fff;border-radius: 8px;}
.tab-header.fixed {position: fixed;top: 80px;;left: 0;right: 0;z-index: 100;box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);padding:0;margin: 0;border-radius: 0;animation: slideDown 0.3s ease;}
.tab-header {display: flex;border-bottom: 1px solid #ddd;margin-bottom: 20px;margin-top: 20px;background: white;transition: all 0.3s ease;}
.tab-btn {padding:10px;cursor: pointer;border-bottom: 3px solid transparent;font-weight: 500;transition: all 0.3s ease;}
.tab-btn.active {border-bottom: 3px solid #4a6cf7;background: rgba(74, 108, 247, 0.05);}
.tab-btn:hover {color: #4a6cf7;background: rgba(74, 108, 247, 0.05);}
.tab-btn a{text-decoration: none;color: #000;}
.tab-pane h2 {margin-top: 20px;color: #222;font-size: 1.25rem;}
.tab-pane p{margin-top: 20px;margin-bottom: 30px;}
.related-product h2{font-size: 1.25rem;}

.post-meta-bottom {border-bottom:1px solid #e5e5e5;color: rgba(0, 0, 0, .5);padding-bottom: 10px;margin-top: 30px;margin-bottom: 5px;}
.tags {display:none;}
.tags a{background:rgba(0, 0, 0, .04);color: rgba(0, 0, 0, .5);border-radius:3px;text-decoration:none;padding: 5px;}
.tags a:active {background-color: #666;color:#fff;border-radius:3px;padding: 5px;} 

.post-prev-next{background-color: #fcfcfc;padding:10px;margin-top: 20px;color: rgba(0, 0, 0, .5);border-radius: 3px;}
.post-prev-next a{color: rgba(0, 0, 0, .5);text-decoration: none;}
.post-prev-next a:active{color: #000;}

/*caseslist*/
.case-grid {display: grid;grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));gap: 2rem;}
.case-content {padding: 1.5rem;}

/*newslist*/
.blog-grid {display: grid;grid-template-columns: 1fr;gap: 2rem;padding-bottom:10px;}
.blog-card {display: flex;flex-direction: row;width: 100%;border-radius: 8px;overflow: hidden;box-shadow: 0 2px 10px rgba(0,0,0,0.05);transition: transform 0.3s ease;}
.blog-img {position: relative;width: 30%; display: flex;align-items: center;justify-content: center;overflow: hidden;}
.blog-img img {width: 100%;height: 100%;object-fit: cover;transition: transform 0.5s ease;}
.blog-content {width: 70%;padding: 20px;display: flex;flex-direction: column;justify-content: center;}
.blog-content a{margin-top: 10px;}
.blog-content h3{line-height: 1.5;border-bottom: 1px solid var(--light);}
.blog-content p {margin-bottom: 15px;display: -webkit-box;-webkit-box-orient: vertical;line-clamp:2;-webkit-line-clamp: 2;overflow: hidden;text-overflow: ellipsis;}

/*pagination*/
.pagination {display: flex;justify-content: center;margin:0;}
.nav-links {display: flex;flex-wrap: wrap;gap: 0.5rem;justify-content: center;align-items: center;}
.page-numbers {display: flex;align-items: center;justify-content: center;min-width: 2.8rem;height: 2.8rem;padding: 0 0.5rem;text-decoration: none;font-weight: 500;font-size: 1rem;color:#666;background:#eee;transition: all 0.2s ease;}
.page-numbers:hover {background:#f60;color: white;}
.page-numbers.current {background: #f97316;color: white;font-weight: 600;}
.page-numbers.dots {border: none;background: transparent;color:#666;min-width: auto;}
.page-numbers.dots:hover {background: transparent;color:#666;transform: none;}
.page-numbers.prev, .page-numbers.next {padding: 0 1rem;font-weight: 600;min-width: 6rem;}

/*content-detail*/
.content-detail{width:100%;border-radius: 8px;overflow: hidden;transition: transform 0.3s ease;padding:0;}
.content-detail h1{border-bottom: 1px olid #e5e5e5;padding-bottom: 10px;}
.content-detail-meta{color:var(--gray);padding-bottom:5px;border-bottom: 1px solid #e5e5e5;margin-bottom:20px;}
.category{margin-left: 15px;}
.content-detail-meta a{text-decoration: none;color:var(--gray)}
.content-news p{overflow-wrap: break-word;}
.content-news ul{list-style-type:disc;}
.content-news p,li{margin-bottom: 15px;margin-top: 15px;}
.content-news h3{margin-bottom: 30px;margin-top: 20px;}

/* About us */
.overview-content { align-items: center;}
.overview-text {flex: 1;}
.overview-text p{margin-bottom: 20px;}

/* Contact Section */
.sec-contact {border-radius: 12px;box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);;overflow: hidden;margin: 2rem auto;}
.sec-contact-info {flex: 1;background-color:#e5e5e5; color:#000;padding: 60px 40px;}
.sec-contact-header h2,.form-header h2 {font-size: 2rem;margin-bottom: 15px;font-weight: 700;position: relative;}
.sec-contact-header h2:after,.form-header h2:after {content: '';position: absolute;bottom: -10px;left: 0;width: 70px;height: 4px;background: #ff6b00;border-radius: 2px;}
.sec-contact-header p,.form-header p {font-size: 1.1rem;margin: 25px 0 40px;max-width: 500px;opacity: 0.9;color: #666;}

.sec-info-item {display: flex;margin-bottom: 30px;align-items: flex-start;}
.sec-info-item i {font-size: 1.5rem;margin-right: 20px;min-width: 24px;color: #ff6b00;}
.sec-info-content h3 {font-size: 1.3rem;margin-bottom: 8px;font-weight: 600;}
.sec-info-content p {font-size: 1.05rem;opacity: 0.9;}

.contact-form {flex: 1.2;padding: 60px 50px;}
.form-group { margin-bottom: 25px;}
.form-group label {display: block; margin-bottom: 8px; font-weight: 500;color: #444;}
.form-control { width: 100%;padding: 15px;border: 2px solid #e0e0e0;border-radius: 8px;font-size: 1rem;transition: all 0.3s ease;}
.form-control:focus {border-color: #1a73e8;outline: none;box-shadow: 0 0 0 3px rgba(26, 115, 232, 0.1);}
textarea.form-control {min-height: 150px;resize: none;}
.form-row {display: flex;gap: 20px;}
.form-row .form-group {flex: 1;}
#submit-btn {background: linear-gradient(to right, #ff6b00, #ff3c00);color: white;border: none;padding: 16px 40px;font-size: 1.1rem;font-weight: 600;border-radius: 8px;cursor: pointer;transition: all 0.3s ease;display: inline-block;text-transform: uppercase;letter-spacing: 1px;box-shadow: 0 4px 15px rgba(255, 107, 0, 0.3);}
#submit-btn:hover {background: linear-gradient(to right, #ff3c00, #ff6b00);transform: translateY(-3px);}
#submit-btn:active {transform: translateY(0);}
button:disabled {background-color: #666;cursor: not-allowed;}
.form-message {padding: 12px;border-radius: 6px;margin-top: 20px;display: none;}
.success {background-color: #e8f5e9;color: var(---primary-medium);border: 1px solid #c8e6c9;}
.error {background-color: #ffebee;color: var(--accent);border: 1px solid #ffcdd2;}
.loading {display: none;text-align: center;margin-top: 15px;}
.spinner {border: 3px solid #f3f3f3;border-top: 3px solid var(--gray);border-radius: 50%;width: 24px;height: 24px;animation: spin 1s linear infinite;margin: 0 auto;} 
@keyframes spin {0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); }}

/*contact-sidebar*/
.contact-sidebar{ position: fixed; bottom: 0; left: 0; width: 100%; display: flex; justify-content: center;  align-items: center; padding: 15px; z-index: 1000;background: var(--accent);}
.contact-sidebar p {padding: 0;line-height: 1;position: relative;width: 100%;text-align: center;}
.contact-sidebar p:last-child {border-bottom: none;}
.contact-sidebar p a {color: #fff;display: block;padding: 10px;text-decoration: none; margin: 0 auto;}
.contact-item {position: relative;cursor: pointer;display: flex;align-items: center;justify-content: center;width: 40px;height: 40px;border-radius: 50%;transition: all 0.3s ease;}
.contact-item i {font-size: 2rem;}
.contact-sidebar span {padding: 8px 15px;height: 80%;font-weight: 500;white-space: nowrap;position: absolute;top: -50%;right: -100%;transform: translateY(-30%);z-index: -1;opacity: 0;display: flex;justify-content: center; align-items: center;font-size: 0.8em;background:var(--gray);color: #fff;border-radius: 6px;pointer-events: none;transition: all 0.3s ease;box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);}
.contact-sidebar span:after {content: " ";position: absolute;top: 50%;margin-top: 15px;width: 0;height: 0;border-color: transparent;border-style: solid;border-width: 5px 5px 5px 5px;border-top-color: var(--gray);}
.contact-sidebar p.active span {opacity: 1;z-index: 1;bottom: calc(100% );transform: translateY(0);pointer-events: auto;}

/*privacy*/
.privacy-consent {display: flex;flex-direction: row;align-items: flex-start;gap: 8px;}
.privacy-consent input[type="checkbox"] {flex-shrink: 0;margin-top:8px;}

.cookie-consent-banner {position: fixed;bottom: 0;left: 0;right: 0;background: #f3f3f3;padding: 1rem;box-shadow: 0 -4px 12px rgba(0, 0, 0, 0.15);z-index: 10000;font-size: 0.9rem;display: none;}  
.cookie-consent-content {display: flex;flex-direction: column;gap: 1rem;max-width: 100%;}
.cookie-consent-text {line-height: 1.5;}
.cookie-consent-text a {color: #3498db;text-decoration: underline;font-weight: 500;}
.cookie-consent-buttons {display: flex;flex-direction: column;gap: 0.75rem;}
.cookie-consent-button {padding: 0.8rem 1.2rem;border: none;border-radius: 6px;cursor: pointer;font-weight: 600;font-size: 0.95rem;transition: all 0.2s ease;text-align: center;}  
.cookie-consent-accept {background-color: #007bff;color:#fff;}
.cookie-consent-accept:hover,.cookie-consent-accept:focus {background-color:  #007bff;transform: translateY(-2px);}
.cookie-consent-reject {border:1px solid #007bff;color: #007bff;}
.cookie-consent-reject:hover,.cookie-consent-reject:focus {background-color: #007bff;color: #fff;transform: translateY(-2px);}

/*404*/
.page-content {text-align: center;}
.page-content p {font-size: 16px;color: #555;margin-bottom: 25px;line-height: 1.5;}
.search-form-wrapper {width: 100%;margin: 30px auto 30px;}
.search-form-wrapper form {display: flex;flex-direction: column;gap: 12px;}
.search-form-wrapper input[type="text"] {width: 50%;padding: 14px 16px;border: 2px solid #e0e0e0;border-radius: 8px;font-size: 16px;outline: none;background: #fff;box-sizing: border-box;transition: border-color 0.3s ease;}
.search-form-wrapper input[type="text"]:focus {border-color: #1a73e8}
.search-form-wrapper input[type="submit"] {padding: 14px 20px;border: none;border-radius: 8px;background: linear-gradient(to right, #ff6b00, #ff3c00);color: white;font-size: 1.1em;font-weight: 500;cursor: pointer;transition: background 0.3s ease;}
.search-form-wrapper input[type="submit"]:hover {background: linear-gradient(to right, #ff3c00, #ff6b00);}

/*tag-cloud*/
.all-tags{background-color:var(--light);}
.tag-cloud {display: flex;flex-wrap: wrap;gap: 10px;justify-content: center;margin: 20px 0;}
.tag-cloud a {display: inline-block;padding: 8px 15px;background: #fff;color: #1a73e8;text-decoration: none;border-radius: 20px;font-size: 14px;transition: all 0.3s ease;border: 1px solid #d1e5fa;}
.tag-cloud a:hover {background: #1a73e8;color: white;transform: translateY(-2px);box-shadow: 0 4px 8px rgba(3, 102, 214, 0.3);}

/*tag-page*/
.tag-more-content{margin-bottom:3em;}
.blog-img-tagpage{position: relative;width: 50%; display: flex;align-items: center;justify-content: center;overflow: hidden;}
.blog-img-tagpage img{width: 80%;height: 80%;object-fit: cover;transition: transform 0.5s ease;}

/*search-page*/
.search-container {padding: 2rem;}
.search-header {margin-bottom: 2rem;border-bottom: 1px solid #eee;padding-bottom: 1rem;text-align: center;}
.search-title {font-size: 1.5rem;margin: 0 0 0.5rem 0;color: #333;}
.search-query {color: #1a73e8;font-weight: bold;}
.search-results-count {margin: 0;color: #666;font-size: 0.9rem;}

.search-result-item {margin-bottom: 2rem;padding-bottom: 1.5rem;border-bottom: 1px solid #eee;}
.entry-title {font-size: 1.25rem;margin: 0 0 0.5rem 0;}
.entry-title a {color: #333;text-decoration: none;}
.entry-title a:hover {color: #0073aa;}
.entry-footer a{width: 30%;}

.results-btn{display: block;background: var(--accent);color: white;text-decoration: none;padding: 5px;border-radius: 4px;transform: translateY(-3px);text-align: center;}
.no-results {text-align: center;padding: 2rem;}
.no-results h2 {color: #666;margin-bottom: 1rem;}