*{box-sizing:border-box}
html,body{
  margin:0;
  min-height:100%;
  background:radial-gradient(circle at 50% 8%,#fff 0,#f6f1ea 48%,#ece6de 100%);
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
}
.page{
  min-height:100vh;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:12px;
  padding:16px;
}
.phone-wrap{
  position:relative;
  width:min(466px,95vw);
  aspect-ratio:466/1037;
}
.phone-screen{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:contain;
  user-select:none;
  -webkit-user-drag:none;
  filter:drop-shadow(0 18px 34px rgba(0,0,0,.18));
}
.hot{
  position:absolute;
  z-index:5;
  border:0;
  background:transparent;
  padding:0;
  cursor:pointer;
}
.hot:hover{background:rgba(205,153,62,.035);border-radius:16px}
.hot:focus-visible{outline:3px solid rgba(205,153,62,.8);outline-offset:2px;border-radius:16px}
.hidden{display:none!important}

/* Startscreen Hotspots */
.h-home-stays{left:12.7%;top:42.0%;width:39.5%;height:8.7%}
.h-home-profile{left:82.0%;top:90.0%;width:12.0%;height:6.2%}
.h-home-bottom-stays{left:41.0%;top:90.0%;width:15.0%;height:6.2%}

/* Kurzfristig frei */
.h-stays-back{left:4.5%;top:7.2%;width:10%;height:7%}
.h-stays-bottom-home{left:4.5%;top:90%;width:15%;height:6%}
.h-stays-profile{left:82%;top:90%;width:13%;height:6%}

/* Dashboard */
.h-dash-back{left:4%;top:7%;width:10%;height:7%}
.h-dash-home{left:4.5%;top:90%;width:15%;height:6%}
.h-dash-stays{left:42%;top:90%;width:15%;height:6%}

.switcher{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  justify-content:center;
}
.switcher button{
  border:1px solid rgba(20,55,100,.10);
  background:white;
  color:#123c75;
  border-radius:999px;
  padding:10px 14px;
  font-weight:700;
  box-shadow:0 4px 12px rgba(0,0,0,.06);
}
.switcher button.active{
  border-color:transparent;
  background:linear-gradient(135deg,#c9953d,#dda84c);
  color:white;
}

@media(max-width:520px){
  .page{padding:0;justify-content:flex-start;background:#f5f0e9}
  .phone-wrap{width:100vw;max-width:none}
  .phone-screen{filter:none}
  .switcher{
    position:fixed;
    z-index:20;
    left:50%;
    bottom:max(8px,env(safe-area-inset-bottom));
    transform:translateX(-50%);
    width:calc(100% - 18px);
    background:rgba(255,255,255,.88);
    backdrop-filter:blur(14px);
    padding:5px;
    border-radius:999px;
    box-shadow:0 7px 24px rgba(0,0,0,.12);
  }
  .switcher button{
    flex:1;
    padding:8px 6px;
    font-size:10px;
    box-shadow:none;
  }
}