@charset "utf-8";
header,.rslides,.inpagebg{min-width:0}
header{display:flex;align-items:center;padding-inline:clamp(16px,4vw,50px)}
header>div{flex-shrink:0}header nav{float:none;display:flex}
a:focus-visible{outline:2px solid #333;outline-offset:4px}
.productlistout{position:relative;top:auto;padding:40px 24px 65px}
.productlistout>article{width:100%!important;max-width:1100px}
.productlist{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}
.productlist li{float:none;width:auto;margin:0;min-width:0}
.productlist a:focus-visible div{opacity:1}
.productlist h3,.productlist p,.productscroll{overflow-wrap:anywhere}
.productscroll{width:100%}
.page_num ul{display:flex;flex-wrap:wrap;gap:8px}
.page_num li{margin:0}
@media(max-width:1100px){.productlist{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:900px){
footer{position:relative;height:auto;padding:12px 24px;display:flex;gap:8px 24px;flex-wrap:wrap;line-height:1.6}
footer div{float:none;width:auto;flex:1 1 260px}
.rslides li{height:calc(100vh - 150px);height:calc(100svh - 150px);min-height:320px}
.rslides li>span{position:absolute!important;left:24px!important;right:24px;bottom:24px!important;font-size:22px!important;line-height:1.5;text-shadow:0 2px 6px #000}
.inpagebg{height:auto;min-height:calc(100vh - 150px);padding:48px 24px}
.sectionsize,.contactinfo{position:relative;top:auto;left:auto}
.groupinfo{width:min(100%,440px);font-size:16px;line-height:2;background:transparent;padding:24px}
.contactinfo{max-width:600px;padding:24px;background:transparent}
.contactinfo section{display:flex;align-items:center;gap:15px;font-size:16px;line-height:1.7}
.contactinfo section:last-child{padding-bottom:0}
.contactinfo div{flex:0 0 50px;float:none}
.contactinfo span{padding:0;min-width:0;overflow-wrap:anywhere}
.productintro{display:flex;flex-direction:column}
.productintro>article{position:relative;top:auto;left:auto;order:2;width:100%}
.productintro>.rslides{order:1}
.productintro .rslides li{height:clamp(240px,62vw,560px);min-height:0}
.productoutbg{width:100%;padding:32px 24px;background:#fff}
.productscroll{padding-top:24px;height:auto;overflow:visible;line-height:1.9}
.productscroll img,.productscroll iframe{max-width:100%}
.productscroll img{height:auto}
.productintro .rslides_nav{position:absolute;top:calc(clamp(240px,62vw,560px) - 60px);bottom:auto;right:70px;opacity:1}
.productintro .rslides_nav.next{right:24px}
}
@media(max-width:640px){
header{height:auto;padding:0 16px;flex-direction:column;align-items:flex-start}
header nav{width:100%;padding:0;justify-content:space-between}
header nav a{height:52px;width:33.333%;background-position:center bottom}
.productlistout{padding:24px 16px}
.productlist{grid-template-columns:minmax(0,1fr);gap:24px 16px}
.inpagebg{padding:32px 16px}.groupinfo,.contactinfo{padding:20px}
.groupinfo{background:rgba(255,255,255,.5)}
.contactinfo section{font-size:16px}
.productlist a{height:auto;padding:66.67% 0 0;background-size:100% auto;background-position:center top;background-repeat:no-repeat}
.productlist a:hover{background-size:100% auto}
.productlist div{position:relative;height:auto;padding:12px 0 0;background:#fff;color:#000;opacity:1}
.productlist h3{font-size:18px;line-height:1.5}.productlist p{font-size:16px;line-height:1.7}
footer{padding-inline:16px}footer div,footer div[style]{text-align:left!important}
.startlogo{background-size:min(55vw,220px) auto}
}
@media(max-width:380px){.productlist{grid-template-columns:minmax(0,1fr)}}
@media(hover:none) and (min-width:641px){.productlist div{opacity:1;top:auto;bottom:0;height:auto;background:rgba(0,0,0,.85)}}
@media(prefers-reduced-motion:reduce){.startlogo{display:none}.productlist a,.productlist div,nav{transition:none}}

.productlist a { color: inherit; text-decoration: none; }

@media(min-width:901px){.groupinfo{background:rgba(255,255,255,.5);padding:24px;width:378px}}

.groupinfo,.contactinfo section,.productintro p,.productscroll,.productlist p{font-size:16px}

.nav-toggle { display: none; }
@media(max-width:640px) {
  header { flex-direction: row; align-items: center; justify-content: space-between; flex-wrap: wrap; }
  .nav-ready .nav-toggle { display: inline-flex; flex-direction: column; justify-content: center; align-items: center; gap: 5px; width: 48px; height: 48px; padding: 12px; border: 0; background: #fff; color: #222; cursor: pointer; }
  .nav-toggle span { display: block; width: 24px; height: 2px; background: currentColor; }
  .nav-toggle:focus-visible { outline: 2px solid #333; outline-offset: 2px; }
  .nav-ready header nav { display: none; flex: 0 0 100%; }
  .nav-ready header.nav-open nav { display: flex; flex-direction: column; padding: 8px 0 16px; }
  .nav-ready header nav a { float: none; width: 100%; height: 52px; background-position: center center; }
  .nav-open .nav-toggle span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
  .nav-open .nav-toggle span:nth-child(2) { opacity: 0; }
  .nav-open .nav-toggle span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }
}

@media(max-width:640px){header{position:relative;z-index:100}.nav-ready header.nav-open nav{position:absolute;top:100%;left:0;right:0;width:100%;background:#fff;padding:8px 16px 16px}}

/* Works browsing: append the next batch without replacing the list. */
.works-pagination { clear: both; padding: 32px 0 16px; text-align: center; }
.works-status { margin: 0 0 16px; color: #444; font-size: 16px; line-height: 1.7; }
.works-more { display: inline-flex; align-items: center; justify-content: center; min-height: 48px; padding: 12px 32px; border: 1px solid #333; background: #fff; color: #222; text-decoration: none; font: inherit; }
.works-more:hover { background: #222; color: #fff; }
.works-more[aria-disabled="true"] { opacity: .6; cursor: wait; }
.works-more[hidden] { display: none; }
.works-previous { display: block; margin: 0 0 16px; color: #333; font-size: 16px; text-underline-offset: 4px; }
@media(max-width:640px) { .works-more { width: 100%; } }
