/* * Kirkepakka — main.css (ETT tema, fem akser) * ============================================================ * TILPASNINGSSYSTEM. Alle farger/fonter/radier er CSS custom properties * som redefineres per attributt paa . INGEN hardkodede farger i * komponent-CSS. * * FEM ORTOGONALE AKSER (B7-beslutning 2026-08-25, fase 10b): * data-mode lys | moerk * data-farge 12 kuraterte paletter — eller «egen» (fri farge, avledet * server-side med garantert AA; se inc/farge.php) * data-fontpar 9 self-hostede fontpar (kategorinavn, aldri fontnavn i UI) * data-form skarp | myk | rund (radius-skala) * data-uttrykk rolig | markant | varm — SIGNATUREN: grunnflater, skygge- * stil, hero-form, typografi-tone. Ikke farge, ikke font. * * `data-uttrykk="rolig"` er standard og roerer ingenting (basislaget under * ER rolig). Fram til 2026-08 het aksen `data-profil` og bar OGSAA farge og * fonter — de er nå egne akser, slik at enhver kombinasjon er mulig. * * Attributtene settes server-side av temaet (kp_profile_attrs()), ikke av * localStorage — kirken velger utseende via konfigurasjon. * Fonter self-hostet (WOFF2 i assets/fonts/) — ingen Google Fonts-kall * (ytelse + GDPR). De fleste er variable: ett woff2 per subset dekker hele * vektspennet (font-weight-range). * ============================================================ */ /* —— Self-hostede fonter (variable, latin + latin-ext) —— */ @font-face{font-family:'Bricolage Grotesque';font-style:normal;font-weight:700 800;font-display:swap;src:url(../fonts/bricolage-grotesque-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;} @font-face{font-family:'Bricolage Grotesque';font-style:normal;font-weight:700 800;font-display:swap;src:url(../fonts/bricolage-grotesque-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;} @font-face{font-family:'Figtree';font-style:normal;font-weight:400 700;font-display:swap;src:url(../fonts/figtree-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;} @font-face{font-family:'Figtree';font-style:normal;font-weight:400 700;font-display:swap;src:url(../fonts/figtree-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;} /* —— Fontpar «massiv» og «lun» (latin-subset dekker norsk æøå) —— massiv: Archivo Black (display, statisk sort-master → vidt vektspenn hindrer syntetisk bold) + Archivo (body, variabel). lun: Fraunces (display, variabel serif) + Karla (body, variabel). Én woff2 per familie, self-hostet (ingen Google Fonts-kall). */ @font-face{font-family:'Archivo Black';font-style:normal;font-weight:400 900;font-display:swap;src:url(../fonts/archivo-black-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;} @font-face{font-family:'Archivo';font-style:normal;font-weight:400 700;font-display:swap;src:url(../fonts/archivo-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;} @font-face{font-family:'Fraunces';font-style:normal;font-weight:400 700;font-display:swap;src:url(../fonts/fraunces-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;} @font-face{font-family:'Karla';font-style:normal;font-weight:400 700;font-display:swap;src:url(../fonts/karla-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;} /* —— Oevrige fontpar (self-hostet; kun lastet naar valgt) —— Ett latin-subset woff2 per familie (æøå dekket av U+0000-00FF); variable der mulig, statiske display-familier (Anton/Bebas Neue) og Barlow 400/700. Ingen Google Fonts-kall. Par: sonisk=Sora/Inter · kinetisk=Chivo/Manrope · plakat=Anton/Inter · smal=Bebas Neue/Barlow · roleg=Newsreader/Mulish · naer=Bitter/Source Sans 3. */ @font-face{font-family:'Sora';font-style:normal;font-weight:400 800;font-display:swap;src:url(../fonts/sora-latin.woff2) format('woff2')} @font-face{font-family:'Inter';font-style:normal;font-weight:400 700;font-display:swap;src:url(../fonts/inter-latin.woff2) format('woff2')} @font-face{font-family:'Chivo';font-style:normal;font-weight:400 900;font-display:swap;src:url(../fonts/chivo-latin.woff2) format('woff2')} @font-face{font-family:'Manrope';font-style:normal;font-weight:400 800;font-display:swap;src:url(../fonts/manrope-latin.woff2) format('woff2')} @font-face{font-family:'Anton';font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/anton-latin.woff2) format('woff2')} @font-face{font-family:'Bebas Neue';font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/bebas-neue-latin.woff2) format('woff2')} @font-face{font-family:'Barlow';font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/barlow-400-latin.woff2) format('woff2')} @font-face{font-family:'Barlow';font-style:normal;font-weight:700;font-display:swap;src:url(../fonts/barlow-700-latin.woff2) format('woff2')} @font-face{font-family:'Newsreader';font-style:normal;font-weight:400 600;font-display:swap;src:url(../fonts/newsreader-latin.woff2) format('woff2')} @font-face{font-family:'Mulish';font-style:normal;font-weight:400 700;font-display:swap;src:url(../fonts/mulish-latin.woff2) format('woff2')} @font-face{font-family:'Bitter';font-style:normal;font-weight:400 700;font-display:swap;src:url(../fonts/bitter-latin.woff2) format('woff2')} @font-face{font-family:'Source Sans 3';font-style:normal;font-weight:400 700;font-display:swap;src:url(../fonts/source-sans-3-latin.woff2) format('woff2')} /* ============================================================ TOKEN-ARKITEKTUR ============================================================ */ :root{ /* Spacing (8px-grid) */ --s-1:8px;--s-2:16px;--s-3:24px;--s-4:40px;--s-5:64px;--s-6:104px; /* Motion */ --ease-out:cubic-bezier(0.16,1,0.3,1); --ease-smooth:cubic-bezier(0.25,0.46,0.45,0.94); --dur-fast:150ms;--dur-normal:250ms;--dur-slow:450ms; /* Finish (fase 9b) — elevasjon/heving/gloed. Profil-uavhengig standard; data-mode setter skygge-styrken, profil-lagene (Frimodig/Bygd) redefinerer signaturen (hard offset vs. myk lagvis). --signal-rgb/--shadow-rgb loeses ved bruk (satt i modus-lagene). */ --kp-lift:translateY(-3px); /* kort-heving ved hover */ --kp-btn-lift:translateY(-1px); /* knapp-heving ved hover */ --kp-skygge:transparent; /* solid offset-skygge (kun Frimodig) */ --kp-signal-glow:0 12px 34px rgba(var(--signal-rgb),.32); /* Fonter — default = «grotesk» (Bricolage Grotesque + Figtree). data-fontpar redefinerer. */ --font-display:'Bricolage Grotesque',system-ui,sans-serif; --font-body:'Figtree',system-ui,sans-serif; /* Form/radius — default = «myk». data-form redefinerer. */ --radius-kort:16px;--radius-knapp:10px;--radius-bilde:16px;--radius-felt:6px; /* Media-tokens — foto-oeyer (hero, foto-scrim). Alltid moerke i BEGGE moduser. */ --media-ink:#F4F2EC; --media-ink-dim:#D3D2D8; --media-ink-rgb:244,242,236; --media-line:rgba(244,242,236,.20); --media-floor:#101014; --media-floor-rgb:16,16,20; --scrim-rgb:10,10,13; /* —— TONE-SETT (fase 10c) — det AVLEDEDE temasettet en seksjon kan velge fra. Dette er de NØYAKTIG SAMME verdiene som modus-lagene under bruker (og som kp_akse_flater() i inc/akser.php er sannhetskilde for) — bare navngitt, slik at [data-tone] kan plukke lys- eller moerk-settet uavhengig av sidens modus. Derfor er en tone-flippet seksjon AA-trygg by construction: den bruker et token-sett som allerede er validert mot alle 12 palettene, og fri-farge- motoren loeser accent-deep mot verst_lys OG accent-bright mot verst_mork ved hver lagring — begge polariteter finnes alltid. Verdiene under er «rolig»; markant/varm redefinerer i sine egne lag. */ --t-lys-bg:#F4F1EA;--t-lys-surface:#FBF9F4;--t-lys-surface-2:#E7E2D6; --t-lys-text:#201E24;--t-lys-text-dim:#56545C; --t-lys-text-rgb:32,30,36;--t-lys-bg-rgb:244,241,234;--t-lys-shadow-rgb:60,50,40; --t-lys-line:rgba(32,30,36,.16);--t-lys-skygge:#201E24; --t-mork-bg:#101014;--t-mork-surface:#1A1B21;--t-mork-surface-2:#22232B; --t-mork-text:#F4F2EC;--t-mork-text-dim:#A8A8B0; --t-mork-text-rgb:244,242,236;--t-mork-bg-rgb:16,16,20;--t-mork-shadow-rgb:0,0,0; --t-mork-line:rgba(244,242,236,.14);--t-mork-skygge:#F4F2EC; } /* ============================================================ AKSE 2: FARGE (data-farge) — 12 kuraterte paletter, globale ============================================================ Modus-uavhengige aksentfamilier. Paletten eier BARE fargen; grunnflater og signatur bor i uttrykk-aksen. Alle 12 er tilgjengelige uansett uttrykk (foer 10b var 4 av dem laast til hver profil). bright = uttrykket paa MOERK flate (moerk modus + hero/nyhetsbrev-oeyer) deep = uttrykket paa LYS flate — MAA vaere tekstsikkert (>=4.5:1) AA-maalt i design-loopen (fase 8b/9b). «egen» (fri farge) settes ikke her: den avledes server-side og skrives som inline