/* ============================================================
   LADEUNIVERSET — DESIGNSYSTEM v5.0  "Signal"
   Én skrift. Kølig-neutral base. Tre farver der betyder noget:
     grøn   = sitet   (knapper, links, aktivt punkt, mørk flade)
     orange = dig     (profil, dine valg, dit punkt i data)
     grå    = verden  (alt du ikke har valgt)
   Dertil fem trykfarver til omkostningsled og en prisskala.
   Er noget farvet og passer ikke i en af kasserne, er det en fejl.
   Hjørner: 8 på kort, 6 på knapper, 0 på bjælker. Ingen skygger
   på det der ligger; skygge kun på det der svæver.
   ============================================================ */
:root{
  /* --- Skrift: én familie, tre vægte (400 / 500 / 700) --- */
  --f-sans:  'Schibsted Grotesk','Helvetica Neue',Arial,sans-serif;
  --f-serif: var(--f-sans);                      /* gammelt navn — peger på samme skrift */
  --f-mono:  'IBM Plex Mono','SFMono-Regular',Consolas,monospace;   /* kun kildelinjer og datoer */

  /* --- Flader: kølig-neutral --- */
  --hvid:      #ffffff;
  --papir:     #f6f6f4;      /* sidens bund                 */
  --flade:     #ededea;      /* nedtonet felt, tabelhoved   */
  --flade-2:   #dedeD9;      /* tom bjælke, måler           */
  --moerk:     #0f3f31;      /* den mørke sektion           */
  --moerk-2:   #154a3a;      /* felt på mørk flade          */

  /* --- Tekst --- */
  --text-1:    #151716;
  --text-2:    #4b4f4d;
  --text-3:    #686c6a;
  --text-lys:  #eef0ec;
  --text-lys-2:#b2c2ba;

  /* --- Grøn = sitet --- */
  --accent:      #0f5c45;
  --accent-ink:  #0b4634;
  --accent-flad: #e3ede8;

  /* --- Orange = dig --- */
  --dig:        #e8641b;
  --dig-ink:    #b04708;
  --dig-flad:   #fbeadf;
  --dig-lys:    #ff9a5c;     /* på mørk flade */

  /* --- Betydningsfarver --- */
  --pos:     #3f7a4a;  --pos-ink:  #2f5f39;  --pos-flad: #e4ede4;
  --warn:    #c9952f;  --warn-ink: #8a5f10;  --warn-flad:#f7efdc;
  --neg:     #b0432f;  --neg-ink:  #8d3324;  --neg-flad: #f6e4e0;

  /* --- Trykfarver: kun til omkostningsled --- */
  --d1:#3b6ea5; --d2:#4f7d3a; --d3:#c08a2e; --d4:#7a5c9e; --d5:#b8563f; --d6:#3e8a8a;
  --seg-opret: var(--d1);
  --seg-serv:  var(--d4);
  --seg-elaft: var(--d3);
  --seg-hjem:  var(--d2);
  --seg-ude:   var(--d6);

  /* --- Prisskala: billig → dyr --- */
  --pris-lav:  #3f7a4a;
  --pris-mid:  #c9952f;
  --pris-hoej: #b0432f;

  /* --- Linjer og felter --- */
  --line:       rgba(21,23,22,.14);
  --line-soft:  rgba(21,23,22,.08);
  --line-lys:   rgba(238,240,236,.16);
  --chip-bg:    rgba(21,23,22,.04);

  --panel:      var(--hvid);
  --panel-2:    var(--flade);
  --panel-3:    var(--flade-2);
  --panel-line: var(--line);
  --panel-shadow: none;
  --card-bg:     var(--hvid);
  --card-bg-hi:  var(--hvid);
  --card-line:   var(--line);
  --card-shadow: none;

  --num:     var(--text-1);
  --btn-bg:  var(--accent);
  --btn-ink: #ffffff;
  --glow:    transparent;

  --glass:        var(--hvid);
  --glass-strong: var(--hvid);
  --glass-line:   var(--line);
  --glass-line-2: var(--line-soft);
  --ink:      var(--text-1);
  --ink-soft: var(--text-2);
  --ink-mute: var(--text-3);
  --ink-dark: var(--text-1);
  --void:     var(--papir);
  --deep:     var(--papir);
  --surface:  var(--flade);

  /* --- Radius: 8 på kort, 6 på knapper, 0 på bjælker --- */
  --r-sm: 4px; --r-md: 6px; --r-lg: 8px; --r-xl: 10px; --r-pill: 999px;
  --maxw: 1180px;
  --nav-h: 60px; --nav-h-sm: 52px;

  --sh-1: none;
  --sh-2: 0 12px 32px -18px rgba(21,23,22,.32);   /* kun det der svæver */
  --sh-glow: none;

  /* --- Bevægelse: tal tæller, rækker bytter plads, orange fylder på --- */
  --ease-out: cubic-bezier(.22,1,.36,1);
  --ease-io:  cubic-bezier(.65,0,.35,1);
  --ease-spring: cubic-bezier(.34,1.3,.5,1);
  --t-fast: .14s; --t-med: .26s; --t-slow: .5s;

  --z-bg: 0; --z-content: 1; --z-nav: 40; --z-overlay: 60;

  /* --- Gamle navne --- */
  --arc: var(--d1); --volt: var(--d1); --charge: var(--pos); --amber: var(--d3);
  --hot: var(--neg); --violet: var(--d4); --g-energy: none; --g-volt: var(--accent);
  --paper: var(--hvid); --paper-2: var(--hvid); --ink-dark-soft: var(--text-2);
  --surface-2: var(--flade-2); --surface-3: var(--flade-2);
}
.on-light,.sect--light{}
