/* ============================================================
   AI Brand Monitor — landing (NegahNo tokens only)
   همه رنگ‌ها/شعاع‌ها/سایه‌ها از دیزاین سیستم NegahNo گرفته شده‌اند.
   این فایل فقط در Views/Home/AiBrandMonitor.cshtml (بخش MyStyle) لود می‌شود.
   ============================================================ */

.geo-page {
    background: var(--bg-color);
}

/* ---------- shared section rhythm ---------- */
.geo-page section {
    padding: 80px 0;
}

.geo-page .head-section-title {
    font-size: 45px;
    font-weight: 600;
    width: 100%;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 15px;
    margin-bottom: 60px;
}

.geo-page .head-section-line {
    display: inline-block;
    width: 60px;
    height: 2px;
    background: var(--primary-color);
}

.geo-lead {
    font-size: 17px;
    font-weight: 300;
    line-height: 2.1;
    color: #434d5ad1;
}

.geo-dark {
    background: #0E243A;
    color: #FFF;
}

    .geo-dark .geo-lead {
        color: #DBDFE4;
    }

    .geo-dark .head-section-title {
        color: #FFF;
    }

/* red attention box */
.geo-red-box {
    background: var(--primary-color);
    color: #FFF;
    border-radius: 24px;
    padding: 55px 40px;
    text-align: center;
    box-shadow: 0px 12px 24px 0px rgba(199, 29, 19, 0.16);
}

    .geo-red-box .head-section-title {
        color: #FFF;
        margin-bottom: 20px;
    }

    .geo-red-box .colored-text {
        color: #FFF;
    }

    .geo-red-box .head-section-line {
        filter: brightness(0) invert(1);
        opacity: .5;
    }

    .geo-red-box .geo-lead {
        color: rgba(255, 255, 255, 0.92);
        max-width: 820px;
        margin: 0 auto;
    }

.geo-why-badge {
    display: inline-block;
    background: #FFF;
    color: var(--primary-color);
    border-radius: 100px;
    padding: 6px 18px;
    font-size: 14px;
    font-weight: 700;
    margin-bottom: 20px;
}

/* ---------- HERO ---------- */
.geo-hero {
    padding: 60px 0 80px;
}

    .geo-hero .main-hero-text {
        font-size: 40px;
        font-weight: 600;
        line-height: 1.8;
    }

        .geo-hero .main-hero-text .colored-text {
            display: block;
        }

.geo-hero-desc {
    margin-top: 20px;
    max-width: 560px;
}

.geo-hero-actions {
    margin-top: 30px;
    display: flex;
    flex-wrap: wrap;
    gap: 15px;
    align-items: center;
}

.geo-hero-note {
    margin-top: 20px;
    font-size: 13px;
    color: #7d7979;
}

    .geo-hero-note i {
        color: var(--primary-color);
        margin-left: 6px;
    }

/* video button + modal (همان مکانیزم مودال بوت‌استرپ + تگ video صفحه RcsSeo) */
.geo-play {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    background: none;
    border: none;
    padding: 0;
    font-family: inherit;
    font-size: 16px;
    font-weight: 500;
    color: #23262F;
    cursor: pointer;
}

    .geo-play:hover {
        color: var(--primary-color);
    }

.geo-play-icon {
    width: 44px;
    height: 44px;
    border-radius: 100px;
    background: #FFF;
    color: var(--primary-color);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    box-shadow: 0px 1.5px 20.5px 0px rgba(0, 0, 0, 0.05);
}

.geo-play:hover .geo-play-icon {
    background: var(--primary-color);
    color: #FFF;
}

#GeoVideoModal .modal-content {
    border: none;
    border-radius: 20px;
    overflow: hidden;
}

#GeoVideoModal .modal-header {
    border-bottom: 1px solid #F0F4F8;
    padding: 15px 20px;
}

#GeoVideoModal .modal-title {
    font-size: 17px;
    font-weight: 500;
    color: #23262F;
}

#GeoVideoModal .modal-body {
    padding: 0;
    background: #0E243A;
}

#GeoVideoModal video {
    width: 100%;
    display: block;
}

/* signature component: پاسخ هوش مصنوعی که برند شما در آن نیست */
.geo-answer-card {
    background: #FFF;
    border-radius: 20px;
    padding: 20px;
    box-shadow: 0px 1.5px 20.5px 0px rgba(0, 0, 0, 0.05);
}

.geo-answer-head {
    display: flex;
    align-items: center;
    gap: 8px;
    padding-bottom: 15px;
    border-bottom: 1px solid #F0F4F8;
}

    .geo-answer-head .geo-src {
        margin-right: auto;
        font-size: 13px;
        color: #716F6F;
        direction: ltr;
    }

    .geo-answer-head .geo-dot {
        width: 9px;
        height: 9px;
        border-radius: 100px;
        background: #DBDFE4;
        display: inline-block;
    }

.geo-answer-q {
    margin: 18px 0 0;
    font-size: 15px;
    line-height: 2;
    color: #2F2F2F;
}

    .geo-answer-q b {
        font-weight: 700;
    }

.geo-answer-label {
    margin-top: 18px;
    font-size: 13px;
    color: #7d7979;
}

.geo-rank {
    list-style: none;
    padding: 0;
    margin: 12px 0 0;
}

    .geo-rank li {
        display: flex;
        align-items: center;
        gap: 12px;
        background: #F1F3F6;
        border-radius: 10px;
        padding: 12px 15px;
        margin-bottom: 10px;
        font-size: 15px;
    }

    .geo-rank .geo-n {
        font-size: 13px;
        color: #716F6F;
        min-width: 22px;
    }

    .geo-rank .geo-nm {
        font-weight: 500;
        direction: ltr;
    }

    .geo-rank .geo-share {
        margin-right: auto;
        font-size: 13px;
        color: #716F6F;
    }

    .geo-rank .geo-missing {
        background: #FFF;
        border: 1px dashed var(--primary-color);
    }

        .geo-rank .geo-missing .geo-nm,
        .geo-rank .geo-missing .geo-n,
        .geo-rank .geo-missing .geo-share {
            color: var(--primary-color);
            font-weight: 700;
            direction: rtl;
        }

/* ---------- generic card ---------- */
.geo-card {
    background: #FFF;
    border-radius: 10px;
    height: 100%;
    padding: 20px;
    margin-bottom: 24px;
    box-shadow: 0px 1.5px 20.5px 0px rgba(0, 0, 0, 0.05);
}

    .geo-card .geo-icon {
        width: 48px;
        height: 48px;
        border-radius: 10px;
        background: #F1F3F6;
        color: var(--primary-color);
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 20px;
        margin-bottom: 15px;
    }

    .geo-card h3 {
        font-size: 19px;
        font-weight: 600;
        margin-bottom: 10px;
        color: #23262F;
    }

    .geo-card h4 {
        font-size: 17px;
        font-weight: 500;
        margin-bottom: 8px;
        color: #23262F;
    }

    .geo-card p {
        font-size: 15px;
        font-weight: 300;
        line-height: 2;
        color: #434d5ad1;
        margin: 0;
    }

/* ---------- SEO vs GEO ---------- */
.geo-compare {
    background: #FFF;
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0px 1.5px 20.5px 0px rgba(0, 0, 0, 0.05);
}

    .geo-compare .geo-crow {
        display: flex;
        border-bottom: 1px solid #F0F4F8;
    }

        .geo-compare .geo-crow:last-child {
            border-bottom: none;
        }

        .geo-compare .geo-crow > div {
            flex: 1;
            padding: 18px 20px;
            font-size: 15px;
            font-weight: 300;
            color: #434d5ad1;
        }

    .geo-compare .geo-chead > div {
        background: #0E243A;
        color: #FFF;
        font-weight: 500;
    }

    .geo-compare .geo-chead .geo-cgeo {
        background: var(--primary-color);
    }

    .geo-compare .geo-ckey {
        background: #F1F3F6;
        font-weight: 500;
        color: #2F2F2F;
    }

    .geo-compare .geo-cgeo {
        color: #23262F;
        font-weight: 500;
    }

/* ---------- roadmap: تصویر مسیر ۴ مرحله‌ای ----------
   دو فایل SVG آماده (افقی برای دسکتاپ، عمودی برای موبایل) به‌صورت inline در ویو رندر
   می‌شوند تا فونت Vazirmatn سایت روی متن‌های داخلشان اعمال شود و متن قابل ایندکس بماند.
   در هر breakpoint فقط یکی نمایش داده می‌شود. */
.geo-roadmap-desktop,
.geo-roadmap-mobile {
    display: block;
    width: 100%;
    height: auto;
}

.geo-roadmap-mobile {
    display: none;
    max-width: 380px;
    margin: 0 auto;
}

/* ---------- کارت فرم ثبت برند ----------
   markup فرم از کامپوننت مشترک BrandMonitorFormComponent می‌آید و کلاس‌های استاندارد
   form-group/form-label/form-control دارد؛ اینجا فقط برای طرح NegahNo بازپوسته می‌شود. */
.geo-form-card {
    background: #FFF;
    border-radius: 20px;
    padding: 20px;
    box-shadow: 0px 1.5px 20.5px 0px rgba(0, 0, 0, 0.05);
}

    .geo-form-card .form-group {
        margin-bottom: 15px;
    }

    .geo-form-card .form-label {
        display: block;
        font-size: 14px;
        color: #716F6F;
        margin-bottom: 7px;
    }

    .geo-form-card .form-control {
        width: 100%;
        background: #F1F3F6;
        border: 1px solid #DBDFE4;
        border-radius: 50px;
        padding: 12px 20px;
        font-size: 14px;
        font-family: inherit;
        color: #2F2F2F;
    }

        .geo-form-card .form-control::placeholder {
            color: #7d7979;
        }

        .geo-form-card .form-control:focus {
            border: 1px solid var(--primary-color);
            background: #FFF;
        }

    .geo-form-card .form-text {
        font-size: 12px;
        font-weight: 300;
        color: #7d7979;
        line-height: 1.9;
    }

    .geo-form-card .form-buttons {
        margin-top: 5px;
    }

    .geo-form-card .btn-primary {
        display: block;
        width: 100%;
        text-align: center;
        border-radius: 50px;
        box-shadow: 0px 12px 24px 0px rgba(199, 29, 19, 0.16);
    }

/* pay-as-you-go price */
.geo-price {
    border-top: 1px solid #F0F4F8;
    margin-top: 20px;
    padding-top: 20px;
    text-align: center;
}

    .geo-price .package-head-title {
        margin-bottom: 12px;
    }

/* بج درصد تخفیف + قیمت قبل از تخفیف (خط‌خورده)
   فقط وقتی Packs.DiscountPercent > 0 باشد رندر می‌شوند؛ بدون تخفیف، چیدمان دقیقاً مثل قبل است. */
.geo-price-badge {
    display: inline-block;
    background: #FCEBEB;
    color: #A32D2D;
    font-size: 13px;
    font-weight: 500;
    border-radius: 20px;
    padding: 4px 14px;
    line-height: 1.6;
    margin-bottom: 10px;
}

.geo-price-value {
    display: flex;
    align-items: baseline;
    justify-content: center;
    flex-wrap: wrap;
    gap: 8px;
    font-size: 20px;
    font-weight: 500;
    color: #23262F;
}

.geo-price-number {
    font-size: 35px;
    font-weight: 600;
    color: var(--primary-color);
}

/* قالب NegahNo در style.css قانون سراسری `*, *:hover { text-decoration: none !important }` دارد
   که خط‌خوردگی پیش‌فرض تگ <del> را از بین می‌برد؛ برای همین اینجا با !important برگردانده می‌شود. */
.geo-price-old {
    font-size: 17px;
    font-weight: 300;
    color: #A5A5A5;
    text-decoration: line-through !important;
    text-decoration-thickness: 1.5px !important;
    text-decoration-color: #C91D13 !important;
}

.geo-price-unit {
    font-size: 16px;
    font-weight: 400;
    color: #23262F;
}

.geo-price-desc {
    font-size: 14px;
    font-weight: 300;
    color: #716F6F;
    margin: 8px 0 20px;
}

.geo-price-note {
    text-align: center;
    font-size: 13px;
    color: #7d7979;
    margin-top: 12px;
}

    .geo-price-note i {
        color: var(--secondary-color);
        margin-left: 5px;
    }

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

    .geo-numlist li {
        display: flex;
        gap: 15px;
        margin-bottom: 22px;
    }

    .geo-numlist .geo-num {
        min-width: 38px;
        height: 38px;
        border-radius: 100px;
        background: #F1F3F6;
        color: var(--primary-color);
        display: flex;
        align-items: center;
        justify-content: center;
        font-weight: 700;
        font-size: 14px;
    }

    .geo-numlist h4 {
        font-size: 17px;
        font-weight: 500;
        margin-bottom: 4px;
        color: #23262F;
    }

    .geo-numlist p {
        font-size: 15px;
        font-weight: 300;
        color: #434d5ad1;
        margin: 0;
        line-height: 2;
    }

/* ---------- report ---------- */
.geo-report {
    background: #FFF;
    border-radius: 20px;
    padding: 20px;
    box-shadow: 0px 1.5px 20.5px 0px rgba(0, 0, 0, 0.05);
}

.geo-report-head {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    align-items: center;
    padding-bottom: 15px;
    border-bottom: 1px solid #F0F4F8;
    margin-bottom: 20px;
}

    .geo-report-head .geo-rt {
        font-size: 16px;
        font-weight: 500;
        color: #23262F;
    }

    .geo-report-head .geo-chips {
        margin-right: auto;
        display: flex;
        gap: 8px;
        flex-wrap: wrap;
    }

.geo-chip {
    border-radius: 24px;
    background: #EFFCF6;
    color: #004440;
    padding: 6px 14px;
    font-size: 13px;
    font-weight: 700;
}

.geo-chip-red {
    background: var(--primary-color);
    color: #FFF;
}

/* report → sample link CTA */
.geo-report-cta {
    text-align: center;
    padding: 40px 20px;
}

.geo-report-cta-icon {
    width: 64px;
    height: 64px;
    border-radius: 100px;
    margin: 0 auto 20px;
    background: #F1F3F6;
    color: var(--primary-color);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 26px;
}

.geo-report-cta h3 {
    font-size: 24px;
    font-weight: 600;
    color: #23262F;
    margin-bottom: 15px;
}

.geo-report-cta .geo-lead {
    max-width: 640px;
    margin: 0 auto;
}

.geo-chips-center {
    justify-content: center;
    margin: 25px 0 0;
}

.geo-actions-center {
    justify-content: center;
}

.geo-report-cta .btn-primary {
    border-radius: 50px;
    box-shadow: 0px 12px 24px 0px rgba(199, 29, 19, 0.16);
}

    .geo-report-cta .btn-primary i {
        margin-left: 8px;
        font-size: 16px;
    }

.geo-report-cta-note {
    font-size: 13px;
    color: #7d7979;
    margin-top: 15px;
}

.geo-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 15px;
}

    .geo-table th {
        font-size: 14px;
        font-weight: 500;
        color: #716F6F;
        text-align: right;
        padding: 10px 12px;
        border-bottom: 1px solid #F0F4F8;
        white-space: nowrap;
    }

    .geo-table td {
        padding: 12px;
        border-bottom: 1px solid #F0F4F8;
        font-weight: 300;
    }

    .geo-table tr:last-child td {
        border-bottom: none;
    }

    .geo-table .geo-brandname {
        font-weight: 500;
        direction: ltr;
        text-align: right;
    }

    .geo-table .geo-you td {
        background: #FFF5F4;
    }

    .geo-table .geo-you .geo-brandname {
        color: var(--primary-color);
        font-weight: 700;
        direction: rtl;
    }

.geo-bar {
    height: 8px;
    border-radius: 100px;
    background: #F1F3F6;
    overflow: hidden;
    min-width: 80px;
}

    .geo-bar span {
        display: block;
        height: 100%;
        border-radius: 100px;
        background: #0E243A;
    }

    .geo-bar.geo-bar-you span {
        background: var(--primary-color);
    }

.geo-table-note {
    font-size: 14px;
    color: #7d7979;
    margin-top: 15px;
}

/* ---------- audience chips ---------- */
.geo-audience {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    justify-content: center;
}

    .geo-audience span {
        background: #FFF;
        border: 1px solid #DBDFE4;
        border-radius: 100px;
        padding: 10px 22px;
        font-size: 15px;
        font-weight: 500;
        color: #2F2F2F;
    }

/* ---------- FAQ ---------- */
.geo-faq {
    max-width: 900px;
    margin: 0 auto;
}

    .geo-faq details {
        background: #FFF;
        border-radius: 10px;
        margin-bottom: 12px;
        box-shadow: 0px 1.5px 20.5px 0px rgba(0, 0, 0, 0.05);
    }

    .geo-faq summary {
        list-style: none;
        cursor: pointer;
        padding: 18px 20px;
        font-size: 17px;
        font-weight: 500;
        color: #23262F;
        display: flex;
        align-items: center;
    }

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

        .geo-faq summary:after {
            content: "\f067";
            font-family: "Font Awesome 5 Free";
            font-weight: 900;
            margin-right: auto;
            color: var(--primary-color);
            font-size: 14px;
        }

    .geo-faq details[open] summary:after {
        content: "\f068";
    }

    .geo-faq p {
        padding: 0 20px 20px;
        font-size: 15px;
        font-weight: 300;
        line-height: 2.1;
        color: #434d5ad1;
        margin: 0;
    }

/* ---------- final CTA ----------
   کارت تیره‌ی جداگانه به‌جای پس‌زمینه‌ی تمام‌عرض: رنگ #0E243A دقیقاً همان رنگ فوتر است،
   پس اگر روی section بنشیند دو بلوک به‌هم می‌چسبند و مرزشان دیده نمی‌شود. */
.geo-cta-box {
    border-radius: 24px;
    padding: 55px 40px;
    box-shadow: -4px 4px 25px -4px rgba(0, 0, 0, 0.10);
}

    /* قرمز برند روی سرمه‌ای کنتراست کافی ندارد (حدود ۲.۳:۱)؛ مثل .geo-red-box سفید می‌شود. */
    .geo-cta-box .colored-text {
        color: #FFF;
    }

    .geo-cta-box .head-section-line {
        filter: brightness(0) invert(1);
        opacity: .5;
    }

.geo-cta {
    text-align: center;
}

    .geo-cta .head-section-title {
        margin-bottom: 20px;
    }

    .geo-cta .geo-lead {
        max-width: 640px;
        margin: 0 auto;
    }

    .geo-cta .geo-hero-actions {
        justify-content: center;
        margin-top: 30px;
    }

    .geo-cta .btn-primary-o {
        background: transparent;
        color: #FFF;
        border-color: #FFF;
    }

        .geo-cta .btn-primary-o:hover {
            background: #FFF;
            color: #0E243A;
        }

/* ---------- responsive ---------- */
@media (max-width: 991px) {
    .geo-page section {
        padding: 50px 0;
    }

    .geo-hide-mobile {
        display: none;
    }

    /* عنوان بخش‌ها: در دسکتاپ flex است و خطوط کناری ۶۰px فضا می‌گیرند؛ در عرض کم
       همین باعث می‌شد عنوان در یک ستون باریک فشرده و چندخطه شود. در موبایل به جریان
       inline برمی‌گردد تا متن مثل یک پاراگراف معمولی و تمیز بشکند. */
    .geo-page .head-section-title {
        display: block;
        text-align: center;
        font-size: 24px;
        line-height: 1.8;
        margin-bottom: 35px;
        /* از تک‌افتادن یک کلمه در خط آخر عنوان جلوگیری می‌کند (مرورگرهای قدیمی نادیده می‌گیرند). */
        text-wrap: balance;
    }

    .geo-page .head-section-line {
        display: inline-block;
        width: 22px;
        vertical-align: middle;
        margin: 0 6px;
    }

    /* HERO */
    .geo-hero {
        padding: 30px 0 50px;
    }

        .geo-hero .main-hero-text {
            font-size: 25px;
            line-height: 1.9;
        }

    .geo-hero-desc {
        max-width: none;
    }

    .geo-hero-actions {
        gap: 12px;
    }

        .geo-hero-actions .btn-primary,
        .geo-hero-actions .btn-primary-o {
            flex: 1 1 45%;
            text-align: center;
            font-size: 16px;
            padding: 11px 14px;
        }

    .geo-play {
        flex: 1 0 100%;
        justify-content: center;
        font-size: 15px;
    }

    .geo-play-icon {
        width: 38px;
        height: 38px;
    }

    .geo-answer-card {
        margin-top: 35px;
        padding: 16px;
    }

    /* ردیف‌های «برندهای معرفی‌شده»: در ۳۷۵px هر سه بخش در یک خط جا می‌شوند
       (اندازه‌گیری شد: ۴۵px ارتفاع بدون سرریز). flex-wrap فقط به‌عنوان تور ایمنی
       برای متن‌های بلندتر می‌ماند. */
    .geo-rank li {
        flex-wrap: wrap;
        gap: 8px;
        font-size: 14px;
        padding: 11px 12px;
    }

        .geo-rank .geo-share {
            font-size: 12px;
        }

    /* جعبه قرمز «چرا GEO» */
    .geo-red-box {
        padding: 32px 20px;
        border-radius: 20px;
    }

    .geo-lead {
        font-size: 15px;
        line-height: 2;
    }

    /* جدول مقایسه → کارت‌های عمودی با برچسب ستون */
    .geo-compare .geo-chead {
        display: none;
    }

    .geo-compare .geo-crow {
        flex-direction: column;
    }

        .geo-compare .geo-crow > div {
            padding: 12px 16px;
            font-size: 14px;
        }

            .geo-compare .geo-crow > div[data-label]:before {
                content: attr(data-label);
                display: block;
                font-size: 11px;
                font-weight: 500;
                color: #7d7979;
                margin-bottom: 4px;
            }

    .geo-compare .geo-ckey {
        background: #0E243A;
        color: #FFF;
    }

    .geo-compare .geo-cgeo {
        background: #FFF5F4;
    }

        .geo-compare .geo-crow > div.geo-cgeo[data-label]:before {
            color: var(--primary-color);
        }

    /* کارت‌های عمومی */
    .geo-card {
        padding: 18px;
        margin-bottom: 16px;
    }

        .geo-card h3 {
            font-size: 17px;
        }

        .geo-card h4 {
            font-size: 16px;
        }

        .geo-card p {
            font-size: 14px;
        }

    /* سوییچ از نسخه افقی به نسخه عمودی روادمپ */
    .geo-roadmap-desktop {
        display: none;
    }

    .geo-roadmap-mobile {
        display: block;
    }

    /* کارت فرم و قیمت */
    .geo-form-card {
        margin-bottom: 35px;
    }

        .geo-form-card .form-text {
            word-break: break-word;
        }

    .geo-price-number {
        font-size: 30px;
    }

    /* فهرست شماره‌دار */
    .geo-numlist li {
        gap: 12px;
        margin-bottom: 18px;
    }

    .geo-numlist .geo-num {
        min-width: 32px;
        height: 32px;
        font-size: 13px;
    }

    .geo-numlist h4 {
        font-size: 16px;
    }

    .geo-numlist p {
        font-size: 14px;
    }

    /* گزارش / جدول Intent */
    .geo-report {
        padding: 16px;
    }

    .geo-report-head {
        flex-direction: column;
        align-items: flex-start;
        gap: 12px;
    }

        .geo-report-head .geo-chips {
            margin-right: 0;
        }

    .geo-table {
        font-size: 13px;
    }

        .geo-table td {
            padding: 9px 6px;
        }

    .geo-bar {
        min-width: 45px;
    }

    .geo-report-cta {
        padding: 28px 16px;
    }

        .geo-report-cta h3 {
            font-size: 20px;
        }

    /* چیپ‌های مخاطب */
    .geo-audience {
        gap: 8px;
    }

        .geo-audience span {
            padding: 8px 16px;
            font-size: 14px;
        }

    /* سوالات متداول */
    .geo-faq summary {
        font-size: 15px;
        padding: 15px 16px;
        line-height: 1.9;
    }

    .geo-faq p {
        padding: 0 16px 16px;
        font-size: 14px;
    }

    /* CTA پایانی */
    .geo-cta-box {
        padding: 32px 20px;
        border-radius: 20px;
    }

    .geo-cta .geo-hero-actions {
        margin-top: 25px;
    }
}

/* گوشی‌های باریک: خطوط کناری عنوان کاملاً حذف می‌شوند تا عنوان تمام عرض را بگیرد. */
@media (max-width: 575px) {
    .geo-page .head-section-title {
        font-size: 21px;
        margin-bottom: 28px;
    }

    .geo-page .head-section-line {
        display: none;
    }

    .geo-hero .main-hero-text {
        font-size: 22px;
    }

    .geo-hero-actions .btn-primary,
    .geo-hero-actions .btn-primary-o {
        flex: 1 0 100%;
    }

    .geo-red-box,
    .geo-cta-box {
        padding: 26px 16px;
    }

    .geo-report-cta h3 {
        font-size: 18px;
    }
}

@media (prefers-reduced-motion: no-preference) {
    .geo-rank li {
        opacity: 0;
        transform: translateY(8px);
        animation: geoRise .5s ease forwards;
    }

        .geo-rank li:nth-child(1) {
            animation-delay: .2s;
        }

        .geo-rank li:nth-child(2) {
            animation-delay: .5s;
        }

        .geo-rank li:nth-child(3) {
            animation-delay: .8s;
        }

        .geo-rank li:nth-child(4) {
            animation-delay: 1.1s;
        }

    @keyframes geoRise {
        to {
            opacity: 1;
            transform: none;
        }
    }
}