/*
 * MikroBayi.com Modern UI Layer — 2026-07-16
 * Reversible visual layer. Existing navbar markup, Bootstrap components,
 * forms, modals, sliders and page content remain intact.
 */
:root{
  --mb-wine:#6f0810;
  --mb-wine-dark:#2a0306;
  --mb-wine-deep:#160204;
  --mb-red:#a50f1b;
  --mb-red-soft:#fff1f2;
  --mb-gold:#d3a64f;
  --mb-ink:#17202b;
  --mb-muted:#5f6977;
  --mb-line:#e8ebef;
  --mb-surface:#ffffff;
  --mb-surface-soft:#f6f7f9;
  --mb-surface-warm:#fbf8f6;
  --mb-shadow-sm:0 8px 24px rgba(22,27,35,.08);
  --mb-shadow-md:0 18px 55px rgba(22,27,35,.12);
  --mb-shadow-lg:0 30px 80px rgba(22,27,35,.18);
  --mb-radius-sm:12px;
  --mb-radius:20px;
  --mb-radius-lg:30px;
  --mb-transition:220ms cubic-bezier(.2,.7,.2,1);
}

html{scroll-behavior:smooth;scroll-padding-top:105px}
body.mb-modern{
  color:var(--mb-ink);
  background:var(--mb-surface);
  font-family:"Poppins","Nunito",Arial,sans-serif;
  line-height:1.72;
  letter-spacing:-.006em;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
body.mb-modern::selection{background:#f2cbd0;color:var(--mb-wine-dark)}
body.mb-modern p{color:var(--mb-muted)}
body.mb-modern h1,
body.mb-modern h2,
body.mb-modern h3,
body.mb-modern h4,
body.mb-modern h5,
body.mb-modern h6{
  color:var(--mb-ink);
  font-family:"Poppins","Nunito",Arial,sans-serif;
  font-weight:700;
  line-height:1.18;
  letter-spacing:-.032em;
}
body.mb-modern h2{font-size:clamp(1.75rem,3.2vw,2.65rem);margin-bottom:1.15rem}
body.mb-modern h3{font-size:clamp(1.12rem,2vw,1.45rem)}
body.mb-modern a{transition:color var(--mb-transition),background-color var(--mb-transition),border-color var(--mb-transition),transform var(--mb-transition),box-shadow var(--mb-transition)}
body.mb-modern a:focus-visible,
body.mb-modern button:focus-visible,
body.mb-modern input:focus-visible,
body.mb-modern select:focus-visible,
body.mb-modern textarea:focus-visible{outline:3px solid rgba(165,15,27,.24)!important;outline-offset:3px}

/* Top bar */
body.mb-modern .top-bar{
  background:linear-gradient(90deg,var(--mb-wine-deep),var(--mb-wine-dark) 55%,#4a070d)!important;
  min-height:38px;
  padding:4px 0!important;
  border-bottom:1px solid rgba(255,255,255,.08);
}
body.mb-modern .top-bar p,
body.mb-modern .top-bar span,
body.mb-modern .top-bar a{font-size:13px!important;letter-spacing:.015em}
body.mb-modern .top-bar a:hover{opacity:.82}

/* Navbar — original markup and interactions preserved */
body.mb-modern .navbar{
  background:rgba(255,255,255,.97)!important;
  backdrop-filter:saturate(180%) blur(16px);
  -webkit-backdrop-filter:saturate(180%) blur(16px);
  border:0!important;
  border-bottom:1px solid rgba(23,32,43,.07)!important;
  border-radius:0 0 22px 22px!important;
  box-shadow:0 12px 34px rgba(31,35,48,.09)!important;
  padding:.45rem 0!important;
  z-index:1035;
}
body.mb-modern .navbar .container-fluid{max-width:1440px;padding-left:clamp(18px,3vw,48px);padding-right:clamp(18px,3vw,48px)}
/* Only the primary header logo is sized here. Mega-menu media must not inherit logo limits. */
body.mb-modern .navbar>.container-fluid>a:first-child>img{
  width:auto!important;
  height:auto!important;
  max-width:205px!important;
  max-height:60px!important;
  object-fit:contain;
}
body.mb-modern .navbar .navbar-nav{align-items:center;gap:2px}
body.mb-modern .navbar .nav-link{
  color:var(--mb-ink)!important;
  font-size:12.5px!important;
  font-weight:650!important;
  letter-spacing:.025em;
  padding:13px 12px!important;
  border-radius:10px;
  white-space:nowrap;
  background:transparent!important;
}
body.mb-modern .navbar .nav-link span{color:var(--mb-ink)!important}
body.mb-modern .navbar .nav-link:hover,
body.mb-modern .navbar .nav-link:focus,
body.mb-modern .navbar .nav-link.show{
  color:#fff!important;
  background:linear-gradient(135deg,var(--mb-wine),var(--mb-red))!important;
  box-shadow:0 8px 18px rgba(111,8,16,.18);
  transform:translateY(-1px);
}
body.mb-modern .navbar .nav-link:hover span,
body.mb-modern .navbar .nav-link:focus span,
body.mb-modern .navbar .nav-link.show span{color:#fff!important}
body.mb-modern .navbar-toggler{
  color:var(--mb-wine)!important;
  background:var(--mb-red-soft)!important;
  border:1px solid rgba(111,8,16,.14)!important;
  border-radius:12px!important;
  width:44px;height:44px;
  display:inline-flex;align-items:center;justify-content:center;
  box-shadow:none!important;
}
body.mb-modern .navbar-toggler svg{font-size:22px}
body.mb-modern .dropdown-menu{
  border:1px solid rgba(23,32,43,.08)!important;
  border-radius:0 0 22px 22px!important;
  box-shadow:var(--mb-shadow-lg)!important;
  background:rgba(255,255,255,.985)!important;
  overflow:hidden;
}
body.mb-modern .dropdown-menu .mega-content{padding-top:8px;padding-bottom:12px}
body.mb-modern .dropdown-menu .py-4{padding-top:1.25rem!important;padding-bottom:1.25rem!important}
body.mb-modern .dropdown-menu p[style*="font-size"]{
  color:var(--mb-wine)!important;
  font-weight:700;
  letter-spacing:-.02em;
  margin-bottom:.75rem;
}
body.mb-modern .dropdown-menu .list-group{gap:3px}
body.mb-modern .dropdown-menu .list-group-item,
body.mb-modern .dropdown-item{
  color:#394352!important;
  background:transparent!important;
  border:0!important;
  border-radius:8px!important;
  padding:.52rem .7rem!important;
  font-size:13px!important;
  line-height:1.4;
}
body.mb-modern .dropdown-menu .list-group-item:hover,
body.mb-modern .dropdown-menu .list-group-item:focus,
body.mb-modern .dropdown-item:hover,
body.mb-modern .dropdown-item:focus{
  color:var(--mb-wine)!important;
  background:var(--mb-red-soft)!important;
  transform:translateX(3px);
}
body.mb-modern .dropdown-menu .card{box-shadow:none!important;border:1px solid var(--mb-line)!important}
body.mb-modern .dropdown-menu .card img{height:145px!important;object-fit:cover}
body.mb-modern .dropdown-menu .card-body{padding:.85rem!important}
body.mb-modern .dropdown-menu .card-text{font-size:12.5px!important;line-height:1.55;margin:0}

/* Hero */
body.mb-modern .gradient-banner{
  min-height:620px;
  padding:92px 0 155px!important;
  background:
    radial-gradient(circle at 86% 14%,rgba(211,166,79,.20),transparent 25%),
    radial-gradient(circle at 12% 85%,rgba(200,42,58,.18),transparent 30%),
    linear-gradient(128deg,var(--mb-wine-deep) 0%,var(--mb-wine-dark) 42%,#690a13 100%);
  isolation:isolate;
}
body.mb-modern .gradient-banner::before{
  width:118%;height:115%;left:50%;bottom:-72%;
  border-radius:50%;
  background:linear-gradient(180deg,rgba(255,255,255,.08),rgba(255,255,255,0))!important;
  opacity:.45;
  z-index:-1;
}
body.mb-modern .gradient-banner::after{
  content:"";position:absolute;inset:0;z-index:-2;pointer-events:none;
  background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);
  background-size:48px 48px;
  mask-image:linear-gradient(to bottom,rgba(0,0,0,.75),transparent 88%);
}
body.mb-modern .gradient-banner .shapes-container{opacity:.32;filter:blur(.15px)}
body.mb-modern .gradient-banner .shape::before{background:rgba(255,255,255,.07)!important}
body.mb-modern .gradient-banner>.container{position:relative;z-index:2}
body.mb-modern .gradient-banner .row{min-height:430px}
body.mb-modern .gradient-banner .row>[class*="col-md-6"]:first-child{
  width:auto!important;
  flex:0 0 54%;
  max-width:54%;
  text-align:left!important;
}
body.mb-modern .gradient-banner .row>[class*="col-md-6"]:last-child{
  flex:0 0 46%;
  max-width:46%;
}
body.mb-modern .gradient-banner h1,
body.mb-modern .gradient-banner h2{
  color:#fff!important;
  font-size:clamp(2.35rem,4.15vw,4.5rem)!important;
  line-height:1.06!important;
  font-weight:750!important;
  letter-spacing:-.048em!important;
  max-width:760px;
  margin-bottom:1.35rem!important;
  text-wrap:balance;
}
body.mb-modern .gradient-banner h1 span,
body.mb-modern .gradient-banner h2 span{font-weight:750!important;color:#fff!important}
body.mb-modern .gradient-banner p{
  color:rgba(255,255,255,.82)!important;
  font-size:clamp(1rem,1.25vw,1.12rem)!important;
  line-height:1.75!important;
  max-width:720px;
  margin-bottom:1.7rem!important;
}
body.mb-modern .gradient-banner p strong{color:#fff;font-weight:650}
body.mb-modern .gradient-banner img.img-fluid{
  width:min(100%,530px)!important;
  max-height:420px;
  object-fit:contain;
  padding:18px;
  border:1px solid rgba(255,255,255,.16);
  border-radius:30px;
  background:linear-gradient(145deg,rgba(255,255,255,.13),rgba(255,255,255,.045));
  box-shadow:0 34px 80px rgba(0,0,0,.34),inset 0 1px 0 rgba(255,255,255,.12);
  filter:drop-shadow(0 16px 22px rgba(0,0,0,.15));
}
body.mb-modern .gradient-banner .btn,
body.mb-modern .gradient-banner .btn-main-md{
  min-height:50px;
  display:inline-flex;align-items:center;justify-content:center;
  padding:.78rem 1.35rem!important;
  border-radius:12px!important;
  border:1px solid rgba(255,255,255,.5)!important;
  background:#fff!important;
  color:var(--mb-wine)!important;
  font-size:.92rem!important;
  font-weight:700!important;
  letter-spacing:.005em;
  box-shadow:0 14px 30px rgba(0,0,0,.18)!important;
  text-transform:none!important;
}
body.mb-modern .gradient-banner .btn:hover,
body.mb-modern .gradient-banner .btn-main-md:hover{
  background:var(--mb-gold)!important;
  border-color:var(--mb-gold)!important;
  color:var(--mb-wine-deep)!important;
  transform:translateY(-2px);
  box-shadow:0 18px 38px rgba(0,0,0,.24)!important;
}
body.mb-modern .carousel-item{transition:transform .7s cubic-bezier(.2,.7,.2,1),opacity .5s ease}
body.mb-modern .carousel-indicators{gap:8px;justify-content:flex-start;margin-left:0!important}
body.mb-modern .carousel-indicators button{
  width:8px!important;height:8px!important;border:0!important;border-radius:999px!important;
  background:#fff!important;opacity:.35!important;transition:var(--mb-transition)!important;
}
body.mb-modern .carousel-indicators button.active{width:34px!important;opacity:1!important}

/* Hero information chips inserted by modern JS */
.mb-hero-eyebrow{
  display:inline-flex;align-items:center;gap:9px;
  margin-bottom:15px;padding:7px 11px;
  border:1px solid rgba(255,255,255,.18);border-radius:999px;
  background:rgba(255,255,255,.08);color:#fff;
  font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;
  backdrop-filter:blur(10px)
}
.mb-hero-eyebrow::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--mb-gold);box-shadow:0 0 0 5px rgba(211,166,79,.13)}
.mb-trust-chips{display:flex;flex-wrap:wrap;gap:8px;margin:-.35rem 0 1.5rem}
.mb-trust-chip{
  display:inline-flex;align-items:center;gap:7px;padding:7px 10px;
  border:1px solid rgba(255,255,255,.16);border-radius:9px;
  color:rgba(255,255,255,.9);background:rgba(255,255,255,.07);
  font-size:11.5px;font-weight:600;line-height:1.25;backdrop-filter:blur(8px)
}
.mb-trust-chip::before{content:"✓";color:#f4d488;font-weight:800}

/* Layout and sections */
body.mb-modern .container{max-width:1180px}
body.mb-modern .section:not(.gradient-banner),
body.mb-modern section.bg-light,
body.mb-modern section.bg-gray{padding-top:88px;padding-bottom:88px}
body.mb-modern .pull-top{margin-top:-88px;position:relative;z-index:6}
body.mb-modern section.bg-light,
body.mb-modern .bg-light{background:var(--mb-surface-soft)!important}
body.mb-modern section.bg-gray,
body.mb-modern .bg-gray{background:#f1f3f6!important}
body.mb-modern section:not(.gradient-banner) h2::after,
body.mb-modern div.container>h2::after{
  content:"";display:block;width:52px;height:4px;margin-top:14px;
  border-radius:99px;background:linear-gradient(90deg,var(--mb-wine),var(--mb-gold));
}
body.mb-modern .text-center h2::after,
body.mb-modern h2.text-center::after{margin-left:auto;margin-right:auto}
body.mb-modern section p{font-size:.98rem}
body.mb-modern .lead{font-size:1.08rem!important;line-height:1.75}

/* Cards */
body.mb-modern .card,
body.mb-modern .service-block,
body.mb-modern .service-item,
body.mb-modern .feature-item,
body.mb-modern .pricing,
body.mb-modern .block:not(.footer-main .block):not(.modal .block){
  border:1px solid var(--mb-line)!important;
  border-radius:var(--mb-radius)!important;
  background:var(--mb-surface)!important;
  box-shadow:var(--mb-shadow-sm);
  overflow:hidden;
}
body.mb-modern .card{height:100%}
body.mb-modern .card:hover,
body.mb-modern .service-block:hover,
body.mb-modern .service-item:hover,
body.mb-modern .feature-item:hover{
  transform:translateY(-5px);
  border-color:rgba(111,8,16,.18)!important;
  box-shadow:var(--mb-shadow-md);
}
body.mb-modern .card-body{padding:1.35rem}
body.mb-modern .card-title{font-weight:700;color:var(--mb-ink)}
body.mb-modern .card-text{color:var(--mb-muted)!important}
body.mb-modern .card-img-top{object-fit:cover}
body.mb-modern .pull-top .card,
body.mb-modern .pull-top .shadow{
  border-radius:24px!important;
  box-shadow:0 20px 55px rgba(20,24,31,.14)!important;
}
body.mb-modern .pull-top .card-body{padding:1.5rem!important}
body.mb-modern .pull-top h3{text-transform:none!important;font-size:1.08rem!important}
body.mb-modern .pull-top img{max-height:110px;object-fit:contain}

/* Images and content blocks */
body.mb-modern section:not(.gradient-banner) img.img-fluid:not(.card-img-top),
body.mb-modern div.container>img.img-fluid{
  border-radius:18px;
}
body.mb-modern .feature .image-content img,
body.mb-modern .feature .image img{
  filter:drop-shadow(0 18px 30px rgba(23,32,43,.13));
}
body.mb-modern .customer-logos{
  padding:28px 0;margin:12px 0 0;
  border-top:1px solid var(--mb-line);border-bottom:1px solid var(--mb-line);
  background:#fff;
}
body.mb-modern .customer-logos img{filter:grayscale(1);opacity:.68;transition:var(--mb-transition)}
body.mb-modern .customer-logos img:hover{filter:none;opacity:1;transform:scale(1.04)}

/* Campaign and dark feature banners */
body.mb-modern section .bg-dark,
body.mb-modern .bg-dark.border{
  background:
    radial-gradient(circle at 80% 10%,rgba(211,166,79,.16),transparent 28%),
    linear-gradient(135deg,var(--mb-wine-deep),#4b0710 65%,#74101a)!important;
  border:0!important;
  border-radius:var(--mb-radius-lg)!important;
  box-shadow:var(--mb-shadow-lg);
}
body.mb-modern section .bg-dark h2,
body.mb-modern section .bg-dark p,
body.mb-modern section .bg-dark span{color:#fff!important}
body.mb-modern section .bg-dark img{border-radius:0!important}

/* Buttons */
body.mb-modern .btn{
  border-radius:11px!important;
  padding:.68rem 1.18rem;
  font-weight:650;
  letter-spacing:0;
  text-transform:none;
  box-shadow:none;
}
body.mb-modern .btn-primary,
body.mb-modern .btn-danger,
body.mb-modern .btn-main-md,
body.mb-modern button[type="submit"]{
  background:linear-gradient(135deg,var(--mb-wine),var(--mb-red))!important;
  border-color:transparent!important;
  color:#fff!important;
  box-shadow:0 10px 22px rgba(111,8,16,.19)!important;
}
body.mb-modern .btn-primary:hover,
body.mb-modern .btn-danger:hover,
body.mb-modern .btn-main-md:hover,
body.mb-modern button[type="submit"]:hover{
  transform:translateY(-2px);
  box-shadow:0 14px 30px rgba(111,8,16,.27)!important;
  filter:saturate(1.08);
}
body.mb-modern .btn-success{background:#148459!important;border-color:#148459!important;color:#fff!important}
body.mb-modern .btn-outline-primary{color:var(--mb-wine)!important;border-color:rgba(111,8,16,.35)!important}
body.mb-modern .btn-outline-primary:hover{background:var(--mb-wine)!important;color:#fff!important}

/* Tabs, accordions, list groups */
body.mb-modern .nav-tabs{border:0;gap:8px}
body.mb-modern .nav-tabs .nav-link{
  border:1px solid var(--mb-line)!important;border-radius:10px!important;
  color:var(--mb-muted);background:#fff;padding:.65rem 1rem;
}
body.mb-modern .nav-tabs .nav-link.active{color:#fff;background:var(--mb-wine);border-color:var(--mb-wine)!important}
body.mb-modern .accordion-item,
body.mb-modern .card-header{
  border-color:var(--mb-line)!important;background:#fff!important
}
body.mb-modern .accordion-item{border-radius:14px!important;overflow:hidden;margin-bottom:10px;box-shadow:0 5px 16px rgba(20,24,31,.05)}
body.mb-modern .accordion-button{font-weight:650;color:var(--mb-ink);box-shadow:none!important}
body.mb-modern .accordion-button:not(.collapsed){background:var(--mb-red-soft);color:var(--mb-wine)}
body.mb-modern .list-group-item{border-color:var(--mb-line)}

/* Forms */
body.mb-modern form:not(.navbar form){
  --bs-border-color:var(--mb-line);
}
body.mb-modern .form-control,
body.mb-modern .form-select,
body.mb-modern input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]),
body.mb-modern textarea,
body.mb-modern select{
  min-height:48px;
  border:1px solid #dfe3e8!important;
  border-radius:11px!important;
  background:#fff!important;
  color:var(--mb-ink)!important;
  padding:.7rem .85rem;
  box-shadow:0 1px 0 rgba(23,32,43,.02);
}
body.mb-modern textarea{min-height:120px}
body.mb-modern .form-control:focus,
body.mb-modern .form-select:focus,
body.mb-modern input:focus,
body.mb-modern textarea:focus,
body.mb-modern select:focus{
  border-color:rgba(111,8,16,.48)!important;
  box-shadow:0 0 0 .22rem rgba(111,8,16,.10)!important;
}
body.mb-modern label{color:#323b47;font-size:.88rem;font-weight:600;margin-bottom:.35rem}
body.mb-modern .modal-content{
  border:0!important;border-radius:24px!important;overflow:hidden;
  box-shadow:0 34px 90px rgba(15,18,24,.28)
}
body.mb-modern .modal-header{border-bottom:1px solid var(--mb-line);padding:1.25rem 1.5rem}
body.mb-modern .modal-body{padding:1.5rem}
body.mb-modern .modal-footer{border-top:1px solid var(--mb-line)}

/* Tables */
body.mb-modern .table-responsive{border:1px solid var(--mb-line);border-radius:16px;box-shadow:var(--mb-shadow-sm);overflow:hidden}
body.mb-modern table{margin-bottom:0!important}
body.mb-modern thead{background:var(--mb-wine)!important;color:#fff}
body.mb-modern thead th{color:#fff!important;border:0!important;padding:1rem!important;font-size:.82rem;letter-spacing:.025em}
body.mb-modern tbody td{padding:.88rem 1rem!important;border-color:var(--mb-line)!important;color:#485363}
body.mb-modern tbody tr:hover{background:#fff8f8}

/* Service / price / location links */
body.mb-modern a[href*="mikro-bayi/"]:not(.nav-link):not(.list-group-item),
body.mb-modern a[href*="mikro-yazilim/"]:not(.nav-link):not(.list-group-item){text-decoration-thickness:1px;text-underline-offset:3px}
body.mb-modern .badge{border-radius:999px;padding:.45rem .7rem;font-weight:600}

/* Footer */
body.mb-modern footer{margin-top:0!important}
body.mb-modern footer .footer-main{
  margin-top:70px!important;
  padding:70px 0 52px;
  background:
    radial-gradient(circle at 10% 10%,rgba(165,15,27,.22),transparent 28%),
    linear-gradient(135deg,#11151c,#1d222b 60%,#2a1115)!important;
  border-top:1px solid rgba(255,255,255,.06);
}
body.mb-modern footer .footer-main img{max-width:260px;height:auto!important}
body.mb-modern footer h2{font-size:15px!important;text-transform:uppercase;letter-spacing:.08em;color:#fff!important;margin-bottom:1.15rem}
body.mb-modern footer h2::after{display:none!important}
body.mb-modern footer p,
body.mb-modern footer li,
body.mb-modern footer a{color:rgba(255,255,255,.72)!important;font-size:13.5px;line-height:1.75}
body.mb-modern footer ul{padding-left:0;list-style:none}
body.mb-modern footer li{margin-bottom:.4rem}
body.mb-modern footer a:hover{color:#fff!important;transform:translateX(2px)}
body.mb-modern footer .social-icon a{
  width:38px;height:38px;display:inline-flex;align-items:center;justify-content:center;
  border:1px solid rgba(255,255,255,.14);border-radius:10px;background:rgba(255,255,255,.055)
}
body.mb-modern footer .social-icon a:hover{background:var(--mb-red);border-color:var(--mb-red);transform:translateY(-2px)}
body.mb-modern footer>.bg-dark{background:#0b0e13!important;border-radius:0!important;box-shadow:none!important}
body.mb-modern footer small{text-transform:none!important;letter-spacing:.005em}

/* Floating buttons */
body.mb-modern .whatsapp_float,
body.mb-modern .float,
body.mb-modern [class*="whatsapp"] a,
body.mb-modern .call-now-button{
  filter:drop-shadow(0 8px 16px rgba(0,0,0,.2));
}
.mb-back-to-top{
  position:fixed;right:22px;bottom:94px;z-index:1010;width:43px;height:43px;
  display:flex;align-items:center;justify-content:center;border:1px solid rgba(255,255,255,.22);
  border-radius:12px;background:rgba(42,3,6,.92);color:#fff;box-shadow:var(--mb-shadow-sm);
  opacity:0;visibility:hidden;transform:translateY(8px);transition:var(--mb-transition);cursor:pointer
}
.mb-back-to-top.is-visible{opacity:1;visibility:visible;transform:translateY(0)}
.mb-back-to-top:hover{background:var(--mb-red);transform:translateY(-2px)}

/* Home page polish */
body.mb-page-home #mikro_yazilim_kampanya{padding:72px 0}
body.mb-page-home #mikro_yazilim_kampanya .row{align-items:stretch}
body.mb-page-home #mikro_yazilim_kampanya img{object-fit:cover}
body.mb-page-home #about .row{align-items:center}
body.mb-page-home #about img{box-shadow:var(--mb-shadow-md)}
body.mb-page-home section:last-of-type{position:relative}

/* Product pages */
body.mb-page-product .gradient-banner p{max-height:320px;overflow:auto;padding-right:8px;scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.35) transparent}
body.mb-page-product [id*="Ana-Paket"],
body.mb-page-product [id*="ek-Paket"],
body.mb-page-product [id*="icerik"]{background:linear-gradient(180deg,#fff,var(--mb-surface-soft))}

/* Location pages */
body.mb-page-location .gradient-banner p{max-height:300px;overflow:auto;padding-right:8px;scrollbar-width:thin}
body.mb-page-location section[id*="Mikro-bayi"] .container,
body.mb-page-location section[id*="mikro"] .container{position:relative}

/* Legal / text-heavy pages */
body.mb-page-legal #main-content,
body.mb-page-content #main-content{background:linear-gradient(180deg,#fff,var(--mb-surface-soft))}
body.mb-page-legal #main-content>.container,
body.mb-page-content #main-content>.container{max-width:980px}

/* Responsive */
@media (max-width:1199.98px){
  body.mb-modern .navbar .nav-link{padding:12px 8px!important;font-size:11.5px!important}
  body.mb-modern .navbar a>img{max-width:180px!important}
}
@media (max-width:991.98px){
  html{scroll-padding-top:78px}
  body.mb-modern .top-bar{display:none!important}
  body.mb-modern .navbar{border-radius:0 0 16px 16px!important;padding:.45rem .15rem!important}
  body.mb-modern .navbar .navbar-collapse{
    margin-top:.55rem;padding:.75rem;background:#fff;border:1px solid var(--mb-line);
    border-radius:16px;box-shadow:var(--mb-shadow-md);max-height:calc(100vh - 96px);overflow-y:auto
  }
  body.mb-modern .navbar .navbar-nav{align-items:stretch;gap:3px}
  body.mb-modern .navbar .nav-link{font-size:13px!important;padding:12px 13px!important}
  body.mb-modern .dropdown-menu{position:static!important;border-radius:14px!important;box-shadow:none!important;background:var(--mb-surface-soft)!important;margin:.35rem 0 .7rem!important}
  body.mb-modern .dropdown-menu .mega-content{padding-left:.4rem!important;padding-right:.4rem!important}
  body.mb-modern .dropdown-menu .row>[class*="col-"]{padding-top:.65rem!important;padding-bottom:.65rem!important}
  body.mb-modern .gradient-banner{min-height:auto;padding:65px 0 125px!important}
  body.mb-modern .gradient-banner .row{min-height:auto}
  body.mb-modern .gradient-banner .row>[class*="col-md-6"]:first-child,
  body.mb-modern .gradient-banner .row>[class*="col-md-6"]:last-child{flex:0 0 100%;max-width:100%;width:100%!important}
  body.mb-modern .gradient-banner .row>[class*="col-md-6"]:last-child{margin-bottom:32px}
  body.mb-modern .gradient-banner h1,
  body.mb-modern .gradient-banner h2{text-align:center!important;font-size:clamp(2.1rem,8vw,3.4rem)!important;margin-left:auto;margin-right:auto}
  body.mb-modern .gradient-banner p{text-align:center!important;margin-left:auto;margin-right:auto;max-height:none!important;overflow:visible!important}
  body.mb-modern .gradient-banner .row>[class*="col-md-6"]:first-child{text-align:center!important}
  .mb-hero-eyebrow{margin-left:auto;margin-right:auto}
  .mb-trust-chips{justify-content:center}
  body.mb-modern .gradient-banner img.img-fluid{max-height:320px;width:min(90%,480px)!important}
  body.mb-modern .carousel-indicators{justify-content:center!important;margin-right:0!important;margin-bottom:28px!important}
  body.mb-modern .pull-top{margin-top:-70px}
}
@media (max-width:767.98px){
  body.mb-modern .section:not(.gradient-banner),
  body.mb-modern section.bg-light,
  body.mb-modern section.bg-gray{padding-top:62px;padding-bottom:62px}
  body.mb-modern .container{padding-left:20px;padding-right:20px}
  body.mb-modern h2{font-size:1.8rem}
  body.mb-modern .gradient-banner{padding-top:52px!important}
  body.mb-modern .gradient-banner h1,
  body.mb-modern .gradient-banner h2{font-size:2.25rem!important;line-height:1.1!important}
  body.mb-modern .gradient-banner p{font-size:.96rem!important;line-height:1.68!important}
  body.mb-modern .gradient-banner img.img-fluid{max-height:270px;padding:12px;border-radius:22px}
  .mb-trust-chip{font-size:10.5px}
  body.mb-modern footer .footer-main{padding:55px 0 40px}
  body.mb-modern footer .footer-main .col-6{width:100%;margin-top:1.8rem!important}
  .mb-back-to-top{right:14px;bottom:84px}
}
@media (max-width:479.98px){
  body.mb-modern .navbar a>img{max-width:155px!important;max-height:52px!important}
  body.mb-modern .gradient-banner h1,
  body.mb-modern .gradient-banner h2{font-size:1.95rem!important}
  .mb-trust-chips{gap:6px}
  .mb-trust-chip{padding:6px 8px}
  body.mb-modern .card-body{padding:1.1rem}
}

@media (prefers-reduced-motion:reduce){
  body.mb-modern *,body.mb-modern *::before,body.mb-modern *::after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}
}

/* Final visual refinements */
body.mb-modern .navbar .btn-success,
body.mb-modern .navbar .btn-primary{
  background:linear-gradient(135deg,var(--mb-wine),var(--mb-red))!important;
  border-color:transparent!important;
  color:#fff!important;
  box-shadow:0 8px 20px rgba(111,8,16,.18)!important;
}
body.mb-modern .pull-top h3{font-weight:700!important;color:var(--mb-ink)!important}
body.mb-modern .gradient-banner .carousel-indicators{
  position:absolute!important;
  left:0!important;right:0!important;bottom:-44px!important;
  margin:0!important;padding:0!important;
  justify-content:center!important;
}
body.mb-modern .gradient-banner .carousel-indicators button{margin:0 3px!important;padding:0!important}
body.mb-modern .gradient-banner p{max-height:none!important;overflow:visible!important}

@media (max-width:991.98px){
  body.mb-modern .gradient-banner .row>[class*="col-md-6"]:first-child{order:1!important}
  body.mb-modern .gradient-banner .row>[class*="col-md-6"]:last-child{order:2!important;margin-top:34px;margin-bottom:0!important}
  body.mb-modern .gradient-banner .carousel-indicators{bottom:-58px!important}
}

/* =========================================================
   NAVBAR + FOOTER REGRESSION FIX — 2026-07-16
   Markup and interactions are intentionally untouched.
   ========================================================= */

/* The empty Bootstrap brand node must not reserve horizontal space. */
body.mb-modern .navbar .navbar-brand:empty{
  display:none!important;
  margin:0!important;
  padding:0!important;
}

/* Keep the navigation in one row and let the CTA remain at the far right. */
body.mb-modern .navbar>.container-fluid{
  flex-wrap:nowrap!important;
}
body.mb-modern #navbar-content{
  min-width:0;
}
body.mb-modern #navbar-content>.navbar-nav{
  min-width:0;
}
body.mb-modern #navbar-content>.btn,
body.mb-modern #navbar-content>button{
  margin-left:auto!important;
  flex:0 0 auto;
}

/* Bootstrap must own the desktop/mobile visibility boundary. */
@media (min-width:992px){
  body.mb-modern .navbar-expand-lg .navbar-toggler{
    display:none!important;
  }
  body.mb-modern .navbar-expand-lg .navbar-collapse{
    display:flex!important;
  }
}

@media (max-width:991.98px){
  body.mb-modern .navbar-toggler{
    display:inline-flex!important;
    flex:0 0 44px;
    margin-left:auto;
  }
}

/* Footer logo needs a light brand-safe surface on the dark footer. */
body.mb-modern footer .footer-main .block{
  text-align:center;
}
body.mb-modern footer .footer-main .block>a:first-child{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:min(100%,292px);
  padding:15px 18px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:18px;
  background:#fff;
  box-shadow:0 16px 38px rgba(0,0,0,.22);
}
body.mb-modern footer .footer-main .block>a:first-child img{
  display:block!important;
  width:100%!important;
  max-width:250px!important;
  height:auto!important;
  margin:0!important;
  object-fit:contain;
}
body.mb-modern footer .footer-main .social-icon{
  margin:20px 0 0!important;
  padding:0!important;
  text-align:center!important;
}

@media (max-width:991.98px){
  body.mb-modern footer .footer-main .col-md-12.col-lg-4{
    text-align:center;
  }
}


/* =========================================================
   MEGA MENU MEDIA REGRESSION FIX — 2026-07-16 r3
   Product artwork keeps its native 16:9 canvas and is never
   treated as the primary navbar logo.
   ========================================================= */
@media (min-width:992px){
  body.mb-modern .navbar .dropdown-menu .card{
    height:auto!important;
    min-height:0!important;
    align-self:flex-start;
  }
  body.mb-modern .navbar .dropdown-menu .card img{
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    height:138px!important;
    max-height:none!important;
    padding:8px 12px!important;
    margin:0!important;
    object-fit:contain!important;
    object-position:center!important;
    background:#fff!important;
  }
  body.mb-modern .navbar .dropdown-menu .card-body{
    min-height:108px;
  }
}

@media (max-width:991.98px){
  body.mb-modern .navbar .dropdown-menu .card{
    height:auto!important;
  }
  body.mb-modern .navbar .dropdown-menu .card img{
    width:100%!important;
    max-width:100%!important;
    height:150px!important;
    max-height:none!important;
    padding:8px 12px!important;
    object-fit:contain!important;
    object-position:center!important;
    background:#fff!important;
  }
}

/* Use all available desktop width for the five-part Mikro Yazılım mega menu. */
@media (min-width:1320px){
  body.mb-modern .navbar .navbar-nav>li.dropdown-mega:nth-child(2)>.dropdown-menu .row{
    display:grid!important;
    grid-template-columns:1.08fr 1.2fr 1.2fr 1.1fr .95fr;
    align-items:start;
    column-gap:8px;
  }
  body.mb-modern .navbar .navbar-nav>li.dropdown-mega:nth-child(2)>.dropdown-menu .row>[class*="col-"]{
    width:auto!important;
    max-width:none!important;
    min-width:0;
  }
}

/* =========================================================
   MOBILE NAVBAR LAYOUT FIX — 2026-07-16 r4
   The collapsed navigation must occupy its own full-width row.
   Header markup and Bootstrap behaviours remain unchanged.
   ========================================================= */
@media (max-width:991.98px){
  body.mb-modern .navbar>.container-fluid{
    display:flex!important;
    flex-wrap:wrap!important;
    align-items:center!important;
    width:100%!important;
    max-width:100%!important;
  }

  body.mb-modern .navbar>.container-fluid>a:first-child{
    order:1;
    display:flex!important;
    align-items:center;
    flex:0 1 auto;
    min-width:0;
    max-width:calc(100% - 62px);
  }

  body.mb-modern .navbar>.container-fluid>a:first-child>img{
    width:auto!important;
    max-width:min(205px,100%)!important;
    height:auto!important;
  }

  body.mb-modern .navbar-toggler{
    order:2;
    margin-left:auto!important;
  }

  body.mb-modern #navbar-content{
    order:3;
    flex:0 0 100%!important;
    flex-basis:100%!important;
    width:100%!important;
    min-width:100%!important;
    max-width:100%!important;
    margin:.65rem 0 0!important;
    padding:.7rem!important;
    overflow-x:hidden!important;
    box-sizing:border-box;
  }

  body.mb-modern #navbar-content.collapse:not(.show){
    display:none!important;
  }

  body.mb-modern #navbar-content.collapsing,
  body.mb-modern #navbar-content.show{
    display:block!important;
    width:100%!important;
  }

  body.mb-modern #navbar-content>.navbar-nav,
  body.mb-modern #navbar-content>.navbar-nav:first-child{
    display:flex!important;
    flex-direction:column!important;
    width:100%!important;
    max-width:100%!important;
    margin:0!important;
  }

  body.mb-modern #navbar-content>.navbar-nav.ms-auto{
    display:none!important;
  }

  body.mb-modern #navbar-content>form{
    display:block!important;
    width:100%!important;
    margin:.55rem 0 0!important;
  }

  body.mb-modern #navbar-content>form .input-group,
  body.mb-modern #navbar-content>form .btn{
    width:100%!important;
  }

  body.mb-modern #navbar-content>form .btn{
    min-height:46px;
    border-radius:12px!important;
  }

  body.mb-modern .navbar .nav-item,
  body.mb-modern .navbar .nav-link{
    width:100%;
    max-width:100%;
  }

  body.mb-modern .navbar .nav-link{
    display:flex!important;
    align-items:center;
    justify-content:space-between;
    white-space:normal!important;
    text-align:left;
  }

  body.mb-modern .navbar .dropdown-menu{
    position:static!important;
    float:none!important;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    inset:auto!important;
    transform:none!important;
    overflow:hidden!important;
  }

  body.mb-modern .navbar .dropdown-menu .mega-content,
  body.mb-modern .navbar .dropdown-menu .container-fluid,
  body.mb-modern .navbar .dropdown-menu .row,
  body.mb-modern .navbar .dropdown-menu .row>[class*="col-"]{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
  }

  body.mb-modern .navbar .dropdown-menu .row{
    display:block!important;
    margin:0!important;
  }

  body.mb-modern .navbar .dropdown-menu .row>[class*="col-"]{
    padding-left:.45rem!important;
    padding-right:.45rem!important;
  }

  body.mb-modern .navbar .dropdown-menu p,
  body.mb-modern .navbar .dropdown-menu a,
  body.mb-modern .navbar .dropdown-menu .card-text{
    overflow-wrap:anywhere;
    word-break:normal;
  }
}

@media (max-width:479.98px){
  body.mb-modern .navbar{
    padding:.42rem .1rem!important;
  }
  body.mb-modern .navbar .container-fluid{
    padding-left:12px!important;
    padding-right:12px!important;
  }
  body.mb-modern .navbar>.container-fluid>a:first-child>img{
    max-width:190px!important;
    max-height:54px!important;
  }
  body.mb-modern #navbar-content{
    padding:.6rem!important;
    border-radius:14px;
  }
}