/* 179 – Surreal. DM Serif Display + Inter. */
:root {
  --ink: #14203b;
  --ink2: #3a4560;
  --rust: #962d16;
  --cream: #f7f0e2;
  --gold: #e7b850;
  --night: #0b1631;
  --bw: 20px;
  --serif: 'DM Serif Display', Georgia, 'Times New Roman', serif;
  --sans: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, Arial, sans-serif;
  --frame: linear-gradient(135deg, #f7df9a 0%, #c39342 20%, #f2d38c 40%, #9d6e28 62%, #e6c172 80%, #8a5d1e 100%);
  --shade: 74, 44, 16;
}
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body {
  margin: 0; background: #dfbe88; color: var(--ink);
  font: 400 16.5px/1.6 var(--sans); font-feature-settings: 'ss01' 0;
  overflow-x: hidden;
}
img, svg { display: block; max-width: 100%; }
a { color: inherit; }
h1, h2, h3 { font-family: var(--serif); font-weight: 400; margin: 0; letter-spacing: -.005em; text-wrap: balance; }
p { margin: 0; }
.wrap { width: 100%; max-width: 1240px; margin-inline: auto; padding-inline: clamp(16px, 4vw, 48px); }
.skip { position: absolute; left: 12px; top: -60px; z-index: 50; background: var(--cream); color: var(--ink); padding: 10px 16px; border-radius: 4px; }
.skip:focus { top: 12px; }
:focus-visible { outline: 3px solid var(--gold); outline-offset: 3px; }
.kicker { font: 600 12.5px/1.35 var(--sans); letter-spacing: .16em; text-transform: uppercase; color: var(--rust); margin-bottom: 14px; }

/* ---------- Kopf ---------- */
.top { position: absolute; inset: 0 0 auto; z-index: 20; }
.top__in { display: flex; align-items: center; gap: 28px; padding-block: 16px; }
.logo { flex: none; display: block; }
.logo img { width: auto; height: 62px; }
.nav { margin-left: auto; display: flex; align-items: center; gap: 36px; }
.nav__list { display: flex; gap: 30px; list-style: none; margin: 0; padding: 0; }
.nav a { text-decoration: none; }
.nav__list a, .tel { color: #fff; font-weight: 500; font-size: 15px; text-shadow: 0 1px 10px rgba(16, 40, 86, .45); padding-block: 6px; background: linear-gradient(currentColor, currentColor) 0 100% / 0 1px no-repeat; transition: background-size .3s; }
.nav__list a:hover, .tel:hover { background-size: 100% 1px; }
.nav__end { display: flex; align-items: center; gap: 18px; }
.tel { font-variant-numeric: tabular-nums; }
.lang { display: inline-grid; place-items: center; min-width: 44px; height: 36px; padding: 0 10px; border: 1px solid rgba(255, 255, 255, .75); border-radius: 999px; color: #fff; font-weight: 600; font-size: 13px; letter-spacing: .08em; background: rgba(16, 40, 86, .18); }
.lang:hover { background: rgba(255, 255, 255, .2); }
.menu { display: none; }

/* ---------- Hero ---------- */
.hero {
  position: relative; overflow: hidden; isolation: isolate;
  padding: 108px 0 clamp(96px, 13vh, 130px);
  background: linear-gradient(180deg, #1d4f95 0%, #2b67ae 20%, #4f88c8 38%, #86b6df 52%, #bcd7ea 62%, #dfe6e2 70%, #ece4cf 78%);
}
.sky { position: absolute; inset: 0; z-index: 0; pointer-events: none; }
.cl { position: absolute; height: auto; overflow: visible; }
.cl--a { top: 132px; left: 40vw; width: clamp(160px, 15vw, 230px); aspect-ratio: 320 / 126; opacity: .95; }
.cl--b { top: 47%; left: 55vw; width: clamp(200px, 21vw, 320px); aspect-ratio: 440 / 156; }
.cl--c { top: 27%; left: 88vw; width: clamp(110px, 10vw, 160px); aspect-ratio: 240 / 86; opacity: .9; }
.cl--plane { top: 118px; left: 60vw; width: clamp(220px, 23vw, 350px); aspect-ratio: 530 / 230; }

.stage { position: relative; z-index: 1; display: flex; }
.land {
  position: absolute; z-index: 0; left: calc(50% - 50vw); width: 100vw; height: 220vh;
  top: calc(var(--hz, calc(64% - .28 * var(--bw))) - 140px);
  background:
    linear-gradient(180deg,
      rgba(236, 228, 208, 0) 0, rgba(238, 231, 214, .95) 138px,
      #3a78a2 140px, #4f8ab3 156px, #78a9c3 166px, #dfe8e2 167px, #f2eadb 169px,
      #c7a46f 172px, #d4b37e 182px, #e3c693 215px, #e7cb98 300px, #dfbe88 440px, #dfbe88 100%);
}
.land::after { /* feine Rippeln im Sand */
  content: ''; position: absolute; inset: 172px 0 0;
  background: repeating-linear-gradient(178.6deg, rgba(150, 105, 50, 0) 0 22px, rgba(150, 105, 50, .07) 23px 24px, rgba(255, 245, 220, .12) 25px 26px, rgba(150, 105, 50, 0) 27px 44px);
  -webkit-mask: linear-gradient(180deg, transparent, #000 40%); mask: linear-gradient(180deg, transparent, #000 40%);
}
.props { position: absolute; z-index: 1; top: 0; bottom: 0; left: calc(50% - 50vw); width: 100vw; pointer-events: none; }
.stairs { position: absolute; right: -3vw; bottom: 1%; width: min(44vw, 640px); aspect-ratio: 798 / 523; }
.stairs svg { width: 100%; height: 100%; overflow: visible; }
.suitcase { position: absolute; left: 57vw; top: 30%; width: clamp(110px, 10vw, 160px); aspect-ratio: 280 / 200; transform: rotate(-7deg); }
.gshadow { position: absolute; border-radius: 50%; background: radial-gradient(closest-side, rgba(var(--shade), .38), rgba(var(--shade), 0)); }
.gshadow--case { left: calc(57vw + 120px); top: 97%; width: clamp(120px, 11vw, 170px); height: 22px; }
.ball { position: absolute; left: 89vw; top: calc(var(--hz, 64%) + 34px); width: 16px; height: 16px; }
.gshadow--ball { left: calc(89vw + 9px); top: calc(var(--hz, 64%) + 45px); width: 90px; height: 8px; border-radius: 0 50% 50% 0; transform: skewX(60deg); transform-origin: 0 0; background: linear-gradient(90deg, rgba(var(--shade), .45), rgba(var(--shade), 0)); }

.frame {
  position: relative; z-index: 2; flex: none; width: min(640px, 100%); margin: 0;
  padding: var(--bw); background: var(--frame); border-radius: 2px;
  box-shadow: 0 0 0 1px #5d3e10, inset 0 0 0 1px rgba(255, 244, 205, .7), inset 0 0 0 5px rgba(120, 80, 20, .3), inset 0 0 0 8px rgba(255, 232, 170, .35), inset 0 0 0 11px rgba(110, 72, 18, .25);
}
.frame::after { /* langer Schatten auf dem Sand */
  content: ''; position: absolute; z-index: -1; left: 0; top: 100%; width: 100%; height: 14%;
  background: linear-gradient(180deg, rgba(var(--shade), .5), rgba(var(--shade), .1));
  transform-origin: 0 0; transform: skewX(82deg); filter: blur(1px);
}
.night {
  --h: 64%;
  position: relative; color: #f4ead3;
  box-shadow: 0 0 0 2px #4d330c, inset 0 0 40px rgba(0, 0, 0, .55);
  background:
    linear-gradient(90deg, transparent 77%, rgba(255, 236, 186, .5) 79.5%, transparent 82%) 0 var(--h) / 100% 30px no-repeat,
    radial-gradient(circle at 82% 13%, rgba(255, 238, 190, .2), transparent 22%),
    radial-gradient(circle at 6% 4%, #fff 0 1.1px, transparent 1.8px),
    radial-gradient(circle at 19% 2.5%, #fff 0 .8px, transparent 1.5px),
    radial-gradient(circle at 34% 5%, #fff 0 1.2px, transparent 1.9px),
    radial-gradient(circle at 51% 2%, #fff 0 .8px, transparent 1.5px),
    radial-gradient(circle at 63% 5.5%, #fff 0 1px, transparent 1.7px),
    radial-gradient(circle at 95% 30%, #fff 0 1.1px, transparent 1.8px),
    radial-gradient(circle at 91% 44%, #fff 0 .8px, transparent 1.5px),
    radial-gradient(circle at 96.5% 52%, #fff 0 1px, transparent 1.7px),
    radial-gradient(circle at 70% 3%, #fff 0 .7px, transparent 1.4px),
    radial-gradient(circle at 97% 7%, #fff 0 .9px, transparent 1.6px),
    linear-gradient(180deg, #050c22 0, #0b1a3c calc(var(--h) * .5), #183060 calc(var(--h) * .9), #2a4474 calc(var(--h) - 1px),
      #0d2042 var(--h), #142c52 calc(var(--h) + 27px), #3d4c67 calc(var(--h) + 29px), #262637 calc(var(--h) + 32px), #2d2c3c calc(var(--h) + 80px), #1e1d2b 100%);
}
.moon { position: absolute; top: 6%; right: 9%; width: clamp(46px, 5vw, 70px); height: auto; aspect-ratio: 1; }
.hero__txt { position: relative; padding: clamp(28px, 3.6vw, 52px) clamp(24px, 3.6vw, 52px) clamp(28px, 3.2vw, 46px); }
.hero__txt .kicker { color: var(--gold); max-width: 80%; text-wrap: balance; }
.hero h1 { font-size: clamp(32px, 1.9vw + 18px, 50px); line-height: 1.06; color: #fbf3df; margin-bottom: 20px; max-width: 13em; }
.lead { font-size: clamp(15.5px, .3vw + 13px, 17px); line-height: 1.6; color: #e7dcc4; max-width: 46ch; }
.ctas { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 28px; }
.btn { display: inline-flex; align-items: center; min-height: 48px; padding: 0 24px; border-radius: 999px; font: 600 15px/1 var(--sans); text-decoration: none; transition: transform .2s, background .2s, color .2s; }
.btn--gold { background: var(--gold); color: #1a1406; box-shadow: inset 0 -3px 0 rgba(120, 70, 0, .25); }
.btn--gold:hover { background: #f3cb6c; transform: translateY(-1px); }
.btn--line { border: 1.5px solid rgba(244, 234, 211, .8); color: #f8efd9; }
.btn--line:hover { background: rgba(244, 234, 211, .14); }
.avail { margin-top: 20px; font-size: 13.5px; color: #c9c0ad; letter-spacing: .02em; }

/* ---------- Boden unter dem Bild ---------- */
.ground {
  position: relative; overflow: hidden;
  background: linear-gradient(180deg, #dfbe88 0, #e6cb9b 7%, #e9d2a6 30%, #e6cc9c 52%, #e0bf90 66%, #d7ae8b 76%, #bf9289 84%, #8f7a95 91%, #4f4f78 96.5%, #27305a 100%);
}
.ground > section { position: relative; }
.head { max-width: 780px; margin-bottom: clamp(36px, 4vw, 56px); }
.head h2, .about h2, .contact h2 { font-size: clamp(34px, 2.6vw + 14px, 56px); line-height: 1.04; color: var(--ink); }
.intro { margin-top: 20px; font-size: clamp(16.5px, .3vw + 15px, 18.5px); color: var(--ink2); max-width: 62ch; }

/* Schwerpunkt: Fenster */
.focus { padding: clamp(84px, 9vw, 140px) 0 clamp(70px, 8vw, 120px); }
.window {
  position: relative; padding: 16px; border-radius: 3px;
  background: linear-gradient(140deg, #fdfbf5, #ece4d2);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .9), inset -4px -4px 0 rgba(120, 100, 70, .12), 0 1px 0 rgba(90, 70, 40, .2);
}
.window::before { /* Fensterbank */
  content: ''; position: absolute; left: -16px; right: -16px; bottom: -14px; height: 18px; border-radius: 2px;
  background: linear-gradient(180deg, #fffdf6, #d9cdb4); box-shadow: 0 8px 12px -8px rgba(60, 40, 20, .4);
}
.window::after { /* Schatten auf dem Sand, weit unten */
  content: ''; position: absolute; left: 22%; right: -14%; bottom: -96px; height: 40px; border-radius: 50%;
  background: radial-gradient(closest-side, rgba(var(--shade), .32), rgba(var(--shade), 0)); filter: blur(3px);
}
.panes { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.panes li, .route__pane {
  position: relative; overflow: hidden;
  background:
    linear-gradient(118deg, rgba(255, 255, 255, 0) 38%, rgba(255, 255, 255, .2) 44%, rgba(255, 255, 255, 0) 52%),
    radial-gradient(ellipse 22% 7% at 24% 34%, rgba(255, 255, 255, .7), rgba(255, 255, 255, 0)),
    radial-gradient(ellipse 15% 5% at 31% 31%, rgba(255, 255, 255, .6), rgba(255, 255, 255, 0)),
    radial-gradient(ellipse 18% 6% at 74% 62%, rgba(255, 255, 255, .55), rgba(255, 255, 255, 0)),
    linear-gradient(180deg, #6c9fd4 0%, #9cc3e5 50%, #d3e4ee 100%);
  background-attachment: scroll, fixed, fixed, fixed, fixed;
  box-shadow: inset 0 0 0 1px rgba(50, 70, 100, .28), inset 4px 4px 0 rgba(20, 40, 70, .07);
}
.panes li { padding: clamp(24px, 2.4vw, 34px) clamp(22px, 2.2vw, 32px) clamp(28px, 2.6vw, 38px); min-height: 200px; }
.panes h3 { font-size: clamp(23px, .6vw + 18px, 28px); line-height: 1.12; margin-bottom: 10px; color: var(--ink); }
.panes p { font-size: 15.5px; color: var(--ink); max-width: 34ch; }

.focus__low { display: grid; gap: clamp(80px, 8vw, 110px); margin-top: clamp(140px, 13vw, 190px); }

/* Blöcke: Vorderseite + Deckfläche + Seitenfläche (Tiefe nach links oben) */
.blk { --d: 26px; position: relative; background: linear-gradient(180deg, #efe4cc, #dccaa6); }
.blk__top, .blk__side { position: absolute; pointer-events: none; }
.blk__top { left: 0; width: 100%; top: calc(-1 * var(--d)); height: var(--d); background: linear-gradient(90deg, #fffaf0, #f5ebd6); transform-origin: 0 100%; transform: skewX(60.75deg); }
.blk__side { top: 0; height: 100%; left: calc(-1.786 * var(--d)); width: calc(1.786 * var(--d)); background: linear-gradient(180deg, #faf2e1, #eadcbd); transform-origin: 100% 0; transform: skewY(29.25deg); }

.plinths { list-style: none; margin: 0; padding: 0 0 0 46px; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); align-items: end; gap: clamp(56px, 7vw, 110px); }
.plinths .blk { display: flex; flex-direction: column; justify-content: space-between; gap: 18px; padding: 24px 26px 22px; }
.plinths .blk:nth-child(1) { min-height: 220px; }
.plinths .blk:nth-child(2) { min-height: 160px; }
.plinths .blk:nth-child(3) { min-height: 190px; }
.plinths .blk::after, .frame--day::after, .slab::after {
  content: ''; position: absolute; z-index: -1; left: 0; top: 100%; width: 100%; height: 14%;
  background: linear-gradient(180deg, rgba(var(--shade), .4), rgba(var(--shade), .06));
  transform-origin: 0 0; transform: skewX(82deg);
}
.plinths .blk { z-index: 1; }
.plinths b { font: 400 clamp(38px, 2.4vw + 14px, 54px)/1 var(--serif); color: var(--ink); white-space: nowrap; }
.plinths span { font-size: 15px; line-height: 1.4; color: var(--ink2); max-width: 22ch; }

.route { margin: 0; display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); gap: clamp(28px, 4vw, 64px); align-items: end; }
.route__pane { border: 14px solid #f7f2e6; border-radius: 3px; outline: 1px solid rgba(90, 70, 40, .25); }
.route__map { width: 100%; height: auto; overflow: visible; }
.trail { fill: none; stroke: #fff; stroke-width: 5; stroke-linecap: round; stroke-dasharray: .5 11; opacity: .95; }
.trail--car { stroke: var(--ink); stroke-width: 2.5; stroke-dasharray: 6 7; opacity: .7; }
.route__codes text { font: 700 19px var(--sans); letter-spacing: .08em; fill: var(--ink); text-anchor: middle; }
.route figcaption { display: grid; gap: 10px; padding-bottom: 8px; }
.route figcaption .kicker { margin: 0; }
.route__text { font: italic 400 clamp(18px, .5vw + 14px, 21px)/1.35 var(--serif); color: var(--ink); }
.route__note { font-size: 14px; color: var(--ink2); }

/* Leistungen: stehende Platte */
.services { padding: clamp(40px, 5vw, 80px) 0 clamp(120px, 12vw, 170px); }
.slab { --d: 16px; position: relative; z-index: 1; padding: clamp(28px, 5vw, 72px); background: linear-gradient(170deg, #fbf6ec, #f1e6d0); }
.slab__top { position: absolute; left: 0; width: 100%; top: calc(-1 * var(--d)); height: var(--d); background: linear-gradient(90deg, #fffdf7, #f7eedc); transform-origin: 0 100%; transform: skewX(60.75deg); }
.slab__side { position: absolute; top: 0; height: 100%; left: calc(-1.786 * var(--d)); width: calc(1.786 * var(--d)); background: linear-gradient(180deg, #fdf8ee, #ecdfc3); transform-origin: 100% 0; transform: skewY(29.25deg); }
.slab::after { height: 9%; max-height: 120px; }
.head--row { max-width: none; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 24px 64px; align-items: end; }
.head--row .intro { margin: 0; }
.svc { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(40px, 4.4vw, 64px) clamp(28px, 4vw, 56px); }
.svc li { border-top: 1px solid rgba(20, 32, 59, .16); padding-top: 26px; }
.obj { position: relative; display: block; height: 104px; margin-bottom: 18px; }
.obj svg { height: 76px; width: auto; max-width: 168px; }
.svc li:first-child .obj svg { filter: drop-shadow(0 3px 4px rgba(40, 70, 120, .35)) drop-shadow(0 0 1px rgba(40, 70, 120, .4)); }
.obj::after { content: ''; position: absolute; left: 34px; bottom: 0; width: 110px; height: 12px; border-radius: 50%; background: radial-gradient(closest-side, rgba(var(--shade), .3), rgba(var(--shade), 0)); }
.svc h3 { font-size: clamp(23px, .5vw + 19px, 27px); line-height: 1.15; margin-bottom: 10px; }
.svc p { font-size: 15.5px; color: var(--ink2); }

/* Ablauf: Treppe */
.process { padding: clamp(40px, 5vw, 70px) 0 clamp(130px, 13vw, 180px); }
.flight { position: relative; padding-top: 80px; padding-left: 46px; }
.flight__cloud { position: absolute; z-index: 6; right: -70px; top: -40px; width: clamp(260px, 26vw, 380px); aspect-ratio: 440 / 156; }
.steps { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); align-items: end; }
.steps .blk { --d: 30px; padding: 26px clamp(18px, 1.8vw, 28px) 30px; }
.steps .blk:nth-child(1) { z-index: 4; min-height: 250px; }
.steps .blk:nth-child(2) { z-index: 3; min-height: 310px; }
.steps .blk:nth-child(3) { z-index: 2; min-height: 370px; }
.steps .blk:nth-child(4) { z-index: 1; min-height: 430px; }
.steps .blk:nth-child(4)::after { content: ''; position: absolute; z-index: -1; left: 0; top: 100%; width: 100%; height: 60px; background: linear-gradient(180deg, rgba(var(--shade), .38), rgba(var(--shade), .05)); transform-origin: 0 0; transform: skewX(82deg); }
.steps .blk + .blk { box-shadow: inset 1px 0 0 rgba(120, 95, 60, .25); }
.no { display: block; font: italic 400 46px/1 var(--serif); color: var(--rust); margin-bottom: 14px; }
.steps h3 { font-size: clamp(23px, .5vw + 19px, 27px); margin-bottom: 8px; }
.steps p { font-size: 15px; color: var(--ink2); hyphens: auto; }

/* Über uns */
.about { padding: 0 0 clamp(120px, 12vw, 170px); }
.about__in { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: clamp(40px, 6vw, 96px); align-items: center; }
.frame--day { width: 100%; max-width: 500px; }
.frame--day img { width: 100%; height: auto; aspect-ratio: 1; object-fit: cover; box-shadow: 0 0 0 2px #4d330c; }
.frame--day::after { height: 12%; }
.about__text > p:not(.kicker) { margin-top: 22px; font-size: 17px; color: var(--ink2); max-width: 56ch; }
.feats { list-style: none; margin: 30px 0 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px 28px; }
.feats li { position: relative; padding-left: 30px; font-weight: 500; }
.feats li::before { content: ''; position: absolute; left: 0; top: .32em; width: 15px; height: 15px; border-radius: 50%; background: radial-gradient(circle at 34% 30%, #fff3e2, #e98a5a 28%, #b54826 68%, #6e2412); }
.feats li::after { content: ''; position: absolute; left: 7px; top: calc(.32em + 14px); width: 15px; height: 3px; border-radius: 50%; background: rgba(var(--shade), .3); }

/* Kontakt */
.contact { padding: 0 0 clamp(110px, 11vw, 160px); }
.slab--contact { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr); gap: clamp(32px, 5vw, 80px); align-items: start; }
.contact__head > p:not(.kicker) { margin-top: 18px; color: var(--ink2); font-size: 17px; }
.contact__phone { display: inline-block; margin-top: 26px; font: 400 clamp(28px, 1.6vw + 16px, 40px)/1.1 var(--serif); color: var(--ink); text-decoration: none; background: linear-gradient(var(--gold), var(--gold)) 0 92% / 100% 6px no-repeat; }
.contact__phone:hover { background-size: 100% 40%; }
.contact__grid { margin: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px 36px; }
.contact__grid div { border-top: 1px solid rgba(20, 32, 59, .16); padding-top: 14px; }
.contact__grid dt { font: 600 12px/1.3 var(--sans); letter-spacing: .14em; text-transform: uppercase; color: var(--rust); margin-bottom: 6px; }
.contact__grid dd { margin: 0; font-size: 16.5px; }
.contact__grid a { text-decoration-color: rgba(20, 32, 59, .35); text-underline-offset: 3px; }
.contact__grid a:hover { text-decoration-color: currentColor; }

/* ---------- Fuß: Nacht ---------- */
.foot {
  position: relative; overflow: hidden; color: #d9d3c4;
  background:
    radial-gradient(circle at 12% 18%, #fff 0 1px, transparent 1.7px), radial-gradient(circle at 27% 46%, #fff 0 .8px, transparent 1.5px),
    radial-gradient(circle at 41% 12%, #fff 0 1.1px, transparent 1.8px), radial-gradient(circle at 56% 34%, #fff 0 .8px, transparent 1.5px),
    radial-gradient(circle at 68% 10%, #fff 0 1px, transparent 1.7px), radial-gradient(circle at 79% 40%, #fff 0 .9px, transparent 1.6px),
    radial-gradient(circle at 94% 22%, #fff 0 1px, transparent 1.7px), radial-gradient(circle at 6% 52%, #fff 0 .8px, transparent 1.5px),
    linear-gradient(180deg, #27305a 0%, #17204a 35%, #0d1634 100%);
}
.foot__moon { position: absolute; top: 34px; right: 7vw; width: 58px; height: 58px; }
.foot__in { position: relative; display: grid; grid-template-columns: auto 1fr auto; gap: 28px 48px; align-items: end; padding-top: 80px; padding-bottom: 96px; }
.logo--foot img { height: 84px; }
.foot__addr { font-size: 14.5px; line-height: 1.65; }
.foot__nav { display: flex; flex-wrap: wrap; gap: 8px 26px; justify-content: flex-end; font-size: 14.5px; }
.foot__nav a { text-decoration: none; color: #f2ead8; border-bottom: 1px solid rgba(242, 234, 216, .35); }
.foot__nav a:hover { border-bottom-color: currentColor; }
.foot__copy { grid-column: 1 / -1; font-size: 13px; color: #aaa59a; border-top: 1px solid rgba(255, 255, 255, .12); padding-top: 20px; }

/* ---------- Rechtsseiten ---------- */
.lhero { padding-bottom: clamp(80px, 10vh, 110px); }
.lhero .frame { width: min(760px, 100%); }
.lhero .hero__txt { padding-bottom: 64px; }
.lhero h1 { font-size: clamp(30px, 2vw + 16px, 46px); line-height: 1.08; color: #fbf3df; hyphens: auto; }
.back { display: inline-block; margin-bottom: 22px; color: #f1e6cc; font-size: 14.5px; text-decoration: none; border-bottom: 1px solid rgba(241, 230, 204, .4); }
.back:hover { border-bottom-color: currentColor; }
.legal-wrap { padding: clamp(50px, 6vw, 90px) 0 clamp(110px, 11vw, 150px); }
.legal-wrap .slab { max-width: 900px; }
.legal-body { max-width: 70ch; font-size: 16.5px; color: var(--ink); }
.legal-body h2 { font-size: clamp(24px, 1vw + 18px, 30px); line-height: 1.15; margin: 44px 0 12px; }
.legal-body h2:first-child { margin-top: 0; }
.legal-body p, .legal-body ul { margin: 0 0 14px; }
.legal-body ul { padding-left: 22px; }
.legal-body li { margin-bottom: 6px; }
.legal-body li::marker { color: var(--rust); }
.legal-body a { color: var(--ink); text-decoration-color: rgba(150, 45, 22, .5); text-underline-offset: 3px; overflow-wrap: anywhere; }
.legal-body .legal-note { padding: 14px 18px; background: rgba(108, 159, 212, .16); border-left: 3px solid #6c9fd4; font-size: 15px; color: var(--ink2); }
.legal-body .legal-address { padding: 16px 20px; background: #fffaf0; border: 1px solid rgba(20, 32, 59, .12); font-style: normal; }
.legal-ground { position: relative; overflow: hidden; background: linear-gradient(180deg, #e6c995 0, #e6cb9b 20%, #e6cc9c 70%, #bf9289 92%, #27305a 100%); }
.legal-case { position: absolute; right: max(4vw, calc(50vw - 600px)); top: 150px; width: 130px; aspect-ratio: 280 / 200; transform: rotate(8deg); }
.legal-case + .gshadow { right: max(4vw, calc(50vw - 600px)); left: auto; top: 520px; width: 140px; height: 18px; }
@media (max-width: 1180px) { .legal-case, .legal-case + .gshadow { display: none; } }

/* ---------- Bewegung ---------- */
@media (prefers-reduced-motion: no-preference) {
  .cl--a { animation: drift 46s ease-in-out infinite alternate; }
  .cl--b { animation: drift 64s ease-in-out infinite alternate-reverse; }
  .cl--c { animation: drift 38s ease-in-out infinite alternate; }
  .cl--plane { animation: glide 70s ease-in-out infinite alternate; }
  .suitcase, .legal-case { animation: hover 7s ease-in-out infinite alternate; }
  .gshadow--case { animation: hovsh 7s ease-in-out infinite alternate; }
  .obj svg { animation: bob 6s ease-in-out infinite alternate; }
  .svc li:nth-child(2n) .obj svg { animation-delay: -3s; }
  .flight__cloud { animation: drift 50s ease-in-out infinite alternate; }
  @keyframes drift { to { transform: translateX(-36px); } }
  @keyframes glide { to { transform: translate(-60px, 8px); } }
  @keyframes hover { to { transform: translateY(-12px) rotate(-4deg); } }
  @keyframes hovsh { to { transform: scale(.9); opacity: .8; } }
  @keyframes bob { to { transform: translateY(-5px); } }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .panes li, .route__pane { background-attachment: scroll; }
}

/* ---------- Responsiv ---------- */
@media (max-width: 1180px) {
  .nav { gap: 24px; }
  .nav__list { gap: 20px; }
  .frame { width: min(560px, 100%); }
  .stairs { width: 44vw; right: -2vw; }
  .suitcase { left: 60vw; top: 22%; width: 104px; }
  .cl--plane { left: 64vw; }
  .gshadow--case { left: calc(60vw + 90px); }
  .panes { grid-template-columns: repeat(2, 1fr); }
  .route { grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); }
  .plinths { max-width: 640px; }
  .svc { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .steps .blk { --d: 22px; }
}
@media (max-width: 900px) {
  .menu {
    display: inline-flex; align-items: center; gap: 10px; margin-left: auto; min-height: 44px; padding: 0 16px;
    border: 1px solid rgba(255, 255, 255, .75); border-radius: 999px; background: rgba(16, 40, 86, .25); color: #fff;
    font: 600 14.5px/1 var(--sans); cursor: pointer;
  }
  .menu__ico { display: grid; gap: 5px; width: 18px; }
  .menu__ico i { display: block; height: 2px; background: currentColor; border-radius: 2px; transition: transform .25s; }
  .top.open .menu__ico i:first-child { transform: translateY(3.5px) rotate(45deg); }
  .top.open .menu__ico i:last-child { transform: translateY(-3.5px) rotate(-45deg); }
  .js .nav {
    display: none; position: absolute; top: calc(100% - 4px); left: 12px; right: 12px; flex-direction: column; align-items: stretch; gap: 8px;
    padding: 14px 22px 22px; background: var(--cream); border-radius: 4px; box-shadow: 0 0 0 6px rgba(231, 184, 80, .9), 0 30px 60px -20px rgba(10, 20, 50, .5);
  }
  .js .top.open .nav { display: flex; }
  .nav { flex-wrap: wrap; }
  .js .nav__list { flex-direction: column; gap: 0; }
  .js .nav__list a, .js .tel { display: block; color: var(--ink); text-shadow: none; font: 400 26px/1.2 var(--serif); padding: 10px 0; border-bottom: 1px solid rgba(20, 32, 59, .12); background: none; }
  .js .nav__end { justify-content: space-between; padding-top: 10px; }
  .js .tel { font: 600 16px/1.3 var(--sans); border: 0; }
  .js .lang { color: var(--ink); border-color: var(--ink); background: none; }
  .top__in { position: relative; }
  .about__in { grid-template-columns: 1fr; }
  .frame--day { max-width: 440px; }
  .slab--contact { grid-template-columns: 1fr; }
  .head--row { grid-template-columns: 1fr; }
  .foot__in { grid-template-columns: 1fr; align-items: start; }
  .foot__nav { justify-content: flex-start; }
}
@media (max-width: 720px) {
  :root { --bw: 14px; }
  .hero { padding-top: 168px; padding-bottom: 84px; }
  .logo img { height: 52px; }
  .frame { width: 100%; }
  .cl--plane { top: 82px; left: auto; right: -14px; width: 190px; }
  .cl--a { top: 120px; left: 8px; width: 130px; }
  .cl--b, .cl--c, .stairs, .suitcase, .gshadow--case, .ball, .gshadow--ball { display: none; }
  .frame::after { height: 8%; transform: skewX(76deg); }
  .moon { top: 3%; }
  .hero__txt .kicker { max-width: 76%; }
  .panes { grid-template-columns: 1fr; gap: 10px; }
  .panes li { min-height: 0; }
  .window { padding: 10px; }
  .plinths { padding-left: 30px; grid-template-columns: 1fr; gap: 44px; }
  .plinths .blk { --d: 16px; min-height: 0 !important; flex-direction: row; align-items: center; gap: 18px; padding: 18px 20px; }
  .plinths .blk:nth-child(2) { margin-left: 24px; }
  .plinths .blk:nth-child(3) { margin-left: 48px; }
  .plinths .blk::after { height: 30px; }
  .plinths b { font-size: 36px; }
  .plinths span { font-size: 14px; }
  .route { grid-template-columns: 1fr; }
  .route__pane { border-width: 9px; }
  .slab { --d: 10px; }
  .route__codes text { font-size: 26px; }
  .svc { grid-template-columns: 1fr; }
  .flight { padding-left: 0; padding-top: 30px; }
  .flight__cloud { display: none; }
  .steps { grid-template-columns: 1fr; gap: 26px; }
  .steps .blk { --d: 16px; min-height: 0 !important; margin-left: 30px; }
  .steps .blk:nth-child(2) { margin-left: 50px; }
  .steps .blk:nth-child(3) { margin-left: 70px; }
  .steps .blk:nth-child(4) { margin-left: 90px; }
  .steps .blk:nth-child(4)::after { display: none; }
  .steps .blk + .blk { box-shadow: none; }
  .feats { grid-template-columns: 1fr; }
  .contact__grid { grid-template-columns: 1fr; }
  .foot__moon { top: 24px; width: 44px; }
}