/**
 *
 * CENTER BLOCKS HEADER STYLES
 * center-block-library/blocks/header_page/style.css
 * 
 * Styles for specific page header block both on the front end
 * and in the block editor
 *
 */
/* 


/*=============================================
=            PAGE HEADER            
=============================================*/

/* Page header layout */
.page_header {
  position: relative;
  overflow: hidden;
  margin-bottom: 3em;
}
.page_header > .cb-inside-container {
  padding-top: 8em;
  padding-bottom: 2em;
  z-index: 1;
  position: relative;
  margin-left: var(--default-editor, auto);
  margin-right: var(--default-editor, auto);
}
.page_header.inner-default > .cb-inside-container {
}

/* Default align full */
#editor div[data-title="Page Header"] {
  clear: both;
  max-width: none;
  margin-right: -10px;
  margin-left: -10px;
}
#editor div[data-title="Page Header"] .cb-inside-container {
  padding-right: 10px;
  padding-left: 10px;
}

/* Page header text colors */
.page_header h1,
#editor .block-editor-writing-flow .page_header h1,
.page_header h2,
#editor .block-editor-writing-flow .page_header h2,
.page_header p,
#editor .block-editor-writing-flow .page_header p {
  color: var(--paletteColor8, #ffffff);
}

/* Page header text layout */
.page_header h1,
#editor .block-editor-writing-flow .page_header h1 {
  margin: 0;
}
.page_header h2,
#editor .block-editor-writing-flow .page_header {
  margin: .5em 0 .25em;
}
.page_header p,
#editor .block-editor-writing-flow .page_header p {
  margin: 0;
  max-width: 70ch;
}
.page_header .page_header--intro,
#editor .block-editor-writing-flow .page_header .page_header--intro {
  margin: 1.5em 0 0;
}

/* Page header text typography */
.page_header h1,
#editor .block-editor-writing-flow .page_header h1 {
  font-size: 2rem;
}
.page_header h2,
#editor .block-editor-writing-flow .page_header h2 {
  font-family: freight-sans-pro, sans-serif;
  font-weight: 500;
  font-size: 1.3rem;
  font-style: italic;
  line-height: 1.4;
}

@media screen and (min-width:690px) {
  .page_header h1,
  #editor .block-editor-writing-flow .page_header h1 {
    font-size: 3.1rem
  }
  .page_header h2,
  #editor .block-editor-writing-flow .page_header h2 {
    font-size: 1.6rem;
  }
}

@media screen and (min-width:1000px) {
  .page_header h1,
  #editor .block-editor-writing-flow .page_header h1 {
    font-size: 3.5rem;
  }
  .page_header h2,
  #editor .block-editor-writing-flow .page_header h2 {
    font-size: 1.8rem;
  }
}

.page_header p,
#editor .block-editor-writing-flow .page_header p {
  font-size: 1.25em;
}

/* Page header project subpage */
.page_header .page_project {
  font-style: italic;
}
.page_header .page_project::before {
  content: '';
  display: block;
  height: 1px;
  width: 100px;
  margin-top: 1em;
  margin-bottom: 1em;
  background-color: rgba(255,255,255,.4);
}

/*=====  End of PAGE HEADER  ======*/