/*
  1. Use a more-intuitive box-sizing model.
*/
*, *::before, *::after {
	box-sizing: border-box;
  }
  /*
	2. Remove default margin
  */
  * {
	margin: 0;
	padding: 0;
	font: inherit;
  }
  /*
	Typographic tweaks!
	3. Add accessible line-height
	4. Improve text rendering
  */
  body {
	text-rendering: optimizeSpeed;
	line-height: 1.5;
	-webkit-font-smoothing: antialiased;
  }
  /*
	5. Improve media defaults
  */
  img, picture, video, canvas, svg {
	display: block;
	max-width: 100%;
  }
  /*
	6. Remove built-in form typography styles
  */
  input, button, textarea, select {
	font: inherit;
  }


  /* Chrome, Safari, Edge, Opera */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

html{
	scroll-behavior: smooth;
}

/* Firefox */
input[type=number] {
  -moz-appearance: textfield;
}


  /*
	7. Avoid text overflows
  */
  p, h1, h2, h3, h4, h5, h6 {
	overflow-wrap: break-word;
  }
  /*
	8. Create a root stacking context
  */
  #root, #__next {
	isolation: isolate;
  }


button{
	all: unset;
}

/* font */

.normal {
	font-weight: 400; /* Normal */
}

.bold {
	font-weight: 700; /* Bold */
}

.semibold {
	font-weight: 600; /* semibold */
}
  
.medium {
font-weight: 500; /* Medium */
}

.gold {
	background: var(--luxe-gold, linear-gradient(121deg, #7D4702 -1.51%, #FDD265 57.83%, #683E08 102.06%));
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent; /* Prefer background-clip text over legacy -webkit-text-fill-color */
	display: inline; /* Keep gradient clipped to text glyph bounds */
}

.gold2 {
	background: var(--luxe-gold, linear-gradient(161deg, #7D4702 -1.51%, #FDD265 57.83%, #683E08 102.06%));
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent; /* Prefer background-clip text over legacy -webkit-text-fill-color */
	display: inline; /* Keep gradient clipped to text glyph bounds */
}

.gold3 {
	background: var(--luxe-gold, linear-gradient(161deg, #7D4702 -70.51%, #FDD265 57.83%, #683E08 160.06%));
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent; /* Prefer background-clip text over legacy -webkit-text-fill-color */
	display: inline; /* Keep gradient clipped to text glyph bounds */
}

.grey-text{
	color: #636366;
}

/* Remove all animations, transitions and smooth scroll for people that prefer not to see them */
@media (prefers-reduced-motion: reduce) {
	html:focus-within {
	  scroll-behavior: auto;
	}
  
	*,
	*::before,
	*::after {
	  animation-duration: 0.01ms !important;
	  animation-iteration-count: 1 !important;
	  transition-duration: 0.01ms !important;
	  scroll-behavior: auto !important;
	}
  }
/*color*/

:root {
	--almost-black: #1D1D1F;
	--almost-white: #fefefe;
	--black-grey: rgba(29, 29, 31, 0.79);
	--blue-apple-text: #0271E3;
	--light-grey-transparent: rgba(118, 118, 128, 0.15);;
	--input-area-shadow: 0px 25px 50px -12px rgba(0, 0, 0, 0.25);

	/*font size*/
	/*12, 13, 14, 15, 16 px*/
	--fs-200: 0.75rem; 
	--fs-300: 0.8125rem; 
	--fs-400: 0.875rem;
	--fs-500: 0.9375rem;
	--fs-600: 1rem;
	--fs-625: 1.3rem;
	/*25 px*/
	--fs-650: 1.5625rem;

	/*30, 40, 56 px*/
	--fs-700: 1.975rem;
	--fs-800: 2.5rem;
	--fs-900: 3.5rem;

	/*custom 70px*/
	--fs-1000: 4.5rem;

	--fs-80: 80px;

	/*size space*/
	--size-100: 0.25rem;
	--size-200: 0.5rem;
	--size-300: 0.75rem;
	--size-400: 1rem;
	--size-500: 1.5rem;
	--size-600: 2rem;
	--size-700: 3rem;
	--size-800: 4rem;
	--size-900: 5rem;
	--size-1000: 6rem;

}

/*responsive*/

@media (max-width: 50em) {
	:root {
		/*font size*/
		/*12, 13, 14, 15, 16 px*/
		--fs-300: 0.75rem; 
		--fs-400: 0.8125rem; 
		--fs-500: 0.875rem;
		--fs-600: 0.9375rem;
		--fs-625: 1.1rem;
		--fs-650: 1.3rem;
		--fs-700: 1.5rem;
		--fs-800: 1.5rem;
		/*30, 40, 56 px*/
		--fs-900: 1.875rem;


		--fs-80: 64px;

		--fs-1000: 3rem;
		/*--fs-1000: 3.5rem;*/
		/*custom 70px*/
		--fs-1100: 4.5rem;

		/*size space*/
		--size-200: 0.25rem;
		--size-300: 0.5rem;
		--size-400: 0.75rem;
		--size-500: 1rem;
		--size-600: 1.5rem;
		--size-700: 2rem;
		--size-800: 3rem;
		--size-900: 4rem;
		--size-1000: 5rem;
	}

	.none-on-mobile{
		display: none;
	}
  }