.es-designs{display:block;background:#101216;color:#f4f5f7;padding:48px max(20px,calc((100vw - 1440px)/2)) 64px;line-height:1.5}
.es-designs *{box-sizing:border-box}.es-designs [hidden]{display:none!important}
.es-designs__intro{max-width:820px;margin-bottom:24px}.es-designs__eyebrow{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:#b5bdc7;margin:0 0 12px}
.es-designs h1{font-size:clamp(34px,5vw,62px);line-height:1.05;letter-spacing:-.035em;color:#fff;margin:0 0 18px}.es-designs__lead{font-size:18px;color:#d2d7de;margin:0 0 12px}.es-designs__material{font-size:14px;color:#aeb8c4;margin:0}
.es-design-nav{display:flex;flex-wrap:wrap;gap:10px;margin:24px 0 32px}.es-design-nav a{display:flex;align-items:center;gap:9px;padding:10px 16px;border:1px solid #454d57;border-radius:999px;color:#e7ecf2;text-decoration:none;font-size:14px;font-weight:700}.es-design-nav a[aria-current=page]{border-color:#e9f332;background:#e9f332;color:#0b0d10}.es-design-nav a:hover{border-color:#fff}
.es-design-dot{display:inline-block;position:relative;overflow:hidden;width:20px;height:20px;flex:none;border-radius:50%;box-shadow:inset 0 0 0 1px #ffffff70}.es-design-dot--metallic{background:linear-gradient(130deg,#2e343c,#fff 35%,#a1aab4 45%,#f7fbff 55%,#626f7e)}.es-design-dot--holo{background:conic-gradient(#ff8bab,#ffe99a,#9ff7e6,#91c4ff,#d2acff,#ff8bab)}.es-design-dot--glow{background:#c8ff4d;box-shadow:0 0 12px #c6ff4d88,inset 0 0 5px #fff}.es-design-dot--reflex{background:linear-gradient(135deg,#62788d,#fff 38%,#f2faff 48%,#8b9bab 53%,#243848)}.es-design-dot--reflex:after{content:'';position:absolute;inset:-30%;background:linear-gradient(115deg,transparent 30%,#fff 50%,transparent 65%);animation:es-design-reflex 3.4s ease-in-out infinite}@keyframes es-design-reflex{0%,25%{transform:translateX(-90%);opacity:0}45%{opacity:1}70%,100%{transform:translateX(90%);opacity:0}}
.es-design-controls{display:flex;align-items:end;flex-wrap:wrap;gap:16px;margin:0 0 24px}.es-design-controls label{display:flex;flex-direction:column;gap:6px;font-size:12px;color:#bdc7d2}.es-design-controls label:first-child{flex:1;min-width:180px}.es-design-controls input,.es-design-controls select,.es-design-dialog input{border:1px solid #4b5664;border-radius:10px;padding:12px 14px;background:#191e25;color:#fff;font:inherit;font-size:15px;min-height:46px}.es-design-controls input{width:100%}.es-design-count{margin:0;padding:11px 0;color:#c8d0d9;font-size:14px;white-space:nowrap}
.es-design-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:22px}.es-design-card{border:1px solid #343c47;border-radius:15px;overflow:hidden;background:#191e25;transition:transform .18s,border-color .18s}.es-design-card:hover{transform:translateY(-3px);border-color:#9ba9b8}.es-design-card a{display:block;height:100%;color:#fff;text-decoration:none}.es-design-card figure{position:relative;aspect-ratio:1;margin:0;background:#11161c}.es-design-card img{display:block;width:100%;height:100%;object-fit:contain}.es-design-card__kind{position:absolute;left:10px;bottom:10px;padding:4px 8px;border-radius:6px;background:#0b0f14e8;color:#dce3ea;font-size:11px}.es-design-card__body{padding:17px}.es-design-card h2{margin:0 0 14px;font-size:17px;line-height:1.25;letter-spacing:.025em;overflow-wrap:anywhere;color:#fff}.es-design-card__cta{display:flex;justify-content:space-between;align-items:center;color:#e9f332;font-size:13px;font-weight:700}.es-design-card:focus-within{outline:2px solid #e9f332;outline-offset:3px}.es-design-empty{padding:35px 0;color:#d4dce5}
.es-design-footer{margin:36px 0 0;border-top:1px solid #343c47;padding-top:22px;display:flex;flex-wrap:wrap;gap:20px}.es-design-footer a{color:#e9f332;text-underline-offset:4px}.es-designs details{margin-top:26px;font-size:13px;color:#aeb8c4}.es-designs summary{cursor:pointer}.es-designs details p{max-width:850px}
.es-design-dialog{width:min(820px,calc(100vw - 28px));max-height:85vh;max-height:85dvh;margin:auto;padding:26px;border:1px solid #627181;border-radius:18px;color:#f4f7fa;background:#151b22;box-shadow:0 24px 100px #0009;overflow:auto}.es-design-dialog:not([open]){display:none}.es-design-dialog::backdrop{background:#04070cc9;backdrop-filter:blur(5px)}.es-design-dialog__top{display:flex;justify-content:space-between;align-items:start;gap:18px}.es-design-dialog h2{font-size:26px;line-height:1.2;margin:4px 0 12px;color:#fff}.es-design-dialog__close{font-size:28px;line-height:1;border:1px solid #5a6673;background:#222c37;color:#fff;border-radius:50%;width:40px;height:40px;flex:none;cursor:pointer}.es-design-dialog p{color:#c1ccd8;font-size:14px}.es-design-dialog input{width:100%;margin-bottom:16px}.es-design-models{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.es-design-model{padding:14px;border:1px solid #4e5f70;border-radius:10px;color:#f3f6fa;background:#202b36;text-decoration:none;font-size:13px;line-height:1.4}.es-design-model:hover,.es-design-model:focus-visible{color:#101216;background:#e9f332;border-color:#e9f332}.es-design-dialog [data-model-fallback]{color:#e9f332}
@media(max-width:1100px){.es-design-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:700px){.es-designs{padding:30px 14px 44px}.es-design-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.es-design-card__body{padding:12px}.es-design-card h2{font-size:14px}.es-design-card__kind{font-size:9px;left:7px;bottom:7px}.es-design-nav{gap:7px}.es-design-nav a{padding:9px 11px;font-size:12px}.es-design-count{flex-basis:100%;padding:0}.es-design-dialog{padding:20px}.es-design-models{grid-template-columns:1fr}.es-design-dialog h2{font-size:22px}}
@media(prefers-reduced-motion:reduce){.es-design-card{transition:none}.es-design-dot--reflex:after{animation:none}}
/* 10.11.2026 Claude: nur echte Effekt-Vorschauen (Inhaber 10.11.) */
es-material-designs:not([data-fx-ready]):has([data-design-more]) [data-design-preview=design]{display:none!important}
.es-design-sep{grid-column:1/-1;scroll-margin-top:90px;margin:16px 0 0;padding-top:20px;border-top:1px solid #343c47;color:#c8d0d9;font-size:15px;font-weight:700}
.es-design-more{margin:30px 0 0;padding:22px;border:1px dashed #4b5664;border-radius:15px;text-align:center}.es-design-more p{max-width:620px;margin:0 auto 14px;color:#c8d0d9;font-size:14px}.es-design-more__btn{display:inline-flex;align-items:center;justify-content:center;min-height:46px;padding:10px 22px;border:1px solid #e9f332;border-radius:999px;background:transparent;color:#e9f332;font:inherit;font-size:14px;font-weight:700;cursor:pointer}.es-design-more__btn:hover,.es-design-more__btn:focus-visible{background:#e9f332;color:#0b0d10}
@media(max-width:700px){.es-design-more{padding:16px 12px}.es-design-more p{font-size:13px}.es-design-sep{font-size:13px}}
.es-material-frame{display:block;position:relative;overflow:hidden;aspect-ratio:1;width:100%;background:#e9edf1}
.es-material-frame img{position:absolute;display:block;width:200%;height:200%;max-width:none;object-fit:fill;left:0;top:0}
.es-material-frame--metallic img{left:-100%}.es-material-frame--reflex img{top:-100%}.es-material-frame--glow img{left:-100%;top:-100%}
.es-design-card{display:flex;flex-direction:column}.es-design-card>a{height:auto;flex:1}.es-design-card figure{overflow:hidden}.es-design-card__kind{bottom:11px;left:10px;font-size:11px}
.es-design-detail-button{display:flex;justify-content:space-between;gap:8px;width:100%;border:0;border-top:1px solid #343c47;padding:12px 17px;background:#191e25;color:#c3ccd7;font:inherit;font-size:12px;cursor:pointer;text-align:left}.es-design-detail-button:hover,.es-design-detail-button:focus-visible{background:#27313d;color:#fff;outline:2px solid #e9f332;outline-offset:-2px}
.es-image-dialog{width:min(1120px,calc(100vw - 28px))}.es-image-dialog__views{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:24px;align-items:center}.es-image-dialog__hero{border-radius:12px}.es-image-dialog__detail h3{font-size:17px;color:#fff;margin:0 0 12px}.es-image-detail-frame{position:relative;overflow:hidden;width:100%;border:1px solid #46515e;border-radius:10px;background:#242a31}.es-image-detail-frame img{display:block;position:absolute;max-width:none;height:auto}.es-image-dialog .es-image-dialog__note{font-size:12px;color:#aeb8c4;margin-top:22px}
@media(max-width:700px){.es-design-detail-button{padding:11px 12px;font-size:11px}.es-image-dialog__views{grid-template-columns:1fr;gap:18px}.es-image-dialog__hero{width:min(100%,440px);margin:auto}}


.es-material-frame--single{background:#000}.es-material-frame--single img{width:100%;height:100%;left:0;top:0;object-fit:contain}