/* ============================================================ REGENT SIGNATURE DEVELOPMENTS Design tokens — v0.2.1 Supersedes v0.1. Reconciled with the approved foundations sheet. Changed since v0.1: · GT Ultra split into two optical-size families (Fine / Median) · display weight encoded as tokens — 300 large, 400 small · --fs-d3 floor raised 2rem -> 2.5rem so Fine never renders below the 40px optical boundary · --fw-body 350 -> 300, --tr-body 0 -> 0.006em · webfonts live · ground contexts keyed on [data-ground], and link colour resolved through inherited custom properties rather than selector specificity — see LINKS below · corrected note: the logo is NOT set in GT Ultra v0.2.1 — font URLs are relative to THIS FILE, not to the site root. v0.2 wrote them as "uploads/NAME.woff2", which resolves to uploads/uploads/NAME.woff2 once the stylesheet itself sits in uploads/. Keep the woff2 files beside this file, or adjust the paths below to match wherever you put them. ============================================================ */ /* --- WEBFONTS ------------------------------------------------ Season Sans files are TRIAL builds. GT Ultra needs a webfont licence tied to monthly pageviews. Both must be resolved before public launch. ------------------------------------------------------------ */ @font-face{font-family:"GT Ultra Fine";font-style:normal;font-weight:300;font-display:swap; src:url("GTUltraFine-Light.woff2") format("woff2");} @font-face{font-family:"GT Ultra Fine";font-style:normal;font-weight:400;font-display:swap; src:url("GTUltraFine-Regular.woff2") format("woff2");} @font-face{font-family:"GT Ultra Median";font-style:normal;font-weight:300;font-display:swap; src:url("GTUltraMedian-Light.woff2") format("woff2");} @font-face{font-family:"GT Ultra Median";font-style:normal;font-weight:400;font-display:swap; src:url("GTUltraMedian-Regular.woff2") format("woff2");} @font-face{font-family:"Season Sans";font-style:normal;font-weight:300;font-display:swap; src:url("SeasonSans-Light.woff2") format("woff2");} @font-face{font-family:"Season Sans";font-style:normal;font-weight:400;font-display:swap; src:url("SeasonSans-Regular.woff2") format("woff2");} @font-face{font-family:"Season Sans";font-style:normal;font-weight:500;font-display:swap; src:url("SeasonSans-Medium.woff2") format("woff2");} :root{ /* --- COLOUR ------------------------------------------------- Two green ramps, because the brand green is near-black (HSL 161, 85%, 8%) and cannot serve as UI colour on itself. */ --c-regent: #03261B; /* brand. primary dark ground. */ --c-deep: #063A2A; /* raised surface on dark. */ --c-mid: #0B5C43; /* green TEXT on light grounds. AAA. */ --c-mint: #47AE8D; /* green TEXT/UI on dark grounds. AA. */ --c-accent: #1F8A67; /* DECORATIVE ONLY — rules, borders. never text: 2.97 on --c-deep. */ --c-vie: #405952; /* The Vie sub-brand (clubhouse mark). */ --c-error: #9B3B22; /* form errors. LIGHT grounds only: 6.04 on ivory, 6.90 on white. 2.4 on regent green — never on dark. */ --c-stone: #8A795A; /* imagery mid-tone. never a text bed. */ --c-grey: #A7AAAF; /* meta / captions, DARK grounds only. */ --c-shell: #D8D4CF; /* body text on dark; light surface. */ --c-ivory: #EFE8DF; /* primary light ground (Pantone Cloud Dancer 11-4201 TCX) */ --c-white: #FFFFFF; /* verified contrast (WCAG 2.1) — computed, not estimated ivory on regent .... 14.16 AAA shell on regent .... 10.98 AAA grey on regent ..... 6.95 AA mint on regent ..... 5.94 AA mint on deep ....... 4.68 AA mid on ivory ...... 7.00 AAA regent on ivory ..... 14.16 AAA FAILS — never ship: accent on deep ....... 2.97 mint on ivory ...... 2.38 vie on regent ..... 2.13 grey on ivory ...... 2.04 mid on regent ..... 2.02 any green on stone ... < 2.0 green logo on black .. 1.30 */ /* --- TYPE --------------------------------------------------- GT Ultra ships three optical cuts. They are OPTICAL SIZES, not styles: Fine 40px and above. Hairlines survive at display size. Median below 40px and all UI. Fine breaks up down here. NOTE: the logo wordmark is NOT set in GT Ultra. Shape-matched against all nine cuts, best score was 0.72 IoU — an envelope coincidence. The logo's serifs are bracketed and tapered; GT Ultra's are flat. Always place the logo as artwork; never re-set it in type. */ --f-display: "GT Ultra Fine", Georgia, "Times New Roman", serif; --f-display-ui: "GT Ultra Median", Georgia, "Times New Roman", serif; --f-sans: "Season Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif; --fs-d1: clamp(3.25rem, 11vw, 10.5rem); /* cold open */ --fs-d2: clamp(2.5rem, 7vw, 6.5rem); /* section reveal */ --fs-d3: clamp(2.5rem, 4.5vw, 4rem); /* section heading floor is 2.5rem = 40px, so Fine never renders below the optical boundary. Do not lower it. */ --fs-d4: clamp(1.55rem, 3vw, 2.5rem); /* sub-heading */ --fs-stat: clamp(2.75rem, 6vw, 5.5rem); /* EGP 10+ Bn */ --fs-lead: clamp(1.0625rem, 1.5vw, 1.3rem); --fs-body: 1.0625rem; /* 17px */ --fs-small: 0.9375rem; /* 15px */ --fs-nav: 0.75rem; /* 12px */ --fs-eyebrow:0.6875rem; /* 11px */ /* weight is size-dependent: Light reads better very large, but loses presence at 40px and below — especially on ivory, where there is no halation to thicken it. */ --fw-display-lg: 300; /* d1, d2, stat */ --fw-display-sm: 400; /* d3, d4 */ --fw-body: 300; --fw-medium: 500; --lh-display: 1.02; --lh-heading: 1.12; --lh-body: 1.62; --tr-display: -0.022em; --tr-heading: -0.012em; --tr-body: 0.006em; /* Season Sans runs tight at text size */ --tr-nav: 0.16em; --tr-eyebrow: 0.24em; /* echoes the logo descriptor (~.25em) */ /* --- SPACE --- 8px base ------------------------------------ */ --s-1:4px; --s-2:8px; --s-3:12px; --s-4:16px; --s-5:24px; --s-6:32px; --s-7:48px; --s-8:64px; --s-9:96px; --s-10:128px; --s-11:192px; --s-12:256px; --gutter: clamp(20px, 5vw, 88px); --measure: 68ch; --measure-tight: 46ch; /* --- MOTION ------------------------------------------------- Slow, few, deliberate. Camera moves, not UI transitions. */ --ease-brand: cubic-bezier(.16, 1, .30, 1); --ease-soft: cubic-bezier(.40, 0, .20, 1); --t-reveal: 1100ms; --t-fade: 700ms; --t-micro: 240ms; --stagger: 90ms; /* --- OTHER --- */ --radius: 2px; /* almost none. luxury is square. */ --nav-h: clamp(64px, 7vw, 88px); --logo-nav-w: 150px; /* wordmark crop, 5.35:1 */ } /* --- GROUND CONTEXTS ---------------------------------------- Mark every section with data-ground="dark" or "light". Dark is also the document default, so an unmarked element still resolves to safe values. ------------------------------------------------------------ */ :root, [data-ground="dark"]{ --bg: var(--c-regent); --bg-raised: var(--c-deep); --fg: var(--c-ivory); /* headlines, primary */ --fg-body: var(--c-shell); /* long-form body. 10.98 AAA */ --fg-muted: var(--c-grey); /* meta, captions. 6.95 AA */ --fg-green: var(--c-mint); /* green text here. 5.94 AA */ --rule: rgba(244,239,233,.16); --rule-strong: rgba(244,239,233,.34); --link: var(--c-mint); --link-hover: var(--c-ivory); } [data-ground="light"]{ --bg: var(--c-ivory); --bg-raised: var(--c-white); --fg: var(--c-regent); --fg-body: #3B4A44; --fg-muted: #5A6B64; --fg-green: var(--c-mid); /* green text here. 7.00 AAA */ --rule: rgba(3,38,27,.14); --rule-strong: rgba(3,38,27,.30); --link: var(--c-mid); --link-hover: var(--c-regent); } /* --- LINKS --------------------------------------------------- Resolved through INHERITED custom properties, not selector specificity. A light section nested inside a dark wrapper is the normal case here, and CSS has no proximity operator — two ground selectors of equal specificity would be decided by source order, which breaks silently the moment anyone reorders the stylesheet. Custom properties inherit, so the nearest ground always wins, at any nesting depth, in any order. ------------------------------------------------------------ */ a{ color: var(--link); } a:hover{ color: var(--link-hover); } @media (prefers-reduced-motion: reduce){ :root{ --t-reveal:1ms; --t-fade:1ms; --t-micro:1ms; --stagger:0ms; } }