/* Naje7 Elementor widgets v0.9.0 */
.n7-ew-courses {
    --n7-ew-primary: #0863d8;
    width: 100%;
    direction: rtl;
}

.n7-ew-courses__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 22px;
}

.n7-ew-courses__heading {
    margin: 0;
    color: #202733;
    font-size: clamp(22px, 2.5vw, 30px);
    font-weight: 800;
    line-height: 1.35;
}

.n7-ew-courses__grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 18px;
}

.n7-ew-course {
    min-width: 0;
    overflow: hidden;
    border: 1px solid #e4eaf2;
    border-radius: 16px;
    background: #fff;
    box-shadow: 0 8px 24px rgba(28, 47, 74, .07);
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

.n7-ew-course:hover {
    transform: translateY(-3px);
    border-color: #d5e2f5;
    box-shadow: 0 14px 34px rgba(28, 47, 74, .12);
}

.n7-ew-course__media {
    display: block;
    width: 100%;
    aspect-ratio: 16 / 9;
    overflow: hidden;
    background: #f1f4f8;
    text-decoration: none !important;
}

.n7-ew-course__media:empty::before {
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    background: linear-gradient(135deg, #eef4fb, #f8fafc);
}

.n7-ew-course__media img {
    display: block;
    width: 100% !important;
    height: 100% !important;
    max-width: none !important;
    object-fit: cover;
    transition: transform .3s ease;
}

.n7-ew-course:hover .n7-ew-course__media img {
    transform: scale(1.025);
}

.n7-ew-course__body {
    padding: 16px 17px 18px;
}

.n7-ew-course__title {
    display: block;
    color: #1f2937;
    font-size: 17px;
    font-weight: 800;
    line-height: 1.55;
    text-align: right;
    text-decoration: none !important;
    overflow-wrap: anywhere;
}

.n7-ew-course__title:hover {
    color: var(--n7-ew-primary) !important;
}

.n7-ew-course__teacher {
    display: flex;
    align-items: center;
    gap: 9px;
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid #eef1f5;
    color: #687386;
    font-size: 13px;
    line-height: 1.4;
    text-align: right;
}

.n7-ew-course__teacher-link {
    display: flex;
    align-items: center;
    gap: 9px;
    min-width: 0;
    color: inherit;
    text-decoration: none !important;
}

.n7-ew-course__teacher-link:hover .n7-ew-course__teacher-name,
.n7-ew-course__teacher-link:focus .n7-ew-course__teacher-name {
    color: var(--n7-ew-primary);
}

.n7-ew-course__teacher-avatar {
    width: 30px !important;
    height: 30px !important;
    min-width: 30px;
    border-radius: 50%;
    object-fit: cover;
    margin: 0 !important;
}

.n7-ew-course__teacher-text {
    min-width: 0;
}

.n7-ew-course__teacher-label {
    margin-left: 4px;
    color: #8a94a5;
}

.n7-ew-course__teacher-name {
    font-weight: 700;
    color: inherit;
}

.n7-ew-courses__footer {
    display: flex;
    justify-content: center;
    margin-top: 26px;
}

.n7-ew-courses__all {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 44px;
    padding: 10px 22px;
    border-radius: 9px;
    background: var(--n7-ew-primary);
    color: #fff !important;
    font-weight: 800;
    line-height: 1.35;
    text-decoration: none !important;
    transition: transform .18s ease, filter .18s ease;
}

.n7-ew-courses__all:hover {
    transform: translateY(-1px);
    filter: brightness(.94);
}

.n7-ew-courses__empty {
    padding: 16px;
    border: 1px dashed #cfd7e3;
    border-radius: 10px;
    color: #687386;
    text-align: center;
}

@media (max-width: 1024px) {
    .n7-ew-courses__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 767px) {
    .n7-ew-courses__header {
        margin-bottom: 16px;
    }
    .n7-ew-courses__grid {
        grid-template-columns: 1fr;
        gap: 14px;
    }
    .n7-ew-course {
        border-radius: 14px;
    }
    .n7-ew-course__body {
        padding: 14px 15px 16px;
    }
    .n7-ew-course__title {
        font-size: 16px;
    }
    .n7-ew-courses__footer {
        margin-top: 20px;
    }
    .n7-ew-courses__all {
        width: 100%;
    }
}

/* v0.9.2 — subscription CTA */
.n7-ew-subscription {
    --n7-ew-primary: #0863d8;
    display: grid;
    grid-template-columns: minmax(0, 1.35fr) minmax(280px, .65fr);
    gap: clamp(28px, 5vw, 64px);
    align-items: center;
    width: 100%;
    padding: 50px 54px;
    border: 1px solid #dce6f2;
    border-radius: 24px;
    background: #f6f9fd;
    box-shadow: 0 14px 38px rgba(31, 49, 75, .07);
    direction: rtl;
    overflow: hidden;
}
.n7-ew-subscription__content { min-width: 0; }
.n7-ew-subscription__eyebrow,
.n7-ew-why__eyebrow {
    display: inline-flex;
    align-items: center;
    min-height: 30px;
    margin-bottom: 12px;
    padding: 5px 11px;
    border-radius: 999px;
    background: color-mix(in srgb, var(--n7-ew-primary) 10%, white);
    color: var(--n7-ew-primary);
    font-size: 13px;
    font-weight: 800;
}
.n7-ew-subscription__heading {
    max-width: 760px;
    margin: 0;
    color: #182231;
    font-size: clamp(28px, 3.5vw, 44px);
    font-weight: 900;
    line-height: 1.35;
}
.n7-ew-subscription__description {
    max-width: 760px;
    margin: 18px 0 0;
    color: #657184;
    font-size: 16px;
    line-height: 1.9;
}
.n7-ew-subscription__features {
    display: grid;
    gap: 11px;
    margin: 24px 0 0;
    padding: 0;
    list-style: none;
}
.n7-ew-subscription__features li {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    color: #313d4e;
    font-size: 15px;
    font-weight: 700;
    line-height: 1.65;
}
.n7-ew-subscription__check {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    min-width: 24px;
    margin-top: 1px;
    border-radius: 50%;
    background: color-mix(in srgb, var(--n7-ew-primary) 11%, white);
    color: var(--n7-ew-primary);
    font-size: 13px;
    font-weight: 900;
}
.n7-ew-subscription__price-card {
    padding: 30px;
    border: 1px solid #e3e9f1;
    border-radius: 20px;
    background: #fff;
    box-shadow: 0 18px 50px rgba(31, 49, 75, .10);
    text-align: center;
}
.n7-ew-subscription__price-label {
    color: #263142;
    font-size: 17px;
    font-weight: 800;
}
.n7-ew-subscription__price-row {
    display: flex;
    align-items: flex-start;
    justify-content: center;
    gap: 5px;
    margin-top: 13px;
    color: #111827;
}
.n7-ew-subscription__price {
    font-size: clamp(44px, 5vw, 62px);
    font-weight: 900;
    line-height: 1;
    letter-spacing: -.02em;
}
.n7-ew-subscription__currency {
    padding-top: 6px;
    color: var(--n7-ew-primary);
    font-size: 24px;
    font-weight: 900;
}
.n7-ew-subscription__period {
    margin-top: 8px;
    color: #4b586b;
    font-size: 14px;
    font-weight: 700;
}
.n7-ew-subscription__price-note {
    margin-top: 14px;
    color: #7a8596;
    font-size: 13px;
    line-height: 1.65;
}
.n7-ew-subscription__button {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-height: 50px;
    margin-top: 24px;
    padding: 12px 20px;
    border-radius: 11px;
    background: var(--n7-ew-primary);
    color: #fff !important;
    font-size: 15px;
    font-weight: 900;
    text-decoration: none !important;
    transition: transform .18s ease, filter .18s ease, box-shadow .18s ease;
    box-shadow: 0 10px 24px color-mix(in srgb, var(--n7-ew-primary) 24%, transparent);
}
.n7-ew-subscription__button:hover {
    transform: translateY(-2px);
    filter: brightness(.95);
}
.n7-ew-subscription__activation-note {
    margin-top: 13px;
    color: #7a8596;
    font-size: 12px;
    line-height: 1.65;
}

/* v0.9.2 — why Naje7 */
.n7-ew-why {
    --n7-ew-primary: #0863d8;
    width: 100%;
    padding: clamp(36px, 5vw, 58px);
    border-radius: 24px;
    background: #f7f9fc;
    direction: rtl;
}
.n7-ew-why__header {
    max-width: 760px;
    margin: 0 auto 30px;
    text-align: center;
}
.n7-ew-why__heading {
    margin: 0;
    color: #182231;
    font-size: clamp(27px, 3vw, 38px);
    font-weight: 900;
    line-height: 1.4;
}
.n7-ew-why__description {
    margin: 13px auto 0;
    color: #6a7688;
    font-size: 15px;
    line-height: 1.85;
}
.n7-ew-why__grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 20px;
}
.n7-ew-why__card {
    position: relative;
    min-width: 0;
    padding: 28px 24px 27px;
    border: 1px solid #e5eaf1;
    border-radius: 18px;
    background: #fff;
    box-shadow: 0 10px 28px rgba(28, 47, 74, .06);
    text-align: right;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.n7-ew-why__card:hover {
    transform: translateY(-3px);
    border-color: #d5e2f5;
    box-shadow: 0 16px 36px rgba(28, 47, 74, .11);
}
.n7-ew-why__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 54px;
    height: 54px;
    margin-bottom: 19px;
    border-radius: 16px;
    background: color-mix(in srgb, var(--n7-ew-primary) 10%, white);
    color: var(--n7-ew-primary);
    font-size: 24px;
}
.n7-ew-why__icon svg { width: 25px; height: 25px; fill: currentColor; }
.n7-ew-why__card-title {
    margin: 0;
    color: #202b3a;
    font-size: 18px;
    font-weight: 900;
    line-height: 1.5;
}
.n7-ew-why__card-text {
    margin: 10px 0 0;
    color: #6c7788;
    font-size: 14px;
    line-height: 1.85;
}

@media (max-width: 1024px) {
    .n7-ew-subscription {
        grid-template-columns: minmax(0, 1fr) minmax(260px, .75fr);
        padding: 40px;
    }
    .n7-ew-why__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 767px) {
    .n7-ew-subscription {
        grid-template-columns: 1fr;
        gap: 28px;
        padding: 28px 20px;
        border-radius: 18px;
    }
    .n7-ew-subscription__heading { font-size: 28px; }
    .n7-ew-subscription__description { font-size: 15px; }
    .n7-ew-subscription__price-card { padding: 26px 20px; border-radius: 17px; }
    .n7-ew-why { padding: 30px 18px; border-radius: 18px; }
    .n7-ew-why__header { margin-bottom: 22px; }
    .n7-ew-why__grid { grid-template-columns: 1fr; gap: 14px; }
    .n7-ew-why__card { padding: 23px 20px; border-radius: 16px; }
}

/* v0.9.3 — Why Naje7 icon alignment */
.n7-ew-why--icon-center .n7-ew-why__card { text-align: center; }
.n7-ew-why--icon-center .n7-ew-why__icon { display: flex; margin-left: auto; margin-right: auto; }
.n7-ew-why--icon-right .n7-ew-why__card { text-align: right; }

/* v0.9.3 — teachers */
.n7-ew-teachers {
    --n7-ew-primary: #0863d8;
    width: 100%;
    padding: clamp(30px, 4vw, 52px);
    border-radius: 24px;
    background: #fff;
    direction: rtl;
}
.n7-ew-teachers__header,
.n7-ew-testimonials__header {
    max-width: 760px;
    margin: 0 auto 30px;
    text-align: center;
}
.n7-ew-teachers__eyebrow,
.n7-ew-testimonials__eyebrow {
    display: inline-flex;
    align-items: center;
    min-height: 30px;
    margin-bottom: 12px;
    padding: 5px 11px;
    border-radius: 999px;
    background: color-mix(in srgb, var(--n7-ew-primary) 10%, white);
    color: var(--n7-ew-primary);
    font-size: 13px;
    font-weight: 800;
}
.n7-ew-teachers__heading,
.n7-ew-testimonials__heading {
    margin: 0;
    color: #182231;
    font-size: clamp(27px, 3vw, 38px);
    font-weight: 900;
    line-height: 1.4;
}
.n7-ew-teachers__description,
.n7-ew-testimonials__description {
    margin: 13px auto 0;
    color: #6a7688;
    font-size: 15px;
    line-height: 1.85;
}
.n7-ew-teachers__grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 18px;
}
.n7-ew-teacher {
    min-width: 0;
    overflow: hidden;
    border: 1px solid #e5eaf1;
    border-radius: 18px;
    background: #fff;
    box-shadow: 0 10px 28px rgba(28, 47, 74, .06);
    text-align: center;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.n7-ew-teacher:hover {
    transform: translateY(-3px);
    border-color: #d5e2f5;
    box-shadow: 0 16px 36px rgba(28, 47, 74, .11);
}
.n7-ew-teacher__avatar-link {
    display: block;
    width: 100%;
    aspect-ratio: 4 / 3;
    overflow: hidden;
    background: #f0f3f7;
    text-decoration: none !important;
}
.n7-ew-teacher__avatar {
    display: block;
    width: 100% !important;
    height: 100% !important;
    max-width: none !important;
    object-fit: cover;
    object-position: center top;
    margin: 0 !important;
    transition: transform .3s ease;
}
.n7-ew-teacher:hover .n7-ew-teacher__avatar { transform: scale(1.025); }
.n7-ew-teacher__body { padding: 18px 16px 20px; }
.n7-ew-teacher__name {
    display: inline-block;
    color: #202b3a !important;
    font-size: 17px;
    font-weight: 900;
    line-height: 1.5;
    text-decoration: none !important;
}
.n7-ew-teacher__name:hover { color: var(--n7-ew-primary) !important; }
.n7-ew-teacher__bio {
    margin: 9px 0 0;
    color: #6c7788;
    font-size: 13px;
    line-height: 1.75;
}
.n7-ew-teachers__empty {
    padding: 16px;
    border: 1px dashed #cfd7e3;
    border-radius: 10px;
    color: #687386;
    text-align: center;
}

/* v0.9.3 — testimonials */
.n7-ew-testimonials {
    --n7-ew-primary: #0863d8;
    width: 100%;
    padding: clamp(36px, 5vw, 58px);
    border-radius: 24px;
    background: #f7f9fc;
    direction: rtl;
}
.n7-ew-testimonials__grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
}
.n7-ew-testimonial {
    position: relative;
    min-width: 0;
    padding: 26px 24px 24px;
    border: 1px solid #e5eaf1;
    border-radius: 18px;
    background: #fff;
    box-shadow: 0 10px 28px rgba(28, 47, 74, .06);
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.n7-ew-testimonial:hover {
    transform: translateY(-3px);
    border-color: #d5e2f5;
    box-shadow: 0 16px 36px rgba(28, 47, 74, .11);
}
.n7-ew-testimonial__quote {
    height: 34px;
    color: color-mix(in srgb, var(--n7-ew-primary) 74%, white);
    font-family: Georgia, serif;
    font-size: 46px;
    font-weight: 700;
    line-height: .9;
}
.n7-ew-testimonial__text {
    margin: 10px 0 0;
    color: #39475a;
    font-size: 15px;
    line-height: 1.9;
}
.n7-ew-testimonial__rating {
    display: flex;
    gap: 2px;
    margin-top: 17px;
    color: #f5a623;
    font-size: 15px;
    direction: ltr;
    justify-content: flex-end;
}
.n7-ew-testimonial__person {
    display: flex;
    align-items: center;
    gap: 11px;
    margin-top: 20px;
    padding-top: 18px;
    border-top: 1px solid #edf1f5;
}
.n7-ew-testimonial__avatar {
    width: 48px !important;
    height: 48px !important;
    min-width: 48px;
    border-radius: 50%;
    object-fit: cover;
    margin: 0 !important;
}
.n7-ew-testimonial__person-text { min-width: 0; text-align: right; }
.n7-ew-testimonial__name { color: #202b3a; font-size: 14px; font-weight: 900; line-height: 1.45; }
.n7-ew-testimonial__meta { margin-top: 3px; color: #8a94a5; font-size: 12px; line-height: 1.45; }

@media (max-width: 1024px) {
    .n7-ew-teachers__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .n7-ew-testimonials__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 767px) {
    .n7-ew-teachers,
    .n7-ew-testimonials { padding: 30px 18px; border-radius: 18px; }
    .n7-ew-teachers__header,
    .n7-ew-testimonials__header { margin-bottom: 22px; }
    .n7-ew-teachers__grid,
    .n7-ew-testimonials__grid { grid-template-columns: 1fr; gap: 14px; }
    .n7-ew-teacher,
    .n7-ew-testimonial { border-radius: 16px; }
    .n7-ew-teacher__avatar-link { aspect-ratio: 16 / 10; }
}

/* v0.9.4 — animated Naje7 hero */
.n7-ew-hero {
    --n7-hero-primary: #0863d8;
    --n7-hero-secondary: #12b8c4;
    position: relative;
    isolation: isolate;
    display: grid;
    grid-template-columns: minmax(0, 1.02fr) minmax(390px, .98fr);
    gap: clamp(38px, 6vw, 82px);
    align-items: center;
    min-height: 610px;
    width: 100%;
    padding: 64px 58px;
    overflow: hidden;
    border: 0;
    border-radius: 22px;
    background: #f4f8fe;
    box-shadow: none;
    direction: rtl;
}
.n7-ew-hero.n7-ew-hero--open {
    border: 0 !important;
    border-radius: var(--n7-hero-open-radius, 22px) !important;
    box-shadow: none !important;
}
.n7-ew-hero.n7-ew-hero--card {
    border: 1px solid #e3ecf8;
    box-shadow: 0 14px 38px rgba(31,49,75,.07);
}
.n7-ew-hero::before {
    content: "";
    position: absolute;
    z-index: -2;
    inset: 0;
    background:
        radial-gradient(circle at 84% 18%, color-mix(in srgb, var(--n7-hero-primary) 15%, transparent) 0, transparent 34%),
        radial-gradient(circle at 17% 85%, color-mix(in srgb, var(--n7-hero-secondary) 12%, transparent) 0, transparent 31%),
        linear-gradient(135deg, rgba(255,255,255,.9), rgba(244,248,254,.68));
}
.n7-ew-hero__orb {
    position: absolute;
    z-index: -1;
    border-radius: 999px;
    filter: blur(2px);
    pointer-events: none;
}
.n7-ew-hero__orb--one {
    width: 280px;
    height: 280px;
    top: -130px;
    left: -90px;
    background: color-mix(in srgb, var(--n7-hero-primary) 9%, transparent);
}
.n7-ew-hero__orb--two {
    width: 180px;
    height: 180px;
    right: 38%;
    bottom: -92px;
    background: color-mix(in srgb, var(--n7-hero-secondary) 10%, transparent);
}
.n7-ew-hero__content { position: relative; z-index: 3; min-width: 0; }
.n7-ew-hero__eyebrow {
    display: inline-flex;
    align-items: center;
    min-height: 32px;
    padding: 6px 12px;
    border: 1px solid color-mix(in srgb, var(--n7-hero-primary) 17%, white);
    border-radius: 999px;
    background: color-mix(in srgb, var(--n7-hero-primary) 8%, white);
    color: var(--n7-hero-primary);
    font-size: 13px;
    font-weight: 900;
}
.n7-ew-hero__heading {
    max-width: 720px;
    margin: 17px 0 0;
    color: #172235;
    font-size: clamp(38px, 5vw, 66px);
    font-weight: 950;
    line-height: 1.18;
    letter-spacing: -.025em;
}
.n7-ew-hero__rotator {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    min-height: 36px;
    margin-top: 20px;
    padding: 7px 13px;
    border: 1px solid #dae6f6;
    border-radius: 12px;
    background: rgba(255,255,255,.72);
    color: #26364b;
    box-shadow: 0 8px 24px rgba(31,49,75,.05);
    font-size: 14px;
    font-weight: 850;
    backdrop-filter: blur(10px);
}
.n7-ew-hero__rotator-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--n7-hero-secondary);
    box-shadow: 0 0 0 5px color-mix(in srgb, var(--n7-hero-secondary) 13%, transparent);
}
.n7-ew-hero__rotator-text { transition: opacity .18s ease, transform .18s ease; }
.n7-ew-hero__rotator-text.is-changing { opacity: 0; transform: translateY(5px); }
.n7-ew-hero__description {
    max-width: 700px;
    margin: 20px 0 0;
    color: #5f6f84;
    font-size: clamp(15px, 1.35vw, 17px);
    line-height: 1.95;
}
.n7-ew-hero__actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 30px; }
.n7-ew-hero__button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 50px;
    padding: 12px 24px;
    border-radius: 11px;
    font-size: 15px;
    font-weight: 900;
    line-height: 1.3;
    text-decoration: none !important;
    transition: transform .18s ease, box-shadow .18s ease, background .18s ease, color .18s ease;
}
.n7-ew-hero__button--primary {
    background: var(--n7-hero-primary);
    color: #fff !important;
    box-shadow: 0 12px 26px color-mix(in srgb, var(--n7-hero-primary) 24%, transparent);
}
.n7-ew-hero__button--primary:hover { color: #fff !important; transform: translateY(-2px); box-shadow: 0 16px 30px color-mix(in srgb, var(--n7-hero-primary) 31%, transparent); }
.n7-ew-hero__button--secondary {
    border: 1px solid #cfdced;
    background: rgba(255,255,255,.82);
    color: #26364b !important;
}
.n7-ew-hero__button--secondary:hover { color: var(--n7-hero-primary) !important; border-color: color-mix(in srgb, var(--n7-hero-primary) 35%, #cfdced); transform: translateY(-2px); }

.n7-ew-hero__visual {
    position: relative;
    z-index: 2;
    min-width: 0;
    min-height: 450px;
    perspective: 1200px;
}
.n7-ew-hero__visual-layer,
.n7-ew-hero__float-wrap {
    --n7-px: 0px;
    --n7-py: 0px;
    position: absolute;
    transform: translate3d(var(--n7-px), var(--n7-py), 0);
    transition: transform .18s ease-out;
    will-change: transform;
}
.n7-ew-hero__visual-layer { inset: 38px 28px 32px 20px; z-index: 2; }
.n7-ew-hero__device {
    height: 100%;
    overflow: hidden;
    border: 1px solid rgba(25,53,91,.14);
    border-radius: 24px;
    background: #fff;
    box-shadow: 0 28px 70px rgba(21,50,91,.19), 0 6px 20px rgba(21,50,91,.08);
    transform: rotateY(-5deg) rotateX(1deg);
}
.n7-ew-hero__device-bar {
    display: flex;
    align-items: center;
    gap: 6px;
    height: 42px;
    padding: 0 15px;
    border-bottom: 1px solid #e9eef5;
    background: #fbfcfe;
    direction: ltr;
}
.n7-ew-hero__device-bar span { width: 8px; height: 8px; border-radius: 50%; background: #d3dbe6; }
.n7-ew-hero__device-bar span:nth-child(1) { background: #ff7770; }
.n7-ew-hero__device-bar span:nth-child(2) { background: #f8c45b; }
.n7-ew-hero__device-bar span:nth-child(3) { background: #62c987; }
.n7-ew-hero__device-bar b { margin-left: 8px; color: #8a97aa; font-size: 10px; font-weight: 700; }
.n7-ew-hero__screen { height: calc(100% - 42px); overflow: hidden; background: linear-gradient(135deg, #eef6ff, #f9fbfe); }
.n7-ew-hero__screen > img { display: block; width: 100% !important; height: 100% !important; max-width: none !important; object-fit: cover; margin: 0 !important; }
.n7-ew-hero__demo { display: grid; grid-template-rows: auto minmax(160px, 1fr) auto; gap: 18px; height: 100%; padding: 30px; }
.n7-ew-hero__demo-top { display: flex; justify-content: space-between; gap: 18px; }
.n7-ew-hero__demo-top span { display: block; height: 13px; border-radius: 999px; background: #dce9f8; }
.n7-ew-hero__demo-top span:first-child { width: 44%; }
.n7-ew-hero__demo-top span:last-child { width: 22%; background: color-mix(in srgb, var(--n7-hero-primary) 20%, white); }
.n7-ew-hero__demo-video {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 220px;
    border-radius: 18px;
    background:
        radial-gradient(circle at 70% 30%, rgba(255,255,255,.18), transparent 28%),
        linear-gradient(135deg, var(--n7-hero-primary), #104b9b 70%);
    color: #fff;
    box-shadow: inset 0 0 0 1px rgba(255,255,255,.12);
}
.n7-ew-hero__demo-video i { display: flex; align-items: center; justify-content: center; width: 62px; height: 62px; border: 1px solid rgba(255,255,255,.4); border-radius: 50%; background: rgba(255,255,255,.13); font-size: 20px; backdrop-filter: blur(6px); }
.n7-ew-hero__demo-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.n7-ew-hero__demo-grid span { display: block; min-height: 54px; border: 1px solid #e2eaf4; border-radius: 12px; background: #fff; box-shadow: 0 7px 18px rgba(31,49,75,.05); }

.n7-ew-hero__floats { position: absolute; inset: 0; z-index: 4; pointer-events: none; }
.n7-ew-hero__float-wrap { z-index: 4; }
.n7-ew-hero__float-wrap--1 { top: 4%; right: -1%; }
.n7-ew-hero__float-wrap--2 { top: 31%; left: -5%; }
.n7-ew-hero__float-wrap--3 { right: 1%; bottom: 11%; }
.n7-ew-hero__float-wrap--4 { left: 5%; bottom: -1%; }
.n7-ew-hero__float-card {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    min-height: 46px;
    padding: 9px 13px;
    border: 1px solid rgba(205,219,238,.9);
    border-radius: 13px;
    background: rgba(255,255,255,.9);
    color: #2a3950;
    box-shadow: 0 14px 32px rgba(31,49,75,.12);
    font-size: 12px;
    font-weight: 850;
    white-space: nowrap;
    backdrop-filter: blur(12px);
}
.n7-ew-hero__float-icon { display: inline-flex; align-items: center; justify-content: center; width: 28px; height: 28px; border-radius: 9px; background: color-mix(in srgb, var(--n7-hero-primary) 10%, white); color: var(--n7-hero-primary); }
.n7-ew-hero__float-icon svg { width: 14px; height: 14px; fill: currentColor; }

.n7-ew-hero--motion .n7-ew-hero__float-wrap--1 .n7-ew-hero__float-card { animation: n7HeroFloatA 5.4s ease-in-out infinite; }
.n7-ew-hero--motion .n7-ew-hero__float-wrap--2 .n7-ew-hero__float-card { animation: n7HeroFloatB 6.2s ease-in-out -1.1s infinite; }
.n7-ew-hero--motion .n7-ew-hero__float-wrap--3 .n7-ew-hero__float-card { animation: n7HeroFloatA 5.8s ease-in-out -2s infinite; }
.n7-ew-hero--motion .n7-ew-hero__float-wrap--4 .n7-ew-hero__float-card { animation: n7HeroFloatB 6.5s ease-in-out -.6s infinite; }
.n7-ew-hero--motion .n7-ew-hero__orb--one { animation: n7HeroOrb 9s ease-in-out infinite alternate; }
.n7-ew-hero--motion .n7-ew-hero__orb--two { animation: n7HeroOrb 11s ease-in-out -2s infinite alternate-reverse; }
@keyframes n7HeroFloatA { 0%,100% { transform: translateY(0) rotate(0deg); } 50% { transform: translateY(-9px) rotate(-1deg); } }
@keyframes n7HeroFloatB { 0%,100% { transform: translateY(0) rotate(0deg); } 50% { transform: translateY(8px) rotate(1deg); } }
@keyframes n7HeroOrb { from { transform: translate3d(0,0,0) scale(1); } to { transform: translate3d(12px,-9px,0) scale(1.06); } }

@media (max-width: 1024px) {
    .n7-ew-hero { grid-template-columns: minmax(0, 1fr) minmax(330px, .9fr); gap: 34px; min-height: 560px; padding: 48px 38px; }
    .n7-ew-hero__heading { font-size: clamp(36px, 5vw, 52px); }
    .n7-ew-hero__visual { min-height: 390px; }
    .n7-ew-hero__visual-layer { inset: 35px 14px 26px 12px; }
    .n7-ew-hero__float-wrap--2 { left: -2%; }
}
@media (max-width: 767px) {
    .n7-ew-hero { grid-template-columns: 1fr; gap: 32px; min-height: 0; padding: 34px 20px 28px; border-radius: 20px; }
    .n7-ew-hero__content { text-align: center; }
    .n7-ew-hero__heading { margin-top: 14px; font-size: clamp(33px, 10vw, 44px); line-height: 1.22; }
    .n7-ew-hero__rotator { margin-top: 17px; }
    .n7-ew-hero__description { margin: 17px auto 0; font-size: 15px; }
    .n7-ew-hero__actions { justify-content: center; margin-top: 24px; }
    .n7-ew-hero__button { min-height: 48px; flex: 1 1 150px; max-width: 230px; }
    .n7-ew-hero__visual { min-height: 330px; }
    .n7-ew-hero__visual-layer { inset: 24px 12px 22px; }
    .n7-ew-hero__device { border-radius: 18px; transform: none; }
    .n7-ew-hero__device-bar { height: 36px; }
    .n7-ew-hero__screen { height: calc(100% - 36px); }
    .n7-ew-hero__demo { gap: 12px; padding: 20px; }
    .n7-ew-hero__demo-video { min-height: 160px; }
    .n7-ew-hero__float-card { min-height: 40px; padding: 7px 10px; font-size: 11px; }
    .n7-ew-hero__float-icon { width: 24px; height: 24px; }
    .n7-ew-hero__float-wrap--1 { top: 1%; right: 0; }
    .n7-ew-hero__float-wrap--2 { top: 37%; left: 0; }
    .n7-ew-hero__float-wrap--3 { right: 2%; bottom: 7%; }
    .n7-ew-hero__float-wrap--4 { display: none; }
}
@media (prefers-reduced-motion: reduce) {
    .n7-ew-hero *, .n7-ew-hero *::before, .n7-ew-hero *::after { animation: none !important; transition-duration: .01ms !important; }
}