/* Morrowpeak: styles for newer page sections (promises, guides) */

/* ---------- Promises (vs other marketing companies) ---------- */
.promise-grid { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 0; border-top: 1px solid var(--line); border-left: 1px solid var(--line); }
.promise { padding: 26px 26px 24px; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); display: flex; flex-direction: column; }
.promise h3 { font-size: 1.4rem; color: var(--ink); margin-bottom: 6px; }
.promise p { margin: 0; color: var(--ink); line-height: 1.5; }
.promise .promise__instead { margin-top: auto; padding-top: 14px; font-size: .9rem; color: var(--steel); text-decoration: line-through; text-decoration-color: rgba(179, 38, 30, .55); }

/* ---------- Guides ---------- */
.guide__head { max-width: 820px; }
.guide__crumb { display: flex; gap: 8px; font-size: .9rem; color: var(--steel); margin-bottom: 14px; }
.guide__head h1 { font-size: 2.9rem; }
.guide__meta { font-size: .95rem !important; color: var(--steel); margin: 0; }
.guide__body { max-width: 820px; padding-top: 44px; padding-bottom: 80px; }
.guide__answer { background: var(--paper); border: 1px solid var(--line); border-left: 4px solid var(--yellow); border-radius: 4px; padding: 20px 24px; margin-bottom: 44px; }
.guide__answer p { margin: 0; font-size: 1.1rem; line-height: 1.6; }
.guide__answer .guide__answer-label { font-weight: 700; font-size: .9rem; color: var(--steel); margin-bottom: 6px; }
.guide__section { margin-bottom: 44px; }
.guide__section h2 { font-size: 2rem; }
.guide__section > p { font-size: 1.06rem; }
.guide__example { margin: 18px 0 0; border: 1px solid var(--line); border-radius: 6px; padding: 16px 18px; background: var(--white); }
.guide__example figcaption { font-size: .85rem; font-weight: 700; color: var(--steel); margin-bottom: 8px; }
.guide__review { margin: 0; }
.guide__review p { margin: 0; font-size: 1rem; }
.guide__source { font-size: .88rem; color: var(--steel); }
.guide__cta { background: var(--blue); color: var(--white); border-radius: 6px; padding: 32px; }
.guide__cta h2 { color: var(--white); font-size: 1.9rem; }
.guide__cta p { color: #D5DEE8; }

@media (max-width: 960px) {
  .promise-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 640px) {
  .promise-grid { grid-template-columns: 1fr; }
  .guide__head h1 { font-size: 2.2rem; }
  .guide__cta { padding: 24px; }
}

/* ---------- Footer: three columns (photo credits removed) ---------- */
@media (min-width: 961px) {
  .site-footer__grid { grid-template-columns: 1.6fr 1fr 1fr; }
}

/* ---------- Service page banners: keep faces in frame ---------- */
.page-hero__bg { object-position: center 28%; }

/* ---------- Checkout (get started) ---------- */
.checkout__billing { margin: 0 0 24px; }
.checkout__label { font-weight: 700; margin: 0 0 8px; }
.checkout .billing-toggle { margin: 0; }
.checkout__note { margin: 0 0 22px; background: var(--yellow-soft); border: 1px solid #E9D48A; border-radius: 4px; padding: 14px 16px; color: #4A3A00; font-weight: 600; line-height: 1.5; }
.checkout__fine { margin: 14px 0 0; font-size: .9rem; color: var(--steel); }

/* ---------- Legal and utility pages ---------- */
.legal__head { max-width: 820px; }
.legal__updated { font-size: .95rem !important; margin-top: 6px !important; }
.legal__body { max-width: 820px; padding-top: 40px; padding-bottom: 80px; }
.legal__intro { font-size: 1.12rem; }
.legal__section { margin-top: 34px; }
.legal__section h2 { font-size: 1.6rem; }
.legal__callout { background: var(--yellow-soft); border-left: 4px solid var(--yellow); border-radius: 4px; padding: 14px 18px; font-weight: 600; color: #4A3A00; }

/* ---------- Footer legal links ---------- */
.site-footer__bottom { display: flex; justify-content: space-between; align-items: center; gap: 12px 24px; flex-wrap: wrap; }
.site-footer__legal { display: flex; gap: 20px; list-style: none; margin: 0; padding: 0; }
.site-footer__legal li { margin: 0; }

/* ---------- About: who you'll hear from ---------- */
.team { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); gap: 48px; align-items: center; }
.team__intro h2 { margin-bottom: 12px; }
.team__intro p { font-size: 1.1rem; color: var(--steel); margin: 0; }
.team__people { list-style: none; margin: 0; padding: 0; display: grid; gap: 14px; }
.person { display: flex; align-items: center; gap: 16px; border: 1px solid var(--line); border-radius: 6px; padding: 16px 20px; background: var(--white); }
.person__avatar { width: 52px; height: 52px; font-size: 1.05rem; flex: 0 0 52px; }
.person__name { display: block; font-family: var(--font-head); font-weight: 700; font-size: 1.35rem; color: var(--ink); line-height: 1.2; }
.person__role { display: block; color: var(--steel); font-size: .95rem; }
@media (max-width: 960px) {
  .team { grid-template-columns: 1fr; gap: 24px; }
}