/* Phase 14: premium, useful motion for the Paper product catalogue. */
.paper-catalogue-motion { overflow: clip; }

.paper-catalogue-motion .paper-catalogue__header { position: relative; isolation: isolate; margin-bottom: clamp(2rem, 4vw, 3rem); padding: clamp(2.2rem, 5vw, 4rem) clamp(1.35rem, 6vw, 5rem); overflow: hidden; border-radius: 1rem; color: #fff; background: linear-gradient(130deg, var(--pc-deep), color-mix(in srgb, var(--pc-primary) 54%, var(--pc-deep))); box-shadow: 0 1.6rem 3.6rem rgb(70 37 18 / 13%); }
.paper-catalogue-motion .paper-catalogue__header::before,
.paper-catalogue-motion .paper-catalogue__header::after { position: absolute; z-index: -1; border: 1px solid rgb(255 255 255 / 12%); border-radius: 50%; content: ""; }
.paper-catalogue-motion .paper-catalogue__header::before { width: 22rem; height: 22rem; top: -15rem; left: -6rem; }
.paper-catalogue-motion .paper-catalogue__header::after { width: 27rem; height: 27rem; right: -16rem; bottom: -19rem; box-shadow: 0 0 0 4rem rgb(255 255 255 / 2%); }
.paper-catalogue__eyebrow { display: block; margin-bottom: .8rem; color: var(--pc-accent); font-size: .68rem; font-weight: 800; letter-spacing: .19em; }
.paper-catalogue-motion .paper-catalogue__header h1 { color: #fff; font-size: clamp(2.25rem, 5vw, 4rem); }
.paper-catalogue-motion .paper-catalogue__header p { color: rgb(255 255 255 / 72%); }
.paper-catalogue__hero-line { width: min(11rem, 42%); height: 2px; margin: 1.4rem auto 0; overflow: hidden; background: rgb(255 255 255 / 13%); }
.paper-catalogue__hero-line i { display: block; width: 100%; height: 100%; background: linear-gradient(90deg, var(--pc-accent), var(--pc-primary)); transform: scaleX(0); transform-origin: left; transition: transform 1200ms cubic-bezier(.16, 1, .3, 1) 600ms; }

.paper-catalogue-motion .catalogue-layout { gap: clamp(1.5rem, 3.5vw, 2.5rem); }
.paper-catalogue-motion .filter-sidebar { position: relative; overflow: hidden; border-radius: .8rem; box-shadow: 0 1rem 2.5rem rgb(73 42 24 / 7%); }
.paper-catalogue-motion .filter-sidebar::before { position: absolute; inset: 0 auto 0 0; width: .2rem; background: linear-gradient(180deg, var(--pc-primary), var(--pc-accent)); content: ""; transform: scaleY(0); transform-origin: top; transition: transform 1050ms cubic-bezier(.16, 1, .3, 1) 280ms; }
.paper-catalogue-motion .filter-sidebar__group { transition: transform 300ms ease; }
.paper-catalogue-motion .filter-sidebar__group:focus-within { transform: translateX(.2rem); }
.paper-catalogue-motion .filter-sidebar__label { transition: color 250ms ease; }
.paper-catalogue-motion .filter-sidebar__group:focus-within .filter-sidebar__label { color: var(--pc-primary); }
.paper-catalogue-motion .filter-sidebar__input,
.paper-catalogue-motion .filter-sidebar__select { transition: border-color 250ms ease, box-shadow 300ms ease, background-color 300ms ease; }
.paper-catalogue-motion .filter-sidebar__group:focus-within :is(.filter-sidebar__input, .filter-sidebar__select) { background: color-mix(in srgb, var(--pc-surface) 28%, white); }
.paper-catalogue-motion .filter-sidebar__submit { min-height: 2.8rem; box-shadow: 0 .7rem 1.4rem rgb(254 85 0 / 14%); transition: background 260ms ease, color 260ms ease, transform 340ms cubic-bezier(.16, 1, .3, 1), box-shadow 340ms ease; }
.paper-catalogue-motion .filter-sidebar__submit:hover { transform: translateY(-.16rem); box-shadow: 0 .95rem 1.8rem rgb(254 85 0 / 22%); }

.paper-catalogue-motion .catalogue-results__count { display: flex; min-height: 2.55rem; align-items: center; padding: 0 1rem .75rem; }
.paper-catalogue-motion .catalogue-results__count strong { display: inline-grid; min-width: 1.7rem; height: 1.7rem; margin-inline: .35rem; place-items: center; border-radius: 50%; color: #fff; background: var(--pc-primary); font-size: .72rem; box-shadow: 0 .35rem .8rem rgb(254 85 0 / 18%); }
.paper-catalogue-motion .catalogue-card { position: relative; border-radius: .8rem; box-shadow: 0 .8rem 2rem rgb(73 42 24 / 6%); transition: border-color 300ms ease, box-shadow 400ms ease, transform 500ms cubic-bezier(.16, 1, .3, 1); }
.paper-catalogue-motion .catalogue-card:hover { transform: translateY(-.45rem); box-shadow: 0 1.4rem 2.8rem rgb(254 85 0 / 13%); }
.paper-catalogue-motion .catalogue-card__image { transition: transform 800ms cubic-bezier(.16, 1, .3, 1), background-color 400ms ease; }
.paper-catalogue-motion .catalogue-card:hover .catalogue-card__image { transform: scale(1.035); background: color-mix(in srgb, var(--pc-warm-surface) 75%, white); }
.paper-catalogue-motion .catalogue-card__cta { display: inline-flex; transition: color 250ms ease, transform 350ms cubic-bezier(.16, 1, .3, 1); }
.paper-catalogue-motion .catalogue-card:hover .catalogue-card__cta { transform: translateX(.22rem); }
.paper-catalogue-motion .catalogue-empty { padding: clamp(3rem, 8vw, 6rem) 1rem; border: 1px dashed var(--pc-border); border-radius: .8rem; background: color-mix(in srgb, var(--pc-surface) 55%, white); }

.catalogue-motion-ready [data-catalogue-reveal] { opacity: 0; transform: translateY(2rem); }
.catalogue-motion-ready [data-catalogue-reveal="hero"] { transform: translateY(1.3rem) scale(.993); transition: opacity 950ms ease, transform 1200ms cubic-bezier(.16, 1, .3, 1); }
.catalogue-motion-ready [data-catalogue-reveal="filters"] { transform: translateX(-2rem); transition: opacity 850ms ease, transform 1100ms cubic-bezier(.16, 1, .3, 1); }
.catalogue-motion-ready [data-catalogue-reveal="count"] { transform: translateY(.9rem); transition: opacity 650ms ease, transform 820ms cubic-bezier(.16, 1, .3, 1); }
.catalogue-motion-ready [data-catalogue-reveal="card"] { transform: perspective(55rem) translateY(2.4rem) rotateX(4deg); transform-origin: bottom; transition: opacity 720ms ease, transform 1000ms cubic-bezier(.16, 1, .3, 1), border-color 300ms ease, box-shadow 400ms ease; transition-delay: var(--catalogue-card-delay, 0ms); }
.catalogue-motion-ready [data-catalogue-reveal="empty"] { transform: translateY(1.8rem) scale(.985); transition: opacity 820ms ease, transform 1050ms cubic-bezier(.16, 1, .3, 1); }
.catalogue-motion-ready [data-catalogue-reveal="pagination"] { transition: opacity 700ms ease, transform 900ms cubic-bezier(.16, 1, .3, 1); }
.catalogue-motion-ready [data-catalogue-reveal].catalogue-is-visible { opacity: 1; transform: none; }
.catalogue-motion-ready [data-catalogue-reveal="hero"].catalogue-is-visible .paper-catalogue__hero-line i { transform: scaleX(1); }
.catalogue-motion-ready [data-catalogue-reveal="filters"].catalogue-is-visible::before { transform: scaleY(1); }
.catalogue-motion-ready [data-catalogue-filter] { opacity: 0; transform: translateX(-.7rem); transition: opacity 550ms ease, transform 720ms cubic-bezier(.16, 1, .3, 1); transition-delay: calc(260ms + var(--catalogue-filter-delay, 0ms)); }
.catalogue-motion-ready .catalogue-is-visible [data-catalogue-filter] { opacity: 1; transform: none; }

@media (min-width: 48rem) {
  .paper-catalogue-motion .filter-sidebar { position: sticky; top: 6.5rem; align-self: start; }
}

@media (max-width: 47.99rem) {
  .catalogue-motion-ready [data-catalogue-reveal="filters"] { transform: translateY(1.75rem); }
  .catalogue-motion-ready [data-catalogue-reveal].catalogue-is-visible { transform: none; }
}

@media (max-width: 35rem) {
  .paper-catalogue-motion .paper-catalogue__header { padding-inline: 1.15rem; }
  .paper-catalogue-motion .catalogue-card:hover { transform: translateY(-.25rem); }
}

@media (prefers-reduced-motion: reduce) {
  .paper-catalogue-motion *,
  .paper-catalogue-motion *::before,
  .paper-catalogue-motion *::after { animation: none !important; transition-duration: .01ms !important; transition-delay: 0ms !important; }
  .catalogue-motion-ready [data-catalogue-reveal],
  .catalogue-motion-ready [data-catalogue-filter] { opacity: 1; transform: none; }
}