/* BASICFLOOR — Das Wesentliche. Schön gemacht.
   Papier, Tinte, ein Punkt Rot. Geist + Geist Mono (OFL, selbst gehostet). */

@font-face{font-family:"Geist";src:url(../fonts/geist.woff2) format("woff2");font-weight:100 900;font-style:normal;font-display:swap}
@font-face{font-family:"Geist Mono";src:url(../fonts/geist-mono.woff2) format("woff2");font-weight:100 900;font-style:normal;font-display:swap}

:root{
  --papier:#F4F3EF; --weiss:#FFFFFF; --tinte:#141A19; --grau:#5E6361; --linie:#D9D7D0;
  --petrol:#035455; --petrol-dunkel:#023B3C; --petrol-tint:#E4EDEB; --petrol-mute:#BCD3D0;
  --signal:#B31A1F; --signal-hell:#FF7A6B;
  --sans:"Geist",ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  --mono:"Geist Mono",ui-monospace,"SFMono-Regular",Menlo,Consolas,monospace;
  --pad:clamp(20px,4vw,56px); --gap:12px; --hdr:68px;
  --ease:cubic-bezier(.2,.8,.2,1); --fast:180ms; --reveal:520ms;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-padding-top:calc(var(--hdr) + 12px)}
@media (prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}
body{margin:0;background:var(--papier);color:var(--tinte);font:400 17px/1.55 var(--sans);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility}
img{display:block;max-width:100%;height:auto}
picture{display:contents}
a{color:inherit}
h1,h2,h3,p,ul,ol,dl,dd,figure{margin:0}
ul,ol{padding:0;list-style:none}
button{font:inherit;color:inherit}
::selection{background:var(--tinte);color:var(--papier)}
:focus-visible{outline:2px solid var(--tinte);outline-offset:3px}
.visually-hidden{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}
.skip{position:absolute;left:12px;top:-60px;z-index:100;background:var(--tinte);color:var(--papier);padding:10px 14px;font:500 13px/1 var(--mono);text-decoration:none}
.skip:focus{top:12px}

.wrap{max-width:1440px;margin-inline:auto;padding-inline:var(--pad)}
.mono{font:500 11.5px/1.35 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--grau)}
.muted{color:var(--grau)}
.nw{white-space:nowrap}
.dot{display:inline-block;width:.19em;height:.19em;margin-left:.05em;border-radius:50%;background:var(--signal);vertical-align:baseline}

/* type */
.h2{font:600 clamp(30px,3.6vw,52px)/1.02 var(--sans);letter-spacing:-.034em;text-wrap:balance}
.display{font:600 clamp(48px,6.4vw,96px)/.93 var(--sans);letter-spacing:-.05em}

/* buttons & links */
.btn{display:inline-flex;align-items:center;gap:12px;min-height:48px;padding:0 20px;font:500 12.5px/1 var(--mono);letter-spacing:.07em;text-transform:uppercase;text-decoration:none;border:1px solid var(--tinte);transition:background-color var(--fast) var(--ease),color var(--fast) var(--ease)}
.btn span{transition:transform var(--fast) var(--ease)}
.btn:hover span{transform:translateX(3px)}
.btn--solid{background:var(--tinte);color:var(--papier)}
.btn--solid span{color:var(--signal-hell)}
.btn--solid:hover{background:#000}
.btn--line{background:transparent}
.btn--line:hover{background:var(--tinte);color:var(--papier)}
.lnk{font:500 12.5px/1 var(--mono);letter-spacing:.07em;text-transform:uppercase;text-decoration:none;padding:6px 0;background:linear-gradient(currentColor,currentColor) 0 100%/100% 1px no-repeat;transition:background-size var(--fast) var(--ease)}
.lnk:hover{background-size:0 1px;background-position:100% 100%}
.lnk span{color:var(--signal)}

/* header */
.hdr{position:fixed;inset:0 0 auto;z-index:50;height:var(--hdr);border-bottom:1px solid transparent;transition:background-color var(--fast) var(--ease),border-color var(--fast) var(--ease)}
.hdr.is-solid{background:rgba(244,243,239,.94);border-color:var(--linie);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.hdr-in{height:100%;display:flex;align-items:center;gap:32px}
.hdr-logo{display:block;margin-right:auto;padding:6px 0}
.hdr-logo img{height:28px;width:auto}
.hdr-nav{display:flex;gap:28px}
.hdr-nav a{font:500 12px/1 var(--mono);letter-spacing:.08em;text-transform:uppercase;text-decoration:none;padding:8px 0;background:linear-gradient(var(--signal),var(--signal)) 0 100%/0 1px no-repeat;transition:background-size var(--fast) var(--ease)}
.hdr-nav a:hover,.hdr-nav a[aria-current="true"]{background-size:100% 1px}
.hdr-cta{min-height:40px;padding:0 14px;font-size:12px;background:var(--papier)}
.hdr-cta:hover{background:var(--tinte)}

/* hero: typografisch + Musterfächer */
.hero{padding-top:calc(var(--hdr) + clamp(40px,7vh,96px));padding-bottom:clamp(28px,4vh,48px)}
.hero-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:20px;align-items:end}
.hero-h{grid-column:1/9;font:600 clamp(42px,7.4vw,106px)/.9 var(--sans);letter-spacing:-.054em}
.hero-h .ln{display:block}
.hero-side{grid-column:9/13;padding-bottom:.6em}
.hero-p{max-width:32ch;font-size:clamp(16.5px,1.3vw,18.5px);line-height:1.5;color:#232A29}
.hero-cta{display:flex;flex-wrap:wrap;align-items:center;gap:14px 26px;margin-top:clamp(20px,2.4vw,28px)}
.fan-wrap{margin-top:clamp(28px,4.4vh,52px)}
.fan{display:flex;gap:6px;height:clamp(300px,calc(100svh - var(--hdr) - 410px),540px)}
.fan-i{flex:1 1 0;min-width:0;transition:flex-grow 240ms var(--ease)}
.fan-i a{position:relative;display:block;height:100%;overflow:hidden;background:#E8E4DC}
.fan-i img{width:100%;height:100%;object-fit:cover;transition:transform 240ms var(--ease)}
.fan-tag{position:absolute;left:8px;bottom:8px;writing-mode:vertical-rl;transform:rotate(180deg);padding:9px 5px;background:var(--papier);font:500 10.5px/1 var(--mono);letter-spacing:.08em;text-transform:uppercase;white-space:nowrap;color:var(--tinte)}
.fan-tag b{font-weight:500;color:var(--signal);margin-bottom:6px}
@media (hover:hover) and (pointer:fine){
  .fan:hover .fan-i{flex-grow:.86}
  .fan .fan-i:hover,.fan .fan-i:focus-within{flex-grow:1.9}
}
.fan-i a:focus-visible{outline-offset:-4px;outline-color:var(--papier);box-shadow:inset 0 0 0 4px var(--tinte)}
.fan-cap{display:flex;flex-wrap:wrap;justify-content:space-between;gap:6px 20px;padding-top:12px}
.fan-cap a{color:var(--tinte);text-decoration:none;background:linear-gradient(currentColor,currentColor) 0 100%/100% 1px no-repeat;padding-bottom:2px}
.fan-cap a:hover{background-size:0 1px;background-position:100% 100%}

/* values */
.values{display:grid;grid-template-columns:repeat(3,1fr)}
.values>div{padding:clamp(28px,3.4vw,44px) clamp(16px,2vw,32px) clamp(28px,3.4vw,44px) 0}
.values>div+div{padding-left:clamp(16px,2vw,32px);border-left:1px solid var(--linie)}
.values h2{margin:0 0 8px;font:600 21px/1.2 var(--sans);letter-spacing:-.018em}
.values p{font-size:15.5px;color:var(--grau);max-width:36ch}

/* sections */
.sec{padding-block:clamp(72px,8.4vw,128px);border-top:1px solid var(--linie)}
.sec-head{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:20px;align-items:start;margin-bottom:clamp(32px,4vw,56px)}
.sec-lab{grid-column:1/4;padding-top:.85em}
.sec-head .h2{grid-column:4/12}
.sec-p{grid-column:4/10;margin-top:18px;color:var(--grau);max-width:54ch;text-wrap:pretty}

/* Musterkarte */
.mk-bar{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:14px 24px;padding:14px 0;margin-bottom:var(--gap);border-top:1px solid var(--tinte)}
.mk-filter{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.mk-flab{margin-right:8px}
.chip{appearance:none;cursor:pointer;display:inline-flex;align-items:center;gap:6px;min-height:40px;padding:0 14px;border:1px solid var(--linie);background:var(--weiss);font:500 12px/1 var(--mono);letter-spacing:.07em;text-transform:uppercase;transition:background-color var(--fast) var(--ease),color var(--fast) var(--ease),border-color var(--fast) var(--ease)}
.chip sup{font-size:9.5px;letter-spacing:0;color:var(--grau);transform:translateY(-3px)}
.chip:hover{border-color:var(--tinte)}
.chip[aria-pressed="true"]{background:var(--tinte);border-color:var(--tinte);color:var(--papier)}
.chip[aria-pressed="true"] sup{color:var(--signal-hell)}
.mk-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--gap)}
.mk[hidden]{display:none}
.mk-a{position:relative;display:flex;flex-direction:column;height:100%;background:var(--weiss);border:1px solid var(--linie);text-decoration:none;container-type:inline-size;transition:border-color var(--fast) var(--ease)}
.mk-sw{position:relative;display:block;aspect-ratio:1;overflow:hidden;background:#E8E4DC}
.mk-sw img{width:100%;height:100%;object-fit:cover}
.mk-idx{position:absolute;top:10px;left:10px;padding:4px 6px 3px;background:var(--papier);font:500 11px/1 var(--mono);letter-spacing:.06em}
.mk-meta{position:relative;display:grid;grid-template-columns:1fr auto;column-gap:12px;padding:13px 14px 15px}
.mk-name{font:600 16px/1.25 var(--sans);letter-spacing:-.012em}
.mk-kind{grid-column:1;margin-top:5px;font:500 11px/1.35 var(--mono);letter-spacing:.07em;text-transform:uppercase;color:var(--grau)}
.mk-go{grid-column:2;grid-row:1/3;align-self:start;color:var(--grau);transition:transform var(--fast) var(--ease),color var(--fast) var(--ease)}
.mk-sheet{display:grid;grid-template-columns:1fr 1fr;gap:8px 14px;margin:0 14px;padding:11px 0 14px;border-top:1px solid var(--linie);font:500 12px/1.25 var(--mono);letter-spacing:.02em;font-variant-numeric:tabular-nums}
.mk-sheet div{display:flex;flex-direction:column;gap:3px;min-width:0}
.mk-sheet dt{color:var(--grau);text-transform:uppercase;letter-spacing:.07em;font-size:9.5px}
.mk-sheet dd{color:var(--tinte);white-space:nowrap}
.mk-a:hover{border-color:var(--tinte)}
.mk-a:hover .mk-go,.mk-a:focus-visible .mk-go{color:var(--signal);transform:translateX(3px)}
.mk-sw img{transition:transform 320ms var(--ease)}
.mk-a:hover .mk-sw img{transform:scale(1.035)}
.mk-name{text-wrap:balance}
@container (max-width: 300px){
  .mk-sheet{display:block;padding:8px 0 12px}
  .mk-sheet div{flex-direction:row;justify-content:space-between;align-items:baseline;gap:8px;padding:2px 0}
  .mk-sheet dd{text-align:right}
}
.mk-more{margin-top:28px}

/* Bildband */
.band{margin:0}
.band-img{display:block;aspect-ratio:21/8;overflow:hidden;background:#E8E4DC}
.band-img img{width:100%;height:100%;object-fit:cover}
.band-cap{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 20px;padding-top:14px}
.band-cap a{font:600 16px/1.3 var(--sans);letter-spacing:-.01em;text-decoration:none}
.band-cap a span{color:var(--signal);display:inline-block;transition:transform var(--fast) var(--ease)}
.band-cap a:hover span{transform:translateX(3px)}
.band-spec{margin-left:auto}

/* Räume */
.sec-head--ctrl{align-items:end}
.sec-head--ctrl .sec-lab{align-self:start}
.r-ctrl{grid-column:10/13;grid-row:2/4;align-self:end;justify-self:end;display:flex;align-items:center;gap:8px}
.r-count{margin-right:10px;font-variant-numeric:tabular-nums;white-space:nowrap}
.r-btn{appearance:none;cursor:pointer;width:48px;height:48px;border:1px solid var(--tinte);background:transparent;font:400 18px/1 var(--sans);transition:background-color var(--fast) var(--ease),color var(--fast) var(--ease),opacity var(--fast)}
.r-btn:hover{background:var(--tinte);color:var(--papier)}
.r-btn:disabled{opacity:.3;cursor:default;background:transparent;color:var(--tinte)}
.rooms{--rh:clamp(320px,31vw,460px);display:flex;gap:var(--gap);overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scroll-padding-inline:max(var(--pad),calc((100vw - 1440px)/2 + var(--pad)));padding-inline:max(var(--pad),calc((100vw - 1440px)/2 + var(--pad)));padding-bottom:6px;scrollbar-width:none}
.rooms::-webkit-scrollbar{display:none}
.rooms:focus-visible{outline-offset:-2px}
.room{flex:0 0 auto;scroll-snap-align:start;scroll-snap-stop:always}
.room-img{display:block;height:var(--rh);overflow:hidden;background:#E8E4DC}
.room-img img{height:100%;width:auto;object-fit:cover}
.room--wide .room-img{aspect-ratio:3/2}
.room--tall .room-img{aspect-ratio:4/5}
.room figcaption{display:grid;gap:6px;padding-top:14px;width:0;min-width:100%}
.room-no{font:500 11px/1.3 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--grau)}
.room-prod{font:600 16px/1.3 var(--sans);letter-spacing:-.01em;text-decoration:none}
.room-prod span{color:var(--signal);display:inline-block;transition:transform var(--fast) var(--ease)}
.room-prod:hover span{transform:translateX(3px)}
.room-prod:hover{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}
.room-spec{font:500 11px/1.3 var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--grau)}

/* Verlegen */
.lay{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:20px}
.lay-txt{grid-column:1/6;align-self:start;position:sticky;top:calc(var(--hdr) + 32px)}
.lay-txt .display{margin:22px 0 28px}
.lay-txt p{max-width:42ch}
.lay-txt p+p{margin-top:14px;font-size:15.5px}
.lay-spec{display:grid;grid-template-columns:1fr 1fr;margin-top:28px;border-top:1px solid var(--tinte)}
.lay-spec div{display:flex;justify-content:space-between;gap:12px;padding:10px 0;border-bottom:1px solid var(--linie);font:500 12px/1.3 var(--mono);letter-spacing:.04em}
.lay-spec div:nth-child(odd){margin-right:20px}
.lay-spec div:nth-last-child(-n+2){grid-column:1/-1;margin-right:0}
.lay-spec dt{color:var(--grau);text-transform:uppercase;letter-spacing:.07em;font-size:10.5px}
.lay-spec dd{text-align:right}
.lay-media{grid-column:7/13}
.lay-img{display:block;aspect-ratio:4/3;overflow:hidden;background:#E8E4DC}
.lay-img img{width:100%;height:100%;object-fit:cover}
.lay-fig figcaption{padding-top:10px}
.chips-h{margin:28px 0 10px}
.chips{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--gap)}
.chips a{display:flex;flex-direction:column;gap:8px;text-decoration:none}
.chip-sw{display:block;aspect-ratio:1;overflow:hidden;background:#E8E4DC;outline:1px solid transparent;outline-offset:2px;transition:outline-color var(--fast)}
.chip-sw img{width:100%;height:100%;object-fit:cover}
.chip-t{font:500 11px/1.35 var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--grau);text-wrap:balance;transition:color var(--fast)}
.chips a:hover .chip-sw{outline-color:var(--tinte)}
.chips a:hover .chip-t{color:var(--tinte)}

/* Sortiment */
.cats{border-top:1px solid var(--tinte)}
.cat{display:grid;grid-template-columns:72px minmax(0,.9fr) minmax(0,1fr) 184px 48px;align-items:center;column-gap:24px;padding:18px 0;border-bottom:1px solid var(--linie);text-decoration:none;transition:background-color var(--fast) var(--ease)}
.cat-no{font:500 12px/1 var(--mono);letter-spacing:.08em;color:var(--grau);padding-left:4px}
.cat-t{font:600 clamp(30px,3.6vw,52px)/1 var(--sans);letter-spacing:-.04em}
.cat-d{font-size:15.5px;color:var(--grau);max-width:38ch}
.cat-img{display:block;aspect-ratio:4/3;overflow:hidden;background:#E8E4DC}
.cat-img img{width:100%;height:100%;object-fit:cover;transition:transform .5s var(--ease)}
.cat-go{justify-self:end;padding-right:6px;font-size:22px;transition:transform var(--fast) var(--ease),color var(--fast) var(--ease)}
.cat:hover{background:var(--weiss)}
.cat:hover .cat-go{transform:translateX(4px);color:var(--signal)}
.cat:hover .cat-img img{transform:scale(1.04)}
.rest{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:20px 32px;margin-top:clamp(32px,4vw,56px);padding:clamp(24px,3vw,36px) clamp(20px,3vw,40px);background:var(--petrol-tint)}
.rest-h{font:600 clamp(24px,2.6vw,34px)/1.1 var(--sans);letter-spacing:-.028em;margin-bottom:8px}

/* Kontakt */
.contact{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:20px}
.contact .sec-lab{grid-column:1/4}
.contact-body{grid-column:4/13}
.mail{display:inline-block;margin-top:24px;font:500 clamp(22px,3vw,40px)/1.15 var(--sans);letter-spacing:-.025em;text-decoration:underline;text-decoration-color:var(--signal);text-decoration-thickness:2px;text-underline-offset:8px;transition:text-decoration-color var(--fast)}
.mail:hover{text-decoration-color:var(--tinte)}
.contact .muted{margin-top:14px}

/* Footer + Familie */
.ftr{background:var(--petrol);color:var(--papier);padding:clamp(56px,7vw,96px) 0 32px}
.ftr a{text-decoration:none}
.ftr :focus-visible{outline-color:var(--papier)}
.ftr-top{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:20px 40px;padding-bottom:clamp(32px,4vw,48px);border-bottom:1px solid rgba(244,243,239,.22)}
.ftr-logo{height:40px;width:auto}
.ftr-claim{font:500 clamp(17px,1.6vw,21px)/1.3 var(--sans);letter-spacing:-.01em}
.ftr-claim a{text-decoration:underline;text-decoration-color:var(--signal-hell);text-underline-offset:5px;text-decoration-thickness:2px}
.fam{padding:clamp(28px,3.4vw,44px) 0}
.fam-h{color:var(--petrol-mute);margin-bottom:18px}
.fam-list{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--gap)}
.fam-item a,.fam-item.is-current{position:relative;display:flex;flex-direction:column;gap:6px;height:100%;min-height:118px;padding:18px 44px 18px 18px;border:1px solid rgba(244,243,239,.26);transition:background-color var(--fast) var(--ease),border-color var(--fast)}
.fam-item a:hover{background:var(--petrol-dunkel);border-color:var(--papier)}
.fam-n{font:600 17px/1.2 var(--sans);letter-spacing:.06em}
.fam-s{font-size:14.5px;line-height:1.4;color:var(--petrol-mute)}
.fam-go{position:absolute;top:16px;right:16px;font-size:17px;transition:transform var(--fast) var(--ease)}
.fam-item a:hover .fam-go{transform:translate(2px,-2px)}
.fam-item.is-current{background:var(--papier);color:var(--tinte);border-color:var(--papier)}
.fam-item.is-current .fam-s{color:var(--grau)}
.fam-here{margin-top:auto;padding-top:8px;font:500 10.5px/1 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--signal)}
.fam-here::before{content:"";display:inline-block;width:6px;height:6px;margin-right:7px;border-radius:50%;background:var(--signal);vertical-align:1px}
.ftr-legal{display:flex;flex-wrap:wrap;justify-content:space-between;gap:14px 32px;padding-top:24px;border-top:1px solid rgba(244,243,239,.22);font:500 11.5px/1.5 var(--mono);letter-spacing:.06em;color:var(--petrol-mute)}
.ftr-legal ul{display:flex;flex-wrap:wrap;gap:6px 24px;text-transform:uppercase;letter-spacing:.08em}
.ftr-legal a{color:var(--papier);padding:4px 0;background:linear-gradient(var(--signal-hell),var(--signal-hell)) 0 100%/0 1px no-repeat;transition:background-size var(--fast) var(--ease)}
.ftr-legal a:hover{background-size:100% 1px}
.ftr-legal p{max-width:62ch;letter-spacing:.02em}

/* Motion: schnell und präzise. Ohne JS ist alles sichtbar. */
.js [data-reveal]{opacity:0;transform:translateY(12px);transition:opacity var(--reveal) var(--ease),transform var(--reveal) var(--ease);transition-delay:calc(var(--i,0) * 60ms)}
.js [data-reveal].is-in{opacity:1;transform:none}
.js [data-wipe] img{clip-path:inset(0 100% 0 0);transition:clip-path 640ms var(--ease)}
.js [data-wipe].is-in img{clip-path:inset(0 0 0 0)}
.js .fan-i a{animation:lay 460ms var(--ease) backwards;animation-delay:calc(260ms + var(--i,0) * 45ms)}
@keyframes lay{from{clip-path:inset(100% 0 0 0)}to{clip-path:inset(0 0 0 0)}}
.js .hero-h .ln,.js .hero-p,.js .hero-cta,.js .fan-cap{animation:rise var(--reveal) var(--ease) backwards}
.js .hero-h .ln:nth-child(2){animation-delay:70ms}
.js .hero-p{animation-delay:160ms}
.js .hero-cta{animation-delay:230ms}
.js .fan-cap{animation-delay:620ms}
.js .dot{transform:scale(0);transition:transform 260ms cubic-bezier(.3,1.7,.5,1) .38s}
.js .is-in .dot,.js [data-reveal].is-in .dot,.js .hero-h .dot{transform:scale(1)}
.js .hero-h .dot{transition:none;animation:pop 280ms cubic-bezier(.3,1.7,.5,1) .5s both}
@keyframes rise{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
@keyframes fade{to{opacity:1}}
@keyframes pop{from{transform:scale(0)}to{transform:scale(1)}}
.mk.is-filtered-in{animation:fade 200ms var(--ease)}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
  .js [data-reveal],.js .hero-h .ln,.js .hero-p,.js .hero-cta,.js .fan-cap{opacity:1;transform:none}
  .js [data-wipe] img{clip-path:none}
  .js .dot{transform:none}
}

html:not(.js) .mk-filter,html:not(.js) .r-ctrl{display:none}
@media print{
  .js [data-reveal],.js .hero-h .ln,.js .hero-p,.js .hero-cta,.js .fan-cap{opacity:1!important;transform:none!important}
  .js [data-wipe] img{clip-path:none!important}
  .hdr{position:static}
}

/* Tablet */
@media (max-width:1099px){
  .hdr-nav{display:none}
  .mk-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .cat{grid-template-columns:56px minmax(0,1fr) 160px 36px}
  .cat-d{grid-column:2;grid-row:2;margin-top:6px}
  .cat-img{grid-column:3;grid-row:1/3}
  .cat-go{grid-column:4;grid-row:1/3}
  .fam-list{grid-template-columns:repeat(2,minmax(0,1fr))}
  .hero-h{grid-column:1/-1}
  .hero-side{grid-column:1/-1;display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:20px 32px;margin-top:24px;padding-bottom:0}
  .hero-cta{margin-top:0}
  .fan{height:clamp(280px,34vh,420px)}
  .lay-txt{grid-column:1/7}
  .lay-media{grid-column:7/13}
  .lay-spec{grid-template-columns:1fr}
  .lay-spec div:nth-child(odd){margin-right:0}
  .r-ctrl{grid-column:1/-1;grid-row:auto;justify-self:start;margin-top:20px}
}
/* Mobil */
@media (max-width:759px){
  :root{--hdr:60px;--gap:8px}
  body{font-size:16px}
  .hdr-in{gap:12px}
  .hdr-logo img{height:24px}
  .hdr-cta{min-height:38px;padding:0 12px;font-size:11.5px}
  .hero{padding-top:calc(var(--hdr) + 32px);padding-bottom:24px}
  .hero-h{font-size:clamp(38px,11.6vw,56px);line-height:.93;letter-spacing:-.05em}
  .hero-side{display:block;margin-top:18px}
  .hero-p{max-width:32ch;font-size:16.5px}
  .hero-cta{flex-direction:column;align-items:flex-start;gap:16px;margin-top:20px}
  .fan-wrap{margin-top:28px}
  .fan{gap:4px;height:clamp(240px,40vh,340px)}
  .fan-i:nth-child(4),.fan-i:nth-child(5){display:none}
  .fan-tag{left:5px;bottom:5px;padding:7px 3px;font-size:9.5px;letter-spacing:.06em}
  .values{grid-template-columns:1fr}
  .values>div{padding:22px 0}
  .values>div+div{padding-left:0;border-left:0;border-top:1px solid var(--linie)}
  .sec-head{display:block}
  .sec-lab{padding-top:0;margin-bottom:14px}
  .sec-p{margin-top:14px}
  .mk-bar{align-items:flex-start;flex-direction:column;gap:10px}
  .mk-filter{gap:5px}
  .mk-flab{width:100%;margin:0 0 2px}
  .chip{min-height:38px;padding:0 9px;font-size:11px;letter-spacing:.04em;gap:4px}
  .mk-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .mk-meta{padding:10px 10px 8px}
  .mk-name{font-size:14.5px}
  .mk-kind{font-size:9.5px;letter-spacing:.03em}
  .mk-go{display:none}
  .mk-sheet{margin:0 10px;padding:7px 0 10px;font-size:10px;letter-spacing:.02em}
  .mk-sheet dt{font-size:9px;letter-spacing:.05em}
  .mk-idx{top:8px;left:8px;font-size:10px}
  .r-ctrl{margin-top:18px}
  .r-btn{width:44px;height:44px}
  .rooms{--rh:auto}
  .room{width:80vw}
  .room-img,.room--wide .room-img,.room--tall .room-img{height:auto;aspect-ratio:4/5}
  .room-img img{width:100%;height:100%}
  .lay{display:block}
  .lay-txt{position:static}
  .lay-spec{grid-template-columns:1fr}
  .lay-spec div:nth-child(odd){margin-right:0}
  .lay-media{margin-top:36px}
  .chips{grid-template-columns:repeat(2,minmax(0,1fr))}
  .band-img{aspect-ratio:16/9}
  .band-spec{margin-left:0;flex-basis:100%}
  .cat{grid-template-columns:34px minmax(0,1fr) 92px;column-gap:14px;padding:16px 0}
  .cat-t{font-size:30px}
  .cat-d{font-size:14px}
  .cat-img{grid-column:3;grid-row:1/3}
  .cat-go{display:none}
  .rest{flex-direction:column;align-items:flex-start}
  .contact{display:block}
  .contact .sec-lab{margin-bottom:14px}
  .mail{font-size:clamp(19px,5.6vw,26px);text-underline-offset:6px}
  .fam-list{grid-template-columns:1fr}
  .fam-item a,.fam-item.is-current{min-height:0}
  .ftr-legal{flex-direction:column}
}
.band + .sec{border-top:0}

/* Ratgeber-Seiten */
.guide{padding-top:calc(var(--hdr) + clamp(40px,7vw,100px));padding-bottom:clamp(60px,9vw,140px)}
.guide-crumb{margin-bottom:24px;color:var(--grau)}.guide-crumb a{color:var(--grau);text-decoration:none}
.guide-h{font-size:clamp(2.6rem,7vw,6rem);line-height:1;letter-spacing:-.03em;color:var(--tinte);margin-bottom:.4em}
.guide-lead{font-size:clamp(1.15rem,1vw + .9rem,1.5rem);line-height:1.4;color:var(--grau);max-width:40ch;margin-bottom:clamp(32px,5vw,64px)}
.guide-body{max-width:46rem;line-height:1.6}
.guide-body h2{font-size:clamp(1.4rem,1.4vw + 1rem,2rem);line-height:1.15;letter-spacing:-.02em;margin:2em 0 .6em;color:var(--tinte)}
.guide-body h3{font-size:1.05rem;margin:1.5em 0 .3em}
.guide-body ul{padding-left:1.2em;list-style:disc}.guide-body ol{padding-left:1.4em}.guide-body li+li{margin-top:.55em}
.guide-body a{color:var(--petrol);text-decoration:underline;text-underline-offset:3px}
.guide-table{width:100%;border-collapse:collapse;margin:1em 0;font-size:.92rem;line-height:1.4}
.guide-table th,.guide-table td{border-bottom:1px solid var(--linie);padding:10px 8px;text-align:left;vertical-align:top}
.guide-table thead th{color:var(--grau);font-weight:500}
.guide-note{font-size:.85rem;color:var(--grau);margin-top:1em}
.guide-back{margin-top:clamp(40px,5vw,72px)}
.lay-guide{margin-top:1.2em}.lay-guide a{color:var(--petrol);text-decoration:underline;text-underline-offset:3px}
