/*
 Theme Name:   GeneratePress Child
 Theme URI:    https://generatepress.com
 Description:  Default GeneratePress child theme
 Author:       Tom Usborne
 Author URI:   https://tomusborne.com
 Template:     generatepress
 Version:      0.1
*/

/*** 1. Thema tweaks ***/

/*Body Background color (outside wrapper) */
body{
	background-color: var(--surface-20)
}

/* Site-wrapper

.site-wrapper{
	width:100%;
	max-width:1920px;
	margin-bottom:auto;
	background-color: var(--surface-10)
}
*/
/* Set the main content area height */

#main{
	min-height:65vh
}

/*Container padding overrides */
.inside-header{
	padding-inline: 0px !important
}

.site-header{
	padding-inline: clamp(1rem, 0.884rem + 0.758vw, 1.5rem) !important
}

.site-content #content{
	padding: 0px
}

/* post Editor width (backend) 
.post-type-post .block-editor__container{
	max-width:728px !important;
	margin:0 auto !important;
	padding:0 200px !important
}

.post-type-post .edit-post-visual-editor__post-title-wrapper .editor-post-title{
		max-width:728px !important;
	margin: 0 auto !important;
	padding: 0 200px !important
}*/

/*Primary Menu Button Styles*/

@media (min-width:1025px){
	.main-navigation .main-nav ul li.nav-cta a{
		background-color: var(--secondary)  !important;
		color: var(--surface-10) !important;
		padding: 1em 1.5em;
		margin-left: 16px;
		border-radius:4px;
		line-height:1;
		font-weight:600;
	}
	.main-navigation .main-nav ul li.nav-cta a:hover{
	background-color: var(--secondary)  !important;
		color: var(--surface-0) !important;
	}
	 
}

@media (max-width:1024px){
	.main-navigation .main-nav ul li.nav-cta a{
	margin-left:0px
	}
}

/* Post Editor Width & Title */
body .editor-style-wrapper .post-type-post .block-editor-block-list__layout,
body .editor-style-wrapper .post-type-post .edit-post-visual-editor__post-title-wrapper .editor-post-title{
	max-width:768px !important;
	margin-inline: auto !important
		
}

/*password protected pages*/
.post-password-form{
	max-width:768px !important
	padding:8 rem 0px;
	margin-inline:auto;
	text-align:center;
}



/*** 2. UTILITIES ***/

/* Visal Hidden - for accessibility */
.visually-hidden:not (:focus) :not(:active){
	clip: rect( 0 0 0 0);
	clip-path: inset(50%);
	height:1px:
		overflow:hidden;
	position:absolute;
	white-space: nowrap;
	width:1px;
}

/*line limits */

.line-limit-3, .line-limit-2{
	display: -webkit-box;
	-webkit-box-orient:vertical;
	overflow:hidden;
}

.line-limit-3{
	-webkit-line-clamp:3;
}

.line-limit-2{
	-webkit-line-clamp:2;
}

/* No underline */

.no-ul, .no-ul a{
	text-decoration:none;
}

/* Text Balance / Pretty */

.balance {
	text-wrap:balance
}

p, div, blockquote, li{
	text-wrap:pretty
}

/*** 3. Typografy ***/

:root{
	/* These Have to match what is in the Customizer > Typography. Pull in font famliys using font manager. Set headline-fonts as 'All Headings', set body-font as HTML */
	--headline-font: Outfit, sans-serif;
	--body-font: Outfit, sans-serif;
	--fs-body: clamp(1rem, calc(0.96rem + 0.21vw), 1.125rem);
	--fs-headline-xl: clamp(2.44rem, calc(1.96rem + 2.41vw), 3.89rem);
	--fs-headline-h1: clamp(1.95rem, calc(1.69rem + 1.33vw), 2.75rem);
	--fs-headline-h2: clamp(1.56rem, calc(1.44rem + 0.648vw), 1.94rem);
	--fs-headline-h3: clamp(1.25rem, calc(1.21rem + 0.21vw), 1.38rem);
	--fs-headline-h4: clamp(1.13rem, calc(1.05rem + 0.38vw), 1.35rem);
	--fs-headline-h5: clamp(1.13rem, calc(1.05rem + 0.38vw), 1.35rem);	
	--fs-headline-h6: clamp(1.13rem, calc(1.05rem + 0.38vw), 1.35rem);
	--fs-headline-pre: clamp(0.97rem, calc(1.01rem + -0.05vw), 1rem);
	--fs-headline-body-xl: clamp(1.27rem, calc(1.15rem + 0.59vw), 1.62rem);
	--fs-headline-body-l: clamp(1.13rem, calc(1.05rem + 0.38vw), 1.35rem);
	--fs-headline-body-s: clamp(0.89rem, calc(0.87rem + 0.08vw), 0.94rem);
	--fs-headline-body-xs: clamp(0.78rem, calc(0.79rem + -0.01vw), 0.79rem);
	--text-s: clamp(0.89rem, calc(0.87rem + 0.08vw), 0.94rem);
	--test-xs: clamp(0.78rem, calc(0.79rem + -0.01vw), 0.79rem);
}

/*Default body / p font settings */
p{
	font-size: var(--fs-body);
	font-weight:300;
	line-height:1.5;
	margin-bottom: 1.5rem;
	font-family: var(--body-font);
}

/*Default Headings weight, margin, font-family */

h1, h2, h3, h4, h5, h6, .gb-headline-xxl, .gb-headline-xl, .gb-headline-h1, .gb-headling-h2, .gb-headline-h3, .gb-headline-h4, .gb-headline-h5, .gb-headline-h6{
	font-weight:400;
	margin-bottom:.5em;
	font-family:var(--headline-font);
}

/*Heading font-size and line-height*/
.gb-headline-xl{
	font-size: var(--fs-headline-xl);
	line-height:1.05;
}

.h1, .gb-headline-h1, h1{
	font-size:var(--fs-headline-h1);
	line-height:1.05
	}

.h2, .gb-headline-h2, h2{
	font-size:var(--fs-headline-h2);
	line-height:1.05
	}
.h3, .gb-headline-h3, h3{
	font-size:var(--fs-headline-h3);
	line-height:1.1;
	}
.h4, .gb-headline-h4, h4{
	font-size:var(--fs-headline-h4);
	line-height:1.1
	}
.h5, .gb-headline-h5{
	font-size:var(--fs-headline-h5);
	line-height:1.25
	}
.h6, .gb-headline-h6{
	font-size:var(--fs-headline-h6);
	line-height:1.4
	}

.gb-headline-pre{
	font-size:var(--fs-headline-pre);
	text-transform:uppercase;
	letter-spacing:.1em;
}

/*Additional Body font-size */

.gb-headline-body-xl{
	font-family:var(--body-font);
	font-size: var(--fs-headline-body-xl)
}
.gb-headline-body-l{
	font-family:var(--body-font);
	font-size: var(--fs-headline-body-l)
}
.gb-headline-body-s{
	font-family:var(--body-font);
	font-size: var(--fs-headline-body-s)
}
.gb-headline-body-xs{
	font-family:var(--body-font);
	font-size: var(--fs-headline-body-xs)
}

/* Add top margin to blog post H2-H6
.single-post :is(h2,h3,h4,h5,h6){
	margin-top:1.5em
}
*/
/*Button Global Line Height*/
.gb-button{
	line-height:1em
}

/*Remove bottom margin on last paragraph */
.gb-container p:last-child:last-of-type{
	margin-bottom:0px;
}

.block-editor-list__layout .gb-container p:nth-last-child(2){
	margin-bottom:0px;
}

/* -- SECTTIONS -- */

.gb-container-section-xs{
	padding: 1rem clamp(1rem, 0.848rem + 0.758vw, 1.5rem)  clamp(1rem, 0.848rem + 0.758vw, 1.5rem)
}

.gb-container-section-s{
	padding: clamp(1.5rem, 1.5rem + 0vw, 1.5rem) clamp(1rem, 0.848rem + 0.758vw, 1.5rem) clamp(1.5rem, 1.5rem + 0vw, 1.5rem) clamp(1rem, 0.848rem + 0.758vw, 1.5rem)
}

.gb-container-section-m{
padding:clamp(1.5rem, 1.197rem + 1.515vw, 2.5rem) clamp(1rem, 0.848rem + 0.758vw, 1.5rem) clamp(1.5rem, 1.197rem + 1.515vw, 2.5rem) clamp(1rem, 0.848rem + 0.758vw, 1.5rem)
}

.gb-container-section-d{
padding:clamp(3rem, 2.394rem + 3.03vw, 5rem) clamp(1rem, 0.848rem + 0.758vw, 1.5rem) clamp(3rem, 2.394rem + 3.03vw, 5rem)  clamp(1rem, 0.848rem + 0.758vw, 1.5rem)
}

.gb-container-section-l{
padding:clamp(4.5rem, 3.591rem + 4.545vw, 7.5rem) clamp(1rem, 0.848rem + 0.758vw, 1.5rem) clamp(4.5rem, 3.591rem + 4.545vw, 7.5rem)  clamp(1rem, 0.848rem + 0.758vw, 1.5rem)
}

.gb-container-section-xl{
padding:clamp(6rem, 4.788rem + 6.01vw, 10rem) clamp(1rem, 0.848rem + 0.758vw, 1.5rem) clamp(6rem, 4.788rem + 6.01vw, 10rem)  clamp(1rem, 0.848rem + 0.758vw, 1.5rem)
}

/*container widths */

:root{
	--width-m: 64rem;
	--width-s:48rem;
	--width-xs: 40rem
}

/*spacing*/
:root{
	--spacing-xxs:12px;
	--spacing-xs: 24px;
	--spacing-s: 36px;
	--spacing-m: 48px;
	--spacing-l: 60px;
	--spacing-xl:72px
}