:root {
	/* Colours */
	--clr-primary: hsl(190 88% 35% / 100%);
	--clr-secondary: hsl(227 99% 32% / 100%);
	--clr-accent: hsl(56 96% 53% / 100%);

	--clr-primay-tint: hsl(190 88% 45% / 100%);
	--clr-primay-tint-900: hsl(190 88% 45% / 10%);

	--clr-secondary-tint-500: hsl(227, 61%, 56%);
	--clr-secondary-tint-900: hsl(227, 72%, 49%);

	--clr-white: hsl(0 0% 100% / 100%);
	--clr-black: hsl(0 0% 0% / 100%);
	--clr-neutral-100: hsl(0 0% 90% / 100%);
	--clr-neutral-200: hsl(0 0% 80% / 100%);
	--clr-neutral-300: hsl(0 0% 70% / 100%);
	--clr-neutral-400: hsl(0 0% 60% / 100%);
	--clr-neutral-500: hsl(0 0% 50% / 100%);
	--clr-neutral-600: hsl(0 0% 40% / 100%);
	--clr-neutral-700: hsl(0 0% 30% / 100%);
	--clr-neutral-800: hsl(0 0% 20% / 100%);
	--clr-neutral-900: hsl(0 0% 10% / 100%);	

	/* Font Size */
	--fs-100: 0.5rem;
	--fs-150: 0.75rem;
	--fs-200: 0.9375rem;
	--fs-300: 1rem;
	--fs-400: 1.0625rem;
	--fs-500: 1.1875rem;
	--fs-600: 1.5rem;
	--fs-700: 1.625rem;
	--fs-750: 1.825rem;
	--fs-800: 2.1875rem;
	--fs-900: 2.4375rem;
	--fs-1000: 4.0625rem;

	/* Font Weight */
	--fw-thin: 100;
	--fw-light: 300;
	--fw-regular: 400;
	--fw-medium: 500;
	--fw-semi-bold: 600;
	--fw-bold: 700;
	--fw-extra-bold: 800;
	--fw-black: 900;
}

* {
	margin: 0;
	padding: 0;
	scroll-behavior: smooth;
	font-family: 'Roboto', sans-serif;
	text-align: center;
}

/* Utility Classes */
.wrapper-master {
	margin: 0 auto;
	width: min(100%, 68.75rem);
}

.wrapper-master-text {
	margin: 0 auto;
	width: min(100%, 56.25rem);
}

.mobile-padding {
	padding: 0 1rem;
}

h1, h2, h3, h4, h5, h6 {
	font-family: 'Poppins', sans-serif;
}

button {
	font-family: 'Poppins', sans-serif;
}



/* Reveal on scroll utility classes */
.reveal {
	transform: translateY(80px);
	opacity: 0;
	transition: all 1200ms ease;
}

.reveal.revealActive {
	transform: translateY(0);
	opacity: 1;
}

.reveal .img-accent.left {
	transform: translate(80px, 80px);
	opacity: 0;
	transition: all 2000ms ease;
}

.reveal .img-accent.right {
	transform: translate(-80px, 80px);
	opacity: 0;
	transition: all 2000ms ease;
}

.reveal.revealActive .img-accent.left,
.reveal.revealActive .img-accent.right {
	transform: translate(0);
	opacity: 1;
}




/* Headings */
h1 {
	font-size: var(--fs-900);
	color: var(--clr-white);
}

h2 {
	margin-bottom: 0.5rem;
	font-size: var(--fs-800);
	color: var(--clr-secondary);
}

h3 {
	font-size: var(--fs-500);
	color: var(--clr-secondary);
}


/* Paragraphs */
.para-callout {
	margin-bottom: 1rem;
	font-size: var(--fs-600);
	font-weight: var(--fw-semi-bold);
	line-height: 2.5rem;
	color: var(--clr-neutral-500);
}


/* Navigation */
.nav-section {
	margin: 0;
	padding: 1rem 0;
	display: flex;
	justify-content: center;
	position: fixed;
	z-index: 1000;
	width: 100%;
	background-color: var(--clr-white);
	border-bottom: 1px solid var(--clr-neutral-100);
}

.nav-wrapper {
	display: flex;
	align-items: center;
	width: min(100%, 87.5rem);
	padding: 0 1rem;
}

.nav-wrapper .logo {
	width: min(100%, 19rem);
	margin-right: 2rem;
	position: relative;
	bottom: 0.25rem;
}

.mobile-nav-toggle2 {
	display: none;
}

.mobile-nav-toggle2 svg.hamburger {
	fill: var(--clr-primay-tint);
}

nav {
	display: flex;
	width: 100%;
}

.primary-navigation {
	width: 100%;
	display: flex;
	justify-content: space-between;
	align-items: center;
	font-size: var(--fs-500);
	font-weight: var(--fw-bold);
	color: var(--clr-secondary);
}

.nav-right {
	display: flex;
	font-size: var(--fs-200)
}

ul.nav-list {
	display: flex;
}

ul.nav-list li {
	margin-right: 1rem;
}

ul.nav-list li a:hover {
	color: var(--clr-primary);
}

.nav-contact {
	display: flex;;
}

.nav-social {
	display: flex;
	margin-left: 1.5rem;
	font-size: var(--fs-750);
	color: var(--clr-primay-tint);
}

.nav-social .nav-instagram  {
	margin-left: 1rem;
}

.nav-instagram  {
	position: relative;
	top: 0.08rem;
}

.nav-social .nav-facebook:hover i,
.nav-social .nav-instagram:hover i {
	color: var(--clr-secondary);
}

/* Media query for Navigation */
@media (max-width: 55rem) {
	.mobile-nav-toggle2 {
		display: flex;
		position: absolute;
		z-index: 100;
		top: 0.8rem;
		right: 1.5rem;
		background: transparent;
		border: none;
	} 
	
	button.mobile-nav-toggle2 .line {
		transition: 
			y 300ms ease-in 300ms,
			rotate 300ms ease-in,	
			opacity 0ms 300ms;
		transform-origin: center;
	}

	button.mobile-nav-toggle2[aria-expanded="true"] .line {
		transition: 
			y 300ms ease-in,
			rotate 300ms ease-in 300ms,
			opacity 0ms 300ms;
	}
	
	button.mobile-nav-toggle2[aria-expanded="true"] .top,
	button.mobile-nav-toggle2[aria-expanded="true"] .bottom {
		y: 45px;
	}
	
	button.mobile-nav-toggle2[aria-expanded="true"] .top {
		rotate: 45deg;
	}
	
	button.mobile-nav-toggle2[aria-expanded="true"] .middle {
		opacity: 0;
	}
	
	button.mobile-nav-toggle2[aria-expanded="true"] .bottom {
		rotate: -45deg;
	}

	.primary-navigation {
		display: none;
		padding-left: 0.75rem;
	}

	.primary-navigation.true {
		display: flex;
		flex-direction: column;
		justify-content: center;
		position: fixed;
		top: 0;
		left: 0;
		height: 100vh;
		width: 100%;
		background-color: var(--clr-secondary);
		color: var(--clr-white);
		animation: 300ms fadeIn;
		animation-fill-mode: forwards;
		opacity: 0;
	}

	@keyframes fadeIn {
		0% {
		  opacity: 0;
		}
		100% {
		  opacity: 1;
		}
	  }
	  

	.nav-right {
		flex-direction: column;
	}

	ul.nav-list {
		flex-direction: column;
		font-size: var(--fs-600);
		margin-top: 2rem;
		margin-bottom: 3.5rem;
		line-height: 3.5rem;
		color: var(--clr-accent);
		transition: 300ms;
	}

	ul.nav-list li a:hover {
		color: var(--clr-white);
	}

	.conatct-nav-wrapper {
		justify-content: center;
		margin-left: 0rem;
		margin-bottom: 1rem;
	}

	.conatct-nav-wrapper .contact-nav {
		margin-left: 0rem;
	}

	.nav-contact {
		flex-direction: column;
	}

	.nav-social {
		justify-content: center;
		margin-left: 0;
		color: var(--clr-white);
	}
}


/* Buttons */
.button-primary {
	width: 100%;
	margin-top: 3rem;
	padding: 1rem 0;
	border: none;
	border-radius: 50rem;
	background-color: var(--clr-accent);
	font-size: var(--fs-500);
	font-weight: var(--fw-bold);
	color: var(--clr-secondary);
	text-transform: uppercase;
	transition: 300ms;
}

.button-primary:hover {
	background-color: var(--clr-primary);
	color: var(--clr-white);

}

/* Media queries for buttons */
@media (min-width: 45rem) {
	.button-primary {
		width: min(100%, 20rem);
	}
}

@media (min-width: 55rem) {
	.button-primary {
		width: min(100%, 20rem);
	}
}


/* Hero Section */
#hero {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	height: 100vh;
	padding-top: 5.4rem;
	background-image:
	linear-gradient(hsl(0 0% 0% / 30%), hsl(0 0% 0% / 30%)), 
	url(../img/elderly-care-sm.jpg);
	background-color: var(--clr-neutral-500);
	background-size: cover;
	background-position: top;
	scroll-margin-top: 6.25em;
}

.hero-content-wrapper {
	margin-bottom: 0.4rem;
}

h3.hero-callout {
	margin: 2rem 0 1rem 0;
	font-size: var(--fs-600);
	font-weight: var(--fw-bold);
	color: var(--clr-accent);
}

.hero-wrapper-master {
	display: flex;
	flex-direction: column;
	gap: 1.5rem;
}

.conatct-hero-wrapper {
 color: var(--clr-white);
}

.conatct-hero-wrapper.nav-call:hover i,
.conatct-hero-wrapper.nav-call:hover a {
	color: var(--clr-accent);
	border-color: var(--clr-accent);
}

.conatct-hero-wrapper.nav-email:hover i,
.conatct-hero-wrapper.nav-email:hover a {
	color: var(--clr-accent);
	border-color: var(--clr-accent);
}

.conatct-hero-wrapper a,
.conatct-hero-wrapper p {
	font-size: var(--fs-500);
	font-weight: var(--fw-bold);
}

.conatct-hero-wrapper i {
	padding: 0.8rem;
	border: 3px solid var(--clr-white);
	border-radius: 500rem;
	font-size: var(--fs-600);
}

@media (min-width: 45rem) {


	.hero-wrapper-master {
		flex-direction: row;
		justify-content: center;
		gap: 3rem;
	}

	.hero-wrapper-master .conatct-hero-wrapper {
		display: flex;
		align-items: center;
		gap: 0.7rem;
	}
}

@media (min-width: 55rem) {
	.hero-content-wrapper {
		margin-bottom: 5.4rem;
	}
	
}




/* Services Callout Section */
#services-callout {
	margin: 0 auto;
	width: min(100%, 68.75rem);
	display: grid;
	grid-template-columns: 1fr 1fr;
}

#services-callout .serv-dark {
	background-color: var(--clr-secondary);
	color: var(--clr-accent);
}

#services-callout .serv-light {
	background-color: var(--clr-accent);
	color: var(--clr-secondary);
}

.serv-box {
	padding: 1rem 0;
}

.services-wrapper {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: end;
	height: 100%;
}

.serv-box img {
	width: 25%;
}

.serv-box.serv-dark h3 {
	color: var(--clr-accent);
}

@media (min-width: 45rem) {
	#services-callout {
		position: relative;
		bottom: 5.3rem;
	}

	.serv-box {
		display: flex;
		justify-content: center;
		padding: 0.5rem 0;
	}

	.services-wrapper {
		flex-direction: row;
		justify-content: center;
		width: min(100%, 18rem);
	}

	.serv-box img {
		height: 80%;
		margin-right: 1.25rem;
	}

	.services-wrapper h3 {
		width: 100%;
		text-align: left;
	}
	
}


/* Mission Statement Section */
#mission-statement h2 {
	margin: 2rem 0 1rem 0;
}

.mission-statement-image-wrapper img {
	aspect-ratio: 16/9;
}

@media (min-width: 45rem) {
	#mission-statement {
		margin-top: -5.3rem;
	}

	.mission-statement-content {
		padding: 0 3rem;
	}

	.mission-statement-content h2 {
		margin-top: 0;
	}
}

@media (min-width: 55rem) {
	#mission-statement {
		margin-top: 0.5rem;
		display: grid;
		grid-template-columns: 1fr 1fr;
	}

	.mission-wrapper-main {
		position: relative;
	}

	.mission-statement-image-wrapper {
		position: relative;
		z-index: 100;
	}

	.mission-wrapper-main .img-accent {
		width: 6rem;
		aspect-ratio: 1/1;
		position: absolute;
		top: -0.9rem;
		left: -0.9rem;
		background-color: var(--clr-secondary);
	}

	#mission-statement h2 {
		margin: 0rem 0 1rem 0;
	}

	.mission-statement-content h2,
	.mission-statement-content p  {
		text-align: left;
	}
}


/* Who We Help Section */
#who-we-help {
	margin: 4rem 0 1rem 0;
}

.who-we-help-image-wrapper {
	margin-bottom: 2rem;
}

.help-img {
	margin-bottom: 2rem;
}

.help-img img {
	margin: 0 auto 1rem auto;
	width: 14rem;
	aspect-ratio: 1/1;
	object-fit: cover;
	border-radius: 500rem;
}

@media (min-width: 45rem) {
	.who-we-help-image-wrapper {
		display: grid;
		grid-template-columns: 1fr 1fr 1fr;
		row-gap: 1rem;
	}	
}


/* Testimonials Section */
.swiper {
	width: 100%;
  }

.swiper-button-next, .swiper-button-prev {
	color: var(--clr-primay-tint) !important;
}

.swiper-pagination {
	position: relative !important;
	margin-top: 2rem;
}

.swiper-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet, .swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet {
	width: 1rem;
	height: 1rem;
	background: var(--clr-primay-tint);
	opacity: 1;
}

.swiper-pagination-bullet-active {
	background: var(--clr-accent) !important;
	opacity: 1;
}

#testimonials {
	margin: 3rem 0 0 0;
	padding-bottom: 2rem;
	position: relative;
	background-color: var(--clr-secondary);
	background-image:
	url(../img/quotations.svg),
	linear-gradient(hsl(227 99% 32% / 85%), hsl(227 99% 32% / 85%)),
	url(../img/talking-03-sm-bw.jpg);
	background-size: 80%, cover, cover;
	background-repeat: no-repeat;
	background-position: 50% 85%, center, center;
	color: var(--clr-white);
}

#testimonials h2 {
	padding: 3rem 0 1rem 0;
	text-align: center;
	color: var(--clr-accent);
}

.testimonial-wrapper {
	padding: 0 3rem;
}

.quote-img-wrapper img {
	margin: 0 auto 2rem auto;
	width: 14rem;
	aspect-ratio: 1/1;
	object-fit: cover;
	object-position: left;
	border-radius: 500rem;
}

.quote-img-wrapper img.testimonial-img-02 {
	margin: 0 auto 2rem auto;
	width: 14rem;
	aspect-ratio: 1/1;
	object-fit: cover;
	object-position: right;
	border-radius: 500rem;
}

p.testimonial-quote {
	margin-bottom: 0.5rem;
	font-family: 'Poppins', sans-serif;
	font-size: var(--fs-600);
	font-weight: var(--fw-bold);
	text-align: center;
}

h4.testimonial-quote-name {
	font-size: var(--fs-200);
	font-weight: var(--fw-medium);
	font-style: italic;
}

@media (min-width: 45rem) {
	/* p.testimonial-quote {
		font-size: var(--fs-500);
	} */
}

@media (min-width: 55rem) {
	#testimonials {
		margin: 3rem 0 5rem 0;
	}

	#testimonials {
		background-size: 40%, cover, cover;
		background-position: 85% 70%, center, center;
	}

	#testimonials h2 {
		padding: 3rem 0 0 0;
		text-align: left;
	}

	.testimonial-wrapper {
		padding: 0 2rem;
		display: grid;
		grid-template-columns: 2fr 5fr;
		align-items: center;
		gap: 2rem;
	}

	.quote-img-wrapper img {
		width: 90%;
	}

	p.testimonial-quote {
		font-size: var(--fs-600);
		text-align: left;
	}

	h4.testimonial-quote-name {
		text-align: left;
	}
}


/* Services Section Main*/
#services {
	scroll-margin-top: 6.25em;
}

.services-image-wrapper {
	display: grid;
	grid-template-columns: 1fr 1fr;
	margin-bottom: 3rem;
}

.services-image-wrapper img {
	aspect-ratio: 16/10;
}

.services-content-wrapper {
	margin-top: 2rem;
	margin-bottom: rem;
}

.services-content-wrapper img {
	margin: 0 auto 1rem auto;
	width: 5rem;
}

.services-content-wrapper-right {
	margin: 0 auto;
	width: min(100%, 36rem);
}

.services-content-wrapper-right p {
	color: var(--clr-neutral-500);
}

.services-content-wrapper-right h3 {
	margin-bottom: 0.25rem;
}

.services-content  p {
	color: var(--clr-neutral-500);
}

.services-content-wrapper-right p {
	font-weight: var(--fw-bold);
}

.services-content p {
	font-weight: var(--fw-regular);
}

@media (min-width: 55rem) {
	#services .wrapper-master {
		display: grid;
		grid-template-columns: 8fr 9fr;
		gap: 3rem;
	}

	.services-wrapper-main {
		padding-left: 1rem;
		position: relative;
	}

	.services-image-wrapper {
		position: relative;
		z-index: 100;
	}

	.services-wrapper-main .img-accent {
		width: 6rem;
		aspect-ratio: 1/1;
		position: absolute;
		top: -0.9rem;
		left: 0rem;
		background-color: var(--clr-secondary);
	}

	.services-content-wrapper-right {
		margin: 0;
		width: 100%;
	}

	.services-content-wrapper {
		display: grid;
		grid-template-columns: auto 3fr;
		gap: 2rem;
	}
	
	.services-content-wrapper-right h2,
	.services-content-wrapper-right p,
	.services-content  h3,
	.services-content  p {
		text-align: left;
	}
}


/* 24-hour Care Callout */
#twenty-four-hour-care {
	margin: 3rem 0 0 0;
	padding: 3rem 0;
	background-color: var(--clr-secondary);
	background-image:
	linear-gradient(hsl(227 99% 32% / 85%), hsl(227 99% 32% / 85%)), 
	url(../img/care-02-sm-bw.jpg);
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
}

#twenty-four-hour-care h3 {
	margin-bottom: 1rem;
	font-size: var(--fs-900);
	line-height: 2.5rem;
	color: var(--clr-accent);
}

#twenty-four-hour-care p {
	color: var(--clr-white);
}

.contact-consultation {
	margin-top: 2rem;
	font-size: var(--fs-500);
	font-weight: var(--fw-bold);
}

#twenty-four-hour-care .button-primary {
	margin-top: 1rem;
}

@media (min-width: 45rem) {
	#twenty-four-hour-care h3 {
		font-size: var(--fs-1000);
		line-height: 4rem;
	}

	#twenty-four-hour-care p {
		padding: 0 3rem;
	}
}

@media(min-width: 55rem) {
	#twenty-four-hour-care p {
		padding: 0 9rem;
	}
}


/* About Bartlett IHC Section */
#about {
	margin-top: 3rem;
	scroll-margin-top: 6.25em;
}

.about-us-content {
	margin-bottom: 2rem;
}

.about-us-content p {
	margin-bottom: 1rem;
	color: var(--clr-neutral-500);
}

@media (min-width: 45rem) {
	.about-us-content {
		padding-right: 2rem;
	}

	.about-us-content h2 {
		margin-top: 0;
	}
}

@media (min-width: 55rem) {
	#about {
		margin-top: 4rem;
		display: grid;
		grid-template-columns: 1fr 1fr;
	}

	.about-us-image-wrapper {
		position: relative;
	}
	
	.about-us-image-wrapper img {
		position: relative;
		z-index: 100;
	}
	
	.about-us-image-wrapper .img-accent {
		width: 6rem;
		aspect-ratio: 1/1;
		position: absolute;
		top: -0.9rem;
		right: -0.9rem;
		background-color: var(--clr-secondary);
	}

	.about-us-content h2,
	.about-us-content p {
		text-align: left;
	}
}


/* About Christa Section */
#about-christa {
	padding: 2rem 0;
	background-color: var(--clr-primay-tint-900);
}

.about-christa-image-wrapper img {
	margin: 0 auto 2rem auto;
	width: 14rem;
	border-radius: 500rem;
	aspect-ratio: 1/1;
	object-fit: cover;
}

.about-christa-content h2 {
	margin-bottom: 1rem;
}

.about-christa-content p {
	margin-bottom: 1rem;
	color: var(--clr-neutral-700);
}

@media (min-width: 45rem) {
	.about-christa-content {
		padding: 0;
	}
}

@media (min-width:55rem) {
	#about-christa {
		margin-top: 3rem;
	}

	.about-christa-wrapper {
		display: grid;
		grid-template-columns: 3fr 5fr;
		align-items: center;
		gap: 4rem;
	}

	.about-christa-image-wrapper img {
		width: 90%;
	}

	.about-christa-content h2,
	.about-christa-content p {
		text-align: left;
	}
}

/* Contact Form Section */
#contact {
	padding: 3rem 0;
	background-color: var(--clr-secondary);
	background-image:
	linear-gradient(hsl(227 99% 32% / 85%), hsl(227 99% 32% / 85%)), 
	url(../img/christa-dad-bw.jpg);
	background-size: cover;
	background-repeat: no-repeat;
	background-position: 0 30%;
	scroll-margin-top: 6.25em;
}

.contact-us-content {
	padding: 0 2rem;
}

.contact-us-content h2 {
	margin: 0 0 1rem 0;
	color: var(--clr-accent);
}

.contact-us-content p {
	color: var(--clr-white);
}

.contact-us-content p.contact-callout {
	margin: 0.5rem 0 0 0;
	font-weight: var(--fw-bold);
	color: var(--clr-accent);
}

.contact-form h3 {
	margin: 2rem 0 1rem 0;
	font-size: var(--fs-750);
	color: var(--clr-accent);
}

.contact-form .nav-call {
	margin-bottom: 1rem;
}



/* .contact-form form {
	display: grid;
	grid-template-columns: 1fr;
	gap: 1rem;
}

form .form-group {
	display: grid;
	grid-template-columns: 1fr;
	gap: 1rem;
}

form .input {
	padding: 0.5rem 1.2rem;
	outline: none;
	border-radius: 0.2rem;
	font-size: var(--fs-300);
	font-weight: var(--fw-regular);
	color: var(--clr-neutral-700);
}

.contact-form .footnote {
	margin-top: -0.5rem;
	font-size: var(--fs-200);
	color: var(--clr-white);
}

.contact-form .button-primary {
	margin: 2rem auto 0 auto;
} */

@media (min-width: 55rem) {
	#contact .wrapper-master {
		display: grid;
		grid-template-columns: 3fr 5fr;
		gap: 4rem;
	}

	.contact-us-content {
		padding: 0;
	}

	.contact-us-content h2,
	.contact-us-content h3,
	.contact-us-content p {
		text-align: left;
	}

	.contact-form h3 {
		margin: 0 0 1rem 0;
		padding-top: 0.3rem;
		text-align: left;
	}

	.contact-form .conatct-hero-wrapper {
		display: flex;
		align-items: center;
		gap: 1rem;
	}

	/* form .form-group {
		display: grid;
		grid-template-columns: 1fr 1fr;
		gap: 1rem;
	}

	form .input {
		border: solid;
		border-color: transparent;
		text-align: left;
	}

	.input:focus {
		border: solid;
		border-color: var(--clr-accent);
	}

	.contact-form .footnote {
		text-align: left;
	}

	.contact-form .button-primary {
		margin: 2rem 0 0 0;
	} */
}


/* Resources Section */
#resources {
	margin: 4rem auto 0 auto;
	scroll-margin-top: 6.25em;
}

.resources-content h2 {
	margin-bottom: 2rem;
}

.resource-item {
	margin-bottom: 4rem;
}

.resource-item {
	margin:0 0 4rem 0;
	display: grid;
	grid-template-columns: 1fr;
}

.resource-item.resource.heading {
	margin-bottom: 0rem;
}

.resource-item-img-wrapper {
	position: relative;
}

.resource-item-img-wrapper img {
	margin-bottom: 2rem;
}

.resource-item-img-wrapper .resources-image {
	filter: brightness(50%);
	transition: 300ms;
}

.resource-item a:hover .resources-image {
	filter: brightness(20%);
}

.resources-logo {
	width: 100%;
	padding: 0 2rem;
	position: absolute;
	top: 40%;
	left: 50%;
	transform: translate(-50%);
}

.resource-item.resource-heading {
	margin-bottom: 0;
}

.resource-item h3 {
	margin-bottom: 0.5rem;
	color: var(--clr-secondary);
}

.resource-item p {
	color: var(--clr-neutral-500);
}

.resources-content button {
	margin: 2rem 0 0 0;
}

@media(min-width: 55rem) {
	.resource-item {
		display: grid;
		grid-template-columns: 2fr 3fr;
		gap: 3rem;
	}

	.resources-content {
		padding: 0;
		text-align: left;
	}

	.resource-item h2,
	.resource-item h3,
	.resource-item p {
		text-align: left;
	}
}


/* Hero Image */
.hero-img-wrapper {
	position: relative;
}

.parallax {
	height: 30rem;
	background-image: 
	linear-gradient(hsl(0 0% 0% / 20%), hsl(0 0% 0% / 20%)),
	url(../img/talking-01.jpg);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	background-attachment: fixed;
}

.hero-image img {
	margin: 0 auto;
	position: absolute;
	top: 0;
	left: 50%;
	height: 30rem;
	transform: translateX(-50%);
	opacity: 0.4;
}

.hero-divider {
	height: 0.5rem;
	background-color: var(--clr-white)
}



/* Footer Section */
footer {
	background-color: var(--clr-secondary);
}

.footer-main {
	width: min(100%, 87.5);
	padding: 3rem 0;
}

.footer-main ul,
.footer-main .footer-contact,
.footer-main p,
.footer-legal {
	color: var(--clr-white);
}

.footer-brand img {
	margin: 0 auto 2rem auto;
	width: 70%;
}

.footer-social-wrapper {
	margin-bottom: 3rem;
	display: flex;
	justify-content: center;
	gap: 2rem;
	font-size: var(--fs-800);
	color: var(--clr-white);
}

.footer-social-wrapper a:hover {
	color: var(--clr-accent);
}

.footer-social-wrapper .nav-instagram {
	position: relative;
	top: 0.1rem;
}

nav.nav-footer {
	display: block;
}

nav.nav-footer ul {
	margin-bottom: 3rem;
}

nav.nav-footer li {
	font-size: var(--fs-300);
	font-weight: var(--fw-semi-bold);
	line-height: 3rem;
}

nav.nav-footer li a:hover {
	color: var(--clr-accent);
}

.contact-nav-footer.footer-phone:hover i,
.contact-nav-footer.footer-phone:hover a {
	color: var(--clr-accent);
}

.contact-nav-footer.footer-email:hover i,
.contact-nav-footer.footer-email:hover a {
	color: var(--clr-accent);
}

.contact-nav-footer {
	margin-bottom: 1rem;
}

.footer-divider {
	margin-top: 0rem;
}

.footer-legal {
	padding: 1rem 0;
	font-size: var(--fs-150);
}

@media (min-width: 45rem) {
	.footer-main {
		margin: 0 auto;
		width: min(100%, 87.5rem);
		display: grid;
		grid-template-columns: 1fr;
	}

	/* .footer-brand,
	.footer-nav,
	.footer-contact {
		border: 1px solid red;
	} */

	.footer-brand img {
		width: 50%;
	}
}

@media (min-width: 55rem) {
	.footer-main {
		margin: 0 auto;
		grid-template-columns: 3fr 2fr 1fr;
	}

	.footer-brand,
	.footer-nav,
	.footer-contact {
		padding: 0 2rem;
	}

	.footer-main ul li,
	.footer-main .footer-contact div,
	.footer-main p {
		text-align: left;
	}

	.footer-brand img {
		margin: 0 0 3rem 0;
	}

	.footer-social-wrapper {
		justify-content: start;
	}

	.contact-nav-footer {
		margin-bottom: 1rem;
		display: flex;
		align-items: center;
	}

	.contact-nav-footer .contact-footer-icon {
		margin-right: 0.5rem;
	}

	.footer-main {
		padding: 2rem 0 0 0;
	}

	.footer-brand img {
		width: min(100%, 17rem);
	}
}



/* Success Page */
section.contact-success {
	padding-top: 5.5rem;
	height: 90vh;
}

.success-msg {
	height: 100%;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	background-color: rgb(248, 248, 248);
	}

.success-msg h1 {
	font-size: var(--fs-1000);
	color: var(--clr-secondary);
}