/* OUTER FRAME – PREMIUM ORTA GENİŞLİK */
    .mirai-bmc-frame {
        width: 100%;
        max-width: 1520px;
        /* Sayfaya yayılıyor ama tam duvar gibi değil */
        margin: 0 auto;
        /* Ortalı kalsın */
        border: 1px solid rgba(255, 255, 255, 0.45);
        border-radius: 18px;
        padding: 32px 30px;
        /* Biraz daha ince padding */
        backdrop-filter: blur(6px);
        background: rgba(0, 0, 0, 0.18);
        box-shadow: 0 14px 36px rgba(0, 0, 0, 0.35);
    }

    /* ORIGINAL BMC GRID (simetri sabit) */
    .mirai-bmc-grid {
        display: grid;
        grid-gap: 24px;
        grid-template-areas:
            "partners activities value relationships segments"
            "resources resources channels channels channels"
            "cost cost cost revenue revenue";
    }

    /* Bloklara göre hafif renk tonu (warm pastel glass) */
    .warm-partners {
        background: rgba(214, 198, 143, 0.24);
    }

    .warm-activities {
        background: rgba(221, 173, 137, 0.24);
    }

    .warm-value {
        background: rgba(255, 239, 213, 0.24);
    }

    .warm-relationships {
        background: rgba(255, 208, 190, 0.24);
    }

    .warm-segments {
        background: rgba(232, 213, 144, 0.24);
    }

    .warm-resources {
        background: rgba(214, 179, 196, 0.24);
    }

    .warm-channels {
        background: rgba(216, 206, 191, 0.24);
    }

    .warm-cost {
        background: rgba(200, 193, 185, 0.24);
    }

    .warm-revenue {
        background: rgba(198, 219, 156, 0.24);
    }
        .mirai-bmc-grid {
            grid-template-areas:
                "partners"
                "activities"
                "value"
                "relationships"
                "segments"
                "resources"
                "channels"
                "cost"
                "revenue";
        }


    /* ============================================================
   MIRAI CANVAS — Frame, kutular, başlık, numara, ikon, tooltip
   ============================================================ */

    /* DIŞ ÇERÇEVE GENİŞLİĞİ ve ORTALAMA */
    .mirai-bmc-frame {
        max-width: 1900px;
        /* Gerekirse 1600–1800 civarına çekebilirsin */
        margin: 0 auto;
        /* yatayda ortalar */
        padding: 2.5rem 3rem;
        /* çerçeve ile kutular arasındaki boşluk */
    }

    /* GRID'İ de tam ortaya çekelim */
    .mirai-bmc-grid {
        margin-inline: auto;
    }

    /* KUTU: referans noktası + hover animasyonları */
    .mirai-bmc-grid .box {
        position: relative;
        transition:
            transform 0.35s ease,
            box-shadow 0.35s ease,
            border-color 0.35s ease,
            backdrop-filter 0.35s ease;
        backdrop-filter: blur(12px);
    }

    .mirai-bmc-grid .box:hover {
        transform: translateY(-6px) scale(1.005);
        /* daha az yukarı, daha az büyüme */
        box-shadow: 0 14px 32px rgba(0, 0, 0, 0.55);
        /* gölgeyi hafiflet */
        border-color: rgba(255, 255, 255, 0.35);
        backdrop-filter: blur(16px);
    }


    /* BAŞLIK SATIRI */
    .mirai-bmc-title {
        position: relative;
        padding-bottom: 0.65rem;
        margin-bottom: 0.75rem;
        font-size: 0.9rem;
        letter-spacing: 0.08em;
        text-transform: uppercase;
        text-align: left;
        gap: 0.45rem;
        padding-right: 2.8rem;
        /* sağ üstteki numara için boşluk */
    }


    /* Başlık altı çizgi — KUTU BORDER’I İLE AYNI STİL */
    .mirai-bmc-title::after {
        content: "";
        position: absolute;
        left: 40px;
        bottom: 0;

        width: 40px;
        /* normal uzunluk (sende vardı) */
        height: 0;
        /* dolgu çizgiyi kapat */
        border-top: 0.75px solid rgba(255, 255, 255, 0.35);
        /* BOX border ile aynı */
        border-radius: 999px;

        background: none;
        /* eski beyaz kalın çizgiyi kapat */
        transition: width 0.35s ease;
    }


    /* Hover’da aynı çizgi sadece UZASIN (stil değişmesin) */
    .mirai-bmc-grid .box:hover .mirai-bmc-title::after {
        width: 5.0rem;
        /* sende vardı */
    }

    /* Eski sabit-uzayan çizgiyi kapat */
    .mirai-bmc-title::after {
        content: none !important;
    }


    /* NUMARA: sağ üst köşe */
    .mirai-bmc-index {
        position: absolute;
        top: 0.45rem;
        right: 1.1rem;

        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 1.8rem;
        height: 1.8rem;
        border-radius: 999px;
        border: 1px solid rgba(255, 255, 255, 0.75);
        font-size: 0.8rem;
        font-weight: 600;
        color: #fff;
        background: rgba(0, 0, 0, 0.16);
        box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.18);
    }

    .mirai-bmc-grid .box:hover .mirai-bmc-index {
        background: rgba(255, 255, 255, 0.08);
        box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.35);
    }

    /* İKON ve LABEL (sol üstte kalıyorlar) */
    .mirai-bmc-icon i {
        font-size: 0.95rem;
        opacity: 0.9;
    }

    .mirai-bmc-label {
        white-space: nowrap;
    }

    /* INFO: sağ alt köşe (minicik “i” tooltip tetikleyici) */
    .mirai-bmc-info {
        position: absolute;
        right: 0.9rem;
        bottom: 0.7rem;

        margin-left: 0;
        border: none;
        background: transparent;
        padding: 0;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 1.4rem;
        height: 1.4rem;
        border-radius: 999px;
        color: rgba(255, 255, 255, 0.72);
        font-size: 0.8rem;
        cursor: pointer;
        transition:
            background-color 0.25s ease,
            color 0.25s ease,
            box-shadow 0.25s ease;
    }

    .mirai-bmc-info:hover {
        background: rgba(255, 255, 255, 0.1);
        box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.4);
    }
        .mirai-bmc-title {
            flex-wrap: wrap;
        }

        .mirai-bmc-label {
            white-space: normal;
        }


    /* ====================== END OF SECTION: about-us ====================== */


    /* ============================================================
   MIRAI BMC — FINAL GRID (NO INDEX VERSION)
   ============================================================ */

    /* GLOBAL RESET */
    .mirai-bmc-grid,
    .mirai-bmc-frame,
    #mirai-canvas .container-fluid {
        box-sizing: border-box;
        overflow-x: hidden !important;
    }

    /* OUTER FRAME */
    .mirai-bmc-frame {
        max-width: 1600px;
        margin: 0 auto;
        padding: 20px;
    }

    /* ============================================================
   GRID — ORIGINAL BUSINESS MODEL CANVAS RATIOS
   ============================================================ */
    .mirai-bmc-grid {
        display: grid;
        grid-template-columns: repeat(12, 1fr);
        grid-auto-rows: auto;
        gap: 24px;
        width: 100%;
        padding: 0 20px;
    }

    /* TOP ROW (1–5) */
    .mirai-bmc-grid .partners {
        grid-column: span 2;
    }

    .mirai-bmc-grid .activities {
        grid-column: span 2;
    }

    .mirai-bmc-grid .value {
        grid-column: span 3;
    }

    .mirai-bmc-grid .relationships {
        grid-column: span 2;
    }

    .mirai-bmc-grid .segments {
        grid-column: span 3;
    }

    /* MIDDLE ROW (6–7) */
    .mirai-bmc-grid .resources {
        grid-column: span 6;
    }

    .mirai-bmc-grid .channels {
        grid-column: span 6;
    }

    /* BOTTOM ROW (8–9) */
    .mirai-bmc-grid .cost {
        grid-column: span 7;
    }

    .mirai-bmc-grid .revenue {
        grid-column: span 5;
    }

    /* ============================================================
   BOX DEFAULTS
   ============================================================ */
    .mirai-bmc-grid .box {
        position: relative;
        padding: 28px;
        min-width: 0;
        height: 100%;
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
    }

    .mirai-bmc-grid .box ul li {
        line-height: 1.45rem;
    }

    /* ============================================================
   INDEX REMOVAL — COMPLETELY HIDE NUMBERS
   ============================================================ */

    /* Hide index elements entirely */
    .mirai-bmc-index {
        display: none !important;
        visibility: hidden !important;
        opacity: 0 !important;
        width: 0 !important;
        height: 0 !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    /* Remove any leftover space inside titles */
    .mirai-bmc-title .mirai-bmc-index {
        display: none !important;
    }
        .mirai-bmc-grid {
            grid-template-columns: repeat(6, 1fr);
        }

        .mirai-bmc-grid .partners,
        .mirai-bmc-grid .activities,
        .mirai-bmc-grid .value,
        .mirai-bmc-grid .relationships,
        .mirai-bmc-grid .segments {
            grid-column: span 6;
        }

        .mirai-bmc-grid .resources {
            grid-column: span 6;
        }

        .mirai-bmc-grid .channels {
            grid-column: span 6;
        }

        .mirai-bmc-grid .cost {
            grid-column: span 6;
        }

        .mirai-bmc-grid .revenue {
            grid-column: span 6;
        }
        .mirai-bmc-grid {
            grid-template-columns: 1fr;
        }

        .mirai-bmc-grid .partners,
        .mirai-bmc-grid .activities,
        .mirai-bmc-grid .value,
        .mirai-bmc-grid .relationships,
        .mirai-bmc-grid .segments,
        .mirai-bmc-grid .resources,
        .mirai-bmc-grid .channels,
        .mirai-bmc-grid .cost,
        .mirai-bmc-grid .revenue {
            grid-column: span 1;
        }


    /* Canvas kutuları: sidebar için zemin */
    .mirai-bmc-frame .box {
        position: relative;
        padding-left: 88px;
        /* Sol dikey bant kadar iç boşluk */
    }


    /* DİKEY SOL BANT BAŞLIK */
    .mirai-bmc-title {
        position: absolute;
        top: 0;
        left: 0;
        bottom: 0;
        /* Kutunun tüm yüksekliğini kaplasın */
        width: 40px;
        /* Bant genişliği */

        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;

        background: rgba(255, 255, 255, 0.06);
        border-right: 1px solid rgba(255, 255, 255, 0.16);
        border-radius: 26px 0 0 26px;
        padding: 14px 6px;
    }

    /* Numara */
    .mirai-bmc-index {
        font-size: 0.7rem;
        font-weight: 600;
        color: #ffffff;
        opacity: 0.85;
        margin-bottom: 8px;
    }

    /* İkon */
    .mirai-bmc-icon {
        font-size: 1.1rem;
        color: #ffffff;
        margin-bottom: 10px;
    }

    /* Dikey başlık metni */
    .mirai-bmc-label {
        writing-mode: vertical-rl;
        /* Dikey yazı yönü */
        transform: rotate(180deg);
        /* Harfler ters olmasın */
        font-size: 0.8rem;
        font-weight: 700;
        letter-spacing: 0.08em;
        text-align: center;
        color: #ffffff;
    }


    /* İç liste hizası yumuşasın */
    .mirai-bmc-frame .box ul {
        margin-bottom: 0;
    }

/* =========================================================
   HR SHORT — NET
   ========================================================= */

.hr-short {
  height: 2px;
  width: 60px;
  border: none;
  background: linear-gradient(
    to right,
    rgba(0, 0, 0, 0),
    rgba(0, 0, 0, 0.75),
    rgba(0, 0, 0, 0)
  );
}


/* =========================================================
   PATCH — MIRAI BMC GRID LAYOUT (desktop + responsive)
   Amaç: Kartların genişlik/span bozulmasını gidermek ve
         orijinal (index.html) görünümü birebir yakalamak.
   Not: Bu blok dosyanın EN SONUNDA durarak tüm önceki
        tanımları güvenli şekilde override eder.
   ========================================================= */

/* Desktop: 12 kolon / orijinal span matematiği (2-2-3-2-3) */
.mirai-bmc-grid {
  display: grid !important;
  gap: 24px !important;
  grid-template-columns: repeat(12, minmax(0, 1fr)) !important;
  grid-template-areas:
    "partners partners activities activities value value value relationships relationships segments segments segments"
    "resources resources resources resources channels channels channels channels channels channels channels channels"
    "cost cost cost cost cost cost revenue revenue revenue revenue revenue revenue" !important;
}

/* Grid item eşleştirmeleri (HTML'deki class isimleri üzerinden) */
.mirai-bmc-grid > .partners { grid-area: partners !important; }
.mirai-bmc-grid > .activities { grid-area: activities !important; }
.mirai-bmc-grid > .value { grid-area: value !important; }
.mirai-bmc-grid > .relationships { grid-area: relationships !important; }
.mirai-bmc-grid > .segments { grid-area: segments !important; }
.mirai-bmc-grid > .resources { grid-area: resources !important; }
.mirai-bmc-grid > .channels { grid-area: channels !important; }
.mirai-bmc-grid > .cost { grid-area: cost !important; }
.mirai-bmc-grid > .revenue { grid-area: revenue !important; }

/* Grid çocuklarının taşmaması (özellikle uzun metinlerde) */
.mirai-bmc-grid > .box {
  min-width: 0 !important;
}

/* Mobil/tablet: tek kolon stack */
@media (max-width: 991.98px) {
  .mirai-bmc-grid {
    grid-template-columns: 1fr !important;
    grid-template-areas:
      "partners"
      "activities"
      "value"
      "relationships"
      "segments"
      "resources"
      "channels"
      "cost"
      "revenue" !important;
  }
}

	
	
	
	

	
	
	
	
	.bg-holder {
  position: absolute;
  inset: 0;
  overflow: hidden;
}

.bg-holder img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 70%;
}