/* ═══════════════════════════════════════════ BLOMSTERHJEM v5 — TEMA Standard: mørk modus Lys modus aktiveres via [data-theme="light"] på ═══════════════════════════════════════════ */ /* ── MØRK MODUS (standard) ── */ :root { --bg-primary: #16261C; --bg-secondary: #1E3828; --bg-tertiary: #0A1410; --bg-dark: #0A1410; --bg-darkest: #060E0A; --bg-accent: #4A1528; --text-primary: #F2E8D0; --text-secondary: rgba(242,232,208,0.55); --text-on-dark: #F2E8D0; --text-muted-dark: rgba(242,232,208,0.4); --gold: #B8912A; --gold-bright: #D4A843; --gold-pale: #E8CC80; --gold-border: rgba(184,145,42,0.3); --gold-border-strong: rgba(184,145,42,0.55); --forest: #16261C; --forest-mid: #1E3828; --forest-light: #2C5040; --burgundy: #4A1528; --border-light: rgba(184,145,42,0.3); --border-lighter: rgba(184,145,42,0.18); /* Nav */ --nav-bg: rgba(10,20,16,0.96); --nav-border: rgba(184,145,42,0.3); --nav-logo-color: #E8CC80; --nav-link-color: rgba(232,204,128,0.4); --nav-cta-border: rgba(184,145,42,0.55); --nav-cta-color: #E8CC80; --nav-cta-hover-bg: #B8912A; --nav-cta-hover-color: #0A1410; /* Hero */ --hero-bg: #16261C; --hero-bg-pattern: #B8912A; --hero-title: #E8CC80; --hero-title-2: #F2E8D0; --hero-sub: rgba(242,232,208,0.55); --hero-btn-bg: #B8912A; --hero-btn-color: #0A1410; --hero-btn-hover: #D4A843; --hero-ghost: rgba(232,204,128,0.3); --hero-eyebrow: #B8912A; /* Strip */ --strip-bg: #060E0A; --strip-border: rgba(184,145,42,0.15); --strip-freq: #E8CC80; --strip-label: rgba(232,204,128,0.25); /* Sections */ --section-alt-bg: #0A1410; --section-title: #E8CC80; --section-eyebrow: #B8912A; --section-body: rgba(242,232,208,0.5); /* Steps */ --step-bg: rgba(22,38,28,0.5); --step-border: rgba(184,145,42,0.3); --step-border-top: #B8912A; --step-num: rgba(184,145,42,0.3); --step-title: #E8CC80; --step-text: rgba(242,232,208,0.45); /* Features */ --feat-border: rgba(184,145,42,0.5); --feat-title: #E8CC80; --feat-text: rgba(242,232,208,0.45); /* Quote */ --quote-bg: #4A1528; --quote-mark: #B8912A; --quote-text: #F2E8D0; --quote-attr: rgba(232,204,128,0.3); /* Pricing */ --price-bg: rgba(22,38,28,0.4); --price-border: rgba(184,145,42,0.3); --price-border-feat: #D4A843; --price-border-top-feat: #B8912A; --price-freq: rgba(232,204,128,0.35); --price-amt: #E8CC80; --price-note: rgba(242,232,208,0.4); --price-tag-bg: #B8912A; --price-tag-color: #0A1410; /* Form */ --form-bg: #0A1410; --form-box-bg: rgba(22,38,28,0.6); --form-box-border: rgba(184,145,42,0.3); --form-box-top: #B8912A; --form-logo: #E8CC80; --form-sub: rgba(232,204,128,0.3); --form-label: #B8912A; --form-input-bg: #1E3828; --form-input-border: rgba(184,145,42,0.3); --form-input-focus: rgba(184,145,42,0.55); --form-input-color: #F2E8D0; --form-placeholder: rgba(242,232,208,0.2); --form-submit-bg: #B8912A; --form-submit-color: #0A1410; --form-submit-hover: #D4A843; --form-legal: rgba(232,204,128,0.22); /* Footer */ --footer-bg: #060E0A; --footer-logo: #B8912A; --footer-text: rgba(232,204,128,0.18); --footer-link: rgba(232,204,128,0.3); /* Ornaments */ --orn-color: #B8912A; --orn-line: rgba(184,145,42,0.35); --corner-color: rgba(184,145,42,0.55); /* Fonts */ --font-display: 'Bodoni Moda', serif; --font-heading: 'Bodoni Moda', serif; --font-sub: 'Cormorant SC', serif; --font-body: 'EB Garamond', serif; --font-ui: 'Cormorant SC', serif; --font-display-style: italic; --font-display-weight: 400; --font-heading-style: italic; --font-heading-weight: 500; --font-sub-style: normal; --font-sub-weight: 400; --font-body-style: normal; --font-body-weight: 400; } /* ── LYS MODUS ── */ :root[data-theme="light"] { --bg-primary: #F5EFE0; --bg-secondary: #EDE3CC; --bg-tertiary: #E2D6B8; --bg-dark: #16261C; --bg-darkest: #0A1410; --bg-accent: #4A1528; --text-primary: #1A1A18; --text-secondary: #7A6A4A; --text-on-dark: #F5EFE0; --text-muted-dark: rgba(242,232,208,0.5); --border-light: #D9CCAA; --border-lighter: #E8DFC8; /* Nav */ --nav-bg: rgba(245,239,224,0.97); --nav-border: #D9CCAA; --nav-logo-color: #16261C; --nav-link-color: rgba(122,106,74,0.6); --nav-cta-border: #16261C; --nav-cta-color: #16261C; --nav-cta-hover-bg: #16261C; --nav-cta-hover-color: #F5EFE0; /* Hero */ --hero-bg: #F5EFE0; --hero-bg-pattern: #16261C; --hero-title: #16261C; --hero-title-2: #2C5040; --hero-sub: #7A6A4A; --hero-btn-bg: #16261C; --hero-btn-color: #F5EFE0; --hero-btn-hover: #2C5040; --hero-ghost: rgba(122,106,74,0.5); --hero-eyebrow: #B8912A; /* Strip */ --strip-bg: #16261C; --strip-border: rgba(232,204,128,0.12); --strip-freq: #E8CC80; --strip-label: rgba(232,204,128,0.28); /* Sections */ --section-alt-bg: #EDE3CC; --section-title: #16261C; --section-eyebrow: #B8912A; --section-body: #7A6A4A; /* Steps */ --step-bg: #F5EFE0; --step-border: #D9CCAA; --step-border-top: #B8912A; --step-num: #D9CCAA; --step-title: #16261C; --step-text: #7A6A4A; /* Features */ --feat-border: #B8912A; --feat-title: #16261C; --feat-text: #7A6A4A; /* Quote */ --quote-bg: #16261C; --quote-mark: #B8912A; --quote-text: #F5EFE0; --quote-attr: rgba(232,204,128,0.3); /* Pricing */ --price-bg: #F5EFE0; --price-border: #D9CCAA; --price-border-feat: #D4A843; --price-border-top-feat: #B8912A; --price-freq: #7A6A4A; --price-amt: #16261C; --price-note: #7A6A4A; --price-tag-bg: #B8912A; --price-tag-color: #1A1A18; /* Form */ --form-bg: #F5EFE0; --form-box-bg: #EDE3CC; --form-box-border: #D9CCAA; --form-box-top: #16261C; --form-logo: #16261C; --form-sub: #7A6A4A; --form-label: #16261C; --form-input-bg: #F5EFE0; --form-input-border: #D9CCAA; --form-input-focus: rgba(22,38,28,0.4); --form-input-color: #1A1A18; --form-placeholder: rgba(122,106,74,0.4); --form-submit-bg: #16261C; --form-submit-color: #F5EFE0; --form-submit-hover: #2C5040; --form-legal: #7A6A4A; /* Footer */ --footer-bg: #16261C; --footer-logo: #B8912A; --footer-text: rgba(232,204,128,0.2); --footer-link: rgba(232,204,128,0.35); /* Ornaments */ --orn-color: #B8912A; --orn-line: rgba(184,145,42,0.4); --corner-color: rgba(184,145,42,0.5); }