/* --- Make header sit on top of the poster (like mockup) --- */
.poster-header{
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  z-index: 50;

  /* spacing from edges */
  padding: 18px 28px;

  /* ensure header doesn't create its own background */
  background: transparent;
}

/* Offset for WP admin bar */
body.admin-bar .poster-header{
  top: 32px;
}
@media (max-width: 782px){
  body.admin-bar .poster-header{
    top: 46px;
  }
}

/* Make sure the header content aligns nicely */
.poster-header__inner{
  max-width: 1500px;
  margin: 0 auto;

  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 22px;
}

/* Nav wrapper */
.poster-header__nav{
  margin-top: 0;
}

/* --- RIPPED PAPER STRIP (refined) --- */
.poster-header__paper{
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 18px;

  /* padding on the strip itself */
  padding: 10px 16px;

  background: #f2eee3;
  color: var(--as-black);

  /* paper texture (subtle) */
  background-image:
    radial-gradient(180px 80px at 18% 35%, rgba(0,0,0,0.05), transparent 62%),
    radial-gradient(210px 90px at 78% 40%, rgba(0,0,0,0.04), transparent 64%),
    linear-gradient(0deg, rgba(255,255,255,0.55), rgba(255,255,255,0.55));
  background-blend-mode: multiply;

  transform: rotate(-1deg);
  box-shadow: 0 18px 30px rgba(0,0,0,0.22);

  /* IMPORTANT: more organic torn edge */
  clip-path: polygon(
    0% 22%, 3% 10%, 7% 18%, 11% 8%, 15% 20%, 20% 9%, 25% 21%, 31% 8%,
    37% 20%, 43% 9%, 49% 21%, 56% 8%, 63% 20%, 70% 9%, 77% 21%, 84% 8%,
    92% 20%, 100% 14%,
    100% 86%, 96% 96%, 90% 86%, 84% 98%, 78% 86%, 72% 97%, 66% 86%,
    60% 98%, 54% 85%, 48% 97%, 42% 86%, 36% 98%, 30% 85%, 24% 97%,
    18% 86%, 12% 98%, 6% 86%, 0% 92%
  );

  isolation: isolate;
}

/* Edge shading = gives the "ripped" depth */
.poster-header__paper::after{
  content:"";
  position:absolute;
  inset: 0;
  pointer-events:none;
  opacity: .22;
  background:
    linear-gradient(to bottom, rgba(0,0,0,0.25), transparent 30%),
    linear-gradient(to top, rgba(0,0,0,0.22), transparent 30%);
  mix-blend-mode: multiply;
  z-index: 0;
}

/* Hide tape if present from earlier versions */
.poster-header__paper .tape{ display:none !important; }

/* --- Links: padding + correct "handwritten" feel --- */
.poster-header__link{
  position: relative;
  z-index: 1;

  font-family: var(--font-flood);
  font-weight: 400;
  text-transform: uppercase;
  letter-spacing: .10em;
  font-size: 15px;
  line-height: 1;

  color: #111;
  text-decoration: none;
  white-space: nowrap;

  /* THIS is the padding you asked for */
  padding: 6px 8px;
}

/* Hover like mockup (subtle) */
.poster-header__link:hover{
  opacity: .75;
}

/* Active link */
.poster-header__link[aria-current="page"]{
  opacity: .95;
}

/* Responsive */
@media (max-width: 980px){
  .poster-header{
    padding: 14px 16px;
  }
  .poster-header__paper{
    gap: 12px;
    padding: 9px 12px;
    transform: rotate(-0.7deg);
  }
  .poster-header__link{
    font-size: 13px;
    letter-spacing: .08em;
    padding: 5px 6px;
  }
}
