﻿:root{--green:#06923a;--green-dark:#04752e;--blue:#0066cc;--ink:#333;--muted:#666;--line:#dde3df;--panel:#f4f6f4;--white:#fff;--max:1160px}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:var(--ink);font-family:Arial,Helvetica,sans-serif;line-height:1.55;background:#eee}img{max-width:100%;display:block}a{color:var(--blue);text-underline-offset:3px}.container{width:min(var(--max),calc(100% - 40px));margin:0 auto}.skip-link{position:absolute;left:-999px}.skip-link:focus{left:12px;top:12px;z-index:1000;background:var(--ink);color:var(--white);padding:10px 14px}.site-header{position:sticky;top:0;z-index:10;background:rgba(255,255,255,.97);border-bottom:1px solid var(--line);box-shadow:0 4px 18px rgba(0,0,0,.04)}.header-inner{min-height:82px;display:flex;align-items:center;justify-content:space-between;gap:24px}.brand{display:flex;align-items:center;gap:12px;color:var(--ink);text-decoration:none}.brand-mark{width:150px;height:58px;border-radius:0;display:block;background:url("../img/detzel-logo.jpg") center/contain no-repeat;color:transparent;font-size:0}.brand-mark+span{display:none}.desktop-nav>ul{display:flex;align-items:center;gap:4px;list-style:none;margin:0;padding:0}.desktop-nav a,.mobile-nav a{display:block;padding:12px 13px;border-radius:8px;color:var(--ink);font-weight:700;text-decoration:none}.desktop-nav a:hover,.desktop-nav a.active,.mobile-nav a:hover{background:var(--panel);color:var(--green-dark)}.has-menu{position:relative}.mega-menu{position:absolute;top:100%;right:0;width:min(720px,92vw);display:grid;grid-template-columns:210px 1fr;gap:20px;padding:22px;background:var(--white);border:1px solid var(--line);border-radius:8px;box-shadow:0 20px 48px rgba(0,0,0,.16);opacity:0;visibility:hidden;transform:translateY(8px);transition:160ms ease}.has-menu:hover .mega-menu,.has-menu:focus-within .mega-menu{opacity:1;visibility:visible;transform:translateY(0)}.mega-menu p{color:var(--muted);margin:6px 0 0}.mega-menu ul{columns:2;list-style:none;padding:0;margin:0}.mega-menu a{padding:8px 10px;break-inside:avoid}.mobile-nav{display:none}.mobile-nav summary{list-style:none;border:1px solid var(--line);border-radius:8px;padding:10px 12px;font-weight:800;cursor:pointer}.mobile-nav summary::-webkit-details-marker{display:none}.mobile-nav div{position:absolute;left:20px;right:20px;top:78px;padding:14px;background:var(--white);border:1px solid var(--line);border-radius:8px;box-shadow:0 18px 42px rgba(0,0,0,.16)}.mobile-nav ul{list-style:none;padding:0;margin:0}.mobile-nav .sub{padding-left:16px;border-left:3px solid var(--line)}.hero{position:relative;min-height:690px;display:grid;align-items:center;overflow:hidden;background:#fff}.hero>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.hero:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(255,255,255,.98),rgba(255,255,255,.88) 36%,rgba(255,255,255,.2) 70%,rgba(255,255,255,0))}.hero-content{position:relative;z-index:1;padding:90px 0 120px}.eyebrow{margin:0 0 12px;color:var(--green-dark);font-weight:800;text-transform:uppercase;font-size:.78rem;letter-spacing:0}h1,h2,h3{line-height:1.12;margin:0}.hero h1{max-width:760px;font-size:clamp(2.45rem,7vw,4.65rem);font-weight:800;color:#333}.hero p:not(.eyebrow){max-width:610px;margin:22px 0 0;color:#444;font-size:1.18rem}.actions,.callout{display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin-top:30px}.button{display:inline-flex;align-items:center;justify-content:center;min-height:46px;padding:12px 18px;border:1px solid var(--green);border-radius:8px;font-weight:800;text-decoration:none;cursor:pointer}.button.primary{background:var(--green);color:var(--white)}.button.secondary{background:rgba(255,255,255,.86);color:var(--green-dark)}.section{padding:78px 0;background:#fff}.section-heading{margin-bottom:28px}.section-heading h2,.page-hero h1{font-size:clamp(2rem,5vw,3.35rem)}.section-heading p,.page-hero p{max-width:760px;color:var(--muted);font-size:1.08rem}.cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}.card{border:1px solid var(--line);border-radius:8px;overflow:hidden;background:var(--white);box-shadow:0 10px 28px rgba(0,0,0,.08)}.card img{width:100%;aspect-ratio:4/3;object-fit:cover;filter:saturate(.92)}.card h3,.card p,.card a{margin-left:20px;margin-right:20px}.card h3{margin-top:20px;font-size:1.3rem}.card p{color:var(--muted)}.card a{display:inline-block;margin-bottom:22px;font-weight:800}.page-hero{padding:76px 0;background:linear-gradient(180deg,#fff,var(--panel));border-bottom:1px solid var(--line)}.content-layout{display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:34px;align-items:start}.content-panel{max-width:830px}.content-panel>p,.content-panel li{font-size:1.08rem;color:#444}.side-panel,.callout,.product-note{border:1px solid var(--line);border-radius:8px;padding:24px;background:var(--panel)}.side-panel h2{font-size:1.35rem}.product-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:28px}.product-grid a{display:block;padding:18px;border:1px solid var(--line);border-radius:8px;text-decoration:none;background:var(--white)}.product-grid span{display:block;margin-top:8px;color:var(--muted)}.product-detail{display:grid;grid-template-columns:280px 1fr;gap:28px;margin:28px 0}.product-detail img{border:1px solid var(--line);border-radius:8px;background:#fff}.tech-img{margin:22px 0;border:1px solid var(--line);border-radius:8px;background:#fff}.form-shell form{display:grid;gap:18px;margin-top:22px}.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}label{display:grid;gap:8px;font-weight:800}input,select,textarea{width:100%;border:1px solid #cbd6cf;border-radius:8px;padding:12px 13px;font:inherit;color:var(--ink);background:var(--white)}input:focus,select:focus,textarea:focus{outline:3px solid rgba(0,102,204,.18);border-color:var(--blue)}.checkline{display:flex;align-items:flex-start;gap:12px;font-weight:500}.checkline input{width:18px;height:18px;margin-top:4px}.hp-field{position:absolute;left:-9999px}.notice{padding:16px 18px;border-radius:8px;background:#e9f7ee;border:1px solid #b8e1c5}.notice.error{background:#fff0f0;border-color:#f2baba}.site-footer{background:#333;color:#eee;padding:46px 0 24px}.site-footer a{color:#fff}.footer-grid{display:grid;grid-template-columns:2fr 1.4fr 1fr;gap:24px}.footer-bottom{margin-top:28px;padding-top:18px;border-top:1px solid rgba(255,255,255,.16);color:#bbb}@media(max-width:980px){.desktop-nav{display:none}.mobile-nav{display:block}.brand-mark{width:132px;height:52px}.cards{grid-template-columns:repeat(2,minmax(0,1fr))}.content-layout,.product-detail{grid-template-columns:1fr}.product-detail img{max-width:360px}}@media(max-width:640px){.container{width:min(var(--max),calc(100% - 28px))}.hero{min-height:620px}.hero:after{background:linear-gradient(180deg,rgba(255,255,255,.96),rgba(255,255,255,.9) 56%,rgba(255,255,255,.35))}.hero-content{padding:68px 0 90px}.cards,.product-grid,.form-grid,.footer-grid{grid-template-columns:1fr}.section{padding:54px 0}.mobile-nav div{left:14px;right:14px}.brand-mark{width:118px;height:46px}}

/* refinements */
.mobile-actions{display:none}.hero{min-height:620px}.hero-content{padding:76px 0 100px}.hero h1{max-width:650px;font-size:clamp(2.2rem,4.7vw,3.85rem);line-height:1.07;letter-spacing:0}.hero p:not(.eyebrow){max-width:560px;font-size:1.08rem}.cards{gap:24px}.card{display:flex;flex-direction:column;border:0;border-radius:12px;background:linear-gradient(180deg,#fff,#f8faf9);box-shadow:0 16px 38px rgba(30,40,35,.1)}.card img{width:calc(100% - 28px);margin:14px 14px 0;border-radius:9px;aspect-ratio:16/10;object-fit:cover}.card p{min-height:78px;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}.card a{margin-top:auto}.product-detail{grid-template-columns:340px 1fr;gap:34px;align-items:start}.product-detail>img,.tech-img{padding:22px;border:1px solid #e4ebe6;border-radius:14px;background:linear-gradient(145deg,#fff,#f6f8f7);box-shadow:0 14px 32px rgba(30,40,35,.08);object-fit:contain}.product-detail>img{width:100%;min-height:240px;max-height:360px}.tech-img{width:100%}.side-panel,.callout,.product-note{border:0;border-radius:12px;background:linear-gradient(180deg,#f7faf8,#eef4f0);box-shadow:0 10px 28px rgba(30,40,35,.07)}@media(max-width:980px){.desktop-nav{display:none}.mobile-actions{display:flex;gap:8px;margin-left:auto}.icon-btn{width:42px;height:42px;border-radius:10px;border:1px solid var(--line);display:grid;place-items:center;text-decoration:none;font-size:20px;background:#fff;color:var(--green-dark);font-weight:800}.mobile-nav{display:block}.mobile-nav summary{width:44px;height:44px;display:grid;place-items:center;border-radius:10px;background:var(--green);border:0;padding:0}.mobile-nav summary span{display:block;width:21px;height:2px;background:#fff;margin:2px 0}.mobile-nav summary b{position:absolute;left:-9999px}.mobile-nav div{top:78px;left:18px;right:18px;max-height:calc(100vh - 96px);overflow:auto;padding:18px;border:0;border-radius:14px}.mobile-nav nav{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.mobile-nav nav a{background:#f6f8f6;border:1px solid var(--line)}.mobile-products{margin-top:16px;padding-top:14px;border-top:1px solid var(--line)}.mobile-products strong{display:block;margin:0 0 10px;color:var(--green-dark)}.mobile-products div{position:static;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;padding:0;box-shadow:none;border:0;max-height:none;overflow:visible}.mobile-products a{padding:9px 10px;background:#fff;border:1px solid var(--line);font-size:.92rem}.product-detail{grid-template-columns:1fr}.product-detail>img{max-width:420px}}@media(max-width:640px){.header-inner{min-height:70px}.hero{min-height:560px}.hero h1{font-size:clamp(2rem,10vw,3.1rem)}.hero-content{padding:58px 0 76px}.card p{min-height:auto}.mobile-nav div{left:12px;right:12px;top:70px}.mobile-nav nav,.mobile-products div{grid-template-columns:1fr}.icon-btn{width:40px;height:40px}}

/* icon navigation refinement */
.icon-btn svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.mobile-nav summary{position:relative;overflow:hidden}.mobile-nav summary:before{content:"";position:absolute;inset:0;background:linear-gradient(135deg,rgba(255,255,255,.22),rgba(255,255,255,0));opacity:.9}.burger-lines{position:relative;z-index:1;display:grid;gap:4px}.burger-lines i{display:block;width:22px;height:2px;border-radius:999px;background:#fff;transition:transform .18s ease,opacity .18s ease}.mobile-nav[open] .burger-lines i:nth-child(1){transform:translateY(6px) rotate(45deg)}.mobile-nav[open] .burger-lines i:nth-child(2){opacity:0}.mobile-nav[open] .burger-lines i:nth-child(3){transform:translateY(-6px) rotate(-45deg)}.mobile-nav summary:hover,.icon-btn:hover{transform:translateY(-1px);box-shadow:0 10px 24px rgba(0,0,0,.12)}.mobile-nav summary,.icon-btn{transition:transform .18s ease,box-shadow .18s ease,background .18s ease}.icon-btn:nth-child(2){color:var(--blue)}

/* requested navigation, hero and link polish */
.nowrap{white-space:nowrap}.desktop-nav a.nav-contact{background:var(--green);color:#fff;box-shadow:0 8px 20px rgba(6,146,58,.22)}.desktop-nav a.nav-contact:hover,.desktop-nav a.nav-contact.active{background:var(--green-dark);color:#fff}.desktop-call{display:inline-flex!important;align-items:center;gap:8px;border:1px solid var(--green)!important;color:var(--green-dark)!important;background:#fff!important}.desktop-call svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.desktop-call:hover{background:#eef8f1!important;color:var(--green-dark)!important}.hero h1{max-width:600px;font-size:clamp(2.05rem,4.05vw,3.35rem);line-height:1.12}.hero-content{max-width:650px}.cards{align-items:stretch}.card{min-height:100%}.card img{padding:14px;background:#f5f8f6;object-fit:contain;object-position:center;filter:none}.card a,.product-grid a strong,.content-panel a:not(.button),.side-panel a:not(.button){color:var(--green-dark);text-decoration:none;font-weight:800}.card a:before,.product-grid a strong:before,.content-panel a:not(.button):before,.side-panel a:not(.button):before{content:"→";display:inline-block;margin-right:7px;color:var(--green);font-weight:900}.site-footer a{text-decoration:none}.site-footer a:hover{text-decoration:underline}@media(max-width:980px){.desktop-call{display:none!important}.hero h1{max-width:560px;font-size:clamp(2rem,7vw,3.1rem)}}@media(max-width:640px){.hero h1{font-size:clamp(1.85rem,9vw,2.65rem);line-height:1.14}.nowrap{white-space:normal}.card img{padding:12px}}

/* layout harmonization */
:root{--max:1260px}.header-inner{gap:34px}.desktop-nav>ul{gap:10px}.desktop-nav a{padding:12px 10px}.desktop-nav a.active{background:transparent;color:var(--green-dark)}.desktop-nav a:hover{background:transparent;color:var(--green-dark)}.desktop-nav a.nav-contact{padding:13px 18px}.desktop-call{padding:12px 16px!important}.hero-content{max-width:none}.hero .eyebrow,.hero h1,.hero p:not(.eyebrow),.hero .actions{margin-left:0}.hero h1{max-width:620px}.hero p:not(.eyebrow){max-width:570px}.card{background:#fff}.card img{width:calc(100% - 24px);margin:12px 12px 0;padding:8px;background:#fff;border:1px solid #edf1ee;border-radius:10px;aspect-ratio:16/9;object-fit:contain}.card h3{margin-top:18px}.card p{min-height:76px}@media(max-width:1180px){.desktop-nav>ul{gap:4px}.desktop-nav a{padding:11px 8px}.desktop-nav a.nav-contact{padding:12px 14px}.desktop-call span{display:none}.desktop-call{padding:11px 12px!important}}@media(max-width:980px){.hero-content{max-width:none}.card img{width:calc(100% - 22px);margin:11px 11px 0;padding:7px}}

/* final desktop alignment pass */
.desktop-nav a.nav-contact,
.desktop-nav a.nav-contact.active,
.desktop-nav a.nav-contact:hover{background:var(--green)!important;color:#fff!important;box-shadow:0 10px 24px rgba(6,146,58,.2)}
.desktop-nav a.nav-contact:hover{background:var(--green-dark)!important}
.desktop-nav a.active:not(.nav-contact){background:transparent!important;color:var(--green-dark)!important}
.desktop-nav a:not(.nav-contact):hover{background:transparent!important;color:var(--green-dark)!important}
@media(min-width:981px){
  .header-inner{justify-content:flex-start}
  .desktop-nav{margin-left:auto}
  .desktop-nav>ul{gap:12px}
  .desktop-nav a{padding:10px 8px}
  .desktop-nav a.nav-contact{margin-left:10px;padding:13px 18px}
  .desktop-call{margin-left:-4px;padding:12px 15px!important}
}
.hero .container,
.section>.container{width:min(var(--max),calc(100% - 40px))}
.hero-content{padding-left:0;padding-right:0}
.hero h1{max-width:610px}
.card{background:#fff}
.card img{width:100%;margin:0;padding:0;background:transparent;border:0;aspect-ratio:500/277;object-fit:cover;object-position:center}
@media(max-width:980px){
  .card img{width:100%;margin:0;padding:0}
}

/* navigation, arrows and seo pass */
.mobile-actions{display:flex;justify-content:flex-end;gap:10px;margin-left:auto}
.mobile-actions .icon-btn{color:var(--green-dark)!important;border-color:#d8e3dd!important;background:#fff!important}
.mobile-actions .icon-btn:nth-child(2){color:var(--green-dark)!important}
.mobile-actions .icon-btn svg{width:20px;height:20px}
.mobile-nav summary{margin-left:0}
.mobile-nav summary .burger-lines{display:grid;gap:3px;width:18px;height:auto;background:none;position:relative;z-index:1}
.mobile-nav summary .burger-lines span{display:block;width:18px;height:2px;margin:0;border-radius:999px;background:#fff;transition:transform .18s ease,opacity .18s ease}
.mobile-nav[open] summary .burger-lines span:nth-child(1){transform:translateY(5px) rotate(45deg)}
.mobile-nav[open] summary .burger-lines span:nth-child(2){opacity:0}
.mobile-nav[open] summary .burger-lines span:nth-child(3){transform:translateY(-5px) rotate(-45deg)}
.mobile-nav div{display:grid;gap:12px}
.mobile-nav nav{display:grid;grid-template-columns:1fr;gap:8px}
.mobile-nav nav a,.mobile-filter>summary,.mobile-filter a{display:block}
.mobile-filter>summary{list-style:none;cursor:pointer;font-weight:800;color:var(--green-dark);padding:14px 16px;border:1px solid var(--line);border-radius:12px;background:linear-gradient(180deg,#fff,#f6f8f7)}
.mobile-filter>summary::-webkit-details-marker{display:none}
.mobile-filter>summary:after{content:"";float:right;width:10px;height:10px;margin-top:5px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg);transition:transform .18s ease}
.mobile-filter[open]>summary:after{transform:rotate(225deg)}
.mobile-filter .mobile-products{margin:0;padding:0;border:0}
.mobile-filter .mobile-products strong{display:none}
.mobile-filter .mobile-products div{position:static;display:grid;grid-template-columns:1fr;gap:8px;padding:0;border:0;box-shadow:none;max-height:0;overflow:hidden;opacity:0;transition:max-height .28s ease,opacity .2s ease}
.mobile-filter[open] .mobile-products div{max-height:1200px;opacity:1}
.mobile-filter .mobile-products a{background:#fff;border:1px solid var(--line);border-radius:10px;padding:11px 12px}
.mobile-filter .mobile-products a:first-child{font-weight:800;color:var(--green-dark)}
.mega-menu{left:50%;right:auto;transform:translateX(-50%) translateY(8px);width:min(980px,96vw);padding:30px;gap:30px;grid-template-columns:260px minmax(0,1fr)}
.has-menu:hover .mega-menu,.has-menu:focus-within .mega-menu{transform:translateX(-50%) translateY(0)}
.mega-intro{display:grid;gap:14px;align-content:start;padding-top:2px}
.mega-intro p{margin:0;color:var(--muted)}
.mega-link{display:inline-flex;align-items:center;justify-content:center;gap:8px;width:max-content;min-height:46px;padding:11px 14px;border:1px solid var(--green);border-radius:10px;background:#fff;color:var(--green-dark)!important;text-decoration:none;font-weight:800}
.mega-links-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;align-items:stretch}
.mega-links-grid ul{list-style:none;margin:0;padding:0;display:grid;gap:10px;align-content:start}
.mega-links-grid a{display:flex;align-items:flex-start;min-height:66px;padding:10px 12px;border-radius:10px;background:#f7faf8}
.mega-links-grid a:hover,.mega-link:hover{background:#ecf7ef;color:var(--green-dark)}
.card a:before,
.product-grid a:before,
.content-panel a:not(.button):before,
.side-panel a:not(.button):before,
.footer-grid a[href*="detzel-filter-produkte/index.html"]:before{
  content:"";
  display:inline-block;
  width:1em;
  height:1em;
  margin-right:8px;
  vertical-align:-0.12em;
  background:currentColor;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 6l6 6-6 6'/%3E%3C/svg%3E") center/contain no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 6l6 6-6 6'/%3E%3C/svg%3E") center/contain no-repeat;
}
.product-grid a:before{margin-top:1px}
.product-grid a{align-items:flex-start}
.product-grid a strong:before{content:none!important}
.checkline a:before{content:none!important;margin:0!important;display:none!important}
.site-footer a{text-decoration:none}
.site-footer a:hover{text-decoration:none}
@media(min-width:981px){.mobile-actions{display:none!important}}
@media(max-width:980px){
  .mobile-actions{display:flex!important;align-items:center;gap:10px;margin-left:auto;margin-right:10px}
  .mobile-nav{margin-left:8px}
  .mobile-nav summary{width:46px;height:46px;border-radius:12px}
}
@media(max-width:640px){
  .hero h1{font-size:clamp(1.55rem,6.6vw,2.02rem);line-height:1.06;max-width:13ch}
  .hero-content{padding:52px 0 70px}
}

/* mobile navigation stabilization */
@media(max-width:980px){
  .header-inner{
    flex-wrap:wrap;
    gap:10px;
    align-items:center;
  }
  .mobile-actions{
    display:flex!important;
    align-items:center;
    gap:8px;
    margin-left:auto;
    margin-right:0;
  }
  .mobile-actions .icon-btn,
  .mobile-nav summary{
    width:42px;
    height:42px;
    border-radius:11px;
    border:1px solid #d8e3dd;
    background:#fff;
    color:var(--green-dark);
    box-shadow:none;
    padding:0;
  }
  .mobile-actions .icon-btn{
    display:grid;
    place-items:center;
    flex:0 0 auto;
  }
  .mobile-actions .icon-btn svg{
    width:20px;
    height:20px;
  }
  .mobile-nav{
    display:flex;
    flex-wrap:wrap;
    align-items:flex-start;
    gap:10px;
    margin-left:8px;
    flex:0 0 auto;
  }
  .mobile-nav summary{
    position:relative;
    overflow:hidden;
    display:grid;
    place-items:center;
    flex:0 0 auto;
  }
  .mobile-nav summary b{
    position:absolute;
    left:-9999px;
  }
  .mobile-nav summary .burger-lines{
    position:relative;
    z-index:1;
    display:grid;
    gap:3px;
    width:18px;
  }
  .mobile-nav summary .burger-lines span{
    display:block;
    width:18px;
    height:2px;
    margin:0;
    border-radius:999px;
    background:currentColor;
    transition:transform .18s ease,opacity .18s ease;
  }
  .mobile-nav[open] summary .burger-lines span:nth-child(1){
    transform:translateY(5px) rotate(45deg);
  }
  .mobile-nav[open] summary .burger-lines span:nth-child(2){
    opacity:0;
  }
  .mobile-nav[open] summary .burger-lines span:nth-child(3){
    transform:translateY(-5px) rotate(-45deg);
  }
  .mobile-nav > div{
    order:2;
    flex:0 0 100%;
    width:100%;
    display:grid;
    gap:12px;
    position:static;
    left:auto;
    right:auto;
    top:auto;
    padding:0;
    background:transparent;
    border:0;
    box-shadow:none;
    max-height:0;
    overflow:hidden;
    opacity:0;
    transition:max-height .28s ease,opacity .2s ease;
  }
  .mobile-nav[open] > div{
    max-height:82vh;
    opacity:1;
    overflow:auto;
    padding-top:10px;
  }
  .mobile-nav nav{
    display:grid;
    grid-template-columns:1fr;
    gap:8px;
  }
  .mobile-nav nav a{
    background:#f6f8f6;
    border:1px solid var(--line);
    border-radius:12px;
  }
  .mobile-filter{
    display:grid;
    gap:10px;
  }
  .mobile-filter > summary{
    list-style:none;
    cursor:pointer;
    font-weight:800;
    color:var(--green-dark);
    padding:14px 16px;
    border:1px solid var(--line);
    border-radius:12px;
    background:linear-gradient(180deg,#fff,#f6f8f7);
  }
  .mobile-filter > summary::-webkit-details-marker{
    display:none;
  }
  .mobile-filter > summary:after{
    content:"";
    float:right;
    width:10px;
    height:10px;
    margin-top:5px;
    border-right:2px solid currentColor;
    border-bottom:2px solid currentColor;
    transform:rotate(45deg);
    transition:transform .18s ease;
  }
  .mobile-filter[open] > summary:after{
    transform:rotate(225deg);
  }
  .mobile-filter .mobile-products{
    margin:0;
    padding:0;
    border:0;
    display:grid;
    gap:8px;
  }
  .mobile-filter .mobile-products > a:first-child{
    display:block;
    width:100%;
    padding:12px 14px;
    min-height:48px;
    font-weight:800;
    color:var(--green-dark);
    white-space:normal;
  }
  .mobile-filter .mobile-products > div{
    position:static;
    display:grid;
    grid-template-columns:1fr;
    gap:8px;
    padding:0;
    border:0;
    box-shadow:none;
    max-height:0;
    overflow:hidden;
    opacity:0;
    transition:max-height .28s ease,opacity .2s ease;
  }
  .mobile-filter[open] .mobile-products > div{
    max-height:1200px;
    opacity:1;
  }
  .mobile-filter .mobile-products > div a{
    background:#fff;
    border:1px solid var(--line);
    border-radius:10px;
    padding:11px 12px;
  }
}

/* mobile navigation rebuild */
@media(max-width:980px){
  .site-header{
    overflow:visible;
  }
  .header-inner{
    display:grid!important;
    grid-template-columns:minmax(118px,1fr) 42px 42px 42px;
    grid-template-areas:
      "brand phone mail menu"
      "panel panel panel panel";
    gap:8px;
    align-items:center;
    min-height:70px;
    padding:8px 0;
  }
  .brand{
    grid-area:brand;
    min-width:0;
    z-index:2;
  }
  .brand-mark{
    width:118px;
    height:46px;
  }
  .desktop-nav{
    display:none!important;
  }
  .mobile-actions{
    display:contents!important;
  }
  .mobile-actions .icon-btn{
    width:42px!important;
    height:42px!important;
    display:grid!important;
    place-items:center;
    border:1px solid #d6e1db!important;
    border-radius:10px!important;
    background:#fff!important;
    color:var(--green-dark)!important;
    box-shadow:none!important;
    padding:0!important;
    margin:0!important;
    text-decoration:none;
    transform:none!important;
    z-index:3;
  }
  .mobile-actions .icon-btn:nth-child(1){
    grid-area:phone;
  }
  .mobile-actions .icon-btn:nth-child(2){
    grid-area:mail;
  }
  .mobile-actions .icon-btn svg{
    width:19px!important;
    height:19px!important;
    stroke:currentColor;
  }
  .mobile-nav{
    grid-column:1 / -1;
    grid-row:1 / 3;
    display:grid!important;
    grid-template-columns:minmax(118px,1fr) 42px 42px 42px;
    grid-template-areas:
      ". . . menu"
      "panel panel panel panel";
    gap:8px;
    width:100%;
    margin:0!important;
    padding:0!important;
    pointer-events:none;
    z-index:1;
  }
  .mobile-nav > summary{
    grid-area:menu;
    width:42px!important;
    height:42px!important;
    display:grid!important;
    place-items:center;
    padding:0!important;
    margin:0!important;
    border:1px solid #d6e1db!important;
    border-radius:10px!important;
    background:#fff!important;
    color:var(--green-dark)!important;
    box-shadow:none!important;
    cursor:pointer;
    list-style:none;
    position:relative;
    overflow:hidden;
    transform:none!important;
    pointer-events:auto;
    z-index:4;
  }
  .mobile-nav > summary::-webkit-details-marker{
    display:none;
  }
  .mobile-nav > summary:before{
    content:none!important;
  }
  .mobile-nav > summary b{
    position:absolute;
    left:-9999px;
  }
  .mobile-nav > summary .burger-lines{
    display:grid!important;
    gap:3px!important;
    width:18px!important;
    height:auto!important;
    background:none!important;
  }
  .mobile-nav > summary .burger-lines span{
    display:block!important;
    width:18px!important;
    height:2px!important;
    margin:0!important;
    border-radius:999px;
    background:currentColor!important;
    transition:transform .18s ease,opacity .18s ease;
  }
  .mobile-nav[open] > summary .burger-lines span:nth-child(1){
    transform:translateY(5px) rotate(45deg);
  }
  .mobile-nav[open] > summary .burger-lines span:nth-child(2){
    opacity:0;
  }
  .mobile-nav[open] > summary .burger-lines span:nth-child(3){
    transform:translateY(-5px) rotate(-45deg);
  }
  .mobile-nav > div{
    grid-area:panel;
    width:100%!important;
    position:static!important;
    left:auto!important;
    right:auto!important;
    top:auto!important;
    display:grid!important;
    gap:8px;
    max-height:0;
    overflow:hidden;
    opacity:0;
    padding:0!important;
    margin:0!important;
    border:0!important;
    border-radius:0!important;
    background:transparent!important;
    box-shadow:none!important;
    transition:max-height .28s ease,opacity .2s ease,padding .2s ease;
    pointer-events:auto;
  }
  .mobile-nav[open] > div{
    max-height:calc(100vh - 86px);
    overflow:auto;
    opacity:1;
    padding:8px 0 10px!important;
  }
  .mobile-nav nav{
    display:grid!important;
    grid-template-columns:1fr;
    gap:8px;
  }
  .mobile-nav nav a,
  .mobile-filter > summary,
  .mobile-filter .mobile-products > a,
  .mobile-filter .mobile-products > div a{
    min-height:48px;
    display:flex!important;
    align-items:center;
    width:100%;
    padding:12px 14px!important;
    border:1px solid var(--line)!important;
    border-radius:10px!important;
    background:#fff!important;
    color:var(--ink)!important;
    font-size:1rem;
    font-weight:800;
    line-height:1.25;
    text-decoration:none;
    box-shadow:none!important;
  }
  .mobile-nav nav a:hover,
  .mobile-filter > summary:hover,
  .mobile-filter .mobile-products a:hover{
    color:var(--green-dark)!important;
    background:#f6f8f6!important;
  }
  .mobile-filter{
    display:grid!important;
    gap:8px;
    margin:0;
    padding:0;
  }
  .mobile-filter > summary{
    cursor:pointer;
    list-style:none;
    color:var(--green-dark)!important;
    justify-content:space-between;
  }
  .mobile-filter > summary::-webkit-details-marker{
    display:none;
  }
  .mobile-filter > summary:after{
    content:"";
    width:10px;
    height:10px;
    border-right:2px solid currentColor;
    border-bottom:2px solid currentColor;
    transform:rotate(45deg);
    transition:transform .18s ease;
    margin-left:auto;
  }
  .mobile-filter[open] > summary:after{
    transform:rotate(225deg);
  }
  .mobile-filter .mobile-products{
    display:grid!important;
    gap:8px;
    margin:0!important;
    padding:0!important;
    border:0!important;
  }
  .mobile-filter .mobile-products > a{
    color:var(--green-dark)!important;
  }
  .mobile-filter .mobile-products > div{
    position:static!important;
    display:grid!important;
    grid-template-columns:1fr;
    gap:8px;
    width:100%!important;
    max-height:0;
    overflow:hidden;
    opacity:0;
    padding:0!important;
    margin:0!important;
    border:0!important;
    border-radius:0!important;
    background:transparent!important;
    box-shadow:none!important;
    transition:max-height .28s ease,opacity .2s ease;
  }
  .mobile-filter[open] .mobile-products > div{
    max-height:1200px;
    opacity:1;
  }
}

@media(max-width:380px){
  .header-inner{
    grid-template-columns:minmax(104px,1fr) 40px 40px 40px;
    gap:7px;
  }
  .mobile-nav{
    grid-template-columns:minmax(104px,1fr) 40px 40px 40px;
    gap:7px;
  }
  .brand-mark{
    width:108px;
    height:42px;
  }
  .mobile-actions .icon-btn,
  .mobile-nav > summary{
    width:40px!important;
    height:40px!important;
  }
}
