
/* ===== template-parts/faqs/section-banner/assets/styles.css ===== */
.faq-hero {
  position: relative;
  width: 100%;
  height: 100vh;
  overflow: hidden;
}

.faq-hero__media {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

.faq-hero__bg {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.faq-hero__bg--mobile {
  display: none;
}

.faq-hero__overlay {
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 25.75rem;
  background: linear-gradient(
    180deg,
    rgba(106, 0, 2, 0) 40.28%,
    rgba(106, 0, 2, 0.36) 59.73%,
    rgba(106, 0, 2, 0.56) 74.25%,
    rgba(75, 0, 1, 0.7) 100%
  );
  pointer-events: none;
}

.faq-hero__container {
  position: relative;
  z-index: 2;
  width: 100%;
  max-width: 96rem;
  height: 100%;
  margin: 0 auto;
  padding: 0 4.25rem;
}

.faq-hero__content {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  padding-bottom: 3.5rem;
}

.faq-hero__text {
  max-width: 47rem;
}

.faq-hero__title {
  margin: 0;
  color: var(--Text-inv-100, #f7f4ec);
  font-family: Phudu, sans-serif;
  font-size: 3.625rem;
  font-style: normal;
  font-weight: 700;
  line-height: 110%;
  max-width: 33.784rem;
  text-transform: uppercase;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  line-clamp: 2;
  overflow: hidden;
  text-overflow: ellipsis;
}

.faq-hero__desc {
  margin: 1.25rem 0 0;
  color: var(--Text-inv-100, #f7f4ec);
  
  font-size: 1.125rem;
  font-style: normal;
  font-weight: 400;
  max-width: 38rem;

  line-height: 150%;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
  line-clamp: 1;
  overflow: hidden;
  text-overflow: ellipsis;
}

.faq-hero__search {
  display: flex;
  width: 34.375rem;
  height: 4rem;
  padding: 0.875rem 1.19rem;
  justify-content: space-between;
  align-items: center;
  background: var(--icon-mng-trng-20, rgba(246, 243, 234, 0.2));
  backdrop-filter: blur(0.125rem);
}

.faq-hero__input {
  width: 100%;
  border: 0;
  outline: 0;
  background: transparent;
  color: var(--Text-inv-100, #f7f4ec);
  
  font-size: 1.125rem;
  font-style: normal;
  font-weight: 400;
  line-height: 150%;
}

.faq-hero__input::placeholder {
  color: var(--Text-inv-100, #f7f4ec);
  opacity: 1;
}

.faq-hero__button {
  width: 1.625rem;
  height: 1.625rem;
  flex-shrink: 0;
  
  padding: 0;
  border: 0;
  background: transparent;
  cursor: pointer;
}

.faq-hero__icon {
  width: 100%;
  height: 100%;
  display: block;
}

@media screen and (max-width: 639.98px) {
  .faq-hero {
    height: 36rem;
  }

  .faq-hero__bg--desktop {
    display: none;
  }

  .faq-hero__bg--mobile {
    display: block;
  }

  .faq-hero__overlay {
    height: 18.1875rem;
    background: linear-gradient(
      180deg,
      rgba(106, 0, 2, 0) 40.28%,
      rgba(106, 0, 2, 0.31) 59.73%,
      rgba(106, 0, 2, 0.48) 74.25%,
      rgba(75, 0, 1, 0.6) 100%
    );
  }

  .faq-hero__container {
    padding: 0 0.75rem;
  }

  .faq-hero__content {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    justify-content: flex-end;
    padding-bottom: 1.25rem;
  }

  .faq-hero__text {
    max-width: 100%;
  }

  .faq-hero__title {
    color: var(--Text-inv-100, #f7f4ec);
    font-family: Phudu, sans-serif;
    font-size: 1.875rem;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    text-transform: uppercase;
  }

  .faq-hero__desc {
    margin-top: 0.75rem;
    color: var(--Text-inv-100, #f7f4ec);
    
    font-size: 0.875rem;
    font-style: normal;
    font-weight: 400;
     -webkit-line-clamp: 2;
  line-clamp: 2;
    line-height: 150%;
  }

  .faq-hero__search {
    width: 100%;
    margin-top: 1rem;
    height: 2.375rem;
    padding: 0.375rem 1.19rem;
    align-self: stretch;
  }

  .faq-hero__input {
    font-size: 0.875rem;
    line-height: 150%;
  }

  .faq-hero__button {
    width: 1.17363rem;
    height: 1.17363rem;
  }
}

/* ===== template-parts/faqs/section-question/assets/styles.css ===== */
.faq-section {
  position: relative;
  padding: 7.5rem 0 0rem;
  overflow: hidden;
}
.faq-section__bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 0;
  object-fit: cover;
}
.faq-section__answer > * {
  margin: 0;
}

.faq-section__answer > *:not(:first-child) {
  margin-top: 0.75rem;
}

.faq-section__answer h1,
.faq-section__answer h2,
.faq-section__answer h3,
.faq-section__answer h4,
.faq-section__answer h5,
.faq-section__answer h6 {
  margin: 0;
  color: var(--Text-Title---Highlight-100, #680103);
  font-family: "SF Pro Display", sans-serif;
  font-size: 1.25rem;
  font-style: normal;
  font-weight: 700;
  line-height: 130%;
}

.faq-section__answer p {
  margin: 0;
  color: var(--Text-Body-80, rgba(29, 29, 29, 0.8));
  font-family: "SF Pro Display", sans-serif;
  font-size: 1.125rem;
  font-style: normal;
  font-weight: 400;
  line-height: 150%;
}

.faq-section__answer ul,
.faq-section__answer ol {
  margin: 0;
  padding-left: 1.5rem;
}

.faq-section__answer li {
  margin: 0;
  color: var(--Text-Body-80, rgba(29, 29, 29, 0.8));
  font-family: "SF Pro Display", sans-serif;
  font-size: 1.125rem;
  font-style: normal;
  font-weight: 400;
  line-height: 150%;
}

.faq-section__answer li + li {
  margin-top: 0.25rem;
}

.faq-section__answer strong,
.faq-section__answer b {
  color: var(--Text-Title---Highlight-100, #680103);
  font-weight: 700;
}

.faq-section__answer a {
  color: var(--Text-Title---Highlight-100, #680103);
  text-decoration: underline;
}

.faq-section__answer br {
  display: block;
  content: "";
  margin-top: 0.25rem;
}

.faq-section__container {
  width: 100%;
  max-width: 100rem;
   position: relative;
  z-index: 1;
  margin: 0 auto;
  padding: 0 4.25rem;
}

.faq-section__label {
  margin: 0;
  color: var(--Text-Title---Highlight-100, #680103);
  text-align: center;
  font-family: Phudu, sans-serif;
  font-size: 1.5rem;
  font-style: normal;
  font-weight: 600;
  line-height: 110%;
}

.faq-section__title {
  margin: 1.5rem 0 2.88rem;
  color: var(--Text-Title---Highlight-100, #680103);
  text-align: center;
  font-family: Phudu, sans-serif;
  font-size: 3.625rem;
  font-style: normal;
  font-weight: 700;
  line-height: 110%;
  text-transform: uppercase;
}

.faq-section__list {
  width: 100%;
}

.faq-section__item {
  height: auto;
  background: #fff;
  border-bottom: 0.0625rem solid #f1eadf;
}

.faq-section__item:not(:first-child) {
  margin-top: 0.5rem;
}

.faq-section__question {
  width: 100%;
  height: 6.1875rem;
  padding: 0 2.5rem;
  border: 0;
  background: transparent;
  color: var(--Text-Title---Highlight-100, #680103);
  font-family: Phudu, sans-serif;
  font-size: 1.875rem;
  font-style: normal;
  font-weight: 700;
  line-height: 120%;
  text-align: left;
  text-transform: uppercase;
  cursor: pointer;

  display: flex;
  align-items: center;
  justify-content: space-between;
}

.faq-section__question span {
  display: block;
}

.faq-section__icon_ab {
  width: 2.4375rem;
  height: 2.4375rem;
  aspect-ratio: 1 / 1;
  flex-shrink: 0;
  margin-left: 1.5rem;
  transition: transform 0.25s ease;
}

.faq-section__item--active .faq-section__icon_ab {
  transform: rotate(180deg);
}

.faq-section__answer {
  max-height: 0;
  overflow: hidden;
  opacity: 0;
  padding: 0 2.5rem;
  transition: max-height 0.35s ease, opacity 0.25s ease, padding 0.25s ease;
}

.faq-section__item--active .faq-section__answer {
  opacity: 1;
  margin: 1.88rem;
}

.faq-section__answer-group:not(:first-child) {
  margin-top: 1.12rem;
}

.faq-section__answer h3 {
  margin: 0 0 0.5rem;
  color: var(--Text-Title---Highlight-100, #680103);
  font-family: "SF Pro Display", sans-serif;
  font-size: 1.25rem;
  font-style: normal;
  font-weight: 500;
  line-height: 130%;
}

.faq-section__answer p,
.faq-section__answer li {
  margin: 0;
  color: var(--Text-Body-80, rgba(29, 29, 29, 0.8));
  font-family: "SF Pro Display", sans-serif;
  font-size: 1.125rem;
  font-style: normal;
  font-weight: 400;
  line-height: 150%;
}

.faq-section__answer p + p {
  margin-top: 0.25rem;
}

.faq-section__answer ul {
  margin: 0;
  padding-left: 1.5rem;
}

.faq-section__answer li + li {
  margin-top: 0.25rem;
}

@media (max-width: 639px) {
  .faq-section {
    padding-top: 4.25rem ;
    
  }

  .faq-section__container {
    padding: 0 0.75rem;
  }

  .faq-section__label {
    font-size: 0.8125rem;
  }
  .faq-section__answer > *:not(:first-child) {
    margin-top: 0.625rem;
  }

  .faq-section__answer h1,
  .faq-section__answer h2,
  .faq-section__answer h3,
  .faq-section__answer h4,
  .faq-section__answer h5,
  .faq-section__answer h6 {
    font-size: 1rem;
    line-height: 150%;
  }

  .faq-section__answer p,
  .faq-section__answer li {
    font-family: "SF Pro Display", sans-serif;
    font-size: 0.875rem;
    line-height: 150%;
  }
.faq-section__item--active .faq-section__answer{
  margin: 0;
}
  .faq-section__answer ul,
  .faq-section__answer ol {
    padding-left: 1rem;
  }
  .faq-section__title {
    margin: 0.5rem 0 1.25rem;
    font-size: 1.75rem;
  }

  .faq-section__question {
    height: 3.5rem;
    padding: 0 0.94rem;
    font-size: 1.125rem;
    font-weight: 700;
    line-height: 120%;
  }

  .faq-section__question span {
    max-width: 85%;
  }

  .faq-section__icon_ab {
    width: 1.5rem;
    height: 1.5rem;
    margin-left: 1rem;
  }

  .faq-section__answer {
    padding: 0 0.94rem;
  }

  .faq-section__item--active .faq-section__answer {
    margin-bottom: 1rem;
  }

  .faq-section__answer-group:not(:first-child) {
    margin-top: 1.12rem;
  }

  .faq-section__answer h3 {
    margin: 0 0 0.5rem;
    color: var(--Text-Title---Highlight-100, #680103);
    font-family: "SF Pro Display", sans-serif;
    font-size: 1rem;
    font-style: normal;
    font-weight: 500;
    line-height: 150%;
  }

  .faq-section__answer p,
  .faq-section__answer li {
    color: var(--Text-Body-80, rgba(29, 29, 29, 0.8));
    font-family: var(--String, Phudu);
    font-size: 0.875rem;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
  }

  .faq-section__answer ul {
    padding-left: 1rem;
  }
}

/* ===== template-parts/faqs/section-quick-search/assets/styles.css ===== */
.faq-category {
  position: relative;
  width: 100%;
  overflow: hidden;
}

.faq-category__bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 0;
  object-fit: cover;
}

.faq-category__inner {
  position: relative;
  z-index: 1;
  width: 100%;
  max-width: 90rem;
  margin: 0 auto;
  padding: 7.5rem 0;
}

.faq-category__subtitle {
  margin: 0;
  color: var(--Text-Title---Highlight-100, #680103);
  text-align: center;
  font-family: Phudu, sans-serif;
  font-size: 1.5rem;
  font-style: normal;
  font-weight: 600;
  line-height: 110%;
}

.faq-category__title {
  margin: 1.3rem 0 0;
  color: var(--Text-Title---Highlight-100, #680103);
  text-align: center;
  font-family: Phudu, sans-serif;
  font-size: 3.625rem;
  font-style: normal;
  font-weight: 700;
  line-height: 110%;
  text-transform: uppercase;

  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  line-clamp: 2;
  overflow: hidden;
  text-overflow: ellipsis;
}

.faq-category__title p {
  margin: 0;
  color: var(--Text-Title---Highlight-100, #680103);
  text-align: center;
  font-family: Phudu, sans-serif;
  font-size: 3.625rem;
  font-style: normal;
  font-weight: 700;
  line-height: 110%;
  text-transform: uppercase;
}

.faq-category__title strong {
  display: block;
  font-weight: 700;
}

.faq-category__title br {
  display: block;
}

.faq-category__list {
  display: flex;
  align-items: flex-start;
  justify-content: center;
  margin-top: 3.875rem;
}

.faq-category__item {
  width: 12.15rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-decoration: none;
  color: var(--Text-Title---Highlight-100, #680103);
}

.faq-category__icon {
  width: 5.125rem;
  height: 5.125rem;
  flex-shrink: 0;
  border-radius: 999rem;
  object-fit: cover;
}

.faq-category__name {
  display: block;
  width: 100%;
  min-height: 1.6875rem;
  margin-top: 0.875rem;
  max-width: 10rem;
  color: var(--Text-Title---Highlight-100, #680103);
  text-align: center;
  font-family: "SF Pro Display", sans-serif;
  font-size: 1rem;
  font-style: normal;
  font-weight: 400;
  line-height: 140%;


  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  line-clamp: 2;
  overflow: hidden;
  text-overflow: ellipsis;
}

@media screen and (max-width: 639.98px) {
  .faq-category {
    position: relative;
    width: 100%;
    overflow: hidden;
  }

  .faq-category__bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 0;
    object-fit: cover;
  }

  .faq-category__inner {
    position: relative;
    z-index: 1;
    width: 100%;
    margin: 0 auto;
    padding: 4.25rem 0.75rem;
  }

  .faq-category__subtitle {
    margin: 0 0 0.5rem;
    color: var(--Text-Title---Highlight-100, #680103);
    text-align: center;
    font-family: Phudu, sans-serif;
    font-size: 0.8125rem;
    font-style: normal;
    font-weight: 600;
    line-height: 110%;
  }

  .faq-category__title {
    margin: 0;
    color: var(--Text-Title---Highlight-100, #680103);
    text-align: center;
    font-family: Phudu, sans-serif;
    font-size: 1.75rem;
    font-style: normal;
    font-weight: 700;
    line-height: 110%;
    text-transform: uppercase;
  }

  .faq-category__title p {
    margin: 0;
    color: var(--Text-Title---Highlight-100, #680103);
    text-align: center;
    font-family: Phudu, sans-serif;
    font-size: 1.75rem;
    font-style: normal;
    font-weight: 700;
    line-height: 110%;
    text-transform: uppercase;
  }

  .faq-category__title strong {
    display: block;
    font-weight: 700;
  }

  .faq-category__title br {
    display: block;
  }

  .faq-category__list {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    width: 100%;
    margin-top: 1.25rem;
  }

 .faq-category__item {
  width: 5.9rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-right: 1.25rem;
  margin-bottom: 1rem;
  text-decoration: none;
  color: var(--Text-Title---Highlight-100, #680103);
}

/* Nếu mỗi hàng có 3 item */
.faq-category__item:nth-last-child(-n + 3) {
  margin-bottom: 0;
}

  .faq-category__item:nth-child(3n) {
    margin-right: 0;
  }

  .faq-category__icon {
    width: 3.375rem;
    height: 3.375rem;
    flex-shrink: 0;
    border-radius: 999rem;
    object-fit: cover;
  }

  .faq-category__name {
    display: block;
    width: 100%;
    min-height: 1.6875rem;
    margin-top: 0.25rem;
    color: var(--Text-Title---Highlight-100, #680103);
    text-align: center;
    font-family: "SF Pro Display", sans-serif;
    font-size: 0.675rem;
    font-style: normal;
    font-weight: 600;
    line-height: 130%;
    word-break: normal;
    overflow-wrap: break-word;
  }
}

/* ===== template-parts/faqs/section-detail-shop/assets/styles.css ===== */
.store-info {
  position: relative;
  width: 100%;
  overflow: hidden;
}

.store-info__bg {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.store-info__bg--mobile {
  display: none;
}

.store-info__inner {
  position: relative;
  z-index: 1;
  display: flex;
  justify-content: space-between;
  margin: 0 auto;
  padding: 5.19rem 8.63rem;
}

.store-info__content {
  display: flex;
  flex-direction: column;
}

.store-info__title {
  margin: 0;
  color: var(--Text-inv-100, #f7f4ec);
  font-family: Phudu, sans-serif;
  font-size: 3.625rem;
  font-style: normal;
  font-weight: 700;
  line-height: 110%;
}

.store-info__list {
  width: 100%;
  margin-top: 2rem;
}

.store-info__item {
  width: 100%;
}

.store-info__item + .store-info__item {
  margin-top: 1.12rem;
}

.store-info__question {
  display: flex;
  align-items: center;
  color: var(--Text-inv-100, #f7f4ec);
  font-family: "SF Pro Display", sans-serif;
  font-size: 1rem;
  max-width: 31rem;
  font-style: normal;
  font-weight: 600;
  line-height: 150%;

  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
  line-clamp: 1;
  overflow: hidden;
  text-overflow: ellipsis;
}

.store-info__spark {
  display: inline-flex;
  margin-right: 0.5rem;
  color: #d97945;
}

.store-info__spark svg {
  width: 0.875rem;
  height: 0.875rem;
}

.store-info__answer {
  margin: 0.25rem 0 0;
  color: var(--Text-inv-80, rgba(247, 244, 236, 0.8));
  font-family: "SF Pro Display", sans-serif;
  font-size: 1rem;
  max-width: 31rem;

  font-style: normal;
  font-weight: 400;
  line-height: 150%;


  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
  line-clamp: 1;
  overflow: hidden;
  text-overflow: ellipsis;
}

.store-info__answer p {
  margin: 0;
}

.store-info__answer strong {
  display: block;
  font-weight: 400;
  color: var(--Text-inv-100, #f7f4ec);
}

.store-info__answer br {
  display: block;
}

.store-info__answer a {
  color: inherit;
  text-decoration: none;
}

.store-info__answer--icon {
  display: flex;
  align-items: center;
}

.store-info__answer--icon span {
  display: inline-flex;
  margin-right: 0.375rem;
}
.store-info__answer-row {
  display: flex;
  align-items: center;
}

.store-info__answer-row + .store-info__answer-row {
  margin-top: 0.25rem;
}

.store-info__answer-icon {
  display: inline-flex;
  width: 1rem;
  height: 1rem;
  margin-right: 0.62rem;

  flex-shrink: 0;
}

.store-info__answer-icon svg {
  display: block;
  width: 100%;
  height: 100%;
}

.store-info__answer-text {
  display: block;


  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
  line-clamp: 1;
  overflow: hidden;
  text-overflow: ellipsis;
}

.store-info__answer-text strong {
  display: inline;
  font-weight: 400 !important;
  color: var(--Text-inv-100, #f7f4ec);
}

.store-info__answer p {
  margin: 0;
}
.store-info__contact {
  display: flex;
  width: 31.19rem;
  height: 4.5rem;
  margin-top: 2rem;
  padding: 0.5rem 0.75rem 0.5rem 0.5rem;
  justify-content: space-between;
  align-items: center;
  border-radius: 0.5rem;
  background: var(
    --Button-Button,
    radial-gradient(169.61% 50% at 50% 50%, #cb5140 46.54%, #d8a061 91.01%)
  );
}

.store-info__call {
  display: flex;
  width: 20.1875rem;
  padding: 0.5rem 1.9375rem;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  flex-shrink: 0;
  border-radius: 0.375rem;
  background: var(--Icon---mng-Trng-ng, #f6f3ea);
  text-decoration: none;
}

.store-info__call:hover {
  border-radius: 0.375rem;
  background: var(--Icon---mng-white, #fff);
  box-shadow: 0 0 1.875rem 0 #f6f3ea;
}

.list-store-info__or {
  display: flex;
  align-items: center;
}

.store-info__call span {
  color: var(--Text-Title---Highlight-100, #680103);
  font-family: "SF Pro Display", sans-serif;
  font-size: 1.125rem;
  font-style: normal;
  font-weight: 600;
  line-height: 150%;
}

.store-info__call small {
  color: var(--Text-Title---Highlight-100, #680103);
  font-family: Phudu, sans-serif;
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 400;
  line-height: 150%;
}

.store-info__or {
  display: none;
  margin-right: 0.81rem;
  color: var(--Text-inv-100, #f7f4ec);
  font-family: "SF Pro Display", sans-serif;
  font-size: 1rem;
  font-style: normal;
  font-weight: 500;
  line-height: 150%;
}

.store-info__social {
  display: flex;
  width: 3.5rem;
  height: 3.5rem;
  align-items: center;
  justify-content: center;
  border-radius: 5.46875rem;
  text-decoration: none;
  position: relative;
  overflow: hidden;
}

.store-info__social::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  border-radius: inherit;
  background: var(--Icon---mng-Trng-ng, #f6f3ea);
  opacity: 0.2;
  filter: blur(0);
  transition:
    opacity 0.2s ease,
    background-color 0.2s ease,
    box-shadow 0.2s ease;
}

.store-info__social svg {
  position: relative;
  z-index: 1;
  width: 2.0625rem;
  height: 2.0625rem;
  transition: filter 0.2s ease;
}

.store-info__social--zalo rect {
  fill: transparent;
  opacity: 0;
}

.store-info__social--zalo svg {
  width: 3.5rem;
  height: 3.5rem;
}

.store-info__social:hover::before {
  opacity: 1;
  border-radius: 62.5rem;
  background: var(--Icon---mng-white, #fff);
  box-shadow: 0 0 1.875rem 0 #f6f3ea;
}

.store-info__social:hover svg {
  filter: brightness(0) saturate(100%) invert(9%) sepia(56%) saturate(3925%)
    hue-rotate(343deg) brightness(111%) contrast(114%);
}

.store-info__social + .store-info__social {
  margin-left: 0.5rem;
}

.store-info__image-div {
  display: flex;
}

.store-info__image {
  width: 20.75rem;
  height: 31.125rem;
  flex-shrink: 0;
  overflow: hidden;
  position: relative;
}

.store-info__image-img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.store-info__image-overlay {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
  width: 100%;
  height: 100%;
  object-fit: cover;
  pointer-events: none;
}

.store-info__map {
  position: relative;
  width: 20.75rem;
  height: 31.125rem;
  margin-left: 1rem;
  flex-shrink: 0;
  overflow: hidden;
}

.store-info__map-frame {
  display: block;
  width: 100%;
  height: 100%;
  border: 0;
}

.store-info__map-icon {
  width: 0.9375rem;
  height: 1.125rem;
}

.store-info__map-link {
  position: absolute;
  left: 0;
  bottom: 0;
  display: flex;
  width: 100%;
  height: 2.96rem;
  padding: 1rem;
  justify-content: space-between;
  align-items: center;
  color: #f7f4ec;
  font-family: "SF Pro Display", sans-serif;
  font-size: 0.875rem;
  font-weight: 500;
  line-height: 150%;
  text-decoration: none;
  background: radial-gradient(
    50% 169.61% at 50% 50%,
    #cb5140 46.54%,
    #d8a061 91.01%
  );
}
.store-info__image-img--mobile {
  display: none;
}
@media (max-width: 39.9375rem) {
  .store-info__bg--desktop {
    display: none;
  }
  .store-info__image-img--desktop {
    display: none;
  }

  .store-info__image-img--mobile {
    display: block;
  }
  .store-info__bg--mobile {
    display: block;
  }

  .store-info__inner {
    display: flex;
    flex-direction: column;
    max-width: none;
    padding: 2.12rem 0.75rem;
  }

  .store-info__content {
    width: 100%;
  }

  .store-info__title {
    font-size: 1.75rem;
    line-height: 110%;
  }
  .store-info__answer-icon {
    display: inline-flex;
    width: 1rem;
    height: 1rem;
    margin-right: 0.62rem;
    opacity: 0.8;
    flex-shrink: 0;
  }
  .store-info__list {
    margin-top: 2rem;
  }

  .store-info__item + .store-info__item {
    margin-top: 1rem;
  }

  .store-info__question {
    font-size: 1rem;
  }

  .store-info__answer {
    font-size: 0.875rem;
  }

  .store-info__contact {
    width: 100%;
    height: 4.5rem;
    margin-top: 2rem;
    padding: 0.38rem 0.5rem 0.38rem 0.38rem;
    border-radius: 0.25rem;
  }

  .store-info__call {
    width: auto;
    padding: 0.5rem 0.72rem;
  }

  .store-info__call span {
    font-size: 0.875rem;
  }

  .store-info__call small {
    font-size: 0.75rem;
  }

  .store-info__or {
    display: block;
    margin-right: 0.38rem;
    font-size: 0.875rem;
  }

  .store-info__social {
    width: 2.75rem;
    height: 2.75rem;
  }

  .store-info__social + .store-info__social {
    margin-left: 0.375rem;
  }

  .store-info__social svg {
    width: 1.75rem;
    height: 1.75rem;
  }

  .store-info__social--zalo svg {
    width: 2.5rem;
    height: 2.5rem;
  }

  .store-info__image-div {
    flex-direction: column;
  }

  .store-info__image {
    width: 100%;
    height: 11.25rem;
    margin-left: 0;
    margin-top: 0.62rem;
  }

  .store-info__map {
    width: 100%;
    height: 21.9375rem;
    margin-left: 0;
    margin-top: 0.62rem;
  }

  .store-info__map-link {
    height: 2.96rem;
    padding: 0.875rem 1rem;
    font-size: 0.875rem;
  }
}

.product-detail__cta {
  display: flex;
  align-items: center;
  width: 31.185rem;
  justify-content: space-between;
  padding: 0.5rem 0.75rem 0.5rem 0.5rem;
  border-radius: 0.5rem;
  background: radial-gradient(
    50% 169.61% at 50% 50%,
    #cb5140 46.54%,
    #d8a061 91.01%
  );
  margin-top: 2rem;
}

.product-detail__cta-btn {
  display: flex;
  flex-direction: column;
  width: 20.1875rem;
  align-items: center;
  padding: 0.5rem 1.9375rem;
  background-color: #f6f3ea;
  border-radius: 0.375rem;
  text-decoration: none;
  transition: 0.2s ease;
}

.product-detail__cta-btn:hover {
  background: var(--Icon---mng-white, #fff);
  box-shadow: 0 0 30px 0 #f6f3ea;
}

.product-detail__cta-btn-top {
  display: flex;
  align-items: center;
}

.product-detail__cta-btn-top > *:not(:last-child) {
  margin-right: 0.5rem;
}

.product-detail__cta-btn-text {
  font-family: "SF Pro Display", sans-serif;
  font-size: 1.125rem;
  font-weight: 600;
  line-height: 1.5;
  color: #680103;
}

.product-detail__cta-btn-phone {
  font-family: "SF Pro Display", sans-serif;
  font-size: 0.875rem;
  font-weight: 400;
  line-height: 1.5;
  color: #680103;
}

.product-detail__contact {
  display: flex;
  align-items: center;
}

.product-detail__contact > *:not(:last-child) {
  margin-right: 0.8125rem;
}

.product-detail__contact-label {
  color: var(--Text-inv-100, #f7f4ec);
  font-family: "SF Pro Display";
  font-size: 1rem;
  display: none;
  font-weight: 500;
  line-height: 150%;
}

.product-detail__contact-icons {
  display: flex;
}

.product-detail__contact-icons > *:not(:last-child) {
  margin-right: 0.5rem;
}

.product-detail__contact-icon {
  display: block;
  width: 3rem;
  height: 3rem;
  padding: 0.6rem;
  border-radius: 50%;
  overflow: hidden;
  transition: 0.2s ease;
  background: var(--Icon---mng-Trng-ng, #f6f3ea30);
}

.product-detail__contact-icon:hover {
  background: var(--Icon---mng-white, #fff);
  box-shadow: 0 0 30px 0 #f6f3ea;
}

.product-detail__contact-icon svg {
  width: 100%;
  height: 100%;
  display: block;
}

.product-detail__contact-icon:hover svg path {
  fill: var(--Icon---mng-m, #680103);
}

@media screen and (max-width: 639.98px) {
  .product-detail__cta {
    display: flex;
    width: 100%;
    height: 4.1875rem;
  }
  .product-detail__contact-icon {
    width: 2.5rem;
    height: 2.5rem;
  }
  .product-detail__contact-label {
    display: block;
    font-size: 0.875rem;
    margin-right: 0.38rem;
  }
  .product-detail__cta-btn-text {
    font-size: 0.875rem;
  }
  .product-detail__cta {
    padding: 0.38rem 0.5rem 0.38rem 0.38rem;
  }
  .product-detail__cta-btn-phone {
    font-size: 0.75rem;
  }
  .product-detail__cta-btn {
    width: 8.75rem;
    padding: 0.5rem;
  }
  .product-detail__contact-icon {
    padding: 0.5rem;
  }
}
.store-info__map-img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.store-info__map-img--mobile {
  display: none;
}

@media (max-width: 39.9375rem) {
  .store-info__map-img--desktop {
    display: none;
  }

  .store-info__map-img--mobile {
    display: block;
  }
}

/* ===== template-parts/faqs/section-mermaid-banner/assets/styles.css ===== */
.faq-cosplay-cta {
  position: relative;
  width: 100%;
  padding-top: 7.5rem;
  padding-bottom: 7.5rem;
  overflow: hidden;
}

.faq-cosplay-cta__page-bg {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.faq-cosplay-cta__container {
  position: relative;
  z-index: 1;
  width: 100%;
  padding: 0 4rem;
}

.faq-cosplay-cta__banner {
  position: relative;
  width: 100%;

  overflow: hidden;
}

.faq-cosplay-cta__image {
  display: block;
  width: 100%;
  height: auto;
  object-fit: cover;
}
.faq-cosplay-cta__image--mobile {
  display: none;
}

.faq-cosplay-cta__overlay {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  width: 55rem;
  background:
    radial-gradient(
      ellipse at 84% 28%,
      rgba(75, 0, 1, 0.2) 0%,
      rgba(75, 0, 1, 0.12) 28%,
      rgba(75, 0, 1, 0.05) 56%,
      rgba(75, 0, 1, 0) 82%
    ),
    radial-gradient(
      ellipse at 92% 52%,
      rgba(75, 0, 1, 0.18) 0%,
      rgba(75, 0, 1, 0.1) 30%,
      rgba(75, 0, 1, 0.04) 58%,
      rgba(75, 0, 1, 0) 84%
    ),
    radial-gradient(
      ellipse at 82% 78%,
      rgba(106, 0, 2, 0.16) 0%,
      rgba(106, 0, 2, 0.09) 34%,
      rgba(106, 0, 2, 0.035) 62%,
      rgba(106, 0, 2, 0) 86%
    ),
    linear-gradient(
      90deg,
      rgba(75, 0, 1, 0.58) 0%,
      rgba(75, 0, 1, 0.5) 36%,
      rgba(75, 0, 1, 0.36) 54%,
      rgba(75, 0, 1, 0.2) 70%,
      rgba(75, 0, 1, 0.08) 84%,
      rgba(75, 0, 1, 0) 100%
    ),
    linear-gradient(
      180deg,
      rgba(106, 0, 2, 0) 14.07%,
      rgba(106, 0, 2, 0.18) 33.52%,
      rgba(106, 0, 2, 0.32) 48.04%,
      rgba(75, 0, 1, 0.54) 73.79%
    );

  -webkit-mask-image: linear-gradient(
    90deg,
    #000 0%,
    #000 54%,
    rgba(0, 0, 0, 0.9) 64%,
    rgba(0, 0, 0, 0.62) 74%,
    rgba(0, 0, 0, 0.32) 84%,
    rgba(0, 0, 0, 0.12) 92%,
    rgba(0, 0, 0, 0) 100%
  );
  mask-image: linear-gradient(
    90deg,
    #000 0%,
    #000 54%,
    rgba(0, 0, 0, 0.9) 64%,
    rgba(0, 0, 0, 0.62) 74%,
    rgba(0, 0, 0, 0.32) 84%,
    rgba(0, 0, 0, 0.12) 92%,
    rgba(0, 0, 0, 0) 100%
  );

  mix-blend-mode: color;
  pointer-events: none;
  z-index: 2;
}
.faq-cosplay-cta__content {
  position: absolute;
  top: 50%;
  left: 4.25rem;
  z-index: 3;
  max-width: 37rem;
  transform: translateY(-50%);
}

.faq-cosplay-cta__title,
.faq-cosplay-cta__title p {
  margin: 0;
  color: var(--Text-inv-100, #f7f4ec);
  font-family: Phudu, sans-serif;
  font-size: 2.875rem;
  font-style: normal;
  font-weight: 700;
  line-height: 110%;
  text-transform: uppercase;
  
  
    display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  line-clamp: 2;
  overflow: hidden;
  text-overflow: ellipsis;
}

.faq-cosplay-cta__title p {
  display: block;
}

.faq-cosplay-cta__title strong {
  display: inline;
  font-weight: 700;
}

.faq-cosplay-cta__title br {
  display: block;
  content: "";
  margin: 0;
}

.faq-cosplay-cta__desc {
  margin: 1.25rem 0 0;
  margin-bottom: 1.125rem;
  color: var(--Text-inv-80, rgba(247, 244, 236, 0.8));
  font-family: "SF Pro Display", sans-serif;
  font-size: 1.125rem;
  font-style: normal;
  font-weight: 400;
  line-height: 150%;
  
  
  
    display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  line-clamp: 2;
  overflow: hidden;
  text-overflow: ellipsis;
}

.faq-cosplay-cta__button {
  position: relative;
  width: 14.625rem;
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: 1.62rem;
  padding: 1rem 1.125rem;
  border-radius: 6.25rem;
  background: var(--Icon---mng-Trng-ng, #f6f3ea);
  color: var(--Text-Title---Highlight-100, #680103);
  text-decoration: none;
  overflow: hidden;
}

.faq-cosplay-cta__button-text {
  width: 12rem;
  font-family: "SF Pro Display", sans-serif;
  font-size: 0.875rem;
  font-weight: 600;
  line-height: 1;
  text-align: center;
  transition: transform 0.45s ease;
}

.faq-cosplay-cta__button-icon {
  width: 1.125rem;
  height: 1.125rem;
  flex-shrink: 0;
  aspect-ratio: 1 / 1;
  transition: transform 0.45s ease;
}

.faq-cosplay-cta__button-icon svg {
  width: 100%;
  height: 100%;
  display: block;
}

.faq-cosplay-cta__button:hover .faq-cosplay-cta__button-text {
  transform: translateX(1.125rem);
}

.faq-cosplay-cta__button:hover .faq-cosplay-cta__button-icon {
  transform: translateX(-12rem);
}

@media screen and (max-width: 639.98px) {
  .faq-cosplay-cta__container {
    padding: 0 0.75rem;
  }
 
    .faq-cosplay-cta {
      padding-bottom: 4.25rem !important;
      padding-top: 4.25rem !important;
    }

  .faq-cosplay-cta__banner {
    height: auto;
  }

  .faq-cosplay-cta__image--desktop {
    display: none;
  }

  .faq-cosplay-cta__image--mobile {
    display: block;
  }

 .faq-cosplay-cta__overlay {
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;

  background:
    linear-gradient(
      180deg,
      rgba(106, 0, 2, 0.04) 18%,
      rgba(106, 0, 2, 0.28) 42%,
      rgba(106, 0, 2, 0.58) 64%,
      rgba(75, 0, 1, 0.9) 84%,
      rgba(75, 0, 1, 1) 100%
    );
}

/* phủ thêm bên phải */
.faq-cosplay-cta__overlay::after {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;

  width: 45%;

  background:
    linear-gradient(
      270deg,
      rgba(75, 0, 1, 0.65) 0%,
      rgba(75, 0, 1, 0.42) 35%,
      rgba(75, 0, 1, 0.18) 68%,
      rgba(75, 0, 1, 0) 100%
    );
}


  .faq-cosplay-cta__content {
    top: auto;
    left: 0.87rem;
    bottom: 1.62rem;
    width: calc(100% - 1.5rem);
    transform: none;
  }

  .faq-cosplay-cta__title,
.faq-cosplay-cta__title p {
  font-size: 1.75rem;
  line-height: 110%;
}

.faq-cosplay-cta__title strong {
  display: inline;
}
  .faq-cosplay-cta__desc {
    margin-top: 0.75rem;
    font-size: 1rem;
    line-height: 150%;
    margin-bottom: 0.75rem;
  }

  .faq-cosplay-cta__button {
    width: 11.88rem;
    margin-top: 1.62rem;
    padding: 0.75rem;
    gap: 0.375rem;
  }

  .faq-cosplay-cta__button-text {
    width: auto;
    font-size: 0.75rem;
  }

  .faq-cosplay-cta__button-icon {
    width: 0.875rem;
    height: 0.875rem;
    padding: 0.1875rem;
  }

  .faq-cosplay-cta__button:hover .faq-cosplay-cta__button-text {
    transform: translateX(0.875rem);
  }

  .faq-cosplay-cta__button:hover .faq-cosplay-cta__button-icon {
    transform: translateX(-9.75rem);
  }
}

.animated-btn--auto-wrap {
    max-width: 100%;
}

.animated-btn--auto-wrap .animated-btn-wrapper {
    max-width: 100%;
}

.animated-btn--auto-wrap .animated-btn__content-hidden {
    display: flex;
    align-items: center;
}

.animated-btn--auto-wrap .animated-btn__content-hidden-text,
.animated-btn--auto-wrap .animated-btn__content-visible-text {
    height: auto;
    min-height: 2.625rem;
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
    white-space: normal;
    word-break: break-word;
    overflow-wrap: anywhere;
    line-height: 1.25;
    text-align: center;
    max-width: 18rem;
}

.animated-btn--auto-wrap .animated-btn__content-hidden-icon,
.animated-btn--auto-wrap .animated-btn__content-visible-icon {
    width: 2.125rem;
    min-width: 2.125rem;
    height: 2.625rem;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    padding: 0;
}

.animated-btn--auto-wrap .animated-btn__content-visible-text {
    width: calc(100% - 2.125rem);
}

.animated-btn--auto-wrap .animated-btn__content-visible-icon {
    left: auto;
    right: 0;
    transform: translateX(0);
}

@media screen and (min-width: 1024px) {
    .animated-btn--auto-wrap:hover .animated-btn__content-visible-text {
        transform: translateX(2.125rem);
    }

    .animated-btn--auto-wrap:hover .animated-btn__content-visible-icon {
        left: 0;
        right: auto;
        transform: translateX(0);
    }
}

@media (max-width: 639px) {
    .animated-btn--auto-wrap .animated-btn__content-hidden-text,
    .animated-btn--auto-wrap .animated-btn__content-visible-text {
        min-height: 2rem;
        padding-top: 0.375rem;
        padding-bottom: 0.375rem;
        max-width: 14rem;
    }

    .animated-btn--auto-wrap .animated-btn__content-hidden-icon,
    .animated-btn--auto-wrap .animated-btn__content-visible-icon {
        width: 1.625rem;
        min-width: 1.625rem;
        height: 2rem;
    }

    .animated-btn--auto-wrap .animated-btn__content-visible-text {
        width: calc(100% - 1.625rem);
    }
}
