/* =====================================================================
   Schriften — seit 27.07.2026 selbst gehostet.
   Vorher wurden Jost und Newsreader bei Google geladen. Dabei wird die
   IP-Adresse jedes Besuchers an Google uebertragen; das LG Muenchen I hat
   das am 20.01.2022 (Az. 3 O 17493/20) fuer unzulaessig erklaert.
   Die Dateien liegen jetzt unter /assets/fonts/ auf dem eigenen Server.
   ===================================================================== */
@font-face{font-family:"Jost";font-style:normal;font-weight:300;font-display:swap;
  src:url("../fonts/jost-latin-ext-300-normal.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:"Jost";font-style:normal;font-weight:300;font-display:swap;
  src:url("../fonts/jost-latin-300-normal.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:"Jost";font-style:normal;font-weight:400;font-display:swap;
  src:url("../fonts/jost-latin-ext-400-normal.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:"Jost";font-style:normal;font-weight:400;font-display:swap;
  src:url("../fonts/jost-latin-400-normal.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:"Jost";font-style:normal;font-weight:500;font-display:swap;
  src:url("../fonts/jost-latin-ext-500-normal.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:"Jost";font-style:normal;font-weight:500;font-display:swap;
  src:url("../fonts/jost-latin-500-normal.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:"Newsreader";font-style:normal;font-weight:400;font-display:swap;
  src:url("../fonts/newsreader-latin-ext-400-normal.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:"Newsreader";font-style:normal;font-weight:400;font-display:swap;
  src:url("../fonts/newsreader-latin-400-normal.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:"Newsreader";font-style:italic;font-weight:400;font-display:swap;
  src:url("../fonts/newsreader-latin-ext-400-italic.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:"Newsreader";font-style:italic;font-weight:400;font-display:swap;
  src:url("../fonts/newsreader-latin-400-italic.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;}

/* =====================================================================
   LUXESCAPE — Kärnten
   Palette aus dem Logo (#5F7B6A) abgeleitet, Seeton als zweiter Akzent.
   ===================================================================== */
:root{
  --sage:#5F7B6A;
  --sage-deep:#455C4E;
  --sage-soft:#8FA697;
  --sage-tint:#EAEFEB;
  --lake:#6E939A;
  --lake-tint:#E7EEEF;
  --ink:#212A25;
  --stone:#66716A;
  --mist:#F2F4F1;
  --paper:#FFFFFF;
  --line:#DCE3DD;
  --line-soft:#E8EDE8;
  --shadow:0 1px 2px rgba(33,42,37,.04), 0 12px 32px -18px rgba(33,42,37,.22);
  --wrap:1180px;
  --r:14px;
  --ease:cubic-bezier(.22,.61,.36,1);
}

*,*::before,*::after{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;}
body{
  margin:0;background:var(--mist);color:var(--ink);
  font-family:"Newsreader",Georgia,"Times New Roman",serif;
  font-size:1.0625rem;line-height:1.75;font-weight:400;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;height:auto;display:block;}
a{color:inherit;text-decoration:none;}
button{font:inherit;}

/* Utility-Schrift: alles was Interface ist */
.nav,.btn,.eyebrow,.kicker,.tag,.meta,.chip,.crumb,.foot,.field label,input,select,textarea,
table,.stat-k,.badge,.wordmark,h1,h2,h3,h4,h5{
  font-family:"Jost",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
}

h1,h2,h3,h4{margin:0 0 .6em;font-weight:300;letter-spacing:-.012em;line-height:1.14;color:var(--ink);}
h1{font-size:clamp(2.4rem,5.6vw,4.1rem);}
h2{font-size:clamp(1.8rem,3.4vw,2.7rem);}
h3{font-size:clamp(1.25rem,2vw,1.6rem);}
h4{font-size:1.06rem;font-weight:400;letter-spacing:0;}
p{margin:0 0 1.1em;}
p:last-child{margin-bottom:0;}
.lead{font-size:clamp(1.1rem,1.6vw,1.32rem);line-height:1.68;color:var(--stone);}

.wrap{width:100%;max-width:var(--wrap);margin-inline:auto;padding-inline:clamp(1.15rem,4vw,2.5rem);}
section{padding-block:clamp(3.4rem,7vw,6.5rem);}
.tight{padding-block:clamp(2.2rem,4vw,3.4rem);}
.paper{background:var(--paper);}

.eyebrow{
  display:block;font-size:.7rem;font-weight:500;letter-spacing:.22em;
  text-transform:uppercase;color:var(--sage);margin-bottom:1.1rem;
}
.rule{width:56px;height:1px;background:var(--sage);opacity:.5;margin:1.5rem 0;}

/* ---------------------------------------------------------------- Kopf */
.site-header{
  position:sticky;top:0;z-index:60;background:rgba(242,244,241,.86);
  backdrop-filter:saturate(1.4) blur(14px);border-bottom:1px solid transparent;
  transition:border-color .3s var(--ease),background .3s var(--ease);
}
.site-header.solid{border-bottom-color:var(--line);background:rgba(242,244,241,.96);}
.hbar{display:flex;align-items:center;gap:1.4rem;height:78px;}
.brand{display:flex;align-items:center;gap:.7rem;margin-right:auto;}
.brand img{height:54px;width:auto;flex:none;max-width:none;object-fit:contain;}

.nav{display:flex;align-items:center;gap:.15rem;}
.nav > a,.nav .has-sub > a{
  position:relative;padding:.55rem .8rem;border-radius:8px;
  font-size:.905rem;letter-spacing:.01em;color:var(--ink);
  transition:color .2s var(--ease),background .2s var(--ease);
}
.nav > a:hover,.nav .has-sub > a:hover{color:var(--sage-deep);background:var(--sage-tint);}
.nav a.on{color:var(--sage-deep);}
.nav a.on::after{
  content:"";position:absolute;left:.8rem;right:.8rem;bottom:.3rem;
  height:1px;background:var(--sage);
}

.has-sub{position:relative;padding-bottom:1rem;margin-bottom:-1rem;}
.subnav{
  position:absolute;top:100%;left:50%;transform:translateX(-50%) translateY(2px);
  min-width:264px;background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r);box-shadow:var(--shadow);padding:.45rem;
  opacity:0;visibility:hidden;z-index:70;
  transition:opacity .18s var(--ease) .4s,transform .18s var(--ease) .4s,visibility 0s linear .58s;
}
.subnav::before{content:"";position:absolute;left:0;right:0;top:-14px;height:14px;}
.has-sub:hover .subnav,.has-sub:focus-within .subnav{
  opacity:1;visibility:visible;transform:translateX(-50%) translateY(4px);
  transition:opacity .18s var(--ease) 0s,transform .18s var(--ease) 0s,visibility 0s linear 0s;
}
.subnav a{display:flex;align-items:baseline;gap:.7rem;padding:.62rem .8rem;border-radius:9px;font-size:.9rem;}
.subnav a:hover{background:var(--sage-tint);}
.subnav .alt{font-size:.74rem;letter-spacing:.1em;color:var(--sage);margin-left:auto;}
.caret{display:inline-block;margin-left:.32rem;border:4px solid transparent;border-top-color:currentColor;border-bottom:0;vertical-align:middle;opacity:.55;transition:transform .2s var(--ease) .4s;}
.has-sub:hover .caret{transform:rotate(180deg);transition-delay:0s;}

.langs{display:flex;gap:.1rem;margin-left:.4rem;}
.langs a{font-size:.72rem;letter-spacing:.12em;padding:.3rem .42rem;border-radius:6px;color:var(--stone);font-family:"Jost",sans-serif;}
.langs a.on{color:var(--sage-deep);background:var(--sage-tint);}

.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.5rem;
  padding:.72rem 1.45rem;border-radius:999px;font-size:.9rem;font-weight:400;
  letter-spacing:.03em;border:1px solid var(--sage);color:var(--sage-deep);
  background:transparent;cursor:pointer;white-space:nowrap;
  transition:background .22s var(--ease),color .22s var(--ease),border-color .22s var(--ease),transform .22s var(--ease);
}
.btn:hover{background:var(--sage);color:#fff;}
.btn:active{transform:translateY(1px);}
.btn.solid{background:var(--sage);border-color:var(--sage);color:#fff;}
.btn.solid:hover{background:var(--sage-deep);border-color:var(--sage-deep);}
.btn.plain{border-color:var(--line);color:var(--ink);}
.btn.plain:hover{border-color:var(--sage);background:var(--sage-tint);color:var(--sage-deep);}
.btn.lg{padding:.92rem 1.9rem;font-size:.96rem;}

.menu-toggle{display:none;width:42px;height:42px;border:1px solid var(--line);background:var(--paper);border-radius:10px;cursor:pointer;align-items:center;justify-content:center;}
.menu-toggle span{display:block;width:17px;height:1px;background:var(--ink);position:relative;}
.menu-toggle span::before,.menu-toggle span::after{content:"";position:absolute;left:0;width:17px;height:1px;background:var(--ink);}
.menu-toggle span::before{top:-5px;} .menu-toggle span::after{top:5px;}

/* ---------------------------------------------------------------- Hero */
.hero{padding-block:clamp(2.6rem,6vw,5rem) clamp(3rem,6vw,5.5rem);}
.hero-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.92fr);gap:clamp(2rem,5vw,4.5rem);align-items:center;}
.hero h1{margin-bottom:1.2rem;}
.hero h1 em{font-family:"Newsreader",serif;font-style:italic;font-weight:300;color:var(--sage-deep);}
.hero-cta{display:flex;flex-wrap:wrap;gap:.7rem;margin-top:2rem;}
.hero-fig{position:relative;border-radius:var(--r);overflow:hidden;background:var(--sage-tint);aspect-ratio:3/2;}
.hero-fig img{width:100%;height:100%;object-fit:cover;}
.hero-tag{
  position:absolute;left:1rem;bottom:1rem;background:rgba(255,255,255,.92);
  backdrop-filter:blur(6px);border-radius:999px;padding:.42rem 1rem;
  font-family:"Jost",sans-serif;font-size:.76rem;letter-spacing:.09em;text-transform:uppercase;color:var(--sage-deep);
}

/* ------------------------------------------------- Höhenband (Signatur) */
.band{position:relative;}
.band-rows{margin-top:clamp(2rem,4vw,3.2rem);}
.band-row{
  display:grid;grid-template-columns:5.6rem 1px minmax(0,1fr);
  gap:0 clamp(1.2rem,3vw,2.4rem);align-items:stretch;
}
.band-alt{
  font-family:"Jost",sans-serif;text-align:right;padding-top:1.9rem;
  font-size:1.02rem;font-weight:300;color:var(--sage-deep);letter-spacing:.02em;
}
.band-alt small{display:block;font-size:.66rem;letter-spacing:.18em;text-transform:uppercase;color:var(--sage-soft);margin-top:.1rem;}
.band-axis{position:relative;background:var(--line);}
.band-row:first-child .band-axis{background:linear-gradient(to bottom,transparent 0,var(--line) 2rem);}
.band-row:last-child .band-axis{background:linear-gradient(to bottom,var(--line) calc(100% - 2rem),transparent 100%);}
.band-axis::after{
  content:"";position:absolute;left:50%;top:2.1rem;width:11px;height:11px;
  margin-left:-5.5px;border-radius:50%;background:var(--mist);
  border:1px solid var(--sage);transition:background .3s var(--ease);
}
.band-row:hover .band-axis::after{background:var(--sage);}
.band-item{display:grid;grid-template-columns:minmax(0,1fr) 13.5rem;gap:clamp(1.2rem,3vw,2.4rem);align-items:start;padding:1.5rem 0 2.6rem;border-bottom:1px solid var(--line-soft);}
.band-row:last-child .band-item{border-bottom:0;}
.band-item h3{margin-bottom:.35rem;}
.band-item h3 a:hover{color:var(--sage-deep);}
.band-item .meta{font-family:"Jost",sans-serif;font-size:.76rem;letter-spacing:.13em;text-transform:uppercase;color:var(--sage);margin-bottom:.7rem;}
.band-item p{color:var(--stone);margin-bottom:1rem;}
.band-fig{border-radius:12px;overflow:hidden;background:var(--sage-tint);aspect-ratio:3/2;}
.band-fig img{width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease);}
.band-row:hover .band-fig img{transform:scale(1.035);}

/* --------------------------------------------------------- Bausteine */
.grid{display:grid;gap:clamp(1rem,2.2vw,1.6rem);}
.g2{grid-template-columns:repeat(auto-fit,minmax(min(100%,20rem),1fr));}
.g3{grid-template-columns:repeat(auto-fit,minmax(min(100%,16.5rem),1fr));}
.g4{grid-template-columns:repeat(auto-fit,minmax(min(100%,12.5rem),1fr));}

.card{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);padding:1.7rem 1.6rem;transition:border-color .25s var(--ease),transform .25s var(--ease);}
.card:hover{border-color:var(--sage-soft);}
.card h4{margin-bottom:.45rem;}
.card p{font-size:.98rem;color:var(--stone);margin:0;}
.card .ico{width:26px;height:26px;color:var(--sage);margin-bottom:1rem;}
.card .ico svg{width:100%;height:100%;}

.split{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,21rem),1fr));gap:clamp(1.8rem,4vw,3.6rem);align-items:center;}
.split figure{margin:0;border-radius:var(--r);overflow:hidden;background:var(--sage-tint);aspect-ratio:3/2;}
.split figure img{width:100%;height:100%;object-fit:cover;}

.facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,9rem),1fr));gap:1px;background:var(--line);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;}
.fact{background:var(--paper);padding:1.25rem 1.2rem;}
.fact dt{font-family:"Jost",sans-serif;font-size:.68rem;letter-spacing:.16em;text-transform:uppercase;color:var(--sage);margin-bottom:.35rem;}
.fact dd{margin:0;font-size:.97rem;line-height:1.5;}

.chips{display:flex;flex-wrap:wrap;gap:.5rem;margin:0;padding:0;list-style:none;}
.chip{display:inline-flex;align-items:center;gap:.45rem;padding:.42rem .9rem;border:1px solid var(--line);border-radius:999px;background:var(--paper);font-size:.84rem;letter-spacing:.01em;color:var(--ink);}
.chip svg{width:15px;height:15px;color:var(--sage);flex-shrink:0;}

.ticks{list-style:none;margin:0;padding:0;}
.ticks li{position:relative;padding-left:1.6rem;margin-bottom:.62rem;color:var(--stone);}
.ticks li::before{content:"";position:absolute;left:0;top:.72em;width:8px;height:1px;background:var(--sage);}
.ticks li strong{color:var(--ink);font-weight:400;}

.note{display:flex;gap:.9rem;align-items:flex-start;background:var(--sage-tint);border-radius:var(--r);padding:1.15rem 1.35rem;font-size:.96rem;}
.note svg{width:21px;height:21px;color:var(--sage);flex-shrink:0;margin-top:.2rem;}
.note.lake{background:var(--lake-tint);}
.note.lake svg{color:var(--lake);}
.note a{color:var(--sage-deep);border-bottom:1px solid rgba(95,123,106,.4);}
.note a:hover{border-color:var(--sage);}
.exti{width:.62em;height:.62em;display:inline-block;vertical-align:baseline;margin-left:.3rem;opacity:.6;}

/* Galerie */
.gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:.75rem;}
.gallery a{position:relative;border-radius:12px;overflow:hidden;background:var(--sage-tint);display:block;aspect-ratio:3/2;}
.gallery img{width:100%;height:100%;object-fit:cover;transition:transform .55s var(--ease);}
.gallery a:hover img{transform:scale(1.04);}
.gallery a::after{
  content:"";position:absolute;inset:0;background:rgba(33,42,37,0);transition:background .3s var(--ease);
}
.gallery a:hover::after{background:rgba(33,42,37,.06);}
.gallery-more{margin-top:1.1rem;display:flex;align-items:center;gap:.9rem;font-family:"Jost",sans-serif;font-size:.85rem;color:var(--stone);}
.gallery-more span{flex:1;height:1px;background:var(--line);}

/* Presse */
.quote{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);padding:1.7rem 1.7rem 1.5rem;}
.quote blockquote{margin:0 0 1rem;font-size:1.06rem;line-height:1.68;color:var(--ink);}
.quote blockquote::before{content:"\201E";color:var(--sage-soft);font-size:2rem;line-height:0;vertical-align:-.35em;margin-right:.15rem;}
.quote cite{font-style:normal;font-family:"Jost",sans-serif;font-size:.78rem;letter-spacing:.12em;text-transform:uppercase;color:var(--sage);}
.press-list{list-style:none;margin:0;padding:0;}
.press-list li{display:flex;flex-wrap:wrap;gap:.4rem 1.1rem;align-items:baseline;padding:1.05rem 0;border-bottom:1px solid var(--line);}
.press-list .when{font-family:"Jost",sans-serif;font-size:.76rem;letter-spacing:.12em;text-transform:uppercase;color:var(--sage);min-width:6.5rem;}
.press-list .who{font-family:"Jost",sans-serif;font-size:.95rem;}
.press-list .what{color:var(--stone);flex:1;min-width:14rem;}
.dl{display:flex;align-items:center;gap:.9rem;padding:1.1rem 1.2rem;border:1px solid var(--line);border-radius:12px;background:var(--paper);transition:border-color .2s var(--ease);}
.dl:hover{border-color:var(--sage-soft);}
.dl svg{width:22px;height:22px;color:var(--sage);flex-shrink:0;}
.dl b{display:block;font-family:"Jost",sans-serif;font-weight:400;font-size:.97rem;}
.dl small{color:var(--stone);font-family:"Jost",sans-serif;font-size:.8rem;}

/* FAQ */
.faq{border-top:1px solid var(--line);}
.faq details{border-bottom:1px solid var(--line);}
.faq summary{
  display:flex;align-items:center;justify-content:space-between;gap:1rem;
  padding:1.15rem 0;cursor:pointer;list-style:none;
  font-family:"Jost",sans-serif;font-size:1.03rem;font-weight:400;
}
.faq summary::-webkit-details-marker{display:none;}
.faq summary .plus{color:var(--sage);font-size:1.3rem;line-height:1;transition:transform .25s var(--ease);}
.faq details[open] summary .plus{transform:rotate(45deg);}
.faq .a{padding:0 0 1.3rem;color:var(--stone);max-width:62ch;}

/* Tabelle */
.tbl{width:100%;border-collapse:collapse;font-size:.95rem;}
.tbl th,.tbl td{text-align:left;padding:.85rem 1rem;border-bottom:1px solid var(--line);}
.tbl th{font-size:.7rem;letter-spacing:.15em;text-transform:uppercase;color:var(--sage);font-weight:500;}
.tbl tr:last-child td{border-bottom:0;}
.tbl-wrap{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;}

/* Formular */
.field{display:flex;flex-direction:column;gap:.42rem;margin-bottom:1.05rem;}
.field label{font-size:.78rem;letter-spacing:.1em;text-transform:uppercase;color:var(--sage);}
input,select,textarea{
  width:100%;padding:.78rem .95rem;border:1px solid var(--line);border-radius:10px;
  background:var(--paper);color:var(--ink);font-size:.98rem;font-family:"Jost",sans-serif;
  transition:border-color .2s var(--ease),box-shadow .2s var(--ease);
}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--sage);box-shadow:0 0 0 3px var(--sage-tint);}
textarea{min-height:150px;resize:vertical;line-height:1.6;}
.f2{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,14rem),1fr));gap:0 1.05rem;}

/* CTA-Band */
.cta-band{background:var(--sage-deep);color:#fff;border-radius:var(--r);padding:clamp(2.2rem,5vw,3.6rem);}
.cta-band h2,.cta-band h3{color:#fff;}
.cta-band p{color:rgba(255,255,255,.78);}
.cta-band .eyebrow{color:rgba(255,255,255,.62);}
.cta-band .btn{border-color:rgba(255,255,255,.5);color:#fff;}
.cta-band .btn:hover{background:#fff;color:var(--sage-deep);border-color:#fff;}
.cta-band .btn.solid{background:#fff;color:var(--sage-deep);border-color:#fff;}
.cta-band .btn.solid:hover{background:rgba(255,255,255,.86);}

/* Brotkrumen */
.crumb{font-family:"Jost",sans-serif;font-size:.78rem;color:var(--stone);padding-top:1.6rem;}
.crumb a:hover{color:var(--sage-deep);}
.crumb span{opacity:.45;margin:0 .42rem;}

/* Fuß */
.site-footer{background:var(--paper);border-top:1px solid var(--line);padding-block:clamp(2.6rem,5vw,4rem) 2rem;}
.foot h5{font-size:.7rem;letter-spacing:.18em;text-transform:uppercase;color:var(--sage);margin:0 0 1rem;font-weight:500;}
.foot ul{list-style:none;margin:0;padding:0;}
.foot li{margin-bottom:.5rem;}
.foot a{font-size:.93rem;color:var(--stone);}
.foot a:hover{color:var(--sage-deep);}
.foot-bottom{margin-top:2.6rem;padding-top:1.5rem;border-top:1px solid var(--line-soft);display:flex;flex-wrap:wrap;gap:.6rem 1.5rem;align-items:center;font-size:.84rem;color:var(--stone);font-family:"Jost",sans-serif;}
.foot-bottom a:hover{color:var(--sage-deep);}
.foot-bottom .sep{margin-left:auto;}

/* Lightbox */
.lb{position:fixed;inset:0;background:rgba(22,30,25,.93);display:none;align-items:center;justify-content:center;z-index:200;padding:2rem;}
.lb.on{display:flex;}
.lb img{max-width:min(1100px,94vw);max-height:88vh;object-fit:contain;border-radius:8px;}
.lb button{position:absolute;top:1.3rem;right:1.5rem;width:44px;height:44px;border-radius:50%;border:1px solid rgba(255,255,255,.3);background:transparent;color:#fff;font-size:1.4rem;cursor:pointer;}

/* Auftritt */
.reveal{opacity:0;transform:translateY(14px);transition:opacity .7s var(--ease),transform .7s var(--ease);}
.reveal.in{opacity:1;transform:none;}

/* Platzhalterbild */
.ph{display:flex;align-items:center;justify-content:center;width:100%;height:100%;background:var(--sage-tint);color:var(--sage-soft);font-family:"Jost",sans-serif;font-size:.74rem;letter-spacing:.16em;text-transform:uppercase;text-align:center;padding:1rem;}


/* ------------------------------------------------- Ladeverhalten */
.defer{content-visibility:auto;contain-intrinsic-size:auto 700px;}
img{background:var(--sage-tint);}
.hero-fig img{background:none;}

/* -------------------------------------- CTA im eingeklappten Menü */
.navcta{display:none;}

/* ------------------------------------ Aktionsleiste am Handy unten */
.actionbar{
  display:none;position:fixed;left:0;right:0;bottom:0;z-index:80;
  gap:.6rem;padding:.7rem 1rem calc(.7rem + env(safe-area-inset-bottom));
  background:rgba(255,255,255,.94);backdrop-filter:saturate(1.4) blur(12px);
  border-top:1px solid var(--line);
}
.actionbar .btn{flex:1;min-height:46px;background:var(--paper);}
.actionbar .btn.solid{background:var(--sage);}

/* ---------------------------------------------------------- Responsiv */

/* Laptop / kleines Notebook */
@media (max-width:1180px){
  :root{--wrap:1040px;}
  .nav > a,.nav .has-sub > a{padding:.5rem .62rem;font-size:.87rem;}
  
  .band-item{grid-template-columns:minmax(0,1fr) 11rem;}
}

/* iPad quer */
@media (max-width:1024px){
  .hero-grid{gap:2.2rem;}
  .hbar{gap:1rem;}
  .btn{padding:.66rem 1.15rem;}
  .gallery{grid-template-columns:repeat(3,1fr);}
}

/* iPad hoch – ab hier Menü einklappen */
@media (max-width:900px){
  .menu-toggle{display:flex;}
  .nav{
    position:absolute;top:78px;left:0;right:0;flex-direction:column;align-items:stretch;
    background:var(--paper);border-bottom:1px solid var(--line);padding:.9rem 1.2rem 1.4rem;
    gap:.1rem;display:none;box-shadow:var(--shadow);max-height:calc(100dvh - 78px);overflow-y:auto;
  }
  .nav.open{display:flex;}
  .nav > a:not(.navcta), .nav .has-sub > a{padding:.82rem .4rem;font-size:1.02rem;min-height:44px;display:flex;align-items:center;}
  .nav a.on::after{display:none;}
  .has-sub{padding-bottom:0;margin-bottom:0;width:100%;}
  .subnav{position:static;transform:none;opacity:1;visibility:visible;box-shadow:none;border:0;background:transparent;padding:.1rem 0 .5rem 1rem;min-width:0;transition:none;}
  .subnav a{padding:.62rem .3rem;min-height:42px;}
  .subnav .alt{margin-left:.7rem;}
  .caret{display:none;}
  .navcta{display:inline-flex;margin:1rem 0 .2rem;width:auto;align-self:flex-start;}
  .langs{margin:.6rem 0 0;padding-top:.7rem;border-top:1px solid var(--line-soft);}
  .langs a{padding:.5rem .7rem;}
  .hero-grid{grid-template-columns:1fr;}
  .hero-fig{aspect-ratio:3/2;}
  .band-item{grid-template-columns:1fr;}
  .band-fig{order:-1;aspect-ratio:3/2;}
  .split{gap:2rem;}
}

/* Große Handys quer / kleine Tablets */
@media (max-width:720px){
  .hbar{height:66px;}
  .nav{top:66px;max-height:calc(100dvh - 66px);}
  .brand img{height:44px;}
  section{padding-block:clamp(2.6rem,8vw,3.6rem);}
  .band-row{grid-template-columns:3.6rem 1px minmax(0,1fr);gap:0 1rem;}
  .band-alt{font-size:.88rem;padding-top:1.5rem;}
  .band-alt small{font-size:.58rem;letter-spacing:.13em;}
  .band-item{padding:1.1rem 0 2rem;}
  .facts{grid-template-columns:1fr 1fr;}
  .cta-band .split{gap:1.4rem;}
  .cta-band .split > div:last-child{justify-content:flex-start!important;}
  .gallery{gap:.55rem;}
  .gallery{grid-template-columns:repeat(2,1fr);}
}

/* Handy hoch */
@media (max-width:520px){
  .actionbar{display:flex;}
  body{padding-bottom:4.6rem;}
  .site-footer{padding-bottom:1rem;}
  body{font-size:1.02rem;}
  h1{font-size:clamp(2rem,8.4vw,2.6rem);}
  .lead{font-size:1.04rem;}
  .wrap{padding-inline:1.1rem;}
  .hero{padding-block:1.6rem 2.2rem;}
  .hero-fig{aspect-ratio:5/4;}
  .hero-cta .btn{flex:1 1 100%;}
  .band-row{grid-template-columns:3.1rem 1px minmax(0,1fr);}
  .band-alt{font-size:.82rem;}
  .facts{grid-template-columns:1fr;}
  .fact{padding:1rem 1.1rem;}
  .grid{gap:.8rem;}
  .card{padding:1.35rem 1.25rem;}
  .foot-bottom{flex-direction:column;align-items:flex-start;gap:.45rem;}
  .foot-bottom .sep{display:none;}
  .press-list li{flex-direction:column;gap:.25rem;}
  .press-list .when{min-width:0;}
  .quote{padding:1.4rem 1.3rem;}
  .lb{padding:1rem;}
  .lb button{top:.6rem;right:.8rem;}
}

/* sehr schmale Geräte */
@media (max-width:380px){
  .wrap{padding-inline:.95rem;}
  .gallery{grid-template-columns:repeat(2,1fr);}
  .chip{font-size:.79rem;padding:.36rem .75rem;}
}

/* Querformat auf niedrigen Geräten */
@media (max-height:520px) and (orientation:landscape){
  .hero-fig{max-height:70vh;}
  .nav{max-height:calc(100dvh - 66px);}
}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important;}
  html{scroll-behavior:auto;}
  .reveal{opacity:1;transform:none;}
}
@media print{
  .site-header,.menu-toggle,.lb,.cta-band,.btn{display:none!important;}
  body{background:#fff;font-size:11pt;}
}
:focus-visible{outline:2px solid var(--sage);outline-offset:3px;border-radius:4px;}
.skip{position:absolute;left:-9999px;}
.skip:focus{left:1rem;top:1rem;z-index:100;background:var(--paper);padding:.7rem 1.1rem;border-radius:8px;border:1px solid var(--sage);}


/* ==== Karte (wird erst auf Klick geladen – es fließen vorher keine Daten) ==== */
.mapbox{position:relative;border-radius:var(--r);overflow:hidden;border:1px solid var(--line);background:var(--sage-tint);aspect-ratio:16/9;}
.mapbox iframe{width:100%;height:100%;border:0;display:block;}
.mapbox .mapstart{
  position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:.9rem;text-align:center;padding:1.6rem;background:
    linear-gradient(135deg,var(--sage-tint) 0%,var(--lake-tint) 100%);
  cursor:pointer;border:0;width:100%;font-family:"Jost",sans-serif;color:var(--ink);
}
.mapbox .mapstart svg{width:34px;height:34px;color:var(--sage);}
.mapbox .mapstart b{font-weight:400;font-size:1.02rem;}
.mapbox .mapstart small{color:var(--stone);font-size:.85rem;max-width:44ch;line-height:1.5;}
.mapbox .mapstart .btn{margin-top:.2rem;pointer-events:none;}
.map-meta{display:flex;flex-wrap:wrap;gap:.6rem 1.4rem;margin-top:.9rem;font-family:"Jost",sans-serif;font-size:.86rem;color:var(--stone);}
.map-meta a{color:var(--sage-deep);border-bottom:1px solid rgba(95,123,106,.35);}
.map-meta a:hover{border-color:var(--sage);}

/* ==== Sehenswürdigkeiten: Liste mit Entfernungsband ==== */
.sights{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,17.5rem),1fr));gap:.9rem;}
.sight{background:var(--paper);border:1px solid var(--line);border-radius:14px;padding:1.25rem 1.3rem;transition:border-color .25s var(--ease);}
.sight:hover{border-color:var(--sage-soft);}
.sight .band{display:inline-block;font-family:"Jost",sans-serif;font-size:.66rem;letter-spacing:.14em;text-transform:uppercase;color:var(--sage);border:1px solid var(--sage-soft);border-radius:999px;padding:.2rem .6rem;margin-bottom:.75rem;}
.sight h4{font-size:1.04rem;margin-bottom:.4rem;}
.sight p{margin:0;font-size:.94rem;color:var(--stone);}
.filterbar{display:flex;flex-wrap:wrap;gap:.5rem;margin:1.6rem 0 1.8rem;}
.filterbar button{
  font-family:"Jost",sans-serif;font-size:.84rem;letter-spacing:.02em;padding:.45rem 1rem;
  border:1px solid var(--line);border-radius:999px;background:var(--paper);color:var(--ink);cursor:pointer;
  transition:border-color .2s var(--ease),background .2s var(--ease),color .2s var(--ease);
}
.filterbar button:hover{border-color:var(--sage-soft);}
.filterbar button[aria-pressed="true"]{background:var(--sage);border-color:var(--sage);color:#fff;}

/* ==== Orte in der Umgebung ==== */
.places{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,15rem),1fr));gap:.7rem;}
.place{border:1px solid var(--line);border-radius:12px;padding:.95rem 1.1rem;background:var(--paper);}
.place b{display:block;font-family:"Jost",sans-serif;font-weight:400;font-size:.97rem;margin-bottom:.2rem;}
.place span{font-size:.88rem;color:var(--stone);}

/* ==== Jahreszeiten-Umschalter ==== */
.seasons{display:flex;gap:.5rem;margin-bottom:1.6rem;}
.seasons button{
  font-family:"Jost",sans-serif;font-size:.9rem;padding:.55rem 1.3rem;border:1px solid var(--line);
  border-radius:999px;background:var(--paper);color:var(--ink);cursor:pointer;transition:all .2s var(--ease);
}
.seasons button[aria-selected="true"]{background:var(--sage);border-color:var(--sage);color:#fff;}
.season-panel[hidden]{display:none;}

/* ==== Unterkunftsfinder ==== */
.finder{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);padding:clamp(1.5rem,3vw,2.2rem);}
.finder fieldset{border:0;padding:0;margin:0 0 1.5rem;}
.finder legend{
  font-family:"Jost",sans-serif;font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;
  color:var(--sage);margin-bottom:.85rem;padding:0;
}
.opts{display:flex;flex-wrap:wrap;gap:.55rem;}
.opts label{
  font-family:"Jost",sans-serif;font-size:.92rem;padding:.55rem 1.1rem;border:1px solid var(--line);
  border-radius:999px;background:var(--mist);cursor:pointer;transition:all .2s var(--ease);user-select:none;
}
.opts input{position:absolute;opacity:0;width:0;height:0;}
.opts label:hover{border-color:var(--sage-soft);}
.opts input:checked + span,.opts label.sel{background:var(--sage);border-color:var(--sage);color:#fff;}
.opts label:has(input:checked){background:var(--sage);border-color:var(--sage);color:#fff;}
.opts label:has(input:focus-visible){outline:2px solid var(--sage);outline-offset:2px;}
.results{margin-top:1.8rem;display:grid;gap:.9rem;}
.res{
  display:grid;grid-template-columns:minmax(0,1fr) auto;gap:1rem;align-items:center;
  border:1px solid var(--line);border-radius:14px;padding:1.2rem 1.35rem;background:var(--paper);
}
.res .meta{font-family:"Jost",sans-serif;font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--sage);margin-bottom:.35rem;}
.res h4{margin:0 0 .35rem;font-size:1.08rem;}
.res p{margin:0;font-size:.93rem;color:var(--stone);}
.res .why{margin-top:.55rem;font-size:.85rem;color:var(--sage-deep);}
.res-empty{border:1px dashed var(--line);border-radius:14px;padding:1.5rem;color:var(--stone);text-align:center;}

/* ==== FAQ mit Suche ==== */
.faq-search{position:relative;margin-bottom:2rem;}
.faq-search input{padding-left:2.6rem;}
.faq-search svg{position:absolute;left:.95rem;top:50%;transform:translateY(-50%);width:17px;height:17px;color:var(--sage);pointer-events:none;}
.faq-group{margin-bottom:2.6rem;}
.faq-group h3{font-size:1.3rem;margin-bottom:.2rem;}
.faq-group[hidden]{display:none;}
.faq-jump{display:flex;flex-wrap:wrap;gap:.45rem;margin-bottom:2.4rem;}
.faq-jump a{
  font-family:"Jost",sans-serif;font-size:.82rem;padding:.4rem .9rem;border:1px solid var(--line);
  border-radius:999px;color:var(--stone);transition:all .2s var(--ease);
}
.faq-jump a:hover{border-color:var(--sage);color:var(--sage-deep);background:var(--sage-tint);}
.faq details[hidden]{display:none;}

/* ==== Sprungmarken innerhalb einer Standortseite ==== */
.pagenav{
  position:sticky;top:0;z-index:40;background:rgba(242,244,241,.92);backdrop-filter:blur(8px);
  border-bottom:1px solid var(--line);margin-bottom:0;
}
.pagenav ul{display:flex;gap:.2rem;list-style:none;margin:0;padding:.55rem 0;overflow-x:auto;scrollbar-width:none;}
.pagenav ul::-webkit-scrollbar{display:none;}
.pagenav a{
  display:block;white-space:nowrap;font-family:"Jost",sans-serif;font-size:.85rem;
  padding:.42rem .85rem;border-radius:999px;color:var(--stone);
}
.pagenav a:hover{background:var(--sage-tint);color:var(--sage-deep);}
[id]{scroll-margin-top:5.5rem;}

@media (max-width:720px){
  .res{grid-template-columns:1fr;}
  .mapbox{aspect-ratio:4/3;}
}
@media (max-width:520px){
  .sights{grid-template-columns:1fr;}
  .mapbox{aspect-ratio:1/1;}
}


/* =====================================================================
   Nachtrag 27.07.2026 — Handy, iPad und Bedienung per Finger
   Alles darunter ergänzt die Regeln oben, es wurde nichts entfernt.
   ===================================================================== */

/* --- 1. Nichts ragt seitlich hinaus -------------------------------- */
html,body{overflow-x:clip;}
@supports not (overflow:clip){html,body{overflow-x:hidden;}}
h1,h2,h3,h4,p,li,dd,dt,figcaption,summary,td,th{overflow-wrap:break-word;}
h1,h2,h3{text-wrap:balance;}
.lead,p{text-wrap:pretty;}
a[href^="mailto:"],a[href^="tel:"],.long{overflow-wrap:anywhere;}
table,iframe,video,pre{max-width:100%;}

/* --- 2. Rand bei Geräten mit runden Ecken (iPhone im Querformat) ---- */
.wrap{
  padding-left:max(clamp(1.15rem,4vw,2.5rem),env(safe-area-inset-left));
  padding-right:max(clamp(1.15rem,4vw,2.5rem),env(safe-area-inset-right));
}

/* --- 3. Eingabefelder: iOS zoomt unter 16 px hinein ---------------- */
@media (pointer:coarse){
  input,select,textarea{font-size:16px;}
  .btn,.seasons button,.opts label,.faq-jump a,.pagenav a,.menu-toggle{min-height:44px;}
  .seasons button,.opts label,.faq-jump a{display:inline-flex;align-items:center;}
  .langs a{padding:.55rem .8rem;}
  .foot a{padding-block:.15rem;}
  a,button,label,summary{-webkit-tap-highlight-color:rgba(95,123,106,.14);}
}

/* --- 4. Kein hängendes Ausklappmenü auf Tablets -------------------- */
@media (hover:none){
  .has-sub:hover .subnav{opacity:0;visibility:hidden;}
  .has-sub:focus-within .subnav{opacity:1;visibility:visible;}
  .btn:hover{background:transparent;color:var(--sage-deep);}
  .btn.solid:hover{background:var(--sage);border-color:var(--sage);color:#fff;}
  .btn.plain:hover{background:transparent;border-color:var(--line);color:var(--ink);}
}

/* --- 5. iPad hochkant: Menü einklappen (bis 1024 px) --------------- */
@media (min-width:901px) and (max-width:1024px){
  .menu-toggle{display:flex;}
  .nav{
    position:absolute;top:78px;left:0;right:0;flex-direction:column;align-items:stretch;
    background:var(--paper);border-bottom:1px solid var(--line);padding:.9rem 1.2rem 1.4rem;
    gap:.1rem;display:none;box-shadow:var(--shadow);max-height:calc(100dvh - 78px);overflow-y:auto;
  }
  .nav.open{display:flex;}
  .nav > a:not(.navcta), .nav .has-sub > a{padding:.82rem .4rem;font-size:1.02rem;min-height:44px;display:flex;align-items:center;}
  .nav a.on::after{display:none;}
  .has-sub{padding-bottom:0;margin-bottom:0;width:100%;}
  .subnav{position:static;transform:none;opacity:1;visibility:visible;box-shadow:none;border:0;
          background:transparent;padding:.1rem 0 .5rem 1rem;min-width:0;transition:none;}
  .subnav a{padding:.62rem .3rem;min-height:44px;}
  .caret{display:none;}
  .navcta{display:inline-flex;margin:1rem 0 .2rem;width:auto;align-self:flex-start;}
  .langs{margin:.6rem 0 0;padding-top:.7rem;border-top:1px solid var(--line-soft);}
}

/* --- 6. iPad: Raster und Abstände --------------------------------- */
@media (min-width:721px) and (max-width:1024px){
  .gallery{grid-template-columns:repeat(3,1fr);}
  .facts{grid-template-columns:repeat(2,1fr);}
  .hero-fig{aspect-ratio:3/2;}
}

/* --- 7. Sprungleiste klebt unter der Kopfzeile, nicht dahinter ----- */
.pagenav{top:78px;}
.pagenav ul{overscroll-behavior-x:contain;scroll-snap-type:x proximity;
  padding-left:env(safe-area-inset-left);padding-right:env(safe-area-inset-right);}
.pagenav li{scroll-snap-align:start;}
@media (max-width:720px){.pagenav{top:66px;}}
[id]{scroll-margin-top:8.5rem;}
@media (max-width:720px){[id]{scroll-margin-top:7.5rem;}}

/* --- 8. Untere Aktionsleiste: Platz für die iPhone-Home-Anzeige ---- */
@media (max-width:520px){
  body{padding-bottom:calc(4.6rem + env(safe-area-inset-bottom));}
  .actionbar .btn{min-height:48px;font-size:.95rem;}
}

/* --- 9. Bilder: ruhiger Platzhalter, kein Springen beim Laden ------ */
.gallery img,.hero-fig img,.band-fig img,figure img{background-color:var(--sage-tint);}
.gallery a{display:block;border-radius:10px;overflow:hidden;}
.gallery img{aspect-ratio:3/2;object-fit:cover;width:100%;height:auto;}

/* --- 10. Großansicht auf dem Handy -------------------------------- */
.lb img{max-height:calc(100dvh - 6rem);}
.lb button{min-width:44px;min-height:44px;}
@media (max-width:520px){
  .lb{padding:.8rem;}
  .lb img{max-width:100%;max-height:calc(100dvh - 7rem);}
}

/* --- 11. Sehr breite Bildschirme ---------------------------------- */
@media (min-width:1600px){
  :root{--wrap:1280px;}
}


/* =====================================================================
   Schwebende Knöpfe, Social-Leiste — 27.07.2026
   ===================================================================== */
.floaters{
  position:fixed;right:clamp(.9rem,2vw,1.6rem);z-index:90;
  bottom:calc(clamp(.9rem,2vw,1.6rem) + env(safe-area-inset-bottom));
  display:flex;flex-direction:column-reverse;gap:.6rem;
  /* column-reverse: WhatsApp bleibt unten verankert, der Pfeil
     nach oben erscheint beim Scrollen darüber. */
}
.float-btn{
  width:52px;height:52px;border-radius:50%;border:1px solid var(--line);
  display:flex;align-items:center;justify-content:center;cursor:pointer;
  background:var(--paper);color:var(--sage-deep);box-shadow:var(--shadow);
  transition:transform .2s var(--ease),background .2s var(--ease),color .2s var(--ease);
}
.float-btn svg{width:24px;height:24px;}
.float-btn:hover{transform:translateY(-2px);}
.float-wa{background:#25D366;border-color:#25D366;color:#fff;}
.float-wa:hover{background:#1DA851;border-color:#1DA851;}
.float-top{opacity:0;visibility:hidden;transform:translateY(8px);}
.float-top.on{opacity:1;visibility:visible;transform:none;}
@media (max-width:520px){
  /* unten läuft schon die Aktionsleiste mit Anrufen und WhatsApp */
  .float-wa{display:none;}
  .floaters{bottom:calc(5.4rem + env(safe-area-inset-bottom));right:.9rem;}
  .float-btn{width:46px;height:46px;}
}
@media print{.floaters{display:none!important;}}

.soc-list{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:.5rem;}
.soc-list a{
  display:inline-flex;align-items:center;gap:.45rem;padding:.45rem .8rem;
  border:1px solid var(--line);border-radius:999px;font-family:"Jost",sans-serif;
  font-size:.82rem;color:var(--stone);transition:all .2s var(--ease);min-height:38px;
}
.soc-list a:hover{border-color:var(--sage);color:var(--sage-deep);background:var(--sage-tint);}
.soc-list svg{width:16px;height:16px;flex-shrink:0;}
.soc-hint{margin-top:.75rem;font-size:.76rem;line-height:1.5;color:var(--stone);font-family:"Jost",sans-serif;}
@media (max-width:520px){.soc-list a span{display:inline;}}





/* --- Schlusszeile: alles auf einer Zeile ---------------------------- */
.foot-bottom{
  display:flex;align-items:center;flex-wrap:wrap;gap:.55rem 1.1rem;
}
.soc-ico-row{display:inline-flex;align-items:center;gap:.4rem;}
.soc-ico{
  width:34px;height:34px;border-radius:50%;border:1px solid var(--line);
  display:inline-flex;align-items:center;justify-content:center;color:var(--stone);
  transition:color .2s var(--ease),border-color .2s var(--ease),background .2s var(--ease);
}
.soc-ico svg{width:17px;height:17px;}
.soc-ico:hover{color:var(--sage-deep);border-color:var(--sage);background:var(--sage-tint);}
.foot-bottom .made{margin-left:auto;color:var(--stone);}
.foot-bottom .made a{color:var(--stone);text-decoration:underline;text-underline-offset:3px;}
.foot-bottom .made a:hover{color:var(--sage-deep);}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;}
@media (max-width:720px){
  .foot-bottom{gap:.4rem .7rem;}
}
@media (pointer:coarse){.soc-ico{width:44px;height:44px;}.soc-ico svg{width:19px;height:19px;}}


/* --- Eingeklapptes Menü: Untermenü erst auf Tippen -------------------- */
@media (max-width:1024px){
  .nav .has-sub .subnav{display:none;}
  .nav .has-sub.sub-open .subnav{display:block;}
  .nav .has-sub > a::after{
    content:"+";float:right;font-size:1.1rem;line-height:1;color:var(--stone);
    transition:transform .2s var(--ease);
  }
  .nav .has-sub.sub-open > a::after{content:"–";}
}

/* --- Schlusszeile am Handy: sauber zentriert statt gequetscht -------- */
@media (max-width:600px){
  .foot-bottom{flex-direction:row;justify-content:space-between;align-items:center;flex-wrap:nowrap;gap:.6rem;font-size:.72rem;}
  .foot-bottom > span{flex:0 1 auto;white-space:nowrap;}
  .foot-bottom .made{margin-left:0;text-align:right;}
}


/* =====================================================================
   Unterkunftsfinder — Ergebnisse mit Bild
   ===================================================================== */
.res{
  grid-template-columns:9.5rem minmax(0,1fr) auto;
  gap:1.25rem;padding:1rem 1.35rem 1rem 1rem;
  transition:border-color .2s var(--ease),box-shadow .2s var(--ease);
}
.res:hover{border-color:var(--sage);box-shadow:var(--shadow);}
.res-img{display:block;border-radius:10px;overflow:hidden;background:var(--sage-tint);}
.res-img img{width:100%;height:100%;aspect-ratio:3/2;object-fit:cover;display:block;}
.res-body{min-width:0;}
.res-cta{white-space:nowrap;align-self:center;}
@media (max-width:760px){
  .res{grid-template-columns:5.5rem minmax(0,1fr);gap:.9rem;padding:.9rem;}
  .res-cta{grid-column:1 / -1;justify-self:start;margin-top:.2rem;}
}
@media (max-width:420px){
  .res{grid-template-columns:1fr;}
  .res-img img{aspect-ratio:16/9;}
}

/* Filterfelder etwas ruhiger */
.finder legend{margin-bottom:.7rem;}
.opts label{transition:all .18s var(--ease);}
.opts label:has(input:checked){background:var(--sage);border-color:var(--sage);color:#fff;}


/* =====================================================================
   Typografie — damit lange deutsche Wörter auf jedem Format sitzen
   ===================================================================== */
/* Silbentrennung: „Ferienwohnungen" bricht sonst mitten im Wort um */
p,li,dd,.lead,.a,figcaption,.res p,.card p,.sight p{
  hyphens:auto;-webkit-hyphens:auto;hyphenate-limit-chars:8 4 4;
}
h1,h2,h3{hyphens:manual;-webkit-hyphens:manual;}
@media (max-width:520px){
  h1,h2{hyphens:auto;-webkit-hyphens:auto;hyphenate-limit-chars:10 5 4;}
  h1{letter-spacing:-.02em;}
}

/* Zeilenlänge: unter 75 Zeichen bleibt lesbar */
.wrap > p,section p:not(.meta):not(.why):not(.soc-hint){max-width:74ch;}
.card p,.sight p,.res p,.a{max-width:none;}

/* Überschriften sollen nicht als einzelnes Wort umbrechen */
h1,h2,h3{text-wrap:balance;}
.lead{text-wrap:pretty;max-width:60ch;}

/* Zahlen und Maßangaben nicht trennen */
.meta,.eyebrow,.band-alt,.stat-k{hyphens:none;-webkit-hyphens:none;}

/* Sehr schmale Geräte: etwas kleinere Grundschrift, mehr Zeilenabstand */
@media (max-width:360px){
  body{font-size:1.0125rem;line-height:1.78;}
  h1{font-size:clamp(2rem,9vw,2.4rem);}
  h2{font-size:clamp(1.55rem,7vw,1.8rem);}
}


/* =====================================================================
   Fußbereich — Logo, Text, Symbole, eine Linkzeile
   ===================================================================== */
.foot-top{max-width:44rem;}
.foot-top p{color:var(--stone);font-size:.95rem;line-height:1.75;margin:0 0 1.2rem;max-width:52ch;}
.foot-top .soc-ico-row{gap:.5rem;}


.foot-bottom{margin-top:1.6rem;padding-top:1.3rem;justify-content:space-between;}
@media (max-width:600px){.foot-bottom{justify-content:space-between;}}

/* =====================================================================
   Unterkunftsfinder — Suchfeld links, Ergebnisse rechts
   ===================================================================== */
.finder-layout{
  display:grid;grid-template-columns:20.5rem minmax(0,1fr);
  gap:clamp(1.4rem,3vw,2.4rem);align-items:start;
}
.finder-col{position:sticky;top:6.5rem;}
.finder{padding:1.4rem 1.35rem 1.2rem;}
.finder-head{
  display:flex;align-items:baseline;justify-content:space-between;gap:1rem;
  padding-bottom:.9rem;margin-bottom:1.2rem;border-bottom:1px solid var(--line-soft);
}
.finder-head h2{
  margin:0;font-size:.78rem;letter-spacing:.16em;text-transform:uppercase;
  font-family:"Jost",sans-serif;font-weight:500;color:var(--sage-deep);
}
.finder-reset{
  border:0;background:none;padding:0;cursor:pointer;color:var(--stone);
  font-family:"Jost",sans-serif;font-size:.8rem;text-decoration:underline;
  text-underline-offset:3px;transition:color .2s var(--ease);
}
.finder-reset:hover{color:var(--sage-deep);}
.finder fieldset{margin-bottom:1.15rem;}
.finder fieldset:last-of-type{margin-bottom:.4rem;}
.finder-hint{
  margin:.9rem 0 0;padding-top:.85rem;border-top:1px solid var(--line-soft);
  font-family:"Jost",sans-serif;font-size:.78rem;color:var(--stone);
}
.results{display:grid;gap:.8rem;}

@media (max-width:1024px){
  .finder-layout{grid-template-columns:1fr;}
  .finder-col{position:static;}
  .finder .opts{gap:.4rem;}
}


/* =====================================================================
   Fußbereich — ein Block: Marke links, vier Linkspalten rechts
   ===================================================================== */
.foot-block{
  display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,2.1fr);
  gap:clamp(1.8rem,4vw,3.4rem);align-items:start;
}
.foot-top img{width:clamp(118px,12vw,150px);height:auto;margin-bottom:1rem;display:block;}
.foot-top p{color:var(--stone);font-size:.92rem;line-height:1.72;margin:0 0 1.1rem;max-width:40ch;}
.foot-top .soc-ico-row{gap:.5rem;}

.foot-cols{
  display:grid;grid-template-columns:repeat(4,minmax(0,1fr));
  gap:1.6rem clamp(.9rem,2vw,1.9rem);
  align-items:start;align-content:start;
}
.foot-cols > div{min-width:0;}
.foot-cols h5{
  font-family:"Jost",sans-serif;font-size:.72rem;letter-spacing:.14em;
  text-transform:uppercase;color:var(--sage-deep);font-weight:500;margin:0 0 .8rem;
}
.foot-cols ul{list-style:none;margin:0;padding:0;display:grid;gap:.5rem;}
.foot-cols a{
  color:var(--stone);font-family:"Jost",sans-serif;font-size:.87rem;
  display:inline-flex;align-items:baseline;gap:.25rem;line-height:1.35;
}
.foot-cols a:hover{color:var(--sage-deep);}
.foot-cols .exti{width:10px;height:10px;opacity:.5;flex:none;align-self:center;}

@media (max-width:1024px){
  .foot-block{grid-template-columns:1fr;gap:2.2rem;}
  .foot-top p{max-width:56ch;}
}
@media (max-width:620px){
  /* vier schmale Spalten wären unter 620 px nicht mehr lesbar */
  .foot-cols{grid-template-columns:repeat(2,minmax(0,1fr));gap:1.4rem 1rem;}
  .foot-cols a{font-size:.83rem;}
}

.foot-bottom{margin-top:clamp(2rem,4vw,3rem);padding-top:1.3rem;justify-content:space-between;}
@media (max-width:600px){.foot-bottom{justify-content:space-between;}}

/* Suchbox: Zähler */
.finder-count{
  margin:.2rem 0 0;font-family:"Jost",sans-serif;font-size:.78rem;
  color:var(--stone);transition:color .2s var(--ease);
}
.finder-count.on{color:var(--sage-deep);}


/* =====================================================================
   Kopfbild auf den Unterseiten
   ===================================================================== */
.page-hero{
  margin:0 0 clamp(1.6rem,4vw,2.8rem);border-radius:var(--r);overflow:hidden;
  background:var(--sage-tint);
}
.page-hero img{width:100%;height:auto;display:block;aspect-ratio:1600/620;object-fit:cover;}
@media (max-width:620px){.page-hero img{aspect-ratio:3/2;}}

/* =====================================================================
   Regionenwahl — vier Karten in einer Zeile
   ===================================================================== */
.picks{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(.7rem,1.6vw,1.1rem);}
.pick{
  display:flex;flex-direction:column;justify-content:space-between;gap:1.2rem;
  background:var(--paper);border:1px solid var(--line);border-radius:var(--r);
  padding:1.5rem 1.35rem;min-height:12rem;
  transition:border-color .25s var(--ease),transform .25s var(--ease),box-shadow .25s var(--ease);
}
.pick:hover{border-color:var(--sage);transform:translateY(-3px);box-shadow:var(--shadow);}
.pick p{margin:0;font-size:.95rem;line-height:1.6;color:var(--stone);}
.pick-name{
  font-family:"Newsreader",serif;font-size:1.22rem;color:var(--ink);line-height:1.2;
  display:flex;align-items:baseline;justify-content:space-between;gap:.6rem;
}
.pick-alt{
  font-family:"Jost",sans-serif;font-size:.7rem;letter-spacing:.1em;
  color:var(--sage);flex:none;
}
@media (max-width:900px){.picks{grid-template-columns:repeat(2,minmax(0,1fr));}}
@media (max-width:520px){.picks{grid-template-columns:1fr;}.pick{min-height:0;gap:.9rem;}}

/* =====================================================================
   Kontakt — vier Wege gleich oben
   ===================================================================== */
.contact-cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(.7rem,1.6vw,1.1rem);}
.ccard{
  display:flex;flex-direction:column;gap:.35rem;
  background:var(--paper);border:1px solid var(--line);border-radius:var(--r);
  padding:1.5rem 1.35rem;
  transition:border-color .25s var(--ease),transform .25s var(--ease),box-shadow .25s var(--ease);
}
.ccard:hover{border-color:var(--sage);transform:translateY(-3px);box-shadow:var(--shadow);}
.ccard-ico{
  width:40px;height:40px;border-radius:50%;background:var(--sage-tint);color:var(--sage-deep);
  display:flex;align-items:center;justify-content:center;margin-bottom:.7rem;
}
.ccard-ico svg{width:20px;height:20px;}
.ccard-k{
  font-family:"Jost",sans-serif;font-size:.7rem;letter-spacing:.14em;
  text-transform:uppercase;color:var(--sage);
}
.ccard-v{font-family:"Newsreader",serif;font-size:1.1rem;color:var(--ink);line-height:1.3;}
.ccard-v.long{font-size:.95rem;overflow-wrap:anywhere;}
.ccard-n{font-size:.85rem;color:var(--stone);line-height:1.55;margin-top:.3rem;}
@media (max-width:900px){.contact-cards{grid-template-columns:repeat(2,minmax(0,1fr));}}
@media (max-width:460px){.contact-cards{grid-template-columns:1fr;}}

/* =====================================================================
   Unterkunftsfinder — Ergebnisse als Bildkarten
   ===================================================================== */
.results{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(.8rem,1.8vw,1.2rem);}
.res{
  display:flex;flex-direction:column;background:var(--paper);
  border:1px solid var(--line);border-radius:var(--r);overflow:hidden;
  transition:border-color .25s var(--ease),transform .25s var(--ease),box-shadow .25s var(--ease);
}
.res:hover{border-color:var(--sage);transform:translateY(-3px);box-shadow:var(--shadow);}
.res-img{display:block;background:var(--sage-tint);}
.res-img img{width:100%;height:auto;display:block;aspect-ratio:3/2;object-fit:cover;}
.res-body{display:flex;flex-direction:column;gap:.35rem;padding:1.2rem 1.3rem 1.35rem;}
.res .meta{
  font-family:"Jost",sans-serif;font-size:.7rem;letter-spacing:.14em;
  text-transform:uppercase;color:var(--sage);
}
.res-h{font-family:"Newsreader",serif;font-size:1.16rem;color:var(--ink);line-height:1.25;}
.res-t{font-size:.9rem;color:var(--stone);line-height:1.6;}
.res .why{
  font-family:"Jost",sans-serif;font-size:.8rem;color:var(--sage-deep);
  background:var(--sage-tint);border-radius:8px;padding:.4rem .6rem;margin-top:.3rem;
}
.res-more{
  font-family:"Jost",sans-serif;font-size:.85rem;color:var(--sage-deep);margin-top:.6rem;
}
.res-more::after{content:" →";}
.res-empty{border:1px dashed var(--line);border-radius:14px;padding:1.5rem;color:var(--stone);text-align:center;grid-column:1/-1;}
.results > .meta{grid-column:1/-1;}
@media (max-width:1280px){.results{grid-template-columns:1fr;}}
@media (min-width:1281px){.finder-col{position:sticky;top:6.5rem;}}
@media (max-width:1024px){.results{grid-template-columns:repeat(2,minmax(0,1fr));}}
@media (max-width:620px){.results{grid-template-columns:1fr;}}


/* =====================================================================
   Kopfbereich der Unterseiten — Bild über die volle Breite, Text darüber
   ===================================================================== */
.phero{
  position:relative;isolation:isolate;
  min-height:clamp(20rem,42vw,30rem);
  display:flex;align-items:flex-end;
  padding-block:clamp(2.4rem,6vw,4.5rem);
  margin-bottom:clamp(2rem,4vw,3.2rem);
  overflow:hidden;background:var(--sage-deep);
}
.phero.compact{min-height:clamp(13rem,24vw,17rem);}
.phero-img{
  position:absolute;inset:0;width:100%;height:100%;
  object-fit:cover;object-position:50% 60%;z-index:-2;
}
.phero-scrim{
  position:absolute;inset:0;z-index:-1;
  background:linear-gradient(180deg,
    rgba(24,34,28,.30) 0%,
    rgba(24,34,28,.34) 38%,
    rgba(24,34,28,.66) 72%,
    rgba(24,34,28,.82) 100%);
}
.phero-in{position:relative;width:100%;}
.phero .crumb{margin-bottom:clamp(1.2rem,3vw,2rem);color:rgba(255,255,255,.72);}
.phero .crumb a{color:rgba(255,255,255,.72);}
.phero .crumb a:hover{color:#fff;}
.phero .crumb span{color:rgba(255,255,255,.45);}
.phero .eyebrow{color:rgba(255,255,255,.85);}
.phero h1{color:#fff;margin-bottom:.5em;text-shadow:0 1px 30px rgba(16,24,19,.35);}
.phero .lead{color:rgba(255,255,255,.92);}
.phero p{color:rgba(255,255,255,.92);}
.phero .chips .chip,.phero .chip{
  background:rgba(255,255,255,.14);border-color:rgba(255,255,255,.3);color:#fff;
  backdrop-filter:blur(6px);
}
.phero .chip svg{color:rgba(255,255,255,.85);}
.phero .btn{border-color:rgba(255,255,255,.45);color:#fff;}
.phero .btn:hover{background:rgba(255,255,255,.14);border-color:#fff;color:#fff;}
.phero .btn.solid{background:var(--sage);border-color:var(--sage);color:#fff;}
.phero .btn.solid:hover{background:#fff;border-color:#fff;color:var(--sage-deep);}
.phero .meta,.phero .band-alt{color:rgba(255,255,255,.75);}

@media (max-width:720px){
  .phero{min-height:clamp(17rem,58vw,23rem);padding-block:2rem;}
  .phero.compact{min-height:11rem;}
  .phero-img{object-position:50% 55%;}
  .phero-scrim{background:linear-gradient(180deg,
    rgba(24,34,28,.34) 0%, rgba(24,34,28,.42) 30%,
    rgba(24,34,28,.72) 70%, rgba(24,34,28,.86) 100%);}
}
@media (prefers-reduced-motion:no-preference){
  .phero-img{transition:none;}
}

/* Die Brotkrume darunter nicht doppelt anzeigen */
.phero + .wrap > .crumb{display:none;}






/* =====================================================================
   Wohnungsblöcke — einer unter dem anderen, Bilder als Streifen
   ===================================================================== */
.units{display:grid;grid-template-columns:minmax(0,1fr);gap:clamp(1rem,2vw,1.5rem);}
.units > *{min-width:0;}
.units .card{padding:clamp(1.4rem,2.6vw,2rem);}
.units .card > h4{font-size:1.24rem;margin-bottom:.6rem;}
.units .card > p{max-width:64ch;}
.units .ticks{columns:2;column-gap:2rem;}
.units .ticks li{break-inside:avoid;}
@media (max-width:620px){.units .ticks{columns:1;}}


.unit-gallery{
  min-width:0;margin-top:1.3rem;padding-top:1rem;border-top:1px solid var(--line-soft);
}
.unit-gallery h5{
  font-family:"Jost",sans-serif;font-size:.72rem;letter-spacing:.14em;
  text-transform:uppercase;color:var(--stone);margin:0 0 .75rem;font-weight:500;
  display:flex;align-items:center;gap:.55rem;
}
.strip-hint{
  font-size:.68rem;letter-spacing:.06em;color:var(--sage-deep);
  background:var(--sage-tint);border-radius:999px;padding:.12rem .5rem;
}




/* Offene FAQ-Antworten: Hinweis, wo die genaue Angabe steht */
.a-more{display:block;margin-top:.55rem;font-size:.9rem;color:var(--sage-deep);}
.a-more a{text-decoration:underline;text-underline-offset:3px;}


/* Bildband im Seiteninhalt */
.band-img{margin:clamp(2rem,4vw,3rem) 0;}
.band-img img{
  width:100%;height:auto;display:block;border-radius:var(--r);
  aspect-ratio:2000/900;object-fit:cover;background:var(--sage-tint);
}
.band-img figcaption{
  margin-top:.8rem;font-size:.86rem;color:var(--stone);
  font-family:"Jost",sans-serif;max-width:58ch;
}
@media (max-width:620px){.band-img img{aspect-ratio:3/2;}}


/* Kopfzeile auf sehr schmalen Geräten: Knopf kleiner, Logo behält seine Größe */
@media (max-width:380px){
  .site-header .btn.solid:not(.navcta){padding:.6rem .9rem;font-size:.82rem;}
  .brand img{height:40px;}
}


/* Schlusszeile ganz schmal: kleiner setzen statt umbrechen */
@media (max-width:360px){
  .foot-bottom{font-size:.68rem;gap:.4rem;}
}


/* Bilder je Wohnung — alle neun untereinander, kein Schieben */
.unit-grid{
  display:grid;grid-template-columns:repeat(3,minmax(0,1fr));
  gap:.6rem;margin:0;overflow:visible;
}
.unit-grid a{display:block;border-radius:10px;overflow:hidden;background:var(--sage-tint);}
.unit-grid img{
  width:100%;height:auto;display:block;aspect-ratio:3/2;object-fit:cover;
  border-radius:10px;transition:transform .4s var(--ease);
}
.unit-grid a:hover img{transform:scale(1.03);}
@media (max-width:900px){.unit-grid{grid-template-columns:repeat(2,minmax(0,1fr));}}
@media (max-width:620px){.unit-grid{grid-template-columns:1fr;gap:.7rem;}}


/* =====================================================================
   Absicherung Untermenue am Handy
   Falls eine aeltere Regel noch mitspricht, sollen die Links im
   offenen Untermenue trotzdem sichtbar sein — kein weisser Bereich.
   ===================================================================== */
@media (max-width:1024px){
  .nav .has-sub.sub-open .subnav{
    display:block;opacity:1;visibility:visible;position:static;
    transform:none;pointer-events:auto;max-height:none;overflow:visible;
  }
  .nav .has-sub.sub-open .subnav a{
    display:flex;align-items:center;justify-content:space-between;
    opacity:1;visibility:visible;color:var(--ink);
    min-height:44px;padding:.62rem .3rem;font-size:.98rem;
  }
  .nav .has-sub.sub-open .subnav a .alt{color:var(--sage);opacity:1;}
  /* Ohne offenes Untermenue darf auch kein Platz reserviert werden */
  .nav .has-sub:not(.sub-open) .subnav{display:none;}
}