/* ==========================================================================
   modal.css — картын дэлгэрэнгүй цонх (бүх хуудсанд нийтлэг). Accent-аар өнгөждөг.
   ========================================================================== */
.dmodal{position:fixed;inset:0;z-index:200;display:flex;align-items:center;justify-content:center;padding:24px;
  background:rgba(8,18,26,.62);
  opacity:0;pointer-events:none;visibility:hidden;
  /* visibility-ийг opacity-ийн дараа hidden болгоно: backdrop-filter:blur нь opacity:0 байсан ч ажиллах Chrome алдааг таслана */
  transition:opacity .6s ease,visibility 0s linear .6s}
/* backdrop-filter-ийг ЗӨВХӨН нээлттэй үед — хаалттай үед хуудас шилжих snapshot-д "leak" хийхгүй */
.dmodal.open{opacity:1;pointer-events:auto;visibility:visible;
  backdrop-filter:blur(9px);-webkit-backdrop-filter:blur(9px);
  transition:opacity .6s ease,visibility 0s}
/* дарж болохыг илтгэх — карт болон тусгай товчлуурууд */
[data-modal]{cursor:pointer}
.detail-link{cursor:pointer}
.dmodal-card{position:relative;width:min(660px,100%);max-height:90vh;overflow:auto;background:var(--cream);
  border-radius:24px;box-shadow:0 44px 110px rgba(8,18,26,.55);
  transform:translateY(8px) scale(.99);filter:blur(4px);opacity:.4;
  transition:transform .7s cubic-bezier(.22,.61,.36,1),filter .6s ease,opacity .6s ease;
  font-family:'Onest',system-ui,sans-serif}
.dmodal.open .dmodal-card{filter:none;opacity:1}
.dmodal.open .dmodal-card{transform:none}
.dmodal-media{position:relative}
.dmodal-img{width:100%;height:270px;object-fit:cover;display:block}
.dmodal-media::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 55%,rgba(var(--accent-rgb),.45))}
.dmodal-x{position:absolute;top:16px;right:16px;z-index:2;width:42px;height:42px;border-radius:50%;border:none;cursor:pointer;
  background:rgba(255,255,255,.92);color:var(--ink);display:grid;place-items:center;box-shadow:0 6px 18px rgba(0,0,0,.25);transition:transform .25s,background .25s}
.dmodal-x:hover{transform:rotate(90deg) scale(1.06);background:#fff}
.dmodal-x svg{width:18px;height:18px;stroke:currentColor;stroke-width:2.4;fill:none}
.dmodal-body{padding:30px 32px 34px}
.dmodal-eyebrow{display:inline-block;color:var(--accent-2);font-size:12px;font-weight:700;letter-spacing:2.6px;text-transform:uppercase}
.dmodal-title{font-family:'Onest',system-ui,sans-serif;font-weight:700;font-size:clamp(24px,3.4vw,34px);color:var(--ink);margin:12px 0 16px;line-height:1.12;letter-spacing:-.02em}
.dmodal-desc{color:var(--ink-soft);font-size:15.5px;line-height:1.82;margin-bottom:20px}
.dmodal-facts{display:flex;flex-wrap:wrap;gap:9px;margin-bottom:26px}
.dmodal-facts span{background:var(--accent-soft);color:var(--accent-deep);border-radius:30px;padding:8px 15px;font-size:13px;font-weight:600}
.dmodal-cta{display:inline-flex;align-items:center;gap:9px}
@media(max-width:680px){
  .dmodal{padding:14px}
  .dmodal-img{height:200px}
  .dmodal-body{padding:24px 22px 28px}
}
@media(prefers-reduced-motion:reduce){
  .dmodal,.dmodal-card{transition:none}
}