:root{
    --fixed-margin-size: 3rem;
    font-size: 1rem;
    /* PLEKSUS design tokens (PSD) */
    --plx-red: #B63232;            /* primary: nav pill, buttons */
    --plx-red-bright: #DF3027;     /* accent: contact headings */
    --plx-red-hover: #9E2929;
    --plx-navy: #373755;           /* headings */
    --plx-text: #4A5568;           /* body text */
    --plx-bg-soft: #EFF0F2;        /* nav pill bar */
    --plx-card-bg: #F5F5F8;        /* solution cards */
    --plx-line: #E3E4E8;           /* section divider lines */
    --plx-eyeq: #EE574D;
    --plx-medline: #117BB4;
    --plx-pharma: #B63232;
    --plx-genmaps: #6F7889;
    --project-btn-color-1: var(--plx-red);
    --project-btn-hover-color-1: var(--plx-red-hover);
    --project-btn-color-2: var(--plx-navy);
    --project-btn-hover-color-2: #2A2A42;
    --project-alert-bg-color: rgba(182, 50, 50, 0.85);
}
@font-face {
    font-family: 'BaiJamjuree-Bold';
    src: url('../fonts/BaiJamjuree-Bold.ttf');
    font-display: swap;
}
@font-face {
    font-family: 'BaiJamjuree-Medium';
    src: url('../fonts/BaiJamjuree-Medium.ttf');
    font-display: swap;
}
@font-face {
    font-family: 'BaiJamjuree-Light';
    src: url('../fonts/BaiJamjuree-Light.ttf');
    font-display: swap;
}
/* Oswald — PSD tasarımındaki başlık fontu (logo yanı "Bilişim Teknolojileri") */
@font-face {
    font-family: 'Oswald';
    src: url('../fonts/Oswald-VariableFont_wght.ttf') format('truetype');
    font-weight: 200 700;
    font-style: normal;
    font-display: swap;
}
.text-1-3{
    font-size:1.3rem;
}
.cursor-pointer{
    cursor: pointer;
}
body {
    font-family: 'IBM Plex Sans', 'Segoe UI', sans-serif;
    color: var(--plx-text);
    overflow-x: hidden;
}
p,a,h1,h2,h3,h4,h5,h6{
    margin: 0 !important;
}
b, strong, .fw-bold  {
    font-family: BaiJamjuree-Bold, sans-serif;
}
.fmt{
    margin-top: var(--fixed-margin-size) !important;
}
.fmb{
    margin-bottom: var(--fixed-margin-size) !important;
}
.fpt{
    padding-top: var(--fixed-margin-size) !important;
}
.fpb{
    padding-bottom: var(--fixed-margin-size) !important;
}
.f-bold, .fw-bold{
    font-family: BaiJamjuree-Bold, sans-serif !important;
}
.f-ligth, .fw-light{
    font-family: BaiJamjuree-Light, sans-serif !important;
}
.b-example-divider {
    width: 100%;
    height: 3rem;
    background-color: rgba(0, 0, 0, .1);
    border: solid rgba(0, 0, 0, .15);
    border-width: 1px 0;
    box-shadow: inset 0 .5em 1.5em rgba(0, 0, 0, .1), inset 0 .125em .5em rgba(0, 0, 0, .15);
}
.btn-custom-1 {
    --bs-btn-color: #fff;
    --bs-btn-bg: var(--project-btn-color-1);
    --bs-btn-border-color: var(--project-btn-color-1);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg:var(--project-btn-hover-color-1);
    --bs-btn-hover-border-color: var(--project-btn-hover-color-1);
    --bs-btn-focus-shadow-rgb: 77,43,138;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: var(--project-btn-color-1);
    --bs-btn-active-border-color: var(--project-btn-color-1);
    --bs-btn-active-shadow: inset 0 3px 5px rgba(77,43,138, 0.125);
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: var(--project-btn-color-1);
    --bs-btn-disabled-border-color: var(--project-btn-color-1);
}
.btn-outline-custom-1 {
    --bs-btn-color: var(--project-btn-color-1);
    --bs-btn-border-color: var(--project-btn-color-1);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: var(--project-btn-color-1);
    --bs-btn-hover-border-color: var(--project-btn-color-1);
    --bs-btn-focus-shadow-rgb: 13, 110, 253;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: var(--project-btn-color-1);
    --bs-btn-active-border-color: var(--project-btn-color-1);
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: var(--project-btn-color-1);
    --bs-btn-disabled-bg: transparent;
    --bs-btn-disabled-border-color: var(--project-btn-color-1);
    --bs-gradient: none;
}
.btn-custom-2 {
    --bs-btn-color: #fff;
    --bs-btn-bg: var(--project-btn-color-2);
    --bs-btn-border-color: var(--project-btn-color-2);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg:var(--project-btn-hover-color-2);
    --bs-btn-hover-border-color: var(--project-btn-hover-color-2);
    --bs-btn-focus-shadow-rgb: 77,43,138;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: var(--project-btn-color-2);
    --bs-btn-active-border-color: var(--project-btn-color-2);
    --bs-btn-active-shadow: inset 0 3px 5px rgba(77,43,138, 0.125);
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: var(--project-btn-color-2);
    --bs-btn-disabled-border-color: var(--project-btn-color-2);
}
.btn-outline-custom-2 {
    --bs-btn-color: var(--project-btn-color-2);
    --bs-btn-border-color: var(--project-btn-color-2);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: var(--project-btn-color-2);
    --bs-btn-hover-border-color: var(--project-btn-color-2);
    --bs-btn-focus-shadow-rgb: 13, 110, 253;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: var(--project-btn-color-2);
    --bs-btn-active-border-color: var(--project-btn-color-2);
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: var(--project-btn-color-2);
    --bs-btn-disabled-bg: transparent;
    --bs-btn-disabled-border-color: var(--project-btn-color-2);
    --bs-gradient: none;
}
.custom-alert-1 {
    --bs-alert-color: white;
    --bs-alert-bg: var(--project-alert-bg-color);
    --bs-alert-border-color: var(--project-alert-bg-color);
    --bs-alert-link-color: white;
    font-family: BaiJamjuree-Bold, sans-serif;
}

.short-text{
    white-space: nowrap;
    width: 100%;                   /* IE6 needs any width */
    overflow: hidden;              /* "overflow" value must be different from  visible"*/
    -o-text-overflow: ellipsis;    /* Opera < 11*/
    text-overflow:    ellipsis;    /* IE, Safari (WebKit), Opera >= 11, FF > 6 */
}
form label.required:after {
    content: "*";
    font-size: 1em;
    margin: 0.3em;
    position: relative;
    top: -2px;
    color: red;
}
.img-cover{
    width: 100% !important;
    height: 150px !important;
    object-fit: cover !important;
}
.text-line-2 {
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2; /* number of lines to show */
    line-clamp: 2;
    -webkit-box-orient: vertical;
}
.text-line-3 {
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 3; /* number of lines to show */
    line-clamp: 3;
    -webkit-box-orient: vertical;
}
.color-unset{
    color:unset;
}
.navbar-box .nav .nav-item:not(:last-child) {
    border-right: 1px solid black;
}
.navbar-box .nav li.nav-item{
    line-height: 1px!important;
}
.navbar-box .nav ul.dropdown-menu{
    line-height: var(--bs-body-line-height);
}

.navbar-box .nav .nav-item:last-child {
    padding-right: 0 !important;
}

/* ============ desktop view ============ */
@media all and (min-width: 992px) {

    .dropdown-menu li{
        position: relative;
    }
    .dropdown-menu .submenu{
        display: none;
        position: absolute;
        left:100%;
        top:-7px;
    }
    .dropdown-menu .submenu-left{
        right:100%;
        left:auto;
    }
    .dropdown-menu .submenu-right{
        right:100% !important;
        left: unset;
    }

    .dropdown-menu > li:hover{ background-color: #f1f1f1 }
    .dropdown-menu > li:hover > .submenu{
        display: block;
    }
}
/* ============ desktop view .end// ============ */

/* ============ small devices ============ */
@media (max-width: 991px) {

    .dropdown-menu .dropdown-menu{
        margin-left:0.7rem;
        margin-right:0.7rem;
        margin-bottom: .5rem;
    }

}
/* ============ small devices .end// ============ */

/*Extra small devices (portrait phones, less than 576px)*/
@media (max-width: 575.98px) {

}

/*Small devices (landscape phones, 576px and up)*/
@media (min-width: 576px) and (max-width: 767.98px) {

}

/*Medium devices (tablets, 768px and up)*/
@media (min-width: 768px) and (max-width: 991.98px) {

}

/*Large devices (desktops, 992px and up)*/
@media (min-width: 992px) and (max-width: 1199.98px) {

}

/*Extra large devices (large desktops, 1200px and up)*/
@media (min-width: 1200px) {

}
/* ==========================================================================
   PLEKSUS Bilişim Teknolojileri — theme (built from PSD designs)
   ========================================================================== */

h1,h2,h3,h4,h5,h6{ color: var(--plx-navy); }

/* ---------- Header ---------- */
.plx-header{
    background:#fff;
    padding: 0.85rem 0;
    position: relative;
    z-index: 100;
}
/* Header tam genişlik: logo sola, menü sağa yaslı (büyük ekranda kapla, ortalı dar kapta sıkışmasın) */
.plx-header > .container{
    max-width:100%;
    padding-left:clamp(1rem, 2.5vw, 2.5rem);
    padding-right:clamp(1rem, 2.5vw, 2.5rem);
}
.plx-logo{ display:flex; align-items:center; text-decoration:none; gap:1rem; }
.plx-logo img{ height:44px; width:auto; max-width:100%; }
/* İngilizce kilit görsel TR'den ~%10 geniş (753x55 / 682x55); dar aralıklarda biraz küçült. */
@media (min-width:1200px) and (max-width:1399.98px){
    html[lang="en"] .plx-header .plx-logo img{ height:33px; }
}
@media (min-width:992px) and (max-width:1199.98px){
    html[lang="en"] .plx-header .plx-logo img{ height:24px; }
}
.plx-logo .plx-logo-sep{ width:2px; height:44px; background:#3A3A3A; }
.plx-logo .plx-logo-tagline{ display:flex; flex-direction:column; justify-content:center; }
.plx-logo .plx-logo-tagline b{
    font-family: 'Oswald', sans-serif; font-weight:400;
    color:#2C2525; font-size:1.64rem; line-height:1.1; letter-spacing:.15em; white-space:nowrap;
}
.plx-logo .plx-logo-tagline span{
    font-family: 'Oswald', sans-serif; font-weight:400;
    color:#2C2525; font-size:.8rem; letter-spacing:.284em; white-space:nowrap;
}
/* Slogandaki ayraç noktaları kurumsal kırmızı (orijinal logo dosyasındaki gibi) */
.plx-logo .plx-logo-dot{ color:var(--plx-red); font-style:normal; }
/* İngilizce alt başlık ("The Technology and Solution Network of the Future") TR'den çok daha uzun;
   ≥1400 tam boyutta kaba sığmıyordu — yalnız EN'de ve yalnız bu aralıkta hafif küçült. */
@media (min-width: 1400px){
    html[lang="en"] .plx-logo .plx-logo-tagline span{ font-size:.72rem; letter-spacing:.16em; }
}
.plx-logo--footer{ justify-content:center; }

/* ---------- Nav pill ---------- */
.plx-nav{
    display:flex; align-items:center;
    background:var(--plx-bg-soft);
    border-radius:50rem;
    padding:.35rem .5rem;
    gap:.25rem;
    box-shadow: inset 0 1px 2px rgba(55,55,85,.06);
}
.plx-nav a{
    display:inline-block;
    color:var(--plx-navy);
    text-decoration:none;
    font-weight:500;
    font-size:.95rem;
    padding:.35rem 1rem;
    border-radius:50rem;
    white-space:nowrap;
    transition: background .2s, color .2s;
}
.plx-nav a:hover{ background:rgba(182,50,50,.12); }
.plx-nav a.active{ background:var(--plx-red); color:#fff; }
/* Sayfası olmayan üst başlık (yalnızca açılır menü başlığı) — linklerle aynı görünür, tıklanınca bir yere gitmez */
.plx-nav .plx-nav-parent{
    display:inline-block; color:var(--plx-navy); font-weight:500; font-size:.95rem;
    padding:.35rem 1rem; border-radius:50rem; white-space:nowrap; cursor:default;
    transition:background .2s, color .2s; user-select:none;
}
.plx-nav .plx-nav-parent:hover{ background:rgba(182,50,50,.12); }
/* Alt sayfalarından biri açıkken üst başlık da vurgulansın */
.plx-nav .plx-nav-parent.active{ background:var(--plx-red); color:#fff; }
.plx-nav .plx-nav-parent.active .plx-plus{ color:#fff; }
.plx-nav .dropdown-toggle::after{ display:none; }
.plx-nav .plx-plus{ color:var(--plx-red-bright); font-weight:700; margin-left:.2rem; }
.plx-nav a.active .plx-plus{ color:#fff; }
.plx-nav .dropdown-menu{
    border:none; border-radius:1rem;
    box-shadow:0 .75rem 2rem rgba(55,55,85,.18);
    padding:.5rem;
    margin-top:.5rem !important;
}
.plx-nav .dropdown-menu a{
    display:block; border-radius:.6rem; padding:.5rem .9rem; font-size:.9rem;
}
.plx-nav .dropdown-menu a:hover{ background:var(--plx-bg-soft); }
/* Masaüstü: "Çözümler" tıklayınca sayfayı AÇAR, üzerine gelince alt menü görünür */
@media (min-width: 992px){
    .plx-nav .plx-has-dropdown{ position:relative; }
    .plx-nav .plx-has-dropdown > .dropdown-menu{
        position:absolute; top:100%; left:0; display:none;
        margin-top:0 !important; padding-top:.7rem; /* boşluğu köprüle: hover kopmasın */
    }
    .plx-nav .plx-has-dropdown:hover > .dropdown-menu{ display:block; }
    /* Logo(başlık) ile menü arasında garanti nefes payı (özellikle uzun EN alt başlığı) */
    .plx-header .plx-logo{ margin-right: clamp(1.5rem, 3vw, 3rem); }
}

/* ---------- Dil değiştirici (TR | EN) ---------- */
.plx-header-right{ gap:1.25rem; }
.plx-lang{ display:flex; align-items:center; gap:.4rem; font-weight:600; font-size:.9rem; white-space:nowrap; }
.plx-lang a{ color:var(--plx-navy); text-decoration:none; padding:.15rem .3rem; border-radius:.4rem; transition:color .2s; }
.plx-lang a:hover{ color:var(--plx-red); }
.plx-lang a.active{ color:var(--plx-red); }
.plx-lang-sep{ color:#c9ccd4; }
.plx-lang--mobile{ margin-bottom:1rem; padding:.4rem 1.1rem; font-size:1.05rem; gap:.6rem; }
.plx-lang--mobile a{ padding:.2rem .5rem; }
@media (max-width: 991.98px){ .plx-lang--desktop{ display:none; } }

/* mobile toggler */
.plx-toggler{
    border:none; background:var(--plx-bg-soft); border-radius:50rem;
    width:44px; height:44px; display:none; align-items:center; justify-content:center;
    color:var(--plx-navy); font-size:1.4rem;
}

/* ---------- Hero (slider) ---------- */
.plx-hero{ position:relative; }
.plx-hero .carousel-item{
    height: clamp(420px, 49.9vw, 958px);
    background-size:cover; background-position:center;
}
/* PSD tasarımı: metin beyaz kart içinde DEĞİL, görselin alt (yansımalı açık) bandının üzerinde durur */
.plx-hero-caption{
    position:absolute; left:0; right:0;
    bottom:clamp(2.5rem, 7vw, 6.5rem);
    z-index:5;
}
.plx-hero-band{
    background:transparent; border-radius:0; box-shadow:none; padding:0;
    /* PSD: metin bloğu ortalı, ~1250px genişlikte (görselin kenarlarına yayılmaz) */
    max-width:1250px; margin:0 auto;
}
.plx-hero-band .plx-hero-title{
    font-weight:700; color:var(--plx-navy);
    font-size:clamp(1.2rem, 1.8vw, 2.15rem);
    line-height:1.35;
}
.plx-hero-band .plx-hero-text{
    color:var(--plx-text); font-size:clamp(.9rem, 1.12vw, 1.32rem); line-height:1.55;
    max-width:640px; /* PSD'deki dar açıklama sütunu (4 satıra sarar) */
}
/* PSD sütun oranları: başlık %45 (sağa yaslı), açıklama %55 */
@media (min-width: 768px){
    .plx-hero-band .col-md-5{ flex:0 0 45%; max-width:45%; }
    .plx-hero-band .col-md-7{ flex:0 0 55%; max-width:55%; }
}
/* PSD tasarımı: gösterge, görselin altında tam genişlik LACİVERT bir bant; noktalar açık renk */
/* PSD: gösterge bandı tam genişlik DEĞİL — kap genişliğinde, ortalı; görselin ALTINDAN
   aşağı sarkan, ALT köşeleri yuvarlak bir sekme gibi durur. */
.plx-hero .carousel-indicators{
    position:absolute; top:100%; left:50%; transform:translateX(-50%); z-index:6;
    display:flex; align-items:center; justify-content:center;
    margin:0; padding:0; min-height:2.9rem;
    width:calc(100% - 1.5rem);
    background:var(--plx-navy);
    border-radius:0 0 1.2rem 1.2rem;
}
@media (min-width:576px){ .plx-hero .carousel-indicators{ max-width:540px; } }
@media (min-width:768px){ .plx-hero .carousel-indicators{ max-width:720px; } }
@media (min-width:992px){ .plx-hero .carousel-indicators{ max-width:960px; } }
@media (min-width:1200px){ .plx-hero .carousel-indicators{ max-width:1140px; } }
@media (min-width:1400px){ .plx-hero .carousel-indicators{ max-width:1320px; } }
.plx-hero .carousel-indicators [data-bs-target]{
    width:12px; height:12px; border-radius:50%; border:none; margin:0 6px;
    background:rgba(255,255,255,.45); opacity:1; transition:background .2s;
}
.plx-hero .carousel-indicators .active{ background:#fff; }

/* ---------- Section base ---------- */
.plx-section{ padding:4.5rem 0; }
.plx-section-title{
    font-weight:700; color:var(--plx-navy);
    font-size:clamp(1.6rem, 2.2vw, 2.1rem);
}
.plx-section-lead{
    color:var(--plx-text); line-height:1.65; font-size:1.02rem;
}
.plx-bg-texture{ background:url('../img/bg-texture.jpg') center top / cover no-repeat; border-bottom:5px solid var(--plx-line); }
.plx-bg-baglanti{ background:url('../img/bg-baglanti.jpg') center top / cover no-repeat; border-bottom:5px solid var(--plx-line); }
.plx-bg-iletisim{ background:url('../img/bg-iletisim.jpg') center top / cover no-repeat; }

/* ---------- Page banner ---------- */
.plx-banner{
    background-position:center; background-size:cover;
    border-top:5px solid var(--plx-line);
    border-bottom:5px solid var(--plx-line);
}
.plx-banner .container{ min-height:clamp(180px, 19.6vw, 377px); display:flex; align-items:center; }
.plx-banner h1{
    font-weight:700; color:var(--plx-navy);
    font-size:clamp(1.7rem, 2.5vw, 2.5rem);
}
/* CMS sayfa / çözüm detay banner + içerik */
.plx-banner--page{ background:url('../img/bg-texture.jpg') center / cover no-repeat; }
.plx-banner--page .container{ min-height:clamp(140px, 15vw, 260px); }
/* Sayfaya özel yazısız banner görseli: 1920x381 (≈5.04:1). Bölüm oranı görselle aynı tutulur
   ki cover ile kırpılmadan tam görünür; başlık ikonun sağındaki boş banda (%8) hizalanır. */
.plx-banner--img{
    position:relative;
    background-size:cover; background-position:center; background-repeat:no-repeat;
    border-top:none; border-bottom:none;
}
.plx-banner--img .container{
    max-width:100%; padding-left:16.5%; padding-right:6%;
    min-height:clamp(96px, 19.84vw, 381px);
}
.plx-banner--img h1{ text-shadow:0 1px 2px rgba(255,255,255,.6); min-width:0; width:100%; }
/* Mobil: geniş banner kısalır, ikon zaten kırpılır; başlığı sola çek, sar ve yüksekliği artır */
@media (max-width:575.98px){
    /* Mobilde geniş banner az kırpıldığında arka plandaki ikon başlığın altına giriyordu;
       başlığın olduğu sol tarafa görselin açık zeminiyle uyumlu yumuşak bir örtü koy. */
    .plx-banner--img::before{
        content:''; position:absolute; inset:0; z-index:0; pointer-events:none;
        background:linear-gradient(90deg, rgba(238,240,243,.96) 0%, rgba(238,240,243,.9) 42%, rgba(238,240,243,.35) 66%, rgba(238,240,243,0) 82%);
    }
    .plx-banner--img .container{ position:relative; z-index:1; padding-left:6%; padding-right:6%; min-height:118px; }
    .plx-banner--img h1{ font-size:1.3rem; line-height:1.2; }
}
.plx-page-content{ max-width:1140px; margin:0 auto; color:var(--plx-text); font-size:1.02rem; }
.plx-page-content p{ line-height:1.75; margin-bottom:1.1rem !important; }
.plx-page-content h2, .plx-page-content h3, .plx-page-content h4{ color:var(--plx-navy); font-weight:700; margin:1.6rem 0 .8rem !important; }
.plx-page-content ul, .plx-page-content ol{ line-height:1.75; margin-bottom:1.1rem; padding-left:1.4rem; }
.plx-page-content li{ margin-bottom:.4rem; }
.plx-page-content a{ color:var(--plx-red); }
.plx-page-content a:hover{ color:var(--plx-red-hover); }
.plx-page-content img{ max-width:100%; height:auto; border-radius:.8rem; }
.plx-page-content .breadcrumb{ font-size:.85rem; }

/* ---------- e-Cursus e-Öğrenme modülleri (e-ogrenme-cozumleri sayfası) ---------- */
.plx-ecursus{ margin-top:2.4rem; }
.plx-ecursus .plx-ecursus-heading{
    color:var(--plx-navy); font-weight:700; font-size:1.5rem;
    padding-bottom:.6rem; border-bottom:3px solid var(--plx-red); margin:0 0 1.1rem !important;
}
.plx-ecursus-toc{
    list-style:none !important; padding:0 !important;
    display:grid; grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); gap:.4rem .9rem;
    margin:1.2rem 0 2.4rem !important;
}
.plx-ecursus-toc li{ margin:0 !important; }
.plx-ecursus-toc a{
    display:block; padding:.5rem .8rem; border-radius:.55rem;
    background:var(--plx-card-bg); color:var(--plx-navy) !important; font-weight:500;
    text-decoration:none; transition:background .2s, color .2s;
}
.plx-ecursus-toc a:hover{ background:var(--plx-red); color:#fff !important; }

.plx-ecursus-mod{
    background:#fff; border:1px solid var(--plx-line); border-radius:1rem;
    box-shadow:0 .4rem 1.4rem rgba(55,55,85,.07);
    padding:1.4rem 1.5rem; margin-bottom:1.4rem; scroll-margin-top:110px;
}
.plx-ecursus-title{
    color:var(--plx-red) !important; font-weight:700 !important; font-size:1.22rem !important;
    margin:0 0 1rem !important;
}
.plx-ecursus-body{ display:flex; gap:2rem; align-items:flex-start; }
.plx-ecursus-media{ flex:0 0 380px; max-width:380px; }
.plx-ecursus-media img{ width:100%; border-radius:.6rem; border:1px solid var(--plx-line); }
.plx-ecursus-info{ flex:1 1 auto; min-width:0; }
.plx-ecursus-label{
    color:var(--plx-navy); font-weight:700; text-transform:uppercase;
    font-size:.8rem; letter-spacing:.04em; margin:0 0 .4rem !important;
}
.plx-ecursus-label:not(:first-child){ margin-top:1rem !important; }
.plx-ecursus-info ul{ margin:0 0 .3rem !important; padding-left:1.2rem; }
.plx-ecursus-feats{
    list-style:none !important; padding:0 !important;
    display:grid; grid-template-columns:repeat(auto-fill,minmax(170px,1fr)); gap:.15rem .8rem;
}
.plx-ecursus-feats li{ position:relative; padding-left:1.2rem; margin:0 !important; }
.plx-ecursus-feats li::before{ content:"✓"; position:absolute; left:0; color:var(--plx-red); font-weight:700; }
@media (max-width:575.98px){
    .plx-ecursus-body{ flex-direction:column; }
    .plx-ecursus-media{ flex-basis:auto; max-width:100%; align-self:center; }
}

/* ---------- Neden Pleksus (stats) ---------- */
.plx-stats .plx-stats-heading{
    font-weight:700; color:var(--plx-navy);
    font-size:clamp(1.8rem, 2.6vw, 2.6rem); line-height:1.15;
}
.plx-stat .plx-stat-label{
    font-weight:700; color:var(--plx-navy);
    font-size:1.02rem; letter-spacing:.02em; text-transform:uppercase;
    margin-bottom:.85rem !important;
}
.plx-stat .plx-stat-row{ display:flex; gap:1rem; align-items:flex-start; }
.plx-stat .plx-stat-number{
    font-weight:700; color:var(--plx-navy);
    font-size:clamp(2.6rem, 3.4vw, 3.4rem); line-height:.95;
    /* Rakam sütunu sabit genişlikte: "+25 / +5 / SaaS / AI" farklı genişlikte olduğu için
       açıklamalar aksi halde her satırda farklı noktadan başlıyordu. Birim em olduğundan
       yazı boyutu büyüdükçe (clamp) sütun da birlikte ölçeklenir. En geniş değer "SaaS" ≈ 2.4em. */
    flex:0 0 auto; min-width:2.6em;
}
.plx-stat .plx-stat-desc{ color:var(--plx-text); font-size:.95rem; line-height:1.45; max-width:17rem; }

/* ---------- Çözümler cards ---------- */
.plx-cozum-grid{
    display:flex; gap:.9rem; align-items:flex-start; justify-content:center; flex-wrap:wrap;
}
.plx-cozum-card{
    background:var(--plx-card-bg);
    border-radius:1.15rem;
    box-shadow:0 .35rem 1.1rem rgba(55,55,85,.10);
    padding:1.6rem 1rem 1.4rem;
    text-align:center;
    flex:1 1 0;
    min-width:200px;
    max-width:290px;
    text-decoration:none;
    display:block;
    transition:transform .2s, box-shadow .2s;
}
.plx-cozum-card:hover{ transform:translateY(-6px); box-shadow:0 .8rem 1.8rem rgba(55,55,85,.16); }
.plx-cozum-card h3{
    color:var(--plx-navy); font-weight:700; font-size:1.02rem; line-height:1.3;
    margin-bottom:1rem !important;
    min-height:3.9em;                 /* 3 satır yer ayrılır → uzun başlık ikonu kaydırmaz, hepsi hizalı */
    display:flex; flex-direction:column; justify-content:center;
}
.plx-cozum-card h3 small{
    display:block; font-weight:700; color:inherit; font-size:1em; /* başlığın devamı: 1. satırla aynı boyut ve renk */
}
.plx-cozum-card img{ width:150px; height:auto; max-width:88%; transition:width .35s ease; }

/* --- Etkileşimli mod: tıkla-genişlet (aynı anda biri açık) --- */
.plx-cozum-interactive{ flex-wrap:nowrap; align-items:flex-start; }
.plx-cozum-interactive .plx-cozum-card{
    position:relative;
    cursor:pointer;
    max-width:none;
    flex:1 1 0;
    transition:flex-grow .35s ease, transform .2s, box-shadow .2s, background .25s;
}
.plx-cozum-interactive .plx-cozum-card:focus-visible{ outline:3px solid rgba(182,50,50,.4); outline-offset:3px; }
.plx-cozum-interactive .plx-cozum-card.expanded{
    flex-grow:2.4;
    cursor:default;
    background:#fff;
    padding:2rem 2rem 2.4rem;
    box-shadow:0 .8rem 2rem rgba(55,55,85,.16);
}
.plx-cozum-interactive .plx-cozum-card.expanded:hover{ transform:none; }
.plx-cozum-interactive .plx-cozum-card.expanded img{ width:176px; }
.plx-cozum-body{
    display:grid;
    grid-template-rows:0fr;
    transition:grid-template-rows .35s ease, opacity .3s ease;
    opacity:0;
}
.plx-cozum-card.expanded .plx-cozum-body{ grid-template-rows:1fr; opacity:1; }
.plx-cozum-body-inner{ overflow:hidden; }
.plx-cozum-desc{
    color:var(--plx-text); font-size:.93rem; line-height:1.55; margin-top:1.15rem !important;
}
.plx-cozum-more{
    display:inline-block; margin-top:1rem !important;
    color:var(--plx-red); font-weight:600; font-size:.9rem; text-decoration:none;
}
.plx-cozum-more:hover{ color:var(--plx-red-hover); }
.plx-cozum-more i{ transition:transform .2s; }
.plx-cozum-more:hover i{ transform:translateX(3px); }
.plx-cozum-arrow{
    position:absolute; right:-10px; bottom:-16px;
    color:var(--plx-navy); font-size:2rem; transform:rotate(-15deg);
    opacity:0; transition:opacity .3s ease;
}
.plx-cozum-card.expanded .plx-cozum-arrow{ opacity:1; }

@media (max-width: 991.98px){
    .plx-cozum-interactive{ flex-wrap:wrap; }
    .plx-cozum-interactive .plx-cozum-card{ flex:1 1 260px; max-width:400px; }
    .plx-cozum-interactive .plx-cozum-card.expanded{ flex-grow:1; }
    .plx-cozum-arrow{ display:none; }
}

/* ---------- Bağlantılar brand cards ---------- */
.plx-brand-grid{
    display:flex; gap:1.5rem; justify-content:center; align-items:flex-start; flex-wrap:wrap;
}
.plx-brand-card{
    border-radius:1.6rem;
    width:100%; max-width:296px;
    padding:1.9rem 1.55rem 1.55rem;
    color:#fff; text-align:center;
    box-shadow:0 .6rem 1.6rem rgba(55,55,85,.22);
    display:block; text-decoration:none;
    transition:transform .2s, box-shadow .2s;
}
.plx-brand-card:hover{ transform:translateY(-6px); box-shadow:0 1rem 2.2rem rgba(55,55,85,.3); color:#fff; }
.plx-brand-card.offset{ margin-top:6.5rem !important; }
.plx-brand-card .plx-brand-logo{ min-height:70px; display:flex; align-items:center; justify-content:center; margin-bottom:1.2rem; }
.plx-brand-card .plx-brand-logo img{ max-width:100%; height:auto; }
/* Yalnızca TürkMedline: PSD'de logo saf beyaz, ama kaynak PNG renkli (turuncu çubuk + koyu "Med").
   Beyaza indiriyoruz. Diğer logolar (EYEQ beyaz, Pharma beyaz, GENMAPS çok-tonlu) tasarıma
   uygun olduğundan dokunmuyoruz. */
.plx-brand-card--medline .plx-brand-logo img{ filter: brightness(0) invert(1); }
.plx-brand-card .plx-brand-box{
    background:#fff; border-radius:1.1rem;
    color:var(--plx-text);
    padding:1.5rem 1.15rem; font-size:.92rem; line-height:1.5;
    min-height:180px; display:flex; align-items:center; justify-content:center;
}
.plx-brand-card .plx-brand-url{
    display:block; color:#fff; font-weight:600; font-size:1.02rem; margin-top:1.3rem !important;
}
.plx-brand-card--eyeq{ background:var(--plx-eyeq); }
.plx-brand-card--medline{ background:var(--plx-medline); }
.plx-brand-card--pharma{ background:var(--plx-pharma); }
.plx-brand-card--genmaps{ background:var(--plx-genmaps); }
/* Ana sayfa: 5'li marka dizilimi (ADR, LİTarama, SmartScan, GENMAPS, Trials) — daha dar kartlar */
.plx-brand-grid--five{ gap:1.25rem; }
.plx-brand-grid--five .plx-brand-card{ max-width:230px; padding:1.5rem 1.05rem 1.2rem; border-radius:1.4rem; }
.plx-brand-grid--five .plx-brand-card.offset{ margin-top:4.5rem !important; }
.plx-brand-grid--five .plx-brand-logo{ min-height:64px; margin-bottom:1rem; }
.plx-brand-grid--five .plx-brand-logo img{ max-height:72px; width:auto; }
.plx-brand-grid--five .plx-brand-box{ min-height:190px; font-size:.8rem; line-height:1.5; padding:1.05rem .85rem; }
.plx-brand-grid--five .plx-brand-url{ font-size:.7rem; margin-top:1.05rem !important; word-break:break-word; }

/* ---------- Bağlantılarımız — PLEKSUS ekosistem ağı ----------
   Masaüstü: PSD (indexAlt-Baglantilarimiz-05) BİREBİR kopya.
   Kart alanı çerçevesi PSD'de (97,821)-(1817,1918) = 1720x1097; tüm konumlar bu
   çerçevenin yüzdesi olarak alındı. Ağ görseli de PSD katmanlarından çıkarıldı —
   kartlar tasarımdaki koordinatlarda olduğundan çizgiler tam kart/hub kenarına oturur. */
.plx-eco{ position:relative; max-width:1200px; margin:clamp(3rem, 6vw, 5.5rem) auto 0; transition:margin-bottom .4s ease; }
/* alt sıradaki kart açıkken: açılır panel çerçevenin altına taştığından bölüme nefes payı ver */
.plx-eco.plx-eco--open-bottom{ margin-bottom:15rem; }
.plx-eco-card{
    position:relative;
    background:var(--eco); border-radius:1.1rem;
    padding:1rem 1.1rem;
    display:flex; flex-direction:column; align-items:center; justify-content:center;
    cursor:pointer; text-align:center;
    box-shadow:0 .5rem 1.4rem rgba(55,55,85,.12);
    transition:transform .2s, box-shadow .2s, border-radius .2s;
}
.plx-eco-card:hover{ transform:translateY(-4px); box-shadow:0 .9rem 2rem rgba(55,55,85,.2); }
.plx-eco-card:focus-visible{ outline:3px solid rgba(182,50,50,.45); outline-offset:3px; }
/* açık kartın alt köşeleri düz — açılır panelle tek parça kart görünümü */
.plx-eco-card.expanded{ border-bottom-left-radius:0; border-bottom-right-radius:0; z-index:6; }
.plx-eco-logo{ width:100%; display:flex; justify-content:center; }
.plx-eco-logo img{ max-width:100%; height:auto; }
/* açıklama: MUTLAK açılır panel — yerleşimi bozmaz (kartlar/çizgiler zıplamaz) */
.plx-eco-body{
    position:absolute; top:100%; left:0; right:0; z-index:6;
    overflow:hidden; max-height:0;
    background:var(--eco); border-radius:0 0 1.1rem 1.1rem;
    padding:0 1.3rem; box-shadow:0 .7rem 1.4rem rgba(55,55,85,.16);
    transition:max-height .4s ease, padding .4s ease;
}
.plx-eco-card.expanded .plx-eco-body{ max-height:400px; padding-bottom:1.3rem; }
.plx-eco-body-inner{ min-height:0; }
.plx-eco-desc{
    background:#fff; border-radius:.8rem; padding:.75rem .85rem;
    color:var(--plx-text); font-size:.8rem; line-height:1.45;
    margin:0 0 .2rem !important;
}
.plx-eco-url{
    margin-top:.7rem; font-size:.8rem; font-weight:600; letter-spacing:.01em;
    color:#fff; text-decoration:none; word-break:break-word;
}
.plx-eco-url:hover{ text-decoration:underline; color:#fff; }
.plx-eco-card.is-light .plx-eco-url{ color:var(--plx-navy); }
.plx-eco-card.is-light .plx-eco-url:hover{ color:var(--plx-navy); }
.plx-eco-hub{ display:flex; align-items:center; justify-content:center; }
.plx-eco-hub img{
    border-radius:1.1rem;
    box-shadow:0 .6rem 1.8rem rgba(55,55,85,.14);
}

/* — Masaüstü: PSD koordinatlarıyla mutlak yerleşim — */
@media (min-width: 992px){
    .plx-eco{ aspect-ratio:1720/1097; }
    /* ağ görseli: PSD'deki tam kapsamı (dış hatlar dahil), çerçeveye göre ofsetli */
    .plx-eco::before{
        content:""; position:absolute; z-index:0; pointer-events:none;
        left:-3.2%; top:-6.47%; width:93.26%; height:100.46%;
        background:url('../img/eco/eco-lines.png') 0 0 / 100% 100% no-repeat;
    }
    .plx-eco-card, .plx-eco-hub{ position:absolute; z-index:1; margin:0; }
    .plx-eco-card{ width:20.35%; height:19.96%; }
    .plx-eco-card .plx-eco-logo img{ max-height:76px; }
    /* PSD sütunları: 0 / 26.45 / 52.85 / 79.71 — satırlar: 0 / 39.93 / 80.04 */
    .plx-eco-k-adr{        left:0;      top:0; }
    .plx-eco-k-smartscan{  left:26.45%; top:0; }
    .plx-eco-k-litarama{   left:52.85%; top:0; }
    .plx-eco-k-genmaps{    left:79.71%; top:0; }
    .plx-eco-k-pleksusfv{  left:0;      top:39.93%; }
    .plx-eco-k-kanalkbb{   left:79.71%; top:39.93%; }
    .plx-eco-k-trials{     left:0;      top:80.04%; }
    .plx-eco-k-turkmedline{left:26.45%; top:80.04%; }
    .plx-eco-k-fen{        left:52.85%; top:80.04%; }
    .plx-eco-k-eyeq{       left:79.71%; top:80.04%; }
    /* hub PSD'de orta satırdan daha uzun: üstteki/alttaki ara çizgilere kadar iner */
    .plx-eco-hub{ left:26.51%; top:30.17%; width:47.03%; height:39.47%; }
    .plx-eco-hub img{ width:100%; height:100%; object-fit:fill; }
    /* açılır panel satır arası boşluğa sığsın (boşluk = kart yüksekliği): alttaki karta binmesin.
       Uzun açıklama panelin içinde kayar. Kapalı durum da % olmalı ki animasyon çalışsın. */
    .plx-eco-body{ max-height:0%; }
    .plx-eco-card.expanded .plx-eco-body{ max-height:94%; overflow-y:auto; scrollbar-width:none; -ms-overflow-style:none; }
    .plx-eco-card.expanded .plx-eco-body::-webkit-scrollbar{ display:none; } /* kaydırma çalışır ama çubuk görünmez */
}

/* — Mobil/tablet: kartlar alt alta; ağ gizli — */
@media (max-width: 991.98px){
    .plx-eco{ display:grid; grid-template-columns:repeat(2,1fr); column-gap:1.1rem; row-gap:1.1rem; margin-top:1.5rem; align-items:stretch; }
    .plx-eco-hub{ grid-column:span 2; order:-1; margin-bottom:.4rem; }
    .plx-eco-hub img{ max-width:100%; height:auto; }
    /* tüm kartlar aynı boyut: eşit yükseklik + ortalanmış, tek tip logo */
    .plx-eco-card{ align-self:stretch; min-height:170px; }
    .plx-eco-card .plx-eco-logo img{ max-height:58px; }
    .plx-eco-card .plx-eco-url{ font-size:.74rem; }
    /* mobilde ağ gizli olduğundan açıklama akış içinde açılabilir (reflow sorun değil) */
    .plx-eco-body{ position:static; background:transparent; box-shadow:none; padding:0; }
    .plx-eco-card.expanded{ border-radius:1.1rem; z-index:1; }
    .plx-eco-card.expanded .plx-eco-body{ padding-bottom:0; }
    .plx-eco-desc{ margin-top:.8rem !important; }
}
@media (max-width: 479.98px){
    .plx-eco{ grid-template-columns:1fr; }
    .plx-eco-hub{ grid-column:span 1; }
}
/* Marka renkleri sınıf olarak (satır içi style yerine — CSP style-src 'unsafe-inline' kaldırıldı) */
.plx-eco-k-adr{ --eco:#1E3042; }
.plx-eco-k-smartscan{ --eco:#4A47D9; }
.plx-eco-k-litarama{ --eco:#809349; }
.plx-eco-k-genmaps{ --eco:#6F7889; }
.plx-eco-k-pleksusfv{ --eco:#A6C1C8; }
.plx-eco-k-kanalkbb{ --eco:#7AAFC9; }
.plx-eco-k-trials{ --eco:#01285F; }
.plx-eco-k-turkmedline{ --eco:#117BB4; }
.plx-eco-k-fen{ --eco:#CFCFCF; }
.plx-eco-k-eyeq{ --eco:#EE574D; }
/* Ana sayfa 5'li marka kartı renkleri */
.plx-brand-card--h-adr{ background:#1E3042; }
.plx-brand-card--h-litarama{ background:#809349; }
.plx-brand-card--h-smartscan{ background:#4A47D9; }
.plx-brand-card--h-genmaps{ background:#6F7889; }
.plx-brand-card--h-trials{ background:#01285F; }
/* Sayfa banner arka planları (sabit görsel) */
.plx-banner--hakkimizda{ background-image:url('../img/banner-hakkimizda.jpg'); }
.plx-banner--iletisim{ background-image:url('../img/banner-iletisim.jpg'); }
.plx-banner--cozumler{ background-image:url('../img/banner-cozumler.jpg'); }
.plx-banner--baglantilar{ background-image:url('../img/banner-baglantilar.jpg'); }
/* Yardımcı sınıflar (satır içi style yerine) */
.plx-lead-narrow{ max-width:64rem; }
.text-justify{ text-align:justify; } /* Bootstrap 5'te kaldırıldı — içerik hizası için geri eklendi */
.plx-breadcrumb{ --bs-breadcrumb-divider:'>'; } /* Ekmek kırıntısı ayıracı (satır içi style yerine) */
.plx-hide{ display:none; } /* koşullu form alanı başlangıç gizli (jQuery show/hide CSSOM ile üzerine yazar) */
.plx-thumb-40{ width:40px; } /* form küçük görsel önizleme */
/* ==========================================================================
   Referanslarımız — logo duvarı (ana sayfa bölümü + Referanslarımız sayfası)
   ========================================================================== */
.plx-banner--referanslar{ background-image:url('../img/banner-referanslar.jpg'); }
/* Ana sayfa bölümünün zemini (PSD: açık gri dokulu) */
.plx-bg-referanslar{ background:#EDEEF0; }

.plx-ref-grid{
    display:grid;
    grid-template-columns:repeat(4, minmax(0, 1fr));   /* sayfa: 4 sütun */
    gap:1.6rem;
}
.plx-ref-grid--home{ grid-template-columns:repeat(5, minmax(0, 1fr)); } /* ana sayfa: 5 sütun */

.plx-ref-card{
    background:#fff;                        /* tasarım notu: logoların çoğu beyaz zeminli, kutular BEYAZ */
    border-radius:1.1rem;
    box-shadow:0 .35rem 1.1rem rgba(55,55,85,.10);   /* zemindeki gri gölge */
    aspect-ratio:349 / 219;                 /* PSD kart oranı */
    display:flex; align-items:center; justify-content:center;
    padding:2.6%;                           /* görsel, kartın iç boşluğuyla birlikte kırpıldı */
    overflow:hidden;
    transition:transform .2s ease, box-shadow .2s ease;
}
.plx-ref-card:hover{ transform:translateY(-5px); box-shadow:0 .8rem 1.8rem rgba(55,55,85,.16); }
.plx-ref-card img{
    width:100%; height:100%;
    object-fit:contain;                     /* logo tasarımdaki oranında kalır, taşmaz */
}

@media (max-width:1199.98px){
    .plx-ref-grid{ grid-template-columns:repeat(3, minmax(0, 1fr)); }
    .plx-ref-grid--home{ grid-template-columns:repeat(4, minmax(0, 1fr)); }
}
@media (max-width:767.98px){
    .plx-ref-grid, .plx-ref-grid--home{ grid-template-columns:repeat(2, minmax(0, 1fr)); gap:1rem; }
    .plx-ref-card{ padding:1rem; border-radius:.9rem; }
}

/* Referans bağlantı listeleri (Online Yayıncılık / Web Uygulamaları) — uzun listeler sütunlara bölünür */
.plx-ref-list{ columns:2; column-gap:2.5rem; list-style:none; padding-left:0; margin-top:1rem; }
.plx-ref-list li{ break-inside:avoid; padding:.42rem 0 .42rem 1.35rem; position:relative; }
.plx-ref-list li::before{ content:"›"; position:absolute; left:.25rem; top:.42rem; color:var(--plx-red); font-weight:700; }
.plx-ref-list a{ color:var(--plx-navy); text-decoration:none; }
.plx-ref-list a:hover{ color:var(--plx-red); text-decoration:underline; }
@media (max-width:767.98px){ .plx-ref-list{ columns:1; } }
/* Belge kartları (CMS "Kutu" özelliği — her sayfada kullanılabilir: ikon + başlık + açıklama + buton) */
.plx-doc-card{ height:100%; background:#fff; border:1px solid #ECEDF1; border-radius:1rem;
    box-shadow:0 .4rem 1.1rem rgba(55,55,85,.06); padding:2.2rem 1.5rem; text-align:center;
    display:flex; flex-direction:column; align-items:center; transition:transform .2s, box-shadow .2s; }
.plx-doc-card:hover{ transform:translateY(-5px); box-shadow:0 .9rem 2rem rgba(55,55,85,.14); }
/* Kartlar aynı satırda eşit yükseklikte olsun → butonlar (margin-top:auto) hizalanır (uzun başlık kaydırmaz) */
/* Satıra sığmayan son kart(lar) ortada dursun (örn. 5 kartta alttaki tek kart) */
.plx-doc-grid{ justify-content:center; }
.plx-doc-grid > div[class*="col-"]{ display:flex; }
.plx-doc-grid .plx-doc-card{ flex:1 1 auto; }
.plx-doc-icon{ margin-bottom:1.4rem; line-height:1; }
.plx-doc-icon i{ font-size:2.6rem; color:var(--plx-red); }
.plx-doc-icon img{ height:56px; width:auto; max-width:100%; }
.plx-doc-title{ color:var(--plx-navy); font-weight:700; font-size:1.12rem; line-height:1.3; margin:0 0 .9rem;
    min-height:3.9em; display:flex; align-items:center; justify-content:center; } /* 3 satır yer ayır → butonlar hizalı */
.plx-doc-desc{ color:var(--plx-text); font-size:.95rem; line-height:1.45; margin:0 0 1.6rem !important; }
.plx-doc-btn{ margin-top:auto !important; display:inline-block; padding:.6rem 1.6rem; border:1px solid var(--plx-navy);
    border-radius:2rem; color:var(--plx-navy); font-weight:600; font-size:.95rem; text-decoration:none;
    transition:background .2s, color .2s; }
.plx-doc-btn:hover{ background:var(--plx-navy); color:#fff; }
/* .plx-page-content a:hover kuralı daha özgül olduğu için butonun yazısı kırmızı kalıyordu; burada eziyoruz */
.plx-page-content a.plx-doc-btn{ color:var(--plx-navy); }
.plx-page-content a.plx-doc-btn:hover{ color:#fff; background:var(--plx-navy); }
/* İçerik bölüm ikonu (CMS metni içinde başlık üstü illüstrasyon) */
.plx-content-icon{ text-align:center; margin:2.5rem 0 .25rem; }
.plx-content-icon img{ max-width:300px; width:60%; height:auto; }
@media (max-width:575.98px){ .plx-content-icon img{ width:78%; } }
/* Alt çözüm kartları (CMS içeriği içinde — ikon + başlık, alt sayfaya link) */
.plx-subsol-grid{ display:flex; flex-wrap:wrap; justify-content:center; gap:1.25rem; margin:1.75rem 0 2.5rem; }
.plx-subsol-card{ flex:1 1 220px; max-width:300px; background:var(--plx-card-bg); border-radius:1.15rem;
    box-shadow:0 .35rem 1.1rem rgba(55,55,85,.10); padding:1.5rem 1rem; text-align:center; text-decoration:none;
    display:flex; flex-direction:column; align-items:center; gap:.9rem; transition:transform .2s, box-shadow .2s; }
.plx-subsol-card:hover{ transform:translateY(-6px); box-shadow:0 .8rem 1.8rem rgba(55,55,85,.16); }
.plx-subsol-card img{ width:150px; height:auto; max-width:90%; order:1; } /* başlığın altında */
.plx-subsol-card span{ color:var(--plx-navy); font-weight:700; font-size:1rem; line-height:1.3; order:0;
    min-height:2.6em; display:flex; align-items:center; justify-content:center; } /* başlık üstte + sabit yükseklik → ikonlar hizalı */
@media (max-width:767.98px){ .plx-subsol-card{ flex-basis:100%; max-width:none; } }
.plx-logo-img--sm{ height:auto; width:min(60vw, 250px); }
/* Önyükleyici (preloader) — main.php'deki satır içi <style>'dan taşındı */
#preloader{ position:fixed; top:0; left:0; width:100vw; height:100vh; z-index:9999; background-color:#ffffff; display:flex; justify-content:center; align-items:center; opacity:1; visibility:visible; transition:opacity .5s ease-out, visibility .5s ease-out; }
#preloader.hidden{ opacity:0; visibility:hidden; }
/* Güvence: gizleme kodu custom.js'e taşındı (CSP). Betik herhangi bir sebeple
   yüklenemezse ziyaretçi beyaz ekranda kalmasın diye 6 sn sonra kendiliğinden kaybolur. */
#preloader{ animation:plxPreloaderFailsafe 0s linear 6s forwards; }
@keyframes plxPreloaderFailsafe{ to{ opacity:0; visibility:hidden; } }
/* Lockup çok yatay (682x55): 180px genişlikte yüksekliği 14px'e düşüyor ve çok küçük
   görünüyordu. Genişlik üzerinden ölçeklenir; masaüstünde ~39px yükseklik (başlıktaki
   logoyla benzer), dar ekranda %80 genişliğe kadar. */
#preloader img{ width:min(80vw, 480px); max-width:none; height:auto; animation:plxPulse 1.8s infinite ease-in-out; }
@keyframes plxPulse{ 0%{ transform:scale(1); } 50%{ transform:scale(1.05); } 100%{ transform:scale(1); } }

/* ---------- İletişim ---------- */
.plx-contact-form .form-control{
    border:1px solid #D8DAE0; border-radius:50rem;
    background:#fff; padding:.85rem 1.6rem; font-size:.95rem;
    color:var(--plx-navy);
    box-shadow:inset 0 1px 3px rgba(55,55,85,.05);
}
.plx-contact-form .form-control::placeholder{ color:#9AA0AE; }
.plx-contact-form .form-control:focus{ border-color:var(--plx-red); box-shadow:0 0 0 .2rem rgba(182,50,50,.12); }
.plx-contact-form textarea.form-control{ border-radius:1.6rem; min-height:170px; resize:vertical; }
.plx-btn-red{
    display:inline-block; background:var(--plx-red); color:#fff !important;
    text-decoration:none;                 /* <a> olarak kullanıldığında alt çizgi çıkmasın */
    border:none; border-radius:50rem;
    font-weight:600; font-size:1rem;
    padding:.8rem 2.4rem;
    box-shadow:0 .4rem 1rem rgba(182,50,50,.35);
    transition:background .2s, transform .2s;
}
.plx-btn-red:hover{ background:var(--plx-red-hover); transform:translateY(-2px); text-decoration:none; }
.plx-contact-info{ text-align:center; }
.plx-contact-info h4{
    color:var(--plx-red-bright); font-weight:700; font-size:1.05rem;
    margin-bottom:.3rem !important; margin-top:1.4rem !important;
}
.plx-contact-info h4:first-child{ margin-top:0 !important; }
.plx-contact-info p, .plx-contact-info a{ color:var(--plx-navy); font-size:.98rem; line-height:1.5; }
.plx-contact-info a{ text-decoration:none; }
.plx-contact-info a:hover{ color:var(--plx-red-bright); }
.plx-contact-info .plx-privacy{ text-decoration:underline; display:inline-block; margin-top:1.6rem !important; }
.plx-form-alert{ border-radius:1rem; font-size:.92rem; }

/* map */
.plx-map{ border-top:5px solid var(--plx-line); border-bottom:5px solid var(--plx-line); }
.plx-map iframe{ display:block; width:100%; height:clamp(320px, 32vw, 614px); border:0; }

/* ---------- Footer ---------- */
.plx-footer{
    background:linear-gradient(#D6DADE, #DBDFE2);
    padding:5rem 0 0;
    text-align:center;
}
/* nokta (halftone) dalgası — PSD tasarımındaki alt zemin; içerikten sonra tam genişlik şerit.
   Görselin üst rengi (#DBDFE2) footer gradyanının bittiği renge eşit → dikişsiz geçiş. */
.plx-footer::after{
    content:""; display:block; width:100%;
    aspect-ratio: 1920 / 857;
    margin-top:2.5rem;
    background:url('../img/footer-dots.png') center top / 100% auto no-repeat;
}
.plx-footer .container{
    display:flex; flex-direction:column; align-items:center; gap:4.5rem;
}
.plx-footer .plx-nav{ display:inline-flex; background:#fff; box-shadow:0 .3rem 1rem rgba(55,55,85,.12); }
.plx-footer .plx-copy{ color:var(--plx-navy); font-size:.85rem; line-height:1.7; }
.plx-footer .plx-copy .small{ font-size:.78rem; color:var(--plx-text); }

/* ---------- Responsive ---------- */
@media (max-width: 991.98px){
    .plx-nav--desktop{ display:none; }
    .plx-toggler{ display:inline-flex; }
    /* Mobilde ağ görseli metnin arkasında yoğun; okunabilirlik için hafif buzlu bir zemin
       (masaüstünde tasarımdaki gibi kartsız/temiz kalır) */
    .plx-hero-caption{ bottom:clamp(1.25rem, 4vw, 2rem); }
    .plx-hero-band{
        background:rgba(255,255,255,.8);
        border-radius:1rem;
        box-shadow:0 .3rem 1rem rgba(55,55,85,.12);
        padding:1.1rem 1.25rem 1.25rem;
    }
    /* Kademeli (şaşırtmalı) dizilim yalnızca masaüstünde; dar ekranda kartlar alt alta
       gelirken aralar eşit olsun. NOT: .plx-brand-grid--five kuralı 3 sınıflı olduğundan
       tek sınıflı sıfırlama onu yenemiyordu — aynı özgüllükte yazıldı. */
    .plx-brand-card.offset,
    .plx-brand-grid--five .plx-brand-card.offset{ margin-top:0 !important; }
    .plx-cozum-card, .plx-cozum-card--big{ max-width:340px; }
    /* footer menü pilleri dar ekranda alt satıra kaysın */
    .plx-footer .plx-nav{ flex-wrap:wrap; justify-content:center; max-width:100%; }
    /* hero: dar/dikey ekranda üstteki boş gökyüzünü kırp, ağ görselini yukarı çek.
       Hafif yakınlaştırma (130%) + alta hizala: ağ tepeleri üstte, gökyüzü ince bir şerit,
       yansıma bandın altında kalır. Aşırı yakınlaştırma yapılmaz (temiz görünüm). */
    .plx-hero .carousel-item{ height:auto; min-height:400px; background-size:auto 130%; background-position:center bottom; }
}
/* Header'da logo lockup dar ekranda taşıyordu: yalnızca logo + hamburger kalsın */
@media (min-width: 768px) and (max-width: 991.98px){
    .plx-header .plx-logo img{ height:36px; }
}
@media (max-width: 767.98px){
    .plx-header .plx-logo img{ height:32px; }
    /* Footer logosu da başlıktakiyle aynı ölçüde ve kendi oranında çizilsin.
       576–767 aralığında base kural (height:44px + max-width:100%) kabı aşıp hafifçe
       eziyordu; 576 altında ise 290px kalıyordu. Tek kuralla ikisi de çözülüyor.
       Özgüllük 3 sınıf: 575.98 bloğundaki ".plx-logo img" sırayla ezmesin diye. */
    .plx-footer .plx-logo--footer img{ height:auto; width:min(74vw, 300px); }
}

/* Telefonda metin kartı slider görselinin ÜZERİNE biniyordu. Görsel ile kart artık alt alta:
   arka plan görseli ::before'a taşınır — satır içi background-image'ı JS .carousel-item'a
   atadığı için ::before onu `inherit` ile devralır; .carousel-item'da görsel çizilmez. */
@media (max-width: 767.98px){
    .plx-hero .carousel-item{
        height:auto; min-height:0;
        background-size:0 0;
        background-color:#fff;
    }
    .plx-hero .carousel-item::before{
        content:""; display:block;
        aspect-ratio:2 / 1;                  /* hero.jpg 1920x958 */
        background-image:inherit;
        background-size:cover; background-position:center; background-repeat:no-repeat;
    }
    .plx-hero-caption{ position:static; }
    .plx-hero-band{
        background:#fff; box-shadow:none; border-radius:0;
        padding:1.35rem 0 1.5rem;
    }
    /* Slider gösterge bandı (carousel-indicators) top:100% ile bir sonraki bölümün üst
       boşluğuna sarkıyor; bölüm dolgusu 3rem, bant 2.9rem olduğu için başlık banda
       yapışıyordu. Hero'dan sonraki bölüme bandı karşılayacak kadar ek üst boşluk. */
    .plx-hero + .plx-bg-texture .plx-section{ padding-top:6rem; }

    /* --- Yatay kayma (sayfanın sağa sola oynaması) --- */
    /* Bootstrap'te .container'ın yan dolgusu varsayılan 1.5rem ızgaraya göre 12px'tir.
       g-5 satırı ise -24px kenar boşluğu kullandığından 12px sağa taşıyor ve belge
       viewport'tan geniş kalıyordu. Dar ekranda sütunlar zaten alt alta geldiği için
       yatay ızgarayı küçültüyoruz; dikey ızgara (--bs-gutter-y) etkilenmez. */
    .row.g-5{ --bs-gutter-x:1.5rem; }
    /* Hero kartının yan dolgusu mobilde 0 olduğundan satırın negatif kenar boşlukları
       açıkta kalıyordu; metin zaten kap dolgusuyla hizalı olduğu için ızgara sıfırlanır. */
    .plx-hero-band .row{ --bs-gutter-x:0; }

    /* Dar ekranda yaslı (justify) hizalama kelime aralarını aşırı açıyor; sola yaslı daha
       okunur. CMS içeriğindeki satır içi text-align:justify, cleanContentStyles() ile
       .text-justify sınıfına çevrildiğinden tek kural yeterli. */
    .text-justify{ text-align:left !important; }

    /* --- Sayfa başlığı banner görselleri --- */
    /* Görseller 1920x377–381 (≈5:1) ve kompozisyonları "sol taraf boş, GRAFİK SAĞDA".
       Dar ekranda cover yanlardan kırptığı için varsayılan "center" grafiği ikiye bölüyordu.
       Kırpmayı SOLDAN yapıyoruz (background-position:right) → sağdaki grafik korunur.
       Başlık banner'ın ÜZERİNDE kalır; grafiğin üstüne denk geldiğinde okunabilsin diye
       sol tarafa, görselin açık zeminiyle uyumlu yumuşak bir örtü konur. */
    .plx-banner--img,
    .plx-banner--hakkimizda, .plx-banner--iletisim, .plx-banner--cozumler,
    .plx-banner--baglantilar, .plx-banner--referanslar{
        position:relative;
        background-size:cover;
        background-position:right center;
        background-repeat:no-repeat;
    }
    .plx-banner--img::before,
    .plx-banner--hakkimizda::before, .plx-banner--iletisim::before, .plx-banner--cozumler::before,
    .plx-banner--baglantilar::before, .plx-banner--referanslar::before{
        content:''; position:absolute; inset:0; z-index:0; pointer-events:none;
        background:linear-gradient(90deg,
            rgba(238,240,243,.96) 0%, rgba(238,240,243,.88) 38%,
            rgba(238,240,243,.30) 62%, rgba(238,240,243,0) 80%);
    }
    .plx-banner--img .container,
    .plx-banner--hakkimizda .container, .plx-banner--iletisim .container,
    .plx-banner--cozumler .container, .plx-banner--baglantilar .container,
    .plx-banner--referanslar .container{
        position:relative; z-index:1;
    }
}
/* Orta masaüstü (1200–1399, kap 1140): logo(büyük başlık) + 5 menü + dil değiştirici
   tam boyutta taşıyordu — orta seviye sıkıştırma. ≥1400'de tam boyut. */
@media (min-width: 1200px) and (max-width: 1399.98px){
    .plx-header .plx-logo img{ height:36px; }
    .plx-header .plx-logo{ gap:.6rem; }
    .plx-header .plx-logo-tagline b{ font-size:1.15rem; }
    .plx-header .plx-logo-tagline span{ font-size:.62rem; letter-spacing:.08em; }
    .plx-header .plx-nav{ gap:.1rem; padding:.3rem .3rem; }
    .plx-header .plx-nav a{ padding:.35rem .58rem; font-size:.86rem; }
    .plx-header-right{ gap:.7rem; }
    .plx-header .plx-logo{ margin-right: 1.4rem; }
}
/* Küçük masaüstü (992–1199, kap 960): en dar aralık — İngilizce uzun alt başlık
   ("The Technology and Solution Network of the Future") sığmıyordu. En güçlü sıkıştırma. */
@media (min-width: 992px) and (max-width: 1199.98px){
    .plx-header .plx-logo img{ height:27px; }
    .plx-header .plx-logo{ gap:.5rem; }
    .plx-header .plx-logo-tagline b{ font-size:.98rem; letter-spacing:.02em; }
    .plx-header .plx-logo-tagline span{ font-size:.52rem; letter-spacing:.01em; }
    .plx-header .plx-nav{ gap:.05rem; padding:.22rem .22rem; }
    .plx-header .plx-nav a{ padding:.32rem .42rem; font-size:.78rem; }
    .plx-header-right{ gap:.45rem; }
    .plx-lang{ font-size:.78rem; }
    .plx-header .plx-logo{ margin-right: 1rem; }
}
@media (max-width: 575.98px){
    .plx-logo img{ height:auto; width:min(66vw, 290px); }
    /* Lockup oranı 682x55. Başlıkta yükseklik 32px'e SABİTLENİP genişlik min(66vw,290px) ile
       kısıtlanınca görsel yatayda eziliyordu (390px ekranda doğru genişliğin ~%65'i).
       Yükseklik oranla belirlensin; genişlik hamburger düğmesine yer bırakacak kadar büyütüldü.
       NOT: ".plx-header .plx-logo img" 3 sınıflı olduğundan 2 sınıflı height:auto onu ezemiyor —
       aynı özgüllükte yazmak şart. */
    .plx-header .plx-logo img{ height:auto; width:min(74vw, 300px); }
    .plx-logo .plx-logo-tagline b{ font-size:1rem; }
    .plx-logo .plx-logo-tagline span{ font-size:.55rem; }
    .plx-section{ padding:3rem 0; }
    /* Footer logosu dikey dizilsin (yatay lockup dar ekranda taşıyor) */
    .plx-logo--footer{ flex-direction:column; gap:.55rem; text-align:center; }
    .plx-logo--footer .plx-logo-sep{ display:none; }
    .plx-logo--footer .plx-logo-tagline{ align-items:center; }
    .plx-footer .container{ gap:3rem; }
}

/* offcanvas mobile menu */
.plx-offcanvas .offcanvas-body a{
    display:block; padding:.8rem 1.1rem; border-radius:.8rem;
    color:var(--plx-navy); text-decoration:none; font-weight:600; font-size:1.05rem;
}
.plx-offcanvas .offcanvas-body a.active{ background:var(--plx-red); color:#fff; }
.plx-offcanvas .offcanvas-body a.plx-sub{ font-weight:400; font-size:.95rem; padding-left:2.2rem; }
/* mobil açılır alt menü (Çözümler+): varsayılan kapalı, başlığa basınca açılır */
.plx-offcanvas .offcanvas-body a.plx-mobile-toggle{ display:flex; align-items:center; justify-content:space-between; }
.plx-mobile-caret{ font-size:.8rem; transition:transform .25s ease; margin-left:.5rem; }
.plx-offcanvas .plx-mobile-toggle[aria-expanded="true"] .plx-mobile-caret{ transform:rotate(180deg); }