

/* --- AI Entegrator Is Ortaklari: harita ve ortak kartlari ----------------
   Eski surum ust uste binmis SVG katmanlariydi (#mapRoot + her bolge icin
   bir .map-child) ve katmanlar /static/media/svg/ altindan fetch ediliyordu.
   O dosyalar .gitignore'daki "media" kurali yuzunden depoda degildi, bu
   yuzden yerelde tum harita 404 veriyordu. Yeni surum tek bir zemin
   gorseli + uzerine yuzde ile konumlanan isaretciler kullaniyor; hepsi
   static/images/ai-integrator-partners/ altinda ve depoda.
   -------------------------------------------------------------------------- */
/* --- Sayfa govdesi: events / blogs / news ile ayni kalip -----------------
   Gri sahne uzerinde 40px radius beyaz kartlar; kart kenardan 20px iceride,
   ic yan bosluk clamp(20px, 10.5vw, 150px). Onceden .container base.css'in
   1320px sinirina takiliyor ve genis ekranda iki yanda buyuk olu alan
   birakiyordu. */
#content {
    background: #F5F6F8;
    padding-bottom: 30px;
}

/* width/max-width !important: bootstrap .container'a hem width hem
   basamakli max-width veriyor (1400px+ icin 1320px). base.css'te
   1400px ustu icin bir ezme kurali var; buradaki daha kucuk
   kirilimlari da kapsiyor. */
#content > .container {
    width: auto !important;
    max-width: none !important;
    background: #fff;
    margin: 0 20px 30px;
    border-radius: 40px;
    padding: clamp(24px, 8vw, 80px) clamp(20px, 10.5vw, 150px);
}

#content > .container:last-child {
    margin-bottom: 0;
}

.ai-partners__head {
    margin-bottom: clamp(24px, 4vw, 48px);
}

/* Taban LIGHT: ust bannerdaki h1 ile ayni kalip - vurgulanmayan
   kelimeler ince, vurgular <b>/.title-gradient ile 600. Taban 600 iken
   duz metin de kalin cikiyor, ayni cumlede uc farkli agirlik olusuyordu. */
.ai-partners__title {
    margin: 0 0 12px;
    font-size: clamp(22px, 3vw, 30px);
    font-weight: 300;
    line-height: 1.3;
    color: #0B0B0F;
}

/* base-1.css'te global bir "span { font-size:1.25rem; display:block;
   font-weight:500 }" kurali var; basliktaki span'ler bu yuzden
   baslikatan kucuk cikiyordu. Baslikla ayni olcuye sabitleniyorlar. */
.ai-partners__title span {
    display: inline;
    font-size: inherit;
    line-height: inherit;
    margin: 0;
}

/* "Entegratör İş Ortağı" semibold, "Olun!" light */
/* <b> tarayici varsayilaniyla 700'e cikiyor; basligin tabani 600
   oldugu icin ayni cumlede iki farkli kalinlik olusuyordu. */
.ai-partners__title b,
.ai-partners__title .title-gradient {
    font-weight: 600;
}

.ai-partners__title-light {
    font-weight: 300;
    color: inherit;
}

.ai-partners__subtitle {
    margin: 0;
    max-width: 46ch;
    color: #858C9C;
    font-size: clamp(13px, 1.5vw, 14px);
    line-height: 1.7;
}

/* --- Harita --- */
.ai-map {
    position: relative;
}

/* aspect-ratio: harita SVG'si JS ile fetch edilip iceri yerlestiriliyor;
   gelene kadar bu div'in yuksekligi sifirdi ve SVG dusunce altindaki tum
   icerik asagi kayiyordu (CLS 0.181). viewBox orani (1067/639) bastan
   rezerve ediliyor, yerlesim hic oynamiyor. */
.ai-map__base {
    display: block;
    width: 100%;
    aspect-ratio: 1067 / 639;
}

.ai-map__base svg,
.ai-map__svg {
    display: block;
    width: 100%;
    height: auto;
}

/* --- Bolge vurgusu ------------------------------------------------------
   Zemin SVG'sindeki bolge noktalari uretim sirasinda renklerine gore
   siniflandi (.ai-region--turkey vb. - bkz. world-map.svg). Varsayilan
   durumda hepsi haritanin gri tonuna boyaniyor; yalnizca isaretcisi
   secili olan bolge kendi rengine donuyor.

   Bolge path'lerinin kendi fill/fill-opacity oznitelikleri uretim
   sirasinda silindi, bu yuzden renk yalnizca buradan geliyor. */
.ai-region {
    fill: #E4E6EF;
    transition: fill .25s ease;
}

/* Her bolgenin rengi tek yerde: hem harita noktalarini hem de acik
   ortak kartlarinin cercevesini/linkini besliyor (--region-color). */
.ai-map[data-active-region="south-america"] {
    --region-color: #13B4FF;
}

.ai-map[data-active-region="europe"] {
    --region-color: #0076FF;
}

.ai-map[data-active-region="south-asia"] {
    --region-color: #7C62FF;
}

.ai-map[data-active-region="turkey"] {
    --region-color: #FF6262;
}

.ai-map[data-active-region="south-carolina"] {
    --region-color: #94C1EB;
}

.ai-map[data-active-region="malaysia"] {
    --region-color: #B3D5FE;
}

.ai-map[data-active-region="qatar"] {
    --region-color: #C6538E;
}

.ai-map[data-active-region="south-america"] .ai-region--south-america {
    fill: #13B4FF;
}

.ai-map[data-active-region="europe"] .ai-region--europe {
    fill: #0076FF;
}

.ai-map[data-active-region="south-asia"] .ai-region--south-asia {
    fill: #7C62FF;
}

.ai-map[data-active-region="turkey"] .ai-region--turkey {
    fill: #FF6262;
}

.ai-map[data-active-region="south-carolina"] .ai-region--south-carolina {
    fill: #94C1EB;
}

.ai-map[data-active-region="malaysia"] .ai-region--malaysia {
    fill: #B3D5FE;
}

.ai-map[data-active-region="qatar"] .ai-region--qatar {
    fill: #C6538E;
}

/* Isaretciler haritaya gore yuzde ile konumlaniyor, boylece harita
   olceklenirken birlikte kayiyorlar. --x/--y sablonda veriliyor ve
   isaretcinin UCU (pin'in sivri alt noktasi) o koordinata denk gelsin
   diye asagi/yana yariya kadar kaydiriliyor. */
/* --drop: isaretcinin ucu bolgenin ust kenarina degil, bir miktar
   ASAGISINA otursun diye ortak kaydirma. Tek yerden ayarlanir. */
.ai-map__marker {
    --drop: 6%;
    position: absolute;
    left: var(--x);
    top: calc(var(--y) + var(--drop));
    transform: translate(-50%, -100%);
    width: clamp(68px, 9.5vw, 112px);
    padding: 0;
    border: 0;
    background: none;
    cursor: pointer;
    line-height: 0;
    transition: transform .2s ease;
}

.ai-map__marker img {
    display: block;
    width: 100%;
    height: auto;
}

.ai-map__marker:hover,
.ai-map__marker.is-active {
    transform: translate(-50%, -100%) scale(1.06);
}

.ai-map__marker:focus-visible {
    outline: 2px solid #096DFF;
    outline-offset: 4px;
    border-radius: 8px;
}

/* --- Bolge kartlari: isaretci tiklaninca acilir --- */
.ai-map__panels {
    position: absolute;
    inset: 0;
    pointer-events: none;
}

/* Panel, bolgenin DISINA aciliyor: --panel-x bolgenin sinir kutusunun
   kenari (sablonda, olculen degerlerden veriliyor), data-side hangi yone
   acilacagini soyluyor. Onceden panel isaretciye hizaliydi ve isaretci
   bolgenin ortasinda durdugu icin kartlar bolge noktalarinin ustunu
   kapatiyordu. 24px'lik bosluk bolge ile kart arasinda pay birakiyor. */
.ai-partner-cards {
    position: absolute;
    left: var(--panel-x, 50%);
    top: var(--panel-y, 50%);
    display: flex;
    flex-direction: column;
    gap: 10px;
    pointer-events: auto;
}

/* Sola acilan: panelin SAG kenari bolgenin sol sinirindan 24px uzakta */
.ai-partner-cards[data-side="left"] {
    transform: translate(calc(-100% - 24px), -50%);
}

/* Saga acilan: panelin SOL kenari bolgenin sag sinirindan 24px uzakta */
.ai-partner-cards[data-side="right"] {
    transform: translate(24px, -50%);
}

.ai-partner-card {
    display: flex;
    align-items: center;
    gap: 12px;
    width: 240px;
    padding: 10px 12px;
    /* Cerceve acik bolgenin rengini alir; degisken yoksa notr gri */
    border: 1px solid var(--region-color, #E3E7EF);
    border-radius: 12px;
    background: #fff;
    box-shadow: 0 6px 18px rgba(15, 23, 42, .08);
    text-decoration: none;
    transition: box-shadow .2s ease, transform .2s ease;
}

.ai-partner-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 10px 24px rgba(15, 23, 42, .16);
}

.ai-partner-card > img {
    flex: 0 0 auto;
    width: 54px;
    height: auto;
    object-fit: contain;
}

/* base-1.css'te global bir "span { font-size:1.25rem; display:block }"
   kurali var; karttaki span'ler kendi olculerine sabitleniyor. */
.ai-partner-card__text {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
    font-size: inherit;
    line-height: inherit;
    margin: 0;
}

.ai-partner-card__name {
    display: block;
    margin: 0;
    font-size: 13px;
    font-weight: 700;
    line-height: 1.3;
    color: #1B1F29;
}

.ai-partner-card__area {
    display: block;
    margin: 0;
    font-size: 11px;
    font-weight: 400;
    line-height: 1.4;
    color: #858C9C;
}

.ai-partner-card__link {
    display: block;
    margin: 0;
    font-size: 11px;
    font-weight: 500;
    line-height: 1.4;
    color: var(--region-color, #7640E8);
}

/* Dar ekran: harita uzerinde panel icin yer yok, kartlar haritanin
   altina normal akisa doner. */
@media (max-width: 991px) {
    .ai-map__panels {
        position: static;
        inset: auto;
        margin-top: 20px;
    }

    .ai-partner-cards,
    .ai-partner-cards[data-side="left"],
    .ai-partner-cards[data-side="right"] {
        position: static;
        transform: none;
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: center;
    }

    .ai-partner-card {
        width: 100%;
        max-width: 280px;
    }
}

.office-title {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    margin: 40px 0;
    background-color: #FFF;
    border-radius: 25px;
    border: 1px solid rgba(146, 153, 181, 0.3);
    padding: 20px;
}

.office-title .title {
    margin: 0 auto;
    font-family: "DM Sans", sans-serif;
    font-weight: 500;
    font-size: 22px;
}

.office-title .partner {
    color: rgba(24, 118, 255, 1);
    font-weight: 600;
}

.office-title img {
    width: 40px;
    height: 40px;
    cursor: pointer;
}

/* --- Harita altindaki bilgi karti --------------------------------------- */
.partners-info__title {
    margin-bottom: clamp(20px, 3vw, 32px);
}

.partners-info p {
    margin: 0 0 16px;
    color: #858C9C;
    font-size: 14px;
    line-height: 1.7;
}

.partners-info ul {
    margin: 0 0 20px;
    padding-left: 20px;
}

.partners-info li {
    color: #858C9C;
    font-size: 14px;
    line-height: 1.8;
}

/* Ara basliklar: gorselde mavi degil koyu, metinden belirgin ayrilsin */
.little-title {
    margin: 24px 0 8px;
    color: #1B1F29;
    font-size: 14px;
    font-weight: 600;
    line-height: 1.5;
}

/* Sondaki vurgu cumlesi gorselde daha buyuk ve kalin */
.partners-info p.partners-info__highlight {
    margin-top: 28px;
    color: #1B1F29;
    font-size: clamp(15px, 1.8vw, 17px);
    font-weight: 600;
    line-height: 1.5;
}

/* Ic ice iki kutu vardi: gri cerceveli .detail-container-item icinde
   mavi cerceveli .detail-container-item__content. Metin artik sayfanin
   kendi beyaz kartinin icinde durdugu icin ikisi de sade birakildi -
   ucuncu bir cerceve gorsel gurultu yaratiyordu. */
.detail-container-item {
    border-radius: 0;
    background: none;
    border: 0;
    padding: 0;
}

.detail-container-item__content {
    background: none;
    border: 0;
    border-radius: 0;
    padding: 0;
}

.detail-container-item__content .header {
    background-color: rgba(23, 32, 236, 1);
    border-radius: 25px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 50px;
    padding: 170px 166px;
    margin-bottom: 25px;
}

@media (max-width: 767px) {
    .detail-container-item__content .header {
        padding: 70px 66px;
    }
}

.detail-container-item__content .title {
    color: rgba(23, 15, 73, 0.8);
    font-weight: 600;
    font-size: 20px;
    font-family: "DM Sans", sans-serif;
    margin-bottom: 20px;
}

.detail-container-item__content .subtitle {
    margin-bottom: 20px;
    color: rgba(24, 118, 255, 1);
    font-weight: 600;
    font-size: 20px;
}

/* Govde metni: kalin olmayan her sey #858C9C. Bu iki secici
   .partners-info kurallarindan daha ozgul, o yuzden renk burada
   veriliyor - aksi halde eski koyu lacivert ton geri geliyordu. */
.detail-container-item__content p {
    font-weight: 400;
    font-size: 14px;
    line-height: 1.7;
    color: #858C9C;
    margin-bottom: 16px;
}

.detail-container-item ul {
    margin-bottom: 20px;
    color: #858C9C;
    font-weight: 400;
}

.detail-container-item li {
    color: #858C9C;
}

/* Vurgu cumlesi kalin ve koyu kalir */
.detail-container-item__content p.partners-info__highlight {
    color: #1B1F29;
    font-weight: 600;
}

.page-title {
    color: #181B23;
    font-size: 32px;
    text-align: center;
    margin: 50px 0 10px 0;
    font-weight: 600;
}

.page-title span {
    color: #1876FF;
}

.page-subtitle {
    text-align: center;
    font-size: 18px;
    color: #3A3D46;
    font-weight: 700;
}

.page-subtitle {

}
/* Mobilde ic bosluklar toplamda 90px'i gecip form alanini ~120px'e dusuruyordu;
   sabit genislikli reCAPTCHA widget'i bu kutuya sigmiyordu. */
@media (max-width: 480px) {
    .form-container {
        padding: 16px;
    }
}

/* --- Entegrator formu ----------------------------------------------------
   Contact sayfasiyla ayni form tasarimi (craniocatch-form-* sinif ailesi,
   CSS base.css + newContact.css'te). Burada yalnizca cerceve ve saga
   konan gorsel tanimlaniyor. Eski .form-container gri kutusu kaldirildi. */
/* Form artik kendi .container kartinda (harita ve bilgi kartiyla ayni
   seviyede), bu yuzden ustten ekstra bosluk almiyor - kartin kendi
   padding'i yeterli. */
.partners-form {
    margin-top: 0;
}

.partners-form__title {
    margin-bottom: clamp(20px, 3vw, 32px);
}

/* Gorsel kartin SAG kenarina yapisiyor: kutunun kendi padding'i yalnizca
   form kolonuna uygulaniyor (grid'in ilk sutunu), gorsel kolonu ise
   kenara kadar uzanip ust/alt hizasini koruyor. overflow: hidden kose
   yuvarlakligini gorselde de kesiyor. */
.partners-form__body {
    display: grid;
    grid-template-columns: minmax(0, 70%) minmax(0, 30%);
    /* gap yok: gorsel form kolonuna bitisik, kartin sag kenarina kadar */
    gap: 0;
    align-items: stretch;
    border: 1px solid #E3E7EF;
    border-radius: 20px;
    background: #fff;
    overflow: hidden;
}

/* Ic bosluk yalnizca form tarafinda */
.partners-form__body > .craniocatch-contact-form-section {
    padding: clamp(20px, 2.5vw, 28px);
}

.partners-form__visual {
    min-width: 0;
}

/* Resim kolonu tamamen doldurur: sagda, ustte ve altta bosluk kalmaz,
   kartin kose yuvarlakligina oturur (kapsayicida overflow: hidden).
   object-fit: cover en-boy orani koruyup tasan kismi kirpar - resmin
   tamamini gostermek (contain) ile kolonu bosluksuz doldurmak ayni
   anda mumkun degil; tasarim ikincisini istiyor. */
.partners-form__visual img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

/* Gonder butonu: gradyan cerceveli, sayfanin geri kalaniyla ayni dil.
   base.css'teki koyu dolgulu .craniocatch-submit-button eziliyor. */
.partners-form .craniocatch-submit-button {
    position: relative;
    min-width: 0;
    padding: 8px 20px;
    border: 1px solid #7640E8;
    border-radius: 9px;
    background: var(--cc-brand);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
    font-size: 14px;
    font-weight: 600;
    box-shadow: none;
    transform: none;
}

.partners-form .craniocatch-submit-button:hover {
    background: var(--cc-brand);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
    transform: none;
    box-shadow: 0 6px 18px rgba(118, 64, 232, .18);
}

.partners-form .craniocatch-submit-button::before {
    content: "";
    position: absolute;
    inset: 0;
    left: 0;
    width: auto;
    height: auto;
    border-radius: inherit;
    padding: 1px;
    background: var(--cc-brand);
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    mask-composite: exclude;
    transition: none;
    pointer-events: none;
}

@supports ((-webkit-mask-composite: xor) or (mask-composite: exclude)) {
    .partners-form .craniocatch-submit-button {
        border-color: transparent;
    }
}

/* Zorunlu alan yildizi */
.partners-form .cc-required {
    display: inline;
    margin: 0 2px 0 0;
    font-size: inherit;
    line-height: inherit;
    color: #FF6262;
}

@media (max-width: 991px) {
    .partners-form__body {
        grid-template-columns: minmax(0, 1fr);
    }

    /* Gorsel tek kolonda formun altina duser; cok uzamasin */
    .partners-form__visual {
        max-height: 240px;
    }
}

/* --- reCAPTCHA + gonder butonu ayni satirda -----------------------------
   Widget 304x78px sabit olculu. Kendi tam-genislik satirinda dururken
   formu belirgin sekilde uzatiyor, kart sagdaki gorselden asagi
   tasiyordu. Artik butonla ayni satirda, sola yaslı. */
.partners-form__actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    flex-wrap: wrap;
    margin-top: 16px;
}

.partners-form__captcha {
    min-width: 0;
    /* Widget'i kartin icinde tut: dar ekranda 304px tasma yapiyordu */
    max-width: 100%;
    overflow: hidden;
}

/* Butonun sagda kalmasi icin captcha bosluğu doldurur */
.partners-form__actions .craniocatch-submit-button {
    margin-left: auto;
}

@media (max-width: 575px) {
    /* 304px'lik widget dar ekrana sigmiyor: olcekleniyor */
    .partners-form__captcha #g-recaptcha {
        transform: scale(.85);
        transform-origin: left center;
    }
}

/* --- Ortak detayi: banner + metin ---------------------------------------
   Kartlardaki "Detaya Git" tiklaninca acilir (bkz. ai-partners-map.js).
   Kart gorunmezken tum bolum hidden; paneller arasinda tek seferde biri
   aciktir. */
.partners-detail-card[hidden] {
    display: none;
}

.partner-detail[hidden] {
    display: none;
}

.partner-detail__banner {
    border-radius: 16px;
    overflow: hidden;
    background: #FAFAFC;
}

.partner-detail__banner img {
    display: block;
    width: 100%;
    height: auto;
}

.partner-detail__body {
    margin-top: clamp(20px, 3vw, 28px);
}

.partner-detail__title {
    margin: 24px 0 8px;
    color: #1B1F29;
    font-size: 15px;
    font-weight: 700;
    line-height: 1.5;
}

.partner-detail__title:first-child {
    margin-top: 0;
}

.partner-detail__body p {
    margin: 0 0 16px;
    color: #858C9C;
    font-size: 14px;
    line-height: 1.8;
    text-align: justify;
}

.partner-detail__body p:last-child {
    margin-bottom: 0;
}

/* --- Telefon alani: intl-tel-input ------------------------------------
   Kutuphane input'u kendi sarmalayicisina aliyor; alan diger form
   alanlariyla ayni genislikte ve hizada kalsin. */
.partners-form .iti {
    display: block;
    width: 100%;
}

.partners-form .iti__flag-container {
    z-index: 2;
}

/* Ulke kodu ayri gosteriliyor (separateDialCode), metin onun sagindan
   baslasin diye sol dolgu artiriliyor. */
.partners-form .iti--separate-dial-code .craniocatch-form-input {
    padding-left: 88px;
}

.partners-form .iti__selected-flag {
    border-radius: 10px 0 0 10px;
}

/* Mesaj alani karakter sayaci. Global span kurali (base-1.css) her
   span'i 20px/block yaptigi icin burada acikca geri aliniyor. */
.cc-charcount {
    display: block;
    font-size: 12px;
    font-weight: 400;
    line-height: 1.4;
    color: #858C9C;
    text-align: right;
    margin-top: 4px;
}
.cc-charcount--limit { color: #D92D20; }

/* ==========================================================================
   Hata mesajlari yerlesimi kaydirmasin
   --------------------------------------------------------------------------
   Sorun: .craniocatch-form-error normal akista bir <p>. [hidden] iken hic
   yer kaplamiyor, mesaj cikinca alanin altina satir ekliyordu: kart
   uzuyor, alttaki alanlar ve reCAPTCHA asagi kayiyordu.

   Cozum: mesaj position:absolute ile akistan cikariliyor. Alanin hemen
   altinda, satirlar arasi 20px bosluga binerek gorunur ve hicbir seyi
   itmez - gosterilse de gizlense de form yuksekligi ayni kalir.

   min-height ile sabit yer ayirmak da bir secenekti ama o, hata olmasa
   bile her alanin altina ~40px ekleyip formu bastan uzatiyordu.
   ========================================================================== */
.partners-form .craniocatch-form-group {
    position: relative;
}

.partners-form .craniocatch-form-error {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    margin: 2px 0 0;
    text-align: left;
    font-size: 0.8125rem;
    line-height: 1.25;
    /* Ustteki alanlarin tiklanabilirligini engellemesin */
    pointer-events: none;
    z-index: 2;
}

/* Mesaj satir araligina tasarsa alttaki alani gormezden gelsin diye
   grup kutusu hata anında one alinir */
.partners-form .craniocatch-form-group:focus-within {
    z-index: 3;
}

/* Mesaj alani: altinda karakter sayaci var, mutlak mesaj onun ustune
   binerdi. Burada hata sayacın soluna, ayni satira aliniyor - yine
   yeni satir acmiyor. */
.partners-form .craniocatch-form-group:has(> .cc-charcount) {
    padding-bottom: 0;
}
.partners-form .craniocatch-form-group > .cc-charcount {
    margin-top: 2px;
}
.partners-form #err-message {
    position: absolute;
    top: 100%;
    left: 0;
    /* Sayac sagda duruyor; mesaj onun soluna sigsin */
    right: 90px;
    text-align: left;
}

/* reCAPTCHA hatasi: kutunun altinda kendi alani var, akista kalabilir
   ama yer ayrilarak kart genislemesin */
.partners-form__captcha {
    position: relative;
}
.partners-form #err-captcha {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    margin: 2px 0 0;
}

/* Guvenlik: cok dar ekranda mesaj ikinci satira sarip alttaki alanin
   uzerine binmesin - tek satirda tutulup tasan kismi kirpiliyor.
   Tum mesajlar 36 karakterin altinda oldugu icin normal genislikte
   kirpma devreye girmez; tam metin aria-describedby ile zaten
   ekran okuyucuya gidiyor. */
.partners-form .craniocatch-form-error {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Dar ekranda form tek kolona duser, satir genisligi iki katina cikar:
   orada sarmaya gerek kalmaz, kirpmayi da kaldiralim */
@media (max-width: 768px) {
    .partners-form .craniocatch-form-error {
        white-space: normal;
        overflow: visible;
    }
}

/* Mobilde satir araligi 15px'e dusuyor (base.css); mutlak konumlu
   mesaj icin 22px'e cikariliyor ki alttaki alanla cakismasin. */
@media (max-width: 768px) {
    .partners-form .craniocatch-form-row {
        gap: 22px;
    }
}

/* ==========================================================================
   Satir araligi: hata mesajina nefes payi
   --------------------------------------------------------------------------
   base.css'te satirlar arasi 20px. Mutlak konumlu hata mesaji ~18px
   yer kapladigi icin mesajdan sonra bir sonraki etikete yalnizca ~2px
   kaliyordu; mesaj bir alt alanin etiketine yapisik goruniyordu.

   28px: mesaj ciktiginda altinda ~10px bosluk kalir - yapisik
   gorunmez, form da gereksiz uzamaz.
   ========================================================================== */
.partners-form .craniocatch-form-row {
    margin-bottom: 28px;
}

/* Son satirin altinda ekstra bosluk gerekmez: reCAPTCHA/buton bolumu
   kendi ust boslugunu getiriyor */
.partners-form .craniocatch-form-row:last-of-type {
    margin-bottom: 20px;
}

/* Country (tek satirlik select) ile Message (4 satirlik textarea) ayni
   satirda; grid varsayilan olarak ikisini de satirin yuksekligine
   esitliyordu, bu yuzden Country'nin hata mesaji textarea'nin altina,
   alanindan cok uzaga dusuyordu. Her alan kendi icerik yuksekliginde
   kalsin: mesaj her zaman kendi input'unun hemen altinda cikar. */
.partners-form .craniocatch-form-row {
    align-items: start;
}

/* intl-tel-input input'u .iti sarmalayicisina aliyor. Hata mesaji
   bu sarmalayicinin KARDESI ve DOM'da sonra geldigi icin esit
   z-index'te ustte kaliyordu - sarmalayici yukari, hata kutusu
   asagi aliniyor. (Acilan liste artik <body> altinda, bkz.
   .iti--container kurali.) */
.partners-form .iti {
    position: relative;
    /* Hata kutusundan (z-index:1) yuksek: liste kapaliyken de
       bayrak/ok dugmesi tiklanabilir kalsin. */
    z-index: 30;
}

/* Hata mesaji listenin ALTINDA kalsin */
.partners-form .craniocatch-form-error {
    z-index: 1;
}

/* Telefon ulke listesi <body> altinda aciliyor (partners-phone.js
   dropdownContainer): dar form kolonunda kirpilmiyor. Burada
   yalnizca olcu veriliyor, konumu kutuphane hesapliyor. */
.iti--container .iti__country-list {
    width: min(480px, 92vw);
    max-width: min(480px, 92vw);
    box-sizing: border-box;
    /* Yatay kaydirma cikmasin: uzun adlar sarar, yalnizca dikey kayar. */
    overflow-x: hidden;
    white-space: normal;
}

.iti--container .iti__country-name {
    overflow-wrap: anywhere;
}

/* Uzun ulke adlari satiri tasirmasin: nowrap kaldirilir, ad sarar.
   (Kutuphane ve demo-modal.css nowrap veriyor; yatay kaydirmanin
   asil sebebi buydu.) */
.iti--container .iti__country {
    flex-wrap: wrap;
    align-items: center;
}

.iti--container .iti__country-name {
    white-space: normal;
    overflow-wrap: anywhere;
    min-width: 0;
}


.iti--container {
    z-index: 10060;
}
