/* legend-cta breakpoints, loaded after the shared ones. */

@media (max-width: 900px) {
  /* Updated service CTAs use two 100px photo strips around the copy. */
  body:is(.digital-marketing-page, .seo-page, .email-marketing-page) .legend-cta { height: 558px; margin-top: 80px; }
  body.digital-marketing-page .legend-cta { height: 498px; }
  body:is(.digital-marketing-page, .seo-page, .email-marketing-page) .legend-cta .photo-collage { top: 0; height: 100%; padding: 0; }
  body:is(.digital-marketing-page, .seo-page, .email-marketing-page) .legend-cta .photo-collage__frame { display: flex; flex-direction: column; justify-content: space-between; padding-inline: 16px; }
  body:is(.digital-marketing-page, .seo-page, .email-marketing-page) .legend-cta .photo-collage__strip { display: flex; gap: 12px; overflow: hidden; }
  body:is(.digital-marketing-page, .seo-page, .email-marketing-page) .legend-cta .photo-collage__strip img { position: static; width: 100px; height: 100px; flex: none; }
  body:is(.digital-marketing-page, .seo-page, .email-marketing-page) .legend-cta .photo-collage__rest { display: none; }
  body:is(.digital-marketing-page, .seo-page, .email-marketing-page) .legend-cta__content { top: 144px; width: calc(100% - 32px); padding: 0; background: none; backdrop-filter: none; }
  body.digital-marketing-page .legend-cta__content { top: 134px; }
  body:is(.digital-marketing-page, .seo-page, .email-marketing-page) .legend-cta h2 { max-width: 316px; margin-inline: auto; font-size: 32px; line-height: 32px; }
  body:is(.digital-marketing-page, .seo-page, .email-marketing-page) .legend-cta p { max-width: 322px; margin-top: 20px; font-size: 16px; line-height: 24px; }
  body.seo-page .legend-cta p { max-width: 278px; }
  body.digital-marketing-page .legend-cta p { max-width: 355px; }
  body:is(.digital-marketing-page, .seo-page, .email-marketing-page) .legend-cta__content > div { flex-direction: row; gap: 14px; margin-top: 22px; }
  body.digital-marketing-page .legend-cta__content > div { margin-top: 38px; }
  body:is(.digital-marketing-page, .seo-page, .email-marketing-page) .legend-cta .button { width: 157px; min-width: 0; min-height: 50px; padding-inline: 8px; }
}

@media (max-width: 1100px) {
  body.seo-page .seo-cta { height: 450px; margin-top: 80px; }
  body.seo-page .seo-cta__marks i { width: 28px; height: 28px; }
  body.seo-page .seo-cta__content { padding-top: 93px; }
  body.seo-page .seo-cta h2 { width: 320px; font-size: 32px; line-height: 32px; }
  body.seo-page .seo-cta p { width: 280px; margin-top: 22px; font-size: 16px; line-height: 24px; }
  body.seo-page .seo-cta__content > div { gap: 24px; margin-top: 16px; }
  body.seo-page .seo-cta .button { width: 150px; min-width: 150px; padding-inline: 10px; font-size: 16px; white-space: nowrap; }
}

@media (max-width: 900px) {
  .digital-strategy { height: 500px; margin-top: 80px; }
  .digital-strategy__content { padding: 70px 20px 0; }
  .digital-strategy h2 { width: min(100%,360px); font-size: 40px; line-height: 35px; }
  .digital-strategy h2 em { display: block; }
  .digital-strategy__content > p:not(.eyebrow) { max-width: 360px; font-size: 16px; line-height: 24px; }
  .digital-strategy__content br { display: none; }
  .digital-strategy .button { width: 250px; margin-top: 42px; }
  body.digital-marketing-page .legend-cta { margin-top: 80px; }
  .legend-cta { height: 660px; }
  .legend-cta .photo-collage { top: 0; height: 100%; background-size: 41px 42px; }
  .legend-cta__content { top: 176px; width: calc(100% - 32px); padding: 40px 20px; background: rgba(248,246,242,.9); backdrop-filter: blur(5px); }
  .legend-cta h2 { font-size: 40px; line-height: 40px; }
  .legend-cta p { margin-top: 24px; font-size: 16px; line-height: 24px; }
  .legend-cta__content > div { flex-direction: column; align-items: center; margin-top: 32px; }
  .legend-cta .button { width: 100%; }
  body.web-development-page .legend-cta { height: 550px; margin-top: 50px; }
  body.web-development-page .legend-cta .photo-collage { top: 0; height: 100%; padding: 38px 0 16px; }
  body.web-development-page .legend-cta .photo-collage__frame { display: flex; flex-direction: column; justify-content: space-between; padding-left: 16px; }
  body.web-development-page .legend-cta .photo-collage__strip { display: flex; gap: 12px; }
  body.web-development-page .legend-cta .photo-collage__strip img { position: static; width: 100px; height: 100px; flex: none; }
  body.web-development-page .legend-cta .photo-collage__rest { display: none; }
  body.web-development-page .legend-cta__content { top: 171.3px; width: 380px; padding: 0; background: none; backdrop-filter: none; }
  body.web-development-page .legend-cta h2 { font-size: 32px; line-height: 32px; }
  body.web-development-page .legend-cta h2 em { line-height: 32px; }
  body.web-development-page .legend-cta p { max-width: 380px; margin-top: 21px; font-size: 15px; line-height: 24px; }
  body.web-development-page .legend-cta__content > div { flex-direction: row; margin-top: 36.8px; gap: 14px; transform: none; }
  body.web-development-page .legend-cta .button { width: 157px; min-width: 0; height: 50px; min-height: 50px; flex: none; }
  body.email-marketing-page .email-cta { height: auto; margin-top: 80px; }
  body.email-marketing-page .email-cta__marks i { width: 24px; height: 24px; }
  body.email-marketing-page .email-cta__content { padding: 56px 24px; }
  body.email-marketing-page .email-cta h2 { width: 100%; font-size: 40px; line-height: 42px; }
  body.email-marketing-page .email-cta p { width: 100%; margin-top: 20px; font-size: 16px; line-height: 24px; }
  body.email-marketing-page .email-cta__content > div { margin-top: 32px; flex-direction: column; width: 100%; gap: 12px; }
  body.email-marketing-page .email-cta .button { width: 100%; min-width: 0; }
}

@media (max-width: 900px) {
  body.web-development-page .legend-cta__content { width: min(380px, calc(100% - 32px)); }
	body.branding-page .legend-cta { height: 554px; margin-top: 80px; }
	body.branding-page .legend-cta .photo-collage { top: 0; height: 100%; padding: 0; }
  body.branding-page .legend-cta .photo-collage__frame { display: flex; flex-direction: column; justify-content: space-between; padding-inline: 16px; }
  body.branding-page .legend-cta .photo-collage__strip { display: flex; gap: 12px; overflow: hidden; }
  body.branding-page .legend-cta .photo-collage__strip img { position: static; width: 100px; height: 100px; flex: none; }
  body.branding-page .legend-cta .photo-collage__rest { display: none; }
	body.branding-page .legend-cta__content { position: absolute; top: 154px; left: 50%; width: calc(100% - 32px); padding: 0; transform: translateX(-50%); background: none; backdrop-filter: none; }
  body.branding-page .legend-cta h2 { width: 100%; max-width: 316px; margin-inline: auto; font-size: 32px; line-height: 32px; }
  body.branding-page .legend-cta p { width: 100%; max-width: 295px; margin-top: 20px; font-size: 16px; line-height: 24px; }
  body.branding-page .legend-cta__content > div { flex-direction: row; gap: 14px; margin-top: 30px; }
  body.branding-page .legend-cta .button { width: 157px; min-width: 0; min-height: 50px; padding-inline: 8px; }
}

@media (max-width: 900px) {
	/* The phone frame runs the closing call at 554: two bands of photographs
	   with the copy between them, and the buttons still side by side. */
	body.social-media-marketing-page .legend-cta { height: 554px; margin-top: 80px; }
	body.social-media-marketing-page .legend-cta__content { top: 152px; width: 382px; padding: 0 16px; }
	body.social-media-marketing-page .legend-cta h2 { font-size: 32px; line-height: 32px; }
	body.social-media-marketing-page .legend-cta h2 em { display: block; }
	body.social-media-marketing-page .legend-cta p { max-width: 295px; margin-top: 22px; font-size: 16px; line-height: 24px; }
	body.social-media-marketing-page .legend-cta__content > div { flex-wrap: nowrap; margin-top: 30px; gap: 14px; }
	body.social-media-marketing-page .legend-cta .button { width: 157px; min-width: 0; padding-inline: 8px; }
}

@media (max-width: 900px) {
  .legend-cta .photo-collage__frame {
    padding-inline: var(--rail-left) var(--rail-right);
  }
  .legend-cta .photo-collage__strip {
    max-width: 100%;
    overflow: hidden;
  }
  body:is(.web-development-page,.seo-page,.email-marketing-page,.branding-page,.social-media-marketing-page,.digital-marketing-page) .legend-cta .photo-collage__frame {
    padding-inline: var(--rail-left) var(--rail-right);
  }
}
/* Shared responsive closing CTA: two photo bands, clear copy, paired actions. */
@media (max-width: 900px) {
  body.social-media-marketing-page .legend-cta .photo-collage { padding: 0; }
  body.social-media-marketing-page .legend-cta .photo-collage__frame { display: flex; flex-direction: column; justify-content: space-between; }
  body.social-media-marketing-page .legend-cta .photo-collage__strip { display: flex; gap: 12px; }
  body.social-media-marketing-page .legend-cta .photo-collage__strip img { position: static; width: 100px; height: 100px; flex: none; }
  body.social-media-marketing-page .legend-cta .photo-collage__rest { display: none; }
  body.social-media-marketing-page .legend-cta__content { background: none; backdrop-filter: none; padding: 0; width: calc(100% - 32px); }
  body.social-media-marketing-page .legend-cta__content > div { flex-direction: row; }
}