/* ===== Мэдээ (blog) хуудсууд ===== */
.blog-head{padding:150px 0 90px}

/* жагсаалтын карт */
.news-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.ncard{display:flex;flex-direction:column;overflow:hidden;text-decoration:none;transition:transform .25s ease-out,box-shadow .3s}
.ncard:hover{transform:translateY(-4px)}
.ncover{aspect-ratio:16/9;overflow:hidden;flex:none}
.ncover img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .4s ease-out}
.ncard:hover .ncover img{transform:scale(1.04)}
.ncover.ph{display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,rgba(95,176,255,.14),rgba(158,139,255,.1) 55%,rgba(255,180,46,.1))}
.ncover.ph span{font-family:'IBM Plex Mono',monospace;font-size:26px;letter-spacing:.3em;color:var(--muted-2)}
.nbody{padding:20px 22px 24px;display:flex;flex-direction:column;gap:10px}
.nmeta{display:flex;align-items:center;gap:10px;flex-wrap:wrap;font-size:11.5px;color:var(--muted-2);letter-spacing:.05em}
.ntag{border:1px solid var(--glass-line);border-radius:20px;padding:3px 10px;font-size:10.5px;color:var(--cyan)}
.nbody h3{font-weight:700;font-size:19px;line-height:1.25}
.nbody p{color:var(--muted);font-size:14px;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.nempty{color:var(--muted);text-align:center;padding:80px 0;letter-spacing:.06em}
@media(max-width:980px){.news-grid{grid-template-columns:1fr 1fr}}
@media(max-width:640px){.news-grid{grid-template-columns:1fr}}

/* pagination */
.pgn{display:flex;gap:8px;justify-content:center;margin-top:44px;font-size:13px}
.pgn a,.pgn .on{min-width:36px;height:36px;display:inline-flex;align-items:center;justify-content:center;
  border:1px solid var(--glass-line);border-radius:9px;text-decoration:none;color:var(--muted);transition:all .2s;padding:0 10px}
.pgn a:hover{border-color:var(--cyan);color:var(--cyan)}
.pgn .on{color:var(--text);border-color:var(--cyan)}

/* дэлгэрэнгүй */
.article{max-width:780px;margin:0 auto;padding:0 30px}
.amet{display:flex;align-items:center;gap:14px;flex-wrap:wrap;font-size:12px;color:var(--muted-2);letter-spacing:.05em}
.amet a{color:var(--cyan);text-decoration:none}
.article h1{font-weight:800;font-size:clamp(30px,4.6vw,50px);line-height:1.06;margin-top:18px}
.alede{margin-top:18px;color:#B7C1D4;font-size:17.5px}
:root[data-theme="light"] .alede{color:#46556C}
.acover{margin-top:30px;overflow:hidden}
.acover img{width:100%;display:block;aspect-ratio:16/9;object-fit:cover}

.prose{margin-top:36px;font-size:16.5px;color:#CBD4E4;line-height:1.75}
:root[data-theme="light"] .prose{color:#2C3A4E}
.prose h1,.prose h2{font-size:26px;font-weight:800;margin:38px 0 14px;color:var(--text)}
.prose h3{font-size:20px;font-weight:700;margin:30px 0 12px;color:var(--text)}
.prose h4,.prose h5{font-size:17px;font-weight:700;margin:24px 0 10px;color:var(--text)}
.prose p{margin:14px 0}
.prose a{color:var(--cyan)}
.prose ul,.prose ol{margin:14px 0;padding-left:26px}
.prose li{margin:7px 0}
.prose blockquote{border-left:2px solid var(--amber);padding:4px 0 4px 22px;margin:22px 0;color:var(--muted);font-size:16px}
.prose img{max-width:100%;border-radius:14px;margin:22px 0;display:block}
.prose hr{border:0;border-top:1px solid var(--glass-line);margin:34px 0}
.prose code{font-family:'IBM Plex Mono',monospace;font-size:.88em;background:rgba(95,176,255,.1);border-radius:5px;padding:2px 6px}
.prose pre{background:rgba(8,11,18,.7);border:1px solid var(--glass-line);border-radius:12px;padding:18px 20px;overflow-x:auto;margin:22px 0}
:root[data-theme="light"] .prose pre{background:rgba(15,30,60,.05)}
.prose pre code{background:none;padding:0}
.prose table{width:100%;border-collapse:collapse;margin:22px 0;font-size:14.5px}
.prose th,.prose td{border:1px solid var(--glass-line);padding:9px 13px;text-align:left}
.prose th{font-family:'IBM Plex Mono',monospace;font-size:12px;letter-spacing:.05em;color:var(--muted)}

.amore{margin-top:90px}
@media(max-width:760px){.blog-head{padding:110px 0 60px}.article{padding:0 20px}.amore{margin-top:60px}}

/* ===== Хэрэглэгчийн түүх (case study) ===== */
.cs-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}
@media(max-width:860px){.cs-grid{grid-template-columns:1fr}}
.cs-card{display:block;padding:30px;text-decoration:none;transition:transform .25s ease-out}
.cs-card:hover{transform:translateY(-4px)}
.cs-top{display:flex;align-items:center;gap:16px}
.cs-logo{width:52px;height:52px;border-radius:12px;object-fit:contain;background:rgba(255,255,255,.06);border:1px solid var(--glass-line);flex:none}
.cs-logo.big{width:64px;height:64px}
.cs-top h3{font-weight:700;font-size:21px}
.cs-ind{font-size:11px;color:var(--muted-2);letter-spacing:.06em;margin-top:3px}
.cs-sum{color:var(--muted);font-size:14.5px;margin-top:14px}
.cs-mets{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:20px}
.cs-met{text-align:center;padding:14px 10px;border:1px solid var(--glass-line);border-radius:12px}
.cs-met .v{font-weight:800;font-size:22px;background:var(--neon);-webkit-background-clip:text;background-clip:text;color:transparent}
.cs-met .k{font-size:10.5px;color:var(--muted);margin-top:5px;letter-spacing:.04em}
.cs-mets.big{grid-template-columns:repeat(auto-fit,minmax(170px,1fr));margin:34px 0 8px}
.cs-mets.big .cs-met{padding:22px 14px}
.cs-mets.big .v{font-size:32px}
@media(max-width:560px){.cs-mets{grid-template-columns:1fr 1fr}}
.cs-head{display:flex;align-items:center;gap:20px;margin-top:16px;flex-wrap:wrap}
.cs-head h1{margin-top:0}
.cs-sec{margin-top:44px}
.cs-sec .prose{margin-top:14px}
.cs-quote{margin-top:48px}
.cs-cta{margin-top:52px}

/* ===== Үнийн хуудас ===== */
.pr-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;align-items:stretch}
@media(max-width:980px){.pr-grid{grid-template-columns:1fr}}
.pr-card{position:relative;padding:34px 30px;display:flex;flex-direction:column}
.pr-card.hot{border-color:rgba(95,176,255,.5);box-shadow:0 0 44px rgba(95,176,255,.16),0 28px 70px rgba(0,0,0,.5)}
.pr-card.hot::before{background:linear-gradient(140deg,rgba(124,176,255,.85),transparent 40%,transparent 60%,rgba(255,180,46,.6))}
.pr-badge{position:absolute;top:-11px;left:30px;background:linear-gradient(110deg,#5FB0FF,#9E8BFF);color:#06101f;
  font-size:10.5px;letter-spacing:.08em;padding:5px 12px;border-radius:20px;font-weight:600}
.pr-card h3{font-weight:800;font-size:23px}
.pr-desc{color:var(--muted);font-size:14px;margin-top:8px}
.pr-price{font-weight:800;font-size:30px;margin:20px 0 4px;background:var(--neon);-webkit-background-clip:text;background-clip:text;color:transparent}
.pr-card .feats{margin-top:18px;flex:1}
.pr-cta{margin-top:26px;justify-content:center}
.pr-note{margin-top:30px;text-align:center;color:var(--muted-2);font-size:12px;letter-spacing:.05em}
:root[data-theme="light"] .pr-card.hot{border-color:rgba(31,111,208,.45);box-shadow:0 0 40px rgba(31,111,208,.14),0 20px 50px rgba(30,50,90,.16)}

/* ===== Демо хүсэлтийн форм ===== */
.demo-wrap{max-width:820px}
.demo-form{padding:34px 30px}
.df-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 16px}
@media(max-width:640px){.df-grid{grid-template-columns:1fr}}
.demo-form label{display:block;font-size:12.5px;color:var(--muted);margin:16px 0 6px;letter-spacing:.03em}
.demo-form input,.demo-form select,.demo-form textarea{width:100%;background:rgba(255,255,255,.045);
  border:1px solid var(--glass-line);border-radius:10px;color:inherit;font:inherit;font-size:14.5px;
  padding:11px 14px;outline:none;transition:border-color .2s}
.demo-form input:focus,.demo-form select:focus,.demo-form textarea:focus{border-color:rgba(95,176,255,.55)}
.demo-form textarea{resize:vertical}
.demo-form select option{color:#111;background:#fff}
.hp-wrap{position:absolute;left:-9999px;top:-9999px;height:0;overflow:hidden}
.df-submit{margin-top:24px;width:100%;justify-content:center}
.df-msg{margin-top:12px;font-size:12.5px;color:var(--muted);min-height:18px}
.demo-done{padding:56px 40px;text-align:center;margin-top:10px}
.dd-icon{font-size:40px}
.demo-done h3{font-size:24px;font-weight:800;margin-top:14px}
.demo-done p{color:var(--muted);margin:12px auto 26px;max-width:440px}
:root[data-theme="light"] .demo-form input,:root[data-theme="light"] .demo-form select,:root[data-theme="light"] .demo-form textarea{background:rgba(10,30,60,.04)}