/*
 Theme Name:   MGD Theme
 Theme URI:    https://mightybit.io/
 Description:  Child theme for Mary Glasheen Dentistry.
 Author:       MightyBit, LLC.
 Author URI:   https://mightybit.io/
 Copyright:    © 2024 All Rights Reserved.  
 Template:     bricks
 Version:      1.1
 Text Domain:  bricks
*/


/*  DESIGN TOKENS
*********************/

:root {
	/* font-size: 10px; */
	
	/* colors */
	--mbc-darkBlue:  #0a2e4d;
	--mbc-lightBlue: #8cafcf;
	--mbc-pink:      #d89c97;
	--mbc-lightPink: #f2d9d4;
	--mbc-base:      #f2f3f3;
	/* --white:      #f2f3f3; */
	/* --black:      #121212; */
	
	/* padding */
	--mbp-xxs:  0.33rem;
	--mbp-xs:   0.33rem;
	--mbp-s:    0.33rem;
	--mbp-m:    0.33rem;
	--mbp-l:    0.33rem;
	--mbp-xl:   0.33rem;
	--mbp-xxl:  0.33rem;

	--mbpt-xxs: var(--mbp-xxs);
	
	/* font */
	--mbf-sans: Montserrat, sans-serif;
	--mbf-serif: Lora, serif;
	--mbf-xxs: 1rem;
	--mbf-xs:  1.2rem;
	--mbf-s:   1.5rem;
	--mbf-m:   1.8rem;
	--mbf-l:   2.8rem;
	--mbf-xl:  4rem;
	--mbf-xxl: 5.4rem;
}


/*  HERO's
*********************/

.mb-h1HeroLight {
	color: white;
	text-align: center;
	font-family: var(--mbf-serif);
	font-weight: 500;
	font-style: italic;
}

.mb-h1HeroLight span {
	font-style: normal;
	text-transform: uppercase;
}

.mb-heroTextLink {
	padding-bottom: 1rem;
	color: var(--mbc-pink);
	font-family: var(--mbf-sans);
	font-weight: 700;
	text-align: center;
	border-bottom: 5px solid var(--mbc-pink);
	text-transform: uppercase;
}

/*  HERO BANNER's
*********************/

.mb-heroBanner {
	padding: 0;
	margin: 0;
	color: var(--mbc-darkBlue);
	text-align: center;
	font-family: var(--mbf-sans);
	font-weight: 600;
	text-transform: uppercase;
}

/*  INTRO's
*********************/

.mb-introHeading {
	color: var(--mbc-darkBlue);
	text-align: left;
	font-size: var(--mbf-xl);
	font-family: var(--mbf-serif);
	font-weight: 500;
	font-style: italic;	
}

.mb-introHeading span {
  font-style: normal;
  text-transform: uppercase;
}

/*  WAVE-MID's
*********************/

.mb-waveMidHeading {
	color: white;
	font-family: var(--mbf-sans);
	font-weight: 500;
	text-transform: uppercase;
	text-align: center;
	font-size: var(--mbf-l);
}

.mb-waveMidSubHeading {
	color: white;
	font-family: var(--mbf-serif);
	font-weight: 500;
	text-align: center;
	font-size: var(--mbf-m);
	font-style: italic;
}

.mb-waveMidButton {
	color: var(--mbc-darkBlue);
	font-family: var(--mbf-sans);
	font-weight: 600;
	text-align: center;
	text-transform: uppercase;
	padding-bottom: 2rem;
	border-bottom: solid 3px var(--mbc-darkBlue);
}

/*  HEADINGS
*********************/

.mb-h1Sans {font-family: var(--mbf-sans); text-transform: uppercase; font-size: var(--mbf-xxl);}
.mb-h2Sans {font-family: var(--mbf-sans); text-transform: uppercase; font-size: var(--mbf-xl);}
.mb-h3Sans {font-family: var(--mbf-sans); text-transform: uppercase; font-size: var(--mbf-l);}
.mb-h4Sans {font-family: var(--mbf-sans); text-transform: uppercase; font-size: var(--mbf-m);}

.mb-h1Serif {font-family: var(--mbf-serif); text-transform: uppercase; font-size: var(--mbf-xxl);}
.mb-h2Serif {font-family: var(--mbf-serif); text-transform: uppercase; font-size: var(--mbf-xl);}
.mb-h3Serif {font-family: var(--mbf-serif); text-transform: uppercase; font-size: var(--mbf-l);}
.mb-h4Serif {font-family: var(--mbf-serif); text-transform: uppercase; font-size: var(--mbf-m);}

.mb-h2SerifItal {font-family: var(--mbf-serif); font-style: italic; font-size: var(--mbf-xl);}
.mb-h2SerifItal {font-family: var(--mbf-serif); font-style: italic; font-size: var(--mbf-xl); text-align: right; color: white;}

.mb-h3SerifRightLt { font-family: var(--mbf-serif); font-style: italic; font-size: var(--mbf-xl); }

/*  P TAGS / COPY
*********************/

.mb-pLeft {
	color: var(--mbc-darkBlue);
	text-align: left;
	font-size: var(--mbf-m);
	font-family: var(--mbf-sans);
	font-weight: 500;
	line-height: 1.65;
}

.mb-pLeft p span { font-weight: unset; }

.mb-pRight {
	color: var(--mbc-darkBlue);
	text-align: right;
	font-size: var(--mbf-m);
	font-family: var(--mbf-sans);
	font-weight: 500;
	line-height: 1.65;
}

.mb-pCenter {
	color: var(--mbc-darkBlue);
	text-align: center;
	font-size: var(--mbf-m);
	font-family: var(--mbf-sans);
	font-weight: 500;
	line-height: 1.65;
}

.mb-pCenterSerif {
	color: var(--mbc-darkBlue);
	text-align: center;
	font-size: var(--mbf-m);
	font-family: var(--mbf-serif);
	font-weight: 500;
	font-style: italic;
	line-height: 1.65;
}

.mb-pLeftLt {
	color: white;
	text-align: left;
	font-size: var(--mbf-m);
	font-family: var(--mbf-sans);
	font-weight: 500;
	line-height: 1.65;
}

.mb-pCenterLt {
	color: white;
	text-align: center;
	font-size: var(--mbf-m);
	font-family: var(--mbf-sans);
	font-weight: 500;
	line-height: 1.65;
}

.mb-pRightLt {
	color: white;
	text-align: right;
	font-size: var(--mbf-m);
	font-family: var(--mbf-sans);
	font-weight: 500;
	line-height: 1.65;
}


:root {
    /* TEXT SIZE SCALE */
    --copy-xs: clamp(0.79rem, -0.01vw + 0.79rem, 0.78rem);
    --copy-xs: clamp(1.264rem, -0.014vi + 1.269rem, 1.25rem);
    --copy-s:  clamp(1.422rem, 0.074vi + 1.398rem, 1.5rem);
    --copy-m:  clamp(1.6rem, 0.191vi + 1.539rem, 1.8rem);
    --copy-l:  clamp(1.8rem, 0.344vi + 1.69rem, 2.16rem);
    --copy-xl: clamp(2.025rem, 0.542vi + 1.852rem, 2.592rem);

    /* HEADING SIZE SCALE */    
    --hdg-6:     clamp(1.28rem, 0.068vi + 1.258rem, 1.351rem);
    --hdg-5:     clamp(1.6rem, 0.192vi + 1.539rem, 1.8rem);
    --hdg-4:     clamp(2rem, 0.382vi + 1.878rem, 2.4rem);
    --hdg-3:     clamp(2.5rem, 0.668vi + 2.286rem, 3.199rem);
    --hdg-2:     clamp(3.125rem, 1.089vi + 2.776rem, 4.265rem);
    --hdg-1:     clamp(3.906rem, 1.7vi + 3.362rem, 5.685rem);
    --hdg-title: clamp(4.883rem, 2.576vi + 4.058rem, 7.578rem);
}

/* TEXT SIZE UTILITY CLASSES */
.copy-xl    {font-size: var(--copy-xl); line-height: 1.4; }
.copy-l     {font-size: var(--copy-l);  line-height: 1.5; }
.copy-m     {font-size: var(--copy-m);  line-height: 1.5; }
body        {font-size: var(--copy-m);  line-height: 1.5; }
.copy-s     {font-size: var(--copy-s);  line-height: 1.6; }
.copy-xs    {font-size: var(--copy-xs); line-height: 1.7; }

/* HEADING SIZE UTILITY CLASSES */
.hdg-title {font-size: var(--h-title); line-height: 1.05; }
h1, .hdg-1 {font-size: var(--hdg-1);   line-height: 1.1; }
h2, .hdg-2 {font-size: var(--hdg-2);   line-height: 1.2; }
h3, .hdg-3 {font-size: var(--hdg-3);   line-height: 1.3; }
h4, .hdg-4 {font-size: var(--hdg-4);   line-height: 1.4; }
h5, .hdg-5 {font-size: var(--hdg-5);   line-height: 1.5; }
h6, .hdg-6 {font-size: var(--hdg-6);   line-height: 1.6; }

.light   	{ color: white; }
.dark 		{ color: #0a2e4d; }
.serif  	{ font-family: Lora, serif; font-style: italic;}
.serif span { font-style: italic; text-transform: capitalize;}
.cap 		{ text-transform: capitalize;}
.upr 		{ text-transform: uppercase;}
.ctr 		{ text-align: center; }
.right 		{ text-align: right; }
.hvy 		{ font-weight: 600; }


a[href^="tel"] {
    color:inherit;
    text-decoration:none;
}

.team-card {
    grid-template-rows: auto;
}