/** Shopify CDN: Minification failed

Line 16:0 Unexpected "{"
Line 16:1 Expected identifier but found "%"
Line 19:1 Expected identifier but found "%"
Line 21:0 Unexpected "{"
Line 21:1 Expected identifier but found "%"
Line 28:12 Unexpected "{"
Line 28:21 Expected ":"
Line 29:16 Expected identifier but found whitespace
Line 29:18 Unexpected "{"
Line 29:27 Expected ":"
... and 124 more hidden warnings

**/
{% comment %}
  Contact Header Section
  Custom section for contact page header with button, heading, description, and info cards
{% endcomment %}

{%- style -%}
  body {
    background: #130022;
    min-height: 100vh;
    background-attachment: fixed;
  }

  .section-{{ section.id }}-padding {
    padding-top: {{ section.settings.padding_top | times: 0.75 | round: 0 }}px;
    padding-bottom: {{ section.settings.padding_bottom | times: 0.75 | round: 0 }}px;
  }

  @media screen and (min-width: 750px) {
    .section-{{ section.id }}-padding {
      padding-top: {{ section.settings.padding_top }}px;
      padding-bottom: {{ section.settings.padding_bottom }}px;
    }
  }

  .contact-header-section {
    background: transparent;
    padding: 60px 20px;
    max-width: 1200px;
    margin: 0 auto;
    width: 100%;
  }

  .contact-header-wrapper {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
  }

  .contact-lets-talk-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 12px 24px;
    background: linear-gradient(180deg, rgba(77, 41, 107, 0.65) 0%, rgba(77, 41, 107, 0) 100%);
    border: 1px solid #6B00B3;
    border-radius: 32px;
    color: #FFFFFF;
    font-weight: 500;
    font-size: 16px;
    text-decoration: none;
    margin-bottom: 40px;
    transition: all 0.3s ease;
    cursor: pointer;
    line-height: 1;
  }

  .contact-lets-talk-btn:hover {
    background: linear-gradient(180deg, rgba(77, 41, 107, 0.8) 0%, rgba(77, 41, 107, 0.2) 100%);
    transform: translateY(-2px);
    color: #FFFFFF;
    text-decoration: none;
  }

  .contact-lets-talk-btn img {
    width: 16px;
    height: 16px;
    flex-shrink: 0;
    display: block;
  }

  .contact-heading {
    color: #FFFFFF;
    font-size: 48px;
    font-weight: 700;
    text-align: center;
    margin: 0 0 20px 0;
    position: relative;
    padding-bottom: 20px;
    line-height: 1.2;
  }

  .contact-heading::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 60px;
    height: 2px;
    background: #E0D9F2;
  }

  .contact-description {
    color: #FFFFFF;
    text-align: center;
    font-size: 18px;
    line-height: 1.6;
    max-width: 800px;
    margin: 0 auto 40px;
    font-weight: 400;
  }

  .contact-description p {
    margin: 0;
  }

  .contact-cards-wrapper {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 30px;
    width: 100%;
    margin-top: 40px;
    max-width: 100%;
  }

  .contact-card {
    background: #FFFFFF;
    border-radius: 16px;
    padding: 32px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
    position: relative;
    width: 100%;
  }

  .contact-card__icon {
    width: 48px;
    height: 48px;
    background: #E0D9F2;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 16px;
    color: #6B00B3;
    flex-shrink: 0;
  }

  .contact-card__icon img {
    width: 24px;
    height: 24px;
    object-fit: contain;
  }

  .contact-card__title {
    font-size: 20px;
    font-weight: 700;
    color: #333333;
    margin: 0 0 12px 0;
    line-height: 1.3;
  }

  .contact-card__separator {
    width: 40px;
    height: 2px;
    background: #6B00B3;
    margin-bottom: 20px;
    display: block;
  }

  .contact-card__content {
    color: #333333;
    font-size: 16px;
    line-height: 1.5;
  }

  .contact-card__content p {
    margin: 0 0 12px 0;
    color: #333333;
  }

  .contact-card__content p:last-child {
    margin-bottom: 0;
  }

  .contact-card__content strong {
    font-weight: 700;
    color: #333333;
    display: block;
    margin-bottom: 4px;
  }

  .contact-card__content ul {
    list-style: none;
    padding: 0;
    margin: 0;
  }

  .contact-card__content li {
    margin-bottom: 12px;
    color: #333333;
  }

  .contact-card__content li:last-child {
    margin-bottom: 0;
  }

  .contact-card__content li strong {
    display: inline;
    margin-right: 8px;
    font-weight: 700;
  }

  @media screen and (max-width: 991px) {
    .contact-header-section {
      padding: 40px 16px;
    }

    .contact-heading {
      font-size: 36px;
    }

    .contact-description {
      font-size: 16px;
    }

    .contact-cards-wrapper {
      grid-template-columns: 1fr;
      gap: 24px;
    }

    .contact-card {
      padding: 24px;
    }
  }
{%- endstyle -%}

<div class="contact-header-section section-{{ section.id }}-padding">
  <div class="page-width">
    <div class="contact-header-wrapper">
      {%- liquid
        assign button_text = section.settings.button_label
        if button_text == blank
          assign button_text = 'templates.contact.header.lets_talk' | t
        endif

        assign heading_text = section.settings.heading
        if heading_text == blank
          assign heading_text = 'templates.contact.header.heading' | t
        endif

        assign description_text = section.settings.description
        if description_text == blank
          assign description_text = 'templates.contact.header.description' | t
        endif

        assign company_title_text = section.settings.company_title
        if company_title_text == blank
          assign company_title_text = 'templates.contact.header.company_details' | t
        endif

        assign company_name_label_text = section.settings.company_name_label
        if company_name_label_text == blank
          assign company_name_label_text = 'templates.contact.header.company_name_label' | t
        endif

        assign vat_label_text = section.settings.vat_label
        if vat_label_text == blank
          assign vat_label_text = 'templates.contact.header.vat_label' | t
        endif

        assign hq_label_text = section.settings.hq_label
        if hq_label_text == blank
          assign hq_label_text = 'templates.contact.header.hq_label' | t
        endif

        assign schedule_title_text = section.settings.schedule_title
        if schedule_title_text == blank
          assign schedule_title_text = 'templates.contact.header.schedule' | t
        endif

        assign schedule_time_label_text = section.settings.schedule_time_label
        if schedule_time_label_text == blank
          assign schedule_time_label_text = 'templates.contact.header.schedule_time_label' | t
        endif

        assign email_label_text = section.settings.email_label
        if email_label_text == blank
          assign email_label_text = 'templates.contact.header.email_label' | t
        endif
      -%}

      {%- if button_text != blank -%}
        <a href="{{ section.settings.button_link | default: '#contact-form' }}" class="contact-lets-talk-btn">
          <img src="/cdn/shop/files/document-text.png?v=1765140033" alt="" width="16" height="16" style="display: block;">
          {{ button_text }}
        </a>
      {%- endif -%}

      {%- if heading_text != blank -%}
        <h1 class="contact-heading">{{ heading_text }}</h1>
      {%- endif -%}

      {%- if description_text != blank -%}
        <div class="contact-description">{{ description_text }}</div>
      {%- endif -%}

      <div class="contact-cards-wrapper">
        {%- comment -%} Company Details Card {%- endcomment -%}
        {%- if company_title_text != blank or section.settings.company_name != blank -%}
          <div class="contact-card contact-card--company">
            <div class="contact-card__icon">
              <img src="/cdn/shop/files/document-text.png?v=1765140033" alt="" width="24" height="24" style="display: block;">
            </div>
            {%- if company_title_text != blank -%}
              <h3 class="contact-card__title">{{ company_title_text }}</h3>
            {%- endif -%}
            <div class="contact-card__separator"></div>
            <div class="contact-card__content">
              {%- if company_name_label_text != blank and section.settings.company_name != blank -%}
                <p>
                  <strong>{{ company_name_label_text }}</strong>
                  {{ section.settings.company_name }}
                </p>
              {%- endif -%}
              {%- if vat_label_text != blank and section.settings.vat != blank -%}
                <p>
                  <strong>{{ vat_label_text }}</strong>
                  {{ section.settings.vat }}
                </p>
              {%- endif -%}
              {%- if hq_label_text != blank and section.settings.hq != blank -%}
                <p>
                  <strong>{{ hq_label_text }}</strong>
                  {{ section.settings.hq }}
                </p>
              {%- endif -%}
            </div>
          </div>
        {%- endif -%}

        {%- comment -%} Schedule Card {%- endcomment -%}
        {%- if schedule_title_text != blank or section.settings.schedule_time != blank -%}
          <div class="contact-card contact-card--schedule">
            <div class="contact-card__icon">
              <img src="/cdn/shop/files/calendar.png?v=1765140038" alt="" width="24" height="24" style="display: block;">
            </div>
            {%- if schedule_title_text != blank -%}
              <h3 class="contact-card__title">{{ schedule_title_text }}</h3>
            {%- endif -%}
            <div class="contact-card__separator"></div>
            <div class="contact-card__content">
              {%- if schedule_time_label_text != blank and section.settings.schedule_time != blank -%}
                <p>
                  <strong>{{ schedule_time_label_text }}</strong>
                  {{ section.settings.schedule_time }}
                </p>
              {%- endif -%}
              {%- if email_label_text != blank and section.settings.email != blank -%}
                <p>
                  <strong>{{ email_label_text }}</strong>
                  {{ section.settings.email }}
                </p>
              {%- endif -%}
            </div>
          </div>
        {%- endif -%}
      </div>
    </div>
  </div>
</div>

{% schema %}
{
  "name": "Contact Header",
  "tag": "section",
  "class": "section contact-header-section",
  "settings": [
    {
      "type": "header",
      "content": "Button"
    },
    {
      "type": "text",
      "id": "button_label",
      "label": "Button label",
      "info": "Leave empty to use translation: templates.contact.header.lets_talk"
    },
    {
      "type": "url",
      "id": "button_link",
      "label": "Button link"
    },
    {
      "type": "header",
      "content": "Heading"
    },
    {
      "type": "text",
      "id": "heading",
      "label": "Heading",
      "info": "Leave empty to use translation: templates.contact.header.heading"
    },
    {
      "type": "header",
      "content": "Description"
    },
    {
      "type": "richtext",
      "id": "description",
      "label": "Description",
      "info": "Leave empty to use translation: templates.contact.header.description"
    },
    {
      "type": "header",
      "content": "Company Details Card"
    },
    {
      "type": "text",
      "id": "company_title",
      "label": "Company card title",
      "info": "Leave empty to use translation: templates.contact.header.company_details"
    },
    {
      "type": "text",
      "id": "company_name_label",
      "label": "Company name label",
      "info": "Leave empty to use translation: templates.contact.header.company_name_label"
    },
    {
      "type": "text",
      "id": "company_name",
      "label": "Company name",
      "default": "OUTFIT TECHNOLOGIES SRL"
    },
    {
      "type": "text",
      "id": "vat_label",
      "label": "VAT label",
      "info": "Leave empty to use translation: templates.contact.header.vat_label"
    },
    {
      "type": "text",
      "id": "vat",
      "label": "VAT",
      "default": "RO43274921"
    },
    {
      "type": "text",
      "id": "hq_label",
      "label": "HQ label",
      "info": "Leave empty to use translation: templates.contact.header.hq_label"
    },
    {
      "type": "text",
      "id": "hq",
      "label": "Headquarters",
      "default": "Paul Urechescu 10, Sector 2, București, România"
    },
    {
      "type": "header",
      "content": "Schedule Card"
    },
    {
      "type": "text",
      "id": "schedule_title",
      "label": "Schedule card title",
      "info": "Leave empty to use translation: templates.contact.header.schedule"
    },
    {
      "type": "text",
      "id": "schedule_time_label",
      "label": "Schedule time label",
      "info": "Leave empty to use translation: templates.contact.header.schedule_time_label"
    },
    {
      "type": "text",
      "id": "schedule_time",
      "label": "Schedule time",
      "default": "Luni - Vineri, 9:00 - 18:00 GMT"
    },
    {
      "type": "text",
      "id": "email_label",
      "label": "Email label",
      "info": "Leave empty to use translation: templates.contact.header.email_label"
    },
    {
      "type": "text",
      "id": "email",
      "label": "Email",
      "default": "stoc(@)unfrosen.com"
    },
    {
      "type": "header",
      "content": "Section padding"
    },
    {
      "type": "range",
      "id": "padding_top",
      "min": 0,
      "max": 100,
      "step": 4,
      "unit": "px",
      "label": "Top padding",
      "default": 60
    },
    {
      "type": "range",
      "id": "padding_bottom",
      "min": 0,
      "max": 100,
      "step": 4,
      "unit": "px",
      "label": "Bottom padding",
      "default": 60
    }
  ],
  "presets": [
    {
      "name": "Contact Header"
    }
  ]
}
{% endschema %}
