:root {
    --mo-lacivert: #0b1f3a;
    --mo-lacivert2: #10294b;
    --mo-mavi: #0056b3;
    --mo-mavi2: #0d6efd;
    --mo-turuncu: #f97316;
    --mo-turuncu2: #ea580c;
    --mo-yesil: #25d366;
    --mo-yesil2: #1ebe5d;
    --mo-kirmizi: #dc3545;
    --mo-zemin: #f4f6fa;
    --mo-cizgi: #e4e9f2;
    --mo-metin: #1c2b3a;
    --mo-gri: #5c6b7a;
}
body {
    font-family: "Roboto", "Segoe UI", Arial, sans-serif;
    background: var(--mo-zemin);
    color: var(--mo-metin);
    padding-bottom: 0;
}
@media (max-width: 767px) {
    body { padding-bottom: 64px; }
}
a { text-decoration: none; }
img { max-width: 100%; }
.mo-container { max-width: 1280px; margin: 0 auto; padding: 0 15px; }

.mo-topbar { background: var(--mo-lacivert); color: #cfdcec; font-size: 12.5px; }
.mo-topbar-in { display: flex; justify-content: space-between; align-items: center; min-height: 32px; flex-wrap: wrap; }
.mo-topbar-sol span { margin-right: 18px; }
.mo-topbar-sol i { color: var(--mo-turuncu); margin-right: 5px; }
.mo-topbar-sag a { color: #cfdcec; margin-left: 16px; }
.mo-topbar-sag a:hover { color: #fff; }

.mo-navbar { display: flex; align-items: center; gap: 18px; padding-top: 12px; padding-bottom: 12px; background: #fff; }
.mo-logo { flex-shrink: 0; }
.mo-arama { flex: 1; display: flex; border: 2px solid var(--mo-mavi); border-radius: 10px; overflow: hidden; max-width: 720px; }
.mo-arama input { flex: 1; border: 0; outline: 0; padding: 12px 16px; font-size: 14.5px; min-width: 0; }
.mo-arama button { border: 0; background: var(--mo-mavi); color: #fff; padding: 0 22px; cursor: pointer; font-size: 16px; }
.mo-arama button:hover { background: var(--mo-lacivert); }
.mo-ikonlar { display: flex; gap: 12px; margin-left: auto; }
.mo-ikon { display: flex; flex-direction: column; align-items: center; color: var(--mo-lacivert); font-size: 12px; line-height: 1.2; }
.mo-ikon i { font-size: 22px; margin-bottom: 2px; }
.mo-ikon-wa { color: var(--mo-yesil2); }
.mo-ikon:hover { color: var(--mo-mavi); }
.mo-burger { display: none; background: none; border: 0; font-size: 26px; color: var(--mo-lacivert); }

.mo-menu { background: var(--mo-lacivert); }
.mo-menu-in { display: flex; flex-wrap: wrap; }
.mo-menu a { color: #e8eff8; padding: 11px 18px; font-size: 14px; font-weight: 500; display: inline-flex; align-items: center; gap: 7px; }
.mo-menu a i { color: var(--mo-turuncu); font-size: 12px; }
.mo-menu a:hover { background: var(--mo-lacivert2); color: #fff; }
.mo-header.kucuk .mo-logo img { width: 160px; height: 70px; }
.mo-header.kucuk .mo-menu a { padding-top: 8px; padding-bottom: 8px; }

.mo-mobil-menu { position: fixed; top: 0; left: -290px; width: 280px; height: 100%; background: #fff; z-index: 1100; transition: left .28s ease; overflow-y: auto; box-shadow: 2px 0 18px rgba(0,0,0,.25); }
.mo-mobil-menu.acik { left: 0; }
.mo-mobil-ust { display: flex; align-items: center; justify-content: space-between; padding: 12px; border-bottom: 1px solid var(--mo-cizgi); }
.mo-kapat { border: 0; background: none; font-size: 22px; color: var(--mo-lacivert); }
.mo-mobil-menu > a { display: flex; align-items: center; gap: 12px; padding: 13px 18px; border-bottom: 1px solid #f0f2f6; color: var(--mo-metin); font-size: 15px; }
.mo-mobil-menu > a i { width: 20px; color: var(--mo-mavi); text-align: center; }
.mo-mobil-menu > a.mo-wa { background: var(--mo-yesil); color: #fff; justify-content: center; margin: 12px; border-radius: 10px; border: 0; }
.mo-arama-mobil { margin: 12px; max-width: none; }
.mo-overlay { position: fixed; inset: 0; background: rgba(0,0,0,.5); z-index: 1050; display: none; }
.mo-overlay.gorunur { display: block; }

@media (max-width: 991px) {
    .mo-burger { display: block; }
    .mo-navbar { flex-wrap: wrap; }
    .mo-arama { order: 3; flex-basis: 100%; max-width: none; }
    .mo-ikonlar { margin-left: auto; }
    .mo-ikon span { display: none; }
    .mo-menu { display: none; }
}

.mo-kart { background: #fff; border: 1px solid var(--mo-cizgi); border-radius: 12px; overflow: hidden; transition: box-shadow .2s, transform .2s; height: 100%; display: flex; flex-direction: column; }
.mo-kart:hover { box-shadow: 0 10px 26px rgba(11,31,58,.13); transform: translateY(-3px); }
.mo-kart-gorsel { position: relative; display: block; background: #fff; padding: 10px; text-align: center; }
.mo-kart-gorsel img { width: 100%; height: 190px; object-fit: contain; }
.mo-kart-icerik { padding: 12px 14px 14px; display: flex; flex-direction: column; flex: 1; }
.mo-kart-baslik { font-size: 13.5px; font-weight: 500; color: var(--mo-metin); line-height: 1.35; min-height: 38px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.mo-kart-fiyat { font-size: 19px; font-weight: 900; color: var(--mo-mavi); margin: 8px 0 4px; }
.mo-kart-fiyat small { font-size: 12px; font-weight: 500; color: var(--mo-gri); }
.mo-rozet { position: absolute; top: 10px; left: 10px; padding: 4px 9px; border-radius: 20px; font-size: 11px; font-weight: 700; color: #fff; z-index: 2; }
.mo-rozet-stok { background: #16a34a; }
.mo-rozet-temin { background: var(--mo-turuncu); }
.mo-kart-alt { margin-top: auto; display: flex; gap: 8px; padding-top: 10px; }
.mo-btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; border-radius: 9px; padding: 10px 16px; font-size: 13.5px; font-weight: 700; border: 0; cursor: pointer; transition: background .2s; }
.mo-btn-mavi { background: var(--mo-mavi); color: #fff; }
.mo-btn-mavi:hover { background: var(--mo-lacivert); color: #fff; }
.mo-btn-wa { background: var(--mo-yesil); color: #fff; }
.mo-btn-wa:hover { background: var(--mo-yesil2); color: #fff; }
.mo-btn-turuncu { background: var(--mo-turuncu); color: #fff; }
.mo-btn-turuncu:hover { background: var(--mo-turuncu2); color: #fff; }
.mo-btn-buyuk { padding: 14px 26px; font-size: 15px; }
.mo-btn-blok { width: 100%; }

.mo-sayfa-baslik { font-size: 26px; font-weight: 900; color: var(--mo-lacivert); }
.mo-sayfa-alt { color: var(--mo-gri); font-size: 14px; }

.mo-uyari { background: #fff7ed; border: 1px solid #fed7aa; border-radius: 10px; padding: 14px 16px; font-size: 14px; color: #9a3412; }

.mo-wa-yuzer { position: fixed; right: 20px; bottom: 20px; z-index: 950; display: flex; align-items: center; gap: 10px; background: var(--mo-yesil); color: #fff; padding: 13px 20px; border-radius: 50px; font-weight: 700; font-size: 14.5px; box-shadow: 0 8px 24px rgba(37,211,102,.45); animation: moNabiz 2.2s infinite; }
.mo-wa-yuzer i { font-size: 24px; }
.mo-wa-yuzer:hover { color: #fff; background: var(--mo-yesil2); }
@keyframes moNabiz {
    0% { box-shadow: 0 0 0 0 rgba(37,211,102,.55); }
    70% { box-shadow: 0 0 0 16px rgba(37,211,102,0); }
    100% { box-shadow: 0 0 0 0 rgba(37,211,102,0); }
}
.mo-wa-cubuk { display: none; }
@media (max-width: 767px) {
    .mo-wa-yuzer { display: none; }
    .mo-wa-cubuk { position: fixed; left: 0; right: 0; bottom: 0; z-index: 1000; display: flex; background: #fff; border-top: 1px solid var(--mo-cizgi); padding: 8px 10px; gap: 8px; box-shadow: 0 -4px 14px rgba(0,0,0,.08); }
    .mo-wa-cubuk a { flex: 1; display: flex; align-items: center; justify-content: center; gap: 8px; border-radius: 10px; padding: 12px 8px; font-size: 14.5px; font-weight: 700; color: #fff; }
    .mo-wa-cubuk-tel { background: var(--mo-lacivert); }
    .mo-wa-cubuk-wa { background: var(--mo-yesil); }
}

.mo-seo-blok { background: #fff; border-top: 1px solid var(--mo-cizgi); border-bottom: 1px solid var(--mo-cizgi); margin-top: 36px; padding: 26px 0; }
.mo-seo-blok h2 { font-size: 19px; font-weight: 900; color: var(--mo-lacivert); margin: 0 0 12px; }
.mo-seo-blok p { font-size: 13.5px; color: #44546a; line-height: 1.75; margin-bottom: 8px; }
.mo-seo-baglantilar { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
.mo-seo-baglantilar a { background: #f2f5f9; border: 1px solid var(--mo-cizgi); color: var(--mo-mavi); padding: 6px 14px; border-radius: 20px; font-size: 12.5px; }
.mo-seo-baglantilar a:hover { background: var(--mo-mavi); border-color: var(--mo-mavi); color: #fff; }

.mo-footer { background: #ffffff; color: #5c6b7a; border-top: 1px solid var(--mo-cizgi); padding: 40px 0 0; }
.mo-footer h5 { color: var(--mo-lacivert); font-size: 14px; font-weight: 800; margin-bottom: 14px; letter-spacing: .4px; }
.mo-footer a { display: block; color: #5c6b7a; font-size: 13.5px; padding: 4px 0; }
.mo-footer a:hover { color: var(--mo-mavi); }
.mo-footer-yazi { font-size: 13.5px; line-height: 1.6; }
.mo-footer p { color: #5c6b7a; }
.mo-footer p i { color: var(--mo-mavi); margin-right: 8px; }
.mo-footer-loglar { display: inline-flex; gap: 12px; flex-wrap: wrap; margin-top: 8px; background: var(--mo-lacivert); border-radius: 10px; padding: 10px 16px; }
.mo-footer-loglar img { max-height: 34px; width: auto; }
.mo-footer-alt { border-top: 1px solid var(--mo-cizgi); margin-top: 28px; padding: 16px 0; text-align: center; font-size: 12.5px; color: #8494a7; background: #fafbfd; }

.mo-urun-ust { display: flex; gap: 34px; background: #fff; border: 1px solid var(--mo-cizgi); border-radius: 14px; padding: 22px; margin-bottom: 22px; }
.mo-urun-gorsel { flex: 1.05; min-width: 0; text-align: center; background: #fff; border: 1px solid #eef1f6; border-radius: 12px; padding: 14px; position: relative; }
.mo-urun-gorsel img { width: 100%; height: auto; max-height: 460px; object-fit: contain; cursor: zoom-in; }
.mo-urun-bilgi { flex: 1; min-width: 0; }
.mo-urun-baslik { font-size: 22px; font-weight: 900; color: var(--mo-lacivert); line-height: 1.3; }
.mo-urun-fiyat { font-size: 34px; font-weight: 900; color: var(--mo-mavi); margin: 14px 0 4px; }
.mo-urun-kdv { font-size: 13px; color: var(--mo-gri); }
.mo-urun-sku { font-size: 13px; color: var(--mo-gri); }
.mo-urun-cta { display: flex; flex-wrap: wrap; gap: 12px; margin: 18px 0; }
.mo-ozellikler { display: grid; grid-template-columns: 1fr 1fr; gap: 8px 16px; margin: 16px 0; font-size: 13.5px; }
.mo-ozellik { background: #f7f9fc; border: 1px solid var(--mo-cizgi); border-radius: 8px; padding: 10px 12px; }
.mo-ozellik b { display: block; color: var(--mo-lacivert); margin-bottom: 2px; }
.mo-guven-seridi { display: flex; gap: 18px; flex-wrap: wrap; background: #f7f9fc; border: 1px dashed var(--mo-cizgi); border-radius: 10px; padding: 12px 16px; margin-top: 14px; font-size: 13px; color: var(--mo-gri); }
.mo-guven-seridi span i { color: #16a34a; margin-right: 6px; }
@media (max-width: 991px) {
    .mo-urun-ust { flex-direction: column; }
    .mo-urun-gorsel img { max-height: 360px; }
    .mo-urun-baslik { font-size: 18px; }
    .mo-urun-fiyat { font-size: 27px; }
    .mo-ozellikler { grid-template-columns: 1fr; }
}

.mo-baslik-cubuk { display: flex; align-items: center; gap: 12px; margin: 30px 0 16px; }
.mo-baslik-cubuk h2 { font-size: 21px; font-weight: 900; color: var(--mo-lacivert); margin: 0; }
.mo-baslik-cubuk::before { content: ""; width: 6px; height: 26px; background: var(--mo-turuncu); border-radius: 3px; }

.mo-ekmek { font-size: 13px; color: var(--mo-gri); padding: 14px 0; }
.mo-ekmek a { color: var(--mo-mavi); }
.mo-ekmek a:hover { color: var(--mo-lacivert); }

.mo-hero { background: linear-gradient(135deg, var(--mo-lacivert) 0%, var(--mo-lacivert2) 55%, #14355e 100%); color: #fff; padding: 46px 0 58px; text-align: center; }
.mo-hero h1 { font-size: 32px; font-weight: 900; margin: 0 0 8px; color: #fff; }
.mo-hero p { color: #b9cbe2; font-size: 15.5px; margin-bottom: 22px; }
.mo-hero-arama { max-width: 680px; margin: 0 auto; display: flex; border: 3px solid #fff; border-radius: 12px; overflow: hidden; background: #fff; }
.mo-hero-arama input { flex: 1; border: 0; outline: 0; padding: 15px 18px; font-size: 15.5px; min-width: 0; }
.mo-hero-arama button { border: 0; background: var(--mo-turuncu); color: #fff; padding: 0 30px; font-size: 16px; font-weight: 700; cursor: pointer; }
.mo-hero-arama button:hover { background: var(--mo-turuncu2); }
.mo-model-cips { display: flex; flex-wrap: wrap; justify-content: center; gap: 9px; margin-top: 22px; }
.mo-model-cips a { background: rgba(255,255,255,.1); border: 1px solid rgba(255,255,255,.28); color: #eaf1fb; padding: 7px 16px; border-radius: 30px; font-size: 13.5px; }
.mo-model-cips a:hover { background: var(--mo-turuncu); border-color: var(--mo-turuncu); color: #fff; }

.mo-ozellik-kartlari { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; margin: -30px auto 8px; max-width: 1100px; position: relative; z-index: 2; }
.mo-ozellik-kart { background: #fff; border-radius: 12px; box-shadow: 0 6px 18px rgba(11,31,58,.09); padding: 16px; display: flex; gap: 12px; align-items: center; font-size: 13.5px; }
.mo-ozellik-kart i { font-size: 26px; color: var(--mo-mavi); }
.mo-ozellik-kart b { display: block; color: var(--mo-lacivert); }
@media (max-width: 767px) {
    .mo-hero h1 { font-size: 24px; }
    .mo-ozellik-kartlari { grid-template-columns: 1fr 1fr; }
}

.mo-sayfalama { display: flex; justify-content: center; margin: 26px 0; }
.mo-sayfalama a, .mo-sayfalama span { padding: 9px 15px; margin: 0 3px; border: 1px solid var(--mo-cizgi); border-radius: 8px; background: #fff; color: var(--mo-lacivert); font-size: 14px; }
.mo-sayfalama span.aktif { background: var(--mo-mavi); border-color: var(--mo-mavi); color: #fff; font-weight: 700; }

.mo-urun-kartlar { display: grid; grid-template-columns: repeat(auto-fill, minmax(215px, 1fr)); gap: 16px; }
.mo-tab-baslik { border-bottom: 2px solid var(--mo-cizgi); margin-bottom: 18px; }
.mo-tab-baslik a { display: inline-block; padding: 12px 22px; font-weight: 700; color: var(--mo-gri); border-bottom: 3px solid transparent; margin-bottom: -2px; }
.mo-tab-baslik a.aktif { color: var(--mo-mavi); border-color: var(--mo-mavi); }

.mo-yorum { border: 1px solid var(--mo-cizgi); border-radius: 10px; padding: 14px; margin-bottom: 12px; background: #fbfcfe; }
.mo-yorum .fa-star { color: #f5b301; }

#paytr_taksit_tablosu { clear: both; font-size: 12px; max-width: 1100px; margin: 0 auto; text-align: center; font-family: "Roboto", Arial, sans-serif; }
#paytr_taksit_tablosu::before { display: table; content: ""; }
#paytr_taksit_tablosu::after { content: ""; clear: both; display: table; }
.taksit-tablosu-wrapper { margin: 6px; width: 270px; padding: 14px 12px; cursor: default; text-align: center; display: inline-block; border: 1px solid var(--mo-cizgi); border-radius: 10px; background: #fff; }
.taksit-logo img { max-height: 26px; padding-bottom: 8px; }
.taksit-tutari-text { float: left; width: 125px; color: #8494a7; margin-bottom: 4px; }
.taksit-tutar-wrapper { display: inline-block; background-color: #f7f9fc; border-radius: 6px; }
.taksit-tutar-wrapper:hover { background-color: #eef2f7; }
.taksit-tutari { float: left; width: 125px; padding: 6px 0; color: var(--mo-lacivert); border: 2px solid #fff; }
.taksit-tutari-bold { font-weight: 700; }
.mo-taksit-yukleniyor { display: inline-block; padding: 16px; color: #8494a7; font-size: 13.5px; }
.mo-adimlar { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin-top: 16px; }
.mo-adim { background: #f7f9fc; border: 1px solid var(--mo-cizgi); border-radius: 10px; padding: 12px 14px; font-size: 13px; color: var(--mo-gri); }
.mo-adim i { font-size: 20px; color: var(--mo-mavi); margin-bottom: 6px; }
.mo-adim b { display: block; color: var(--mo-lacivert); margin-bottom: 3px; }
@media all and (max-width: 600px) {
    .taksit-tablosu-wrapper { margin: 5px 0; width: 100%; }
    .taksit-tutari-text { width: 50%; }
    .taksit-tutari { width: 50%; }
}
@media (max-width: 767px) {
    .mo-adimlar { grid-template-columns: 1fr; }
}

.mo-bilgi-kutusu { background: #fff; border: 1px solid var(--mo-cizgi); border-radius: 12px; padding: 20px; }
.mo-ic-baslik { font-size: 17px; font-weight: 800; color: var(--mo-lacivert); margin-bottom: 10px; }

.mo-yok-sonuc { text-align: center; padding: 50px 0; }
.mo-yok-sonuc i { font-size: 46px; color: #cbd5e1; }
.mo-yok-sonuc p { color: var(--mo-gri); font-size: 15px; margin-top: 10px; }

.mo-zoom-modal { position: fixed; inset: 0; background: rgba(0,0,0,.75); z-index: 2000; display: flex; align-items: center; justify-content: center; }
.mo-zoom-modal img { max-width: 88%; max-height: 88%; }
.mo-zoom-kapat { position: absolute; top: 18px; right: 24px; color: #fff; font-size: 34px; cursor: pointer; }