/*
 * CherDan Chocolates
 * About page
 */


/* ---------------------------------------------------------
   Page header
   --------------------------------------------------------- */

.cdc-about-header{
  padding: 3.5rem 0 2.5rem;
}


/* ---------------------------------------------------------
   General About sections
   --------------------------------------------------------- */

.cdc-about-section{
  padding: 3.5rem 0;
}

.cdc-about-section--accent{
  background: rgba(255, 255, 255, 0.28);
}


/* ---------------------------------------------------------
   Images
   --------------------------------------------------------- */

.cdc-about-image-wrapper{
  border-radius: 18px;
  overflow: hidden;

  /*
   * Subtle gold framing rather than a heavy black border.
   */
  border: 2px solid rgba(200, 164, 106, 0.55);

  padding: .35rem;

  background: rgba(255, 255, 255, 0.40);
}

.cdc-about-image{
  display: block;
  width: 100%;
  height: auto;

  border-radius: 13px;
}


/* ---------------------------------------------------------
   Teddy section heading
   --------------------------------------------------------- */

.cdc-title-sub{
  margin-top: .35rem;

  font-size: .55em;
  color: var(--cdc-muted);

  /*
   * Helps distinguish "(A.K.A. Turtles)"
   * from the primary section title.
   */
  font-weight: 400;
}

.cdc-heading-divider{
  width: 110px;
  height: 3px;

  margin-top: 1rem;

  background: var(--cdc-gold);
  border-radius: 999px;
}


/* ---------------------------------------------------------
   Closing message
   --------------------------------------------------------- */

.cdc-about-closing{
  padding: 4rem 0;
}

.cdc-about-closing-card{
  max-width: 950px;

  padding: 2.5rem 3rem;

  border-top: 2px solid rgba(200, 164, 106, .65);
  border-bottom: 2px solid rgba(200, 164, 106, .65);
}

.cdc-quote-mark{
  height: 2.5rem;

  color: var(--cdc-gold);

  font-family: var(--cdc-font);
  font-size: 4rem;
  line-height: 1;
}

.cdc-about-closing-text{
  font-size: 1.05rem;
  line-height: 1.9;
}


/* ---------------------------------------------------------
   Mobile
   --------------------------------------------------------- */

@media (max-width: 767.98px){

  .cdc-about-header{
    padding: 2.5rem 0 1.5rem;
  }

  .cdc-about-section{
    padding: 2.5rem 0;
  }

  .cdc-about-closing{
    padding: 2.5rem 0;
  }

  .cdc-about-closing-card{
    padding: 2rem 1rem;
  }

  .cdc-about-closing-text{
    font-size: 1rem;
    line-height: 1.75;
  }

}