/* Decorative reef corners sit behind the storefront content. */
body.sea-body {
    isolation: isolate;
    --sea-point-coin: url("../images/ocean/alnoon-pearl-point-coin-v3.webp");
}

/* Pearl reward currency — same coin, real horizontal (Y-axis) flip */
.sea-rewards__hero-points,
.pdp-points,
.site-menu-quick__points,
.home-product__pts,
.home-product__pts-icon {
    perspective: 520px;
}

.sea-coin__spin,
.sea-rewards__hero-points::before,
.sea-guest-banner__chip > iconify-icon[icon="solar:crown-minimalistic-bold"],
.sea-checkout-summary__reward > iconify-icon[icon="solar:crown-minimalistic-bold"],
.sea-reward iconify-icon[icon="solar:crown-minimalistic-bold"],
.tp-product-reward-points .fa-star {
    background: var(--sea-point-coin) center / contain no-repeat !important;
    color: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}

body.page-product-detail .pdp-points__icon,
.sea-coin__spin,
.sea-rewards__hero-points::before,
.home-product__pts-icon .sea-treasure-coin {
    transform-origin: 50% 50%;
    transform-style: preserve-3d;
    backface-visibility: visible;
    will-change: transform;
    animation: sea-point-coin-flip 2.35s cubic-bezier(0.45, 0.02, 0.55, 0.98) infinite !important;
    filter: drop-shadow(0 3px 5px rgb(15 23 42 / 20%));
}

.sea-coin {
    display: inline-grid !important;
    place-items: center;
    width: 1.85rem;
    height: 1.85rem;
    flex: 0 0 auto;
    background: none !important;
    filter: none !important;
    animation: none !important;
    perspective: 520px;
}

.sea-coin__spin {
    display: block;
    width: 100%;
    height: 100%;
}

.sea-coin--sm {
    width: 1.2rem !important;
    height: 1.2rem !important;
}

.sea-coin--header {
    width: 1.55rem !important;
    height: 1.55rem !important;
}

.home-product__pts-icon iconify-icon,
body.page-product-detail .pdp-points__icon iconify-icon {
    display: none !important;
}

.home-product__pts-icon,
body.page-product-detail .pdp-points__icon {
    background: none !important;
    animation: none !important;
    overflow: visible !important;
}

.home-product__pts-icon {
    width: 1.7rem !important;
    height: 1.7rem !important;
    flex: 0 0 1.7rem !important;
}

body.page-product-detail .pdp-points__icon {
    width: 2.5rem !important;
    height: 2.5rem !important;
    flex: 0 0 2.5rem !important;
}

.sea-guest-banner__chip > iconify-icon[icon="solar:crown-minimalistic-bold"],
.sea-checkout-summary__reward > iconify-icon[icon="solar:crown-minimalistic-bold"],
.sea-reward iconify-icon[icon="solar:crown-minimalistic-bold"],
.tp-product-reward-points .fa-star {
    display: inline-block !important;
    width: 1.35rem !important;
    height: 1.35rem !important;
    flex: 0 0 1.35rem !important;
    font-size: 0 !important;
    vertical-align: middle;
    transform-origin: 50% 50%;
    animation: sea-point-coin-flip 2.6s cubic-bezier(0.45, 0.02, 0.55, 0.98) infinite !important;
    filter: drop-shadow(0 2px 4px rgb(15 23 42 / 18%));
}

.sea-guest-banner__chip > iconify-icon[icon="solar:crown-minimalistic-bold"] svg,
.sea-checkout-summary__reward > iconify-icon[icon="solar:crown-minimalistic-bold"] svg,
.sea-reward iconify-icon[icon="solar:crown-minimalistic-bold"] svg,
.tp-product-reward-points .fa-star::before {
    display: none !important;
}

.sea-rewards__hero-points {
    display: flex !important;
    align-items: center;
    justify-content: flex-start;
    gap: .7rem;
}

.sea-rewards__hero-points::before {
    content: "";
    display: block;
    width: 3.5rem;
    height: 3.5rem;
    flex: 0 0 3.5rem;
}

@keyframes sea-point-coin-flip {
    0%, 12% {
        transform: rotateY(0deg);
    }
    88%, 100% {
        transform: rotateY(360deg);
    }
}

@keyframes sea-point-coin-touch {
    0% { transform: rotateY(0deg) scale(1); }
    100% { transform: rotateY(360deg) scale(1.08); }
}

@media (prefers-reduced-motion: reduce) {
    .sea-coin__spin,
    .home-product__pts-icon,
    .home-product__pts-icon .sea-treasure-coin,
    .sea-rewards__hero-points::before,
    body.page-product-detail .pdp-points__icon {
        animation: none !important;
    }
}

@media (hover: hover) and (pointer: fine) {
    .site-menu-quick__points:hover .sea-coin__spin,
    .sea-rewards__hero-points:hover::before,
    .home-product:hover .home-product__pts-icon .sea-treasure-coin {
        animation: sea-point-coin-touch 0.7s cubic-bezier(0.22, 1, 0.36, 1) both !important;
    }
}

/* Homepage promotions: one campaign banner plus two quick-offer banners. */
body.page-home .home-ad-zone {
    display: grid;
    gap: 1rem;
}

body.page-home .home-ad-zone__head {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 1rem;
}

body.page-home .home-ad-zone__head > div {
    display: grid;
    gap: .16rem;
}

body.page-home .home-ad-zone__eyebrow {
    color: var(--primary, #0077b6);
    font-size: .78rem;
    font-weight: 900;
}

body.page-home .home-ad-zone__head h2 {
    margin: 0;
    color: var(--foreground, #0f172a);
    font-family: var(--font-heading, Cairo, sans-serif);
    font-size: clamp(1.3rem, 2vw, 1.75rem);
    font-weight: 950;
    line-height: 1.25;
}

body.page-home .home-ad-zone__hint {
    display: inline-flex;
    align-items: center;
    gap: .38rem;
    min-height: 2.25rem;
    padding: .45rem .72rem;
    border-radius: 999px;
    background: rgb(255 183 3 / 13%);
    color: #9a6700;
    font-size: .75rem;
    font-weight: 900;
    white-space: nowrap;
}

body.page-home .home-ad-zone__hint iconify-icon {
    width: 1.15rem;
    height: 1.15rem;
    color: var(--secondary, #ffb703);
}

body.page-home .home-ad-zone__grid {
    display: grid;
    grid-template-columns: minmax(0, 1.75fr) minmax(15rem, .85fr);
    grid-template-rows: repeat(2, minmax(0, 1fr));
    gap: .9rem;
    min-height: clamp(22rem, 30vw, 28rem);
}

body.page-home .home-ad-zone__grid--1 {
    display: block;
    min-height: 0;
}

body.page-home .home-ad-zone__grid--2 {
    grid-template-columns: minmax(0, 1.7fr) minmax(15rem, 1fr);
    grid-template-rows: minmax(0, 1fr);
    min-height: clamp(17rem, 24vw, 22rem);
}

body.page-home .home-ad-zone__slot {
    position: relative;
    min-width: 0;
    min-height: 0;
    overflow: hidden;
    isolation: isolate;
    border-radius: clamp(1.35rem, 2.4vw, 2.25rem);
    background:
        radial-gradient(circle at 18% 0%, rgb(69 205 244 / 30%), transparent 38%),
        linear-gradient(145deg, #063c72, #06295b 52%, #031933);
    box-shadow:
        0 28px 72px rgb(4 48 93 / 18%),
        0 10px 28px rgb(6 86 133 / 12%);
    transform: translateZ(0);
    transition: transform .45s cubic-bezier(.22, 1, .36, 1), box-shadow .45s ease;
}

body.page-home .home-ad-zone__slot--primary {
    grid-row: 1 / -1;
}

body.page-home .home-ad-zone__grid--1 .home-ad-zone__slot {
    aspect-ratio: 3.15 / 1;
}

body.page-home .home-ad-zone__grid--2 .home-ad-zone__slot--primary {
    grid-row: auto;
}

body.page-home .home-ad-zone__slot > a,
body.page-home .home-ad-zone__creative,
body.page-home .home-ad-zone__slot picture {
    display: block;
    width: 100%;
    height: 100%;
}

body.page-home .home-ad-zone__creative {
    position: relative;
    color: #fff;
    text-decoration: none;
}

body.page-home .home-ad-zone__slot::before {
    content: "";
    position: absolute;
    z-index: 2;
    inset: -12%;
    border-radius: inherit;
    background:
        radial-gradient(circle at 10% 78%, transparent 0 .3rem, rgb(175 235 255 / 46%) .34rem .39rem, transparent .44rem),
        radial-gradient(circle at 86% 70%, transparent 0 .2rem, rgb(179 238 255 / 42%) .24rem .29rem, transparent .34rem),
        radial-gradient(circle at 77% 18%, transparent 0 .12rem, rgb(212 246 255 / 42%) .16rem .2rem, transparent .25rem),
        linear-gradient(112deg, transparent 5%, rgb(169 231 255 / 0%) 22%, rgb(169 231 255 / 22%) 36%, transparent 49%),
        linear-gradient(104deg, transparent 31%, rgb(207 245 255 / 15%) 43%, transparent 58%);
    background-size: 15rem 18rem, 18rem 20rem, 12rem 15rem, 145% 145%, 155% 155%;
    background-position: 0 110%, 100% 115%, 78% 10%, 50% 0, 50% 0;
    mix-blend-mode: screen;
    opacity: .62;
    pointer-events: none;
    will-change: transform, background-position, opacity;
    animation: home-ad-ocean-light 10s ease-in-out infinite alternate;
}

body.page-home .home-ad-zone__slot::after {
    content: "";
    position: absolute;
    z-index: 2;
    inset: 0;
    border-radius: inherit;
    box-shadow:
        inset 0 1px 0 rgb(255 255 255 / 58%),
        inset 0 -5rem 8rem rgb(0 25 59 / 12%);
    pointer-events: none;
}

body.page-home .home-ad-zone__media {
    display: block;
    width: 100% !important;
    height: 100% !important;
    max-width: none !important;
    object-fit: cover;
    transition: transform .55s cubic-bezier(.22, 1, .36, 1), filter .55s ease;
}

body.page-home .home-ad-zone__placeholder {
    position: absolute;
    z-index: 3;
    inset: 50% auto auto 50%;
    width: min(88%, 20rem);
    display: grid;
    justify-items: center;
    gap: .3rem;
    padding: 1rem 1.25rem;
    border: 1px dashed rgb(255 255 255 / 48%);
    border-radius: 1rem;
    background: rgb(2 31 67 / 42%);
    color: #fff;
    text-align: center;
    box-shadow: 0 14px 36px rgb(0 17 48 / 18%);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    transform: translate(-50%, -50%);
    pointer-events: none;
}

body.page-home .home-ad-zone__placeholder iconify-icon {
    width: 1.8rem;
    height: 1.8rem;
    color: #9ee9ff;
}

body.page-home .home-ad-zone__placeholder strong {
    font-family: var(--font-heading, Cairo, sans-serif);
    font-size: clamp(1rem, 1.45vw, 1.35rem);
    font-weight: 950;
    line-height: 1.3;
}

body.page-home .home-ad-zone__placeholder small {
    color: rgb(255 255 255 / 76%);
    font-size: .7rem;
    font-weight: 800;
}

body.page-home .home-ad-zone__content {
    position: absolute;
    z-index: 3;
    inset-inline: 0;
    bottom: 0;
    display: grid;
    justify-items: start;
    gap: .32rem;
    padding: clamp(1rem, 2vw, 1.5rem);
    background: linear-gradient(to top, rgb(3 23 44 / 82%), rgb(3 23 44 / 24%) 75%, transparent);
    color: #fff;
    pointer-events: none;
}

body.page-home .home-ad-zone__content span {
    color: rgb(255 255 255 / 78%);
    font-size: .75rem;
    font-weight: 800;
}

body.page-home .home-ad-zone__content h3 {
    margin: 0;
    color: #fff;
    font-family: var(--font-heading, Cairo, sans-serif);
    font-size: clamp(1.05rem, 1.7vw, 1.55rem);
    font-weight: 950;
    line-height: 1.25;
    text-shadow: 0 3px 14px rgb(0 0 0 / 24%);
}

body.page-home .home-ad-zone__content a {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    min-height: 2.5rem;
    margin-top: .22rem;
    padding: .5rem .85rem;
    border-radius: .8rem;
    background: #fff;
    color: var(--primary, #0077b6);
    font-size: .78rem;
    font-weight: 900;
    text-decoration: none;
    box-shadow: 0 8px 20px rgb(0 0 0 / 15%);
    pointer-events: auto;
}

body.page-home .home-ad-zone__content a:focus-visible {
    outline: 3px solid var(--secondary, #ffb703);
    outline-offset: 3px;
}

@media (hover: hover) and (pointer: fine) {
    body.page-home .home-ad-zone__slot:hover {
        transform: translateY(-5px) scale(1.006);
        box-shadow:
            0 36px 84px rgb(4 48 93 / 24%),
            0 14px 34px rgb(6 86 133 / 16%);
    }

    body.page-home .home-ad-zone__slot:hover .home-ad-zone__media {
        transform: scale(1.045);
        filter: saturate(1.08) contrast(1.035);
    }

    body.page-home .home-ad-zone__slot:hover::before {
        opacity: .82;
    }
}

@keyframes home-ad-ocean-light {
    0% {
        transform: translate3d(-1.5%, 2%, 0) scale(1.02);
        background-position: 0 115%, 100% 120%, 78% 12%, 44% 0, 56% 0;
        opacity: .48;
    }
    55% {
        transform: translate3d(1%, -1.5%, 0) scale(1.045);
        background-position: 3% 82%, 96% 88%, 74% 4%, 55% 4%, 45% -3%;
        opacity: .7;
    }
    100% {
        transform: translate3d(-.5%, -3%, 0) scale(1.06);
        background-position: -2% 48%, 103% 54%, 82% -4%, 48% 8%, 54% 4%;
        opacity: .58;
    }
}

@media (prefers-reduced-motion: reduce) {
    body.page-home .home-ad-zone__slot,
    body.page-home .home-ad-zone__slot::before,
    body.page-home .home-ad-zone__media {
        animation: none !important;
        transition: none !important;
    }
}

@media (max-width: 767.98px) {
    body.page-home .home-ad-zone {
        gap: .7rem;
        padding-inline: .75rem !important;
    }

    body.page-home .home-ad-zone__head {
        align-items: center;
    }

    body.page-home .home-ad-zone__eyebrow {
        font-size: .68rem;
    }

    body.page-home .home-ad-zone__head h2 {
        font-size: 1.14rem;
    }

    body.page-home .home-ad-zone__hint {
        min-height: 2rem;
        padding: .35rem .58rem;
        font-size: .65rem;
    }

    body.page-home .home-ad-zone__grid,
    body.page-home .home-ad-zone__grid--1,
    body.page-home .home-ad-zone__grid--2 {
        display: flex;
        gap: .7rem;
        min-height: 0;
        margin-inline: -.75rem;
        padding: .1rem .75rem .65rem;
        overflow-x: auto;
        overflow-y: hidden;
        overscroll-behavior-inline: contain;
        scroll-snap-type: inline mandatory;
        scrollbar-width: none;
    }

    body.page-home .home-ad-zone__grid::-webkit-scrollbar {
        display: none;
    }

    body.page-home .home-ad-zone__slot,
    body.page-home .home-ad-zone__grid--1 .home-ad-zone__slot {
        flex: 0 0 min(84vw, 22rem);
        aspect-ratio: 16 / 9;
        border-radius: 1.15rem;
        scroll-snap-align: start;
    }

    body.page-home .home-ad-zone__grid--1 .home-ad-zone__slot {
        flex-basis: 100%;
        aspect-ratio: 16 / 7.7;
    }

    body.page-home .home-ad-zone__content {
        gap: .2rem;
        padding: .85rem;
    }

    body.page-home .home-ad-zone__content h3 {
        font-size: 1rem;
    }

    body.page-home .home-ad-zone__content a {
        min-height: 2.2rem;
        padding: .4rem .7rem;
        font-size: .7rem;
    }

    body.page-home .home-ad-zone__placeholder {
        width: min(82%, 16rem);
        gap: .2rem;
        padding: .75rem 1rem;
        border-radius: .85rem;
    }

    body.page-home .home-ad-zone__placeholder strong {
        font-size: .9rem;
    }

    body.page-home .home-ad-zone__placeholder small {
        font-size: .62rem;
    }
}

/* Homepage ad banners — one full-width strip per slot (not carousel grid) */
body.page-home .home-ad-banner {
    width: min(100% - (var(--layout-gutter, 1.5rem) * 2), var(--layout-max, 1280px));
    margin-inline: auto;
    box-sizing: border-box;
}

body.page-home .home-ad-banner__creative {
    position: relative;
    display: block;
    width: 100%;
    overflow: hidden;
    isolation: isolate;
    border-radius: clamp(1.15rem, 2vw, 1.75rem);
    aspect-ratio: 3.15 / 1;
    background:
        radial-gradient(circle at 18% 0%, rgb(69 205 244 / 30%), transparent 38%),
        linear-gradient(145deg, #063c72, #06295b 52%, #031933);
    box-shadow:
        0 20px 48px rgb(4 48 93 / 14%),
        0 8px 22px rgb(6 86 133 / 10%);
    transition: transform .35s cubic-bezier(.22, 1, .36, 1), box-shadow .35s ease;
}

body.page-home .home-ad-banner--secondary .home-ad-banner__creative {
    aspect-ratio: 16 / 7;
}

body.page-home .home-ad-banner__creative picture {
    display: block;
    width: 100%;
    height: 100%;
}

body.page-home .home-ad-banner__media {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

body.page-home .home-ad-banner__placeholder {
    position: absolute;
    inset: 0;
    display: grid;
    place-content: center;
    justify-items: center;
    gap: .25rem;
    padding: 1rem 1.25rem;
    text-align: center;
    color: #fff;
    pointer-events: none;
}

body.page-home .home-ad-banner__placeholder iconify-icon {
    width: 1.75rem;
    height: 1.75rem;
    color: rgb(255 255 255 / 88%);
}

body.page-home .home-ad-banner__placeholder strong {
    font-size: clamp(.95rem, 1.6vw, 1.15rem);
    font-weight: 900;
}

body.page-home .home-ad-banner__placeholder small {
    font-size: .72rem;
    color: rgb(255 255 255 / 72%);
}

@media (hover: hover) and (pointer: fine) {
    body.page-home .home-ad-banner__creative:hover {
        transform: translateY(-3px);
        box-shadow:
            0 28px 56px rgb(4 48 93 / 18%),
            0 12px 28px rgb(6 86 133 / 12%);
    }
}

@media (max-width: 767.98px) {
    body.page-home .home-ad-banner__creative,
    body.page-home .home-ad-banner--secondary .home-ad-banner__creative {
        aspect-ratio: 16 / 7;
        border-radius: .85rem;
    }
}

body.page-home .home-ad-stack {
    display: flex;
    flex-direction: column;
    gap: clamp(.65rem, 1.2vw, .9rem);
    width: min(100% - (var(--layout-gutter, 1.5rem) * 2), var(--layout-max, 1280px));
    margin-inline: auto;
    box-sizing: border-box;
}

body.page-home .home-ad-row {
    display: grid;
    align-items: stretch;
    gap: clamp(.55rem, 1vw, .75rem);
    width: 100%;
}

body.page-home .home-ad-row--1-2 {
    grid-template-columns: minmax(0, 1fr) minmax(0, 2fr);
}

body.page-home .home-ad-row--equal {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

body.page-home .home-ad-row--2-1 {
    grid-template-columns: minmax(0, 2fr) minmax(0, 1fr);
}

body.page-home .home-ad-row--thirds {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

body.page-home .home-ad-row .home-ad-banner,
body.page-home .home-ad-stack .home-ad-banner--in-pair {
    width: 100%;
    min-width: 0;
    margin: 0;
    padding: 0;
    display: flex;
}

body.page-home .home-ad-row .home-ad-banner__creative,
body.page-home .home-ad-stack .home-ad-banner--in-pair .home-ad-banner__creative {
    flex: 1 1 auto;
    width: 100%;
    height: 100%;
    min-height: clamp(7.5rem, 10vw, 12.5rem);
    max-height: clamp(7.5rem, 12vw, 12.5rem);
    aspect-ratio: unset;
    border-radius: clamp(.75rem, 1.2vw, 1rem);
    box-shadow: 0 8px 20px rgb(4 48 93 / 12%);
}

body.page-home .home-ad-row--thirds .home-ad-banner__creative {
    min-height: clamp(4rem, 9vw, 5.75rem);
    max-height: clamp(5rem, 10vw, 6.5rem);
}

body.page-home .home-ad-row .home-ad-banner__media {
    object-fit: cover;
    object-position: center;
}

body.page-home .home-ad-banner--primary:not(.home-ad-banner--in-pair) .home-ad-banner__creative {
    width: 100%;
    height: 100%;
    min-height: clamp(7.5rem, 10vw, 12.5rem);
    max-height: clamp(7.5rem, 12vw, 12.5rem);
    aspect-ratio: unset;
    border-radius: clamp(.75rem, 1.2vw, 1rem);
    box-shadow: 0 8px 20px rgb(4 48 93 / 12%);
}

body.page-home .home-main > .site-features,
body.page-home .home-main > .home-section.site-features,
body.page-home .home-main > .home-section--trust,
body.page-home .home-main > .home-section:has(> .home-trust) {
    display: none !important;
}

.sea-coral-background {
    position: fixed !important;
    z-index: 0 !important;
    inset: 0 !important;
    overflow: hidden !important;
    pointer-events: none !important;
}

/* Shell used to paint an opaque page fill over the fixed reefs. Keep the
   color on body and let the shell stay clear so the corners can show. */
body.sea-body > .sea-shell,
body.sea-app .sea-shell,
body.sea-app.page-home .sea-shell {
    background: transparent !important;
}

.sea-coral-background__reef,
img.sea-coral-background__reef {
    position: absolute !important;
    bottom: -1.25rem !important;
    width: min(26rem, 34vw) !important;
    max-width: min(26rem, 34vw) !important;
    height: auto !important;
    max-height: min(26rem, 34vw) !important;
    aspect-ratio: 1 !important;
    object-fit: contain !important;
    object-position: bottom left !important;
    pointer-events: none !important;
    opacity: .42 !important;
    filter: saturate(1.05) contrast(1.02);
    -webkit-mask-image: linear-gradient(to top, #000 62%, rgba(0, 0, 0, .88) 82%, transparent 100%);
    mask-image: linear-gradient(to top, #000 62%, rgba(0, 0, 0, .88) 82%, transparent 100%);
}

.sea-coral-background__reef--left {
    left: clamp(-4.5rem, -2.5vw, -1.25rem) !important;
    right: auto !important;
    object-position: bottom left !important;
}

.sea-coral-background__reef--right {
    right: clamp(-4.5rem, -2.5vw, -1.25rem) !important;
    left: auto !important;
    transform: scaleX(-1);
    object-position: bottom right !important;
}

body.page-account .sea-coral-background,
body.customer-page .sea-coral-background,
body.page-login .sea-coral-background,
body.page-register .sea-coral-background,
body.page-order-success .sea-coral-background,
body.page-checkout .sea-coral-background,
body.page-account .sea-depth-overlay,
body.customer-page .sea-depth-overlay,
body.page-order-success .sea-depth-overlay,
body.page-checkout .sea-depth-overlay {
    display: none !important;
}

body.sea-body > .sea-shell,
body.sea-body > .sea-guest-banner {
    position: relative;
    z-index: 1;
}

/* Floating bubbles only. The original theme controls the body background. */

.sea-depth-overlay {
    position: fixed;
    z-index: 40;
    inset: 0;
    overflow: hidden;
    pointer-events: none;
    contain: layout paint style;
    visibility: visible !important;
    opacity: 1 !important;
}

/* Sticky site header: desktop scrolls the document, mobile scrolls .sea-shell. */
body.sea-body .sea-header {
    position: sticky !important;
    top: 0 !important;
    z-index: 10 !important;
}

@media (min-width: 768px) {
    html,
    body.sea-body {
        overflow-x: clip !important;
        overflow-y: visible !important;
    }
}

.sea-depth-overlay__bubble {
    --bubble-size: 26px;
    --bubble-x: 0px;
    position: absolute;
    z-index: 1;
    bottom: -10vh;
    left: 4%;
    display: block;
    width: var(--bubble-size);
    aspect-ratio: 1;
    visibility: visible !important;
    border: 2px solid rgb(0 132 190 / 72%);
    border-radius: 50%;
    background:
        radial-gradient(circle at 29% 24%, rgb(255 255 255 / 96%) 0 8%, transparent 12%),
        radial-gradient(circle at 66% 72%, rgb(32 174 219 / 34%), transparent 66%);
    box-shadow:
        inset -3px -4px 7px rgb(13 135 187 / 24%),
        inset 3px 3px 5px rgb(255 255 255 / 82%),
        0 5px 14px rgb(11 128 177 / 16%);
    opacity: 0;
    transform: translate3d(0, 0, 0);
    animation: sea-bubble-float 17s linear infinite;
    animation-play-state: running !important;
    will-change: transform, opacity;
}

.sea-depth-overlay__bubble:nth-child(1) { --bubble-size: 24px; --bubble-x: 24px; left: 2.5%; animation-delay: -2s; animation-duration: 15s; }
.sea-depth-overlay__bubble:nth-child(2) { --bubble-size: 39px; --bubble-x: -18px; left: 8%; animation-delay: -11s; animation-duration: 20s; }
.sea-depth-overlay__bubble:nth-child(3) { --bubble-size: 20px; --bubble-x: 31px; left: 17%; animation-delay: -7s; animation-duration: 17s; }
.sea-depth-overlay__bubble:nth-child(4) { --bubble-size: 32px; --bubble-x: -26px; left: 82%; animation-delay: -14s; animation-duration: 21s; }
.sea-depth-overlay__bubble:nth-child(5) { --bubble-size: 48px; --bubble-x: 17px; left: 90%; animation-delay: -5s; animation-duration: 23s; }
.sea-depth-overlay__bubble:nth-child(6) { --bubble-size: 22px; --bubble-x: -21px; left: 96%; animation-delay: -9s; animation-duration: 16s; }

@keyframes sea-bubble-float {
    0% { transform: translate3d(0, 6vh, 0) scale(.72); opacity: 0; }
    7% { opacity: .9; }
    52% { transform: translate3d(var(--bubble-x), -54vh, 0) scale(1); opacity: .8; }
    88% { opacity: .66; }
    100% { transform: translate3d(calc(0px - var(--bubble-x)), -116vh, 0) scale(1.12); opacity: 0; }
}

body:has(.modal.show, .sea-minicart.is-open, .cartmini__area.opened) .sea-depth-overlay {
    opacity: .18 !important;
}

body.page-checkout .sea-depth-overlay,
body.page-cart .sea-depth-overlay,
body.page-order-success .sea-depth-overlay {
    display: none;
}

@media (max-width: 767.98px) {
    .sea-coral-background__reef,
    img.sea-coral-background__reef {
        bottom: -0.65rem !important;
        width: 13.5rem !important;
        max-width: 13.5rem !important;
        max-height: 13.5rem !important;
        opacity: .34 !important;
    }

    .sea-coral-background__reef--left {
        left: -2.1rem !important;
    }

    .sea-coral-background__reef--right {
        right: -2.1rem !important;
    }

    body.sea-body .sea-header {
        top: 0 !important;
        flex: 0 0 auto;
    }

    body.sea-body .sea-shell {
        scroll-padding-top: calc(6.5rem + env(safe-area-inset-top, 0px));
    }

    .sea-depth-overlay__bubble:nth-child(n + 4) {
        display: none;
    }

    .sea-depth-overlay__bubble:nth-child(1) { left: 4%; }
    .sea-depth-overlay__bubble:nth-child(2) { left: 84%; }
    .sea-depth-overlay__bubble:nth-child(3) { left: 94%; }
}

@media (prefers-reduced-motion: reduce) {
    .sea-depth-overlay__bubble {
        display: none !important;
        animation: none !important;
        will-change: auto;
    }

    .sea-points-chip__icon,
    .home-product__pts-icon,
    body.page-product-detail .pdp-points__icon,
    .sea-rewards__hero-points::before {
        animation: none !important;
        transform: none !important;
    }
}

@media (forced-colors: active) {
    .sea-coral-background,
    .sea-depth-overlay {
        display: none;
    }
}

/* Flash sale: compact ocean promotion with a readable horizontal timer. */
body.page-home section.sea-flash-sale {
    position: relative;
    isolation: isolate;
    width: min(100% - (var(--layout-gutter, 1.5rem) * 2), var(--layout-max, 1280px));
    margin-inline: auto !important;
    padding: clamp(1rem, 2vw, 1.5rem) !important;
    overflow: hidden;
    border: 0 !important;
    border-radius: clamp(1.35rem, 2.2vw, 2rem);
    background:
        linear-gradient(110deg, rgb(2 62 138 / 96%), rgb(0 119 182 / 92%) 52%, rgb(0 180 216 / 82%)),
        var(--sea-flash-image, none) center / cover no-repeat !important;
    box-shadow: 0 22px 55px rgb(2 62 138 / 18%);
}

body.page-home section.sea-flash-sale::before {
    content: "";
    position: absolute;
    z-index: -1;
    inset: 0;
    pointer-events: none;
    background:
        radial-gradient(circle at 12% 12%, rgb(255 255 255 / 20%) 0 0.2rem, transparent 0.25rem),
        radial-gradient(circle at 18% 68%, rgb(255 255 255 / 13%) 0 0.3rem, transparent 0.35rem),
        radial-gradient(circle at 84% 24%, rgb(255 183 3 / 18%), transparent 24%);
}

body.page-home .sea-flash-sale__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.25rem;
    margin-bottom: 1.25rem;
    color: #fff;
}

body.page-home .sea-flash-sale__intro {
    display: flex;
    align-items: center;
    gap: 0.85rem;
    min-width: 0;
    flex: 1 1 auto;
}

body.page-home .sea-flash-sale__whale {
    display: block !important;
    flex: 0 0 5.75rem !important;
    width: 5.75rem !important;
    height: 5.75rem !important;
    max-width: 5.75rem !important;
    max-height: 5.75rem !important;
    min-width: 5.75rem !important;
    object-fit: contain !important;
    pointer-events: none;
    user-select: none;
    filter: drop-shadow(0 10px 18px rgb(2 32 80 / 32%));
}

body.page-home .sea-flash-sale__heading {
    min-width: 0;
}

body.page-home .sea-flash-sale__eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    margin-bottom: 0.25rem;
    color: #ffe08a;
    font-size: 0.76rem;
    font-weight: 900;
}

body.page-home .sea-flash-sale__eyebrow iconify-icon {
    font-size: 1.1rem;
}

body.page-home .sea-flash-sale__heading h2 {
    margin: 0;
    color: #fff;
    font-family: var(--font-heading, Cairo, sans-serif);
    font-size: clamp(1.45rem, 2.5vw, 2.2rem);
    font-weight: 950;
    line-height: 1.25;
}

body.page-home .sea-flash-sale__heading p {
    margin: 0.3rem 0 0;
    color: rgb(255 255 255 / 78%);
    font-size: 0.84rem;
    font-weight: 700;
}

body.page-home .sea-flash-sale__actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.65rem;
    flex-shrink: 0;
}

body.page-home .sea-flash-sale__nav {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
}

body.page-home .sea-flash-sale__nav-btn {
    width: 2.55rem;
    height: 2.55rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 0;
    border-radius: 999px;
    background: rgb(255 255 255 / 14%);
    color: #fff;
    cursor: pointer;
    backdrop-filter: blur(6px);
    transition: background 0.15s ease, border-color 0.15s ease, transform 0.15s ease;
}

body.page-home .sea-flash-sale__nav-btn:hover {
    background: rgb(255 255 255 / 24%);
    border-color: rgb(255 255 255 / 45%);
}

body.page-home .sea-flash-sale__nav-btn:disabled {
    opacity: 0.4;
    cursor: default;
    transform: none;
}

body.page-home .sea-flash-sale__timer {
    display: flex;
    align-items: center;
    gap: 0.65rem;
    padding: 0.55rem 0.75rem;
    border: 0;
    border-radius: 1rem;
    background: rgb(0 20 54 / 30%);
    backdrop-filter: blur(10px);
}

body.page-home .sea-flash-sale__timer-label {
    color: rgb(255 255 255 / 76%);
    font-size: 0.7rem;
    font-weight: 800;
    white-space: nowrap;
}

body.page-home .sea-flash-sale__timer .tp-product-countdown,
body.page-home .sea-flash-sale__timer ul {
    margin: 0 !important;
    padding: 0 !important;
}

body.page-home .sea-flash-sale__timer ul {
    display: flex !important;
    align-items: center;
    gap: 0.38rem;
    list-style: none !important;
}

body.page-home .sea-flash-sale__timer li {
    min-width: 3.15rem;
    display: grid !important;
    place-items: center;
    gap: 0.05rem;
    margin: 0 !important;
    padding: 0.35rem 0.45rem !important;
    border-radius: 0.72rem;
    background: #fff;
    color: #0f2747;
    font-size: 0 !important;
    line-height: 1 !important;
}

body.page-home .sea-flash-sale__timer li span {
    margin: 0 !important;
    color: var(--primary, #0077b6) !important;
    font-size: 1rem !important;
    font-weight: 950 !important;
    line-height: 1 !important;
}

body.page-home .sea-flash-sale__timer li small {
    color: #64748b;
    font-size: 0.58rem;
    font-weight: 850;
    line-height: 1.2;
}

body.page-home .sea-flash-sale__link {
    min-height: 3rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.4rem;
    padding: 0.65rem 1rem;
    border-radius: 0.9rem;
    background: linear-gradient(135deg, #ffd166, #ffb703);
    color: #10233e;
    font-size: 0.82rem;
    font-weight: 950;
    text-decoration: none;
    white-space: nowrap;
    box-shadow: 0 10px 22px rgb(255 183 3 / 24%);
}

body.page-home .sea-flash-sale__link:hover {
    color: #10233e;
    transform: translateY(-1px);
}

body.page-home section.sea-flash-sale .sea-flash-sale__swiper {
    position: relative;
    z-index: 1;
    overflow: hidden;
    width: 100%;
    margin: 0;
    padding: 0.1rem 0.1rem 0.25rem;
}

body.page-home section.sea-flash-sale .sea-flash-sale__swiper .swiper-wrapper {
    align-items: stretch;
}

body.page-home section.sea-flash-sale .sea-flash-sale__slide {
    height: auto;
    box-sizing: border-box;
}

body.page-home section.sea-flash-sale .sea-flash-sale__product {
    display: flex !important;
    flex-direction: column;
    width: 100% !important;
    min-width: 0;
    height: 100%;
    margin: 0 !important;
    border: 0 !important;
    background: #fff;
    box-shadow: 0 14px 30px rgb(0 23 59 / 18%);
}

body.page-home .sea-flash-sale__product .home-product__countdown {
    display: grid;
    gap: 0.42rem;
    margin: 0.55rem 0.75rem 0;
    padding: 0.55rem;
    border-radius: 0.85rem;
    background: linear-gradient(135deg, #fff8e1, #fffdf7);
    box-shadow: inset 0 0 0 1px rgb(255 183 3 / 25%);
}

body.page-home .sea-flash-sale__product .home-product__countdown-title {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.3rem;
    color: #9a6700;
    font-size: 0.67rem;
    font-weight: 900;
    line-height: 1.2;
}

body.page-home .sea-flash-sale__product .home-product__countdown-title iconify-icon {
    color: #f59e0b;
    font-size: 0.9rem;
}

body.page-home .sea-flash-sale__product .home-product__countdown .tp-product-countdown,
body.page-home .sea-flash-sale__product .home-product__countdown ul {
    width: 100%;
    margin: 0 !important;
    padding: 0 !important;
}

body.page-home .sea-flash-sale__product .home-product__countdown ul {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.3rem;
    list-style: none !important;
}

body.page-home .sea-flash-sale__product .home-product__countdown li {
    display: grid !important;
    place-items: center;
    gap: 0.08rem;
    min-width: 0;
    margin: 0 !important;
    padding: 0.3rem 0.15rem !important;
    border-radius: 0.55rem;
    background: #fff;
    box-shadow: 0 3px 9px rgb(15 23 42 / 6%);
    font-size: 0 !important;
}

body.page-home .sea-flash-sale__product .home-product__countdown li span {
    margin: 0 !important;
    color: #0b75ad !important;
    font-size: 0.78rem !important;
    font-weight: 950 !important;
    line-height: 1 !important;
}

body.page-home .sea-flash-sale__product .home-product__countdown li small {
    color: #7c8798;
    font-size: 0.5rem;
    font-weight: 800;
    line-height: 1.1;
}

body.page-home .sea-flash-sale__product .home-product__price .new-price,
body.page-home .sea-flash-sale__product .home-product__price [data-bb-value="product-price"] {
    color: #e11d48 !important;
    font-size: 1.08rem !important;
}

body.page-home .sea-flash-sale__product .home-product__price .old-price,
body.page-home .sea-flash-sale__product .home-product__price del,
body.page-home .sea-flash-sale__product .home-product__price s {
    color: #8793a4 !important;
    font-size: 0.72rem !important;
}

body.page-home .sea-flash-sale__dots {
    position: relative;
    z-index: 1;
    display: flex;
    justify-content: center;
    gap: 0.35rem;
    margin-top: 0.85rem;
    width: 100% !important;
}

body.page-home .sea-flash-sale__dots .swiper-pagination-bullet {
    width: 0.48rem;
    height: 0.48rem;
    margin: 0 !important;
    opacity: 1;
    background: rgb(255 255 255 / 42%);
    transition: width 0.2s ease, background-color 0.2s ease;
}

body.page-home .sea-flash-sale__dots .swiper-pagination-bullet-active {
    width: 1.35rem;
    border-radius: 999px;
    background: #ffd05a;
}

@media (max-width: 991.98px) {
    body.page-home .sea-flash-sale__head {
        align-items: flex-start;
        flex-direction: column;
    }

    body.page-home .sea-flash-sale__intro {
        width: 100%;
    }

    body.page-home .sea-flash-sale__whale {
        height: 5.15rem !important;
        width: 5.15rem !important;
        max-width: 5.15rem !important;
        max-height: 5.15rem !important;
        min-width: 5.15rem !important;
        flex-basis: 5.15rem !important;
    }

    body.page-home .sea-flash-sale__actions {
        width: 100%;
        justify-content: space-between;
    }
}

@media (max-width: 767.98px) {
    body.page-home section.sea-flash-sale {
        width: min(100% - 2rem, var(--layout-max, 1280px));
        padding: 1rem !important;
        border-radius: 1.35rem;
    }

    body.page-home .sea-flash-sale__head {
        gap: 0.85rem;
        margin-bottom: 1rem;
    }

    body.page-home .sea-flash-sale__whale {
        height: 4.75rem !important;
        width: 4.75rem !important;
        max-width: 4.75rem !important;
        max-height: 4.75rem !important;
        min-width: 4.75rem !important;
        flex-basis: 4.75rem !important;
    }

    body.page-home .sea-flash-sale__heading p {
        font-size: 0.75rem;
    }

    body.page-home .sea-flash-sale__actions {
        display: flex;
        flex-wrap: wrap;
        width: 100%;
        justify-content: space-between;
        gap: 0.65rem;
    }

    body.page-home .sea-flash-sale__nav {
        order: 2;
    }

    body.page-home .sea-flash-sale__link {
        order: 1;
        flex: 1 1 auto;
        min-height: 2.75rem;
    }

    body.page-home .sea-flash-sale__timer {
        width: 100%;
        justify-content: space-between;
        gap: 0.4rem;
        padding: 0.5rem;
    }

    body.page-home .sea-flash-sale__timer-label {
        display: none;
    }

    body.page-home .sea-flash-sale__timer ul {
        width: 100%;
        justify-content: space-between;
    }

    body.page-home .sea-flash-sale__timer li {
        min-width: 0;
        flex: 1;
    }

    body.page-home section.sea-flash-sale .sea-flash-sale__swiper {
        margin-inline: -0.15rem;
        padding-inline: 0.15rem;
    }

    body.page-home .sea-flash-sale__dots {
        margin-top: 0.7rem;
    }
}

/* Homepage featured products — Swiper carousel (desktop + mobile) */
body.page-home .home-featured-products,
body.page-home .home-featured-products--carousel,
body.page-home .home-featured-products--spotlight {
    --sea-feat-ink: #0b2a44;
    --sea-feat-muted: #5b738a;
    --sea-feat-line: rgb(14 116 144 / 14%);
    --sea-feat-accent: #0ea5e9;
    --sea-feat-gold: #e8a317;
    position: relative;
    width: min(100% - (var(--layout-gutter, 1.5rem) * 2), var(--layout-max, 1280px));
    margin-inline: auto;
    margin-block: 0.35rem 0.75rem;
    padding: clamp(1.15rem, 2.4vw, 1.85rem);
    overflow: hidden;
    isolation: isolate;
    border-radius: clamp(1.35rem, 2.4vw, 1.85rem);
    background:
        radial-gradient(ellipse 70% 55% at 100% 0%, rgb(14 165 233 / 14%), transparent 55%),
        radial-gradient(ellipse 55% 45% at 0% 100%, rgb(232 163 23 / 10%), transparent 50%),
        linear-gradient(165deg, #f7fbfe 0%, #eef6fb 48%, #f8fcff 100%);
    border: 0;
    box-shadow: 0 22px 48px rgb(2 62 138 / 8%);
}

body.page-home .home-featured-products--carousel::before,
body.page-home .home-featured-products--spotlight::before {
    content: "";
    position: absolute;
    inset: auto -8% -28% auto;
    width: min(28rem, 55%);
    height: min(18rem, 55%);
    border-radius: 50%;
    background: radial-gradient(circle, rgb(14 165 233 / 12%), transparent 68%);
    pointer-events: none;
    z-index: 0;
}

body.page-home .home-featured-products__head {
    position: relative;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem 1.5rem;
    margin-bottom: clamp(1rem, 2vw, 1.35rem);
    padding: 0;
    border-radius: 0;
    background: none;
    box-shadow: none;
}

body.page-home .home-featured-products__intro-row {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    min-width: 0;
    flex: 1 1 auto;
}

body.page-home .home-featured-products__intro-row .sea-section-whale {
    width: 4.75rem !important;
    height: 4.75rem !important;
    max-width: 4.75rem !important;
    max-height: 4.75rem !important;
    min-width: 4.75rem !important;
}

body.page-home .home-featured-products__intro {
    min-width: 0;
}

body.page-home .home-featured-products__eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    margin-bottom: 0.35rem;
    color: #0b6e99;
    font-size: 0.72rem;
    font-weight: 900;
    letter-spacing: 0.02em;
}

body.page-home .home-featured-products__eyebrow iconify-icon {
    color: var(--sea-feat-gold);
    font-size: 1.05rem;
}

body.page-home .home-featured-products__title-row {
    display: flex;
    align-items: baseline;
    gap: 0.55rem;
    flex-wrap: wrap;
}

body.page-home .home-featured-products__head h2,
body.page-home .home-featured-products__title-row h2 {
    margin: 0;
    font-family: var(--font-heading, Cairo, sans-serif);
    font-size: clamp(1.45rem, 2.6vw, 2.05rem);
    font-weight: 950;
    color: var(--sea-feat-ink);
    line-height: 1.2;
}

body.page-home .home-featured-products__count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 1.75rem;
    height: 1.55rem;
    padding: 0 0.45rem;
    border-radius: 999px;
    background: color-mix(in srgb, var(--sea-feat-accent) 14%, #fff);
    color: #0369a1;
    font-size: 0.72rem;
    font-weight: 900;
    font-variant-numeric: tabular-nums;
}

body.page-home .home-featured-products__sub,
body.page-home .home-featured-products__head .home-section-sub {
    margin: 0.4rem 0 0;
    max-width: 36ch;
    color: var(--sea-feat-muted);
    font-size: 0.88rem;
    font-weight: 700;
    line-height: 1.55;
}

body.page-home .home-featured-products__tools {
    display: flex;
    align-items: center;
    gap: 0.55rem;
    flex-shrink: 0;
}

body.page-home .home-featured-products__nav {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
}

body.page-home .home-featured-products__nav-btn {
    width: 2.55rem;
    height: 2.55rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 0;
    border-radius: 999px;
    background: #fff;
    color: var(--sea-feat-ink);
    cursor: pointer;
    box-shadow: 0 6px 16px rgb(15 23 42 / 6%);
    transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease, transform 0.15s ease;
}

body.page-home .home-featured-products__nav-btn:hover {
    background: #e8f6fc;
    border-color: color-mix(in srgb, var(--sea-feat-accent) 35%, transparent);
    color: #0369a1;
}

body.page-home .home-featured-products__nav-btn:disabled {
    opacity: 0.4;
    cursor: default;
    transform: none;
}

body.page-home .home-featured-products__cta,
body.page-home .home-featured-products__link {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    flex-shrink: 0;
    min-height: 2.65rem;
    padding: 0.55rem 1.1rem;
    border-radius: 999px;
    text-decoration: none;
    font-size: 0.84rem;
    font-weight: 900;
    color: #0b2a44;
    background: linear-gradient(135deg, #ffd56a, #f5b301);
    box-shadow: 0 10px 24px rgb(245 179 1 / 28%);
    transition: transform 0.18s ease, box-shadow 0.18s ease;
}

body.page-home .home-featured-products__cta:hover,
body.page-home .home-featured-products__link:hover {
    transform: translateY(-1px);
    box-shadow: 0 14px 28px rgb(245 179 1 / 34%);
    color: #0b2a44;
}

body.page-home .home-featured-products__actions,
body.page-home .home-featured-products__note {
    display: none;
}

body.page-home .home-featured-products__swiper {
    position: relative;
    z-index: 1;
    overflow: hidden;
    margin: 0;
    padding: 0.15rem 0.15rem 0.35rem;
}

body.page-home .home-featured-products__swiper .swiper-wrapper {
    align-items: stretch;
}

body.page-home .home-featured-products__slide {
    height: auto;
    box-sizing: border-box;
}

body.page-home .home-featured-products__product {
    display: flex !important;
    flex-direction: column;
    height: 100%;
    min-width: 0;
    margin: 0 !important;
    border: 0 !important;
    border-radius: 1.15rem !important;
    background: #fff !important;
    box-shadow: 0 10px 28px rgb(15 23 42 / 6%) !important;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

body.page-home .home-featured-products__product:hover {
    transform: translateY(-3px);
    box-shadow: 0 16px 36px rgb(2 132 199 / 12%) !important;
}

body.page-home .home-featured-products__product .home-product__media {
    aspect-ratio: 1;
    border-radius: 0.95rem;
    overflow: hidden;
    background: #f1f7fb;
}

body.page-home .home-product__badge.is-featured {
    display: inline-flex;
    align-items: center;
    gap: 0.28rem;
    background: linear-gradient(135deg, #ffb703, #f59e0b);
    color: #10233e;
    box-shadow: 0 7px 16px rgb(255 183 3 / 28%);
}

body.page-home .home-product__badge.is-featured iconify-icon {
    font-size: 0.85rem;
}

body.page-home .home-featured-products__dots {
    position: relative;
    z-index: 2;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 0.35rem;
    margin-top: 0.95rem;
    min-height: 0.75rem;
}

body.page-home .home-featured-products__dots .swiper-pagination-bullet {
    width: 0.4rem;
    height: 0.4rem;
    margin: 0 !important;
    opacity: 1;
    background: rgb(15 23 42 / 18%);
    border-radius: 999px;
    transition: width 0.2s ease, background 0.2s ease;
}

body.page-home .home-featured-products__dots .swiper-pagination-bullet-active {
    width: 1.05rem;
    background: #0284c7;
}

@media (max-width: 767.98px) {
    body.page-home .home-featured-products,
    body.page-home .home-featured-products--carousel,
    body.page-home .home-featured-products--spotlight {
        width: 100%;
        max-width: none;
        margin-inline: 0;
        padding: 1rem 0 1.15rem;
        border-radius: 0;
        border-inline: 0;
        box-shadow: none;
        background:
            radial-gradient(ellipse 90% 60% at 100% 0%, rgb(14 165 233 / 12%), transparent 55%),
            linear-gradient(180deg, #f4f9fd 0%, #eef5fa 100%);
    }

    body.page-home .home-featured-products__head {
        align-items: center;
        margin-bottom: 0.85rem;
        padding-inline: 1rem;
    }

    body.page-home .home-featured-products__intro-row .sea-section-whale {
        width: 4.15rem !important;
        height: 4.15rem !important;
        max-width: 4.15rem !important;
        max-height: 4.15rem !important;
        min-width: 4.15rem !important;
    }

    body.page-home .home-featured-products__sub,
    body.page-home .home-featured-products__head .home-section-sub {
        display: none;
    }

    body.page-home .home-featured-products__head h2,
    body.page-home .home-featured-products__title-row h2 {
        font-size: 1.25rem;
    }

    body.page-home .home-featured-products__nav {
        display: none;
    }

    body.page-home .home-featured-products__cta,
    body.page-home .home-featured-products__link {
        min-height: 2.35rem;
        padding: 0.4rem 0.85rem;
        font-size: 0.76rem;
        box-shadow: 0 6px 16px rgb(245 179 1 / 22%);
    }

    body.page-home .home-featured-products__swiper {
        padding: 0.1rem 0 0.25rem;
        overflow: visible;
    }

    body.page-home .home-featured-products__swiper .swiper-wrapper {
        padding-inline: 1rem;
    }

    body.page-home .home-featured-products__dots {
        margin-top: 0.75rem;
        padding-inline: 1rem;
    }
}

@media (prefers-reduced-motion: reduce) {
    body.page-home .home-featured-products__product,
    body.page-home .home-featured-products__cta {
        transition: none;
    }

    body.page-home .home-featured-products__product:hover,
    body.page-home .home-featured-products__cta:hover {
        transform: none;
    }
}

/* Product detail: scheduled Price sale countdown. */
body.page-product-detail #main-product-countdown,
body.page-product-detail #variation-countdown-container {
    width: 100%;
    margin-block: 0.75rem 1rem;
}

body.page-product-detail #main-product-countdown:empty,
body.page-product-detail #variation-countdown-container:empty,
body.page-product-detail #main-product-countdown[hidden],
body.page-product-detail #variation-countdown-container[hidden],
body.page-product-detail #main-product-countdown:not(:has(.bb-product-sale-countdown-modern, .bb-product-sale-upcoming-modern)),
body.page-product-detail #variation-countdown-container:not(:has(.bb-product-sale-countdown-modern, .bb-product-sale-upcoming-modern)) {
    display: none !important;
    margin: 0 !important;
    height: 0 !important;
    overflow: hidden !important;
    padding: 0 !important;
}

body.page-product-detail .bb-product-sale-countdown-modern {
    position: relative;
    isolation: isolate;
    display: grid !important;
    grid-template-columns: minmax(10.5rem, auto) minmax(17rem, 1fr);
    align-items: center;
    gap: 0.7rem 1rem;
    width: 100%;
    margin: 0 !important;
    padding: 0.8rem 0.9rem !important;
    overflow: hidden;
    border: 0 !important;
    border-radius: 1rem !important;
    background:
        radial-gradient(circle at 8% 0%, rgb(255 255 255 / 82%), transparent 34%),
        linear-gradient(135deg, #fff7df 0%, #fffdf7 58%, #eefaff 125%) !important;
    box-shadow: 0 12px 28px rgb(122 77 0 / 9%), inset 0 0 0 1px rgb(245 158 11 / 22%) !important;
}

body.page-product-detail .bb-product-sale-countdown-modern::before {
    content: "⏱  ينتهي سعر العرض خلال";
    display: flex;
    align-items: center;
    min-height: 2.8rem;
    padding-inline: 0.6rem;
    color: #8a5700;
    font-family: var(--font-heading, Cairo, sans-serif);
    font-size: 0.76rem;
    font-weight: 950;
    line-height: 1.35;
    white-space: nowrap;
}

body.page-product-detail .bb-product-sale-countdown-modern .countdown-boxes {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.45rem;
    width: 100%;
}

body.page-product-detail .bb-product-sale-countdown-modern .countdown-box {
    display: grid !important;
    place-items: center;
    gap: 0.1rem;
    min-width: 0;
    min-height: 3.25rem;
    padding: 0.42rem 0.25rem !important;
    border: 0 !important;
    border-radius: 0.72rem !important;
    background: rgb(255 255 255 / 92%) !important;
    box-shadow: 0 5px 15px rgb(15 23 42 / 7%), inset 0 0 0 1px rgb(245 158 11 / 15%) !important;
}

body.page-product-detail .bb-product-sale-countdown-modern .countdown-number {
    color: #0b78b5 !important;
    font-family: var(--font-heading, Cairo, sans-serif);
    font-size: 1.05rem !important;
    font-weight: 950 !important;
    line-height: 1 !important;
    letter-spacing: 0 !important;
}

body.page-product-detail .bb-product-sale-countdown-modern .countdown-label {
    color: #7b8798 !important;
    font-size: 0.58rem !important;
    font-weight: 850 !important;
    line-height: 1.2 !important;
    text-transform: none !important;
}

body.page-product-detail .bb-product-sale-countdown-modern .countdown-progress-wrapper {
    grid-column: 1 / -1;
    width: 100%;
    margin: 0.05rem 0 0 !important;
}

body.page-product-detail .bb-product-sale-countdown-modern .countdown-progress-bar {
    width: 100%;
    height: 0.35rem;
    overflow: hidden;
    border-radius: 999px;
    background: rgb(148 163 184 / 18%) !important;
}

body.page-product-detail .bb-product-sale-countdown-modern .countdown-progress-fill {
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, #ffb703, #fb7185) !important;
}

body.page-product-detail .bb-product-sale-countdown-modern .countdown-sold-status {
    grid-column: 1 / -1;
    margin: 0 !important;
    color: #64748b !important;
    font-size: 0.65rem !important;
    font-weight: 800 !important;
    text-align: end;
}

body.page-product-detail .bb-product-sale-upcoming-modern {
    margin: 0 !important;
    padding: 0.75rem 0.9rem !important;
    border: 0 !important;
    border-radius: 1rem !important;
    background: linear-gradient(135deg, #eefaff, #f8fdff) !important;
    box-shadow: inset 0 0 0 1px rgb(14 165 233 / 18%), 0 10px 25px rgb(2 132 199 / 7%) !important;
}

body.page-product-detail .bb-product-sale-upcoming-modern .sale-countdown-simple {
    display: flex !important;
    align-items: center;
    gap: 0.7rem;
}

body.page-product-detail .bb-product-sale-upcoming-modern .countdown-label-simple {
    color: #475569 !important;
    font-size: 0.72rem !important;
    font-weight: 850 !important;
}

body.page-product-detail .bb-product-sale-upcoming-modern .countdown-time-simple {
    color: #087fb8 !important;
    font-family: var(--font-heading, Cairo, sans-serif);
    font-size: 1rem !important;
    font-weight: 950 !important;
}

@media (max-width: 767.98px) {
    body.page-product-detail #main-product-countdown,
    body.page-product-detail #variation-countdown-container {
        margin-block: 0.6rem 0.8rem;
    }

    body.page-product-detail .bb-product-sale-countdown-modern {
        grid-template-columns: 1fr;
        gap: 0.5rem;
        padding: 0.68rem !important;
        border-radius: 0.9rem !important;
    }

    body.page-product-detail .bb-product-sale-countdown-modern::before {
        min-height: auto;
        justify-content: center;
        padding: 0;
        font-size: 0.69rem;
    }

    body.page-product-detail .bb-product-sale-countdown-modern .countdown-boxes {
        gap: 0.32rem;
    }

    body.page-product-detail .bb-product-sale-countdown-modern .countdown-box {
        min-height: 2.9rem;
        padding: 0.35rem 0.12rem !important;
        border-radius: 0.62rem !important;
    }

    body.page-product-detail .bb-product-sale-countdown-modern .countdown-number {
        font-size: 0.92rem !important;
    }

    body.page-product-detail .bb-product-sale-countdown-modern .countdown-label {
        font-size: 0.5rem !important;
    }
}

/* Lock section whales to header-icon size (beats Bootstrap img { max-width:100%; height:auto }). */
img.sea-section-whale,
.home-section-head__intro > .sea-section-whale,
.home-featured-products__intro-row > .sea-section-whale {
    display: block !important;
    flex: 0 0 4.75rem !important;
    width: 4.75rem !important;
    height: 4.75rem !important;
    max-width: 4.75rem !important;
    max-height: 4.75rem !important;
    min-width: 4.75rem !important;
    object-fit: contain !important;
    object-position: center bottom !important;
}

@media (max-width: 767.98px) {
    img.sea-section-whale,
    .home-section-head__intro > .sea-section-whale,
    .home-featured-products__intro-row > .sea-section-whale {
        flex-basis: 4.15rem !important;
        width: 4.15rem !important;
        height: 4.15rem !important;
        max-width: 4.15rem !important;
        max-height: 4.15rem !important;
        min-width: 4.15rem !important;
    }
}