/* Block Styles */
/* Block: video */
.video-block { background-color: #f1f5f9; } .video-container { width: 100%; aspect-ratio: 16 / 9; overflow: hidden; max-height: 500px; } .video-element { width: 100%; height: 100%; object-fit: cover; } .video-placeholder { display: flex; align-items: center; justify-content: center; height: 100%; background-color: rgba(241, 245, 249, 0.8); }

/* Block: paragraph_image */
.paragraph-image-block { background-color: #ffffff; max-width: 72rem; margin-left: auto; margin-right: auto; } .paragraph-image-block.paragraph-image-border { padding-left: 30px; padding-right: 30px; } .paragraph-image-block.paragraph-image-border > .paragraph-image-container { padding-top: 30px; padding-bottom: 20px; } .paragraph-image-container { margin: 0 auto; display: flex; align-items: center; gap: 3rem; } /* Desktop - Image position handling */ @media (min-width: 992px) { .paragraph-image-container.image-left { flex-direction: row; } .paragraph-image-container.image-right { flex-direction: row-reverse; } } .paragraph-image-border { border: 1px solid #d1d5db; border-radius: 0.75rem; } .paragraph-image-text { flex: 1; } .paragraph-image-image { flex: 1; } .paragraph-image-title { font-size: 1.875rem; font-weight: 700; margin-bottom: 1rem; color: #0f172a; } .paragraph-image-content { font-size: 1rem; color: #64748b; line-height: 1.625; } .paragraph-image-content > p { margin-bottom: 0; } .paragraph-image-content:last-child { margin-bottom: 0; } .paragraph-image-content:not(:last-child) { margin-bottom: 1.5rem; } .paragraph-image-image-container { border-radius: 0.5rem; display: flex; align-items: center; justify-content: center; } .paragraph-image-image img { width: 100%; height: 100%; object-fit: cover; border-radius: 0.5rem; } .paragraph-image-cta { margin-bottom: 10px; padding: 1rem 2rem; border-radius: 9999px; border: 2px solid #000000; font-size: 1.125rem; font-weight: 600; background-color: #000000; color: white; text-decoration: none; display: inline-block; transition: all 300ms; } .paragraph-image-cta:hover { background-color: #E40527; border: 2px solid #E40527; } /* Mobile styles - stack image above text on screens smaller than 992px */ @media (max-width: 991px) { .paragraph-image-container { flex-direction: column !important; gap: 2rem; } .paragraph-image-image { width: 100%; flex: none; } .paragraph-image-text { width: 100%; flex: none; } /* Adjust title size for mobile */ .paragraph-image-title { font-size: 1.5rem; } .paragraph-image-content p { font-size: 0.9rem; line-height: inherit; } .paragraph-image-block.paragraph-image-border > .paragraph-image-container { margin-bottom: 0; } .paragraph-image-cta { margin-top: 5px; font-size: 1rem; padding: 0.8rem 1.6rem; } }

/* Block: product_carousel */
.product-carousel-container { overflow: hidden; text-align: center; background-color: #ffffff; max-width: 72rem; margin-left: auto; margin-right: auto; } .carousel-title { font-size: 1.875rem; font-weight: 700; margin-bottom: 1rem; color: #0f172a; } .carousel-wrapper { position: relative; max-width: 1400px; margin: 0 auto; text-align: left; } .carousel-track { display: flex; gap: 1.5rem; overflow-x: auto; scroll-behavior: smooth; scrollbar-width: thin; scrollbar-color: #9ca3af #e5e7eb; padding-bottom: 1rem; } .carousel-track::-webkit-scrollbar { height: 6px; } .carousel-track::-webkit-scrollbar-track { background: #e5e7eb; border-radius: 3px; } .carousel-track::-webkit-scrollbar-thumb { background: #9ca3af; border-radius: 3px; } .carousel-track::-webkit-scrollbar-thumb:hover { background: #6b7280; } .product-card { flex: 0 0 261px; background: white; border-radius: 0.5rem; overflow: hidden; box-shadow: 2px 2px 3px rgba(0, 0, 0, 0.1); transition: all 0.2s ease; border: 1px solid #e5e7eb; display: flex; flex-direction: column; position: relative; } .product-card:hover { box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06); } .product-link { text-decoration: none; color: inherit; display: block; flex-grow: 1; } .product-link:hover { text-decoration: none; } .product-image { aspect-ratio: 1; overflow: hidden; position: relative; padding: 10px 10px; } .product-image img { width: 100%; height: 100%; object-fit: contain; transition: transform 0.2s ease; transform: scale(0.8); } .product-card:hover img { transform: scale(0.9); } .placeholder-image { width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; } .placeholder-icon { width: 3rem; height: 3rem; color: #9ca3af; } .product-info { padding: 1.3rem; display: flex; flex-direction: column; gap: 0; } .product-name { font-size: 1rem; font-weight: 400; color: #111827; margin: 0; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; min-height: 2.5rem; } .product-anotace { font-size: 0.875rem; color: #6b7280; margin: 0; } .product-price { font-size: 1.225rem; font-weight: 700; color: #000000; margin: 0.9rem 0 0 0; } .product-actions { position: absolute; bottom: 1rem; right: 1rem; } .btn-cart-icon { width: 48px; height: 48px; background-color: #E40527; border: none; border-radius: 50%; cursor: pointer; transition: all 0.2s ease; display: flex; align-items: center; justify-content: center; box-shadow: 0 2px 8px rgba(205, 23, 25, 0.3); } .btn-cart-icon:hover { background-color: #E40527; transform: scale(1.1); box-shadow: 0 4px 12px rgba(205, 23, 25, 0.4); } .btn-cart-icon:active { transform: scale(0.95); } .btn-cart-icon .cart-icon { width: 24px; height: 24px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3E%3Cpath d='M10.3999 30C8.6999 30 7.3999 28.7 7.3999 27C7.3999 25.3 8.6999 24 10.3999 24C12.0999 24 13.3999 25.3 13.3999 27C13.3999 28.7 11.9999 30 10.3999 30ZM10.3999 25C9.2999 25 8.3999 25.9 8.3999 27C8.3999 28.1 9.2999 29 10.3999 29C11.4999 29 12.3999 28.1 12.3999 27C12.3999 25.9 11.4999 25 10.3999 25Z' fill='%23FFFFFF'/%3E%3Cpath d='M23.3999 30C21.6999 30 20.3999 28.7 20.3999 27C20.3999 25.3 21.6999 24 23.3999 24C25.0999 24 26.3999 25.3 26.3999 27C26.3999 28.7 24.9999 30 23.3999 30ZM23.3999 25C22.2999 25 21.3999 25.9 21.3999 27C21.3999 28.1 22.2999 29 23.3999 29C24.4999 29 25.3999 28.1 25.3999 27C25.3999 25.9 24.4999 25 23.3999 25Z' fill='%23FFFFFF'/%3E%3Cpath d='M25.4 23H11C9 23 7.2 21.5 6.8 19.5L3.7 4H0.5C0.2 4 0 3.8 0 3.5C0 3.2 0.2 3 0.5 3H4.1C4.3 3 4.5 3.2 4.6 3.4L7.7 19.3C8.1 20.9 9.4 22 11 22H25.4C25.7 22 25.9 22.2 25.9 22.5C25.9 22.8 25.7 23 25.4 23Z' fill='%23FFFFFF'/%3E%3Cpath d='M25.5 7H21.5C21.2 7 21 6.8 21 6.5C21 6.2 21.2 6 21.5 6H25.5C25.8 6 26 6.2 26 6.5C26 6.8 25.8 7 25.5 7Z' fill='%23FFFFFF'/%3E%3Cpath d='M23.5 9C23.2 9 23 8.8 23 8.5V4.5C23 4.2 23.2 4 23.5 4C23.8 4 24 4.2 24 4.5V8.5C24 8.8 23.8 9 23.5 9Z' fill='%23FFFFFF'/%3E%3Cpath d='M23.5 13C19.9 13 17 10.1 17 6.5C17 2.9 19.9 0 23.5 0C27.1 0 30 2.9 30 6.5C30 10.1 27.1 13 23.5 13ZM23.5 1C20.5 1 18 3.5 18 6.5C18 9.5 20.5 12 23.5 12C26.5 12 29 9.5 29 6.5C29 3.5 26.5 1 23.5 1Z' fill='%23FFFFFF'/%3E%3Cpath d='M7.3999 20C7.1999 20 6.9999 19.8 6.8999 19.6L4.3999 7.6C4.3999 7.5 4.3999 7.3 4.4999 7.2C4.5999 7.1 4.6999 7 4.8999 7H15.5999C15.8999 7 16.0999 7.2 16.0999 7.5C16.0999 7.8 15.7999 8 15.5999 8H5.4999L7.7999 18.9L25.9999 16.6L26.7999 13.4C26.8999 13.1 27.0999 13 27.3999 13C27.6999 13.1 27.7999 13.3 27.7999 13.6L26.8999 17.2C26.7999 17.4 26.6999 17.5 26.4999 17.6L7.3999 20C7.4999 20 7.3999 20 7.3999 20Z' fill='%23FFFFFF'/%3E%3C/svg%3E"); background-size: contain; background-repeat: no-repeat; background-position: center; background-color: #E40527; } .btn-cart-icon .spinner-border { display: none; width: 24px; height: 24px; border: 3px solid #ffffff; border-top-color: transparent; border-radius: 50%; animation: spin 0.75s linear infinite; } .btn-cart-icon.loading .spinner-border { display: block; } .btn-cart-icon.loading .cart-icon { display: none; } @keyframes spin { to { transform: rotate(360deg); } } .product-loading { padding: 2rem; text-align: center; color: #6b7280; font-size: 0.875rem; } /* Mobile responsive */ @media (max-width: 768px) { .product-carousel-container { padding: 2rem 1rem; } .carousel-title { font-size: 1.5rem; margin-bottom: 2rem; } .product-card { flex: 0 0 200px; } .btn-cart-icon { width: 40px; height: 40px; } .btn-cart-icon .cart-icon { width: 20px; height: 20px; } } @media (max-width: 991px) { .carousel-title { font-size: 1.5rem; } }

/* Block: highlights */
.highlights-block { position: relative; padding: 4rem 2rem; overflow: hidden; margin-bottom: 4rem; } .highlights-background { position: absolute; top: 0; right: 0; bottom: 0; left: 0; background-size: cover; background-position: center; background-repeat: no-repeat; z-index: 1; } .highlights-overlay { position: absolute; top: 0; right: 0; bottom: 0; left: 0; background-color: rgba(0, 0, 0, 0.5); z-index: 2; } .highlights-container { position: relative; z-index: 10; max-width: 72rem; margin: 0 auto; } .highlights-title { font-size: 1.875rem; font-weight: 700; margin-bottom: 3rem; text-align: center; color: white; } .highlights-item-title { color: white; } .highlights-grid { display: flex; flex-wrap: wrap; justify-content: center; /* vycentrování při méně položkách */ gap: 1.5rem; } .highlights-item { flex: 1 1 200px; /* šířka bloku, automaticky se zalamuje */ max-width: 250px; text-align: center; } .highlights-icon { width: 4rem; height: 4rem; display: flex; align-items: center; justify-content: center; margin: 0 auto 1rem; position: relative; } .highlights-icon img { width: 3rem; height: 3rem; object-fit: contain; } .highlights-description { font-size: 0.875rem; color: #979798; line-height: 1.6; } @media (max-width: 992px) { .highlights-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } } @media (max-width: 768px) { .highlights-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }