/* ==========================================================
   BRAVA HOME — PREMIUM CORPORATE
   Shared homepage sections
========================================================== */

.home-hero {
    position: relative;
    overflow: hidden;
    min-height: clamp(650px, 78vh, 860px);
    display: flex;
    align-items: center;
    background:
        radial-gradient(circle at 80% 20%, color-mix(in srgb, var(--brava-primary) 9%, transparent), transparent 34%),
        linear-gradient(135deg, var(--brava-background) 0%, var(--brava-background) 48%, color-mix(in srgb, var(--brava-primary) 6%, var(--brava-background)) 100%);
    isolation: isolate;
}

.home-hero::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -2;
    opacity: .45;
    background-image:
        linear-gradient(rgba(128, 128, 128, .05) 1px, transparent 1px),
        linear-gradient(90deg, rgba(128, 128, 128, .05) 1px, transparent 1px);
    background-size: 54px 54px;
    mask-image: linear-gradient(to bottom, transparent, #000 25%, #000);
}

.home-hero__ambient {
    position: absolute;
    width: 650px;
    height: 650px;
    inset-inline-end: -240px;
    top: -250px;
    border-radius: 50%;
    background: var(--brava-primary);
    filter: blur(160px);
    opacity: .08;
    pointer-events: none;
}

.home-hero__grid {
    width: 100%;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(420px, .9fr);
    align-items: center;
    gap: clamp(50px, 7vw, 110px);
    padding-block: clamp(80px, 10vw, 145px);
}

.home-hero__content {
    position: relative;
    z-index: 2;
    max-width: 760px;
}

.home-hero__brand {
    display: inline-flex;
    align-items: center;
    gap: 14px;
    margin-bottom: 28px;
    font-size: .78rem;
    font-weight: 800;
    letter-spacing: .16em;
    text-transform: uppercase;
    color: var(--brava-primary);
}

.home-hero__brand-line {
    display: block;
    width: 38px;
    height: 2px;
    background: currentColor;
}

.home-hero__title {
    max-width: 800px;
    margin: 0;
    font-size: clamp(3.1rem, 6vw, 6.7rem);
    line-height: .96;
    letter-spacing: -.055em;
    color: var(--brava-text);
    text-wrap: balance;
}

[dir="rtl"] .home-hero__title {
    letter-spacing: -.025em;
    line-height: 1.08;
}

.home-hero__lead {
    max-width: 700px;
    margin: 32px 0 0;
    font-size: clamp(1.08rem, 1.5vw, 1.35rem);
    line-height: 1.85;
    color: var(--brava-muted, var(--brava-text-muted));
}

.home-hero__actions {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 14px;
    margin-top: 38px;
}

.home-hero__actions .brava-button {
    min-height: 56px;
    padding-inline: 26px;
    border-radius: 14px;
}

.home-hero__primary {
    display: inline-flex;
    align-items: center;
    gap: 28px;
}

.button-arrow {
    font-size: 1.15em;
}

.home-hero__highlights {
    display: flex;
    flex-wrap: wrap;
    gap: 0;
    margin-top: 56px;
}

.home-hero__highlights > div {
    min-width: 145px;
    padding-inline: 22px;
    border-inline-start: 1px solid var(--brava-border);
}

.home-hero__highlights > div:first-child {
    padding-inline-start: 0;
    border-inline-start: 0;
}

.home-hero__highlights strong,
.home-hero__highlights span {
    display: block;
}

.home-hero__highlights strong {
    font-size: 1rem;
    color: var(--brava-text);
}

.home-hero__highlights span {
    margin-top: 4px;
    font-size: .83rem;
    color: var(--brava-muted, var(--brava-text-muted));
}

.home-hero__visual {
    position: relative;
    min-height: 530px;
    display: grid;
    place-items: center;
}

.home-hero__device {
    position: relative;
    z-index: 2;
    width: min(100%, 650px);
    transform: rotate(-5deg);
    transition: transform .55s cubic-bezier(.2, .8, .2, 1);
}

[dir="rtl"] .home-hero__device {
    transform: rotate(5deg);
}

.home-hero__visual:hover .home-hero__device {
    transform: translateY(-10px) rotate(-2deg) scale(1.015);
}

[dir="rtl"] .home-hero__visual:hover .home-hero__device {
    transform: translateY(-10px) rotate(2deg) scale(1.015);
}

.home-hero__image {
    display: block;
    width: 100%;
    height: auto;
    max-height: 560px;
    object-fit: contain;
    filter: drop-shadow(0 45px 55px rgba(0, 0, 0, .18));
}

.home-hero__device-glow {
    position: absolute;
    z-index: 0;
    width: 72%;
    height: 55%;
    border-radius: 50%;
    background: var(--brava-primary);
    filter: blur(90px);
    opacity: .12;
}

.home-hero__floating-card {
    position: absolute;
    z-index: 4;
    inset-inline-end: 0;
    bottom: 25px;
    width: min(230px, 48%);
    padding: 19px 21px;
    border: 1px solid color-mix(in srgb, var(--brava-border) 75%, transparent);
    border-radius: 18px;
    background: color-mix(in srgb, var(--brava-surface) 87%, transparent);
    box-shadow: 0 22px 60px rgba(0, 0, 0, .12);
    backdrop-filter: blur(18px);
}

.home-hero__floating-label {
    display: block;
    margin-bottom: 7px;
    font-size: .69rem;
    font-weight: 800;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--brava-primary);
}

.home-hero__floating-card strong {
    display: block;
    color: var(--brava-text);
}

.home-hero__floating-card a {
    display: inline-block;
    margin-top: 12px;
    font-size: .81rem;
    font-weight: 700;
    color: var(--brava-primary);
    text-decoration: none;
}

.home-hero__placeholder {
    aspect-ratio: 1 / .8;
    display: grid;
    place-content: center;
    gap: 12px;
    text-align: center;
    border: 1px dashed var(--brava-border);
    border-radius: 28px;
    color: var(--brava-muted, var(--brava-text-muted));
}

.home-hero__placeholder-icon {
    font-size: 2rem;
    font-weight: 900;
    letter-spacing: .12em;
    color: var(--brava-text);
}

/* TRUST */
.home-trust {
    border-block: 1px solid var(--brava-border);
    background: var(--brava-surface);
}

.home-trust__grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
}

.home-trust__item {
    display: flex;
    align-items: flex-start;
    gap: 16px;
    padding: 28px clamp(18px, 2.5vw, 38px);
    border-inline-start: 1px solid var(--brava-border);
}

.home-trust__item:first-child { border-inline-start: 0; }
.home-trust__number { font-size: .68rem; font-weight: 800; color: var(--brava-primary); }
.home-trust__item strong,
.home-trust__item span { display: block; }
.home-trust__item strong { color: var(--brava-text); }
.home-trust__item div > span { margin-top: 5px; font-size: .82rem; line-height: 1.5; color: var(--brava-muted, var(--brava-text-muted)); }

/* SHARED HOME HEADINGS */
.home-section-heading {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(280px, .65fr);
    gap: 70px;
    align-items: end;
    margin-bottom: clamp(36px, 5vw, 65px);
}

.home-section-heading h2 {
    max-width: 760px;
    margin: 8px 0 0;
    font-size: clamp(2.2rem, 4vw, 4.1rem);
    line-height: 1.05;
    letter-spacing: -.04em;
    color: var(--brava-text);
}

[dir="rtl"] .home-section-heading h2 { letter-spacing: -.015em; line-height: 1.18; }
.home-section-heading > p { margin: 0; line-height: 1.8; color: var(--brava-muted, var(--brava-text-muted)); }
.home-section-heading--inline { display: flex; justify-content: space-between; align-items: flex-end; }

.home-text-link {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding-bottom: 5px;
    border-bottom: 1px solid currentColor;
    color: var(--brava-text);
    font-weight: 700;
    text-decoration: none;
}

/* FEATURED */
.home-featured { overflow: hidden; }
.home-featured__grid { gap: 22px; }
.home-empty-state {
    grid-column: 1 / -1;
    padding: 42px;
    border: 1px dashed var(--brava-border);
    border-radius: 20px;
    text-align: center;
    color: var(--brava-muted, var(--brava-text-muted));
}
.home-empty-state strong,
.home-empty-state span { display: block; }
.home-empty-state strong { color: var(--brava-text); }
.home-empty-state span { margin-top: 6px; }

/* PROCESS */
.home-process__layout {
    display: grid;
    grid-template-columns: minmax(300px, .7fr) 1.3fr;
    gap: clamp(60px, 9vw, 130px);
    align-items: start;
}

.home-process__intro { position: sticky; top: 140px; }
.home-process__intro h2 {
    margin: 8px 0 22px;
    font-size: clamp(2.2rem, 4vw, 4rem);
    line-height: 1.08;
    color: var(--brava-text);
}
.home-process__intro > p:last-child { max-width: 520px; line-height: 1.85; color: var(--brava-muted, var(--brava-text-muted)); }
.home-process__steps { list-style: none; margin: 0; padding: 0; }
.home-process__steps li {
    display: grid;
    grid-template-columns: 72px 1fr;
    gap: 22px;
    padding: 32px 0;
    border-top: 1px solid var(--brava-border);
}
.home-process__steps li:last-child { border-bottom: 1px solid var(--brava-border); }
.home-process__number { font-size: .78rem; font-weight: 800; color: var(--brava-primary); }
.home-process__steps h3 { margin: 0; font-size: clamp(1.35rem, 2vw, 1.85rem); color: var(--brava-text); }
.home-process__steps p { margin: 8px 0 0; color: var(--brava-muted, var(--brava-text-muted)); }

/* B2B */
.home-b2b {
    position: relative;
    overflow: hidden;
    isolation: isolate;
    padding-block: clamp(75px, 9vw, 125px);
    background: linear-gradient(135deg, #080a0c, #11161a);
    color: #fff;
}

.home-b2b::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -2;
    background: linear-gradient(90deg, rgba(255,255,255,.025) 1px, transparent 1px);
    background-size: 70px 70px;
}

.home-b2b__glow {
    position: absolute;
    z-index: -1;
    width: 560px;
    height: 560px;
    inset-inline-end: -170px;
    bottom: -380px;
    border-radius: 50%;
    background: var(--brava-primary);
    filter: blur(110px);
    opacity: .28;
}

.home-b2b__inner {
    display: grid;
    grid-template-columns: minmax(0, 1.3fr) minmax(270px, .5fr);
    gap: 80px;
    align-items: end;
}
.home-b2b .eyebrow { color: var(--brava-primary); }
.home-b2b h2 {
    max-width: 850px;
    margin: 10px 0 24px;
    font-size: clamp(2.7rem, 5vw, 5.4rem);
    line-height: 1.02;
    letter-spacing: -.045em;
    color: #fff;
}
[dir="rtl"] .home-b2b h2 { letter-spacing: -.015em; line-height: 1.15; }
.home-b2b__content > p:last-child { max-width: 730px; margin: 0; font-size: 1.05rem; line-height: 1.85; color: rgba(255,255,255,.68); }
.home-b2b__action { display: flex; flex-direction: column; align-items: flex-start; gap: 16px; }
.home-b2b__action > span { color: rgba(255,255,255,.55); font-size: .85rem; }
.home-b2b__action .brava-button { min-height: 58px; display: inline-flex; align-items: center; gap: 22px; border-radius: 14px; }

/* RESPONSIVE */
@media (max-width: 1100px) {
    .home-hero__grid { grid-template-columns: 1fr 1fr; gap: 40px; }
}

@media (max-width: 820px) {
    .home-hero { min-height: auto; }
    .home-hero__grid { grid-template-columns: 1fr; padding-block: 70px; }
    .home-hero__content { order: 1; }
    .home-hero__visual { order: 2; min-height: 390px; margin-top: 10px; }
    .home-hero__device { width: min(92%, 520px); }
    .home-hero__floating-card { inset-inline-end: 3%; }
    .home-trust__grid { grid-template-columns: 1fr 1fr; }
    .home-trust__item:nth-child(3) { border-inline-start: 0; border-top: 1px solid var(--brava-border); }
    .home-trust__item:nth-child(4) { border-top: 1px solid var(--brava-border); }
    .home-section-heading { grid-template-columns: 1fr; gap: 18px; }
    .home-section-heading--inline { display: flex; }
    .home-process__layout { grid-template-columns: 1fr; gap: 45px; }
    .home-process__intro { position: static; }
    .home-b2b__inner { grid-template-columns: 1fr; gap: 45px; }
}

@media (max-width: 620px) {
    .home-hero__title { font-size: clamp(2.65rem, 13vw, 4rem); }
    .home-hero__lead { font-size: 1rem; }
    .home-hero__actions { display: grid; grid-template-columns: 1fr; }
    .home-hero__actions .brava-button { justify-content: center; width: 100%; }
    .home-hero__highlights { display: grid; grid-template-columns: repeat(3, 1fr); }
    .home-hero__highlights > div { min-width: 0; padding-inline: 12px; }
    .home-hero__visual { min-height: 320px; }
    .home-hero__floating-card { display: none; }
    .home-trust__grid { grid-template-columns: 1fr; }
    .home-trust__item,
    .home-trust__item:nth-child(3),
    .home-trust__item:nth-child(4) { border-inline-start: 0; border-top: 1px solid var(--brava-border); }
    .home-trust__item:first-child { border-top: 0; }
    .home-section-heading--inline { display: grid; align-items: start; }
    .home-process__steps li { grid-template-columns: 48px 1fr; }
    .home-b2b h2 { font-size: clamp(2.5rem, 12vw, 4rem); }
}
/* ==========================================================
   HOME — BRAND CATALOG
   Samsung + Apple
========================================================== */

.home-brand-grid {
    display: grid;
    grid-template-columns: 1.12fr .88fr;
    gap: clamp(18px, 2vw, 28px);
}


/* ----------------------------------------------------------
   BASE CARD
---------------------------------------------------------- */

.home-brand-card {
    position: relative;
    isolation: isolate;
    overflow: hidden;

    min-height: clamp(440px, 38vw, 560px);

    display: flex;
    flex-direction: column;
    justify-content: space-between;

    padding: clamp(30px, 4vw, 52px);

    border: 1px solid var(--brava-border);
    border-radius: clamp(24px, 2.5vw, 34px);

    color: var(--brava-text);
    text-decoration: none;

    transition:
        transform .45s cubic-bezier(.2, .8, .2, 1),
        box-shadow .45s ease,
        border-color .35s ease;
}

.home-brand-card:hover {
    transform: translateY(-8px);

    border-color:
        color-mix(
            in srgb,
            var(--brava-primary) 35%,
            var(--brava-border)
        );

    box-shadow:
        0 35px 80px rgba(0, 0, 0, .11);
}


/* ----------------------------------------------------------
   DECORATIVE AMBIENT CIRCLE
---------------------------------------------------------- */

.home-brand-card__ambient {
    position: absolute;
    z-index: -1;

    width: 420px;
    height: 420px;

    inset-inline-end: -220px;
    bottom: -250px;

    border-radius: 50%;

    background: currentColor;

    opacity: .045;

    transition:
        transform .65s cubic-bezier(.2, .8, .2, 1),
        opacity .45s ease;
}

.home-brand-card:hover .home-brand-card__ambient {
    transform: scale(1.25);
    opacity: .07;
}


/* ----------------------------------------------------------
   CARD HEADER
---------------------------------------------------------- */

.home-brand-card__header {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.home-brand-card__number {
    font-size: .72rem;
    font-weight: 800;

    letter-spacing: .12em;

    opacity: .55;
}

.home-brand-card__arrow {
    width: 48px;
    height: 48px;

    display: grid;
    place-items: center;

    border: 1px solid currentColor;
    border-radius: 50%;

    font-size: 1.05rem;

    opacity: .55;

    transition:
        opacity .3s ease,
        transform .35s ease,
        background-color .35s ease;
}

.home-brand-card:hover .home-brand-card__arrow {
    opacity: 1;
    transform: rotate(-8deg);
}


/* ----------------------------------------------------------
   CONTENT
---------------------------------------------------------- */

.home-brand-card__body {
    position: relative;
    z-index: 2;

    max-width: 600px;
}

.home-brand-card__brand {
    display: block;

    margin-bottom: 10px;

    font-size: .74rem;
    font-weight: 800;

    letter-spacing: .14em;
    text-transform: uppercase;

    opacity: .58;
}

.home-brand-card h3 {
    margin: 0;

    font-size:
        clamp(
            3.1rem,
            6vw,
            6.2rem
        );

    line-height: .9;

    letter-spacing: -.055em;

    color: inherit;
}

[dir="rtl"] .home-brand-card h3 {
    letter-spacing: -.02em;
}

.home-brand-card p {
    max-width: 550px;

    margin:
        clamp(24px, 3vw, 34px)
        0
        0;

    font-size: clamp(.98rem, 1.2vw, 1.1rem);
    line-height: 1.85;

    opacity: .7;
}


/* ----------------------------------------------------------
   SAMSUNG
---------------------------------------------------------- */

.home-brand-card--samsung {
    color: #fff;

    border-color: transparent;

    background:
        radial-gradient(
            circle at 82% 12%,
            rgba(255, 255, 255, .14),
            transparent 28%
        ),
        linear-gradient(
            145deg,
            var(--brava-primary),
            color-mix(
                in srgb,
                var(--brava-primary) 58%,
                #050508
            )
        );
}

.home-brand-card--samsung::after {
    content: "GALAXY";

    position: absolute;
    z-index: -1;

    inset-inline-end: -30px;
    top: 50%;

    transform: translateY(-50%);

    font-size: clamp(5rem, 11vw, 11rem);
    font-weight: 900;

    letter-spacing: -.07em;

    color: rgba(255, 255, 255, .045);

    pointer-events: none;
}


/* ----------------------------------------------------------
   CONDITION BADGES
---------------------------------------------------------- */

.home-brand-card__badges {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;

    margin-top: clamp(28px, 4vw, 42px);
}

.device-condition-badge {
    display: inline-flex;
    align-items: center;
    gap: 8px;

    min-height: 34px;

    padding: 6px 13px;

    border:
        1px solid
        rgba(255, 255, 255, .25);

    border-radius: 999px;

    background:
        rgba(255, 255, 255, .10);

    color: #fff;

    font-size: .76rem;
    font-weight: 700;

    backdrop-filter: blur(12px);
}

.device-condition-badge__dot {
    width: 6px;
    height: 6px;

    flex: 0 0 6px;

    border-radius: 50%;

    background: currentColor;
}

.device-condition-badge--new {
    background:
        rgba(255, 255, 255, .15);
}

.device-condition-badge--refurbished {
    border-color:
        color-mix(
            in srgb,
            #fff 40%,
            transparent
        );

    background:
        rgba(0, 0, 0, .16);
}


/* ----------------------------------------------------------
   APPLE
---------------------------------------------------------- */

.home-brand-card--apple {
    background:
        radial-gradient(
            circle at 85% 10%,
            color-mix(
                in srgb,
                var(--brava-primary) 8%,
                transparent
            ),
            transparent 27%
        ),
        linear-gradient(
            145deg,
            var(--brava-surface),
            color-mix(
                in srgb,
                var(--brava-surface) 93%,
                #9a9a9a
            )
        );
}

.home-brand-card--apple::after {
    content: "iPhone";

    position: absolute;
    z-index: -1;

    inset-inline-end: -12px;
    bottom: 75px;

    font-size: clamp(5rem, 9vw, 9rem);
    font-weight: 800;

    letter-spacing: -.065em;

    color:
        color-mix(
            in srgb,
            var(--brava-text) 4%,
            transparent
        );

    pointer-events: none;
}

.home-brand-card__apple-mark {
    display: inline-flex;
    align-items: center;
    gap: 12px;

    margin-top: clamp(28px, 4vw, 42px);

    padding: 9px 14px;

    border: 1px solid var(--brava-border);
    border-radius: 999px;

    background:
        color-mix(
            in srgb,
            var(--brava-background) 60%,
            transparent
        );
}

.home-brand-card__apple-mark span {
    font-size: .78rem;
    font-weight: 800;

    color: var(--brava-text);
}

.home-brand-card__apple-mark small {
    padding-inline-start: 12px;

    border-inline-start:
        1px solid
        var(--brava-border);

    font-size: .72rem;

    color: var(--brava-muted);
}


/* ----------------------------------------------------------
   FOOTER LINK
---------------------------------------------------------- */

.home-brand-card__footer {
    position: relative;
    z-index: 2;

    display: flex;
    justify-content: space-between;
    align-items: center;

    padding-top: 24px;

    border-top: 0;

    font-size: .85rem;
    font-weight: 750;

    opacity: .62;

    transition: opacity .3s ease;
}

.home-brand-card:hover .home-brand-card__footer {
    opacity: 1;
}

.home-brand-card__footer span:last-child {
    font-size: 1.15rem;

    transition: transform .3s ease;
}

.home-brand-card:hover
.home-brand-card__footer span:last-child {
    transform: translateX(4px);
}

[dir="rtl"]
.home-brand-card:hover
.home-brand-card__footer span:last-child {
    transform: translateX(-4px);
}


/* ==========================================================
   RESPONSIVE
========================================================== */

@media (max-width: 900px) {

    .home-brand-grid {
        grid-template-columns: 1fr;
    }

    .home-brand-card {
        min-height: 420px;
    }

}


@media (max-width: 600px) {

    .home-brand-card {
        min-height: 380px;

        padding: 28px 24px;

        border-radius: 24px;
    }

    .home-brand-card h3 {
        font-size: clamp(3rem, 17vw, 4.8rem);
    }

    .home-brand-card p {
        font-size: .95rem;
    }

    .home-brand-card__arrow {
        width: 42px;
        height: 42px;
    }

}
/* ==========================================================
   HOME 2.3.2 — HERO, RHYTHM, FEATURED CARD REFINEMENTS
========================================================== */

/* ----------------------------------------------------------
   TYPOGRAPHIC RHYTHM
---------------------------------------------------------- */
.brava-home {
    font-size: clamp(.98rem, .94rem + .16vw, 1.075rem);
    line-height: 1.72;
}

.brava-home .eyebrow {
    font-size: clamp(.72rem, .69rem + .12vw, .82rem);
    line-height: 1.45;
    letter-spacing: .115em;
}

html[lang="ar"] .brava-home .eyebrow {
    letter-spacing: .035em;
}

.brava-home .section {
    padding-block: clamp(68px, 7vw, 108px);
}

.home-section-heading {
    gap: clamp(26px, 5vw, 64px);
    margin-bottom: clamp(32px, 4.5vw, 56px);
}

.home-section-heading h2,
.home-process__intro h2 {
    font-size: clamp(2rem, 3.3vw, 3.45rem);
}

.home-section-heading > p,
.home-process__intro > p:last-child {
    font-size: clamp(.96rem, .91rem + .18vw, 1.08rem);
}

/* ----------------------------------------------------------
   FULL-WIDTH CORPORATE HERO
---------------------------------------------------------- */
.home-hero {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    min-height: clamp(650px, 82vh, 900px);
    display: flex;
    align-items: center;
    background: #07101a;
    color: #fff;
}

.home-hero__media,
.home-hero__overlay,
.home-hero__mesh {
    position: absolute;
    inset: 0;
}

.home-hero__media {
    z-index: -5;
    overflow: hidden;
}

.home-hero__media img {
    width: 100%;
    height: 100%;
    max-width: none;
    object-fit: cover;
    object-position: center;
    transform: scale(1.035);
    animation: bravaHomeHeroKenBurns 18s ease-in-out infinite alternate;
    will-change: transform;
}

.home-hero__overlay {
    z-index: -4;
    background:
        linear-gradient(
            90deg,
            rgba(3, 9, 16, .94) 0%,
            rgba(3, 9, 16, .82) 34%,
            rgba(3, 9, 16, .43) 60%,
            rgba(3, 9, 16, .16) 100%
        ),
        linear-gradient(
            180deg,
            rgba(3, 9, 16, .18),
            rgba(3, 9, 16, .52)
        );
}

[dir="rtl"] .home-hero__overlay {
    background:
        linear-gradient(
            270deg,
            rgba(3, 9, 16, .94) 0%,
            rgba(3, 9, 16, .82) 34%,
            rgba(3, 9, 16, .43) 60%,
            rgba(3, 9, 16, .16) 100%
        ),
        linear-gradient(
            180deg,
            rgba(3, 9, 16, .18),
            rgba(3, 9, 16, .52)
        );
}

.home-hero__mesh {
    z-index: -3;
    opacity: .22;
    background-image:
        linear-gradient(rgba(255,255,255,.045) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.045) 1px, transparent 1px);
    background-size: 72px 72px;
    mask-image: linear-gradient(to bottom, transparent 3%, #000 35%, #000 80%, transparent);
}

.home-hero__accent {
    position: absolute;
    z-index: -2;
    border-radius: 50%;
    pointer-events: none;
    filter: blur(1px);
}

.home-hero__accent--one {
    width: clamp(220px, 28vw, 470px);
    aspect-ratio: 1;
    inset-inline-start: -12%;
    top: 13%;
    border: 1px solid rgba(255,255,255,.12);
    box-shadow:
        0 0 0 48px rgba(255,255,255,.018),
        0 0 0 96px rgba(255,255,255,.012);
    animation: bravaHeroOrbit 10s ease-in-out infinite alternate;
}

.home-hero__accent--two {
    width: 120px;
    height: 120px;
    inset-inline-end: 8%;
    bottom: 13%;
    background: var(--brava-primary);
    opacity: .13;
    filter: blur(48px);
    animation: bravaHeroPulse 6s ease-in-out infinite;
}

.home-hero__inner {
    position: relative;
    z-index: 3;
    width: min(100% - 40px, 1440px);
    min-height: inherit;
    display: flex;
    align-items: center;
    padding-block: clamp(92px, 11vw, 150px);
    padding-inline: clamp(12px, 3.4vw, 52px);
}

.home-hero__content {
    width: min(720px, 58%);
    max-width: 720px;
    padding: clamp(26px, 3vw, 42px) 0;
    color: #fff;
}

.home-hero__brand {
    display: inline-flex;
    align-items: center;
    gap: 14px;
    margin-bottom: clamp(20px, 2.5vw, 32px);
    color: #fff;
    font-size: clamp(.74rem, .71rem + .12vw, .84rem);
    font-weight: 800;
    letter-spacing: .13em;
    text-transform: uppercase;
}

html[lang="ar"] .home-hero__brand {
    letter-spacing: .025em;
}

.home-hero__brand-line {
    width: 40px;
    height: 2px;
    flex: 0 0 40px;
    background: var(--brava-primary);
}

.home-hero__title {
    max-width: 760px;
    margin: 0;
    color: #fff;
    font-size: clamp(3rem, 5.25vw, 5.65rem);
    font-weight: 800;
    line-height: .98;
    letter-spacing: -.05em;
    text-wrap: balance;
    text-shadow: 0 10px 40px rgba(0,0,0,.22);
}

[dir="rtl"] .home-hero__title {
    font-size: clamp(2.85rem, 4.8vw, 5.2rem);
    line-height: 1.12;
    letter-spacing: -.018em;
}

.home-hero__lead {
    max-width: 660px;
    margin: clamp(22px, 2.6vw, 32px) 0 0;
    color: rgba(255,255,255,.78);
    font-size: clamp(1.02rem, 1rem + .25vw, 1.24rem);
    line-height: 1.85;
    text-wrap: pretty;
}

.home-hero__actions {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: clamp(28px, 3.5vw, 42px);
}

.home-hero__actions .brava-button {
    min-height: 56px;
    padding-inline: 25px;
    border-radius: 14px;
}

.home-hero__primary {
    display: inline-flex;
    gap: 24px;
}

.home-hero__secondary {
    border-color: rgba(255,255,255,.58) !important;
    color: #fff !important;
    background: rgba(255,255,255,.055) !important;
    backdrop-filter: blur(12px);
}

.home-hero__secondary:hover {
    border-color: #fff !important;
    background: rgba(255,255,255,.13) !important;
}

.home-hero__highlights {
    display: flex;
    flex-wrap: wrap;
    margin-top: clamp(36px, 5vw, 58px);
}

.home-hero__highlights > div {
    min-width: 145px;
    padding-inline: 21px;
    border-inline-start: 1px solid rgba(255,255,255,.24);
}

.home-hero__highlights > div:first-child {
    padding-inline-start: 0;
    border-inline-start: 0;
}

.home-hero__highlights strong,
.home-hero__highlights span {
    display: block;
}

.home-hero__highlights strong {
    color: #fff;
    font-size: .96rem;
}

.home-hero__highlights span {
    margin-top: 4px;
    color: rgba(255,255,255,.61);
    font-size: .79rem;
}

.home-hero__signature {
    position: absolute;
    inset-inline-end: clamp(10px, 3vw, 52px);
    bottom: clamp(62px, 8vw, 110px);
    display: grid;
    justify-items: end;
    color: rgba(255,255,255,.15);
    line-height: .76;
    letter-spacing: .055em;
    pointer-events: none;
    user-select: none;
}

.home-hero__signature span {
    font-size: clamp(1.1rem, 2vw, 1.9rem);
    font-weight: 500;
}

.home-hero__signature strong {
    font-size: clamp(2.4rem, 5vw, 5rem);
    font-weight: 900;
}

.home-hero__scroll {
    position: absolute;
    z-index: 4;
    inset-inline-start: 50%;
    bottom: 22px;
    width: 1px;
    height: 44px;
    overflow: hidden;
    background: rgba(255,255,255,.2);
}

.home-hero__scroll span {
    display: block;
    width: 100%;
    height: 45%;
    background: #fff;
    animation: bravaHeroScroll 2s ease-in-out infinite;
}

@keyframes bravaHomeHeroKenBurns {
    from { transform: scale(1.035) translate3d(0, 0, 0); }
    to   { transform: scale(1.105) translate3d(-1.1%, -.6%, 0); }
}

@keyframes bravaHeroOrbit {
    from { transform: translate3d(0,0,0) rotate(0); opacity: .65; }
    to   { transform: translate3d(28px,18px,0) rotate(8deg); opacity: 1; }
}

@keyframes bravaHeroPulse {
    0%,100% { transform: scale(.85); opacity: .09; }
    50%     { transform: scale(1.25); opacity: .18; }
}

@keyframes bravaHeroScroll {
    0%   { transform: translateY(-130%); }
    55%  { transform: translateY(130%); }
    100% { transform: translateY(130%); }
}

/* ----------------------------------------------------------
   EQUAL SAMSUNG / APPLE BRAND CARDS
---------------------------------------------------------- */
.home-brand-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: stretch;
}

.home-brand-card {
    width: 100%;
    min-height: clamp(430px, 35vw, 520px);
}

.home-brand-card__body {
    max-width: 560px;
}

.home-brand-card h3 {
    font-size: clamp(3rem, 5vw, 5.2rem);
}

/* ----------------------------------------------------------
   FEATURED DEVICE CARDS — FULLER MEDIA + MOBILE IMPROVEMENTS
---------------------------------------------------------- */
.home-featured__grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: clamp(16px, 2vw, 24px);
    align-items: stretch;
}

.home-featured__grid .product-card {
    display: flex;
    flex-direction: column;
    min-width: 0;
    overflow: hidden;
    border: 1px solid color-mix(in srgb, var(--brava-border) 80%, transparent);
    border-radius: 24px;
    background: var(--brava-surface);
    box-shadow: 0 12px 32px rgba(8,16,24,.055);
}

.home-featured__grid .product-card__media {
    position: relative;
    overflow: hidden;
    width: 100%;
    aspect-ratio: 1 / .92;
    padding: 0;
    display: block;
    background:
        radial-gradient(circle at 50% 42%, #fff 0, #f7f8f8 56%, #eef1f1 100%);
}

.home-featured__grid .product-card__media::after {
    content: "";
    position: absolute;
    inset: auto 8% 5% 8%;
    height: 15%;
    border-radius: 50%;
    background: rgba(0,0,0,.10);
    filter: blur(18px);
    opacity: .22;
    pointer-events: none;
}

.home-featured__grid .product-card__media img {
    position: relative;
    z-index: 1;
    display: block;
    width: 100%;
    height: 100%;
    max-width: none;
    object-fit: cover;
    object-position: center;
    transform: scale(1.10);
    transition: transform .45s cubic-bezier(.2,.8,.2,1);
}

.home-featured__grid .product-card:hover .product-card__media img {
    transform: scale(1.16);
}

.home-featured__grid .product-card__body {
    flex: 1;
    display: flex;
    flex-direction: column;
    padding: clamp(17px, 1.7vw, 23px);
}

.home-featured__grid .product-card__body .eyebrow {
    margin-bottom: 7px;
    font-size: .72rem;
}

.home-featured__grid .product-card h2 {
    margin: 0;
    font-size: clamp(1.15rem, 1rem + .38vw, 1.45rem);
    line-height: 1.28;
}

.home-featured__grid .product-card h2 a {
    text-decoration: none;
}

.home-featured__grid .availability {
    margin: 7px 0 0;
    font-size: .82rem;
}

.home-featured__grid .card-actions {
    margin-top: auto;
    padding-top: 18px;
    gap: 10px;
}

.home-featured__grid .card-actions .text-link {
    font-size: .88rem;
}

.home-featured__grid .brava-button--small {
    min-height: 42px;
    padding: 8px 12px;
    font-size: .83rem;
    border-radius: 11px;
}

/* ----------------------------------------------------------
   RESPONSIVE HOME REFINEMENTS
---------------------------------------------------------- */
@media (max-width: 1180px) {
    .home-hero__content {
        width: min(690px, 65%);
    }

    .home-featured__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 900px) {
    .home-hero {
        min-height: clamp(640px, 78vh, 780px);
    }

    .home-hero__media img {
        object-position: 62% center;
    }

    [dir="rtl"] .home-hero__media img {
        object-position: 38% center;
    }

    .home-hero__overlay,
    [dir="rtl"] .home-hero__overlay {
        background:
            linear-gradient(180deg, rgba(3,9,16,.38) 0%, rgba(3,9,16,.78) 45%, rgba(3,9,16,.96) 100%);
    }

    .home-hero__inner {
        align-items: flex-end;
        padding-block: 90px 74px;
        padding-inline: clamp(4px, 2vw, 18px);
    }

    .home-hero__content {
        width: min(100%, 720px);
        max-width: 720px;
    }

    .home-hero__signature {
        display: none;
    }

    .home-brand-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .home-brand-card {
        min-height: 410px;
        padding: 30px;
    }
}

@media (max-width: 680px) {
    .brava-home .section {
        padding-block: 58px;
    }

    .home-hero {
        min-height: 700px;
    }

    .home-hero__inner {
        width: min(100% - 28px, 1440px);
        padding-inline: 5px;
        padding-block: 86px 64px;
    }

    .home-hero__content {
        padding: 0;
    }

    .home-hero__title,
    [dir="rtl"] .home-hero__title {
        font-size: clamp(2.45rem, 11vw, 3.65rem);
    }

    .home-hero__lead {
        font-size: .98rem;
        line-height: 1.78;
    }

    .home-hero__actions {
        display: grid;
        grid-template-columns: 1fr;
        width: 100%;
    }

    .home-hero__actions .brava-button {
        width: 100%;
        justify-content: center;
    }

    .home-hero__highlights {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        margin-top: 34px;
    }

    .home-hero__highlights > div {
        min-width: 0;
        padding-inline: 10px;
    }

    .home-hero__highlights strong {
        font-size: .82rem;
    }

    .home-hero__highlights span {
        font-size: .68rem;
        line-height: 1.35;
    }

    .home-hero__scroll {
        display: none;
    }

    .home-section-heading,
    .home-section-heading--inline {
        display: grid;
        grid-template-columns: 1fr;
        gap: 16px;
    }

    .home-section-heading h2,
    .home-process__intro h2 {
        font-size: clamp(1.85rem, 8.5vw, 2.65rem);
    }

    .home-brand-grid {
        grid-template-columns: 1fr;
    }

    .home-brand-card {
        min-height: 370px;
        padding: 26px 23px;
    }

    .home-brand-card h3 {
        font-size: clamp(2.75rem, 15vw, 4.1rem);
    }

    .home-featured__grid {
        grid-template-columns: 1fr;
        gap: 18px;
    }

    .home-featured__grid .product-card {
        border-radius: 22px;
    }

    .home-featured__grid .product-card__media {
        aspect-ratio: 1.28 / 1;
    }

    .home-featured__grid .product-card__media img {
        transform: scale(1.08);
    }

    .home-featured__grid .card-actions {
        flex-direction: row;
        align-items: center;
    }

    .home-featured__grid .brava-button--small {
        width: auto;
    }

    .home-b2b h2 {
        font-size: clamp(2.1rem, 9.5vw, 3rem);
    }
}

@media (prefers-reduced-motion: reduce) {
    .home-hero__media img,
    .home-hero__accent,
    .home-hero__scroll span {
        animation: none !important;
    }
}

/* ==========================================================
   BRAVA HOME 2.3.3 — LANGUAGE HERO + MOTION + PROCESS JOURNEY
========================================================== */

.home-hero {
    --hero-parallax-x: 0px;
    --hero-parallax-y: 0px;
}

.home-hero__media {
    transform: translate3d(var(--hero-parallax-x), var(--hero-parallax-y), 0) scale(1.018);
    transition: transform .8s cubic-bezier(.2,.75,.25,1);
    will-change: transform;
}

.home-hero__media::after {
    content: "";
    position: absolute;
    inset: -30% -20%;
    pointer-events: none;
    background: linear-gradient(
        115deg,
        transparent 34%,
        rgba(255,255,255,.035) 44%,
        rgba(255,255,255,.12) 49%,
        rgba(255,255,255,.035) 54%,
        transparent 64%
    );
    transform: translateX(-46%) rotate(4deg);
    animation: bravaHeroLightSweep 9s ease-in-out infinite;
    mix-blend-mode: screen;
}

@keyframes bravaHeroLightSweep {
    0%, 18% { transform: translateX(-52%) rotate(4deg); opacity: 0; }
    30% { opacity: .65; }
    52% { transform: translateX(48%) rotate(4deg); opacity: .28; }
    62%, 100% { transform: translateX(48%) rotate(4deg); opacity: 0; }
}

/* Accessible typewriter enhancement. The complete text remains the H1 aria-label. */
.home-hero__title.is-typewriter {
    min-height: 1.12em;
}

.home-typewriter__caret {
    display: inline-block;
    width: .08em;
    height: .86em;
    margin-inline-start: .1em;
    vertical-align: -.04em;
    border-radius: 2px;
    background: var(--brava-primary);
    animation: bravaTypeCaret .72s steps(1,end) infinite;
}

.home-hero__title.is-typed .home-typewriter__caret {
    animation-duration: 1.05s;
    opacity: .8;
}

@keyframes bravaTypeCaret {
    0%, 48% { opacity: 1; }
    49%, 100% { opacity: 0; }
}

/* ----------------------------------------------------------
   CONTEMPORARY REFURBISHMENT JOURNEY
---------------------------------------------------------- */
.home-process {
    position: relative;
    overflow: hidden;
    background:
        radial-gradient(circle at 84% 20%, color-mix(in srgb, var(--brava-primary) 7%, transparent), transparent 32%),
        var(--brava-surface, #fff);
}

.home-process__layout {
    grid-template-columns: minmax(300px, .72fr) minmax(0, 1.45fr);
    gap: clamp(48px, 7vw, 112px);
    align-items: center;
}

.home-process__intro {
    position: relative;
    top: auto;
    align-self: center;
    padding: clamp(28px, 4vw, 52px);
    border: 1px solid var(--brava-border);
    border-radius: 30px;
    background: color-mix(in srgb, var(--brava-surface, #fff) 88%, transparent);
    box-shadow: 0 24px 70px rgba(7, 15, 24, .07);
    backdrop-filter: blur(16px);
}

.home-process__intro::after {
    content: "04";
    position: absolute;
    inset-inline-end: 24px;
    bottom: 8px;
    font-size: clamp(4rem, 8vw, 8rem);
    font-weight: 900;
    line-height: 1;
    color: color-mix(in srgb, var(--brava-primary) 5%, transparent);
    pointer-events: none;
}

.home-process__intro h2 {
    max-width: 560px;
    font-size: clamp(2rem, 3.3vw, 3.45rem);
    line-height: 1.12;
}

[dir="rtl"] .home-process__intro h2 {
    line-height: 1.24;
}

.home-process__steps {
    position: relative;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
    counter-reset: none;
}

.home-process__steps::before {
    content: "";
    position: absolute;
    inset: 50% 9%;
    height: 1px;
    background: linear-gradient(90deg, transparent, var(--brava-border) 18%, var(--brava-primary) 50%, var(--brava-border) 82%, transparent);
    opacity: .7;
    pointer-events: none;
}

.home-process__steps li,
.home-process__steps li:last-child {
    position: relative;
    z-index: 1;
    min-height: 190px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 28px;
    padding: clamp(24px, 3vw, 34px);
    border: 1px solid var(--brava-border);
    border-radius: 24px;
    background: var(--brava-surface, #fff);
    box-shadow: 0 18px 50px rgba(7, 15, 24, .055);
    transition: transform .35s ease, box-shadow .35s ease, border-color .35s ease;
}

.home-process__steps li:nth-child(2),
.home-process__steps li:nth-child(4) {
    transform: translateY(22px);
}

.home-process__steps li:hover {
    transform: translateY(-6px);
    border-color: color-mix(in srgb, var(--brava-primary) 38%, var(--brava-border));
    box-shadow: 0 26px 64px rgba(7, 15, 24, .09);
}

.home-process__steps li:nth-child(2):hover,
.home-process__steps li:nth-child(4):hover {
    transform: translateY(15px);
}

.home-process__number {
    width: 46px;
    height: 46px;
    display: grid;
    place-items: center;
    border-radius: 14px;
    background: var(--brava-primary-soft, #fce6f2);
    color: var(--brava-primary);
    font-size: .78rem;
    font-weight: 900;
    box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--brava-primary) 13%, transparent);
}

.home-process__steps h3 {
    font-size: clamp(1.25rem, 1.75vw, 1.65rem);
    line-height: 1.25;
}

.home-process__steps p {
    margin-top: 9px;
    font-size: .94rem;
    line-height: 1.7;
}

/* ----------------------------------------------------------
   FINAL TYPE SCALE TUNING
---------------------------------------------------------- */
.brava-home .eyebrow {
    font-size: clamp(.72rem, .69rem + .08vw, .8rem);
}

.brava-home .home-section-heading h2 {
    font-size: clamp(2.05rem, 3.4vw, 3.65rem);
}

.brava-home .home-b2b h2 {
    font-size: clamp(2.45rem, 4.35vw, 4.7rem);
}

@media (max-width: 900px) {
    .home-process__layout {
        grid-template-columns: 1fr;
    }

    .home-process__intro {
        max-width: 720px;
    }

    .home-process__steps {
        margin-top: 4px;
    }
}

@media (max-width: 620px) {
    .home-process__steps {
        grid-template-columns: 1fr;
        gap: 12px;
    }

    .home-process__steps::before {
        display: none;
    }

    .home-process__steps li,
    .home-process__steps li:nth-child(2),
    .home-process__steps li:nth-child(4),
    .home-process__steps li:hover,
    .home-process__steps li:nth-child(2):hover,
    .home-process__steps li:nth-child(4):hover {
        min-height: 0;
        transform: none;
    }

    .home-process__intro {
        padding: 26px 22px;
        border-radius: 24px;
    }

    .home-process__intro::after {
        font-size: 5rem;
    }

    .home-process__steps li {
        padding: 22px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .home-hero__media {
        transform: none;
        transition: none;
    }

    .home-hero__media img,
    .home-hero__media::after,
    .home-typewriter__caret,
    .home-process__steps li {
        animation: none !important;
        transition: none !important;
    }
}

/* ==========================================================
   2.3.4 — CONTINUOUS TYPEWRITER + DESKTOP PROCESS TIMELINE
   ========================================================== */

/* Keep the hero title footprint stable while the text is erased/retyped. */
.home-hero__title.is-typewriter {
    min-height: 2.15em;
}

.home-typewriter__text {
    white-space: pre-wrap;
}

/* ----------------------------------------------------------
   Refurbishment process: clear four-step timeline on desktop
   ---------------------------------------------------------- */
.home-process {
    background:
        radial-gradient(circle at 50% 0%, color-mix(in srgb, var(--brava-primary) 5%, transparent), transparent 34%),
        var(--brava-surface, #fff);
}

.home-process__layout {
    display: block;
}

.home-process__intro {
    position: relative;
    max-width: 820px;
    margin-inline: auto;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    backdrop-filter: none;
    text-align: center;
}

.home-process__intro::after {
    display: none;
}

.home-process__intro h2 {
    max-width: 760px;
    margin-inline: auto;
    font-size: clamp(2.15rem, 3.25vw, 3.55rem);
}

.home-process__intro > p:last-child {
    max-width: 690px;
    margin-inline: auto;
}

.home-process__steps {
    position: relative;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: clamp(18px, 2.4vw, 34px);
    margin-top: clamp(54px, 6vw, 82px);
    padding: 0;
}

.home-process__steps::before {
    content: "";
    position: absolute;
    top: 27px;
    inset-inline: calc(12.5% - 1px);
    height: 2px;
    background: linear-gradient(
        90deg,
        color-mix(in srgb, var(--brava-primary) 25%, var(--brava-border)),
        var(--brava-primary),
        color-mix(in srgb, var(--brava-primary) 25%, var(--brava-border))
    );
    opacity: .65;
    pointer-events: none;
}

.home-process__steps li,
.home-process__steps li:last-child,
.home-process__steps li:nth-child(2),
.home-process__steps li:nth-child(4),
.home-process__steps li:hover,
.home-process__steps li:nth-child(2):hover,
.home-process__steps li:nth-child(4):hover {
    position: relative;
    z-index: 1;
    min-height: 0;
    display: block;
    padding: 0 clamp(5px, 1vw, 14px);
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    transform: none;
    text-align: center;
}

.home-process__number {
    width: 56px;
    height: 56px;
    margin: 0 auto 26px;
    display: grid;
    place-items: center;
    border: 2px solid color-mix(in srgb, var(--brava-primary) 30%, var(--brava-border));
    border-radius: 50%;
    background: var(--brava-surface, #fff);
    color: var(--brava-primary);
    font-size: .8rem;
    font-weight: 900;
    box-shadow: 0 0 0 8px var(--brava-surface, #fff), 0 12px 30px rgba(7, 15, 24, .07);
    transition: transform .3s ease, background-color .3s ease, color .3s ease, border-color .3s ease;
}

.home-process__steps li:hover .home-process__number {
    transform: translateY(-4px) scale(1.06);
    border-color: var(--brava-primary);
    background: var(--brava-primary);
    color: #fff;
}

.home-process__steps h3 {
    margin: 0;
    font-size: clamp(1.2rem, 1.55vw, 1.55rem);
    line-height: 1.3;
}

.home-process__steps p {
    max-width: 245px;
    margin: 10px auto 0;
    font-size: .92rem;
    line-height: 1.75;
}

@media (max-width: 900px) {
    .home-process__steps {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 34px 24px;
    }

    .home-process__steps::before {
        display: none;
    }
}

@media (max-width: 620px) {
    .home-hero__title.is-typewriter {
        min-height: 2.4em;
    }

    .home-process__intro {
        text-align: start;
    }

    .home-process__intro h2,
    .home-process__intro > p:last-child {
        margin-inline: 0;
    }

    .home-process__steps {
        grid-template-columns: 1fr;
        gap: 0;
        margin-top: 38px;
        padding-inline-start: 18px;
    }

    .home-process__steps::after {
        content: "";
        position: absolute;
        inset-inline-start: 45px;
        top: 28px;
        bottom: 28px;
        width: 2px;
        background: linear-gradient(var(--brava-primary), color-mix(in srgb, var(--brava-primary) 20%, var(--brava-border)));
        opacity: .55;
        pointer-events: none;
    }

    .home-process__steps li,
    .home-process__steps li:last-child,
    .home-process__steps li:nth-child(2),
    .home-process__steps li:nth-child(4),
    .home-process__steps li:hover,
    .home-process__steps li:nth-child(2):hover,
    .home-process__steps li:nth-child(4):hover {
        display: grid;
        grid-template-columns: 58px 1fr;
        gap: 18px;
        padding: 0 0 28px;
        text-align: start;
    }

    .home-process__number {
        position: relative;
        z-index: 2;
        width: 54px;
        height: 54px;
        margin: 0;
        box-shadow: 0 0 0 7px var(--brava-surface, #fff);
    }

    .home-process__steps h3 {
        padding-top: 5px;
    }

    .home-process__steps p {
        max-width: none;
        margin-inline: 0;
    }
}


/* ===== Brava 2.4.0 — Global wholesale positioning upgrade ===== */
.home-why{background:var(--brava-surface,#fff)}
.home-why__heading{margin-bottom:clamp(34px,5vw,70px)}
.home-why__grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));border-top:1px solid var(--brava-border);border-inline-start:1px solid var(--brava-border)}
.home-why__card{position:relative;min-height:250px;padding:clamp(28px,4vw,52px);display:grid;grid-template-columns:48px 1fr;gap:24px;border-inline-end:1px solid var(--brava-border);border-bottom:1px solid var(--brava-border);overflow:hidden;transition:transform .35s ease,background .35s ease}
.home-why__card::after{content:"";position:absolute;inset:auto -20% -70% auto;width:260px;aspect-ratio:1;border-radius:50%;background:color-mix(in srgb,var(--brava-primary) 10%,transparent);transition:transform .5s ease}
.home-why__card:hover{background:color-mix(in srgb,var(--brava-primary) 3%,var(--brava-surface,#fff));transform:translateY(-3px)}
.home-why__card:hover::after{transform:scale(1.2)}
.home-why__number{font-size:.75rem;font-weight:800;color:var(--brava-primary)}
.home-why__card h3{margin:0 0 14px;font-size:clamp(1.35rem,2vw,1.9rem);color:var(--brava-text)}
.home-why__card p{margin:0;max-width:560px;line-height:1.8;color:var(--brava-text-muted)}
.home-why__mark{position:absolute;inset-inline-end:28px;top:28px;color:var(--brava-primary);opacity:.45}
.home-global{position:relative;overflow:hidden;background:#101719;color:#fff}
.home-global::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 20% 60%,color-mix(in srgb,var(--brava-primary) 18%,transparent),transparent 35%);pointer-events:none}
.home-global__grid{position:relative;display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:clamp(50px,8vw,120px);align-items:center}
.home-global__visual{min-height:480px;border:1px solid rgba(255,255,255,.12);background:linear-gradient(145deg,rgba(255,255,255,.04),rgba(255,255,255,.01));display:grid;place-items:center;overflow:hidden}
.home-global__map{position:relative;width:82%;height:72%;background:linear-gradient(rgba(255,255,255,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px);background-size:42px 42px}
.home-global__hub{position:absolute;left:50%;top:54%;transform:translate(-50%,-50%);z-index:3;width:108px;height:108px;border-radius:50%;display:grid;place-items:center;text-align:center;background:var(--brava-primary);box-shadow:0 0 0 14px color-mix(in srgb,var(--brava-primary) 12%,transparent),0 0 70px color-mix(in srgb,var(--brava-primary) 40%,transparent);font-weight:900}
.home-global__hub small{display:block;font-size:.48rem;letter-spacing:.14em;opacity:.8}
.home-global__route{position:absolute;left:50%;top:54%;height:1px;transform-origin:left;background:linear-gradient(90deg,var(--brava-primary),rgba(255,255,255,.28));width:38%}
.home-global__route--one{transform:rotate(-38deg)}.home-global__route--two{transform:rotate(15deg)}.home-global__route--three{transform:rotate(158deg)}
.home-global__region{position:absolute;font-size:.62rem;letter-spacing:.12em;color:rgba(255,255,255,.55)}
.home-global__region--one{right:2%;top:24%}.home-global__region--two{left:2%;bottom:20%}.home-global__region--three{right:2%;bottom:12%}
.home-global__content .eyebrow{color:var(--brava-primary)}
.home-global__content h2{margin:.25em 0 .45em;font-size:clamp(2.7rem,5vw,5.6rem);line-height:.96;letter-spacing:-.045em;color:#fff}
[dir="rtl"] .home-global__content h2{letter-spacing:-.02em;line-height:1.08}
.home-global__content>p{font-size:1.05rem;line-height:1.9;color:rgba(255,255,255,.68)}
.home-global__list{list-style:none;padding:0;margin:32px 0;display:grid;gap:0}
.home-global__list li{padding:15px 0;border-bottom:1px solid rgba(255,255,255,.12);color:rgba(255,255,255,.86)}
.home-global__list li::before{content:"✓";color:var(--brava-primary);font-weight:900;margin-inline-end:13px}
.home-global .home-text-link{color:#fff}
@media(max-width:900px){.home-global__grid{grid-template-columns:1fr}.home-global__visual{min-height:360px}.home-why__grid{grid-template-columns:1fr}}
@media(max-width:600px){.home-why__card{min-height:0;padding:26px 22px;grid-template-columns:38px 1fr}.home-global__visual{min-height:300px}.home-global__hub{width:82px;height:82px}.home-global__content h2{font-size:clamp(2.5rem,12vw,3.7rem)}}

/* ==========================================================
   HOME 2.5.0 — FLAGSHIP DUO SHOWCASE
   Galaxy S26 Ultra + iPhone 17 Pro Max only
========================================================== */
.home-flagship-duo {
    position: relative;
    overflow: hidden;
    background:
        radial-gradient(circle at 8% 12%, color-mix(in srgb, var(--brava-primary) 9%, transparent), transparent 34%),
        linear-gradient(180deg, #fff 0%, #f7f8fa 100%);
}

.home-flagship-duo__heading {
    display: flex;
    justify-content: space-between;
    align-items: end;
    gap: clamp(28px, 5vw, 72px);
    margin-bottom: clamp(28px, 4vw, 50px);
}

.home-flagship-duo__heading > div { max-width: 760px; }
.home-flagship-duo__heading .eyebrow { margin: 0 0 10px; }
.home-flagship-duo__heading h2 {
    margin: 0;
    max-width: 760px;
    font-size: clamp(2.3rem, 5vw, 5rem);
    line-height: .98;
    letter-spacing: -.055em;
    color: var(--brava-text);
}
[dir="rtl"] .home-flagship-duo__heading h2 { line-height: 1.13; letter-spacing: -.02em; }
.home-flagship-duo__heading p:last-child {
    margin: 18px 0 0;
    max-width: 690px;
    color: var(--brava-muted, var(--brava-text-muted));
    font-size: clamp(.98rem, 1.4vw, 1.12rem);
    line-height: 1.85;
}

.home-flagship-duo__grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: clamp(18px, 2.6vw, 36px);
}

.home-flagship-card {
    position: relative;
    min-width: 0;
    overflow: hidden;
    border-radius: clamp(26px, 3vw, 40px);
    border: 1px solid rgba(20, 28, 34, .08);
    box-shadow: 0 24px 64px rgba(11, 20, 28, .10);
}
.home-flagship-card--dark {
    background: linear-gradient(155deg, #11181e 0%, #1b242b 56%, #11161b 100%);
    color: #fff;
}
.home-flagship-card--light {
    background: linear-gradient(155deg, #fff 0%, #f2f4f6 100%);
    color: #121a20;
}

.home-flagship-card__media {
    position: relative;
    display: grid;
    place-items: center;
    min-height: clamp(360px, 37vw, 570px);
    overflow: hidden;
    text-decoration: none;
}
.home-flagship-card__halo {
    position: absolute;
    width: 70%;
    aspect-ratio: 1;
    border-radius: 50%;
    background: radial-gradient(circle, color-mix(in srgb, var(--brava-primary) 34%, transparent) 0%, transparent 66%);
    filter: blur(12px);
    opacity: .78;
    transform: translateY(-2%);
}
.home-flagship-card--light .home-flagship-card__halo { opacity: .30; }
.home-flagship-card__image {
    position: relative;
    z-index: 1;
    display: block;
    width: auto;
    height: min(88%, 510px);
    max-width: 88%;
    object-fit: contain;
    filter: drop-shadow(0 26px 30px rgba(0,0,0,.22));
    transform: translateY(2%) scale(.98);
    transition: transform .55s cubic-bezier(.2,.8,.2,1);
}
.home-flagship-card:hover .home-flagship-card__image { transform: translateY(-1%) scale(1.035); }
.home-flagship-card__index {
    position: absolute;
    z-index: 2;
    inset-block-start: 24px;
    inset-inline-end: 26px;
    display: grid;
    place-items: center;
    width: 52px;
    height: 52px;
    border-radius: 17px;
    border: 1px solid rgba(255,255,255,.16);
    background: rgba(255,255,255,.10);
    color: rgba(255,255,255,.82);
    font-size: .72rem;
    font-weight: 800;
    backdrop-filter: blur(10px);
}
.home-flagship-card--light .home-flagship-card__index {
    border-color: rgba(11,20,28,.09);
    background: rgba(255,255,255,.72);
    color: var(--brava-primary);
}

.home-flagship-card__body { padding: clamp(22px, 3vw, 36px); }
.home-flagship-card__meta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 12px;
}
.home-flagship-card__brand {
    color: var(--brava-primary);
    font-size: .78rem;
    font-weight: 800;
    letter-spacing: .06em;
    text-transform: uppercase;
}
.home-flagship-card__availability {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    font-size: .78rem;
    opacity: .76;
}
.home-flagship-card__availability > span {
    width: 7px;
    height: 7px;
    border-radius: 999px;
    background: #35c98b;
    box-shadow: 0 0 0 4px rgba(53,201,139,.12);
}
.home-flagship-card h3 {
    margin: 0;
    font-size: clamp(2rem, 3.4vw, 3.7rem);
    line-height: 1.02;
    letter-spacing: -.05em;
}
[dir="rtl"] .home-flagship-card h3 { line-height: 1.14; letter-spacing: -.015em; }
.home-flagship-card h3 a { color: inherit; text-decoration: none; }
.home-flagship-card__actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    margin-top: clamp(24px, 3vw, 34px);
    padding-top: 22px;
    border-top: 1px solid rgba(255,255,255,.13);
}
.home-flagship-card--light .home-flagship-card__actions { border-color: rgba(17,26,32,.10); }
.home-flagship-card__details {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    color: inherit;
    font-weight: 700;
    text-decoration: none;
}
.home-flagship-card__details span:last-child { transition: transform .2s ease; }
[dir="rtl"] .home-flagship-card__details:hover span:last-child { transform: translateX(-4px); }
[dir="ltr"] .home-flagship-card__details:hover span:last-child { transform: translateX(4px); }
.home-flagship-card__quote {
    flex: 0 0 auto;
    min-height: 48px;
    border-radius: 999px;
}
.home-flagship-card--dark .home-flagship-card__quote {
    background: #fff;
    border-color: #fff;
    color: #11181e;
}

@media (max-width: 900px) {
    .home-flagship-duo__heading { align-items: start; flex-direction: column; }
    .home-flagship-duo__grid { grid-template-columns: 1fr; }
    .home-flagship-card__media { min-height: clamp(390px, 70vw, 560px); }
}

@media (max-width: 560px) {
    .home-flagship-duo__heading h2 { font-size: clamp(2.15rem, 11vw, 3.3rem); }
    .home-flagship-card { border-radius: 25px; }
    .home-flagship-card__media { min-height: 365px; }
    .home-flagship-card__image { max-width: 92%; height: 88%; }
    .home-flagship-card__body { padding: 22px; }
    .home-flagship-card__meta { align-items: flex-start; flex-direction: column; gap: 8px; }
    .home-flagship-card__actions { align-items: stretch; flex-direction: column; }
    .home-flagship-card__quote { width: 100%; }
}

@media (prefers-reduced-motion: reduce) {
    .home-flagship-card__image,
    .home-flagship-card__details span:last-child { transition: none; }
    .home-flagship-card:hover .home-flagship-card__image { transform: translateY(2%) scale(.98); }
}

/* Home 2.6.0 — dedicated flagship page cards */
.home-brand-card__model-mark{max-width:100%;flex-wrap:wrap}.home-brand-card__model-mark span{white-space:normal}.home-brand-card--samsung .home-brand-card__model-mark{border-color:rgba(255,255,255,.28);background:rgba(0,0,0,.12)}.home-brand-card--samsung .home-brand-card__model-mark span,.home-brand-card--samsung .home-brand-card__model-mark small{color:#fff}.home-brand-card--samsung .home-brand-card__model-mark small{border-color:rgba(255,255,255,.28)}


/* Marketing subtitle below flagship model name */
.home-brand-card__tagline {
    margin-top: clamp(18px, 2.2vw, 26px);
    font-size: clamp(1.35rem, 2.2vw, 2rem);
    line-height: 1.25;
    font-weight: 800;
    letter-spacing: -.025em;
    color: inherit;
}

[dir="rtl"] .home-brand-card__tagline {
    letter-spacing: 0;
}

.home-brand-card__tagline + p {
    margin-top: clamp(14px, 1.7vw, 20px);
}


/* Flagship card detail polish — 2.7.6 */
.home-brand-card__specs {
    position: relative;
    z-index: 2;
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: clamp(24px, 3vw, 34px);
}

.home-brand-card__specs span {
    display: inline-flex;
    align-items: center;
    min-height: 38px;
    padding: 7px 13px;
    border: 1px solid var(--brava-border);
    border-radius: 9px;
    background: color-mix(in srgb, var(--brava-background) 58%, transparent);
    color: var(--brava-text);
    font-size: clamp(.72rem, .9vw, .82rem);
    font-weight: 650;
    line-height: 1.25;
}

.home-brand-card--samsung .home-brand-card__specs span {
    border-color: rgba(255,255,255,.20);
    background: rgba(255,255,255,.07);
    color: #fff;
}

.home-brand-card__stars {
    position: relative;
    z-index: 2;
    margin-top: 18px;
    font-size: 1.05rem;
    line-height: 1;
    letter-spacing: .13em;
    color: currentColor;
    opacity: .86;
}

[dir="rtl"] .home-brand-card__stars {
    letter-spacing: .08em;
}

.home-brand-card__model-mark {
    width: fit-content;
    max-width: min(100%, 430px);
    margin-top: 18px;
    padding-inline: 16px;
    gap: 14px;
}

.home-brand-card__model-mark > span {
    flex: 0 1 auto;
}

.home-brand-card__explore {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    white-space: nowrap;
}

.home-brand-card__explore b {
    display: inline-block;
    font-size: 1rem;
    font-weight: 500;
    line-height: 1;
    transition: transform .22s ease;
}

.home-brand-card:hover .home-brand-card__explore b {
    transform: translateX(3px);
}

[dir="rtl"] .home-brand-card:hover .home-brand-card__explore b {
    transform: translateX(-3px);
}

@media (max-width: 560px) {
    .home-brand-card__specs { gap: 7px; }
    .home-brand-card__specs span { min-height: 34px; padding: 6px 10px; font-size: .69rem; }
    .home-brand-card__model-mark { max-width: 100%; }
}


/* ==========================================================
   BRAVA 2.9.1 — HERO STABILITY + MOBILE COMPOSITION
========================================================== */
/* Reserve three title lines for every typewriter phrase so text replacement
   never shifts the hero content or the rest of the page. */
.home-hero__title {
    min-block-size: 2.94em; /* 3 × desktop line-height (.98) */
}

[dir="rtl"] .home-hero__title {
    min-block-size: 3.36em; /* 3 × Arabic line-height (1.12) */
}

@media (max-width: 900px) {
    /* A portrait viewport otherwise shows the full vertical height of the
       panoramic artwork, including its intentionally dark upper band. Zooming
       the artwork slightly creates a stronger mobile crop without changing the
       source image used on desktop. */
    .home-hero__media img {
        animation: none;
        transform: scale(1.24);
        object-position: 64% 48%;
    }

    [dir="rtl"] .home-hero__media img {
        object-position: 36% 48%;
    }
}

@media (max-width: 680px) {
    .home-hero {
        min-height: 720px;
    }

    .home-hero__inner {
        align-items: center;
        padding-block: 44px;
    }

    .home-hero__brand {
        margin-bottom: 18px;
    }
}

/* ==========================================================
   BRAVA 2.9.3 — MOBILE EN TYPEWRITER STABILITY + HERO LIFT
========================================================== */
@media (max-width: 680px) {
    /* On narrow English viewports the longest phrase can otherwise grow to a
       fourth line while it is being typed. Keep the title box at exactly three
       lines and size English copy so the longest phrase fits that reservation. */
    html[lang="en"] .home-hero__title {
        font-size: clamp(2.08rem, 9.7vw, 3.2rem);
        line-height: 1.04;
        min-block-size: 0;
        block-size: 3.12em;
        max-block-size: 3.12em;
        overflow: hidden;
        text-wrap: balance;
    }

    /* Arabic already fits the three-line reservation; make that reservation
       fixed too, so no phrase can alter the vertical rhythm. */
    html[lang="ar"] .home-hero__title {
        min-block-size: 0;
        block-size: 3.36em;
        max-block-size: 3.36em;
        overflow: hidden;
    }

    /* Lift only the mobile hero content a little while preserving desktop and
       tablet composition. */
    .home-hero__content {
        transform: translateY(-24px);
    }
}

@media (max-width: 390px) {
    html[lang="en"] .home-hero__title {
        font-size: clamp(1.98rem, 9.3vw, 2.35rem);
    }

    .home-hero__content {
        transform: translateY(-18px);
    }
}


/* ==========================================================
   BRAVA 2.9.4 — FLAGSHIP BRAND CARDS
   Device-led palette with Brava accent continuity
========================================================== */
.home-brand-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: clamp(18px, 2vw, 28px);
}

.home-brand-card {
    min-height: clamp(540px, 47vw, 650px);
    padding: clamp(28px, 3.6vw, 48px);
    border-radius: clamp(26px, 2.6vw, 36px);
    box-shadow: 0 24px 70px rgba(10, 18, 32, .08);
}

.home-brand-card__header,
.home-brand-card__body,
.home-brand-card__specs,
.home-brand-card__stars,
.home-brand-card__model-mark {
    position: relative;
    z-index: 4;
}

.home-brand-card__body {
    max-width: 72%;
    margin-top: clamp(24px, 4vw, 46px);
}

.home-brand-card h3 {
    max-width: 9ch;
    font-size: clamp(3rem, 5.3vw, 5.6rem);
    line-height: .92;
}

.home-brand-card__tagline {
    max-width: 20ch;
}

.home-brand-card__tagline + p {
    max-width: 38rem;
}

.home-brand-card__device {
    position: absolute;
    z-index: 1;
    inset-inline-end: -12%;
    inset-block-end: -3%;
    width: 61%;
    height: 69%;
    object-fit: cover;
    object-position: center;
    border-radius: 34px 0 0 0;
    pointer-events: none;
    user-select: none;
    transition: transform .65s cubic-bezier(.2,.8,.2,1), opacity .4s ease;
}

[dir="rtl"] .home-brand-card__device {
    border-radius: 0 34px 0 0;
}

.home-brand-card:hover .home-brand-card__device {
    transform: translateY(-8px) scale(1.025);
}

.home-brand-card__specs,
.home-brand-card__stars,
.home-brand-card__model-mark {
    max-width: 74%;
}

/* Samsung: flagship navy with titanium warmth. Brava magenta is kept only
   as a small interaction accent so the product still feels like Samsung. */
.home-brand-card--samsung {
    color: #fff;
    border-color: rgba(70, 112, 172, .32);
    background:
        radial-gradient(circle at 18% 10%, rgba(67, 116, 190, .28), transparent 34%),
        radial-gradient(circle at 88% 84%, rgba(198, 171, 130, .15), transparent 36%),
        linear-gradient(145deg, #0b1e35 0%, #081525 52%, #050d17 100%);
}

.home-brand-card--samsung::before {
    content: "";
    position: absolute;
    z-index: 2;
    inset: 0;
    background: linear-gradient(90deg, rgba(5,13,23,.98) 0%, rgba(5,13,23,.88) 48%, rgba(5,13,23,.18) 78%, rgba(5,13,23,.05) 100%);
    pointer-events: none;
}

[dir="rtl"] .home-brand-card--samsung::before {
    background: linear-gradient(270deg, rgba(5,13,23,.98) 0%, rgba(5,13,23,.88) 48%, rgba(5,13,23,.18) 78%, rgba(5,13,23,.05) 100%);
}

.home-brand-card--samsung::after {
    color: rgba(107, 153, 222, .055);
    z-index: 2;
}

.home-brand-card--samsung .home-brand-card__device {
    opacity: .62;
    filter: saturate(.78) contrast(1.04);
}

.home-brand-card--samsung .home-brand-card__brand,
.home-brand-card--samsung .home-brand-card__number {
    color: #77a7ff;
    opacity: 1;
}

.home-brand-card--samsung .home-brand-card__tagline {
    color: #a9c5ff;
}

.home-brand-card--samsung .home-brand-card__arrow {
    color: #fff;
    border-color: rgba(255,255,255,.72);
    opacity: .9;
}

.home-brand-card--samsung:hover .home-brand-card__arrow {
    background: var(--brava-primary, #e5007d);
    border-color: var(--brava-primary, #e5007d);
}

.home-brand-card--samsung .home-brand-card__stars {
    color: #77a7ff;
    opacity: 1;
}

.home-brand-card--samsung .home-brand-card__model-mark {
    background: linear-gradient(90deg, rgba(56,111,255,.96), rgba(111,76,181,.92));
    border-color: transparent;
    box-shadow: 0 10px 30px rgba(42,83,180,.24);
}

.home-brand-card--samsung .home-brand-card__model-mark small {
    border-color: rgba(255,255,255,.28);
}

/* Apple: warm pearl / titanium inspired neutral, with the Brava magenta
   used as the unifying site accent instead of introducing a competing purple. */
.home-brand-card--apple {
    color: #111820;
    border-color: #dfe1e4;
    background:
        radial-gradient(circle at 82% 12%, rgba(229,0,125,.065), transparent 30%),
        linear-gradient(145deg, #ffffff 0%, #f7f6f4 58%, #efefee 100%);
}

.home-brand-card--apple::before {
    content: "";
    position: absolute;
    z-index: 2;
    inset: 0;
    background: linear-gradient(90deg, rgba(255,255,255,.99) 0%, rgba(255,255,255,.94) 48%, rgba(255,255,255,.40) 73%, rgba(255,255,255,.10) 100%);
    pointer-events: none;
}

[dir="rtl"] .home-brand-card--apple::before {
    background: linear-gradient(270deg, rgba(255,255,255,.99) 0%, rgba(255,255,255,.94) 48%, rgba(255,255,255,.40) 73%, rgba(255,255,255,.10) 100%);
}

.home-brand-card--apple .home-brand-card__device {
    opacity: .48;
    filter: saturate(.58) contrast(.96) brightness(1.08);
}

.home-brand-card--apple .home-brand-card__brand,
.home-brand-card--apple .home-brand-card__number,
.home-brand-card--apple .home-brand-card__tagline,
.home-brand-card--apple .home-brand-card__stars {
    color: var(--brava-primary, #e5007d);
    opacity: 1;
}

.home-brand-card--apple .home-brand-card__model-mark {
    border-color: color-mix(in srgb, var(--brava-primary, #e5007d) 26%, #d9dde0);
    background: rgba(255,255,255,.76);
    box-shadow: 0 10px 28px rgba(17,24,32,.06);
}

.home-brand-card--apple:hover .home-brand-card__arrow {
    color: #fff;
    background: var(--brava-primary, #e5007d);
    border-color: var(--brava-primary, #e5007d);
}

.home-brand-card--apple .home-brand-card__specs span {
    background: rgba(255,255,255,.68);
    border-color: #d7dadd;
}

@media (max-width: 1023px) {
    .home-brand-grid { grid-template-columns: 1fr; }
    .home-brand-card { min-height: 580px; }
    .home-brand-card__body,
    .home-brand-card__specs,
    .home-brand-card__stars,
    .home-brand-card__model-mark { max-width: 70%; }
}

@media (max-width: 640px) {
    .home-brand-card {
        min-height: 650px;
        padding: 28px 24px;
        border-radius: 26px;
    }

    .home-brand-card__body,
    .home-brand-card__specs,
    .home-brand-card__stars,
    .home-brand-card__model-mark {
        max-width: 100%;
    }

    .home-brand-card__body { margin-top: 26px; }
    .home-brand-card h3 { max-width: 100%; font-size: clamp(3rem, 14vw, 4.55rem); }
    .home-brand-card__tagline { font-size: 1.35rem; }
    .home-brand-card__tagline + p { font-size: .95rem; line-height: 1.7; }

    .home-brand-card__device {
        width: 78%;
        height: 45%;
        inset-inline-end: -18%;
        inset-block-end: 7%;
        opacity: .22 !important;
        border-radius: 28px 0 0 0;
    }

    [dir="rtl"] .home-brand-card__device { border-radius: 0 28px 0 0; }

    .home-brand-card--samsung::before {
        background: linear-gradient(180deg, rgba(5,13,23,.98) 0%, rgba(5,13,23,.94) 55%, rgba(5,13,23,.62) 100%);
    }
    [dir="rtl"] .home-brand-card--samsung::before {
        background: linear-gradient(180deg, rgba(5,13,23,.98) 0%, rgba(5,13,23,.94) 55%, rgba(5,13,23,.62) 100%);
    }
    .home-brand-card--apple::before,
    [dir="rtl"] .home-brand-card--apple::before {
        background: linear-gradient(180deg, rgba(255,255,255,.99) 0%, rgba(255,255,255,.96) 56%, rgba(255,255,255,.70) 100%);
    }

    .home-brand-card__specs {
        display: grid;
        grid-template-columns: repeat(2, minmax(0,1fr));
        margin-top: 20px;
    }
    .home-brand-card__specs span:last-child { grid-column: 1 / -1; }
    .home-brand-card__model-mark { position: relative; z-index: 5; }
}

@media (prefers-reduced-motion: reduce) {
    .home-brand-card__device { transition: none; }
    .home-brand-card:hover .home-brand-card__device { transform: none; }
}

/* ==========================================================
   BRAVA 2.9.5 — DEDICATED HOME CARD ART + SINGLE-ROW SPECS
========================================================== */
.home-brand-card__device--samsung,
.home-brand-card__device--apple {
    object-position: right center;
}

/* Keep the three specification pills on one row whenever possible.
   On very narrow screens the row remains intact and can scroll
   horizontally instead of forcing the third pill onto a second row. */
.home-brand-card__specs {
    display: flex;
    flex-wrap: nowrap;
    align-items: stretch;
    gap: 8px;
    overflow-x: auto;
    overflow-y: hidden;
    max-width: 100%;
    padding-bottom: 2px;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
}
.home-brand-card__specs::-webkit-scrollbar { display: none; }
.home-brand-card__specs span {
    flex: 0 0 auto;
    white-space: nowrap;
    min-width: 0;
}

@media (min-width: 641px) {
    .home-brand-card__specs {
        overflow-x: visible;
    }
    .home-brand-card__specs span {
        flex: 1 1 auto;
        text-align: center;
        padding-inline: clamp(9px, 1.05vw, 15px);
        font-size: clamp(.62rem, .72vw, .78rem);
    }
}

@media (max-width: 640px) {
    .home-brand-card__specs {
        display: flex;
        grid-template-columns: none;
        gap: 6px;
        margin-top: 20px;
    }
    .home-brand-card__specs span,
    .home-brand-card__specs span:last-child {
        grid-column: auto;
        min-height: 34px;
        padding: 6px 9px;
        font-size: clamp(.61rem, 2.7vw, .70rem);
    }

    /* Dedicated card artwork has its own composition; preserve the
       right-side device framing and let text remain readable above it. */
    .home-brand-card__device--samsung,
    .home-brand-card__device--apple {
        width: 84%;
        height: 46%;
        inset-inline-end: -15%;
        inset-block-end: 6%;
        object-position: right center;
    }
}

/* ==========================================================
   BRAVA 2.9.6 — MOBILE CARD ART VISIBILITY + NON-CLIPPED SPECS
========================================================== */
@media (max-width: 640px) {
    /* Keep all three feature pills visible inside the card. Each pill shares
       the available width and may wrap its own label to a second line, but
       the three pills themselves stay on a single row. */
    .home-brand-card__specs {
        display: flex;
        flex-wrap: nowrap;
        width: 100%;
        max-width: 100%;
        gap: 5px;
        overflow: visible;
        padding-bottom: 0;
    }

    .home-brand-card__specs span,
    .home-brand-card__specs span:last-child {
        flex: 1 1 0;
        min-width: 0;
        min-height: 36px;
        padding: 6px 5px;
        white-space: normal;
        overflow-wrap: anywhere;
        word-break: normal;
        justify-content: center;
        text-align: center;
        font-size: clamp(.54rem, 2.25vw, .64rem);
        line-height: 1.15;
    }

    /* The dedicated art was intentionally composed with the phones on the
       right. Show the artwork as a contained visual instead of cropping it,
       and raise its opacity so the phone remains clearly visible on mobile. */
    .home-brand-card__device--samsung,
    .home-brand-card__device--apple {
        width: 100%;
        height: 43%;
        inset-inline-end: -7%;
        inset-block-end: 3%;
        object-fit: contain;
        object-position: right bottom;
        border-radius: 0;
        opacity: .74 !important;
    }

    [dir="rtl"] .home-brand-card__device--samsung,
    [dir="rtl"] .home-brand-card__device--apple {
        object-position: left bottom;
    }

    /* Keep strong contrast behind copy, then open the lower part of each
       card so the device art is not buried by the mobile overlay. */
    .home-brand-card--samsung::before,
    [dir="rtl"] .home-brand-card--samsung::before {
        background: linear-gradient(
            180deg,
            rgba(5,13,23,.98) 0%,
            rgba(5,13,23,.94) 46%,
            rgba(5,13,23,.62) 63%,
            rgba(5,13,23,.20) 82%,
            rgba(5,13,23,.06) 100%
        );
    }

    .home-brand-card--apple::before,
    [dir="rtl"] .home-brand-card--apple::before {
        background: linear-gradient(
            180deg,
            rgba(255,255,255,.99) 0%,
            rgba(255,255,255,.96) 48%,
            rgba(255,255,255,.72) 65%,
            rgba(255,255,255,.28) 84%,
            rgba(255,255,255,.08) 100%
        );
    }

    .home-brand-card--samsung .home-brand-card__device {
        filter: saturate(.88) contrast(1.07);
    }

    .home-brand-card--apple .home-brand-card__device {
        filter: saturate(.72) contrast(1.01) brightness(1.03);
    }
}

@media (max-width: 360px) {
    .home-brand-card__specs { gap: 4px; }
    .home-brand-card__specs span,
    .home-brand-card__specs span:last-child {
        padding-inline: 4px;
        font-size: .52rem;
    }
}

/* ==========================================================
   BRAVA 2.9.10 — DESKTOP/TABLET TYPEWRITER STABILITY
   Keep an exact three-line title footprint on non-mobile widths too.
========================================================== */
@media (min-width: 681px) {
    .home-hero__title,
    .home-hero__title.is-typewriter {
        min-height: 0;
        min-block-size: 0;
        height: 2.94em;
        block-size: 2.94em;
        max-height: 2.94em;
        max-block-size: 2.94em;
        overflow: hidden;
    }

    html[lang="ar"] .home-hero__title,
    html[lang="ar"] .home-hero__title.is-typewriter {
        height: 3.36em;
        block-size: 3.36em;
        max-height: 3.36em;
        max-block-size: 3.36em;
    }
}

/* Intermediate desktop/tablet widths are the critical range: keep the
   longest English phrase inside the same three-line reservation. */
@media (min-width: 681px) and (max-width: 1180px) {
    html[lang="en"] .home-hero__title {
        font-size: clamp(2.7rem, 5.05vw, 4.45rem);
        letter-spacing: -.045em;
    }
}

/* ==========================================================
   BRAVA 2.9.14 — HOME HERO + SAMSUNG CARD VISUAL REFINEMENTS
========================================================== */
/* New corporate hero artwork is brighter near the header. A restrained
   top veil keeps the navigation visually integrated without hiding the art. */
.home-hero__overlay::after {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background: linear-gradient(
        180deg,
        rgba(2, 7, 13, .62) 0%,
        rgba(2, 7, 13, .30) 15%,
        rgba(2, 7, 13, .08) 31%,
        rgba(2, 7, 13, 0) 46%
    );
}

/* Let the dedicated Galaxy artwork read as an intentional background layer:
   larger, better centred, and softly blended into the navy card. */
.home-brand-card--samsung .home-brand-card__device {
    width: 70%;
    height: 78%;
    inset-inline-end: -8%;
    inset-block-end: -5%;
    object-fit: cover;
    object-position: 58% center;
    border-radius: 0;
    opacity: .72;
    filter: saturate(.92) contrast(1.07) brightness(.90);
    -webkit-mask-image: linear-gradient(90deg, transparent 0%, rgba(0,0,0,.38) 16%, #000 38%, #000 100%);
    mask-image: linear-gradient(90deg, transparent 0%, rgba(0,0,0,.38) 16%, #000 38%, #000 100%);
}
[dir="rtl"] .home-brand-card--samsung .home-brand-card__device {
    object-position: 42% center;
    -webkit-mask-image: linear-gradient(270deg, transparent 0%, rgba(0,0,0,.38) 16%, #000 38%, #000 100%);
    mask-image: linear-gradient(270deg, transparent 0%, rgba(0,0,0,.38) 16%, #000 38%, #000 100%);
}
.home-brand-card--samsung::before {
    background: linear-gradient(90deg, rgba(5,13,23,.99) 0%, rgba(5,13,23,.92) 43%, rgba(5,13,23,.48) 65%, rgba(5,13,23,.12) 100%);
}
[dir="rtl"] .home-brand-card--samsung::before {
    background: linear-gradient(270deg, rgba(5,13,23,.99) 0%, rgba(5,13,23,.92) 43%, rgba(5,13,23,.48) 65%, rgba(5,13,23,.12) 100%);
}

@media (max-width: 640px) {
    .home-brand-card--samsung .home-brand-card__device {
        width: 100%;
        height: 45%;
        inset-inline-end: -5%;
        inset-block-end: 2%;
        object-fit: contain;
        object-position: right bottom;
        opacity: .78 !important;
        -webkit-mask-image: linear-gradient(180deg, transparent 0%, rgba(0,0,0,.65) 18%, #000 42%, #000 100%);
        mask-image: linear-gradient(180deg, transparent 0%, rgba(0,0,0,.65) 18%, #000 42%, #000 100%);
    }
    [dir="rtl"] .home-brand-card--samsung .home-brand-card__device {
        object-position: left bottom;
        -webkit-mask-image: linear-gradient(180deg, transparent 0%, rgba(0,0,0,.65) 18%, #000 42%, #000 100%);
        mask-image: linear-gradient(180deg, transparent 0%, rgba(0,0,0,.65) 18%, #000 42%, #000 100%);
    }
}
nn/* ==========================================================\n   BRAVA 2.9.15 — CLEAN FLAGSHIP CARDS + CLEARER GALAXY ART\n========================================================== */n/* The feature-spec pills were removed from both flagship cards in markup.\n   Give the remaining rating/model CTA a little breathing room. */n.home-brand-card__body + .home-brand-card__stars {n    margin-top: clamp(28px, 3.5vw, 40px);n}nn/* Reveal more of the Galaxy artwork while preserving a strong reading zone\n   behind the copy. The fade now ends earlier and the artwork is brighter. */n.home-brand-card--samsung::before {n    background: linear-gradient(n        90deg,n        rgba(5,13,23,.96) 0%,n        rgba(5,13,23,.82) 35%,n        rgba(5,13,23,.40) 55%,n        rgba(5,13,23,.10) 72%,n        rgba(5,13,23,.02) 100%n    );n}n[dir="rtl"] .home-brand-card--samsung::before {n    background: linear-gradient(n        270deg,n        rgba(5,13,23,.96) 0%,n        rgba(5,13,23,.82) 35%,n        rgba(5,13,23,.40) 55%,n        rgba(5,13,23,.10) 72%,n        rgba(5,13,23,.02) 100%n    );n}n.home-brand-card--samsung .home-brand-card__device {n    opacity: .88;n    filter: saturate(1) contrast(1.04) brightness(1.04);n    object-position: 64% center;n}n[dir="rtl"] .home-brand-card--samsung .home-brand-card__device {n    object-position: 36% center;n}nn@media (max-width: 640px) {n    /* Keep the already-good mobile composition; only make the artwork a\n       touch clearer now that the specs row no longer occupies vertical space. */n    .home-brand-card--samsung .home-brand-card__device {n        opacity: .86 !important;n        filter: saturate(.96) contrast(1.05) brightness(1.02);n    }n    .home-brand-card--samsung::before,n    [dir="rtl"] .home-brand-card--samsung::before {n        background: linear-gradient(n            180deg,n            rgba(5,13,23,.97) 0%,n            rgba(5,13,23,.91) 43%,n            rgba(5,13,23,.48) 61%,n            rgba(5,13,23,.12) 79%,n            rgba(5,13,23,.02) 100%n        );n    }n}n
/* ==========================================================
   BRAVA 2.9.16 — BALANCED FLAGSHIP CARDS + MOBILE HERO ART
========================================================== */
/* Both flagship cards share a deliberate footprint rather than stretching
   to the height of the artwork. This keeps Samsung and Apple visually equal. */
.home-brand-card {
    min-height: 0;
    height: clamp(540px, 43vw, 620px);
}

/* Shift Samsung away from near-black into a restrained deep titanium-violet
   palette that matches the current Galaxy artwork but remains within Brava's
   dark corporate language. */
.home-brand-card--samsung {
    background:
        radial-gradient(circle at 82% 18%, rgba(151,135,214,.24), transparent 34%),
        radial-gradient(circle at 18% 10%, rgba(73,119,192,.18), transparent 35%),
        linear-gradient(145deg, #16182c 0%, #11182a 54%, #091321 100%);
    border-color: rgba(131,145,208,.30);
}

/* Desktop/tablet: let the device occupy more of the visual half of the card
   while protecting the reading area. */
.home-brand-card--samsung .home-brand-card__device {
    width: 69%;
    height: 76%;
    inset-inline-end: -4%;
    inset-block-end: -1%;
    object-fit: contain;
    object-position: 78% bottom;
    opacity: .96;
    filter: saturate(1.03) contrast(1.05) brightness(1.08) drop-shadow(0 16px 32px rgba(0,0,0,.26));
    -webkit-mask-image: linear-gradient(90deg, transparent 0%, rgba(0,0,0,.58) 16%, #000 34%, #000 100%);
    mask-image: linear-gradient(90deg, transparent 0%, rgba(0,0,0,.58) 16%, #000 34%, #000 100%);
}
[dir="rtl"] .home-brand-card--samsung .home-brand-card__device {
    object-position: 22% bottom;
    -webkit-mask-image: linear-gradient(270deg, transparent 0%, rgba(0,0,0,.58) 16%, #000 34%, #000 100%);
    mask-image: linear-gradient(270deg, transparent 0%, rgba(0,0,0,.58) 16%, #000 34%, #000 100%);
}

/* Reduce the dark reading veil; the phone now remains visibly comparable to
   the Apple card instead of disappearing behind the overlay. */
.home-brand-card--samsung::before {
    background: linear-gradient(90deg,
        rgba(9,14,28,.94) 0%,
        rgba(9,14,28,.80) 36%,
        rgba(9,14,28,.42) 56%,
        rgba(9,14,28,.11) 75%,
        rgba(9,14,28,0) 100%);
}
[dir="rtl"] .home-brand-card--samsung::before {
    background: linear-gradient(270deg,
        rgba(9,14,28,.94) 0%,
        rgba(9,14,28,.80) 36%,
        rgba(9,14,28,.42) 56%,
        rgba(9,14,28,.11) 75%,
        rgba(9,14,28,0) 100%);
}

@media (max-width: 1023px) {
    .home-brand-card {
        height: 570px;
    }
}

@media (max-width: 680px) {
    /* A portrait-specific hero asset is used on phones. It keeps Samsung,
       Apple and legacy Brava visible together instead of cropping the wide art. */
    .home-hero__media picture,
    .home-hero__media img {
        width: 100%;
        height: 100%;
        display: block;
    }
    .home-hero__media img {
        object-fit: cover;
        object-position: center top;
        transform: none;
        animation: none;
    }

    /* Compact cards to the actual content footprint. */
    .home-brand-card {
        height: 560px;
        min-height: 560px;
        padding: 26px 24px;
    }

    .home-brand-card__body {
        margin-top: 20px;
    }

    .home-brand-card h3 {
        font-size: clamp(2.75rem, 13.5vw, 4rem);
        line-height: .94;
    }

    .home-brand-card__tagline {
        font-size: 1.18rem;
    }

    .home-brand-card__tagline + p {
        margin-top: 18px;
        font-size: .92rem;
        line-height: 1.63;
    }

    .home-brand-card__body + .home-brand-card__stars {
        margin-top: 20px;
    }

    .home-brand-card__apple-mark {
        margin-top: 22px;
    }

    /* Samsung mobile composition: move the device upward and inward, use a
       horizontal fade rather than a heavy black top-to-bottom layer. */
    .home-brand-card--samsung .home-brand-card__device {
        width: 84%;
        height: 42%;
        inset-inline-end: -8%;
        inset-block-end: 1%;
        object-fit: contain;
        object-position: right bottom;
        opacity: .97 !important;
        filter: saturate(1.04) contrast(1.04) brightness(1.08) drop-shadow(0 12px 22px rgba(0,0,0,.24));
        -webkit-mask-image: linear-gradient(90deg, transparent 0%, rgba(0,0,0,.54) 14%, #000 29%, #000 100%);
        mask-image: linear-gradient(90deg, transparent 0%, rgba(0,0,0,.54) 14%, #000 29%, #000 100%);
    }
    [dir="rtl"] .home-brand-card--samsung .home-brand-card__device {
        inset-inline-end: -8%;
        object-position: left bottom;
        -webkit-mask-image: linear-gradient(270deg, transparent 0%, rgba(0,0,0,.54) 14%, #000 29%, #000 100%);
        mask-image: linear-gradient(270deg, transparent 0%, rgba(0,0,0,.54) 14%, #000 29%, #000 100%);
    }

    .home-brand-card--samsung::before,
    [dir="rtl"] .home-brand-card--samsung::before {
        background: linear-gradient(180deg,
            rgba(13,16,34,.91) 0%,
            rgba(13,16,34,.82) 44%,
            rgba(13,16,34,.38) 61%,
            rgba(13,16,34,.08) 78%,
            rgba(13,16,34,0) 100%);
    }
}

@media (max-width: 380px) {
    .home-brand-card {
        height: 545px;
        min-height: 545px;
        padding-inline: 21px;
    }
    .home-brand-card h3 {
        font-size: clamp(2.55rem, 13vw, 3.65rem);
    }
}

/* Brava Global 3.13.3 — official iPhone 17 Pro family card treatment.
   Kept at the end of the cascade so legacy card layers cannot fade it. */
.home-brand-card--apple{
    color:#fff;
    border-color:rgba(241,112,55,.28);
    background:
        radial-gradient(circle at 82% 24%,rgba(235,92,28,.26),transparent 32%),
        radial-gradient(circle at 18% 8%,rgba(229,0,125,.12),transparent 27%),
        linear-gradient(145deg,#160b08 0%,#090706 54%,#020202 100%);
    box-shadow:0 28px 76px rgba(19,8,4,.22);
}
.home-brand-card--apple::before{
    background:linear-gradient(90deg,rgba(12,7,5,.99) 0%,rgba(12,7,5,.94) 46%,rgba(12,7,5,.38) 70%,rgba(12,7,5,.04) 100%);
}
[dir="rtl"] .home-brand-card--apple::before{
    background:linear-gradient(270deg,rgba(12,7,5,.99) 0%,rgba(12,7,5,.94) 46%,rgba(12,7,5,.38) 70%,rgba(12,7,5,.04) 100%);
}
.home-brand-card--apple::after{color:rgba(245,116,57,.07)}
.home-brand-card--apple .home-brand-card__device{
    inset-inline-end:-6%;
    inset-block-end:0;
    width:68%;
    height:72%;
    opacity:.94;
    object-fit:cover;
    object-position:center;
    border-radius:38px 0 0 0;
    filter:saturate(1.08) contrast(1.04) brightness(.98);
    box-shadow:-20px 0 48px rgba(0,0,0,.20);
}
[dir="rtl"] .home-brand-card--apple .home-brand-card__device{border-radius:0 38px 0 0}
.home-brand-card--apple .home-brand-card__brand,
.home-brand-card--apple .home-brand-card__number,
.home-brand-card--apple .home-brand-card__tagline,
.home-brand-card--apple .home-brand-card__stars{color:#ff884f}
.home-brand-card--apple .home-brand-card__arrow{color:#fff;border-color:rgba(255,255,255,.62)}
.home-brand-card--apple .home-brand-card__model-mark{
    border-color:rgba(255,136,79,.42);
    background:linear-gradient(90deg,rgba(229,0,125,.88),rgba(202,72,39,.92));
    box-shadow:0 12px 30px rgba(121,21,55,.26);
}
.home-brand-card--apple .home-brand-card__model-mark span,
.home-brand-card--apple .home-brand-card__model-mark small{color:#fff}
.home-brand-card--apple .home-brand-card__model-mark small{border-color:rgba(255,255,255,.30)}
@media(max-width:640px){
    .home-brand-card--apple::before,
    [dir="rtl"] .home-brand-card--apple::before{
        background:linear-gradient(180deg,rgba(12,7,5,.99) 0%,rgba(12,7,5,.95) 55%,rgba(12,7,5,.46) 100%);
    }
    .home-brand-card--apple .home-brand-card__device,
    [dir="rtl"] .home-brand-card--apple .home-brand-card__device{
        width:88%;
        height:45%;
        inset-inline-end:-18%;
        inset-block-end:6%;
        object-fit:cover;
        object-position:center;
        opacity:.76!important;
        filter:saturate(1.06) contrast(1.03) brightness(.96);
    }
}
















@media (max-width: 1023px) {
    
    
}
@media (max-width: 640px) {
    
    
    
}












@media (max-width: 1023px) {
    
}
@media (max-width: 640px) {
    
    
    
}













@media (max-width: 1023px) {
    
}
@media (max-width: 640px) {
    
    
    
}






















@media (max-width: 1023px) {
    
    
    
}
@media (max-width: 640px) {
    
    
    
    
    
    
}



/* Full-bleed artwork: the source image extends beyond the clipping box so
   its own rounded outer corners can never appear as a separate rectangle. */




/* Same reading-zone logic used by the flagship cards. */





/* Match the first two cards' content rhythm while reserving the opposite
   side for the device lineup. */












@media (max-width: 1023px) {
    
    
    
    
}

@media (max-width: 640px) {
    
    
    
    
    
    
    
    
    
}















@media (max-width: 1279px) {
    
    
    
}
@media (max-width: 1023px) {
    
    
    
    
    
    
}
@media (max-width: 640px) {
    
    
    
    
}












@media (max-width: 1023px) {
    
}
@media (max-width: 640px) {
    
    
    
}



































@media (max-width: 1180px) {
    
    
    
}

@media (max-width: 1023px) {
    
    
    
    
    
    
    
    
}

@media (max-width: 640px) {
    
    
    
    
    
    
    
    
    
}

/* ==========================================================
   BRAVA 3.11.17 — WHOLESALE CARD / SHARED FLAGSHIP STRUCTURE
   Uses exactly the same card mechanics as Samsung and Apple.
   The wholesale image is a direct .home-brand-card__device.
========================================================== */
.home-brand-card--used-wholesale {
    --brava-wholesale-art-size: 78% auto;
    --brava-wholesale-art-position: calc(100% + 108px) calc(100% + 38px);
    --brava-wholesale-copy-width: 42%;
    grid-column: 1 / -1;
    color: #fff;
    border-color: rgba(181, 111, 255, .28);
    background-image:
        url("../images/home-wholesale-devices-showcase-bg.png"),
        radial-gradient(circle at 16% 10%, rgba(229, 0, 125, .10), transparent 34%),
        radial-gradient(circle at 88% 84%, rgba(120, 82, 210, .14), transparent 36%),
        linear-gradient(145deg, #24152f 0%, #171326 50%, #0c1420 100%);
    background-repeat: no-repeat, no-repeat, no-repeat, no-repeat;
    background-size: var(--brava-wholesale-art-size), auto, auto, auto;
    background-position: var(--brava-wholesale-art-position), 16% 10%, 88% 84%, 0 0;
}
[dir="rtl"] .home-brand-card--used-wholesale {
    background-position: calc(0% - 92px) calc(100% + 28px), 84% 10%, 12% 84%, 0 0;
}

/* Reading layer follows the same directional model as the Samsung card. */
.home-brand-card--used-wholesale::before {
    content: "";
    position: absolute;
    z-index: 2;
    inset: 0;
    pointer-events: none;
    background: linear-gradient(
        90deg,
        rgba(20,13,30,.988) 0%,
        rgba(20,13,30,.945) 35%,
        rgba(20,13,30,.68) 56%,
        rgba(20,13,30,.28) 76%,
        rgba(20,13,30,.08) 100%
    );
}
[dir="rtl"] .home-brand-card--used-wholesale::before {
    background: linear-gradient(
        270deg,
        rgba(20,13,30,.985) 0%,
        rgba(20,13,30,.92) 33%,
        rgba(20,13,30,.58) 54%,
        rgba(20,13,30,.20) 74%,
        rgba(20,13,30,.04) 100%
    );
}

.home-brand-card--used-wholesale::after {
    content: "";
    position: absolute;
    z-index: 2;
    inset: 0;
    pointer-events: none;
    background: radial-gradient(circle at 84% 76%, rgba(229,0,125,.06), transparent 24%);
}
[dir="rtl"] .home-brand-card--used-wholesale::after {
    background: radial-gradient(circle at 16% 76%, rgba(229,0,125,.06), transparent 24%);
}

.home-brand-card--used-wholesale .home-brand-card__device {
    display: none;
}

.home-brand-card--used-wholesale .home-brand-card__body {
    width: auto;
    max-width: var(--brava-wholesale-copy-width);
    text-align: start;
    position: relative;
    z-index: 3;
}
.home-brand-card--used-wholesale .home-brand-card__brand,
.home-brand-card--used-wholesale .home-brand-card__number,
.home-brand-card--used-wholesale .home-brand-card__stars {
    color: #d79cff;
    opacity: 1;
}
.home-brand-card--used-wholesale h3 {
    max-width: 9ch;
    color: #fff;
    text-align: start;
    text-shadow: 0 10px 26px rgba(0,0,0,.22);
}
[dir="rtl"] .home-brand-card--used-wholesale h3 {
    max-width: 8.5ch;
    font-size: clamp(2.9rem, 4.8vw, 5rem);
    line-height: .98;
}
.home-brand-card--used-wholesale .home-brand-card__tagline {
    max-width: 20ch;
    color: #d9b9ff;
    text-align: start;
    text-shadow: 0 8px 18px rgba(0,0,0,.22);
}
.home-brand-card--used-wholesale .home-brand-card__tagline + p {
    max-width: 34rem;
    color: rgba(255,255,255,.82);
    text-align: start;
    text-shadow: 0 8px 20px rgba(0,0,0,.24);
}

.home-brand-card--used-wholesale .home-brand-card__arrow {
    color: #fff;
    border-color: rgba(255,255,255,.72);
    opacity: .9;
}
.home-brand-card--used-wholesale:hover .home-brand-card__arrow {
    color: #fff;
    background: var(--brava-primary, #e5007d);
    border-color: var(--brava-primary, #e5007d);
}

.home-brand-card--used-wholesale .home-brand-card__model-mark {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    width: fit-content;
    max-width: 76%;
    margin-top: clamp(28px, 4vw, 42px);
    padding: 9px 14px;
    border: 1px solid transparent;
    border-radius: 999px;
    background: linear-gradient(90deg, rgba(128,88,206,.95), rgba(90,65,166,.92));
    box-shadow: 0 10px 30px rgba(73,53,138,.24);
    color: #fff;
    position: relative;
    z-index: 3;
}
.home-brand-card--used-wholesale .home-brand-card__model-mark > span {
    flex: 0 1 auto;
    font-size: .78rem;
    font-weight: 800;
    color: #fff;
}
.home-brand-card--used-wholesale .home-brand-card__model-mark small {
    display:inline-flex;
    align-items:center;
    gap:6px;
    margin-inline-start: 0;
    padding-inline-start: 12px;
    border: 0;
    border-inline-start: 1px solid rgba(255,255,255,.28);
    border-radius: 0;
    background: transparent;
    color: #fff;
}
.home-brand-card--used-wholesale .home-brand-card__stars {
    position: relative;
    z-index: 3;
    text-shadow: 0 8px 18px rgba(0,0,0,.24);
}

@media (min-width: 1181px) {
    .home-brand-card--used-wholesale {
        --brava-wholesale-art-size: 80% auto;
        --brava-wholesale-art-position: calc(100% + 126px) calc(100% + 42px);
        --brava-wholesale-copy-width: 42%;
    }
    [dir="rtl"] .home-brand-card--used-wholesale {
        background-position: calc(0% - 126px) calc(100% + 42px), 84% 10%, 12% 84%, 0 0;
    }
}

@media (min-width: 641px) and (max-width: 1180px) {
    .home-brand-card--used-wholesale {
        --brava-wholesale-art-size: 94% auto;
        --brava-wholesale-art-position: calc(100% + 154px) calc(100% + 46px);
        --brava-wholesale-copy-width: 50%;
    }
    [dir="rtl"] .home-brand-card--used-wholesale {
        background-position: calc(0% - 154px) calc(100% + 46px), 84% 10%, 12% 84%, 0 0;
    }
    .home-brand-card--used-wholesale .home-brand-card__tagline + p {
        max-width: 30rem;
    }
}

@media (max-width: 1023px) {
    .home-brand-card--used-wholesale {
        min-height: 610px;
        --brava-wholesale-copy-width: 56%;
        --brava-wholesale-art-size: 102% auto;
        --brava-wholesale-art-position: calc(100% + 146px) calc(100% + 44px);
    }
    [dir="rtl"] .home-brand-card--used-wholesale {
        background-position: calc(0% - 146px) calc(100% + 44px), 84% 10%, 12% 84%, 0 0;
    }
}

@media (max-width: 640px) {
    .home-brand-card--used-wholesale {
        grid-column: auto;
        min-height: 650px;
        --brava-wholesale-art-size: 144% auto;
        --brava-wholesale-art-position: 66% calc(100% + 54px);
        --brava-wholesale-copy-width: 100%;
    }
    [dir="rtl"] .home-brand-card--used-wholesale {
        background-position: 34% calc(100% + 54px), 84% 10%, 12% 84%, 0 0;
    }
    .home-brand-card--used-wholesale::before,
    [dir="rtl"] .home-brand-card--used-wholesale::before {
        background: linear-gradient(
            180deg,
            rgba(20,13,30,.996) 0%,
            rgba(20,13,30,.982) 48%,
            rgba(20,13,30,.88) 66%,
            rgba(20,13,30,.52) 82%,
            rgba(20,13,30,.16) 93%,
            rgba(20,13,30,.04) 100%
        );
    }
    .home-brand-card--used-wholesale .home-brand-card__body {
        max-width: 100%;
    }
    .home-brand-card--used-wholesale h3,
    [dir="rtl"] .home-brand-card--used-wholesale h3 {
        max-width: 100%;
        font-size: clamp(2.85rem, 12.6vw, 4.35rem);
        line-height: .98;
        text-shadow: 0 12px 30px rgba(0,0,0,.42);
    }
    .home-brand-card--used-wholesale .home-brand-card__tagline,
    .home-brand-card--used-wholesale .home-brand-card__tagline + p {
        max-width: 100%;
        text-shadow: 0 10px 24px rgba(0,0,0,.42);
    }
    .home-brand-card--used-wholesale .home-brand-card__tagline + p {
        color: rgba(255,255,255,.86);
    }
    .home-brand-card--used-wholesale .home-brand-card__model-mark {
        max-width: 100%;
        margin-top: 20px;
    }
}


/* ==========================================================
   BRAVA 3.11.18 — SHARED RESPONSIVE CARD TYPOGRAPHY
   One final sizing layer for Samsung, Apple and Wholesale.
========================================================== */
.home-brand-card h3 {
    font-size: clamp(2.8rem, 4.45vw, 5.15rem);
    line-height: .94;
}
[dir="rtl"] .home-brand-card h3 {
    font-size: clamp(2.65rem, 4.15vw, 4.85rem);
    line-height: .98;
}
.home-brand-card__tagline {
    font-size: clamp(1.12rem, 1.55vw, 1.48rem);
    line-height: 1.36;
}
.home-brand-card p {
    font-size: clamp(.92rem, 1.02vw, 1.06rem);
    line-height: 1.72;
}
@media (max-width: 1180px) {
    .home-brand-card h3 { font-size: clamp(2.6rem, 5vw, 4.45rem); }
    [dir="rtl"] .home-brand-card h3 { font-size: clamp(2.5rem, 4.7vw, 4.15rem); }
    .home-brand-card__tagline { font-size: clamp(1.08rem, 1.8vw, 1.32rem); }
}
@media (max-width: 680px) {
    .home-brand-card h3,
    [dir="rtl"] .home-brand-card h3 {
        font-size: clamp(2.45rem, 11.5vw, 3.75rem);
        line-height: .98;
    }
    .home-brand-card__tagline {
        font-size: clamp(1.02rem, 5.2vw, 1.2rem);
    }
    .home-brand-card p {
        font-size: clamp(.88rem, 3.8vw, .96rem);
        line-height: 1.65;
    }
}
@media (max-width: 380px) {
    .home-brand-card h3,
    [dir="rtl"] .home-brand-card h3 {
        font-size: clamp(2.2rem, 10.8vw, 3.25rem);
    }
}

/* Brava Global 3.13.4 — balanced section numbering */
.home-trust__item{gap:16px;align-items:flex-start}
.home-trust__number{
    flex:0 0 40px;
    width:40px;
    height:40px;
    display:grid;
    place-items:center;
    align-self:flex-start;
    margin-top:2px;
    border-radius:12px;
    background:linear-gradient(180deg, rgba(229,0,125,.14), rgba(229,0,125,.09));
    box-shadow:inset 0 1px 0 rgba(255,255,255,.42);
    font-size:.92rem;
    font-weight:900;
    letter-spacing:.02em;
    line-height:1;
}
.home-why__number{
    width:38px;
    height:38px;
    display:grid;
    place-items:center;
    border-radius:12px;
    background:var(--brava-primary-soft,#fce6f2);
    font-size:.84rem;
    font-weight:900;
    line-height:1;
}
.home-process__number{font-size:.90rem;letter-spacing:.025em}
.home-brand-card__number{font-size:.80rem;letter-spacing:.08em}
.home-flagship-card__index{font-size:.84rem}

/* Mobile-only artwork visibility: desktop and tablet stay unchanged. */
@media(max-width:640px){
    .home-brand-card--apple::before,
    [dir="rtl"] .home-brand-card--apple::before{
        background:linear-gradient(180deg,rgba(12,7,5,.98) 0%,rgba(12,7,5,.90) 42%,rgba(12,7,5,.50) 56%,rgba(12,7,5,.18) 69%,rgba(12,7,5,.03) 82%,transparent 100%);
    }
    .home-brand-card--apple .home-brand-card__device,
    [dir="rtl"] .home-brand-card--apple .home-brand-card__device{
        opacity:.94!important;
        filter:saturate(1.08) contrast(1.05) brightness(1.02);
    }
    .home-brand-card--used-wholesale::before,
    [dir="rtl"] .home-brand-card--used-wholesale::before{
        background:linear-gradient(180deg,rgba(20,13,30,.97) 0%,rgba(20,13,30,.89) 44%,rgba(20,13,30,.43) 61%,rgba(20,13,30,.11) 78%,transparent 92%);
    }
}


/* ==========================================================
   BRAVA 3.14.9 — MOBILE CARD CTA PILLS
   Keep the bottom model/action pill on one row across all three home cards.
========================================================== */
@media (max-width: 640px) {
    .home-brand-card .home-brand-card__model-mark {
        display: inline-flex;
        flex-wrap: nowrap;
        align-items: center;
        gap: 8px;
        width: fit-content;
        max-width: 100%;
        padding: 8px 11px;
    }
    .home-brand-card .home-brand-card__model-mark > span {
        flex: 0 0 auto;
        white-space: nowrap;
        font-size: .70rem;
        line-height: 1.2;
    }
    .home-brand-card .home-brand-card__model-mark small {
        flex: 0 0 auto;
        padding-inline-start: 8px;
        white-space: nowrap;
        font-size: .68rem;
        line-height: 1.2;
    }
    .home-brand-card .home-brand-card__explore {
        gap: 5px;
    }
    .home-brand-card .home-brand-card__explore b {
        font-size: .88rem;
    }
}

@media (max-width: 380px) {
    .home-brand-card .home-brand-card__model-mark {
        gap: 6px;
        padding: 7px 9px;
    }
    .home-brand-card .home-brand-card__model-mark > span {
        font-size: .66rem;
    }
    .home-brand-card .home-brand-card__model-mark small {
        padding-inline-start: 6px;
        font-size: .64rem;
    }
}

@media (max-width: 640px) {
    .home-brand-card.home-brand-card--used-wholesale .home-brand-card__model-mark {
        gap: 8px;
        padding: 8px 10px;
        background: linear-gradient(90deg, rgba(128,88,206,.96), rgba(90,65,166,.93));
        box-shadow: 0 12px 28px rgba(53,40,104,.28);
    }
    .home-brand-card.home-brand-card--used-wholesale .home-brand-card__model-mark > span {
        font-size: .68rem;
    }
    .home-brand-card.home-brand-card--used-wholesale .home-brand-card__model-mark small {
        padding: 0;
        padding-inline-start: 8px;
        font-size: .66rem;
        border-inline-start: 1px solid rgba(255,255,255,.28);
    }
}

@media (max-width: 380px) {
    .home-brand-card.home-brand-card--used-wholesale .home-brand-card__model-mark {
        gap: 7px;
        padding: 7px 9px;
    }
    .home-brand-card.home-brand-card--used-wholesale .home-brand-card__model-mark > span {
        font-size: .64rem;
    }
    .home-brand-card.home-brand-card--used-wholesale .home-brand-card__model-mark small {
        padding: 0;
        padding-inline-start: 7px;
        font-size: .62rem;
    }
}

@media (max-width: 640px) {
    .home-trust__item { padding: 22px 20px; }
    .home-trust__number { flex-basis: 38px; width: 38px; height: 38px; font-size: .88rem; }
}