/* «آخرین پروژه‌های ما»: home page projects showcase (template-parts/projects-showcase.php). */

@font-face {
    font-family:'Vazirmatn';
    src:url('../fonts/Vazirmatn-wght.woff2') format('woff2-variations'), url('../fonts/Vazirmatn-wght.woff2') format('woff2');
    font-weight:100 900;
    font-style:normal;
    font-display:swap;
}

.rp-showcase {
    --rp-green:#1fae52;
    --rp-green-dark:#14903f;
    --rp-ink:#16232e;
    --rp-muted:#4f5d68;
    position:relative;
    overflow:hidden;
    isolation:isolate;
    direction:rtl;
    font-family:'Vazirmatn', IRANSans, Tahoma, sans-serif;
    color:var(--rp-ink);
    background:
        radial-gradient(1200px 520px at 85% 0%, rgba(196,224,246,.75), transparent 60%),
        radial-gradient(900px 480px at 0% 25%, rgba(214,240,224,.8), transparent 60%),
        linear-gradient(180deg, #f3f8fc 0%, #ffffff 45%, #f6fbf8 100%);
    padding:42px 0 120px;
}
.rp-showcase *, .rp-showcase *::before, .rp-showcase *::after { box-sizing:border-box; }
.rp-sprite { position:absolute; width:0; height:0; overflow:hidden; }

/* ---- decoration ---- */
.rp-decor { position:absolute; inset:0; z-index:-1; pointer-events:none; }
.rp-glow { position:absolute; border-radius:50%; filter:blur(10px); }
.rp-glow--blue { width:520px; height:300px; top:-60px; right:-80px; background:radial-gradient(closest-side, rgba(180,214,242,.7), transparent); }
.rp-glow--green { width:460px; height:360px; top:120px; left:-140px; background:radial-gradient(closest-side, rgba(200,236,212,.8), transparent); }
.rp-curves { position:absolute; inset:0; width:100%; height:100%; }
.rp-cloud { position:absolute; filter:drop-shadow(0 6px 14px rgba(120,160,200,.18)); opacity:.95; }
.rp-cloud--1 { width:150px; top:30px; right:15%; }
.rp-cloud--2 { width:210px; top:70px; right:3%; opacity:.85; }
.rp-cloud--3 { width:120px; top:140px; right:24%; opacity:.7; }
.rp-dots {
    position:absolute; top:36px; right:2.5%; width:110px; height:86px;
    background-image:radial-gradient(circle, #34c26a 2.2px, transparent 2.6px);
    background-size:16px 16px;
    opacity:.9;
}
.rp-leaf { position:absolute; filter:drop-shadow(0 10px 14px rgba(30,120,60,.18)); }
.rp-leaf--tl { width:170px; top:6px; left:-34px; transform:rotate(-8deg); }
.rp-leaf--tr { width:62px; top:170px; right:-8px; transform:rotate(20deg); }
.rp-leaf--br { width:170px; bottom:-20px; right:-30px; }
.rp-ground { position:absolute; left:0; right:0; bottom:0; width:100%; height:150px; }
.rp-landscape { position:absolute; right:5%; bottom:22px; width:440px; max-width:42%; }
.rp-blades { animation:rp-spin 9s linear infinite; }
.rp-blades--slow { animation-duration:13s; }
@keyframes rp-spin { to { transform:rotate(360deg); } }

/* ---- heading ---- */
.rp-inner { position:relative; max-width:1280px; margin:0 auto; padding:0 24px; }
.rp-head { text-align:center; }
.rp-eyebrow {
    display:flex; align-items:center; justify-content:center; gap:14px;
    margin:0 0 6px; direction:ltr;
    font-size:13px; font-weight:600; letter-spacing:.14em; color:#33424d;
}
.rp-eyebrow::before, .rp-eyebrow::after { content:''; width:38px; height:2px; border-radius:2px; background:var(--rp-green); }
.rp-title { margin:0; font-size:38px; line-height:1.4; font-weight:800; color:var(--rp-ink); }
.rp-title span { color:var(--rp-green); }
.rp-subtitle { margin:6px 0 0; font-size:17px; font-weight:500; color:var(--rp-muted); }
.rp-head-line { display:block; width:84px; height:3px; margin:16px auto 0; border-radius:3px; background:var(--rp-green); }

/* ---- the slider ---- */
.rp-slider { position:relative; margin-top:34px; outline:none; }
.rp-slider:focus-visible .rp-card.is-active { box-shadow:0 0 0 3px var(--rp-green), 0 24px 50px rgba(20,40,60,.28); }
.rp-stage {
    position:relative; height:var(--rp-card-h, 320px);
    perspective:1400px; perspective-origin:50% 50%;
    direction:ltr;
    touch-action:pan-y;
    -webkit-user-select:none; user-select:none;
    cursor:grab;
}
.rp-slider.is-dragging .rp-stage { cursor:grabbing; }
.rp-card {
    position:absolute; top:50%; left:50%;
    display:block; overflow:hidden;
    border-radius:22px;
    background:#cfd8df;
    color:#fff; text-decoration:none;
    box-shadow:0 22px 46px rgba(20,40,60,.24), 0 4px 10px rgba(20,40,60,.10);
    transform-style:preserve-3d;
    will-change:transform, opacity;
    backface-visibility:hidden;
    direction:rtl;
    -webkit-tap-highlight-color:transparent;
}
.rp-card:hover, .rp-card:focus { color:#fff; text-decoration:none; }
.rp-card-media { position:absolute; inset:0; }
.rp-card-img {
    width:100%; height:100%; object-fit:cover; display:block;
    opacity:0; transition:opacity .45s ease, transform .8s ease;
    pointer-events:none;
}
.rp-card.is-loaded .rp-card-img { opacity:1; }
.rp-card:not(.is-loaded) .rp-card-media {
    background:linear-gradient(100deg, #d7e0e6 30%, #e9eef2 50%, #d7e0e6 70%) 0 0/300% 100%;
    animation:rp-shimmer 1.4s linear infinite;
}
.rp-card.no-image .rp-card-media { animation:none; background:linear-gradient(135deg, #2c7a4b, #1d4f6e); }
.rp-card.is-active:hover .rp-card-img { transform:scale(1.04); }
@keyframes rp-shimmer { to { background-position:-150% 0; } }
.rp-card-shade {
    position:absolute; inset:0;
    background:linear-gradient(180deg, rgba(5,15,25,0) 38%, rgba(5,15,25,.45) 68%, rgba(5,15,25,.82) 100%);
}
.rp-card-swoosh {
    position:absolute; left:-10%; right:-5%; bottom:-30px; height:120px;
    background:
        radial-gradient(120% 70% at 85% 100%, transparent 60%, rgba(60,220,120,.0) 61%),
        linear-gradient(170deg, transparent 55%, rgba(48,214,110,.55) 56%, rgba(48,214,110,0) 64%);
    opacity:0; transition:opacity .4s ease;
    pointer-events:none;
}
.rp-card.is-active .rp-card-swoosh { opacity:1; }
.rp-badge {
    position:absolute; top:18px; right:20px;
    display:inline-flex; align-items:center; gap:7px;
    padding:6px 12px 6px 14px; border-radius:999px;
    background:var(--rp-green); color:#fff;
    font-size:13px; font-weight:700; line-height:1.4;
    box-shadow:0 6px 14px rgba(20,140,70,.35);
    opacity:0; transform:translateY(-6px); transition:opacity .35s ease, transform .35s ease;
}
.rp-badge svg { width:17px; height:17px; color:rgba(255,255,255,.28); }
.rp-badge--in_progress { background:#f0a020; box-shadow:0 6px 14px rgba(200,130,20,.35); }
.rp-badge--planned { background:#2f86d6; box-shadow:0 6px 14px rgba(40,110,190,.35); }
.rp-card.is-active .rp-badge { opacity:1; transform:none; }
.rp-card-body {
    position:absolute; right:0; left:0; bottom:0;
    padding:0 26px 20px;
    display:flex; flex-direction:column; gap:12px;
}
.rp-card-title {
    font-size:26px; font-weight:800; line-height:1.45;
    text-shadow:0 2px 10px rgba(0,0,0,.35);
    display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
}
.rp-card-meta { display:flex; flex-wrap:wrap; align-items:center; gap:0; font-size:14.5px; font-weight:600; }
.rp-meta { display:inline-flex; flex-direction:row-reverse; align-items:center; gap:8px; padding:0 16px; }
.rp-meta:first-child { padding-right:0; }
.rp-meta + .rp-meta { border-right:1px solid rgba(255,255,255,.35); }
.rp-meta svg { width:20px; height:20px; color:#3ddc7a; flex:0 0 auto; }
.rp-card.is-side .rp-card-title { font-size:17px; line-height:1.5; }
.rp-card.is-side .rp-card-body { padding:0 18px 16px; gap:8px; }
.rp-card.is-side .rp-card-meta { font-size:12.5px; }
.rp-card.is-side .rp-meta { padding:0 10px; gap:6px; }
.rp-card.is-side .rp-meta:first-child { padding-right:0; }
.rp-card.is-side .rp-meta svg { width:16px; height:16px; }
.rp-card.is-side .rp-card-meta { flex-wrap:nowrap; overflow:hidden; white-space:nowrap; }
.rp-card.is-side .rp-card-title { -webkit-line-clamp:2; }

/* arrows */
.rp-arrow {
    position:absolute; top:calc(var(--rp-card-h, 320px) / 2); z-index:200;
    display:flex; align-items:center; justify-content:center;
    width:52px; height:52px; margin-top:-26px; padding:0;
    border:0; border-radius:50%;
    background:#fff; color:#1d2b36;
    box-shadow:0 8px 22px rgba(20,40,60,.18);
    cursor:pointer;
    transition:background .25s, color .25s, transform .25s;
}
.rp-arrow svg { width:22px; height:22px; }
.rp-arrow--left { left:-6px; }
.rp-arrow--left svg { transform:scaleX(-1); }
.rp-arrow--right { right:-6px; }
.rp-arrow:hover, .rp-arrow:focus-visible { background:var(--rp-green); color:#fff; outline:none; }
.rp-arrow:active { transform:scale(.94); }

/* dots */
.rp-dots-nav { display:flex; flex-wrap:wrap; justify-content:center; gap:8px; margin:26px auto 0; max-width:640px; direction:rtl; }
.rp-dot {
    width:12px; height:12px; padding:0; border:0; border-radius:999px;
    background:#d3dce2; cursor:pointer;
    transition:width .35s ease, background .35s ease;
}
.rp-dot:hover { background:#a9c9b5; }
.rp-dot.is-active { width:28px; background:var(--rp-green); }
.rp-live { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }

/* loading, empty, error */
.rp-skeleton { position:absolute; inset:0; display:flex; align-items:center; justify-content:center; gap:3%; }
.rp-skeleton span {
    display:block; height:78%; width:22%; border-radius:22px;
    background:linear-gradient(100deg, #e1e8ed 30%, #eff3f6 50%, #e1e8ed 70%) 0 0/300% 100%;
    animation:rp-shimmer 1.4s linear infinite;
}
.rp-skeleton span:nth-child(2) { height:100%; width:46%; }
.rp-slider.is-loading .rp-arrow, .rp-slider.is-loading .rp-dots-nav,
.rp-slider.is-error .rp-arrow, .rp-slider.is-empty .rp-arrow,
.rp-slider.is-single .rp-arrow, .rp-slider.is-single .rp-dots-nav { display:none; }
.rp-slider.is-error .rp-stage, .rp-slider.is-empty .rp-stage { height:auto; min-height:120px; }
.rp-state { text-align:center; padding:30px 10px; color:var(--rp-muted); font-size:16px; }
.rp-state[hidden] { display:none; }
.rp-state-text { margin:0 0 12px; }
.rp-retry {
    font:inherit; font-weight:700; color:#fff; background:var(--rp-green);
    border:0; border-radius:999px; padding:8px 22px; cursor:pointer;
}
.rp-noscript { list-style:none; text-align:center; padding:0; }
.rp-noscript a { color:var(--rp-green-dark); }

/* button */
.rp-cta { text-align:center; margin-top:26px; position:relative; z-index:2; }
.rp-button {
    display:inline-flex; align-items:center; gap:14px;
    padding:12px 30px 12px 14px;
    border-radius:999px;
    background:linear-gradient(180deg, #22b85a, #169a47);
    color:#fff; font-size:16px; font-weight:700; text-decoration:none;
    box-shadow:0 12px 26px rgba(22,154,71,.35);
    transition:transform .25s ease, box-shadow .25s ease;
}
.rp-button:hover, .rp-button:focus { color:#fff; text-decoration:none; transform:translateY(-2px); box-shadow:0 16px 30px rgba(22,154,71,.42); }
.rp-button-icon {
    display:flex; align-items:center; justify-content:center;
    width:32px; height:32px; border-radius:50%;
    background:rgba(255,255,255,.22);
}
.rp-button-icon svg { width:18px; height:18px; }

/* ---- tablet ---- */
@media screen and (max-width:1024px) {
    .rp-showcase { padding:38px 0 130px; }
    .rp-title { font-size:32px; }
    .rp-card-title { font-size:21px; }
    .rp-card.is-side .rp-card-meta { display:none; }
    .rp-card.is-side .rp-card-title { font-size:14px; }
    .rp-card.is-side .rp-card-body { padding:0 12px 12px; }
    .rp-arrow--left { left:-10px; }
    .rp-arrow--right { right:-10px; }
    .rp-landscape { max-width:50%; }
    .rp-leaf--tl { width:120px; }
}

/* ---- phone ---- */
@media screen and (max-width:640px) {
    .rp-showcase { padding:30px 0 110px; }
    .rp-inner { padding:0 16px; }
    .rp-eyebrow { font-size:11.5px; }
    .rp-eyebrow::before, .rp-eyebrow::after { width:26px; }
    .rp-title { font-size:26px; }
    .rp-subtitle { font-size:14.5px; }
    .rp-slider { margin-top:28px; }
    .rp-stage { perspective:none; }
    .rp-card { border-radius:18px; }
    .rp-card-body { padding:0 16px 14px; gap:8px; }
    .rp-card-title { font-size:18px; }
    .rp-card-meta { font-size:12.5px; }
    .rp-meta { padding:0 9px; gap:5px; }
    .rp-meta svg { width:16px; height:16px; }
    .rp-badge { top:12px; right:12px; font-size:11.5px; padding:4px 10px 4px 12px; }
    .rp-arrow { width:40px; height:40px; margin-top:-20px; }
    .rp-arrow svg { width:18px; height:18px; }
    .rp-arrow--left { left:-10px; }
    .rp-arrow--right { right:-10px; }
    .rp-dot { width:9px; height:9px; }
    .rp-dot.is-active { width:22px; }
    .rp-dots-nav { gap:6px; }
    .rp-skeleton span:not(:nth-child(2)) { display:none; }
    .rp-skeleton span:nth-child(2) { width:88%; }
    .rp-landscape { width:260px; max-width:70%; right:2%; bottom:18px; }
    .rp-cloud--3, .rp-leaf--tr { display:none; }
    .rp-cloud--1 { width:90px; right:6%; }
    .rp-cloud--2 { width:120px; }
    .rp-dots { width:70px; height:56px; top:20px; }
    .rp-leaf--tl { width:84px; left:-26px; }
    .rp-leaf--br { width:100px; }
    .rp-ground { height:100px; }
}

@media (prefers-reduced-motion: reduce) {
    .rp-blades { animation:none; }
    .rp-card-img, .rp-badge, .rp-dot { transition:none; }
}
