.ar{position:fixed;inset:0;z-index:100;background:var(--color-shadow-ink);overflow:hidden}.ar[data-fout]{position:relative;inset:auto;z-index:auto;min-height:16rem;margin-block:var(--space-4);border-radius:20px}.ar[data-fout] .ar-scrim,.ar[data-fout] .ar-video{display:none}.ar-video{width:100%;height:100%;object-fit:cover}.ar-scrim,.ar-video{position:absolute;inset:0}.ar-scrim{background:radial-gradient(120% 80% at 50% 40%,transparent 55%,color-mix(in oklab,var(--color-shadow-ink) 45%,transparent)),linear-gradient(to bottom,color-mix(in oklab,var(--color-shadow-ink) 25%,transparent),transparent 30%,transparent 70%,color-mix(in oklab,var(--color-shadow-ink) 50%,transparent));pointer-events:none}.ar-close{position:absolute;top:calc(env(safe-area-inset-top, 0px) + 14px);right:14px;width:44px;height:44px;border-radius:50%;border:0;background:color-mix(in oklab,var(--color-shadow-ink) 45%,transparent);color:var(--color-white);font-size:1.1rem;cursor:pointer;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}.ar-marker{position:absolute;top:42%;transform:translate(-50%,-50%);display:grid;place-items:center;transition:left .18s ease-out;will-change:left}.ar-kaaba{position:relative;z-index:2}.ar-halo{position:absolute;width:9rem;height:9rem;border-radius:50%;background:radial-gradient(circle,color-mix(in oklab,var(--color-gold) 22%,transparent),transparent 62%);opacity:.5;animation:ar-halo 4.5s ease-in-out infinite alternate}@keyframes ar-halo{0%{opacity:.3;transform:scale(.9)}to{opacity:.6;transform:scale(1.08)}}.ar-marker[data-locked=true] .ar-halo{animation:none;opacity:0}.ar-marker[data-behind=true]{opacity:.35}.ar-hint{position:absolute;top:42%;left:50%;transform:translate(-50%,-50%);padding:.5em 1em;border-radius:999px;background:color-mix(in oklab,var(--color-shadow-ink) 50%,transparent);color:var(--color-surface-2);font-weight:600;font-size:1rem;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);pointer-events:none}.ar-status{position:absolute;left:0;right:0;bottom:calc(env(safe-area-inset-bottom, 0px) + 28px);text-align:center;padding:0 1.5rem;color:var(--color-white);text-shadow:0 1px 6px color-mix(in oklab,var(--color-shadow-ink) 60%,transparent)}.ar-status p{margin:0;font-size:1.05rem}.ar-locked{color:var(--color-gold-deep);font-weight:700}.ar-message{position:absolute;inset:0;display:grid;place-content:center;grid-gap:1.2rem;gap:1.2rem;padding:2rem;text-align:center;color:var(--color-surface-2)}.ar-message p{margin:0;font-size:1.1rem;line-height:1.55;max-width:22rem}.ar-btn{justify-self:center;min-height:46px;padding:0 1.4em;border:1px solid color-mix(in oklab,var(--color-gold) 70%,transparent);border-radius:12px;background:var(--gradient-cta);color:var(--color-on-gold);font-weight:700;cursor:pointer}@media (prefers-reduced-motion:reduce){.ar-halo{animation:none}}.kb-wrap{display:grid;place-items:center;grid-gap:.3rem;gap:.3rem}.kb-knop{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:0;background:none;padding:0;cursor:pointer;display:grid;place-items:center;--kb-schaal:1;--kb-zij:5.2rem;--kb-b:var(--kb-zij);--kb-d:calc(var(--kb-zij) * 0.858);--kb-h:calc(var(--kb-zij) * 1.019);--kb-plint:calc(var(--kb-zij) * 0.05);--kb-plint-uit:calc(var(--kb-zij) * 0.024);--kb-plint-lang:calc(var(--kb-zij) * 0.056);--kb-plint-hoek:26deg;--kb-tempo:26s;--kb-kwart:6.5s}.kb-knop:disabled{cursor:default}.kb-knop:focus-visible{outline:2px solid var(--color-gold-hi);outline-offset:4px;border-radius:14px}.kb-veld{position:relative;display:block;width:calc(var(--kb-zij) * 2.4);height:calc(var(--kb-zij) * 1.9);margin-bottom:.35rem}.kb-scene{perspective:900px;transform:scale(var(--kb-schaal));transform-origin:50% 50%;transition:transform 60ms linear;filter:brightness(calc(.58 + .42 * var(--kb-schaal))) drop-shadow(0 .5rem 1.1rem color-mix(in oklab,var(--color-shadow-ink) 55%,transparent));animation:kb-klaren 1.2s ease-out both}.kb-ruimte,.kb-scene{position:absolute;inset:0}.kb-ruimte{transform-style:preserve-3d;transform:rotateX(-9deg);animation:kb-aankomst 1.2s cubic-bezier(.16,1,.3,1) both}@keyframes kb-klaren{0%{opacity:0}to{opacity:1}}@keyframes kb-aankomst{0%{transform:rotateX(-9deg) translateY(7%) scale(.82)}to{transform:rotateX(-9deg) translateY(0) scale(1)}}.kb-kubus{position:absolute;inset:0;transform-style:preserve-3d;animation:kb-draai var(--kb-tempo) linear infinite}@keyframes kb-draai{0%{transform:rotateY(0deg)}to{transform:rotateY(1turn)}}.kb-vlak{position:absolute;left:50%;top:50%;overflow:hidden;-webkit-backface-visibility:hidden;backface-visibility:hidden;background-color:var(--color-kaaba-doek);background-image:repeating-linear-gradient(90deg,transparent 0 6%,color-mix(in oklab,var(--color-kaaba-glans) 5%,transparent) 6% 10%,transparent 10% 21%,color-mix(in oklab,var(--color-kaaba-doek-diep) 20%,transparent) 21% 24.5%,transparent 24.5% 31%),linear-gradient(177deg,color-mix(in oklab,var(--color-kaaba-doek-hi) 82%,var(--color-kaaba-doek)) 0,var(--color-kaaba-doek) 15%,color-mix(in oklab,var(--color-kaaba-doek) 42%,var(--color-kaaba-doek-diep)) 60%,var(--color-kaaba-doek-diep) 100%);box-shadow:inset .09em 0 0 color-mix(in oklab,var(--color-kaaba-glans) 45%,transparent),inset -.09em 0 0 color-mix(in oklab,var(--color-kaaba-doek-diep) 85%,transparent),inset 0 .07em 0 color-mix(in oklab,var(--color-gold-deep) 34%,transparent),inset 0 -.5em .6em -.35em color-mix(in oklab,var(--color-kaaba-doek-diep) 90%,transparent)}.kb-achter,.kb-voor{width:var(--kb-b);margin-left:calc(var(--kb-b) / -2)}.kb-achter,.kb-links,.kb-rechts,.kb-voor{height:var(--kb-h);margin-top:calc(var(--kb-h) / -2)}.kb-links,.kb-rechts{width:var(--kb-d);margin-left:calc(var(--kb-d) / -2)}.kb-boven,.kb-onder{width:var(--kb-b);height:var(--kb-d);margin-left:calc(var(--kb-b) / -2);margin-top:calc(var(--kb-d) / -2)}.kb-voor{transform:translateZ(calc(var(--kb-d) / 2))}.kb-achter{transform:rotateY(180deg) translateZ(calc(var(--kb-d) / 2))}.kb-links{transform:rotateY(-90deg) translateZ(calc(var(--kb-b) / 2))}.kb-rechts{transform:rotateY(90deg) translateZ(calc(var(--kb-b) / 2))}.kb-boven{transform:rotateX(90deg) translateZ(calc(var(--kb-h) / 2));background-image:radial-gradient(130% 150% at 28% 18%,var(--color-kaaba-dak) 0,color-mix(in oklab,var(--color-kaaba-doek) 55%,var(--color-kaaba-doek-diep)) 52%,var(--color-kaaba-doek-diep) 100%);box-shadow:inset 0 0 0 .05em color-mix(in oklab,var(--color-gold-deep) 48%,transparent)}.kb-onder{transform:rotateX(-90deg) translateZ(calc(var(--kb-h) / 2));background-image:none;background-color:var(--color-kaaba-doek-diep);box-shadow:none}.kb-weefsel{background-image:repeating-linear-gradient(58deg,color-mix(in oklab,var(--color-kaaba-glans) 11%,transparent) 0 1px,transparent 1px 5px),repeating-linear-gradient(-58deg,color-mix(in oklab,var(--color-kaaba-doek-diep) 24%,transparent) 0 1px,transparent 1px 5px);opacity:calc((var(--kb-schaal) - .25) * 1.1)}.kb-plooi,.kb-weefsel{position:absolute;inset:0;pointer-events:none}.kb-plooi{background-image:repeating-linear-gradient(90deg,transparent 0 4%,color-mix(in oklab,var(--color-kaaba-glans) 7%,transparent) 4% 7.5%,transparent 7.5% 15%,color-mix(in oklab,var(--color-kaaba-doek-diep) 30%,transparent) 15% 18.5%,transparent 18.5% 26%);-webkit-mask-image:linear-gradient(180deg,transparent 6%,var(--color-white) 78%);mask-image:linear-gradient(180deg,transparent 6%,var(--color-white) 78%)}.kb-licht{position:absolute;inset:0;background-image:linear-gradient(148deg,color-mix(in oklab,var(--color-kaaba-glans) 92%,transparent) 0,color-mix(in oklab,var(--color-kaaba-glans) 52%,transparent) 36%,color-mix(in oklab,var(--color-kaaba-glans) 15%,transparent) 72%,transparent 100%),linear-gradient(90deg,color-mix(in oklab,var(--color-gold-hi) 32%,transparent) 0 1.2%,transparent 1.2% 100%);opacity:0;animation:kb-licht var(--kb-tempo) linear infinite;pointer-events:none}@keyframes kb-licht{0%{opacity:.82}9%{opacity:1}30%{opacity:.24}54%{opacity:0}80%{opacity:.12}to{opacity:.82}}.kb-r0 .kb-licht{animation-delay:0s}.kb-r1 .kb-licht{animation-delay:calc(var(--kb-kwart) * -3)}.kb-r2 .kb-licht{animation-delay:calc(var(--kb-kwart) * -2)}.kb-r3 .kb-licht{animation-delay:calc(var(--kb-kwart) * -1)}.kb-plintvlak .kb-licht{background-image:linear-gradient(148deg,color-mix(in oklab,var(--color-white) 22%,transparent) 0,color-mix(in oklab,var(--color-white) 7%,transparent) 46%,transparent 88%)}.kb-hizam{top:24.5%;height:6.8%;background-image:repeating-linear-gradient(90deg,color-mix(in oklab,var(--color-gold-hi) 62%,transparent) 0 .7%,color-mix(in oklab,var(--color-gold) 66%,transparent) .7% 1.4%,transparent 1.4% 17.4%,color-mix(in oklab,var(--color-gold) 70%,transparent) 17.4% 18.1%,color-mix(in oklab,var(--color-gold-deep) 45%,var(--color-shadow-ink)) 18.1% 19%,transparent 19% 20%),linear-gradient(180deg,color-mix(in oklab,var(--color-gold-hi) 82%,var(--color-white)) 0 8%,var(--color-gold) 8% 15%,color-mix(in oklab,var(--color-shadow-ink) 22%,transparent) 15% 22%,transparent 22% 82%,color-mix(in oklab,var(--color-gold-deep) 85%,transparent) 82% 91%,color-mix(in oklab,var(--color-gold-deep) 50%,var(--color-shadow-ink)) 91% 100%),linear-gradient(178deg,color-mix(in oklab,var(--color-gold-deep) 84%,var(--color-shadow-ink)) 0,color-mix(in oklab,var(--color-gold-deep) 62%,var(--color-shadow-ink)) 100%);box-shadow:0 .14em .28em -.06em color-mix(in oklab,var(--color-shadow-ink) 70%,transparent),inset 0 .04em 0 color-mix(in oklab,var(--color-gold-hi) 85%,transparent)}.kb-hangers,.kb-hizam{position:absolute;left:0;right:0;pointer-events:none}.kb-hangers{top:31.3%;height:6.6%;background-image:radial-gradient(9% 12% at 50% 10%,color-mix(in oklab,var(--color-gold-hi) 80%,transparent) 0 60%,transparent 78%),radial-gradient(15% 36% at 50% 52%,color-mix(in oklab,var(--color-gold-hi) 62%,transparent) 0 20%,color-mix(in oklab,var(--color-gold) 68%,transparent) 46%,color-mix(in oklab,var(--color-gold-deep) 66%,transparent) 74%,transparent 86%),radial-gradient(15% 36% at 54% 58%,color-mix(in oklab,var(--color-shadow-ink) 62%,transparent) 0 46%,transparent 88%);background-size:20% 100%;background-repeat:repeat-x}.kb-poort{position:absolute;left:44%;bottom:4.5%;width:34%;height:61%;background-image:repeating-linear-gradient(90deg,color-mix(in oklab,var(--color-shadow-ink) 10%,transparent) 0 1px,transparent 1px 5px),linear-gradient(168deg,color-mix(in oklab,var(--color-gold-deep) 40%,var(--color-shadow-ink)) 0,color-mix(in oklab,var(--color-gold-deep) 26%,var(--color-shadow-ink)) 58%,color-mix(in oklab,var(--color-gold-deep) 18%,var(--color-shadow-ink)) 100%);box-shadow:0 .14em .36em -.08em color-mix(in oklab,var(--color-shadow-ink) 82%,transparent),inset 0 0 0 .03em color-mix(in oklab,var(--color-gold) 62%,transparent)}.kb-bovenveld{position:absolute;inset:6% 13% 62% 13%;background-image:linear-gradient(176deg,color-mix(in oklab,var(--color-gold-deep) 46%,var(--color-shadow-ink)) 0,color-mix(in oklab,var(--color-gold-deep) 28%,var(--color-shadow-ink)) 100%);box-shadow:inset 0 0 0 .028em color-mix(in oklab,var(--color-gold) 45%,transparent),inset 0 .14em .2em -.14em color-mix(in oklab,var(--color-shadow-ink) 65%,transparent)}.kb-drempel{position:absolute;left:-3%;right:-3%;bottom:-1%;height:3.4%;background-image:linear-gradient(180deg,color-mix(in oklab,var(--color-kaaba-mataf) 52%,var(--color-shadow-ink)) 0 36%,color-mix(in oklab,var(--color-kaaba-mataf) 36%,var(--color-shadow-ink)) 36% 74%,color-mix(in oklab,var(--color-kaaba-mataf) 20%,var(--color-shadow-ink)) 74% 100%);box-shadow:0 .08em .18em -.08em color-mix(in oklab,var(--color-shadow-ink) 80%,transparent)}.kb-deur{position:absolute;inset:42% 21% 9% 21%;background-image:linear-gradient(90deg,transparent 0 49.4%,color-mix(in oklab,var(--color-shadow-ink) 32%,transparent) 49.4% 50.6%,transparent 50.6% 100%),linear-gradient(172deg,color-mix(in oklab,var(--color-gold) 92%,transparent) 0,color-mix(in oklab,var(--color-gold) 78%,var(--color-gold-deep)) 48%,color-mix(in oklab,var(--color-gold-deep) 88%,var(--color-shadow-ink)) 100%);box-shadow:inset 0 0 0 .03em color-mix(in oklab,var(--color-gold-deep) 80%,transparent),inset 0 .2em .3em -.2em color-mix(in oklab,var(--color-shadow-ink) 55%,transparent)}.kb-plintvlak{position:absolute;left:50%;top:50%;height:var(--kb-plint-lang);margin-top:calc(var(--kb-plint-lang) / -2);overflow:hidden;-webkit-backface-visibility:hidden;backface-visibility:hidden;-webkit-clip-path:polygon(var(--kb-mijter) 0,calc(100% - var(--kb-mijter)) 0,100% 100%,0 100%);clip-path:polygon(var(--kb-mijter) 0,calc(100% - var(--kb-mijter)) 0,100% 100%,0 100%);background-color:color-mix(in oklab,var(--color-kaaba-mataf) 34%,var(--color-shadow-ink));background-image:repeating-linear-gradient(90deg,color-mix(in oklab,var(--color-shadow-ink) 22%,transparent) 0 1px,transparent 1px 9%),linear-gradient(180deg,color-mix(in oklab,var(--color-shadow-ink) 96%,transparent) 0 18%,color-mix(in oklab,var(--color-kaaba-mataf) 46%,var(--color-shadow-ink)) 18% 34%,color-mix(in oklab,var(--color-kaaba-mataf) 40%,var(--color-shadow-ink)) 34% 74%,color-mix(in oklab,var(--color-kaaba-mataf) 26%,var(--color-shadow-ink)) 74% 100%)}.kb-p-achter,.kb-p-voor{width:calc(var(--kb-b) + var(--kb-plint-uit) * 2);margin-left:calc((var(--kb-b) + var(--kb-plint-uit) * 2) / -2);--kb-mijter:2.29%}.kb-p-links,.kb-p-rechts{width:calc(var(--kb-d) + var(--kb-plint-uit) * 2);margin-left:calc((var(--kb-d) + var(--kb-plint-uit) * 2) / -2);--kb-mijter:2.65%}.kb-p-voor{transform:translateZ(calc(var(--kb-d) / 2 + var(--kb-plint-uit) / 2)) translateY(calc(var(--kb-h) / 2 + var(--kb-plint) / 2)) rotateX(var(--kb-plint-hoek))}.kb-p-achter{transform:rotateY(180deg) translateZ(calc(var(--kb-d) / 2 + var(--kb-plint-uit) / 2)) translateY(calc(var(--kb-h) / 2 + var(--kb-plint) / 2)) rotateX(var(--kb-plint-hoek))}.kb-p-links{transform:rotateY(-90deg) translateZ(calc(var(--kb-b) / 2 + var(--kb-plint-uit) / 2)) translateY(calc(var(--kb-h) / 2 + var(--kb-plint) / 2)) rotateX(var(--kb-plint-hoek))}.kb-p-rechts{transform:rotateY(90deg) translateZ(calc(var(--kb-b) / 2 + var(--kb-plint-uit) / 2)) translateY(calc(var(--kb-h) / 2 + var(--kb-plint) / 2)) rotateX(var(--kb-plint-hoek))}.kb-grond{left:50%;top:50%;width:calc(var(--kb-b) * 2.9);height:calc(var(--kb-b) * 2.9);margin-left:calc(var(--kb-b) * -1.45);margin-top:calc(var(--kb-b) * -1.45);transform:rotateX(-90deg) translateZ(calc(var(--kb-h) / 2 + var(--kb-plint) + .5px));background-image:radial-gradient(closest-side,color-mix(in oklab,var(--color-shadow-ink) 97%,transparent) 0 21%,color-mix(in oklab,var(--color-shadow-ink) 72%,transparent) 30%,color-mix(in oklab,var(--color-shadow-ink) 26%,transparent) 43%,transparent 60%),radial-gradient(closest-side,color-mix(in oklab,var(--color-kaaba-mataf) 10%,transparent) 0 28%,color-mix(in oklab,var(--color-kaaba-mataf) 4%,transparent) 56%,transparent 92%);pointer-events:none}.kb-grond,.kb-mataf{position:absolute;border-radius:50%}.kb-mataf{inset:30%;border:1px solid color-mix(in oklab,var(--color-kaaba-mataf) 8%,transparent)}.kb-rimpel{position:absolute;inset:22%;border-radius:50%;border:1px solid color-mix(in oklab,var(--color-gold-hi) 70%,transparent);opacity:0;transform:scale(.45)}.kb-zuil{width:calc(var(--kb-b) * 1.7);height:calc(var(--kb-h) * 3);margin-left:calc(var(--kb-b) * -.85);margin-top:calc(var(--kb-h) * -2.3);transform:rotateX(9deg) translateZ(calc(var(--kb-d) / -2 - 2px));background-image:radial-gradient(38% 56% at 50% 100%,color-mix(in oklab,var(--color-gold-hi) 42%,transparent) 0,color-mix(in oklab,var(--color-gold) 13%,transparent) 44%,transparent 82%);opacity:0;transition:opacity .9s ease-out}.kb-verte,.kb-zuil{position:absolute;left:50%;top:50%;pointer-events:none}.kb-verte{width:2.6rem;height:2.6rem;margin:-1.3rem 0 0 -1.3rem;border-radius:50%;background-image:radial-gradient(closest-side,var(--color-gold-hi) 0 7%,color-mix(in oklab,var(--color-gold-hi) 70%,transparent) 15%,color-mix(in oklab,var(--color-gold) 28%,transparent) 33%,color-mix(in oklab,var(--color-gold) 9%,transparent) 52%,transparent 76%);opacity:calc((.5 - var(--kb-schaal)) * 2.2)}.kb-knop[data-reist=true] .kb-scene{transition:none}.kb-knop[data-vergrendeld=true] .kb-kubus,.kb-knop[data-vergrendeld=true] .kb-kubus *{animation-play-state:paused}.kb-knop[data-vergrendeld=true] .kb-scene{filter:brightness(1.06) drop-shadow(0 .4rem .9rem color-mix(in oklab,var(--color-shadow-ink) 55%,transparent)) drop-shadow(0 0 .1rem color-mix(in oklab,var(--color-gold-hi) 75%,transparent)) drop-shadow(0 0 1.6rem color-mix(in oklab,var(--color-gold) 60%,transparent))}.kb-knop[data-vergrendeld=true] .kb-zuil{opacity:1}.kb-knop[data-vergrendeld=true] .kb-rimpel{animation:kb-rimpel 4.2s ease-out infinite}.kb-knop[data-vergrendeld=true] .kb-veld{animation:kb-adem 6.5s ease-in-out infinite alternate}@keyframes kb-rimpel{0%{opacity:0;transform:scale(.45)}18%{opacity:.75}to{opacity:0;transform:scale(1.6)}}@keyframes kb-adem{0%{transform:scale(1)}to{transform:scale(1.022)}}.kb-teller{margin:0;font-feature-settings:"tnum";font-variant-numeric:tabular-nums;color:var(--color-gold-deep);font-size:.95rem;letter-spacing:.08em;line-height:1;text-shadow:0 1px 8px color-mix(in oklab,var(--color-shadow-ink) 70%,transparent)}.kb-teller b{font-weight:700;font-size:1.7rem;letter-spacing:-.01em}.kb-tekst{margin:0;color:var(--color-white);font-size:.9rem;letter-spacing:.01em;text-align:center;text-shadow:0 1px 6px var(--color-shadow-ink)}@media (prefers-reduced-motion:reduce){.kb-kubus,.kb-licht,.kb-rimpel,.kb-ruimte,.kb-scene,.kb-veld{animation:none}.kb-scene{transition:none;opacity:1}.kb-ruimte{transform:rotateX(-9deg)}.kb-kubus{transform:rotateY(-27deg)}.kb-zuil{transition:none}.kb-r0 .kb-licht{opacity:.92}.kb-r3 .kb-licht{opacity:.16}.kb-knop[data-vergrendeld=true] .kb-rimpel{opacity:.5;transform:scale(1.1)}}