/* ============================================================ TEMA — MÖRK LYX ------------------------------------------------------------ Referens: "Curly website.png". Kväll, mässing, New York. Passar salonger som tar 900 kr för en färgning och vill att det ska synas. Fungerar dåligt för familjefrisören. Display: Italiana i versaler. Hög, smal, extremt spärrad — ett modemagasinsomslag. Tål inte långa rubriker; håll dem under fem ord. Skrivs över på eller scoped. ============================================================ */ :root[data-tema="mork-lyx"], [data-tema="mork-lyx"] { /* Brons. Mörkare än den ser ut i en färgväljare — den ljusare mässingstonen ger 3.4:1 på cream och faller på AA för ögonbryn, som är liten text. */ --ton-ljus: #f4efe9; --ton-ljus-alt: #ebe3d9; --ton-mork: #141416; --ton-mork-alt: #1c1c1f; --accent-pa-ljus: #8f6236; /* 4.6:1 mot cream */ --accent-pa-mork: #d9b98a; /* 10.0:1 mot #141416 */ --accent-ink-ljus: #ffffff; /* 5.3:1 på #8f6236 */ --accent-ink-mork: #141416; /* 10.0:1 på #d9b98a */ /* 'Siffror' först — den täcker bara 0–9 och tar hand om att Italianas gammaldags siffror läser "14" som "I4". Se fonts.css. */ --font-display: 'Siffror', 'Italiana', Georgia, serif; --font-body: 'Schibsted Grotesk', -apple-system, sans-serif; --font-script: 'Parisienne', cursive; --display-case: uppercase; --display-tracking: 0.07em; --display-weight: 400; --display-leading: 1.04; /* Italiana är hårfin och finns bara i en vikt — den kan inte göras tyngre. Under ~2rem blir stammarna tunnare än en pixel och rubriken läser grå i stället för svart, särskilt i ljust läge mot cream. Golvet i skalan höjs därför. Samma orsak gjorde att teamnamn redan bytts till brödtext. Regeln för det här temat: Italiana går aldrig under 2rem. */ --t-h2: clamp(2rem, 3.6vw, 3.1rem); --t-h3: clamp(1.3rem, 1.8vw, 1.6rem); } /* Reservläge om data-lage saknas: ljust cream. :where() ger specificitet noll så att [data-lage] alltid vinner. */ :where([data-tema="mork-lyx"]) { --accent-ink: #ffffff; --paper: #f4efe9; --paper-alt: #ebe3d9; --ink: #101012; --ink-soft: rgba(16, 16, 18, 0.66); --surface: #141416; --surface-ink: #ece4d9; --surface-soft: rgba(236, 228, 217, 0.60); --accent: #8f6236; --accent-on-dark: #d9b98a; --line: rgba(16, 16, 18, 0.13); --line-on-dark: rgba(236, 228, 217, 0.16); }