/* Дижитал Эрэг ХХК — үндсэн загвар
   Өнгөө эндээс солино */
:root{
  --head-a:#1C78A8;         /* толгойн градиент: цэнхэр */
  --head-b:#23A0A0;         /*                   цайвар ногоон-цэнхэр */
  --head-c:#58B26E;         /*                   ногоон */
  --stage-a:#0E3F66;        /* нүүр хэсгийн дэвсгэр */
  --stage-b:#1A6E93;
  --stage-c:#2C9C9C;
  --accent:#1AA3A6;         /* товч, идэвхтэй таб */
  --accent-dark:#12888B;
  --link:#2D8BD0;
  --ink:#2B3338;
  --muted:#65727A;
  --line:#E3E8EB;
  --paper:#FFFFFF;
  --bg:#F3F6F8;
  --cal-top:#6B6F73;
  --gold:#FFD27A;
  --head-font:"Roboto Condensed","Arial Narrow",Arial,sans-serif;
  --body-font:"Roboto","Segoe UI",Arial,sans-serif;
  --shadow:0 2px 6px rgba(10,40,60,.10),0 8px 24px rgba(10,40,60,.10);
  --meander:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='48' height='48'%3E%3Cpath d='M0 44h8V4h36v32H16V12h20v16H24v-8' fill='none' stroke='white' stroke-opacity='.22' stroke-width='3'/%3E%3C/svg%3E");
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--body-font);font-size:16px;line-height:1.6}
a{color:var(--link)}
h1,h2,h3,h4{margin:0;line-height:1.2;text-wrap:balance}
p{margin:0}
.wrap{max-width:1240px;margin-inline:auto;padding-inline:clamp(16px,3vw,32px)}
:focus-visible{outline:3px solid var(--gold);outline-offset:2px}
[hidden]{display:none!important}
.hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}

/* ---------- Толгой ---------- */
.top{position:relative;background:linear-gradient(90deg,var(--head-a) 0%,var(--head-b) 55%,var(--head-c) 100%);color:#fff;border-top:3px solid var(--head-a)}
.top::after{content:"";position:absolute;inset:0;background:var(--meander);-webkit-mask-image:linear-gradient(90deg,transparent 35%,#000 85%);mask-image:linear-gradient(90deg,transparent 35%,#000 85%);pointer-events:none}
.bar{position:relative;z-index:1;max-width:1600px;margin-inline:auto;padding:14px clamp(16px,3vw,32px);display:flex;align-items:center;justify-content:space-between;gap:20px}
.brand{display:flex;align-items:center;gap:14px;color:#fff;text-decoration:none;min-width:0}
.brand svg{flex:none}
.logo{flex:none;display:block;height:46px;width:auto;max-width:200px;object-fit:contain;border-radius:6px}
.bname{font:700 24px/1 var(--head-font);letter-spacing:.02em;display:flex;flex-direction:column;gap:4px}
.bname small{font:500 10px/1 var(--body-font);letter-spacing:.14em;opacity:.8}
.sep{width:1px;height:38px;background:rgba(255,255,255,.4)}
.tagline{font:700 15px/1.25 var(--head-font);letter-spacing:.03em;text-transform:uppercase;max-width:22ch}
.links{display:flex;gap:4px}
.links a{color:#fff;text-decoration:none;font-weight:500;font-size:15px;padding:8px 14px;border-radius:3px}
.links a:hover{background:rgba(255,255,255,.16)}
/* "Эрүүл мэнд" унждаг цэс (JS-гүй: hover / гарын товчоор focus) */
.dd{position:relative}
.ddtop{display:inline-flex;align-items:center;gap:6px}
.ddtop svg{width:12px;height:12px;fill:none;stroke:currentColor;stroke-width:1.8}
.ddmenu{position:absolute;right:0;top:100%;z-index:20;min-width:250px;display:none;flex-direction:column;padding:6px;background:var(--paper);border-radius:6px;box-shadow:var(--shadow)}
.dd:hover .ddmenu,.dd:focus-within .ddmenu{display:flex}
.links .ddmenu a{color:var(--ink);padding:9px 12px}
.links .ddmenu a:hover{background:var(--bg)}
/* Жижиг дэлгэцэнд бусад холбоос нуугдаж, зөвхөн "Эрүүл мэнд" үлдэнэ (дарахад тооцоолуур нээгдэнэ) */
@media (max-width:1000px){.links > a,.ddmenu{display:none!important}.ddtop svg{display:none}.links .ddtop{border:1px solid rgba(255,255,255,.6)}}
@media (max-width:560px){.sep,.tagline{display:none}.bname{font-size:20px}}

/* ---------- Слайд (цэсний доор, бүтэн өргөнөөр) ---------- */
/* Тохиргоо (админ → Нүүр хэсэг): .fade|.flow хэлбэр, .h-sm|md|lg өндөр, .fit-auto|fill|contain, .p-sm|md|lg бүтээгдэхүүний хэмжээ.
   .smedia нь слайдын зураг (img) эсвэл видео (video): доорх бүх дүрэм хоёуланд нь ижил үйлчилнэ. */
.slider{--sh:clamp(260px,36vw,560px);--ps:.78;position:relative;overflow:hidden;touch-action:pan-y;background:var(--stage-a)}
.slider.h-sm{--sh:clamp(200px,26vw,380px)}
.slider.h-lg{--sh:clamp(320px,46vw,720px)}
.slider.p-sm{--ps:.6}
.slider.p-lg{--ps:.92}

/* Бүтэн зураг: зургууд давхарлаж, уусаж солигдоно */
.slider.fade{display:grid}
.fade .slide{grid-area:1/1;position:relative;opacity:0;visibility:hidden;transition:opacity .7s ease,visibility .7s;background:var(--bg,var(--stage-a))}
.fade .slide.on{opacity:1;visibility:visible}
.fade .slide .smedia{position:relative;z-index:1;display:block;width:100%;height:var(--sh);object-fit:cover}
/* Бүтэн харуулах (.fit-contain) ба Автомат (.fit-auto): тайрахгүй; хоосон хэсэгт ижил зургийн бүдгэрүүлсэн хувилбар
   (слайдад арын өнгө сонгосон бол тэр өнгө). Автомат үед зураг ачаалагдаж байхад ч тайрахгүй, зөвхөн
   слайдаас өргөн зураг (main.js .fitw) дүүргэнэ. */
.fade.fit-contain .slide .smedia,.fade.fit-auto .slide .smedia{object-fit:contain}
.fade.fit-auto .slide.fitw .smedia{object-fit:cover}
.fade.fit-contain .slide:not([data-bg])::before,.fade.fit-auto .slide:not(.fitw):not([data-bg])::before{content:"";position:absolute;inset:-40px;
  background:var(--img,none) center/cover no-repeat;filter:blur(30px) brightness(.72) saturate(1.15)}
/* Слайд бүрийн гар тохируулга: харагдах хэсэг (--px/--py), томруулалт (--z), байрлал (data-fit нь ерөнхийг дарна) */
.fade .slide{overflow:hidden}
.fade .slide .smedia{object-position:var(--px,50%) var(--py,50%);transform:scale(var(--z,1));transform-origin:var(--px,50%) var(--py,50%)}
.fade .slide[data-fit=cover] .smedia{object-fit:cover}
.fade .slide[data-fit=contain] .smedia{object-fit:contain}
.fade .slide[data-fit=contain]:not([data-bg])::before{content:"";position:absolute;inset:-40px;
  background:var(--img,none) center/cover no-repeat;filter:blur(30px) brightness(.72) saturate(1.15)}

/* Урсдаг: бүтээгдэхүүний зураг дээрээс (next) голд (cur) орж ирээд баруун доод буланд (prev) жижгэрч, гарна.
   Дэвсгэр нь идэвхтэй слайдын өнгө (--sbg, main.js). Байрлал нь слайдын хэмжээнээс (cq*). */
.slider.flow{height:var(--sh);container-type:size;background:var(--sbg,#22313f);transition:background-color 1s ease}
.flow::before{content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(circle at 64% 48%,rgba(255,255,255,.2),transparent 55%),linear-gradient(180deg,rgba(0,0,0,0) 45%,rgba(0,0,0,.28))}
.flow .slide{position:absolute;inset:0}
.flow .slide .smedia{position:absolute;left:64%;top:52%;z-index:1;height:calc(var(--sh) * var(--ps));width:auto;max-width:56%;object-fit:contain;
  transform:translate(-50%,-50%) translate(var(--x,0px),var(--y,0px)) scale(calc(var(--s,1) * var(--z,1)));opacity:var(--o,1);
  filter:blur(var(--b,0px)) drop-shadow(0 22px 24px rgba(0,0,0,.35));
  transition:transform 1s cubic-bezier(.65,0,.25,1),opacity 1s ease,filter 1s ease}
.flow .slide[data-pos=cur] .smedia{z-index:3}
.flow .slide[data-pos=next]{--x:-12cqw;--y:-60cqh;--s:.36;--o:.35;--b:5px}
.flow .slide[data-pos=prev]{--x:28cqw;--y:32cqh;--s:.24}
.flow .slide[data-pos=prev] .smedia{z-index:2}
.flow .slide[data-pos=after]{--x:-16cqw;--y:-110cqh;--s:.2;--o:0;--b:8px}
.flow .slide[data-pos=before]{--x:40cqw;--y:70cqh;--s:.1;--o:0}

/* Тайлбар, товч */
.scap{position:absolute;inset:0;z-index:4;display:flex;align-items:flex-end;padding:clamp(20px,4vw,48px) 0 clamp(40px,5vw,60px);color:#fff}
.fade .scap{background:linear-gradient(90deg,rgba(8,30,50,.75) 0%,rgba(8,30,50,.35) 45%,rgba(8,30,50,0) 75%)}
.flow .scap{align-items:center;opacity:0;visibility:hidden;transition:opacity .6s ease .25s,visibility .6s}
.flow .slide.on .scap{opacity:1;visibility:visible}
.flow .scap h2{max-width:14ch}
.flow .scap p{max-width:34ch}
.scap .wrap{width:100%;display:grid;gap:12px;justify-items:start}
/* Хажуугийн сумтай давхцахгүй (сум 640px-ээс дээш л харагдана) */
@media (min-width:641px){.slider .scap .wrap{padding-inline:max(clamp(16px,3vw,32px),80px)}}
.scap h2{font:700 clamp(22px,3.2vw,42px)/1.12 var(--head-font);text-transform:uppercase;max-width:22ch;text-shadow:0 1px 3px rgba(0,0,0,.3)}
.scap p{max-width:52ch;font-size:clamp(14px,1.4vw,17px);text-shadow:0 1px 2px rgba(0,0,0,.35)}
.snav{position:absolute;top:50%;transform:translateY(-50%);z-index:6;width:44px;height:44px;border:0;border-radius:50%;display:grid;place-items:center;
  background:rgba(255,255,255,.85);color:var(--ink);cursor:pointer;box-shadow:var(--shadow)}
.snav:hover{background:#fff}
.snav svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.snav.prev{left:clamp(8px,2vw,24px)}
.snav.next{right:clamp(8px,2vw,24px)}
.sdots{position:absolute;left:0;right:0;bottom:14px;z-index:6;display:flex;justify-content:center;gap:8px}
.sdot{width:10px;height:10px;padding:0;border:0;border-radius:5px;background:rgba(255,255,255,.55);cursor:pointer;transition:width .3s}
.sdot.on{width:26px;background:#fff}
@media (max-width:640px){
  .snav{display:none}
  .fade .scap{background:linear-gradient(0deg,rgba(8,30,50,.8) 0%,rgba(8,30,50,0) 75%)}
  .scap h2{max-width:none}
  /* Урсдаг: тайлбар дээр, бүтээгдэхүүн доод талд */
  .slider.flow{--sh:clamp(380px,110vw,520px)}
  .flow .scap{align-items:flex-start;padding-top:22px}
  .flow .scap h2,.flow .scap p{max-width:none}
  .flow .slide .smedia{left:50%;top:66%;max-width:70%;height:calc(var(--sh) * var(--ps) * .62)}
  .flow .slide[data-pos=next]{--x:-26cqw;--y:-34cqh;--s:.3}
  .flow .slide[data-pos=prev]{--x:32cqw;--y:20cqh;--s:.26}
}
@media (prefers-reduced-motion:reduce){.slide,.sdot,.slider.flow,.flow .slide .smedia,.flow .scap{transition:none}}

/* ---------- Нүүр хэсэг (3 багана) ---------- */
.stage{position:relative;background:
  radial-gradient(circle at 18% 30%,rgba(120,200,230,.35),transparent 45%),
  radial-gradient(circle at 85% 80%,rgba(80,190,160,.30),transparent 50%),
  linear-gradient(135deg,var(--stage-a) 0%,var(--stage-b) 50%,var(--stage-c) 100%);overflow:hidden}
.stage canvas{position:absolute;inset:0;width:100%;height:100%;display:block}
.grid3{position:relative;max-width:1600px;margin-inline:auto;padding:48px clamp(16px,3vw,32px) 56px;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.25fr) minmax(0,1.05fr);gap:28px;align-items:start}

/* Том дэлгэцэнд: мэдээ зүүн талд, гарчиг баруун талд. Жижиг дэлгэцэнд HTML дарааллаар (гарчиг эхэнд) харагдана. */
@media (min-width:1181px){
  .grid3{grid-template-columns:minmax(0,1.05fr) minmax(0,1.25fr) minmax(0,1fr);grid-template-areas:"news mid intro"}
  .grid3 > .panel{grid-area:news}
  .grid3 > .mid{grid-area:mid}
  .grid3 > .intro{grid-area:intro}
}
.intro{color:#fff;padding-top:28px;display:grid;gap:20px;text-shadow:0 1px 3px rgba(0,0,0,.25)}
.intro h1{font:700 clamp(28px,3vw,40px)/1.12 var(--head-font);text-transform:uppercase;letter-spacing:.01em}
.intro h1 em{font-style:normal;color:var(--gold);display:block}
.intro .lead{font-size:16px;text-align:justify;opacity:.95}
.ctas{display:flex;flex-wrap:wrap;gap:10px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;font:500 15px var(--body-font);padding:11px 22px;border-radius:3px;border:0;cursor:pointer;text-decoration:none;background:var(--accent);color:#fff;text-shadow:none;transition:background .15s}
.btn:hover{background:var(--accent-dark)}
.btn.line{background:transparent;box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.85)}
.btn.line:hover{background:rgba(255,255,255,.14)}
.btn.full{width:100%;padding-block:13px;font-size:16px}
.btn[disabled]{opacity:.6;cursor:wait}

.clist{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.clist li{display:grid;grid-template-columns:22px 1fr;gap:10px;align-items:start;font-size:15px}
.clist svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;margin-top:2px}
.clist a{color:inherit;text-decoration:none;font-weight:500}
.clist a:hover{text-decoration:underline}
.intro .clist{background:rgba(5,30,50,.28);border:1px solid rgba(255,255,255,.18);border-radius:4px;padding:16px 18px;text-shadow:none}

/* Үйлчилгээний картууд */
.mid{display:grid;gap:24px}
/* Үйлчилгээний карт = шилэн хавтас (icon урд хананд) + нэр. Онгойх үед (.card:hover, :focus-visible, утсанд .open)
   урд хана урагш хазайж, доторх 3 карт сэнс шиг дэлгэгдэнэ. Дарахад #svcdlg-д дэлгэрэнгүй. */
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:20px 16px}
.card{position:relative;padding:34px 6px 8px;text-align:center;display:grid;justify-items:center;align-content:start;gap:14px;border-radius:12px;outline-offset:2px}
.card:hover,.card:focus-visible,.card.open{z-index:2}
.card[data-svc]{cursor:pointer}
.card h3{font:600 15px/1.3 var(--head-font);text-transform:uppercase;color:#fff;letter-spacing:.02em;text-shadow:0 1px 3px rgba(0,0,0,.35)}
.ring{width:84px;height:84px;border-radius:50%;border:2px solid var(--ic);display:grid;place-items:center;transition:background .18s ease}
.ring svg{width:42px;height:42px;fill:none;stroke:var(--ic);stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}

.fld{position:relative;display:block;width:150px;aspect-ratio:150/116;perspective:700px;transition:transform .5s cubic-bezier(.34,1.3,.64,1)}
/* Арын хана ба хавчуурга */
.fld-back{position:absolute;inset:12px 0 0;border-radius:12px;
  background:linear-gradient(165deg,color-mix(in srgb,var(--ic) 72%,#fff),color-mix(in srgb,var(--ic) 72%,#000));
  box-shadow:0 18px 30px -12px color-mix(in srgb,var(--ic) 55%,#000)}
.fld-back::before{content:"";position:absolute;left:0;top:-11px;width:44%;height:18px;border-radius:9px 9px 0 0;
  background:color-mix(in srgb,var(--ic) 72%,#fff)}
/* Доторх 3 карт: хаалттай үед хавтас дотор, онгойход дээш өргөгдөж дэлгэгдэнэ */
.fld-papers{position:absolute;inset:0}
.pp{position:absolute;left:50%;top:18%;width:46%;aspect-ratio:3/4;border-radius:6px;object-fit:cover;background:#fff;
  box-shadow:0 4px 12px rgba(0,0,0,.28);transition:transform .55s cubic-bezier(.34,1.45,.64,1)}
.pp.blank{background:
  linear-gradient(color-mix(in srgb,var(--ic) 65%,#fff),color-mix(in srgb,var(--ic) 65%,#fff)) 14% 14%/44% 9% no-repeat,
  repeating-linear-gradient(180deg,transparent 0 8px,#dfe5e8 8px 10px) 50% 78%/72% 52% no-repeat,#fff}
.pp.p0{transform:translate(-62%,12%) rotate(-6deg) scale(.9)}
.pp.p1{z-index:1;transform:translate(-50%,6%) scale(.92)}
.pp.p2{transform:translate(-38%,12%) rotate(6deg) scale(.9)}
/* Урд шилэн хана */
.fld-front{position:absolute;left:0;right:0;bottom:0;height:70%;z-index:2;display:grid;place-items:center;border-radius:12px;
  background:linear-gradient(170deg,color-mix(in srgb,var(--ic) 42%,transparent),color-mix(in srgb,var(--ic) 82%,#000 6%));
  -webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border:1px solid rgba(255,255,255,.45);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.55),0 10px 22px rgba(0,0,0,.28);
  transform-origin:50% 100%;transition:transform .5s cubic-bezier(.34,1.3,.64,1)}
.fld-front .ring{width:48px;height:48px;border-color:rgba(255,255,255,.85);background:rgba(255,255,255,.14)}
.fld-front .ring svg{width:26px;height:26px;stroke:#fff}
/* Онгойсон */
:is(.card:hover,.card:focus-visible,.card.open) .fld{transform:translateY(-4px) scale(1.04)}
:is(.card:hover,.card:focus-visible,.card.open) .fld-front{transform:rotateX(-34deg)}
:is(.card:hover,.card:focus-visible,.card.open) .pp.p0{transform:translate(-112%,-30%) rotate(-15deg);transition-delay:.04s}
:is(.card:hover,.card:focus-visible,.card.open) .pp.p1{transform:translate(-50%,-50%) scale(1.04)}
:is(.card:hover,.card:focus-visible,.card.open) .pp.p2{transform:translate(12%,-28%) rotate(14deg);transition-delay:.08s}
@media (prefers-reduced-motion:reduce){.fld,.fld-front,.pp{transition:none}}

/* Үйлчилгээний дэлгэрэнгүй цонх */
.svcdlg{width:min(720px,calc(100vw - 32px));max-height:calc(100dvh - 48px);padding:0;border:0;border-radius:4px;box-shadow:0 20px 60px rgba(5,30,50,.35);color:var(--ink);overflow:auto;overscroll-behavior:contain}
.svcdlg::backdrop{background:rgba(8,35,55,.6);backdrop-filter:blur(2px)}
.svcdlg[open]{animation:dlgIn .18s ease-out}
@keyframes dlgIn{from{opacity:0;transform:translateY(12px)}}
@media (prefers-reduced-motion:reduce){.svcdlg[open]{animation:none}}
.svcdlg .x{position:sticky;top:10px;float:right;margin:10px 10px 0 0;z-index:2;width:38px;height:38px;border-radius:50%;border:0;background:rgba(255,255,255,.92);box-shadow:0 1px 4px rgba(0,0,0,.18);cursor:pointer;display:grid;place-items:center}
.svcdlg .x svg{width:20px;height:20px;fill:none;stroke:#444;stroke-width:2;stroke-linecap:round}
.svcdlg .x:hover{background:#fff}
.sd{padding:28px clamp(20px,4vw,40px) 30px;display:grid;gap:20px}
.sd-head{display:flex;align-items:center;gap:18px;padding-right:36px}
.sd-head .ring{flex:none;width:72px;height:72px}.sd-head .ring svg{width:34px;height:34px}
.sd-head h2{font:700 24px/1.2 var(--head-font);text-transform:uppercase;color:#333;letter-spacing:.01em}
.sd-head .tags{display:block;margin-top:6px;font-size:11px;letter-spacing:.08em;color:var(--ic);font-weight:700}
.sd-body{display:grid;gap:12px;font-size:15px;line-height:1.65;color:#3A4449}
.sd-lead{font-size:16px;color:var(--ink)}
.sd-body ul{margin:0;padding:0;list-style:none;display:grid;gap:8px}
.sd-body li{position:relative;padding-left:26px}
.sd-body li::before{content:"";position:absolute;left:4px;top:.5em;width:9px;height:5px;border-left:2px solid var(--ic);border-bottom:2px solid var(--ic);transform:rotate(-45deg)}
.sd-price{font-size:15px;background:#F3F7F8;border-left:3px solid var(--ic);padding:10px 14px}
.sd-ctas{display:flex;flex-wrap:wrap;gap:10px;border-top:1px solid var(--line);padding-top:20px}
.btn.ghost{background:transparent;color:var(--accent-dark);box-shadow:inset 0 0 0 1.5px var(--accent)}
.btn.ghost:hover{background:rgba(26,163,166,.08)}
.gal{display:grid;gap:10px}
.gmain{background:#0D2233;border-radius:3px;overflow:hidden;aspect-ratio:16/10;display:grid}
.gmain .gv{grid-area:1/1;width:100%;height:100%;object-fit:contain;display:block;background:#0D2233}
.gthumbs{display:flex;gap:8px;overflow-x:auto;padding-bottom:2px}
.gt{position:relative;flex:none;width:78px;height:56px;padding:0;border:2px solid transparent;border-radius:3px;overflow:hidden;cursor:pointer;background:#0D2233;opacity:.7;transition:opacity .15s}
.gt.on{border-color:var(--ic);opacity:1}
.gt:hover{opacity:1}
.gt img,.gt video{width:100%;height:100%;object-fit:cover;display:block;pointer-events:none}
.gt .play{position:absolute;inset:0;margin:auto;width:0;height:0;border-left:14px solid rgba(255,255,255,.95);border-top:9px solid transparent;border-bottom:9px solid transparent;filter:drop-shadow(0 1px 2px rgba(0,0,0,.5))}
@media (max-width:560px){
  .svcdlg{width:100vw;max-width:100vw;max-height:100dvh;height:100dvh;border-radius:0;margin:0}
  .sd-head .ring{width:58px;height:58px}.sd-head .ring svg{width:28px;height:28px}
  .sd-head h2{font-size:20px}
  .sd-ctas .btn{flex:1 1 100%}
}

/* Хүсэлтийн маягт (нэвтрэх хайрцагны оронд) */
.formcard{background:var(--paper);border-radius:3px;box-shadow:var(--shadow);padding:30px clamp(20px,3vw,38px);display:grid;gap:14px}
.formcard h2{font:700 26px var(--body-font);text-align:center;color:#333}
.formcard .sub{text-align:center;color:var(--muted);font-size:14px;margin-top:-4px}
.fi{display:grid;grid-template-columns:44px 1fr;align-items:center;border:1px solid #C9D2D8;border-radius:3px;background:#fff}
.fi:focus-within{border-color:var(--accent);box-shadow:0 0 0 3px rgba(26,163,166,.18)}
.fi svg{width:20px;height:20px;justify-self:center;fill:none;stroke:#8A969D;stroke-width:1.8}
.fi input,.fi select{border:0;outline:0;font:inherit;font-size:15px;padding:12px 12px 12px 0;background:transparent;color:var(--ink);width:100%}
.formcard textarea{font:inherit;font-size:15px;border:1px solid #C9D2D8;border-radius:3px;padding:12px 14px;min-height:92px;resize:vertical;color:var(--ink)}
.formcard textarea:focus{outline:0;border-color:var(--accent);box-shadow:0 0 0 3px rgba(26,163,166,.18)}
/* Маягтыг нээх товч ба маягтын цонх */
.reqbtn{padding-block:16px;font-size:17px;box-shadow:var(--shadow)}
.reqbtn svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linejoin:round;stroke-linecap:round}
.formdlg{width:min(520px,calc(100vw - 32px))}
.formdlg .formcard{box-shadow:none;border-radius:0;padding-top:34px}
@media (max-width:560px){.formdlg{width:100vw}}
.note{font-size:14px;min-height:1.3em;text-align:center}
.note.ok{color:#178A5B}
.note.err{color:#C7462F}

/* Мэдээ, зарын самбар */
.panel{background:var(--paper);border-radius:3px;box-shadow:var(--shadow);padding:22px clamp(18px,2vw,26px) 26px;align-self:start}
.tabs{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid var(--line);background:#F7F9FA}
.tab{display:flex;align-items:center;justify-content:center;gap:10px;padding:16px 8px;border:0;background:transparent;font:400 15px var(--body-font);color:#555;cursor:pointer;border-bottom:3px solid transparent}
.tab svg{width:22px;height:22px;fill:none;stroke:#555;stroke-width:1.5}
.tab.on{color:#222;font-weight:500;border-bottom-color:var(--accent);background:#fff}
.cnt{font:700 11px var(--body-font);background:var(--accent);color:#fff;border-radius:10px;padding:2px 7px}
.pane{padding-top:22px}
/* Цаг агаар, валютын ханш (мэдээний самбарын дээд хэсэг; өгөгдлийг main.js /info-оос бөглөнө) */
.infobox{display:grid;gap:14px;margin-bottom:18px;padding-bottom:16px;border-bottom:1px solid var(--line)}
.wx{display:grid;grid-template-columns:auto 1fr;grid-template-areas:"ic main" "ic d";align-items:center;column-gap:14px;row-gap:2px}
.wx-ic{grid-area:ic;width:54px;height:54px;display:grid;place-items:center;border-radius:14px;
  background:linear-gradient(150deg,var(--head-a),var(--head-b))}
.wx-ic svg{width:36px;height:36px;fill:none;stroke:#fff;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.wx-ic svg .sun{stroke:var(--gold)}
.wx-main{grid-area:main;display:flex;align-items:baseline;gap:10px}
.wx-t{font:700 30px/1 var(--head-font);color:var(--ink);font-variant-numeric:tabular-nums}
.wx-city{font-size:13px;color:var(--muted);text-transform:uppercase;letter-spacing:.06em}
.wx-d{grid-area:d;font-size:14px;color:#3A4449}
.fx-h{display:block;font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin-bottom:8px}
.fx-h small{font-weight:500;text-transform:none;letter-spacing:0}
.fx-l{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:0}
.fx-l div{display:grid;gap:1px;padding:7px 10px;border-radius:8px;background:var(--bg)}
.fx-l dt{font-size:12px;font-weight:700;color:var(--accent-dark);letter-spacing:.04em}
.fx-l dd{margin:0;font-size:15px;font-weight:500;color:var(--ink);font-variant-numeric:tabular-nums}
.isrc{font-size:11.5px;color:var(--muted);line-height:1.5}
.isrc a{color:var(--muted)}
.infobox.fail .wx-d,.infobox.fail .fx-upd{color:var(--muted)}
.item{display:grid;gap:8px}
.item h4{font:500 17px/1.4 var(--body-font);color:var(--link)}
.item time{font-size:13px;color:var(--muted)}
.item p{font-size:15px;color:#333;line-height:1.65}
.nimg{display:block;width:100%;max-height:260px;object-fit:cover;border-radius:3px;background:var(--bg)}
.older .nimg{margin-top:8px;max-height:180px}
.nlink{justify-self:start;display:inline-flex;align-items:center;gap:6px;margin-top:4px;padding:7px 14px;border-radius:3px;font-size:14px;font-weight:500;text-decoration:none;color:var(--accent-dark);box-shadow:inset 0 0 0 1.5px var(--accent);transition:background .15s}
.nlink:hover{background:rgba(26,163,166,.08)}
.nlink svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.older .nlink{margin-top:8px}
.older{list-style:none;margin:22px 0 0;padding:16px 0 0;border-top:1px solid var(--line);display:grid;gap:10px;font-size:14px}
.older li{display:grid;grid-template-columns:auto 1fr;gap:10px}
.older time{color:var(--muted)}
.older summary{cursor:pointer;color:var(--link)}
.older details p{margin-top:6px;color:#333}
.empty{color:var(--muted);text-align:center;padding:24px 0}

@media (max-width:1180px){
  .grid3{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .intro{grid-column:1 / -1;padding-top:0}
}
@media (max-width:760px){
  .grid3{grid-template-columns:1fr;padding-top:32px}
  .cards{grid-template-columns:1fr 1fr;gap:14px}
  .card{padding:30px 4px 6px}
  .fld{width:128px}
  .ring{width:70px;height:70px}.ring svg{width:32px;height:32px}
}
@media (max-width:420px){.cal{width:64px}.cal .dd{font-size:24px}.cals{padding-inline:4px}}

/* ---------- Доод хэсгүүд ---------- */
.band{padding-block:clamp(56px,7vw,88px);background:var(--paper)}
.band.alt{background:var(--bg)}
.eyebrow{display:inline-block;font:700 13px var(--head-font);letter-spacing:.14em;text-transform:uppercase;color:var(--accent);margin-bottom:10px}
.band h2{font:700 clamp(26px,3vw,36px)/1.15 var(--head-font);text-transform:uppercase;color:#2A3136;margin-bottom:16px}
.two{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,5vw,72px);align-items:start}
.two p{color:#48545B;max-width:62ch}
.reg{margin-top:16px;font-size:14px;color:var(--muted)}
.points{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:18px}
.points li{display:grid;grid-template-columns:40px 1fr;gap:14px;background:var(--bg);border-radius:3px;padding:18px}
.chk{width:40px;height:40px;border-radius:50%;border:2px solid var(--ic);display:grid;place-items:center}
.chk svg{width:20px;height:20px;fill:none;stroke:var(--ic);stroke-width:2.4}
.points b{display:block;font-weight:500;margin-bottom:4px}
.points span{font-size:14px;color:var(--muted)}
@media (max-width:900px){.two{grid-template-columns:1fr}}
@media (max-width:560px){.points{grid-template-columns:1fr}}

.intro-p{color:#48545B;margin-bottom:34px}
.steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:20px}
.steps li{background:var(--paper);border-radius:3px;box-shadow:var(--shadow);padding:24px 22px;display:grid;gap:8px;align-content:start;border-top:4px solid var(--accent)}
.num{font:700 30px var(--head-font);color:var(--accent)}
.steps h3{font:600 18px var(--head-font);text-transform:uppercase;color:#333}
.steps p{font-size:15px;color:var(--muted)}
.dur{font-size:12px;font-weight:700;letter-spacing:.06em;color:var(--head-a);text-transform:uppercase}

.foot{position:relative;background:linear-gradient(90deg,var(--head-a),var(--head-b) 55%,var(--head-c));color:#fff;overflow:hidden}
.foot::after{content:"";position:absolute;inset:0;background:var(--meander);opacity:.6;-webkit-mask-image:linear-gradient(270deg,transparent 30%,#000);mask-image:linear-gradient(270deg,transparent 30%,#000);pointer-events:none}
.foot .wrap{position:relative;z-index:1}
.fgrid{display:grid;grid-template-columns:1fr 1fr;gap:28px;padding-block:36px 24px;align-items:start}
.fbrand{display:flex;gap:14px;align-items:center}
.fbrand b{display:block;font:700 20px var(--head-font);text-transform:uppercase;letter-spacing:.02em}
.fbrand span{font-size:13px;opacity:.85}
.copy{padding-block:14px 20px;border-top:1px solid rgba(255,255,255,.25);font-size:13px;opacity:.9;display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px 20px}
.flinks{display:flex;flex-wrap:wrap;gap:4px 18px}
.flinks a{color:inherit}
@media (max-width:760px){.fgrid{grid-template-columns:1fr}}