/* Wereld: wekker — wekker-mascotte rinkelt, scheurkalender slaat blaadjes om */
body:has(.d-world-wekker) { --t-orange: #FFE3CF; --t-blue: #DFE8F7; --t-green: #E2F0DF; --t-yellow: #FFF1C9; }
body:has(.d-world-wekker) .d-section.has-vlak-groen-background-color,
body:has(.d-world-wekker) .d-section.has-vlak-blauw-background-color { background: #F2F5FC !important; }
.d-world-wekker { background: radial-gradient(circle at 12% 100%, #FFE6C2 0, rgba(255,230,194,0) 38%), linear-gradient(180deg, #E4ECFA 0%, #FFF6E4 100%) !important; }
.d-world-wekker .d-play-title mark { color: #C9602A !important; }
body:has(.d-world-wekker) main .d-section { position: relative; }
body:has(.d-world-wekker) 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 30 24'%3E%3Cpath d='M0 15 H30' stroke='%23C9D6EA' stroke-width='2'/%3E%3Ccircle cx='15' cy='18' r='2.6' fill='%231E2B45'/%3E%3Cpath d='M15 18 C 9 18 8 5 15 4 C 21 4 21 10 18 13' stroke='%231E2B45' stroke-width='2.4' fill='none' stroke-linecap='round'/%3E%3C/svg%3E") left center / 30px 24px repeat-x; z-index: 2; pointer-events: none; }

.d-scene-wekker { position: absolute !important; inset: 0; height: auto !important; }
.d-wekker-klok { width: 220px; height: 240px; right: 3%; bottom: 10px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 220 240'%3E%3Cpath d='M62 198 L44 230 M158 198 L176 230' stroke='%231E2B45' stroke-width='9' stroke-linecap='round'/%3E%3Cpath d='M78 36 C 90 16 130 16 142 36' stroke='%231E2B45' stroke-width='5' fill='none' stroke-linecap='round'/%3E%3Crect x='104' y='10' width='12' height='26' rx='5' fill='%231E2B45'/%3E%3Cpath d='M28 74 C 20 42 46 20 76 30 Z' fill='%23FFC94D' stroke='%231E2B45' stroke-width='3' stroke-linejoin='round'/%3E%3Cpath d='M192 74 C 200 42 174 20 144 30 Z' fill='%23FFC94D' stroke='%231E2B45' stroke-width='3' stroke-linejoin='round'/%3E%3Ccircle cx='110' cy='125' r='84' fill='%238EAAD5' stroke='%231E2B45' stroke-width='3'/%3E%3Cpath d='M44 104 A 70 70 0 0 1 90 48' stroke='%23B7CAE7' stroke-width='7' fill='none' stroke-linecap='round'/%3E%3Ccircle cx='110' cy='125' r='66' fill='%23FFF6E6' stroke='%231E2B45' stroke-width='3'/%3E%3Cg fill='%231E2B45'%3E%3Ccircle cx='110' cy='68' r='4'/%3E%3Ccircle cx='167' cy='125' r='4'/%3E%3Ccircle cx='110' cy='182' r='4'/%3E%3Ccircle cx='53' cy='125' r='4'/%3E%3C/g%3E%3Cpath d='M110 125 V78' stroke='%231E2B45' stroke-width='5' stroke-linecap='round'/%3E%3Cpath d='M110 125 H136' stroke='%23F07A2B' stroke-width='5' stroke-linecap='round'/%3E%3Ccircle cx='110' cy='125' r='6' fill='%231E2B45'/%3E%3Ccircle cx='86' cy='106' r='5' fill='%231E2B45'/%3E%3Ccircle cx='134' cy='106' r='5' fill='%231E2B45'/%3E%3Ccircle cx='87.6' cy='104.4' r='1.8' fill='%23fff'/%3E%3Ccircle cx='135.6' cy='104.4' r='1.8' fill='%23fff'/%3E%3Cpath d='M96 150 Q 110 162 124 150' stroke='%231E2B45' stroke-width='3' fill='none' stroke-linecap='round'/%3E%3Ccircle cx='78' cy='142' r='7' fill='%23F49AB4' opacity='.65'/%3E%3Ccircle cx='142' cy='142' r='7' fill='%23F49AB4' opacity='.65'/%3E%3C/svg%3E") !important; z-index: 3; transform-origin: 50% 90%; }
.d-wekker-tring { width: 260px; height: 90px; right: max(0px, calc(3% - 20px)); bottom: 190px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 260 90'%3E%3Cg stroke='%23F07A2B' stroke-width='5' fill='none' stroke-linecap='round'%3E%3Cpath d='M44 70 C 30 56 30 34 42 20'/%3E%3Cpath d='M24 78 C 6 58 8 28 24 10'/%3E%3Cpath d='M216 70 C 230 56 230 34 218 20'/%3E%3Cpath d='M236 78 C 254 58 252 28 236 10'/%3E%3C/g%3E%3Cg stroke='%23FFC94D' stroke-width='4' stroke-linecap='round'%3E%3Cpath d='M120 18 V4 M100 22 L94 10 M140 22 L146 10'/%3E%3C/g%3E%3C/svg%3E") !important; z-index: 2; opacity: 0; }
.d-wekker-kalender { width: 120px; height: 130px; right: calc(3% + 240px); bottom: 18px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 130'%3E%3Crect x='10' y='22' width='108' height='106' rx='10' fill='%23E6ECF5' stroke='%231E2B45' stroke-width='3'/%3E%3Crect x='6' y='18' width='108' height='106' rx='10' fill='%23fff' stroke='%231E2B45' stroke-width='3'/%3E%3Cpath d='M6 44 V28 C 6 22 10 18 16 18 H104 C 110 18 114 22 114 28 V44 Z' fill='%23F07A2B' stroke='%231E2B45' stroke-width='3' stroke-linejoin='round'/%3E%3Crect x='22' y='8' width='7' height='20' rx='3.5' fill='%23C9CED8' stroke='%231E2B45' stroke-width='2'/%3E%3Crect x='42' y='8' width='7' height='20' rx='3.5' fill='%23C9CED8' stroke='%231E2B45' stroke-width='2'/%3E%3Crect x='62' y='8' width='7' height='20' rx='3.5' fill='%23C9CED8' stroke='%231E2B45' stroke-width='2'/%3E%3Crect x='82' y='8' width='7' height='20' rx='3.5' fill='%23C9CED8' stroke='%231E2B45' stroke-width='2'/%3E%3Cg transform='translate(6 0)'%3E%3Ccircle cx='21' cy='64' r='4.5' fill='%23C9D6EA'/%3E%3Ccircle cx='43' cy='64' r='4.5' fill='%23C9D6EA'/%3E%3Ccircle cx='65' cy='64' r='4.5' fill='%23C9D6EA'/%3E%3Ccircle cx='87' cy='64' r='4.5' fill='%23C9D6EA'/%3E%3Ccircle cx='21' cy='84' r='4.5' fill='%23C9D6EA'/%3E%3Ccircle cx='43' cy='84' r='4.5' fill='%23C9D6EA'/%3E%3Ccircle cx='65' cy='84' r='8' fill='%23F07A2B' stroke='%231E2B45' stroke-width='2'/%3E%3Ccircle cx='87' cy='84' r='4.5' fill='%23C9D6EA'/%3E%3Ccircle cx='21' cy='104' r='4.5' fill='%23C9D6EA'/%3E%3Ccircle cx='43' cy='104' r='4.5' fill='%23C9D6EA'/%3E%3Ccircle cx='65' cy='104' r='4.5' fill='%23C9D6EA'/%3E%3Ccircle cx='87' cy='104' r='4.5' fill='%23C9D6EA'/%3E%3C/g%3E%3C/svg%3E") !important; z-index: 3; }
.d-wekker-blad { width: 108px; height: 80px; right: calc(3% + 246px); bottom: 24px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 108 80'%3E%3Cpath d='M0 0 H108 V70 C 108 76 104 80 98 80 H10 C 4 80 0 76 0 70 Z' fill='%23FFF6E6' stroke='%231E2B45' stroke-width='3' stroke-linejoin='round'/%3E%3Ccircle cx='21' cy='20' r='4.5' fill='%23C9D6EA'/%3E%3Ccircle cx='43' cy='20' r='8' fill='%23F07A2B' stroke='%231E2B45' stroke-width='2'/%3E%3Ccircle cx='65' cy='20' r='4.5' fill='%23C9D6EA'/%3E%3Ccircle cx='87' cy='20' r='4.5' fill='%23C9D6EA'/%3E%3Ccircle cx='21' cy='40' r='4.5' fill='%23C9D6EA'/%3E%3Ccircle cx='43' cy='40' r='4.5' fill='%23C9D6EA'/%3E%3Ccircle cx='65' cy='40' r='4.5' fill='%23C9D6EA'/%3E%3Ccircle cx='87' cy='40' r='4.5' fill='%23C9D6EA'/%3E%3Ccircle cx='21' cy='60' r='4.5' fill='%23C9D6EA'/%3E%3Ccircle cx='43' cy='60' r='4.5' fill='%23C9D6EA'/%3E%3Ccircle cx='65' cy='60' r='4.5' fill='%23C9D6EA'/%3E%3Ccircle cx='87' cy='60' r='4.5' fill='%23C9D6EA'/%3E%3C/svg%3E") !important; z-index: 4; transform-origin: 50% 0; }
.d-peek-wekker::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 220 240'%3E%3Cpath d='M62 198 L44 230 M158 198 L176 230' stroke='%231E2B45' stroke-width='9' stroke-linecap='round'/%3E%3Cpath d='M78 36 C 90 16 130 16 142 36' stroke='%231E2B45' stroke-width='5' fill='none' stroke-linecap='round'/%3E%3Crect x='104' y='10' width='12' height='26' rx='5' fill='%231E2B45'/%3E%3Cpath d='M28 74 C 20 42 46 20 76 30 Z' fill='%23FFC94D' stroke='%231E2B45' stroke-width='3' stroke-linejoin='round'/%3E%3Cpath d='M192 74 C 200 42 174 20 144 30 Z' fill='%23FFC94D' stroke='%231E2B45' stroke-width='3' stroke-linejoin='round'/%3E%3Ccircle cx='110' cy='125' r='84' fill='%238EAAD5' stroke='%231E2B45' stroke-width='3'/%3E%3Cpath d='M44 104 A 70 70 0 0 1 90 48' stroke='%23B7CAE7' stroke-width='7' fill='none' stroke-linecap='round'/%3E%3Ccircle cx='110' cy='125' r='66' fill='%23FFF6E6' stroke='%231E2B45' stroke-width='3'/%3E%3Cg fill='%231E2B45'%3E%3Ccircle cx='110' cy='68' r='4'/%3E%3Ccircle cx='167' cy='125' r='4'/%3E%3Ccircle cx='110' cy='182' r='4'/%3E%3Ccircle cx='53' cy='125' r='4'/%3E%3C/g%3E%3Cpath d='M110 125 V78' stroke='%231E2B45' stroke-width='5' stroke-linecap='round'/%3E%3Cpath d='M110 125 H136' stroke='%23F07A2B' stroke-width='5' stroke-linecap='round'/%3E%3Ccircle cx='110' cy='125' r='6' fill='%231E2B45'/%3E%3Ccircle cx='86' cy='106' r='5' fill='%231E2B45'/%3E%3Ccircle cx='134' cy='106' r='5' fill='%231E2B45'/%3E%3Ccircle cx='87.6' cy='104.4' r='1.8' fill='%23fff'/%3E%3Ccircle cx='135.6' cy='104.4' r='1.8' fill='%23fff'/%3E%3Cpath d='M96 150 Q 110 162 124 150' stroke='%231E2B45' stroke-width='3' fill='none' stroke-linecap='round'/%3E%3Ccircle cx='78' cy='142' r='7' fill='%23F49AB4' opacity='.65'/%3E%3Ccircle cx='142' cy='142' r='7' fill='%23F49AB4' opacity='.65'/%3E%3C/svg%3E"); width: 62px; height: 68px; top: -54px; left: 13%; }
.d-peek-wekker.d-peek-right::before { left: auto; right: 13%; }

@media (prefers-reduced-motion: no-preference) {
  .d-wekker-klok { animation: d-wekker-in .8s cubic-bezier(.3,1.5,.5,1) .2s both, d-wekker-rinkel 3.2s linear 1.2s infinite; }
  .d-wekker-tring { animation: d-wekker-tring 3.2s linear 1.2s infinite; }
  .d-wekker-kalender { animation: d-wekker-in .8s cubic-bezier(.3,1.5,.5,1) .5s both; }
  .d-wekker-blad { animation: d-wekker-in .8s cubic-bezier(.3,1.5,.5,1) .5s both, d-wekker-omslaan 3.2s ease-in 1.6s infinite; }
}
@keyframes d-wekker-in { from { transform: translateY(40px) scale(.8); opacity: 0; } }
@keyframes d-wekker-rinkel {
  0%, 58%, 100% { transform: none; }
  61% { transform: rotate(-7deg) translateX(-3px); } 64% { transform: rotate(7deg) translateX(3px); }
  67% { transform: rotate(-7deg) translateX(-3px); } 70% { transform: rotate(7deg) translateX(3px); }
  73% { transform: rotate(-6deg) translateX(-2px); } 76% { transform: rotate(6deg) translateX(2px); }
  79% { transform: rotate(-3deg); } 82% { transform: none; }
}
@keyframes d-wekker-tring { 0%, 58% { opacity: 0; transform: scale(.9); } 62%, 78% { opacity: 1; transform: scale(1.05); } 84%, 100% { opacity: 0; transform: scale(1.1); } }
@keyframes d-wekker-omslaan {
  0%, 50% { transform: perspective(320px) rotateX(0); opacity: 1; }
  78% { transform: perspective(320px) rotateX(-105deg) translateY(-6px); opacity: 0; }
  80% { transform: perspective(320px) rotateX(0); opacity: 0; }
  92%, 100% { transform: perspective(320px) rotateX(0); opacity: 1; }
}

@media (max-width: 781px) {
  .d-scene-wekker { transform: scale(.58); transform-origin: right bottom; }
}
