/** Shopify CDN: Minification failed

Line 190:0 All "@import" rules must come first

**/
/* SHOPIFY_STYLESHEETS_VERSION: 1.0 */


/* CSS from section stylesheet tags */
/* START_SECTION:our-journey (INDEX:50) */
/* ===== Section ===== */
.oj-section {
  width: 100%;
  box-sizing: border-box;
}

/* ===== PC: Full image + text overlay ===== */
.oj-pc {
  position: relative;
  width: 100%;
  overflow: hidden;
  box-sizing: border-box;
}

.oj-pc-img {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: 0;
}

.oj-pc-text {
  position: absolute;
  z-index: 1;
  box-sizing: border-box;
}

.oj-pc-title {
  margin: 0;
  display: flex;
  flex-direction: column;
}

.oj-pc-title-main {
  display: block;
}

.oj-pc-title-sub {
  display: block;
}

.oj-pc-desc {
  margin: 0;
}

/* ===== Screen-reader only (SEO hidden content) ===== */
.oj-sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

/* ===== Mobile layout: hidden on PC ===== */
.oj-mobile-layout {
  display: none;
}

/* ===== Mobile breakpoint ===== */
@media (max-width: 767px) {
  .oj-pc {
    display: none !important;
  }

  .oj-mobile-layout {
    display: block !important;
  }

  .oj-m-img-wrap {
    width: 100%;
  }

  .oj-m-img {
    display: block;
    width: 100%;
    height: auto;
  }

  .oj-m-title {
    margin: 0;
    display: flex;
    flex-direction: column;
  }

  .oj-m-title-main {
    display: block;
  }

  .oj-m-title-sub {
    display: block;
  }

  .oj-m-desc {
    margin: 0;
  }

  /* ===== Timeline ===== */
  .oj-m-timeline {
    width: 100%;
  }

  .oj-m-tl-item {
    position: relative;
  }

  .oj-m-tl-row1 {
    display: flex;
    align-items: center;
  }

  .oj-m-tl-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    overflow: hidden;
    flex-shrink: 0;
    box-sizing: content-box;
  }

  .oj-m-tl-icon img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
  }

  .oj-m-tl-icon span {
    font-size: 12px;
    font-weight: 600;
    opacity: 0.5;
  }

  .oj-m-tl-dot-wrap {
    display: flex;
    flex-direction: column;
    align-items: center;
    flex-shrink: 0;
    position: relative;
  }

  .oj-m-tl-dot {
    border-radius: 50%;
    flex-shrink: 0;
    z-index: 1;
  }

  .oj-m-tl-line {
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translateX(-50%);
    z-index: 0;
  }

  .oj-m-tl-year {
    white-space: nowrap;
  }

  .oj-m-tl-desc {
    margin: 0;
  }
}
/* END_SECTION:our-journey */

/* START_SECTION:why-partner (INDEX:79) */
/* ============================================
   Google Fonts — Inter
   ============================================ */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap');

/* ============================================
   Section: Why Partner
   CSS Variables are in the <style> tag below (Liquid-powered)
   ============================================ */

/* ============================================
   Base
   ============================================ */
.yp-section {
  background-color: var(--yp-bg);
  padding-top: var(--yp-pt);
  padding-bottom: var(--yp-pb);
  padding-left: var(--yp-pl);
  padding-right: var(--yp-pr);
}

.yp-section *,
.yp-section *::before,
.yp-section *::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

.yp-section__container {
  max-width: 100%;
  margin-left: auto;
  margin-right: auto;
}

/* ============================================
   Header (Heading + Subtitle)
   ============================================ */
.yp-header {
  text-align: center;
  margin-bottom: 3rem;
}

.yp-header__title {
  font-family: var(--yp-heading-ff);
  font-size: var(--yp-heading-size);
  font-weight: var(--yp-heading-weight);
  line-height: var(--yp-heading-lh);
  letter-spacing: var(--yp-heading-ls);
  color: var(--yp-heading-color);
  text-align: var(--yp-heading-align);
  margin: 0 0 1rem;
}

.yp-header__subtitle {
  font-family: var(--yp-sub-ff);
  font-size: var(--yp-sub-size);
  font-weight: var(--yp-sub-weight);
  line-height: var(--yp-sub-lh);
  letter-spacing: var(--yp-sub-ls);
  max-width: var(--yp-sub-max-w);
  color: var(--yp-sub-color);
  text-align: var(--yp-sub-align);
  margin-left: auto;
  margin-right: auto;
}

/* ============================================
   Feature Grid
   ============================================ */
.yp-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: var(--yp-card-gap);
}

/* ============================================
   Feature Card
   ============================================ */
.yp-card {
  background-color: var(--yp-card-bg);
  border-radius: var(--yp-card-radius);
  padding: var(--yp-card-pad);
  width: var(--yp-card-w);
  min-height: var(--yp-card-h);
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  box-shadow: var(--yp-card-shadow);
  transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.yp-card:hover {
  transform: translateY(-0.15rem);
}

/* ============================================
   Card Icon
   ============================================ */
.yp-card__icon {
  width: var(--yp-icon-w);
  height: var(--yp-icon-h);
  margin-bottom: 1.25rem;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.yp-card__icon img {
  max-width: 100%;
  max-height: 100%;
  width: auto;
  height: auto;
  object-fit: contain;
}

.yp-card__icon svg {
  width: 100%;
  height: 100%;
}

/* ============================================
   Card Heading
   ============================================ */
.yp-card__heading {
  font-family: var(--yp-ch-ff);
  font-size: var(--yp-ch-size);
  font-weight: var(--yp-ch-weight);
  line-height: var(--yp-ch-lh);
  letter-spacing: var(--yp-ch-ls);
  color: var(--yp-ch-color);
  margin: 0 0 0.75rem;
}

/* ============================================
   Card Description
   ============================================ */
.yp-card__description {
  font-family: var(--yp-cd-ff);
  font-size: var(--yp-cd-size);
  font-weight: var(--yp-cd-weight);
  line-height: var(--yp-cd-lh);
  letter-spacing: var(--yp-cd-ls);
  color: var(--yp-cd-color);
  margin: 0;
}

/* ============================================
   Empty State (Theme Editor only)
   ============================================ */
.yp-empty {
  grid-column: 1 / -1;
  text-align: center;
  padding: 3rem 1rem;
  color: #999;
  font-size: 0.875rem;
}

/* ============================================
   Responsive — Tablet (≤1024px)
   ============================================ */
@media (max-width: 64rem) {
  .yp-header {
    margin-bottom: 2.5rem;
  }
}

/* ============================================
   Responsive — Mobile (≤768px) — static only
   Liquid-powered overrides in <style> tag below
   ============================================ */
@media (max-width: 48rem) {
  .yp-section {
    padding-left: 1rem;
    padding-right: 1rem;
  }

  .yp-header {
    margin-bottom: 2rem;
  }

  .yp-grid {
    grid-template-columns: 1fr;
  }
}
/* END_SECTION:why-partner */