/*
 Theme Name:   GP Starter
 Theme URI:    https://generatepress.com
 Description:  GeneratePress child theme by DK John Digital
 Author:       DK John
 Author URI:   https://dkjohn.com
 Template:     generatepress
 Version:      0.1
*/


/* Root values */
:root {
	--px-40: 40px;
	--px-24: 24px;
}

/* TYPOGRAPHY TOKENS */
:root {

  --display-2xl: clamp(3rem,    8vw + 0.5rem,  7rem); /* 48 → 112px */
  --display-xl:  clamp(2.5rem,  6vw + 0.5rem,  5.5rem); /* 40 → 88px  */
  --display-lg:  clamp(2rem,    4.5vw + 0.25rem, 4rem); /* 32 → 64px  */
  --display-md:  clamp(1.75rem, 3.5vw + 0.25rem, 3rem); /* 28 → 48px  */
  --display-sm:  clamp(1.375rem, 2vw + 0.25rem,  2rem); /* 22 → 32px  */

  --h1: clamp(2rem,     3.5vw + 0.5rem,  3.25rem); /* 32 → 52px */
  --h2: clamp(1.625rem, 2.5vw + 0.4rem,  2.5rem); /* 26 → 40px */
  --h3: clamp(1.375rem, 1.8vw + 0.35rem, 2rem); /* 22 → 32px */
  --h4: clamp(1.125rem, 1.2vw + 0.3rem,  1.625rem); /* 18 → 26px */
  --h5: clamp(1rem,     0.8vw + 0.25rem, 1.375rem); /* 16 → 22px */
  --h6: clamp(0.9375rem, 0.5vw + 0.2rem, 1.125rem); /* 15 → 18px */

  --body-xl: clamp(1.0625rem, 0.8vw + 0.2rem,   1.25rem); /* 17 → 20px */
  --body-lg: clamp(0.9375rem, 0.6vw + 0.15rem,  1.0625rem); /* 15 → 17px */
  --body-md: clamp(0.875rem,  0.4vw + 0.1rem,   1rem); /* 14 → 16px */
  --body-sm: clamp(0.8125rem, 0.3vw + 0.05rem,  0.9375rem); /* 13 → 15px */
  --body-xs: clamp(0.75rem,   0.2vw + 0.02rem,  0.8125rem); /* 12 → 13px */

  --label-lg: clamp(0.75rem,   0.3vw + 0.05rem,  0.875rem); /* 12 → 14px */
  --label-md: clamp(0.6875rem, 0.2vw + 0.02rem,  0.8125rem); /* 11 → 13px */
  --label-sm: clamp(0.625rem,  0.15vw + 0.01rem, 0.75rem); /* 10 → 12px */
}

h1, .h1 {
	font-size: var(--h1);
}

h2, .h2 {
	font-size: var(--h2);
}

h3, .h3 {
	font-size: var(--h3);
}

h4, .h4 {
	font-size: var(--h4);
}

h5, .h5 {
	font-size: var(--h5);
}

h6, .h6 {
	font-size: var(--h6);
}

/* END OF TYPOGRAPHY */


/* OTHER VARIABLES */

:root {
	
	/* Border Radius */
	--radius-xs: 6px;
	--radius-sm: 8px;
    --radius-md: 12px;
    --radius-lg: 16px;
    --radius-xl: 20px;
    --radius-pill: 100px;
	
	/* SHADOWS */
	--shadow-sm: 0 1px 4px rgba(15, 22, 38, 0.06);
    --shadow-md: 0 4px 16px rgba(15, 22, 38, 0.08);
    --shadow-lg: 0 8px 32px rgba(22, 102, 217, 0.10);
    --shadow-blue: 0 4px 20px rgba(22, 102, 217, 0.18);
	
	
}

/* END OTHER VARIABLES */


.site-wrapper {
	max-width: 1920px;
	margin: auto;
}



/* Set the main content area to a minimum of 65vh */
#main {
  min-height: 75vh;
} 



/* Header container padding */
header#masthead {
    padding-left: var(--px-40);
    padding-right: var(--px-40);
}

@media screen and (max-width: 768px) {
    header#masthead, .con-px {
        padding-left: var(--px-24);
        padding-right: var(--px-24);
    }
}
/* End Header container padding */



/* HELPER CLASSES */

/* __container X padding class */
.con-px {
	padding-left: var(--px-40);
    padding-right: var(--px-40);
}

@media screen and (max-width: 768px) {
    .con-px {
        padding-left: var(--px-24);
        padding-right: var(--px-24);
    }
}

/* __Contained width for text content */
.content-box {
	max-width: 920px;
}

/* __Hide element with one class */
.hide-block {
	display: none;
}

/* END HELPER CLASSES */