/**
 * Blog article: the editor's own blocks — headings, paragraphs, lists,
 * tables, pictures — in the type of the Tilda original
 * (bebestschool.com/blog/*).
 *
 * One measure for every article, as on the home page: the text ApercuPro
 * 20 / 31 px on the 1200 px grid, 20 px in from its edges; headings bold
 * green — h2 36 / 45 px, h3 30 / 38 px; 20 px between blocks, more above a
 * heading. Nothing is set on a block itself: what differs is a block style
 * in the Styles panel — "Зміст" (T004), "Line" (T157), "Accent" (T159),
 * "Box" (T220), the tables (T431), and for headings "Чёрный" and "Простой".
 */

.bbs-article__content,
.editor-styles-wrapper {
    --bbs-article-grid: 1200px;
    --bbs-article-link: #ff8562;
    --bbs-article-green: #1db65b;

    color: #000000;
    font-family: 'ApercuPro', Arial, sans-serif;
    font-size: 20px;
    line-height: 31px;
    font-weight: 400;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/* Every block on the grid, 20 px in from its edges. */
.bbs-article__content > :not(.alignfull),
.editor-styles-wrapper .is-root-container > :not(.alignfull) {
    box-sizing: border-box;
    max-width: var(--bbs-article-grid);
    margin-right: auto;
    margin-bottom: 0;
    margin-left: auto;
    padding-right: 20px;
    padding-left: 20px;
}

.bbs-article__content > .alignfull,
.editor-styles-wrapper .is-root-container > .alignfull {
    max-width: none;
    margin-top: 0;
    margin-bottom: 0;
}

/* The rhythm: 20 px between blocks, 50 px over a heading, 30 px round pictures, tables and boxes. */
.bbs-article__content > *,
.editor-styles-wrapper .is-root-container > * {
    margin-top: 20px;
}

.bbs-article__content > .alignfull + *,
.bbs-article__content > :first-child {
    margin-top: 40px;
}

.bbs-article__content > :is(h2, h3).wp-block-heading,
.bbs-article__content > .is-style-bbs-toc-title,
.editor-styles-wrapper .is-root-container > :is(h2, h3).wp-block-heading,
.editor-styles-wrapper .is-root-container > .is-style-bbs-toc-title {
    margin-top: 50px;
}

.bbs-article__content > :is(.wp-block-image, .wp-block-columns, .wp-block-group, .wp-block-table, .wp-block-embed, .is-style-bbs-note-line, .is-style-bbs-note-impact, .is-style-bbs-note-box),
.bbs-article__content > :is(.wp-block-image, .wp-block-columns, .wp-block-group, .wp-block-table, .wp-block-embed, .is-style-bbs-note-line, .is-style-bbs-note-impact, .is-style-bbs-note-box) + *,
.editor-styles-wrapper .is-root-container > :is(.wp-block-image, .wp-block-columns, .wp-block-group, .wp-block-table, .wp-block-embed) {
    margin-top: 30px;
}

.bbs-article__content > .alignfull,
.bbs-article__content > * + .alignfull {
    margin-top: 40px;
}

/* Inside columns and groups: the same rhythm, the first block at the top. */
.bbs-article__content :is(.wp-block-column, .wp-block-group) > *,
.editor-styles-wrapper :is(.wp-block-column, .wp-block-group) > * {
    margin-top: 20px;
    margin-bottom: 0;
}

.bbs-article__content :is(.wp-block-column, .wp-block-group) > :first-child,
.editor-styles-wrapper :is(.wp-block-column, .wp-block-group) > :first-child {
    margin-top: 0;
}

.bbs-article__content :is(.wp-block-column, .wp-block-group) > :is(:is(h2, h3).wp-block-heading, .is-style-bbs-toc-title):not(:first-child, .is-style-bbs-plain),
.editor-styles-wrapper :is(.wp-block-column, .wp-block-group) > :is(:is(h2, h3).wp-block-heading, .is-style-bbs-toc-title):not(:first-child, .is-style-bbs-plain) {
    margin-top: 50px;
}

/* The text blocks: the article's type, not the theme's sections'. */
.bbs-article__content :is(.bbs-article__content, .wp-block-column, .wp-block-group) > :is(p, h1, h2, h3, h4, h5, h6, ul, ol),
.editor-styles-wrapper :is(.is-root-container, .wp-block-column, .wp-block-group) > :is(p, h1, h2, h3, h4, h5, h6, ul, ol) {
    color: inherit;
    font-family: inherit;
    font-weight: 400;
    overflow-wrap: normal;
    clear: none;
}

.bbs-article__content .wp-block-heading,
.editor-styles-wrapper .wp-block-heading {
    color: var(--bbs-article-green);
    font-weight: 700;
}

.bbs-article__content h2.wp-block-heading,
.editor-styles-wrapper h2.wp-block-heading {
    font-size: 36px;
    line-height: 45px;
}

.bbs-article__content :is(h3, h4, h5, h6).wp-block-heading,
.editor-styles-wrapper :is(h3, h4, h5, h6).wp-block-heading {
    font-size: 30px;
    line-height: 38px;
}

/* Heading styles: "Чёрный" — the same, in black; "Простой" — a plain 20 px line. */
.bbs-article__content .wp-block-heading.is-style-bbs-black,
.editor-styles-wrapper .wp-block-heading.is-style-bbs-black {
    color: #000000;
}

.bbs-article__content .wp-block-heading.is-style-bbs-plain,
.editor-styles-wrapper .wp-block-heading.is-style-bbs-plain {
    color: #000000;
    font-size: 20px;
    line-height: 31px;
    font-weight: 400;
}

.bbs-article__content > .wp-block-heading.is-style-bbs-plain {
    margin-top: 30px;
}

/* "Зміст:" over the list of sections, and the original's other bold 36 px lines. */
.bbs-article__content .is-style-bbs-toc-title,
.editor-styles-wrapper .is-style-bbs-toc-title {
    font-size: 36px;
    line-height: 36px;
    font-weight: 700;
}

.bbs-article__content :is(p, .wp-block-heading, .wp-block-list) :is(strong, b),
.editor-styles-wrapper :is(p, .wp-block-heading, .wp-block-list) :is(strong, b) {
    font-weight: 700;
}

.bbs-article__content :is(p, .wp-block-heading, .wp-block-list) a,
.editor-styles-wrapper :is(p, .wp-block-heading, .wp-block-list) a {
    color: inherit;
    text-decoration: none;
}

.bbs-article__content > :is(p, .wp-block-list) a:hover,
.bbs-article__content > :is(p, .wp-block-list) a:focus-visible {
    text-decoration: underline;
}

.bbs-article__content .wp-block-list,
.editor-styles-wrapper .wp-block-list {
    padding-left: 40px;
}

.bbs-article__content .wp-block-list li,
.editor-styles-wrapper .wp-block-list li {
    margin: 0;
}

/* Pictures at their own width, never wider than the text. */
.bbs-article__content .wp-block-image,
.editor-styles-wrapper .wp-block-image {
    margin-bottom: 0;
    line-height: 0;
}

.bbs-article__content > .wp-block-image {
    text-align: center;
}

.bbs-article__content .wp-block-image img,
.editor-styles-wrapper .wp-block-image img {
    max-width: 100%;
    height: auto;
}

/* A picture in a group or a column: up to 500 px, centred, as the original's illustrations. */
.bbs-article__content :is(.wp-block-group, .wp-block-column) .wp-block-image,
.editor-styles-wrapper :is(.wp-block-group, .wp-block-column) .wp-block-image {
    text-align: center;
}

.bbs-article__content :is(.wp-block-group, .wp-block-column) .wp-block-image img,
.editor-styles-wrapper :is(.wp-block-group, .wp-block-column) .wp-block-image img {
    max-width: min(100%, 500px);
}

/* Text beside a picture: the picture's column as wide as it, up to 45 %; the text takes the rest. */
.bbs-article__content .wp-block-columns,
.editor-styles-wrapper .wp-block-columns {
    column-gap: 40px;
    align-items: flex-start;
    margin-bottom: 0;
}

.bbs-article__content .wp-block-column,
.editor-styles-wrapper .wp-block-column {
    flex: 1 1 0;
    min-width: 0;
}

.bbs-article__content .wp-block-column:not(:has(p, h1, h2, h3, h4, ul, ol, table)),
.editor-styles-wrapper .wp-block-column:not(:has(p, h1, h2, h3, h4, ul, ol, table)) {
    flex: 0 1 auto;
    max-width: 45%;
}

.bbs-article__content .wp-block-embed,
.editor-styles-wrapper .wp-block-embed {
    margin-bottom: 0;
}

/* The original's video: 960 px, 16:9. */
.bbs-article__content > .wp-block-embed.bbs-embed-960 {
    max-width: 1000px;
}

.bbs-article__content .wp-block-embed.wp-has-aspect-ratio .wp-block-embed__wrapper,
.editor-styles-wrapper .wp-block-embed.wp-has-aspect-ratio .wp-block-embed__wrapper {
    position: relative;
    aspect-ratio: 16 / 9;
}

.bbs-article__content .wp-block-embed.wp-has-aspect-ratio iframe,
.editor-styles-wrapper .wp-block-embed.wp-has-aspect-ratio iframe {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
}

/* An article from the Tilda Zero-block template (every exercise, and the blog articles made like them):
   links in the text are coral, as the originals have them. */
.bbs-article--zero .bbs-article__content > :is(p, .wp-block-heading, .wp-block-list) a {
    color: var(--bbs-article-link);
}

/* Such an article opens right under the header, its crumbs on the band, as the original's do; its contents run 20 / 31. */
.bbs-article--zero .bbs-article__content > .bbs-breadcrumbs:first-child,
.bbs-article--zero .bbs-article__content > .bbs-breadcrumbs:first-child + * {
    margin-top: 0;
}

.bbs-article--zero .bbs-article__content .is-style-bbs-toc {
    line-height: 31px;
}

/* Its text runs tight, as the original's Zero blocks set it: a heading 20 px under what
   comes before it and 10 px over its text, a list right under the line that leads into it. */
.bbs-article--zero .bbs-article__content > h2.wp-block-heading {
    margin-top: 20px;
}

.bbs-article--zero .bbs-article__content > h2.wp-block-heading + :is(p, .wp-block-list) {
    margin-top: 10px;
}

.bbs-article--zero .bbs-article__content > p + .wp-block-list {
    margin-top: 0;
}

/* Coloured words in the text, as the originals have them. */
:is(.bbs-article__content, .editor-styles-wrapper) .bbs-text-orange {
    color: #ff8562;
}

:is(.bbs-article__content, .editor-styles-wrapper) .bbs-text-coral {
    color: #f66746;
}

:is(.bbs-article__content, .editor-styles-wrapper) .bbs-text-green {
    color: #1db65b;
}

/* ── "Зміст": the list of the article's sections, coral and bold ── */
.bbs-article__content .is-style-bbs-toc,
.editor-styles-wrapper .is-style-bbs-toc {
    color: #f66746;
    font-family: 'TildaSans', Arial, sans-serif;
    font-size: 20px;
    line-height: 26px;
}

.bbs-article__content .is-style-bbs-toc a,
.editor-styles-wrapper .is-style-bbs-toc a {
    color: var(--bbs-article-link);
    font-weight: 700;
}

/* ── "Line": a black rule on the left, 760 px centred ── */
.bbs-article__content .is-style-bbs-note-line,
.editor-styles-wrapper .is-style-bbs-note-line {
    max-width: 760px;
    padding: 4px 0 3px 20px;
    border-left: 3px solid #000000;
    font-family: 'TildaSans', Arial, sans-serif;
    font-size: 18px;
    line-height: 1.55;
}

/* ── "Accent": large centred text ── */
.bbs-article__content .is-style-bbs-note-impact,
.editor-styles-wrapper .is-style-bbs-note-impact {
    max-width: 1160px;
    font-family: 'TildaSans', Arial, sans-serif;
    font-size: 28px;
    line-height: 42px;
    text-align: center;
}

/* ── "Box": on light grey, 60 px in from its edges ── */
.bbs-article__content .is-style-bbs-note-box,
.editor-styles-wrapper .is-style-bbs-note-box {
    max-width: 880px;
    padding: 60px;
    background: #f5f5f5;
    font-family: 'TildaSans', Arial, sans-serif;
    font-size: 20px;
    line-height: 1.55;
}

.bbs-article__content :is(.is-style-bbs-note-line, .is-style-bbs-note-impact, .is-style-bbs-note-box) a,
.editor-styles-wrapper :is(.is-style-bbs-note-line, .is-style-bbs-note-impact, .is-style-bbs-note-box) a {
    color: var(--bbs-article-link);
    font-weight: 700;
}

/*
 * ── Tables (T431) ──
 * "Оранжевая": a coral head in white bold over a #cccccc rule, rows ruled
 * coral, striped #fefefe / #fff0ed, grey #4d4c4c text, centred.
 * "Простая": a bold black head over a black rule, rows ruled #d9d9d9,
 * striped white / #eeeeee, set left. Both 18 / 1.55 TildaSans in 20 px
 * cells. Classes: bbs-table--lines adds the vertical rules, bbs-table--left
 * sets the text left, bbs-cols-25-20-… gives the columns' widths in %.
 */
.bbs-article__content .wp-block-table:is(.is-style-bbs-table, .is-style-bbs-table-plain),
.editor-styles-wrapper .wp-block-table:is(.is-style-bbs-table, .is-style-bbs-table-plain) {
    --bbs-table-head-bg: #f66746;
    --bbs-table-head-color: #ffffff;
    --bbs-table-head-rule: #cccccc;
    --bbs-table-rule: #f66746;
    --bbs-table-odd: #fefefe;
    --bbs-table-even: #fff0ed;

    margin-bottom: 0;
    color: #4d4c4c;
    font-family: 'TildaSans', Arial, sans-serif;
    font-size: 18px;
    line-height: 1.55;
    text-align: center;
}

.bbs-article__content .wp-block-table.is-style-bbs-table-plain,
.editor-styles-wrapper .wp-block-table.is-style-bbs-table-plain {
    --bbs-table-head-bg: transparent;
    --bbs-table-head-color: #000000;
    --bbs-table-head-rule: #000000;
    --bbs-table-rule: #d9d9d9;
    --bbs-table-odd: #ffffff;
    --bbs-table-even: #eeeeee;

    text-align: left;
}

.bbs-article__content .wp-block-table.bbs-table--left {
    text-align: left;
}

/* No line box under the table: the figure is exactly as tall as it. */
.bbs-article__content .wp-block-table:is(.is-style-bbs-table, .is-style-bbs-table-plain) {
    line-height: 0;
}

.bbs-article__content .wp-block-table:is(.is-style-bbs-table, .is-style-bbs-table-plain) table,
.editor-styles-wrapper .wp-block-table:is(.is-style-bbs-table, .is-style-bbs-table-plain) table {
    width: 100%;
    margin: 0;
    line-height: 1.55;
    border: 0;
    border-collapse: separate;
    border-spacing: 0;
    table-layout: auto;
}

.bbs-article__content .wp-block-table:is(.is-style-bbs-table, .is-style-bbs-table-plain) :is(th, td),
.editor-styles-wrapper .wp-block-table:is(.is-style-bbs-table, .is-style-bbs-table-plain) :is(th, td) {
    padding: 20px;
    border: 0 solid var(--bbs-table-rule);
    border-bottom-width: 1px;
    color: inherit;
    font-weight: 400;
    text-align: inherit;
    vertical-align: top;
}

.bbs-article__content .wp-block-table:is(.is-style-bbs-table, .is-style-bbs-table-plain) thead :is(th, td),
.editor-styles-wrapper .wp-block-table:is(.is-style-bbs-table, .is-style-bbs-table-plain) thead :is(th, td) {
    border-color: var(--bbs-table-head-rule);
    background: var(--bbs-table-head-bg);
    color: var(--bbs-table-head-color);
    font-weight: 700;
}

.bbs-article__content .wp-block-table:is(.is-style-bbs-table, .is-style-bbs-table-plain) tbody tr:nth-child(odd) td {
    background: var(--bbs-table-odd);
}

.bbs-article__content .wp-block-table:is(.is-style-bbs-table, .is-style-bbs-table-plain) tbody tr:nth-child(even) td {
    background: var(--bbs-table-even);
}

.bbs-article__content .wp-block-table.bbs-table--lines :is(th, td),
.editor-styles-wrapper .wp-block-table.bbs-table--lines :is(th, td) {
    border-left-width: 1px;
}

.bbs-article__content .wp-block-table.bbs-table--lines :is(th, td):last-child,
.editor-styles-wrapper .wp-block-table.bbs-table--lines :is(th, td):last-child {
    border-right-width: 1px;
}

/* Rows of one colour. */
.bbs-article__content .wp-block-table.bbs-table--flat tbody tr:nth-child(n) td {
    background: #ffffff;
}

/* A table with no head starts with a rule. */
.bbs-article__content .wp-block-table:is(.is-style-bbs-table, .is-style-bbs-table-plain) table:not(:has(thead)) tbody tr:first-child td {
    border-top-width: 1px;
}

/* Tables' column widths (bbs-cols-…, Additional CSS class), in % of the table. */
.bbs-article__content .wp-block-table[class*="bbs-cols-"] table {
    table-layout: fixed;
}

.bbs-cols-50-50 :is(th, td):nth-child(1) { width: 50%; }
.bbs-cols-50-50 :is(th, td):nth-child(2) { width: 50%; }

.bbs-cols-56-44 :is(th, td):nth-child(1) { width: 56%; }
.bbs-cols-56-44 :is(th, td):nth-child(2) { width: 44%; }

.bbs-cols-11-44-44 :is(th, td):nth-child(1) { width: 11%; }
.bbs-cols-11-44-44 :is(th, td):nth-child(2) { width: 44%; }
.bbs-cols-11-44-44 :is(th, td):nth-child(3) { width: 44%; }

.bbs-cols-17-17-67 :is(th, td):nth-child(1) { width: 17%; }
.bbs-cols-17-17-67 :is(th, td):nth-child(2) { width: 17%; }
.bbs-cols-17-17-67 :is(th, td):nth-child(3) { width: 67%; }

.bbs-cols-22-22-56 :is(th, td):nth-child(1) { width: 22%; }
.bbs-cols-22-22-56 :is(th, td):nth-child(2) { width: 22%; }
.bbs-cols-22-22-56 :is(th, td):nth-child(3) { width: 56%; }

.bbs-cols-25-25-50 :is(th, td):nth-child(1) { width: 25%; }
.bbs-cols-25-25-50 :is(th, td):nth-child(2) { width: 25%; }
.bbs-cols-25-25-50 :is(th, td):nth-child(3) { width: 50%; }

.bbs-cols-33-33-33 :is(th, td):nth-child(1) { width: 33%; }
.bbs-cols-33-33-33 :is(th, td):nth-child(2) { width: 33%; }
.bbs-cols-33-33-33 :is(th, td):nth-child(3) { width: 33%; }

.bbs-cols-40-20-40 :is(th, td):nth-child(1) { width: 40%; }
.bbs-cols-40-20-40 :is(th, td):nth-child(2) { width: 20%; }
.bbs-cols-40-20-40 :is(th, td):nth-child(3) { width: 40%; }

.bbs-cols-42-33-25 :is(th, td):nth-child(1) { width: 42%; }
.bbs-cols-42-33-25 :is(th, td):nth-child(2) { width: 33%; }
.bbs-cols-42-33-25 :is(th, td):nth-child(3) { width: 25%; }

.bbs-cols-20-20-20-40 :is(th, td):nth-child(1) { width: 20%; }
.bbs-cols-20-20-20-40 :is(th, td):nth-child(2) { width: 20%; }
.bbs-cols-20-20-20-40 :is(th, td):nth-child(3) { width: 20%; }
.bbs-cols-20-20-20-40 :is(th, td):nth-child(4) { width: 40%; }

.bbs-cols-20-20-30-30 :is(th, td):nth-child(1) { width: 20%; }
.bbs-cols-20-20-30-30 :is(th, td):nth-child(2) { width: 20%; }
.bbs-cols-20-20-30-30 :is(th, td):nth-child(3) { width: 30%; }
.bbs-cols-20-20-30-30 :is(th, td):nth-child(4) { width: 30%; }

.bbs-cols-24-24-24-29 :is(th, td):nth-child(1) { width: 24%; }
.bbs-cols-24-24-24-29 :is(th, td):nth-child(2) { width: 24%; }
.bbs-cols-24-24-24-29 :is(th, td):nth-child(3) { width: 24%; }
.bbs-cols-24-24-24-29 :is(th, td):nth-child(4) { width: 29%; }

.bbs-cols-25-25-25-25 :is(th, td):nth-child(1) { width: 25%; }
.bbs-cols-25-25-25-25 :is(th, td):nth-child(2) { width: 25%; }
.bbs-cols-25-25-25-25 :is(th, td):nth-child(3) { width: 25%; }
.bbs-cols-25-25-25-25 :is(th, td):nth-child(4) { width: 25%; }

.bbs-cols-33-27-20-20 :is(th, td):nth-child(1) { width: 33%; }
.bbs-cols-33-27-20-20 :is(th, td):nth-child(2) { width: 27%; }
.bbs-cols-33-27-20-20 :is(th, td):nth-child(3) { width: 20%; }
.bbs-cols-33-27-20-20 :is(th, td):nth-child(4) { width: 20%; }

.bbs-cols-40-10-10-40 :is(th, td):nth-child(1) { width: 40%; }
.bbs-cols-40-10-10-40 :is(th, td):nth-child(2) { width: 10%; }
.bbs-cols-40-10-10-40 :is(th, td):nth-child(3) { width: 10%; }
.bbs-cols-40-10-10-40 :is(th, td):nth-child(4) { width: 40%; }

.bbs-cols-40-10-40-10 :is(th, td):nth-child(1) { width: 40%; }
.bbs-cols-40-10-40-10 :is(th, td):nth-child(2) { width: 10%; }
.bbs-cols-40-10-40-10 :is(th, td):nth-child(3) { width: 40%; }
.bbs-cols-40-10-40-10 :is(th, td):nth-child(4) { width: 10%; }

.bbs-cols-8-31-31-31 :is(th, td):nth-child(1) { width: 8%; }
.bbs-cols-8-31-31-31 :is(th, td):nth-child(2) { width: 31%; }
.bbs-cols-8-31-31-31 :is(th, td):nth-child(3) { width: 31%; }
.bbs-cols-8-31-31-31 :is(th, td):nth-child(4) { width: 31%; }

.bbs-cols-14-14-14-29-29 :is(th, td):nth-child(1) { width: 14%; }
.bbs-cols-14-14-14-29-29 :is(th, td):nth-child(2) { width: 14%; }
.bbs-cols-14-14-14-29-29 :is(th, td):nth-child(3) { width: 14%; }
.bbs-cols-14-14-14-29-29 :is(th, td):nth-child(4) { width: 29%; }
.bbs-cols-14-14-14-29-29 :is(th, td):nth-child(5) { width: 29%; }

.bbs-cols-25-20-15-15-25 :is(th, td):nth-child(1) { width: 25%; }
.bbs-cols-25-20-15-15-25 :is(th, td):nth-child(2) { width: 20%; }
.bbs-cols-25-20-15-15-25 :is(th, td):nth-child(3) { width: 15%; }
.bbs-cols-25-20-15-15-25 :is(th, td):nth-child(4) { width: 15%; }
.bbs-cols-25-20-15-15-25 :is(th, td):nth-child(5) { width: 25%; }

.bbs-cols-17-17-17-17-17-17 :is(th, td):nth-child(1) { width: 17%; }
.bbs-cols-17-17-17-17-17-17 :is(th, td):nth-child(2) { width: 17%; }
.bbs-cols-17-17-17-17-17-17 :is(th, td):nth-child(3) { width: 17%; }
.bbs-cols-17-17-17-17-17-17 :is(th, td):nth-child(4) { width: 17%; }
.bbs-cols-17-17-17-17-17-17 :is(th, td):nth-child(5) { width: 17%; }
.bbs-cols-17-17-17-17-17-17 :is(th, td):nth-child(6) { width: 17%; }

.bbs-cols-20-20-40-20 :is(th, td):nth-child(1) { width: 20%; }
.bbs-cols-20-20-40-20 :is(th, td):nth-child(2) { width: 20%; }
.bbs-cols-20-20-40-20 :is(th, td):nth-child(3) { width: 40%; }
.bbs-cols-20-20-40-20 :is(th, td):nth-child(4) { width: 20%; }

.bbs-cols-20-20-40-10-10 :is(th, td):nth-child(1) { width: 20%; }
.bbs-cols-20-20-40-10-10 :is(th, td):nth-child(2) { width: 20%; }
.bbs-cols-20-20-40-10-10 :is(th, td):nth-child(3) { width: 40%; }
.bbs-cols-20-20-40-10-10 :is(th, td):nth-child(4) { width: 10%; }
.bbs-cols-20-20-40-10-10 :is(th, td):nth-child(5) { width: 10%; }

/* ── Below the 1200 px grid ── */
@media (max-width: 1199px) {
    .bbs-article__content .wp-block-table:is(.is-style-bbs-table, .is-style-bbs-table-plain) {
        overflow-x: auto;
    }
}

@media (max-width: 781px) {
    .bbs-article__content .wp-block-columns {
        flex-wrap: wrap;
    }

    .bbs-article__content .wp-block-column,
    .bbs-article__content .wp-block-column:not(:has(p, h1, h2, h3, h4, ul, ol, table)) {
        flex: 1 1 100%;
        max-width: none;
    }

    .bbs-article__content h2.wp-block-heading,
    .bbs-article__content .is-style-bbs-toc-title {
        font-size: 28px;
        line-height: 1.3;
    }

    .bbs-article__content :is(h3, h4, h5, h6).wp-block-heading:not(.is-style-bbs-plain) {
        font-size: 22px;
        line-height: 1.3;
    }
}

@media (max-width: 639px) {
    .bbs-article__content,
    .bbs-article__content p,
    .bbs-article__content li {
        font-size: 18px;
        line-height: 1.55;
    }

    .bbs-article__content .is-style-bbs-toc-title {
        font-size: 24px;
    }

    .bbs-article__content .is-style-bbs-note-impact {
        font-size: 22px;
    }

    .bbs-article__content .is-style-bbs-note-box {
        padding: 30px;
    }

    .bbs-article__content .wp-block-table:is(.is-style-bbs-table, .is-style-bbs-table-plain) {
        font-size: 15px;
    }

    .bbs-article__content .wp-block-table:is(.is-style-bbs-table, .is-style-bbs-table-plain) :is(th, td) {
        padding: 10px;
    }
}

/* The editor's own title field over the article. */
.editor-styles-wrapper .editor-post-title {
    max-width: 1200px;
    margin: 30px auto 20px;
    font-size: 40px;
    line-height: 1.2;
    font-weight: 700;
}