/* Wissensbereich & Zero2Five – openbrain.at */

.z5 { color:#1d1f24; font-size:16px; line-height:1.7; }
.z5 h3 { font-weight:600; margin:28px 0 10px; font-size:20px; }
.z5 p { margin:0 0 14px; } .z5 ul, .z5 ol { margin:0 0 16px; padding-left:22px; } .z5 li { margin-bottom:6px; }
.z5-lead { font-size:20px; line-height:1.55; font-weight:400; margin-bottom:24px !important; }
.z5-small { font-size:13px; color:#6b7280; }
.z5-duo { display:grid; grid-template-columns:1fr 1fr; gap:18px; margin:8px 0 22px; }
.z5-card { border:1px solid #e3e4e8; border-top:4px solid #e42869; border-radius:6px; padding:18px 20px 6px; background:#fff; }
.z5-card-b { border-top-color:#f08aa9; background:#fff7fa; }
.z5-card h3 { margin:2px 0 8px; font-size:18px; }
.z5-kicker { font-size:11px; font-weight:600; letter-spacing:.14em; text-transform:uppercase; color:#e42869; }
.z5-trio { display:grid; gap:12px; margin-top:8px; }
.z5-claim { display:flex; gap:16px; align-items:flex-start; background:#f6f6f8; border-radius:6px; padding:14px 18px 2px; }
.z5-claim span { flex:none; width:32px; height:32px; border-radius:50%; background:#1d1f24; color:#fff; font-weight:600; line-height:32px; text-align:center; }
.z5-claim p { margin:0 0 10px; }
.z5-fig { margin:14px 0 26px; } .z5-svg { width:100%; height:auto; display:block; }
.z5-fig figcaption { font-size:13px; color:#8a909c; margin-top:6px; }
.z5-tablewrap { overflow-x:auto; margin:8px 0 24px; }
table.z5-table { width:100%; border-collapse:collapse; font-size:14.5px; line-height:1.5; min-width:560px; }
.z5-table th { text-align:left; font-size:12px; font-weight:600; letter-spacing:.05em; text-transform:uppercase; color:#fff; background:#1d1f24; padding:10px 14px; }
.z5-table td { padding:10px 14px; border-bottom:1px solid #e3e4e8; vertical-align:top; }
.z5-table tbody tr:nth-child(even) td { background:#fafafb; }
.z5-table td:first-child { color:#e42869; white-space:nowrap; }
.z5-lvl { display:flex; gap:18px; border:1px solid #e3e4e8; border-radius:6px; padding:16px 20px 4px; margin:0 0 14px; background:#fff; }
.z5-badge { flex:none; width:44px; height:44px; border-radius:50%; font-weight:700; font-size:15px; line-height:44px; text-align:center; color:#fff; background:#e42869; }
.z5-tone-g .z5-badge { background:#9aa0ab; } .z5-tone-m .z5-badge { background:#f07a9f; }
.z5-tone-t .z5-badge { background:#fff; color:#e42869; border:2px solid #e42869; line-height:40px; }
.z5-lvl-body { flex:1; min-width:0; } .z5-lvl h3 { margin:2px 0 6px; font-size:18px; }
.z5-impl { font-size:14px; color:#4b5260; background:#f6f6f8; border-radius:4px; padding:8px 12px; }
.z5-impl span { font-size:11px; font-weight:600; letter-spacing:.12em; text-transform:uppercase; color:#e42869; margin-right:8px; }
blockquote.z5-quote { margin:18px 0; padding:18px 24px; border-left:4px solid #e42869; background:#fff4f8; font-size:18px; font-weight:500; line-height:1.5; }
.z5-checks { display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-bottom:14px; }
.z5-check { border:1px solid #e3e4e8; border-radius:6px; padding:14px 16px 4px; }
.z5-check ul { list-style:none; padding:0; margin:0; }
.z5-check li { position:relative; padding-left:24px; font-size:14.5px; }
.z5-check li::before { content:""; position:absolute; left:0; top:6px; width:12px; height:12px; border:1.5px solid #e42869; border-radius:2px; }
.z5-toc { display:grid; grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); gap:6px 28px; list-style:none; padding:0 !important; margin:0; counter-reset:z; }
.z5-toc li { counter-increment:z; margin:0; border-bottom:1px solid #e3e4e8; }
.z5-toc a { display:block; padding:8px 0; color:#1d1f24; font-size:15px; }
.z5-toc a::before { content:counter(z,decimal-leading-zero); color:#e42869; font-weight:600; margin-right:12px; }
.z5-toc a:hover { color:#e42869; }
.z5-author { border-top:4px solid #e42869; background:#f6f6f8; padding:22px 26px 8px; border-radius:6px; }
@media (max-width:767px){ .z5-duo,.z5-checks{grid-template-columns:1fr;} .z5-lvl{flex-direction:column;gap:8px;} .z5-lead{font-size:18px;} }

/* ---- Wissensbereich ---- */
.wk { max-width:880px; float:none !important; margin:0 auto; }
.wk h2 { font-weight:600; font-size:28px; margin:44px 0 14px; line-height:1.25; }
.wk h3 { font-size:20px; }
.wk-meta { font-size:14px; color:#6b7280; margin:-4px 0 22px; }
.wk-meta strong { color:#1d1f24; font-weight:600; }
.wk-pill { display:inline-block; font-size:12px; font-weight:600; letter-spacing:.06em; text-transform:uppercase; color:#e42869; background:#fdecf2; border-radius:999px; padding:3px 12px; margin-right:6px; }
.wk-answer { border-left:4px solid #e42869; background:#fff7fa; border-radius:0 6px 6px 0; padding:18px 24px 6px; margin:8px 0 26px; }
.wk-answer .z5-kicker { display:block; margin-bottom:6px; }
.wk-answer p { font-size:18px; line-height:1.6; }
.wk pre { background:#1d1f24; color:#f1f2f4; border-radius:6px; padding:16px 20px; overflow-x:auto; font-size:13px; line-height:1.55; margin:12px 0 22px; }
.wk code { font-size:.92em; }
.wk-faq h3 { margin:22px 0 6px; font-size:18px; }
.wk-src { font-size:14.5px; } .wk-src li { margin-bottom:8px; }
.wk-author { display:flex; gap:18px; align-items:flex-start; border-top:4px solid #e42869; background:#f6f6f8; border-radius:6px; padding:20px 24px 8px; margin:40px 0 24px; }
.wk-avatar { flex:none; width:56px; height:56px; border-radius:50%; background:#e42869; color:#fff; font-weight:700; font-size:18px; line-height:56px; text-align:center; }
.wk-author p { margin:0 0 10px; }
.wk-related { display:grid; grid-template-columns:repeat(auto-fill,minmax(250px,1fr)); gap:14px; margin:10px 0 30px; }
.wk-related a { display:block; border:1px solid #e3e4e8; border-radius:6px; padding:14px 18px; color:#1d1f24; transition:border-color .2s, box-shadow .2s; }
.wk-related a:hover { border-color:#e42869; box-shadow:0 4px 14px rgba(228,40,105,.12); }
.wk-related b { display:block; color:#e42869; margin-bottom:4px; font-weight:600; }
.wk-related span { font-size:14px; color:#5d6470; line-height:1.5; display:block; }
.wk a:not(.btn) { color:#e42869; }
.wk .wk-related a, .wk .z5-toc a { color:#1d1f24; }
.wk-team { display:grid; grid-template-columns:1fr 1fr; gap:18px; margin:14px 0 26px; }
.wk-team > div { border:1px solid #e3e4e8; border-top:4px solid #e42869; border-radius:6px; padding:22px 24px 8px; }
.wk-team h3 { margin:0 0 2px; font-size:20px; } .wk-team .role { color:#e42869; font-weight:600; font-size:14px; margin-bottom:12px; display:block; }
.wk-gl dt { font-weight:600; margin-top:18px; font-size:17px; } .wk-gl dd { margin:4px 0 0; }
@media (max-width:767px){ .wk-team{grid-template-columns:1fr;} .wk h2{font-size:24px;} .wk-author{flex-direction:column;gap:10px;} }

/* Mobile: lange Wörter in Überschriften */
@media (max-width:767px){
  .dark-bg .title h1 { font-size:30px; line-height:1.2; overflow-wrap:anywhere; hyphens:auto; }
  .wk, .wk h2, .wk li, .wk p { overflow-wrap:break-word; }
}

/* ==== as-h4 begin: Überschriften-Hierarchie (h3/h4 statt h4/h5), Optik unverändert ==== */
:is(h2,h3).as-h4,:is(h2,h3).as-h5{
  font-family: 'Poppins', sans-serif;
  color: #1f1f1f;
  line-height: 1.3;
}
:is(h2,h3).as-h4{
  font-weight: 700;
}
:is(h2,h3).as-h5{
  font-weight: 600;
}
blockquote :is(h2,h3).as-h4,blockquote :is(h2,h3).as-h5{
  line-height: inherit;
}
.title > :is(h2,h3).as-h4{
  font-weight: 400;
  font-size: 18px;
  font-family: 'Source Sans Pro', sans-serif;
  color: #787878;
}
.title > :is(h2,h3).as-h4.upper{
  font-size: 14px;
  letter-spacing: 0.1em;
}
.title > :is(h2,h3).as-h4.font-xl{
  font-size: 66px;
}
.dark-bg :is(h2,h3).as-h4,.parallax-section:not(.text-dark) :is(h2,h3).as-h4,.gradient-bg :is(h2,h3).as-h4,.colored-bg :is(h2,h3).as-h4,.dark-bg :is(h2,h3).as-h5,.parallax-section:not(.text-dark) :is(h2,h3).as-h5,.gradient-bg :is(h2,h3).as-h5,.colored-bg :is(h2,h3).as-h5{
  color: inherit;
}
.dark-bg .accordion > li.active .accordion-title :is(h2,h3).as-h4,.parallax-section:not(.text-dark) .accordion > li.active .accordion-title :is(h2,h3).as-h4,.gradient-bg .accordion > li.active .accordion-title :is(h2,h3).as-h4,.colored-bg .accordion > li.active .accordion-title :is(h2,h3).as-h4{
  color: #1f1f1f;
}
.testimonials-slider .testimonial-comment > :is(h2,h3).as-h4{
  margin-top: 25px;
  margin-bottom: 10px;
  font-size: 24px;
  letter-spacing: -0.03em;
}
.accordion > li.active .accordion-title :is(h2,h3).as-h4{
  color: #e42869;
}
.accordion.dark-skin > li.active .accordion-title :is(h2,h3).as-h4{
  color: #1f1f1f;
}
.accordion.dark-blue-skin > li.active .accordion-title :is(h2,h3).as-h4{
  color: #007aff;
}
.accordion-title :is(h2,h3).as-h4{
  margin: 0;
  font-weight: 500;
  font-size: 14px;
  -webkit-transition: all .3s ease;
  transition: all .3s ease;
}
.menu-list.serif-font :is(h2,h3).as-h4{
  font-family: 'Lora', sans-serif;
  font-weight: 400;
  text-transform: none;
  font-size: 15px;
  letter-spacing: 0;
}
.menu-list > li :is(h2,h3).as-h4{
  margin: 0;
  text-transform: uppercase;
  font-size: 12px;
  letter-spacing: 0.05em;
  position: relative;
  font-weight: 600;
}
.menu-list > li :is(h2,h3).as-h4:after{
  content: "";
  position: absolute;
  left: 0;
  width: 100%;
  bottom: 2px;
  z-index: -1;
}
.image-box .image-overlay :is(h2,h3).as-h4,.image-box .image-overlay :is(h2,h3).as-h5{
  color: inherit;
}
.job-info :is(h2,h3).as-h5{
  font-size: 11px;
  color: #787878;
  letter-spacing: 0.05em;
  font-weight: 500;
}
.inline-icon-btn > :is(h2,h3).as-h5{
  display: inline-block;
  text-transform: uppercase;
  font-size: 12px;
  letter-spacing: 0.075em;
  margin: 0 10px;
  font-family: 'Poppins', sans-serif;
  font-weight: 500;
  vertical-align: middle;
}
.slide-content :is(h2,h3).as-h4{
  font-weight: 400;
  font-size: 18px;
}
.slide-content :is(h2,h3).as-h4.upper{
  letter-spacing: 0.075em;
  font-size: 13px;
  font-weight: 500;
}
@media only screen and (min-width: 768px) and (max-width: 991px){.slide-content :is(h2,h3).as-h4{
    font-size: 16px;
  }}
@media only screen and (max-width: 767px){.slide-content :is(h2,h3).as-h4{
    font-size: 16px;
  }}
.slide-content :is(h2,h3).as-h4,.slide-content :is(h2,h3).as-h5{
  color: inherit;
}
.icon-box :is(h2,h3).as-h4{
  font-size: 14px;
  font-weight: 600;
  margin-top: 0;
}
.icon-box :is(h2,h3).as-h4.upper{
  font-size: 13px;
  letter-spacing: 0.1em;
}
.icon-box :is(h2,h3).as-h4.serif-font{
  font-size: 16px;
}
.icon-box-side :is(h2,h3).as-h4{
  font-size: 14px;
  font-weight: 600;
  margin-top: 0;
}
.icon-box-side :is(h2,h3).as-h4.serif-font{
  font-size: 16px;
}
.counter-icon + .counter-content > :is(h2,h3).as-h5{
  margin: 20px 0 10px;
}
.counter-content > :is(h2,h3).as-h5{
  font-size: 45px;
  margin-top: 0;
}
.number-box > :is(h2,h3).as-h4{
  font-size: 13px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.07em;
}
.icon-box-simple :is(h2,h3).as-h4{
  font-size: 12px;
  font-weight: 500;
  margin: 0;
  padding-left: 10px;
  padding-right: 10px;
}
.text-box :is(h2,h3).as-h4{
  font-size: 14px;
  font-weight: 600;
}
.footer-widgets .widget > :is(h2,h3).as-h5{
  text-transform: uppercase;
  font-size: 12px;
  letter-spacing: 0.05em;
  margin-bottom: 20px;
  font-weight: 600;
}
@media only screen and (max-width: 991px){.footer-widgets .widget > :is(h2,h3).as-h5{
    margin-bottom: 10px;
  }}
#footer.dark-footer .footer-widgets .widget > :is(h2,h3).as-h5{
  color: #fff;
}
.team-overlay .team-info > :is(h2,h3).as-h4{
  color: #fff;
  margin-bottom: 0;
  font-size: 13px;
}
.team-info > :is(h2,h3).as-h4{
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  margin-top: 0;
  margin-bottom: 5px;
  font-weight: 600;
}
.post-preview.show-all-posts:hover .icon-box :is(h2,h3).as-h4{
  color: #e42869;
}
#sidebar .widget :is(h2,h3).as-h5{
  text-transform: uppercase;
  letter-spacing: 0.1em;
  font-size: 11px;
  border-bottom: 1px solid #e6e6e6;
  font-weight: 600;
  padding-bottom: 20px;
  margin-bottom: 20px;
}
#comments :is(h2,h3).as-h5{
  font-size: 11px;
  letter-spacing: 0.15em;
  font-weight: 600;
}
.comment-respond :is(h2,h3).as-h5{
  font-size: 11px;
  letter-spacing: 0.15em;
  margin-bottom: 25px;
  font-weight: 600;
}
.single-product-desc > :is(h2,h3).as-h5{
  text-transform: uppercase;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.05em;
}
.single-product-list .product_meta > :is(h2,h3).as-h5{
  text-transform: uppercase;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.05em;
}
.shopping-cart .mini-cart-info :is(h2,h3).as-h5{
  margin: 0;
  font-weight: 500;
  font-size: 13px;
}
.timeline > li .timeline-content :is(h2,h3).as-h4{
  margin-top: 0;
  margin-bottom: 10px;
  font-size: 14px;
}
.timeline > li .timeline-content :is(h2,h3).as-h5{
  display: block;
  margin-top: 0;
  margin-bottom: 5px;
  font-size: 11px;
  text-transform: uppercase;
  color: #787878;
  letter-spacing: 0.05em;
  font-weight: 500;
}
.pricing-table .pricing-head :is(h2,h3).as-h4{
  font-size: 13px;
  margin: 0;
  font-weight: 400;
}
:is(h2,h3).as-h4{letter-spacing:normal}
:is(h2,h3).as-h4.panel-title{color:#333}
.z5 :is(h2,h3).as-h4{font-size:18px;font-weight:700;margin:10px 0;line-height:1.3}
.z5 :is(h2,h3).as-h4.panel-title{font-size:16px;margin:0;line-height:1.3}
/* ==== as-h4 end ==== */

/* Kein horizontaler Seiten-Scroll durch animierte Icons */
body{overflow-x:clip}
html{overflow-x:clip}

/* Logo: kein Rahmen nach Klick (Tastatur-Fokus bleibt sichtbar) */
#navbar .logo a:focus,#navbar .logo a:active{outline:none;box-shadow:none}
#navbar .logo a:focus-visible{outline:2px solid #e42869;outline-offset:4px}
/* Aktiver Menüpunkt */
#navbar .navigation-menu > li > a.ob-active{color:#e42869 !important}
#navbar .submenu a.ob-active .ob-proj-name,#navbar .submenu a.ob-active{color:#e42869}
/* Untermenü ohne Icon (agentur-leistungen) */
#navbar .ob-leist .submenu li a{display:block}
/* Footer-Themen als moderne Chips */
.footer-widgets .widget .tagcloud a{border-radius:999px;transition:all .2s}

/* Burger-Menü: pinke Striche */
.hamburger-inner,.hamburger-inner:before,.hamburger-inner:after,
#navbar .hamburger-inner,#navbar .hamburger-inner:before,#navbar .hamburger-inner:after,
#navbar.dark-menu .hamburger-inner,#navbar.dark-menu .hamburger-inner:before,#navbar.dark-menu .hamburger-inner:after,
#navbar.stick .hamburger-inner,#navbar.stick .hamburger-inner:before,#navbar.stick .hamburger-inner:after,
#navbar .menu-toggle:hover .hamburger-inner,#navbar .menu-toggle:hover .hamburger-inner:before,#navbar .menu-toggle:hover .hamburger-inner:after{background-color:#e42869 !important}
/* Button „eigene projekte“ bleibt neben dem Burger sichtbar */
.ob-pm{display:none}
@media (max-width:1365px){
  #navbar .navigation-menu > li.menu-btn-item{display:none !important}
  #navbar .menu-extras .ob-pm{display:block;position:relative;float:left}
  .ob-pm-btn{display:block;margin:14px 12px 0 0;padding:0 14px;height:32px;line-height:32px;background:#e42869;color:#fff !important;border-radius:3px;font-family:Poppins,sans-serif;font-weight:500;font-size:13px;white-space:nowrap}
  .ob-pm-btn:hover,.ob-pm-btn:focus{background:#c91f5a;color:#fff !important;outline:none}
  .ob-pm-sub{display:none;position:absolute;right:6px;top:54px;min-width:250px;margin:0;padding:6px 0;list-style:none;background:#fff;border-radius:4px;box-shadow:0 8px 24px rgba(0,0,0,.18);z-index:100000}
  .ob-pm.open .ob-pm-sub{display:block}
  .ob-pm-sub li{list-style:none;margin:0}
  .ob-pm-sub a{display:flex;align-items:center;gap:12px;padding:10px 16px;color:#1f1f1f}
  .ob-pm-sub a:hover{background:#fdecf2;color:#e42869}
  .ob-pm-sub .ob-proj-sub{color:#999 !important}
}
@media (max-width:420px){.ob-pm-btn{margin-right:4px;padding:0 10px;font-size:12px}}
