/*
Theme Name: Turkmedia
Theme URI: https://turkmedia.kz/
Update URI: https://github.com/kazprose/turkmedia
Author: Turkmedia
Author URI: https://turkmedia.kz/
Description: Türkmedia.kz — жаңалық порталдарына арналған жылдам, плагинсіз WordPress темасы. Модернистік газет типографикасы, жүгірмелі «Шұғыл» жолағы, автоматты валюта бағамы мен ауа райы, кірістірілген қарау санағышы, жарнама мен аналитика орындары. Бас беттің барлық бөлігі Баптау (Customizer) арқылы басқарылады.
Version: 1.0.10
Requires at least: 6.0
Tested up to: 6.8
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: turkmedia
Tags: news, magazine, blog, two-columns, three-columns, right-sidebar, custom-logo, custom-menu, custom-colors, featured-images, translation-ready, sticky-post, threaded-comments, full-width-template, block-styles, wide-blocks

Turkmedia is distributed under the terms of the GNU GPL v2 or later.
*/

/* ==========================================================================
   1. Қаріп — Archivo (жергілікті, айнымалы woff2 100..900)
   Кирилл әріптері дизайндағыдай жүйелік қаріппен (system-ui) беріледі.
   ========================================================================== */

@font-face {
	font-family: "Archivo";
	font-style: normal;
	font-weight: 100 900;
	font-stretch: 100%;
	font-display: swap;
	src: url("assets/fonts/archivo-latin.woff2") format("woff2");
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
	font-family: "Archivo";
	font-style: normal;
	font-weight: 100 900;
	font-stretch: 100%;
	font-display: swap;
	src: url("assets/fonts/archivo-latin-ext.woff2") format("woff2");
	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* ==========================================================================
   2. Токендер
   Түстер :root ішінде PHP арқылы да қайта жазылады (Баптау > Түстер).
   Мөлдірлік реңктері color-mix орнына дайын rgba() түрінде беріледі —
   көрінісі бірдей, бірақ ескі браузерлерде де жұмыс істейді және жылдамырақ.
   ========================================================================== */

:root {
	--color-bg: #f3f2f2;
	--color-surface: #eae9e9;
	--color-text: #222222;

	--color-accent: #c86a67;
	--color-accent-100: #fff2ef;
	--color-accent-500: #c86a67;
	--color-accent-600: #b7554f;
	--color-accent-700: #9c423d;
	--color-accent-800: #7e332f;
	--color-accent-900: #5c2422;

	/* Мәтіннің мөлдір реңктері */
	--tm-t04: rgba(34, 34, 34, .04);
	--tm-t07: rgba(34, 34, 34, .07);
	--tm-t14: rgba(34, 34, 34, .14);
	--tm-t40: rgba(34, 34, 34, .4);
	--tm-t55: rgba(34, 34, 34, .55);
	--tm-t58: rgba(34, 34, 34, .58);
	--tm-t60: rgba(34, 34, 34, .6);
	--tm-t62: rgba(34, 34, 34, .62);
	--tm-t65: rgba(34, 34, 34, .65);
	--tm-t70: rgba(34, 34, 34, .7);
	--tm-t72: rgba(34, 34, 34, .72);
	--tm-t74: rgba(34, 34, 34, .74);
	--tm-t75: rgba(34, 34, 34, .75);
	--tm-t80: rgba(34, 34, 34, .8);
	--tm-t82: rgba(34, 34, 34, .82);

	--tm-a10: rgba(200, 106, 103, .1);
	--tm-a18: rgba(200, 106, 103, .18);
	--tm-a30: rgba(200, 106, 103, .3);

	/* Ақшыл беттегі мөлдір сызықтар (сұхбат баннері) */
	--tm-l22: rgba(243, 242, 242, .22);
	--tm-l25: rgba(243, 242, 242, .25);
	--tm-l70: rgba(243, 242, 242, .7);

	--color-divider: var(--tm-t14);

	--font-heading: "Archivo", system-ui, sans-serif;
	--font-heading-weight: 800;
	--font-body: "Archivo", system-ui, sans-serif;

	--space-1: 4px;
	--space-2: 8px;
	--space-3: 12px;
	--space-4: 16px;
	--space-6: 24px;
	--space-8: 32px;

	--radius-sm: 0px;
	--radius-md: 0px;
	--radius-lg: 0px;

	--shadow-sm: 0 1px 2px rgba(45, 43, 43, .14);
	--shadow-md: 0 3px 10px rgba(45, 43, 43, .16);
	--shadow-lg: 0 12px 32px rgba(45, 43, 43, .22);

	/* Жиектер — экран енімен бірге кішірейеді */
	--tm-gut: 40px;   /* сыртқы жиек */
	--tm-in: 32px;    /* ішкі баған жиегі */
	--tm-in2: 28px;   /* футердің тар бағаны */
	--tm-art: 56px;   /* жеке жазбаның мәтін жиегі */
	--tm-aside: 340px;
	--tm-aside-sm: 320px;
	--tm-max: 1440px;
}

/* ==========================================================================
   3. Негіз (дизайн жүйесінің reset-і)
   ========================================================================== */

*,
*::before,
*::after {
	box-sizing: border-box;
}

html {
	-webkit-text-size-adjust: 100%;
}

body {
	margin: 0;
	background: var(--color-bg);
	color: var(--color-text);
	font-family: var(--font-body);
	font-size: 15px;
	line-height: 1.55;
	font-weight: 400;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

h1, h2, h3, h4, h5, h6 {
	font-family: var(--font-heading);
	font-weight: var(--font-heading-weight);
	line-height: 1.12;
	letter-spacing: -0.015em;
	margin: 0 0 var(--space-2);
}

h1 { font-size: 42px; }
h2 { font-size: 32px; }
h3 { font-size: 25px; }
h4 { font-size: 20px; }
h5 { font-size: 16px; }
h6 { font-size: 13px; letter-spacing: .08em; text-transform: uppercase; }

p { margin: 0 0 var(--space-3); }

a {
	color: inherit;
	text-decoration: none;
	text-underline-offset: 3px;
}

a:hover { color: var(--color-accent-700); }

img,
svg,
video,
iframe {
	display: block;
	max-width: 100%;
}

img {
	height: auto;
}

figure { margin: 0; }

figcaption {
	font-size: 11px;
	margin-top: var(--space-1);
	color: var(--tm-t55);
}

:focus { outline: none; }

:focus-visible {
	outline: 2px solid var(--color-accent);
	outline-offset: 2px;
}

::selection { background: var(--tm-a30); }

.tm-text-muted { color: var(--tm-t55); }

/* Тек экранды оқығышқа арналған */
.screen-reader-text {
	border: 0;
	clip: rect(1px, 1px, 1px, 1px);
	clip-path: inset(50%);
	height: 1px;
	width: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute !important;
	word-wrap: normal !important;
}

.screen-reader-text:focus {
	background: var(--color-bg);
	clip: auto !important;
	clip-path: none;
	color: var(--color-text);
	display: block;
	font: 800 14px/1 var(--font-heading);
	height: auto;
	left: 8px;
	padding: 14px 20px;
	top: 8px;
	width: auto;
	z-index: 100000;
	box-shadow: var(--shadow-md);
}

.tm-hr {
	height: 2px;
	border: 0;
	margin: var(--space-4) 0;
	background: var(--color-divider);
	padding: 0;
}

/* ==========================================================================
   4. Дизайн жүйесінің компоненттері
   ========================================================================== */

.tm-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	cursor: pointer;
	text-decoration: none;
	font-family: var(--font-heading);
	font-weight: var(--font-heading-weight);
	font-size: 14px;
	line-height: 1.2;
	color: var(--color-text);
	background: transparent;
	border: 1px solid transparent;
	padding: var(--space-2) 14.4px;
	border-radius: var(--radius-md);
}

.tm-btn:hover { color: var(--color-text); }
.tm-btn svg { display: block; }
.tm-btn:disabled { opacity: .45; cursor: not-allowed; }

.tm-btn-primary { background: var(--color-accent); color: var(--color-bg); }
.tm-btn-primary:hover { background: var(--color-accent-600); color: var(--color-bg); }
.tm-btn-primary:active { background: var(--color-accent-700); }

.tm-btn-secondary { border-color: var(--color-divider); }
.tm-btn-secondary:hover { background: var(--tm-t07); }
.tm-btn-secondary:active { background: var(--tm-t14); }

.tm-btn-ghost { color: var(--color-accent); padding-inline: var(--space-1); }
.tm-btn-ghost:hover { background: var(--tm-a10); }
.tm-btn-ghost:active { background: var(--tm-a18); }

.tm-btn-block { width: 100%; }

.tm-input {
	width: 100%;
	min-height: 36px;
	padding: 6px 10px;
	font: inherit;
	font-size: 14px;
	color: var(--color-text);
	caret-color: var(--color-accent);
	background: var(--color-surface);
	border: 1px solid var(--color-divider);
	border-radius: var(--radius-md);
}

.tm-input:hover { border-color: rgba(34, 34, 34, .45); }
.tm-input:focus-visible { border-color: var(--color-accent); outline-offset: 0; }
textarea.tm-input { min-height: 90px; resize: vertical; }

.tm-tag {
	display: inline-flex;
	align-items: center;
	font-size: 11px;
	letter-spacing: .02em;
	padding: 3px 10px;
	border-radius: var(--radius-md);
}

.tm-tag-accent { background: var(--color-accent-100); color: var(--color-accent-800); }
.tm-tag-outline { border: 1px solid var(--color-accent); color: var(--color-accent); }
.tm-tag-outline:hover { background: var(--tm-a10); color: var(--color-accent); }

.tm-table { width: 100%; border-collapse: collapse; font-size: 14px; }

.tm-table th {
	text-align: left;
	font-size: 11px;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: var(--tm-t60);
	padding: var(--space-2);
	border-bottom: 2px solid var(--color-divider);
}

.tm-table td { padding: var(--space-2); border-bottom: 1px solid var(--color-divider); }
.tm-table tbody tr:hover { background: var(--tm-t04); }

/* ==========================================================================
   5. Ортақ типографика (дизайндағы .kick / .sechd / .lenta / .mtd ...)
   ========================================================================== */

.tm-kick {
	font: 600 10.5px/1 var(--font-body);
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--color-accent-700);
}

.tm-kick a:hover { color: var(--color-accent); }

.tm-sechd {
	margin: 0;
	font: 800 15px/1 var(--font-heading);
	letter-spacing: .02em;
	text-transform: uppercase;
}

.tm-lenta {
	display: grid;
	grid-template-columns: 44px minmax(0, 1fr);
	gap: 12px;
	padding: 13px 0;
	border-bottom: 1px solid var(--color-divider);
}

.tm-lt {
	font: 600 12px/1.35 var(--font-body);
	font-feature-settings: "tnum" 1;
	color: var(--tm-t55);
}

.tm-lt-now { color: var(--color-accent-700); }

.tm-ln { font-size: 14px; line-height: 1.4; }

.tm-mtd {
	font-size: 11.5px;
	font-feature-settings: "tnum" 1;
	color: var(--tm-t58);
}

.tm-navl { font: 800 14px/1 var(--font-heading); }

.tm-hl:hover { color: var(--color-accent); }

.tm-rate { font-feature-settings: "tnum" 1; }
.tm-rate b { color: var(--color-text); }
.tm-rate-up { color: var(--color-accent); }
.tm-rate-down { opacity: .6; }

.tm-soc {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 24px;
	height: 24px;
	color: var(--tm-t72);
}

.tm-soc:hover { color: var(--color-accent); }
.tm-soc svg { width: 16px; height: 16px; display: block; }

.tm-socft {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 38px;
	height: 38px;
	border: 1.5px solid var(--color-divider);
	color: var(--color-text);
}

.tm-socft:hover {
	background: var(--color-accent);
	border-color: var(--color-accent);
	color: var(--color-bg);
}

.tm-socft svg { width: 18px; height: 18px; display: block; }

/* Сурет ұяшығы — дизайндағы <image-slot> орнына */
.tm-img {
	display: block;
	overflow: hidden;
	background: var(--color-surface);
	position: relative;
}

.tm-img img,
.tm-img > span.tm-img-ph {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.tm-img-ph { background: var(--color-surface); }

/* ==========================================================================
   6. Қаңқа
   ========================================================================== */

.tm-frame {
	max-width: var(--tm-max);
	margin: 0 auto;
	background: var(--color-bg);
	position: relative;
}

.tm-frame-full { max-width: none; }

.tm-px { padding-left: var(--tm-gut); padding-right: var(--tm-gut); }

/* ==========================================================================
   7. Жарнама орындары
   ========================================================================== */

.tm-ad {
	display: block;
	text-align: center;
}

.tm-ad-inner > * { margin-inline: auto; }

.tm-ad-top {
	padding: 14px var(--tm-gut);
	border-bottom: 1px solid var(--color-divider);
}

.tm-ad-title {
	display: block;
	margin-bottom: 8px;
	font: 600 9.5px/1 var(--font-body);
	letter-spacing: .16em;
	text-transform: uppercase;
	color: var(--tm-t40);
}

.tm-ad-after-title { margin: 26px 0 0; }
.tm-ad-mid { margin: 4px 0; }
.tm-ad-after-content { margin-top: 30px; }

/* ==========================================================================
   8. Шұғыл — жүгірмелі жол
   ========================================================================== */

@keyframes tm-marquee {
	from { transform: translateX(0); }
	to { transform: translateX(-50%); }
}

.tm-breaking {
	display: flex;
	align-items: center;
	gap: 16px;
	background: var(--color-accent);
	color: var(--color-bg);
	padding: 9px var(--tm-gut);
}

.tm-breaking-badge {
	flex: none;
	font: 800 11px/1 var(--font-heading);
	letter-spacing: .14em;
	text-transform: uppercase;
	border: 1.5px solid var(--color-bg);
	padding: 5px 8px;
}

.tm-mq {
	overflow: hidden;
	flex: 1;
	min-width: 0;
	-webkit-mask-image: linear-gradient(to right, transparent 0, #000 24px, #000 calc(100% - 24px), transparent 100%);
	mask-image: linear-gradient(to right, transparent 0, #000 24px, #000 calc(100% - 24px), transparent 100%);
}

.tm-mqtrack {
	display: flex;
	width: max-content;
	gap: 0;
	animation: tm-marquee var(--tm-mq-speed, 34s) linear infinite;
}

.tm-mq:hover .tm-mqtrack,
.tm-mq:focus-within .tm-mqtrack { animation-play-state: paused; }

.tm-mqitem {
	display: flex;
	align-items: center;
	gap: 12px;
	padding-right: 40px;
	font: 800 14.5px/1.2 var(--font-heading);
	letter-spacing: -.005em;
	white-space: nowrap;
}

.tm-mqitem:hover { color: var(--color-bg); }
.tm-mqitem span { font: 600 11px/1 var(--font-body); font-feature-settings: "tnum" 1; opacity: .75; }

@media (prefers-reduced-motion: reduce) {
	.tm-mqtrack { animation: none; }
}

/* ==========================================================================
   9. Жоғарғы қызмет жолағы (күн, бағам, желілер, тіл, іздеу)
   ========================================================================== */

.tm-topbar {
	display: flex;
	align-items: center;
	gap: 22px;
	padding: 0 var(--tm-gut);
	height: 40px;
	border-bottom: 1px solid var(--color-divider);
	font-size: 12px;
	color: var(--tm-t62);
}

.tm-topbar-rates {
	display: flex;
	align-items: center;
	gap: 14px;
	padding-left: 22px;
	border-left: 1px solid var(--color-divider);
}

.tm-topbar-weather {
	padding-left: 14px;
	border-left: 1px solid var(--color-divider);
}

.tm-topbar-soc {
	margin-left: auto;
	display: flex;
	align-items: center;
	gap: 12px;
	padding-right: 16px;
	border-right: 1px solid var(--color-divider);
}

.tm-lang { display: flex; align-items: center; gap: 8px; }
.tm-lang-on { font: 800 12px/1 var(--font-heading); color: var(--color-accent); }
.tm-lang-off { font: 600 12px/1 var(--font-body); }
.tm-lang-sep { opacity: .4; }
.tm-topbar-search { font: 600 12px/1 var(--font-body); }

/* ==========================================================================
   10. Бренд жолы
   ========================================================================== */

.tm-brand {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 20px;
	padding: 28px var(--tm-gut) 20px;
}

.tm-brand-l { display: flex; flex-direction: column; gap: 8px; }

.tm-logo {
	font: 800 42px/.92 var(--font-heading);
	letter-spacing: -.035em;
	margin-left: -.03em;
	display: block;
}

.tm-logo:hover { color: var(--color-text); }
.tm-logo-dot { color: var(--color-accent); }
.tm-logo img { max-height: var(--tm-logo-h, 60px); width: auto; }

.tm-tagline {
	font: 600 11px/1 var(--font-body);
	letter-spacing: .16em;
	text-transform: uppercase;
	color: var(--tm-t60);
}

.tm-brand-r { display: flex; gap: 10px; }

/* Мобильді бренд жолының оң жағы (бургер + тіл) */
.tm-brand-m { display: none; align-items: center; gap: 12px; font-size: 11.5px; }

.tm-burger {
	display: block;
	width: 22px;
	height: 2px;
	padding: 0;
	border: 0;
	background: var(--color-text);
	box-shadow: 0 6px 0 var(--color-text), 0 -6px 0 var(--color-text);
	cursor: pointer;
}

/* ==========================================================================
   11. Басты мәзір
   ========================================================================== */

.tm-nav {
	display: flex;
	gap: 28px;
	padding: 0 var(--tm-gut);
	height: 48px;
	align-items: center;
	border-top: 2px solid var(--color-divider);
	border-bottom: 2px solid var(--color-divider);
}

.tm-nav ul {
	display: flex;
	gap: 28px;
	align-items: center;
	list-style: none;
	margin: 0;
	padding: 0;
	min-width: 0;
}

.tm-nav li { position: relative; }
.tm-nav a { font: 800 14px/1 var(--font-heading); white-space: nowrap; }

.tm-nav .current-menu-item > a,
.tm-nav .current-menu-parent > a,
.tm-nav .current-menu-ancestor > a,
.tm-nav .current_page_item > a { color: var(--color-accent); }

.tm-nav-all {
	margin-left: auto;
	font: 600 12px/1 var(--font-body);
	color: var(--tm-t60);
	white-space: nowrap;
}

/* Ішкі мәзір */
.tm-nav .sub-menu {
	display: none;
	position: absolute;
	top: 100%;
	left: -14px;
	z-index: 40;
	flex-direction: column;
	gap: 0;
	min-width: 200px;
	padding: 8px 0;
	background: var(--color-bg);
	border: 1px solid var(--color-divider);
	box-shadow: var(--shadow-md);
}

.tm-nav li:hover > .sub-menu,
.tm-nav li:focus-within > .sub-menu { display: flex; }
.tm-nav .sub-menu a { display: block; padding: 8px 14px; font: 600 13px/1.3 var(--font-body); white-space: normal; }
.tm-nav .sub-menu a:hover { background: var(--tm-t07); }

/* ==========================================================================
   12. Жабысқақ айдар мәзірі + оқу барысы
   ========================================================================== */

.tm-sticky {
	position: -webkit-sticky;
	position: sticky;
	top: 0;
	z-index: 50;
	background: var(--color-bg);
}

/* WordPress әкімші жолағы бетті төмен ығыстырады. */
body.admin-bar .tm-sticky { top: 32px; }

@media screen and (max-width: 782px) {
	body.admin-bar .tm-sticky { top: 46px; }
}

.tm-progress { height: 3px; background: var(--color-divider); overflow: hidden; }

/* scaleX арқылы масштабталады: transform layout тудырмайды, ал width
   өзгерткенде әр кадрда қайта есептеу керек болар еді. */
.tm-progress-bar {
	width: 100%;
	height: 3px;
	background: var(--color-accent);
	transform: scaleX(0);
	transform-origin: left center;
	will-change: transform;
}

/* ==========================================================================
   12б. «Жоғарыға» түймесі
   ========================================================================== */

.tm-gotop {
	position: fixed;
	right: 24px;
	bottom: 24px;
	z-index: 60;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 46px;
	height: 46px;
	padding: 0;
	border: 0;
	border-radius: var(--radius-md);
	background: var(--color-accent);
	color: var(--color-bg);
	cursor: pointer;
	box-shadow: var(--shadow-md);
	opacity: 0;
	visibility: hidden;
	transform: translateY(10px);
	transition: opacity .18s ease, transform .18s ease, visibility .18s, background .18s ease;
}

.tm-gotop.is-on { opacity: 1; visibility: visible; transform: none; }
.tm-gotop:hover { background: var(--color-accent-700); color: var(--color-bg); }
.tm-gotop:active { background: var(--color-accent-800); }
.tm-gotop svg { width: 18px; height: 18px; display: block; }

@media (prefers-reduced-motion: reduce) {
	.tm-gotop { transition: none; }
}

/* ==========================================================================
   13. Бас бет — негізгі тор
   ========================================================================== */

.tm-main-grid {
	display: grid;
	grid-template-columns: minmax(0, 1fr) var(--tm-aside);
}

.tm-main-col {
	padding: 36px var(--tm-gut) 40px;
	border-right: 2px solid var(--color-divider);
	min-width: 0;
}

.tm-side-col { padding: 36px var(--tm-in) 40px; min-width: 0; }

/* Басты жаңалық */
.tm-hero {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 400px;
	gap: 32px;
	align-items: start;
}

.tm-hero-txt { display: flex; flex-direction: column; gap: 14px; min-width: 0; }

.tm-hero-title {
	font: 800 46px/1.02 var(--font-heading);
	letter-spacing: -.03em;
	margin: 0;
	margin-left: -.03em;
	display: block;
}

.tm-hero-title a { display: block; }

.tm-hero-exc {
	margin: 0;
	font-size: 16.5px;
	line-height: 1.6;
	color: var(--tm-t80);
}

.tm-hero-img-link { display: block; }
.tm-hero-img { height: 300px; }

/* 4 бағанды хабар торы */
.tm-grid4 {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 24px;
}

.tm-grid4-2 {
	margin-top: 28px;
	padding-top: 26px;
	border-top: 2px solid var(--color-divider);
}

.tm-card { display: flex; flex-direction: column; gap: 12px; min-width: 0; }
.tm-grid4-2 .tm-card { gap: 10px; }
.tm-card > a { display: block; }
.tm-card-txt { display: flex; flex-direction: column; gap: inherit; min-width: 0; }
.tm-card-img { height: 132px; }

.tm-card-title {
	font: 800 17px/1.22 var(--font-heading);
	letter-spacing: -.012em;
	margin: 0;
}

/* Бүйірлік — Соңғы жаңалықтар */
.tm-side-hd {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	padding-bottom: 12px;
	border-bottom: 2px solid var(--color-divider);
}

.tm-side-dot { width: 8px; height: 8px; background: var(--color-accent); flex: none; }
.tm-list { display: flex; flex-direction: column; }

.tm-side-more {
	margin-top: 16px;
	font: 800 13px/1 var(--font-heading);
	color: var(--color-accent);
	align-self: flex-start;
}

.tm-side-block {
	margin-top: 36px;
	padding-top: 20px;
	border-top: 2px solid var(--color-divider);
}

.tm-side-block .tm-sechd { margin-bottom: 14px; }

/* Ең көп оқылған */
.tm-top {
	display: grid;
	grid-template-columns: 26px minmax(0, 1fr);
	gap: 10px;
	padding: 12px 0;
	border-bottom: 1px solid var(--color-divider);
}

.tm-top:last-child { border-bottom: 0; }
.tm-top-n { font: 800 18px/1 var(--font-heading); color: var(--tm-t40); }
.tm-top-n-1 { color: var(--color-accent); }

/* ==========================================================================
   14. Екі айдар блогы
   ========================================================================== */

.tm-duo {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	border-top: 2px solid var(--color-divider);
}

.tm-duo-a { border-right: 1px solid var(--color-divider); min-width: 0; }
.tm-duo-b { min-width: 0; }

.tm-duo-hd {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 16px;
	padding: 30px var(--tm-in) 16px var(--tm-gut);
}

.tm-duo-b .tm-duo-hd { padding: 30px var(--tm-gut) 16px var(--tm-in); }

.tm-duo-t {
	margin: 0;
	font: 800 40px/.94 var(--font-heading);
	letter-spacing: -.035em;
	margin-left: -.035em;
}

.tm-all-up {
	font: 800 12px/1 var(--font-heading);
	letter-spacing: .06em;
	text-transform: uppercase;
	color: var(--color-accent);
	white-space: nowrap;
}

.tm-lead {
	position: relative;
	height: 300px;
	border-top: 2px solid var(--color-divider);
	border-bottom: 2px solid var(--color-divider);
}

.tm-lead > .tm-img { height: 100%; }

.tm-lead-scrim {
	position: absolute;
	inset: 0;
	pointer-events: none;
	background: linear-gradient(to top, rgba(20, 18, 17, .92) 0%, rgba(20, 18, 17, .55) 42%, rgba(20, 18, 17, 0) 78%);
}

.tm-lead-cap {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	padding: 24px var(--tm-in) 22px var(--tm-gut);
	display: flex;
	flex-direction: column;
	gap: 10px;
	pointer-events: none;
}

.tm-duo-b .tm-lead-cap { padding: 24px var(--tm-gut) 22px var(--tm-in); }

.tm-lead-badge {
	font: 800 10.5px/1 var(--font-heading);
	letter-spacing: .14em;
	text-transform: uppercase;
	background: var(--color-accent);
	color: var(--color-bg);
	padding: 5px 8px;
	align-self: flex-start;
}

.tm-lead-title {
	margin: 0;
	pointer-events: auto;
	font: 800 26px/1.14 var(--font-heading);
	letter-spacing: -.022em;
	color: #f3f2f2;
	max-width: 24ch;
}

.tm-lead-title a { color: #f3f2f2; }
.tm-lead-title a:hover { color: #fff; }
.tm-lead-meta { font-size: 12px; color: var(--tm-l70); font-feature-settings: "tnum" 1; }

.tm-duo-list {
	display: flex;
	flex-direction: column;
	padding: 0 var(--tm-in) 34px var(--tm-gut);
}

.tm-duo-b .tm-duo-list { padding: 0 var(--tm-gut) 34px var(--tm-in); }

.tm-row {
	display: grid;
	grid-template-columns: 112px minmax(0, 1fr);
	gap: 16px;
	align-items: center;
	padding: 18px 0;
	border-bottom: 1px solid var(--color-divider);
}

.tm-row:last-child { border-bottom: 0; }
.tm-row-img { display: block; height: 74px; }
.tm-row-txt { display: flex; flex-direction: column; gap: 7px; min-width: 0; }

.tm-row-title {
	margin: 0;
	font: 800 18px/1.26 var(--font-heading);
	letter-spacing: -.014em;
}

/* ==========================================================================
   15. Сұхбат баннері
   ========================================================================== */

.tm-iv {
	border-top: 2px solid var(--color-divider);
	background: linear-gradient(100deg, #8f3b38 0%, #b7554f 38%, #c86a67 100%);
	color: #ffffff;
}

.tm-iv-strip {
	display: flex;
	align-items: center;
	gap: 14px;
	padding: 16px var(--tm-gut);
	border-bottom: 1px solid var(--tm-l22);
}

.tm-iv-badge {
	font: 800 11px/1 var(--font-heading);
	letter-spacing: .16em;
	text-transform: uppercase;
	background: #ffffff;
	color: #9c423d;
	padding: 6px 9px;
}

.tm-iv-label {
	font: 600 11.5px/1 var(--font-body);
	letter-spacing: .14em;
	text-transform: uppercase;
	opacity: .6;
}

.tm-iv-all {
	margin-left: auto;
	font: 800 12px/1 var(--font-heading);
	color: var(--color-bg);
	opacity: .75;
	white-space: nowrap;
}

.tm-iv-all:hover { color: #fff; opacity: 1; }

.tm-iv-body {
	display: grid;
	grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr);
}

.tm-iv-txt {
	padding: 52px 56px 52px var(--tm-gut);
	display: flex;
	flex-direction: column;
	gap: 24px;
	justify-content: center;
	min-width: 0;
}

.tm-iv-title {
	margin: 0;
	font: 800 44px/1.08 var(--font-heading);
	letter-spacing: -.028em;
	margin-left: -.03em;
	display: block;
	color: var(--color-bg);
}

.tm-iv-title a { color: var(--color-bg); display: block; }
.tm-iv-title a:hover { color: #fff; }

.tm-iv-exc {
	margin: 0;
	font-size: 17px;
	line-height: 1.65;
	opacity: .8;
	max-width: 46ch;
}

.tm-iv-meta {
	display: flex;
	align-items: center;
	gap: 20px;
	padding-top: 22px;
	border-top: 1px solid var(--tm-l25);
	font-size: 12.5px;
	flex-wrap: wrap;
}

.tm-iv-person { display: flex; flex-direction: column; gap: 4px; }
.tm-iv-person b { font: 800 14px/1 var(--font-heading); }
.tm-iv-dim { opacity: .6; }
.tm-iv-sep { width: 1px; height: 30px; background: var(--tm-l25); }
.tm-iv-img { position: relative; min-height: 520px; }
.tm-iv-img .tm-img { position: absolute; inset: 0; height: 100%; }

/* ==========================================================================
   16. Үш айдар блогы
   ========================================================================== */

.tm-trio {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	border-top: 2px solid var(--color-divider);
}

.tm-trio-col {
	padding: 34px var(--tm-in) 40px;
	display: flex;
	flex-direction: column;
	gap: 18px;
	min-width: 0;
}

.tm-trio-col:nth-child(1) { padding-left: var(--tm-gut); border-right: 1px solid var(--color-divider); }
.tm-trio-col:nth-child(2) { border-right: 1px solid var(--color-divider); }
.tm-trio-col:nth-child(3) { padding-right: var(--tm-gut); }

.tm-trio-hd {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 12px;
	padding-bottom: 12px;
	border-bottom: 2px solid var(--color-divider);
}

.tm-all {
	font: 800 12px/1 var(--font-heading);
	color: var(--color-accent);
	white-space: nowrap;
}

.tm-trio-img { height: 170px; }
.tm-trio-lead { display: flex; flex-direction: column; gap: 9px; }

.tm-trio-title {
	margin: 0;
	font: 800 22px/1.18 var(--font-heading);
	letter-spacing: -.018em;
}

.tm-trio-exc {
	margin: 0;
	font-size: 14px;
	line-height: 1.55;
	color: var(--tm-t72);
}

.tm-trio-list {
	display: flex;
	flex-direction: column;
	border-top: 1px solid var(--color-divider);
}

.tm-srow {
	display: grid;
	grid-template-columns: 88px minmax(0, 1fr);
	gap: 12px;
	align-items: center;
	padding: 13px 0;
	border-bottom: 1px solid var(--color-divider);
}

.tm-srow:last-child { border-bottom: 0; }
.tm-srow-img { display: block; height: 58px; }
.tm-srow-txt { display: flex; flex-direction: column; gap: 6px; min-width: 0; }

.tm-srow-title {
	margin: 0;
	font: 800 15px/1.28 var(--font-heading);
	letter-spacing: -.01em;
}

/* ==========================================================================
   17. Футер
   ========================================================================== */

.tm-footer { border-top: 2px solid var(--color-divider); }

.tm-footer-grid {
	display: grid;
	grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr) minmax(0, .85fr) minmax(0, .85fr);
}

.tm-fcol {
	display: flex;
	flex-direction: column;
	gap: 18px;
	min-width: 0;
	border-right: 1px solid var(--color-divider);
}

.tm-fcol-1 { padding: 36px var(--tm-in) 36px var(--tm-gut); gap: 16px; }
.tm-fcol-2 { padding: 36px var(--tm-in); }
.tm-fcol-3 { padding: 36px var(--tm-in2); }
.tm-fcol-4 { padding: 36px var(--tm-gut) 36px var(--tm-in2); border-right: 0; }

.tm-flogo {
	font: 800 28px/1 var(--font-heading);
	letter-spacing: -.032em;
	margin-left: -.03em;
	display: block;
}

.tm-flogo:hover { color: var(--color-text); }
.tm-flogo img { max-height: calc(var(--tm-logo-h, 60px) * .667); width: auto; }

.tm-fdesc {
	margin: 0;
	font-size: 12.5px;
	line-height: 1.65;
	color: var(--tm-t70);
	max-width: 40ch;
}

.tm-age { display: flex; align-items: center; gap: 12px; }

.tm-age-badge {
	flex: none;
	width: 34px;
	height: 34px;
	border: 2px solid var(--color-accent);
	color: var(--color-accent);
	display: flex;
	align-items: center;
	justify-content: center;
	font: 800 11px/1 var(--font-heading);
}

.tm-age-txt {
	font-size: 12px;
	line-height: 1.5;
	color: var(--tm-t70);
	max-width: 32ch;
}

.tm-flabel {
	font: 800 11px/1 var(--font-heading);
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--tm-t55);
}

.tm-flabel-2 { margin-top: 6px; }

.tm-fgroup { display: flex; flex-direction: column; gap: 5px; }
.tm-fgroup b { font: 800 12.5px/1.4 var(--font-heading); font-weight: 800; }
.tm-fgroup span { font-size: 13px; line-height: 1.55; color: var(--tm-t75); }
.tm-fgroup a { font-size: 13px; }
.tm-fgroup a.tm-num { font-feature-settings: "tnum" 1; }

.tm-flinks-2 {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 9px 16px;
	list-style: none;
	margin: 0;
	padding: 0;
}

.tm-flinks-1 {
	display: flex;
	flex-direction: column;
	gap: 9px;
	list-style: none;
	margin: 0;
	padding: 0;
}

.tm-flinks-1 a,
.tm-flinks-2 a { font-size: 13px; }

.tm-fsoc { display: flex; gap: 8px; flex-wrap: wrap; }

.tm-fsub {
	margin-top: 4px;
	padding: 16px;
	border: 1.5px solid var(--color-divider);
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.tm-fsub-t { font: 800 13px/1.3 var(--font-heading); }

.tm-fbottom {
	display: flex;
	align-items: center;
	gap: 24px;
	padding: 16px var(--tm-gut);
	border-top: 2px solid var(--color-divider);
	font-size: 12px;
	color: var(--tm-t65);
	flex-wrap: wrap;
}

.tm-fbottom-r { margin-left: auto; font-weight: 600; color: var(--color-accent); }

/* ==========================================================================
   18. Жеке жазба
   ========================================================================== */

.tm-post-grid { display: grid; grid-template-columns: minmax(0, 1fr) var(--tm-aside-sm); }

.tm-post {
	/* Жазбаның бүкіл бөлігі — тақырып, сурет, мәтін, тегтер — БІР енде
	   аяқталады. Әйтпесе сурет бүкіл бағанды алып, мәтін 62ch-пен
	   шектеліп, оң жақта тең емес бос орын қалатын. */
	--tm-measure: 680px;

	padding: 40px var(--tm-art) 48px;
	border-right: 2px solid var(--color-divider);
	min-width: 0;
}

.tm-post { position: relative; }
.tm-post > figure,
.tm-post > .tm-ad { max-width: var(--tm-measure); }

/* Мәтіннің оң жағындағы жабысқақ жарнама бағаны.
   Биіктігі мақаланың бүкіл бойына созылады, сондықтан ішіндегі блок
   sticky күйінде сырғумен бірге жүре алады. */
.tm-rail {
	position: absolute;
	top: 40px;
	bottom: 48px;
	right: var(--tm-art);
	width: 300px;
	pointer-events: none;
}

.tm-rail-inner {
	position: -webkit-sticky;
	position: sticky;
	top: 72px;
	pointer-events: auto;
}

body.admin-bar .tm-rail-inner { top: 104px; }
.tm-rail .tm-ad { margin: 0; }
.tm-rail .tm-ad-inner { min-height: 250px; }

.tm-crumbs { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.tm-crumbs-sep { opacity: .5; }

.tm-post-title {
	margin: 18px 0 0;
	font: 800 54px/1.04 var(--font-heading);
	letter-spacing: -.03em;
	margin-left: -.03em;
	max-width: var(--tm-measure);
}

.tm-post-lead {
	margin: 20px 0 0;
	font-size: 19px;
	line-height: 1.55;
	max-width: var(--tm-measure);
	color: var(--tm-t82);
}

.tm-post-meta {
	display: flex;
	align-items: center;
	gap: 20px;
	max-width: var(--tm-measure);
	margin: 24px 0;
	padding: 14px 0;
	border-top: 1px solid var(--color-divider);
	border-bottom: 1px solid var(--color-divider);
	font-size: 12.5px;
	color: var(--tm-t62);
	flex-wrap: wrap;
}

.tm-post-author { font-weight: 600; color: var(--color-text); }
.tm-share { margin-left: auto; display: flex; gap: 8px; flex-wrap: wrap; }
.tm-share .tm-btn { padding: 6px 10px; font-size: 12px; }

/* «Өңдеу» — тек редакторға көрінеді, сондықтан акцент түсімен бөлінеді. */
.tm-edit { border-color: var(--color-accent); color: var(--color-accent); }
.tm-edit:hover { background: var(--tm-a10); color: var(--color-accent); }

.tm-post-hero { height: 400px; }

.tm-post-cap {
	margin-top: 10px;
	font-size: 12.5px;
	line-height: 1.5;
	color: var(--tm-t60);
}

/* Мазмұн */
.tm-content {
	max-width: var(--tm-measure);
	margin-top: 32px;
	font-size: 17.5px;
	line-height: 1.72;
}

.tm-content > * { margin-top: 22px; margin-bottom: 0; }
.tm-content > *:first-child { margin-top: 0; }
.tm-content p { margin-bottom: 0; }

.tm-content h2 { font: 800 30px/1.15 var(--font-heading); letter-spacing: -.02em; margin-top: 34px; }
.tm-content h3 { font: 800 24px/1.2 var(--font-heading); letter-spacing: -.015em; margin-top: 30px; }
.tm-content h4 { font: 800 20px/1.25 var(--font-heading); margin-top: 26px; }

.tm-content a { color: var(--color-accent-700); text-decoration: underline; }
.tm-content a:hover { color: var(--color-accent); }

.tm-content blockquote {
	margin: 28px 0;
	padding-left: 20px;
	border-left: 4px solid var(--color-accent);
	font: 800 24px/1.3 var(--font-heading);
	letter-spacing: -.015em;
}

.tm-content blockquote p { margin: 0; font: inherit; letter-spacing: inherit; }
.tm-content blockquote cite { display: block; margin-top: 10px; font: 600 13px/1.4 var(--font-body); opacity: .7; }

.tm-content ul,
.tm-content ol { padding-left: 22px; }
.tm-content li { margin-bottom: 8px; }
.tm-content li::marker { color: var(--color-accent); }

.tm-content img,
.tm-content figure { margin-top: 26px; }
.tm-content figcaption { margin-top: 10px; font-size: 12.5px; line-height: 1.5; color: var(--tm-t60); }

.tm-content table { width: 100%; border-collapse: collapse; font-size: 15px; }
.tm-content th { text-align: left; font: 800 12px/1.3 var(--font-heading); letter-spacing: .06em; text-transform: uppercase; color: var(--tm-t60); padding: 10px 8px; border-bottom: 2px solid var(--color-divider); }
.tm-content td { padding: 10px 8px; border-bottom: 1px solid var(--color-divider); }

.tm-content pre {
	overflow-x: auto;
	padding: 16px;
	background: var(--color-surface);
	font-size: 14px;
	line-height: 1.5;
}

.tm-content code { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: .92em; }
.tm-content hr { height: 2px; border: 0; background: var(--color-divider); margin: 32px 0; }

/* Гутенберг ені */
.tm-content .alignwide { max-width: calc(100% + 120px); margin-left: -60px; margin-right: -60px; width: auto; }
.tm-content .alignfull { max-width: none; }
.tm-content .alignleft { float: left; margin: 6px 24px 16px 0; max-width: 45%; }
.tm-content .alignright { float: right; margin: 6px 0 16px 24px; max-width: 45%; }
.tm-content .aligncenter { margin-left: auto; margin-right: auto; }
.tm-content::after { content: ""; display: table; clear: both; }

.tm-post-tags { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 28px; max-width: var(--tm-measure); }

.tm-related { margin-top: 44px; padding-top: 20px; border-top: 2px solid var(--color-divider); max-width: var(--tm-measure); }
.tm-related .tm-sechd { margin-bottom: 18px; }
.tm-related-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.tm-related-item { display: flex; flex-direction: column; gap: 10px; min-width: 0; }
.tm-related-img { height: 104px; }
.tm-related-title { margin: 0; font: 800 16px/1.24 var(--font-heading); }

.tm-post-side { padding: 40px var(--tm-in); min-width: 0; }
.tm-post-side .tm-sechd { margin-bottom: 12px; padding-bottom: 12px; border-bottom: 2px solid var(--color-divider); }

.tm-sub {
	margin-top: 32px;
	padding: 24px;
	background: var(--color-accent);
	color: var(--color-bg);
}

.tm-sub-l {
	font: 600 11px/1 var(--font-body);
	letter-spacing: .14em;
	text-transform: uppercase;
	opacity: .9;
}

.tm-sub-t {
	margin: 12px 0 16px;
	font: 800 22px/1.15 var(--font-heading);
	letter-spacing: -.02em;
}

.tm-sub .tm-btn-ghost { color: var(--color-bg); border-color: var(--color-bg); width: 100%; border-style: solid; }
.tm-sub .tm-btn-ghost:hover { background: rgba(243, 242, 242, .16); color: var(--color-bg); }

/* Пікірлер */
.tm-comments { margin-top: 44px; padding-top: 20px; border-top: 2px solid var(--color-divider); max-width: var(--tm-measure); }
.tm-comments .tm-sechd { margin-bottom: 18px; }
.tm-comment-list { list-style: none; margin: 0; padding: 0; }
.tm-comment-list ol { list-style: none; margin: 0 0 0 32px; padding: 0; }
.tm-comment-list article { padding: 18px 0; border-bottom: 1px solid var(--color-divider); }
.tm-comment-meta { display: flex; align-items: center; gap: 12px; font-size: 12.5px; color: var(--tm-t62); margin-bottom: 8px; }
.tm-comment-meta b { font: 800 13px/1 var(--font-heading); color: var(--color-text); }
.tm-comment-body { font-size: 15.5px; line-height: 1.6; }
.tm-comment-body p { margin: 0 0 10px; }
.tm-comment-body p:last-child { margin-bottom: 0; }
.tm-comments .comment-respond { margin-top: 28px; }
.tm-comments .comment-reply-title { font: 800 15px/1 var(--font-heading); letter-spacing: .02em; text-transform: uppercase; margin-bottom: 14px; }
.tm-comments .comment-form p { margin-bottom: 14px; }
.tm-comments .comment-form label { display: block; font-size: 12px; margin-bottom: 5px; color: var(--tm-t70); }
.tm-comments .comment-form input[type="text"],
.tm-comments .comment-form input[type="email"],
.tm-comments .comment-form input[type="url"],
.tm-comments .comment-form textarea {
	width: 100%;
	min-height: 36px;
	padding: 6px 10px;
	font: inherit;
	font-size: 14px;
	color: var(--color-text);
	background: var(--color-surface);
	border: 1px solid var(--color-divider);
	border-radius: var(--radius-md);
}

.tm-comments .comment-form textarea { min-height: 120px; resize: vertical; }
.tm-comments .form-submit input[type="submit"] {
	display: inline-flex;
	cursor: pointer;
	font: 800 14px/1.2 var(--font-heading);
	background: var(--color-accent);
	color: var(--color-bg);
	border: 1px solid transparent;
	padding: var(--space-2) 14.4px;
	border-radius: var(--radius-md);
}

.tm-comments .form-submit input[type="submit"]:hover { background: var(--color-accent-600); }

/* ==========================================================================
   19. Айдар / мұрағат беті
   ========================================================================== */

.tm-arc-hd {
	padding: 44px var(--tm-gut) 24px;
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 40px;
}

.tm-arc-hd-l { display: flex; flex-direction: column; gap: 14px; min-width: 0; }

.tm-arc-title {
	margin: 0;
	font: 800 72px/.96 var(--font-heading);
	letter-spacing: -.04em;
	margin-left: -.04em;
}

.tm-arc-desc {
	margin: 0;
	max-width: 52ch;
	font-size: 16px;
	line-height: 1.6;
	color: var(--tm-t72);
}

.tm-arc-count {
	font: 800 13px/1 var(--font-heading);
	font-feature-settings: "tnum" 1;
	color: var(--tm-t55);
	white-space: nowrap;
	flex: none;
}

.tm-arc-tags {
	display: flex;
	gap: 8px;
	flex-wrap: wrap;
	padding: 0 var(--tm-gut) 22px;
	border-bottom: 2px solid var(--color-divider);
}

.tm-arc-grid { display: grid; grid-template-columns: minmax(0, 1fr) var(--tm-aside-sm); }

.tm-arc-list {
	padding: 24px var(--tm-gut) 48px;
	border-right: 2px solid var(--color-divider);
	display: flex;
	flex-direction: column;
	min-width: 0;
}

.tm-arc-item {
	display: grid;
	grid-template-columns: 280px minmax(0, 1fr);
	gap: 28px;
	padding: 26px 0;
	border-bottom: 1px solid var(--color-divider);
}

.tm-arc-img { height: 168px; }
.tm-arc-txt { display: flex; flex-direction: column; gap: 10px; min-width: 0; }

.tm-arc-item-title {
	margin: 0;
	font: 800 28px/1.14 var(--font-heading);
	letter-spacing: -.022em;
}

.tm-arc-exc {
	margin: 0;
	max-width: 60ch;
	font-size: 15px;
	line-height: 1.6;
	color: var(--tm-t74);
}

.tm-arc-more { margin-top: 28px; align-self: flex-start; }
.tm-arc-side { padding: 32px var(--tm-in) 40px; min-width: 0; }
.tm-arc-side .tm-sechd { margin-bottom: 12px; padding-bottom: 12px; border-bottom: 2px solid var(--color-divider); }
.tm-arc-side .tm-sechd-2 { margin: 32px 0 12px; }

.tm-sub-cat {
	padding: 12px 0;
	border-bottom: 1px solid var(--color-divider);
	display: flex;
	justify-content: space-between;
	gap: 12px;
}

.tm-sub-cat .tm-ln { font-weight: 600; }

/* Беттеу */
.tm-pagination { margin-top: 28px; display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }

.tm-pagination .page-numbers {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 38px;
	height: 38px;
	padding: 0 10px;
	border: 1px solid var(--color-divider);
	font: 800 13px/1 var(--font-heading);
	font-feature-settings: "tnum" 1;
}

.tm-pagination .page-numbers:hover { background: var(--tm-t07); }
.tm-pagination .page-numbers.current { background: var(--color-accent); border-color: var(--color-accent); color: var(--color-bg); }
.tm-pagination .page-numbers.dots { border-color: transparent; }

/* Іздеу / 404 / бет */
.tm-plain { padding: 44px var(--tm-art) 60px; min-width: 0; }
.tm-plain-title { margin: 0 0 24px; font: 800 54px/1.04 var(--font-heading); letter-spacing: -.03em; margin-left: -.03em; }
.tm-searchform { display: flex; gap: 8px; max-width: 460px; margin-top: 20px; }
.tm-searchform .tm-input { flex: 1; }
.tm-notfound { padding: 90px var(--tm-gut) 110px; text-align: center; }
.tm-notfound-code { font: 800 140px/.9 var(--font-heading); letter-spacing: -.05em; color: var(--color-accent); }
.tm-notfound-t { margin: 22px 0 10px; font: 800 32px/1.1 var(--font-heading); letter-spacing: -.02em; }
.tm-notfound-p { margin: 0 auto 26px; max-width: 46ch; font-size: 16px; line-height: 1.6; color: var(--tm-t72); }
.tm-notfound .tm-searchform { margin: 0 auto; }

/* Виджет аймағы */
.tm-widgets { margin-top: 32px; }
.tm-widget + .tm-widget { margin-top: 28px; }
.tm-widget-title { margin: 0 0 12px; padding-bottom: 12px; border-bottom: 2px solid var(--color-divider); font: 800 15px/1 var(--font-heading); letter-spacing: .02em; text-transform: uppercase; }
.tm-widget ul { list-style: none; margin: 0; padding: 0; }
.tm-widget li { padding: 10px 0; border-bottom: 1px solid var(--color-divider); font-size: 14px; line-height: 1.4; }

/* ==========================================================================
   20. Мобильді төменгі мәзір
   ========================================================================== */

.tm-mobnav {
	display: none;
	justify-content: space-between;
	padding: 12px 22px;
	border-top: 2px solid var(--color-divider);
}

.tm-mobnav a {
	font: 800 10px/1.6 var(--font-heading);
	letter-spacing: .08em;
	text-transform: uppercase;
	color: var(--tm-t55);
}

.tm-mobnav .current-menu-item > a,
.tm-mobnav a.tm-on { color: var(--color-accent); }

/* Жайылмалы мобильді мәзір */
.tm-drawer { display: none; border-bottom: 2px solid var(--color-divider); max-height: 70vh; overflow-y: auto; }
.tm-drawer.is-open { display: block; }
.tm-drawer ul { list-style: none; margin: 0; padding: 0; }
.tm-drawer li { border-bottom: 1px solid var(--color-divider); }
.tm-drawer li:last-child { border-bottom: 0; }
.tm-drawer a { display: block; padding: 13px var(--tm-gut); font: 800 15px/1 var(--font-heading); }
.tm-drawer .sub-menu a { padding-left: calc(var(--tm-gut) + 18px); font: 600 14px/1 var(--font-body); }

/* Десктопта бургер жоқ, сондықтан жайылмалы мәзір де болмауы керек:
   телефонда ашық қалдырып, терезені ұлғайтқанда ол көрініп тұрар еді. */
@media (min-width: 768px) {
	.tm-drawer,
	.tm-drawer.is-open { display: none; }
}

/* ==========================================================================
   21. Бейімделу
   ========================================================================== */

@media (max-width: 1439px) {
	.tm-frame { box-shadow: none; }
}

/* Тар экранда жабысқақ жарнама бағанына орын жетпейді. */
@media (max-width: 1199px) {
	.tm-rail { display: none; }
	.tm-post { --tm-measure: 100%; }
}

@media (max-width: 1279px) {
	:root {
		--tm-gut: 28px;
		--tm-in: 24px;
		--tm-in2: 22px;
		--tm-art: 32px;
		--tm-aside: 300px;
		--tm-aside-sm: 290px;
	}

	.tm-hero { grid-template-columns: minmax(0, 1fr) 320px; gap: 26px; }
	.tm-hero-title { font-size: 40px; }
	.tm-hero-img { height: 250px; }
	.tm-grid4 { gap: 18px; }
	.tm-duo-t { font-size: 34px; }
	.tm-iv-txt { padding: 40px 36px 40px var(--tm-gut); }
	.tm-iv-title { font-size: 36px; }
	.tm-iv-img { min-height: 440px; }
	.tm-post-title { font-size: 44px; }
	.tm-post-hero { height: 340px; }
	.tm-arc-title { font-size: 56px; }
	.tm-arc-item { grid-template-columns: 220px minmax(0, 1fr); gap: 22px; }
	.tm-arc-img { height: 140px; }
	.tm-nav { gap: 20px; }
	.tm-nav ul { gap: 20px; overflow-x: auto; scrollbar-width: none; }
	.tm-nav ul::-webkit-scrollbar { display: none; }
}

@media (max-width: 1023px) {
	.tm-main-grid,
	.tm-post-grid,
	.tm-arc-grid { grid-template-columns: minmax(0, 1fr); }

	.tm-main-col,
	.tm-post,
	.tm-arc-list { border-right: 0; }

	.tm-side-col,
	.tm-post-side,
	.tm-arc-side { border-top: 2px solid var(--color-divider); padding-left: var(--tm-gut); padding-right: var(--tm-gut); }

	.tm-grid4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.tm-duo { grid-template-columns: minmax(0, 1fr); }
	.tm-duo-a { border-right: 0; border-bottom: 2px solid var(--color-divider); }
	.tm-duo-b .tm-duo-hd { padding: 30px var(--tm-gut) 16px; }
	.tm-duo-hd { padding: 30px var(--tm-gut) 16px; }
	.tm-lead-cap,
	.tm-duo-b .tm-lead-cap { padding: 24px var(--tm-gut) 22px; }
	.tm-duo-list,
	.tm-duo-b .tm-duo-list { padding: 0 var(--tm-gut) 30px; }

	.tm-iv-body { grid-template-columns: minmax(0, 1fr); }
	.tm-iv-img { min-height: 320px; order: -1; }
	.tm-iv-txt { padding: 34px var(--tm-gut); }

	.tm-trio { grid-template-columns: minmax(0, 1fr); }
	.tm-trio-col { padding-left: var(--tm-gut) !important; padding-right: var(--tm-gut) !important; border-right: 0 !important; border-bottom: 1px solid var(--color-divider); }
	.tm-trio-col:last-child { border-bottom: 0; }

	.tm-footer-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.tm-fcol { border-bottom: 1px solid var(--color-divider); }
	.tm-fcol-2, .tm-fcol-4 { border-right: 0; }
	.tm-fcol-1 { padding: 30px var(--tm-gut); }
	.tm-fcol-2 { padding: 30px var(--tm-gut); }
	.tm-fcol-3 { padding: 30px var(--tm-gut); }
	.tm-fcol-4 { padding: 30px var(--tm-gut); }
	.tm-fcol-3, .tm-fcol-4 { border-bottom: 0; }

	.tm-related-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.tm-content .alignwide { max-width: 100%; margin-left: 0; margin-right: 0; }
}

/* Мобильді нұсқа — дизайндағы 390px макеті */
@media (max-width: 767px) {
	:root {
		--tm-gut: 16px;
		--tm-in: 16px;
		--tm-in2: 16px;
		--tm-art: 16px;
	}

	body { font-size: 15px; }

	/* Шұғыл — бір жол, жүгірмесіз */
	.tm-breaking { gap: 10px; padding: 8px var(--tm-gut); }
	.tm-breaking-badge { font-size: 9.5px; padding: 4px 6px; }
	.tm-mq { -webkit-mask-image: none; mask-image: none; }
	.tm-mqtrack { animation: none; width: 100%; }
	.tm-mqitem { font-size: 13px; line-height: 1.25; padding-right: 0; white-space: normal; }
	.tm-mqitem:not(:first-child) { display: none; }
	.tm-mqitem span { display: none; }

	/* Қызмет жолағы */
	.tm-topbar {
		gap: 10px;
		padding: 8px var(--tm-gut);
		height: auto;
		font-size: 10.5px;
		color: var(--tm-t60);
		overflow: hidden;
	}

	.tm-topbar-date,
	.tm-topbar-search,
	.tm-topbar > .tm-lang { display: none; }
	.tm-topbar-rates { gap: 10px; padding-left: 0; border-left: 0; }
	.tm-topbar-weather { padding-left: 0; border-left: 0; }
	.tm-topbar-rates .tm-rate-up,
	.tm-topbar-rates .tm-rate-down { display: none; }
	.tm-topbar-soc { gap: 4px; padding-right: 0; border-right: 0; }
	.tm-topbar-soc .tm-soc { width: 20px; height: 20px; }
	.tm-topbar-soc .tm-soc:nth-child(n+4) { display: none; }

	/* Бренд */
	.tm-brand { align-items: center; padding: 14px var(--tm-gut); border-bottom: 2px solid var(--color-divider); }
	.tm-logo { font-size: 22px; letter-spacing: -.03em; margin-left: 0; }
	.tm-logo img { max-height: calc(var(--tm-logo-h, 60px) * .58); }
	.tm-tagline,
	.tm-brand-r { display: none; }
	.tm-brand-m { display: flex; }

	/* Мәзір */
	.tm-nav { gap: 18px; padding: 12px var(--tm-gut); height: auto; border-top: 0; }
	.tm-nav ul { gap: 18px; overflow-x: auto; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
	.tm-nav ul::-webkit-scrollbar { display: none; }
	.tm-nav a { font-size: 13px; }
	.tm-nav .sub-menu { display: none !important; }
	.tm-nav-all { display: none; }

	/* «Жоғарыға» түймесі */
	.tm-gotop { right: 16px; bottom: 16px; width: 42px; height: 42px; }

	/* Бас бет */
	.tm-main-col { padding: 20px var(--tm-gut) 24px; }
	.tm-side-col { padding: 8px var(--tm-gut) 20px; border-top: 2px solid var(--color-divider); }

	.tm-hero { grid-template-columns: minmax(0, 1fr); gap: 12px; }
	.tm-hero-img-link { order: -1; }
	.tm-hero-img { height: 200px; }
	.tm-hero-title { font: 800 27px/1.1 var(--font-heading); letter-spacing: -.025em; margin-left: -.03em; }
	.tm-hero-exc { font-size: 15px; }
	.tm-hr { margin: 16px 0 4px; }

	/* Хабар торы — дизайндағы мобильді тізім түрі */
	.tm-grid4,
	.tm-grid4-2 { display: flex; flex-direction: column; gap: 0; }
	.tm-grid4-2 { margin-top: 0; padding-top: 0; border-top: 0; }

	.tm-card,
	.tm-grid4-2 .tm-card {
		display: grid;
		grid-template-columns: 96px minmax(0, 1fr);
		gap: 12px;
		padding: 14px 0;
		border-bottom: 1px solid var(--color-divider);
		align-items: start;
	}

	.tm-card-img { height: 68px; }
	.tm-card-txt { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
	.tm-card-title { font: 800 15px/1.24 var(--font-heading); letter-spacing: 0; }

	/* Бүйірлік */
	.tm-side-block { margin-top: 26px; }

	/* Екі айдар блогы */
	.tm-duo-t { font-size: 30px; }
	.tm-lead { height: 240px; }
	.tm-lead-title { font-size: 21px; }
	.tm-row { grid-template-columns: 96px minmax(0, 1fr); gap: 12px; padding: 14px 0; }
	.tm-row-img { height: 68px; }
	.tm-row-title { font-size: 16px; }

	/* Сұхбат */
	.tm-iv-strip { gap: 10px; padding: 12px var(--tm-gut); flex-wrap: wrap; }
	.tm-iv-label { display: none; }
	.tm-iv-img { min-height: 240px; }
	.tm-iv-txt { padding: 26px var(--tm-gut); gap: 18px; }
	.tm-iv-title { font-size: 27px; letter-spacing: -.025em; }
	.tm-iv-exc { font-size: 15px; }
	.tm-iv-meta { gap: 12px; }
	.tm-iv-sep { display: none; }

	/* Үш айдар */
	.tm-trio-col { padding: 24px var(--tm-gut) 28px; }
	.tm-trio-img { height: 190px; }
	.tm-trio-title { font-size: 20px; }
	.tm-srow { grid-template-columns: 88px minmax(0, 1fr); }

	/* Футер */
	.tm-footer-grid { grid-template-columns: minmax(0, 1fr); }
	.tm-fcol { padding: 26px var(--tm-gut) !important; border-right: 0; border-bottom: 1px solid var(--color-divider); }
	.tm-fcol-4 { border-bottom: 0; }
	.tm-flogo { font-size: 24px; }
	.tm-fbottom { gap: 10px; padding: 14px var(--tm-gut); font-size: 11.5px; }
	.tm-fbottom-r { margin-left: 0; }

	/* Жеке жазба */
	.tm-post { padding: 20px var(--tm-gut) 30px; border-right: 0; --tm-measure: 100%; }
	.tm-post-title { font: 800 28px/1.1 var(--font-heading); letter-spacing: -.025em; margin: 14px 0 0; margin-left: -.02em; max-width: none; }
	.tm-post-lead { font-size: 16.5px; margin-top: 14px; max-width: none; }
	.tm-post-meta { gap: 12px; margin: 18px 0; font-size: 12px; }
	.tm-share { margin-left: 0; width: 100%; }
	.tm-post-hero { height: 220px; }
	.tm-content { margin-top: 22px; font-size: 16.5px; line-height: 1.7; }
	.tm-content h2 { font-size: 23px; }
	.tm-content h3 { font-size: 20px; }
	.tm-content blockquote { font-size: 19px; padding-left: 14px; }
	.tm-related-grid { grid-template-columns: minmax(0, 1fr); gap: 0; }
	.tm-related-item { display: grid; grid-template-columns: 96px minmax(0, 1fr); gap: 12px; padding: 14px 0; border-bottom: 1px solid var(--color-divider); }
	.tm-related-img { height: 68px; }
	.tm-related-title { font-size: 15px; }
	.tm-post-side { padding: 24px var(--tm-gut) 30px; border-top: 2px solid var(--color-divider); }

	/* Айдар беті */
	.tm-arc-hd { padding: 24px var(--tm-gut) 16px; flex-direction: column; align-items: flex-start; gap: 12px; }
	.tm-arc-title { font-size: 40px; letter-spacing: -.03em; margin-left: -.03em; }
	.tm-arc-desc { font-size: 15px; }
	.tm-arc-tags { padding: 0 var(--tm-gut) 16px; }
	.tm-arc-list { padding: 8px var(--tm-gut) 30px; border-right: 0; }
	.tm-arc-item { grid-template-columns: 96px minmax(0, 1fr); gap: 12px; padding: 14px 0; }
	.tm-arc-img { height: 68px; }
	.tm-arc-item-title { font-size: 16px; letter-spacing: -.01em; }
	.tm-arc-exc { display: none; }
	.tm-arc-side { padding: 24px var(--tm-gut) 30px; border-top: 2px solid var(--color-divider); }

	.tm-plain { padding: 24px var(--tm-gut) 36px; }
	.tm-plain-title { font-size: 30px; }
	.tm-notfound { padding: 50px var(--tm-gut) 60px; }
	.tm-notfound-code { font-size: 92px; }

	/* Төменгі мәзір */
	.tm-mobnav { display: flex; }
	body.tm-has-mobnav { padding-bottom: 0; }
}

@media (max-width: 359px) {
	.tm-mobnav { padding: 12px 14px; }
	.tm-notfound-code { font-size: 72px; }
}

/* ==========================================================================
   22. Басып шығару
   ========================================================================== */

@media print {
	.tm-breaking,
	.tm-topbar,
	.tm-nav,
	.tm-sticky,
	.tm-progress,
	.tm-gotop,
	.tm-share,
	.tm-ad,
	.tm-mobnav,
	.tm-post-side,
	.tm-related,
	.tm-comments,
	.tm-footer { display: none !important; }

	.tm-post { border-right: 0; padding: 0; }
	.tm-post-grid { display: block; }
	body { background: #fff; }
}