/* Public website – Silberglück sign/bento design.
   Scoped to body.public-site. Blocks stay {{BLOCK:…}}; banners are bleed. */

.public-site {
    --bg: #f6f8f9;
    --card: #ffffff;
    --ink: #17232b;
    --mut: #5b6e79;
    --tint: #dfe9ee;
    --line: #c9d5db;
    --sign: #f2c233;
    --signink: #231b04;
    --pine: #2f5f50;
    --icecta: #17415c;
    --shadow: 0 10px 30px rgba(23, 35, 43, 0.10);
    --navy: var(--icecta);
    --copper: var(--sign);
    --paper: var(--card);
    --site-max: 1080px;
    --site-gutter: 22px;
    --site-section-gap: 2.5rem;
    --site-heading-gap: 1.25rem;
    --hero-height: 280px;
    --hero-ratio: 10 / 4;
    --radius: 14px;
    --header-height: 58px;
    --header-height-shrink: 58px;
    --logo-size: 110px;
    --logo-size-shrink: 46px;
    --logo-overlap: 8px;
    --logo-overlap-shrink: 0px;
    --logo-offset-x: 0px;
    --font-disp: "Avenir Next Condensed", "Arial Narrow", "Helvetica Neue", sans-serif;
    --font-sans: "Avenir Next", "Segoe UI", system-ui, sans-serif;
    background: var(--bg);
    color: var(--ink);
    font-family: var(--font-sans);
    line-height: 1.6;
}

@media (prefers-color-scheme: dark) {
    html:not([data-theme="light"]) .public-site {
        --bg: #0f171c;
        --card: #16222a;
        --ink: #e8eef1;
        --mut: #93a6b0;
        --tint: #1b2b34;
        --line: #2a3b45;
        --sign: #e8b92e;
        --signink: #231b04;
        --pine: #7fb8a4;
        --icecta: #bfdcee;
        --shadow: 0 10px 30px rgba(0, 0, 0, 0.35);
    }
}

html:has(body.public-site),
body.public-site {
    background: var(--bg);
    color: var(--ink);
    color-scheme: only light;
}

html:has(body.public-site):not([data-theme="light"]),
html:not([data-theme="light"]) body.public-site {
    color-scheme: light dark;
}

.public-site .disp {
    font-family: var(--font-disp);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.01em;
    line-height: 0.95;
}

.public-site h1,
.public-site h2,
.public-site h3,
.public-site h4 {
    font-family: var(--font-disp);
    color: var(--ink);
    letter-spacing: 0.01em;
}

.public-site .site-container {
    width: min(100%, var(--site-max));
    margin-inline: auto;
    padding-inline: var(--site-gutter);
    box-sizing: border-box;
}

.public-site .site-main {
    flex: 1 1 auto;
    padding: 0 0 var(--site-section-gap);
}

.public-site .site-main > * + * {
    margin-top: var(--site-section-gap);
}

.public-site .site-main > *:not(.site-block--bleed):not(.hero) {
    width: min(100%, var(--site-max));
    margin-inline: auto;
    padding-inline: var(--site-gutter);
    box-sizing: border-box;
}

.public-site .site-main > .site-block--bleed,
.public-site .site-main > .hero {
    width: 100%;
    max-width: none;
    margin-inline: 0;
    padding-inline: 0;
}

.public-site .site-main > .site-block--bleed:first-child,
.public-site .site-main > .hero:first-child {
    margin-top: 0;
}

.public-site .site-block,
.public-site .block-wrapper {
    min-width: 0;
    margin: 0;
}

.public-site .site-main:has(.site-block--cols-2) {
    display: grid;
    grid-template-columns: 1fr 1fr;
    column-gap: 1.5rem;
    row-gap: var(--site-section-gap);
    width: min(100%, var(--site-max));
    margin-inline: auto;
    padding-inline: var(--site-gutter);
    box-sizing: border-box;
}

.public-site .site-main:has(.site-block--cols-2) > * + * {
    margin-top: 0;
}

.public-site .site-main:has(.site-block--cols-2) > *:not(.site-block--cols-2) {
    grid-column: 1 / -1;
}

.public-site .site-main:has(.site-block--cols-2) > *:not(.site-block--bleed):not(.hero) {
    width: auto;
    max-width: none;
    margin-inline: 0;
    padding-inline: 0;
}

.public-site .site-main:has(.site-block--cols-2) > .site-block--bleed,
.public-site .site-main:has(.site-block--cols-2) > .hero {
    width: 100vw;
    max-width: none;
    margin-inline: calc(50% - 50vw);
    padding-inline: 0;
}

.public-site h2,
.public-site h3,
.public-site .block-wrapper-heading,
.public-site .highlight-cards-title {
    margin-block: 0;
}

.public-site .content h2,
.public-site .content h3,
.public-site .block-textcard .content > h2,
.public-site .block-textcard .content > h3,
.public-site .block-picturerow .content > h2,
.public-site .block-picturerow .content > h3 {
    margin-block: var(--site-heading-gap);
}

.public-site .block-wrapper-intro {
    color: var(--mut);
    /* Frueher auf 52ch begrenzt - der Text stand dadurch nur in der linken
       Haelfte, waehrend der Block darunter die volle Breite nutzte. */
    margin: 0 0 var(--site-heading-gap);
}

/* ----- Signpost headings ------------------------------------------- */

.public-site .signhead {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-block: var(--site-heading-gap);
}

.public-site .signpost,
.public-site h2.signpost,
.public-site .block-wrapper-heading.signpost,
.public-site .highlight-cards-title.signpost {
    position: relative;
    display: inline-block;
    margin: 0;
    padding: 8px 10px 8px 16px;
    background: var(--sign);
    color: var(--signink);
    font-family: var(--font-disp);
    font-weight: 700;
    font-size: 18px;
    line-height: 1.2;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    border-radius: 3px 0 0 3px;
    box-shadow: var(--shadow);
}

.public-site .signpost::after,
.public-site h2.signpost::after,
.public-site .block-wrapper-heading.signpost::after,
.public-site .highlight-cards-title.signpost::after {
    content: "";
    position: absolute;
    right: -16px;
    top: 0;
    border-top: 19px solid transparent;
    border-bottom: 19px solid transparent;
    border-left: 16px solid var(--sign);
}

.public-site .signhead-rule {
    flex: 1;
    height: 1px;
    margin-left: 22px;
    background: var(--line);
}

/* ----- Header ------------------------------------------------------ */

body.public-site .site-header,
body.public-site .site-header .navbar,
body.public-site .site-header .navbar-menu {
    background: color-mix(in srgb, var(--bg) 82%, transparent);
    color: var(--ink);
}

.public-site .site-header {
    position: sticky;
    top: 0;
    z-index: 1100;
    overflow: visible;
    border-bottom: 1px solid var(--line);
    box-shadow: none;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
}

.public-site .navbar {
    height: var(--header-height);
    min-height: var(--header-height);
    max-height: var(--header-height);
    padding: 0;
    overflow: visible;
}

.public-site .navbar .site-container {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    height: var(--header-height);
    min-height: var(--header-height);
    max-height: var(--header-height);
    overflow: visible;
}

.public-site .navbar-brand {
    flex: 0 1 auto;
    min-width: 0;
    height: var(--header-height);
    min-height: var(--header-height);
    max-height: var(--header-height);
    align-items: center;
    overflow: visible;
}

.public-site .navbar-menu {
    flex: 1 1 auto;
    height: var(--header-height);
    min-height: var(--header-height);
    max-height: var(--header-height);
    align-items: center;
    justify-content: flex-end;
    overflow: visible;
}

@media (min-width: 1024px) {
    .public-site .navbar-menu {
        display: flex;
    }
}

.public-site .site-header.is-shrink .navbar,
.public-site .site-header.is-shrink .navbar .site-container,
.public-site .site-header.is-shrink .navbar-brand,
.public-site .site-header.is-shrink .navbar-menu {
    height: var(--header-height);
    min-height: var(--header-height);
    max-height: var(--header-height);
}

body.public-site .site-header a,
body.public-site .site-header .navbar-item,
body.public-site .site-header .navbar-link {
    color: var(--ink);
    margin-right: 0;
}

.public-site .navbar-item:hover,
.public-site .navbar-link:hover {
    background: transparent;
    color: var(--pine);
}

.public-site .navbar-end > a.navbar-item {
    font-weight: 500;
    font-size: 14.5px;
    position: relative;
    background: transparent;
}

.public-site .navbar-end > a.navbar-item.is-active {
    background: transparent;
    color: var(--pine);
}

.public-site .navbar-burger {
    margin-left: auto;
    color: var(--ink);
}

.public-site .navbar-burger span {
    background-color: currentColor;
}

.public-site .navbar-item.brand,
.public-site .brand {
    gap: 12px;
    padding: 0;
    overflow: visible;
    align-items: center;
    height: var(--header-height);
    min-height: var(--header-height);
    max-height: var(--header-height);
}

.public-site .brand-logo,
.public-site .navbar-item img.brand-logo {
    height: var(--logo-size-shrink);
    width: auto;
    max-height: calc(var(--header-height) - 10px);
    margin: 0;
    position: relative;
    z-index: 2;
    transform: none;
    filter: none;
    cursor: pointer;
    transition: height 0.2s ease, margin 0.2s ease, filter 0.2s ease;
}

.public-site .site-header.has-logo-overlap .navbar-item.brand,
.public-site .site-header.has-logo-overlap .brand {
    align-items: flex-start;
}

.public-site .site-header.has-logo-overlap .brand-logo,
.public-site .site-header.has-logo-overlap .navbar-item img.brand-logo {
    height: var(--logo-size);
    max-height: none;
    margin: var(--logo-overlap) 0 calc(var(--header-height) - var(--logo-size) - var(--logo-overlap));
    filter: drop-shadow(0 8px 16px rgba(23, 35, 43, 0.28));
}

.public-site .site-header.has-logo-overlap.is-shrink .navbar-item.brand,
.public-site .site-header.has-logo-overlap.is-shrink .brand {
    align-items: center;
}

.public-site .site-header.has-logo-overlap.is-shrink .brand-logo,
.public-site .site-header.has-logo-overlap.is-shrink .navbar-item img.brand-logo {
    height: var(--logo-size-shrink);
    max-height: calc(var(--header-height) - 10px);
    margin: 0;
    filter: none;
}

.public-site .brand-copy {
    padding-left: 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-self: center;
    min-height: var(--header-height);
    line-height: 1;
}

.public-site .brand-text.disp {
    font-size: 18px;
    letter-spacing: 0.04em;
    color: var(--ink);
}

.public-site .brand-sub {
    font-size: 11px;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: var(--mut);
    display: block;
}

.public-site .lang-pill {
    border: 1px solid var(--line);
    background: transparent;
    color: var(--ink);
    font-size: 12px;
    font-weight: 600;
}

body.public-site .lang-pill a,
body.public-site .lang-pill a[aria-current="true"] {
    color: var(--ink);
}

.public-site .lang-pill a[aria-current="true"] {
    font-weight: 700;
}

.public-site .site-header-cta,
.public-site a.button.is-primary:not(.is-outlined),
.public-site button.button.is-primary:not(.is-outlined),
.public-site .button.is-primary:not(.is-outlined) {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: auto;
    min-height: 0;
    padding: 9px 18px;
    border: 0;
    border-radius: 999px;
    background: var(--sign);
    background-color: var(--sign);
    border-color: var(--sign);
    color: var(--signink) !important;
    font-family: var(--font-sans);
    font-size: 14.5px;
    font-weight: 700;
    line-height: 1.2;
    text-decoration: none;
    box-shadow: var(--shadow);
}

.public-site .site-header-cta:hover,
.public-site a.button.is-primary:not(.is-outlined):hover,
.public-site button.button.is-primary:not(.is-outlined):hover,
.public-site .button.is-primary:not(.is-outlined):hover,
.public-site .site-header-cta:focus,
.public-site .button.is-primary:not(.is-outlined):focus {
    filter: brightness(1.05);
    background: var(--sign);
    background-color: var(--sign);
    border-color: var(--sign);
    color: var(--signink) !important;
    box-shadow: var(--shadow);
}

/* ----- Hero -------------------------------------------------------- */

.public-site .hero.hero-snow {
    margin: 0;
    border-radius: 0;
    box-shadow: none;
    width: 100%;
    max-width: none;
    aspect-ratio: auto;
    height: min(calc(100vw * 4 / 10), 600px);
    min-height: 260px !important;
    max-height: 600px;
    background: #0e161c;
}

.public-site .hero.hero-snow.hero-small {
    padding: 0;
    aspect-ratio: auto;
}

.public-site .hero.hero-snow[data-banner-height="s"] {
    height: var(--hero-height);
    min-height: var(--hero-height) !important;
    max-height: var(--hero-height);
}

.public-site .hero.hero-snow[data-banner-height="m"] {
    height: 400px;
    min-height: 360px !important;
    max-height: 400px;
}

.public-site .hero.hero-snow[data-banner-height="l"] {
    height: min(calc(100vw * 4 / 10), 600px);
    min-height: 260px !important;
    max-height: 600px;
}

.public-site .hero-bg {
    background: none;
    overflow: hidden;
}

.public-site .hero-bg-blur,
.public-site .hero-bg-photo {
    position: absolute;
    inset: 0;
}

.public-site .hero-bg-blur {
    inset: 0;
    background-size: 100% 100%;
    background-position: center;
    filter: blur(22px) saturate(1.05);
}

.public-site .hero-bg-photo {
    background-size: min(1200px, 100%) auto;
    background-position: center;
    background-repeat: no-repeat;
}

.public-site .hero-content[hidden],
.public-site .hero-bg[hidden] {
    display: none !important;
}

.public-site .hero-season {
    position: absolute;
    top: 16px;
    right: var(--site-gutter);
    z-index: 3;
    display: flex;
    border-radius: 999px;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.5);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
}

.public-site .hero-season button {
    border: 0;
    padding: 8px 16px;
    font: 600 13px var(--font-sans);
    letter-spacing: 0.06em;
    text-transform: uppercase;
    cursor: pointer;
    background: rgba(20, 30, 38, 0.45);
    color: #fff;
}

.public-site .hero-season button.on {
    background: var(--sign);
    color: var(--signink);
}

/* Apartment switcher: same segmented pill as .hero-season */
.public-site .apt-switcher .map-apt-badges {
    display: flex;
    flex-wrap: nowrap;
    align-items: stretch;
    gap: 0;
    margin: 0;
    padding: 0;
    border: 1px solid rgba(255, 255, 255, 0.5);
    border-radius: 999px;
    overflow: hidden;
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
}

.public-site .apt-switcher .map-apt-badge,
.public-site .apt-switcher a.map-apt-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 0;
    border-radius: 0;
    padding: 8px 16px;
    font: 600 13px var(--font-sans);
    letter-spacing: 0.06em;
    text-transform: uppercase;
    cursor: pointer;
    background: rgba(20, 30, 38, 0.45);
    color: #fff;
    text-decoration: none;
    box-shadow: none;
    transition: none;
}

.public-site .apt-switcher .map-apt-badge:hover,
.public-site .apt-switcher a.map-apt-badge:hover {
    background: rgba(20, 30, 38, 0.58);
    color: #fff;
    border-color: transparent;
}

.public-site .apt-switcher .map-apt-badge.map-apt-badge--active,
.public-site .apt-switcher a.map-apt-badge.map-apt-badge--active {
    background: var(--sign);
    color: var(--signink);
    border-color: transparent;
}

.public-site .map-apt-badges-in-card .apt-switcher {
    padding: 0;
}

.public-site .apt-switcher-select {
    color: #fff;
    background-color: rgba(20, 30, 38, 0.45);
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'><path fill='%23ffffff' d='M6 8L0 0h12z'/></svg>");
    border: 1px solid rgba(255, 255, 255, 0.5);
    border-radius: 999px;
    padding: 8px 32px 8px 16px;
    font: 600 13px var(--font-sans);
    letter-spacing: 0.06em;
    text-transform: uppercase;
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
}

.public-site .apt-switcher-select:focus-visible {
    outline: 2px solid var(--sign);
    outline-offset: 2px;
}

.public-site .hero-snow::before {
    background: linear-gradient(180deg, rgba(14, 22, 28, 0.08) 40%, rgba(14, 22, 28, 0.62) 100%);
}

.public-site .hero-content {
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    padding: 0 0 22px;
}

.public-site .hero-content-inner {
    width: min(100%, var(--site-max));
    margin-inline: auto;
    padding-inline: var(--site-gutter);
    position: relative;
    z-index: 2;
    color: #fff;
    --hero-text-shadow: 0 1px 3px rgba(0, 0, 0, 0.7), 0 8px 32px rgba(0, 0, 0, 0.55), 0 16px 56px rgba(0, 0, 0, 0.4);
}

.public-site .hero-snow .hero-content h1,
.public-site .hero-snow .hero-content h1 * {
    font-family: var(--font-disp);
    font-size: clamp(28px, 5.5vw, 52px);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.01em;
    line-height: 0.95;
    color: #fff;
    text-wrap: balance;
    text-shadow: var(--hero-text-shadow);
    margin: 0;
}

.public-site .hero-snow .hero-content h2,
.public-site .hero-snow .hero-content h3 {
    text-shadow: var(--hero-text-shadow);
}

.public-site .hero-snow .hero-content-inner > p,
.public-site .hero-snow .hero-copy > p,
.public-site .hero-snow .hero-copy li,
.public-site .hero-snow .hero-subtitle {
    width: auto;
    max-width: 52ch;
    margin: 14px 0 20px;
    padding: 0;
    border-radius: 0;
    background: none;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
    color: #eaf2f7;
    font-size: 17px;
    font-weight: 500;
    line-height: 1.5;
    text-shadow: var(--hero-text-shadow);
}

.public-site .hero-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin: 14px 0 22px;
}

.public-site .hero-chip {
    background: rgba(255, 255, 255, 0.14);
    border: 1px solid rgba(255, 255, 255, 0.35);
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
    color: #fff;
    padding: 6px 14px;
    border-radius: 999px;
    font-size: 13.5px;
    font-weight: 600;
    letter-spacing: 0.02em;
    text-shadow: var(--hero-text-shadow);
}

.public-site .hero-content strong,
.public-site .hero-content b {
    color: inherit;
}

.public-site .hero-snow .hero-actions {
    position: static;
    margin: 0;
    right: auto;
    bottom: auto;
    gap: 12px;
}

.public-site .hero-snow .hero-actions .button {
    height: auto;
    min-height: 0;
    padding: 9px 18px;
    border-radius: 999px;
    font-size: 14.5px;
    font-weight: 700;
    line-height: 1.2;
    box-shadow: var(--shadow);
}

.public-site .hero-snow .hero-actions .button:hover,
.public-site .hero-snow .hero-actions .button:focus {
    box-shadow: var(--shadow);
}

.public-site .hero-snow .hero-actions .button.is-outlined {
    border: 1.5px solid rgba(255, 255, 255, 0.75);
    color: #fff;
    background: transparent;
    font-weight: 600;
}

.public-site .hero-snow .hero-actions .button.is-outlined:hover {
    background: rgba(255, 255, 255, 0.15);
    color: #fff;
}

.public-site .hero-text {
    background: none;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
    padding: 0;
    border-radius: 0;
    max-width: 52ch;
}

.public-site .site-split .hero-snow,
.public-site .site-split .site-block--bleed {
    width: 100%;
    border-radius: 16px;
    overflow: hidden;
}

.public-site .site-split .hero.hero-snow:not([data-banner-height]) {
    aspect-ratio: auto;
    height: auto;
    min-height: var(--hero-height) !important;
    max-height: none;
}

.public-site .site-split .hero-content {
    padding: 0 0 22px;
}

.public-site .site-split .hero-content-inner {
    width: 100%;
    padding-inline: 1.25rem;
}

/* ----- Feature tiles ----------------------------------------------- */

.public-site .highlight-cards {
    margin: 0;
}

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

.public-site .highlight-bento {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
}

.public-site .tile.photo {
    grid-column: span 2;
    grid-row: span 2;
    padding: 0;
    position: relative;
    overflow: hidden;
    min-height: 320px;
    margin: 0;
    border-radius: var(--radius);
    border: 1px solid var(--line);
    background: var(--card);
}

.public-site .tile.photo img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.public-site .tile.photo .cap {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    padding: 18px;
    background: linear-gradient(transparent, rgba(14, 22, 28, 0.72));
    color: #fff;
}

.public-site .tile.photo .cap h3 {
    margin: 0;
    font-size: 16.5px;
    font-weight: 700;
    color: #fff;
}

.public-site .tile.photo .cap p {
    color: #d9e5ec;
    font-size: 13.8px;
    margin: 4px 0 0;
}

.public-site .highlight-card.tile,
.public-site .highlight-card {
    background: var(--card);
    border: 1px solid var(--line);
    border-radius: var(--radius);
    box-shadow: none;
    padding: 22px;
    position: relative;
    transition: transform 0.18s, box-shadow 0.18s;
}

.public-site .highlight-card::before {
    display: none;
}

.public-site .highlight-card:hover {
    transform: translateY(-3px);
    box-shadow: var(--shadow);
}

.public-site .highlight-card h3 {
    font-family: var(--font-sans);
    font-size: 16.5px;
    font-weight: 700;
    text-transform: none;
    letter-spacing: 0;
    margin: 8px 0 4px;
    color: var(--ink);
}

.public-site .highlight-card p {
    font-size: 13.8px;
    color: var(--mut);
    margin: 0;
}

/* ----- Gallery / picturerow ---------------------------------------- */

.public-site .gallery {
    margin: 0;
    gap: 14px;
}

.public-site .gallery-item {
    border-radius: 16px;
    box-shadow: none;
    border: 1px solid var(--line);
    overflow: hidden;
}

.public-site .gallery-item img {
    height: 240px;
    transition: transform 0.18s;
}

.public-site .gallery-item:hover {
    transform: translateY(-3px);
    box-shadow: var(--shadow);
}

.public-site .gallery-item:hover img {
    transform: none;
}

.public-site .gallery-item figcaption {
    opacity: 1;
    background: linear-gradient(transparent, rgba(14, 22, 28, 0.72));
    font-weight: 700;
}

.public-site .block-picturerow {
    background: var(--card);
    border: 1px solid var(--line);
    box-shadow: none;
    border-radius: 16px;
    margin-top: 0;
    padding: 22px;
}

.public-site .block-picturerow-vertical {
    gap: 1.5rem;
    align-items: stretch;
}

/* ----- Text / widgets ---------------------------------------------- */

.public-site .block-textcard,
.public-site .card {
    background: var(--card);
    border: 1px solid var(--line);
    box-shadow: none;
    border-radius: 16px;
}

.public-site .block-textcard {
    margin-top: 0;
    padding: 26px;
}

.public-site .block-textcard:has(.map-area),
.public-site .block-textcard:has(.seasons) {
    background: transparent;
    border: 0;
    padding: 0;
}

.public-site .map-area {
    background: var(--card);
    border: 1px solid var(--line);
    border-radius: 16px;
}

.public-site .seasons,
.public-site .free-terms-box {
    background: transparent;
    border: 0;
}

.public-site .prices {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
    align-items: stretch;
}

.public-site .pcard {
    background: var(--card);
    border: 1px solid var(--line);
    border-radius: var(--radius);
    padding: 22px;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.public-site .pcard.hot {
    border: 2px solid var(--sign);
    position: relative;
}

.public-site .pcard.hot .flag {
    position: absolute;
    top: -12px;
    left: 18px;
    background: var(--sign);
    color: var(--signink);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    padding: 3px 10px;
    border-radius: 999px;
}

.public-site .pcard .season-n {
    font-size: 15px;
    font-weight: 700;
}

.public-site .pcard .dates {
    font-size: 12.5px;
    color: var(--mut);
    font-variant-numeric: tabular-nums;
}

.public-site .pcard .amt {
    font-family: var(--font-disp);
    font-weight: 700;
    font-size: 40px;
    line-height: 1;
    margin-top: 10px;
    font-variant-numeric: tabular-nums;
}

.public-site .pcard .amt small {
    display: inline-block;
    margin-left: 6px;
    font-size: 15px;
    font-weight: 600;
    color: var(--mut);
}

.public-site .pcard .occ {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px 10px;
    margin: 10px 0 2px;
}

.public-site .pcard .occ-opt {
    display: inline-flex;
    align-items: center;
    gap: 0;
}

.public-site .pcard .occ-opt .material-symbols-rounded {
    font-size: 20px;
    line-height: 1;
    color: var(--ink);
}

.public-site .pcard .occ-opt .occ-child {
    font-size: 18px;
    color: var(--pine);
}

.public-site .pcard .occ-or {
    font-size: 12px;
    font-weight: 600;
    color: var(--mut);
}

.public-site .pcard .note {
    font-size: 12.5px;
    color: var(--mut);
    margin-top: auto;
    padding-top: 8px;
}

.public-site .pcard .note .availability-badge {
    display: block;
    margin-top: 6px;
}

.public-site .pfoot {
    margin-top: 14px;
    font-size: 13px;
    color: var(--mut);
}

.public-site .seasons .section-actions,
.public-site .section-actions {
    margin-top: 22px;
    margin-bottom: 0;
    text-align: center;
}

.public-site .section-actions .button,
.public-site .map-section .button {
    display: inline-flex;
    width: auto;
    margin: 0;
}

.public-site a.button,
.public-site .content a.button,
.public-site .leaflet-bar a,
.public-site .leaflet-control a,
.public-site .content .leaflet-bar a,
.public-site .content .leaflet-control a,
.public-site .content .leaflet-bar a:hover,
.public-site .content .leaflet-control a:hover {
    text-decoration: none;
}

.public-site .card .button,
.public-site .card a.button.is-primary:not(.is-outlined),
.public-site .block-textcard .button,
.public-site .block-textcard a.button.is-primary:not(.is-outlined),
.public-site .section-actions .button,
.public-site .section-actions a.button.is-primary:not(.is-outlined),
.public-site .map-section .button,
.public-site .map-section a.button.is-primary:not(.is-outlined),
.public-site .free-terms-box .button,
.public-site .free-terms-box a.button.is-primary:not(.is-outlined) {
    background: var(--tint);
    background-color: var(--tint);
    border: 1px solid var(--line);
    color: var(--ink) !important;
    box-shadow: none;
    text-decoration: none;
}

.public-site .card .button:hover,
.public-site .card .button:focus,
.public-site .card a.button.is-primary:not(.is-outlined):hover,
.public-site .card a.button.is-primary:not(.is-outlined):focus,
.public-site .block-textcard .button:hover,
.public-site .block-textcard .button:focus,
.public-site .section-actions .button:hover,
.public-site .section-actions .button:focus,
.public-site .map-section .button:hover,
.public-site .map-section .button:focus,
.public-site .free-terms-box .button:hover,
.public-site .free-terms-box .button:focus {
    background: var(--line);
    background-color: var(--line);
    border-color: var(--mut);
    color: var(--ink) !important;
    box-shadow: none;
    filter: none;
    text-decoration: none;
}

.public-site .card .button.is-outlined,
.public-site .card a.button.is-outlined,
.public-site .block-textcard .button.is-outlined,
.public-site .map-section .button.is-outlined,
.public-site .free-terms-box .button.is-outlined {
    background: transparent;
    background-color: transparent;
    border-color: var(--line);
    color: var(--ink) !important;
}

.public-site .content strong,
.public-site .block-textcard strong,
.public-site .accent {
    color: var(--pine);
}

.public-site .content a {
    color: var(--pine);
    text-decoration: underline;
    text-underline-offset: 2px;
}


/* ----- Activities split -------------------------------------------- */

.public-site .site-split {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px;
    align-items: stretch;
}

.public-site .site-split-col > * + * {
    margin-top: var(--site-section-gap);
}

.public-site .columns {
    margin-left: 0;
    margin-right: 0;
}

/* ----- Book band + footer ------------------------------------------ */

.public-site .site-book {
    margin: 72px var(--site-gutter) 0;
    background: var(--icecta);
    border-radius: 18px;
    padding: 44px 34px;
    color: #fff;
    text-align: center;
}

@media (prefers-color-scheme: dark) {
    html:not([data-theme="light"]) .public-site .site-book {
        color: var(--bg);
    }
}

.public-site .site-book-copy {
    color: inherit;
}

.public-site .site-book .disp,
.public-site .site-book-copy h1 {
    font-family: var(--font-disp);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.01em;
    line-height: 0.95;
    font-size: clamp(28px, 4.5vw, 44px);
    color: inherit;
    margin: 0;
}

.public-site .site-book p:not(.disp),
.public-site .site-book-copy p {
    opacity: 0.85;
    margin: 8px auto 20px;
    max-width: 52ch;
    color: inherit;
}

.public-site .site-footer {
    margin-top: 0;
    padding: 26px 0 40px;
    background: transparent;
    color: var(--mut);
    border-top: 1px solid var(--line);
    font-size: 13.5px;
}

.public-site .footer-inner {
    display: flex;
    gap: 26px;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: baseline;
}

.public-site .site-footer .brand-text {
    font-family: var(--font-disp);
    font-size: 18px;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--ink);
}

.public-site .footer-sub {
    color: var(--mut);
    font-size: 13.5px;
    margin-top: 0.2rem;
}

.public-site .footer-nav,
.public-site .footer-links {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 18px;
    align-items: center;
}

body.public-site .site-footer a {
    color: var(--mut);
    margin-right: 0;
}

body.public-site .site-footer a:hover {
    color: var(--pine);
}

/* ----- Responsive -------------------------------------------------- */

@media (max-width: 1023px) {
    .public-site .navbar-brand {
        flex: 1 1 auto;
        width: 100%;
        max-width: 100%;
    }

    body.public-site .navbar-burger {
        margin-left: auto;
        flex: 0 0 auto;
        color: var(--ink);
    }

    body.public-site .navbar-burger span {
        background-color: var(--ink);
    }

    .public-site .navbar {
        position: relative;
    }

    .public-site .navbar-menu,
    .public-site .navbar-menu.is-active {
        position: absolute;
        top: 100%;
        left: 0;
        right: 0;
        width: 100%;
        flex: none;
        display: none;
        height: auto;
        min-height: 0;
        max-height: none;
        align-items: stretch;
        justify-content: flex-start;
        padding: 0.75rem var(--site-gutter) 1rem;
        background: var(--card);
        backdrop-filter: none;
        -webkit-backdrop-filter: none;
        box-shadow: var(--shadow);
        box-sizing: border-box;
        z-index: 20;
    }

    body.public-site .site-header .navbar-menu,
    body.public-site .site-header .navbar-menu.is-active {
        background: var(--card);
        backdrop-filter: none;
        -webkit-backdrop-filter: none;
    }

    .public-site .navbar-menu.is-active,
    .public-site .site-header.is-shrink .navbar-menu.is-active {
        display: block;
        height: auto;
        max-height: none;
    }

    .public-site .navbar-end {
        display: flex;
        flex-direction: column;
        align-items: stretch;
        width: 100%;
    }

    .public-site .navbar-end > .navbar-item,
    .public-site .navbar-end > a.navbar-item {
        width: 100%;
    }

    .public-site .site-header-cta-item {
        padding-top: 0.75rem;
    }
}

@media (max-width: 1023px) {
    .public-site .highlight-bento,
    .public-site .prices {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 860px) {
    .public-site .highlight-grid,
    .public-site .highlight-bento,
    .public-site .prices,
    .public-site .site-split,
    .public-site .footer-inner {
        grid-template-columns: 1fr;
    }

    .public-site .site-main:has(.site-block--cols-2) {
        grid-template-columns: 1fr;
    }

    .public-site .site-main:has(.site-block--cols-2) > .site-block--cols-2 {
        grid-column: 1 / -1;
    }

    .public-site .tile.photo {
        grid-column: auto;
        grid-row: auto;
        min-height: 240px;
    }

    .public-site .hero-snow .hero-content h1 {
        font-size: clamp(26px, 8vw, 40px);
    }
}

@media (max-width: 768px) {
    .public-site {
        --header-height: 52px;
        --header-height-shrink: 52px;
        --logo-size: 72px;
        --logo-size-shrink: 40px;
        --logo-overlap: 4px;
        --site-gutter: 18px;
    }

    body.public-site:not(.admin) .site-header {
        position: sticky;
        width: 100%;
    }

    .public-site .hero.hero-snow {
        margin-top: 0;
    }

    .public-site .brand-text.disp {
        font-size: 18px;
        display: block;
    }

    .public-site .gallery {
        grid-template-columns: 1fr !important;
    }

    .public-site .site-book {
        margin-left: 18px;
        margin-right: 18px;
        padding: 32px 20px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .public-site .highlight-card,
    .public-site .gallery-item {
        transition: none;
    }
}

/* ===================================================================
   „Mitanpack-Prinzip"
   Erscheint, wenn keine Putzkraft verfügbar ist: im Preisblock der
   Startseite als Kasten, im Buchungsformular als Zeile an der
   gesperrten Endreinigung. Bewusst als Karte und nicht als Warnbanner
   (vgl. .booking-lock-notice) - die Aussage ist positiv, nicht negativ.
   =================================================================== */

/* Runde Plakette im Schild-Gelb der Seite. */
.public-site .mitanpacken-badge {
    display: inline-grid;
    place-items: center;
    flex: 0 0 auto;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: var(--sign);
    color: var(--signink);
}
.public-site .mitanpacken-badge .material-symbols-rounded {
    font-size: 19px;
    line-height: 1;
}
.public-site .mitanpacken-badge--lg {
    width: 26px;
    height: 26px;
}
.public-site .mitanpacken-badge--lg .material-symbols-rounded {
    font-size: 16px;
}

/* Kasten im Preis-/Buchungsbereich. Der umgebende Block ist auf der
   Public-Site transparent und ohne Innenabstand, deshalb bringt der
   Hinweis seine Kartenoptik komplett selbst mit. */
.public-site .mitanpacken-notice {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 2px 9px;
    align-items: start;
    /* Steht unter dem Preisraster, deshalb Abstand oben statt unten. */
    margin: 12px 0 0;
    padding: 9px 12px;
    background: var(--card);
    color: var(--ink);
    border: 1px solid var(--line);
    border-left: 4px solid var(--sign);
    border-radius: var(--radius);
}
/* Der Kasten steht in einem .content-Block: dessen Bulma-Typografie setzt
   h3 auf 20px Aussenabstand und p auf 1em. Beides hier abraeumen - sonst
   waechst der Kasten um ~70px, die man nur als Leerraum sieht. */
.public-site .mitanpacken-notice h3,
.public-site .mitanpacken-notice p {
    margin: 0;
}
.public-site .mitanpacken-notice__text {
    display: flex;
    flex-direction: column;
    gap: .18rem;
    min-width: 0;
    /* Zweite Rasterzeile, aber unter dem Titel statt unter der Plakette.
       Ohne diese Zeile zieht der Textblock Spalte 1 auf und quetscht den
       Titel in den Rest von Spalte 2. */
    grid-column: 2;
}
.public-site .mitanpacken-notice__title {
    margin: 0;
    font-family: var(--font-disp);
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .04em;
    /* Titel neben die Plakette, nicht darunter - spart eine Zeile. */
    align-self: center;
    grid-column: 2;
}
.public-site .mitanpacken-notice__lead {
    margin: 0;
    font-size: .82rem;
    line-height: 1.38;
    font-weight: 700;
}
.public-site .mitanpacken-notice__body,
.public-site .mitanpacken-notice__call {
    margin: 0;
    font-size: .78rem;
    line-height: 1.38;
    color: var(--mut);
}
.public-site .mitanpacken-notice__call {
    font-weight: 700;
    color: var(--pine);
}
/* Nebensatz am Aufruf, bewusst ohne Fläche und ohne Rundung: als gefüllte
   Pille wurde die Zeile für einen Knopf gehalten. */
.public-site .mitanpacken-notice__bonus {
    font-weight: 400;
    color: var(--mut);
}

/* Endreinigung ohne Putzkraft: nicht buchbar, aber kein Fehler. Das
   Durchstreichen und das Rot aus styles.css werden hier zurückgenommen;
   ausgegraut bleiben Preis und Abrechnungszeile, damit weiterhin
   erkennbar ist, dass die Leistung nicht dazugebucht werden kann. */
.public-site .request-option-item--mitanpacken.is-unavailable {
    opacity: 1;
}
.public-site .request-option-item--mitanpacken.is-unavailable strong {
    text-decoration: none;
}
.public-site .request-option-item--mitanpacken.is-unavailable .request-option-price-tag,
.public-site .request-option-item--mitanpacken.is-unavailable .request-option-desc {
    opacity: .55;
}
.public-site .request-option-mitanpacken {
    display: flex;
    gap: 8px;
    align-items: flex-start;
    margin-top: 6px;
    padding: 8px 10px;
    background: var(--tint);
    border-left: 3px solid var(--sign);
    border-radius: 8px;
    font-size: .82rem;
    line-height: 1.45;
    color: var(--ink);
}
.public-site .request-option-mitanpacken[hidden] {
    display: none;
}

@media (max-width: 768px) {
    /* Zweispaltig bleiben: die Plakette ist schmal genug, und eine einzelne
       Spalte wuerde den auf Spalte 2 gesetzten Text in eine implizite
       Zusatzspalte schieben und dort zusammenquetschen. */
    .public-site .mitanpacken-notice {
        padding: 10px 12px;
        gap: 5px 8px;
    }
    /* Auf schmalen Schirmen laeuft der Text ueber beide Spalten - neben der
       Plakette blieben sonst gut 40px Breite ungenutzt. */
    .public-site .mitanpacken-notice__text {
        grid-column: 1 / -1;
    }
}
