/* ===== Цифрлық университет (page-digital-university-new.php) — шрифт сайттан, бөлек font-family жоқ =====
   Баннер — сайттың ортақ баннері (.str-hero → page-hero.css), биіктігі аз. Сервистер — ACF (inc/digital-university.php). */

.screen-reader-text { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(1px, 1px, 1px, 1px); white-space: nowrap; }

/* Баннер: ортақ фон + цифрлық тор + оң жақта сервистердің «қолданбалар тақтасы» (ACF-тегі алғашқы 6 сервис) */
.str-hero.du2-hero { min-height: 260px !important; }
.du2-hero .str-hero__content { padding-top: 56px !important; padding-bottom: 40px !important; }
.du2-hero__grid { position: absolute; inset: 0; z-index: 1; pointer-events: none;
	background-image: radial-gradient(rgba(255,255,255,.22) 1px, transparent 1.4px), linear-gradient(rgba(255,255,255,.045) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.045) 1px, transparent 1px);
	background-size: 24px 24px, 96px 96px, 96px 96px;
	-webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 45%, #000 100%); mask-image: linear-gradient(90deg, transparent 0%, #000 45%, #000 100%); }
.du2-hero__inner { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 24px 48px; }
.du2-hero__text { min-width: 0; }
.du2-hero__apps { display: grid; grid-template-columns: repeat(3, 116px); gap: 12px; }
.du2-app { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; height: 92px; padding: 10px 8px; border: 1px solid rgba(255,255,255,.16); border-radius: 18px; background: rgba(255,255,255,.07); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); color: #fff !important; text-align: center; text-decoration: none !important; transition: transform .2s, background .2s, border-color .2s; animation: duApp .5s ease-out both; animation-delay: calc(var(--d, 0) * 60ms); }
.du2-app:nth-child(3n+2) { transform: translateY(14px); } /* ортаңғы баған сәл төмен */
.du2-app:hover { background: rgba(255,255,255,.16); border-color: rgba(245,196,107,.6); transform: translateY(-2px); }
.du2-app:nth-child(3n+2):hover { transform: translateY(12px); }
.du2-app:focus-visible { outline: 2px solid #F5C46B; outline-offset: 2px; }
.du2-app__ico { display: inline-flex; align-items: center; justify-content: center; width: 38px; height: 38px; border-radius: 12px; background: rgba(245,196,107,.16); color: #F5C46B; }
.du2-app__ico svg { width: 21px; height: 21px; }
.du2-app__ttl { display: -webkit-box; max-width: 100%; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 2; line-clamp: 2; font-size: 11.5px; font-weight: 700; line-height: 1.25; }
@keyframes duApp { from { opacity: 0; transform: translateY(14px); } }
@media (prefers-reduced-motion: reduce) { .du2-app { animation: none; } }
.du2-hero .str-hero__label { font-family: inherit !important; }
.du2-hero__lead { max-width: 640px; margin: 0 0 16px; color: #cfe0f5; font-size: 15px; line-height: 1.6; }
.du2-hero__meta { display: inline-flex; align-items: baseline; gap: 6px; padding: 6px 14px; border: 1px solid rgba(255,255,255,.25); border-radius: 50px; background: rgba(255,255,255,.08); color: #fff !important; font-size: 13px; font-weight: 600; line-height: 1.2; text-decoration: none !important; transition: background .15s; }
.du2-hero__meta:hover { background: rgba(255,255,255,.16); }
.du2-hero__meta b { color: #F5C46B; font-size: 15px; }

/* Сервистер */
.du2 { padding: 44px 0 56px; background: #F8FBFF; color: #0A1628; scroll-margin-top: 80px; }
.du2-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px 32px; flex-wrap: wrap; margin-bottom: 24px; }
.du2-ttl { margin: 0 0 6px !important; font-size: 26px !important; font-weight: 700 !important; line-height: 1.3 !important; color: #0A1628 !important; }
.du2-sub { margin: 0; color: #64748b; font-size: 14.5px; }


.du2-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
.du2-card { display: flex; flex-direction: column; padding: 20px; border: 1px solid #e3ebf6; border-radius: 18px; background: #fff; box-shadow: 0 6px 18px rgba(10,22,40,.04); color: #0A1628 !important; text-decoration: none !important; transition: transform .2s, box-shadow .2s, border-color .2s; }
.du2-card:hover { transform: translateY(-3px); border-color: #c9d9ee; box-shadow: 0 16px 34px rgba(10,22,40,.10); }
.du2-card:focus-visible { outline: 3px solid #0052A5; outline-offset: 3px; }
.du2-card__ico { display: inline-flex; align-items: center; justify-content: center; width: 48px; height: 48px; margin-bottom: 16px; border-radius: 14px; background: #EEF5FF; color: #0052A5; transition: background .2s, color .2s; }
.du2-card__ico svg { width: 24px; height: 24px; }
.du2-card:hover .du2-card__ico { background: #0052A5; color: #fff; }
.du2-card__ttl { margin-bottom: 6px; font-size: 16px; font-weight: 700; line-height: 1.35; }
.du2-card__desc { margin-bottom: 16px; color: #64748b; font-size: 13px; line-height: 1.5; }
.du2-card__foot { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: auto; }
.du2-card__cat { padding: 4px 10px; border-radius: 50px; background: #F1F5FA; color: #475569; font-size: 11.5px; font-weight: 700; letter-spacing: .02em; }
.du2-card__go { display: inline-flex; align-items: center; justify-content: center; flex: 0 0 34px; width: 34px; height: 34px; margin-left: auto; border-radius: 50%; background: #F1F5FA; color: #0052A5; transition: background .2s, color .2s, transform .2s; }
.du2-card__go svg { width: 16px; height: 16px; }
.du2-card:hover .du2-card__go { background: linear-gradient(135deg, #f5c46b 0%, #e0a526 100%); color: #0A1628; }

/* Ерекшеленген карточка — баннер түсімен */
.du2-card--featured { border-color: transparent; background: linear-gradient(135deg, #0A1628 0%, #0b2f63 55%, #0052A5 100%); color: #fff !important; }
.du2-card--featured .du2-card__ico { background: rgba(255,255,255,.12); color: #F5C46B; }
.du2-card--featured:hover .du2-card__ico { background: linear-gradient(135deg, #f5c46b 0%, #e0a526 100%); color: #0A1628; }
.du2-card--featured .du2-card__desc { color: #cfe0f5; }
.du2-card--featured .du2-card__cat { background: rgba(255,255,255,.12); color: #fff; }
.du2-card--featured .du2-card__go { background: rgba(255,255,255,.12); color: #fff; }

/* Цифрлық экожүйе */
.du2-eco { padding: 0 0 64px; background: #F8FBFF; }
.du2-eco__box { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); grid-template-areas: "text epvo" "who who"; align-items: center; gap: 24px 36px; padding: 32px; border: 1px solid #e3ebf6; border-radius: 24px; background: #fff; }
.du2-eco__text { grid-area: text; }
.du2-eco__text p { margin: 8px 0 0; color: #334155; font-size: 15px; line-height: 1.7; }
.du2-eco__epvo { grid-area: epvo; display: flex; flex-direction: column; align-items: flex-start; gap: 14px; padding: 20px 22px; border-radius: 18px; background: #EEF5FF; color: #0A1628 !important; text-decoration: none !important; transition: background .15s; }
.du2-eco__epvo:hover { background: #e2eeff; }
.du2-eco__epvo span { font-size: 14px; font-weight: 600; line-height: 1.45; }
.du2-eco__epvo b { display: inline-flex; align-items: center; gap: 8px; padding: 10px 16px; border-radius: 12px; background: #0052A5; color: #fff; font-size: 13.5px; white-space: nowrap; }
.du2-eco__epvo b svg { width: 16px; height: 16px; }
.du2-eco__epvo:hover b { background: #003B78; }

.du2-eco__who { grid-area: who; padding: 20px 22px 22px; border-radius: 18px; background: #F8FBFF; }
.du2-eco__whottl { margin: 0 0 14px !important; font-size: 16px !important; font-weight: 700 !important; color: #0A1628 !important; }
/* Қатысушылар — бір жолда */
.du2-eco__who ul { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 10px; margin: 0; padding: 0; list-style: none; }
.du2-eco__who li { display: flex; flex-direction: column; align-items: center; gap: 10px; margin: 0; padding: 16px 10px; border: 1px solid #e3ebf6; border-radius: 14px; background: #fff; color: #1e293b; font-size: 13.5px; line-height: 1.35; text-align: center; }
.du2-eco__ico { display: inline-flex; align-items: center; justify-content: center; width: 42px; height: 42px; border-radius: 12px; background: #EEF5FF; color: #0052A5; }
.du2-eco__ico svg { width: 21px; height: 21px; }

@media (max-width: 1199px) { .du2-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } .du2-hero__apps { grid-template-columns: repeat(3, 100px); } }
@media (max-width: 991px) {
	.du2-hero__inner { grid-template-columns: 1fr; }
	.du2-hero__apps { display: none; }
	.du2-eco__box { grid-template-columns: minmax(0, 1fr); grid-template-areas: "text" "epvo" "who"; } /* minmax(0) — жылжитын қатысушылар бағанды кеңейтпейді */
	.du2-eco__who { min-width: 0; }
	.du2-eco__who li { padding: 14px 8px; font-size: 13px; }
}
@media (max-width: 767px) {
	.du2-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
	/* Қатысушылар — бәрі көрінеді: әрқайсысы өз жолында (5 жол), иконка + мәтін */
	.du2-eco__who ul { grid-template-columns: 1fr; gap: 8px; }
	.du2-eco__who li { flex-direction: row; gap: 12px; padding: 10px 12px; text-align: left; font-size: 14px; }
	.du2-eco__ico { flex: 0 0 36px; width: 36px; height: 36px; border-radius: 10px; }
	.du2-eco__ico svg { width: 19px; height: 19px; }
}
@media (max-width: 600px) {
	.du2-hero .str-hero__content { padding-top: 30px !important; padding-bottom: 26px !important; }
	.du2-hero__lead { font-size: 14px; }
	.du2 { padding: 28px 0 40px; }
	.du2-ttl { font-size: 21px !important; }
	/* Телефонда — ықшам тізім: иконка | атауы + сипаттамасы | жебе */
	.du2-grid { grid-template-columns: 1fr; gap: 10px; }
	.du2-card { display: grid; grid-template-columns: 44px minmax(0, 1fr) 32px; grid-template-areas: "ico ttl go" "ico desc go"; align-items: center; column-gap: 14px; padding: 14px; border-radius: 16px; }
	.du2-card:hover { transform: none; }
	.du2-card__ico { grid-area: ico; width: 44px; height: 44px; margin: 0; align-self: center; }
	.du2-card__ico svg { width: 22px; height: 22px; }
	.du2-card__ttl { grid-area: ttl; align-self: end; margin: 0; font-size: 15px; }
	.du2-card__desc { grid-area: desc; align-self: start; margin: 2px 0 0; font-size: 12.5px; }
	.du2-card__ttl:has(+ .du2-card__foot) { grid-row: 1 / span 2; align-self: center; } /* сипаттамасы жоқ сервис */
	.du2-card__foot { display: contents; }
	.du2-card__cat { display: none; }
	.du2-card__go { grid-area: go; width: 32px; height: 32px; flex-basis: 32px; margin: 0; }
	.du2-eco { padding-bottom: 44px; }
	.du2-eco__box { padding: 20px 16px; border-radius: 18px; }
	.du2-eco__who { padding: 16px; }
	.du2-eco__epvo b { width: 100%; justify-content: center; }
}

/* Нашар көретіндерге арналған нұсқа */
html body .bvi-body[data-bvi-theme]:not(.bvi-no-styles) :is(.du2-card, .du2-card__ico, .du2-card__cat, .du2-card__go, .du2-eco__box, .du2-eco__who, .du2-eco__who li, .du2-eco__ico, .du2-eco__epvo, .du2-eco__epvo b, .du2-hero__meta) { background: var(--bvi-site-bg) !important; border: 2px solid var(--bvi-site-color) !important; box-shadow: none !important; color: var(--bvi-site-color) !important; }
