Docs: updates to about section (#2544)

Author: ianmcburnie

src/components/about.marko

@@ -1,15 +1,17 @@
 <div id="about">
-    <h2>What is Skin?</h2>
-    <p>Skin is the official CSS framework of eBay. Skin represents the eBay brand and adheres to the following core principals:</p>
+    <h2>About</h2>
+    <p>Skin is a pure CSS framework, created by a team of passionate frontend engineers at eBay.</p>
+    <p>Skin's default stylesheet represents <a href="https://playbook.ebay.com">eBay Evo</a> - eBay's evolved brand and design system - but Skin also offers <a href="#token-system">token-based configuration</a> to enable non-eBay branded experiences.</p>
+    <p>Skin adheres to the following core principals:</p>
     <dl>
         <dt>Accessible</dt>
-        <dd>Skin leverages semantic HTML, SVG & ARIA to apply our styles wherever possible; thus enforcing correct, accessible markup.</dd>
+        <dd>Skin leverages semantic HTML, SVG & ARIA to apply our styles wherever possible; thus enforcing correct, <a href="https://github.com/ianmcburnie/bones">accessible markup</a>.</dd>
         <dt>Declarative</dt>
-        <dd>Skin follows the <a href="https://getbem.com">BEM</a> methodology of "Block, Element and Modifier" to ensure our HTML class name and structure is human readable and understandable.</dd>
+        <dd>Skin follows the <a href="https://getbem.com">BEM</a> methodology ("Block, Element and Modifier") for structured, human readable code which embraces the power & efficiency of the cascade.</dd>
         <dt>Decoupled</dt>
-        <dd>Skin is decoupled from the JavaScript layer, meaning the HTML and CSS is agnostic of the frontend framework.</dd>
-        <dt>Evergreen</dt>
-        <dd>As the eBay design system evolves, so too does Skin, meaning apps only need to keep their Skin package updated to ensure the latest look and feel.</dd>
-    </dl>
-    <p>Skin is a pure CSS framework and is bundled with zero JavaScript. This website uses <a href="https://github.com/makeup/makeup-js">makeup-js</a> to add interactivity to examples where needed.</p>
+        <dd>Skin is decoupled from the JavaScript layer, meaning the HTML and CSS is agnostic of the frontend framework (BYOJ = Bring Your Own Javascript!)<sup>*</sup></dd>
+        <dt>Scalable</dt>
+        <dd>Skin is built on a system of <a href="https://tr.designtokens.org/format/">design tokens</a> (implemented as CSS Variables); enabling a scalable and consistent visual system for UI development.</dd>
+    </dl>   
+    <p><sup>*</sup>This website uses <a href="https://github.com/makeup/makeup-js">makeup-js</a> to add some basic interactivity to examples where needed.</p>
 </div>