/* ===== wereld: kaart ===== */
body:has(.d-world-kaart) { --t-orange: #FDE3CF; --t-blue: #D8E9F3; --t-green: #DDEFD8; --t-yellow: #FFF2C8; }
body:has(.d-world-kaart) .d-section.has-vlak-groen-background-color,
body:has(.d-world-kaart) .d-section.has-vlak-blauw-background-color { background: #EAF4E6 !important; }
.d-world-kaart { background: repeating-linear-gradient(0deg, rgba(114,154,71,.08) 0 1px, transparent 1px 44px), repeating-linear-gradient(90deg, rgba(114,154,71,.08) 0 1px, transparent 1px 44px), linear-gradient(180deg, #E6F2E2, #F6FBF3) !important; }
.d-world-kaart .d-play-title mark { color: #4E7D2C !important; }
body:has(.d-world-kaart) main .d-section { position: relative; }
body:has(.d-world-kaart) 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 60 24'%3E %3Crect x='0' y='3' width='60' height='18' fill='%23C3CAD6'/%3E %3Cpath d='M0 3 H 60 M0 21 H 60' stroke='%231E2B45' stroke-width='1.5' opacity='.35'/%3E %3Cpath d='M4 12 H 26 M34 12 H 56' stroke='%23fff' stroke-width='3' stroke-linecap='round'/%3E %3C/svg%3E") left center / 60px 24px repeat-x; z-index: 2; pointer-events: none; }
.d-scene-kaart { position: absolute !important; inset: 0; height: auto !important; }
.d-peek-kaart::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 60 80'%3E %3Cpath d='M30 80 C 30 80 6 50 6 30 A 24 24 0 0 1 54 30 C 54 50 30 80 30 80 Z' fill='%23EC8B48' stroke='%231E2B45' stroke-width='3' stroke-linejoin='round'/%3E %3Ccircle cx='22' cy='28' r='4' fill='%231E2B45'/%3E%3Ccircle cx='38' cy='28' r='4' fill='%231E2B45'/%3E %3Ccircle cx='23.3' cy='26.7' r='1.4' fill='%23fff'/%3E%3Ccircle cx='39.3' cy='26.7' r='1.4' fill='%23fff'/%3E %3Cpath d='M25 37 Q 30 42 35 37' stroke='%231E2B45' stroke-width='2.5' fill='none' stroke-linecap='round'/%3E %3Ccircle cx='15' cy='37' r='4' fill='%23F49AB4' opacity='.7'/%3E%3Ccircle cx='45' cy='37' r='4' fill='%23F49AB4' opacity='.7'/%3E %3C/svg%3E"); width: 52px; height: 70px; top: -58px; left: 12%; }
.d-peek-right.d-peek-kaart::before { left: auto; right: 12%; }
@media (prefers-reduced-motion: reduce) { .d-scene-kaart > * { animation: none !important; } }

.d-kaart-hoofd { width: 300px; height: 210px; right: 3%; bottom: 24px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 300 210'%3E %3Crect x='6' y='6' width='288' height='198' rx='18' fill='%23DDEFD8'/%3E %3Cpath d='M206 6 C 194 50 232 72 222 112 C 214 142 242 172 238 204' stroke='%23BFD6EE' stroke-width='18' fill='none'/%3E %3Cellipse cx='70' cy='44' rx='46' ry='28' fill='%23C8E3B5'/%3E %3Crect x='104' y='6' width='16' height='150' fill='%23C3CAD6'/%3E %3Cpath d='M112 10 V 146' stroke='%23fff' stroke-width='2.5' stroke-dasharray='8 7'/%3E %3Crect x='6' y='150' width='288' height='22' fill='%23C3CAD6'/%3E %3Cpath d='M10 161 H 290' stroke='%23fff' stroke-width='3' stroke-dasharray='12 9'/%3E %3Cpath d='M6 150 H 294 M6 172 H 294' stroke='%231E2B45' stroke-width='1.5' opacity='.35'/%3E %3Cpath d='M48 38 V 52' stroke='%238A5A3B' stroke-width='4' stroke-linecap='round'/%3E%3Ccircle cx='48' cy='38' r='11' fill='%23729A47' stroke='%231E2B45' stroke-width='2'/%3E%3Cpath d='M76 50 V 64' stroke='%238A5A3B' stroke-width='4' stroke-linecap='round'/%3E%3Ccircle cx='76' cy='50' r='9' fill='%23729A47' stroke='%231E2B45' stroke-width='2'/%3E%3Cpath d='M256 36 V 50' stroke='%238A5A3B' stroke-width='4' stroke-linecap='round'/%3E%3Ccircle cx='256' cy='36' r='11' fill='%23729A47' stroke='%231E2B45' stroke-width='2'/%3E%3Cpath d='M270 120 V 134' stroke='%238A5A3B' stroke-width='4' stroke-linecap='round'/%3E%3Ccircle cx='270' cy='120' r='9' fill='%23729A47' stroke='%231E2B45' stroke-width='2'/%3E %3Crect x='40' y='98' width='22' height='18' fill='%23FFF6E6' stroke='%231E2B45' stroke-width='2'/%3E%3Cpath d='M37 98 L 51 87 L 65 98 Z' fill='%23EC8B48' stroke='%231E2B45' stroke-width='2' stroke-linejoin='round'/%3E%3Crect x='140' y='50' width='22' height='18' fill='%23FFF6E6' stroke='%231E2B45' stroke-width='2'/%3E%3Cpath d='M137 50 L 151 39 L 165 50 Z' fill='%238EAAD5' stroke='%231E2B45' stroke-width='2' stroke-linejoin='round'/%3E%3Crect x='162' y='114' width='22' height='18' fill='%23FFF6E6' stroke='%231E2B45' stroke-width='2'/%3E%3Cpath d='M159 114 L 173 103 L 187 114 Z' fill='%23F49AB4' stroke='%231E2B45' stroke-width='2' stroke-linejoin='round'/%3E%3Crect x='252' y='80' width='22' height='18' fill='%23FFF6E6' stroke='%231E2B45' stroke-width='2'/%3E%3Cpath d='M249 80 L 263 69 L 277 80 Z' fill='%23FFC94D' stroke='%231E2B45' stroke-width='2' stroke-linejoin='round'/%3E %3Crect x='6' y='6' width='288' height='198' rx='18' fill='none' stroke='%231E2B45' stroke-width='3'/%3E %3C/svg%3E") !important; z-index: 2;
  animation: d-kaart-in .9s cubic-bezier(.3,1.4,.5,1) .2s both; }
.d-kaart-pin { z-index: 4; transform-origin: 50% 100%; opacity: 0; animation: d-kaart-plop .6s cubic-bezier(.3,1.6,.5,1) both; }
.d-kaart-pin-1 { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 54'%3E%3Cpath d='M20 52 C 20 52 4 32 4 20 A 16 16 0 0 1 36 20 C 36 32 20 52 20 52 Z' fill='%23729A47' stroke='%231E2B45' stroke-width='3' stroke-linejoin='round'/%3E%3Ccircle cx='20' cy='20' r='6.5' fill='%23fff' stroke='%231E2B45' stroke-width='2'/%3E%3C/svg%3E") !important; width: 34px; height: 46px; right: calc(3% + 232px); bottom: 133px; animation-delay: 1.00s; }
.d-kaart-pin-2 { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 54'%3E%3Cpath d='M20 52 C 20 52 4 32 4 20 A 16 16 0 0 1 36 20 C 36 32 20 52 20 52 Z' fill='%23EC8B48' stroke='%231E2B45' stroke-width='3' stroke-linejoin='round'/%3E%3Ccircle cx='20' cy='20' r='6.5' fill='%23fff' stroke='%231E2B45' stroke-width='2'/%3E%3C/svg%3E") !important; width: 34px; height: 46px; right: calc(3% + 132px); bottom: 181px; animation-delay: 1.55s; }
.d-kaart-pin-3 { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 54'%3E%3Cpath d='M20 52 C 20 52 4 32 4 20 A 16 16 0 0 1 36 20 C 36 32 20 52 20 52 Z' fill='%238EAAD5' stroke='%231E2B45' stroke-width='3' stroke-linejoin='round'/%3E%3Ccircle cx='20' cy='20' r='6.5' fill='%23fff' stroke='%231E2B45' stroke-width='2'/%3E%3C/svg%3E") !important; width: 34px; height: 46px; right: calc(3% + 110px); bottom: 117px; animation-delay: 2.10s; }
.d-kaart-pin-4 { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 54'%3E%3Cpath d='M20 52 C 20 52 4 32 4 20 A 16 16 0 0 1 36 20 C 36 32 20 52 20 52 Z' fill='%23FFC94D' stroke='%231E2B45' stroke-width='3' stroke-linejoin='round'/%3E%3Ccircle cx='20' cy='20' r='6.5' fill='%23fff' stroke='%231E2B45' stroke-width='2'/%3E%3C/svg%3E") !important; width: 34px; height: 46px; right: calc(3% + 20px); bottom: 151px; animation-delay: 2.65s; }
.d-kaart-auto { width: 56px; height: 35px; right: calc(3% + 230px); bottom: 66px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 70 44'%3E %3Cpath d='M6 32 V 24 C 6 20 9 18 13 18 L 20 18 L 28 7 C 30 5 32 4 35 4 H 48 C 52 4 54 6 56 9 L 61 18 C 65 18 66 21 66 24 V 32 Z' fill='%23F07A2B' stroke='%231E2B45' stroke-width='2.5' stroke-linejoin='round'/%3E %3Cpath d='M24 18 L 31 9 H 40 V 18 Z M44 18 V 9 H 50 L 55 18 Z' fill='%23DDE7F5' stroke='%231E2B45' stroke-width='2' stroke-linejoin='round'/%3E %3Ccircle cx='62' cy='25' r='2.5' fill='%23FFC94D'/%3E %3Ccircle cx='20' cy='33' r='7' fill='%231E2B45'/%3E%3Ccircle cx='20' cy='33' r='2.8' fill='%23C3CAD6'/%3E %3Ccircle cx='52' cy='33' r='7' fill='%231E2B45'/%3E%3Ccircle cx='52' cy='33' r='2.8' fill='%23C3CAD6'/%3E %3C/svg%3E") !important; z-index: 3;
  animation: d-kaart-rij 9s ease-in-out 1.2s infinite both; }
.d-kaart-wolk { width: 100px; height: 50px; left: 52%; top: 8%; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 60'%3E%3Cpath d='M22 52 C 6 52 6 30 22 30 C 24 14 46 10 54 22 C 62 8 90 10 92 28 C 110 26 116 52 98 52 Z' fill='%23fff' stroke='%231E2B45' stroke-width='2.5' stroke-linejoin='round'/%3E%3C/svg%3E") !important; z-index: 1; animation: d-kaart-drijf 14s ease-in-out infinite; }

@keyframes d-kaart-in { from { transform: scale(.6) rotate(-12deg); opacity: 0; } }
@keyframes d-kaart-plop {
  0% { transform: translateY(-70px) scale(.3); opacity: 0; }
  55% { transform: translateY(4px) scale(1.12, .86); opacity: 1; }
  78% { transform: translateY(-6px) scale(.95, 1.06); opacity: 1; }
  100% { transform: translateY(0) scale(1); opacity: 1; }
}
@keyframes d-kaart-rij {
  0% { transform: translateX(0) scaleX(1); }
  44% { transform: translateX(216px) scaleX(1); }
  50% { transform: translateX(216px) scaleX(-1); }
  94% { transform: translateX(0) scaleX(-1); }
  100% { transform: translateX(0) scaleX(1); }
}
@keyframes d-kaart-drijf { 0%, 100% { transform: translateX(0); } 50% { transform: translateX(40px); } }

@media (max-width: 781px) {
  .d-kaart-hoofd { width: 200px; height: 140px; right: 3%; bottom: 14px; }
  .d-kaart-pin-1 { width: 23px; height: 31px; right: calc(3% + 155px); bottom: 86px; }
  .d-kaart-pin-2 { width: 23px; height: 31px; right: calc(3% + 88px); bottom: 118px; }
  .d-kaart-pin-3 { width: 23px; height: 31px; right: calc(3% + 73px); bottom: 76px; }
  .d-kaart-pin-4 { width: 23px; height: 31px; right: calc(3% + 13px); bottom: 98px; }
  .d-kaart-auto { width: 37px; height: 23px; right: calc(3% + 153px); bottom: 42px; animation-name: d-kaart-rij-m; }
  .d-kaart-wolk { display: none; }
  @keyframes d-kaart-rij-m {
    0% { transform: translateX(0) scaleX(1); }
    44% { transform: translateX(144px) scaleX(1); }
    50% { transform: translateX(144px) scaleX(-1); }
    94% { transform: translateX(0) scaleX(-1); }
    100% { transform: translateX(0) scaleX(1); }
  }
}