:root{
  --paper:#fff;
  --outside:#f4f7dc;
  --ink:#171b1c;
  --muted:#697170;
  --orange:#d75b26;
  --sea:#315e67;
  --sea-dark:#24484f;
  --sand:#eee8d6;
  --line:#d8d4b8;
  --soft:#f8f7ef;
  --shadow:0 12px 38px rgba(35,53,47,.13);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--outside);color:var(--ink);font:15px/1.58 Arial,Helvetica,sans-serif}
a{color:var(--orange);text-decoration:none}
a:hover{text-decoration:underline}
button,input,textarea,select{font:inherit}
.page-shell{width:min(1120px,calc(100% - 34px));margin:0 auto;background:var(--paper);min-height:100vh;box-shadow:0 0 18px rgba(38,54,45,.18);border-inline:1px solid #ccd6b5}
.hero{height:270px;position:relative;overflow:hidden;border-bottom:1px solid var(--line)}
.hero img{width:100%;height:100%;object-fit:cover;object-position:center;display:block}
.hero::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(255,255,255,.05),rgba(255,255,255,0) 55%),linear-gradient(180deg,rgba(0,0,0,0),rgba(0,0,0,.04))}
.hero-title{position:absolute;z-index:2;left:19%;top:17px;font-family:"Brush Script MT","Segoe Script",cursive;font-size:clamp(48px,6vw,78px);font-style:italic;letter-spacing:1px;color:#0e1212;text-shadow:0 2px 2px rgba(255,255,255,.7)}
.hero-subtitle{position:absolute;z-index:2;left:20%;top:100px;background:rgba(255,255,255,.68);padding:7px 14px;text-transform:uppercase;letter-spacing:.15em;font-size:11px;font-weight:700;color:#354144}
.mobile-bar{display:none}
.layout{display:grid;grid-template-columns:245px minmax(0,1fr);align-items:start}
.sidebar{position:relative;padding:10px 14px 0 10px;min-height:680px}
.sidebar nav{position:relative;z-index:2}
.sidebar a{display:block;color:#111;text-decoration:none}
.nav-main{font-weight:700;font-size:16px;border-bottom:1px dotted #beb99d;padding:6px 2px}
.nav-main.active{color:#000}
.nav-sub,.nav-group>a:not(.nav-main){font-size:13px;padding:2px 0 2px 17px;color:#212525}
.nav-group{border-bottom:1px dotted #beb99d;padding-bottom:5px}
.nav-group .nav-main{border:0;padding-bottom:3px}
.sidebar a:hover{color:var(--orange)}
.strandkorb{position:absolute;left:-35px;bottom:-190px;width:210px;filter:drop-shadow(0 8px 8px rgba(0,0,0,.12));pointer-events:none}
.content{padding:26px 34px 45px 12px;min-width:0}
.welcome{display:grid;grid-template-columns:minmax(0,1fr) 400px;gap:30px;align-items:start}
.kicker{font-weight:700;margin:0 0 8px;color:#111}
h1,h2{margin:0 0 14px;line-height:1.15}h1{font-size:31px}h2{font-size:26px}
p{margin:0 0 16px}.welcome-copy p{max-width:575px}
.collage-wrap{margin:16px 0 0;transform:rotate(-.7deg)}
.collage-wrap img{display:block;width:100%;box-shadow:0 10px 18px rgba(0,0,0,.16);border:8px solid #fff}
.collage-wrap figcaption{text-align:right;font-size:10px;color:#666;margin-top:7px;transform:rotate(.7deg)}
.apartments{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin:48px 0 34px}
.apartments article{background:var(--soft);border-top:4px solid var(--sea);padding:20px;min-height:180px;box-shadow:0 4px 15px rgba(44,60,54,.05)}
.apartments article span{font-size:11px;letter-spacing:.16em;color:var(--muted)}
.apartments h2{font-size:22px;margin-top:5px}.apartments p{color:#555}.apartments a{font-weight:700}
.region,.prices,.booking{margin-top:30px;border-top:1px solid var(--line);padding:30px 0;display:grid;grid-template-columns:.9fr 1.1fr;gap:35px}
.region-points p,.price-list p{display:flex;justify-content:space-between;gap:18px;padding:10px 0;margin:0;border-bottom:1px dotted #c9c5ad}.region-points span{color:var(--muted);text-align:right}.price-list strong{white-space:nowrap;color:var(--sea-dark)}
.booking{background:#f7f8f1;margin-inline:-12px -34px;padding:30px 34px 34px 12px}
.booking form{display:grid;gap:12px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.booking label{font-size:12px;font-weight:700;display:grid;gap:5px}.booking input,.booking textarea,.booking select{width:100%;border:1px solid #c9cfca;background:#fff;padding:10px;border-radius:5px}.booking button{border:0;background:var(--sea);color:#fff;font-weight:700;padding:12px 16px;border-radius:5px;cursor:pointer}.booking button:hover{background:var(--sea-dark)}
.closing{padding:34px 0 20px}.closing strong{font-size:16px}.signature{font-family:"Brush Script MT","Segoe Script",cursive;font-size:32px;font-style:italic;margin:26px 0 0 95px;transform:rotate(-4deg);display:inline-block}
footer{margin-top:35px;border-top:1px solid var(--line);padding-top:24px;display:grid;grid-template-columns:repeat(3,1fr);gap:24px;font-size:12px;color:#555}footer strong{color:#111}footer a{color:#555}
@media(max-width:900px){
  .page-shell{width:100%;border:0;box-shadow:none}.hero{height:240px}.hero-title{left:7%;font-size:58px}.hero-subtitle{left:8%}
  .mobile-bar{display:flex;align-items:center;justify-content:space-between;padding:11px 16px;background:#fff;border-bottom:1px solid var(--line);position:sticky;top:0;z-index:20}.mobile-brand{color:#111;font-weight:700}.menu-toggle{border:1px solid #c6c9ba;background:#f8f8f1;border-radius:5px;padding:7px 11px;font-weight:700}
  .layout{display:block}.sidebar{display:none;position:sticky;top:49px;z-index:19;background:#fff;padding:10px 16px 18px;min-height:0;box-shadow:0 12px 20px rgba(0,0,0,.08)}.sidebar.open{display:block}.strandkorb{display:none}.sidebar nav{columns:2;column-gap:28px}.nav-group,.nav-main,.nav-sub{break-inside:avoid}
  .content{padding:28px 22px 45px}.welcome{grid-template-columns:1fr .8fr;gap:22px}.collage-wrap{margin-top:38px}.booking{margin-inline:-22px;padding-inline:22px}
}
@media(max-width:680px){
  .hero{height:205px}.hero img{object-position:center}.hero-title{left:5%;top:18px;font-size:46px}.hero-subtitle{left:5%;top:84px;font-size:9px}
  .sidebar nav{columns:1}.content{padding:24px 18px 35px}.welcome{grid-template-columns:1fr}.collage-wrap{margin-top:10px;transform:none;max-width:500px}.collage-wrap figcaption{transform:none}
  h1{font-size:27px}.apartments{grid-template-columns:1fr;margin-top:36px}.region,.prices,.booking{grid-template-columns:1fr;gap:18px}.booking{margin-inline:-18px;padding-inline:18px}.form-grid{grid-template-columns:1fr}.signature{margin-left:25px}footer{grid-template-columns:1fr;gap:12px}
}
@media(max-width:430px){.hero{height:175px}.hero-title{font-size:37px;top:13px}.hero-subtitle{top:68px}.content{font-size:14px}.region-points p,.price-list p{display:block}.region-points span{display:block;text-align:left;margin-top:3px}}