:root{color-scheme:dark;--pink:#ff38aa;--blue:#18baff;--gold:#ffd27b}
*{box-sizing:border-box}
html,body{margin:0;padding:0;width:100%}
body{background:#100906;color:#fff;font-family:Arial,sans-serif;overflow-x:hidden}
main{width:100%;max-width:none;margin:0}
.poster{position:relative;width:100%;max-width:none;margin:0;container-type:inline-size}
.poster-image{display:block;width:100%;max-width:none;height:auto}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}

.machine-sign{position:absolute;left:3.7%;top:33.3%;width:21%;height:25.1%;display:flex;align-items:flex-start}
.machine-sign .machine-list{width:100%}
.machine-list button{font:inherit;color:inherit;cursor:pointer}
.machine-sign button{display:block;width:100%;border:0;background:transparent;text-align:left;white-space:nowrap;font-family:"Segoe Print","Bradley Hand","Chalkboard SE","Comic Sans MS",cursive;font-weight:600;font-size:1.5cqw;line-height:1.35;text-transform:none;color:#f5eee0;text-shadow:.5px .5px 1px #fff8,-.4px 0 1px #fff6,0 1px 3px #000;letter-spacing:.01em;padding:.85cqw .2cqw}
.machine-sign button:nth-child(3n+1){transform:rotate(-1deg)}
.machine-sign button:nth-child(3n+2){transform:rotate(.6deg)}
.machine-sign button::before{content:'✓';color:#ffabd9;text-shadow:0 0 2px #ffc2e3;margin-right:.65cqw}
.machine-sign button:hover,.machine-sign button:focus-visible{color:#fff;background:#ff38aa25;text-shadow:0 0 8px var(--pink)}
button:focus-visible,a:focus-visible{outline:2px solid white;outline-offset:3px}

.top-nav{position:absolute;left:32%;right:4%;top:2.5%;height:6%;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1cqw}
.top-nav button{min-width:0;background:#160a0799;border:1px solid #bd7939;border-radius:.8cqw;color:#ffd27b;text-shadow:0 0 7px #ff9e39;font:600 1.7cqw Arial,sans-serif;cursor:pointer;padding:.8cqw}
.top-nav button:hover{color:#ff8bca;border-color:#ff38aa;box-shadow:0 0 10px #ff38aa66}
.top-nav small{display:block;font-size:1.25cqw;color:#ff8bca;margin-top:.4cqw}
.top-nav .nav-why{display:block;font-weight:800;color:var(--gold);text-shadow:0 0 7px #ff9e39}
.top-nav .nav-who{color:#ff8bca;white-space:nowrap;text-shadow:0 0 7px #ff38aa66}

.contacts{position:absolute;left:4%;right:4%;top:90.5%;bottom:3%;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));align-items:center}
.contact{display:flex;align-items:center;gap:.7cqw;text-decoration:none;min-width:0;padding:.8cqw;border-right:1px solid #c68a4866;color:var(--pink)}
.contact:last-child{border:0}
.contact svg{width:4cqw;min-width:4cqw;fill:none;stroke:currentColor;stroke-width:2;stroke-linejoin:round;stroke-linecap:round;filter:drop-shadow(0 0 4px currentColor)}
.contact span{font-size:1.22cqw;line-height:1.5;color:var(--gold)}
.contact strong{display:block;font-size:1.45cqw;white-space:nowrap}
.phone span{color:#ffa4d9;text-shadow:0 0 5px #ff38aa}
.mail,.facebook{color:var(--blue)}
.instagram strong,.facebook strong{color:#77d7ff}
.contact:hover{filter:brightness(1.35)}

.mobile-machines{display:none}
.bubble{color:white;border:2px solid var(--pink);border-radius:26px;background:#160c10;box-shadow:0 0 20px #ff38aa70;padding:24px;width:min(460px,calc(100vw - 28px));max-height:85dvh;overflow:auto}
.bubble::backdrop{background:#0009}
.bubble h2{font-size:22px;color:#ff9ed5;padding-right:28px;margin:0 0 18px}
.bubble img{display:block;width:100%;height:auto;border-radius:12px}
.bubble img.grill{height:220px;object-fit:cover;object-position:50% 89%}
.bubble p{line-height:1.6}
.close{position:absolute;right:10px;top:7px;width:44px;height:44px;border:0;background:transparent;color:white;font-size:32px;cursor:pointer}
.call{display:block;border:1px solid #ff66b9;border-radius:12px;padding:14px;text-align:center;color:#fff;text-decoration:none;background:#ff38aa20}
.bubble:not([open]){display:none}

#info-content li{padding:5px 0}
#info-content .call{margin-top:20px}
.tab-image-wrap{width:100%;text-align:center}
.tab-image{display:block;width:100%;max-width:900px;height:auto;margin:0 auto;border-radius:12px}
.tab-image + .tab-image{margin-top:20px}
#info-dialog.tab-dialog{width:min(94vw,950px);max-width:950px}
@media(min-width:768px){
  #info-dialog.tab-dialog.party-dialog{width:min(96vw,1500px);max-width:1500px}
  .party-packages{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;align-items:start}
  .party-packages > .tab-image{min-width:0;max-width:none;margin:0}
  .party-packages > .tab-image + .tab-image{margin-top:0}
}

#bubble-image{width:100%;height:auto;max-height:45dvh;object-fit:contain;background:#100b10}
#machine-bubble{position:fixed;inset:auto;margin:0;z-index:1000;width:min(340px,calc(100vw - 24px));padding:19px 18px 16px;border:3px solid #261629;border-radius:43px 34px 46px 30px / 31px 43px 32px 45px;background:#fff8e9;color:#34243a;box-shadow:4px 5px 0 #ff53b7,7px 9px 0 #24132466;overflow:visible;max-height:none;font-family:Verdana,Arial,sans-serif}
#machine-bubble::before{content:"";position:absolute;width:22px;height:22px;background:#fff8e9;border-left:3px solid #261629;border-bottom:3px solid #261629;left:-14px;top:var(--tail-y,45px);transform:rotate(45deg) skew(12deg,12deg)}
#machine-bubble[data-side="left"]::before{left:auto;right:-14px;transform:rotate(225deg) skew(12deg,12deg)}
#machine-bubble[data-side="above"]::before{left:var(--tail-x,45px);top:auto;bottom:-14px;transform:rotate(-45deg) skew(12deg,12deg)}
#machine-bubble[data-side="below"]::before{left:var(--tail-x,45px);top:-14px;transform:rotate(135deg) skew(12deg,12deg)}
#machine-bubble h2{font:700 22px/1.2 "Segoe Print","Comic Sans MS",cursive;color:#b82479;margin:0 0 9px;padding-right:32px}
#machine-bubble #bubble-image{height:clamp(85px,23dvh,185px);max-height:185px;object-fit:contain;background:transparent;border-radius:15px}
#machine-bubble p{font-family:Verdana,Arial,sans-serif;font-size:16px;line-height:1.65;margin:12px 0}
#machine-bubble .call{background:#ffe2f1;border:2px solid #c13b87;color:#612143;font:600 14px/1.5 Verdana,Arial,sans-serif;padding:9px}
#machine-bubble .close{color:#682751;top:4px;right:7px}

.sign-zoom,.machine-sign .sign-close{display:none}

.cookie-banner{position:fixed;inset:0;z-index:9999;background:rgba(0,0,0,.72);display:flex;align-items:flex-end;justify-content:center;padding:18px}
.cookie-banner[hidden]{display:none}
.cookie-box{width:min(720px,100%);background:#170d0b;border:2px solid #ff38aa;border-radius:18px;padding:22px;color:#fff;box-shadow:0 0 30px rgba(255,56,170,.35)}
.cookie-box h2{margin:0 0 10px;color:#ff8dca}
.cookie-box p{line-height:1.5}
.cookie-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:16px}
.cookie-actions button,.cookie-preferences button{border:1px solid #ff66b9;border-radius:10px;background:rgba(255,56,170,.13);color:#fff;padding:12px 16px;cursor:pointer;font:inherit}
.cookie-actions button:first-child{background:#ff38aa}
.cookie-preferences{margin-top:18px;border-top:1px solid rgba(255,255,255,.2);padding-top:15px}
.cookie-preferences[hidden]{display:none}
.cookie-preferences label{display:block;margin:12px 0}
.cookie-company{margin:16px 0 0;font-size:12px;opacity:.7}
.cookie-change{position:fixed;left:12px;bottom:12px;z-index:4000;border:1px solid #ff66b9;border-radius:20px;background:rgba(22,12,16,.92);color:#fff;padding:8px 13px;cursor:pointer;font-size:12px}

/* CVR står fast centreret nederst, ved siden af Cookievalg */
.site-cvr{position:fixed;left:50%;bottom:12px;transform:translateX(-50%);z-index:3999;margin:0;padding:8px 13px;border:1px solid #bd7939;border-radius:20px;background:rgba(22,12,16,.92);color:var(--gold);font-size:12px;line-height:1;white-space:nowrap;box-shadow:0 0 8px #0008}

@media(min-width:601px){
  body{width:100%;margin:0}
  main{width:100%;max-width:none;margin:0}
  .poster{width:100%;max-width:none;margin:0}
  .poster-image{width:100%;max-width:none;height:auto}
}

@media(max-width:600px){
  body{background:#080403}
  main{width:100%;max-width:none;overflow:hidden}
  .poster{width:100vw;max-width:100vw;margin:0}
  .poster-image{display:block;width:100vw;max-width:none;height:auto;object-fit:contain}

  .top-nav{left:29%;right:2%;top:1.25%;height:8%;gap:4px}
  .top-nav button{min-width:0;border-radius:6px;padding:4px 2px;font-size:clamp(9px,2.55vw,13px);line-height:1.05;text-shadow:0 0 4px #ff9e39}
  .top-nav small{font-size:clamp(7px,1.9vw,10px);line-height:1.05;margin-top:3px}
  .top-nav .nav-who{font-size:clamp(8px,2.1vw,11px)}

  .contacts{left:2%;right:2%;top:89.2%;bottom:1%;gap:1px}
  .contact{min-height:44px;padding:2px;flex-direction:column;justify-content:center;gap:2px;text-align:center}
  .contact svg{width:18px;min-width:18px;height:18px}
  .contact span{font-size:clamp(7px,1.9vw,10px);line-height:1.15}
  .contact strong{font-size:clamp(7px,2vw,10px);white-space:normal}

  .machine-sign{width:21%}
  .machine-sign button{font-size:1.5cqw}

  .sign-zoom{display:block;position:absolute;left:17%;top:55%;width:46px;height:46px;border:1px solid #ff8cca;border-radius:50%;background:#1a0c0ce8;color:#ffd8ed;font-size:30px;line-height:42px;cursor:pointer;z-index:2;box-shadow:0 0 12px #ff38aa88}

  .machine-sign.is-enlarged{position:fixed;z-index:900;top:12px;left:12px;width:calc(100vw - 24px);height:auto;max-height:calc(100dvh - 24px);overflow:auto;background:#201411;border:5px ridge #a16640;border-radius:12px;padding:52px 16px 16px;box-shadow:0 8px 25px #000b}
  .machine-sign.is-enlarged .machine-list button{font-size:18px;min-height:48px;padding:10px 4px;transform:none}
  .machine-sign.is-enlarged .sign-close{display:block;position:absolute;top:2px;right:2px;width:46px;height:46px;font:32px Arial;text-align:center;padding:0}
  .machine-sign.is-enlarged .sign-close::before{content:none}

  #info-dialog.tab-dialog{width:100vw;max-width:100vw;height:100dvh;max-height:100dvh;margin:0;padding:54px 8px 16px;border-left:0;border-right:0;border-radius:0;overflow-y:auto}
  #info-dialog.tab-dialog h2{margin:0 45px 12px 4px;font-size:22px}
  #info-dialog.tab-dialog .close{position:fixed;right:10px;top:8px;z-index:10;width:46px;height:46px;border:1px solid #ff75c5;border-radius:50%;background:#160c10;font-size:32px}
  .tab-image-wrap{width:100%;padding:0;margin:0}
  .tab-image{display:block;width:100%;max-width:none;height:auto;margin:0;border-radius:8px}
  .tab-image + .tab-image{margin-top:12px}

  #info-dialog:not(.tab-dialog){width:calc(100vw - 20px);max-width:none;padding:48px 18px 22px;max-height:92dvh}

  #machine-bubble{width:min(310px,calc(100vw - 20px));padding:17px 14px 13px}
  #machine-bubble h2{font-size:19px}
  #machine-bubble #bubble-image{height:20dvh;max-height:150px}

  .mobile-machines{display:none}

  .cookie-box{padding:18px}
  .cookie-actions{flex-direction:column}
  .cookie-actions button{width:100%}

  .site-cvr{bottom:12px;font-size:11px;padding:8px 10px}
}

@media(max-width:390px){
  .top-nav{left:28%}
  .top-nav button{font-size:9px}
  .top-nav small{font-size:7px}
  .sign-zoom{width:42px;height:42px;font-size:27px}
  .cookie-change{left:6px;padding:8px 9px}
  .site-cvr{font-size:10px}
}

@media(max-height:450px){
  #machine-bubble #bubble-image{height:75px}
  #machine-bubble{padding:12px}
  #machine-bubble h2{font-size:17px}
  #machine-bubble p{font-size:14px;line-height:1.5;margin:6px 0}
}

@media(prefers-reduced-motion:no-preference){
  .contact,.machine-list button{transition:background .15s,filter .15s}
}


/* HVEM ER DT? */
.about-dt{max-width:820px;margin:0 auto;text-align:left;line-height:1.72;font-size:16px}
.about-dt h3{margin:32px 0 10px;color:var(--pink);font-size:24px;text-shadow:0 0 8px #ff38aa55}
.about-dt p{margin:0 0 16px}
.about-hero{padding:18px;border:1px solid #bd7939;border-radius:20px;background:#120a08;box-shadow:0 0 22px #ff38aa25;text-align:center}
.about-hero img{display:block;width:min(330px,100%);aspect-ratio:1/1;object-fit:cover;margin:0 auto 18px;border-radius:50%;border:4px solid var(--pink);box-shadow:0 0 22px #18baff77}
.about-hero p{font-size:18px;margin:0}
.softice-mission{display:grid;grid-template-columns:auto 1fr;gap:18px;margin:36px 0;padding:22px;border:2px solid var(--blue);border-radius:22px;background:linear-gradient(135deg,#18baff16,#ff38aa16);box-shadow:0 0 24px #18baff35}
.softice-mission h3{margin:0 0 10px;color:var(--gold)}
.softice-icon{font-size:56px;line-height:1}
.mission-status{margin-top:18px;padding:13px;border:1px solid var(--pink);border-radius:12px;text-align:center;font-weight:800;color:#fff;background:#ff38aa20}
.about-finale{margin-top:28px;padding:22px;border-top:1px solid #bd7939;text-align:center}
.about-finale .welcome{font-size:22px;color:var(--gold)}
@media(max-width:600px){
 .about-dt{font-size:15px;padding:0 5px}
 .about-dt h3{font-size:21px}
 .about-hero{padding:14px}
 .softice-mission{grid-template-columns:1fr;padding:17px}
 .softice-icon{text-align:center}
}
