/* ========================================================================== GG10 Blog — brand layer over Blocksy -------------------------------------------------------------------------- Every colour here is copied from the GG10 brand book (gg10_landing/src/app/ brand.css) and must stay in step with it. Nothing invents a new colour. The blog is a SEPARATE surface from the app: it is a reading experience, not a product UI. So it borrows the brand's palette and typeface, but not the app's density — long-form text gets generous line height, a measured column and real vertical rhythm. GEOMETRY NOTE. The app and the landing page use an angular corner CUT. A reading surface wants the opposite: large, soft, consistent radii that let a card feel like an object you can pick up. The cut survives here only as a small accent (the rotated square in kickers and headings), which is what actually carries the brand — the red and that diamond — while the containers themselves are curved. ========================================================================== */ :root { /* ---- 01. Primary ---- */ --gg-primary: #d90251; --gg-primary-shade-3: #48011b; --gg-primary-shade-2: #79012d; --gg-primary-shade-1: #a9023f; --gg-primary-tint-4: #e40b5a; --gg-primary-tint-3: #ff317c; --gg-primary-tint-0: #ffdfeb; /* ---- 02. Neutral ---- */ --gg-bg: #131313; --gg-bg-2: #212121; --gg-grey-8: #090406; --gg-grey-7: #161616; --gg-grey-6: #1f1f1f; --gg-grey-5: #262626; --gg-grey-4: #454545; --gg-grey-3: #717171; --gg-grey-2: #8a8a8a; --gg-grey-1: #a4a4a4; --gg-grey-0: #d0d0d0; --gg-white: #ffffff; --gg-primary-rgb: 217 2 81; --gg-primary-tint-3-rgb: 255 49 124; --gg-primary-shade-2-rgb: 121 1 45; --gg-white-rgb: 255 255 255; --gg-black-rgb: 2 2 2; /* ---- Curve scale — one ramp, used everywhere ---- */ --gg-r-xs: 8px; --gg-r-sm: 12px; --gg-r-md: 18px; --gg-r-lg: 24px; --gg-r-xl: 32px; --gg-r-pill: 999px; /* ---- Elevation. Dark UIs read depth from a lifted rim + a deep shadow, never from a grey step alone. ---- */ --gg-rim: inset 0 1px 0 rgb(var(--gg-white-rgb) / 0.06); --gg-shadow-sm: 0 2px 8px -2px rgb(var(--gg-black-rgb) / 0.5); --gg-shadow-md: 0 12px 28px -12px rgb(var(--gg-black-rgb) / 0.7); --gg-shadow-lg: 0 28px 60px -24px rgb(var(--gg-black-rgb) / 0.85); --gg-glow: 0 20px 50px -22px rgb(var(--gg-primary-rgb) / 0.55); /* ---- Motion. One easing for everything so the surface feels coherent. ---- */ --gg-ease: cubic-bezier(0.22, 0.61, 0.36, 1); --gg-dur: 0.32s; /* ---- Reading measure ---- */ --gg-measure: 42rem; --gg-measure-wide: 54rem; /* Page gutter — the space between content and the screen edge on narrow viewports. Matches what Blocksy applies to its own container. */ --gg-gutter: clamp(0.9rem, 0.4rem + 2vw, 2rem); /* ---- Type ---- IRANSansXV is the variable face (weight axis 100-900); IRANSansX is the static fallback for browsers without variable-font support. Both are self-hosted by the child theme — see gg10_blog_font_face(). */ --gg-font: "IRANSansXV", "IRANSansX", "IRANSans", Tahoma, system-ui, sans-serif; } /* ========================================================================== Blocksy palette override -------------------------------------------------------------------------- Blocksy renders its whole UI from eight --theme-palette-color-* variables, emitted inline in from ITS OWN option store (not plain theme mods). Setting those mods via WP-CLI does not reach that store, so the site kept rendering Blocksy's default blue-on-white. The selector is `html:root`, not `:root`: Blocksy prints its inline