:root {
  --section-block-padding-l:clamp(6rem, calc(6rem + ((1vw - 0.4rem) * 4.5)), 12rem);
  --section-inline-padding-l: clamp(2.5rem, calc(2.5rem + ((1vw - 0.25rem) * 1.5)), 4rem);
  --section-block-padding-m:clamp(5rem, calc(5rem + ((1vw - 0.32rem) * 4.7801)), 10rem);
  --section-inline-padding-m: clamp(2rem, calc(2rem + ((1vw - 0.3rem) * 1.25)), 3rem);
  --section-block-padding-s:clamp(4rem, calc(4rem + ((1vw - 0.35rem) * 5)), 9rem);
  --section-inline-padding-s: clamp(1.5rem, calc(1.5rem + ((1vw - 0.2rem) * 1.75)), 3.5rem);
  --radius-s: 0.2rem;
  --radius-m: 0.5rem;
  --radius-l: 1rem;
  --border-radius: 10% 30% 50% 70%;
  --p: clamp(1.5rem, 0.096vw + 1.469rem, 1.6rem);
  --h1:clamp(2.5rem, 3.346vw + 1.429rem, 6rem);
  --h2:clamp(2rem, 2.677vw + 1.143rem, 4.8rem);
  --h3:clamp(1.75rem, 1.769vw + 1.184rem, 3.6rem);
  --h4:clamp(1.5rem, 1.434vw + 1.041rem, 3rem);
  --h5:clamp(1.25rem, 1.195vw + 0.868rem, 2.5rem);
  --h6:clamp(1rem, 0.956vw + 0.694rem, 2rem);
  --icon-size-s: clamp(1.5rem, calc(1.5rem + ((1vw - 0.2rem) * 0.25)), 2.1rem);
  --icon-size-m:clamp(1.6rem, calc(1.6rem + ((1vw - 0.25rem) * 0.2)), 2.2rem);
  --space-m:clamp(1.3rem, calc(1.3rem + ((1vw - 0.3rem) * 0.25)), 1.5rem);
  --space-s:clamp(1rem, calc(1rem + ((1vw - 0.3rem) * 0.4717)), 1.5rem);
  --content-gap-s:clamp(1rem, 1.18vw + 0.85rem, 2.5rem);
  --content-gap-m:clamp(3rem, 1.912vw + 2.388rem, 5rem);
  --content-gap-l:content-gap-l: clamp(4.5rem, 3.05vw + 3.1rem, 7.5rem);
  --grid-1: repeat(1,minmax(0,1fr));
  --grid-2: repeat(2,minmax(0,1fr));
  --grid-3: repeat(3,minmax(0,1fr));
  --grid-4: repeat(4,minmax(0,1fr));
  --grid-5: repeat(5,minmax(0,1fr));
  --grid-6: repeat(6,minmax(0,1fr));
  --grid-7: repeat(7,minmax(0,1fr));
  --grid-8: repeat(8,minmax(0,1fr));
  --grid-9: repeat(9,minmax(0,1fr));
  --grid-10: repeat(10,minmax(0,1fr));
  --grid-1-2: 1fr 2fr;
  --grid-1-3: 1fr 3fr;
  --grid-2-1: 2fr 1fr;
  --grid-3-1: 3fr 1fr;
  --grid-mobil:1fr 1fr;
  --button-height: clamp(2.5rem, calc(2.5rem + ((1vw - 0.3rem) * 0.25)), 3.5rem);
  --button-padding-inline: clamp(2.4rem, calc(2.4rem + ((1vw - 0.2rem) * 0.6)), 4.5rem);
  /* Horizontal padding */
  --button-padding-block: clamp(1.6rem, calc(1.6rem + ((1vw - 0.2rem) * 0.4)), 3rem);
  /* Vertical padding */
  --button-font-size: clamp(1.4rem, calc(1.4rem + ((1vw - 0.3rem) * 0.15)), 1.8rem);
  --button-border-radius: clamp(0.5rem, calc(0.5rem + ((1vw - 0.1rem) * 0.2)), 1rem);
  --button-icon-size: clamp(1.2rem, calc(1.2rem + ((1vw - 0.2rem) * 0.2)), 1.8rem);
  --primary: var(--link-color);
  --secondary:hsl(44, 98%, 51%);
  --base: hsl(0, 0%, 6%);
  --card-bg:hsl(0,0%,10%);
  --action:hsl(0,0%,100%);
  --link-color-h: 9;
  --link-color-s: 98%;
  --link-color-l: 50%;
  --link-color-hsl: var(--link-color-h), var(--link-color-s), var(--link-color-l);
  --link-color: hsl(var(--link-color-hsl));
  --link-color-10: hsla(var(--link-color-hsl), .1);
  --link-color-20: hsla(var(--link-color-hsl), .2);
  --link-color-30: hsla(var(--link-color-hsl), .3);
  --link-color-40: hsla(var(--link-color-hsl), .4);
  --link-color-50: hsla(var(--link-color-hsl), .5);
  --link-color-60: hsla(var(--link-color-hsl), .6);
  --link-color-70: hsla(var(--link-color-hsl), .7);
  --link-color-80: hsla(var(--link-color-hsl), .8);
  --link-color-90: hsla(var(--link-color-hsl), .9);
  --link-color-warm: hsl(calc(var(--link-color-h) + 80), var(--link-color-s), var(--link-color-l));
  --link-color-cold: hsl(calc(var(--link-color-h) - 80), var(--link-color-s), var(--link-color-l));
  --link-color-low: hsl(var(--link-color-h), calc(var(--link-color-s) / 2), var(--link-color-l));
  --link-color-lowest: hsl(var(--link-color-h), calc(var(--link-color-s) / 4), var(--link-color-l));
  --link-color-light: hsl(var(--link-color-h), var(--link-color-s), calc(var(--link-color-l) / .9));
  --link-color-dark: hsl(var(--link-color-h), var(--link-color-s), calc(var(--link-color-l) * .9));
}
.button {
  height: var(--button-height);
  padding: var(--button-padding-block) var(--button-padding-inline);
  font-size: var(--button-font-size);
  border-radius: var(--button-border-radius);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background-color: var(--secondary);
  color: var(--action);
}
.button:hover {
  background-color: var(--primary);
}
.button__2 {
  height: var(--button-height);
  padding: var(--button-padding-block) var(--button-padding-inline);
  font-size: var(--button-font-size);
  border-radius: var(--button-border-radius);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background-color: var(--link-color);
  color: white;
}
.button .icon {
  width: var(--button-icon-size);
  height: var(--button-icon-size);
  margin-right: 0.5rem;
}