/** Shopify CDN: Minification failed

Line 113:2 Unexpected "{"
Line 113:3 Expected identifier but found "%"
Line 113:50 Expected identifier but found "%"
Line 114:0 Unexpected "{"
Line 114:1 Unexpected "{"
Line 114:3 Expected identifier but found "'component-collection-hero.css'"
Line 116:0 Unexpected "{"
Line 116:1 Expected identifier but found "%"
Line 132:0 Unexpected "{"
Line 132:1 Expected identifier but found "%"
... and 74 more hidden warnings

**/
.collection-hero__inner {
  display: flex;
  flex-direction: column;
}

.collection-hero--with-image .collection-hero__inner {
  margin-bottom: 0;
  padding-bottom: 2rem;
}

@media screen and (min-width: 750px) {
  .collection-hero.collection-hero--with-image {
    padding: calc(4rem + var(--page-width-margin)) 0 calc(4rem + var(--page-width-margin));
    overflow: hidden;
  }

  .collection-hero--with-image .collection-hero__inner {
    padding-bottom: 0;
  }
}

.collection-hero__text-wrapper {
  flex-basis: 100%;
}

@media screen and (min-width: 750px) {
  .collection-hero {
    padding: 0;
  }

  .collection-hero__inner {
    align-items: center;
    flex-direction: row;
    padding-bottom: 0;
  }
}

.collection-hero__title {
  margin: 2.5rem 0;
}

.collection-hero__title + .collection-hero__description {
  margin-top: 1.5rem;
  margin-bottom: 1.5rem;
  font-size: 1.6rem;
  line-height: calc(1 + 0.5 / var(--font-body-scale));
}

@media screen and (min-width: 750px) {
  .collection-hero__title + .collection-hero__description {
    font-size: 1.8rem;
    margin-top: 2rem;
    margin-bottom: 2rem;
  }

  .collection-hero__description {
    max-width: 66.67%;
  }

  .collection-hero--with-image .collection-hero__description {
    max-width: 100%;
  }
}

.collection-hero--with-image .collection-hero__title {
  margin: 0;
}

.collection-hero--with-image .collection-hero__text-wrapper {
  padding: 5rem 0 4rem;
}

.collection-hero__image-container {
  border: var(--media-border-width) solid rgba(var(--color-foreground), var(--media-border-opacity));
  border-radius: var(--media-radius);
  box-shadow: var(--media-shadow-horizontal-offset) var(--media-shadow-vertical-offset) var(--media-shadow-blur-radius)
    rgba(var(--color-shadow), var(--media-shadow-opacity));
}

@media screen and (max-width: 749px) {
  .collection-hero__image-container {
    height: 20rem;
  }
}

@media screen and (min-width: 750px) {
  .collection-hero--with-image .collection-hero__text-wrapper {
    padding: 4rem 2rem 4rem 0;
    flex-basis: 50%;
  }

  .collection-hero__image-container {
    align-self: stretch;
    flex: 1 0 50%;
    margin-left: 3rem;
    min-height: 20rem;
  }
  {% comment %}theme-check-disable ImgLazyLoading{% endcomment %}
{{ 'component-collection-hero.css' | asset_url | stylesheet_tag }}

{%- style -%}
  @media screen and (max-width: 749px) {
    .collection-hero--with-image .collection-hero__inner {
      padding-bottom: calc({{ settings.media_shadow_vertical_offset | at_least: 0 }}px + 2rem);
    }
  }

  /* Modify Heading Alignment */
  .collection-hero__title {
    text-align: center; /* Center align */
  }

  /* Adjust Heading Size */
  .collection-hero__title {
    font-size: 32px; /* Change font size */
  }
{%- endstyle -%}

<div class="collection-hero{% if section.settings.show_collection_image and collection.image %} collection-hero--with-image{% endif %} color-{{ section.settings.color_scheme }} gradient">
  <div class="collection-hero__inner page-width {% if settings.animations_reveal_on_scroll %} scroll-trigger animate--fade-in{% endif %}">
    <div class="collection-hero__text-wrapper">
      <h1 class="collection-hero__title">
        <span class="visually-hidden">{{ 'sections.collection_template.title' | t }}: </span>
        {{- collection.title | escape -}}
      </h1>

      {%- if section.settings.show_collection_description -%}
        <div class="collection-hero__description rte">{{ collection.description }}</div>
      {%- endif -%}
    </div>

    {%- if section.settings.show_collection_image and collection.image -%}
      <div class="collection-hero__image-container media gradient">
        <img
          srcset="
            {%- if collection.image.width >= 165 -%}{{ collection.image | image_url: width: 165 }} 165w,{%- endif -%}
            {%- if collection.image.width >= 360 -%}{{ collection.image | image_url: width: 360 }} 360w,{%- endif -%}
            {%- if collection.image.width >= 535 -%}{{ collection.image | image_url: width: 535 }} 535w,{%- endif -%}
            {%- if collection.image.width >= 750 -%}{{ collection.image | image_url: width: 750 }} 750w,{%- endif -%}
            {%- if collection.image.width >= 1070 -%}{{ collection.image | image_url: width: 1070 }} 1070w,{%- endif -%}
            {%- if collection.image.width >= 1500 -%}{{ collection.image | image_url: width: 1500 }} 1500w,{%- endif -%}
            {{ collection.image | image_url }} {{ collection.image.width }}w
          "
          src="{{ collection.image | image_url: width: 750 }}"
          sizes="(min-width: {{ settings.page_width }}px) {{ settings.page_width | minus: 100 | divided_by: 2 }}px, (min-width: 750px) calc(50vw - 130px), calc(50vw - 55px)"
          alt=""
          width="{{ collection.image.width }}"
          height="{{ collection.image.height }}"
        >
      </div>
    {%- endif -%}
  </div>
</div>

{% schema %}
{
  "name": "t:sections.main-collection-banner.name",
  "class": "section",
  "settings": [
    {
      "type": "paragraph",
      "content": "t:sections.main-collection-banner.settings.paragraph.content"
    },
    {
      "type": "checkbox",
      "id": "show_collection_description",
      "default": true,
      "label": "t:sections.main-collection-banner.settings.show_collection_description.label"
    },
    {
      "type": "checkbox",
      "id": "show_collection_image",
      "default": false,
      "label": "t:sections.main-collection-banner.settings.show_collection_image.label",
      "info": "t:sections.main-collection-banner.settings.show_collection_image.info"
    },
    {
      "type": "color_scheme",
      "id": "color_scheme",
      "label": "t:sections.all.colors.label",
      "default": "background-1"
    }
  ]

}
{% endschema %}
      
}

.collection-hero__title {
	text-align: center;
}
