/* www.marshhomes.au: every colour, size and spacing, in one place.
   The build fails if any other file names a colour or a pixel size (scripts/build.mjs).

   Colours are Marsh Homes design system v2 (Marsh Green), Jake's decision of
   27 September 2026, replacing the prototype's olive palette role for role. Sizes keep
   the approved prototype's exact values, one token per value, grouped by what they size. */
:root {
  --brand: #32662A; /* Marsh Green (was olive #575D31) */
  --brand-deep: #1F4419; /* green-800 */
  --accent: #A8C79E; /* green-300, the accent (was sage #B7C99A) */
  --mint: #E1EADF; /* Marsh Mint */
  --ground: #F7FAF2; /* Marsh Tint, the page ground (was warm white #F7F6F0) */
  --stone: #EDF1EA; /* Stone (was #E8E3D3) */
  --ink: #2A312B; /* charcoal, body text (was #252A22) */
  --night: #1B211C; /* near-black, the picture viewer (was #171D17) */
  --line: #DCE3DA; /* hairline */
  --line-strong: #B7C0B4; /* viewer button outline */
  --paper: #FFFFFF; /* white */

  /* The sister companies' buttons on the About page, each in its own brand's colours, read from
     its site's _assets/styles/css/variables.css on 9 October 2026. Jake chose on 11 October:
     Ground Projects stone, Living Canvas on Ground Projects' dune with a dark blue outline,
     Otetto turquoise; each fills with its brand's dark colour on hover. */
  --ground-projects-mid: #CCBDA9; /* Ground Projects stone */
  --ground-projects-dark: #281204; /* Ground Projects charcoal */
  --ground-projects-light: #EEE6C2; /* Ground Projects dune, also Living Canvas's button */
  --living-canvas-dark: #0C1D39; /* Living Canvas dark blue */
  --living-canvas-light: #D9D536; /* Living Canvas lime */
  --otetto-mid: #69A390; /* Otetto turquoise */
  --otetto-black: #000000; /* Otetto black */
  --otetto-dark: #254037; /* Otetto dark green */
  --otetto-light: #1ADEA8; /* Otetto bright turquoise */

  --accent-a25: rgb(168 199 158 / 25%);
  --accent-a31: rgb(168 199 158 / 31%);
  --accent-a44: rgb(168 199 158 / 44%);
  --brand-a25: rgb(50 102 42 / 25%);
  --brand-a31: rgb(50 102 42 / 31%);
  --brand-a38: rgb(50 102 42 / 38%);
  --brand-a44: rgb(50 102 42 / 44%);
  --ground-a94: rgb(247 250 242 / 94%);
  --ground-a96: rgb(247 250 242 / 96%);
  --ink-a06: rgb(42 49 43 / 6%);
  --ink-a10: rgb(42 49 43 / 10%);
  --ink-a68: rgb(42 49 43 / 68%);
  --ink-a80: rgb(42 49 43 / 80%);
  --ink-a90: rgb(42 49 43 / 90%);
  --paper-a09: rgb(255 255 255 / 9%);
  --paper-a25: rgb(255 255 255 / 25%);
  --paper-a50: rgb(255 255 255 / 50%);
  --stone-a25: rgb(237 241 234 / 25%);

  --font-body: Inter, Arial, sans-serif;
  --font-head: Montserrat, Arial, sans-serif;
  --gutter: clamp(var(--space-22),4.4vw,var(--space-76));
  --radius: 12px;
  --shadow: 0 var(--size-18) var(--size-45) var(--ink-a06);

  --radius-2: 2px;
  --radius-3: 3px;
  --radius-4: 4px;
  --radius-6: 6px;
  --radius-7: 7px;
  --radius-8: 8px;
  --radius-12: 12px;
  --radius-14: 14px;
  --radius-18: 18px;
  --radius-20: 20px;
  --radius-22: 22px;
  --radius-30: 30px;
  --radius-40: 40px;
  --radius-100: 100px;
  --size-5: 5px;
  --size-12: 12px;
  --size-14: 14px;
  --size-15: 15px;
  --size-18: 18px;
  --size-20: 20px;
  --size-22: 22px;
  --size-25: 25px;
  --size-30: 30px;
  --size-32: 32px;
  --size-36: 36px;
  --size-40: 40px;
  --size-42: 42px;
  --size-43: 43px;
  --size-44: 44px;
  --size-45: 45px;
  --size-48: 48px;
  --size-55: 55px;
  --size-58: 58px;
  --size-70: 70px;
  --size-85: 85px;
  --size-100: 100px;
  --size-110: 110px;
  --size-144: 144px;
  --size-148: 148px;
  --size-160: 160px;
  --size-166: 166px;
  --size-176: 176px;
  --size-180: 180px;
  --size-200: 200px;
  --size-220: 220px;
  --size-230: 230px;
  --size-250: 250px;
  --size-280: 280px;
  --size-330: 330px;
  --size-350: 350px;
  --size-360: 360px;
  --size-370: 370px;
  --size-440: 440px;
  --size-450: 450px;
  --size-470: 470px;
  --size-490: 490px;
  --size-500: 500px;
  --size-510: 510px;
  --size-560: 560px;
  --size-640: 640px;
  --size-650: 650px;
  --size-700: 700px;
  /* The tallest a floor plan is drawn at first: the whole plan shows, fitted to the screen. */
  --size-plan-view: min(78vh, 900px);
  /* A plan picture's width over its height; each plan sets its own. */
  --plan-ratio: 1.5;
  --size-770: 770px;
  --size-840: 840px;
  --size-850: 850px;
  --size-900: 900px;
  --size-1050: 1050px;
  --size-1320: 1320px;
  --size-1500: 1500px;
  --space-1: 1px;
  --space-2: 2px;
  --space-3: 3px;
  --space-4: 4px;
  --space-5: 5px;
  --space-6: 6px;
  --space-7: 7px;
  --space-8: 8px;
  --space-9: 9px;
  --space-10: 10px;
  --space-11: 11px;
  --space-12: 12px;
  --space-13: 13px;
  --space-14: 14px;
  --space-15: 15px;
  --space-16: 16px;
  --space-17: 17px;
  --space-18: 18px;
  --space-20: 20px;
  --space-22: 22px;
  --space-23: 23px;
  --space-24: 24px;
  --space-25: 25px;
  --space-26: 26px;
  --space-27: 27px;
  --space-28: 28px;
  --space-30: 30px;
  --space-32: 32px;
  --space-34: 34px;
  --space-35: 35px;
  --space-37: 37px;
  --space-38: 38px;
  --space-40: 40px;
  --space-42: 42px;
  --space-45: 45px;
  --space-46: 46px;
  --space-48: 48px;
  --space-50: 50px;
  --space-52: 52px;
  --space-55: 55px;
  --space-58: 58px;
  --space-60: 60px;
  --space-65: 65px;
  --space-76: 76px;
  --space-90: 90px;
  --space-100: 100px;
  --space-105: 105px;
  --space-110: 110px;
  --space-280: 280px;
  --space-340: 340px;
  --text-9: 9px;
  --text-10: 10px;
  --text-11: 11px;
  --text-12: 12px;
  --text-13: 13px;
  --text-14: 14px;
  --text-15: 15px;
  --text-16: 16px;
  --text-17: 17px;
  --text-18: 18px;
  --text-19: 19px;
  --text-20: 20px;
  --text-21: 21px;
  --text-22: 22px;
  --text-23: 23px;
  --text-24: 24px;
  --text-26: 26px;
  --text-27: 27px;
  --text-28: 28px;
  --text-30: 30px;
  --text-31: 31px;
  --text-32: 32px;
  --text-34: 34px;
  --text-36: 36px;
  --text-39: 39px;
  --text-42: 42px;
  --text-44: 44px;
  --text-48: 48px;
  --text-52: 52px;
  --text-56: 56px;
  --text-64: 64px;
  --text-68: 68px;
  --text-70: 70px;
  --text-80: 80px;
  --text-84: 84px;
  --text-86: 86px;
  --text-96: 96px;
  --text-110: 110px;
  --text-112: 112px;
}