/*Basic*/
	:root {
	  --primary-color: #39979C;
	  --secondary-color: #6E83B5;
	  --tertiary-color: #CDD5DC;
	}

	.p-color {color: var(--primary-color);}
	.s-color {color: var(--secondary-color);}
	.pb-color {background-color: var(--primary-color);}
	.sb-color {background-color: var(--secondary-color);}
	.tb-color {background-color: var(--tertiary-color);}

	* {box-sizing: border-box;font-family: "Open Sans",sans-serif;}
	a {color: var(--primary-color); text-decoration: none;font-weight: 600;}
	a:hover {color: var(--primary-color);}
	h6 {font-weight:bold !important;}




/*BTNs*/
	.btn-primary {
		background-color: #6E83B5;
		border: 0px;
		transition: background-color 0.3s ease;
	}
	.btn-primary:hover,
	.btn-primary:focus,
	.btn-primary:active,
	.btn-primary.active,
	.btn-primary:focus-visible {
	  background-color: #AE2F5F;
	  border: 0;
	  color: #fff;
	  outline: none;
	}






/*Custom*/

	.fluid-pad {padding-left:5rem; padding-right:5rem;}
	#mainNav {
	  background-color: transparent;
	  transition: background-color 0.3s ease, box-shadow 0.3s ease;
	}
	#mainNav.scrolled {
	  background-color: #ffffff; /* fades to white */
	  box-shadow: 0 2px 6px rgba(0,0,0,0.1);
	}
	.hero {
		min-height: 100vh;
		background: radial-gradient(circle at 70% 30%,#BDC7D0 0%,#ffffff 100%);
	}
	.hero-title {font-size: clamp(4rem, 6vw, 7rem);}
	.minh {min-height: 80vh;}
	.lgtext {
		font-size: clamp(1.5rem, 3vw, 3rem);
		font-weight: 100;
	}
	.mdtext {
		font-size: clamp(1rem, 1.5vw, 2rem);
		font-weight: 100;
	}
	.p100 {padding-top:100px; padding-bottom:100px;}

	/*section1*/
	.section-row {
		margin-right: 0;
		margin-left: 0;
		min-height: 100vh;
	}
	.left-col {
		padding: 5rem;
		display: flex;
		flex-direction: column;
		justify-content: center;
	}
	.minh-50vh {
      min-height: 50vh;
    }


    .gallery-grid {
	  display: grid;
	  grid-template-columns: repeat(3, 1fr);
	  gap: 8px;
	}

	.gallery-grid a {
	  display: block;
	  width: 100%;
	  aspect-ratio: 1 / 1; /* makes it square */
	  overflow: hidden;
	  border-radius: 0.5rem; /* rounded corners */
	}

	.gallery-grid img {
	  width: 100%;
	  height: 100%;
	  object-fit: cover; /* covers the cell */
	  transition: transform 0.3s;
	}

	.gallery-grid img:hover {
	  transform: scale(1.05);
	}