/* ==========================================================================
   Full Width Content Section
   Layout: full_width_content
   Container-wide title + rich-text WYSIWYG content block.
   ========================================================================== */

.full-width-content-title {
    margin: 0 0 24px;
}

.full-width-content-body {
    color: #4a4f57;
    font-size: var(--font-size-18px);
    line-height: 1.6;
}

.full-width-content-body > *:first-child {
    margin-top: 0;
}
.full-width-content-body > *:last-child {
    margin-bottom: 0;
}

.full-width-content-body h2,
.full-width-content-body h3,
.full-width-content-body h4 {
    color: var(--color-blue-deep);
    margin: 28px 0 12px;
    line-height: 1.2;
}
.full-width-content-body h2 { font-size: var(--font-size-32px); }
.full-width-content-body h3 { font-size: var(--font-size-24px); }
.full-width-content-body h4 { font-size: var(--font-size-20px); }

.full-width-content-body p {
    margin: 0 0 14px;
}

.full-width-content-body a {
    color: var(--color-blue);
    font-weight: 700;
    text-decoration: none;
}
.full-width-content-body a:hover {
    color: var(--color-blue-deep);
    text-decoration: underline;
}

.full-width-content-body img {
    max-width: 100%;
    height: auto;
    border-radius: var(--radius);
    margin: 14px 0;
}

.full-width-content-body blockquote {
    border-left: 4px solid var(--color-green);
    background: var(--color-blue-tint);
    padding: 18px 22px;
    margin: 20px 0;
    color: var(--color-blue-deep);
    font-style: italic;
}

/* When blog.css is also loaded (this section uses `.entry-content` to reuse
   shared editor typography), neutralize the card-style padding and the
   .alignfull negative margin that blog.css applies inside a "card". This
   section already sits inside `.container`, so those values would break
   the layout. Scoped to `.full-width-content-body` so only THIS section is
   affected. */
.full-width-content-body.entry-content {
    padding: 0;
}
.full-width-content-body.entry-content .alignfull {
    margin-left: 0;
    margin-right: 0;
}