/* Shared Maison Miel site chrome: identical header + footer on every page */
.main-header{
  position:fixed!important;
  z-index:120!important;
  top:14px!important;
  left:clamp(22px,3vw,50px)!important;
  right:clamp(22px,3vw,50px)!important;
  height:96px!important;
  padding:0 24px 0 30px!important;
  border-radius:27px!important;
  display:flex!important;
  align-items:center!important;
  gap:22px!important;
  background:rgba(255,250,240,.94)!important;
  border:1px solid rgba(207,143,17,.20)!important;
  box-shadow:0 13px 34px rgba(86,54,0,.10),inset 0 1px 0 rgba(255,255,255,.78)!important;
  -webkit-backdrop-filter:blur(18px) saturate(1.08)!important;
  backdrop-filter:blur(18px) saturate(1.08)!important;
  transition:top .35s cubic-bezier(.2,.7,.2,1),height .35s cubic-bezier(.2,.7,.2,1),left .35s ease,right .35s ease,box-shadow .35s ease,background .35s ease!important;
}
.main-header::before{display:none!important}
.main-header.is-scrolled{
  top:10px!important;
  height:76px!important;
  left:clamp(14px,2vw,34px)!important;
  right:clamp(14px,2vw,34px)!important;
  background:rgba(255,250,240,.97)!important;
  box-shadow:0 14px 38px rgba(76,47,0,.15),inset 0 1px 0 rgba(255,255,255,.9)!important;
}
.brand,.main-header.is-scrolled .brand{
  flex:0 0 auto!important;
  width:auto!important;
  height:82px!important;
  display:flex!important;
  align-items:center!important;
}
.brand img{
  display:block!important;
  width:auto!important;
  height:78px!important;
  max-width:190px!important;
  object-fit:contain!important;
}
.nav{
  flex:1 1 auto!important;
  display:flex!important;
  justify-content:center!important;
  align-items:center!important;
  gap:clamp(22px,2.45vw,44px)!important;
  font-family:Baskerville,"Baskerville Old Face",Georgia,"Times New Roman",serif!important;
}
.nav a{
  position:relative!important;
  padding:14px 3px!important;
  white-space:nowrap!important;
  font-size:clamp(16px,1.05vw,18px)!important;
  font-weight:600!important;
  line-height:1!important;
  color:#302517!important;
  text-decoration:none!important;
}
.nav a::after{
  content:""!important;
  position:absolute!important;
  left:50%!important;
  bottom:7px!important;
  width:0!important;
  height:2px!important;
  transform:translateX(-50%)!important;
  background:#d9940b!important;
}
.header-actions{
  flex:0 0 auto!important;
  display:flex!important;
  align-items:center!important;
  gap:5px!important;
}
.icon-btn{
  position:relative!important;
  width:42px!important;
  height:42px!important;
  border:0!important;
  border-radius:50%!important;
  display:grid!important;
  place-items:center!important;
  color:#261d13!important;
  background:transparent!important;
  text-decoration:none!important;
}
.icon-btn svg{width:25px!important;height:25px!important;display:block!important}
.main-header.is-scrolled .icon-btn{width:38px!important;height:38px!important}
.cart-badge{
  position:absolute!important;
  top:0!important;
  right:-1px!important;
  min-width:20px!important;
  height:20px!important;
  padding:0 5px!important;
  border-radius:99px!important;
  display:grid!important;
  place-items:center!important;
  background:#efad0c!important;
  color:#17120a!important;
  font-family:Arial,sans-serif!important;
  font-size:11px!important;
  font-weight:700!important;
  line-height:1!important;
}
.mobile-nav-toggle{display:none!important}

/* inner pages reserve exactly one header-height band; homepage hero already accounts for its own composition */
body.inner-site-page main{padding-top:118px!important}

/* identical footer presentation everywhere */
.footer-boundary-fade{
  position:relative!important;
  z-index:29!important;
  width:100%!important;
  height:28px!important;
  margin-top:-28px!important;
  pointer-events:none!important;
  background:linear-gradient(to bottom,
    rgba(255,250,240,0) 0%,
    rgba(255,250,240,.14) 26%,
    rgba(255,250,240,.38) 52%,
    rgba(255,247,232,.72) 78%,
    #fff6e6 100%)!important;
}
/* Continue the fade a short distance INSIDE the footer, while keeping honey and flowers fully visible above it. */
.footerref-page::before{
  content:""!important;
  display:block!important;
  position:absolute!important;
  z-index:30!important;
  left:0!important;
  right:0!important;
  top:0!important;
  height:26px!important;
  pointer-events:none!important;
  background:linear-gradient(to bottom,
    #fff6e6 0%,
    rgba(255,247,232,.78) 34%,
    rgba(255,250,240,.34) 68%,
    rgba(255,250,240,0) 100%)!important;
}
.footer-reference{
  position:relative!important;
  margin-top:0!important;
  isolation:isolate!important;
  overflow:visible!important;
  background:#fff6e6!important;
}

.footerref-left-wave{z-index:42!important}
.footerref-honey{z-index:50!important;opacity:1!important}
.footerref-flowers{z-index:45!important}
.footerref-newsletter,.footerref-footer,.footerref-footer-rule,.footerref-copyright{z-index:55!important}
.footerref-brand{width:290px!important;justify-content:center!important}
.footerref-brand-logo{display:block!important;width:100%!important;height:auto!important;object-fit:contain!important}
.footerref-newsletter h2{
  margin:0!important;
  font-family:Baskerville,"Baskerville Old Face",Georgia,serif!important;
  font-size:58px!important;
  line-height:1.03!important;
  letter-spacing:-.045em!important;
  font-weight:400!important;
  color:#191613!important;
}

@media(max-width:1100px){
  .main-header{left:18px!important;right:18px!important;padding-left:22px!important;padding-right:17px!important}
  .brand,.main-header.is-scrolled .brand{height:70px!important}
  .brand img{height:66px!important;max-width:160px!important}
  .nav{gap:20px!important}.nav a{font-size:15px!important}
  .footerref-brand{width:255px!important}
  .footerref-newsletter h2{font-size:46px!important}
}
@media(max-width:820px){
  .main-header,.main-header.is-scrolled{
    top:8px!important;left:8px!important;right:8px!important;height:64px!important;
    padding:0 8px 0 12px!important;border-radius:20px!important;gap:4px!important;
  }
  .brand,.main-header.is-scrolled .brand{height:58px!important;flex:0 0 auto!important}
  .brand img{height:54px!important;max-width:124px!important}
  .mobile-nav-toggle{
    flex:0 0 auto!important;order:2!important;width:34px!important;height:34px!important;padding:0!important;border:0!important;border-radius:50%!important;background:transparent!important;
    display:flex!important;flex-direction:column!important;justify-content:center!important;align-items:center!important;gap:4px!important;cursor:pointer!important;margin-left:auto!important;
  }
  .mobile-nav-toggle span{width:17px!important;height:1.5px!important;border-radius:99px!important;background:#271e14!important}
  .mobile-nav-toggle[aria-expanded="true"] span:nth-child(1){transform:translateY(5.5px) rotate(45deg)!important}
  .mobile-nav-toggle[aria-expanded="true"] span:nth-child(2){opacity:0!important}
  .mobile-nav-toggle[aria-expanded="true"] span:nth-child(3){transform:translateY(-5.5px) rotate(-45deg)!important}
  .nav{
    position:absolute!important;z-index:140!important;top:calc(100% + 7px)!important;left:0!important;right:0!important;margin:0!important;padding:7px!important;
    flex-direction:column!important;align-items:stretch!important;gap:0!important;border:1px solid rgba(215,161,53,.18)!important;border-radius:15px!important;background:rgba(255,249,238,.985)!important;
    box-shadow:0 18px 40px rgba(91,57,6,.13)!important;opacity:0!important;transform:translateY(-7px)!important;pointer-events:none!important;
  }
  .nav.is-open{opacity:1!important;transform:none!important;pointer-events:auto!important}
  .nav a{width:100%!important;padding:12px 14px!important;text-align:left!important;font-size:16px!important}
  .nav a::after{display:none!important}
  .header-actions{order:3!important;margin-left:0!important;gap:1px!important}
  .header-actions .icon-btn[aria-label="Konto"]{display:none!important}
  .icon-btn{width:34px!important;height:34px!important}.icon-btn svg{width:20px!important;height:20px!important}
  .cart-badge{min-width:17px!important;height:17px!important;font-size:9px!important}
  body.inner-site-page main{padding-top:80px!important}
  .footerref-brand{width:235px!important}
  .footerref-newsletter h2{font-size:36px!important}
}
@media(max-width:430px){
  .main-header,.main-header.is-scrolled{height:60px!important}
  .brand,.main-header.is-scrolled .brand{height:52px!important}
  .brand img{height:48px!important;max-width:112px!important}
  .header-actions .icon-btn[aria-label="Suche"]{display:grid!important}
  body.inner-site-page main{padding-top:74px!important}
  .footerref-brand{width:215px!important}
}
