test

{% comment %}
  Money Over Memories custom homepage section
  Add this file as: sections/money-over-memories-homepage.liquid
{% endcomment %}

{% liquid
  assign clothing_link = section.settings.clothing_link
  if clothing_link == blank
    assign clothing_link = routes.collections_url
  endif

  assign jewelry_link = section.settings.jewelry_link
  if jewelry_link == blank
    assign jewelry_link = routes.collections_url
  endif

  assign hero_button_link = section.settings.hero_button_link
  if hero_button_link == blank
    assign hero_button_link = routes.all_products_collection_url
  endif
%}

<section
  id="MoneyOverMemories-{{ section.id }}"
  class="money-over-memories-home"
  style="
    --section-bg: {{ section.settings.background_color }};
    --section-text: {{ section.settings.text_color }};
    --section-muted: {{ section.settings.muted_text_color }};
    --section-line: {{ section.settings.line_color }};
    --section-accent: {{ section.settings.accent_color }};
  "
>
  <div class="money-over-memories-hero">
    <div class="money-over-memories-hero__media">
      {% if section.settings.hero_image != blank %}
        {{
          section.settings.hero_image
          | image_url: width: 2400
          | image_tag:
            loading: 'eager',
            fetchpriority: 'high',
            widths: '750, 1100, 1500, 2000, 2400',
            sizes: '100vw',
            class: 'money-over-memories-hero__image'
        }}
      {% else %}
        <div class="money-over-memories-placeholder money-over-memories-placeholder--hero">
          {{ 'lifestyle-2' | placeholder_svg_tag }}
        </div>
      {% endif %}
    </div>

    <div class="money-over-memories-hero__overlay"></div>

    <div class="money-over-memories-shell money-over-memories-hero__content">
      {% if section.settings.hero_eyebrow != blank %}
        <p class="money-over-memories-eyebrow">{{ section.settings.hero_eyebrow }}</p>
      {% endif %}

      {% if section.settings.hero_heading != blank %}
        <h1>{{ section.settings.hero_heading }}</h1>
      {% endif %}

      {% if section.settings.hero_text != blank %}
        <div class="money-over-memories-hero__text">
          {{ section.settings.hero_text }}
        </div>
      {% endif %}

      <div class="money-over-memories-buttons">
        {% if section.settings.hero_button_label != blank %}
          <a class="money-over-memories-button money-over-memories-button--light" href="{{ hero_button_link }}">
            {{ section.settings.hero_button_label }}
          </a>
        {% endif %}

        {% if section.settings.second_button_label != blank %}
          <a class="money-over-memories-button money-over-memories-button--outline" href="{{ jewelry_link }}">
            {{ section.settings.second_button_label }}
          </a>
        {% endif %}
      </div>
    </div>
  </div>

  <div class="money-over-memories-category-grid">
    <a class="money-over-memories-category" href="{{ clothing_link }}">
      <div class="money-over-memories-category__media">
        {% if section.settings.clothing_image != blank %}
          {{
            section.settings.clothing_image
            | image_url: width: 1400
            | image_tag:
              loading: 'lazy',
              widths: '500, 750, 1000, 1400',
              sizes: '(min-width: 750px) 50vw, 100vw',
              class: 'money-over-memories-category__image'
          }}
        {% else %}
          <div class="money-over-memories-placeholder">
            {{ 'collection-1' | placeholder_svg_tag }}
          </div>
        {% endif %}
      </div>
      <div class="money-over-memories-category__overlay"></div>
      <div class="money-over-memories-category__content">
        <span>Shop</span>
        <h2>{{ section.settings.clothing_heading }}</h2>
        <span class="money-over-memories-category__button">View all</span>
      </div>
    </a>

    <a class="money-over-memories-category" href="{{ jewelry_link }}">
      <div class="money-over-memories-category__media">
        {% if section.settings.jewelry_image != blank %}
          {{
            section.settings.jewelry_image
            | image_url: width: 1400
            | image_tag:
              loading: 'lazy',
              widths: '500, 750, 1000, 1400',
              sizes: '(min-width: 750px) 50vw, 100vw',
              class: 'money-over-memories-category__image'
          }}
        {% else %}
          <div class="money-over-memories-placeholder">
            {{ 'collection-2' | placeholder_svg_tag }}
          </div>
        {% endif %}
      </div>
      <div class="money-over-memories-category__overlay"></div>
      <div class="money-over-memories-category__content">
        <span>Shop</span>
        <h2>{{ section.settings.jewelry_heading }}</h2>
        <span class="money-over-memories-category__button">View all</span>
      </div>
    </a>
  </div>

  <div class="money-over-memories-products money-over-memories-shell">
    <div class="money-over-memories-section-heading">
      <h2>{{ section.settings.featured_heading }}</h2>
      {% if section.settings.featured_collection != blank %}
        <a href="{{ section.settings.featured_collection.url }}">View all</a>
      {% endif %}
    </div>

    <div class="money-over-memories-product-grid">
      {% if section.settings.featured_collection != blank %}
        {% for product in section.settings.featured_collection.products limit: section.settings.products_to_show %}
          <article class="money-over-memories-product-card">
            <a href="{{ product.url }}" class="money-over-memories-product-card__media">
              {% if product.featured_image != blank %}
                {{
                  product.featured_image
                  | image_url: width: 900
                  | image_tag:
                    loading: 'lazy',
                    widths: '300, 450, 600, 900',
                    sizes: '(min-width: 990px) 25vw, (min-width: 600px) 50vw, 100vw',
                    class: 'money-over-memories-product-card__image'
                }}
              {% else %}
                <div class="money-over-memories-placeholder">
                  {{ 'product-1' | placeholder_svg_tag }}
                </div>
              {% endif %}

              {% unless product.available %}
                <span class="money-over-memories-badge">Sold out</span>
              {% endunless %}
            </a>

            <div class="money-over-memories-product-card__details">
              <h3><a href="{{ product.url }}">{{ product.title }}</a></h3>
              <div class="money-over-memories-price">
                {% if product.compare_at_price > product.price %}
                  <span class="money-over-memories-price__sale">{{ product.price | money }}</span>
                  <s>{{ product.compare_at_price | money }}</s>
                {% else %}
                  <span>{{ product.price | money }}</span>
                {% endif %}
              </div>
            </div>
          </article>
        {% endfor %}
      {% else %}
        {% for item in (1..4) %}
          <article class="money-over-memories-product-card">
            <div class="money-over-memories-product-card__media">
              <div class="money-over-memories-placeholder">
                {{ 'product-' | append: item | placeholder_svg_tag }}
              </div>
            </div>
            <div class="money-over-memories-product-card__details">
              <h3>Choose a featured collection</h3>
              <div class="money-over-memories-price">$0.00</div>
            </div>
          </article>
        {% endfor %}
      {% endif %}
    </div>
  </div>

  <div class="money-over-memories-story">
    <div class="money-over-memories-story__media">
      {% if section.settings.story_image != blank %}
        {{
          section.settings.story_image
          | image_url: width: 2000
          | image_tag:
            loading: 'lazy',
            widths: '750, 1100, 1500, 2000',
            sizes: '100vw',
            class: 'money-over-memories-story__image'
        }}
      {% endif %}
    </div>
    <div class="money-over-memories-story__overlay"></div>

    <div class="money-over-memories-shell money-over-memories-story__content">
      {% if section.settings.story_heading != blank %}
        <h2>{{ section.settings.story_heading }}</h2>
      {% endif %}

      {% if section.settings.story_text != blank %}
        <div>{{ section.settings.story_text }}</div>
      {% endif %}

      {% if section.settings.story_button_label != blank %}
        <a class="money-over-memories-button money-over-memories-button--outline" href="{{ section.settings.story_button_link }}">
          {{ section.settings.story_button_label }}
        </a>
      {% endif %}
    </div>
  </div>

  {% if section.settings.show_newsletter %}
    <div class="money-over-memories-newsletter">
      <div class="money-over-memories-shell money-over-memories-newsletter__inner">
        <div>
          <h2>{{ section.settings.newsletter_heading }}</h2>
          <p>{{ section.settings.newsletter_text }}</p>
        </div>

        {% form 'customer', class: 'money-over-memories-newsletter__form' %}
          <input type="hidden" name="contact[tags]" value="newsletter">

          <label class="money-over-memories-visually-hidden" for="NewsletterEmail-{{ section.id }}">
            Email address
          </label>

          <div class="money-over-memories-newsletter__fields">
            <input
              id="NewsletterEmail-{{ section.id }}"
              type="email"
              name="contact[email]"
              value="{{ form.email }}"
              autocorrect="off"
              autocapitalize="off"
              autocomplete="email"
              placeholder="Enter your email"
              required
            >
            <button type="submit">{{ section.settings.newsletter_button }}</button>
          </div>

          {% if form.posted_successfully? %}
            <p class="money-over-memories-form-message" tabindex="-1" autofocus>
              Thanks for joining.
            </p>
          {% endif %}

          {% if form.errors %}
            <div class="money-over-memories-form-message money-over-memories-form-message--error">
              {{ form.errors | default_errors }}
            </div>
          {% endif %}
        {% endform %}
      </div>
    </div>
  {% endif %}
</section>

{% style %}
  #MoneyOverMemories-{{ section.id }} {
    background: var(--section-bg);
    color: var(--section-text);
    overflow: hidden;
  }

  #MoneyOverMemories-{{ section.id }} * {
    box-sizing: border-box;
  }

  #MoneyOverMemories-{{ section.id }} a {
    color: inherit;
    text-decoration: none;
  }

  #MoneyOverMemories-{{ section.id }} .money-over-memories-shell {
    width: min(100% - 40px, 1440px);
    margin-inline: auto;
  }

  #MoneyOverMemories-{{ section.id }} .money-over-memories-hero {
    min-height: {{ section.settings.hero_height }}px;
    position: relative;
    display: flex;
    align-items: center;
    border-bottom: 1px solid var(--section-line);
  }

  #MoneyOverMemories-{{ section.id }} .money-over-memories-hero__media,
  #MoneyOverMemories-{{ section.id }} .money-over-memories-story__media {
    position: absolute;
    inset: 0;
  }

  #MoneyOverMemories-{{ section.id }} .money-over-memories-hero__image,
  #MoneyOverMemories-{{ section.id }} .money-over-memories-story__image,
  #MoneyOverMemories-{{ section.id }} .money-over-memories-category__image,
  #MoneyOverMemories-{{ section.id }} .money-over-memories-product-card__image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 500ms ease;
  }

  #MoneyOverMemories-{{ section.id }} .money-over-memories-hero__overlay {
    position: absolute;
    inset: 0;
    background:
      linear-gradient(90deg, rgba(0, 0, 0, 0.92) 0%, rgba(0, 0, 0, 0.68) 42%, rgba(0, 0, 0, 0.12) 75%),
      linear-gradient(0deg, rgba(0, 0, 0, 0.35), transparent 45%);
  }

  #MoneyOverMemories-{{ section.id }} .money-over-memories-hero__content {
    position: relative;
    z-index: 2;
    padding-block: 90px;
  }

  #MoneyOverMemories-{{ section.id }} .money-over-memories-eyebrow,
  #MoneyOverMemories-{{ section.id }} .money-over-memories-category__content > span:first-child {
    margin: 0 0 14px;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.18em;
    text-transform: uppercase;
  }

  #MoneyOverMemories-{{ section.id }} .money-over-memories-hero h1 {
    max-width: 760px;
    margin: 0;
    color: #ffffff;
    font-size: clamp(48px, 7vw, 104px);
    line-height: 0.92;
    letter-spacing: -0.045em;
    text-transform: uppercase;
  }

  #MoneyOverMemories-{{ section.id }} .money-over-memories-hero__text {
    max-width: 560px;
    margin-top: 26px;
    color: rgba(255, 255, 255, 0.82);
    font-size: 17px;
    line-height: 1.6;
  }

  #MoneyOverMemories-{{ section.id }} .money-over-memories-buttons {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 32px;
  }

  #MoneyOverMemories-{{ section.id }} .money-over-memories-button {
    min-height: 50px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 12px 26px;
    border: 1px solid #ffffff;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    transition: 180ms ease;
  }

  #MoneyOverMemories-{{ section.id }} .money-over-memories-button--light {
    background: #ffffff;
    color: #050505;
  }

  #MoneyOverMemories-{{ section.id }} .money-over-memories-button--outline {
    background: rgba(0, 0, 0, 0.12);
    color: #ffffff;
    backdrop-filter: blur(8px);
  }

  #MoneyOverMemories-{{ section.id }} .money-over-memories-button:hover,
  #MoneyOverMemories-{{ section.id }} .money-over-memories-button:focus-visible {
    transform: translateY(-2px);
    background: var(--section-accent);
    border-color: var(--section-accent);
    color: #050505;
  }

  #MoneyOverMemories-{{ section.id }} .money-over-memories-category-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    border-bottom: 1px solid var(--section-line);
  }

  #MoneyOverMemories-{{ section.id }} .money-over-memories-category {
    min-height: 420px;
    position: relative;
    display: flex;
    align-items: flex-end;
    overflow: hidden;
  }

  #MoneyOverMemories-{{ section.id }} .money-over-memories-category:first-child {
    border-right: 1px solid var(--section-line);
  }

  #MoneyOverMemories-{{ section.id }} .money-over-memories-category__media {
    position: absolute;
    inset: 0;
  }

  #MoneyOverMemories-{{ section.id }} .money-over-memories-category__overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(0deg, rgba(0, 0, 0, 0.86), rgba(0, 0, 0, 0.04) 70%);
  }

  #MoneyOverMemories-{{ section.id }} .money-over-memories-category__content {
    position: relative;
    z-index: 2;
    padding: 42px;
  }

  #MoneyOverMemories-{{ section.id }} .money-over-memories-category h2 {
    margin: 0 0 22px;
    color: #ffffff;
    font-size: clamp(36px, 4vw, 62px);
    line-height: 1;
    text-transform: uppercase;
  }

  #MoneyOverMemories-{{ section.id }} .money-over-memories-category__button {
    display: inline-flex;
    min-width: 130px;
    justify-content: center;
    padding: 12px 20px;
    border: 1px solid rgba(255, 255, 255, 0.85);
    color: #ffffff;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.12em;
    text-transform: uppercase;
  }

  #MoneyOverMemories-{{ section.id }} .money-over-memories-category:hover .money-over-memories-category__image {
    transform: scale(1.04);
  }

  #MoneyOverMemories-{{ section.id }} .money-over-memories-products {
    padding-block: 76px 90px;
  }

  #MoneyOverMemories-{{ section.id }} .money-over-memories-section-heading {
    display: flex;
    align-items: center;
    gap: 24px;
    margin-bottom: 30px;
  }

  #MoneyOverMemories-{{ section.id }} .money-over-memories-section-heading h2 {
    margin: 0;
    font-size: clamp(28px, 3vw, 44px);
    line-height: 1;
    letter-spacing: -0.02em;
    text-transform: uppercase;
  }

  #MoneyOverMemories-{{ section.id }} .money-over-memories-section-heading::after {
    content: "";
    height: 1px;
    flex: 1;
    background: var(--section-line);
  }

  #MoneyOverMemories-{{ section.id }} .money-over-memories-section-heading a {
    order: 3;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
  }

  #MoneyOverMemories-{{ section.id }} .money-over-memories-product-grid {
    display: grid;
    grid-template-columns: repeat({{ section.settings.desktop_columns }}, minmax(0, 1fr));
    gap: 18px;
  }

  #MoneyOverMemories-{{ section.id }} .money-over-memories-product-card__media {
    aspect-ratio: 4 / 5;
    position: relative;
    display: block;
    overflow: hidden;
    background: #101010;
  }

  #MoneyOverMemories-{{ section.id }} .money-over-memories-product-card:hover .money-over-memories-product-card__image {
    transform: scale(1.035);
  }

  #MoneyOverMemories-{{ section.id }} .money-over-memories-product-card__details {
    padding-top: 15px;
  }

  #MoneyOverMemories-{{ section.id }} .money-over-memories-product-card h3 {
    margin: 0 0 8px;
    font-size: 13px;
    line-height: 1.35;
    letter-spacing: 0.055em;
    text-transform: uppercase;
  }

  #MoneyOverMemories-{{ section.id }} .money-over-memories-price {
    color: var(--section-muted);
    font-size: 13px;
  }

  #MoneyOverMemories-{{ section.id }} .money-over-memories-price__sale {
    margin-right: 8px;
    color: var(--section-text);
  }

  #MoneyOverMemories-{{ section.id }} .money-over-memories-badge {
    position: absolute;
    top: 12px;
    left: 12px;
    padding: 7px 10px;
    background: #ffffff;
    color: #050505;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
  }

  #MoneyOverMemories-{{ section.id }} .money-over-memories-story {
    min-height: 500px;
    position: relative;
    display: flex;
    align-items: center;
    border-top: 1px solid var(--section-line);
    border-bottom: 1px solid var(--section-line);
    background: radial-gradient(circle at center, #1a1a1a 0%, #050505 70%);
  }

  #MoneyOverMemories-{{ section.id }} .money-over-memories-story__overlay {
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, {{ section.settings.story_overlay | divided_by: 100.0 }});
  }

  #MoneyOverMemories-{{ section.id }} .money-over-memories-story__content {
    position: relative;
    z-index: 2;
    max-width: 760px;
    padding-block: 90px;
    text-align: center;
  }

  #MoneyOverMemories-{{ section.id }} .money-over-memories-story h2 {
    margin: 0;
    color: #ffffff;
    font-size: clamp(42px, 6vw, 82px);
    line-height: 0.98;
    letter-spacing: -0.035em;
    text-transform: uppercase;
  }

  #MoneyOverMemories-{{ section.id }} .money-over-memories-story__content > div {
    max-width: 620px;
    margin: 24px auto 30px;
    color: rgba(255, 255, 255, 0.8);
    font-size: 17px;
    line-height: 1.6;
  }

  #MoneyOverMemories-{{ section.id }} .money-over-memories-newsletter {
    padding-block: 44px;
    border-bottom: 1px solid var(--section-line);
  }

  #MoneyOverMemories-{{ section.id }} .money-over-memories-newsletter__inner {
    display: grid;
    grid-template-columns: minmax(0, 0.8fr) minmax(420px, 1.2fr);
    align-items: center;
    gap: 50px;
  }

  #MoneyOverMemories-{{ section.id }} .money-over-memories-newsletter h2 {
    margin: 0 0 8px;
    font-size: 23px;
    text-transform: uppercase;
  }

  #MoneyOverMemories-{{ section.id }} .money-over-memories-newsletter p {
    margin: 0;
    color: var(--section-muted);
    font-size: 13px;
  }

  #MoneyOverMemories-{{ section.id }} .money-over-memories-newsletter__fields {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 10px;
  }

  #MoneyOverMemories-{{ section.id }} .money-over-memories-newsletter input {
    min-height: 50px;
    width: 100%;
    padding: 0 16px;
    border: 1px solid var(--section-line);
    border-radius: 0;
    background: transparent;
    color: var(--section-text);
  }

  #MoneyOverMemories-{{ section.id }} .money-over-memories-newsletter button {
    min-height: 50px;
    padding: 0 28px;
    border: 1px solid #ffffff;
    border-radius: 0;
    background: #ffffff;
    color: #050505;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    cursor: pointer;
  }

  #MoneyOverMemories-{{ section.id }} .money-over-memories-placeholder {
    width: 100%;
    height: 100%;
    display: grid;
    place-items: center;
    background: #151515;
  }

  #MoneyOverMemories-{{ section.id }} .money-over-memories-placeholder svg {
    width: 100%;
    height: 100%;
    background: #151515;
    fill: #2c2c2c;
  }

  #MoneyOverMemories-{{ section.id }} .money-over-memories-visually-hidden {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
  }

  #MoneyOverMemories-{{ section.id }} .money-over-memories-form-message {
    margin-top: 10px;
    font-size: 13px;
  }

  #MoneyOverMemories-{{ section.id }} .money-over-memories-form-message--error {
    color: #ffb3b3;
  }

  @media screen and (max-width: 989px) {
    #MoneyOverMemories-{{ section.id }} .money-over-memories-product-grid {
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    #MoneyOverMemories-{{ section.id }} .money-over-memories-newsletter__inner {
      grid-template-columns: 1fr;
      gap: 24px;
    }
  }

  @media screen and (max-width: 749px) {
    #MoneyOverMemories-{{ section.id }} .money-over-memories-shell {
      width: min(100% - 28px, 1440px);
    }

    #MoneyOverMemories-{{ section.id }} .money-over-memories-hero {
      min-height: 620px;
      align-items: flex-end;
    }

    #MoneyOverMemories-{{ section.id }} .money-over-memories-hero__overlay {
      background:
        linear-gradient(0deg, rgba(0, 0, 0, 0.95) 0%, rgba(0, 0, 0, 0.42) 72%, rgba(0, 0, 0, 0.15) 100%);
    }

    #MoneyOverMemories-{{ section.id }} .money-over-memories-hero__content {
      padding-block: 90px 54px;
    }

    #MoneyOverMemories-{{ section.id }} .money-over-memories-hero h1 {
      font-size: clamp(44px, 15vw, 72px);
    }

    #MoneyOverMemories-{{ section.id }} .money-over-memories-category-grid {
      grid-template-columns: 1fr;
    }

    #MoneyOverMemories-{{ section.id }} .money-over-memories-category {
      min-height: 360px;
    }

    #MoneyOverMemories-{{ section.id }} .money-over-memories-category:first-child {
      border-right: 0;
      border-bottom: 1px solid var(--section-line);
    }

    #MoneyOverMemories-{{ section.id }} .money-over-memories-category__content {
      padding: 28px;
    }

    #MoneyOverMemories-{{ section.id }} .money-over-memories-products {
      padding-block: 56px 68px;
    }

    #MoneyOverMemories-{{ section.id }} .money-over-memories-section-heading {
      gap: 14px;
    }

    #MoneyOverMemories-{{ section.id }} .money-over-memories-section-heading::after {
      display: none;
    }

    #MoneyOverMemories-{{ section.id }} .money-over-memories-section-heading a {
      margin-left: auto;
    }

    #MoneyOverMemories-{{ section.id }} .money-over-memories-product-grid {
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 12px;
    }

    #MoneyOverMemories-{{ section.id }} .money-over-memories-story {
      min-height: 520px;
    }

    #MoneyOverMemories-{{ section.id }} .money-over-memories-story__content {
      padding-block: 70px;
    }

    #MoneyOverMemories-{{ section.id }} .money-over-memories-newsletter__fields {
      grid-template-columns: 1fr;
    }
  }
{% endstyle %}

{% schema %}
{
  "name": "Money Over Memories Home",
  "tag": "section",
  "class": "section-money-over-memories-home",
  "settings": [
    {
      "type": "header",
      "content": "Hero"
    },
    {
      "type": "image_picker",
      "id": "hero_image",
      "label": "Hero image"
    },
    {
      "type": "text",
      "id": "hero_eyebrow",
      "label": "Small heading",
      "default": "Built from ambition"
    },
    {
      "type": "text",
      "id": "hero_heading",
      "label": "Main heading",
      "default": "Designed to be remembered"
    },
    {
      "type": "richtext",
      "id": "hero_text",
      "label": "Hero text",
      "default": "<p>Premium streetwear and jewelry for those who value money over memories.</p>"
    },
    {
      "type": "text",
      "id": "hero_button_label",
      "label": "First button label",
      "default": "Shop clothing"
    },
    {
      "type": "url",
      "id": "hero_button_link",
      "label": "First button link"
    },
    {
      "type": "text",
      "id": "second_button_label",
      "label": "Second button label",
      "default": "Shop jewelry"
    },
    {
      "type": "range",
      "id": "hero_height",
      "min": 520,
      "max": 900,
      "step": 20,
      "unit": "px",
      "label": "Hero height",
      "default": 720
    },
    {
      "type": "header",
      "content": "Categories"
    },
    {
      "type": "image_picker",
      "id": "clothing_image",
      "label": "Clothing image"
    },
    {
      "type": "text",
      "id": "clothing_heading",
      "label": "Clothing heading",
      "default": "Clothing"
    },
    {
      "type": "url",
      "id": "clothing_link",
      "label": "Clothing link"
    },
    {
      "type": "image_picker",
      "id": "jewelry_image",
      "label": "Jewelry image"
    },
    {
      "type": "text",
      "id": "jewelry_heading",
      "label": "Jewelry heading",
      "default": "Jewelry"
    },
    {
      "type": "url",
      "id": "jewelry_link",
      "label": "Jewelry link"
    },
    {
      "type": "header",
      "content": "Featured products"
    },
    {
      "type": "text",
      "id": "featured_heading",
      "label": "Heading",
      "default": "Newest drop"
    },
    {
      "type": "collection",
      "id": "featured_collection",
      "label": "Collection"
    },
    {
      "type": "range",
      "id": "products_to_show",
      "min": 2,
      "max": 8,
      "step": 1,
      "label": "Products to show",
      "default": 4
    },
    {
      "type": "range",
      "id": "desktop_columns",
      "min": 2,
      "max": 4,
      "step": 1,
      "label": "Desktop columns",
      "default": 4
    },
    {
      "type": "header",
      "content": "Brand story"
    },
    {
      "type": "image_picker",
      "id": "story_image",
      "label": "Background image"
    },
    {
      "type": "text",
      "id": "story_heading",
      "label": "Heading",
      "default": "More than a brand. It's a mindset."
    },
    {
      "type": "richtext",
      "id": "story_text",
      "label": "Text",
      "default": "<p>We're not here to chase memories. We're here to build legacy.</p>"
    },
    {
      "type": "text",
      "id": "story_button_label",
      "label": "Button label",
      "default": "Our story"
    },
    {
      "type": "url",
      "id": "story_button_link",
      "label": "Button link"
    },
    {
      "type": "range",
      "id": "story_overlay",
      "min": 0,
      "max": 90,
      "step": 5,
      "unit": "%",
      "label": "Image darkness",
      "default": 45
    },
    {
      "type": "header",
      "content": "Email signup"
    },
    {
      "type": "checkbox",
      "id": "show_newsletter",
      "label": "Show email signup",
      "default": true
    },
    {
      "type": "text",
      "id": "newsletter_heading",
      "label": "Heading",
      "default": "Join the movement"
    },
    {
      "type": "text",
      "id": "newsletter_text",
      "label": "Text",
      "default": "Be the first to know about new drops and exclusive releases."
    },
    {
      "type": "text",
      "id": "newsletter_button",
      "label": "Button label",
      "default": "Join"
    },
    {
      "type": "header",
      "content": "Colors"
    },
    {
      "type": "color",
      "id": "background_color",
      "label": "Background",
      "default": "#050505"
    },
    {
      "type": "color",
      "id": "text_color",
      "label": "Text",
      "default": "#ffffff"
    },
    {
      "type": "color",
      "id": "muted_text_color",
      "label": "Muted text",
      "default": "#a8a8a8"
    },
    {
      "type": "color",
      "id": "line_color",
      "label": "Lines",
      "default": "#2a2a2a"
    },
    {
      "type": "color",
      "id": "accent_color",
      "label": "Chrome accent",
      "default": "#d9d9d9"
    }
  ],
  "presets": [
    {
      "name": "Money Over Memories Home"
    }
  ]
}
{% endschema %}