/** Shopify CDN: Minification failed

Line 16:0 Unexpected "{"
Line 16:1 Expected identifier but found "%"
Line 18:58 Unexpected "2"
Line 20:1 Expected identifier but found "%"
Line 22:0 Unexpected "{"
Line 22:1 Unexpected "{"
Line 22:3 Expected identifier but found "'section-image-banner.css'"
Line 24:0 Unexpected "{"
Line 24:1 Expected identifier but found "%"
Line 25:13 Unexpected "{"
... and 79 more hidden warnings

**/
{%- comment -%}
  Pup & Pour — Boutique Hero
  Warm, inviting hero with kicker, headline, subtext, and 2 CTAs.
  Designed to feel boutique + dog-friendly: optional paw icon and soft overlay.
{%- endcomment -%}

{{ 'section-image-banner.css' | asset_url | stylesheet_tag }}

{%- style -%}
    #PPHero-{{ section.id }} { --overlay-opacity: {{ section.settings.overlay_opacity | divided_by: 100.0 }}; }
{%- endstyle -%}

<section id="PPHero-{{ section.id }}" class="section pp-hero color-{{ section.settings.color_scheme }} gradient">
  <div class="pp-hero__media media media--cropped global-media-settings">
    {%- if section.settings.image != blank -%}
      <img
        srcset="{%- if section.settings.image.width >= 750 -%}{{ section.settings.image | img_url: '750x' }} 750w,{%- endif -%}
          {%- if section.settings.image.width >= 1100 -%}{{ section.settings.image | img_url: '1100x' }} 1100w,{%- endif -%}
          {%- if section.settings.image.width >= 1500 -%}{{ section.settings.image | img_url: '1500x' }} 1500w,{%- endif -%}
          {{ section.settings.image | img_url: 'master' }} {{ section.settings.image.width }}w"
        sizes="100vw"
        src="{{ section.settings.image | img_url: '1500x' }}"
        loading="eager"
        fetchpriority="high"
        alt="{{ section.settings.image.alt | escape }}"
        width="{{ section.settings.image.width }}"
        height="{{ section.settings.image.width | divided_by: section.settings.image.aspect_ratio }}"
      >
    {%- endif -%}
    <div class="pp-hero__overlay" style="background: rgba(var(--color-foreground), var(--overlay-opacity));"></div>
  </div>

  <div class="pp-hero__content page-width">
    <div class="pp-hero__box content-container content-container--full-width-mobile">
      {%- if section.settings.show_paw and section.settings.kicker != blank -%}
        <div class="pp-hero__kicker">
          <span class="pp-hero__paw" aria-hidden="true">🐾</span>
          <span class="caption-with-letter-spacing">{{ section.settings.kicker | escape }}</span>
        </div>
      {%- elsif section.settings.kicker != blank -%}
        <p class="caption-with-letter-spacing">{{ section.settings.kicker | escape }}</p>
      {%- endif -%}

      {%- if section.settings.heading != blank -%}
        <h1 class="pp-hero__heading {% if section.settings.use_accent_style %}heading-accent{% endif %}">{{ section.settings.heading | escape }}</h1>
      {%- endif -%}

      {%- if section.settings.subtext != blank -%}
        <div class="pp-hero__subtext rte">{{ section.settings.subtext }}</div>
      {%- endif -%}

      <div class="pp-hero__buttons">
        {%- if section.settings.primary_label != blank and section.settings.primary_link != blank -%}
          <a href="{{ section.settings.primary_link }}" class="button button--brand">{{ section.settings.primary_label | escape }}</a>
        {%- endif -%}
        {%- if section.settings.secondary_label != blank and section.settings.secondary_link != blank -%}
          <a href="{{ section.settings.secondary_link }}" class="button button--tertiary">{{ section.settings.secondary_label | escape }}</a>
        {%- endif -%}
      </div>
    </div>
  </div>
</section>

{% schema %}
{
  "name": "Hero — Pup & Pour",
  "tag": "section",
  "class": "section",
  "settings": [
    { "type": "image_picker", "id": "image", "label": "Background image" },
    { "type": "range", "id": "overlay_opacity", "min": 0, "max": 80, "step": 5, "unit": "%", "label": "Overlay opacity", "default": 10 },
    { "type": "text", "id": "kicker", "label": "Kicker", "default": "Pup & Pour" },
    { "type": "text", "id": "heading", "label": "Heading", "default": "Coffee for humans. Community for dog lovers." },
    { "type": "richtext", "id": "subtext", "label": "Subtext", "default": "<p>Small-batch roasts, cozy vibes, and a dog-friendly community.</p>" },
    { "type": "text", "id": "primary_label", "label": "Primary CTA label", "default": "Shop Coffee" },
    { "type": "url", "id": "primary_link", "label": "Primary CTA link" },
    { "type": "text", "id": "secondary_label", "label": "Secondary CTA label", "default": "Find Your Roast" },
    { "type": "url", "id": "secondary_link", "label": "Secondary CTA link" },
    { "type": "checkbox", "id": "use_accent_style", "label": "Use handwritten accent style", "default": false },
    { "type": "checkbox", "id": "show_paw", "label": "Show paw icon with kicker", "default": true },
    {
      "type": "select",
      "id": "color_scheme",
      "label": "Color scheme",
      "default": "background-1",
      "options": [
        { "value": "accent-1", "label": "Accent 1" },
        { "value": "accent-2", "label": "Accent 2" },
        { "value": "background-1", "label": "Background 1" },
        { "value": "background-2", "label": "Background 2" },
        { "value": "inverse", "label": "Inverse" }
      ]
    }
  ],
  "presets": [
    { "name": "Hero — Pup & Pour" }
  ]
}
{% endschema %}