:root { --primary:#0056b3; --secondary:#0d8af0; --accent:#ff6b00; --light:#f8f9fa; --dark:#212529; --light-gray:#e9ecef; --shadow:0 5px 15px rgba(0,0,0,.1); --shadow-hover:0 8px 25px rgba(0,0,0,.15); --transition:all .3s ease; }
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:Poppins,system-ui,Segoe UI,Roboto,Helvetica,Arial,sans-serif;background:var(--light);color:var(--dark);line-height:1.6}
h1,h2,h3,h4{font-family:Montserrat,system-ui,sans-serif;line-height:1.2;margin-bottom:1rem;font-weight:800}
.container{width:95%;max-width:1400px;margin:0 auto;padding:0 15px}
.btn{display:inline-block;padding:12px 28px;border-radius:4px;background:var(--primary);color:#fff;text-decoration:none;transition:var(--transition)}
.btn:hover{background:var(--secondary);transform:translateY(-3px);box-shadow:var(--shadow-hover)}
.btn-outline{background:transparent;border:2px solid var(--primary);color:var(--primary)}
.btn-outline:hover{background:var(--primary);color:#fff}
a:focus-visible,button:focus-visible{outline:3px solid var(--accent);outline-offset:2px;border-radius:4px}

header{position:fixed;top:0;left:0;right:0;background:#fff;box-shadow:var(--shadow);z-index:1000}
.navbar{display:flex;justify-content:space-between;align-items:center;padding:18px 0}
.logo h1{font-size:1.6rem;color:var(--primary);margin:0}
.logo span{color:var(--accent)}
.nav-links{display:flex;list-style:none}
.nav-links li{margin-left:28px}
.nav-links a{color:var(--dark);text-decoration:none;font-weight:500;position:relative;padding:6px 0}
.nav-links a:hover{color:var(--primary)}
.nav-links a:after{content:"";position:absolute;left:0;bottom:0;height:2px;width:0;background:var(--accent);transition:width .25s ease}
.nav-links a:hover:after,.nav-links a.active:after{width:100%}
.language-switcher{display:flex;margin-left:16px}
.lang-btn{background:none;border:none;cursor:pointer;margin:0 4px;width:32px;height:24px;border-radius:3px;overflow:hidden;box-shadow:0 2px 5px rgba(0,0,0,.1);transition:transform .3s}
.lang-btn:hover{transform:scale(1.1)}
.lang-btn.active{box-shadow:0 0 0 2px var(--accent)}
.lang-btn img{width:100%;height:100%;object-fit:cover}
.menu-toggle{display:none}
.menu-toggle button{background:none;border:none;font-size:1.5rem;cursor:pointer}

.hero{height:100vh;display:flex;align-items:center;justify-content:center;text-align:center;color:#fff;background:linear-gradient(rgba(0,0,0,.35),rgba(0,0,0,.35)),url('../../pictures/10.png') center/cover no-repeat;background-size:cover;padding-top:70px;position:relative}
.hero-content{max-width:700px;padding:0 20px;position:relative;z-index:2}
.hero h1{font-size:2.4rem;text-shadow:0 3px 15px rgba(0,0,0,.8);font-weight:800;margin-bottom:16px}
.hero p{font-size:1rem;margin:12px 0 20px;text-shadow:0 2px 8px rgba(0,0,0,.8);line-height:1.5}
.hero-buttons{display:flex;justify-content:center;gap:12px}

.section{padding:100px 0;opacity:0;transform:translateY(30px);transition:opacity .8s,transform .8s}
.section.visible{opacity:1;transform:none}
.section-title{text-align:center;margin-bottom:50px}
.section-title h2{display:inline-block;position:relative;padding-bottom:10px}
.section-title h2:after{content:"";position:absolute;left:50%;transform:translateX(-50%);bottom:0;width:100px;height:4px;background:var(--accent)}

.services{background:var(--light-gray)}
.services-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:20px}
.service-card{background:#fff;border-radius:10px;overflow:hidden;box-shadow:var(--shadow);transition:var(--transition)}
.service-card:hover{transform:translateY(-8px);box-shadow:var(--shadow-hover)}
.service-icon{height:80px;background:var(--primary);display:flex;align-items:center;justify-content:center;color:#fff;font-size:2.2rem}
.service-content{padding:18px}
.service-content h3{color:var(--primary);margin-bottom:10px}

.cta{background:linear-gradient(90deg,var(--primary),var(--secondary));color:#fff;text-align:center;padding:70px 0}
.cta p{max-width:720px;margin:0 auto 24px}

footer{background:var(--dark);color:#fff;padding:60px 0 20px}
.footer-content{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:36px;margin-bottom:40px}
.footer-column h3{position:relative;padding-bottom:10px;margin-bottom:18px}
.footer-column h3:after{content:"";position:absolute;left:0;bottom:0;width:40px;height:3px;background:var(--accent)}

/* Language switcher */
.language-switcher{display:flex;align-items:center;margin-left:12px}
.language-switcher .lang-btn{display:inline-flex;width:24px;height:24px;align-items:center;justify-content:center;border-radius:50%;background:var(--light-gray);color:var(--dark);transition:transform .2s,background .2s,color .2s;margin:0 2px}
.language-switcher .lang-btn:hover{transform:translateY(-2px);background:var(--primary);color:#fff}
.language-switcher .lang-btn.active{background:var(--primary);color:#fff}
.language-switcher .lang-btn img{width:14px;height:14px;object-fit:cover}

.footer-links{list-style:none}
.footer-links li{margin-bottom:10px}
.footer-links a{color:#ccc;text-decoration:none}
.footer-links a:hover{color:#fff;padding-left:5px}
.contact-info{list-style:none}
.contact-info li{display:flex;align-items:flex-start;margin-bottom:12px}
.contact-info i{color:var(--accent);margin-right:10px;margin-top:4px}
.copyright{text-align:center;border-top:1px solid rgba(255,255,255,.12);padding-top:16px;color:#aaa;font-size:.9rem}

/* About page */
.about-content{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:40px;align-items:center}
.about-text p{margin-bottom:16px}
.about-image img{width:100%;height:auto;border-radius:10px;box-shadow:var(--shadow)}

/* Why page */
.values-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:28px}
.value-item{text-align:center;padding:28px;background:#fff;border-radius:10px;box-shadow:var(--shadow);transition:var(--transition)}
.value-item:hover{transform:translateY(-5px);box-shadow:var(--shadow-hover)}
.value-icon{font-size:3rem;color:var(--primary);margin-bottom:16px}
.value-item h3{color:var(--primary);margin-bottom:12px}
.value-item p{color:var(--dark)}

/* Contact Form Styles */
.error-message{color:#dc3545;font-size:.875rem;margin-top:4px;display:block;min-height:20px}
form input.invalid,form textarea.invalid{border-color:#dc3545;background-color:#fff5f5}
form input.valid,form textarea.valid{border-color:#28a745}
.form-messages{padding:12px 16px;border-radius:6px;margin-bottom:16px;font-weight:500}
.form-messages.success{background-color:#d4edda;color:#155724;border:1px solid #c3e6cb}
.form-messages.error{background-color:#f8d7da;color:#721c24;border:1px solid #f5c6cb}
.btn-loader{display:none}
button.btn:disabled{opacity:.6;cursor:not-allowed}
form label{display:block;margin-bottom:6px;font-weight:500;color:var(--dark)}

/* Product Showcase */
.product-showcase{display:flex;justify-content:center;gap:24px;margin-top:40px;flex-wrap:wrap}
.product-image-wrapper{position:relative;overflow:hidden;border-radius:12px;box-shadow:var(--shadow);transition:var(--transition);background:#fff;max-width:600px;width:100%}
.product-image-wrapper:hover{transform:translateY(-8px);box-shadow:var(--shadow-hover)}
.product-image-wrapper img{width:100%;height:auto;display:block;object-fit:cover;aspect-ratio:4/3;transition:transform .5s ease}
.product-image-wrapper:hover img{transform:scale(1.05)}
.product-overlay{position:absolute;bottom:0;left:0;right:0;background:linear-gradient(to top,rgba(0,0,0,.7),transparent);padding:20px;color:#fff;transform:translateY(100%);transition:transform .3s ease}
.product-image-wrapper:hover .product-overlay{transform:translateY(0)}
.product-overlay h3{margin:0;font-size:1.1rem;color:#fff}

/* Image Slider */
.image-slider{position:relative;max-width:450px;margin:40px auto;overflow:hidden;border-radius:12px;box-shadow:var(--shadow)}
.slider-container{display:flex;transition:transform 0.5s ease-in-out}
.slider-item{min-width:100%;position:relative}
.slider-item img{width:100%;height:auto;display:block;object-fit:cover}
.slider-dots{display:flex;justify-content:center;gap:10px;margin-top:20px}
.slider-dot{width:12px;height:12px;border-radius:50%;background:rgba(0,86,179,0.3);cursor:pointer;transition:var(--transition);border:none}
.slider-dot.active{background:var(--primary);transform:scale(1.2)}
.slider-arrow{position:absolute;top:50%;transform:translateY(-50%);background:rgba(255,255,255,0.9);border:none;width:40px;height:40px;border-radius:50%;cursor:pointer;font-size:18px;color:var(--primary);transition:var(--transition);z-index:10;display:flex;align-items:center;justify-content:center}
.slider-arrow:hover{background:#fff;box-shadow:var(--shadow-hover)}
.slider-arrow.prev{left:10px}
.slider-arrow.next{right:10px}
@media (max-width:768px){.image-slider{max-width:90%}.slider-arrow{width:35px;height:35px;font-size:16px}.slider-arrow.prev{left:5px}.slider-arrow.next{right:5px}}

@media (max-width: 992px){ .hero h1{font-size:2rem} .hero p{font-size:0.95rem} .section{padding:80px 0} .product-image-wrapper{max-width:500px} }
@media (max-width: 768px){
  .menu-toggle{display:block}
  .nav-links{position:absolute;top:100%;left:0;width:100%;background:#fff;flex-direction:column;align-items:center;padding:18px 0;box-shadow:0 5px 10px rgba(0,0,0,.1);clip-path:polygon(0 0,100% 0,100% 0,0 0);transition:var(--transition)}
  .nav-links.active{clip-path:polygon(0 0,100% 0,100% 100%,0 100%)}
  .nav-links li{margin:12px 0}
  .hero h1{font-size:1.75rem}
  .hero p{font-size:0.9rem}
  .hero-content{max-width:90%}
  .product-showcase{gap:20px;padding:0 20px}
  .product-image-wrapper{max-width:100%}
}