/* GP V2 — global tokens, fonts, stage */
:root {
  --c-frame: #3f4618;
  --c-pink: #ffeef8;
  --c-citron: #d6d88e;
  --c-lav: #e2e5ee;
  --c-footer: #dbe0ec;
  --c-ink: #000;
  --ease-gp: cubic-bezier(0.22, 0.7, 0.16, 1);
}

@font-face { font-family: "Marund3222"; src: url("../fonts/26A1MarundTrial-3222Blurred.otf") format("opentype"); font-display: block; }
@font-face { font-family: "Marund5222"; src: url("../fonts/26A1MarundTrial-5222Blurred.otf") format("opentype"); font-display: block; }
@font-face { font-family: "Marund3202"; src: url("../fonts/26A1MarundTrial-3202Pinched.otf") format("opentype"); font-display: block; }
@font-face { font-family: "HotSans"; src: url("../fonts/HotSans TEST Light.otf") format("opentype"); font-weight: 300; font-display: block; }
@font-face { font-family: "HotSans"; src: url("../fonts/HotSans TEST Regular.otf") format("opentype"); font-weight: 400; font-display: block; }
@font-face { font-family: "HotSans"; src: url("../fonts/HotSans TEST Medium.otf") format("opentype"); font-weight: 500; font-display: block; }
@font-face { font-family: "GeneralSans"; src: url("../fonts/GeneralSans-Light.otf") format("opentype"); font-weight: 300; font-display: block; }
@font-face { font-family: "GeneralSans"; src: url("../fonts/GeneralSans-Regular.otf") format("opentype"); font-weight: 400; font-display: block; }
@font-face { font-family: "GeneralSans"; src: url("../fonts/GeneralSans-Medium.otf") format("opentype"); font-weight: 500; font-display: block; }

* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
html.lenis, html.lenis body { height: auto; }
.lenis.lenis-smooth { scroll-behavior: auto !important; }

body {
  margin: 0;
  background: var(--c-frame);
  color: var(--c-ink);
  font-family: "Marund3222", "GeneralSans", sans-serif;
  -webkit-font-smoothing: antialiased;
}
img { display: block; }
a { color: inherit; }
a:focus-visible, button:focus-visible {
  outline: 2px solid var(--c-pink);
  outline-offset: 3px;
  border-radius: 4px;
}

/* stage: fixed 1430px design canvas, zoom-scaled by main.js */
.stage {
  position: relative;
  width: 1920px;
  margin: 0 auto;
}
.stage section { position: relative; }

::selection { background: rgba(214, 216, 142, 0.5); }

@media (max-width: 760px) {
  .stage { width: 375px; }
}