/* ==========================================================================\n   Nawatej Plus — public landing devices + trust footer\n   NAFES trial package 1.0.1\n   ========================================================================== */

/* ---------- Hero device showcase ---------- */
.nw-public-device-hero{
    position:relative;
    min-width:0;
    padding:18px 8px 6px;
}
.nw-public-device-kicker{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    width:max-content;
    max-width:100%;
    margin:0 auto 14px;
    padding:8px 13px;
    border:1px solid rgba(255,255,255,.18);
    border-radius:999px;
    background:rgba(255,255,255,.08);
    color:#D8F5EE;
    font-size:12.5px;
    font-weight:700;
    line-height:1.4;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.08);
    backdrop-filter:blur(8px);
}
.nw-public-device-kicker-dot{
    width:7px;
    height:7px;
    border-radius:50%;
    background:#2FC7AA;
    box-shadow:0 0 0 5px rgba(47,199,170,.12);
    flex:0 0 auto;
}
.nw-public-device-stage{
    position:relative;
    min-height:470px;
    isolation:isolate;
}
.nw-public-device-glow{
    position:absolute;
    inset:15% 10% 3%;
    z-index:-2;
    border-radius:50%;
    background:radial-gradient(circle at 50% 50%,rgba(47,199,170,.28),rgba(46,134,208,.16) 42%,transparent 72%);
    filter:blur(12px);
}
.nw-public-laptop{
    position:absolute;
    inset-inline:4% 2%;
    inset-block-start:38px;
    z-index:2;
    padding:10px 10px 0;
    border:1px solid rgba(255,255,255,.18);
    border-radius:20px 20px 12px 12px;
    background:linear-gradient(145deg,#172A3B,#07131F);
    box-shadow:0 34px 70px rgba(0,0,0,.32),0 10px 24px rgba(0,0,0,.22),inset 0 1px 0 rgba(255,255,255,.14);
    transform:perspective(1200px) rotateY(-4deg) rotateX(1deg);
    transform-origin:center bottom;
}
.nw-public-laptop-camera{
    position:absolute;
    inset-block-start:4px;
    inset-inline-start:50%;
    width:5px;
    height:5px;
    margin-inline-start:-2.5px;
    border-radius:50%;
    background:#31465A;
    z-index:3;
}
.nw-public-laptop-screen{
    position:relative;
    aspect-ratio:16/9;
    overflow:hidden;
    border-radius:12px 12px 7px 7px;
    background:#F5F8FB;
    border:1px solid rgba(255,255,255,.08);
}
.nw-public-laptop-screen img,
.nw-public-tablet-screen img,
.nw-public-phone-screen img{
    width:100%;
    height:100%;
    object-fit:cover;
    object-position:center top;
}
.nw-public-laptop-base{
    position:absolute;
    inset-inline:-6% -6%;
    inset-block-end:-22px;
    height:22px;
    border-radius:3px 3px 14px 14px;
    background:linear-gradient(180deg,#D5DEE6,#8593A1 46%,#65727F);
    box-shadow:0 12px 18px rgba(0,0,0,.25);
}
.nw-public-laptop-base::after{
    content:"";
    position:absolute;
    inset-inline-start:50%;
    inset-block-start:0;
    width:18%;
    height:4px;
    transform:translateX(50%);
    border-radius:0 0 8px 8px;
    background:#AEB9C3;
}
html[dir="ltr"] .nw-public-laptop-base::after{transform:translateX(-50%)}

.nw-public-tablet{
    position:absolute;
    z-index:4;
    width:45%;
    aspect-ratio:16/10;
    inset-inline-start:-2%;
    inset-block-end:11px;
    padding:7px;
    border-radius:18px;
    background:linear-gradient(145deg,#1B2E3E,#07131F);
    border:1px solid rgba(255,255,255,.18);
    box-shadow:0 24px 50px rgba(0,0,0,.34),inset 0 1px 0 rgba(255,255,255,.12);
    transform:rotate(2deg);
}
.nw-public-tablet-camera{
    position:absolute;
    inset-inline-start:4px;
    inset-block-start:50%;
    width:4px;
    height:4px;
    margin-block-start:-2px;
    border-radius:50%;
    background:#405263;
    z-index:3;
}
.nw-public-tablet-screen{
    width:100%;
    height:100%;
    overflow:hidden;
    border-radius:12px;
    background:#F7F9FB;
}
.nw-public-tablet-screen img{
    object-position:center top;
    transform:scale(1.03);
    transform-origin:center top;
}

.nw-public-phone{
    position:absolute;
    z-index:6;
    width:18%;
    aspect-ratio:9/19;
    inset-inline-end:-1%;
    inset-block-end:-4px;
    padding:9px 6px 10px;
    border-radius:23px;
    background:linear-gradient(155deg,#172A3B,#03090E);
    border:1px solid rgba(255,255,255,.19);
    box-shadow:0 26px 48px rgba(0,0,0,.38),inset 0 1px 0 rgba(255,255,255,.12);
    transform:rotate(-3deg);
}
.nw-public-phone-speaker{
    position:absolute;
    inset-block-start:4px;
    inset-inline-start:50%;
    width:27%;
    height:3px;
    border-radius:99px;
    background:#405263;
    transform:translateX(50%);
    z-index:2;
}
html[dir="ltr"] .nw-public-phone-speaker{transform:translateX(-50%)}
.nw-public-phone-screen{
    width:100%;
    height:100%;
    overflow:hidden;
    border-radius:17px;
    background:#F7F9FB;
}
.nw-mobile-task-ui{
    width:100%;
    height:100%;
    padding:17px 8px 9px;
    background:linear-gradient(180deg,#F5F9FC 0%,#EEF5F8 100%);
    color:#0D2F4F;
    direction:rtl;
    text-align:right;
    font-family:var(--font-body);
}
.nw-mobile-task-top{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:5px;
    padding:4px 5px 7px;
    border-bottom:1px solid #DCE8EE;
}
.nw-mobile-task-brand{
    font-family:var(--font-display);
    font-size:6.8px;
    font-weight:900;
    color:#0D5B66;
}
.nw-mobile-task-dot{
    width:5px;
    height:5px;
    border-radius:50%;
    background:#19A889;
    box-shadow:0 0 0 3px rgba(25,168,137,.12);
}
.nw-mobile-task-heading{padding:9px 4px 6px}
.nw-mobile-task-heading strong{
    display:block;
    font-family:var(--font-display);
    font-size:8.5px;
    line-height:1.3;
}
.nw-mobile-task-heading small{
    display:block;
    margin-top:2px;
    color:#6D8494;
    font-size:5.6px;
}
.nw-mobile-task-tabs{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:2px;
    margin:2px 2px 7px;
    padding:2px;
    border-radius:7px;
    background:#E5EEF3;
}
.nw-mobile-task-tabs span{
    display:flex;
    align-items:center;
    justify-content:center;
    min-height:18px;
    padding:2px;
    border-radius:5px;
    color:#607989;
    font-size:4.7px;
    line-height:1.2;
    text-align:center;
}
.nw-mobile-task-tabs .is-active{
    background:#0D5B66;
    color:#fff;
    font-weight:800;
    box-shadow:0 2px 5px rgba(13,91,102,.16);
}
.nw-mobile-task-card{
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    gap:4px;
    align-items:center;
    margin:5px 2px 0;
    padding:7px 6px;
    border:1px solid #DDE8ED;
    border-radius:8px;
    background:#fff;
    box-shadow:0 4px 10px rgba(13,47,79,.05);
}
.nw-mobile-task-card b{
    display:block;
    font-size:5.8px;
    line-height:1.45;
    color:#153C5B;
}
.nw-mobile-task-card small{
    display:block;
    margin-top:2px;
    color:#7B8F9C;
    font-size:4.6px;
}
.nw-mobile-task-card>span{
    display:inline-flex;
    align-items:center;
    min-height:14px;
    padding:2px 4px;
    border-radius:999px;
    font-size:4.5px;
    font-weight:800;
    white-space:nowrap;
}
.nw-mobile-task-card .is-progress{background:#FFF3D6;color:#8A6410}
.nw-mobile-task-card .is-new{background:#E1F4EF;color:#13785F}
.nw-public-phone-home{
    position:absolute;
    inset-inline-start:50%;
    inset-block-end:4px;
    width:28%;
    height:3px;
    border-radius:99px;
    background:#566879;
    transform:translateX(50%);
}
html[dir="ltr"] .nw-public-phone-home{transform:translateX(-50%)}

.nw-public-device-chip{
    position:absolute;
    z-index:8;
    display:inline-flex;
    align-items:center;
    gap:6px;
    padding:8px 11px;
    border-radius:999px;
    border:1px solid rgba(255,255,255,.22);
    background:rgba(7,23,38,.74);
    color:#E9F6FA;
    font-size:11.5px;
    font-weight:700;
    line-height:1;
    box-shadow:0 10px 24px rgba(0,0,0,.22);
    backdrop-filter:blur(9px);
    white-space:nowrap;
}
.nw-public-device-chip::before{
    content:"";
    width:6px;
    height:6px;
    border-radius:50%;
    background:#2FC7AA;
    box-shadow:0 0 0 4px rgba(47,199,170,.12);
}
.nw-public-device-chip-dashboard{inset-block-start:16px;inset-inline-end:10%}
.nw-public-device-chip-evaluation{inset-block-end:71px;inset-inline-start:12%}
.nw-public-device-chip-mobile{inset-block-end:42px;inset-inline-end:11%}

.nw-public-device-caption{
    display:flex;
    align-items:baseline;
    justify-content:center;
    gap:8px 12px;
    flex-wrap:wrap;
    margin-top:6px;
    text-align:center;
    color:#A9C3D6;
    font-size:12.5px;
    line-height:1.7;
}
.nw-public-device-caption strong{
    font-family:var(--font-display);
    color:#F1FAFD;
    font-size:13.5px;
}

/* ---------- Trust / verification footer ---------- */
footer .footer-grid{
    grid-template-columns:1.08fr 1.18fr .72fr .82fr;
    align-items:start;
}
.nw-footer-trust{
    min-width:0;
}
.nw-footer-trust h4{margin-bottom:13px}
.nw-freelance-license{
    display:grid;
    grid-template-columns:94px minmax(0,1fr);
    gap:12px;
    align-items:center;
    padding:12px 13px;
    border-radius:16px;
    border:1px solid rgba(255,255,255,.11);
    background:rgba(255,255,255,.055);
    box-shadow:inset 0 1px 0 rgba(255,255,255,.04);
}
.nw-freelance-license img{
    width:94px;
    height:62px;
    object-fit:contain;
    margin:auto;
}
.nw-freelance-license strong{
    display:block;
    color:#fff;
    font-family:var(--font-display);
    font-size:13px;
    line-height:1.5;
}
.nw-freelance-license span{
    display:block;
    margin-top:4px;
    color:#78D9C5;
    font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
    font-size:13px;
    font-weight:800;
    letter-spacing:.2px;
}
.nw-trusted-raed{
    display:grid;
    grid-template-columns:70px minmax(0,1fr) 18px;
    gap:11px;
    align-items:center;
    margin-top:10px;
    padding:8px 10px;
    border:1px solid rgba(255,197,0,.22);
    border-radius:15px;
    background:rgba(255,197,0,.07);
    transition:transform .2s var(--ease),border-color .2s var(--ease),background .2s var(--ease);
}
.nw-trusted-raed:hover{
    transform:translateY(-2px);
    border-color:rgba(255,197,0,.48);
    background:rgba(255,197,0,.10);
}
.nw-trusted-raed-image{
    display:block;
    width:70px;
    height:54px;
    overflow:hidden;
    border-radius:10px;
    background:#FECB00;
    border:1px solid rgba(255,255,255,.15);
}
.nw-trusted-raed-image img{
    width:100%;
    height:108px;
    object-fit:cover;
    object-position:50% 0;
}
.nw-trusted-raed-copy strong{
    display:block;
    color:#fff;
    font-family:var(--font-display);
    font-size:13px;
    line-height:1.45;
}
.nw-trusted-raed-copy small{
    display:block;
    margin-top:2px;
    color:#B9CEDD;
    font-size:11.5px;
    line-height:1.45;
}
.nw-trusted-raed svg{
    width:18px;
    height:18px;
    color:#FECB00;
}

@media (max-width:1080px){
    .nw-public-device-stage{min-height:500px;max-width:660px;margin-inline:auto}
    footer .footer-grid{grid-template-columns:1fr 1fr}
}
@media (max-width:768px){
    .nw-public-device-hero{padding-top:8px}
    .nw-public-device-stage{min-height:390px;max-width:520px}
    .nw-public-laptop{inset-inline:5% 5%;inset-block-start:42px}
    .nw-public-tablet{width:42%;inset-inline-start:0;inset-block-end:20px}
    .nw-public-phone{width:19%;inset-inline-end:1%;inset-block-end:4px}
    .nw-public-device-chip{font-size:10.5px;padding:7px 9px}
    .nw-public-device-chip-dashboard{inset-inline-end:8%}
    .nw-public-device-chip-evaluation{inset-inline-start:11%;inset-block-end:62px}
    .nw-public-device-chip-mobile{inset-inline-end:11%;inset-block-end:32px}
    footer .footer-grid{grid-template-columns:1fr}
    .nw-footer-trust{max-width:420px}
}
@media (max-width:480px){
    .nw-public-device-kicker{font-size:11px}
    .nw-public-device-stage{min-height:315px}
    .nw-public-laptop{inset-inline:4% 4%;inset-block-start:36px;padding:7px 7px 0;border-radius:14px}
    .nw-public-laptop-base{inset-block-end:-15px;height:15px}
    .nw-public-tablet{width:42%;padding:5px;border-radius:13px;inset-block-end:18px}
    .nw-public-phone{width:19%;padding:7px 4px 8px;border-radius:16px;inset-block-end:4px}
    .nw-public-device-chip{display:none}
    .nw-public-device-caption{margin-top:0;font-size:11.5px}
    .nw-freelance-license{grid-template-columns:82px 1fr}
    .nw-freelance-license img{width:82px;height:54px}
}
@media (prefers-reduced-motion:no-preference){
    .nw-public-laptop{animation:nwDeviceFloat 6s ease-in-out infinite}
    .nw-public-tablet{animation:nwDeviceFloatTablet 6.8s ease-in-out infinite}
    .nw-public-phone{animation:nwDeviceFloatPhone 5.8s ease-in-out infinite}
    @keyframes nwDeviceFloat{
        0%,100%{transform:perspective(1200px) rotateY(-4deg) rotateX(1deg) translateY(0)}
        50%{transform:perspective(1200px) rotateY(-4deg) rotateX(1deg) translateY(-5px)}
    }
    @keyframes nwDeviceFloatTablet{
        0%,100%{transform:rotate(2deg) translateY(0)}
        50%{transform:rotate(2deg) translateY(-7px)}
    }
    @keyframes nwDeviceFloatPhone{
        0%,100%{transform:rotate(-3deg) translateY(0)}
        50%{transform:rotate(-3deg) translateY(-9px)}
    }
}
@media print{
    .nw-public-device-hero,.nw-footer-trust{display:none !important}
}