:root {
		--primary: #409f00; /* green */
		--primary-dark: #006838; /* dark green */
		--background: #fff;
		--accent: #e4007c; /* pink */
		--text: #666;
		--text-light: #888;
		--border-radius: 4px;
}
* {
		box-sizing: border-box;
		margin: 0;
		padding: 0;
}

body {        	
	margin: 0 auto;        	
	font-family: "Century Gothic", "Lucida Grande", Verdana, Tahoma, Century, sans-serif;
	font-weight: normal;
	color: var(--text);
	line-height: 1.5;
}

section { max-width: 80ch; margin: 0 auto; padding: 2rem 2rem;}

img {
	margin-bottom: 2rem;
	width: 60ch;
	max-width: 100%;					
}

a { color: var(--primary);}

h2, h3 {
	margin: 0;
}

/* Services Section */

.service {
	color: var(--text-light);
	font-size: 0.9rem;        	
	gap: 4rem;
	padding-block: 2rem;
	border-bottom: 1px solid #ddd;
}

.service p {
	margin-top: 1rem;
}

.service:last-of-type {
	border-bottom: none;
}

.service__header {        	
	display: flex;
	align-items: baseline;
	justify-content: space-between;
}

.service__title {
	font-size: 1.25rem;
	margin-bottom: 0.65rem;
	color: var(--text);
}

.service__price {
	color: var(--text);
	font-size: 1rem;
	font-family: monospace;
	text-align: right;
}

.service__price small { color: #999; }

.service__description {
	max-width: 60ch;
}

.service__best-for {
	margin-top: 0;
}

.service__best-for::before {
	content: "Best for: ";
	font-weight: bold;					
}

/* Contact Form */

form {
	margin-top: 2rem;
	display: flex;
	flex-direction: column;
}

form label {
	text-transform: uppercase;
	display: flex;
	gap: 1rem;
	align-items: center;
	margin-bottom: 1rem;
}

input[type="text"], input[type="email"] {
	padding: 0.5rem 1rem;
	font-size: 1rem;
	font-family: "Century Gothic", "Lucida Grande", Verdana, Tahoma, Century, sans-serif;					
	border: 1px solid var(--text);
	border-radius: var(--border-radius);
	width: 100%;
}

textarea {
	min-height: 20ch;
	max-width: 100%;
	min-width: auto;
	padding: 1rem;
	font-size: 1rem;
	margin-bottom: 2rem;
	font-family: "Century Gothic", "Lucida Grande", Verdana, Tahoma, Century, sans-serif;
	border: 1px solid var(--text);
	border-radius: var(--border-radius);
}

button[type="submit"] {
	background-color: var(--primary-dark);
	padding: 0.5rem 1rem;
	color: white;
	text-align: center;
	font-size: 1rem;
	border-radius: var(--border-radius);
	line-height: 1.5;
	transition: all 0.25s ease-in; 
}

button[type="submit"]:hover {
	background-color: #254119;
	cursor: pointer;
}
