/* =========================================
   KONKURRENCE-POP-UP — lodtrækning om gavekurven
   Selvstændig: fjern <link>, <script> og #konkurrence-blokken i
   index.html, så er den væk igen efter arrangementet.
   Farverne er hjulets fire (hjul.js: FARVER).
   ========================================= */

.kk {
  --kk-pink: #EC2A78;
  --kk-gul: #FFC222;
  --kk-groen: #6FBE2C;
  --kk-blaa: #2E97DE;
  --kk-navy: #1B2B5C;
  --kk-navy-dyb: #0B1133;
  position: fixed;
  inset: 0;
  z-index: 1000;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  padding: 16px;
  overflow-y: auto;
  overscroll-behavior: contain;
}

.kk[hidden] { display: none; }

.kk-backdrop {
  position: fixed;
  inset: 0;
  background: rgba(6, 10, 32, 0.72);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  animation: kk-fade 0.35s ease both;
}

.kk-dialog {
  position: relative;
  width: 100%;
  max-width: 920px;
  margin: auto;
  display: grid;
  grid-template-columns: 1fr;
  background: #fff;
  border-radius: 24px;
  box-shadow: 0 40px 120px rgba(0, 0, 0, 0.45);
  animation: kk-ind 0.55s cubic-bezier(0.2, 0.9, 0.25, 1.15) both;
}

/* Regnbuekant i hjulets farver */
.kk-dialog::before {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: inherit;
  padding: 3px;
  background: linear-gradient(120deg, var(--kk-pink), var(--kk-gul), var(--kk-groen), var(--kk-blaa), var(--kk-pink));
  background-size: 300% 100%;
  animation: kk-kant 6s linear infinite;
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
  pointer-events: none;
  z-index: 3;
}

@media (min-width: 820px) {
  .kk-dialog { grid-template-columns: 1fr 1.05fr; }
}

.kk-luk {
  position: absolute;
  top: 14px;
  right: 14px;
  z-index: 4;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  border: 0;
  display: grid;
  place-items: center;
  background: rgba(255, 255, 255, 0.92);
  color: var(--kk-navy-dyb);
  cursor: pointer;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.18);
  transition: transform 0.2s, background 0.2s;
}

.kk-luk:hover { transform: rotate(90deg); background: #fff; }
.kk-luk:focus-visible { outline: 3px solid var(--kk-blaa); outline-offset: 2px; }

/* ---- Venstre: scenen med kurven ---- */
.kk-scene {
  position: relative;
  min-height: 230px;
  border-radius: 24px 24px 0 0;
  background:
    radial-gradient(circle at 50% 58%, #2a3f7e 0%, var(--kk-navy) 45%, var(--kk-navy-dyb) 100%);
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
}

@media (min-width: 820px) {
  .kk-scene { min-height: 100%; border-radius: 24px 0 0 24px; }
}

/* Roterende stråler bag kurven */
.kk-straaler {
  position: absolute;
  width: 160%;
  aspect-ratio: 1;
  top: 50%;
  left: 50%;
  translate: -50% -42%;
  background: repeating-conic-gradient(
    from 0deg,
    rgba(255, 255, 255, 0.075) 0deg 9deg,
    transparent 9deg 22.5deg
  );
  -webkit-mask: radial-gradient(circle, #000 0%, transparent 62%);
  mask: radial-gradient(circle, #000 0%, transparent 62%);
  animation: kk-roter 40s linear infinite;
}

/* Farvet glød i hjulets farver */
.kk-gloed {
  position: absolute;
  width: 70%;
  aspect-ratio: 1;
  top: 50%;
  left: 50%;
  translate: -50% -42%;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(255, 226, 170, 0.55) 0%, rgba(255, 210, 140, 0.18) 45%, transparent 70%);
  filter: blur(20px);
}

.kk-kurv {
  position: relative;
  width: min(86%, 360px);
  height: auto;
  margin: 28px 0 22px;
  filter: drop-shadow(0 18px 28px rgba(0, 0, 0, 0.35));
  animation: kk-svaev 4.5s ease-in-out infinite;
}

@media (max-width: 819px) {
  .kk-kurv { width: 220px; margin: 22px 0 56px; }
}

/* Funklende stjerner */
.kk-gnist {
  position: absolute;
  width: 14px;
  height: 14px;
  background: currentColor;
  clip-path: polygon(50% 0, 61% 39%, 100% 50%, 61% 61%, 50% 100%, 39% 61%, 0 50%, 39% 39%);
  animation: kk-funkl 2.4s ease-in-out infinite;
}

.kk-gnist:nth-of-type(1) { top: 16%; left: 14%; color: #F4D58A; }
.kk-gnist:nth-of-type(2) { top: 24%; right: 15%; color: #fff; width: 16px; height: 16px; animation-delay: 0.6s; }
.kk-gnist:nth-of-type(3) { bottom: 22%; left: 10%; color: #fff; width: 10px; height: 10px; animation-delay: 1.2s; }
.kk-gnist:nth-of-type(4) { bottom: 14%; right: 12%; color: #F4D58A; animation-delay: 1.8s; }
.kk-gnist:nth-of-type(5) { top: 52%; right: 6%; color: #fff; width: 8px; height: 8px; animation-delay: 0.9s; }

/* Prisskilt */
.kk-skilt {
  position: absolute;
  left: 18px;
  bottom: 16px;
  z-index: 2;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 7px 12px 7px 8px;
  border-radius: 100px;
  background: rgba(255, 255, 255, 0.1);
  border: 1px solid rgba(255, 255, 255, 0.16);
  color: #fff;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.02em;
  backdrop-filter: blur(4px);
}

@media (max-width: 819px) {
  .kk-skilt { left: 50%; translate: -50% 0; width: max-content; max-width: calc(100% - 32px); }
}

.kk-skilt-prik {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--kk-groen);
  box-shadow: 0 0 0 0 rgba(111, 190, 44, 0.7);
  animation: kk-puls 1.8s ease-out infinite;
}

/* ---- Højre: formularen ---- */
.kk-indhold {
  position: relative;
  padding: 30px 24px 26px;
}

@media (min-width: 820px) {
  .kk-indhold { padding: 44px 42px 34px; }
}

.kk-maerke {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 6px 12px;
  border-radius: 100px;
  background: #eef1f8;
  color: #1B2B5C;
  font-size: 11.5px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  margin-bottom: 14px;
}

/* Smal skærm: kun arrangementets navn, så mærket holder sig på én linje */
@media (max-width: 479px) {
  .kk-maerke-kort { display: none; }
}

.kk-maerke-prik {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: conic-gradient(#EC2A78 0 25%, #FFC222 0 50%, #6FBE2C 0 75%, #2E97DE 0);
}

.kk-titel {
  font-size: clamp(30px, 4.2vw, 42px);
  line-height: 1.02;
  letter-spacing: -0.035em;
  margin-bottom: 12px;
  color: var(--kk-navy-dyb);
}

.kk-tekst {
  font-size: 15.5px;
  line-height: 1.6;
  color: #4a5270;
  margin-bottom: 22px;
}

.kk-felter {
  display: grid;
  grid-template-columns: 1fr;
  gap: 12px;
  margin-bottom: 16px;
}

@media (min-width: 480px) {
  .kk-felter { grid-template-columns: 1fr 1fr; }
}

.kk-felt label {
  display: block;
  font-size: 12.5px;
  font-weight: 600;
  color: var(--kk-navy-dyb);
  margin-bottom: 5px;
}

.kk-felt input {
  width: 100%;
  padding: 12px 14px;
  font: inherit;
  font-size: 15px;
  color: var(--kk-navy-dyb);
  background: #f5f7fa;
  border: 1.5px solid rgba(0, 0, 0, 0.08);
  border-radius: 10px;
  outline: none;
  transition: border-color 0.2s, box-shadow 0.2s, background 0.2s;
}

.kk-felt input::placeholder { color: #8b91a8; }

.kk-felt input:focus {
  background: #fff;
  border-color: var(--kk-blaa);
  box-shadow: 0 0 0 3px rgba(46, 151, 222, 0.18);
}

.kk-felt input.invalid,
.kk-samtykke.invalid .kk-boks {
  border-color: #ef4444;
  box-shadow: 0 0 0 3px rgba(239, 68, 68, 0.15);
}

/* Honeypot — skjult for mennesker, synlig for bots */
.kk-hp {
  position: absolute !important;
  left: -9999px !important;
  width: 1px;
  height: 1px;
  overflow: hidden;
}

/* Samtykke-kortet */
.kk-samtykke {
  display: flex;
  gap: 12px;
  align-items: flex-start;
  padding: 14px;
  border-radius: 12px;
  background: #f5f7fa;
  border: 1.5px solid transparent;
  cursor: pointer;
  margin-bottom: 18px;
  transition: background 0.2s, border-color 0.2s;
}

.kk-samtykke:hover { background: #eef2f8; }
.kk-samtykke.valgt { background: #eef8e6; border-color: rgba(111, 190, 44, 0.45); }
.kk-samtykke.invalid { background: #fef2f2; border-color: rgba(239, 68, 68, 0.4); }

.kk-samtykke input {
  position: absolute;
  opacity: 0;
  width: 1px;
  height: 1px;
}

.kk-boks {
  flex: 0 0 22px;
  height: 22px;
  margin-top: 1px;
  border-radius: 7px;
  border: 2px solid #b9c0d4;
  background: #fff;
  display: grid;
  place-items: center;
  transition: background 0.2s, border-color 0.2s, transform 0.2s;
}

.kk-boks svg { opacity: 0; transform: scale(0.4); transition: opacity 0.2s, transform 0.25s cubic-bezier(0.3, 1.6, 0.5, 1); }

.kk-samtykke input:checked + .kk-boks {
  background: var(--kk-groen);
  border-color: var(--kk-groen);
}

.kk-samtykke input:checked + .kk-boks svg { opacity: 1; transform: scale(1); }
.kk-samtykke input:focus-visible + .kk-boks { outline: 3px solid var(--kk-blaa); outline-offset: 2px; }

.kk-samtykke-tekst {
  font-size: 13.5px;
  line-height: 1.5;
  color: #2d3557;
}

.kk-samtykke-tekst small {
  display: block;
  margin-top: 4px;
  font-size: 12px;
  color: #6b7390;
}

.kk-knap {
  position: relative;
  width: 100%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 16px 24px;
  border: 0;
  border-radius: 12px;
  font: inherit;
  font-size: 16px;
  font-weight: 700;
  color: #fff;
  background: var(--kk-navy-dyb);
  cursor: pointer;
  overflow: hidden;
  transition: transform 0.2s, box-shadow 0.2s;
}

/* Lysglimt der løber hen over knappen */
.kk-knap::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(100deg, transparent 30%, rgba(255, 255, 255, 0.28) 50%, transparent 70%);
  translate: -120% 0;
  animation: kk-glimt 3.2s ease-in-out infinite 1.5s;
}

.kk-knap:hover { transform: translateY(-2px); box-shadow: 0 12px 28px rgba(11, 17, 51, 0.35); }
.kk-knap:focus-visible { outline: 3px solid var(--kk-blaa); outline-offset: 3px; }
.kk-knap:disabled { opacity: 0.6; cursor: progress; transform: none; box-shadow: none; }

.kk-fejl {
  margin-top: 12px;
  padding: 10px 12px;
  border-radius: 10px;
  background: #fef2f2;
  color: #b42318;
  font-size: 13.5px;
  line-height: 1.5;
}

.kk-fejl[hidden] { display: none; }
.kk-fejl a { text-decoration: underline; font-weight: 600; }

.kk-smaat {
  margin-top: 14px;
  font-size: 12px;
  line-height: 1.55;
  color: #8b91a8;
}

.kk-smaat a { color: #4a5270; text-decoration: underline; }
.kk-smaat a:hover { color: var(--kk-navy-dyb); }

/* ---- LinkedIn ---- */
.kk-knap--linkedin {
  max-width: 420px;
  background: #0A66C2;
  text-decoration: none;
}

.kk-knap--linkedin:hover { box-shadow: 0 12px 28px rgba(10, 102, 194, 0.4); }

/* ---- Pop-up nr. 2: LinkedIn ---- */
.kk-dialog[hidden] { display: none; }

.kk-li {
  max-width: 460px;
  grid-template-columns: 1fr !important;
  text-align: center;
}

.kk-li::before { background: #0A66C2; animation: none; }

.kk-li-top {
  position: relative;
  border-radius: 24px 24px 0 0;
  padding: 30px 24px 52px;
  background: radial-gradient(circle at 50% 80%, #2a3f7e 0%, var(--kk-navy) 50%, var(--kk-navy-dyb) 100%);
}

.kk-li-lys { position: absolute; inset: 0; overflow: hidden; border-radius: inherit; }
.kk-li-lys .kk-straaler { translate: -50% -30%; }

.kk-li-ok {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 7px 14px;
  border-radius: 100px;
  background: rgba(111, 190, 44, 0.16);
  border: 1px solid rgba(111, 190, 44, 0.45);
  color: #c9ef9f;
  font-size: 13px;
  font-weight: 600;
}

.kk-li-badge {
  position: absolute;
  left: 50%;
  bottom: -40px;
  translate: -50% 0;
  width: 80px;
  height: 80px;
  border-radius: 22px;
  display: grid;
  place-items: center;
  color: #fff;
  background: #0A66C2;
  border: 5px solid #fff;
  box-shadow: 0 12px 30px rgba(10, 102, 194, 0.45);
  animation: kk-pop 0.6s cubic-bezier(0.3, 1.6, 0.5, 1) 0.15s both;
}

.kk-li-top { margin-bottom: 40px; }

.kk-li-indhold { padding: 14px 32px 28px; }

.kk-li-titel {
  font-size: clamp(26px, 3.4vw, 32px);
  margin-bottom: 10px;
  color: var(--kk-navy-dyb);
}

.kk-li-titel:focus { outline: none; }

.kk-li-tekst {
  font-size: 15.5px;
  line-height: 1.6;
  color: #4a5270;
  margin: 0 auto 20px;
  max-width: 360px;
}

/* Efterligner LinkedIns virksomhedskort, så man genkender det */
.kk-li-kort {
  display: flex;
  align-items: center;
  gap: 12px;
  text-align: left;
  padding: 12px 14px;
  margin-bottom: 14px;
  border-radius: 14px;
  border: 1px solid #dfe3ec;
  background: #fff;
  transition: border-color 0.2s, box-shadow 0.2s;
}

.kk-li-kort:hover { border-color: #0A66C2; box-shadow: 0 6px 18px rgba(10, 102, 194, 0.15); }

.kk-li-kort-logo {
  width: 48px;
  height: 48px;
  padding: 6px;
  border-radius: 10px;
  border: 1px solid #eef0f4;
  object-fit: contain;
}

.kk-li-kort-tekst { flex: 1; min-width: 0; }
.kk-li-kort-tekst strong { display: block; font-size: 15px; color: var(--kk-navy-dyb); }
.kk-li-kort-tekst span { font-size: 12.5px; color: #6b7390; }

.kk-li-kort-foelg {
  flex: 0 0 auto;
  padding: 6px 14px;
  border-radius: 100px;
  border: 1.5px solid #0A66C2;
  color: #0A66C2;
  font-size: 13.5px;
  font-weight: 700;
}

.kk-tak-igen {
  background: none;
  border: 0;
  font: inherit;
  color: #6b7390;
  text-decoration: underline;
  cursor: pointer;
}

.kk-li .kk-tak-igen { display: block; margin: 14px auto 0; font-size: 13.5px; }
.kk-li .kk-tak-igen--lille { margin-top: 4px; font-size: 12px; color: #8b91a8; }

.kk-skift-ud { animation: kk-ud 0.28s ease-in both; }
@keyframes kk-ud { to { opacity: 0; transform: translateY(-16px) scale(0.96); } }

.kk-li-teaser {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-top: 8px;
  font-size: 12.5px;
  font-weight: 600;
  color: #0A66C2;
}

.kk-li-teaser:hover { text-decoration: underline; }

/* ---- Pillen der genåbner pop-up'en ---- */
.kk-pille {
  position: fixed;
  right: 16px;
  bottom: 16px;
  z-index: 900;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 10px 18px 10px 10px;
  border: 0;
  border-radius: 100px;
  font: inherit;
  font-size: 14px;
  font-weight: 700;
  color: var(--kk-navy-dyb, #0B1133);
  background: #fff;
  box-shadow: 0 12px 34px rgba(0, 0, 0, 0.28);
  cursor: pointer;
  animation: kk-ind 0.5s cubic-bezier(0.2, 0.9, 0.25, 1.15) both;
  transition: transform 0.2s;
}

.kk-pille[hidden] { display: none; }
.kk-pille:hover { transform: translateY(-3px); }
.kk-pille:focus-visible { outline: 3px solid #2E97DE; outline-offset: 3px; }

.kk-pille-ikon {
  width: 44px;
  height: 44px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  /* Samme navy som scenen bag den store kurv */
  background: var(--kk-navy, #1B2B5C);
  animation: kk-vrik 3s ease-in-out infinite;
}

/* Konfetti-lærredet over det hele */
.kk-konfetti {
  position: fixed;
  inset: 0;
  z-index: 1001;
  pointer-events: none;
}

body.kk-aaben { overflow: hidden; }

/* ---- Animationer ---- */
@keyframes kk-fade { from { opacity: 0; } to { opacity: 1; } }
@keyframes kk-ind { from { opacity: 0; transform: translateY(28px) scale(0.94); } to { opacity: 1; transform: none; } }
@keyframes kk-kant { to { background-position: 300% 0; } }
@keyframes kk-roter { to { rotate: 360deg; } }
@keyframes kk-svaev { 0%, 100% { transform: translateY(0) rotate(-1.5deg); } 50% { transform: translateY(-10px) rotate(1.5deg); } }
@keyframes kk-funkl { 0%, 100% { opacity: 0.2; transform: scale(0.6) rotate(0deg); } 50% { opacity: 1; transform: scale(1.15) rotate(45deg); } }
@keyframes kk-puls { 0% { box-shadow: 0 0 0 0 rgba(111, 190, 44, 0.7); } 100% { box-shadow: 0 0 0 10px rgba(111, 190, 44, 0); } }
@keyframes kk-glimt { 0% { translate: -120% 0; } 45%, 100% { translate: 120% 0; } }
@keyframes kk-pop { from { transform: scale(0.3); opacity: 0; } to { transform: none; opacity: 1; } }
@keyframes kk-vrik { 0%, 80%, 100% { rotate: 0deg; } 85% { rotate: -14deg; } 90% { rotate: 12deg; } 95% { rotate: -6deg; } }

@media (prefers-reduced-motion: reduce) {
  .kk *, .kk *::before, .kk *::after, .kk-pille, .kk-pille * {
    animation: none !important;
    transition: none !important;
  }
}

/* Kompakt formular: plads til samtykke og knap på bærbar og mobil.
   Scroll bevares som sikkerhedsnet ved tastatur, zoom og meget lave skærme. */
#kkHoved { max-width: 1040px; }
#kkHoved .kk-indhold { padding: 22px 26px 18px; }
#kkHoved .kk-maerke { max-width: calc(100% - 38px); font-size: 10px; letter-spacing: .035em; margin-bottom: 10px; padding: 5px 8px; }
#kkHoved .kk-maerke-kort { display: none; }
#kkHoved .kk-maerke-prik { flex-shrink: 0; }
#kkHoved .kk-titel { font-size: 30px; margin-bottom: 8px; }
#kkHoved .kk-tekst { font-size: 14px; line-height: 1.4; margin-bottom: 12px; }
#kkHoved .kk-felter { grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 8px 12px; margin-bottom: 10px; }
#kkHoved .kk-felt input { min-width: 0; min-height: 44px; padding: 8px 10px; font-size: 16px; line-height: 1.25; }
#kkHoved .kk-felt label { margin-bottom: 3px; }
#kkHoved .kk-samtykke { padding: 10px; gap: 8px; margin-bottom: 10px; }
#kkHoved .kk-samtykke-tekst { font-size: 13px; line-height: 1.4; }
#kkHoved .kk-samtykke-tekst small { line-height: 1.35; }
#kkHoved .kk-knap { min-height: 44px; padding: 10px 16px; }
#kkHoved .kk-smaat { margin-top: 8px; line-height: 1.35; color: #626b82; }
#kkHoved .kk-li-teaser { display: none; } /* LinkedIn får sin egen dialog efter tilmelding. */
@media (min-width: 820px) {
  #kkHoved { grid-template-columns: .8fr 1.2fr; }
}
@media (max-width: 819px) {
  .kk { padding: 8px; }
  #kkHoved { max-width: 540px; }
  #kkHoved .kk-scene { display: none; }
  #kkHoved .kk-indhold { padding: 16px; }
  #kkHoved .kk-titel { font-size: 27px; }
  #kkHoved .kk-luk { top: 8px; right: 8px; }
}
@media (max-height: 740px) {
  #kkHoved .kk-indhold { padding: 12px 16px; }
  #kkHoved .kk-maerke { margin-bottom: 6px; }
  #kkHoved .kk-tekst { margin-bottom: 8px; }
}

@media (max-width: 360px) {
  #kkHoved .kk-indhold { padding: 8px 10px; }
  #kkHoved .kk-titel { font-size: 23px; margin-bottom: 6px; }
  #kkHoved .kk-tekst { display: none; }
  #kkHoved .kk-felter { gap: 6px 10px; margin-bottom: 8px; }
  #kkHoved .kk-samtykke { display: block; padding: 8px; margin-bottom: 8px; font-size: 13px; line-height: 1.4; }
  #kkHoved .kk-boks { float: left; margin: 0 8px 3px 0; }
  #kkHoved .kk-samtykke-tekst { display: inline; }
  #kkHoved .kk-smaat { margin-top: 6px; }
}

/* Mobil: gavekurven får sin egen kompakte top over formularen. */
.kk-mobil-hero { display: none; }
@media (max-width: 819px) {
  #kkHoved { max-width: 460px; border-radius: 22px; }
  #kkHoved::before { padding: 1px; background: rgba(255,255,255,.25); animation: none; }
  #kkHoved .kk-scene {
    display: flex; min-height: 170px; height: 170px;
    border-radius: 22px 22px 0 0; justify-content: flex-end;
    background: radial-gradient(ellipse at 82% 75%, #304b83, #14234c 55%, #0b1133);
  }
  #kkHoved .kk-mobil-hero {
    display: flex; flex-direction: column; align-items: flex-start; gap: 9px;
    position: absolute; left: 18px; top: 18px; z-index: 2; color: white;
  }
  .kk-mobil-event { color: #ced8ed; font-size: 9px; font-weight: 600; line-height: 1.35; letter-spacing: .09em; text-transform: uppercase; }
  .kk-mobil-hero strong { font-size: 26px; line-height: 1.06; letter-spacing: -.035em; }
  .kk-mobil-dato { color: #e5c786; font-size: 10px; font-weight: 500; }
  #kkHoved .kk-kurv { width: 166px; margin: 15px -2px 0 0; animation: none; }
  #kkHoved .kk-straaler { width: 100%; left: 80%; opacity: .45; animation: none; }
  #kkHoved .kk-gloed { left: 80%; width: 50%; opacity: .45; }
  #kkHoved .kk-gnist { display: none; }
  #kkHoved .kk-skilt { display: none; }
  #kkHoved .kk-luk { width: 32px; height: 32px; background: rgba(255,255,255,.12); color: white; box-shadow: none; top: 7px; right: 7px; }
  #kkHoved .kk-indhold { padding: 14px 16px 16px; }
  #kkHoved .kk-maerke { display: none; }
  /* Bevar dialogens navn og beskrivelse for skærmlæsere. */
  #kkHoved .kk-titel, #kkHoved .kk-tekst { display: block; position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
  #kkHoved .kk-felt input { background: #f7f8fb; border-radius: 10px; }
  #kkHoved .kk-samtykke { border-radius: 12px; background: #f3f5f9; }
  #kkHoved .kk-knap { border-radius: 12px; background: #17264e; box-shadow: 0 4px 12px rgba(23,38,78,.12); }
}
@media (max-width: 360px) {
  #kkHoved .kk-scene { height: 148px; min-height: 148px; }
  #kkHoved .kk-mobil-hero { left: 12px; top: 14px; gap: 8px; }
  .kk-mobil-hero strong { font-size: 23px; }
  .kk-mobil-dato { font-size: 9px; }
  #kkHoved .kk-kurv { width: 139px; margin-right: -4px; }
  #kkHoved .kk-indhold { padding: 10px; }
}