/* FullFish site motion layer: reveal-on-scroll, sticky glass header, progress bar, hover lift */
:root{--fx-ease:cubic-bezier(.16,1,.3,1)}
html{scroll-behavior:smooth}
.fx-progress{position:fixed;left:0;top:0;height:3px;width:100%;transform-origin:0 50%;transform:scaleX(0);background:linear-gradient(90deg,#F88A4B,#FFB347);z-index:1000;pointer-events:none}
header.fx-sticky{position:sticky;top:0;z-index:900;transition:background-color .4s var(--fx-ease),box-shadow .4s var(--fx-ease),backdrop-filter .4s var(--fx-ease)}
header.fx-sticky.fx-scrolled{background:rgba(255,255,255,.82)!important;-webkit-backdrop-filter:saturate(1.6) blur(14px);backdrop-filter:saturate(1.6) blur(14px);box-shadow:0 10px 30px -12px rgba(4,41,92,.25)}
.fx-rv{opacity:0;transform:translate3d(0,32px,0);filter:blur(6px);transition:opacity 1s var(--fx-ease),transform 1.1s var(--fx-ease),filter 1s var(--fx-ease);transition-delay:var(--fx-d,0s);will-change:opacity,transform}
.fx-rv.fx-in{opacity:1;transform:none;filter:none}
.fx-mask{clip-path:inset(0 0 100% 0 round 24px);transition:clip-path 1.4s var(--fx-ease)}
.fx-mask.fx-in{clip-path:inset(0 0 0 0 round 24px)}
a.ds-card,.fx-lift{transition:transform .5s var(--fx-ease),box-shadow .5s var(--fx-ease)}
a.ds-card:hover,.fx-lift:hover{transform:translateY(-6px);box-shadow:0 24px 48px -20px rgba(4,41,92,.35)}
[data-client]{transition:transform .5s var(--fx-ease),box-shadow .5s var(--fx-ease),border-color .5s}
[data-client]:hover{transform:translateY(-3px);border-color:#F88A4B!important;box-shadow:0 14px 30px -16px rgba(4,41,92,.35)}
span[title][aria-hidden="true"]{animation:fx-pulse 2.6s var(--fx-ease) infinite}
@keyframes fx-pulse{0%{box-shadow:0 0 0 0 rgba(248,138,75,.55)}70%{box-shadow:0 0 0 14px rgba(248,138,75,0)}100%{box-shadow:0 0 0 0 rgba(248,138,75,0)}}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .fx-rv,.fx-mask{opacity:1!important;transform:none!important;filter:none!important;clip-path:none!important;transition:none!important}
  span[title][aria-hidden="true"]{animation:none}
  a.ds-card:hover,.fx-lift:hover,[data-client]:hover{transform:none}
}
#catalogue{scroll-margin-top:96px}
[data-filter]:hover{border-color:#F88A4B!important}
[data-filter]:focus-visible{outline:3px solid #F88A4B;outline-offset:2px}
#catalogue article{transition:box-shadow .4s var(--fx-ease)}
[data-sku]{transition:transform .5s var(--fx-ease),box-shadow .5s var(--fx-ease),border-color .4s}
[data-sku]:hover{transform:translateY(-4px);border-color:#F88A4B!important;box-shadow:0 18px 36px -20px rgba(4,41,92,.4)}
[data-sku] img{transition:transform .6s var(--fx-ease)}
[data-sku]:hover img{transform:scale(1.06) rotate(-1.5deg)}
[data-sku-tab]:hover{border-color:#F88A4B!important}

/* compact sticky header on phones: logo + quote button on one row, menu as a swipeable strip */
@media (max-width:720px){
  header.fx-sticky{transition:transform .35s var(--fx-ease),background-color .4s var(--fx-ease),box-shadow .4s var(--fx-ease)}
  header.fx-sticky.fx-hide{transform:translateY(-100%)}
  header.fx-sticky > div{padding:8px 16px!important;gap:6px 12px!important;flex-wrap:wrap!important}
  header.fx-sticky > div > a:first-child img{height:40px!important}
  header.fx-sticky > div > a:last-child{padding:8px 14px!important;min-height:40px!important;font-size:14px!important}
  header.fx-sticky nav{order:3;flex:1 1 100%!important;flex-wrap:nowrap!important;overflow-x:auto;gap:0 20px!important;scrollbar-width:none;-webkit-overflow-scrolling:touch;margin:0 -16px;padding:0 16px;mask-image:linear-gradient(90deg,#000 85%,transparent)}
  header.fx-sticky nav::-webkit-scrollbar{display:none}
  header.fx-sticky nav a{white-space:nowrap;flex:0 0 auto;padding:10px 0!important;min-height:40px;box-sizing:border-box;display:inline-flex;align-items:center}
}
@media (max-width:520px){div:has(> [data-client]){grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:8px!important}[data-client]{height:60px!important;padding:8px!important;border-radius:10px!important}[data-client] img{max-height:36px}}
#top{scroll-margin-top:72px}
@media (max-width:720px){#welcome{height:max(calc(100svh - 174px), 420px)!important}}