/* ============================================================ FOUNDERY · PER-PROJECT THEMES When a project is opened (data-project="X" on ), these overrides swap colors, fonts, and signature accents. ============================================================ */ /* ============================================================ 1. MyProperty.Now — regio.immo (dark + violet + technical) ============================================================ */ html[data-project="myproperty"] { --accent: #a78bfa; --accent-hi: #c4b5fd; --accent-lo: #7c66d9; --accent-soft: rgba(167, 139, 250, 0.10); --accent-glow: rgba(167, 139, 250, 0.36); --accent-line: rgba(167, 139, 250, 0.30); --accent-wash: rgba(167, 139, 250, 0.06); --t-on-accent: #0a0512; --bg: #07080a; --bg-1: #0b0e10; --bg-2: #0f1316; --bg-3: #131820; --f-display: 'Inter', -apple-system, BlinkMacSystemFont, system-ui, sans-serif; --f-body: 'Inter', -apple-system, BlinkMacSystemFont, system-ui, sans-serif; } html[data-project="myproperty"] .proj-hero-title, html[data-project="myproperty"] .proj-section h3, html[data-project="myproperty"] .proj-card-name, html[data-project="myproperty"] .market-cell .val, html[data-project="myproperty"] .ask-card-value, html[data-project="myproperty"] .proj-stat-value, html[data-project="myproperty"] .team-card-name, html[data-project="myproperty"] .deck-card-title, html[data-project="myproperty"] .faq-q { font-family: var(--f-body); font-weight: 600; letter-spacing: -0.025em; font-style: normal; } html[data-project="myproperty"] .proj-hero-title em, html[data-project="myproperty"] .proj-section h3 em, html[data-project="myproperty"] .ask-card.is-finance .ask-card-value { font-style: normal; color: var(--accent); font-weight: 600; } html[data-project="myproperty"] .team-avatar { font-style: normal; font-family: var(--f-mono); font-weight: 700; } /* ============================================================ 2. Realty-51 — Heritage (navy + gold + Cormorant) ============================================================ */ html[data-project="realty51"] { --accent: #C9A84C; --accent-hi: #E2C580; --accent-lo: #A88836; --accent-soft: rgba(201, 168, 76, 0.10); --accent-glow: rgba(201, 168, 76, 0.36); --accent-line: rgba(201, 168, 76, 0.30); --accent-wash: rgba(201, 168, 76, 0.06); --t-on-accent: #0A1628; --bg: #0A1628; --bg-1: #0F1F38; --bg-2: #14274A; --bg-3: #1A305C; --f-display: 'Cormorant Garamond', 'Times New Roman', Georgia, serif; } html[data-project="realty51"] .proj-hero-title, html[data-project="realty51"] .proj-section h3 { font-weight: 400; letter-spacing: -0.012em; } html[data-project="realty51"] .proj-hero-title em { font-style: italic; font-weight: 400; } /* ============================================================ 3. MyWork.Now — Black + Teal + Space Grotesk ============================================================ */ html[data-project="mywork"] { --accent: #00D4C8; --accent-hi: #5EFFE0; --accent-lo: #00A89E; --accent-soft: rgba(0, 212, 200, 0.10); --accent-glow: rgba(0, 212, 200, 0.36); --accent-line: rgba(0, 212, 200, 0.30); --accent-wash: rgba(0, 212, 200, 0.06); --t-on-accent: #001E1B; --bg: #08090B; --bg-1: #0E1014; --bg-2: #14171F; --bg-3: #1B1F2A; --f-display: 'Space Grotesk', 'Inter', system-ui, sans-serif; } html[data-project="mywork"] .proj-hero-title, html[data-project="mywork"] .proj-section h3 { font-weight: 600; letter-spacing: -0.025em; } html[data-project="mywork"] .proj-hero-title em { font-style: normal; color: var(--accent); } /* ============================================================ 4. MyOfficeOS — Dark + Acid Lime + Inter ============================================================ */ html[data-project="myofficeos"] { --accent: #C5F02B; --accent-hi: #E2F77A; --accent-lo: #9BC020; --accent-soft: rgba(197, 240, 43, 0.10); --accent-glow: rgba(197, 240, 43, 0.36); --accent-line: rgba(197, 240, 43, 0.30); --accent-wash: rgba(197, 240, 43, 0.06); --t-on-accent: #0A0F00; --bg: #0A0B0E; --bg-1: #101218; --bg-2: #181B22; --bg-3: #20242E; --f-display: 'Inter', system-ui, sans-serif; } html[data-project="myofficeos"] .proj-hero-title, html[data-project="myofficeos"] .proj-section h3 { font-weight: 700; letter-spacing: -0.028em; } html[data-project="myofficeos"] .proj-hero-title em { font-style: normal; color: var(--accent); font-weight: 700; } /* ============================================================ 5. XTR.NAME — Dark + Cyan + JetBrains Mono ============================================================ */ html[data-project="xtr"] { --accent: #5AE0FF; --accent-hi: #A0EEFF; --accent-lo: #36B8DC; --accent-soft: rgba(90, 224, 255, 0.10); --accent-glow: rgba(90, 224, 255, 0.36); --accent-line: rgba(90, 224, 255, 0.30); --accent-wash: rgba(90, 224, 255, 0.06); --t-on-accent: #001620; --bg: #06080C; --bg-1: #0B0E14; --bg-2: #11151E; --bg-3: #161B27; --f-display: 'JetBrains Mono', ui-monospace, SFMono-Regular, monospace; } html[data-project="xtr"] .proj-hero-title, html[data-project="xtr"] .proj-section h3 { font-weight: 600; letter-spacing: -0.04em; } html[data-project="xtr"] .proj-hero-title em { font-style: normal; color: var(--accent); } /* ============================================================ 6. fairlane.legal — Editorial Light (bone + ink + navy + Fraunces + Hanken) ============================================================ */ html[data-project="fairlane"] { --bg: #F2EEE3; --bg-1: #FAF7EE; --bg-2: #E9E2CF; --bg-3: #D6CCB1; --bg-inset: #FAF7EE; --bg-glass: rgba(242, 238, 227, 0.86); --t: #0F1115; --t-soft: #5A5F69; --t-mute: #8B8F98; --t-faint: #B5B9C0; --t-on-accent: #FAF7EE; --line: rgba(15, 17, 21, 0.10); --line-2: rgba(15, 17, 21, 0.20); --line-3: rgba(15, 17, 21, 0.45); --accent: #2E3A4D; --accent-hi: #485870; --accent-lo: #1F2735; --accent-soft: rgba(46, 58, 77, 0.08); --accent-glow: rgba(46, 58, 77, 0.30); --accent-line: rgba(46, 58, 77, 0.30); --accent-wash: rgba(46, 58, 77, 0.04); --good: #3D8857; --warn: #B8861A; --bad: #B83737; --f-display: 'Fraunces', 'Times New Roman', Georgia, serif; --f-body: 'Hanken Grotesk', system-ui, -apple-system, 'Segoe UI', sans-serif; color-scheme: light; } html[data-project="fairlane"] body::before { background: radial-gradient(circle at 18% -10%, var(--accent-soft), transparent 50%), radial-gradient(circle at 100% 110%, var(--accent-wash), transparent 60%); } html[data-project="fairlane"] body::after { /* paper texture overlay */ background-image: radial-gradient(rgba(15, 17, 21, 0.05) 1px, transparent 1px); background-size: 24px 24px; } html[data-project="fairlane"] .header, html[data-project="fairlane"] .sidebar { background: var(--bg-1); } html[data-project="fairlane"] .proj-hero-title, html[data-project="fairlane"] .proj-section h3 { font-weight: 400; letter-spacing: -0.012em; } html[data-project="fairlane"] .proj-hero-title em, html[data-project="fairlane"] .proj-section h3 em { font-style: italic; color: var(--accent); font-weight: 400; } html[data-project="fairlane"] .video-frame { background: linear-gradient(135deg, var(--bg-2) 0%, var(--bg) 100%); } /* ============================================================ 7. YUPA Heritage — Paper + Terracotta + Cormorant ============================================================ */ html[data-project="yupa"] { --bg: #F4EFE6; --bg-1: #FAF6EE; --bg-2: #ECE5D5; --bg-3: #DDD3BD; --t: #1F1A14; --t-soft: #574E40; --t-mute: #7E7263; --t-faint: #A89A87; --t-on-accent: #FAF6EE; --line: rgba(31, 26, 20, 0.10); --line-2: rgba(31, 26, 20, 0.18); --line-3: rgba(31, 26, 20, 0.30); --accent: #C45A3F; --accent-hi: #E08260; --accent-lo: #A4452B; --accent-soft: rgba(196, 90, 63, 0.10); --accent-glow: rgba(196, 90, 63, 0.32); --accent-line: rgba(196, 90, 63, 0.36); --accent-wash: rgba(196, 90, 63, 0.06); --bg-glass: rgba(244, 239, 230, 0.86); --f-display: 'Cormorant Garamond', 'Times New Roman', Georgia, serif; --f-body: 'Sarabun', 'Inter', system-ui, sans-serif; color-scheme: light; } html[data-project="yupa"] body::before { background: radial-gradient(circle at 18% -10%, var(--accent-soft), transparent 50%), radial-gradient(circle at 100% 110%, var(--accent-wash), transparent 60%); } html[data-project="yupa"] body::after { background-image: radial-gradient(rgba(31, 26, 20, 0.06) 1px, transparent 1px); } html[data-project="yupa"] .header, html[data-project="yupa"] .sidebar { background: var(--bg-1); } html[data-project="yupa"] .proj-hero-title, html[data-project="yupa"] .proj-section h3 { font-weight: 400; } /* ============================================================ PROJECT CARD ACCENT — applied per card on overview The card itself sets --card-accent which the card uses ============================================================ */ .proj-card[data-card-theme="myproperty"] { --card-accent: #a78bfa; } .proj-card[data-card-theme="realty51"] { --card-accent: #C9A84C; } .proj-card[data-card-theme="mywork"] { --card-accent: #00D4C8; } .proj-card[data-card-theme="myofficeos"] { --card-accent: #C5F02B; } .proj-card[data-card-theme="fairlane"] { --card-accent: #2E3A4D; } .proj-card[data-card-theme="xtr"] { --card-accent: #5AE0FF; } .proj-card[data-card-theme="yupa"] { --card-accent: #C45A3F; }