/* Young Marketers — layout geometry, measured off the supplied artefacts.

   POSTER  2048 x 2560 (4:5). Side margins 118px = 5.76% of width, left and right, equal.
           Content column 1812px. Three stat blocks 587px wide, 25px apart, 404px tall.
           Signature red action bar: full content width, 159px tall.
   PAGE    794 x 1122 (A4 at 96dpi). Padding 44px top / 54px sides / 62px bottom.
           Running footer pinned 26px from the bottom edge, inset to the 54px side margin.

   Everything is edge-to-edge and rectangular. There are no rounded corners anywhere in the
   source material and no drop shadows on content — see tokens/surfaces.css. */

:root {
  /* ---- poster artboard ---- */
  --ym-poster-w: 2048px;
  --ym-poster-h: 2560px;
  --ym-poster-ratio: 0.8; /* @kind other */
  --ym-poster-margin: 118px;
  --ym-poster-margin-r: 5.76%;
  --ym-poster-content-w: 1812px;
  --ym-poster-stat-w: 587px;
  --ym-poster-stat-h: 404px;
  --ym-poster-stat-gap: 25px;
  --ym-poster-bar-h: 159px;
  --ym-poster-partner-strip-h: 182px;

  /* ---- social crops, same 5.76% margin ---- */
  --ym-social-square: 1080px;
  --ym-social-portrait-w: 1080px;
  --ym-social-portrait-h: 1350px;
  --ym-social-margin: 62px;

  /* ---- A4 document page ---- */
  --ym-page-w: 794px;
  --ym-page-h: 1122px;
  --ym-page-pad-top: 44px;
  --ym-page-pad-side: 54px;
  --ym-page-pad-bottom: 62px;
  --ym-page-footer-offset: 26px;

  /* ---- DECK artboard — 1280x720 teaching slide ----
     Bottom padding reserves a 40px furniture band plus 44px clearance. */
  --ym-deck-w: 1280px;
  --ym-deck-h: 720px;
  --ym-deck-margin: 72px;
  --ym-deck-pad-top: 56px;
  --ym-deck-pad-bottom: 84px;
  --ym-deck-foot-band: 40px;

  /* ---- application artboards, at working scale. The RATIO is the spec; re-render at
         300dpi for print and add 3mm bleed, extending the spine and foot bar into it. ---- */
  --ym-art-certificate-w: 1123px;   /* A4 landscape */
  --ym-art-certificate-h: 794px;
  --ym-art-standee-w: 600px;        /* 800 x 2000mm */
  --ym-art-standee-h: 1500px;
  --ym-art-backdrop-w: 1600px;      /* 6000 x 2600mm */
  --ym-art-backdrop-h: 700px;
  --ym-art-fbcover-w: 1640px;
  --ym-art-fbcover-h: 856px;
  --ym-art-story-w: 1080px;
  --ym-art-story-h: 1920px;
  --ym-art-vbg-w: 1920px;
  --ym-art-vbg-h: 1080px;
  --ym-art-badge-w: 400px;          /* 100 x 140mm */
  --ym-art-badge-h: 560px;
  --ym-art-card-w: 340px;           /* 90 x 55mm */
  --ym-art-card-h: 208px;
  --ym-art-signature-w: 640px;
  --ym-art-signature-h: 190px;
  --ym-art-sticker: 420px;          /* 100 x 100mm */

  /* ---- safe areas, by surface ---- */
  --ym-safe-story: 250px;           /* top and bottom — platform chrome */
  --ym-safe-lower-third: 96px;
  --ym-safe-standee-top: 250px;     /* above eye level, often behind a head */
  --ym-safe-backdrop-floor: 60%;    /* nothing important below this — people stand there */
  --ym-safe-fbcover-w: 640px;       /* the centre band mobile crops to */
  --ym-safe-fbcover-h: 360px;

  /* ---- web ---- */
  --ym-web-max: 1240px;
  --ym-web-gutter: 32px;

  /* ---- fixed furniture sizes, verbatim from source ---- */
  --ym-pagenum-size: 24px;   /* red square page number, white 12px/600 */
  --ym-tick-size: 15px;      /* red square tick, white 9px/600 */
  --ym-tag-height: 17px;     /* pill-free rectangular tag */
  --ym-mark-min-screen: 48px;/* Brand Foundation p.06: minimum mark size on screen */
  --ym-mark-ratio: 0.873; /* @kind other */ /* mark height / width, fixed */
}
