/* ============================================================
   HolzAder – Kontakt-Icons im Header (Mobile-Popover + Desktop-Utility-Leiste)
   Eigenständiges Modul im uncode-child. Kein React, keine externen Fonts.
   Palette aus dem freigegebenen Claude-Design.
   ============================================================ */
:root{
  --hz-accent:#d97441;
  --hz-accent-dark:#b85d30;
  --hz-brown:#8a6e3b;
  --hz-bar:#3a2e22;
  --hz-ink:#2a2520;
  --hz-paper:#ffffff;
  --hz-soft:#f3ede1;
  --hz-rule:#e7e3da;
}

/* --- alten Klartext-CTA (Nummern als Text in der Nav) ausblenden --- */
.navbar-cta{ display:none !important; }

/* ============================================================
   DESKTOP – Utility-Leiste ganz oben
   ============================================================ */
.hz-utilbar{
  display:none;               /* mobil aus, ab Breakpoint an */
  background:var(--hz-bar);
  color:#fff;
  font-family:inherit;
  font-size:13px;
  line-height:1;
}
.hz-utilbar-inner{
  max-width:1200px;
  margin:0 auto;
  padding:9px 24px;
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:18px;
}
.hz-util-item{
  display:inline-flex;
  align-items:center;
  gap:7px;
  color:#fff;
  text-decoration:none;
  background:transparent;
  border:0;
  padding:4px 2px;
  cursor:pointer;
  font:inherit;
  white-space:nowrap;
}
.hz-util-item svg{ opacity:.7; flex:0 0 auto; }
.hz-util-item .hz-mut{ color:rgba(255,255,255,.6); }
.hz-util-item b{ font-weight:600; }
.hz-util-item:hover{ color:#fff; }
.hz-util-item:hover svg{ opacity:1; }
.hz-util-item .hz-chev{ opacity:.5; }
.hz-sep{ width:1px; height:14px; background:rgba(255,255,255,.2); }

@media (min-width:960px){
  .hz-utilbar{ display:block; }
}

/* ============================================================
   MOBILE – Icon-Buttons im Header (in .mobile-additional-icons)
   ============================================================ */
.mobile-additional-icons{ display:flex; align-items:center; gap:8px; }
.hz-mobicons{ display:flex; align-items:center; gap:8px; }
.hz-icon-btn{
  width:36px; height:36px;
  border-radius:7px;
  background:var(--hz-accent);
  color:#fff;
  border:0; padding:0; margin:0;
  display:inline-flex; align-items:center; justify-content:center;
  cursor:pointer;
  box-shadow:0 1px 0 rgba(0,0,0,.08);
  -webkit-tap-highlight-color:transparent;
}
.hz-icon-btn:active,
.hz-icon-btn[aria-expanded="true"]{ background:var(--hz-accent-dark); }
.hz-icon-btn svg{ display:block; }

/* Icons nur im mobilen Header zeigen (Desktop nutzt die Leiste) */
@media (min-width:960px){
  .hz-mobicons{ display:none; }
}

/* ============================================================
   POPOVER (geteilt von Mobile + Desktop)
   ============================================================ */
.hz-pop-scrim{ position:fixed; inset:0; z-index:99998; background:transparent; }
.hz-pop{
  position:fixed;
  z-index:99999;
  background:var(--hz-paper);
  color:var(--hz-ink);
  border-radius:12px;
  box-shadow:0 12px 32px rgba(40,25,10,.22), 0 0 0 1px rgba(0,0,0,.04);
  width:250px;
  font-family:inherit;
  overflow:visible;
  animation:hzpop .15s ease-out;
}
@keyframes hzpop{ from{ transform:translateY(-4px) scale(.97); opacity:0 } to{ transform:none; opacity:1 } }
.hz-pop-arrow{
  position:absolute; top:-6px; width:12px; height:12px;
  background:var(--hz-paper); transform:rotate(45deg);
  box-shadow:-1px -1px 0 rgba(0,0,0,.04); border-radius:2px;
}
.hz-pop-title{
  font-size:10px; font-weight:600; letter-spacing:1px;
  text-transform:uppercase; color:rgba(42,37,32,.5);
  padding:12px 14px 4px;
}
.hz-pop-list{ border-radius:12px; overflow:hidden; }
.hz-row{
  display:flex; align-items:center; gap:10px;
  padding:10px 12px;
  text-decoration:none; color:var(--hz-ink);
}
.hz-row + .hz-row{ border-top:1px solid var(--hz-rule); }
.hz-avatar{
  width:32px; height:32px; border-radius:50%; flex:0 0 auto;
  background:var(--hz-soft); color:var(--hz-accent);
  display:flex; align-items:center; justify-content:center;
  font-size:12px; font-weight:700; letter-spacing:.2px;
}
.hz-row-main{ flex:1 1 auto; min-width:0; }
.hz-row-name{ display:block; font-size:13px; font-weight:600; line-height:1.25; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.hz-row-sub{ display:block; font-size:11.5px; color:rgba(42,37,32,.6); line-height:1.3; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.hz-callbtn{
  width:28px; height:28px; border-radius:50%; flex:0 0 auto;
  background:var(--hz-accent); color:#fff;
  display:flex; align-items:center; justify-content:center;
  box-shadow:0 1px 0 rgba(0,0,0,.06);
}
/* Öffnungszeiten-Popover */
.hz-hours{ padding:8px 4px 8px; }
.hz-hours .hz-pop-title{ padding:4px 12px 8px; }
.hz-hrow{
  display:flex; justify-content:space-between; gap:14px;
  padding:6px 12px; font-size:12.5px;
}
.hz-hrow .hz-d{ color:var(--hz-ink); font-weight:500; white-space:nowrap; }
.hz-hrow .hz-h{ color:rgba(42,37,32,.7); text-align:right; }
.hz-hrow.hz-closed .hz-h{ color:rgba(42,37,32,.4); }
.hz-hours-foot{
  padding:8px 12px 4px; margin-top:2px;
  border-top:1px solid var(--hz-rule);
  font-size:11px; color:rgba(42,37,32,.6); line-height:1.4;
}

/* ============================================================
   Startseite: den automatisch erzeugten "Startseite"-Titel entfernen.
   Der Slider wird als Vollbild-Hero hochgezogen, dadurch bleibt der
   Content-Bereich leer und Uncode rendert nur den Seitentitel in einer
   Zeile mit großem Padding -> wirkt verloren. Nur auf der Startseite.
   ============================================================ */
.home .post-title-wrapper{ display:none !important; }
.home .post-body .row-container > .row.row-parent{
  padding-top:0 !important; padding-bottom:0 !important;
}

/* ============================================================
   Startseite-Slider: wie das ORIGINAL von holzader.at (Kundenwunsch 2026-08-31 —
   „das hat ihnen gefallen"). Vollbild-Hero, background-size:cover, Ken Burns (Schwenk zeigt
   das ganze Motiv über die Zeit), Parallax — alles im Shortcode wie in der Produktion; hier
   nur mit Barbaras neuen Titelbildern (Attach 412–415). KEINE contain-/Vorschnitt-Tricks mehr.
   Höhe = 100vh − 137px (Utility-Leiste 40 + Nav 97), damit der Hero — wie im Original — den
   Schirm füllt und die 5 Slider-Punkte OHNE Scrollen sichtbar sind (Footer knapp darunter).
   Der weiße Sticky-Footer-Balken wird durch display:block auf .home verhindert (Uncode nutzt
   ein CSS-Table-Sticky-Footer, .box-container=display:table/height:100vh — mit der zusätzlichen
   40px-Utility-Leiste außerhalb der Tabelle streckt das sonst den Inhalt). Nur Desktop; mobil
   bleibt Uncodes native Slider-Höhe (dort keine 40px-Leiste).
   ============================================================ */
@media (min-width:960px){
  .home .box-wrapper, .home .box-container,
  .home .main-wrapper, .home article#post-2{
    display:block !important; height:auto !important; min-height:0 !important;
  }
  .home .row-slider.row-header,
  .home .row-slider .owl-height-forced,
  .home .row-slider .owl-height-forced .owl-stage-outer,
  .home .row-slider .owl-height-forced .owl-stage,
  .home .row-slider .owl-height-forced .owl-item,
  .home .row-slider .owl-item > .row-internal,
  .home .row-slider .owl-item > .row-internal > .row-child{
    height:calc(100vh - 137px) !important;
    min-height:0 !important;
    max-height:none !important;
  }
}
