/* Stoffstudie im Einstieg der Innovationsseite, aus der Codex-Fassung (2334f25) übernommen und auf den Einstieg begrenzt. */
.atelier-hero{background:var(--sand);overflow:hidden}
.atelier-hero-inner{max-width:1700px;display:grid;grid-template-columns:5fr 7fr;align-items:center;gap:clamp(28px,5vw,90px);padding-block:50px}
.atelier-copy{display:grid;gap:30px;justify-items:start;padding-block:48px}
.atelier-copy p{color:var(--ink-2);max-width:39ch}
.fabric-study{position:relative;background:#eae7de;color:#273943;min-width:0}
.fabric-topline{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:24px 28px 0;font-size:12px;letter-spacing:.025em}
.fabric-topline button{font-size:12px;text-decoration:underline;text-underline-offset:4px;padding:6px 0}
.fabric-stage{position:relative;height:clamp(390px,42vw,610px);overflow:hidden;isolation:isolate}
.fabric-stage::before{content:"";position:absolute;inset:8% 9% 12%;border:1px solid #b6ae9c65;pointer-events:none}
.fabric-stage::after{content:"";position:absolute;width:63%;height:12%;left:22%;bottom:7%;background:radial-gradient(ellipse,#64564930,transparent 67%);z-index:-1}
.fabric-ruler{position:absolute;top:8%;left:6%;height:80%;width:10px;border-left:1px solid #b6ae9c;background:repeating-linear-gradient(to bottom,transparent 0 19px,#b6ae9c 19px 20px);opacity:.6}
#fabric-canvas{display:block;width:100%;height:100%;cursor:grab;touch-action:pan-y}
#fabric-canvas:active{cursor:grabbing}
.fabric-fallback{position:absolute;inset:20% 5%;width:90%;height:auto}
.fabric-fallback[hidden],#fabric-canvas[hidden],.fabric-controls[hidden]{display:none}
.fabric-coordinate{position:absolute;left:28px;bottom:12px;font-size:10px;letter-spacing:.2em;color:#5b5a51;pointer-events:none}
.fabric-controls{display:flex;justify-content:space-between;align-items:center;gap:24px;padding:12px 28px 24px}
.fabric-swatches{display:flex;gap:20px}
.fabric-swatches button{display:grid;justify-items:center;gap:8px;padding:0;font-size:12px}
.swatch{display:block;width:30px;height:30px;border:2px solid transparent;outline:1px solid #b2a994;outline-offset:3px}
.fabric-swatches button[aria-pressed="true"] .swatch{outline:2px solid #253942;outline-offset:4px}
.swatch-linen{background:repeating-linear-gradient(90deg,#bdaa8c 0 1px,#cbbc9e 1px 3px)}
.swatch-twill{background:repeating-linear-gradient(135deg,#324354 0 1px,#41576a 1px 3px)}
.swatch-stripe{background:repeating-linear-gradient(90deg,#e4d8bc 0 5px,#384e5b 5px 8px)}
.fabric-fold{display:grid;gap:10px;max-width:150px;font-size:12px}
.atelier-copy h1{font-size:clamp(56px,5.8vw,96px);line-height:1.04;font-weight:400;letter-spacing:-.025em;text-transform:none}
.atelier-copy h1 i{font-size:.78em;display:inline-block;margin-top:8px;font-weight:300;white-space:nowrap}
.atelier-copy p{font-size:18px;line-height:1.7}
#fabric-study input[type=range]{width:100%;height:16px;accent-color:#96714f;cursor:ew-resize;margin:0}
/* Inhaltsnavigation als Webkante unter der Studie statt über dem Film */
.atelier-hero .inno-index{position:static;justify-content:space-between;gap:10px 24px;padding:18px max(clamp(16px,5vw,64px),calc((100% - 1480px) / 2 + clamp(16px,5vw,64px)));border-block:1px dashed color-mix(in srgb,var(--ink) 20%,transparent)}
.atelier-hero .inno-index button{color:var(--ink-2);text-shadow:none;font-size:11px;letter-spacing:.2em}
.atelier-hero .inno-index b{color:var(--warm)}
@media(max-width:1050px){.atelier-hero-inner{gap:28px}.fabric-controls{flex-wrap:wrap}.fabric-fold{max-width:none;width:100%}.fabric-stage{height:430px}.atelier-copy p{font-size:16px}}
@media(max-width:760px){.atelier-hero-inner{grid-template-columns:1fr;padding-top:28px;padding-bottom:32px}.atelier-copy{padding-block:0 16px;gap:20px}.atelier-copy p{max-width:50ch}.fabric-topline{padding:18px 20px 0}.fabric-stage{height:390px}.fabric-controls{padding:12px 20px 24px;flex-wrap:nowrap}.fabric-fold{width:110px}.fabric-swatches{gap:16px}.atelier-hero .inno-index{justify-content:center}.atelier-hero .inno-index button{font-size:12px}.fabric-topline button{padding:12px 0}}
@media(max-width:480px){.fabric-controls{display:grid;gap:20px}.fabric-swatches{justify-content:space-between;gap:8px}.fabric-swatches button{min-width:44px;min-height:58px}.fabric-fold{width:100%}.atelier-hero .inno-index button{min-height:44px;font-size:13px}}