/* MONGOLIA POOLS — horizon stepa */
.mn-page { --color-primary:#2563eb; --color-accent:#dc2626; --color-bg:#f7faff; --mn-ink:#16233b; --mn-muted:#6b7891;
  background:var(--color-bg); color:var(--mn-ink); font-family:'Roboto',system-ui,sans-serif; margin:-1.5rem -12px 0; padding-bottom:52px; }
.mn-container { width:100%; max-width:1040px; margin:0 auto; padding:0 16px; }
.mn-breadcrumb { max-width:1040px; margin:0 auto; padding:14px 16px 0; font-size:12px; color:var(--mn-muted); }
.mn-breadcrumb a { color:var(--color-primary); }
.mn-hero { position:relative; height:200px; margin-top:14px; overflow:hidden; display:flex; align-items:center; }
.mn-sky { position:absolute; inset:0 0 42% 0; background:linear-gradient(180deg,#60a5fa,var(--color-primary)); }
.mn-field { position:absolute; inset:58% 0 0 0; background:linear-gradient(180deg,#d9e6c8,#b6cfa0); }
.mn-hero-inner { position:relative; width:100%; max-width:1040px; margin:0 auto; padding:0 16px; }
.mn-kicker { margin:0 0 6px; font-family:'Oswald',sans-serif; font-size:12px; letter-spacing:.28em; color:#fff; }
.mn-h1 { font-family:'Oswald',sans-serif; font-weight:500; font-size:clamp(24px,5.6vw,42px); line-height:1.06; margin:0 0 6px; color:#fff;
  text-shadow:0 2px 8px rgba(22,35,59,.4); text-transform:uppercase; }
.mn-date { margin:0; font-size:12.5px; color:rgba(255,255,255,.9); }
.mn-gers { display:flex; flex-wrap:wrap; justify-content:center; gap:16px; padding:26px 0 0; }
.mn-ger { position:relative; width:clamp(72px,19vw,98px); height:clamp(72px,19vw,98px); border-radius:50%; background:#fff;
  border:4px solid var(--color-primary); display:inline-flex; align-items:center; justify-content:center; opacity:0; transform:scale(.88);
  animation:mn-in .45s ease forwards; box-shadow:0 6px 14px rgba(37,99,235,.18); }
.mn-ger::before { content:''; position:absolute; inset:8px; border-radius:50%;
  background:repeating-conic-gradient(var(--color-accent) 0 4deg, transparent 4deg 30deg); opacity:.35; }
.mn-ger-face { position:relative; font-family:'Oswald',sans-serif; font-size:clamp(28px,8vw,40px); color:var(--mn-ink); }
.mn-ger-empty { border-color:#c8d3e4; } .mn-ger-empty .mn-ger-face { color:#b6c1d3; }
@keyframes mn-in { to{opacity:1;transform:scale(1);} }
.mn-meta { margin:18px 0 0; text-align:center; font-size:12.5px; color:var(--mn-muted); }
.mn-knot { height:22px; margin:22px auto; max-width:220px;
  background-image:linear-gradient(90deg,transparent,var(--color-accent),transparent),url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='22' height='22'%3E%3Cpath d='M4 4h14v14H4z' fill='none' stroke='%232563eb' stroke-width='2'/%3E%3Cpath d='M11 4v14M4 11h14' stroke='%232563eb' stroke-width='2'/%3E%3C/svg%3E");
  background-size:100% 2px,22px 22px; background-position:center,center; background-repeat:no-repeat,repeat-x; }
.mn-desc { margin:0 0 8px; font-size:14px; color:var(--mn-muted); text-align:center; }
.mn-section { margin-top:34px; }
.mn-head { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:12px; margin-bottom:12px; }
.mn-h2 { font-family:'Oswald',sans-serif; font-weight:500; font-size:clamp(19px,4.4vw,26px); text-transform:uppercase; letter-spacing:.06em; margin:0 0 12px; }
.mn-head .mn-h2 { margin-bottom:0; }
.mn-filter { display:flex; flex-wrap:wrap; gap:8px; }
.mn-filter select { height:38px; padding:0 12px; border:1px solid #c8d3e4; border-radius:8px; background:#fff; font-family:inherit; font-size:13px; }
.mn-btn { display:inline-flex; align-items:center; height:38px; padding:0 16px; border:1px solid var(--color-primary); border-radius:8px;
  background:var(--color-primary); color:#fff; font-family:'Oswald',sans-serif; font-size:12px; letter-spacing:.1em; text-transform:uppercase; cursor:pointer; }
.mn-btn:hover { background:#1d4ed8; color:#fff; } .mn-btn-ghost { background:#fff; color:var(--color-primary); }
.mn-hint { margin:0 0 8px; font-size:11.5px; color:var(--mn-muted); }
.mn-timeline { position:relative; padding:18px 0 8px; }
.mn-track { position:absolute; left:0; right:0; top:50%; height:3px; background:linear-gradient(90deg,#c8d3e4,var(--color-primary),#c8d3e4); }
.mn-stops { position:relative; list-style:none; margin:0; padding:0 4px 10px; display:flex; gap:22px; overflow-x:auto; scroll-snap-type:x mandatory; }
.mn-stop { flex:0 0 120px; scroll-snap-align:start; display:flex; flex-direction:column; align-items:center; gap:6px; text-align:center; }
.mn-stop-date { font-size:11.5px; font-weight:700; color:var(--mn-muted); }
.mn-dot { width:15px; height:15px; border-radius:50%; background:#fff; border:4px solid var(--color-accent); }
.mn-stop-num { font-family:'Oswald',sans-serif; font-size:22px; letter-spacing:.1em; color:var(--color-primary); }
.mn-stop-day { font-size:11px; color:var(--mn-muted); }
.mn-empty { background:#fff; border:1px dashed #c8d3e4; border-radius:8px; padding:40px 20px; text-align:center; }
.mn-empty-mark { display:inline-block; width:46px; height:46px; border-radius:50%; border:4px solid var(--color-primary); margin-bottom:14px; }
.mn-empty h3 { font-family:'Oswald',sans-serif; font-size:18px; margin:0 0 6px; }
.mn-empty p { margin:0; font-size:13px; color:var(--mn-muted); }
.mn-pagination { margin-top:12px; font-size:13px; color:var(--mn-muted); }
.mn-pagination .page-link { border-radius:8px; border:1px solid #c8d3e4; color:var(--mn-ink); font-weight:600; }
.mn-pagination .page-item.active .page-link { background:var(--color-primary); border-color:var(--color-primary); color:#fff; }
.mn-cards { display:grid; gap:12px; }
.mn-card { background:#fff; border:1px solid #dbe4f2; border-radius:8px; padding:18px 16px; }
.mn-card-label { display:block; font-size:10.5px; font-weight:700; letter-spacing:.18em; text-transform:uppercase; color:var(--mn-muted); }
.mn-card-value { display:block; margin:6px 0 3px; font-family:'Oswald',sans-serif; font-size:20px; color:var(--color-primary); }
.mn-card-note { display:block; font-size:11.5px; color:var(--mn-muted); }
.mn-note { margin:18px 0 0; font-size:13px; color:var(--mn-muted); }
.mn-note a { color:var(--color-primary); font-weight:700; }
@media (min-width:768px) { .mn-cards { grid-template-columns:repeat(3,1fr); } }
@media (min-width:992px) { .mn-page { margin-left:-24px; margin-right:-24px; } }
@media (max-width:575.98px) { .mn-hero { height:168px; } .mn-gers { gap:10px; } .mn-section { margin-top:26px; } }
@media (prefers-reduced-motion:reduce) { .mn-ger { animation:none; opacity:1; transform:none; } }