/* Lotuslodge – eigenstaendiger HTML/CSS-Nachbau nach der Oktober-2026-Sicherung. */
/* Amatic SC wird ausschliesslich aus dem lokalen Fonts-Ordner geladen. */
:root{--sand:#ffd090;--cream:#fff2d4;--leaf:#dde695;--wine:#91554c;--ink:#242323;--blue:#002d81;--frame:#a49c79}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--sand);color:var(--wine);font:13px/1.46 Arial,Helvetica,sans-serif}a{color:inherit}
.site{width:min(980px,calc(100% - 30px));margin:0 auto}.site-header{height:180px;display:grid;grid-template-columns:345px 1fr;gap:12px;align-items:start;position:relative}
.brandmark{position:relative;display:block;width:285px;height:165px}.brandmark img{width:285px;max-height:165px;object-fit:contain;transform:translateX(12px);filter:drop-shadow(0 2px 1px #7858354d)}.logo-area{position:relative}.sha-mark{position:absolute;top:10px;left:250px;width:95px;height:50px;object-fit:contain}
.site-right{padding-top:34px;min-width:0}.header-strip{display:block;width:578px;max-width:100%;height:48px;object-fit:fill;box-shadow:0 4px 7px #9c70534a;border-radius:2px}
.site-nav{display:flex;justify-content:space-between;align-items:center;gap:0;min-height:60px;padding-top:17px;margin:0 0 0 20px;position:relative}
.nav-item{position:relative;display:flex;align-items:center;justify-content:center;flex:0 0 auto}.nav-link{font:700 23px/1.1 'Amatic SC','Arial Narrow',serif;text-decoration:none;padding:6px 8px 4px;white-space:nowrap;color:#865943;letter-spacing:-.2px;display:block}
.nav-item.active>.nav-link,.nav-item:hover>.nav-link,.nav-link:focus-visible{background:var(--leaf)}.nav-text-image{display:block;height:29px;width:auto;max-width:none;object-fit:contain}.nav-text-fallback{display:none}.nav-item.active::after{content:"";position:absolute;top:38px;left:50%;transform:translateX(-50%);border:12px solid transparent;border-top-color:var(--leaf);pointer-events:none}
.subnav{display:none;position:absolute;z-index:60;top:100%;left:0;width:max-content;min-width:140px;background:#fff1d2;border:1px solid #ccb78d;box-shadow:0 5px 12px #60472944;padding:7px 0}
.nav-item:hover .subnav,.nav-item:focus-within .subnav,.nav-item.open .subnav{display:block}.subnav a{display:block;padding:7px 14px;text-decoration:none;font-size:12px;color:var(--wine)}.subnav a:hover,.subnav a.current{background:var(--leaf)}
.update{position:absolute;bottom:5px;left:0;color:#bc9a6e;font-size:9px}.lotus-mobile-subtoggle{display:none}.menu-toggle{display:none;background:transparent;border:0;color:var(--wine);font-size:28px;cursor:pointer}
.main-frame{border:1px solid var(--frame);border-radius:5px;background:var(--cream);min-height:490px;padding:20px 29px 28px;box-shadow:0 11px 10px -10px #4d3c26a8;margin-bottom:20px}
.sr-only{position:absolute!important;width:1px!important;height:1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important}.title-graphic{display:block;height:44px;width:auto;max-width:100%;object-fit:contain;object-position:left center;margin:0 0 18px}.main-frame h1{font:700 43px/1.0 'Amatic SC','Arial Narrow',serif;color:var(--blue);margin:0 0 18px;letter-spacing:.3px}.main-frame h2{font:700 28px/1.1 'Amatic SC','Arial Narrow',serif}.main-frame p{margin:0 0 15px}.main-frame p:last-child{margin-bottom:0}
.two-columns{display:grid;grid-template-columns:300px minmax(0,1fr);gap:49px;align-items:start;margin:18px 21px 0}.two-columns.reverse-columns{grid-template-columns:minmax(0,1fr) 560px;gap:38px}
.green-box{background:linear-gradient(#dfe7a4,#e0eaa0);border-radius:3px;box-shadow:5px 6px 4px #0006;padding:14px 13px;color:var(--wine);font-weight:600;font-size:12px;line-height:1.52;overflow-wrap:anywhere}
.green-box h3{margin:0 0 12px;font-size:15px;color:var(--wine);line-height:1.3}.green-box p{margin:0 0 15px}.green-box ul{padding-left:19px;margin:8px 0 18px}.green-box li{margin:2px 0}.center{text-align:center}
.resort-layout{margin-left:29px;margin-right:29px;grid-template-columns:300px minmax(0,1fr);gap:48px}.resort-layout .green-box{min-height:475px}.resort-text{padding:12px}.resort-text p{margin:0 0 16px}
.room-layout{margin-left:38px;margin-right:18px;align-items:center}.room-layout .room-text{width:245px;min-height:282px}.room-layout .room-text p{margin-bottom:14px}
.gallery{position:relative;min-width:0;width:100%;aspect-ratio:558/355;border-radius:5px;box-shadow:0 10px 9px -7px #0008;background:#d5cfb8;overflow:hidden}.gallery-tall{aspect-ratio:300/480}.gallery .slide{position:absolute;inset:0;margin:0;opacity:0;pointer-events:none;transition:opacity .3s ease}.gallery .slide.active{opacity:1;pointer-events:auto}.gallery .slide img{width:100%;height:100%;object-fit:cover;display:block}.gallery .slide figcaption{position:absolute;left:10px;bottom:7px;color:#fff;background:#0008;font-size:10px;padding:3px 6px;border-radius:2px;opacity:0;transition:opacity .2s}.gallery:hover figcaption{opacity:1}.gallery button{position:absolute;z-index:5;top:42%;color:white;background:#14141470;border:0;font-size:32px;width:32px;height:49px;cursor:pointer;opacity:0}.gallery:hover button,.gallery:focus-within button{opacity:1}.gallery-prev{left:0}.gallery-next{right:0}.gallery-count{position:absolute;bottom:5px;right:8px;background:#1118;color:#fff;padding:2px 5px;font-size:11px;border-radius:3px;z-index:3}
.home-main{padding:20px 18px 16px}.home-hero{margin:0}.home-hero .gallery{aspect-ratio:938/458;border:1px solid #464b2d}.home-teasers{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:20px 15px 4px}.home-teasers .green-box{min-height:220px}.home-teasers .green-box h3{font-size:14px}.home-teasers .green-box p{font-size:11px}
.beaches-layout{display:flex;flex-direction:column;gap:25px;margin:6px 14px}.beaches-text{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;padding:20px}.beaches-layout .gallery{aspect-ratio:3/1}
.map-frame{border:1px solid #b6c1ad;min-height:355px;background:linear-gradient(35deg,#dce8d6,#d9e2ef);text-align:center;display:flex;flex-direction:column;align-items:center;justify-content:center;color:#547264;padding:20px}.map-icon{font-size:55px}.map-frame a{display:inline-block;background:white;border-radius:4px;padding:9px 14px}
.center-promo{text-align:center;max-width:600px;margin:15px auto}.instagram-text{min-height:360px;margin:0 auto 26px;max-width:380px}.external-hint,.small{font-size:11px;color:#9c7261}.text-link{display:inline-block;padding:9px 16px;background:var(--leaf);text-decoration:none;border:1px solid #a4b18b}
.price-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px;padding:0 20px}.price-grid>div{display:flex;flex-direction:column;gap:24px}.price-grid .green-box{padding:12px}.price-grid .green-box ul{padding-left:17px}.price-grid .green-box h3{font-size:15px}.price-grid .green-box p{margin-bottom:16px}.price-photo{width:100%;height:150px;object-fit:cover;border-radius:4px;box-shadow:0 7px 6px #0006}
.adult-layout{display:grid;grid-template-columns:1fr 320px;gap:35px;padding:12px}.adult-text{min-height:340px}.webcam-choices{display:grid;grid-template-columns:1fr 1fr;gap:25px;max-width:740px;margin:40px auto}.webcam-choices a{text-decoration:none}.webcam-choices a:hover{transform:translateY(-2px)}.webcam-panel{margin:20px auto;max-width:790px;min-height:350px;background:#111;color:#f3f3f3;padding:80px 22px;text-align:center}.webcam-panel a{color:#dfeaa0}
.active-layout{grid-template-columns:555px 300px;gap:26px}.about-layout{grid-template-columns:315px 1fr;gap:40px}.contact-layout{grid-template-columns:320px 1fr}.contact-form{display:grid;gap:12px;background:#ffd99c;padding:14px}.contact-form label{display:flex;flex-direction:column;gap:5px}.contact-form input,.contact-form textarea{background:transparent;border:1px solid #bc936e;border-radius:2px;padding:8px;color:#483e2d;font:inherit}.contact-form button{background:#d8e59d;padding:9px;border:1px solid #83935d;cursor:pointer;color:#604b41}
.wide-box{width:min(850px,100%);margin:auto;padding:25px 26px}.legal-text{font-size:12px;line-height:1.65}.legal-text p{margin-bottom:15px}.photo-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:22px}.gallery-tile img{width:100%;height:185px;object-fit:cover;border:4px solid white;box-shadow:0 3px 5px #0007}.footer{min-height:42px;display:flex;align-items:center;justify-content:space-between;padding:5px 16px;background:var(--cream);border:1px solid var(--frame);border-radius:3px;box-shadow:0 6px 7px #0005;margin:0 18px 23px;font-size:11px;font-weight:bold}.footer .social-icons{display:flex;gap:4px;align-items:center}.footer img{height:25px;width:auto;object-fit:contain}.footer .social-icons a{display:block}.footer .social-icons img{height:25px}.footer small{color:#ac8168}.doc-note{margin:15px 0;color:#9e7964;font-size:11px}
@media (max-width:900px) {
  /* Mobiler Wix-Kopf: alle Haupt- und Unterseiten, Desktop unveraendert. */
  .site {width:100%;max-width:none;margin:0 auto;}
  .site-header {display:block;box-sizing:border-box;width:100%;height:193px;min-height:193px;position:relative;overflow:visible;}
  .logo-area {position:absolute;top:8px;left:14px;width:275px;height:125px;}
  .brandmark {position:absolute;top:-10px;left:70px;width:min(242px,calc(100vw - 151px));height:125px;}
  .brandmark img {display:block;width:100%;height:auto;max-height:none;object-fit:contain;transform:none;filter:none;}
  .sha-picture {position:absolute;left:0;top:87px;display:block;width:66px;height:34px;z-index:1;}
  .sha-mark {position:static;display:block;width:66px;height:34px;object-fit:contain;}
  .site-right {position:static;padding:0;min-width:0;}
  .header-strip-wrap {display:block;position:absolute;top:150px;left:20px;width:calc(100% - 40px);height:27px;max-width:none;}
  .header-strip-wrap > picture {display:block;width:100%;height:100%;}
  .header-strip {display:block;width:100%;max-width:none;height:27px;object-fit:fill;border:1px solid #554e3b;border-radius:3px;box-shadow:0 4px 7px #0007;}
  .update {position:absolute;top:130px;bottom:auto;left:14px;font-size:9px;line-height:14px;color:#bc9a6e;}
  .menu-toggle {display:flex;align-items:center;justify-content:center;position:absolute;top:69px;right:16px;width:43px;height:43px;padding:0;border:1px solid #ac855c;border-radius:5px;background:#cfa16e;color:var(--sand);font-size:35px;font-weight:700;line-height:1;cursor:pointer;z-index:3001;box-shadow:none;}
  body.lotus-mobile-menu-open {overflow:hidden;}
  body.lotus-mobile-menu-open .menu-toggle {position:fixed;top:69px;right:16px;font-size:40px;}
  .site-nav {display:none;position:fixed;inset:0;z-index:3000;box-sizing:border-box;width:100%;height:100dvh;min-height:100vh;margin:0;padding:68px 20px 100px;overflow-x:hidden;overflow-y:auto;background:rgba(19,17,14,.70);border:0;border-radius:0;box-shadow:none;align-items:center;justify-content:center;flex-direction:column;gap:0;}
  .site-nav.is-open {display:flex;}
  .site-nav .nav-item {position:relative;display:flex;flex-direction:column;flex:0 0 auto;align-items:stretch;justify-content:center;width:min(215px,calc(100vw - 100px));min-height:40px;margin:0;border-bottom:1px solid rgba(255,208,144,.60);}
  .site-nav .nav-item:last-child {border-bottom:0;}
  .site-nav .nav-link,.site-nav .nav-item.active > .nav-link,.site-nav .nav-item:hover > .nav-link {display:block;box-sizing:border-box;width:100%;padding:8px 5px;margin:0;background:transparent;border:0;color:var(--sand);font:400 16px/1.35 Arial,Helvetica,sans-serif;letter-spacing:.16em;text-align:center;text-decoration:none;white-space:normal;}
  .site-nav .nav-item.active::after,.site-nav .nav-item::before {display:none;}
  .site-nav .nav-text-image {display:none;}
  .site-nav .nav-text-fallback {display:inline;color:var(--sand);}
  .site-nav .lotus-mobile-subtoggle {display:flex;position:absolute;left:15px;top:0;width:25px;height:40px;padding:0;border:0;background:transparent;color:var(--sand);align-items:center;justify-content:center;font:400 23px/1 Arial,Helvetica,sans-serif;cursor:pointer;z-index:1;}
  .site-nav .nav-item.open > .lotus-mobile-subtoggle {font-size:24px;}
  .site-nav .subnav,.site-nav .nav-item:not(.open) > .subnav {display:none;position:static;transform:none;width:100%;min-width:0;margin:0;padding:0 0 6px;background:transparent;border:0;box-shadow:none;z-index:auto;}
  .site-nav .nav-item.open > .subnav {display:block;}
  .site-nav .subnav a {display:block;padding:7px 8px;background:transparent;color:var(--sand);font:400 13px/1.4 Arial,Helvetica,sans-serif;letter-spacing:.08em;text-align:center;text-decoration:none;border-radius:0;}
  .site-nav .subnav a:hover,.site-nav .subnav a.current {background:rgba(255,208,144,.13);color:var(--sand);}
  /* Mobile submenu: the first link duplicates its parent page. */
  .site-nav .subnav > a:first-child {display:none;}
  /* Aktuelle Seite im mobilen Menue: nur der wirkliche Seitenlink, auch im Untermenue. */
  .site-nav .nav-link[aria-current="page"] .nav-text-fallback,
  .site-nav .subnav a[aria-current="page"] {color:#dfe7a4;font-weight:700;}
  /* Beidseitig exakt 10 CSS-Pixel Abstand fuer den hellen Hauptkasten. */
  .site > main.main-frame {box-sizing:border-box;width:calc(100% - 20px);max-width:none;margin:0 10px 20px;min-height:0;padding:20px 20px 25px; &:has(> h1){padding-top:10px;} }
  /* Ehemalige PNG-Seitentitel: mobile echte Textueberschrift mit 28px. */
  .main-frame > h1.desktop-title.sr-only {display:block!important;position:static!important;clip:auto!important;clip-path:none!important;overflow:visible!important;white-space:normal!important;width:auto!important;height:auto!important;min-height:44px!important;margin:0 0 8px!important;padding:0!important;border:0!important;color:#05286c!important;font-family:"Lotuslodge Amatic Original","Amatic SC","Arial Narrow",sans-serif!important;font-size:28px!important;font-weight:700!important;font-style:normal!important;line-height:1.25!important;letter-spacing:0!important;text-align:left!important;text-shadow:none!important;}
  /* Footer: 40px schmaler als der Hauptkasten (beidseitig 30px zum Bildschirmrand). */
  .site > .footer {box-sizing:border-box;width:calc(100% - 60px);margin:0 30px 15px;}
  /* Die originalen Desktop-Schatten, inkl. zweigeteiltem Wix-PNG, mobil nutzen. */
  .header-strip-wrap,.main-frame,.footer,.gallery-shadow-frame {position:relative;isolation:isolate;overflow:visible;}
  .header-strip-wrap {position:absolute;}
  .gallery-shadow-frame {display:block;width:100%;min-width:0;margin-inline:auto;}
  /* Original two-piece curved Wix shadow on content photographs only.
     Existing slider/header/main/footer shadows remain unchanged; no green-box is targeted. */
  .main-frame .lotus-mobile-image-shadow,
  .main-frame .gallery-tile,
  .main-frame .instagram-profile-link {
    position:relative;isolation:isolate;overflow:visible;
  }
  .main-frame .lotus-mobile-image-shadow {display:block!important;box-sizing:border-box;width:100%;max-width:100%;}
  .main-frame .lotus-mobile-image-shadow > img {display:block;}
  .main-frame .lotus-mobile-image-shadow::before,
  .main-frame .lotus-mobile-image-shadow::after,
  .main-frame .gallery-tile::before,
  .main-frame .gallery-tile::after,
  .main-frame .instagram-profile-link::before,
  .main-frame .instagram-profile-link::after {
    content:"";pointer-events:none;position:absolute;z-index:-1;
    bottom:-26px;width:50%;height:26px;
    background-image:url("../Start/Grafiken/wix-originalschatten.png");
    background-repeat:no-repeat;background-size:200% 26px;
    border:0;border-radius:0;filter:none;opacity:1;
  }
  .main-frame .lotus-mobile-image-shadow::before,
  .main-frame .gallery-tile::before,
  .main-frame .instagram-profile-link::before {left:-8px;background-position:0 0;}
  .main-frame .lotus-mobile-image-shadow::after,
  .main-frame .gallery-tile::after,
  .main-frame .instagram-profile-link::after {right:-8px;background-position:100% 0;}

  .header-strip-wrap::before,.header-strip-wrap::after,
  .main-frame::before,.main-frame::after,
  .footer::before,.footer::after,
  .gallery-shadow-frame::before,.gallery-shadow-frame::after {
    content:"";pointer-events:none;position:absolute;z-index:-1;
    bottom:-26px;width:165px;height:26px;
    background-image:url("../Start/Grafiken/wix-originalschatten.png");
    background-repeat:no-repeat;background-size:330px 26px;
    border:0;border-radius:0;filter:none;opacity:1;
  }
  .header-strip-wrap::before,.gallery-shadow-frame::before {left:-20px;background-position:0 0;}
  .header-strip-wrap::after,.gallery-shadow-frame::after {right:-20px;background-position:100% 0;}
  .main-frame::before {left:-10px;background-position:0 0;}
  .main-frame::after {right:-10px;background-position:100% 0;}
  .footer::before {left:-4px;background-position:0 0;}
  .footer::after {right:-4px;background-position:100% 0;}
  /* Mobile Infokaesten: kompakte, inhaltsabhaengige Breite und Hoehe; Originalschatten bleibt. */
  .main-frame .green-box {
    box-sizing:border-box;
    width:calc(100% - 16px);
    max-width:calc(100% - 16px);
    height:auto;
    min-height:0;
    margin-left:auto;
    margin-right:auto;
    align-self:start;
    justify-self:center;
    padding:10px 12px;
    line-height:1.39;
    box-shadow:5px 7px 5px rgba(0,0,0,.72);
  }
  .main-frame .green-box h3 {margin-bottom:9px;}
  .main-frame .green-box p {margin-bottom:10px;}
  .main-frame .green-box p:last-child {margin-bottom:0;}
  .main-frame .green-box ul {margin-top:6px;margin-bottom:10px;}
  .main-frame .green-box ul:last-child {margin-bottom:0;}
  .main-frame .green-box li {margin-top:1px;margin-bottom:1px;}
  .main-frame .green-box.legal-text {line-height:1.48;}
  .webcam-description {gap:20px;}
  /* Mobiler 1px-Fotorahmen (Schatten und Bildgroessen bleiben erhalten). */
  .main-frame .gallery {box-sizing:border-box;border:1px solid #000;border-radius:5px;overflow:hidden;margin-inline:auto;}
  .main-frame .gallery .slide img {border-radius:4px;}
  .main-frame .price-photo,.main-frame .webcam-screenshot img,
  .main-frame .cam-thumbnail img,.main-frame .gallery-tile img,
  .main-frame .photo-grid img,.main-frame .instagram-profile-card {
    box-sizing:border-box;border:1px solid #000;border-radius:5px;
  }
  .gallery-shadow-frame > .gallery {width:100%;}
  /* Vorhandenes Tablet-Inhaltslayout, ohne den Kopf erneut zu skalieren. */
  .two-columns,.two-columns.reverse-columns {margin:8px auto 0;gap:18px;}
  .two-columns {grid-template-columns:35% 1fr;}
  .two-columns.reverse-columns {grid-template-columns:32% 1fr;}
  .room-layout .room-text {width:calc(100% - 16px);}
  .price-grid {gap:13px;padding:0;margin-inline:auto;}
  .price-grid > div {gap:20px;}
  .price-grid .lotus-mobile-image-shadow > .price-photo {box-shadow:none;}
  .active-layout {grid-template-columns:55% 1fr;}
  .about-layout {grid-template-columns:34% 1fr;}
  .home-teasers {grid-template-columns:repeat(2,minmax(0,1fr));row-gap:20px;margin-top:30px;margin-bottom:0;}
  .beaches-layout {gap:30px;margin-bottom:0;}
}

@media (max-width:700px) {
  body {font-size:13px;}
  .main-frame {min-height:0;margin-bottom:15px;}
  .main-frame h1 {font-size:38px;}
  .title-graphic {height:39px;}
  .main-frame > h1.desktop-title.sr-only {min-height:39px!important;}
  .home-teasers {margin:30px 0 0;gap:20px 12px;}
  .two-columns,.two-columns.reverse-columns,.active-layout,.about-layout,.contact-layout,.adult-layout {display:flex;flex-direction:column;gap:23px;margin:0;}
  /* Zwischen vertikal aufeinanderfolgenden Slideshows und Infokaesten exakt 30px. */
  .two-columns:has(> .gallery-shadow-frame),.adult-layout:has(> .gallery-shadow-frame) {gap:30px;}
  /* Nur gruener Kasten direkt UNTER einer waagerechten Slideshow: 30px schmaler, mittig. */
  .two-columns > .gallery-shadow-frame:has(> .gallery:not(.gallery-tall)) + .green-box {
    box-sizing:border-box;width:calc(100% - 30px);max-width:calc(100% - 30px);margin-left:auto;margin-right:auto;flex:none;
  }
  .room-layout .room-text {width:calc(100% - 16px);}
  .room-layout .gallery,.gallery {width:100%;max-width:100%;}
  .resort-layout .green-box {min-height:0;}
  .gallery-tall {aspect-ratio:300/420;max-height:480px;}
  .green-box {font-size:12px;}
  .price-grid {grid-template-columns:1fr 1fr;}
  .beaches-text {grid-template-columns:1fr;}
  .webcam-choices {grid-template-columns:1fr;margin:15px;}
  .footer {margin:0 30px 15px;font-size:9px;}
  .footer img {max-width:72px;}
  .photo-grid {grid-template-columns:repeat(2,1fr);}
}

@media (max-width:440px) {
  .home-teasers,.price-grid {grid-template-columns:1fr;}
  .home-teasers .green-box {min-height:0;}
  .footer {padding:6px;gap:6px;}
  .footer .social-icons img {height:20px;}
  .photo-grid {grid-template-columns:1fr 1fr;}
  .gallery-tile img {height:120px;}
}


.webcam-index{min-height:600px}.webcam-home-grid{display:grid;grid-template-columns:330px 1fr;gap:50px;margin:2px 30px 0}.webcam-description{display:flex;flex-direction:column;justify-content:space-around;gap:65px}.webcam-description .green-box{text-align:center;padding:24px 10px;min-height:125px}.webcam-thumb-wrap{background:#ffd49a;border:1px solid #b99264;border-radius:4px;padding:15px 20px;box-shadow:0 4px 4px #0003;display:grid;gap:17px}.cam-thumbnail{text-align:center;display:grid;gap:5px;text-decoration:none;color:#6c2e13;font-weight:bold;font-size:11px}.cam-thumbnail img{width:320px;height:180px;object-fit:cover;max-width:100%;margin:auto;box-shadow:0 4px 4px #0005}.webcam-page{padding:20px 89px;min-height:490px}.webcam-screenshot{margin:0 auto;max-width:800px}.webcam-screenshot img{display:block;width:100%;height:auto;box-shadow:0 9px 6px #0006}.webcam-screenshot p{margin-top:10px!important;text-align:center;font-size:11px}.webcam-screenshot a{color:#734833}
@media(max-width:700px){.webcam-index{min-height:0}.webcam-home-grid{display:flex;flex-direction:column;gap:16px;margin:0}.webcam-description{gap:20px}.webcam-thumb-wrap{padding:15px}.webcam-screenshot img{width:100%}}




/* LOTUS-DESKTOP-MENUE-WIX-20261022
   Referenz: Screenshots Wix-Editor 14:54-14:55 Uhr.
   Menuebreite 580px, Wix-Schrift Amatic SC 22px fett, drei Designzustaende,
   hellgruener aktiver Reiter und 3px Ecken am Untermenue.
   Die vorhandenen Menue-Bildzeichen enthalten die Wix-Schriftformen und
   werden fuer offline stabile Darstellung beibehalten. Nur Desktop >900px.
   Touch/Tablet/Smartphone bleiben unveraendert.
*/
@media (min-width: 901px) {
  .site-right { padding-left: 4px; }
  .site-nav {
    box-sizing: border-box;
    width: 580px;
    min-height: 60px;
    margin: 0 0 0 20px;
    padding: 17px 0 0;
    gap: 0;
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    border-bottom: 1px solid #c79965;
    background: transparent;
    box-shadow: none;
  }
  /* Wix-Menue: feste relative Zellbreiten, zusammen exakt 580px.
     Damit stehen Home und Das Resort im Mouseover nahtlos nebeneinander. */
  .nav-item { margin: 0; flex: 0 0 auto; }
  .nav-item:nth-child(1) { flex-basis:10.862069%; }
  .nav-item:nth-child(2) { flex-basis:15.689655%; }
  .nav-item:nth-child(3) { flex-basis:17.068966%; }
  .nav-item:nth-child(4) { flex-basis:12.068966%; }
  .nav-item:nth-child(5) { flex-basis:14.482759%; }
  .nav-item:nth-child(6) { flex-basis:17.413793%; }
  .nav-item:nth-child(7) { flex-basis:12.413792%; }
  .nav-link { width:100%; text-align:center; }
  .nav-link .nav-text-image { margin-left:auto; margin-right:auto; }
  .nav-link {
    box-sizing: border-box;
    padding: 0 3px;
    margin: 0;
    font-family: 'Amatic SC', 'Arial Narrow', serif;
    font-size: 22px;
    font-weight: 700;
    line-height: 1.1;
    color: #805047;
    background: transparent;
    box-shadow: none;
    border-radius: 0;
  }
  .nav-text-image { height: 24px; width: auto; max-width: none; display: block; }
  .nav-item.active > .nav-link { background: #d0d98d; }
  .nav-item.active::after { top: 24px; border-width: 10px; border-top-color: #d0d98d; }
  .nav-item:hover > .nav-link { background: #c79965; }
  .nav-item.active:hover > .nav-link { background: #d0d98d; }
  /* Der aktive Reiter bleibt gruen; nur die anderen erhalten den braunen Wix-Hover. */
  .nav-item.active:hover > .nav-link .nav-text-image,
  .nav-item.active:focus-within > .nav-link .nav-text-image { filter: none; }
  .nav-item:hover > .nav-link .nav-text-fallback,
  .nav-item:focus-within > .nav-link .nav-text-fallback { color: #fff; }
  .nav-item.active:hover > .nav-link .nav-text-fallback,
  .nav-item.active:focus-within > .nav-link .nav-text-fallback { color: #805047; }
  /* Unsichtbarer Hover-Korridor fuer den Abstand zum Dropdown. */
  .nav-item:has(.subnav)::before {content:"";position:absolute;top:100%;left:0;right:0;height:11px;pointer-events:auto;}
  .nav-item:hover > .nav-link .nav-text-image,
  .nav-item:focus-within > .nav-link .nav-text-image {
    filter: brightness(0) invert(1);
  }
  .nav-link:focus-visible { outline: 2px solid #805047; outline-offset: 2px; }
  /* Wix-Original: kompaktes hellbraunes Dropdown direkt unter dem Hauptpunkt.
     Nicht das fruehere 140px/Arial-Untermenue verwenden. */
  .subnav {
    top: calc(100% + 10px);
    left: 0;
    box-sizing: border-box;
    width: max-content;
    min-width: 100%;
    padding: 0;
    background: #c79965;
    border: 0;
    border-radius: 3px;
    box-shadow: none;
    overflow: visible;
  }
  .subnav > a:first-child[href$="index.html"] { display:none; }
  .subnav a {
    display:flex;
    align-items:center;
    justify-content:center;
    box-sizing:border-box;
    height:50px;
    padding:0 9px;
    white-space:nowrap;
    border:0;
    border-radius:0;
    background:#c79965;
    color:#805047;
    font-family:"Lotuslodge Amatic Original","Amatic SC","Arial Narrow",sans-serif;
    font-size:22px;
    font-style:normal;
    font-weight:700;
    line-height:1;
    letter-spacing:0;
    text-align:center;
    text-decoration:none;
  }
  .subnav a:hover, .subnav a:focus-visible, .subnav a.current {
    background:#d0d98d;
    color:#805047;
  }
  .subnav a:first-child { border-radius:3px 3px 0 0; }
  .subnav a:last-child { border-radius:0 0 3px 3px; }
}
@media (min-width: 901px) and (max-width: 1009px) {
  .site-nav { width: calc(100% - 8px); }
  .nav-link { padding: 0 2px; }
  .nav-text-image { height: 22px; }
  .nav-item.active::after { top: 22px; }
}

/* LOTUS-DESKTOP-PUNKTE-1-BIS-5-20261022
   Nur Desktop. Gleiche zweigeteilte 330x26-Schatten-Sprite-Technik
   wie die Wachterhaus-Website. Alle Rahmen mit border-box. */
@media (min-width: 901px) {
  /* Punkt 1: Menu zeigt Text in lokalem Amatic SC nur, wenn Font vorhanden. */
  .site-nav .nav-link { font-family:"Lotuslodge Amatic Original", "Amatic SC", sans-serif; font-size:22px; font-weight:700; letter-spacing:0; }
  html.lotus-menu-font-ready .site-nav .nav-text-image {display:none;}
  html.lotus-menu-font-ready .site-nav .nav-text-fallback {display:inline-block;line-height:24px;vertical-align:middle;}
  html.lotus-menu-font-ready .site-nav .nav-link {height:24px; padding:0 3px;}
  html.lotus-menu-font-ready .site-nav .nav-item.active::after {top:24px;}
  /* Punkt 4: keine zusaetzliche Verschattung am Logo. */
  .brandmark,.brandmark img,.logo-area .brandmark img {filter:none!important;box-shadow:none!important;text-shadow:none!important;}
  /* Punkt 5: ein Pixel schwarz, keine Positions- oder Groessenaenderung. */
  .header-strip {box-sizing:border-box;border:1px solid #000;border-radius:2px; box-shadow:none!important;}
  .main-frame {box-sizing:border-box;border:1px solid #000;box-shadow:none!important;}
  .footer {box-sizing:border-box;border:1px solid #000;box-shadow:none!important;}
  .footer .social-icons {display:flex;align-items:center;}
  .footer .social-icons a {display:flex;align-items:center;justify-content:center;line-height:0;}
  .footer .social-icons img {display:block;}
  .gallery {box-sizing:border-box;border:1px solid #000!important;box-shadow:none!important;}
  /* Schatten bilden die linken und rechten 165px-Haelften ab. */
  .header-strip-wrap, .main-frame, .footer, .gallery-shadow-frame {
    position:relative;isolation:isolate;overflow:visible;
  }
  .header-strip-wrap {display:block;width:578px;max-width:100%;height:48px;}
  .header-strip-wrap>.header-strip {width:100%;height:100%;display:block;max-width:100%;object-fit:fill;}
  .gallery-shadow-frame {width:100%; min-width:0;}
  .header-strip-wrap::before,.header-strip-wrap::after,
  .main-frame::before,.main-frame::after,
  .footer::before,.footer::after,
  .gallery-shadow-frame::before,.gallery-shadow-frame::after {
    content:"";pointer-events:none;position:absolute;z-index:-1;
    bottom:-26px;width:165px;height:26px;
    background-image:url("../Start/Grafiken/wix-originalschatten.png");
    background-repeat:no-repeat;background-size:330px 26px;
    border:0;border-radius:0;filter:none;opacity:1;
  }
  .header-strip-wrap::before,.main-frame::before,.footer::before,.gallery-shadow-frame::before {
    left:-20px;background-position:0 0;
  }
  .header-strip-wrap::after,.main-frame::after,.footer::after,.gallery-shadow-frame::after {
    right:-20px;background-position:100% 0;
  }
  /* Shadow sprite is behind the image, not over the photo. */
  .gallery-shadow-frame>.gallery {width:100%;}
  /* Punkt 3: nur die Desktop-Slideshow erhaelt acht weitere Originalbilder. */
  .home-hero .gallery-shadow-frame {width:100%;}
}
@media (max-width: 900px) {
  /* Extraverpackung ist in Tablet-/Mobilansichten geometrisch neutral. */
  .header-strip-wrap,.gallery-shadow-frame {display:block;}
  .home-hero .gallery .desktop-only-slide {display:none!important;}
}

/* LOTUS-DESKTOP-KORREKTUREN-20261022-PUNKTE-1-4-5-6-7
   Referenz: originale Wix-Desktopansicht, Logo und Menuepfeil im direkten
   Screenshotvergleich. Nur ab 901 CSS-Pixeln. Mobile und Tablet eingefroren.
   Punkt 2/3: veraltete HTML-Seiten und die Menueverweise sind entfernt.
*/
@media (min-width:901px) {
  /* P1: Original-Logo ohne zusaetzlichen Schatten und ohne Verzerrung.
     Screenshotmessung: sichtbare Logo-Bildflaeche ca. 271px breit. */
  .logo-area .brandmark {height:171px;}
  .logo-area .brandmark img {
    display:block;
    position:relative;
    top:1px;
    width:271px;
    height:170px;
    max-height:none;
    object-fit:contain;
    transform:translateX(25px);
    filter:none!important;
    box-shadow:none!important;
  }
  /* P6: Wix-Grundflaeche des aktiven Reiters ca. 28px hoch; Spitze 20x10px. */
  .site-nav .nav-item.active::after {
    border-width:10px;
    border-top-color:#d0d98d;
    filter:drop-shadow(0 1px 0 rgba(128,94,58,.42));
  }
  html.lotus-menu-font-ready .site-nav .nav-link {
    height:28px;
    line-height:28px;
  }
  html.lotus-menu-font-ready .site-nav .nav-text-fallback {
    line-height:28px;
  }
  html.lotus-menu-font-ready .site-nav .nav-item.active::after {
    top:28px;
  }
}

/* LOTUS-DESKTOP-KORREKTUREN-20261022-PUNKTE-1-BIS-6
   Original-Wix-LiftedShadow wird durch die vorhandenen Wrapper und
   das unveraenderte 330x26px-Sprite angezeigt. Keine neuen Schattenlayer.
   P5: Panoramabild 578x50px, 3px rechts und 2px nach unten.
   P4: Die vier Startseitenkarten mit staerkerem Original-Kantenschatten.
   P3: SHA-Plus+-Original liegt als 3356px-PNG vor und wird per <picture>
   ausschliesslich fuer Desktop geladen.
*/
@media (min-width: 901px) {
  .site-right .header-strip-wrap {
    width:578px; max-width:100%; height:50px;
    transform:translate(3px,2px);
  }
  .site-right .header-strip-wrap > .header-strip {
    width:100%; height:100%; object-fit:fill;
  }
  .home-teasers .green-box {
    box-shadow:5px 7px 5px rgba(0,0,0,.72);
  }
}


/* LOTUS-DESKTOP-ABGLEICH-20261022-RUNDE-8
   Freigegebene Punkte 1-8, ausschliesslich Desktop ab 901px.
   Mobile/Tablet behalten originale Bild- und Darstellungspfade.
*/
@media (min-width: 901px) {
  /* 1: Alle gruenen Infokaesten optisch nach den Home-Kaesten. */
  .main-frame .green-box {
    background:linear-gradient(to bottom,#c9d187 0%,#dce695 55%,#dce695 100%);
    color:#80463e;
    font-size:11px;
    font-weight:600;
    line-height:1.25;
    border-radius:3px;
    box-shadow:5px 7px 5px rgba(0,0,0,.72);
  }
  .main-frame .green-box h3,
  .main-frame .green-box h2,
  .main-frame .green-box h4,
  .main-frame .green-box p,
  .main-frame .green-box li,
  .main-frame .green-box ul,
  .main-frame .green-box strong,
  .main-frame .green-box b {
    color:#80463e;
    font-size:11px;
    font-weight:600;
    line-height:1.25;
  }
  /* 2: Zuvor rein grafische Unterseitentitel als echter lokaler Amatic-SC-Text.
     Blockhoehe & Abstand entsprechen dem bisherigen 44px-PNG-Titel. */
  .main-frame > .title-graphic {display:none!important;}
  .main-frame > h1.desktop-title.sr-only {
    display:block!important;
    position:static!important;
    clip:auto!important;
    clip-path:none!important;
    overflow:visible!important;
    white-space:normal!important;
    width:auto!important;
    height:44px!important;
    min-height:44px!important;
    padding:0!important;
    margin:0 0 18px!important;
    border:0!important;
    color:#05286c!important;
    font-family:'Lotuslodge Amatic Original','Amatic SC',sans-serif!important;
    font-size:42px!important;
    font-weight:700!important;
    font-style:normal!important;
    line-height:44px!important;
    letter-spacing:0!important;
    text-align:left!important;
    text-shadow:none!important;
  }
  /* 3-6: Nur auf Hover wird die Schrift weiss; brauner Grund bleibt.
     45px Feldhoehe, 3px Abrundung jeder Zeile, Dropdown-Mitte = Wortmitte. */
  .site-nav .nav-item > .subnav {
    left:50%;right:auto;
    transform:translateX(-50%);
    border-radius:3px;
    background:#c79965;
  }
  .site-nav .subnav > a {
    height:45px;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:0 9px;
    border-radius:3px!important;
    background:#c79965;
    color:#805047;
    text-align:center;
    font-family:'Lotuslodge Amatic Original','Amatic SC',sans-serif;
    font-weight:700;
    line-height:1;
  }
  .site-nav .subnav > a.current {background:#c79965;color:#805047;}
  .site-nav .subnav > a:hover,
  .site-nav .subnav > a:focus-visible,
  .site-nav .subnav > a.current:hover,
  .site-nav .subnav > a.current:focus-visible {
    background:#c79965;
    color:#fff;
  }
  /* 7: Originale Desktop-JPGs ohne Filter / zusaetzliche Skalierung.
     CSS veraendert keine Pixel der Quelldateien. */
  .site-right .header-strip-wrap {
    width:578px;
    height:48px;
  }
  .site-right .header-strip-wrap > picture {
    display:block;
    width:100%;height:100%;
  }
  .site-right .header-strip-wrap > picture > img.header-strip {
    display:block;
    width:100%;height:100%;
    max-width:none;
    object-fit:fill;
    image-rendering:auto;
    filter:none;
  }
  .logo-area .sha-mark {
    width:100px;
    height:51px;
    object-fit:contain;
    image-rendering:auto;
    filter:none;
  }
  /* 8: Gemeinsame linke obere Bezugsecke / Aussenbreite der Index-Seite. */
  .site > main.main-frame {
    box-sizing:border-box;
    width:100%;
    margin-left:0;
    margin-right:0;
  }
  /* Sechs gemeinsam freigegebene Desktop-Punkte: 22.10.2026. */
  /* P1: Bildwechsel alle drei Sekunden, 1 Sekunde echte Ueberblendung. */
  .gallery .slide {transition:opacity 1s ease-in-out;}
  /* Inhaltsbilder: feine Rundung und 1px Rahmen. Transparente Logos und Icons bleiben frei. */
  .main-frame .gallery {border-radius:4px;overflow:hidden;}
  .main-frame .gallery .slide img {border-radius:3px;}
  .main-frame .price-photo,
  .main-frame .webcam-screenshot img,
  .main-frame .cam-thumbnail img,
  .main-frame .gallery-tile img,
  .main-frame .photo-grid img {box-sizing:border-box;border:1px solid #000;border-radius:4px;}

  /* P4: kompakte Zeilen / Absaetze der Original-Wix-Infotafeln. */
  .main-frame .green-box {line-height:1.25;}
  .main-frame .green-box p {margin-bottom:12px;}
  .main-frame .green-box h2,
  .main-frame .green-box h3,
  .main-frame .green-box h4 {font-size:14px;line-height:1.25;font-weight:600;}
  /* P6: keine willkuerlich hohen leeren Kaesten; mindestens 20px unten. */
  .site > main.main-frame:not(.home-main) {min-height:0;padding-bottom:20px;}

  /* P5: Preiskasten-Anordnung nach Wix-Referenz, Koordinaten im 980px-Layout. */
  .price-grid {position:relative;display:block;box-sizing:border-box;margin-top:-6px;padding:0;width:100%;height:566px;}
  .price-grid>div {display:contents;}
  .price-grid .green-box {position:absolute;box-sizing:border-box;margin:0;padding:12px 12px;line-height:1.25;font-size:11px;min-width:0;}
  .price-grid .green-box h3 {font-size:14px;line-height:1.25;margin:0 0 12px;}
  .price-grid .green-box p {margin:0 0 15px;}
  .price-grid .green-box ul {padding-left:17px;margin:5px 0 18px;}
  .price-grid .green-box li {margin:1px 0;line-height:1.25;}
  .price-grid .price-photo {position:absolute;object-fit:cover;border-radius:3px;margin:0;}
  .price-grid>div:nth-child(1)>.green-box {left:21px;top:30px;width:270px;height:323px;}
  .price-grid>div:nth-child(1)>.price-photo {left:29px;top:388px;width:260px;height:154px;}
  .price-grid>div:nth-child(2)>.green-box:first-child {left:326px;top:0;width:270px;height:279px;}
  .price-grid>div:nth-child(2)>.price-photo {left:342px;top:308px;width:238px;height:96px;}
  .price-grid>div:nth-child(2)>.green-box:last-child {left:326px;top:427px;width:270px;height:139px;}
  .price-grid>div:nth-child(3)>.price-photo {left:632px;top:-10px;width:260px;height:152px;}
  .price-grid>div:nth-child(3)>.green-box {left:626px;top:180px;width:270px;height:327px;}
  .main-frame:has(>.price-grid) {padding-bottom:26px!important;}

}
@media (max-width:900px) {
  /* Zusätzlicher picture-Wrapper ist geometrisch neutral. */
  .site-right .header-strip-wrap > picture {display:block;width:100%;height:100%;}
}


/* Runde 11 / Punkte 2–9: Preise und Adults Only – ausschliesslich Desktop. */
.adult-desktop-copy {display:none;}
@media (min-width:901px) {
  /* 2/3: Sonstiges – kompletter Inhalt mittig, unterer = oberer Innenabstand. */
  .price-grid>div:nth-child(3)>.green-box {text-align:center;top:163px;height:303px;}
  .price-grid>div:nth-child(3)>.green-box h3 {margin-bottom:15px;}
  .price-grid>div:nth-child(3)>.green-box p {margin-bottom:21px;}
  .price-grid>div:nth-child(3)>.green-box p:last-child {margin-bottom:0;}
  /* 4–7: Nur die drei anderen Ueberschriften mittig; Text bleibt erhalten. */
  .price-grid>div:nth-child(1)>.green-box h3,
  .price-grid>div:nth-child(2)>.green-box h3 {text-align:center;}
  /* Die Kastenoberkanten bleiben unveraendert, nur die unteren Kanten werden reduziert. */
  .price-grid>div:nth-child(1)>.green-box {height:268px;}
  .price-grid>div:nth-child(2)>.green-box:first-child {height:235px;}
  .price-grid>div:nth-child(2)>.green-box:last-child {height:119px;}
  /* 8: Untere Fotos + Treuerabatt nach oben, Freiflaeche/Hauptkasten reduzieren. */
  .price-grid {height:487px;}
  .price-grid>div:nth-child(1)>.price-photo {top:319px;}
  .price-grid>div:nth-child(2)>.price-photo {top:251px;}
  .price-grid>div:nth-child(2)>.green-box:last-child {top:373px;}
  .main-frame:has(>.price-grid) {padding-bottom:25px!important;}
  /* Adults Only: Bild links ausserhalb der Infokarte, Karte rechts. */
  .main-frame:has(>.adult-layout) {height:auto;min-height:0;padding-bottom:30px!important;}
  .adult-layout {display:flex;flex-direction:row;align-items:center;gap:52px;margin:4px 22px 0 22px;padding:0;}
  .adult-layout>.gallery-shadow-frame {order:1;position:relative;left:auto;top:auto;flex:0 0 325px;width:325px;height:233px;z-index:1;}
  .adult-layout .gallery {width:325px;height:233px;aspect-ratio:auto;border-radius:4px;}
  .adult-layout .gallery .slide img {width:100%;height:100%;object-fit:cover;}
  .adult-layout>.adult-text {order:0;position:relative;left:auto;top:auto;flex:1 1 0;min-width:0;width:auto;height:auto;min-height:0;
    box-sizing:border-box;padding:16px;overflow:visible;font-size:11px;line-height:1.25;}
  .adult-layout>.adult-text>h3,.adult-layout>.adult-text>p {display:none;}
  .adult-layout .adult-desktop-copy {display:block;width:auto;max-width:none;}
  .adult-layout .adult-desktop-copy h3 {font-size:14px;margin:0 0 14px;line-height:1.25;}
  .adult-layout .adult-desktop-copy p {font-size:11px;text-align:center;margin:0 0 11px;line-height:1.25;}
  .adult-layout .adult-desktop-copy ul {font-size:11px;padding-left:17px;margin:10px 0;line-height:1.25;}
  .adult-layout .adult-desktop-copy li {font-size:11px;margin:0 0 2px;line-height:1.25;}
  .adult-layout .adult-desktop-copy .adult-bottom-line {margin:12px 0 0;}
}