/** Shopify CDN: Minification failed

Line 672:32 Expected identifier but found "!"
Line 958:19 Expected identifier but found whitespace
Line 958:21 Unexpected "{"
Line 958:34 Expected ":"

**/

/* Prevent horizontal page drag on mobile caused by elements wider than viewport */
html, body {
  overflow-x: hidden;
}

:root {
    --container-radius: 0.6rem;
    --box-radius: 0.4rem;
    --side-spacing: 0.7rem;
    --top-spacing: 0.7rem;
    --text-size-base: 15px;
    --font-size-multiplier: 1;
    --site-top-margin: 0rem;
    --responsive-max-width: 100%;
    --window-bottom-safe-space: 100vh-100svh;
    @media (min-width: 768px) {
      --font-size-multiplier: 1.3;
    }
    @media (min-width: 992px) {
      --text-size-base: 16px;
      --font-size-multiplier: 1.4;
      --side-spacing: 1.1rem;
      --top-spacing: 0.7rem;
      --responsive-max-width: 1100px;
    }
    @media (min-width: 1200px) {
      --font-size-multiplier: 1.5;
      --responsive-max-width: 1100px;
      --max-container-height: 900px;
      --site-top-margin: 1.5rem;

    }
    @media (min-width: 1400px) {
        --responsive-max-width: 1200px;
        --site-top-margin: 2rem;
      }
    @media (min-width: 1600px) {
        --responsive-max-width: 1250px;
        --text-size-base: 17px;
        --site-top-margin: 2.5rem;
      }
    @media (min-width: 1800px) {
        --responsive-max-width: 1300px;
        --site-top-margin: 3rem;
      }

    --site-max-width: calc(var(--responsive-max-width) - 2 * var(--side-spacing));
    --headline-size-xs: calc(1rem * var(--font-size-multiplier));
    --headline-size-s: calc(1.3rem * var(--font-size-multiplier));
    --headline-size-m: calc(1.6rem * var(--font-size-multiplier));
    --headline-size-l: calc(2.4rem * var(--font-size-multiplier));
    --headline-size-xl: calc(2.8rem * var(--font-size-multiplier));
    --color-lavender: #dad4ff; 
    --color-lavender2: #bfa1ff;
    --color-green: #e6ffa2;
    --color-green2: #b4ed4d;
    --color-sand: #fdfdf4;
    --color-sand2: #ebe6d6;
    --color-orange: #fdffaa;
    --color-orange2: #fff275;

    --shopify-accelerated-checkout-inline-alignment: right;
}

/*************    |     LAYOUT     |   *************/

.header-section-overlap:not(.nav-opaque) .product-area .product-area__media {
  margin-top: 0 !important;
}

.section-spacing > *, .product-area__details {
  padding-left: var(--side-spacing) !important;
  padding-right: var(--side-spacing) !important;
}

 .section-footer .wide-container {
   padding-left: 0 !important;
   padding-right: 0 !important;
 }

/*** collection padding optimization / Disabled because works for 2 columns only
div[data-section-type="collection-template"] {
  .wide-container {
    padding: 0 !important; 
  }
  .product-block {
    padding: 0 !important; 
    padding-left: var(--side-spacing) !important;
    width: calc(50% - var(--side-spacing) / 2) !important;   
  }
   .product-block a:not(.image-inner) {
    padding-left: calc(var(--side-spacing)) !important;
    padding-right: calc(var(--side-spacing)) !important;
    display: block;
  }
}

***/

.section-spacing {
  padding-left: 0;
  padding-right: 0;
}


.template-collection {
  .wide-container, .product-list {
    padding: 0 !important;
  }
  .product-block a.caption, div.central {
    padding-left: var(--side-spacing) !important;
    padding-right: var(--side-spacing) !important;
  }
  div.central {
    margin: 0 !important;
  }
  h1.feature-header {
    margin-bottom: 0;
  }
}

#site-control {
  top: var(--site-top-margin);
}

#site-control.has-announcement {
  margin-top: 45px;
  transition: margin 0.6s;
}
.scrolled-down #site-control.has-announcement {
  margin-top: 0px;
}

.cc-announcement {
  height: 45px;
  transition: height 0.6s !important;
}
.cc-announcement span {
    text-decoration: underline;
}
.scrolled-down .cc-announcement {
  height: 0px;
}

.cc-announcement .cc-announcement__inner {
  font-weight: 500;
}

/* announcement at the top becaus no section overlay of header */
body:not(.header-section-overlap) #shopify-section-header {
  overflow: visible;
}
body:not(.header-section-overlap) .cc-announcement {
  top: calc(-1 * var(--nav-height));
}

#page-content {
  top: var(--site-top-margin);
}

.section-spacing.container {
  width: auto;
}

.container, .content, .reading-width {
  max-width: none;
}

.text-column__text p:first-child {
    margin-top: 0.2em !important;
}

.shopify-section:not(#shopify-section-header, #shopify-section-popup), .cc-popup-modal {
  margin-left: var(--side-spacing);
  margin-right: var(--side-spacing);
  margin-top: var(--top-spacing);
  margin-bottom: 0px;
  border-radius: var(--container-radius); -webkit-border-radius: var(--container-radius); transform: translateZ(0); 
  /* overflow:hidden !important; breaks sticky product info */ 
  max-width: var(--site-max-width);
  @media (min-width: 1100px) {
    margin-left: auto;
    margin-right: auto;
  }
}

@media (max-width: 767px) {
.image-with-text .padded-block {
  padding: calc(var(--side-spacing) * 2) var(--side-spacing);
  /* margin-bottom: calc(var(--side-spacing) * 2); */
}
}

.image-with-text__image__inner {
  border-radius: var(--container-radius);
  overflow: hidden;
  display: block;
}

.cc-popup .cc-popup-modal {
  padding: calc(var(--side-spacing) * 2) !important;
  margin: calc(var(--side-spacing) * 2) !important;
  color: #000 !important;
  max-width: calc(100vw - 4 * var(--side-spacing));
}

.cc-popup .cc-popup-modal .rte {
  text-align: left;
}

.cc-popup .cc-popup-modal h2 {
  line-height: 1 !important;
}

.cc-popup {
  z-index: 9999999999 !important;
}

.theme-modal > .inner .growth-area {
  align-items: flex-end;
  padding-top: 30px;
}

.main-nav ul li {
  text-align: right;
}

@media (min-width: 1441px) {
    .site-control .cart {
        right: 0;
    }
}

@media (max-width: 1100px) {
.links.site-control__inner {
    justify-content: left !important;
  }
  #shopify-section-header a.menu {
        right: var(--side-spacing) !important;
        left: auto;
    }
    #shopify-section-header a.cart {
        right: calc(48px + var(--side-spacing)) !important;
    }
}

#page-menu > .inner {
  justify-content: center;
}

.logo img {
  margin-left: 0;
}


/*************    |     STYLES     |   *************/

/* optimize jumping of first section if it overlaps with header */
body {
  transition: padding 0.5s;
}
/* list pages where first section overlaps to not have content jump up later */
.page-studio-sonntag-xo-hocker-und-sidetable, .page-xo-farbmuster-set, .page-studio-sonntag-about, .page-studio-sonntag-liebenswerte-objekte, .page-studio-sonntag-xo-ein-mobel-mit-personlichkeit {
  padding-top: 0;
}

:root, body, #page-content h1, h2, #page-content h2, h3, h4, h5, h6, div, p, a, label {
  font-family: "neue-haas-grotesk-display", sans-serif !important;
  font-family: "neue-haas-grotesk-display", sans-serif !important;
  font-weight: 300;
  line-height: 1.2;
}

/* Funnel Display for all headlines */
#page-content h1, #page-content h2, h3, h4, h5, h6 {
  /*font-family: "Funnel Display", sans-serif !important;*/
  font-family: "Syne", sans-serif !important;
  letter-spacing: -3%;
}

div.price {
  font-weight: 500;
}

:root, body, div, p, a, label {
  letter-spacing: 0.05rem !important;
}


.color-bg {
  overflow: hidden;
}

.color-bg.green {
  background: linear-gradient(150deg, var(--color-green) 0%, var(--color-green2) 100%);
}
.color-bg.yellow {
  background: linear-gradient(150deg, #ffffca 0%, #faffa8 100%);
}
.color-bg.sand {
  background: linear-gradient(150deg, var(--color-sand) 0%, var(--color-sand2) 100%);
}
.color-bg.orange {
  background: linear-gradient(150deg, var(--color-orange) 0%, var(--color-orange2) 100%);
}
.color-bg.lavender {
background: linear-gradient(150deg, var(--color-lavender) 0%, var(--color-lavender2) 100%);
}

#shop-hcaptcha-badge-container {
  display: none !important;
}

table th {
  text-align: left;
  font-weight: 500;
}

/* price transparency */
.price-transparency-table1 th {
  background: var(--color-orange);
}
.price-transparency-table2 th{
  background: var(--color-green);
}
th:first-child {
  border-top-left-radius: var(--container-radius);
  border-bottom-left-radius: var(--container-radius);
}
th:last-child {
  border-top-right-radius: var(--container-radius);
  border-bottom-right-radius: var(--container-radius);
}

/* FOOTER */

.section-footer .section-footer__newsletter-block .signup-form form button {
  right: 1em;
}
.social-links {
  padding-top: 0;
}
.section-footer .section-footer__text-block {
  margin-bottom: 0;
}
.section-footer__row-container {
  margin-bottom: 0;
}
.section-footer .section-footer__row-lower {
  padding-top: 2em !important;
  padding-bottom: 0 !important;
  border-top: 1px solid #eee;
}
.section-footer .section-footer__payment-icons {
  margin-bottom: 2em;
}
.copyright {
  display: none;
}

/* swap order of image and text for german design award badge */
.section-footer__row__col.section-footer__text-block:first-child {
  display: flex;
  flex-direction: column;
}

.section-footer__row__col.section-footer__text-block:first-child .section-footer__text-block__image {
  order: 2;
}

.section-footer__row__col.section-footer__text-block:first-child .section-footer__title {
  order: 1;
}



/* NAV */
.site-control.nav-inline-desktop .site-control__inner .nav-row a, #page-menu a {
  font-weight: 500;
}
body:not(.customer-logged-in) .nav-right-side .nav-account, .nav-footer-links { /* hide link to shopify account */
  display: none !important;
}
body .site-control {
  transition: background .3s !important;
  z-index: 99 !important;
}
@media (hover: hover) {
  body:not(.use-alt-logo):not(.modal-active) .site-control:hover .site-control__inner a, body:not(.use-alt-logo):not(.modal-active) .site-control:hover .site-control__inner svg, body:not(.use-alt-logo):not(.modal-active) .site-control:hover .site-control__inner .cart {
    color: #000 !important;
    fill: #000 !important;
  }
  body:not(.use-alt-logo):not(.modal-active) .site-control:hover .site-control__inner .menu .icon-menu span.icon-menu__bar {
    background: #000 !important;
  }
  body:not(.use-alt-logo):not(.modal-active) .site-control:hover {
    background-color: #ffffffe3 !important;
  }
  body:not(.use-alt-logo):not(.modal-active) .site-control.nav-inline-desktop:hover.alt-logo-when-active .logo.logo--has-alt-logo>img {
    opacity: 1;
  }
  body:not(.use-alt-logo):not(.modal-active) .site-control.nav-inline-desktop:hover.alt-logo-when-active .logo.logo--has-alt-logo .alt-logo img {
    opacity: 0;
  }
}

#shopify-section-header .links.site-control__inner {
  margin: var(--side-spacing);
  margin-top: var(--top-spacing);
  margin-bottom: 0;
  padding: var(--side-spacing);
  position: relative;
  min-height: 0 !important;
  transition: margin .5s;
  max-width: var(--site-max-width);
  @media (min-width: 1100px) {
    margin-left: auto;
    margin-right: auto;
  }
}

body.scrolled-down #shopify-section-header .links.site-control__inner {
  margin-top: 0;
}

#site-control {
transition: top .5s !important;
}
body.scrolled-down #site-control {
  top: 0;
}

/* Added to cart */
#added-to-cart>.inner {
    background: #000;
    border-radius: var(--box-radius);
}
#added-to-cart .links a.button.alt {
    box-shadow: 0 0 0 1px #fff;
    color: #fff !important;
  background: transparent;
}
#added-to-cart .links a.button--checkout, #added-to-cart .links a.button--checkout:hover  {
    background: #fff !important;
    color: #000 !important;
}
#added-to-cart .links a.button:hover {
    transform: scale(1.05);
}
@media (max-width: 767px) {
.modal-active[data-modal-id=added-to-cart] .site-control {
    background-color: #000 !important;
}
  #added-to-cart>.inner {
    border-radius: 0;
  }
}

cart-form .under-cart, cart-form form {
  text-align: center;
}

@media (max-width: 767px) {
  .inline-mini-form.inline-mini-form--arrow {
    width: 100%;
  }
}
@media (min-width: 768px) {
    .inline-mini-form.inline-mini-form--arrow:not(.mt-0) {
        margin-top: 1em;
    }
}


/* override theme spacing to make logo left-aligned */
@media (min-width: 1100px) {
  .site-control.nav-inline-desktop .site-control__inner .logo {
      left: 0 !important;
  }
}

a.cart.nav-search {
  display: none !important;
}

body div {
  h1.thin, h2.thin, h3.thin, h4.thin, h1 em, h2 em {
    font-weight: 100 !important;
    font-style: normal;
  }
  p, div {
    line-height: 1.4 !important;
  }
  p {
    margin-top: 0;
  }
}

h1:not(.logo-h1), h2, h3, h4, .under-cart .subtotal, blockquote, h5, h6 {
  text-align: left;
  line-height: 1.1;
}

body b, body strong {
  font-weight: 500;
  margin-top: 0;
}

body div {
  h1, h2, h3, h4, .section-footer__title {
    font-weight: 400 !important;
    letter-spacing: 0;
  }
  h1.line-1, h2.line-1, .line-2 h1, .line-2 h2, .line-2 p {
      font-weight: 500 !important;
      letter-spacing: 0;
    }
} 

/* Responsive font sizing */
html, body, .feature-subheader, label, .overlay-type .line-2 {
  font-size: var(--text-size-base) !important;
}
button, input, textarea, #page-content a {
  font-size: var(--text-size-base);
}
.shopify-section .line-2 h1, .shopify-section .line-2 h2, .shopify-section .line-2 p {
  font-size: var(--headline-size-xs) !important;
}
.shopify-section h1, .shopify-section h2, h1 .typed-cursor, .product-area h2 {
  line-height: 1.1 !important;
  font-size: var(--headline-size-m) !important;
  font-weight: 500 !important;
}
.overlay__content h2 {
  font-size: var(--headline-size-l) !important;
  line-height: 1 !important;
  font-weight: 500 !important;
}
h1.line-1, h1.large, h2.line-1 {
  font-size: var(--headline-size-xl) !important;
  line-height: 1 !important;
  font-weight: 500 !important;
}
.shopify-section h1.large, .shopify-section h2.large, .large + .typed-cursor {
  font-size: var(--headline-size-xl) !important;
  line-height: 1 !important;
}
.section-footer .section-footer__title {
  font-size: var(--text-size-base);
}

.section-footer p {
    margin-bottom: 0.5em;
}

.rte h2 {
    margin-top: 0.7em;
    margin-bottom: 0.4em;
}
.cart-form h1 {
  margin-bottom: 1em;
}

.button-row.left-right a.button {
  width: 100%;
  max-width: 400px;
  margin-left: auto;
  margin-right: auto;
  margin-top: 3em;
  margin-bottom: 3em;
  display: block;
}
.button-row.left-right a span {
  display: block;
  float: right;
  font-weight: 300;
}

.outlined, .text-column__title {
  padding: 0.2em 0.4em;
    border: 1px solid;
    border-radius: var(--box-radius);
    display: inline-block;
    position: relative;
    top: -0.5em;
    margin-left: 0.2em;
}

span.outlined {
    font-size: 0.4em;
    font-weight: 300;
}

.overlay__content {
  h1, h2, h3, h4 {
    color: #fff;
  }
}

.text-column__title {
  font-size: 1rem;
  font-weight: 300 !important;
  margin-left: 0 !important;
}

input, input[type=submit], .button, .shopify-payment-button__button, #CybotCookiebotDialogBodyButtonsWrapper button, .cc-btn, .pd-cp-btn {
    border: none;
    padding: 0.8em;
    line-height: 1em !important;
    min-height: 1em !important;
    border-radius: var(--box-radius) !important;
}

/* given only one fallback image is possible, we use a mobile one for the following pages and hide on desktop */
@media (min-width: 768px) {
  .shopify-section-template--23652428939611__background_video_RQXfBx .video-container__fallback {
    display: none;  
  }
}

/* newsletter sign up forms */

input.signup-form__email, .cc-popup-form__input-wrapper input, .signup-form input {
  border: 1px solid !important;
  padding-left: 0.7em !important;
}

.wide-container .section-newsletter .contact-form {
  padding: 0 !important;
}
.overlay-type {
  height: auto !important;
  padding: calc(2 * var(--side-spacing)) !important;
}
div.inline-mini-form::after {
  display: none !important;
}
.inline-mini-form.inline-mini-form--arrow button {
  right: -26px;
}
.overlay-type .line-1 {
  margin-bottom: 0.3em;
}

.cc-popup-form__input-wrapper input {
  padding: 0.7em !important;
}

.button,
.shopify-payment-button__button, .cc-btn, .pd-cp-btn {
    font-weight: 500 !important;
}

.button-row {
    margin-top: 1em;
}
.image-with-text .button-row {
    margin-top: 2em;
}

body .button:not(.no-hover):not(input[type=submit].textbutton):not(button.textbutton):not([disabled=disabled]):not(.custom-dot):hover {
    box-shadow: 0 0 0 1px #000; !important;
    background: transparent !important;
    box-sizing: border-box;
}

/* Secondary button: black outline style */
.button--secondary {
    background: transparent !important;
    color: #000 !important;
    box-shadow: 0 0 0 1.5px #000 inset !important;
}
.button--secondary:hover {
    background: #000 !important;
    color: #fff !important;
    box-shadow: 0 0 0 1.5px #000 inset !important;
}


.feature-subheader {
  text-transform: uppercase !important;
  letter-spacing: inherit;
}

.feature-header::after {
  display: none !important;
}


/* media with text element */

.image-with-text__image__inner {
  border-radius: var(--container-radius);
  overflow: hidden;
  display: block;
}
.image-with-text__text {
    border-radius: var(--container-radius);
  }
.image-with-text__text__wrap {
  padding-top: 1.4em;
}
@media (min-width: 768px) {
  .image-with-text .image-with-text__text {
    overflow: hidden;
    /*margin-left: var(--side-spacing);*/
  }
}
@media (max-width: 767px) {
  .image-with-text .image-with-text__text {
    margin-top: 0;
  }
  .image-with-text__text {
    border-top-left-radius: 0px;
    border-top-right-radius: 0px;
  }
  .image-with-text .image-with-text__image__inner, .image-with-text .rimage-wrapper {
    border-bottom-left-radius: 0px;
    border-bottom-right-radius: 0px;
  }
}
.image-with-text__image.lazyload--placeholder {
  line-height: 0 !important;
}


/* About Preview Section */
#shopify-section-template--23652428743003__custom_liquid_PDRxBX, #shopify-section-template--25454214185307__custom_liquid_A6UwdH {
h2 {
  padding: 0 !important;
}

.section-spacing {
  background: linear-gradient(150deg, var(--color-lavender) 0%, var(--color-lavender2) 100%);
  padding: var(--side-spacing);
  border-radius: var(--box-radius);
  border-radius: 1em;
  margin-bottom: 2em;
  position: relative;
}
.section-spacing::after {
  content: "";
  background-image: url("/cdn/shop/files/herzeln.svg?v=1727468674");
  width: 100px;
  height: 100px;
  background-size: contain;
  background-position: right;
  background-repeat: no-repeat;
  position: absolute;
  bottom: 1em;
  right: 1em;
} 

a.button {
  margin-top: 4em;
  margin-bottom: 0.2em;
}
}

/*************    |     PAGE: HOME      |   *************/

.height--full.video-container {
  height: var(--viewport-height);
  min-height: 400px !important;
  @media (min-width: 992px) {
    min-height: 800px !important;
  }
  /* include padding and announcement bar in max-height) */
  max-height: calc(var(--max-container-height) + var(--site-top-margin) + 2* var(--side-spacing) - 45px);
}

#shopify-section-template--23652428743003__background_video_fnpPDh .height--full.video-container {
  padding-bottom: calc(var(--site-top-margin) + 2 * var(--side-spacing)) !important;
  margin-bottom: calc(-1 * var(--site-top-margin) - 2 * var(--side-spacing)) !important;
}

/* XO preview */

/* image hover */
#shopify-section-template--23652428743003__slideshow_rBN6Rr {
  .button {
    opacity: 0;
    background-color: #000;
    color: #fff;
  }
  .button:hover {
    cursor: pointer;
    color: #000;
    background: transparent;
  }
  .line-3 {
    margin-top: 0;
  }
  @media (min-width: 768px) {
    .slide a:hover, .overlay-type:hover {
        cursor: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='42' height='42' viewBox='0 0 42 42' fill='none'%3E%3Cg%3E%3Cpath d='M41 21C41 17.0444 39.827 13.1776 37.6294 9.8886C35.4318 6.59962 32.3082 4.03617 28.6537 2.52242C24.9992 1.00867 20.9778 0.612599 17.0982 1.3843C13.2186 2.15601 9.65492 4.06082 6.85787 6.85787C4.06082 9.65492 2.15601 13.2186 1.3843 17.0982C0.612599 20.9778 1.00867 24.9992 2.52242 28.6537C4.03617 32.3082 6.59962 35.4318 9.8886 37.6294C13.1776 39.827 17.0444 41 21 41C23.6264 41 26.2272 40.4827 28.6537 39.4776C31.0802 38.4725 33.285 36.9993 35.1421 35.1421C36.9993 33.285 38.4725 31.0802 39.4776 28.6537C40.4827 26.2272 41 23.6264 41 21Z' stroke='black' stroke-width='2' stroke-miterlimit='10'/%3E%3Cpath d='M23.334 14L30.334 21' stroke='black' stroke-width='2' stroke-linecap='round'/%3E%3Cpath d='M23.334 28L30.334 21' stroke='black' stroke-width='2' stroke-linecap='round'/%3E%3Cpath d='M11.667 21L30.3337 21' stroke='black' stroke-width='2' stroke-linecap='round'/%3E%3C/g%3E%3C/svg%3E%0A") 21 21, auto;
    }
    .slide:hover .button {
      opacity: 1;
    }
    .slide:hover .rimage-outer-wrapper {
      opacity: 0.9;
    }
  }
}

/*************    |     PAGE: PRODUCT OVERVIEW     |   *************/

#page-content .shopify-section.section-featured-collection {

  width: calc(100% - var(--side-spacing)) !important;


.wide-container, .product-block, .product-block .image {
  padding-left: 0 !important;
  padding-right: 0 !important;
}

div.product-list {
  padding-left: calc(var(--side-spacing)/2) !important;
  padding-right: calc(var(--side-spacing)/2) !important;
  margin-bottom: calc(2 * var(--side-spacing));
}
  
.product-block {
  padding-left: calc(var(--side-spacing)/2) !important;
  padding-right: calc(var(--side-spacing)/2) !important;
  display: block !important;
  transform: none !important;
  margin-bottom: 0.5rem !important;
  margin-top: 0 !important;
  padding-top: 1rem;
}

.product-block a.caption, ul.cc-swatches {
  padding-left: var(--side-spacing);
  padding-right: var(--side-spacing);
}

.product-block a.caption {
  display: block;
}

ul.cc-swatches li {
  margin-right: calc(var(--side-spacing)/2) !important;
  margin-bottom: calc(var(--side-spacing)/2) !important;
}

}

.product-block__inner .image {
  border-radius: var(--box-radius);
  overflow: hidden;
}


/*************    |     PAGE: PRODUCT      |   *************/

/* for related products */
.product-detail__gap-lg h2 {
  margin-top: 1em !important;
  margin-bottom: 0em !important;
}

/* show headline below slideshow */
#section-id-template--23652428939611__slideshow_dpXVKi {
  height: 100svh !important;
  min-height: 400px !important;
  @media (min-width: 992px) {
   min-height: 800px !important;
  }
  margin-bottom: calc(-1 * (var(--side-spacing) + var(--site-top-margin) + 10em)) !important;
  padding-bottom: calc((var(--side-spacing) + var(--site-top-margin) + 10em)) !important;
  transition: height 0.5s;
}
#shopify-section-template--23652428939611__slideshow_dpXVKi .slideshow {
      height: 100% !important;
      transform: scale(1.0);
      max-height: var(--max-container-height);
}

#shopify-section-template--23652428939611__slideshow_dpXVKi .slick-list, #shopify-section-template--23652428939611__slideshow_dpXVKi .slick-track, #shopify-section-template--23652428939611__slideshow_dpXVKi .rimage-outer-wrapper {
  height: 100% !important;
  min-height: 1px !important;
}

/* Custom styles for mobile slider */
@media(max-width:767px){
  .product-area__media .product-slider{
    width: calc(100% + 1.4em) !important;
    margin-left: -0.7em;
  }
  
  .product-area__media .product-slider .theme-img {
      padding-left: var(--side-spacing);
    padding-right: var(--side-spacing)
  }
  
  .product-area .product-area__media .product-slider .rimage-wrapper, .product-area .product-area__media .product-slider .plyr--video  {
    padding-top: 0 !important;
    height: 100% !important;
  }
  
  .product-area .product-area__media .product-slider .plyr .plyr__poster {
    background-size: cover;
  }
  
  .product-slider .product-media img, .product-slider .product-media video { 
    object-fit: cover;
    width: 100% !important;
    height: 100% !important;
  }
}

.product-media img, .product-media video, .product-media .plyr__poster {
  border-radius: var(--container-radius); -webkit-border-radius: var(--container-radius); transform: translateZ(0); 
}

[data-layout="one-column"] .theme-img {
    margin-bottom: var(--side-spacing);
}

@media (min-width: 768px) {
.product-area .product-area__details .product-area__details__header {
  padding-top: 0;
}
}

.product-area .option-selectors li {
  display: block;
  float: left;
  width: fit-content;
}

.product-area .selector-wrapper {
  margin-bottom: 0 !important;
  margin-top: 0 !important;
}

.clickyboxes:not(.options-motif) li button::after {
  content: " ";
  position: absolute;
  top: 0;
  left: -8px;
  width: calc(100% + 16px);
  height: calc(100% + 8px);
  transition: opacity 0.4s;
  background-color: {{ col_page_bg }};
  opacity: 0;
}

.product-area .option-selectors {
  display: flex;
  flex-direction: row; /* can be switched to row if selection areas should be next to each other */
  flex-wrap: wrap;
  column-gap: 2rem;
  max-width: 100%;
  margin-top: 1rem;
  .selector-wrapper {
    overflow: hidden;
    flex: 0 1 auto;
  }
  
  .has-clickyboxes label {
    font-weight: 500 !important;
    margin-bottom: 0.5em !important;
    clear: both;
  }
}

.product-area .option-selectors::before { /* hiding theme elements that add gap */
  display: none;
}

.product-area h2 {
  margin-bottom: 0;
  padding-bottom: 0;
}

.page-motion-print .product-area .option-selectors::after, .page-motion-print .product-area .option-selectors::before {
  display: none;
}
.page-motion-print {
  [class^="style_header"] {
    display: none;
  }
}

#rbr-container-element-addOn {
  margin-top: -1rem;
}

.product-area .clickyboxes li {
    padding: 0 0.5em .1em 0;
  list-style: none;

  }

.product-area .option-selectors .cc-swatches .clickyboxes li button {
  border-radius: var(--box-radius);
  border: none;
  box-shadow: none !important;
  background: transparent;
  margin-left: 2px;
  margin-top: 2px;
}

.product-area .option-selectors .cc-swatches .clickyboxes li button.active, .product-area .product-area .option-selectors .cc-swatches .clickyboxes li button:hover {
  box-shadow: 0 0 0 2px #000 !important;
}

.product-area .option-selectors .cc-swatches .clickyboxes li button::before {
  border-radius: var(--box-radius);
}

/* don't cross out unavailable colors */
.product-area .option-selectors .cc-swatches .clickyboxes li button::after {
  display: none !important;
} 

.selector-wrapper label {
  /* display: none !important; */
  span.cc-swatches__label {
    font-weight: 300 !important;
  }
}

#clickyboxes-option-shape-9981584441691 .cc-hover-line, #clickyboxes-option-motif-10148422648155 .cc-hover-line {
  display: none;  
}

label[for="option-shape-9981584441691"], label[for="option-color-10148422648155"], label[for="option-motif-10148422648155"] {
  display: block !important;
  
}
label[for="option-shape-9981584441691"]::after, label[for="option-motif-10148422648155"]::after {
  content: ":";
  position: relative;
  left: -.15em;
}

ul.clickyboxes.options-shape button, ul.clickyboxes.options-motif button{
  background: none;
    color: black;
    display: inline-block;
    padding: 0;
    border: none;
    font-weight: 500;
    padding: 0.2em 0.5em;
    border-radius: var(--box-radius);
    border: 2px solid #fff;
}
ul.clickyboxes.options-shape button.active,  ul.clickyboxes.options-motif button.active {
    border: 2px solid #000;
}

ul.clickyboxes.options-motif li button {
  display: inline-block;
  width: 43px;
  height: 43px;
  background-size: cover;
  color: transparent;
} 
ul.clickyboxes.options-motif li button:hover {
  color: transparent !important;
}
ul.clickyboxes.options-motif li button.active::before {
    content: attr(data-value);
    display: block; /* or inline-block */
    color: #000;
    position: absolute;
    font-weight: 300;
    top: -1.71rem;
    left: 3em;
}

ul.clickyboxes.options-motif li button.opt--diamond {
  background-image: url("/cdn/shop/files/icon-diamond.svg?v=1761049776");
}
ul.clickyboxes.options-motif li button.opt--grid {
  background-image: url("/cdn/shop/files/icon-grid.svg?v=1761049776");
}

ul.clickyboxes.options-motif button {
    display: none;
}

/*** Page PLAYTS ***/
/* floating images */
#section-id-template--25889214497115__rich_text_8Y3cmC {
  p:nth-child(1)::before,
  p:nth-child(2)::before {
    content: "";
    display: inline-block;
    width: 18rem;
    height: 18rem;
    background-size: cover;
    vertical-align: middle;
    position: relative;
  }
  p:nth-child(1)::before {
    background-image: url("/cdn/shop/files/fl-brot.png?v=1762340150");
    float: right;
    right: -4rem;
  }
  p:nth-child(2)::before {
    background-image: url("/cdn/shop/files/fl-pflaume.png?v=1762340163");
    left: -4rem;
    top: -3rem;
  }
}

/*** Bundle Selection Styling ***/

/* hide non-available options (for square playt) */
#rbr-container-element-true span[aria-disabled="true"] {
  display: none;
}

/* add-on (motion print page) */
.rbr-page-container {
  padding: 0 !important;
  span {
    font-size: var(--text-size-base) !important;
  }
}

.rbr-page-container, .product-area {
   .rbr-thumbnail-container {
    border: none !important;
  }
  .rbr-sbap_item, [class^="style_items"] > div {
    padding: var(--side-spacing);
    border: 1px solid #ddd;
    border-radius: var(--box-radius);
    margin-top: 1rem;
  }
  .rbr-sbap_item {
    margin-top: 1em;
  }
  .rbr-sbap_variants > div > div > div, .selectBoxCustom_variants_d9387324.selectBoxCustom_box_d9387324 {
    padding: 0;
    border: none;
  }
  .rbr-divider__container:not(.rbr-page-container div) {
    display: none;
  }
  .rbr-divider__container {
    background-color: #000 !important;
  }
  .rbr-productNamePrice__title__container a {
    font-weight: 500;
  }
  .colorSwatch_title_c65258f9 { /* don't show labels like "farbe" or "shape" */
      display: none;
  }
  /* hide shape selector because shape is pre-selected for our bundles */
  .colorSwatch_variant_c65258f9:nth-child(2) [aria-disabled="true"] {
    display: none;  
  }
  .rbr-poweredBy__container {
    display: none;
  }
  .rbr-color {
    border-radius: var(--box-radius) !important;
    display: block;
    border: 2px solid #fff !important;
    span {
      width: 100% !important;
      height: 100% !important;
      border-radius: var(--box-radius) !important;
      display: block;
    }
  }
  .rbr-color[aria-selected="true"] {
      border-color: #000 !important;
    }
  .rbr-shape {
    background: none !important;
    border: 2px solid #ddd;
    color: #000 !important;
    border-radius: var(--box-radius) !important;
  }
  [class^="style_price"] {
    width: 100%;
    text-align: right;
    color: #000;
    font-weight: 600;
  }
}

.option-selectors li:has(.opt--sand-lavender) {
  clear: both;
}

.price-area, .product-policies, .xo-discount {
  text-align: right;
  span {
    font-size: 1em !important;
  }
  padding: 0 !important;
}
.product-policies {
  padding-bottom: 0.7em !important;
}

.price-area {
  padding-top: 1rem !important;
}

.price-area, .xo-discount {
  font-weight: 600 !important;
}

.xo-discount {
  color: #008424;
}

.product-policies p {
  font-style: normal;
}

.product-area .product-detail__gap-lg {
    padding-top: 0;
    padding-bottom: 0;
}

.product-area .price-area .was-price {
    opacity: 1;
    color: #aaa;
  margin-right: .2em;
}

.product-detail__form__action.product-detail__form__options--with-quantity {
    display: flex;
    flex-wrap: wrap;
    gap: 0.7em;
    margin-bottom: 0.7em;
    align-items: stretch;
}

/* Quantity + ATC button on one row, payment buttons below */
.product-detail__form__action.product-detail__form__options--with-quantity .quantity-wrapper {
    flex: 0 0 auto;
}
.product-detail__form__action.product-detail__form__options--with-quantity > button[type="submit"] {
    flex: 1 1 0;
    min-width: 0;
}
/* Payment button wrapper: full width on its own row */
.product-detail__form__action.product-detail__form__options--with-quantity .shopify-payment-button {
    flex: 0 0 100%;
    width: 100%;
    margin-top: 0;
}
/* Fast checkout buttons: height via theme variable */
.product-detail__form__action.product-detail__form__options--with-quantity .shopify-payment-button {
    --gravity-button-padding: 19px;
}

/* Additional payment methods link: centered */
.product-detail__form__action.product-detail__form__options--with-quantity .shopify-payment-button .shopify-payment-button__more-options {
    display: block;
    width: 100%;
    text-align: center;
    padding: 0.4em 0;
}
/* Mobile: ensure quantity+ATC stay on one row */
@media (max-width: 767px) {
  .product-detail__form__action.product-detail__form__options--with-quantity {
    display: flex !important;
    flex-wrap: wrap !important;
    float: none !important;
    width: 100% !important;
  }
  .product-detail__form__action.product-detail__form__options--with-quantity .quantity-wrapper {
    flex: 0 0 auto !important;
    margin-bottom: 0 !important;
  }
  .product-detail__form__action.product-detail__form__options--with-quantity > button[type="submit"] {
    flex: 1 1 0 !important;
    width: auto !important;
    max-width: none !important;
  }
  .product-detail__form__action.product-detail__form__options--with-quantity .shopify-payment-button {
    flex: 0 0 100% !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
  }
}

.product-detail__form__options .option-selectors .selector-wrapper:last-child {
  margin-bottom: 1em;
}

.quantity-wrapper input {
    padding: 0;
    line-height: 2.5em !important;
}

.quantity-wrapper {
    flex: 0 0 auto;
    margin-bottom: 0 !important;
    margin-right: 0 !important;
}

.quantity-wrapper button {
    padding: 0;
   flex: 1;
}

.product-area .error-message {
    border: 1px solid #d32d2d;
    border-radius: var(--container-radius); -webkit-border-radius: var(--container-radius); transform: translateZ(0); 
    padding: var(--side-spacing);
}

.product-area .cc-accordion-item, .product-area .cc-accordion {
    border: none;
}
.product-area .product-detail-accordion {
    margin-top: 0.7em;
    margin-bottom: 0.7em;
}

/* top spacing with sticky product info */
@media(min-width:768px){
  #shopify-section-template--23652428939611__main .product-area__details .product-area__details__inner .product-area__details__header {
      padding-top: 0 !important;
  }
  #shopify-section-template--23652428939611__main .product-area__details__inner {
    top: var(--nav-height);
    margin-top: calc(var(--nav-height) - 0.7em) !important;
  }
}

 #shopify-section-template--23652428939611__main .theme-images {
   padding-top: 0 !important;
 }

@media (min-width: 768px) {
    .product-area .product-area__media .theme-gallery[data-column-count="2"] .theme-images .media-column .theme-img {
        margin-bottom: 20px;
    }
}

/* media columns */

.text-column__image {
  border-radius: var(--container-radius);
  overflow: hidden;
}

/* horizontal scroll section (e.g. instagram) */
#shopify-section-template--23652428939611__text_columns_with_images_hzDPVh, /* Product Page */
#shopify-section-template--23961237127515__text_columns_with_images_HCXD98, /* Studio Page */
#shopify-section-template--23961237127515__text_columns_with_images_miYqLr, /* Studio Page */
#shopify-section-template--26800764125531__text_columns_with_images_dByXy9,
#shopify-section-template--26800764125531__text_columns_with_images_WafAqV { /* Motion Print Page */
  overflow: visible;
  max-width: calc(100% - 2* var(--side-spacing)) !important;
  .flexible-layout {
      flex-direction: row;
      flex-wrap: initial;
      overflow-x: auto;
      overflow-y: hidden;
      justify-content: flex-start;
      width: calc(100% + 4* var(--side-spacing)) !important;
      padding-right: calc(2* var(--side-spacing)) !important;
      margin-left: calc(-2* var(--side-spacing)) !important;
      @media (min-width: 1200px) {
        padding-left: calc((100% - var(--site-max-width)) / 2 + var(--side-spacing));
      }
  }
  .column {
    flex: 0 0 auto;
    margin-bottom: 0.7em;
    padding-left: var(--side-spacing);
    padding-right: 0 !important;
    width: min(33%, calc(var(--site-max-width)/3));
  }
  /*
  .column:first-of-type {
    margin-left: 1.4em !important;
  }
  */
  .text-column__title {
    margin-left: 0.7em !important;
  }
}
.section-text-columns-with-images .text-column .text-column__image {
  margin-bottom: 1.2em;
}

/* with border-radius and spacing on non-instagram */
#shopify-section-template--23961237127515__text_columns_with_images_HCXD98, #shopify-section-template--23961237127515__text_columns_with_images_miYqLr, #shopify-section-template--26800764125531__text_columns_with_images_dByXy9 {
  .text-column__title {
    border: 0;
    padding: 0;
  }
  .rimage-outer-wrapper, .section-background-video {
    border-radius: var(--container-radius); -webkit-border-radius: var(--container-radius); transform: translateZ(0); 
    overflow: hidden;
  }
  
  @media (max-width: 1200px) {
    .flexible-layout--variable-columns .column {
        width: 33.333%;
        padding-right: var(--side-spacing);
    }
  }
}

/*************    |     PAGE: STUDIO      |   *************/
#section-id-template--23961237127515__rich_text_GrWb4c {
    .section-rich-text__image {
        position: absolute !important;
        top: 0 !important;
        width: 550px;
        right: max(calc((100vw - 550px)/2), -10vw);
    }
    h2 {
        margin-bottom: 130px !important;
    }
}

/** Cookie Banner **/

pandectes-cmp .actions, pandectes-cmp .header, pandectes-cmp .body {
  padding: calc(2 * var(--side-spacing)) !important;
  font-size: var(--text-size-base) !important;
}
pandectes-cmp .header {
  padding-bottom: 1rem;
}
pandectes-cmp button {
  font-size: var(--text-size-base) !important;
}
pandectes-cmp .footer {
  display: none !important;
}

/** Cookie Banner Archive **/

#pd-cp-preferences .pd-cp-bold-messaging, #pd-cp-preferences .pd-cp-ui-title, #pd-cp-preferences .pd-cp-ui-close, #pd-cp-preferences .pd-cp-purpose-actions {
font-weight: 500;
}

#pd-cp-preferences button:hover {
  background: #fff;
  color: #000 !important;
}
#pd-cp-preferences .pd-cp-ui-close:hover, #pd-cp-preferences .pd-cp-toggle:hover {
  background: initial;  
  color: #fff !important;
}

#pd-cp-preferences .pd-cp-ui-rejectAll, #pd-cp-preferences .pd-cp-ui-acceptAll {
  color: #fff !important;
  background-color: transparent;
  border: 1px solid #fff;
}

#pd-cp-preferences .pd-cp-ui-rejectAll {
  margin-right: 0.5em;
}

#pd-cp-preferences .pd-cp-ui-horizontal-buttons {
    gap: 0.5em;
}

#pd-cp-preferences .pd-cp-ui-horizontal-buttons .pd-cp-btn {
    max-width: 100%;
}
@media (max-width: 699px) {
    .pd-cp-ui-horizontal-buttons .pd-cp-btn {
        display: inline-block;
        padding: 0.8em !important;
    }
  .pd-cp-ui-horizontal-buttons .pd-cp-btn:first-child {
        margin-right: 0 !important;
    }
}

/* accounts/subscribe */

div.shopify-email-marketing-confirmation__container h1 {
    display: none;
}

div.shopify-email-marketing-confirmation__container > p:first-of-type {
    font-size: 200% !important;
    font-weight: 500;
}

/* page: newsletter sign up ipad */
.page-20-rabatt-fur-deine-anmeldung, .page-gewinnspiel-anmeldung  {
  [data-section-type=newsletter-popup] {
    display: none !important;
  }
  #shopify-section-footer, #site-control {
    display: none !important;
  }
  .content h1, .content p{
    text-align: center !important;
  }
  .overlay-type, #page-content .content {
    padding-top: 0 !important;
  }
  #page-content .content, .overlay-type {
    padding-bottom: 1em !important;
  }
  .button-row {
    margin-top: 0 !important;
  }
}
#section-id-template--24312132567387__rich_text_knmPBT {
  display: none;
}
.page-10-rabatt-fur-deine-anmeldung:has(.signup-form__response) #section-id-template--24312132567387__rich_text_knmPBT {
  display:block;
}
/* ─── Horizontal Scroll Gallery Edge-to-Edge Fix ───
   These galleries use horizontal scroll and need their content to bleed
   past the container edges to reach the screen edges.
   The sections use .wide-container for normal centering/max-width.
   We only override overflow so the scroll strip can extend beyond the
   container boundary. The theme's .cc-animate-enabled sets overflow:hidden
   which would clip the scrolling content — this overrides that. */
.shopify-section:has(.use-case-gallery),
.section-community-gallery,
#shopify-section-template--28468191265115__community_gallery {
  overflow: visible !important;
}


/* ─── Community Gallery: Mobile Edge-Scroll ─── */
@media (max-width: 767px) {
  .section-community-gallery {
    overflow: visible !important;
  }
  .community-gallery {
    overflow: visible !important;
  }
  .community-gallery__mobile {
    width: 100vw !important;
    margin-left: calc(-1 * var(--side-spacing)) !important;
    padding-left: var(--side-spacing) !important;
    padding-right: var(--side-spacing) !important;
    scroll-padding-left: var(--side-spacing) !important;
    -ms-overflow-style: none !important;
    scrollbar-width: none !important;
  }
  .community-gallery__mobile::-webkit-scrollbar { display: none; }
}

/* ─── Community Gallery: Desktop Sticky ─── */
@media (min-width: 768px) {
  /* Fix: body overflow:hidden breaks position:sticky.
     Use overflow-x:clip instead — prevents horizontal scroll
     without creating a new scroll container that breaks sticky.
     Selectors match the body classes Shopify adds for this page. */
  body.page-community {
    overflow-x: clip !important;
    overflow-y: visible !important;
  }

  /* Neutralize cc-animate transforms on layout and children */
  .community-layout,
  .community-layout .shopify-section,
  .community-layout [data-cc-animate] {
    overflow: visible !important;
    transform: none !important;
    will-change: auto !important;
  }
  /* Newsletter form button: rounded right corners to match the row border-radius */
  .nl-inline__btn {
    border-top-right-radius: 8px !important;
    border-bottom-right-radius: 8px !important;
  }

}

/*************    |     BLOG / ARTICLE     |   *************/

/* Full-width content area for article pages */
#page-content .central {
  width: 100%;
  max-width: 100%;
}

/* Inline images in article body – respect editor size, only add styling */
.rte img,
.rte--allow-full-width-images img {
  border-radius: var(--box-radius);
  display: block;
  height: auto;
  max-aspect-ratio: 4 / 5;
  object-fit: cover;
  margin-top: 1rem;
  margin-bottom: 1rem;
}

/* Featured image (wide mode) – height controlled via --article-hero-height CSS variable (px) */
.article-header.image-overlay {
  height: var(--article-hero-height, 600px);
}

/* Hero overlay: headline bottom-aligned on all screen sizes */
.article-hero-overlay {
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  align-items: stretch;
}
.article-hero-overlay .overlay__content {
  width: 100%;
}

/* ─────────────────────────────────────────────
   SONNTAG BLOG ARTICLE LAYOUT
   ───────────────────────────────────────────── */

/* ── Hero ── */
.sonntag-article__hero {
  position: relative;
  width: 100%;
  height: var(--hero-height-desktop, 600px);
  overflow: hidden;
  border-radius: var(--container-radius);
}

.sonntag-article__hero-bg {
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center;
}

.sonntag-article__hero-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.sonntag-article__hero-overlay {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  background: linear-gradient(to top, rgba(0,0,0,0.45) 0%, transparent 60%);
}

.sonntag-article__hero-content {
  /* Align to text column: max-width 680px centred, same as .sonntag-block__text-inner */
  width: 100%;
  max-width: calc(680px + 4rem); /* 680px text + 2rem padding each side */
  margin: 0 auto;
  padding: 2rem;
  color: #fff;
}

.sonntag-article__date {
  font-size: 0.85em;
  opacity: 0.8;
  margin-bottom: 0.4rem;
}

.sonntag-article__hero .sonntag-article__title {
  font-size: clamp(1.6rem, 4vw, 3rem);
  font-weight: 500;
  line-height: 1.1;
  color: #fff !important;
  margin: 0;
}
.sonntag-article__date {
  color: #fff;
}

/* ── Body ── */
.sonntag-article__body {
  padding-top: 1rem;
}

/* ── Text block ── */
.sonntag-block--text {
  display: flex;
  justify-content: center;
  padding: var(--side-spacing);
}

.sonntag-block__text-inner {
  width: 100%;
  max-width: 680px;
  font-size: 1rem;
  line-height: 1.65;
}

/* No top margin on first element inside RTE
   Override: .template-article .rte { margin-top: 2em } from styles.css */
.template-article .sonntag-block__text-inner.rte,
.sonntag-block__text-inner.rte {
  margin-top: 0 !important;
}
.sonntag-block__text-inner.rte > *:first-child {
  margin-top: 0;
}

.sonntag-block__text-inner h2 {
  font-size: clamp(1.2rem, 2.5vw, 1.6rem);
  font-weight: 500;
  margin-top: 2rem;
  margin-bottom: 0.5rem;
}

/* ── Images block ── */
.sonntag-block--images {
  display: grid;
  gap: 4rem;
  margin: 3rem 0 2rem;
  padding: 0 4rem;
  align-items: start;
}

/* 1 image: centered, max 70% width on desktop */
.sonntag-block--images-1 {
  grid-template-columns: 1fr;
  justify-items: center;
}
.sonntag-block--images-1 .sonntag-block__image {
  width: 100%;
  max-width: 680px;
}

/* 2 images: 3 alternating layouts via Liquid cycle classes
   A → big left  (5:4), right drops down
   B → big right (4:5), left drops down
   C → big left  (5:4), right nearly top-aligned (small offset)
*/
.sonntag-block--images-2 {
  grid-template-columns: 5fr 4fr;
  align-items: end;
}

/* Variant A: big left, right drops down */
.sonntag-block--images-2.images-2--a {
  grid-template-columns: 5fr 4fr;
  align-items: end;
}
.sonntag-block--images-2.images-2--a .sonntag-block__image--1 {
  margin-top: 0;
}
.sonntag-block--images-2.images-2--a .sonntag-block__image--2 {
  margin-top: 3rem;
}

/* Variant B: big right, left drops down */
.sonntag-block--images-2.images-2--b {
  grid-template-columns: 4fr 5fr;
  align-items: start;
}
.sonntag-block--images-2.images-2--b .sonntag-block__image--1 {
  margin-top: 3rem;
}
.sonntag-block--images-2.images-2--b .sonntag-block__image--2 {
  margin-top: 0;
}

/* Variant C: big left, right top-aligned */
.sonntag-block--images-2.images-2--c {
  grid-template-columns: 5fr 4fr;
  align-items: start;
}
.sonntag-block--images-2.images-2--c .sonntag-block__image--1 {
  margin-top: 0;
}
.sonntag-block--images-2.images-2--c .sonntag-block__image--2 {
  margin-top: 0;
}

/* 3 images: 2-column desktop layout — img 1+2 side by side (img 2 offset down), img 3 below centred */
.sonntag-block--images-3 {
  grid-template-columns: 1fr 1fr;
  align-items: start;
}
.sonntag-block--images-3 .sonntag-block__image--1 {
  margin-top: 0;
}
.sonntag-block--images-3 .sonntag-block__image--2 {
  margin-top: 4rem;
}
.sonntag-block--images-3 .sonntag-block__image--3 {
  grid-column: 1 / -1;
  max-width: 55%;
  margin-left: auto;
  margin-right: auto;
  margin-top: 0;
}

/* Images — container clips to max 4:5 portrait ratio */
.sonntag-block__image {
  overflow: hidden;
  border-radius: var(--box-radius);
  /* Natural aspect ratio — no cropping */
}
.sonntag-block__image img {
  width: 100%;
  height: auto;
  display: block;
}

/* ── Mobile: stack all images with whitespace + alternating offset ── */
@media (max-width: 767px) {
  .sonntag-block--images-2,
  .sonntag-block--images-2.images-2--a,
  .sonntag-block--images-2.images-2--b,
  .sonntag-block--images-2.images-2--c,
  .sonntag-block--images-3 {
    grid-template-columns: 1fr !important;
    gap: 1.2rem;
  }
  /* All images: not full-width, with some breathing room */
  .sonntag-block--images-2 .sonntag-block__image,
  .sonntag-block--images-3 .sonntag-block__image {
    max-width: 82%;
    margin-top: 0 !important;
  }
  /* Odd images: pushed right */
  .sonntag-block--images-2 .sonntag-block__image--1,
  .sonntag-block--images-3 .sonntag-block__image--1,
  .sonntag-block--images-3 .sonntag-block__image--3 {
    margin-left: auto;
    margin-right: 0;
  }
  /* Even images: pushed left */
  .sonntag-block--images-2 .sonntag-block__image--2,
  .sonntag-block--images-3 .sonntag-block__image--2 {
    margin-left: 0;
    margin-right: auto;
  }
  /* Reset 3rd image desktop centering */
  .sonntag-block--images-3 .sonntag-block__image--3 {
    grid-column: auto;
    max-width: 82%;
  }
  .sonntag-article__hero {
    height: var(--hero-height-mobile, 400px);
  }
  .sonntag-article__hero-content {
    padding: 1.2rem;
    max-width: 100%;
  }
}

/* ==========================================================================
   INSPIRATION BLOG TEMPLATE
   ========================================================================== */

.sonntag-blog-inspiration {
  padding: 0 var(--side-spacing);
  max-width: 1400px;
  margin: 0 auto;
}

.sonntag-latest-articles-section {
  padding-left: var(--side-spacing);
  padding-right: var(--side-spacing);
}
.sonntag-inspo-grid-section {
  padding-left: 0;
  padding-right: 0;
}

/* ── 1. Intro ── */
.sonntag-blog-intro {
  display: flex;
  justify-content: center;
  margin-bottom: 4rem;
  text-align: center;
}
.sonntag-blog-intro__inner {
  max-width: 680px;
}
.sonntag-blog-intro__title {
  font-size: clamp(2rem, 4vw, 3rem);
  margin-bottom: 1.5rem;
}

/* ── 2. Product Inspo Grid (Varied Layout) ── */
.sonntag-inspo-grid {
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  column-gap: 2rem;
  row-gap: 4rem;
  margin-bottom: 6rem;
  align-items: start;
}
.sonntag-inspo-item {
  display: flex;
  flex-direction: column;
}
.sonntag-inspo-item__image-wrapper {
  border-radius: var(--box-radius);
  overflow: hidden;
  margin-bottom: 1rem;
  width: 100%;
  /* Intrinsic aspect ratio: set via inline style from Liquid */
}

/* ==========================================================================
   LAYOUT OPTIONS (up to 8 images each)
   ========================================================================== */

/* ── Option 1: Portrait Focus 1 (Asymmetric) ── */
.sonntag-inspo-grid--portrait-1 .sonntag-inspo-item--pattern-1 { grid-column: 1 / 6; }
.sonntag-inspo-grid--portrait-1 .sonntag-inspo-item--pattern-2 { grid-column: 7 / 13; margin-top: 4rem; }
.sonntag-inspo-grid--portrait-1 .sonntag-inspo-item--pattern-3 { grid-column: 2 / 8; margin-top: 4rem; }
.sonntag-inspo-grid--portrait-1 .sonntag-inspo-item--pattern-4 { grid-column: 9 / 13; margin-top: 0; }
.sonntag-inspo-grid--portrait-1 .sonntag-inspo-item--pattern-5 { grid-column: 1 / 5; margin-top: 3rem; }
.sonntag-inspo-grid--portrait-1 .sonntag-inspo-item--pattern-6 { grid-column: 6 / 12; margin-top: 1rem; }
.sonntag-inspo-grid--portrait-1 .sonntag-inspo-item--pattern-7 { grid-column: 3 / 9; margin-top: 2rem; }
.sonntag-inspo-grid--portrait-1 .sonntag-inspo-item--pattern-8 { grid-column: 10 / 13; margin-top: 5rem; }

/* ── Option 2: Portrait Focus 2 (Staggered) ── */
.sonntag-inspo-grid--portrait-2 .sonntag-inspo-item--pattern-1 { grid-column: 2 / 7; }
.sonntag-inspo-grid--portrait-2 .sonntag-inspo-item--pattern-2 { grid-column: 8 / 12; margin-top: 6rem; }
.sonntag-inspo-grid--portrait-2 .sonntag-inspo-item--pattern-3 { grid-column: 1 / 6; margin-top: 2rem; }
.sonntag-inspo-grid--portrait-2 .sonntag-inspo-item--pattern-4 { grid-column: 7 / 13; margin-top: 3rem; }
.sonntag-inspo-grid--portrait-2 .sonntag-inspo-item--pattern-5 { grid-column: 3 / 8; margin-top: 1rem; }
.sonntag-inspo-grid--portrait-2 .sonntag-inspo-item--pattern-6 { grid-column: 9 / 13; margin-top: 4rem; }
.sonntag-inspo-grid--portrait-2 .sonntag-inspo-item--pattern-7 { grid-column: 1 / 5; margin-top: 2rem; }
.sonntag-inspo-grid--portrait-2 .sonntag-inspo-item--pattern-8 { grid-column: 6 / 11; margin-top: 5rem; }

/* ── Option 3: Portrait Focus 3 (Alternating) ── */
.sonntag-inspo-grid--portrait-3 .sonntag-inspo-item--pattern-1 { grid-column: 1 / 7; }
.sonntag-inspo-grid--portrait-3 .sonntag-inspo-item--pattern-2 { grid-column: 8 / 13; margin-top: 3rem; }
.sonntag-inspo-grid--portrait-3 .sonntag-inspo-item--pattern-3 { grid-column: 7 / 13; margin-top: 2rem; }
.sonntag-inspo-grid--portrait-3 .sonntag-inspo-item--pattern-4 { grid-column: 1 / 6; margin-top: 0; }
.sonntag-inspo-grid--portrait-3 .sonntag-inspo-item--pattern-5 { grid-column: 2 / 8; margin-top: 4rem; }
.sonntag-inspo-grid--portrait-3 .sonntag-inspo-item--pattern-6 { grid-column: 9 / 13; margin-top: 1rem; }
.sonntag-inspo-grid--portrait-3 .sonntag-inspo-item--pattern-7 { grid-column: 1 / 5; margin-top: 2rem; }
.sonntag-inspo-grid--portrait-3 .sonntag-inspo-item--pattern-8 { grid-column: 6 / 12; margin-top: 3rem; }

/* ── Option 4: Mixed 1 (Wide & Narrow) ── */
.sonntag-inspo-grid--mixed-1 .sonntag-inspo-item--pattern-1 { grid-column: 1 / 10; }
.sonntag-inspo-grid--mixed-1 .sonntag-inspo-item--pattern-2 { grid-column: 10 / 13; margin-top: 8rem; }
.sonntag-inspo-grid--mixed-1 .sonntag-inspo-item--pattern-3 { grid-column: 1 / 5; margin-top: 4rem; }
.sonntag-inspo-grid--mixed-1 .sonntag-inspo-item--pattern-4 { grid-column: 6 / 13; margin-top: 0; }
.sonntag-inspo-grid--mixed-1 .sonntag-inspo-item--pattern-5 { grid-column: 3 / 11; margin-top: 4rem; }
.sonntag-inspo-grid--mixed-1 .sonntag-inspo-item--pattern-6 { grid-column: 1 / 6; margin-top: 3rem; }
.sonntag-inspo-grid--mixed-1 .sonntag-inspo-item--pattern-7 { grid-column: 7 / 13; margin-top: 1rem; }
.sonntag-inspo-grid--mixed-1 .sonntag-inspo-item--pattern-8 { grid-column: 4 / 10; margin-top: 4rem; }

/* ── Option 5: Mixed 2 (Editorial) ── */
.sonntag-inspo-grid--mixed-2 .sonntag-inspo-item--pattern-1 { grid-column: 3 / 11; }
.sonntag-inspo-grid--mixed-2 .sonntag-inspo-item--pattern-2 { grid-column: 1 / 6; margin-top: 3rem; }
.sonntag-inspo-grid--mixed-2 .sonntag-inspo-item--pattern-3 { grid-column: 7 / 13; margin-top: 6rem; }
.sonntag-inspo-grid--mixed-2 .sonntag-inspo-item--pattern-4 { grid-column: 2 / 10; margin-top: 2rem; }
.sonntag-inspo-grid--mixed-2 .sonntag-inspo-item--pattern-5 { grid-column: 10 / 13; margin-top: 0; }
.sonntag-inspo-grid--mixed-2 .sonntag-inspo-item--pattern-6 { grid-column: 1 / 7; margin-top: 4rem; }
.sonntag-inspo-grid--mixed-2 .sonntag-inspo-item--pattern-7 { grid-column: 8 / 12; margin-top: 1rem; }
.sonntag-inspo-grid--mixed-2 .sonntag-inspo-item--pattern-8 { grid-column: 3 / 11; margin-top: 3rem; }

/* ── Option 6: Mixed 3 (Dynamic) ── */
.sonntag-inspo-grid--mixed-3 .sonntag-inspo-item--pattern-1 { grid-column: 1 / 6; }
.sonntag-inspo-grid--mixed-3 .sonntag-inspo-item--pattern-2 { grid-column: 7 / 13; margin-top: 4rem; }
.sonntag-inspo-grid--mixed-3 .sonntag-inspo-item--pattern-3 { grid-column: 1 / 11; margin-top: 3rem; }
.sonntag-inspo-grid--mixed-3 .sonntag-inspo-item--pattern-4 { grid-column: 8 / 13; margin-top: 2rem; }
.sonntag-inspo-grid--mixed-3 .sonntag-inspo-item--pattern-5 { grid-column: 1 / 7; margin-top: 0; }
.sonntag-inspo-grid--mixed-3 .sonntag-inspo-item--pattern-6 { grid-column: 4 / 10; margin-top: 4rem; }
.sonntag-inspo-grid--mixed-3 .sonntag-inspo-item--pattern-7 { grid-column: 1 / 5; margin-top: 2rem; }
.sonntag-inspo-grid--mixed-3 .sonntag-inspo-item--pattern-8 { grid-column: 6 / 13; margin-top: 5rem; }
.sonntag-inspo-item__image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.sonntag-inspo-item__link {
  font-size: 0.9rem;
  text-decoration: underline;
  text-underline-offset: 4px;
  align-self: flex-start;
  padding-left: var(--side-spacing);
}

/* ── 3. Recent Articles ── */
.sonntag-recent-articles {
  margin-top: 0;
}
.sonntag-recent-articles__title {
  font-size: clamp(1.5rem, 3vw, 2rem);
  margin-bottom: 2rem;
  text-align: center;
}
.sonntag-recent-articles__grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 220px));
  gap: 1.25rem;
  justify-content: center;
}
.sonntag-recent-article__link {
  display: block;
  text-decoration: none;
  color: inherit;
}
.sonntag-recent-article__image-wrapper {
  border-radius: var(--box-radius);
  overflow: hidden;
  aspect-ratio: 1 / 1;
  margin-bottom: 0.75rem;
  position: relative;
}
.sonntag-recent-article__image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
  transition: transform 0.3s ease;
}
.sonntag-inspo-item__image {
  width: 100%;
  height: auto;
  display: block;
  border-radius: var(--box-radius);
  transition: transform 0.3s ease;
}
.sonntag-recent-article__link:hover .sonntag-recent-article__image {
  transform: scale(1.03);
}
.sonntag-recent-article__heading {
  font-size: 1em !important;
  font-weight: 500 !important;
  line-height: 1.4;
  text-align: center;
}

/* ── Mobile Adjustments ── */
@media (max-width: 767px) {
  .sonntag-blog-inspiration {
    padding-top: 2rem;
  }
  
  /* Inspo Grid: single column on mobile */
  .sonntag-inspo-grid {
    display: flex;
    flex-direction: column;
    gap: 2rem;
  }
  .sonntag-inspo-item {
    margin-top: 0 !important;
  }

  /* Mobile: varied widths and offsets for editorial feel */
  /* All items are at least 60% wide */
  .sonntag-inspo-item:nth-child(8n+1) {
    width: 85%;
    align-self: flex-start;
    margin-left: 0;
  }
  .sonntag-inspo-item:nth-child(8n+2) {
    width: 70%;
    align-self: flex-end;
    margin-right: 0;
  }
  .sonntag-inspo-item:nth-child(8n+3) {
    width: 95%;
    align-self: center;
  }
  .sonntag-inspo-item:nth-child(8n+4) {
    width: 65%;
    align-self: flex-start;
    margin-left: 5%;
  }
  .sonntag-inspo-item:nth-child(8n+5) {
    width: 80%;
    align-self: flex-end;
    margin-right: 2%;
  }
  .sonntag-inspo-item:nth-child(8n+6) {
    width: 60%;
    align-self: flex-start;
    margin-left: 10%;
  }
  .sonntag-inspo-item:nth-child(8n+7) {
    width: 90%;
    align-self: flex-end;
  }
  .sonntag-inspo-item:nth-child(8n+8) {
    width: 75%;
    align-self: center;
  }
  
  /* Recent Articles: 2 columns on mobile */
  .sonntag-recent-articles__grid {
    grid-template-columns: repeat(2, 1fr);
  }
  
  /* Recent Articles: horizontal scroll on mobile */
  .sonntag-recent-articles__grid--scroll {
    display: flex;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    gap: 1rem;
    padding-bottom: 1rem;
    scrollbar-width: none;
    -ms-overflow-style: none;
    margin-right: calc(var(--side-spacing) * -1);
    padding-right: var(--side-spacing);
  }
  .sonntag-recent-articles__grid--scroll::-webkit-scrollbar {
    display: none;
  }
  .sonntag-recent-articles__grid--scroll .sonntag-recent-article {
    flex: 0 0 45%;
    scroll-snap-align: start;
  }
}

/* ==========================================================================
   INSPIRATION CTA SECTION

   Horizontal scroll gallery — single row on mobile and desktop.
   Uses the same wide-container > flexible-layout HTML structure as the
   About-page horizontal-scroll sections.

   The .wide-container class handles centering/max-width.
   The .flexible-layout strip breaks out of the container using the same
   trick as line 1287:
     width: calc(100% + 4*side-spacing)
     margin-left: calc(-2*side-spacing)
   => strip reaches both window edges.

   Images capped at 4:5 aspect ratio. No scroll-snap.
   ========================================================================== */

/* ======================================================
   REUSABLE: Edge-to-edge horizontal scroll
   ──────────────────────────────────────────────────────
   Pattern from line 1287 (.flexible-layout breakout trick).

   Utility classes (for future sections):
     .section-edge-scroll  → on .shopify-section
     .edge-scroll-strip    → on the inner scrollable <div>

   For the Inspiration CTA section the same rules also
   target the existing selectors directly so they work
   regardless of Liquid cache state.

   HTML skeleton:
     .shopify-section.section-edge-scroll          ← or .section-inspiration-cta
       .wide-container
         .edge-scroll-strip                        ← or .sonntag-inspo-cta__strip
           .item  .item  .item …
   ====================================================== */

/* ── Section wrapper ──
   overflow:visible lets the strip bleed past the container.
   max-width widens the .shopify-section so the strip math works. */
.section-edge-scroll,
.section-inspiration-cta {
  overflow: visible !important;
  max-width: calc(100% - 2 * var(--side-spacing)) !important;
}

/* Override .wide-container's default 70 px padding
   to match the side-spacing used in the breakout math. */
.section-edge-scroll .wide-container,
.section-inspiration-cta .wide-container {
  padding-left: var(--side-spacing) !important;
  padding-right: var(--side-spacing) !important;
}

/* ── Scrollable strip ── */
.edge-scroll-strip,
.sonntag-inspo-cta__strip {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
  scroll-snap-type: x mandatory;
  justify-content: flex-start;

  /* Break out: 2 × side-spacing on each side */
  width: calc(100% + 4 * var(--side-spacing)) !important;
  margin-left: calc(-2 * var(--side-spacing)) !important;
  padding-right: calc(2 * var(--side-spacing)) !important;

  /* Mobile default: first item aligns with content margin */
  padding-left: var(--side-spacing);
  scroll-padding-left: var(--side-spacing);

  /* Hide scrollbar */
  scrollbar-width: none;
  -ms-overflow-style: none;
}
.edge-scroll-strip::-webkit-scrollbar,
.sonntag-inspo-cta__strip::-webkit-scrollbar {
  display: none;
}

/* Desktop ≥ 1200 px: align with centred site-max-width */
@media (min-width: 1200px) {
  .edge-scroll-strip,
  .sonntag-inspo-cta__strip {
    padding-left: calc((100vw - var(--site-max-width)) / 2);
    scroll-padding-left: calc((100vw - var(--site-max-width)) / 2);
  }
}

/* ── PLAYTS use-case-gallery: mobile-only edge-to-edge scroll ──
   On desktop (>=768px) the track switches to a CSS grid layout,
   so the edge-scroll breakout only applies on mobile. */
@media (max-width: 767px) {
  #shopify-section-template--25889214497115__use_case_gallery_V7izHG {
    overflow: visible !important;
    max-width: calc(100% - 2 * var(--side-spacing)) !important;
  }
  #shopify-section-template--25889214497115__use_case_gallery_V7izHG .wide-container {
    padding-left: var(--side-spacing) !important;
    padding-right: var(--side-spacing) !important;
  }
  #shopify-section-template--25889214497115__use_case_gallery_V7izHG .use-case-gallery__track {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    overflow-x: auto;
    overflow-y: hidden;
    justify-content: flex-start;
    width: calc(100% + 4 * var(--side-spacing)) !important;
    margin-left: calc(-2 * var(--side-spacing)) !important;
    padding-left: var(--side-spacing);
    padding-right: calc(2 * var(--side-spacing)) !important;
    scroll-padding-left: var(--side-spacing);
    scrollbar-width: none;
    -ms-overflow-style: none;
  }
  #shopify-section-template--25889214497115__use_case_gallery_V7izHG .use-case-gallery__track::-webkit-scrollbar {
    display: none;
  }
}



/* ======================================================
   Inspo CTA — section-specific additions
   ====================================================== */

/* Vertical stagger + gap */
.sonntag-inspo-cta__strip {
  align-items: flex-start;
  gap: var(--side-spacing, 20px);
  padding-bottom: 20px;
  padding-top: 0;
  box-sizing: content-box;
}

/* Image items */
.sonntag-inspo-cta__m-col {
  flex: 0 0 auto;
}
.sonntag-inspo-cta__m-img {
  overflow: hidden;
  border-radius: var(--box-radius, 8px);
  container-type: inline-size;
}

/* ─── Inspiration CTA: clickable image links ─── */
.sonntag-inspo-cta__m-img--link {
  display: block;
  text-decoration: none;
  color: inherit;
  overflow: hidden;
}
.sonntag-inspo-cta__m-img--link img {
  transition: transform 0.35s ease;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.sonntag-inspo-cta__m-img--link:hover img,
.sonntag-inspo-cta__m-img--link:focus-visible img {
  transform: scale(1.04);
}

.sonntag-inspo-cta__m-img img,
.sonntag-inspo-cta__m-img .placeholder-svg {
  display: block;
  width: 100%;
  height: auto;
  max-height: calc(100cqi * 5 / 4);
  object-fit: cover;
}
@supports not (max-height: 1cqi) {
  .sonntag-inspo-cta__m-img {
    aspect-ratio: 4 / 5;
  }
  .sonntag-inspo-cta__m-img img {
    width: 100%;
    height: 100%;
    max-height: none;
    object-fit: cover;
  }
}

/* Arrow button */
.sonntag-inspo-cta__m-arrow-wrap {
  flex: 0 0 auto;
  align-self: center;
  padding-right: calc(2 * var(--side-spacing));
  padding-left: 16px;
}
.sonntag-inspo-cta__arrow-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  border: 1.5px solid #000;
  color: #000;
  text-decoration: none;
  flex-shrink: 0;
  transition: background-color 0.2s, color 0.2s;
}
.sonntag-inspo-cta__arrow-btn:hover {
  background-color: #000;
  color: #fff;
}


/* ======================================================
   Featured Collection: 4-column grid from 1100px
   Override the base theme's 992px breakpoint so that
   .column.quarter (grid=4) shows 3 columns below 1100px
   and 4 columns at 1100px and above.
   ====================================================== */
.section-featured-collection .column.quarter,
.section-featured-collection .grid li.quarter {
  width: 33.3%;
}
@media (min-width: 1100px) {
  .section-featured-collection .column.quarter,
  .section-featured-collection .grid li.quarter {
    width: 25%;
  }
  .grid--uniform .section-featured-collection .column.quarter:nth-child(3n+1),
  .section-featured-collection .grid--uniform .column.quarter:nth-child(3n+1),
  .section-featured-collection .grid--uniform .grid li.quarter:nth-child(3n+1) {
    clear: none;
  }
  .grid--uniform .section-featured-collection .column.quarter:nth-child(4n+1),
  .section-featured-collection .grid--uniform .column.quarter:nth-child(4n+1),
  .section-featured-collection .grid--uniform .grid li.quarter:nth-child(4n+1) {
    clear: left;
  }
}
