/* =========================================================
   OMNITAP
   GLOBAL DESIGN SYSTEM
   ========================================================= */


/* =========================================================
   ROOT
   ========================================================= */

:root {

    --bg:
        #f7f7f4;

    --surface:
        #ffffff;

    --surface-soft:
        #f1f1ec;

    --surface-dark:
        #161719;

    --ink:
        #171715;

    --ink-soft:
        #343430;

    --muted:
        #77766f;

    --muted-light:
        #aaa9a3;

    --line:
        #e5e4dd;

    --line-dark:
        #d8d7d0;

    --accent:
        #315efb;

    --success:
        #26865d;

    --success-soft:
        #eef8f2;

    --warning:
        #b97a19;

    --warning-soft:
        #fff7e8;

    --danger:
        #bb3c43;

    --danger-soft:
        #fff0f1;

    --star:
        #d6a63b;


    --radius-xs:
        9px;

    --radius-sm:
        12px;

    --radius-md:
        17px;

    --radius-lg:
        24px;

    --radius-xl:
        30px;


    --shadow-sm:
        0 8px 24px
        rgba(30,30,26,.045);

    --shadow-md:
        0 18px 46px
        rgba(30,30,26,.07);

    --shadow-lg:
        0 28px 80px
        rgba(30,30,26,.11);

}


/* =========================================================
   RESET
   ========================================================= */

*,
*::before,
*::after {

    box-sizing:
        border-box;

}


html {

    scroll-behavior:
        smooth;

}


body {

    margin:0;

    min-height:
        100vh;

    background:
        var(--bg);

    color:
        var(--ink);

    font-family:
        'Cairo',
        sans-serif;

    line-height:
        1.65;

    -webkit-font-smoothing:
        antialiased;

    text-rendering:
        optimizeLegibility;

}


html[lang="en"] body {

    font-family:
        'Plus Jakarta Sans',
        sans-serif;

}


button,
input,
textarea,
select {

    font:
        inherit;

}


a {

    color:
        inherit;

}


img {

    max-width:
        100%;

}


/* =========================================================
   GLOBAL
   ========================================================= */

.container {

    width:
        min(
            1180px,
            calc(100% - 48px)
        );

    margin-inline:
        auto;

}


.narrow {

    width:
        min(
            640px,
            calc(100% - 40px)
        );

    margin-inline:
        auto;

}


.card {

    background:
        var(--surface);

    border:
        1px solid
        var(--line);

    border-radius:
        var(--radius-md);

    box-shadow:
        var(--shadow-sm);

}


.card-pad {

    padding:
        26px;

}


/* =========================================================
   GENERIC BRAND
   ========================================================= */

.brand {

    display:
        inline-flex;

    align-items:
        center;

    gap:
        10px;

    color:
        var(--ink);

    text-decoration:
        none;

    font-family:
        'Plus Jakarta Sans',
        'Cairo',
        sans-serif;

    font-size:
        17px;

    font-weight:
        800;

    letter-spacing:
        -.03em;

}


.brand-mark {

    width:
        34px;

    height:
        34px;

    display:
        grid;

    place-items:
        center;

    border-radius:
        10px;

    background:
        var(--surface-dark);

    color:
        #fff;

    font-family:
        'Plus Jakarta Sans',
        sans-serif;

    font-size:
        13px;

    font-weight:
        800;

}


/* =========================================================
   GENERIC BUTTONS
   ========================================================= */

.btn {

    min-height:
        44px;

    padding:
        0 18px;

    display:
        inline-flex;

    align-items:
        center;

    justify-content:
        center;

    gap:
        8px;

    border:
        1px solid
        transparent;

    border-radius:
        12px;

    background:
        transparent;

    color:
        var(--ink);

    text-decoration:
        none;

    cursor:
        pointer;

    font-size:
        13px;

    font-weight:
        700;

    transition:
        transform .18s ease,
        background .18s ease,
        border-color .18s ease;

}


.btn:hover {

    transform:
        translateY(-1px);

}


.btn-primary {

    background:
        var(--surface-dark);

    color:
        #fff;

}


.btn-primary:hover {

    background:
        #2a2b2e;

}


.btn-accent {

    background:
        var(--accent);

    color:
        #fff;

}


.btn-accent:hover {

    background:
        #244dd8;

}


.btn-light {

    background:
        #fff;

    border-color:
        var(--line);

}


.btn-light:hover {

    background:
        #fafaf8;

    border-color:
        var(--line-dark);

}


.btn-danger {

    background:
        var(--danger-soft);

    color:
        var(--danger);

    border-color:
        #f0ced1;

}


.btn-block {

    width:
        100%;

}


.btn-sm {

    min-height:
        39px;

    padding:
        0 13px;

    border-radius:
        10px;

    font-size:
        11px;

}


/* =========================================================
   FORMS
   ========================================================= */

.form-group {

    margin-bottom:
        18px;

}


.form-group label {

    display:
        block;

    margin-bottom:
        7px;

    font-size:
        12px;

    font-weight:
        700;

}


.input,
.textarea {

    width:
        100%;

    border:
        1px solid
        var(--line);

    outline:
        none;

    border-radius:
        13px;

    background:
        #fff;

    color:
        var(--ink);

    transition:
        border-color .18s ease,
        box-shadow .18s ease;

}


.input {

    min-height:
        48px;

    padding:
        0 14px;

}


.textarea {

    min-height:
        130px;

    padding:
        13px 14px;

    resize:
        vertical;

}


.input::placeholder,
.textarea::placeholder {

    color:
        #aeada7;

}


.input:focus,
.textarea:focus {

    border-color:
        #aaa9a2;

    box-shadow:
        0 0 0 4px
        rgba(20,20,18,.04);

}


/* =========================================================
   ALERTS
   ========================================================= */

.alert {

    margin-bottom:
        18px;

    padding:
        12px 14px;

    border-radius:
        12px;

    font-size:
        12px;

}


.alert-danger {

    background:
        var(--danger-soft);

    color:
        #a82e35;

    border:
        1px solid
        #f0d0d3;

}


.alert-success {

    background:
        var(--success-soft);

    color:
        var(--success);

    border:
        1px solid
        #d5ebe0;

}


/* =========================================================
   OLD / GENERIC NAV
   Used by Dashboard / Settings / Admin
   ========================================================= */

.site-nav {

    position:
        sticky;

    top:
        0;

    z-index:
        50;

    background:
        rgba(247,247,244,.88);

    backdrop-filter:
        blur(18px);

    border-bottom:
        1px solid
        rgba(229,228,221,.9);

}


.nav-inner {

    min-height:
        72px;

    display:
        flex;

    align-items:
        center;

    justify-content:
        space-between;

    gap:
        20px;

}


.nav-actions {

    display:
        flex;

    align-items:
        center;

    gap:
        9px;

}


/* =========================================================
   AUTH
   ========================================================= */

.auth-page {

    min-height:
        100vh;

    padding:
        24px;

    display:
        grid;

    place-items:
        center;

    background:
        radial-gradient(
            circle at 15% 10%,
            rgba(49,94,251,.055),
            transparent 31%
        ),
        var(--bg);

}


.auth-wrap {

    width:
        min(
            980px,
            100%
        );

    display:
        grid;

    grid-template-columns:
        .9fr 1.1fr;

    overflow:
        hidden;

    border:
        1px solid
        var(--line);

    border-radius:
        28px;

    background:
        #fff;

    box-shadow:
        var(--shadow-lg);

}


.auth-aside {

    position:
        relative;

    overflow:
        hidden;

    padding:
        44px;

    background:
        var(--surface-dark);

    color:
        #fff;

}


.auth-aside::after {

    content:
        '';

    position:
        absolute;

    width:
        320px;

    height:
        320px;

    inset-inline-start:
        -150px;

    bottom:
        -180px;

    border-radius:
        50%;

    background:
        rgba(49,94,251,.18);

    filter:
        blur(10px);

}


.auth-aside h2 {

    position:
        relative;

    z-index:
        1;

    margin:
        54px 0 12px;

    font-size:
        40px;

    line-height:
        1.12;

    letter-spacing:
        -.05em;

}


html[dir="rtl"] .auth-aside h2 {

    letter-spacing:
        -.02em;

}


.auth-aside p {

    position:
        relative;

    z-index:
        1;

    color:
        #b0b2b8;

}


.auth-list {

    position:
        relative;

    z-index:
        1;

    margin:
        28px 0 0;

    padding:
        0;

    display:
        grid;

    gap:
        12px;

    list-style:
        none;

}


.auth-list li {

    display:
        flex;

    gap:
        9px;

    color:
        #e4e5e7;

    font-size:
        13px;

}


.check {

    color:
        #8da7ff;

    font-weight:
        900;

}


.auth-card {

    padding:
        44px;

}


.auth-card h1 {

    margin:
        0 0 8px;

    font-size:
        31px;

    letter-spacing:
        -.04em;

}


.auth-card > p {

    margin:
        0 0 28px;

    color:
        var(--muted);

}


/* =========================================================
   DASHBOARD
   ========================================================= */

.dashboard-page {

    background:
        var(--bg);

}


.dashboard-nav {

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

}


.dashboard-main {

    padding:
        36px 0 64px;

}


.dash-head {

    margin-bottom:
        25px;

    display:
        flex;

    align-items:
        flex-end;

    justify-content:
        space-between;

    gap:
        18px;

}


.dash-head h1 {

    margin:
        0;

    font-size:
        35px;

    line-height:
        1.2;

    letter-spacing:
        -.04em;

}


html[dir="rtl"] .dash-head h1 {

    letter-spacing:
        -.02em;

}


.dash-head p {

    margin:
        5px 0 0;

    color:
        var(--muted);

}


.dash-actions {

    display:
        flex;

    flex-wrap:
        wrap;

    gap:
        8px;

}


.stat-grid {

    margin-bottom:
        18px;

    display:
        grid;

    grid-template-columns:
        repeat(3,1fr);

    gap:
        14px;

}


.stat-card {

    padding:
        21px;

}


.stat-label {

    color:
        var(--muted);

    font-size:
        11px;

}


.stat-value {

    margin-top:
        5px;

    font-family:
        'Plus Jakarta Sans',
        'Cairo',
        sans-serif;

    font-size:
        36px;

    font-weight:
        700;

    line-height:
        1.2;

    letter-spacing:
        -.04em;

}


.stat-meta {

    margin-top:
        8px;

    color:
        #96958f;

    font-size:
        10px;

}


.dash-grid {

    display:
        grid;

    grid-template-columns:
        320px 1fr;

    gap:
        18px;

    align-items:
        start;

}


.qr-card {

    position:
        sticky;

    top:
        96px;

    padding:
        22px;

    text-align:
        center;

}


.qr-card img {

    width:
        180px;

    height:
        180px;

    margin:
        15px auto;

    padding:
        9px;

    display:
        block;

    border:
        1px solid
        var(--line);

    border-radius:
        18px;

    background:
        #fff;

}


.qr-card h3 {

    margin:
        0 0 5px;

}


.qr-card p {

    margin:
        0 0 15px;

    color:
        var(--muted);

    font-size:
        11px;

}


.feedback-card {

    overflow:
        hidden;

}


.card-head {

    min-height:
        68px;

    padding:
        18px 21px;

    display:
        flex;

    align-items:
        center;

    justify-content:
        space-between;

    gap:
        12px;

    border-bottom:
        1px solid
        var(--line);

}


.card-head h2 {

    margin:
        0;

    font-size:
        16px;

}


.badge {

    min-width:
        28px;

    padding:
        4px 9px;

    display:
        inline-flex;

    align-items:
        center;

    justify-content:
        center;

    border-radius:
        999px;

    background:
        #efefea;

    color:
        #66655f;

    font-size:
        10px;

    font-weight:
        800;

}


.badge-red {

    background:
        var(--danger-soft);

    color:
        var(--danger);

}


.badge-amber {

    background:
        var(--warning-soft);

    color:
        var(--warning);

}


.table-wrap {

    overflow-x:
        auto;

}


table {

    width:
        100%;

    min-width:
        620px;

    border-collapse:
        collapse;

}


th {

    background:
        #fafaf8;

    color:
        #93928c;

    text-align:
        start;

    font-size:
        10px;

    font-weight:
        700;

}


th,
td {

    padding:
        14px 19px;

    border-bottom:
        1px solid
        #efeee9;

}


td {

    font-size:
        12px;

}


tr:last-child td {

    border-bottom:
        0;

}


.empty {

    padding:
        50px 20px;

    color:
        var(--muted);

    text-align:
        center;

}


.empty-icon {

    width:
        48px;

    height:
        48px;

    margin:
        0 auto 12px;

    display:
        grid;

    place-items:
        center;

    border-radius:
        14px;

    background:
        #efefea;

    color:
        #74736d;

    font-weight:
        900;

}


/* =========================================================
   SETTINGS
   ========================================================= */

.settings-main {

    padding:
        42px 0 72px;

}


.settings-card {

    max-width:
        720px;

    margin:
        0 auto;

}


.settings-head {

    margin-bottom:
        20px;

}


.settings-head h1 {

    margin:
        0;

    font-size:
        35px;

    letter-spacing:
        -.04em;

}


.settings-head p {

    margin:
        5px 0 0;

    color:
        var(--muted);

}


.section-divider {

    height:
        1px;

    margin:
        28px 0;

    background:
        var(--line);

}


.form-actions {

    margin-top:
        22px;

    display:
        flex;

    justify-content:
        flex-start;

    gap:
        9px;

}


.help-text {

    margin-top:
        7px;

    color:
        var(--muted);

    font-size:
        10px;

}


/* =========================================================
   OLD ERROR RESULT SUPPORT
   ========================================================= */

.result-page {

    min-height:
        100vh;

    padding:
        24px;

    display:
        grid;

    place-items:
        center;

    background:
        var(--bg);

}


.result-card {

    width:
        min(
            500px,
            100%
        );

    padding:
        38px;

    text-align:
        center;

}


.result-icon {

    width:
        66px;

    height:
        66px;

    margin:
        0 auto 18px;

    display:
        grid;

    place-items:
        center;

    border-radius:
        20px;

    background:
        var(--success-soft);

    color:
        var(--success);

    font-size:
        26px;

    font-weight:
        900;

}


.result-card h1 {

    margin:
        0 0 8px;

    font-size:
        28px;

}


.result-card p {

    margin:
        0 0 20px;

    color:
        var(--muted);

}


/* =========================================================
   =========================================================
   NEW PREMIUM LANDING PAGE
   =========================================================
   ========================================================= */

.landing-body {

    --pw-bg:
        #f7f7f4;

    --pw-surface:
        #ffffff;

    --pw-ink:
        #151515;

    --pw-muted:
        #6f6e69;

    --pw-line:
        #e5e4de;

    --pw-accent:
        #315efb;

    --pw-dark:
        #111214;

    background:
        var(--pw-bg);

    color:
        var(--pw-ink);

}


.landing-body .container {

    width:
        min(
            1180px,
            calc(100% - 48px)
        );

}


/* =========================================================
   LANDING NAV
   ========================================================= */

.pw-nav {

    position:
        sticky;

    top:
        0;

    z-index:
        100;

    background:
        rgba(247,247,244,.88);

    backdrop-filter:
        blur(18px);

    border-bottom:
        1px solid
        rgba(229,228,222,.82);

}


.pw-nav-inner {

    min-height:
        74px;

    display:
        grid;

    grid-template-columns:
        auto 1fr auto;

    align-items:
        center;

    gap:
        36px;

}


.pw-brand {

    display:
        inline-flex;

    align-items:
        center;

    gap:
        10px;

    color:
        var(--pw-ink);

    text-decoration:
        none;

    font-family:
        'Plus Jakarta Sans',
        'Cairo',
        sans-serif;

    font-size:
        16px;

    font-weight:
        700;

    letter-spacing:
        -.025em;

}


.pw-brand-mark {

    width:
        31px;

    height:
        31px;

    display:
        grid;

    place-items:
        center;

    border-radius:
        9px;

    background:
        var(--pw-dark);

    color:
        #fff;

    font-size:
        13px;

    font-weight:
        800;

}


.pw-nav-links {

    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    gap:
        30px;

}


.pw-nav-links a,
.pw-signin,
.pw-footer-links a {

    color:
        #565651;

    text-decoration:
        none;

    font-size:
        12px;

    font-weight:
        600;

    transition:
        color .18s ease;

}


.pw-nav-links a:hover,
.pw-signin:hover,
.pw-footer-links a:hover {

    color:
        var(--pw-ink);

}


.pw-nav-actions {

    display:
        flex;

    align-items:
        center;

    justify-content:
        flex-end;

    gap:
        14px;

}


.pw-language {

    padding:
        8px 2px;

    border:
        0;

    background:
        transparent;

    color:
        #565651;

    cursor:
        pointer;

    font-size:
        11px;

    font-weight:
        700;

}


/* =========================================================
   LANDING BUTTONS
   ========================================================= */

.pw-btn {

    min-height:
        46px;

    padding:
        0 20px;

    display:
        inline-flex;

    align-items:
        center;

    justify-content:
        center;

    border:
        1px solid
        transparent;

    border-radius:
        12px;

    text-decoration:
        none;

    font-size:
        12px;

    font-weight:
        700;

    transition:
        transform .18s ease,
        background .18s ease;

}


.pw-btn:hover {

    transform:
        translateY(-1px);

}


.pw-btn-dark {

    background:
        var(--pw-dark);

    color:
        #fff;

}


.pw-btn-dark:hover {

    background:
        #292a2d;

}


.pw-btn-light {

    background:
        #fff;

    color:
        var(--pw-dark);

}


/* =========================================================
   HERO
   ========================================================= */

.pw-hero {

    padding:
        104px 0 76px;

    overflow:
        hidden;

}


.pw-hero-copy {

    width:
        min(
            900px,
            100%
        );

    margin:
        0 auto;

    text-align:
        center;

}


.pw-kicker,
.pw-overline {

    display:
        inline-flex;

    align-items:
        center;

    gap:
        9px;

    color:
        #555550;

    font-size:
        11px;

    font-weight:
        700;

}


.pw-kicker-dot {

    width:
        7px;

    height:
        7px;

    border-radius:
        50%;

    background:
        var(--pw-accent);

    box-shadow:
        0 0 0 5px
        rgba(49,94,251,.08);

}


.pw-hero h1 {

    max-width:
        1000px;

    margin:
        24px auto 20px;

    font-size:
        clamp(
            48px,
            7vw,
            84px
        );

    line-height:
        1.02;

    letter-spacing:
        -.065em;

    font-weight:
        700;

}


html[dir="rtl"] .pw-hero h1 {

    letter-spacing:
        -.035em;

}


.pw-hero-copy > p {

    max-width:
        760px;

    margin:
        0 auto;

    color:
        var(--pw-muted);

    font-size:
        17px;

    line-height:
        1.9;

}


html[lang="en"]
.pw-hero-copy > p {

    line-height:
        1.7;

}


.pw-hero-actions {

    margin-top:
        30px;

    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    gap:
        20px;

    flex-wrap:
        wrap;

}


.pw-text-link {

    padding-bottom:
        2px;

    color:
        var(--pw-ink);

    border-bottom:
        1px solid
        #b9b8b2;

    text-decoration:
        none;

    font-size:
        12px;

    font-weight:
        700;

}


.pw-hero-note {

    margin-top:
        20px;

    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    gap:
        10px;

    color:
        #85847e;

    font-size:
        10px;

}


.pw-note-line {

    width:
        24px;

    height:
        1px;

    background:
        #c8c7c1;

}


/* =========================================================
   PRODUCT STAGE
   ========================================================= */

.pw-product-stage {

    margin-top:
        76px;

    overflow:
        hidden;

    border:
        1px solid
        var(--pw-line);

    border-radius:
        30px;

    background:
        #fff;

    box-shadow:
        0 22px 60px
        rgba(31,31,27,.08);

}


.pw-stage-bar {

    min-height:
        58px;

    padding:
        0 22px;

    display:
        flex;

    align-items:
        center;

    justify-content:
        space-between;

    gap:
        18px;

    border-bottom:
        1px solid
        var(--pw-line);

}


.pw-stage-brand,
.pw-stage-status {

    display:
        inline-flex;

    align-items:
        center;

    gap:
        9px;

    color:
        #6a6964;

    font-size:
        10px;

    font-weight:
        700;

}


.pw-stage-dot,
.pw-live-dot {

    width:
        7px;

    height:
        7px;

    border-radius:
        50%;

    background:
        #c4c3bd;

}


.pw-live-dot {

    background:
        #24a66a;

    box-shadow:
        0 0 0 5px
        rgba(36,166,106,.08);

}


.pw-stage-grid {

    min-height:
        560px;

    display:
        grid;

    grid-template-columns:
        1fr .78fr 1.12fr;

}


/* =========================================================
   TOUCHPOINT
   ========================================================= */

.pw-touchpoint-panel,
.pw-live-panel {

    padding:
        34px;

}


.pw-touchpoint-panel {

    display:
        flex;

    flex-direction:
        column;

    border-inline-end:
        1px solid
        var(--pw-line);

    background:
        #f8f8f5;

}


.pw-touchpoint-meta {

    display:
        grid;

    gap:
        3px;

}


.pw-touchpoint-meta span,
.pw-panel-head span,
.pw-dashboard-head small,
.pw-stat-grid small,
.pw-chart-copy small,
.pw-dashboard-bottom small,
.pw-mini-insight span {

    color:
        #8a8983;

    font-size:
        9px;

    font-weight:
        700;

}


.pw-touchpoint-meta strong {

    font-size:
        13px;

}


.pw-tap-card {

    width:
        min(
            280px,
            100%
        );

    min-height:
        310px;

    margin:
        44px auto 34px;

    padding:
        30px 26px;

    display:
        flex;

    flex-direction:
        column;

    align-items:
        center;

    justify-content:
        center;

    border-radius:
        28px;

    background:
        var(--pw-dark);

    color:
        #fff;

    text-align:
        center;

    box-shadow:
        0 24px 54px
        rgba(17,18,20,.18);

}


.pw-nfc-rings {

    position:
        relative;

    width:
        76px;

    height:
        76px;

    margin-bottom:
        26px;

}


.pw-nfc-rings i {

    position:
        absolute;

    border:
        2px solid
        rgba(255,255,255,.85);

    border-left-color:
        transparent;

    border-bottom-color:
        transparent;

    border-radius:
        50%;

    transform:
        rotate(45deg);

}


.pw-nfc-rings i:nth-child(1) {

    width:
        28px;

    height:
        28px;

    inset:
        24px;

}


.pw-nfc-rings i:nth-child(2) {

    width:
        48px;

    height:
        48px;

    inset:
        14px;

    opacity:
        .72;

}


.pw-nfc-rings i:nth-child(3) {

    width:
        68px;

    height:
        68px;

    inset:
        4px;

    opacity:
        .4;

}


.pw-tap-label {

    font-size:
        16px;

    font-weight:
        700;

}


.pw-tap-sub {

    margin-top:
        4px;

    color:
        #aaa;

    font-size:
        10px;

}


.pw-mini-qr {

    width:
        42px;

    height:
        42px;

    margin-top:
        20px;

    display:
        grid;

    grid-template-columns:
        repeat(3,1fr);

    gap:
        3px;

}


.pw-mini-qr span {

    border-radius:
        1px;

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

}


.pw-mini-qr span:nth-child(2),
.pw-mini-qr span:nth-child(4),
.pw-mini-qr span:nth-child(8) {

    opacity:
        .18;

}


.pw-use-cases {

    margin-top:
        auto;

    display:
        flex;

    flex-wrap:
        wrap;

    gap:
        8px;

}


.pw-use-cases span {

    padding:
        7px 10px;

    border:
        1px solid
        #dfded8;

    border-radius:
        999px;

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

    color:
        #73726c;

    font-size:
        9px;

    font-weight:
        700;

}


/* =========================================================
   PHONE
   ========================================================= */

.pw-phone-wrap {

    padding:
        32px 18px;

    display:
        grid;

    place-items:
        center;

    background:
        #edede8;

}


.pw-phone {

    width:
        min(
            290px,
            100%
        );

    min-height:
        470px;

    overflow:
        hidden;

    border:
        7px solid
        #17181a;

    border-radius:
        34px;

    background:
        #fbfbf8;

    box-shadow:
        0 24px 48px
        rgba(29,29,25,.16);

}


.pw-phone-top {

    position:
        relative;

    height:
        31px;

    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

}


.pw-phone-top span {

    position:
        absolute;

    top:
        0;

    width:
        82px;

    height:
        18px;

    border-radius:
        0 0 13px 13px;

    background:
        #17181a;

}


.pw-phone-top i {

    position:
        relative;

    z-index:
        2;

    width:
        6px;

    height:
        6px;

    margin-top:
        -16px;

    border-radius:
        50%;

    background:
        #393a3d;

}


.pw-phone-content {

    padding:
        26px 20px 22px;

}


.pw-phone-brand {

    margin-bottom:
        48px;

    color:
        #85847f;

    font-family:
        'Plus Jakarta Sans',
        sans-serif;

    font-size:
        10px;

    font-weight:
        800;

}


.pw-phone-eyebrow {

    margin-bottom:
        5px;

    color:
        #8a8983;

    font-size:
        9px;

}


.pw-phone h3 {

    margin:
        0 0 22px;

    font-size:
        21px;

    line-height:
        1.35;

}


.pw-phone-action {

    width:
        100%;

    min-height:
        53px;

    margin-top:
        9px;

    padding:
        0 14px;

    display:
        flex;

    align-items:
        center;

    justify-content:
        space-between;

    border:
        1px solid
        #e4e3dd;

    border-radius:
        13px;

    background:
        #fff;

    color:
        #2a2a28;

    font-size:
        10px;

    font-weight:
        700;

}


.pw-phone-action b {

    color:
        #8d8c87;

    font-family:
        sans-serif;

    font-size:
        14px;

}


/* =========================================================
   LIVE PANEL
   ========================================================= */

.pw-live-panel {

    display:
        flex;

    flex-direction:
        column;

    background:
        #fff;

}


.pw-panel-head {

    display:
        flex;

    align-items:
        center;

    justify-content:
        space-between;

    gap:
        20px;

}


.pw-panel-head > div {

    display:
        grid;

    gap:
        3px;

}


.pw-panel-head strong {

    font-size:
        14px;

}


.pw-live-pill {

    padding:
        6px 9px;

    border:
        1px solid
        #dce9e2;

    border-radius:
        999px;

    background:
        #f4fbf7;

    color:
        #27815b !important;

    font-size:
        8px !important;

}


.pw-activity-list {

    margin-top:
        34px;

    border-top:
        1px solid
        var(--pw-line);

}


.pw-activity-row {

    min-height:
        82px;

    display:
        grid;

    grid-template-columns:
        36px 1fr;

    align-items:
        center;

    gap:
        14px;

    border-bottom:
        1px solid
        var(--pw-line);

}


.pw-activity-icon {

    width:
        31px;

    height:
        31px;

    display:
        grid;

    place-items:
        center;

    border-radius:
        9px;

    background:
        #f2f2ee;

    color:
        #777670;

    font-family:
        'Plus Jakarta Sans',
        sans-serif;

    font-size:
        8px;

    font-weight:
        800;

}


.pw-activity-row div {

    display:
        grid;

    gap:
        4px;

}


.pw-activity-row strong {

    font-size:
        11px;

}


.pw-activity-row small {

    color:
        #989791;

    font-size:
        8px;

}


.pw-mini-insight {

    margin-top:
        auto;

    padding:
        18px;

    display:
        grid;

    gap:
        7px;

    border-radius:
        17px;

    background:
        #f6f6f2;

}


.pw-mini-insight strong {

    font-size:
        11px;

    line-height:
        1.7;

}


/* =========================================================
   SPACE STRIP
   ========================================================= */

.pw-space-strip {

    padding:
        28px 0 74px;

}


.pw-space-strip p {

    margin:
        0 0 20px;

    color:
        #85847e;

    text-align:
        center;

    font-size:
        10px;

    font-weight:
        700;

}


.pw-space-list {

    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    flex-wrap:
        wrap;

    gap:
        26px;

    color:
        #3d3d39;

}


.pw-space-list span {

    font-size:
        13px;

    font-weight:
        700;

}


/* =========================================================
   LANDING SECTIONS
   ========================================================= */

.pw-section {

    padding:
        124px 0;

    border-top:
        1px solid
        var(--pw-line);

}


.pw-section-soft {

    background:
        #f0f0eb;

}


.pw-split,
.pw-insight-grid,
.pw-language-grid {

    display:
        grid;

    grid-template-columns:
        .85fr 1.15fr;

    align-items:
        center;

    gap:
        90px;

}


.pw-section-copy h2,
.pw-section-heading h2,
.pw-final-cta h2 {

    margin:
        14px 0 18px;

    font-size:
        clamp(
            38px,
            5vw,
            62px
        );

    line-height:
        1.08;

    letter-spacing:
        -.055em;

}


html[dir="rtl"]
.pw-section-copy h2,

html[dir="rtl"]
.pw-section-heading h2,

html[dir="rtl"]
.pw-final-cta h2 {

    letter-spacing:
        -.025em;

}


.pw-section-copy p {

    max-width:
        600px;

    margin:
        0;

    color:
        var(--pw-muted);

    font-size:
        15px;

    line-height:
        1.9;

}


/* =========================================================
   MODULE LIST
   ========================================================= */

.pw-module-list {

    border-top:
        1px solid
        var(--pw-line);

}


.pw-module-row {

    min-height:
        74px;

    display:
        grid;

    grid-template-columns:
        48px 1fr auto;

    align-items:
        center;

    gap:
        18px;

    border-bottom:
        1px solid
        var(--pw-line);

}


.pw-module-row span {

    color:
        #999892;

    font-family:
        'Plus Jakarta Sans',
        sans-serif;

    font-size:
        9px;

    font-weight:
        700;

}


.pw-module-row strong {

    font-size:
        14px;

}


.pw-module-row i {

    color:
        #8b8a85;

    font-style:
        normal;

    font-size:
        15px;

}


.pw-module-row.muted {

    color:
        #777670;

}


/* =========================================================
   HOW IT WORKS
   ========================================================= */

.pw-section-heading {

    width:
        min(
            760px,
            100%
        );

    margin-bottom:
        66px;

}


.pw-flow {

    display:
        grid;

    grid-template-columns:
        1fr 70px 1fr 70px 1fr;

    align-items:
        start;

}


.pw-flow article {

    padding-inline-end:
        12px;

}


.pw-flow-number {

    width:
        39px;

    height:
        39px;

    display:
        grid;

    place-items:
        center;

    border:
        1px solid
        #d7d6d0;

    border-radius:
        50%;

    color:
        #777670;

    font-family:
        'Plus Jakarta Sans',
        sans-serif;

    font-size:
        8px;

    font-weight:
        800;

}


.pw-flow h3 {

    margin:
        24px 0 8px;

    font-size:
        18px;

}


.pw-flow p {

    margin:
        0;

    color:
        var(--pw-muted);

    font-size:
        12px;

    line-height:
        1.8;

}


.pw-flow-line {

    height:
        1px;

    margin-top:
        19px;

    background:
        #cecdc6;

}


/* =========================================================
   DASHBOARD PREVIEW
   ========================================================= */

.pw-dashboard-preview {

    overflow:
        hidden;

    border:
        1px solid
        var(--pw-line);

    border-radius:
        26px;

    background:
        #fff;

    box-shadow:
        0 18px 46px
        rgba(31,31,27,.06);

}


.pw-dashboard-head {

    min-height:
        76px;

    padding:
        0 22px;

    display:
        flex;

    align-items:
        center;

    justify-content:
        space-between;

    gap:
        18px;

    border-bottom:
        1px solid
        var(--pw-line);

}


.pw-dashboard-head > div {

    display:
        grid;

    gap:
        3px;

}


.pw-dashboard-head strong {

    font-size:
        13px;

}


.pw-dashboard-head > span {

    padding:
        7px 10px;

    border:
        1px solid
        var(--pw-line);

    border-radius:
        10px;

    color:
        #787772;

    font-size:
        8px;

    font-weight:
        700;

}


.pw-stat-grid {

    display:
        grid;

    grid-template-columns:
        repeat(3,1fr);

    border-bottom:
        1px solid
        var(--pw-line);

}


.pw-stat-grid > div {

    padding:
        22px;

    display:
        grid;

    gap:
        6px;

    border-inline-end:
        1px solid
        var(--pw-line);

}


.pw-stat-grid > div:last-child {

    border-inline-end:
        0;

}


.pw-stat-grid strong {

    font-family:
        'Plus Jakarta Sans',
        'Cairo',
        sans-serif;

    font-size:
        28px;

    letter-spacing:
        -.04em;

}


.pw-stat-grid span {

    color:
        #318564;

    font-size:
        8px;

    font-weight:
        700;

}


.pw-chart-area {

    padding:
        24px 22px 22px;

    border-bottom:
        1px solid
        var(--pw-line);

}


.pw-chart-copy {

    display:
        flex;

    align-items:
        flex-end;

    justify-content:
        space-between;

    gap:
        18px;

}


.pw-chart-copy strong {

    font-family:
        'Plus Jakarta Sans',
        sans-serif;

    font-size:
        23px;

}


.pw-chart-bars {

    height:
        150px;

    margin-top:
        22px;

    display:
        flex;

    align-items:
        flex-end;

    gap:
        8px;

}


.pw-chart-bars i {

    flex:
        1;

    min-width:
        5px;

    border-radius:
        5px 5px 2px 2px;

    background:
        #deddd7;

}


.pw-chart-bars i:nth-child(1) {
    height:24%;
}

.pw-chart-bars i:nth-child(2) {
    height:38%;
}

.pw-chart-bars i:nth-child(3) {
    height:31%;
}

.pw-chart-bars i:nth-child(4) {
    height:52%;
}

.pw-chart-bars i:nth-child(5) {
    height:47%;
}

.pw-chart-bars i:nth-child(6) {
    height:64%;
}

.pw-chart-bars i:nth-child(7) {
    height:58%;
    background:#bfc8f5;
}

.pw-chart-bars i:nth-child(8) {
    height:77%;
    background:var(--pw-accent);
}

.pw-chart-bars i:nth-child(9) {
    height:69%;
    background:#aebaf7;
}

.pw-chart-bars i:nth-child(10) {
    height:82%;
}

.pw-chart-bars i:nth-child(11) {
    height:71%;
}

.pw-chart-bars i:nth-child(12) {
    height:88%;
}


.pw-dashboard-bottom {

    display:
        grid;

    grid-template-columns:
        repeat(3,1fr);

}


.pw-dashboard-bottom > div {

    padding:
        18px 22px;

    display:
        grid;

    gap:
        5px;

    border-inline-end:
        1px solid
        var(--pw-line);

}


.pw-dashboard-bottom > div:last-child {

    border-inline-end:
        0;

}


.pw-dashboard-bottom strong {

    font-size:
        10px;

}


/* =========================================================
   BILINGUAL VISUAL
   ========================================================= */

.pw-language-section {

    background:
        #fafaf8;

}


.pw-language-grid {

    grid-template-columns:
        1.1fr .9fr;

}


.pw-language-preview {

    position:
        relative;

    min-height:
        490px;

}


.pw-language-card {

    position:
        absolute;

    width:
        min(
            360px,
            76%
        );

    min-height:
        330px;

    padding:
        30px;

    border:
        1px solid
        var(--pw-line);

    border-radius:
        28px;

    background:
        #fff;

    box-shadow:
        0 20px 50px
        rgba(31,31,27,.07);

}


.pw-language-card > span {

    color:
        #96958f;

    font-size:
        9px;

    font-weight:
        700;

}


.pw-language-card h3 {

    margin:
        52px 0 24px;

    font-size:
        24px;

    line-height:
        1.35;

}


.pw-language-card div {

    min-height:
        54px;

    margin-top:
        9px;

    padding:
        0 15px;

    display:
        flex;

    align-items:
        center;

    justify-content:
        space-between;

    border-radius:
        13px;

    background:
        #f5f5f1;

    font-size:
        10px;

    font-weight:
        700;

}


.pw-language-card b {

    color:
        #8a8984;

    font-family:
        sans-serif;

    font-weight:
        500;

}


.pw-language-card.is-ar {

    inset-inline-start:
        0;

    top:
        0;

    z-index:
        2;

    direction:
        rtl;

    font-family:
        'Cairo',
        sans-serif;

}


.pw-language-card.is-en {

    inset-inline-end:
        0;

    bottom:
        0;

    direction:
        ltr;

    border-color:
        #151618;

    background:
        #151618;

    color:
        #fff;

    font-family:
        'Plus Jakarta Sans',
        sans-serif;

}


.pw-language-card.is-en > span,
.pw-language-card.is-en b {

    color:
        #898b90;

}


.pw-language-card.is-en div {

    background:
        #232427;

}


/* =========================================================
   FINAL CTA
   ========================================================= */

.pw-final-cta {

    padding:
        34px 0 0;

    background:
        var(--pw-bg);

}


.pw-cta-inner {

    padding:
        92px 7vw;

    border-radius:
        30px 30px 0 0;

    background:
        var(--pw-dark);

    color:
        #fff;

    text-align:
        center;

}


.pw-overline-light {

    color:
        #97999e;

}


.pw-final-cta h2 {

    max-width:
        820px;

    margin-inline:
        auto;

}


.pw-final-cta p {

    max-width:
        650px;

    margin:
        0 auto 28px;

    color:
        #aaaeb4;

    font-size:
        14px;

    line-height:
        1.8;

}


/* =========================================================
   FOOTER
   ========================================================= */

.pw-footer {

    padding:
        54px 0 60px;

    border-top:
        1px solid
        #25262a;

    background:
        var(--pw-dark);

    color:
        #fff;

}


.pw-footer-grid {

    display:
        grid;

    grid-template-columns:
        1.4fr 1fr auto;

    align-items:
        flex-end;

    gap:
        40px;

}


.pw-footer-brand {

    color:
        #fff;

}


.pw-footer-brand
.pw-brand-mark {

    background:
        #fff;

    color:
        #151618;

}


.pw-footer p {

    max-width:
        370px;

    margin:
        16px 0 0;

    color:
        #85878d;

    font-size:
        10px;

}


.pw-footer-links {

    display:
        flex;

    flex-wrap:
        wrap;

    gap:
        12px 20px;

}


.pw-footer-links a {

    color:
        #a2a4a9;

}


.pw-footer-copy {

    color:
        #6d6f75;

    font-family:
        'Plus Jakarta Sans',
        sans-serif;

    font-size:
        9px;

}


/* =========================================================
   =========================================================
   CUSTOMER EXPERIENCE
   =========================================================
   ========================================================= */

.customer-experience-page,
.customer-review-page,
.customer-result-page {

    --cx-bg:
        #f6f6f2;

    --cx-surface:
        #ffffff;

    --cx-ink:
        #171715;

    --cx-muted:
        #77766f;

    --cx-line:
        #e5e4dd;

    --cx-soft:
        #efefe9;

    --cx-dark:
        #161719;

    --cx-star:
        #d7a83d;


    min-height:
        100svh;

    background:
        radial-gradient(
            circle at 50% -15%,
            rgba(255,255,255,.95),
            transparent 36%
        ),
        var(--cx-bg);

    color:
        var(--cx-ink);

}


.cx-shell {

    width:
        min(
            calc(100% - 32px),
            520px
        );

    min-height:
        100svh;

    margin-inline:
        auto;

    padding:
        22px 0 36px;

}


/* =========================================================
   CUSTOMER TOPBAR
   ========================================================= */

.cx-topbar {

    min-height:
        46px;

    display:
        flex;

    align-items:
        center;

    justify-content:
        space-between;

    gap:
        20px;

}


.cx-platform-brand {

    color:
        #77766f;

    text-decoration:
        none;

    font-family:
        'Plus Jakarta Sans',
        sans-serif;

    font-size:
        11px;

    font-weight:
        700;

    letter-spacing:
        -.02em;

}


.cx-language-button {

    min-width:
        48px;

    height:
        36px;

    padding:
        0 11px;

    border:
        1px solid
        var(--cx-line);

    border-radius:
        999px;

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

    color:
        var(--cx-ink);

    cursor:
        pointer;

    font-size:
        10px;

    font-weight:
        700;

    backdrop-filter:
        blur(10px);

}


/* =========================================================
   CUSTOMER BUSINESS
   ========================================================= */

.cx-business {

    margin-top:
        42px;

    display:
        flex;

    align-items:
        center;

    gap:
        16px;

}


.cx-business-logo {

    width:
        64px;

    height:
        64px;

    flex:
        0 0 64px;

    overflow:
        hidden;

    display:
        grid;

    place-items:
        center;

    border:
        1px solid
        var(--cx-line);

    border-radius:
        20px;

    background:
        #fff;

    box-shadow:
        0 12px 30px
        rgba(30,30,26,.05);

}


.cx-business-logo img {

    width:
        100%;

    height:
        100%;

    object-fit:
        cover;

}


.cx-business-logo span {

    font-size:
        23px;

    font-weight:
        800;

}


.cx-business-info {

    min-width:
        0;

}


.cx-eyebrow {

    display:
        block;

    color:
        var(--cx-muted);

    font-size:
        9px;

    font-weight:
        700;

}


.cx-business-info h1 {

    margin:
        3px 0 1px;

    font-size:
        21px;

    line-height:
        1.3;

    letter-spacing:
        -.02em;

}


.cx-location-line {

    display:
        flex;

    align-items:
        center;

    gap:
        5px;

    color:
        var(--cx-muted);

    font-size:
        9px;

}


.cx-location-dot {

    color:
        #b5b4ae;

}


/* =========================================================
   CUSTOMER INTRO
   ========================================================= */

.cx-intro {

    margin-top:
        54px;

}


.cx-intro h2,
.cx-rating-heading h1,
.cx-result-card h1 {

    margin:
        0;

    color:
        var(--cx-ink);

    font-size:
        clamp(
            30px,
            8vw,
            40px
        );

    line-height:
        1.18;

    letter-spacing:
        -.04em;

}


html[dir="rtl"]
.cx-intro h2,

html[dir="rtl"]
.cx-rating-heading h1,

html[dir="rtl"]
.cx-result-card h1 {

    letter-spacing:
        -.02em;

}


.cx-intro p,
.cx-rating-heading p {

    margin:
        10px 0 0;

    color:
        var(--cx-muted);

    font-size:
        12px;

    line-height:
        1.8;

}


/* =========================================================
   CUSTOMER ACTIONS
   ========================================================= */

.cx-actions {

    margin-top:
        30px;

    display:
        grid;

    gap:
        10px;

}


.cx-action {

    min-height:
        86px;

    padding:
        14px 15px;

    display:
        grid;

    grid-template-columns:
        46px 1fr auto;

    align-items:
        center;

    gap:
        14px;

    border:
        1px solid
        var(--cx-line);

    border-radius:
        20px;

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

    color:
        var(--cx-ink);

    text-decoration:
        none;

    transition:
        transform .18s ease,
        border-color .18s ease,
        box-shadow .18s ease;

}


.cx-action:hover {

    transform:
        translateY(-2px);

    border-color:
        #d4d3cc;

    box-shadow:
        0 12px 32px
        rgba(32,32,28,.06);

}


.cx-action-primary {

    border-color:
        var(--cx-dark);

    background:
        var(--cx-dark);

    color:
        #fff;

    box-shadow:
        0 18px 34px
        rgba(22,23,25,.13);

}


.cx-action-icon {

    width:
        46px;

    height:
        46px;

    display:
        grid;

    place-items:
        center;

    border-radius:
        14px;

    background:
        var(--cx-soft);

    color:
        var(--cx-ink);

    font-family:
        'Plus Jakarta Sans',
        sans-serif;

    font-size:
        14px;

    font-weight:
        700;

}


.cx-action-primary
.cx-action-icon {

    background:
        #292a2d;

    color:
        #fff;

}


.cx-action-copy {

    min-width:
        0;

    display:
        grid;

    gap:
        3px;

}


.cx-action-copy strong {

    font-size:
        12px;

}


.cx-action-copy span {

    color:
        var(--cx-muted);

    font-size:
        8px;

    line-height:
        1.5;

}


.cx-action-primary
.cx-action-copy span {

    color:
        #aeb0b5;

}


.cx-action-arrow {

    color:
        #9b9a94;

    font-family:
        sans-serif;

    font-size:
        15px;

}


.cx-action-primary
.cx-action-arrow {

    color:
        #fff;

}


/* =========================================================
   TOUCHPOINT STATUS
   ========================================================= */

.cx-touchpoint-note {

    margin-top:
        22px;

    padding-top:
        20px;

    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    gap:
        8px;

    border-top:
        1px solid
        var(--cx-line);

    color:
        var(--cx-muted);

    font-size:
        8px;

}


.cx-status-dot {

    width:
        6px;

    height:
        6px;

    border-radius:
        50%;

    background:
        #3baa75;

    box-shadow:
        0 0 0 4px
        rgba(59,170,117,.09);

}


/* =========================================================
   CUSTOMER INFO CARD
   ========================================================= */

.cx-info-card {

    margin-top:
        34px;

    padding:
        20px;

    border:
        1px solid
        var(--cx-line);

    border-radius:
        20px;

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

}


.cx-info-top {

    display:
        grid;

    grid-template-columns:
        1fr 1fr;

    gap:
        20px;

}


.cx-info-top > div {

    display:
        grid;

    gap:
        4px;

}


.cx-info-top span {

    color:
        var(--cx-muted);

    font-size:
        8px;

}


.cx-info-top strong {

    font-size:
        11px;

}


.cx-info-card p {

    margin:
        20px 0 0;

    padding-top:
        17px;

    border-top:
        1px solid
        var(--cx-line);

    color:
        var(--cx-muted);

    font-size:
        9px;

    line-height:
        1.8;

}


/* =========================================================
   CUSTOMER FOOTER
   ========================================================= */

.cx-footer {

    margin-top:
        68px;

    display:
        flex;

    justify-content:
        center;

    gap:
        5px;

    color:
        #aaa9a3;

    font-size:
        8px;

}


.cx-footer strong {

    color:
        #777670;

    font-family:
        'Plus Jakarta Sans',
        sans-serif;

}


/* =========================================================
   REVIEW PAGE
   ========================================================= */

.cx-review-shell {

    padding-bottom:
        60px;

}


.cx-back {

    min-height:
        36px;

    display:
        inline-flex;

    align-items:
        center;

    gap:
        5px;

    color:
        var(--cx-muted);

    text-decoration:
        none;

    font-size:
        10px;

    font-weight:
        700;

}


.cx-back-icon {

    font-family:
        sans-serif;

    font-size:
        21px;

    line-height:
        1;

}


html[dir="rtl"]
.cx-back-icon {

    transform:
        scaleX(-1);

}


.cx-review-business {

    margin-top:
        38px;

    display:
        flex;

    align-items:
        center;

    gap:
        12px;

}


.cx-small-logo {

    width:
        46px;

    height:
        46px;

    flex-basis:
        46px;

    border-radius:
        15px;

}


.cx-small-logo span {

    font-size:
        17px;

}


.cx-review-business
> div:last-child {

    display:
        grid;

    gap:
        3px;

}


.cx-review-business strong {

    font-size:
        12px;

}


.cx-review-business
> div:last-child
> span {

    color:
        var(--cx-muted);

    font-size:
        8px;

}


.cx-rating-heading {

    margin-top:
        55px;

}


.cx-rating-heading h1 {

    margin-top:
        9px;

}


.cx-review-form {

    margin-top:
        30px;

}


/* =========================================================
   STARS
   ========================================================= */

.cx-rating-card {

    padding:
        32px 18px 22px;

    border:
        1px solid
        var(--cx-line);

    border-radius:
        24px;

    background:
        #fff;

    text-align:
        center;

    box-shadow:
        0 16px 40px
        rgba(32,32,28,.04);

}


.cx-stars {

    direction:
        ltr;

    display:
        flex;

    justify-content:
        center;

    gap:
        clamp(
            5px,
            2vw,
            11px
        );

}


.cx-stars input {

    position:
        absolute;

    opacity:
        0;

    pointer-events:
        none;

}


.cx-stars label {

    color:
        #deddd7;

    cursor:
        pointer;

    font-family:
        Arial,
        sans-serif;

    font-size:
        clamp(
            39px,
            11vw,
            52px
        );

    line-height:
        1;

    transition:
        color .15s ease,
        transform .15s ease;

}


.cx-stars label:hover {

    transform:
        translateY(-2px);

}


.cx-stars label.active {

    color:
        var(--cx-star);

}


.cx-rating-status {

    min-height:
        22px;

    margin-top:
        17px;

    color:
        var(--cx-muted);

    font-size:
        9px;

    font-weight:
        600;

}


/* =========================================================
   REVIEW COMMENT
   ========================================================= */

.cx-comment-section {

    margin-top:
        28px;

}


.cx-comment-section label {

    display:
        block;

    font-size:
        13px;

    font-weight:
        700;

}


.cx-comment-section p {

    margin:
        4px 0 12px;

    color:
        var(--cx-muted);

    font-size:
        9px;

}


.cx-comment-section textarea {

    width:
        100%;

    min-height:
        130px;

    padding:
        16px;

    resize:
        vertical;

    border:
        1px solid
        var(--cx-line);

    outline:
        none;

    border-radius:
        17px;

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

    color:
        var(--cx-ink);

    font:
        inherit;

    font-size:
        11px;

    line-height:
        1.8;

    transition:
        border-color .18s ease,
        box-shadow .18s ease;

}


.cx-comment-section textarea:focus {

    border-color:
        #aaa9a2;

    box-shadow:
        0 0 0 4px
        rgba(20,20,18,.04);

}


/* =========================================================
   CUSTOMER BUTTONS
   ========================================================= */

.cx-submit-button {

    width:
        100%;

    min-height:
        56px;

    margin-top:
        16px;

    padding:
        0 18px;

    display:
        flex;

    align-items:
        center;

    justify-content:
        space-between;

    border:
        0;

    border-radius:
        16px;

    background:
        var(--cx-dark);

    color:
        #fff;

    cursor:
        pointer;

    text-decoration:
        none;

    font:
        inherit;

    font-size:
        11px;

    font-weight:
        700;

    transition:
        transform .18s ease,
        background .18s ease;

}


.cx-submit-button:hover {

    transform:
        translateY(-1px);

    background:
        #292a2d;

}


.cx-privacy-note {

    max-width:
        380px;

    margin:
        14px auto 0;

    color:
        #aaa9a3;

    text-align:
        center;

    font-size:
        8px;

    line-height:
        1.7;

}


/* =========================================================
   RESULT PAGE
   ========================================================= */

.cx-result-shell {

    display:
        flex;

    flex-direction:
        column;

}


.cx-result-card {

    margin:
        auto 0;

    padding:
        54px 24px;

    border:
        1px solid
        var(--cx-line);

    border-radius:
        28px;

    background:
        #fff;

    text-align:
        center;

    box-shadow:
        0 20px 50px
        rgba(30,30,26,.05);

}


.cx-result-icon {

    width:
        62px;

    height:
        62px;

    margin:
        0 auto 24px;

    display:
        grid;

    place-items:
        center;

    border-radius:
        50%;

    background:
        #eff8f3;

    color:
        #29865d;

    font-family:
        'Plus Jakarta Sans',
        sans-serif;

    font-size:
        22px;

    font-weight:
        700;

}


.cx-result-card h1 {

    margin-top:
        10px;

    font-size:
        31px;

}


.cx-result-card > p {

    max-width:
        390px;

    margin:
        12px auto 0;

    color:
        var(--cx-muted);

    font-size:
        11px;

    line-height:
        1.8;

}


.cx-google-button {

    margin-top:
        30px;

}


.cx-secondary-button {

    min-height:
        50px;

    margin-top:
        9px;

    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    border:
        1px solid
        var(--cx-line);

    border-radius:
        16px;

    background:
        #fff;

    color:
        var(--cx-ink);

    text-decoration:
        none;

    font-size:
        10px;

    font-weight:
        700;

}


/* =========================================================
   GLOBAL REVEAL
   ========================================================= */

.reveal {

    opacity:
        0;

    transform:
        translateY(18px);

    transition:
        opacity .7s ease,
        transform .7s ease;

}


.reveal.is-visible {

    opacity:
        1;

    transform:
        translateY(0);

}


/* =========================================================
   RESPONSIVE — LARGE TABLET
   ========================================================= */

@media(max-width:1050px) {


    .pw-nav-inner {

        grid-template-columns:
            auto 1fr;

    }


    .pw-nav-links {

        display:
            none;

    }


    .pw-nav-actions {

        justify-self:
            end;

    }


    .pw-stage-grid {

        grid-template-columns:
            .9fr 1.1fr;

    }


    .pw-live-panel {

        grid-column:
            1 / -1;

        min-height:
            360px;

        border-top:
            1px solid
            var(--pw-line);

    }


    .pw-split,
    .pw-insight-grid,
    .pw-language-grid {

        gap:
            56px;

    }

}


/* =========================================================
   RESPONSIVE — TABLET
   ========================================================= */

@media(max-width:900px) {


    .auth-wrap {

        grid-template-columns:
            1fr;

    }


    .auth-aside {

        display:
            none;

    }


    .dash-grid {

        grid-template-columns:
            1fr;

    }


    .qr-card {

        position:
            static;

    }


    .stat-grid {

        grid-template-columns:
            1fr;

    }

}


/* =========================================================
   RESPONSIVE — MOBILE
   ========================================================= */

@media(max-width:800px) {


    .container,
    .landing-body .container {

        width:
            min(
                calc(100% - 28px),
                1180px
            );

    }


    .pw-nav-inner {

        min-height:
            68px;

        gap:
            16px;

    }


    .pw-signin {

        display:
            inline-flex;

        align-items: center;
        justify-content: center;
        min-height: 44px;
        padding-inline: 12px;
        border: 1px solid var(--line);
        border-radius: 10px;
        white-space: nowrap;

    }


    .pw-nav-cta {

        min-height:
            40px;

        padding-inline:
            14px;

    }


    .pw-hero {

        padding:
            76px 0 58px;

    }


    .pw-hero h1 {

        font-size:
            clamp(
                43px,
                12vw,
                62px
            );

    }


    .pw-hero-copy > p {

        font-size:
            15px;

    }


    .pw-product-stage {

        margin-top:
            54px;

        border-radius:
            22px;

    }


    .pw-stage-grid {

        display:
            block;

    }


    .pw-touchpoint-panel,
    .pw-live-panel {

        padding:
            25px;

    }


    .pw-touchpoint-panel {

        border-inline-end:
            0;

        border-bottom:
            1px solid
            var(--pw-line);

    }


    .pw-phone-wrap {

        padding:
            36px 20px;

    }


    .pw-live-panel {

        min-height:
            430px;

    }


    .pw-section {

        padding:
            88px 0;

    }


    .pw-split,
    .pw-insight-grid,
    .pw-language-grid {

        grid-template-columns:
            1fr;

        gap:
            52px;

    }


    .pw-flow {

        grid-template-columns:
            1fr;

    }


    .pw-flow article {

        padding:
            0 0 34px;

    }


    .pw-flow-line {

        width:
            1px;

        height:
            36px;

        margin:
            -22px 0 12px 19px;

    }


    html[dir="rtl"]
    .pw-flow-line {

        margin-left:
            0;

        margin-right:
            19px;

    }


    .pw-language-preview {

        min-height:
            440px;

        order:
            2;

    }


    .pw-language-grid
    .pw-section-copy {

        order:
            1;

    }


    .pw-footer-grid {

        grid-template-columns:
            1fr;

        align-items:
            start;

    }


    .dash-head {

        display:
            block;

    }


    .dash-actions {

        margin-top:
            14px;

    }

}


/* =========================================================
   RESPONSIVE — SMALL MOBILE
   ========================================================= */

@media(max-width:560px) {


    .pw-brand > span:last-child {

        display:
            none;

    }


    .pw-language {

        font-size:
            10px;

    }


    .pw-nav-actions {

        gap:
            9px;

    }

    .pw-nav-inner {
        grid-template-columns: auto auto minmax(0, 1fr);
        gap: 8px 12px;
        padding-block: 10px;
    }
    .pw-nav-actions { display: contents; }
    .pw-signin { justify-self: end; }
    .pw-language { min-width: 44px; min-height: 44px; }
    .pw-nav-cta { grid-column: 1 / -1; width: 100%; min-height: 44px; }


    .pw-hero h1 {

        font-size:
            43px;

    }


    .pw-hero-actions {

        display:
            grid;

        grid-template-columns:
            1fr;

    }


    .pw-hero-actions
    .pw-btn {

        width:
            100%;

    }


    .pw-text-link {

        justify-self:
            center;

    }


    .pw-stage-bar {

        padding:
            0 16px;

    }


    .pw-space-list {

        gap:
            14px 18px;

    }


    .pw-space-list span {

        font-size:
            11px;

    }


    .pw-section-copy h2,
    .pw-section-heading h2,
    .pw-final-cta h2 {

        font-size:
            37px;

    }


    .pw-stat-grid,
    .pw-dashboard-bottom {

        grid-template-columns:
            1fr;

    }


    .pw-stat-grid > div,
    .pw-dashboard-bottom > div {

        border-inline-end:
            0;

        border-bottom:
            1px solid
            var(--pw-line);

    }


    .pw-language-preview {

        min-height:
            510px;

    }


    .pw-language-card {

        width:
            88%;

    }


    .pw-cta-inner {

        padding:
            70px 22px;

    }


    .auth-card {

        padding:
            28px 21px;

    }


    .cx-shell {

        width:
            calc(100% - 26px);

        padding-top:
            15px;

    }


    .cx-business {

        margin-top:
            32px;

    }


    .cx-intro {

        margin-top:
            44px;

    }


    .cx-action {

        min-height:
            82px;

    }


    .cx-rating-heading {

        margin-top:
            44px;

    }


    .cx-rating-card {

        padding-inline:
            10px;

    }

}


/* =========================================================
   REDUCED MOTION
   ========================================================= */

@media(prefers-reduced-motion:reduce) {


    * {

        scroll-behavior:
            auto !important;

    }


    .reveal {

        opacity:
            1;

        transform:
            none;

        transition:
            none;

    }

}
@media(max-width:560px){.auth-page{padding:16px;min-height:100svh}.auth-wrap,.auth-card{min-width:0}.auth-card .input{font-size:16px;min-height:48px}.auth-card .btn{min-height:48px}.auth-card h1{font-size:26px}}

/* Omnitap: approved monochrome identity. */
.omnitap-logo{display:block;width:72px;height:72px;object-fit:contain;border-radius:12px;flex-shrink:0;background:#000}
.brand,.pw-brand{flex-shrink:0}
:root{--accent:#171717;--green:#171717;--paper:#f6f6f6}
@media(max-width:560px){.omnitap-logo{width:56px;height:56px}.nav{padding:14px 16px;gap:12px}.nav .brand{gap:10px}.nav .brand span{padding-right:10px}.nav .actions{gap:12px}}
.auth-mobile-brand{display:none;margin-bottom:24px}@media(max-width:980px){.auth-mobile-brand{display:inline-block}}