/* =========================================================
   REVIR STORE HOME V3
   Original marketplace layout inspired by dense digital-store UX.
========================================================= */

:root{
    --nv-green:#75ff00;
    --nv-green-soft:#a7ff82;
    --nv-panel:#090d0a;
    --nv-panel-2:#0c120e;
    --nv-line:#1b2a1e;
}

/* ---------------------------------------------------------
   HERO
--------------------------------------------------------- */
.nv-hero{
    padding:28px 0 0;
}

.nv-hero-shell{
    position:relative;
    isolation:isolate;
    min-height:610px;
    overflow:hidden;
    display:grid;
    grid-template-columns:minmax(0,1.02fr) minmax(410px,.98fr);
    align-items:center;
    gap:30px;
    padding:62px 62px 54px;
    border:1px solid #1d2d20;
    border-radius:30px;
    background:
        linear-gradient(115deg,rgba(5,8,6,.97),rgba(5,9,6,.92) 42%,rgba(8,16,9,.82)),
        url('/assets/revir-banner-main.png') center/cover;
    box-shadow:
        0 35px 100px rgba(0,0,0,.38),
        inset 0 0 70px rgba(117,255,0,.018);
}

.nv-hero-shell:before{
    content:"";
    position:absolute;
    inset:0;
    z-index:-1;
    pointer-events:none;
    background:
        linear-gradient(90deg,rgba(2,4,3,.97),rgba(3,7,4,.80) 48%,rgba(4,9,5,.48)),
        radial-gradient(circle at 79% 44%,rgba(117,255,0,.08),transparent 28%);
}

.nv-hero-grid{
    position:absolute;
    inset:0;
    z-index:-1;
    opacity:.48;
    background:
        linear-gradient(rgba(117,255,0,.026) 1px,transparent 1px),
        linear-gradient(90deg,rgba(117,255,0,.026) 1px,transparent 1px);
    background-size:42px 42px;
    mask-image:linear-gradient(90deg,#000 0 58%,transparent 93%);
}

.nv-hero-glow{
    position:absolute;
    border-radius:50%;
    background:var(--green);
    filter:blur(125px);
    pointer-events:none;
    z-index:-1;
}

.nv-hero-glow-a{
    width:330px;
    height:330px;
    right:5%;
    top:8%;
    opacity:.07;
    animation:nvGlow 5.5s ease-in-out infinite;
}

.nv-hero-glow-b{
    width:260px;
    height:260px;
    left:-120px;
    bottom:-100px;
    opacity:.045;
    animation:nvGlow 7s ease-in-out infinite reverse;
}

.nv-hero-copy{
    position:relative;
    z-index:3;
    max-width:660px;
}

.nv-live-pill{
    width:max-content;
    display:flex;
    align-items:center;
    gap:9px;
    margin-bottom:20px;
    padding:8px 11px;
    border:1px solid #29432d;
    border-radius:99px;
    background:rgba(11,21,12,.82);
    color:#a8ff91;
    font-size:9px;
    font-weight:900;
    letter-spacing:.13em;
}

.nv-live-pill>span{
    width:7px;
    height:7px;
    border-radius:50%;
    background:var(--green);
    box-shadow:0 0 13px var(--green);
    animation:nvPulse 1.7s ease-in-out infinite;
}

.nv-hero h1{
    margin:0 0 22px;
    font-size:clamp(54px,6.3vw,82px);
    line-height:.91;
    letter-spacing:-.035em;
}

.nv-hero h1 em{
    color:var(--green);
    text-shadow:0 0 34px rgba(117,255,0,.20);
}

.nv-hero-copy>p{
    max-width:610px;
    margin:0;
    color:#aab6ad;
    font-size:15px;
    line-height:1.75;
}

.nv-hero-actions{
    display:flex;
    align-items:center;
    gap:10px;
    margin-top:28px;
}

.nv-primary,
.nv-secondary{
    min-height:48px;
}

.nv-primary b{
    transition:transform .2s;
}

.nv-primary:hover b{
    transform:translateX(4px);
}

.nv-hero-proof{
    display:flex;
    gap:18px;
    flex-wrap:wrap;
    margin-top:26px;
    color:#738079;
    font-size:10px;
    font-weight:700;
}

.nv-hero-proof span{
    display:flex;
    align-items:center;
    gap:7px;
}

.nv-hero-proof i{
    font-style:normal;
    color:var(--green);
}

.nv-hero-visual{
    position:relative;
    min-height:430px;
    display:grid;
    place-items:center;
    perspective:1100px;
}

.nv-core-card{
    position:relative;
    width:min(430px,100%);
    min-height:370px;
    overflow:hidden;
    display:flex;
    flex-direction:column;
    justify-content:space-between;
    padding:28px;
    border:1px solid rgba(117,255,0,.24);
    border-radius:27px;
    background:
        radial-gradient(circle at 50% 25%,rgba(117,255,0,.08),transparent 31%),
        linear-gradient(145deg,rgba(16,28,18,.90),rgba(5,10,6,.92));
    box-shadow:
        0 40px 95px rgba(0,0,0,.55),
        inset 0 0 50px rgba(117,255,0,.025),
        0 0 70px rgba(117,255,0,.045);
    transform-style:preserve-3d;
}

.nv-core-card:before{
    content:"";
    position:absolute;
    inset:8px;
    pointer-events:none;
    border:1px solid rgba(255,255,255,.035);
    border-radius:20px;
}

.nv-core-card:after{
    content:"";
    position:absolute;
    width:120px;
    top:-20%;
    bottom:-20%;
    left:-160px;
    transform:skewX(-17deg);
    background:linear-gradient(90deg,transparent,rgba(117,255,0,.065),transparent);
    animation:nvCardScan 6.8s ease-in-out infinite;
}

.nv-core-top,
.nv-core-center,
.nv-core-flow,
.nv-core-bottom{
    position:relative;
    z-index:3;
    transform:translateZ(22px);
}

.nv-core-top{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:15px;
}

.nv-core-brand{
    display:flex;
    align-items:center;
    gap:11px;
}

.nv-core-brand img{
    width:48px;
    height:48px;
    object-fit:cover;
    border-radius:14px;
    box-shadow:0 0 25px rgba(117,255,0,.08);
}

.nv-core-brand div{
    display:grid;
    gap:3px;
}

.nv-core-brand strong{
    font:800 15px Rajdhani;
    letter-spacing:.16em;
}

.nv-core-brand span{
    color:#5f6d63;
    font-size:7px;
    font-weight:900;
    letter-spacing:.16em;
}

.nv-online-dot{
    padding:7px 9px;
    border:1px solid #2e512d;
    border-radius:99px;
    color:#8aff72;
    background:#102013;
    font-size:8px;
    font-weight:900;
    letter-spacing:.10em;
}

.nv-core-center{
    display:grid;
    place-items:center;
    padding:36px 0 26px;
    text-align:center;
}

.nv-core-label{
    color:#718076;
    font-size:8px;
    font-weight:900;
    letter-spacing:.18em;
}

.nv-core-number{
    margin:5px 0 0;
    font:800 68px/.9 Rajdhani;
    color:#f5fff2;
    text-shadow:0 0 28px rgba(117,255,0,.17);
}

.nv-core-center small{
    margin-top:7px;
    color:#67736a;
    font-size:8px;
}

.nv-core-flow{
    display:grid;
    grid-template-columns:auto 1fr auto 1fr auto;
    align-items:center;
    gap:8px;
}

.nv-core-flow>div{
    display:grid;
    justify-items:center;
    gap:5px;
    min-width:62px;
    color:#5e6961;
}

.nv-core-flow i{
    width:29px;
    height:29px;
    display:grid;
    place-items:center;
    border:1px solid #273329;
    border-radius:10px;
    background:#090d0a;
    font-style:normal;
    font-size:9px;
    font-weight:900;
}

.nv-core-flow span{
    font-size:8px;
    font-weight:800;
}

.nv-core-flow b{
    height:2px;
    border-radius:99px;
    background:linear-gradient(90deg,#24451f,var(--green));
    box-shadow:0 0 8px rgba(117,255,0,.10);
}

.nv-core-flow .done{
    color:#9cff82;
}

.nv-core-flow .done i{
    color:#071007;
    border-color:var(--green);
    background:var(--green);
}

.nv-core-flow .active{
    color:#d9ffd0;
}

.nv-core-flow .active i{
    color:var(--green);
    border-color:#4a7a3e;
    background:#112014;
    animation:nvActive 1.8s ease-in-out infinite;
}

.nv-core-bottom{
    display:flex;
    justify-content:space-between;
    gap:14px;
    padding-top:17px;
    border-top:1px solid #1b2a1e;
    color:#637068;
    font-size:8px;
    font-weight:800;
}

.nv-core-bottom span:first-child{
    display:flex;
    align-items:center;
    gap:6px;
}

.nv-core-bottom i{
    width:6px;
    height:6px;
    border-radius:50%;
    background:var(--green);
    box-shadow:0 0 11px var(--green);
}

.nv-core-ring{
    position:absolute;
    pointer-events:none;
    border:1px solid rgba(117,255,0,.10);
    border-radius:50%;
}

.nv-ring-one{
    width:310px;
    height:82px;
    right:-140px;
    top:76px;
    transform:rotate(22deg);
    animation:nvRingOne 11s linear infinite;
}

.nv-ring-two{
    width:250px;
    height:64px;
    right:-104px;
    top:104px;
    transform:rotate(72deg);
    animation:nvRingTwo 13s linear infinite;
}

.nv-float-chip{
    position:absolute;
    z-index:4;
    display:flex;
    align-items:center;
    gap:10px;
    min-width:170px;
    padding:12px 14px;
    border:1px solid rgba(117,255,0,.15);
    border-radius:15px;
    background:rgba(9,15,10,.88);
    backdrop-filter:blur(14px);
    box-shadow:0 18px 45px rgba(0,0,0,.28);
    animation:nvFloat 4.6s ease-in-out infinite;
}

.nv-float-chip>span{
    width:34px;
    height:34px;
    display:grid;
    place-items:center;
    border-radius:11px;
    background:#132017;
    color:var(--green);
}

.nv-float-chip div{
    display:grid;
    gap:3px;
}

.nv-float-chip small{
    color:#5f6d63;
    font-size:7px;
    font-weight:900;
    letter-spacing:.12em;
}

.nv-float-chip strong{
    font-size:10px;
}

.nv-chip-a{
    right:-24px;
    top:55px;
}

.nv-chip-b{
    left:-8px;
    bottom:42px;
    animation-delay:-2.2s;
}

.nv-stats-bar{
    position:relative;
    z-index:5;
    width:calc(100% - 46px);
    display:grid;
    grid-template-columns:repeat(4,1fr);
    margin:-28px auto 0;
    overflow:hidden;
    border:1px solid #1d2c20;
    border-radius:18px;
    background:rgba(7,11,8,.95);
    backdrop-filter:blur(18px);
    box-shadow:0 22px 55px rgba(0,0,0,.30);
}

.nv-stats-bar>div{
    min-height:84px;
    display:flex;
    flex-direction:column;
    justify-content:center;
    padding:17px 22px;
    border-right:1px solid #17231a;
}

.nv-stats-bar>div:last-child{
    border-right:0;
}

.nv-stats-bar strong{
    font:800 26px Rajdhani;
}

.nv-stats-bar span{
    margin-top:2px;
    color:#66736a;
    font-size:9px;
}

.nv-stat-status strong{
    display:flex;
    align-items:center;
    gap:7px;
    color:#a1ff88;
}

.nv-stat-status i{
    width:7px;
    height:7px;
    border-radius:50%;
    background:var(--green);
    box-shadow:0 0 12px var(--green);
    animation:nvPulse 1.7s ease-in-out infinite;
}

/* ---------------------------------------------------------
   MARQUEE
--------------------------------------------------------- */
.nv-marquee{
    margin-top:35px;
    overflow:hidden;
    border-top:1px solid #132017;
    border-bottom:1px solid #132017;
    background:#070a08;
}

.nv-marquee-track{
    width:max-content;
    display:flex;
    align-items:center;
    gap:24px;
    min-height:48px;
    animation:nvMarquee 26s linear infinite;
}

.nv-marquee-track span{
    color:#829087;
    font-size:9px;
    font-weight:900;
    letter-spacing:.11em;
    white-space:nowrap;
}

.nv-marquee-track i{
    color:#2d4e2c;
    font-style:normal;
    font-size:8px;
}

/* ---------------------------------------------------------
   SHARED SECTIONS
--------------------------------------------------------- */
.nv-section{
    padding:82px 0;
}

.nv-section-head{
    display:flex;
    align-items:end;
    justify-content:space-between;
    gap:30px;
    margin-bottom:29px;
}

.nv-eyebrow{
    display:block;
    margin-bottom:8px;
    color:var(--green);
    font-size:9px;
    font-weight:900;
    letter-spacing:.18em;
}

.nv-section-head h2,
.nv-flow-copy h2,
.nv-final-card h2{
    margin:0;
    font:800 clamp(38px,5vw,55px)/.98 Rajdhani;
    text-transform:uppercase;
}

.nv-section-side{
    width:min(460px,100%);
    display:grid;
    justify-items:end;
    gap:10px;
    text-align:right;
}

.nv-section-side p{
    margin:0;
    color:#76837a;
    font-size:11px;
    line-height:1.6;
}

.nv-section-side a,
.nv-dashboard-copy>a{
    color:#a1ff87;
    font-size:10px;
    font-weight:900;
}

/* ---------------------------------------------------------
   PRODUCTS
--------------------------------------------------------- */
.nv-product-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:15px;
}

.nv-product-card{
    position:relative;
    overflow:hidden;
    border:1px solid #1a271c;
    border-radius:21px;
    background:linear-gradient(180deg,#0c110e,#070a08);
    transition:border-color .22s,box-shadow .22s;
}

.nv-product-card:hover{
    border-color:#31532d;
    box-shadow:0 25px 60px rgba(0,0,0,.28);
}

.nv-product-art{
    position:relative;
    height:205px;
    overflow:hidden;
    display:grid;
    place-items:center;
    background:
        radial-gradient(circle,rgba(117,255,0,.12),transparent 46%),
        #080c09;
}

.nv-product-art img{
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    object-fit:cover;
    transition:transform .55s cubic-bezier(.16,1,.3,1),filter .4s;
}

.nv-product-card:hover .nv-product-art img{
    transform:scale(1.065);
    filter:saturate(1.08) contrast(1.04);
}

.nv-product-shade{
    position:absolute;
    inset:0;
    background:linear-gradient(180deg,transparent 40%,rgba(4,7,5,.74));
    pointer-events:none;
}

.nv-product-monogram{
    font:800 96px Rajdhani;
    color:#efffee;
    text-shadow:0 0 34px rgba(117,255,0,.20);
}

.nv-product-index{
    position:absolute;
    left:15px;
    top:15px;
    z-index:2;
    color:rgba(255,255,255,.42);
    font:800 11px Rajdhani;
    letter-spacing:.10em;
}

.nv-delivery-badge{
    position:absolute;
    right:13px;
    bottom:12px;
    z-index:2;
    padding:7px 9px;
    border:1px solid rgba(117,255,0,.18);
    border-radius:99px;
    background:rgba(7,14,8,.86);
    color:#a8ff91;
    font-size:8px;
    font-weight:900;
    backdrop-filter:blur(10px);
}

.nv-product-body{
    padding:19px;
}

.nv-product-topline{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
}

.nv-product-topline>span:first-child{
    color:#5f6c62;
    font-size:7px;
    font-weight:900;
    letter-spacing:.15em;
}

.nv-stock{
    padding:5px 7px;
    border-radius:99px;
    font-size:7px;
    font-weight:900;
}

.nv-stock.in{
    color:#99ff80;
    background:#132216;
}

.nv-stock.low{
    color:#ffda68;
    background:#251f0f;
}

.nv-stock.out{
    color:#ff8797;
    background:#261216;
}

.nv-product-body h3{
    margin:14px 0 6px;
    font:800 26px Rajdhani;
}

.nv-product-body>p{
    min-height:38px;
    margin:0;
    overflow:hidden;
    color:#7a867e;
    font-size:10px;
    line-height:1.55;
    display:-webkit-box;
    -webkit-line-clamp:2;
    -webkit-box-orient:vertical;
}

.nv-product-footer{
    display:flex;
    align-items:end;
    justify-content:space-between;
    gap:12px;
    margin-top:18px;
    padding-top:16px;
    border-top:1px solid #162019;
}

.nv-price{
    display:grid;
    gap:2px;
}

.nv-price small{
    color:#5f6d63;
    font-size:7px;
    font-weight:900;
    letter-spacing:.12em;
}

.nv-price strong{
    font:800 24px Rajdhani;
}

.nv-buy-btn{
    min-width:92px;
    min-height:39px;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    border:1px solid #2a452c;
    border-radius:11px;
    background:#101b12;
    color:#9aff81;
    cursor:pointer;
    font-size:9px;
    font-weight:900;
    transition:.2s;
}

.nv-buy-btn:hover:not(:disabled){
    transform:translateY(-2px);
    border-color:#4a8241;
    background:#15251a;
}

.nv-buy-btn:disabled{
    opacity:.35;
    cursor:not-allowed;
}

.nv-buy-btn span{
    transition:transform .2s;
}

.nv-buy-btn:hover span{
    transform:translateX(3px);
}

/* ---------------------------------------------------------
   BENTO
--------------------------------------------------------- */
.nv-bento{
    display:grid;
    grid-template-columns:1.08fr .92fr;
    grid-template-areas:
        "status delivery"
        "dashboard payments";
    gap:15px;
}

.nv-bento-card{
    position:relative;
    overflow:hidden;
    min-height:290px;
    padding:25px;
    border:1px solid #1a291d;
    border-radius:22px;
    background:
        radial-gradient(circle at 90% 15%,rgba(117,255,0,.055),transparent 28%),
        linear-gradient(145deg,#0b100d,#070a08);
}

.nv-bento-card:after{
    content:"";
    position:absolute;
    inset:0;
    pointer-events:none;
    background:radial-gradient(circle at var(--mx,50%) var(--my,50%),rgba(117,255,0,.10),transparent 34%);
    opacity:0;
    transition:opacity .2s;
}

.nv-bento-card:hover:after{
    opacity:1;
}

.nv-bento-status{grid-area:status}
.nv-bento-delivery{grid-area:delivery}
.nv-bento-payments{grid-area:payments;min-height:250px}
.nv-bento-dashboard{
    grid-area:dashboard;
    min-height:250px;
    display:grid;
    grid-template-columns:1fr 1.05fr;
    gap:18px;
}

.nv-bento-head{
    position:relative;
    z-index:2;
    display:flex;
    align-items:center;
    gap:10px;
}

.nv-icon-box{
    width:34px;
    height:34px;
    display:grid;
    place-items:center;
    border:1px solid #2a402c;
    border-radius:11px;
    background:#101712;
    color:var(--green);
    font-size:13px;
}

.nv-small-label{
    color:#5f6d63;
    font-size:8px;
    font-weight:900;
    letter-spacing:.16em;
}

.nv-bento-card h3{
    position:relative;
    z-index:2;
    margin:19px 0 7px;
    font:800 30px Rajdhani;
    text-transform:uppercase;
}

.nv-bento-card>p,
.nv-dashboard-copy>p{
    position:relative;
    z-index:2;
    max-width:470px;
    margin:0;
    color:#748178;
    font-size:10px;
    line-height:1.6;
}

.nv-system-status{
    position:relative;
    z-index:2;
    display:grid;
    gap:7px;
    margin-top:28px;
}

.nv-system-status>div{
    display:grid;
    grid-template-columns:90px 1fr 8px;
    align-items:center;
    gap:10px;
    padding:11px 12px;
    border:1px solid #17241a;
    border-radius:12px;
    background:#080c09;
}

.nv-system-status span{
    color:#5f6c63;
    font-size:8px;
    font-weight:900;
}

.nv-system-status b{
    color:#c9d6cc;
    font-size:9px;
}

.nv-system-status i{
    width:7px;
    height:7px;
    border-radius:50%;
    background:var(--green);
    box-shadow:0 0 11px var(--green);
}

.nv-delivery-demo{
    position:absolute;
    left:25px;
    right:25px;
    bottom:24px;
    min-height:86px;
    display:grid;
    grid-template-columns:44px 1fr;
    grid-template-rows:auto auto;
    align-items:center;
    column-gap:12px;
    padding:16px;
    border:1px solid #1e3321;
    border-radius:15px;
    background:#09100a;
}

.nv-delivery-demo>span{
    grid-row:1 / 3;
    width:42px;
    height:42px;
    display:grid;
    place-items:center;
    border-radius:13px;
    background:var(--green);
    color:#071007;
    font-weight:900;
    box-shadow:0 0 24px rgba(117,255,0,.10);
}

.nv-delivery-demo strong{
    align-self:end;
    font-size:10px;
}

.nv-delivery-demo small{
    align-self:start;
    color:#637068;
    font-size:8px;
}

.nv-demo-line{
    position:absolute;
    left:0;
    top:0;
    height:1px;
    width:28%;
    background:linear-gradient(90deg,transparent,var(--green),transparent);
    animation:nvDemoLine 4s linear infinite;
}

.nv-payment-methods{
    position:absolute;
    left:25px;
    right:25px;
    bottom:24px;
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:8px;
}

.nv-payment-methods span{
    display:flex;
    align-items:center;
    gap:10px;
    padding:13px;
    border:1px solid #1d2c20;
    border-radius:13px;
    background:#080c09;
    color:#cdd7cf;
    font-size:9px;
    font-weight:800;
}

.nv-payment-methods b{
    width:30px;
    height:30px;
    display:grid;
    place-items:center;
    border-radius:9px;
    background:#132016;
    color:var(--green);
    font-size:14px;
}

.nv-dashboard-copy{
    position:relative;
    z-index:2;
}

.nv-dashboard-copy>a{
    display:inline-block;
    margin-top:18px;
}

.nv-dashboard-preview{
    position:relative;
    z-index:2;
    align-self:center;
    min-height:185px;
    overflow:hidden;
    padding:15px;
    border:1px solid #223327;
    border-radius:16px;
    background:#060907;
    box-shadow:0 24px 55px rgba(0,0,0,.22);
    transform:perspective(800px) rotateY(-7deg) rotateX(3deg);
    animation:nvDashboardFloat 5s ease-in-out infinite;
}

.nv-dash-top{
    display:flex;
    align-items:center;
    gap:5px;
    padding-bottom:12px;
    border-bottom:1px solid #152019;
}

.nv-dash-top i{
    width:6px;
    height:6px;
    border-radius:50%;
    background:#29422c;
}

.nv-dash-top i:first-child{
    background:var(--green);
}

.nv-dash-top span{
    margin-left:auto;
    color:#536158;
    font-size:6px;
    font-weight:900;
    letter-spacing:.14em;
}

.nv-dash-row{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:10px;
    padding:16px 4px;
    border-bottom:1px solid #132017;
}

.nv-dash-row span{
    color:#8e9b91;
    font-size:8px;
}

.nv-dash-row b{
    padding:5px 6px;
    border-radius:99px;
    background:#132217;
    color:#9dff83;
    font-size:6px;
}

.nv-dash-row strong{
    color:var(--green);
}

.nv-dash-progress{
    height:4px;
    overflow:hidden;
    margin:16px 4px 0;
    border-radius:99px;
    background:#142017;
}

.nv-dash-progress span{
    display:block;
    width:100%;
    height:100%;
    background:linear-gradient(90deg,#45bd00,var(--green));
    animation:nvProgress 4s ease-in-out infinite;
}

/* ---------------------------------------------------------
   FLOW
--------------------------------------------------------- */
.nv-flow-shell{
    position:relative;
    overflow:hidden;
    display:grid;
    grid-template-columns:.82fr 1.18fr;
    gap:45px;
    padding:42px;
    border:1px solid #1c2a1f;
    border-radius:25px;
    background:
        radial-gradient(circle at 4% 40%,rgba(117,255,0,.065),transparent 25%),
        linear-gradient(145deg,#0b100d,#070a08);
}

.nv-flow-shell:after{
    content:"";
    position:absolute;
    inset:0;
    pointer-events:none;
    background:
        linear-gradient(rgba(117,255,0,.022) 1px,transparent 1px),
        linear-gradient(90deg,rgba(117,255,0,.022) 1px,transparent 1px);
    background-size:38px 38px;
    mask-image:linear-gradient(90deg,#000,transparent 52%);
}

.nv-flow-copy{
    position:relative;
    z-index:2;
    align-self:center;
}

.nv-flow-copy>p{
    max-width:400px;
    margin:14px 0 22px;
    color:#758178;
    font-size:10px;
    line-height:1.65;
}

.nv-flow-steps{
    position:relative;
    z-index:2;
    display:grid;
    gap:7px;
}

.nv-flow-step{
    position:relative;
    display:grid;
    grid-template-columns:48px 1fr;
    align-items:center;
    gap:14px;
    min-height:74px;
    padding:12px 14px;
    border:1px solid #17241a;
    border-radius:14px;
    background:#080c09;
    transition:.22s;
}

.nv-flow-step:hover{
    transform:translateX(5px);
    border-color:#2d4d2c;
}

.nv-flow-step i{
    width:44px;
    height:44px;
    display:grid;
    place-items:center;
    border:1px solid #263429;
    border-radius:12px;
    background:#0e1510;
    color:#6d796f;
    font:800 13px Rajdhani;
    font-style:normal;
}

.nv-flow-step.active i{
    border-color:var(--green);
    background:var(--green);
    color:#071007;
    box-shadow:0 0 25px rgba(117,255,0,.11);
}

.nv-flow-step div{
    display:grid;
    gap:3px;
}

.nv-flow-step strong{
    font-size:10px;
}

.nv-flow-step span{
    color:#627067;
    font-size:8px;
}

/* ---------------------------------------------------------
   REVIEWS
--------------------------------------------------------- */
.nv-review-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:13px;
}

.nv-review-card{
    position:relative;
    overflow:hidden;
    min-height:205px;
    display:flex;
    flex-direction:column;
    padding:21px;
    border:1px solid #1a271c;
    border-radius:19px;
    background:
        radial-gradient(circle at 95% 5%,rgba(117,255,0,.05),transparent 27%),
        #090d0a;
}

.nv-review-stars{
    color:var(--green);
    font-size:11px;
    letter-spacing:2px;
}

.nv-review-card>p{
    flex:1;
    margin:16px 0;
    color:#b1bcb4;
    font-size:11px;
    line-height:1.65;
}

.nv-review-footer{
    display:flex;
    justify-content:space-between;
    align-items:end;
    gap:12px;
    padding-top:13px;
    border-top:1px solid #162019;
}

.nv-review-footer>div{
    display:grid;
    gap:3px;
}

.nv-review-footer strong{
    font-size:9px;
}

.nv-review-footer span{
    color:#626e65;
    font-size:7px;
}

.nv-review-footer>b{
    color:#8cff72;
    font-size:7px;
    letter-spacing:.08em;
}

/* ---------------------------------------------------------
   FINAL CTA
--------------------------------------------------------- */
.nv-final-section{
    padding-top:40px;
}

.nv-final-card{
    position:relative;
    overflow:hidden;
    min-height:260px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:30px;
    padding:44px 48px;
    border:1px solid #29422c;
    border-radius:25px;
    background:
        linear-gradient(110deg,rgba(13,27,14,.95),rgba(7,12,8,.95)),
        url('/assets/revir-banner-alt.png') center/cover;
    box-shadow:0 25px 80px rgba(0,0,0,.28);
}

.nv-final-card:before{
    content:"";
    position:absolute;
    width:320px;
    height:320px;
    right:-120px;
    top:-160px;
    border-radius:50%;
    background:var(--green);
    filter:blur(125px);
    opacity:.08;
}

.nv-final-grid{
    position:absolute;
    inset:0;
    opacity:.35;
    background:
        linear-gradient(rgba(117,255,0,.03) 1px,transparent 1px),
        linear-gradient(90deg,rgba(117,255,0,.03) 1px,transparent 1px);
    background-size:34px 34px;
}

.nv-final-card>div:not(.nv-final-grid){
    position:relative;
    z-index:2;
}

.nv-final-card p{
    margin:10px 0 0;
    color:#89968d;
    font-size:11px;
}

.nv-final-actions{
    display:flex;
    gap:9px;
    flex:0 0 auto;
}

.nv-empty{
    grid-column:1/-1;
    padding:35px;
    border:1px dashed #253429;
    border-radius:18px;
    color:#738078;
    text-align:center;
}

/* ---------------------------------------------------------
   MOTION
--------------------------------------------------------- */
@keyframes nvPulse{
    0%,100%{transform:scale(.82);opacity:.65}
    50%{transform:scale(1.2);opacity:1}
}

@keyframes nvGlow{
    0%,100%{transform:scale(.85);opacity:.045}
    50%{transform:scale(1.15);opacity:.09}
}

@keyframes nvCardScan{
    0%,32%{left:-160px}
    73%,100%{left:calc(100% + 160px)}
}

@keyframes nvActive{
    0%,100%{box-shadow:0 0 8px rgba(117,255,0,.05)}
    50%{box-shadow:0 0 25px rgba(117,255,0,.18)}
}

@keyframes nvRingOne{
    to{transform:rotate(382deg)}
}

@keyframes nvRingTwo{
    to{transform:rotate(-288deg)}
}

@keyframes nvFloat{
    0%,100%{transform:translateY(0)}
    50%{transform:translateY(-8px)}
}

@keyframes nvMarquee{
    to{transform:translateX(-50%)}
}

@keyframes nvDemoLine{
    to{left:110%}
}

@keyframes nvDashboardFloat{
    0%,100%{transform:perspective(800px) rotateY(-7deg) rotateX(3deg) translateY(0)}
    50%{transform:perspective(800px) rotateY(-4deg) rotateX(1deg) translateY(-7px)}
}

@keyframes nvProgress{
    0%,100%{transform:scaleX(.55);transform-origin:left}
    50%{transform:scaleX(1);transform-origin:left}
}

/* ---------------------------------------------------------
   RESPONSIVE
--------------------------------------------------------- */
@media(max-width:1050px){
    .nv-hero-shell{
        grid-template-columns:1fr;
        padding:48px;
    }

    .nv-hero-copy{
        max-width:750px;
    }

    .nv-hero-visual{
        min-height:390px;
    }

    .nv-core-card{
        width:min(520px,100%);
    }

    .nv-chip-a{right:3%}
    .nv-chip-b{left:4%}

    .nv-product-grid{
        grid-template-columns:repeat(2,1fr);
    }

    .nv-bento{
        grid-template-columns:1fr;
        grid-template-areas:
            "status"
            "delivery"
            "dashboard"
            "payments";
    }

    .nv-bento-dashboard{
        min-height:300px;
    }

    .nv-flow-shell{
        grid-template-columns:1fr;
    }

    .nv-review-grid{
        grid-template-columns:1fr 1fr;
    }
}

@media(max-width:720px){
    .nv-hero{
        padding-top:16px;
    }

    .nv-hero-shell{
        min-height:0;
        padding:34px 22px 38px;
        border-radius:22px;
    }

    .nv-hero h1{
        font-size:50px;
    }

    .nv-hero-copy>p{
        font-size:13px;
    }

    .nv-hero-actions{
        align-items:stretch;
        flex-direction:column;
    }

    .nv-hero-actions a{
        width:100%;
    }

    .nv-hero-proof{
        gap:10px 14px;
    }

    .nv-hero-visual{
        min-height:350px;
    }

    .nv-core-card{
        min-height:330px;
        padding:21px;
    }

    .nv-core-number{
        font-size:57px;
    }

    .nv-float-chip{
        display:none;
    }

    .nv-stats-bar{
        width:calc(100% - 18px);
        grid-template-columns:1fr 1fr;
        margin-top:-20px;
    }

    .nv-stats-bar>div{
        min-height:70px;
        padding:13px;
        border-bottom:1px solid #17231a;
    }

    .nv-stats-bar>div:nth-child(2){
        border-right:0;
    }

    .nv-stats-bar>div:nth-child(3),
    .nv-stats-bar>div:nth-child(4){
        border-bottom:0;
    }

    .nv-stats-bar strong{
        font-size:22px;
    }

    .nv-section{
        padding:60px 0;
    }

    .nv-section-head{
        align-items:start;
        flex-direction:column;
        gap:14px;
    }

    .nv-section-side{
        justify-items:start;
        text-align:left;
    }

    .nv-product-grid,
    .nv-review-grid{
        grid-template-columns:1fr;
    }

    .nv-product-art{
        height:220px;
    }

    .nv-bento-card{
        min-height:270px;
        padding:21px;
    }

    .nv-bento-dashboard{
        display:block;
        min-height:auto;
    }

    .nv-dashboard-preview{
        margin-top:22px;
        transform:none;
    }

    .nv-payment-methods,
    .nv-delivery-demo{
        left:21px;
        right:21px;
        bottom:20px;
    }

    .nv-flow-shell{
        padding:25px 20px;
    }

    .nv-final-card{
        align-items:flex-start;
        flex-direction:column;
        padding:32px 24px;
    }

    .nv-final-actions{
        width:100%;
        flex-direction:column;
    }

    .nv-final-actions a{
        width:100%;
    }
}

@media(prefers-reduced-motion:reduce){
    .nv-live-pill>span,
    .nv-hero-glow,
    .nv-core-card:after,
    .nv-core-flow .active i,
    .nv-core-ring,
    .nv-float-chip,
    .nv-stat-status i,
    .nv-marquee-track,
    .nv-delivery-demo .nv-demo-line,
    .nv-dashboard-preview,
    .nv-dash-progress span,
    .nv-system-status i{
        animation:none!important;
    }
}