/* Guide: Brazilian vs European Portuguese (brazilian-vs-european-portuguese.php; 03-SEO §6.11). 31/10/2026.
   The layout every guide shares is in assets/css/guide.css. Here, two lists of words: .spellings (one spelling per
   country, tagged BR and PT) and the shared .glossary (components.css, 06 §10.16). Mobile first: md 56.25em. */

/* one spelling per country: the Brazilian and the Portuguese form side by side, the gloss beside or under them */
.page-brazilian-vs-european-portuguese .spellings { max-width: 46rem; }
.page-brazilian-vs-european-portuguese .spellings > div { padding-block: var(--s-3); }
.page-brazilian-vs-european-portuguese .spellings > div + div { border-top: 1px dotted var(--rule-strong); }
.page-brazilian-vs-european-portuguese .spellings dt { display: flex; flex-wrap: wrap; gap: 0 var(--s-5); }
.page-brazilian-vs-european-portuguese .vform { font: 500 1.25rem/1.35 var(--serif); color: var(--navy); white-space: nowrap; }
.page-brazilian-vs-european-portuguese .vform-tag { margin-right: .35em; font-size: .75rem; font-weight: 400; color: var(--navy-light); vertical-align: .15em; }
.page-brazilian-vs-european-portuguese .spellings dd { margin: var(--s-1) 0 0; font-size: .96875rem; line-height: 1.6; max-width: var(--measure); }

.page-brazilian-vs-european-portuguese .guide .glossary { max-width: 46rem; }

@media (min-width: 56.25em) {
  .page-brazilian-vs-european-portuguese .spellings > div { display: grid; grid-template-columns: 17rem minmax(0, 1fr); column-gap: var(--s-5); align-items: baseline; }
  .page-brazilian-vs-european-portuguese .spellings dt { gap: 0 var(--s-4); }
  .page-brazilian-vs-european-portuguese .spellings dd { margin-top: 0; }
}