@font-face{

    font-family:"Vazirmatn";

    src:url("../../fonts/Vazirmatn-Regular.woff2")
        format("woff2");

    font-weight:400;

    font-style:normal;

    font-display:swap;
}


@font-face{

    font-family:"Shabnam";

    src:url("../../fonts/Shabnam.woff2")
        format("woff2");

    font-weight:400;

    font-style:normal;

    font-display:swap;
}


/* =========================================================
   LOCAL FONTS
   ========================================================= */

/* =========================================================
   DESIGN TOKENS
   ========================================================= */

:root{

    --primary:#7A86B6;
    --primary-dark:#495C83;
    --primary-deep:#495C83;

    --primary-soft:#EEF2F8;
    --primary-softer:#F7F9FC;

    --ink:#263448;
    --ink-2:#405271;

    --muted:#776d86;
    --muted-2:#9a92a6;

    --surface:#ffffff;
    --surface-2:#F8FAFC;
    --surface-3:#F2EDF8;

    --line:rgba(84,101,142,.14);
    --line-strong:rgba(84,101,142,.25);

    --danger:#e85d75;
    --warning:#e9a83b;
    --info:#5289e8;
    --success:#C5CDD9;
    --violet:#7A86B6;

    --radius-sm:12px;
    --radius-md:18px;
    --radius-lg:26px;
    --radius-xl:34px;

    --shadow-sm:
        0 8px 24px rgba(55,35,72,.06);

    --shadow-md:
        0 18px 50px rgba(56,28,82,.10);

    --shadow-lg:
        0 28px 80px rgba(54,28,80,.15);

    --container:1240px;

    --transition:
        220ms cubic-bezier(.2,.75,.25,1);
}


/* =========================================================
   DARK THEME
   ========================================================= */

[data-theme="dark"]{

    --primary:#7A86B6;
    --primary-dark:#A8A4CE;
    --primary-deep:#64779D;

    --primary-soft:rgba(122,134,182,.10);
    --primary-softer:rgba(122,134,182,.06);

    --ink:#495C83;
    --ink-2:#D8DFEC;

    --muted:#A4B0C7;
    --muted-2:#74819A;

    --surface:#0F1521;
    --surface-2:#182131;
    --surface-3:#222C3F;

    --line:#344158;
    --line-strong:#4A5A72;

    --shadow-sm:
        0 8px 24px rgba(0,0,0,.35);

    --shadow-md:
        0 18px 50px rgba(0,0,0,.45);

    --shadow-lg:
        0 28px 80px rgba(0,0,0,.55);
}


[data-theme="dark"] body{

    background:
        radial-gradient(
            circle at 10% 0%,
            rgba(84,101,142,0.070),
            transparent 28%
        ),
        var(--surface);
}


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

*,
*::before,
*::after{
    box-sizing:border-box;
}


html{

    scroll-behavior:smooth;

    -webkit-text-size-adjust:100%;

    scrollbar-width:auto;

    scrollbar-color:
        #B7C2D3
        #495C83;
}


body{

    margin:0;

    color:var(--ink);

    background:
        radial-gradient(
            circle at 10% 0%,
            rgba(84,101,142,0.050),
            transparent 28%
        ),
        var(--surface);

    font-family:var(--wpw-font-body);

    font-size:15px;

    line-height:1.85;

    overflow-x:hidden;

    -webkit-font-smoothing:antialiased;
}


img,
svg{
    max-width:100%;
}


img{
    display:block;
}


button,
input,
select{
    font:inherit;
    color:inherit;
}


button,
a{
    -webkit-tap-highlight-color:transparent;
}


button{

    cursor:pointer;

    background:none;

    border:0;

    padding:0;
}


a{

    color:inherit;

    text-decoration:none;
}


::selection{

    background:rgba(73,92,131,.06);

    color:var(--primary-deep);
}


h1,
h2,
h3,
h4,
h5,
h6,
.section-heading,
.hero-title,
.featured-title,
.business-title,
.product-title,
.article-title,
.footer-title,
.brand-title,
.btn,
.badge,
.product-price,
.page-btn{

    font-family:var(--wpw-font-heading);
}


section[id],
footer[id],
main section[id]{

    scroll-margin-top:92px;
}


/* =========================================================
   SCROLLBAR
   ========================================================= */

::-webkit-scrollbar{
    width:11px;
}


::-webkit-scrollbar-track{
    background:#495C83;
}


::-webkit-scrollbar-thumb{

    background:rgba(84,101,142,0.060);

    border-radius:999px;

    border:3px solid #495C83;
}


::-webkit-scrollbar-thumb:hover{
    background:rgba(84,101,142,0.120);
}


[data-theme="dark"] ::-webkit-scrollbar-track{
    background:#121621;
}


[data-theme="dark"] ::-webkit-scrollbar-thumb{

    background:#495C83;

    border-color:#121621;
}


/* =========================================================
   SCROLL PROGRESS
   ========================================================= */

.scroll-progress{

    position:fixed;

    top:0;
    left:0;
    right:0;

    height:3px;

    z-index:2000;

    pointer-events:none;
}


.scroll-progress__bar{

    width:0%;
    height:100%;

    background:
        linear-gradient(
            90deg,
            #7A86B6 0%,
            #495C83 45%,
            #5289e8 100%
        );

    box-shadow:
        0 0 10px rgba(73,92,131,.16),
        0 0 22px rgba(73,92,131,.09);

    transition:
        width
        70ms
        linear;

    border-radius:
        0
        999px
        999px
        0;
}


/* =========================================================
   UTILITIES
   ========================================================= */

.container{

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

    margin-inline:auto;
}


.section{
    padding:96px 0;
}


.section-head{

    display:flex;

    align-items:flex-end;

    justify-content:space-between;

    gap:30px;

    margin-bottom:34px;
}


.section-heading{

    margin:0;

    font-size:
        clamp(
            25px,
            3vw,
            36px
        );

    line-height:1.3;

    letter-spacing:-.6px;
}


.section-description{

    max-width:650px;

    margin:12px 0 0;

    color:var(--muted);

    font-size:15px;
}


.head-tools{

    display:flex;

    align-items:center;

    gap:10px;

    flex:none;
}


.eyebrow{

    display:inline-flex;

    align-items:center;

    gap:9px;

    padding:7px 12px;

    margin-bottom:13px;

    border:
        1px solid
        rgba(73,92,131,.05);

    border-radius:999px;

    background:
        rgba(73,92,131,.02);

    color:var(--primary-dark);

    font-family:var(--wpw-font-heading);

    font-size:12px;

    font-weight:600;
}


.eyebrow-dot{

    width:7px;
    height:7px;

    flex:none;

    border-radius:50%;

    background:var(--primary);

    box-shadow:
        0 0 0 5px rgba(100,119,157,.07);
}


/* =========================================================
   HEADER
   ========================================================= */

.site-header{

    position:sticky;

    top:0;

    z-index:1000;

    background:transparent;

    border-bottom:
        1px solid
        rgba(89,29,110,.75);
}


/* =========================================================
   HEADER TOPBAR
   ========================================================= */

.header-topbar{

    position:relative;

    min-height:36px;

    display:flex;

    align-items:center;

    overflow:hidden;

    isolation:isolate;

    color:#495C83;

    background:

        radial-gradient(
            circle at 12% 50%,
            rgba(84,101,142,0.135),
            transparent 20%
        ),

        radial-gradient(
            circle at 88% 50%,
            rgba(82,137,232,.12),
            transparent 22%
        ),

        linear-gradient(
            110deg,
            #061b19 0%,
            #092824 32%,
            #071f1d 56%,
            #30384A 78%,
            #061a18 100%
        );
}


.header-topbar::before{

    content:"";

    position:absolute;

    inset:-80% -10%;

    z-index:-1;

    opacity:.42;

    background:

        repeating-linear-gradient(
            115deg,
            transparent 0 30px,
            rgba(84,101,142,0.070) 31px 32px,
            transparent 33px 63px
        );

    animation:
        topbarFlow
        18s
        linear
        infinite;
}


.header-topbar::after{

    content:"";

    position:absolute;

    inset:0;

    z-index:-1;

    background:
        radial-gradient(
            circle at 50% 50%,
            rgba(84,101,142,0.080),
            transparent 55%
        );

    animation:
        topbarGlow
        6s
        ease-in-out
        infinite;
}


@keyframes topbarFlow{

    0%{
        transform:translate3d(0,0,0);
    }

    100%{
        transform:translate3d(90px,0,0);
    }
}


@keyframes topbarGlow{

    0%,
    100%{
        opacity:.55;
    }

    50%{
        opacity:1;
    }
}


.header-topbar-inner{

    min-height:36px;

    display:grid;

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

    align-items:center;

    gap:24px;

    font-family:var(--wpw-font-heading);

    font-size:10px;

    line-height:1;

    white-space:nowrap;
}


.header-slogan{
    color:#54658E;
}


.header-slogan-right{
    text-align:right;
}


.header-slogan-left{
    text-align:left;
}


.header-topbar-center{

    display:inline-flex;

    align-items:center;

    justify-content:center;

    gap:9px;

    color:#7A86B6;

    font-weight:700;
}


.header-topbar-dot{

    width:5px;
    height:5px;

    flex:none;

    border-radius:50%;

    background:#7A86B6;

    box-shadow:
        0 0 0 4px rgba(84,101,142,.04),
        0 0 12px rgba(84,101,142,.14);

    animation:
        topbarDot
        2.8s
        ease-in-out
        infinite;
}


@keyframes topbarDot{

    0%,
    100%{
        transform:scale(.9);
        opacity:.7;
    }

    50%{
        transform:scale(1.25);
        opacity:1;
    }
}


/* =========================================================
   HEADER INNER
   ========================================================= */

.header-inner{

    min-height:78px;

    display:flex;

    align-items:center;

    gap:24px;

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

    backdrop-filter:blur(18px);

    -webkit-backdrop-filter:blur(18px);
}


[data-theme="dark"] .site-header{
    border-bottom-color:rgba(100,119,157,.30);
}


[data-theme="dark"] .header-topbar{

    background:

        radial-gradient(
            circle at 12% 50%,
            rgba(84,101,142,0.135),
            transparent 20%
        ),

        radial-gradient(
            circle at 88% 50%,
            rgba(82,137,232,.13),
            transparent 22%
        ),

        linear-gradient(
            110deg,
            #030f0e,
            #071c1a 35%,
            #041714 60%,
            #121621 82%,
            #030e0d
        );
}


[data-theme="dark"] .header-inner{

    background:
        rgba(10,28,26,.86);
}


.brand{

    display:flex;

    align-items:center;

    gap:11px;

    flex:none;
}


.brand-mark{

    width:42px;
    height:42px;

    display:grid;

    place-items:center;

    border-radius:14px;

    background:
        linear-gradient(
            145deg,
            #7A86B6,
            #495C83
        );

    box-shadow:
        0 9px 22px rgba(73,92,131,.065);
}


.brand-mark svg{

    width:25px;
    height:25px;
}


.brand-title{

    display:block;

    font-weight:700;

    font-size:17px;

    line-height:1;
}


.brand-sub{

    display:block;

    margin-top:4px;

    color:var(--muted-2);

    font-size:10px;

    font-family:var(--wpw-font-body);
}


.main-nav{

    display:flex;

    align-items:center;

    gap:4px;

    margin-inline:auto;
}


.main-nav a{

    position:relative;

    padding:9px 13px;

    border-radius:10px;

    color:#495C83;

    font-size:13px;

    transition:var(--transition);
}


[data-theme="dark"] .main-nav a{
    color:var(--ink-2);
}


.main-nav a:hover,
.main-nav a.active{

    color:var(--primary-dark);

    background:var(--wpw-bg-soft-blue);
}


.header-tools{

    display:flex;

    align-items:center;

    gap:8px;

    flex:none;
}


.search-box{

    width:205px;
    height:42px;

    display:flex;

    align-items:center;

    gap:9px;

    padding:0 12px;

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

    border-radius:13px;

    background:#fff;

    transition:var(--transition);
}


[data-theme="dark"] .search-box{
    background:var(--surface-2);
}


.search-box:focus-within{

    border-color:rgba(73,92,131,.16);

    box-shadow:
        0 0 0 4px
        rgba(73,92,131,.025);
}


.search-box svg{

    width:17px;
    height:17px;

    color:#495C83;

    flex:none;
}


.search-box input{

    width:100%;

    border:0;

    outline:0;

    color:var(--ink);

    background:transparent;

    font-size:12px;
}


.icon-btn{

    width:42px;
    height:42px;

    display:grid;

    place-items:center;

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

    border-radius:13px;

    color:#495C83;

    background:#fff;

    transition:var(--transition);
}


[data-theme="dark"] .icon-btn{
    background:var(--surface-2);
    color:var(--ink-2);
}


.icon-btn:hover{

    color:var(--primary-dark);

    border-color:
        rgba(73,92,131,.11);

    background:var(--wpw-bg-soft-blue);

    transform:translateY(-2px);
}


.icon-btn svg{

    width:19px;
    height:19px;
}


.ico-sun{
    display:none;
}


[data-theme="dark"] .ico-moon{
    display:none;
}


[data-theme="dark"] .ico-sun{
    display:block;
}


.cart-btn{
    position:relative;
}


.cart-count{

    position:absolute;

    top:-5px;
    right:-4px;

    min-width:19px;
    height:19px;

    display:grid;

    place-items:center;

    padding:0 5px;

    border:2px solid white;

    border-radius:999px;

    background:var(--primary);

    color:white;

    font-family:var(--wpw-font-heading);

    font-size:9px;

    font-weight:700;

    line-height:1;
}


[data-theme="dark"] .cart-count{
    border-color:var(--surface-2);
}


.menu-toggle{
    display:none;
}


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

.hero{

    position:relative;

    isolation:isolate;

    overflow:hidden;

    padding:0 0 76px;

    background:

        radial-gradient(
            circle at 76% 40%,
            rgba(73,92,131,.06),
            transparent 29%
        ),

        radial-gradient(
            circle at 15% 15%,
            rgba(70,160,227,.07),
            transparent 25%
        ),

        linear-gradient(
            135deg,
            #ffffff 0%,
            rgba(84,101,142,0.095) 48%,
            rgba(84,101,142,0.120) 100%
        );
}


.hero-bg{

    position:absolute;

    inset:0;

    z-index:-2;

    overflow:hidden;

    pointer-events:none;
}


.hero-bg .orb{

    position:absolute;

    border-radius:50%;

    filter:blur(60px);

    opacity:.55;

    will-change:transform;
}


.hero-bg .orb-1{

    width:460px;
    height:460px;

    top:-120px;
    right:-40px;

    background:
        radial-gradient(
            circle,
            rgba(73,92,131,.16),
            transparent 68%
        );

    animation:
        orbFloat
        18s
        ease-in-out
        infinite;
}


.hero-bg .orb-2{

    width:360px;
    height:360px;

    bottom:-100px;
    left:8%;

    background:
        radial-gradient(
            circle,
            rgba(82,137,232,.35),
            transparent 68%
        );

    animation:
        orbFloat
        22s
        ease-in-out
        infinite;

    animation-delay:-6s;
}


.hero-bg .orb-3{

    width:280px;
    height:280px;

    top:38%;
    left:44%;

    background:
        radial-gradient(
            circle,
            rgba(233,168,59,.28),
            transparent 68%
        );

    animation:
        orbFloat
        26s
        ease-in-out
        infinite;

    animation-delay:-12s;
}


.hero-bg .orb-4{

    width:220px;
    height:220px;

    top:12%;
    left:32%;

    background:
        radial-gradient(
            circle,
            rgba(73,92,131,.065),
            transparent 68%
        );

    animation:
        orbFloat
        24s
        ease-in-out
        infinite;

    animation-delay:-18s;
}


@keyframes orbFloat{

    0%,
    100%{
        transform:translate(0,0) scale(1);
    }

    33%{
        transform:translate(34px,-28px) scale(1.08);
    }

    66%{
        transform:translate(-26px,22px) scale(.94);
    }
}


.hero::before{

    content:"";

    position:absolute;

    inset:0;

    z-index:-1;

    opacity:.42;

    background-image:

        linear-gradient(
            rgba(84,101,142,0.055) 1px,
            transparent 1px
        ),

        linear-gradient(
            90deg,
            rgba(84,101,142,0.055) 1px,
            transparent 1px
        );

    background-size:42px 42px;

    mask-image:
        linear-gradient(
            90deg,
            transparent,
            black 24%,
            black 72%,
            transparent
        );

    -webkit-mask-image:
        linear-gradient(
            90deg,
            transparent,
            black 24%,
            black 72%,
            transparent
        );
}


.hero::after{

    content:"";

    position:absolute;

    width:680px;
    height:680px;

    left:-300px;
    bottom:-420px;

    border-radius:50%;

    border:
        1px solid
        rgba(100,119,157,.08);

    box-shadow:

        0 0 0 55px
        rgba(100,119,157,.025),

        0 0 0 110px
        rgba(100,119,157,.018);

    z-index:-1;
}


/* =========================================================
   HERO FULL WIDTH CARD
   ========================================================= */

.hero-grid{

    width:100%;

    max-width:none;

    margin:0;

    display:grid;

    grid-template-columns:
        minmax(0,1.02fr)
        minmax(0,.98fr);

    align-items:center;

    gap:44px;

    padding:
        42px
        max(
            calc((100% - var(--container)) / 2),
            40px
        )
        54px;

    border:
        0;

    border-bottom:
        1px solid
        rgba(100,33,123,.85);

    border-radius:
        0
        0
        34px
        34px;

    background:

        linear-gradient(
            135deg,
            rgba(255,255,255,.80),
            rgba(84,101,142,0.135)
        );

    box-shadow:

        0 24px 70px
        rgba(230,210,227,.09),

        inset 0 -1px 0
        rgba(255,255,255,.72);

    backdrop-filter:blur(10px);

    -webkit-backdrop-filter:blur(10px);
}


[data-theme="dark"] .hero{

    background:

        radial-gradient(
            circle at 76% 40%,
            rgba(84,101,142,0.135),
            transparent 30%
        ),

        radial-gradient(
            circle at 15% 15%,
            rgba(82,137,232,.10),
            transparent 28%
        ),

        linear-gradient(
            135deg,
            rgba(84,101,142,0.135) 0%,
            rgba(84,101,142,0.135) 50%,
            #0a201e 100%
        );
}


[data-theme="dark"] .hero-grid{

    border-bottom-color:
        rgba(83,53,94,.85);

    background:

        linear-gradient(
            135deg,
            rgba(15,38,36,.88),
            rgba(10,31,29,.82)
        );

    box-shadow:

        0 24px 70px
        rgba(0,0,0,.34),

        inset 0 -1px 0
        rgba(255,255,255,.025);
}


.hero-copy{

    position:relative;

    z-index:4;

    width:min(100%,560px);
}


.hero-title{

    margin:0;

    font-size:
        clamp(
            28px,
            3.35vw,
            42px
        );

    line-height:1.4;

    letter-spacing:-1px;

    color:#0c3734;
}


[data-theme="dark"] .hero-title{
    color:#7A86B6;
}


.hero-title strong{

    color:var(--primary-dark);

    position:relative;
}


.hero-text{

    max-width:540px;

    margin:18px 0 0;

    color:#495C83;

    font-size:14.5px;

    line-height:2;
}


[data-theme="dark"] .hero-text{
    color:#495C83;
}


.hero-actions{

    display:flex;

    align-items:center;

    gap:11px;

    margin-top:26px;

    flex-wrap:wrap;
}


.btn{

    min-height:46px;

    display:inline-flex;

    align-items:center;

    justify-content:center;

    gap:9px;

    padding:0 17px;

    border:
        1px solid
        transparent;

    border-radius:13px;

    font-size:13px;

    font-weight:600;

    transition:var(--transition);

    white-space:nowrap;
}


.btn svg{

    width:17px;
    height:17px;

    flex:none;
}


.btn-primary{

    color:white;

    background:
        linear-gradient(
            135deg,
            #7A86B6,
            #7A86B6
        );

    box-shadow:
        0 13px 26px
        rgba(73,92,131,.06);
}


.btn-primary:hover{

    transform:translateY(-3px);

    box-shadow:
        0 18px 34px
        rgba(73,92,131,.08);
}


.btn-secondary{

    color:var(--primary-dark);

    background:#fff;

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


[data-theme="dark"] .btn-secondary{
    background:var(--surface-2);
}


.btn-secondary:hover{

    border-color:
        rgba(73,92,131,.11);

    background:var(--wpw-bg-soft-blue);

    transform:translateY(-3px);
}


.hero-trust{

    display:flex;

    align-items:center;

    flex-wrap:wrap;

    gap:8px;

    margin-top:24px;
}


.trust-item{

    display:flex;

    align-items:center;

    gap:7px;

    padding:7px 10px;

    border-radius:10px;

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

    border:
        1px solid
        rgba(229,220,235,.9);

    color:#495C83;

    font-size:11px;
}


[data-theme="dark"] .trust-item{

    background:
        rgba(84,101,142,0.135);

    border-color:var(--line);

    color:#495C83;
}


.trust-item svg{

    width:14px;
    height:14px;

    color:var(--primary-dark);

    flex:none;
}


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

.hero-visual{

    position:relative;

    display:grid;

    place-items:center;

    padding:8px 0;
}


.hero-visual::before{

    content:"";

    position:absolute;

    width:390px;
    height:390px;

    border-radius:50%;

    background:
        radial-gradient(
            circle,
            rgba(73,92,131,.05),
            rgba(84,101,142,0.055) 42%,
            transparent 70%
        );

    filter:blur(3px);

    animation:
        heroPulseGlow
        7s
        ease-in-out
        infinite;
}


@keyframes heroPulseGlow{

    0%,
    100%{
        transform:scale(1);
        opacity:.85;
    }

    50%{
        transform:scale(1.08);
        opacity:1;
    }
}


.hero-architecture{

    display:block;

    position:relative;

    z-index:2;

    width:min(560px,100%);

    height:auto;
}


.hero-ring{

    fill:none;

    stroke:#64779D;

    stroke-width:1.3;
}


.hero-line{

    fill:none;

    stroke:#64779D;

    stroke-width:1.4;

    stroke-linecap:round;

    stroke-dasharray:5 7;

    opacity:.65;

    animation:
        heroDash
        14s
        linear
        infinite;
}


@keyframes heroDash{

    to{
        stroke-dashoffset:-240;
    }
}


.hero-node{

    fill:#fff;

    stroke:#64779D;

    stroke-width:1;
}


[data-theme="dark"] .hero-node{

    fill:rgba(35,25,47,.85);

    stroke:#64779D;
}


.hero-core{

    fill:url(#coreGradient);

    stroke:#64779D;

    stroke-width:1.4;
}


.hero-dot{
    fill:#7789AD;
}


.icon-bg{

    fill:#64779D;

    stroke:
        rgba(73,92,131,.08);

    stroke-width:1;
}


[data-theme="dark"] .icon-bg{

    fill:
        rgba(100,119,157,.10);

    stroke:
        rgba(100,119,157,.22);
}


.svg-ic{

    fill:none;

    stroke:#D8DFEC;

    stroke-width:1.6;

    stroke-linecap:round;

    stroke-linejoin:round;
}


[data-theme="dark"] .svg-ic{
    stroke:#7A86B6;
}


.hero-architecture text,
.business-svg text,
.plugin-svg text{

    direction:rtl;

    font-family:var(--wpw-font-body);
}


.svg-h{

    font-family:var(--wpw-font-heading) !important;

    font-weight:700;

    fill:#54658E;
}


.svg-m{
    fill:#64779D;
}


[data-theme="dark"] .svg-h{
    fill:#64779D;
}


[data-theme="dark"] .svg-m{
    fill:#64779D;
}


/* =========================================================
   SVG TYPOGRAPHY
   ========================================================= */

.hero-architecture .svg-h{

    font-size:16px !important;
}


.hero-architecture .svg-m{

    font-size:11px !important;
}


.hero-pulse,
.hero-float-1,
.hero-float-2,
.hero-float-3{

    transform-box:fill-box;

    transform-origin:center;
}


.hero-pulse{

    animation:
        heroPulse
        3.6s
        ease-in-out
        infinite;
}


.hero-float-1{

    animation:
        heroFloat1
        5.5s
        ease-in-out
        infinite;
}


.hero-float-2{

    animation:
        heroFloat2
        6.3s
        ease-in-out
        infinite;
}


.hero-float-3{

    animation:
        heroFloat3
        5.9s
        ease-in-out
        infinite;
}


@keyframes heroPulse{

    0%,
    100%{
        opacity:.6;
        transform:scale(.9);
    }

    50%{
        opacity:1;
        transform:scale(1.15);
    }
}


@keyframes heroFloat1{

    0%,
    100%{
        transform:translateY(0);
    }

    50%{
        transform:translateY(-6px);
    }
}


@keyframes heroFloat2{

    0%,
    100%{
        transform:translateY(0);
    }

    50%{
        transform:translateY(5px);
    }
}


@keyframes heroFloat3{

    0%,
    100%{
        transform:translate(0,0);
    }

    50%{
        transform:translate(-3px,-5px);
    }
}


/* =========================================================
   FEATURED PLUGIN
   ========================================================= */

.featured{

    position:relative;

    margin-top:-34px;

    z-index:5;
}


.featured-card{

    position:relative;

    display:grid;

    grid-template-columns:
        minmax(0,1fr)
        minmax(0,.92fr);

    overflow:hidden;

    border:
        1px solid
        rgba(100,33,123,.9);

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

    background:
        linear-gradient(
            135deg,
            rgba(255,255,255,.98),
            rgba(84,101,142,0.135)
        );

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


[data-theme="dark"] .featured-card{

    background:
        linear-gradient(
            135deg,
            var(--surface),
            var(--surface)
        );

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


.featured-copy{
    padding:48px 52px;
}


.featured-title{

    margin:0;

    font-size:
        clamp(
            24px,
            2.6vw,
            31px
        );

    line-height:1.45;
}


.featured-description{

    max-width:580px;

    margin:15px 0 0;

    color:var(--muted);

    font-size:14px;
}


.featured-points{

    display:grid;

    grid-template-columns:
        repeat(
            2,
            minmax(0,1fr)
        );

    gap:10px;

    margin-top:24px;
}


.featured-point{

    display:flex;

    align-items:center;

    gap:9px;

    padding:10px;

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

    border-radius:12px;

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

    color:#495C83;

    font-size:11px;
}


[data-theme="dark"] .featured-point{

    background:
        rgba(84,101,142,0.135);

    color:#495C83;
}


.featured-point svg{

    width:17px;
    height:17px;

    color:var(--primary-dark);

    flex:none;
}


/* =========================================================
   FEATURED IMAGE
   ========================================================= */

.featured-visual{

    position:relative;

    display:grid;

    place-items:center;

    min-height:390px;

    padding:36px 28px;

    overflow:hidden;

    background:

        radial-gradient(
            circle at 50% 48%,
            rgba(84,101,142,0.135),
            transparent 40%
        ),

        linear-gradient(
            145deg,
            rgba(84,101,142,0.075),
            rgba(84,101,142,0.120)
        );
}


[data-theme="dark"] .featured-visual{

    background:

        radial-gradient(
            circle at 50% 48%,
            rgba(84,101,142,0.135),
            transparent 42%
        ),

        linear-gradient(
            145deg,
            rgba(84,101,142,0.135),
            #0a201e
        );
}


.featured-image-wrap{

    position:relative;

    width:min(470px,100%);

    display:grid;

    place-items:center;

    animation:
        featuredImageFloat
        5.5s
        ease-in-out
        infinite;
}


.featured-image-wrap::before{

    content:"";

    position:absolute;

    width:72%;

    aspect-ratio:1;

    border-radius:50%;

    background:
        radial-gradient(
            circle,
            rgba(73,92,131,.045),
            transparent 70%
        );

    filter:blur(14px);

    animation:
        featuredImageGlow
        4.8s
        ease-in-out
        infinite;
}


.featured-image{

    position:relative;

    z-index:2;

    width:100%;

    max-width:470px;

    height:auto;

    object-fit:contain;

    border-radius:24px;

    filter:
        drop-shadow(
            0 24px 38px
            rgba(54,28,80,.16)
        );
}


@keyframes featuredImageFloat{

    0%,
    100%{
        transform:translate3d(0,0,0)
                   rotate(0deg);
    }

    25%{
        transform:translate3d(4px,-7px,0)
                   rotate(.35deg);
    }

    50%{
        transform:translate3d(0,-11px,0)
                   rotate(-.25deg);
    }

    75%{
        transform:translate3d(-5px,-5px,0)
                   rotate(.3deg);
    }
}


@keyframes featuredImageGlow{

    0%,
    100%{
        transform:scale(.94);
        opacity:.55;
    }

    50%{
        transform:scale(1.05);
        opacity:.9;
    }
}


/* =========================================================
   PRODUCTS
   ========================================================= */

.products-section{

    background:
        linear-gradient(
            180deg,
            #ffffff,
            rgba(84,101,142,0.120)
        );
}


[data-theme="dark"] .products-section{

    background:
        linear-gradient(
            180deg,
            rgba(84,101,142,0.135),
            var(--surface)
        );
}


.category-select-wrap{
    position:relative;
    min-width:235px;
}
.category-select-wrap::before{
    content:"";
    position:absolute;
    inset:0;
    border-radius:16px;
    background:linear-gradient(135deg,rgba(255,255,255,.96),rgba(84,101,142,0.135));
    box-shadow:0 12px 30px rgba(55,30,80,.08);
    pointer-events:none;
}
.category-select-wrap::after{
    content:"";
    position:absolute;
    top:50%;
    left:15px;
    width:7px;
    height:7px;
    border-left:1.8px solid currentColor;
    border-bottom:1.8px solid currentColor;
    color:var(--primary-dark);
    transform:translateY(-65%) rotate(-45deg);
    pointer-events:none;
}
.category-select{
    position:relative;
    z-index:1;
    appearance:none;
    -webkit-appearance:none;
    min-width:235px;
    width:100%;
    height:46px;
    padding:0 16px 0 38px;
    border:1px solid rgba(211,198,226,.95);
    border-radius:16px;
    outline:0;
    color:var(--ink);
    background:transparent;
    font-family:var(--wpw-font-heading);
    font-size:12px;
    font-weight:700;
    cursor:pointer;
    transition:var(--transition);
}
.category-select:hover{
    border-color:rgba(73,92,131,.13);
    box-shadow:0 10px 24px rgba(55,30,80,.09);
    transform:translateY(-1px);
}
.category-select option{
    padding:10px 12px;
    background:#fff;
    color:#54658E;
    font-family:var(--wpw-font-heading);
    font-size:12px;
}


[data-theme="dark"] .category-select-wrap::before{background:linear-gradient(135deg,rgba(20,40,37,.98),rgba(14,31,29,.98));}
[data-theme="dark"] .category-select{color:var(--ink);border-color:var(--line);}
[data-theme="dark"] .category-select option{background:#142824;color:#882da8;}


.category-select:focus{border-color:rgba(100,119,157,.34);box-shadow:0 0 0 4px rgba(100,119,157,.07);}


.product-grid{

    display:grid;

    grid-template-columns:
        repeat(
            4,
            minmax(0,1fr)
        );

    gap:18px;
}


.product-card{

    position:relative;

    display:flex;

    flex-direction:column;

    min-width:0;

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

    border-radius:20px;

    background:white;

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

    transition:
        transform var(--transition),
        box-shadow var(--transition),
        border-color var(--transition);
}


[data-theme="dark"] .product-card{
    background:var(--surface-2);
    border-color:var(--line);
}


.product-card:hover{

    transform:translateY(-6px);

    border-color:#64779D;

    box-shadow:var(--shadow-md);
}


.product-card.operation-open{
    z-index:40;
}


.product-media{

    position:relative;

    padding:11px;
}


.product-image-link{

    display:block;

    overflow:hidden;

    border-radius:15px;

    background:rgba(84,101,142,0.120);
}


.product-image{

    width:100%;

    aspect-ratio:1.32;

    object-fit:cover;

    transition:
        transform
        .5s
        cubic-bezier(.2,.7,.2,1);
}


.product-card:hover .product-image{
    transform:scale(1.045);
}


.product-badges{

    position:absolute;

    top:20px;

    right:20px;
    left:20px;

    display:flex;

    align-items:flex-start;

    justify-content:space-between;

    gap:7px;

    flex-wrap:wrap;

    pointer-events:none;
}


.product-badges .badge{
    pointer-events:auto;
}


/* =========================================================
   BADGES
   ========================================================= */

.badge{

    display:inline-flex;

    align-items:center;

    gap:5px;

    min-height:26px;

    padding:0 11px;

    border-radius:999px;

    font-size:10px;

    font-weight:700;

    letter-spacing:.2px;

    white-space:nowrap;

    border:
        1px solid
        transparent;

    box-shadow:
        0 6px 14px
        rgba(0,0,0,.06);

    position:relative;
}


.badge-category{

    color:#495C83;

    background:
        linear-gradient(
            135deg,
            rgba(84,101,142,0.060),
            rgba(84,101,142,0.075)
        );

    border-color:
        rgba(211,198,226,.9);

    cursor:pointer;

    transition:var(--transition);
}


.badge-category::before{

    content:"";

    width:6px;
    height:6px;

    border-radius:50%;

    background:currentColor;

    opacity:.75;

    flex:none;
}


a.badge-category:hover{

    transform:translateY(-2px);

    box-shadow:
        0 8px 16px
        rgba(0,0,0,.10);

    filter:saturate(1.2);
}


.badge-category.c-woocommerce{

    color:#495C83;

    background:
        linear-gradient(
            135deg,
            rgba(84,101,142,0.045),
            rgba(84,101,142,0.045)
        );

    border-color:#C8B6E2;
}


.badge-category.c-security{

    color:#b91c4a;

    background:
        linear-gradient(
            135deg,
            rgba(84,101,142,0.045),
            rgba(84,101,142,0.045)
        );

    border-color:#D8DDE8;
}


.badge-category.c-performance{

    color:#1e5fb8;

    background:
        linear-gradient(
            135deg,
            #eef5ff,
            #dbe8ff
        );

    border-color:#c4d8fb;
}


.badge-category.c-seo{

    color:#495C83;

    background:
        linear-gradient(
            135deg,
            rgba(84,101,142,0.060),
            rgba(84,101,142,0.075)
        );

    border-color:#A8A4CE;
}


.badge-category.c-management{

    color:#a35709;

    background:
        linear-gradient(
            135deg,
            #fff8ec,
            #ffedcc
        );

    border-color:#f7dba6;
}


.badge-category.c-dev{

    color:#495C83;

    background:
        linear-gradient(
            135deg,
            #F3F4F8,
            #ECEEF5
        );

    border-color:#D8DDE8;
}


.badge-store{

    gap:6px;

    padding:0 12px;

    border-radius:10px;

    color:#fff;

    font-size:10px;

    border:0;

    box-shadow:
        0 8px 18px
        rgba(0,0,0,.16),

        inset 0 1px 0
        rgba(255,255,255,.25);
}


.badge-store::before{
    display:none;
}


.badge-store svg{

    width:12px;
    height:12px;

    flex:none;
}


.badge-free{

    background:
        linear-gradient(
            135deg,
            rgba(84,101,142,0.075),
            #495C83
        );

    box-shadow:
        0 8px 18px
        rgba(229,207,226,.38),

        inset 0 1px 0
        rgba(255,255,255,.25);
}


.badge-sale{

    background:
        linear-gradient(
            135deg,
            #ff8f7d,
            rgba(84,101,142,0.095)
        );

    box-shadow:
        0 8px 18px
        rgba(225,29,72,.34),

        inset 0 1px 0
        rgba(255,255,255,.25);
}


.badge-new{

    background:
        linear-gradient(
            135deg,
            #4f8dfd,
            #2563eb
        );

    box-shadow:
        0 8px 18px
        rgba(37,99,235,.34),

        inset 0 1px 0
        rgba(255,255,255,.25);
}


.badge-popular{

    background:
        linear-gradient(
            135deg,
            #f7b733,
            #e8890c
        );

    box-shadow:
        0 8px 18px
        rgba(232,137,12,.34),

        inset 0 1px 0
        rgba(255,255,255,.25);
}


/* =========================================================
   PRODUCT BODY
   ========================================================= */

.product-body{

    display:flex;

    flex-direction:column;

    flex:1;

    padding:
        4px
        16px
        16px;
}


.product-title{

    margin:8px 0 0;

    font-size:15px;

    line-height:1.65;
}


.product-title a{
    transition:color var(--transition);
}


.product-title a:hover{
    color:var(--primary-dark);
}


.product-excerpt{

    display:-webkit-box;

    -webkit-line-clamp:2;

    -webkit-box-orient:vertical;

    overflow:hidden;

    margin:8px 0 0;

    color:var(--muted);

    font-size:11.5px;

    line-height:1.85;
}


.product-bottom{

    display:flex;

    align-items:center;

    justify-content:space-between;

    gap:10px;

    margin-top:auto;

    padding-top:17px;
}


.product-price{

    color:var(--primary-dark);

    font-size:15px;

    font-weight:700;

    display:inline-flex;

    align-items:baseline;

    gap:4px;
}


.product-price small{

    color:var(--muted);

    font-family:var(--wpw-font-heading);

    font-size:10px;

    font-weight:400;
}


.product-price del{

    color:var(--muted-2);

    font-size:11px;

    font-weight:400;

    text-decoration:line-through;
}


.product-price.free{
    color:#D9DFE8;
}


/* =========================================================
   PRODUCT OPERATIONS
   ========================================================= */

.operations{
    position:relative;
}


.product-operations{

    position:relative;

    flex:none;
}


.operations-toggle{

    width:38px;
    height:38px;

    display:grid;

    place-items:center;

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

    border-radius:12px;

    color:#495C83;

    background:#F3F6FB;

    border-color:rgba(84,101,142,.20);

    box-shadow:0 2px 8px rgba(84,101,142,.06);

    transition:var(--transition);
}


[data-theme="dark"] .operations-toggle{

    background:var(--surface-3);

    color:var(--ink-2);

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


.operations-toggle:hover,
.operations.open .operations-toggle{

    color:#fff;

    background:
        linear-gradient(
            135deg,
            #7A86B6,
            #495C83
        );

    border-color:transparent;

    box-shadow:
        0 8px 18px
        rgba(100,119,157,.16);
}


.operations-toggle svg{

    width:18px;
    height:18px;
}


.product-card .operations-toggle{

    width:36px;
    height:36px;

    border-radius:11px;
}


.product-card .operations-toggle svg{

    width:17px;
    height:17px;
}


.operations-menu{

    position:absolute;

    left:0;

    bottom:calc(100% + 10px);

    z-index:60;

    width:220px;

    padding:8px;

    opacity:0;

    visibility:hidden;

    transform:
        translateY(8px)
        scale(.96);

    transform-origin:bottom left;

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

    border-radius:16px;

    background:#fff;

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

    transition:var(--transition);
}


[data-theme="dark"] .operations-menu{

    background:var(--surface-3);

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


.operations.open .operations-menu{

    opacity:1;

    visibility:visible;

    transform:
        translateY(0)
        scale(1);
}


.operation-item{

    width:100%;

    display:flex;

    align-items:center;

    gap:10px;

    padding:10px 11px;

    border:0;

    border-radius:11px;

    color:#495C83;

    background:#F7F9FC;

    text-align:right;

    font-family:var(--wpw-font-heading);

    font-size:12px;

    font-weight:600;

    transition:var(--transition);

    cursor:pointer;
}


[data-theme="dark"] .operation-item{

    color:var(--ink-2);
}


.operation-item + .operation-item{
    margin-top:2px;
}


.operation-item svg{

    width:17px;
    height:17px;

    flex:none;

    transition:
        transform
        var(--transition);
}


.operation-item:hover{

    color:var(--primary-dark);

    background:var(--wpw-bg-soft-blue);

    transform:translateX(-2px);
}


.operation-item:hover svg{
    transform:scale(1.08);
}


.operation-item.primary{

    color:#fff;

    background:
        linear-gradient(
            135deg,
            #7A86B6,
            #495C83
        );

    box-shadow:
        0 8px 18px
        rgba(73,92,131,.065);
}


.operation-item.primary:hover{

    color:#fff;

    background:
        linear-gradient(
            135deg,
            rgba(84,101,142,0.075),
            #495C83
        );

    box-shadow:
        0 12px 24px
        rgba(73,92,131,.10);

    transform:
        translateX(0)
        translateY(-1px);
}


/* =========================================================
   PAGINATION
   ========================================================= */

.pagination{

    display:flex;

    align-items:center;

    justify-content:center;

    gap:7px;

    margin-top:40px;

    flex-wrap:wrap;
}


.page-btn{

    min-width:38px;

    height:38px;

    display:grid;

    place-items:center;

    padding:0 10px;

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

    border-radius:11px;

    color:#1F2A3D;

    background:white;

    font-size:12px;

    font-weight:600;

    transition:var(--transition);
}


[data-theme="dark"] .page-btn{

    background:var(--surface-2);

    color:var(--ink-2);

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


.page-btn:hover{

    color:var(--primary-dark);

    background:var(--wpw-bg-soft-blue);

    border-color:#495C83;

    transform:translateY(-2px);
}


.page-btn.active{

    color:white;

    border-color:var(--primary);

    background:
        linear-gradient(
            135deg,
            #7A86B6,
            #495C83
        );

    box-shadow:
        0 8px 18px
        rgba(73,92,131,.055);
}


/* =========================================================
   BUSINESS / PLUGIN DEVELOPMENT
   ========================================================= */

.business-section{

    position:relative;

    overflow:hidden;
}


.business-card{

    display:grid;

    grid-template-columns:
        minmax(0,1fr)
        minmax(0,.92fr);

    overflow:hidden;

    border:
        1px solid
        #7A86B6;

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

    background:
        linear-gradient(
            130deg,
            rgba(84,101,142,0.060),
            rgba(84,101,142,0.060)
        );

    box-shadow:var(--shadow-md);
}


[data-theme="dark"] .business-card{

    background:
        linear-gradient(
            130deg,
            var(--surface),
            var(--surface)
        );

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


.business-copy{
    padding:48px 52px;
}


.business-title{

    margin:0;

    font-size:
        clamp(
            24px,
            2.6vw,
            31px
        );

    line-height:1.45;
}


.business-description{

    max-width:560px;

    margin:14px 0 0;

    color:var(--muted);

    font-size:14px;
}


.business-list{

    display:grid;

    grid-template-columns:
        repeat(
            2,
            minmax(0,1fr)
        );

    gap:10px;

    margin:24px 0;

    padding:0;

    list-style:none;
}


.business-list li{

    display:flex;

    align-items:center;

    gap:8px;

    color:#495C83;

    font-size:12px;
}


[data-theme="dark"] .business-list li{
    color:#495C83;
}


.business-list svg{

    width:16px;
    height:16px;

    color:var(--primary-dark);

    flex:none;
}


.business-visual{

    position:relative;

    display:grid;

    place-items:center;

    min-height:450px;

    padding:24px 14px;

    background:
        radial-gradient(
            circle at 50% 48%,
            rgba(73,92,131,.05),
            transparent 45%
        );
}


[data-theme="dark"] .business-visual{

    background:
        radial-gradient(
            circle at 50% 48%,
            rgba(84,101,142,0.135),
            transparent 45%
        );
}


.business-svg{

    display:block;

    position:relative;

    z-index:2;

    width:min(590px,100%);

    height:auto;
}


/* =========================================================
   DEVELOPMENT SVG
   ========================================================= */

.business-svg .dev-panel{

    fill:rgba(255,255,255,.98);

    stroke:#54658E;

    stroke-width:1;
}


.business-svg .dev-card{

    fill:rgba(255,255,255,.98);

    stroke:#64779D;

    stroke-width:1;
}


.business-svg .dev-core{

    fill:url(#devGrad);
}


.business-svg .dev-core-ring{

    fill:none;

    stroke:#64779D;

    stroke-width:1.2;

    stroke-dasharray:4 7;
}


.business-svg .dev-core-center{

    fill:url(#devGrad);
}


.business-svg .dev-icon-bg{

    fill:#64779D;

    stroke:
        rgba(73,92,131,.08);

    stroke-width:1;
}


.business-svg .dev-divider{

    stroke:#E3E7F0;

    stroke-width:1.4;
}


.business-svg .dev-code{
    fill:#7A86B6;
}


.business-svg .dev-chip{

    fill:#64779D;

    stroke:#64779D;

    stroke-width:1;
}


.business-svg .dev-status-on{
    fill:url(#devGrad);
}


.business-svg .dev-highlight{
    fill:url(#devGrad);
}


.business-svg .dev-track{
    fill:#64779D;
}


.business-svg .dev-progress{
    fill:url(#devGrad);
}


.business-svg .dev-line{

    fill:none;

    stroke:#64779D;

    stroke-width:1.3;

    stroke-linecap:round;

    stroke-dasharray:4 7;

    animation:
        heroDash
        14s
        linear
        infinite;
}


.business-svg .dev-dot{
    fill:rgba(100,119,157,.42);
}


.business-svg .dev-pulse{

    transform-box:fill-box;

    transform-origin:center;

    animation:
        heroPulse
        3.8s
        ease-in-out
        infinite;
}


.business-svg .dev-float{

    transform-box:fill-box;

    transform-origin:center;

    animation:
        archFloat
        5.6s
        ease-in-out
        infinite;
}


.business-svg .dev-delay{
    animation-delay:-1.6s;
}


.business-svg .dev-delay2{
    animation-delay:-3.2s;
}


[data-theme="dark"] .business-svg .dev-panel{

    fill:#1B2030;

    stroke:#64779D;
}


[data-theme="dark"] .business-svg .dev-card{

    fill:
        rgba(35,25,47,.92);

    stroke:#64779D;
}


[data-theme="dark"] .business-svg .dev-core-ring{
    stroke:#64779D;
}


[data-theme="dark"] .business-svg .dev-icon-bg{

    fill:
        rgba(100,119,157,.10);

    stroke:
        rgba(100,119,157,.22);
}


[data-theme="dark"] .business-svg .dev-divider{
    stroke:#343B52;
}


[data-theme="dark"] .business-svg .dev-code{
    fill:#263448;
}


[data-theme="dark"] .business-svg .dev-chip{

    fill:#1B2030;

    stroke:#64779D;
}


[data-theme="dark"] .business-svg .dev-track{
    fill:#263448;
}


[data-theme="dark"] .business-svg .dev-line{
    stroke:#64779D;
}


[data-theme="dark"] .business-svg .dev-dot{
    fill:rgba(100,119,157,.22);
}


/* =========================================================
   ARTICLES
   ========================================================= */

.articles-section{
    background:rgba(84,101,142,0.045);
}


[data-theme="dark"] .articles-section{
    background:var(--surface);
}


.article-grid{

    display:grid;

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

    gap:18px;
}


.article-card{

    overflow:hidden;

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

    border-radius:20px;

    background:#fff;

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

    transition:var(--transition);
}


[data-theme="dark"] .article-card{
    background:var(--surface-2);
    border-color:var(--line);
}


.article-card:hover{

    transform:translateY(-5px);

    box-shadow:var(--shadow-md);
}


.article-image-link{

    display:block;

    margin:11px;

    overflow:hidden;

    border-radius:15px;
}


.article-image{

    width:100%;

    aspect-ratio:1.7;

    object-fit:cover;

    background:rgba(84,101,142,0.120);

    transition:
        transform
        .5s
        ease;
}


.article-card:hover .article-image{
    transform:scale(1.04);
}


.article-body{
    padding:7px 17px 19px;
}


.article-meta{

    display:flex;

    align-items:center;

    justify-content:space-between;

    gap:8px;

    color:var(--muted-2);

    font-size:10px;
}


.article-date{

    display:inline-flex;

    align-items:center;

    gap:4px;
}


.article-date svg{

    width:12px;
    height:12px;

    flex:none;
}


.article-category-badge{

    display:inline-flex;

    align-items:center;

    gap:5px;

    padding:3px 10px;

    border-radius:999px;

    color:#495C83;

    background:
        linear-gradient(
            135deg,
            rgba(84,101,142,0.060),
            rgba(84,101,142,0.075)
        );

    border:
        1px solid
        rgba(211,198,226,.9);

    font-family:var(--wpw-font-heading);

    font-size:10px;

    font-weight:700;

    transition:var(--transition);
}


.article-category-badge::before{

    content:"";

    width:5px;
    height:5px;

    border-radius:50%;

    background:currentColor;

    opacity:.75;

    flex:none;
}


.article-category-badge:hover{

    transform:translateY(-2px);

    box-shadow:
        0 8px 16px
        rgba(0,0,0,.10);

    filter:saturate(1.2);
}


.article-title{

    margin:10px 0 0;

    font-size:16px;

    line-height:1.7;
}


.article-title a{
    transition:color var(--transition);
}


.article-title a:hover{
    color:var(--primary-dark);
}


.article-excerpt{

    display:-webkit-box;

    -webkit-box-orient:vertical;

    -webkit-line-clamp:2;

    overflow:hidden;

    margin:8px 0 0;

    color:var(--muted);

    font-size:11.5px;
}


.article-more{

    display:inline-flex;

    align-items:center;

    gap:6px;

    margin-top:13px;

    color:var(--primary-dark);

    font-family:var(--wpw-font-heading);

    font-size:11px;

    font-weight:600;
}


.article-more svg{

    width:14px;
    height:14px;

    transition:
        transform
        var(--transition);
}


.article-more:hover svg{
    transform:translateX(-4px);
}


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

.site-footer{

    position:relative;

    overflow:hidden;

    color:#E3E7F0;

    background:

        radial-gradient(
            circle at 78% 10%,
            rgba(73,92,131,.04),
            transparent 27%
        ),

        linear-gradient(
            145deg,
            rgba(84,101,142,0.135),
            rgba(84,101,142,0.135)
        );
}


.site-footer::before{

    content:"";

    position:absolute;

    inset:0;

    opacity:.09;

    background-image:

        linear-gradient(
            rgba(255,255,255,.5) 1px,
            transparent 1px
        ),

        linear-gradient(
            90deg,
            rgba(255,255,255,.5) 1px,
            transparent 1px
        );

    background-size:46px 46px;

    pointer-events:none;
}


.footer-main{

    position:relative;

    display:grid;

    grid-template-columns:
        1.35fr
        1fr
        1fr
        1.1fr;

    gap:50px;

    padding:
        75px 0 55px;
}


.footer-brand{
    max-width:370px;
}


.footer-brand .brand-title{
    color:white;
}


.footer-brand p{

    margin:18px 0 0;

    color:#B8C1D2;

    font-size:12px;

    line-height:2;
}


.footer-title{

    margin:0 0 17px;

    color:#fff;

    font-size:15px;
}


.footer-links{

    display:grid;

    gap:8px;

    margin:0;

    padding:0;

    list-style:none;
}


.footer-links a{

    color:#B8C1D2;

    font-size:12px;

    transition:var(--transition);

    display:inline-block;
}


.footer-links a:hover{

    color:#A8A4CE;

    transform:translateX(-3px);
}


.footer-contact{

    display:grid;

    gap:10px;
}


.footer-contact-item{

    display:flex;

    align-items:center;

    gap:9px;

    color:#B8C1D2;

    font-size:12px;
}


.footer-contact-item svg{

    width:16px;
    height:16px;

    color:#A8A4CE;

    flex:none;
}


.footer-bottom{

    position:relative;

    display:flex;

    align-items:center;

    justify-content:space-between;

    gap:20px;

    min-height:65px;

    border-top:
        1px solid
        rgba(219,208,226,.11);

    color:#7A86B6;

    font-size:11px;
}


.footer-socials{

    display:flex;

    gap:7px;
}


.footer-social{

    width:35px;
    height:35px;

    display:grid;

    place-items:center;

    border:
        1px solid
        rgba(219,208,226,.14);

    border-radius:10px;

    color:#495C83;

    transition:var(--transition);
}


.footer-social:hover{

    color:#A8A4CE;

    border-color:
        rgba(181,93,212,.4);

    background:
        rgba(73,92,131,.025);

    transform:translateY(-2px);
}


.footer-social svg{

    width:16px;
    height:16px;
}


/* =========================================================
   CONTENT
   ========================================================= */

.entry-content img,
.product-description img,
.woocommerce-Tabs-panel img{

    display:block;

    max-width:100%;

    height:auto;

    margin:22px auto;

    border-radius:15px;
}


.entry-content a,
.product-description a{

    display:inline-flex;

    align-items:center;

    padding:1px 7px;

    border-radius:6px;

    color:var(--primary-dark);

    background:
        rgba(84,101,142,0.060);
}


/* =========================================================
   FOCUS
   ========================================================= */

a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible{

    outline:
        3px solid
        rgba(73,92,131,.10);

    outline-offset:3px;
}


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

@media(max-width:1150px){

    .main-nav{
        display:none;
    }


    .menu-toggle{
        display:grid;
    }


    .hero-grid{

        grid-template-columns:
            minmax(0,1fr)
            minmax(0,1fr);

        gap:30px;

        padding-inline:
            32px;
    }


    .product-grid{

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


    .footer-main{

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

}


@media(max-width:900px){

    .header-inner{
        gap:10px;
    }


    .brand-sub{
        display:none;
    }


    .search-box{
        width:175px;
    }


    .hero-grid{

        grid-template-columns:1fr;

        text-align:center;

        gap:26px;

        padding:
            46px
            28px
            54px;
    }


    .hero-copy{

        width:min(100%,640px);

        margin-inline:auto;
    }


    .hero-title{

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


    .hero-text{
        margin-inline:auto;
    }


    .hero-actions,
    .hero-trust{
        justify-content:center;
    }


    .featured-card,
    .business-card{
        grid-template-columns:1fr;
    }


    .featured-visual{

        order:-1;

        min-height:340px;

        padding:32px 20px;
    }


    .business-visual{

        min-height:400px;

        padding:28px 18px;
    }


    .product-grid{

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


    .article-grid{

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

}


@media(max-width:640px){

    .container{

        width:
            min(
                100% - 26px,
                var(--container)
            );
    }


    .header-topbar{

        min-height:32px;
    }


    .header-topbar-inner{

        min-height:32px;

        grid-template-columns:1fr;

        justify-items:center;

        gap:5px;

        padding:
            6px 0;

        white-space:normal;

        text-align:center;
    }


    .header-slogan-right,
    .header-slogan-left{

        display:none;
    }


    .header-topbar-center{

        font-size:9px;

        text-align:center;
    }


    .header-inner{

        min-height:70px;
    }


    .brand-title{
        font-size:14px;
    }


    .brand-mark{

        width:38px;
        height:38px;

        border-radius:12px;
    }


    .search-box{

        width:42px;

        padding:0;

        justify-content:center;
    }


    .search-box input{
        display:none;
    }


    .header-tools{
        margin-right:auto;
    }


    .hero{

        padding:
            0
            0
            58px;
    }


    .hero-grid{

        width:100%;

        grid-template-columns:1fr;

        gap:22px;

        padding:
            34px
            18px
            40px;

        border-radius:
            0
            0
            24px
            24px;
    }


    .hero-title{

        font-size:
            28px;

        letter-spacing:-.7px;
    }


    .hero-text{
        font-size:13px;
    }


    .hero-visual::before{

        width:280px;
        height:280px;
    }


    .hero-architecture{
        width:100%;
    }


    .featured{

        margin-top:-22px;
    }


    .featured-copy,
    .business-copy{

        padding:
            32px 24px;
    }


    .featured-points,
    .business-list{
        grid-template-columns:1fr;
    }


    .featured-visual{

        min-height:270px;

        padding:
            24px 16px;
    }


    .featured-image-wrap{
        width:min(360px,100%);
    }


    .section-head{

        align-items:flex-start;

        flex-direction:column;

        gap:15px;
    }


    .head-tools{

        width:100%;

        align-items:stretch;
    }


    .category-select{

        width:100%;

        flex:1;
    }


    .product-grid,
    .article-grid{

        grid-template-columns:1fr;
    }


    .product-operations .operations-menu{

        left:auto;

        right:0;

        transform-origin:bottom right;
    }


    .business-visual{

        min-height:310px;

        padding:
            18px 8px;
    }


    .footer-main{

        grid-template-columns:1fr;

        gap:32px;

        padding:
            55px 0 40px;
    }


    .footer-bottom{

        padding:
            18px 0;

        align-items:flex-start;

        flex-direction:column;
    }

}


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

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

    html{
        scroll-behavior:auto;
    }


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

        animation-duration:.01ms !important;

        animation-iteration-count:1 !important;

        transition-duration:.01ms !important;
    }


    .hero-bg .orb,
    .hero-line,
    .dev-line,
    .featured-image-wrap,
    .featured-image-wrap::before{

        animation:none !important;
    }

}


/* Homepage articles more button */
.articles-more-btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    white-space:nowrap;
}

.articles-more-btn svg{
    width:17px;
    height:17px;
    flex:0 0 auto;
}
/* WPWorld 1.13.5: smooth featured-product slider animation */
.wpw-featured-slider{position:relative;display:grid;min-height:420px;isolation:isolate;overflow:hidden}
.wpw-featured-slide{grid-area:1 / 1;display:grid!important;opacity:0;visibility:hidden;pointer-events:none;transform:translate3d(18px,0,0) scale(.992);transition:opacity var(--wpw-featured-transition,.5s) cubic-bezier(.22,.61,.36,1),transform var(--wpw-featured-transition,.5s) cubic-bezier(.22,.61,.36,1),visibility 0s linear var(--wpw-featured-transition,.5s);will-change:opacity,transform}
.wpw-featured-slide.is-active{opacity:1;visibility:visible;pointer-events:auto;transform:none;transition-delay:0s}
.wpw-featured-slide.is-active .featured-copy{animation:wpwFeaturedCopyIn var(--wpw-featured-transition,.5s) cubic-bezier(.22,.61,.36,1) both}
.wpw-featured-slide.is-active .featured-image{animation:wpwFeaturedImageIn var(--wpw-featured-transition,.5s) cubic-bezier(.22,.61,.36,1) .03s both}
.wpw-featured-slider-dots{position:absolute;right:24px;bottom:22px;display:flex;gap:7px;z-index:4;padding:6px 8px;border:1px solid rgba(255,255,255,.56);border-radius:999px;background:rgba(255,255,255,.74);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);box-shadow:0 8px 22px rgba(55,30,80,.08)}
.wpw-featured-dot{width:9px;height:9px;padding:0;border:0;border-radius:50%;background:var(--line-strong,rgba(84,101,142,0.135));cursor:pointer;transition:transform .2s ease,background .2s ease}
.wpw-featured-dot.is-active{transform:scale(1.35);background:var(--primary,#7A86B6)}
.wpw-featured-slide .featured-image-wrap{cursor:pointer}
@media(max-width:760px){.wpw-featured-slider{min-height:0}.wpw-featured-slider-dots{right:50%;transform:translateX(50%);bottom:12px}}

@keyframes wpwFeaturedCopyIn{from{opacity:0;transform:translate3d(0,10px,0)}to{opacity:1;transform:none}}
@keyframes wpwFeaturedImageIn{from{opacity:0;transform:translate3d(-10px,8px,0) scale(.985)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){
  .wpw-featured-slide,.wpw-featured-slide.is-active,.wpw-featured-slide.is-active .featured-copy,.wpw-featured-slide.is-active .featured-image{animation:none!important;transition:none!important;transform:none!important}
}

/* کارت‌های مزیت پایین محصولات — آیکون‌های محلی SVG */
.wpw-feature-strip{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px!important;margin-top:0}
.wpw-feature-card{position:relative;display:flex!important;align-items:center;gap:13px;padding:18px 17px!important;min-height:98px;border:1px solid var(--line,rgba(84,101,142,.14));background:linear-gradient(145deg,var(--surface,#fff),var(--surface-2,rgba(84,101,142,0.045)));box-shadow:0 10px 28px rgba(73,92,131,.055);overflow:hidden}
.wpw-feature-card::after{content:"";position:absolute;width:74px;height:74px;border-radius:50%;left:-32px;bottom:-35px;background:var(--primary-softer,rgba(73,92,131,.025))}
.wpw-feature-icon{position:relative;z-index:1;display:grid;place-items:center;flex:0 0 46px;width:46px;height:46px;border-radius:14px;color:var(--primary,#7A86B6);background:var(--primary-soft,rgba(84,101,142,0.045));border:1px solid rgba(73,92,131,.035)}
.wpw-feature-icon svg{width:24px;height:24px;display:block}
.wpw-feature-card .stat-body{position:relative;z-index:1;min-width:0}
.wpw-feature-card .stat-label{display:block;font-size:12px;font-weight:800;color:var(--ink-2,#405271);margin-bottom:3px}
.wpw-feature-card .stat-value{display:block;font-size:12px;color:var(--muted,#776d86);line-height:1.7}
@media(max-width:950px){.wpw-feature-strip{grid-template-columns:repeat(2,minmax(0,1fr))!important}}
@media(max-width:560px){.wpw-feature-strip{grid-template-columns:1fr!important}.wpw-feature-card{min-height:88px}}


/* WPWorld 1.13.4: automatic WooCommerce featured-product price */
.featured-price{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:12px;padding:12px 15px;border:1px solid rgba(73,92,131,.06);border-radius:15px;background:linear-gradient(135deg,rgba(122,134,182,.055),rgba(255,255,255,.96));box-shadow:0 8px 24px rgba(73,92,131,.025)}
.featured-price-label{font:700 11px/1.6 var(--wpw-font-body);color:#1c0c21}
.featured-price-value{font:800 22px/1.2 var(--wpw-font-heading);color:var(--primary-dark,#495C83);display:flex;align-items:center;gap:8px;white-space:nowrap;direction:rtl}
.featured-price-value .woocommerce-Price-amount{font:inherit}
.featured-price-value del{font-size:13px;color:#17071c;font-weight:600}
.featured-price-value ins{text-decoration:none}
[data-theme="dark"] .featured-price{background:linear-gradient(135deg,rgba(12,50,45,.90),rgba(16,38,36,.96));border-color:rgba(176,96,204,.18);box-shadow:none}
[data-theme="dark"] .featured-price-label{color:#351142}
[data-theme="dark"] .featured-price-value{color:#c076db}
@media(max-width:760px){.featured-price{align-items:flex-start}.featured-price-value{font-size:19px}.featured-price-label{font-size:10px}}


/* WPWorld 1.21.0 — subdued custom plugin development section */
.business-card{
  background:linear-gradient(135deg,rgba(84,101,142,0.055),rgba(84,101,142,0.025) 58%,rgba(255,255,255,.99))!important;
  border-color:rgba(73,92,131,.10)!important;
  box-shadow:0 18px 48px rgba(73,92,131,.07)!important;
}
.business-visual{
  background:radial-gradient(circle at 50% 48%,rgba(84,101,142,0.045),transparent 52%)!important;
}
[data-theme="dark"] .business-card{
  background:linear-gradient(135deg,rgba(35,42,58,.94),rgba(25,30,43,.98))!important;
  border-color:rgba(168,164,206,.12)!important;
}
[data-theme="dark"] .business-visual{
  background:radial-gradient(circle at 50% 48%,rgba(84,101,142,0.050),transparent 52%)!important;
}