:root {
	--document-font-size:          16px; /* = 10px */
	--line-height:                 1.5;
	--line-height-heading:         calc(var(--line-height) / 1.2);

	/*--font-family:                 "Roboto Slab", serif;*/
	/*--font-family-headings:        "Roboto Slab", serif;*/

	--font-family:                 "Jost", serif;
	--font-family-headings:        "Jost", serif;

	--font-size-regular:           1rem;            /* → --sds-font-size-body-medium */
	--font-size-small:             0.875rem;        /* → --sds-font-size-body-small */
	--font-size-large:             1.125rem;        /* → --sds-font-size-body-large */
	--font-size-xlarge:            1.40625rem;      /* → 1.125rem * 1.25 */
	--font-size-xxlarge:           1.6875rem;       /* → 1.125rem * 1.5 */

	--font-heading-weight:         700;             /* → --sds-font-weight-bold */
	--font-heading-transform:      none;            /* → --sds-font-texttransform-default */

	--input-height:                36px;         /* → --size-36 */
	--icon-button-size:            1.40625rem;      /* → 1.125rem * 1.25 */

	/*------------------------------------------------------------------------------*/
	/* Margin
	/*------------------------------------------------------------------------------*/

	--margin:                     2.25rem;          /* → --space-size-36 */
	--margin-xsmall:              0.25rem;          /* → --space-size-4 */
	--margin-small:               1rem;             /* → --space-size-16 */
	--margin-large:               clamp(10px, 3.90625vw, 4rem);             /* → --space-size-64 */
	--margin-xlarge:              5rem;             /* → --space-size-80 */

	--default-margin:              0 0 var(--margin);

	/*------------------------------------------------------------------------------*/
	/* Container & Grid System
	/*------------------------------------------------------------------------------*/

	--container-page-margin:       5rem;            /* → --main-content-horizontal-padding-desktop */
	--grid-gutter:                 1.75rem;         /* → --space-size-28 */

	/*------------------------------------------------------------------------------*/
	/* Shop Settings
	/*------------------------------------------------------------------------------*/

	--logo-image-ratio:            4 / 1;
	--product-image-ratio:         1;

	/*------------------------------------------------------------------------------*/
	/* Product Grid List
	/*------------------------------------------------------------------------------*/

	--grid-list-gutter:            1.25rem;         /* → --space-size-20 */
	--grid-list-image-width:       14.75rem;           /* → --image-width */

	/*------------------------------------------------------------------------------*/
	/* Animation Properties
	/*------------------------------------------------------------------------------*/

	--transition-fast:             0.2s;            /* → --sds-motion-duration-fast */
	--transition-slow:             0.3s;            /* → --sds-motion-duration-default */

	/*------------------------------------------------------------------------------*/
	/* Border Radius
	/*------------------------------------------------------------------------------*/

	--border-radius:               0.25rem;         /* → --border-radius-size-4 */
	--border-radius-medium:        0.5rem;          /* → --border-radius-size-8 */
	--border-radius-images:        2px;
	--border-radius-buttons:       4px;
	--border-radius-drawers:       0.5rem;

	/*------------------------------------------------------------------------------*/
	/* Font Awesome
	/*------------------------------------------------------------------------------*/

	--fa-style-family: "Font Awesome 6 Free";
	--fa-style: 900;

	/*------------------------------------------------------------------------------*/
	/* Misc
	/*------------------------------------------------------------------------------*/

	--full-width-limit:            90rem;           /* → --content-region-max-width */
}