/* /sobre/ as a bold page (artboard canvas/v2/Main.dc.html, owner-approved 2026-10-02): the page's own layout.
   Loaded after bold-kit.css, only on /sobre/ (lib/pages-bold.php). Markup: lib/pages-bold/sobre.php.
   Every rule starts with html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre (the <main>), px only.
   Layouts: two columns from 901px (the artboard), stacked at 900px and under (tablet 641 to 900, phone to 640).
   The cover has a third layout from 901 to 1239px (the name across both columns): see the cover block.
   Work log: 03-notes/curvatura-inner-bold-20261002/sobre.md.
   Owner decision 2026-10-02 (board #01) changed the "Atuação clínica" section from the artboard: see that block.
   Owner taste 2026-10-02 (lines off titles) changed the cover's line bundles from the artboard: see the cover block. */

/* ---------- cover (navy): the name at 104px on two lines, the portrait at the right, 110px into the next band.
   Owner taste 2026-10-02 (lines off titles): no line of the cover runs behind the name, the sub-head, the lead or
   the pills, at any width. The lines run UNDER the pills: the copy's bottom padding (128px, was 96px) is their
   channel in the navy band, and the photo's overlap (110px, was 94px) hides them where they pass behind the
   photo over the next band. Do not shrink either: the lines would reach the pills or show under the photo. */
html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-cover-grid { --mpb-sobre-photo: clamp(400px, 36.2vw, 520px); display: grid; grid-template-columns: minmax(0, 1fr); gap: 40px; align-items: start; }
html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-cover-copy { padding: 64px 0 128px; }
/* the longest line of the name is 7.3em wide: the size follows the text column, so the name never wraps or overflows */
html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-cover .mpb-cover-title { --mpb-cover-size: clamp(40px, calc((100vw - 2 * var(--mpc-pad) - 40px - var(--mpb-sobre-photo)) / 7.45), 104px); --mpb-cover-lh: 1; white-space: nowrap; }
html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-cover-sub { max-width: 640px; margin-top: 44px; text-wrap: pretty; }
html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-cover-lead { margin-top: 20px; }
html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-cover-actions { margin-top: 36px; }
html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-cover-photo { aspect-ratio: 2 / 3; margin: 36px 0 -110px; }
/* Owner taste 2026-10-02 (lines off titles): one drawing above 900px (1440 x 320, lib/pages-bold/sobre.php), scaled
   with the screen under 1440px. Its layer stands on the band's bottom edge and hangs 110 units under it, so y 210
   of the drawing is always ON the edge: light-blue lines above it (under the pills), cobalt below it (over the top
   strip of the ledger band, down to 100 units under the edge), whatever the band's height. The lines end behind
   the photo. They keep their 1.5px weight when the drawing shrinks or, on the stacked cover, grows. */
html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-sweep { --mpb-sobre-u: calc(min(100vw, 1440px) / 1440); top: auto; bottom: calc(-110 * var(--mpb-sobre-u)); height: calc(320 * var(--mpb-sobre-u)); }
html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre :is(.mpb-sobre-sweep, .mpb-sobre-lines-capa) path { vector-effect: non-scaling-stroke; }
@media (min-width: 901px) {
	html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-cover-grid { grid-template-columns: minmax(0, 1fr) var(--mpb-sobre-photo); }
	/* when the text is taller than the photo (narrow laptops) the photo stays at the bottom and keeps its overlap */
	html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-cover-photo { align-self: end; }
}
@media (min-width: 901px) and (max-width: 1239px) {
	/* Review r1, 2026-10-02 (tablets held sideways and small laptops): beside the photo the name had only the text
	   column and fell to 55px at 901 and 72px at 1024, under the kit's 88px and under a 768px tablet (96px). Here
	   the name runs across both columns at 104px (it is 769px wide; the wrap is 853px at 901), and the sub-head,
	   the lead and the pills stand under it beside the photo. The text block is a set of grid rows (its wrapper
	   is display: contents), the photo spans them and is as tall as they are, plus its 110px overlap. From
	   1240px the name fits the text column at 88px or more and the artboard's two columns take over.
	   The channels of the line drawing are unchanged: 128px under the pills, 110px of photo under the band. */
	html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-cover-grid { grid-template-rows: auto auto auto 1fr; gap: 0 40px; padding-top: 64px; }
	html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-cover-copy { display: contents; }
	html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-cover .mpb-cover-title { grid-column: 1 / -1; grid-row: 1; --mpb-cover-size: clamp(88px, calc((100vw - 2 * var(--mpc-pad)) / 7.5), 104px); }
	html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-cover-sub { grid-column: 1; grid-row: 2; }
	html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-cover-lead { grid-column: 1; grid-row: 3; }
	html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-cover-actions { grid-column: 1; grid-row: 4; align-self: start; margin-bottom: 128px; }
	/* the photo starts level with the sub-head's first line and is cut to the rows' height (never squat) */
	html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-cover-photo { grid-column: 2; grid-row: 2 / 5; align-self: stretch; aspect-ratio: auto; min-height: calc(var(--mpb-sobre-photo) * 1.25); margin: 48px 0 -110px; }
	/* the cut keeps the doctor (left of centre) when the sides go and the three lanterns when the height goes */
	html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-cover-photo img { position: absolute; inset: 0; object-position: 35% 10%; }
}
@media (max-width: 900px) {
	/* Owner taste 2026-10-02 (lines off titles): the stacked cover's drawing no longer rises behind the name. It
	   runs in the gap between the pills and the photo, which is 64 units of its 390-unit frame (the drawing is as
	   wide as the screen, so the gap is in vw: 20 units of air under the pills, 34 of lines, 10 over the photo at
	   the left edge), and ends behind the photo. --mpb-sobre-stack is the distance from the band's bottom edge up
	   to the photo's top edge (the photo's height less its overlap): the drawing is placed from it, 54 of its 110
	   units under that edge. Keep the three values in step with the photo's ratio and bottom margin at 900, 640
	   and 520px, and do not shrink the gap: the lines would reach the pills. */
	html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-cover { --mpb-sobre-stack: calc(100vw - 2 * var(--mpc-pad) - 72px); }
	html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-cover-grid { gap: calc(100vw * 64 / 390); }
	/* top padding: 12.3vw on phones as before; held at 72px on tablets now that no drawing stands behind the name */
	html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-cover-copy { padding: min(12.3vw, 72px) 0 0; }
	html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-cover .mpb-cover-title { --mpb-cover-size: clamp(36px, calc((100vw - 2 * var(--mpc-pad)) / 7.5), 104px); }
	html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-cover-sub { margin-top: 36px; }
	html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-cover-photo { aspect-ratio: 1 / 1; margin: 0 0 -72px; }
	/* the drawing of the stacked cover: as wide as the screen, between the pills and the photo */
	html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-lines-capa .mpb-bundle-svg { bottom: calc(var(--mpb-sobre-stack) - 100vw * 54 / 390); width: 100vw; height: calc(100vw * 110 / 390); }
}
@media (max-width: 640px) {
	html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-cover { --mpb-sobre-stack: calc(100vw - 2 * var(--mpc-pad) - 56px); }
	html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-cover-sub { margin-top: 28px; }
	html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-cover-lead { margin-top: 16px; }
	html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-cover-actions { margin-top: 28px; gap: 12px; }
	html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-cover-photo { margin-bottom: -56px; }
}
/* the photo crops change at 520px, not at 640: an upright photo as wide as a large phone would fill two screens */
@media (max-width: 520px) {
	html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-cover { --mpb-sobre-stack: calc((100vw - 2 * var(--mpc-pad)) * 1.5 - 56px); }
	html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-cover-photo { aspect-ratio: 2 / 3; }
}

/* ---------- credentials ledger (ground): starts under the photo's overlap; the cover drawing crosses its top strip.
   Owner taste 2026-10-02 (lines off titles): 150px (was 134px) with the photo's larger overlap, still 40px under the photo */
html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-ledger { padding-block: 150px 0; }
html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-nowrap { white-space: nowrap; font-size: inherit; line-height: inherit; }
html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-ledger .mpb-label { line-height: 1.2; }
@media (min-width: 1280px) { html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-usp { white-space: nowrap; } }
@media (max-width: 900px) { html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-ledger { padding-block: 112px 0; } }
@media (max-width: 640px) { html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-ledger { padding-block: 88px 0; } }

/* ---------- Atuação clínica (ground): the title, the hands-only photo as wide as the section, four numbered rows.
   Owner decision 2026-10-02 (board #01): hands only at every width (marcus-exame-joelho-tornozelo-maos, a
   landscape frame). The artboard's tall slot beside the rows (537 x 760, the frame with the face) is gone: the
   photo is a wide figure under the title (21:9 from 901px, 3:2 on tablets, 4:3 on phones, real crops) and the
   rows stand two by two from 1101px (numerals 153px at 1440: see the release audit note). Do not turn it back
   into a tall column.
   Review r1, 2026-10-02 (page length at 1440): the figure was 21:10 (640px tall at 1440) and is now 21:9 (576px);
   from 1101px the gaps around it are 40 and 48px (were 48 and 56px) and the band ends 72px under the rows (was
   96px). The section is 1287px at 1440 (was 1391px).
   Release audit 2026-10-03 (visual-hubs-08): the numerals 02, 03 and 04 ran 3 to 7px past their column and stood
   17 to 20px from the titles. The widest pair, "03", is 1.623 times its size wide and the kit's column is 1.58:
   here the column is 1.63 times the numeral, with a fixed 40px between column and text from 641px (on phones the
   numeral stands above the text: nothing changes there). The numerals keep the left margin and the titles keep
   one left edge; "01" is a narrower pair in this face, so more air follows it. */
html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-exame { aspect-ratio: 21 / 9; margin-top: 48px; }
html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-steps { --mpb-step-col: calc(var(--mpb-step-num) * 1.63); margin-top: 48px; }
html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-steps > li:last-child { padding-bottom: 0; }
@media (min-width: 641px) { html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-steps > li { column-gap: 40px; } }
@media (min-width: 1101px) {
	/* 01 02 over 03 04: each column keeps its own hairline, the text column is at least 270px wide (at 1101) */
	html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-atuacao { padding-bottom: 72px; }
	html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-exame { margin-top: 40px; }
	/* Two by two the text column has no width to give (its titles fit by a few px), so the wider numeral column
	   and gap come out of the numeral itself: 1.63 n + 40 = 1.58 N + 24, N being the kit's size for the width
	   (--mpb-sobre-step-ref). 153px at 1440 (was 168px); the text column, the lines of every title and the
	   section's height are what they were. */
	html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-steps { --mpb-sobre-step-ref: clamp(88px, 11.7vw, var(--mpb-step-max)); --mpb-step-num: calc((var(--mpb-sobre-step-ref) * 1.58 - 16px) / 1.63); display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: var(--mpb-gap); margin-top: 48px; }
	html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-steps > li:nth-child(2) { padding-top: 0; border-top: 0; }
	html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-steps > li:nth-child(-n+2) { padding-bottom: 28px; }
	html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-steps > li:nth-child(n+3) { padding-top: 28px; padding-bottom: 0; }
}
@media (min-width: 1101px) and (max-width: 1279px) {
	/* Owner decision 2026-10-02 (board #01), verifier fix: from 1101 to 1215px (tablets held sideways) the text
	   column was 8px too narrow for "Dor musculoesquelética", which left "Dor" alone on the first line. Slightly
	   smaller numerals (11vw, was 11.7vw) and a 32px gutter give the text column 24px more: the title fits.
	   Release audit 2026-10-03: the 11vw is now the reference the numeral is worked out from (see above). */
	html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-steps { --mpb-sobre-step-ref: clamp(88px, 11vw, var(--mpb-step-max)); column-gap: 32px; }
}
@media (min-width: 641px) and (max-width: 1100px) {
	/* one column of rows: the text beside the numeral keeps a readable measure */
	html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-steps .mpb-step-body { max-width: 600px; }
}
@media (max-width: 900px) {
	html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-exame { aspect-ratio: 3 / 2; margin-top: 40px; }
	html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-steps { margin-top: 40px; }
}
@media (max-width: 640px) {
	html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-exame { margin-top: 32px; }
	html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-steps { margin-top: 32px; }
}
@media (max-width: 520px) { html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-exame { aspect-ratio: 4 / 3; } }

/* ---------- Formação e trajetória (tint): the photo runs from the left screen edge, as tall as the band */
html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-formacao { --mpb-sobre-form-w: clamp(300px, calc(100vw - 660px), 440px); }
html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-form-body { padding-block: var(--mpb-band-y); }
html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-form-list { display: grid; grid-template-columns: minmax(0, 1fr); margin-top: 20px; border-top: 1.5px solid var(--mpb-line); }
html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-form-item { padding: 28px 0; border-bottom: 1px solid var(--mpb-hair); }
html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-form-item > dd { margin-top: 10px; }
html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-form-item:last-child { padding-bottom: 0; border-bottom: 0; }
@media (min-width: 641px) {
	html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-form-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-form-item { padding: 28px 32px 28px 0; }
	html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-form-item:nth-child(even) { padding: 28px 0 28px 32px; border-left: 1px solid var(--mpb-hair); }
	html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-form-item:nth-child(-n+2) { padding-top: 48px; }
	html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-form-item:nth-last-child(-n+2) { padding-bottom: 0; border-bottom: 0; }
}
@media (min-width: 901px) {
	html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-form-photo { position: absolute; top: 0; bottom: 0; left: 0; width: var(--mpb-sobre-form-w); }
	html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-form-photo img { position: absolute; inset: 0; object-position: 50% 60%; }
	html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-form-body { margin-left: calc(var(--mpb-sobre-form-w) + var(--mpb-gap) - var(--mpc-pad)); }
	/* the title is 15.6em wide and stays on one line beside the photo */
	html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-formacao .mpb-title { --mpb-title-size: clamp(30px, calc((100vw - var(--mpc-pad) - var(--mpb-gap) - var(--mpb-sobre-form-w)) / 15.9), 56px); }
}
/* from the artboard width up the photo grows with the margin (440px at 1440, 680px at 1920) and then stops */
@media (min-width: 1440px) {
	html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-form-photo { left: max(0px, calc(50% - 960px)); width: clamp(440px, calc(50% - 280px), 680px); }
	html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-form-body { margin-left: 448px; }
}
@media (max-width: 900px) {
	html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-form-photo { aspect-ratio: 1 / 1; }
}
@media (max-width: 520px) { html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-form-photo { aspect-ratio: 5 / 6; } }
@media (max-width: 640px) {
	html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-form-item { padding: 22px 0; }
	html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-form-item:first-child { padding-top: 32px; }
}

/* ---------- Ensino e sociedades médicas (cobalt): the drawing leaves through the bottom edge into the next band */
html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-ensino-lead { max-width: 440px; margin-top: 28px; }
@media (min-width: 901px) {
	/* "e sociedades" is 9em wide and must fit the 5fr column */
	html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-ensino .mpb-title { --mpb-title-size: clamp(30px, calc((100vw - 2 * var(--mpc-pad) - var(--mpb-gap)) * 0.0463), 56px); text-wrap: initial; }
}
@media (max-width: 900px) {
	html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-ensino-lead { max-width: 560px; margin-top: 20px; }
	/* the stacked drawing: as wide as the screen, 152px high, half in each band */
	html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-lines-ensino .mpb-bundle-svg { width: 100vw; height: 152px; }
	html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-lines-ensino path { vector-effect: non-scaling-stroke; }
}

/* ---------- Aulas, congressos e imprensa (ground): the drawing crosses the top padding; mosaic 2:1 with 12px gaps */
html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-aulas { padding-top: 124px; }
html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-mosaic { display: grid; grid-template-columns: minmax(0, 1fr); gap: 32px 12px; margin-top: 48px; }
html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-mosaic-col { display: grid; grid-template-columns: minmax(0, 1fr); gap: 32px 12px; align-content: start; }
html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-shot .mpb-fig { aspect-ratio: 444 / 250; }
html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-shot--main .mpb-fig { aspect-ratio: 888 / 554; }
@media (min-width: 641px) {
	html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-mosaic { gap: 24px 12px; }
	html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-mosaic-col { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (min-width: 901px) {
	html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-mosaic { grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); gap: 12px; align-items: stretch; }
	html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-mosaic-col { grid-template-columns: minmax(0, 1fr); gap: 18px; }
	/* the large photo is as tall as the two small ones with their captions */
	html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-shot--main { display: flex; flex-direction: column; }
	html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-shot--main .mpb-fig { flex: 1 1 auto; min-height: 0; aspect-ratio: auto; }
	html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-shot--main .mpb-fig img { position: absolute; inset: 0; }
}
@media (max-width: 900px) {
	html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-aulas { padding-top: 112px; }
	html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-mosaic { margin-top: 40px; }
}
@media (max-width: 640px) {
	html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-mosaic { margin-top: 32px; }
}

/* ---------- Livros e capítulos (tint): four flat covers standing on an ink rule, titles under it */
html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-livros-lead { max-width: none; margin-top: 28px; }
html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-shelf { --mpb-sobre-shelf-gap: 24px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: var(--mpb-sobre-shelf-gap); row-gap: 40px; align-items: end; margin-top: 40px; }
html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-book-fig { display: flex; flex-direction: column; justify-content: flex-end; }
html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-book-fig img { width: 100%; height: auto; }
html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-book-cap { position: relative; min-height: calc(18px + 3 * 1.35em); margin-top: 0; padding-top: 18px; line-height: 1.35 !important; }
/* the rule runs through the gaps: each caption draws its share */
html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-book-cap::before { content: ''; position: absolute; top: 0; left: calc(var(--mpb-sobre-shelf-gap) / -2); right: calc(var(--mpb-sobre-shelf-gap) / -2); border-top: 1.5px solid var(--mpb-line); }
html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-book:nth-child(odd) .mpb-sobre-book-cap::before { left: 0; }
html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-book:nth-child(even) .mpb-sobre-book-cap::before { right: 0; }
/* covers and titles on two shared rows, so every cover stands on the same line whatever the title's length */
@supports (grid-template-rows: subgrid) {
	html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-shelf { align-items: stretch; grid-auto-rows: auto; }
	html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-book,
	html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-book-fig { display: grid; grid-row: span 2; grid-template-rows: subgrid; row-gap: 0; }
	html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-book-fig img { align-self: end; }
	html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-book-cap { min-height: 0; }
}
@media (min-width: 641px) {
	html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-shelf { --mpb-sobre-shelf-gap: 32px; grid-template-columns: repeat(4, minmax(0, 1fr)); margin-top: 48px; }
	html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-book:nth-child(n) .mpb-sobre-book-cap::before { left: calc(var(--mpb-sobre-shelf-gap) / -2); right: calc(var(--mpb-sobre-shelf-gap) / -2); }
	html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-book:first-child .mpb-sobre-book-cap::before { left: 0; }
	html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-book:last-child .mpb-sobre-book-cap::before { right: 0; }
}
@media (min-width: 1101px) { html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-shelf { --mpb-sobre-shelf-gap: clamp(40px, 4.45vw, 64px); } }

/* ---------- Onde atendo (ground): the entrance at the left, the address in display type */
html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-onde-name { margin-top: 32px; color: var(--mpb-fg); font-size: 19px; font-weight: 600; line-height: 1.4; }
html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-address { margin-top: 10px; color: var(--mpb-fg); font-size: clamp(26px, calc((100vw - 96px) / 33), 40px); line-height: 1.08; text-wrap: initial; }
html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-onde-text { margin-top: 28px; }
html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-onde-actions { margin-top: 36px; gap: 12px; }
@media (min-width: 901px) {
	html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-onde .mpb-title { --mpb-title-size: clamp(30px, calc((100vw - 2 * var(--mpc-pad) - var(--mpb-gap)) * 0.047), 56px); }
}
@media (max-width: 900px) {
	/* "Alameda Jaú, 687" is 11.3em wide: one line down to 320px */
	html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-address { font-size: clamp(22px, calc((100vw - 2 * var(--mpc-pad)) / 11.5), 40px); }
}
@media (max-width: 640px) {
	html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-onde-name { margin-top: 24px; font-size: 18px; }
	html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-onde-text { margin-top: 20px; }
	html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-onde-actions { margin-top: 28px; }
}

/* ---------- Antes de agendar (tint): title and two pills at the left (the stored page's two closing links), the
   three stored questions at the right */
html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-faq-actions { margin-top: 32px; gap: 12px; }
html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-faq .mpb-faq { --mpb-faq-size: clamp(20px, 1.67vw, 24px); }
html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-faq .mpb-faq-btn { padding-top: 22px; padding-bottom: 22px; }
html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-faq .mpb-faq-btn[aria-expanded="true"] { padding-bottom: 14px; }
html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-faq .mpb-faq-a { padding-bottom: 28px; }
@media (max-width: 640px) {
	html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-faq-actions { margin-top: 24px; }
	html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-faq .mpb-faq-btn { padding-top: 18px; padding-bottom: 18px; }
	html body:is(#mpc, .mpc-site).mpb-page .mpb-sobre .mpb-sobre-faq .mpb-faq-a { padding-bottom: 22px; }
}