/* A POST THAT KEEPS THE LOOK OF THE SECOND FILE SHE WROTE IT IN (MD-326). She sent "Projeto, consultoria de interiores ou consultoria neuroambiental: qual faz sentido para você?" as a PDF on 2026-10-13 at 16:51:03 (message 3B74C51DD296BAE50CAE), and asked for her text in the Editorial "usando o layout que eu pedi" (message 3B9AA88F7DD59B4408EF): the look of the PDF. Every value below was read from the PDF itself (docs/sources/md-326-*.pdf: `pdffonts`, `pdftohtml -xml` and the pixels of a render), not from a look at it: fonts Lato Regular, Bold and Italic for the text; Liberation Serif Regular for the title and Liberation Serif Bold for the closing line (the file's own five fonts) paper #fdf6f3 (Papiro, guia p. 8) text, title #194a61 (Jeans, guia p. 8) bars #8c906c (Pistache, guia p. 8) closing panel #f3e9e2 top rule Pistache, then #b59877, then Mostarda #e7aa5f bottom rule #b59877 sizes body 16 = 1 em, title 38 = 2.375 em, subheading 21 = 1.31 em, lead and small subheading 17 = 1.06 em, closing line 21 = 1.31 em, running head 14 = 0.875 em The sizes keep the PDF's proportions on a 17 px body, the size a screen needs. Only a post with the skin "post-lato" loads this file. The four fonts are the PDF's own: Lato is SIL Open Font License 1.1 (fontsource, latin subset, woff2), Liberation Serif is SIL OFL 1.1 too, cut from the host's copy with fontTools. Jeans on Papiro is 8.8:1, and the bars and rules are decoration, so nothing here sits under the WCAG AA line (ADR-0018). */ @font-face { font-family: "Lato"; src: url("/assets/fonts/lato-latin-400.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; } @font-face { font-family: "Lato"; src: url("/assets/fonts/lato-latin-700.woff2") format("woff2"); font-weight: 700; font-style: normal; font-display: swap; } @font-face { font-family: "Lato"; src: url("/assets/fonts/lato-latin-400-italic.woff2") format("woff2"); font-weight: 400; font-style: italic; font-display: swap; } @font-face { font-family: "Liberation Serif"; src: url("/assets/fonts/liberationserif-regular-latin.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; } @font-face { font-family: "Liberation Serif"; src: url("/assets/fonts/liberationserif-bold-latin.woff2") format("woff2"); font-weight: 700; font-style: normal; font-display: swap; } .post--lato { --lato-paper: #fdf6f3; --lato-text: #194a61; --lato-bar: #8c906c; --lato-tan: #b59877; --lato-panel: #f3e9e2; --lato-sans: "Lato", "Helvetica Neue", Arial, sans-serif; --lato-serif: "Liberation Serif", "Times New Roman", serif; position: relative; background: var(--lato-paper); color: var(--lato-text); font-family: var(--lato-sans); font-size: 1.0625rem; /* 17 px = her 16 */ line-height: 1.58; padding: calc(var(--space-xl) + 0.6rem) max(var(--space-s), calc((100% - 46rem) / 2)) var(--space-xl); margin-bottom: var(--space-l); } /* The rule across the top of her page: Pistache, tan, Mostarda. */ .post--lato::before { content: ""; position: absolute; top: 0; left: 0; right: 0; height: 3px; background: linear-gradient(90deg, var(--lato-bar), var(--lato-tan) 70%, #e7aa5f); } .post--lato > * { max-width: 46rem; margin-left: auto; margin-right: auto; } .post--lato > .post__lead { max-width: 60rem; } /* Her running head "EDITORIAL | MYRELLA MASSELI": bold capitals, small. */ .post--lato .kicker { color: var(--lato-text); font-family: var(--lato-sans); font-weight: 700; font-size: 0.875rem; letter-spacing: 0.04em; text-transform: uppercase; } .post--lato .kicker::after { content: " | Myrella Masseli"; white-space: pre; } .post--lato .post__meta { color: var(--lato-text); font-size: 0.8125rem; margin-bottom: var(--space-m); } .post--lato h1 { font-family: var(--lato-serif); font-weight: 400; color: var(--lato-text); font-size: clamp(1.75rem, 1.3rem + 2vw, 2.55rem); /* her 38, 2.375 em */ line-height: 1.19; max-width: 46rem; text-wrap: balance; } .post--lato p { max-width: 46rem; margin-bottom: 1em; } .post--lato strong { font-weight: 700; } .post--lato em { font-style: italic; } /* The bold opening paragraph, with her green bar at its side. */ .post--lato p.post__lead-text { font-weight: 700; font-size: 1.0625em; line-height: 1.5; border-left: 5px solid var(--lato-bar); padding-left: 0.7rem; margin: var(--space-s) auto var(--space-m); } .post--lato h2 { font-family: var(--lato-sans); font-weight: 700; color: var(--lato-text); font-size: 1.31em; line-height: 1.3; /* her 21 */ border-left: 5px solid var(--lato-bar); padding-left: 0.7rem; margin: var(--space-l) auto var(--space-xs); } .post--lato h3 { font-family: var(--lato-sans); font-weight: 700; color: var(--lato-text); font-size: 1.0625em; line-height: 1.4; /* her 17 */ border-left: 3px solid var(--lato-tan); padding-left: 0.65rem; margin: var(--space-m) auto var(--space-2xs); } /* The closing line, in the panel of her last page: Liberation Serif Bold on a pale ground. */ .post--lato p.post__callout { font-family: var(--lato-serif); font-weight: 700; font-size: 1.31em; line-height: 1.35; background: var(--lato-panel); border-left: 5px solid var(--lato-bar); padding: 0.9rem 1.1rem; margin: var(--space-m) auto var(--space-m); } .post--lato .post__sources { font-size: 0.83em; line-height: 1.53; list-style: none; padding: 0; margin-top: var(--space-m); } .post--lato .post__link { margin-bottom: 1em; } .post--lato .post__cta { margin-top: var(--space-m); margin-bottom: var(--space-m); } .post--lato > .gallery { max-width: 60rem; margin-top: var(--space-s); } /* The rule under her last page, above the way back. */ .post--lato .post__back { margin-top: var(--space-xl); padding-top: var(--space-s); border-top: 1px solid var(--lato-tan); } /* MD-328. HER WORD OF 2026-10-13 at 18:20:55: "Não gostei das margens dos textos do editorial. Quero que elas fiquem todas iguais a da home." On a computer, from 64em, the text of this post starts on the Home's text edge (the section's own 1 rem inside --wrap) and takes the Home's --measure. Before this, the padding above read 100% as the width of
and not of the article, so on top of the 46rem column the text sat 344 px in from the Home's at 1440 px. The paper stays: it grows 2 rem past the column on each side, so the paper frames the text and the text edge is the Home's. Phone and tablet are below 64em and never meet this block. */ @media (min-width: 64em) { .post.post--lato { --panel-pad: 2rem; max-width: calc(var(--wrap) + 2 * var(--panel-pad)); padding-left: calc(var(--space-s) + var(--panel-pad)); padding-right: calc(var(--space-s) + var(--panel-pad)); /* MD-343. The first line starts as far under the header as the Home's does (its section padding). */ padding-top: var(--space-2xl); } .post--lato > *, .post--lato h1, .post--lato p { max-width: var(--measure); margin-left: 0; margin-right: 0; } .post--lato > .post__lead, .post--lato > .gallery { max-width: none; } .post--lato h2, .post--lato h3, .post--lato p.post__lead-text, .post--lato p.post__callout, .post--lato .post__quote p { margin-left: 0; margin-right: 0; } }