/* ---------------------------------------------------------------------------
   Web shell yerlesim sozlesmesi (DynamicPage / WebSurface)

   NEDEN VAR: shell markup'i Bootstrap 5'e gore yazilmis (container-fluid px-0,
   row g-0, row g-3). Ama tenant temalari Bootstrap 4 tarzi bir .row kurali
   servis ediyor:

       .row { margin-right: -15px; margin-left: -15px; }

   BS5'in g-* yardimcilari degisken tabanli oldugu icin (--bs-gutter-x) bu
   kurali EZEMIYOR; g-0 yazsan da marj -15px kaliyor. Ustelik container'da
   px-0 var, yani negatif marji telafi edecek padding de yok. Sonuc: shell
   viewport'u iki yandan 15px asiyor ve mobilde yatay kaydirma cikiyor.

   Canli olcum (kandogroup.com.tr, 375px, 2026-08-25): viewport=375
   scrollWidth=390, BES SAYFANIN HEPSINDE tam 15px tasma.

   COZUM: shell'in kendi satir/kolon kutularinda hem negatif marj hem de onu
   dengeleyen kolon padding'i sifirlaniyor. Ikisi zaten birbirini goturuyordu;
   modul icerigi bu yuzden dogru yerde duruyordu (hero 0..375) ve yalniz
   KUTULAR disari sarkiyordu. Ikisini birlikte sifirlamak modul geometrisini
   BIREBIR AYNI birakip tasmayi kaldiriyor - olculdu: tasma 15 -> 0, hero ve
   features 0..375'te degismedi.

   Kapsam bilincli olarak dar: yalniz .web-shell-root altindaki shell
   elemanlari. Genel .row / [class*="col-"] hedeflenmiyor ki modullerin kendi
   ic grid'leri ve tema bilesenleri etkilenmesin.
   --------------------------------------------------------------------------- */

.web-shell-root > .row,
.web-shell-root .web-shell-module-grid {
    margin-left: 0;
    margin-right: 0;
}

.web-shell-root > .row > .web-shell-region,
.web-shell-root .web-shell-module-grid > .module-wrapper {
    padding-left: 0;
    padding-right: 0;
}

/* Menu landing marka hiyerarşisi: yapı ve görseller modül verisinden gelir. */
.menu-landing-module--brand {
    --menu-landing-accent: var(--web-primary, #0d5bd7);
    --menu-landing-border: var(--web-border, #d6e3f7);
    --menu-landing-heading: var(--web-text, #082b63);
    --menu-landing-muted: var(--web-muted, #697586);
}

.menu-landing-brand-hierarchy {
    align-items: center;
    display: grid;
    gap: clamp(1rem, 2vw, 1.75rem);
}

.menu-landing-brand-node {
    background: var(--web-surface, #fff);
    border: 1px solid var(--menu-landing-border);
    border-radius: var(--web-radius, 1.1rem);
    box-shadow: 0 .65rem 1.6rem rgba(8, 43, 99, .08);
    justify-self: center;
    overflow: hidden;
    width: min(100%, 22rem);
}

.menu-landing-brand-node--root {
    width: min(100%, 17rem);
}

.menu-landing-brand-node__link,
.menu-landing-brand-card__link {
    color: inherit;
    display: grid;
    height: 100%;
    text-decoration: none;
}

.menu-landing-brand-node__link {
    min-height: 7.5rem;
    padding: 1.25rem;
    place-items: center;
}

.menu-landing-brand-node__link:focus-visible,
.menu-landing-brand-card__link:focus-visible {
    outline: 3px solid color-mix(in srgb, var(--menu-landing-accent) 38%, transparent);
    outline-offset: -3px;
}

.menu-landing-brand-node img,
.menu-landing-brand-card__mark img {
    display: block;
    height: auto;
    max-height: 5.4rem;
    max-width: min(100%, 15rem);
    object-fit: contain;
    width: 100%;
}

.menu-landing-brand-node__name,
.menu-landing-brand-card__name {
    color: var(--menu-landing-heading);
    font-size: 1rem;
    font-weight: 750;
    letter-spacing: -.02em;
    text-align: center;
}

.menu-landing-brand-grid {
    display: grid;
    gap: clamp(.9rem, 1.5vw, 1.25rem);
    grid-auto-rows: 1fr;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 15.5rem), 1fr));
    width: 100%;
}

.menu-landing-brand-card {
    background: var(--web-surface, #fff);
    border: 1px solid var(--menu-landing-border);
    border-radius: var(--web-radius, 1.1rem);
    box-shadow: 0 .45rem 1.25rem rgba(8, 43, 99, .06);
    min-height: 10.5rem;
    overflow: hidden;
    transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease;
}

.menu-landing-brand-card:hover {
    border-color: color-mix(in srgb, var(--menu-landing-accent) 42%, var(--menu-landing-border));
    box-shadow: 0 .85rem 1.6rem rgba(8, 43, 99, .12);
    transform: translateY(-.18rem);
}

.menu-landing-brand-card__link {
    align-content: space-between;
    gap: .8rem;
    padding: 1.1rem 1.2rem;
}

.menu-landing-brand-card__mark {
    align-items: center;
    display: flex;
    justify-content: center;
    min-height: 5.25rem;
}

.menu-landing-brand-card--compact-mark .menu-landing-brand-card__mark img {
    max-height: 3.65rem;
    max-width: 4.2rem;
}

.menu-landing-brand-card small {
    color: var(--menu-landing-muted);
    font-size: .78rem;
    font-weight: 650;
    letter-spacing: .035em;
    text-align: center;
    text-transform: uppercase;
}

@media (max-width: 36rem) {
    .menu-landing-brand-grid {
        grid-template-columns: 1fr;
    }
}

@media (prefers-reduced-motion: reduce) {
    .menu-landing-brand-card {
        transition: none;
    }
}