/* /seguranca-em-procedimentos/ as a bold page ("Curvatura em cor", plan plans/seguranca-em-procedimentos.md,
   2026-10-02): the page's own layout. Markup: lib/pages-bold/seguranca.php. Shared vocabulary: bold-kit.css (loaded
   before this file). Every rule starts with html body:is(#mpc, .mpc-site).mpb-page .mpb-seguranca (the <main>), except
   the first one, which marks the nav item of the section in the site header (body.mpb-seguranca). px only.

   Widths: 1440 is the plan. 901 to 1439 keeps every band and scales what the line bundles pass by with the screen
   (--mpb-seguranca-s); the photo strip is one row from 1281 and a mosaic (one large tile, two small ones) from 901 to
   1280, so no photo is ever under 280px wide. 900 and less stacks the bands (photo strip: one wide tile over two
   squares); phones put every tile and every numeral in one column and set the title in two sizes.
   Line bundles never cross a title (owner decision #08). */

/* the section this page belongs to, underlined in the header as the current item is (visual mark only) */
html body:is(#mpc, .mpc-site).mpb-page.mpb-seguranca .mph-nav a.mpc-navlink[href$="/como-funciona-a-avaliacao/"] { text-decoration: underline; text-decoration-color: var(--mpc-accent); text-decoration-thickness: 2px; text-underline-offset: 6px; }

html body:is(#mpc, .mpc-site).mpb-page .mpb-seguranca { --mpb-seguranca-s: min(100vw, 1440px); }

/* ---------- line bundles: the desktop drawings shrink with the screen (kit: mpb-bundle--fit) and keep their stroke;
   the phone drawings are made on a 390 frame and stretched to the screen width. A sweep is ONE drawing printed in
   the lower band: its middle (the split of the two colours) lies on the border between the two bands. */
html body:is(#mpc, .mpc-site).mpb-page .mpb-seguranca .mpb-seguranca-lines path { vector-effect: non-scaling-stroke; }
html body:is(#mpc, .mpc-site).mpb-page .mpb-seguranca .mpb-seguranca-lines--phone { --mpb-w: 100vw; --mpb-h: calc(100vw * var(--mpb-bhn) / var(--mpb-bwn)); left: 0; margin-left: 0; }
html body:is(#mpc, .mpc-site).mpb-page .mpb-seguranca .mpb-seguranca-lines--sweep { top: calc(var(--mpb-h) * -0.5); }

/* ---------- cover (navy, no photo): the title at 120px in three lines ("PROCEDIMENTOS" is 10.42em wide and fills the
   page), lead and pills in the left half; the wave enters under the second title line at the right and falls through
   the lower right. Title, lead width and the wave scale together. */
html body:is(#mpc, .mpc-site).mpb-page .mpb-seguranca .mpb-seguranca-cover { padding-top: calc(var(--mpb-seguranca-s) * 0.0611); }
html body:is(#mpc, .mpc-site).mpb-page .mpb-seguranca .mpb-seguranca-cover .mpb-cover-title { --mpb-cover-size: calc(var(--mpb-seguranca-s) * 0.0833); }
/* the h1 is two spans (lib/pages-bold/seguranca.php): one size and the title's own line height from 641px */
html body:is(#mpc, .mpc-site).mpb-page .mpb-seguranca .mpb-seguranca-cover .mpb-cover-title .mpb-display { line-height: inherit; }
html body:is(#mpc, .mpc-site).mpb-page .mpb-seguranca .mpb-seguranca-cover .mpb-lead { max-width: calc(var(--mpb-seguranca-s) * 0.528); margin-top: 36px; }
html body:is(#mpc, .mpc-site).mpb-page .mpb-seguranca .mpb-seguranca-cover .mpc-actions { max-width: calc(var(--mpb-seguranca-s) * 0.56); margin-top: 40px; }
@media (max-width: 900px) {
	/* stacked: the title as wide as the page; a turn of light lines in the bottom right corner, under the pills
	   (its top line is 88 units of the 390 frame above the band's bottom edge) */
	html body:is(#mpc, .mpc-site).mpb-page .mpb-seguranca .mpb-seguranca-cover { padding: 64px 0 calc(100vw * 116 / 390); }
	html body:is(#mpc, .mpc-site).mpb-page .mpb-seguranca .mpb-seguranca-cover .mpb-cover-title { --mpb-cover-size: calc((100vw - 2 * var(--mpc-pad)) / 10.5); }
	html body:is(#mpc, .mpc-site).mpb-page .mpb-seguranca .mpb-seguranca-cover .mpb-lead { max-width: 640px; margin-top: 28px; }
	html body:is(#mpc, .mpc-site).mpb-page .mpb-seguranca .mpb-seguranca-cover .mpc-actions { max-width: none; margin-top: 32px; }
}
@media (max-width: 640px) {
	/* phone: one size would be set by "PROCEDIMENTOS" (10.42em: 34px at 390, 27px at 320). Two sizes instead:
	   "SEGURANÇA" (7.52em) as wide as the page, 38px at 320 and 47px at 390, and the rest in Unbounded 400 under it,
	   "EM PROCEDIMENTOS" (12.83em) as wide as the page too, then "PARA DOR". No word is ever broken. */
	html body:is(#mpc, .mpc-site).mpb-page .mpb-seguranca .mpb-seguranca-cover .mpb-cover-title { --mpb-cover-size: min(64px, calc((100vw - 2 * var(--mpc-pad)) / 7.6)); }
	html body:is(#mpc, .mpc-site).mpb-page .mpb-seguranca .mpb-seguranca-cover .mpb-seguranca-h1-a { display: block; }
	html body:is(#mpc, .mpc-site).mpb-page .mpb-seguranca .mpb-seguranca-cover .mpb-seguranca-h1-b { display: block; margin-top: 8px; font-size: min(36px, calc((100vw - 2 * var(--mpc-pad)) / 13)); font-weight: 400 !important; line-height: 1.14; }
	html body:is(#mpc, .mpc-site).mpb-page .mpb-seguranca .mpb-seguranca-cover .mpb-seguranca-h1-br { display: none; }
	html body:is(#mpc, .mpc-site).mpb-page .mpb-seguranca .mpb-seguranca-cover { padding-top: 48px; }
	html body:is(#mpc, .mpc-site).mpb-page .mpb-seguranca .mpb-seguranca-cover .mpb-lead { margin-top: 22px; }
	html body:is(#mpc, .mpc-site).mpb-page .mpb-seguranca .mpb-seguranca-cover .mpc-actions { margin-top: 28px; }
}

/* ---------- Critério médico (ground): title 5 / statement and two paragraphs 7; then three real photos edge to edge,
   hands only, 12px apart, standing on the band's bottom edge. Three layouts, each with its own crop of each photo:
   from 1281  one row, 760 : 300 : 356 at 1440 (420px high; the height follows the screen); the two narrow tiles
              never go under 280px;
   901-1280   a mosaic: the exam photo large at the left (two thirds), needle and shock waves one over the other at
              the right (4:3, 296 to 423px wide). Three tiles in one row would be 186 to 266px wide here;
   900, less  the exam photo across the screen (16:9) over the two others as squares; one per row on phones (5:4). */
html body:is(#mpc, .mpc-site).mpb-page .mpb-seguranca .mpb-seguranca-criterio { padding-top: var(--mpb-band-y); }
html body:is(#mpc, .mpc-site).mpb-page .mpb-seguranca .mpb-seguranca-criterio-text .mpb-statement { margin-top: 4px; }
html body:is(#mpc, .mpc-site).mpb-page .mpb-seguranca .mpb-seguranca-criterio-text .mpb-text { max-width: 700px; margin-top: 18px; }
html body:is(#mpc, .mpc-site).mpb-page .mpb-seguranca .mpb-seguranca-criterio-text .mpb-text + .mpb-text { margin-top: 14px; }
html body:is(#mpc, .mpc-site).mpb-page .mpb-seguranca .mpb-seguranca-strip { display: grid; grid-template-columns: minmax(0, 760fr) minmax(280px, 300fr) minmax(280px, 356fr); gap: 12px; height: min(29.17vw, 640px); margin-top: 64px; }
html body:is(#mpc, .mpc-site).mpb-page .mpb-seguranca .mpb-seguranca-tile { height: 100%; min-width: 0; }
/* plates: the tiles stand on the cobalt band, so the notch gets a floor; a plate at a screen edge starts at the gutter */
html body:is(#mpc, .mpc-site).mpb-page .mpb-seguranca .mpb-seguranca-tile .mpb-plate { padding-bottom: 12px; }
html body:is(#mpc, .mpc-site).mpb-page .mpb-seguranca .mpb-seguranca-tile--1 .mpb-plate { padding-left: var(--mpc-pad); }
html body:is(#mpc, .mpc-site).mpb-page .mpb-seguranca .mpb-seguranca-tile--2 .mpb-plate { padding-left: 20px; }
html body:is(#mpc, .mpc-site).mpb-page .mpb-seguranca .mpb-seguranca-tile--3 .mpb-plate { padding-right: var(--mpc-pad); }
@media (min-width: 901px) and (max-width: 1280px) {
	/* mosaic: the rows are set by the two 4:3 tiles; the large tile takes both (its photo is laid over the box, so
	   it never sets the height). The small tiles carry the label alone. */
	html body:is(#mpc, .mpc-site).mpb-page .mpb-seguranca .mpb-seguranca-strip { grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); height: auto; }
	html body:is(#mpc, .mpc-site).mpb-page .mpb-seguranca .mpb-seguranca-tile { height: auto; }
	html body:is(#mpc, .mpc-site).mpb-page .mpb-seguranca .mpb-seguranca-tile--1 { grid-row: 1 / span 2; }
	html body:is(#mpc, .mpc-site).mpb-page .mpb-seguranca .mpb-seguranca-tile--1 img { position: absolute; inset: 0; }
	html body:is(#mpc, .mpc-site).mpb-page .mpb-seguranca .mpb-seguranca-tile--2, html body:is(#mpc, .mpc-site).mpb-page .mpb-seguranca .mpb-seguranca-tile--3 { aspect-ratio: 4 / 3; }
	/* both small tiles end at the screen edge: their plates stand in the bottom right corner, on the gutter line
	   (at the bottom left the needle plate would cover the acupuncture figure) */
	html body:is(#mpc, .mpc-site).mpb-page .mpb-seguranca .mpb-seguranca-tile--2 .mpb-plate { left: auto; right: 0; padding: 14px var(--mpc-pad) 12px 24px; }
	html body:is(#mpc, .mpc-site).mpb-page .mpb-seguranca .mpb-seguranca-tile--2 .mpb-plate-label { font-size: 16px; }
}
@media (min-width: 901px) and (max-width: 1399px) {
	/* the shock wave tile is 296 to 345px wide here: its plate carries the label alone, on one line */
	html body:is(#mpc, .mpc-site).mpb-page .mpb-seguranca .mpb-seguranca-tile--3 .mpb-plate-text { display: none; }
	html body:is(#mpc, .mpc-site).mpb-page .mpb-seguranca .mpb-seguranca-tile--3 .mpb-plate-label { font-size: 16px; white-space: nowrap; }
}
@media (max-width: 900px) {
	/* the exam photo across the screen (16:9), the two other frames side by side as squares */
	html body:is(#mpc, .mpc-site).mpb-page .mpb-seguranca .mpb-seguranca-strip { grid-template-columns: repeat(2, minmax(0, 1fr)); height: auto; margin-top: 48px; }
	html body:is(#mpc, .mpc-site).mpb-page .mpb-seguranca .mpb-seguranca-tile { height: auto; }
	html body:is(#mpc, .mpc-site).mpb-page .mpb-seguranca .mpb-seguranca-tile--1 { grid-column: 1 / -1; aspect-ratio: 16 / 9; }
	html body:is(#mpc, .mpc-site).mpb-page .mpb-seguranca .mpb-seguranca-tile--2, html body:is(#mpc, .mpc-site).mpb-page .mpb-seguranca .mpb-seguranca-tile--3 { aspect-ratio: 1 / 1; }
	html body:is(#mpc, .mpc-site).mpb-page .mpb-seguranca .mpb-seguranca-tile--2 .mpb-plate { padding-left: var(--mpc-pad); }
}
@media (max-width: 640px) {
	/* phone: one tile per row; each plate becomes a caption under its photo (on a 390px photo the plate would cover
	   the hand that holds the leg) */
	html body:is(#mpc, .mpc-site).mpb-page .mpb-seguranca .mpb-seguranca-strip { grid-template-columns: minmax(0, 1fr); gap: 20px; margin-top: 40px; padding-bottom: 32px; }
	html body:is(#mpc, .mpc-site).mpb-page .mpb-seguranca .mpb-seguranca-tile, html body:is(#mpc, .mpc-site).mpb-page .mpb-seguranca .mpb-seguranca-tile--1, html body:is(#mpc, .mpc-site).mpb-page .mpb-seguranca .mpb-seguranca-tile--2, html body:is(#mpc, .mpc-site).mpb-page .mpb-seguranca .mpb-seguranca-tile--3 { aspect-ratio: auto; background: none; }
	html body:is(#mpc, .mpc-site).mpb-page .mpb-seguranca .mpb-seguranca-tile img { height: auto; aspect-ratio: 5 / 4; }
	html body:is(#mpc, .mpc-site).mpb-page .mpb-seguranca .mpb-seguranca-tile .mpb-plate { position: static; max-width: none; padding: 12px var(--mpc-pad) 0; }
	html body:is(#mpc, .mpc-site).mpb-page .mpb-seguranca .mpb-seguranca-tile .mpb-plate-label { font-size: 16px; }
}

/* ---------- eight checks, 01 to 08 (cobalt): two blocks of four columns under a one-line title with its white rule;
   white numerals at 160px. No bundle here: the numerals fill the band. */
html body:is(#mpc, .mpc-site).mpb-page .mpb-seguranca .mpb-seguranca-etapas { padding-block: calc(var(--mpb-band-y) + 16px); }
html body:is(#mpc, .mpc-site).mpb-page .mpb-seguranca .mpb-seguranca-bloco + .mpb-seguranca-bloco { margin-top: var(--mpb-band-y); }
html body:is(#mpc, .mpc-site).mpb-page .mpb-seguranca .mpb-seguranca-steps { --mpb-step-max: 160px; margin-top: 44px; }
html body:is(#mpc, .mpc-site).mpb-page .mpb-seguranca .mpb-seguranca-steps .mpb-num { line-height: 1; }
html body:is(#mpc, .mpc-site).mpb-page .mpb-seguranca .mpb-seguranca-steps .mpb-item-title { margin-top: 24px; line-height: 1.25; }
html body:is(#mpc, .mpc-site).mpb-page .mpb-seguranca .mpb-seguranca-steps .mpb-text { margin-top: 10px; text-wrap: pretty; }
/* numeral, title and text are three rows shared by the columns (subgrid): the texts start on one line even when a
   title wraps on a narrower screen */
@supports (grid-template-rows: subgrid) {
	@media (min-width: 641px) {
		html body:is(#mpc, .mpc-site).mpb-page .mpb-seguranca .mpb-seguranca-steps { row-gap: 0; }
		html body:is(#mpc, .mpc-site).mpb-page .mpb-seguranca .mpb-seguranca-steps > li { display: grid; grid-row: span 3; grid-template-rows: subgrid; grid-template-columns: minmax(0, 1fr); gap: 0; }
	}
	@media (min-width: 641px) and (max-width: 1100px) {
		html body:is(#mpc, .mpc-site).mpb-page .mpb-seguranca .mpb-seguranca-steps > li:nth-child(n+3) { margin-top: 48px; }
	}
}
@media (max-width: 900px) {
	html body:is(#mpc, .mpc-site).mpb-page .mpb-seguranca .mpb-seguranca-steps { margin-top: 36px; }
}
@media (max-width: 640px) {
	html body:is(#mpc, .mpc-site).mpb-page .mpb-seguranca .mpb-seguranca-etapas { padding-block: var(--mpb-band-y); }
	html body:is(#mpc, .mpc-site).mpb-page .mpb-seguranca .mpb-seguranca-steps { margin-top: 32px; }
	html body:is(#mpc, .mpc-site).mpb-page .mpb-seguranca .mpb-seguranca-steps .mpb-item-title { margin-top: 16px; }
}

/* ---------- Informações que mudam a decisão (tint): title, one lead, then a 2 x 2 ledger: the name in Unbounded 40px
   over its stored sentence */
html body:is(#mpc, .mpc-site).mpb-page .mpb-seguranca .mpb-seguranca-info .mpb-lead { margin-top: 18px; color: var(--mpb-fg); }
html body:is(#mpc, .mpc-site).mpb-page .mpb-seguranca .mpb-seguranca-ledger { margin-top: 40px; }
html body:is(#mpc, .mpc-site).mpb-page .mpb-seguranca .mpb-seguranca-ledger .mpb-ledger-cell { padding-top: 30px; padding-bottom: 40px; }
html body:is(#mpc, .mpc-site).mpb-page .mpb-seguranca .mpb-seguranca-ledger .mpb-ledger-value { margin-top: 0; }
html body:is(#mpc, .mpc-site).mpb-page .mpb-seguranca .mpb-seguranca-ledger .mpb-text { max-width: 520px; margin-top: 18px; text-wrap: pretty; }
@media (max-width: 900px) {
	html body:is(#mpc, .mpc-site).mpb-page .mpb-seguranca .mpb-seguranca-ledger { margin-top: 32px; }
	html body:is(#mpc, .mpc-site).mpb-page .mpb-seguranca .mpb-seguranca-ledger .mpb-ledger-cell { padding-top: 24px; padding-bottom: 28px; }
	html body:is(#mpc, .mpc-site).mpb-page .mpb-seguranca .mpb-seguranca-ledger .mpb-text { max-width: 640px; margin-top: 12px; }
}

/* ---------- Na clínica, com alvo definido (navy): title, lead, six white row links two by two, then three ledger cells
   with light rules. The light half of the sweep crosses the band's bottom padding (160px at 1440; its highest line is
   121px above the border). */
html body:is(#mpc, .mpc-site).mpb-page .mpb-seguranca .mpb-seguranca-proc { padding-bottom: calc(var(--mpb-seguranca-s) * 0.1111); }
html body:is(#mpc, .mpc-site).mpb-page .mpb-seguranca .mpb-seguranca-proc .mpb-lead { margin-top: 20px; }
html body:is(#mpc, .mpc-site).mpb-page .mpb-seguranca .mpb-seguranca-proc-nav { margin-top: 48px; }
html body:is(#mpc, .mpc-site).mpb-page .mpb-seguranca .mpb-seguranca-proc-nav .mpb-rows > li { display: grid; }
html body:is(#mpc, .mpc-site).mpb-page .mpb-seguranca .mpb-seguranca-proc-nav .mpb-row { --mpb-row-pad: 24px; }
html body:is(#mpc, .mpc-site).mpb-page .mpb-seguranca .mpb-seguranca-proc-nav .mpb-row-ctx { max-width: 520px; color: var(--mpc-on-navy); text-wrap: pretty; }
html body:is(#mpc, .mpc-site).mpb-page .mpb-seguranca .mpb-seguranca-tecnicas { margin-top: 64px; }
html body:is(#mpc, .mpc-site).mpb-page .mpb-seguranca .mpb-seguranca-tecnica { color: #FFFFFF; font-size: 15px !important; font-weight: 600 !important; line-height: 1.4 !important; }
html body:is(#mpc, .mpc-site).mpb-page .mpb-seguranca .mpb-seguranca-tecnicas .mpb-text { margin-top: 10px; text-wrap: pretty; }
@media (max-width: 900px) {
	/* room for the phone sweep under the ledger (its lines reach 62 units of the 390 frame above the border) */
	html body:is(#mpc, .mpc-site).mpb-page .mpb-seguranca .mpb-seguranca-proc { padding-bottom: calc(100vw * 62 / 390 + 44px); }
	html body:is(#mpc, .mpc-site).mpb-page .mpb-seguranca .mpb-seguranca-proc-nav { margin-top: 36px; }
	html body:is(#mpc, .mpc-site).mpb-page .mpb-seguranca .mpb-seguranca-tecnicas { margin-top: 48px; }
}

/* ---------- Perguntas frequentes (ground): the cobalt half of the sweep crosses the top padding (176px at 1440; its
   lowest line is 131px under the border); title with the pill at the right, then the five questions, all open, two by
   two (the list's own 1.5px rule is the rule under the title). The fifth, the page's one safety statement, takes the
   whole row. */
html body:is(#mpc, .mpc-site).mpb-page .mpb-seguranca .mpb-seguranca-faq { padding-top: calc(var(--mpb-seguranca-s) * 0.1222); }
html body:is(#mpc, .mpc-site).mpb-page .mpb-seguranca .mpb-seguranca-faq .mpb-faq { margin-top: 20px; }
@media (min-width: 901px) {
	html body:is(#mpc, .mpc-site).mpb-page .mpb-seguranca .mpb-seguranca-faq .mpb-faq { align-items: stretch; }
	html body:is(#mpc, .mpc-site).mpb-page .mpb-seguranca .mpb-seguranca-faq .mpb-faq-item:last-child { grid-column: 1 / -1; }
	html body:is(#mpc, .mpc-site).mpb-page .mpb-seguranca .mpb-seguranca-faq .mpb-faq-item:last-child .mpb-faq-a > p { max-width: 760px; }
	html body:is(#mpc, .mpc-site).mpb-page .mpb-seguranca .mpb-seguranca-faq .mpb-faq-btn { padding-top: 36px; }
	html body:is(#mpc, .mpc-site).mpb-page .mpb-seguranca .mpb-seguranca-faq .mpb-faq-btn[aria-expanded="true"] { padding-bottom: 16px; }
}
@media (max-width: 900px) {
	/* the phone sweep in the top padding (lines reach 60 units under the border) */
	html body:is(#mpc, .mpc-site).mpb-page .mpb-seguranca .mpb-seguranca-faq { padding-top: calc(100vw * 60 / 390 + 48px); }
	html body:is(#mpc, .mpc-site).mpb-page .mpb-seguranca .mpb-seguranca-faq .mpb-faq-q { --mpb-faq-size: clamp(21px, 3.2vw, 26px); }
}
@media (max-width: 640px) {
	html body:is(#mpc, .mpc-site).mpb-page .mpb-seguranca .mpb-seguranca-faq .mpb-faq { margin-top: 16px; }
}

/* ---------- Leituras úteis (tint): one rule under the title, four row links in two columns, then the two stored
   references (external links) with their descriptions in body colour */
html body:is(#mpc, .mpc-site).mpb-page .mpb-seguranca .mpb-seguranca-leituras .mpb-rows { border-top: 0; }
html body:is(#mpc, .mpc-site).mpb-page .mpb-seguranca .mpb-seguranca-leituras .mpb-rows--cols > li:nth-child(-n+2) { border-top: 0; }
html body:is(#mpc, .mpc-site).mpb-page .mpb-seguranca .mpb-seguranca-leituras .mpb-row { --mpb-row-pad: 22px; }
html body:is(#mpc, .mpc-site).mpb-page .mpb-seguranca .mpb-seguranca-refs { margin-top: 56px; }
html body:is(#mpc, .mpc-site).mpb-page .mpb-seguranca .mpb-seguranca-refs-label { color: var(--mpb-text); font-size: 15px !important; font-weight: 600 !important; line-height: 1.4 !important; }
html body:is(#mpc, .mpc-site).mpb-page .mpb-seguranca .mpb-seguranca-ref-list { display: grid; grid-template-columns: minmax(0, 1fr); gap: 24px var(--mpb-gap); margin-top: 6px; }
html body:is(#mpc, .mpc-site).mpb-page .mpb-seguranca .mpb-seguranca-ref-list .mpb-link { display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 56px; }
html body:is(#mpc, .mpc-site).mpb-page .mpb-seguranca .mpb-seguranca-ref-list .mpb-link .mpc-ico { flex: none; }
html body:is(#mpc, .mpc-site).mpb-page .mpb-seguranca .mpb-seguranca-ref-list .mpb-text { margin-top: 10px; }
@media (min-width: 901px) {
	html body:is(#mpc, .mpc-site).mpb-page .mpb-seguranca .mpb-seguranca-ref-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
