@notambourine/brand-kit 1.0.0

package/logo/mark-white.svg

@@ -0,0 +1,9 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="135" height="135" viewBox="-27.89 -8.39 134.78 134.78" fill="#FFFFFF">
+  <!-- Tambourine mark. Generated by scripts/build-logo.py - do not hand-edit. -->
+  <path d="M 80,24 A 42,42 0 1,0 84,96 L 72,86 A 28,28 0 1,1 69,34 Z"/>
+  <circle cx="50" cy="4" r="7"/>
+  <circle cx="14" cy="22" r="7"/>
+  <circle cx="2" cy="58" r="7"/>
+  <circle cx="14" cy="94" r="7"/>
+  <circle cx="46" cy="114" r="7"/>
+</svg>

package/logo/mark.svg

@@ -0,0 +1,9 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="135" height="135" viewBox="-27.89 -8.39 134.78 134.78" fill="#E75A7C">
+  <!-- Tambourine mark. Generated by scripts/build-logo.py - do not hand-edit. -->
+  <path d="M 80,24 A 42,42 0 1,0 84,96 L 72,86 A 28,28 0 1,1 69,34 Z"/>
+  <circle cx="50" cy="4" r="7"/>
+  <circle cx="14" cy="22" r="7"/>
+  <circle cx="2" cy="58" r="7"/>
+  <circle cx="14" cy="94" r="7"/>
+  <circle cx="46" cy="114" r="7"/>
+</svg>

package/logo/monogram-ink.svg

@@ -0,0 +1,10 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="147" height="147" viewBox="-10.87 -14.37 146.73 146.73" fill="#000000">
+  <!-- Mark with `no` nested in the crescent, transparent and square. The short form of the lockup: avatar, favicon, app tile. Generated by scripts/build-logo.py - do not hand-edit. -->
+  <path d="M 80,24 A 42,42 0 1,0 84,96 L 72,86 A 28,28 0 1,1 69,34 Z"/>
+  <circle cx="50" cy="4" r="7"/>
+  <circle cx="14" cy="22" r="7"/>
+  <circle cx="2" cy="58" r="7"/>
+  <circle cx="14" cy="94" r="7"/>
+  <circle cx="46" cy="114" r="7"/>
+  <path d="M70.01 78.52Q67.84 78.52 66.67 77.33Q65.51 76.14 65.51 73.91V52.62Q65.51 50.38 66.66 49.22Q67.82 48.05 69.94 48.05Q72.05 48.05 73.20 49.22Q74.35 50.38 74.35 52.62V56.06L73.69 54.09Q75.06 51.10 77.80 49.51Q80.53 47.93 84.00 47.93Q87.54 47.93 89.82 49.28Q92.10 50.62 93.24 53.37Q94.38 56.12 94.38 60.33V73.91Q94.38 76.14 93.21 77.33Q92.04 78.52 89.87 78.52Q87.69 78.52 86.50 77.33Q85.32 76.14 85.32 73.91V60.72Q85.32 57.66 84.20 56.30Q83.09 54.94 80.83 54.94Q77.98 54.94 76.27 56.74Q74.57 58.55 74.57 61.56V73.91Q74.57 78.52 70.01 78.52Z M114.36 78.64Q109.63 78.64 106.12 76.78Q102.61 74.92 100.66 71.45Q98.72 67.98 98.72 63.26Q98.72 59.70 99.81 56.89Q100.91 54.07 102.98 52.05Q105.04 50.03 107.92 48.98Q110.80 47.93 114.36 47.93Q119.10 47.93 122.60 49.79Q126.11 51.65 128.05 55.09Q129.99 58.53 129.99 63.26Q129.99 66.82 128.90 69.66Q127.80 72.50 125.74 74.52Q123.67 76.54 120.79 77.59Q117.91 78.64 114.36 78.64ZM114.36 71.87Q116.29 71.87 117.76 70.93Q119.22 69.99 120.05 68.08Q120.87 66.18 120.87 63.26Q120.87 58.86 119.07 56.78Q117.26 54.70 114.36 54.70Q112.44 54.70 110.96 55.62Q109.49 56.54 108.66 58.43Q107.84 60.33 107.84 63.26Q107.84 67.63 109.64 69.75Q111.45 71.87 114.36 71.87Z"/>
+</svg>

package/logo/monogram-white.svg

@@ -0,0 +1,10 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="147" height="147" viewBox="-10.87 -14.37 146.73 146.73" fill="#FFFFFF">
+  <!-- Mark with `no` nested in the crescent, transparent and square. The short form of the lockup: avatar, favicon, app tile. Generated by scripts/build-logo.py - do not hand-edit. -->
+  <path d="M 80,24 A 42,42 0 1,0 84,96 L 72,86 A 28,28 0 1,1 69,34 Z"/>
+  <circle cx="50" cy="4" r="7"/>
+  <circle cx="14" cy="22" r="7"/>
+  <circle cx="2" cy="58" r="7"/>
+  <circle cx="14" cy="94" r="7"/>
+  <circle cx="46" cy="114" r="7"/>
+  <path d="M70.01 78.52Q67.84 78.52 66.67 77.33Q65.51 76.14 65.51 73.91V52.62Q65.51 50.38 66.66 49.22Q67.82 48.05 69.94 48.05Q72.05 48.05 73.20 49.22Q74.35 50.38 74.35 52.62V56.06L73.69 54.09Q75.06 51.10 77.80 49.51Q80.53 47.93 84.00 47.93Q87.54 47.93 89.82 49.28Q92.10 50.62 93.24 53.37Q94.38 56.12 94.38 60.33V73.91Q94.38 76.14 93.21 77.33Q92.04 78.52 89.87 78.52Q87.69 78.52 86.50 77.33Q85.32 76.14 85.32 73.91V60.72Q85.32 57.66 84.20 56.30Q83.09 54.94 80.83 54.94Q77.98 54.94 76.27 56.74Q74.57 58.55 74.57 61.56V73.91Q74.57 78.52 70.01 78.52Z M114.36 78.64Q109.63 78.64 106.12 76.78Q102.61 74.92 100.66 71.45Q98.72 67.98 98.72 63.26Q98.72 59.70 99.81 56.89Q100.91 54.07 102.98 52.05Q105.04 50.03 107.92 48.98Q110.80 47.93 114.36 47.93Q119.10 47.93 122.60 49.79Q126.11 51.65 128.05 55.09Q129.99 58.53 129.99 63.26Q129.99 66.82 128.90 69.66Q127.80 72.50 125.74 74.52Q123.67 76.54 120.79 77.59Q117.91 78.64 114.36 78.64ZM114.36 71.87Q116.29 71.87 117.76 70.93Q119.22 69.99 120.05 68.08Q120.87 66.18 120.87 63.26Q120.87 58.86 119.07 56.78Q117.26 54.70 114.36 54.70Q112.44 54.70 110.96 55.62Q109.49 56.54 108.66 58.43Q107.84 60.33 107.84 63.26Q107.84 67.63 109.64 69.75Q111.45 71.87 114.36 71.87Z"/>
+</svg>

package/logo/monogram.svg

@@ -0,0 +1,10 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="147" height="147" viewBox="-10.87 -14.37 146.73 146.73" fill="#E75A7C">
+  <!-- Mark with `no` nested in the crescent, transparent and square. The short form of the lockup: avatar, favicon, app tile. Generated by scripts/build-logo.py - do not hand-edit. -->
+  <path d="M 80,24 A 42,42 0 1,0 84,96 L 72,86 A 28,28 0 1,1 69,34 Z"/>
+  <circle cx="50" cy="4" r="7"/>
+  <circle cx="14" cy="22" r="7"/>
+  <circle cx="2" cy="58" r="7"/>
+  <circle cx="14" cy="94" r="7"/>
+  <circle cx="46" cy="114" r="7"/>
+  <path d="M70.01 78.52Q67.84 78.52 66.67 77.33Q65.51 76.14 65.51 73.91V52.62Q65.51 50.38 66.66 49.22Q67.82 48.05 69.94 48.05Q72.05 48.05 73.20 49.22Q74.35 50.38 74.35 52.62V56.06L73.69 54.09Q75.06 51.10 77.80 49.51Q80.53 47.93 84.00 47.93Q87.54 47.93 89.82 49.28Q92.10 50.62 93.24 53.37Q94.38 56.12 94.38 60.33V73.91Q94.38 76.14 93.21 77.33Q92.04 78.52 89.87 78.52Q87.69 78.52 86.50 77.33Q85.32 76.14 85.32 73.91V60.72Q85.32 57.66 84.20 56.30Q83.09 54.94 80.83 54.94Q77.98 54.94 76.27 56.74Q74.57 58.55 74.57 61.56V73.91Q74.57 78.52 70.01 78.52Z M114.36 78.64Q109.63 78.64 106.12 76.78Q102.61 74.92 100.66 71.45Q98.72 67.98 98.72 63.26Q98.72 59.70 99.81 56.89Q100.91 54.07 102.98 52.05Q105.04 50.03 107.92 48.98Q110.80 47.93 114.36 47.93Q119.10 47.93 122.60 49.79Q126.11 51.65 128.05 55.09Q129.99 58.53 129.99 63.26Q129.99 66.82 128.90 69.66Q127.80 72.50 125.74 74.52Q123.67 76.54 120.79 77.59Q117.91 78.64 114.36 78.64ZM114.36 71.87Q116.29 71.87 117.76 70.93Q119.22 69.99 120.05 68.08Q120.87 66.18 120.87 63.26Q120.87 58.86 119.07 56.78Q117.26 54.70 114.36 54.70Q112.44 54.70 110.96 55.62Q109.49 56.54 108.66 58.43Q107.84 60.33 107.84 63.26Q107.84 67.63 109.64 69.75Q111.45 71.87 114.36 71.87Z"/>
+</svg>

package/logo/site.webmanifest

@@ -0,0 +1,13 @@
+{
+  "name": "NoTambourine",
+  "short_name": "NoTambourine",
+  "theme_color": "#0B0B0C",
+  "background_color": "#0B0B0C",
+  "display": "standalone",
+  "icons": [
+    {"src": "export/icon-192.png", "sizes": "192x192", "type": "image/png", "purpose": "any"},
+    {"src": "export/icon-512.png", "sizes": "512x512", "type": "image/png", "purpose": "any"},
+    {"src": "export/icon-maskable-512.png", "sizes": "512x512", "type": "image/png", "purpose": "maskable"},
+    {"src": "favicon.svg", "sizes": "any", "type": "image/svg+xml", "purpose": "any"}
+  ]
+}

package/package.json

@@ -0,0 +1,34 @@
+{
+  "name": "@notambourine/brand-kit",
+  "version": "1.0.0",
+  "description": "The NoTambourine brand's golden set: tokens, element styles, deck theme, faces, and logo",
+  "license": "MIT",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/notambourine/brand-kit.git"
+  },
+  "homepage": "https://github.com/notambourine/brand-kit#readme",
+  "bugs": "https://github.com/notambourine/brand-kit/issues",
+  "keywords": [
+    "brand",
+    "design-tokens",
+    "css",
+    "marpit",
+    "notambourine"
+  ],
+  "author": "NoTambourine LLC",
+  "type": "module",
+  "//": "No exports map: consumers import stylesheets and logo files by path, and their vendor scripts walk fonts/ and logo/ whole. A map would restate the tree and go stale the first time a file is added.",
+  "files": [
+    "*.css",
+    "fonts",
+    "logo",
+    "SKILL.md"
+  ],
+  "publishConfig": {
+    "access": "public"
+  },
+  "sideEffects": [
+    "*.css"
+  ]
+}

package/tokens.css

@@ -0,0 +1,19 @@
+/* =========================================================
+   NoTambourine: the whole system in one link
+   ---------------------------------------------------------
+   The golden set, composed. Link this file and a bare HTML
+   page comes out on brand: the faces load, every value is a
+   custom property, and h1/p/a/code are styled with no classes.
+
+   The name says it all: no extra noise. Sober sans headlines over
+   a monospace body, a rounded wordmark, generous whitespace, one
+   decisive pink, and a mint that hums quietly in the back.
+
+   A surface that ships its own faces and its own base layer -
+   a Tailwind site, say - imports vars.css alone and takes the
+   values without the opinions.
+   ========================================================= */
+
+@import './fonts.css';
+@import './vars.css';
+@import './elements.css';

package/vars.css

@@ -0,0 +1,228 @@
+/* =========================================================
+   NoTambourine: every brand value as a custom property
+   ---------------------------------------------------------
+   Part of the golden set. Correct a value here and never sync
+   one in. Anything that disagrees with this file is downstream
+   and stale.
+
+   Import this file alone to take the values without the faces
+   or the element styles - what a surface with its own base
+   layer wants. tokens.css is the whole system.
+   ========================================================= */
+
+:root {
+  /* ---------- Brand palette ---------- */
+  --nt-pink:        #E75A7C;   /* Accent Primary: CTAs, highlights, logo */
+  --nt-pink-press: #C9446A;
+  --nt-pink-soft:  #FBE3EA;
+  --nt-pink-tint:  #FEF3F6;
+  --nt-pink-deep:  #A83758;   /* text-grade pink: 5:1 on paper and the pink tints */
+
+  --nt-mint:       #58C9B9;    /* Complementary: borders, subtle icons */
+  --nt-mint-press: #3FA897;
+  --nt-mint-soft:  #DCF3EF;
+  --nt-mint-tint:  #ECF9F6;
+  --nt-mint-deep:  #1B6F62;   /* text-grade mint: 5:1 on paper and the mint tints */
+
+  --nt-ink:        #000000;    /* Neutral Primary: headlines, rules */
+  --nt-ink-85:     #1A1A1A;
+  --nt-ink-70:     #404040;
+
+  /* The light neutrals lean one step toward the pink, so light surfaces come
+     from the same hand as the dark ramp, which leans cool. */
+  --nt-mid:        #776C72;    /* Neutral Mid-tone: secondary text */
+  --nt-mid-soft:   #B3AAAF;
+  --nt-line:       #E9E3E6;    /* derived: subtle hairlines */
+  --nt-line-soft:  #F3EEF1;
+
+  --nt-paper:      #FAF8F9;    /* Background Light: main bg */
+  --nt-paper-warm: #FDFCFA;
+  --nt-white:      #FFFFFF;
+
+  /* ---------- Dark surface scale ---------- */
+  /* The system is dark-first. These are the surfaces UI sits on. */
+  --nt-bg:         #0B0B0C;    /* page canvas: just-off-black */
+  --nt-surface-1:  #141416;    /* default card */
+  --nt-surface-2:  #1C1C1F;    /* raised card, popovers */
+  --nt-surface-3:  #26262A;    /* hover, input fill */
+  --nt-border:     #2A2A2E;    /* hairline on dark */
+  --nt-border-soft:#1F1F22;
+
+  /* ---------- Foreground on dark ---------- */
+  --nt-fg1-dark:   #F5F5F7;    /* headlines */
+  --nt-fg2-dark:   #C9C9CE;    /* body */
+  --nt-fg3-dark:   #8A8A92;    /* secondary, captions */
+  --nt-fg-mute:    #5A5A62;    /* disabled */
+
+  /* ---------- Semantic roles (DARK by default) ---------- */
+  /* The stable API. Write against these, not the --nt-* palette above: an alias
+     survives a theme swap and a raw primitive does not. */
+  --bg:            var(--nt-bg);
+  --bg-card:       var(--nt-surface-1);
+  --bg-raised:     var(--nt-surface-2);
+  --bg-input:      var(--nt-surface-3);
+  --bg-inverse:    var(--nt-paper);
+
+  --fg1:           var(--nt-fg1-dark);     /* headlines */
+  --fg2:           var(--nt-fg2-dark);     /* body */
+  --fg3:           var(--nt-fg3-dark);     /* secondary */
+  --fg-mute:       var(--nt-fg-mute);      /* placeholder, disabled */
+  /* KEY-DECISION 2026-08-18: ink on pink, mirroring --fg-on-mint. White sat at
+     3.4:1 under 14px button text; ink clears 6:1 on both themes. */
+  --fg-on-pink:    var(--nt-ink);
+  --fg-on-mint:    var(--nt-ink);
+  --fg-on-dark:    var(--nt-fg1-dark);
+  --fg-on-light:   var(--nt-ink);
+
+  --accent:        var(--nt-pink);
+  --accent-press:  var(--nt-pink-press);
+  --accent-soft:   rgba(231,90,124,0.16);  /* on dark: tinted pink, not pastel */
+  --accent-text:   var(--nt-pink);         /* accent as prose: links, eyebrow, headline em */
+
+  --support:       var(--nt-mint);
+  --support-soft:  rgba(88,201,185,0.16);
+
+  --line:          var(--nt-border);
+  --line-soft:     var(--nt-border-soft);
+  --line-strong:   var(--nt-fg1-dark);
+
+  /* ---------- Typography ---------- */
+  /* Hanken Grotesk headings over a JetBrains Mono body, with Nunito
+     reserved for the wordmark. Accent text shares the mono, so
+     there is no separate accent family. */
+  /* The --nt-* primitive carries the stack and the alias names the job, the
+     same split the palette uses. Tailwind claims `--font-*` for its own utility
+     namespace, so a Tailwind surface reads the primitive and leaves the alias. */
+  --nt-font-nunito:  'Nunito', system-ui, sans-serif;
+  --nt-font-hanken:  'Hanken Grotesk', system-ui, sans-serif;
+  --nt-font-jetbrains: 'JetBrains Mono', ui-monospace, 'SF Mono', Monaco, monospace;
+
+  --font-wordmark: var(--nt-font-nunito);      /* the lockup, nothing else */
+  --font-display:  var(--nt-font-hanken);      /* headings */
+  --font-accent:   var(--nt-font-jetbrains);   /* eyebrows, labels, buttons */
+  --font-body:     var(--nt-font-jetbrains);   /* body */
+  --font-mono:     var(--nt-font-jetbrains);   /* code: same face */
+
+  /* Sizes: a 1.25 modular scale rounded to friendly numbers.
+     rem, not px, so a reader who raises the browser's default font size
+     scales the whole page. The comment gives the px at a 16px root. */
+  /* Fluid: 40px floor so "tambourine." holds a 375px viewport, 64px from 960px up. */
+  --fs-display:    clamp(2.5rem, 1.75rem + 3.75vw, 4rem);
+  --fs-h1:         2.75rem;   /* 44px */
+  --fs-h2:         2rem;      /* 32px */
+  --fs-h3:         1.5rem;    /* 24px */
+  --fs-h4:         1.125rem;  /* 18px */
+  --fs-lede:       1.25rem;   /* 20px, the intro paragraph */
+  --fs-body:       1rem;      /* 16px */
+  --fs-small:      0.875rem;  /* 14px */
+  --fs-caption:    0.75rem;   /* 12px */
+  --fs-mono:       0.8125rem; /* 13px */
+  /* Optical sizes below the ramp, for accent-face UI text. */
+  --fs-label:      0.8125rem; /* 13px: chip, field label, nav link */
+  --fs-badge:      0.6875rem; /* 11px: badge only */
+
+  /* Line heights: generous for warmth. Body is 1.7, not the 1.55 a
+     sans would want: monospace needs the extra leading to stay readable. */
+  --lh-display:    1.05;
+  --lh-h:          1.15;
+  --lh-lede:       1.5;
+  --lh-body:       1.7;
+  --lh-tight:      1.3;
+
+  /* Letter spacing: a hair of positive tracking on monospace body.
+     Tracking tightens as size grows; these two are what notambourine.com
+     ships, and the site is the rendering the rest of the brand matches. */
+  --ls-display:    -0.03em;
+  --ls-tight:      -0.02em;
+  --ls-body:       0.01em;
+  --ls-allcaps:    0.08em;
+
+  /* Weight: every face is variable across its full axis, so nothing
+     here is ever a synthesized bold. 800 is the wordmark and the hero. */
+  --fw-regular:    400;
+  --fw-medium:     500;
+  --fw-semibold:   600;
+  --fw-bold:       700;
+  --fw-black:      800;
+
+  /* ---------- Spacing (4pt grid) ----------
+     rem for the same reason as the type scale, and the numbers match
+     Tailwind's, so `p-6` and `var(--sp-6)` are the same 24px. */
+  --sp-1:  0.25rem;   /* 4px */
+  --sp-2:  0.5rem;    /* 8px */
+  --sp-3:  0.75rem;   /* 12px */
+  --sp-4:  1rem;      /* 16px */
+  --sp-5:  1.25rem;   /* 20px */
+  --sp-6:  1.5rem;    /* 24px */
+  --sp-8:  2rem;      /* 32px */
+  --sp-10: 2.5rem;    /* 40px */
+  --sp-12: 3rem;      /* 48px */
+  --sp-16: 4rem;      /* 64px */
+  --sp-20: 5rem;      /* 80px */
+  --sp-24: 6rem;      /* 96px */
+
+  /* ---------- Radii: generous, soft, never a sharp corner ---------- */
+  --r-xs:  6px;
+  --r-sm:  10px;
+  --r-md:  14px;
+  --r-lg:  20px;
+  --r-xl:  28px;
+  --r-pill: 999px;
+
+  /* ---------- Shadows: quiet on dark, depth from contrast ---------- */
+  --shadow-1: 0 1px 2px rgba(0,0,0,0.30), 0 1px 1px rgba(0,0,0,0.20);
+  --shadow-2: 0 6px 18px rgba(0,0,0,0.35), 0 2px 6px rgba(0,0,0,0.25);
+  --shadow-3: 0 20px 50px rgba(0,0,0,0.50), 0 6px 14px rgba(0,0,0,0.30);
+  --shadow-pink: 0 8px 26px rgba(231,90,124,0.35);   /* lifted state: hero button at rest, any primary on hover */
+  --shadow-mint: 0 8px 26px rgba(88,201,185,0.30);
+  --shadow-accent: 0 8px 22px rgba(231,90,124,0.28); /* ordinary primary button */
+
+  /* ---------- Accent text and rings ---------- */
+  /* Raw --nt-pink on a dark tint fails contrast, so accent TEXT is its own
+     value. Both flip in .theme-light, where the deep tones read instead. */
+  --accent-fg:  #F5A6BB;   /* pink text: badge, inline code, error */
+  --support-fg: #8FDCD0;   /* mint text: badge */
+  --ring-accent: 0 0 0 4px rgba(231,90,124,0.22);
+  --bg-veil: rgba(11,11,12,0.70);   /* frosted nav over dark */
+
+  /* ---------- Motion ---------- */
+  /* Primitive plus alias again, because Tailwind owns `--ease-*` too. */
+  --nt-ease-out:    cubic-bezier(.2,.7,.2,1);
+  --nt-ease-bounce: cubic-bezier(.34,1.5,.64,1);
+  --ease-out:   var(--nt-ease-out);      /* default */
+  --ease-bounce: var(--nt-ease-bounce);  /* playful, but subtle */
+  --dur-1: 120ms;
+  --dur-2: 200ms;
+  --dur-3: 320ms;
+}
+
+/* ---------- Light theme, opt-in ----------
+   Values only, so the vars.css-alone import path carries both themes.
+   elements.css applies the ground; a surface with its own base layer
+   sets `background: var(--bg)` itself. Add class="theme-light" to a
+   root element or any subtree (rare: print, a press page, an email). */
+.theme-light {
+  --bg:          var(--nt-paper);
+  --bg-card:     var(--nt-white);
+  --bg-raised:   var(--nt-white);
+  --bg-input:    var(--nt-white);
+  --bg-inverse:  var(--nt-bg);
+  --fg1:         var(--nt-ink);
+  --fg2:         var(--nt-ink-70);
+  --fg3:         var(--nt-mid);
+  --fg-mute:     var(--nt-mid);
+  --line:        var(--nt-line);
+  --line-soft:   var(--nt-line-soft);
+  --line-strong: var(--nt-ink);
+  --accent-text: var(--nt-pink-deep);
+  --accent-fg:   var(--nt-pink-deep);
+  --support-fg:  var(--nt-mint-deep);
+  --accent-soft: var(--nt-pink-soft);
+  --support-soft: var(--nt-mint-soft);
+  --bg-veil:     rgba(250,248,249,0.70);
+  /* Shadow alphas tuned for paper; the dark set reads as smudges here.
+     The rose-black tint keeps the hue bias of the neutrals. */
+  --shadow-1: 0 1px 2px rgba(26,21,23,0.08), 0 1px 1px rgba(26,21,23,0.05);
+  --shadow-2: 0 6px 18px rgba(26,21,23,0.10), 0 2px 6px rgba(26,21,23,0.07);
+  --shadow-3: 0 20px 50px rgba(26,21,23,0.16), 0 6px 14px rgba(26,21,23,0.08);
+}