.elementor-89040501 .elementor-element.elementor-element-5c6a165 .elementor-atc .elementor-button-content-wrapper{gap:13px;}.elementor-89040501 .elementor-element.elementor-element-5c6a165 .elementor-atc .elementor-button-text{flex-grow:min(0, 13);}.elementor-89040501 .elementor-element.elementor-element-5c6a165 .ce-product-grid{column-gap:0px;row-gap:0px;}.elementor-89040501 .elementor-element.elementor-element-5c6a165 .elementor-image img{width:100%;}.elementor-89040501 .elementor-element.elementor-element-5c6a165 .elementor-title{margin-top:0px;white-space:normal;}.elementor-89040501 .elementor-element.elementor-element-5c6a165 .elementor-atc .elementor-button{background-color:rgba(255, 106, 0, 0.72);}.elementor-89040501 .elementor-element.elementor-element-5c6a165 .elementor-badges-left{margin-top:0px;}.elementor-89040501 .elementor-element.elementor-element-5c6a165 .elementor-badges-right{margin-top:0px;}.elementor-89040501 .elementor-element.elementor-element-5c6a165 .elementor-badge{margin-bottom:0px;min-width:50px;}/* Start custom CSS for html, class: .elementor-element-7215678 *//* Hero intro text clamp + bold fix */ /* Ensure <strong> always renders bold in hero */ details.hero-clamp strong, details.hero-clamp summary strong { font-weight: 700 !important; color: #111 !important; }/**/details.hero-clamp { margin: 0.5rem 0 1rem 0; }/**/details.hero-clamp summary { cursor: pointer; list-style: none; font-size: 1rem; line-height: 1.55; color: #555; position: relative; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; padding-right: 1.5rem; }/**/details.hero-clamp summary::-webkit-details-marker { display: none; }/**/details.hero-clamp summary::marker { display: none; content: ""; }/**/details.hero-clamp summary::after { content: "▾"; position: absolute; right: 0; bottom: 0; font-size: 1.4rem; line-height: 1; color: #ff6a00; font-weight: 700; transition: transform 0.25s ease; }/**/details.hero-clamp[open] summary { display: block; -webkit-line-clamp: unset; overflow: visible; }/**/details.hero-clamp[open] summary::after { content: "▴"; position: static; margin-left: 0.4em; display: inline-block; }/**/details.hero-clamp summary a { color: #ff6a00 !important; text-decoration: none; font-weight: 600; }/**/details.hero-clamp summary a:hover { text-decoration: underline; }/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-acf1749 *//* COLUMNS F + H — Body text styling Targets PrestaShop description containers AND optional .body-col wrapper. Works whether or not the body-2col wrapper is in place. */ /* Generic .elementor-89040501 .elementor-element.elementor-element-acf1749s that catch all common PrestaShop description containers */ .category-description h2, .category-additional-description h2, #category-description h2, .cms-block h2, .body-col h2 { color: #111 !important; font-weight: 700 !important; margin-top: 2.25rem !important; margin-bottom: 1rem !important; }/**/.category-description h3, .category-additional-description h3, #category-description h3, .cms-block h3, .body-col h3 { color: #111 !important; font-weight: 700 !important; margin-top: 1.75rem !important; margin-bottom: 0.75rem !important; }/**//* First heading inside any description column has no top margin */ .category-description > h2:first-child, .category-additional-description > h2:first-child, .body-col > h2:first-child, .body-col > h3:first-child, section > h2:first-child { margin-top: 0 !important; }/**//* Paragraphs */ .category-description p, .category-additional-description p, #category-description p, .cms-block p, .body-col p { color: #555 !important; line-height: 1.7 !important; font-size: 1rem; margin: 0 0 1.25rem 0 !important; }/**//* Lists — orange bullets, spaced out */ .category-description ul, .category-additional-description ul, #category-description ul, .cms-block ul, .body-col ul, .category-description ol, .category-additional-description ol, #category-description ol, .cms-block ol, .body-col ol { margin: 0.75rem 0 1.75rem 0 !important; padding-left: 0 !important; list-style: none !important; }/**/.category-description ul li, .category-additional-description ul li, #category-description ul li, .cms-block ul li, .body-col ul li, .category-description ol li, .category-additional-description ol li, #category-description ol li, .cms-block ol li, .body-col ol li { position: relative !important; padding-left: 1.5rem !important; margin-bottom: 0.75rem !important; color: #555 !important; line-height: 1.6 !important; list-style: none !important; }/**//* Orange round bullet for ul */ .category-description ul li::before, .category-additional-description ul li::before, #category-description ul li::before, .cms-block ul li::before, .body-col ul li::before { content: "" !important; position: absolute !important; left: 0 !important; top: 0.6em !important; width: 7px !important; height: 7px !important; background: #ff6a00 !important; border-radius: 50% !important; }/**//* Numbered orange counters for ol */ .category-description ol, .category-additional-description ol, #category-description ol, .cms-block ol, .body-col ol { counter-reset: list-counter !important; }/**/.category-description ol li::before, .category-additional-description ol li::before, #category-description ol li::before, .cms-block ol li::before, .body-col ol li::before { counter-increment: list-counter !important; content: counter(list-counter) "." !important; position: absolute !important; left: 0 !important; top: 0 !important; color: #ff6a00 !important; font-weight: 700 !important; }/**//* Content image styling */ figure.content-img { margin: 1.5rem 0 2rem 0 !important; padding: 0 !important; }/**/figure.content-img picture, figure.content-img img { width: 100% !important; height: auto !important; border-radius: 8px !important; display: block !important; }/**//* Strong always bold */ .body-col strong, .category-description strong, .category-additional-description strong, #category-description strong, .cms-block strong { font-weight: 700 !important; color: #111 !important; }/**//* Inline link colour */ .body-col a, .category-description a, .category-additional-description a, #category-description a, .cms-block a { color: #ff6a00 !important; text-decoration: none !important; font-weight: 600 !important; }/**/.body-col a:hover, .category-description a:hover, .category-additional-description a:hover, #category-description a:hover, .cms-block a:hover { text-decoration: underline !important; }/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-32202f4 *//* COLUMNS F + H — Body text styling Targets PrestaShop description containers AND optional .body-col wrapper. Works whether or not the body-2col wrapper is in place. */ /* Generic .elementor-89040501 .elementor-element.elementor-element-32202f4s that catch all common PrestaShop description containers */ .category-description h2, .category-additional-description h2, #category-description h2, .cms-block h2, .body-col h2 { color: #111 !important; font-weight: 700 !important; margin-top: 2.25rem !important; margin-bottom: 1rem !important; }/**/.category-description h3, .category-additional-description h3, #category-description h3, .cms-block h3, .body-col h3 { color: #111 !important; font-weight: 700 !important; margin-top: 1.75rem !important; margin-bottom: 0.75rem !important; }/**//* First heading inside any description column has no top margin */ .category-description > h2:first-child, .category-additional-description > h2:first-child, .body-col > h2:first-child, .body-col > h3:first-child, section > h2:first-child { margin-top: 0 !important; }/**//* Paragraphs */ .category-description p, .category-additional-description p, #category-description p, .cms-block p, .body-col p { color: #555 !important; line-height: 1.7 !important; font-size: 1rem; margin: 0 0 1.25rem 0 !important; }/**//* Lists — orange bullets, spaced out */ .category-description ul, .category-additional-description ul, #category-description ul, .cms-block ul, .body-col ul, .category-description ol, .category-additional-description ol, #category-description ol, .cms-block ol, .body-col ol { margin: 0.75rem 0 1.75rem 0 !important; padding-left: 0 !important; list-style: none !important; }/**/.category-description ul li, .category-additional-description ul li, #category-description ul li, .cms-block ul li, .body-col ul li, .category-description ol li, .category-additional-description ol li, #category-description ol li, .cms-block ol li, .body-col ol li { position: relative !important; padding-left: 1.5rem !important; margin-bottom: 0.75rem !important; color: #555 !important; line-height: 1.6 !important; list-style: none !important; }/**//* Orange round bullet for ul */ .category-description ul li::before, .category-additional-description ul li::before, #category-description ul li::before, .cms-block ul li::before, .body-col ul li::before { content: "" !important; position: absolute !important; left: 0 !important; top: 0.6em !important; width: 7px !important; height: 7px !important; background: #ff6a00 !important; border-radius: 50% !important; }/**//* Numbered orange counters for ol */ .category-description ol, .category-additional-description ol, #category-description ol, .cms-block ol, .body-col ol { counter-reset: list-counter !important; }/**/.category-description ol li::before, .category-additional-description ol li::before, #category-description ol li::before, .cms-block ol li::before, .body-col ol li::before { counter-increment: list-counter !important; content: counter(list-counter) "." !important; position: absolute !important; left: 0 !important; top: 0 !important; color: #ff6a00 !important; font-weight: 700 !important; }/**//* Content image styling */ figure.content-img { margin: 1.5rem 0 2rem 0 !important; padding: 0 !important; }/**/figure.content-img picture, figure.content-img img { width: 100% !important; height: auto !important; border-radius: 8px !important; display: block !important; }/**//* Strong always bold */ .body-col strong, .category-description strong, .category-additional-description strong, #category-description strong, .cms-block strong { font-weight: 700 !important; color: #111 !important; }/**//* Inline link colour */ .body-col a, .category-description a, .category-additional-description a, #category-description a, .cms-block a { color: #ff6a00 !important; text-decoration: none !important; font-weight: 600 !important; }/**/.body-col a:hover, .category-description a:hover, .category-additional-description a:hover, #category-description a:hover, .cms-block a:hover { text-decoration: underline !important; }/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-6a118c9 *//* === UNIVERSAL: <strong> must always render bold === */ strong, b, .body-col strong, .body-col b, .category-description strong, .category-description b, .category-additional-description strong, .category-additional-description b, #category-description strong, #category-description b, .cms-block strong, .cms-block b, details.hero-clamp strong, details.hero-clamp summary strong, details.faq-item strong, details.faq-item summary strong, details.faq-item p strong, details.faq-item li strong, .related-faq strong, .related-blog strong, .blog-card strong, .blog-card-content strong { font-weight: 700 !important; font-family: inherit !important; font-style: inherit !important; }/**//* COLUMN J — FAQ accordion (Shisha Heaven style, with proper spacing) */ .faq-intro { color: #888 !important; margin: 0 0 1.5rem 0 !important; font-size: 1rem; }/**//* Section H2 — matches .related-blog h2 exactly */ .related-faq h2, .faq-list-section h2, section.related-faq > h2 { font-size: 1.5rem !important; font-weight: 700 !important; color: #111 !important; margin: 0 0 1.5rem 0 !important; }/**/.faq-list { margin: 1rem 0 2rem 0 !important; border-top: 1px solid #eaeaea !important; }/**/details.faq-item { border-bottom: 1px solid #eaeaea !important; padding: 0 !important; margin: 0 !important; }/**//* Question text — matches blog card title style */ details.faq-item summary { cursor: pointer; list-style: none; padding: 1.25rem 3rem 1.25rem 0 !important; font-size: 1.1rem !important; font-weight: 700 !important; color: #111 !important; line-height: 1.35 !important; position: relative; user-select: none; transition: color 0.15s ease; }/**/details.faq-item summary::-webkit-details-marker { display: none; }/**/details.faq-item summary::marker { display: none; content: ""; }/**//* Chevron arrow on the right */ details.faq-item summary::after { content: ""; position: absolute; right: 0.5rem; top: 50%; width: 12px; height: 12px; border-right: 2px solid #999; border-bottom: 2px solid #999; transform: translateY(-75%) rotate(45deg); transition: transform 0.25s ease, border-color 0.15s ease; }/**/details.faq-item[open] summary::after { transform: translateY(-25%) rotate(-135deg); border-color: #ff6a00; }/**/details.faq-item summary:hover { color: #ff6a00 !important; }/**/details.faq-item summary:hover::after { border-color: #ff6a00; }/**//* Answer */ details.faq-item > p, details.faq-item > div, details.faq-item > ul, details.faq-item > ol { color: #555 !important; line-height: 1.7 !important; margin: 0 0 1.25rem 0 !important; padding: 0 1rem 0 0 !important; }/**/details.faq-item ul li, details.faq-item ol li { position: relative !important; padding-left: 1.5rem !important; margin-bottom: 0.5rem !important; list-style: none !important; }/**/details.faq-item ul li::before { content: "" !important; position: absolute !important; left: 0 !important; top: 0.55em !important; width: 6px !important; height: 6px !important; background: #ff6a00 !important; border-radius: 50% !important; }/**/details.faq-item ol { counter-reset: faq-counter !important; }/**/details.faq-item ol li::before { counter-increment: faq-counter !important; content: counter(faq-counter) "." !important; position: absolute !important; left: 0 !important; top: 0 !important; color: #ff6a00 !important; font-weight: 700 !important; }/**/details.faq-item a { color: #ff6a00 !important; text-decoration: none !important; font-weight: 600 !important; }/**/details.faq-item a:hover { text-decoration: underline !important; }/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-9a2dac4 *//* === UNIVERSAL: <strong> must always render bold === */ strong, b, .body-col strong, .body-col b, .category-description strong, .category-description b, .category-additional-description strong, .category-additional-description b, #category-description strong, #category-description b, .cms-block strong, .cms-block b, details.hero-clamp strong, details.hero-clamp summary strong, details.faq-item strong, details.faq-item summary strong, details.faq-item p strong, details.faq-item li strong, .related-faq strong, .related-blog strong, .blog-card strong, .blog-card-content strong { font-weight: 700 !important; font-family: inherit !important; font-style: inherit !important; }/**//* Related Blog Posts — sits in right column next to FAQ. COMPACT layout. */ .related-blog { margin: 0 0 2rem 0; }/**/.related-blog h2 { font-size: 1.5rem !important; font-weight: 700 !important; color: #111 !important; margin: 0 0 1.5rem 0 !important; }/**/.related-blog-list { display: flex; flex-direction: column; gap: 1rem; /* was 1.5rem — tightened */; }/**/.blog-card { display: grid; grid-template-columns: 160px 1fr; gap: 1.25rem; align-items: center; /* was start — centers content vertically with image */ padding-bottom: 1rem; /* was 1.5rem — tightened */ border-bottom: 1px solid #eaeaea; }/**/.blog-card:last-child { border-bottom: none; padding-bottom: 0; }/**/.blog-card-img { width: 160px; aspect-ratio: 1 / 1; border-radius: 8px; overflow: hidden; background: linear-gradient(135deg, #f5f5f5 0%, #e8e8e8 100%); }/**/.blog-card-img img { width: 100%; height: 100%; object-fit: cover; display: block; }/**/.blog-card-content { display: flex; flex-direction: column; gap: 0.05rem; /* very tight — minimize space between category & title */; }/**/.blog-card-category { color: #ff6a00 !important; font-weight: 700 !important; font-size: 0.95rem !important; margin: 0 !important; /* kill all paragraph margins */ padding: 0 !important; line-height: 1.3 !important; }/**//* CRITICAL: kill the theme's H3 margins that bleed into blog title */ .blog-card-title, h3.blog-card-title, .related-blog .blog-card-title, .blog-card-content .blog-card-title, .related-blog h3.blog-card-title, .body-col-right .blog-card-title { font-size: 1.1rem !important; font-weight: 700 !important; color: #111 !important; line-height: 1.35 !important; margin: 0 0 0.4rem 0 !important; padding: 0 !important; word-wrap: normal; overflow-wrap: break-word; hyphens: none; }/**//* High-specificity "Read now" button — beats theme override */ a.blog-card-link, .related-blog a.blog-card-link, .body-col-right a.blog-card-link, .category-description a.blog-card-link, .category-additional-description a.blog-card-link, #category-description a.blog-card-link { display: inline-block; margin-top: 0.1rem !important; padding: 0.5rem 1rem !important; background: #ff6a00 !important; color: #ffffff !important; font-weight: 700; font-size: 0.9rem; text-decoration: none !important; border: none; border-radius: 6px; transition: background 0.15s ease; align-self: flex-start; }/**/a.blog-card-link:hover, .related-blog a.blog-card-link:hover { background: #d95a00 !important; color: #ffffff !important; }/**/a.blog-card-link:visited { color: #ffffff !important; }/**//* Mobile (≤ 480px): image goes on TOP, full-width cards */ @media (max-width: 480px) { .blog-card { grid-template-columns: 1fr; align-items: stretch; } .blog-card-img { width: 100%; aspect-ratio: 16 / 10; }; }/**//* === BLOG CARD — kill all inherited margins on title h3 === */ /* Multiple ancestor .elementor-89040501 .elementor-element.elementor-element-9a2dac4s to beat any theme's h3 styling */ body .blog-card .blog-card-content h3, body .blog-card .blog-card-content h3.blog-card-title, body .related-blog .blog-card h3, body .related-blog .blog-card .blog-card-content > h3, body .category-description .blog-card h3, body .category-additional-description .blog-card h3, body #category-description .blog-card h3, body .body-col .blog-card h3, body .body-col-right .blog-card h3, body .cms-block .blog-card h3, html body .blog-card h3 { margin: 0 0 0.4rem 0 !important; padding: 0 !important; font-size: 1.1rem !important; font-weight: 700 !important; color: #111 !important; line-height: 1.35 !important; }/**//* Also kill any margin on category label */ body .blog-card .blog-card-content p, body .blog-card .blog-card-content p.blog-card-category, body .related-blog .blog-card p, body .category-description .blog-card p, body .body-col .blog-card p { margin: 0 !important; padding: 0 !important; }/**//* Container itself: small gap between elements */ body .blog-card .blog-card-content { display: flex !important; flex-direction: column !important; gap: 0.05rem !important; margin: 0 !important; }/**//* Kill any TinyMCE-injected empty paragraphs that could create gaps */ .blog-card-content p:empty, .blog-card-content br + br, .blog-card-content p:has(br:only-child) { display: none !important; }/**//* === EXTRA TIGHT: kill ALL vertical space between category & title === */ /* Maximum-specificity overrides to beat any theme h3/h4 default margins */ html body .blog-card .blog-card-content .blog-card-category, html body .related-blog .blog-card .blog-card-content p.blog-card-category { margin: 0 !important; padding: 0 !important; line-height: 1.2 !important; }/**/html body .blog-card .blog-card-content h3.blog-card-title, html body .blog-card .blog-card-content h3, html body .related-blog .blog-card h3.blog-card-title, html body .related-blog .blog-card .blog-card-content > h3 { margin: 0 0 0.3rem 0 !important; margin-top: 0 !important; padding: 0 !important; padding-top: 0 !important; line-height: 1.3 !important; }/**//* Ensure the flex container itself has near-zero gap */ html body .blog-card .blog-card-content { gap: 0.05rem !important; row-gap: 0.05rem !important; }/* End custom CSS */