* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin:0; font-family: Arial, Helvetica, sans-serif; color:#1f2937; background:#ffffff; line-height:1.6; }
body.lightbox-open { overflow:hidden; }
img { max-width:100%; display:block; }
a { color:inherit; text-decoration:none; }
button { font:inherit; }
.container { width:min(1120px, calc(100% - 40px)); margin:0 auto; }



.site-header { position:sticky; top:0; z-index:1000; background:rgba(255,255,255,.96); backdrop-filter:blur(10px); border-bottom:1px solid #e5e7eb; }
.header-inner { display:flex; align-items:center; justify-content:space-between; min-height:78px; gap:24px; }
.brand { display:flex; align-items:center; gap:14px; min-width:0; }
.brand-logo { width:58px; height:58px; object-fit:contain; flex-shrink:0; }
.brand-name { display:block; font-size:1.1rem; font-weight:700; }
.brand-subtitle { display:block; font-size:.85rem; color:#6b7280; }
.main-nav { display:flex; align-items:center; gap:24px; }
.main-nav a, .footer-nav a { color:#4b5563; transition:color .2s ease; }
.main-nav a:hover, .footer-nav a:hover { color:#111827; }
.menu-toggle { display:none; background:#111827; color:#fff; border:none; border-radius:12px; padding:10px 14px; font-size:1rem; cursor:pointer; }

.hero { background:linear-gradient(135deg,#f8fafc,#ffffff 55%,#f1f5f9); border-bottom:1px solid #f1f5f9; }
.hero-simple { display:flex; flex-direction:column; align-items:center; text-align:center; gap:30px; padding:90px 0; }
.hero-logo img { max-width:160px; }
.hero-text-centered { max-width:720px; margin:0 auto; }

.eyebrow, .section-label { display:inline-block; margin-bottom:16px; padding:8px 14px; border:1px solid #e5e7eb; border-radius:999px; background:#fff; color:#6b7280; font-size:.8rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase; }
.hero h1, .section-intro h2, .contact-box h2 { margin:0; color:#0f172a; line-height:1.15; }
.hero h1 { font-size:clamp(2.1rem,5vw,3.7rem); }
.hero p, .section-intro p, .contact-box p, .info-card p, .product-content p, 

.hero-actions { display:flex; flex-wrap:wrap; justify-content:center; gap:14px; margin-top:28px; }
.btn { display:inline-flex; align-items:center; justify-content:center; min-height:46px; padding:0 18px; border-radius:16px; font-weight:600; transition:all .2s ease; cursor:pointer; }
.btn-primary { background:#111827; color:#fff; border:1px solid #111827; }
.btn-primary:hover { opacity:.92; }
.btn-secondary { background:#fff; color:#374151; border:1px solid #d1d5db; }
.btn-secondary:hover { background:#f9fafb; }

.image-zoom-trigger { width:100%; padding:0; border:none; background:transparent; cursor:zoom-in; }

.section { padding:88px 0; }
.section-alt { background:#f8fafc; border-top:1px solid #f1f5f9; border-bottom:1px solid #f1f5f9; }
.section-intro { max-width:760px; }
.section-intro h2, .contact-box h2 { font-size:clamp(2rem,4vw,3rem); }

.info-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:22px; margin-top:36px; }
.info-grid-2 { grid-template-columns:repeat(2,1fr); }
.info-card, .contact-box, .form-card, .product-card {
  background:#fff; border:1px solid #e5e7eb; border-radius:28px; box-shadow:0 12px 24px rgba(15,23,42,.04);
}
.info-card { padding:28px; }
.small-link-line { margin-top:14px; }
.small-link-line a { color:#111827; text-decoration:underline; text-underline-offset:4px; font-weight:600; }

.products-header { max-width:none; display:flex; align-items:end; justify-content:space-between; gap:24px; }
.carousel-controls { display:flex; gap:10px; flex-shrink:0; }
.carousel-btn { width:48px; height:48px; border-radius:14px; border:1px solid #d1d5db; background:#fff; color:#111827; cursor:pointer; transition:all .2s ease; }
.carousel-btn:hover { background:#111827; color:#fff; border-color:#111827; }

.products-carousel-wrapper { position:relative; margin-top:36px; }
.products-carousel-viewport { overflow:hidden; }
.products-carousel-grid {
  display:grid;
  grid-auto-flow:column;
  grid-template-rows: repeat(2, auto);
  grid-auto-columns: calc((100% - 88px) / 5);
  gap:22px;
  transition: transform .35s ease;
  align-items:start;
  will-change: transform;
}
.product-card { overflow:hidden; min-width:0; height:100%; }
.product-card img { width:100%; aspect-ratio:4/3; object-fit:cover; }
.product-image-button img { background:#f8fafc; }
.product-content { padding:22px; }
.product-badge { display:inline-block; margin-bottom:10px; padding:6px 10px; border-radius:999px; background:#111827; color:#fff; font-size:.78rem; font-weight:700; }
.product-meta { display:flex; flex-wrap:wrap; gap:8px; margin:16px 0 18px; }
.product-meta span { padding:7px 10px; border-radius:999px; background:#f3f4f6; color:#374151; font-size:.82rem; font-weight:600; }

.contact-stack { display:grid; gap:28px; }
.contact-box, .form-card { padding:28px; }
.contact-box h2, .contact-box h3 { margin-top:0; }
.contact-details { display:grid; grid-template-columns:auto 1fr; gap:8px 16px; margin-top:10px; }
.contact-row { display:contents; }
.contact-label { font-weight:600; color:#374151; }
.contact-value a { text-decoration:underline; color:#111827; }

.form-row { display:grid; grid-template-columns:repeat(2,1fr); gap:18px; }
.form-group { margin-bottom:18px; }
label { display:block; margin-bottom:8px; font-weight:600; color:#374151; }
input, textarea { width:100%; border:1px solid #d1d5db; border-radius:16px; padding:14px 16px; font:inherit; color:#111827; outline:none; transition:border-color .2s ease, box-shadow .2s ease; }
input:focus, textarea:focus { border-color:#6b7280; box-shadow:0 0 0 3px rgba(107,114,128,.12); }


.site-footer { border-top:1px solid #e5e7eb; background:#fff; }
.footer-inner { min-height:88px; display:flex; align-items:center; justify-content:space-between; gap:18px; color:#6b7280; }
.footer-brand { display:flex; align-items:center; gap:12px; }
.footer-logo { width:42px; height:42px; object-fit:contain; }
.footer-nav { display:flex; flex-wrap:wrap; gap:18px; }

.lightbox { position:fixed; inset:0; display:none; align-items:center; justify-content:center; background:rgba(15,23,42,.88); z-index:2000; padding:24px; }
.lightbox.active { display:flex; }
.lightbox-content { width:min(1000px,100%); max-height:88vh; display:flex; align-items:center; justify-content:center; }
.lightbox-content img { max-width:100%; max-height:88vh; object-fit:contain; border-radius:18px; background:#fff; padding:12px; }
.lightbox-close, .lightbox-nav { position:absolute; border:none; background:rgba(255,255,255,.14); color:#fff; cursor:pointer; transition:background .2s ease; }
.lightbox-close:hover, .lightbox-nav:hover { background:rgba(255,255,255,.24); }
.lightbox-close { top:18px; right:18px; width:46px; height:46px; border-radius:14px; font-size:1.8rem; }
.lightbox-nav { top:50%; transform:translateY(-50%); width:52px; height:52px; border-radius:50%; font-size:1.4rem; }
.lightbox-prev { left:18px; }
.lightbox-next { right:18px; }

@media (max-width: 1200px) {
  .products-carousel-grid { grid-auto-columns: calc((100% - 66px) / 4); }
}
@media (max-width: 980px) {
  .info-grid, .info-grid-2 { grid-template-columns:1fr; }
  .products-header { flex-direction:column; align-items:flex-start; }
  .products-carousel-grid { grid-auto-columns: calc((100% - 22px) / 2); }
  .contact-stack { gap:22px; }
}
@media (max-width:760px) {
  .container { width:min(1120px, calc(100% - 28px)); }
  .menu-toggle { display:inline-flex; }
  .main-nav { position:absolute; top:78px; left:0; right:0; display:none; flex-direction:column; align-items:flex-start; gap:14px; padding:18px 20px 22px; background:#fff; border-bottom:1px solid #e5e7eb; }
  .main-nav.open { display:flex; }
  .hero-simple { padding:64px 0; }
  .section { padding:64px 0; }
  .form-row { grid-template-columns:1fr; }
  .products-carousel-grid { grid-template-rows: none; grid-auto-columns: 85%; }
  .products-carousel-viewport { overflow-x:auto; scrollbar-width:none; }
  .products-carousel-viewport::-webkit-scrollbar { display:none; }
  .footer-inner { flex-direction:column; justify-content:center; padding:18px 0; }
  .lightbox-nav { width:44px; height:44px; }
  }
@media (max-width:480px) {
  .header-inner { min-height:72px; }
  .brand-logo { width:46px; height:46px; }
  .brand-name { font-size:1rem; }
  .brand-subtitle { font-size:.78rem; }
  .hero h1 { font-size:2rem; }
  .btn { width:100%; }
  .hero-actions { flex-direction:column; }
  .info-card, .product-card, .contact-box, .form-card { border-radius:22px; }
  .product-content, .info-card, .form-card, .contact-box { padding:18px; }
  .footer-brand { flex-direction:column; text-align:center; }
  .products-carousel-grid { grid-auto-columns: 92%; }
  .carousel-controls { width:100%; }
  .carousel-btn { flex:1; }
  .lightbox { padding:12px; }
  .lightbox-prev { left:8px; }
  .lightbox-next { right:8px; }
  .lightbox-close { top:8px; right:8px; }
}


/* Product section V2 alignment update */
.products-carousel-grid{
  align-items:stretch;
}
.product-card{
  display:flex;
  flex-direction:column;
}
.product-image-button{
  display:block;
}
.product-card img{
  aspect-ratio: 4 / 3;
  object-fit: contain;
  padding: 12px;
}
.product-content{
  display:flex;
  flex-direction:column;
  flex:1;
  padding:18px 18px 20px;
}
.product-content h3{
  margin:0 0 10px 0;
  font-size:0.95rem;
  line-height:1.35;
  min-height:3.9em;
}
.product-content p{
  margin:0 0 16px 0;
  font-size:0.86rem;
  line-height:1.5;
  min-height:6.0em;
  display:-webkit-box;
  -webkit-line-clamp:4;
  -webkit-box-orient:vertical;
  overflow:hidden;
}
.product-content .btn{
  margin-top:auto;
}
.product-meta,
.product-badge{
  display:none !important;
}
.desc-link{
  color:#111827;
  text-decoration:underline;
  text-underline-offset:2px;
  font-weight:600;
}
@media (max-width:1200px){
  .product-content h3{min-height:4.1em;}
  .product-content p{min-height:6.2em;}
}
@media (max-width:980px){
  .product-content h3{
    min-height:auto;
  }
  .product-content p{
    min-height:5.8em;
  }
}
@media (max-width:760px){
  .product-card img{
    padding:18px;
  }
  .product-content h3,
  .product-content p{
    min-height:auto;
  }
}


.footer-brand-stacked{
  align-items:flex-start;
}
.footer-company-lines{
  display:flex;
  flex-direction:column;
  gap:6px;
}
.footer-company-meta{
  font-size:0.85rem;
}
.footer-consumer-line{
  font-size:0.8rem;
  text-align:center;
}
.footer-consumer-line a{
  text-decoration:underline;
  text-underline-offset:3px;
}
@media (max-width:760px){
  .footer-brand-stacked{
    align-items:center;
    text-align:center;
  }
  .footer-company-lines{
    align-items:center;
  }
}


.footer-consumer-center{
    text-align:center;
    margin-top:10px;
    font-size:0.85rem;
}
.footer-consumer-center a{
    text-decoration:underline;
}

.footer-single-line{
    display:flex;
    flex-wrap:wrap;
    justify-content:center;
    align-items:center;
    gap:6px;
    font-size:0.85rem;
    text-align:center;
}
.footer-single-line a{
    text-decoration:none;
}
.footer-single-line .sep{
    opacity:0.5;
}


.page-actions{
  display:flex;
  flex-wrap:wrap;
  justify-content:flex-start;
  gap:14px;
  margin-top:24px;
}
.page-actions .btn{
  min-width:180px;
}
@media (max-width:480px){
  .page-actions{
    flex-direction:column;
    align-items:stretch;
  }
  .page-actions .btn{
    width:100%;
    min-width:0;
  }
}


/* V4 clean header/footer alignment */
.brand-lines{
  display:flex;
  flex-direction:column;
  justify-content:center;
}
.header-inner{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
}
.main-nav{
  margin-left:auto;
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:24px;
}

.footer-inner-clean{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  min-height:88px;
}
.footer-brand-clean{
  display:flex;
  align-items:center;
  gap:14px;
  min-width:0;
}
.footer-logo{
  width:58px;
  height:58px;
}
.footer-nav-clean{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:flex-end;
  gap:10px;
}
.footer-sep{
  opacity:.45;
}
@media (max-width:760px){
  .footer-inner-clean{
    flex-direction:column;
    justify-content:center;
    text-align:center;
  }
  .footer-nav-clean{
    justify-content:center;
  }
}


/* V4 header right block with date/time */
.header-right{
  margin-left:auto;
  display:flex;
  flex-direction:column;
  align-items:flex-end;
  justify-content:center;
  gap:6px;
}
.header-datetime{
  font-size:0.82rem;
  color:#6b7280;
  text-align:right;
}

/* V4 footer two-line layout */
.footer-outer{
  display:flex;
  flex-direction:column;
  gap:8px;
}
.footer-legal-line{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:10px;
  font-size:0.82rem;
  color:#6b7280;
  min-height:24px;
}
.footer-legal-line a{
  color:#6b7280;
}
.footer-legal-line a:hover{
  color:#111827;
}
@media (max-width:760px){
  .header-right{
    width:100%;
    align-items:flex-start;
  }
  .header-datetime{
    text-align:left;
  }
  .footer-legal-line{
    justify-content:center;
    text-align:center;
    flex-wrap:wrap;
  }
}


/* Justified content text outside header/footer */
.section-intro p,
.section-intro li,
.info-card p,
.product-content p,
.contact-box p,
.form-privacy-note,
.cookie-text,
.contact-text p{
  text-align: justify;
  text-justify: inter-word;
}

/* Keep header/footer/navigation not justified */
.site-header,
.site-header * ,
.site-footer,
.site-footer *{
  text-align: initial;
}
.brand-name,
.brand-subtitle,
.main-nav,
.footer-nav,
.footer-nav-clean,
.footer-legal-line,
.header-datetime{
  text-align: inherit;
}


.section-intro h2:empty,
.contact-box h2:empty{
  display:none;
}


/* Main page section labels styled like dark buttons */
.section-label{
  background:#111827;
  color:#ffffff;
  border:1px solid #111827;
}

/* Wider text blocks on homepage */
.section-intro-wide{
  max-width:none;
}
.section-intro-wide p{
  max-width:none;
}

.contact-box-wide{
  max-width:none;
}
.contact-box-wide p{
  max-width:none;
}

/* Keep headings spacing coherent when main title removed */
.products-header > div:first-child,
.section-intro-wide{
  width:100%;
}


/* Product header full-width text with controls below */
.products-header{
  display:block;
}
.products-header-text{
  width:100%;
  max-width:none;
}
.products-header .carousel-controls-below{
  display:flex;
  justify-content:flex-start;
  margin-top:14px;
}
.products-header .carousel-controls-below .carousel-btn{
  margin-right:10px;
}

.form-note{
  margin:16px 0 20px;
  font-size:0.95rem;
  line-height:1.6;
  color:#4b5563;
  text-align:justify;
}


/* V6.2 mobile header fix */
@media (max-width:760px){
  .header-inner{
    position:relative;
    min-height:72px;
  }
  .header-right{
    width:auto;
    margin-left:auto;
    align-items:flex-end;
  }
  .header-datetime{
    display:none;
  }
  .main-nav{
    display:none !important;
    position:absolute;
    top:100%;
    left:0;
    right:0;
    z-index:1100;
    flex-direction:column;
    align-items:flex-start;
    gap:14px;
    padding:18px 20px 22px;
    background:#fff;
    border-bottom:1px solid #e5e7eb;
    box-shadow:0 10px 24px rgba(15,23,42,.08);
  }
  .main-nav.open{
    display:flex !important;
  }
}


/* V6.3 mobile menu button alignment */
@media (max-width:760px){
  .header-inner{
    display:flex;
    align-items:center;
    justify-content:space-between;
  }

  .menu-toggle{
    margin-left:auto;
    align-self:center;
  }

  .brand{
    margin-right:auto;
  }
}


/* V6.4 mobile menu button flush-right like logo spacing on left */
@media (max-width:760px){
  .site-header .container.header-inner{
    position:relative;
    display:flex;
    align-items:center;
    justify-content:flex-start;
    min-height:72px;
    padding-right:56px;
  }

  .site-header .brand{
    margin-right:0;
  }

  .site-header .header-right{
    margin-left:0;
    width:auto;
  }

  
}


.form-note{
  margin:16px 0 20px;
  font-size:0.95rem;
  line-height:1.6;
  color:#4b5563;
  text-align:justify;
}

/* V7.1 tighter layout and white backgrounds */
.hero,
.section-alt,
.product-image-button img,
.products-carousel-wrapper,
.products-carousel-viewport {
  background:#ffffff !important;
}
.section-alt{
  border-top:1px solid #f3f4f6;
  border-bottom:1px solid #f3f4f6;
}
.section{
  padding:64px 0;
}
.hero-simple{
  padding:72px 0;
}
.info-grid,
.info-grid-2{
  gap:16px;
  margin-top:28px;
}
.info-card,
.contact-box,
.form-card,
.product-card{
  border-radius:22px;
  box-shadow:0 8px 18px rgba(15,23,42,.035);
}
.info-card{
  padding:22px;
}
.products-carousel-wrapper{
  margin-top:24px;
}
.products-carousel-grid{
  gap:16px;
  grid-auto-columns: calc((100% - 64px) / 5);
}
.product-card img{
  aspect-ratio: 1 / 1;
}
.product-content{
  padding:14px 14px 16px !important;
}
.product-content h3{
  font-size:.93rem;
  line-height:1.35;
  margin:0 0 8px 0;
}
.product-content p{
  font-size:.84rem;
  line-height:1.45;
  margin:0 0 10px 0;
}
.product-content .btn{
  min-height:40px;
  padding:0 14px;
  font-size:.9rem;
}
.section-intro p,
.contact-box p{
  font-size:.97rem;
}
@media (max-width:980px){
  .section{
    padding:56px 0;
  }
  .products-carousel-grid{
    gap:14px;
  }
}
@media (max-width:760px){
  .section{
    padding:48px 0;
  }
  .hero-simple{
    padding:56px 0;
  }
  .products-carousel-grid{
    grid-auto-columns:78%;
    gap:12px;
  }
  .product-content{
    padding:12px 12px 14px !important;
  }
  .product-content h3{
    font-size:.9rem;
  }
  .product-content p{
    font-size:.82rem;
  }
}


/* V7.2 products continuation in same 2-row layout */
.products-carousel-grid{
  grid-auto-columns: calc((100% - 64px) / 5);
  align-items:stretch;
}
.product-card{
  height:100%;
}
.product-image-button{
  width:100%;
}
.product-image-button img{
  width:100%;
  aspect-ratio:1 / 1;
  object-fit:contain;
  background:#ffffff;
}
@media (max-width:1200px){
  .products-carousel-grid{
    grid-auto-columns: calc((100% - 48px) / 4);
  }
}
@media (max-width:980px){
  .products-carousel-grid{
    grid-auto-columns: calc((100% - 22px) / 2);
  }
}
@media (max-width:760px){
  .products-carousel-grid{
    grid-auto-columns:78%;
  }
}


/* V7.3 smooth one-column product navigation */
.products-carousel-grid{
  transition: transform .4s ease;
}



/* V7.5 urgent fix: menu button strict right on mobile/tablet */
@media (max-width: 980px) {
  .site-header .container.header-inner{
    position: relative !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    min-height: 72px !important;
    padding-right: 58px !important;
  }

  .site-header .brand{
    margin-right: 0 !important;
  }

  .site-header .header-right{
    margin-left: 0 !important;
    width: auto !important;
    align-items: flex-end !important;
  }

  
}


/* make sure no old inline privacy note is shown */



/* FINAL mobile menu alignment */
@media (max-width:760px){
  .site-header .container.header-inner{
    position:relative;
    display:flex;
    align-items:center;
  }

  .site-header .menu-toggle{
    position:absolute;
    right:0;
    top:50%;
    transform:translateY(-50%);
    margin:0;
    display:inline-flex;
  }
}