/* ===================================================================
   Koore Design Kit — extracted from camp.html so the new homepage
   (home-new.html) and the camp page share one visual language.
   All selectors are .zai-* scoped; nothing here leaks to other pages.
   =================================================================== */

.zai-page {
    --zai-cream: #efe9d7;
    --zai-card: #f4f0e9;
    --zai-ink: #222;
    --zai-muted: #555;
    --main-color: #e24f35;
    --main-color-rgb: 226, 79, 53;
}

.zai-page section .sec-title,
.zai-page section p,
.zai-page section .text,
.zai-page section h1,
.zai-page section h2,
.zai-page section h3,
.zai-page section h4,
.zai-page section h5,
.zai-page section li,
.zai-page section .zai-card,
.zai-page section .zai-faq,
.zai-page section .price-box,
.zai-page section .vintage-process {
    direction: rtl;
    text-align: right;
}

.zai-page .sec-title.centered,
.zai-page .sec-title.centered .sec-title_heading,
.zai-page .centered {
    text-align: center;
}

.zai-page .sec-title_heading.is-accent {
    color: #e24f35;
}

.zai-page .theme-btn .btn-wrap .text-one,
.zai-page .theme-btn .btn-wrap .text-two,
.zai-page .zai-cta-btn {
    direction: rtl;
    unicode-bidi: isolate;
    text-align: center;
}

.zai-page .zai-en {
    direction: ltr;
    unicode-bidi: isolate;
    display: inline-block;
}

.zai-hero {
    position: relative;
    padding: 150px 0 100px;
    background-color: #fff;
    overflow: hidden;
    isolation: isolate;
}

.zai-hero::before {
    content: '';
    position: absolute;
    inset: 0;
    background-image:
        linear-gradient(rgba(226, 79, 53, 0.06) 1px, transparent 1px),
        linear-gradient(90deg, rgba(226, 79, 53, 0.06) 1px, transparent 1px);
    background-size: 48px 48px;
    mask-image: radial-gradient(ellipse 70% 60% at 70% 40%, #000 20%, transparent 75%);
    pointer-events: none;
    z-index: 0;
}

.zai-hero:has(+ .zai-section)::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: clamp(64px, 10vw, 110px);
    pointer-events: none;
    z-index: 3;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, #f9f9f9 100%);
}

.zai-hero + .zai-section {
    margin-top: -1px;
}

.zai-hero .auto-container {
    position: relative;
    z-index: 2;
}

.zai-hero__layout {
    display: flex;
    flex-direction: row-reverse;
    align-items: center;
    justify-content: space-between;
    gap: 48px;
}

.zai-hero__copy {
    flex: 1 1 0%;
    min-width: 0;
    max-width: 640px;
    direction: rtl;
    text-align: right;
}

.zai-hero__visual {
    flex: 0 0 auto;
    width: min(380px, 38%);
    position: relative;
}

.zai-hero__mark {
    position: relative;
    border: 3px solid #e24f35;
    background:
        radial-gradient(circle at 30% 20%, rgba(226, 79, 53, 0.16), transparent 45%),
        radial-gradient(circle at 80% 80%, rgba(226, 79, 53, 0.08), transparent 40%),
        #161616;
    box-shadow:
        14px 14px 0 #e24f35,
        0 0 0 1px rgba(226, 79, 53, 0.2),
        0 0 40px rgba(226, 79, 53, 0.18);
    padding: 36px 28px 28px;
    text-align: center;
    transform: rotate(-2deg);
    animation: zaiMarkFloat 6s ease-in-out infinite alternate;
    overflow: hidden;
}

.zai-hero__mark::before {
    content: '';
    position: absolute;
    inset: -18px;
    border: 2px dashed rgba(226, 79, 53, 0.35);
    border-radius: 4px;
    animation: zaiMarkSpin 18s linear infinite;
    pointer-events: none;
}

.zai-hero__mark::after {
    content: '';
    position: absolute;
    top: -40%;
    left: -60%;
    width: 40%;
    height: 180%;
    background: linear-gradient(90deg, transparent, rgba(226, 79, 53, 0.18), transparent);
    transform: rotate(20deg);
    animation: zaiMarkShine 4.5s ease-in-out infinite;
    pointer-events: none;
}

.zai-hero__mark-logo {
    position: relative;
    z-index: 1;
    display: block;
    width: 100%;
    max-width: 250px;
    height: auto;
    margin: 4px auto 20px;
    filter: brightness(1.28) drop-shadow(0 0 14px rgba(226, 79, 53, 0.5));
    animation: zaiBrandPulse 3.2s ease-in-out infinite;
}

.zai-hero__mark-path {
    position: relative;
    z-index: 1;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 8px;
    margin-top: 22px;
    direction: ltr;
}

.zai-hero__mark-path span {
    border: 1px solid rgba(255, 255, 255, 0.45);
    color: #fff;
    font-size: 11px;
    font-weight: 700;
    padding: 4px 8px;
    background: rgba(0, 0, 0, 0.35);
    animation: zaiChipPop 2.8s ease-in-out infinite;
}

.zai-hero__mark-path span:nth-child(1) { animation-delay: 0s; }
.zai-hero__mark-path span:nth-child(2) { animation-delay: 0.35s; }
.zai-hero__mark-path span:nth-child(3) { animation-delay: 0.7s; }
.zai-hero__mark-path span:nth-child(4) { animation-delay: 1.05s; }

.zai-hero__deco {
    position: absolute;
    inset: 0;
    pointer-events: none;
    z-index: 1;
    overflow: hidden;
}

.zai-hero__deco img {
    position: absolute;
    display: block;
    height: auto;
    max-width: none;
    opacity: 0.92;
    filter: drop-shadow(0 8px 18px rgba(0, 0, 0, 0.18));
    animation: zaiDecoFloat 9s ease-in-out infinite alternate;
}

.zai-hero__deco .d1 { width: 240px; left: 4%; bottom: 12%; }
.zai-hero__deco .d2 { width: 148px; right: 3%; top: 16%; animation-delay: 1.4s; }
.zai-hero__deco .d3 { width: 132px; left: 18%; top: 20%; animation-delay: 0.7s; opacity: 0.88; }

@keyframes zaiMarkFloat {
    from { transform: rotate(-2.5deg) translateY(0); box-shadow: 14px 14px 0 #e24f35, 0 0 28px rgba(226, 79, 53, 0.12); }
    to { transform: rotate(-0.5deg) translateY(-12px); box-shadow: 18px 18px 0 #e24f35, 0 0 52px rgba(226, 79, 53, 0.28); }
}

@keyframes zaiMarkSpin {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}

@keyframes zaiMarkShine {
    0%, 35% { left: -60%; opacity: 0; }
    45% { opacity: 1; }
    65%, 100% { left: 120%; opacity: 0; }
}

@keyframes zaiBrandPulse {
    0%, 100% { filter: brightness(1.28) drop-shadow(0 0 14px rgba(226, 79, 53, 0.5)); }
    50% { filter: brightness(1.38) drop-shadow(0 0 30px rgba(226, 79, 53, 0.9)); }
}

@keyframes zaiChipPop {
    0%, 100% { transform: translateY(0); border-color: rgba(255, 255, 255, 0.35); box-shadow: none; }
    50% { transform: translateY(-3px); border-color: #fff; box-shadow: 0 0 12px rgba(255, 255, 255, 0.25); }
}

@keyframes zaiDecoFloat {
    from { transform: translateY(0) rotate(0deg); }
    to { transform: translateY(-14px) rotate(2deg); }
}

.zai-hero__kicker {
    display: inline-block;
    color: #fff;
    background: #e24f35;
    border: 2px solid #e24f35;
    font-size: 14px;
    font-weight: 800;
    padding: 6px 12px;
    margin-bottom: 18px;
    box-shadow: 3px 3px 0 rgba(226, 79, 53, 0.35);
}

.zai-hero h1 {
    color: #e24f35;
    font-size: clamp(28px, 3.4vw, 42px);
    font-weight: 800;
    line-height: 1.45;
    margin: 0 0 18px;
    text-align: right;
}

.zai-hero__lead {
    color: #555;
    font-size: 17px;
    line-height: 1.9;
    max-width: 100%;
    margin: 0 0 26px;
    text-align: right;
}

.zai-hero__lead + .zai-hero__lead {
    margin-top: -14px;
    margin-bottom: 28px;
}

/* Parent .zai-hero__copy is direction:rtl — do NOT row-reverse or items flip to the left */
.zai-hero__meta {
    display: block;
    width: 100%;
    margin-top: 18px;
    margin-bottom: 0;
}

.zai-hero__meta .zai-chip {
    display: inline-block;
    color: #e24f35;
    font-size: 15px;
    font-weight: 700;
    line-height: 1.6;
    padding: 0;
    border: none;
    background: transparent;
}

.zai-chip--ticker {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    box-sizing: border-box;
    padding: 6px 0;
    border: none;
    color: #e24f35;
    background: transparent;
    overflow: hidden;
    position: relative;
    min-height: 1.2em;
}

.zai-chip__text {
    display: inline-block;
    width: max-content;
    max-width: none;
    white-space: nowrap;
    text-align: center;
    font-weight: 800;
    font-size: inherit;
    line-height: 1.2;
    letter-spacing: 0.01em;
    position: relative;
    z-index: 1;
}

.zai-chip--ticker.is-glitching .zai-chip__text {
    animation: zaiChipGlitch 0.45s steps(2, end) both;
}

.zai-chip--ticker.is-glitching::before,
.zai-chip--ticker.is-glitching::after {
    content: attr(data-text);
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    white-space: nowrap;
    font-weight: 800;
    font-size: inherit;
    pointer-events: none;
    opacity: 0.85;
}

.zai-chip--ticker.is-glitching::before {
    color: #00e5ff;
    clip-path: inset(0 0 55% 0);
    transform: translate(-3px, -1px);
    animation: zaiChipGlitchSlice 0.45s steps(2, end) both;
    z-index: 2;
}

.zai-chip--ticker.is-glitching::after {
    color: #ff2bd6;
    clip-path: inset(45% 0 0 0);
    transform: translate(3px, 1px);
    animation: zaiChipGlitchSlice 0.45s steps(2, end) reverse both;
    z-index: 2;
}

@keyframes zaiChipGlitch {
    0% { transform: translate(0); text-shadow: none; opacity: 1; filter: none; }
    15% { transform: translate(-4px, 1px) skewX(-8deg); text-shadow: 3px 0 #00e5ff, -3px 0 #ff2bd6; opacity: 0.75; filter: contrast(1.4); }
    30% { transform: translate(5px, -2px) skewX(6deg); text-shadow: -4px 0 #00e5ff, 4px 0 #ff2bd6; opacity: 0.55; }
    45% { transform: translate(-2px, 0) skewX(-3deg); clip-path: inset(20% 0 40% 0); opacity: 0.9; }
    60% { transform: translate(3px, 1px); clip-path: inset(0 0 0 0); opacity: 0.7; }
    80% { transform: translate(-1px, 0); text-shadow: 2px 0 #00e5ff, -2px 0 #ff2bd6; }
    100% { transform: translate(0); text-shadow: none; opacity: 1; filter: none; }
}

@keyframes zaiChipGlitchSlice {
    0%, 100% { transform: translate(0); opacity: 0; }
    20% { transform: translate(-6px, 0); opacity: 0.9; }
    40% { transform: translate(7px, -1px); opacity: 0.7; }
    60% { transform: translate(-4px, 1px); opacity: 0.85; }
    80% { transform: translate(3px, 0); opacity: 0.5; }
}

.zai-chip--source {
    display: none !important;
}

.zai-hero .btn-box {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-items: center;
    gap: 14px;
    width: 100%;
    margin-top: 4px;
    margin-bottom: 0;
}

.zai-hero .theme-btn.btn-style-one {
    background-color: #e24f35 !important;
    border-color: #e24f35 !important;
    color: #fff !important;
    box-shadow: 5px 5px 0 rgba(226, 79, 53, 0.35);
}

.zai-hero .theme-btn.btn-style-one .btn-wrap .text-one,
.zai-hero .theme-btn.btn-style-one .btn-wrap .text-two {
    color: #fff !important;
}

.zai-hero .theme-btn.btn-style-one:before {
    background-color: #111 !important;
}

.zai-hero .theme-btn.btn-style-one:hover {
    background-color: #e24f35 !important;
    border-color: #111 !important;
}

.zai-hero__ghost {
    color: #e24f35;
    font-size: 14px;
    font-weight: 700;
    text-decoration: none;
    border-bottom: 1px dashed rgba(226, 79, 53, 0.45);
    padding-bottom: 2px;
    transition: color 0.2s ease;
}

.zai-hero__ghost:hover {
    color: #111;
}

@media (max-width: 991px) {
    .zai-hero {
        padding: 130px 0 80px;
    }

    .zai-hero__layout {
        flex-direction: column;
        align-items: stretch;
        gap: 36px;
    }

    .zai-hero__copy {
        max-width: none;
        order: 1;
    }

    .zai-hero__visual {
        width: 100%;
        max-width: 320px;
        margin: 0 auto;
        order: 0;
    }

    .zai-hero__mark {
        transform: none;
        box-shadow: 10px 10px 0 #e24f35;
    }

    .zai-hero__deco .d1,
    .zai-hero__deco .d3 {
        display: none;
    }
}

.zai-brand-lockup {
    display: flex;
    justify-content: center;
    margin: 0 0 28px;
}

.zai-brand-lockup img {
    display: block;
    width: 100%;
    height: auto;
}

.zai-brand-lockup--mark {
    max-width: 140px;
}

.zai-brand-lockup--tagline {
    max-width: 160px;
}

.zai-brand-lockup--dark img {
    filter: drop-shadow(0 0 18px rgba(226, 79, 53, 0.4));
}

.zai-brand-lockup--float img {
    filter: drop-shadow(0 8px 20px rgba(226, 79, 53, 0.28));
    animation: zaiBrandFloat 4.5s ease-in-out infinite alternate;
    transform-origin: center center;
}

@keyframes zaiBrandFloat {
    from {
        transform: translateY(0) rotate(-2deg) scale(1);
        filter: drop-shadow(0 8px 16px rgba(226, 79, 53, 0.22));
    }
    to {
        transform: translateY(-12px) rotate(2deg) scale(1.04);
        filter: drop-shadow(0 16px 28px rgba(226, 79, 53, 0.4));
    }
}

.zai-section {
    padding: 90px 0;
    position: relative;
    margin-top: -1px;
}

.zai-section > .auto-container {
    position: relative;
    z-index: 1;
}

/* ——— فید نرم بین همه سکشن‌ها ——— */
.zai-section::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: clamp(64px, 10vw, 110px);
    pointer-events: none;
    z-index: 0;
}

.zai-section--cream:has(+ .zai-section--white)::after,
.zai-section--cream:has(+ .zai-section--dark)::after,
.zai-section--cream:has(+ .zai-fullart)::after {
    background: linear-gradient(180deg, rgba(249, 249, 249, 0) 0%, #fff 100%);
}

.zai-section--cream:has(+ .zai-section--light)::after {
    background: none;
}

.zai-section--white:has(+ .zai-section--cream)::after,
.zai-section--dark:has(+ .zai-section--cream)::after {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, #f9f9f9 100%);
}

.zai-section--white:has(+ .zai-section--light)::after,
.zai-section--dark:has(+ .zai-section--light)::after {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, #f9f9f9 100%);
}

.zai-section--light:has(+ .zai-section--cream)::after {
    background: none;
}

.zai-section--light:has(+ .zai-section--white)::after,
.zai-section--light:has(+ .zai-section--dark)::after,
.zai-section--light:has(+ .zai-fullart)::after {
    background: linear-gradient(180deg, rgba(249, 249, 249, 0) 0%, #fff 100%);
}

.zai-section--white:has(+ .zai-fullart)::after,
.zai-section--dark:has(+ .zai-fullart)::after {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, #fff 100%);
}

.zai-section--cream {
    background-color: #f9f9f9;
}

.zai-section--brick {
    position: relative;
    isolation: isolate;
    background-color: var(--zai-cream);
    background-image: none;
}

.zai-section--brick::before {
    content: none;
    display: none;
}

.zai-section--brick > .auto-container {
    position: relative;
    z-index: 1;
}

.zai-section--light {
    background-color: #f9f9f9;
}

.zai-section--white {
    background-color: #fff;
}

.zai-fullart {
    padding: 0;
    overflow: hidden;
    line-height: 0;
}

.zai-fullart__img {
    display: block;
    width: 100%;
    height: auto;
    margin: 0;
}

.zai-section--dark {
    background-color: #fff;
    color: var(--zai-ink);
}

.zai-section--dark .sec-title_heading,
.zai-section--dark .sec-title_text,
.zai-section--dark .sec-title_text p {
    color: #e24f35;
}

/* What-happens steps: title fade + cards from left */
.zai-happens[data-zai-happens] .zai-happens__title {
    opacity: 0;
    transition: opacity 0.7s ease;
}

.zai-happens.is-inview .zai-happens__title {
    opacity: 1;
}

.zai-happens .zai-happens__card {
    opacity: 0;
    transform: translateX(-72px);
    transition:
        opacity 0.37s cubic-bezier(0.22, 1, 0.36, 1),
        transform 0.37s cubic-bezier(0.22, 1, 0.36, 1);
    will-change: transform, opacity;
}

.zai-happens.is-inview .zai-happens__card.is-in {
    opacity: 1;
    transform: translateX(0);
}

.zai-happens.is-inview .zai-happens__card.is-in:hover {
    transform: translate(-2px, -2px);
}

@media (prefers-reduced-motion: reduce) {
    .zai-happens[data-zai-happens] .zai-happens__title,
    .zai-happens .zai-happens__card {
        opacity: 1;
        transform: none;
        transition: none;
    }
}

.zai-outcomes-list > li {
    opacity: 0;
    transform: translateY(-14px);
    transition:
        opacity 0.4s ease,
        transform 0.4s ease;
}

.zai-outcomes-list.is-inview > li.is-in {
    opacity: 1;
    transform: translateY(0);
}

@media (prefers-reduced-motion: reduce) {
    .zai-outcomes-list > li {
        opacity: 1;
        transform: none;
        transition: none;
    }
}

.zai-card {
    background: var(--zai-card);
    border: 2px solid #333;
    box-shadow: 6px 6px 0 rgba(0, 0, 0, 0.08);
    padding: 28px 26px;
    height: 100%;
    transition: transform 0.25s ease, box-shadow 0.25s ease, background-color 0.25s ease;
}

.zai-card.zai-card--fit {
    height: auto;
}

.zai-card.is-typing .zai-type-active::after {
    content: '';
    display: inline-block;
    width: 2px;
    height: 0.9em;
    margin-right: 3px;
    background: #e24f35;
    vertical-align: -0.08em;
    animation: zaiTypeCaret 0.7s step-end infinite;
}

@keyframes zaiTypeCaret {
    50% { opacity: 0; }
}

@media (prefers-reduced-motion: reduce) {
    .zai-card.is-typing .zai-type-active::after {
        display: none;
    }
}

.zai-card:hover {
    transform: translate(-2px, -2px);
    box-shadow: 8px 8px 0 rgba(0, 0, 0, 0.12);
    background: #fff;
}

.zai-card h3,
.zai-card h4,
.zai-card h5 {
    color: var(--zai-ink);
    font-weight: 800;
    margin: 0 0 12px;
    line-height: 1.5;
}

.zai-split .zai-card h3 {
    font-size: 28px;
    line-height: 1.35;
    white-space: nowrap;
    display: inline-block;
    width: max-content;
}

.zai-card p,
.zai-card li {
    color: var(--zai-muted);
    font-size: 15px;
    line-height: 1.85;
    margin: 0;
}

.zai-card .zai-num {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 42px;
    height: 42px;
    padding: 0 10px;
    margin-bottom: 16px;
    border: 2px solid #e24f35;
    background: #e24f35;
    font-weight: 800;
    font-size: 14px;
    color: #fff;
    box-shadow: 2px 2px 0 rgba(226, 79, 53, 0.28);
}

.zai-card .zai-tag {
    display: inline-block;
    margin-top: 16px;
    padding: 6px 12px;
    border: 2px solid var(--main-color);
    color: var(--main-color);
    font-size: 13px;
    font-weight: 700;
    direction: ltr;
    text-align: left;
}

.zai-list {
    list-style: none;
    margin: 0;
    padding: 0;
}

.zai-list li {
    position: relative;
    padding: 10px 28px 10px 0;
    border-bottom: 1px dashed #ccc;
    color: var(--zai-muted);
    font-size: 15px;
    line-height: 1.8;
}

.zai-list li:last-child {
    border-bottom: none;
}

.zai-list li::before {
    content: '';
    position: absolute;
    right: 0;
    top: 18px;
    width: 10px;
    height: 10px;
    background: var(--main-color);
    border: 1px solid #222;
}

.zai-split {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 24px;
}

/* اجازه بده ستون‌ها کوچک شوند تا تیتر nowrap شبکه را پهن نکند */
.zai-split > .zai-card {
    min-width: 0;
}

.zai-split .zai-card.is-yes {
    border-color: #222;
}

.zai-split .zai-card.is-no {
    background: #fff;
    border-color: #333;
    color: var(--zai-ink);
}

.zai-split .zai-card.is-no h3,
.zai-split .zai-card.is-no li {
    color: var(--zai-muted);
}

.zai-split .zai-card.is-no h3 {
    color: var(--zai-ink);
}

.zai-split .zai-card.is-no .zai-list li {
    border-bottom-color: #ccc;
}

.zai-split .zai-card.is-no .zai-list li::before {
    background: #e24f35;
    border-color: #e24f35;
}

.zai-outro {
    max-width: 820px;
    margin: 28px auto 0;
    font-size: 16px;
    line-height: 1.9;
    color: var(--zai-muted);
    text-align: justify;
}

.zai-audience-note {
    margin-top: 24px;
    display: flow-root;
}

.zai-audience-note p {
    margin: 0 0 12px;
    font-size: 16px;
    line-height: 1.9;
    color: var(--zai-muted);
    text-align: justify;
}

.zai-audience-note .centered {
    margin-top: 28px;
}

.price-box-wrap {
    position: relative;
    height: 100%;
    padding-top: 36px;
}

.price-box {
    background: #fff;
    border: 1px solid rgba(226, 79, 53, 0.18);
    border-radius: 4px;
    box-shadow: 0 10px 28px rgba(226, 79, 53, 0.08);
    padding: 44px 20px 24px;
    height: 100%;
    text-align: center;
    transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
}

.price-box__icon {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    z-index: 2;
    width: 72px;
    height: 72px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 2px solid #e24f35;
    background: #fff;
    color: #e24f35;
    font-size: 28px;
    border-radius: 50%;
    box-shadow: 0 8px 20px rgba(226, 79, 53, 0.22);
    transition: transform 0.25s ease, background-color 0.25s ease, color 0.25s ease, box-shadow 0.25s ease;
}

.price-box-wrap:hover .price-box {
    transform: translateY(-4px);
    border-color: #e24f35;
    box-shadow: 0 16px 36px rgba(226, 79, 53, 0.16);
}

.price-box-wrap:hover .price-box__icon {
    background: #e24f35;
    color: #fff;
    transform: translateX(-50%) scale(1.06);
    box-shadow: 0 10px 24px rgba(226, 79, 53, 0.35);
}

.price-box h3 {
    font-size: 14px;
    font-weight: 700;
    margin: 0;
    color: #777;
    text-align: center;
    letter-spacing: 0.01em;
    line-height: 1.4;
}

.price-box .price,
.price-box .val {
    font-size: clamp(20px, 2vw, 26px);
    font-weight: 800;
    color: #e24f35;
    margin: 0;
    line-height: 1.35;
    text-align: center;
}

.price-box .text {
    font-size: 13px;
    color: #666;
    text-align: center;
    line-height: 1.7;
    margin: 4px 0 0;
    max-width: 16em;
}

.zai-stage {
    margin-bottom: 28px;
}

.zai-stage .zai-card {
    padding: 36px 32px;
}

.zai-stage-grid {
    display: grid;
    grid-template-columns: 1.2fr 0.8fr;
    gap: 28px;
    align-items: start;
}

.zai-stage h3 {
    font-size: 22px;
    margin-bottom: 14px;
}

.zai-stage .lead {
    margin-bottom: 18px;
    color: var(--zai-muted);
    line-height: 1.85;
}

.zai-faq {
    border: 2px solid #333;
    background: #fff;
    box-shadow: 4px 4px 0 rgba(0, 0, 0, 0.06);
    margin-bottom: 14px;
}

.zai-faq summary {
    cursor: pointer;
    list-style: none;
    padding: 18px 22px;
    font-weight: 700;
    font-size: 16px;
    color: #222;
    position: relative;
    padding-left: 48px;
}

.zai-faq summary::-webkit-details-marker {
    display: none;
}

.zai-faq summary::after {
    content: '+';
    position: absolute;
    left: 18px;
    top: 50%;
    transform: translateY(-50%);
    width: 28px;
    height: 28px;
    border: 2px solid #333;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
    font-weight: 800;
    background: var(--zai-cream);
}

.zai-faq[open] summary::after {
    content: '–';
    background: var(--main-color);
    color: #fff;
    border-color: #111;
}

.zai-faq .zai-faq__body {
    padding: 0 22px 20px;
    color: #555;
    font-size: 15px;
    line-height: 1.85;
    border-top: 1px dashed #ddd;
    margin-top: -4px;
    padding-top: 16px;
}

.zai-cta-banner {
    position: relative;
    overflow: hidden;
    isolation: isolate;
    background: linear-gradient(135deg, #1a0e09 0%, #3a1409 48%, #120906 100%);
    border: 2px solid #e24f35;
    box-shadow:
        0 0 0 1px rgba(226, 79, 53, 0.25),
        0 24px 60px rgba(226, 79, 53, 0.28);
    padding: 40px 32px 36px;
    text-align: center;
    opacity: 0;
    transform: translateY(28px) scale(0.98);
    transition: opacity 0.7s ease, transform 0.7s cubic-bezier(0.22, 1, 0.36, 1);
}

.zai-cta-banner.is-inview {
    opacity: 1;
    transform: translateY(0) scale(1);
}

.zai-cta-banner__kicker {
    position: relative;
    z-index: 1;
    display: inline-block;
    margin: 0 0 12px;
    padding: 5px 12px;
    font-size: 13px;
    font-weight: 800;
    color: #fff;
    background: #e24f35;
    border: 1px solid rgba(255, 255, 255, 0.2);
    letter-spacing: 0.02em;
    animation: zaiCtaPulse 2.4s ease-in-out infinite;
}

.zai-cta-banner h2 {
    position: relative;
    z-index: 1;
    color: #fff;
    font-size: clamp(18px, 2.1vw, 26px);
    font-weight: 800;
    margin: 0 auto 18px;
    line-height: 1.65;
    text-align: center;
    max-width: min(920px, 92%);
}

.zai-cta-banner__meta {
    position: relative;
    z-index: 1;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 10px;
    margin: 0 0 20px;
}

.zai-cta-banner__meta span {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 8px 14px;
    border: 1px solid rgba(255, 255, 255, 0.22);
    background: rgba(255, 255, 255, 0.06);
    color: #fff;
    font-size: 13px;
    font-weight: 700;
    backdrop-filter: blur(6px);
    direction: rtl;
}

.zai-cta-banner__meta i {
    color: #e24f35;
    font-size: 26px;
    line-height: 1;
    order: -1;
}

.zai-cta-banner .zai-cta-btn {
    position: relative;
    z-index: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 48px;
    padding: 12px 28px;
    background: #fff !important;
    border: 2px solid #fff !important;
    color: #e24f35 !important;
    font-size: 15px;
    font-weight: 800;
    text-decoration: none;
    box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.45);
    animation: zaiCtaBtnPulse 2s ease-out infinite;
    transition: background-color 0.2s ease, color 0.2s ease, transform 0.2s ease;
}

.zai-cta-banner .zai-cta-btn:hover {
    background: #e24f35 !important;
    border-color: #fff !important;
    color: #fff !important;
    transform: translateY(-2px);
}

@keyframes zaiCtaPulse {
    0%, 100% { transform: translateY(0); box-shadow: 0 0 0 0 rgba(226, 79, 53, 0.4); }
    50% { transform: translateY(-2px); box-shadow: 0 8px 18px rgba(226, 79, 53, 0.35); }
}

@keyframes zaiCtaBtnPulse {
    0% { box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.45); }
    70% { box-shadow: 0 0 0 16px rgba(255, 255, 255, 0); }
    100% { box-shadow: 0 0 0 0 rgba(255, 255, 255, 0); }
}

@media (prefers-reduced-motion: reduce) {
    .zai-cta-banner,
    .zai-cta-banner__kicker,
    .zai-cta-banner .zai-cta-btn {
        animation: none !important;
        transition: none !important;
        opacity: 1;
        transform: none;
    }
}

.zai-mentor-soon {
    border: 2px dashed #666;
    background: #fff;
    padding: 48px 24px;
    text-align: center;
    color: #666;
    font-size: 18px;
    font-weight: 700;
}

.vintage-process .step-block_one-inner {
    background: var(--zai-card);
    border: 2px solid #333;
    box-shadow: 4px 4px 0 rgba(0, 0, 0, 0.08);
}

@media (max-width: 991px) {
    .zai-split,
    .zai-stage-grid {
        grid-template-columns: 1fr;
    }

    .zai-section {
        padding: 70px 0;
    }
}

/* ===== Camp-specific ===== */

.zai-hero__mark-word {
    position: relative;
    z-index: 1;
    margin: 4px auto 6px;
    color: #fff;
    direction: rtl;
    text-align: center;
    filter: drop-shadow(0 0 14px rgba(226, 79, 53, 0.45));
    animation: zaiBrandPulse 3.2s ease-in-out infinite;
}

.zai-hero__mark-word .w-lead {
    display: block;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 0.02em;
    color: rgba(255, 255, 255, 0.72);
    margin-bottom: 10px;
}

.zai-hero__mark-word .w-big {
    display: block;
    font-size: clamp(38px, 6vw, 54px);
    font-weight: 900;
    line-height: 1.1;
    color: #fff;
}

.zai-hero__mark-word .w-big-img {
    display: block;
    width: min(100%, 280px);
    height: auto;
    margin: 0 auto;
    filter: drop-shadow(0 0 12px rgba(226, 79, 53, 0.45));
}

.zai-hero__mark-word .w-rule {
    display: block;
    width: 54px;
    height: 4px;
    margin: 14px auto;
    background: #e24f35;
}

.zai-hero__mark-word .w-sub {
    display: block;
    font-size: 15px;
    font-weight: 800;
    line-height: 1.7;
    color: #fff;
}

.zai-hero__mark-path.is-rtl {
    direction: rtl;
}

.zai-hero__mark-path.is-rtl span {
    font-size: 12px;
}

/* مقدارهای بلند در کارت‌های «یک نگاه» */
.price-box .val.is-sm {
    font-size: clamp(15px, 1.3vw, 17px);
    line-height: 1.8;
    font-weight: 700;
    max-width: 17em;
}

.price-box .val.is-md {
    font-size: clamp(17px, 1.6vw, 21px);
}

/* جای‌نگه‌دار محتوایی که هنوز نهایی نشده */
.zai-ph {
    display: inline-block;
    padding: 2px 8px;
    border: 1px dashed rgba(226, 79, 53, 0.55);
    border-radius: 3px;
    background: rgba(226, 79, 53, 0.06);
    color: #a8341f;
    font-size: 0.92em;
    font-weight: 700;
    line-height: 1.7;
}

/* فهرست مرحله‌ای شماره‌دار */
.zai-steps {
    list-style: none;
    counter-reset: zaistep;
    margin: 0;
    padding: 0;
}

.zai-steps li {
    counter-increment: zaistep;
    position: relative;
    padding: 14px 56px 14px 0;
    border-bottom: 1px dashed #ccc;
    color: var(--zai-muted);
    font-size: 16px;
    line-height: 1.8;
}

.zai-steps li:last-child {
    border-bottom: none;
}

.zai-steps li::before {
    content: counter(zaistep);
    position: absolute;
    right: 0;
    top: 12px;
    width: 38px;
    height: 38px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 2px solid #e24f35;
    background: #e24f35;
    color: #fff;
    font-weight: 800;
    font-size: 15px;
    box-shadow: 2px 2px 0 rgba(226, 79, 53, 0.28);
}

/* نقل‌قول / توضیح تکمیلی */
.zai-quote {
    position: relative;
    margin: 26px auto 0;
    max-width: 900px;
    padding: 20px 24px;
    background: #fff;
    border: 2px solid #333;
    border-right: 6px solid #e24f35;
    box-shadow: 6px 6px 0 rgba(0, 0, 0, 0.06);
    color: var(--zai-muted);
    font-size: 15px;
    line-height: 1.9;
}

/* دکمه ثانویه داخل بخش‌ها */
.zai-btn-ghost {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 12px 24px;
    border: 2px solid #e24f35;
    background: transparent;
    color: #e24f35;
    font-size: 15px;
    font-weight: 800;
    text-decoration: none;
    transition: background-color 0.22s ease, color 0.22s ease, box-shadow 0.22s ease, transform 0.22s ease;
}

.zai-btn-ghost:hover {
    background: #e24f35;
    color: #fff;
    transform: translateY(-2px);
    box-shadow: 4px 4px 0 rgba(226, 79, 53, 0.3);
}

/* نوار مهلت ثبت‌نام */
.zai-deadline {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    margin-top: 18px;
    padding: 10px 18px;
    border: 2px solid #222;
    background: #fff;
    color: var(--zai-ink);
    font-size: 15px;
    font-weight: 800;
}

.zai-deadline i {
    color: #e24f35;
}

/* کارت ماه‌های مسیر */
.zai-month {
    height: 100%;
}

.zai-month h3 {
    font-size: 20px;
    margin-bottom: 14px;
}

/* بخش تجربه: کارت‌های عنوانی در گرید */
.zai-happens .row {
    display: flex;
    flex-wrap: wrap;
}

.zai-happens .zai-happens__col {
    display: flex;
}

.zai-happens .zai-happens__card {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    padding: 28px 24px;
    margin: 0;
    text-align: right;
}

.zai-happens .zai-happens__card .zai-num {
    margin-bottom: 14px;
}

.zai-happens .zai-happens__card h4 {
    margin: 0;
    font-size: clamp(16px, 1.5vw, 19px);
    line-height: 1.55;
}

@media (max-width: 767px) {
    .zai-happens .zai-happens__card {
        padding: 22px 18px;
    }
}

@media (max-width: 991px) {
    .zai-steps li {
        padding-right: 50px;
        font-size: 15px;
    }
}

/* عناصر خارج از قاعده‌ی جهت‌دهی پایه، صریحاً راست‌به‌چپ می‌شوند */
.zai-page .zai-quote,
.zai-page .zai-steps,
.zai-page .zai-deadline,
.zai-page section .centered,
.zai-page .zai-faq__body > div {
    direction: rtl;
}

.zai-page .zai-quote {
    text-align: right;
}

.zai-page .zai-btn-ghost {
    direction: rtl;
    unicode-bidi: isolate;
    text-align: center;
}

/* عنوان کارت‌های دوستونی در این صفحه چندخطی می‌شود */
.zai-split .zai-card h3 {
    white-space: normal;
    display: block;
    width: auto;
    font-size: clamp(19px, 2.1vw, 25px);
}
