:root{
  /* ---- Grain. Every surface in this brand carries texture. This is the only
         "background image" that is generated rather than photographed. ---- */
  --grain-url:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"); /* @kind other */
  --grain-size:240px;
  --grain-opacity-light:0.05; /* @kind other */   /* body-level wash on Parchment — reading stays clean */
  --grain-opacity-image:0.30; /* @kind other */   /* over photography, multiply */
  --grain-opacity-dark:0.45; /* @kind other */    /* over Woodland / Tuna, overlay */
  --grain-opacity-social:0.55; /* @kind other */  /* carousels & quote cards run heaviest */

  /* ---- Foliage shadow. Real photographic dappled light, supplied by the brand. ---- */
  --foliage-woodland:url("https://static.wixstatic.com/media/b87d69_ac2982c58398408f8aa6e15bf38ff46c~mv2.png"); /* @kind other */
  --foliage-mask:url("https://static.wixstatic.com/media/b87d69_d3cfe88d5df04811a290d797297ba6cc~mv2.png"); /* @kind other */
  --foliage-opacity-dark:0.55; /* @kind other */
  --foliage-opacity-light:0.16; /* @kind other */

  /* ---- Borders. Hairline only, always 1px, always a warm neutral. ---- */
  --border-hairline:1px solid var(--divider); /* @kind other */
  --border-hairline-soft:1px solid var(--divider-soft); /* @kind other */
  --rule-weight:1px;
  --rule-len:32px;           /* the short dash before an eyebrow label */

  /* ---- Elevation. There is none. Depth comes from surface colour and texture.
         Kept as tokens so consumers can see the intent, not guess it. ---- */
  --shadow-none:none;
  --elevation-strategy:"surface + hairline, never shadow"; /* @kind other */
}

/* Body-level paper grain. Fixed so it reads as the paper, not the content. */
.mf-grain-page::before{content:"";position:fixed;inset:0;z-index:0;pointer-events:none;opacity:var(--grain-opacity-light);background-image:var(--grain-url);background-size:var(--grain-size)}

/* Grain layer for an individual block. Parent needs position:relative;isolation:isolate. */
.mf-grain{position:absolute;inset:0;pointer-events:none;background-image:var(--grain-url);background-size:var(--grain-size);mix-blend-mode:multiply;opacity:var(--grain-opacity-image)}
.mf-on-dark .mf-grain{mix-blend-mode:overlay;opacity:var(--grain-opacity-dark)}

/* Foliage dapple. Woodland variant uses the photograph; light surfaces use the alpha mask. */
.mf-foliage{position:absolute;inset:0;pointer-events:none;background-image:var(--foliage-woodland);background-size:cover;background-position:center;mix-blend-mode:multiply;opacity:var(--foliage-opacity-dark)}
.mf-foliage-light{position:absolute;inset:0;pointer-events:none;background-image:var(--foliage-mask);background-size:cover;background-position:center;opacity:var(--foliage-opacity-light)}

/* Hairline dividers */
.mf-rule{border:0;border-top:var(--rule-weight) solid var(--divider);width:100%;margin:0}
.mf-rule-short{display:block;width:var(--rule-len);height:var(--rule-weight);background:var(--text-accent);border:0}
