/* ==================================================================
     Layout. One centred column, matching the live theme section.
     ================================================================== */
  .tscsp{
    --sp-gap:16px;
    --sp-tile:215px;
    --sp-radius:12px;
    /* One set is 4 tiles and the 3 gaps between them, 4*215 + 3*16 = 908px,
       measured at 908. The loop travels one set plus the joining gap, 924px.
       At the live 25 px/s that is 37s. */
    --sp-set:calc(4 * var(--sp-tile) + 3 * var(--sp-gap));
    --sp-duration:37s;
    box-sizing:border-box;width:100%;background:var(--hx-paper-01);padding:0;
    display:flex;flex-direction:column;align-items:center;row-gap:32px;}
  .tscsp *,.tscsp *::before,.tscsp *::after{box-sizing:border-box;}

  .tscsp__title{
    max-width:800px;margin:0;padding:0 20px;text-align:center;
    font-family:var(--nss-h3-font-family,'Canela',serif);
    font-size:var(--nss-h3-font-size,48px);
    line-height:var(--nss-h3-line-height,48px);
    font-weight:var(--nss-h3-font-weight,400);
    letter-spacing:var(--nss-h3-letter-spacing,0px);
    color:var(--nss-color-scheme-2,var(--hx-ink-01));}

  .tscsp__reviews{width:100%;max-width:1328px;padding:0 20px;}

  /* ==================================================================
     Scrolling bar. Rebuild of <nss-scrolling-bar>, CSS only.
     ================================================================== */
  .tscsp__bar{position:relative;width:100%;overflow:hidden;}
  .tscsp__track{
    display:flex;gap:var(--sp-gap);width:max-content;will-change:transform;
    animation:tscsp-scroll var(--sp-duration) linear infinite;}
  .tscsp__set{display:flex;gap:var(--sp-gap);flex:none;}

  /* The loop travels exactly one set plus the gap joining it to the next, so
     copy 2 lands where copy 1 started and the seam is invisible. Deliberately
     an absolute length, not a percentage of the track: a percentage changes
     every time sp_copies changes, which is how the blank gap crept in. */
  @keyframes tscsp-scroll{
    from{transform:translate3d(0,0,0);}
    to{transform:translate3d(calc(-1 * (var(--sp-set) + var(--sp-gap))),0,0);}
  }
  .tscsp__bar:hover .tscsp__track{animation-play-state:paused;}

  .tscsp__tile{
    flex:none;width:var(--sp-tile);aspect-ratio:215/311;
    border-radius:var(--sp-radius);overflow:hidden;
    background-color:var(--nss-color-scheme-4,var(--hx-paper-03));}
  .tscsp__tile img,.tscsp__tile video{
    display:block;width:100%;height:100%;object-fit:cover;}

  @media (max-width:989px){
    .tscsp{--sp-gap:12px;--sp-tile:113px;--sp-radius:8px;
      /* 4*113 + 3*12 = 488, plus the joining gap = 500px, at 16.7 px/s */
      --sp-duration:30s;
      row-gap:24px;}
    .tscsp__title{
      font-size:var(--nss-h3-font-size-m,28px);
      line-height:var(--nss-h3-line-height-m,32px);
      max-width:300px;}
  }
  @media (prefers-reduced-motion:reduce){
    .tscsp__track{animation:none;}
  }
  /* ==================================================================
     Klaviyo widget. Port of the theme's own skin from nss-buybox.css,
     scoped to .tscsp. The doubled class names are kept because that is
     how both Klaviyo and the theme win their specificity fights. If the
     widget ever drifts from the PDP again, re-read that file rather
     than guessing at these values.
     ================================================================== */
  .tscsp .kl_reviews__summary__average_value.kl_reviews__summary__average_value{
    font-family:var(--nss-h6-font-family,'Canela',serif);
    color:var(--kl-reviews-reviews-primary-font-color,var(--hx-ink-01));
    margin-right:10px;font-size:32px;font-style:normal;font-weight:400;line-height:36px;}
  .tscsp .kl_reviews__summary__average_denominator.kl_reviews__summary__average_denominator{
    color:var(--Black,var(--hx-ink-02));text-align:center;
    font-family:var(--nss-h6-font-family,'Canela',serif);
    font-size:24px;font-style:normal;font-weight:400;line-height:28px;}
  .tscsp .kl_reviews__summary__stars__count.kl_reviews__summary__stars__count{
    color:var(--Black,var(--hx-ink-01));opacity:.75;
    font-family:'DM Sans',sans-serif;font-size:14px;font-style:normal;font-weight:500;line-height:normal;}

  .tscsp .kl_reviews__histogram__bar--background.kl_reviews__histogram__bar--background{
    background:var(--hx-ink-a-08);border-radius:4px;height:8px;}
  .tscsp .kl_reviews__histogram__bar--foreground.kl_reviews__histogram__bar--foreground{
    background:var(--nss-color-scheme-3,var(--hx-green-02));border-radius:4px;}

  .tscsp .kl_reviews__reviews_list.kl_reviews__reviews_list.kl_reviews__reviews_list button.kl_reviews__list__tab{
    font-family:var(--nss-h6-font-family,'Canela',serif);
    color:var(--nss-color-scheme-2,var(--hx-ink-02));
    font-size:24px;font-style:normal;font-weight:400;line-height:normal;}

  .tscsp .kl_reviews__reviews_list.kl_reviews__reviews_list.kl_reviews__reviews_list button.kl_reviews__button{
    box-sizing:border-box;display:inline-flex;justify-content:center;align-items:center;gap:10px;
    min-width:200px;height:48px;padding:9px 18px;margin-bottom:20px;
    border:1.5px solid var(--nss-color-scheme-2,var(--hx-ink-02));border-radius:99px;background-color:var(--hx-ink-a-02);
    color:var(--nss-color-scheme-2,var(--hx-ink-02));
    font-family:var(--nss-cta-large-font-family,'DM Sans',sans-serif);
    font-size:14px;font-style:normal;font-weight:700;line-height:20px;letter-spacing:-.01em;
    text-transform:var(--nss-cta-large-text-transform,none);
    transition:background-color .15s ease-in-out,color .15s ease-in-out,border-color .15s ease-in-out;}
  .tscsp .kl_reviews__reviews_list.kl_reviews__reviews_list.kl_reviews__reviews_list button.kl_reviews__button:hover{
    background-color:var(--nss-color-scheme-2,var(--hx-ink-02));
    color:var(--nss-color-scheme-1,var(--hx-paper-01));
    border-color:var(--nss-color-scheme-2,var(--hx-ink-02));}

  @media only screen and (max-width:989px){
    .tscsp .kl_reviews__summary__average_value.kl_reviews__summary__average_value{text-align:center;line-height:32px;}
    .tscsp .kl_reviews__summary__average_denominator.kl_reviews__summary__average_denominator{color:var(--Black,var(--hx-ink-01));line-height:24px;}
  }
  @media only screen and (min-width:990px){
    .tscsp .kl_reviews__reviews_list.kl_reviews__reviews_list.kl_reviews__reviews_list button.kl_reviews__list__tab{
      font-size:var(--nss-h6-font-size,28px);
      line-height:var(--nss-h6-line-height,32px);
      font-weight:var(--nss-h6-font-weight,400);}
  }

  /* The live PDP hides the widget's own heading and photo grid. */
  .tscsp .kl_reviews__summary__header.kl_reviews__summary__header,
  .tscsp .kl_reviews__summary__image_grid.kl_reviews__summary__image_grid,
  .tscsp .kl_reviews__summary.kl_reviews__summary.kl_reviews__summary h2{display:none;}