:root {
    color-scheme: light;
    --ink: #071524;
    --body: #33434b;
    --muted: #6d7f88;
    --blue: #187ca4;
    --blue-dark: #0f5d85;
    --action: #0b6f69;
    --orange: #d96c35;
    --mist: #eef5f7;
    --line: #d7e2e6;
    --paper: #ffffff;
    --nature: #e5eadb;
    --nature-ink: #315a38;
    --culture: #fae8c4;
    --culture-ink: #6c461d;
    --warm: #f8f3eb;
    --shadow: 0 16px 45px rgba(7, 21, 36, .08);
    --serif: Georgia, "Times New Roman", serif;
    --sans: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

* {
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
}

body {
    margin: 0;
    background: #fbfcfc;
    color: var(--ink);
    font-family: var(--sans);
    font-size: 16px;
    line-height: 1.5;
    text-rendering: optimizeLegibility;
}

img,
svg {
    display: block;
}

a {
    color: inherit;
}

button,
input {
    font: inherit;
}

.page-shell {
    width: min(1420px, calc(100% - 64px));
    margin-inline: auto;
}

.sr-only {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
}

.skip-link {
    position: fixed;
    z-index: 100;
    top: 12px;
    left: 12px;
    padding: 10px 15px;
    border-radius: 7px;
    background: var(--ink);
    color: #fff;
    transform: translateY(-150%);
}

.skip-link:focus {
    transform: none;
}

.site-header {
    position: relative;
    z-index: 20;
    background: rgba(255, 255, 255, .96);
    border-bottom: 1px solid var(--line);
}

.header-main {
    min-height: 80px;
    display: grid;
    grid-template-columns: 270px 1fr auto;
    align-items: center;
    gap: 36px;
}

.brand {
    display: block;
    width: 245px;
}

.brand img,
.site-footer img {
    width: 100%;
    height: auto;
}

.main-nav {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: clamp(24px, 3.2vw, 52px);
}

.main-nav a {
    position: relative;
    padding: 28px 0 27px;
    font-weight: 680;
    text-decoration: none;
}

.main-nav a::after {
    content: "";
    position: absolute;
    right: 0;
    bottom: 19px;
    left: 0;
    height: 2px;
    border-radius: 2px;
    background: var(--blue);
    transform: scaleX(0);
    transition: transform .18s ease;
}

.main-nav a:hover::after,
.main-nav a:focus-visible::after {
    transform: scaleX(1);
}

.main-nav a.active::after {
    transform: scaleX(1);
}

.header-actions {
    display: flex;
    align-items: center;
    gap: 16px;
}

.place-control,
.round-action {
    border: 1px solid var(--line);
    background: #fff;
}

.place-control {
    min-height: 48px;
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 0 17px;
    border-radius: 11px;
    font-size: .92rem;
    font-weight: 700;
}

.place-control svg {
    width: 20px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.7;
}

.round-action {
    width: 46px;
    height: 46px;
    display: grid;
    place-items: center;
    border-radius: 50%;
}

.round-action svg {
    width: 21px;
    fill: none;
    stroke: currentColor;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 1.7;
}

.profile-action {
    background: var(--ink);
    border-color: var(--ink);
    color: #fff;
    text-decoration: none;
}

.profile-action > span {
    font-size: .82rem;
    font-weight: 800;
}

.profile-action:hover,
.profile-action:focus-visible {
    background: var(--blue-dark);
    border-color: var(--blue-dark);
    color: #fff;
}

.round-action:hover,
.round-action:focus-visible {
    border-color: var(--blue);
    color: var(--blue);
}

.editorial-action {
    background: var(--ink);
    border-color: var(--ink);
    color: #fff;
}

.personal-line {
    border-top: 1px solid rgba(215, 226, 230, .75);
    background: linear-gradient(90deg, #f4f9fb, #edf5fb 55%, #f6f9fb);
}

.personal-line-inner {
    min-height: 50px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
}

.personal-line p,
.personal-line a {
    margin: 0;
    font-size: .84rem;
}

.personal-line p {
    display: flex;
    align-items: center;
    gap: 9px;
    color: var(--body);
}

.personal-line p svg {
    width: 31px;
    fill: none;
    stroke: var(--blue);
    stroke-width: 2;
}

.personal-line p span:first-of-type {
    color: var(--ink);
    font-weight: 700;
}

.dot-separator {
    color: #91a2aa;
}

.personal-line a {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: var(--blue-dark);
    font-weight: 650;
    text-decoration: none;
}

.personal-line a svg {
    width: 20px;
    fill: none;
    stroke: currentColor;
    stroke-linecap: round;
    stroke-width: 1.7;
}

.menu-toggle {
    display: none;
}

.search-band {
    padding: 18px 0;
    border-bottom: 1px solid var(--line);
    background:
        linear-gradient(90deg, rgba(248, 231, 223, .38), rgba(255, 255, 255, .85) 36%, rgba(238, 245, 247, .6));
}

.search-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 36px;
}

.search-form {
    min-height: 49px;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 12px;
    padding-left: 18px;
    border: 1px solid #cad9df;
    border-radius: 14px;
    background: #fff;
    box-shadow: 0 3px 12px rgba(7, 21, 36, .035);
}

.search-form > svg {
    width: 20px;
    fill: none;
    stroke: #71838c;
    stroke-linecap: round;
    stroke-width: 1.7;
}

.search-form input {
    min-width: 0;
    height: 47px;
    border: 0;
    outline: 0;
    color: var(--ink);
    background: transparent;
}

.search-form input::placeholder {
    color: #75858e;
}

.search-form button,
.button-blue {
    border: 0;
    background: var(--blue-dark);
    color: #fff;
}

.search-form button {
    align-self: stretch;
    min-width: 94px;
    margin: -1px;
    border-radius: 13px;
    font-weight: 750;
    cursor: pointer;
}

.search-form button:hover {
    background: var(--action);
}

.quick-filters {
    display: flex;
    align-items: center;
    gap: 14px;
}

.quick-filters a,
.quick-filters button {
    min-height: 42px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 22px;
    border: 1px solid var(--line);
    border-radius: 999px;
    background: #fff;
    color: var(--ink);
    font-size: .87rem;
    font-weight: 650;
    line-height: 1;
    text-decoration: none;
    white-space: nowrap;
    cursor: pointer;
}

.quick-filters a:hover,
.quick-filters button:hover,
.quick-filters .active {
    border-color: var(--blue);
    background: var(--mist);
    color: var(--blue-dark);
}

.quick-filters button:disabled {
    cursor: wait;
    opacity: .7;
}

.data-notice {
    margin: 24px 0 0;
    padding: 12px 16px;
    border-left: 4px solid var(--orange);
    border-radius: 6px;
    background: #fff5ed;
    color: #704020;
}

.lead-grid {
    display: grid;
    grid-template-columns: minmax(0, 2.25fr) minmax(340px, .9fr);
    gap: 14px;
    padding-top: 16px;
}

.hero-story,
.calendar-panel {
    min-height: 460px;
    border-radius: 14px;
    overflow: hidden;
}

.hero-story {
    position: relative;
    display: flex;
    align-items: end;
    isolation: isolate;
    background: linear-gradient(135deg, #214d55, #667e62);
    color: #fff;
}

.hero-story > img {
    position: absolute;
    z-index: -2;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.hero-scrim {
    position: absolute;
    z-index: -1;
    inset: 0;
    background:
        linear-gradient(90deg, rgba(4, 14, 20, .68) 0%, rgba(4, 14, 20, .34) 48%, rgba(4, 14, 20, .04) 78%),
        linear-gradient(0deg, rgba(4, 14, 20, .3), transparent 50%);
    transition: background .2s ease;
}

.hero-story.hero-image-light {
    color: #071524;
}

.hero-story.hero-image-light .hero-scrim {
    background:
        linear-gradient(90deg, rgba(255, 255, 255, .74) 0%, rgba(255, 255, 255, .42) 48%, rgba(255, 255, 255, .06) 78%),
        linear-gradient(0deg, rgba(255, 255, 255, .2), transparent 50%);
}

.hero-story.hero-image-light .hero-topic {
    border-color: rgba(7, 21, 36, .2);
    background: rgba(255, 255, 255, .82);
    color: #183f2a;
}

.hero-story.hero-image-light .hero-content h1 {
    color: #071524;
    text-shadow: 0 1px 0 rgba(255, 255, 255, .34);
}

.hero-story.hero-image-light .hero-content p {
    color: rgba(7, 21, 36, .86);
}

.hero-story.hero-image-light .button-light {
    border: 1px solid rgba(7, 21, 36, .16);
    background: rgba(255, 255, 255, .9);
    color: #071524;
}

.hero-story.hero-image-light .button-light:hover {
    background: #fff;
}

.hero-story.hero-image-light .hero-credit {
    color: rgba(7, 21, 36, .78);
    text-shadow: 0 1px 2px rgba(255, 255, 255, .75);
}

.hero-content {
    width: min(790px, 78%);
    padding: clamp(34px, 4vw, 68px);
}

.hero-topic {
    display: inline-flex;
    align-items: center;
    min-height: 28px;
    padding: 0 12px;
    border: 1px solid rgba(255, 255, 255, .4);
    border-radius: 6px;
    background: rgba(48, 81, 52, .78);
    font-size: .75rem;
    font-weight: 750;
    letter-spacing: .07em;
    text-transform: uppercase;
    backdrop-filter: blur(6px);
}

.hero-content h1 {
    max-width: 780px;
    margin: 13px 0 8px;
    font-size: clamp(2.35rem, 4.1vw, 4.5rem);
    font-weight: 760;
    letter-spacing: -.045em;
    line-height: .98;
    text-wrap: balance;
}

.hero-content p {
    max-width: 700px;
    margin: 0 0 23px;
    color: rgba(255, 255, 255, .92);
    font-size: clamp(.98rem, 1.4vw, 1.18rem);
}

.button {
    min-height: 43px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    padding: 0 20px;
    border-radius: 9px;
    font-size: .88rem;
    font-weight: 750;
    text-decoration: none;
}

.button span {
    font-size: 1.15em;
}

.button-light {
    background: #fff;
    color: var(--ink);
}

.button-light:hover {
    background: var(--mist);
}

.button-blue:hover {
    background: var(--action);
}

.hero-credit {
    position: absolute;
    right: 18px;
    bottom: 13px;
    color: rgba(255, 255, 255, .8);
    font-size: .72rem;
    text-shadow: 0 1px 2px #000;
}

.hero-story.without-image {
    background:
        radial-gradient(circle at 75% 15%, rgba(255, 255, 255, .22), transparent 28%),
        linear-gradient(135deg, #123745, #315e5e 50%, #687c5c);
}

.hero-story.no-image-overlay {
    display: grid;
    grid-template-rows: minmax(300px, 1fr) auto auto;
    align-items: stretch;
    background: #f7f4ee;
    color: var(--ink);
}

.hero-story.no-image-overlay > img {
    position: relative;
    z-index: auto;
    grid-row: 1;
    min-height: 300px;
    background: #ece8df;
}

.hero-story.no-image-overlay .hero-scrim {
    display: none;
}

.hero-story.no-image-overlay .hero-content {
    grid-row: 2;
    width: 100%;
    padding: 24px 28px 14px;
}

.hero-story.no-image-overlay .hero-topic {
    border-color: rgba(25, 58, 43, .2);
    background: #e5eee5;
    color: #315336;
    backdrop-filter: none;
}

.hero-story.no-image-overlay .hero-content h1 {
    color: var(--ink);
    font-size: clamp(2rem, 3.2vw, 3.35rem);
}

.hero-story.no-image-overlay .hero-content p {
    color: var(--muted);
}

.hero-story.no-image-overlay .button-light {
    background: var(--blue);
    color: #fff;
}

.hero-story.no-image-overlay .hero-credit {
    position: static;
    grid-row: 3;
    padding: 0 28px 18px;
    color: var(--muted);
    text-shadow: none;
}

.hero-story.editorial-poster .hero-content {
    width: min(680px, 51%);
    padding-bottom: 44px;
}

.hero-story.editorial-poster .hero-content h1 {
    font-size: clamp(2.2rem, 3.65vw, 4.05rem);
}

.hero-story.editorial-poster .hero-content p {
    margin-bottom: 12px;
}

.hero-story.editorial-poster .hero-detail {
    max-width: 610px;
    color: rgba(255, 255, 255, .84);
    font-size: .93rem;
    line-height: 1.42;
}

.hero-story.editorial-poster .button {
    margin-top: 13px;
}

.hero-story.editorial-poster .hero-credit {
    color: rgba(255, 255, 255, .6);
}

.calendar-panel {
    position: relative;
    display: flex;
    flex-direction: column;
    padding: 30px 32px 32px;
    background: linear-gradient(145deg, #fbf7f0, #f3eee5);
    border: 1px solid #eee7da;
}

.eyebrow {
    margin: 0 0 7px;
    color: var(--muted);
    font-size: .7rem;
    font-weight: 780;
    letter-spacing: .09em;
    text-transform: uppercase;
}

.calendar-panel h2,
.section-heading h2,
.theme-panel h2,
.search-results h1 {
    margin: 0;
    font-family: var(--serif);
    font-weight: 500;
    letter-spacing: -.025em;
}

.calendar-panel h2 {
    max-width: 330px;
    font-size: clamp(1.75rem, 2.5vw, 2.25rem);
    line-height: 1.08;
}

.timeline {
    position: relative;
    z-index: 1;
    display: grid;
    gap: 20px;
    margin: 29px 0 28px;
    padding: 0;
    list-style: none;
}

.timeline::before {
    content: "";
    position: absolute;
    top: 10px;
    bottom: 10px;
    left: 5px;
    width: 1px;
    background: #9ba8ac;
}

.timeline li {
    position: relative;
    display: grid;
    grid-template-columns: 13px 58px minmax(0, 1fr);
    align-items: start;
    gap: 10px;
}

.timeline-marker {
    position: relative;
    z-index: 1;
    width: 11px;
    height: 11px;
    margin-top: 5px;
    border: 1.5px solid var(--ink);
    border-radius: 50%;
    background: #f8f3eb;
}

.timeline time {
    display: flex;
    flex-direction: column;
    padding-top: 1px;
    font-size: .9rem;
    font-weight: 680;
    line-height: 1.15;
}

.timeline time small {
    margin-bottom: 3px;
    color: var(--muted);
    font-size: .64rem;
    font-weight: 650;
    text-transform: uppercase;
}

.timeline li > div {
    min-width: 0;
}

.timeline a {
    display: block;
    overflow: hidden;
    color: var(--ink);
    font-size: .88rem;
    font-weight: 610;
    line-height: 1.25;
    text-decoration: none;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.timeline a:hover {
    color: var(--blue-dark);
    text-decoration: underline;
}

.timeline li > div > span,
.card-meta {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-top: 5px;
    color: var(--muted);
    font-size: .69rem;
}

.source-dot {
    flex: 0 0 auto;
    width: 7px;
    height: 7px;
    display: inline-block;
    border-radius: 50%;
    background: var(--blue);
}

.source-ruban-nu {
    background: #f09a23;
}

.source-ansager-info {
    background: #187ca4;
}

.source-pulsen-i-vest {
    background: #4d7f45;
}

.calendar-panel .button {
    position: relative;
    z-index: 2;
    align-self: flex-start;
    margin-top: auto;
}

.calendar-empty {
    position: relative;
    z-index: 1;
    margin: 28px 0;
    color: var(--muted);
}

.calendar-botanical {
    position: absolute;
    right: -3px;
    bottom: -5px;
    width: 165px;
    fill: none;
    stroke: #ad9976;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 1.1;
    opacity: .7;
}

.selected-section {
    padding-top: 21px;
}

.section-heading {
    min-height: 54px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    margin-bottom: 14px;
}

.heading-with-note {
    display: flex;
    align-items: baseline;
    gap: 30px;
}

.section-heading h2 {
    font-size: clamp(2rem, 3vw, 2.75rem);
}

.heading-with-note p {
    margin: 0;
    color: var(--body);
    font-size: .86rem;
}

.curation-note {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: var(--muted);
    font-size: .76rem;
}

.curation-note i {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--orange);
    box-shadow: 0 0 0 4px rgba(217, 108, 53, .12);
}

.selected-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.75fr) minmax(390px, 1fr);
    gap: 26px;
}

.story-composition {
    min-width: 0;
    display: grid;
    grid-template-columns: minmax(0, .96fr) minmax(310px, 1.05fr);
    gap: 18px;
}

.selected-feature,
.compact-story {
    border: 1px solid var(--line);
    background: #fff;
}

.selected-feature {
    overflow: hidden;
    border-radius: 12px;
}

.selected-photo {
    display: block;
    overflow: hidden;
}

.selected-photo img {
    width: 100%;
    aspect-ratio: 8 / 5;
    object-fit: cover;
    transition: transform .4s ease;
}

.selected-feature:hover .selected-photo img {
    transform: scale(1.025);
}

.selected-card-body {
    padding: 16px 18px 18px;
}

.topic-chip {
    display: inline-flex;
    min-height: 23px;
    align-items: center;
    padding: 0 8px;
    border-radius: 999px;
    background: var(--mist);
    color: var(--blue-dark);
    font-size: .62rem;
    font-weight: 800;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.topic-chip.nature {
    background: #e8efe0;
    color: #41643e;
}

.topic-chip.culture {
    background: #fff0d3;
    color: #875d26;
}

.topic-chip.sport {
    background: #e8eef7;
    color: #355b88;
}

.selected-feature h3,
.compact-story h3,
.place-feature h3,
.result-card h2 {
    margin: 0;
    line-height: 1.12;
}

.selected-feature h3 {
    margin-top: 9px;
    font-size: 1.24rem;
}

.selected-feature h3 a,
.compact-story h3 a,
.result-card h2 a {
    text-decoration: none;
}

.selected-feature h3 a:hover,
.compact-story h3 a:hover,
.result-card h2 a:hover {
    color: var(--blue-dark);
}

.selected-feature p,
.compact-story p {
    color: var(--body);
}

.selected-feature p {
    margin: 7px 0 13px;
    font-size: .82rem;
    line-height: 1.4;
}

.compact-story-stack {
    display: grid;
    grid-template-rows: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.compact-story {
    position: relative;
    min-height: 145px;
    padding: 17px 52px 16px 18px;
    border-radius: 10px;
}

.compact-story.local-voice {
    padding-right: 145px;
}

.compact-story h3 {
    font-size: 1.05rem;
}

.compact-story p {
    max-width: 510px;
    margin: 6px 0 12px;
    font-size: .76rem;
    line-height: 1.35;
}

.bookmark-link {
    position: absolute;
    right: 14px;
    bottom: 14px;
    color: var(--ink);
}

.bookmark-link svg {
    width: 20px;
    fill: none;
    stroke: currentColor;
    stroke-linejoin: round;
    stroke-width: 1.6;
}

.local-signature {
    position: absolute;
    top: 13px;
    right: 13px;
    display: grid;
    grid-template-columns: auto 23px 48px;
    align-items: center;
    gap: 6px;
    color: var(--muted);
    font-family: var(--serif);
    font-size: .66rem;
    font-style: italic;
    line-height: 1.05;
    text-align: right;
}

.local-signature i {
    font-size: 1.2rem;
    font-weight: 400;
    transform: rotate(16deg);
}

.local-signature b {
    width: 48px;
    height: 48px;
    display: grid;
    place-items: center;
    border: 3px solid #fff;
    border-radius: 50%;
    background: linear-gradient(135deg, #88978c, #32433d);
    color: #fff;
    box-shadow: 0 2px 10px rgba(7, 21, 36, .18);
    font-family: var(--sans);
    font-size: 1.1rem;
    font-style: normal;
}

.place-feature {
    position: relative;
    min-height: 315px;
    display: grid;
    grid-template-columns: minmax(210px, .9fr) minmax(230px, 1.1fr);
    align-items: center;
    gap: 26px;
    overflow: hidden;
    padding: 24px 28px;
    border-radius: 13px;
    background: linear-gradient(120deg, #e5e8d8, #dce3d3);
}

.topography {
    position: absolute;
    inset: 0 45% 0 0;
    opacity: .15;
    background:
        repeating-radial-gradient(ellipse at 0 0, transparent 0 13px, #677560 14px 15px, transparent 16px 27px);
}

.place-copy {
    position: relative;
    z-index: 2;
    min-width: 0;
}

.place-copy .eyebrow {
    color: #5d6956;
}

.place-feature h3 {
    margin-bottom: 8px;
    font-family: var(--serif);
    font-size: clamp(1.6rem, 2.4vw, 2.25rem);
    font-weight: 500;
    letter-spacing: -.025em;
    overflow-wrap: anywhere;
    hyphens: auto;
    text-wrap: balance;
}

.place-feature p:not(.eyebrow) {
    margin: 0 0 20px;
    color: #4e5e4a;
    font-size: .8rem;
}

.place-feature .place-copy a {
    color: var(--blue-dark);
    font-size: .82rem;
    font-weight: 700;
    text-decoration: none;
}

.place-photo {
    position: relative;
    z-index: 1;
    display: block;
}

.place-photo img {
    width: 100%;
    aspect-ratio: 8 / 5;
    border-radius: 10px;
    object-fit: cover;
    box-shadow: 0 8px 28px rgba(36, 52, 37, .14);
}

.place-leaves {
    position: absolute;
    right: -3px;
    bottom: -16px;
    width: 66px;
    fill: none;
    stroke: #6e8665;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 1.3;
}

.thematic-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 22px;
    padding-top: 28px;
    padding-bottom: 72px;
}

.theme-panel {
    position: relative;
    min-height: 265px;
    display: grid;
    grid-template-columns: minmax(280px, .9fr) minmax(300px, 1.1fr);
    align-items: stretch;
    gap: 25px;
    overflow: hidden;
    padding: 19px 19px 19px 58px;
    border-radius: 14px;
}

.nature-panel {
    background: linear-gradient(130deg, #e8ecdf, #dce4d6);
    color: #244c2b;
}

.culture-panel {
    background: linear-gradient(130deg, #fbe9c9, #f8dfb0);
    color: #593b1d;
}

.theme-copy {
    align-self: center;
}

.theme-panel h2 {
    margin-bottom: 17px;
    font-size: clamp(2rem, 3vw, 2.9rem);
    line-height: 1.02;
}

.theme-panel ul {
    display: grid;
    gap: 12px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.theme-panel li a {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 16px;
    font-size: .82rem;
    font-weight: 610;
    text-decoration: none;
}

.theme-panel li a:hover {
    text-decoration: underline;
    text-underline-offset: 3px;
}

.theme-panel li span {
    font-size: 1.15rem;
}

.theme-empty {
    font-size: .85rem;
}

.theme-image {
    width: 100%;
    height: 100%;
    min-height: 225px;
    border-radius: 10px;
    object-fit: cover;
}

.theme-visual {
    position: relative;
    align-self: stretch;
    min-height: 225px;
    margin: 0;
}

.theme-visual .theme-image {
    display: block;
    height: 100%;
    min-height: 225px;
    aspect-ratio: auto;
    object-fit: cover;
}

.theme-visual figcaption {
    position: absolute;
    right: 9px;
    bottom: 8px;
    padding: 3px 5px;
    border: 1px solid rgba(255, 255, 255, .22);
    border-radius: 4px;
    background: rgba(7, 21, 36, .16);
    color: rgba(255, 255, 255, .78);
    font-size: .54rem;
    font-weight: 600;
    letter-spacing: .05em;
    opacity: .48;
    text-shadow: 0 1px 1px rgba(0, 0, 0, .28);
    backdrop-filter: blur(1px);
    pointer-events: none;
}

.theme-botanical {
    position: absolute;
    left: -12px;
    bottom: -28px;
    width: 92px;
    fill: none;
    stroke: #67805e;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 1.2;
}

.discovery-section {
    padding-top: 66px;
}

.discovery-heading {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 30px;
    margin-bottom: 23px;
}

.discovery-heading h2 {
    margin: 0;
    font-family: var(--serif);
    font-size: clamp(2.15rem, 3.6vw, 3.35rem);
    font-weight: 500;
    letter-spacing: -.035em;
    line-height: 1;
}

.discovery-heading > div > p:last-child {
    max-width: 690px;
    margin: 10px 0 0;
    color: var(--body);
    font-size: .9rem;
}

.discovery-heading > a {
    flex: 0 0 auto;
    color: var(--blue-dark);
    font-size: .83rem;
    font-weight: 760;
    text-decoration: none;
}

.discovery-heading > a:hover {
    text-decoration: underline;
    text-underline-offset: 4px;
}

.more-news-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
}

.more-news-card {
    display: flex;
    min-width: 0;
    flex-direction: column;
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: 14px;
    background: #fff;
    box-shadow: 0 12px 35px rgba(7, 21, 36, .045);
}

.more-news-card.without-image {
    position: relative;
    min-height: 285px;
    background: linear-gradient(145deg, #f4f8f9, #fff);
}

.more-news-card.without-image::before {
    content: "";
    height: 5px;
    background: linear-gradient(90deg, var(--blue-dark), var(--orange));
}

.more-news-photo {
    display: block;
    overflow: hidden;
    background: var(--mist);
}

.more-news-photo img {
    display: block;
    width: 100%;
    aspect-ratio: 8 / 5;
    object-fit: cover;
    transition: transform .38s ease;
}

.more-news-card:hover .more-news-photo img {
    transform: scale(1.025);
}

.more-news-card-body {
    display: flex;
    min-height: 0;
    flex: 1;
    flex-direction: column;
    padding: 20px 21px 21px;
}

.more-news-card.without-image .more-news-card-body {
    justify-content: center;
    padding-top: 30px;
}

.more-news-card h3 {
    margin: 11px 0 0;
    font-family: var(--serif);
    font-size: 1.35rem;
    font-weight: 600;
    line-height: 1.17;
}

.more-news-card h3 a {
    text-decoration: none;
}

.more-news-card h3 a:hover {
    color: var(--blue-dark);
}

.more-news-card p {
    display: -webkit-box;
    overflow: hidden;
    margin: 9px 0 17px;
    color: var(--body);
    font-size: .82rem;
    line-height: 1.48;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
}

.more-news-card .card-meta {
    margin-top: auto;
}

.experience-section {
    margin-top: 70px;
    padding: 62px 0 66px;
    border-block: 1px solid #d8e5e9;
    background:
        radial-gradient(circle at 88% 16%, rgba(24, 124, 164, .11), transparent 25%),
        linear-gradient(145deg, #eef6f7, #f7faf8);
}

.experience-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
}

.experience-card {
    position: relative;
    display: grid;
    grid-template-columns: 62px minmax(0, 1fr) 28px;
    align-items: center;
    gap: 15px;
    min-height: 145px;
    padding: 20px 18px;
    border: 1px solid #d6e3e6;
    border-radius: 13px;
    background: rgba(255, 255, 255, .88);
    box-shadow: 0 10px 28px rgba(7, 21, 36, .045);
}

.experience-card time {
    display: grid;
    place-items: center;
    align-content: center;
    width: 62px;
    height: 74px;
    border-radius: 9px;
    background: var(--blue-dark);
    color: #fff;
    line-height: 1;
}

.experience-card time strong {
    font-family: var(--serif);
    font-size: 1.75rem;
    font-weight: 500;
}

.experience-card time span {
    margin-top: 5px;
    font-size: .61rem;
    font-weight: 800;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.experience-time {
    color: var(--blue-dark);
    font-size: .67rem;
    font-weight: 780;
    letter-spacing: .04em;
    text-transform: uppercase;
}

.experience-card h3 {
    margin: 7px 0 5px;
    font-family: var(--serif);
    font-size: 1.06rem;
    line-height: 1.17;
}

.experience-card h3 a,
.experience-arrow {
    text-decoration: none;
}

.experience-card h3 a:hover {
    color: var(--blue-dark);
}

.experience-card p {
    margin: 0;
    color: var(--muted);
    font-size: .72rem;
}

.experience-arrow {
    display: grid;
    place-items: center;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: var(--mist);
    color: var(--blue-dark);
    font-weight: 800;
}

.place-discovery-section {
    padding-bottom: 84px;
}

.place-discovery-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 16px;
}

.place-discovery-card {
    min-width: 0;
    overflow: hidden;
    border: 1px solid #dce3d7;
    border-radius: 13px;
    background: #fff;
    box-shadow: 0 12px 32px rgba(36, 52, 37, .05);
}

.place-discovery-photo {
    display: block;
    overflow: hidden;
    background: var(--nature);
}

.place-discovery-photo img {
    display: block;
    width: 100%;
    aspect-ratio: 8 / 5;
    object-fit: cover;
    transition: transform .4s ease;
}

.place-discovery-card:hover .place-discovery-photo img {
    transform: scale(1.025);
}

.place-discovery-card > div {
    padding: 18px 18px 19px;
}

.place-discovery-card > div > span:first-child {
    color: #5b7154;
    font-size: .64rem;
    font-weight: 800;
    letter-spacing: .07em;
    text-transform: uppercase;
}

.place-discovery-card h3 {
    margin: 7px 0 0;
    font-family: var(--serif);
    font-size: 1.22rem;
    font-weight: 600;
    line-height: 1.15;
}

.place-discovery-card h3 a {
    text-decoration: none;
}

.place-discovery-card h3 a:hover {
    color: var(--blue-dark);
}

.place-discovery-card p {
    display: -webkit-box;
    overflow: hidden;
    margin: 8px 0 14px;
    color: var(--body);
    font-size: .76rem;
    line-height: 1.46;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
}

.place-discovery-link {
    color: var(--blue-dark);
    font-size: .75rem;
    font-weight: 760;
    text-decoration: none;
}

.place-discovery-link:hover {
    text-decoration: underline;
    text-underline-offset: 3px;
}

.search-results {
    padding-top: 38px;
}

.section-title-row {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 18px;
}

.search-results h1 {
    font-size: clamp(2rem, 4vw, 3.4rem);
    line-height: 1;
}

.text-link {
    color: var(--blue-dark);
    font-size: .85rem;
    font-weight: 700;
    text-decoration: none;
}

.result-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 15px;
}

.result-card {
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: 12px;
    background: #fff;
}

.result-image {
    display: block;
}

.result-image img {
    display: block;
    width: 100%;
    height: auto;
    aspect-ratio: 8 / 5;
    object-fit: cover;
}

.result-body {
    padding: 16px;
}

.result-card h2 {
    margin-top: 9px;
    font-size: 1.08rem;
}

.result-card p {
    margin: 8px 0 12px;
    color: var(--body);
    font-size: .8rem;
}

.empty-state {
    padding: 30px;
    border: 1px solid var(--line);
    border-radius: 14px;
    background: var(--mist);
}

.empty-state h2,
.empty-state p {
    margin: 0;
}

.empty-state p {
    margin-top: 4px;
    color: var(--muted);
}

.site-footer {
    border-top: 1px solid var(--line);
    background: #f3f7f8;
}

.footer-inner {
    min-height: 150px;
    display: grid;
    grid-template-columns: 220px 1fr auto;
    align-items: center;
    gap: 40px;
}

.footer-inner p {
    color: var(--muted);
    font-size: .85rem;
}

.footer-inner nav {
    display: flex;
    gap: 24px;
}

.footer-inner nav a {
    color: var(--body);
    font-size: .82rem;
    font-weight: 650;
    text-decoration: none;
}

.footer-inner nav a:hover {
    color: var(--blue-dark);
}

@media (max-width: 1250px) {
    .page-shell {
        width: min(100% - 40px, 1180px);
    }

    .header-main {
        grid-template-columns: 220px 1fr auto;
        gap: 22px;
    }

    .brand {
        width: 210px;
    }

    .main-nav {
        gap: 24px;
    }

    .place-control {
        display: none;
    }

    .lead-grid {
        grid-template-columns: minmax(0, 1.8fr) minmax(330px, .9fr);
    }

    .selected-grid {
        grid-template-columns: 1fr;
    }

    .place-feature {
        min-height: 270px;
        grid-template-columns: minmax(250px, .8fr) minmax(320px, 1.2fr);
    }

    .theme-panel {
        grid-template-columns: 1fr;
        padding-left: 52px;
    }

    .theme-image {
        height: 210px;
    }

    .theme-visual,
    .theme-visual .theme-image {
        min-height: 0;
        height: 210px;
    }

    .result-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .place-discovery-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 960px) {
    .header-main {
        grid-template-columns: 1fr auto auto;
        min-height: 70px;
    }

    .main-nav {
        position: absolute;
        top: 70px;
        right: 20px;
        left: 20px;
        display: none;
        align-items: stretch;
        padding: 8px;
        border: 1px solid var(--line);
        border-radius: 12px;
        background: #fff;
        box-shadow: var(--shadow);
    }

    .main-nav.open {
        display: grid;
    }

    .main-nav a {
        padding: 12px 14px;
        border-radius: 8px;
    }

    .main-nav a:hover {
        background: var(--mist);
    }

    .main-nav a::after {
        display: none;
    }

    .menu-toggle {
        width: 44px;
        height: 44px;
        display: grid;
        align-content: center;
        gap: 5px;
        padding: 10px;
        border: 1px solid var(--line);
        border-radius: 50%;
        background: #fff;
    }

    .menu-toggle > span:not(.sr-only) {
        height: 2px;
        border-radius: 2px;
        background: var(--ink);
    }

    .profile-action {
        display: none;
    }

    .personal-line-inner {
        min-height: 44px;
    }

    .personal-line a {
        display: none;
    }

    .search-layout {
        grid-template-columns: 1fr;
        gap: 12px;
    }

    .quick-filters {
        overflow-x: auto;
        padding-bottom: 2px;
    }

    .lead-grid {
        grid-template-columns: 1fr;
    }

    .hero-story {
        min-height: 480px;
    }

    .hero-story.editorial-poster .hero-content {
        width: min(700px, 64%);
    }

    .calendar-panel {
        min-height: auto;
    }

    .story-composition {
        grid-template-columns: 1fr 1fr;
    }

    .heading-with-note {
        display: block;
    }

    .heading-with-note p {
        margin-top: 2px;
    }

    .thematic-grid {
        grid-template-columns: 1fr;
    }

    .theme-panel {
        grid-template-columns: minmax(260px, .8fr) minmax(300px, 1.2fr);
    }

    .result-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .more-news-grid,
    .experience-grid,
    .place-discovery-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 680px) {
    body {
        font-size: 15px;
    }

    .page-shell {
        width: calc(100% - 28px);
    }

    .header-main {
        gap: 10px;
    }

    .brand {
        width: 178px;
    }

    .round-action {
        width: 42px;
        height: 42px;
    }

    .personal-line {
        overflow: hidden;
    }

    .personal-line-inner {
        width: 100%;
        padding: 0 14px;
    }

    .personal-line p {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .personal-line p svg,
    .personal-line .dot-separator:last-of-type,
    .personal-line .dot-separator:last-of-type + * {
        display: none;
    }

    .search-band {
        padding: 12px 0;
    }

    .search-form {
        grid-template-columns: minmax(0, 1fr) auto;
        padding-left: 12px;
    }

    .search-form > svg {
        display: none;
    }

    .search-form button {
        min-width: 72px;
    }

    .quick-filters {
        gap: 8px;
    }

    .quick-filters a,
    .quick-filters button {
        min-height: 38px;
        padding: 0 16px;
        font-size: .8rem;
    }

    .lead-grid {
        width: 100%;
        gap: 10px;
        padding-top: 10px;
    }

    .hero-story,
    .calendar-panel {
        border-radius: 0;
    }

    .hero-story {
        min-height: 450px;
    }

    .hero-content {
        width: 100%;
        padding: 28px 20px 34px;
    }

    .hero-story.editorial-poster .hero-content {
        width: min(530px, 80%);
        padding: 28px 20px 34px;
    }

    .hero-content h1 {
        font-size: clamp(2.25rem, 10vw, 3.2rem);
    }

    .hero-credit {
        display: none;
    }

    .calendar-panel {
        padding: 28px 20px;
    }

    .selected-section {
        padding-top: 28px;
    }

    .section-heading {
        align-items: flex-start;
    }

    .section-heading h2 {
        font-size: 2.2rem;
    }

    .curation-note {
        max-width: 105px;
        text-align: right;
    }

    .story-composition {
        grid-template-columns: 1fr;
    }

    .selected-feature {
        display: grid;
        grid-template-columns: 42% 1fr;
    }

    .selected-photo img {
        height: 100%;
        aspect-ratio: auto;
    }

    .selected-card-body {
        padding: 14px;
    }

    .selected-feature p {
        display: none;
    }

    .compact-story {
        min-height: 135px;
    }

    .compact-story.local-voice {
        padding-right: 115px;
    }

    .local-signature {
        grid-template-columns: auto 40px;
    }

    .local-signature i {
        display: none;
    }

    .local-signature b {
        width: 40px;
        height: 40px;
    }

    .place-feature {
        min-height: 420px;
        grid-template-columns: 1fr;
        align-content: start;
        padding: 24px;
    }

    .place-copy {
        padding-right: 22px;
    }

    .place-photo img {
        max-height: 220px;
    }

    .thematic-grid {
        padding-top: 18px;
        padding-bottom: 42px;
    }

    .theme-panel {
        min-height: 420px;
        grid-template-columns: 1fr;
        padding: 28px 20px 20px 46px;
    }

    .theme-panel h2 {
        font-size: 2.35rem;
    }

    .theme-image {
        min-height: 190px;
        height: 210px;
    }

    .theme-visual,
    .theme-visual .theme-image {
        min-height: 190px;
        height: 210px;
    }

    .result-grid {
        grid-template-columns: 1fr;
    }

    .discovery-section {
        padding-top: 48px;
    }

    .discovery-heading {
        display: grid;
        align-items: start;
        gap: 13px;
        margin-bottom: 19px;
    }

    .discovery-heading h2 {
        font-size: 2.35rem;
    }

    .more-news-grid,
    .experience-grid,
    .place-discovery-grid {
        grid-template-columns: 1fr;
    }

    .more-news-card {
        display: grid;
        grid-template-columns: 39% minmax(0, 1fr);
    }

    .more-news-card.without-image {
        display: block;
        min-height: 0;
    }

    .more-news-photo img {
        height: 100%;
        aspect-ratio: auto;
    }

    .more-news-card-body {
        padding: 16px;
    }

    .more-news-card p {
        -webkit-line-clamp: 2;
    }

    .experience-section {
        margin-top: 50px;
        padding: 46px 0 50px;
    }

    .experience-card {
        min-height: 125px;
        grid-template-columns: 56px minmax(0, 1fr) 28px;
        padding: 16px;
    }

    .experience-card time {
        width: 56px;
        height: 67px;
    }

    .place-discovery-section {
        padding-bottom: 58px;
    }

    .place-discovery-card {
        display: grid;
        grid-template-columns: 38% minmax(0, 1fr);
    }

    .place-discovery-photo img {
        height: 100%;
        aspect-ratio: auto;
    }

    .place-discovery-card > div {
        padding: 15px 16px 16px;
    }

    .place-discovery-card p {
        -webkit-line-clamp: 2;
    }

    .section-title-row {
        align-items: start;
    }

    .footer-inner {
        grid-template-columns: 1fr;
        gap: 12px;
        padding: 34px 0;
    }

    .footer-inner img {
        width: 190px;
    }

    .footer-inner p {
        margin: 0;
    }
}

/* Samlet forside 2026-07-26 */
.page-shell {
    width: min(1420px, calc(100% - 48px));
}

.site-header {
    position: sticky;
    top: 0;
    z-index: 2000;
    background: #071a35;
    border-bottom: 0;
    box-shadow: 0 8px 28px rgba(7, 21, 36, .16);
}

/* Leaflet bruger interne lag op til z-index 700. Denne stacking context holder
   alle kortlag under den faste sidemenu. */
.leaflet-container {
    z-index: 0;
    isolation: isolate;
}

.header-main {
    min-height: 70px;
    grid-template-columns: 230px 1fr auto;
    gap: 28px;
}

.brand,
.footer-brand {
    width: auto;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: #fff;
    text-decoration: none;
}

.brand-name {
    font-family: var(--serif);
    font-size: 1.45rem;
    font-weight: 700;
    letter-spacing: -.035em;
    white-space: nowrap;
}

.brand-name em {
    color: #dbeefa;
    font-style: normal;
}

.brand img,
.site-footer .footer-brand img {
    width: 42px;
    height: 42px;
    object-fit: contain;
}

.main-nav {
    gap: clamp(22px, 3vw, 44px);
}

.main-nav a {
    padding: 24px 0 23px;
    color: #fff;
    font-size: .91rem;
}

.main-nav a::after {
    bottom: 16px;
    background: #f08a3c;
}

.nav-theme {
    position: relative;
}

.nav-theme summary {
    position: relative;
    display: flex;
    align-items: center;
    gap: 5px;
    padding: 24px 0 23px;
    color: #fff;
    cursor: pointer;
    font-size: .91rem;
    font-weight: 680;
    list-style: none;
}

.nav-theme summary::-webkit-details-marker {
    display: none;
}

.nav-theme summary::after {
    position: absolute;
    right: 0;
    bottom: 16px;
    left: 0;
    height: 2px;
    border-radius: 2px;
    background: #f08a3c;
    content: "";
    transform: scaleX(0);
    transition: transform .18s ease;
}

.nav-theme[open] summary::after,
.nav-theme.active summary::after,
.nav-theme summary:hover::after,
.nav-theme summary:focus-visible::after {
    transform: scaleX(1);
}

.nav-theme-menu {
    position: absolute;
    top: calc(100% - 12px);
    left: 50%;
    z-index: 30;
    display: grid;
    min-width: 176px;
    gap: 2px;
    padding: 8px;
    border: 1px solid #d8e2ea;
    border-radius: 10px;
    background: #fff;
    box-shadow: 0 14px 32px rgba(4, 20, 41, .22);
    transform: translateX(-50%);
}

.nav-theme-menu a {
    padding: 9px 11px !important;
    border-radius: 7px;
    color: #071a35 !important;
    font-size: .84rem !important;
    line-height: 1.25;
    text-decoration: none;
}

.nav-theme-menu a:hover,
.nav-theme-menu a:focus-visible {
    background: #edf5fb;
}

.nav-theme-menu a::after {
    display: none;
}

.header-actions {
    gap: 10px;
}

.header-search-link {
    width: min(290px, 22vw);
    min-height: 42px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 0 15px;
    border: 1px solid rgba(255, 255, 255, .12);
    border-radius: 999px;
    background: rgba(255, 255, 255, .13);
    color: rgba(255, 255, 255, .8);
    font-size: .83rem;
    text-decoration: none;
}

.header-search-link svg {
    width: 19px;
    fill: none;
    stroke: currentColor;
    stroke-linecap: round;
    stroke-width: 1.8;
}

.site-header .place-control,
.site-header .round-action {
    border-color: transparent;
    background: transparent;
    color: #fff;
}

.site-header .place-control {
    padding-inline: 8px;
}

.site-header .profile-action {
    width: 42px;
    min-width: 42px;
    height: 42px;
    padding: 0;
    border: 1px solid rgba(255, 255, 255, .58);
    border-radius: 50%;
    background: transparent;
    color: #fff;
    opacity: .42;
    transition: opacity .16s ease, background-color .16s ease, border-color .16s ease, box-shadow .16s ease;
}

.site-header .profile-action svg {
    width: 20px;
    stroke-width: 1.55;
}

.site-header .profile-action.is-authenticated {
    border-color: #fff;
    background: #fff;
    color: var(--ink);
    opacity: 1;
    box-shadow: 0 0 0 3px rgba(255, 255, 255, .16);
}

.site-header .profile-action.is-authenticated svg {
    stroke-width: 2.15;
}

.site-header .profile-action:hover,
.site-header .profile-action:focus-visible {
    border-color: #fff;
    background: rgba(255, 255, 255, .16);
    color: #fff;
    opacity: .82;
}

.site-header .profile-action.is-authenticated:hover,
.site-header .profile-action.is-authenticated:focus-visible {
    background: #eef7ff;
    color: var(--ink);
    opacity: 1;
}

.profile-menu-wrap {
    position: relative;
}

.profile-menu-popover {
    position: absolute;
    z-index: 80;
    top: calc(100% + 11px);
    right: 0;
    width: 150px;
    overflow: hidden;
    border: 1px solid rgba(7, 26, 53, .12);
    border-radius: 10px;
    background: #fff;
    box-shadow: 0 12px 30px rgba(0, 0, 0, .2);
}

.profile-menu-popover[hidden] {
    display: none;
}

.profile-menu-popover a,
.profile-menu-popover button {
    box-sizing: border-box;
    display: block;
    width: 100%;
    padding: 11px 14px;
    border: 0;
    background: #fff;
    color: var(--ink);
    font: inherit;
    font-size: .82rem;
    font-weight: 750;
    text-align: left;
    text-decoration: none;
    cursor: pointer;
}

.profile-menu-popover a:hover,
.profile-menu-popover a:focus-visible,
.profile-menu-popover button:hover,
.profile-menu-popover button:focus-visible {
    background: #edf6fd;
    color: var(--blue-dark);
}

.profile-menu-popover form {
    margin: 0;
    border-top: 1px solid rgba(7, 26, 53, .1);
}

.image-debug-trigger {
    width: 42px;
    height: 42px;
    display: inline-grid;
    place-items: center;
    padding: 0;
    border: 1px solid #ffc38d !important;
    border-radius: 50%;
    background: #f08a3c !important;
    color: #071a35 !important;
    box-shadow: 0 3px 10px rgba(0, 0, 0, .2);
    cursor: pointer;
}

.image-debug-trigger svg {
    width: 19px;
    fill: none;
    stroke: currentColor;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 1.7;
}

.public-stats-trigger {
    width: 42px;
    height: 42px;
    display: inline-grid;
    place-items: center;
    padding: 0;
    border: 1px solid rgba(255, 255, 255, .42) !important;
    border-radius: 50%;
    background: rgba(255, 255, 255, .12) !important;
    color: #fff !important;
    cursor: pointer;
}

.public-stats-trigger:hover,
.public-stats-trigger:focus-visible {
    background: rgba(255, 255, 255, .22) !important;
}

.public-stats-trigger svg {
    width: 20px;
    fill: none;
    stroke: currentColor;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 1.8;
}

.public-stats-dialog {
    width: min(1060px, calc(100vw - 28px));
    max-height: min(86vh, 920px);
    padding: 0;
    overflow: auto;
    border: 0;
    border-radius: 16px;
    background: #f5f8fa;
    color: #12243b;
    box-shadow: 0 24px 70px rgba(0, 0, 0, .42);
}

.public-stats-dialog::backdrop {
    background: rgba(3, 12, 24, .68);
    backdrop-filter: blur(3px);
}

.public-stats-head {
    position: sticky;
    top: 0;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding: 20px 24px;
    border-bottom: 1px solid #dce5eb;
    background: #fff;
}

.public-stats-head p,
.public-stats-head h2 {
    margin: 0;
}

.public-stats-head p {
    color: #e46619;
    font-size: .72rem;
    font-weight: 850;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.public-stats-head h2 {
    margin-top: 2px;
    font: 750 1.55rem/1.1 var(--serif);
}

.public-stats-close {
    width: 38px;
    height: 38px;
    border: 1px solid #d5e0e7;
    border-radius: 50%;
    background: #f7fafb;
    color: #12243b;
    font-size: 1.5rem;
    line-height: 1;
    cursor: pointer;
}

.public-stats-intro {
    margin: 0;
    padding: 17px 24px 0;
    color: #5d6d79;
    font-size: .9rem;
}

.public-stats-privacy {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 5px 14px;
    margin: 14px 24px 0;
    padding: 12px 14px;
    border: 1px solid #dce5eb;
    border-radius: 10px;
    background: #fff;
    color: #405463;
    font-size: .82rem;
}

.public-stats-privacy button {
    grid-row: 1 / span 2;
    grid-column: 2;
    padding: 8px 12px;
    border: 1px solid #c8d7df;
    border-radius: 999px;
    background: #eef5f7;
    color: #17344c;
    font-weight: 800;
    cursor: pointer;
}

.public-stats-privacy button.is-excluded {
    border-color: #a9c5ad;
    background: #e7f2e8;
    color: #315a2c;
}

.public-stats-privacy button:disabled {
    cursor: wait;
    opacity: .65;
}

.public-stats-privacy small {
    color: #71808b;
    font-size: .68rem;
}

.public-stats-now,
.public-stats-tops > section {
    margin: 18px 24px 0;
    overflow: hidden;
    border: 1px solid #dce5eb;
    border-radius: 12px;
    background: #fff;
}

.public-stats-tops {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
    padding-bottom: 24px;
}

.public-stats-tops > section {
    min-width: 0;
    margin-top: 18px;
}

.public-stats-tops > section:first-child {
    margin-right: 0;
}

.public-stats-tops > section:last-child {
    margin-left: 0;
}

.public-stats-section-head {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;
    padding: 13px 16px;
    border-bottom: 1px solid #e4ebef;
    background: #f9fbfc;
}

.public-stats-section-head h3 {
    margin: 0;
    font: 750 1rem/1.25 var(--serif);
}

.public-stats-section-head span {
    color: #71808b;
    font-size: .72rem;
}

.public-stats-list ol {
    margin: 0;
    padding: 0;
    list-style: none;
}

.public-stats-list li {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 14px;
    padding: 11px 15px;
    border-bottom: 1px solid #edf1f4;
}

.public-stats-list li:last-child {
    border-bottom: 0;
}

.public-stats-list li > span {
    min-width: 0;
    display: grid;
    gap: 2px;
}

.public-stats-list a {
    overflow: hidden;
    color: #102846;
    font-size: .87rem;
    font-weight: 750;
    text-decoration: none;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.public-stats-list a:hover,
.public-stats-list a:focus-visible {
    color: #d95d12;
    text-decoration: underline;
}

.public-stats-list small {
    color: #71808b;
    font-size: .7rem;
}

.public-stats-list strong {
    color: #315a2c;
    font-size: .75rem;
    white-space: nowrap;
}

.public-stats-empty {
    margin: 0;
    padding: 18px 16px;
    color: #71808b;
    font-size: .84rem;
}

.image-debug-dialog {
    width: min(1080px, calc(100vw - 28px));
    max-height: min(82vh, 900px);
    padding: 0;
    overflow: hidden;
    border: 0;
    border-radius: 14px;
    background: #f4f8fa;
    color: #12243b;
    box-shadow: 0 24px 70px rgba(0, 0, 0, .42);
}

.image-debug-dialog::backdrop {
    background: rgba(4, 16, 31, .62);
}

.image-debug-dialog-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    padding: 18px 22px;
    background: #071a35;
    color: #fff;
}

.image-debug-dialog-head p {
    margin: 0 0 2px;
    color: #f6a764;
    font-size: .7rem;
    font-weight: 800;
    letter-spacing: .1em;
    text-transform: uppercase;
}

.image-debug-dialog-head h2 {
    margin: 0;
    font-size: 1.25rem;
}

.image-debug-close {
    width: 34px;
    height: 34px;
    border: 1px solid rgba(255, 255, 255, .42);
    border-radius: 50%;
    background: transparent;
    color: #fff;
    cursor: pointer;
    font-size: 1.5rem;
    line-height: 1;
}

.image-debug-intro {
    margin: 0;
    padding: 14px 22px;
    border-bottom: 1px solid #d8e3e8;
    color: #526579;
    font-size: .84rem;
}

.image-debug-list {
    max-height: calc(min(82vh, 900px) - 130px);
    padding: 14px;
    overflow: auto;
}

.image-debug-queues {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    margin-bottom: 12px;
}

.image-debug-queue-card {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 8px 12px;
    padding: 12px;
    border: 1px solid #cddce3;
    border-radius: 10px;
    background: #fff;
}

.image-debug-queue-card span {
    display: block;
    color: #667b8d;
    font-size: .68rem;
    font-weight: 700;
}

.image-debug-queue-card h3 {
    margin: 2px 0 0;
    font-size: .88rem;
}

.image-debug-queue-card > strong {
    align-self: center;
    color: #0b5872;
    font-size: 1.75rem;
    line-height: 1;
}

.image-debug-queue-card dl {
    grid-column: 1 / -1;
    display: flex;
    flex-wrap: wrap;
    gap: 5px 12px;
    margin: 0;
    padding-top: 8px;
    border-top: 1px solid #e6edef;
    font-size: .7rem;
}

.image-debug-queue-card dl div {
    display: flex;
    gap: 4px;
}

.image-debug-queue-card dt {
    color: #65798a;
}

.image-debug-queue-card dd {
    margin: 0;
    color: #17364b;
    font-weight: 800;
}

.image-debug-queue-error {
    margin: 0 0 12px;
    padding: 9px 11px;
    border-radius: 8px;
    background: #fff2ef;
    color: #852e25;
    font-size: .78rem;
}

.image-debug-history-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    margin-bottom: 12px;
}

.image-debug-history {
    border: 1px solid #d5e0e5;
    border-radius: 10px;
    background: #fff;
    overflow: hidden;
}

.image-debug-history > header {
    padding: 10px 12px;
    border-bottom: 1px solid #e4ebee;
    background: #f8fbfc;
}

.image-debug-history header span {
    display: block;
    color: #64778a;
    font-size: .68rem;
    font-weight: 750;
}

.image-debug-history h3 {
    margin: 2px 0 0;
    font-size: .88rem;
}

.image-debug-history ol {
    max-height: 260px;
    margin: 0;
    padding: 0;
    overflow: auto;
    list-style: none;
}

.image-debug-history li {
    display: grid;
    grid-template-columns: 82px minmax(0, 1fr);
    gap: 2px 9px;
    padding: 8px 11px;
    border-bottom: 1px solid #edf1f3;
    box-shadow: inset 3px 0 #4f9b69;
    font-size: .72rem;
}

.image-debug-history li:last-child {
    border-bottom: 0;
}

.image-debug-history li.failed {
    box-shadow: inset 3px 0 #c34d3f;
}

.image-debug-history li.queued {
    box-shadow: inset 3px 0 #d4a62a;
}

.image-debug-history time {
    grid-row: 1 / span 2;
    color: #65798a;
    font-variant-numeric: tabular-nums;
}

.image-debug-history strong {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.image-debug-history li span,
.image-debug-history small {
    color: #51687a;
}

.image-debug-history small {
    grid-column: 2;
}

.image-debug-history > p {
    margin: 0;
    padding: 13px;
    color: #65798a;
    font-size: .75rem;
}

.image-debug-item {
    margin: 0 0 12px;
    border: 1px solid #d5e0e5;
    border-radius: 10px;
    background: #fff;
    overflow: hidden;
}

.image-debug-item:last-child {
    margin-bottom: 0;
}

.image-debug-item header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    padding: 12px 15px;
    border-bottom: 1px solid #e4ebee;
}

.image-debug-item header span {
    display: block;
    margin-bottom: 3px;
    color: #64778a;
    font-size: .72rem;
    font-weight: 750;
}

.image-debug-item h3 {
    margin: 0;
    font-size: .95rem;
    line-height: 1.25;
}

.image-debug-item header b {
    flex: 0 0 auto;
    padding: 4px 7px;
    border-radius: 999px;
    font-size: .7rem;
}

.image-debug-item header b.ok {
    background: #e1f4e7;
    color: #17653a;
}

.image-debug-item header b.blocked {
    background: #fbe5e2;
    color: #a22e24;
}

.image-debug-item dl {
    display: grid;
    grid-template-columns: 145px minmax(0, 1fr);
    gap: 0;
    margin: 0;
    font-size: .79rem;
    line-height: 1.38;
}

.image-debug-item dt,
.image-debug-item dd {
    margin: 0;
    padding: 8px 12px;
    border-bottom: 1px solid #edf1f3;
}

.image-debug-item dl > div {
    display: contents;
}

.image-debug-item dl > div:last-child dt,
.image-debug-item dl > div:last-child dd {
    border-bottom: 0;
}

.image-debug-item dt {
    background: #f6f9fa;
    color: #526579;
    font-weight: 750;
}

.image-debug-item dd {
    overflow-wrap: anywhere;
}

.image-debug-priority {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    padding: 10px 15px;
    border-bottom: 1px solid #e4ebee;
    background: #f8fbfc;
}

.image-debug-priority > span {
    display: inline-flex;
    align-items: center;
    min-height: 30px;
    padding: 5px 8px;
    border: 1px solid #d6e1e5;
    border-radius: 6px;
    color: #607385;
    font-size: .73rem;
}

.image-debug-queue {
    margin: 0 0 12px;
    padding: 9px 11px;
    border-radius: 8px;
    background: #eef4f6;
    color: #314a5f;
    font-size: .82rem;
}

.image-debug-action {
    margin: 0;
    padding: 5px 8px;
    border: 1px solid #b76527;
    border-radius: 6px;
    background: #f08a3c;
    color: #071a35;
    font: inherit;
    font-size: .78rem;
    font-weight: 750;
    cursor: pointer;
}

.image-debug-action:disabled {
    opacity: .72;
    cursor: progress;
}

.image-debug-last-error dt,
.image-debug-last-error dd {
    background: #fff2ef;
    color: #852e25;
}

.image-debug-last-error span {
    font-weight: 750;
}

@media (max-width: 620px) {
    .image-debug-trigger,
    .public-stats-trigger {
        width: 34px;
        height: 34px;
    }

    .public-stats-head,
    .public-stats-intro,
    .public-stats-privacy {
        padding-right: 16px;
        padding-left: 16px;
    }

    .public-stats-privacy {
        grid-template-columns: 1fr;
        margin-right: 12px;
        margin-left: 12px;
    }

    .public-stats-privacy button {
        grid-row: auto;
        grid-column: auto;
        justify-self: start;
    }

    .public-stats-now {
        margin-right: 12px;
        margin-left: 12px;
    }

    .public-stats-tops {
        grid-template-columns: 1fr;
        gap: 0;
    }

    .public-stats-tops > section {
        margin-right: 12px !important;
        margin-left: 12px !important;
    }

    .image-debug-dialog-head,
    .image-debug-intro {
        padding-right: 16px;
        padding-left: 16px;
    }

    .image-debug-list {
        padding: 10px;
    }

    .image-debug-queues {
        grid-template-columns: 1fr;
    }

    .image-debug-history-grid {
        grid-template-columns: 1fr;
    }

    .image-debug-priority {
        display: grid;
        padding: 9px 11px;
    }

    .image-debug-priority > * {
        width: 100%;
    }

    .image-debug-item dl {
        grid-template-columns: 1fr;
    }

    .image-debug-item dt {
        padding-bottom: 2px;
        border-bottom: 0;
    }

    .image-debug-item dd {
        padding-top: 2px;
    }
}

main {
    overflow: hidden;
}

.personal-hub {
    position: relative;
    display: grid;
    grid-template-columns: minmax(245px, .82fr) minmax(330px, 1.18fr);
    align-items: center;
    gap: 18px 34px;
    min-height: 190px;
    margin-top: 18px;
    padding: 26px 34px 20px;
    overflow: hidden;
    border: 1px solid #cfdfea;
    border-radius: 11px;
    background: linear-gradient(105deg, #f1f7fc 0%, #edf5fb 62%, #e3f0f9 100%);
}

.personal-hub-copy,
.personal-search,
.interest-filters,
.personal-edit-link {
    position: relative;
    z-index: 2;
}

.personal-hub-copy h1 {
    margin: 0;
    font-size: clamp(1.55rem, 2.4vw, 2.2rem);
    line-height: 1.05;
}

.personal-hub-copy h1 span {
    display: inline-block;
    margin-left: 4px;
    font-size: .85em;
}

.personal-hub-copy p {
    max-width: 420px;
    margin: 9px 0 0;
    color: #41566a;
    font-size: .93rem;
}

.personal-search {
    min-height: 52px;
    grid-template-columns: minmax(0, 1fr) 52px;
    padding-left: 18px;
    border-radius: 16px;
    box-shadow: 0 8px 24px rgba(7, 21, 36, .11);
}

.personal-search button {
    min-width: 52px;
    display: grid;
    place-items: center;
    border-radius: 15px;
    background: #fff;
    color: #294b68;
}

.personal-search button:hover {
    background: #edf5fb;
}

.personal-search button svg {
    width: 22px;
    fill: none;
    stroke: currentColor;
    stroke-linecap: round;
    stroke-width: 1.8;
}

.interest-filters {
    grid-column: 1 / -1;
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
    padding-right: 130px;
}

.interest-filters a,
.story-filters a,
.calendar-filters a,
.calendar-filters button {
    min-height: 34px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 16px;
    border: 1px solid #ccd9e2;
    border-radius: 999px;
    background: rgba(255, 255, 255, .62);
    color: #20364c;
    font-size: .76rem;
    font-weight: 700;
    text-decoration: none;
}

.interest-filters a.active,
.story-filters a.active,
.calendar-filters .active {
    border-color: #071a35;
    background: #071a35;
    color: #fff;
}

.personal-edit-link {
    position: absolute;
    right: 22px;
    bottom: 14px;
    color: #164c7b;
    font-size: .74rem;
    font-weight: 750;
    text-decoration: none;
}

.personal-landscape {
    position: absolute;
    z-index: 1;
    right: -5px;
    bottom: 0;
    width: 355px;
    fill: none;
    stroke: #a9c8df;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 2;
    opacity: .55;
}

.pv-section {
    padding-top: 22px;
}

.pv-section-heading {
    min-height: 44px;
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 22px;
    margin-bottom: 12px;
}

.pv-section-heading > div:first-child {
    display: flex;
    align-items: baseline;
    gap: 18px;
}

.pv-section-heading h2 {
    margin: 0;
    font-size: clamp(1.45rem, 2.2vw, 2rem);
    line-height: 1.05;
}

.pv-section-heading p {
    margin: 0;
    color: var(--muted);
    font-size: .79rem;
}

.pv-section-heading > a {
    color: #113f65;
    font-size: .76rem;
    font-weight: 800;
    text-decoration: none;
    white-space: nowrap;
}

.lead-grid {
    grid-template-columns: minmax(0, 1.13fr) minmax(430px, 1fr);
    gap: 12px;
    padding-top: 0;
}

.hero-story {
    min-height: 360px;
    border-radius: 10px;
}

.hero-content {
    width: min(680px, 90%);
    padding: clamp(24px, 3.2vw, 44px);
}

.hero-content h1 {
    max-width: 660px;
    font-size: clamp(2rem, 3.2vw, 3.65rem);
}

.hero-content p {
    max-width: 620px;
    margin: 9px 0 16px;
    font-size: .94rem;
}

.hero-story .button {
    min-height: 38px;
    padding-inline: 14px;
    font-size: .75rem;
}

.now-side-stack {
    display: grid;
    grid-template-rows: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

.now-side-stack.has-third-highlight {
    grid-template-rows: repeat(3, minmax(0, 1fr));
}

.now-side-stack.has-four-highlights {
    grid-template-rows: repeat(4, minmax(0, 1fr));
}

.now-side-card {
    min-width: 0;
    display: grid;
    grid-template-columns: 92px minmax(0, 1fr);
    overflow: hidden;
    border: 1px solid #d8e0e4;
    border-radius: 10px;
    background: #fff;
    box-shadow: 0 5px 18px rgba(7, 21, 36, .045);
}

.now-side-card:has(.now-side-photo) {
    grid-template-columns: 92px minmax(0, 1fr) minmax(150px, 34%);
}

.now-side-card.story {
    grid-template-columns: minmax(0, 1fr);
}

.now-side-card.story:has(.now-side-photo) {
    grid-template-columns: minmax(0, 1fr) minmax(150px, 34%);
}

.now-side-card time {
    display: grid;
    align-content: center;
    justify-items: center;
    border-right: 1px solid #e1e6e8;
    color: #de6d28;
    text-transform: uppercase;
}

.now-side-card time strong {
    font-size: 2rem;
    line-height: .9;
}

.now-side-card time span {
    font-size: .76rem;
    font-weight: 850;
}

.now-side-copy {
    min-width: 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 18px 20px;
}

.now-side-copy > span {
    color: #bb5320;
    font-size: .65rem;
    font-weight: 850;
    letter-spacing: .07em;
    text-transform: uppercase;
}

.now-side-card.story .now-side-copy > span {
    color: #286b7a;
}

.now-side-copy h3 {
    margin: 5px 0;
    font-size: 1.06rem;
    line-height: 1.15;
}

.now-side-copy h3 a,
.story-card h3 a,
.latest-section h3 a,
.calendar-showcase h3 a,
.discovery-place-card h3 a {
    text-decoration: none;
}

.now-side-copy p {
    display: -webkit-box;
    margin: 0 0 8px;
    overflow: hidden;
    color: #4e606b;
    font-size: .76rem;
    line-height: 1.35;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.now-side-copy small {
    color: var(--muted);
    font-size: .68rem;
}

.now-side-photo {
    min-width: 0;
    aspect-ratio: 1;
    overflow: hidden;
}

.now-side-photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.recommended-section {
    padding-top: 24px;
}

.recommended-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
}

.story-card {
    min-width: 0;
    overflow: hidden;
    border: 1px solid #d9e1e4;
    border-radius: 10px;
    background: #fff;
    box-shadow: 0 7px 22px rgba(7, 21, 36, .045);
}

.story-card.without-image {
    border-top: 5px solid #8eb4c4;
    background:
        radial-gradient(circle at 85% 16%, rgba(130, 176, 196, .28), transparent 26%),
        linear-gradient(145deg, #f5fafc, #eaf3f6);
}

.story-card.without-image .story-card-copy {
    min-height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 28px;
}

.story-card-photo {
    display: block;
    overflow: hidden;
    aspect-ratio: 8 / 5;
    background: #dce6e7;
}

@media (min-width: 761px) {
    .recommended-grid .place-recommendation .story-card-photo {
        aspect-ratio: 8 / 5;
    }
}

.story-card-photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .25s ease;
}

.story-card:hover .story-card-photo img {
    transform: scale(1.025);
}

.story-card-copy {
    padding: 15px 18px 16px;
}

.story-card-copy h3 {
    margin: 8px 0 5px;
    font-size: 1.05rem;
    line-height: 1.18;
}

.story-card-copy p {
    display: -webkit-box;
    margin: 0 0 10px;
    overflow: hidden;
    color: #4d5d65;
    font-size: .79rem;
    line-height: 1.4;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.story-card-copy small {
    color: var(--muted);
    font-size: .68rem;
}

.latest-section {
    padding-top: 24px;
}

.latest-heading {
    align-items: center;
}

.latest-heading .story-filters {
    margin-right: auto;
}

.story-filters,
.calendar-filters {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 7px;
}

.story-filters a {
    min-height: 30px;
    padding-inline: 15px;
    border-color: transparent;
    background: transparent;
    font-size: .72rem;
}

.latest-layout {
    display: grid;
    grid-template-columns: minmax(0, 1.08fr) minmax(0, 1.9fr);
    gap: 14px;
}

.latest-lead {
    position: relative;
    min-height: 330px;
    overflow: hidden;
    border-radius: 10px;
    isolation: isolate;
    background: linear-gradient(135deg, #426977, #17374b);
    color: #fff;
}

.latest-lead > img {
    position: absolute;
    z-index: -2;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.latest-lead::after {
    content: "";
    position: absolute;
    z-index: -1;
    inset: 0;
    background: linear-gradient(0deg, rgba(2, 12, 22, .88), rgba(2, 12, 22, .02) 72%);
}

.latest-lead > .latest-lead-copy {
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    padding: 24px;
}

.latest-lead > .latest-lead-copy > span,
.latest-compact-card div > span {
    font-size: .64rem;
    font-weight: 850;
    letter-spacing: .07em;
    text-transform: uppercase;
}

.latest-lead h3 {
    margin: 7px 0;
    font-size: clamp(1.35rem, 2.1vw, 2.15rem);
    line-height: 1.08;
}

.latest-lead p {
    display: -webkit-box;
    margin: 0 0 8px;
    overflow: hidden;
    font-size: .84rem;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.latest-lead small {
    color: rgba(255, 255, 255, .78);
    font-size: .67rem;
}

.latest-lead.no-image-overlay {
    display: grid;
    grid-template-rows: auto auto;
    align-self: start;
    border: 1px solid #dbe2e5;
    background: #fff;
    color: var(--ink);
}

.latest-lead.no-image-overlay::after {
    content: none;
}

.latest-lead.no-image-overlay > .latest-lead-image {
    position: relative;
    width: 100%;
    min-height: 0;
    aspect-ratio: 1;
    overflow: hidden;
    background: #eef2f3;
}

.latest-lead.no-image-overlay > .latest-lead-image img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.latest-lead.no-image-overlay > .latest-lead-copy {
    position: static;
    min-width: 0;
    padding: 13px 18px 12px;
}

.latest-lead.no-image-overlay h3 {
    display: -webkit-box;
    margin: 4px 0 7px;
    overflow: hidden;
    font-size: 1.18rem;
    line-height: 1.1;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.latest-lead.no-image-overlay p {
    display: none;
}

.latest-lead.no-image-overlay small {
    color: var(--muted);
}

.latest-compact-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

.latest-compact-card {
    min-width: 0;
    display: grid;
    grid-template-columns: minmax(110px, 42%) minmax(0, 1fr);
    overflow: hidden;
    border: 1px solid #dbe2e5;
    border-radius: 9px;
    background: #fff;
}

.latest-compact-card > a {
    min-width: 0;
    aspect-ratio: 1;
    overflow: hidden;
}

.latest-compact-waiting {
    display: grid;
    align-content: center;
    justify-items: center;
    gap: 7px;
    padding: 12px;
    background: #fff6dc;
    color: #5e4912;
    text-align: center;
    text-decoration: none;
}

.latest-compact-waiting svg {
    width: 32px;
    fill: none;
    stroke: currentColor;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 1.5;
}

.latest-compact-waiting strong {
    font-size: .74rem;
    line-height: 1.15;
}

.latest-compact-waiting small {
    font-size: .61rem;
    line-height: 1.25;
}

.latest-compact-debug-assets {
    position: absolute;
    right: 5px;
    bottom: 5px;
    left: 5px;
    padding: 5px 7px;
    border-radius: 5px;
    background: rgba(7, 21, 36, .88);
    color: #fff;
    font-size: .58rem;
    line-height: 1.25;
}

.latest-compact-card img {
    width: 100%;
    height: 100%;
    min-height: 145px;
    object-fit: cover;
}

.latest-compact-card > div {
    align-self: center;
    min-width: 0;
    padding: 16px;
}

.latest-compact-card h3 {
    margin: 6px 0 12px;
    font-size: .93rem;
    line-height: 1.18;
}

.latest-compact-card small {
    color: var(--muted);
    font-size: .66rem;
}

.section-button {
    width: min(280px, 100%);
    min-height: 38px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 11px auto 0;
    border-radius: 6px;
    background: #071a35;
    color: #fff;
    font-size: .75rem;
    font-weight: 800;
    text-decoration: none;
}

.calendar-showcase {
    margin-top: 24px;
    padding-bottom: 24px;
    background: linear-gradient(90deg, #fff8ef, #fff1df 50%, #fff8ed);
    border-block: 1px solid #f1ddc3;
}

.calendar-heading {
    align-items: center;
}

.calendar-heading .calendar-filters {
    margin-right: auto;
}

.calendar-filters a,
.calendar-filters button {
    min-height: 30px;
    padding-inline: 15px;
    border-color: #ead8c1;
    background: rgba(255, 255, 255, .75);
    font-size: .69rem;
    cursor: pointer;
}

.calendar-filters .active {
    border-color: #e66c20;
    background: #e66c20;
    color: #fff;
}

.calendar-filters .is-default {
    border-color: #e66c20;
    box-shadow: inset 0 0 0 1px #e66c20;
    color: #b64a0b;
}

.calendar-cards {
    display: grid;
    grid-template-columns: minmax(390px, 2.35fr) minmax(0, 4fr);
    gap: 10px;
}

.calendar-primary-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-template-rows: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

.calendar-extra-grid {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 10px;
    margin-top: 10px;
}

.calendar-extra-grid .calendar-small-card {
    min-height: 83px;
}

.calendar-empty {
    margin-top: 10px;
    padding: 22px;
    border: 1px dashed #dfc7aa;
    border-radius: 9px;
    background: rgba(255, 255, 255, .72);
}

.calendar-empty h3,
.calendar-empty p {
    margin: 0;
}

.calendar-empty p {
    margin-top: 5px;
    color: var(--muted);
    font-size: .75rem;
}

.calendar-feature,
.calendar-small-card {
    min-width: 0;
    border: 1px solid #ebdfd0;
    border-radius: 9px;
    background: rgba(255, 255, 255, .95);
    box-shadow: 0 5px 16px rgba(112, 65, 22, .055);
}

.calendar-primary-grid .calendar-small-card.has-photo {
    grid-template-columns: 58px minmax(0, 1fr) 87px;
}

.calendar-small-photo {
    position: relative;
    width: 87px;
    height: 100%;
    aspect-ratio: 1;
    overflow: hidden;
}

.calendar-small-photo img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.calendar-feature {
    display: grid;
    grid-template-columns: 86px minmax(0, 1fr);
    overflow: hidden;
}

.calendar-feature:has(.calendar-feature-photo) {
    grid-template-columns: 86px minmax(0, 1fr) minmax(140px, 34%);
}

.calendar-feature time,
.calendar-small-card time {
    display: grid;
    align-content: center;
    justify-items: center;
    color: #e2661a;
    text-transform: uppercase;
}

.calendar-feature time {
    border-right: 1px solid #eee2d5;
}

.calendar-feature time strong,
.calendar-small-card time strong {
    font-size: 2rem;
    line-height: .9;
}

.calendar-feature time span,
.calendar-small-card time span {
    font-size: .7rem;
    font-weight: 900;
}

.calendar-feature > div {
    align-self: center;
    padding: 18px;
}

.calendar-feature small,
.calendar-small-card > small {
    color: var(--muted);
    font-size: .65rem;
}

.calendar-feature h3 {
    margin: 5px 0;
    font-size: 1rem;
}

.calendar-feature p {
    display: -webkit-box;
    margin: 0 0 8px;
    overflow: hidden;
    color: #53626a;
    font-size: .73rem;
    line-height: 1.35;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.calendar-feature > div > span,
.calendar-small-card > span {
    color: #5e6a70;
    font-size: .66rem;
}

.calendar-feature-photo {
    align-self: center;
    aspect-ratio: 1;
    overflow: hidden;
}

.calendar-feature-photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.calendar-small-card {
    display: grid;
    grid-template-columns: 58px minmax(0, 1fr);
    min-height: 0;
    overflow: hidden;
}

.calendar-small-card time {
    border-right: 1px solid #eee2d5;
    text-align: center;
}

.calendar-small-card time strong {
    font-size: 1.45rem;
}

.calendar-small-card time span {
    font-size: .58rem;
}

.calendar-small-copy {
    min-width: 0;
    align-self: center;
    padding: 9px 11px;
}

.calendar-small-copy > small,
.calendar-small-copy > span {
    display: block;
}

.calendar-small-copy > span {
    color: #5e6a70;
    font-size: .66rem;
}

.calendar-small-card h3 {
    display: -webkit-box;
    margin: 3px 0 5px;
    overflow: hidden;
    font-size: .82rem;
    line-height: 1.18;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.discovery-section {
    padding-top: 22px;
    padding-bottom: 24px;
}

.discovery-card-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
}

.discovery-place-card {
    position: relative;
    min-height: 0;
    aspect-ratio: 8 / 5;
    overflow: hidden;
    border-radius: 9px;
    isolation: isolate;
    background: #365e50;
    color: #fff;
}

.discovery-place-card::after {
    content: "";
    position: absolute;
    z-index: -1;
    inset: 0;
    background: linear-gradient(0deg, rgba(8, 19, 25, .88), rgba(8, 19, 25, .02) 72%);
}

.discovery-place-card > img {
    position: absolute;
    z-index: -2;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .25s ease;
}

.discovery-place-card:hover > img {
    transform: scale(1.025);
}

.discovery-place-card > div {
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    padding: 20px;
}

.discovery-place-card > div > span {
    font-size: .63rem;
    font-weight: 850;
    letter-spacing: .07em;
    text-transform: uppercase;
}

.discovery-place-card h3 {
    margin: 6px 0;
    font-size: 1.25rem;
}

.discovery-place-card p {
    display: -webkit-box;
    margin: 0 0 7px;
    overflow: hidden;
    font-size: .75rem;
    line-height: 1.35;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.discovery-place-card small {
    color: rgba(255, 255, 255, .8);
    font-size: .65rem;
}

.calm-cta {
    border-top: 1px solid #d8e9e6;
    background: linear-gradient(90deg, #edf8f6, #f8fbfb, #edf8f6);
}

.calm-cta-inner {
    min-height: 80px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
}

.calm-cta-inner > div {
    display: flex;
    align-items: center;
    gap: 15px;
}

.calm-cta-inner > div:first-child > span {
    font-size: 2rem;
}

.calm-cta-inner p {
    display: grid;
    gap: 2px;
    margin: 0;
}

.calm-cta-inner p small {
    color: #60716f;
}

.calm-cta-inner a {
    min-height: 38px;
    display: inline-flex;
    align-items: center;
    padding: 0 17px;
    border: 1px solid #b9d3cf;
    border-radius: 8px;
    color: #154f50;
    font-size: .75rem;
    font-weight: 800;
    text-decoration: none;
}

.calm-cta-inner a:first-child {
    border-color: #e66c20;
    background: #e66c20;
    color: #fff;
}

.site-footer {
    padding: 28px 0;
    background: #071a35;
    color: rgba(255, 255, 255, .78);
}

.footer-inner {
    display: grid;
    grid-template-columns: 1.3fr .7fr .7fr 1.2fr;
    align-items: start;
    gap: 46px;
}

.footer-brand {
    justify-self: start;
}

.footer-inner nav {
    display: grid;
    gap: 5px;
}

.footer-inner nav strong {
    margin-bottom: 3px;
    color: #fff;
    font-size: .75rem;
}

.footer-inner nav a {
    color: rgba(255, 255, 255, .72);
    font-size: .7rem;
    text-decoration: none;
}

.footer-inner > p {
    max-width: 290px;
    margin: 0;
    font-size: .72rem;
    line-height: 1.55;
}

@media (max-width: 1150px) {
    .header-main {
        grid-template-columns: 190px 1fr auto;
    }

    .header-search-link {
        display: none;
    }

    .lead-grid {
        grid-template-columns: minmax(0, 1.15fr) minmax(360px, .85fr);
    }

    .now-side-card:has(.now-side-photo),
    .now-side-card.story:has(.now-side-photo) {
        grid-template-columns: 80px minmax(0, 1fr);
    }

    .now-side-card.story:has(.now-side-photo) {
        grid-template-columns: minmax(0, 1fr);
    }

    .now-side-photo {
        display: none;
    }

    .calendar-cards {
        grid-template-columns: minmax(360px, 2fr) minmax(0, 3fr);
    }

    .calendar-extra-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 900px) {
    .site-header {
        position: relative;
    }

    .header-main {
        min-height: 64px;
        grid-template-columns: 1fr auto auto;
    }

    .brand-name {
        font-size: 1.25rem;
    }

    .brand img {
        width: 36px;
        height: 36px;
    }

    .menu-toggle {
        order: 3;
    }

    .site-header .menu-toggle span {
        background: #fff;
    }

    .main-nav {
        background: #071a35;
    }

    .main-nav a {
        padding: 12px 0;
    }

    .personal-hub {
        grid-template-columns: 1fr;
    }

    .personal-landscape {
        opacity: .28;
    }

    .interest-filters {
        padding-right: 0;
    }

    .lead-grid,
    .latest-layout {
        grid-template-columns: 1fr;
    }

    .hero-story {
        min-height: 390px;
    }

    .now-side-stack {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        grid-template-rows: none;
    }

    .recommended-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .story-card:last-child {
        grid-column: 1 / -1;
    }

    .latest-compact-card {
        min-height: 140px;
    }

    .calendar-cards {
        grid-template-columns: 1fr;
    }

    .calendar-primary-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .calendar-extra-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .discovery-card-grid {
        grid-template-columns: 1fr;
    }

    .discovery-place-card {
        min-height: 0;
    }

    .footer-inner {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 960px) {
    .nav-theme {
        width: 100%;
    }

    .nav-theme summary {
        padding: 12px 14px;
    }

    .nav-theme summary::after {
        display: none;
    }

    .nav-theme-menu {
        position: static;
        min-width: 0;
        margin: 0 0 4px;
        border-color: rgba(255, 255, 255, .16);
        border-radius: 8px;
        transform: none;
        box-shadow: none;
    }
}

@media (max-width: 680px) {
    .page-shell {
        width: min(100% - 24px, 1420px);
    }

    .header-main {
        grid-template-columns: minmax(0, 1fr) auto auto;
        gap: 8px;
    }

    .site-header .place-control {
        display: none;
    }

    .personal-hub {
        min-height: 0;
        margin-top: 10px;
        padding: 22px 18px 18px;
        gap: 15px;
    }

    .personal-hub-copy p {
        font-size: .82rem;
    }

    .personal-landscape {
        right: -120px;
        width: 330px;
    }

    .interest-filters {
        flex-wrap: nowrap;
        margin-inline: -18px;
        padding: 0 18px 4px;
        overflow-x: auto;
    }

    .interest-filters a {
        flex: 0 0 auto;
    }

    .personal-edit-link {
        position: static;
        justify-self: end;
    }

    .pv-section-heading {
        align-items: flex-start;
        flex-wrap: wrap;
    }

    .pv-section-heading > div:first-child {
        display: grid;
        gap: 5px;
    }

    .lead-grid {
        gap: 10px;
    }

    .hero-story {
        min-height: 420px;
    }

    .now-side-stack,
    .recommended-grid,
    .latest-compact-grid,
    .calendar-cards,
    .calendar-extra-grid {
        grid-template-columns: 1fr;
    }

    .now-side-card,
    .now-side-card:has(.now-side-photo) {
        grid-template-columns: 76px minmax(0, 1fr);
    }

    .now-side-card.story,
    .now-side-card.story:has(.now-side-photo) {
        grid-template-columns: 1fr;
    }

    .story-card:last-child {
        grid-column: auto;
    }

    .story-card-photo {
        aspect-ratio: 8 / 5;
    }

    .latest-lead {
        min-height: 390px;
    }

    .latest-compact-card {
        grid-template-columns: 130px minmax(0, 1fr);
    }

    .latest-compact-card img {
        min-height: 125px;
    }

    .story-filters,
    .calendar-filters {
        width: 100%;
        flex-wrap: nowrap;
        padding-bottom: 3px;
        overflow-x: auto;
    }

    .story-filters a,
    .calendar-filters a,
    .calendar-filters button {
        flex: 0 0 auto;
    }

    .calendar-feature,
    .calendar-feature:has(.calendar-feature-photo) {
        grid-template-columns: 72px minmax(0, 1fr);
    }

    .calendar-feature-photo {
        display: none;
    }

    .calendar-cards > .calendar-small-card:nth-of-type(n+4) {
        display: flex;
    }

    .calendar-primary-grid {
        grid-template-columns: 1fr;
        grid-template-rows: none;
    }

    .calm-cta-inner {
        align-items: stretch;
        flex-direction: column;
        padding-block: 20px;
    }

    .calm-cta-inner > div:last-child {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .calm-cta-inner a {
        justify-content: center;
    }

    .footer-inner {
        grid-template-columns: 1fr;
        gap: 24px;
    }
}

@media (prefers-reduced-motion: reduce) {
    html {
        scroll-behavior: auto;
    }

    *,
    *::before,
    *::after {
        transition-duration: .01ms !important;
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
    }
}

/* Mobile first actions: the same five destinations are always one thumb away. */
.mobile-bottom-nav,
.mobile-ask-pulsen {
    display: none;
}

.town-selector {
    position: relative;
    color: #fff;
}

.town-selector > summary {
    min-height: 46px;
    display: flex;
    align-items: center;
    gap: 7px;
    padding: 0 5px;
    list-style: none;
    color: #fff;
    font-size: .74rem;
    font-weight: 760;
    cursor: pointer;
}

.town-selector > summary::-webkit-details-marker { display: none; }
.town-selector > summary svg { width: 20px; fill: none; stroke: currentColor; stroke-width: 1.8; }
.town-selector > summary b { font-size: .8rem; transition: transform .18s ease; }
.town-selector[open] > summary b { transform: rotate(180deg); }

.town-selector-menu {
    position: absolute;
    z-index: 110;
    top: calc(100% + 7px);
    right: 0;
    width: min(330px, calc(100vw - 28px));
    padding: 16px;
    border: 1px solid #d7e1eb;
    border-radius: 12px;
    background: #fff;
    box-shadow: 0 18px 42px rgba(5, 24, 48, .28);
    color: #102a4c;
}

.town-selector-search label { display: block; margin-bottom: 6px; font-size: .69rem; font-weight: 800; }
.town-selector-search > div { display: grid; grid-template-columns: 1fr 38px; border: 1px solid #cfdbe6; border-radius: 8px; overflow: hidden; }
.town-selector-search input { min-width: 0; height: 38px; padding: 0 10px; border: 0; outline: 0; font: inherit; font-size: .76rem; }
.town-selector-search button { border: 0; background: #eef5fb; color: #173f68; font-size: 1.15rem; cursor: pointer; }
.town-selector-menu nav { display: grid; margin-top: 10px; }
.town-selector-menu nav a { display: flex!important; justify-content: space-between; gap: 12px; padding: 8px 7px!important; border-radius: 6px; color: #173754!important; font-size: .74rem!important; text-decoration: none; }
.town-selector-menu nav a:hover,.town-selector-menu nav a.active { background: #edf5fc; }
.town-selector-menu nav small { color: #65778a; font-size: .62rem; }
.town-selector-all,.town-selector-follow { display: block; padding: 9px 7px; color: #164f80!important; font-size: .7rem; font-weight: 800; text-decoration: none; }
.town-selector-all { border-top: 1px solid #e4ebf1; }
.town-selector-location { width: 100%; padding: 9px 7px; border: 0; border-top: 1px solid #e4ebf1; background: transparent; color: #173754; text-align: left; font: 750 .7rem/1.2 inherit; cursor: pointer; }
.town-selector-follow { color: #e66d1c!important; }
.town-selector-data { display: none; }

@media (max-width: 760px) {
    body {
        padding-bottom: calc(76px + env(safe-area-inset-bottom));
    }

    .mobile-bottom-nav {
        position: fixed;
        z-index: 90;
        right: 0;
        bottom: 0;
        left: 0;
        min-height: calc(65px + env(safe-area-inset-bottom));
        display: grid;
        grid-template-columns: repeat(5, minmax(0, 1fr));
        align-items: start;
        padding: 7px 5px calc(7px + env(safe-area-inset-bottom));
        border-top: 1px solid #d6e0ea;
        background: rgba(255, 255, 255, .97);
        box-shadow: 0 -7px 20px rgba(7, 26, 53, .12);
        backdrop-filter: blur(12px);
    }

    .mobile-bottom-nav a {
        display: grid;
        justify-items: center;
        gap: 3px;
        min-width: 0;
        padding: 2px 0;
        color: #51657b;
        font-size: .6rem;
        font-weight: 700;
        line-height: 1.15;
        text-decoration: none;
    }

    .mobile-bottom-nav svg {
        width: 22px;
        height: 22px;
        fill: none;
        stroke: currentColor;
        stroke-width: 1.8;
        stroke-linecap: round;
        stroke-linejoin: round;
    }

    .mobile-bottom-nav a.active {
        color: #e86e1c;
    }

    .mobile-bottom-nav a.active svg {
        filter: drop-shadow(0 2px 3px rgba(232, 110, 28, .2));
    }

    .mobile-ask-pulsen {
        position: fixed;
        z-index: 89;
        right: 16px;
        bottom: calc(79px + env(safe-area-inset-bottom));
        display: inline-flex;
        align-items: center;
        gap: 7px;
        min-height: 42px;
        padding: 0 14px;
        border-radius: 999px;
        background: #e86e1c;
        box-shadow: 0 8px 22px rgba(128, 54, 12, .32);
        color: #fff;
        font-size: .71rem;
        font-weight: 800;
        text-decoration: none;
    }

    .mobile-ask-pulsen svg {
        width: 18px;
        height: 18px;
        fill: none;
        stroke: currentColor;
        stroke-width: 2;
        stroke-linecap: round;
    }

    .town-selector > summary span { max-width: 82px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
    .town-selector-menu { position: fixed; top: 68px; right: 12px; }
}
/* Sagssider: vedvarende lokale forløb, tidslinjer og relationer. */
.front-case-section {
    margin-top: 22px;
    overflow: hidden;
    padding: 0;
    border: 1px solid #d7e0e4;
    border-radius: 13px;
    background: #fff;
    box-shadow: 0 9px 28px rgba(12, 43, 70, .055);
}

.front-case-top {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 24px;
    padding: 17px 28px 16px;
    border-bottom: 1px solid #dce4e7;
}

.front-case-heading > span {
    display: block;
    margin-bottom: 4px;
    color: #e85a2a;
    font-size: .65rem;
    font-weight: 850;
    letter-spacing: .14em;
    text-transform: uppercase;
}

.front-case-heading h2 {
    margin: 0;
    color: #092846;
    font: 800 clamp(1.28rem, 2vw, 1.75rem)/1.05 var(--serif);
}

.front-case-all {
    color: #0a2946;
    font-size: .72rem;
    font-weight: 850;
    text-decoration: none;
    white-space: nowrap;
}

.front-case-all span,
.front-case-open span {
    color: #ed5b2b;
}

.front-case-list {
    display: grid;
}

.front-case-row {
    --case-tone: #1d668f;
    display: grid;
    grid-template-columns: 54px minmax(0, 1.25fr) minmax(220px, .75fr) auto;
    align-items: center;
    gap: 22px;
    min-height: 84px;
    padding: 13px 28px;
    border-bottom: 1px solid #dce4e7;
}

.front-case-row.case-tone-green { --case-tone: #2c816c; }
.front-case-row.case-tone-yellow { --case-tone: #ca8a1c; }
.front-case-row.case-tone-red { --case-tone: #b9503f; }
.front-case-row.case-tone-neutral { --case-tone: #6f7f88; }

.front-case-progress {
    --case-progress: 0;
    position: relative;
    display: grid;
    width: 52px;
    height: 52px;
    flex: 0 0 52px;
    place-items: center;
    border-radius: 50%;
    background: conic-gradient(var(--case-tone) calc(var(--case-progress) * 1%), #e4eaed 0);
}

.front-case-progress::before {
    position: absolute;
    width: 42px;
    height: 42px;
    border-radius: inherit;
    background: #fff;
    content: "";
}

.front-case-progress span {
    position: relative;
    z-index: 1;
    color: #0b2947;
    font-size: .62rem;
    font-weight: 850;
}

.front-case-copy {
    min-width: 0;
}

.front-case-copy > small {
    display: block;
    margin-bottom: 4px;
    color: #667c8e;
    font-size: .59rem;
    font-weight: 750;
    letter-spacing: .115em;
    text-transform: uppercase;
}

.front-case-copy > small i {
    padding-inline: 4px;
    font-style: normal;
}

.front-case-copy h3 {
    margin: 0;
    color: #092846;
    font: 800 clamp(.96rem, 1.25vw, 1.14rem)/1.15 var(--serif);
}

.front-case-copy h3 a {
    color: inherit;
    text-decoration: none;
}

.front-case-copy h3 a:hover,
.front-case-open:hover,
.front-case-all:hover {
    text-decoration: underline;
    text-underline-offset: 3px;
}

.front-case-copy > p {
    display: flex;
    align-items: center;
    gap: 7px;
    margin: 5px 0 0;
    color: #344b5b;
    font-size: .7rem;
    font-weight: 750;
    line-height: 1.25;
}

.front-case-copy > p i {
    width: 6px;
    height: 6px;
    flex: 0 0 6px;
    border-radius: 50%;
    background: var(--case-tone);
}

.front-case-next {
    margin: 0;
    color: #657887;
    font-size: .67rem;
    line-height: 1.35;
    text-align: right;
}

.front-case-next span {
    color: #405766;
}

.front-case-open {
    color: #ed5b2b;
    font-size: .72rem;
    font-weight: 850;
    text-decoration: none;
    white-space: nowrap;
}

.front-case-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    min-height: 62px;
    padding: 10px 28px;
    background: #eef5f3;
}

.front-case-footer p {
    margin: 0;
    color: #526776;
    font-size: .7rem;
}

.front-case-footer strong {
    color: #0b2947;
}

.front-case-footer a {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    min-height: 38px;
    padding: 0 16px;
    border: 1px solid #0b3556;
    border-radius: 999px;
    color: #0b2947;
    font-size: .72rem;
    font-weight: 850;
    text-decoration: none;
    white-space: nowrap;
}

.front-case-footer a:hover {
    background: #0b3556;
    color: #fff;
}

.case-directory-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
}

.case-card {
    min-width: 0;
    display: flex;
    flex-direction: column;
    padding: 18px;
    border: 1px solid #d9e2e7;
    border-radius: 13px;
    background: rgba(255, 255, 255, .96);
    box-shadow: 0 5px 16px rgba(12, 43, 70, .05);
}

.case-card-large {
    padding: 22px;
}

.case-card-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 11px;
    color: #547083;
    font-size: .7rem;
    font-weight: 800;
    letter-spacing: .035em;
    text-transform: uppercase;
}

.case-status {
    display: inline-flex;
    align-items: center;
    width: max-content;
    max-width: 100%;
    padding: 5px 9px;
    border-radius: 999px;
    background: #e7f0f7;
    color: #174e76;
    font-size: .66rem;
    font-weight: 850;
    line-height: 1.15;
    letter-spacing: 0;
    text-transform: none;
}

.case-status.green { background: #e5f2dc; color: #315c2b; }
.case-status.yellow { background: #fff0bc; color: #76550a; }
.case-status.red { background: #fbe3df; color: #852f26; }
.case-status.neutral { background: #edf0f2; color: #45545f; }

.case-card h2 {
    margin: 0;
    color: #0b2947;
    font-size: clamp(1.02rem, 1.25vw, 1.22rem);
    line-height: 1.2;
}

.case-card h2 a {
    text-decoration: none;
}

.case-card h2 a:hover {
    color: var(--blue-dark);
    text-decoration: underline;
    text-underline-offset: 3px;
}

.case-card > p {
    margin: 8px 0 0;
    color: #4c5f6e;
    font-size: .78rem;
    line-height: 1.45;
}

.case-place {
    display: block;
    margin-top: 8px;
    color: #627483;
    font-size: .7rem;
}

.case-stage-track {
    --case-progress: 0%;
    position: relative;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(58px, 1fr));
    gap: 0;
    margin: auto 0 15px;
    padding-top: 21px;
}

.case-card .case-stage-track {
    margin-top: 18px;
}

.case-stage-line {
    position: absolute;
    top: 26px;
    right: 7%;
    left: 7%;
    height: 2px;
    background: linear-gradient(90deg, #75a85a 0 var(--case-progress), #d7dee2 var(--case-progress) 100%);
}

.case-stage {
    position: relative;
    z-index: 1;
    min-width: 0;
    display: grid;
    justify-items: center;
    gap: 7px;
    color: #75828a;
    text-align: center;
}

.case-stage i {
    width: 12px;
    height: 12px;
    border: 2px solid #c4cfd5;
    border-radius: 50%;
    background: #fff;
}

.case-stage.completed i {
    border-color: #75a85a;
    background: #75a85a;
}

.case-stage.current i {
    border: 3px solid #fff;
    background: #174e7b;
    box-shadow: 0 0 0 2px #174e7b;
}

.case-stage b {
    width: 100%;
    overflow: hidden;
    font-size: .6rem;
    font-weight: 700;
    line-height: 1.18;
    text-overflow: ellipsis;
}

.case-stage.completed b,
.case-stage.current b {
    color: #314553;
}

.case-stage small {
    color: #768793;
    font-size: .58rem;
}

.case-card-actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-top: auto;
}

.case-card-actions button,
.case-detail-heading aside button {
    min-height: 34px;
    padding: 0 13px;
    border: 1px solid #164d77;
    border-radius: 7px;
    background: #164d77;
    color: #fff;
    font: 800 .68rem/1 var(--sans);
    cursor: pointer;
}

[data-case-follow][aria-pressed="true"],
[data-project-follow][aria-pressed="true"] {
    border-color: #6e9b55;
    background: #edf5e8;
    color: #315c2b;
}

.case-card-actions a {
    color: #134d79;
    font-size: .7rem;
    font-weight: 800;
    text-decoration: none;
}

.case-index-hero,
.case-detail-hero {
    border-bottom: 1px solid #dae4e8;
    background:
        radial-gradient(circle at 84% 18%, rgba(113, 162, 84, .16), transparent 26%),
        linear-gradient(135deg, #f4f8f1 0%, #f8fbfc 55%, #edf5f8 100%);
}

.case-index-hero .page-shell {
    padding-block: clamp(42px, 6vw, 78px);
}

.case-kicker {
    margin: 0 0 8px;
    color: #5c813e;
    font-size: .72rem;
    font-weight: 850;
    letter-spacing: .09em;
    text-transform: uppercase;
}

.case-index-hero h1,
.case-detail-heading h1 {
    margin: 0;
    color: #0b2947;
    font-family: var(--serif);
    font-size: clamp(2.35rem, 5vw, 4.7rem);
    line-height: .98;
    letter-spacing: -.035em;
}

.case-index-hero .page-shell > p:not(.case-kicker) {
    max-width: 820px;
    margin: 20px 0 0;
    color: #405564;
    font-size: clamp(.98rem, 1.35vw, 1.16rem);
}

.case-principles {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 25px;
}

.case-principles span,
.case-filters a {
    padding: 8px 12px;
    border: 1px solid #cfdbdf;
    border-radius: 999px;
    background: rgba(255, 255, 255, .78);
    color: #315064;
    font-size: .7rem;
    font-weight: 750;
}

.case-directory {
    padding-bottom: 70px;
}

.case-filters {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 0 0 20px;
}

.case-filters a {
    text-decoration: none;
}

.case-filters a:hover,
.case-filters a.active {
    border-color: #174e7b;
    background: #174e7b;
    color: #fff;
}

.case-directory-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.case-empty,
.case-not-found {
    padding: clamp(32px, 6vw, 72px);
    border: 1px dashed #bdccd4;
    border-radius: 16px;
    background: #f7fafb;
    text-align: center;
}

.case-empty h2,
.case-not-found h1 {
    margin-top: 0;
    color: #123d62;
}

.case-not-found {
    margin-block: 10vh;
}

.case-detail-hero .page-shell {
    padding-block: 22px 36px;
}

.case-breadcrumb {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    margin-bottom: 28px;
    color: #637888;
    font-size: .7rem;
}

.case-breadcrumb a {
    color: #184f7a;
    text-decoration: none;
}

.case-detail-heading {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: start;
    gap: 42px;
}

.case-detail-heading h1 {
    max-width: 950px;
    font-size: clamp(2.15rem, 4.4vw, 4.3rem);
}

.case-detail-heading > div > p:last-child {
    max-width: 800px;
    margin: 18px 0 0;
    color: #405564;
    font-size: clamp(.95rem, 1.2vw, 1.1rem);
}

.case-detail-heading aside {
    min-width: 190px;
    display: grid;
    justify-items: end;
    gap: 12px;
    padding-top: 5px;
}

.case-detail-stages {
    margin: 34px 0 0;
    padding: 22px 8px 0;
    border-top: 1px solid rgba(48, 78, 95, .13);
}

.case-detail-stages .case-stage-line {
    top: 27px;
}

.case-detail-layout {
    display: grid;
    grid-template-columns: minmax(0, 1.75fr) minmax(300px, .75fr);
    gap: clamp(28px, 4vw, 64px);
    padding-block: clamp(38px, 6vw, 76px);
}

.case-detail-layout > article {
    min-width: 0;
}

.case-section-heading > p {
    margin: 0 0 4px;
    color: #6b8a50;
    font-size: .66rem;
    font-weight: 850;
    letter-spacing: .09em;
    text-transform: uppercase;
}

.case-section-heading h2 {
    margin: 0;
    color: #0d3153;
    font-family: var(--serif);
    font-size: clamp(1.65rem, 2.5vw, 2.45rem);
    line-height: 1.08;
}

.case-explanation-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    margin-top: 20px;
}

.case-explanation-grid section {
    padding: 20px;
    border: 1px solid #dbe4e8;
    border-radius: 12px;
    background: #fff;
}

.case-explanation-grid section:last-child:nth-child(odd) {
    grid-column: 1 / -1;
}

.case-explanation-grid h3,
.case-related h3 {
    margin: 0 0 8px;
    color: #174e77;
    font-size: .76rem;
    letter-spacing: .015em;
}

.case-explanation-grid p,
.case-related p {
    margin: 0;
    color: #425766;
    font-size: .82rem;
    line-height: 1.55;
}

.case-timeline {
    margin-top: 44px;
}

.case-timeline ol {
    position: relative;
    display: grid;
    gap: 0;
    margin: 23px 0 0;
    padding: 0;
    list-style: none;
}

.case-timeline ol::before {
    content: "";
    position: absolute;
    top: 9px;
    bottom: 9px;
    left: 118px;
    width: 2px;
    background: #dbe4e8;
}

.case-timeline li {
    position: relative;
    display: grid;
    grid-template-columns: 96px minmax(0, 1fr);
    gap: 38px;
    padding: 0 0 26px;
}

.case-timeline li::before {
    content: "";
    position: absolute;
    top: 7px;
    left: 113px;
    width: 12px;
    height: 12px;
    border: 3px solid #fff;
    border-radius: 50%;
    background: #6e9b55;
    box-shadow: 0 0 0 2px #6e9b55;
}

.case-timeline time {
    color: #637786;
    font-size: .7rem;
    font-weight: 750;
}

.case-timeline h3 {
    margin: 0;
    color: #123d62;
    font-size: 1rem;
}

.case-timeline li p {
    margin: 6px 0 0;
    color: #465b69;
    font-size: .82rem;
}

.case-timeline li a,
.case-timeline li small {
    display: inline-block;
    margin-top: 7px;
    color: #185b83;
    font-size: .68rem;
    font-weight: 750;
}

.case-related {
    align-self: start;
    padding: 24px;
    border: 1px solid #d9e3e7;
    border-radius: 15px;
    background: #f8faf9;
    box-shadow: 0 8px 25px rgba(15, 50, 78, .06);
}

.case-related .case-section-heading {
    margin-bottom: 22px;
}

.case-related .case-section-heading h2 {
    font-size: 1.55rem;
}

.case-related > section {
    padding: 18px 0;
    border-top: 1px solid #dce5e8;
}

.case-related > section > article + article {
    margin-top: 14px;
}

.case-related article a,
.case-related article strong,
.case-sources > a {
    display: inline-block;
    color: #123f65;
    font-size: .79rem;
    font-weight: 800;
    text-decoration-thickness: 1px;
    text-underline-offset: 3px;
}

.case-related article p {
    margin-top: 4px;
    font-size: .72rem;
}

.case-sources {
    border-top-color: #c9d9c1 !important;
}

.case-empty-inline {
    padding: 16px;
    border-radius: 9px;
    background: #eef4f5;
    color: #5a6e7a;
    font-size: .78rem;
}

/* Projekter samler parallelle sager. Sporene er grupper, ikke undersider. */
.case-model {
    display: flex;
    align-items: stretch;
    gap: 12px;
    max-width: 930px;
    margin-top: 28px;
}

.case-model > div {
    min-width: 0;
    flex: 1;
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 14px 16px;
    border: 1px solid #cfdbdf;
    border-radius: 12px;
    background: rgba(255,255,255,.82);
}

.case-model > div > b {
    flex: 0 0 30px;
    display: grid;
    place-items: center;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background: #174e7b;
    color: #fff;
    font-size: .72rem;
}

.case-model span,
.case-model strong { display: block; }
.case-model span { color: #5b6e7a; font-size: .68rem; line-height: 1.35; }
.case-model strong { margin-bottom: 2px; color: #123d62; font-size: .78rem; }
.case-model > i { align-self: center; color: #779161; font-style: normal; font-weight: 900; }

.project-directory { padding-bottom: 56px; }
.project-directory .pv-section-heading > div { max-width: 850px; }
.project-directory-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 18px; }
.project-card {
    min-width: 0;
    display: flex;
    flex-direction: column;
    padding: 24px;
    border: 1px solid #ccdce1;
    border-radius: 16px;
    background: #fff;
    box-shadow: 0 10px 30px rgba(12,43,70,.07);
}
.project-card h2 { margin: 0; color: #0b2947; font: 700 clamp(1.4rem,2vw,1.85rem)/1.12 var(--serif); }
.project-card h2 a { color: inherit; text-decoration: none; }
.project-card h2 a:hover { text-decoration: underline; text-underline-offset: 4px; }
.project-card > p { margin: 10px 0 0; color: #49606f; font-size: .82rem; line-height: 1.5; }
.project-card-now { margin: 20px 0 0; padding: 15px 16px; border-left: 4px solid #6e9b55; border-radius: 0 10px 10px 0; background: #f2f7ef; }
.project-card-now strong { color: #365e2d; font-size: .68rem; letter-spacing: .055em; text-transform: uppercase; }
.project-card-now p { margin: 5px 0 0; color: #3f545f; font-size: .77rem; line-height: 1.46; }
.project-card-stats { display: flex; flex-wrap: wrap; gap: 9px 18px; margin-top: 16px; color: #5d7280; font-size: .7rem; }
.project-card-stats b { color: #164d77; font-size: .82rem; }
.project-track-chips { display: flex; flex-wrap: wrap; gap: 6px; margin: 15px 0 20px; }
.project-track-chips span { padding: 5px 8px; border-radius: 999px; background: #edf2f4; color: #4a6170; font-size: .62rem; font-weight: 750; }
.project-card .case-card-actions { margin-top: auto; }
.case-list-band { border-block: 1px solid #dbe5e8; background: #f5f8f9; }
.case-project-path { margin-top: 12px !important; padding: 9px 11px; border-radius: 8px; background: #eef4f8; color: #496170 !important; font-size: .68rem !important; }
.case-project-path a { color: #124f79; font-weight: 800; }
.case-project-path span { margin-inline: 3px; color: #759064; }

.project-detail-hero {
    border-bottom: 1px solid #d7e2e6;
    background: radial-gradient(circle at 84% 18%,rgba(113,162,84,.16),transparent 28%),linear-gradient(135deg,#f4f8f1 0%,#f8fbfc 58%,#edf5f8 100%);
}
.project-detail-hero .page-shell { padding-block: 22px 30px; }
.project-detail-hero .case-detail-heading > div > p:last-child { max-width: 900px; }
.project-summary-stats { display: flex; flex-wrap: wrap; gap: 9px; margin-top: 30px; }
.project-summary-stats span { padding: 9px 13px; border: 1px solid #d1dee2; border-radius: 9px; background: rgba(255,255,255,.82); color: #526875; font-size: .7rem; }
.project-summary-stats b { margin-right: 4px; color: #124a73; font-size: .86rem; }
.project-tabs { position: sticky; z-index: 20; top: 0; border-bottom: 1px solid #d7e1e5; background: rgba(255,255,255,.95); backdrop-filter: blur(12px); }
.project-tabs .page-shell { display: flex; gap: 24px; overflow-x: auto; }
.project-tabs a { flex: 0 0 auto; padding: 14px 2px 12px; border-bottom: 3px solid transparent; color: #344e5e; font-size: .7rem; font-weight: 800; text-decoration: none; }
.project-tabs a:hover,.project-tabs a:focus { border-bottom-color: #174e7b; color: #174e7b; }
.project-overview { display: grid; grid-template-columns: minmax(0,1.25fr) minmax(330px,.75fr); gap: 18px; }
.project-now-panel { padding: clamp(24px,4vw,42px); border: 1px solid #cfdde1; border-radius: 16px; background: #fff; box-shadow: 0 10px 30px rgba(12,43,70,.06); }
.project-now-panel h2 { margin: 0; color: #0c3152; font: 700 clamp(1.6rem,3vw,2.6rem)/1.08 var(--serif); }
.project-now-panel > p:last-child { margin: 16px 0 0; color: #415866; font-size: .93rem; line-height: 1.62; }
.project-overview-cards { display: grid; gap: 12px; }
.project-overview-cards article { display: grid; grid-template-columns: 34px 1fr; gap: 13px; padding: 20px; border: 1px solid #d7e2e6; border-radius: 13px; background: #f8faf9; }
.project-overview-cards article > span { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 50%; background: #174e7b; color: #fff; font-weight: 900; }
.project-overview-cards h3 { margin: 0; color: #174e77; font-size: .82rem; }
.project-overview-cards p { margin: 7px 0 0; color: #4b606d; font-size: .77rem; line-height: 1.5; }
.project-track-band { border-block: 1px solid #dbe5e8; background: #f4f7f8; }
.project-track-list { display: grid; gap: 13px; }
.project-track-section { overflow: hidden; border: 1px solid #d6e1e5; border-radius: 14px; background: #fff; }
.project-track-section > header { display: flex; justify-content: space-between; gap: 18px; padding: 18px 20px; border-bottom: 1px solid #e2eaed; }
.project-track-section > header h3 { margin: 0; color: #0d3558; font-size: 1rem; }
.project-track-section > header p { margin: 4px 0 0; color: #637682; font-size: .71rem; }
.project-track-section > header > span { align-self: start; flex: 0 0 auto; padding: 5px 8px; border-radius: 999px; background: #edf3f5; color: #536b78; font-size: .62rem; font-weight: 800; }
.project-track-cases { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); }
.project-track-cases article { min-width: 0; display: grid; grid-template-columns: 1fr auto; gap: 14px; padding: 18px 20px; }
.project-track-cases article + article { border-left: 1px solid #e2eaed; }
.project-track-cases h4 { margin: 9px 0 0; font-size: .88rem; }
.project-track-cases h4 a { color: #123e64; text-decoration: none; }
.project-track-cases h4 a:hover { text-decoration: underline; text-underline-offset: 3px; }
.project-track-cases p { margin: 6px 0 0; color: #536875; font-size: .72rem; line-height: 1.45; }
.project-case-open { align-self: center; display: grid; place-items: center; width: 32px; height: 32px; border-radius: 50%; background: #edf3f6; color: #164d77; font-weight: 900; text-decoration: none; }
.project-track-empty { margin: 0; padding: 16px 20px; color: #71818a; font-size: .72rem; font-style: italic; }
.project-lane-list { overflow: hidden; border: 1px solid #d7e2e6; border-radius: 14px; background: #fff; }
.project-lane-list > article { display: grid; grid-template-columns: minmax(190px,.45fr) minmax(0,1.55fr); align-items: center; gap: 25px; padding: 16px 20px; }
.project-lane-list > article + article { border-top: 1px solid #e1e9ec; }
.project-lane-list > article > a { color: #123f65; font-size: .75rem; font-weight: 800; }
.project-lane-list .case-stage-track { margin: 0; padding-top: 20px; }
.project-no-stages { color: #7b8990; font-size: .7rem; }
.project-knowledge-band { border-block: 1px solid #dbe5e8; background: #f5f8f6; }
.project-knowledge-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 18px; }
.project-knowledge-grid > section { padding: 24px; border: 1px solid #d7e2e1; border-radius: 14px; background: #fff; }
.project-knowledge-grid article { padding: 14px 0; border-top: 1px solid #e2e9e9; }
.project-knowledge-grid article:first-of-type { margin-top: 18px; }
.project-knowledge-grid article a { color: #123f65; font-size: .8rem; font-weight: 800; }
.project-knowledge-grid article p { margin: 5px 0 0; color: #566b77; font-size: .72rem; line-height: 1.45; }
.project-update-layout { display: grid; grid-template-columns: minmax(0,1.6fr) minmax(300px,.7fr); gap: clamp(25px,4vw,55px); margin-top: 24px; }
.project-update-layout .case-timeline { margin-top: 0; }
.case-project-context { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; width: max-content; max-width: 100%; margin: -10px 0 18px; padding: 8px 11px; border-radius: 8px; background: #eaf2f6; color: #516a78; font-size: .68rem; }
.case-project-context a { color: #124e78; font-weight: 850; }
.case-project-context i { color: #78915f; font-style: normal; }
.case-project-context b { color: #405966; font-weight: 750; }
.case-project-aside { padding-top: 0 !important; border-top: 0 !important; }
.case-project-aside > a { font-size: .9rem !important; }
.case-project-aside p strong { color: #365e2d; }
.case-detail-tabs { position: static; }

/* Enkeltsager: redaktionel statusfortælling med følgepanel og tydeligt forløb. */
.case-detail-page {
    background: #f7f5ef;
}

.case-story-hero {
    border-bottom: 1px solid #dddeda;
    background: #f7f5ef;
}

.case-story-hero > .page-shell {
    padding-block: 30px clamp(46px, 6vw, 78px);
}

.case-story-back {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-bottom: 34px;
    color: #607584;
    font-size: .78rem;
    text-decoration: none;
}

.case-story-back:hover {
    color: #0b3556;
    text-decoration: underline;
    text-underline-offset: 3px;
}

.case-story-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(280px, 320px);
    align-items: start;
    gap: clamp(38px, 5vw, 72px);
}

.case-story-main {
    min-width: 0;
}

.case-story-meta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
}

.case-story-heading .case-kicker {
    margin: 0;
    color: #5f7889;
    font-size: .64rem;
    letter-spacing: .13em;
}

.case-story-status {
    --case-tone: #1d668f;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    max-width: 300px;
    padding: 7px 12px;
    border-radius: 999px;
    background: #e9f1f6;
    color: #3f5a6b;
    font-size: .64rem;
    font-weight: 750;
    line-height: 1.2;
}

.case-story-status.case-tone-green { --case-tone: #2c816c; background: #e5f2ed; }
.case-story-status.case-tone-yellow { --case-tone: #ca8a1c; background: #fff0d4; }
.case-story-status.case-tone-red { --case-tone: #b9503f; background: #f9e5e2; }
.case-story-status.case-tone-neutral { --case-tone: #6f7f88; background: #eceff1; }

.case-story-status i {
    width: 5px;
    height: 5px;
    flex: 0 0 5px;
    border-radius: 50%;
    background: var(--case-tone);
}

.case-story-heading h1 {
    max-width: 900px;
    margin: 25px 0 0;
    color: #082b49;
    font-family: var(--serif);
    font-size: clamp(2.45rem, 4.4vw, 4.65rem);
    font-weight: 800;
    letter-spacing: -.035em;
    line-height: .99;
}

.case-story-heading > p {
    max-width: 870px;
    margin: 20px 0 0;
    color: #385266;
    font: 500 clamp(1rem, 1.35vw, 1.2rem)/1.55 var(--serif);
}

.case-live-card {
    margin-top: 34px;
    padding: 27px 30px 29px;
    border-radius: 4px;
    background: #0b2f4b;
    color: #fff;
}

.case-live-card > p,
.case-story-progress > p {
    margin: 0 0 19px;
    color: #ff6a3b;
    font-size: .65rem;
    font-weight: 850;
    letter-spacing: .14em;
    text-transform: uppercase;
}

.case-live-card > div {
    display: grid;
    grid-template-columns: minmax(0, 1.45fr) minmax(220px, .75fr);
    gap: 30px;
}

.case-live-card section {
    min-width: 0;
}

.case-live-card section + section {
    padding-left: 30px;
    border-left: 1px solid rgba(255, 255, 255, .27);
}

.case-live-card small {
    display: block;
    margin-bottom: 10px;
    color: #a9cbe3;
    font-size: .62rem;
    font-weight: 750;
    letter-spacing: .105em;
    text-transform: uppercase;
}

.case-live-card h2,
.case-live-card h3 {
    margin: 0;
    color: #fff;
    font-family: var(--serif);
    line-height: 1.1;
}

.case-live-card h2 {
    font-size: clamp(1.42rem, 2.2vw, 2rem);
}

.case-live-card h3 {
    font-size: clamp(1.1rem, 1.55vw, 1.38rem);
}

.case-live-card section p {
    margin: 12px 0 0;
    color: #d7e5ee;
    font-size: .78rem;
    line-height: 1.5;
}

.case-follow-panel {
    position: sticky;
    top: 92px;
    padding: 32px 27px 26px;
    border-top: 4px solid #f15a32;
    background: #fff;
    box-shadow: 0 15px 34px rgba(26, 47, 62, .1);
}

.case-follow-panel > i {
    display: block;
    width: 18px;
    height: 18px;
    margin-bottom: 18px;
    border: 3px solid #fff;
    border-radius: 50%;
    background: #f15a32;
    box-shadow: 0 0 0 2px #f15a32;
}

.case-follow-panel h2 {
    margin: 0;
    color: #0a2d4b;
    font: 800 1.62rem/1.05 var(--serif);
}

.case-follow-panel > p {
    margin: 9px 0 15px;
    color: #657886;
    font-size: .76rem;
    line-height: 1.55;
}

.case-follow-panel > button {
    width: 100%;
    min-height: 46px;
    padding: 0 18px;
    border: 1px solid #f15a32;
    border-radius: 999px;
    background: #f15a32;
    color: #fff;
    font: 850 .78rem/1 var(--sans);
    cursor: pointer;
}

.case-follow-panel > button[aria-pressed="true"] {
    border-color: #2c816c;
    background: #2c816c;
    color: #fff;
}

.case-follow-panel > small {
    display: block;
    margin-top: 9px;
    color: #82919a;
    font-size: .66rem;
    text-align: center;
}

.case-follow-panel > div {
    margin-top: 25px;
    padding-top: 23px;
    border-top: 1px solid #dce3e6;
}

.case-follow-panel > div > span {
    display: block;
    margin-bottom: 7px;
    color: #6b7e8b;
    font-size: .59rem;
    font-weight: 750;
    letter-spacing: .115em;
    text-transform: uppercase;
}

.case-follow-panel > div > a {
    color: #0a2d4b;
    font: 800 1rem/1.2 var(--serif);
    text-decoration: none;
}

.case-follow-panel > div > a:hover {
    text-decoration: underline;
    text-underline-offset: 3px;
}

.case-follow-panel > div > p {
    margin: 6px 0 0;
    color: #657886;
    font-size: .68rem;
}

.case-story-progress {
    margin-top: 49px;
}

.case-story-progress > p {
    margin-bottom: 7px;
}

.case-story-progress > h2 {
    margin: 0;
    color: #082b49;
    font: 800 clamp(1.6rem, 2.6vw, 2.25rem)/1.1 var(--serif);
}

.case-story-stage-track {
    --case-progress: 0%;
    --case-stage-count: 4;
    position: relative;
    display: grid;
    grid-template-columns: repeat(var(--case-stage-count), minmax(0, 1fr));
    gap: 0;
    margin-top: 25px;
}

.case-story-stage-line {
    position: absolute;
    z-index: 0;
    top: 20px;
    right: calc(50% / var(--case-stage-count));
    left: calc(50% / var(--case-stage-count));
    height: 3px;
    background: linear-gradient(90deg, #2f8c73 0 var(--case-progress), #d5dfe3 var(--case-progress) 100%);
}

.case-story-stage {
    position: relative;
    z-index: 1;
    min-width: 0;
    padding-right: 14px;
}

.case-story-stage > i {
    display: grid;
    width: 42px;
    height: 42px;
    margin: 0 auto 13px;
    place-items: center;
    border: 2px solid #c7d3d9;
    border-radius: 50%;
    background: #f7f5ef;
    color: #092d4b;
    font: 850 .8rem/1 var(--sans);
    font-style: normal;
}

.case-story-stage.completed > i {
    border-color: #2f8c73;
    background: #2f8c73;
    color: #fff;
}

.case-story-stage.current > i {
    border: 4px solid #f8cdbf;
    background: #f15a32;
    color: #fff;
    box-shadow: 0 0 0 1px #f15a32;
}

.case-story-stage > small,
.case-story-stage > h3 {
    display: block;
    text-align: left;
}

.case-story-stage > small {
    margin-bottom: 7px;
    color: #78909e;
    font-size: .57rem;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.case-story-stage > h3 {
    margin: 0;
    color: #0b2d49;
    font: 800 .91rem/1.25 var(--serif);
}

.case-detail-page .case-detail-tabs {
    border-bottom: 1px solid #dce3e6;
    background: #fff;
}

.case-detail-page .case-detail-layout {
    background: #fff;
}

.case-story-content {
    padding-block: clamp(38px, 5vw, 64px) clamp(56px, 7vw, 88px);
}

.case-primary-answers,
.case-resource-library {
    max-width: calc(100% - 392px);
}

.case-primary-answers .case-section-heading {
    margin-bottom: 21px;
}

.case-answer-list {
    border-top: 1px solid #ccd6da;
}

.case-primary-answer,
.case-resource-library {
    border-bottom: 1px solid #ccd6da;
}

.case-primary-answer > summary,
.case-resource-library > summary {
    position: relative;
    padding: 19px 44px 19px 0;
    color: #0a2d4b;
    font: 800 1.08rem/1.25 var(--serif);
    cursor: pointer;
    list-style: none;
}

.case-primary-answer > summary::-webkit-details-marker,
.case-resource-library > summary::-webkit-details-marker {
    display: none;
}

.case-primary-answer > summary::after,
.case-resource-library > summary::after {
    position: absolute;
    top: 50%;
    right: 4px;
    color: #0a2d4b;
    font: 500 1rem/1 var(--sans);
    content: "+";
    transform: translateY(-50%);
}

.case-primary-answer[open] > summary::after,
.case-resource-library[open] > summary::after {
    content: "−";
}

.case-primary-answer > div {
    max-width: 820px;
    padding: 0 44px 20px 0;
}

.case-primary-answer > div p {
    margin: 0;
    color: #465d6c;
    font-size: .84rem;
    line-height: 1.6;
}

.case-primary-answer > div p + p {
    margin-top: 10px;
}

.case-primary-answer > div strong {
    color: #173d5c;
}

.case-resource-library {
    margin-top: 0;
}

.case-resource-library > summary {
    font-size: 1.12rem;
}

.case-resource-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
    padding: 4px 0 24px;
}

.case-resource-grid > section {
    min-width: 0;
    padding: 19px;
    border: 1px solid #d7e0e3;
    border-radius: 10px;
    background: rgba(255, 255, 255, .72);
}

.case-resource-grid h3 {
    margin: 0 0 12px;
    color: #0a2d4b;
    font-size: .72rem;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.case-resource-grid article + article {
    margin-top: 13px;
    padding-top: 13px;
    border-top: 1px solid #dce3e6;
}

.case-resource-grid article a,
.case-resource-grid article strong,
.case-resource-source > a {
    color: #124d75;
    font-size: .79rem;
    font-weight: 800;
    text-decoration-thickness: 1px;
    text-underline-offset: 3px;
}

.case-resource-grid article p,
.case-resource-source p {
    margin: 5px 0 0;
    color: #536977;
    font-size: .72rem;
    line-height: 1.5;
}

.case-resource-source > a {
    display: inline-block;
    margin-top: 12px;
}

@media (max-width: 1000px) {
    .front-case-row {
        grid-template-columns: 54px minmax(0, 1fr) auto;
        gap: 16px;
    }

    .front-case-next {
        display: none;
    }

    .case-detail-layout {
        grid-template-columns: 1fr;
    }

    .case-story-grid {
        grid-template-columns: 1fr;
    }

    .case-follow-panel {
        position: static;
    }

    .case-primary-answers,
    .case-resource-library {
        max-width: none;
    }

    .case-related {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 0 22px;
    }

    .case-related .case-section-heading,
    .case-related .case-empty-inline {
        grid-column: 1 / -1;
    }

    .project-overview,
    .project-update-layout { grid-template-columns: 1fr; }

    .project-update-layout .case-related { display: block; }
}

@media (max-width: 720px) {
    .front-case-section {
        width: calc(100% - 24px);
    }

    .front-case-top {
        padding: 15px 16px 14px;
    }

    .front-case-row {
        grid-template-columns: 46px minmax(0, 1fr) auto;
        gap: 12px;
        min-height: 78px;
        padding: 11px 16px;
    }

    .front-case-progress {
        width: 46px;
        height: 46px;
    }

    .front-case-progress::before {
        width: 37px;
        height: 37px;
    }

    .front-case-open {
        font-size: 0;
    }

    .front-case-open span {
        display: grid;
        width: 32px;
        height: 32px;
        place-items: center;
        border-radius: 50%;
        background: #ed5b2b;
        color: #fff;
        font-size: .92rem;
    }

    .front-case-footer {
        align-items: flex-start;
        padding: 12px 16px;
    }

    .front-case-footer p {
        max-width: 58%;
    }

    .case-directory-grid,
    .case-explanation-grid,
    .case-related {
        grid-template-columns: 1fr;
    }

    .project-directory-grid,
    .project-track-cases,
    .project-knowledge-grid { grid-template-columns: 1fr; }

    .case-model { display: grid; grid-template-columns: 1fr; }
    .case-model > i { display: none; }

    .project-track-cases article + article { border-top: 1px solid #e2eaed; border-left: 0; }
    .project-lane-list > article { grid-template-columns: 1fr; gap: 8px; }
    .project-tabs .page-shell { gap: 18px; }

    .case-explanation-grid section:last-child:nth-child(odd),
    .case-related .case-section-heading,
    .case-related .case-empty-inline {
        grid-column: auto;
    }

    .case-index-hero .page-shell {
        padding-block: 34px 40px;
    }

    .case-principles {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .case-principles span {
        display: flex;
        align-items: center;
        justify-content: center;
        min-height: 44px;
        padding: 7px 8px;
        text-align: center;
    }

    .case-detail-heading {
        grid-template-columns: 1fr;
        gap: 20px;
    }

    .case-detail-heading aside {
        min-width: 0;
        grid-template-columns: 1fr auto;
        align-items: center;
        justify-items: start;
    }

    .case-story-hero > .page-shell {
        width: calc(100% - 30px);
        padding-block: 22px 42px;
    }

    .case-story-back {
        margin-bottom: 26px;
    }

    .case-story-heading h1 {
        margin-top: 19px;
        font-size: clamp(2.15rem, 11vw, 3.15rem);
    }

    .case-story-meta {
        align-items: flex-start;
    }

    .case-live-card {
        padding: 23px 20px 24px;
    }

    .case-live-card > div {
        grid-template-columns: 1fr;
        gap: 22px;
    }

    .case-live-card section + section {
        padding: 21px 0 0;
        border-top: 1px solid rgba(255, 255, 255, .27);
        border-left: 0;
    }

    .case-story-progress {
        overflow-x: auto;
        margin-top: 38px;
        padding-bottom: 8px;
    }

    .case-story-stage-track {
        grid-template-columns: repeat(var(--case-stage-count), minmax(135px, 1fr));
        min-width: calc(var(--case-stage-count) * 135px);
    }

    .case-follow-panel {
        padding: 27px 22px 24px;
    }

    .case-story-content {
        width: calc(100% - 30px);
        padding-block: 32px 56px;
    }

    .case-resource-grid {
        grid-template-columns: 1fr;
    }

    .case-stage-track {
        overflow-x: auto;
        grid-template-columns: repeat(var(--case-stage-count, 5), minmax(78px, 1fr));
        padding-bottom: 8px;
    }

    .case-stage-line {
        right: 40px;
        left: 40px;
    }

    .case-timeline ol::before {
        left: 7px;
    }

    .case-timeline li {
        grid-template-columns: 1fr;
        gap: 6px;
        padding: 0 0 25px 32px;
    }

    .case-timeline li::before {
        left: 2px;
    }
}

.puls-video-badge {
    position: absolute;
    z-index: 6;
    top: .65rem;
    right: .65rem;
    display: inline-flex;
    align-items: center;
    gap: .28rem;
    width: max-content;
    padding: .32rem .55rem;
    border: 1px solid rgba(255, 255, 255, .48);
    border-radius: 999px;
    background: rgba(7, 26, 53, .94);
    color: #fff;
    box-shadow: 0 2px 8px rgba(7, 26, 53, .22);
    font: 700 .72rem/1 system-ui, sans-serif;
    letter-spacing: .025em;
    text-transform: uppercase;
    pointer-events: none;
}

.puls-video-badge svg {
    width: .9rem;
    height: .9rem;
    fill: currentColor;
}

.puls-video-badge.is-inline {
    position: static;
    margin: 0 0 .45rem;
    vertical-align: middle;
}

.result-image,
.now-side-photo,
.story-card-photo,
.latest-compact-card > a,
.calendar-feature-photo {
    position: relative;
}

.puls-video-thumb {
    position: relative;
}

/* Keep the Puls front page comfortably readable on phone-sized screens. */
@media (max-width: 680px) {
    body.puls-home {
        font-size: 16px;
    }

    .puls-home .personal-hub-copy p,
    .puls-home .pv-section-heading p,
    .puls-home .now-side-copy p,
    .puls-home .story-card-copy p,
    .puls-home .latest-lead p,
    .puls-home .calendar-feature p,
    .puls-home .case-card > p,
    .puls-home .discovery-place-card p {
        font-size: .94rem;
        line-height: 1.5;
    }

    .puls-home .hero-content p {
        font-size: 1rem;
        line-height: 1.5;
    }

    .puls-home .case-project-path {
        font-size: .8rem !important;
        line-height: 1.45;
    }

    .puls-home .now-side-copy small,
    .puls-home .story-card-copy small,
    .puls-home .latest-lead small,
    .puls-home .calendar-feature small,
    .puls-home .discovery-place-card small {
        font-size: .78rem;
        line-height: 1.4;
    }
}