@import url('https://fonts.googleapis.com/css2?family=Inter:wght@100;200;300;400;500;600;700;800;900&display=swap');
 @import url('https://fonts.googleapis.com/css2?family=Unbounded:wght@200;300;400;500;600;700;800;900&display=swap');







/* Variables */
:root {
  /* Spacing */
  --caseTitle-Desktop: 96px;
  --caseTitle-Tablet: 96px;
  --caseTitle-Mobile: 96px;
  --topSpace-Desktop: 40px;
  --topSpace-Tablet: 40px;
  --topSpace-Mobile: 40px;
  --imageSpace-Desktop: 40px;
  --imageSpace-Tablet: 24px;
  --imageSpace-Mobile: 16px;
  --twoImageSpace-Desktop: 24px;
  --twoImageSpace-Tablet: 24px;
  --twoImageSpace-Mobile: 16px;
  --topSpace-List-Desktop: 0;
  --topSpace-List-Tablet: 0;
  --topSpace-List-Mobile: 0;
  --bottomSpace-Desktop: 16px;
  --bottomSpace-Tablet: 16px;
  --bottomSpace-Mobile: 16px;
  --firstSpace-Desktop: 124px; 
  --firstSpace-Tablet: 124px; 
  --firstSpace-Mobile: 124px; 
  --pSpace-Desktop: 16px;
  --pSpace-Tablet: 16px;
  --pSpace-Mobile: 8px;
  --paddingMedia-Desktop: 64px 16px 64px 16px;
  --paddingMedia-Tablet: 56px 8px 56px 8px;
  --paddingMedia-Mobile: 40px 0 40px 0;
  --paddingMedia-no-p-Desktop: 16px 16px 64px 16px;
  --paddingMedia-no-p-Tablet: 8px 8px 56px 8px;
  --paddingMedia-no-p-Mobile: 8px 0 40px 0;
  
  /* Radius */
  --radius-Desktop: 24px;
  --radius-Tablet: 24px;
  --radius-Mobile: 12px;
  
  /* Font-size */
  --h1-Desktop: 40px;
  --h2-Desktop: 28px;
  --h3-Desktop: 22px;
  --h1-Tablet: 40px;
  --h2-Tablet: 28px;
  --h3-Tablet: 22px;
  --h1-Mobile: 28px;
  --h2-Mobile: 22px;
  --h3-Mobile: 18px;
  --li-Desktop: 16px;
  --li-Tablet: 0;
  --li-Mobile: 0;
  --p-Desktop: 20px;
  --p-Tablet: 19px;
  --p-Mobile: 18px;
  
  /* Media and text blocks */
  --blockWidth-Desktop: 680px;
  --blockWidth-Tablet: 680px;
  --blockWidth-Mobile: 90%;
  --centerPosition: 0 auto;
}