/* mycode_solutions — RTS vendor temasının üzərinə əlavə edilən öz stillərimiz.
   style.css-i redaktə etmirik (vendor faylı), yalnız üstünə əlavə edirik. */

/* --- Brend rəngi: logo.png-nin yaşılına uyğunlaşdırıldı ---
   Loqo rəngləri (static/images/logo.png-dən ölçülüb): #57BB6D (yaşıl),
   #0B2016 (tünd fon). Vendor temanın defolt --color-primary (#0F62FE,
   mavi) loqo ilə uyğun gəlmirdi.

   Düz #57BB6D-ni düymə fonu kimi işlətmək olmaz: ağ mətnlə kontrast
   2.40:1-dir, WCAG AA (4.5:1) keçmir. Loqonun HSL çaları (h=133°, s=42%)
   saxlanılıb, yalnız lightness aşağı salınıb (0.537 -> 0.36) — nəticə
   4.68:1, AA keçir, gözlə hələ "eyni yaşıl"dır.

   242 yerdə var(--color-primary) işlənir — bu override kaskadla hər yerə
   yayılır. Yalnız 2 yerdə (style.css:16868, 18953) rəng hardcode
   yazılıb və var()-a tabe deyil, onlar üçün ayrıca override aşağıdadır. */
:root {
    --color-primary: #358346;
}

.luminos-main-solutioin-key .tag-wrapper .single-tag span {
    border-color: var(--color-primary);
}
.rts-blog-detials-area-start .inner-content-blog-details .quote-area .name {
    color: var(--color-primary);
}

/* --- Dil dəyişdirici: xüsusi dropdown (<details>/<summary>) ---
   Native <select> qəsdən istifadə edilmir: açılan siyahı brauzerin öz
   stilində çıxır və "premium" görünüşə nəzarət etmək mümkün deyil.
   <details> tam CSS nəzarəti verir, JS-siz açılıb-bağlanır, klaviatura və
   ekran oxuyucuları ilə doğma işləyir (kənara klik/Escape üçün kiçik JS
   base.html-də — yalnız bağlamaq üçün, açılış hələ də nativdir). */

.lang-select {
    position: relative;
}

.lang-select__trigger {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    height: 38px;
    padding: 0 12px;
    border: 1px solid var(--color-border);
    border-radius: 999px;
    background: var(--color-white);
    line-height: 1;
    cursor: pointer;
    user-select: none;
    transition: border-color 0.25s ease, box-shadow 0.25s ease, background 0.25s ease;
}
.lang-select__trigger::-webkit-details-marker { display: none; }
.lang-select__trigger::marker { content: ""; }

.lang-select:hover .lang-select__trigger {
    border-color: var(--color-primary);
}
.lang-select[open] .lang-select__trigger {
    border-color: var(--color-primary);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--color-primary) 14%, transparent);
}
.lang-select__trigger:focus-visible {
    outline: 2px solid var(--color-primary);
    outline-offset: 2px;
}

.lang-select__flag {
    font-size: 14px;
    line-height: 1;
    transform: translateY(-0.5px);
}
.lang-select__code {
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 0.02em;
    color: var(--color-heading-1);
}
.lang-select__chevron {
    color: var(--color-body);
    transition: transform 0.25s ease;
    margin-left: 1px;
}
.lang-select[open] .lang-select__chevron {
    transform: rotate(180deg);
    color: var(--color-primary);
}

.lang-select__panel {
    position: absolute;
    top: calc(100% + 8px);
    right: 0;
    z-index: 60;
    min-width: 132px;
    padding: 6px;
    border-radius: 14px;
    background: var(--color-white);
    border: 1px solid var(--color-border);
    box-shadow: 0 16px 40px -12px rgba(7, 20, 49, 0.22), 0 2px 8px rgba(7, 20, 49, 0.06);
    transform-origin: top right;
    animation: lang-select-in 0.16s cubic-bezier(0.16, 1, 0.3, 1);
}
@keyframes lang-select-in {
    from { opacity: 0; transform: translateY(-4px) scale(0.97); }
    to   { opacity: 1; transform: translateY(0) scale(1); }
}

.lang-select__option-form {
    margin: 0;
}
.lang-select__option-form + .lang-select__option-form {
    margin-top: 2px;
}

.lang-select__option {
    display: flex;
    align-items: center;
    gap: 9px;
    width: 100%;
    padding: 9px 10px;
    border: none;
    border-radius: 9px;
    background: transparent;
    font-size: 13px;
    font-weight: 600;
    color: var(--color-heading-1);
    text-align: left;
    cursor: pointer;
    transition: background 0.15s ease;
}
.lang-select__option:hover,
.lang-select__option:focus-visible {
    background: #F3F6FF;
    outline: none;
}
.lang-select__option.is-active {
    color: var(--color-primary);
    background: #EEF3FF;
}
.lang-select__option .lang-select__flag {
    font-size: 15px;
}
.lang-select__check {
    margin-left: auto;
    color: var(--color-primary);
    flex-shrink: 0;
}

/* Header tünd fonda olduqda (bg_dark, bg_image-three-banner və s.) ağ zəmində
   qalır — oxunaqlılıq itmir, amma vizual ağırlıq azalır. */
.header-relative .lang-select__trigger {
    background: rgba(255, 255, 255, 0.92);
}

/* Mega menyu sağ paneli: default vendor `.menu-list` görünüşü saxlanılır,
   yalnız statik kateqoriya siyahısı əvəzinə üzərinə gəlinən (hover) xidmətin
   ilk 5 alt-xidməti + "Hamısına bax" göstərilir (aşağıda base.html-də JS). */
.mega-sublist {
    display: none;
}
.mega-sublist.is-active {
    display: block;
}
.mega-sublist__all {
    color: var(--color-primary) !important;
    font-weight: 700 !important;
}

/* --- FAQ səhifəsi: xidmətlər üzrə suallar (kateqoriya tab-ları + axtarış) ---
   410 sual (82 xidmət x 5) birbaşa tək siyahıda göstərilə bilməz — kateqoriya
   üzrə tab-lara (Bootstrap pill), tab daxilində isə xidmət-üzrə accordion-a
   bölünür. Axtarış input-u aktiv tab daxilində filtrasiya edir (JS). */
.faq-search {
    position: relative;
    max-width: 480px;
    margin: 0 auto 30px;
}
.faq-search i {
    position: absolute;
    left: 20px;
    top: 50%;
    transform: translateY(-50%);
    color: var(--color-body);
    font-size: 15px;
}
.faq-search input {
    width: 100%;
    height: 54px;
    padding: 0 20px 0 48px;
    border: 1px solid var(--color-border);
    border-radius: 999px;
    font-size: 15px;
    transition: border-color 0.25s ease, box-shadow 0.25s ease;
}
.faq-search input:focus {
    outline: none;
    border-color: var(--color-primary);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--color-primary) 14%, transparent);
}

.faq-cat-tabs {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 10px;
    list-style: none;
    padding: 0;
    margin: 0 0 40px;
}
.faq-cat-tabs__btn {
    padding: 11px 22px;
    border: 1px solid var(--color-border);
    border-radius: 999px;
    background: var(--color-white);
    font-size: 14px;
    font-weight: 600;
    color: var(--color-heading-1);
    transition: border-color 0.25s ease, background 0.25s ease, color 0.25s ease;
}
.faq-cat-tabs__btn:hover {
    border-color: var(--color-primary);
    color: var(--color-primary);
}
.faq-cat-tabs__btn.active {
    background: var(--color-primary);
    border-color: var(--color-primary);
    color: var(--color-white);
}



/* --- Kateqoriya səhifəsi: "Əlavə imkanlar" ---
   6-dan çox alt-xidməti olan kateqoriyalarda qalanlar kart deyil, yığcam
   pill-link siyahısı kimi göstərilir — premium/satış yönümlü struktur
   üçün istifadəçinin tələb etdiyi "6 əsas + Additional Capabilities" sxemi. */
.additional-capabilities {
    margin-top: 50px;
    padding-top: 40px;
    border-top: 1px solid var(--color-border);
}
.additional-capabilities__title {
    font-size: 20px;
    margin-bottom: 20px;
}
.additional-capabilities__list {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}
.additional-capabilities__item {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 16px;
    border: 1px solid var(--color-border);
    border-radius: 999px;
    font-size: 14px;
    font-weight: 500;
    color: var(--color-heading-1);
    transition: border-color 0.25s ease, color 0.25s ease, background 0.25s ease;
}
.additional-capabilities__item i {
    font-size: 11px;
    opacity: 0.6;
    transition: transform 0.25s ease;
}
.additional-capabilities__item:hover {
    border-color: var(--color-primary);
    color: var(--color-primary);
    background: #F5FAF6;
}
.additional-capabilities__item:hover i {
    transform: translateX(2px);
    opacity: 1;
}

/* --- Header WhatsApp düyməsi — "Konsultasiya al" düyməsinin yerinə --- */
.whatsapp-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    border-radius: 50%;
    background: #25D366;
    color: var(--color-white);
    font-size: 20px;
    flex-shrink: 0;
    transition: background 0.25s ease, transform 0.25s ease, box-shadow 0.25s ease;
    box-shadow: 0 4px 14px rgba(37, 211, 102, 0.35);
}
.whatsapp-btn:hover,
.whatsapp-btn:focus-visible {
    background: #1EBE5A;
    color: var(--color-white);
    transform: translateY(-1px);
    box-shadow: 0 6px 18px rgba(37, 211, 102, 0.45);
}
.whatsapp-btn:focus-visible {
    outline: 2px solid #1EBE5A;
    outline-offset: 2px;
}

/* --- Haqqımızda səhifəsi (statik, premium) ---
   Səhifə DB-dən yalnız SEO sahələrini oxuyur (pages.AboutIndex). Bütün
   vizual kontent buradadır — vendor style.css-ə toxunmadan, mövcud
   komponentlərin (.single-feature-area-three, .rts-cta-area) üzərinə. */

/* --- rts-cta-area baq düzəlişi: vendor komponentində açıq mətn (.disc)
   heç vaxt rənglənməyib. p.disc-in defolt rəngi (--color-body, boz) yaşıl
   fonda (--color-primary) demək olar görünməzdir (4.68:1 ağla, boz isə
   ~1.5:1). Bu komponent bir neçə səhifədə istifadə olunacaq deyə düzəliş
   about-a məxsus deyil, komponentin özünədir. --- */
.rts-cta-area .cta-inner .content-area .title-left-wrapper p.disc {
    color: var(--color-white);
    opacity: 0.92;
}

.about-eyebrow {
    display: inline-block;
    margin-bottom: 14px;
    padding: 4px 14px;
    border: 1px solid var(--color-border);
    border-radius: 999px;
    font-size: 13px;
    font-weight: 600;
    color: var(--color-primary);
    letter-spacing: 0.02em;
}
.about-eyebrow--light {
    border-color: rgba(255, 255, 255, 0.16);
    color: #fff;
}

.about-hero-buttons {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    margin-top: 30px;
}

.about-mission-band {
    padding-block: 90px;
}
.about-mission-text {
    margin-top: 18px;
    color: #fff;
    font-size: clamp(22px, 2.6vw, 32px);
    line-height: 1.5;
    font-weight: 500;
}

.about-pillars .single-feature-area-three {
    background: var(--color-white);
}
.about-pillars .icon img {
    width: 32px;
    height: 32px;
}
.about-pillars .content .title {
    font-size: 19px;
    margin-bottom: 10px;
}
.about-pillars .content p.disc {
    font-size: 15px;
    margin-bottom: 0;
}

/* İki fərqli fotonun asimmetrik tərtibatı + üzən "təsis ili" kartı.
   Sağ alt küncdəki kiçik şəkil əsas şəkildən aşağı-sağa sürüşdürülür,
   üstündən ağ haşiyə ilə "kart" effekti verir. Sol yuxarı küncdəki
   nişan hər iki şəkilin üzərində üzür (ən yüksək z-index). */
.about-story-images {
    position: relative;
    padding-bottom: 22%;
    padding-left: 14%;
}
.about-story-images__main {
    position: relative;
    z-index: 1;
    width: 100%;
    border-radius: 22px;
    box-shadow: 0 24px 60px -20px rgba(5, 13, 32, 0.28);
}
.about-story-images__secondary {
    position: absolute;
    z-index: 2;
    left: 0;
    bottom: 0;
    width: 46%;
    aspect-ratio: 1 / 1;
    object-fit: cover;
    border: 6px solid var(--color-white);
    border-radius: 18px;
    box-shadow: 0 20px 45px -12px rgba(5, 13, 32, 0.3);
}
@media only screen and (max-width: 767px) {
    .about-story-images {
        padding-bottom: 30%;
        padding-left: 20%;
    }
}

.about-why-item {
    display: flex;
    gap: 20px;
    align-items: flex-start;
    padding: 30px;
    height: 100%;
    background: var(--color-white);
    border: 1px solid var(--color-border);
    border-radius: 20px;
    transition: border-color 0.3s ease, transform 0.3s ease;
}
.about-why-item:hover {
    border-color: var(--color-primary);
    transform: translateY(-2px);
}
.about-why-item__index {
    flex-shrink: 0;
    font-size: 15px;
    font-weight: 700;
    color: var(--color-primary);
}
.about-why-item .title {
    font-size: 19px;
    margin-bottom: 10px;
}
.about-why-item .disc {
    margin-bottom: 0;
}

/* --- Footer: brend rənginə uyğunlaşdırılmış tünd fon ---
   Vendor .bg_dark (#050D20) neytral tünd-lacivərddir və saytın digər
   bölmələrində (missiya zolağı və s.) qalır. Footer üçün eyni hue-də
   (h=133°, brend yaşılı ilə eyni), aşağı saturasiya/lightness-lə tünd
   yaşıl-qara fon seçilib — nəticə demək olar qara görünür, amma brend
   kimliyi ilə əlaqəni saxlayır, boz-lacivərd toqquşması aradan qalxır. */
.rts-footer-one.bg_dark {
    background: #0E1B11;
}

/* --- Əlaqə səhifəsi: xəritə --- */
.contact-map-wrapper {
    border-radius: 16px;
    overflow: hidden;
    border: 1px solid var(--color-border);
    line-height: 0;
}
.contact-map-wrapper iframe {
    display: block;
}

/* --- Xidmətlər səhifəsi: kateqoriya kartları — premium toxunuş ---
   Vendor `.single-service-security` statik idi (heç bir hover effekti,
   ikon "çip" fonu yox idi). Saytın digər yerlərində (mega menyu, Haqqımızda
   pillar-ları) artıq istifadə olunan ikon-çip + hover-lift dilinə uyğunlaşdırılır. */
.rts-service-area .single-service-security {
    display: flex;
    flex-direction: column;
    transition: border-color 0.25s ease, box-shadow 0.25s ease, transform 0.25s ease;
}
.rts-service-area .single-service-security:hover {
    border-color: var(--color-primary);
    box-shadow: 0 20px 40px -20px rgba(53, 131, 70, 0.25);
    transform: translateY(-4px);
}
.rts-service-area .single-service-security .icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 56px;
    height: 56px;
    border-radius: 14px;
    background: #EAF6ED;
}
.rts-service-area .single-service-security .icon img {
    width: 28px;
    height: 28px;
}
/* Başlıq 1 və 2 sətirli ola bilir (uzunluğa görə) — sabit min-height
   ilə cərgədəki bütün kartlarda təsvir eyni hündürlükdə başlayır. */
.rts-service-area .single-service-security a .title {
    min-height: 2.6em;
    display: flex;
    align-items: flex-start;
}
/* Düymə həmişə kartın altına yapışır — təsvirin uzunluğundan asılı
   olmayaraq eyni cərgədəki bütün "Ətraflı bax" düymələri paralel qalır. */
.rts-service-area .single-service-security .rts-btn {
    margin-top: auto;
}

/* --- Xidmətlər səhifəsi: "İş Prosesi" — nömrəli kart-axını ---
   Vendor-un yalnız qırıq-xətt üzərində kiçik nöqtə ilə göstərdiyi köhnə
   dizayn (working-process-three-main) əvəz olundu: hər addım kart, aralarda
   istiqamət oxu, hover-də qalxma effekti. */
.process-steps {
    display: flex;
    align-items: stretch;
    gap: 4px;
    flex-wrap: wrap;
}
.process-steps__item {
    flex: 1 1 220px;
    padding: 34px 28px;
    background: var(--color-white);
    border: 1px solid var(--color-border);
    border-radius: 20px;
    transition: border-color 0.25s ease, box-shadow 0.25s ease, transform 0.25s ease;
}
.process-steps__item:hover {
    border-color: var(--color-primary);
    box-shadow: 0 20px 40px -20px rgba(53, 131, 70, 0.25);
    transform: translateY(-4px);
}
.process-steps__number {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    border-radius: 14px;
    background: #EAF6ED;
    color: var(--color-primary);
    font-weight: 700;
    font-size: 15px;
    margin-bottom: 22px;
}
.process-steps__title {
    font-size: 19px;
    font-weight: 700;
    margin-bottom: 10px;
    color: var(--color-heading-1);
}
.process-steps__desc {
    font-size: 14.5px;
    color: var(--color-body);
    line-height: 1.6;
    margin: 0;
}
.process-steps__connector {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 36px;
    align-self: center;
    color: var(--color-primary);
    font-size: 15px;
    opacity: 0.5;
}
@media (max-width: 991px) {
    .process-steps__connector {
        display: none;
    }
    .process-steps__item {
        flex: 1 1 100%;
    }
}

/* --- Xidmət detalı səhifəsi (service_detail.html) — premium toxunuşlar ---
   Xidmətlərin real fotoları olmadığından (yalnız kateqoriya ikonu var),
   hero və "Xidmət mərhələləri" bölmələrində boş sahə əvəzinə kateqoriya
   ikonunu böyük, brendli bir badge-də göstəririk. */
.service-detail-badge {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 18px;
    padding: 60px 30px;
    border-radius: 28px;
    background: radial-gradient(circle at 50% 30%, #EAF6ED 0%, #F7FAF8 70%);
    border: 1px solid var(--color-border);
    text-align: center;
}
.service-detail-badge__icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 110px;
    height: 110px;
    border-radius: 50%;
    background: var(--color-white);
    box-shadow: 0 20px 40px -16px rgba(53, 131, 70, 0.35);
}
.service-detail-badge__icon img {
    width: 52px;
    height: 52px;
}
.service-detail-badge__label {
    font-size: 15px;
    font-weight: 700;
    color: var(--color-heading-1);
}
.service-detail-badge--secondary {
    padding: 44px 24px;
}
.service-detail-badge--secondary .service-detail-badge__icon {
    width: 84px;
    height: 84px;
}
.service-detail-badge--secondary .service-detail-badge__icon img {
    width: 38px;
    height: 38px;
}

/* "Xidmət mərhələləri" kartlarına nömrə çipi — hover-lə birlikdə artıq
   mövcud olan scale effektini tamamlayır. */
.single-working-process-area {
    position: relative;
}
.single-working-process-area__number {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: 12px;
    background: #EAF6ED;
    color: var(--color-primary);
    font-weight: 700;
    font-size: 14px;
    margin-bottom: 18px;
}

/* --- Kateqoriya səhifəsi: "əsas 6 xidmət" kartları — nömrəli, innovativ ---
   Köhnə dizaynda giriş mətni grid-in bir hissəsi kimi sütun tutub cərgə
   balansını pozurdu (bax: 51-ci sətrin əvvəlki versiyası) və kartlar sabit
   hündürlükdə deyildi. İndi giriş ayrıca tam-en cərgədədir, kartlar isə
   flex-column + height:100% ilə cərgə daxilində tam paralel qalır. "Ghost"
   nömrə arxa fonda — premium agentlik saytlarında geniş yayılmış, təkrarçı
   ikon əvəzinə fərqləndirici vizual element. */
.category-service-card {
    position: relative;
    display: flex;
    flex-direction: column;
    height: 100%;
    padding: 38px 34px;
    background: var(--color-white);
    border: 1px solid var(--color-border);
    border-radius: 22px;
    overflow: hidden;
    text-decoration: none !important;
    transition: border-color 0.3s ease, box-shadow 0.3s ease, transform 0.3s ease;
}
.category-service-card::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 4px;
    background: var(--color-primary);
    transform: scaleX(0);
    transform-origin: left;
    transition: transform 0.35s ease;
}
.category-service-card:hover {
    border-color: var(--color-primary);
    box-shadow: 0 24px 48px -20px rgba(53, 131, 70, 0.28);
    transform: translateY(-6px);
}
.category-service-card:hover::before {
    transform: scaleX(1);
}
.category-service-card__index {
    position: absolute;
    top: 8px;
    right: 22px;
    font-size: 68px;
    font-weight: 800;
    color: var(--color-border);
    line-height: 1;
    z-index: 0;
    user-select: none;
    transition: color 0.3s ease;
}
.category-service-card:hover .category-service-card__index {
    color: #EAF6ED;
}
.category-service-card__title {
    position: relative;
    z-index: 1;
    font-size: 20px;
    font-weight: 700;
    color: var(--color-heading-1);
    margin: 6px 0 14px;
    padding-right: 30px;
}
.category-service-card__desc {
    position: relative;
    z-index: 1;
    font-size: 14.5px;
    color: var(--color-body);
    line-height: 1.65;
    margin-bottom: 24px;
    flex: 1 1 auto;
}
.category-service-card__link {
    position: relative;
    z-index: 1;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 14px;
    font-weight: 700;
    color: var(--color-primary);
    margin-top: auto;
}
.category-service-card__link i {
    font-size: 12px;
    transition: transform 0.2s ease;
}
.category-service-card:hover .category-service-card__link i {
    transform: translateX(4px);
}

/* --- Konsultasiya formu: "Xidmət" → "Alt-xidmət" asılı seçim ---
   Vendor `.contact-form-style-one` yalnız input/textarea-nı stilləşdirir,
   select-i yox — eyni görünüş burada təkrarlanır. Alt-xidmət kateqoriya
   seçilənə qədər deaktivdir (aşağıda base.html-də JS asılılığı idarə edir). */
.contact-form-style-one select {
    display: block;
    width: 100%;
    height: 56px;
    padding: 0 18px;
    border-radius: 0;
    border: 1px solid #DBE7FF;
    background: var(--color-white);
    color: var(--color-heading-1);
    font-size: 15px;
    transition: border-color 0.25s ease, opacity 0.25s ease;
}
.contact-form-style-one select:focus {
    border-color: var(--color-primary);
    outline: none;
}
.contact-form-style-one select:disabled {
    background: #F7F8FC;
    color: var(--color-body);
    cursor: not-allowed;
}

/* --- Konsultasiya səhifəsi: premium forma kartı ---
   Vendor `.contact-form-style-one` sadə açıq-mavi fonlu qutu idi (bax
   yuxarı, style.css). Burada elevasiya, mərkəzləşdirilmiş başlıq bloku və
   üst accent-zolaq əlavə olunur — səhifədə formun yeganə əsas fokus
   nöqtəsi olduğu üçün digər kartlardan daha "premium" görünməlidir. */
.consultation-form-card {
    position: relative;
    background: var(--color-white) !important;
    border: 1px solid var(--color-border) !important;
    border-radius: 28px;
    padding: 56px 60px !important;
    box-shadow: 0 40px 80px -40px rgba(53, 131, 70, 0.3);
    overflow: hidden;
}
.consultation-form-card::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 5px;
    background: var(--color-primary);
}
@media only screen and (max-width: 575px) {
    .consultation-form-card {
        padding: 32px 26px !important;
    }
}
.consultation-form-card__header {
    text-align: center;
    margin-bottom: 36px;
}
.consultation-form-card__header .title {
    margin-top: 10px;
    margin-bottom: 12px;
}
.consultation-form-card__header .disc {
    max-width: 46ch;
    margin: 0 auto;
    color: var(--color-body);
}
.consultation-form-card .rts-btn.btn-primary {
    border-radius: 999px;
    height: 58px;
}

/* --- Konsultasiya formu: input/select-lərin premium görünüşü ---
   Vendor `border-radius: 0` sərt künclər verirdi, native <select> isə
   heç bir stil almırdı (OS-dəfolt görünüş). İkisi də eyni yumşaq-künclü,
   fokusda parıldayan dilə uyğunlaşdırılır; select-ə xüsusi ox ikonu
   (appearance:none + background-image) əlavə olunur. */
.consultation-form-card input,
.consultation-form-card textarea,
.consultation-form-card select {
    border-radius: 12px !important;
    border-color: var(--color-border) !important;
    transition: border-color 0.25s ease, box-shadow 0.25s ease;
}
.consultation-form-card input:focus,
.consultation-form-card textarea:focus,
.consultation-form-card select:focus {
    border-color: var(--color-primary) !important;
    box-shadow: 0 0 0 4px color-mix(in srgb, var(--color-primary) 14%, transparent);
    outline: none;
}
.consultation-form-card select {
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    padding-right: 44px !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8' fill='none'%3E%3Cpath d='M1 1.5L6 6.5L11 1.5' stroke='%23358346' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 18px center;
    cursor: pointer;
}
.consultation-form-card select:disabled {
    cursor: not-allowed;
    /* Uzun-formalı background-* xassələri ayrıca yazılır: `.contact-form-
       style-one select:disabled` qısaldılmış `background:` bəyanatı istifadə
       edir, bu isə repeat/position-u sıfırlayır (initial: repeat, 0% 0%) —
       nəticədə ox ikonu bütün select boyu "kirəmid" kimi təkrarlanırdı. */
    background-color: #F7F8FC !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8' fill='none'%3E%3Cpath d='M1 1.5L6 6.5L11 1.5' stroke='%23A7B3AC' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-position: right 18px center !important;
    color: var(--color-body) !important;
}

/* --- Konsultasiya formu: validasiya xətası spacing-i ---
   Vendor `.single-input-wrapper { align-items: center }` xəta mesajını
   input-dan ƏVVƏL yerləşdirəndə, cüt sütunlardan yalnız biri hündür olanda
   (məs. tam ad boşdursa, layihə adı yox) o cütün input-ları fərqli
   hündürlükdə "üzürdü". Xəta indi input-dan SONRA göstərilir və sətir
   yuxarıdan düzləndirilir (flex-start) ki, cüt input-lar həmişə eyni
   sətirdə başlasın, xəta olub-olmamasından asılı olmayaraq. */
.consultation-form-card .single-input-wrapper {
    align-items: flex-start !important;
}
.consultation-form-card .errorlist {
    list-style: none;
    margin: 6px 2px 0 !important;
    padding: 0;
    font-size: 13px;
    color: #E5484D;
}
.consultation-form-card textarea {
    margin-bottom: 6px;
}


/* ============================================================
   ANA SƏHİFƏ — premium/innovativ yenidənqurma (motion daxil)
   ============================================================
   Bütün animasiyalar `prefers-reduced-motion: reduce` altında tam
   sönür və `[data-reveal]` yalnız `html.js` sinfi ilə (JS-siz halda
   opacity:0 heç vaxt tətbiq olunmur — SEO/əlçatanlıq). */

/* --- Sitewide scroll-reveal utility --- */
html.js [data-reveal] {
    opacity: 0;
    transform: translateY(32px);
    transition: opacity 0.8s cubic-bezier(.16,.84,.44,1), transform 0.8s cubic-bezier(.16,.84,.44,1);
    transition-delay: var(--reveal-delay, 0s);
}
html.js [data-reveal].is-in {
    opacity: 1;
    transform: none;
}
@media (prefers-reduced-motion: reduce) {
    html.js [data-reveal] {
        opacity: 1 !important;
        transform: none !important;
        transition: none !important;
    }
}

/* --- Hero: aurora/mesh fon + üzən etibar çipləri --- */
.home-hero {
    position: relative;
    overflow: hidden;
}
.home-hero__aurora {
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    overflow: hidden;
}
.home-hero__aurora span {
    position: absolute;
    border-radius: 50%;
    filter: blur(70px);
    opacity: 0.35;
    animation: home-aurora-drift 16s ease-in-out infinite;
}
.home-hero__aurora span:nth-child(1) {
    width: 420px;
    height: 420px;
    top: -120px;
    left: -80px;
    background: var(--color-primary);
    animation-delay: 0s;
}
.home-hero__aurora span:nth-child(2) {
    width: 320px;
    height: 320px;
    top: 40%;
    right: -100px;
    background: #57BB6D;
    animation-delay: -5s;
}
.home-hero__aurora span:nth-child(3) {
    width: 260px;
    height: 260px;
    bottom: -100px;
    left: 30%;
    background: #1BA2DB;
    opacity: 0.18;
    animation-delay: -10s;
}
@keyframes home-aurora-drift {
    0%, 100% { transform: translate(0, 0) scale(1); }
    33% { transform: translate(30px, -24px) scale(1.08); }
    66% { transform: translate(-24px, 18px) scale(0.96); }
}
.home-hero .rts-banner-content-three,
.home-hero .thumbnail-large-iamge-banner-three {
    position: relative;
    z-index: 1;
}
@media (prefers-reduced-motion: reduce) {
    .home-hero__aurora span { animation: none; }
}

/* İkon-yalnız üzən nişanlar — mətn silinib, məna `aria-label` vasitəsilə
   ekran oxuyuculara ötürülür (vizual olaraq təkrarçı deyil, təmiz görünür). */
.home-hero__chip {
    position: absolute;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 62px;
    height: 62px;
    background: var(--color-white);
    border: 1px solid var(--color-border);
    border-radius: 50%;
    box-shadow: 0 20px 40px -20px rgba(15, 30, 20, 0.3);
    animation: home-chip-float 5s ease-in-out infinite;
}
.home-hero__chip i {
    color: var(--color-primary);
    font-size: 22px;
}
.home-hero__chip--one {
    top: 6%;
    left: -6%;
    animation-delay: 0s;
}
.home-hero__chip--two {
    bottom: 10%;
    right: -4%;
    animation-delay: -2.4s;
}
@keyframes home-chip-float {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-12px); }
}
@media (max-width: 1199px) {
    .home-hero__chip { display: none; }
}
@media (prefers-reduced-motion: reduce) {
    .home-hero__chip { animation: none; }
}

/* --- Hero altı: "etibar" marquee zolağı (kateqoriya adları, sonsuz sürüşmə) --- */
.home-marquee {
    position: relative;
    z-index: 1;
    border-top: 1px solid var(--color-border);
    border-bottom: 1px solid var(--color-border);
    padding: 22px 0;
    background: var(--color-white);
}
/* Label sabit sütun, track isə AYRI overflow:hidden qutuda animasiya olunur —
   beləliklə sonsuz sürüşən mətn heç vaxt label-in altından keçib
   üst-üstə düşmür (əvvəlki versiyada ikisi eyni sətirdə sərbəst axırdı). */
.home-marquee .container-fluid {
    display: flex;
    align-items: center;
    gap: 18px;
}
.home-marquee__label {
    flex: 0 0 auto;
    padding-right: 18px;
    border-right: 1px solid var(--color-border);
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--color-body);
    white-space: nowrap;
}
.home-marquee__viewport {
    flex: 1 1 auto;
    overflow: hidden;
}
.home-marquee__track {
    display: inline-flex;
    align-items: center;
    gap: 48px;
    animation: home-marquee-scroll 28s linear infinite;
    will-change: transform;
}
.home-marquee__track span {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    font-size: 15px;
    font-weight: 600;
    color: var(--color-heading-1);
    white-space: nowrap;
}
.home-marquee__track span i {
    color: var(--color-primary);
    font-size: 8px;
}
@keyframes home-marquee-scroll {
    from { transform: translateX(0); }
    to { transform: translateX(-50%); }
}
@media (prefers-reduced-motion: reduce) {
    .home-marquee__track { animation: none; }
}

/* --- Ana səhifə "Xidmətlər" bölməsi — interaktiv "spotlight" showcase ---
   Köhnə 6-6-6-6 kart grid-i (bootstrap sətri həndəsi cəhətdən düz gəlmirdi:
   col-lg-6 mətn + 4×col-lg-3 kart = 18 vahid, 12-lik grid-ə sığmayıb 3-cü/4-cü
   kart aşağı sətrə düşürdü, üstəlik yalnız ilk 4 kateqoriya görünürdü).
   Yeni dizayn: solda bütün 6 kateqoriyanın siyahısı (Bootstrap tab —
   `about` bölməsi ilə eyni, sınanmış mexanizm), sağda böyük "səhnə" paneli.
   Klikləmə ilə keçid (hover-naviqasiya toxunma/klaviatura üçün əlçatan
   deyil), keçid zamanı fade+sürüşmə animasiyası. */
.home-services-spotlight {
    display: grid;
    grid-template-columns: minmax(280px, 380px) 1fr;
    gap: 28px;
    align-items: stretch;
}
@media (max-width: 991px) {
    .home-services-spotlight {
        grid-template-columns: 1fr;
    }
}
.home-services-spotlight__list {
    display: flex;
    flex-direction: column;
    gap: 8px;
    border-bottom: none;
}
.home-services-spotlight__item {
    position: relative;
    display: flex;
    align-items: center;
    gap: 16px;
    width: 100%;
    padding: 18px 20px;
    background: transparent;
    border: 1px solid transparent;
    border-radius: 16px;
    text-align: left;
    cursor: pointer;
    font: inherit;
    appearance: none;
    transition: background 0.3s ease, border-color 0.3s ease, transform 0.3s ease;
}
.home-services-spotlight__item::before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 3px;
    height: 0;
    border-radius: 3px;
    background: var(--color-primary);
    transition: height 0.3s ease;
}
.home-services-spotlight__item .num {
    font-size: 14px;
    font-weight: 700;
    color: var(--color-body);
    transition: color 0.3s ease;
}
.home-services-spotlight__item .name {
    flex: 1 1 auto;
    font-size: 17px;
    font-weight: 700;
    color: var(--color-heading-1);
}
.home-services-spotlight__item .arrow {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    color: var(--color-primary);
    opacity: 0;
    transform: translateX(-6px);
    transition: opacity 0.3s ease, transform 0.3s ease;
}
.home-services-spotlight__item:hover {
    background: #F7FAF8;
    transform: translateX(4px);
}
.home-services-spotlight__item:hover .arrow {
    opacity: 1;
    transform: translateX(0);
}
.home-services-spotlight__item.active {
    background: var(--color-white);
    border-color: var(--color-border);
    box-shadow: 0 16px 32px -20px rgba(15, 30, 20, 0.2);
}
.home-services-spotlight__item.active::before {
    height: 60%;
}
.home-services-spotlight__item.active .num {
    color: var(--color-primary);
}
.home-services-spotlight__item.active .arrow {
    opacity: 1;
    transform: translateX(0);
}

.home-services-spotlight__stage {
    position: relative;
    min-height: 420px;
    padding: 56px;
    border-radius: 28px;
    background: radial-gradient(circle at 15% 15%, #EAF6ED 0%, #F7FAF8 45%, var(--color-white) 100%);
    border: 1px solid var(--color-border);
    overflow: hidden;
}
.home-services-spotlight__stage::before,
.home-services-spotlight__stage::after {
    content: "";
    position: absolute;
    border-radius: 50%;
    filter: blur(50px);
    opacity: 0.5;
    animation: home-aurora-drift 18s ease-in-out infinite;
    pointer-events: none;
}
.home-services-spotlight__stage::before {
    width: 220px;
    height: 220px;
    top: -60px;
    right: 10%;
    background: #57BB6D;
}
.home-services-spotlight__stage::after {
    width: 160px;
    height: 160px;
    bottom: -40px;
    right: 30%;
    background: #1BA2DB;
    opacity: 0.25;
    animation-delay: -9s;
}
@media (prefers-reduced-motion: reduce) {
    .home-services-spotlight__stage::before,
    .home-services-spotlight__stage::after { animation: none; }
}
@media (max-width: 575px) {
    .home-services-spotlight__stage { padding: 36px 28px; min-height: auto; }
}

/* Bootstrap `.tab-pane.fade` defolt yalnız opacity keçidi verir — burada
   həm opacity, həm yüngül translateY ilə daha premium "səhnəyə çıxma"
   effekti; müddəti Bootstrap-ın öz JS-i `getComputedStyle`-dan oxuduğu
   üçün təhlükəsiz şəkildə uzadıla bilər (tab.js sərt 150ms güdmür). */
.home-services-spotlight__stage .tab-pane {
    position: relative;
    z-index: 1;
    transition: opacity 0.45s cubic-bezier(.16,.84,.44,1), transform 0.45s cubic-bezier(.16,.84,.44,1);
    transform: translateY(14px);
}
.home-services-spotlight__stage .tab-pane.show {
    transform: none;
}
@media (prefers-reduced-motion: reduce) {
    .home-services-spotlight__stage .tab-pane { transition: opacity 0.2s linear; transform: none; }
}
.home-services-spotlight__panel-ghost {
    position: absolute;
    top: -10px;
    right: 24px;
    font-size: 160px;
    font-weight: 800;
    line-height: 1;
    color: rgba(53, 131, 70, 0.08);
    user-select: none;
    z-index: 0;
}
@media (max-width: 767px) {
    .home-services-spotlight__panel-ghost { font-size: 100px; }
}
.home-services-spotlight__panel .icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 72px;
    height: 72px;
    border-radius: 20px;
    background: var(--color-primary);
    margin-bottom: 26px;
    box-shadow: 0 16px 32px -14px rgba(53, 131, 70, 0.55);
    animation: home-panel-pop 0.5s cubic-bezier(.16,.84,.44,1);
}
.home-services-spotlight__panel .icon img {
    width: 32px;
    height: 32px;
    filter: brightness(0) invert(1);
}
@keyframes home-panel-pop {
    from { transform: scale(0.6) rotate(-8deg); opacity: 0; }
    to { transform: scale(1) rotate(0); opacity: 1; }
}
@media (prefers-reduced-motion: reduce) {
    .home-services-spotlight__panel .icon { animation: none; }
}
.home-services-spotlight__panel .title {
    font-size: 28px;
    font-weight: 800;
    color: var(--color-heading-1);
    margin-bottom: 16px;
}
.home-services-spotlight__panel .disc {
    font-size: 15.5px;
    color: var(--color-body);
    line-height: 1.75;
    max-width: 52ch;
    margin-bottom: 30px;
}

/* --- Layihələr (case) swiper — hover overlay reveal --- */
.home-case-card {
    position: relative;
    display: block;
    border-radius: 22px;
    overflow: hidden;
    text-decoration: none !important;
}
.home-case-card__thumb {
    position: relative;
    aspect-ratio: 4 / 3;
    overflow: hidden;
    border-radius: 22px;
}
.home-case-card__thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.6s cubic-bezier(.16,.84,.44,1);
}
.home-case-card:hover .home-case-card__thumb img {
    transform: scale(1.08);
}
.home-case-card__overlay {
    position: absolute;
    inset: 0;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    padding: 26px;
    background: linear-gradient(180deg, rgba(11, 32, 22, 0) 40%, rgba(11, 32, 22, 0.88) 100%);
    opacity: 0;
    transition: opacity 0.35s ease;
}
.home-case-card:hover .home-case-card__overlay {
    opacity: 1;
}
.home-case-card__tag {
    display: inline-block;
    align-self: flex-start;
    margin-bottom: 10px;
    padding: 5px 14px;
    border-radius: 999px;
    background: var(--color-primary);
    color: var(--color-white);
    font-size: 12px;
    font-weight: 700;
}
.home-case-card__title {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    color: var(--color-white);
    font-size: 19px;
    font-weight: 700;
}
.home-case-card__title i {
    flex-shrink: 0;
    transition: transform 0.3s ease;
}
.home-case-card:hover .home-case-card__title i {
    transform: translate(4px, -4px);
}

/* --- Texnologiya/facilities bölməsi: tilt şəkil + üzən nişan --- */
.home-facilities-visual {
    position: relative;
}
.home-facilities-visual [data-tilt] {
    transition: transform 0.2s ease-out;
    transform-style: preserve-3d;
    border-radius: 24px;
    overflow: hidden;
}
.home-facilities-visual [data-tilt] img {
    display: block;
    width: 100%;
    border-radius: 24px;
}
.home-facilities-badge {
    position: absolute;
    bottom: 24px;
    left: -24px;
    z-index: 2;
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 18px 22px;
    background: var(--color-white);
    border-radius: 18px;
    box-shadow: 0 24px 48px -20px rgba(15, 30, 20, 0.3);
}
.home-facilities-badge .icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 46px;
    height: 46px;
    border-radius: 14px;
    background: #EAF6ED;
    color: var(--color-primary);
    font-size: 20px;
    flex-shrink: 0;
}
.home-facilities-badge .value {
    font-size: 22px;
    font-weight: 800;
    color: var(--color-heading-1);
    line-height: 1.1;
}
.home-facilities-badge .label {
    font-size: 12.5px;
    color: var(--color-body);
}
@media (max-width: 991px) {
    .home-facilities-badge { left: 16px; }
}