/* Wereld KAPSTOK: kapstok met jasjes en naamkaartjes, een nieuw jasje gaat aan een haakje hangen */
body:has(.d-world-kapstok) { --t-orange: #FFE3CF; --t-blue: #DDE8F5; --t-green: #E0EDD5; --t-yellow: #FFF1C9; }
body:has(.d-world-kapstok) .d-section.has-vlak-groen-background-color,
body:has(.d-world-kapstok) .d-section.has-vlak-blauw-background-color { background: #EEF5E6 !important; }
.d-world-kapstok { background: radial-gradient(circle, rgba(114,154,71,.10) 2px, rgba(0,0,0,0) 2.5px) 0 0 / 26px 26px, linear-gradient(180deg, #E6F1DC 0%, #F7FAF0 100%) !important; }
.d-world-kapstok .d-play-title mark { color: #4F7A2E !important; }
body:has(.d-world-kapstok) main .d-section { position: relative; }
body:has(.d-world-kapstok) main .d-section + .d-section::before { content: ""; position: absolute; left: 0; right: 0; top: -12px; height: 24px; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 72 24'%3E%3Crect x='0' y='4' width='72' height='6' rx='3' fill='%23C98B5A'/%3E%3Cpath d='M10 9 V 15 C 10 20 16 20 16 16' stroke='%231E2B45' stroke-width='2.4' fill='none' stroke-linecap='round'/%3E%3Cpath d='M34 9 V 15 C 34 20 40 20 40 16' stroke='%231E2B45' stroke-width='2.4' fill='none' stroke-linecap='round'/%3E%3Cpath d='M58 9 V 15 C 58 20 64 20 64 16' stroke='%231E2B45' stroke-width='2.4' fill='none' stroke-linecap='round'/%3E%3Ccircle cx='46' cy='7' r='1.6' fill='%23A86E43'/%3E%3C/svg%3E") left center / 72px 24px repeat-x; z-index: 2; pointer-events: none; }

/* kapstok rechts; haakjes op x = 52/122/192/262 van 300px */
.d-scene-kapstok { position: absolute !important; inset: 0; height: auto !important; }
.d-kapstok-hoofd { width: 300px; height: 110px; right: 2%; bottom: calc(6% + 130px); background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 300 110'%3E %3Crect x='25' y='8' width='40' height='26' rx='5' fill='%23F49AB4' stroke='%231E2B45' stroke-width='2.5' transform='rotate(-3 45 21)'/%3E%3Ccircle cx='45' cy='6' r='3' fill='%23F07A2B' stroke='%231E2B45' stroke-width='2'/%3E%3Crect x='95' y='8' width='40' height='26' rx='5' fill='%238EAAD5' stroke='%231E2B45' stroke-width='2.5' transform='rotate(2 115 21)'/%3E%3Ccircle cx='115' cy='6' r='3' fill='%23F07A2B' stroke='%231E2B45' stroke-width='2'/%3E%3Crect x='165' y='8' width='40' height='26' rx='5' fill='%23729A47' stroke='%231E2B45' stroke-width='2.5' transform='rotate(-2 185 21)'/%3E%3Ccircle cx='185' cy='6' r='3' fill='%23F07A2B' stroke='%231E2B45' stroke-width='2'/%3E%3Crect x='235' y='8' width='40' height='26' rx='5' fill='%23FFF6E6' stroke='%231E2B45' stroke-width='2.5' transform='rotate(3 255 21)'/%3E%3Ccircle cx='255' cy='6' r='3' fill='%23F07A2B' stroke='%231E2B45' stroke-width='2'/%3E %3Crect x='4' y='40' width='292' height='24' rx='10' fill='%23C98B5A' stroke='%231E2B45' stroke-width='3'/%3E %3Cpath d='M16 48 H 284' stroke='%23A86E43' stroke-width='3' stroke-linecap='round' opacity='.6'/%3E %3Ccircle cx='16' cy='52' r='4' fill='%23FFF6E6' stroke='%231E2B45' stroke-width='2'/%3E%3Ccircle cx='284' cy='52' r='4' fill='%23FFF6E6' stroke='%231E2B45' stroke-width='2'/%3E %3Cpath d='M45 58 V 76 C 45 88 59 88 59 78' stroke='%231E2B45' stroke-width='9' fill='none' stroke-linecap='round'/%3E%3Cpath d='M45 58 V 76 C 45 88 59 88 59 78' stroke='%23FFC94D' stroke-width='4' fill='none' stroke-linecap='round'/%3E%3Cpath d='M115 58 V 76 C 115 88 129 88 129 78' stroke='%231E2B45' stroke-width='9' fill='none' stroke-linecap='round'/%3E%3Cpath d='M115 58 V 76 C 115 88 129 88 129 78' stroke='%23FFC94D' stroke-width='4' fill='none' stroke-linecap='round'/%3E%3Cpath d='M185 58 V 76 C 185 88 199 88 199 78' stroke='%231E2B45' stroke-width='9' fill='none' stroke-linecap='round'/%3E%3Cpath d='M185 58 V 76 C 185 88 199 88 199 78' stroke='%23FFC94D' stroke-width='4' fill='none' stroke-linecap='round'/%3E%3Cpath d='M255 58 V 76 C 255 88 269 88 269 78' stroke='%231E2B45' stroke-width='9' fill='none' stroke-linecap='round'/%3E%3Cpath d='M255 58 V 76 C 255 88 269 88 269 78' stroke='%23FFC94D' stroke-width='4' fill='none' stroke-linecap='round'/%3E%3C/svg%3E") !important; z-index: 2; }
.d-kapstok-jas { width: 76px; height: 99px; bottom: calc(6% + 60px); z-index: 3; transform-origin: 50% 3%; }
.d-kapstok-j1 { right: calc(2% + 210px); background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 130'%3E %3Cpath d='M50 4 C 44 4 44 12 50 14' stroke='%231E2B45' stroke-width='3' fill='none' stroke-linecap='round'/%3E %3Cpath d='M30 22 L 50 14 L 70 22 L 92 40 L 84 86 L 76 84 V 124 H 24 V 84 L 16 86 L 8 40 Z' fill='%238EAAD5' stroke='%231E2B45' stroke-width='3' stroke-linejoin='round'/%3E %3Cpath d='M30 22 L 50 40 L 70 22 L 62 18 L 50 28 L 38 18 Z' fill='%23FFC94D' stroke='%231E2B45' stroke-width='2.5' stroke-linejoin='round'/%3E %3Cpath d='M50 40 V 124' stroke='%231E2B45' stroke-width='2.5'/%3E %3Ccircle cx='50' cy='92' r='3' fill='%231E2B45'/%3E%3Ccircle cx='50' cy='106' r='3' fill='%231E2B45'/%3E %3Crect x='28' y='96' width='14' height='12' rx='3' fill='none' stroke='%231E2B45' stroke-width='2'/%3E%3Crect x='58' y='96' width='14' height='12' rx='3' fill='none' stroke='%231E2B45' stroke-width='2'/%3E %3Ccircle cx='42' cy='62' r='4' fill='%231E2B45'/%3E%3Ccircle cx='58' cy='62' r='4' fill='%231E2B45'/%3E%3Ccircle cx='43.5' cy='60.5' r='1.4' fill='%23fff'/%3E%3Ccircle cx='59.5' cy='60.5' r='1.4' fill='%23fff'/%3E%3Cpath d='M45 70 Q 50 75 55 70' stroke='%231E2B45' stroke-width='2.4' fill='none' stroke-linecap='round'/%3E%3Ccircle cx='35' cy='70' r='4' fill='%23F49AB4' opacity='.7'/%3E%3Ccircle cx='65' cy='70' r='4' fill='%23F49AB4' opacity='.7'/%3E%3C/svg%3E") !important; }
.d-kapstok-j2 { right: calc(2% + 140px); background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 130'%3E %3Cpath d='M50 4 C 44 4 44 12 50 14' stroke='%231E2B45' stroke-width='3' fill='none' stroke-linecap='round'/%3E %3Cpath d='M30 22 L 50 14 L 70 22 L 92 40 L 84 86 L 76 84 V 124 H 24 V 84 L 16 86 L 8 40 Z' fill='%23F49AB4' stroke='%231E2B45' stroke-width='3' stroke-linejoin='round'/%3E %3Cpath d='M30 22 L 50 40 L 70 22 L 62 18 L 50 28 L 38 18 Z' fill='%23FFF6E6' stroke='%231E2B45' stroke-width='2.5' stroke-linejoin='round'/%3E %3Cpath d='M50 40 V 124' stroke='%231E2B45' stroke-width='2.5'/%3E %3Ccircle cx='50' cy='92' r='3' fill='%231E2B45'/%3E%3Ccircle cx='50' cy='106' r='3' fill='%231E2B45'/%3E %3Crect x='28' y='96' width='14' height='12' rx='3' fill='none' stroke='%231E2B45' stroke-width='2'/%3E%3Crect x='58' y='96' width='14' height='12' rx='3' fill='none' stroke='%231E2B45' stroke-width='2'/%3E %3Ccircle cx='42' cy='62' r='4' fill='%231E2B45'/%3E%3Ccircle cx='58' cy='62' r='4' fill='%231E2B45'/%3E%3Ccircle cx='43.5' cy='60.5' r='1.4' fill='%23fff'/%3E%3Ccircle cx='59.5' cy='60.5' r='1.4' fill='%23fff'/%3E%3Cpath d='M45 70 Q 50 75 55 70' stroke='%231E2B45' stroke-width='2.4' fill='none' stroke-linecap='round'/%3E%3Ccircle cx='35' cy='70' r='4' fill='%23F49AB4' opacity='.7'/%3E%3Ccircle cx='65' cy='70' r='4' fill='%23F49AB4' opacity='.7'/%3E%3C/svg%3E") !important; }
.d-kapstok-nieuw { right: calc(2% + 0px); background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 130'%3E %3Cpath d='M50 4 C 44 4 44 12 50 14' stroke='%231E2B45' stroke-width='3' fill='none' stroke-linecap='round'/%3E %3Cpath d='M30 22 L 50 14 L 70 22 L 92 40 L 84 86 L 76 84 V 124 H 24 V 84 L 16 86 L 8 40 Z' fill='%23F07A2B' stroke='%231E2B45' stroke-width='3' stroke-linejoin='round'/%3E %3Cpath d='M30 22 L 50 40 L 70 22 L 62 18 L 50 28 L 38 18 Z' fill='%23FFC94D' stroke='%231E2B45' stroke-width='2.5' stroke-linejoin='round'/%3E %3Cpath d='M50 40 V 124' stroke='%231E2B45' stroke-width='2.5'/%3E %3Ccircle cx='50' cy='92' r='3' fill='%231E2B45'/%3E%3Ccircle cx='50' cy='106' r='3' fill='%231E2B45'/%3E %3Crect x='28' y='96' width='14' height='12' rx='3' fill='none' stroke='%231E2B45' stroke-width='2'/%3E%3Crect x='58' y='96' width='14' height='12' rx='3' fill='none' stroke='%231E2B45' stroke-width='2'/%3E %3Ccircle cx='42' cy='62' r='4' fill='%231E2B45'/%3E%3Ccircle cx='58' cy='62' r='4' fill='%231E2B45'/%3E%3Ccircle cx='43.5' cy='60.5' r='1.4' fill='%23fff'/%3E%3Ccircle cx='59.5' cy='60.5' r='1.4' fill='%23fff'/%3E%3Cpath d='M45 70 Q 50 75 55 70' stroke='%231E2B45' stroke-width='2.4' fill='none' stroke-linecap='round'/%3E%3Ccircle cx='35' cy='70' r='4' fill='%23F49AB4' opacity='.7'/%3E%3Ccircle cx='65' cy='70' r='4' fill='%23F49AB4' opacity='.7'/%3E%3C/svg%3E") !important; }
.d-kapstok-kaartje { width: 48px; height: 40px; right: calc(2% + 84px); bottom: calc(6% + 116px); background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 60 50'%3E %3Cpath d='M30 2 L 22 14 M30 2 L 38 14' stroke='%231E2B45' stroke-width='2'/%3E %3Crect x='6' y='12' width='48' height='34' rx='6' fill='%23FFC94D' stroke='%231E2B45' stroke-width='3'/%3E %3Cpath d='M30 22 L 33 28 L 40 29 L 35 33 L 36 40 L 30 37 L 24 40 L 25 33 L 20 29 L 27 28 Z' fill='%23fff' stroke='%231E2B45' stroke-width='1.8' stroke-linejoin='round'/%3E%3C/svg%3E") !important; z-index: 3; transform-origin: 50% 0; }
.d-kapstok-glim { width: 34px; height: 34px; right: calc(2% + 20px); bottom: calc(6% + 170px); background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 60 60'%3E %3Cpath d='M30 4 L 34 26 L 56 30 L 34 34 L 30 56 L 26 34 L 4 30 L 26 26 Z' fill='%23FFC94D' stroke='%231E2B45' stroke-width='2.5' stroke-linejoin='round'/%3E%3C/svg%3E") !important; z-index: 4; }
.d-peek-kapstok::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 92'%3E %3Ccircle cx='22' cy='22' r='15' fill='%23C98B5A' stroke='%231E2B45' stroke-width='3'/%3E%3Ccircle cx='22' cy='22' r='7' fill='%23F49AB4'/%3E %3Ccircle cx='78' cy='22' r='15' fill='%23C98B5A' stroke='%231E2B45' stroke-width='3'/%3E%3Ccircle cx='78' cy='22' r='7' fill='%23F49AB4'/%3E %3Cellipse cx='50' cy='54' rx='36' ry='34' fill='%23C98B5A' stroke='%231E2B45' stroke-width='3'/%3E %3Cellipse cx='50' cy='66' rx='14' ry='10' fill='%23FFF6E6' stroke='%231E2B45' stroke-width='2.5'/%3E %3Cellipse cx='50' cy='62' rx='4' ry='3' fill='%231E2B45'/%3E %3Cpath d='M45 70 Q 50 74 55 70' stroke='%231E2B45' stroke-width='2.2' fill='none' stroke-linecap='round'/%3E %3Ccircle cx='37' cy='48' r='4.5' fill='%231E2B45'/%3E%3Ccircle cx='63' cy='48' r='4.5' fill='%231E2B45'/%3E %3Ccircle cx='38.6' cy='46.4' r='1.6' fill='%23fff'/%3E%3Ccircle cx='64.6' cy='46.4' r='1.6' fill='%23fff'/%3E %3Ccircle cx='28' cy='62' r='5' fill='%23F49AB4' opacity='.65'/%3E%3Ccircle cx='72' cy='62' r='5' fill='%23F49AB4' opacity='.65'/%3E %3Cellipse cx='12' cy='86' rx='12' ry='9' fill='%23C98B5A' stroke='%231E2B45' stroke-width='3'/%3E%3Cellipse cx='88' cy='86' rx='12' ry='9' fill='%23C98B5A' stroke='%231E2B45' stroke-width='3'/%3E%3C/svg%3E"); width: 76px; height: 70px; top: -60px; left: 12%; }
.d-peek-kapstok.d-peek-right::before { left: auto; right: 12%; }

.d-kapstok-hoofd { animation: d-kapstok-in .8s cubic-bezier(.3,1.4,.5,1) .1s both; }
@keyframes d-kapstok-in { from { translate: 0 -30px; opacity: 0; } }
.d-kapstok-j1, .d-kapstok-j2 { animation: d-kapstok-in .8s cubic-bezier(.3,1.4,.5,1) .4s both, d-kapstok-zwaai 4.2s ease-in-out 1.2s infinite; }
.d-kapstok-j2 { animation-delay: .6s, 2.1s; }
@keyframes d-kapstok-zwaai { 0%, 100% { transform: rotate(-3deg); } 50% { transform: rotate(3deg); } }
/* het nieuwe jasje schuift van rechts in, gaat omhoog en hangt aan het laatste haakje */
.d-kapstok-nieuw { animation: d-kapstok-schuif 2s cubic-bezier(.35,.9,.4,1) 1.2s both, d-kapstok-hang 1.4s ease-out 3.2s both, d-kapstok-zwaai 4.2s ease-in-out 4.6s infinite; }
@keyframes d-kapstok-schuif { 0% { translate: 70vw 30px; rotate: 12deg; opacity: 1; } 65% { translate: 0 30px; rotate: -6deg; } 82% { translate: 0 -14px; rotate: 0deg; } 100% { translate: 0 0; rotate: 0deg; } }
@keyframes d-kapstok-hang { 0% { transform: rotate(14deg); } 30% { transform: rotate(-10deg); } 55% { transform: rotate(6deg); } 80% { transform: rotate(-3deg); } 100% { transform: rotate(-3deg); } }
.d-kapstok-kaartje { animation: d-kapstok-kaart .7s cubic-bezier(.3,1.6,.5,1) 3.4s both, d-kapstok-zwaai 3.6s ease-in-out 4.1s infinite; }
@keyframes d-kapstok-kaart { from { transform: scale(0) rotate(-30deg); } }
.d-kapstok-glim { animation: d-kapstok-glim 1.2s ease-out 3.3s both; }
@keyframes d-kapstok-glim { 0% { transform: scale(0) rotate(0); opacity: 0; } 40% { transform: scale(1.2) rotate(60deg); opacity: 1; } 100% { transform: scale(0) rotate(120deg); opacity: 0; } }

@media (max-width: 781px) {
	.d-kapstok-j1, .d-kapstok-kaartje, .d-kapstok-glim { display: none; }
	.d-scene-kapstok .d-kapstok-hoofd { width: 150px; height: 55px; right: 2%; bottom: calc(3% + 66px); }
	.d-scene-kapstok .d-kapstok-jas { width: 38px; height: 50px; bottom: calc(3% + 31px); }
	.d-scene-kapstok .d-kapstok-j2 { right: calc(2% + 70px); }
	.d-scene-kapstok .d-kapstok-nieuw { right: 2%; }
	.d-peek-kapstok::before { width: 58px; height: 53px; top: -46px; }
}
@media (prefers-reduced-motion: reduce) {
	.d-scene-kapstok > * { animation: none !important; }
	.d-kapstok-glim { display: none; }
}