@import url('https://fonts.googleapis.com/css2?family=Tajawal:wght@400;500;600;700;800;900&display=swap');

.hzb-root {
    --hzb-primary: #22d3ee;
    --hzb-primary-strong: #0891b2;
    --hzb-accent: #a78bfa;
    --hzb-bg: #070b14;
    --hzb-surface: #101827;
    --hzb-surface-2: #172033;
    --hzb-text: #f8fafc;
    --hzb-muted: #a8b3c7;
    --hzb-border: rgba(148, 163, 184, .22);
    --hzb-radius: 18px;
    --hzb-shadow: 0 18px 50px rgba(0, 0, 0, .26);
    --hzb-wide: 1280px;
    --hzb-content: 1040px;
    --hzb-narrow: 760px;
    width: 100%;
    min-height: 40vh;
    color: var(--hzb-text);
    background: var(--hzb-bg);
    font-family: 'Tajawal', sans-serif;
    line-height: 1.6;
    overflow: clip;
}

.hzb-root *,
.hzb-root *::before,
.hzb-root *::after { box-sizing: border-box; }

.hzb-root img { max-width: 100%; height: auto; }
.hzb-root a { text-decoration: none; }
.hzb-root a:focus-visible,
.hzb-root button:focus-visible { outline: 3px solid #fde047; outline-offset: 3px; }

.hzb-block-wrapper { position: relative; width: 100%; margin-inline: auto; padding-inline: clamp(16px, 3vw, 32px); }
.hzb-max--full { max-width: none; padding-inline: 0; }
.hzb-max--wide { max-width: calc(var(--hzb-wide) + 64px); }
.hzb-max--content { max-width: calc(var(--hzb-content) + 64px); }
.hzb-max--narrow { max-width: calc(var(--hzb-narrow) + 64px); }
.hzb-pad--none { padding-block: 0; }
.hzb-pad--sm { padding-block: clamp(12px, 2vw, 22px); }
.hzb-pad--md { padding-block: clamp(22px, 4vw, 44px); }
.hzb-pad--lg { padding-block: clamp(38px, 6vw, 70px); }
.hzb-pad--xl { padding-block: clamp(56px, 8vw, 96px); }
.hzb-margin--sm { margin-block: 14px; }
.hzb-margin--md { margin-block: 28px; }
.hzb-margin--lg { margin-block: 48px; }
.hzb-is-hidden-preview { opacity: .42; filter: grayscale(1); }
.hzb-is-hidden-preview::after { content: "مخفي في الموقع"; position: absolute; inset-block-start: 8px; inset-inline-end: 8px; z-index: 8; padding: 4px 8px; color: #fff; background: #be123c; border-radius: 6px; font-size: 12px; }

.hzb-section-heading { margin-bottom: clamp(18px, 3vw, 32px); }
.hzb-section-heading--actions { display: flex; align-items: end; justify-content: space-between; gap: 18px; }
.hzb-section-title { margin: 0; color: var(--hzb-text); font-size: clamp(1.55rem, 3vw, 2.35rem); font-weight: 850; line-height: 1.25; }
.hzb-section-subtitle { max-width: 760px; margin: 8px 0 0; color: var(--hzb-muted); font-size: clamp(.95rem, 1.5vw, 1.08rem); }
.hzb-text-center { text-align: center; }
.hzb-text-link { min-height: 44px; display: inline-flex; align-items: center; flex: 0 0 auto; color: var(--hzb-primary); font-weight: 750; }
.hzb-text-link:hover { color: #a5f3fc; }
.hzb-eyebrow { display: inline-flex; margin: 0 0 14px; padding: 6px 12px; color: var(--hzb-primary); background: rgba(34, 211, 238, .1); border: 1px solid rgba(34, 211, 238, .45); border-radius: 999px; font-size: .84rem; font-weight: 800; }
.hzb-actions { display: flex; flex-wrap: wrap; gap: 11px; align-items: center; }
.hzb-align--center .hzb-actions { justify-content: center; }

.hzb-button {
    min-height: 46px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 10px 19px;
    border: 1px solid transparent;
    border-radius: 12px;
    font-weight: 800;
    line-height: 1.2;
    transition: transform .18s ease, border-color .18s ease, background-color .18s ease;
}
.hzb-button:hover { transform: translateY(-2px); }
.hzb-button--primary { color: #03151c; background: linear-gradient(135deg, #67e8f9, #22d3ee); box-shadow: 0 8px 24px rgba(34, 211, 238, .18); }
.hzb-button--primary:hover { color: #03151c; background: #a5f3fc; }
.hzb-button--ghost { color: var(--hzb-text); background: rgba(15, 23, 42, .48); border-color: rgba(255, 255, 255, .34); }
.hzb-button--ghost:hover { color: #fff; border-color: var(--hzb-primary); }
.hzb-button--small { min-height: 42px; padding: 8px 13px; color: #04131b; background: var(--hzb-primary); border-radius: 10px; font-size: .82rem; }

.hzb-hero,
.hzb-promo { position: relative; display: grid; align-items: center; isolation: isolate; overflow: hidden; color: var(--hzb-hero-text, var(--hzb-promo-text, #fff)); background: var(--hzb-hero-bg, var(--hzb-promo-bg, #111827)); border: 1px solid var(--hzb-border); border-radius: clamp(16px, 2.5vw, 28px); box-shadow: var(--hzb-shadow); }
.hzb-hero.hzb-valign--top { align-items: start; }
.hzb-hero.hzb-valign--middle { align-items: center; }
.hzb-hero.hzb-valign--bottom { align-items: end; }
.hzb-hero--compact { min-height: 330px; }
.hzb-hero--normal { min-height: 440px; }
.hzb-hero--large { min-height: min(680px, 76svh); }
.hzb-promo--compact { min-height: 260px; }
.hzb-promo--normal { min-height: 340px; }
.hzb-promo--large { min-height: min(500px, 64svh); }
.hzb-hero__picture,
.hzb-promo__image { position: absolute; inset: 0; z-index: -3; width: 100%; height: 100%; }
.hzb-hero__picture { display: block; opacity: var(--hzb-hero-image-opacity, 1); }
.hzb-hero__picture .hzb-hero__image { display: block; width: 100%; height: 100%; max-width: none; object-position: center center; }
.hzb-hero-image--cover .hzb-hero__image { object-fit: cover; }
.hzb-hero-image--contain .hzb-hero__image { object-fit: contain; }
.hzb-promo__image { object-fit: cover; object-position: center center; }
.hzb-hero__overlay,
.hzb-promo__overlay { position: absolute; inset: 0; z-index: -2; background: linear-gradient(90deg, rgba(4, 9, 20, var(--hzb-hero-overlay, var(--hzb-promo-overlay, .55))), rgba(4, 9, 20, calc(var(--hzb-hero-overlay, var(--hzb-promo-overlay, .55)) * .72))); }
.hzb-hero::after,
.hzb-promo::after { content: ""; position: absolute; inset: 0; z-index: -1; background: radial-gradient(circle at 70% 20%, rgba(167, 139, 250, .24), transparent 42%); pointer-events: none; }
.hzb-hero--bottom-fade::before {
    content: "";
    position: absolute;
    inset-inline: 0;
    inset-block-end: 0;
    z-index: 0;
    height: var(--hzb-hero-fade-size, 46%);
    background: linear-gradient(180deg, transparent 0%, var(--hzb-hero-fade-color, var(--hzb-bg)) 76%, var(--hzb-hero-fade-color, var(--hzb-bg)) 100%);
    pointer-events: none;
}
.hzb-hero__content,
.hzb-promo__content { position: relative; z-index: 1; width: min(100%, 860px); padding: clamp(34px, 7vw, 92px); }
.hzb-promo--space-tight .hzb-promo__content { padding: clamp(22px, 4vw, 44px); }
.hzb-promo--space-balanced .hzb-promo__content { padding: clamp(30px, 5vw, 60px); }
.hzb-promo--space-airy .hzb-promo__content { padding: clamp(40px, 7vw, 86px); }
.hzb-promo--space-tight .hzb-eyebrow { margin-bottom: 10px; }
.hzb-promo--space-tight .hzb-promo__description { margin-block: 10px 16px; }
.hzb-align--center .hzb-hero__content,
.hzb-align--center .hzb-promo__content { margin-inline: auto; text-align: center; }
.hzb-align--end .hzb-hero__content { margin-inline-start: auto; text-align: end; }
.hzb-align--end .hzb-actions { justify-content: flex-end; }
.hzb-hero-content--narrow .hzb-hero__content { width: min(100%, 660px); }
.hzb-hero-content--normal .hzb-hero__content { width: min(100%, 860px); }
.hzb-hero-content--wide .hzb-hero__content { width: min(100%, 1080px); }
.hzb-hero__title,
.hzb-promo__title { margin: 0; color: inherit; font-size: clamp(2rem, 5.5vw, 4.7rem); font-weight: 900; line-height: 1.12; letter-spacing: -.035em; }
.hzb-hero__title--intro {
    animation: hzb-hero-title-intro .82s cubic-bezier(.18, .86, .28, 1) both;
    will-change: opacity, transform, filter;
}
.hzb-promo__title { font-size: clamp(1.8rem, 4vw, 3.6rem); }
.hzb-hero__subtitle,
.hzb-promo__description { max-width: 720px; margin: 18px 0 26px; color: color-mix(in srgb, currentColor 82%, transparent); font-size: clamp(1rem, 2vw, 1.25rem); }
.hzb-align--center .hzb-hero__subtitle,
.hzb-align--center .hzb-promo__description { margin-inline: auto; }
.hzb-block-hero {
    max-width: none;
    padding-inline: 0;
}
.hzb-block-hero .hzb-hero {
    border: 0;
    border-radius: 0;
    box-shadow: none;
}

.hzb-hero .hzb-hero__button {
    position: relative;
    min-height: 58px;
    min-width: min(100%, 360px);
    overflow: hidden;
    color: #03131c !important;
    background: linear-gradient(135deg, #28d4ee 0%, #5de7f4 52%, #19b8d4 100%) !important;
    border: 0 !important;
    border-radius: 18px;
    box-shadow: 0 18px 42px rgba(34, 211, 238, .34), inset 0 1px 0 rgba(255, 255, 255, .32) !important;
    font-size: clamp(1rem, 2vw, 1.18rem);
    font-weight: 900;
    isolation: isolate;
    animation: hzb-hero-button-float 2.8s ease-in-out infinite;
}

.hzb-hero .hzb-hero__button::before {
    content: "";
    position: absolute;
    inset: -80% auto -80% -45%;
    z-index: -1;
    width: 42%;
    transform: rotate(18deg);
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .72), transparent);
    animation: hzb-hero-button-shine 3.1s ease-in-out infinite;
}

.hzb-hero .hzb-hero__button:hover {
    color: #03131c !important;
    background: linear-gradient(135deg, #65f0ff 0%, #23c9e6 100%) !important;
    transform: translateY(-3px) scale(1.015);
    box-shadow: 0 22px 52px rgba(34, 211, 238, .42), inset 0 1px 0 rgba(255, 255, 255, .36) !important;
}

@keyframes hzb-hero-title-intro {
    0% {
        opacity: 0;
        filter: blur(12px);
        transform: translateY(22px) scale(.985);
    }
    58% {
        opacity: 1;
        filter: blur(1px);
        transform: translateY(-2px) scale(1.006);
    }
    100% {
        opacity: 1;
        filter: blur(0);
        transform: translateY(0) scale(1);
    }
}

@keyframes hzb-hero-button-shine {
    0%, 46% { transform: translateX(0) rotate(18deg); opacity: 0; }
    58% { opacity: 1; }
    78%, 100% { transform: translateX(430%) rotate(18deg); opacity: 0; }
}

@keyframes hzb-hero-button-float {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-2px); }
}

.hzb-features__grid,
.hzb-category-grid,
.hzb-product-grid { display: grid; gap: clamp(12px, 2vw, 22px); }
.hzb-grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.hzb-grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.hzb-grid--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.hzb-grid--5 { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.hzb-grid--6 { grid-template-columns: repeat(6, minmax(0, 1fr)); }

.hzb-features > .hzb-section-title { margin-bottom: clamp(20px, 4vw, 36px); }
.hzb-feature-card { min-width: 0; display: flex; align-items: flex-start; gap: 13px; padding: clamp(16px, 2.2vw, 24px); background: linear-gradient(145deg, rgba(23, 32, 51, .9), rgba(15, 24, 39, .92)); border: 1px solid var(--hzb-border); border-radius: 16px; }
.hzb-feature-card__icon { width: 48px; height: 48px; display: grid; place-items: center; flex: 0 0 48px; color: var(--hzb-primary); background: rgba(34, 211, 238, .1); border-radius: 13px; }
.hzb-icon { width: 25px; height: 25px; }
.hzb-feature-card h3 { margin: 0 0 5px; color: var(--hzb-text); font-size: 1rem; }
.hzb-feature-card p { margin: 0; color: var(--hzb-muted); font-size: .86rem; line-height: 1.6; }

.hzb-category-card { min-width: 0; display: block; overflow: hidden; color: var(--hzb-text); background: var(--hzb-surface); border: 1px solid var(--hzb-border); border-radius: 16px; transition: transform .18s ease, border-color .18s ease; }
.hzb-category-card:hover { color: #fff; border-color: rgba(34, 211, 238, .6); transform: translateY(-4px); }
.hzb-category-card__media { aspect-ratio: 4 / 3; display: grid; place-items: center; overflow: hidden; background: linear-gradient(145deg, #172033, #0b1220); }
.hzb-category-card__media img { width: 100%; height: 100%; object-fit: cover; transition: transform .25s ease; }
.hzb-category-card:hover .hzb-category-card__media img { transform: scale(1.04); }
.hzb-category-card__fallback { font-size: clamp(2rem, 5vw, 4rem); font-weight: 900; color: var(--hzb-primary); }
.hzb-category-card__content { display: block; padding: 15px; }
.hzb-category-card__content strong,
.hzb-category-card__content small { display: block; }
.hzb-category-card__content strong { font-size: 1rem; }
.hzb-category-card__content small { margin-top: 4px; color: var(--hzb-muted); font-size: .78rem; }

.hzb-product-card { min-width: 0; display: flex; flex-direction: column; overflow: hidden; background: #13223a; border: 1px solid rgba(180, 199, 225, .18); border-radius: 8px; transition: transform .18s ease, border-color .18s ease, background-color .18s ease; }
.hzb-product-card:hover { border-color: rgba(34, 211, 238, .46); background: #182944; transform: translateY(-4px); }
.hzb-product-card__media { position: relative; aspect-ratio: 1 / 1; display: block; overflow: hidden; background: #07111f; }
.hzb-product-card__media img { width: 100%; height: 100%; object-fit: cover; transition: transform .25s ease; }
.hzb-product-card:hover .hzb-product-card__media img { transform: scale(1.035); }
.hzb-product-card__badge { position: absolute; inset-block-start: 10px; inset-inline-start: 10px; padding: 5px 9px; color: #07111f; background: #ffd166; border-radius: 6px; font-size: .72rem; font-weight: 900; }
.hzb-product-card__content { display: flex; flex: 1; flex-direction: column; gap: 8px; padding: 14px; text-align: start; }
.hzb-product-card__content h3 { min-height: 0; margin: 0; font-size: clamp(1rem, 1.5vw, 1.15rem); line-height: 1.45; font-weight: 900; }
.hzb-product-card__content h3 a { color: #fff; }
.hzb-product-card__content h3 a:hover { color: var(--hzb-primary); }
.hzb-product-card__category { color: #aebbd0; font-size: .83rem; font-weight: 700; line-height: 1.4; }
.hzb-product-card__rating { min-height: 24px; display: flex; align-items: center; margin: 0; }
.hzb-product-card__stars { display: inline-flex; gap: 3px; color: #526278; font-size: 1rem; line-height: 1; letter-spacing: 0; }
.hzb-product-card__stars .is-filled { color: #f7bf4f; }
.hzb-product-card__stars .is-empty { color: #526278; }
.hzb-product-card__footer { display: none; }
.hzb-product-card__price { margin-top: 2px; color: var(--hzb-primary); font-size: 1.08rem; font-weight: 900; }
.hzb-product-card__price del { color: #64748b; font-size: .8em; }
.hzb-product-card__price ins { text-decoration: none; }
.hzb-product-card__actions { display: grid; gap: 8px; margin-top: auto; padding-top: 8px; }
.hzb-product-card__actions .hzb-button { width: 100%; min-height: 38px; padding: 7px 14px; border-radius: 7px; font-size: .88rem; }
.hzb-product-card__actions .hzb-button--details { color: #06131c !important; background: #f7bf4f !important; }
.hzb-product-card__actions .hzb-button--details:hover { color: #06131c !important; background: #ffd166 !important; }
.hzb-product-card__actions .hzb-button--cart { color: #06131c !important; background: var(--hzb-solid-primary, #22c9e6) !important; }
.hzb-product-card__actions .hzb-button--cart:hover { color: #06131c !important; background: var(--hzb-solid-primary-hover, #55d8ee) !important; }
.hzb-product-card__actions .hzb-button.loading { opacity: .72; pointer-events: none; }
.hzb-product-card__actions .hzb-button.added { color: #fff !important; background: var(--hzb-solid-success, #159a68) !important; }

.hzb-category-products__more {
    min-height: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    flex: 0 0 auto;
    padding: 9px 16px;
    color: #04131b;
    background: linear-gradient(135deg, #67e8f9, var(--hzb-primary));
    border-radius: 12px;
    font-weight: 850;
    box-shadow: 0 8px 24px rgba(34, 211, 238, .16);
    transition: transform .18s ease, box-shadow .18s ease;
}
.hzb-category-products__more:hover { color: #04131b; transform: translateY(-2px); box-shadow: 0 12px 28px rgba(34, 211, 238, .24); }
.hzb-category-products__viewport { position: relative; }
.hzb-category-products__track {
    display: grid;
    grid-auto-flow: column;
    gap: clamp(12px, 2vw, 20px);
    overflow-x: auto;
    padding: 4px 3px 16px;
    scroll-behavior: smooth;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
    overscroll-behavior-inline: contain;
    cursor: grab;
}
.hzb-category-products__track::-webkit-scrollbar { display: none; }
.hzb-category-products__track.is-dragging { scroll-behavior: auto; scroll-snap-type: none; cursor: grabbing; user-select: none; }
.hzb-category-products__track.hzb-slider-cards--2 { grid-auto-columns: calc((100% - 20px) / 2); }
.hzb-category-products__track.hzb-slider-cards--3 { grid-auto-columns: calc((100% - 40px) / 3); }
.hzb-category-products__track.hzb-slider-cards--4 { grid-auto-columns: calc((100% - 60px) / 4); }
.hzb-category-products__track.hzb-slider-cards--5 { grid-auto-columns: calc((100% - 80px) / 5); }
.hzb-category-products__slide { display: flex; flex-direction: column; scroll-snap-align: start; scroll-snap-stop: always; }
.hzb-category-products__slide .hzb-product-card__content { display: flex; flex: 1; flex-direction: column; }
.hzb-category-products__slide .hzb-product-card__actions { margin-top: auto; }
.hzb-slider-arrow {
    position: absolute;
    inset-block-start: 50%;
    z-index: 4;
    width: 46px;
    height: 46px;
    display: grid;
    place-items: center;
    padding: 0 0 4px;
    color: #fff;
    background: rgba(10, 20, 36, .94);
    border: 1px solid rgba(34, 211, 238, .62);
    border-radius: 50%;
    box-shadow: 0 12px 30px rgba(0, 0, 0, .34);
    font: 800 2rem/1 sans-serif;
    transform: translateY(-50%);
    cursor: pointer;
    transition: background-color .18s ease, border-color .18s ease, transform .18s ease;
}
.hzb-slider-arrow:hover { background: var(--hzb-primary-strong); border-color: var(--hzb-primary); transform: translateY(-50%) scale(1.06); }
.hzb-slider-arrow:disabled { opacity: .35; cursor: default; }
.hzb-slider-arrow--previous { inset-inline-start: -20px; }
.hzb-slider-arrow--next { inset-inline-end: -20px; }
.hzb-category-products__hint { margin: 8px 0 0; color: var(--hzb-muted); font-size: .78rem; text-align: center; }

.hzb-product-spotlight { display: grid; grid-template-columns: minmax(280px, .92fr) minmax(0, 1.08fr); gap: clamp(24px, 5vw, 68px); align-items: center; padding: clamp(24px, 5vw, 64px); background: var(--hzb-spotlight-bg, var(--hzb-surface)); border: 1px solid var(--hzb-border); border-radius: clamp(18px, 3vw, 28px); box-shadow: var(--hzb-shadow); }
.hzb-product-spotlight--image-end .hzb-product-spotlight__media { order: 2; }
.hzb-product-spotlight__media { position: relative; aspect-ratio: 1 / 1; overflow: hidden; background: #0b1220; border-radius: 18px; }
.hzb-product-spotlight__media img { width: 100%; height: 100%; object-fit: cover; }
.hzb-product-spotlight__content h2 { margin: 0; color: var(--hzb-text); font-size: clamp(1.8rem, 4vw, 3.35rem); line-height: 1.18; }
.hzb-product-spotlight__content > p { color: var(--hzb-muted); font-size: 1rem; }
.hzb-product-spotlight__price { margin: 18px 0; color: var(--hzb-primary); font-size: clamp(1.45rem, 3vw, 2.25rem); font-weight: 900; }
.hzb-product-spotlight__price ins { text-decoration: none; }
.hzb-product-spotlight__stock { margin-top: -8px; }

.hzb-rich-text { margin-inline: auto; }
.hzb-rich-text.hzb-width--narrow { max-width: var(--hzb-narrow); }
.hzb-rich-text.hzb-width--content { max-width: var(--hzb-content); }
.hzb-rich-text.hzb-width--wide { max-width: var(--hzb-wide); }
.hzb-rich-text.hzb-align--center { text-align: center; }
.hzb-rich-text__content { color: var(--hzb-muted); font-size: clamp(1rem, 1.7vw, 1.12rem); }
.hzb-rich-text__content h2,
.hzb-rich-text__content h3 { color: var(--hzb-text); }
.hzb-rich-text__content a { color: var(--hzb-primary); text-decoration: underline; }

.hzb-spacer { min-height: 12px; display: flex; align-items: center; }
.hzb-spacer--sm { height: 24px; }
.hzb-spacer--md { height: 48px; }
.hzb-spacer--lg { height: 76px; }
.hzb-spacer--xl { height: 112px; }
.hzb-divider { width: 100%; border-bottom: 1px solid var(--hzb-divider-color, var(--hzb-border)); }
.hzb-empty-notice { margin: 0; padding: 22px; color: var(--hzb-muted); background: var(--hzb-surface); border: 1px dashed var(--hzb-border); border-radius: 14px; text-align: center; }

/* Extended home-builder catalogue. */
.hzb-cta { display: flex; align-items: center; justify-content: space-between; gap: 26px; padding: clamp(24px, 5vw, 52px); color: var(--hzb-cta-text); background: var(--hzb-cta-bg); border-radius: 22px; box-shadow: var(--hzb-shadow); }
.hzb-cta--vertical { flex-direction: column; text-align: center; }
.hzb-cta h2, .hzb-whatsapp h2 { margin: 0; color: inherit; font-size: clamp(1.6rem, 3.5vw, 2.65rem); }
.hzb-cta p, .hzb-whatsapp p { margin: 8px 0 0; color: color-mix(in srgb, currentColor 82%, transparent); }

.hzb-image-text { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(24px, 5vw, 68px); align-items: center; }
.hzb-image-text--end .hzb-image-text__media { order: 2; }
.hzb-image-text__media { overflow: hidden; background: var(--hzb-surface); border: 1px solid var(--hzb-border); border-radius: 22px; }
.hzb-image-text__media img { width: 100%; height: 100%; object-fit: cover; }
.hzb-image-text__content h2 { margin: 0; color: var(--hzb-text); font-size: clamp(1.8rem, 4vw, 3.2rem); line-height: 1.2; }
.hzb-image-text__content p { color: var(--hzb-muted); }
.hzb-ratio--square { aspect-ratio: 1; }
.hzb-ratio--landscape, .hzb-ratio--4-3 { aspect-ratio: 4 / 3; }
.hzb-ratio--wide, .hzb-ratio--16-9 { aspect-ratio: 16 / 9; }
.hzb-ratio--1-1 { aspect-ratio: 1; }

.hzb-banner-grid, .hzb-stats__grid, .hzb-post-grid, .hzb-portfolio__grid { display: grid; gap: clamp(14px, 2.4vw, 24px); }
.hzb-banner-card, .hzb-portfolio-card { position: relative; display: block; overflow: hidden; color: #fff; background: var(--hzb-surface); border: 1px solid var(--hzb-border); border-radius: 18px; }
.hzb-banner-card img, .hzb-portfolio-card img, .hzb-banner-card > .hzb-media-placeholder, .hzb-portfolio-card > .hzb-media-placeholder { width: 100%; height: 100%; display: block; object-fit: cover; }
.hzb-banner-card::after, .hzb-portfolio-card::after { content: ""; position: absolute; inset: 35% 0 0; background: linear-gradient(transparent, rgba(0,0,0,.86)); }
.hzb-banner-card strong, .hzb-portfolio-card strong { position: absolute; inset-inline: 18px; inset-block-end: 15px; z-index: 2; color: #fff; font-size: 1.05rem; }
.hzb-media-placeholder { min-height: 150px; display: block; background: linear-gradient(135deg, #172033, #0b1220); }

.hzb-faq__items { max-width: 900px; display: grid; gap: 12px; margin-inline: auto; }
.hzb-faq__item { overflow: hidden; background: var(--hzb-surface); border: 1px solid var(--hzb-border); border-radius: 14px; }
.hzb-faq--minimal .hzb-faq__item { background: transparent; border-width: 0 0 1px; border-radius: 0; }
.hzb-faq summary { min-height: 58px; display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 16px 20px; color: var(--hzb-text); cursor: pointer; font-weight: 800; list-style: none; }
.hzb-faq summary::-webkit-details-marker { display: none; }
.hzb-faq summary span { color: var(--hzb-primary); font-size: 1.5rem; transition: transform .18s ease; }
.hzb-faq details[open] summary span { transform: rotate(45deg); }
.hzb-faq__answer { padding: 0 20px 18px; color: var(--hzb-muted); }
.hzb-faq__answer > :last-child { margin-bottom: 0; }

.hzb-stats > .hzb-section-title, .hzb-logos > .hzb-section-title, .hzb-before-after > .hzb-section-title { margin-bottom: 28px; }
.hzb-stat { padding: clamp(20px, 3vw, 34px); text-align: center; background: linear-gradient(145deg, var(--hzb-surface), #0b1220); border: 1px solid var(--hzb-border); border-radius: 17px; }
.hzb-stat strong { display: block; color: var(--hzb-primary); font-size: clamp(2rem, 5vw, 3.6rem); line-height: 1; }
.hzb-stat strong span { font-size: .6em; }
.hzb-stat p { margin: 10px 0 0; color: var(--hzb-muted); }

.hzb-testimonials__track { display: grid; grid-auto-flow: column; grid-auto-columns: calc((100% - 36px) / 3); gap: 18px; overflow-x: auto; padding: 3px 3px 14px; scroll-snap-type: x mandatory; scrollbar-width: thin; }
.hzb-testimonials__track.hzb-slider-cols--1 { grid-auto-columns: 100%; }
.hzb-testimonials__track.hzb-slider-cols--2 { grid-auto-columns: calc((100% - 18px) / 2); }
.hzb-testimonial { scroll-snap-align: start; padding: clamp(20px, 3vw, 30px); background: var(--hzb-surface); border: 1px solid var(--hzb-border); border-radius: 17px; }
.hzb-testimonial__stars { color: #fbbf24; letter-spacing: 3px; }
.hzb-testimonial blockquote { min-height: 4.8em; margin: 16px 0 24px; color: var(--hzb-text); font-size: 1rem; }
.hzb-testimonial footer { display: flex; align-items: center; gap: 12px; }
.hzb-testimonial footer img, .hzb-avatar-fallback { width: 48px; height: 48px; display: grid; place-items: center; object-fit: cover; color: #04131b; background: var(--hzb-primary); border-radius: 50%; font-weight: 900; }
.hzb-testimonial footer strong, .hzb-testimonial footer small { display: block; }
.hzb-testimonial footer small { color: var(--hzb-muted); }

.hzb-video { max-width: 1040px; margin-inline: auto; }
.hzb-video__frame { position: relative; overflow: hidden; background: #020617; border: 1px solid var(--hzb-border); border-radius: 22px; box-shadow: var(--hzb-shadow); }
.hzb-video__frame > img, .hzb-video__frame > iframe { width: 100%; height: 100%; display: block; object-fit: cover; border: 0; }
.hzb-video__play { position: absolute; inset: 50% auto auto 50%; min-height: 54px; display: flex; align-items: center; gap: 10px; padding: 12px 20px; color: #03151c; background: var(--hzb-primary); border: 0; border-radius: 999px; transform: translate(-50%, -50%); cursor: pointer; font-weight: 850; }
.hzb-video__play span { font-size: 1.2rem; }

.hzb-whatsapp { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: clamp(24px, 5vw, 48px); color: #fff; background: var(--hzb-whatsapp-bg); border-radius: 22px; }
.hzb-button--whatsapp { color: #073b20; background: #bbf7d0; }
.hzb-empty-inline { color: #fde68a; }

.hzb-post-card { overflow: hidden; background: var(--hzb-surface); border: 1px solid var(--hzb-border); border-radius: 17px; }
.hzb-post-card__media { aspect-ratio: 16 / 10; display: block; overflow: hidden; background: #0b1220; }
.hzb-post-card__media img, .hzb-post-card__media .hzb-media-placeholder { width: 100%; height: 100%; object-fit: cover; }
.hzb-post-card__content { padding: 18px; }
.hzb-post-card time { color: var(--hzb-primary); font-size: .8rem; }
.hzb-post-card h3 { margin: 7px 0; font-size: 1.15rem; }
.hzb-post-card h3 a { color: var(--hzb-text); }
.hzb-post-card p { margin: 0; color: var(--hzb-muted); }

.hzb-before-after__stage { position: relative; max-width: 1040px; overflow: hidden; margin-inline: auto; background: var(--hzb-surface); border: 1px solid var(--hzb-border); border-radius: 22px; }
.hzb-before-after__stage img, .hzb-before-after__stage > .hzb-media-placeholder { width: 100%; height: 100%; display: block; object-fit: cover; }
.hzb-before-after__before { position: absolute; inset: 0; clip-path: inset(0 calc(100% - var(--hzb-before-after)) 0 0); }
[dir="rtl"] .hzb-before-after__before { clip-path: inset(0 0 0 calc(100% - var(--hzb-before-after))); }
.hzb-before-after__before img, .hzb-before-after__before .hzb-media-placeholder { width: 100%; height: 100%; object-fit: cover; }
.hzb-before-after__handle { position: absolute; inset-block: 0; inset-inline-start: var(--hzb-before-after); width: 3px; display: grid; place-items: center; color: #03151c; background: #fff; transform: translateX(-50%); }
.hzb-before-after__handle::after { content: ""; width: 42px; height: 42px; position: absolute; z-index: -1; background: #fff; border-radius: 50%; }
.hzb-before-after__label { position: absolute; inset-block-start: 14px; padding: 5px 10px; color: #fff; background: rgba(0,0,0,.68); border-radius: 8px; }
.hzb-before-after__label--before { inset-inline-start: 14px; }
.hzb-before-after__label--after { inset-inline-end: 14px; }
.hzb-before-after input { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; opacity: 0; cursor: ew-resize; }

.hzb-countdown { display: grid; grid-template-columns: 1.1fr .9fr; gap: clamp(24px, 5vw, 62px); align-items: center; padding: clamp(28px, 5vw, 58px); background: radial-gradient(circle at 80% 10%, rgba(34,211,238,.16), transparent 45%), var(--hzb-surface); border: 1px solid var(--hzb-border); border-radius: 24px; }
.hzb-countdown__copy h2 { margin: 0; color: var(--hzb-text); font-size: clamp(2rem, 4vw, 3.4rem); }
.hzb-countdown__copy p { color: var(--hzb-muted); }
.hzb-countdown__price { margin: 16px 0; color: var(--hzb-primary); font-size: 1.65rem; font-weight: 900; }
.hzb-countdown__price ins { text-decoration: none; }
.hzb-countdown__timer { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; }
.hzb-countdown__timer > div { padding: 16px 8px; text-align: center; background: #070b14; border: 1px solid var(--hzb-border); border-radius: 13px; }
.hzb-countdown__timer strong, .hzb-countdown__timer span { display: block; }
.hzb-countdown__timer strong { color: var(--hzb-primary); font-size: clamp(1.35rem, 3vw, 2.25rem); }
.hzb-countdown__timer span { color: var(--hzb-muted); font-size: .78rem; }
.hzb-countdown__expired { display: none; grid-column: 1 / -1; color: #fda4af; text-align: center; }
.hzb-countdown.is-expired .hzb-countdown__timer > div { display: none; }
.hzb-countdown.is-expired .hzb-countdown__expired { display: block; }

.hzb-portfolio-card { aspect-ratio: 4 / 3; }
.hzb-logos__viewport { overflow: hidden; padding-block: 12px; mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); }
.hzb-logos__track { width: max-content; display: flex; animation: hzb-logo-marquee 30s linear infinite; }
.hzb-logos--slow { animation-duration: 48s; }
.hzb-logos--fast { animation-duration: 18s; }
.hzb-logos__set { display: flex; align-items: center; gap: 18px; padding-inline-end: 18px; }
.hzb-logos__set a { width: 180px; height: 92px; display: grid; place-items: center; padding: 16px; color: var(--hzb-muted); background: var(--hzb-surface); border: 1px solid var(--hzb-border); border-radius: 14px; }
.hzb-logos__set img { max-width: 100%; max-height: 58px; object-fit: contain; }
.hzb-logos.is-grayscale img { filter: grayscale(1); opacity: .72; transition: .2s; }
.hzb-logos.is-grayscale a:hover img, .hzb-logos.is-grayscale a:focus img { filter: none; opacity: 1; }
.hzb-logos__track:hover, .hzb-logos__track:focus-within { animation-play-state: paused; }
@keyframes hzb-logo-marquee { to { transform: translateX(50%); } }

.hzb-comparison__scroll { overflow-x: auto; border: 1px solid var(--hzb-border); border-radius: 18px; }
.hzb-comparison table { width: 100%; min-width: 720px; border-collapse: collapse; background: var(--hzb-surface); }
.hzb-comparison th, .hzb-comparison td { padding: 16px; color: var(--hzb-text); border: 1px solid var(--hzb-border); text-align: center; }
.hzb-comparison th:first-child { text-align: start; }
.hzb-comparison thead th { min-width: 150px; background: #0b1220; }
.hzb-comparison thead th > span, .hzb-comparison thead th > strong, .hzb-comparison thead th > b { display: block; }
.hzb-comparison thead th > span { width: max-content; margin: 0 auto 7px; padding: 3px 8px; color: #03151c; background: var(--hzb-primary); border-radius: 999px; font-size: .72rem; }
.hzb-comparison thead th > b { margin-top: 8px; color: var(--hzb-primary); font-size: 1.25rem; }
.hzb-comparison .is-highlighted { box-shadow: inset 0 3px var(--hzb-primary); }
.hzb-html-embed__content { overflow: auto; color: var(--hzb-text); }
.hzb-html-embed iframe { width: 100%; min-height: 420px; border: 0; border-radius: 16px; }

@media (max-width: 1023px) {
    .hzb-grid--4,
    .hzb-grid--5,
    .hzb-grid--6 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .hzb-grid--3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .hzb-product-spotlight { grid-template-columns: minmax(240px, .9fr) minmax(0, 1.1fr); }
    .hzb-testimonials__track { grid-auto-columns: calc((100% - 18px) / 2); }
}

@media (max-width: 767px) {
    .hzb-hero__picture .hzb-hero__image { object-position: center center; }

    .hzb-block-wrapper { padding-inline: 16px; }
    .hzb-max--full { padding-inline: 0; }
    .hzb-section-heading--actions { align-items: flex-start; flex-direction: column; }
    .hzb-hero,
    .hzb-promo { border-radius: 16px; }
    .hzb-max--full .hzb-hero,
    .hzb-max--full .hzb-promo { border-radius: 0; border-inline: 0; }
    .hzb-hero--large { min-height: 500px; }
    .hzb-promo--compact { min-height: 230px; }
    .hzb-promo--normal { min-height: 300px; }
    .hzb-promo--large { min-height: 390px; }
    
    /* Mobile Vertical Positioning Mechanics */
    .hzb-hero.hzb-mvalign--bottom,
    .hzb-hero:not(.hzb-mvalign--top):not(.hzb-mvalign--middle) {
        align-items: flex-end !important;
        padding-bottom: 24px !important;
    }
    .hzb-hero.hzb-mvalign--middle {
        align-items: center !important;
    }
    .hzb-hero.hzb-mvalign--top {
        align-items: flex-start !important;
        padding-top: 30px !important;
    }

    .hzb-hero__content,
    .hzb-promo__content { padding: 24px 20px 20px 20px !important; }
    .hzb-promo--space-tight .hzb-promo__content { padding: 18px 16px !important; }
    .hzb-promo--space-balanced .hzb-promo__content { padding: 24px 18px !important; }
    .hzb-promo--space-airy .hzb-promo__content { padding: 32px 20px !important; }
    .hzb-promo__title { font-size: clamp(1.45rem, 6.6vw, 2rem); }
    .hzb-promo__description { margin-block: 10px 16px; font-size: clamp(.9rem, 4vw, 1.05rem); }
    .hzb-promo .hzb-button { min-height: 40px; padding: 8px 16px; }
    .hzb-hero__title { font-size: clamp(1.8rem, 8vw, 2.6rem); }
    .hzb-actions { width: 100%; }
    .hzb-actions .hzb-button { flex: 1 1 170px; }
    .hzb-grid--3,
    .hzb-grid--4,
    .hzb-grid--5,
    .hzb-grid--6 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .hzb-product-grid.hzb-grid-mobile--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .hzb-product-grid.hzb-grid-mobile--1 { grid-template-columns: 1fr; }
    .hzb-feature-card { grid-column: span 2; }
    .hzb-features__grid--mobile-2 .hzb-feature-card {
        grid-column: auto;
        flex-direction: column;
        align-items: center;
        gap: 10px;
        padding: 14px 10px;
        text-align: center;
    }
    .hzb-features__grid--mobile-2 .hzb-feature-card__icon {
        width: 44px;
        height: 44px;
        flex-basis: 44px;
    }
    .hzb-features__grid--mobile-2 .hzb-feature-card h3 {
        font-size: .9rem;
    }
    .hzb-features__grid--mobile-2 .hzb-feature-card p {
        font-size: .78rem;
        line-height: 1.5;
    }
    .hzb-product-card__footer { align-items: stretch; flex-direction: column; }
    .hzb-product-card__footer .hzb-button { width: 100%; }
    .hzb-product-spotlight { grid-template-columns: 1fr; padding: 18px; }
    .hzb-product-spotlight--image-end .hzb-product-spotlight__media { order: 0; }
    .hzb-cta, .hzb-whatsapp { align-items: stretch; flex-direction: column; }
    .hzb-image-text, .hzb-countdown { grid-template-columns: 1fr; }
    .hzb-image-text--end .hzb-image-text__media { order: 0; }
    .hzb-testimonials__track, .hzb-testimonials__track.hzb-slider-cols--2 { grid-auto-columns: 86%; }
    .hzb-stats__grid, .hzb-post-grid, .hzb-portfolio__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 420px) {
    .hzb-category-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .hzb-product-grid { grid-template-columns: 1fr; }
    .hzb-product-grid.hzb-grid-mobile--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .hzb-product-grid.hzb-grid-mobile--1 { grid-template-columns: 1fr; }
    .hzb-post-grid, .hzb-portfolio__grid { grid-template-columns: 1fr; }
    .hzb-countdown__timer { grid-template-columns: repeat(2, 1fr); }
    .hzb-category-card__content { padding: 12px; }
}

@media (min-width: 768px) {
    .hzb-visible--mobile { display: none; }
}

@media (max-width: 767px) {
    .hzb-visible--desktop { display: none; }
}

@media (max-width: 900px) {
    .hzb-category-products__track.hzb-slider-cards--3,
    .hzb-category-products__track.hzb-slider-cards--4,
    .hzb-category-products__track.hzb-slider-cards--5 { grid-auto-columns: calc((100% - 18px) / 2); }
}

@media (max-width: 640px) {
    .hzb-category-products__more { width: 100%; }
    .hzb-category-products__track,
    .hzb-category-products__track.hzb-slider-cards--2,
    .hzb-category-products__track.hzb-slider-cards--3,
    .hzb-category-products__track.hzb-slider-cards--4,
    .hzb-category-products__track.hzb-slider-cards--5 { grid-auto-columns: minmax(230px, 82vw); }
    .hzb-category-products__track.hzb-slider-mobile-cards--2 { grid-auto-columns: calc((100% - 12px) / 2); }
    .hzb-category-products__track.hzb-slider-mobile-cards--1 { grid-auto-columns: minmax(230px, 82vw); }
    .hzb-slider-arrow { display: none; }
    .hzb-category-products__hint { text-align: start; }
}

@media (prefers-reduced-motion: reduce) {
    .hzb-root *,
    .hzb-root *::before,
    .hzb-root *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; }
    .hzb-logos__track { animation: none !important; }
}

/* Cyber Glass & Weightless Spatial System */
.hzb-root {
    --hzb-primary: #00f2fe;
    --hzb-primary-strong: #00b4d8;
    --hzb-accent: #9d4edd;
    --hzb-bg: #030712;
    --hzb-surface: #0b1329;
    --hzb-surface-2: #131f3a;
    --hzb-text: #f8fafc;
    --hzb-muted: #94a3b8;
    --hzb-border: rgba(255, 255, 255, 0.1);
    --hzb-radius: 18px;
    --hzb-shadow: 0 20px 40px rgba(0, 0, 0, 0.45);
}

.hzb-product-card,
.hzb-feature-card,
.hzb-category-card,
.hzb-product-spotlight,
.hzb-testimonial-card,
.hzb-stat-card,
.hzb-post-card,
.hzb-portfolio-card {
    background: rgba(15, 23, 42, 0.65) !important;
    backdrop-filter: blur(16px) saturate(180%);
    -webkit-backdrop-filter: blur(16px) saturate(180%);
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
    border-radius: 20px !important;
    box-shadow: 0 14px 35px rgba(0, 0, 0, 0.35) !important;
    transition: transform 0.32s cubic-bezier(0.18, 0.86, 0.28, 1), border-color 0.32s ease, box-shadow 0.32s ease, background-color 0.32s ease !important;
    position: relative;
    overflow: hidden;
}

.hzb-product-card:hover,
.hzb-feature-card:hover,
.hzb-category-card:hover {
    transform: translateY(-6px) scale(1.015) !important;
    background: rgba(24, 38, 64, 0.85) !important;
    border-color: rgba(0, 242, 254, 0.45) !important;
    box-shadow: 0 22px 50px rgba(0, 242, 254, 0.15), 0 0 25px rgba(0, 242, 254, 0.1) !important;
}

/* Glass Buttons */
.hzb-button--primary,
.hzb-button--cart {
    color: #030d14 !important;
    background: linear-gradient(135deg, #00f2fe 0%, #38bdf8 100%) !important;
    border: 0 !important;
    border-radius: 12px !important;
    font-weight: 800 !important;
    box-shadow: 0 6px 20px rgba(0, 242, 254, 0.25) !important;
    transition: transform 0.22s ease, box-shadow 0.22s ease !important;
}

.hzb-button--primary:hover,
.hzb-button--cart:not(.hzb-button--disabled):hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 10px 28px rgba(0, 242, 254, 0.45) !important;
}

.hzb-button--details {
    color: #ffffff !important;
    background: rgba(255, 255, 255, 0.08) !important;
    border: 1px solid rgba(255, 255, 255, 0.2) !important;
    border-radius: 12px !important;
    backdrop-filter: blur(8px);
    transition: transform 0.22s ease, border-color 0.22s ease, background 0.22s ease !important;
}

.hzb-button--details:hover {
    transform: translateY(-2px) !important;
    background: rgba(0, 242, 254, 0.15) !important;
    border-color: rgba(0, 242, 254, 0.6) !important;
    color: #00f2fe !important;
}

.hzb-button--disabled {
    opacity: 0.55 !important;
    cursor: not-allowed !important;
    transform: none !important;
    box-shadow: none !important;
    background: rgba(255, 255, 255, 0.06) !important;
    border-color: rgba(255, 255, 255, 0.1) !important;
    color: var(--hzb-muted) !important;
}

/* Slider Glass Arrows */
.hzb-slider-arrow {
    width: 44px !important;
    height: 44px !important;
    display: inline-grid !important;
    place-items: center !important;
    color: #ffffff !important;
    background: rgba(15, 23, 42, 0.75) !important;
    border: 1px solid rgba(255, 255, 255, 0.18) !important;
    border-radius: 50% !important;
    backdrop-filter: blur(12px) !important;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.3) !important;
    transition: transform 0.22s ease, background 0.22s ease, border-color 0.22s ease, box-shadow 0.22s ease !important;
}

.hzb-slider-arrow:hover {
    color: #00f2fe !important;
    background: rgba(24, 38, 64, 0.9) !important;
    border-color: rgba(0, 242, 254, 0.6) !important;
    transform: scale(1.1) !important;
    box-shadow: 0 0 20px rgba(0, 242, 254, 0.3) !important;
}

/* Unified Tajawal typography for prices and labels. */
.hzb-product-card__price,
.price {
    font-family: 'Tajawal', sans-serif !important;
    font-weight: 700 !important;
    color: #00f2fe !important;
    font-size: 1.15rem !important;
}
    box-shadow: none !important;
}

.hzb-feature-card__icon,
.hzb-eyebrow {
    color: #fff !important;
    background: #1d7184 !important;
    border: 0 !important;
}

.hzb-product-card__media,
.hzb-product-card__media img {
    aspect-ratio: 1 / 1;
}

.hzb-product-card__media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* Product cards: final storefront layout override. */
.hzb-root .hzb-product-card {
    display: flex !important;
    flex-direction: column !important;
    background: #13223a !important;
    border: 1px solid rgba(180, 199, 225, .18) !important;
    border-radius: 8px !important;
    box-shadow: none !important;
}

.hzb-root .hzb-product-card:hover {
    background: #182944 !important;
    border-color: rgba(34, 211, 238, .46) !important;
    transform: translateY(-4px);
}

.hzb-root .hzb-product-card__content {
    display: flex !important;
    flex: 1 !important;
    flex-direction: column !important;
    gap: 8px !important;
    padding: 14px !important;
}

.hzb-root .hzb-product-card__actions {
    display: grid !important;
    gap: 8px !important;
    margin-top: auto !important;
    padding-top: 8px !important;
}

.hzb-root .hzb-product-card__actions .hzb-button--details {
    color: #06131c !important;
    background: #f7bf4f !important;
}

.hzb-root .hzb-product-card__actions .hzb-button--cart {
    color: #06131c !important;
    background: var(--hzb-solid-primary, #22c9e6) !important;
}

.hzb-root .hzb-product-card.is-unavailable .hzb-product-card__media img {
    filter: grayscale(.18) brightness(.54);
}

.hzb-root .hzb-product-card__badge--soldout {
    inset: auto !important;
    top: 50% !important;
    left: 50% !important;
    right: auto !important;
    bottom: auto !important;
    z-index: 3 !important;
    display: block !important;
    width: min(68%, calc(100% - 1cm), 320px) !important;
    max-height: calc(100% - 1cm) !important;
    aspect-ratio: 509 / 391 !important;
    padding: 0 !important;
    color: transparent !important;
    background: transparent url("./images/sold-out-stamp.webp") center / contain no-repeat !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    font-size: 0 !important;
    line-height: 0 !important;
    text-indent: -9999px !important;
    white-space: nowrap !important;
    transform: translate(-50%, -50%) !important;
    transform-origin: center !important;
    backdrop-filter: none !important;
    text-shadow: none !important;
    pointer-events: none !important;
}

.hzb-root .hzb-product-card__badge--soldout::before {
    content: none !important;
}

.hzb-root .hzb-product-card__actions .hzb-button--disabled,
.hzb-root .hzb-product-card__actions .hzb-button--details.hzb-button--disabled,
.hzb-root .hzb-product-card__actions .hzb-button--cart.hzb-button--disabled {
    color: #d6dde8 !important;
    background: #4b5563 !important;
    cursor: not-allowed !important;
    opacity: .86 !important;
    pointer-events: none !important;
}

.hzb-cart-toast {
    position: fixed;
    inset-inline-end: 22px;
    inset-block-end: 22px;
    z-index: 999999;
    display: flex;
    align-items: center;
    gap: 12px;
    max-width: min(92vw, 360px);
    padding: 14px 16px;
    color: #ffffff;
    background: #102139;
    border: 1px solid rgba(93, 240, 170, .38);
    border-radius: 8px;
    box-shadow: 0 18px 50px rgba(0, 0, 0, .42);
    opacity: 0;
    transform: translateY(12px);
    pointer-events: none;
    transition: opacity .18s ease, transform .18s ease;
}

.hzb-cart-toast.is-visible {
    opacity: 1;
    transform: translateY(0);
}

.hzb-cart-toast__icon {
    width: 42px;
    height: 42px;
    display: grid;
    place-items: center;
    flex: 0 0 42px;
    color: #052116;
    background: #5df0aa;
    border-radius: 8px;
    font-size: 1.1rem;
}

.hzb-cart-toast strong,
.hzb-cart-toast span {
    display: block;
}

.hzb-cart-toast strong {
    font-size: .98rem;
}

.hzb-cart-toast span {
    margin-top: 2px;
    color: #cfe2ee;
    font-size: .82rem;
}

.added_to_cart.wc-forward,
.added_to_cart,
.hzb-product-card__actions .added_to_cart {
    display: none !important;
}