@font-face{font-family:Newsreader;src:url(fonts/newsreader.woff2) format("woff2");font-weight:300 600;font-style:normal;font-display:swap}
@font-face{font-family:"Public Sans";src:url(fonts/publicsans.woff2) format("woff2");font-weight:400 600;font-display:swap}
:root{--wand:#FCFBF8;--kamin:#2A1D15;--holz:#9C5B22;--holz2:#C98B4E;--wiese:#5F7F36;--linie:#E6DFD4;--flaeche:#F2EDE4;
--serif:Newsreader,Georgia,serif;--sans:"Public Sans",system-ui,sans-serif;--pad:clamp(20px,5vw,72px);--rs:clamp(20px,5vw,72px)}
@media(min-width:1100px){:root{--rs:230px}}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;scroll-padding-top:56px}
body{background:var(--wand);color:var(--kamin);font-family:var(--sans);font-size:1.0625rem;line-height:1.65;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{display:block;width:100%;height:auto}
a{color:inherit}
:focus-visible{outline:2px solid var(--holz2);outline-offset:3px}
.skip{position:absolute;left:-999px}.skip:focus{left:8px;top:8px;background:#fff;padding:8px;z-index:99}
h1,h2,h3{font-family:var(--serif);font-weight:400;line-height:1.08;letter-spacing:-.01em}
h2{font-size:clamp(2rem,3.8vw,3.3rem);margin-bottom:24px}
h3{font-size:1.45rem;margin:32px 0 8px}
.top{position:fixed;inset:0 0 auto 0;z-index:30;height:56px;display:flex;justify-content:space-between;align-items:center;padding:0 var(--pad);color:#fff;transition:background .3s}
.top.s{background:rgba(42,29,21,.94)}
.mark{font-family:var(--serif);font-size:1.2rem;text-decoration:none}
.anf{font-size:.9rem;text-decoration:none;border-bottom:1px solid currentColor;padding-bottom:2px}
.btn{display:inline-block;background:var(--holz);color:#fff;border:0;padding:15px 28px;font:600 1rem var(--sans);text-decoration:none;border-radius:2px;cursor:pointer;transition:background .2s}
.btn:hover{background:#7f4816}
.hero{position:relative;height:100svh;min-height:560px;background:var(--kamin);overflow:hidden}
.hero img{position:absolute;inset:0;height:100%;object-fit:cover;object-position:50% 60%}
.hero::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.35) 0,transparent 22%,transparent 45%,rgba(30,20,12,.82) 100%)}
.hero-t{position:absolute;z-index:2;left:var(--pad);right:var(--rs);bottom:clamp(40px,9vh,96px);color:#fff;max-width:880px}
.hero h1{font-size:clamp(2.7rem,6.4vw,5.6rem);margin-bottom:16px;text-wrap:balance}
.hero p{font-size:1.15rem;max-width:520px;margin-bottom:28px;color:#fff}
/* Treppe */
.treppe{position:fixed;z-index:25;right:16px;top:50%;transform:translateY(-50%);background:rgba(42,29,21,.9);color:#fff;padding:14px 16px 16px;width:200px}
.treppe p{font-size:.68rem;letter-spacing:.12em;text-transform:uppercase;color:#cdbba8;margin-bottom:10px}
.treppe ol{list-style:none;display:flex;flex-direction:column-reverse;gap:0}
.treppe li{padding:0;border:0!important;margin-left:calc(var(--k)*9px)}
.treppe a{display:flex;align-items:center;gap:8px;text-decoration:none;height:28px;font-size:.78rem;color:#9e8c7b;white-space:nowrap}
.treppe i{flex:none;width:22px;height:100%;border-top:5px solid #5d4a3b;border-left:5px solid #5d4a3b;transition:border-color .3s}
.treppe li.done i{border-color:var(--holz2)}
.treppe li.done a{color:#d9c8b5}
.treppe li.on i{border-color:#fff}
.treppe li.on a{color:#fff;font-weight:600}
.treppe a:hover{color:#fff}
/* Kapitel */
.ch{padding:clamp(64px,10vw,140px) 0 0}
.in{padding:0 var(--rs) 0 var(--pad);max-width:1500px;margin:0 auto}
.two{display:grid;grid-template-columns:1fr;gap:40px;margin-bottom:clamp(56px,8vw,112px)}
@media(min-width:900px){.two{grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(40px,6vw,96px);align-items:start}.two.rev{grid-template-columns:minmax(0,7fr) minmax(0,5fr)}.two .tall{max-width:360px}}
.dark .two:has(.tall){grid-template-columns:minmax(0,1fr)}
@media(min-width:900px){.dark .two:has(.tall){grid-template-columns:minmax(0,7fr) minmax(0,3fr)}}
.txt{max-width:62ch}
.txt p+p,.txt p+ul,.haus p+p{margin-top:16px}
.st{font-size:.8rem;letter-spacing:.08em;text-transform:uppercase;color:var(--holz);margin-bottom:14px}
.dark .st{color:var(--holz2)}
ul{list-style:none;margin-top:16px;border-top:1px solid var(--linie)}
li{padding:9px 0;border-bottom:1px solid var(--linie)}
.dark li{border-color:rgba(255,255,255,.14)}.dark ul{border-color:rgba(255,255,255,.14)}
.strong{font-family:var(--serif);font-size:1.6rem;margin-top:28px!important;line-height:1.2}
.wide{margin-bottom:0;padding-bottom:clamp(64px,10vw,140px)}
.ch figure img{border-radius:0}
.dark{background:var(--kamin);color:#f3ece3}
.dark .btn{background:var(--holz2);color:var(--kamin)}.dark .btn:hover{background:#e0a76a}
.full{margin:calc(-1*clamp(64px,10vw,140px)) 0 clamp(56px,8vw,112px);max-height:92svh;overflow:hidden}
.full img{max-height:92svh;object-fit:cover;object-position:50% 40%}
.winter{padding-bottom:0}.winter .in{margin-bottom:40px}
.mos{display:grid;grid-template-columns:1fr;gap:6px;padding-bottom:0}
@media(min-width:900px){.mos{grid-template-columns:1fr 1fr}}
.mos img{height:100%;object-fit:cover;aspect-ratio:16/10}
.lead{font-size:1.2rem;max-width:56ch}
.rooms{display:grid;grid-template-columns:1fr;gap:0 40px;margin:24px auto 56px}
@media(min-width:700px){.rooms{grid-template-columns:1fr 1fr}}
@media(min-width:1100px){.rooms{grid-template-columns:repeat(4,1fr)}}
.rooms h3{margin-top:0}
.grid2{display:grid;grid-template-columns:1fr;gap:6px;padding-bottom:clamp(64px,10vw,140px)}
@media(min-width:800px){.grid2{grid-template-columns:1fr 1fr}}
.grid2 img{aspect-ratio:3/2;object-fit:cover;height:100%}
.tint{background:var(--flaeche);padding-bottom:0}
.grid2.sm{padding:0 0 0;grid-template-columns:1fr;gap:6px}
@media(min-width:800px){.grid2.sm{grid-template-columns:3fr 1.4fr}}
.grid2.sm .p img{aspect-ratio:auto;object-fit:cover;height:100%}
.tint .grid2.sm{padding-bottom:0}
.haus{padding-bottom:clamp(64px,10vw,140px);max-width:1100px;margin-left:0}
@media(min-width:900px){.haus{margin-left:max(0px,calc((100% - 1500px)/2))}.haus{padding-left:calc(var(--pad) + 8vw)}}
.big{font-family:var(--serif);font-size:clamp(1.6rem,2.8vw,2.5rem);line-height:1.25}
.haus p:not(.big):not(.st){max-width:62ch}
.req{padding-bottom:clamp(64px,10vw,140px)}.req .two{margin-bottom:0}
.mail{font-family:var(--serif);font-size:1.7rem;text-decoration-thickness:1px;text-underline-offset:5px}
.adr{margin-top:28px;color:#cdbba8}
form{display:grid;gap:18px}
label{display:grid;gap:6px;font-size:.88rem;color:#cdbba8}
input,select,textarea{font:1rem var(--sans);color:#fff;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.28);border-radius:2px;padding:12px 14px;width:100%}
input:focus,select:focus,textarea:focus{outline:2px solid var(--holz2);border-color:transparent}
select option{color:#000}
.r2{display:grid;grid-template-columns:1fr 1fr;gap:16px}
form .btn{justify-self:start}
.ok{color:#fff;border-left:3px solid var(--holz2);padding-left:14px}
footer{background:#1b130d;color:#cdbba8;padding:64px 0 40px;font-size:.92rem}
footer h2{font-size:1.6rem;color:#fff;margin-bottom:16px}footer p{margin-bottom:14px;max-width:70ch}
.band{font-size:.8rem;opacity:.75;margin-top:32px}
/* Handy */
@media(max-width:899px){
 .treppe{top:auto;bottom:12px;right:12px;transform:none;width:auto;padding:10px 12px 10px 10px}
 .treppe p,.treppe li:not(.on) span{display:none}
 .treppe li{margin-left:calc(var(--k)*6px)}
 .treppe a{height:16px;gap:0}.treppe i{width:14px;border-width:3px 0 0 3px}
 .treppe li.on a{font-size:.72rem;gap:6px}
 .treppe ol{align-items:flex-start}
 .hero-t{right:var(--pad)}
 .hero img{object-position:42% 50%}
 .top .anf{display:none}
 .in{padding:0 var(--pad)}
}
.rv{opacity:0;transform:translateY(18px);transition:opacity .8s ease,transform .8s ease}
.rv.v{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.rv{opacity:1;transform:none;transition:none}html{scroll-behavior:auto}}