/* Portfolio-Case „Neon Bun“ — ergänzt afterglow.css / wedding.css / kernwerk.css (gemeinsame Case-Bausteine) */
.pg-neonbun .ag-hero .ag-h { font-size: calc(var(--cell) * 1.75); white-space: nowrap; }
.pg-neonbun .ag-hero .ag-h b { display: inline; }
.nb-hero-vis .ag-browser { box-shadow: 8px 8px 0 var(--ink); }
.nb-hero-bag { width: 30% !important; right: calc(var(--cell) * .1); bottom: calc(var(--cell) * -.1); background: none; border: 0; box-shadow: none !important; overflow: visible; transform: rotate(4deg); }
.nb-hero-bag img { width: 100%; height: auto; filter: drop-shadow(6px 8px 0 rgba(28, 26, 23, .9)); }
.nb-hero-bag:hover img { transform: none; }
.nb-print-bag { max-width: calc(var(--cell) * 11.5); }
.nb-posts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: calc(var(--cell) * .7); align-items: start; margin-top: calc(var(--cell) * .9); }
.nb-posts li:nth-child(2) { margin-top: calc(var(--cell) * .7); }
.nb-posts .shot { box-shadow: 8px 8px 0 var(--ink); transition: transform .45s cubic-bezier(.3, 1.4, .5, 1); }
.nb-posts li:nth-child(1) .shot { transform: rotate(-1.5deg); }
.nb-posts li:nth-child(2) .shot { transform: rotate(1deg); }
.nb-posts li:nth-child(3) .shot { transform: rotate(-.8deg); }
.nb-posts .shot:hover { transform: rotate(0); }
.nb-posts .ag-cap { color: var(--ink); }
.nb-mosaic .n-web { grid-column: span 8; transform: rotate(-.5deg); }
.nb-mosaic .n-bag { grid-column: span 4; background: var(--cream); transform: rotate(.7deg); padding: 10px; }
.nb-mosaic .n-menu, .nb-mosaic .n-s1, .nb-mosaic .n-s2, .nb-mosaic .n-s3 { grid-column: span 3; }
.nb-mosaic .n-menu { transform: rotate(-.7deg); } .nb-mosaic .n-s1 { transform: rotate(.6deg); }
.nb-mosaic .n-s2 { transform: rotate(-.5deg); } .nb-mosaic .n-s3 { transform: rotate(.8deg); }
.nb-mosaic .m-txt { grid-column: span 12; align-self: center; border: 0; box-shadow: none; background: none; overflow: visible; padding: 0; }
.nb-mosaic .m-txt .ag-chips li { background: none; box-shadow: none; overflow: visible; border: 2px solid var(--cream); transform: none; }
@media (min-width: 901px) { .nb-rel { --rows: 8.2; } .nb-rel .rel-list { --y: 1.2; } }
@media (max-width: 900px) {
  .nb-hero-bag { width: 32% !important; right: 2%; }
  .nb-posts { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px 18px; margin-top: 22px; }
  .nb-posts li:nth-child(2) { margin-top: 0; }
  .nb-posts li:nth-child(3) { grid-column: 1 / -1; width: 52%; justify-self: center; }
  .nb-posts .shot { box-shadow: 4px 4px 0 var(--ink); }
  .nb-mosaic .n-web, .nb-mosaic .n-bag { grid-column: span 6; }
  .nb-mosaic .n-bag { grid-column: 2 / span 4; }
  .nb-mosaic .n-menu, .nb-mosaic .n-s1, .nb-mosaic .n-s2, .nb-mosaic .n-s3 { grid-column: span 3; }
  .nb-mosaic .m-txt { grid-column: span 6; }
  .pg-neonbun .ag-hero .ag-h { font-size: clamp(56px, 21vw, 120px); }
}
@media (max-width: 900px) { .nb-print-bag picture, .nb-print-bag img { display: block; width: 100%; height: auto; } }

/* Styleboard präsenter, Abstände wie Afterglow/Kernwerk (Fläche an Fläche nicht doppelt) */
@media (min-width: 901px) {
  .pg-neonbun .wd-2col-board { grid-template-columns: minmax(0, 1.75fr) minmax(0, 1fr); column-gap: calc(var(--cell) * 1.1); }
  .pg-neonbun .wd-menu, .pg-neonbun .wd-all { margin-top: calc(var(--cell) * -.5); }
}
@media (max-width: 900px) {
  .pg-neonbun .wd-menu, .pg-neonbun .wd-all { margin-top: calc(var(--cell) * -.4); }
  .pg-neonbun .wd-board { width: 108%; margin-left: -4%; }
}
