/* ========================================================================== Milamay — Design Tokens Single source of truth for the "Atelier" design direction. These are the DEFAULTS. The Customizer prints overrides into an inline :root block in (see inc/customizer/output.php), so any token below can be changed from the admin without touching code. theme.json mirrors the palette/fonts for the block editor. ========================================================================== */ :root { /* --- Brand / accent ---------------------------------------------------- */ --color-primary: #E10A7D; /* fuchsia — primary accent */ --color-primary-bright: #FF3DA5; --color-primary-deep: #9E0050; --color-primary-soft: rgba(225, 10, 125, 0.08); --color-gold: #C9A24B; /* optional hairline accent (very sparing) */ /* --- Neutrals / surfaces ---------------------------------------------- */ --color-bg: #FBF9F7; /* paper */ --color-surface: #FFFFFF; --color-ink: #16141A; /* headings + primary text */ --color-muted: #6E6A73; /* secondary text */ --color-tile: #F1EBE7; /* product placeholder blush */ --color-hero-bg: #0E0E0F; /* dark hero / poster sections */ /* --- Lines / borders -------------------------------------------------- */ --color-line: rgba(20, 18, 26, 0.12); --color-line-soft: rgba(20, 18, 26, 0.08); --color-line-strong: rgba(20, 18, 26, 0.18); --color-line-input: rgba(20, 18, 26, 0.25); /* --- Footer ----------------------------------------------------------- */ --color-footer: #14121A; --color-footer-ink: rgba(255, 255, 255, 0.78); --color-footer-muted: rgba(255, 255, 255, 0.50); --color-footer-line: rgba(255, 255, 255, 0.12); /* --- Header ----------------------------------------------------------- */ --color-nav-bg: rgba(251, 249, 247, 0.90); /* light frosted */ --color-nav-ink: #16141A; --color-nav-line: rgba(20, 18, 26, 0.10); /* --- Buttons (derive from primary/ink by default) -------------------- */ --btn-bg: var(--color-ink); --btn-text: #FFFFFF; --btn-bg-hover: var(--color-primary); --btn-text-hover:#FFFFFF; /* --- Typography: families -------------------------------------------- */ --font-display: 'Cormorant Garamond', Georgia, 'Times New Roman', serif; --font-logo: 'Bodoni Moda', Georgia, serif; --font-label: 'Jost', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; --font-body: 'Hanken Grotesk', -apple-system, BlinkMacSystemFont, 'Segoe UI', system-ui, sans-serif; /* --- Typography: scale ----------------------------------------------- */ --fs-base: 16px; --lh-base: 1.6; --fs-h1: clamp(2.6rem, 1.6rem + 4vw, 4.125rem); /* ~42 → 66px */ --fs-h2: clamp(2rem, 1.4rem + 2.6vw, 3rem); /* ~32 → 48px */ --fs-h3: 1.5625rem; /* 25px */ --fs-hero: clamp(3rem, 1.5rem + 6.5vw, 5.875rem); /* ~48 → 94px */ --fs-eyebrow:11px; --fs-label: 12px; --fs-small: 14px; --ls-eyebrow:.26em; --ls-label: .16em; --ls-nav: .18em; --ls-logo: .30em; /* --- Radius ----------------------------------------------------------- */ --radius: 2px; --radius-pill: 100px; --radius-lg: 6px; /* --- Shadows ---------------------------------------------------------- */ --shadow-card: 0 22px 44px rgba(20, 18, 26, 0.16); --shadow-dropdown: 0 16px 44px rgba(0, 0, 0, 0.14); --shadow-float: 0 8px 24px rgba(0, 0, 0, 0.16); --shadow-modal: 0 30px 90px rgba(0, 0, 0, 0.32); /* --- Layout ----------------------------------------------------------- */ --container: 1340px; --container-narrow: 820px; --container-text: 760px; --gutter: 36px; --header-h: 74px; --topbar-h: 40px; /* --- Grid columns (overridden responsively in main.css) -------------- */ --col-grid: 4; /* home / wishlist grids */ --col-grid-3: 3; /* category / complete-the-look */ /* --- Motion ----------------------------------------------------------- */ --ease: cubic-bezier(.22, 1, .36, 1); --dur-fast: .2s; --dur: .3s; --dur-slow: .45s; /* --- Z-index scale ---------------------------------------------------- */ --z-header: 500; --z-overlay: 1100; --z-modal: 1200; --z-menu: 1300; }