/* Local mockup compositions using existing Arch widgets and Site Settings. */
.widget[data-widget-id="widget_shop_banner"] .widget-content {
  max-width: min(100%, var(--content-width-xs));
}

/* Larger philosophy icons are a local exception to Arch's largest preset. */
.widget[data-widget-id="widget_shop_values"] .w-icon-plain {
  --w-icon-size: var(--space-4xl);
}

.widget[data-widget-id="widget_shop_values"] .w-icon {
  color: var(--colors-highlight_accent);
}

.widget[data-widget-id="widget_shop_values"] .w-description {
  max-width: var(--content-width-sm);
  margin-inline: auto;
}

.widget[data-widget-id="widget_shop_contact"] {
  --accent: var(--colors-highlight_accent);
  --accent-text: var(--colors-highlight_accent_text);
}

@media (min-width: 990px) {
  /* Preserve the mockup's narrower story column and wider shop photograph. */
  .widget[data-widget-id="widget_shop_story"] .text-content {
    width: 40%;
  }

  .widget[data-widget-id="widget_shop_story"] .image-wrapper {
    width: 60%;
  }

  .widget[data-widget-id="widget_shop_values"] .widget-card + .widget-card {
    border-inline-start: var(--border-width-thin) solid var(--border-color);
    padding-inline-start: var(--space-xl);
  }

  .widget[data-widget-id="widget_shop_contact"] .widget-content {
    max-width: 50%;
    margin-inline-start: auto;
  }
}