/* FarbzauberBooks: kleine, eigenständige Kreativtrend-Erweiterung */
.trend-teaser{background:#f5f0ff}
.trend-teaser-grid{display:grid;grid-template-columns:1.2fr .8fr;align-items:center;gap:48px}
.trend-teaser h2{max-width:650px}
.trend-teaser p:not(.eyebrow){color:#5f5a69;max-width:660px}
.trend-teaser-art{min-height:260px;display:grid;place-items:center;position:relative;border-radius:30px;background:linear-gradient(135deg,#fffaf6,#e8f7f1);border:1px solid #e8dfed;overflow:hidden}
.trend-teaser-art svg{width:min(80%,300px);height:auto;filter:drop-shadow(0 14px 18px rgba(64,41,102,.09))}
.trend-teaser-art .preview-dot{stroke:#8b83a8;stroke-width:2;fill:#fff}
.trend-teaser-art .preview-dot.a{fill:#ffb4af}.trend-teaser-art .preview-dot.b{fill:#a5e9d9}.trend-teaser-art .preview-dot.c{fill:#c9c2fa}
.dot-hero{background:linear-gradient(135deg,#f5f0ff,#fffaf6);padding:76px 0 68px}
.dot-hero-grid{display:grid;grid-template-columns:1.08fr .92fr;align-items:center;gap:40px}
.dot-hero h1{font-size:clamp(2.7rem,5vw,4.6rem)}
.dot-hero .lead{max-width:670px}
.dot-preview-panel{background:white;border:1px solid var(--line);border-radius:28px;padding:22px;box-shadow:var(--shadow)}
.dot-preview-panel svg{width:100%;height:auto}
.dot-legend{display:flex;gap:10px;flex-wrap:wrap;margin:18px 0 10px}
.dot-legend span{display:inline-flex;align-items:center;gap:8px;padding:7px 11px;border-radius:30px;background:#f8f5f2;font-weight:750;font-size:.9rem}
.dot-swatch{display:inline-block;width:17px;height:17px;border-radius:50%;border:1px solid #ddd}
.dot-swatch.a{background:#ffaaa5}.dot-swatch.b{background:#8adcc6}.dot-swatch.c{background:#afa2ef}
.dot-panel-label{font-size:.78rem;letter-spacing:.08em;text-transform:uppercase;color:#7867d9;font-weight:850;margin:0 0 10px}
.dot-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin-top:28px}
.dot-step{border:1px solid var(--line);background:#fff;border-radius:22px;padding:26px}
.dot-step-number{display:grid;place-items:center;width:40px;height:40px;border-radius:14px;background:#ede8ff;color:#5747b7;font-weight:900;margin-bottom:15px}
.dot-step h3{font-size:1.2rem}.dot-step p{color:var(--muted);margin-bottom:0}
.dot-recommendations{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.dot-product{background:#fff;border-radius:22px;border:1px solid var(--line);padding:26px;display:flex;flex-direction:column}
.dot-product-icon{font-size:2rem;margin-bottom:12px}.dot-product p{color:var(--muted);flex:1}
.dot-notice{font-size:.91rem;color:#5e5870;background:#faf7f1;border:1px solid #e8dfd5;border-radius:14px;padding:17px 20px;margin-top:26px}
.dot-faq{max-width:780px}.dot-faq details{border-bottom:1px solid var(--line);padding:18px 0}
.dot-faq summary{font-weight:800;cursor:pointer}.dot-faq p{color:var(--muted);margin:10px 0 0}
.dot-sheet{max-width:880px;margin:auto;background:#fff;border:1px solid var(--line);border-radius:24px;padding:34px;box-shadow:var(--shadow)}
.dot-sheet-header{display:flex;align-items:start;justify-content:space-between;gap:24px}
.dot-sheet h2{font-size:2rem}
.dot-sheet p{color:var(--muted)}
.dot-artwork{display:block;width:min(100%,600px);height:auto;margin:14px auto}
.dot-artwork .paintable circle{fill:#fff;stroke:#716984;stroke-width:2.2;transition:fill .12s ease}
.dot-artwork .paintable text{font-size:14px;font-family:Arial,sans-serif;font-weight:800;fill:#3d364f;pointer-events:none;text-anchor:middle;dominant-baseline:central}
.dot-artwork .paintable{cursor:pointer;outline:none}
.dot-artwork .paintable:focus-visible circle{stroke:#1b62b7;stroke-width:4}
.dot-artwork .paintable[data-painted="true"][data-letter="A"] circle{fill:#ffaaa5}
.dot-artwork .paintable[data-painted="true"][data-letter="B"] circle{fill:#8adcc6}
.dot-artwork .paintable[data-painted="true"][data-letter="C"] circle{fill:#afa2ef}
.dot-artwork .paintable[data-painted="true"] text{fill:#251f39}
.dot-sheet-tools{display:flex;flex-wrap:wrap;align-items:center;gap:12px;justify-content:space-between}
.dot-sheet-tools p{margin:0;font-weight:750;color:#5747b7}
.dot-print-notice{font-size:.86rem}
.print-only{display:none}
@media (max-width:850px){.trend-teaser-grid,.dot-hero-grid{grid-template-columns:1fr}.dot-steps,.dot-recommendations{grid-template-columns:1fr}.dot-hero{padding:48px 0}.trend-teaser-art{min-height:220px}}
@media (max-width:700px){.dot-sheet{padding:18px}.dot-sheet-header{flex-direction:column}.dot-sheet h2{font-size:1.6rem}.dot-preview-panel{padding:16px}}
@media print{
  @page{size:A4;margin:12mm}
  body{background:#fff;color:#111}
  .site-header,.site-footer,.skip-link,.no-print,.dot-sheet-tools,.dot-print-notice{display:none!important}
  .print-only{display:block!important}
  main.section{padding:0}
  .container{width:100%;max-width:none}
  .dot-sheet{border:0;box-shadow:none;padding:0;border-radius:0}
  .dot-sheet h1,.dot-sheet h2{font-size:22pt}
  .dot-artwork{max-width:165mm;max-height:190mm}
  .dot-artwork .paintable circle,.dot-artwork .paintable[data-painted="true"] circle{fill:#fff!important;stroke:#111!important;stroke-width:2!important}
  .dot-artwork .paintable text{fill:#111!important}
  .dot-swatch{print-color-adjust:exact;-webkit-print-color-adjust:exact}
  a{color:inherit;text-decoration:none}
}

/* Category illustrations are original graphics, not merchant product photos. */
.dot-product-media{width:100%;aspect-ratio:640/300;object-fit:cover;display:block;border-radius:15px;margin-bottom:16px}

/* Verfügbare selbst erstellte Motive und übersichtliche Produktauswahl */
.dot-free-grid{grid-template-columns:repeat(2,minmax(0,1fr));max-width:930px}
.dot-free-grid .dot-product{padding:19px}
.dot-free-grid .dot-product p{margin:0 0 10px}
.dot-howto{padding:50px 0}
.dot-tag{font-weight:850;font-size:.77rem;text-transform:uppercase;letter-spacing:.05em;color:var(--purple-dark);margin-bottom:8px}
#material-tipps{scroll-margin-top:96px}
#dot-flexible-marker{scroll-margin-top:100px}
.dot-material-picks{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin:4px 0 25px}
.dot-material-pick{display:grid;grid-template-columns:136px 1fr;gap:15px;align-items:center;background:white;border:1px solid var(--line);border-radius:19px;padding:12px;color:var(--ink);text-decoration:none;min-width:0}
.dot-material-pick:focus-visible{outline:3px solid var(--purple);outline-offset:3px}
.dot-material-pick img{width:100%;height:115px;object-fit:cover;border-radius:13px}
.dot-material-pick span{display:flex;flex-direction:column;gap:2px}
.dot-material-pick strong{font-size:1.03rem;line-height:1.2}
.dot-material-pick small{font-size:.88rem;color:var(--muted)}
.dot-material-pick b{font-size:.88rem;color:var(--purple-dark);margin-top:3px}
@media(max-width:750px){.dot-material-picks{grid-template-columns:1fr}}
@media(max-width:400px){.dot-material-pick{grid-template-columns:110px 1fr}.dot-material-pick img{height:108px}}
#material-tipps .dot-recommendations{grid-template-columns:repeat(3,minmax(0,1fr))}
#material-tipps .dot-notice{margin:10px 0 25px}
.dot-product .dot-product-media{aspect-ratio:640/290}
@media(max-width:900px){#material-tipps .dot-recommendations{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:650px){.dot-free-grid,#material-tipps .dot-recommendations{grid-template-columns:1fr}.dot-free-grid .dot-product{padding:15px}}

/* Focused product guidance: original artwork, not retailer photos. */
.dot-main-recs .dot-product{padding:18px;box-shadow:0 10px 28px rgba(50,37,83,.06)}
.dot-product-featured .dot-product-media{aspect-ratio:640/350}
.dot-product-featured h3{font-size:1.2rem;line-height:1.25;margin-bottom:9px}
.dot-product-featured .dot-tag{margin-bottom:8px}
.dot-product-featured .dot-model{flex:0;margin:0 0 16px;color:#635e71;font-size:.82rem;font-weight:700;line-height:1.5}
.dot-buy-link{display:flex;align-items:center;justify-content:center;min-height:48px;padding:10px 13px;border-radius:13px;background:var(--purple);color:white;text-decoration:none;font-weight:800;font-size:.88rem;line-height:1.3;text-align:center}
.dot-buy-link:hover{background:var(--purple-dark)}
.dot-start-link{background:#245e53}
.dot-start-link:hover{background:#194b43}
.dot-spec-link{display:flex;align-items:center;min-height:42px;font-size:.8rem;color:var(--purple-dark);font-weight:700;margin-top:8px;text-decoration:underline;text-underline-offset:3px}
.dot-extra-material{margin-top:22px;border:1px solid var(--line);background:white;border-radius:18px;padding:18px 21px}
.dot-extra-material summary{font-weight:850;cursor:pointer;color:var(--purple-dark);padding:4px 0}
.dot-extra-material .dot-recommendations{margin-top:21px}
.dot-extra-material .dot-product{padding:18px}
.dot-extra-material .dot-product h3{font-size:1.08rem;line-height:1.3}
.dot-extra-material .dot-product p{line-height:1.5}
.dot-extra-material .dot-model{flex:0;font-size:.84rem}
.dot-motif-material{margin:26px 0 20px;display:grid;grid-template-columns:220px minmax(0,1fr);gap:24px;align-items:center;padding:18px;background:#f1ecff;border:1px solid #dfd6f4;border-radius:23px}
.dot-motif-material img{width:100%;height:auto;aspect-ratio:640/430;object-fit:cover;border-radius:14px}
.dot-motif-material h2{font-size:clamp(1.4rem,2.5vw,1.9rem);margin-bottom:8px}
.dot-motif-material p:not(.eyebrow){font-size:.94rem;color:#575166;margin:5px 0 12px}
.dot-motif-actions{display:flex;flex-wrap:wrap;gap:13px;align-items:center}
.dot-motif-actions .btn{font-size:.88rem;padding:10px 15px;line-height:1.3;height:auto}
.dot-motif-actions .text-link{font-size:.86rem}
.dot-motif-material .dot-ad-note{font-size:.76rem!important;margin:12px 0 0!important;line-height:1.45}
@media(max-width:700px){.dot-motif-material{grid-template-columns:1fr;gap:12px;padding:15px}.dot-motif-material img{max-height:185px}.dot-motif-actions{align-items:stretch;flex-direction:column}.dot-motif-actions .text-link{padding:7px 0;text-align:center}}
@media(prefers-reduced-motion:reduce){.dot-buy-link{transition:none}}