/* A new composed section, ready for copy and app imagery. */
.uk-explore {
  position: relative;
  z-index: 6;
  margin-top: -48px;
  padding: 112px 48px 144px;
  border-radius: 48px 48px 0 0;
  background: #f7f5fb;
  color: var(--ink);
}
.uk-explore-inner { max-width: 1184px; margin: auto; }
.uk-explore-heading {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 48px;
  align-items: start;
  max-width: 800px;
  margin: 0 auto 64px;
}
.uk-explore-tag { padding: 8px 16px; border-radius: 12px; background: #ece5fa; font-size: 14px; white-space: nowrap; }
.uk-explore-heading h2 { margin: 0; font-size: clamp(28px, 3vw, 44px); line-height: 1.2; letter-spacing: -.035em; font-weight: 500; color: #6e6381; }
.uk-explore-stage {
  display: grid;
  grid-template-columns: .8fr 1.2fr;
  gap: 48px;
  align-items: center;
  min-height: 600px;
  padding: 48px;
  border: 1px solid #ffffffb3;
  border-radius: 32px;
  background: #ece8f1;
  overflow: hidden;
}
.uk-explore-accordions { display: grid; gap: 12px; }
.uk-explore-accordions details { padding: 24px; border-radius: 16px; background: #ffffff80; }
.uk-explore-accordions summary { display: flex; justify-content: space-between; align-items: center; gap: 16px; font-size: 18px; cursor: pointer; list-style: none; }
.uk-explore-accordions summary::-webkit-details-marker { display: none; }
.uk-explore-accordions summary::after { content: '+'; font-size: 24px; font-weight: 400; }
.uk-explore-accordions details[open] summary::after { content: '−'; }
.uk-explore-accordions p { margin: 16px 0 0; font-size: 16px; line-height: 1.5; color: #6e6381; }
.uk-explore-accordions summary:focus-visible { outline: 3px solid var(--purple); outline-offset: 4px; }
.uk-explore-media { display: flex; align-items: center; justify-content: center; gap: 24px; min-height: 400px; }
.uk-explore-phone { width: 42%; max-width: 216px; aspect-ratio: 1 / 2; border: 1px dashed #6e638155; border-radius: 32px; background: #ffffff40; }
.uk-explore-phone + .uk-explore-phone { transform: translateY(32px); }
.uk-original-content { z-index: 7; }
[data-theme="dark"] .uk-explore { background: #19191f; }
[data-theme="dark"] .uk-explore-tag { background: #ffffff0d; }
[data-theme="dark"] .uk-explore-heading h2 { color: #bbb1c8; }
[data-theme="dark"] .uk-explore-stage { background: #222127; border-color: #ffffff12; }
[data-theme="dark"] .uk-explore-accordions details { background: #ffffff08; }
[data-theme="dark"] .uk-explore-accordions p { color: #bbb1c8; }
[data-theme="dark"] .uk-explore-phone { border-color: #ffffff30; background: #ffffff04; }
@media(max-width:800px) {
  .uk-explore { margin-top: -32px; border-radius: 32px 32px 0 0; padding: 80px 24px 96px; }
  .uk-explore-heading { gap: 24px; margin-bottom: 40px; }
  .uk-explore-stage { grid-template-columns: 1fr; gap: 32px; padding: 24px; min-height: 0; }
  .uk-explore-media { min-height: 320px; }
}

/* Five phone placeholders span the panel after removing the accordion. */
.uk-explore-stage { grid-template-columns: 1fr; }
.uk-explore-media { gap: 24px; }
.uk-explore-phone { width: calc((100% - 96px) / 5); flex-shrink: 0; }
.uk-explore-phone:nth-child(odd) { transform: none; }
.uk-explore-phone:nth-child(even) { transform: translateY(32px); }
@media(max-width:800px) {
  .uk-explore-media { flex-wrap: wrap; gap: 16px; }
  .uk-explore-phone { width: calc((100% - 32px) / 3); border-radius: 24px; }
  .uk-explore-phone:nth-child(even) { transform: none; }
}

/* Match the preceding section heading's typography. */
.uk-explore-heading h2,
[data-theme="dark"] .uk-explore-heading h2 {
  font-size: clamp(28px, 3vw, 44px);
  line-height: 1.15;
  letter-spacing: -.04em;
  font-weight: 700;
  color: var(--ink);
}
@media(max-width:800px) {
  .uk-explore-heading h2 { font-size: 24px; }
}

/* Each phone and its caption remain one aligned unit. */
.uk-explore-item {
  width: calc((100% - 96px) / 5);
  flex-shrink: 0;
  min-width: 0;
  margin: 0;
  text-align: center;
}
.uk-explore-item > .uk-explore-phone { width: 100%; max-width: none; transform: none; }
.uk-explore-item:nth-child(even) { transform: translateY(32px); }
.uk-explore-item figcaption { margin-top: 24px; }
.uk-explore-item h3 { margin: 0 0 8px; font-size: 16px; line-height: 1.3; letter-spacing: normal; font-weight: 600; }
.uk-explore-item p { margin: 0; font-size: 14px; line-height: 1.5; opacity: .7; }
@media(max-width:800px) {
  .uk-explore-item { width: calc((100% - 32px) / 3); }
  .uk-explore-item:nth-child(even) { transform: none; }
}
@media(max-width:480px) {
  .uk-explore-item { width: calc((100% - 16px) / 2); }
}

.uk-explore-item figcaption { margin-top: 12px; }
.uk-explore-item h3 { margin-bottom: 4px; }

.uk-explore-heading { grid-template-columns: 1fr; }

.uk-explore-item h3 { margin-bottom: 0; }

.uk-explore-heading h2 { text-align: center; }

.uk-feature-section {
  position: relative;
  z-index: 7;
  margin-top: -48px;
  padding: 96px 48px 144px;
  border-radius: 48px 48px 0 0;
  background: var(--paper);
}
.case-page .uk-feature-section > .uk-feature-copy {
  width: 100%;
  max-width: 1320px;
  margin: 0 auto;
}
.uk-original-content { z-index: 8; }
@media(max-width:800px) {
  .uk-feature-section { margin-top: -32px; padding: 64px 24px 96px; border-radius: 32px 32px 0 0; }
}

/* The duplicated carousel needs the same full-width root layout as the original. */
.case-page .uk-feature-section > .uk-feature-copy {
  display: block;
  padding: 0;
  overflow: hidden;
}
.uk-feature-copy > .feature-carousel-track {
  width: 100%;
  min-width: 0;
}
.uk-feature-copy > .feature-carousel-nav {
  width: 100%;
}

/* Prevent the generic last-card lavender fill from recoloring the duplicate. */
.case-page .uk-feature-section > .uk-feature-copy {
  background: var(--case-surface);
  color: var(--ink);
  border-color: var(--case-border);
}

/* Dark two-surface palette for Flere veje ind i fællesskabet. */
.uk-explore,
[data-theme="dark"] .uk-explore {
  background: var(--design-bg);
  color: var(--design-text-light);
}
.uk-explore-heading h2,
[data-theme="dark"] .uk-explore-heading h2 {
  color: var(--design-text-light);
}
.uk-explore-stage,
[data-theme="dark"] .uk-explore-stage {
  background: var(--design-surface);
  border-color: #ffffff0d;
}
.uk-explore-phone,
[data-theme="dark"] .uk-explore-phone {
  background: #ffffff04;
  border-color: #ffffff30;
}

/* Lavender grid behind the carousel below Flere veje ind. */
.uk-feature-section {
  background-color: #f4f0f8;
  background-image:
    linear-gradient(rgba(189, 181, 205, .14) 1px, transparent 1px),
    linear-gradient(90deg, rgba(189, 181, 205, .14) 1px, transparent 1px),
    radial-gradient(ellipse at 50% 0%, rgba(230, 222, 240, .6), transparent 80%),
    linear-gradient(180deg, #f0eaf6, #f5f2f8);
  background-size: 80px 80px, 80px 80px, 100% 100%, 100% 100%;
}
[data-theme="dark"] .uk-feature-section {
  background-color: var(--design-bg);
  background-image:
    linear-gradient(#b2a6cb12 1px, transparent 1px),
    linear-gradient(90deg, #b2a6cb12 1px, transparent 1px),
    radial-gradient(ellipse at 50% 0%, #37304466, transparent 80%);
  background-size: 80px 80px, 80px 80px, 100% 100%;
}

/* Feature pills borrow the soft insight-box palette. */
:root:not([data-theme="dark"]) .uk-feature-copy .prototype-feature .care-letter-tags li {
  background: linear-gradient(135deg, #ece5fa55, #ebf2d566);
  border-color: #ffffffb3;
}

/* Round the lower section corners as well, above the following surface. */
.uk-explore {
  border-radius: 48px;
  z-index: 8;
}
@media(max-width:800px) {
  .uk-explore { border-radius: 32px; }
}

/* Reveal each mockup's description and actions on hover or keyboard focus. */
.uk-explore-item > .uk-explore-phone { position:relative; overflow:hidden; }
.uk-mockup-hover {
  position:absolute; inset:0; padding:20px; box-sizing:border-box;
  display:flex; flex-direction:column; justify-content:center; gap:20px;
  background:rgba(15,15,20,.9); color:#f0edf5;
  opacity:0; transition:opacity .25s ease; overflow-y:auto;
}
.uk-explore-item:hover .uk-mockup-hover,
.uk-explore-phone:focus .uk-mockup-hover { opacity:1; }
.uk-explore-item .uk-mockup-hover p { font-size:14px; line-height:1.5; opacity:1; }
.uk-mockup-hover ul { list-style:none; padding:0; margin:0; display:flex; flex-wrap:wrap; gap:8px; }
.uk-mockup-hover li { font-size:12px; line-height:1.4; padding:6px 10px; border:1px solid #ffffff26; border-radius:999px; background:#ffffff12; }
.uk-explore-phone:focus-visible { outline:2px solid #f0edf5; outline-offset:4px; }
@media(prefers-reduced-motion:reduce) { .uk-mockup-hover { transition:none; } }

.uk-explore-item .uk-mockup-hover { text-align:left; align-items:flex-start; }
.uk-explore-item .uk-mockup-hover p,
.uk-explore-item .uk-mockup-hover li { text-align:left; }
.uk-mockup-hover ul { justify-content:flex-start; }

/* Frosted glass overlay over the mockup. */
.uk-mockup-hover {
  background:rgba(20,20,26,.48);
  backdrop-filter:blur(20px) saturate(115%);
  -webkit-backdrop-filter:blur(20px) saturate(115%);
  box-shadow:inset 0 0 0 1px #ffffff0d;
}

/* Light duplicate uses the same lavender/green surfaces as Before and After. */
.uk-explore.uk-explore-light {
  background:#e9e4f0;
  color:var(--ink);
}
.uk-explore-light .uk-explore-heading h2 { color:var(--ink); }
.uk-explore-light .uk-explore-stage { background:#ffffff59; border-color:#ffffffa6; }
.uk-explore-light .uk-explore-phone { background:linear-gradient(135deg,#ece5fa55,#ebf2d566); border-color:#6e63812e; }
[data-theme="dark"] .uk-explore.uk-explore-light { background:radial-gradient(ellipse at 12% 35%,#49364f70,transparent 65%),#202321; color:var(--ink); }
[data-theme="dark"] .uk-explore-light .uk-explore-heading h2 { color:var(--ink); }
[data-theme="dark"] .uk-explore-light .uk-explore-stage { background:#19191f55; border-color:#ffffff20; }
[data-theme="dark"] .uk-explore-light .uk-explore-phone { background:linear-gradient(135deg,#ece5fa0d,#ebf2d50d); border-color:#ffffff20; }

/* Existing app screenshots in the light Before section. */
.uk-explore-light .uk-before-phone.showcase-device {
  --device-angle:0deg; width:100%; max-width:none; flex:none;
  box-sizing:border-box; aspect-ratio:1179 / 2556;
  padding:4px; border-radius:28px; transform:none; animation:none;
}
.uk-before-phone .showcase-device-screen { height:100%; width:100%; border-radius:22px; }
.uk-before-screen { height:100%; width:100%; overflow-y:auto; overflow-x:hidden; scrollbar-width:none; overscroll-behavior-y:contain; }
.uk-before-screen::-webkit-scrollbar { display:none; }
.uk-before-screen img { display:block; width:100%; max-width:none; height:auto; border-radius:0; margin:0; }
.uk-before-phone .showcase-island { pointer-events:none; }

.uk-explore .uk-after-phone.showcase-device {
  --device-angle:0deg; width:100%; max-width:none; flex:none;
  box-sizing:border-box; aspect-ratio:1179 / 2556;
  padding:4px; border-radius:28px; transform:none; animation:none;
}
.uk-after-phone .showcase-device-screen { height:100%; width:100%; border-radius:22px; }
.uk-after-screen { height:100%; width:100%; overflow-y:auto; overflow-x:hidden; scrollbar-width:none; overscroll-behavior-y:contain; }
.uk-after-screen::-webkit-scrollbar { display:none; }
.uk-after-screen img { display:block; width:100%; max-width:none; height:auto; border-radius:0; margin:0; }
.uk-after-phone .showcase-island { pointer-events:none; z-index:2; }
.uk-after-phone .uk-after-hover-target { position:absolute; inset:0; width:100%; max-width:none; height:100%; border:0; border-radius:0; background:transparent; aspect-ratio:auto; pointer-events:none; z-index:3; }
.uk-after-hover-target:focus { pointer-events:auto; }

/* Let each prototype's natural proportions determine its phone height. */
.uk-explore .uk-after-phone.showcase-device { aspect-ratio:auto; height:auto; }
.uk-after-phone > .showcase-device-screen { height:auto; }
.uk-after-phone .uk-after-screen { height:auto; overflow:visible; }
.uk-after-phone .uk-after-screen img { height:auto; width:100%; object-fit:contain; }

/* Gentle, staggered floating motion for the prototype phones. */
.uk-explore .uk-after-phone.showcase-device {
  animation:uk-prototype-float 8s ease-in-out infinite;
}
.uk-explore-item:nth-child(2) .uk-after-phone { animation-delay:-1.6s; }
.uk-explore-item:nth-child(3) .uk-after-phone { animation-delay:-3.2s; }
.uk-explore-item:nth-child(4) .uk-after-phone { animation-delay:-4.8s; }
.uk-explore-item:nth-child(5) .uk-after-phone { animation-delay:-6.4s; }
@keyframes uk-prototype-float {
  0%,100% { transform:translateY(0); }
  50% { transform:translateY(-8px); }
}
@media(prefers-reduced-motion:reduce) {
  .uk-explore .uk-after-phone.showcase-device { animation:none; }
}

/* Shared screen ratio based on the shortest prototype (Til alle). */
.uk-explore .uk-after-phone.showcase-device { aspect-ratio:auto; height:auto; }
.uk-after-phone > .showcase-device-screen {
  aspect-ratio:1450 / 3142;
  height:auto;
  overflow:hidden;
}
.uk-after-phone .uk-after-screen { height:100%; overflow:hidden; }
.uk-after-phone .uk-after-screen img {
  width:100%; height:auto; max-height:none;
  object-position:top center; display:block;
}

/* Clip the image and glass overlay to the phone's inner screen. */
.uk-explore .uk-after-phone > .showcase-device-screen {
  position:relative;
  border-radius:22px;
  overflow:hidden;
  clip-path:inset(0 round 22px);
  isolation:isolate;
}
.uk-after-phone .uk-after-screen,
.uk-after-phone .uk-after-hover-target,
.uk-after-phone .uk-mockup-hover {
  border-radius:inherit;
  overflow:hidden;
}
.uk-after-phone .uk-after-hover-target { clip-path:inset(0 round 22px); }

/* Preserve the original dark glass color inside the fitted screen. */
.uk-explore .uk-after-phone .uk-after-hover-target { background:transparent; }
.uk-explore .uk-after-phone .uk-mockup-hover {
  background:rgba(20,20,26,.48);
  backdrop-filter:blur(20px) saturate(115%);
  -webkit-backdrop-filter:blur(20px) saturate(115%);
}

/* Blur the screenshot at the glass layer itself, before its text is drawn. */
.uk-explore .uk-after-phone .uk-after-hover-target {
  clip-path:none;
  transition:backdrop-filter .25s ease;
}
.uk-explore-item:hover .uk-after-hover-target,
.uk-after-phone:focus-within .uk-after-hover-target {
  backdrop-filter:blur(28px) saturate(90%);
  -webkit-backdrop-filter:blur(28px) saturate(90%);
}
.uk-explore .uk-after-phone .uk-mockup-hover {
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
}
.uk-after-phone:focus-within .uk-mockup-hover { opacity:1; }

/* Wheel and touch scrolling continue on the page over every mockup. */
.uk-before-screen,
.uk-after-screen,
.uk-explore .uk-mockup-hover {
  overflow:hidden;
  overscroll-behavior:auto;
  touch-action:pan-y;
}

/* Design detail scaffold: a floating glass panel with four visual slots. */
.uk-design-details { position:relative; padding:96px 48px; background:#eceaf0; color:var(--ink); border-radius:48px; }
.uk-design-details-inner { max-width:1184px; margin:auto; }
.uk-design-details h2 { margin:0 0 48px; font-size:clamp(28px,3vw,44px); line-height:1.15; letter-spacing:-.04em; text-align:center; }
.uk-details-stage { position:relative; min-height:560px; display:grid; place-items:center; overflow:hidden; border-radius:32px; background:#d8d5df; padding:48px 24px; isolation:isolate; }
.uk-details-shape { position:absolute; z-index:-1; width:400px; height:280px; border-radius:48% 52% 60% 40%; background:repeating-linear-gradient(35deg,#d5debb 0 2px,#e4eacb 2px 5px); transform:rotate(-28deg); }
.uk-details-shape-one { left:calc(50% - 350px); bottom:-64px; }
.uk-details-shape-two { right:calc(50% - 350px); top:112px; transform:rotate(48deg); background:repeating-linear-gradient(35deg,#cbc1e4 0 2px,#e3dcf1 2px 5px); }
.uk-details-panel { width:min(360px,100%); box-sizing:border-box; padding:20px; border-radius:28px; border:1px solid #ffffff55; background:#f4f3ee9e; backdrop-filter:blur(24px); -webkit-backdrop-filter:blur(24px); box-shadow:0 16px 48px #30243e14; }
.uk-details-panel-heading,.uk-details-panel-label { display:flex; align-items:center; justify-content:space-between; gap:16px; font:14px/1.4 Arial,sans-serif; }
.uk-details-panel-heading { margin-bottom:24px; }
.uk-details-mark { display:grid; place-items:center; width:32px; height:32px; border-radius:12px; background:#ffffff40; font-size:20px; }
.uk-details-panel-label { font-size:12px; margin-bottom:12px; opacity:.65; }
.uk-details-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
.uk-details-tile { position:relative; aspect-ratio:1; border-radius:16px; background:#ffffff80; padding:12px; box-sizing:border-box; }
.uk-details-tile-accent { background:#d6dfb6; }
.uk-details-number { font:11px/1.4 Arial,sans-serif; opacity:.5; }
.uk-details-placeholder { position:absolute; inset:36px 24px 24px; display:flex; flex-wrap:wrap; align-content:center; justify-content:center; gap:14px; }
.uk-details-placeholder span { width:4px; height:4px; border-radius:50%; background:#38433e; }
[data-theme="dark"] .uk-design-details { background:var(--design-bg); }
[data-theme="dark"] .uk-details-stage { background:var(--design-surface); }
[data-theme="dark"] .uk-details-panel { background:#28262dbf; border-color:#ffffff20; }
[data-theme="dark"] .uk-details-tile { background:#ffffff14; }
[data-theme="dark"] .uk-details-tile-accent { background:#68755a; }
[data-theme="dark"] .uk-details-placeholder span { background:#f0edf5; }
@media(max-width:600px) { .uk-design-details { padding:64px 24px; border-radius:32px; } .uk-design-details h2 { margin-bottom:32px; } .uk-details-stage { padding:32px 16px; min-height:440px; } }

.uk-details-panels { display:grid; grid-template-columns:repeat(2,minmax(0,360px)); justify-content:center; align-items:center; gap:32px; width:100%; }
.uk-details-panels .uk-details-panel { width:100%; }
@media(max-width:700px) { .uk-details-panels { grid-template-columns:minmax(0,360px); gap:24px; } }

.uk-detail-button-example { position:absolute; inset:32px 8px 8px; display:grid; place-items:center; }
.uk-save-draft-example { padding:10px 16px; border:0; border-radius:16px; background:#dce3ce; color:#454b40; font:16px/1.3 Arial,sans-serif; white-space:nowrap; cursor:pointer; }
.uk-save-draft-example:focus-visible { outline:2px solid var(--purple); outline-offset:4px; }

.uk-detail-image-example { position:absolute; inset:32px 8px 8px; display:grid; place-items:center; }
.uk-detail-image-example img { display:block; max-width:100%; max-height:100%; width:auto; height:auto; object-fit:contain; border-radius:8px; }

.uk-detail-image-example img[src$="afstemning.png"] { max-width:80%; max-height:80%; }

.uk-details-panels { grid-template-columns:minmax(0,520px) minmax(0,360px); }
.uk-details-panels > .uk-details-panel:first-child .uk-details-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
@media(max-width:900px) { .uk-details-panels { grid-template-columns:minmax(0,520px); } }
@media(max-width:480px) { .uk-details-panels > .uk-details-panel:first-child .uk-details-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }

.uk-details-panels { grid-template-columns:minmax(0,680px) minmax(0,360px); gap:24px; }
.uk-details-panels > .uk-details-panel:first-child .uk-details-grid { grid-template-columns:repeat(4,minmax(0,1fr)); }
@media(max-width:1100px) { .uk-details-panels { grid-template-columns:minmax(0,680px); } }
@media(max-width:600px) { .uk-details-panels > .uk-details-panel:first-child .uk-details-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }

/* Fit every detail image inside its available frame without cropping. */
.uk-details-tile .uk-detail-image-example {
  position:absolute;
  inset:32px 12px 12px;
  display:flex;
  align-items:center;
  justify-content:center;
  min-width:0;
  min-height:0;
  overflow:hidden;
}
.uk-details-tile .uk-detail-image-example img,
.uk-details-tile .uk-detail-image-example img[src$="afstemning.png"] {
  display:block;
  width:100%;
  height:100%;
  max-width:100%;
  max-height:100%;
  min-width:0;
  min-height:0;
  object-fit:contain;
  object-position:center;
  border-radius:0;
}

.uk-details-panels { grid-template-columns:minmax(0,520px) minmax(0,360px); }
.uk-details-panels > .uk-details-panel:first-child .uk-details-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
.uk-details-private-panel .uk-details-grid { grid-template-columns:1fr; }
.uk-details-private-panel .uk-details-tile { aspect-ratio:1 / 1.2; }
.uk-details-private-panel .uk-detail-image-example { inset:16px; }
@media(max-width:900px) { .uk-details-panels { grid-template-columns:minmax(0,520px); } }
@media(max-width:480px) { .uk-details-panels > .uk-details-panel:first-child .uk-details-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }

.uk-details-private-panel .uk-details-tile { aspect-ratio:auto; display:flex; justify-content:center; padding:20px; }
.uk-detail-private-mockup.showcase-device {
  --device-angle:0deg; width:min(100%,216px); max-width:216px; flex:none;
  padding:4px; border-radius:28px; box-sizing:border-box;
  transform:none; animation:none;
}
.uk-detail-private-mockup > .showcase-device-screen { border-radius:22px; overflow:hidden; clip-path:inset(0 round 22px); }
.uk-detail-private-mockup .showcase-device-screen > img { display:block; width:100%; max-width:none; height:auto; border:0; border-radius:0; margin:0; }

/* The image itself sets the screen height, with no reserved space below. */
.uk-details-private-panel .uk-details-tile { align-items:center; }
.uk-details-private-panel .uk-detail-private-mockup.showcase-device {
  display:block; height:auto; min-height:0; max-height:none;
  aspect-ratio:auto; align-self:center;
}
.uk-detail-private-mockup > .showcase-device-screen {
  display:block; width:100%; height:auto; min-height:0; max-height:none;
  aspect-ratio:auto; padding:0; margin:0; line-height:0;
}
.uk-detail-private-mockup .showcase-device-screen > img {
  display:block; position:static; width:100%; height:auto;
  min-height:0; max-height:none; aspect-ratio:auto;
  margin:0; padding:0; object-fit:initial;
}

/* The source PNG contains an 88px black strip: crop only that strip. */
.uk-detail-private-mockup > .showcase-device-screen {
  aspect-ratio:1576 / 3652;
  position:relative;
  overflow:hidden;
}
.uk-detail-private-mockup .showcase-device-screen > img {
  position:absolute;
  top:0;
  left:0;
  width:100%;
  height:auto;
}

.uk-details-number { display:block; font:12px/1.35 Arial,sans-serif; opacity:.7; }
.uk-details-tile .uk-detail-image-example { top:48px; }
.uk-details-tile .uk-detail-button-example { top:48px; }

.uk-details-number { text-transform:uppercase; }

.uk-details-panel-heading h3 { margin:0; font:700 24px/1.2 Arial,sans-serif; letter-spacing:-.03em; color:var(--ink); }

.uk-explore:not(.uk-explore-light) .uk-explore-item { width:calc((100% - 120px) / 6); }
.uk-explore-item:nth-child(6) .uk-after-phone { animation-delay:-3.8s; }
/* Crop the black source strip while retaining the shared phone height. */
.uk-after-private-phone .uk-after-screen img { width:100%; height:auto; }
@media(max-width:800px) { .uk-explore:not(.uk-explore-light) .uk-explore-item { width:calc((100% - 32px) / 3); } }
@media(max-width:480px) { .uk-explore:not(.uk-explore-light) .uk-explore-item { width:calc((100% - 16px) / 2); } }

/* The replacement image sets its own phone height without the old crop. */
.uk-detail-private-mockup > .showcase-device-screen { aspect-ratio:auto; }
.uk-detail-private-mockup .showcase-device-screen > img { position:static; height:auto; }

.uk-explore-version-tabs { margin:0 auto 40px; }
.uk-explore-version-panel[hidden] { display:none; }
.uk-explore-switch .uk-before-phone.showcase-device {
  --device-angle:0deg; width:100%; max-width:none; flex:none;
  box-sizing:border-box; aspect-ratio:1179 / 2556; padding:4px;
  border-radius:28px; transform:none; animation:uk-prototype-float 8s ease-in-out infinite;
}
.uk-explore-switch #uk-explore-panel-0 .uk-explore-item { width:calc((100% - 96px) / 5); }
.uk-explore-switch .uk-before-screen { overflow:hidden; }
@media(max-width:800px) { .uk-explore-switch #uk-explore-panel-0 .uk-explore-item { width:calc((100% - 32px) / 3); } }
@media(max-width:480px) { .uk-explore-switch #uk-explore-panel-0 .uk-explore-item { width:calc((100% - 16px) / 2); } }
@media(prefers-reduced-motion:reduce) { .uk-explore-switch .uk-before-phone.showcase-device { animation:none; } }

/* Undertekst følger valget mellem før og efter. */
.uk-explore-heading .uk-explore-subtitle {
  margin: 16px auto 0;
  max-width: 720px;
  font-size: 18px;
  line-height: 1.5;
  font-weight: 400;
  text-align: center;
  color: #f0edf5b3;
}

.uk-explore-switch .uk-explore-heading {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
}
.uk-explore-switch .uk-explore-heading .uk-explore-subtitle {
  margin: 0 auto;
}