@font-face{font-family:Figtree;src:url("assets/fonts/figtree-latin-wght-normal.woff2") format("woff2");font-style:normal;font-weight:300 900;font-display:swap}:root{--green:#173f36;--green-2:#23564a;--cream:#f5f1e8;--sand:#dcc9a5;--ink:#1b2521;--muted:#646e6a;--white:#fff;--line:rgba(27,37,33,.14);--serif:Georgia,"Times New Roman",serif;--sans:Figtree,Arial,sans-serif}
 *{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:var(--ink);background:#fff;font-family:var(--sans);font-size:17px;line-height:1.68}img{display:block;width:100%;height:100%;object-fit:cover}a{color:inherit;text-decoration:none}.site-header{height:88px;padding:0 max(clamp(22px,5vw,80px),calc((100% - 1280px)/2));display:flex;align-items:center;justify-content:space-between;background:#fff;position:sticky;top:0;z-index:100;box-shadow:0 8px 24px rgba(23,63,54,.11),0 1px 0 rgba(23,63,54,.07)}.brand,.footer-brand{display:flex;align-items:center;gap:14px}.brand-logo{width:auto;height:58px;max-width:205px;object-fit:contain}.brand-mark{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;background:var(--green);color:#fff;font-family:var(--serif);font-size:25px;font-style:italic}.brand strong,.footer-brand strong{display:block;font-family:var(--serif);font-size:18px;font-weight:normal;line-height:1.1}.brand small,.footer-brand small{display:block;margin-top:4px;text-transform:uppercase;letter-spacing:.13em;font-size:9px;color:var(--muted)}nav{display:flex;align-items:center;gap:30px;font-size:14px;font-weight:500}nav a{position:relative}nav a:not(.nav-cta):after{content:"";position:absolute;left:0;right:100%;bottom:-6px;height:1px;background:var(--green);transition:.25s}nav a:hover:after{right:0}.nav-cta{padding:12px 18px;border:1px solid var(--green);transition:.25s}.nav-cta:hover{background:var(--green);color:white}.menu-toggle{display:none;background:none;border:0;width:42px;height:42px}.menu-toggle span{display:block;width:24px;height:1px;background:var(--ink);margin:7px}
.hero{height:calc(100svh - 88px);min-height:650px;position:relative;color:#fff;display:flex;align-items:center}.hero>img,.hero>picture>img{position:absolute;inset:0}.hero-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(7,25,20,.82) 0%,rgba(11,30,24,.51) 48%,rgba(9,20,17,.06) 78%)}.hero-content{position:relative;z-index:2;width:min(760px,90%);margin-left:max(clamp(22px,8vw,130px),calc((100% - 1280px)/2));margin-bottom:70px}.eyebrow,.section-label{text-transform:uppercase;letter-spacing:.2em;font-size:11px;font-weight:bold;color:var(--green-2);margin:0 0 20px}.eyebrow.light{color:#e9dbc0}.hero h1,.section h2,.location h2,.cta-section h2{font:normal clamp(45px,6vw,88px)/.98 var(--serif);letter-spacing:-.035em;margin:0}.hero h1{font-size:clamp(49px,6.2vw,94px);max-width:980px}.hero-lead{font-size:18px;line-height:1.65;max-width:620px;margin:28px 0 34px;color:rgba(255,255,255,.88)}.hero-actions{display:flex;flex-wrap:wrap;gap:12px}.button{display:inline-flex;min-height:52px;align-items:center;justify-content:center;padding:0 25px;font-size:13px;font-weight:bold;letter-spacing:.04em;transition:.25s}.button-primary{background:#dfc594;color:var(--ink)}.button-primary:hover{background:#efd9ae;transform:translateY(-2px)}.button-ghost{border:1px solid rgba(255,255,255,.6)}.button-ghost:hover{background:#fff;color:var(--ink)}.quick-facts{position:absolute;right:0;bottom:0;z-index:3;background:#f6f1e8;color:var(--ink);display:grid;grid-template-columns:repeat(4,1fr);width:min(720px,62vw);padding:24px 30px}.quick-facts div{padding:0 20px;border-right:1px solid var(--line)}.quick-facts div:last-child{border:0}.quick-facts strong{display:block;font:normal 18px var(--serif)}.quick-facts span{display:block;color:var(--muted);font-size:10px;text-transform:uppercase;letter-spacing:.08em;margin-top:3px}
.section{padding:clamp(80px,10vw,150px) max(clamp(22px,8vw,130px),calc((100% - 1280px)/2))}.intro{background:var(--cream)}.intro-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(45px,9vw,150px);align-items:start}.intro h2,.apartments h2,.seasons h2{font-size:clamp(42px,4.6vw,72px)}.intro-grid p{margin:0 0 22px;color:var(--muted);max-width:610px}.intro-grid .lead{font-size:21px;color:var(--ink);line-height:1.55}.section-head{display:grid;grid-template-columns:1.3fr .7fr;gap:60px;align-items:end;margin-bottom:55px}.section-head>p{color:var(--muted);max-width:420px;margin:0 0 7px}.apartments{background:#fff}.card-grid{display:grid;grid-template-columns:1.12fr .94fr .94fr;gap:20px}.apartment-card{border:1px solid var(--line);background:#fff;transition:.3s}.apartment-card:hover{transform:translateY(-5px);box-shadow:0 20px 45px rgba(20,48,39,.1)}.card-image{height:300px;position:relative;overflow:hidden}.featured .card-image{height:350px}.card-image>span{position:absolute;left:0;bottom:0;background:var(--cream);padding:9px 14px;font-size:10px;text-transform:uppercase;letter-spacing:.1em}.card-body{padding:27px}.card-meta{font-size:10px;text-transform:uppercase;letter-spacing:.09em;color:var(--muted);margin:0 0 9px}.card-body h3{font:normal 29px var(--serif);margin:0}.card-body>p:not(.card-meta){font-size:14px;color:var(--muted);min-height:72px}.card-body a{font-size:12px;text-transform:uppercase;letter-spacing:.08em;font-weight:bold}.card-body a span{margin-left:8px}
.location{display:grid;grid-template-columns:1.05fr .95fr;background:var(--green);color:white;min-height:720px}.location-image{min-height:600px}.location-copy{padding:clamp(70px,8vw,125px)}.location h2{font-size:clamp(42px,4.4vw,68px);max-width:670px}.location-copy>p:not(.eyebrow){color:rgba(255,255,255,.72);max-width:600px;margin:28px 0 42px}.location ul{list-style:none;padding:0;margin:0}.location li{display:flex;align-items:center;border-top:1px solid rgba(255,255,255,.16);padding:18px 0;font-family:var(--serif);font-size:18px}.location li span{font:11px var(--sans);color:#dcc9a5;width:48px;letter-spacing:.1em}
.wellness{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(50px,9vw,140px);align-items:center;background:var(--cream)}.wellness-copy h2{font-size:clamp(42px,4.7vw,72px)}.wellness-copy>p:not(.eyebrow){color:var(--muted);max-width:570px}.wellness-image{height:570px}.wellness-note{display:flex;align-items:center;gap:18px;border-top:1px solid var(--line);margin-top:35px;padding-top:22px}.wellness-note span{padding:6px 10px;background:var(--green);color:white;font-size:9px;text-transform:uppercase;letter-spacing:.1em}.wellness-note strong{font:normal 17px var(--serif)}
.seasons{background:#fff}.season-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px}.season-card{height:560px;position:relative;overflow:hidden;color:white}.season-card:after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(5,20,15,.8),rgba(5,20,15,0) 70%)}.season-card>div{position:absolute;z-index:2;left:40px;right:40px;bottom:35px}.season-card span{font-size:10px;text-transform:uppercase;letter-spacing:.18em;color:#ead8b7}.season-card h3{font:normal 44px var(--serif);margin:8px 0}.season-card p{margin:0 0 17px;color:rgba(255,255,255,.82)}.season-card a{font-size:11px;text-transform:uppercase;letter-spacing:.1em;border-bottom:1px solid rgba(255,255,255,.55);padding-bottom:5px}
.host{display:grid;grid-template-columns:1fr .8fr;gap:clamp(55px,9vw,145px);align-items:end;background:var(--cream)}.host h2{font:normal clamp(34px,4vw,60px)/1.16 var(--serif);letter-spacing:-.025em;margin:0;max-width:850px}.host-copy{padding:8px 0 6px;border-top:1px solid rgba(23,63,54,.18)}.host-copy>p:not(.eyebrow){color:var(--muted);max-width:570px;font-size:18px}.host-copy strong,.host-copy small{display:block}.host-copy strong{margin-top:25px;font:normal 20px var(--serif)}.host-copy small{font-size:10px;text-transform:uppercase;letter-spacing:.1em;color:var(--muted)}
.cta-section{background:var(--green);color:white;padding:clamp(80px,9vw,140px) max(clamp(22px,8vw,130px),calc((100% - 1280px)/2));display:grid;grid-template-columns:1.2fr .8fr;gap:80px;align-items:end}.cta-section h2{font-size:clamp(45px,5.6vw,84px)}.cta-copy p{color:rgba(255,255,255,.75);max-width:520px;margin:0 0 27px}.button-light{background:#fff;color:var(--green);margin-right:22px}.phone-link{font-family:var(--serif);white-space:nowrap}
footer{padding:55px max(clamp(22px,8vw,130px),calc((100% - 1280px)/2));display:grid;grid-template-columns:1.1fr .7fr .7fr auto;gap:55px;align-items:start;background:#332f28;color:white}footer p{font-size:10px;text-transform:uppercase;letter-spacing:.13em;color:#e2cda7;margin:0 0 10px}footer a,footer span{display:block;font-size:13px;color:rgba(255,250,241,.74);margin-bottom:5px}.footer-brand{display:block}.footer-logo-link{width:max-content;margin:0 0 16px}.footer-logo{width:235px;height:auto;object-fit:contain}.footer-brand small{color:rgba(255,250,241,.64);font-size:9px;letter-spacing:.13em}.to-top{position:fixed;right:clamp(16px,2.5vw,36px);bottom:clamp(16px,2.5vw,32px);z-index:90;display:inline-flex;align-items:center;gap:9px;width:auto;height:46px;padding:0 16px;border:1px solid rgba(255,255,255,.2);border-radius:7px;background:var(--green);color:#fff;font-family:var(--sans);font-size:12px;font-weight:600;letter-spacing:.04em;box-shadow:0 12px 30px rgba(23,63,54,.25);opacity:0;visibility:hidden;transform:translateY(12px);transition:opacity .25s ease,transform .25s ease,visibility .25s ease,background .2s ease;cursor:pointer}.to-top span{font-size:17px;line-height:1}.to-top.visible{opacity:1;visibility:visible;transform:translateY(0)}.to-top:hover{background:var(--green-2);transform:translateY(-2px)}.to-top:focus-visible{outline:3px solid rgba(226,205,167,.8);outline-offset:3px}
@media(max-width:1050px){nav{gap:18px}.quick-facts{width:78vw}.card-grid{grid-template-columns:1fr 1fr}.apartment-card.featured{grid-column:span 2}.featured .card-image{height:430px}.location{grid-template-columns:1fr}.location-image{height:540px}.wellness{gap:50px}}
@media(max-width:780px){.site-header{height:72px}.brand strong{font-size:16px}.menu-toggle{display:block}nav{display:none;position:absolute;left:0;right:0;top:72px;background:#fff;padding:25px;flex-direction:column;align-items:stretch;box-shadow:0 15px 30px rgba(0,0,0,.12)}nav.open{display:flex}.hero{height:auto;min-height:760px;align-items:flex-start}.hero-content{margin:105px 22px 230px}.hero h1{font-size:51px}.hero-lead{font-size:16px}.quick-facts{width:100%;grid-template-columns:1fr 1fr;padding:20px}.quick-facts div{padding:12px;border-bottom:1px solid var(--line)}.quick-facts div:nth-child(2){border-right:0}.intro-grid,.section-head,.wellness,.host,.cta-section{grid-template-columns:1fr}.section-head{gap:22px}.card-grid{grid-template-columns:1fr}.apartment-card.featured{grid-column:auto}.card-image,.featured .card-image{height:280px}.location-copy{padding:75px 25px}.wellness-image{height:360px;grid-row:1}.season-grid{grid-template-columns:1fr}.season-card{height:470px}.host-photo{height:400px;max-width:420px}.cta-section{gap:30px}.button-light{margin:0 0 18px}.phone-link{display:block}footer{grid-template-columns:1fr 1fr}.footer-brand{grid-column:span 2}.to-top{justify-self:end}}
@media(max-width:480px){.hero h1{font-size:42px}.hero-actions{display:grid}.hero-actions .button{width:100%}.section{padding:75px 22px}.intro h2,.apartments h2,.seasons h2,.location h2,.wellness-copy h2{font-size:39px}.season-card>div{left:24px;right:24px}.season-card h3{font-size:36px}.host h2{font-size:34px}.cta-section h2{font-size:44px}footer{grid-template-columns:1fr}.footer-brand{grid-column:auto}.to-top{justify-self:start}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}
@media(min-width:1101px){.apartments .section-head{grid-template-columns:auto auto;gap:40px}.apartment-intro-line{white-space:nowrap;max-width:none!important;justify-self:start;font-size:15px}.apartments .section-head-title{justify-self:end}.apartments .section-head-title .eyebrow{max-width:620px}}

/* Unterseiten */
.sub-hero{min-height:620px;height:72vh;position:relative;color:#fff;display:flex;align-items:flex-end}.sub-hero>img,.sub-hero>picture>img{position:absolute;inset:0}.sub-hero-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(8,31,24,.83),rgba(8,31,24,.28) 72%),linear-gradient(0deg,rgba(7,25,20,.48),transparent 55%)}.sub-hero>div:last-child{position:relative;z-index:2;padding:0 clamp(22px,8vw,130px) 90px;max-width:1050px;margin-left:max(0px,calc((100% - 1280px)/2 - clamp(22px,8vw,130px)))}.sub-hero h1{font:normal clamp(55px,7vw,100px)/.92 var(--serif);letter-spacing:-.04em;margin:0}.sub-hero>div>p:last-child{max-width:680px;font-size:19px;color:rgba(255,255,255,.83);margin:27px 0 0}.sub-section{padding:clamp(75px,9vw,135px) max(clamp(22px,8vw,130px),calc((100% - 1280px)/2))}.sub-section h2{font:normal clamp(35px,4vw,61px)/1.08 var(--serif);letter-spacing:-.025em;margin:0 0 25px}.split-copy{display:grid;grid-template-columns:1fr 1fr;gap:clamp(45px,10vw,160px)}.split-copy>div:last-child{color:var(--muted);font-size:18px}.split-copy>div:last-child p{margin-top:0}.room-row{display:grid;grid-template-columns:60px 1fr auto;gap:35px;align-items:center;border-top:1px solid var(--line);padding:42px 0;transition:.25s}.room-row:last-child{border-bottom:1px solid var(--line)}.room-row:hover{padding-left:14px}.room-row>span{font-size:11px;color:var(--green-2)}.room-row small{color:var(--muted);text-transform:uppercase;letter-spacing:.1em}.room-row h2{margin:8px 0;font-size:clamp(34px,4vw,58px)}.room-row p{margin:0;color:var(--muted)}.room-row b{font-size:12px;text-transform:uppercase;letter-spacing:.08em}.fact-band{display:grid;grid-template-columns:repeat(4,1fr);background:var(--green);color:#fff;padding:44px max(clamp(22px,8vw,130px),calc((100% - 1280px)/2))}.fact-band div{border-right:1px solid rgba(255,255,255,.18);padding:8px 30px}.fact-band div:first-child{padding-left:0}.fact-band div:last-child{border:0}.fact-band strong,.fact-band span{display:block}.fact-band strong{font:normal 32px var(--serif)}.fact-band span{font-size:11px;text-transform:uppercase;letter-spacing:.09em;color:rgba(255,255,255,.65)}.image-text{display:grid;grid-template-columns:1.12fr .88fr;gap:clamp(45px,9vw,140px);align-items:center;background:var(--cream)}.image-text>img,.image-text>picture>img{height:560px}.check-list{list-style:none;padding:0;margin:25px 0}.check-list li{padding:13px 0 13px 29px;border-bottom:1px solid var(--line);position:relative}.check-list li:before{content:"✓";position:absolute;left:0;color:var(--green-2)}.feature-columns{display:grid;grid-template-columns:repeat(3,1fr);gap:55px}.feature-columns h2{font-size:38px}.notice{margin:0 max(clamp(22px,8vw,130px),calc((100% - 1280px)/2)) 0;background:var(--cream);padding:34px 40px;display:grid;grid-template-columns:220px 1fr;gap:30px}.notice strong{font:normal 23px var(--serif)}.notice p{margin:0;color:var(--muted)}.price-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px}.price-grid article{padding:50px;background:var(--cream)}.price-grid span{font-size:11px;text-transform:uppercase;letter-spacing:.1em;color:var(--green-2)}.price-grid h2{font-size:55px;margin:16px 0}.price-grid p{color:var(--muted)}.button-dark{background:var(--green);color:#fff;margin-top:15px}.button-outline{border:1px solid var(--green);color:var(--green);margin-top:12px}.request-box,.contact-layout{display:grid;grid-template-columns:1fr 1fr;gap:clamp(45px,10vw,150px);align-items:start}.contact-card{background:var(--cream);padding:40px}.contact-card span,.contact-card a{display:block}.contact-card span{font-size:10px;text-transform:uppercase;letter-spacing:.12em;color:var(--muted);margin:16px 0 4px}.contact-card>a:not(.button){font:normal clamp(20px,2.2vw,31px) var(--serif)}.family-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}.family-grid img{height:330px;object-position:top}.family-grid h2{font-size:31px;margin:20px 0 7px}.family-grid p{font-size:14px;color:var(--muted)}.history{background:var(--cream)}.activity-grid,.info-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:var(--line)}.activity-grid article,.info-grid article{background:#fff;padding:46px}.activity-grid span{color:var(--green-2);font-size:11px}.activity-grid h2,.info-grid h2{font-size:36px;margin:8px 0 15px}.activity-grid p,.info-grid p{color:var(--muted)}.faq-list{max-width:980px;margin:auto}.faq-list details{border-top:1px solid var(--line);padding:24px 0}.faq-list details:last-child{border-bottom:1px solid var(--line)}.faq-list summary{cursor:pointer;font:normal 24px var(--serif);padding-right:30px}.faq-list details p{color:var(--muted);max-width:760px}.number-list{list-style:none;padding:0}.number-list li{display:grid;grid-template-columns:180px 1fr;border-top:1px solid var(--line);padding:20px 0}.number-list span{color:var(--muted)}.gallery-grid{display:grid;grid-template-columns:repeat(12,1fr);grid-auto-rows:280px;gap:14px}.gallery-grid img:nth-child(1),.gallery-grid img:nth-child(4){grid-column:span 7}.gallery-grid img:nth-child(2),.gallery-grid img:nth-child(3){grid-column:span 5}.gallery-grid img:nth-child(5),.gallery-grid img:nth-child(6){grid-column:span 6}.blog-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}.blog-grid a{padding:45px;background:var(--cream);transition:.25s}.blog-grid a:hover{background:var(--green);color:#fff}.blog-grid span{font-size:10px;text-transform:uppercase;letter-spacing:.12em;color:var(--green-2)}.blog-grid h2{font-size:35px;margin:12px 0}.blog-grid p{color:var(--muted)}.blog-grid a:hover p,.blog-grid a:hover span{color:rgba(255,255,255,.7)}.mini-cta{padding:clamp(58px,6vw,78px) max(clamp(22px,8vw,130px),calc((100% - 1280px)/2));display:flex;align-items:end;justify-content:space-between;gap:50px;background:var(--cream);color:var(--ink);border-top:1px solid var(--line)}.mini-cta .eyebrow.light{color:var(--green-2)}.mini-cta .button-light{background:var(--green);color:#fff;margin-right:0}.mini-cta h2{font:normal clamp(35px,4vw,58px)/1.05 var(--serif);margin:0;max-width:780px}.article{padding:100px clamp(22px,15vw,260px)}.article h1{font:normal clamp(52px,6vw,86px)/.98 var(--serif);letter-spacing:-.04em;margin:0}.article-lead{font-size:22px;color:var(--muted);max-width:850px}.article-hero{height:520px;margin:50px 0 65px}.article-body{max-width:820px;margin:auto}.article-body section{margin:0 0 55px}.article-body h2{font:normal 38px var(--serif);margin-bottom:14px}.article-body p{color:var(--muted);font-size:18px}.legal{max-width:1050px}.legal h2{font-size:34px}.legal p{line-height:1.9;color:var(--muted)}
@media(max-width:900px){.feature-columns,.family-grid{grid-template-columns:1fr 1fr}.fact-band{grid-template-columns:1fr 1fr}.fact-band div:nth-child(2){border-right:0}.split-copy,.image-text,.request-box,.contact-layout{grid-template-columns:1fr}.image-text>img,.image-text>picture>img{height:430px}.sub-hero{height:68vh}.number-list li{grid-template-columns:1fr;gap:5px}}
@media(max-width:600px){.sub-hero{min-height:590px}.sub-hero>div:last-child{padding-bottom:65px}.sub-hero h1{font-size:50px}.sub-hero>div>p:last-child{font-size:16px}.room-row{grid-template-columns:35px 1fr}.room-row>b{display:none}.fact-band{grid-template-columns:1fr 1fr;padding:28px 18px}.fact-band div{padding:15px;border-bottom:1px solid rgba(255,255,255,.18)}.feature-columns,.family-grid,.activity-grid,.info-grid,.price-grid,.blog-grid{grid-template-columns:1fr}.family-grid img{height:390px}.notice{grid-template-columns:1fr;padding:28px;margin-left:22px;margin-right:22px}.gallery-grid{display:block}.gallery-grid img{height:280px;margin-bottom:12px}.mini-cta{align-items:flex-start;flex-direction:column}.article{padding:75px 22px}.article-hero{height:320px;margin:35px 0}.article h1{font-size:47px}}
.info-groups{display:grid;grid-template-columns:1fr 1fr;gap:70px 90px}.info-groups>div{border-top:1px solid var(--line);padding-top:30px}.info-groups p:last-child{color:var(--muted)}.booking-widget{max-width:1200px;margin:auto}.booking-intro{max-width:760px;margin-bottom:45px}.booking-intro p:last-child{color:var(--muted)}#deskline-widget{min-height:340px;border:1px solid var(--line);padding:25px;background:#fff}.form-layout{display:grid;grid-template-columns:.72fr 1.28fr;gap:clamp(45px,9vw,130px);align-items:start}.form-layout>div>p:last-child{color:var(--muted)}.modern-form{background:var(--cream);padding:clamp(25px,4vw,52px)}.modern-form label,.modern-form legend{font-size:12px;font-weight:bold;letter-spacing:.04em}.modern-form label:not(.choice){display:block;margin-bottom:20px}.modern-form input:not([type=checkbox]),.modern-form textarea{display:block;width:100%;margin-top:7px;border:1px solid rgba(23,63,54,.23);background:#fff;padding:14px 15px;font:16px var(--sans);color:var(--ink);border-radius:0}.modern-form input:focus,.modern-form textarea:focus{outline:2px solid var(--green-2);outline-offset:1px}.field-row{display:grid;grid-template-columns:1fr 1fr;gap:18px}.modern-form fieldset{border:0;padding:0;margin:5px 0 22px}.modern-form legend{margin-bottom:10px}.choice{display:flex!important;align-items:flex-start;gap:10px;font-weight:normal!important;margin:10px 0}.choice input{margin-top:5px}.consent{color:var(--muted);margin-top:22px}.direct-lines{margin:30px 0}.direct-lines a{display:block;font:normal clamp(22px,2.3vw,32px) var(--serif);margin:8px 0}.text-link{color:var(--green-2);text-decoration:underline;text-underline-offset:3px}
.info-facts{display:grid;grid-template-columns:repeat(3,1fr);padding:42px max(clamp(22px,8vw,130px),calc((100% - 1280px)/2));background:var(--green);color:#fff}.info-facts div{padding:8px 35px;border-right:1px solid rgba(255,255,255,.18)}.info-facts div:first-child{padding-left:0}.info-facts div:last-child{border:0}.info-facts strong,.info-facts span{display:block}.info-facts strong{font:normal clamp(25px,2.7vw,39px) var(--serif)}.info-facts span{margin-top:4px;font-size:12px;color:rgba(255,255,255,.68);text-transform:uppercase;letter-spacing:.08em}.info-visuals{display:grid;grid-template-columns:1.08fr .92fr;gap:18px}.info-visuals article{position:relative;min-height:580px;overflow:hidden}.info-visuals img{position:absolute;inset:0;width:100%;height:100%;filter:saturate(.9)}.info-visuals article:after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(8,31,24,.84),transparent 68%)}.info-visuals article>div{position:absolute;z-index:2;left:clamp(25px,4vw,55px);right:clamp(25px,4vw,55px);bottom:clamp(28px,4vw,52px);color:#fff}.info-visuals h2{font-size:clamp(37px,4vw,60px);max-width:590px;margin-bottom:14px}.info-visuals article>div>p:last-child{max-width:570px;margin:0;color:rgba(255,255,255,.78)}.compact-info{display:grid;grid-template-columns:.75fr 1.25fr;gap:clamp(50px,9vw,140px);background:var(--cream)}.compact-info-head{position:sticky;top:120px;align-self:start}.compact-details details{border-top:1px solid var(--line);padding:24px 0}.compact-details details:last-child{border-bottom:1px solid var(--line)}.compact-details summary{cursor:pointer;list-style:none;font:normal clamp(23px,2.2vw,31px) var(--serif);padding-right:35px;position:relative}.compact-details summary::-webkit-details-marker{display:none}.compact-details summary:after{content:"+";position:absolute;right:4px;color:var(--green-2)}.compact-details details[open] summary:after{content:"−"}.compact-details p{color:var(--muted);max-width:680px;margin:16px 0 4px}
@media(max-width:850px){.info-groups,.form-layout{grid-template-columns:1fr}nav{gap:13px;font-size:12px}}
@media(max-width:850px){.info-visuals,.compact-info{grid-template-columns:1fr}.compact-info-head{position:static}.info-visuals article{min-height:480px}}
@media(max-width:600px){.info-groups,.field-row{grid-template-columns:1fr}.modern-form{padding:26px 20px}.info-facts{grid-template-columns:1fr;padding-top:24px;padding-bottom:24px}.info-facts div,.info-facts div:first-child{padding:17px 0;border-right:0;border-bottom:1px solid rgba(255,255,255,.18)}.info-facts div:last-child{border-bottom:0}.info-visuals{padding-top:55px;padding-bottom:55px}.info-visuals article{min-height:420px}}
.room-gallery{background:#fff}.room-gallery>h2{max-width:800px}.room-gallery>div{display:grid;grid-template-columns:repeat(12,1fr);grid-auto-rows:clamp(210px,20vw,300px);gap:16px;margin-top:45px}.room-gallery figure{position:relative;min-width:0;min-height:0;margin:0;grid-column:span 5;overflow:hidden}.room-gallery figure:first-child{grid-column:span 7;grid-row:span 2}.room-gallery figure:nth-child(4),.room-gallery figure:nth-child(5){grid-column:span 6}.room-gallery img,.room-gallery figure:first-child img,.room-gallery figure:nth-child(5) img{width:100%;height:100%}.room-gallery figcaption{position:absolute;left:14px;bottom:14px;z-index:2;padding:7px 10px;background:rgba(255,255,255,.9);color:var(--ink);font-size:11px}.room-gallery figure:has(img[src*="ausblick-web-restauriert"]){grid-column:span 4}.room-gallery figure:nth-child(4):has(+ figure img[src*="ausblick-web-restauriert"]){grid-column:span 8}
@media(max-width:700px){.room-gallery>div{grid-template-columns:1fr;grid-auto-rows:auto}.room-gallery figure,.room-gallery figure:first-child,.room-gallery figure:nth-child(4),.room-gallery figure:nth-child(5),.room-gallery figure:has(img[src*="ausblick-web-restauriert"]),.room-gallery figure:nth-child(4):has(+ figure img[src*="ausblick-web-restauriert"]){grid-column:auto;grid-row:auto;height:auto;margin-bottom:6px}.room-gallery img,.room-gallery figure:first-child img,.room-gallery figure:nth-child(5) img{height:auto;aspect-ratio:16/10}.room-gallery figure:has(img[src*="ausblick-web-restauriert"]) img{aspect-ratio:585/335}}
.link-guide{background:var(--cream)}.section-headline{display:grid;grid-template-columns:.9fr 1.1fr;gap:60px;align-items:end;margin-bottom:55px}.section-headline h2{margin-bottom:0}.section-headline>p{color:var(--muted);max-width:480px;margin:0 0 7px}.destination-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(24px,3vw,48px)}.destination-grid article{min-width:0}.destination-grid h3{font:normal clamp(24px,2.1vw,32px) var(--serif);margin:0 0 22px;min-height:2.2em}.destination-grid img{width:100%;height:auto;aspect-ratio:230/330;object-fit:cover}.destination-links{margin-top:18px}.destination-links a{display:flex;align-items:center;gap:10px;padding:12px 2px;border-bottom:1px solid var(--line);font-size:15px;transition:.2s}.destination-links a:before{content:"›";display:grid;place-items:center;width:25px;height:25px;flex:0 0 25px;border:1px solid var(--line);border-radius:50%;color:var(--green-2);font-size:20px}.destination-links a:hover{color:var(--green-2);padding-left:5px}.destination-links a:hover:before{border-color:var(--green-2)}
@media(max-width:1050px){.destination-grid{grid-template-columns:1fr 1fr}.destination-grid h3{min-height:auto}}
@media(max-width:850px){.section-headline{grid-template-columns:1fr;gap:18px}.section-headline>p{margin:0}}
@media(max-width:600px){.destination-grid{grid-template-columns:1fr}.destination-grid article+article{margin-top:28px}}
.winter-facts{display:grid;grid-template-columns:repeat(4,1fr);padding:40px max(clamp(22px,8vw,130px),calc((100% - 1280px)/2));background:var(--green);color:#fff}.winter-facts div{padding:8px 30px;border-right:1px solid rgba(255,255,255,.18)}.winter-facts div:first-child{padding-left:0}.winter-facts div:last-child{border:0}.winter-facts strong,.winter-facts span{display:block}.winter-facts strong{font:normal clamp(27px,3vw,43px) var(--serif)}.winter-facts span{font-size:11px;text-transform:uppercase;letter-spacing:.09em;color:rgba(255,255,255,.66)}.winter-intro{display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(45px,9vw,140px);align-items:end}.winter-intro h2{margin-bottom:0}.winter-intro>p{color:var(--muted);font-size:18px;margin:0 0 7px}.winter-card-grid{padding-top:0;display:grid;grid-template-columns:repeat(3,1fr);gap:22px}.winter-card-grid article{background:var(--cream)}.winter-card-grid img{width:100%;height:265px}.winter-card-grid article>div{padding:32px}.winter-card-grid span{font-size:11px;color:var(--green-2)}.winter-card-grid h2{font-size:clamp(28px,2.6vw,39px);margin:8px 0 16px}.winter-card-grid p{color:var(--muted);font-size:15px}.winter-card-grid a,.advent-feature a{display:inline-block;margin-top:12px;color:var(--green-2);font-weight:bold;font-size:13px;border-bottom:1px solid currentColor}.berg-gesund{display:grid;grid-template-columns:1fr 1fr;gap:clamp(50px,9vw,140px);align-items:center;background:var(--green);color:#fff}.berg-gesund>div>p:not(.eyebrow){color:rgba(255,255,255,.73);max-width:660px}.berg-gesund ul{list-style:none;margin:0;padding:0}.berg-gesund li{position:relative;padding:17px 0 17px 28px;border-top:1px solid rgba(255,255,255,.18)}.berg-gesund li:last-child{border-bottom:1px solid rgba(255,255,255,.18)}.berg-gesund li:before{content:"✓";position:absolute;left:0;color:#dfc594}.advent-feature{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(45px,9vw,140px);align-items:center}.advent-feature img{height:540px}.winter-more{padding:60px max(clamp(22px,8vw,130px),calc((100% - 1280px)/2)) 85px;text-align:center;background:var(--cream)}.winter-more>p{font:normal 30px var(--serif);margin:0 0 25px}.winter-more>div{display:flex;flex-wrap:wrap;justify-content:center;gap:10px}.winter-more span{border:1px solid var(--line);background:#fff;padding:10px 17px;font-size:13px}.winter-more>a{display:inline-block;margin-top:28px;color:var(--green-2);font-weight:bold;border-bottom:1px solid currentColor}
@media(max-width:980px){.winter-card-grid{grid-template-columns:1fr 1fr}.winter-intro,.berg-gesund,.advent-feature{grid-template-columns:1fr}.advent-feature img{height:450px}}
@media(max-width:600px){.winter-facts{grid-template-columns:1fr 1fr;padding:25px 22px}.winter-facts div,.winter-facts div:first-child{padding:16px 10px;border-bottom:1px solid rgba(255,255,255,.18)}.winter-facts div:nth-child(2){border-right:0}.winter-card-grid{grid-template-columns:1fr}.winter-card-grid img{height:250px}.winter-card-grid article>div{padding:27px 23px}.advent-feature img{height:330px}}
.ski-amade-facts{display:grid;grid-template-columns:repeat(4,1fr);padding:44px max(clamp(22px,8vw,130px),calc((100% - 1280px)/2));background:#dfc594;color:var(--ink)}.ski-amade-facts div{padding:6px 30px;border-right:1px solid rgba(23,63,54,.18)}.ski-amade-facts div:first-child{padding-left:0}.ski-amade-facts div:last-child{border:0}.ski-amade-facts strong,.ski-amade-facts span{display:block}.ski-amade-facts strong{font:normal clamp(30px,3.5vw,50px) var(--serif)}.ski-amade-facts span{font-size:11px;text-transform:uppercase;letter-spacing:.1em;color:var(--muted)}.ski-amade-intro,.ski-benefit{display:grid;grid-template-columns:1fr 1fr;gap:clamp(50px,9vw,150px)}.ski-amade-intro>div:last-child,.ski-benefit>div:last-child{color:var(--muted);font-size:18px}.ski-amade-intro>div:last-child p:first-child,.ski-benefit>div:last-child p:first-child{margin-top:0}.ski-local{position:relative;min-height:680px;color:#fff;display:flex;align-items:flex-end}.ski-local>img,.ski-local>picture>img{position:absolute;inset:0;width:100%;height:100%}.ski-local:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(8,31,24,.88),rgba(8,31,24,.5))}.ski-local>div{position:relative;z-index:2;max-width:760px}.ski-local>div>p:not(.eyebrow){color:rgba(255,255,255,.78);font-size:18px}.local-piste-data{display:flex;flex-wrap:wrap;gap:10px;margin-top:28px}.local-piste-data span{background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.25);padding:12px 15px;font-size:12px}.local-piste-data b{font:normal 21px var(--serif);margin-right:5px}.ski-benefit a,.ski-highlight-grid a{display:inline-block;color:var(--green-2);font-size:13px;font-weight:bold;border-bottom:1px solid currentColor;margin-top:12px}.ski-highlights{background:var(--cream)}.ski-highlight-grid{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--line)}.ski-highlight-grid article{background:#fff;padding:42px}.ski-highlight-grid span{font-size:10px;text-transform:uppercase;letter-spacing:.12em;color:var(--green-2)}.ski-highlight-grid h2{font-size:35px;margin:10px 0 14px}.ski-highlight-grid p{color:var(--muted)}.ski-snow{display:grid;grid-template-columns:1fr 1fr;gap:clamp(50px,9vw,140px);align-items:center;background:var(--cream);color:var(--ink);padding-top:clamp(65px,7vw,100px);padding-bottom:clamp(65px,7vw,100px)}.ski-snow .eyebrow.light{color:var(--green-2)}.ski-snow>div:first-child>p:not(.eyebrow){color:var(--muted);font-size:17px}.ski-link-list a{display:flex;justify-content:space-between;gap:20px;border-top:1px solid var(--line);padding:18px 0;transition:.2s}.ski-link-list a:last-child{border-bottom:1px solid var(--line)}.ski-link-list a:hover{color:var(--green-2);padding-left:6px}.ski-link-list b{color:var(--green-2)}.ski-snow+.mini-cta{background:#fff;color:var(--ink);border-top:1px solid var(--line);padding-top:clamp(60px,7vw,90px);padding-bottom:clamp(60px,7vw,90px)}.ski-snow+.mini-cta .eyebrow.light{color:var(--green-2)}.ski-snow+.mini-cta .button-light{background:var(--green);color:#fff;margin-right:0}
.ski-region-list{display:flex;flex-wrap:wrap;gap:9px;margin:24px 0 8px}.ski-region-list span{border:1px solid var(--line);background:var(--cream);padding:8px 12px;color:var(--ink);font-size:12px}.ski-benefit-compact{display:grid;grid-template-columns:.85fr 1.15fr;gap:clamp(50px,8vw,125px);align-items:end}.ski-benefit-compact h2{margin-bottom:20px}.ski-benefit-compact>div:first-child>a{display:inline-block;color:var(--green-2);font-size:13px;font-weight:bold;border-bottom:1px solid currentColor}.ski-advantage-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.ski-advantage-grid article{border-top:2px solid var(--sand);padding-top:22px}.ski-advantage-grid strong,.ski-advantage-grid span{display:block}.ski-advantage-grid strong{font:normal 24px var(--serif)}.ski-advantage-grid span{margin-top:6px;color:var(--muted);font-size:13px}.section-headline.single{display:block;max-width:800px}
.ski-benefit-visual,.ski-highlights-visual{display:grid;grid-template-columns:1fr 1fr;gap:clamp(45px,7vw,110px);align-items:center}.ski-benefit-visual{background:#fff}.ski-benefit-visual>img,.ski-benefit-visual>picture>img,.ski-highlights-visual>img,.ski-highlights-visual>picture>img{height:590px}.ski-benefit-visual h2,.ski-highlights-visual h2{max-width:650px}.ski-benefit-visual>div>a{display:inline-block;margin-top:28px;color:var(--green-2);font-size:13px;font-weight:bold;border-bottom:1px solid currentColor}.ski-highlights-visual{background:var(--cream)}.ski-highlight-list{margin-top:35px}.ski-highlight-list a{display:grid;grid-template-columns:38px 1fr auto;gap:12px;align-items:center;padding:17px 0;border-top:1px solid var(--line)}.ski-highlight-list a:last-child{border-bottom:1px solid var(--line)}.ski-highlight-list span{font-size:11px;color:var(--green-2)}.ski-highlight-list strong{font:normal 23px var(--serif)}.ski-highlight-list small{color:var(--muted);font-size:12px}.ski-highlight-list a:hover strong{color:var(--green-2)}
@media(max-width:850px){.ski-amade-intro,.ski-benefit,.ski-benefit-compact,.ski-benefit-visual,.ski-highlights-visual,.ski-snow{grid-template-columns:1fr}.ski-local{min-height:600px}.ski-benefit-visual>img,.ski-benefit-visual>picture>img,.ski-highlights-visual>img,.ski-highlights-visual>picture>img{height:460px}.ski-highlights-visual>img,.ski-highlights-visual>picture>img{order:-1}}
@media(max-width:600px){.ski-amade-facts{grid-template-columns:1fr 1fr;padding:26px 22px}.ski-amade-facts div,.ski-amade-facts div:first-child{padding:16px 10px;border-bottom:1px solid rgba(23,63,54,.18)}.ski-amade-facts div:nth-child(2){border-right:0}.ski-highlight-grid,.ski-advantage-grid{grid-template-columns:1fr}.ski-highlight-grid article{padding:32px 24px}.ski-local{min-height:650px}.brand-logo{height:50px;max-width:170px}.ski-benefit-visual>img,.ski-benefit-visual>picture>img,.ski-highlights-visual>img,.ski-highlights-visual>picture>img{height:340px}.ski-highlight-list a{grid-template-columns:30px 1fr}.ski-highlight-list small{grid-column:2}}
.grossarl-profile{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(55px,9vw,140px);align-items:center;background:#fff}.grossarl-profile>div:first-child>p:not(.eyebrow){max-width:680px;color:var(--muted)}.grossarl-profile .text-link{display:inline-block;margin-top:12px;font-weight:600}.place-facts{display:grid;grid-template-columns:1fr 1fr;gap:0 32px}.place-facts div{padding:25px 0;border-top:1px solid var(--line)}.place-facts div:nth-last-child(-n+2){border-bottom:1px solid var(--line)}.place-facts strong,.place-facts span{display:block}.place-facts strong{font:normal clamp(30px,3vw,43px) var(--serif);color:var(--green)}.place-facts span{margin-top:3px;color:var(--muted);font-size:12px;text-transform:uppercase;letter-spacing:.08em}@media(max-width:800px){.grossarl-profile{grid-template-columns:1fr}.place-facts{margin-top:5px}}@media(max-width:480px){body{font-size:16px}.place-facts{grid-template-columns:1fr}.place-facts div:nth-last-child(-n+2){border-bottom:0}.place-facts div:last-child{border-bottom:1px solid var(--line)}}
.apartment-overview{padding-top:clamp(55px,7vw,95px);padding-bottom:clamp(70px,8vw,120px)}.apartment-showcase{border-top:1px solid var(--line)}.apartment-teaser{display:grid;grid-template-columns:minmax(320px,.82fr) 1.18fr;gap:clamp(40px,7vw,110px);align-items:center;padding:44px 0;border-bottom:1px solid var(--line)}.apartment-teaser:nth-child(even){grid-template-columns:1.18fr minmax(320px,.82fr)}.apartment-teaser:nth-child(even) figure{order:2}.apartment-teaser figure{height:310px;margin:0;overflow:hidden}.apartment-teaser-copy{position:relative;padding:12px 0}.apartment-teaser-copy>span{position:absolute;right:0;top:8px;color:var(--green-2);font-size:12px;letter-spacing:.1em}.apartment-teaser-copy small{display:block;color:var(--muted);font-size:12px;text-transform:uppercase;letter-spacing:.11em}.apartment-teaser h2{margin:12px 0 14px;font-size:clamp(38px,4.2vw,64px)}.apartment-teaser p{max-width:650px;margin:0 0 22px;color:var(--muted)}.apartment-teaser b{font-size:12px;text-transform:uppercase;letter-spacing:.08em;border-bottom:1px solid var(--green-2);padding-bottom:3px}@media(max-width:850px){.apartment-teaser,.apartment-teaser:nth-child(even){grid-template-columns:1fr;gap:28px}.apartment-teaser:nth-child(even) figure{order:0}.apartment-teaser figure{height:clamp(270px,56vw,420px)}}@media(max-width:480px){.apartment-teaser{padding:34px 0}.apartment-teaser-copy>span{position:static;margin-bottom:8px}.apartment-teaser h2{font-size:38px}}
.alm-facts{display:grid;grid-template-columns:repeat(4,1fr);padding:42px max(clamp(22px,8vw,130px),calc((100% - 1280px)/2));background:var(--sand);color:var(--ink)}.alm-facts div{padding:6px 30px;border-right:1px solid rgba(23,63,54,.2)}.alm-facts div:first-child{padding-left:0}.alm-facts div:last-child{border:0}.alm-facts strong,.alm-facts span{display:block}.alm-facts strong{font:normal clamp(27px,3vw,43px) var(--serif)}.alm-facts span{font-size:11px;text-transform:uppercase;letter-spacing:.09em;color:var(--muted)}.alm-intro{background:#fff}.alm-story,.almenweg-feature{display:grid;grid-template-columns:1.08fr .92fr;gap:clamp(45px,8vw,125px);align-items:center;background:var(--cream)}.alm-story img,.almenweg-feature img{height:560px}.alm-story>div>p:not(.eyebrow),.almenweg-feature>div>p:not(.eyebrow){color:var(--muted)}.alm-story .text-link{display:inline-block;margin-top:18px;font-weight:600}.alm-choices{background:#fff}.alm-choice-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}.alm-choice-grid article{padding:36px;border-top:2px solid var(--sand);background:var(--cream)}.alm-choice-grid span{color:var(--green-2);font-size:11px}.alm-choice-grid h3{font:normal 31px var(--serif);margin:14px 0}.alm-choice-grid p{margin:0;color:var(--muted)}.almenweg-feature{background:var(--green);color:#fff}.almenweg-feature>div>p:not(.eyebrow){color:rgba(255,255,255,.74)}.almenweg-feature .button-dark{background:var(--sand);color:var(--ink)}.alm-planning{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(50px,9vw,140px);background:#fff}.alm-tip-list p{display:grid;grid-template-columns:190px 1fr;gap:25px;margin:0;padding:20px 0;border-top:1px solid var(--line)}.alm-tip-list p:last-of-type{border-bottom:1px solid var(--line)}.alm-tip-list span{color:var(--muted)}.alm-tip-list .text-link{display:inline-block;margin-top:24px;font-weight:600}@media(max-width:900px){.alm-facts{grid-template-columns:1fr 1fr}.alm-facts div:nth-child(2){border-right:0}.alm-story,.almenweg-feature,.alm-planning{grid-template-columns:1fr}.almenweg-feature img{order:-1}.alm-story img,.almenweg-feature img{height:440px}.alm-choice-grid{grid-template-columns:1fr}}@media(max-width:540px){.alm-facts{padding:26px 22px}.alm-facts div,.alm-facts div:first-child{padding:16px 10px;border-bottom:1px solid rgba(23,63,54,.18)}.alm-facts div:nth-last-child(-n+2){border-bottom:0}.alm-story img,.almenweg-feature img{height:320px}.alm-choice-grid article{padding:30px 24px}.alm-tip-list p{grid-template-columns:1fr;gap:5px}}
.faq-overview{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(45px,9vw,140px);align-items:end;background:var(--cream);padding-top:clamp(65px,7vw,100px);padding-bottom:clamp(65px,7vw,100px)}.faq-overview h2{margin-bottom:0}.faq-overview>p{color:var(--muted);font-size:18px;margin:0 0 7px}.faq-list{max-width:none;margin:0;background:#fff;padding-top:clamp(65px,8vw,115px);padding-bottom:clamp(65px,8vw,115px)}.faq-group{display:grid;grid-template-columns:.72fr 1.28fr;gap:clamp(45px,8vw,125px);padding:0 0 clamp(65px,8vw,105px)}.faq-group:last-child{padding-bottom:0}.faq-group-title{display:flex;gap:25px;align-items:flex-start}.faq-group-title>span{margin-top:6px;color:var(--green-2);font-size:11px}.faq-group-title h2{font-size:clamp(34px,3.5vw,52px);margin:0}.faq-group-title .eyebrow{margin-bottom:10px}.faq-items details{border-top:1px solid var(--line);padding:22px 0}.faq-items details:last-child{border-bottom:1px solid var(--line)}.faq-items summary{cursor:pointer;list-style:none;position:relative;padding:0 42px 0 0;font:normal clamp(21px,2vw,28px)/1.25 var(--serif)}.faq-items summary::-webkit-details-marker{display:none}.faq-items summary:after{content:"+";position:absolute;right:5px;top:-2px;color:var(--green-2);font:normal 27px var(--sans)}.faq-items details[open] summary:after{content:"−"}.faq-items details p{max-width:750px;margin:16px 42px 2px 0;color:var(--muted)}.faq-contact{padding:clamp(65px,8vw,110px) max(clamp(22px,8vw,130px),calc((100% - 1280px)/2));display:grid;grid-template-columns:1fr auto;gap:60px;align-items:end;background:var(--green);color:#fff}.faq-contact h2{font:normal clamp(38px,4.5vw,65px)/1.05 var(--serif);margin:0}.faq-contact>div:first-child>p:last-child{max-width:660px;color:rgba(255,255,255,.72)}.faq-contact>div:last-child{text-align:right}.faq-contact .button-light{margin:0 0 15px}.faq-phone{display:block;font:normal 22px var(--serif)}@media(max-width:850px){.faq-overview,.faq-group,.faq-contact{grid-template-columns:1fr}.faq-group{gap:30px}.faq-contact{gap:25px}.faq-contact>div:last-child{text-align:left}}@media(max-width:520px){.faq-group-title{gap:14px}.faq-group-title>span{display:none}.faq-items details p{margin-right:10px}.faq-contact .button-light{width:100%}}
.floorplan-section{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(50px,9vw,140px);align-items:center;background:var(--cream)}.floorplan-copy>p:not(.eyebrow){max-width:650px;color:var(--muted)}.floorplan-facts{display:flex;flex-wrap:wrap;gap:9px;margin-top:30px}.floorplan-facts span{padding:9px 13px;border:1px solid var(--line);background:#fff;font-size:12px}.floorplan-image{display:block;text-align:center;background:#fff;padding:clamp(24px,4vw,55px);border:1px solid var(--line)}.floorplan-image img{width:100%;height:min(500px,55vw);object-fit:contain}@media(max-width:850px){.floorplan-section{grid-template-columns:1fr}.floorplan-image{max-width:720px;width:100%}.floorplan-image img{height:min(500px,75vw)}}@media(max-width:480px){.floorplan-image{padding:20px 14px}.floorplan-image img{height:100vw}.floorplan-facts{display:grid;grid-template-columns:1fr 1fr}.floorplan-facts span{font-size:11px}}

.section-heading{max-width:850px;margin-bottom:clamp(48px,7vw,90px)}.section-heading>p:last-child{max-width:670px;color:var(--muted);font-size:18px}.apartment-details{background:#fff}.room-stories{display:grid;gap:clamp(65px,10vw,150px)}.room-story{display:grid;grid-template-columns:minmax(0,1.14fr) minmax(300px,.86fr);gap:clamp(42px,8vw,125px);align-items:center}.room-story:nth-child(even) figure{order:2}.room-story figure{margin:0;overflow:hidden;border:1px solid rgba(23,63,54,.08);border-radius:12px;box-shadow:0 24px 58px rgba(23,63,54,.13),0 4px 14px rgba(51,47,40,.07)}.room-story figure img{width:100%;height:clamp(380px,45vw,650px);object-fit:cover}.room-story:has(img[src*="ausblick-web-restauriert"]) figure img{height:auto;aspect-ratio:585/335}.room-story>div>p:not(.eyebrow){color:var(--muted);font-size:18px;max-width:520px}.room-story ul{list-style:none;padding:0;margin:30px 0 0;display:grid;grid-template-columns:1fr}.room-story li{border-top:1px solid var(--line);padding:12px 0;font-size:14px}.room-story li:last-child{border-bottom:1px solid var(--line)}.room-story li:before{content:"";display:inline-block;width:6px;height:6px;margin:0 15px 2px 4px;border-radius:50%;background:var(--green-2);box-shadow:0 0 0 4px rgba(220,201,165,.42)}.apartment-amenities{background:var(--cream)}.amenities-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);border:1px solid var(--line)}.amenities-grid article{background:#fff;padding:32px}.amenities-grid span{font-size:10px;letter-spacing:.12em;color:var(--green-2)}.amenities-grid h3{font:normal 25px var(--serif);margin:18px 0 9px}.amenities-grid p{margin:0;color:var(--muted);font-size:14px}.sauna-note{margin-top:24px;background:var(--green);color:#fff;padding:clamp(32px,5vw,60px);display:grid;grid-template-columns:1fr 1fr;gap:50px;align-items:end}.sauna-note h3{font:normal clamp(30px,3.5vw,48px)/1.08 var(--serif);margin:0}.sauna-note>p{margin:0;color:rgba(255,255,255,.72);max-width:520px}
@media(max-width:900px){.room-story{grid-template-columns:1fr;gap:34px}.room-story:nth-child(even) figure{order:0}.room-story figure img{height:min(620px,70vw)}.amenities-grid{grid-template-columns:1fr 1fr}.sauna-note{grid-template-columns:1fr}}
@media(max-width:560px){.room-story ul{grid-template-columns:1fr}.room-story figure img{height:72vw}.amenities-grid{grid-template-columns:1fr}.amenities-grid article{padding:25px}.apartment-details .section-heading{margin-bottom:55px}}
.hero,.sub-hero{overflow:hidden}.hero>img,.hero>picture>img,.sub-hero>img,.sub-hero>picture>img{animation:hero-camera-zoom 9s cubic-bezier(.2,.55,.3,1) both;transform-origin:center center}@keyframes hero-camera-zoom{from{transform:scale(1)}to{transform:scale(1.075)}}@media(prefers-reduced-motion:reduce){.hero>img,.hero>picture>img,.sub-hero>img,.sub-hero>picture>img{animation:none;transform:none}}
.host-welcome{background:#fff}.host-welcome-main{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(48px,8vw,125px);align-items:center}.host-welcome-main figure{height:clamp(470px,48vw,680px);margin:0;overflow:hidden;border-radius:12px;box-shadow:0 24px 58px rgba(23,63,54,.13),0 4px 14px rgba(51,47,40,.07)}.host-welcome-main figure img{object-position:center}.host-welcome-copy>p:not(.eyebrow):not(.host-names){color:var(--muted);font-size:18px;max-width:650px}.host-names{margin-top:34px;padding-top:22px;border-top:1px solid var(--line);color:var(--muted);font-size:12px;text-transform:uppercase;letter-spacing:.1em}.host-names strong{display:block;margin-top:5px;color:var(--ink);font:normal 23px var(--serif);text-transform:none;letter-spacing:0}.host-value-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:clamp(55px,7vw,90px)}.host-value-grid article{padding:34px;background:var(--cream);border-top:3px solid var(--sand)}.host-value-grid span{color:var(--green-2);font-size:11px;letter-spacing:.12em}.host-value-grid h3{font:normal 29px var(--serif);margin:18px 0 10px}.host-value-grid p{margin:0;color:var(--muted);font-size:15px}@media(max-width:880px){.host-welcome-main{grid-template-columns:1fr}.host-welcome-main figure{height:min(620px,72vw)}.host-value-grid{grid-template-columns:1fr}}@media(max-width:520px){.host-welcome-main figure{height:78vw}.host-value-grid article{padding:28px 24px}}
.grossarl-profile{position:relative;isolation:isolate;min-height:720px;background:url("assets/ausblick-vom-haus-grossarltal-sommer-1729-2026-09-07-Vers.01.webp") center 48%/cover no-repeat}.grossarl-profile:before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(10,34,27,.24),rgba(10,34,27,.1)),linear-gradient(0deg,rgba(10,31,25,.2),rgba(10,31,25,.03))}.grossarl-profile>div:first-child,.grossarl-profile .place-facts{padding:clamp(30px,4vw,55px);border:1px solid rgba(255,255,255,.56);border-radius:12px;background:rgba(250,248,242,.9);box-shadow:0 22px 55px rgba(13,38,30,.2);backdrop-filter:blur(7px);-webkit-backdrop-filter:blur(7px)}.grossarl-profile .place-facts{gap:0 32px}.grossarl-profile .place-facts div{border-color:rgba(27,37,33,.16)}@media(max-width:800px){.grossarl-profile{min-height:0;background-position:56% center}.grossarl-profile>div:first-child,.grossarl-profile .place-facts{padding:30px}}@media(max-width:480px){.grossarl-profile{background-position:60% center}.grossarl-profile>div:first-child,.grossarl-profile .place-facts{padding:25px 22px;border-radius:9px}}
.gallery-showcase{background:#fff}.gallery-intro{display:grid;grid-template-columns:1.15fr .65fr;gap:clamp(45px,9vw,140px);align-items:end;margin-bottom:52px}.gallery-intro h2{margin-bottom:0}.gallery-intro>p{max-width:520px;margin:0 0 7px;color:var(--muted);font-size:18px}.gallery-filter{display:flex;flex-wrap:wrap;gap:9px;margin-bottom:28px;padding-bottom:24px;border-bottom:1px solid var(--line)}.gallery-filter button{padding:11px 17px;border:1px solid var(--line);border-radius:999px;background:#fff;color:var(--muted);font:600 13px var(--sans);cursor:pointer;transition:background .2s,color .2s,border-color .2s}.gallery-filter button:hover,.gallery-filter button.active{border-color:var(--green);background:var(--green);color:#fff}.gallery-filter button:focus-visible,.gallery-card:focus-visible{outline:3px solid rgba(196,166,116,.55);outline-offset:3px}.gallery-grid-modern{display:grid;grid-template-columns:repeat(12,1fr);grid-auto-rows:145px;grid-auto-flow:dense;gap:16px}.gallery-card{position:relative;grid-column:span 4;grid-row:span 2;min-width:0;min-height:0;padding:0;overflow:hidden;border:0;border-radius:10px;background:var(--cream);box-shadow:0 12px 32px rgba(27,37,33,.09);cursor:zoom-in;text-align:left;transition:transform .22s ease,box-shadow .22s ease}.gallery-card.wide{grid-column:span 8}.gallery-card.tall{grid-row:span 3}.gallery-card.feature{grid-column:span 8;grid-row:span 3}.gallery-card[hidden]{display:none}.gallery-card img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.gallery-card:after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(8,31,24,.8),transparent 54%);opacity:.82;transition:opacity .2s ease}.gallery-card>span{position:absolute;left:24px;right:24px;bottom:20px;z-index:2;color:#fff;font:normal 23px/1.15 var(--serif)}.gallery-card small{display:block;margin-bottom:7px;color:rgba(255,255,255,.85);font:600 10px/1.2 var(--sans);text-transform:uppercase;letter-spacing:.13em}.gallery-card:hover{transform:translateY(-3px);box-shadow:0 18px 40px rgba(27,37,33,.16)}.gallery-card:hover:after{opacity:1}.gallery-lightbox{width:min(1180px,calc(100vw - 42px));max-width:none;padding:0;border:0;border-radius:10px;background:#171b19;color:#fff;box-shadow:0 30px 90px rgba(0,0,0,.45)}.gallery-lightbox::backdrop{background:rgba(10,18,15,.84);backdrop-filter:blur(5px)}.gallery-lightbox figure{display:grid;grid-template-rows:minmax(0,1fr) auto;width:100%;height:min(86vh,850px);margin:0}.gallery-lightbox img{width:100%;height:100%;min-height:0;object-fit:contain}.gallery-lightbox figcaption{padding:15px 24px;color:rgba(255,255,255,.78);font-size:14px}.gallery-lightbox-close{position:absolute;top:14px;right:14px;z-index:2;width:44px;height:44px;border:1px solid rgba(255,255,255,.3);border-radius:50%;background:rgba(15,28,23,.78);color:#fff;font:300 28px/1 var(--sans);cursor:pointer}.gallery-lightbox-close:hover{background:#fff;color:var(--ink)}@media(max-width:900px){.gallery-intro{grid-template-columns:1fr;gap:22px}.gallery-grid-modern{grid-auto-rows:130px}.gallery-card{grid-column:span 6}.gallery-card.wide,.gallery-card.feature{grid-column:span 12}.gallery-card.feature{grid-row:span 3}}@media(max-width:600px){.gallery-showcase{padding-left:18px;padding-right:18px}.gallery-intro{margin-bottom:36px}.gallery-filter{flex-wrap:nowrap;overflow-x:auto;margin-left:-18px;margin-right:-18px;padding-left:18px;padding-right:18px;scrollbar-width:none}.gallery-filter::-webkit-scrollbar{display:none}.gallery-filter button{flex:0 0 auto}.gallery-grid-modern{display:block}.gallery-card,.gallery-card.wide,.gallery-card.tall,.gallery-card.feature{display:block;width:100%;height:auto;aspect-ratio:4/3;margin-bottom:14px}.gallery-card.feature,.gallery-card.wide{aspect-ratio:16/10}.gallery-card[hidden]{display:none}.gallery-card>span{left:18px;right:18px;bottom:17px;font-size:21px}.gallery-lightbox{width:calc(100vw - 22px)}.gallery-lightbox figure{height:80vh}}
.gallery-hero{display:grid;grid-template-columns:.78fr 1.22fr;gap:clamp(45px,7vw,105px);align-items:center;min-height:560px;padding:70px max(clamp(22px,8vw,130px),calc((100% - 1280px)/2));overflow:hidden;background:var(--cream)}.gallery-hero-copy{position:relative;z-index:2}.gallery-hero h1{margin:0;font:normal clamp(58px,6.5vw,94px)/.92 var(--serif);letter-spacing:-.04em}.gallery-hero-copy>p:last-child{max-width:520px;margin:27px 0 0;color:var(--muted);font-size:18px}.gallery-hero-images{position:relative;height:430px}.gallery-hero-images figure{position:absolute;margin:0;overflow:hidden;border:7px solid rgba(255,255,255,.9);border-radius:10px;background:#ddd6c9;box-shadow:0 20px 52px rgba(23,63,54,.16)}.gallery-hero-images img{width:100%;height:100%;object-fit:cover}.gallery-hero-house{inset:0 27% 12% 0;z-index:1}.gallery-hero-house img{object-position:center}.gallery-hero-summer{width:40%;height:47%;right:0;top:0;z-index:2}.gallery-hero-winter{width:46%;height:49%;right:4%;bottom:0;z-index:3}@media(max-width:900px){.gallery-hero{grid-template-columns:1fr;gap:42px;padding-top:72px}.gallery-hero-images{height:410px}}@media(max-width:560px){.gallery-hero{min-height:0;padding:62px 18px 52px}.gallery-hero h1{font-size:56px}.gallery-hero-copy>p:last-child{font-size:16px}.gallery-hero-images{height:315px}.gallery-hero-images figure{border-width:4px;border-radius:7px}.gallery-hero-house{right:19%;bottom:8%}.gallery-hero-summer{width:43%;height:42%}.gallery-hero-winter{width:48%;height:44%;right:1%}}
@media(min-width:1281px){.site-header{height:102px;padding-left:max(clamp(34px,4.5vw,76px),calc((100% - 1280px)/2));padding-right:max(clamp(34px,4.5vw,76px),calc((100% - 1280px)/2))}.brand-logo{height:66px;max-width:235px}.site-header nav{gap:clamp(28px,2.6vw,48px);font-size:16px;font-weight:600}.site-header nav a:not(.nav-cta){padding:19px 1px;letter-spacing:.012em}.site-header nav a:not(.nav-cta):after{left:50%;right:50%;bottom:9px;height:2px;background:var(--sand)}.site-header nav a:not(.nav-cta):hover:after{left:0;right:0}.site-header .nav-cta{padding:14px 23px;border-color:var(--green);border-radius:4px;background:var(--green);color:#fff;box-shadow:0 8px 20px rgba(23,63,54,.16)}.site-header .nav-cta:hover{background:var(--green-2);transform:translateY(-2px);box-shadow:0 12px 25px rgba(23,63,54,.22)}.hero{height:calc(100svh - 102px)}}@media(min-width:781px) and (max-width:1280px){.menu-toggle{display:block}.site-header nav{display:none;position:absolute;left:0;right:0;top:88px;padding:28px clamp(28px,7vw,70px);flex-direction:column;align-items:stretch;gap:7px;background:#fff;box-shadow:0 18px 35px rgba(23,63,54,.14)}.site-header nav.open{display:flex}.site-header nav a{padding:12px 0;font-size:16px}.site-header nav .nav-cta{margin-top:8px;text-align:center}.site-header nav a:not(.nav-cta):after{bottom:5px}}

/* Deskline needs a wide, neutral stage. The booking app brings its own layout. */
.booking-widget{width:100%;max-width:none;margin:0;padding-left:clamp(16px,3vw,48px);padding-right:clamp(16px,3vw,48px)}
.booking-intro{width:min(760px,100%);margin:0 auto 45px}
#deskline-widget{width:100%;max-width:1500px;min-height:560px;margin:0 auto;padding:clamp(12px,2vw,26px);overflow:visible}
#deskline-widget img{width:auto;max-width:100%;height:auto;object-fit:contain}
@media(max-width:780px){.booking-widget{padding-left:12px;padding-right:12px}.booking-intro{padding-left:10px;padding-right:10px;margin-bottom:30px}#deskline-widget{padding:6px;border-left:0;border-right:0;min-height:720px}}

.price-grid .season-period{display:flex;flex-direction:column;gap:7px;margin:22px 0 4px;padding:14px 17px;border-left:3px solid var(--sand);background:rgba(255,255,255,.62)}
.price-grid .season-period strong{font-size:15px;line-height:1.35;font-weight:650;color:var(--ink)}

.sub-hero-about h1{line-height:1.04}

/* Abwechslungsreiche Bildgrößen in vollständig gefüllten Gruppen. */
.gallery-grid-modern{grid-auto-rows:clamp(36px,5vw,76px)}
.gallery-grid-modern .gallery-card{grid-column:span var(--bild-spalten,6);grid-row:span var(--bild-zeilen,4)}
@media(min-width:601px) and (max-width:900px){.gallery-card>span{left:16px;right:16px;bottom:15px;font-size:19px}}
@media(max-width:600px){.gallery-grid-modern .gallery-card{aspect-ratio:var(--bild-format,3/2)}}

/* Startseite: gezielte Bildauswahl, ruhigere Texte und bessere Lesbarkeit. */
.startseite .section{padding-top:clamp(55px,8vw,125px);padding-bottom:clamp(55px,8vw,125px)}
.startseite .intro{padding-top:clamp(55px,6vw,85px);padding-bottom:clamp(55px,6vw,85px)}
.startseite .eyebrow,.startseite .section-label{font-size:13px;letter-spacing:.15em}
.startseite .quick-facts span,.startseite .card-meta,.startseite .card-image>span,.startseite .host-copy small,.startseite .season-card span{font-size:12px}
.startseite .card-body a,.startseite .season-card a,.startseite .button{font-size:14px}
.startseite .card-body>p:not(.card-meta){font-size:16px}
.startseite .wellness-note span{font-size:12px}
.startseite .location{min-height:0}
.startseite .location-copy{padding:clamp(50px,6vw,95px)}
.startseite .location-image{position:relative;margin:0;min-height:0;overflow:hidden}
.startseite .location-image img{object-position:57% center}
.startseite /* Winterbild beim Überfahren. Liegt deckungsgleich über dem Sommerbild und
   wird eingeblendet. Nur bei echtem Zeigergerät: Auf Touch gibt es kein
   Hover, dort bliebe das Bild sonst nach einem Tipp hängen. Das Motiv ist
   rein dekorativ, deshalb leerer alt-Text und aria-hidden. */
.location-image .winterbild{position:absolute;inset:0;opacity:0;transition:opacity .55s ease;pointer-events:none}
@media(hover:hover) and (pointer:fine){.location-image:hover .winterbild{opacity:1}}
@media(prefers-reduced-motion:reduce){.location-image .winterbild{transition:none}}
.location-image figcaption{position:absolute;left:20px;bottom:20px;background:rgba(23,63,54,.85);padding:8px 14px;font-size:14px;color:#fff}
.startseite .wellness-image{height:460px;overflow:hidden}
.startseite .wellness-image img{object-position:48% center}
.startseite .host{gap:clamp(30px,6vw,90px);align-items:center}
.startseite .menu-toggle{cursor:pointer}
.startseite .menu-toggle span{height:2px;width:27px;background:var(--green)}
.startseite .apartments .section-head{grid-template-columns:1fr 1fr}
.startseite .apartment-intro-line{white-space:normal;max-width:440px!important}
@media(min-width:1101px){
 /* Einzeilig ab 1101px. Die gleichlautende Regel weiter oben greift nicht:
    sie heisst nur .apartment-intro-line, waehrend .startseite .apartment-intro-line
    zwei Selektoren hat und damit gewinnt. Media Queries erhoehen die
    Spezifitaet NICHT. Deshalb hier mit demselben Praefix. */
 .startseite .apartment-intro-line{white-space:nowrap;max-width:none!important}
 .startseite .site-header{padding-left:28px;padding-right:28px;height:88px;gap:24px}
 .startseite .brand-logo{max-width:185px;height:58px}
 .startseite .menu-toggle{display:none}
 .startseite .site-header nav{display:flex;position:static;flex-direction:row;align-items:center;gap:18px;padding:0;box-shadow:none;font-size:14px;white-space:nowrap}
 .startseite .site-header nav a{font-size:14px;padding:12px 0}
 .startseite .site-header nav .nav-cta{padding:12px 14px;margin:0;letter-spacing:0}
 .startseite .hero{height:calc(100svh - 88px)}
}
@media(min-width:781px) and (max-width:1100px){.startseite .menu-toggle{display:block}.startseite .site-header nav{display:none}.startseite .site-header nav.open{display:flex}}
@media(max-width:780px){
 .startseite .hero{display:flex;flex-direction:column;min-height:0;height:auto;background:var(--green)}.startseite .hero>img,.startseite .hero>picture>img{position:relative;inset:auto;height:auto;aspect-ratio:16/9;object-position:center;animation:none;transform:none}
 .startseite .hero-shade{display:none}
 .startseite .hero-content{width:auto;margin:0;padding:32px 22px 36px}
 .startseite .hero h1{font-size:clamp(37px,7vw,51px);line-height:1.04}
 .startseite .hero-lead{margin:22px 0 26px}
 .startseite .quick-facts{position:relative;width:100%;padding:14px 12px}
 .startseite .apartments .section-head{grid-template-columns:1fr}
 .startseite .location-image{height:auto;aspect-ratio:1170/670}
 .startseite .wellness-image{height:auto;aspect-ratio:3/2}
 .startseite .host{gap:28px}
}

/* Belegte Gästestimmen mit datierter Google-Gesamtbewertung. */
.startseite .gaestestimmen{background:#fff}
.gaestestimmen-kopf{display:flex;justify-content:space-between;align-items:center;gap:35px;margin-bottom:36px}
.startseite .gaestestimmen h2{font-size:clamp(38px,4.5vw,64px);line-height:1.08}
.google-bewertung{flex-shrink:0;border-left:2px solid var(--sand);padding-left:28px}
.google-bewertung>strong{font:normal 52px/1.1 var(--serif);color:var(--green)}
.google-bewertung strong span{font:normal 22px var(--sans);color:var(--muted)}
.google-bewertung p{margin:7px 0 0;font-size:16px}
.google-bewertung small{font-size:13px;color:var(--muted)}
.gaestestimmen-raster{display:grid;grid-template-columns:1fr 1fr;gap:24px}
.gaestestimmen-raster figure{margin:0;background:var(--cream);padding:clamp(25px,3vw,44px);display:flex;flex-direction:column;justify-content:space-between;border-top:3px solid var(--sand)}
.gaestestimmen-raster blockquote{margin:0 0 30px;font:normal clamp(24px,2.5vw,34px)/1.35 var(--serif)}
.gaestestimmen-raster figcaption strong,.gaestestimmen-raster figcaption span{display:block}
.gaestestimmen-raster figcaption span{font-size:14px;color:var(--muted);margin:4px 0 10px}
.gaestestimmen-raster a,.gaestestimmen-link{font-size:14px;text-decoration:underline;text-underline-offset:4px;color:var(--green)}
.gaestestimmen-link{display:inline-block;margin-top:28px;font-weight:600}
@media(max-width:680px){.gaestestimmen-kopf{align-items:flex-start;flex-direction:column;gap:25px}.gaestestimmen-raster{grid-template-columns:1fr}.google-bewertung{padding-left:20px}}

/* Kompakter Einstieg für die Direktbuchung. */
.buchung-kopf{display:grid;grid-template-columns:1.2fr .8fr;gap:clamp(25px,5vw,70px);align-items:center;padding:38px max(clamp(22px,8vw,130px),calc((100% - 1280px)/2));background:var(--cream)}
.buchung-kopf .eyebrow{font-size:13px;margin-bottom:14px;letter-spacing:.14em}
.buchung-kopf h1{margin:0;font:normal clamp(38px,4.3vw,64px)/1.05 var(--serif);letter-spacing:-.035em}
.buchung-kopf-text>p:not(.eyebrow){max-width:640px;margin:18px 0 12px;color:var(--muted);font-size:17px;line-height:1.55}
.buchung-kopf-text>a{font-size:14px;color:var(--green);text-decoration:underline;text-underline-offset:4px}
.buchung-kopf-bilder{position:relative;height:230px}
/* Hero der Direktbuchung: kurze Frage, darunter der Knopf. Der Knopf hat
   seinen eigenen Abstand, damit er nicht am Text klebt. */
.buchung-kopf-frage{margin:22px 0 10px;font-family:var(--serif);font-size:19px;color:var(--ink)}
.buchung-kopf-text .button{margin-top:0}
.buchung-kopf-bilder figure{position:absolute;margin:0;overflow:hidden;border:5px solid #fff;border-radius:9px;box-shadow:0 12px 28px rgba(23,63,54,.13)}
.buchung-kopf-bilder figure:first-child{inset:0 12% 22% 0;transform:rotate(-3deg)}
.buchung-kopf-bilder figure:last-child{width:50%;height:58%;bottom:0;right:0;transform:rotate(4deg)}
.buchung-kopf+.booking-widget{padding-top:24px}
.buchung-kopf+.booking-widget .booking-intro{width:100%;max-width:1500px;margin:0 auto 16px}
.buchung-kopf+.booking-widget .booking-intro p{margin:0;color:var(--muted);font-size:13px}
@media(max-width:700px){.buchung-kopf{grid-template-columns:1fr;gap:24px;padding-top:28px;padding-bottom:28px}.buchung-kopf-bilder{display:flex;gap:12px;height:110px}.buchung-kopf-bilder figure:first-child,.buchung-kopf-bilder figure:last-child{position:relative;inset:auto;transform:none;width:50%;height:100%;border-width:3px}.buchung-kopf h1{font-size:39px}.buchung-kopf-text>p:not(.eyebrow){font-size:16px}.buchung-kopf+.booking-widget{padding-top:18px}}

/* Goldene Sterne zur belegten Google-Gesamtbewertung. */
.bewertungssterne{color:#b8860b;font-size:27px;letter-spacing:4px;line-height:1.2;margin-bottom:9px}

/* Google und Booking.com behalten ihre eigenen Bewertungsskalen. */
.bewertungsportale{display:flex;flex-wrap:wrap;gap:28px;align-items:center}
.booking-bewertung{border-left:2px solid var(--sand);padding-left:28px}
.booking-bewertung>strong{font:normal 52px/1.1 var(--serif);color:var(--green)}
.booking-bewertung strong span{font:normal 22px var(--sans);color:var(--muted)}
.booking-bewertung p{margin:7px 0 0;font-size:16px}
.booking-bewertung small{font-size:13px;color:var(--muted)}
.gaestestimmen-kopf{flex-wrap:wrap}
@media(min-width:1100px){.gaestestimmen-raster{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(min-width:681px) and (max-width:1099px){.gaestestimmen-raster figure:last-child{grid-column:1/-1}}
@media(max-width:680px){.booking-bewertung{padding-left:20px}.bewertungsportale{gap:24px}}

/* Weitere Bewertungsportale mit direktem Quellenlink. */
.weitere-bewertungen{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin-top:36px}
.weitere-bewertungen>a{display:flex;flex-direction:column;align-items:flex-start;padding:25px;border:1px solid var(--line);border-radius:6px}
.weitere-bewertungen strong{font:normal 40px/1.1 var(--serif);color:var(--green);margin-bottom:15px}
.weitere-bewertungen strong small{font-size:20px}
.weitere-bewertungen span{font-size:16px;font-weight:600;overflow-wrap:anywhere}
.weitere-bewertungen small,.bewertungsstand{font-size:13px;color:var(--muted)}
.weitere-bewertungen em{margin-top:16px;font-size:14px;font-style:normal;text-decoration:underline;text-underline-offset:4px}
.weitere-bewertungen>a:hover{border-color:var(--green)}
@media(max-width:700px){.weitere-bewertungen{grid-template-columns:1fr}}

/* Großzügige Hauptnavigation und warmer Buchungsbutton. */
@media(min-width:1281px){
 .startseite .site-header{height:102px;padding-inline:max(clamp(32px,4vw,76px),calc((100% - 1280px)/2));gap:32px}
 .startseite .brand-logo{height:66px;max-width:235px}
 .startseite .site-header nav{gap:clamp(24px,2.4vw,48px);font-size:16px}
 .startseite .site-header nav a{font-size:16px;padding:19px 1px;letter-spacing:.012em}
 .startseite .site-header nav .nav-cta{padding:14px 23px;letter-spacing:.015em}
 .startseite .hero{height:calc(100svh - 102px)}
}
.site-header nav .nav-cta{background:var(--sand);color:var(--green);border-color:var(--sand);border-radius:4px;box-shadow:none;font-weight:600}
.site-header nav .nav-cta:hover{background:#eadbc0;border-color:#eadbc0;color:var(--green);box-shadow:0 6px 16px rgba(23,63,54,.1)}

/* Beide Hausansichten teilen sich dieselbe Fläche. */
.startseite .haus-slider{position:absolute;inset:0}.haus-slider>img,.haus-slider>picture>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.haus-slider .haus-zweitbild{opacity:0;transition:opacity 1.4s ease}
.haus-steuerung{position:absolute;right:24px;top:24px;z-index:4;display:flex;gap:5px;padding:5px;background:var(--cream);border-radius:6px;pointer-events:auto}
.haus-steuerung button{font:600 13px var(--sans);border:0;border-radius:3px;padding:10px 13px;background:transparent;color:var(--green);cursor:pointer}
.haus-steuerung button[aria-pressed="true"]{background:var(--sand)}
.haus-steuerung button:focus-visible{outline:2px solid var(--green);outline-offset:2px}
.startseite .hero-shade{pointer-events:none}
@media(max-width:780px){.startseite .haus-slider{position:relative;inset:auto;width:100%;aspect-ratio:16/9;flex-shrink:0}.haus-steuerung{top:auto;bottom:10px;right:10px}.haus-steuerung button{padding:8px 10px}}
@media(prefers-reduced-motion:reduce){.haus-slider .haus-zweitbild{transition:none}}

/* Sanfter Kamerazoom auch innerhalb des manuellen Bildwechslers. */
.startseite .haus-slider{overflow:hidden}.haus-slider>img,.haus-slider>picture>img{animation:haus-kamerazoom 7s cubic-bezier(.1,.7,.3,1) both;transform-origin:center}
@keyframes haus-kamerazoom{from{transform:scale(1)}to{transform:scale(1.12)}}
@media(max-width:780px),(prefers-reduced-motion:reduce){.haus-slider>img,.haus-slider>picture>img{animation:none;transform:none}}.haus-slider>img[aria-hidden="true"],.haus-slider>picture>img[aria-hidden="true"]{animation:none;transform:scale(1)}

/* Besser lesbare Schrift im Footer. */
footer p{font-size:14px}
footer a,footer span{font-size:16px;line-height:1.7}
.footer-brand small{font-size:13px;line-height:1.7;letter-spacing:.07em}

/* Einheitliche, warme Aktionsflächen auf allen Seiten. */
.button,.site-header nav .nav-cta{border-radius:9px;min-height:52px;transition:background-color .25s ease,color .25s ease,box-shadow .25s ease,transform .25s ease;border:1px solid transparent;font-weight:600;letter-spacing:.015em}
.button{padding:14px 26px;font-size:15px;line-height:1.4;text-align:center}
.button-primary,.button-dark,.mini-cta .button-light,.cta-section .button-light{background:var(--sand);color:var(--green);border-color:var(--sand);box-shadow:0 4px 12px rgba(23,63,54,.08)}
.button-light{background:var(--cream);color:var(--green)}
.button-outline{border-color:var(--green);background:transparent;color:var(--green)}
.button-ghost{border-color:rgba(255,255,255,.7);background:rgba(255,255,255,.08);color:#fff}
@media(hover:hover){
 .button:hover,.site-header nav .nav-cta:hover{transform:translateY(-3px);box-shadow:0 9px 22px rgba(23,63,54,.17)}
 .button-primary:hover,.button-dark:hover,.mini-cta .button-light:hover,.cta-section .button-light:hover,.button-light:hover{background:#eadbc0;color:var(--green);border-color:#eadbc0}
 .button-outline:hover{background:var(--green);color:#fff}
 .button-ghost:hover{background:var(--cream);color:var(--green)}
}
.button:active,.site-header nav .nav-cta:active{transform:translateY(0);box-shadow:none}
.button:focus-visible,.site-header nav .nav-cta:focus-visible{outline:3px solid var(--sand);outline-offset:4px}
.haus-steuerung button{transition:background-color .2s ease,transform .2s ease}
.haus-steuerung button:hover{background:var(--sand)}
@media(prefers-reduced-motion:reduce){.button,.site-header nav .nav-cta,.haus-steuerung button{transition:none;transform:none!important}}


/* ── Seite Wissenswertes ────────────────────────────────────────────
   Zwei Texte sollen einzeilig stehen. Beide Regeln sind bewusst an die
   Seitenklasse gebunden: .sub-hero steckt auf 25 Seiten, .section-headline
   auf zweien — eine globale Aenderung haette dort mitgewirkt.

   Gemessen am 06.09.2026 bei 1440 px Fensterbreite:
     "Viele Moeglichkeiten."  braucht 825 px, verfuegbar waren 820 px.
     Es fehlten also fuenf Pixel. Der Hero-Container bekommt deshalb
     1120 statt 1050 px, damit bleiben 890 px.
     "Ein Klick fuehrt direkt..." braucht 572 px, begrenzt war auf 480. */
.wissenswertes .sub-hero>div:last-child{max-width:1120px}
.wissenswertes .section-headline>p{max-width:600px}

/* Der .notice-Kasten hatte margin-bottom bis 130px. Zusammen mit dem
   padding-top des folgenden .mini-cta (78px) ergab das 208px Leerraum —
   am 06.09.2026 auf /wissenswertes/ gemessen, sah aus wie ein nicht
   geladenes Bild. Der Folgeabschnitt bringt seinen Abstand selbst mit,
   deshalb hier 0. Betrifft die vier Seiten mit .notice: ausstattung,
   bezahlung, sommerpreise, wissenswertes — auf allen folgt .mini-cta. */

/* ── Rechtstexte (Impressum, Datenschutz) ───────────────────────────
   Bisher hatte .legal nur eine Maximalbreite und Schriftgroessen. Bei
   einem Text mit zehn Abschnitten fehlten damit Gliederung und Rhythmus.
   Zeilenlaenge bewusst auf 68 Zeichen begrenzt: Der Abschnitt ist
   1050 px breit, das waeren ueber 130 Zeichen je Zeile. */
/* Der Textblock steht mittig, nicht am linken Rand. Vorher blieben bei
   1440 px Fensterbreite 161 px tote Flaeche rechts, waehrend der Text
   links klebte. Die Zeilenlaenge bleibt trotzdem begrenzt: Volle Breite
   waeren ueber 130 Zeichen je Zeile und damit unlesbar.

   Angabe in Pixeln, nicht in ch: Die ch-Einheit misst die Breite der
   Ziffer Null, und die ist in Figtree deutlich schmaler als der
   Buchstabendurchschnitt — 66ch ergaben gemessene 83 Zeichen je Zeile.
   620 px sind hier nachgemessene 72 Zeichen. */
.legal{max-width:1050px;margin-inline:auto}
.legal>*{margin-inline:auto}
.legal .legal-vorwort{font-family:var(--serif);font-size:21px;line-height:1.55;color:var(--ink);max-width:640px;margin:0 auto 14px}
.legal h2{font-size:29px;margin:56px auto 14px;padding-top:26px;border-top:1px solid var(--line);max-width:640px}
.legal h2:first-of-type{margin-top:34px}
.legal p{line-height:1.85;color:var(--muted);max-width:620px;margin:0 auto 15px}
.legal p a{color:var(--green-2);text-decoration:underline;text-underline-offset:3px}
.legal p a:hover{color:var(--green)}
.legal strong{color:var(--ink)}
.legal .check-list{max-width:620px;margin:18px auto 0}
.legal .check-list li{padding:14px 0 14px 30px;color:var(--muted);line-height:1.7}
.legal .check-list li strong{display:inline}
.legal .legal-stand{max-width:620px;margin:50px auto 0;padding-top:22px;border-top:1px solid var(--line);font-size:14px}
@media(max-width:600px){
 .legal .legal-vorwort{font-size:19px}
 .legal h2{font-size:25px;margin-top:42px}
}

/* ── Startfläche der Direktbuchung ──────────────────────────────────
   Bewusst als einladender Schritt im Buchungsvorgang gestaltet, nicht
   als Rechtstext-Kasten: grosse Ueberschrift, ein klarer Knopf, der
   Hinweis leise darunter. Wer buchen will, sieht zuerst den Knopf. */
/* Das Panorama sitzt buendig oben, der Text bekommt sein Polster erst
   darunter — deshalb hier padding-top 0 und ein eigener Innenabstand fuer
   den Textteil. Bildhoehe fest, damit die Flaeche nicht je nach
   Fensterbreite springt. */
.buchung-start{background:var(--cream);padding:0 0 clamp(38px,5vw,64px);max-width:760px;margin:0 auto;text-align:center;overflow:hidden}
.buchung-start-bild{margin:0 0 clamp(30px,4vw,44px)}
.buchung-start-bild img{display:block;width:100%;height:clamp(170px,22vw,250px);object-fit:cover;object-position:center 62%}
.buchung-start>:not(.buchung-start-bild){margin-left:auto;margin-right:auto;max-width:calc(100% - 2*clamp(24px,4vw,58px))}
.buchung-start h2{font:normal clamp(30px,3.4vw,44px)/1.12 var(--serif);letter-spacing:-.02em;margin:0 0 16px}
.buchung-start .buchung-start-text{color:var(--muted);font-size:17px;max-width:52ch;margin:0 auto 28px}
.buchung-start .button{min-width:280px}
.buchung-start .button:disabled{opacity:.6;cursor:progress}
.buchung-start-hinweis{margin:26px auto 0;max-width:60ch;font-size:13.5px;line-height:1.7;color:var(--muted)}
.buchung-start-hinweis a{color:var(--green-2);text-decoration:underline;text-underline-offset:2px}
@media(max-width:600px){.buchung-start .button{min-width:0;width:100%}}

/* Copyright-Zeile ueber die volle Fussbreite unter den Spalten.
   grid-column: 1/-1 laesst sie ueber alle Spalten laufen, unabhaengig
   davon, wie viele der Fuss gerade hat (4 auf dem Desktop, 2 bzw. 1 auf
   schmalen Schirmen). Der Strich in "2008 – 2026" ist ein Bis-Strich
   und bleibt, anders als die Gedankenstriche im Fliesstext. */
.footer-copyright{grid-column:1/-1;margin:34px 0 0;padding-top:22px;border-top:1px solid rgba(255,255,255,.14);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:rgba(255,250,241,.55);text-align:center}

/* Honigtopf gegen Formular-Automaten: ein Feld, das kein Mensch sieht.
   NICHT display:none — manche Automaten pruefen genau darauf und lassen
   solche Felder aus. Stattdessen aus dem Sichtfeld geschoben und aus der
   Tabulatorreihenfolge genommen. */
.honigtopf{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
/* Hinweiszeile unter einem Eingabefeld */
.modern-form label small{display:block;margin-top:6px;font-size:12.5px;color:var(--muted);font-weight:400}
/* Fehlermeldung ueber dem Formular */
.formular-fehler{background:#fdf1ef;border-left:3px solid #a8302f;color:#7a2422;padding:16px 20px;margin:0 0 26px;font-size:15px}
/* Fliesstext-Link in der Hinweisbox, 07.09.2026.
   WARUM: Die Regel a{color:inherit;text-decoration:none} macht jeden
   Link im Fliesstext unsichtbar. Gemessen am gerenderten Element war
   der Verweis auf /tal-der-almen/ in der .notice-Box exakt
   rgb(104,115,110) — dieselbe Farbe wie der Text daneben, ohne
   Unterstreichung. Ein Link, den niemand als Link erkennt, wird auch
   nicht geklickt.
   Werte bewusst identisch mit .legal p a, damit Fliesstext-Links auf
   der ganzen Website gleich aussehen. */
.notice p a{color:var(--green-2);text-decoration:underline;text-underline-offset:3px}
.notice p a:hover{color:var(--green)}

/* Inhaltsbreite gedeckelt, 07.09.2026.
   WARUM: Ohne Deckel wuchs der Inhalt mit dem Fenster mit. Gemessen:
   Inhaltsbreite 1195 px bei 1440, 1645 px bei 1920, 2285 px bei 2560 —
   und dabei Zeilen mit bis zu 227 Zeichen. Gut lesbar sind 60 bis 75.
   WIE: ueber das seitliche Padding, nicht ueber max-width am Abschnitt.
   So bleibt der Hintergrund ueber die volle Fensterbreite, nur der Inhalt
   wird gefasst und steht mittig. Unterhalb von rund 1540 px greift
   weiterhin der bisherige clamp-Abstand, dort aendert sich nichts. */
/* Zeilenlaenge, 07.09.2026.
   WARUM: Nach dem 1280er Deckel blieben zwei Stellen zu breit — gemessen
   bei 1920 px: 110 Zeichen in der Hinweisbox, 94 im Buchungshinweis. Gut
   lesbar sind 60 bis 75. 680px entspricht in dieser Schrift 71 Zeichen,
   derselbe Wert, den die uebrigen Textspalten schon verwenden. */
.notice p{max-width:680px}
/* Der Buchungshinweis braucht zwei Spalten Spezifitaet, sonst gewinnt
   .buchung-start>:not(.buchung-start-bild). Und er steht in kleinerer
   Schrift: 644 px ergaben dort 94 Zeichen, 500 px ergeben 72.
   Die vorhandene Angabe 60ch traegt nicht — ch misst die Ziffer Null,
   siehe traps.md, Falle 2. */
.buchung-start .buchung-start-hinweis{max-width:500px}
/* Kartentext auf der Startseite, 07.09.2026.
   Bei 1024 px klappt das Kartenraster auf eine Spalte, die Karte wird
   789 px breit und der Text erreicht 97 Zeichen. Bei allen anderen
   Breiten ist die Karte ohnehin schmaler, die Regel greift also nur dort. */
.card-body p{max-width:680px}
/* Gaestestimmen: Zitatschrift verkleinert, 07.09.2026.
   WARUM: clamp(24px,2.5vw,34px) ergab in der dreispaltigen Ansicht bei
   einer 323 px breiten Spalte nur 19 Zeichen pro Zeile, am Handy 13.
   Lesbar sind 45 bis 75; unter 30 zerfaellt der Satz in Stakkato.
   Gemessen am gerenderten Element auf der Startseite. */
.gaestestimmen-raster blockquote{font-size:clamp(17px,1.5vw,21px);line-height:1.5;margin-bottom:24px}
/* Korrektur 07.09.2026: Der Textblock im Sub-Hero hat eine eigene
   max-width (1050px). Zusammen mit dem 1280er Deckel im Padding ergab das
   bei border-box eine Inhaltsbreite von 425 px bei 1920 und **0 px** bei
   2560 — ein Wort pro Zeile. Der Deckel gehoert bei solchen Elementen ins
   margin-left, nicht ins padding: das Element behaelt seine Breite und
   wird nur nach rechts geschoben, bis es mit dem uebrigen Inhalt fluchtet.
   Merke: padding-Deckel nur bei Elementen OHNE eigene max-width. */
/* .legal setzt max-width:1050px auf einen .sub-section, der bereits das
   Deckel-Padding traegt — dieselbe Kollision wie beim Sub-Hero, Inhalt 0 px
   bei 2560. Hier ist die Loesung einfacher: Padding auf den urspruenglichen
   clamp zuruecksetzen. Der Block bleibt dann wie zuvor mittig auf 1050 px,
   unabhaengig von der Fensterbreite. */
.legal{padding-inline:clamp(22px,8vw,130px)}
/* Hero-Ueberschrift in zwei Zeilen, 07.09.2026.
   WARUM: Der <br> im HTML setzt zwei Zeilen, aber beide brachen ein
   zweites Mal um. Gemessen bei 1920 px und 94 px Schrift: "Viel Platz fuer
   Urlaub." braucht 803 px, "Kurze Wege zum Erlebnis." 1017 px — der
   Textblock war 760 px breit. Also den Block verbreitern, nicht die
   Schrift verkleinern; die Wirkung des Hero soll bleiben. */
.hero-content{width:min(1060px,92%)}
.hero h1{max-width:1060px}

/* Appartement-Kopf: grosse Schrift nach links, kleine nach rechts,
   07.09.2026 auf Kalles Wunsch. Die Reihenfolge kommt aus dem Raster
   (order), das HTML bleibt unangetastet. Die Titelspalte bekommt mehr
   Platz, damit die Ueberschrift in zwei Zeilen passt: bei 1920 px braucht
   "passt zu Ihrem Urlaub?" 689 px, vorher standen 620 px zur Verfuegung. */
@media(min-width:781px){
.startseite .apartments .section-head{grid-template-columns:minmax(0,1.45fr) minmax(0,.55fr);align-items:end}
.startseite .apartments .section-head-title{order:-1;justify-self:start}
.startseite .apartments .apartment-intro-line{justify-self:end;text-align:right;max-width:340px!important;white-space:normal!important}
}
/* Anfrageblock der Startseite an die Unterseiten angeglichen, 07.09.2026.
   WARUM: Auf allen Unterseiten ist derselbe Abschnitt (.mini-cta) creme
   mit dunkler Schrift, nur die Startseite hatte ihn in Marken-Gruen mit
   weisser Schrift. Kalle wollte die creme Farbe auch hier.
   Die Textfarben muessen mitwandern, sonst steht Weiss auf Creme.
   Werte 1:1 von .mini-cta uebernommen: Grund rgb(245,241,232),
   Text rgb(27,37,33), Augenbraue --green-2, Knopf --sand mit gruener
   Schrift. Der gruene Hintergrund bleibt anderswo unberuehrt. */
.cta-section{background:var(--cream);color:var(--ink)}
.cta-section .eyebrow.light{color:var(--green-2)}
.cta-section .button-light{background:var(--sand);color:var(--green);border-color:var(--sand)}
.cta-section .button-light:hover{background:#eadbc0;color:var(--green);border-color:#eadbc0}
.cta-section .phone-link{color:var(--green)}
/* --muted (rgb 104,115,110) kaeme auf Creme nur auf 4,37:1 — knapp
   unter den geforderten 4,5:1. rgb(95,105,100) erreicht 5,05:1 und
   sieht praktisch gleich aus. */
.cta-section .cta-copy p{color:rgb(95,105,100)}
/* Neuer Schlusssatz auf der Startseite, 07.09.2026.
   "Wir freuen uns darauf, Sie bei uns willkommen zu heissen." ist deutlich
   laenger als der alte Satz. Gemessen bei der bisherigen Schriftgroesse von
   84 px braeuchte die zweite Zeile 1064 px, die Spalte war 720 px breit.
   Also Spalte etwas breiter (62/38 statt 60/40) und Schrift auf 56 px
   gedeckelt: dann braucht die laengste Zeile 681 px bei 716 px Spalte —
   zwei Zeilen bei 1440 wie bei 1920. */
@media(min-width:781px){
.cta-section{grid-template-columns:minmax(0,.62fr) minmax(0,.38fr)}
}
/* Am echten Zeilenkasten nachgemessen: bei 56 px braucht die zweite
   Zeile 698 px, die Spalte ist bei 1440 px aber nur 691 px breit.
   3.7vw ergibt dort 53 px und damit 661 px — zwei Zeilen ab 1440. */
.cta-section h2{font-size:clamp(32px,3.7vw,54px)}
/* Menue enger, mit Trennstrich, 07.09.2026.
   Der Abstand war ab 1281 px bis 46 px breit (clamp 2.4vw). Jetzt deutlich
   enger, dafuer steht zwischen den Punkten ein senkrechter Strich.
   WICHTIG: Der Hover-Unterstrich belegt bereits ::after, der Trenner nimmt
   deshalb ::before — und zwar absolut positioniert ausserhalb des
   Linkkastens, damit er weder anklickbar wird noch den Unterstrich
   verlaengert. Nur waagrechtes Menue, ab 1101 px; darunter ist es ein
   aufklappendes Feld, dort waeren Striche sinnlos.
   Der Knopf rechts (.nav-cta) bekommt keinen Trenner davor. */
@media(min-width:1101px){
/* Beide Selektoren noetig: die Startseite hat eigene Regeln mit
   .startseite davor, und zwei Klassen schlagen eine. */
.site-header nav,.startseite .site-header nav{--nav-abstand:15px;gap:var(--nav-abstand)}
.site-header nav a:not(.nav-cta)+a:not(.nav-cta)::before{
  content:"|";position:absolute;left:calc(var(--nav-abstand) / -2);top:50%;
  transform:translate(-50%,-50%);color:rgba(27,37,33,.34);font-weight:400;
  pointer-events:none}
}
@media(min-width:1281px){
.site-header nav,.startseite .site-header nav{--nav-abstand:clamp(18px,1.6vw,26px)}
}
/* Hinweisbox laeuft jetzt ueber die volle Breite, 07.09.2026.
   WARUM: Die Box sass als creme Insel zwischen zwei creme Abschnitten, die
   ueber die ganze Fensterbreite laufen. Vor dem 1280er Deckel war sie nur
   130 px eingerueckt und das wirkte gewollt; danach 313 px bei 1920 und
   633 px bei 2560 — es sah aus wie ein Fehler, weisse Kerben links und
   rechts.
   Loesung wie bei allen anderen Abschnitten: Der Deckel wandert vom
   margin ins padding. Hintergrund voll, Inhalt auf 1280 gefasst und mit
   dem uebrigen Text fluchtend. */
.notice{margin-inline:0;padding-inline:max(clamp(22px,8vw,130px),calc((100% - 1280px)/2))}
/* Abschnitt "So schmeckt der Pongau", 07.09.2026.
   Sechs Absaetze, also kein zweispaltiges Muster wie .split-copy — die
   Textspalte waere neben einer kurzen Ueberschrift viel zu hoch.
   Stattdessen Ueberschrift oben, Text darunter in einer Spalte von 680 px:
   das sind in dieser Schrift rund 71 Zeichen je Zeile. */
.kulinarik{background:#fff}
.kulinarik-kopf{margin-bottom:clamp(26px,3vw,40px)}
.kulinarik-text{max-width:680px;color:var(--muted);font-size:18px;line-height:1.72}
/* Volle Breite auf Kalles Wunsch, 07.09.2026. Eine einzelne Zeile ueber
   1280 px waeren rund 140 Zeichen — etwa das Doppelte des Lesbaren.
   Deshalb zweispaltig ab 1024 px: (1280 - 60) / 2 ergibt 610 px je
   Spalte und damit rund 67 Zeichen. Darunter bleibt es einspaltig,
   dort ist die Seite ohnehin schmal genug. */
/* Text links, Bild rechts, 07.09.2026 auf Kalles Wunsch. Damit entfaellt
   der zweispaltige Textsatz von vorhin — die zweite Spalte ist jetzt das
   Bild. Der Text bleibt auf 680 px gedeckelt, das sind rund 75 Zeichen;
   die Bildspalte nimmt den Rest. Unter 1024 px stapelt es, Text zuerst. */
.kulinarik-raster{display:grid;gap:clamp(30px,3.5vw,60px)}
.kulinarik-bild{margin:0}
/* Drei Bilder in der zweiten Spalte, je mit Bildunterschrift, 07.09.2026.
   Gestapelt wuerde ein Bild sonst bis 844 px breit; bei 1360 px Datei waere
   das nur Faktor 1,6. Auf Textbreite gedeckelt sind es 2,0. */
.kulinarik-bilder{display:grid;gap:clamp(22px,2.6vw,34px);max-width:680px}
.kulinarik-bild img{width:100%;height:auto;display:block}
/* Bildunterschriften etwas groesser, 07.09.2026 auf Kalles Wunsch:
   14px waren neben 18px Fliesstext zu zurueckhaltend. */
.kulinarik-bild figcaption{margin-top:10px;font-size:16px;line-height:1.5;color:var(--muted)}
/* Die drei fett gesetzten Gerichte sind genau die, zu denen ein Bild
   danebensteht — Text und Bildspalte greifen so ineinander. */
.kulinarik-text strong{color:var(--ink);font-weight:600}
@media(min-width:1024px){.kulinarik-bilder{max-width:none}}
@media(min-width:1024px){
/* Beide Spalten oben beginnen: mit align-items:center startete der Text
   91 px tiefer als die Bilder, weil die Bildspalte hoeher ist. */
.kulinarik-raster{grid-template-columns:minmax(0,1fr) minmax(0,.72fr);align-items:start;
  gap:clamp(36px,4vw,72px)}
}
.kulinarik-text p{margin:0 0 20px}
.kulinarik-text p:last-child{margin-bottom:0}
.kulinarik-tipp{margin-top:28px;padding-top:22px;border-top:1px solid var(--line)}
.kulinarik-tipp strong{color:var(--ink)}
/* Bild unter dem Einleitungstext der Buchungsanfrage, 07.09.2026.
   Die linke Spalte ist bei 1920 px rund 414 px breit, bei 1000 px Datei
   also Faktor 2,4. Gestapelt wuerde das Bild sonst die volle Spaltenbreite
   einnehmen; auf 500 px gedeckelt bleibt der Faktor bei 2,0. */
.anfrage-bild{margin:clamp(28px,3vw,40px) 0 0;max-width:500px}
.anfrage-bild img{width:100%;height:auto;display:block}
/* 851px, nicht 781: das Formularraster stapelt unter 850 px
   (.info-groups,.form-layout{grid-template-columns:1fr}). */
@media(min-width:851px){.anfrage-bild{max-width:none}}

/* Galerie-Hero auf Unterseiten: lange Titel bleiben innerhalb der Textspalte. */
.unterseiten-bildhero{grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr)}
.unterseiten-bildhero .gallery-hero-copy{min-width:0}
.unterseiten-bildhero h1{font-size:clamp(40px,4.1vw,64px);line-height:1.05;overflow-wrap:anywhere;hyphens:auto}
.unterseiten-bildhero .gallery-hero-copy>p:not(.eyebrow){color:var(--muted);font-size:18px;max-width:620px}
.unterseiten-bildhero .gallery-hero-images picture{display:block;width:100%;height:100%}
@media(max-width:900px){.unterseiten-bildhero{grid-template-columns:minmax(0,1fr)}}
@media(max-width:560px){.unterseiten-bildhero h1{font-size:40px}.unterseiten-bildhero .gallery-hero-copy>p:not(.eyebrow){font-size:16px}}
/* Der Bild-Hero trennte kurze Woerter mitten im Satz: "Transparent star-ten."
   auf /preise/ (Kalle, 07.09.2026). Gemessen: die Textspalte ist ueber den
   ganzen Zweispalter hinweg nur rund 8,3 em breit (529 px bei 64 px Schrift auf
   1920, 437 px bei 52 px auf 1280) — 16 der 20 Ueberschriften brauchen mehr,
   die laengste 12,7 em. Der Umbruch ist also noetig, der Bindestrich nicht:
   "starten" haette sauber in die naechste Zeile gepasst, Chrome trennt aber
   gierig, um die Zeile zu fuellen. hyphenate-limit-chars laesst nur noch Woerter
   ab 15 Zeichen trennen. Damit bleibt "Datenschutzerklaerung" (9,8 em, passt in
   keine Zeile) weiterhin trennbar, alles Kuerzere bricht am Leerzeichen. */
.unterseiten-bildhero h1{hyphenate-limit-chars:15 6 4;-webkit-hyphenate-limit-before:6;-webkit-hyphenate-limit-after:4}
/* Impressum und Datenschutz hatten den Bild-Hero mit drei Fotos vom Haus und vom
   Ort. Kalle am 07.09.2026: "die Bilder haben aber nichts mit DSGVO gemeinsam".
   Ein passendes Bild gibt es im Bestand nicht — also keines. Der Kopf ist jetzt
   reiner Text ueber die volle Inhaltsbreite. Nebeneffekt: die Ueberschrift hat
   wieder Platz, "Datenschutzerklaerung" (9,8 em) muss nicht mehr getrennt werden. */
.rechtstext-hero{grid-template-columns:minmax(0,1fr);min-height:0;padding-top:clamp(58px,7vw,94px);padding-bottom:clamp(34px,4vw,54px);padding-inline:max(clamp(22px,8vw,130px),calc((100% - 1280px)/2))}
.rechtstext-hero h1{font-size:min(clamp(40px,4.6vw,68px),8.8vw);line-height:1.05;hyphens:manual;margin:0}
.rechtstext-hero .gallery-hero-copy>p:not(.eyebrow){color:var(--muted);font-size:18px;line-height:1.7;max-width:680px;margin:20px 0 0}

/* Der Rechtstext stand als schmale, mittige Spalte in der Seite: bei 1440 px
   Fenster begann der Fliesstext bei 410 px, die Ueberschrift darueber bei 80 px.
   Kalle: gleiche Breite wie der Rest. Der Block nimmt jetzt denselben
   Inhaltsrahmen wie jede andere Seite — Deckel 1280 px ueber das seitliche
   Padding — und steht linksbuendig.
   Nachtrag: Ich hatte die Zeilenlaenge zunaechst bei 680 px gedeckelt und Kalle
   den Grund genannt (ueber die volle Breite rund 130 Zeichen je Zeile,
   traps.md Falle 2). Er hat es zweimal anders gewollt, mit Verweis auf die
   Kachelreihe auf /ueber-uns/, die den vollen Rahmen nutzt. Also volle Breite.
   Wer das zurueckdreht: max-width wieder auf 680px setzen, sonst nichts. */
.legal{max-width:none;margin-inline:0;padding-inline:max(clamp(22px,8vw,130px),calc((100% - 1280px)/2))}
.legal>*{margin-inline:0}
.legal .legal-vorwort{margin-left:0;margin-right:0;max-width:none}
.legal h2{margin-left:0;margin-right:0;max-width:none}
.legal p{margin-left:0;margin-right:0;max-width:none}
.legal .check-list{margin-left:0;margin-right:0;max-width:none}
.legal .legal-stand{margin-left:0;margin-right:0;max-width:none}
/* Die Zustimmungszeile im Formular stand zerrissen da: ".choice" ist ein
   Flex-Container, dadurch wurden Fliesstext, Link und Schlusspunkt zu je einem
   eigenen Flex-Element — der Text brach um, "Datenschutzerklaerung ." blieb
   rechts daneben stehen (Kalle, 07.09.2026, mit Screenshot). Der Satz steckt
   jetzt in einem <span> und ist damit ein einziges Element.
   Dazu die Formularschrift vergroessert: Feldbeschriftungen und Zustimmungssatz
   standen beide auf 12 px. Fuer eine Beschriftung geht das, fuer einen ganzen
   Satz nicht. Der Zustimmungssatz ist Fliesstext und bekommt 16 px ohne
   Sperrung; ".modern-form .choice" (0,2,0) schlaegt ".modern-form label"
   (0,1,1), sonst bliebe die Beschriftungsregel stehen. Aus ".consent" ist
   dabei "font-size:11px!important" entfernt worden — es hat jede Regel
   ueberstimmt, egal wie spezifisch. Ein zweites !important waere die
   falsche Antwort gewesen. */
.modern-form .choice{font-size:16px;font-weight:400;letter-spacing:0;line-height:1.55}
.modern-form .choice>span{flex:1;min-width:0}
.modern-form .choice input{margin-top:4px;width:17px;height:17px;flex:none}
.modern-form label,.modern-form legend{font-size:13.5px}
.modern-form label small{font-size:14px}
/* Der Verweis auf die Datenschutzerklaerung stand im Zustimmungssatz in der
   Textfarbe und ohne Unterstreichung — als Link nicht erkennbar. Bei einer
   Einwilligung muss man ihn finden koennen. Gleiche Auszeichnung wie auf den
   Rechtstextseiten (.legal p a). */
.modern-form .choice a{color:var(--green-2);text-decoration:underline;text-underline-offset:3px}
/* Die erste Appartementkachel auf der Startseite traegt ".featured" und hatte
   ein hoeheres Bild als die beiden anderen: 350 px im Grundzustand und 430 px
   unter 1050 px Fensterbreite, waehrend die uebrigen bei 300 px standen
   (Kalle, 07.09.2026, mit Screenshot). Jetzt alle drei gleich hoch. Unter
   780 px gilt weiter 280 px fuer alle — diese Regel steht weiter oben im
   Blatt, deshalb muss sie hier fuer ".featured" wiederholt werden, sonst
   gewinnt die spaetere 300er-Zeile. Die groessere Breite der ersten Kachel
   bleibt unveraendert. */
.featured .card-image{height:300px}
@media(max-width:780px){.featured .card-image{height:280px}}
/* "Was bei Ihrem Aufenthalt dazugehoert." brach auf den drei Appartementseiten
   in zwei Zeilen (Kalle, 07.09.2026). Ursache war nicht die Schrift, sondern
   der Kasten: ".section-heading" ist auf 850 px gedeckelt, die Schrift waechst
   aber mit der Fensterbreite. Gemessen bei 1920 px: 61 px Schrift, Zeile
   braucht 1032 px, Platz 850. Ohne Deckel steht der Satz ab rund 700 px
   Fensterbreite in einer Zeile. Kein white-space:nowrap — das hat die Seite
   schon einmal auf 1564 px aufgeblasen. */
.apartment-amenities .section-heading{max-width:none}
/* Die vier Merkmalskaesten unter dem Grundriss standen als 3 + 1 (Kalle,
   07.09.2026, mit Screenshot von /appartement-enzian/). Eine Zeile geht
   nicht: gemessen bei 1440 px braucht Enzian 519 px und Garten 505, die
   Spalte hat 479 — und sie wird zu breiteren Fenstern hin nicht groesser,
   weil der Zweispalter mitwaechst (bei 1920 px sind es 513 px). Also
   bewusst zweizeilig, 2 x 2 und gleich breit, wie es unter 780 px schon
   war. Suite Frauenkogel stand als einzige in einer Zeile (467 px) und
   wird dadurch ebenfalls zweizeilig — der Gleichklang der drei Seiten ist
   das wert. */
.floorplan-facts{display:grid;grid-template-columns:1fr 1fr}
/* Auf /faq/ wirkte der Hero ungewoehnlich hoch (Kalle, 07.09.2026) — er ist
   aber mit 570 px genauso hoch wie auf /ausstattung/ und /kontakt/. Der Grund
   war die Farbe: ".gallery-hero" und ".faq-overview" hatten beide
   rgb(245,241,232), zusammen 995 px Creme ohne jede Trennung. Der Abschnitt
   darunter las sich dadurch als Teil des Kopfes. Er steht jetzt auf dem
   weissen Seitengrund und ist als eigener Abschnitt erkennbar — dieselbe
   Aenderung beantwortet beide Beobachtungen. */
.faq-overview{background:#fff}
/* Der Hinweis auf /sommerpreise/ sollte in eine Zeile (Kalle, 07.09.2026).
   Gemessen: der Satz braucht 805 px, ".notice p" deckelt aber auf 680.
   Der Deckel bleibt fuer die uebrigen drei Hinweise stehen — die haben
   156 bis 159 Zeichen, blieben also ohnehin zweizeilig und bekaemen nur
   unnoetig lange Zeilen. Deshalb ein eigener Zusatz statt einer Aenderung
   an der allgemeinen Regel. Ab rund 1270 px Fensterbreite steht der Satz
   in einer Zeile, darunter bricht er wie bisher um. */
.notice-breit p{max-width:none}
/* Die praktischen Angaben (Lage, Verpflegung, Hausregeln) standen bis
   07.09.2026 auf einer zweiten, falsch geschriebenen Seite /wissenwertes/ und
   trugen dort <h2>. Beim Zusammenlegen bekamen sie eine gemeinsame
   Abschnittsueberschrift, die Kacheln sind dadurch eine Ebene tiefer gerutscht.
   Ohne diese Zeile stuenden sie in der Grundgroesse statt in 36 px. */
.activity-grid h3,.info-grid h3{font-size:36px;margin:8px 0 15px}
/* Nach dem Entfernen der doppelten Handlungsaufforderung auf /faq/ stiess der
   dunkelgruene ".faq-contact" direkt auf den Fussbereich: rgb(23,63,54) auf
   rgb(51,47,40), zwei dunkle Flaechen ohne erkennbare Kante. Es ist derselbe
   Fall wie am 07.09.2026 auf der Startseite — Kalle wollte rgb(23,63,54)
   oberhalb des Fussbereichs gegen Creme getauscht haben, "und wenn es noch
   woanders auch ist ebenfalls tauschen". Auf /faq/ lag damals der cremefarbene
   Block dazwischen, deshalb fiel es nicht auf. Jetzt dieselbe Behandlung wie
   ".mini-cta" und ".cta-section": Creme, dunkler Text, gruener Knopf. */
.faq-contact{background:var(--cream);color:var(--ink);border-top:1px solid var(--line)}
.faq-contact .eyebrow.light{color:var(--green-2)}
.faq-contact>div:first-child>p:last-child{color:var(--muted)}
.faq-contact .button-light{background:var(--green);color:#fff;border-color:var(--green)}
.faq-contact .button-light:hover{background:var(--green-2);color:#fff;border-color:var(--green-2)}
.faq-contact .faq-phone{color:var(--green)}
/* Die Zahlenleisten nennen konkrete Werte — 70 km Pisten, 3.849 Einwohner,
   rund 40 Almen — bisher ohne Quelle und ohne Stand. Fuer Suchmaschinen und
   AI-Antworten zaehlt eine Zahl erst, wenn sie zuordenbar ist (SEO-Audit vom
   07.09.2026, Saeule Autoritaet). Der Hinweis steht direkt unter der Leiste,
   klein und zurueckhaltend — er soll die Zahlen belegen, nicht mit ihnen
   konkurrieren. */
.quellenhinweis{margin:0;padding:14px max(clamp(22px,8vw,130px),calc((100% - 1280px)/2)) 26px;font-size:13px;line-height:1.6;color:var(--muted);background:inherit}
.quellenhinweis a{color:var(--green-2);text-decoration:underline;text-underline-offset:2px}
/* Auf /ueber-uns/ steht die Zahlenleiste als Karte ueber einem Hintergrundbild,
   nicht als eigener Abschnitt. Der Quellenhinweis sitzt deshalb IN der Karte
   und darf nicht das seitliche Seitenpadding erben. */
.place-facts .quellenhinweis{padding:16px 0 0;margin-top:18px;border-top:1px solid rgba(27,37,33,.14);grid-column:1/-1}
/* Seiten mit Saisonangaben — Preise, Liftzeiten, Aktivitaeten — tragen jetzt
   ein sichtbares Aenderungsdatum. Freshness ist ein direktes Auswahlkriterium
   fuer AI-Antworten, und bei Preisen fuer 2026/2027 ist ein Datum auch fuer
   den Leser eine Vertrauensfrage (SEO-Audit vom 07.09.2026, Finding 2.3). */
.seiten-stand{grid-column:1/-1;margin:clamp(34px,4vw,54px) 0 0;padding:14px 0 0;border-top:1px solid var(--line);font-size:13px;color:var(--muted)}
/* Die Standzeile stand zuerst als eigener Block zwischen zwei Abschnitten und
   erzeugte dort einen weissen Streifen ohne Hintergrund (Kalle, 08.09.2026).
   Sie sitzt jetzt IM letzten Inhaltsabschnitt, erbt dessen Hintergrund und
   haengt als kleine Fussnote mit duenner Linie darunter.

   Dazu der Antwortblock: er hatte unten 129,6 px Polster, der Abschnitt danach
   oben ebenfalls 129,6 px — zusammen 259 px Leere zwischen Antwort und dem
   ersten Inhalt, sichtbar auf /sommeraktivitaeten/. Der Block ist eine
   Einleitung zu dem, was folgt, und braucht unten kaum Abstand. */
.kurzantwort{padding-top:clamp(50px,5.5vw,80px);padding-bottom:clamp(14px,2vw,30px)}
/* Auf /sommerpreise/ folgt die Standzeile direkt auf die Hinweisbox und ist
   deren Geschwister, nicht ihr Kind — im Kasten haette sie nichts verloren.
   Sie braucht dort das seitliche Seitenpadding und einen eigenen Abstand. */
.notice + .seiten-stand{background:var(--cream);padding:clamp(26px,3vw,40px) max(clamp(22px,8vw,130px),calc((100% - 1280px)/2)) clamp(40px,4.5vw,60px);margin:0;border-top:0}
/* ── Formular neu geordnet, 08.09.2026 ───────────────────────────────────
   Kalles Umbau: erst der Urlaub (Zeitraum, Personen, Appartement), dann die
   Kontaktdaten. Dazu Pflichtfeld-Kennzeichnung, ein Hinweis zur
   Mehrfachauswahl, eine optionale Telefonnummer und ein deutlicherer Knopf.
   Die Zustimmungs-Checkbox ist entfallen — Rechtsgrundlage ist Artikel 6
   Absatz 1 Buchstabe b DSGVO, nicht die Einwilligung; der Hinweis steht
   jetzt unter dem Knopf. */

/* Die Abschnittsueberschriften tragen das Formular. Vorher waren legend und
   label gleich gross, dadurch war keine Gliederung erkennbar. */
.modern-form fieldset{margin:0 0 clamp(26px,3vw,38px)}
.modern-form fieldset:last-of-type{margin-bottom:22px}
.modern-form legend{font:normal clamp(19px,1.9vw,23px) var(--serif);letter-spacing:0;color:var(--ink);margin-bottom:14px;padding:0}

.pflicht{color:var(--green-2);font-weight:700}
.pflicht-hinweis{margin:0 0 20px;font-size:13px;color:var(--muted)}
.optional{font-weight:400;letter-spacing:0;color:var(--muted);text-transform:none}
.feld-hinweis{margin:-6px 0 12px;font-size:13.5px;color:var(--muted)}

/* Punkt 6: Die Felder waren rundum 14 px gepolstert und dadurch rund 50 px
   hoch — am Schreibtisch zu wuchtig, das Formular wurde unnoetig lang. Am
   Handy bleibt es grosszuegig, und die 16 px Schriftgroesse bleiben ueberall
   stehen: darunter zoomt iOS beim Antippen hinein. */
@media(min-width:601px){
  .modern-form input:not([type=checkbox]),.modern-form textarea{padding:10px 14px;margin-top:6px}
  .modern-form label:not(.choice){margin-bottom:16px}
}

/* Punkt 7: Der Knopf war so breit wie sein Text und sandfarben wie jeder
   andere. Jetzt ueber die volle Breite und im kraeftigen Gruen — er ist die
   einzige Handlung auf dieser Seite. */
.button-absenden{display:block;width:100%;text-align:center;background:var(--green);color:#fff;border-color:var(--green);padding-block:16px;font-size:16px;margin:0}
.button-absenden:hover{background:var(--green-2);border-color:var(--green-2);color:#fff}

.formular-datenschutz{margin:16px 0 0;font-size:13px;line-height:1.6;color:var(--muted)}
.formular-datenschutz a{color:var(--green-2);text-decoration:underline;text-underline-offset:3px}

/* Zweispaltige Zeilen stapeln bisher erst unter 600 px. Das Formular steht
   aber in einer Spalte des Anfrage-Rasters und ist dort schon bei 850 px
   Fensterbreite nur rund 380 px breit — zwei Felder nebeneinander waeren
   dort zu schmal. */
@media(max-width:850px){.field-row{grid-template-columns:1fr}}
/* Das Altersfeld der Kinder wurde per hidden-Attribut ausgeblendet — sichtbar
   blieb es trotzdem (Kalles Punkt 2 vom 08.09.2026: "wirkt technisch etwas
   unfertig"). Ursache war nicht das Skript, sondern die Spezifitaet:
   ".modern-form label:not(.choice)" setzt display:block und schlaegt damit
   das display:none, das der Browser fuer [hidden] mitbringt. Ein Attribut,
   das der Browser kennt, wird hier von einer eigenen Regel ueberstimmt —
   deshalb muss man es zurueckholen. */
.modern-form [hidden],.modern-form label[hidden]{display:none}
/* Nachbesserung 08.09.2026 nach Kalles Durchsicht:

   1. Der Absendeknopf ging trotz voller Breite unter — 56 px hoch und 16 px
      Schrift wie jeder andere Knopf. Er ist die einzige Handlung auf dieser
      Seite und darf das zeigen: hoeher, groessere Schrift, etwas Abstand
      nach oben und ein weicher Schatten, damit er von der cremefarbenen
      Flaeche abhebt.
   2. Die Abschnittsueberschriften waren mit 23 px kaum groesser als der
      Fliesstext daneben.
   3. Der Verweis auf die Datenschutzerklaerung war zwar gruen und
      unterstrichen, im 13 px kleinen Graustufentext aber nicht als Link zu
      erkennen. Jetzt kraeftiger gesetzt und die ganze Zeile eine Spur
      groesser. */
.modern-form label{font-size:14.5px}
/* Die Ueberschrift muss NACH der label-Regel stehen: ".modern-form label,
   .modern-form legend" weiter oben im Blatt setzt beide auf dieselbe Groesse.
   28 px waren zu viel (Kalle, 08.09.2026), 23 px zu wenig — jetzt 24. */
.modern-form legend{font-size:clamp(20px,2vw,24px);margin-bottom:16px}
/* Zweiter Anlauf: 56 px und 16 px Schrift gingen unter, 69 px und 18 px
   waren zu wuchtig (Kalle, 08.09.2026). Jetzt dazwischen — die volle
   Breite und das kraeftige Gruen tragen die Aufmerksamkeit, die Hoehe
   muss es nicht auch noch tun. Schatten entsprechend leiser. */
.button-absenden{margin-top:8px;padding-block:16px;font-size:17px;font-weight:700;letter-spacing:.01em;box-shadow:0 6px 16px rgba(23,63,54,.16)}
.button-absenden:hover{box-shadow:0 8px 20px rgba(23,63,54,.22)}
.formular-datenschutz{font-size:14px;margin-top:18px}
.formular-datenschutz a{font-weight:600;text-decoration-thickness:2px;text-underline-offset:3px}
/* Auf /buchungsanfrage/ verwies der Knopf des Abschlussblocks auf die Seite,
   auf der man ohnehin steht. Kalle wollte den Knopf weg, den Abschnitt aber
   behalten (08.09.2026). Ohne zweites Kind wuerde "justify-content:
   space-between" nichts mehr verteilen — die Ueberschrift steht dann einfach
   links, was richtig ist. Nur der Innenabstand darf etwas kleiner sein, weil
   der Block jetzt nur eine Zeile traegt. */
.mini-cta-ohne-knopf{padding-block:clamp(48px,5vw,64px)}
/* ".mini-cta h2" ist auf 780 px gedeckelt, damit rechts daneben der Knopf
   Platz hat. Auf /buchungsanfrage/ gibt es den Knopf nicht mehr — dort ist
   der Deckel nur noch ein unnoetiger Umbruch: Die Zeile braucht 962 px bei
   1440 px Fensterbreite, der Abschnitt haette 1195. Kalle wollte sie in
   einer Zeile (08.09.2026). Ab rund 700 px Fensterbreite passt sie, darunter
   bricht sie wie bisher um. */
.mini-cta-ohne-knopf h2{max-width:none}
/* Die zweite Zeile der Appartementauswahl ist ein Zusatz, keine zweite
   Hauptangabe (Kalle, 08.09.2026: die lange Klammerformulierung liess sich
   schwerer erfassen). Deshalb kleiner und gedaempft, direkt darunter. */
.modern-form .choice small{display:block;margin-top:3px;font-size:13.5px;line-height:1.45;color:var(--muted);font-weight:400}
/* Kalle hat zweimal gefragt, warum die Navigationsleiste auf der Startseite
   anders aussieht (08.09.2026). Die Menuepunkte sind identisch — der Knopf
   hiess nur anders ("Verfuegbarkeit und Preise pruefen" gegen "Direkt
   buchen"), das ist im HTML vereinheitlicht. Uebrig blieb ein Rest von
   Falle 9: die .startseite-Zwillingsregeln hatten geringfuegig andere Werte,
   19px 0 statt 19px 1px und 14px 22px statt 14px 23px. Ein Pixel je Punkt
   klingt nach nichts, summiert sich ueber acht Eintraege aber auf 20 px
   Unterschied in der Leistenbreite. Beide Regeln tragen jetzt dieselben
   Werte. */
/* Der Einstieg in die Direktbuchung war nicht als Handlung erkennbar (Kalle,
   08.09.2026: "Irgendwie sehe ich nicht, dass ich hier erst konkret was
   klicken muss"). Gemessen war der Knopf bei y=1284 auf einer 2399 px langen
   Seite, sandfarben wie jeder andere und 307 px breit — er sah aus wie ein
   Nebenhinweis, nicht wie das Tor zum Buchungssystem.

   Drei Aenderungen: Das 250 px hohe Bild ist raus, das hebt den Knopf um rund
   290 px. Der Knopf traegt jetzt dieselbe kraeftige Fassung wie der
   Absendeknopf im Formular. Und der Block bekommt einen sichtbaren Rahmen mit
   gestrichelter Kante — er liest sich damit als Platzhalter, an dessen Stelle
   gleich etwas erscheint, statt als fertiger Textabschnitt. */
.buchung-start{border:2px dashed rgba(23,63,54,.28);border-radius:10px;padding:clamp(34px,4vw,54px) clamp(22px,3vw,44px);max-width:640px;margin-inline:auto;background:#fff}
.buchung-start .eyebrow{margin-bottom:10px}
.buchung-start h2{margin-top:0}
.buchung-start-text{max-width:460px;margin-inline:auto}
.buchung-start .button-absenden{max-width:420px;margin-inline:auto;margin-top:26px}
.buchung-start-hinweis{max-width:460px;margin:20px auto 0;font-size:13px;line-height:1.6}
/* Der Knopf zur Direktbuchung soll ins Auge stechen (Kalle, 08.09.2026).
   Ein ruhiges Pulsieren des Schattens, kein Zappeln: 2,6 s, weiches
   Ein- und Ausblenden, kein Groessenwechsel — der wuerde beim Lesen des
   Textes daneben stoeren. Nur dieser eine Knopf, nicht der im Formular:
   dort ist die Absicht ohnehin klar, dort waere Bewegung Laerm.
   Beim Ueberfahren hoert das Pulsieren auf und der Knopf hebt sich —
   so ist die Zustandsaenderung deutlich unterscheidbar. */
/* Die Ringfarbe kommt aus dem Logo (Kalles Vorschlag, 08.09.2026): #a5d133,
   das Gruen des Schriftzugs und mit 1700 Pixeln die haeufigste Farbe der
   Logodatei. Gleiche Farbfamilie wie der dunkelgruene Knopf, aber deutlich
   heller — dadurch faellt der Ring auf, ohne aus dem Bild zu fallen.
   Die zweite Logofarbe waere #1d80be, ein kraeftiges Blau; das ist die
   einzige kalte Farbe im sonst warmen Creme-Gruen-Sand-Bild. */
@keyframes buchung-puls{
  0%,100%{box-shadow:0 6px 16px rgba(23,63,54,.18),0 0 0 0 rgba(165,209,51,.95)}
  50%    {box-shadow:0 8px 22px rgba(23,63,54,.22),0 0 0 14px rgba(165,209,51,0)}
}
.buchung-start .button-absenden{animation:buchung-puls 2.4s ease-out infinite}
/* Beim Ueberfahren dreht sich das Verhaeltnis um: Sand als Flaeche, Gruen als
   Schrift. Das ist eine echte Farbaenderung und nicht nur eine zweite
   Gruenstufe — die waere neben #173f36 kaum zu erkennen. */
.buchung-start .button-absenden:hover,
.buchung-start .button-absenden:focus-visible{
  animation:none;background:var(--sand);color:var(--green);border-color:var(--sand);
  transform:translateY(-3px);box-shadow:0 14px 30px rgba(23,63,54,.28)}
.buchung-start .button-absenden:active{transform:translateY(0);box-shadow:0 4px 10px rgba(23,63,54,.2)}
/* Sobald geladen wird, ist der Knopf ausgegraut — dann kein Pulsieren mehr. */
.buchung-start .button-absenden:disabled{animation:none;opacity:.6;cursor:default}
@media(prefers-reduced-motion:reduce){
  .buchung-start .button-absenden{animation:none}
  .buchung-start .button-absenden:hover{transform:none}
}
/* Die sechs Aktivitaetskacheln bestanden nur aus Text — dazwischen wirkte die
   Seite leer (Kalle, 08.09.2026). Jedes Feld bekommt jetzt ein Foto oben, in
   festem Seitenverhaeltnis, damit die Kacheln gleich hoch beginnen. Das Bild
   steht ueber der Nummer, weil es die Kachel eroeffnet; Nummer und Titel
   folgen darunter wie bisher. */
.activity-grid article{display:flex;flex-direction:column;padding:0}
.aktivitaet-bild{margin:0}
.aktivitaet-bild img{width:100%;height:clamp(190px,17vw,250px);object-fit:cover;display:block}
.activity-grid article>span,.activity-grid article>h2,.activity-grid article>h3,.activity-grid article>p{padding-inline:clamp(26px,3vw,46px)}
.activity-grid article>span{padding-top:clamp(24px,2.6vw,34px)}
.activity-grid article>p{padding-bottom:clamp(28px,3vw,46px);margin-bottom:0}

/* Der Antwortblock ist eine Einleitung zu dem, was folgt. Sein Polster unten
   und das des naechsten Abschnitts oben addierten sich auf 158 px Leere. */
.kurzantwort + .sub-section{padding-top:clamp(34px,3.5vw,54px)}
/* Auf /direktbuchung/ ist die einzige Handlung der Knopf, der das
   Buchungssystem laedt. Er lag bei y=1086, also unterhalb des ersten
   Bildschirms — der Besucher musste scrollen, um ueberhaupt zu sehen, dass
   es etwas zu klicken gibt (Kalle, 08.09.2026). Der Bild-Hero ist auf dieser
   einen Seite deshalb flacher, und der Abschnitt darunter ruecht naeher.
   Nur hier: auf den anderen 26 Seiten traegt der hohe Hero die Stimmung, dort
   gibt es keine Handlung, die weiter oben stehen muesste. */
.direktbuchung .gallery-hero{min-height:0;padding-top:clamp(38px,4vw,52px);padding-bottom:clamp(38px,4vw,52px)}
.direktbuchung .gallery-hero-images{height:clamp(200px,19vw,250px)}
.direktbuchung .booking-widget{padding-top:clamp(28px,3vw,40px)}
.direktbuchung .buchung-start{padding-top:clamp(28px,3vw,38px);max-width:700px}
/* Zweite Zeile der Belegungsangabe auf /appartements/, 08.09.2026.
   WARUM: Kalle wollte die Angaben aus dem Buchungsformular auch in der
   Uebersicht sehen. Als Klammerzusatz in derselben Zeile lief der Text unter
   die absolut gesetzte Ziffer der Kachel — gemessen bei 651 px (6 px
   Ueberlappung) und 900 px (8 px, Kacheln 01 und 03). Als zweite Zeile geht
   das nicht mehr, weil sie unter der Ziffer liegt.
   WIE: dieselbe Behandlung wie die Zusatzzeile im Formular
   (.modern-form .choice small) — normal geschrieben statt Versalien,
   gedaempft, ohne Sperrung. Das umgebende <small> ist uppercase mit .11em
   Sperrung; ohne diese Regel stuenden dort drei Zeilen Versalien. */
.apartment-teaser-copy small .belegung-zusatz{display:block;margin-top:4px;text-transform:none;letter-spacing:0;font-size:13.5px;line-height:1.45}
/* Appartementkacheln auf der Startseite, 08.09.2026.
   WARUM: Der Verweis stand nur als kleine Textzeile da („Appartement
   entdecken"). Kalle wollte ihn auffaelliger und das Bild ebenfalls
   anklickbar.
   WIE: der vorhandene Knopf .button-dark statt der Textzeile, dazu ein
   ::after ueber die ganze Kachel. So ist alles anklickbar — Bild, Text,
   Knopf — ohne einen zweiten Link zu verschachteln. Verschachtelte Links
   sind ungueltig und verwirren Vorleseprogramme.
   Der Knopf wechselt beim Ueberfahren der KACHEL die Farbe, nicht erst beim
   Ueberfahren des Knopfes — sonst sieht man der Kachel nicht an, dass sie
   ganz anklickbar ist.
   ACHTUNG: .button-dark ist trotz des Namens NICHT dunkelgruen. Eine spaetere
   Regel setzt .button-primary, .button-dark und zwei weitere auf var(--sand).
   Der Ruhezustand ist also sand, deshalb geht der Hover ins Gruene. */
.apartment-card{position:relative}
.apartment-card .card-body a.button::after{content:"";position:absolute;inset:0}
.apartment-card:hover .button-dark{background:var(--green);color:#fff}
/* Kontrast der gedaempften Textfarbe, 08.09.2026.
   WARUM: Lighthouse beanstandete auf der Startseite die Kurzvorteile, die
   Absaetze in Intro, Wellness und Gastgeber sowie die Bewertungszeilen.
   Gemessen am gerenderten Element: --muted #68736e auf dem Cremegrund
   ergab 4,37 zu 1 — WCAG AA verlangt 4,50 fuer Text unter 24 px. Es fehlten
   also 0,13.
   WIE: dieselbe Farbe 4 Prozent dunkler, #646e6a. Das ergibt 4,69 auf Creme
   und 5,28 auf Weiss, haelt den Farbton und laesst den Abstand zur
   Fliesstextfarbe --ink (#1b2521) unveraendert. Die Variable wird an 82
   Stellen benutzt, die Korrektur wirkt damit ueberall gleich.
   Diese Zeile dient nur der Dokumentation; geaendert wurde die Variable
   oben im Blatt. */
/* Kontrast der Galerie-Beschriftungen, 08.09.2026.
   WARUM: Lighthouse kann Text ueber Bildern nicht bewerten und hat das nicht
   gemeldet. Nachgerechnet an den echten Bildpunkten hinter jeder Schrift
   (Canvas, hellster Punkt als unguenstigster Fall) fiel die kleine
   Kategoriezeile bei 8 von 11 sichtbaren Karten unter 4,5 — schlechtester
   Wert 3,35. Die grosse Bildunterschrift lag mit 4,77 knapp darueber.
   WIE: Abdunkler von rgba(…,.74) auf .80 und die kleine Zeile von 72 auf
   85 Prozent Deckkraft. Gerechnet gegen den hellsten gemessenen Bildpunkt
   rgb(253,251,240) ergibt das 5,62 fuer die Bildunterschrift und 4,61 fuer
   die Kategoriezeile. Volle Deckkraft haette die Abstufung zwischen beiden
   Zeilen eingeebnet, ein staerkerer Abdunkler allein die Fotos zu dunkel
   gemacht — deshalb beides ein Stueck. */
/* Kontrast auf den Sand- und Gruenflaechen, 08.09.2026.
   Beim Nachmessen ueber alle Seiten fielen drei Stellen durch, die
   Lighthouse nicht gemeldet hatte:
     .alm-facts span / .ski-amade-facts span  --muted auf Sand   3,25 / 3,15
     .almenweg-feature .eyebrow               gruen auf gruen    1,39
   Die Beschriftungen der Zahlenkacheln stehen auf Sand, dort ist die
   gedaempfte Textfarbe zu hell — mit --green sind es 7,19 bzw. 6,97.
   Die Eyebrow im gruenen Block war praktisch unsichtbar (gruen auf gruen);
   --sand ergibt dort 7,19. */
.alm-facts div>span,.ski-amade-facts div>span{color:var(--green)}
.almenweg-feature .eyebrow{color:var(--sand)}
/* Kontrast im Pistenabschnitt auf /skigebiet/, 08.09.2026.
   Auch das konnte Lighthouse nicht sehen — Text ueber einem Bild. An den
   echten Bildpunkten nachgerechnet, mit dem Verlauf an der jeweiligen
   Position: der Beschreibungsabsatz (weiss zu 78 Prozent) kam auf 2,70, die
   letzte Kachel „2 km Skirouten" auf 4,46. Der Verlauf ist rechts zu schwach,
   und genau dort endet der Textblock.
   Rechtes Ende von .28 auf .50 — das ergibt 4,85 fuer den Absatz und 4,80
   fuer die Kachel. Die Deckkraft des Absatzes bleibt bei 78 Prozent, damit
   er weiterhin ruhiger wirkt als die Ueberschrift. */
/* Silbentrennung in Safari, 09.09.2026.
   WARUM: Kalle sah auf einem MacBook „Ihr Einstieg in Ös-" / „terreichs" —
   getrennt nach ZWEI Buchstaben. Der Screenshot zeigt einen Trennstrich, es
   war also die Silbentrennung und nicht overflow-wrap, wie ich zuerst
   vermutet hatte.
   Ursache: `hyphenate-limit-chars` gibt es in Safari nicht. Die Regel vom
   07.09.2026 gegen „Transparent star-ten" hat dort also nie gewirkt, und
   ohne Mindestlaenge trennt Safari auch nach einem oder zwei Buchstaben.
   Chromium hielt sich an die Vorgabe, deshalb war es hier nicht
   reproduzierbar — auch nicht bei 60 px Kastenbreite oder 200 px Schrift.
   WIE: dieselben Werte zusaetzlich als -webkit-hyphenate-limit-before/-after,
   die Safari versteht. 6 Zeichen vor und 4 nach der Trennstelle; „Öster-
   reichs" waere damit erlaubt, „Ös-terreichs" nicht mehr.
   Betrifft die H1 auf 17 Unterseiten. */