:root {    


    --container-width: 42rem;

    --yellows--lime: #cefc0b;
    --yellows--tobakk: #6f6240;
    
    --neutral--90: #031119;
    --neutral--10: #e3e3e3;
    --neutral--0: #ffffff;

    --reds--pudder: #feeee6;
    --reds--rosa: #ff93d2;
    --reds--pink: #fCC6DF;
    --reds--red: #fa573a;

    --greens--pistasj: #d0d9ba;
    --greens--gress: #a9d740;
    --greens--merk: #D0D9BB;
    --greens--flaskegrønn: #0e3938;
  
    --text--pos: var(--neutral--90);
    --text--neg: var(--neutral--10);
    --text--neg-2: var(--neutral--0);
  
    --border--pos: var(--neutral--90);
  
    --bg--default: var(--reds--pudder);
    --bg--highlight-1: var(--neutral--0);
    --bg--highlight-2: var(--reds--red);
    --bg--highlight-3: var(--reds--rosa);
    --bg--negative: var(--neutral--90);

    --br-s: 1.25rem;

    --spacing-m: 2rem;
    --spacing-s: 1rem;
    --spacing-xs: 0.5rem;
  
  
    --heading-sizes--xl: 3rem;      /* 48px */
    --heading-sizes--l: 2.25rem;    /* 36px */
    --heading-sizes--m: 2.625rem;   /* 42px */
    --heading-sizes--s: clamp(2.25rem, 4vw, 2.5rem);    /* 36px */
    --heading-sizes--xs: 1.5rem;    /* 24px */

    --body-sizes--large: 1.25rem;   /* 20px */
    --body-sizes--medium: 1.125rem; /* 18px */
    --body-sizes--small: 1rem;      /* 16px */

    --line-height--body--l: 1.75rem;   /* 28px */
    --line-height--heading: 90%;
    --line-height--body--m: 1.75rem;   /* 28px */
    --line-height--body--s: 1.3125rem; /* 21px */
    --font-family--display: "bomuldots";
    --font-family--body: "Parabolica";

    --weight--display-weight: 150;
    --weight--body-default: regular;
    --weight--body-medium: medium;
    --weight--body-bold: bold;

}

  @media (min-width: 840px) {:root {

    --spacing-m: 4rem;
    --spacing-s: 2rem;
    --spacing-xs: 1rem;
  
    --heading-sizes--xl: 7.5rem;    /* 120px */
    --heading-sizes--l: 6rem;       /* 96px */
    --heading-sizes--m: 4.5rem;     /* 72px */
    --heading-sizes--s: 3rem;       /* 48px */
    --heading-sizes--xs: 2rem;       /* 32px */
    
    --body-sizes--large: 1.5rem;    /* 24px */
    --body-sizes--medium: 1.375rem; /* 22px */
    --body-sizes--small: 1.125rem;  /* 18px */
    
    --line-height--heading: 90%;
    --line-height--body--l: 2.25rem;   /* 36px */
    --line-height--body--m: 1.75rem;   /* 28px */
    --line-height--body--s: 1.5rem;    /* 24px */

    --weight--display-weight: 150

}
  }


/* Colour vars */

h1, h2, h3, h4, h5, h6 {
  margin-top:0;
  font-weight: 500;
}


body {
  background-color: var(--reds--pudder);
  color: var(--text--pos);
}


/* Heading sizes */
h1 {
  font-size: var(--heading-sizes--l); 
  line-height: var(--line-height--heading);
  font-weight: 500; 
}

h2 {
  font-size: var(--heading-sizes--s); 
  line-height: 1;

}

h2 strong { 
    font-size: var(--heading-sizes--m);
    font-weight: 600; 
    font-family: 'bomuldots', sans-serif;
  }

h3 {
  font-family: 'bomuldots', sans-serif;
  font-size: var(--heading-sizes--xs); 
  line-height: 1;
  font-style: normal;
  font-weight: 150;
  font-size: 48px;
  line-height: 90%;
}

h4 {
  font-size: var(--heading-sizes--xs); 
  line-height: 1;
}



/* Custom dot fonts */
		
@keyframes inflate {
  0% { font-variation-settings: "wght" 100 }
  100% { font-variation-settings: "wght" 200 }
}


.parabolica {
  font-family: 'Parabolica', sans-serif;
}

.dot {
  color: var(--text--pos);
  line-height: 0.75;
  text-wrap: balance;
  font-family: 'bomuldots', sans-serif;
  font-variation-settings: "wght" 150;
  font-weight: 150;

  transition: font-weight 0.1s linear allow-discrete, 
              font-variation-settings 0.1s linear allow-discrete;

}

.toast:hover .dot:not(.dot-link) {
  font-weight: 220;
  font-variation-settings: "wght" 220;
  
  /* try thin hovering */
  font-weight: 80;
  font-variation-settings: "wght" 80;
}

.dot-anim {
  transition: font-variation-settings 0.13s cubic-bezier(0.28, 1.15, 0.88, 0.98);
  transform: translate3d(0, 0, 0);
}

.dot-anim:hover { font-variation-settings: "wght" 100; }

.watermark {
    font-size: clamp(2rem, 20vw, 21.2rem);
    width: 100%;
    max-width: 100%;
    text-wrap: balance;
    line-height: 0.7;
    opacity: 0.1;
    overflow: hidden;
    border-top: 1px solid var(--neutral--90);
    margin: 0;
    padding: var(--spacing-m) 0 0;
}




.menu_tog circle {
  transition: all 0.25s cubic-bezier(0.28, 1.15, 0.88, 0.98) !important;
}

.menu_tog.hidden circle:nth-child(2),
  .menu_tog.hidden circle:nth-child(5) {
    cy: 50%;
    cx: 45%;
  }

.menu_tog.hidden circle:nth-child(1) {
    cy: 24.3335;
    cx: 5;
  }

.menu_tog.hidden circle:nth-child(3) {
    cy: 5;
    cx: 5;
  }

.menu_tog.hidden circle:nth-child(4) {
    cy: 24.3335;
    cx: 24.3335;
  }

.menu_tog.hidden circle:nth-child(6) {
    cy: 5;
    cx: 24.3335;
  }