/**
 * Paperchase Hub — retail / luxury dark portal.
 * DNA: Poppins + Jost; 0.25s easing (familie-sites); Highguest #000 / accent glow.
 */

@import url("https://fonts.googleapis.com/css2?family=Jost:wght@400;500;600;700&family=Montserrat:ital,wght@1,700&family=Poppins:wght@400;500;600;700&display=swap");

.pcs-retail-dark {
    --pcs-bg: var(--pcs-bg-void, #000000);
    --pcs-surface: rgba(12, 12, 12, 0.72);
    --pcs-text: var(--pcs-text-primary, #f2f2f2);
    --pcs-muted: var(--pcs-text-muted, rgba(242, 242, 242, 0.62));
    --pcs-radius-tile: 14px;
    --pcs-radius-ui: 9px;
    --pcs-ease: 0.25s ease;
    --pcs-ease-out: 0.22s ease-out;
    --pcs-font-body: "Poppins", system-ui, sans-serif;
    --pcs-font-display: "Jost", system-ui, sans-serif;
    /* Zelfde horizontale maat als Woo (shop/cart/checkout) — één lijn met header */
    --pcs-woo-gutter: clamp(1rem, 4vw, 2.5rem);
    --pcs-woo-content-max: min(92rem, 100%);
    background: var(--pcs-bg);
    color: var(--pcs-text);
    font-family: var(--pcs-font-body);
}

.pcs-retail-dark::after {
    content: "";
    position: fixed;
    inset: 0;
    pointer-events: none;
    z-index: 9998;
    opacity: 0.065;
    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 512 512' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23g)' opacity='0.5'/%3E%3C/svg%3E");
    mix-blend-mode: overlay;
}

@media (prefers-reduced-motion: reduce) {
    .pcs-retail-dark::after {
        opacity: 0.035;
    }

    .pcs-hub__kicker {
        animation: none;
    }
}

.pcs-retail-dark .site-header {
    background: transparent;
    border-bottom: 1px solid color-mix(in srgb, var(--pcs-distribution-blue) 32%, transparent);
    box-shadow: inset 0 -1px 0 color-mix(in srgb, var(--pcs-publishing-gold) 14%, transparent);
}

.pcs-retail-dark .site-header__backdrop {
    background: rgba(0, 0, 0, 0.88);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
}

.pcs-retail-dark .site-title,
.pcs-retail-dark .site-nav__list a {
    font-family: var(--pcs-font-display);
    letter-spacing: 0.06em;
    text-transform: uppercase;
    font-weight: 600;
    font-size: 0.75rem;
}

.pcs-retail-dark .site-main {
    max-width: 100%;
    padding-left: var(--pcs-woo-gutter, clamp(1rem, 4vw, 2.5rem));
    padding-right: var(--pcs-woo-gutter, clamp(1rem, 4vw, 2.5rem));
    box-sizing: border-box;
}

.pcs-retail-dark .site-footer {
    background: #050505;
    border-top: 1px solid rgba(255, 255, 255, 0.08);
}

/* —— Hub: Paperchase ring-atmosphere + logo-DNA (italic display) —— */
.pcs-hub--bento {
    position: relative;
    padding-top: 0.25rem;
    margin-top: -0.5rem;
}

.pcs-hub--bento::before {
    content: "";
    position: absolute;
    left: 5%;
    right: 5%;
    top: -4rem;
    height: clamp(300px, 42vw, 520px);
    pointer-events: none;
    z-index: 0;
    background: radial-gradient(
            120% 80% at 18% 8%,
            color-mix(in srgb, var(--pcs-distribution-blue) 20%, transparent) 0%,
            transparent 55%
        ),
        radial-gradient(90% 70% at 82% 4%, color-mix(in srgb, var(--pcs-publishing-gold) 18%, transparent) 0%, transparent 50%),
        radial-gradient(100% 90% at 50% 100%, color-mix(in srgb, var(--pcs-bookings-red) 12%, transparent) 0%, transparent 55%);
    filter: blur(26px);
    opacity: 0.95;
}

.pcs-hub--bento > * {
    position: relative;
    z-index: 1;
}

/* —— Hub intro —— */
.pcs-hub__intro {
    max-width: 64rem;
    margin: 0 auto 2.5rem;
    text-align: center;
}

.pcs-hub__kicker {
    font-family: var(--pcs-font-display);
    font-size: 0.625rem;
    font-weight: 600;
    letter-spacing: 0.32em;
    text-transform: uppercase;
    margin: 0 0 1rem;
    color: color-mix(in srgb, var(--pcs-publishing-gold) 92%, transparent);
    text-shadow:
        0 0 18px color-mix(in srgb, var(--pcs-publishing-gold) 35%, transparent),
        0 0 40px color-mix(in srgb, var(--pcs-distribution-blue) 18%, transparent);
    animation: pcs-kicker-pulse 4s ease-in-out infinite;
}

@keyframes pcs-kicker-pulse {
    0%,
    100% {
        opacity: 1;
    }
    50% {
        opacity: 0.88;
    }
}

.pcs-hub__title {
    font-family: "Montserrat", var(--pcs-font-display), sans-serif;
    font-style: italic;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    font-size: clamp(1.85rem, 4.2vw, 3rem);
    margin: 0 0 0.75rem;
    line-height: 1.1;
    background: linear-gradient(
        100deg,
        #ffffff 0%,
        #f5f5f5 45%,
        color-mix(in srgb, var(--pcs-publishing-gold) 88%, transparent) 75%,
        rgba(255, 255, 255, 0.95) 100%
    );
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    filter: drop-shadow(0 2px 24px rgba(0, 0, 0, 0.45));
}

@supports not ((-webkit-background-clip: text) or (background-clip: text)) {
    .pcs-hub__title {
        color: #fff;
        background: none;
    }
}

.pcs-demo-band {
    background: rgba(8, 8, 8, 0.65);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 16px;
    margin-inline: auto;
    max-width: 72rem;
    box-shadow: 0 0 0 1px color-mix(in srgb, var(--pcs-distribution-blue) 6%, transparent), 0 24px 48px rgba(0, 0, 0, 0.35);
}

/* —— Paperchase ecosysteem (Customizer — sitebreed onder <main>, o.a. onder hub-Bento) —— */
.site-main > .pcs-hub-ecosystem {
    margin-top: clamp(2rem, 4vw, 3.25rem);
}

.pcs-hub-ecosystem {
    width: 100%;
    max-width: 90rem;
    margin: 0 auto 3.25rem;
    padding: 0 clamp(1rem, 4vw, 2.5rem);
}

.pcs-hub-ecosystem__heading {
    font-family: var(--pcs-font-display);
    font-size: 0.6875rem;
    font-weight: 600;
    letter-spacing: 0.28em;
    text-transform: uppercase;
    text-align: center;
    margin: 0 0 1.75rem;
    color: color-mix(in srgb, var(--pcs-publishing-gold) 92%, transparent);
    text-shadow:
        0 0 18px color-mix(in srgb, var(--pcs-publishing-gold) 28%, transparent),
        0 0 36px color-mix(in srgb, var(--pcs-distribution-blue) 12%, transparent);
}

.pcs-hub-ecosystem__grid {
    display: grid;
    gap: 1.15rem;
    grid-template-columns: 1fr;
}

@media (min-width: 720px) {
    .pcs-hub-ecosystem__grid {
        grid-template-columns: repeat(3, 1fr);
        gap: 1.35rem;
    }
}

.pcs-hub-eco-card {
    --pcs-eco-accent: var(--pcs-distribution-blue);
    position: relative;
    padding: 1.35rem 1.4rem 1.25rem;
    border-radius: var(--pcs-radius-tile);
    background: linear-gradient(160deg, rgba(12, 12, 16, 0.94) 0%, rgba(4, 4, 6, 0.88) 100%);
    border: 1px solid color-mix(in srgb, var(--pcs-eco-accent) 22%, rgba(255, 255, 255, 0.08));
    box-shadow:
        0 0 0 1px color-mix(in srgb, var(--pcs-eco-accent) 8%, transparent),
        0 16px 40px rgba(0, 0, 0, 0.42),
        inset 0 1px 0 rgba(255, 255, 255, 0.05);
    transition:
        transform var(--pcs-ease-out),
        border-color var(--pcs-ease),
        box-shadow var(--pcs-ease);
}

@media (hover: hover) {
    .pcs-hub-eco-card:hover {
        transform: translateY(-3px);
        border-color: color-mix(in srgb, var(--pcs-eco-accent) 42%, rgba(255, 255, 255, 0.12));
        box-shadow:
            0 0 0 1px color-mix(in srgb, var(--pcs-eco-accent) 18%, transparent),
            0 22px 48px rgba(0, 0, 0, 0.48),
            0 0 32px color-mix(in srgb, var(--pcs-eco-accent) 12%, transparent);
    }
}

.pcs-hub-eco-card::before {
    content: "";
    position: absolute;
    top: 0;
    left: 1rem;
    right: 1rem;
    height: 2px;
    border-radius: 2px;
    background: linear-gradient(
        90deg,
        transparent,
        var(--pcs-eco-accent),
        color-mix(in srgb, var(--pcs-eco-accent) 40%, #fff),
        var(--pcs-eco-accent),
        transparent
    );
    opacity: 0.85;
    pointer-events: none;
}

.pcs-hub-eco-card__title {
    font-family: var(--pcs-font-display);
    font-size: 1.05rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    margin: 0.35rem 0 0.75rem;
    color: #fff;
}

.pcs-hub-eco-card__text {
    margin: 0 0 1rem;
    font-size: 0.9375rem;
    line-height: 1.62;
    color: rgba(220, 220, 220, 0.78);
}

.pcs-hub-eco-card__action {
    margin: 0.35rem 0 0;
}

/* Zelfde distribution-knop als hub-tegels (paperchase-distribution-ui.css) */
.pcs-hub-eco-card .pcs-dist-info {
    margin-top: 0.35rem;
}

/* Zelfde patroon als bento-tegels: <a> om <span.pcs-info-btn> (hover/focus via a:hover .pcs-info-btn) */
.pcs-hub-eco-card .pcs-hub-eco-card__cta {
    display: block;
    width: 100%;
    max-width: 100%;
    margin-inline: 0;
    text-decoration: none;
    color: inherit;
    outline: none;
}

.pcs-hub-eco-card .pcs-hub-eco-card__btn {
    --pcs-dist-btn-bg: color-mix(in srgb, var(--pcs-eco-accent) 78%, #080810);
    --pcs-dist-btn-bar: #ffffff;
    width: 100%;
    max-width: 100%;
    margin-inline: 0;
    cursor: pointer;
    color: #fff !important;
    transition:
        border-bottom-color 0.25s ease,
        background 0.25s ease;
}

/*
 * Overschrijf global .pcs-info-btn hover (blauw + gouden streep) — per pilaar: witte streep default,
 * hover alleen streep: Distribution geel, Bookings blauw, Publishing rood. Vulkleur blijft accent-mix.
 */
.pcs-hub-eco-card--distribution .pcs-hub-eco-card__cta:hover .pcs-hub-eco-card__btn,
.pcs-hub-eco-card--distribution .pcs-hub-eco-card__cta:focus-visible .pcs-hub-eco-card__btn {
    background: color-mix(in srgb, var(--pcs-eco-accent) 78%, #080810) !important;
    color: #fff !important;
    border-bottom-color: var(--pcs-publishing-gold, #ffcb00) !important;
}

.pcs-hub-eco-card--bookings .pcs-hub-eco-card__cta:hover .pcs-hub-eco-card__btn,
.pcs-hub-eco-card--bookings .pcs-hub-eco-card__cta:focus-visible .pcs-hub-eco-card__btn {
    background: color-mix(in srgb, var(--pcs-eco-accent) 78%, #080810) !important;
    color: #fff !important;
    border-bottom-color: var(--pcs-distribution-blue, #173cc8) !important;
}

.pcs-hub-eco-card--publishing .pcs-hub-eco-card__cta:hover .pcs-hub-eco-card__btn,
.pcs-hub-eco-card--publishing .pcs-hub-eco-card__cta:focus-visible .pcs-hub-eco-card__btn {
    background: color-mix(in srgb, var(--pcs-eco-accent) 78%, #080810) !important;
    color: #fff !important;
    border-bottom-color: var(--pcs-bookings-red, #c81717) !important;
}

.pcs-hub__below {
    position: relative;
    z-index: 4;
    margin-top: 3rem;
    max-width: min(72rem, 100%);
    margin-left: auto;
    margin-right: auto;
    color: var(--pcs-muted);
}

.pcs-hub__below .wp-block-heading,
.pcs-hub__below h2,
.pcs-hub__below h3,
.pcs-hub__below h4 {
    font-family: var(--pcs-font-display);
    color: #fff;
}

.pcs-hub__below p,
.pcs-hub__below .wp-block-paragraph {
    color: rgba(235, 235, 235, 0.88);
    line-height: 1.65;
}

.pcs-hub__below a {
    color: var(--pcs-publishing-gold);
    text-decoration: none;
    border-bottom: 1px solid color-mix(in srgb, var(--pcs-publishing-gold) 35%, transparent);
    transition: border-color 0.2s ease, color 0.2s ease;
}

.pcs-hub__below a:hover,
.pcs-hub__below a:focus {
    color: #fff;
    border-bottom-color: rgba(255, 255, 255, 0.5);
}

/*
 * Onder het ecosysteem: typische “plak URL in paragraaf” → volwaardige skew-CTA (zelfde DNA als .pcs-info-btn).
 * Alleen als de paragraaf uitsluitend één link bevat (geen mengvorm met platte tekst).
 */
.pcs-hub__below p:has(> a:only-child) {
    text-align: center;
}

.pcs-hub__below p:has(> a:only-child) > a:not(.wp-block-button__link):not(.pcs-info-btn) {
    --pcs-dist-btn-bg: var(--pcs-distribution-blue, #173cc8);
    --pcs-dist-btn-bar: #ffffff;
    display: block;
    width: 100%;
    max-width: 22rem;
    margin: 0.5rem auto 0;
    padding: 0.62rem 0.85rem;
    box-sizing: border-box;
    background: var(--pcs-dist-btn-bg);
    color: #fff !important;
    text-align: center;
    border: none;
    font-weight: 600;
    font-family: "Heavy", "futuraheavy", var(--pcs-font-display, "Jost", sans-serif);
    text-transform: uppercase;
    letter-spacing: 0.033em;
    font-size: clamp(0.68rem, 1.05vw, 0.78rem);
    line-height: 1.2;
    text-decoration: none !important;
    border-bottom: 5px solid var(--pcs-dist-btn-bar) !important;
    transform: skew(-10deg);
    cursor: pointer;
    transition: border-bottom-color 0.25s ease;
}

/* Alleen de onderrand verandert bij hover/focus — vulkleur blijft gelijk */
.pcs-hub__below p:has(> a:only-child) > a:not(.wp-block-button__link):not(.pcs-info-btn):hover,
.pcs-hub__below p:has(> a:only-child) > a:not(.wp-block-button__link):not(.pcs-info-btn):focus-visible {
    color: #fff !important;
    border-bottom-color: var(--pcs-publishing-gold, #ffcb00) !important;
    outline: none;
}

/* Gutenberg-knoppen onder de tegels — zelfde distribution-DNA als .pcs-info-btn */
.pcs-hub__below .wp-block-buttons {
    position: relative;
    z-index: 2;
    gap: 1rem 1.25rem;
    margin: 1.75rem 0;
    justify-content: center;
}

.pcs-hub__below .wp-block-button {
    position: relative;
    z-index: 2;
}

.pcs-hub__below .wp-block-button__link,
.pcs-hub__below a.wp-block-button__link {
    position: relative;
    z-index: 2;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    box-sizing: border-box !important;
    touch-action: manipulation;
    -webkit-tap-highlight-color: rgba(255, 203, 0, 0.28);
    min-height: 2.75rem;
    background: #173cc8 !important;
    color: #fff !important;
    border: none !important;
    border-radius: 0 !important;
    border-bottom: 5px solid #fff !important;
    transform: skew(-10deg);
    font-family: "Heavy", "futuraheavy", var(--pcs-font-display, "Jost", sans-serif) !important;
    font-weight: 600 !important;
    letter-spacing: 0.06em !important;
    text-transform: uppercase !important;
    font-size: clamp(0.68rem, 1.05vw, 0.78rem) !important;
    line-height: 1.25 !important;
    padding: 0.65rem 1.35rem !important;
    text-decoration: none !important;
    box-shadow: 0 6px 24px rgba(0, 0, 0, 0.4);
    transition: border-bottom-color 0.25s ease;
}

/* Default (gevulde) knop: zelfde achtergrond op hover — alleen gouden streep */
.pcs-hub__below .wp-block-button:not(.is-style-outline) .wp-block-button__link:hover,
.pcs-hub__below .wp-block-button:not(.is-style-outline) .wp-block-button__link:focus-visible,
.pcs-hub__below .wp-block-button:not(.is-style-outline) a.wp-block-button__link:hover,
.pcs-hub__below .wp-block-button:not(.is-style-outline) a.wp-block-button__link:focus-visible {
    background: #173cc8 !important;
    color: #fff !important;
    border-bottom-color: var(--pcs-publishing-gold, #ffcb00) !important;
    box-shadow: 0 6px 24px rgba(0, 0, 0, 0.4);
}

/* Outline: geen extra rand —zelfde witte streep als de andere; hover = alleen rode streep */
.pcs-hub__below .wp-block-button.is-style-outline .wp-block-button__link,
.pcs-hub__below .wp-block-button.is-style-outline a.wp-block-button__link {
    background: rgba(8, 12, 28, 0.65) !important;
    border: none !important;
    border-bottom: 5px solid #fff !important;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.35);
    transition: border-bottom-color 0.25s ease;
}

.pcs-hub__below .wp-block-button.is-style-outline .wp-block-button__link:hover,
.pcs-hub__below .wp-block-button.is-style-outline .wp-block-button__link:focus-visible,
.pcs-hub__below .wp-block-button.is-style-outline a.wp-block-button__link:hover,
.pcs-hub__below .wp-block-button.is-style-outline a.wp-block-button__link:focus-visible {
    background: rgba(8, 12, 28, 0.65) !important;
    border: none !important;
    border-bottom-color: var(--pcs-bookings-red, #c81717) !important;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.35);
}

.pcs-hub__lead {
    margin: 0;
    color: var(--pcs-muted);
    font-size: 1rem;
    letter-spacing: 0.02em;
    max-width: 42rem;
    margin-inline: auto;
}

/* —— Bento —— */
/* Smalle schermen: 1 kolom (volle breedte per tegel; 2 kolommen zonder official span 2 = halve hero). Vanaf tablet: 2 kolommen + official over volle breedte. */
.pcs-bento {
    display: grid;
    gap: 1rem;
    grid-template-columns: 1fr;
    max-width: 90rem;
    margin: 0 auto 4rem;
}

@media (min-width: 720px) {
    .pcs-bento {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 1.25rem;
    }

    .pcs-bento-tile--official {
        grid-column: span 2;
        min-height: clamp(240px, 32vw, 380px);
    }
}

@media (min-width: 1100px) {
    .pcs-bento {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .pcs-bento-tile--official {
        grid-column: span 2;
        grid-row: span 2;
        min-height: 0;
    }
}

.pcs-bento-tile {
    position: relative;
    display: block;
    min-height: clamp(200px, 28vw, 340px);
    border-radius: var(--pcs-radius-tile);
    overflow: hidden;
    text-decoration: none;
    color: var(--pcs-text);
    background: #070707;
    border: 1px solid rgba(255, 255, 255, 0.07);
    outline: 1px solid color-mix(in srgb, var(--pcs-accent, #fff) 22%, transparent);
    outline-offset: 0;
    box-shadow:
        0 18px 50px rgba(0, 0, 0, 0.48),
        inset 0 1px 0 rgba(255, 255, 255, 0.06);
    transform: translateZ(0);
    isolation: isolate;
    transition:
        transform var(--pcs-ease-out),
        box-shadow var(--pcs-ease),
        outline-color var(--pcs-ease),
        border-color var(--pcs-ease);
    perspective: 960px;
}

.pcs-bento-tile:hover,
.pcs-bento-tile:focus-visible {
    box-shadow:
        0 24px 60px rgba(0, 0, 0, 0.55),
        0 0 0 1px color-mix(in srgb, var(--pcs-accent) 35%, transparent),
        0 0 48px color-mix(in srgb, var(--pcs-accent) 25%, transparent);
    outline-color: color-mix(in srgb, var(--pcs-accent) 45%, transparent);
}

.pcs-bento-tile:focus-visible {
    outline: 2px solid var(--pcs-accent);
    outline-offset: 3px;
}

.pcs-bento-tile__media {
    position: absolute;
    inset: 0;
}

.pcs-bento-tile__bg-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transform: scale(1.04);
    transition: transform 0.6s ease;
}

.pcs-bento-tile:hover .pcs-bento-tile__bg-img,
.pcs-bento-tile:focus-visible .pcs-bento-tile__bg-img {
    transform: scale(1.08);
}

.pcs-bento-tile__bg-fallback {
    display: block;
    width: 100%;
    height: 100%;
    background: radial-gradient(
        120% 80% at 20% 20%,
        color-mix(in srgb, var(--pcs-accent) 35%, #0a0a0a),
        #000 70%
    );
}

.pcs-bento-tile__veil {
    position: absolute;
    inset: 0;
    background: linear-gradient(
        180deg,
        rgba(0, 0, 0, 0.12) 0%,
        rgba(0, 0, 0, 0.45) 42%,
        rgba(0, 0, 0, 0.78) 100%
    );
    pointer-events: none;
}

.pcs-bento-tile__glass {
    position: absolute;
    inset: 0;
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.07) 0%, transparent 42%, transparent 100%);
    pointer-events: none;
    mix-blend-mode: soft-light;
}

.pcs-bento-tile__tilt {
    position: relative;
    z-index: 2;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: stretch;
    height: 100%;
    min-height: inherit;
    padding: 1.25rem 1.35rem;
    transform: perspective(880px) rotateX(var(--pcs-tilt-y, 0deg)) rotateY(var(--pcs-tilt-x, 0deg)) translateZ(0);
    transition: transform 0.2s ease-out;
    gap: 0.65rem;
}

/* Logo center rail — distribution / Highguest portal */
.pcs-bento-tile__rail {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    flex: 1 1 auto;
    width: 100%;
    min-height: 0;
    gap: 0.5rem;
}

.pcs-bento-tile__rail .pcs-tile-logo-wrap {
    max-width: min(240px, 72%);
}

.pcs-bento-tile__footer {
    width: 100%;
    margin-top: auto;
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
}

.pcs-bento-tile__status {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    font-size: 0.625rem;
    font-weight: 700;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    padding: 0.35rem 0.65rem;
    border-radius: 999px;
    background: var(--pcs-surface);
    border: 1px solid color-mix(in srgb, var(--pcs-accent) 28%, transparent);
    color: color-mix(in srgb, var(--pcs-accent) 92%, #fff);
}

.pcs-bento-tile__status--soon {
    color: var(--pcs-muted);
    border-color: rgba(255, 255, 255, 0.12);
}

.pcs-live-dot {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--pcs-accent);
    box-shadow: 0 0 12px color-mix(in srgb, var(--pcs-accent) 80%, transparent);
    animation: pcs-live-pulse 2.4s ease-in-out infinite;
}

@keyframes pcs-live-pulse {
    0%,
    100% {
        opacity: 1;
        transform: scale(1);
    }
    50% {
        opacity: 0.85;
        transform: scale(1.15);
    }
}

/* Logo + reusable FX */
.pcs-tile-logo-wrap {
    position: relative;
    display: block;
    max-width: min(220px, 55%);
}

.pcs-tile-logo-wrap--text .pcs-tile-fallback-wordmark {
    font-family: var(--pcs-font-display);
    font-weight: 700;
    font-size: clamp(1.25rem, 3vw, 1.75rem);
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: #fff;
    text-shadow:
        0 0 14px color-mix(in srgb, var(--pcs-accent) 60%, transparent),
        0 0 40px color-mix(in srgb, var(--pcs-accent) 35%, transparent);
}

.pcs-bento-tile__logo-img {
    display: block;
    width: 100%;
    height: auto;
}

/* Shine sweep (logo) */
.pcs-fx--shine {
    position: relative;
}

.pcs-fx--shine::after {
    content: "";
    position: absolute;
    inset: -8%;
    pointer-events: none;
    border-radius: var(--pcs-radius-ui);
    background: linear-gradient(
        118deg,
        transparent 0%,
        transparent 38%,
        rgba(255, 255, 255, 0.5) 47%,
        color-mix(in srgb, var(--pcs-accent) 50%, #fff) 50%,
        rgba(255, 255, 255, 0.35) 53%,
        transparent 62%,
        transparent 100%
    );
    background-size: 220% 220%;
    mix-blend-mode: soft-light;
    opacity: 0;
    z-index: 3;
    animation: pcs-chrome-sweep 3.2s ease-in-out infinite;
    animation-play-state: paused;
}

.pcs-bento-tile:hover .pcs-fx--shine::after,
.pcs-bento-tile:focus-visible .pcs-fx--shine::after {
    opacity: 1;
    animation-play-state: running;
}

@keyframes pcs-chrome-sweep {
    0%,
    40% {
        background-position: 130% 40%;
    }
    55%,
    100% {
        background-position: -30% 60%;
    }
}

/* Neon pulse (logo) */
.pcs-fx--neon .pcs-bento-tile__logo-img,
.pcs-fx--neon .pcs-tile-fallback-wordmark {
    animation: pcs-neon-logo 2.8s ease-in-out infinite;
    will-change: filter;
}

@keyframes pcs-neon-logo {
    0%,
    100% {
        filter: drop-shadow(0 0 6px color-mix(in srgb, var(--pcs-accent) 55%, transparent))
            drop-shadow(0 0 16px color-mix(in srgb, var(--pcs-accent) 35%, transparent));
    }
    50% {
        filter: drop-shadow(0 0 12px color-mix(in srgb, var(--pcs-accent) 90%, transparent))
            drop-shadow(0 0 28px color-mix(in srgb, var(--pcs-accent) 50%, transparent));
    }
}

/* Glitch entry (tile logos) */
.pcs-fx--glitch .pcs-bento-tile__logo-img {
    animation:
        pcs-glitch-in 0.85s cubic-bezier(0.2, 0.85, 0.2, 1) both,
        pcs-neon-logo 2.8s ease-in-out 0.85s infinite;
}

.pcs-fx--glitch .pcs-tile-fallback-wordmark {
    animation:
        pcs-glitch-in-text 0.85s cubic-bezier(0.2, 0.85, 0.2, 1) both,
        pcs-neon-text 2.8s ease-in-out 0.85s infinite;
}

@keyframes pcs-glitch-in {
    0% {
        opacity: 0;
        transform: translate(6px, -3px) scale(0.98);
        filter: hue-rotate(75deg) saturate(1.35) drop-shadow(3px 0 0 color-mix(in srgb, var(--pcs-accent) 50%, transparent));
    }
    12% {
        opacity: 1;
        transform: translate(-4px, 2px);
        filter: hue-rotate(-25deg) drop-shadow(-3px 0 0 rgba(255, 255, 255, 0.45));
    }
    28% {
        transform: translate(3px, 0);
    }
    42% {
        transform: translate(-2px, -1px);
        filter: none;
    }
    100% {
        opacity: 1;
        transform: none;
        filter: none;
    }
}

@keyframes pcs-glitch-in-text {
    0% {
        opacity: 0;
        transform: translate(5px, -2px);
    }
    20% {
        opacity: 1;
        transform: translate(-3px, 1px);
    }
    100% {
        opacity: 1;
        transform: none;
    }
}

@keyframes pcs-neon-text {
    0%,
    100% {
        text-shadow:
            0 0 12px color-mix(in srgb, var(--pcs-accent) 55%, transparent),
            0 0 28px color-mix(in srgb, var(--pcs-accent) 35%, transparent);
    }
    50% {
        text-shadow:
            0 0 20px color-mix(in srgb, var(--pcs-accent) 85%, transparent),
            0 0 48px color-mix(in srgb, var(--pcs-accent) 45%, transparent);
    }
}

.pcs-bento-tile__label {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.pcs-bento-tile__name {
    font-family: var(--pcs-font-display);
    font-weight: 600;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    font-size: 1rem;
}

/*
 * Official tegel (mobiel): «Paperchase» gecentreerd; «Official Merch»-regel zoals voorheen (footer-naam).
 */
@media (max-width: 719px) {
    .pcs-bento-tile--official .pcs-tile-fallback-wordmark--official-split {
        display: flex;
        flex-direction: column;
        align-items: center;
        width: 100%;
        max-width: 100%;
    }

    .pcs-bento-tile--official .pcs-official-wordmark__brand {
        display: block;
        width: 100%;
        text-align: center;
    }

    .pcs-bento-tile--official .pcs-official-wordmark__rest {
        display: block;
        width: 100%;
        margin-top: 0.12em;
        text-align: center;
    }

    .pcs-bento-tile--official .pcs-bento-tile__name--official-split {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 0.15em;
    }

    .pcs-bento-tile--official .pcs-official-name__brand {
        align-self: center;
        width: 100%;
        text-align: center;
    }

    .pcs-bento-tile--official .pcs-official-name__rest {
        align-self: flex-start;
        width: 100%;
        text-align: left;
    }
}

.pcs-bento-tile__tag {
    font-size: 0.8125rem;
    color: var(--pcs-muted);
    letter-spacing: 0.02em;
    max-width: 36ch;
}

/* —— Distribution #artists → shop tegel (skew ribbon + micro lift) —— */
.pcs-bento-tile__media--distribution {
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.05);
}

.pcs-artist-tile__ribbon {
    display: inline-block;
    align-self: flex-start;
    margin-bottom: 0.4rem;
    padding: 0.32rem 0.7rem;
    background: #000;
    color: #fff;
    font-family: var(--pcs-font-display);
    font-weight: 700;
    font-size: 0.625rem;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    transform: skew(var(--pcs-artist-skew, -10deg));
    border-bottom: var(--pcs-artist-ribbon-border, 2.5px) solid var(--ribbon-accent, #173cc8);
    box-shadow: 0 0 5px rgba(0, 0, 0, 0.18);
}

.pcs-bento-tile--artist-store {
    min-height: clamp(220px, 30vw, 360px);
}

.pcs-bento-tile__status--drop {
    animation: pcs-drop-pill-glow 2.5s ease-in-out infinite;
}

@keyframes pcs-drop-pill-glow {
    0%,
    100% {
        box-shadow: 0 0 0 0 transparent;
    }
    50% {
        box-shadow: 0 0 18px 1px color-mix(in srgb, var(--pcs-accent) 40%, transparent);
    }
}

/* Highguest-style chrome layer (petjes harmony) */
.pcs-tile-logo-wrap.pcs-fx--chrome-hg {
    position: relative;
}

.pcs-fx--chrome-hg::before {
    content: "";
    position: absolute;
    inset: -12%;
    pointer-events: none;
    border-radius: 4px;
    z-index: 4;
    background: linear-gradient(
        118deg,
        transparent 0%,
        transparent 36%,
        rgba(255, 255, 255, 0.52) 46%,
        color-mix(in srgb, var(--pcs-accent) 50%, #fff) 50%,
        rgba(255, 255, 255, 0.32) 54%,
        transparent 64%,
        transparent 100%
    );
    background-size: 220% 220%;
    mix-blend-mode: soft-light;
    animation: pcs-chrome-hg-sweep 2.85s ease-in-out infinite;
}

@keyframes pcs-chrome-hg-sweep {
    0%,
    38% {
        opacity: 0.2;
        background-position: 125% 38%;
    }
    50% {
        opacity: 0.95;
    }
    58%,
    100% {
        opacity: 0.2;
        background-position: -32% 58%;
    }
}

.pcs-fx--glint-strong.pcs-fx--shine::after {
    animation-duration: 2s;
    opacity: 0.5;
}

.pcs-bento-tile:hover .pcs-fx--glint-strong.pcs-fx--shine::after {
    opacity: 1;
}

/* Reserved — future artist brands */
.pcs-bento-tile--reserved {
    pointer-events: none;
    min-height: clamp(200px, 28vw, 320px);
    border: 1px dashed rgba(255, 255, 255, 0.14);
    outline: none;
    box-shadow: none;
    background: rgba(8, 8, 8, 0.4);
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
}

.pcs-bento-tile--reserved:hover,
.pcs-bento-tile--reserved:focus-visible {
    transform: none;
    box-shadow: none;
    outline: none;
}

.pcs-bento-tile__reserved-body {
    padding: 1.5rem;
    color: var(--pcs-muted);
}

.pcs-bento-tile__reserved-label {
    display: block;
    font-family: var(--pcs-font-display);
    font-size: 0.65rem;
    font-weight: 600;
    letter-spacing: 0.22em;
    text-transform: uppercase;
    margin-bottom: 0.4rem;
    color: rgba(255, 255, 255, 0.42);
}

.pcs-bento-tile__reserved-sub {
    font-size: 0.8rem;
    opacity: 0.72;
}

.pcs-bento-tile__reserved-icon {
    display: block;
    width: 36px;
    height: 36px;
    margin: 0 auto 0.75rem;
    border: 1px dashed rgba(255, 255, 255, 0.18);
    border-radius: 50%;
}

@media (prefers-reduced-motion: reduce) {
    .pcs-bento-tile__status--drop {
        animation: none;
    }

    .pcs-fx--chrome-hg::before {
        animation: none;
        opacity: 0.35;
    }
}

/* —— Gateway single (artist store /stores/{slug}/) —— */
.pcs-gateway-page {
    --pcs-accent: #00ff41;
    margin: 0;
    padding-bottom: 0;
}

.pcs-gateway-hero {
    position: relative;
    min-height: clamp(340px, 72vh, 720px);
    display: flex;
    align-items: flex-end;
    overflow: hidden;
    isolation: isolate;
}

/* Atmosphere: family tri-glow (distribution / publishing / bookings) + accent */
.pcs-gateway-hero::before {
    content: "";
    position: absolute;
    inset: -20% -10% 30%;
    pointer-events: none;
    z-index: 1;
    background:
        radial-gradient(ellipse 90% 70% at 15% 20%, color-mix(in srgb, var(--pcs-distribution-blue) 22%, transparent) 0%, transparent 55%),
        radial-gradient(ellipse 80% 60% at 85% 15%, color-mix(in srgb, var(--pcs-publishing-gold) 14%, transparent) 0%, transparent 50%),
        radial-gradient(ellipse 100% 80% at 50% 100%, color-mix(in srgb, var(--pcs-bookings-red) 8%, transparent) 0%, transparent 55%);
    filter: blur(28px);
    opacity: 0.85;
}

.pcs-gateway-hero__bg {
    position: absolute;
    inset: 0;
    z-index: 0;
    background-size: cover;
    background-position: center;
    transform: scale(1.02);
    transition: transform 1s ease;
}

@media (hover: hover) and (prefers-reduced-motion: no-preference) {
    .pcs-gateway-page .pcs-gateway-hero:hover .pcs-gateway-hero__bg {
        transform: scale(1.05);
    }
}

.pcs-gateway-hero__bg--void {
    background: radial-gradient(
        120% 80% at 50% 20%,
        color-mix(in srgb, var(--pcs-accent) 25%, #050505),
        #000
    );
}

.pcs-gateway-hero__veil {
    position: absolute;
    inset: 0;
    z-index: 2;
    background:
        linear-gradient(185deg, rgba(0, 0, 0, 0.15) 0%, transparent 38%),
        linear-gradient(0deg, rgba(0, 0, 0, 0.88) 0%, rgba(0, 0, 0, 0.45) 52%, transparent 100%);
    pointer-events: none;
}

.pcs-gateway-hero__inner {
    position: relative;
    z-index: 3;
    width: 100%;
    max-width: min(44rem, 100%);
    margin: 0 auto;
    padding: clamp(2.5rem, 6vw, 4rem) clamp(1.25rem, 4vw, 2.5rem) clamp(3.5rem, 8vw, 5.5rem);
    padding-left: calc(clamp(1.25rem, 4vw, 2.5rem) + 16px);
    box-shadow: inset 3px 0 0 color-mix(in srgb, var(--pcs-accent) 75%, color-mix(in srgb, var(--pcs-publishing-gold) 35%, transparent));
}

/* Gateway hero — 3D GLB (per Artist Store, zelfde /glb/-host als site-logo) */
.pcs-gateway-glb-wrap {
    margin: 0 0 1.25rem;
    max-width: min(100%, 22rem);
}

.pcs-gateway-glb {
    display: block;
    width: 100%;
    max-width: 22rem;
    height: auto;
    min-height: 140px;
    max-height: min(42vw, 280px);
    aspect-ratio: 1;
    background: transparent;
    --poster-color: transparent;
    filter: drop-shadow(0 8px 32px color-mix(in srgb, var(--pcs-accent) 35%, transparent));
}

.pcs-gateway-glb__poster {
    display: flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    min-height: 140px;
    padding: 1rem;
    background: rgba(0, 0, 0, 0.35);
    color: var(--pcs-text, #f2f2f2);
}

.pcs-gateway-glb__poster-img {
    display: block;
    max-width: 200px;
    max-height: 120px;
    width: auto;
    height: auto;
    object-fit: contain;
}

.pcs-gateway-glb__poster-text {
    font-family: var(--pcs-font-display);
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    text-align: center;
    line-height: 1.3;
}

.pcs-gateway-logo {
    position: relative;
    display: inline-block;
    margin-bottom: 1rem;
}

.pcs-gateway-logo__img {
    max-width: 240px;
    height: auto;
    display: block;
}

.pcs-gateway-logo.pcs-fx--neon .pcs-gateway-logo__img {
    animation: pcs-neon-logo 2.8s ease-in-out infinite;
}

.pcs-gateway-logo.pcs-fx--shine::after {
    border-radius: var(--pcs-radius-ui);
    animation: pcs-chrome-sweep 4s ease-in-out infinite;
    animation-play-state: running;
    opacity: 0.35;
}

.pcs-gateway-logo.pcs-fx--shine:hover::after {
    opacity: 0.9;
}

.pcs-gateway-title {
    font-family: "Montserrat", var(--pcs-font-display), sans-serif;
    font-style: italic;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    font-size: clamp(2rem, 5.2vw, 3.15rem);
    line-height: 1.08;
    margin: 0 0 1rem;
    background: linear-gradient(
        100deg,
        #ffffff 0%,
        #ececec 38%,
        color-mix(in srgb, var(--pcs-accent) 72%, #ffffff) 72%,
        #f8f8f8 100%
    );
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    filter: drop-shadow(0 3px 28px rgba(0, 0, 0, 0.55));
}

@supports not ((-webkit-background-clip: text) or (background-clip: text)) {
    .pcs-gateway-title {
        color: #fff;
        background: none;
    }
}

.pcs-gateway-lead {
    font-size: clamp(1rem, 2.2vw, 1.15rem);
    line-height: 1.65;
    color: rgba(235, 235, 235, 0.82);
    margin: 0 0 1.75rem;
    max-width: 38ch;
    letter-spacing: 0.02em;
}

/* Gateway trust badges — Lucide (1px stroke) + optioneel Paperchase-logo; emerald glow wanneer sectie actief / hover */
.pcs-gateway-trust-badges {
    margin: -0.35rem 0 1.35rem;
    max-width: min(100%, 44rem);
}

.pcs-gateway-trust-badges__list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 0.7rem 1.1rem;
    justify-content: flex-start;
    align-items: flex-start;
}

.pcs-gateway-trust-badge {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.45rem;
    width: 5.75rem;
    text-align: center;
}

.pcs-gateway-trust-badge__circle {
    width: 2.875rem;
    height: 2.875rem;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: rgba(24, 24, 28, 0.1);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
    transition: filter 0.2s ease;
}

.pcs-gateway-trust-badge__circle svg {
    width: 1.28rem;
    height: 1.28rem;
    stroke: #ffffff;
    stroke-width: 1px;
    color: #ffffff;
}

.pcs-gateway-trust-badge__dual {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.125rem;
}

.pcs-gateway-trust-badge__dual svg {
    width: 1.05rem;
    height: 1.05rem;
}

.pcs-gateway-trust-badge__paperchase {
    width: 1.55rem;
    height: auto;
    max-height: 1.55rem;
    object-fit: contain;
}

.pcs-gateway-trust-badge__mono {
    font-family: var(--pcs-font-display, system-ui);
    font-size: 0.62rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    color: #ffffff;
    text-transform: uppercase;
}

.pcs-gateway-trust-badge__label {
    margin: 0;
    font-size: 0.62rem;
    line-height: 1.3;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    font-weight: 600;
    color: rgba(235, 235, 235, 0.72);
}

.pcs-gateway-trust-badges.is-section-active .pcs-gateway-trust-badge__circle,
.pcs-gateway-trust-badge:hover .pcs-gateway-trust-badge__circle {
    filter:
        drop-shadow(0 0 2px #00ff41)
        drop-shadow(0 0 10px rgba(0, 255, 65, 0.45))
        drop-shadow(0 0 18px rgba(0, 255, 65, 0.2));
}

@media (prefers-reduced-motion: reduce) {
    .pcs-gateway-trust-badge__circle {
        transition: none;
    }
}

.pcs-gateway-actions {
    margin: 0 0 0.5rem;
}

.pcs-gateway-cta {
    display: inline-block;
    text-decoration: none;
    color: inherit;
}

.pcs-gateway-cta .pcs-info-btn {
    width: auto;
    min-width: 12rem;
}

.pcs-gateway-actions--pending {
    margin-top: 0.25rem;
}

.pcs-gateway-pill {
    display: inline-flex;
    align-items: center;
    padding: 0.55rem 1rem;
    border-radius: 999px;
    font-size: 0.6875rem;
    font-weight: 600;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--pcs-muted);
    border: 1px dashed rgba(255, 255, 255, 0.2);
    background: rgba(0, 0, 0, 0.35);
}

/* Per-artist social */
.pcs-gateway-social {
    margin-top: 2rem;
    padding: 1.35rem 1.35rem 1.25rem;
    border-radius: var(--pcs-radius-tile);
    border: 1px solid color-mix(in srgb, var(--pcs-accent) 22%, rgba(255, 255, 255, 0.08));
    background: linear-gradient(145deg, rgba(8, 8, 12, 0.72) 0%, rgba(0, 0, 0, 0.45) 100%);
    box-shadow:
        0 0 0 1px color-mix(in srgb, var(--pcs-accent) 8%, transparent),
        0 12px 32px rgba(0, 0, 0, 0.35);
}

.pcs-gateway-social__kicker {
    margin: 0 0 0.65rem;
    font-family: var(--pcs-font-display);
    font-size: 0.65rem;
    font-weight: 600;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: color-mix(in srgb, var(--pcs-accent) 75%, var(--pcs-muted));
}

.pcs-social--gateway {
    gap: 0.55rem;
}

.pcs-social--gateway .pcs-social__link {
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 999px;
    border: 1px solid color-mix(in srgb, var(--pcs-accent) 40%, rgba(255, 255, 255, 0.12));
    background: rgba(0, 0, 0, 0.45);
    color: color-mix(in srgb, var(--pcs-accent) 88%, #fff);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition:
        background var(--pcs-ease),
        border-color var(--pcs-ease),
        box-shadow var(--pcs-ease);
}

.pcs-social--gateway .pcs-social__link:hover,
.pcs-social--gateway .pcs-social__link:focus-visible {
    background: color-mix(in srgb, var(--pcs-accent) 18%, #000);
    border-color: color-mix(in srgb, var(--pcs-accent) 65%, transparent);
    box-shadow: 0 0 14px color-mix(in srgb, var(--pcs-accent) 35%, transparent);
    color: #fff;
}

.pcs-gateway-body.entry-content h2,
.pcs-gateway-body.entry-content h3 {
    font-family: var(--pcs-font-display);
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    margin-top: 2.25rem;
    margin-bottom: 0.85rem;
    color: var(--pcs-text);
}

.pcs-gateway-body.entry-content h2:first-of-type {
    margin-top: 0;
    padding-bottom: 0.85rem;
    border-bottom: 1px solid color-mix(in srgb, var(--pcs-accent) 28%, rgba(255, 255, 255, 0.08));
}

.pcs-gateway-body.entry-content h2 {
    font-size: clamp(1.28rem, 2.6vw, 1.72rem);
    color: color-mix(in srgb, var(--pcs-accent) 28%, #fff);
}

.pcs-gateway-body.entry-content h3 {
    font-size: clamp(1.02rem, 2vw, 1.22rem);
    color: rgba(250, 250, 250, 0.94);
}

.pcs-gateway-body.entry-content p {
    line-height: 1.72;
    color: rgba(220, 220, 220, 0.78);
    margin-bottom: 1.05rem;
    font-size: 1.02rem;
}

.pcs-gateway-body.entry-content p strong {
    color: #fff;
    font-weight: 600;
}

.pcs-gateway-body.entry-content ul,
.pcs-gateway-body.entry-content ol {
    margin: 0 0 1.35rem;
    padding-left: 1.35rem;
    color: rgba(220, 220, 220, 0.78);
}

.pcs-gateway-body.entry-content li {
    margin-bottom: 0.4rem;
    line-height: 1.62;
}

.pcs-gateway-body.entry-content a {
    color: color-mix(in srgb, var(--pcs-accent) 80%, var(--pcs-publishing-gold));
    text-decoration: none;
    border-bottom: 1px solid color-mix(in srgb, var(--pcs-accent) 35%, transparent);
    transition: border-color 0.2s ease, color 0.2s ease;
}

.pcs-gateway-body.entry-content a:hover,
.pcs-gateway-body.entry-content a:focus-visible {
    color: #fff;
    border-bottom-color: color-mix(in srgb, var(--pcs-publishing-gold) 45%, transparent);
}

.pcs-gateway-body.entry-content blockquote {
    margin: 1.5rem 0;
    padding: 1rem 1.25rem;
    border-left: 3px solid color-mix(in srgb, var(--pcs-accent) 55%, transparent);
    background: rgba(255, 255, 255, 0.03);
    border-radius: 0 var(--pcs-radius-ui) var(--pcs-radius-ui) 0;
    font-style: italic;
    color: rgba(235, 235, 235, 0.88);
}

.pcs-gateway-body.entry-content hr {
    margin: 2rem 0;
    border: 0;
    height: 1px;
    background: linear-gradient(
        90deg,
        transparent,
        color-mix(in srgb, var(--pcs-accent) 35%, transparent),
        transparent
    );
}

.pcs-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 0.9rem 1.75rem;
    font-family: var(--pcs-font-display);
    font-weight: 600;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    font-size: 0.75rem;
    border-radius: var(--pcs-radius-ui);
    border: 1px solid color-mix(in srgb, var(--pcs-accent) 45%, transparent);
    background: color-mix(in srgb, var(--pcs-accent) 12%, #000);
    color: #fff;
    text-decoration: none;
    transition:
        background var(--pcs-ease),
        box-shadow var(--pcs-ease),
        transform var(--pcs-ease-out);
}

.pcs-btn--gateway:hover,
.pcs-btn--gateway:focus-visible {
    background: color-mix(in srgb, var(--pcs-accent) 22%, #000);
    transform: translateY(-2px);
}

.pcs-fx-btn {
    animation: pcs-neon-btn 2.8s ease-in-out infinite;
}

@keyframes pcs-neon-btn {
    0%,
    100% {
        box-shadow:
            0 0 10px color-mix(in srgb, var(--pcs-accent) 35%, transparent),
            0 0 0 1px color-mix(in srgb, var(--pcs-accent) 40%, transparent);
    }
    50% {
        box-shadow:
            0 0 22px color-mix(in srgb, var(--pcs-accent) 55%, transparent),
            0 0 40px color-mix(in srgb, var(--pcs-accent) 28%, transparent),
            0 0 0 1px color-mix(in srgb, var(--pcs-accent) 55%, transparent);
    }
}

.pcs-gateway-body {
    position: relative;
    width: 100%;
    max-width: min(48rem, 100%);
    margin: clamp(-1.75rem, -4vw, -2.75rem) auto 0;
    padding: clamp(2.35rem, 5vw, 3.35rem) clamp(1.35rem, 4vw, 2.85rem) clamp(3.5rem, 9vw, 5.5rem);
    color: var(--pcs-muted);
    background: linear-gradient(180deg, rgba(10, 10, 12, 0.97) 0%, rgba(4, 4, 6, 0.98) 100%);
    border: 1px solid rgba(255, 255, 255, 0.07);
    border-bottom: none;
    border-radius: 22px 22px 0 0;
    box-shadow:
        0 -16px 56px rgba(0, 0, 0, 0.48),
        inset 0 1px 0 rgba(255, 255, 255, 0.06);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
}

@media (prefers-reduced-motion: reduce) {
    .pcs-bento-tile__tilt,
    .pcs-bento-tile__bg-img,
    .pcs-fx--neon .pcs-bento-tile__logo-img,
    .pcs-fx--neon .pcs-tile-fallback-wordmark,
    .pcs-fx--neon .pcs-gateway-logo__img,
    .pcs-fx--glitch .pcs-bento-tile__logo-img,
    .pcs-fx--glitch .pcs-tile-fallback-wordmark,
    .pcs-fx-btn,
    .pcs-live-dot,
    .pcs-gateway-logo.pcs-fx--shine::after {
        animation: none !important;
    }

    .pcs-bento-tile:hover .pcs-bento-tile__bg-img,
    .pcs-bento-tile:focus-visible .pcs-bento-tile__bg-img {
        transform: scale(1.04);
    }

    .pcs-fx--shine::after {
        display: none;
    }
}

/* —— /stores/ — overzicht alle Artist Stores —— */
.pcs-stores-archive {
    position: relative;
    z-index: 1;
    padding-bottom: 2rem;
}

.pcs-stores-archive__intro {
    margin-bottom: 1.85rem;
}

.pcs-stores-archive__bento.pcs-bento {
    margin-bottom: 2rem;
}

.pcs-stores-archive__empty {
    margin: 3rem auto;
    max-width: 36ch;
    text-align: center;
    font-size: 1rem;
    color: var(--pcs-muted);
}

body.pcs-stores-archive .navigation.pagination {
    margin: 0 auto 3.5rem;
    padding: 0 clamp(1rem, 3vw, 1.5rem);
}

body.pcs-stores-archive .navigation.pagination .nav-links {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 0.45rem 0.65rem;
}

body.pcs-stores-archive .navigation.pagination .page-numbers {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 2.5rem;
    min-height: 2.5rem;
    padding: 0.35rem 0.7rem;
    border-radius: var(--pcs-radius-container, 9px);
    border: 1px solid rgba(255, 255, 255, 0.12);
    background: rgba(0, 0, 0, 0.42);
    color: var(--pcs-text-distribution, #e8e8e8);
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    text-decoration: none;
    transition:
        border-color var(--pcs-ease),
        background var(--pcs-ease),
        color var(--pcs-ease),
        box-shadow var(--pcs-ease);
}

body.pcs-stores-archive .navigation.pagination a.page-numbers:hover,
body.pcs-stores-archive .navigation.pagination a.page-numbers:focus-visible {
    border-color: color-mix(in srgb, var(--pcs-publishing-gold) 48%, transparent);
    color: var(--pcs-publishing-gold);
    box-shadow: 0 0 20px color-mix(in srgb, var(--pcs-publishing-gold) 14%, transparent);
    outline: none;
}

body.pcs-stores-archive .navigation.pagination .page-numbers.current {
    border-color: color-mix(in srgb, var(--pcs-distribution-blue) 42%, transparent);
    background: color-mix(in srgb, var(--pcs-distribution-blue) 20%, rgba(0, 0, 0, 0.55));
    color: #fff;
}

body.pcs-stores-archive .navigation.pagination .page-numbers.dots {
    border: none;
    background: transparent;
    min-width: auto;
    padding: 0.35rem 0.25rem;
    opacity: 0.55;
}