/* ==========
Template Defaults
========== */
@import url('https://www.awai.com/_css/framework/templates/chapters/default-chapter.0515.css');

/* ====================
Universal Overrides
==================== */

/* Font Imports */

@font-face {
	font-family: 'Aachen Std';
	src:
	local('AachenStd-Bold'),
	url("/_fonts/AachenStdBold.woff2") format("woff2"),
	url("/_fonts/AachenStdBold.woff") format("woff");
	font-weight: bold;
	font-style: normal;
}

:root {
  /* Base */
  --headlineFontFamily: 'Aachen Std', 'Rockwell Bold', Rockwell, 'Courier Bold', Courier, Georgia, Times, 'Times New Roman', serif;
  --colorHeadline: #000;
  --colorSubhead: #000;
  /*  Colors */
  --color1: #555;
  --color2: #2647c8;
  --color3: #6f8fe4;
  /* Boxes & Quotes*/
  --colorBox1: #f3f3f3;
  --colorBox2: #fcecc7;
  --colorQuoteBorder1: #ffce26;
  /* Bullet Colors */
  --color1Bullet: #000;
  /* Sidebar Navigation Design */
  --navHighlight: #eee;
}

.content .section {
	margin-top: 75px;
}

.content .section .-reverse {
  --colorSubhead: #fff;
}

.content h3,
.content .h3 {
  margin-top: 1.4em;
  text-align: center;
}

.content h4,
.content .h4 {
	font-family: var(--headlineFontFamily);
	color: var(--colorHeadline);
}

.-eyebrow,
.-chin {
  /* small text eyebrows for HXs*/
  display: block;
  font-size: .85em;
}

.section-label {
	color: #666;
  display: block;
	letter-spacing: 1px;
  margin-bottom: 10px;
}

.content .section .-reverse .section-label {
  color: #e5e5e5;
}

.styled-rule {
	background: none;
	border: 3px double #000;
	margin: 2em auto;
	height: auto;
	line-height: 0;
	color: transparent;
}

h2 + .styled-rule {
  margin: 1em auto;
}

.highlight {
	background: url(/_img/content/copywriters-manifesto/highlighter.svg) no-repeat;
	background-size: cover;
	display: inline-block;
}

.callout {
  padding-bottom: 1px;
  margin: 1.4em auto;
}

.doc-nav {
	background-color: #f3f3f3;
	border-radius: 14px;
	max-width: 33em;
	margin: 1.5em auto 2em;
	padding: 25px 40px;
}

.content .dc-headline {
	color: #1a6fd3;
	font-family: var(--bodyFontFamily);
	line-height: 1.2;
	font-size: clamp(1.4em, -0.15em + 5vw, 2em);
}

/* ====================
Headline Overrides + Section: Fear 
==================== */

.hero__content,
.section__fear__header {
	background: linear-gradient(rgba(255, 255, 255, 0.33), rgba(255, 255, 255, 0.33)), url(/_img/content/copywriters-manifesto/paper_background.jpg);
}

.section__fear__header {
  padding: 0 0 1em;
  margin: 0 auto 2rem;
}

.hero__content:before,
.hero__content:after,
.section__fear__header:before {
  content: "";
  display: block;
  width: 100%;
}

.hero__content:before,
.section__fear__header:before {
  background: url(/_img/content/copywriters-manifesto/manifesto_cutout_top.png) no-repeat;
  background-size: cover;
}

.hero__content:before {
  aspect-ratio: 760 / 290;
}

.section__fear__header:before {
  min-height: 290px;
}

.hero__content:after {
  aspect-ratio: 760 / 247;
  background: url(/_img/content/copywriters-manifesto/manifesto_cutout_bottom.png) no-repeat;
  background-size: cover;
}

.content .hero__title {
	color: var(--colorHeadline);
	font-size: 5.5vw;
  font-size: clamp(1.2em, 5.5vw, 40px);
	text-align: left;
	margin: -1.5em auto 1em;
  padding: 0 1rem;
}

.section__fear__header h2 {
  margin-top: -4.5rem;
  padding: 0 1rem;
}

.content .hero__title img {
	margin: 0 0 12px 4rem;
  width: 2.85em;
}

.content .hero__title .-primary {
	font-size: 7.5vw;
  font-size: clamp(1em, 7.5vw, 60px);
}

.content .hero__title .-xl {
	font-size: 2em;
	text-align: right;
	display: block;
}

.content .hero__title .-eyebrow,
.content .hero__title .-chin {
  font-family: var(--bodyFontFamily);
  font-weight: 400;
  margin: 1em auto 0;
  text-align: center;
}

.content .hero__title--deck {
  font-size: 5.2vw;
  font-size: clamp(1em, 5.2vw, 24px);
	font-weight: 700;
  margin: 0 auto 1em;
  padding: 0 10px;
	text-align: center;
}

@media (min-width: 1100px) {
  .content .hero__title {
    font-size: 44px;
  }

  .content .hero__title .-primary {
	  font-size: 1.45em;
  }

  .content .hero__title .-xl {
    font-size: 2em;
  }

  .content .hero__title--deck {
    font-size: 24px;
  }
}

/* ====================
Section: Facts
==================== */

.section__facts__header {
  background: url(/_img/content/copywriters-manifesto/facts_background.jpg) no-repeat right center;
  background-size: cover;
  clip-path: polygon(0 0, 100% 0%, 100% 73%, 0% 100%);
  min-height: 428px;
  margin-bottom: 2rem;
  overflow: hidden;
}

.section__facts__header .section-label {
	background: #061f24;
	transform: rotate(-8deg) translate(-12px,0px);
	transform-origin: left center;
	padding: 1.4em 1em 1em;
}

.section__facts__header .section-headline {
  display: block;
  padding-right: 4rem;
  text-shadow: 0 0 1em #000;
	transform: rotate(-8deg) translate(35px, 5px);
	transform-origin: left center;
}

/* ====================
Section: Sweet Spot
==================== */

.section__sweet_spot__header {
	background: #003e7b;
	display: flex;
	flex-direction: column;
  margin-bottom: 2rem;
}

.section__sweet_spot__header h2 {
	padding: 1rem 1rem 1px;
}

.section__sweet_spot__header:after {
  aspect-ratio: 1 / 1;
	background: url(/_img/content/copywriters-manifesto/sweet_spot_background.jpg) no-repeat right center;
	background-size: cover;
	content: '';
}

@media (min-width: 33em) {
  .section__sweet_spot__header {
    background: url(/_img/content/copywriters-manifesto/sweet_spot_background.jpg) no-repeat center;
    background-size: cover;
    clip-path: polygon(0 0, 100% 0%, 100% 83%, 80% 93%, 0% 100%);
    display: block;
    min-height: 428px;
    overflow: hidden;
    padding: 0 21% 5rem 0;
  }

  .section__sweet_spot__header h2 {
    display: block;
    margin: 3rem 0 0 2rem;
  }

  .section__sweet_spot__header:after {
    display: none;
  }
}

/* ====================
Section: Path
==================== */

.section__path__header {
	background: #015782;
	display: flex;
	flex-direction: column;
  margin-bottom: 2rem;
}

.section__path__header h2 {
	padding: 1rem 1rem 1px;
}

.section__path__header:after {
  aspect-ratio: 1 / 1;
	background: url(/_img/content/copywriters-manifesto/path_background.jpg) no-repeat right center;
	background-size: cover;
	content: '';
}

@media (min-width: 37em) {
  .section__path__header {
    background: url(/_img/content/copywriters-manifesto/path_background.jpg) no-repeat right center;
    background-size: cover;
    clip-path: polygon(0% 15%, 10% 0%, 100% 0%, 100% 65%, 75% 100%, 0% 100%);
    min-height: 428px;
    overflow: hidden;
    padding: 3rem 28% 0 2rem;
  }

  .section__path__header h2 {
    display: block;
    margin: 0 0 0 auto;
    padding: 0;
  }

  .section__path__header:after {
    display: none;
  }
}

/* ====================
Section: Writer's Life
==================== */

.section__wl__header {
	background: #f0eae9;
	display: flex;
	flex-direction: column;
  margin-bottom: 2rem;
}

.section__wl__header h2 {
	padding: 1rem 1rem 1px;
}

.section__wl__header:after {
  aspect-ratio: 4 / 3;
	background: url(/_img/content/copywriters-manifesto/wl_background.jpg) no-repeat right center;
	background-size: cover;
	content: '';
}

@media (min-width: 30em) {
  .section__wl__header {
    background: url(/_img/content/copywriters-manifesto/wl_background.jpg) no-repeat center;
    background-size: cover;
    min-height: 428px;
    overflow: hidden;
    padding: 3.5rem 25% 0 2rem;
  }

  .section__wl__header h2 {
    display: block;
    margin: 0 0 0 auto;
    padding: 0;
  }

  .section__wl__header:after {
    display: none;
  }
}

/* Image Treatments */

figure {
  margin: 0
}

/* Reset default browser values */
figure,
figure.flavor {
  margin: 0 auto;
  padding: 0;
  max-width: 380px;
}

figure img {
  display: block;
  margin: auto;
  max-width: 330px;
}

figure.-border img {
  border: 6px solid #ededed;
}

figure.-shadow img {
  box-shadow: 0 12px 16px -16px #666;
}

figure.-rounded img {
  border-radius: 8px;
}

figure.-inset {
  margin: 0 1em;
}

.-left,
.-right {
  float: none;
}

@media screen and (min-width:35.75em) {

  /*Desktop*/
  figure,
  figure.flavor {
    display: block;
    margin: 0 auto 1em;
    max-width: 100%;
    ;

  }

  figure img {
    display: block;
    margin: 0 auto;
    padding: 0;
    max-width: 100%;

  }

  figure.-full img {
    margin: 0 auto;
  }

  figure.-inset {
    margin: 0 2.5em;
  }

  figure.-left {
    float: right;
    margin: 0 16px 16px 0;
    max-width: 300px;
  }

  figure.-right {
    float: right;
    margin: 0 0 16px 16px;
    max-width: 260px;
  }
}

.fa-ul li .fa-li {
  padding: 4px 0 0;
}

br.alb {
  display: none;
}

@media screen and (min-width:30em) {
  br.alb {
    display: block;
  }

}