/* Shared compact layout covers phones, portrait tablets and large touch tablets. */
@media(max-width:899px),(pointer:coarse) and (max-width:1400px){
 body.regi,body.about{zoom:1}
 .regi .site-header{padding:24px 6vw;align-items:center}
 .regi .site-header .brand img{width:110px;height:42px}
 .regi .header-nav{font-size:14px;gap:20px}
 .regi .header-nav a{display:inline-flex;align-items:center;min-height:44px}
 .regi .contact-link{font-size:14px;min-height:46px;padding:0 20px;gap:20px}
 body.regi.enhanced #produkt .copy{left:7vw;right:7vw;width:auto;max-width:100%;top:128px;bottom:180px;justify-content:center;overflow:visible}
 body.regi[data-film] #produkt .copy h2{font-size:clamp(60px,7.8vw,100px);line-height:1;max-width:12ch;letter-spacing:-.055em}
 .regi #produkt .product-substeps,.regi #produkt .desktop-directions{display:none!important}
 .regi .product-examples button{display:none}
 .regi .product-examples .product-category-label{display:block;font-size:16px;line-height:1.5;color:var(--muted);padding:0}
 .regi .product-examples{margin-top:30px;gap:12px 28px;border:0}
 .regi .product-examples li{padding:0;border:0}
 .regi .chapters{left:7vw;right:7vw;bottom:100px;height:48px;gap:24px}
 .regi .chapters a{font-size:12px;min-height:44px}
 .regi .site-details{left:7vw;right:7vw;bottom:16px;min-height:66px;gap:4px 20px;flex-wrap:wrap;font-size:12px}
 .regi .site-details .company-details{font-size:11px;white-space:normal}
 .regi .site-details>a{min-height:32px}
 body.regi.enhanced #kontakt .copy{left:7vw;right:7vw;width:auto;top:124px;bottom:180px;display:grid;grid-template-columns:1fr;align-content:center;gap:24px;overflow-y:auto;scrollbar-width:none;justify-content:start}
 body.regi[data-film] #kontakt .copy h2{font-size:clamp(48px,7.8vw,88px);line-height:1}
 .regi #kontakt .description{font-size:18px;line-height:1.5;max-width:36ch;margin-top:18px}
 .regi .contact-person{justify-self:start;max-width:600px}
 .regi .contact-portrait figcaption{font-size:14px}.regi .contact-portrait figcaption span{font-size:12px}
 .regi .contact-person .direct-contact{margin-top:16px}
 .regi .contact-email{font-size:24px}.regi .contact-secondary{font-size:14px;gap:20px}
 .regi .portfolio-form{max-width:520px;margin-top:22px}
 .regi .portfolio-form label{font-size:20px}.regi .portfolio-form p{font-size:14px;line-height:1.5}
 .regi .portfolio-field input{font-size:16px;min-height:48px}.regi .portfolio-field button{font-size:14px;min-height:48px}
 body.about{font-size:17px}.about p{font-size:17px;line-height:1.65}.about .intro{font-size:19px}
 .about nav{font-size:14px}.about h1{font-size:clamp(42px,6.5vw,82px)}.about h2{font-size:clamp(30px,4vw,46px)}
 .about .about-footer{font-size:13px}.about .about-footer p{font-size:12px}
}
@media(max-width:650px){
 .regi .site-header{padding:18px 24px;gap:16px}
 .regi .site-header .brand img{width:96px;height:36px}
 .regi .header-nav{font-size:12px;gap:12px}.regi .contact-link{font-size:12px;padding:0 14px;gap:12px}
 body.regi.enhanced #produkt .copy{left:24px;right:24px;top:106px;bottom:165px}
 body.regi[data-film] #produkt .copy h2{font-size:clamp(40px,11.5vw,68px);max-width:100%}
 .regi .product-examples{gap:10px 22px;margin-top:26px}.regi .product-examples .product-category-label{font-size:14px}
 .regi .chapters{left:24px;right:24px;bottom:104px;gap:16px}.regi .chapters a{font-size:11px}
 .regi .site-details{left:24px;right:24px;bottom:10px;min-height:78px;gap:0 14px;font-size:11px}
 .regi .site-details .company-details{font-size:10px;flex-basis:100%}.regi .site-details>a{min-height:32px}
 body.regi.enhanced #kontakt .copy{left:24px;right:24px;top:98px;bottom:166px;display:flex;gap:18px;justify-content:flex-start;padding-bottom:12px}
 body.regi[data-film] #kontakt .copy h2{font-size:clamp(42px,11vw,60px)}
 .regi #kontakt .description{font-size:16px;margin-top:12px}
 .regi .contact-email{font-size:22px}.regi .contact-secondary{font-size:13px}
 .regi .contact-person{flex-shrink:0}.regi .portfolio-form{margin-top:18px}
 .regi .portfolio-form label{font-size:18px}.regi .portfolio-form p{font-size:14px}
 .about .about-header{padding:18px 24px}.about main{padding:48px 24px}.about .about-section{grid-template-columns:1fr}
}
@media(max-height:600px) and (min-width:651px){
 body.regi.enhanced #produkt .copy{top:96px;bottom:140px}
 body.regi[data-film] #produkt .copy h2{font-size:clamp(40px,8vh,58px);max-width:20ch}
 .regi .product-examples{margin-top:16px}
}

.regi .chapters a span{font-size:12px;line-height:1.4}
@media(max-width:650px){.regi .chapters a span{font-size:11px}}
@media(max-width:899px),(pointer:coarse) and (max-width:1400px){
 .product-exhibit-rail{bottom:calc(18px + env(safe-area-inset-bottom));width:calc(100vw - 48px);height:auto;min-height:80px;padding:12px 16px;background:rgb(20 18 22 / .94);border:1px solid #c4afe826;border-radius:12px;box-sizing:border-box;gap:8px 16px}
 .exhibit-position{display:grid;grid-template-columns:auto;gap:4px;text-align:right;justify-content:end}
 .exhibit-position .exhibit-count{display:block;font-size:14px;font-weight:600;line-height:1.2;letter-spacing:0;color:#f2eee8}
 .exhibit-position strong{display:none}.exhibit-position p{font-size:13px;color:#c4afe8;margin:0}
 .exhibit-position .product-exhibit-concept{display:none}.exhibit-back{min-height:44px;font-size:13px}.exhibit-progress{height:3px}
}

@media(max-width:650px) and (max-height:750px){
 body.regi.enhanced #kontakt .copy{top:94px;gap:12px}
 body.regi[data-film] #kontakt .copy h2{font-size:36px}
 .regi #kontakt .description{font-size:14px;line-height:1.45;margin-top:8px}
 .regi .contact-portrait img{width:36px;height:36px;flex-basis:36px}
 .regi .contact-person .direct-contact{margin-top:10px}
 .regi .contact-email{font-size:20px;min-height:30px}
 .regi .contact-secondary{margin-top:4px;gap:14px}.regi .contact-secondary a{min-height:32px}
 .regi .portfolio-form{margin-top:12px}.regi .portfolio-form p{margin:4px 0 6px;font-size:13px}
 .regi .portfolio-field{min-height:44px}.regi .portfolio-field input,.regi .portfolio-field button{min-height:44px}
}

@media(min-width:900px) and (pointer:fine){
 .regi .header-nav,.regi .contact-link{font-size:14px}
 .regi .product-examples button{font-size:15px;min-height:44px}
 .regi .product-substeps button{font-size:13px;min-height:44px}
 .regi .desktop-directions button{font-size:12px;min-height:44px;padding:10px 12px}
 .regi .site-details,.regi .site-details .company-details{font-size:12px}
 .regi .portfolio-form label{font-size:20px}.regi .portfolio-form p{font-size:15px;line-height:1.5}
 .regi .portfolio-field input{font-size:16px}.regi .portfolio-field button{font-size:14px;min-height:48px}
 .regi #kontakt .description{font-size:18px;line-height:1.5}
 .about p{font-size:17px;line-height:1.65}.about nav{font-size:14px}
}

/* Small laptops keep the desktop composition, including at OS display scaling. */
@media(min-width:900px) and (max-width:1500px) and (pointer:fine){
 body.regi{zoom:1}
 .regi .site-header{padding:clamp(16px,3vh,28px) 14.5vw;align-items:center}
 .regi .site-header .brand img{width:clamp(76px,7vw,110px);height:auto}
 .regi .header-nav,.regi .contact-link{font-size:12px}
 .regi .contact-link{min-height:38px;padding:0 18px;gap:18px}
 body.regi.enhanced #produkt .copy{left:16vw;right:auto;width:29vw;max-width:none;top:84px;bottom:112px;transform:none!important;display:flex;flex-direction:column;justify-content:center;overflow:visible}
 body.regi[data-film] #produkt .copy h2{font-size:clamp(32px,min(4vw,8vh),76px);max-width:100%;line-height:1}
 .regi .product-examples{margin-top:clamp(14px,3vh,28px);gap:18px}
 .regi .product-examples button{display:block;font-size:12px;min-height:34px}
 .regi .product-examples .product-category-label{display:none}
 .regi #produkt .product-substeps:not([hidden]),.regi #produkt .desktop-directions:not([hidden]){display:flex!important;flex-wrap:wrap;gap:8px;margin-top:12px}
 .regi .product-substeps button{font-size:11px;min-height:30px}
 .regi .desktop-directions button{font-size:10px;min-height:32px;padding:7px 8px}
 .regi .chapters{left:16vw;right:16vw;bottom:62px;height:38px;gap:24px}
 .regi .chapters a,.regi .chapters a span{font-size:10px;min-height:32px}
 .regi .site-details{left:16vw;right:16vw;bottom:12px;min-height:34px;font-size:9px;gap:12px}
 .regi .site-details .company-details{font-size:9px}
 body.regi.enhanced #kontakt .copy{left:16vw;right:16vw;top:86px;bottom:112px;width:auto;display:grid;grid-template-columns:1fr 1fr;gap:5vw;align-content:center;transform:none!important}
 body.regi[data-film] #kontakt .copy h2{font-size:clamp(34px,min(5vw,8vh),72px)}
 .regi #kontakt .description{font-size:clamp(12px,1.2vw,16px);line-height:1.5;margin-top:16px}
 .regi .contact-portrait img{width:34px;height:34px;flex-basis:34px}
 .regi .contact-person .direct-contact{margin-top:12px}
 .regi .contact-email{font-size:clamp(18px,1.9vw,26px)}
 .regi .contact-secondary{font-size:11px;margin-top:6px}
 .regi .portfolio-form{margin-top:16px}
 .regi .portfolio-form label{font-size:16px}.regi .portfolio-form p{font-size:12px;margin:6px 0}
 .regi .portfolio-field input{font-size:16px}.regi .portfolio-field button{font-size:11px;min-height:40px}
}

.regi #produkt .product-substeps[hidden],.regi #produkt .desktop-directions[hidden]{display:none!important}
.tour-arrows{position:fixed;right:3vw;bottom:110px;z-index:40;display:flex;gap:8px}
.tour-arrows button{width:44px;height:44px;display:grid;place-items:center;background:#17141ce6;color:#eae2f2;border:1px solid #c4afe84a;border-radius:50%;font:22px/1 system-ui;cursor:pointer;transition:background 160ms ease,transform 160ms ease}
.tour-arrows button:hover{background:#362d43}.tour-arrows button:active{transform:scale(.95)}
.tour-arrows button:focus-visible{outline:2px solid #c4afe8;outline-offset:4px}
@media(max-width:899px),(pointer:coarse) and (max-width:1400px){.tour-arrows{right:24px;bottom:164px}}
@media(prefers-reduced-motion:reduce){.tour-arrows button{transition:none}}