/* Selbst-gehostete Schriften (vormals fonts.css, inline für 1 Request weniger) */
/* Jost — Fließtext / UI (OFL, selbst gehostet) */
@font-face {
  font-family: 'Jost';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url(fonts/font-19.ttf) format('truetype');
}
@font-face {
  font-family: 'Jost';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(fonts/font-20.ttf) format('truetype');
}
@font-face {
  font-family: 'Jost';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(fonts/font-21.ttf) format('truetype');
}
/* JetBrains Mono — Mono-Labels (OFL, selbst gehostet) */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(fonts/font-22.ttf) format('truetype');
}
/* Playfair Display — große Display-Titel (OFL, selbst gehostet) */
@font-face {
  font-family: 'Playfair Display';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(fonts/PlayfairDisplay-normal-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Playfair Display';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(fonts/PlayfairDisplay-normal-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Playfair Display';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url(fonts/PlayfairDisplay-italic-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Playfair Display';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url(fonts/PlayfairDisplay-italic-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* WindSong — Schreibschrift für Seam-Akzente (OFL, selbst gehostet) */
@font-face {
  font-family: 'WindSong';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(fonts/WindSong-normal-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'WindSong';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(fonts/WindSong-normal-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* Hero Slider */
.hero-slider { position: absolute; inset: 0; z-index: 1; }
.hero-slide {
  position: absolute; inset: 0; width: 100%; height: 100%;
  object-fit: cover; opacity: 0;
  transition: opacity 1.2s ease-in-out;
}
.hero-slide.active { opacity: 1; }

:root {
  --bg: #f4ede0;
  --bg-soft: #f4ede0;
  --bg-paper: #f4ede0;
  --bg-dark: #241f1a;
  --bg-warm: #3a322b;
  --bg-night: #1a1612;
  --ink: #241f1a;
  --ink-soft: #5a4e43;
  --ink-mute: #7a6e62;
  --line: #cdc1ad;
  --line-dark: #4a3f33;
  --accent: #241f1a;
  --accent-soft: #5a4e43;
  --accent-warm: #f4ede0;
  --accent-gold: #b08a5a;
  --cream: #f4ede0;

  --pad-x: clamp(20px, 4vw, 56px);
  --copy-size: clamp(20px, 2.1vw, 20px);
  --copy-size-mobile: 16px;
  --copy-line: 1.58;
  --copy-line-mobile: 1.68;
  --hairline: 1px solid var(--line);
  --hairline-dark: 1px solid var(--line-dark);
}

* { box-sizing: border-box; margin: 0; padding: 0 }
html, body {
  background: var(--bg); color: var(--ink);
  font-family: "Jost", sans-serif; font-weight: 300;
  -webkit-font-smoothing: antialiased; font-feature-settings: "kern", "liga";
  overflow-x: hidden;
}
body { min-height: 100vh; line-height: 1.5 }
html.scroll-locked,
body.scroll-locked { overflow: hidden }
img { display: block; max-width: 100% }
button { font-family: inherit; cursor: pointer; border: none; background: none; color: inherit }
a { color: inherit; text-decoration: none }

.serif { font-family: "Playfair Display", serif; font-weight: 300; letter-spacing: .005em }
.serif-it { font-family: "Playfair Display", serif; font-weight: 300; letter-spacing: 0 }
.copy-text {
  font-family: "Jost", sans-serif;
  font-size: var(--copy-size);
  line-height: var(--copy-line);
  font-weight: 300;
  letter-spacing: 0;
}
@media (max-width: 1024px) {
  .copy-text {
    font-size: var(--copy-size-mobile);
    line-height: var(--copy-line-mobile);
  }
}
.section h2 .serif-it,
.section h3 .serif-it,
#houses-section h2 .serif-it,
.house-photo-hero h1 .serif-it {
  color: inherit !important;
}
.mono { font-family: "JetBrains Mono", monospace; font-weight: 400; font-feature-settings: "ss01" }
.eyebrow {
  font-family: "JetBrains Mono", monospace; font-weight: 400;
  letter-spacing: .32em;  font-size: 11px; color: var(--ink-mute);
}
.eyebrow.on-dark { color: rgba(246,241,231,.55) }

.chapter {
  font-family: "Playfair Display", serif; font-weight: 300;
  font-size: 14px; letter-spacing: .4em; color: var(--accent);  display: inline-flex; align-items: center; gap: 14px;
}
.chapter::before, .chapter::after { content: ""; width: 36px; height: 1px; background: var(--accent); opacity: .4 }

.rule { display: flex; align-items: center; gap: 12px; color: var(--line) }
.rule::before, .rule::after { content: ""; flex: 1; height: 1px; background: currentColor }
.rule .dot { width: 6px; height: 6px; border-radius: 50%; background: var(--accent); flex: 0 0 auto }

.container { max-width: 1520px; margin: 0 auto; padding: 0 var(--pad-x) }
.container.narrow { max-width: 1080px }
.section { padding: clamp(80px, 11vw, 140px) 0 }
.section.tight { padding: clamp(60px, 8vw, 100px) 0 }
/* Season pages (sommer/winter): tight, uniform gap between intro text and the carousel */
.section.season-intro { padding-bottom: clamp(20px, 2.5vw, 36px) }
.section.gallery-section.season-gallery { padding-top: clamp(20px, 2.5vw, 36px) }

.skip-nav {
  position: absolute; left: -9999px; top: auto; width: 1px; height: 1px; overflow: hidden;
}
.skip-nav:focus {
  left: 1rem; top: 1rem; z-index: 10000; width: auto; height: auto;
  padding: .65rem .85rem; background: var(--bg-dark); color: var(--cream);
}

/* Header */
.headbar {
  position: sticky; top: 0; z-index: 30;
  background: rgba(244,237,224,.92); backdrop-filter: blur(16px);
  border-bottom: 1px solid var(--line);
  transition: background .32s ease, border-color .32s ease, backdrop-filter .32s ease;
}
.headbar .main {
  display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 24px;
  padding: 13px clamp(20px, 5vw, 80px);
  max-width: 1890px; margin: 0 auto;
  transition: padding .32s ease, transform .32s ease;
}
.headbar .lang {
  display: flex; align-items: center; gap: 14px;
  font-size: 11px; letter-spacing: .22em;  color: var(--ink-soft);
}
.headbar .lang a { transition: color .2s }
.headbar .lang a.active { color: var(--ink); font-weight: 500 }
.headbar .actions { display: flex; justify-content: flex-end; align-items: center; gap: 14px }

.brand {
  font-family: "Playfair Display", serif; font-weight: 300; font-size: 22px; letter-spacing: .06em;
  display: inline-flex; align-items: baseline; gap: 8px; white-space: nowrap; justify-self: center;
}
.brand.logo-brand {
  align-items: center;
  line-height: 1;
}
.brand.logo-brand img {
  display: block;
  width: auto;
  height: clamp(56px, 8vw, 92px);
  max-width: min(480px, 84vw);
  object-fit: contain;
  transition: height .32s ease, max-width .32s ease;
}
.dark .brand.logo-brand img,
.drawer .brand.logo-brand img,
.site-footer .brand.logo-brand img {
  filter: invert(1) brightness(1.9);
}

.topnav { display: flex; gap: 22px; justify-content: center }
.topnav a {
  font-size: 15px; letter-spacing: .18em;  color: var(--ink-soft);
  padding: 8px 0; position: relative; transition: color .2s; font-weight: 400;
}
.topnav a:hover { color: var(--ink) }
.house-context {
  display: none;
  font-family: "Jost", sans-serif;
  letter-spacing: .24em;
   font-size: 11px;
  line-height: 1.45;
  color: currentColor;
  opacity: .86;
}
.house-context-sep {
  display: none;
  width: 1px;
  height: 28px;
  background: currentColor;
  opacity: .22;
}
.house-context span {
  display: block;
  opacity: .62;
  font-size: 11px;
}
.house-context strong {
  display: block;
  font-weight: 400;
  white-space: nowrap;
}
@media (min-width: 1025px) {
  .house-context,
  .house-context-sep {
    display: block;
  }
}

@media (min-width: 1025px) {
  .headbar {
    /* Absolut statt fixiert: liegt ganz oben über dem Hero und scrollt mit
       der Seite weg. Erst die .is-scrolled-Leiste ist fixiert (Referenzverhalten). */
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    background: transparent;
    border-bottom-color: transparent;
    backdrop-filter: none;
  }
  .headbar .main {
    position: relative;
  }
  .headbar .brand.logo-brand {
    position: static;
    transform: none;
    z-index: 2;
  }
  .headbar.at-top {
    background: transparent;
    border-bottom-color: transparent;
    backdrop-filter: none;
    color: var(--cream);
  }
  .headbar.at-top .main {
    padding-top: 44px;
    padding-bottom: 9px;
    transform: none;
  }
  .headbar.at-top .brand.logo-brand {
    position: static;
    transform: none;
  }
  .headbar.at-top .brand.logo-brand img {
    height: clamp(50px, 5.4vw, 83px);
    max-width: min(390px, 34vw);
    filter: invert(1) brightness(1.9);
  }
  .headbar.at-top .topnav a,
  .headbar.at-top .lang,
  .headbar.at-top .back-link {
    color: var(--cream);
    font-size: 13px;
  }
  .headbar.at-top .lang a,
  .headbar.at-top .lang a.active {
    color: var(--cream);
  }
  .headbar.at-top .topnav a {
    padding-block: 8px;
    font-size: 15px;
  }
  .headbar.is-scrolled {
    position: fixed;
    background: rgba(36,31,26,.94);
    border-bottom-color: transparent;
    backdrop-filter: blur(16px);
    color: var(--cream);
    animation: headbarSlideIn .5s ease both;
  }
  .headbar.is-scrolled .main {
    padding-top: 9px;
    padding-bottom: 9px;
    transform: none;
  }
  .headbar.is-scrolled .brand.logo-brand img {
    /* Logo 25% kleiner als at-top → Navleiste ~20% niedriger */
    height: clamp(38px, 4vw, 62px);
    max-width: min(292px, 25.5vw);
    filter: invert(1) brightness(1.9);
  }
  .headbar.is-scrolled .topnav a,
  .headbar.is-scrolled .lang,
  .headbar.is-scrolled .lang a,
  .headbar.is-scrolled .lang a.active,
  .headbar.is-scrolled .back-link {
    color: var(--cream);
  }
  body.light-nav .headbar.at-top {
    color: var(--ink);
  }
  body.light-nav .headbar.at-top .brand.logo-brand img {
    filter: none;
  }
  body.light-nav .headbar.at-top .topnav a,
  body.light-nav .headbar.at-top .lang,
  body.light-nav .headbar.at-top .lang a,
  body.light-nav .headbar.at-top .lang a.active,
  body.light-nav .headbar.at-top .back-link {
    color: var(--ink);
  }
}

/* Buttons */
.btn {
  position: relative; display: inline-flex; align-items: center; gap: 14px;
  /* Einheitliche Button-Größe für die ganze Website: gleiche Höhe, gleiche Schriftgröße */
  padding: 16px 26px;
  min-height: 58px;
  border: 1px solid var(--ink); background: transparent;
  font-family: "Jost", sans-serif; font-size: 15px; letter-spacing: .06em;
  color: var(--ink); font-weight: 400; cursor: pointer;
  transition: color .55s ease, border-color .4s ease; overflow: hidden;
}
.btn::before {
  content: ""; position: absolute; inset: 0; background: var(--ink);
  transform-origin: left center; transform: scaleX(0);
  transition: transform .7s cubic-bezier(.4,0,.2,1); z-index: 0;
}
.btn:hover { color: var(--cream) }
/* Plain text label in a button must sit above the ::before fill so it stays visible on hover */
.btn > .btn-label { position: relative; z-index: 1 }
.btn:hover::before { transform: scaleX(1) }

.btn .lbl {
  position: relative; z-index: 1; display: inline-block; overflow: hidden;
  height: 1.1em; line-height: 1.1;
}
.btn .lbl span { display: block; transition: transform .65s cubic-bezier(.4,0,.2,1) }
.btn .lbl span:nth-child(2) { position: absolute; left: 0; top: 100% }
.btn:hover .lbl span { transform: translateY(-100%) }

.btn .circ {
  position: relative; z-index: 1;
  width: 20px; height: 20px; border-radius: 0;
  border: 0; display: grid; place-items: center; flex: 0 0 auto;
  transition: transform .55s cubic-bezier(.7,0,.2,1);
}
.btn .circ svg { transition: transform .55s cubic-bezier(.7,0,.2,1); color: currentColor }
.btn:hover .circ svg { transform: translateX(4px) }
.btn .icon-img {
  position: relative;
  z-index: 1;
  width: 17px;
  height: 17px;
  object-fit: contain;
  opacity: .86;
  filter: invert(83%) sepia(24%) saturate(424%) hue-rotate(356deg) brightness(93%) contrast(88%);
  transition: opacity .25s ease, transform .25s ease, filter .25s ease;
}
.btn:not(.on-dark) .icon-img {
  filter: invert(40%) sepia(19%) saturate(945%) hue-rotate(357deg) brightness(91%) contrast(87%);
}
.btn:hover .icon-img {
  opacity: 1;
  transform: translateX(3px);
}
.btn:not(.on-dark):hover .icon-img {
  filter: invert(96%) sepia(6%) saturate(589%) hue-rotate(333deg) brightness(100%) contrast(94%);
}

.btn.solid { background: var(--ink); color: var(--cream); border-color: var(--ink) }
.btn.solid::before { background: var(--accent) }
.btn.solid:hover { color: var(--cream); border-color: var(--accent) }
.btn.solid:hover .circ { border-color: transparent }

.btn.on-dark { border-color: rgba(246,241,231,.4); color: var(--cream) }
.btn.on-dark::before { background: var(--cream) }
.btn.on-dark:hover { color: var(--ink); border-color: var(--cream) }

/* compact behält nur die weitere Laufweite — Höhe und Schriftgröße sind überall gleich */
.btn.compact { letter-spacing: .26em }
.btn.compact .circ { width: 20px; height: 20px }
/* Ausnahme: reiner Icon-Button (X im Drawer) bleibt kompakt */
.btn.drawer-close { padding: 11px 14px; min-height: 0 }

/* Watermark letter */
.wm {
  font-family: "Playfair Display", serif; font-weight: 300;
  color: transparent; -webkit-text-stroke: 1px rgba(36,31,26,.18);
  line-height: .78; letter-spacing: -.02em;
  pointer-events: none; user-select: none; position: absolute;
}
.wm.on-dark { -webkit-text-stroke: 1px rgba(246,241,231,.18) }
.wm.solid { color: rgba(36,31,26,.045); -webkit-text-stroke: 0 }
.wm.solid.on-dark { color: rgba(246,241,231,.05) }

/* Photo placeholders */
.ph {
  position: relative; background: #7a6650; overflow: hidden; color: var(--cream); isolation: isolate;
  transform-origin: center;
}
.ph::before {
  content: ""; position: absolute; inset: 0;
  background-image: repeating-linear-gradient(45deg, rgba(255,255,255,.05) 0 2px, transparent 2px 9px);
  mix-blend-mode: overlay;
}
.ph::after { content: ""; position: absolute; inset: 0; background: radial-gradient(120% 80% at 30% 20%, rgba(255,232,196,.18), transparent 50%) }
.ph .ph-tag {
  position: absolute; left: 14px; bottom: 12px;
  font-family: "JetBrains Mono", monospace; font-size: 10px; letter-spacing: .18em;
   opacity: .6; z-index: 2;
}
.ph .ph-num {
  position: absolute; right: 14px; top: 12px;
  font-family: "JetBrains Mono", monospace; font-size: 10px; letter-spacing: .22em; opacity: .6; z-index: 2;
}

.ph.tone-rosra-stube {
  background: linear-gradient(160deg, rgba(168,147,114,.26), rgba(74,58,45,.42));
}
.ph.tone-bel-bath-premium {
  background: linear-gradient(160deg, rgba(168,160,148,.22), rgba(77,71,63,.36));
}
.ph.tone-bel-balcony-wide {
  background: linear-gradient(170deg, rgba(168,181,140,.2), rgba(45,54,37,.34));
}
.ph.tone-alfred-dining {
  background: linear-gradient(160deg, rgba(177,160,135,.22), rgba(76,64,52,.38));
}
.ph.tone-bel-kitchen-view {
  background: linear-gradient(160deg, rgba(200,184,154,.24), rgba(122,100,76,.34));
}
.ph.tone-bel-wood-detail {
  background: linear-gradient(160deg, rgba(115,85,54,.28), rgba(43,31,22,.42));
}
.ph[class*="tone-"]::before {
  background-image: linear-gradient(180deg, rgba(20,16,12,.06), rgba(20,16,12,.12));
  mix-blend-mode: multiply;
}
.ph[class*="tone-"]::after {
  background: radial-gradient(120% 80% at 30% 20%, rgba(255,232,196,.14), transparent 50%);
}

.shadow-soft { box-shadow: 0 30px 60px -30px rgba(36,31,26,.32), 0 8px 16px -8px rgba(36,31,26,.16) }

/* Organic composition rhythm */
.container > .ph:nth-child(odd),
.stack-md > .ph:nth-child(odd) { transform: translateY(-18px) }
.container > .ph:nth-child(even),
.stack-md > .ph:nth-child(even) { transform: translateY(22px) }
.stack-md > div > .ph:nth-child(odd) { transform: translateY(-10px) }
.stack-md > div > .ph:nth-child(even) { transform: translateY(12px) }
.zoom-wrap { overflow: visible }
.mat-card:nth-child(2n) { margin-top: clamp(18px, 4vw, 54px) }
.mat-card:nth-child(3n) { margin-top: clamp(-16px, -1.5vw, -8px) }
.mat-card:nth-child(2n) .mat-img { aspect-ratio: 4 / 5.2 }
.mat-card:nth-child(3n) .mat-img { aspect-ratio: 3 / 3.8 }

/* Dark sections */
.dark { background: var(--bg-dark); color: var(--cream) }
.dark .eyebrow { color: rgba(246,241,231,.55) }
.dark .rule { color: var(--line-dark) }
.dark .rule .dot { background: var(--accent-warm) }
.dark .chapter { color: var(--accent-warm) }
.dark .chapter::before, .dark .chapter::after { background: var(--accent-warm) }
.dark a { color: var(--cream) }

/* Hover list */
.hover-list { position: relative }
.hover-list .hl-row {
  position: relative; display: grid; grid-template-columns: 1fr 2fr auto;
  padding: 36px 0; border-bottom: 1px solid rgba(154,122,79,.24); align-items: center; gap: 32px;
  cursor: pointer; transition: padding .35s ease, color .35s ease;
}
.hover-list .hl-row:first-child { border-top: 1px solid rgba(154,122,79,.24) }
.hover-list .hl-row::after {
  content: ""; position: absolute; inset: 0; background: var(--ink);
  transform-origin: left center; transform: scaleX(0);
  transition: transform .55s cubic-bezier(.7,0,.2,1); z-index: 0; pointer-events: none;
}
.hover-list .hl-row > * { position: relative; z-index: 1 }
.hover-list .hl-row:hover { padding-left: 32px; padding-right: 32px; color: var(--cream) }
.hover-list .hl-row:hover::after { transform: scaleX(1) }
.hover-list .hl-num {
  display: none;
}
.hover-list .hl-row:hover .hl-num { color: var(--accent-warm); transform: translateX(8px) }
.hover-list .hl-title {
  font-family: "Jost", sans-serif; font-weight: 400;
  font-size: clamp(17px, 1.4vw, 22px); line-height: 1.15; letter-spacing: 0;
 }
.hover-list .hl-row:hover .hl-title { color: var(--accent-warm) }
.hover-list .hl-desc { font-size: var(--copy-size); line-height: var(--copy-line); color: var(--ink-soft); transition: color .35s, opacity .35s }
.hover-list .hl-row:hover .hl-desc { color: rgba(246,241,231,.78) }
.hover-list .hl-arrow { justify-self: end; color: var(--ink-soft); transition: transform .45s, color .35s }
.hover-list .hl-row:hover .hl-arrow { transform: translate(10px, -4px) rotate(-45deg); color: var(--accent-warm) }
.hover-list .hl-img {
  width: 120px; height: 80px; overflow: hidden; border-radius: 4px;
  opacity: 0; transform: translateX(12px); transition: opacity .4s ease, transform .4s ease;
}
.hover-list .hl-img img { width: 100%; height: 100%; object-fit: cover }
.home-page .hover-list .hl-row:hover .hl-img { opacity: 1; transform: translateX(0) }
.home-page .experience-section .hover-list .hl-title,
.home-page .experience-section .hover-list .hl-desc { transition: color .35s, opacity .35s }
.home-page .experience-section .hover-list .hl-row:hover .hl-title,
.home-page .experience-section .hover-list .hl-row:hover .hl-desc,
.home-page .experience-section .hover-list .hl-row.open .hl-title,
.home-page .experience-section .hover-list .hl-row.open .hl-desc { opacity: .18 }
body:not(.home-page) .hover-list .hl-img { display: none }
body:not(.home-page) .hover-list .hl-title {
  font-size: clamp(17px, 1.4vw, 22px) !important;
  font-weight: 400 !important;
  letter-spacing: 0 !important;
}

/* Ledger row */
.ledger-row { position: relative; transition: padding .35s ease, background .35s ease, color .35s ease; overflow: hidden }
.ledger-row::after {
  content: ""; position: absolute; inset: 0; background: var(--ink);
  transform-origin: left center; transform: scaleX(0);
  transition: transform .7s cubic-bezier(.4,0,.2,1); z-index: 0; pointer-events: none;
}
.ledger-row > * { position: relative; z-index: 1 }
.ledger-row:hover { padding-left: 24px; padding-right: 24px; color: var(--cream) }
.ledger-row:hover::after { transform: scaleX(1) }

.dark .ledger-row::after { background: var(--accent-warm) }
.dark .ledger-row:hover { color: var(--ink) }

/* Accordion */
.acc-item { border-top: 1px solid var(--line); overflow: hidden; transition: background .35s }
.acc-item:last-child { border-bottom: 1px solid var(--line) }
.acc-head {
  width: 100%; display: grid; grid-template-columns: 60px 1fr auto; padding: 26px 0;
  background: transparent; border: none; cursor: pointer; text-align: left; align-items: center;
  font-family: inherit; color: inherit; transition: padding .35s; gap: 20px;
}
html[lang="de"] .faq-photo-section .acc-head {
  grid-template-columns: 1fr auto;
}
.acc-item:hover .acc-head { padding-left: 14px; padding-right: 14px }
.acc-item.open .acc-head { padding-left: 14px; padding-right: 14px }
.acc-body {
  max-height: 0; opacity: 0; transition: max-height .55s ease, opacity .35s ease .1s, padding .35s;
  padding: 0 14px;
}
.acc-item.open .acc-body { max-height: 600px; opacity: 1; padding: 0 14px 28px }
.acc-body .copy-text { text-wrap: pretty }
.acc-plus {
  width: 28px; height: 28px; display: grid; place-items: center; border: 1px solid currentColor;
  transition: transform .5s cubic-bezier(.7,0,.2,1);
}
.acc-item.open .acc-plus { transform: rotate(135deg) }

/* Stat grid */
.stat-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1px; background: var(--line) }
.stat-grid > div { background: var(--bg); padding: 32px 28px; position: relative; overflow: hidden }
.stat-grid > div::before {
  content: ""; position: absolute; inset: 0; background: var(--ink);
  transform: translateY(101%); transition: transform .7s cubic-bezier(.7,0,.2,1);
}
.stat-grid > div:hover::before { transform: translateY(0) }
.stat-grid > div:hover { color: var(--cream) }
.stat-grid > div * { position: relative; z-index: 1 }
.dark .stat-grid { background: var(--line-dark) }
.dark .stat-grid > div { background: var(--bg-dark); color: var(--cream) }
.dark .stat-grid > div::before { background: var(--accent-warm) }
.dark .stat-grid > div:hover { color: var(--ink) }

/* Side rail */
.side-rail {
  position: fixed; left: 24px; top: 50%; transform: translateY(-50%); z-index: 25;
  display: flex; flex-direction: column; gap: 6px; align-items: center;
  opacity: 1; transition: opacity .45s ease; pointer-events: auto;
}
.side-rail.shown { opacity: 1; pointer-events: auto }
.side-rail a {
  position: relative; width: 36px; height: 36px; display: grid; place-items: center;
  background: transparent; border: 0; color: var(--ink);
  border-radius: 0;
  transition: color .3s ease, background-color .3s ease, transform .3s ease;
}
.side-rail a:nth-child(2) { transform: translateX(8px) }
.side-rail a:nth-child(3) { transform: translateX(-3px) }
.side-rail a:hover { background: transparent; color: var(--accent) }
.side-rail a + a { margin-top: 2px }
.side-rail a .icn {
  width: 24px;
  height: 24px;
  stroke-width: 1.55;
}
.side-rail a .rail-icon {
  width: 25px;
  height: 25px;
  object-fit: contain;
  opacity: .88;
  filter: invert(10%) sepia(16%) saturate(657%) hue-rotate(350deg) brightness(92%) contrast(92%);
  transition: opacity .25s ease, transform .25s ease;
}
.side-rail.on-dark a .rail-icon {
  filter: invert(96%) sepia(6%) saturate(589%) hue-rotate(333deg) brightness(100%) contrast(94%);
}
.side-rail.on-light a .rail-icon {
  filter: invert(10%) sepia(16%) saturate(657%) hue-rotate(350deg) brightness(92%) contrast(92%);
}
.side-rail a:hover .rail-icon {
  opacity: 1;
  transform: translateX(2px);
}
.side-rail a .tip {
  position: absolute; left: 44px; top: 50%; transform: translate(-8px, -50%);
  background: var(--ink); color: var(--cream); padding: 8px 14px;
  font-family: "Jost", sans-serif; font-size: 11px; letter-spacing: .02em;
  white-space: nowrap; opacity: 0; pointer-events: none;
  transition: opacity .25s, transform .25s ease;
}
.side-rail.on-light a .tip {
  background: var(--ink);
  color: var(--cream);
}
.side-rail.on-dark a .tip {
  background: var(--cream);
  color: var(--ink);
}
.side-rail a:hover .tip { opacity: 1; transform: translate(0, -50%) }

.mobile-bottom-actions {
  display: none;
}

/* Fixierter Anfrage-Button am rechten Rand (nur Desktop).
   Kein Rand mehr; Farben kehren sich je nach Hintergrund um (JS: on-dark/on-light):
   über dunkler Sektion → heller Button, über heller Sektion → dunkler Button. */
.anfrage-fixed {
  position: fixed; right: 0; top: 50%; z-index: 28;
  transform: translateY(-50%);
  display: none;
  writing-mode: vertical-rl;
  background: var(--ink); color: var(--cream);
  border: 0;
  font-family: "Jost", sans-serif; font-size: 12px; font-weight: 700;
  letter-spacing: .26em; text-transform: uppercase;
  padding: 26px 14px;
  transition: background .3s ease, color .3s ease, padding .3s ease;
}
.anfrage-fixed.on-dark { background: var(--cream); color: var(--ink); }
.anfrage-fixed.on-light { background: var(--ink); color: var(--cream); }
.anfrage-fixed:hover { padding-right: 20px; }
.anfrage-fixed.on-dark:hover { background: #ece4d5; }
.anfrage-fixed.on-light:hover { background: var(--bg-warm); }
@media (min-width: 1025px) {
  .anfrage-fixed { display: block }
}

.hero-link:hover .lbl span {
  transform: none;
}
.hero-link .lbl span:nth-child(2) {
  display: none;
}
.intro-copy p + p {
  margin-top: 26px;
}
.section p.serif:not(.serif-it) {
  font-family: "Jost", sans-serif;
  font-size: var(--copy-size);
  line-height: var(--copy-line);
  letter-spacing: 0;
}

/* Reveal on scroll */
.reveal { opacity: 0; transform: translateY(28px); transition: opacity .8s ease, transform .8s ease }
.reveal.in { opacity: 1; transform: none }
.reveal-d-1 { transition-delay: .08s }
.reveal-d-2 { transition-delay: .16s }
.reveal-d-3 { transition-delay: .24s }
.reveal-d-4 { transition-delay: .32s }

/* Marquee */
.marquee {
  overflow: hidden; border-block: var(--hairline); padding: 18px 0; background: var(--bg-paper);
}
.marquee.on-dark { background: var(--bg-night); border-color: var(--line-dark); color: var(--cream) }
.marquee-track {
  display: flex; gap: 60px; white-space: nowrap; align-items: center;
  font-family: "Playfair Display", serif; font-weight: 300;
  font-size: clamp(22px, 2.2vw, 30px); letter-spacing: .01em;
  animation: marq 60s linear infinite;
}
.marquee-track .marq-dot {
  width: 6px; height: 6px; background: var(--accent); border-radius: 50%; flex: 0 0 auto;
}
.marquee.on-dark .marquee-track .marq-dot { background: var(--accent-warm) }
@keyframes marq { from { transform: translateX(0) } to { transform: translateX(-50%) } }

/* Mobile menu drawer */
.drawer {
  position: fixed; inset: 0; z-index: 60; background: var(--bg-night); color: var(--cream);
  padding: 32px var(--pad-x); display: flex; flex-direction: column; gap: 24px; overflow: hidden;
  transform: translateY(-110%); transition: transform .35s ease, visibility 0s linear .35s;
  visibility: hidden;
}
.drawer.open { transform: translateY(0); visibility: visible; transition: transform .35s ease, visibility 0s linear 0s }
.drawer .row-top { display: flex; justify-content: space-between; align-items: center }
.drawer nav { display: flex; flex-direction: column; gap: 18px; margin-top: 40px }
.drawer nav a {
  font-family: "Playfair Display", serif; font-size: 42px; font-weight: 300; letter-spacing: 0;
}
.drawer nav a:nth-child(2n) { padding-left: clamp(18px, 12vw, 72px); color: var(--accent-warm) }
.nav-toggle {
  width: 42px; height: 42px;
  display: inline-grid; place-items: center;
  border: 0; color: var(--ink);
  border-radius: 0;
  background: transparent;
  transition: transform .28s ease, background .28s ease, color .28s ease;
}
.nav-toggle:hover { transform: scale(1.04); background: transparent; color: var(--accent) }

/* Icon helper */
.icn { width: 18px; height: 18px; flex: 0 0 auto; stroke: currentColor; fill: none; stroke-width: 1.4; stroke-linecap: round; stroke-linejoin: round }

/* Houses grid */
.house-photo-hero {
  min-height: 70svh;
}
.house-photo-hero .ph {
  width: 100%;
  height: 100%;
}
.house-photo-hero + .section > .container.narrow > p.serif {
  text-align: center;
  margin-inline: auto;
}
.houses-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 40px }
.houses-grid > *:nth-child(1) { transform: translateY(-18px) }
.houses-grid > *:nth-child(2) { transform: translateY(38px) }
.houses-grid > *:nth-child(3) { transform: translateY(6px) }
.houses-grid > *:hover { transition: transform .45s cubic-bezier(.2,.7,.2,1) }

@media (min-width: 1025px) {
  .home-hero { margin-top: 0 }
  .hero-link {
    border-color: rgba(246,241,231,.72);
    background: transparent;
  }
  .home-intro .container {
    max-width: 1420px;
  }
  .intro-editorial {
    min-height: 82svh;
    display: flex;
    align-items: center;
    padding-block: clamp(110px, 12vw, 180px);
    background: var(--bg-paper);
  }
  .intro-photo-wash {
    position: absolute;
    inset: 0;
    background:
      linear-gradient(359deg, rgb(244 237 224) 0%, rgba(244,237,224,.14) 0%, rgba(244,237,224,.62) 0%, rgb(244 237 224) 40%),
      linear-gradient(rgba(36,31,26,.2), rgba(36,31,26,.2)),
      url("gallery/img/web/balcony-view.webp") left center / cover no-repeat !important;
    opacity: 1;
    filter: grayscale(.12) saturate(.82) brightness(.82) !important;
    pointer-events: none;
  }
  .intro-heading {
    max-width: 860px;
    margin: 0 auto clamp(36px, 3.5vw, 52px);
    text-align: center;
    color: rgba(31,27,23,.74);
  }
  .intro-heading h2 {
    text-align: center;
  }
  .intro-copy {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 0;
    max-width: 920px;
    margin: 0 auto;
    text-align: center;
  }
  .intro-copy p {
    color: rgba(31,27,23,.68);
    font-size: var(--copy-size);
    line-height: var(--copy-line);
    font-weight: 300;
  }
  .intro-editorial .home-facts {
    max-width: 980px;
    margin-left: auto;
    margin-right: auto;
  }
  .home-intro-mark {
    display: grid;
    gap: 14px;
    width: min(190px, 42%);
    margin-top: 42px;
    color: var(--accent);
  }
  .home-intro-mark span {
    display: block;
    height: 1px;
    background: currentColor;
    opacity: .56;
  }
  .home-intro-mark span:nth-child(2) {
    width: 62%;
    margin-left: 38%;
  }
  .house-photo-hero {
    height: 100vh;
    min-height: 720px;
  }
  .house-photo-hero .ph {
    width: 100%;
    height: 100%;
    transform: none !important;
  }
  .home-facts > div {
    position: relative;
    min-height: 0;
    padding: 0;
    background: transparent;
    border: 0;
    display: flex;
    align-items: center;
    gap: 18px;
  }

  .home-page .home-facts {
    max-width: 920px;
    margin-left: auto !important;
    margin-right: auto !important;
    justify-items: center;
    align-items: center;
  }

  .home-page .home-facts > div {
    justify-content: center;
    width: 100%;
    text-align: left;
  }

  .home-page .home-facts > div:nth-child(2) {
    justify-content: center;
  }

  .home-facts .icn {
    width: 46px;
    height: 46px;
    color: var(--ink);
    margin-bottom: 0;
    stroke-width: 1.25;
  }
  .home-facts .serif {
    color: var(--ink);
  }
  .houses-grid > * {
    transition: none !important;
  }
  .houses-grid > *:nth-child(1),
  .houses-grid > *:nth-child(1):hover { transform: translateY(-18px) !important }
  .houses-grid > *:nth-child(2),
  .houses-grid > *:nth-child(2):hover { transform: translateY(38px) !important }
  .houses-grid > *:nth-child(3),
  .houses-grid > *:nth-child(3):hover { transform: translateY(6px) !important }
  .houses-grid > * [style*="aspect-ratio"] {
    overflow: hidden;
  }
  .houses-grid > * .ph {
    transform: none !important;
    transition: filter .45s ease;
  }
  .houses-grid > *:hover .ph {
    filter: saturate(1.04) contrast(1.02);
  }
  .hover-list {
    display: grid;
    gap: 0;
    border-top: 1px solid rgba(154,122,79,.24);
  }
  .hover-list .hl-img { display: none }
  .hover-list .hl-row {
    grid-template-columns: minmax(220px, .78fr) minmax(0, 1fr);
    min-height: 118px;
    padding: 28px 0 !important;
    border-top: 0;
    border-bottom: 1px solid rgba(154,122,79,.24);
    color: var(--ink);
    overflow: visible;
  }
  .hover-list .hl-row::after {
    display: none;
  }
  .hover-list .hl-row:hover {
    padding-left: 0 !important;
    padding-right: 0 !important;
    color: var(--ink);
  }
  .hover-list .hl-row.open {
    padding: 28px 0 !important;
  }
  .hover-list .hl-title {
    font-size: clamp(21px, 1.9vw, 30px);
    line-height: 1.12;
    letter-spacing: .08em;
    font-family: "Jost", sans-serif;
    transition: color .25s ease;
  }
  .hover-list .hl-row:hover .hl-num {
    color: var(--accent);
    transform: none;
  }
  .hover-list .hl-row:hover .hl-title,
  .hover-list .hl-row.open .hl-title {
    color: var(--accent);
    font-style: normal;
  }
  .hover-list .hl-desc {
    max-height: none;
    overflow: visible;
    opacity: .78;
    color: var(--ink-soft);
    transition: opacity .35s ease;
  }
  .hover-list .hl-row:hover .hl-desc,
  .hover-list .hl-row.open .hl-desc {
    opacity: 1;
    color: var(--ink-soft);
  }
  .hover-list .hl-media {
    position: absolute;
    right: 54px;
    /* An die eigene Zeile gebunden: nie höher als der Abschnitt, zu dem das Foto gehört */
    top: 14px;
    bottom: 14px;
    width: min(36vw, 460px);
    height: auto;
    max-height: none;
    overflow: hidden;
    opacity: 0;
    transform: scale(.96);
    pointer-events: none;
    transition: opacity .35s ease, transform .55s cubic-bezier(.2,.7,.2,1);
  }
  .hover-list .hl-media .ph {
    position: absolute;
    inset: 0;
    height: 100%;
    width: 100%;
    transform: none !important;
  }
  .home-page .hover-list .hl-row:hover .hl-media,
  .home-page .hover-list .hl-row.open .hl-media {
    opacity: 1;
    transform: scale(1);
  }
  body:not(.home-page) .hover-list .hl-media {
    display: none !important;
  }
  .hover-list .hl-arrow {
    width: 34px;
    height: 24px;
    display: grid;
    place-items: center;
    border: 0;
    border-radius: 0;
    color: var(--accent);
    background: transparent;
    transition: transform .35s ease, color .25s ease;
  }
  .hover-list .hl-row:hover .hl-arrow {
    transform: none;
    color: var(--accent);
  }
  .hover-list .hl-row.open .hl-arrow {
    transform: rotate(90deg);
    background: transparent;
  }
  .photo-fade-section {
    background: var(--bg-paper);
  }
  .experience-photo-wash {
    position: absolute;
    inset: 0;
    background:
      linear-gradient(268deg, rgba(244, 237, 224, 0) 0%, rgba(244, 237, 224, .2) 10%, rgb(244 237 224 / 95%) 36%),
      url("gallery/img/web/bath-stone.webp") right bottom / cover no-repeat;
    opacity: 1;
    filter: grayscale(.12) saturate(.78);
    pointer-events: none;
  }
  .faq-photo-section {
    background: var(--bg-paper);
  }
  .faq-photo-wash {
    position: absolute;
    inset: 0;
    background:
      linear-gradient(359deg, rgb(247 247 247 / 0%) 0%, rgba(244, 237, 224, .2) 0%, rgb(244 237 224) 36%),
      url("gallery/img/web/exterior-summer.webp") center bottom / cover no-repeat;
    opacity: 1;
    filter: grayscale(.16) saturate(.82);
    pointer-events: none;
  }
  .section h2 .serif-it,
  .section h3 .serif-it,
  #houses-section h2 .serif-it,
  .house-photo-hero h1 .serif-it {
    color: inherit !important;
  }
  .gallery-shell {
    position: relative;
    margin-left: calc(-1 * var(--pad-x));
    margin-right: calc(-1 * var(--pad-x));
  }
  .gallery-ribbon {
    display: flex;
    gap: clamp(34px, 4vw, 70px);
    align-items: flex-start;
    overflow-x: auto;
    overscroll-behavior-x: contain;
    scroll-snap-type: x mandatory;
    scroll-padding-inline: var(--pad-x);
    padding: 0 var(--pad-x) 16px;
    scrollbar-width: none;
  }
  .gallery-ribbon::-webkit-scrollbar {
    display: none;
  }
  .gallery-tile {
    position: relative;
    flex: 0 0 clamp(330px, 28vw, 500px);
    min-height: 360px;
    margin: 0;
    overflow: hidden;
    scroll-snap-align: start;
    transition: grid-column .45s ease, transform .45s ease;
  }
  /* Editorial-Versatz über feste Index-Klassen (NICHT nth-child): die Klone des
     Infinite-Loops erben per cloneNode die gt-Klasse und damit exakt dieselbe
     Breite/Höhe/Versatz wie ihr Original. Sonst zählt nth-child die Klone mit,
     die Klone bekommen andere Maße und der Loop-Übergang "ruckt" sichtbar. */
  .gallery-tile.gt-1 { flex-basis: clamp(380px, 31vw, 560px); min-height: 430px; margin-top: clamp(42px, 4vw, 82px) }
  .gallery-tile.gt-2 { flex-basis: clamp(300px, 22vw, 390px); min-height: 540px; margin-top: 0 }
  .gallery-tile.gt-3 { flex-basis: clamp(420px, 34vw, 620px); min-height: 380px; margin-top: clamp(84px, 7vw, 130px) }
  .gallery-tile.gt-4 { flex-basis: clamp(330px, 24vw, 440px); min-height: 470px; margin-top: clamp(20px, 2vw, 42px) }
  .gallery-tile.gt-5 { flex-basis: clamp(460px, 36vw, 660px); min-height: 410px; margin-top: clamp(96px, 8vw, 150px) }
  .gallery-tile.gt-6 { flex-basis: clamp(310px, 23vw, 420px); min-height: 500px; margin-top: clamp(36px, 3vw, 70px) }
  .gallery-tile.gt-7 { flex-basis: clamp(400px, 30vw, 570px); min-height: 350px; margin-top: clamp(120px, 10vw, 180px) }
  .gallery-tile.gt-8 { flex-basis: clamp(340px, 25vw, 470px); min-height: 530px; margin-top: clamp(8px, 1vw, 20px) }
  .gallery-tile .ph,
  .gallery-tile img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transform: none !important;
    transition: transform 1s cubic-bezier(.2,.7,.2,1);
  }
  .gallery-tile:hover .ph,
  .gallery-tile:hover img {
    transform: scale(1.055) !important;
  }
  .gallery-tile figcaption {
    display: none;
  }
  .gallery-controls {
    display: flex;
    justify-content: flex-end;
    gap: 14px;
    padding-inline: var(--pad-x);
    margin-top: clamp(10px, 2vw, 26px);
  }
  .gallery-arrow {
    width: 44px;
    height: 34px;
    display: grid;
    place-items: center;
    color: var(--ink);
    transition: color .2s ease, transform .25s ease;
  }
  .gallery-arrow:focus-visible {
    outline: 1px solid var(--ink);
    outline-offset: 6px;
  }
  .gallery-arrow:hover {
    color: var(--ink-soft);
    transform: translateX(2px);
  }
  .gallery-section {
    padding-top: clamp(78px, 9vw, 118px) !important;
    padding-bottom: clamp(12px, 2.2vw, 34px) !important;
  }
  .gallery-section + .faq-photo-section {
    padding-top: clamp(10px, 1.8vw, 28px) !important;
  }
  .text-link {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    font-family: "Jost", sans-serif;
    font-size: 11px;
    letter-spacing: .18em;
       color: var(--ink);
    transition: color .25s ease;
  }
  .text-link svg {
    transition: transform .3s ease;
  }
  .text-link:hover {
    color: var(--accent);
  }
  .text-link:hover svg {
    transform: translateX(6px);
  }
  .section h2.serif,
  #houses-section h2.serif,
  .gallery-section h2.serif {
    font-size: clamp(36px, 4.59vw, 73px) !important;
  }
  .faq-photo-section h2.serif {
    font-size: clamp(29px, 3.74vw, 58px) !important;
  }
  .faq-photo-section .container.narrow {
    max-width: 1120px;
  }
  .faq-heading {
    margin-bottom: clamp(28px, 3vw, 42px) !important;
  }
  .faq-photo-section .acc-head {
    padding: 24px 0;
  }
}

/* Newsletter input */
.news-input { background: transparent; border: 1px solid var(--line-dark); border-right: none; padding: 18px 22px; color: var(--cream); font-family: "Jost", sans-serif; font-size: 14px; transition: border-color .25s, outline-color .25s }
.news-input:focus-visible { border-color: var(--accent-warm); outline: 2px solid var(--accent-warm); outline-offset: 3px }
.news-input::placeholder { color: rgba(246,241,231,.4) }

/* Tags */
.tag {
  display: inline-flex; align-items: center; gap: 8px; padding: 8px 14px;
  border: 1px solid var(--line); font-size: 11px; letter-spacing: .16em;  color: var(--ink-soft); transition: border-color .3s, color .3s;
}
.tag:hover { border-color: var(--ink); color: var(--ink) }
.tag.on-dark { border-color: var(--line-dark); color: rgba(246,241,231,.7) }
.tag .dot { width: 5px; height: 5px; background: var(--accent); flex: 0 0 auto }

/* ─── Form pages (booking form, legal pages) ─── */

.booking-form {
  max-width: 920px; margin: 0 auto;
  padding: clamp(1.5rem, 4vw, 3rem);
  background: var(--bg-paper); border: 1px solid var(--line);
}

.bf-card-title {
  margin: 0 0 1.25rem;
  font-family: "Playfair Display", serif;
  font-size: clamp(1.8rem, 4vw, 3rem); font-weight: 300; line-height: 1.08;
}

.form-row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; margin-bottom: 1rem }
.form-row.full { grid-template-columns: 1fr }
.form-group { display: grid; gap: .4rem }
.bf-room-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  margin: .25rem 0 .7rem;
}
.bf-room-heading {
  margin: 0;
  font-family: "Jost", sans-serif;
  font-size: clamp(1rem, 1.15vw, 1.12rem);
  font-weight: 400;
  line-height: 1.25;
  color: var(--ink);
}
.form-group label, .bf-privacy-row label {
  font-family: "Jost", sans-serif;
  font-size: clamp(.9rem, .95vw, .98rem);
  font-weight: 300;
  line-height: 1.45;
  color: var(--ink-soft);
}

input, select, textarea {
  width: 100%; min-height: 3rem; padding: .75rem .85rem;
  border: 1px solid var(--line); border-radius: 0;
  background: var(--bg-paper); color: var(--ink);
  font-family: "Jost", sans-serif;
  font-size: clamp(1rem, 1.05vw, 1.08rem);
  font-weight: 300;
  line-height: 1.35;
  letter-spacing: .01em;
}
input::placeholder, textarea::placeholder {
  color: rgba(62, 55, 48, .58);
  opacity: 1;
}
textarea { min-height: 8rem; resize: vertical }

.bf-divider { height: 1px; margin: 2rem 0; background: var(--line) }
.bf-honeypot { position: absolute; left: -9999px }
.bf-add-row, .bf-submit-row { margin-top: 1rem }
.bf-add-btn, .bf-remove-btn {
  border: 1px solid var(--line);
  background: var(--bg-paper);
  min-height: 2.6rem;
  padding: .65rem .9rem;
  cursor: pointer;
  font-family: "Jost", sans-serif;
  font-size: .78rem;
  font-weight: 400;
  letter-spacing: .12em;
 }
.bf-privacy-row { display: grid; grid-template-columns: auto minmax(0,1fr); gap: .75rem; align-items: start; margin-top: 1.25rem }
.bf-privacy-row input { width: auto; min-height: auto; margin-top: .25rem }
.bf-submit-btn {
  display: inline-flex; align-items: center; justify-content: center;
  min-height: 2.8rem; padding: .75rem 1rem;
  border: 1px solid var(--ink); background: var(--ink); color: var(--cream);
  font: 500 .82rem/1 "Jost", sans-serif; letter-spacing: .06em;  cursor: pointer; transition: background-color .3s, color .3s, border-color .3s;
}
.bf-submit-btn:hover { background: transparent; color: var(--ink) }
.bf-message { max-width: 920px; margin: 0 auto 1rem }

.gs-form-section { padding: 0 0 clamp(5rem, 10vw, 9rem) }
.gs-anfrage-intro { padding: clamp(4rem, 9vw, 7rem) 0; text-align: center }
.gs-anfrage-intro h2 {
  margin: 0 auto 1rem; max-width: 820px;
  font-family: "Playfair Display", serif; font-size: clamp(2.4rem, 6vw, 5rem); font-weight: 300; line-height: 1.04;
}
.gs-anfrage-intro p { max-width: 680px; margin-left: auto; margin-right: auto; color: var(--ink-soft) }

/* Legal content */
.legal-content, .legal-content-full {
  max-width: 880px; margin: 0 auto; padding: clamp(3rem, 8vw, 6rem) 0;
}
.legal-content h1, .legal-content h2, .legal-content h3 { color: var(--ink); line-height: 1.18 }
.legal-content h1 {
  margin: 0 0 2rem; font-family: "Playfair Display", serif;
  font-size: clamp(2.5rem, 6vw, 5rem); font-weight: 300;
}
.legal-content h2 { margin: 3.4rem 0 1rem; font-size: clamp(1.35rem, 3vw, 2rem); font-weight: 400 }
.legal-content h3 { margin: 2.2rem 0 .6rem; font-size: clamp(1.1rem, 2vw, 1.35rem); font-weight: 400 }
.legal-content p, .legal-content li { color: var(--ink-soft); line-height: 1.75 }
.legal-content p { margin-bottom: 1.15rem }
.legal-content p:last-child { margin-bottom: 0 }
.legal-content ul, .legal-content ol { margin: 0 0 1.15rem 1.3rem }
.legal-content li { margin-bottom: .5rem }
.legal-content h2:first-of-type { margin-top: 1.5rem }
.legal-content p, .legal-content li,
.legal-content h1, .legal-content h2, .legal-content h3 {
  text-align: left;
}
.legal-nav {
  display: flex;
  justify-content: center;
  gap: 18px;
  flex-wrap: wrap;
  margin-top: 3rem;
}
.legal-nav a {
  color: var(--accent);
  border-bottom: 1px solid rgba(154,122,79,.35);
}

/* Page hero for subpages */
.page-hero {
  position: relative;
  overflow: hidden;
  padding: clamp(8rem, 14vw, 12rem) 0 clamp(4.5rem, 8vw, 7rem);
  min-height: clamp(420px, 52vh, 640px);
  background: var(--bg);
  border-bottom: 0;
  text-align: center;
  display: flex;
  align-items: center;
}
.page-hero h1 {
  display: block;
  font-family: "Playfair Display", serif;
  font-size: clamp(46px, 6.12vw, 100px);
  line-height: .9;
  font-weight: 300;
  letter-spacing: -.012em;
  color: var(--cream);
  margin: 0 auto;
  text-align: center;
}
.page-hero p:first-child {
  display: block;
  font-family: "Jost", sans-serif;
  font-size: 11px;
  letter-spacing: .24em;
  text-transform: uppercase;
  color: rgba(246,241,231,.72);
  margin: 0 0 18px;
}
.page-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  background: url("gallery/img/web/interior-alpine-light.webp") center center / cover no-repeat;
  opacity: 1;
}
.page-hero::after {
  display: none;
}
.page-hero > .container {
  position: relative;
  z-index: 1;
  display: flex;
  min-height: inherit;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
}

/* Confirmation (success) page — pin the footer to the viewport bottom on short pages
   so there is never empty (cream) space below the footer */
body.success-page { min-height: 100vh; display: flex; flex-direction: column }
body.success-page > main.template-main { flex: 1 0 auto }
body.success-page > .site-footer { flex-shrink: 0 }

/* Flatpickr: the global `input, select, textarea` rule (full width, 3rem min-height,
   padding + border) would otherwise blow up Flatpickr's inline year field and overlap
   the month/year header with the weekday row. Restore Flatpickr's intended sizing. */
.flatpickr-calendar input.numInput,
.flatpickr-current-month input.cur-year {
  width: auto;
  min-height: 0;
  padding: 0 0 0 .5ch;
  border: 0;
  border-radius: 0;
  background: transparent;
  font-size: inherit;
  line-height: inherit;
}

/* Footer */
.site-footer { background: var(--bg-dark); color: var(--cream); padding: clamp(120px,12vw,180px) 0 36px; position: relative; overflow: hidden }
.site-footer.dark { padding: clamp(120px,12vw,180px) 0 36px !important; }
.site-footer .footer-grid {
  display: grid; grid-template-columns: 1.4fr 1fr 1fr 1fr; gap: 48px; position: relative;
}
.site-footer .footer-bottom {
  grid-column: 1 / -1; border-top: 1px solid var(--line-dark); margin-top: 40px; padding-top: 24px;
  display: flex; justify-content: space-between; flex-wrap: wrap; gap: 12px;
}
.site-footer .footer-bottom span {
  font-family: "JetBrains Mono", monospace; font-size: 11px; letter-spacing: .22em;
   color: rgba(246,241,231,.5);
}
.site-footer a { color: rgba(246,241,231,.78); transition: color .2s }
.site-footer a:hover { color: var(--cream) }
footer.dark > .wm,
.site-footer > .wm {
  top: auto !important;
  bottom: -.24em !important;
  transform: translateX(-50%) !important;
  line-height: .8;
}
footer.dark div[style*="grid-column:1/-1"] span,
.site-footer .footer-bottom span,
.site-footer-inner p {
  font-family: "Jost", sans-serif !important;
  letter-spacing: .03em !important;
  text-transform: none !important;
}
footer a[href*="uptomade"],
.site-footer a[href*="uptomade"] {
  font-family: "Jost", sans-serif !important;
  letter-spacing: .02em !important;
  text-transform: lowercase !important;
}

/* Back link */
.back-link {
  font-size: 11px; letter-spacing: .24em;  color: var(--ink-soft);
  display: inline-flex; align-items: center; gap: 10px; white-space: nowrap;
}
.back-link:hover { color: var(--ink) }

/* Brand italic */
.brand-it { color: var(--accent) }

/* Active dot on topnav */
.topnav a.active { color: var(--ink) }
.topnav a.active::after {
  content: ""; position: absolute; left: 50%; bottom: -2px; width: 5px; height: 5px; border-radius: 50%;
  background: var(--accent); transform: translateX(-50%);
}
@media (min-width: 1025px) {
  .headbar.at-top .topnav a.active::after,
  .headbar.is-scrolled .topnav a.active::after {
    bottom: -7px;
    background: currentColor;
    opacity: .95;
  }
}

/* Timeline */
.timeline { position: relative; padding-left: 48px }
section:has(.timeline) > .container {
  max-width: min(1180px, calc(100vw - (var(--pad-x) * 2)));
}
section:has(.timeline) .stack-sm {
  max-width: 100%;
}
.timeline::before {
  content: ""; position: absolute; left: 12px; top: 0; bottom: 0; width: 1px;
  background: linear-gradient(180deg, transparent 0%, var(--line) 8%, var(--line) 92%, transparent 100%);
}
.timeline-row { position: relative; padding: 32px 0; border-bottom: 1px solid var(--line); transition: padding .35s, background .35s }
.timeline-row:first-child { border-top: 1px solid var(--line) }
.timeline-row:last-child { border-bottom: none }
.timeline-row::before {
  content: ""; position: absolute; left: -43px; top: 42px;
  width: 13px; height: 13px; border: 1px solid var(--accent); background: var(--bg);
  border-radius: 50%;
  transition: transform .45s cubic-bezier(.7,0,.2,1), background .35s, border-color .35s;
}
.timeline-row:hover::before { background: var(--accent); transform: scale(1.4) }
.timeline-row:hover { padding-left: 14px }
.dark .timeline::before { background: linear-gradient(180deg, transparent 0%, var(--line-dark) 8%, var(--line-dark) 92%, transparent 100%) }
.dark .timeline-row { border-color: var(--line-dark) }
.dark .timeline-row::before { background: var(--bg-dark); border-color: var(--accent-warm) }
.dark .timeline-row:hover::before { background: var(--accent-warm) }

/* Material card */
.mat-card { position: relative; cursor: pointer }
.mat-card .mat-img { position: relative; aspect-ratio: 3/4; overflow: hidden; background: var(--bg-soft) }
.mat-card .mat-img .ph { position: absolute; inset: 0; transition: transform 1.2s cubic-bezier(.2,.7,.2,1) }
.mat-card:hover .mat-img .ph { transform: scale(1.08) }
.mat-card .mat-num {
  position: absolute; left: 18px; top: 18px; z-index: 3;
  font-family: "JetBrains Mono", monospace; font-size: 11px; letter-spacing: .32em;
  color: var(--cream); transition: transform .5s;
}
.mat-card:hover .mat-num { transform: translateX(6px) }
.mat-card .mat-tag {
  position: absolute; left: 18px; bottom: 0; z-index: 3; color: var(--cream);
  transform: translateY(110%); transition: transform .55s cubic-bezier(.2,.7,.2,1);
  padding-bottom: 18px;
}
.mat-card:hover .mat-tag { transform: translateY(0) }
.mat-card .mat-tag::before {
  content: ""; display: block; width: 24px; height: 1px; background: var(--accent-warm); margin-bottom: 10px;
}

/* Zoom wrap */
.zoom-wrap { position: relative; overflow: hidden }
.zoom-wrap .ph { transition: transform 1.1s cubic-bezier(.2,.7,.2,1) }
.zoom-wrap:hover .ph { transform: scale(1.06) }

/* Link button */
.link-btn {
  display: inline-flex; align-items: baseline; gap: 14px;
  font-family: "Jost", sans-serif; font-size: 12px; letter-spacing: .04em;
  color: var(--ink); cursor: pointer; background: none; border: none; padding: 0;
}
.link-btn.on-dark { color: var(--cream) }
.link-btn .label { position: relative; display: inline-block; overflow: hidden; line-height: 1.4 }
.link-btn .label::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: -2px; height: 1px; background: currentColor;
  transform-origin: right; transform: scaleX(0); transition: transform .5s cubic-bezier(.65,.05,.2,.95);
}
.link-btn:hover .label::after { transform-origin: left; transform: scaleX(1) }
.link-btn .arr-line { display: inline-flex; width: 36px; height: 1px; background: currentColor; position: relative; transition: width .4s ease }
.link-btn .arr-line::after {
  content: ""; position: absolute; right: -1px; top: -3px; width: 7px; height: 7px;
  border-top: 1px solid currentColor; border-right: 1px solid currentColor; transform: rotate(45deg);
}
.link-btn:hover .arr-line { width: 54px }

/* Apartment slider */
.apt-fade { transition: opacity .5s ease, transform .6s cubic-bezier(.2,.7,.2,1) }
.apt-fade.exiting { opacity: 0; transform: translateY(18px) }
.apt-number-wm {
  position: absolute; pointer-events: none; user-select: none;
  font-family: "Playfair Display", serif; font-weight: 300;
  font-size: clamp(220px, 32vw, 460px); line-height: .78;
  color: transparent; -webkit-text-stroke: 1px rgba(154,122,79,.3);
  transition: opacity .5s ease, transform .6s cubic-bezier(.2,.7,.2,1);
}
.apt-number-wm.exiting { opacity: 0; transform: translateY(-22px) scale(.96) }

.house-apartments {
  background: var(--bg-paper);
}
.house-apt-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  gap: 32px;
  flex-wrap: wrap;
  margin-bottom: clamp(44px, 6vw, 78px);
}
.house-apt-head h2 {
  font-size: clamp(34px, 4.59vw, 71px);
  line-height: .98;
  font-weight: 300;
  letter-spacing: -.008em;
}
.house-apt-head > p {
  max-width: 390px;
  color: var(--ink-soft);
  line-height: 1.72;
  font-size: 14px;
}
.house-apt-eyebrow {
  font-size: 12px;
  letter-spacing: .18em;
   color: var(--ink-soft);
  margin-bottom: 18px;
}
.house-apt-layout {
  display: grid;
  grid-template-columns: minmax(260px, .52fr) minmax(0, 1.48fr);
  gap: clamp(40px, 5vw, 78px);
  align-items: start;
}
.house-apt-list {
  border-top: 1px solid var(--line);
  position: sticky;
  top: 132px;
}
.house-apt-row {
  width: 100%;
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr) 28px;
  column-gap: 22px;
  row-gap: 6px;
  align-items: baseline;
  text-align: left;
  padding: 24px 0;
  border-bottom: 1px solid var(--line);
  color: var(--ink-soft);
  transition: color .25s ease, padding-left .25s ease;
}
.house-apt-row::after {
  content: "→";
  grid-column: 3;
  grid-row: 1 / span 2;
  align-self: center;
  font-size: 22px;
  opacity: 0;
  transform: translateX(-10px);
  transition: opacity .25s ease, transform .25s ease;
}
.house-apt-row span {
  display: block;
  grid-row: 1 / span 2;
  font-size: 28px;
  line-height: 1;
  color: rgba(36,31,26,.38);
  transition: color .25s ease, transform .25s ease;
}
.house-apt-row strong {
  font-family: "Playfair Display", serif;
  font-size: clamp(24px, 2.4vw, 36px);
  line-height: 1;
  font-weight: 300;
  color: var(--ink);
}
.house-apt-row em {
  grid-column: 2;
  font-style: normal;
  font-size: 13px;
  color: var(--ink-soft);
}
.house-apt-row:hover,
.house-apt-row.apt-row-active {
  color: var(--ink);
  padding-left: 8px;
}
.house-apt-row:hover::after,
.house-apt-row.apt-row-active::after {
  opacity: .75;
  transform: translateX(0);
}
.house-apt-row:hover span,
.house-apt-row.apt-row-active span {
  color: var(--ink);
  transform: translateX(4px);
}
.house-apt-stage {
  position: relative;
  min-height: clamp(540px, 48vw, 720px);
}
.house-apt-panel {
  position: absolute;
  inset: 0;
  display: grid;
  grid-template-columns: minmax(300px, .88fr) minmax(0, 1fr);
  gap: clamp(28px, 4vw, 64px);
  align-items: center;
}
.house-apt-panel[hidden] {
  display: none;
}
.house-apt-photo {
  min-height: clamp(360px, 34vw, 540px);
  height: auto;
  aspect-ratio: 4 / 5;
}
.house-apt-copy {
  padding: clamp(34px, 4vw, 58px) clamp(12px, 2vw, 26px) clamp(86px, 7vw, 118px) 0;
}
.house-apt-copy .mono {
  font-size: 11px;
  letter-spacing: .16em;
   color: var(--ink-soft);
  margin-bottom: 18px;
}
.house-apt-copy h3 {
  font-size: clamp(37px, 5.1vw, 82px);
  line-height: .9;
  font-weight: 300;
  letter-spacing: -.008em;
}
.house-apt-copy p:not(.mono) {
  margin-top: 28px;
  max-width: 560px;
  color: var(--ink-soft);
  line-height: var(--copy-line);
  font-size: var(--copy-size);
}
.house-apt-copy .link-btn {
  margin-top: 34px;
}
.house-apt-controls {
  position: absolute;
  left: 0;
  right: auto;
  bottom: clamp(-22px, -1.2vw, -12px);
  display: flex;
  align-items: center;
  gap: 18px;
}
.house-apt-controls > .mono {
  display: none;
}
.house-apt-dots {
  display: none;
}
.house-apt-controls .nav-arrow {
  width: 54px;
  height: 34px;
  border: 0;
  background: transparent;
  padding: 0;
}
.house-apt-controls .nav-arrow svg {
  width: 26px;
  height: 16px;
}
.house-apt-controls .nav-arrow:hover:not(:disabled) {
  background: transparent;
  color: var(--ink-soft);
  border-color: transparent;
  transform: translateX(3px);
}

.house-photo-composition {
  position: relative;
  overflow: hidden;
}
.house-photo-composition > .container {
  position: relative;
}
.house-photo-wash {
  position: absolute;
  inset: 0;
  background: linear-gradient(360deg, rgba(244, 237, 224, .18) 0%, rgba(244, 237, 224, .72) 34%, rgb(244 237 224) 78%), url(gallery/img/web/balcony-view.webp) center top / cover no-repeat;
  opacity: 1;
  filter: grayscale(.18) saturate(.82);
  pointer-events: none;
}

.house-location-section {
  padding: clamp(96px, 12vw, 160px) 0;
  position: relative;
  overflow: hidden;
}
.house-location-grid {
  display: grid;
  grid-template-columns: minmax(0, .82fr) minmax(0, 1fr);
  gap: clamp(44px, 7vw, 110px);
  align-items: end;
  position: relative;
}
.house-location-photo {
  min-height: clamp(420px, 42vw, 620px);
  aspect-ratio: 4 / 5;
}
.house-location-copy {
  padding-bottom: clamp(20px, 4vw, 70px);
}
.house-location-copy .mono {
  font-size: 12px;
  letter-spacing: .18em;
   color: rgba(244,237,224,.58);
  margin-bottom: 22px;
}
.house-location-copy h2 {
  font-size: clamp(36px, 5.1vw, 78px);
  line-height: .98;
  font-weight: 300;
  letter-spacing: -.008em;
}
.house-location-copy h2 .serif-it {
  color: var(--accent-warm);
}
.house-location-copy > p:not(.mono) {
  max-width: 520px;
  margin-top: 30px;
  color: rgba(244,237,224,.72);
  line-height: var(--copy-line);
  font-size: var(--copy-size);
}
.house-location-actions {
  display: flex;
  align-items: center;
  gap: 20px;
  flex-wrap: wrap;
  margin-top: 38px;
}
.house-location-section > .wm {
  left: 50% !important;
  right: auto !important;
  top: -.22em !important;
  transform: translateX(-50%);
  text-align: center;
}
.season-hero-photo {
  align-self: end;
  max-height: min(72vh, 640px);
}
.map-modal {
  position: fixed;
  inset: 0;
  z-index: 80;
  display: grid;
  place-items: center;
  padding: var(--pad-x);
  background: rgba(36,31,26,.74);
  backdrop-filter: blur(14px);
}
.map-modal[hidden] {
  display: none;
}
.map-modal-frame {
  width: min(1080px, 92vw);
  height: min(680px, 76vh);
  background: var(--bg-dark);
  box-shadow: 0 44px 120px -60px rgba(0,0,0,.7);
}
.map-modal-frame iframe {
  width: 100%;
  height: 100%;
  border: 0;
  display: block;
}
.location-map-frame {
  position: relative;
  height: clamp(460px, 62vh, 720px);
  border: 1px solid var(--line);
  overflow: hidden;
  background: var(--bg-paper);
  box-shadow: 0 44px 120px -78px rgba(36,31,26,.72);
}
.location-map-frame iframe {
  width: 100%;
  height: 100%;
  border: 0;
  display: block;
  filter: grayscale(.18) saturate(.86);
}
.location-distances {
  background: var(--bg);
}
.location-distances .experience-photo-wash {
  display: none;
}
.apt-show-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  gap: 28px;
  flex-wrap: wrap;
  margin-bottom: clamp(48px, 6vw, 78px);
}
.apt-show-head h2 {
  font-size: clamp(36px, 5.44vw, 92px);
  line-height: .96;
  font-weight: 300;
  letter-spacing: -.012em;
}
.apt-show-head p {
  display: none;
}
.apt-showcase > .wm.solid {
  left: 50% !important;
  right: auto !important;
  top: auto !important;
  bottom: clamp(18px, 4vw, 72px) !important;
  transform: translateX(-50%) !important;
  font-size: clamp(190px, 28vw, 420px) !important;
  line-height: 1;
  opacity: .5;
}
.apt-show-grid {
  display: grid;
  grid-template-columns: minmax(250px, .32fr) minmax(0, .9fr);
  gap: clamp(34px, 5vw, 78px);
  align-items: start;
}
.apt-card-list {
  display: grid;
  gap: 10px;
  position: sticky;
  top: 132px;
}
.apt-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 28px;
  gap: 4px 16px;
  align-items: baseline;
  text-align: left;
  padding: 18px 0;
  border-bottom: 1px solid var(--line);
  color: var(--ink-soft);
  transition: color .25s ease;
}
.apt-card::after {
  content: "→";
  grid-column: 2;
  grid-row: 1 / span 2;
  align-self: center;
  color: currentColor;
  font-size: 23px;
  line-height: 1;
  opacity: .62;
  transform: translateX(-8px);
  transition: opacity .25s ease, transform .25s ease;
}
.apt-card.active {
  color: var(--ink);
}
.apt-card.active::after {
  opacity: 1;
  transform: translateX(0);
}
.apt-card-num {
  grid-row: 1 / span 2;
  font-family: "Playfair Display", serif;
  font-size: 28px;
  color: rgba(36,31,26,.42);
}
.apt-card-title {
  /* Sans-Serif wie in der Navigation (Jost), kein Serif-Display mehr */
  font-family: "Jost", sans-serif;
  font-weight: 400;
  font-size: clamp(18px, 1.7vw, 25px);
  letter-spacing: .14em;
  line-height: 1.1;
  color: var(--ink);
}
.apt-card-meta {
  font-size: 12px;
  letter-spacing: .04em;
}

/* Preis-Modal — helle Preisliste nach Datumszeiträumen */
[data-price-modal] .price-modal-inner {
  display: block;
  width: min(1180px, 96vw) !important;
  max-width: 96vw !important;
  min-height: 0;
  max-height: min(760px, 88vh);
  overflow: auto;
  background: var(--bg);
  color: var(--ink);
  padding: clamp(26px, 4vw, 54px);
}
.price-modal-panel[hidden] {
  display: none;
}
.price-list-title {
  margin: 0 0 clamp(28px, 4vw, 48px);
  font-family: "Jost", sans-serif;
  font-size: clamp(24px, 2.5vw, 36px);
  line-height: 1.1;
  font-weight: 400;
  letter-spacing: 0;
  color: var(--ink);
}
.price-list-unit {
  display: inline-block;
  margin-left: .5em;
  transform: translateY(-.05em);
  font-family: "Jost", sans-serif;
  font-size: clamp(13px, 1.05vw, 16px);
  font-weight: 400;
  font-style: italic;
  letter-spacing: 0;
  text-transform: none;
  color: var(--ink-soft);
  white-space: nowrap;
}
.price-list-scroll {
  width: 100%;
  overflow-x: auto;
  overscroll-behavior-x: contain;
  scroll-behavior: smooth;
}
.price-list-table {
  width: 100%;
  min-width: 860px;
  border-collapse: collapse;
  table-layout: fixed;
  font-size: clamp(13px, 1vw, 15px);
}
.price-list-table th,
.price-list-table td {
  border-bottom: 1px solid rgba(36,31,26,.24);
  padding: clamp(13px, 1.3vw, 18px) clamp(12px, 1.4vw, 22px);
}
.price-list-table th {
  font-weight: 400;
  color: rgba(36,31,26,.7);
  text-align: center;
}
.price-list-table th:first-child,
.price-list-table td:first-child {
  width: min(330px, 30vw);
  text-align: left;
}
.price-date-label {
  vertical-align: bottom;
}
.price-date-label span,
.price-date-range span {
  display: block;
}
.price-date-range span + span,
.price-date-label span + span {
  margin-top: 10px;
}
.price-date-range {
  white-space: nowrap;
}
.price-list-table td {
  color: rgba(36,31,26,.76);
  text-align: center;
}
.price-list-table td:first-child {
  color: rgba(36,31,26,.72);
}
.price-list-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  margin-top: clamp(34px, 4vw, 54px);
}
.price-list-back {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  border: 0;
  background: transparent;
  color: rgba(36,31,26,.68);
  font-family: "Jost", sans-serif;
  font-size: clamp(15px, 1.3vw, 18px);
  cursor: pointer;
}
.price-list-back svg {
  width: 14px;
  height: 14px;
}
.price-list-request {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 58px;
  padding: 16px 26px;
  border: 1px solid var(--ink);
  background: var(--ink);
  color: var(--cream);
  font-family: "Jost", sans-serif;
  font-size: 15px;
  font-weight: 400;
  letter-spacing: .06em;
  text-decoration: none;
  transition: background .35s ease, border-color .35s ease, color .35s ease;
}
.price-list-request:visited {
  color: var(--cream);
}
.price-list-request:hover,
.price-list-request:focus-visible {
  border-color: var(--accent);
  background: var(--accent);
  color: var(--cream);
}
.price-list-nav {
  display: flex;
  gap: 18px;
  margin-bottom: 16px;
  justify-content: flex-start;
}
.price-list-nav button {
  width: 36px;
  height: 36px;
  border: 1px solid rgba(36,31,26,.32);
  border-radius: 0;
  display: grid;
  place-items: center;
  background: transparent;
  color: var(--ink);
  cursor: pointer;
  transition: border-color .25s ease, color .25s ease, background .25s ease, transform .25s ease;
}
.price-list-nav button:hover,
.price-list-nav button:focus-visible {
  border-color: var(--ink);
  background: var(--ink);
  color: var(--cream);
}
.price-list-nav button[data-price-scroll="prev"]:hover svg,
.price-list-nav button[data-price-scroll="prev"]:focus-visible svg {
  transform: translateX(-3px);
}
.price-list-nav button[data-price-scroll="next"]:hover svg,
.price-list-nav button[data-price-scroll="next"]:focus-visible svg {
  transform: translateX(3px);
}
.price-list-nav button svg {
  transition: transform .25s ease;
}
[data-price-modal] .apt-modal-close {
  background: var(--bg);
  color: var(--ink);
}

.offers-section {
  position: relative;
  overflow: hidden;
  background: var(--bg-dark);
  color: var(--cream);
  padding-block: clamp(60px, 7.7vw, 105px);
}
.offers-section::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(180deg, rgba(246,241,231,.035), transparent 22%, rgba(0,0,0,.1) 100%),
    radial-gradient(80% 70% at 12% 0%, rgba(176,138,90,.14), transparent 58%);
  pointer-events: none;
}
.offers-section .wm {
  left: -.08em;
  top: -.22em;
  font-size: clamp(220px, 35vw, 560px);
  color: rgba(246,241,231,.045);
  opacity: 1;
}
.offers-heading {
  display: block;
  max-width: min(720px, 100%);
  margin: 0 auto clamp(24px, 3.5vw, 45px);
  text-align: center;
}
.offers-heading .mono {
  grid-column: 1 / -1;
  margin: 0 0 -12px;
  font-size: 12px;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: rgba(246,241,231,.56);
}
.offers-heading h2 {
  max-width: 10ch;
  margin: 0 auto;
  font-size: clamp(38px, 6.4vw, 99px);
  line-height: .88;
  font-weight: 300;
  letter-spacing: -.014em;
  color: var(--cream);
  text-align: center;
  text-wrap: balance;
}
.offers-heading .copy-text {
  max-width: 560px;
  margin-inline: auto;
  color: rgba(246,241,231,.72);
}
.offers-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(22px, 3vw, 42px);
  align-items: start;
}
.offer-card {
  display: grid;
  align-content: start;
  min-width: 0;
  color: var(--cream);
}
.offer-image {
  position: relative;
  aspect-ratio: 4 / 3;
  overflow: hidden;
  background: rgba(246,241,231,.1);
}
.offer-image img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.offer-date {
  margin: 22px 0 12px;
  font-family: "Jost", sans-serif;
  font-size: 15px;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: rgba(246,241,231,.58);
}
.offer-card h3 {
  margin: 0;
  font-size: clamp(24px, 2.72vw, 40px);
  line-height: .98;
  font-weight: 300;
  letter-spacing: -.008em;
  text-wrap: balance;
  color: var(--cream);
}
.offer-card p:not(.offer-date) {
  margin: 18px 0 26px;
  color: rgba(246,241,231,.76);
  font-size: var(--copy-size-mobile);
  line-height: 1.48;
}
.offer-card .btn {
  justify-self: start;
  width: fit-content;
  max-width: 100%;
  border-color: rgba(246,241,231,.46);
  color: var(--cream);
}
.offer-card .btn::before {
  background: var(--cream);
}
.offer-card .btn:hover {
  color: var(--ink);
  border-color: var(--cream);
}

@media (max-width: 1024px) {
  [data-price-modal] .price-modal-inner {
    max-height: 86svh;
  }
  .price-list-table {
    min-width: 780px;
  }
  .price-list-footer {
    align-items: stretch;
    flex-direction: column;
  }
  .price-list-request {
    width: fit-content;
    max-width: 100%;
  }
  .offers-heading {
    display: block;
    margin-bottom: 24px;
  }
  .offers-heading .mono {
    margin-bottom: 16px;
  }
  .offers-heading .copy-text {
    margin-top: 20px;
  }
  .offers-grid {
    grid-template-columns: 1fr;
    gap: 38px;
  }
  .offer-card h3 {
    font-size: clamp(24px, 7.2vw, 34px);
  }
}

@media (max-width: 720px) {
  .offers-section {
    padding-block: 46px 55px;
  }
  .offers-section .wm {
    font-size: 210px;
    top: -.12em;
  }
  .offers-heading {
    max-width: none;
  }
  .offers-heading h2 {
    max-width: none;
    color: var(--cream);
    font-size: clamp(34px, 4.59vw, 65px);
    line-height: .98;
    font-weight: 300;
    letter-spacing: -.008em;
    margin: 0 auto;
    text-wrap: balance;
  }
  .offer-image {
    aspect-ratio: 1.2;
  }
  .offer-card .btn {
    width: fit-content;
    max-width: none;
  }
}
.apt-panel-wrap {
  min-height: clamp(460px, 42vw, 620px);
  position: relative;
}
.apt-show-panel {
  display: grid;
  grid-template-columns: minmax(0, .8fr) minmax(300px, .68fr);
  gap: clamp(20px, 2.6vw, 40px);
  align-items: start;
}
.apt-show-panel[hidden] { display: none }
.apt-photo-triptych {
  grid-column: 1;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, .78fr);
  grid-template-rows: minmax(0, 1fr) minmax(0, 1fr);
  gap: clamp(14px, 1.5vw, 22px);
  min-height: clamp(320px, 31vw, 460px);
}
.apt-shot {
  width: 100%;
  height: 100%;
  min-height: 0;
  box-shadow: none;
}
.apt-shot.big { grid-row: 1 / span 2 }
.apt-shot.small { aspect-ratio: auto }
.apt-shot.wide {
  aspect-ratio: auto;
}
/* 6-Bild-Variante des Apartment-Fotofelds (3 Spalten × 2 Reihen).
   Überschreibt das 3er-Triptychon für Wohnungen mit sechs Fotos. */
.apt-photo-triptych.six {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  grid-template-rows: repeat(2, minmax(0, 1fr));
  min-height: clamp(360px, 34vw, 540px);
}
.apt-photo-triptych.six .apt-shot {
  grid-row: auto;
  grid-column: auto;
  aspect-ratio: auto;
}
.apt-show-copy {
  grid-column: 2;
  grid-row: 1;
}
.apt-show-copy .mono {
  display: none;
}
.apt-show-copy h3 {
  font-size: clamp(36px, 4.42vw, 66px);
  line-height: .9;
  font-weight: 300;
  letter-spacing: -.012em;
}
.apt-show-copy > p:not(.mono) {
  margin-top: 22px;
  color: var(--ink-soft);
  font-size: var(--copy-size);
  line-height: var(--copy-line);
  max-width: 540px;
}
.apt-feature-row {
  display: none;
  gap: 12px;
  flex-wrap: wrap;
  margin-top: 26px;
}
.apt-feature-row span {
  font-size: 11px;
  letter-spacing: .14em;
   color: var(--ink-soft);
  display: inline-flex;
  align-items: center;
  gap: 12px;
}
.apt-feature-row span:not(:last-child)::after {
  content: "";
  width: 22px;
  height: 1px;
  background: var(--line);
}
.apt-actions {
  display: flex;
  align-items: center;
  gap: 22px;
  flex-wrap: wrap;
  margin-top: 28px;
}
.included-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  border-top: 1px solid var(--line);
  border-left: 1px solid var(--line);
}
.included-grid > div {
  padding: 28px 24px;
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  font-family: "Playfair Display", serif;
  font-size: clamp(18px, 1.8vw, 24px);
  line-height: 1.2;
}
.included-section .wm.solid {
  left: clamp(12px, 2.8vw, 54px) !important;
  right: auto !important;
  top: auto !important;
  bottom: clamp(18px, 4vw, 72px) !important;
  font-size: clamp(180px, 25vw, 390px) !important;
  line-height: 1;
  transform: none !important;
  opacity: .42;
}
.booking-notes > .wm.solid {
  right: clamp(20px, 4vw, 82px) !important;
  left: auto !important;
  top: clamp(34px, 6vw, 96px) !important;
  bottom: auto !important;
  font-size: clamp(180px, 25vw, 390px) !important;
  line-height: 1;
  transform: none !important;
  opacity: .42;
}
.booking-notes .stat-grid > div {
  border-color: var(--line);
  cursor: default;
}
.booking-notes .stat-grid > div::before { display: none; }
.booking-notes .stat-grid > div:hover { color: inherit; }
.booking-notes .stat-grid .serif {
  font-size: clamp(44px, 5vw, 72px);
  font-weight: 300;
  line-height: 1;
}
.booking-notes .stat-grid .serif-it {
  font-size: 15px;
  color: var(--accent);
  margin-top: 14px;
}
.booking-notes .stat-grid p {
  margin-top: 14px;
  font-size: 13px;
  line-height: 1.7;
  color: var(--ink-soft);
}
.apt-modal,
.photo-lightbox {
  position: fixed;
  inset: 0;
  z-index: 90;
  display: grid;
  place-items: center;
  padding: var(--pad-x);
  background: rgba(36,31,26,.78);
  backdrop-filter: blur(14px);
}
.apt-modal[hidden],
.photo-lightbox[hidden] { display: none }
.apt-modal-inner {
  width: min(1540px, 96vw);
  max-height: 90vh;
  min-height: min(760px, 86vh);
  overflow: auto;
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(320px, .75fr);
  gap: clamp(28px, 4vw, 64px);
  background: var(--bg-dark);
  color: var(--cream);
  padding: clamp(22px, 3vw, 42px);
}
.apt-modal-gallery {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
}
.apt-modal-gallery .ph:first-child {
  grid-column: 1 / -1;
  aspect-ratio: 16 / 9;
}
.apt-modal-gallery .ph:not(:first-child) {
  aspect-ratio: 4 / 3;
}
.apt-modal-copy h3 {
  font-size: clamp(37px, 5.1vw, 78px);
  line-height: .9;
  font-weight: 300;
}
.apt-modal-copy p {
  margin-top: 24px;
  color: rgba(246,241,231,.74);
  line-height: 1.78;
}
.apt-modal-copy dl {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
  margin: 30px 0;
}
.apt-modal-copy dt {
  font-size: 11px;
  letter-spacing: .14em;
   color: rgba(246,241,231,.5);
}
.apt-modal-copy dd {
  margin-top: 6px;
  font-family: "Playfair Display", serif;
  font-size: 24px;
}
.apt-modal-close,
.photo-lightbox > button {
  position: fixed;
  top: clamp(20px, 3vw, 42px);
  right: clamp(20px, 3vw, 42px);
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  color: var(--cream);
  font-size: 28px;
  line-height: 1;
}
.photo-lightbox-inner {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
  width: min(1180px, calc(100vw - 72px));
  max-height: calc(100svh - 112px);
}
.photo-lightbox-prev,
.photo-lightbox-next {
  flex-shrink: 0;
  width: 48px;
  height: 48px;
  display: grid;
  place-items: center;
  color: var(--cream);
  opacity: .7;
  transition: opacity .2s;
  cursor: pointer;
}
.photo-lightbox-prev:hover,
.photo-lightbox-next:hover { opacity: 1; }
@media (max-width: 720px) {
  .photo-lightbox-prev,
  .photo-lightbox-next { width: 36px; height: 36px; }
}
.photo-lightbox-frame {
  flex: 1;
  min-width: 0;
  display: grid;
  place-items: center;
  height: auto;
  max-height: min(78svh, 780px);
  background: transparent;
  overflow: visible;
}
.photo-lightbox-frame img {
  display: block;
  width: auto !important;
  height: auto !important;
  max-width: min(100%, 1100px) !important;
  max-height: min(78svh, 780px) !important;
  object-fit: contain !important;
  margin: 0 auto !important;
  background: transparent !important;
}
.photo-lightbox-frame .ph,
.photo-lightbox-frame .apt-shot {
  width: min(100%, 1100px);
  height: auto;
  max-height: min(78svh, 780px);
  aspect-ratio: 16 / 10;
  border-radius: 0;
  background-color: transparent !important;
  background-size: contain !important;
  background-repeat: no-repeat !important;
}
.photo-lightbox p {
  color: var(--cream);
  margin-top: 16px;
  font-size: 13px;
  text-align: center;
}
@media (max-width: 720px) {
  .photo-lightbox {
    padding: 18px 12px 56px;
  }
  .photo-lightbox-inner {
    width: min(100%, 360px);
    max-height: calc(100svh - 132px);
    gap: 8px;
  }
  .photo-lightbox-frame {
    max-height: min(62svh, 560px);
  }
  .photo-lightbox-frame img {
    max-width: 100% !important;
    max-height: min(62svh, 560px) !important;
  }
  .photo-lightbox-prev,
  .photo-lightbox-next {
    position: fixed;
    top: 50%;
    z-index: 2;
    transform: translateY(-50%);
  }
  .photo-lightbox-prev { left: 8px; }
  .photo-lightbox-next { right: 8px; }
  .photo-lightbox p {
    position: fixed;
    left: 50%;
    bottom: 24px;
    width: min(80vw, 320px);
    transform: translateX(-50%);
    margin-top: 0;
  }
}
.season-activities.dark {
  background: var(--bg-dark);
  color: var(--cream);
}
.season-activities.dark .experience-photo-wash {
  background:
    linear-gradient(268deg, rgba(36,31,26,.18) 0%, rgba(36,31,26,.72) 34%, rgb(36 31 26) 78%),
    url("gallery/img/web/bath-stone.webp") right bottom / cover no-repeat;
  opacity: 1;
}
.season-activities.dark .wm.solid { color: rgba(246,241,231,.045) }
.season-activities.dark h2 .serif-it { color: var(--cream) !important }
.season-activities.dark p,
.season-activities.dark .hl-desc { color: rgba(246,241,231,.84) !important }
.season-activities.dark .hover-list,
.season-activities.dark .hover-list .hl-row,
.season-activities.dark .hover-list .hl-row:first-child {
  border-color: rgba(246,241,231,.24);
}
.season-activities.dark .hover-list .hl-title,
.season-activities.dark .hover-list .hl-num,
.season-activities.dark .hover-list .hl-arrow {
  color: var(--cream);
}
.season-activities.dark .hover-list .hl-row::after {
  background: var(--cream);
}
.season-activities.dark .hover-list .hl-row:hover,
.season-activities.dark .hover-list .hl-row.open {
  color: var(--cream);
}
.season-activities.dark .hover-list .hl-row:hover .hl-title,
.season-activities.dark .hover-list .hl-row.open .hl-title,
.season-activities.dark .hover-list .hl-row:hover .hl-num,
.season-activities.dark .hover-list .hl-row.open .hl-num,
.season-activities.dark .hover-list .hl-row:hover .hl-desc,
.season-activities.dark .hover-list .hl-row.open .hl-desc,
.season-activities.dark .hover-list .hl-row:hover .hl-arrow,
.season-activities.dark .hover-list .hl-row.open .hl-arrow {
  color: var(--cream);
}

@media (min-width: 1025px) {
  .season-activities .container > .reveal.stack-sm {
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
  }

  .season-activities .container > .reveal.stack-sm > div,
  .season-activities .container > .reveal.stack-sm h2,
  .season-activities .container > .reveal.stack-sm p {
    text-align: center !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  .season-activities .container > .reveal.stack-sm p {
    max-width: 560px !important;
  }
}

@media (max-width: 720px) {
  .season-activities.dark {
    text-align: center;
  }

  .season-activities.dark .container > .reveal.stack-sm {
    display: block !important;
    margin-bottom: 34px !important;
    text-align: center !important;
  }

  .season-activities.dark .container > .reveal.stack-sm > div,
  .season-activities.dark .container > .reveal.stack-sm h2,
  .season-activities.dark .container > .reveal.stack-sm p {
    margin-left: auto !important;
    margin-right: auto !important;
    text-align: center !important;
  }

  .season-activities.dark .container > .reveal.stack-sm h2 {
    max-width: 11ch;
    font-size: clamp(29px, 9.35vw, 46px) !important;
    line-height: .95 !important;
  }

  .season-activities.dark .container > .reveal.stack-sm p {
    max-width: 31ch !important;
    margin-top: 18px !important;
    color: rgba(246,241,231,.76) !important;
  }

  .season-activities.dark .hover-list {
    width: 100%;
    max-width: 34rem;
    margin-inline: auto;
    border-top: 1px solid rgba(246,241,231,.2);
    text-align: center;
  }

  .season-activities.dark .hover-list .hl-row {
    display: block !important;
    min-height: 0 !important;
    padding: 28px 0 !important;
    text-align: center !important;
  }

  .season-activities.dark .hover-list .hl-row::after {
    display: none !important;
  }

  .season-activities.dark .hover-list .hl-row:hover,
  .season-activities.dark .hover-list .hl-row.open {
    padding-left: 0 !important;
    padding-right: 0 !important;
    background: transparent !important;
  }

  .season-activities.dark .hover-list .hl-num,
  .season-activities.dark .hover-list .hl-media,
  .season-activities.dark .hover-list .hl-arrow {
    display: none !important;
  }

  .season-activities.dark .hover-list .hl-title {
    display: block !important;
    margin: 0 auto 14px !important;
    font-family: "Jost", sans-serif !important;
    font-size: 12px !important;
    line-height: 1.25 !important;
    letter-spacing: .28em !important;
    text-align: center !important;
    text-transform: uppercase;
    color: var(--cream) !important;
  }

  .season-activities.dark .hover-list .hl-desc {
    display: block !important;
    max-width: 32ch !important;
    margin: 0 auto !important;
    font-size: 14px !important;
    line-height: 1.7 !important;
    text-align: center !important;
    color: rgba(246,241,231,.74) !important;
  }
}
.location-distances.dark {
  background: var(--bg-dark);
  color: var(--cream);
}
.location-distances.dark .experience-photo-wash {
  background:
    linear-gradient(268deg, rgba(36,31,26,.2) 0%, rgba(36,31,26,.7) 34%, rgb(36 31 26) 78%),
    url("gallery/img/web/exterior-winter.webp") right center / cover no-repeat;
  opacity: 1;
}
.location-distances.dark .wm.solid { color: rgba(246,241,231,.045) }
.location-distances.dark h2 .serif-it { color: var(--cream) !important }
.location-distances.dark p,
.location-distances.dark .hl-desc { color: rgba(246,241,231,.84) !important }
.location-distances.dark .hover-list,
.location-distances.dark .hover-list .hl-row,
.location-distances.dark .hover-list .hl-row:first-child {
  border-color: rgba(246,241,231,.24);
}
.location-distances.dark .hover-list .hl-title,
.location-distances.dark .hover-list .hl-num,
.location-distances.dark .hover-list .hl-arrow {
  color: var(--cream);
}
.location-distances.dark .hover-list .hl-row::after { background: var(--cream) }
.location-distances.dark .hover-list .hl-row:hover,
.location-distances.dark .hover-list .hl-row.open { color: var(--ink) }
.location-distances.dark .hover-list .hl-row:hover .hl-title,
.location-distances.dark .hover-list .hl-row.open .hl-title,
.location-distances.dark .hover-list .hl-row:hover .hl-num,
.location-distances.dark .hover-list .hl-row.open .hl-num,
.location-distances.dark .hover-list .hl-row:hover .hl-desc,
.location-distances.dark .hover-list .hl-row.open .hl-desc,
.location-distances.dark .hover-list .hl-row:hover .hl-arrow,
.location-distances.dark .hover-list .hl-row.open .hl-arrow {
  color: var(--ink) !important;
}
.pdf-modal {
  position: fixed;
  inset: 0;
  z-index: 95;
  display: grid;
  place-items: center;
  padding: var(--pad-x);
  background: rgba(36,31,26,.82);
  backdrop-filter: blur(14px);
}
.pdf-modal[hidden] { display: none }
.pdf-modal-inner {
  width: min(1120px, 94vw);
  height: min(820px, 86vh);
  background: var(--bg);
  display: grid;
  grid-template-rows: 1fr auto;
  box-shadow: 0 44px 120px -70px rgba(0,0,0,.8);
}
.pdf-modal iframe {
  width: 100%;
  height: 100%;
  border: 0;
  background: var(--bg-paper);
}
.pdf-modal-note {
  padding: 14px 18px;
  font-size: 12px;
  color: var(--ink-soft);
  border-top: 1px solid var(--line);
}
.pdf-modal-close {
  position: fixed;
  top: clamp(20px, 3vw, 42px);
  right: clamp(20px, 3vw, 42px);
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  color: var(--cream);
  font-size: 28px;
  line-height: 1;
}
.map-modal-close {
  position: fixed;
  top: clamp(20px, 3vw, 42px);
  right: clamp(20px, 3vw, 42px);
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  color: var(--cream);
  font-size: 28px;
  line-height: 1;
}
.seasons-section .season-card {
  isolation: isolate;
}
.seasons-section .season-card > .wm {
  font-size: clamp(360px, 48vw, 620px) !important;
  z-index: 0 !important;
  color: rgba(36,31,26,.055);
}
.seasons-section .season-card > div[style*="aspect-ratio"] {
  position: relative;
  z-index: 2 !important;
  aspect-ratio: 4 / 3.5 !important;
}
.seasons-section .season-card > div:last-child {
  position: relative;
  z-index: 3 !important;
  justify-content: center;
  text-align: center;
}
.seasons-section .season-card > div:last-child .serif {
  font-size: clamp(54px, 6vw, 88px) !important;
}
.seasons-section .season-card > div:last-child .serif-it {
  font-size: clamp(24px, 2.4vw, 32px) !important;
}
.seasons-section .season-summer > .wm {
  left: -.42em !important;
  top: auto !important;
  bottom: -.46em !important;
}
.seasons-section .season-winter > .wm {
  left: auto !important;
  right: -.42em !important;
  top: -.38em !important;
}

/* Nav arrows */
.nav-arrow {
  width: 54px;
  height: 34px;
  border: 0;
  background: transparent;
  display: grid;
  place-items: center;
  cursor: pointer;
  transition: color .25s ease, transform .25s ease;
  color: var(--ink);
}
.gallery-arrow {
  width: 54px;
  height: 34px;
}
.nav-arrow svg,
.gallery-arrow svg {
  width: 26px;
  height: 16px;
  stroke-width: 1.4;
}
.nav-arrow:hover:not(:disabled) { color: var(--accent); transform: translateX(3px) }
.gallery-arrow:hover { color: var(--accent); transform: translateX(3px) }
.nav-arrow:disabled { opacity: .25; cursor: not-allowed }
.nav-arrow.on-dark { color: var(--cream) }
.nav-arrow.on-dark:hover:not(:disabled) { color: var(--accent-warm) }
.season-photo-controls { display: none }
.link-btn .arr-line {
  width: 34px;
}
.link-btn:hover .arr-line {
  width: 46px;
}

/* Gold button variant */
.btn.gold { border-color: var(--accent-warm); color: var(--accent-warm) }
.btn.gold::before { background: var(--accent-warm) }
.btn.gold:hover { color: var(--ink); border-color: var(--accent-warm) }
.btn.on-dark.gold { border-color: var(--accent-warm); color: var(--accent-warm) }
.btn.on-dark.gold::before { background: var(--accent-warm) }
.btn.on-dark.gold:hover { color: var(--ink); border-color: var(--accent-warm) }

/* Pulse ring animation for map pin */
@keyframes pulseRing {
  0% { box-shadow: 0 0 0 0 rgba(211,185,136,.5) }
  70% { box-shadow: 0 0 0 24px rgba(211,185,136,0) }
  100% { box-shadow: 0 0 0 0 rgba(211,185,136,0) }
}

/* Hide elements that should not appear in this project */
.va-watermark, .mobile-sticky-enquiry, .mobile-quick-actions, .mobile-overlay,
.gs-hamburger, .gs-nav, .gs-icons, .gs-nav-links, .va-footer-watermark,
.hero-full-bg, .hero-full-overlay, .hero-full-meta, .va-hero-tab,
.va-vbars, .va-hbars, .side-rail .vline { display: none !important }

/* Consolidated responsive and final interaction layer */
@media (min-width: 1025px) {
  .hide-md { display: initial !important }
  .nav-toggle { display: none !important }

  .home-page .topnav,
  .legal-page .topnav,
  .house-page .headbar .main > .topnav {
    gap: 0;
  }

  .home-page .topnav a:not(:last-child),
  .legal-page .topnav a:not(:last-child),
  .house-page .headbar .main > .topnav a:not(:last-child) {
    margin-right: clamp(42px, 3.4vw, 74px);
  }

  .home-page .topnav a,
  .legal-page .topnav a,
  .house-page .headbar .main > .topnav a {
    letter-spacing: .34em;
  }

  .home-hero > div,
  .apartment-hero > div,
  .location-hero > div {
    min-height: 65svh !important;
  }

  .home-hero .container,
  .apartment-hero .container,
  .location-hero .container {
    justify-content: center !important;
    padding-top: clamp(92px, 10vw, 150px) !important;
    padding-bottom: clamp(54px, 6vw, 96px) !important;
  }

  .home-page .home-hero .container {
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    max-width: none !important;
    transform: none !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center;
    padding-left: clamp(72px, 7vw, 140px) !important;
    padding-right: clamp(72px, 7vw, 140px) !important;
  }

  .home-page .home-hero h1 {
    max-width: min(11ch, calc(100vw - 180px)) !important;
    margin-inline: auto;
    text-align: center !important;
  }

  .home-page .home-hero .container > div {
    width: 100%;
    justify-content: center !important;
    align-items: center !important;
    margin-top: 28px !important;
  }

  .home-page .home-hero .hero-link {
    margin-inline: auto;
  }

  .apartment-hero .container,
  .location-hero .container {
    align-items: center !important;
    text-align: center !important;
  }

  .apartment-hero h1,
  .location-hero h1 {
    max-width: 11ch !important;
    margin-inline: auto !important;
    text-align: center !important;
  }

  .apartment-hero .container > div,
  .location-hero .container > div {
    width: 100%;
    justify-content: center !important;
    align-items: center !important;
    text-align: center !important;
    margin-top: 28px !important;
  }

  .apartment-hero p,
  .location-hero p,
  .apartment-hero .hero-link,
  .location-hero .hero-link {
    margin-inline: auto !important;
    text-align: center !important;
  }

  .house-photo-hero .container {
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    padding-top: clamp(92px, 10vw, 150px) !important;
    padding-bottom: clamp(54px, 6vw, 96px) !important;
  }

  .house-photo-hero h1 {
    max-width: 12ch !important;
    margin-inline: auto !important;
    text-align: center !important;
  }

  .season-page-hero .stack-md > div:first-child {
    justify-self: center !important;
    text-align: center !important;
  }

  .season-page-hero h1 {
    max-width: 11ch !important;
    margin-inline: auto !important;
    text-align: center !important;
  }

  .headbar {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    background: transparent;
    border-bottom-color: transparent;
    backdrop-filter: none;
  }

  .headbar .main {
    grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
    padding-top: 9px;
    padding-bottom: 9px;
    transform: none;
  }

  .headbar.at-top .main {
    padding-top: 44px;
    padding-bottom: 9px;
    transform: none;
  }

  .headbar.at-top {
    background: transparent;
    border-bottom-color: transparent;
    backdrop-filter: none;
    color: var(--cream);
  }

  .headbar.is-scrolled {
    position: fixed;
    background: rgba(36,31,26,.94);
    border-bottom-color: transparent;
    backdrop-filter: blur(16px);
    color: var(--cream);
    animation: headbarSlideIn .5s ease both;
  }

  .headbar.at-top .brand.logo-brand img {
    height: clamp(50px, 5.4vw, 83px);
    max-width: min(390px, 34vw);
    filter: invert(1) brightness(1.9);
  }

  .headbar.is-scrolled .brand.logo-brand img {
    /* Logo 25% kleiner als at-top → Navleiste ~20% niedriger */
    height: clamp(38px, 4vw, 62px);
    max-width: min(292px, 25.5vw);
    filter: invert(1) brightness(1.9);
  }

  .headbar.at-top .topnav a,
  .headbar.at-top .lang,
  .headbar.at-top .lang a,
  .headbar.at-top .lang a.active,
  .headbar.at-top .back-link,
  .headbar.is-scrolled .topnav a,
  .headbar.is-scrolled .lang,
  .headbar.is-scrolled .lang a,
  .headbar.is-scrolled .lang a.active,
  .headbar.is-scrolled .back-link {
    color: var(--cream);
  }

  body.light-nav .headbar.at-top {
    color: var(--ink);
  }

  body.light-nav .headbar.at-top .brand.logo-brand img {
    filter: none;
  }

  body.light-nav .headbar.at-top .topnav a,
  body.light-nav .headbar.at-top .lang,
  body.light-nav .headbar.at-top .lang a,
  body.light-nav .headbar.at-top .lang a.active,
  body.light-nav .headbar.at-top .back-link {
    color: var(--ink);
  }

  .house-context,
  .house-context-sep { display: block }

  .house-context span,
  .house-context strong {
    font-size: 11px;
    letter-spacing: .24em;
  }

  .topnav a.active::after {
    bottom: -7px;
    background: currentColor;
    opacity: .95;
  }

  .gallery-ribbon {
    touch-action: pan-y;
    gap: clamp(34px, 4vw, 70px);
  }

  .gallery-tile,
  .gallery-tile:nth-child(n) {
    flex: 0 0 clamp(330px, 28vw, 500px) !important;
    min-height: 360px !important;
    margin-top: 0 !important;
  }

  .gallery-tile.gt-1 {
    flex-basis: clamp(380px, 31vw, 560px) !important;
    min-height: 430px !important;
    margin-top: clamp(42px, 4vw, 82px) !important;
  }
  .gallery-tile.gt-2 {
    flex-basis: clamp(300px, 22vw, 390px) !important;
    min-height: 540px !important;
    margin-top: 0 !important;
  }
  .gallery-tile.gt-3 {
    flex-basis: clamp(420px, 34vw, 620px) !important;
    min-height: 380px !important;
    margin-top: clamp(84px, 7vw, 130px) !important;
  }
  .gallery-tile.gt-4 {
    flex-basis: clamp(330px, 24vw, 440px) !important;
    min-height: 470px !important;
    margin-top: clamp(20px, 2vw, 42px) !important;
  }
  .gallery-tile.gt-5 {
    flex-basis: clamp(460px, 36vw, 660px) !important;
    min-height: 410px !important;
    margin-top: clamp(96px, 8vw, 150px) !important;
  }
  .gallery-tile.gt-6 {
    flex-basis: clamp(310px, 23vw, 420px) !important;
    min-height: 500px !important;
    margin-top: clamp(36px, 3vw, 70px) !important;
  }
  .gallery-tile.gt-7 {
    flex-basis: clamp(400px, 30vw, 570px) !important;
    min-height: 350px !important;
    margin-top: clamp(120px, 10vw, 180px) !important;
  }
  .gallery-tile.gt-8 {
    flex-basis: clamp(340px, 25vw, 470px) !important;
    min-height: 530px !important;
    margin-top: clamp(8px, 1vw, 20px) !important;
  }
}

@media (min-width: 1025px) and (max-width: 1440px) {
  :root {
    --pad-x: clamp(28px, 3vw, 42px);
  }

  .container {
    max-width: min(1240px, calc(100vw - 72px));
  }

  .headbar .main.container {
    max-width: 1890px;
  }

  .section,
  .section.tight {
    padding-top: clamp(62px, 7vw, 96px) !important;
    padding-bottom: clamp(62px, 7vw, 96px) !important;
  }

  .headbar.at-top .main {
    padding-top: 30px;
  }

  .headbar .topnav {
    gap: 0 !important;
  }

  .home-page .topnav a:not(:last-child) {
    margin-right: clamp(34px, 3vw, 58px);
  }

  .headbar.at-top .brand.logo-brand img {
    height: clamp(48px, 4.6vw, 68px);
    max-width: min(320px, 27vw);
  }

  .headbar.is-scrolled .brand.logo-brand img {
    /* Logo 25% kleiner als at-top → Navleiste ~20% niedriger */
    height: clamp(36px, 3.45vw, 51px);
    max-width: min(240px, 20vw);
  }

  .home-hero > div,
  .apartment-hero > div,
  .location-hero > div {
    min-height: min(68svh, 620px) !important;
  }

  .home-page .home-hero h1 {
    font-size: clamp(53px, 6.88vw, 100px) !important;
    max-width: min(10.5ch, calc(100vw - 220px)) !important;
    line-height: .9 !important;
  }

  .home-page .home-hero .container > div {
    margin-top: 22px !important;
  }

  .intro-editorial {
    min-height: 0;
    padding-top: clamp(76px, 8vw, 112px) !important;
    padding-bottom: clamp(84px, 8.5vw, 120px) !important;
  }

  .intro-heading {
    max-width: 760px;
    margin-bottom: clamp(30px, 3vw, 44px) !important;
  }

  .intro-heading h2[style],
  .gallery-section h2[style],
  .faq-photo-section h2[style] {
    font-size: clamp(34px, 4.08vw, 56px) !important;
  }

  .intro-copy {
    max-width: 920px;
    gap: 0 !important;
    text-align: center;
  }

  .intro-copy p {
    font-size: var(--copy-size);
    line-height: var(--copy-line);
  }

  .home-facts {
    margin-top: clamp(36px, 4vw, 54px) !important;
    gap: 16px !important;
  }

  .home-facts .icn {
    width: 38px !important;
    height: 38px !important;
  }

  #houses-section {
    padding-top: clamp(70px, 7vw, 96px) !important;
    padding-bottom: clamp(82px, 8vw, 112px) !important;
  }

  #houses-section .stack-sm {
    margin-bottom: clamp(34px, 4vw, 48px) !important;
  }

  #houses-section h2[style],
  .experience-section h2[style],
  .house-apt-head h2,
  .location-distances h2,
  .apt-show-head h2 {
    font-size: clamp(32px, 4.42vw, 60px) !important;
  }

  .houses-grid {
    gap: clamp(24px, 2.6vw, 34px) !important;
  }

  .houses-grid > * {
    max-width: 360px;
    justify-self: center;
  }

  .houses-grid > * [style*="aspect-ratio"] {
    max-height: 430px;
  }

  .dark[style*="padding"] {
    padding-top: clamp(74px, 8vw, 112px) !important;
    padding-bottom: clamp(74px, 8vw, 112px) !important;
  }

  .dark .container.stack-md[style*="grid-template-columns"] {
    gap: clamp(42px, 5vw, 64px) !important;
    max-width: min(1120px, calc(100vw - 90px));
  }

  .dark .container.stack-md > .ph {
    max-height: 500px;
  }

  .experience-section .stack-sm {
    margin-bottom: clamp(34px, 4vw, 52px) !important;
  }

  .hover-list .hl-row {
    grid-template-columns: 48px minmax(190px, .7fr) minmax(0, 1fr) 30px;
    min-height: 92px;
    padding: 20px 0;
  }

  .hover-list .hl-title {
    font-size: clamp(24px, 2.5vw, 34px);
  }

  .hover-list .hl-preview {
    width: min(30vw, 360px);
    height: 190px;
  }

  .gallery-section {
    padding-top: clamp(64px, 7vw, 90px) !important;
    padding-bottom: clamp(18px, 3vw, 40px) !important;
  }

  .gallery-section .reveal.stack-sm {
    margin-bottom: clamp(34px, 4vw, 48px) !important;
  }

  .gallery-shell {
    margin-inline: calc(var(--pad-x) * -1);
  }

  .gallery-ribbon {
    gap: clamp(24px, 3vw, 42px);
    padding-inline: var(--pad-x);
  }

  .gallery-tile,
  .gallery-tile:nth-child(n) {
    flex-basis: clamp(260px, 25vw, 370px) !important;
    min-height: 300px !important;
  }

  .gallery-tile.gt-1 {
    flex-basis: clamp(300px, 28vw, 420px) !important;
    min-height: 350px !important;
    margin-top: clamp(24px, 3vw, 46px) !important;
  }

  .gallery-tile.gt-2 {
    flex-basis: clamp(250px, 21vw, 330px) !important;
    min-height: 430px !important;
  }

  .gallery-tile.gt-3 {
    flex-basis: clamp(320px, 30vw, 460px) !important;
    min-height: 320px !important;
    margin-top: clamp(50px, 5vw, 82px) !important;
  }

  .gallery-tile.gt-4 {
    flex-basis: clamp(260px, 23vw, 350px) !important;
    min-height: 370px !important;
    margin-top: clamp(14px, 2vw, 28px) !important;
  }

  .gallery-tile.gt-5 {
    flex-basis: clamp(340px, 31vw, 480px) !important;
    min-height: 330px !important;
    margin-top: clamp(58px, 6vw, 94px) !important;
  }

  .gallery-tile.gt-6 {
    flex-basis: clamp(250px, 22vw, 340px) !important;
    min-height: 400px !important;
    margin-top: clamp(24px, 3vw, 48px) !important;
  }

  .gallery-tile.gt-7 {
    flex-basis: clamp(300px, 27vw, 420px) !important;
    min-height: 290px !important;
    margin-top: clamp(72px, 7vw, 110px) !important;
  }

  .gallery-tile.gt-8 {
    flex-basis: clamp(260px, 23vw, 360px) !important;
    min-height: 420px !important;
  }

  .faq-photo-section {
    padding-top: clamp(58px, 6vw, 86px) !important;
  }

  .site-footer,
  .site-footer[style] {
    padding-top: clamp(76px, 8vw, 112px) !important;
  }

  .site-footer .footer-grid,
  .site-footer .container.stack-md {
    gap: clamp(28px, 3vw, 42px) !important;
  }

  .house-photo-hero {
    min-height: min(68svh, 620px) !important;
  }

  .house-photo-hero h1,
  .season-page-hero h1,
  .apartment-hero h1,
  .location-hero h1 {
    font-size: clamp(49px, 6.8vw, 100px) !important;
    line-height: .9 !important;
  }

  .house-photo-composition {
    padding-top: clamp(70px, 7vw, 96px) !important;
    padding-bottom: clamp(70px, 7vw, 96px) !important;
  }

  .house-photo-composition > .container {
    max-width: min(1160px, calc(100vw - 88px));
  }

  .house-photo-composition .container.stack-md {
    gap: clamp(22px, 2.5vw, 36px) !important;
  }

  .house-apartments,
  .apt-showcase,
  .location-distances,
  .seasons-section,
  .included-section,
  .booking-notes {
    padding-top: clamp(70px, 7vw, 100px) !important;
    padding-bottom: clamp(70px, 7vw, 100px) !important;
  }

  .house-apt-layout,
  .apt-show-layout {
    gap: clamp(30px, 4vw, 54px) !important;
  }

  .house-apt-media {
    min-height: clamp(420px, 40vw, 580px);
  }

  .apt-panel-media {
    min-height: clamp(300px, 28vw, 420px);
  }

  .house-location-section {
    min-height: clamp(420px, 40vw, 560px);
  }

  .seasons-section .season-card > div[style*="aspect-ratio"] {
    max-height: 480px;
  }
}

@media (max-width: 1024px) {
  :root { --pad-x: clamp(18px, 5vw, 34px) }

  html.menu-open,
  html.menu-open body { overflow: hidden }

  .hide-md { display: none !important }
  .stack-md { grid-template-columns: 1fr !important; gap: 44px !important }
  .houses-grid { grid-template-columns: 1fr !important; gap: 74px !important }
  .stat-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) }
  .section { padding: clamp(70px, 18vw, 116px) 0 }

  .headbar {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 50;
    background: rgba(36,31,26,.98);
    border-bottom: 0;
    color: var(--cream);
    backdrop-filter: blur(14px);
  }

  .headbar .main {
    min-height: 112px;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 16px;
    padding: 16px var(--pad-x);
  }

  .headbar .brand.logo-brand {
    justify-self: start;
    grid-column: 1;
  }

  .headbar .brand.logo-brand img {
    height: clamp(50px, 13vw, 70px);
    max-width: 150px;
    filter: invert(1) brightness(1.9) !important;
  }

  .headbar .main > .topnav {
    display: none !important;
  }

  .headbar .actions {
    grid-column: 3;
    justify-self: end;
    display: flex;
    align-items: center;
    gap: 0;
  }

  .headbar .actions .btn,
  .headbar .actions .lang,
  .headbar .topnav { display: none !important }


  .nav-toggle {
    background: transparent;
    border: 0;
  }

  .drawer {
    padding: 28px var(--pad-x) 30px;
    background: var(--bg-night);
    color: var(--cream);
    transform: translateY(-108%);
    opacity: 0;
    visibility: hidden;
    transition: transform .78s cubic-bezier(.22,1,.36,1), opacity .5s ease, visibility 0s linear .78s;
    max-width: 520px;
    margin-inline: auto;
    left: 0;
    right: 0;
  }

  .drawer::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(20,16,12,.54), rgba(20,16,12,.88)), url("gallery/img/web/interior-alpine-light.webp") center / cover no-repeat;
    opacity: .9;
    transform: scale(1.05);
    transition: transform 1.1s cubic-bezier(.22,1,.36,1);
  }

  .drawer.open {
    transform: translateY(0);
    opacity: 1;
    visibility: visible;
    transition-delay: 0s;
  }

  .drawer.open::before { transform: scale(1) }

  .drawer .row-top,
  .drawer > nav:not(.drawer-lang-inline),
  .drawer-meta {
    position: relative;
    z-index: 1;
  }

  .drawer .row-top {
    margin-bottom: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
  }

  .drawer .brand.logo-brand img {
    height: clamp(58px, 16vw, 82px);
    max-width: 210px;
    filter: invert(1) brightness(1.9) !important;
  }

  .drawer .drawer-close {
    width: 63px;
    height: 42px;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    color: var(--cream) !important;
    display: inline-grid;
    place-items: center;
    position: relative;
  }

  .drawer .drawer-close .lbl,
  .drawer .drawer-close .circ,
  .drawer .drawer-close .icn { display: none !important }

  .drawer .drawer-close::before,
  .drawer .drawer-close::after {
    content: "" !important;
    position: absolute !important;
    left: 13px !important;
    right: 13px !important;
    top: 50% !important;
    height: 1.5px !important;
    background: var(--cream) !important;
    border-radius: 999px !important;
  }
  .drawer .drawer-close::before {
    transform: rotate(45deg) !important;
  }
  .drawer .drawer-close::after {
    transform: rotate(-45deg) !important;
  }

  .drawer > nav:not(.drawer-lang-inline) {
    flex: 1;
    display: flex !important;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: clamp(10px, 2.8vh, 22px);
    width: 70%;
    margin: auto;
    padding: 8vh 0 5vh;
    text-align: center;
  }

  .drawer > nav:not(.drawer-lang-inline) a,
  .drawer > nav:not(.drawer-lang-inline) a:visited,
  .drawer > nav:not(.drawer-lang-inline) a:hover,
  .drawer > nav:not(.drawer-lang-inline) a:active,
  .drawer > nav:not(.drawer-lang-inline) a:focus,
  .drawer > nav:not(.drawer-lang-inline) a:nth-child(2n) {
    padding: 0 !important;
    color: var(--cream) !important;
    font-family: "Playfair Display", serif;
    font-size: clamp(31px, 10vw, 50px);
    line-height: .9;
    letter-spacing: 0;
    font-style: normal;
    opacity: 0;
    transform: translateY(28px);
    transition: opacity .55s ease, transform .72s cubic-bezier(.22,1,.36,1), color .25s ease;
  }

  .drawer > nav:not(.drawer-lang-inline) a:nth-child(2n) {
  }

  .drawer > nav.drawer-menu {
    gap: clamp(18px, 3.4vh, 32px);
    padding: 6vh 0 4vh;
  }

  .drawer-menu-group {
    display: grid;
    justify-items: center;
    gap: 0;
    width: min(100%, 360px);
    opacity: 0;
    transform: translateY(22px);
    transition: opacity .55s ease, transform .72s cubic-bezier(.22,1,.36,1);
  }

  .drawer.open .drawer-menu-group {
    opacity: 1;
    transform: translateY(0);
  }

  .drawer.open .drawer-menu-group:nth-child(1) { transition-delay: .10s }
  .drawer.open .drawer-menu-group:nth-child(2) { transition-delay: .17s }
  .drawer.open .drawer-menu-group:nth-child(3) { transition-delay: .24s }
  .drawer.open .drawer-menu-group:nth-child(4) { transition-delay: .31s }

  .drawer > nav.drawer-menu .drawer-main-link,
  .drawer > nav.drawer-menu .drawer-main-link:visited,
  .drawer > nav.drawer-menu .drawer-main-link:hover,
  .drawer > nav.drawer-menu .drawer-main-link:active,
  .drawer > nav.drawer-menu .drawer-main-link:focus {
    font-size: clamp(30px, 8.4vw, 44px) !important;
    line-height: .92 !important;
    opacity: 1 !important;
    transform: none !important;
    width: min(100%, 340px);
    display: flex !important;
    align-items: center;
    justify-content: space-between;
    gap: 22px;
    padding: 4px 0 !important;
    text-align: left;
  }

  .drawer-menu-group:not(.drawer-menu-group-single) .drawer-main-link::after {
    content: "";
    width: 13px;
    height: 13px;
    flex: 0 0 13px;
    border-top: 1.4px solid currentColor;
    border-right: 1.4px solid currentColor;
    opacity: .82;
    transform: translateY(-2px) rotate(135deg);
    transition: transform .36s cubic-bezier(.22,1,.36,1), opacity .25s ease;
  }

  .drawer-menu-group.open:not(.drawer-menu-group-single) .drawer-main-link::after {
    opacity: 1;
    transform: translateY(3px) rotate(-45deg);
  }

  .drawer-menu-group-single .drawer-main-link,
  .drawer-menu-group-single .drawer-main-link:visited,
  .drawer-menu-group-single .drawer-main-link:hover,
  .drawer-menu-group-single .drawer-main-link:active,
  .drawer-menu-group-single .drawer-main-link:focus {
    width: auto;
    justify-content: center;
    text-align: center;
  }

  .drawer-subnav {
    display: grid;
    justify-items: start;
    gap: 11px;
    width: min(100%, 300px);
    max-width: 300px;
    max-height: 0;
    overflow: hidden;
    opacity: 0;
    transform: translateY(-6px);
    transition: max-height .42s cubic-bezier(.22,1,.36,1), opacity .28s ease, transform .42s cubic-bezier(.22,1,.36,1), padding .42s cubic-bezier(.22,1,.36,1);
  }

  .drawer-menu-group.open .drawer-subnav {
    max-height: 260px;
    opacity: 1;
    transform: translateY(0);
    padding-top: 12px;
  }

  .drawer > nav.drawer-menu .drawer-subnav a,
  .drawer > nav.drawer-menu .drawer-subnav a:visited,
  .drawer > nav.drawer-menu .drawer-subnav a:hover,
  .drawer > nav.drawer-menu .drawer-subnav a:active,
  .drawer > nav.drawer-menu .drawer-subnav a:focus,
  .drawer > nav.drawer-menu .drawer-subnav a:nth-child(2n) {
    font-family: "Jost", sans-serif !important;
    font-size: clamp(18px, 4.4vw, 18px) !important;
    line-height: 1.35 !important;
    letter-spacing: .08em !important;
    text-transform: none;
    font-style: normal !important;
    color: rgba(246,241,231,.74) !important;
    opacity: 1 !important;
    transform: none !important;
    transition: color .25s ease, opacity .25s ease !important;
  }

  .drawer > nav.drawer-menu .drawer-subnav a:hover,
  .drawer > nav.drawer-menu .drawer-subnav a:focus {
    color: var(--cream) !important;
  }

  .drawer.open > nav:not(.drawer-lang-inline) a {
    opacity: 1;
    transform: translateY(0);
  }

  .drawer.open > nav:not(.drawer-lang-inline) a:nth-child(1) { transition-delay: .10s }
  .drawer.open > nav:not(.drawer-lang-inline) a:nth-child(2) { transition-delay: .16s }
  .drawer.open > nav:not(.drawer-lang-inline) a:nth-child(3) { transition-delay: .22s }
  .drawer.open > nav:not(.drawer-lang-inline) a:nth-child(4) { transition-delay: .28s }
  .drawer.open > nav:not(.drawer-lang-inline) a:nth-child(5) { transition-delay: .34s }

  .drawer-meta {
    width: 100%;
    display: grid;
    justify-items: center;
    gap: 16px;
    padding-bottom: clamp(22px, 5vh, 44px);
    opacity: 0;
    transform: translateY(18px);
    transition: opacity .5s ease .32s, transform .62s cubic-bezier(.22,1,.36,1) .32s;
  }

  .drawer.open .drawer-meta {
    opacity: 1;
    transform: translateY(0);
  }

  .drawer-anfrage {
    font-size: 15px !important;
    letter-spacing: .16em !important;
    padding: 13px 27px !important;
    min-height: 46px !important;
  }
  .drawer-anfrage .lbl {
    font-size: 15px !important;
  }
  .drawer-anfrage .circ {
    width: 22px;
    height: 22px;
  }

  .drawer-house-context {
    display: grid;
    gap: 4px;
    justify-items: center;
    text-align: center;
    color: var(--cream) !important;
    font-family: "JetBrains Mono", monospace;
     }

  .drawer-house-context span {
    font-size: 10px;
    letter-spacing: .22em;
    opacity: .52;
  }

  .drawer-house-context strong {
    font-size: 13px;
    font-weight: 400;
    letter-spacing: .18em;
  }

  .drawer-lang-inline {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 18px !important;
    margin-top: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    border-radius: 0 !important;
    backdrop-filter: none !important;
  }

  .drawer-lang-inline a,
  .drawer-lang-inline a:visited,
  .drawer-lang-inline a:hover,
  .drawer-lang-inline a:active,
  .drawer-lang-inline a:focus,
  .drawer-lang-inline a:nth-child(2n) {
    height: auto !important;
    display: inline-block !important;
    padding: 0 !important;
    border-radius: 0 !important;
    font-family: "JetBrains Mono", monospace !important;
    font-size: 11px !important;
    line-height: 1 !important;
    letter-spacing: .18em !important;
       font-style: normal !important;
    color: rgba(246,241,231,.58) !important;
  }

  .drawer-lang-inline a.active {
    background: transparent;
    color: var(--cream) !important;
  }

  .side-rail.hide-sm {
    display: none !important;
  }

  .side-rail.hide-sm.over-footer {
    opacity: 0;
    pointer-events: none;
  }

  .side-rail.hide-sm a {
    width: 38px;
    height: 46px;
    color: var(--ink);
  }

  .side-rail.hide-sm a:nth-child(n) { transform: none }
  .side-rail.hide-sm .rail-icon {
    width: 24px;
    height: 24px;
    opacity: .92;
    filter: invert(10%) sepia(16%) saturate(657%) hue-rotate(350deg) brightness(92%) contrast(92%) !important;
  }
  .side-rail.hide-sm .tip { display: none }

  .mobile-bottom-actions {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 45;
    display: grid !important;
    grid-template-columns: 58px minmax(0, 1fr) 58px;
    gap: 10px;
    align-items: stretch;
    background: transparent !important;
    border-top: 0 !important;
    padding: 0 0 env(safe-area-inset-bottom);
  }

  .mobile-bottom-icon,
  .mobile-bottom-request {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 58px;
    width: 100%;
    background: var(--ink);
    color: var(--cream);
    border: 0;
    font-family: "JetBrains Mono", monospace;
    font-size: 13px;
    letter-spacing: .28em;
       transition: background .28s ease, color .28s ease, border-color .28s ease;
  }

  .mobile-bottom-icon img {
    width: 24px;
    height: 24px;
    object-fit: contain;
    filter: invert(94%) sepia(10%) saturate(402%) hue-rotate(343deg) brightness(103%) contrast(94%);
    transition: filter .28s ease;
  }

  .mobile-bottom-actions.on-dark .mobile-bottom-icon,
  .mobile-bottom-actions.on-dark .mobile-bottom-request {
    background: var(--bg-paper);
    color: var(--ink);
  }

  .mobile-bottom-actions.on-dark .mobile-bottom-icon img {
    filter: invert(10%) sepia(16%) saturate(657%) hue-rotate(350deg) brightness(92%) contrast(92%);
  }

  .mobile-bottom-actions.on-light .mobile-bottom-icon,
  .mobile-bottom-actions.on-light .mobile-bottom-request {
    background: var(--ink);
    color: var(--cream);
  }

  .home-hero > div,
  .apartment-hero > div,
  .location-hero > div {
    min-height: 65svh !important;
    aspect-ratio: auto !important;
  }

  .home-hero .container,
  .apartment-hero .container,
  .location-hero .container {
    justify-content: center !important;
    align-items: center !important;
    text-align: center;
    padding-top: clamp(160px, 35vw, 220px) !important;
    padding-bottom: clamp(42px, 13vw, 72px) !important;
  }

  .home-hero h1,
  .apartment-hero h1,
  .location-hero h1,
  .season-page-hero h1 {
    max-width: 100% !important;
    margin-left: auto;
    margin-right: auto;
    font-size: clamp(41px, 11.9vw, 66px) !important;
    line-height: .88 !important;
    text-align: center !important;
    overflow-wrap: break-word;
  }

  .home-hero h1 br,
  .apartment-hero h1 br,
  .location-hero h1 br { display: none }

  .apartment-hero p,
  .home-hero .hero-link,
  .apartment-hero .hero-link,
  .location-hero .hero-link { display: none !important }

  .intro-editorial {
    min-height: 0;
    padding-block: clamp(78px, 18vw, 118px) !important;
    text-align: center;
  }

  .intro-photo-wash {
    position: absolute;
    inset: 0;
    background:
      linear-gradient(359deg, rgb(244 237 224) 0%, rgba(244,237,224,.14) 0%, rgba(244,237,224,.62) 0%, rgb(244 237 224) 40%),
      linear-gradient(rgba(36,31,26,.2), rgba(36,31,26,.2)),
      url("gallery/img/web/balcony-view.webp") left center / cover no-repeat !important;
    filter: grayscale(.12) saturate(.82) brightness(.82) !important;
    opacity: 1;
    pointer-events: none;
  }

  .intro-heading h2,
  .section h2.serif,
  #houses-section h2.serif,
  .gallery-section h2.serif,
  .faq-photo-section h2.serif {
    font-size: clamp(39px, 11.9vw, 61px) !important;
    line-height: .96 !important;
    text-align: center;
  }

  .intro-copy {
    display: block !important;
    max-width: 32rem;
    margin: 0 auto;
  }

  .intro-copy p,
  .section p.serif:not(.serif-it) {
    font-size: var(--copy-size-mobile);
    line-height: var(--copy-line-mobile);
    text-align: center;
  }

  .home-facts {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 12px !important;
    margin-top: 48px !important;
  }
  .home-facts > div { text-align: center; display: grid; justify-items: center; gap: 12px }
  .home-facts .icn { width: 34px; height: 34px; margin: 0; color: var(--ink) }
  .home-facts [style*="font-size"] { font-size: clamp(28px, 9vw, 38px) !important }
  .home-facts [style*="margin-top"] { margin-top: 3px !important; font-size: 12px !important }

  .houses-grid > *:nth-child(n) {
    transform: none !important;
  }
  .houses-grid > * + * { margin-top: 13px }
  .houses-grid [style*="aspect-ratio"] { margin-inline: auto; width: min(84vw, 620px); aspect-ratio: 4/3.75 !important }
  .home-page .houses-grid > *:nth-child(1) [style*="aspect-ratio"] {
    width: min(78vw, 560px);
    margin-left: 0;
    margin-right: auto;
  }
  .home-page .houses-grid > *:nth-child(2) [style*="aspect-ratio"] {
    width: min(84vw, 620px);
    margin-left: auto;
    margin-right: 0;
  }
  .home-page .houses-grid > *:nth-child(3) [style*="aspect-ratio"] {
    width: min(78vw, 560px);
    margin-left: 0;
    margin-right: auto;
  }
  .houses-grid .ph { transform: none !important }
  .houses-grid .link-btn,
  .houses-grid [style*="display:flex"][style*="justify-content:space-between"] {
    background: transparent !important;
    box-shadow: none !important;
  }
  .houses-grid > a > div[style*="grid-template-columns"] {
    max-width: min(84vw, 620px);
  }
  .home-page .houses-grid > *:nth-child(1) > div[style*="grid-template-columns"],
  .home-page .houses-grid > *:nth-child(3) > div[style*="grid-template-columns"] {
    max-width: min(78vw, 560px);
  }

  .hover-list .hl-row {
    grid-template-columns: 40px minmax(0, 1fr) auto;
    min-height: 0 !important;
    gap: 14px;
    padding: 22px 0 !important;
  }
  .experience-section .container {
    text-align: center;
  }
  .experience-section .stack-sm {
    justify-content: center !important;
    align-items: center !important;
    text-align: center;
  }
  .experience-section .stack-sm p {
    margin-inline: auto;
    text-align: center;
  }
  .experience-section .hover-list {
    max-width: 88vw;
    margin-inline: auto;
    text-align: left;
  }
  .hover-list .hl-title {
    min-height: 18px;
    display: flex;
    align-items: center;
    font-size: 14px;
    font-family: "Jost", sans-serif;
  }
  .hover-list .hl-desc { grid-column: 2 / -1; font-size: 15px }
  .hover-list .hl-arrow { grid-column: 3; grid-row: 1; border: 0 !important }
  .hover-list .hl-media { display: none }
  .hover-list .hl-img { display: none !important }

  .home-page section.dark .container.stack-md > .ph {
    width: min(80vw, 360px);
    margin-inline: auto 0;
    min-height: 360px;
  }

  .home-page section.dark {
    padding-top: 78px !important;
    padding-bottom: 78px !important;
  }

  .home-page section.dark .container.stack-md {
    gap: 32px !important;
  }

  .home-page section.dark [style*="margin-top:40px"] {
    margin-top: 28px !important;
  }
  .home-page section.dark h3 + p {
    margin-top: clamp(32px, 8vw, 44px) !important;
  }

  .gallery-section {
    padding-block: clamp(72px, 18vw, 106px) !important;
    min-height: auto !important;
    text-align: center;
  }
  .gallery-section .container > div:first-child {
    grid-template-columns: 1fr !important;
    gap: 0 !important;
    text-align: center;
    justify-items: center;
    margin-bottom: 28px !important;
  }
  .gallery-section .container > div:first-child > p {
    display: none !important;
  }
  .gallery-shell {
    margin-inline: calc(-1 * var(--pad-x));
    min-height: 390px;
    opacity: 1 !important;
    transform: none !important;
    visibility: visible !important;
  }
  .gallery-ribbon {
    display: flex !important;
    align-items: center !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    min-height: 380px;
    width: 100%;
    gap: 22px;
    padding-inline: var(--pad-x);
    padding-bottom: 12px;
    touch-action: pan-x pan-y;
    -webkit-overflow-scrolling: touch;
    scroll-snap-type: x mandatory;
    scroll-snap-stop: always;
    scrollbar-width: none;
  }
  .gallery-ribbon::-webkit-scrollbar { display: none }
  .gallery-tile,
  .gallery-tile:nth-child(n) {
    flex: 0 0 min(74vw, 330px) !important;
    height: 330px !important;
    min-height: 0 !important;
    margin-top: 0 !important;
    display: block !important;
    opacity: 1 !important;
    visibility: visible !important;
    transform: none !important;
    background: var(--bg-night);
    scroll-snap-align: center;
    scroll-snap-stop: always;
    position: relative;
  }
  .gallery-tile:nth-child(2n) { flex-basis: min(74vw, 330px) !important; height: 330px !important; margin-top: 0 !important }
  .gallery-tile:nth-child(3n) { flex-basis: min(74vw, 330px) !important; height: 330px !important; margin-top: 0 !important }
  .gallery-tile:nth-child(5n) { flex-basis: min(74vw, 330px) !important; height: 330px !important; margin-top: 0 !important }
  .gallery-tile .ph,
  .gallery-tile img {
    position: absolute !important;
    inset: 0 !important;
    display: block !important;
    opacity: 1 !important;
    visibility: visible !important;
    transform: none !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
  }
  .gallery-controls { padding-inline: var(--pad-x); margin-top: 18px; justify-content: flex-end }

  .faq-photo-section { padding-top: 54px !important }
  .faq-photo-wash {
    position: absolute;
    inset: 0;
    background: linear-gradient(359deg, rgb(247 247 247 / 0%) 0%, rgba(244,237,224,.2) 0%, rgb(244 237 224) 36%), url("gallery/img/web/exterior-summer.webp") center bottom / cover no-repeat;
    filter: grayscale(.16) saturate(.82);
  }
  .faq-heading { margin-bottom: 28px !important }
  .faq-heading p { display: none }
  .acc-head { grid-template-columns: minmax(0, 1fr) 30px; gap: 14px; padding: 20px 0 }
  .acc-head > span:first-child { display: block }
  .acc-head .serif {
    font-family: "Jost", sans-serif !important;
    font-size: clamp(15px, 4.6vw, 20px) !important;
    line-height: 1.35 !important;
    letter-spacing: .01em !important;
    color: var(--ink) !important;
  }
  .acc-plus {
    width: 28px;
    height: 28px;
    color: var(--ink);
  }

  .site-footer {
    padding: 40px 0 104px !important;
  }
  .site-footer .container.stack-md {
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
  }
  .site-footer .container.stack-md,
  .site-footer .footer-grid {
    display: grid !important;
    grid-template-columns: 1.1fr .9fr !important;
    gap: 24px 24px !important;
    text-align: left;
  }
  .site-footer .container.stack-md > div,
  .site-footer .footer-grid > div {
    min-width: 0;
  }
  .site-footer .container.stack-md > div:first-child,
  .site-footer .footer-grid > div:first-child {
    grid-column: auto !important;
  }
  .site-footer .serif[style*="font-size:18px"] {
    font-size: 11px !important;
    letter-spacing: .24em !important;
  }
  .site-footer .serif-it {
    font-size: 30px !important;
    margin-top: 3px !important;
  }
  .site-footer p {
    font-size: 13px !important;
    line-height: 1.62 !important;
    margin-top: 12px !important;
    margin-bottom: 12px !important;
  }
  .site-footer p br {
    display: block;
  }
  .site-footer div[style*="display:flex"][style*="gap:14px"] {
    gap: 10px !important;
    margin-top: 16px !important;
    flex-wrap: wrap;
  }
  .site-footer .btn.compact {
    min-height: 34px !important;
    padding: 9px 11px !important;
    font-size: 10px !important;
    letter-spacing: .14em !important;
  }
  .site-footer .footer-bottom {
    grid-column: 1 / -1 !important;
    display: grid;
    grid-template-columns: 1fr !important;
    gap: 5px;
    margin-top: 4px !important;
    padding-top: 10px !important;
    padding-bottom: calc(20px + env(safe-area-inset-bottom, 0px)) !important;
  }
  .site-footer .footer-bottom span,
  footer.dark div[style*="grid-column:1/-1"] span {
    font-size: 12px !important;
    line-height: 1.45 !important;
  }
  .site-footer > .wm { display: none !important }

  /* Consistent mobile typography */
  .copy-text,
  .acc-body p,
  .house-location-copy > p:not(.mono),
  .intro-copy p,
  section p:not(.mono):not(.serif):not(.serif-it) {
    font-size: var(--copy-size-mobile);
    line-height: var(--copy-line-mobile);
  }
  h2.serif,
  .section h2.serif,
  .intro-heading h2,
  #houses-section h2.serif,
  .gallery-section h2.serif,
  .faq-photo-section h2.serif,
  .experience-section h2.serif,
  .house-location-copy h2 {
    font-size: clamp(36px, 10.2vw, 54px) !important;
    line-height: .96 !important;
  }

  .page-hero {
    min-height: 65svh;
    padding: 180px 0 66px;
    align-items: flex-end;
  }
  .page-hero::before { opacity: 1 }
  .gs-anfrage-intro { padding: 58px var(--pad-x) 32px; text-align: center }
  .booking-form { padding: 24px 18px }
  .form-row { grid-template-columns: 1fr }
  .legal-content, .legal-content-full { padding-inline: var(--pad-x) }
}

@media (max-width: 720px) {
  :root { --pad-x: 18px }
  .hide-sm { display: none !important }

  .headbar .main {
    min-height: 76px;
    padding-inline: 18px;
    padding-right: 68px;
    position: relative;
  }

  body:not(.home-page) .headbar .main {
    display: flex;
    align-items: center;
    justify-content: space-between;
  }

  body:not(.home-page) .headbar .brand.logo-brand {
    order: 1;
    flex: 0 0 auto;
  }

  body:not(.home-page) .headbar .main > div:first-child {
    order: 2;
    flex: 0 0 min(42vw, 162px);
    justify-content: center !important;
  }

  body:not(.home-page) .headbar .actions {
    order: 3;
    flex: 0 0 auto;
  }

  .home-page .headbar .main {
    grid-template-columns: auto minmax(0, 1fr) auto;
  }

  .headbar .nav-toggle {
    position: absolute;
    right: 18px;
    top: 50%;
    transform: translateY(-50%);
    z-index: 5;
  }

  .headbar .nav-toggle::before,
  .headbar .nav-toggle::after {
    content: "";
    position: absolute;
    left: 8px;
    right: 8px;
    height: 1.5px;
    background: currentColor;
    border-radius: 999px;
  }

  .headbar .nav-toggle::before { top: 15px }
  .headbar .nav-toggle::after { bottom: 15px }
  .headbar .nav-toggle .icn { opacity: 0 }

  .home-page .headbar .brand.logo-brand {
    grid-column: 1;
  }

  .section { padding: 70px 0 }
  .container { padding-inline: var(--pad-x) }

  .home-hero .container,
  .apartment-hero .container,
  .location-hero .container {
    padding-inline: 26px !important;
  }

  .home-hero::after {
    content: "";
    position: absolute;
    /* Höher gesetzt, damit der Scroll-Strich klar im Hero-Foto sitzt und nicht
       das große Seam-Wort darunter durchschneidet (war bottom: 28px). */
    bottom: clamp(120px, 13vw, 200px);
    left: 50%;
    transform: translateX(-50%);
    width: 1px;
    height: 36px;
    background: linear-gradient(180deg, transparent, var(--cream));
    opacity: .6;
    animation: hero-scroll-hint 2s ease-in-out infinite;
    z-index: 5;
    pointer-events: none;
  }
  @keyframes hero-scroll-hint {
    0%, 100% { opacity: .6; transform: translateX(-50%) translateY(0) }
    50% { opacity: .2; transform: translateX(-50%) translateY(10px) }
  }

  .house-photo-hero {
    min-height: 65svh;
    display: flex;
    align-items: flex-end;
  }
  .house-photo-hero::after {
    content: "";
    position: absolute;
    /* siehe .home-hero::after: höher, damit der Strich nicht das Seam-Wort trifft */
    bottom: clamp(120px, 13vw, 200px);
    left: 50%;
    transform: translateX(-50%);
    width: 1px;
    height: 36px;
    background: linear-gradient(180deg, transparent, var(--cream));
    opacity: .6;
    animation: hero-scroll-hint 2s ease-in-out infinite;
    z-index: 5;
    pointer-events: none;
  }
  .house-photo-hero .container {
    position: static !important;
    left: auto !important;
    transform: none !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center;
    padding-bottom: 58px !important;
  }
  .house-photo-hero + .section {
    padding-top: 100px !important;
  }

  .house-photo-hero h1 {
    font-size: clamp(41px, 13.6vw, 71px) !important;
    line-height: .88 !important;
    max-width: 10.5ch;
    margin-inline: auto;
  }

  body:not(.home-page) main > section:not(.home-hero):not(.house-photo-hero):not(.season-page-hero):not(.page-hero):not(.location-hero) {
    text-align: center;
  }
  /* Überschriften & Fließtext mobil nicht nur textzentriert, sondern auch der Block
     selbst mittig (sonst stehen max-width-Titel/Absätze trotz text-align links). */
  body:not(.home-page) main > section:not(.home-hero):not(.house-photo-hero):not(.season-page-hero):not(.page-hero):not(.location-hero) h2,
  body:not(.home-page) main > section:not(.home-hero):not(.house-photo-hero):not(.season-page-hero):not(.page-hero):not(.location-hero) .copy-text {
    margin-left: auto;
    margin-right: auto;
  }

  .house-photo-composition {
    min-height: 0;
    margin-top: -40px;
    padding-top: 42px !important;
    padding-bottom: 32px !important;
  }

  .house-photo-composition .house-photo-wash {
    display: none;
  }

  body:not(.home-page) main > .section + .house-photo-composition {
    margin-top: -80px;
    padding-top: 120px !important;
    background: rgb(244 237 224) !important;
  }

  .house-photo-composition .container.stack-md {
    display: grid !important;
    grid-template-columns: 1.4fr 1fr !important;
    grid-template-rows: none !important;
    gap: 12px !important;
    width: min(100%, 430px);
    margin-inline: auto;
    align-items: start;
  }

  .house-photo-composition .container.stack-md > div {
    display: grid !important;
    gap: 12px !important;
    padding-top: 34px !important;
  }

  .house-photo-composition .container.stack-md > .ph {
    grid-column: auto;
    grid-row: auto;
    aspect-ratio: 5 / 6 !important;
    min-height: 0 !important;
    width: 100%;
    height: auto;
    transform: none !important;
    z-index: 1;
    opacity: 1;
  }

  .house-photo-composition .container.stack-md > div > .ph:nth-child(1) {
    grid-column: auto;
    grid-row: auto;
    aspect-ratio: 5 / 4 !important;
    width: 100%;
    height: auto;
    min-height: 0 !important;
    transform: none !important;
    z-index: 1;
  }

  .house-photo-composition .container.stack-md > div > .ph:nth-child(2) {
    grid-column: auto;
    grid-row: auto;
    aspect-ratio: 5 / 4 !important;
    width: 100%;
    height: auto;
    min-height: 0 !important;
    transform: none !important;
    z-index: 1;
  }

  .house-photo-composition .ph {
    background-position: center 35% !important;
  }

  .house-apartments { padding-top: 62px }
  .house-apt-head {
    display: block;
    margin-bottom: 30px;
    text-align: center;
  }
  .house-apt-head h2 { font-size: clamp(36px, 10.2vw, 54px); line-height: .98 }
  .house-apt-head p { display: none }
  .house-apt-layout { display: block }
  .house-apt-list {
    position: static;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(0, 1fr));
    gap: 7px;
    overflow: visible;
    border: 0;
    padding: 0 0 22px;
    scrollbar-width: none;
  }
  .house-apt-list::-webkit-scrollbar { display: none }
  .house-apt-row {
    min-width: 0;
    min-height: 76px;
    display: grid;
    grid-template-columns: 1fr;
    gap: 5px;
    scroll-snap-align: start;
    padding: 13px 6px !important;
    border: 1px solid var(--line);
    background: transparent;
    text-align: center;
  }
  .house-apt-row::after { display: none }
  .house-apt-row span { display: none }
  .house-apt-row strong { font-size: clamp(17px, 5.8vw, 27px); line-height: .95 }
  .house-apt-row em { grid-column: 1; font-size: 11px; line-height: 1.2 }
  .house-apt-row.apt-row-active {
    background: var(--ink);
    color: var(--cream);
    border-color: var(--ink);
  }
  .house-apt-row.apt-row-active strong,
  .house-apt-row.apt-row-active em { color: var(--cream) }
  .house-apt-stage { min-height: 0 }
  .house-apt-panel {
    position: relative;
    display: block;
  }
  .house-apt-panel[hidden] { display: none }
  .house-apt-photo {
    min-height: 0;
    width: min(82vw, 380px);
    aspect-ratio: 4 / 4.6;
    margin: 14px auto 28px;
  }
  .house-apt-copy {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 14px 18px;
    align-items: center;
    padding: 0 0 70px;
    text-align: left;
  }
  .house-apt-copy .mono { grid-column: 1 / -1; text-align: left; font-size: 11px }
  .house-apt-copy h3 { grid-column: 1; font-size: clamp(36px, 10.2vw, 54px); line-height: .88 }
  .house-apt-copy p:not(.mono) { grid-column: 1 / -1; font-size: 18px; line-height: 1.7; max-width: none }
  .house-apt-copy .link-btn {
    grid-column: 2;
    grid-row: 2;
    align-self: center;
    white-space: nowrap;
    gap: 10px;
    padding: 0;
  }
  .house-apt-copy .link-btn .label {
    font-size: 0;
  }
  .house-apt-copy .link-btn .label::before {
    content: "Ansehen";
    font-family: "Jost", sans-serif;
    font-size: 14px;
    letter-spacing: .02em;
  }
  .house-apt-copy .link-btn .arr-line {
    width: 34px;
  }
  .house-apt-controls {
    left: 0;
    right: auto;
    bottom: 8px;
    gap: 22px;
  }

  .house-location-section {
    padding: 0 !important;
  }
  .house-location-grid {
    display: flex;
    flex-direction: column-reverse;
    gap: 26px;
    text-align: center;
    padding-bottom: 34px;
  }
  .house-location-photo {
    width: 100%;
    min-height: 0;
    aspect-ratio: 6 / 5;
    margin: 0 auto 0 0;
  }
  .house-location-copy {
    padding: 54px 0 0;
  }
  .house-location-copy h2 { font-size: clamp(36px, 10.2vw, 54px); line-height: .9 }
  .house-location-copy > p:not(.mono) { font-size: 18px; line-height: 1.72; margin-inline: auto; margin-top: clamp(32px, 8vw, 44px) !important }
  .house-location-actions {
    display: grid;
    gap: 20px;
    justify-items: center;
    margin-top: 38px;
    margin-bottom: 26px;
  }
  .house-location-actions .link-btn { order: 1; justify-content: center; padding-inline: 0; width: auto }
  .house-location-actions .btn { order: 2; justify-content: center; width: auto; min-width: 218px; margin-inline: 0 }

  .seasons-section { padding-top: 46px !important }
  .seasons-section .container > .stack-sm {
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    margin-bottom: 34px !important;
  }
  .seasons-section .container > .stack-sm h2 {
    text-align: center !important;
    margin-inline: auto !important;
  }
  .seasons-section .container > .stack-sm p {
    text-align: center !important;
    margin-inline: auto !important;
    max-width: 29rem !important;
    font-size: var(--copy-size-mobile);
    line-height: var(--copy-line-mobile);
  }
  .seasons-section .container > div[style*="grid-template-columns"] {
    grid-template-columns: 1fr !important;
    gap: 34px !important;
  }
  .seasons-section .season-card {
    display: block !important;
    width: min(78vw, 340px) !important;
    text-align: center;
  }
  .seasons-section .season-summer {
    margin: 0 auto 0 0 !important;
  }
  .seasons-section .season-winter {
    margin: 28px 0 0 auto !important;
  }
  .seasons-section .season-card > div[style*="aspect-ratio"] {
    width: 100% !important;
    min-height: 0 !important;
    aspect-ratio: 4 / 3.35 !important;
    margin: 0 auto 22px !important;
  }
  .seasons-section .season-card > div:last-child {
    padding: 0 !important;
    border-top: 0 !important;
    text-align: center !important;
    width: 100%;
    margin-inline: auto;
  }
  .seasons-section .season-card .serif {
    font-size: clamp(44px, 14vw, 72px) !important;
    line-height: .92 !important;
  }
  .seasons-section .season-card .serif-it {
    font-size: clamp(22px, 7vw, 32px) !important;
  }
  .seasons-section .season-card > .wm { opacity: .55; font-size: 78vw !important }

  .season-page-hero {
    height: 65svh;
    min-height: 0 !important;
    max-height: 65svh;
    padding: 0 !important;
    display: grid;
    place-items: center;
  }
  .season-page-hero .container {
    width: 100%;
    padding-top: 140px;
    padding-bottom: 24px;
  }
  .season-page-hero .stack-md {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 18px !important;
    align-items: center;
  }
  .season-page-hero h1,
  .season-page-hero h1 .serif-it {
    color: var(--cream);
    text-align: center !important;
  }
  .season-page-hero h1 {
    max-width: 10ch !important;
    order: 2;
    font-size: clamp(41px, 13.6vw, 71px) !important;
  }
  .season-page-hero .season-hero-photo {
    order: 1;
    width: min(76vw, 340px);
    aspect-ratio: 4 / 3.85 !important;
    min-height: 0 !important;
    max-height: none;
    margin-inline: auto;
    transform: none !important;
  }
  .season-page-hero p { display: none }
  body.light-nav .headbar.at-top {
    background: transparent !important;
    color: var(--ink) !important;
    border-bottom-color: transparent !important;
    backdrop-filter: none !important;
  }

  body.light-nav .headbar.at-top .brand.logo-brand img {
    filter: none !important;
  }

  body.light-nav .headbar.at-top .back-link,
  body.light-nav .headbar.at-top .house-context,
  body.light-nav .headbar.at-top .nav-toggle {
    color: var(--ink) !important;
  }

  body.light-nav .headbar.at-top .house-context-sep {
    background: rgba(36,31,26,.28);
  }

  .season-activities.dark .hover-list .hl-row:hover,
  .season-activities.dark .hover-list .hl-row.open { color: var(--cream) }
  .season-activities.dark .hover-list .hl-row:hover .hl-title,
  .season-activities.dark .hover-list .hl-row.open .hl-title,
  .season-activities.dark .hover-list .hl-row:hover .hl-num,
  .season-activities.dark .hover-list .hl-row.open .hl-num,
  .season-activities.dark .hover-list .hl-row:hover .hl-desc,
  .season-activities.dark .hover-list .hl-row.open .hl-desc,
  .season-activities.dark .hover-list .hl-row:hover .hl-arrow,
  .season-activities.dark .hover-list .hl-row.open .hl-arrow { color: var(--cream) !important }

  body:not(.home-page) .season-page-hero ~ .section .container.stack-md:has(> .ph) {
    display: flex !important;
    gap: 22px !important;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    overscroll-behavior-inline: contain;
    padding-inline: var(--pad-x);
    margin-inline: calc(-1 * var(--pad-x));
    scrollbar-width: none;
  }
  body:not(.home-page) .season-page-hero ~ .section .container.stack-md:has(> .ph)::-webkit-scrollbar { display: none }
  body:not(.home-page) .season-page-hero ~ .section .container.stack-md:has(> .ph) > .ph {
    flex: 0 0 min(74vw, 330px) !important;
    height: 330px !important;
    min-height: 0 !important;
    aspect-ratio: auto !important;
    margin-top: 0 !important;
    scroll-snap-align: center;
    transform: none !important;
  }

  body:not(.home-page) .season-photo-carousel {
    display: flex !important;
    gap: 22px !important;
    overflow-x: auto;
    overflow-y: hidden;
    scroll-snap-type: x mandatory;
    overscroll-behavior-inline: contain;
    -webkit-overflow-scrolling: touch;
    padding-inline: var(--pad-x);
    margin-inline: calc(-1 * var(--pad-x));
    scrollbar-width: none;
  }

  body:not(.home-page) .season-photo-carousel::-webkit-scrollbar {
    display: none;
  }

  body:not(.home-page) .season-photo-carousel > .season-photo-item,
  body:not(.home-page) .season-photo-carousel > .season-photo-item[style] {
    position: relative !important;
    flex: 0 0 min(74vw, 330px) !important;
    width: min(74vw, 330px) !important;
    height: 330px !important;
    min-height: 0 !important;
    aspect-ratio: auto !important;
    margin-top: 0 !important;
    overflow: hidden !important;
    scroll-snap-align: center;
    transform: none !important;
  }

  body:not(.home-page) .season-photo-carousel > .season-photo-item img {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
  }

  .season-photo-controls {
    display: flex;
    justify-content: center;
    gap: 22px;
    padding-inline: var(--pad-x);
    margin-top: 18px;
  }

  .timeline-row,
  .timeline-row[style] {
    display: grid !important;
    grid-template-columns: auto 1fr !important;
    gap: 8px 16px !important;
    padding: 18px 0 !important;
    text-align: left !important;
  }

  .timeline-row > div:first-child {
    grid-column: 1;
    font-size: 20px !important;
    line-height: 1 !important;
  }

  .timeline-row > h3 {
    grid-column: 2;
    font-size: 22px !important;
    line-height: 1.08 !important;
  }

  .timeline-row > p {
    grid-column: 1 / -1;
    max-width: none !important;
    margin: 4px 0 0 !important;
    font-size: 14px !important;
    line-height: 1.6 !important;
    text-align: left !important;
  }

  .location-hero .container { text-align: center }
  .location-distances { background: var(--bg) !important; color: var(--ink) !important }
  .location-distances .experience-photo-wash { display: none !important }
  .location-map-frame { height: 58svh }

  .apt-showcase { padding-top: 48px }
  .apt-show-head { display: block; text-align: center; margin-bottom: 24px }
  /* Mobil keine max-width-Begrenzung auf dem Titel (überschreibt die Inline-max-width).
     Das lange Einzelwort "Ferienwohnungen" wird per Silbentrennung sauber umbrochen,
     damit der Titel groß bleiben kann und auf schmalen Screens nicht überläuft. */
  /* Enge Inline-max-width (11ch) auf dem Titel mobil aufheben, damit "Unsere
     Ferienwohnungen" die volle Breite nutzt. Silbentrennung + Umbruch als
     Sicherheitsnetz, damit das lange Wort auf schmalen Screens nie überläuft. */
  .apt-show-head h2 {
    font-size: clamp(34px, 9vw, 54px) !important;
    line-height: 1.04;
    max-width: none !important;
    hyphens: auto;
    -webkit-hyphens: auto;
    overflow-wrap: break-word;
  }
  .apt-show-grid { display: block }
  .apt-card-list {
    position: static;
    display: flex;
    gap: 8px;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    margin-bottom: 24px;
  }
  .apt-card-list::-webkit-scrollbar { display: none }
  /* Dezenter eigener Scroll-Indikator (Linie statt nativer Scrollbar) */
  .apt-scroll-hint {
    display: none;
    height: 2px;
    margin: -8px auto 22px;
    width: 56px;
    border-radius: 2px;
    background: rgba(205, 193, 173, .4); /* --line, transparent */
    overflow: hidden;
  }
  .apt-scroll-hint.is-visible { display: block }
  .apt-scroll-hint-thumb {
    display: block;
    height: 100%;
    width: 40%;
    border-radius: 2px;
    background: var(--line);
    transition: transform .08s linear;
    will-change: transform;
  }
  /* Wohnungs-Buttons mobil: 2×2 (zwei nebeneinander, zwei darunter) */
  .apt-actions {
    display: grid !important;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
  }
  .apt-actions .btn {
    width: 100%;
    justify-content: space-between;
    padding-left: 16px;
    padding-right: 14px;
  }
  .apt-card {
    min-height: 0;
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 11px 20px;
    border: 1px solid var(--line);
    text-align: center;
    border-radius: 0;
    white-space: nowrap;
    flex-shrink: 0;
  }
  .apt-card::after,
  .apt-card-meta { display: none }
  .apt-card-num {
    font-size: 11px;
    grid-row: auto;
    font-family: "JetBrains Mono", monospace;
    letter-spacing: .08em;
    opacity: .5;
  }
  .apt-card-title {
    display: block;
    font-size: 14px;
  }
  .apt-card.active {
    background: var(--ink);
    color: var(--cream);
  }
  .apt-card.active .apt-card-num { color: var(--cream); opacity: .7 }
  .apt-card.active .apt-card-title { color: var(--cream) }
  .apt-panel-wrap { min-height: 0 }
  .apt-show-panel { display: block }
  .apt-show-panel[hidden] { display: none }
  .apt-photo-triptych {
    min-height: 0;
    display: grid;
    grid-template-columns: 1.15fr .85fr;
    grid-template-rows: 142px 142px;
    gap: 12px;
    margin-bottom: 28px;
  }
  .apt-shot.big { grid-row: 1 / span 2 }
  /* 6-Bild-Variante mobil: 2 Spalten × 3 Reihen */
  .apt-photo-triptych.six {
    grid-template-columns: 1fr 1fr;
    grid-template-rows: repeat(3, 118px);
  }
  .apt-photo-triptych.six .apt-shot {
    grid-row: auto;
    aspect-ratio: auto;
  }
  .apt-show-copy { text-align: center }
  .apt-show-copy .mono { display: none }
  .apt-show-copy h3 { font-size: clamp(36px, 10.2vw, 54px) }
  .apt-show-copy > p:not(.mono) { font-size: 18px; line-height: 1.72; margin-top: clamp(28px, 6vw, 38px) !important }
  .apt-actions { gap: 10px }
  .included-section { padding-top: 54px !important }
  .booking-notes { padding-top: 54px !important }
  .included-section .container > .reveal,
  .booking-notes .container > .reveal {
    margin-bottom: 28px !important;
    text-align: center;
  }
  .included-grid { grid-template-columns: 1fr; border-left: 0 }
  .included-grid > div { border-left: 1px solid var(--line); padding: 22px 18px }
  .booking-notes .stat-grid,
  .booking-notes .stat-grid[style] { grid-template-columns: 1fr !important }
  .booking-notes > .wm.solid,
  .included-section .wm.solid {
    top: auto !important;
    bottom: 0 !important;
    font-size: 58vw !important;
    opacity: .25;
  }

  .apt-modal-inner {
    width: min(94vw, 520px);
    max-height: 88vh;
    min-height: auto;
    display: block;
    padding: 18px;
  }
  .apt-modal-gallery { grid-template-columns: 1fr; margin-bottom: 22px }

  .nav-arrow,
  .gallery-arrow {
    width: 50px;
    height: 34px;
    border: 0 !important;
    background: transparent !important;
    color: currentColor;
  }
  .nav-arrow svg,
  .gallery-arrow svg { width: 31px; height: 18px }
}

@media (max-width: 430px) {
  .headbar .main { padding-left: 18px; padding-right: 10px; gap: 8px }
  .headbar .brand.logo-brand img { max-width: 104px }
  .headbar .main > div:first-child { gap: 8px !important }
  .house-context span,
  .house-context strong {
    font-size: 10.5px;
    letter-spacing: .13em;
  }
  .house-context strong { max-width: 15ch; font-size: 11.5px }
  .house-context-sep { height: 44px }
  .headbar .back-link { width: 24px }
  .headbar .back-link span:first-child { font-size: 25px }
  .nav-toggle { width: 36px; height: 40px }
  .headbar .nav-toggle { right: 14px }
  .nav-toggle .icn { width: 28px; height: 28px }
  .home-facts { gap: 8px !important }
  .home-facts .icn { width: 30px; height: 30px }
  .drawer > nav:not(.drawer-lang-inline) a,
  .drawer > nav:not(.drawer-lang-inline) a:nth-child(2n) {
    font-size: clamp(25px, 8.8vw, 38px);
  }
  .house-photo-composition .container.stack-md {
    grid-template-rows: none !important;
    gap: 10px !important;
  }
  .house-photo-composition .container.stack-md > div {
    gap: 10px !important;
    padding-top: 30px !important;
  }
  .apt-card-list { gap: 6px }
  .apt-card { min-height: 64px }
}

/* Final hero typography scale: calmer on desktop and mobile headers */
@media (min-width: 1025px) {
  .home-page .home-hero h1 {
    font-size: clamp(31px, 5.7vw, 95px) !important;
    line-height: .92 !important;
  }

  .apartment-hero h1,
  .location-hero h1,
  .house-photo-hero h1,
  .season-page-hero h1 {
    font-size: clamp(35px, 4.76vw, 71px) !important;
    line-height: .92 !important;
  }
}

@media (min-width: 1025px) and (max-width: 1440px) {
  .home-page .home-hero h1 {
    font-size: clamp(34px, 4.84vw, 71px) !important;
  }

  .apartment-hero h1,
  .location-hero h1,
  .house-photo-hero h1,
  .season-page-hero h1 {
    font-size: clamp(32px, 4.42vw, 65px) !important;
  }
}

@media (max-width: 1024px) {
  .home-hero h1,
  .apartment-hero h1,
  .location-hero h1,
  .house-photo-hero h1,
  .season-page-hero h1 {
    font-size: clamp(29px, 9.52vw, 50px) !important;
    line-height: .92 !important;
  }
}

/* Desktop refinement: prevent oversized titles and tighten long editorial sections */
@media (min-width: 1025px) {
  .home-page .home-hero h1 {
    max-width: min(16ch, calc(100vw - 260px)) !important;
    font-size: clamp(36px, 5.27vw, 88px) !important;
    text-wrap: balance;
  }

  .apartment-hero h1,
  .location-hero h1,
  .house-photo-hero h1,
  .season-page-hero h1 {
    max-width: min(14ch, calc(100vw - 220px)) !important;
    font-size: clamp(36px, 4.42vw, 66px) !important;
    text-wrap: balance;
    overflow-wrap: normal;
    hyphens: none;
  }

  .experience-section > .container,
  .location-distances > .container {
    max-width: min(1080px, calc(100vw - 180px));
  }

  .experience-section .stack-sm,
  .location-distances .stack-sm {
    max-width: 1080px;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: clamp(36px, 4vw, 52px) !important;
  }

  .experience-section .hover-list,
  .location-distances .hover-list {
    max-width: 1080px;
    margin-left: auto;
    margin-right: auto;
  }

  .hover-list .hl-row {
    grid-template-columns: minmax(180px, .52fr) minmax(320px, 1fr) 36px;
    padding-top: 28px;
    padding-bottom: 28px;
    gap: clamp(22px, 3vw, 46px);
  }

  .hover-list .hl-title {
    font-size: clamp(17px, 1.4vw, 22px);
    line-height: 1.15;
    letter-spacing: 0;
    font-family: "Jost", sans-serif;
       font-weight: 400;
  }

  .hover-list .hl-desc {
    font-size: var(--copy-size);
    line-height: var(--copy-line);
  }

  .experience-section .stack-sm p,
  #houses-section .stack-sm p,
  .intro-copy p,
  .house-apt-head > p,
  .house-apt-copy p:not(.mono),
  .apt-show-copy > p:not(.mono),
  .house-location-copy > p:not(.mono) {
    font-size: var(--copy-size);
    line-height: var(--copy-line);
    font-weight: 300;
  }

  .faq-photo-section .acc-body p {
    font-size: var(--copy-size);
    line-height: var(--copy-line);
  }

  .apt-showcase {
    padding-bottom: clamp(34px, 4vw, 56px) !important;
  }

  .apt-panel-wrap {
    min-height: clamp(400px, 36vw, 540px);
  }

  .included-section {
    padding-top: clamp(34px, 4vw, 58px) !important;
    padding-bottom: clamp(46px, 5vw, 72px) !important;
  }

  .booking-notes,
  .booking-notes[style] {
    padding-top: clamp(38px, 4vw, 62px) !important;
    padding-bottom: clamp(58px, 6vw, 90px) !important;
  }

  .included-section .container > .reveal,
  .booking-notes .container > .reveal {
    margin-bottom: 28px !important;
  }

  .included-section > .container,
  .booking-notes > .container {
    max-width: min(960px, calc(100vw - 220px));
  }

  .included-section .container > .reveal,
  .booking-notes .container > .reveal,
  .included-section .container > .reveal[style],
  .booking-notes .container > .reveal[style] {
    max-width: 620px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    margin-bottom: clamp(24px, 2.8vw, 36px) !important;
    text-align: center;
  }

  .included-section .container > .reveal h2,
  .booking-notes .container > .reveal h2,
  .included-section .container > .reveal h2[style],
  .booking-notes .container > .reveal h2[style] {
    font-size: clamp(29px, 3.48vw, 49px) !important;
    line-height: .98 !important;
    letter-spacing: 0 !important;
    text-wrap: balance;
  }

  .included-grid,
  .booking-notes .stat-grid,
  .booking-notes .stat-grid[style] {
    max-width: 960px;
    margin-left: auto;
    margin-right: auto;
  }

  .included-grid > div {
    padding: 22px 22px;
    font-size: clamp(17px, 1.35vw, 21px);
    line-height: 1.18;
  }

  .booking-notes .stat-grid > div {
    padding: 26px 24px;
  }

  .booking-notes .stat-grid .serif {
    font-size: clamp(31px, 3.4vw, 50px);
  }

  .booking-notes .stat-grid .serif-it {
    font-size: 13px;
    margin-top: 10px;
  }

  .booking-notes .stat-grid p {
    font-size: 12.5px;
    line-height: 1.62;
  }

  .booking-notes .container > .reveal:last-child {
    justify-content: center;
  }

  .season-page-hero {
    padding: 0 !important;
    display: grid !important;
    grid-template-columns: 1fr !important;
    grid-template-rows: 1fr !important;
    min-height: min(65vh, 620px) !important;
    max-height: none !important;
    height: auto !important;
    overflow: hidden !important;
  }

  .season-page-hero .container {
    position: relative !important;
    z-index: 2;
    display: flex !important;
    align-items: flex-end !important;
    padding-bottom: clamp(48px, 5vw, 76px) !important;
    padding-top: clamp(82px, 8vw, 118px) !important;
  }

  .season-page-hero .stack-md {
    grid-template-columns: 1fr auto !important;
    gap: clamp(28px, 4vw, 56px) !important;
    align-items: end !important;
    width: 100% !important;
  }

  .season-page-hero .stack-md > div:first-child {
    justify-self: start !important;
    text-align: left !important;
    z-index: 2;
  }

  .season-page-hero h1,
  .season-page-hero h1 .serif-it {
    text-align: left !important;
    color: var(--cream) !important;
  }

  .season-page-hero h1 {
    max-width: none !important;
    margin-inline: 0 !important;
    white-space: nowrap;
    font-size: clamp(44px, 5.95vw, 94px) !important;
  }

  .season-page-hero .season-hero-photo {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    aspect-ratio: auto !important;
    max-height: none !important;
    min-height: 0;
    z-index: 0;
    object-fit: cover;
  }

  .season-page-hero::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(20,16,12,.2) 0%, rgba(20,16,12,.1) 40%, rgba(20,16,12,.65) 100%);
    z-index: 1;
    pointer-events: none;
  }

}

/* Final alignment pass: keep every subpage hero optically centered and modals viewport-centered */
@media (min-width: 1025px) {
  .apartment-hero > div,
  .location-hero > div,
  .house-photo-hero {
    min-height: 65svh !important;
  }

  .apartment-hero .container,
  .location-hero .container,
  .house-photo-hero .container {
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    max-width: none !important;
    margin-inline: auto !important;
    transform: none !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    align-items: center !important;
    text-align: center !important;
    padding-top: clamp(170px, 35vw, 240px) !important;
    padding-bottom: clamp(58px, 5vw, 86px) !important;
  }

  .apartment-hero .container > div,
  .location-hero .container > div,
  .house-photo-hero .container > div {
    width: min(100%, 980px) !important;
    margin-inline: auto !important;
    justify-content: center !important;
    align-items: center !important;
    text-align: center !important;
  }

  .apartment-hero h1,
  .location-hero h1,
  .house-photo-hero h1 {
    max-width: min(13ch, calc(100vw - 220px)) !important;
    margin-inline: auto !important;
    text-align: center !important;
  }

  .apartment-hero p,
  .location-hero p,
  .house-photo-hero p,
  .apartment-hero .hero-link,
  .location-hero .hero-link,
  .house-photo-hero .hero-link {
    margin-left: auto !important;
    margin-right: auto !important;
    text-align: center !important;
  }

  .location-hero .container {
    justify-content: center !important;
    padding-left: clamp(72px, 7vw, 140px) !important;
    padding-right: clamp(72px, 7vw, 140px) !important;
    padding-bottom: clamp(54px, 6vw, 96px) !important;
  }

  .location-hero h1 {
    max-width: min(11ch, calc(100vw - 180px)) !important;
    font-size: clamp(44px, 8.16vw, 136px) !important;
    line-height: .88 !important;
  }

  .location-hero .container > div {
    display: flex !important;
    width: 100% !important;
    max-width: 760px !important;
    flex-direction: column !important;
    justify-content: center !important;
    align-items: center !important;
    gap: 28px !important;
    margin-top: 28px !important;
  }

  .location-hero p {
    max-width: 640px !important;
    text-align: center !important;
    margin: 0 auto !important;
  }

  .location-hero .hero-link {
    position: static !important;
    left: auto !important;
    right: 18px !important;
    bottom: auto !important;
    transform: none !important;
    margin: 0 auto !important;
  }

  .season-page-hero .stack-md > div:first-child {
    justify-self: center !important;
    text-align: center !important;
  }

  .season-page-hero h1,
  .season-page-hero h1 .serif-it {
    margin-inline: auto !important;
    text-align: center !important;
    transform: none !important;
  }

  .season-page-hero .container {
    width: 100% !important;
    max-width: none !important;
  }

  .season-page-hero .stack-md {
    position: relative !important;
    min-height: min(56svh, 520px) !important;
    display: grid !important;
    grid-template-columns: 1fr !important;
    place-items: center !important;
  }

  .season-page-hero .stack-md > div:first-child,
  .season-page-hero .season-hero-photo {
    grid-column: 1 !important;
    grid-row: 1 !important;
  }

  .season-page-hero .stack-md > div:first-child {
    z-index: 2;
    width: min(100%, 1020px) !important;
    justify-self: center !important;
    align-self: center !important;
  }

  .season-page-hero .season-hero-photo {
    width: min(75vw, 970px) !important;
    justify-self: center !important;
    align-self: center !important;
    transform: translateY(12%) !important;
  }

  .season-page-hero h1,
  .season-page-hero h1 .serif-it {
    color: var(--cream) !important;
  }
}

@media (max-width: 1024px) {
  .season-page-hero h1,
  .season-page-hero h1 .serif-it {
    color: var(--ink) !important;
  }
}

.apt-modal {
  width: 100vw;
  height: 100svh;
  align-items: center !important;
  justify-items: center !important;
  padding: clamp(18px, 3vw, 42px) !important;
}

.apt-modal-inner {
  width: min(1280px, 94vw) !important;
  max-width: 94vw !important;
  margin: auto !important;
  justify-self: center !important;
  align-self: center !important;
}

[data-info-modal] .apt-modal-inner {
  background: var(--bg);
  color: var(--ink);
  grid-template-columns: 1fr;
  max-width: 960px;
  text-align: center;
  padding: clamp(32px, 5vw, 56px);
  overflow: visible;
  max-height: none;
  min-height: 0;
}
[data-info-modal] .info-modal-heading {
  color: var(--ink);
  font-weight: 300;
  letter-spacing: -.01em;
  line-height: 1;
  margin-bottom: clamp(28px, 3.5vw, 40px);
}
[data-info-modal] .info-modal-heading .serif-it {
  color: var(--accent);
}
[data-info-modal] .included-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 0 clamp(32px, 4vw, 64px);
  text-align: left;
  color: var(--ink);
  border: none;
}
[data-info-modal] .included-grid > div {
  border: none;
  border-bottom: 1px solid var(--line);
  padding: 16px 0;
  font-family: "Playfair Display", serif;
  font-size: clamp(16px, 1.5vw, 20px);
  font-weight: 300;
  letter-spacing: .01em;
}
[data-info-modal] .stat-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  text-align: left;
  background: transparent;
  gap: 0 clamp(32px, 4vw, 64px);
}
[data-info-modal] .stat-grid > div {
  color: var(--ink);
  background: transparent;
  padding: clamp(20px, 2.5vw, 28px) 0;
  overflow: visible;
  border-bottom: 1px solid var(--line);
}
[data-info-modal] .stat-grid > div::before {
  display: none;
}
[data-info-modal] .stat-grid > div:hover {
  color: var(--ink);
}
[data-info-modal] .stat-grid .serif {
  font-size: clamp(18px, 1.8vw, 24px);
  line-height: 1.1;
}
[data-info-modal] .stat-grid .serif-it {
  font-size: clamp(18px, 1.8vw, 24px);
  line-height: 1.2;
}
[data-info-modal] .stat-grid p {
  color: var(--ink-soft);
  font-size: 13px;
  line-height: 1.7;
  margin-top: 10px;
  text-wrap: balance;
}
[data-info-modal] .btn.on-dark {
  border-color: var(--ink);
  color: var(--ink);
}
[data-info-modal] .btn.on-dark::before {
  background: var(--ink);
}
@media (max-width: 1024px) {
  [data-info-modal] .included-grid {
    grid-template-columns: 1fr !important;
  }
  [data-info-modal] .stat-grid,
  [data-info-modal] .stat-grid[style] {
    grid-template-columns: 1fr !important;
    gap: 0 !important;
  }
  [data-info-modal] .apt-modal-inner {
    max-width: 100vw;
    padding: clamp(24px, 5vw, 40px) !important;
    overflow-y: auto;
    max-height: 90svh;
  }
  [data-info-modal] .info-modal-heading {
    font-size: clamp(28px, 7vw, 40px) !important;
  }
}
[data-info-modal] .btn.on-dark:hover {
  color: var(--cream);
}
[data-info-modal] .apt-modal-close {
  color: var(--ink);
  position: fixed;
  top: clamp(20px, 3vw, 42px);
  right: clamp(20px, 3vw, 42px);
  z-index: 100;
  background: var(--bg);
  border-radius: 50%;
  width: 48px;
  height: 48px;
  box-shadow: 0 2px 12px rgba(0,0,0,.1);
}
[data-info-modal] {
  backdrop-filter: blur(14px);
}

@media (min-width: 1025px) {
  [data-info-modal] {
    align-items: center !important;
    padding: clamp(18px, 2.2vw, 34px) !important;
  }
  [data-info-modal] .apt-modal-inner {
    width: min(1380px, 88vw) !important;
    max-width: 88vw !important;
    max-height: calc(100svh - 76px) !important;
    padding: clamp(28px, 3.2vw, 48px) clamp(44px, 5.4vw, 86px) !important;
    overflow-y: auto;
    scrollbar-width: none;
  }
  [data-info-modal] .apt-modal-inner::-webkit-scrollbar {
    display: none;
  }
  [data-info-modal] .info-modal-heading {
    font-size: clamp(34px, 3.4vw, 52px) !important;
    line-height: .9;
    margin-bottom: clamp(18px, 2.4vw, 30px) !important;
  }
  [data-info-modal] .info-modal-heading + .included-grid {
    margin-bottom: clamp(24px, 3vw, 44px);
  }
  [data-info-modal] .included-grid {
    gap: 0 clamp(34px, 4vw, 68px);
  }
  [data-info-modal] .included-grid > div {
    padding: clamp(9px, 1vw, 13px) 0;
    font-size: clamp(15px, 1.2vw, 18px);
  }
  [data-info-modal] .info-modal-heading[style*="margin-top"] {
    margin-top: clamp(24px, 3vw, 42px) !important;
  }
  [data-info-modal] .stat-grid {
    gap: 0 clamp(34px, 4vw, 68px);
  }
  [data-info-modal] .stat-grid > div {
    padding: clamp(12px, 1.4vw, 18px) 0;
  }
  [data-info-modal] .stat-grid .serif,
  [data-info-modal] .stat-grid .serif-it {
    font-size: clamp(17px, 1.45vw, 22px);
  }
  [data-info-modal] .stat-grid p {
    font-size: 12px;
    line-height: 1.55;
    margin-top: 8px;
  }
}

@media (max-width: 1024px) {
  .apartment-hero > div,
  .location-hero > div,
  .house-photo-hero {
    min-height: 70svh !important;
  }

  .apartment-hero .container,
  .location-hero .container,
  .house-photo-hero .container {
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    transform: none !important;
    justify-content: center !important;
    align-items: center !important;
    text-align: center !important;
  }

  .apartment-hero h1,
  .location-hero h1,
  .house-photo-hero h1 {
    margin-inline: auto !important;
    text-align: center !important;
  }

  .apt-modal {
    padding: 16px !important;
  }

  .apt-modal-inner {
    width: calc(100vw - 32px) !important;
    max-width: calc(100vw - 32px) !important;
    max-height: calc(100svh - 32px) !important;
    min-height: 0 !important;
  }
}

@media (max-width: 1024px) {
  .headbar {
    transition: transform .38s cubic-bezier(.22, .72, .18, 1), background-color .28s ease, color .28s ease !important;
    will-change: transform;
  }

  .headbar.is-hidden-mobile {
    transform: translateY(-105%) !important;
  }

  .headbar.is-hidden-mobile .nav-toggle {
    transform: translateY(-150px) !important;
  }

  body.home-page > .nav-toggle.is-hidden-mobile {
    transform: translateY(-150px) !important;
  }

  html.menu-open .headbar.is-hidden-mobile {
    transform: none !important;
  }

  /* Transparent header at top — all pages */
  .headbar {
    background: transparent !important;
    border-bottom-color: transparent !important;
    backdrop-filter: none !important;
    color: var(--cream);
  }
  .headbar.at-top {
    background: transparent !important;
    border-bottom-color: transparent !important;
    backdrop-filter: none !important;
    color: var(--cream);
  }

  /* Pull hero behind the sticky header so transparent bg shows the image */
  .home-hero,
  .house-photo-hero,
  .season-page-hero,
  .page-hero,
  .apartment-hero,
  .location-hero {
    margin-top: 0 !important;
  }
  .headbar.at-top .brand.logo-brand img {
    height: clamp(72px, 20vw, 100px) !important;
    max-width: 200px !important;
    filter: invert(1) brightness(1.9);
  }
  .headbar.at-top .lang,
  .headbar.at-top .lang a,
  .headbar.at-top .lang a.active,
  .headbar.at-top .back-link,
  .headbar.at-top .house-context {
    color: var(--cream) !important;
  }
  .headbar.at-top .nav-toggle {
    color: var(--cream) !important;
  }
  .headbar.is-scrolled {
    background: rgba(36,31,26,.94) !important;
    border-bottom-color: transparent !important;
    backdrop-filter: blur(16px) !important;
    color: var(--cream);
  }
  .headbar.is-scrolled .brand.logo-brand img {
    height: clamp(44px, 11vw, 58px) !important;
    max-width: 130px !important;
    filter: invert(1) brightness(1.9);
  }
  .headbar.is-scrolled .lang,
  .headbar.is-scrolled .lang a,
  .headbar.is-scrolled .lang a.active,
  .headbar.is-scrolled .back-link,
  .headbar.is-scrolled .house-context {
    color: var(--cream) !important;
  }
  .headbar.is-scrolled .nav-toggle {
    color: var(--cream) !important;
  }

  /* Consistent header layout — ALL pages on mobile */
  .headbar .brand.logo-brand img {
    height: clamp(72px, 20vw, 100px) !important;
    max-width: 200px !important;
  }

  .headbar .main {
    position: relative !important;
  }

  .headbar .nav-toggle {
    display: inline-grid !important;
    position: fixed !important;
    right: 18px !important;
    top: 54px !important;
    transform: none !important;
    width: 63px !important;
    height: 42px !important;
    color: var(--cream) !important;
    opacity: 1 !important;
    visibility: visible !important;
    z-index: 10 !important;
    margin-right: 0 !important;
  }

  .headbar .actions {
    display: flex !important;
    position: static !important;
    transform: none !important;
    opacity: 1 !important;
    visibility: visible !important;
    z-index: 10 !important;
  }

  .headbar .nav-toggle::before,
  .headbar .nav-toggle::after {
    content: "" !important;
    position: absolute !important;
    left: 13px !important;
    right: 13px !important;
    height: 1.5px !important;
    background: var(--cream) !important;
    border-radius: 999px !important;
  }

  .headbar .nav-toggle::before {
    top: 14px !important;
  }

  .headbar .nav-toggle::after {
    bottom: 14px !important;
  }

  .headbar .nav-toggle .icn {
    opacity: 0 !important;
  }

  /* Hide back-link and house-context on mobile — house name is in the hero */
  .headbar .back-link,
  .headbar .house-context,
  .headbar .house-context-sep {
    display: none !important;
  }
  .headbar .main > div:first-child {
    display: none !important;
  }

  /* light-nav pages (sommer/winter) — dark logo & hamburger on light bg */
  body.light-nav .headbar {
    color: var(--ink) !important;
  }
  body.light-nav .headbar .brand.logo-brand img {
    filter: none !important;
  }
  body.light-nav .headbar .nav-toggle {
    color: var(--ink) !important;
  }
  body.light-nav .headbar .nav-toggle::before,
  body.light-nav .headbar .nav-toggle::after {
    background: var(--ink) !important;
  }
  body.light-nav .headbar.is-scrolled {
    color: var(--cream) !important;
    background: rgba(36,31,26,.94) !important;
    backdrop-filter: blur(16px) !important;
  }
  body.light-nav .headbar.is-scrolled .brand.logo-brand img {
    filter: invert(1) brightness(1.9) !important;
  }
  body.light-nav .headbar.is-scrolled .nav-toggle {
    color: var(--cream) !important;
  }
  body.light-nav .headbar.is-scrolled .nav-toggle::before,
  body.light-nav .headbar.is-scrolled .nav-toggle::after {
    background: var(--cream) !important;
  }

  .home-page .home-hero .container {
    justify-content: center !important;
    align-items: center !important;
    text-align: center !important;
    padding-inline: 24px !important;
  }

  .home-page .home-hero h1 {
    width: 100% !important;
    max-width: calc(100vw - 48px) !important;
    margin-inline: auto !important;
    font-size: clamp(26px, 7.65vw, 37px) !important;
    line-height: .88 !important;
    text-align: center !important;
    text-wrap: balance;
    max-width: calc(100vw - 54px) !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  .home-hero h1 {
    font-size: clamp(26px, 7.7vw, 31px) !important;
    max-width: calc(100vw - 44px) !important;
  }

  .home-page .home-hero h1 br {
    display: block !important;
  }

  .home-page .home-hero .container > div {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    width: 100% !important;
    margin-top: clamp(22px, 7vw, 34px) !important;
  }

  .home-page .home-hero .hero-link {
    display: inline-flex !important;
    margin-inline: auto !important;
    min-height: 56px !important;
    font-size: 13px !important;
    letter-spacing: .2em !important;
    padding: 16px 28px !important;
  }

  .intro-copy {
    margin-top: clamp(44px, 12vw, 64px) !important;
  }

  .home-page .houses-grid > a > div[style*="grid-template-columns"] {
    background: transparent !important;
    box-shadow: none !important;
    border: 0 !important;
  }

  .home-page .experience-section {
    padding-top: clamp(50px, 13vw, 72px) !important;
    padding-bottom: clamp(28px, 8vw, 48px) !important;
  }

  .home-page .experience-section .hover-list .hl-num,
  .home-page .experience-section .hover-list .hl-arrow {
    display: none !important;
  }

  .home-page .experience-section .hover-list .hl-row {
    grid-template-columns: 1fr !important;
    min-height: 0 !important;
    gap: 10px !important;
    padding: 18px 0 22px !important;
    cursor: default !important;
    pointer-events: none;
  }

  .home-page .experience-section .hover-list .hl-title,
  .home-page .experience-section .hover-list .hl-desc {
    grid-column: 1 !important;
  }

  .home-page .experience-section .hover-list .hl-title {
    min-height: 18px;
    display: flex;
    align-items: center;
    font-size: 13px !important;
    line-height: 1.2 !important;
  }

  .home-page .experience-section .hover-list .hl-desc {
    font-size: 15px !important;
    line-height: 1.62 !important;
    max-width: 32rem;
  }

  .home-page .gallery-section {
    padding-top: clamp(20px, 6vw, 38px) !important;
    padding-bottom: clamp(20px, 7vw, 42px) !important;
  }
  .home-page .gallery-section .container > .reveal.stack-sm {
    margin-bottom: 20px !important;
  }

  .home-page .gallery-shell {
    min-height: 0 !important;
    padding-bottom: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  .home-page .gallery-ribbon {
    min-height: 370px !important;
  }

  .home-page .gallery-controls {
    margin-top: 8px !important;
    padding: 0 var(--pad-x) !important;
    justify-content: center !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  .home-page .gallery-arrow {
    background: transparent !important;
    box-shadow: none !important;
    border-color: transparent !important;
  }

  .home-page .gallery-section + .faq-photo-section {
    padding-top: clamp(24px, 7vw, 44px) !important;
  }

  .home-page .faq-photo-section .acc-head .serif {
    font-size: clamp(15px, 4.3vw, 18px) !important;
    line-height: 1.35 !important;
  }
}

@media (max-width: 430px) {
  .headbar .main {
    padding-left: 18px !important;
    padding-right: 10px !important;
  }

  .headbar .nav-toggle {
    right: 14px !important;
    top: 38px !important;
  }

  .headbar .actions {
    right: 14px !important;
  }
}

/* Final house navigation and apartment card cleanup */
.house-context-link-group {
  cursor: pointer;
}

.house-context-link-group .back-link,
.house-context-link-group .house-context {
  cursor: pointer;
}

@media (min-width: 1025px) {
  .house-context-link-group .house-context-sep {
    transform: translateX(-10px);
    margin-right: -4px;
  }

  .house-apartments > .container,
  .apt-showcase > .container {
    max-width: min(1500px, calc(100vw - 2 * var(--pad-x)));
  }

  .house-apartments .house-apt-layout {
    grid-template-columns: minmax(200px, .34fr) minmax(0, 1fr);
    gap: clamp(28px, 3.6vw, 66px);
    align-items: center;
  }

  .house-apartments .house-apt-list {
    max-width: 370px;
  }

  .house-apartments .house-apt-row {
    grid-template-columns: 32px minmax(0, 1fr) 24px;
    column-gap: 18px;
    padding: 18px 0;
  }

  .house-apartments .house-apt-row strong {
    font-size: clamp(23px, 1.9vw, 32px);
  }

  .house-apartments .house-apt-row span {
    font-size: 24px;
  }

  .house-apartments .house-apt-row em {
    font-size: 12px;
  }

  .house-apartments .house-apt-row:focus:not(:focus-visible),
  .apt-card:focus:not(:focus-visible) {
    outline: none;
  }

  .house-apartments .house-apt-stage {
    min-height: clamp(390px, 32vw, 520px) !important;
  }

  .house-apartments .house-apt-panel {
    grid-template-columns: minmax(280px, .78fr) minmax(250px, .56fr) !important;
    gap: clamp(26px, 3.8vw, 66px) !important;
    align-items: stretch !important;
  }

  .house-apartments .house-apt-photo {
    align-self: center;
    justify-self: end;
    width: 100%;
    max-width: 560px;
    min-height: clamp(250px, 23vw, 360px) !important;
    aspect-ratio: 5 / 4 !important;
  }

  .house-apartments .house-apt-copy {
    align-self: center;
    display: grid !important;
    grid-template-rows: auto auto 1fr auto;
    gap: 0;
    max-width: 430px;
    min-height: clamp(250px, 23vw, 360px);
    padding: 4px 0 12px !important;
  }

  .house-apartments .house-apt-copy h3 {
    display: none !important;
  }

  .house-apartments .house-apt-copy .mono {
    margin: 0 !important;
    white-space: normal;
    max-width: 320px;
  }

  .house-apartments .house-apt-copy p:not(.mono) {
    display: block !important;
    margin-top: 18px !important;
    max-width: 390px !important;
    font-size: var(--copy-size);
    line-height: var(--copy-line);
  }

  .house-apartments .house-apt-copy .link-btn {
    align-self: end;
    justify-self: end;
    margin-top: 0 !important;
  }

  .house-apartments .house-apt-controls {
    display: none !important;
  }

  .apt-showcase > .container {
    max-width: min(1420px, calc(100vw - 2 * var(--pad-x)));
  }

  .apt-show-grid {
    grid-template-columns: minmax(210px, .24fr) minmax(0, .9fr);
    gap: clamp(26px, 3vw, 50px);
  }

  .apt-panel-wrap {
    min-height: clamp(420px, 36vw, 560px);
  }

  .apt-photo-triptych {
    min-height: clamp(300px, 28vw, 430px);
  }

  .apt-show-copy h3 {
    font-size: clamp(36px, 4vw, 61px);
  }
}

@media (max-width: 1024px) {
  .house-context-link-group .house-context-sep {
    transform: translateX(-10px);
    margin-right: -5px;
  }

  .house-apartments {
    padding-top: 50px !important;
  }

  .house-apartments .house-apt-row {
    grid-template-columns: minmax(0, 1fr) auto !important;
    align-items: center !important;
    text-align: left !important;
    padding-left: 14px !important;
    padding-right: 12px !important;
  }

  .house-apartments .house-apt-row::after {
    display: block !important;
    grid-column: 2 !important;
    grid-row: 1 / span 2 !important;
    align-self: center !important;
    justify-self: end !important;
    opacity: .72 !important;
    transform: none !important;
    font-size: 20px !important;
  }

  .house-apartments .house-apt-row strong,
  .house-apartments .house-apt-row em {
    grid-column: 1 !important;
    text-align: left !important;
  }

  .house-apartments .house-apt-stage {
    min-height: 0 !important;
  }

  .house-apartments .house-apt-photo {
    width: min(84vw, 480px) !important;
    aspect-ratio: 16 / 10 !important;
    margin: 12px auto 18px !important;
  }

  .house-apartments .house-apt-copy {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 18px !important;
    padding: 0 var(--pad-x) 38px !important;
    text-align: left !important;
  }

  .house-apartments .house-apt-copy h3,
  .house-apartments .house-apt-copy p:not(.mono) {
    display: none !important;
  }

  .house-apartments .house-apt-copy .mono {
    margin: 0 !important;
    text-align: left !important;
    white-space: normal;
    font-size: 10px;
  }

  .house-apartments .house-apt-copy .link-btn {
    margin-top: 0 !important;
    padding: 0 !important;
    white-space: nowrap;
  }

  .house-apartments .house-apt-controls {
    display: none !important;
  }
}

/* Final navigation cleanup: one mobile hamburger source, no body-level fallback. */
.headbar .main.container {
  width: 100%;
  max-width: 1890px;
  margin: 0 auto;
}

body > .nav-toggle {
  display: none !important;
}

@media (max-width: 1024px) {
  .headbar {
    width: 100% !important;
  }

  .headbar .main {
    position: relative !important;
  }

  .headbar .actions,
  .home-page .headbar .actions {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    align-self: center !important;
    position: static !important;
    inset: auto !important;
    transform: none !important;
    opacity: 1 !important;
    visibility: visible !important;
    height: 52px !important;
    z-index: 30 !important;
  }

  .headbar .nav-toggle,
  .home-page .headbar .nav-toggle {
    display: inline-grid !important;
    place-items: center !important;
    position: absolute !important;
    inset: auto !important;
    top: 50% !important;
    right: clamp(14px, 4vw, 22px) !important;
    bottom: auto !important;
    left: auto !important;
    transform: translateY(-50%) !important;
    width: clamp(54px, 14vw, 64px) !important;
    height: 52px !important;
    flex: 0 0 auto !important;
    margin: 0 !important;
    padding: 0 !important;
    color: var(--cream) !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    z-index: 40 !important;
  }

  .headbar .nav-toggle::before,
  .headbar .nav-toggle::after,
  .home-page .headbar .nav-toggle::before,
  .home-page .headbar .nav-toggle::after,
  .drawer .drawer-close::before,
  .drawer .drawer-close::after {
    content: "" !important;
    position: absolute !important;
    left: 9px !important;
    right: 9px !important;
    height: 1.5px !important;
    display: block !important;
    background: currentColor !important;
    border-radius: 999px !important;
  }

  .headbar .nav-toggle::before,
  .home-page .headbar .nav-toggle::before {
    top: 17px !important;
  }

  .headbar .nav-toggle::after,
  .home-page .headbar .nav-toggle::after {
    bottom: 17px !important;
  }

  .headbar .nav-toggle .icn,
  .home-page .headbar .nav-toggle .icn,
  .drawer .drawer-close .icn {
    opacity: 0 !important;
  }

  .drawer .drawer-close {
    display: inline-grid !important;
    place-items: center !important;
    position: relative !important;
    width: clamp(54px, 14vw, 64px) !important;
    height: 52px !important;
    padding: 0 !important;
    color: var(--cream) !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
  }

  .drawer .drawer-close::before,
  .drawer .drawer-close::after {
    top: 50% !important;
    transform-origin: center !important;
  }

  .drawer .drawer-close::before {
    transform: translateY(-50%) rotate(45deg) !important;
  }

  .drawer .drawer-close::after {
    transform: translateY(-50%) rotate(-45deg) !important;
  }

  .headbar.is-hidden-mobile .nav-toggle {
    transform: translateY(-50%) !important;
  }

  .drawer {
    z-index: 60 !important;
  }

  .headbar .actions,
  .home-page .headbar .actions {
    position: absolute !important;
    top: 50% !important;
    right: clamp(14px, 4vw, 22px) !important;
    width: clamp(54px, 14vw, 64px) !important;
    height: 52px !important;
    transform: translateY(-50%) !important;
    display: block !important;
    z-index: 45 !important;
  }

  .headbar .actions .nav-toggle,
  .home-page .headbar .actions .nav-toggle {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    transform: none !important;
  }
}

/* Final hero composition: Lage page is the visual reference for subpage heroes. */
@media (min-width: 1025px) {
  .home-hero .container,
  .apartment-hero .container,
  .location-hero .container,
  .house-photo-hero .container {
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
  }

  .home-hero .container > div,
  .apartment-hero .container > div,
  .location-hero .container > div,
  .house-photo-hero .container > div {
    flex-direction: column !important;
    justify-content: center !important;
    align-items: center !important;
    text-align: center !important;
    gap: 28px !important;
  }

  .home-hero h1,
  .apartment-hero h1,
  .location-hero h1,
  .house-photo-hero h1 {
    margin-inline: auto !important;
    text-align: center !important;
  }

  .home-hero p,
  .apartment-hero p,
  .location-hero p,
  .house-photo-hero p,
  .home-hero .hero-link,
  .apartment-hero .hero-link,
  .location-hero .hero-link,
  .house-photo-hero .hero-link {
    margin-inline: auto !important;
    text-align: center !important;
  }

  .season-page-hero {
    background: var(--bg) !important;
    color: var(--ink) !important;
    min-height: 65svh !important;
    height: auto !important;
    max-height: none !important;
    padding: clamp(118px, 10vw, 160px) 0 clamp(70px, 7vw, 110px) !important;
    display: block !important;
    overflow: hidden !important;
  }

  .season-page-hero::after {
    display: none !important;
  }

  .season-page-hero .container {
    width: 100% !important;
    max-width: none !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }

  .season-page-hero .stack-md {
    position: relative !important;
    display: grid !important;
    grid-template-columns: 1fr !important;
    min-height: min(54svh, 620px) !important;
    width: 100% !important;
    place-items: center !important;
  }

  .season-page-hero .stack-md > div:first-child,
  .season-page-hero .season-hero-photo {
    grid-column: 1 !important;
    grid-row: 1 !important;
  }

  .season-page-hero .stack-md > div:first-child {
    z-index: 3 !important;
    width: min(100%, 1120px) !important;
    justify-self: center !important;
    align-self: center !important;
    text-align: center !important;
  }

  .season-page-hero h1,
  .season-page-hero h1 .serif-it {
    color: var(--cream) !important;
    margin-inline: auto !important;
    text-align: center !important;
    transform: none !important;
  }

  .season-page-hero h1 {
    max-width: 12ch !important;
    white-space: normal !important;
  }

  .season-page-hero .season-hero-photo {
    position: relative !important;
    inset: auto !important;
    z-index: 1 !important;
    width: min(76vw, 1080px) !important;
    min-height: 0 !important;
    max-height: min(58vh, 620px) !important;
    aspect-ratio: 16 / 7.4 !important;
    justify-self: center !important;
    align-self: center !important;
    transform: none !important;
  }

  .season-page-hero .season-hero-photo::after {
    background:
      linear-gradient(180deg, rgba(20,16,12,.16) 0%, rgba(20,16,12,.06) 42%, rgba(20,16,12,.52) 100%),
      radial-gradient(120% 80% at 30% 20%, rgba(255,232,196,.12), transparent 50%) !important;
  }
}

/* Mobile house landing heroes: keep the title inside the image, like the location hero. */
@media (max-width: 1024px) {
  .house-photo-hero {
    min-height: 70svh !important;
    display: grid !important;
    place-items: center !important;
    overflow: hidden !important;
  }

  .house-photo-hero .container {
    position: absolute !important;
    inset: 0 !important;
    left: 0 !important;
    top: 0 !important;
    width: 100% !important;
    height: 100% !important;
    max-width: none !important;
    transform: none !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: clamp(96px, 24vw, 128px) 24px clamp(72px, 18vw, 96px) !important;
    text-align: center !important;
    color: var(--cream) !important;
    z-index: 4 !important;
  }

  .house-photo-hero h1 {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    max-width: 9.5ch !important;
    margin: 0 auto !important;
    color: var(--cream) !important;
    font-size: clamp(32px, 10.2vw, 49px) !important;
    line-height: .9 !important;
    text-align: center !important;
    text-wrap: balance;
  }

  .house-photo-hero h1 .serif-it {
    color: var(--cream) !important;
  }

  .house-photo-hero::after {
    content: "" !important;
    position: absolute !important;
    left: 50% !important;
    bottom: clamp(120px, 13vw, 200px) !important;
    width: 1px !important;
    height: 34px !important;
    transform: translateX(-50%) !important;
    background: linear-gradient(180deg, transparent, rgba(246, 241, 231, .86)) !important;
    opacity: .7 !important;
    animation: hero-scroll-hint 2s ease-in-out infinite !important;
    z-index: 6 !important;
    pointer-events: none !important;
  }

  .season-page-hero::before {
    content: "" !important;
    position: absolute !important;
    left: 50% !important;
    bottom: clamp(120px, 13vw, 200px) !important;
    width: 1px !important;
    height: 34px !important;
    transform: translateX(-50%) !important;
    background: linear-gradient(180deg, transparent, rgba(36, 31, 26, .48)) !important;
    opacity: .55 !important;
    animation: hero-scroll-hint 2s ease-in-out infinite !important;
    z-index: 6 !important;
    pointer-events: none !important;
  }
}

/* Mobile house intro -> photo composition: remove the hard section cut. */
@media (max-width: 1024px) {
  body:not(.home-page) main > .section:has(+ .house-photo-composition) {
    padding-bottom: clamp(30px, 8vw, 44px) !important;
    margin-bottom: -1px !important;
    isolation: isolate;
    z-index: 2;
  }

  body:not(.home-page) main > .section:has(+ .house-photo-composition)::after {
    display: none !important;
  }

  body:not(.home-page) main > .section:has(+ .house-photo-composition) > * {
    position: absolute;
    z-index: 1;
  }

  body:not(.home-page) main > .section + .house-photo-composition {
    margin-top: 0 !important;
    padding-top: clamp(46px, 12vw, 66px) !important;
    padding-bottom: clamp(28px, 8vw, 44px) !important;
    background: rgb(244 237 224) !important;
  }

  .house-photo-composition .house-photo-wash {
    inset: 0;
    background:
      linear-gradient(
        180deg,
        rgb(244 237 224) 0%,
        rgb(244 237 224) 5%,
        rgba(244, 237, 224, .96) 18%,
        rgba(244, 237, 224, .68) 38%,
        rgba(244, 237, 224, .18) 75%,
        transparent 75%
      ),
      url("gallery/img/web/balcony-view.webp") center top / cover no-repeat !important;
    filter: grayscale(.18) saturate(.82) brightness(.92);
  }

  .house-photo-composition::before {
    content: "";
    position: absolute;
    inset: 0 0 auto 0;
    height: clamp(50px, 13vw, 72px);
    background: linear-gradient(180deg, rgb(244 237 224) 0%, rgba(244, 237, 224, .94) 58%, rgba(244, 237, 224, 0) 100%);
    z-index: 1;
    pointer-events: none;
  }

  .house-photo-composition > .container {
    z-index: 2;
  }
}

/* Final subpage hero cleanup: light season pages, darker legal/request photo heroes. */
@media (min-width: 1025px) {
  .season-page-hero {
    background: var(--bg) !important;
    color: var(--ink) !important;
  }

  .season-page-hero .stack-md {
    transform: translateY(clamp(24px, 5vh, 58px)) !important;
  }

  .season-page-hero h1,
  .season-page-hero h1 .serif-it {
    color: var(--cream) !important;
  }

  .home-hero > div > .container::after,
  .apartment-hero > div > .container::after,
  .location-hero > div > .container::after,
  .house-photo-hero > .container::after,
  .season-page-hero > .container::after {
    content: "";
    position: absolute;
    left: 50%;
    /* Strich höher: in die freie Zone zwischen Anfrage-Button/Titel und dem
       großen Seam-Wort, nicht mehr über dem Wort (gilt Desktop, alle Heroes). */
    bottom: clamp(120px, 13vw, 200px);
    width: 1px;
    height: 42px;
    transform: translateX(-50%);
    background: linear-gradient(180deg, transparent, rgba(246, 241, 231, .86));
    opacity: .72;
    animation: hero-scroll-hint 2s ease-in-out infinite;
    pointer-events: none;
    z-index: 6;
  }
}

.page-hero,
.page-hero.page-hero-legal {
  background: var(--bg-dark) !important;
  overflow: hidden;
}

.page-hero::before,
.page-hero.page-hero-legal::before {
  opacity: 1 !important;
  filter: grayscale(.08) saturate(.9) brightness(.62);
}

.page-hero::after,
.page-hero.page-hero-legal::after {
  content: "";
  display: block !important;
  position: absolute;
  inset: 0;
  background:
    linear-gradient(180deg, rgba(20, 16, 12, .34) 0%, rgba(20, 16, 12, .08) 42%, rgba(20, 16, 12, .68) 100%),
    radial-gradient(80% 70% at 50% 40%, rgba(246, 241, 231, .08), transparent 58%);
  z-index: 1;
  pointer-events: none;
}

.page-hero > .container {
  position: absolute;
  inset: 0;
  width: 100%;
  z-index: 2;
}

.page-hero > .container::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: 28px;
  width: 1px;
  height: 42px;
  transform: translateX(-50%);
  background: linear-gradient(180deg, transparent, rgba(246, 241, 231, .86));
  opacity: .7;
  animation: hero-scroll-hint 2s ease-in-out infinite;
  pointer-events: none;
}

@media (max-width: 1024px) {
  .page-hero,
  .page-hero.page-hero-legal {
    min-height: 70svh !important;
    padding: 0 !important;
    display: flex !important;
    align-items: center !important;
  }

  .page-hero > .container::after {
    bottom: 26px;
    height: 34px;
  }
}

/* Final consistency pass: hero type, hero buttons and mobile section color splits. */
@media (min-width: 1025px) {
  .headbar .topnav a,
  .headbar.at-top .topnav a,
  .headbar.is-scrolled .topnav a {
    font-size: 15px !important;
  }

  .headbar .lang,
  .headbar .lang a,
  .headbar .back-link,
  .headbar .house-context span,
  .headbar .house-context strong {
    font-size: 13px !important;
  }

  .headbar .topnav a,
  .headbar.at-top .topnav a,
  .headbar.is-scrolled .topnav a,
  .headbar .lang,
  .headbar .lang a {
    letter-spacing: .24em !important;
  }

  .home-hero h1,
  .apartment-hero h1,
  .location-hero h1,
  .house-photo-hero h1,
  .season-page-hero h1,
  .page-hero h1 {
    font-size: clamp(46px, 6.12vw, 100px) !important;
    line-height: .9 !important;
    font-weight: 300 !important;
    letter-spacing: -.012em !important;
    text-align: center !important;
    margin-left: auto !important;
    margin-right: auto !important;
    max-width: min(14ch, calc(100vw - 220px)) !important;
  }

  .home-hero p,
  .apartment-hero p,
  .location-hero p,
  .house-photo-hero p,
  .season-page-hero p,
  .page-hero p {
    font-size: clamp(14px, 1.05vw, 17px) !important;
    line-height: 1.75 !important;
  }

  .home-hero .btn,
  .apartment-hero .btn,
  .location-hero .btn,
  .house-photo-hero .btn,
  .season-page-hero .btn,
  .page-hero .btn {
    min-height: 58px;
    padding: 16px 30px;
    /* Hero-Button-Text 40% größer (11px → 15px) */
    font-size: 15px;
    letter-spacing: .26em;
  }

  .home-hero > div > .container,
  .apartment-hero > .container,
  .location-hero > .container,
  .house-photo-hero > .container,
  .season-page-hero > .container,
  .season-page-hero .container {
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    padding-bottom: clamp(48px, 5vw, 76px) !important;
  }

  .home-hero > div > .container > div,
  .apartment-hero > .container > div,
  .location-hero > .container > div,
  .house-photo-hero > .container > div,
  .season-page-hero > .container > div {
    margin-left: auto !important;
    margin-right: auto !important;
    text-align: center !important;
  }

  .home-hero > div > .container > div[style*="justify-content"],
  .apartment-hero > .container > div[style*="justify-content"],
  .location-hero > .container > div[style*="justify-content"],
  .house-photo-hero > .container > div[style*="justify-content"],
  .season-page-hero > .container > div[style*="justify-content"] {
    justify-content: center !important;
    align-items: center !important;
  }

  .season-page-hero .stack-md,
  .season-page-hero .stack-md[style] {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    width: 100% !important;
  }

  .season-page-hero .stack-md > div:first-child {
    justify-self: center !important;
    text-align: center !important;
  }

  .section .intro-copy p,
  .section .house-location-copy p:not(.mono),
  .section .apt-show-copy p:not(.mono),
  .section .house-apt-copy p:not(.mono),
  .section .house-apt-head > p,
  .section .legal-content p,
  .section .legal-content li,
  .section .gs-anfrage-intro p,
  .section .hover-list + p,
  .faq-photo-section .acc-body p,
  main > section:not(.home-hero):not(.apartment-hero):not(.location-hero):not(.house-photo-hero):not(.season-page-hero):not(.page-hero) p:not(.mono):not(.serif):not(.serif-it):not(.chapter),
  .section > .container.narrow > p:not(.mono),
  .section > .container > p:not(.mono) {
    font-size: var(--copy-size);
    line-height: var(--copy-line);
    font-weight: 300;
  }

  .faq-photo-section .acc-head {
    grid-template-columns: 1fr auto !important;
  }
}

@media (max-width: 1024px) {
  .home-hero h1,
  .apartment-hero h1,
  .location-hero h1,
  .house-photo-hero h1,
  .season-page-hero h1 {
    font-size: clamp(32px, 10.2vw, 49px) !important;
    line-height: .9 !important;
    font-weight: 300 !important;
    letter-spacing: -.01em !important;
    text-align: center !important;
    text-wrap: balance;
    max-width: calc(100vw - 54px) !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  .home-hero h1 {
    font-size: clamp(26px, 7.7vw, 31px) !important;
    max-width: calc(100vw - 44px) !important;
  }

  .home-hero p,
  .apartment-hero p,
  .location-hero p,
  .house-photo-hero p,
  .season-page-hero p {
    font-size: var(--copy-size-mobile);
    line-height: var(--copy-line-mobile);
  }

  .section .intro-copy p,
  .section .house-location-copy p:not(.mono),
  .section .apt-show-copy p:not(.mono),
  .section .house-apt-copy p:not(.mono),
  .section .house-apt-head > p,
  .section .legal-content p,
  .section .legal-content li,
  .section .gs-anfrage-intro p,
  .section .hover-list + p,
  .faq-photo-section .acc-body p,
  main > section:not(.home-hero):not(.apartment-hero):not(.location-hero):not(.house-photo-hero):not(.season-page-hero):not(.page-hero) p:not(.mono):not(.serif):not(.serif-it):not(.chapter),
  .section > .container.narrow > p:not(.mono),
  .section > .container > p:not(.mono) {
    font-size: var(--copy-size-mobile);
    line-height: var(--copy-line-mobile);
    font-weight: 300;
  }

  .mobile-bottom-request,
  .home-hero .btn,
  .apartment-hero .btn,
  .location-hero .btn,
  .house-photo-hero .btn,
  .season-page-hero .btn {
    min-height: 56px;
    font-size: 10px;
    letter-spacing: .24em;
  }

  .house-location-section.dark {
    background:
      linear-gradient(
        180deg,
        var(--bg-dark) 0%,
        var(--bg-dark) calc(100% - clamp(140px, 38vw, 200px)),
        var(--bg) calc(100% - clamp(140px, 38vw, 200px)),
        var(--bg) 100%
      ) !important;
  }

  .house-location-section.dark + .seasons-section {
    margin-top: -1px;
  }

  body.home-page #houses-section + .dark {
    background:
      linear-gradient(
        180deg,
        var(--bg-soft) 0,
        var(--bg-soft) clamp(76px, 19vw, 112px),
        var(--bg-dark) clamp(76px, 19vw, 112px),
        var(--bg-dark) 100%
      ) !important;
  }

  .house-photo-composition {
    min-height: 0 !important;
  }

  .apt-card-title,
  .house-apt-row strong {
    font-family: "Jost", sans-serif !important;
    font-weight: 300 !important;
    letter-spacing: .04em !important;
  }
}

/* Final pass: booking info modal and compact mobile hover rows */
[data-info-modal] .apt-modal-copy {
  width: 100%;
  max-width: 100% !important;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}

[data-info-modal] .info-modal-heading,
[data-info-modal] .info-modal-heading[style] {
  width: 100%;
  text-align: center !important;
}

[data-info-modal] .included-grid,
[data-info-modal] .stat-grid {
  width: 100%;
  margin-inline: auto;
}

[data-info-modal] .included-grid > div,
[data-info-modal] .stat-grid > div,
[data-info-modal] .stat-grid .serif,
[data-info-modal] .stat-grid .serif-it,
[data-info-modal] .stat-grid p {
  text-align: center !important;
}

[data-info-modal] .stat-grid p {
  margin-left: auto;
  margin-right: auto;
}

@media (min-width: 1025px) {
  [data-info-modal] .apt-modal-inner {
    width: min(980px, 86vw) !important;
    max-width: min(980px, 86vw) !important;
    padding: clamp(38px, 4.4vw, 70px) clamp(44px, 5vw, 72px) !important;
  }

  [data-info-modal] .info-modal-heading,
  [data-info-modal] .info-modal-heading[style] {
    font-size: clamp(36px, 3.1vw, 50px) !important;
    line-height: .95 !important;
    margin-bottom: clamp(24px, 2.7vw, 34px) !important;
  }

  [data-info-modal] .info-modal-heading .serif-it {
    display: inline-block;
    margin-top: 4px;
    color: var(--accent);
  }

  [data-info-modal] .included-grid {
    max-width: 760px;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 12px 18px !important;
  }

  [data-info-modal] .included-grid > div {
    min-height: 62px;
    display: grid;
    place-items: center;
    padding: 14px 12px !important;
    border: 1px solid rgba(154,122,79,.22) !important;
    font-family: "Jost", sans-serif !important;
    font-size: 12px !important;
    line-height: 1.45 !important;
    letter-spacing: .12em !important;
    text-transform: uppercase;
    color: var(--ink);
  }

  [data-info-modal] .info-modal-heading[style*="margin-top"] {
    margin-top: clamp(34px, 4vw, 54px) !important;
  }

  [data-info-modal] .stat-grid,
  [data-info-modal] .stat-grid[style] {
    max-width: 800px;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 18px !important;
  }

  [data-info-modal] .stat-grid > div {
    display: flex;
    min-height: 176px;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    padding: 24px 22px !important;
    border: 1px solid rgba(154,122,79,.24) !important;
    background: rgba(255,255,255,.13);
  }

  [data-info-modal] .stat-grid .serif {
    font-size: clamp(20px, 1.85vw, 24px) !important;
    line-height: 1.1 !important;
    color: var(--ink);
  }

  [data-info-modal] .stat-grid .serif-it {
    margin-top: 6px !important;
    font-size: clamp(20px, 1.85vw, 24px) !important;
    line-height: 1.1 !important;
    color: var(--accent);
  }

  [data-info-modal] .stat-grid p {
    max-width: 29ch;
    margin-top: 16px !important;
    font-size: 13px !important;
    line-height: 1.65 !important;
    color: var(--ink-soft);
  }
}

@media (max-width: 1024px) {
  .hover-list .hl-row {
    grid-template-columns: none;
    min-height: 0 !important;
    gap: 14px;
    padding: 22px 0 !important;
  }
}

@media (min-width: 1025px) {
  body:not(.home-page) .house-photo-hero + .section .container.narrow > .copy-text {
    text-align: center;
    margin-left: auto;
    margin-right: auto;
  }
}

/* Final mobile rhythm pass: centered headings, readable FAQ rows, tighter section flow */
@media (max-width: 1024px) {
  .section,
  .section[style] {
    padding-top: clamp(52px, 13vw, 82px) !important;
    padding-bottom: clamp(52px, 13vw, 84px) !important;
  }

  .home-page #houses-section,
  .home-page .experience-section,
  .home-page .gallery-section,
  .home-page .faq-photo-section,
  body:not(.home-page) main > section:has(.timeline),
  body:not(.home-page) .season-activities,
  body:not(.home-page) .seasons-section {
    padding-top: clamp(48px, 12vw, 74px) !important;
    padding-bottom: clamp(50px, 12vw, 78px) !important;
  }

  .home-page .gallery-section + .faq-photo-section {
    padding-top: clamp(40px, 10vw, 62px) !important;
  }

  .home-page #houses-section .reveal.stack-sm,
  .home-page #houses-section .reveal.stack-sm > div,
  .home-page .experience-section .stack-sm,
  .home-page .gallery-section .reveal.stack-sm,
  .home-page .gallery-section .reveal.stack-sm > div,
  .home-page .faq-photo-section .faq-heading,
  body:not(.home-page) .section > .container > .reveal.stack-sm,
  body:not(.home-page) .section > .container > .reveal.stack-sm > div,
  body:not(.home-page) main > section:has(.timeline) .reveal.stack-sm,
  body:not(.home-page) main > section:has(.timeline) .reveal.stack-sm > div {
    justify-content: center !important;
    align-items: center !important;
    text-align: center !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  .home-page #houses-section h2.serif,
  .home-page .experience-section h2.serif,
  .home-page .gallery-section h2.serif,
  .home-page .faq-photo-section h2.serif,
  body:not(.home-page) .section > .container > .reveal.stack-sm h2.serif,
  body:not(.home-page) main > section:has(.timeline) h2.serif {
    text-align: center !important;
    margin-left: auto !important;
    margin-right: auto !important;
    text-wrap: balance;
  }

  .home-page #houses-section .reveal.stack-sm p,
  .home-page .experience-section .stack-sm p,
  .home-page .gallery-section .reveal.stack-sm p,
  body:not(.home-page) .section > .container > .reveal.stack-sm p,
  body:not(.home-page) main > section:has(.timeline) .reveal.stack-sm p {
    text-align: center !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  .home-page #houses-section .reveal.stack-sm,
  .home-page .experience-section .stack-sm,
  .home-page .gallery-section .reveal.stack-sm,
  body:not(.home-page) main > section:has(.timeline) .reveal.stack-sm {
    margin-bottom: clamp(24px, 7vw, 38px) !important;
  }

  .faq-photo-section .accordion,
  .faq-photo-section .accordion[style] {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
  }

  .faq-photo-section .acc-head,
  .faq-photo-section .acc-head[style] {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 34px !important;
    gap: 12px !important;
    width: 100% !important;
    text-align: left !important;
    color: var(--ink) !important;
    padding: 19px 8px 19px 0 !important;
    overflow: visible !important;
  }

  .faq-photo-section .acc-head > span:first-child,
  .faq-photo-section .acc-head .serif {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    min-width: 0 !important;
    color: var(--ink) !important;
  }

  .faq-photo-section .acc-head .serif {
    font-family: "Jost", sans-serif !important;
    font-size: clamp(15px, 4.3vw, 18px) !important;
    line-height: 1.35 !important;
    letter-spacing: .01em !important;
    text-align: left !important;
  }

  .faq-photo-section .acc-plus {
    justify-self: end !important;
    align-self: center !important;
    color: var(--ink) !important;
    width: 24px !important;
    height: 24px !important;
    box-sizing: border-box !important;
    transform: none !important;
    transform-origin: center !important;
  }

  .faq-photo-section .acc-plus svg {
    transition: transform .42s cubic-bezier(.7,0,.2,1);
  }

  .faq-photo-section .acc-item.open .acc-plus {
    transform: none !important;
  }

  .faq-photo-section .acc-item.open .acc-plus svg {
    transform: rotate(45deg);
  }
}

@media (max-width: 720px) {
  .home-page .gallery-shell {
    min-height: 374px !important;
  }

  .home-page .gallery-ribbon {
    min-height: 360px !important;
  }

  .gallery-tile,
  .gallery-tile:nth-child(n),
  body:not(.home-page) .season-photo-carousel > .season-photo-item,
  body:not(.home-page) .season-photo-carousel > .season-photo-item[style],
  body:not(.home-page) .season-page-hero ~ .section .container.stack-md:has(> .ph) > .ph {
    height: clamp(286px, 76vw, 330px) !important;
  }
}

/* Mobile house context: show the current house beside the logo, without the back label. */
@media (max-width: 1024px) {
  body:not(.home-page) .headbar .main {
    display: grid !important;
    grid-template-columns: auto minmax(0, 1fr) !important;
    align-items: center !important;
    gap: clamp(12px, 4vw, 22px) !important;
    min-height: 86px !important;
    padding: 12px clamp(14px, 4vw, 22px) !important;
    padding-right: calc(clamp(14px, 4vw, 22px) + clamp(54px, 14vw, 64px)) !important;
  }

  body:not(.home-page) .headbar .brand.logo-brand {
    order: 0 !important;
    grid-column: 1 !important;
    grid-row: 1 !important;
    flex: 0 0 auto !important;
    align-self: center !important;
    justify-self: start !important;
    margin: 0 !important;
  }

  body:not(.home-page) .headbar .brand.logo-brand img,
  body:not(.home-page) .headbar.at-top .brand.logo-brand img,
  body:not(.home-page) .headbar.is-scrolled .brand.logo-brand img {
    height: clamp(48px, 12.4vw, 62px) !important;
    max-width: clamp(108px, 28vw, 128px) !important;
  }

  body:not(.home-page) .headbar .main > div:first-child {
    order: 0 !important;
    grid-column: 2 !important;
    grid-row: 1 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 0 !important;
    min-width: 0 !important;
    width: 100% !important;
    flex: none !important;
    align-self: center !important;
    justify-self: center !important;
    margin-left: clamp(4px, 2vw, 12px) !important;
  }

  body:not(.home-page) .headbar .back-link {
    display: none !important;
  }

  body:not(.home-page) .headbar .house-context-sep {
    display: block !important;
    flex: 0 0 1px !important;
    width: 1px !important;
    height: clamp(44px, 12vw, 56px) !important;
    background: currentColor !important;
    opacity: .28 !important;
    align-self: center !important;
    margin-right: clamp(14px, 4vw, 20px) !important;
  }

  body:not(.home-page) .headbar .house-context {
    display: block !important;
    min-width: 0 !important;
    max-width: min(36vw, 150px) !important;
    color: currentColor !important;
    opacity: 1 !important;
    line-height: 1.28 !important;
    align-self: center !important;
    transform: none !important;
    padding-top: 0 !important;
  }

  body:not(.home-page) .headbar .house-context span {
    display: block !important;
    font-family: "Jost", sans-serif !important;
    font-size: clamp(9px, 2.7vw, 11px) !important;
    line-height: 1.2 !important;
    letter-spacing: .28em !important;
    text-transform: none !important;
    opacity: .58 !important;
    white-space: nowrap !important;
  }

  body:not(.home-page) .headbar .house-context strong {
    display: block !important;
    max-width: 100% !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    font-family: "Jost", sans-serif !important;
    font-size: clamp(12px, 3.5vw, 15px) !important;
    line-height: 1.25 !important;
    font-weight: 400 !important;
    letter-spacing: .18em !important;
  }

  body:not(.home-page) .headbar .actions {
    order: 0 !important;
    grid-row: 1 !important;
    position: absolute !important;
    top: calc(50% - 3px) !important;
    right: clamp(14px, 4vw, 22px) !important;
    transform: translateY(-50%) !important;
    align-self: center !important;
  }
}


/* ============================================================
   Desktop-Hausmenü — Hamburger auf Haus-Seiten (≥1025px)
   ============================================================ */
@media (min-width: 1025px) {
  /* Hausnav-Links aus der Navbar nehmen, stattdessen Hamburger zeigen */
  body.house-page .headbar .actions .topnav { display: none }
  body.house-page .nav-toggle {
    display: inline-grid !important;
    width: 46px;
    height: 46px;
    color: inherit;
  }
  body.house-page .nav-toggle .icn { width: 26px; height: 26px }
}

.house-menu {
  position: fixed; inset: 0; z-index: 70;
  display: none;
  background: var(--bg-night); color: var(--cream);
  opacity: 0; pointer-events: none; visibility: hidden;
  transition: opacity .45s ease, visibility 0s linear .45s;
}
.house-menu.open {
  opacity: 1; pointer-events: auto; visibility: visible;
  transition: opacity .45s ease, visibility 0s linear 0s;
}
@media (min-width: 1025px) {
  .house-menu { display: block }
}
.house-menu-inner {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr);
  /* Engerer Spaltenabstand, damit die Foto-Gruppe weiter links beginnt */
  gap: clamp(40px, 5vw, 96px);
  align-items: center;
  width: min(1540px, 100%);
  height: 100%;
  margin-inline: auto;
  padding: clamp(48px, 6vw, 96px) clamp(40px, 5vw, 80px);
}
.house-menu-close {
  position: absolute;
  top: clamp(20px, 3vw, 42px);
  right: clamp(20px, 3vw, 42px);
  width: 46px; height: 46px;
  display: grid; place-items: center;
  background: transparent; border: 0;
  color: var(--cream); cursor: pointer;
  transition: transform .3s ease, color .3s ease;
  z-index: 2;
}
.house-menu-close:hover { transform: rotate(90deg) }
.house-menu-close .icn { width: 26px; height: 26px }
.house-menu-eyebrow {
  display: block;
  font-family: "JetBrains Mono", monospace;
  font-size: 11px;
  letter-spacing: .26em;
  text-transform: uppercase;
  color: rgba(246,241,231,.55);
  margin-bottom: clamp(24px, 3vw, 44px);
}
.house-menu-links {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: clamp(8px, 1.4vh, 18px);
}
.house-menu-links a {
  position: relative;
  font-family: "Playfair Display", serif;
  font-weight: 300;
  font-size: clamp(44px, 4.4vw, 74px);
  line-height: 1.05;
  letter-spacing: -.01em;
  color: var(--cream);
  opacity: 0;
  transition: opacity .45s ease;
}
.house-menu-links a:visited,
.house-menu-links a:hover,
.house-menu-links a:focus,
.house-menu-links a:active { color: var(--cream) }
.house-menu-links a:nth-of-type(1) { --i: 0 }
.house-menu-links a:nth-of-type(2) { --i: 1 }
.house-menu-links a:nth-of-type(3) { --i: 2 }
.house-menu-links a:nth-of-type(4) { --i: 3 }
.house-menu-links a:nth-of-type(5) { --i: 4 }
.house-menu.open .house-menu-links a {
  /* Grundzustand opacity .7, Hover hebt auf 1 — Einblendung gestaffelt */
  opacity: .7;
  transition-delay: calc(.12s + var(--i, 0) * .07s);
  animation: hmLinkIn .65s cubic-bezier(.2,.7,.2,1) both;
  animation-delay: calc(.12s + var(--i, 0) * .07s);
}
.house-menu.open .house-menu-links a:hover,
.house-menu.open .house-menu-links a:focus-visible {
  opacity: 1;
  transition-delay: 0s;
}
@keyframes hmLinkIn {
  from { transform: translateY(30px) }
  to { transform: none }
}
.house-menu-bg {
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  opacity: 0;
  pointer-events: none;
  transition: opacity 1.2s ease .15s;
}
.house-menu.open .house-menu-bg { opacity: .1 }
.house-menu-inner { position: relative; z-index: 1 }
.house-menu-photos {
  /* Sauber ausgerichtetes Raster mit durchgehend gleichen Abständen */
  display: grid;
  grid-template-columns: 1.15fr .85fr;
  grid-template-rows: 1.1fr .9fr;
  gap: clamp(18px, 1.8vw, 28px);
  height: min(74vh, 720px);
}
.hm-photo {
  position: relative;
  overflow: hidden;
  width: 100%;
  height: 100%;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  opacity: 0;
  box-shadow: 0 24px 60px rgba(0,0,0,.35);
}
.hm-photo::before {
  content: "";
  position: absolute;
  inset: 0;
  background: inherit;
  background-size: cover;
  background-position: center;
  will-change: transform;
}
.hm-photo:nth-child(1) { --d: .15s; --float: 14s }
.hm-photo:nth-child(2) { --d: .27s; --float: 11s }
.hm-photo:nth-child(3) { --d: .39s; --float: 16s }
.hm-photo:nth-child(4) { --d: .51s; --float: 12s }
.house-menu.open .hm-photo {
  animation: hmPhotoIn .9s ease var(--d, 0s) both;
}
.house-menu.open .hm-photo::before {
  /* Sanfter Ken-Burns-Zoom im Bild — die Rasterabstände bleiben konstant */
  animation: hmKenburns var(--float, 12s) ease-in-out var(--d, 0s) infinite alternate;
}
@keyframes hmPhotoIn {
  from { opacity: 0; clip-path: inset(14% 0 14% 0) }
  to { opacity: 1; clip-path: inset(0 0 0 0) }
}
@keyframes hmKenburns {
  from { transform: scale(1) }
  to { transform: scale(1.09) }
}
@media (prefers-reduced-motion: reduce) {
  .house-menu { transition: none }
  .house-menu.open .house-menu-links a {
    animation: none;
    opacity: .7;
    transition-delay: 0s;
  }
  .house-menu.open .house-menu-links a:hover,
  .house-menu.open .house-menu-links a:focus-visible { opacity: 1 }
  .house-menu.open .hm-photo {
    animation: none;
    opacity: 1;
  }
  .house-menu.open .hm-photo::before { animation: none }
  .house-menu-bg { transition: none }
}

/* Lange URLs in Rechtstexten dürfen auf Mobile nicht überlaufen */
.legal-content a,
.legal-content p,
.legal-content li {
  overflow-wrap: anywhere;
}

/* Kompakte Navleiste gleitet nach Scroll-Schwelle von oben herein */
@keyframes headbarSlideIn {
  from { transform: translateY(-100%) }
  to { transform: translateY(0) }
}
@media (prefers-reduced-motion: reduce) {
  .headbar.is-scrolled { animation: none }
}

/* Footer-Seam — riesiges Serif-Wort auf der Nahtstelle zwischen letzter
   Sektion und dunklem Footer (Referenz: cadepuntlodge.it) */
.seam {
  position: relative;
  z-index: 3;
  height: 0;
  pointer-events: none;
  user-select: none;
}
.seam-word {
  position: absolute;
  left: 50%;
  top: 0;
  transform: translate(-50%, -52%);
  font-family: "Playfair Display", serif;
  font-weight: 300;
  font-size: clamp(120px, 22vw, 400px);
  line-height: .8;
  letter-spacing: .02em;
  color: rgba(26, 22, 18, .5);
  white-space: nowrap;
}
/* Das goldene WindSong-Script-Wort (Rosra / Hausname) wird nicht mehr angezeigt
   — es passte stilistisch nicht. Regeln bleiben für mögliche spätere Nutzung. */
.seam-script {
  display: none;
  position: absolute;
  left: 50%;
  top: 0;
  transform: translate(-50%, 22%) rotate(-4deg);
  font-family: "WindSong", cursive;
  font-weight: 500;
  font-size: clamp(40px, 5vw, 92px);
  line-height: 1;
  color: var(--accent-gold);
  white-space: nowrap;
}


/* Intro-Sektion (Drei Häuser, eine Familie): warme dunkle Fläche statt
   Foto-Wash — der Seam-Übergang zur Häuser-Sektion sitzt auf der Naht */
.home-intro.intro-editorial {
  background: var(--bg-warm) !important;
  color: var(--cream);
  /* Responsiv (skaliert mit der Breite wie das Seam-Wort): oben genug Luft für
     die Naht, mobil aber deutlich weniger; unten ~60% kleiner als oben, damit der
     braune Block vor der Häuser-Sektion nicht zu groß wirkt. */
  /* padding-top halbiert -> Inhalt rückt näher an den Hero/Naht */
  padding-top: clamp(48px, 8.5vw, 150px) !important;
  padding-bottom: clamp(64px, 8vw, 140px) !important;
  min-height: 0 !important;
}
/* Hausseiten/Unterseiten: Section direkt unter dem Top-Seam -> padding-top
   halbiert, damit der Inhalt näher an den Hero rückt (wie auf der Startseite). */
.seam.seam-hero + section,
.seam.seam-hero + .section {
  padding-top: clamp(40px, 5.5vw, 72px) !important;
}
/* Ganz leichtes Hintergrundbild (opacity .05) für Atmosphäre im Intro */
.home-intro.intro-editorial::before {
  content: "";
  position: absolute;
  inset: 0;
  background: url("gallery/img/bel_marin_54.webp") center center / cover no-repeat;
  opacity: .05;
  filter: grayscale(.2);
  pointer-events: none;
  z-index: 0;
}
.home-intro.intro-editorial > .container {
  position: relative;
  z-index: 1;
}
.home-intro .intro-copy p { color: rgba(246,246,231,.82) }
.home-intro .icn { color: var(--accent-warm) }

/* Überschrift "Drei Häuser, eine Familie" sitzt auf der dunklen Intro-Fläche
   und muss hell sein (vorher dunkel und kaum lesbar) */
.home-intro .intro-heading,
.home-intro .intro-heading h2 {
  color: var(--cream);
}

/* Fakten-Zahlen (1296 / 10 / 3) müssen auf der dunklen Intro-Fläche hell sein.
   Überschreibt die alte Regel .home-facts .serif { color: var(--ink) } aus der
   Zeit mit hellem Intro-Hintergrund. */
.home-intro .home-facts .serif {
  color: var(--cream);
}

/* Seam-Variante: Schreibschrift-Wort oberhalb der Naht (für dunkle Sektion oben, helle unten) */
.seam.flip .seam-script {
  transform: translate(-50%, -140%) rotate(-4deg);
}

/* Beide Homepage-Seams (Top auf der Hero-Naht + Footer auf der FAQ-Naht),
   Cadepunt-Technik mit mix-blend-mode:
   - Der obere Wortteil übernimmt LIVE das Foto dahinter (mix-blend-mode: overlay),
     passt sich also automatisch dem Hero-Slider bzw. dem FAQ-Foto an — leuchtende,
     bild-reflektierende Buchstaben wie "Chalet" über der Wiese.
   - Der untere Teil (über der dunklen Sektion) löst sich per Maske weich nach
     unten ins Dunkel auf: praktisch null, keine scharfe Silhouette. */
/* Cadepunt-Technik (exakt von cadepuntlodge.it übernommen): das Seam-Wort ist
   WEISS mit mix-blend-mode: overlay. Über dem hellen Hero-Foto leuchtet dadurch
   das Foto LIVE durch die Buchstaben; über der dunklen Sektion darunter entsteht
   ein zarter, kaum sichtbarer Ghost. Kein Grau (das wirkte wie mattes Glas). */
/* Cadepunt-Aufbau: ZWEI deckungsgleich übereinanderliegende Kopien desselben
   Worts (sw-top + sw-bot) an identischer Position, exakt an der Header-Unterkante
   (Naht) getrennt:
   - sw-top liegt IM Hero-Foto: #fff + mix-blend:overlay -> das Hintergrundbild
     wird live durch die Buchstaben gefiltert. Der Teil UNTER der Naht wird
     weggeschnitten (er ist aus dem Header heraus).
   - sw-bot liegt UNTER dem Header (dunkle Fläche): normaler, dunkler Ghost. Der
     Teil ÜBER der Naht (hinter dem Header) wird weggeschnitten.
   transform translate(-50%,-50%) legt die Wort-Mitte exakt auf die Naht, daher
   trennt der 50%-Clip beide Kopien millimetergenau an der Header-Unterkante. */
.seam.light .seam-word {
  transform: translate(-50%, -50%);
  background: none;
}
.seam.light .sw-top {
  /* Fallback ohne JS: weiß + soft-light. MIT JS (initSeamPhotoFill) wird das
     aktuelle Hero-Foto pixelgenau per background-clip:text in die Buchstaben
     gelegt -> echte Foto-Farben statt Weiß. Der leichte Filter hebt das Foto in
     den Buchstaben gegenüber dem (vom Hero-Overlay abgedunkelten) Umfeld an, so
     dass die Buchstaben sichtbar "leuchten" wie bei Cadepunt. */
  color: var(--cream);
  mix-blend-mode: soft-light;
  filter: brightness(1.3) saturate(1.22) sepia(.12);
  padding: 0.12em 0;
  -webkit-clip-path: inset(-60% 0 50% 0);
  clip-path: inset(-60% 0 50% 0);
}
.seam.light .sw-bot {
  color: rgba(246, 241, 231, .12);
  mix-blend-mode: normal;
  -webkit-clip-path: inset(50% 0 -60% 0);
  clip-path: inset(50% 0 -60% 0);
  -webkit-mask-image: linear-gradient(180deg, #ffffff 0%, transparent 92%);
  mask-image: linear-gradient(180deg, #ffffff 0%, transparent 92%);
}

/* WindSong-Script "Rosra" sitzt tief unter dem Wort (über dem dunklen Teil),
   wie die "Cadepunt"-Signatur — gilt für beide Homepage-Seams. */
.home-page .seam .seam-script {
  transform: translate(-50%, 108%) rotate(-4deg);
  z-index: 1;
}

/* Footer-Seam ~10% weiter nach unten geschoben ("praktisch aus dem Bild"):
   das Seam-Wort sitzt tiefer auf der Naht, ein größerer Teil verschwindet im
   dunklen Footer. Gilt für alle Footer-Seams (Home + Hausseiten), NICHT für die
   Hero-Top-Seams (.seam-hero) und nicht für die Home-Top-Seam (.light). */
.seam:not(.seam-hero):not(.light) .seam-word {
  transform: translate(-50%, -42%);
}

/* Top-Seam unter dem Hero-Bild jeder Unterseite (gleiches große Wort wie auf
   der Startseite, je Seite mit passendem Wort). .light aktiviert die
   leuchtende mix-blend/mask-Behandlung über dem Hero-Foto; .seam-hero schließt
   es von der Footer-Verschiebung oben aus. */
.seam.seam-hero {
  z-index: 3;
}

/* Footer-Oberkante: kompakt auf ALLEN Seiten, da kein Footer-Seam-Wort mehr über
   der Naht sitzt (das große Wort bleibt nur oben im Header). */
.site-footer.dark {
  padding-top: clamp(64px, 7vw, 110px) !important;
}

/* Final page rhythm + button/list fixes:
   - Subpage sections after the hero seam need the same breathing room as the homepage.
   - Location buttons are filled, not outlined, and their labels use the same tracking.
   - Season/location ledgers are informational lists, so they should not swipe a bright
     hover panel across the row. */
.seam.seam-hero + section,
.seam.seam-hero + .section {
  padding-top: clamp(76px, 8.5vw, 132px) !important;
}

.location-hero .hero-link,
.house-location-actions .btn.on-dark {
  background: var(--cream);
  color: var(--ink);
  border-color: var(--cream);
}

.location-hero .hero-link::before,
.house-location-actions .btn.on-dark::before {
  display: none;
}

.location-hero .hero-link:hover,
.house-location-actions .btn.on-dark:hover {
  background: var(--accent-warm);
  color: var(--ink);
  border-color: var(--accent-warm);
}

.location-hero > div > .container {
  left: 0 !important;
  right: 0 !important;
  width: 100% !important;
  max-width: none !important;
  transform: none !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
  padding-left: clamp(72px, 7vw, 140px) !important;
  padding-right: clamp(72px, 7vw, 140px) !important;
}

.location-hero > div > .container > h1 {
  max-width: min(11ch, calc(100vw - 220px)) !important;
  margin-left: auto !important;
  margin-right: auto !important;
  text-align: center !important;
  font-size: clamp(48px, 6.97vw, 112px) !important;
}

.location-hero > div > .container > div {
  width: 100% !important;
  justify-content: center !important;
  align-items: center !important;
  text-align: center !important;
}

.house-location-actions .btn,
.house-location-actions .btn.compact {
  font-size: 15px;
  letter-spacing: .06em;
  font-weight: 400;
}

.season-activities .hover-list .hl-row::after,
.location-distances .hover-list .hl-row::after {
  display: none !important;
}

.season-activities .hover-list .hl-row:hover,
.season-activities .hover-list .hl-row.open,
.location-distances .hover-list .hl-row:hover,
.location-distances .hover-list .hl-row.open {
  padding-left: 0 !important;
  padding-right: 0 !important;
  background: transparent !important;
  color: inherit !important;
}

.season-activities.dark .hover-list .hl-row:hover .hl-title,
.season-activities.dark .hover-list .hl-row.open .hl-title,
.season-activities.dark .hover-list .hl-row:hover .hl-desc,
.season-activities.dark .hover-list .hl-row.open .hl-desc,
.season-activities.dark .hover-list .hl-row:hover .hl-arrow,
.season-activities.dark .hover-list .hl-row.open .hl-arrow,
.location-distances.dark .hover-list .hl-row:hover .hl-title,
.location-distances.dark .hover-list .hl-row.open .hl-title,
.location-distances.dark .hover-list .hl-row:hover .hl-desc,
.location-distances.dark .hover-list .hl-row.open .hl-desc,
.location-distances.dark .hover-list .hl-row:hover .hl-arrow,
.location-distances.dark .hover-list .hl-row.open .hl-arrow {
  color: var(--cream) !important;
}

.season-activities .hover-list .hl-row:first-child,
.location-distances .hover-list .hl-row:first-child {
  border-top: 0 !important;
}

.season-activities .hover-list .hl-row:last-child,
.location-distances .hover-list .hl-row:last-child {
  border-bottom: 0 !important;
}

/* ───────────────────────────────────────────────────────────────────────────
   Mobile-Feintuning: zu viel Leerraum reduzieren (Header→Hero-Text und Footer).
   Am Dateiende, damit es die früheren Breakpoint-Regeln sicher überschreibt. */
@media (max-width: 1024px) {
  /* Alle Hero-/Headerbilder mobil: Mindesthöhe 70svh (einheitlich). */
  .home-page .home-hero > div,
  .home-hero > div,
  .house-photo-hero,
  .season-page-hero,
  .location-hero,
  .page-hero {
    min-height: 70svh !important;
  }
  .home-page .home-hero .container {
    padding-top: clamp(40px, 6vw, 104px) !important;
    padding-bottom: clamp(36px, 5vw, 80px) !important;
  }
  /* Footer-Oberkante mobil: kompakt ohne Footer-Seam (alle Seiten) */
  .site-footer.dark {
    padding-top: clamp(52px, 11vw, 96px) !important;
  }
  .seam.seam-hero + section,
  .seam.seam-hero + .section {
    padding-top: clamp(70px, 16vw, 112px) !important;
  }
}

/* Lage-Unterseiten: Intro wie auf der Index-Hauptseite, nur mit leisem Bild im Hintergrund. */
.location-intro.home-intro.intro-editorial {
  background: var(--bg-warm) !important;
  color: var(--cream) !important;
  isolation: isolate;
}

.location-intro.home-intro.intro-editorial::before {
  background: url("gallery/img/bel_marin_54.webp") center center / cover no-repeat !important;
  opacity: .1 !important;
  filter: grayscale(.18) saturate(.8) brightness(.72);
}

.location-intro .intro-photo-wash {
  display: none !important;
}

.location-intro .intro-heading,
.location-intro .intro-heading h2,
.location-intro .intro-copy,
.location-intro .home-facts,
.location-intro .home-facts .serif {
  color: var(--cream) !important;
}

.location-intro .home-facts .icn {
  color: var(--accent-warm) !important;
}

.location-intro .intro-copy p,
.location-intro .home-facts div div:last-child {
  color: rgba(246, 241, 231, .78) !important;
}

/* Headerbilder heller: die dunkle Bildueberlagerung ist jetzt ungefaehr halb so stark. */
.home-hero > div > div[style*="linear-gradient"],
.location-hero > div > div[style*="linear-gradient"],
.house-photo-hero > div[style*="linear-gradient"],
.season-page-hero > div[style*="linear-gradient"],
.page-hero > div[style*="linear-gradient"] {
  background: linear-gradient(
    180deg,
    rgba(20, 16, 12, .18) 0%,
    rgba(20, 16, 12, .04) 42%,
    rgba(20, 16, 12, .36) 100%
  ) !important;
}

/* Mobile Feinschliff: sichere Seitenraender, schlankeres Hamburger-Icon, groessere Erlebnis-Titel. */
@media (max-width: 1024px) {
  .container,
  .container.narrow,
  .section > .container,
  main > section > .container {
    padding-left: max(15px, var(--pad-x)) !important;
    padding-right: max(15px, var(--pad-x)) !important;
  }

  .experience-section .hover-list,
  .location-distances .hover-list,
  .season-activities .hover-list,
  .house-apartments > .container,
  .apt-showcase > .container,
  .included-section > .container,
  .booking-notes > .container {
    max-width: calc(100vw - 30px) !important;
  }

  .home-page .experience-section .hover-list .hl-title {
    font-size: 13px !important;
  }

  .headbar .nav-toggle::before,
  .headbar .nav-toggle::after,
  .home-page .headbar .nav-toggle::before,
  .home-page .headbar .nav-toggle::after {
    left: 14px !important;
    right: 14px !important;
  }

  .headbar .nav-toggle::before,
  .home-page .headbar .nav-toggle::before {
    top: 18px !important;
  }

  .headbar .nav-toggle::after,
  .home-page .headbar .nav-toggle::after {
    bottom: 18px !important;
  }
}

/* Mobile Navigation: Cadepunt-inspirierter Vollbild-Slide von oben. */
@media (max-width: 1024px) {
  .drawer {
    inset: 0 !important;
    width: 100vw !important;
    max-width: none !important;
    min-height: 100svh !important;
    margin: 0 !important;
    opacity: 1 !important;
    visibility: hidden !important;
    transform: translateY(-100%) !important;
    transition:
      transform 1s cubic-bezier(.45, 0, .14, 1.03),
      visibility 0s linear 1s !important;
    will-change: transform;
  }

  .drawer.open {
    visibility: visible !important;
    transform: translateY(0) !important;
    transition-delay: 0s !important;
  }

  .drawer::before {
    opacity: 1 !important;
    transform: scale(1.02) !important;
    transition: transform 1.55s cubic-bezier(.45, 0, .14, 1.03) !important;
  }

  .drawer.open::before {
    transform: scale(1) !important;
  }

  .drawer .row-top,
  .drawer > nav:not(.drawer-lang-inline),
  .drawer-meta {
    opacity: 0;
    transform: translateY(18px);
    transition:
      opacity .42s ease,
      transform .62s cubic-bezier(.22, 1, .36, 1);
  }

  .drawer.open .row-top {
    opacity: 1;
    transform: translateY(0);
    transition-delay: .42s;
  }

  .drawer.open > nav:not(.drawer-lang-inline) {
    opacity: 1;
    transform: translateY(0);
    transition-delay: .72s;
  }

  .drawer.open .drawer-meta {
    opacity: 1;
    transform: translateY(0);
    transition-delay: .86s;
  }

  .drawer-menu-group {
    opacity: 0 !important;
    transform: translateY(28px) !important;
    transition:
      opacity .46s ease,
      transform .72s cubic-bezier(.22, 1, .36, 1) !important;
  }

  .drawer.open .drawer-menu-group {
    opacity: 1 !important;
    transform: translateY(0) !important;
  }

  .drawer.open .drawer-menu-group:nth-child(1) { transition-delay: .78s !important }
  .drawer.open .drawer-menu-group:nth-child(2) { transition-delay: .86s !important }
  .drawer.open .drawer-menu-group:nth-child(3) { transition-delay: .94s !important }
  .drawer.open .drawer-menu-group:nth-child(4) { transition-delay: 1.02s !important }
}

/* Sauna-Wash (Bel Marin): Desktop 58%, Mobil 84% */
.sauna-wash { height: 58%; }
@media (max-width: 720px) {
  .sauna-wash { height: 84%; }
}

/* ============================================================
   Mobile: Bildergalerie mit variierten Kachelgrößen (wie Desktop)
   Die JS-vergebenen gt-1..gt-8 erzeugen denselben editorialen
   Versatz/Format wie im Desktop, statt einheitlicher Quadrate.
   Platziert am Dateiende → gewinnt per Quellreihenfolge gegen die
   früheren .gallery-tile / :nth-child(n) 330px-!important-Regeln.
   ============================================================ */
@media (max-width: 1024px) {
  .gallery-ribbon {
    align-items: flex-start !important;
    min-height: 460px !important;
  }
  .gallery-tile.gt-1 { flex: 0 0 clamp(210px, 62vw, 300px) !important; height: 320px !important; margin-top: 26px !important }
  .gallery-tile.gt-2 { flex: 0 0 clamp(185px, 54vw, 255px) !important; height: 400px !important; margin-top: 0 !important }
  .gallery-tile.gt-3 { flex: 0 0 clamp(225px, 70vw, 330px) !important; height: 285px !important; margin-top: 48px !important }
  .gallery-tile.gt-4 { flex: 0 0 clamp(195px, 58vw, 270px) !important; height: 350px !important; margin-top: 16px !important }
  .gallery-tile.gt-5 { flex: 0 0 clamp(235px, 72vw, 340px) !important; height: 300px !important; margin-top: 54px !important }
  .gallery-tile.gt-6 { flex: 0 0 clamp(190px, 56vw, 260px) !important; height: 378px !important; margin-top: 28px !important }
  .gallery-tile.gt-7 { flex: 0 0 clamp(220px, 66vw, 310px) !important; height: 268px !important; margin-top: 64px !important }
  .gallery-tile.gt-8 { flex: 0 0 clamp(198px, 58vw, 280px) !important; height: 392px !important; margin-top: 8px !important }
}

/* ============================================================
   Mobile: leichtes Hintergrundbild der Aktivitäten-Sektion
   (unter dem Karussell) auf allen Sommer-/Winterseiten — wie Desktop.
   Das Bild kommt aus dem Inline-Style je Seite; hier nur Positionierung.
   ============================================================ */
@media (max-width: 1024px) {
  .season-activities .experience-photo-wash {
    position: absolute;
    inset: 0;
    opacity: 1;
    pointer-events: none;
    z-index: 0;
  }
  .season-activities > .container {
    position: relative;
    z-index: 1;
  }
}

@media (max-width: 1024px) {
  .home-page .home-hero h1 {
    font-size: clamp(26px, 7.7vw, 31px) !important;
    max-width: calc(100vw - 44px) !important;
  }
}

/* Final mobile contact bar spacing: keep footer data readable above fixed actions. */
@media (max-width: 1024px) {
  .mobile-bottom-actions {
    grid-template-columns: 58px minmax(0, 1fr) 58px !important;
  }

  .mobile-bottom-actions .mobile-bottom-request {
    font-family: "Jost", sans-serif !important;
    font-size: clamp(19px, 5.1vw, 22px) !important;
    font-weight: 400 !important;
    letter-spacing: .14em !important;
    text-transform: none !important;
  }

  .site-footer,
  .site-footer.dark,
  footer.dark {
    padding-bottom: calc(132px + env(safe-area-inset-bottom, 0px)) !important;
  }

  .site-footer .footer-bottom,
  footer.dark div[style*="grid-column:1/-1"] {
    padding-bottom: calc(36px + env(safe-area-inset-bottom, 0px)) !important;
  }
}

/* Mobile header language switch: keep IT/DE/EN visible between logo and menu. */
@media (max-width: 1024px) {
  .headbar .actions .lang,
  .home-page .headbar .actions .lang {
    display: flex !important;
    position: absolute !important;
    top: 50% !important;
    right: calc(110% + clamp(10px, 3vw, 20px)) !important;
    transform: translateY(-50%) !important;
    align-items: center !important;
    gap: clamp(8px, 2.6vw, 13px) !important;
    width: max-content !important;
    height: auto !important;
    padding: 0 !important;
    color: rgba(246, 241, 231, .72) !important;
    font-family: "JetBrains Mono", monospace !important;
    font-size: clamp(11px, 3vw, 13px) !important;
    line-height: 1 !important;
    letter-spacing: .2em !important;
    white-space: nowrap !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    z-index: 46 !important;
  }

  .headbar .actions .lang a,
  .home-page .headbar .actions .lang a {
    display: inline-flex !important;
    color: inherit !important;
    text-decoration: none !important;
  }

  .headbar .actions .lang a.active,
  .home-page .headbar .actions .lang a.active {
    color: var(--cream) !important;
    font-weight: 500 !important;
  }

  body.light-nav .headbar .actions .lang {
    color: rgba(36, 31, 26, .66) !important;
  }

  body.light-nav .headbar .actions .lang a.active {
    color: var(--ink) !important;
  }

  body.light-nav .headbar.is-scrolled .actions .lang {
    color: rgba(246, 241, 231, .72) !important;
  }

  body.light-nav .headbar.is-scrolled .actions .lang a.active {
    color: var(--cream) !important;
  }
}