/** Shopify CDN: Minification failed

Line 16:0 Unexpected "{"
Line 16:1 Expected identifier but found "%"
Line 16:37 Expected identifier but found "%"
Line 18:0 Unexpected "<"
Line 333:0 Unexpected "<"
Line 338:1 Expected identifier but found "%"
Line 338:36 Expected identifier but found "%"
Line 339:0 Unexpected "<"
Line 341:5 Expected identifier but found "%"
Line 342:6 Unexpected "<"
... and 144 more hidden warnings

**/
{% comment %} Mika Homepage Section {% endcomment %}

<style>
/* ══ MIKA DESIGN TOKENS ══ */
:root {
  --bg:    #A8C2A4;
  --deep:  #3A5C37;
  --mid:   #4A6B47;
  --sage:  #769473;
  --btn:   #C4C176;
  --white: #FCFAF8;
  --raven: #3C3C3C;
}

body { font-family: 'Darker Grotesque', sans-serif; }
.mika-homepage-wrapper { background: var(--bg); }

/* ══ HERO ══ */
.mika-hero { display: grid; grid-template-columns: 1fr 1fr; }
.mika-hero-image { overflow: hidden; }
.mika-hero-image img {
  width: 100%; height: 100%; object-fit: cover;
  display: block; min-height: 75vh;
}
.mika-hero-content {
  display: flex; flex-direction: column; justify-content: flex-end;
  padding: 5vw 5vw 5vw 4vw;
  border-left: 1px solid rgba(58,92,55,0.12);
}
.mika-hero-eyebrow {
  display: flex; align-items: center; gap: 10px; margin-bottom: 2.5rem;
}
.mika-hero-eyebrow-line { width: 28px; height: 1px; background: var(--deep); }
.mika-hero-eyebrow-text {
  font-size: 13px; font-weight: 600; letter-spacing: 0.22em;
  text-transform: uppercase; color: var(--deep); opacity: 0.6;
}
.mika-hero-title {
  font-family: 'Darker Grotesque', sans-serif;
  font-size: clamp(3.9rem, 5.5vw, 7.8rem);
  font-weight: 900; line-height: 0.92; letter-spacing: -0.02em; color: var(--deep);
}
.mika-hero-title em { font-style: italic; font-weight: 800; color: var(--mid); opacity: 0.65; display: block; }
.mika-hero-sub {
  font-size: 26px; font-weight: 700; color: var(--sage);
  line-height: 1.1; max-width: 340px; margin-top: 1.8rem; letter-spacing: 0.01em;
}
.mika-hero-cta-row { display: flex; gap: 12px; margin-top: 2.5rem; }
.mika-btn-primary {
  display: inline-block;
  padding: 13px 28px; background: var(--btn); border: none;
  font-family: 'Darker Grotesque', sans-serif; font-size: 16px; font-weight: 700;
  letter-spacing: 0.1em; text-transform: lowercase; color: var(--raven);
  cursor: pointer; transition: opacity 0.15s; text-decoration: none;
}
.mika-btn-primary:hover { opacity: 0.85; }
.mika-btn-secondary {
  display: inline-block;
  padding: 13px 28px; background: transparent;
  border: 1px solid rgba(58,92,55,0.3);
  font-family: 'Darker Grotesque', sans-serif; font-size: 16px; font-weight: 700;
  letter-spacing: 0.1em; text-transform: lowercase; color: var(--sage);
  cursor: pointer; transition: all 0.15s; text-decoration: none;
}
.mika-btn-secondary:hover { border-color: var(--deep); color: var(--deep); }

/* ══ SECTION HEADER ══ */
.mika-section-header {
  padding: 2.5rem 4vw 1.5rem;
  display: flex; justify-content: space-between; align-items: baseline;
  border-top: 1px solid rgba(58,92,55,0.15);
}
.mika-section-eyebrow {
  font-size: 13px; font-weight: 700; letter-spacing: 0.22em;
  text-transform: uppercase; color: var(--sage); opacity: 0.7;
}
.mika-view-all {
  font-size: 14px; font-weight: 600; color: var(--sage); text-decoration: none;
  letter-spacing: 0.08em; border-bottom: 1px solid rgba(118,148,115,0.3);
  padding-bottom: 2px; transition: color 0.15s;
}
.mika-view-all:hover { color: var(--deep); }

/* ══ COLLECTIONS ══ */
.mika-collections-grid {
  display: grid; grid-template-columns: repeat(4, 1fr);
  border-top: 1px solid rgba(58,92,55,0.12);
}
.col-card {
  position: relative; overflow: hidden;
  border-right: 1px solid rgba(58,92,55,0.12);
  cursor: pointer;
  display: flex; flex-direction: column;
  aspect-ratio: 3 / 4;
  background: #769473;
}
.col-card:nth-child(even) { background: #769473; }
.col-card:last-child { border-right: none; }
.col-swatch-photo {
  position: absolute; inset: 0; z-index: 1;
  background-size: cover; background-position: center;
  background-color: #769473;
  opacity: 0;
  transition: opacity 0.45s ease;
}
.col-swatch-photo::after {
  content: ''; position: absolute; inset: 0;
  background: linear-gradient(to top,
    rgba(0,0,0,0.55) 0%,
    rgba(0,0,0,0.15) 50%,
    transparent 100%
  );
}
.col-card:hover .col-swatch-photo,
.col-card.tapped .col-swatch-photo,
.col-card.blinking .col-swatch-photo { opacity: 1; }
.col-body {
  position: relative; z-index: 2;
  padding: 1.4rem 1.6rem;
  display: flex; flex-direction: column;
  flex: 1;
}
.col-meta {
  display: flex; justify-content: space-between; align-items: baseline;
  margin-bottom: 10px;
}
.col-num {
  font-size: 10px; font-weight: 700; letter-spacing: 0.24em;
  color: rgba(58,92,55,0.5);
  transition: color 0.35s ease;
}
.col-brand {
  font-size: 10px; font-weight: 700; letter-spacing: 0.18em;
  color: rgba(58,92,55,0.5);
  transition: color 0.35s ease;
}
.col-rule {
  height: 1px; background: rgba(58,92,55,0.25);
  margin-bottom: 1rem;
  transition: background 0.35s ease;
}
.col-rule-bottom {
  height: 1px; background: rgba(58,92,55,0.25);
  margin-top: auto; margin-bottom: 10px;
  transition: background 0.35s ease;
}
.col-name {
  font-family: 'Darker Grotesque', sans-serif;
  font-size: clamp(2.4rem, 5.5vw, 4rem);
  font-weight: 900; color: #3A5C37;
  line-height: 0.88; letter-spacing: -0.025em;
  flex: 1; padding-bottom: 1rem;
  transition: color 0.35s ease;
}
.col-name.italic { font-style: italic; }
.col-footer {
  display: flex; justify-content: space-between; align-items: flex-end;
}
.col-sub {
  font-size: 11px; font-weight: 700; color: rgba(58,92,55,0.5);
  line-height: 1.3; max-width: 80%;
  transition: color 0.35s ease;
}
.col-arrow {
  font-size: 14px; font-weight: 700; color: #3A5C37;
  flex-shrink: 0;
  transition: color 0.35s ease;
}
.col-card:hover .col-num,
.col-card.tapped .col-num,
.col-card.blinking .col-num { color: rgba(255,255,255,0.5); }
.col-card:hover .col-brand,
.col-card.tapped .col-brand,
.col-card.blinking .col-brand { color: rgba(255,255,255,0.5); }
.col-card:hover .col-rule,
.col-card.tapped .col-rule,
.col-card.blinking .col-rule { background: rgba(255,255,255,0.3); }
.col-card:hover .col-rule-bottom,
.col-card.tapped .col-rule-bottom,
.col-card.blinking .col-rule-bottom { background: rgba(255,255,255,0.3); }
.col-card:hover .col-name,
.col-card.tapped .col-name,
.col-card.blinking .col-name { color: #fff; }
.col-card:hover .col-sub,
.col-card.tapped .col-sub,
.col-card.blinking .col-sub { color: rgba(255,255,255,0.6); }
.col-card:hover .col-arrow,
.col-card.tapped .col-arrow,
.col-card.blinking .col-arrow { color: #C4C176; }

/* ══ LIFESTYLE / SYSTEM ══ */
.mika-lifestyle { border-top: 1px solid rgba(58,92,55,0.15); }
.mika-lifestyle-body {
  font-size: 25px; font-weight: 700; color: var(--sage);
  line-height: 1.1; max-width: 480px; margin-top: 8px;
}
.mika-photo-grid {
  display: flex;
  flex-direction: row;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch;
  gap: 3px;
  padding: 0 3px 3px;
  scrollbar-width: none;
}
.mika-photo-grid::-webkit-scrollbar { display: none; }
.mika-photo-grid > * {
  flex: 0 0 auto;
  width: 28vw;
  max-width: 380px;
  min-width: 220px;
  scroll-snap-align: start;
}
.mika-photo-grid img { width: 100%; height: 100%; object-fit: cover; display: block; }

/* ══ ARTISTS ══ */
.mika-artists {
  border-top: 1px solid rgba(58,92,55,0.15);
  padding: 4vw; display: grid;
  grid-template-columns: 1fr 2fr; gap: 4rem;
}
.mika-section-title {
  font-family: 'Darker Grotesque', sans-serif;
  font-size: clamp(2.6rem, 3.2vw, 3.64rem);
  font-weight: 900; color: var(--deep); line-height: 0.95; margin-top: 10px; letter-spacing: -0.015em;
}
.mika-section-title em { font-style: italic; font-weight: 800; }
.mika-section-body {
  font-size: 25px; font-weight: 700; color: var(--sage);
  line-height: 1.1; margin-top: 1rem; max-width: 300px;
}
.mika-artist-link {
  display: inline-flex; align-items: center; gap: 6px; margin-top: 1.5rem;
  font-size: 17px; font-weight: 600; letter-spacing: 0.04em;
  color: var(--mid); text-decoration: none;
  border-bottom: 1px solid rgba(74,107,71,0.3); padding-bottom: 2px;
  transition: color 0.15s;
}
.mika-artist-link:hover { color: var(--deep); }
.mika-artists-grid {
  display: grid; grid-template-columns: 1fr 1fr; gap: 1px;
  background: rgba(58,92,55,0.12);
}
.artist-card {
  position: relative; overflow: hidden;
  background: var(--bg); padding: 2rem 2.5rem;
  cursor: pointer;
  min-height: 320px;
  display: flex; flex-direction: column; justify-content: flex-end;
}
.artist-photo {
  position: absolute; inset: 0; z-index: 1;
  background-size: cover; background-position: center top;
  background-color: #3A5C37;
  opacity: 0;
  transition: opacity 0.45s ease;
}
.artist-photo::after {
  content: ''; position: absolute; inset: 0;
  background: linear-gradient(to top,
    rgba(0,0,0,0.65) 0%,
    rgba(0,0,0,0.2) 50%,
    transparent 100%
  );
}
.artist-card:hover .artist-photo,
.artist-card.blinking .artist-photo { opacity: 1; }
.artist-body { position: relative; z-index: 2; }
.artist-card:hover .artist-num, .artist-card.blinking .artist-num { color: rgba(255,255,255,0.5); opacity: 1; }
.artist-card:hover .artist-name, .artist-card.blinking .artist-name { color: var(--white); }
.artist-card:hover .artist-bio, .artist-card.blinking .artist-bio { color: rgba(255,255,255,0.75); }
.artist-num {
  font-size: 13px; font-weight: 700; letter-spacing: 0.16em;
  color: var(--sage); opacity: 0.5; margin-bottom: 10px;
  transition: color 0.35s, opacity 0.35s;
}
.artist-name {
  font-family: 'Darker Grotesque', sans-serif; font-size: 1.82rem;
  font-weight: 800; color: var(--deep); margin-bottom: 8px; line-height: 1.1;
  transition: color 0.35s;
}
.artist-bio { font-size: 23px; font-weight: 700; color: var(--sage); line-height: 1.1; transition: color 0.35s; }
.artist-card.coming {
  background: rgba(196,193,118,0.12);
  grid-column: 1 / -1;
  border-top: 1px solid rgba(196,193,118,0.25);
  display: flex; gap: 3rem; align-items: flex-start; justify-content: flex-start;
  aspect-ratio: unset; min-height: unset;
  flex-direction: row;
}
.artist-card.coming .artist-num { opacity: 1; letter-spacing: 0.2em; color: #C4C176; }
.artist-card.coming .artist-name { font-style: italic; color: var(--mid); opacity: 0.7; }
.artist-card.coming .artist-bio { color: #3A5C37; opacity: 1; max-width: 360px; }
.mika-coming-cta {
  display: inline-block; margin-top: 12px;
  font-size: 22px; font-weight: 700; letter-spacing: 0.06em;
  color: var(--deep); text-decoration: none;
  border-bottom: 1px solid rgba(58,92,55,0.4); padding-bottom: 2px;
  transition: opacity 0.15s;
}
.mika-coming-cta:hover { opacity: 0.7; }

/* ══ RESPONSIVE ══ */
@media (max-width: 900px) {
  .mika-hero { grid-template-columns: 1fr; }
  .mika-hero-image img { min-height: 60vw; }
  .mika-hero-content { border-left: none; border-top: 1px solid rgba(58,92,55,0.12); padding: 8vw 6vw; }
  .mika-collections-grid { grid-template-columns: 1fr; }
  .col-card { aspect-ratio: 3 / 4; }
  .col-name { font-size: clamp(3.5rem, 20vw, 6rem); }
  .mika-artists { grid-template-columns: 1fr; gap: 2rem; }
  .mika-artists-grid { grid-template-columns: 1fr; }
  .artist-card { aspect-ratio: 3 / 4; }
  .artist-card.coming { flex-direction: column; gap: 1rem; aspect-ratio: unset; }
  .mika-photo-grid > * { width: 72vw; min-width: 0; max-width: none; }
}
</style>


<div class="mika-homepage-wrapper">

{%- comment -%} ══ HERO ══ {%- endcomment -%}
<section class="mika-hero">
  <div class="mika-hero-image">
    {%- if section.settings.hero_image != blank -%}
      <img
        src="{{ section.settings.hero_image | image_url: width: 2400 }}"
        srcset="{{ section.settings.hero_image | image_url: width: 800 }} 800w,
                {{ section.settings.hero_image | image_url: width: 1600 }} 1600w,
                {{ section.settings.hero_image | image_url: width: 2400 }} 2400w"
        sizes="50vw"
        width="{{ section.settings.hero_image.width }}"
        height="{{ section.settings.hero_image.height }}"
        alt="{{ section.settings.hero_image.alt | escape }}"
        loading="eager"
        style="width:100%;height:100%;object-fit:cover;display:block;min-height:75vh;"
      >
    {%- else -%}
      <div style="width:100%;min-height:75vh;background:#4A6B47;display:flex;align-items:center;justify-content:center;">
        <span style="font-family:'Darker Grotesque',sans-serif;font-size:11px;letter-spacing:0.18em;color:rgba(255,255,255,0.35);text-transform:uppercase;">hero image</span>
      </div>
    {%- endif -%}
  </div>
  <div class="mika-hero-content">
    <div class="mika-hero-eyebrow">
      <div class="mika-hero-eyebrow-line"></div>
      <span class="mika-hero-eyebrow-text">{{ section.settings.hero_eyebrow }}</span>
    </div>
    <div class="mika-hero-title">{{ section.settings.hero_title | newline_to_br }}</div>
    <p class="mika-hero-sub">{{ section.settings.hero_subtitle }}</p>
    <div class="mika-hero-cta-row">
      <a href="{{ section.settings.hero_cta_1_url }}" class="mika-btn-primary">{{ section.settings.hero_cta_1_label }}</a>
      <a href="{{ section.settings.hero_cta_2_url }}" class="mika-btn-secondary">{{ section.settings.hero_cta_2_label }}</a>
    </div>
  </div>
</section>


{%- comment -%} ══ COLLECTIONS GRID ══ {%- endcomment -%}
<section>
  <div class="mika-section-header">
    <div class="mika-section-eyebrow">COLLECTIONS / BỘ SƯU TẬP</div>
    <a href="{{ section.settings.collections_view_all_url }}" class="mika-view-all">view all →</a>
  </div>
  <div class="mika-collections-grid">
    {%- for block in section.blocks -%}
      {%- if block.type == 'collection_card' -%}
        {%- if block.settings.url != blank -%}
          <a href="{{ block.settings.url }}" class="col-card" {{ block.shopify_attributes }} style="text-decoration:none; display:flex; flex-direction:column;">
        {%- else -%}
          <div class="col-card" {{ block.shopify_attributes }}>
        {%- endif -%}
          {%- if block.settings.image != blank -%}
            <div class="col-swatch-photo" style="background-image:url('{{ block.settings.image | image_url: width: 1200 }}')"></div>
          {%- else -%}
            <div class="col-swatch-photo"></div>
          {%- endif -%}
          <div class="col-body">
            <div class="col-meta">
              <span class="col-num">{{ block.settings.number }}</span>
              <span class="col-brand">MIKA</span>
            </div>
            <div class="col-rule"></div>
            <div class="col-name{% if block.settings.italic %} italic{% endif %}">{{ block.settings.name | newline_to_br }}</div>
            <div class="col-rule-bottom"></div>
            <div class="col-footer">
              <span class="col-sub">{{ block.settings.subtitle }}</span>
              <span class="col-arrow">→</span>
            </div>
          </div>
        {%- if block.settings.url != blank -%}
          </a>
        {%- else -%}
          </div>
        {%- endif -%}
      {%- endif -%}
    {%- endfor -%}
  </div>
</section>


{%- comment -%} ══ SYSTEM PHOTO STRIP ══ {%- endcomment -%}
<section class="mika-lifestyle">
  <div class="mika-section-header">
    <div>
      <div class="mika-section-eyebrow">THE SYSTEM / HỆ THỐNG</div>
      <p class="mika-lifestyle-body">{{ section.settings.system_body }}</p>
    </div>
    <a href="{{ section.settings.system_cta_url }}" class="mika-view-all">{{ section.settings.system_cta_label }}</a>
  </div>
  <div class="mika-photo-grid">
    {%- for block in section.blocks -%}
      {%- if block.type == 'system_photo' -%}
        <div {{ block.shopify_attributes }} style="aspect-ratio:3/4;background:#4A6B47;{% if block.settings.photo != blank %}background-image:url('{{ block.settings.photo | image_url: width: 900 }}');background-size:cover;background-position:center;{% endif %}"></div>
      {%- endif -%}
    {%- endfor -%}
  </div>
</section>


{%- comment -%} ══ ARTISTS ══ {%- endcomment -%}
<section class="mika-artists">
  <div class="mika-artists-intro">
    <div class="mika-section-eyebrow">ARTISTS / NGHỆ SĨ</div>
    <div class="mika-section-title">the cultural<br><em>dialogue</em></div>
    <p class="mika-section-body">Mika platforms independent artists who define the conversation between Vietnamese heritage and contemporary design.</p>
    <a href="{{ section.settings.artists_cta_url }}" class="mika-artist-link">meet all artists →</a>
  </div>
  <div class="mika-artists-grid">
    {%- for block in section.blocks -%}
      {%- if block.type == 'artist_card' -%}
        <div class="artist-card" {{ block.shopify_attributes }}>
          {%- if block.settings.photo != blank -%}
            <div class="artist-photo" style="background-image:url('{{ block.settings.photo | image_url: width: 1200 }}')"></div>
          {%- else -%}
            <div class="artist-photo"></div>
          {%- endif -%}
          <div class="artist-body">
            <div class="artist-num">{{ block.settings.number }}</div>
            <div class="artist-name">{{ block.settings.name }}</div>
            <p class="artist-bio">{{ block.settings.bio }}</p>
          </div>
          <a href="{{ block.settings.url }}" class="mika-artist-link">view collection →</a>
        </div>
      {%- endif -%}
    {%- endfor -%}
    <div class="artist-card coming">
      <div>
        <div class="artist-name">more artists in dialogue</div>
        <p class="artist-bio">we are always in conversation with new makers.</p>
        <a href="mailto:{{ section.settings.contact_email }}" class="mika-coming-cta">are you an artist working with Vietnamese culture? let's talk →</a>
      </div>
    </div>
  </div>
</section>

</div>{{- '<!-- /mika-homepage-wrapper -->' -}}

<script>
  // Collection card tap toggle (mobile) + auto-blink
  const colCards = document.querySelectorAll('.col-card');
  colCards.forEach(card => {
    card.addEventListener('click', () => {
      if (!window.matchMedia('(hover: none)').matches) return;
      const wasActive = card.classList.contains('tapped');
      colCards.forEach(c => c.classList.remove('tapped'));
      if (!wasActive) card.classList.add('tapped');
    });
  });

  // Auto-blink — sequential: one card at a time, no overlap
  function startBlink(cards, interval, duration) {
    const eligible = Array.from(cards).filter(c => !c.classList.contains('coming'));
    if (!eligible.length) return;
    let idx = 0;
    let active = null;

    const cycle = () => {
      if (active) active.classList.remove('blinking');
      active = eligible[idx % eligible.length];
      active.classList.add('blinking');
      idx++;
      setTimeout(() => {
        if (active) active.classList.remove('blinking');
      }, duration);
    };

    cycle();
    setInterval(cycle, interval);
  }

  const artistCards = document.querySelectorAll('.artist-card');
  startBlink(colCards, 3200, 2000);
  startBlink(artistCards, 3200, 2000);
</script>


{% schema %}
{
  "name": "Mika Homepage",
  "tag": "div",
  "settings": [
    {
      "type": "header",
      "content": "Hero"
    },
    {
      "type": "image_picker",
      "id": "hero_image",
      "label": "Hero image"
    },
    {
      "type": "text",
      "id": "hero_eyebrow",
      "label": "Eyebrow text",
      "default": "crafted in Vietnam · 2026"
    },
    {
      "type": "textarea",
      "id": "hero_title",
      "label": "Hero title",
      "default": "one tile. a foundation for modern life. rooted. modern."
    },
    {
      "type": "textarea",
      "id": "hero_subtitle",
      "label": "Hero subtitle",
      "default": "objects of quiet intention — harmonizing cultural heritage with contemporary living, one 9.5cm tile at a time."
    },
    {
      "type": "text",
      "id": "hero_cta_1_label",
      "label": "Button 1 label",
      "default": "explore collections"
    },
    {
      "type": "url",
      "id": "hero_cta_1_url",
      "label": "Button 1 URL"
    },
    {
      "type": "text",
      "id": "hero_cta_2_label",
      "label": "Button 2 label",
      "default": "mika system"
    },
    {
      "type": "url",
      "id": "hero_cta_2_url",
      "label": "Button 2 URL"
    },
    {
      "type": "header",
      "content": "Collections"
    },
    {
      "type": "url",
      "id": "collections_view_all_url",
      "label": "View all collections URL"
    },
    {
      "type": "header",
      "content": "System strip"
    },
    {
      "type": "textarea",
      "id": "system_body",
      "label": "System description",
      "default": "from a single 9.5cm tile to a wall. every configuration is intentional — a ritual base, a tray, a gallery. the object grows with you."
    },
    {
      "type": "text",
      "id": "system_cta_label",
      "label": "System CTA label",
      "default": "explore the system →"
    },
    {
      "type": "url",
      "id": "system_cta_url",
      "label": "System CTA URL"
    },
    {
      "type": "header",
      "content": "Artists"
    },
    {
      "type": "url",
      "id": "artists_cta_url",
      "label": "Meet all artists URL"
    },
    {
      "type": "text",
      "id": "contact_email",
      "label": "Artist contact email",
      "default": "hello@mikagifts.com"
    }
  ],
  "blocks": [
    {
      "type": "collection_card",
      "name": "Collection card",
      "settings": [
        {
          "type": "image_picker",
          "id": "image",
          "label": "Card image"
        },
        {
          "type": "text",
          "id": "number",
          "label": "Number label",
          "default": "01"
        },
        {
          "type": "textarea",
          "id": "name",
          "label": "Collection name",
          "default": "Gạch Việt Nam"
        },
        {
          "type": "checkbox",
          "id": "italic",
          "label": "Italic name",
          "default": false
        },
        {
          "type": "text",
          "id": "subtitle",
          "label": "Subtitle",
          "default": "heritage tile · saigon modernist"
        },
        {
          "type": "url",
          "id": "url",
          "label": "Collection URL"
        }
      ]
    },
    {
      "type": "system_photo",
      "name": "System photo",
      "settings": [
        {
          "type": "image_picker",
          "id": "photo",
          "label": "Photo"
        }
      ]
    },
    {
      "type": "artist_card",
      "name": "Artist card",
      "settings": [
        {
          "type": "image_picker",
          "id": "photo",
          "label": "Artist photo"
        },
        {
          "type": "text",
          "id": "number",
          "label": "Artist number",
          "default": "ARTIST 01"
        },
        {
          "type": "text",
          "id": "name",
          "label": "Artist name",
          "default": "Tú Táo Tợn"
        },
        {
          "type": "textarea",
          "id": "bio",
          "label": "Artist bio",
          "default": "folk illustration & Vietnamese cultural narrative."
        },
        {
          "type": "url",
          "id": "url",
          "label": "Collection URL"
        }
      ]
    }
  ],
  "presets": [
    {
      "name": "Mika Homepage",
      "blocks": [
        { "type": "collection_card", "settings": { "number": "01", "name": "Gạch Việt Nam", "subtitle": "heritage tile · saigon modernist" } },
        { "type": "collection_card", "settings": { "number": "02", "name": "Lập Xuân", "italic": true, "subtitle": "east wing rising · spring 2026" } },
        { "type": "collection_card", "settings": { "number": "03", "name": "Thường Nhựt", "subtitle": "Tú Táo Tợn × Mika · artist collab" } },
        { "type": "collection_card", "settings": { "number": "→", "name": "Tự Thiết Kế", "subtitle": "design your own tile · custom" } },
        { "type": "system_photo" },
        { "type": "system_photo" },
        { "type": "system_photo" },
        { "type": "system_photo" },
        { "type": "system_photo" },
        { "type": "system_photo" },
        { "type": "system_photo" },
        { "type": "system_photo" },
        { "type": "artist_card", "settings": { "number": "ARTIST 01", "name": "Tú Táo Tợn", "bio": "folk illustration & Vietnamese cultural narrative. Thường Nhựt — everyday stories through proverbs and movement." } },
        { "type": "artist_card", "settings": { "number": "ARTIST 02", "name": "TatSy", "bio": "geometric abstraction rooted in traditional Vietnamese motifs. a new voice in the ongoing cultural conversation." } }
      ]
    }
  ]
}
{% endschema %}
