/** Shopify CDN: Minification failed

Line 241:0 Unexpected "`"
Line 241:38 Expected ":"
Line 243:82 Unexpected "/"

**/
/*-----------------------------------------------------------------------------/
/ Custom Theme CSS
/-----------------------------------------------------------------------------*/
/*---------------- Global Custom CSS -------------------*/.t4s-tabs-inline .t4s-tabs-head {    align-items: flex-end;}
input#CustomerPassword {
    display: none;
}/*---------------- Custom CSS for only desktop -------------------*/
@media (min-width: 1025px) {}

/*---------------- Custom CSS for tablet, mobile -------------------*/
@media (max-width:1024px) {}

/*---------------- Custom CSS for only tablet -------------------*/
@media (min-width: 768px) and (max-width:1024px) {}

/*---------------- Custom CSS for only mobile -------------------*/
@media (max-width:767px){}

/*================= JOUW MAATWERK =================*/

/* Collectie-header z-index fix op mobiel */
@media (max-width:767px){
  .t4s-lock-scroll .t4s-collection-header{
    z-index:999;
  }
  .t4s-collection-header{
    z-index:99;
  }
}

/* Link-styling in collectie-omschrijving */
.t4s-desc-collection a{
  border-bottom: 1px solid currentColor;
  padding-bottom: 1px;
}

/* Product tile pseudo-element uitzetten */
.t4s-product .t4s-product-inner:before{
  display:none;
}

/* Breadcrumb breedte fix */
.breadcrumb_inner_div { 
  max-width: 1400px;
  width: 100%;
  margin: 0 auto;
  padding: 0;
}

/* Extra marge tussen producten op kleine schermen */
@media (max-width:680px){
  .t4s_box_pr_grid.t4s-products .t4s-col-item{
    margin-top: 35px;
  }
}
 
/* "Vanaf"-prijs verbergen */
.t4s-price-from{
  display:none !important;
}

/*---------------- FIX 1: Geen globale smooth scroll (voorkomt scroll-jank) --------*/
html,
body {
  scroll-behavior: auto !important;
}

/*---------------- FIX 3: Scroll-animaties uitschakelen op mobiel ------------------*/
/* Dit voorkomt dat blokken/foto’s bij terug omhoog scrollen opnieuw in-faden
   en daardoor "knipperen" op phones. */
@media (max-width: 1024px) {
  .hdt-reveal-in-view [hdt-reveal],
  .hdt-reveal-in-view [hdt-reveal="fade-in"],
  .hdt-reveal-in-view [hdt-reveal="slide-in"] {
    opacity: 1 !important;
    transform: none !important;
    animation: none !important;
  }
}

/*================= COLLECTIEPAGINA – HOVER & EERSTE FOTO =================*/

/* 1. Collectiepagina: altijd eerst 1e foto tonen */
.template-collection .t4s-product-main-img,
.template-collection .t4s-product-hover-img {
  position: relative;
}

/* standaard: foto 1 boven hover-foto */
.template-collection .t4s-product-main-img {
  z-index: 2;
}

.template-collection .t4s-product-hover-img {
  z-index: 1;
}

/* bij hover / tap: hover-foto bovenop */
.template-collection .t4s-product-inner:hover .t4s-product-hover-img,
.template-collection .t4s-product-inner.is-hover .t4s-product-hover-img,
.template-collection .t4s-product-inner:focus-within .t4s-product-hover-img {
  z-index: 3;
}

/* 2. Op collectie-pagina’s overal dezelfde rustige fade-hover */
.template-collection .t4s-product-img img {
  transition: opacity .5s ease !important;
  transform: none !important;
}

/* hover-foto standaard onzichtbaar */
.template-collection .t4s-product-hover-img {
  opacity: 0;
}

/* bij hover/tap fade de hover-foto rustig in */
.template-collection .t4s-product-inner:hover .t4s-product-hover-img,
.template-collection .t4s-product-inner.is-hover .t4s-product-hover-img,
.template-collection .t4s-product-inner:focus-within .t4s-product-hover-img {
  opacity: 1;
}

/* speciale effecten (zoom / slide / flip / rotate) uit op collectie-pagina's
   zodat rij 1 en 2 niet meer verschillen */
.template-collection .pr_img_effect_2 .t4s-product-hover-img,
.template-collection .pr_img_effect_2 .t4s-product-main-img,
.template-collection .pr_img_effect_3 .t4s-product-hover-img,
.template-collection .pr_img_effect_3 .t4s-product-main-img,
.template-collection .pr_img_effect_4 .t4s-product-hover-img,
.template-collection .pr_img_effect_4 .t4s-product-img,
.template-collection .pr_img_effect_5 .t4s-product-hover-img,
.template-collection .pr_img_effect_5 .t4s-product-main-img {
  transform: none !important;
}

/* Klikbare productlink terug boven de afbeeldingen (collectie) */
.template-collection .t4s-product-inner {
  position: relative;
  z-index: 5;
}

.template-collection .t4s-product-img {
  position: relative;
  z-index: 1;
}

.template-collection .t4s-product-main-img,
.template-collection .t4s-product-hover-img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  z-index: 2;
  pointer-events: none; /* klik gaat via de link, niet via img */
}

/*================= iOS SAFARI FIX – PRODUCTPAGINA KNIPPEREN =================*/
/* Alleen op touch WebKit (iPhone/iPad) + mobiel formaat */
@supports (-webkit-touch-callout: none) {
  @media (max-width: 767px) {

    /* Lazyload fade op productfoto’s uitzetten (voorkomt opnieuw in-faden bij scroll) */
    .template-product .t4s-lz--fadeIn {
      opacity: 1 !important;
      transition: none !important;
    }

    /* Skeleton / wacht-animaties op product media uit */
    .template-product .t4s-wait--data,
    .template-product .t4s-lzcus-true .t4s-loading--bg {
      -webkit-animation: none !important;
      animation: none !important;
      will-change: auto !important;
    }

    /* Zorg dat product media wrapper niet geanimeerd / getransformed wordt */
    .template-product .t4s-product__media-wrapper,
    .template-product .t4s-product__media-item,
    .template-product .t4s-product__media-wrapper img,
    .template-product .t4s-product__media-wrapper picture {
      transform: none !important;
      transition: none !important;
      will-change: auto !important;
      -webkit-backface-visibility: visible !important;
      backface-visibility: visible !important;
    }
  }
}
/* === iOS Safari fix: knipperende productpagina === */
/* Alleen op iOS WebKit (iPhone/iPad) én kleine schermen */
@supports (-webkit-touch-callout: none) {
  @media (max-width: 820px) {

    /* 1. Sticky header UIT op de productpagina
       -> geen 2 sticky elementen die met elkaar vechten */
    .template-product .shopify-section-header-sticky,
    .template-product .t4sp-sticky .t4s-section-header.shopify-section-header-sticky {
      position: relative !important;
      top: 0 !important;
      box-shadow: none !important;
    }

    /* 2. Sticky product-info UIT op mobiel
       (die kolom rechts met prijs/knoppen) */
    .template-product .t4s-product__info-container--sticky {
      position: static !important;
      top: auto !important;
      z-index: auto !important;
    }

    /* 3. Lazyload / fade-in op de grote productfoto UIT
       zodat Safari bij terugscrollen niet opnieuw gaat animeren */
    .template-product .t4s-product__media-wrapper .t4s-lz--fadeIn,
    .template-product .t4s-product__media-wrapper img,
    .template-product .t4s-product__media-wrapper picture {
      opacity: 1 !important;
      transform: none !important;
      transition: none !important;
      will-change: auto !important;
    }

    /* 4. Loader-overlay verstoppen bovenop de foto
       (die kan anders ook flitsen bij scroll) */
    .template-product .t4s-product__media-wrapper .lazyloadt4s-loader {
      display: none !important;
      opacity: 0 !important;
      visibility: hidden !important;
      z-index: -1 !important;
    }
  }
}
.t4s-section-header.animate { transition: transform .15s ease-out; }
.shopify-section-header-hidden { transform: translateY(-100%); }
``` :contentReference[oaicite:0]{index=0}  

Dat is prima op desktop, maar op iPhone + productpagina zorgt het samen met sticky/lazyload voor dat geflits.

👉 **Fix:** zet op **iOS + productpagina** de header gewoon vast en haal de animatie weg.

**Plak dit ONDERAAN `custom.css.liquid`:**

```css
/* === iOS Safari: header op productpagina niet meer laten wegschuiven === */
@supports (-webkit-touch-callout: none) {
  @media (max-width: 820px) {

    /* Header niet sticky maken op productpagina */
    .template-product .shopify-section-header-sticky,
    .template-product .t4sp-sticky .t4s-section-header.shopify-section-header-sticky {
      position: relative !important;
      top: 0 !important;
      box-shadow: none !important;
    }

    /* Animatie van de header uit */
    .template-product .t4s-section-header.animate {
      transition: none !important;
    }

    /* Zorg dat 'hidden'-klasse de header NIET meer wegtranslatet */
    .template-product .shopify-section-header-hidden {
      transform: none !important;
    }
  }
}
/* === Collectiepagina: ALTIJD foto 1 als startbeeld, ook in Safari desktop === */
.template-collection .t4s-product-main-img {
  opacity: 1 !important;
}

.template-collection .t4s-product-hover-img {
  opacity: 0 !important;
}

/* Bij hover / tap mag foto 2 inblenden */
.template-collection .t4s-product-inner:hover .t4s-product-hover-img,
.template-collection .t4s-product-inner.is-hover .t4s-product-hover-img,
.template-collection .t4s-product-inner:focus-within .t4s-product-hover-img {
  opacity: 1 !important;
}
/* Info-icoon altijd perfect rond */
.rolcalc_info_btn {
  width: 22px !important;
  height: 22px !important;
  min-width: 22px !important;
  min-height: 22px !important;

  border-radius: 50% !important;
  padding: 0 !important;

  display: flex;
  align-items: center;
  justify-content: center;

  line-height: 1 !important;
  font-size: 13px;
}

/* Het i-tje gecentreerd */
.rolcalc_info_btn span {
  display: block;
  line-height: 1;
  margin-top: -1px; /* optioneel micro-tweak */
}
/* Hele rij (titel + levertijd) krijgt vaste minimale hoogte */
.t4s-pr_delivery_wrap {
  min-height: 40px;         /* eventjes mee spelen, maar rond 36–44px is top */
  align-items: center;
}

/* De tekst zelf niet laten 'ploppen' */
.t4s-pr_delivery_content {
  display: block;
}

/* ACTUELE VOORRAAD / stock badge stabiel houden */
.stock-badge {
  display: inline-flex;
  align-items: center;
  min-height: 32px;
}