/* ==========================================================================
   DIAMOND OCHIR — GLASS LIGHT THEME (FULL CSS, FIXED + RESPONSIVE)
   Цагаан суурь • Улаан accent • Зөөлөн шилэн картууд
   ========================================================================== */

/* ----------------------------- TOKENS ----------------------------------- */
:root{
  --bg-1:#f7f8fc;           /* page bg */
  --bg-2:#ffffff;           /* section/card bg */
  --ink:#0b1220;            /* main text */
  --muted:#667085;          /* secondary text */
  --line:rgba(16,24,40,.08);

  --accent:#e41e2b;         /* red */
  --accent-2:#c11226;
  --accent-3:#ff6161;
  --ok:#16d39a;
  --warn:#ffd166;

  --glass:rgba(255,255,255,.92);
  --glass-strong:#ffffff;
  --glass-border:rgba(16,24,40,.10);
  --blur:10px;

  --shadow:0 8px 24px rgba(16,24,40,.10);
  --shadow-sm:0 6px 16px rgba(16,24,40,.08);
  --shadow-hover:0 16px 36px rgba(16,24,40,.16);

  --radius:16px;
  --radius-lg:20px;
}

/* ------------------------- GLOBAL / BODY -------------------------------- */
html,body{height:100%;}
body{
  font-family:'Poppins',system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
  color:var(--ink);
  background: var(--bg-1);
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}
p{color:var(--muted); line-height:1.7; margin-bottom:0;}
a{color:var(--accent); text-decoration:none;}
a:hover{color:var(--accent-2);}

/* --------------------------- HEADER / NAV ------------------------------- */
header{
  position:fixed;        /* absolute биш */
  top:0; left:0; right:0;
  z-index:9999;
  height:80px;
  transition:all .3s ease;
  display:flex; align-items:center;
}
header .navbar{ width:100%; padding:0 0; }

.background-header{
  background:var(--bg-2);
  -webkit-backdrop-filter: blur(var(--blur));
  backdrop-filter: blur(var(--blur));
  border-bottom:1px solid var(--line);
  box-shadow:var(--shadow-sm);
}
/* контент давхцахаас сэргийлнэ */
header.background-header + .page-content{ padding-top:80px; }
.page-content{ padding-top:80px; }

/* Харин HERO байгаа хуудсууд дээр padding-ийг 0 болгоно */
body.has-hero .page-content{ padding-top:0; }
.navbar .navbar-brand{ display:flex; align-items:center; gap:8px; }
.navbar .navbar-brand h2{
  margin:0;
  letter-spacing:.3px;
  font-weight:900;
  font-size: clamp(18px, 2.6vw, 28px);
  line-height:1.1;
  white-space:nowrap;
  color:#111;
}
.navbar .navbar-brand h2 em{
  font-style:normal;
  background: linear-gradient(90deg,var(--accent),var(--accent-3));
  -webkit-background-clip:text; background-clip:text; color:transparent;
}

#navbarResponsive{ z-index:999; }
.navbar-collapse{ text-align:initial; }
.navbar .navbar-nav .nav-item{margin:0 12px;}
.navbar .navbar-nav a.nav-link{
  text-transform:capitalize; font-size:15px; font-weight:600;
  letter-spacing:.3px; color:#1f2937; transition:.25s; margin-top:5px; position:relative;
}
.navbar .navbar-nav a.nav-link:hover,
.navbar .navbar-nav .active>.nav-link{ color:var(--accent); }
.navbar .navbar-nav a.nav-link:after{
  content:""; position:absolute; left:0; bottom:-6px; height:2px; width:0%;
  background:linear-gradient(90deg,var(--accent),var(--accent-3));
  transition:width .28s ease;
}
.navbar .navbar-nav a.nav-link:hover:after,
.navbar .navbar-nav .active>.nav-link:after{width:100%;}

/* Toggler – илүү цэвэр */
.navbar .navbar-toggler{
  border:1px solid var(--glass-border); background:#fff;
  height:38px; width:42px; border-radius:10px;
  display:flex; align-items:center; justify-content:center;
}
.navbar .navbar-toggler-icon{ background-image:none; position:relative; width:20px; height:2px; background:#111; }
.navbar .navbar-toggler-icon:before,
.navbar .navbar-toggler-icon:after{ content:""; position:absolute; left:0; right:0; height:2px; background:#111; }
.navbar .navbar-toggler-icon:before{ top:-6px; } .navbar .navbar-toggler-icon:after{ top:6px; }

/* ------------------------------ BANNER ---------------------------------- */
.banner{position:relative; text-align:left; padding-top:80px;}
.banner-item{
  position:relative; padding:300px 0;
  background-size:cover; background-position:center; overflow:hidden;
}
.banner-item:after{
  content:""; position:absolute; inset:0;
  background:linear-gradient(120deg, rgba(255,255,255,.12) 0%, rgba(255,255,255,.0) 50%, rgba(0,0,0,.25) 100%);
  mix-blend-mode:normal;
}
.banner .text-content{
  position:absolute; top:40%; left:8%; transform:translateY(-50%);
  z-index:2; color:#111; max-width:720px;
}
.banner .text-content h4{
  color:var(--accent-2);
  font-size: clamp(14px, 1.8vw, 22px);
  text-transform:uppercase; font-weight:800; margin-bottom:10px; letter-spacing:.2em;
}
.banner .text-content h2{
  color:#111; font-size: clamp(26px, 4.2vw, 56px);
  line-height:1.1; font-weight:900; text-transform:none;
}
@media (max-width:768px){
  .banner-item{padding:200px 0;}
  .banner .text-content{left:6%; top:45%; max-width:92%;}
}

/* Owl dots */
.owl-banner .owl-dots{
  display:flex; justify-content:center; gap:10px;
  position:absolute; left:50%; transform:translateX(-50%); bottom:24px; z-index:3;
}
.owl-banner .owl-dots .owl-dot{
  width:10px; height:10px; border-radius:8px; background:rgba(0,0,0,.25);
  border:1px solid rgba(0,0,0,.2); transition:.2s;
}
.owl-banner .owl-dots .owl-dot.active{ background:var(--accent); transform:scale(1.1); }

/* -------------------------- SECTION HEADING ----------------------------- */
.section-heading{
  text-align:left; margin-bottom:60px; border-bottom:1px solid var(--line); padding-bottom:16px;
}
.section-heading h2{ font-size:28px; font-weight:800; color:#111; margin-bottom:15px; }
.section-heading a{
  float:right; margin-top:-28px; text-transform:uppercase; font-size:12px; font-weight:800;
  color:var(--accent);
}

/* --------------------------- GLASS UTILITY ------------------------------ */
.glass{
  background:var(--bg-2);
  -webkit-backdrop-filter:none; backdrop-filter:none;
  border:1px solid var(--glass-border);
  box-shadow:var(--shadow);
  border-radius:var(--radius);
}

/* ------------------------- FEATURED PRODUCTS ---------------------------- */
.latest-products{ margin-top:80px; }
.product-item{
  position:relative; overflow:hidden; border:none; border-radius:var(--radius);
  background:var(--bg-2); box-shadow:var(--shadow-sm);
  transition:transform .25s ease, box-shadow .25s ease, background .25s ease;
}
.product-item:hover{ transform:translateY(-6px); box-shadow:var(--shadow-hover); }
.product-item img{
  width:100%; height:230px; object-fit:cover; display:block;
  border-top-left-radius:var(--radius); border-top-right-radius:var(--radius);
}
.product-item .down-content{ padding:18px 20px 22px; position:relative; }
.product-item .down-content h4{ color:#0f172a; font-size:18px; margin-bottom:10px; font-weight:800; }
.product-item .down-content h6{ color:#111; font-weight:800; font-size:18px; margin-bottom:10px; }
.product-item .down-content p{ color:var(--muted); margin-bottom:14px; }
.product-item .down-content small strong{ color:#3f4754; }
.product-item .down-content i{ color:var(--accent); }
/* subtle sheen */
.product-item:before{
  content:""; position:absolute; inset:auto -30% 60% -30%;
  height:120%; transform:translateY(120%) rotate(10deg);
  background:linear-gradient(to right, transparent, rgba(255,255,255,.5), transparent);
  transition:transform .6s ease;
}
.product-item:hover:before{ transform:translateY(-10%) rotate(10deg); }

/* ------------------------------ ABOUT ----------------------------------- */
.best-features{ margin-top:50px; }
.best-features .container .row{ border-bottom:1px solid var(--line); padding-bottom:60px; }
.best-features img{ width:100%; overflow:hidden; border-radius:var(--radius); box-shadow:var(--shadow-sm); }
.best-features h4{ font-size:17px; color:#0f172a; margin-bottom:20px; }
.best-features p{ margin-bottom:25px; color:var(--muted); }
.best-features ul.featured-list li{ display:block; margin-bottom:10px; }
.best-features ul.featured-list li a{
  font-size:14px; color:var(--ink); font-weight:500; transition:.2s; position:relative; padding-left:18px;
}
.best-features ul.featured-list li a:before{
  content:""; width:6px; height:6px; border-radius:50%;
  background:var(--accent); position:absolute; left:0; top:8px;
}
.best-features ul.featured-list li a:hover{ color:var(--accent); }

/* -------------------------- CALL TO ACTION ------------------------------ */
.call-to-action .inner-content{
  margin-top:60px; padding:30px; background:var(--bg-2);
  border-radius:var(--radius); position:relative; box-shadow:var(--shadow);
}
.call-to-action .inner-content:before{
  content:""; position:absolute; inset:0; z-index:0; border-radius:var(--radius);
  padding:1px; background:linear-gradient(135deg, rgba(228,30,43,.35), rgba(16,24,40,.06));
  -webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite:xor; mask-composite:exclude;
}
.call-to-action .inner-content > *{ position:relative; z-index:1; }
.call-to-action .inner-content h4{ font-size:17px; color:#0f172a; margin-bottom:15px; font-weight:800; }
.call-to-action .inner-content p{ color:var(--muted); }
.call-to-action .inner-content .col-md-4{ text-align:right; }

/* ------------------------------ BUTTONS --------------------------------- */
a.filled-button,
.contact-form button.filled-button{
  --_g:linear-gradient(90deg,var(--accent),var(--accent-3));
  background:var(--_g); color:#fff; font-size:14px; text-transform:capitalize; font-weight:800;
  padding:10px 20px; border-radius:14px; display:inline-block;
  transition: transform .18s ease, box-shadow .18s ease, filter .18s ease, background-position .3s ease;
  border:1px solid rgba(16,24,40,.10); box-shadow:0 10px 20px rgba(228,30,43,.20);
  background-size:200% 100%;
}
a.filled-button:hover,
.contact-form button.filled-button:hover{
  transform:translateY(-2px); background-position:100% 0%;
  box-shadow:0 16px 36px rgba(228,30,43,.28); filter:saturate(112%);
}
a.filled-button:active{ transform:translateY(0); }

/* ------------------------------ CARDS / ETC ----------------------------- */
.team-member,
.service-item .down-content,
.contact-form,
.accordion li,
footer .inner-content{
  background:var(--bg-2);
  border:1px solid var(--glass-border);
  border-radius:var(--radius);
  box-shadow:var(--shadow-sm);
}
.team-member img, .services-item-image{ border-top-left-radius:var(--radius); border-top-right-radius:var(--radius); display:block; }
.team-member .down-content{ padding:30px; text-align:center; }
.team-member .down-content h4{ color:#0f172a; }
.team-member .down-content span{ color:var(--accent); }

/* ---------------------------- FORMS/TABLES ------------------------------ */
.contact-form select, .contact-form .form-control, .contact-form textarea{
  font-size:14px; width:100%;
  background:#fff; color:#111; border:1px solid var(--glass-border);
  border-radius:12px; margin-bottom:30px; height:44px; line-height:42px;
}
.contact-form textarea{ min-height:120px; max-height:180px; height:120px; line-height:1.6; }
.contact-form select:focus, .contact-form .form-control:focus, .contact-form textarea:focus{
  outline:none; border-color:rgba(228,30,43,.55); box-shadow:0 0 0 4px rgba(228,30,43,.15);
}
.contact-form button.filled-button{ border:none; cursor:pointer; }

/* ------------------------- PRODUCTS / FILTERS --------------------------- */
.products{ margin-top:100px; }
.products .filters{
  text-align:center; border-bottom:1px solid var(--line);
  padding-bottom:10px; margin-bottom:60px;
}
.products .filters li{
  text-transform:uppercase; font-size:13px; font-weight:800; color:#121212;
  display:inline-block; margin:0 10px; transition:.3s; cursor:pointer;
}
.products .filters ul li.active, .products .filters ul li:hover{ color:var(--accent); }
.dropdown-menu{ border-radius:10px; background:var(--bg-2); border:1px solid var(--glass-border); }
.dropdown-item{ color:#111; padding:.5rem 1.5rem; }
.dropdown-item:hover{ background:rgba(16,24,40,.04); }

/* Pagination */
.products ul.pages{ margin-top:30px; text-align:center; }
.products ul.pages li{ display:inline-block; margin:0 2px; }
.products ul.pages li a{
  width:44px; height:44px; display:inline-block; line-height:42px; font-size:15px; font-weight:800;
  border:1px solid var(--glass-border); color:#111; background:#fff; transition:.2s;
}
.products ul.pages li a:hover,
.products ul.pages li.active a{ background:var(--accent); border-color:var(--accent); color:#fff; }

/* ------------------------------- FOOTER --------------------------------- */
footer{ text-align:center; }
footer .inner-content{
  border-top:1px solid var(--line); margin-top:60px; padding:46px 0;
  background:transparent; border:none; box-shadow:none;
}
footer .inner-content p{ color:#4b5563; text-transform:uppercase; }
footer .inner-content p a{ color:var(--accent); margin-left:3px; }

/* ----------------------------- PAGE HEADING ----------------------------- */
.page-heading{
  padding:210px 0 130px; text-align:center;
  background-position:center center; background-repeat:no-repeat; background-size:cover;
  position:relative;
}
.page-heading:before{
  content:""; position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(228,30,43,.10) 0%, rgba(0,0,0,.35) 100%);
}
.page-heading .container{ position:relative; z-index:2; }
.page-heading .text-content h4{ color:var(--accent); font-size:22px; text-transform:uppercase; font-weight:800; margin-bottom:15px; }
.page-heading .text-content h2{ color:#111; font-size: clamp(28px, 6vw, 62px); letter-spacing:.02em; }

/* ------------------------------ MISC / UTIL ----------------------------- */
.modal-dialog{ margin-top:10%; }
.section-background{ background:#f5f7fb; }
.section{ padding:30px 0; }
.accordion{ margin-left:30px; }
.accordion a{ cursor:pointer; font-size:17px; color:#0f172a!important; margin-bottom:20px; transition:.3s; }
.accordion a:hover, .accordion a.active{ color:var(--accent)!important; }
.accordion li .content{ display:none; margin-top:10px; }
.accordion li:first-child{ border-top:1px solid var(--line); }
.accordion li{ border-bottom:1px solid var(--line); padding:15px 0; }

/* ---------------------------- RESPONSIVE -------------------------------- */
@media (max-width:1200px){
  .navbar .navbar-nav .nav-item{ margin:0 8px; }
}
@media (max-width:992px){
  /* brand + toggle нэг мөрт */
  .navbar .navbar-brand{ position:static; }
  #navbarResponsive{
    z-index:99999; position:absolute; top:80px; left:0; right:0; width:100%; text-align:center;
    background:var(--bg-2); box-shadow:var(--shadow); border-top:1px solid var(--line);
  }
  .navbar .navbar-nav .nav-item{ border-bottom:1px solid var(--line); }
  .navbar .navbar-nav .nav-item:last-child{ border-bottom:none; }
  .navbar .navbar-nav a.nav-link{ padding:15px 0; color:#111!important; }
  .navbar .navbar-nav .active>.nav-link{ color:var(--accent)!important; }
  .product-item .down-content h4{ margin-bottom:10px; }
  .product-item .down-content h6{ margin-bottom:20px; }
}
@media (max-width:768px){
  .section-heading a{ float:none; margin-top:0; display:block; margin-bottom:20px; }
  .best-features .left-content{ margin-bottom:30px; }
  .call-to-action .inner-content{ text-align:center; }
  .call-to-action .inner-content .filled-button{ width:100%; margin-top:20px; }
}
@media (max-width:576px){
  /* зай талбайг сайн барих */
  .navbar .navbar-brand h2{ font-size:20px; }
  #google_translate_element{ display:none; }
  .product-item img{ height:200px; }
  .product-item .down-content{ padding:16px; }
}

/* ----------------------- REDUCED MOTION RESPECT ------------------------- */
@media (prefers-reduced-motion: reduce){
  *{animation:none!important; transition:none!important;}
}

/* ------------------------------ PRELOADER ------------------------------- */
#preloader{
  background: linear-gradient(120deg, #ffffff 0%, #fff5f5 100%);
  color:#111; position:fixed; inset:0; z-index:9999999;
}
#preloader .jumper{
  position:absolute; inset:0; margin:auto; width:50px; height:50px;
}
#preloader .jumper>div{
  background: var(--accent); width:50px; height:50px; border-radius:100%;
  animation: jumper 1.2s linear infinite; opacity:.9;
}
#preloader .jumper>div:nth-child(2){ animation-delay:.4s; }
#preloader .jumper>div:nth-child(3){ animation-delay:.8s; }
@keyframes jumper{
  0%{ transform:scale(0); opacity:0;}
  10%{ opacity:1; }
  100%{ transform:scale(1); opacity:0;}
}

/* ===== Reveal Animation Utilities (Diamond Ochir) ===== */

/* Base state — САНААТАЙГААР арай удаан болгосон (.85s/.75s) */
.reveal {
  opacity: 0;
  transform: translate3d(0,20px,0);
  transition:
    opacity .85s cubic-bezier(.2,.65,.25,1),
    transform .85s cubic-bezier(.2,.65,.25,1);
  will-change: transform, opacity;
}

/* Directions */
.reveal-up    { transform: translate3d(0,22px,0); }
.reveal-down  { transform: translate3d(0,-22px,0); }
.reveal-left  { transform: translate3d(22px,0,0); }
.reveal-right { transform: translate3d(-22px,0,0); }
.reveal-zoom  { transform: scale(.96); }

/* When visible */
.reveal.in { opacity: 1; transform: none; }

/* Stagger container */
.stagger-parent { --stagger-step: 110ms; } /* удаан болгосон */
.stagger-parent .stagger{
  opacity:0; transform: translate3d(0,18px,0);
  transition:
    opacity .75s cubic-bezier(.2,.65,.25,1),
    transform .75s cubic-bezier(.2,.65,.25,1);
  will-change: transform, opacity;
}
.stagger-parent.in .stagger{ opacity:1; transform:none; }
.stagger-parent.in .stagger:nth-child(1){ transition-delay: calc(var(--stagger-step)*1); }
.stagger-parent.in .stagger:nth-child(2){ transition-delay: calc(var(--stagger-step)*2); }
.stagger-parent.in .stagger:nth-child(3){ transition-delay: calc(var(--stagger-step)*3); }
.stagger-parent.in .stagger:nth-child(4){ transition-delay: calc(var(--stagger-step)*4); }
.stagger-parent.in .stagger:nth-child(5){ transition-delay: calc(var(--stagger-step)*5); }
.stagger-parent.in .stagger:nth-child(6){ transition-delay: calc(var(--stagger-step)*6); }

/* Quick delay helpers */
.delay-1 { transition-delay: .12s; }
.delay-2 { transition-delay: .22s; }
.delay-3 { transition-delay: .32s; }
.delay-4 { transition-delay: .42s; }

/* Banner text entrance (initial load) */
.banner .text-content{
  opacity:0; transform: translate3d(0,22px,0);
  animation: bannerIn .9s .25s cubic-bezier(.2,.65,.25,1) forwards;
}
@keyframes bannerIn{ to{ opacity:1; transform:none; } }

/* Section heading underline sweep */
.section-heading h2{ position:relative; display:inline-block; }
.section-heading h2:after{
  content:""; position:absolute; left:0; bottom:-10px; height:2px; width:100%;
  background:linear-gradient(90deg,var(--accent),var(--accent-3));
  transform:scaleX(0); transform-origin:left;
  transition:transform .7s cubic-bezier(.2,.65,.25,1);
}
.section-heading.in h2:after{ transform:scaleX(1); }

/* Products: elevate a little more when revealed */
.product-item.reveal.in{ box-shadow:var(--shadow-hover); transform: translateY(-2px); }

/* Respect reduced motion */
@media (prefers-reduced-motion: reduce){
  .reveal, .stagger-parent .stagger, .banner .text-content,
  .section-heading h2:after{
    transition:none !important; animation:none !important;
    opacity:1 !important; transform:none !important;
  }
}
/* ----- Navbar toggler visibility by breakpoint ----- */
@media (min-width: 992px){           /* ≥ lg: бүрэн цэс, toggler нууж */
  .navbar .navbar-toggler{ display:none !important; }
}
@media (max-width: 991.98px){        /* < lg: toggler харуулж, цэсийг блок болгож */
   .navbar .navbar-toggler{ display:flex; } /* < lg үед харагдана */
  #navbarResponsive{
    position:absolute; top:74px; left:0; right:0; background:#fff;
    box-shadow:var(--shadow); border-top:1px solid var(--line);
  }

  #navbarResponsive .navbar-nav{ padding:8px 0; }
  #navbarResponsive .nav-item{ border-bottom:1px solid var(--line); }
  #navbarResponsive .nav-item:last-child{ border-bottom:none; }
  #google_translate_element{ display:none; } /* мобайл дээр орчуулагчийг нуух (хэрэв цэсэнд оруулахгүй бол) */
}
@media (min-width:992px){
  .navbar .navbar-toggler{ display:none !important; } /* ≥ lg үед нуух */
}
/* ===== Header Deluxe (DO) ===== */
.do-nav{ padding:10px 0; }
header.background-header{ background:rgba(255,255,255,.9); -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px); }
header.background-header .do-nav{ box-shadow:0 8px 24px rgba(16,24,40,.06); }

.do-logo{ display:inline-flex; align-items:baseline; gap:.35rem; }
.do-logo strong{ font-weight:900; letter-spacing:.2px; color:#111; }
.do-logo em{
  font-style:normal; font-weight:800;
  background:linear-gradient(90deg,var(--accent),var(--accent-3));
  -webkit-background-clip:text; background-clip:text; color:transparent;
  position:relative;
}
.do-logo em:after{ /* бага зэргийн гялбаа */
  content:""; position:absolute; inset:auto -10% 2px -10%; height:2px;
  background:linear-gradient(90deg,transparent,rgba(228,30,43,.35),transparent);
  filter:blur(.6px);
}

/* nav links */
.do-navlinks{ position:relative; align-items:center; }
.do-navlinks .nav-link{
  padding:22px 14px; font-weight:700; color:#0b1220; opacity:.85; transition:.25s;
}
.do-navlinks .nav-item.active .nav-link,
.do-navlinks .nav-link:hover{ color:var(--accent); opacity:1; }

/* идэвхтэй underline-пилл, зөөлөн шилжилттэй */
.do-active-dot{
  position:absolute; bottom:10px; height:3px; width:28px;
  background:linear-gradient(90deg,var(--accent),var(--accent-3));
  border-radius:999px; box-shadow:0 6px 16px rgba(228,30,43,.25);
  transform:translateX(-9999px); transition:all .35s cubic-bezier(.2,.65,.25,1);
}

/* toggler */
.navbar .navbar-toggler{
  border:1px solid var(--glass-border); background:#fff; height:40px; width:44px; border-radius:12px;
  display:none; align-items:center; justify-content:center; box-shadow:var(--shadow-sm);
}
.navbar .navbar-toggler-icon{ background-image:none; width:20px; height:2px; background:#111; position:relative; }
.navbar .navbar-toggler-icon:before,
.navbar .navbar-toggler-icon:after{ content:""; position:absolute; left:0; right:0; height:2px; background:#111; }
.navbar .navbar-toggler-icon:before{ top:-6px; } .navbar .navbar-toggler-icon:after{ top:6px; }

/* Collapse нээгдэхэд “slide+fade” */
#navbarResponsive{ transform-origin:top; }
#navbarResponsive.collapsing{ transition:transform .35s ease, opacity .35s ease; transform:scaleY(.9); opacity:.5; }
#navbarResponsive.collapse.show{ animation:doDrop .32s cubic-bezier(.2,.65,.25,1); }
@keyframes doDrop{ from{ transform:translateY(-6px); opacity:.0; } to{ transform:none; opacity:1; } }

/* Custom Translate */
.do-translate{ display:flex; flex-direction:column; align-items:flex-end; margin-left:18px; }
.do-tr-btn{
  display:inline-flex; align-items:center; gap:8px;
  border:1px solid var(--glass-border); background:#fff; height:40px; padding:0 12px; border-radius:12px;
  box-shadow:var(--shadow-sm); font-weight:700; color:#111;
}
.do-tr-btn .fa-globe{ opacity:.7; }
.do-tr-btn:focus{ outline:none; box-shadow:0 0 0 4px rgba(228,30,43,.12); }

.do-tr-menu{
  position:absolute; margin-top:6px; right:12px; min-width:180px;
  background:var(--bg-2); border:1px solid var(--glass-border); border-radius:14px; box-shadow:var(--shadow);
  padding:6px; display:none;
}
.do-tr-menu.show{ display:block; animation:menuIn .18s ease; }
@keyframes menuIn{ from{ transform:translateY(-6px); opacity:0;} to{ transform:none; opacity:1;} }
.do-tr-menu button{
  width:100%; text-align:left; border:0; background:transparent; padding:10px 10px; border-radius:10px; font-weight:600;
}
.do-tr-menu button:hover{ background:rgba(16,24,40,.05); color:var(--accent); }

.do-tr-powered{ margin-top:6px; font-size:11px; color:#6b7280; }
.sr-only{ position:absolute !important; left:-9999px !important; width:1px; height:1px; overflow:hidden; }

/* breakpoints: toggler гарч ирэх */
@media (min-width:992px){ .navbar .navbar-toggler{ display:none !important; } }
@media (max-width:991.98px){
  .navbar .navbar-toggler{ display:flex; }
  #navbarResponsive{
    position:absolute; top:80px; left:0; right:0; background:#fff; box-shadow:var(--shadow);
    border-top:1px solid var(--line);
  }
  .do-translate{ align-items:center; margin:12px auto 10px; }
  .do-tr-powered{ display:none; }
}/* Logo ↔ Menu зайг томруулна (desktop) */
@media (min-width: 999px){
  #do-header .do-navlinks{            /* menu-гийн UL */
    margin-left: 28px !important;     /* ← энэ утгыг 24–40px хооронд тааруулж болно */
  }
  #do-header .navbar-brand{
    margin-right: 20px !important;    /* логоны баруун талын зай */
  }
}


/* Sticky үед бага зэрэг агших эффект */
#do-header.is-scrolled .do-logo strong{ letter-spacing:.1px; }
#do-header.is-scrolled{ transition:transform .25s ease, background .25s ease; }
/* ==== HEADER: 1 line + middle gap gone + smaller nav ==== */

/* Container-ийг flex болгон гурвыг нэг мөрт: [лого] | [цэс] | [translate] */
.do-header-grid{
  display:flex;
  align-items:center;
  gap:16px;
}

/* nav блок дунд хоосон 1fr гаргахгүй, агшиж тэлнэ */
#navbarResponsive{ flex:1 1 auto; }

/* mx-lg-auto center-лээд хоосон зай үүсгэдэг — дарж өгнө */
@media (min-width:992px){
  .navbar-nav.mx-lg-auto{ margin-left:8px !important; margin-right:8px !important; }
}

/* Цэсийг 1 мөрт, ойрхон зайтай, wrap хийхгүй болгоно */
.do-navlinks{
  display:flex;
  align-items:center;
  flex-wrap:nowrap;       /* мөр солигдохгүй */
  gap:18px;
  margin:0; padding:0;
}
.do-navlinks .nav-item{ margin:0 !important; }
.do-navlinks .nav-link{
  padding:18px 10px;
  font-size:15px;
  white-space:nowrap;     /* НЭГ МӨРТ барина (About Us, 24/7 Support wrap хийхгүй) */
  margin-top:0;           /* өмнөх rule-ийг цуцална */
}

/* Лого баруун талын сул зайг багасгана */
.navbar-brand{ margin-right:12px !important; }

/* Translate-г баруун зах руу шахаж, илүү жижигрүүлнэ */
.do-translate{ margin-left:12px; flex:0 0 auto; }
.do-tr-btn{ height:36px; padding:0 10px; font-size:13px; }
.do-tr-label{ font-size:12px; }
.do-tr-powered{ display:none !important; } /* “Powered by …” текстийг нуув */

/* Desktop дээр header өндөр, padding-ийг бага зэрэг шахна */
.do-nav{ padding:6px 0; }
header{ height:74px; }

/* Илүү нарийн дэлгэц дээр арай их шахалт (хэрэв эвэрхийрвэл 13px болж агшина) */
@media (max-width:1399.98px){
  .do-navlinks .nav-link{ font-size:13px; padding:10px 6px; }
}
