/* Edge-to-edge discovery pages and the results layout. */
html { scrollbar-gutter: stable; }
body.dk-flow-page {
    padding: 0;
    background: #fffaf5;
}
.dk-flow-page .df-shell {
    max-width: none;
    margin: 0;
    border: 0;
    border-radius: 0;
    box-shadow: none;
    min-height: 100vh;
}
.dk-flow-page .df-header {
    height: 76px;
    padding: 0 4%;
    background: linear-gradient(115deg, #fffdfb, #faf5ff);
}
.dk-category-page .df-shell,
.dk-area-page .df-shell { position: relative; }
.dk-category-page .df-shell::before,
.dk-area-page .df-shell::before {
    content: '';
    position: fixed;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    background:
        linear-gradient(100deg, #17103842 0%, #2411421c 48%, #10091b33 100%),
        url('../images/front-flow/landing-hero.jpg') center 52% / cover no-repeat;
}
.dk-category-page .df-header,
.dk-area-page .df-header {
    position: absolute;
    z-index: 80;
    top: 16px;
    left: 4%;
    right: 4%;
    width: auto;
    height: 68px;
    padding: 0 24px;
    border: 1px solid #ffffff9e;
    border-radius: 18px;
    background: #ffffff42;
    box-shadow: 0 12px 38px #15123c24, inset 0 1px 0 #ffffffbf;
    -webkit-backdrop-filter: blur(20px) saturate(160%);
    backdrop-filter: blur(20px) saturate(160%);
}
.dk-category-page .df-main--category,
.dk-area-page .df-main--area {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center;
    min-height: calc(100vh - 47px);
    padding: 118px 6% 46px;
    background: transparent;
}
.dk-category-page .df-footer,
.dk-area-page .df-footer { position: relative; z-index: 1; }
.dk-category-page .df-intro {
    width: min(940px, 76vw);
    max-width: none;
    margin: 0 auto;
    padding: clamp(28px, 3.2vw, 46px);
    border: 1px solid #ffffffa8;
    border-radius: 30px;
    background: #fffaf094;
    box-shadow: 0 24px 70px #17102f42, inset 0 1px 0 #ffffffd9;
    -webkit-backdrop-filter: blur(25px) saturate(150%);
    backdrop-filter: blur(25px) saturate(150%);
    backface-visibility: hidden;
    transform: translateZ(0);
}
.dk-area-page .df-main--area { align-items: flex-start; }
.dk-area-page .df-area {
    width: min(700px, 76vw);
    max-width: none;
    margin: 0 auto;
    padding: clamp(28px, 3.2vw, 46px);
    border: 1px solid #ffffffa8;
    border-radius: 30px;
    background: #fffaf09e;
    box-shadow: 0 24px 70px #17102f42, inset 0 1px 0 #ffffffd9;
    -webkit-backdrop-filter: blur(25px) saturate(150%);
    backdrop-filter: blur(25px) saturate(150%);
    backface-visibility: hidden;
    transform: translateZ(0);
    animation: df-flow-card-enter .58s cubic-bezier(.2,.8,.2,1) both;
}
.dk-area-page .df-area-form { margin-top: 24px; }
.dk-area-page .df-location { margin: 0 0 18px; }
.dk-area-page .df-area-form.is-confirming { pointer-events: none; }
.dk-area-page .df-location,
.dk-area-page .df-city,
.dk-area-page .df-address-wrap,
.dk-area-page .df-region summary {
    transition: transform .22s ease, color .22s ease, background .22s ease, border-color .22s ease, box-shadow .22s ease;
}
.dk-area-page .df-location.is-confirmed,
.dk-area-page .df-city.is-confirmed,
.dk-area-page .df-address-wrap.is-confirmed {
    color: #fff;
    border-color: #ffffffc7;
    background: linear-gradient(115deg, #2937ff, #771df2 68%, #c315e8);
    box-shadow: 0 12px 30px #5415fb50, 0 0 0 4px #ffffff4d;
    transform: translateY(-2px) scale(1.012);
}
.dk-area-page .df-location.is-confirmed small,
.dk-area-page .df-address-wrap.is-confirmed input { color: #fff; }
.dk-area-page .is-confirmed > .mdi,
.dk-area-page .df-city.is-confirmed > .mdi {
    color: #fff;
    background: transparent;
    animation: df-location-check .42s cubic-bezier(.2,.9,.25,1.35) both;
}
.dk-area-page .df-region.is-confirmed summary {
    width: fit-content;
    padding: 8px 13px;
    border-radius: 20px;
    color: #fff;
    background: linear-gradient(115deg, #2937ff, #771df2 68%, #c315e8);
    box-shadow: 0 9px 24px #5415fb45;
    transform: translateY(-2px);
}
@keyframes df-location-check {
    0% { opacity: 0; transform: scale(.35) rotate(-18deg); }
    70% { opacity: 1; transform: scale(1.18) rotate(3deg); }
    100% { opacity: 1; transform: scale(1) rotate(0); }
}
.df-enhanced.dk-area-page .df-no-script-submit { display: none; }
.df-enhanced.dk-category-page .df-intro.is-leaving {
    pointer-events: none;
    animation: df-flow-card-exit-left .52s cubic-bezier(.55,.02,.85,.35) both;
}
.df-enhanced.dk-area-page .df-area.is-leaving-back {
    pointer-events: none;
    animation: df-flow-card-exit-right .52s cubic-bezier(.55,.02,.85,.35) both;
}
.df-enhanced.dk-category-page .df-intro.is-entering-back {
    animation: df-flow-card-enter-left .58s cubic-bezier(.2,.8,.2,1) both;
}
@keyframes df-flow-card-exit-left {
    0% { opacity: 1; transform: translate3d(0,0,0) rotate(0); }
    22% { opacity: 1; transform: translate3d(18px,-4px,0) rotate(1deg); }
    100% { opacity: 0; transform: translate3d(-115vw,-24px,0) rotate(-7deg); }
}
@keyframes df-flow-card-enter {
    0% { opacity: 0; transform: translate3d(90px,12px,0) rotate(2.5deg) scale(.97); }
    100% { opacity: 1; transform: translate3d(0,0,0) rotate(0) scale(1); }
}
@keyframes df-flow-card-exit-right {
    0% { opacity: 1; transform: translate3d(0,0,0) rotate(0); }
    22% { opacity: 1; transform: translate3d(-18px,-4px,0) rotate(-1deg); }
    100% { opacity: 0; transform: translate3d(115vw,-24px,0) rotate(7deg); }
}
@keyframes df-flow-card-enter-left {
    0% { opacity: 0; transform: translate3d(-90px,12px,0) rotate(-2.5deg) scale(.97); }
    100% { opacity: 1; transform: translate3d(0,0,0) rotate(0) scale(1); }
}
.dk-category-page .df-category {
    border: 1px solid #ffffff8c;
    box-shadow: 0 12px 30px #17102f38;
}
.dk-results-page .df-shell { position: relative; }
.dk-results-page .df-header {
    position: absolute;
    z-index: 80;
    top: 16px;
    left: 4%;
    right: 4%;
    width: auto;
    height: 68px;
    padding: 0 24px;
    border: 1px solid #ffffff8f;
    border-radius: 18px;
    background: #ffffff36;
    box-shadow: 0 12px 38px #15123c1c, inset 0 1px 0 #ffffffa6;
    -webkit-backdrop-filter: blur(18px) saturate(155%);
    backdrop-filter: blur(18px) saturate(155%);
}
.df-navigation { margin-right: auto; margin-left: 42px; }
.df-navigation a[aria-current="page"] { position: relative; font-weight: 750; }
.df-navigation a[aria-current="page"]::after {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    bottom: -13px;
    height: 2px;
    background: #822eff;
}
.df-main--category, .df-main--area { min-height: calc(100vh - 131px); }
.df-intro { margin: 0 auto; }
.df-content-width { width: 92%; max-width: 1600px; margin: 0 auto; }
.dk-flow-page .df-main--results {
    padding: 0;
    background:
        radial-gradient(ellipse at 0 100%, #f5e8ff 0, #f5e8ff 7%, transparent 19%),
        radial-gradient(ellipse at 100% 100%, #fff0df 0, #fff0df 8%, transparent 22%),
        #fffaf5;
}
.df-results { display: block; }
.df-results-hero {
    --df-hero-parallax: 0px;
    position: relative;
    isolation: isolate;
    overflow: hidden;
    display: flex;
    align-items: center;
    min-height: clamp(420px, 32vw, 560px);
    padding: 112px 0 42px;
    background: #d9bb9d;
}
.df-results-hero::before {
    content: '';
    position: absolute;
    z-index: -2;
    inset: -12% 0;
    background: url('../images/front-flow/results-hero.png') center 52% / cover no-repeat;
    transform: translate3d(0, var(--df-hero-parallax), 0) scale(1.02);
    transform-origin: center;
    will-change: transform;
}
.df-results-hero::after {
    content: '';
    position: absolute;
    z-index: -1;
    inset: 0;
    background:
        linear-gradient(90deg, #fff8f0e8 0%, #fff5e2c9 34%, #fff4df75 56%, #17132924 78%, #0f0c1d4f 100%),
        linear-gradient(0deg, #24152f42 0%, transparent 45%);
    pointer-events: none;
}
.df-results-hero .df-content-width { position: relative; z-index: 1; }
.df-results-hero .df-eyebrow { margin: 0 0 6px !important; font-size: 11px; letter-spacing: .45px; }
.df-results-hero h1 { font-size: clamp(36px, 3.5vw, 52px); letter-spacing: -1.8px; }
.df-results-hero h1 em { color: #7d12ea; }
.df-results-hero .df-lead { font-size: 18px; margin-top: 5px !important; }
.df-search-bar { display: grid; grid-template-columns: 300px minmax(0, 1fr); gap: 12px; max-width: 1220px; margin-top: 20px; }
.df-area-trigger {
    display: flex;
    gap: 12px;
    align-items: center;
    min-width: 0;
    padding: 13px 16px;
    background: #fffffff2;
    border: 1px solid #e8e0ff;
    border-radius: 14px;
    box-shadow: 0 2px 8px #4128780b;
    color: var(--df-ink) !important;
}
.df-area-trigger > .mdi { font-size: 24px; }
.df-area-trigger > .mdi:last-child { margin-left: auto; font-size: 20px; }
.df-area-trigger span { min-width: 0; }
.df-area-trigger strong { display: block; font-size: 14px; line-height: 1.3; overflow-wrap: anywhere; }
.df-area-trigger small { display: block; color: var(--df-muted); font-size: 12px; }
.df-keyword-form { display: flex; gap: 10px; min-width: 0; align-items: stretch; border: 1px solid #f5edff; border-radius: 14px; padding: 7px; background: #ffffffb8; }
.df-keyword-input { display: flex; gap: 12px; flex: 1; align-items: center; min-width: 0; background: #fff; border-radius: 10px; padding: 0 12px; }
.df-keyword-input .mdi { font-size: 24px; color: #363087; }
.df-keyword-input input { min-width: 0; width: 100%; padding: 10px 0; border: 0; background: transparent; outline-offset: 0; color: var(--df-ink); font-size: 14px; }
.df-keyword-input input::placeholder { color: #7c80af; opacity: 1; }
.df-keyword-form .df-primary { min-width: 112px; min-height: 44px; border-radius: 11px; box-shadow: none; padding: 9px 19px; }
.df-category-cue {
    --df-category-cue-parallax: 0px;
    --df-category-cue-offset: 26px;
    width: fit-content;
    margin: 15px 0 -27px 40px;
    color: #101657;
    pointer-events: none;
    transform: translate3d(0, calc(var(--df-category-cue-offset) + var(--df-category-cue-parallax)), 0) rotate(-1deg);
    will-change: transform;
}
.df-category-cue__inner {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    animation: df-category-cue-float 3.6s ease-in-out infinite;
}
.df-category-cue span {
    padding-top: 2px;
    font-family: "Bradley Hand", "Segoe Print", "Comic Sans MS", cursive;
    font-size: clamp(24px, 2.25vw, 36px);
    font-weight: 700;
    line-height: 1;
    letter-spacing: .01em;
    text-shadow: 0 2px 12px #fff9ef8a;
}
.df-category-cue svg {
    width: clamp(76px, 7vw, 112px);
    height: auto;
    margin-top: 4px;
    overflow: visible;
    transform: rotate(4deg);
}
.df-category-cue path {
    fill: none;
    stroke: currentColor;
    stroke-width: 4;
    stroke-linecap: round;
    stroke-linejoin: round;
}
@keyframes df-category-cue-float {
    0%, 100% { transform: translate3d(0, 0, 0) rotate(-.35deg); }
    50% { transform: translate3d(0, -5px, 0) rotate(.45deg); }
}
.df-results-content { padding: 0 0 45px; }
.df-category-tabs { display: flex; gap: 10px; align-items: center; padding: 16px 0; }
.df-category-tab { display: flex; align-items: center; justify-content: center; gap: 10px; white-space: nowrap; padding: 10px 17px; min-height: 49px; border: 1px solid #eadfd8; background: #fffaf5; color: var(--df-ink) !important; border-radius: 16px; font-size: 12px; font-weight: 650; box-shadow: 0 4px 18px #49203c08; }
.df-category-tab > .mdi { font-size: 26px; line-height: 1; color: #37297a; }
.df-category-tab:hover { background: #f2edff; border-color: #ba9cff; }
.df-tab--date > .mdi { color: #f31aaa; }
.df-tab--natur > .mdi { color: #2b8b3b; }
.df-tab--mad > .mdi { color: #f65d18; }
.df-tab--aktivitet > .mdi { color: #3924eb; }
.df-category-tab.is-selected {
    border: 2px solid #2810a6;
    background: #4b22d8;
    color: #fff !important;
    box-shadow: 0 8px 20px #3213a836, 0 2px 6px #24106c35, inset 0 1px 0 #ffffff42;
}
.df-category-tab.is-selected > .mdi { color: #fff; }
.df-tab--date.is-selected { background: #c31582; border-color: #8d0c5e; color: #fff !important; box-shadow: 0 8px 20px #a30d6b38, 0 2px 6px #6f08452e, inset 0 1px 0 #ffffff42; }
.df-tab--boern.is-selected { background: #4b2b98; border-color: #2f176f; }
.df-tab--natur.is-selected { background: #20783a; border-color: #0f5727; color: #fff !important; box-shadow: 0 8px 20px #145a2f38, 0 2px 6px #0d43252e, inset 0 1px 0 #ffffff42; }
.df-tab--mad.is-selected { background: #c94712; border-color: #913008; }
.df-tab--aktivitet.is-selected { background: #3b27c9; border-color: #24129b; }
.df-tab--kultur.is-selected { background: #55278f; border-color: #351365; }
.df-reset { margin-left: auto; flex-shrink: 0; display: flex; gap: 5px; align-items: center; font-size: 12px; font-weight: 650; padding: 10px 0 10px 10px; }
.df-reset .mdi { font-size: 19px; }
@media (min-width: 768px) {
    .dk-results-page .df-shell { overflow: visible; }
    .dk-results-page .df-header {
        position: fixed;
        z-index: 100;
        background: #ffffffb8;
        box-shadow: 0 12px 38px #15123c24, inset 0 1px 0 #ffffffd1;
        -webkit-backdrop-filter: blur(20px) saturate(165%);
        backdrop-filter: blur(20px) saturate(165%);
        transition: top .24s ease, height .24s ease, border-radius .24s ease, background .24s ease, box-shadow .24s ease;
    }
    .dk-results-page .df-category-tabs {
        position: sticky;
        z-index: 70;
        top: 96px;
        margin: 0 -12px 15px;
        padding: 10px 12px;
        border: 1px solid #ffffffc7;
        border-radius: 17px;
        background: #fffaf5e8;
        box-shadow: 0 10px 28px #24143a17, inset 0 1px 0 #fff;
        -webkit-backdrop-filter: blur(18px) saturate(145%);
        backdrop-filter: blur(18px) saturate(145%);
        transition: top .24s ease, padding .24s ease, margin .24s ease, border-radius .24s ease, background .24s ease, box-shadow .24s ease;
    }
    .dk-results-page .df-category-tab,
    .dk-results-page .df-category-tab > .mdi,
    .dk-results-page .df-reset {
        transition: min-height .24s ease, padding .24s ease, font-size .24s ease, gap .24s ease;
    }
    .dk-results-page .df-logo img,
    .dk-results-page .df-navigation a,
    .dk-results-page .df-login,
    .dk-results-page .df-reset .mdi {
        transition: width .24s ease, padding .24s ease, font-size .24s ease;
    }
    .is-compact-results-nav.dk-results-page .df-header {
        top: 0;
        height: 54px;
        border-bottom-color: transparent;
        border-radius: 0;
        background: #fffffff0;
        box-shadow: 0 5px 18px #15123c18, inset 0 1px 0 #fff;
    }
    .is-compact-results-nav.dk-results-page .df-header .df-logo img { width: 130px; }
    .is-compact-results-nav.dk-results-page .df-header .df-navigation a { font-size: 12px; }
    .is-compact-results-nav.dk-results-page .df-header .df-login { padding: 7px 19px; font-size: 11px; }
    .is-compact-results-nav.dk-results-page .df-category-tabs {
        top: 54px;
        margin: 0 0 15px;
        padding: 7px 10px;
        border-top-color: #ede6e0;
        border-radius: 0 0 15px 15px;
        background: #fffaf5f5;
        box-shadow: 0 9px 22px #24143a14, inset 0 1px 0 #fff;
    }
    .is-compact-results-nav.dk-results-page .df-category-tab {
        min-height: 39px;
        padding: 6px 13px;
        gap: 7px;
        border-radius: 13px;
        font-size: 11px;
    }
    .is-compact-results-nav.dk-results-page .df-category-tab > .mdi { font-size: 21px; }
    .is-compact-results-nav.dk-results-page .df-reset { padding-top: 6px; padding-bottom: 6px; font-size: 11px; }
    .is-compact-results-nav.dk-results-page .df-reset .mdi { font-size: 17px; }
    .is-compact-results-nav.dk-results-page .df-navigation a[aria-current="page"]::after { bottom: -9px; }
}
@media (min-width: 783px) {
    .admin-bar.dk-results-page .df-header { top: 48px; }
    .admin-bar.dk-results-page .df-category-tabs { top: 128px; }
    .admin-bar.is-compact-results-nav.dk-results-page .df-header { top: 32px; }
    .admin-bar.is-compact-results-nav.dk-results-page .df-category-tabs { top: 86px; }
}
.df-toolbar { display: flex; gap: 10px; margin: 0 0 15px; align-items: center; flex-wrap: nowrap; }
.df-facets { display: flex; gap: 9px; align-items: center; }
.df-facet { margin: 0; min-width: 0; }
.df-facet select, .df-sort select {
    appearance: auto;
    border: 1px solid #e7ddd8;
    border-radius: 10px;
    background: #fffdf9;
    min-height: 40px;
    padding: 8px 11px;
    color: #30386f;
    font-size: 12px;
    max-width: 170px;
    cursor: pointer;
}
.df-facet select:disabled { opacity: .65; cursor: default; }
.df-facet--radius select { max-width: 178px; }
.df-sort { margin: 0 0 0 auto; }
.df-sort select { max-width: 170px; }
.df-mobile-filters { display: none; }
.df-enhanced .df-apply-facets { display: none; }
.df-view-switch { display: flex; gap: 8px; }
.df-view-switch a { display: flex; align-items: center; justify-content: center; gap: 8px; min-height: 40px; border: 1px solid #e7ddd8; border-radius: 11px; padding: 8px 15px; background: #fffdf9; font-size: 12px; color: #30386f; }
.df-view-switch .mdi { font-size: 20px; line-height: 1; }
.df-view-switch .is-selected { background: linear-gradient(110deg, #3b14ff, #ad14f5); border-color: transparent; color: #fff; box-shadow: 0 3px 8px #791be62b; }
.df-results-summary { display: flex; align-items: center; gap: 18px; margin: 0 0 15px; min-height: 30px; }
.df-result-count { font-size: 12px; flex-shrink: 0; }
.df-result-count strong { font-weight: 750; }
.df-active-filters { display: flex; flex-wrap: wrap; gap: 8px; }
.df-active-filters .df-chip { border: 0; min-height: 29px; font-size: 11px; padding: 4px 12px; font-weight: 550; }
.df-active-filters .df-chip--area { background: #efebff; }
.df-active-filters .df-chip--area .mdi { color: #4630ed; }
.df-active-filters .df-chip .mdi { font-size: 17px; }
.df-results .df-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 18px; }
.df-results .df-card { position: relative; isolation: isolate; border: 1px solid #eee3dc; background: #fffdf9; box-shadow: 0 8px 26px #39211f0b; border-radius: 14px; display: flex; flex-direction: column; overflow: hidden; cursor: pointer; transition: transform .24s ease, border-color .24s ease, box-shadow .24s ease; }
.df-results .df-card.is-sponsored { border-color: #d8c7a3; background: linear-gradient(145deg, #fffdf9 68%, #fff8e8); box-shadow: 0 9px 28px #7c5d1d17, inset 0 0 0 1px #fff8df; }
.df-results .df-card::after { content: ''; position: absolute; z-index: 2; inset: 0; border-radius: inherit; pointer-events: none; opacity: 0; background: linear-gradient(135deg, #183dff20, #8a22ef2b 65%, #e715c52b); transition: opacity .2s ease; }
.df-card-link { position: absolute; z-index: 3; inset: 0; border-radius: inherit; }
.df-card-link:focus-visible { outline: 3px solid #2d20ff; outline-offset: -4px; }
.df-results .df-card.is-opening { border-color: #6d32ed; box-shadow: 0 18px 42px #4f20c74a, 0 0 0 4px #7d35ed24; animation: df-card-open .42s cubic-bezier(.2,.9,.25,1.2) both; }
.df-results .df-card.is-opening::after { opacity: 1; }
.df-results .df-card.is-opening .df-card-image img { transform: scale(1.06); filter: saturate(1.08) brightness(1.03); }
@keyframes df-card-open {
    0% { transform: translateY(0) scale(1); }
    58% { transform: translateY(-5px) scale(1.018); }
    100% { transform: translateY(-2px) scale(1.01); }
}
.df-card-image { position: relative; aspect-ratio: 3 / 1; flex-shrink: 0; overflow: visible; }
.df-card-image > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center; }
.df-favorite { z-index: 5; top: 7px; right: 7px; }
.df-favorite a { min-width: 36px; min-height: 36px; font-size: 25px; }
.df-sponsored-label { position: absolute; z-index: 4; top: 9px; left: 10px; display: inline-flex; align-items: center; gap: 5px; min-height: 25px; padding: 4px 9px; border: 1px solid #ead9ad; border-radius: 999px; background: #fffaf0e8; color: #73591f; box-shadow: 0 4px 12px #3b2a0d21; backdrop-filter: blur(7px); font-size: 10px; line-height: 1; font-weight: 750; letter-spacing: .02em; pointer-events: none; }
.df-sponsored-label .mdi { color: #a87a16; font-size: 14px; }
.df-card-badge { z-index: 4; left: 13px; bottom: -14px; min-height: 29px; padding: 5px 12px; border: 1px solid #fff9; font-size: 11px; letter-spacing: .01em; box-shadow: 0 7px 16px #26195a24, inset 0 1px 0 #fff9; transform: rotate(-1deg); transform-origin: left center; transition: transform .22s ease, box-shadow .22s ease; pointer-events: none; }
.df-card-badge .mdi { font-size: 15px; filter: saturate(1.15); }
.df-results .df-card:hover .df-card-badge,
.df-results .df-card:focus-within .df-card-badge { transform: translateY(-2px) rotate(0); box-shadow: 0 10px 20px #26195a30, inset 0 1px 0 #fff; }
.df-card-badge.df-chip--date { background: linear-gradient(135deg, #fff0f8, #ffd8ed); }
.df-card-badge.df-chip--boern { background: linear-gradient(135deg, #faf0ff, #e8d4ff); }
.df-card-badge.df-chip--natur { background: linear-gradient(135deg, #effff6, #cef3df); }
.df-card-badge.df-chip--mad { background: linear-gradient(135deg, #fff8eb, #ffe4bd); }
.df-card-badge.df-chip--aktivitet { background: linear-gradient(135deg, #f0f5ff, #d6e5ff); }
.df-card-badge.df-chip--kultur { background: linear-gradient(135deg, #f7f1ff, #e5d5ff); }
.df-card--date { --df-card-tint: #fff5fa; --df-card-watermark: #d5167c; }
.df-card--boern { --df-card-tint: #fbf5ff; --df-card-watermark: #7423ca; }
.df-card--natur { --df-card-tint: #f3fcf7; --df-card-watermark: #16804b; }
.df-card--mad { --df-card-tint: #fff9ef; --df-card-watermark: #b26716; }
.df-card--aktivitet { --df-card-tint: #f3f7ff; --df-card-watermark: #215ac2; }
.df-card--kultur { --df-card-tint: #f8f4ff; --df-card-watermark: #6532a8; }
.df-card-body { position: relative; display: flex; flex-direction: column; flex: 1; padding: 25px 16px 17px; overflow: hidden; background: linear-gradient(145deg, #fffdf9 52%, var(--df-card-tint, #fffdf9)); }
.df-card-body > :not(.df-card-watermark) { position: relative; z-index: 1; }
.df-card-watermark { position: absolute; z-index: 0; right: -9px; bottom: -15px; color: var(--df-card-watermark, #6a5a8b); font-size: 76px; line-height: 1; opacity: .065; transform: rotate(-9deg); transition: opacity .22s ease, transform .22s ease; pointer-events: none; }
.df-results .df-card:hover .df-card-watermark,
.df-results .df-card:focus-within .df-card-watermark { opacity: .095; transform: translate(-2px, -2px) rotate(-5deg); }
.df-card h2 { color: var(--df-ink); font-size: 18px; line-height: 1.2; font-weight: 850; margin-bottom: 9px !important; }
.df-card-meta { display: grid; gap: 10px; }
.df-card-city { display: flex; align-items: center; gap: 7px; color: #45517e; font-size: 14px; line-height: 1.3; font-weight: 650; }
.df-card-details { display: flex; align-items: center; flex-wrap: wrap; gap: 7px 10px; color: #20285f; font-size: 12px; line-height: 1.35; }
.df-card-details > span { display: inline-flex; align-items: center; gap: 5px; min-width: 0; font-weight: 650; }
.df-card-details > span + span::before { content: '·'; margin-right: 3px; color: #69729a; font-weight: 800; }
.df-card-meta .mdi { flex-shrink: 0; color: #34488a; font-size: 17px; line-height: 1; }
.df-card-opening.is-open { color: #197b45; }
.df-card-opening.is-closed { color: #8a3f4e; }
.df-status-dot { width: 8px; height: 8px; flex-shrink: 0; border-radius: 50%; background: currentColor; box-shadow: 0 0 0 3px currentColor; opacity: .82; transform: scale(.55); }
.df-card-price { max-width: 100%; }
.df-distance-divider {
    grid-column: 1 / -1;
    display: flex;
    align-items: center;
    gap: 18px;
    margin: 14px 0 2px;
    color: #292259;
    text-align: center;
}
.df-distance-divider::before,
.df-distance-divider::after {
    content: '';
    height: 1px;
    flex: 1;
    background: linear-gradient(90deg, transparent, #b69cec);
}
.df-distance-divider::after { background: linear-gradient(90deg, #b69cec, transparent); }
.df-distance-divider > span {
    display: grid;
    gap: 3px;
    min-width: 290px;
    padding: 10px 20px;
    border: 1px solid #d8c7f7;
    border-radius: 999px;
    background: #f6efff;
    box-shadow: 0 7px 24px #4f26700d;
}
.df-distance-divider strong { font-size: 13px; font-weight: 750; }
.df-distance-divider small { color: #70698a; font-size: 11px; }
.df-rating { font-weight: 700; }
.df-rating small { font-weight: 400; }
.df-results .df-map-panel { display: block; position: relative; height: 62vh; min-height: 430px; border: 1px solid #e7e2f7; border-radius: 15px; overflow: hidden; }
.df-results .df-map-note { max-width: 420px; margin: auto; text-align: center; }
/* The area drawer has its own scroll surface and returns focus to its trigger. */
.df-area-drawer { position: fixed; inset: 0; z-index: 900; display: flex; justify-content: flex-end; }
.df-drawer-backdrop { position: absolute; inset: 0; background: #17143535; backdrop-filter: blur(3px); }
.df-drawer-surface { position: relative; width: 420px; max-width: 100%; height: 100%; overflow-y: auto; overscroll-behavior: contain; padding: 27px; background: #fff; box-shadow: -8px 0 40px #1a174017; }
.df-drawer-heading { display: flex; justify-content: space-between; align-items: center; margin-bottom: 20px; }
.df-drawer-heading h2 { font-size: 18px; font-weight: 750; }
.df-drawer-heading button { display: grid; place-items: center; width: 40px; height: 40px; padding: 0; border: 0; background: transparent; color: #181851; font-size: 25px; }
.df-area-drawer .df-address-wrap { border: 1px solid #dedcf3; border-radius: 12px; min-height: 48px; padding: 0 12px; gap: 9px; }
.df-area-drawer .df-address-wrap input { padding: 12px 0; font-size: 14px; }
.df-area-drawer .df-location { margin-top: 12px; border: 0; border-radius: 11px; min-height: 49px; padding: 10px 14px; background: #f4f2fd; color: var(--df-ink); }
.df-area-drawer .df-location .mdi { font-size: 22px; }
.df-area-drawer .df-location strong { font-size: 13px; }
.df-area-drawer .df-status { min-height: 0; margin: 10px 0 !important; }
.df-area-drawer .df-status:empty { display: none; }
.df-area-drawer .df-small-heading, .df-recents h3 { font-size: 12px; font-weight: 500; color: var(--df-muted); margin: 24px 0 12px !important; }
.df-area-drawer .df-cities { gap: 8px; }
.df-area-drawer .df-city { min-height: 40px; padding: 8px 5px; border: 1px solid transparent; border-radius: 12px; font-size: 12px !important; justify-content: center; background: #f4f2fd; }
.df-area-drawer .df-city[aria-pressed="true"] { border-color: #b36eff; color: #471fd7; background: #f2eaff; box-shadow: none; }
.df-recent-list { display: grid; gap: 4px; }
.df-area-drawer .df-recent-city { width: 100%; display: flex; justify-content: flex-start; text-align: left; gap: 13px; min-height: 62px; padding: 10px 12px; background: transparent; }
.df-recent-city > .mdi { display: block !important; background: none; color: #6425ed; }
.df-recent-city strong, .df-recent-city small { display: block; font-size: 12px; line-height: 1.4; }
.df-recent-city small { color: var(--df-muted); font-weight: 400; }
.df-area-drawer .df-region { border-top: 1px solid #eeeaf7; margin-top: 20px; padding-top: 15px; }
.df-country-choice { display: block; border: 0; background: transparent; color: #5520df; padding: 12px 0; font-size: 12px; }
.df-radius-control { margin-top: 23px; padding-top: 20px; border-top: 1px solid #eeeaf7; }
.df-radius-control label { display: block; font-size: 14px; font-weight: 650; margin-bottom: 15px; }
.df-radius-control output { display: inline; }
.df-radius-control input { width: 100%; accent-color: #9225ff; cursor: pointer; min-height: 26px; }
.df-radius-control > div { display: flex; justify-content: space-between; color: var(--df-muted); font-size: 11px; }
.df-area-drawer .df-show { margin-top: 28px; width: 100%; border-radius: 13px; }
.df-drawer-open { overflow: hidden; }
.pac-container { z-index: 1100 !important; }
@media (max-width: 1200px) {
    .df-category-tabs { gap: 8px; }
    .df-category-tab { padding: 10px 12px; gap: 7px; font-size: 11px; }
    .df-category-tab > .mdi { font-size: 23px; }
    .df-toolbar { flex-wrap: wrap; }
    .df-facets { flex: 1; }
    .df-facet select { max-width: 142px; }
    .df-sort { margin-left: auto; }
    .df-reset { font-size: 11px; }
}
@media (max-width: 1000px) {
    .df-category-tabs { flex-wrap: wrap; }
    .df-results .df-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .df-search-bar { grid-template-columns: 250px minmax(0, 1fr); }
    .df-facets { flex-basis: 100%; }
    .df-facet { flex: 1; }
    .df-facet select { width: 100%; max-width: none; }
}
@media (max-width: 767px) {
    .dk-flow-page .df-header { height: 70px; padding: 0 20px; }
    .dk-category-page .df-header,
    .dk-area-page .df-header {
        top: 10px;
        left: 12px;
        right: 12px;
        height: 62px;
        padding: 0 14px;
        border-radius: 15px;
        background: #ffffff5c;
        -webkit-backdrop-filter: blur(16px) saturate(155%);
        backdrop-filter: blur(16px) saturate(155%);
    }
    .dk-category-page .df-navigation,
    .dk-area-page .df-navigation { top: 68px; border-radius: 14px; background: #fffdf9f5; }
    .dk-category-page .df-main--category,
    .dk-area-page .df-main--area {
        min-height: calc(100vh - 49px);
        padding: 92px 12px 26px;
        background: transparent;
    }
    .dk-category-page .df-shell::before,
    .dk-area-page .df-shell::before {
        background:
            linear-gradient(180deg, #1b103526 0%, #150d2c42 100%),
            url('../images/front-flow/landing-hero.jpg') 48% center / cover no-repeat;
    }
    .dk-category-page .df-intro {
        width: 100%;
        padding: 24px 16px;
        border-radius: 24px;
        background: #fffaf0a6;
        -webkit-backdrop-filter: blur(21px) saturate(145%);
        backdrop-filter: blur(21px) saturate(145%);
    }
    .dk-area-page .df-area {
        width: 100%;
        padding: 24px 16px;
        border-radius: 24px;
        background: #fffaf0ad;
        -webkit-backdrop-filter: blur(21px) saturate(145%);
        backdrop-filter: blur(21px) saturate(145%);
    }
    .dk-category-page .df-categories { margin-top: 21px; }
    .dk-results-page .df-header {
        top: 10px;
        left: 12px;
        right: 12px;
        height: 62px;
        padding: 0 14px;
        border-radius: 15px;
        background: #ffffff4f;
        -webkit-backdrop-filter: blur(15px) saturate(150%);
        backdrop-filter: blur(15px) saturate(150%);
    }
    .df-navigation { top: 70px; margin: 0; }
    .dk-results-page .df-navigation { top: 68px; border-radius: 14px; background: #fffdf9f5; }
    .df-navigation a[aria-current="page"]::after { display: none; }
    .df-content-width { width: calc(100% - 36px); }
    .df-results-hero { align-items: flex-start; min-height: 0; padding: 92px 0 20px; background: #d9bb9d; }
    .df-results-hero::before { inset: -8% 0; background-position: 60% center; transform: translate3d(0, var(--df-hero-parallax), 0) scale(1.04); }
    .df-results-hero::after { background: linear-gradient(180deg, #fff8ef73 0%, #fff7e8d6 46%, #fff9f1f2 100%); }
    .df-results-hero .df-eyebrow { display: none; }
    .df-results-hero h1 { font-size: 31px; letter-spacing: -1.2px; }
    .df-results-hero .df-lead { font-size: 13px; line-height: 1.4; max-width: 360px; margin-top: 6px !important; }
    .df-search-bar { display: grid; grid-template-columns: minmax(0, 1fr); gap: 10px; margin-top: 16px; }
    .df-area-trigger { min-height: 59px; border-radius: 12px; padding: 11px 13px; gap: 10px; }
    .df-area-trigger strong { font-size: 13px; }
    .df-area-trigger small { font-size: 11px; }
    .df-keyword-form { padding: 0; min-height: 47px; border: 1px solid #e3def7; background: white; border-radius: 12px; overflow: hidden; gap: 0; }
    .df-keyword-input { padding: 0 11px; gap: 8px; }
    .df-keyword-input input { font-size: 16px; }
    .df-keyword-input input::placeholder { font-size: 12px; }
    .df-keyword-form .df-primary { min-width: 46px; padding: 8px; border-radius: 0; font-size: 12px; }
    .df-keyword-form .df-primary span { display: none; }
    .df-category-cue { --df-category-cue-offset: 12px; margin: 13px 0 -8px 4px; }
    .df-category-cue__inner { gap: 5px; }
    .df-category-cue span { font-size: 21px; }
    .df-category-cue svg { width: 62px; margin-top: 0; }
    .df-results-content { padding: 0 0 30px; }
    .df-category-tabs { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); overflow: visible; margin-right: 0; padding: 12px 0; gap: 7px; }
    .df-category-tab { position: relative; width: 100%; min-width: 0; min-height: 64px; padding: 7px 4px; gap: 3px; flex-direction: column; white-space: normal; text-align: center; line-height: 1.12; font-size: 10px; border-radius: 12px; }
    .df-category-tab .mdi { font-size: 23px; }
    .df-category-tab.is-selected::after { content: '✓'; position: absolute; top: 5px; right: 6px; display: grid; place-items: center; width: 16px; height: 16px; border-radius: 50%; color: #28106f; background: #fff; font-size: 11px; font-weight: 900; box-shadow: 0 2px 6px #1c0d5338; }
    .df-reset { display: none; }
    .df-toolbar { margin: 3px 0 13px; gap: 7px; flex-wrap: wrap; }
    .df-enhanced .df-mobile-filters { display: inline-flex; border-radius: 9px; min-height: 37px; font-size: 11px; padding: 7px 10px; }
    .df-enhanced .df-facets { display: none; }
    .df-enhanced .df-facets.is-open { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); order: 4; gap: 9px; width: 100%; background: #f7f4fe; border-radius: 12px; padding: 12px; margin-top: 5px; }
    .df-facets { flex-wrap: wrap; }
    .df-facet { min-width: 0; }
    .df-facet select { width: 100%; min-width: 0; font-size: 12px; max-width: 100%; }
    .df-facet--radius { order: 1; }
    .df-sort { margin-left: auto; flex: 1; min-width: 0; }
    .df-sort select { min-height: 37px; padding: 7px; font-size: 11px; max-width: 100%; width: 100%; }
    .df-view-switch { gap: 3px; }
    .df-view-switch a { min-width: 35px; min-height: 37px; border-radius: 9px; padding: 6px; }
    .df-view-switch a span { display: none; }
    .df-results-summary { display: flex; flex-direction: column; align-items: flex-start; gap: 8px; margin-bottom: 13px; }
    .df-result-count { font-size: 12px; }
    .df-result-count > span { display: none; }
    .df-active-filters { max-width: 100%; flex-wrap: nowrap; overflow-x: auto; scrollbar-width: thin; }
    .df-active-filters:empty { display: none; }
    .df-active-filters .df-chip { flex-shrink: 0; font-size: 10px; min-height: 26px; padding: 3px 9px; }
    .df-results .df-grid { grid-template-columns: minmax(0, 1fr); gap: 17px; }
    .df-results .df-card { border-radius: 13px; }
    .df-distance-divider { gap: 9px; margin: 9px 0 0; }
    .df-distance-divider > span { min-width: 0; width: min(78%, 310px); padding: 9px 13px; }
    .df-distance-divider strong { font-size: 12px; }
    .df-distance-divider small { font-size: 10px; }
    .df-card-image { aspect-ratio: 3 / 1; }
    .df-card-badge { font-size: 11px; left: 12px; }
    .df-card-body { padding: 25px 14px 16px; }
    .df-card h2 { font-size: 18px; }
    .df-card-city { font-size: 14px; }
    .df-card-details { font-size: 12px; }
    .df-results .df-map-panel { height: 57vh; min-height: 360px; }
    .df-drawer-surface { width: 100%; padding: 23px 24px 32px; border-radius: 20px 20px 0 0; height: calc(100% - 70px); align-self: flex-end; }
    .df-drawer-backdrop { backdrop-filter: none; }
    .df-area-drawer .df-city { font-size: 12px !important; }
    .df-area-drawer .df-address-wrap input { font-size: 16px; }
    .df-area-drawer .df-address-wrap input::placeholder { font-size: 12px; }
    .df-area-drawer .df-show { position: sticky; bottom: 0; }
    .df-footer { padding: 17px 20px; border-top: 1px solid #efebf6; }
}
/* Brand artwork supplied by DKbyday, including the original tagline. */
.dk-flow-page .df-logo { display: flex; flex-shrink: 0; }
.dk-flow-page .df-logo img { width: 162px; height: auto; display: block; object-fit: contain; }
@media (max-width: 767px) {
    .dk-flow-page .df-logo img { width: 139px; height: auto; }
}

.df-results {
    transition: opacity 160ms ease-in-out;
}
.df-results.is-loading {
    opacity: .58;
}
.df-live-status {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    min-height: 38px;
    margin: 12px 0;
    color: #514b5b;
    font-size: 14px;
    text-align: center;
}
.df-live-status[hidden] { display: none; }
.df-live-status.is-error { color: #9b1c1c; }
.df-infinite-sentinel {
    display:grid;
    place-items:center;
    min-height:72px;
}
.df-infinite-sentinel::after {
    content:'';
    width:28px;
    height:28px;
    border:3px solid #dcd6f7;
    border-top-color:#6425ed;
    border-radius:50%;
    animation:df-infinite-spin .75s linear infinite;
}
@keyframes df-infinite-spin { to { transform:rotate(360deg); } }
@media (prefers-reduced-motion: reduce) {
    .df-results { transition: none; }
    .dk-results-page .df-header,
    .dk-results-page .df-category-tabs,
    .dk-results-page .df-category-tab,
    .dk-results-page .df-category-tab > .mdi,
    .dk-results-page .df-reset { transition: none; }
    .df-results-hero::before { transform: none; will-change: auto; }
    .df-category-cue { transform: translate3d(0, var(--df-category-cue-offset), 0); will-change: auto; }
    .df-category-cue__inner { animation: none; }
    .df-infinite-sentinel::after { animation:none; }
    .dk-area-page .is-confirmed > .mdi,
    .dk-area-page .df-city.is-confirmed > .mdi { animation: none; }
    .dk-area-page .df-area,
    .df-enhanced.dk-category-page .df-intro.is-leaving,
    .df-enhanced.dk-area-page .df-area.is-leaving-back,
    .df-enhanced.dk-category-page .df-intro.is-entering-back { animation: none; }
}
