﻿@import url('https://fonts.googleapis.com/css2?family=Lato:wght@100;300;400;700;900&display=swap');
.wide-editorial{--glass-edge:rgba(255,255,255,.82);--glass-shadow:0 14px 34px -24px #243d3055;--glass-radius:18px;--frame-gradient:radial-gradient(ellipse at 10% 12%,#d9e1cb85,transparent 55%),radial-gradient(ellipse at 92% 90%,#e9d9bd85,transparent 55%)}
.wide-editorial body{font-family:'Lato',sans-serif;background-image:radial-gradient(ellipse at 8% 35%,#d9e1cb55,transparent 46%),radial-gradient(ellipse at 95% 70%,#e9d9bd55,transparent 42%);background-attachment:fixed}
.wide-editorial body .site-header{background:rgba(245,242,235,.79);backdrop-filter:blur(22px) saturate(135%);-webkit-backdrop-filter:blur(22px) saturate(135%);border-bottom:1px solid var(--glass-edge);box-shadow:0 5px 25px #243d3010}
.wide-editorial body :is(.gallery-card,.spec,.process-item,.feature-list>div){position:relative;border:2px solid var(--deep);border-radius:var(--glass-radius);background-color:rgba(255,253,248,.66);background-image:radial-gradient(320px circle at var(--pointer-x,50%) var(--pointer-y,0%),rgba(255,255,255,.52),transparent 70%),var(--frame-gradient);box-shadow:var(--glass-shadow),inset 0 1px 0 #fff;backdrop-filter:blur(14px) saturate(115%);-webkit-backdrop-filter:blur(14px) saturate(115%);overflow:hidden}
.wide-editorial body .gallery-card img{border-radius:0;background:transparent}
.wide-editorial body .gallery-card>div{padding:24px 18px}
.wide-editorial body .gallery-card p{color:#4e5b50}
.wide-editorial body .card{position:relative;border:1px solid var(--deep);border-radius:var(--glass-radius);overflow:hidden;background-color:#fffdf8;background-image:var(--frame-gradient);box-shadow:var(--glass-shadow)}
.wide-editorial body .split-image{border:1px solid var(--deep);border-radius:var(--glass-radius);box-shadow:var(--glass-shadow);background-color:#e9e7df;background-image:var(--frame-gradient)}
.wide-editorial body .step-frame{border:1px solid var(--deep);border-radius:12px;background-color:#fffdf8;background-image:var(--frame-gradient)}
.wide-editorial body .display-banner-header{margin-bottom:30px;justify-content:flex-start;align-items:flex-end;gap:15px}
.wide-editorial body .display-banner-text{width:420px;flex:none}
.wide-editorial body .display-banner-text h2{max-width:100%}
.wide-editorial body .display-banner{position:relative;border:1px solid var(--deep);border-radius:var(--glass-radius);overflow:hidden;box-shadow:var(--glass-shadow);min-height:500px}
.wide-editorial body .display-banner-images{position:absolute;left:0;right:0;top:50%;height:600px;transform:translateY(-50%);display:grid;grid-template-columns:repeat(3,1fr)}
.wide-editorial body .display-banner-images img{width:100%;height:100%;object-fit:contain;object-position:center;padding:36px}
.wide-editorial body .step-frame img{background:transparent}
.wide-editorial body .card-image{position:static;height:360px;display:flex;align-items:center;justify-content:center;padding:26px;background:transparent}
.wide-editorial body .card-image img{width:auto;height:auto;max-width:72%;max-height:100%;object-fit:contain;margin:0 auto}
.wide-editorial body .card-body{padding:6px 26px 32px;text-align:left}
.wide-editorial body .card-body h3{color:var(--ink)}
.wide-editorial body .card-body p{color:#59635a}
.wide-editorial body .card .text-link{display:inline-flex;align-items:center;gap:12px;margin-top:16px;padding:14px 22px;border-radius:11px;border:1px solid #ffffff4d;background:linear-gradient(135deg,#456652,#243d30);color:#fffdf5;font-size:12px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;box-shadow:0 5px 14px -9px #152c2499,inset 0 1px 0 #ffffff40}
.wide-editorial body .card .text-link .arrow{color:#e3803f;font-size:15px;line-height:1}
.wide-editorial body .process{background:transparent;border:0;gap:14px}
.wide-editorial body .dark .process-item{background-color:rgba(249,250,239,.89)}
.wide-editorial body .contact-companies{display:grid;gap:18px;margin-top:26px;padding-top:22px;border-top:1px solid rgba(255,255,255,.22)}
.wide-editorial body .contact-company h3{margin:0 0 4px;font-family:'Lato',sans-serif;font-size:16px;font-weight:600;color:#fffdf8}
.wide-editorial body .contact-company p{margin:0;color:#c4d0bb;line-height:1.6}
.wide-editorial body .contact-company a{color:#dbeeb8}
.wide-editorial body .map-frame{position:relative;height:420px;border:1px solid var(--deep);border-radius:var(--glass-radius);overflow:hidden;box-shadow:var(--glass-shadow)}
.wide-editorial body .map-frame iframe{position:absolute;inset:0;width:100%;height:100%;border:0;filter:grayscale(.15) contrast(1.02)}
.wide-editorial body .section-header.stacked{display:block;text-align:center}
.wide-editorial body .section-header.stacked h2{margin-left:auto;margin-right:auto}
.wide-editorial body .section-header.stacked p{margin:14px auto 0;max-width:600px}
.wide-editorial body .section:has(> .container > .section-header.stacked){padding-bottom:20px}
.wide-editorial body .footer-company p{margin:0 0 12px;color:#aebba6;line-height:1.8;font-family:'Lato',sans-serif}
.wide-editorial body .footer-company p:last-child{margin-bottom:0}
.wide-editorial body .footer-grid p,.wide-editorial body .footer-grid a{font-family:'Lato',sans-serif}
.wide-editorial body .footer-grid h3{font-size:16px;line-height:1.3;margin:0 0 20px}
.wide-editorial body .footer-bottom{margin-top:16px;padding-top:14px}
.wide-editorial body .footer-company h3{white-space:nowrap}
.wide-editorial body .footer-mail{display:inline-flex;align-items:center;gap:8px}
.wide-editorial body .mail-icon{width:16px;height:13px;flex:none;color:#aebba6}
.wide-editorial body .footer-grid{grid-template-columns:1.15fr 1.5fr .8fr 1fr;gap:24px}
.wide-editorial body .footer-grid h3 a{display:inline;color:inherit;font-size:inherit;font-weight:inherit;font-family:inherit;line-height:inherit}
.wide-editorial body .footer-grid>div>a{display:block}
.wide-editorial body .capability-list{display:grid;grid-template-columns:repeat(3,1fr);gap:12px 32px;list-style:none;margin:0;padding:0}
.wide-editorial body .capability-list li{position:relative;padding-left:20px;color:var(--ink);line-height:1.5}
.wide-editorial body .capability-list li::before{content:'';position:absolute;left:0;top:9px;width:7px;height:7px;border-radius:50%;background:var(--deep)}
@media(max-width:760px){.wide-editorial body .capability-list{grid-template-columns:1fr 1fr}}
.wide-editorial body .contact-box{border-radius:var(--glass-radius);background:linear-gradient(135deg,#375d4ae8,#243d30f2);border:1px solid #ffffff55;box-shadow:var(--glass-shadow),inset 0 1px 0 #ffffff44;backdrop-filter:blur(16px)}
.wide-editorial body :is(.btn,.language-button){border-radius:10px;border:1px solid #ffffff4d;background:linear-gradient(135deg,#456652,#243d30);color:#fffdf5;box-shadow:0 5px 14px -9px #152c2499,inset 0 1px 0 #ffffff40}
.wide-editorial body :is(.btn.outline,.language-button){background:linear-gradient(135deg,#ffffffad,#ebeedd8c);color:var(--deep);border-color:#ffffffdf}
.wide-editorial body .language-picker .languages{background:#faf8f0eb;border:1px solid #fff;border-radius:12px;backdrop-filter:blur(20px);box-shadow:0 16px 40px #243d3020}
.wide-editorial body .language-picker .languages a{border-radius:7px}
.wide-editorial body .main-nav>a{border-radius:7px;padding:7px 0}
.wide-editorial body .main-nav>a[href*="materialien"]{position:relative}
.wide-editorial body .main-nav>a[href*="materialien"]::before{content:'';position:absolute;top:-9px;right:-2px;left:auto;width:14px;height:14px;background:#8bbf1f;border-radius:0 70% 0 70%;transform:rotate(-18deg);box-shadow:inset -1px -1px 0 rgba(0,0,0,.1)}
.wide-editorial body .gallery-open{border-radius:12px}
.wide-editorial body .menu-toggle{border-radius:7px}
.wide-editorial body .product-dialog{background:#f7f5eeef;border:1px solid white;box-shadow:0 24px 90px #0c211a50;backdrop-filter:blur(20px)}
.wide-editorial body .form :is(input,textarea,select){background:#fffdf9aa;border:1px solid #ffffff;border-radius:10px;box-shadow:inset 0 1px 3px #243d3010}
.wide-editorial body :is(.card,.gallery-card,.spec,.process-item,.feature-list>div):focus-within{border-color:#819d87;box-shadow:0 10px 26px #243d3020}
.wide-editorial body .main-nav>a,.wide-editorial body .btn,.wide-editorial body .language-button,.wide-editorial body .text-link,.wide-editorial body .kicker,.wide-editorial body .eyebrow{font-family:'Lato',sans-serif}
.wide-editorial body .cards,.wide-editorial body .gallery{gap:clamp(18px,2vw,28px)}
.wide-editorial body .card,.wide-editorial body .gallery-card{min-height:clamp(430px,34vw,560px);display:flex;align-items:flex-end;border:1px solid rgba(255,255,255,.72);border-radius:22px;background:#1d3027;box-shadow:0 24px 60px -32px #152c2475,inset 0 1px 0 rgba(255,255,255,.58);isolation:isolate}
.wide-editorial body .card::before,.wide-editorial body .gallery-card::before{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(10,20,16,.04) 0%,rgba(10,20,16,.15) 42%,rgba(10,20,16,.76) 100%)}
.wide-editorial body .card::after,.wide-editorial body .gallery-card::after{content:'';position:absolute;inset:1px;z-index:-2;border-radius:21px;background:radial-gradient(circle at var(--pointer-x,50%) var(--pointer-y,20%),rgba(255,255,255,.24),transparent 34%)}
.wide-editorial body .card-image,.wide-editorial body .gallery-card>img{position:absolute;inset:0;z-index:-3;width:100%;height:100%;padding:0;background:#d8d7cf}
.wide-editorial body .card-image img,.wide-editorial body .gallery-card>img{width:100%;height:100%;max-width:none;max-height:none;object-fit:cover;object-position:center;filter:saturate(.95) contrast(1.02)}
.wide-editorial body .card-body,.wide-editorial body .gallery-card>div{width:calc(100% - 28px);margin:14px;padding:22px 22px 24px;border:1px solid rgba(255,255,255,.62);border-radius:16px;background:linear-gradient(135deg,rgba(255,253,248,.78),rgba(245,242,235,.56));box-shadow:inset 0 1px 0 rgba(255,255,255,.74),0 16px 34px -28px #13251f;backdrop-filter:blur(18px) saturate(130%);-webkit-backdrop-filter:blur(18px) saturate(130%)}
.wide-editorial body .card-body h3,.wide-editorial body .gallery-card h3{font-family:'Lato',sans-serif;font-size:clamp(20px,1.5vw,28px);font-weight:800;letter-spacing:0;line-height:1.05;color:#14271f;text-transform:uppercase;text-wrap:balance}
.wide-editorial body .card-body p,.wide-editorial body .gallery-card p{color:#314137;font-size:13px;line-height:1.55;text-wrap:pretty}
.wide-editorial body .card .text-link{margin-top:10px;border-radius:12px;background:linear-gradient(135deg,rgba(255,253,248,.72),rgba(255,255,255,.34));color:#1f3a2e;border-color:rgba(255,255,255,.72);box-shadow:inset 0 1px 0 rgba(255,255,255,.8),0 10px 22px -18px #13251f}
.wide-editorial body .card .text-link .arrow{color:#c76228}
@media(hover:hover) and (pointer:fine){
.wide-editorial body :is(.spec,.process-item,.feature-list>div,.contact-box){transition:transform .35s cubic-bezier(.16,1,.3,1),box-shadow .35s cubic-bezier(.16,1,.3,1),border-color .35s cubic-bezier(.16,1,.3,1)}
.wide-editorial body :is(.spec,.process-item,.feature-list>div,.contact-box):hover{transform:translateY(-5px);border-color:#bed0b9;box-shadow:0 22px 44px -24px #243d3070,inset 0 1px 0 white}
.wide-editorial body :is(.btn,.language-button,.menu-toggle,.gallery-open,.main-nav>a,.language-picker a,.text-link){transition:transform .3s cubic-bezier(.16,1,.3,1),box-shadow .3s cubic-bezier(.16,1,.3,1),background-color .3s cubic-bezier(.16,1,.3,1),color .3s cubic-bezier(.16,1,.3,1)}
.wide-editorial body :is(.btn,.language-button,.menu-toggle):hover{transform:translateY(-2px);box-shadow:0 10px 22px -12px #243d3070,inset 0 1px 0 #ffffff80}
.wide-editorial body :is(.main-nav>a,.language-picker a,.text-link):hover{color:#a04b20;background-color:#ffffff55}
.wide-editorial body .card .text-link:hover{transform:translateY(-2px);color:#1f3a2e;background:linear-gradient(135deg,rgba(255,253,248,.86),rgba(255,255,255,.52))}
}
.wide-editorial body :is(.btn,.language-button,.menu-toggle):active{transform:translateY(1px)}
@media(max-width:1250px){.wide-editorial body .navigation-row .main-nav.open{background:#f5f2ebf5;backdrop-filter:blur(22px);border-color:#ffffff;box-shadow:0 20px 32px #243d3018}}
@media(max-width:760px){.wide-editorial body .display-banner{min-height:480px}.wide-editorial body .display-banner-images{grid-template-columns:1fr;grid-auto-rows:1fr}.wide-editorial body .display-banner-header{display:block}.wide-editorial body .display-banner-header .btn{margin-top:16px}.wide-editorial body .card,.wide-editorial body .gallery-card{min-height:380px;border-radius:18px}.wide-editorial body .card-body,.wide-editorial body .gallery-card>div{width:calc(100% - 22px);margin:11px;padding:18px}.wide-editorial body .card-body h3,.wide-editorial body .gallery-card h3{font-size:20px}}
@media(prefers-reduced-motion:reduce){
.wide-editorial body :is(.card,.gallery-card,.spec,.process-item,.feature-list>div,.contact-box,.btn,.language-button,.menu-toggle,.gallery-open,.main-nav>a,.language-picker a,.text-link,.card-image img){transition:none!important;translate:none!important;scale:none!important}
}
@supports not (backdrop-filter:blur(1px)){
.wide-editorial body .site-header,.wide-editorial body .language-picker .languages{background:#f5f2eb}
.wide-editorial body :is(.card,.gallery-card,.spec,.process-item,.feature-list>div){background-color:#faf8f2}
}

@media(max-width:760px){.wide-editorial body .display-banner-text,.wide-editorial body .display-banner-text h2,.wide-editorial body .display-banner-text p{width:100%;max-width:100%;}}

/* Keep product photos fully visible while preserving the glass-card style. */
.wide-editorial body .card,.wide-editorial body .gallery-card{flex-direction:column;align-items:stretch;justify-content:space-between;min-height:auto;background:linear-gradient(145deg,#eef0e8,#d7d8cf)}
.wide-editorial body .card::before,.wide-editorial body .gallery-card::before{background:linear-gradient(180deg,rgba(255,255,255,.18) 0%,rgba(18,35,29,.08) 100%)}
.wide-editorial body .card-image,.wide-editorial body .gallery-card>img{position:relative;inset:auto;z-index:0;width:100%;height:clamp(320px,27vw,500px);padding:clamp(10px,1.1vw,20px);display:flex;align-items:center;justify-content:center;overflow:hidden;background:radial-gradient(ellipse at 50% 42%,#f5f3eb 0%,#d6d8cf 72%)}
.wide-editorial body .card-image img,.wide-editorial body .gallery-card>img{width:100%;height:100%;max-width:100%;max-height:100%;object-fit:contain;object-position:center;transform:translateZ(0) scale(1.14);transform-origin:center}
.wide-editorial body .card-body,.wide-editorial body .gallery-card>div{position:relative;z-index:1;margin:0 14px 14px;width:calc(100% - 28px)}
@media(max-width:760px){.wide-editorial body .card-image,.wide-editorial body .gallery-card>img{height:300px;padding:12px}.wide-editorial body .card-body,.wide-editorial body .gallery-card>div{margin:0 11px 11px;width:calc(100% - 22px)}.wide-editorial body .card-image img,.wide-editorial body .gallery-card>img{transform:translateZ(0) scale(1.08)}}

/* Card readability polish. */
.wide-editorial body .card-body,
.wide-editorial body .gallery-card>div{
  padding:16px 18px 18px;
  min-height:0;
  backdrop-filter:blur(10px) saturate(112%);
  -webkit-backdrop-filter:blur(10px) saturate(112%);
}
.wide-editorial body .card-body h3,
.wide-editorial body .gallery-card h3{
  font-size:clamp(17px,1.08vw,22px);
  line-height:1.1;
  font-weight:800;
  margin-bottom:8px;
}
.wide-editorial body .card-body p,
.wide-editorial body .gallery-card p{
  font-size:12px;
  line-height:1.45;
  margin-bottom:12px;
}
.wide-editorial body .card .text-link{
  margin-top:4px;
  padding:11px 16px;
  min-height:40px;
  font-size:11px;
}
@media(max-width:760px){
  .wide-editorial body .card-body,
  .wide-editorial body .gallery-card>div{
    padding:14px 15px 15px;
  }
  .wide-editorial body .card-body h3,
  .wide-editorial body .gallery-card h3{
    font-size:18px;
  }
}

/* Single, smooth hover system: one transition, one easing, no competing rules. */
.wide-editorial body .card,
.wide-editorial body .gallery-card{
  transition:box-shadow .4s cubic-bezier(.16,1,.3,1),border-color .4s cubic-bezier(.16,1,.3,1);
  will-change:box-shadow;
}
.wide-editorial body .card-image img,
.wide-editorial body .gallery-card>img{
  transition:transform .5s cubic-bezier(.16,1,.3,1);
  will-change:transform;
}
@media(hover:hover) and (pointer:fine){
  .wide-editorial body .card:hover,
  .wide-editorial body .gallery-card:hover{
    border-color:rgba(255,255,255,.9);
    box-shadow:0 20px 42px -30px #243d3066,inset 0 1px 0 white;
  }
  .wide-editorial body .card:hover .card-image img,
  .wide-editorial body .gallery-card:hover>img{
    transform:translateZ(0) scale(1.18);
  }
}


