/* Phase 16: premium motion and interaction for the Dolfin catalogue. */
.dolfin-catalogue-motion { max-width: 78rem; overflow: clip; }

.dolfin-catalogue-motion .dolfin-catalogue__header { position: relative; isolation: isolate; margin-bottom: clamp(2rem, 4vw, 3rem); padding: clamp(2.25rem, 5vw, 4.25rem) clamp(1.35rem, 6vw, 5rem); overflow: hidden; border-radius: .65rem; color: #fff; text-align: center; background: linear-gradient(128deg, #051923, color-mix(in srgb, var(--df-blue, #0079b8) 66%, #051923)); box-shadow: 0 1.7rem 3.8rem rgb(1 31 46 / 16%); }
.dolfin-catalogue-motion .dolfin-catalogue__header::before,
.dolfin-catalogue-motion .dolfin-catalogue__header::after { position: absolute; z-index: -1; border: 1px solid rgb(255 255 255 / 12%); border-radius: 50%; content: ""; }
.dolfin-catalogue-motion .dolfin-catalogue__header::before { width: 23rem; height: 23rem; top: -16rem; left: -7rem; }
.dolfin-catalogue-motion .dolfin-catalogue__header::after { width: 29rem; height: 29rem; right: -17rem; bottom: -21rem; box-shadow: 0 0 0 4.5rem rgb(255 255 255 / 2%); }
.dolfin-catalogue__eyebrow { display: block; margin-bottom: .8rem; color: #f26a21; font-size: .68rem; font-weight: 800; letter-spacing: .19em; }
.dolfin-catalogue-motion .dolfin-catalogue__header h1 { color: #fff; font-size: clamp(2.15rem, 5vw, 4rem); }
.dolfin-catalogue-motion .dolfin-catalogue__header p { max-width: 43rem; margin-inline: auto; color: rgb(255 255 255 / 72%); }
.dolfin-catalogue__hero-track { width: min(12rem, 44%); height: 2px; margin: 1.45rem auto 0; overflow: hidden; background: rgb(255 255 255 / 13%); }
.dolfin-catalogue__hero-track i { display: block; width: 100%; height: 100%; background: linear-gradient(90deg, #f26a21, #29a8e8); transform: scaleX(0); transform-origin: left; transition: transform 1250ms cubic-bezier(.16, 1, .3, 1) 600ms; }

.dolfin-catalogue-motion .catalogue-layout { gap: clamp(1.5rem, 3.5vw, 2.6rem); }
.dolfin-catalogue-motion .filter-sidebar { overflow: hidden; border-radius: .65rem; box-shadow: 0 1.2rem 2.8rem rgb(1 39 57 / 8%); }
.dolfin-catalogue-motion .filter-sidebar__group { transition: transform 300ms ease; }
.dolfin-catalogue-motion .filter-sidebar__group:focus-within { transform: translateX(.2rem); }
.dolfin-catalogue-motion .filter-sidebar__label { transition: color 250ms ease; }
.dolfin-catalogue-motion .filter-sidebar__group:focus-within .filter-sidebar__label { color: #0079b8; }
.dolfin-catalogue-motion :is(.filter-sidebar__input, .filter-sidebar__select) { transition: border-color 250ms ease, box-shadow 300ms ease, background-color 300ms ease; }
.dolfin-catalogue-motion .filter-sidebar__group:focus-within :is(.filter-sidebar__input, .filter-sidebar__select) { background: color-mix(in srgb, #eaf7fc 35%, white); box-shadow: 0 .65rem 1.4rem rgb(0 93 133 / 9%); }
.dolfin-catalogue-motion .filter-sidebar__btn { box-shadow: 0 .75rem 1.45rem rgb(0 105 155 / 16%); transition: background 260ms ease, transform 340ms cubic-bezier(.16, 1, .3, 1), box-shadow 340ms ease; }
.dolfin-catalogue-motion .filter-sidebar__btn:hover { transform: translateY(-.16rem); box-shadow: 0 1rem 1.9rem rgb(0 105 155 / 24%); }

.dolfin-catalogue-motion .catalogue-toolbar { min-height: 3rem; padding-inline: .8rem; border-radius: .5rem; background: color-mix(in srgb, #eaf7fc 55%, white); }
.dolfin-catalogue-motion .catalogue-toolbar__count { font-weight: 700; }
.dolfin-catalogue-motion .dolfin-card { border-radius: .65rem; box-shadow: 0 .8rem 2rem rgb(1 39 57 / 7%); transition: opacity 720ms ease, transform 1000ms cubic-bezier(.16, 1, .3, 1), border-color 300ms ease, box-shadow 420ms ease; }
.dolfin-catalogue-motion .dolfin-card:hover { transform: translateY(-.45rem); box-shadow: 0 1.45rem 2.9rem rgb(0 94 139 / 15%); }
.dolfin-catalogue-motion .dolfin-card__image img { transition: transform 850ms cubic-bezier(.16, 1, .3, 1); }
.dolfin-catalogue-motion .dolfin-card:hover .dolfin-card__image img { transform: scale(1.045) rotate(-1deg); }
.dolfin-catalogue-motion .dolfin-card__btn { transition: color 260ms ease, background 260ms ease, transform 320ms cubic-bezier(.16, 1, .3, 1); }
.dolfin-catalogue-motion .dolfin-card__btn:hover { transform: translateY(-.12rem); }
.dolfin-catalogue-motion .catalogue-empty { border: 1px dashed #bfd8e4; border-radius: .65rem; background: linear-gradient(145deg, #f3fbfe, #fff); box-shadow: 0 1rem 2.5rem rgb(1 39 57 / 6%); }

.dolfin-catalogue-motion-ready [data-dolfin-catalogue-reveal] { opacity: 0; transform: translateY(2rem); }
.dolfin-catalogue-motion-ready [data-dolfin-catalogue-reveal="hero"] { transform: translateY(1.25rem) scale(.993); transition: opacity 950ms ease, transform 1250ms cubic-bezier(.16, 1, .3, 1); }
.dolfin-catalogue-motion-ready [data-dolfin-catalogue-reveal="toolbar"] { transform: translateY(.8rem); transition: opacity 650ms ease, transform 820ms cubic-bezier(.16, 1, .3, 1); }
.dolfin-catalogue-motion-ready [data-dolfin-catalogue-reveal="card"] { transform: perspective(60rem) translateY(2.5rem) rotateX(5deg); transform-origin: bottom; transition-delay: var(--dolfin-catalogue-card-delay, 0ms); }
.dolfin-catalogue-motion-ready [data-dolfin-catalogue-reveal="pagination"] { transition: opacity 700ms ease, transform 900ms cubic-bezier(.16, 1, .3, 1); }
.dolfin-catalogue-motion-ready [data-dolfin-catalogue-reveal="empty"] { transform: translateY(1.8rem) scale(.985); transition: opacity 820ms ease, transform 1050ms cubic-bezier(.16, 1, .3, 1); }
.dolfin-catalogue-motion-ready [data-dolfin-catalogue-reveal].dolfin-catalogue-is-visible { opacity: 1; transform: none; }
.dolfin-catalogue-motion-ready [data-dolfin-catalogue-reveal="hero"].dolfin-catalogue-is-visible .dolfin-catalogue__hero-track i { transform: scaleX(1); }

@media (min-width: 56.25rem) {
  .dolfin-catalogue-motion-ready [data-dolfin-catalogue-filters] { opacity: 0; transform: translateX(-2rem); transition: opacity 850ms ease, transform 1100ms cubic-bezier(.16, 1, .3, 1), box-shadow 420ms ease; }
  .dolfin-catalogue-motion-ready [data-dolfin-catalogue-filters].dolfin-catalogue-filters-visible { opacity: 1; transform: none; }
  .dolfin-catalogue-motion-ready [data-dolfin-filter-field] { opacity: 0; transform: translateX(-.7rem); transition: opacity 540ms ease, transform 700ms cubic-bezier(.16, 1, .3, 1); transition-delay: calc(250ms + var(--dolfin-filter-delay, 0ms)); }
  .dolfin-catalogue-motion-ready .dolfin-catalogue-filters-visible [data-dolfin-filter-field] { opacity: 1; transform: none; }
}

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

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