/* Material detail (single download_material) — batch 2, page 04. Scoped to .tt-b2--doc.
 * The stored body (images + Zoho form script + banner) is untouched; only its container is styled.
 * Nothing inside the Zoho form is targeted. */
.tt-b2--doc .tt-b2__hero { padding-block: 28px 44px; }
.tt-b2--doc .tt-b2-doc-title { margin: 0 0 18px; color: var(--tt-ink); font-size: clamp(1.5rem, 1.1rem + 1.6vw, 2.5rem); line-height: 1.5; letter-spacing: -.02em; font-weight: 800; max-width: 960px; }
.tt-b2--doc .tt-b2-doc-lead { max-width: 820px; margin: 0; color: var(--tt-ink-muted); font-size: 1.0625rem; line-height: 1.95; }
.tt-b2--doc .tt-b2-doc-body { padding-block: 64px 80px; }

.tt-b2--doc .tt-b2-doc { max-width: none; }
/* Old pink title band repeats the page title (H1) above; the text stays in the content, only the band is not shown. */
.tt-b2--doc .tt-b2-doc > h2.wp-block-heading:first-child { display: none; }
.tt-b2--doc .tt-b2-doc > p { margin: 0 0 28px; color: var(--tt-ink-muted); text-align: left !important; font-size: 1rem; }
.tt-b2--doc .tt-b2-doc > .wp-block-columns { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: 40px; align-items: start; margin: 0 0 40px; }
.tt-b2--doc .tt-b2-doc > .wp-block-columns > .wp-block-column { flex-basis: auto !important; min-width: 0; margin: 0; }
.tt-b2--doc .tt-b2-doc > .wp-block-columns > .wp-block-column:first-child { display: grid; align-content: start; gap: 16px; padding: 20px; border: 1px solid var(--tt-line); border-radius: var(--tt-radius-lg); background: var(--tt-mint-pale); }
.tt-b2--doc .tt-b2-doc > .wp-block-columns > .wp-block-column:first-child > p:empty { display: none; }
.tt-b2--doc .tt-b2-doc .wp-block-column .wp-block-image { margin: 0; }
.tt-b2--doc .tt-b2-doc .wp-block-column .wp-block-image img { display: block; width: 100%; height: auto; border: 1px solid var(--tt-line); border-radius: var(--tt-radius-sm); background: #fff; }
.tt-b2--doc .tt-b2-doc > .wp-block-columns > .wp-block-column:last-child { overflow-x: auto; padding: 28px 32px; border: 1px solid var(--tt-line); border-radius: var(--tt-radius-lg); background: #fff; box-shadow: var(--tt-shadow-card); }
.tt-b2--doc .tt-b2-doc > .wp-block-image { margin: 0 auto; max-width: 930px; }
.tt-b2--doc .tt-b2-doc > .wp-block-image img { display: block; width: 100%; height: auto; border-radius: var(--tt-radius-md); }
.tt-b2--doc .tt-b2-doc > p:empty { display: none; }

.tt-b2--doc .tt-b2-docother { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; margin: 0 0 32px; padding: 0; list-style: none; }
.tt-b2--doc .tt-b2-docother__item { display: flex; flex-direction: column; overflow: hidden; border: 1px solid var(--tt-line); border-radius: var(--tt-radius-md); background: #fff; box-shadow: var(--tt-shadow-card); }
.tt-b2--doc .tt-b2-docother__cover { display: flex; align-items: center; justify-content: center; padding: 18px; border-bottom: 1px solid var(--tt-line); background: var(--tt-mint-pale); }
.tt-b2--doc .tt-b2-docother__cover img { display: block; width: 100%; height: auto; max-height: 200px; object-fit: contain; }
.tt-b2--doc .tt-b2-docother__body { padding: 18px 22px 22px; }
.tt-b2--doc .tt-b2-docother__label { margin: 0 0 8px; color: var(--tt-green); font-size: .75rem; font-weight: 800; letter-spacing: .06em; }
.tt-b2--doc .tt-b2-docother__title { margin: 0; font-size: 1rem; line-height: 1.7; }
.tt-b2--doc .tt-b2-docother__title a { color: var(--tt-ink); text-decoration: none; }
.tt-b2--doc .tt-b2-docother__title a:hover { color: var(--tt-green-deep); text-decoration: underline; text-underline-offset: 5px; }

@media (max-width: 900px) {
	.tt-b2--doc .tt-b2-doc > .wp-block-columns { grid-template-columns: minmax(0, 1fr); gap: 28px; }
	.tt-b2--doc .tt-b2-docother { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 600px) {
	.tt-b2--doc .tt-b2-doc-body { padding-block: 40px 56px; }
	.tt-b2--doc .tt-b2-doc > .wp-block-columns > .wp-block-column:first-child { padding: 14px; }
	.tt-b2--doc .tt-b2-doc > .wp-block-columns > .wp-block-column:last-child { padding: 20px 16px; }
	.tt-b2--doc .tt-b2-docother { grid-template-columns: minmax(0, 1fr); gap: 16px; }
}