.beginner-onboarding { background: var(--paper); }
.beginner-onboarding .section-heading { margin-bottom: 30px; }
.beginner-start-steps { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 30px; padding: 0; margin: 0; list-style: none; counter-reset: start; }
.beginner-start-steps > li { counter-increment: start; min-width: 0; padding-top: 18px; border-top: 1px solid var(--line); }
.beginner-start-steps > li::before { content: counter(start); display: block; color: var(--orange-dark); font-size: 14px; font-weight: 750; margin-bottom: 14px; }
.beginner-start-steps h3 { margin: 0 0 10px; font-size: 23px; line-height: 1.3; letter-spacing: -.02em; }
.beginner-start-steps p { margin: 0; color: var(--ink-soft); line-height: 1.65; }
.beginner-start-steps a, .beginner-start-link a { color: var(--orange-dark); text-underline-offset: 4px; }
.beginner-start-link { margin: 28px 0 0; }
.beginner-start-link a { display: inline-flex; align-items: center; min-height: 44px; font-weight: 750; }
.beginner-start-link svg { width: 19px; height: 19px; margin-left: 9px; fill: none; stroke: currentColor; stroke-width: 1.6; }
.beginner-overview { max-width: 65ch; margin: 18px 0 0; color: var(--ink-soft); font-size: 17px; line-height: 1.65; text-wrap: pretty; }
.beginner-page .marketing-hero h1 { max-width: 1000px; text-wrap: balance; }
.beginner-page .marketing-hero > p { max-width: 72ch; text-wrap: pretty; }
.beginner-page .marketing-section { padding-top: 38px; }
.beginner-page .marketing-section + .marketing-section { margin-top: 8px; }
.beginner-page .marketing-article h2 { text-wrap: balance; }
.beginner-page .marketing-article h3 { font-size: 21px; }
.beginner-page .marketing-article a:not(.button) { color: var(--orange-dark); }
.beginner-page .marketing-article ul { padding-left: 23px; }
.beginner-page .marketing-article li + li { margin-top: 10px; }
.beginner-steps { padding-left: 26px; }
.beginner-steps > li { padding-left: 5px; }
.beginner-steps > li::marker { color: var(--orange-dark); font-weight: 750; }
.beginner-example { margin: 24px 0; padding: 22px; border: 1px solid var(--line); border-radius: 14px; background: var(--paper-bright); }
.beginner-example h3 { margin: 0 0 12px; }
.beginner-example p:last-child { margin-bottom: 0; }
.beginner-prompt { display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: start; gap: 16px; padding: 20px; margin: 24px 0; }
.beginner-prompt .guide-prompt-label { grid-column: 1; grid-row: 1; align-self: center; margin: 0; color: var(--ink); font-size: 15px; letter-spacing: 0; text-transform: none; font-weight: 700; }
.beginner-prompt [data-prompt-text] { grid-column: 1 / -1; margin: 0; font-size: 16px; line-height: 1.7; white-space: normal; overflow-wrap: break-word; }
.beginner-prompt .marketing-copy { min-width: 106px; }
.beginner-table { max-width: 100%; margin: 24px 0; border-block: 1px solid var(--line); overflow-x: auto; scrollbar-color: #b78b71 var(--paper); }
.beginner-table:focus-visible { outline: 2px solid var(--orange-dark); outline-offset: 4px; }
.beginner-table table { width: 100%; border-collapse: collapse; font-size: 15px; line-height: 1.6; text-align: left; }
.beginner-table th, .beginner-table td { padding: 15px 14px; vertical-align: top; border-bottom: 1px solid var(--line); }
.beginner-table thead th { background: var(--paper-bright); color: var(--ink); font-weight: 750; }
.beginner-table tbody th { width: 25%; font-weight: 700; }
.beginner-table tr:last-child > * { border-bottom: 0; }
.beginner-related { margin-top: 44px; padding-top: 28px; border-top: 1px solid var(--line); }
.beginner-related h2 { font-size: 25px; }
.beginner-related ul { display: grid; gap: 10px; list-style: none; padding: 0 !important; margin: 16px 0 0; }
.beginner-related li { margin: 0 !important; }
.beginner-related a { display: inline-block; min-height: 44px; padding-block: 8px; }
.beginner-page .marketing-final-cta { margin-top: 40px; }
@media(max-width:900px) {
 .beginner-page .marketing-layout { margin-top: 26px; }
 .beginner-page .marketing-toc { margin-bottom: 6px; }
}
@media(max-width:640px) {
 .beginner-start-steps { grid-template-columns: 1fr; gap: 20px; }
 .beginner-start-steps > li { display: grid; grid-template-columns: 22px minmax(0,1fr); column-gap: 12px; padding-top: 16px; }
 .beginner-start-steps > li::before { grid-column: 1; grid-row: 1 / 3; padding-top: 2px; margin: 0; }
 .beginner-start-steps h3, .beginner-start-steps p { grid-column: 2; }
 .beginner-start-steps h3 { margin-bottom: 6px; font-size: 20px; }
 .beginner-start-steps p, .beginner-overview { font-size: 16px; line-height: 1.6; }
 .beginner-start-link { margin-top: 18px; }
 .beginner-page .marketing-hero h1 { font-size: clamp(30px,7.7vw,38px); line-height: 1.15; }
 .beginner-page .marketing-section { padding-top: 30px; }
 .beginner-page .marketing-article h2 { font-size: 27px; }
 .beginner-prompt { gap: 14px 10px; padding: 16px; }
 .beginner-prompt .guide-prompt-label { font-size: 14px; }
 .beginner-prompt .marketing-copy { min-width: 92px; padding-inline: 9px; font-size: 12px; }
 .beginner-example { padding: 18px; }
 .beginner-table { overflow: visible; }
 .beginner-table table, .beginner-table tbody, .beginner-table tr, .beginner-table th, .beginner-table td { display: block; width: 100%; }
 .beginner-table thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
 .beginner-table tr { padding-block: 12px; border-bottom: 1px solid var(--line); }
 .beginner-table tr:last-child { border-bottom: 0; }
 .beginner-table tbody th { width: auto; padding: 5px 0 9px; border: 0; font-size: 16px; }
 .beginner-table td { border: 0; padding: 6px 0; }
 .beginner-table td::before { content: attr(data-label); display: block; color: var(--ink-soft); font-size: 12px; font-weight: 700; margin-bottom: 2px; }
}
