/*
Theme Name: Culminarium 5072
Theme URI: https://5072.ch/
Author: Culminarium 5072
Description: Responsives B&B-Theme mit editierbarer Startseite.
Version: 1.0.11
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: culinarium5072
*/
:root{--beige:#A4897A;--brown:#422918;--green:#ACCA40;--red:#E30513;--dark:#17252a;--cream:#f7f4ef;--max:1180px}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:#252525;font:16px/1.55 Arial,sans-serif}a{color:inherit;text-decoration:none}img{max-width:100%;display:block}.wrap{width:min(var(--max),calc(100% - 40px));margin:auto}.site-header{position:sticky;top:0;z-index:50;background:var(--dark);color:#fff}.header-inner{min-height:78px;display:flex;align-items:center;gap:28px}.brand{background:#fff;width:190px;align-self:stretch;display:flex;align-items:center;padding:8px 14px}.brand img{max-height:68px;width:auto;margin:auto}.main-nav{flex:1}.main-nav ul{display:flex;gap:24px;list-style:none;margin:0;padding:0}.main-nav a,.book-btn{font-size:.82rem;text-transform:uppercase}.book-btn,.btn{display:inline-flex;padding:13px 20px;border:1px solid currentColor;font-weight:700;font-size:.8rem;letter-spacing:.04em}.menu-toggle{display:none;margin-left:auto;background:none;border:1px solid #fff;color:#fff;padding:8px 12px}.hero{min-height:590px;background-size:cover;background-position:center;position:relative;color:#fff;display:flex;align-items:center}.hero:before,.feature:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#000b,#0003 58%,#0000)}.hero-content,.feature-copy{position:relative;z-index:1}.hero-content{max-width:590px;padding:70px 0}.script{font-family:"Segoe Print","Bradley Hand",cursive;font-weight:400}.hero h1{font-size:clamp(2.6rem,5vw,4.6rem);line-height:1.08;margin:0 0 20px}.hero .lead{font-size:1.2rem;font-weight:700}.btn.light{background:#eef1dc;color:#26342e;border:0}.badge{position:absolute;z-index:2;right:6%;bottom:-35px;width:150px;height:150px;border-radius:50%;background:#879b57;display:grid;place-items:center;text-align:center;font-family:"Segoe Print",cursive;transform:rotate(-7deg)}.section{padding:70px 0}.section-title{text-align:center;margin-bottom:34px}.section-title h2{font-size:2.2rem;margin:0}.rooms{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}.room-card{box-shadow:0 8px 28px #0002;border-bottom:4px solid var(--beige)}.room-card img{width:100%;aspect-ratio:4/3;object-fit:cover}.room-copy{padding:18px 20px 22px}.room-copy h3{margin:0}.location{display:block;font-weight:700;color:var(--brown);margin:5px 0 8px}.room-copy p{margin:0;color:#555}.feature{min-height:430px;background-size:cover;background-position:center;position:relative;color:#fff;display:flex;align-items:center}.feature-copy{max-width:510px}.feature h2{font-size:3rem;line-height:1.15;margin:0}.lounge{display:grid;grid-template-columns:1.3fr .9fr;min-height:440px}.lounge-image{background-size:cover;background-position:center}.lounge-copy{padding:65px;background:var(--cream);display:flex;flex-direction:column;justify-content:center}.lounge-copy h2{font-size:2.2rem;margin:0}.eyebrow{text-transform:uppercase;letter-spacing:.18em;font-size:.75rem;color:#555}.amenities{background:var(--dark);color:#fff;padding:26px 0}.amenity-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:20px}.amenity{text-align:center}.amenity strong{display:block;font-size:1.7rem;color:var(--green)}.site-footer{padding:35px 0;color:var(--brown)}.footer-inner{display:flex;justify-content:space-between}.footer-tag{font:1.5rem "Segoe Print",cursive}.content-area{padding:60px 0;min-height:55vh}@media(max-width:900px){.brand{width:150px}.menu-toggle{display:block}.main-nav{display:none;position:absolute;top:78px;left:0;right:0;background:var(--dark);padding:20px}.main-nav.open{display:block}.main-nav ul{flex-direction:column}.book-btn{display:none}.rooms,.lounge{grid-template-columns:1fr}.lounge-image{min-height:350px}.amenity-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:560px){.badge{display:none}.amenity-grid{grid-template-columns:1fr}.footer-inner{flex-direction:column;gap:20px}}
/* Linked room cards */
.room-card a { color: inherit; text-decoration: none; }
.room-image-link { display:block; overflow:hidden; }
.room-image-link img { transition: transform .25s ease; }
.room-card:hover .room-image-link img { transform: scale(1.02); }
.text-link { display:inline-block; margin-top:.35rem; font-weight:700; letter-spacing:.04em; color:#422918 !important; border-bottom:2px solid #ACCA40; padding-bottom:2px; }
.text-link:hover { border-bottom-color:#E30513; }
.whole-house-cta { margin-top:2rem; padding:1rem 1.25rem; border-top:1px solid rgba(66,41,24,.18); display:flex; justify-content:center; gap:1rem; flex-wrap:wrap; align-items:center; text-align:center; }
.whole-house-cta span { font-weight:600; }
@media (max-width:700px){ .whole-house-cta { align-items:flex-start; flex-direction:column; text-align:left; } }

/* v3: visible keyboard focus for all links/buttons */
a:focus-visible, button:focus-visible{outline:3px solid var(--green);outline-offset:3px}


/* v6: mobile image proportions — keep original aspect ratio, never stretch */
img{height:auto !important;object-fit:contain;}
.room-card img{height:auto !important;aspect-ratio:auto !important;object-fit:contain !important;}
.brand img,.custom-logo{height:auto !important;max-width:100%;object-fit:contain !important;}

@media (max-width:900px){
  .room-image-link{background:#fff;}
  .room-image-link img{width:100%;height:auto !important;aspect-ratio:auto !important;object-fit:contain !important;}
  .hero,.feature,.lounge-image{background-repeat:no-repeat;background-size:cover;background-position:center center;}
  .hero{min-height:520px;}
  .feature{min-height:360px;}
  .lounge-image{min-height:0;aspect-ratio:4/3;}
}
@media (max-width:560px){
  .wrap{width:min(var(--max),calc(100% - 28px));}
  .hero{min-height:500px;background-position:center center;}
  .hero-content{padding:48px 0;}
  .hero h1{font-size:clamp(2.35rem,12vw,3.35rem);}
  .feature{min-height:330px;}
  .lounge-image{aspect-ratio:4/3;background-size:cover;background-position:center center;}
}


/* v7: truly responsive images on phones.
   On narrow screens hero/region/lounge use real <img> elements instead of
   CSS background cover, so the complete image keeps its natural ratio. */
.mobile-section-image{display:none;width:100%;height:auto!important;max-width:none;}

@media (max-width:700px){
  /* Room photos: preserve original ratio without fixed crop or stretch. */
  .room-card,.room-image-link{width:100%;}
  .room-image-link{overflow:visible;}
  .room-image-link img{
    display:block;
    width:100%!important;
    max-width:100%!important;
    height:auto!important;
    aspect-ratio:auto!important;
    object-fit:contain!important;
    object-position:center!important;
  }

  /* Hero: show the full photo first, then readable content below it. */
  .hero{
    display:block;
    min-height:0!important;
    background-image:none!important;
    background:var(--dark)!important;
    color:#fff;
  }
  .hero:before{display:none;}
  .hero .hero-mobile-image{display:block;position:relative;inset:auto;}
  .hero-content{
    padding:34px 0 42px!important;
    max-width:none;
  }
  .hero h1{font-size:clamp(2.15rem,10vw,3.1rem);}
  .hero .lead{font-size:1.05rem;}

  /* Region: same principle — no cover-cropping on mobile. */
  .feature{
    display:block;
    min-height:0!important;
    background-image:none!important;
    background:var(--brown)!important;
  }
  .feature:before{display:none;}
  .feature .region-mobile-image{display:block;}
  .feature-copy{
    padding:34px 0 42px;
    max-width:none;
  }
  .feature h2{font-size:clamp(2.15rem,10vw,3rem);}

  /* Lounge: image takes its natural height, never a forced aspect ratio. */
  .lounge{display:block;min-height:0;}
  .lounge-image{
    min-height:0!important;
    aspect-ratio:auto!important;
    background-image:none!important;
  }
  .lounge-image .lounge-mobile-image{display:block;}
  .lounge-copy{padding:40px 22px;}

  /* Prevent any inherited fixed dimensions from WordPress/editor markup. */
  .hero img,.feature img,.lounge img,.rooms img{
    width:100%!important;
    height:auto!important;
    max-height:none!important;
  }
}


/* v8: responsive images inside accommodation/detail pages (Fricktal, Jura, Alpen).
   WordPress and accommodation plugins often add width/height/aspect-ratio styles;
   on phones we explicitly release those dimensions so images cannot be stretched. */
@media (max-width:700px){
  .content-area,
  .content-area article,
  .content-area .entry-content,
  .content-area .post-content,
  .content-area .wp-block-post-content{
    max-width:100%;
    overflow-x:hidden;
  }

  .content-area figure,
  .content-area .wp-block-image,
  .content-area .wp-block-gallery,
  .content-area .blocks-gallery-grid,
  .content-area .blocks-gallery-item,
  .content-area .gallery,
  .content-area .gallery-item,
  .content-area .wp-block-media-text__media,
  .content-area [class*="image"],
  .content-area [class*="gallery"] figure{
    height:auto!important;
    min-height:0!important;
    max-height:none!important;
    aspect-ratio:auto!important;
  }

  .content-area img,
  .content-area figure img,
  .content-area .wp-block-image img,
  .content-area .wp-block-gallery img,
  .content-area .blocks-gallery-item img,
  .content-area .gallery img,
  .content-area .wp-block-media-text img,
  .content-area img.wp-post-image,
  .content-area img[class*="attachment-"],
  .content-area img[class*="wp-image-"]{
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    height:auto!important;
    min-height:0!important;
    max-height:none!important;
    aspect-ratio:auto!important;
    object-fit:contain!important;
    object-position:center center!important;
  }

  /* Native galleries: each picture may use its own natural ratio on mobile. */
  .content-area .wp-block-gallery.has-nested-images,
  .content-area .blocks-gallery-grid,
  .content-area .gallery{
    align-items:start!important;
  }
  .content-area .wp-block-gallery.has-nested-images figure.wp-block-image,
  .content-area .blocks-gallery-item,
  .content-area .gallery-item{
    overflow:visible!important;
  }

  /* Media/Text blocks are stacked so the image never gets squeezed beside text. */
  .content-area .wp-block-media-text{
    display:block!important;
  }
  .content-area .wp-block-media-text__content{
    padding-left:0!important;
    padding-right:0!important;
  }
}

.lounge-video-link{display:inline-block;margin-top:8px;font-weight:700;color:var(--brown);text-decoration:underline;text-underline-offset:3px;}
.lounge-video-link:hover{color:var(--red);}

/* v12: only the Alpen thumbnail on the home page is normalized to the
   same visual 4:3 size as the two neighbouring room thumbnails. */
.room-card-alpen .room-image-link{
  display:block;
  aspect-ratio:4/3;
  overflow:hidden;
}
.room-card-alpen .room-image-link img{
  width:100%!important;
  height:100%!important;
  aspect-ratio:4/3!important;
  object-fit:cover!important;
  object-position:center center!important;
}

/* v13: Anfahrt section at the end of the home page. */
.directions{background:#f6f2ed;padding:72px 0;}
.directions-inner{display:grid;grid-template-columns:minmax(280px,.8fr) minmax(420px,1.2fr);gap:56px;align-items:center;}
.directions-copy h2{margin:5px 0 24px;color:var(--brown);}
.directions-copy h3{margin:0 0 8px;color:var(--brown);}
.directions-copy p{line-height:1.65;margin:0 0 18px;}
.directions-btn{margin-top:8px;}
.directions-map{min-height:390px;overflow:hidden;border-radius:2px;box-shadow:0 10px 30px rgba(66,41,24,.12);}
.directions-map iframe{display:block;width:100%;height:390px;}
@media (max-width:780px){
  .directions{padding:48px 0;}
  .directions-inner{grid-template-columns:1fr;gap:30px;}
  .directions-map{min-height:300px;}
  .directions-map iframe{height:300px;}
}

/* v14: Review and social links */
.review-links{padding:56px 0;background:#f7f4ef;text-align:center}.review-links h2{font-size:2.1rem;margin:0 0 10px}.review-links-intro{margin:0 0 28px;color:#555}.review-link-grid{display:flex;justify-content:center;flex-wrap:wrap;gap:18px}.review-link{width:118px;min-height:104px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:9px;padding:14px 10px;border:1px solid #ddd4cc;background:#fff;color:var(--brown);transition:transform .18s ease,box-shadow .18s ease}.review-link:hover,.review-link:focus{transform:translateY(-2px);box-shadow:0 7px 18px #0001}.review-icon{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;background:var(--beige);color:#fff;font-weight:700;font-size:1rem}.review-link span:last-child{font-size:.8rem;font-weight:700;letter-spacing:.03em}.review-icon svg{width:23px;height:23px;fill:currentColor}@media(max-width:560px){.review-links{padding:42px 0}.review-link-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));max-width:300px;margin:auto}.review-link{width:100%}}


/* v22: branded breakfast icon, red heart, and footer imprint link. */
.amenity-cup{height:34px;display:flex!important;align-items:center;justify-content:center;margin-bottom:4px;color:inherit!important}
.amenity-cup img{width:auto!important;height:34px!important;max-width:54px!important;object-fit:contain!important}
.amenity-heart{color:var(--red)!important}
.footer-links{display:flex;align-items:center}
.footer-links a{text-decoration:underline;text-underline-offset:3px}
@media(max-width:560px){.footer-links{align-items:flex-start}}

/* v23: Culminarium colour mix based on v22.
   Brand green is used for active buttons and amenity icons;
   the calmer olive tones elsewhere remain unchanged. */
.amenities{background:#422918!important;}
.amenity strong{color:#ACCA40!important;}
.amenity-heart{color:#E30513!important;}
.amenity-cup{height:34px;display:flex!important;align-items:center;justify-content:center;margin-bottom:4px;color:inherit!important;}
.amenity-cup img{width:auto!important;height:34px!important;max-width:48px!important;object-fit:contain!important;background:transparent!important;}
.book-btn,.btn{background:#ACCA40;color:#422918;border-color:#ACCA40;}
.book-btn:hover,.book-btn:focus,.btn:hover,.btn:focus{background:#879b57;color:#fff;border-color:#879b57;}
.btn.light{background:#ACCA40;color:#422918;border-color:#ACCA40;}