/* Shopify Style Shop – search results page + product/blog cards (measured from the Shopify shop, own CSS). */
.sss-main, .sss-scope { --sss-fg: rgb(var(--sss-text, 18,18,18)); --sss-fg-85: rgba(var(--sss-text, 18,18,18), .85); --sss-fg-75: rgba(var(--sss-text, 18,18,18), .75); --sss-fg-55: rgba(var(--sss-text, 18,18,18), .55); --sss-fg-20: rgba(var(--sss-text, 18,18,18), .2); --sss-fg-10: rgba(var(--sss-text, 18,18,18), .1); --sss-fg-08: rgba(var(--sss-text, 18,18,18), .08); --sss-head: var(--global-heading-font-family, inherit); --sss-body: var(--global-body-font-family, inherit); color: var(--sss-fg); font-family: var(--sss-body); }
.sss-main *, .sss-main *::before, .sss-main *::after, .sss-scope *, .sss-scope *::before, .sss-scope *::after { box-sizing: border-box; }
.sss-scope .screen-reader-text { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.sss-main .screen-reader-text { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.sss-section { padding: 27px 0; }
.sss-container { max-width: 1200px; margin: 0 auto; padding: 0 15px; }
@media (min-width: 750px) { .sss-section { padding: 36px 0; } .sss-container { padding: 0 50px; } }

/* Header: title + search field */
.sss-title { margin: .67em 0; font-family: var(--sss-head); font-size: 20px; font-weight: 400; line-height: 1.3; letter-spacing: .6px; text-align: center; color: var(--sss-fg); }
@media (min-width: 750px) { .sss-title { font-size: 24px; } }
.sss-search { max-width: 741px; margin: 30px auto 35px; }
@media (min-width: 750px) { .sss-search { margin-bottom: 50px; } }

/* Text field with floating label (search + price) */
.sss-field { position: relative; display: flex; width: 100%; }
.sss-field::after { content: ""; position: absolute; inset: 1px; pointer-events: none; box-shadow: 0 0 0 1px var(--sss-fg-55); transition: box-shadow .1s ease; }
.sss-field:hover::after { box-shadow: 0 0 0 2px var(--sss-fg-55); }
.sss-field__input { -webkit-appearance: none; appearance: none; flex-grow: 1; width: 100%; height: 45px; margin: 1px; padding: 15px; font-family: var(--sss-body); font-size: 16px; line-height: 15px; letter-spacing: .4px; color: var(--sss-fg); background: transparent; border: 0; border-radius: 0; box-shadow: none; outline: 0; }
.sss-field__input::placeholder { opacity: 0; }
.sss-field__input::-webkit-search-cancel-button, .sss-field__input::-webkit-search-decoration { -webkit-appearance: none; }
.sss-field__input:focus { box-shadow: 0 0 0 2px var(--sss-fg); outline: 0; }
.sss-field__label { position: absolute; left: 16px; top: 11px; margin: 0; font-size: 16px; line-height: 23px; letter-spacing: 1px; color: var(--sss-fg-75); pointer-events: none; transition: top .1s ease, font-size .1s ease; }
.sss-field__input:focus, .sss-field__input:not(:placeholder-shown) { padding: 22px 15px 8px; }
.sss-field__input:focus ~ .sss-field__label, .sss-field__input:not(:placeholder-shown) ~ .sss-field__label { top: 6px; font-size: 10px; line-height: 15px; letter-spacing: .4px; }
.sss-field--search .sss-field__input { padding: 15px 98px 15px 20px; }
.sss-field--search .sss-field__input:focus, .sss-field--search .sss-field__input:not(:placeholder-shown) { padding: 22px 98px 8px 20px; }
.sss-field--search .sss-field__label { left: 21px; }
.sss-field__button { position: absolute; top: 1px; right: 1px; display: flex; align-items: center; justify-content: center; width: 44px; height: 44px; margin: 0; padding: 0; color: var(--sss-fg); background: transparent; border: 0; border-radius: 0; box-shadow: none; cursor: pointer; }
.sss-field__button:hover, .sss-field__button:focus { color: var(--sss-fg); background: transparent; }
.sss-field__button[hidden] { display: none; }
.sss-search__reset { right: 45px; }
.sss-search__reset::after { content: ""; position: absolute; right: 0; width: 1px; height: 26px; background: var(--sss-fg-08); }
.sss-field__button .sss-icon { width: 18px; height: 18px; transition: transform .1s ease; }
.sss-field__button:hover .sss-icon { transform: scale(1.07); }

/* Links */
.sss-link { font-size: 14px; color: var(--sss-fg-85); text-decoration: underline; text-underline-offset: 3px; text-decoration-thickness: 1px; }
.sss-link:hover { color: var(--sss-fg); text-decoration-thickness: 2px; }

/* Desktop filter bar */
.sss-facets { display: none; }
@media (min-width: 750px) {
	.sss-facets { display: flex; justify-content: space-between; align-items: center; padding-top: 10px; }
	.sss-facets__filters, .sss-facets__right { display: flex; align-items: center; }
}
.sss-facets__heading { margin: 0 20px 0 0; font-family: var(--sss-body); font-size: 14px; font-weight: 400; line-height: 21px; letter-spacing: .4px; color: var(--sss-fg-85); }
.sss-facet { position: relative; margin-right: 35px; }
.sss-facet__summary { position: relative; display: flex; align-items: center; padding-right: 17.5px; font-size: 14px; line-height: 21px; letter-spacing: .4px; color: var(--sss-fg-75); list-style: none; cursor: pointer; }
.sss-facet__summary::-webkit-details-marker { display: none; }
.sss-facet__summary:hover span { text-decoration: underline; text-underline-offset: 3px; }
.sss-facet[open] .sss-facet__summary { color: var(--sss-fg); }
.sss-facet__summary .sss-icon, .sss-select .sss-icon { position: absolute; right: 0; top: 50%; width: 10px; height: 6px; margin-top: -2px; transition: transform .15s ease; }
.sss-facet[open] .sss-facet__summary .sss-icon { transform: rotate(180deg); }
.sss-facet__panel { position: absolute; top: calc(100% + 20px); left: -12px; z-index: 3; width: 350px; max-height: 550px; overflow-y: auto; background: #fff; border: 1px solid var(--sss-fg-10); box-shadow: 0 4px 5px rgba(18,18,18,.05); }
.sss-facet__head { display: flex; justify-content: space-between; align-items: center; padding: 15px 20px; border-bottom: 1px solid var(--sss-fg-20); font-size: 14px; line-height: 25px; color: var(--sss-fg-75); }
.sss-facet fieldset { margin: 0; padding: 0; border: 0; }
.sss-facet__list { margin: 0; padding: 5px 20px; list-style: none; }
.sss-facet__item { margin: 0; }

/* Checkbox rows */
.sss-check { position: relative; display: flex; align-items: center; padding: 10px 20px 10px 0; font-size: 14px; line-height: 18px; letter-spacing: .4px; color: var(--sss-fg-75); cursor: pointer; }
.sss-check input { position: absolute; opacity: 0; width: 16px; height: 16px; margin: 0; cursor: pointer; }
.sss-check__box { position: relative; flex: 0 0 16px; width: 16px; height: 16px; margin-right: 12px; border: 1px solid var(--sss-fg-55); background: #fff; }
.sss-check__box .sss-icon { position: absolute; top: 3px; left: 2px; width: 10px; height: 8px; color: var(--sss-fg); opacity: 0; }
.sss-check input:checked + .sss-check__box .sss-icon { opacity: 1; }
.sss-check input:focus-visible + .sss-check__box { outline: 2px solid var(--sss-fg-55); outline-offset: 2px; }
.sss-check:hover .sss-check__text { text-decoration: underline; text-underline-offset: 3px; }
.sss-check--disabled { color: var(--sss-fg-55); cursor: default; }
.sss-check--disabled .sss-check__box { opacity: .5; }

/* Price range */
.sss-price-range { display: flex; gap: 20px; padding: 20px; }
.sss-price-range__item { display: flex; align-items: center; flex: 1 1 0; }
.sss-price-range__cur { margin-right: 6px; font-size: 16px; color: var(--sss-fg-75); }

/* Sort + count */
.sss-sort { display: flex; align-items: center; }
.sss-sort__label { margin: 0 20px 0 0; font-family: var(--sss-body); font-size: 14px; font-weight: 400; line-height: 21px; letter-spacing: .4px; color: var(--sss-fg-85); }
.sss-sort__label label { cursor: pointer; }
.sss-select { position: relative; display: inline-flex; align-items: center; }
.sss-select__input { -webkit-appearance: none; appearance: none; width: 143px; height: 21px; margin: 0; padding: 0 17.5px 0 0; font-family: var(--sss-body); font-size: 14px; line-height: 21px; letter-spacing: .4px; color: var(--sss-fg-75); background: transparent; border: 0; border-radius: 0; box-shadow: none; outline-offset: 3px; cursor: pointer; }
.sss-select__input:hover { color: var(--sss-fg); }
.sss-count { margin: 0 0 0 35px; font-family: var(--sss-body); font-size: 14px; font-weight: 400; line-height: 21px; letter-spacing: .6px; color: var(--sss-fg); }

/* Mobile bar + drawer */
.sss-mobile-bar { display: flex; justify-content: space-between; align-items: center; padding-top: 10px; }
@media (min-width: 750px) { .sss-mobile-bar { display: none; } }
.sss-mobile-bar__open { display: inline-flex; align-items: center; gap: 10px; height: 30px; margin: 0; padding: 0; font-family: var(--sss-body); font-size: 15px; letter-spacing: .6px; color: var(--sss-fg-75); background: none; border: 0; box-shadow: none; cursor: pointer; }
.sss-mobile-bar__open:hover, .sss-mobile-bar__open:focus { color: var(--sss-fg); background: none; }
.sss-mobile-bar__open .sss-icon { width: 20px; height: 20px; color: var(--sss-fg); }
.sss-count--mobile { margin: 0; font-size: 14px; line-height: 21px; }
.sss-drawer[hidden] { display: none; }
.sss-drawer { position: fixed; inset: 0; z-index: 100002; }
.sss-drawer__overlay { position: absolute; inset: 0; background: rgba(18,18,18,.5); opacity: 0; transition: opacity .3s ease; }
.sss-drawer__panel { position: absolute; top: 0; right: 0; bottom: 0; display: flex; flex-direction: column; width: calc(100% - 50px); max-width: 375px; margin: 0; background: #fff; border-left: 1px solid var(--sss-fg-08); transform: translateX(100%); transition: transform .3s ease; }
.sss-drawer.is-open .sss-drawer__overlay { opacity: 1; }
.sss-drawer.is-open .sss-drawer__panel { transform: none; }
.sss-drawer__header { position: relative; flex: 0 0 auto; padding: 10px 50px 10px; text-align: center; border-bottom: 1px solid var(--sss-fg-08); }
.sss-drawer__heading { margin: 0; font-family: var(--sss-head); font-size: 14px; font-weight: 400; line-height: 18px; letter-spacing: .6px; color: var(--sss-fg); }
.sss-drawer__count { margin: 0; font-size: 13px; line-height: 23px; letter-spacing: .6px; color: var(--sss-fg-75); }
.sss-drawer__close { position: absolute; top: 7px; right: 10px; display: flex; align-items: center; justify-content: center; width: 44px; height: 44px; margin: 0; padding: 0; color: var(--sss-fg); background: none; border: 0; box-shadow: none; cursor: pointer; }
.sss-drawer__close:hover, .sss-drawer__close:focus { color: var(--sss-fg); background: none; }
.sss-drawer__close .sss-icon { width: 22px; height: 22px; }
.sss-drawer__main { position: relative; flex: 1 1 auto; overflow-x: hidden; overflow-y: auto; padding-top: 27px; }
.sss-drawer__row, .sss-drawer__back { display: flex; align-items: center; justify-content: space-between; width: 100%; height: 53px; margin: 0; padding: 0 25px; font-family: var(--sss-body); font-size: 15px; letter-spacing: .6px; color: var(--sss-fg-75); text-align: left; text-transform: none; background: none; border: 0; border-radius: 0; box-shadow: none; cursor: pointer; }
.sss-drawer__row:hover, .sss-drawer__row:focus, .sss-drawer__back:hover, .sss-drawer__back:focus { color: var(--sss-fg); background: rgba(18,18,18,.04); }
.sss-drawer__row .sss-icon, .sss-drawer__back .sss-icon { width: 14px; height: 10px; color: var(--sss-fg); }
.sss-drawer__back { justify-content: flex-start; gap: 15px; color: var(--sss-fg); }
.sss-drawer__back .sss-icon { transform: rotate(180deg); }
.sss-drawer__sort { display: flex; align-items: center; gap: 30px; margin-top: 13px; padding: 13px 25px; font-size: 15px; letter-spacing: .6px; color: var(--sss-fg-75); }
.sss-drawer__sort .sss-select__input { width: auto; min-width: 165px; height: 21px; }
.sss-drawer__sub { position: absolute; inset: 0; padding-top: 27px; background: #fff; transform: translateX(100%); transition: transform .3s ease; }
.sss-drawer__sub.is-open { transform: none; }
.sss-drawer__sub[hidden] { display: none; }
.sss-drawer__sub .sss-facet__list { padding: 0 25px; }
.sss-drawer__sub .sss-check { padding: 16px 0; font-size: 15px; }
.sss-drawer__sub .sss-check__box { margin-right: 14px; }
.sss-drawer__note { margin: 0; padding: 10px 25px 0; font-size: 15px; color: var(--sss-fg-75); }
.sss-drawer__sub .sss-price-range { padding: 20px 25px; }
.sss-drawer__footer { display: flex; align-items: center; gap: 8px; flex: 0 0 auto; padding: 20px; border-top: 1px solid var(--sss-fg-08); }
.sss-drawer__footer > * { flex: 1 1 50%; text-align: center; }
.sss-drawer__clear { font-size: 15px; }
.sss-button { display: inline-flex; align-items: center; justify-content: center; min-height: 47px; margin: 0; padding: 0 30px; font-family: var(--sss-body); font-size: 15px; letter-spacing: 1px; color: #fff; background: #121212; border: 0; border-radius: 0; box-shadow: none; cursor: pointer; }
.sss-button:hover, .sss-button:focus { color: #fff; background: #121212; box-shadow: 0 0 0 1px #121212; }
body.sss-drawer-open { overflow: hidden; }

/* Active filters */
.sss-active { display: flex; flex-wrap: wrap; align-items: center; padding-top: 10px; }
.sss-pill { margin: 15px 15px 0 0; padding: 0 2px; text-decoration: none; }
.sss-pill__inner { display: inline-flex; align-items: center; padding: 2.5px 12.5px; font-size: 14px; line-height: 21px; letter-spacing: .4px; color: var(--sss-fg); border-radius: 26px; box-shadow: 0 0 0 1px var(--sss-fg-20); transition: box-shadow .1s ease; }
.sss-pill:hover .sss-pill__inner { box-shadow: 0 0 0 2px var(--sss-fg-55); }
.sss-pill .sss-icon { width: 12px; height: 12px; margin: 1px -4px 0 6px; }
.sss-active__clear { margin-top: 15px; }

/* Grid */
.sss-grid-wrap { padding-top: 15px; }
@media (min-width: 750px) { .sss-grid-wrap { padding-top: 36px; } .sss-active + .sss-grid-wrap { padding-top: 41px; } }
.sss-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 4px; margin: 0; padding: 0; list-style: none; }
@media (min-width: 750px) { .sss-grid { gap: 8px; } }
@media (min-width: 990px) { .sss-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.sss-grid__item { margin: 0; padding: 0; position: relative; }

/* Card */
.sss-card { position: relative; height: 100%; }
.sss-card__inner { position: relative; aspect-ratio: 1 / 1; overflow: hidden; background: var(--sss-card-bg, #f3f3f3); transform-origin: center; transition: transform .5s ease, box-shadow .5s ease; }
.sss-card__media, .sss-card__media img { position: absolute; inset: 0; width: 100%; height: 100%; }
.sss-card__media img { object-fit: cover; display: block; }
.sss-card__media::after { content: ""; position: absolute; inset: 0; opacity: 0; pointer-events: none; mix-blend-mode: overlay; background: linear-gradient(135deg, rgba(255,255,255,0) 45%, #fff, rgba(255,255,255,0) 55%) no-repeat 90% 0 / 400% 100%; transition: background-position 1.2s ease, opacity .2s ease; }
.sss-card__content { position: absolute; inset: 0; display: flex; flex-direction: column; justify-content: flex-end; padding: 10px; pointer-events: none; }
.sss-card__heading--hidden { display: none; }
.sss-card__badge { display: flex; }
.sss-badge { display: inline-block; padding: 5px 13px 6px; font-family: var(--sss-body); font-size: 12px; line-height: 12px; letter-spacing: 1px; color: #fff; border: 1px solid transparent; border-radius: 40px; }
.sss-badge--sale { background: var(--sss-sale, #1f3274); }
.sss-badge--soldout { background: var(--sss-soldout, #242833); }
.sss-badge--blog { color: var(--sss-fg); background: #fff; border-color: var(--sss-fg-10); }
.sss-card__info { padding: 13px 0; }
@media (min-width: 750px) { .sss-card__info { padding: 17px 0; } }
.sss-card__heading { margin: 0; font-family: var(--sss-head); font-size: 12px; font-weight: 400; line-height: 1.3; letter-spacing: .6px; color: var(--sss-fg); }
@media (min-width: 750px) { .sss-card__heading { font-size: 13px; } }
.sss-card__heading--article { font-size: 18px; }
.sss-card__link { color: inherit; text-decoration: none; }
.sss-card__link::after { content: ""; position: absolute; inset: 0; z-index: 1; }
.sss-card__link:hover, .sss-card__link:focus { color: inherit; }
.sss-card__date { font-family: var(--sss-head); font-size: 10px; line-height: 12px; letter-spacing: 1.3px; text-transform: uppercase; color: var(--sss-fg); }
.sss-price { display: flex; flex-wrap: wrap; align-items: baseline; column-gap: 15px; margin-top: 6px; font-size: 16px; line-height: 24px; letter-spacing: 1px; color: var(--sss-fg); }
@media (min-width: 750px) { .sss-price { margin-top: 7px; } }
.sss-price__regular { font-size: 13px; color: var(--sss-fg-75); text-decoration: line-through; }
@media (hover: hover) and (min-width: 990px) {
	.sss-grid__item:hover { z-index: 2; }
	.sss-card:hover .sss-card__inner { transform: rotate(1deg); transition: transform .6s ease, box-shadow .5s ease; box-shadow: -10px -10px 10px -10px rgba(0,0,0,.05), 10px 10px 10px -10px rgba(0,0,0,.05), 0 20px 35px -20px rgba(0,0,0,.5); }
	.sss-card:hover .sss-card__media::after { opacity: .2; background-position: left; transition: background-position 6s ease, opacity .5s ease; }
	.sss-card:hover .sss-card__heading { text-decoration: underline; text-underline-offset: 3px; }
}

/* Pagination + empty states */
.sss-pagination { margin-top: 40px; }
.sss-pagination__list { display: flex; flex-wrap: wrap; justify-content: center; margin: 0; padding: 0; list-style: none; }
.sss-pagination__item { position: relative; display: inline-flex; align-items: center; justify-content: center; min-width: 44px; height: 44px; padding: 0 5px; font-size: 14px; color: var(--sss-fg); text-decoration: none; }
.sss-pagination__item:hover { text-decoration: underline; text-underline-offset: 3px; color: var(--sss-fg); }
.sss-pagination__item--current { text-decoration: underline; text-underline-offset: 3px; }
.sss-pagination__item .sss-icon { width: 10px; height: 6px; }
.sss-pagination__item--prev .sss-icon { transform: rotate(90deg); }
.sss-pagination__item--next .sss-icon { transform: rotate(-90deg); }
.sss-empty { padding: 20px 0 30px; text-align: center; font-size: 16px; line-height: 1.8; color: var(--sss-fg-75); }
.sss-empty p { margin: 0 0 10px; }

/* Theme button focus styles off (keep a simple outline for keyboard users) */
.sss-main button:focus { box-shadow: none; }
.sss-main .sss-drawer__close:focus, .sss-main .sss-drawer__close:hover, .sss-main .sss-mobile-bar__open:focus { background: none; box-shadow: none; }
.sss-main button:focus-visible { outline: 2px solid rgba(18,18,18,.5); outline-offset: -2px; }
.sss-drawer__sort label { white-space: nowrap; }

/* ===== Product sliders / grids (shortcode [sss_products]) ===== */
.sss-products .sss-grid { margin: 0; padding: 0; list-style: none; }
.sss-products--grid .sss-grid { display: grid; gap: 4px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (min-width: 750px) { .sss-products--grid .sss-grid { gap: 8px; } }
@media (min-width: 990px) {
	.sss-products--grid.sss-cols-3 .sss-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
	.sss-products--grid.sss-cols-4 .sss-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
	.sss-products--grid.sss-cols-5 .sss-grid { grid-template-columns: repeat(5, minmax(0, 1fr)); }
}
.sss-slider__track:not(.kt-row-column-wrap) { display: flex; gap: 4px; overflow-x: auto; overflow-y: hidden; scroll-snap-type: x mandatory; scroll-padding-left: 15px; padding: 0 15px; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
.sss-slider__track::-webkit-scrollbar { display: none; }
.sss-slider__track > * { scroll-snap-align: start; }
.sss-products--slider .sss-grid__item { flex: 0 0 calc((100% - 4px) / 2 - 17.5px); }
@media (min-width: 750px) {
	.sss-slider__track:not(.kt-row-column-wrap) { gap: 8px; }
	.sss-products--slider .sss-grid__item { flex-basis: calc((100% - 16px) / 3 - 10px); }
}
@media (min-width: 990px) {
	.sss-products--slider.sss-cols-4 .sss-grid__item { flex-basis: calc((100% - 15px) / 4 - 16px); }
	.sss-products--slider.sss-cols-5 .sss-grid__item { flex-basis: calc((100% - 15px) / 5 - 16px); }
}
.sss-slider__buttons { display: flex; justify-content: center; align-items: center; margin-top: 10px; }
.sss-slider__buttons[hidden] { display: none; }
.sss-slider__btn { display: flex; align-items: center; justify-content: center; width: 44px; height: 44px; margin: 0; padding: 0; color: var(--sss-fg-75, rgba(18,18,18,.75)); background: none; border: 0; box-shadow: none; cursor: pointer; }
.sss-slider__btn:hover, .sss-slider__btn:focus { color: var(--sss-fg, rgb(18,18,18)); background: none; box-shadow: none; }
.sss-slider__btn:disabled { color: rgba(var(--sss-text, 18,18,18),.3); cursor: not-allowed; }
.sss-slider__btn .sss-icon { width: 10px; height: 6px; }
.sss-slider__btn--prev .sss-icon { transform: rotate(90deg); }
.sss-slider__btn--next .sss-icon { transform: rotate(-90deg); }
.sss-slider__counter { display: flex; justify-content: center; min-width: 44px; font-size: 12px; line-height: 20px; letter-spacing: .7px; color: var(--sss-fg-75, rgba(18,18,18,.75)); }
.sss-slider__counter .screen-reader-text { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }

/* Kadence row as a slider on mobile (row class "sss-row-slider"), like Shopify's multicolumn */
@media (max-width: 749px) {
	.sss-row-slider .kt-row-column-wrap.sss-slider__track { display: flex !important; flex-wrap: nowrap; grid-template-columns: none !important; gap: 4px; padding-left: 15px !important; padding-right: 15px !important; overflow-x: auto; overflow-y: hidden; scroll-snap-type: x mandatory; scroll-padding-left: 15px; scrollbar-width: none; }
	.sss-row-slider .kt-row-column-wrap.sss-slider__track::-webkit-scrollbar { display: none; }
	.sss-row-slider .kt-row-column-wrap.sss-slider__track > .wp-block-kadence-column { flex: 0 0 calc(100% - 4px); min-width: 0; }
}
@media (min-width: 750px) { .sss-row-slider .sss-slider__buttons { display: none; } }

/* ===== Featured product (shortcode [sss_featured_product]) ===== */
.sss-fp { display: grid; grid-template-columns: minmax(0, 1fr); color: var(--sss-fg-75, rgba(18,18,18,.75)); font-family: var(--sss-body); }
.sss-fp__media { display: flex; justify-content: center; align-items: flex-start; padding: 6px 0 9px; }
@media (max-width: 749px) { .sss-fp__info > .sss-fp__title:first-child { margin-top: 15px; } } /* Dawn keeps an empty text block above the title on mobile */
/* Like Dawn's "constrain to screen height": the image fills the column but never gets taller than the screen allows. */
.sss-fp__img { display: block; width: 100%; height: auto; max-height: max(var(--sss-fp-min-m, 300px), calc(100vh - var(--sss-fp-offset-m, 400px))); object-fit: contain; }
.sss-fp__info { padding: 10px 0 15px; } /* Dawn: last block keeps its 15px margin */
@media (min-width: 750px) {
	.sss-fp { grid-template-columns: 55% 45%; }
	.sss-fp__media { padding: 1px 0 0; }
	.sss-fp__img { max-height: max(var(--sss-fp-min-d, 500px), calc(100vh - var(--sss-fp-offset-d, 170px))); }
	.sss-fp__info { padding: 0 70px 15px; }
	/* Shopify "medium" media size: narrower info column, padding left only. */
	.sss-fp--medium .sss-fp__info { padding: 0 0 15px 50px; }
}
.sss-fp .sss-fp__vendor { margin: 0; font-size: 10px; line-height: 12px; letter-spacing: 1.3px; text-transform: uppercase; color: var(--sss-fg-75, rgba(18,18,18,.75)); }
.sss-fp__title h2 { margin: 0; font-family: var(--sss-head); font-weight: 400; line-height: 1.3; letter-spacing: .6px; color: var(--sss-fg, rgb(18,18,18)); }
.sss-fp--title-52 .sss-fp__title h2 { font-size: 40px; }
.sss-fp--title-40 .sss-fp__title h2 { font-size: 30px; }
.sss-fp--title-24 .sss-fp__title h2 { font-size: 20px; }
@media (min-width: 750px) {
	.sss-fp--title-52 .sss-fp__title h2 { font-size: 52px; }
	.sss-fp--title-40 .sss-fp__title h2 { font-size: 40px; }
	.sss-fp--title-24 .sss-fp__title h2 { font-size: 24px; }
}
.sss-fp__price-wrap { margin-top: 15px; }
.sss-fp__price { display: flex; flex-wrap: wrap; align-items: center; column-gap: 15px; row-gap: 5px; margin: 0; font-size: 16px; line-height: 29px; letter-spacing: 1px; color: var(--sss-fg, rgb(18,18,18)); }
.sss-fp__price .sss-price__regular { font-size: 16px; color: var(--sss-fg-75, rgba(18,18,18,.75)); }
@media (min-width: 750px) {
	.sss-fp__price { font-size: 18px; line-height: 32px; }
	.sss-fp__price .sss-price__regular { font-size: 18px; }
}
.sss-fp__price .sss-badge { margin-left: -5px; }
.sss-fp__tax { margin: 1px 0 0; font-size: 10px; line-height: 17px; letter-spacing: .6px; color: var(--sss-fg-75, rgba(18,18,18,.75)); }
@media (min-width: 750px) { .sss-fp__tax { font-size: 12px; line-height: 20px; } }
.sss-fp__tax a { color: inherit; text-decoration: underline; text-underline-offset: 3px; }
.sss-fp__form { margin: 0; }
.sss-fp__field { margin-top: 15px; }
@media (min-width: 750px) { .sss-fp__field { margin-top: 16px; } }
.sss-fp .sss-fp__field + .sss-fp__field { margin-top: 15px; }
.sss-fp__label { display: block; margin: 0 0 6px; font-size: 13px; line-height: 20px; letter-spacing: .4px; color: var(--sss-fg-75, rgba(18,18,18,.75)); }
.sss-select--box { display: flex; width: 100%; }
.sss-select--box::after { content: ""; position: absolute; inset: 1px; pointer-events: none; box-shadow: 0 0 0 1px var(--sss-fg-55, rgba(18,18,18,.55)); }
.sss-select--box:hover::after { box-shadow: 0 0 0 2px var(--sss-fg-55, rgba(18,18,18,.55)); }
.sss-fp__select { -webkit-appearance: none; appearance: none; width: 100%; height: 45px; margin: 1px; padding: 0 31px 0 20px; font-family: var(--sss-body); font-size: 12px; letter-spacing: .4px; color: var(--sss-fg, rgb(18,18,18)); background: #fff; border: 0; border-radius: 0; box-shadow: none; cursor: pointer; text-overflow: clip; }
.sss-fp__select:focus { outline: 0; box-shadow: 0 0 0 2px var(--sss-fg, rgb(18,18,18)); }
.sss-select--box .sss-icon { right: 15px; }
.sss-qty { position: relative; display: flex; width: 142px; height: 47px; }
.sss-qty::after { content: ""; position: absolute; inset: 1px; pointer-events: none; box-shadow: 0 0 0 1px var(--sss-fg-55, rgba(18,18,18,.55)); }
.sss-qty__btn { flex: 0 0 45px; display: flex; align-items: center; justify-content: center; margin: 0; padding: 0; color: var(--sss-fg, rgb(18,18,18)); background: transparent; border: 0; box-shadow: none; cursor: pointer; }
.sss-qty__btn:hover, .sss-qty__btn:focus { color: var(--sss-fg, rgb(18,18,18)); background: transparent; box-shadow: none; }
.sss-qty__btn .sss-icon { width: 10px; height: 10px; }
.sss-qty__btn[data-step="-1"] .sss-icon { height: 2px; }
.sss-qty__input { -moz-appearance: textfield; flex: 1 1 auto; width: 52px; min-width: 0; margin: 0; padding: 0; font-family: var(--sss-body); font-size: 16px; text-align: center; color: var(--sss-fg, rgb(18,18,18)); background: transparent; border: 0; box-shadow: none; }
.sss-qty__input::-webkit-outer-spin-button, .sss-qty__input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.sss-qty__input:focus { outline: 0; }
.sss-scope .sss-qty input.sss-qty__input, .sss-scope .sss-qty input.sss-qty__input:focus { height: auto; border: 0; border-radius: 0; box-shadow: none; background: transparent; } /* theme input styles must not draw inner borders */
.sss-fp__buttons { margin-top: 25px; }
.sss-btn { position: relative; display: flex; align-items: center; justify-content: center; width: 100%; min-height: 47px; margin: 0; padding: 0 30px; font-family: var(--sss-body); font-size: 15px; letter-spacing: 1px; line-height: 1.2; border: 0; border-radius: 0; cursor: pointer; transition: box-shadow .1s ease; }
.sss-btn + .sss-btn { margin-top: 10px; }
.sss-btn--secondary { color: var(--sss-fg, rgb(18,18,18)); background: #fff; box-shadow: 0 0 0 1px var(--sss-fg, rgb(18,18,18)); }
.sss-btn--secondary:hover, .sss-btn--secondary:focus { color: var(--sss-fg, rgb(18,18,18)); background: #fff; box-shadow: 0 0 0 2px var(--sss-fg, rgb(18,18,18)); }
.sss-btn--primary { color: #fff; background: #121212; box-shadow: 0 0 0 1px #121212; }
.sss-btn--primary:hover, .sss-btn--primary:focus { color: #fff; background: #121212; box-shadow: 0 0 0 2px #121212; }
.sss-btn:disabled { opacity: .5; cursor: not-allowed; }
.sss-btn[hidden] { display: none; }
.sss-btn.is-loading { color: transparent !important; }
.sss-btn.is-loading::after { content: ""; position: absolute; width: 18px; height: 18px; border: 1.5px solid currentColor; border-color: #999 transparent #999 #999; border-radius: 50%; animation: sssSpin .7s linear infinite; }
@keyframes sssSpin { to { transform: rotate(360deg); } }
.sss-fp__error { margin: 10px 0 0; font-size: 13px; color: #b3261e; }
.sss-fp__error[hidden] { display: none; }
.sss-fp__links { display: flex; justify-content: space-between; align-items: center; margin-top: 40px; }
.sss-fp__share { display: inline-flex; align-items: center; gap: 10px; min-height: 44px; margin: 0; padding: 0; font-family: var(--sss-body); font-size: 14px; letter-spacing: .6px; color: var(--sss-fg, rgb(18,18,18)); background: none; border: 0; box-shadow: none; cursor: pointer; }
.sss-fp__share:hover, .sss-fp__share:focus { color: var(--sss-fg, rgb(18,18,18)); background: none; box-shadow: none; }
.sss-fp__share:hover span { text-decoration: underline; text-underline-offset: 3px; }
.sss-fp__share .sss-icon { width: 13px; height: 12px; }
.sss-fp__details { display: inline-flex; align-items: center; gap: 10px; min-height: 44px; font-size: 14px; letter-spacing: .6px; color: var(--sss-fg, rgb(18,18,18)); text-decoration: none; }
.sss-fp__details:hover { color: var(--sss-fg, rgb(18,18,18)); text-decoration: underline; text-underline-offset: 3px; }
.sss-fp__details .sss-icon { width: 14px; height: 10px; }

/* ===== Newsletter ([sss_newsletter]) – dark section like Shopify ===== */
.sss-newsletter { max-width: 360px; margin: 0 auto; }
.sss-newsletter__hp { position: absolute !important; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.sss-newsletter .sss-field__input { padding-right: 60px; color: #fff; }
.sss-newsletter .sss-field__input:focus, .sss-newsletter .sss-field__input:not(:placeholder-shown) { padding: 22px 60px 8px 15px; }
.sss-newsletter .sss-field::after { box-shadow: 0 0 0 1px rgba(255,255,255,.55); }
.sss-newsletter .sss-field:hover::after { box-shadow: 0 0 0 2px rgba(255,255,255,.55); }
.sss-newsletter .sss-field__input:focus { box-shadow: 0 0 0 2px #fff; }
.sss-newsletter .sss-field__label { color: rgba(255,255,255,.75); }
/* Theme rules like input[type=email] outrank single classes – repeat the field look with higher specificity. */
.sss-scope.sss-newsletter input.sss-field__input { height: 45px; margin: 1px; padding: 15px 60px 15px 15px; font-size: 16px; line-height: 15px; color: #fff; background: transparent; border: 0; border-radius: 0; box-shadow: none; outline: 0; }
.sss-scope.sss-newsletter input.sss-field__input:focus, .sss-scope.sss-newsletter input.sss-field__input:not(:placeholder-shown) { padding: 22px 60px 8px 15px; }
.sss-scope.sss-newsletter input.sss-field__input:focus { box-shadow: 0 0 0 2px #fff; }
.sss-newsletter__submit { top: 0; right: 0; height: 47px; color: #fff; }
.sss-newsletter__submit:hover, .sss-newsletter__submit:focus { color: #fff; }
.sss-newsletter__submit .sss-icon { width: 15px; height: 10px; }
.sss-newsletter__msg { margin: 10px 0 0; font-size: 13px; color: rgba(255,255,255,.75); text-align: left; }
.sss-newsletter__msg.is-error { color: #ff8b8b; }
.sss-newsletter__msg[hidden] { display: none; }
.sss-products--grid.sss-cols-m-1 .sss-grid { grid-template-columns: minmax(0, 1fr); }
@media (min-width: 990px) { .sss-products--grid.sss-cols-1 .sss-grid { grid-template-columns: minmax(0, 1fr); } .sss-products--grid.sss-cols-2 .sss-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.sss-fp__price [hidden] { display: none !important; }

/* ===== Collection pages ([sss_collection]) ===== */
@media (min-width: 990px) { .sss-results--collection .sss-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.sss-empty--collection { padding: 0; text-align: center; }
.sss-empty__title { margin: 0; font-family: var(--sss-head); font-size: 20px; font-weight: 400; line-height: 1.3; letter-spacing: .6px; color: var(--sss-fg); }
@media (min-width: 750px) { .sss-empty__title { font-size: 24px; } }
.sss-empty__title .sss-link { font-size: inherit; color: inherit; }