/* Scoped browser layout: the rest of the shop and publishing-block cards keep
   their existing presentation. The sticky rail remains inside its results. */
.v2-tips-browser{clear:both;padding-top:40px;padding-bottom:100px;color:#252321;--v2-tb-top:calc(var(--v2-anchor-header-offset,0px) + 12px)}
/* Category pages use the same 20px outer gutter as the overview. Keep the
   overview itself full bleed so its hero and section dividers reach the edge. */
.v2-tips-browser.container{width:100%;max-width:1720px;margin-inline:auto;padding-inline:20px;background:#f5f1ed}
.v2-tips-browser *{box-sizing:border-box;letter-spacing:0}
.v2-tips-browser [hidden]{display:none!important}
.v2-tips-browser h1,.v2-tips-browser h2,.v2-tips-browser h3,.v2-tips-browser p{word-break:normal;overflow-wrap:normal;hyphens:auto}
.v2-tb-intro{padding:24px 0 46px;text-align:center}
.v2-tb-intro h1{font-size:38px;line-height:1.2;margin:0 0 28px}
.v2-tb-search{position:relative;display:flex;align-items:center;background:#fff;border-radius:24px;min-width:0;min-height:44px;border:1px solid transparent}
.v2-tb-search:focus-within{border-color:#285c86;box-shadow:0 0 0 2px #285c8622}
.v2-tb-search input{background:transparent!important;border:0!important;box-shadow:none!important;border-radius:24px;outline:none;min-width:0;width:100%;height:44px;padding:10px 46px 10px 18px;font:inherit;font-size:14px;color:#252321}
.v2-tb-search button{display:grid;place-items:center;position:absolute;right:0;top:0;width:44px;height:44px;border:0;border-radius:50%;background:transparent;color:inherit;padding:0;cursor:pointer}
.v2-tb-top-form>.v2-tb-search{max-width:760px;margin:0 auto 30px;background:#fff}
.v2-tb-top-categories,.v2-tb-category-options,.v2-tb-selected{display:flex;flex-wrap:wrap;gap:8px}
.v2-tb-top-categories{justify-content:center}
/* The background alone follows the German reference's object-bounding-box
   blob contour. Text and focus rings stay uncut, including multi-line names. */
.v2-tips-browser .v2-tb-chip{position:relative;isolation:isolate;display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:40px;max-width:100%;padding:10px 16px;border:0;border-radius:4px;background:transparent;color:var(--tip-category-color,#252321);font:inherit;font-size:14px;line-height:1.3;text-align:center;cursor:pointer;text-decoration:none;margin:0}
.v2-tb-chip:before{content:"";position:absolute;inset:0;z-index:-1;background:var(--tip-category-bg,#fff);clip-path:polygon(7.8% 98.3%,4.3% 97.4%,3% 94.8%,1.7% 92%,1.3% 83.5%,.4% 60%,0 29.6%,0 19.4%,1.1% 15.1%,3% 7.7%,7.3% 5.7%,11.1% 4.7%,37.2% .6%,63.6% 0,89.8% 2%,95.9% 2.7%,98.3% 6.6%,99.3% 12.4%,99% 53.7%,97.5% 78.5%,96.8% 89.7%,94.1% 93.8%,90.5% 94.2%,63.8% 96.9%,31.1% 100%)}
.v2-tb-chip:hover:before{filter:brightness(.95)}
.v2-tb-chip:focus-visible,.v2-tb-chip:focus-within{outline:2px solid #285c86;outline-offset:3px}
.v2-tb-chip span{min-width:0;overflow-wrap:normal;word-break:normal;hyphens:auto}
.v2-tb-chip input{position:absolute;opacity:0;width:1px;height:1px;margin:0}
.v2-tb-top-categories .v2-tb-chip,.v2-tb-category-options .v2-tb-chip{padding-right:30px;font-weight:500}
.v2-tb-chip:has(input:checked):after,.v2-tb-chip.is-selected:after{content:"";position:absolute;right:13px;top:50%;width:7px;height:12px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:translateY(-65%) rotate(45deg);pointer-events:none}
.v2-tb-chip svg{width:16px;height:16px;flex:none}
.v2-tb-layout{position:relative;display:grid;grid-template-columns:minmax(230px,290px) minmax(0,1fr);gap:24px;align-items:start;scroll-margin-top:var(--v2-tb-top)}
/* The German overview places its large white A behind, not inside, the
   scrollable filter rail. This independent layer stays fixed in the document
   while the sidebar scrolls and cannot catch clicks or keyboard focus. */
.v2-tb-layout::before{content:"";position:absolute;top:100px;left:-360px;width:914px;height:764px;background:url('/gfx/background/v2-creative-a-watermark.svg') center/contain no-repeat;pointer-events:none}
.v2-tb-sidebar{position:sticky;z-index:1;top:var(--v2-tb-top);max-height:calc(100dvh - var(--v2-tb-top) - 12px);overflow:auto;overscroll-behavior:contain;scrollbar-width:thin;padding:3px 0 10px;isolation:isolate}
.v2-tb-filter-bar,.v2-tb-panel{position:relative;z-index:1}
.v2-tb-panel{padding-top:20px}
.v2-tb-panel fieldset{border:0;padding:0;margin:0;min-width:0}
.v2-tb-panel legend{display:block;float:none;width:100%;border:0;padding:0;margin:0 0 12px;font-size:15px;text-transform:uppercase;font-weight:500}
/* The full-width heading is the 44px target. Its open state is communicated
   by the chevron's direction and colour, without a coloured heading or disc. */
/* A legacy shop-wide button:hover rule paints the entire heading peach after
   interaction. Override that inherited state only for these two toggles. */
.v2-tips-browser .v2-tb-group-toggle,.v2-tips-browser .v2-tb-group-toggle:hover,.v2-tips-browser .v2-tb-group-toggle:focus,.v2-tips-browser .v2-tb-group-toggle:active{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;min-height:44px;margin:0;padding:0;border:0;background:transparent!important;color:#252321;text-align:left;text-transform:inherit;font:inherit;cursor:pointer}
.v2-tb-group-arrow{display:grid;place-items:center;flex:none;width:30px;height:30px;border-radius:50%;color:#252321;transition:color .15s}
.v2-tb-group-arrow svg{display:block;width:20px;height:20px}
.v2-tb-group-toggle[aria-expanded="true"] .v2-tb-group-arrow{color:#e58a42}
.v2-tb-group-toggle[aria-expanded="true"] .v2-tb-group-arrow svg{transform:rotate(180deg)}
@media(hover:hover){.v2-tb-group-toggle[aria-expanded="false"]:hover .v2-tb-group-arrow{color:#ffad61}.v2-tb-group-toggle[aria-expanded="true"]:hover .v2-tb-group-arrow{color:#c96a24}}
.v2-tb-panel .v2-tb-help-options{margin-top:24px;padding-top:16px;padding-bottom:8px;border-top:1px solid #b8b2aa;border-bottom:1px solid #b8b2aa}
.v2-tb-help-chip{--tip-category-bg:#fff;--tip-category-color:#252321}
.v2-tb-selected:not(:empty){margin-bottom:24px}
.v2-tb-reset-form{margin-top:20px}
.v2-tb-reset{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:10px 16px;border:1px solid #b8b2aa;border-radius:4px;background:#fff;color:#252321;font:inherit;font-size:13px;cursor:pointer}
.v2-tb-reset:hover{background:#f7f4ef}
.v2-tb-mobile-toggle,.v2-tb-mobile-apply{display:none}
/* Hidden/revealed cards must not become native scroll anchors that move the
   document underneath the sticky rail when a filter is changed. */
.v2-tb-results{position:relative;z-index:1;min-width:0;overflow-anchor:none}
.v2-tb-results-heading{display:flex;justify-content:space-between;align-items:baseline;flex-wrap:wrap;gap:8px 20px;min-height:44px;margin-bottom:16px}
.v2-tb-results-heading h2{font-size:24px;line-height:1.3;margin:0}
.v2-tb-results-heading p{margin:0;font-size:14px;color:#625e59}
.v2-tb-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.v2-tb-item{min-width:0}
/* Categories own colours; the shared card owns all vertical geometry. One
   template keeps the browser, publishing blocks and editor preview in sync. */
.v2-tb-item .v2-creative-card{--v2-cc-card-height:456px;--v2-cc-padding:20px;background:var(--tip-card-bg,#fff)!important;color:var(--tip-card-color,#252321)!important;grid-template-rows:276px minmax(0,1fr) 48px;gap:12px}
.v2-tb-empty{text-align:center;padding:60px 16px}
.v2-tb-empty h3{font-size:22px}
.v2-tb-more{display:flex;align-items:center;flex-direction:column;gap:12px;margin-top:28px;font-size:13px;color:#625e59}
.v2-tb-more button,.v2-tb-empty button,.v2-tb-mobile-apply{background:#fff;border:1px solid #b8b2aa;border-radius:4px;min-height:44px;padding:10px 24px;color:#252321;font:inherit;cursor:pointer}
.v2-tips-browser button:focus-visible,.v2-tb-reset:focus-visible{outline:2px solid #285c86;outline-offset:3px}
.v2-tb-sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
/* The overview is full-bleed; its content panel overlaps the craft photo in
   the German reference. Category pages keep their former container geometry. */
.v2-tb-home{padding-top:0;background:#f5f1ed}
.v2-tb-hero{height:clamp(220px,29vw,470px);background:#f5f1ed url('/gfx/background/v2-creative-world-hero.jpg') center/cover no-repeat}
.v2-tb-home .v2-tb-intro{position:relative;z-index:1;width:min(1400px,calc(100% - 40px));margin:-158px auto 0;padding:48px clamp(20px,5vw,72px) 54px;background:#fff;border-radius:8px}
.v2-tb-home .v2-tb-intro h1{font-size:clamp(32px,3vw,50px);margin-bottom:24px}
.v2-tb-home .v2-tb-intro p{max-width:860px;margin:0 auto 40px;font-size:18px;line-height:1.55}
.v2-tb-home .v2-tb-top-form>.v2-tb-search{max-width:820px;background:#f5f1ed;margin-bottom:46px}
.v2-tb-printables-link{display:inline-flex;align-items:center;justify-content:center;min-height:44px;margin-top:28px;padding:10px 18px;color:#252321;border:1px solid #aaa49e;border-radius:4px;text-decoration:none}
.v2-tb-printables-link:hover{background:#f5f1ed}
.v2-tb-divider{height:150px;background-position:center;background-size:cover;background-repeat:no-repeat}
.v2-tb-divider-top{margin-top:48px;background-color:#fff;background-image:url('/gfx/background/v2-creative-divider-top.jpg')}
/* The lower divider starts with white sky. A top margin exposed the beige
   overview background as a solid stripe immediately above the scissors and
   ruler; keep the lower spacing but let the image meet the white section. */
.v2-tb-divider-bottom{margin:0 0 44px;background-color:#f5f1ed;background-image:url('/gfx/background/v2-creative-divider-bottom.jpg')}
.v2-tb-featured{padding:30px 20px 56px;background:#fff}
.v2-tb-featured>h2,.v2-tb-featured-grid{max-width:1680px;margin-left:auto;margin-right:auto}
.v2-tb-featured>h2{font-size:28px;margin-top:0;margin-bottom:24px}
.v2-tb-featured-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px}
.v2-tb-home .v2-tb-layout{max-width:1680px;margin:0 auto;padding:0 20px}
@media(max-width:1199px){.v2-tb-layout{grid-template-columns:250px minmax(0,1fr);gap:20px}.v2-tb-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:1199px){.v2-tb-featured-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:767px){
 .v2-tips-browser{--v2-tb-top:var(--v2-anchor-header-offset,0px);padding-top:24px;padding-bottom:72px}
 .v2-tb-intro{padding:16px 0 30px}.v2-tb-intro h1{font-size:30px;margin-bottom:22px}.v2-tb-top-form>.v2-tb-search{margin-bottom:20px}
 .v2-tb-top-categories{gap:6px}.v2-tips-browser .v2-tb-chip{font-size:13px;padding:10px 13px;min-height:40px}
 .v2-tb-top-categories .v2-tb-chip,.v2-tb-category-options .v2-tb-chip{padding-right:30px}
 .v2-tb-layout{display:block}.v2-tb-layout::before{top:92px;left:-250px;width:520px;height:435px}.v2-tb-sidebar{z-index:25;max-height:none;overflow:visible;background:transparent;padding:8px 0;margin-bottom:18px;border-bottom:1px solid #ded8d0}
 .v2-tb-filter-bar{display:flex;align-items:center;gap:10px}.v2-tb-quick-search{flex:1;min-width:0}
 .v2-tb-mobile-toggle{display:flex;align-items:center;justify-content:center;gap:6px;min-height:44px;padding:8px;border:1px solid #b8b2aa;border-radius:4px;background:#fff;color:#252321;font:inherit;font-size:13px;cursor:pointer}
 .v2-tb-panel{padding:12px 0;max-height:calc(100dvh - var(--v2-tb-top) - 100px);overflow:auto;overscroll-behavior:contain}
 .v2-tips-browser.is-enhanced .v2-tb-panel{display:none}.v2-tips-browser.is-filter-open .v2-tb-panel{display:block}
 .v2-tb-mobile-apply{display:block;width:100%;margin-top:16px;background:#285c86;color:#fff;border-color:#285c86}
 .v2-tb-results-heading h2{font-size:22px}.v2-tb-grid{gap:12px}
 .v2-tb-home{padding-top:0}.v2-tb-home .v2-tb-intro{margin-top:-60px;padding:30px 18px 36px}
 .v2-tb-home .v2-tb-intro p{font-size:16px;margin-bottom:24px}.v2-tb-home .v2-tb-top-form>.v2-tb-search{margin-bottom:24px}
 .v2-tb-divider-top{background-image:url('/gfx/background/v2-creative-divider-top-mobile.jpg')}.v2-tb-divider-bottom{background-image:url('/gfx/background/v2-creative-divider-bottom-mobile.jpg')}
 .v2-tb-featured{padding:24px 20px 36px}.v2-tb-featured-grid{gap:12px}.v2-tb-home .v2-tb-layout{padding:0 20px}
}
@media(max-width:540px){.v2-tb-grid{grid-template-columns:minmax(0,1fr)}}
@media(max-width:540px){.v2-tb-featured-grid{grid-template-columns:minmax(0,1fr)}}
@media(prefers-reduced-motion:reduce){.v2-tips-browser *{scroll-behavior:auto!important;transition:none!important}}
