/* Ostsee Refresh V2 – deutlich sichtbare Desktop-Überarbeitung
   Ergänzt die vorhandenen Styles. Inhalte/Funktionen/Bilder bleiben unverändert. */

:root{
  --ink:#20313A;
  --sea:#0E5A75;
  --sea-dark:#083E52;
  --water:#DCEFF3;
  --sand:#F5E9D6;
  --paper:#FFFDF9;
  --line:#C9DDE3;
  --muted:#58717B;
  --accent:#D46A4C;
  --accent-hover:#AE4D35;
}

/* etwas klarere Grundhierarchie */
body{background:#fff;color:var(--ink)}
.eyebrow.dark{color:var(--sea);font-weight:900}
.button.primary,.nav-cta{background:var(--accent);color:#fff!important}
.button.primary:hover,.nav-cta:hover{background:var(--accent-hover)}

/* MOBILE: bestehendes Layout weitgehend erhalten */
@media(max-width:767px){
  .hero{box-shadow:0 14px 34px rgba(8,62,82,.16)}
  .mobile-cta a{background:var(--accent)!important;color:#fff!important}
}

/* DESKTOP/TABLET: sichtbarer, klarer Ostsee-Look */
@media(min-width:768px){
  .wrap{width:min(1240px,calc(100% - 64px))}

  .topbar{
    height:82px;
    padding-inline:max(32px,calc((100vw - 1240px)/2));
    background:rgba(255,255,255,.96);
    border-bottom:1px solid rgba(8,62,82,.14);
    box-shadow:0 5px 24px rgba(8,62,82,.06);
  }
  .topbar nav{gap:27px}
  .topbar nav a:not(.nav-cta){position:relative;padding:9px 0}
  .topbar nav a:not(.nav-cta)::after{
    content:"";position:absolute;left:0;right:100%;bottom:2px;height:2px;
    background:var(--sea);transition:right .2s ease;
  }
  .topbar nav a:not(.nav-cta):hover::after{right:0}
  .nav-cta{padding:12px 20px;box-shadow:0 8px 20px rgba(212,106,76,.22)}

  .hero{
    width:min(1380px,calc(100% - 48px));
    min-height:660px;
    height:min(760px,calc(100svh - 104px));
    margin-top:22px;
    border-radius:30px;
    box-shadow:0 28px 70px rgba(8,62,82,.22);
  }
  .hero-shade{
    background:linear-gradient(90deg,rgba(8,62,82,.93) 0%,rgba(8,62,82,.74) 38%,rgba(8,62,82,.26) 68%,rgba(8,62,82,.06) 100%);
  }
  .hero-content{max-width:1240px;padding-left:26px}
  .hero h1{font-size:clamp(64px,6.6vw,98px);max-width:820px;text-shadow:0 4px 30px rgba(0,0,0,.18)}
  .hero-subline{font-size:clamp(30px,3vw,46px);max-width:760px}
  .hero-copy{max-width:700px;font-size:20px;line-height:1.6}
  .hero-facts{gap:10px;margin-top:3px}
  .hero-facts span{padding:9px 14px;background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.42)}
  .hero-actions{margin-top:2px}
  .hero-actions .button{min-height:50px;padding-inline:25px}

  /* Vorteile als markanter dunkelblauer Block */
  .quickfacts-heading{margin-top:42px;margin-bottom:12px}
  .quickfacts-heading .eyebrow{font-size:13px;letter-spacing:.16em}
  .quickfacts{
    margin-top:0;
    background:linear-gradient(135deg,var(--sea-dark),var(--sea));
    border:0;
    border-radius:24px;
    overflow:hidden;
    box-shadow:0 22px 46px rgba(8,62,82,.20);
  }
  .quickfacts article{padding:29px 30px;border-right:1px solid rgba(255,255,255,.18)!important}
  .quickfacts article:last-child{border-right:0!important}
  .quickfacts span{color:#fff;font-size:31px}
  .quickfacts p{color:rgba(255,255,255,.78);font-size:14px}

  /* Intro als echte Inhaltskarte */
  .intro{
    margin-top:70px;margin-bottom:70px;padding:58px 62px;
    grid-template-columns:1fr 1fr;gap:74px;
    background:linear-gradient(135deg,#fff 0%,#fff 56%,var(--water) 100%);
    border:1px solid var(--line);border-radius:28px;
    box-shadow:0 18px 48px rgba(8,62,82,.08);
  }
  .intro::before{display:none}
  .intro h2{font-size:clamp(46px,4.3vw,68px)}
  .intro-copy{font-size:18px;line-height:1.78}

  /* Saisonbereiche als klar getrennte Farbbänder */
  .summer-freshness,.winter-freshness{margin-bottom:0;padding:66px 0}
  .summer-freshness{background:var(--sand);border-top:1px solid #ead7b9;border-bottom:1px solid #ead7b9}
  .winter-freshness{background:var(--water);border-bottom:1px solid var(--line)}
  .summer-freshness h2,.winter-freshness h2{font-size:clamp(44px,4.4vw,64px)}

  /* Umgebung: große Bildkarten und mehr Kontrast */
  .nearby-section{padding:78px 0 86px;background:#f7fbfc}
  .nearby-heading{margin-bottom:34px}
  .nearby-card{border-radius:22px;border:1px solid var(--line);box-shadow:0 16px 38px rgba(8,62,82,.09)}
  .nearby-card div{padding:27px 29px 30px}
  .nearby-card h3{color:var(--sea-dark)}
  .nearby-card:hover{transform:translateY(-3px);box-shadow:0 22px 46px rgba(8,62,82,.13)}
  .nearby-card{transition:transform .2s ease,box-shadow .2s ease}

  /* Galerie wirkt auf Desktop wie eigene visuelle Bühne */
  .photo-grid{width:min(1240px,calc(100% - 64px));gap:14px;padding-top:70px;padding-bottom:70px}
  .photo,.gallery-more{border-radius:20px}
  .photo{box-shadow:0 10px 28px rgba(8,62,82,.09)}
  .gallery-more{background:var(--sea-dark)}

  /* 360°-Karte */
  .tour-section{padding:0 0 70px}
  .tour-card{
    grid-template-columns:1fr 220px;
    background:linear-gradient(125deg,var(--water),#fff 68%);
    border:1px solid var(--line);border-radius:26px;padding:48px 54px;
    box-shadow:0 16px 40px rgba(8,62,82,.08);
  }
  .tour-badge{background:var(--sea-dark);color:#fff;border:0;box-shadow:0 15px 34px rgba(8,62,82,.2)}

  /* Ausstattung: starke visuelle Zweiteilung */
  .amenities-section{
    padding:84px 0;
    background:linear-gradient(90deg,var(--sea-dark) 0%,var(--sea-dark) 37%,var(--sand) 37%,var(--sand) 100%);
    border:0;
  }
  .amenities-layout{grid-template-columns:.78fr 1.22fr;gap:86px}
  .sticky-title{padding:34px 34px 38px;border-radius:24px;color:#fff;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.16)}
  .sticky-title .eyebrow.dark{color:#bfe4ec}
  .sticky-title h2{color:#fff}
  .sticky-title>p:last-child{color:rgba(255,255,255,.78)}
  .amenity-list{display:grid;grid-template-columns:1fr 1fr;gap:14px}
  .amenity-list article{
    display:grid;grid-template-columns:44px 1fr;gap:14px;
    padding:24px;background:#fff;border:1px solid rgba(8,62,82,.11)!important;
    border-radius:18px;box-shadow:0 10px 26px rgba(8,62,82,.07)
  }
  .amenity-list article>span{display:grid;place-items:center;width:38px;height:38px;border-radius:50%;background:var(--water);color:var(--sea-dark)}
  .amenity-list h3{font-size:25px;color:var(--sea-dark)}

  .detail-facts{padding-top:66px;padding-bottom:66px}
  .detail-facts-grid{gap:16px}
  .detail-facts-grid article{padding:22px;border-radius:18px;box-shadow:0 10px 28px rgba(8,62,82,.07)}

  /* Standort als große editorial Karte */
  .split-feature#lage{
    width:min(1380px,calc(100% - 48px));margin:0 auto 70px;
    grid-template-columns:1.08fr .92fr;min-height:650px;
    border-radius:28px;overflow:hidden;background:#fff;
    border:1px solid var(--line);box-shadow:0 22px 56px rgba(8,62,82,.11);
  }
  .split-feature#lage .split-copy{padding:64px 58px}
  .split-feature#lage .location-highlight{background:var(--water)}

  /* Veranstaltungen als leichtes Wasserband */
  .events-section{padding:82px 0;background:linear-gradient(180deg,var(--water),#f8fcfd)}
  .event-grid{gap:16px}
  .event-grid article{background:#fff;border-radius:18px;border:1px solid var(--line);box-shadow:0 9px 24px rgba(8,62,82,.06)}
  .event-grid article:hover{transform:translateY(-2px)}
  .event-grid article{transition:transform .2s ease}

  /* Bewertungen als hochwertiger Vertrauensblock */
  .reviews{
    width:min(1240px,calc(100% - 64px));
    margin:76px auto 44px;padding:58px;
    background:#fff;border:1px solid var(--line);border-radius:28px;
    box-shadow:0 20px 50px rgba(8,62,82,.09);
  }
  .reviews::before{display:none}
  .rating-sources{grid-template-columns:repeat(3,1fr);gap:16px}
  .rating-source{padding:28px;border-radius:18px;background:linear-gradient(180deg,#fff,var(--water));box-shadow:none}
  .rating-big span{color:var(--accent)}
  .review-grid blockquote{background:var(--sand);border:1px solid #ead7b9}

  .image-band{width:min(1240px,calc(100% - 64px));height:560px;border-radius:28px;box-shadow:0 20px 50px rgba(8,62,82,.12)}
  .image-band::after{content:"";position:absolute;inset:0;border-radius:inherit;background:linear-gradient(90deg,rgba(8,62,82,.70),rgba(8,62,82,.10) 70%);pointer-events:none}
  .image-band .band-copy{z-index:2}

  /* Preise klarer und buchungsorientierter */
  .pricing{
    width:min(1240px,calc(100% - 64px));
    margin:70px auto 28px;padding:58px;
    background:var(--sand);border-radius:28px;border:1px solid #ead7b9;
  }
  .pricing::before{display:none}
  .price-cards{gap:18px}
  .price-cards article{border-radius:20px!important;box-shadow:0 12px 30px rgba(8,62,82,.08)}
  .price-cards article.featured{background:linear-gradient(135deg,var(--sea-dark),var(--sea));transform:translateY(-6px)}

  .prebooking{padding-top:14px;padding-bottom:34px}
  .prebooking span{padding:11px 17px;border-color:var(--line)}

  /* Anfrage als klarer Abschluss */
  .booking{padding:82px 0;background:linear-gradient(135deg,#062f40 0%,var(--sea-dark) 48%,var(--sea) 100%)}
  .booking-layout{gap:70px;align-items:start}
  .booking-copy{padding-top:26px}
  .booking-form{border-radius:22px;padding:30px;box-shadow:0 22px 50px rgba(0,0,0,.18)}
  .booking-form .button.primary{min-height:50px}
  footer{background:#052d3b}
}

/* Zwischenbreiten: Karten bleiben ruhig */
@media(min-width:768px) and (max-width:1050px){
  .amenities-section{background:var(--sand)}
  .sticky-title{background:var(--sea-dark)}
  .amenities-layout{grid-template-columns:1fr;gap:28px}
  .amenity-list{grid-template-columns:1fr 1fr}
  .rating-sources{grid-template-columns:1fr 1fr}
}
