/* ============================================================================
   ch-169x — صفحهٔ اول، دور دوم (فقط ظاهر). بازگشت: حذف <link> این فایل از page.html.
   ============================================================================ */

/* ── بخش آموزش: دو صحنهٔ تازه (اینفوگرافی، گفت‌وگوی چندنفره) و نوار زمان ویدئو؛ هر صحنه یک تصویر آرام و خلوت ── */
.tk-public-body .tktr .tktr-console.is-info .tktr-media__info,
.tk-public-body .tktr .tktr-console.is-panel .tktr-media__panel{opacity:1;visibility:visible}

/* ویدئو: قاب با دکمهٔ پخش، نوار زمان پایین و زمان پخش */
.tk-public-body .tktr .tktr-media__video{overflow:hidden}
.tk-public-body .tktr .tktr-vbar{position:absolute;direction:ltr;inset-inline:12px;bottom:12px;height:3px;border-radius:3px;background:rgba(244,242,236,.16)}
.tk-public-body .tktr .tktr-vbar i{position:absolute;inset-block:0;inset-inline-start:0;width:44%;border-radius:inherit;background:var(--tktr-li)}
.tk-public-body .tktr .tktr-console.is-video .tktr-vbar i{animation:tkx-vbar 7s linear infinite}
@keyframes tkx-vbar{from{width:8%}to{width:92%}}
.tk-public-body .tktr .tktr-vtime{position:absolute;inset-inline-end:12px;bottom:20px;font-size:10.5px;font-weight:600;color:rgba(244,242,236,.62);direction:ltr;font-variant-numeric:tabular-nums}

/* اینفوگرافی: یک حلقهٔ درصد و سه نوار برچسب‌دار */
.tk-public-body .tktr .tktr-media__info{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:18px}
.tk-public-body .tktr .tktr-donut{position:relative;display:grid;place-items:center;width:78px;height:78px;border-radius:50%;
  background:conic-gradient(var(--tktr-li) calc(var(--v,.6)*360deg),rgba(244,242,236,.1) 0)}
.tk-public-body .tktr .tktr-donut::before{content:"";position:absolute;inset:9px;border-radius:50%;background:var(--tktr-deep)}
.tk-public-body .tktr .tktr-donut b{position:relative;font-size:15px;font-weight:800;color:var(--tktr-ink)}
.tk-public-body .tktr .tktr-ibars{display:grid;gap:9px;min-width:0}
.tk-public-body .tktr .tktr-ibars span{display:grid;gap:4px}
.tk-public-body .tktr .tktr-ibars em{font-style:normal;font-size:11.5px;font-weight:600;color:var(--tktr-soft);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tk-public-body .tktr .tktr-ibars i{position:relative;display:block;height:6px;border-radius:999px;background:rgba(244,242,236,.08)}
.tk-public-body .tktr .tktr-ibars i::before{content:"";position:absolute;inset-block:0;inset-inline-start:0;width:calc(var(--v,0)*100%);border-radius:inherit;background:rgba(var(--tktr-li-rgb),.85)}
.tk-public-body .tktr .tktr-ibars span:nth-child(2) i::before{background:rgba(var(--tktr-li-rgb),.6)}
.tk-public-body .tktr .tktr-ibars span:nth-child(3) i::before{background:rgba(var(--tktr-li-rgb),.38)}
.tk-public-body .tktr .tktr-console.is-info .tktr-ibars i::before{animation:tkx-grow .9s var(--tk-ease,ease) both}
.tk-public-body .tktr .tktr-console.is-info .tktr-ibars span:nth-child(2) i::before{animation-delay:.12s}
.tk-public-body .tktr .tktr-console.is-info .tktr-ibars span:nth-child(3) i::before{animation-delay:.24s}
@keyframes tkx-grow{from{width:0}}

/* گفت‌وگوی چندنفره: سه چهره که به نوبت حرف می‌زنند و دو خط حرف */
.tk-public-body .tktr .tktr-media__panel{display:grid;align-content:center;gap:14px}
.tk-public-body .tktr .tktr-ppl{display:flex;gap:10px}
.tk-public-body .tktr .tktr-ppl em{display:grid;place-items:center;width:38px;height:38px;border-radius:50%;font-style:normal;font-size:13px;font-weight:800;
  color:var(--tktr-ink);background:rgba(244,242,236,.08);box-shadow:0 0 0 1px var(--tktr-line)}
.tk-public-body .tktr .tktr-console.is-panel .tktr-ppl em{animation:tkx-talk 4.5s ease-in-out infinite}
.tk-public-body .tktr .tktr-console.is-panel .tktr-ppl em:nth-child(2){animation-delay:1.5s}
.tk-public-body .tktr .tktr-console.is-panel .tktr-ppl em:nth-child(3){animation-delay:3s}
@keyframes tkx-talk{0%,30%{box-shadow:0 0 0 2px var(--tktr-li);background:rgba(var(--tktr-li-rgb),.16)}36%,100%{box-shadow:0 0 0 1px var(--tktr-line);background:rgba(244,242,236,.08)}}
.tk-public-body .tktr .tktr-say{display:grid;gap:8px;padding:10px 12px;border-radius:10px;background:rgba(244,242,236,.05)}
.tk-public-body .tktr .tktr-say i{display:block;height:5px;width:calc(var(--w,1)*100%);border-radius:999px;background:rgba(244,242,236,.16)}

@media (prefers-reduced-motion:reduce){
  .tk-public-body .tktr .tktr-vbar i,.tk-public-body .tktr .tktr-ibars i::before,.tk-public-body .tktr .tktr-ppl em{animation:none!important}
  .tk-public-body .tktr .tktr-ppl em:nth-child(2){box-shadow:0 0 0 2px var(--tktr-li)}
}

/* ── دو مسیر زیر سرصفحه (ch-169x4): نیمهٔ «سازمان‌ها و شرکت‌ها» آبی کبالتی نسخهٔ نخست (#244d8b) با نوشتهٔ سفید و دکمهٔ زرد ── */
.tk-public-body .hpz{--hpz-org:#244d8b;--hpz-org-on:#2a5798;--hpz-org-ink:#ffffff;--hpz-org-soft:rgba(255,255,255,.82)}
[data-theme="dark"] .tk-public-body .hpz{--hpz-org:#244d8b;--hpz-org-on:#2a5798}
.tk-public-body .hpz .hpz-way--org .hpz-alt{text-decoration-color:rgba(255,255,255,.5)}

/* ── طراحان برتر و آموزشگاه‌های برتر: زمینهٔ سفید، یک ردیف با دکمه‌های قبلی/بعدی (رفتار: home-spot-rows.js)، کارت‌های آرام ── */
.tk-public-body .tkp-sec{background:var(--tk-surface,#fff)!important}
[data-theme="dark"] .tk-public-body .tkp-sec{background:var(--tk-surface)!important}
.tk-public-body .tkp-sec .pub-kick{color:var(--tk-ink-soft)}
.tk-public-body .tkp-sec .pub-kick::before,.tk-public-body .tkp-sec .pub-kick::after{background:var(--tk-amber,#ffc218)}
.tk-public-body .tkp-sec .pub-go:hover{color:var(--tk-ink)}
.tk-public-body .tkp-acts{display:flex;align-items:center;gap:18px;flex:none}
.tk-public-body .tkp-nav{display:flex;gap:8px}
.tk-public-body .tkp-nav[hidden]{display:none}
.tk-public-body .tkp-arrow{display:grid;place-items:center;width:40px;height:40px;padding:0;border:1px solid var(--tk-line);border-radius:50%;background:var(--tk-surface);color:var(--tk-ink);cursor:pointer;transition:border-color .18s,opacity .18s}
.tk-public-body .tkp-arrow svg{width:17px;height:17px}
.tk-public-body .tkp-arrow:hover:not(:disabled){border-color:var(--tk-ink)}
.tk-public-body .tkp-arrow:disabled{opacity:.3;cursor:default}
.tk-public-body .tkp-arrow:focus-visible{outline:2px solid var(--tk-ink);outline-offset:2px}

.tk-public-body .tkp-track{display:grid!important;grid-auto-flow:column;grid-template-columns:none!important;grid-auto-columns:calc((100% - 4 * 16px) / 5);gap:16px!important;
  overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;scroll-behavior:smooth;overscroll-behavior-x:contain;scrollbar-width:none;padding:6px 2px 10px;margin:-6px -2px -10px}
.tk-public-body .tkp-track::-webkit-scrollbar{display:none}
@media (max-width:1180px){.tk-public-body .tkp-track{grid-auto-columns:calc((100% - 3 * 16px) / 4)}}
@media (max-width:900px){.tk-public-body .tkp-track{grid-auto-columns:calc((100% - 2 * 16px) / 3)}}
.tk-public-body .tkp-track > .spot-person{scroll-snap-align:start;min-width:0;padding:26px 16px 18px;border-radius:20px;border-color:var(--tk-line);box-shadow:none;background:var(--tk-surface)}
.tk-public-body .tkp-track > .spot-person::before{display:none}
.tk-public-body .tkp-track > .spot-person:hover{transform:none;border-color:var(--tk-line-strong);box-shadow:0 18px 40px -30px rgba(24,26,29,.45)}
.tk-public-body .tkp-track .spot-ava{width:68px;height:68px;margin-top:0;border:0;box-shadow:0 0 0 1px var(--tk-line);background:var(--tk-surface-2)}
.tk-public-body .tkp-track .spot-ava.sq{border-radius:18px}
.tk-public-body .tkp-track .spot-name{margin-top:8px;font-size:14.5px;font-weight:750}
.tk-public-body .tkp-track .spot-role{font-size:12px;color:var(--tk-ink-soft)}
.tk-public-body .tkp-track .spot-stats{gap:0;padding-top:14px;margin-top:auto;border-top:1px solid var(--tk-line)}
.tk-public-body .tkp-track .spot-stats span,.tk-public-body .tkp-track .spot-stats .rate{padding:0 9px;border-radius:0;background:none!important;font-size:12px;font-weight:650;color:var(--tk-ink-soft)!important}
.tk-public-body .tkp-track .spot-stats > * + *{border-inline-start:1px solid var(--tk-line)}
.tk-public-body .tkp-track .spot-stats .rate{color:var(--tk-ink)!important}
.tk-public-body .tkp-track .spot-stats .rate svg{color:#e0a800}

/* ── چالش در گوشی: عبارت دوم بلندتر شد («مثل یک حرفه‌ای کار می‌کنی.»)؛ کمی کوچک‌تر تا یک‌خطی بماند ── */
@media (max-width:640px){.tk-public-body .tkch .tkch-title__b{font-size:min(.8em,7.4vw)}}

/* ── ch-169x4: بخش چالش عملی در گوشی نمایش داده نمی‌شود (به خواست مالک) ── */
@media (max-width:640px){.tk-public-body .tkch{display:none!important}}

/* ch-169m2: آزمایش‌های طراحی جدای سرصفحه و دو مسیر در گوشی (ch-169z تا ch-169m) به خواست مالک برداشته شد؛
   گوشی دوباره همان طراحی اصلی (هم‌خانوادهٔ دسکتاپ) با اندازه‌های متناسب ch-169w را دارد. */

/* ── ch-169z2: صفحهٔ اول در گوشی با متن کمتر — توضیح زیر عنوان بخش‌ها، برچسب‌های بالای عنوان و پیوندهای دوم برداشته شد ── */
@media (max-width:640px){
  .tk-public-body .pub-shead p,.tk-public-body .pub-shead .pub-kick,.tk-public-body .tktr .tktr-lede,.tk-public-body .tktr .tktr-more,.tk-public-body .tktr .tktr-kicker,
  .tk-public-body .hpz .hpz-desc,.tk-public-body .hpz .hpz-alt,.tk-public-body .bzh .bzh-lead,.tk-public-body .pub-section--dual .pub-cta p{display:none!important}
  .tk-public-body .hpz .hpz-acts{padding-top:20px}
}
