/*
 Theme Name:   DSP - Bricks Child Theme
 Theme URI:    https://codeslash.net
 Description:  Use this child theme to extend Bricks.
 Author:       Jack Granatowski
 Author URI:   https://codeslash.net
 Template:     bricks
 Version:      1.0
 Text Domain:  bricks
*/


/** Bricks CSS tweaks **/
main#brx-content {
    overflow-x: clip !important;
}

.brx-body {
    min-height: 100vh;
}


/** CUSTOM CSS **/

html {
    scroll-behavior: smooth;
    scroll-padding-top: 100px;
  }

/******* FLUID TYPOGRAPHY *******/
/* For browsers that support clamp  */
@supports (font-size: clamp(1rem, 1vi, 1rem)) {
  :root {
		--text-xs: clamp(1.24rem, 0.01vi + 1.24rem, 1.25rem);
		--text-s: clamp(1.36rem, 0.14vi + 1.32rem, 1.5rem);
		--text-p: clamp(1.5rem, 0.31vi + 1.4rem, 1.8rem);
		--text-h6: clamp(1.65rem, 0.53vi + 1.48rem, 2.16rem);
		--text-h5: clamp(1.82rem, 0.81vi + 1.56rem, 2.59rem);
		--text-h4: clamp(2rem, 1.16vi + 1.63rem, 3.11rem);
		--text-h3: clamp(2.2rem, 1.6vi + 1.68rem, 3.73rem);
		--text-h2: clamp(2.42rem, 2.15vi + 1.73rem, 4.48rem);
		--text-h1: clamp(2.66rem, 2.83vi + 1.75rem, 5.37rem);
  }
}
/* For browsers that don't support clamp */
@supports not (font-size: clamp(1rem, 1vi, 1rem)) {
  :root {
		--text-xs: 1.24rem;
		--text-s: 1.36rem;
		--text-p: 1.5rem;
		--text-h6: 1.65rem;
		--text-h5: 1.82rem;
		--text-h4: 2rem;
		--text-h3: 2.2rem;
		--text-h2: 2.42rem;
		--text-h1: 2.66rem;
  }
  @media screen and (min-width: 1280px) {
    :root {
			--text-xs: 1.25rem;
			--text-s: 1.5rem;
			--text-p: 1.8rem;
			--text-h6: 2.16rem;
			--text-h5: 2.59rem;
			--text-h4: 3.11rem;
			--text-h3: 3.73rem;
			--text-h2: 4.48rem;
			--text-h1: 5.37rem;
    }
  }
}

/**** FLUID SPACE CSS *****/
/* Fluid font size variables, for browsers that support clamp */
@supports (font-size: clamp(1rem, 1vw, 1rem)) {
  :root {
    	--space-xs: clamp(0.52rem, 0.05vw + 0.51rem, 0.56rem);
		--space-s: clamp(0.63rem, 0.31vw + 0.56rem, 0.83rem);
		--space-m: clamp(0.75rem, 0.74vw + 0.58rem, 1.25rem);
		--space-l: clamp(0.9rem, 1.44vw + 0.57rem, 1.88rem);
		--space-xl: clamp(1.08rem, 2.57vw + 0.5rem, 2.81rem);
		--space-2xl: clamp(1.3rem, 4.33vw + 0.32rem, 4.22rem);
		--space-3xl: clamp(1.56rem, 7.07vw + -0.04rem, 6.33rem);
		--space-4xl: clamp(1.87rem, 11.3vw + -0.68rem, 9.49rem);
  }
}


/* Fallback variables for browsers that don't support clamp */
@supports not (font-size: clamp(1rem, 1vw, 1rem)) {
  :root {
    	--space-xs: 0.52rem;
		--space-s: 0.63rem;
		--space-m: 0.75rem;
		--space-l: 0.9rem;
		--space-xl: 1.08rem;
		--space-2xl: 1.3rem;
		--space-3xl: 1.56rem;
		--space-4xl: 1.87rem;
  }
  @media screen and (min-width: 1440px) {
    :root {
      		--space-xs: 0.56rem;
			--space-s: 0.83rem;
			--space-m: 1.25rem;
			--space-l: 1.88rem;
			--space-xl: 2.81rem;
			--space-2xl: 4.22rem;
			--space-3xl: 6.33rem;
			--space-4xl: 9.49rem;
    }
  }
}