:root {
	  /* Colors */
	  --bitcoin-orange: #b90303;
	  --soft-orange: #ffe9d5;
	  --secondary-blue: #1a9af7;
	  --soft-blue: #e7f5ff;
	  --warm-black: #282623;
	  --black: #201e1c;
	  --off-white: #faf8f7;
	  --just-white: #fff;
	  --grey: #bababa;
	}
	* {
	  box-sizing: border-box;
	  margin: 0;
	  padding: 0;
	}
	html {
	  font-size: 62.5%;
	  font-family: "DM Sans", sans-serif;
	  background-color: rgb(99, 105, 97);
	}
	header {
	  position: relative;
	  display: flex;
	  flex-direction: column;
	  justify-content: center;
	  width: 100%;
	  min-width: 320px;
	  height: fit-content;
	  text-align: center;
	  background: linear-gradient(
	    208.83deg,
	    var(--black) 16.69%,
	    var(--bitcoin-orange) 100%
	  );
	}
	header img {
	  width: auto;
	  height: auto;
	  margin-top: 60px;
	  align-self: center;
	}
	.header--title-container {
	  width: 90%;
	  min-width: 288px;
	  max-width: 900px;
	  height: 158px;
	  margin-top: 20px;
	  text-align: center;
	  align-self: center;
	}
	

	.header--title-container h1 {
	  font-size: 2.4rem;
	  font-weight: bold;
	  line-height: 2.6rem;
	  color: var(--just-white);
	}
	.header--title-container h2 {
	  margin-top: 25px;
	  font-size: 1.4rem;
	  font-weight: 500;
	  line-height: 1.8rem;
	  color: var(--soft-orange);
	}
	.header--title-container h4 {
		margin-top: 25px;
		font-size: 1rem;
		font-weight: 500;
		line-height: 1.8rem;
		color: var(--soft-orange);
	}
	.main-product-detail {
	  position: relative;
	  width: 100%;
	  min-width: 320px;
	  height: auto;
	  margin-top: 50px;
	  padding: 20px 10px;
	  border: 50px solid #f709097c;
	  background-color: rgb(255, 123, 0);
	}
	.product-detail--title {
	  width: 90%;
	  min-width: 288px;
	  height: auto;
	  margin: 0 auto;
	  margin-top: 50px;
	  text-align: center;
	}
	.product-detail--title h2 {
	  margin-bottom: 20px;
	  font-size: 2.4rem;
	  font-weight: bold;
	  line-height: 2.6rem;
	  color: var(--black);
	}
	.product-detail--title p {
	  margin-bottom: 20px;
	  font-size: 1.4rem;
	  font-weight: 500;
	  line-height: 1.8rem;
	  color: var(--warm-black);
	}
	.product-detail--card {
	  width: 80%;
	  min-width: 170px;
	  max-width: 230px;
	  height: 152px;
	  margin: 65px;
	  padding: 15px;
	  background-color: var(--warm-black);
	  box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.16);
	  border-radius: 4px;
	}
	.product-detail--card .clock {
	  display: inline-block;
	  width: 20px;
	  height: 20px;
	  margin: 0 auto;
	  margin-bottom: 10px;
	  background-size: cover;
	  background-position: center;
	  background-repeat: no-repeat;
	}
	.product-detail--card img {
		width: 100px;
		height: auto;
		margin: 0 auto;
		margin-bottom: 10px;
		background-size: cover;
		background-position: center;
		background-repeat: no-repeat;
	  }
	.product-detail--card .eye {
	  display: inline-block;
	  width: 20px;
	  height: 20px;
	  margin-right: 200px;
	  margin: 0 auto;
	  margin-bottom: 10px;
	  background-size: cover;
	  background-position: center;
	  background-repeat: no-repeat;
	}
	.product-detail--card .dollar {
	  display: inline-block;
	  width: 20px;
	  height: 20px;
	  margin: 0 auto;
	  margin-bottom: 10px;
	  background-size: cover;
	  background-position: center;
	  background-repeat: no-repeat;
	}
	.product-detail--card .check {
	  display: inline-block;
	  width: 20px;
	  height: 20px;
	  margin: 0 auto;
	  margin-bottom: 10px;
	  background-size: cover;
	  background-position: center;
	  background-repeat: no-repeat;
	}
	.product--card_title {
	  margin-bottom: 15px;
	  font-size: 1.8rem;
	  font-weight: bold;
	  line-height: 1.8rem;
	  color: var(--just-white);
	}

	.product--card_body {
	  font-size: 1.4rem;
	  font-weight: 500;
	  line-height: 1.8rem;
	  color: #08f81c;
	}
	.bitcoin-img-container {
	  width: 100%;
	  min-width: 320px;
	  height: 50px;
	  margin-top: 30px;
	  background-repeat: no-repeat;
	  background-position: center;
	  background-size: cover;
	  text-align: center;
	}
	.bitcoin-img-container h2 {
	  padding-top: 40px;
	  font-size: 2.4rem;
	  font-weight: bold;
	  line-height: 2.6rem;
	  color: var(--just-white);
	}
	.main-plans-container {
	  width: 100%;
	  min-height: 220px;
	  padding-bottom: 70px;
	  text-align: center;
	}
	.main-plans-container h2 {
	  padding-top: 50px;
	  font-size: 2.4rem;
	  font-weight: bold;
	  line-height: 2.6rem;
	  color: var(--black);
	}
	.main-plans-container p {
	  padding-top: 30px;
	  font-size: 1.4rem;
	  font-weight: 500;
	  line-height: 1.8rem;
	  color: #757575;
	}
	.plans-container--slider {
	  display: flex;
	  /* gap: 50px; Aun no está soportado por todos los navegadores :( */
	  height: 316px;
	  margin-top: 0px;
	  overflow-x: scroll;
	  overscroll-behavior-x: contain;
	  scroll-snap-type: x proximity;
	}
	.plans-container--card {
	  position: relative;
	  scroll-snap-align: start;
	  left: 20%;
	  width: 70%;
	  min-width: 150px;
	  max-width: 300px;
	  height: 250px;
	  margin: 50px 30px 0;
	  padding: 0 0px;
	  background-color: rgb(255, 123, 0);
	  border-radius: 15px;
	  box-shadow: 0px 4px 8px rgba(89, 73, 30, 0.16);
	}
	.plans-container--card img{
		position: relative;
		scroll-snap-align: center;
		width: 70%;
		min-width: 150px;
		max-width: 200px;
		height: auto;
		margin: 30px 0px 0;
		padding: 0 15px;
		border-radius: 5px;
		box-shadow: 0px 4px 8px rgba(89, 73, 30, 0.16);
	  }
	.plans-container--card .recommended {
	  position: absolute;
	  width: 120px;
	  height: 31px;
	  left: calc(50% - 60px);
	  top: -15px;
	  margin: 0;
	  padding: 6px;
	  background-color: var(--bitcoin-orange);
	  border-radius: 8px;
	  color: var(--just-white);
	}
	.plan-card--title {
	  padding-top: 30px;
	  font-size: 1.1rem;
	  font-weight: 500;
	  line-height: 1.8rem;
	  color: black;
	}
	.plans-container--card .plan-card--price {
	  padding: 0px 0px;
	  font-size: 1.4rem;
	  font-weight: bold;
	  line-height: 6.3rem;
	  color: black;
	}
	.plans-container--card .plan-card--saving {
	  padding-top: 0;
	}
	.plan-card--ca {
	  width: 151px;
	  height: 48px;
	  margin-top: 20px;
	  background: var(--off-white);
	  border: 2px solid var(--bitcoin-orange);
	  border-radius: 4px;
	  font-size: 1.4rem;
	  font-weight: bold;
	  line-height: 1.8rem;
	  color: var(--black);
	}
	.plan-card--ca span {
	  display: inline-block;
	  width: 20px;
	  height: 20px;
	  background-image: url("../assets/icons/orange-right-arrow.svg");
	  vertical-align: text-bottom;
	}
	footer {
	  display: flex;
	  width: 100%;
	  height: 250px;
	  background-color: var(--bitcoin-orange);
	}
	footer section {
	  display: flex;
	  justify-content: center;
	  align-items: center;
	  width: 100%;
	}
	.left ul {
	  font-size: 1.2rem;
	  font-weight: 500;
	  line-height: 1.8rem;
	  list-style: none;
	  text-align: center;
	}
	.left li {
	  margin: 10px 0;
	}
	.left a {
	  text-decoration: none;
	  color: #ee9d05;
	}