:root{
  --bg:#f7f2ea;
  --bg-soft:#fbf8f3;
  --panel:rgba(255,255,255,.72);
  --panel-strong:rgba(255,255,255,.86);
  --line:rgba(19,42,50,.12);
  --text:#29363c;
  --muted:#6b797f;
  --deep:#142b33;
  --accent:#9f8558;
  --accent-soft:#cdb78f;
  --shadow:0 22px 60px rgba(17,33,40,.12);
  --radius:28px;
  --max:1240px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  color:var(--text);
  background:
    radial-gradient(circle at top left, rgba(206,190,160,.18), transparent 32%),
    linear-gradient(180deg, #f8f4ee 0%, #f5f0e8 46%, #f9f6f1 100%);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  line-height:1.7;
  letter-spacing:.01em;
}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
.site{min-height:100vh}
.container{width:min(calc(100% - 40px), var(--max)); margin:0 auto}
.header{
  position:sticky; top:0; z-index:50;
  backdrop-filter: blur(18px);
  background:rgba(250,247,241,.58);
  border-bottom:1px solid rgba(255,255,255,.35);
}
.header.scrolled{background:rgba(248,244,238,.9); box-shadow:0 8px 30px rgba(0,0,0,.05)}
.header-inner{width:min(calc(100% - 40px), var(--max)); margin:0 auto; min-height:84px; display:flex; align-items:center; justify-content:space-between; gap:24px}
.brand{display:flex;align-items:center;gap:14px;min-width:0}
.brand-logo{width:62px;height:62px;object-fit:contain;border-radius:18px; padding:6px; background:rgba(255,255,255,.45); box-shadow:0 10px 25px rgba(19,42,50,.08)}
.brand-text{display:flex; flex-direction:column; gap:1px; font-family:"Cormorant Garamond", Georgia, serif; color:var(--deep); line-height:1}
.brand-text small{font-family:Inter, sans-serif; text-transform:uppercase; letter-spacing:.18em; font-size:.63rem; color:var(--muted)}
.brand-text strong{font-size:1.55rem; font-weight:500; letter-spacing:.02em}
.nav-wrap{display:flex; align-items:center; gap:18px}
.nav{display:flex; align-items:center; gap:24px; flex-wrap:wrap; justify-content:flex-end}
.nav a{font-size:.94rem; color:#41525a; position:relative; padding:4px 0; font-weight:400}
.nav a::after{content:""; position:absolute; left:0; right:0; bottom:-6px; height:1px; background:var(--accent); transform:scaleX(0); transform-origin:left; transition:.28s ease}
.nav a:hover::after,.nav a.active::after{transform:scaleX(1)}
.lang{display:flex; gap:10px; margin-left:8px; padding-left:18px; border-left:1px solid var(--line)}
.lang a{font-size:.83rem; letter-spacing:.18em; text-transform:uppercase; color:var(--muted)}
.lang a.active{color:var(--deep)}
.menu-button{display:none}
.main{padding-bottom:80px}
.hero-home{padding:36px 0 32px}
.hero-shell{position:relative; overflow:hidden; border-radius:38px; min-height:calc(100vh - 150px); box-shadow:var(--shadow);}
.hero-bg{
  position:absolute; inset:0;
  background-image:linear-gradient(90deg, rgba(19,36,43,.68) 0%, rgba(19,36,43,.34) 42%, rgba(19,36,43,.18) 70%, rgba(19,36,43,.28) 100%), url('assets/home-sea.jpg');
  background-size:cover; background-position:center;
  transform:scale(1.02);
}
.hero-bg::after{content:""; position:absolute; inset:0; background:linear-gradient(180deg, rgba(255,244,224,.08), rgba(243,238,229,.16) 55%, rgba(245,239,230,.20));}
.hero-grid{position:relative; z-index:2; min-height:calc(100vh - 150px); display:grid; grid-template-columns:minmax(0, .92fr) minmax(520px, 1.08fr); gap:34px; align-items:center; padding:64px}
.copy-card{
  max-width:680px;
  background:linear-gradient(180deg, rgba(250,248,243,.72), rgba(255,255,255,.74));
  backdrop-filter: blur(24px);
  border:1px solid rgba(255,255,255,.4);
  border-radius:32px;
  padding:36px 36px 32px;
  box-shadow:0 20px 45px rgba(17,33,40,.10);
}
.eyebrow{margin:0 0 12px; text-transform:uppercase; letter-spacing:.28em; font-size:.75rem; color:#e6ddd0}
.copy-card .eyebrow{color:#7b6c57}
.hero-title{
  margin:0 0 18px;
  font-family:"Cormorant Garamond", Georgia, serif;
  font-weight:400;
  color:var(--deep);
  font-size:clamp(2.7rem, 6vw, 5.5rem);
  line-height:.92;
  letter-spacing:.01em;
}
.hero-title span{display:block; font-size:.46em; text-transform:uppercase; letter-spacing:.26em; margin-bottom:10px; font-family:Inter,sans-serif; font-weight:400; color:var(--muted)}
.hero-lead{margin:0 0 18px; font-size:1.08rem; color:#3f5057; max-width:58ch}
.editorial-text p{margin:0 0 12px; color:#55656c; font-size:1rem}
.editorial-text p:last-child{margin-bottom:0}
.facts{display:flex; flex-wrap:wrap; gap:14px; margin-top:26px}
.fact{
  display:flex; align-items:center; gap:12px; padding:12px 16px; border-radius:999px;
  background:rgba(255,255,255,.72); border:1px solid rgba(255,255,255,.42); color:#415158; box-shadow:0 10px 25px rgba(17,33,40,.08)
}
.fact strong{font-family:"Cormorant Garamond", Georgia, serif; font-size:1.55rem; font-weight:500; color:var(--deep)}
.fact span{font-size:.91rem}
.visuals{display:flex; flex-direction:column; justify-content:flex-end; gap:18px; align-self:stretch}
.visual-panel{
  margin-left:auto; width:100%; max-width:560px; background:rgba(255,255,255,.24); border:1px solid rgba(255,255,255,.34);
  border-radius:32px; padding:18px; backdrop-filter: blur(16px); box-shadow:0 24px 40px rgba(17,33,40,.13)
}
.visual-stage{position:relative; min-height:720px; border-radius:24px; overflow:hidden; background:rgba(250,248,243,.25)}
.stage-photo{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:0; transform:scale(1.04); transition:opacity .65s ease, transform 1.2s ease}
.stage-photo.active{opacity:1; transform:scale(1)}
.stage-overlay{position:absolute; inset:auto 0 0 0; padding:18px; background:linear-gradient(180deg, transparent, rgba(18,34,40,.55)); display:flex; justify-content:center; align-items:end}
.stage-dots{display:flex; gap:10px}
.stage-dots button{width:9px; height:9px; padding:0; border-radius:50%; border:none; background:rgba(255,255,255,.45); cursor:pointer; transition:.25s ease}
.stage-dots button.active{background:#fff; transform:scale(1.15)}
.thumb-row{display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-top:14px}
.thumb{position:relative; height:84px; border-radius:18px; overflow:hidden; cursor:pointer; border:1px solid rgba(255,255,255,.34); background:#ddd; box-shadow:0 8px 20px rgba(17,33,40,.10)}
.thumb img{width:100%; height:100%; object-fit:cover; transition:transform .55s ease, opacity .25s ease}
.thumb:hover img,.thumb.active img{transform:scale(1.06)}
.thumb::after{content:""; position:absolute; inset:0; border:1px solid transparent; border-radius:18px; transition:.25s ease}
.thumb.active::after{border-color:rgba(255,255,255,.85)}
.section-wrap{padding:40px 0}
.page-hero{padding:32px 0 0}
.page-banner{position:relative; overflow:hidden; border-radius:34px; min-height:320px; box-shadow:var(--shadow)}
.page-banner.compact{min-height:300px}
.page-banner::before{content:""; position:absolute; inset:0; background:linear-gradient(180deg, rgba(18,34,40,.44), rgba(18,34,40,.20) 45%, rgba(248,243,236,.18) 100%), var(--banner-image); background-size:cover; background-position:center}
.page-banner::after{content:""; position:absolute; inset:0; background:linear-gradient(115deg, rgba(255,255,255,.10), transparent 40%)}
.page-banner .banner-content{position:relative; z-index:2; padding:64px 56px 40px; max-width:720px}
.page-kicker{margin:0 0 10px; text-transform:uppercase; letter-spacing:.28em; font-size:.72rem; color:rgba(255,255,255,.78)}
.page-title{margin:0; font-family:"Cormorant Garamond", Georgia, serif; font-size:clamp(2rem, 4vw, 3.25rem); line-height:1; font-weight:400; color:#fff; letter-spacing:.01em}
.page-title .break{display:block}
.page-subtitle{margin:16px 0 0; color:rgba(255,255,255,.88); max-width:54ch; font-size:1rem}
.content-shell{margin-top:-56px; position:relative; z-index:3}
.paper{
  width:min(calc(100% - 24px), 1080px); margin:0 auto; padding:34px 34px 42px;
  background:linear-gradient(180deg, rgba(255,255,255,.92), rgba(255,255,255,.86));
  border:1px solid rgba(255,255,255,.55); border-radius:28px; box-shadow:0 24px 50px rgba(17,33,40,.10)
}
.paper.slim{padding:26px 28px 32px}
.paper.empty{min-height:260px; display:flex; align-items:center; justify-content:center}
.paper.empty .placeholder{width:min(100%, 860px); min-height:160px; border-radius:22px; border:1px dashed rgba(19,42,50,.14); background:linear-gradient(180deg, rgba(248,244,238,.85), rgba(255,255,255,.72))}
.divider{display:flex; align-items:center; gap:18px; margin-bottom:24px}
.divider::before,.divider::after{content:""; height:1px; flex:1; background:var(--line)}
.divider span{font-size:.73rem; text-transform:uppercase; letter-spacing:.22em; color:var(--muted)}
.contact-grid{display:grid; grid-template-columns:minmax(0, .95fr) minmax(0, 1.05fr); gap:26px}
.contact-card{padding:4px 2px}
.address-card h2,.text-block h3{margin:0 0 12px; font-family:"Cormorant Garamond", Georgia, serif; font-size:1.8rem; font-weight:500; color:var(--deep)}
.address-card p,.text-block p{margin:0 0 10px; color:#516067}
.map-frame{border-radius:22px; overflow:hidden; box-shadow:0 16px 35px rgba(17,33,40,.10); border:1px solid rgba(19,42,50,.08)}
.map-frame iframe{display:block; width:100%; height:100%; min-height:420px; border:0}
.legal{margin-top:22px; padding-top:22px; border-top:1px solid var(--line)}
.footer{padding:28px 0 40px}
.footer-inner{width:min(calc(100% - 40px), var(--max)); margin:0 auto; padding-top:24px; border-top:1px solid rgba(19,42,50,.08); display:flex; align-items:flex-start; justify-content:space-between; gap:20px; color:#657379; font-size:.95rem}
.footer-inner strong{display:block; margin-bottom:6px; color:var(--deep); font-family:"Cormorant Garamond", Georgia, serif; font-size:1.45rem; font-weight:500}
.footer-links{display:flex; gap:18px; flex-wrap:wrap; justify-content:flex-end}
.footer-links a{color:#516067}
.reveal{opacity:0; transform:translateY(18px); transition:opacity .75s ease, transform .75s ease}
.reveal.is-visible{opacity:1; transform:translateY(0)}
@media (max-width: 1080px){
  .hero-grid{grid-template-columns:1fr; gap:28px; padding:44px}
  .visuals{max-width:620px}
  .contact-grid{grid-template-columns:1fr}
  .page-banner .banner-content{padding:52px 42px 34px}
}
@media (max-width: 920px){
  .menu-button{display:flex; width:46px; height:46px; border:none; border-radius:14px; background:rgba(255,255,255,.6); align-items:center; justify-content:center; flex-direction:column; gap:4px; box-shadow:0 8px 20px rgba(17,33,40,.08)}
  .menu-button span{display:block; width:18px; height:1.5px; background:var(--deep)}
  .nav-wrap{position:relative}
  .nav{position:absolute; right:0; top:58px; min-width:min(92vw, 320px); background:rgba(250,247,241,.96); backdrop-filter:blur(20px); border:1px solid rgba(255,255,255,.5); border-radius:22px; padding:16px; box-shadow:0 22px 40px rgba(17,33,40,.14); flex-direction:column; align-items:flex-start; gap:12px; opacity:0; pointer-events:none; transform:translateY(-10px); transition:.25s ease}
  .nav.open{opacity:1; pointer-events:auto; transform:translateY(0)}
  .lang{margin-left:0; padding-left:0; border-left:none; padding-top:10px; width:100%; border-top:1px solid var(--line)}
  .header-inner{min-height:78px}
  .hero-shell{min-height:auto}
  .hero-grid{min-height:auto}
}
@media (max-width: 720px){
  .header-inner,.footer-inner,.container{width:min(calc(100% - 24px), var(--max))}
  .hero-home{padding-top:18px}
  .hero-grid{padding:26px; gap:18px}
  .copy-card{padding:24px 20px 22px; border-radius:26px}
  .hero-title{font-size:clamp(2.45rem, 12vw, 3.6rem)}
  .hero-title span{font-size:.38em; letter-spacing:.22em}
  .visual-panel{max-width:none; padding:12px; border-radius:24px}
  .visual-stage{min-height:520px}
  .thumb-row{gap:8px}
  .thumb{height:62px; border-radius:14px}
  .page-banner{border-radius:26px; min-height:260px}
  .page-banner .banner-content{padding:40px 24px 28px}
  .page-title{font-size:clamp(1.7rem, 9vw, 2.4rem)}
  .content-shell{margin-top:-34px}
  .paper{padding:24px 18px 26px; border-radius:22px}
  .paper.empty{min-height:210px}
  .footer-inner{flex-direction:column}
}

@media (max-width: 720px){ .thumb-row{grid-template-columns:repeat(4,1fr)} }

@media (max-width: 1080px){ .hero-grid{grid-template-columns:1fr;} .visuals{width:100%;} }
@media (max-width: 720px){ .visual-stage{min-height:420px;} .thumb-row{gap:8px;} }


/* v14 full-width premium homepage */
.hero-home.fullwidth{padding:0 0 28px}
.hero-home.fullwidth .container{width:100%; max-width:none}
.hero-wide{
  position:relative;
  min-height:92vh;
  overflow:hidden;
  border-radius:0 0 34px 34px;
  box-shadow:0 28px 70px rgba(17,33,40,.18);
}
.hero-slide{
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover;
  opacity:0; transform:scale(1.03); transition:opacity .8s ease, transform 1.4s ease;
}
.hero-slide.active{opacity:1; transform:scale(1)}
.hero-wide::after{
  content:""; position:absolute; inset:0;
  background:
    linear-gradient(90deg, rgba(14,24,30,.72) 0%, rgba(14,24,30,.50) 34%, rgba(14,24,30,.22) 62%, rgba(14,24,30,.25) 100%),
    linear-gradient(180deg, rgba(9,16,20,.10) 0%, rgba(9,16,20,.12) 55%, rgba(9,16,20,.36) 100%);
  z-index:1;
}
.hero-overlay{position:relative; z-index:2; min-height:92vh; display:flex; align-items:flex-end; padding:94px 56px 36px}
.hero-content-card{
  width:min(680px, calc(100vw - 48px));
  padding:38px 42px 34px;
  border-radius:32px;
  background:linear-gradient(180deg, rgba(251,248,242,.80), rgba(255,255,255,.72));
  border:1px solid rgba(255,255,255,.38);
  box-shadow:0 24px 60px rgba(17,33,40,.16);
  backdrop-filter: blur(16px);
}
.hero-content-card .eyebrow{color:#75644d}
.hero-title{margin-bottom:20px}
.hero-bottom-bar{
  position:absolute; left:50%; bottom:18px; transform:translateX(-50%); z-index:3;
  width:min(1200px, calc(100% - 34px));
  padding:18px 18px 16px;
  border-radius:28px;
  background:linear-gradient(180deg, rgba(255,255,255,.20), rgba(255,255,255,.14));
  backdrop-filter: blur(18px);
  border:1px solid rgba(255,255,255,.28);
  box-shadow:0 18px 40px rgba(17,33,40,.16);
}
.hero-bottom-bar .stage-dots{margin-bottom:12px}
.hero-bottom-bar .stage-dots button{width:10px; height:10px; background:rgba(255,255,255,.45)}
.hero-bottom-bar .stage-dots button.active{background:#fff}
.hero-thumb-grid{display:grid; grid-template-columns:repeat(7,1fr); gap:12px}
.hero-thumb-grid .thumb{height:88px; border-radius:18px; background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.26)}
.hero-thumb-grid .thumb::after{border-radius:18px}
.hero-thumb-grid .thumb img{filter:saturate(.98) contrast(1.02)}
.hero-facts-line{display:flex; gap:14px; flex-wrap:wrap; margin-top:26px}
.hero-facts-line .fact{background:rgba(255,255,255,.66)}

@media (max-width: 1080px){
  .hero-overlay{padding:88px 34px 138px}
  .hero-content-card{width:min(700px, calc(100vw - 36px)); padding:32px 30px 28px}
  .hero-wide,.hero-overlay{min-height:calc(100vh - 20px)}
  .hero-thumb-grid{grid-template-columns:repeat(4,1fr)}
}
@media (max-width: 720px){
  .hero-wide{border-radius:0 0 24px 24px}
  .hero-overlay{padding:84px 16px 150px}
  .hero-content-card{width:100%; padding:24px 18px 22px; border-radius:24px}
  .hero-bottom-bar{width:calc(100% - 20px); bottom:10px; padding:12px 12px 10px; border-radius:22px}
  .hero-thumb-grid{grid-template-columns:repeat(4,1fr); gap:8px}
  .hero-thumb-grid .thumb{height:60px; border-radius:14px}
}


/* v15: return to right-side composition, better aligned and more premium */
.hero-home.fullwidth{padding:32px 0 26px}
.hero-home.fullwidth .container{width:min(calc(100% - 40px), var(--max)); max-width:var(--max)}
.hero-home.fullwidth .hero-wide{
  position:relative;
  min-height:calc(100vh - 150px);
  overflow:hidden;
  border-radius:38px;
  box-shadow:0 26px 70px rgba(17,33,40,.14);
  background:transparent;
}
.hero-home.fullwidth .hero-wide::after{
  content:""; position:absolute; inset:0;
  background:linear-gradient(100deg, rgba(19,36,43,.64) 0%, rgba(19,36,43,.38) 42%, rgba(19,36,43,.16) 72%, rgba(19,36,43,.24) 100%);
  z-index:1;
}
.hero-home.fullwidth .hero-overlay{
  position:relative; z-index:2;
  min-height:calc(100vh - 150px);
  display:grid; grid-template-columns:minmax(0,.9fr) minmax(520px,1.06fr);
  gap:34px; align-items:center; padding:56px;
}
.hero-home.fullwidth .hero-content-card{
  width:100%; max-width:680px; padding:36px 36px 32px;
  border-radius:32px;
  background:linear-gradient(180deg, rgba(251,248,242,.80), rgba(255,255,255,.72));
  border:1px solid rgba(255,255,255,.38);
  box-shadow:0 24px 60px rgba(17,33,40,.16);
  backdrop-filter: blur(16px);
}
.hero-home.fullwidth .hero-bottom-bar{
  position:relative; left:auto; right:auto; bottom:auto; transform:none; z-index:2;
  width:100%; padding:18px; margin-left:auto;
  border-radius:32px;
  background:linear-gradient(180deg, rgba(255,255,255,.18), rgba(255,255,255,.12));
  backdrop-filter: blur(18px);
  border:1px solid rgba(255,255,255,.28);
  box-shadow:0 20px 46px rgba(17,33,40,.16);
}
.hero-home.fullwidth .hero-bottom-bar .stage-overlay{justify-content:center}
.hero-home.fullwidth .hero-thumb-grid{grid-template-columns:repeat(4,1fr); gap:12px}
.hero-home.fullwidth .hero-thumb-grid .thumb{height:84px; border-radius:18px}
.hero-home.fullwidth .hero-thumb-grid .thumb::after{border-radius:18px}
.hero-home.fullwidth .hero-main-slide{
  position:relative; min-height:620px; border-radius:24px; overflow:hidden;
  background:rgba(255,255,255,.14); box-shadow:0 18px 36px rgba(17,33,40,.12);
}
.hero-home.fullwidth .hero-main-slide .hero-slide{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:0; transform:scale(1.04); transition:opacity .8s ease, transform 1.4s ease}
.hero-home.fullwidth .hero-main-slide .hero-slide.active{opacity:1; transform:scale(1)}
.hero-home.fullwidth .hero-main-slide::after{content:""; position:absolute; inset:0; background:linear-gradient(180deg, rgba(17,33,40,.02), rgba(17,33,40,.28)); pointer-events:none}
.hero-home.fullwidth .hero-right{display:flex; flex-direction:column; gap:14px; align-self:center}
.hero-home.fullwidth .hero-facts-line{display:flex; gap:14px; flex-wrap:wrap; margin-top:26px}
.hero-home.fullwidth .hero-facts-line .fact{background:rgba(255,255,255,.66)}

@media (max-width: 1080px){
  .hero-home.fullwidth .hero-overlay{grid-template-columns:1fr; padding:40px; gap:24px; min-height:auto}
  .hero-home.fullwidth .hero-wide{min-height:auto}
  .hero-home.fullwidth .hero-main-slide{min-height:520px}
}
@media (max-width: 720px){
  .hero-home.fullwidth{padding:18px 0 18px}
  .hero-home.fullwidth .container{width:min(calc(100% - 24px), var(--max))}
  .hero-home.fullwidth .hero-wide{border-radius:26px}
  .hero-home.fullwidth .hero-overlay{padding:22px; gap:18px}
  .hero-home.fullwidth .hero-content-card{padding:24px 18px 22px; border-radius:24px}
  .hero-home.fullwidth .hero-main-slide{min-height:420px; border-radius:20px}
  .hero-home.fullwidth .hero-thumb-grid{grid-template-columns:repeat(4,1fr); gap:8px}
  .hero-home.fullwidth .hero-thumb-grid .thumb{height:60px; border-radius:14px}
}


/* v17: interactive Klausdorf map */
.map-section {
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(300px, .75fr);
  gap: 28px;
  align-items: stretch;
}

.interactive-map-card {
  position: relative;
  overflow: hidden;
  border-radius: 28px;
  background: rgba(255,255,255,.72);
  border: 1px solid rgba(19,42,50,.10);
  box-shadow: 0 22px 55px rgba(17,33,40,.12);
}

.interactive-map {
  position: relative;
  width: 100%;
  min-height: 520px;
  background: #d8dde0;
}

.interactive-map img {
  width: 100%;
  height: 100%;
  min-height: 520px;
  object-fit: cover;
}

.map-hotspot {
  position: absolute;
  transform: translate(-50%, -50%);
  border: 0;
  cursor: pointer;
  padding: 9px 14px 9px 12px;
  border-radius: 999px;
  color: #fdf9f1;
  background: rgba(20, 43, 51, .78);
  backdrop-filter: blur(12px);
  box-shadow: 0 12px 26px rgba(17,33,40,.20);
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font: 400 .88rem/1 Inter, system-ui, sans-serif;
  letter-spacing: .02em;
  transition: transform .25s ease, background .25s ease, box-shadow .25s ease;
}

.map-hotspot::before {
  content: "";
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: #d94b36;
  box-shadow: 0 0 0 4px rgba(217,75,54,.18);
}

.map-hotspot:hover,
.map-hotspot.active {
  transform: translate(-50%, -50%) translateY(-2px);
  background: rgba(20,43,51,.92);
  box-shadow: 0 18px 34px rgba(17,33,40,.26);
}

.map-hotspot.is-soft::before {
  background: #9f8558;
  box-shadow: 0 0 0 4px rgba(159,133,88,.20);
}

.map-info-panel {
  border-radius: 28px;
  background: linear-gradient(180deg, rgba(255,255,255,.92), rgba(255,255,255,.78));
  border: 1px solid rgba(19,42,50,.10);
  box-shadow: 0 22px 55px rgba(17,33,40,.10);
  padding: 30px;
  min-height: 520px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.map-info-kicker {
  margin: 0 0 12px;
  text-transform: uppercase;
  letter-spacing: .22em;
  font-size: .72rem;
  color: var(--muted);
}

.map-info-title {
  margin: 0 0 16px;
  font-family: "Cormorant Garamond", Georgia, serif;
  color: var(--deep);
  font-size: clamp(2rem, 3vw, 3rem);
  line-height: 1;
  font-weight: 400;
}

.map-info-text {
  margin: 0;
  color: #56666d;
  max-width: 46ch;
}

.map-info-empty {
  margin-top: 22px;
  border: 1px dashed rgba(19,42,50,.14);
  background: rgba(247,242,234,.7);
  border-radius: 20px;
  min-height: 120px;
}

.map-note {
  margin: 18px 0 0;
  color: var(--muted);
  font-size: .92rem;
}

@media (max-width: 980px) {
  .map-section {
    grid-template-columns: 1fr;
  }

  .map-info-panel {
    min-height: 280px;
  }
}

@media (max-width: 720px) {
  .interactive-map,
  .interactive-map img {
    min-height: 360px;
  }

  .map-hotspot {
    padding: 8px 10px;
    font-size: .75rem;
  }

  .map-info-panel {
    padding: 22px;
    border-radius: 22px;
  }
}


/* v18: premium centered interactive map */
.map-section {
  display: block;
}

.interactive-map-card {
  position: relative;
  overflow: visible;
  border-radius: 34px;
  background:
    linear-gradient(180deg, rgba(255,255,255,.82), rgba(255,255,255,.68)),
    rgba(255,255,255,.72);
  border: 1px solid rgba(19,42,50,.10);
  box-shadow: 0 28px 70px rgba(17,33,40,.12);
  padding: 22px;
}

.interactive-map {
  position: relative;
  width: 100%;
  min-height: auto;
  aspect-ratio: 817 / 497;
  border-radius: 24px;
  overflow: hidden;
  background: #cfd5d8;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.55);
}

.interactive-map img {
  width: 100%;
  height: 100%;
  min-height: 0;
  object-fit: contain;
  display: block;
  background: #bfc5c8;
}

.map-hotspot {
  position: absolute;
  transform: translate(-50%, -50%);
  border: 0;
  cursor: pointer;
  width: 26px;
  height: 26px;
  padding: 0;
  border-radius: 999px;
  color: transparent;
  background: rgba(255,255,255,.18);
  backdrop-filter: blur(8px);
  box-shadow:
    0 0 0 1px rgba(255,255,255,.75),
    0 8px 20px rgba(17,33,40,.18);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: transform .25s ease, background .25s ease, box-shadow .25s ease;
}

.map-hotspot::before {
  content: "";
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #d94b36;
  box-shadow: 0 0 0 7px rgba(217,75,54,.18);
}

.map-hotspot::after {
  content: attr(data-title);
  position: absolute;
  left: 50%;
  bottom: calc(100% + 10px);
  transform: translateX(-50%) translateY(6px);
  opacity: 0;
  pointer-events: none;
  white-space: nowrap;
  color: #fdf9f1;
  background: rgba(20,43,51,.88);
  border: 1px solid rgba(255,255,255,.20);
  border-radius: 999px;
  padding: 8px 12px;
  font: 400 .78rem/1 Inter, system-ui, sans-serif;
  letter-spacing: .04em;
  box-shadow: 0 12px 25px rgba(17,33,40,.20);
  transition: opacity .25s ease, transform .25s ease;
}

.map-hotspot:hover,
.map-hotspot.active {
  transform: translate(-50%, -50%) scale(1.08);
  background: rgba(255,255,255,.28);
  box-shadow:
    0 0 0 1px rgba(255,255,255,.92),
    0 14px 28px rgba(17,33,40,.24);
}

.map-hotspot:hover::after,
.map-hotspot.active::after {
  opacity: 1;
  transform: translateX(-50%) translateY(0);
}

.map-hotspot.is-soft::before {
  background: #9f8558;
  box-shadow: 0 0 0 7px rgba(159,133,88,.20);
}

.map-info-panel {
  display: none;
  margin-top: 24px;
  border-radius: 28px;
  background: linear-gradient(180deg, rgba(255,255,255,.94), rgba(255,255,255,.82));
  border: 1px solid rgba(19,42,50,.10);
  box-shadow: 0 22px 55px rgba(17,33,40,.10);
  padding: 30px;
  min-height: 0;
}

.map-info-panel.is-visible {
  display: block;
  animation: mapPanelIn .35s ease both;
}

@keyframes mapPanelIn {
  from { opacity: 0; transform: translateY(14px); }
  to { opacity: 1; transform: translateY(0); }
}

.map-info-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 18px;
}

.map-close {
  border: 1px solid rgba(19,42,50,.12);
  background: rgba(247,242,234,.78);
  color: var(--deep);
  border-radius: 999px;
  padding: 9px 13px;
  cursor: pointer;
  font-size: .82rem;
  letter-spacing: .08em;
  text-transform: uppercase;
  transition: .25s ease;
}

.map-close:hover {
  background: rgba(20,43,51,.90);
  color: #fff;
}

.map-info-kicker {
  margin: 0 0 10px;
  text-transform: uppercase;
  letter-spacing: .22em;
  font-size: .72rem;
  color: var(--muted);
}

.map-info-title {
  margin: 0;
  font-family: "Cormorant Garamond", Georgia, serif;
  color: var(--deep);
  font-size: clamp(2rem, 3vw, 3rem);
  line-height: 1;
  font-weight: 400;
}

.map-info-text {
  margin: 18px 0 0;
  color: #56666d;
  max-width: 70ch;
}

.map-info-empty {
  margin-top: 24px;
  border: 1px dashed rgba(19,42,50,.14);
  background: rgba(247,242,234,.7);
  border-radius: 20px;
  min-height: 120px;
}

.map-note {
  margin: 18px 4px 0;
  color: var(--muted);
  font-size: .92rem;
  text-align: center;
}

.map-intro {
  max-width: 760px;
  margin: 0 auto 24px;
  text-align: center;
}

.map-intro h2 {
  margin: 0 0 10px;
  font-family: "Cormorant Garamond", Georgia, serif;
  font-size: clamp(2rem, 4vw, 3rem);
  line-height: 1;
  font-weight: 400;
  color: var(--deep);
}

.map-intro p {
  margin: 0;
  color: var(--muted);
}

@media (max-width: 720px) {
  .interactive-map-card {
    padding: 12px;
    border-radius: 24px;
  }

  .interactive-map {
    border-radius: 18px;
  }

  .map-hotspot {
    width: 22px;
    height: 22px;
  }

  .map-hotspot::before {
    width: 8px;
    height: 8px;
    box-shadow: 0 0 0 5px rgba(217,75,54,.18);
  }

  .map-hotspot::after {
    font-size: .7rem;
    padding: 7px 9px;
  }

  .map-info-panel {
    padding: 22px;
    border-radius: 22px;
  }
}


/* v19: Stralsund rich content in interactive map */
.map-rich-content { margin-top: 24px; }
.map-info-panel.has-rich .map-info-empty { display: none; }
.map-info-panel.has-rich .map-info-text:empty { display: none; }

.place-intro {
  margin-top: 18px;
  padding: 24px;
  border-radius: 24px;
  background: linear-gradient(180deg, rgba(247,242,234,.88), rgba(255,255,255,.74));
  border: 1px solid rgba(19,42,50,.10);
}
.place-intro p { margin: 0 0 12px; color: #526268; }
.place-intro p:last-child { margin-bottom: 0; }

.place-links { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 18px; }
.place-link {
  display: inline-flex; align-items: center; gap: 8px;
  border-radius: 999px; padding: 11px 15px;
  background: rgba(20,43,51,.92); color: #fff;
  font-size: .9rem; letter-spacing: .02em;
  box-shadow: 0 12px 26px rgba(17,33,40,.15);
  transition: transform .25s ease, background .25s ease;
}
.place-link:hover { transform: translateY(-2px); background: rgba(20,43,51,1); }
.place-link.secondary { background: rgba(159,133,88,.95); }

.attractions-title {
  margin: 32px 0 18px;
  font-family: "Cormorant Garamond", Georgia, serif;
  font-size: clamp(1.8rem, 3vw, 2.6rem);
  font-weight: 400; line-height: 1; color: var(--deep);
}
.attraction-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.attraction-card {
  overflow: hidden; border-radius: 24px; background: rgba(255,255,255,.86);
  border: 1px solid rgba(19,42,50,.10);
  box-shadow: 0 18px 42px rgba(17,33,40,.10);
}
.attraction-card img { width: 100%; height: 230px; object-fit: cover; }
.attraction-body { padding: 20px 20px 22px; }
.attraction-body h3 {
  margin: 0 0 9px;
  font-family: "Cormorant Garamond", Georgia, serif;
  font-size: 1.65rem; font-weight: 500; line-height: 1.05; color: var(--deep);
}
.attraction-body p { margin: 0; color: #56666d; font-size: .96rem; }

@media (max-width: 820px) {
  .attraction-grid { grid-template-columns: 1fr; }
  .attraction-card img { height: 240px; }
}
@media (max-width: 520px) {
  .place-intro { padding: 18px; }
  .place-links { flex-direction: column; }
  .place-link { justify-content: center; }
  .attraction-card img { height: 210px; }
}


/* v20: refined map points + complete attraction images */
.map-hotspot {
  width: 16px !important;
  height: 16px !important;
  padding: 0 !important;
  background: rgba(255,255,255,.34) !important;
  box-shadow:
    0 0 0 1px rgba(255,255,255,.92),
    0 0 0 5px rgba(217,75,54,.10),
    0 10px 22px rgba(17,33,40,.18) !important;
}

.map-hotspot::before {
  width: 6px !important;
  height: 6px !important;
  box-shadow: none !important;
}

.map-hotspot.is-soft::before {
  background: #9f8558 !important;
  box-shadow: none !important;
}

.map-hotspot.is-soft {
  box-shadow:
    0 0 0 1px rgba(255,255,255,.92),
    0 0 0 5px rgba(159,133,88,.11),
    0 10px 22px rgba(17,33,40,.16) !important;
}

.map-hotspot:hover,
.map-hotspot.active {
  transform: translate(-50%, -50%) scale(1.18) !important;
  background: rgba(255,255,255,.55) !important;
}

.map-hotspot::after {
  bottom: calc(100% + 12px) !important;
  font-size: .72rem !important;
  padding: 7px 10px !important;
}

.attraction-card img {
  height: 270px !important;
  object-fit: contain !important;
  background:
    radial-gradient(circle at top left, rgba(205,183,143,.18), transparent 36%),
    linear-gradient(180deg, #f8f4ee, #ffffff);
  padding: 10px;
}

.attraction-card {
  background: rgba(255,255,255,.92) !important;
}

.place-intro.after-sights {
  margin-top: 34px;
}

.place-intro h3 {
  margin: 0 0 14px;
  font-family: "Cormorant Garamond", Georgia, serif;
  font-size: 2rem;
  line-height: 1;
  font-weight: 400;
  color: var(--deep);
}

.place-links.final-links {
  margin-top: 20px;
}

@media (max-width: 820px) {
  .attraction-card img {
    height: 250px !important;
  }
}

@media (max-width: 520px) {
  .map-hotspot {
    width: 14px !important;
    height: 14px !important;
  }

  .map-hotspot::before {
    width: 5px !important;
    height: 5px !important;
  }

  .attraction-card img {
    height: 220px !important;
    padding: 8px;
  }
}


/* v21: rich content for Barth, Rügen, Darß and Ostsee */
.attraction-grid.three {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.attraction-grid.three .attraction-card img {
  height: 250px !important;
}

.destination-note {
  margin-top: 28px;
  padding: 22px 24px;
  border-radius: 22px;
  background: linear-gradient(180deg, rgba(247,242,234,.90), rgba(255,255,255,.78));
  border: 1px solid rgba(19,42,50,.10);
  color: #56666d;
}

.destination-note p {
  margin: 0;
}

@media (max-width: 1040px) {
  .attraction-grid.three {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 720px) {
  .attraction-grid.three {
    grid-template-columns: 1fr;
  }
}


/* v22: top sights images full-bleed and clean */
.attraction-card {
  overflow: hidden !important;
}

.attraction-card img {
  width: 100% !important;
  height: 260px !important;
  object-fit: cover !important;
  display: block !important;
  padding: 0 !important;
  margin: 0 !important;
  background: none !important;
  border: 0 !important;
  border-radius: 0 !important;
}

.attraction-body {
  padding-top: 18px !important;
}

@media (max-width: 820px) {
  .attraction-card img {
    height: 240px !important;
  }
}

@media (max-width: 520px) {
  .attraction-card img {
    height: 210px !important;
  }
}


/* v23: premium, uniform Top Sights cards + Activities section */
.attraction-grid,
.attraction-grid.three {
  align-items: stretch !important;
}

.attraction-card {
  display: flex !important;
  flex-direction: column !important;
  height: 100% !important;
  min-height: 475px !important;
  border-radius: 28px !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.96), rgba(255,255,255,.88)) !important;
  border: 1px solid rgba(19,42,50,.10) !important;
  box-shadow: 0 22px 55px rgba(17,33,40,.11) !important;
  transition: transform .28s ease, box-shadow .28s ease, border-color .28s ease !important;
}

.attraction-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 30px 72px rgba(17,33,40,.15) !important;
  border-color: rgba(159,133,88,.22) !important;
}

.attraction-card img {
  width: 100% !important;
  height: 245px !important;
  object-fit: cover !important;
  display: block !important;
  padding: 0 !important;
  margin: 0 !important;
  background: none !important;
  border: 0 !important;
  border-radius: 0 !important;
}

.attraction-body {
  flex: 1 !important;
  display: flex !important;
  flex-direction: column !important;
  padding: 24px 24px 26px !important;
}

.attraction-body h3 {
  min-height: 56px;
  display: flex;
  align-items: flex-start;
  margin-bottom: 12px !important;
}

.attraction-body p {
  flex: 1;
}

.attractions-title {
  margin-top: 28px !important;
  margin-bottom: 22px !important;
  text-align: left;
}

.destination-note {
  margin-top: 30px !important;
  padding: 24px 28px !important;
  border-radius: 26px !important;
  background:
    radial-gradient(circle at top left, rgba(205,183,143,.18), transparent 34%),
    linear-gradient(180deg, rgba(247,242,234,.94), rgba(255,255,255,.82)) !important;
  border: 1px solid rgba(19,42,50,.10) !important;
  box-shadow: 0 18px 42px rgba(17,33,40,.08);
}

.activities-section {
  margin-top: 34px;
  padding: 34px;
  border-radius: 30px;
  background:
    linear-gradient(90deg, rgba(20,43,51,.78), rgba(20,43,51,.36)),
    url('assets/activities-bg.jpg');
  background-size: cover;
  background-position: center;
  color: #fff;
  box-shadow: 0 24px 60px rgba(17,33,40,.14);
  overflow: hidden;
}

.activities-kicker {
  margin: 0 0 10px;
  text-transform: uppercase;
  letter-spacing: .24em;
  font-size: .72rem;
  color: rgba(255,255,255,.76);
}

.activities-title {
  margin: 0;
  font-family: "Cormorant Garamond", Georgia, serif;
  font-weight: 400;
  line-height: 1;
  font-size: clamp(2rem, 4vw, 3.2rem);
}

.activities-text {
  margin: 16px 0 0;
  max-width: 62ch;
  color: rgba(255,255,255,.86);
}

.activities-placeholder-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0,1fr));
  gap: 14px;
  margin-top: 28px;
}

.activity-placeholder-card {
  min-height: 120px;
  border-radius: 22px;
  border: 1px dashed rgba(255,255,255,.38);
  background: rgba(255,255,255,.12);
  backdrop-filter: blur(10px);
}

@media (max-width: 1040px) {
  .activities-placeholder-grid {
    grid-template-columns: repeat(2, minmax(0,1fr));
  }
}

@media (max-width: 820px) {
  .attraction-card {
    min-height: 430px !important;
  }

  .attraction-card img {
    height: 235px !important;
  }

  .attraction-body h3 {
    min-height: auto;
  }
}

@media (max-width: 620px) {
  .activities-section {
    padding: 24px;
    border-radius: 24px;
  }

  .activities-placeholder-grid {
    grid-template-columns: 1fr;
  }

  .activity-placeholder-card {
    min-height: 86px;
  }
}


/* v24 premium: editorial region guide instead of map pins */
.premium-region {
  display: block;
}

.region-guide-head {
  max-width: 760px;
  margin: 0 auto 28px;
  text-align: center;
}

.region-guide-head h2 {
  margin: 0 0 12px;
  font-family: "Cormorant Garamond", Georgia, serif;
  font-size: clamp(2.2rem, 4vw, 3.45rem);
  line-height: 1;
  font-weight: 400;
  color: var(--deep);
}

.region-guide-head p {
  margin: 0;
  color: var(--muted);
}

.region-map-visual {
  position: relative;
  overflow: hidden;
  border-radius: 34px;
  background:
    radial-gradient(circle at top left, rgba(205,183,143,.20), transparent 34%),
    linear-gradient(180deg, rgba(255,255,255,.94), rgba(255,255,255,.78));
  border: 1px solid rgba(19,42,50,.10);
  box-shadow: 0 28px 70px rgba(17,33,40,.12);
  padding: 22px;
}

.region-map-inner {
  position: relative;
  overflow: hidden;
  border-radius: 24px;
  background: #d8ddd9;
  aspect-ratio: 817 / 497;
}

.region-map-inner img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
}

.region-map-inner::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(180deg, rgba(255,255,255,.08), transparent 44%),
    radial-gradient(circle at 75% 60%, rgba(255,255,255,.16), transparent 26%);
  pointer-events: none;
}

.region-subtle-note {
  margin: 18px 0 0;
  text-align: center;
  color: var(--muted);
  font-size: .92rem;
}

.region-selector {
  margin-top: 28px;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
}

.region-card {
  position: relative;
  overflow: hidden;
  cursor: pointer;
  text-align: left;
  border: 1px solid rgba(19,42,50,.09);
  border-radius: 26px;
  padding: 22px 22px 24px;
  background:
    linear-gradient(180deg, rgba(255,255,255,.94), rgba(255,255,255,.82));
  box-shadow: 0 18px 42px rgba(17,33,40,.08);
  transition: transform .28s ease, box-shadow .28s ease, border-color .28s ease, background .28s ease;
  min-height: 175px;
}

.region-card::before {
  content: "";
  position: absolute;
  inset: auto 22px 0 22px;
  height: 2px;
  background: linear-gradient(90deg, transparent, rgba(159,133,88,.70), transparent);
  transform: scaleX(0);
  transition: transform .28s ease;
}

.region-card:hover,
.region-card.active {
  transform: translateY(-4px);
  border-color: rgba(159,133,88,.25);
  box-shadow: 0 28px 68px rgba(17,33,40,.13);
  background:
    radial-gradient(circle at top right, rgba(205,183,143,.18), transparent 38%),
    linear-gradient(180deg, rgba(255,255,255,.98), rgba(255,255,255,.88));
}

.region-card:hover::before,
.region-card.active::before {
  transform: scaleX(1);
}

.region-number {
  display: block;
  margin-bottom: 18px;
  font-family: "Cormorant Garamond", Georgia, serif;
  font-size: 2.4rem;
  line-height: .8;
  font-weight: 400;
  color: rgba(159,133,88,.62);
}

.region-card h3 {
  margin: 0 0 8px;
  font-family: "Cormorant Garamond", Georgia, serif;
  font-size: 1.7rem;
  line-height: 1;
  font-weight: 500;
  color: var(--deep);
}

.region-card p {
  margin: 0;
  color: #647278;
  font-size: .94rem;
  line-height: 1.55;
}

.map-info-panel.region-output {
  margin-top: 32px;
  border-radius: 32px;
  padding: 34px;
  background:
    linear-gradient(180deg, rgba(255,255,255,.97), rgba(255,255,255,.88));
}

.map-info-panel.region-output.is-visible {
  display: block;
}

.region-output .map-info-header {
  padding-bottom: 22px;
  border-bottom: 1px solid rgba(19,42,50,.09);
}

.region-output .map-info-title {
  font-size: clamp(2.4rem, 4vw, 3.4rem);
}

.region-output .map-close {
  background: rgba(247,242,234,.88);
}

/* keep top sights premium and uniform */
.attraction-grid,
.attraction-grid.three {
  align-items: stretch !important;
}

.attraction-card {
  display: flex !important;
  flex-direction: column !important;
  height: 100% !important;
  min-height: 475px !important;
  border-radius: 28px !important;
  background: linear-gradient(180deg, rgba(255,255,255,.96), rgba(255,255,255,.88)) !important;
  border: 1px solid rgba(19,42,50,.10) !important;
  box-shadow: 0 22px 55px rgba(17,33,40,.11) !important;
  transition: transform .28s ease, box-shadow .28s ease, border-color .28s ease !important;
}

.attraction-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 30px 72px rgba(17,33,40,.15) !important;
  border-color: rgba(159,133,88,.22) !important;
}

.attraction-card img {
  width: 100% !important;
  height: 245px !important;
  object-fit: cover !important;
  display: block !important;
  padding: 0 !important;
  margin: 0 !important;
  background: none !important;
  border: 0 !important;
  border-radius: 0 !important;
}

.attraction-body {
  flex: 1 !important;
  display: flex !important;
  flex-direction: column !important;
  padding: 24px 24px 26px !important;
}

.attraction-body h3 {
  min-height: 56px;
  display: flex;
  align-items: flex-start;
  margin-bottom: 12px !important;
}

.attraction-body p {
  flex: 1;
}

@media (max-width: 1020px) {
  .region-selector {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 820px) {
  .attraction-card {
    min-height: 430px !important;
  }

  .attraction-card img {
    height: 235px !important;
  }

  .attraction-body h3 {
    min-height: auto;
  }
}

@media (max-width: 680px) {
  .region-map-visual {
    padding: 12px;
    border-radius: 24px;
  }

  .region-map-inner {
    border-radius: 18px;
  }

  .region-selector {
    grid-template-columns: 1fr;
    gap: 12px;
  }

  .region-card {
    min-height: 142px;
    padding: 20px;
    border-radius: 22px;
  }

  .region-number {
    font-size: 2rem;
    margin-bottom: 14px;
  }

  .map-info-panel.region-output {
    padding: 22px;
    border-radius: 24px;
  }
}


/* v25: web-sourced destination imagery + Klausdorf extra sections */
.attraction-card img {
  width: 100% !important;
  aspect-ratio: 1 / 1 !important;
  height: auto !important;
  object-fit: cover !important;
  object-position: center center !important;
  display: block !important;
  border-radius: 0 !important;
  background: #f4efe7 !important;
}

.attraction-card {
  min-height: 540px !important;
}

.attraction-body h3 {
  min-height: 52px;
}

.klausdorf-extras {
  margin-top: 32px;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
}

.klausdorf-extra-card {
  border-radius: 26px;
  padding: 26px;
  border: 1px solid rgba(19,42,50,.10);
  background:
    radial-gradient(circle at top right, rgba(205,183,143,.16), transparent 40%),
    linear-gradient(180deg, rgba(255,255,255,.96), rgba(255,255,255,.86));
  box-shadow: 0 20px 52px rgba(17,33,40,.09);
}

.klausdorf-extra-card h4 {
  margin: 0 0 8px;
  font-family: "Cormorant Garamond", Georgia, serif;
  font-size: 2rem;
  line-height: 1;
  font-weight: 500;
  color: var(--deep);
}

.klausdorf-extra-card p {
  margin: 0;
  color: #647278;
}

.klausdorf-extra-badge {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-top: 18px;
  padding: 10px 14px;
  border-radius: 999px;
  background: rgba(247,242,234,.92);
  color: var(--deep);
  font-size: .82rem;
  letter-spacing: .08em;
  text-transform: uppercase;
}

@media (max-width: 820px) {
  .attraction-card {
    min-height: 500px !important;
  }
}

@media (max-width: 700px) {
  .klausdorf-extras {
    grid-template-columns: 1fr;
  }
}


/* v29 complete: premium Klausdorf activities media blocks */
.activities-block {
  margin-top: 44px;
  padding-top: 8px;
}

.activities-block .attractions-title {
  margin-bottom: 22px;
}

.activity-feature-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 22px;
}

.activity-feature-card {
  overflow: hidden;
  border-radius: 30px;
  border: 1px solid rgba(19,42,50,.10);
  background:
    radial-gradient(circle at top right, rgba(205,183,143,.18), transparent 40%),
    linear-gradient(180deg, rgba(255,255,255,.97), rgba(255,255,255,.88));
  box-shadow: 0 24px 62px rgba(17,33,40,.11);
}

.activity-media-pair {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 0;
  background: #ece8e2;
}

.activity-media-pair img {
  width: 100%;
  aspect-ratio: 4 / 5;
  object-fit: cover;
  display: block;
}

.activity-content {
  padding: 26px 26px 28px;
}

.activity-content h4 {
  margin: 0 0 10px;
  font-family: "Cormorant Garamond", Georgia, serif;
  font-size: clamp(1.8rem, 2.2vw, 2.3rem);
  line-height: 1;
  font-weight: 500;
  color: var(--deep);
}

.activity-content p {
  margin: 0;
  color: #647278;
  line-height: 1.72;
}

.activity-label {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 14px;
  padding: 8px 12px;
  border-radius: 999px;
  background: rgba(247,242,234,.95);
  color: var(--deep);
  font-size: .78rem;
  letter-spacing: .12em;
  text-transform: uppercase;
}

@media (max-width: 920px) {
  .activity-feature-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 560px) {
  .activity-media-pair {
    grid-template-columns: 1fr;
  }

  .activity-media-pair img {
    aspect-ratio: 4 / 3;
  }
}


/* v30 complete: road biking videos */
.activity-media-pair video {
  width: 100%;
  aspect-ratio: 4 / 5;
  object-fit: cover;
  display: block;
  background: #0f1f24;
}

@media (max-width: 560px) {
  .activity-media-pair video {
    aspect-ratio: 4 / 3;
  }
}


/* v31 complete: premium separated activity layout */
.activities-block {
  margin-top: 52px;
}

.activities-block .attractions-title {
  margin-bottom: 28px;
}

.activity-feature-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 28px;
}

.activity-feature-card {
  padding: 22px;
  border-radius: 34px;
  border: 1px solid rgba(19,42,50,.09);
  background:
    radial-gradient(circle at top right, rgba(205,183,143,.16), transparent 42%),
    linear-gradient(180deg, rgba(255,255,255,.98), rgba(249,247,243,.95));
  box-shadow: 0 26px 64px rgba(17,33,40,.10);
}

.activity-shell {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(280px, .95fr);
  gap: 26px;
  align-items: stretch;
}

.activity-shell.reverse {
  grid-template-columns: minmax(280px, .95fr) minmax(0, 1.05fr);
}

.activity-shell.reverse .activity-copy {
  order: -1;
}

.activity-media-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 14px;
}

.activity-media-tile {
  overflow: hidden;
  border-radius: 24px;
  background: #eef0eb;
  box-shadow: inset 0 0 0 1px rgba(19,42,50,.06);
}

.activity-media-tile img,
.activity-media-tile video {
  width: 100%;
  height: 100%;
  min-height: 300px;
  aspect-ratio: 4 / 5;
  object-fit: cover;
  display: block;
  background: #132126;
}

.activity-copy {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 8px 6px;
}

.activity-copy .activity-label {
  align-self: flex-start;
  margin-bottom: 16px;
}

.activity-copy h4 {
  margin: 0 0 14px;
  font-family: "Cormorant Garamond", Georgia, serif;
  font-size: clamp(2rem, 2.5vw, 2.8rem);
  line-height: .98;
  font-weight: 500;
  color: var(--deep);
}

.activity-copy p {
  margin: 0;
  color: #647278;
  line-height: 1.78;
}

@media (max-width: 980px) {
  .activity-shell,
  .activity-shell.reverse {
    grid-template-columns: 1fr;
  }

  .activity-shell.reverse .activity-copy {
    order: 0;
  }
}

@media (max-width: 680px) {
  .activity-feature-card {
    padding: 16px;
    border-radius: 26px;
  }

  .activity-media-grid {
    grid-template-columns: 1fr;
  }

  .activity-media-tile img,
  .activity-media-tile video {
    min-height: 240px;
    aspect-ratio: 4 / 3;
  }
}


/* v32 complete: larger, wider activity media */
.activities-block .activity-shell,
.activities-block .activity-shell.reverse {
  grid-template-columns: minmax(0, 1.4fr) minmax(260px, .8fr) !important;
  gap: 30px !important;
}

.activities-block .activity-media-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 16px !important;
}

.activities-block .activity-media-tile {
  border-radius: 26px !important;
  overflow: hidden !important;
}

.activities-block .activity-media-tile video,
.activities-block .activity-media-tile img {
  min-height: 340px !important;
  aspect-ratio: 16 / 10 !important;
  width: 100% !important;
  height: auto !important;
  display: block !important;
}

.activities-block .activity-media-tile video {
  object-fit: cover !important;
  object-position: center center !important;
}

.activities-block .activity-media-tile img {
  object-fit: contain !important;
  object-position: center center !important;
  background: linear-gradient(180deg, rgba(245,242,236,1), rgba(238,234,226,1)) !important;
  padding: 10px !important;
}

@media (max-width: 980px) {
  .activities-block .activity-shell,
  .activities-block .activity-shell.reverse {
    grid-template-columns: 1fr !important;
  }
}

@media (max-width: 680px) {
  .activities-block .activity-media-grid {
    grid-template-columns: 1fr !important;
  }

  .activities-block .activity-media-tile video,
  .activities-block .activity-media-tile img {
    min-height: 260px !important;
    aspect-ratio: 4 / 3 !important;
  }
}


/* v33 complete: wider road biking videos + full birdwatching images */
.activities-block .activity-feature-grid {
  gap: 26px !important;
}

.activities-block .activity-shell,
.activities-block .activity-shell.reverse {
  grid-template-columns: minmax(0, 1.7fr) minmax(240px, .7fr) !important;
  gap: 24px !important;
  align-items: center !important;
}

.activities-block .activity-media-grid.road-media {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 8px !important;
}

.activities-block .activity-media-grid.bird-media {
  grid-template-columns: 1fr !important;
  gap: 12px !important;
}

.activities-block .activity-media-tile {
  border-radius: 24px !important;
  overflow: hidden !important;
}

.activities-block .activity-media-grid.road-media .activity-media-tile video {
  width: 100% !important;
  min-height: 360px !important;
  aspect-ratio: 16 / 9 !important;
  object-fit: cover !important;
  object-position: center center !important;
  display: block !important;
}

.activities-block .activity-media-grid.bird-media .activity-media-tile img {
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  aspect-ratio: auto !important;
  object-fit: contain !important;
  object-position: center center !important;
  display: block !important;
  background: transparent !important;
  padding: 0 !important;
}

.activities-block .activity-media-grid.bird-media .activity-media-tile {
  background: transparent !important;
  box-shadow: inset 0 0 0 1px rgba(19,42,50,.06) !important;
}

@media (max-width: 980px) {
  .activities-block .activity-shell,
  .activities-block .activity-shell.reverse {
    grid-template-columns: 1fr !important;
  }
}

@media (max-width: 680px) {
  .activities-block .activity-media-grid.road-media {
    grid-template-columns: 1fr !important;
    gap: 10px !important;
  }

  .activities-block .activity-media-grid.road-media .activity-media-tile video {
    min-height: 240px !important;
    aspect-ratio: 4 / 3 !important;
  }
}


/* v35 complete: more balanced and aesthetic activities layout */
.activities-block {
  margin-top: 48px !important;
}

.activities-block .attractions-title {
  margin-bottom: 24px !important;
}

.activities-block .activity-feature-grid {
  gap: 26px !important;
}

.activities-block .activity-feature-card {
  padding: 20px !important;
  border-radius: 30px !important;
}

.activities-block .activity-shell,
.activities-block .activity-shell.reverse {
  grid-template-columns: minmax(0, 1.3fr) minmax(280px, 0.9fr) !important;
  gap: 24px !important;
  align-items: center !important;
}

.activities-block .activity-media-grid.road-media {
  grid-template-columns: 0.82fr 1.18fr !important;
  gap: 10px !important;
  align-items: stretch !important;
}

.activities-block .activity-media-grid.bird-media {
  grid-template-columns: 1fr !important;
  gap: 12px !important;
}

.activities-block .activity-media-tile {
  border-radius: 22px !important;
  overflow: hidden !important;
  background: #eff1ec !important;
  box-shadow: inset 0 0 0 1px rgba(19,42,50,.06) !important;
}

.activities-block .activity-media-tile.portrait video {
  width: 100% !important;
  height: 100% !important;
  min-height: 360px !important;
  aspect-ratio: 9 / 16 !important;
  object-fit: cover !important;
  object-position: center center !important;
  display: block !important;
}

.activities-block .activity-media-tile.landscape video {
  width: 100% !important;
  height: 100% !important;
  min-height: 360px !important;
  aspect-ratio: 16 / 10 !important;
  object-fit: cover !important;
  object-position: center center !important;
  display: block !important;
}

.activities-block .activity-media-grid.bird-media .activity-media-tile img {
  width: 100% !important;
  height: auto !important;
  max-height: 300px !important;
  object-fit: contain !important;
  object-position: center center !important;
  display: block !important;
  background: transparent !important;
  padding: 0 !important;
}

.activities-block .activity-copy {
  padding: 6px 4px !important;
}

.activities-block .activity-copy h4 {
  font-size: clamp(2rem, 2.4vw, 2.7rem) !important;
  margin-bottom: 12px !important;
}

.activities-block .activity-copy p {
  line-height: 1.72 !important;
}

@media (max-width: 980px) {
  .activities-block .activity-shell,
  .activities-block .activity-shell.reverse {
    grid-template-columns: 1fr !important;
  }
}

@media (max-width: 680px) {
  .activities-block .activity-feature-card {
    padding: 16px !important;
    border-radius: 24px !important;
  }

  .activities-block .activity-media-grid.road-media {
    grid-template-columns: 1fr !important;
    gap: 10px !important;
  }

  .activities-block .activity-media-tile.portrait video,
  .activities-block .activity-media-tile.landscape video {
    min-height: 260px !important;
    aspect-ratio: 4 / 3 !important;
  }

  .activities-block .activity-media-grid.bird-media .activity-media-tile img {
    max-height: none !important;
  }
}


/* v36 complete: text above, larger media area */
.activities-block {
  margin-top: 48px !important;
}

.activities-block .activity-feature-grid {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 28px !important;
}

.activities-block .activity-feature-card {
  padding: 22px !important;
  border-radius: 30px !important;
  border: 1px solid rgba(19,42,50,.09) !important;
  background:
    radial-gradient(circle at top right, rgba(205,183,143,.16), transparent 42%),
    linear-gradient(180deg, rgba(255,255,255,.98), rgba(249,247,243,.95)) !important;
  box-shadow: 0 26px 64px rgba(17,33,40,.10) !important;
}

.activities-block .activity-header {
  margin-bottom: 18px !important;
  max-width: 980px !important;
}

.activities-block .activity-header .activity-label {
  display: inline-flex !important;
  margin-bottom: 12px !important;
}

.activities-block .activity-header h4 {
  margin: 0 0 10px !important;
  font-family: "Cormorant Garamond", Georgia, serif !important;
  font-size: clamp(2rem, 2.6vw, 2.8rem) !important;
  line-height: .98 !important;
  font-weight: 500 !important;
  color: var(--deep) !important;
}

.activities-block .activity-header p {
  margin: 0 !important;
  color: #647278 !important;
  line-height: 1.72 !important;
}

.activities-block .activity-media-row {
  display: grid !important;
  gap: 10px !important;
}

.activities-block .activity-media-row.road {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}

.activities-block .activity-media-row.bird {
  grid-template-columns: 1fr !important;
  gap: 14px !important;
}

.activities-block .activity-media-large {
  overflow: hidden !important;
  border-radius: 24px !important;
  background: #eff1ec !important;
  box-shadow: inset 0 0 0 1px rgba(19,42,50,.06) !important;
  margin: 0 !important;
}

.activities-block .activity-media-row.road .activity-media-large video {
  width: 100% !important;
  height: 100% !important;
  min-height: 360px !important;
  aspect-ratio: 16 / 10 !important;
  object-fit: cover !important;
  object-position: center center !important;
  display: block !important;
  background: #101f24 !important;
}

.activities-block .activity-media-row.bird .activity-media-large img {
  width: 100% !important;
  height: auto !important;
  display: block !important;
  object-fit: contain !important;
  object-position: center center !important;
  background: transparent !important;
  padding: 0 !important;
  max-height: none !important;
}

@media (max-width: 760px) {
  .activities-block .activity-media-row.road {
    grid-template-columns: 1fr !important;
  }
  .activities-block .activity-media-row.road .activity-media-large video {
    min-height: 260px !important;
    aspect-ratio: 4 / 3 !important;
  }
  .activities-block .activity-feature-card {
    padding: 16px !important;
    border-radius: 24px !important;
  }
}


/* v37 complete: Birdwatching images side by side like Road biking */
.activities-block .activity-media-row.bird {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 10px !important;
}

.activities-block .activity-media-row.bird .activity-media-large {
  background: #f3f1ec !important;
}

.activities-block .activity-media-row.bird .activity-media-large img {
  width: 100% !important;
  height: 100% !important;
  min-height: 320px !important;
  max-height: 320px !important;
  display: block !important;
  object-fit: contain !important;
  object-position: center center !important;
  background: #f3f1ec !important;
  padding: 8px !important;
  box-sizing: border-box !important;
}

@media (max-width: 760px) {
  .activities-block .activity-media-row.bird {
    grid-template-columns: 1fr !important;
  }

  .activities-block .activity-media-row.bird .activity-media-large img {
    min-height: 240px !important;
    max-height: none !important;
  }
}


/* v38 complete: new first road biking video + circular birdwatching imagery */
.activities-block .activity-media-row.bird {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 16px !important;
  align-items: center !important;
}

.activities-block .activity-media-row.bird .activity-media-large {
  width: min(100%, 320px) !important;
  aspect-ratio: 1 / 1 !important;
  margin: 0 auto !important;
  border-radius: 50% !important;
  overflow: hidden !important;
  background: #eef1eb !important;
  box-shadow:
    inset 0 0 0 1px rgba(19,42,50,.06),
    0 14px 36px rgba(17,33,40,.10) !important;
}

.activities-block .activity-media-row.bird .activity-media-large img {
  width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
  max-height: none !important;
  object-fit: cover !important;
  object-position: center center !important;
  display: block !important;
  padding: 0 !important;
  background: transparent !important;
}

.activities-block .activity-media-row.road .activity-media-large {
  border-radius: 24px !important;
}

.activities-block .activity-media-row.road .activity-media-large video {
  background: #101f24 !important;
}

@media (max-width: 760px) {
  .activities-block .activity-media-row.bird {
    grid-template-columns: 1fr !important;
    gap: 14px !important;
  }

  .activities-block .activity-media-row.bird .activity-media-large {
    width: min(100%, 300px) !important;
  }
}


/* v39 complete: Birdwatching images styled exactly like Road biking media */
.activities-block .activity-media-row.bird {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 10px !important;
  align-items: stretch !important;
}

.activities-block .activity-media-row.bird .activity-media-large {
  width: 100% !important;
  aspect-ratio: auto !important;
  margin: 0 !important;
  border-radius: 24px !important;
  overflow: hidden !important;
  background: #101f24 !important;
  box-shadow: inset 0 0 0 1px rgba(19,42,50,.06) !important;
}

.activities-block .activity-media-row.bird .activity-media-large img {
  width: 100% !important;
  height: 100% !important;
  min-height: 360px !important;
  max-height: none !important;
  aspect-ratio: 16 / 10 !important;
  object-fit: cover !important;
  object-position: center center !important;
  display: block !important;
  padding: 0 !important;
  background: #101f24 !important;
}

@media (max-width: 760px) {
  .activities-block .activity-media-row.bird {
    grid-template-columns: 1fr !important;
    gap: 10px !important;
  }

  .activities-block .activity-media-row.bird .activity-media-large img {
    min-height: 260px !important;
    aspect-ratio: 4 / 3 !important;
  }
}


/* v40 complete: subtle legal notice on contact pages */
.legal-disclaimer {
  margin-top: 30px;
  padding-top: 18px;
  border-top: 1px solid rgba(19,42,50,.08);
  color: rgba(82,98,104,.72);
  font-size: .78rem;
  line-height: 1.55;
}

.legal-disclaimer h3 {
  margin: 0 0 8px;
  font-family: Inter, system-ui, sans-serif;
  font-size: .72rem;
  line-height: 1;
  font-weight: 400;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: rgba(20,43,51,.55);
}

.legal-disclaimer p {
  margin: 0;
  max-width: 100%;
}

@media (max-width: 720px) {
  .legal-disclaimer {
    font-size: .74rem;
  }
}


/* Rooms & Prices - room detail layout */
.room-paper{padding:38px 34px 38px}
.room-showcase{display:grid; grid-template-columns:minmax(0,1.1fr) minmax(360px,.9fr); gap:32px; align-items:start}
.room-label{margin:0 0 10px; font-size:.72rem; text-transform:uppercase; letter-spacing:.24em; color:var(--muted)}
.room-title-main{margin:0 0 18px; font-family:"Cormorant Garamond", Georgia, serif; font-size:clamp(2rem, 4vw, 3rem); line-height:1.02; font-weight:500; color:var(--deep); max-width:14ch}
.room-tags{display:flex; flex-wrap:wrap; gap:10px; margin-bottom:24px}
.room-tag{display:inline-flex; align-items:center; gap:8px; padding:10px 14px; border-radius:999px; background:rgba(255,255,255,.88); border:1px solid rgba(20,43,51,.1); box-shadow:0 10px 26px rgba(17,33,40,.05); font-size:.94rem; color:var(--deep)}
.tag-icon{font-size:1rem; line-height:1}
.room-meta-group{display:grid; gap:16px; margin-bottom:22px}
.room-stat h3, .room-feature-box h3{margin:0 0 6px; font-size:1rem; color:var(--deep); font-weight:600}
.room-stat p{margin:0; font-size:1.08rem; color:var(--text)}
.beds-emoji{display:inline-flex; gap:4px; margin-left:8px; font-size:1.2rem; vertical-align:middle}
.room-score{display:inline-flex; align-items:center; padding:10px 14px; width:max-content; max-width:100%; border-radius:16px; background:rgba(205,183,143,.18); color:var(--deep); font-size:.96rem}
.room-description{margin:0; color:var(--text); max-width:60ch}
.room-feature-sections{display:grid; gap:18px}
.room-feature-box{padding:18px 20px; border-radius:22px; background:linear-gradient(180deg, rgba(255,255,255,.76), rgba(255,255,255,.6)); border:1px solid rgba(20,43,51,.08)}
.room-feature-box.subtle{padding-top:15px; padding-bottom:15px}
.room-feature-box.subtle p{margin:0}
.amenity-list{list-style:none; margin:0; padding:0; display:grid; gap:8px}
.amenity-list.two-col{grid-template-columns:repeat(2, minmax(0, 1fr)); column-gap:28px}
.amenity-list li{position:relative; padding-left:20px; color:var(--text); line-height:1.5}
.amenity-list li::before{content:"✓"; position:absolute; left:0; top:0; color:var(--accent); font-weight:700}
.room-gallery-panel{position:sticky; top:104px}
.room-gallery{position:relative; padding:16px; border-radius:28px; background:linear-gradient(180deg, rgba(255,255,255,.9), rgba(255,255,255,.75)); border:1px solid rgba(255,255,255,.7); box-shadow:0 22px 48px rgba(17,33,40,.1)}
.gallery-viewport{position:relative; overflow:hidden; border-radius:22px; background:#eee7db; aspect-ratio:5/4}
.gallery-slide{position:absolute; inset:0; opacity:0; pointer-events:none; transition:opacity .32s ease}
.gallery-slide.active{opacity:1; pointer-events:auto}
.gallery-slide img{width:100%; height:100%; object-fit:cover}
.gallery-arrow{position:absolute; top:calc(50% - 26px); width:46px; height:46px; border:none; border-radius:50%; display:grid; place-items:center; background:rgba(255,255,255,.9); color:var(--deep); font-size:2rem; line-height:1; cursor:pointer; z-index:3; box-shadow:0 10px 26px rgba(17,33,40,.12); transition:transform .22s ease, background .22s ease}
.gallery-arrow:hover{transform:translateY(-1px); background:#fff}
.gallery-arrow.prev{left:28px}
.gallery-arrow.next{right:28px}
.gallery-controls{display:flex; align-items:center; justify-content:space-between; gap:16px; padding:14px 4px 0}
.gallery-dots{display:flex; gap:8px}
.gallery-dots button{width:9px; height:9px; padding:0; border-radius:50%; border:none; background:rgba(20,43,51,.18); cursor:pointer; transition:transform .2s ease, background .2s ease}
.gallery-dots button.active{background:var(--accent); transform:scale(1.18)}
.gallery-count{font-size:.86rem; letter-spacing:.08em; text-transform:uppercase; color:var(--muted)}

@media (max-width: 1080px){
  .room-showcase{grid-template-columns:1fr;}
  .room-title-main{max-width:none}
  .room-gallery-panel{position:relative; top:auto}
}
@media (max-width: 760px){
  .room-paper{padding:28px 20px 26px}
  .room-tag{font-size:.88rem; padding:9px 12px}
  .amenity-list.two-col{grid-template-columns:1fr}
  .gallery-arrow.prev{left:18px}
  .gallery-arrow.next{right:18px}
}


/* Rooms & Prices - compact room detail */
.room-detail-page .header-inner{padding-block:14px}
.room-detail-page .nav a{font-size:.92rem}
.room-main{padding-bottom:0}
.room-page-hero{padding-top:24px; padding-bottom:16px}
.room-shell{margin-top:0}
.room-paper.compact-mode{padding:24px 28px 20px}
.compact-footer{padding-block:14px}
.compact-footer .footer-inner{gap:12px}
.room-page-head{display:flex; justify-content:space-between; align-items:flex-end; gap:24px; margin-bottom:18px}
.room-page-title{margin:4px 0 0; font-size:clamp(2rem,3vw,2.55rem)}
.divider.mini{margin:0; width:auto; min-width:150px}
.divider.mini span{padding-left:18px; font-size:.74rem}
.booking-style{display:grid; grid-template-columns:minmax(0,1.08fr) minmax(430px,.92fr); gap:28px; align-items:start}
.booking-gallery{position:relative}
.booking-viewport{position:relative; overflow:hidden; border-radius:24px; background:#ece6db; aspect-ratio:1.08/1; min-height:420px; box-shadow:0 18px 44px rgba(17,33,40,.11)}
.gallery-slide{position:absolute; inset:0; opacity:0; pointer-events:none; transition:opacity .3s ease}
.gallery-slide.active{opacity:1; pointer-events:auto}
.gallery-slide img,.gallery-slide video{display:block; width:100%; height:100%; object-fit:cover}
.video-slide video{background:#000}
.gallery-arrow{position:absolute; top:calc(50% - 22px); width:44px; height:44px; border:none; border-radius:50%; background:rgba(255,255,255,.88); color:#6ea9bf; font-size:2rem; line-height:1; display:grid; place-items:center; cursor:pointer; z-index:4; box-shadow:0 12px 24px rgba(17,33,40,.12)}
.gallery-arrow.prev{left:18px}
.gallery-arrow.next{right:18px}
.gallery-thumbs{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; margin-top:12px}
.thumb{position:relative; padding:0; border:none; border-radius:16px; overflow:hidden; background:#efe7db; aspect-ratio:1/1; cursor:pointer; outline:2px solid transparent; box-shadow:0 10px 24px rgba(17,33,40,.08); transition:transform .2s ease, outline-color .2s ease}
.thumb img{display:block; width:100%; height:100%; object-fit:cover}
.thumb:hover{transform:translateY(-1px)}
.thumb.active{outline-color:#97c8da}
.play-badge{position:absolute; left:10px; bottom:10px; width:34px; height:34px; display:grid; place-items:center; color:#244350}
.play-badge svg{width:100%; height:100%}
.room-title-main{margin:0 0 14px; font-size:clamp(2.05rem,3vw,2.75rem); line-height:1.02; max-width:13ch}
.booking-tags{display:flex; flex-wrap:wrap; gap:8px; margin-bottom:16px}
.room-tag{display:inline-flex; align-items:center; gap:8px; padding:8px 12px; border-radius:12px; font-size:.92rem; background:#fff; border:1px solid rgba(20,43,51,.16); box-shadow:none}
.tag-icon.svg{width:17px; height:17px; display:inline-flex; color:#1e2930}
.tag-icon.svg svg,.bed-icon svg{display:block; width:100%; height:100%}
.compact-meta{display:grid; gap:10px; margin-bottom:14px}
.room-stat.inline{display:flex; align-items:baseline; gap:6px; flex-wrap:wrap}
.room-stat.inline h3,.room-feature-box.clean h3{margin:0; font-size:1rem; font-weight:700}
.room-stat.inline p,.smoke-inline p{margin:0}
.beds-emoji.monochrome{display:inline-flex; gap:4px; margin-left:6px; vertical-align:middle; color:#1d2831}
.bed-icon{width:26px; height:18px; display:inline-flex}
.room-description{margin:2px 0 0; font-size:1rem; line-height:1.46; max-width:58ch}
.room-details-grid{display:grid; gap:14px}
.room-feature-box.clean{padding:0; border:none; background:transparent}
.room-feature-box.clean h3{margin-bottom:8px}
.amenity-list.compact{gap:6px; font-size:.98rem}
.amenity-list.two-col{grid-template-columns:repeat(2,minmax(0,1fr)); column-gap:28px}
.amenity-list li{position:relative; padding-left:18px; line-height:1.34}
.amenity-list li::before{content:"✓"; position:absolute; left:0; top:0; color:#1d2831; font-weight:600}
.smoke-inline{display:flex; gap:10px; align-items:baseline; flex-wrap:wrap; padding-top:4px; border-top:1px solid rgba(20,43,51,.08)}
@media (max-width:1220px){.booking-style{grid-template-columns:1fr; gap:22px}.booking-viewport{aspect-ratio:4/3; min-height:360px}.room-title-main{max-width:none}}
@media (max-width:760px){.room-page-head{flex-direction:column; align-items:flex-start}.room-paper.compact-mode{padding:20px 16px 18px}.booking-viewport{min-height:280px}.room-tag{font-size:.86rem; padding:8px 10px}.gallery-thumbs{gap:8px}.amenity-list.two-col{grid-template-columns:1fr}.smoke-inline{display:block}.smoke-inline p{margin-top:6px}}


/* Rooms v3 - tighter text + larger media */
.room-detail-page .header-inner{
  min-height:64px !important;
  padding-block:8px !important;
}
.room-detail-page .brand-logo{
  width:48px !important;
  height:48px !important;
  border-radius:14px !important;
}
.room-detail-page .brand-text strong{
  font-size:1.5rem !important;
}
.room-detail-page .brand-text small{
  font-size:.55rem !important;
}
.room-detail-page .nav{
  gap:12px !important;
}
.room-detail-page .nav a{
  font-size:.82rem !important;
}
.room-page-hero{
  padding-top:14px !important;
  padding-bottom:8px !important;
}
.room-paper.compact-mode{
  padding:16px 20px 16px !important;
}
.room-page-head{
  margin-bottom:10px !important;
}
.room-page-head .page-kicker{
  font-size:.58rem !important;
  margin-bottom:2px !important;
}
.room-page-title{
  font-size:1.55rem !important;
  line-height:1 !important;
}
.divider.mini{
  min-width:120px !important;
}
.divider.mini span{
  font-size:.62rem !important;
  letter-spacing:.18em !important;
}
.booking-style{
  grid-template-columns:minmax(570px, 1.28fr) minmax(360px, .72fr) !important;
  gap:24px !important;
}
.booking-viewport{
  min-height:500px !important;
  aspect-ratio:1.2 / 1 !important;
  border-radius:24px !important;
}
.gallery-thumbs{
  gap:8px !important;
  margin-top:9px !important;
}
.thumb{
  border-radius:12px !important;
}
.room-title-main{
  font-size:clamp(1.28rem, 1.65vw, 1.62rem) !important;
  line-height:1.12 !important;
  max-width:none !important;
  margin-bottom:10px !important;
  font-weight:600 !important;
}
.booking-tags{
  gap:6px !important;
  margin-bottom:10px !important;
}
.room-tag{
  padding:6px 9px !important;
  border-radius:10px !important;
  font-size:.78rem !important;
  gap:6px !important;
}
.tag-icon.svg{
  width:15px !important;
  height:15px !important;
}
.compact-meta{
  gap:7px !important;
  margin-bottom:10px !important;
}
.room-stat.inline h3,
.room-feature-box.clean h3{
  font-size:.88rem !important;
}
.room-stat.inline p{
  font-size:.88rem !important;
}
.bed-icon{
  width:23px !important;
  height:16px !important;
}
.room-description{
  font-size:.86rem !important;
  line-height:1.34 !important;
  max-width:100% !important;
}
.room-details-grid{
  gap:9px !important;
}
.room-feature-box.clean h3{
  margin-bottom:5px !important;
}
.amenity-list.compact{
  gap:3px !important;
  font-size:.84rem !important;
}
.amenity-list li{
  line-height:1.22 !important;
  padding-left:15px !important;
}
.smoke-inline{
  padding-top:3px !important;
  gap:7px !important;
}
.smoke-inline p{
  font-size:.84rem !important;
}
.compact-footer{
  padding-block:8px !important;
  font-size:.8rem !important;
}

@media (max-width:1220px){
  .booking-style{
    grid-template-columns:1fr !important;
  }
  .booking-viewport{
    min-height:390px !important;
    aspect-ratio:4 / 3 !important;
  }
  .room-title-main{
    font-size:1.55rem !important;
  }
}

@media (min-width:1221px) and (max-height:820px){
  .booking-viewport{
    min-height:450px !important;
  }
  .thumb{
    max-height:72px !important;
  }
}


/* Room 02 additions */
.room-section-break{
  margin: 18px 0 14px;
  padding-top: 18px;
  border-top: 1px solid rgba(20,43,51,.10);
  display:flex;
  justify-content:flex-end;
}
.room-showcase.reverse-desktop .room-copy{order:1}
.room-showcase.reverse-desktop .room-gallery-panel{order:2}
@media (max-width:1220px){
  .room-showcase.reverse-desktop .room-copy,
  .room-showcase.reverse-desktop .room-gallery-panel{order:initial}
}


.room-stay-info{
  display:grid;
  gap:8px;
  padding-top:6px;
  border-top:1px solid rgba(20,43,51,.08);
}
.stay-info-row{
  display:flex;
  gap:10px;
  align-items:baseline;
  flex-wrap:wrap;
}
.stay-info-row h3,
.stay-info-row p{margin:0}
.stay-info-row h3{font-size:.88rem}
.stay-info-row p{font-size:.84rem; color:var(--text)}
.room-description.compact-copy{max-width:48ch !important}
@media (max-width:760px){
  .stay-info-row{display:block}
  .stay-info-row p{margin-top:4px}
}


/* Room 02 mirrored like Room 01 */
.room-showcase.reverse-desktop.booking-style{
  grid-template-columns:minmax(360px, .72fr) minmax(570px, 1.28fr) !important;
}
.room-showcase.reverse-desktop .booking-viewport{
  min-height:500px !important;
  aspect-ratio:1.2 / 1 !important;
}
@media (max-width:1220px){
  .room-showcase.reverse-desktop.booking-style{
    grid-template-columns:1fr !important;
  }
}


/* Rooms v4 - fit each room section fully in one page */

.room-detail-page .main{padding-bottom:24px !important;}
.room-paper.compact-mode{padding:12px 18px 14px !important;}
.room-page-head{margin-bottom:8px !important; align-items:center !important;}
.room-page-head .page-kicker{font-size:.54rem !important; margin-bottom:1px !important;}
.room-page-title{font-size:1.34rem !important; line-height:1 !important;}
.divider.mini{min-width:108px !important;}
.divider.mini span{font-size:.58rem !important; letter-spacing:.16em !important;}
.booking-style{grid-template-columns:minmax(500px,1.16fr) minmax(320px,.84fr) !important; gap:20px !important;}
.room-showcase.reverse-desktop.booking-style{grid-template-columns:minmax(320px,.84fr) minmax(500px,1.16fr) !important;}
.booking-viewport{min-height:420px !important; aspect-ratio:1.18 / 1 !important; border-radius:22px !important;}
.room-gallery{padding:12px !important; border-radius:24px !important;}
.gallery-arrow{width:40px !important; height:40px !important; font-size:1.8rem !important;}
.gallery-arrow.prev{left:12px !important;}
.gallery-arrow.next{right:12px !important;}
.gallery-thumbs{gap:7px !important; margin-top:8px !important;}
.thumb{border-radius:12px !important; box-shadow:0 8px 18px rgba(17,33,40,.08) !important;}
.room-title-main{font-size:clamp(1.14rem,1.45vw,1.42rem) !important; line-height:1.1 !important; margin-bottom:8px !important;}
.booking-tags{gap:6px !important; margin-bottom:8px !important;}
.room-tag{padding:5px 8px !important; font-size:.74rem !important;}
.tag-icon.svg{width:14px !important; height:14px !important;}
.compact-meta{gap:6px !important; margin-bottom:8px !important;}
.room-stat.inline h3,.room-feature-box.clean h3,.stay-info-row h3{font-size:.82rem !important;}
.room-stat.inline p,.stay-info-row p{font-size:.82rem !important;}
.bed-icon{width:21px !important; height:15px !important;}
.room-description,.room-description.compact-copy{font-size:.8rem !important; line-height:1.28 !important; max-width:100% !important;}
.room-details-grid{display:grid !important; grid-template-columns:minmax(0,.78fr) minmax(0,1.22fr) !important; gap:8px 20px !important; align-items:start !important;}
.room-feature-box.clean{min-width:0;}
.room-feature-box.clean h3{margin-bottom:4px !important;}
.amenity-list.compact{gap:2px !important; font-size:.79rem !important;}
.amenity-list.two-col{column-gap:18px !important;}
.amenity-list li{padding-left:13px !important; line-height:1.16 !important;}
.amenity-list li::before{font-size:.85em; top:1px !important;}
.smoke-inline{display:flex !important; align-items:baseline !important; gap:6px !important; padding-top:4px !important; border-top:1px solid rgba(20,43,51,.08) !important;}
.smoke-inline p{font-size:.79rem !important;}
.room-stay-info{gap:4px !important; padding-top:4px !important;}
.stay-info-row{gap:6px !important;}
.room-section-break{margin:14px 0 10px !important; padding-top:14px !important;}
.compact-footer{padding-block:6px !important;}
.compact-footer .footer-inner{padding-top:10px !important; font-size:.75rem !important;}
.compact-footer .footer-inner strong{font-size:1rem !important; margin-bottom:2px !important;}
.compact-footer .footer-links{gap:10px !important;}
@media (max-width:1220px){
  .booking-style,.room-showcase.reverse-desktop.booking-style{grid-template-columns:1fr !important;}
  .room-details-grid{grid-template-columns:1fr !important;}
  .booking-viewport{min-height:360px !important; aspect-ratio:4 / 3 !important;}
}


/* Rooms v9 - clearer section titles and bathroom items stacked */
.room-details-grid > .room-feature-box.clean:first-child .amenity-list.two-col,
.room-details-grid > .room-feature-box.clean:first-child .amenity-list.compact {
  grid-template-columns: 1fr !important;
  gap: 3px !important;
}

.room-details-grid > .room-feature-box.clean > h3 {
  display: inline-flex !important;
  align-items: center !important;
  width: fit-content !important;
  margin-bottom: 7px !important;
  padding: 5px 9px !important;
  border-radius: 999px !important;
  background: rgba(205, 183, 143, .18) !important;
  border: 1px solid rgba(205, 183, 143, .32) !important;
  color: #173038 !important;
  font-size: .70rem !important;
  line-height: 1 !important;
  font-weight: 700 !important;
  letter-spacing: .12em !important;
  text-transform: uppercase !important;
}

.room-details-grid > .room-feature-box.clean > h3::before {
  content: "";
  width: 5px;
  height: 5px;
  margin-right: 7px;
  border-radius: 50%;
  background: #c5aa6b;
}

.room-details-grid > .room-feature-box.clean.smoke-inline > h3 {
  margin-bottom: 0 !important;
}

.room-details-grid > .room-feature-box.clean.smoke-inline {
  align-items: center !important;
}

@media (max-width: 760px) {
  .room-details-grid > .room-feature-box.clean > h3 {
    font-size: .68rem !important;
    padding: 5px 8px !important;
  }
}


/* Rooms v10 - breakfast and vacation rental note */
.room-extra-note {
  margin-top: 6px;
  padding: 10px 12px;
  border-radius: 16px;
  background:
    radial-gradient(circle at top left, rgba(205,183,143,.18), transparent 42%),
    rgba(255,255,255,.72);
  border: 1px solid rgba(205,183,143,.34);
  box-shadow: 0 10px 24px rgba(17,33,40,.05);
  color: var(--text);
  font-size: .80rem;
  line-height: 1.35;
}

.room-extra-note h3 {
  margin: 0 0 6px;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  font-size: .70rem;
  line-height: 1;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: #173038;
}

.room-extra-note h3::before {
  content: "";
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: #c5aa6b;
}

.room-extra-note p {
  margin: 0;
}

.room-extra-note p + p {
  margin-top: 5px;
}

.room-extra-note strong {
  color: #173038;
  font-weight: 700;
}

@media (max-width: 760px) {
  .room-extra-note {
    font-size: .78rem;
    padding: 9px 10px;
  }
}


/* Rooms v11 - horizontal additional information + one-screen compacting */
.room-paper.compact-mode {
  padding: 10px 16px 12px !important;
}

.room-page-head {
  margin-bottom: 6px !important;
}

.booking-style {
  gap: 18px !important;
}

.booking-viewport {
  min-height: 395px !important;
  aspect-ratio: 1.22 / 1 !important;
}

.room-showcase.reverse-desktop .booking-viewport {
  min-height: 395px !important;
}

.gallery-thumbs {
  margin-top: 6px !important;
  gap: 6px !important;
}

.room-title-main {
  font-size: clamp(1.05rem, 1.32vw, 1.28rem) !important;
  margin-bottom: 6px !important;
  line-height: 1.08 !important;
}

.booking-tags {
  margin-bottom: 6px !important;
  gap: 5px !important;
}

.room-tag {
  padding: 4px 7px !important;
  font-size: .70rem !important;
  border-radius: 9px !important;
}

.compact-meta {
  gap: 4px !important;
  margin-bottom: 6px !important;
}

.room-description,
.room-description.compact-copy {
  font-size: .74rem !important;
  line-height: 1.22 !important;
}

.room-details-grid {
  gap: 6px 16px !important;
}

.room-feature-box.clean > h3 {
  font-size: .62rem !important;
  padding: 4px 7px !important;
  margin-bottom: 4px !important;
  letter-spacing: .105em !important;
}

.amenity-list.compact {
  gap: 1px !important;
  font-size: .73rem !important;
}

.amenity-list li {
  line-height: 1.12 !important;
  padding-left: 12px !important;
}

.smoke-inline {
  padding-top: 2px !important;
}

.smoke-inline p,
.stay-info-row p {
  font-size: .73rem !important;
}

.room-stay-info {
  gap: 2px !important;
  padding-top: 2px !important;
}

.stay-info-row h3 {
  font-size: .75rem !important;
}

.room-extra-note {
  grid-column: 1 / -1 !important;
  margin-top: 2px !important;
  padding: 7px 9px !important;
  border-radius: 13px !important;
  display: grid !important;
  grid-template-columns: auto minmax(0, 1fr) minmax(0, 1fr) !important;
  align-items: start !important;
  gap: 8px 12px !important;
  font-size: .68rem !important;
  line-height: 1.15 !important;
}

.room-extra-note h3 {
  margin: 0 !important;
  white-space: nowrap !important;
  font-size: .58rem !important;
  letter-spacing: .10em !important;
  padding-top: 2px !important;
}

.room-extra-note p {
  margin: 0 !important;
}

.room-extra-note p + p {
  margin-top: 0 !important;
}

.room-section-break {
  margin: 10px 0 7px !important;
  padding-top: 10px !important;
}

@media (min-width: 1221px) and (max-height: 850px) {
  .room-detail-page .header-inner {
    min-height: 58px !important;
    padding-block: 6px !important;
  }

  .room-page-hero {
    padding-top: 10px !important;
  }

  .booking-viewport,
  .room-showcase.reverse-desktop .booking-viewport {
    min-height: 360px !important;
  }

  .thumb {
    max-height: 62px !important;
  }

  .compact-footer {
    display: none !important;
  }
}

@media (max-width: 1220px) {
  .room-extra-note {
    grid-template-columns: 1fr !important;
  }

  .room-extra-note h3 {
    white-space: normal !important;
  }
}


/* Rooms v12 - breakfast-only note, larger but compact */
.room-extra-note {
  grid-column: 1 / -1 !important;
  display: block !important;
  margin-top: 3px !important;
  padding: 8px 11px !important;
  border-radius: 14px !important;
  font-size: .80rem !important;
  line-height: 1.28 !important;
}

.room-extra-note h3 {
  display: inline-flex !important;
  margin: 0 0 5px !important;
  white-space: normal !important;
  font-size: .64rem !important;
  letter-spacing: .11em !important;
  line-height: 1 !important;
}

.room-extra-note p {
  margin: 0 !important;
  max-width: 100% !important;
}

.room-extra-note p + p {
  display: none !important;
}

@media (min-width: 1221px) and (max-height: 850px) {
  .room-extra-note {
    font-size: .76rem !important;
    line-height: 1.22 !important;
    padding: 7px 10px !important;
  }

  .room-extra-note h3 {
    font-size: .60rem !important;
    margin-bottom: 4px !important;
  }
}

@media (min-height: 851px) and (min-width: 1221px) {
  .room-extra-note {
    font-size: .84rem !important;
    line-height: 1.30 !important;
  }
}


/* Contact v14 - email and mobile */
.contact-details {
  display: grid;
  gap: 8px;
  margin-top: 18px;
}

.contact-details a {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  padding: 9px 13px;
  border-radius: 999px;
  background: rgba(255,255,255,.76);
  border: 1px solid rgba(20,43,51,.10);
  color: #173038;
  font-size: .92rem;
  text-decoration: none;
  box-shadow: 0 10px 24px rgba(17,33,40,.06);
}

.contact-details a:hover {
  background: #fff;
}


/* v15 contact plain text + consistent top navigation size */
.contact-details {
  display: grid !important;
  gap: 7px !important;
  margin-top: 18px !important;
}

.contact-details p {
  margin: 0 !important;
  color: #173038 !important;
  font-size: .95rem !important;
  line-height: 1.45 !important;
}

.contact-details strong {
  font-weight: 700 !important;
  color: #173038 !important;
}

/* Keep the navigation text the same size on every page */
.nav a,
.room-detail-page .nav a,
.home-page .nav a {
  font-size: .90rem !important;
  line-height: 1 !important;
}


/* v16 - room text slightly more airy + contact label */
.room-copy.booking-copy {
  padding-top: 4px !important;
}

.room-title-main {
  margin-bottom: 9px !important;
}

.booking-tags {
  margin-bottom: 9px !important;
  gap: 7px !important;
}

.room-tag {
  padding: 5px 9px !important;
  font-size: .76rem !important;
}

.compact-meta {
  gap: 7px !important;
  margin-bottom: 9px !important;
}

.room-description,
.room-description.compact-copy {
  font-size: .82rem !important;
  line-height: 1.36 !important;
  max-width: 100% !important;
}

.room-details-grid {
  gap: 10px 22px !important;
}

.room-feature-box.clean > h3 {
  margin-bottom: 6px !important;
  padding: 5px 9px !important;
  font-size: .66rem !important;
}

.amenity-list.compact {
  gap: 4px !important;
  font-size: .80rem !important;
}

.amenity-list li {
  line-height: 1.25 !important;
  padding-left: 15px !important;
}

.room-stay-info {
  gap: 5px !important;
  padding-top: 5px !important;
}

.stay-info-row {
  gap: 8px !important;
}

.stay-info-row h3 {
  font-size: .80rem !important;
}

.stay-info-row p {
  font-size: .80rem !important;
}

.smoke-inline {
  padding-top: 5px !important;
  gap: 8px !important;
}

.smoke-inline p {
  font-size: .80rem !important;
}

.room-extra-note {
  margin-top: 5px !important;
  padding: 9px 12px !important;
  font-size: .82rem !important;
  line-height: 1.34 !important;
}

.room-extra-note h3 {
  margin-bottom: 6px !important;
  font-size: .66rem !important;
}

@media (min-width: 1221px) and (max-height: 850px) {
  .room-description,
  .room-description.compact-copy {
    font-size: .78rem !important;
    line-height: 1.30 !important;
  }

  .amenity-list.compact {
    gap: 3px !important;
    font-size: .77rem !important;
  }

  .amenity-list li {
    line-height: 1.20 !important;
  }

  .room-extra-note {
    font-size: .78rem !important;
    line-height: 1.28 !important;
  }
}


/* v17 contact booking note */
.booking-info-note {
  margin-top: 18px;
  padding: 15px 17px;
  border-radius: 20px;
  background:
    radial-gradient(circle at top left, rgba(205,183,143,.16), transparent 42%),
    rgba(255,255,255,.72);
  border: 1px solid rgba(205,183,143,.28);
  color: #536269;
  font-size: .95rem;
  line-height: 1.55;
}

.booking-info-note p {
  margin: 0;
}

.booking-info-note p + p {
  margin-top: 8px;
}

.booking-info-note a {
  color: #173038;
  font-weight: 700;
  text-decoration: none;
  border-bottom: 1px solid rgba(23,48,56,.35);
}

.booking-info-note a:hover {
  border-bottom-color: #173038;
}


/* v20 room labels and prices */
.stay-info-row p br {
  display: block;
  content: "";
  margin-top: 2px;
}


/* v24 - family room normal gallery positioning */
.room-showcase.booking-style:not(.reverse-desktop) > .room-gallery-panel.large-media:first-child {
  min-width: 0;
}

.room-showcase.booking-style:not(.reverse-desktop) > .room-gallery-panel.large-media:first-child + .room-copy.booking-copy {
  min-width: 0;
}


/* v25 - keep German ß visible in room labels, do not uppercase room names */
.room-section-break .divider.mini span,
.room-page-head .divider.mini span {
  text-transform: none !important;
}


/* v26: paddling activity with same premium layout as road biking */
.activities-block .activity-media-row.paddle {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}

.activities-block .activity-media-row.paddle .activity-media-large img {
  width: 100% !important;
  height: 100% !important;
  min-height: 360px !important;
  aspect-ratio: 16 / 10 !important;
  object-fit: cover !important;
  object-position: center center !important;
  display: block !important;
  background: #eff1ec !important;
}

@media (max-width: 760px) {
  .activities-block .activity-media-row.paddle {
    grid-template-columns: 1fr !important;
  }
  .activities-block .activity-media-row.paddle .activity-media-large img {
    min-height: 260px !important;
    aspect-ratio: 4 / 3 !important;
  }
}


/* v29 - fixed top navigation, no movement or delay */
.nav,
.nav a,
.nav a::before,
.nav a::after,
.lang,
.lang a,
.lang a::before,
.lang a::after {
  transition: none !important;
  transform: none !important;
  animation: none !important;
}

.nav {
  align-items: center !important;
}

.nav a {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 38px !important;
  line-height: 1 !important;
  font-size: .90rem !important;
  font-weight: 500 !important;
  letter-spacing: .01em !important;
  white-space: nowrap !important;
  box-sizing: border-box !important;
}

.nav a:hover,
.nav a:focus,
.nav a.active {
  transform: none !important;
  font-size: .90rem !important;
  font-weight: 500 !important;
  letter-spacing: .01em !important;
}

.lang a {
  min-width: 38px !important;
  min-height: 32px !important;
  padding: 0 10px !important;
  line-height: 1 !important;
  font-size: .84rem !important;
  font-weight: 600 !important;
}

.lang a:hover,
.lang a:focus,
.lang a.active {
  transform: none !important;
  font-size: .84rem !important;
  font-weight: 600 !important;
}


/* v30 - no underline and no navigation flicker */
.nav a::after,
.nav a::before,
.lang a::after,
.lang a::before {
  content: none !important;
  display: none !important;
}

.nav a,
.lang a {
  text-decoration: none !important;
  opacity: 1 !important;
  -webkit-tap-highlight-color: transparent !important;
}

.nav a:hover,
.nav a:focus,
.nav a:active,
.nav a.active,
.lang a:hover,
.lang a:focus,
.lang a:active,
.lang a.active {
  text-decoration: none !important;
  opacity: 1 !important;
  transform: none !important;
  filter: none !important;
  transition: none !important;
}


/* v31 - stable premium top navigation without shifting */
html {
  overflow-y: scroll !important;
  scrollbar-gutter: stable !important;
}

.header,
.header.scrolled {
  min-height: 78px !important;
  transform: none !important;
  transition: none !important;
  animation: none !important;
}

.header-inner {
  min-height: 78px !important;
  height: 78px !important;
  align-items: center !important;
  transform: none !important;
  transition: none !important;
}

.brand,
.brand-logo,
.brand-text,
.nav-wrap,
.nav,
.nav a,
.lang,
.lang a {
  transform: none !important;
  transition: none !important;
  animation: none !important;
}

.nav {
  display: flex !important;
  align-items: center !important;
  gap: 22px !important;
  min-height: 42px !important;
}

.nav a,
.nav a:hover,
.nav a:focus,
.nav a:active,
.nav a.active {
  font-family: Georgia, "Times New Roman", serif !important;
  font-size: 1rem !important;
  font-weight: 400 !important;
  letter-spacing: .025em !important;
  line-height: 1 !important;
  color: #2e4249 !important;
  text-decoration: none !important;
  opacity: 1 !important;
  min-height: 42px !important;
  padding: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  white-space: nowrap !important;
  box-sizing: border-box !important;
  -webkit-font-smoothing: antialiased !important;
  text-rendering: geometricPrecision !important;
}

.nav a.active {
  color: #122a32 !important;
}

.nav a::before,
.nav a::after,
.lang a::before,
.lang a::after {
  content: none !important;
  display: none !important;
  opacity: 0 !important;
  transform: none !important;
  border: 0 !important;
  background: transparent !important;
}

.lang {
  min-height: 42px !important;
  align-items: center !important;
  gap: 8px !important;
}

.lang a,
.lang a:hover,
.lang a:focus,
.lang a:active,
.lang a.active {
  font-family: Georgia, "Times New Roman", serif !important;
  font-size: .86rem !important;
  font-weight: 400 !important;
  letter-spacing: .08em !important;
  min-width: 34px !important;
  min-height: 32px !important;
  padding: 0 8px !important;
  text-decoration: none !important;
  opacity: 1 !important;
}

@media (max-width: 920px) {
  .header-inner {
    height: auto !important;
    min-height: 72px !important;
  }

  .nav {
    gap: 12px !important;
    min-height: auto !important;
  }

  .nav a,
  .nav a:hover,
  .nav a:focus,
  .nav a:active,
  .nav a.active {
    min-height: 32px !important;
    justify-content: flex-start !important;
  }
}


/* v32 - completely fixed navigation tab sizes */
@media (min-width: 921px) {
  .header .nav {
    gap: 18px !important;
    display: flex !important;
    align-items: center !important;
  }

  .header .nav > a {
    flex: 0 0 auto !important;
    height: 42px !important;
    min-height: 42px !important;
    max-height: 42px !important;
    padding: 0 !important;
    margin: 0 !important;
    box-sizing: border-box !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    overflow: visible !important;

    font-family: Georgia, "Times New Roman", serif !important;
    font-size: 1rem !important;
    font-weight: 400 !important;
    font-style: normal !important;
    font-stretch: normal !important;
    letter-spacing: .025em !important;
    line-height: 42px !important;

    transform: none !important;
    scale: 1 !important;
    transition: none !important;
    animation: none !important;
    text-decoration: none !important;
    opacity: 1 !important;
    filter: none !important;
  }

  .header .nav > a:nth-child(1) { width: 88px !important; }
  .header .nav > a:nth-child(2) { width: 86px !important; }
  .header .nav > a:nth-child(3) { width: 142px !important; }
  .header .nav > a:nth-child(4) { width: 90px !important; }
  .header .nav > a:nth-child(5) { width: 235px !important; }

  .header .nav > a:hover,
  .header .nav > a:focus,
  .header .nav > a:active,
  .header .nav > a.active,
  .header .nav > a:visited {
    width: inherit !important;
    height: 42px !important;
    min-height: 42px !important;
    max-height: 42px !important;
    padding: 0 !important;
    margin: 0 !important;

    font-family: Georgia, "Times New Roman", serif !important;
    font-size: 1rem !important;
    font-weight: 400 !important;
    font-style: normal !important;
    font-stretch: normal !important;
    letter-spacing: .025em !important;
    line-height: 42px !important;

    transform: none !important;
    scale: 1 !important;
    transition: none !important;
    animation: none !important;
    text-decoration: none !important;
    opacity: 1 !important;
    filter: none !important;
  }

  .header .nav .lang {
    flex: 0 0 82px !important;
    width: 82px !important;
    min-width: 82px !important;
    height: 42px !important;
    min-height: 42px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 6px !important;
    margin-left: 4px !important;
    padding-left: 14px !important;
    box-sizing: border-box !important;
    transform: none !important;
    transition: none !important;
  }

  .header .nav .lang a,
  .header .nav .lang a:hover,
  .header .nav .lang a:focus,
  .header .nav .lang a:active,
  .header .nav .lang a.active,
  .header .nav .lang a:visited {
    flex: 0 0 30px !important;
    width: 30px !important;
    min-width: 30px !important;
    max-width: 30px !important;
    height: 32px !important;
    min-height: 32px !important;
    max-height: 32px !important;
    padding: 0 !important;
    margin: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    font-family: Georgia, "Times New Roman", serif !important;
    font-size: .86rem !important;
    font-weight: 400 !important;
    font-style: normal !important;
    letter-spacing: .08em !important;
    line-height: 32px !important;

    transform: none !important;
    scale: 1 !important;
    transition: none !important;
    animation: none !important;
    text-decoration: none !important;
    opacity: 1 !important;
    filter: none !important;
  }
}


/* v33 - final hard lock for top navigation tabs */
@media (min-width: 921px) {
  .header,
  .header:hover,
  .header.scrolled,
  .header-inner,
  .header-inner:hover {
    height: 78px !important;
    min-height: 78px !important;
    max-height: 78px !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    transform: none !important;
    transition: none !important;
    animation: none !important;
  }

  .header .nav,
  .header .nav:hover {
    height: 42px !important;
    min-height: 42px !important;
    max-height: 42px !important;
    gap: 18px !important;
    transform: none !important;
    transition: none !important;
    animation: none !important;
  }

  .header .nav > a,
  .header .nav > a:hover,
  .header .nav > a:focus,
  .header .nav > a:active,
  .header .nav > a.active,
  .header .nav > a.active:hover,
  .header .nav > a:visited {
    height: 42px !important;
    min-height: 42px !important;
    max-height: 42px !important;
    padding: 0 !important;
    margin: 0 !important;
    border: 0 !important;
    outline: 0 !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-sizing: border-box !important;
    overflow: visible !important;
    white-space: nowrap !important;
    vertical-align: middle !important;

    font-family: Georgia, "Times New Roman", serif !important;
    font-size: 1rem !important;
    font-weight: 400 !important;
    font-style: normal !important;
    font-variant: normal !important;
    font-stretch: normal !important;
    letter-spacing: .025em !important;
    line-height: 42px !important;

    color: #2e4249 !important;
    background: transparent !important;
    text-decoration: none !important;
    text-shadow: none !important;
    opacity: 1 !important;
    filter: none !important;

    transform: translate3d(0,0,0) !important;
    scale: 1 !important;
    transition: none !important;
    animation: none !important;
    will-change: auto !important;
  }

  .header .nav > a:nth-child(1),
  .header .nav > a:nth-child(1):hover,
  .header .nav > a:nth-child(1):focus,
  .header .nav > a:nth-child(1):active,
  .header .nav > a:nth-child(1).active {
    width: 92px !important;
    min-width: 92px !important;
    max-width: 92px !important;
  }

  .header .nav > a:nth-child(2),
  .header .nav > a:nth-child(2):hover,
  .header .nav > a:nth-child(2):focus,
  .header .nav > a:nth-child(2):active,
  .header .nav > a:nth-child(2).active {
    width: 92px !important;
    min-width: 92px !important;
    max-width: 92px !important;
  }

  .header .nav > a:nth-child(3),
  .header .nav > a:nth-child(3):hover,
  .header .nav > a:nth-child(3):focus,
  .header .nav > a:nth-child(3):active,
  .header .nav > a:nth-child(3).active {
    width: 150px !important;
    min-width: 150px !important;
    max-width: 150px !important;
  }

  .header .nav > a:nth-child(4),
  .header .nav > a:nth-child(4):hover,
  .header .nav > a:nth-child(4):focus,
  .header .nav > a:nth-child(4):active,
  .header .nav > a:nth-child(4).active {
    width: 96px !important;
    min-width: 96px !important;
    max-width: 96px !important;
  }

  .header .nav > a:nth-child(5),
  .header .nav > a:nth-child(5):hover,
  .header .nav > a:nth-child(5):focus,
  .header .nav > a:nth-child(5):active,
  .header .nav > a:nth-child(5).active {
    width: 252px !important;
    min-width: 252px !important;
    max-width: 252px !important;
  }

  .header .nav > a::before,
  .header .nav > a::after,
  .header .nav > a:hover::before,
  .header .nav > a:hover::after,
  .header .nav > a.active::before,
  .header .nav > a.active::after {
    content: none !important;
    display: none !important;
    width: 0 !important;
    height: 0 !important;
    transform: none !important;
    transition: none !important;
    animation: none !important;
    opacity: 0 !important;
    background: transparent !important;
    border: 0 !important;
  }

  .header .nav .lang,
  .header .nav .lang:hover {
    flex: 0 0 86px !important;
    width: 86px !important;
    min-width: 86px !important;
    max-width: 86px !important;
    height: 42px !important;
    min-height: 42px !important;
    max-height: 42px !important;
    padding-left: 14px !important;
    padding-right: 0 !important;
    margin-left: 4px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 6px !important;
    box-sizing: border-box !important;
    transform: none !important;
    transition: none !important;
    animation: none !important;
  }

  .header .nav .lang a,
  .header .nav .lang a:hover,
  .header .nav .lang a:focus,
  .header .nav .lang a:active,
  .header .nav .lang a.active,
  .header .nav .lang a.active:hover,
  .header .nav .lang a:visited {
    flex: 0 0 30px !important;
    width: 30px !important;
    min-width: 30px !important;
    max-width: 30px !important;
    height: 32px !important;
    min-height: 32px !important;
    max-height: 32px !important;
    padding: 0 !important;
    margin: 0 !important;
    border: 0 !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-sizing: border-box !important;

    font-family: Georgia, "Times New Roman", serif !important;
    font-size: .86rem !important;
    font-weight: 400 !important;
    font-style: normal !important;
    letter-spacing: .08em !important;
    line-height: 32px !important;

    color: #2e4249 !important;
    background: transparent !important;
    text-decoration: none !important;
    opacity: 1 !important;
    filter: none !important;

    transform: translate3d(0,0,0) !important;
    scale: 1 !important;
    transition: none !important;
    animation: none !important;
    will-change: auto !important;
  }
}