/* Layout additions scoped to the learning-age article. */
.typing-start-guide h1 { font-size: clamp(30px, 3.8vw, 46px); line-height: 1.15; }
.typing-start-guide > ul,
.typing-start-guide .blog-sources ul { list-style: disc; }
.typing-start-guide > ol { list-style: decimal; }
.typing-start-table-hint { display: none; }
.typing-start-page .blog-breadcrumbs a,
.typing-start-guide a:not(.blog-button),
.typing-start-guide .blog-eyebrow {
    color: var(--primary, #2563eb);
}
.typing-start-guide a:not(.blog-button):hover {
    color: var(--primary-hover, #1d4ed8);
}
.typing-start-guide a.blog-button.secondary:hover,
.typing-start-guide a.blog-button.secondary:focus-visible,
.typing-start-guide a.blog-button.secondary:active {
    color: var(--primary, #2563eb) !important;
    -webkit-text-fill-color: var(--primary, #2563eb) !important;
}
.typing-start-guide a:focus-visible,
.typing-start-guide .blog-data-table-wrap:focus-visible {
    outline: 3px solid var(--primary, #2563eb);
    outline-offset: 3px;
}
.typing-start-answer {
    margin: 20px 0;
    padding: 18px 20px;
    border: 1px solid var(--blog-border);
    border-left: 4px solid var(--primary, #2563eb);
    border-radius: 14px;
    background: var(--blog-soft);
}
.typing-start-answer p { margin: 0; }
.typing-start-answer strong { color: var(--blog-text); }
.typing-start-contents {
    margin: 24px 0;
    padding: 16px 20px;
    border: 1px solid var(--blog-border);
    border-radius: 14px;
    background: var(--blog-soft);
}
.typing-start-contents ul {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 20px;
    margin: 10px 0 0;
    padding: 0;
    list-style: none;
}
.typing-start-contents li { font-size: 14px; }
.typing-start-guide h2,
.typing-start-guide h3 { scroll-margin-top: 110px; }
.typing-start-guide .blog-data-table-wrap { max-width: 100%; overflow: auto; }
.typing-start-guide .blog-data-table { min-width: 640px; }
.typing-start-guide .blog-data-table caption {
    padding: 12px 16px;
    text-align: left;
    color: var(--blog-text);
    background: var(--blog-soft);
    font-weight: 700;
}
.typing-start-guide .typing-start-figure {
    max-width: 720px;
    margin: 26px auto;
}
.typing-start-figure img {
    display: block;
    width: 100%;
    height: auto;
    border-radius: 14px;
}
.typing-start-figure figcaption {
    margin-top: 8px;
    color: var(--blog-muted);
    font-size: 13px;
    line-height: 1.6;
}
.typing-start-guide .blog-sources h2 { margin-top: 0; }
@media (max-width: 680px) {
    .typing-start-guide { padding: 22px 18px; }
    .typing-start-guide h1 { font-size: clamp(28px, 8.3vw, 34px); }
    .typing-start-guide h2 { font-size: 25px; }
    .typing-start-guide .typing-start-table-hint { display: block; font-size: 13px; }
    .typing-start-answer,
    .typing-start-contents { padding: 15px; }
}
