/* Forside og innhold (Nov 2026): fonts and text styles for the captions on front page images.
 * Loaded by the front page (home-v2.php, only when a caption has its own style) and by admin/forside.
 * Fonts: Google Fonts (SIL Open Font License), latin subset (has æøå), self-hosted in fonts/forside/.
 * The list itself lives in cs_fs_fonts() (cs_forside_helper.php); keep both in step. */

@font-face { font-family: 'FS Archivo'; font-style: normal; font-weight: 100 900; 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: 'FS Bebas Neue'; font-style: normal; font-weight: 400; font-display: swap; src: url("fonts/forside/bebas.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: 'FS Oswald'; font-style: normal; font-weight: 700; font-display: swap; src: url("fonts/forside/oswald.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: 'FS Anton'; font-style: normal; font-weight: 400; font-display: swap; src: url("fonts/forside/anton.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: 'FS Barlow Condensed'; font-style: normal; font-weight: 800; font-display: swap; src: url("fonts/forside/barlow.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: 'FS Teko'; font-style: normal; font-weight: 600; font-display: swap; src: url("fonts/forside/teko.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: 'FS Saira Condensed'; font-style: normal; font-weight: 800; font-display: swap; src: url("fonts/forside/saira.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: 'FS Montserrat'; font-style: normal; font-weight: 800; font-display: swap; src: url("fonts/forside/montserrat.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: 'FS Poppins'; font-style: normal; font-weight: 700; font-display: swap; src: url("fonts/forside/poppins.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: 'FS Russo One'; font-style: normal; font-weight: 400; font-display: swap; src: url("fonts/forside/russo.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: 'FS Bungee'; font-style: normal; font-weight: 400; font-display: swap; src: url("fonts/forside/bungee.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: 'FS Black Ops One'; font-style: normal; font-weight: 400; font-display: swap; src: url("fonts/forside/blackops.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: 'FS Permanent Marker'; font-style: normal; font-weight: 400; font-display: swap; src: url("fonts/forside/marker.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: 'FS Kaushan Script'; font-style: normal; font-weight: 400; font-display: swap; src: url("fonts/forside/kaushan.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: 'FS Playfair Display'; font-style: normal; font-weight: 800; font-display: swap; src: url("fonts/forside/playfair.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; }

/* Captions sized by the image box (container units), so the admin preview and the shop keep the same proportions.
   .cs-cap-box = the image box; .cs-cap-styled = the caption; .cs-cap-t = heading, .cs-cap-s = the small links. */
.cs-cap-box { container-type: inline-size; }
.cs-cap-styled { --cap-scale: 1; --cap-color: #fff; --cap-font: 'FS Archivo', 'Archivo', system-ui, sans-serif; --cap-weight: 800;
  position: absolute; left: 0; right: 0; bottom: 0; top: auto; z-index: 3;
  padding: 13.9cqw 6.3cqw 4.9cqw !important; text-align: left;
  background: linear-gradient(to top, rgba(16, 26, 46, .82), rgba(16, 26, 46, 0)); }
.cs-cap-styled .cs-cap-t { display: block; margin: 0 !important; font-family: var(--cap-font) !important; font-weight: var(--cap-weight) !important;
  font-size: calc(5.9cqw * var(--cap-scale)) !important; line-height: 1.12 !important; letter-spacing: .02em; color: var(--cap-color) !important;
  text-transform: none; overflow-wrap: anywhere; }
.cs-cap-styled.cs-cap--upper .cs-cap-t { text-transform: uppercase; }
.cs-cap-styled .cs-cap-t a { color: inherit !important; text-decoration: none; }
.cs-cap-styled .cs-cap-s, .cs-cap-styled .cs-cap-s a { display: block; margin-top: .3em; font-size: calc(4.5cqw * (0.6 + 0.4 * var(--cap-scale))) !important;
  line-height: 1.3; color: var(--cap-color) !important; opacity: .92; }
.cs-cap-styled .cs-cap-s a { display: inline; text-decoration: underline; }
/* tall category images: bigger base text */
.cs-cap-styled.cs-cap--tile { padding: 16cqw 7cqw 6.5cqw !important; }
.cs-cap-styled.cs-cap--tile .cs-cap-t { font-size: calc(8.6cqw * var(--cap-scale)) !important; }
/* placement */
.cs-cap-styled.cs-cap--bc { text-align: center; }
.cs-cap-styled.cs-cap--tl { top: 0; bottom: auto; padding: 4.9cqw 6.3cqw 13.9cqw !important;
  background: linear-gradient(to bottom, rgba(16, 26, 46, .82), rgba(16, 26, 46, 0)); }
.cs-cap-styled.cs-cap--tile.cs-cap--tl { padding: 6.5cqw 7cqw 16cqw !important; }
.cs-cap-styled.cs-cap--c { top: 0; bottom: 0; display: flex; flex-direction: column; justify-content: center; align-items: center;
  text-align: center; padding: 6cqw !important; background: rgba(16, 26, 46, .38); }
/* background behind the text */
.cs-cap-styled.cs-cap--light { background: linear-gradient(to top, rgba(255, 255, 255, .9), rgba(255, 255, 255, 0)); }
.cs-cap-styled.cs-cap--light.cs-cap--tl { background: linear-gradient(to bottom, rgba(255, 255, 255, .9), rgba(255, 255, 255, 0)); }
.cs-cap-styled.cs-cap--light.cs-cap--c { background: rgba(255, 255, 255, .5); }
.cs-cap-styled.cs-cap--none { background: none; }
.cs-cap-styled.cs-cap--none .cs-cap-t, .cs-cap-styled.cs-cap--none .cs-cap-s { text-shadow: 0 1px 2px rgba(0, 0, 0, .55), 0 0 12px rgba(0, 0, 0, .35); }
.cs-cap-styled.cs-cap--none.cs-cap--ink .cs-cap-t, .cs-cap-styled.cs-cap--none.cs-cap--ink .cs-cap-s { text-shadow: 0 1px 2px rgba(255, 255, 255, .7), 0 0 12px rgba(255, 255, 255, .45); }
.cs-cap-styled .cs-cap-in { display: block; }
.cs-cap-styled.cs-cap--c .cs-cap-in { display: flex; flex-direction: column; align-items: center; }

/* main image (hero): text on the picture; clicks go through to the picture's link */
.cs-cap-styled.cs-cap--hero { pointer-events: none; padding: 13cqw 5cqw 4.5cqw !important; }
.cs-cap-styled.cs-cap--hero.cs-cap--tl { padding: 4.5cqw 5cqw 13cqw !important; }
.cs-cap-styled.cs-cap--hero .cs-cap-t { font-size: calc(5.2cqw * var(--cap-scale)) !important; }
.cs-cap-styled.cs-cap--hero .cs-cap-s { font-size: calc(3.2cqw * (0.6 + 0.4 * var(--cap-scale))) !important; }
/* "Hvitt kort": the main image's own look - white card with a red dot (as .cs-hero__badge) */
.cs-cap-styled.cs-cap--card, .cs-cap-styled.cs-cap--card.cs-cap--tl, .cs-cap-styled.cs-cap--card.cs-cap--c { background: none; padding: 3.1cqw !important; }
.cs-cap-styled.cs-cap--card .cs-cap-in { display: flex; flex-direction: row; align-items: center; gap: 2.7cqw; background: #fff; border-radius: 12px;
  padding: 3.1cqw 4.3cqw; box-shadow: 0 8px 24px rgba(16, 26, 46, .18); text-align: left; }
.cs-cap-styled.cs-cap--card.cs-cap--bc .cs-cap-in, .cs-cap-styled.cs-cap--card.cs-cap--c .cs-cap-in { display: inline-flex; }
.cs-cap-styled.cs-cap--card .cs-cap-in::before { content: ""; flex: none; width: 2cqw; height: 2cqw; min-width: 8px; min-height: 8px; border-radius: 50%; background: #e63a2e; }
.cs-cap-styled.cs-cap--card .cs-cap-t { font-size: calc(2.95cqw * var(--cap-scale)) !important; letter-spacing: 0; text-shadow: none; }
.cs-cap-styled.cs-cap--card .cs-cap-s { font-size: calc(2.56cqw * (0.6 + 0.4 * var(--cap-scale))) !important; margin-top: .15em; color: #5b6472 !important; opacity: 1; text-shadow: none; }
