/* ==========================================================================
   Zagros — Landing & public UI layer (2026 refresh)
   --------------------------------------------------------------------------
   Direction: modern-minimal / editorial. Everything is driven by tokens; the
   only literals here are structural neutrals (hairlines, paper tints) that are
   not brand colours. Brand colours always come from --zg-* custom properties
   so the theme customizer keeps working.
   Load order: tokens.css → style.css → landing.css → (catalog.css / rtl.css)
   ========================================================================== */

/* --------------------------------------------------------------------------
   0. Base & typography
   -------------------------------------------------------------------------- */
.zg-landing {
    background-color: var(--zg-background);
    color: var(--zg-text);
    overflow-x: clip;
}
body {
    font-weight: 400;
    line-height: 1.75;
}
h1, h2, h3, h4 {
    font-weight: 700;
    line-height: 1.28;
    letter-spacing: 0;
    text-wrap: pretty;
}
[dir="ltr"] h1, [dir="ltr"] h2, [dir="ltr"] h3, [dir="ltr"] h4,
[lang="en"] h1, [lang="en"] h2, [lang="en"] h3, [lang="en"] h4 {
    letter-spacing: -0.02em;
}
p { margin: 0; }
ul, ol { margin: 0; padding: 0; list-style: none; }
dl, dd, dt { margin: 0; }
strong { font-weight: 700; }

/* اعداد هم‌عرض تا ستون‌های عددی نلرزند */
.zg-stat__value,
.zg-figure__value,
.zg-offer__index,
.zg-pillar__num {
    font-variant-numeric: tabular-nums;
    font-feature-settings: "tnum" 1;
}

/* لنگرها نباید زیر نوار بالای چسبان پنهان شوند */
[id] { scroll-margin-block-start: 96px; }

/* --------------------------------------------------------------------------
   1. Buttons & inline links
   -------------------------------------------------------------------------- */
.zg-cta {
    --zg-cta-h: 48px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.55rem;
    min-block-size: var(--zg-cta-h);
    padding-inline: 1.5rem;
    border: 1px solid transparent;
    border-radius: var(--zg-radius-xs);
    font-size: 0.9375rem;
    font-weight: 500;
    line-height: 1.2;
    text-decoration: none;
    text-align: center;
    cursor: pointer;
    transition: transform 0.18s ease, background-color 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease, color 0.18s ease;
}
.zg-cta--sm { --zg-cta-h: 40px; padding-inline: 1.1rem; font-size: 0.875rem; }
.zg-cta--block { inline-size: 100%; }

.zg-cta--solid {
    background: var(--zg-primary-dark);
    border-color: var(--zg-primary-dark);
    color: #FFFFFF;
}
.zg-cta--solid:hover { background: var(--zg-primary-light); border-color: var(--zg-primary-light); }

.zg-cta--gold {
    background: var(--zg-accent);
    border-color: var(--zg-accent);
    color: var(--zg-primary-dark);
    font-weight: 700;
}
.zg-cta--gold:hover { background: var(--zg-accent-dark); border-color: var(--zg-accent-dark); color: #FFFFFF; }

@media (hover: hover) and (pointer: fine) {
    .zg-cta--solid:hover,
    .zg-cta--gold:hover {
        transform: translateY(-1px);
        box-shadow: var(--zg-shadow-raised);
    }
}

.zg-cta--ghost {
    background: transparent;
    border-color: var(--zg-line-strong);
    color: var(--zg-primary-dark);
}
.zg-cta--ghost:hover { border-color: var(--zg-primary-dark); }

.zg-ask .zg-cta--ghost,
.zg-masthead .zg-cta--ghost {
    border-color: rgba(255, 255, 255, 0.32);
    color: #FFFFFF;
}
.zg-ask .zg-cta--ghost:hover,
.zg-masthead .zg-cta--ghost:hover {
    background: rgba(255, 255, 255, 0.08);
    border-color: rgba(255, 255, 255, 0.55);
}

.zg-link-arrow {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    color: var(--zg-primary-dark);
    font-size: 0.875rem;
    font-weight: 500;
    text-decoration: none;
    border-block-end: 1px solid transparent;
    transition: border-color 0.18s ease, color 0.18s ease;
}
.zg-link-arrow:hover { border-block-end-color: currentColor; }
.zg-arrow { flex: 0 0 auto; transition: transform 0.18s ease; }
[dir="rtl"] .zg-arrow { transform: scaleX(-1); }
.zg-link-arrow:hover .zg-arrow { transform: translateX(2px); }
[dir="rtl"] .zg-link-arrow:hover .zg-arrow { transform: scaleX(-1) translateX(2px); }

/* --------------------------------------------------------------------------
   2. Top bar
   -------------------------------------------------------------------------- */
.zg-topbar {
    position: sticky;
    inset-block-start: 0;
    z-index: 100;
    background: color-mix(in srgb, var(--zg-surface) 88%, transparent);
    background-color: var(--zg-surface);
    border-block-end: 1px solid var(--zg-line);
    transition: border-color 0.2s ease, background-color 0.2s ease;
}
@supports (backdrop-filter: blur(12px)) {
    .zg-topbar {
        background-color: color-mix(in srgb, var(--zg-surface) 78%, transparent);
        -webkit-backdrop-filter: saturate(1.2) blur(12px);
        backdrop-filter: saturate(1.2) blur(12px);
    }
}
.zg-topbar.is-scrolled { border-block-end-color: var(--zg-line-strong); }
.zg-topbar__inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    min-block-size: 64px;
}
@media (min-width: 900px) {
    .zg-topbar__inner { min-block-size: 72px; }
}

.zg-ident {
    display: inline-flex;
    align-items: center;
    gap: 0.7rem;
    min-inline-size: 0;
    color: var(--zg-primary-dark);
    text-decoration: none;
}
.zg-ident__mark {
    inline-size: 34px;
    block-size: 34px;
    display: grid;
    place-items: center;
    flex: 0 0 auto;
    border: 1px solid var(--zg-line);
    border-radius: var(--zg-radius-xs);
    color: var(--zg-primary-dark);
    background: var(--zg-surface);
}
.zg-ident__mark img { display: block; inline-size: 100%; block-size: 100%; object-fit: contain; }
.zg-ident__text {
    display: flex;
    flex-direction: column;
    min-inline-size: 0;
    line-height: 1.3;
}
.zg-ident__name {
    font-size: 1rem;
    font-weight: 700;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-inline-size: 30ch;
}
.zg-ident__tag {
    font-size: 0.6875rem;
    color: var(--zg-muted);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-inline-size: 42ch;
}
/* سرریز موبایل (۳۲۰–۴۱۴px): پیش از این سه قرص زبان + برگر + برند در یک ردیف
   ~۳۹۴px می‌خواستند و صفحه با overflow-x:hidden «پنهان» می‌شد؛ یعنی کاربر
   اسکرول افقی داشت ولی چیزی نمی‌دید. حالا هر جزء درست جمع می‌شود و در
   باریک‌ترین عرض، برند به یک خط با ellipsis کوتاه می‌رسد. */
@media (max-width: 560px) {
    .zg-ident__tag { display: none; }
    .zg-ident__name { font-size: 0.9375rem; max-inline-size: 18ch; }
    .zg-topbar__inner { gap: 0.6rem; }
    .zg-topbar__tools { gap: 0.35rem; }
    .zg-ident__mark { inline-size: 30px; block-size: 30px; }
}
@media (max-width: 400px) {
    .zg-langs__item { min-inline-size: 36px; min-block-size: 40px; padding-inline: 0.15rem; font-size: 0.6875rem; }
    .zg-ident__name { max-inline-size: 14ch; font-size: 0.875rem; }
    .zg-burger { inline-size: 38px; block-size: 38px; padding: 9px; }
}

.zg-navlist { display: none; }
@media (min-width: 900px) {
    .zg-navlist { display: flex; align-items: center; gap: 1.75rem; }
}
.zg-navlist a {
    position: relative;
    padding-block: 0.35rem;
    color: var(--zg-text);
    font-size: 0.875rem;
    font-weight: 500;
    text-decoration: none;
    transition: color 0.18s ease;
}
.zg-navlist a::after {
    content: "";
    position: absolute;
    inset-inline: 0;
    inset-block-end: 0;
    block-size: 1px;
    background: currentColor;
    transform: scaleX(0);
    transform-origin: var(--zg-origin, left);
    transition: transform 0.2s ease;
}
[dir="rtl"] .zg-navlist a::after { transform-origin: right; }
.zg-navlist a:hover::after,
.zg-navlist a:focus-visible::after { transform: scaleX(1); }

.zg-topbar__tools {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex: 0 0 auto;
}
@media (min-width: 900px) { .zg-topbar__tools { gap: 0.75rem; } }

.zg-langs {
    display: inline-flex;
    align-items: center;
    gap: 0.15rem;
    padding: 0.15rem;
    border: 1px solid var(--zg-line);
    border-radius: var(--zg-radius-xs);
    background: var(--zg-paper-tint);
}
.zg-langs__item {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    /* هدف لمسی: ۴۴px کمینهٔ WCAG 2.5.5؛ پیش از این ۳۴×۳۰ بود و روی موبایل
       سخت زده می‌شد. */
    min-inline-size: 44px;
    min-block-size: 44px;
    padding-inline: 0.4rem;
    border-radius: 1px;
    color: var(--zg-muted);
    font-size: 0.75rem;
    font-weight: 500;
    text-decoration: none;
    transition: background-color 0.15s ease, color 0.15s ease;
}
.zg-langs__item:hover { color: var(--zg-primary-dark); background: var(--zg-surface); }
.zg-langs__item.is-active {
    background: var(--zg-primary-dark);
    color: #FFFFFF;
    font-weight: 700;
}
@media (max-width: 400px) { .zg-langs__item { min-inline-size: 40px; padding-inline: 0.2rem; } }

.zg-topbar__cta { display: none; }
@media (min-width: 640px) { .zg-topbar__cta { display: inline-flex; } }

.zg-burger {
    display: inline-flex;
    flex-direction: column;
    justify-content: center;
    gap: 5px;
    inline-size: 40px;
    block-size: 40px;
    padding: 10px;
    border: 1px solid var(--zg-line);
    border-radius: var(--zg-radius-xs);
    background: var(--zg-surface);
    color: var(--zg-primary-dark);
    cursor: pointer;
}
.zg-burger:hover { border-color: var(--zg-line-strong); }
.zg-burger__line {
    display: block;
    block-size: 1.5px;
    inline-size: 100%;
    background: currentColor;
    transition: transform 0.2s ease, opacity 0.2s ease;
}
.zg-burger[aria-expanded="true"] .zg-burger__line:first-of-type { transform: translateY(3.25px) rotate(45deg); }
.zg-burger[aria-expanded="true"] .zg-burger__line:last-of-type { transform: translateY(-3.25px) rotate(-45deg); }
@media (min-width: 900px) { .zg-burger { display: none; } }

.zg-drawer {
    border-block-start: 1px solid var(--zg-line);
    background: var(--zg-surface);
    box-shadow: 0 24px 40px -32px rgba(9, 19, 31, 0.45);
}
.zg-drawer[hidden] { display: none; }
.zg-drawer__inner {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
    padding-block: 0.75rem 1.25rem;
}
.zg-drawer__inner > a {
    padding-block: 0.85rem;
    border-block-end: 1px solid var(--zg-line-soft);
    color: var(--zg-primary-dark);
    font-size: 0.9375rem;
    font-weight: 500;
    text-decoration: none;
}
.zg-drawer__inner > a:hover { color: var(--zg-accent-dark); }
.zg-drawer__inner > .zg-cta {
    margin-block-start: 1rem;
    border-block-end: 0;
    color: #FFFFFF;
    padding-block: 0;
}

/* --------------------------------------------------------------------------
   3. Masthead
   -------------------------------------------------------------------------- */
.zg-masthead {
    position: relative;
    isolation: isolate;
    background: var(--zg-primary-dark);
    color: #FFFFFF;
    padding-block: clamp(2.5rem, 5vw, 4rem) 0;
    overflow: hidden;
}
.zg-masthead::before {
    content: "";
    position: absolute;
    z-index: -1;
    inset-block-start: -22%;
    inset-inline-end: -12%;
    inline-size: min(48vw, 680px);
    aspect-ratio: 1;
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 50%;
    box-shadow: 0 0 0 72px rgba(255, 255, 255, 0.025), 0 0 0 144px rgba(255, 255, 255, 0.016);
    pointer-events: none;
}
.zg-masthead__grid {
    display: grid;
    gap: clamp(2rem, 4vw, 3.5rem);
    align-items: center;
}
@media (min-width: 960px) {
    .zg-masthead__grid {
        grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.85fr);
        gap: clamp(2.5rem, 5vw, 4.5rem);
    }
}
.zg-masthead__copy { max-inline-size: 660px; }

.zg-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 0.55rem;
    margin-block-end: 1.25rem;
    color: var(--zg-accent-dark);
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    line-height: 1.4;
}
[dir="rtl"] .zg-eyebrow { letter-spacing: 0; }
.zg-eyebrow__dot {
    inline-size: 5px;
    block-size: 5px;
    border-radius: 50%;
    background: currentColor;
    flex: 0 0 auto;
}
.zg-eyebrow--light { color: var(--zg-accent); }

.zg-masthead__title {
    margin: 0 0 1.25rem;
    font-size: clamp(2rem, 4.6vw, 3.5rem);
    line-height: 1.16;
    font-weight: 700;
}
.zg-masthead__lead {
    display: block;
    margin-block-end: 0.35rem;
    color: #C6D2E2;
    font-size: clamp(1.05rem, 1.6vw, 1.35rem);
    font-weight: 500;
}
.zg-masthead__strong {
    display: block;
    color: #FFFFFF;
    font-size: clamp(2rem, 4.6vw, 3.5rem);
    font-weight: 700;
}
.zg-masthead__lede {
    max-inline-size: 56ch;
    margin-block-end: 2rem;
    color: #D5DEEA;
    font-size: clamp(1rem, 1.3vw, 1.0625rem);
    line-height: 1.85;
}
.zg-masthead__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
}

.zg-masthead__figure {
    position: relative;
    margin: 0;
    border: 1px solid rgba(255, 255, 255, 0.18);
    border-radius: var(--zg-radius);
    background: rgba(255, 255, 255, 0.04);
    box-shadow: 0 28px 56px -32px rgba(0, 0, 0, 0.78);
    overflow: hidden;
    aspect-ratio: 16 / 11;
}
.zg-masthead__figure picture {
    display: block;
    inline-size: 100%;
    block-size: 100%;
}
@media (min-width: 960px) {
    .zg-masthead__figure { aspect-ratio: 4 / 3.4; }
}
.zg-masthead__figure img {
    display: block;
    inline-size: 100%;
    block-size: 100%;
    object-fit: cover;
    object-position: 62% center;
    transition: transform 0.7s ease;
}
@media (hover: hover) and (pointer: fine) {
    .zg-masthead__figure:hover img { transform: scale(1.025); }
}
/* لایهٔ هم‌رنگ برند روی عکس تا تصویر با سرمه‌ای صفحه یکی شود */
.zg-masthead__figure::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(6, 22, 45, 0.05) 0%, rgba(6, 22, 45, 0.42) 100%);
    pointer-events: none;
}

.zg-stats {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0;
    margin-block-start: clamp(2rem, 4vw, 3rem);
    border-block-start: 1px solid rgba(255, 255, 255, 0.16);
}
@media (min-width: 760px) {
    .zg-stats { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
.zg-stat {
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
    padding-block: 1.4rem;
    padding-inline-end: 1rem;
    border-block-end: 1px solid rgba(255, 255, 255, 0.1);
}
@media (min-width: 760px) {
    .zg-stat {
        border-block-end: 0;
        border-inline-start: 1px solid rgba(255, 255, 255, 0.12);
        padding-inline: 1.5rem;
    }
    .zg-stat:first-child { border-inline-start: 0; padding-inline-start: 0; }
}
.zg-stat__value {
    color: #FFFFFF;
    font-size: clamp(1.5rem, 2.4vw, 1.9rem);
    font-weight: 700;
    line-height: 1.1;
}
.zg-stat__label {
    color: #A9B8CB;
    font-size: 0.8125rem;
    line-height: 1.5;
    max-inline-size: 22ch;
}

/* --------------------------------------------------------------------------
   4. Certifications strip
   -------------------------------------------------------------------------- */
.zg-certs {
    background: var(--zg-surface);
    border-block-end: 1px solid var(--zg-line);
}
.zg-certs__inner {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.75rem 2rem;
    padding-block: 1.15rem;
}
.zg-certs__title {
    color: var(--zg-muted);
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.06em;
}
[dir="rtl"] .zg-certs__title { letter-spacing: 0; }
.zg-certs__list {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem 1.5rem;
}
.zg-certs__item {
    position: relative;
    color: var(--zg-text);
    font-size: 0.8125rem;
    font-weight: 500;
}
.zg-certs__item + .zg-certs__item::before {
    content: "";
    position: absolute;
    inset-inline-start: -0.8rem;
    inset-block-start: 50%;
    inline-size: 3px;
    block-size: 3px;
    margin-block-start: -1.5px;
    border-radius: 50%;
    background: var(--zg-line-strong);
}

/* --------------------------------------------------------------------------
   5. Sections & block headers
   -------------------------------------------------------------------------- */
.zg-section { padding-block: clamp(3.5rem, 6vw, 6rem); }
.zg-section--light { background: var(--zg-paper-tint); }

.zg-block {
    padding-block: clamp(3.75rem, 6.5vw, 6.5rem);
    background: var(--zg-surface);
}
.zg-block--tint {
    background: var(--zg-paper-tint);
    border-block: 1px solid var(--zg-line-soft);
}
.zg-block__head {
    display: grid;
    gap: 0.5rem;
    max-inline-size: 62ch;
    margin-block-end: clamp(2.25rem, 4vw, 3.5rem);
}
.zg-block__head--split {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    justify-content: space-between;
    gap: 1.25rem;
    max-inline-size: none;
}
.zg-block__head .zg-eyebrow { margin-block-end: 0; }
.zg-block__title {
    margin: 0;
    color: var(--zg-primary-dark);
    font-size: clamp(1.6rem, 2.9vw, 2.35rem);
    font-weight: 700;
    line-height: 1.24;
}
.zg-block__lede {
    max-inline-size: 58ch;
    margin-block-start: 0.35rem;
    color: var(--zg-muted);
    font-size: 1rem;
    line-height: 1.85;
}
@media (min-width: 1000px) {
    .zg-block__head:not(.zg-block__head--split) {
        grid-template-columns: 1fr;
    }
}

/* --------------------------------------------------------------------------
   6. Product offers
   -------------------------------------------------------------------------- */
.zg-offers {
    display: grid;
    gap: clamp(1.75rem, 3vw, 2.75rem);
    grid-template-columns: minmax(0, 1fr);
}
@media (min-width: 840px) {
    .zg-offers { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
.zg-offer {
    display: flex;
    flex-direction: column;
    min-inline-size: 0;
    padding: clamp(1.15rem, 2.4vw, 1.65rem);
    border: 1px solid var(--zg-line);
    border-block-start: 3px solid var(--zg-primary-dark);
    border-radius: var(--zg-radius);
    background: var(--zg-surface);
    box-shadow: var(--zg-shadow-sm);
    transition: transform 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease;
}
.zg-offer:focus-within {
    border-color: var(--zg-accent-dark);
    border-block-start-color: var(--zg-accent-dark);
    box-shadow: var(--zg-shadow-raised);
}
@media (hover: hover) and (pointer: fine) {
    .zg-offer:hover {
        border-color: var(--zg-line-strong);
        border-block-start-color: var(--zg-accent-dark);
        box-shadow: var(--zg-shadow-raised);
        transform: translateY(-3px);
    }
}
.zg-offer__meta {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin-block-end: 0.9rem;
}
.zg-offer__index {
    color: var(--zg-muted);
    font-size: 0.8125rem;
    font-weight: 700;
}
.zg-offer__tag {
    color: var(--zg-accent-dark);
    font-size: 0.75rem;
    font-weight: 700;
}
.zg-offer__title {
    margin: 0 0 0.5rem;
    color: var(--zg-primary-dark);
    font-size: clamp(1.15rem, 1.7vw, 1.3rem);
    line-height: 1.35;
}
.zg-offer__desc {
    margin-block-end: 1.35rem;
    color: var(--zg-muted);
    font-size: 0.9375rem;
    line-height: 1.8;
}
.zg-specs {
    margin-block-end: 1.15rem;
    border-block-start: 1px solid var(--zg-line-soft);
}
.zg-specs__row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 1rem;
    padding-block: 0.55rem;
    border-block-end: 1px solid var(--zg-line-soft);
}
.zg-specs dt {
    color: var(--zg-muted);
    font-size: 0.8125rem;
}
.zg-specs dd {
    color: var(--zg-primary-dark);
    font-size: 0.8125rem;
    font-weight: 500;
    text-align: end;
}
.zg-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem 1rem;
    margin-block-end: 1.75rem;
}
.zg-chip {
    position: relative;
    color: var(--zg-muted);
    font-size: 0.75rem;
    line-height: 1.6;
}
.zg-chip + .zg-chip::before {
    content: "";
    position: absolute;
    inset-inline-start: -0.6rem;
    inset-block-start: 50%;
    inline-size: 3px;
    block-size: 3px;
    margin-block-start: -1.5px;
    border-radius: 50%;
    background: var(--zg-accent);
}
.zg-offer__foot {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.85rem 1.5rem;
    margin-block-start: auto;
    padding-block-start: 1.25rem;
    border-block-start: 1px solid var(--zg-line-soft);
}

/* --------------------------------------------------------------------------
   7. Pillars
   -------------------------------------------------------------------------- */
.zg-pillars {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 0;
}
@media (min-width: 640px) { .zg-pillars { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1040px) { .zg-pillars { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.zg-pillar {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    padding-block: 1.5rem 1.75rem;
    border-block-start: 1px solid var(--zg-line-strong);
}
@media (min-width: 640px) {
    .zg-pillar { padding-inline: 1.5rem; }
    .zg-pillar:nth-child(odd) { padding-inline-start: 0; }
}
@media (min-width: 1040px) {
    .zg-pillar { padding-inline: 1.75rem; }
    .zg-pillar:first-child { padding-inline-start: 0; }
    .zg-pillar + .zg-pillar { border-inline-start: 1px solid var(--zg-line); }
}
.zg-pillar__num {
    color: var(--zg-accent-dark);
    font-size: 0.75rem;
    font-weight: 700;
}
.zg-pillar__title {
    margin: 0;
    color: var(--zg-primary-dark);
    font-size: 1.0625rem;
    line-height: 1.4;
}
.zg-pillar__desc {
    color: var(--zg-muted);
    font-size: 0.875rem;
    line-height: 1.8;
}
.zg-pillar__highlight {
    margin-block-start: auto;
    padding-block-start: 0.75rem;
    color: var(--zg-primary-dark);
    font-size: 0.8125rem;
    font-weight: 500;
}

/* --------------------------------------------------------------------------
   8. Estimator
   -------------------------------------------------------------------------- */
.zg-estimator {
    display: grid;
    gap: clamp(2rem, 4vw, 3.5rem);
    align-items: start;
}
@media (min-width: 900px) {
    .zg-estimator { grid-template-columns: minmax(0, 1fr) minmax(0, 0.85fr); }
}
.zg-estimator__title {
    margin: 0 0 0.65rem;
    color: var(--zg-primary-dark);
    font-size: clamp(1.5rem, 2.6vw, 2.1rem);
    line-height: 1.25;
}
.zg-estimator__lede {
    margin-block-end: 1.75rem;
    color: var(--zg-muted);
    font-size: 0.9375rem;
    line-height: 1.85;
}
.zg-field { display: flex; flex-direction: column; gap: 0.4rem; margin-block-end: 1.15rem; }
.zg-field:last-child { margin-block-end: 0; }
.zg-field__hint {
    color: var(--zg-muted);
    font-size: 0.75rem;
    line-height: 1.5;
}

.zg-presets { display: flex; flex-wrap: wrap; gap: 0.4rem; margin-block-start: 0.55rem; }
.zg-preset {
    min-block-size: 44px;
    padding-inline: 0.8rem;
    border: 1px solid var(--zg-line);
    border-radius: var(--zg-radius-xs);
    background: var(--zg-surface);
    color: var(--zg-muted);
    font-size: 0.75rem;
    font-weight: 500;
    cursor: pointer;
    transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}
.zg-preset:hover { border-color: var(--zg-primary-dark); color: var(--zg-primary-dark); }
.zg-preset[aria-pressed="true"] {
    border-color: var(--zg-primary-dark);
    background: var(--zg-primary-dark);
    color: #FFFFFF;
}

.zg-estimator__copy,
.zg-ask__intro { min-inline-size: 0; }
.zg-estimator__hint {
    margin-block-start: 0.85rem;
    color: var(--zg-accent-dark);
    font-size: 0.8125rem;
    font-weight: 500;
    line-height: 1.6;
}
.zg-estimator__hint[hidden] { display: none; }

.zg-estimator__out {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
    padding: clamp(1.35rem, 3vw, 2rem);
    border: 1px solid var(--zg-line);
    border-radius: var(--zg-radius);
    background: var(--zg-paper-tint);
    box-shadow: var(--zg-shadow);
    overflow: hidden;
}
.zg-estimator__out::before {
    content: "";
    position: absolute;
    inset: 0 0 auto;
    block-size: 3px;
    background: var(--zg-accent);
}
.zg-figures {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0;
}
.zg-figure {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
    padding-inline: 1rem;
    border-inline-start: 1px solid var(--zg-line);
}
.zg-figure:first-child { padding-inline-start: 0; border-inline-start: 0; }
.zg-figure__value {
    color: var(--zg-primary-dark);
    font-size: clamp(1.5rem, 2.6vw, 2rem);
    font-weight: 700;
    line-height: 1.1;
}
.zg-figure__label {
    color: var(--zg-muted);
    font-size: 0.75rem;
    line-height: 1.5;
}
@media (max-width: 500px) {
    .zg-figures { grid-template-columns: minmax(0, 1fr); }
    .zg-figure {
        padding: 0.9rem 0 0;
        border-block-start: 1px solid var(--zg-line);
        border-inline-start: 0;
    }
    .zg-figure:first-child { padding-block-start: 0; border-block-start: 0; }
}

/* --------------------------------------------------------------------------
   9. Projects
   -------------------------------------------------------------------------- */
.zg-projects {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 0.85rem;
}
@media (min-width: 720px) { .zg-projects { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.zg-project {
    display: flex;
    flex-direction: column;
    gap: 0.45rem;
    min-inline-size: 0;
    padding: clamp(1.15rem, 2.4vw, 1.5rem);
    border: 1px solid var(--zg-line);
    border-radius: var(--zg-radius);
    background: var(--zg-surface);
    box-shadow: var(--zg-shadow-sm);
    transition: transform 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease;
}
@media (hover: hover) and (pointer: fine) {
    .zg-project:hover {
        border-color: var(--zg-line-strong);
        box-shadow: var(--zg-shadow);
        transform: translateY(-2px);
    }
}
.zg-project__loc {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    color: var(--zg-accent-dark);
    font-size: 0.75rem;
    font-weight: 700;
}
.zg-project__name {
    margin: 0;
    color: var(--zg-primary-dark);
    font-size: 1.0625rem;
    line-height: 1.4;
}
.zg-project__scope {
    color: var(--zg-muted);
    font-size: 0.875rem;
    line-height: 1.75;
}
.zg-project__mat {
    margin-block-start: 0.35rem;
    color: var(--zg-primary-dark);
    font-size: 0.75rem;
    font-weight: 500;
}

/* --------------------------------------------------------------------------
   10. Article cards (shared with category / search / tag / article pages)
   -------------------------------------------------------------------------- */
.zg-grid--cards {
    display: grid;
    gap: clamp(1.25rem, 2.5vw, 2rem);
    grid-template-columns: minmax(0, 1fr);
}
@media (min-width: 640px) { .zg-grid--cards { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1040px) { .zg-grid--cards { grid-template-columns: repeat(3, minmax(0, 1fr)); } }

.zg-post {
    display: flex;
    flex-direction: column;
    min-inline-size: 0;
    overflow: hidden;
    border: 1px solid var(--zg-line);
    border-radius: var(--zg-radius);
    background: var(--zg-surface);
    box-shadow: var(--zg-shadow-sm);
    transition: transform 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease;
}
.zg-post:focus-within { border-color: var(--zg-accent-dark); box-shadow: var(--zg-shadow-raised); }
@media (hover: hover) and (pointer: fine) {
    .zg-post:hover { border-color: var(--zg-line-strong); box-shadow: var(--zg-shadow-raised); transform: translateY(-3px); }
}

.zg-post__media {
    display: block;
    aspect-ratio: 16 / 9;
    overflow: hidden;
    background: var(--zg-surface-muted);
}
.zg-post__media img {
    inline-size: 100%;
    block-size: 100%;
    object-fit: cover;
    transition: transform 0.4s ease;
}
.zg-post:hover .zg-post__media img { transform: scale(1.02); }

.zg-post__body {
    display: flex;
    flex-direction: column;
    flex: 1;
    gap: 0.6rem;
    padding: clamp(1.1rem, 2vw, 1.5rem);
}
.zg-post__top {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
}
.zg-post__eyebrow {
    position: static;
    inset: auto;
    display: inline-block;
    padding: 0;
    border: 0;
    background: none;
    color: var(--zg-accent-dark);
    font-size: 0.6875rem;
    font-weight: 700;
    border-radius: 0;
    margin: 0;
}
.zg-post__date {
    color: var(--zg-muted);
    font-size: 0.6875rem;
}
.zg-post__title {
    margin: 0;
    font-size: 1.0625rem;
    line-height: 1.45;
}
.zg-post__title a {
    color: var(--zg-primary-dark);
    text-decoration: none;
}
.zg-post__title a:hover { color: var(--zg-accent-dark); }
.zg-post__excerpt {
    color: var(--zg-muted);
    font-size: 0.875rem;
    line-height: 1.75;
}
.zg-post__meta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-block-start: auto;
    padding-block-start: 0.85rem;
    border-block-start: 1px solid var(--zg-line-soft);
    color: var(--zg-muted);
    font-size: 0.75rem;
}
.zg-post__arrow { display: inline-flex; color: var(--zg-primary-dark); transition: transform 0.18s ease; }
.zg-post:hover .zg-post__arrow { transform: translateX(2px); }
[dir="rtl"] .zg-post:hover .zg-post__arrow { transform: translateX(-2px); }

.zg-empty {
    padding: clamp(2.5rem, 5vw, 4rem) 1.5rem;
    border: 1px solid var(--zg-line);
    border-radius: var(--zg-radius-xs);
    background: var(--zg-surface);
    text-align: center;
    color: var(--zg-muted);
}
.zg-empty h3 {
    margin: 0 0 0.5rem;
    color: var(--zg-primary-dark);
    font-size: 1.0625rem;
}
.zg-empty p { font-size: 0.875rem; }

.zg-text-link {
    color: var(--zg-primary-dark);
    font-weight: 500;
    text-decoration: underline;
    text-decoration-thickness: 1px;
    text-underline-offset: 0.25em;
}
.zg-text-link:hover { text-decoration-color: var(--zg-accent); }

/* --------------------------------------------------------------------------
   11. FAQ
   -------------------------------------------------------------------------- */
.zg-faq {
    display: grid;
    gap: 0.65rem;
    max-inline-size: 860px;
}
.zg-faq__item {
    border: 1px solid var(--zg-line);
    border-radius: var(--zg-radius-sm);
    background: var(--zg-surface);
    transition: border-color 0.18s ease, box-shadow 0.18s ease;
}
.zg-faq__item[open] {
    border-color: var(--zg-line-strong);
    box-shadow: var(--zg-shadow-sm);
}
.zg-faq__q {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    padding: 1.05rem 1.15rem;
    color: var(--zg-primary-dark);
    font-size: 1rem;
    font-weight: 500;
    line-height: 1.6;
    cursor: pointer;
    list-style: none;
}
.zg-faq__q::-webkit-details-marker { display: none; }
.zg-faq__q:hover { color: var(--zg-accent-dark); }
.zg-faq__icon {
    position: relative;
    inline-size: 14px;
    block-size: 14px;
    flex: 0 0 auto;
}
.zg-faq__icon::before,
.zg-faq__icon::after {
    content: "";
    position: absolute;
    inset-block-start: 50%;
    inset-inline-start: 50%;
    background: currentColor;
    transition: transform 0.2s ease, opacity 0.2s ease;
}
.zg-faq__icon::before { inline-size: 14px; block-size: 1.5px; transform: translate(-50%, -50%); }
.zg-faq__icon::after { inline-size: 1.5px; block-size: 14px; transform: translate(-50%, -50%); }
[dir="rtl"] .zg-faq__icon::before { transform: translate(50%, -50%); }
[dir="rtl"] .zg-faq__icon::after { transform: translate(50%, -50%); }
.zg-faq__item[open] .zg-faq__icon::after { transform: translate(-50%, -50%) scaleY(0); opacity: 0; }
[dir="rtl"] .zg-faq__item[open] .zg-faq__icon::after { transform: translate(50%, -50%) scaleY(0); }
.zg-faq__a {
    max-inline-size: 72ch;
    padding: 0 1.15rem 1.3rem;
    color: var(--zg-muted);
    font-size: 0.9375rem;
    line-height: 1.85;
}

/* --------------------------------------------------------------------------
   12. Ask (RFQ) section
   -------------------------------------------------------------------------- */
.zg-ask {
    position: relative;
    isolation: isolate;
    background: var(--zg-primary-dark);
    color: #FFFFFF;
    padding-block: clamp(3.75rem, 6.5vw, 6.5rem);
    overflow: hidden;
}
.zg-ask::before {
    content: "";
    position: absolute;
    z-index: -1;
    inset-block-end: -52%;
    inset-inline-end: -10%;
    inline-size: min(52vw, 720px);
    aspect-ratio: 1;
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 50%;
    box-shadow: 0 0 0 72px rgba(255, 255, 255, 0.022), 0 0 0 144px rgba(255, 255, 255, 0.014);
    pointer-events: none;
}
.zg-ask__grid {
    display: grid;
    gap: clamp(2.25rem, 4vw, 3.75rem);
    align-items: start;
}
@media (min-width: 960px) {
    .zg-ask__grid { grid-template-columns: minmax(0, 0.85fr) minmax(0, 1fr); }
}
.zg-ask__title {
    margin: 0 0 0.85rem;
    color: #FFFFFF;
    font-size: clamp(1.6rem, 2.9vw, 2.35rem);
    line-height: 1.24;
}
.zg-ask__lede {
    max-inline-size: 48ch;
    margin-block-end: 1.75rem;
    color: #C9D4E2;
    font-size: 0.9375rem;
    line-height: 1.85;
}
.zg-ask__steps {
    display: grid;
    gap: 0.6rem;
    max-inline-size: 48ch;
    margin-block-end: 1.75rem;
}
.zg-ask__step {
    display: grid;
    grid-template-columns: 2rem minmax(0, 1fr);
    align-items: center;
    gap: 0.65rem;
    color: #DCE4EE;
    font-size: 0.875rem;
    line-height: 1.6;
}
.zg-ask__step-num {
    display: grid;
    inline-size: 1.75rem;
    block-size: 1.75rem;
    place-items: center;
    border: 1px solid rgba(255, 255, 255, 0.25);
    border-radius: 50%;
    color: var(--zg-accent);
    font-size: 0.75rem;
    font-weight: 700;
}
.zg-contact {
    display: flex;
    flex-direction: column;
    gap: 0.85rem;
    margin-block-end: 1.75rem;
}
.zg-contact li {
    display: flex;
    align-items: center;
    gap: 0.7rem;
    color: #DCE4EE;
    font-size: 0.875rem;
}
.zg-contact li svg { flex: 0 0 auto; color: var(--zg-accent); }
.zg-contact a {
    color: inherit;
    text-decoration: none;
    border-block-end: 1px solid transparent;
    transition: border-color 0.15s ease;
}
.zg-contact a:hover { border-block-end-color: currentColor; }

.zg-ask__panel .zg-form {
    padding: clamp(1.25rem, 3vw, 2rem);
    border: 1px solid rgba(255, 255, 255, 0.16);
    border-radius: var(--zg-radius);
    background: rgba(255, 255, 255, 0.055);
    box-shadow: 0 28px 56px -38px rgba(0, 0, 0, 0.78);
}
@supports (backdrop-filter: blur(10px)) {
    .zg-ask__panel .zg-form {
        background: rgba(255, 255, 255, 0.075);
        -webkit-backdrop-filter: blur(10px);
        backdrop-filter: blur(10px);
    }
}

/* --------------------------------------------------------------------------
   13. Forms (shared: landing form + modal)
   -------------------------------------------------------------------------- */
.zg-form { margin: 0; }
.zg-form-grid {
    display: grid;
    gap: 0 1rem;
    grid-template-columns: minmax(0, 1fr);
}
@media (min-width: 620px) {
    .zg-form-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
.zg-form-group {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
    margin-block-end: 1rem;
}
.zg-form-label {
    color: var(--zg-primary-dark);
    font-size: 0.8125rem;
    font-weight: 500;
}
.zg-form-input,
.zg-form-select,
.zg-form-textarea {
    inline-size: 100%;
    min-block-size: 44px;
    padding: 0.6rem 0.8rem;
    border: 1px solid var(--zg-line-strong);
    border-radius: var(--zg-radius-xs);
    background: var(--zg-surface);
    color: var(--zg-text);
    font-size: 0.9375rem;
    line-height: 1.5;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
.zg-form-textarea { min-block-size: 96px; resize: vertical; }
.zg-form-select { appearance: none; padding-inline-end: 2rem; background-image: linear-gradient(45deg, transparent 50%, currentColor 50%), linear-gradient(135deg, currentColor 50%, transparent 50%); background-position: calc(100% - 1.1rem) 52%, calc(100% - 0.75rem) 52%; background-size: 5px 5px, 5px 5px; background-repeat: no-repeat; }
[dir="rtl"] .zg-form-select { background-position: 1.1rem 52%, 0.75rem 52%; }
.zg-form-input::placeholder,
.zg-form-textarea::placeholder { color: var(--zg-muted); opacity: 1; }
/* فوکوس فیلدها: حلقهٔ سراسری حذف نمی‌شود، فقط تقویت می‌شود. پیش از این
   `outline:none` با یک سایهٔ کم‌رنگ جایگزین می‌شد و روی پس‌زمینهٔ روشن
   تقریباً دیده نمی‌شد (کاربر کیبورد گم می‌شد). */
.zg-form-input:focus-visible,
.zg-form-select:focus-visible,
.zg-form-textarea:focus-visible {
    border-color: var(--zg-accent-dark);
    outline: 3px solid var(--zg-focus);
    outline-offset: 2px;
    box-shadow: 0 0 0 3px var(--zg-accent-glow);
}
.zg-form__trap {
    position: absolute;
    inset-inline-start: -9999px;
    inline-size: 1px;
    block-size: 1px;
    opacity: 0;
    pointer-events: none;
}
.zg-form__hint {
    margin-block-start: 0.7rem;
    color: var(--zg-muted);
    font-size: 0.75rem;
}
.zg-form-status {
    margin-block: 0 0.85rem;
    padding: 0.6rem 0.8rem;
    border-radius: var(--zg-radius-xs);
    font-size: 0.8125rem;
    font-weight: 500;
    line-height: 1.6;
}
.zg-form-status[data-state="ok"] {
    background: #E7F4EC;
    border: 1px solid #B7E2C9;
    color: #18563A;
}
.zg-form-status[data-state="error"] {
    background: #FBEAE8;
    border: 1px solid #F2C7C3;
    color: #8B2C28;
}
.zg-form-status[hidden] { display: none; }
.zg-form .zg-cta[aria-busy="true"] { opacity: 0.7; cursor: progress; }

/* نسخهٔ تیره (بخش استعلام) */
.zg-ask .zg-form-label { color: #D6DEE8; }
.zg-ask .zg-form-input,
.zg-ask .zg-form-select,
.zg-ask .zg-form-textarea {
    background: rgba(255, 255, 255, 0.05);
    border-color: rgba(255, 255, 255, 0.22);
    color: #FFFFFF;
}
.zg-ask .zg-form-input::placeholder,
.zg-ask .zg-form-textarea::placeholder { color: #94A3B8; }
.zg-ask .zg-form-input:focus,
.zg-ask .zg-form-select:focus,
.zg-ask .zg-form-textarea:focus {
    border-color: var(--zg-accent);
    box-shadow: 0 0 0 3px rgba(212, 168, 63, 0.16);
}
.zg-ask .zg-form-select option { color: #142033; background: #FFFFFF; }
.zg-ask .zg-form__hint { color: #9FB0C6; }

/* --------------------------------------------------------------------------
   14. Mobile action bar
   -------------------------------------------------------------------------- */
.zg-mobilebar {
    position: fixed;
    inset-block-end: 0;
    inset-inline: 0;
    z-index: 90;
    display: flex;
    gap: 0.5rem;
    padding: 0.6rem max(0.75rem, env(safe-area-inset-inline-start)) calc(0.6rem + env(safe-area-inset-bottom)) max(0.75rem, env(safe-area-inset-inline-end));
    background: rgba(255, 255, 255, 0.96);
    border-block-start: 1px solid var(--zg-line);
    box-shadow: 0 -12px 32px -24px rgba(9, 19, 31, 0.4);
}
.zg-mobilebar .zg-cta { flex: 1 1 0; }
.zg-mobilebar .zg-cta--ghost { display: none; }
@media (min-width: 400px) { .zg-mobilebar .zg-cta--ghost { display: inline-flex; } }
@media (min-width: 768px) { .zg-mobilebar { display: none; } }
.zg-mobilebar[hidden] { display: none; }
body.is-modal-open .zg-mobilebar { display: none; }

/* --------------------------------------------------------------------------
   15. Footer
   -------------------------------------------------------------------------- */
.zg-foot {
    background: var(--zg-primary-dark);
    color: #C3CFDD;
    padding-block: clamp(3rem, 5vw, 4.5rem) 1.75rem;
}
.zg-foot__grid {
    display: grid;
    gap: 2.5rem;
    grid-template-columns: minmax(0, 1fr);
    padding-block-end: clamp(2rem, 4vw, 3rem);
}
@media (min-width: 640px) { .zg-foot__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1040px) { .zg-foot__grid { grid-template-columns: 1.4fr 0.9fr 1fr 1fr; gap: 3rem; } }
.zg-foot__col { min-inline-size: 0; }
.zg-foot__col--brand { display: flex; flex-direction: column; gap: 0.75rem; }
.zg-foot__col--brand .zg-foot__name { margin-block-end: 0; }
.zg-foot__name {
    margin-block-end: 0.75rem;
    color: #FFFFFF;
    font-size: 1.0625rem;
    font-weight: 700;
}
.zg-foot__about {
    max-inline-size: 40ch;
    color: #A9B8CB;
    font-size: 0.8125rem;
    line-height: 1.85;
}
.zg-foot__title {
    margin: 0 0 1rem;
    color: #FFFFFF;
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.06em;
}
[dir="rtl"] .zg-foot__title { letter-spacing: 0; }
.zg-foot__col > a,
.zg-foot__socials a {
    display: block;
    padding-block: 0.3rem;
    color: #C3CFDD;
    font-size: 0.8125rem;
    text-decoration: none;
    transition: color 0.15s ease;
}
.zg-foot__col > a:hover,
.zg-foot__socials a:hover { color: #FFFFFF; }
.zg-foot__col > p {
    color: #A9B8CB;
    font-size: 0.8125rem;
    line-height: 1.8;
    margin-block-end: 0.5rem;
}
.zg-foot__socials { display: flex; flex-wrap: wrap; gap: 0 1.25rem; }
.zg-foot__socials a { display: inline-block; }
.zg-foot__bottom {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem 1.5rem;
    padding-block-start: 1.5rem;
    border-block-start: 1px solid rgba(255, 255, 255, 0.12);
    color: #93A4B8;
    font-size: 0.75rem;
}
.zg-foot__bottom p { margin: 0; }
.zg-foot__legal { color: #7F8FA3; }

/* --------------------------------------------------------------------------
   16. Quote modal
   -------------------------------------------------------------------------- */
.zg-modal-overlay {
    position: fixed;
    inset: 0;
    z-index: 999;
    display: grid;
    place-items: center;
    padding: clamp(0.75rem, 3vw, 1.5rem);
    background: rgba(6, 22, 45, 0.62);
    opacity: 0;
    transition: opacity 0.18s ease;
    overflow-y: auto;
}
.zg-modal-overlay[hidden] { display: none; }
.zg-modal-overlay.is-active { opacity: 1; }
@supports (backdrop-filter: blur(6px)) {
    .zg-modal-overlay { -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
}
.zg-modal-dialog {
    position: relative;
    inline-size: min(100%, 560px);
    max-block-size: min(92vh, 900px);
    overflow-y: auto;
    padding: clamp(1.35rem, 3.5vw, 2.25rem);
    border: 1px solid var(--zg-line);
    border-radius: var(--zg-radius);
    background: var(--zg-surface);
    box-shadow: 0 40px 80px -40px rgba(6, 22, 45, 0.5);
    transform: translateY(12px);
    transition: transform 0.2s ease;
}
.zg-modal-overlay.is-active .zg-modal-dialog { transform: translateY(0); }
.zg-modal-close {
    position: absolute;
    inset-block-start: 0.9rem;
    inset-inline-end: 0.9rem;
    inline-size: 34px;
    block-size: 34px;
    display: grid;
    place-items: center;
    border: 1px solid var(--zg-line);
    border-radius: var(--zg-radius-xs);
    background: var(--zg-surface);
    color: var(--zg-primary-dark);
    cursor: pointer;
}
.zg-modal-close:hover { border-color: var(--zg-line-strong); background: var(--zg-paper-tint); }
.zg-modal__eyebrow {
    margin-block-end: 0.5rem;
    color: var(--zg-accent-dark);
    font-size: 0.6875rem;
    font-weight: 700;
}
.zg-modal__title {
    margin: 0 0 0.4rem;
    padding-inline-end: 3rem;
    color: var(--zg-primary-dark);
    font-size: 1.25rem;
    font-weight: 700;
    line-height: 1.35;
}
.zg-modal__lede {
    margin-block-end: 1.5rem;
    color: var(--zg-muted);
    font-size: 0.875rem;
    line-height: 1.75;
}
body.is-modal-open { overflow: hidden; }

/* --------------------------------------------------------------------------
   17. Toast
   -------------------------------------------------------------------------- */
.zg-toast {
    position: fixed;
    inset-block-end: 1.5rem;
    /* در RTL، translate(-50%) توست را از مرکز بیرون می‌برد؛ با inset-inline:0 و
       margin-inline:auto، جهت صفحه اهمیتی ندارد. */
    inset-inline: 0;
    margin-inline: auto;
    transform: translateY(140%);
    z-index: 1000;
    max-inline-size: min(92vw, 460px);
    padding: 0.8rem 1.4rem;
    border-radius: var(--zg-radius-xs);
    background: var(--zg-primary-dark);
    color: #FFFFFF;
    font-size: 0.875rem;
    font-weight: 500;
    text-align: center;
    box-shadow: 0 24px 48px -24px rgba(6, 22, 45, 0.6);
    transition: transform 0.25s ease;
    pointer-events: none;
}
.zg-toast.is-visible { transform: translateY(0); }

/* --------------------------------------------------------------------------
   18. Print
   -------------------------------------------------------------------------- */
@media print {
    .zg-topbar,
    .zg-drawer,
    .zg-mobilebar,
    .zg-modal-overlay,
    .zg-toast,
    .zg-masthead__figure { display: none !important; }
    .zg-masthead,
    .zg-ask,
    .zg-foot { background: #FFFFFF !important; color: #000000 !important; }
    .zg-block,
    .zg-block--tint { padding-block: 1rem; }
}

/* --------------------------------------------------------------------------
   2026 visual refinement: shared across the landing and editorial pages.
   Logical properties preserve the same composition in RTL and LTR.
   -------------------------------------------------------------------------- */
.zg-topbar.is-scrolled { box-shadow: 0 8px 24px -20px rgba(8, 17, 31, .45); }
.zg-ident__mark { border-radius: var(--zg-radius-sm); }
.zg-langs, .zg-burger { border-radius: var(--zg-radius-sm); }
.zg-langs__item { border-radius: 0.3rem; }
.zg-cta { border-radius: var(--zg-radius-sm); font-weight: 700; transition: background-color .2s ease, border-color .2s ease, color .2s ease, box-shadow .2s ease; }
.zg-cta--solid:hover, .zg-cta--gold:hover { box-shadow: var(--zg-shadow-raised); }
.zg-masthead { background: var(--zg-navy-mesh), var(--zg-navy-gradient); }
.zg-masthead__figure { border-radius: var(--zg-radius-xl); box-shadow: var(--zg-shadow-heavy); }
.zg-masthead__figure img { transition: transform .6s ease; }
@media (hover: hover) { .zg-masthead__figure:hover img { transform: scale(1.025); } }
.zg-eyebrow__dot { inline-size: 7px; block-size: 7px; box-shadow: 0 0 0 4px var(--zg-accent-glow); }
.zg-stat__value { color: #fff; }
.zg-certs { background: var(--zg-paper-tint-soft); }
.zg-block--tint { background: var(--zg-paper-tint); }
.zg-offers { gap: clamp(1rem, 2vw, 1.5rem); }
.zg-offer {
    padding: clamp(1.35rem, 2.5vw, 2rem);
    border: 1px solid var(--zg-line);
    border-radius: var(--zg-radius-lg);
    background: var(--zg-surface);
    box-shadow: var(--zg-shadow-sm);
    transition: border-color .2s ease, box-shadow .2s ease;
}
.zg-offer:hover, .zg-offer:focus-within { border-color: var(--zg-line-strong); box-shadow: var(--zg-shadow-raised); }
.zg-offer__index { color: var(--zg-accent-dark); }
.zg-offer__title { font-size: clamp(1.2rem, 1.8vw, 1.45rem); }
.zg-pillar__num { display: inline-grid; place-items: center; align-self: flex-start; min-inline-size: 2.5rem; min-block-size: 2.5rem; margin-block-end: .5rem; border-radius: var(--zg-radius-sm); background: var(--zg-accent-soft); }
.zg-estimator__out { border-radius: var(--zg-radius-lg); background: var(--zg-paper-tint-soft); box-shadow: var(--zg-shadow-sm); }
.zg-preset { min-block-size: 44px; border-radius: var(--zg-radius-sm); }
.zg-post { border-radius: var(--zg-radius-lg); box-shadow: var(--zg-shadow-sm); transition: border-color .2s ease, box-shadow .2s ease; }
.zg-post:hover, .zg-post:focus-within { border-color: var(--zg-line-strong); box-shadow: var(--zg-shadow-raised); }
.zg-post__body { padding: clamp(1.25rem, 2vw, 1.75rem); }
.zg-empty { border-radius: var(--zg-radius-lg); background: var(--zg-paper-tint-soft); }
.zg-faq__item[open] .zg-faq__q { color: var(--zg-accent-dark); }
.zg-ask { background: var(--zg-navy-mesh), var(--zg-navy-gradient); }
.zg-ask__panel .zg-form { border-radius: var(--zg-radius-lg); background: rgba(255, 255, 255, .06); }
.zg-form-input, .zg-form-select, .zg-form-textarea { border-radius: var(--zg-radius-sm); }
.zg-modal-dialog { border-radius: var(--zg-radius-xl); }
.zg-modal-close, .zg-burger { min-inline-size: 44px; min-block-size: 44px; }
.zg-foot { background: var(--zg-primary-dark); }
.zg-foot__title { color: #e7d2a1; }
.zg-page-hero { border-block-end: 1px solid var(--zg-line-soft); }
.zg-article__hero { overflow: hidden; border-radius: var(--zg-radius-lg); }
.zg-search-form input { min-inline-size: 0; }
@media (max-width: 767px) {
    .zg-form-input, .zg-form-select, .zg-form-textarea { font-size: 16px; }
}