/* Selvacrafts design tokens + style axes. * Ported from selvacrafts-theme-1/assets/css/theme.css (TOKENS + STYLE AXES). * Values are hardcoded for now; will be driven by Redux options later. */ /* ============================== TOKENS ============================== */ :root { --maxw: 1240px; --pad: clamp(20px, 5vw, 72px); --gold: #DAA30C; --bg: #F6F1E8; --bg2: #FBF8F1; --surface: #ffffff; --ink: #2B2620; --ink2: #6E655A; --line: #E7DECE; --accent: #72296F; --accent2: #9C4E97; --accent-tint: #F1E5F0; --foot-bg: #231F1A; --foot-ink: #E9E0D2; --foot-ink2: #A99C89; --paper: none; --sc-page-maxw: 1430px; --sc-page-gutter: 40px; --sc-page-edge: max(var(--sc-page-gutter), calc((100vw - var(--sc-page-maxw)) / 2 + var(--sc-page-gutter))); --page-bg-home: #F6F1E8; --page-bg-inner: #ffffff; } /* ====================== STYLE AXES (body classes) ====================== Defaults on : buttons-round images-square typeface-cozy Each axis has two mutually-exclusive classes. */ body.buttons-square { --btn-radius: 2px; --control-radius: 3px; --btn-tt: uppercase; --btn-ls: .14em; } body.buttons-round { --btn-radius: 40px; --control-radius: 3px; --btn-tt: none; --btn-ls: .01em; } body.images-square { --radius: 3px; --card-radius: 3px; } body.images-round { --radius: 14px; --card-radius: 16px; } body.typeface-serif { --font-display: 'Cormorant Garamond', Georgia, serif; --font-body: 'Mulish', system-ui, sans-serif; --font-script: 'Cormorant Garamond', serif; --dw: 600; --disp-scale: 1.18; --eyebrow-ls: .26em; } body.typeface-cozy { --font-display: 'Hanken Grotesk', system-ui, sans-serif; --font-body: 'Hanken Grotesk', system-ui, sans-serif; --font-script: 'Caveat', cursive; --dw: 800; --disp-scale: 1; --eyebrow-ls: .18em; }