/* V1 sayfaları için uyumluluk stilleri. V2 CSS bundan sonra yüklenir ve ortak sınıfları ezer. */

        :root{
            --ecm-primary:#0f172a;
            --ecm-secondary:#1d4ed8;
            --ecm-accent:#22c55e;
            --ecm-light:#f8fafc;
            --ecm-muted:#64748b;
            --ecm-border:#e2e8f0;
            --ecm-soft:#eff6ff;
        }

        html{ scroll-behavior:smooth; }
        body{ font-family: Arial, Helvetica, sans-serif; color:var(--ecm-primary); background:#fff; }

        .navbar{
            background:rgba(255,255,255,.92);
            border-bottom:1px solid var(--ecm-border);
            box-shadow:0 8px 24px rgba(15,23,42,.06);
            backdrop-filter:blur(10px);
        }
        .navbar-brand{ font-weight:700; font-size:1.35rem; color:var(--ecm-primary)!important; display:flex; align-items:center; gap:10px; }
        .navbar-brand img{ max-height:42px; width:auto; }
        .nav-link{ color:var(--ecm-primary)!important; font-weight:600; transition:.2s ease; }
        .nav-link:hover, .nav-link.active{ color:var(--ecm-secondary)!important; }
        .btn-main{ background:var(--ecm-secondary); color:#fff; border:none; border-radius:12px; padding:.72rem 1.2rem; font-weight:600; }
        .btn-main:hover{ background:#1e40af; color:#fff; }
        .btn-outline-main{ border:1px solid var(--ecm-secondary); color:var(--ecm-secondary); background:#fff; border-radius:12px; padding:.72rem 1.2rem; font-weight:600; }
        .btn-outline-main:hover{ background:var(--ecm-secondary); color:#fff; }
        .btn-soft{ background:#fff; border:1px solid var(--ecm-border); color:var(--ecm-primary); border-radius:12px; padding:.72rem 1.2rem; font-weight:600; }
        .btn-soft:hover{ border-color:#cbd5e1; background:#f8fafc; }

        .hero{
            background:radial-gradient(circle at top left, #dbeafe 0%, #eff6ff 24%, #ffffff 55%, #f8fafc 100%);
            padding:76px 0 78px;
        }
        .section-space{ padding:86px 0; }
        .section-light{ background:var(--ecm-light); }
        .section-title{ font-size:2.15rem; font-weight:700; margin-bottom:15px; }
        .section-subtitle{ color:var(--ecm-secondary); font-weight:700; text-transform:uppercase; letter-spacing:.55px; margin-bottom:10px; font-size:.92rem; }
        .section-desc{ color:var(--ecm-muted); font-size:1.05rem; line-height:1.8; }
        .section-anchor{ scroll-margin-top:90px; }

        .glass-card,
        .info-card,
        .product-card,
        .story-card,
        .screen-card,
        .faq-card,
        .detail-feature,
        .integration-card{
            background:#fff;
            border:1px solid var(--ecm-border);
            border-radius:22px;
            padding:24px;
            box-shadow:0 14px 30px rgba(15,23,42,.05);
            height:100%;
            transition:.25s ease;
        }
        .glass-card:hover,
        .info-card:hover,
        .product-card:hover,
        .story-card:hover,
        .screen-card:hover,
        .faq-card:hover,
        .detail-feature:hover,
        .integration-card:hover{
            transform:translateY(-4px);
            box-shadow:0 18px 34px rgba(15,23,42,.08);
        }

        .hero-kicker{ display:inline-flex; align-items:center; gap:8px; padding:8px 14px; border-radius:999px; background:#dbeafe; color:#1d4ed8; font-size:.92rem; font-weight:700; margin-bottom:18px; }
        .hero-title{ font-size:clamp(1.9rem, 4vw, 2.5rem); font-weight:800; line-height:1.1; margin-bottom:6px;  }
        .hero-note{ color:var(--ecm-muted); font-size:1.1rem; line-height:1.8; max-width:780px; }
        .hero-mini-grid{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; margin-top:28px; }
        .hero-mini{ background:#fff; border:1px solid var(--ecm-border); border-radius:18px; padding:16px 18px; box-shadow:0 8px 20px rgba(15,23,42,.04); }
        .hero-mini .title{ font-weight:700; margin-bottom:6px; }
        .hero-mini .desc{ color:var(--ecm-muted); font-size:.95rem; line-height:1.6; }
        .hero-visual{ background:#fff; border:1px solid var(--ecm-border); border-radius:26px; padding:18px; box-shadow:0 18px 38px rgba(15,23,42,.08); }
        .hero-visual img{ width:100%; height:340px; object-fit:cover; border-radius:18px; display:block; background:#f8fafc; border:1px solid var(--ecm-border); }
        .hero-visual .caption{ display:flex; gap:10px; flex-wrap:wrap; margin-top:14px; }
        .hero-chip{ display:inline-flex; align-items:center; gap:8px; background:var(--ecm-soft); color:var(--ecm-primary); border-radius:999px; padding:8px 12px; font-size:.92rem; font-weight:600; }

        .product-card .icon-wrap,
        /* Ürünlerimiz kart görsel ayarları */
:root{
    --product-card-image-height: 180px;   /* burayı değiştirerek resim yüksekliğini ayarlarsın 180px daha kısa kart görseli, 240px dengeli büyük görünüm, 280px daha vitrin tipi görünüm */
    --product-card-image-radius: 18px;
}

.product-card .product-media{
    width: 100%;
    height: var(--product-card-image-height);
    border-radius: var(--product-card-image-radius);
    overflow: hidden;
    margin-bottom: 18px;
    border: 1px solid var(--ecm-border);
    background: #f8fafc;
    display: flex;
    align-items: center;
    justify-content: center;
}

.product-card .product-media img{
    width: 100%;
    height: 100%;
    object-fit: cover; /* tamamını sığdırmak istersen cover yerine contain yaz */
    display: block;
}

.product-card .product-media.product-media-contain img{
    object-fit: contain;
    padding: 12px;
    background: #fff;
}

/* Sadece Ürünlerimiz kartlarındaki ikon alanı */
.product-card .icon-wrap.product-fallback-icon{
    width: 78px;
    height: 78px;
    border-radius: 20px;
    margin-bottom: 18px;
    font-size: 2rem;
}
        .detail-feature .icon-wrap,
        .integration-card .icon-wrap,
        .story-card .icon-wrap,
        .info-card .icon-wrap{
            width:58px;
            height:58px;
            border-radius:16px;
            background:#eff6ff;
            color:var(--ecm-secondary);
            display:flex;
            align-items:center;
            justify-content:center;
            font-size:1.5rem;
            margin-bottom:18px;
        }
        .card-title-ecm{ font-size:1.16rem; font-weight:700; margin-bottom:10px; }
        .card-desc-ecm{ color:var(--ecm-muted); line-height:1.75; font-size:.97rem; }
        .card-list{ margin:16px 0 0; padding:0; list-style:none; }
        .card-list li{ color:var(--ecm-muted); line-height:1.7; margin-bottom:8px; display:flex; gap:10px; }
        .card-list li i{ color:var(--ecm-accent); margin-top:4px; }

        .section-split-image{ width:100%; height:100%; min-height:360px; object-fit:cover; border-radius:22px; border:1px solid var(--ecm-border); background:#f8fafc; box-shadow:0 12px 28px rgba(15,23,42,.05); }
        .detail-grid{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; }
        .detail-anchor-title{ display:flex; align-items:center; gap:12px; margin-bottom:14px; }
        .detail-anchor-title .pill{ background:#dbeafe; color:#1d4ed8; border-radius:999px; padding:7px 12px; font-size:.88rem; font-weight:700; }

        .integration-flow{ position:relative; }
        .integration-flow::before{ content:""; position:absolute; left:24px; top:18px; bottom:18px; width:2px; background:#dbeafe; }
        .integration-card{ position:relative; padding-left:72px; }
        .integration-step{ position:absolute; left:0; top:0; width:48px; height:48px; border-radius:16px; background:var(--ecm-secondary); color:#fff; display:flex; align-items:center; justify-content:center; font-weight:700; }
        .integration-media{
            width:100%;
            height:180px;
            border-radius:18px;
            overflow:hidden;
            margin-bottom:18px;
            border:1px solid var(--ecm-border);
            background:#f8fafc;
        }
        .integration-media img{
            width:100%;
            height:100%;
            object-fit:cover;
            display:block;
        }

        .integration-fallback-icon{
            margin-bottom:18px;
        }
        .card-cover-media{
            width:100%;
            height:180px;
            border-radius:18px;
            overflow:hidden;
            margin-bottom:18px;
            border:1px solid var(--ecm-border);
            background:#f8fafc;
        }
        .card-cover-media.card-cover-media-sm{
            height:160px;
        }
        .card-cover-media img{
            width:100%;
            height:100%;
            object-fit:cover;
            display:block;
        }

        .screen-card img, .list-cover, .page-cover, .detail-cover-image{
            width:100%;
            height:clamp(140px, 20vw, 260px);
            object-fit:cover;
            border-radius:18px;
            border:1px solid var(--ecm-border);
            background:#f8fafc;
            display:block;
        }
        .logo-chip{ max-width:160px; max-height:72px; width:auto; height:auto; object-fit:contain; }

        .faq-accordion .accordion-item{ border:1px solid var(--ecm-border); border-radius:18px !important; overflow:hidden; margin-bottom:16px; }
        .accordion-button:not(.collapsed){ background:#eff6ff; color:var(--ecm-primary); box-shadow:none; }
        .accordion-button:focus{ box-shadow:none; border-color:#cbd5e1; }

        .demo-box{ background:#fff; border:1px solid var(--ecm-border); border-radius:24px; padding:30px; box-shadow:0 16px 36px rgba(15,23,42,.06); }
        .form-control, .form-select{ min-height:48px; border-radius:12px; border:1px solid #cbd5e1; }
        .form-control:focus, .form-select:focus{ box-shadow:none; border-color:#93c5fd; }
        textarea.form-control{ min-height:120px; }
        .mini-contact{ background:#f8fafc; border:1px solid var(--ecm-border); border-radius:18px; padding:18px; }
        .mini-contact-item{ display:flex; gap:12px; align-items:flex-start; margin-bottom:12px; color:var(--ecm-muted); }
        .mini-contact-item:last-child{ margin-bottom:0; }

        .floating-whatsapp{
            position:fixed;
            right:20px;
            bottom:20px;
            width:58px;
            height:58px;
            border-radius:50%;
            background:#22c55e;
            color:#fff;
            display:flex;
            align-items:center;
            justify-content:center;
            font-size:1.8rem;
            box-shadow:0 16px 30px rgba(34,197,94,.35);
            z-index:1030;
            text-decoration:none;
        }
        .floating-whatsapp:hover{ color:#fff; transform:translateY(-2px); }

        @media (max-width: 991.98px){
            .hero{ padding:78px 0 56px; }
            .section-space{ padding:66px 0; }
            .section-title{ font-size:1.8rem; }
            .hero-mini-grid, .detail-grid{ grid-template-columns:1fr; }
            .hero-visual img{ height:320px; }
            .navbar .btn-main, .navbar .btn-outline-main{ margin-top:12px; width:100%; }
        }
    

        .ecm-footer{
            background:#0f172a;
            color:#cbd5e1;
            padding:72px 0 24px;
            margin-top:0;
        }

        .ecm-footer a{
            color:#cbd5e1;
            text-decoration:none;
            transition:.2s ease;
        }

        .ecm-footer a:hover{
            color:#ffffff;
        }

        .ecm-footer-brand{
            color:#ffffff;
            font-size:1.55rem;
            font-weight:800;
            margin-bottom:16px;
        }

        .ecm-footer-text{
            color:#94a3b8;
            line-height:1.8;
            font-size:.98rem;
        }

        .ecm-footer-title{
            color:#ffffff;
            font-size:1.08rem;
            font-weight:700;
            margin-bottom:18px;
            position:relative;
            padding-bottom:10px;
        }

        .ecm-footer-title::after{
            content:"";
            position:absolute;
            left:0;
            bottom:0;
            width:42px;
            height:2px;
            background:#3b82f6;
            border-radius:999px;
        }

        .ecm-footer-links{
            list-style:none;
            padding:0;
            margin:0;
        }

        .ecm-footer-links li{
            margin-bottom:12px;
        }

        .ecm-footer-links a{
            display:inline-flex;
            align-items:center;
            gap:10px;
            font-size:.96rem;
        }

        .ecm-footer-links i{
            color:#60a5fa;
            font-size:.9rem;
        }

        .ecm-footer-contact-item{
            display:flex;
            gap:12px;
            align-items:flex-start;
            margin-bottom:14px;
            color:#cbd5e1;
            line-height:1.7;
        }

        .ecm-footer-contact-item i{
            color:#60a5fa;
            font-size:1rem;
            margin-top:4px;
        }

        .ecm-footer-social{
            display:flex;
            flex-wrap:wrap;
            gap:10px;
            margin-top:18px;
        }

        .ecm-footer-social a{
            width:42px;
            height:42px;
            border-radius:50%;
            display:flex;
            align-items:center;
            justify-content:center;
            background:rgba(255,255,255,.06);
            border:1px solid rgba(255,255,255,.08);
            color:#ffffff;
        }

        .ecm-footer-social a:hover{
            background:#2563eb;
            border-color:#2563eb;
            transform:translateY(-2px);
        }

        .ecm-footer-cta{
            background:rgba(255,255,255,.04);
            border:1px solid rgba(255,255,255,.08);
            border-radius:18px;
            padding:22px;
        }

        .ecm-footer-cta-title{
            color:#ffffff;
            font-size:1.05rem;
            font-weight:700;
            margin-bottom:10px;
        }

        .ecm-footer-cta-text{
            color:#94a3b8;
            font-size:.95rem;
            line-height:1.75;
            margin-bottom:16px;
        }

        .ecm-footer-btn{
            display:inline-flex;
            align-items:center;
            gap:8px;
            padding:12px 16px;
            border-radius:12px;
            font-weight:600;
            margin-right:8px;
            margin-bottom:8px;
        }

        .ecm-footer-btn-main{
            background:#2563eb;
            color:#ffffff !important;
        }

        .ecm-footer-btn-outline{
            border:1px solid rgba(255,255,255,.15);
            color:#ffffff !important;
        }

        .ecm-footer-bottom{
            margin-top:44px;
            padding-top:18px;
            border-top:1px solid rgba(255,255,255,.08);
        }

        .ecm-footer-bottom-text{
            color:#94a3b8;
            font-size:.92rem;
        }

        @media (max-width: 991.98px){
            .ecm-footer{
                padding:56px 0 20px;
            }
        }