/*
 Theme Name:   Pro-webdiensten Theme 2024
 Theme URI:    https://pro-webdiensten.nl
 Description:  A custom child theme for GeneratePress
 Author:       Erwin van den Bosch
 Author URI:   https://pro-webdiensten.nl
 Template:     generatepress
 Version:      0.1
*/

/* ============== Table of contents ====================
1. Theme tweaks 
2. Utilities
3. Typography
4. Global styles
5. WS Forms
6. CSS grid

======================================================== */

/* +++ 1.THEME TWEAKS +++ */

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

 Site wrapper 
.site-wrapper {
	width: 100%;
	max-width: 1920px;
	margin-inline: auto;
	background-color: var(--surface-10);
}


/* Set the main content height 
#main {
	min-height: 65vh;
}
*/

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


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


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


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

/* +++ 2.UTILITIES +++  */

/* 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;
}

.balance {
  text-wrap: balance;
}

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

/* +++ 3.TYPOGRAPHY +++ */
:root {
  --headline-font: poppins, sans-serif;
  --body-font: poppins, sans-serif;
  --pw-small: clamp(0.8rem, -0.28vi + 0.87rem, 0.62rem);
  --pw-base: clamp(1rem, 0vi + 1rem, 1rem);
  --pw-medium: clamp(1.25rem, 0.57vi + 1.11rem, 1.62rem);
  --pw-large: clamp(1.56rem, 1.62vi + 1.16rem, 2.62rem);
  --pw-xl: clamp(1.95rem, 3.51vi + 1.08rem, 4.24rem);
  --pw-xxl: clamp(2.44rem, 6.79vi + 0.74rem, 6.85rem);
  --pw-xxxl: clamp(3.05rem, 12.36vi + -0.04rem, 11.09rem);
}

/* Default body/ P font settings */

p {
  font-size: var(--pw-medium);
  font-weight: 400;
  line-height: 2.1rem;
  margin-bottom: 1.5rem;
  font-family: var(--body-font);
}

h1 {
  font-size: var(--pw-xxl);
  font-weight: 700;
  line-height: 7rem;
  margin-bottom: 1rem;
  font-family: var(--headline-font);
}

h2,
.looks-h2 {
  font-size: var(--pw-large);
  font-weight: 500;
  line-height: 3.5rem;
  margin-bottom: 1rem;
  font-family: var(--headline-font);
}


.small-p {
	font-size: var(--pw-small);
	font-weight: 400;
	line-height: 1.5rem;
	margin-bottom: 0;
	font-family: var(--body-font);
}
/* Container widths
:root {

	--width-m: 64rem;
	--width-s: 48rem;
	--width-xs: 40rem;
}
 */

/* Navigation */

@media (min-width: 1025px) {
	.nav-float-right #site-navigation {
   	     margin-left: 0;
	}

	.main-navigation {
		width: 100%;
	}

	#primary-menu {
		width: 100%;
	}

}