.ninagrafie-inspiration{max-width:1240px;margin:34px auto 70px;padding:0 22px;color:#292b26}.ninagrafie-inspiration *{box-sizing:border-box}.ninagrafie-inspiration__intro{display:flex;justify-content:space-between;gap:30px;align-items:flex-end;margin-bottom:24px}.ninagrafie-inspiration__eyebrow,.ninagrafie-inspiration__section-head span,.ninagrafie-inspiration-card__label,.ninagrafie-inspiration-card__preview-label{font-size:11px;letter-spacing:.12em;text-transform:uppercase;font-weight:700;color:#6c735f}.ninagrafie-inspiration h1{margin:4px 0 8px;font-size:34px}.ninagrafie-inspiration__intro p{max-width:760px;margin:0;color:#666}.ninagrafie-inspiration__tools,.ninagrafie-inspiration__jump{display:flex;gap:8px;flex-wrap:wrap}.ninagrafie-inspiration__tools a,.ninagrafie-inspiration__jump a{border:1px solid #d8d5cb;border-radius:999px;padding:8px 13px;text-decoration:none;color:#41453a;background:#fff;font-size:13px}.ninagrafie-inspiration__tools .is-active{background:#59634c;color:#fff;border-color:#59634c}.ninagrafie-inspiration__jump{margin:20px 0 38px}.ninagrafie-inspiration__section{scroll-margin-top:30px;margin-bottom:54px}.ninagrafie-inspiration__section-head{display:grid;grid-template-columns:minmax(220px,.8fr) minmax(280px,1.2fr);gap:30px;align-items:end;border-bottom:1px solid #d9d5ca;padding-bottom:12px;margin-bottom:18px}.ninagrafie-inspiration__section-head h2{margin:3px 0 0}.ninagrafie-inspiration__section-head p{margin:0;color:#6d6b64}.ninagrafie-inspiration__grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}.ninagrafie-inspiration-card{border:1px solid #ddd9cf;border-radius:12px;background:#fff;overflow:hidden;min-width:0}.ninagrafie-inspiration-card>header{padding:19px 19px 15px}.ninagrafie-inspiration-card h3{margin:4px 0 7px;font-size:18px}.ninagrafie-inspiration-card>header p{margin:0;color:#666;font-size:13px;line-height:1.5}.ninagrafie-inspiration-card__code{background:#f4f2ed;border-top:1px solid #e1ddd3;border-bottom:1px solid #e1ddd3}.ninagrafie-inspiration-card__code-head{display:flex;justify-content:space-between;align-items:center;padding:8px 12px 0;font-size:10px;font-weight:800;letter-spacing:.09em;text-transform:uppercase;color:#777}.ninagrafie-inspiration-card__code-head button{appearance:none;border:0;background:transparent;color:#7f2435;font:inherit;text-transform:lowercase;letter-spacing:0;cursor:pointer;padding:3px 5px}.ninagrafie-inspiration-card pre{margin:0;padding:8px 12px 13px;white-space:pre-wrap;overflow-wrap:anywhere;font-size:11px;line-height:1.45}.ninagrafie-inspiration-card__preview{padding:17px 19px 20px}.ninagrafie-inspiration-card__output{display:flow-root;margin-top:12px;min-height:42px}.ninagrafie-inspiration-card__output:after{content:"";display:block;clear:both}.ninagrafie-inspiration-card__empty{border:1px dashed #ccc6b8;background:#faf8f3;padding:16px;border-radius:8px;color:#777;font-size:13px}.ninagrafie-inspiration-card__output .ninagrafie-card-grid,.ninagrafie-inspiration-card__output .ninagrafie-discovery-grid{grid-template-columns:1fr!important}.ninagrafie-inspiration-card__output img{max-width:100%;height:auto}@media(max-width:900px){.ninagrafie-inspiration__intro{align-items:flex-start;flex-direction:column}.ninagrafie-inspiration__grid{grid-template-columns:1fr}.ninagrafie-inspiration__section-head{grid-template-columns:1fr;gap:8px}}@media(max-width:560px){.ninagrafie-inspiration{padding:0 14px}.ninagrafie-inspiration h1{font-size:28px}.ninagrafie-inspiration-card>header,.ninagrafie-inspiration-card__preview{padding-left:14px;padding-right:14px}}

/* V1.4 dev.24 – previews should demonstrate the component, not shrink it to a thumbnail. */
.ninagrafie-inspiration-card__output--single-card > .ninagrafie-card-grid,
.ninagrafie-inspiration-card__output--single-card > .ninagrafie-discovery-grid,
.ninagrafie-inspiration-card__output--single-card > .ninagrafie-card {
    width: min(100%, 360px);
    max-width: 360px;
}
.ninagrafie-inspiration-card__output--single-card .ninagrafie-card {
    width: 100%;
    max-width: none;
}

/* dev.4.49 – realistische Demo-Breiten */
.ninagrafie-inspiration-card--wide{grid-column:1/-1}
.ninagrafie-inspiration-card--wide .ninagrafie-card-grid,.ninagrafie-inspiration-card--wide .ninagrafie-discovery-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important}
@media(max-width:900px){.ninagrafie-inspiration-card--wide .ninagrafie-card-grid,.ninagrafie-inspiration-card--wide .ninagrafie-discovery-grid{grid-template-columns:1fr!important}}
/* dev.4.50 · Discovery-Carousels in der Komponentenbibliothek bewusst kompakter */
.ninagrafie-inspiration .ninagrafie-discovery-carousel .ninagrafie-card-image{max-height:300px;overflow:hidden}.ninagrafie-inspiration .ninagrafie-discovery-carousel .ninagrafie-card-image img{max-height:300px;object-fit:cover}

.ninagrafie-inspiration-card__internal-note{margin:0 0 12px;padding:8px 10px;border-radius:8px;background:#f5f0e8;color:#65584d;font-size:12px;font-weight:700;}
