/* ==========================================================================
   Theme layer for the original project pages (imported by tools/import-legacy.py).
   The pages keep their structure; only the portfolio's own typefaces and the
   paper background change to match Portfolio 3.0. Client typefaces shown
   inside the brand guides are left alone.
   ========================================================================== */

@font-face {
  font-family: "Archivo";
  src: url("/fonts/archivo-latin-wdth-normal.woff2") format("woff2");
  font-weight: 100 900;
  font-stretch: 62% 125%;
  font-display: swap;
}
@font-face {
  font-family: "Newsreader";
  src: url("/fonts/newsreader-latin-opsz-italic.woff2") format("woff2");
  font-weight: 200 800;
  font-style: italic;
  font-display: swap;
}

/* The old UI faces become aliases of the new ones. Declared after the
   originals with the same descriptors, so these win. */
@font-face { font-family: "Arial"; src: url("/fonts/archivo-latin-wdth-normal.woff2") format("woff2"); font-weight: 100 900; font-display: swap; }
@font-face { font-family: "Helvetica"; src: url("/fonts/archivo-latin-wdth-normal.woff2") format("woff2"); font-weight: 100 900; font-display: swap; }
@font-face { font-family: "Georgia"; src: url("/fonts/newsreader-latin-opsz-italic.woff2") format("woff2"); font-style: italic; font-display: swap; }
@font-face { font-family: "Georgia"; src: url("/fonts/newsreader-latin-opsz-italic.woff2") format("woff2"); font-style: normal; font-display: swap; }
@font-face { font-family: "Bricolage"; src: url("/fonts/archivo-latin-wdth-normal.woff2") format("woff2"); font-weight: 400; font-display: swap; }
@font-face { font-family: "Bricolage"; src: url("/fonts/archivo-latin-wdth-normal.woff2") format("woff2"); font-weight: 600; font-display: swap; }
@font-face { font-family: "Bricolage"; src: url("/fonts/archivo-latin-wdth-normal.woff2") format("woff2"); font-weight: 700; font-display: swap; }
@font-face { font-family: "BrandEditorial"; src: url("/fonts/archivo-latin-wdth-normal.woff2") format("woff2"); font-display: swap; }
@font-face { font-family: "BrandEditorial"; src: url("/fonts/archivo-latin-wdth-normal.woff2") format("woff2"); font-weight: 600; font-display: swap; }
@font-face { font-family: "Mendl"; src: url("/fonts/archivo-latin-wdth-normal.woff2") format("woff2"); font-display: swap; }

html,
body { background-color: #eeebe4; }

body { -webkit-font-smoothing: antialiased; }

/* Pages built on style.css */
body.project-page {
  --paper: #eeebe4;
  --ink: #131312;
  --muted: #74716a;
  --line: rgb(19 19 18 / 0.16);
  --blue: #0a33b8;
}
body.project-page .header { background: #eeebe4; }
body.project-page .project-cover,
body.project-page .project-gallery img,
body.project-page .project-gallery video { background-color: #e5e1d8; }
body.project-page i,
body.project-page em,
body.project-page .project-summary h2 { font-family: "Newsreader", Georgia, serif; font-weight: 350; }
body.project-page ::selection { background: #0a33b8; }

/* Coplanar and Duo guides */
body:not(.project-page) {
  --paper: #eeebe4;
  --ink: #131312;
}

#brand-guide,
#brand-guide .cg-swatch,
#brand-guide .bg-comparison > button { background: #eeebe4; }
.cg-segment { background: #e5e1d8; }
.cg-system-stage { background: #e2ddd3; }
.cg-expand { background: #dcd7cc; }

/* Native brand guides (Corpus, Piipe, União, HUB) */
#native-guide {
  --nb-paper: #eeebe4;
  --nb-ink: #131312;
  --nb-line: rgb(19 19 18 / 0.18);
}
#native-guide .nb-top,
#native-guide .nb-top nav a,
#native-guide .nb-side,
#native-guide .nb-dialog,
#native-guide button { background: #eeebe4; }
#native-guide .nb-type-board,
#native-guide .nb-composition-wrap { background: #e5e1d8; }
/* Logo stages stay white: they present the marks on a light ground. */
