/*
Theme Name: Gesichtsbremse Pop Art Menu
Theme URI: https://gesichtsbremse.de/
Author: Marktplatz Agentur / Nikolaus
Description: Blockbasiertes WordPress-Gutenberg-Theme im Pop-Art-Stil mit schlankem automatischem Menü für Seiten und Beiträge.
Requires at least: 6.4
Tested up to: 6.8
Requires PHP: 8.0
Version: 1.2.1
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: gesichtsbremse-pop-art-menu
Tags: full-site-editing, block-patterns, one-column, wide-blocks, custom-colors, custom-logo, entertainment
*/

html { scroll-behavior: smooth; }
body { overflow-x: hidden; }

.gb-noise::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  opacity: .06;
  z-index: 9999;
  background-image: url('assets/noise.svg');
  mix-blend-mode: multiply;
}

.gb-glitch {
  position: relative;
  display: inline-block;
  margin: 0 0 1rem;
  font-size: clamp(2rem, 1.4rem + 3vw, 4rem);
  line-height: .88;
  letter-spacing: -0.08em;
  text-transform: uppercase;
  font-weight: 900;
  filter: drop-shadow(0.075em 0.06em 0 #00f0ff) drop-shadow(-0.06em -0.04em 0 #ff3bf2);
}
.gb-glitch::before,
.gb-glitch::after {
  content: attr(data-text);
  position: absolute;
  inset: 0;
  pointer-events: none;
}
.gb-glitch::before {
  transform: translate(-0.045em,-0.03em);
  color: #ff3bf2;
  opacity: .9;
  clip-path: inset(0 0 58% 0);
}
.gb-glitch::after {
  transform: translate(0.05em,0.035em);
  color: #00f0ff;
  opacity: .9;
  clip-path: inset(45% 0 0 0);
}

.gb-button a, a.wp-block-button__link { transition: transform .2s ease, box-shadow .2s ease; }
.gb-button a:hover, a.wp-block-button__link:hover { transform: translate(-4px, -4px); box-shadow: 8px 8px 0 #111111; }

.gb-sticker {
  transform: rotate(-4deg);
  box-shadow: 12px 12px 0 #111111;
}

.gb-pop-wrap {
  position: relative;
  overflow: hidden;
}
.gb-pop-wrap::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(circle at 12% 16%, rgba(255,255,255,.34) 0 3px, transparent 3.5px) 0 0/34px 34px,
    radial-gradient(circle at 78% 24%, rgba(255,255,255,.14) 0 4px, transparent 4.5px) 0 0/44px 44px;
  pointer-events: none;
  mix-blend-mode: soft-light;
}

.gb-wild-ticker {
  position: relative;
  overflow: hidden;
  border-top: 3px solid #111111;
  border-bottom: 3px solid #111111;
  background: #fff8ec;
  transform: rotate(-1deg);
  margin-inline: auto;
  box-shadow: 0 6px 0 #111111;
}
.gb-wild-ticker::before,
.gb-wild-ticker::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
}
.gb-wild-ticker::before {
  background: linear-gradient(90deg, transparent 0 2%, rgba(255,59,242,.18) 2% 4%, transparent 4% 6%, rgba(0,240,255,.18) 6% 8%, transparent 8% 100%);
  mix-blend-mode: multiply;
}
.gb-wild-ticker::after {
  background: repeating-linear-gradient(90deg, transparent 0 18px, rgba(17,17,17,.08) 18px 20px);
  opacity: .5;
}
.gb-wild-track {
  display: flex;
  width: max-content;
  white-space: nowrap;
  animation: gbWildRun 12s linear infinite;
}
.gb-wild-track.is-reverse { animation-direction: reverse; animation-duration: 9s; margin-top: -2px; }
.gb-wild-track span {
  display: inline-flex;
  align-items: center;
  gap: .9rem;
  padding: .7rem 1.1rem;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono', monospace;
  font-size: clamp(.9rem, .84rem + .2vw, 1.02rem);
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: .08em;
}
.gb-wild-track:first-child span:nth-child(odd) { background: #f7ff00; }
.gb-wild-track:first-child span:nth-child(even) { background: #ff3bf2; color: #111111; }
.gb-wild-track.is-reverse span:nth-child(odd) { background: #00f0ff; }
.gb-wild-track.is-reverse span:nth-child(even) { background: #fff8ec; }
.gb-wild-track strong {
  display: inline-block;
  padding: .15rem .35rem;
  border: 2px solid #111111;
  background: #fff8ec;
  box-shadow: 3px 3px 0 #111111;
  transform: rotate(-1deg);
}
@keyframes gbWildRun { from { transform: translateX(0); } to { transform: translateX(-50%); } }

.gb-kickerline {
  border-top: 2px solid #111111;
  border-bottom: 2px solid #111111;
  padding-block: .95rem;
}

.gb-section-line {
  border-bottom: 2px solid rgba(17,17,17,.16);
}

@media (max-width: 781px) {
  .gb-sticker { margin-top: 1rem; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .gb-wild-track { animation: none; }
  .gb-button a, a.wp-block-button__link { transition: none; }
}


.gb-topbar{position:sticky;top:0;z-index:50;backdrop-filter:blur(14px);}
.gb-topbar-inner{gap:1rem;}
.gb-menu-logo a{text-decoration:none;color:#111111;}
.gb-auto-menu{gap:.45rem .8rem;align-items:center;}
.gb-page-menu,.gb-post-dropdown,.gb-post-menu{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,'Liberation Mono',monospace;font-size:clamp(.72rem,.68rem + .18vw,.88rem);font-weight:900;text-transform:uppercase;letter-spacing:.055em;}
.gb-page-menu a,.gb-post-menu a,.gb-post-toggle{display:inline-block;text-decoration:none;color:#111111;border:2px solid #111111;border-radius:999px;background:#fff8ec;padding:.35rem .62rem;line-height:1.05;box-shadow:3px 3px 0 #111111;transition:transform .16s ease,box-shadow .16s ease,background .16s ease;}
.gb-page-menu a:hover,.gb-post-menu a:hover,.gb-post-toggle:hover{background:#f7ff00;transform:translate(-2px,-2px);box-shadow:5px 5px 0 #111111;}
.gb-page-menu .wp-block-navigation__container{gap:.35rem;}
.gb-post-dropdown{position:relative;margin:0;}
.gb-post-toggle{font:inherit;text-transform:inherit;letter-spacing:inherit;cursor:pointer;background:#00f0ff;}
.gb-post-toggle::after{content:' ↓';font-weight:900;}
.gb-post-menu{position:absolute;top:calc(100% + .55rem);right:0;z-index:90;display:flex;flex-direction:column;align-items:flex-start;gap:.38rem;min-width:min(78vw,22rem);list-style:none;margin:0;padding:.7rem;background:#fff8ec;border:2px solid #111111;border-radius:18px;box-shadow:8px 8px 0 #111111;opacity:0;visibility:hidden;pointer-events:none;transform:translateY(-.45rem) rotate(-.7deg);transition:opacity .16s ease,visibility .16s ease,transform .16s ease;}
.gb-post-dropdown:hover .gb-post-menu,.gb-post-dropdown:focus-within .gb-post-menu{opacity:1;visibility:visible;pointer-events:auto;transform:translateY(0) rotate(-.7deg);}
.gb-post-menu li{margin:0;width:100%;}
.gb-post-menu a{width:100%;box-sizing:border-box;border-radius:12px;background:#fff8ec;padding:.48rem .65rem;box-shadow:3px 3px 0 #111111;}
.gb-post-menu li:nth-child(odd) a{background:#f7ff00;}
.gb-post-menu li:nth-child(even) a{background:#ff3bf2;}
@media(max-width:781px){.gb-topbar{position:relative}.gb-auto-menu{justify-content:flex-start}.gb-page-menu{width:100%;}.gb-post-dropdown{width:100%;}.gb-post-menu{position:static;display:flex;opacity:1;visibility:visible;pointer-events:auto;transform:none;box-shadow:4px 4px 0 #111111;margin-top:.6rem;min-width:0;width:100%;}.gb-post-toggle::after{content:' ↓';}}