.face-swiper .swiper-slide a img, .face-swiper .swiper-slide .product-video-slide__media, .thumbs-swiper .swiper-slide div img, .thumbs-swiper .swiper-slide .product-video-thumb__media {
    position: absolute;
    inset: 0px;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.thumbs-swiper .swiper-slide div, .face-swiper .swiper-slide a {
    position: relative;
    width: 100%;
    padding-bottom: 69.52%;
}

.thumbs-swiper .swiper-slide div {
    padding-bottom: 69.93%;
}

.product-video-slide__trigger {
    position: relative;
    display: block;
    overflow: hidden;
    background: rgb(232, 239, 236);
}

.product-video-slide__trigger::after {
    content: "";
    position: absolute;
    inset: 0px;
    background: rgba(17, 31, 27, 0.18);
    transition: background-color 0.2s;
}

.product-video-slide__trigger:hover::after, .product-video-slide__trigger:focus-visible::after {
    background: rgba(17, 31, 27, 0.28);
}

.product-video-slide__overlay {
    position: absolute;
    inset: 0px;
    z-index: 2;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 12px;
    color: rgb(255, 255, 255);
    pointer-events: none;
}

.product-video-slide__play {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 72px;
    height: 72px;
    border-radius: 50%;
    background-image: initial;
    background-position: initial;
    background-size: initial;
    background-repeat: initial;
    background-attachment: initial;
    background-origin: initial;
    background-clip: initial;
    background-color: var(--seacan-color-surface);
    box-shadow: rgba(17, 31, 27, 0.24) 0px 10px 30px;
    color: var(--seacan-color-brand);
    transition: transform 0.2s;
}

.product-video-slide__trigger:hover .product-video-slide__play, .product-video-slide__trigger:focus-visible .product-video-slide__play {
    transform: scale(1.06);
}

.product-video-slide__label {
    font-size: 18px;
    font-weight: 700;
    line-height: 1.2;
    text-shadow: rgba(17, 31, 27, 0.65) 0px 2px 12px;
}

.product-video-thumb > div {
    background: rgb(232, 239, 236);
}

.product-video-slide__media {
    border: 0px;
    pointer-events: none;
}

.product-video-thumb {
    position: relative;
}

.product-video-thumb__media {
    pointer-events: none;
}

.product-video-thumb__icon {
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 3;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.94);
    box-shadow: rgba(17, 31, 27, 0.22) 0px 4px 12px;
    color: var(--seacan-color-brand);
    transform: translate(-50%, -50%);
}

.product-card-video-badge {
    position: absolute;
    top: 10px;
    left: 10px;
    z-index: 7;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    min-height: 30px;
    padding: 5px 10px 5px 7px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.94);
    box-shadow: none;
    color: rgb(53, 107, 89);
    font-size: 13px;
    font-weight: 700;
    line-height: 1;
}

.product-card-video-badge svg {
    flex: 0 0 auto;
}

.product-teaser .field--name-field-preview {
    position: relative;
    overflow: hidden;
    aspect-ratio: 1 / 1;
    background: rgb(238, 243, 241);
}

.product-teaser .field--name-field-preview img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.product-teaser .product-teaser-preview--gallery .field--name-field-preview .product-card-gallery__image {
    position: absolute;
    inset: 0px;
    z-index: 1;
    width: 100%;
    height: 100%;
    object-fit: cover;
    opacity: 0;
    transition: opacity 0.18s;
}

.product-teaser .product-teaser-preview--gallery .field--name-field-preview .product-card-gallery__image.is-active {
    z-index: 2;
    opacity: 1;
}

.product-card-gallery__controls {
    position: absolute;
    left: 10px;
    right: 10px;
    bottom: 10px;
    z-index: 6;
    display: flex;
    gap: 4px;
    height: 16px;
    align-items: flex-end;
}

.product-card-gallery__control {
    position: relative;
    display: block;
    flex: 1 1 0px;
    height: 16px;
    cursor: pointer;
}

.product-card-gallery__control::before {
    content: "";
    position: absolute;
    left: 0px;
    right: 0px;
    bottom: 0px;
    height: 3px;
    border-radius: var(--seacan-radius-card);
    background: rgba(255, 255, 255, 0.76);
    box-shadow: none;
    transition: background-color 0.18s, height 0.18s;
}

.product-card-gallery__control:hover::before, .product-card-gallery__control.is-active::before {
    height: 4px;
    background-image: initial;
    background-position: initial;
    background-size: initial;
    background-repeat: initial;
    background-attachment: initial;
    background-origin: initial;
    background-clip: initial;
    background-color: var(--seacan-color-action);
}

.product-teaser-preview--gallery .product-teaser-preview-arrow {
    top: 10px;
    right: 10px;
    bottom: auto;
}

.product-teaser-preview--gallery .field--name-field-preview {
    touch-action: pan-y;
}

.home-catalog-category__products .product-teaser-title {
    padding-top: 14px;
    font-size: 16px;
    line-height: 1.18;
}

.home-catalog-category__products .product-teaser-price {
    gap: 8px;
}

.home-catalog-category__products .product-teaser-price .field {
    font-size: 15px;
}

.home-catalog-category__products .product-teaser-price-name {
    padding: 4px 10px;
}

.home-catalog-category__products .product-teaser-preview-arrow {
    width: 36px;
    height: 36px;
}

@media (hover: none), (pointer: coarse) {
.product-card-gallery__controls {
    left: 8px;
    right: 8px;
    bottom: 8px;
    height: 28px;
    gap: 5px;
}

.product-card-gallery__control {
    height: 28px;
}

.product-card-gallery__control::before {
    height: 4px;
}

.product-card-gallery__control.is-active::before {
    height: 5px;
}

}

@media (max-width: 992px) {
.product-name {
    padding: 20px 10px;
    font-size: 16px;
}

}

.face-swiper {
    aspect-ratio: 1.437 / 1;
    overflow: hidden;
}

.face-swiper > .swiper-wrapper, .face-swiper > .swiper-wrapper > .swiper-slide {
    height: 100%;
}

.face-swiper:not(.swiper-initialized) > .swiper-wrapper, .thumbs-swiper:not(.swiper-initialized) > .swiper-wrapper {
    display: flex;
    flex-wrap: nowrap;
}

.face-swiper:not(.swiper-initialized) > .swiper-wrapper > .swiper-slide {
    flex: 0 0 100%;
    width: 100%;
    min-width: 0px;
}

.face-swiper .swiper-slide a {
    height: 100%;
    padding-bottom: 0px;
}

.thumbs-swiper:not(.swiper-initialized) > .swiper-wrapper {
    gap: 20px;
}

.thumbs-swiper:not(.swiper-initialized) > .swiper-wrapper > .swiper-slide {
    flex: 0 0 calc(25% - 15px);
    width: calc(25% - 15px);
    min-width: 0px;
}

.product-base-complect {
    color: var(--seacan-color-text);
}

.product-base-complect__card {
    padding: 34px;
    background-image: initial;
    background-position: initial;
    background-size: initial;
    background-repeat: initial;
    background-attachment: initial;
    background-origin: initial;
    background-clip: initial;
    background-color: var(--seacan-color-surface);
    border-width: 1px;
    border-style: solid;
    border-top-color: var(--seacan-color-border);
    border-right-color: var(--seacan-color-border);
    border-bottom-color: var(--seacan-color-border);
    border-left-color: var(--seacan-color-border);
    border-image: none;
    border-radius: var(--seacan-radius-card);
    box-shadow: none;
}

.product-base-complect__header {
    display: flex;
    align-items: center;
    gap: 22px;
    margin-bottom: 28px;
}

.product-base-complect__header-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 68px;
    height: 68px;
    flex: 0 0 68px;
    color: rgb(47, 122, 100);
    background: linear-gradient(135deg, rgb(237, 244, 241), rgb(247, 250, 248));
    border-radius: 50%;
}

.product-base-complect__header-icon svg {
    width: 28px;
    height: 28px;
    fill: currentcolor;
}

.product-base-complect__header h2 {
    margin: 0px;
}

.product-base-complect__header p {
    margin: 8px 0px 0px;
    color: rgb(93, 105, 116);
    font-size: 18px;
    line-height: 1.45;
}

.product-base-complect__table-scroll {
    overflow-x: auto;
    border-width: 1px;
    border-style: solid;
    border-top-color: var(--seacan-color-border);
    border-right-color: var(--seacan-color-border);
    border-bottom-color: var(--seacan-color-border);
    border-left-color: var(--seacan-color-border);
    border-image: none;
    border-radius: 14px;
    scrollbar-width: thin;
    scrollbar-color: rgb(79, 131, 113) rgb(237, 244, 241);
}

.product-base-complect__table-scroll:focus-visible {
    outline-color: var(--seacan-color-brand);
    outline-style: solid;
    outline-width: 2px;
    outline-offset: 3px;
}

.product-base-complect__table {
    width: 100%;
    min-width: max(100%, calc(var(--product-base-columns) * 260px));
    border-spacing: 0px;
    border-collapse: separate;
    table-layout: fixed;
}

.product-base-complect__table th, .product-base-complect__table td {
    padding: 18px 20px;
    text-align: left;
    vertical-align: top;
}

.product-base-complect__table th {
    color: rgb(47, 107, 88);
    font-size: 18px;
    font-weight: 700;
    line-height: 1.35;
    background: rgb(237, 244, 241);
}

.product-base-complect__table td {
    color: rgb(51, 67, 63);
    font-size: 16px;
    line-height: 1.5;
    background-image: initial;
    background-position: initial;
    background-size: initial;
    background-repeat: initial;
    background-attachment: initial;
    background-origin: initial;
    background-clip: initial;
    background-color: var(--seacan-color-surface);
}

.product-base-complect__table th + th, .product-base-complect__table td + td {
    border-left-width: 1px;
    border-left-style: solid;
    border-left-color: var(--seacan-color-border);
}

.product-base-complect__table tbody tr + tr td {
    border-top-width: 1px;
    border-top-style: solid;
    border-top-color: var(--seacan-color-border);
}

.product-base-complect__table td > span[aria-hidden="true"] {
    color: rgb(164, 174, 170);
}

.product-base-complect__footer {
    display: grid;
    grid-template-columns: minmax(0px, 1fr);
    margin-top: 28px;
    overflow: hidden;
    border-width: 1px;
    border-style: solid;
    border-top-color: var(--seacan-color-border);
    border-right-color: var(--seacan-color-border);
    border-bottom-color: var(--seacan-color-border);
    border-left-color: var(--seacan-color-border);
    border-image: none;
    border-radius: 14px;
}

.product-base-complect__cta {
    display: flex;
    align-items: center;
    gap: 18px;
    padding: 24px;
}

.product-base-complect__cta {
    width: 100%;
}

.product-base-complect__cta h3 {
    margin: 0px 0px 4px;
}

.product-base-complect__options-link {
    display: inline-flex;
    align-items: center;
    color: rgb(47, 122, 100);
    font-size: 16px;
    line-height: 1.45;
    text-decoration: underline 1px;
    text-underline-offset: 4px;
    transition: color 0.2s;
}

.product-base-complect__options-link:hover, .product-base-complect__options-link:focus-visible {
    color: var(--seacan-color-text);
}

@media (max-width: 767px) {
.product-base-complect__card {
    padding: 20px;
    border-radius: var(--seacan-radius-card);
}

.product-base-complect__header {
    gap: 14px;
    margin-bottom: 22px;
}

.product-base-complect__header-icon {
    width: 54px;
    height: 54px;
    flex-basis: 54px;
}

.product-base-complect__header p {
    font-size: 15px;
}

.product-base-complect__table-scroll {
    margin-right: -20px;
    border-radius: 12px 0px 0px 12px;
}

.product-base-complect__table {
    min-width: max(100%, calc(var(--product-base-columns) * 230px));
}

.product-base-complect__table th, .product-base-complect__table td {
    padding: 14px 16px;
}

.product-base-complect__table th {
    font-size: 16px;
}

.product-base-complect__table td {
    font-size: 15px;
}

.product-base-complect__footer {
    grid-template-columns: 1fr;
}

.product-base-complect__cta {
    align-items: flex-start;
}

}

.product-price-note {
    max-width: 330px;
    margin: 8px 0px 0px;
    color: rgb(93, 105, 116);
    font-size: 14px;
    line-height: 1.4;
}

.node--type-product.node--view-mode-full .product-price_wrapper {
    max-width: 520px;
}

.product-customization-note {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    max-width: 520px;
    margin-top: 18px;
    padding: 14px 16px;
    color: rgb(39, 75, 63);
    font-size: 15px;
    line-height: 1.45;
    background: var(--seacan-color-subtle);
    border-width: 1px;
    border-style: solid;
    border-top-color: var(--seacan-color-border);
    border-right-color: var(--seacan-color-border);
    border-bottom-color: var(--seacan-color-border);
    border-left-color: var(--seacan-color-border);
    border-image: none;
    border-radius: var(--seacan-radius-card);
}

.product-customization-note__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    flex: 0 0 24px;
    margin-top: 1px;
    color: rgb(49, 95, 80);
    font-size: 14px;
    font-weight: 700;
    line-height: 1;
    border-width: 1px;
    border-style: solid;
    border-top-color: var(--seacan-color-brand);
    border-right-color: var(--seacan-color-brand);
    border-bottom-color: var(--seacan-color-brand);
    border-left-color: var(--seacan-color-brand);
    border-image: none;
    border-radius: 50%;
}

.product-actions.product-actions--project {
    max-width: 520px;
    flex-direction: column;
    gap: 12px;
    padding-top: 22px;
}

.product-actions__secondary {
    display: grid;
    gap: 10px;
}

.product-actions__change-link {
    justify-self: center;
    color: rgb(49, 95, 80);
    font-size: 15px;
    line-height: 1.3;
    text-decoration: underline;
    text-underline-offset: 3px;
}

.product-actions__change-link:hover, .product-actions__change-link:focus {
    color: var(--seacan-color-text);
}

@media (max-width: 767px) {
.product-price_wrapper, .product-customization-note, .product-actions.product-actions--project {
    max-width: none;
    width: 100%;
}

}

/* Placement only: appearance belongs to the shared buttons. */
.product-actions--project > .btn-arrow { width: 100%; justify-content: space-between; }
.product-actions__secondary .btn { display: block; width: 100%; white-space: normal; }
