/* Eigen logo-accent voor de containerbak (klepdeksel). Logo's: scripts/build_logo_variants.py */
.bin-page .site-header .brand::after { -webkit-mask-image: url("images/logo-containerbak.png"); mask-image: url("images/logo-containerbak.png"); }

/* Groot, zacht watermerk van het eigen logo-icoon naast de koptekst */
.bin-main { position:relative; isolation:isolate; overflow-x:clip; overflow-clip-margin:0; }
.bin-main::before { content:""; position:absolute; z-index:-1; pointer-events:none; top:6px; right:33%; width:clamp(170px, 16vw, 250px); aspect-ratio:424 / 336; background:url("images/logo-icoon-containerbak.png") center / contain no-repeat; opacity:.1; }
@media (max-width:550px) { .bin-main::before { width:210px; top:-6px; right:-14%; opacity:.09; } }

/* Laadscherm: het eigen logo-icoon, het deksel klapt open */
.bin-page .brand-loader { display:block; width:clamp(110px, 14vw, 150px); height:auto; overflow:visible; }
.bin-page .bl-lid { transform-origin:240px 226px; animation:bl-lid 2.2s ease-in-out infinite; }
@keyframes bl-lid { 0%, 15% { transform:none; } 45%, 65% { transform:rotate(-18deg); } 90%, 100% { transform:none; } }
@media (prefers-reduced-motion:reduce) { .bin-page .brand-loader * { animation:none !important; } }
