/* Chetak Furniture — generated CSS (uploaded to site_settings.sx_css_location).
   Authored per-segment, concatenated into one file. Do NOT @import or minify
   (the BEGIN/END markers are comments and must survive). Every selector is
   namespaced under .sx so nothing leaks into the theme header/footer/cards.
   Brand color comes from the theme var --secondary-main (Chetak navy); the
   gold / brick / cream accents are namespaced --sx-* tokens. */

/* BEGIN shoopy-gen:base */
.sx {
  --sx-navy: var(--secondary-main, #1b2440);
  --sx-gold: #e0a11c;
  --sx-gold-soft: #f6c944;
  --sx-red: #c0392b;
  --sx-green: #1f9d55;
  --sx-cream: #f7f3ec;
  --sx-ink: #1c2333;
  --sx-muted: #6b7280;
  --sx-line: #e7e1d6;
  --sx-radius: 16px;
  --sx-gap: 18px;
  --sx-max: 1200px;
  font-family: inherit;
  color: var(--sx-ink);
}
.sx,
.sx * {
  box-sizing: border-box;
}
.sx-wrap {
  max-width: var(--sx-max);
  margin: 0 auto;
  padding: 0 16px;
  width: 100%;
}
.sx-eyebrow {
  display: inline-block;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--sx-red);
  margin: 0 0 10px;
}
.sx-h2 {
  font-size: clamp(24px, 3.2vw, 34px);
  line-height: 1.15;
  font-weight: 800;
  margin: 0 0 10px;
  color: var(--sx-navy);
  letter-spacing: -0.01em;
}
.sx-sub {
  color: var(--sx-muted);
  font-size: 15px;
  line-height: 1.6;
  margin: 0;
  max-width: 640px;
}
.sx-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 13px 24px;
  border-radius: 999px;
  background: var(--sx-navy);
  color: #fff;
  font-weight: 700;
  font-size: 14px;
  text-decoration: none;
  border: none;
  cursor: pointer;
  transition:
    transform 0.15s ease,
    filter 0.15s ease;
}
.sx-btn:hover {
  filter: brightness(1.08);
  transform: translateY(-1px);
}
.sx-btn--gold {
  background: var(--sx-gold);
  color: var(--sx-navy);
}
.sx-btn--ghost {
  background: transparent;
  color: var(--sx-navy);
  border: 1.5px solid var(--sx-line);
}
.sx-btn--wa {
  background: var(--sx-green);
  color: #fff;
}
.sx-section {
  padding: clamp(40px, 6vw, 72px) 0;
}
/* END shoopy-gen:base */

/* BEGIN shoopy-gen:about-1 */
.sx-about {
  background: var(--sx-cream);
}
.sx-about__grid {
  display: grid;
  gap: 28px;
  align-items: center;
}
.sx-about__media {
  position: relative;
  border-radius: var(--sx-radius);
  overflow: hidden;
  box-shadow: 0 18px 40px rgba(27, 36, 64, 0.14);
}
.sx-about__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  aspect-ratio: 3 / 2;
}
.sx-about__cards {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
  margin-top: 26px;
}
.sx-about__card {
  background: #fff;
  border: 1px solid var(--sx-line);
  border-radius: 14px;
  padding: 18px;
}
.sx-about__ic {
  width: 42px;
  height: 42px;
  border-radius: 11px;
  display: grid;
  place-items: center;
  background: color-mix(in srgb, var(--sx-red) 12%, #fff);
  color: var(--sx-red);
  margin-bottom: 12px;
}
.sx-about__ic svg {
  width: 22px;
  height: 22px;
}
.sx-about__card h3 {
  margin: 0 0 4px;
  font-size: 15px;
  color: var(--sx-navy);
}
.sx-about__card p {
  margin: 0;
  font-size: 13px;
  color: var(--sx-muted);
  line-height: 1.5;
}
@media (min-width: 900px) {
  .sx-about__grid {
    grid-template-columns: 0.92fr 1.08fr;
    gap: 44px;
    align-items: stretch;
  }
  .sx-about__media {
    height: 100%;
  }
  .sx-about__media img {
    height: 100%;
    aspect-ratio: auto;
    min-height: 460px;
  }
}
/* END shoopy-gen:about-1 */

/* BEGIN shoopy-gen:everyspace-1 */
.sx-bento__head {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 26px;
}
.sx-bento__grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 18px;
}
.sx-bento__tile {
  border-radius: var(--sx-radius);
  overflow: hidden;
  background: #fff;
  border: 1px solid var(--sx-line);
  display: flex;
  flex-direction: column;
  text-decoration: none;
  transition:
    transform 0.18s ease,
    box-shadow 0.18s ease;
}
.sx-bento__tile:hover {
  transform: translateY(-3px);
  box-shadow: 0 16px 34px rgba(27, 36, 64, 0.12);
}
.sx-bento__media {
  display: block;
  aspect-ratio: 4 / 3;
  overflow: hidden;
  background: var(--sx-cream);
}
.sx-bento__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.sx-bento__body {
  display: block;
  padding: 15px 16px 17px;
}
.sx-bento__tag {
  display: block;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--sx-red);
}
.sx-bento__title {
  display: block;
  font-size: 17px;
  font-weight: 800;
  color: var(--sx-navy);
  margin: 4px 0 5px;
}
.sx-bento__tile p {
  margin: 0;
  font-size: 13px;
  color: var(--sx-muted);
  line-height: 1.5;
}
.sx-bento__link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-top: 11px;
  font-size: 13px;
  font-weight: 700;
  color: var(--sx-red);
}
@media (min-width: 860px) {
  .sx-bento__grid {
    grid-template-columns: repeat(3, 1fr);
  }
}
/* END shoopy-gen:everyspace-1 */

/* BEGIN shoopy-gen:mattress-1 */
.sx-quiz {
  background: var(--sx-navy);
  color: #fff;
  border-radius: 22px;
  overflow: hidden;
}
.sx-quiz__grid {
  display: grid;
  gap: 0;
}
.sx-quiz__left {
  padding: clamp(26px, 4vw, 44px);
}
.sx-quiz__left .sx-eyebrow {
  color: var(--sx-gold);
}
.sx-quiz__left h2 {
  font-size: clamp(24px, 3.4vw, 36px);
  font-weight: 800;
  margin: 0 0 14px;
  line-height: 1.12;
}
.sx-quiz__left h2 span {
  color: var(--sx-gold);
}
.sx-quiz__left p {
  color: #c8cfe0;
  font-size: 15px;
  line-height: 1.6;
  margin: 0 0 18px;
  max-width: 440px;
}
.sx-quiz__points {
  list-style: none;
  padding: 0;
  margin: 0 0 24px;
  display: grid;
  gap: 12px;
}
.sx-quiz__points li {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  font-size: 14px;
  color: #e7eaf3;
}
.sx-quiz__points .sx-tick {
  flex: 0 0 22px;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: var(--sx-gold);
  color: var(--sx-navy);
  display: grid;
  place-items: center;
  font-size: 13px;
  font-weight: 800;
}
.sx-quiz__right {
  background: rgba(255, 255, 255, 0.04);
  padding: clamp(22px, 3vw, 34px);
  display: grid;
  gap: 12px;
  align-content: start;
}
.sx-quiz__rh {
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: #9fb0d8;
  margin: 0 0 4px;
}
.sx-quiz__rec {
  display: flex;
  align-items: center;
  gap: 14px;
  background: #fff;
  color: var(--sx-ink);
  border-radius: 14px;
  padding: 12px;
}
.sx-quiz__rec img {
  width: 64px;
  height: 64px;
  object-fit: cover;
  border-radius: 10px;
  flex: 0 0 auto;
  background: var(--sx-cream);
}
.sx-quiz__rec h4 {
  margin: 0 0 2px;
  font-size: 15px;
  color: var(--sx-navy);
}
.sx-quiz__rec small {
  color: var(--sx-muted);
  font-size: 12px;
}
.sx-quiz__rec .sx-quiz__price {
  margin-left: auto;
  text-align: right;
}
.sx-quiz__rec .sx-quiz__price b {
  display: block;
  color: var(--sx-navy);
  font-size: 15px;
}
.sx-quiz__rec .sx-quiz__price a {
  font-size: 12px;
  font-weight: 700;
  color: var(--sx-red);
  text-decoration: none;
}
@media (min-width: 880px) {
  .sx-quiz__grid {
    grid-template-columns: 1.1fr 0.9fr;
  }
}
/* END shoopy-gen:mattress-1 */

/* BEGIN shoopy-gen:bulk-1 */
.sx-bulk {
  background: var(--sx-cream);
}
.sx-bulk__head {
  margin-bottom: 28px;
}
.sx-bulk__grid {
  display: grid;
  gap: 22px;
}
.sx-bulk__left {
  display: flex;
  flex-direction: column;
}
.sx-bulk__feats {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
  align-content: start;
}
.sx-bulk__stats {
  display: flex;
  margin-top: 18px;
  background: #fff;
  border: 1px solid var(--sx-line);
  border-radius: 14px;
  overflow: hidden;
}
.sx-bulk__stat {
  flex: 1;
  padding: 16px 14px;
  text-align: center;
}
.sx-bulk__stat + .sx-bulk__stat {
  border-left: 1px solid var(--sx-line);
}
.sx-bulk__stat b {
  display: block;
  font-size: 19px;
  font-weight: 800;
  color: var(--sx-navy);
  line-height: 1.1;
}
.sx-bulk__stat span {
  display: block;
  margin-top: 4px;
  font-size: 12px;
  color: var(--sx-muted);
}
.sx-bulk__feat {
  background: #fff;
  border: 1px solid var(--sx-line);
  border-radius: 14px;
  padding: 14px 16px;
  display: flex;
  align-items: center;
  gap: 13px;
}
.sx-bulk__feat .sx-about__ic {
  background: color-mix(in srgb, var(--sx-navy) 10%, #fff);
  color: var(--sx-navy);
  margin-bottom: 0;
  flex: 0 0 auto;
}
.sx-bulk__feat-label {
  font-size: 14.5px;
  font-weight: 700;
  color: var(--sx-navy);
  line-height: 1.25;
}
.sx-bulk__form {
  background: #fff;
  border: 1px solid var(--sx-line);
  border-radius: 18px;
  overflow: hidden;
  box-shadow: 0 16px 40px rgba(27, 36, 64, 0.1);
}
.sx-bulk__form-head {
  background: var(--sx-navy);
  color: #fff;
  padding: 16px 24px;
}
.sx-bulk__form-head h3 {
  margin: 0 0 3px;
  font-size: 17px;
}
.sx-bulk__form-head p {
  margin: 0;
  font-size: 13px;
  color: #c8cfe0;
}
.sx-bulk__form-body {
  padding: 20px 24px 22px;
  display: flex;
  flex-direction: column;
  gap: 15px;
}
.sx-bulk__row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}
.sx-bulk__field {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.sx-bulk__field.sx-full {
  grid-column: 1 / -1;
}
.sx-bulk__field label {
  font-size: 12px;
  font-weight: 600;
  color: var(--sx-navy);
}
.sx-bulk__field input,
.sx-bulk__field select,
.sx-bulk__field textarea {
  border: 1px solid #eceae3;
  border-radius: 10px;
  padding: 12px 14px;
  font-size: 14px;
  font-family: inherit;
  color: var(--sx-ink);
  background: #f4f2eb;
  width: 100%;
  transition:
    border-color 0.15s ease,
    box-shadow 0.15s ease,
    background 0.15s ease;
}
.sx-bulk__field input::placeholder,
.sx-bulk__field textarea::placeholder {
  color: #a8a59c;
}
.sx-bulk__field input:focus,
.sx-bulk__field select:focus,
.sx-bulk__field textarea:focus {
  outline: none;
  background: #fff;
  border-color: var(--sx-navy);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--sx-navy) 13%, transparent);
}
.sx-bulk__field select {
  appearance: none;
  -webkit-appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%236b7280' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 13px center;
  padding-right: 36px;
}
.sx-bulk__field textarea {
  resize: vertical;
  min-height: 64px;
}
.sx-bulk__submit {
  width: 100%;
  justify-content: center;
  margin-top: 4px;
  padding: 14px 22px;
}
.sx-bulk__submit svg {
  width: 18px;
  height: 18px;
  stroke: #fff;
}
.sx-bulk__note {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  margin: 0;
  font-size: 12.5px;
  color: var(--sx-muted);
  text-align: center;
}
.sx-bulk__note svg {
  width: 15px;
  height: 15px;
  stroke: var(--sx-green);
  flex: 0 0 auto;
}
@media (min-width: 920px) {
  .sx-bulk__grid {
    grid-template-columns: 1fr 1.05fr;
    gap: 40px;
    align-items: stretch;
  }
  .sx-bulk__left {
    justify-content: center;
  }
}
/* END shoopy-gen:bulk-1 */

/* BEGIN shoopy-gen:reviews-1 */
.sx-reviews__grid {
  display: grid;
  gap: 16px;
  margin-top: 8px;
}
.sx-review {
  background: #fff;
  border: 1px solid var(--sx-line);
  border-radius: 16px;
  padding: 22px;
  display: flex;
  flex-direction: column;
}
.sx-review__stars {
  color: var(--sx-gold);
  font-size: 15px;
  letter-spacing: 2px;
  margin-bottom: 10px;
}
.sx-review__text {
  font-size: 14.5px;
  line-height: 1.65;
  color: #374151;
  margin: 0 0 18px;
}
.sx-review__who {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-top: auto;
}
.sx-review__av {
  width: 42px;
  height: 42px;
  border-radius: 50%;
  background: var(--sx-navy);
  color: #fff;
  display: grid;
  place-items: center;
  font-weight: 700;
  font-size: 15px;
  flex: 0 0 auto;
}
.sx-review__who b {
  display: block;
  font-size: 14px;
  color: var(--sx-navy);
}
.sx-review__who small {
  color: var(--sx-muted);
  font-size: 12px;
}
@media (min-width: 820px) {
  .sx-reviews__grid {
    grid-template-columns: repeat(3, 1fr);
  }
}
/* END shoopy-gen:reviews-1 */

/* BEGIN shoopy-gen:blogs-1 */
.sx-blog {
  background: var(--sx-cream);
}
.sx-blog__head {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 24px;
}
.sx-blog__grid {
  display: grid;
  gap: 18px;
}
.sx-blog__card {
  background: #fff;
  border: 1px solid var(--sx-line);
  border-radius: 16px;
  overflow: hidden;
  text-decoration: none;
  display: flex;
  flex-direction: column;
  transition:
    transform 0.18s ease,
    box-shadow 0.18s ease;
}
.sx-blog__card:hover {
  transform: translateY(-3px);
  box-shadow: 0 16px 34px rgba(27, 36, 64, 0.12);
}
.sx-blog__card img {
  width: 100%;
  aspect-ratio: 3 / 2;
  object-fit: cover;
  display: block;
}
.sx-blog__body {
  padding: 18px;
}
.sx-blog__meta {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--sx-red);
  margin-bottom: 8px;
}
.sx-blog__body h3 {
  margin: 0 0 6px;
  font-size: 16px;
  color: var(--sx-navy);
  line-height: 1.3;
}
.sx-blog__body p {
  margin: 0;
  font-size: 13px;
  color: var(--sx-muted);
  line-height: 1.55;
}
@media (min-width: 820px) {
  .sx-blog__grid {
    grid-template-columns: repeat(3, 1fr);
  }
}
/* END shoopy-gen:blogs-1 */

/* Extracted inline styles */

:root {
  --secondary-main: #1b2440;
  --gold: #e0a11c;
  --red: #c0392b;
  --cream: #f7f3ec;
  --ink: #1c2333;
  --muted: #6b7280;
  --line: #e7e1d6;
}
* {
  box-sizing: border-box;
}
body {
  margin: 0;
  font-family:
    "Inter",
    "Segoe UI",
    system-ui,
    -apple-system,
    Roboto,
    sans-serif;
  color: var(--ink);
  background: #fff;
  -webkit-font-smoothing: antialiased;
}
img {
  max-width: 100%;
}
a {
  color: inherit;
}
.wrap {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 16px;
  width: 100%;
}
/* notice */
.m-notice {
  background: #1b2440;
  color: #f6c944;
  text-align: center;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.02em;
  padding: 9px 16px;
}
/* header */
.m-header {
  position: relative;
  z-index: 50;
  background: #fff;
  border-bottom: 1px solid var(--line);
}
.m-header__in {
  display: flex;
  align-items: center;
  gap: 18px;
  padding: 12px 16px;
  max-width: 1200px;
  margin: 0 auto;
}
.m-logo {
  display: flex;
  align-items: center;
  gap: 10px;
  text-decoration: none;
  flex: 0 0 auto;
}
.m-logo img {
  height: 46px;
  width: auto;
  display: block;
}
.m-logo b {
  font-size: 18px;
  font-weight: 800;
  color: var(--secondary-main);
  letter-spacing: 0.02em;
  line-height: 1;
}
.m-logo small {
  display: block;
  font-size: 10px;
  color: var(--red);
  font-weight: 700;
  letter-spacing: 0.18em;
}
.m-search {
  flex: 1;
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 8px;
  height: 42px;
  background: var(--cream);
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 0 16px;
  color: var(--muted);
  font-size: 14px;
  max-width: 440px;
  overflow: hidden;
}
.m-search__ic {
  flex: 0 0 auto;
  line-height: 1;
}
.m-search__ph {
  flex: 1;
  min-width: 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.m-nav {
  display: none;
  gap: 20px;
  margin-left: auto;
}
.m-nav a {
  text-decoration: none;
  color: #33405e;
  font-size: 14px;
  font-weight: 600;
  white-space: nowrap;
}
.m-nav a:hover {
  color: var(--red);
}
.m-ico {
  flex: 0 0 auto;
  display: flex;
  gap: 16px;
  align-items: center;
  font-size: 13px;
  font-weight: 600;
  color: var(--secondary-main);
}
.m-ico > span {
  flex: 0 0 auto;
}
.m-ico .m-pill {
  flex: 0 0 auto;
  white-space: nowrap;
}
.m-ico .m-pill {
  display: inline-flex;
  align-items: center;
  height: 42px;
  background: var(--secondary-main);
  color: #fff;
  border-radius: 999px;
  padding: 0 20px;
  font-size: 14px;
}
/* hero */
.m-hero {
  position: relative;
  background: var(--cream);
}
.m-hero__track {
  display: flex;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scrollbar-width: none;
}
.m-hero__track::-webkit-scrollbar {
  display: none;
}
.m-hero__slide {
  position: relative;
  flex: 0 0 100%;
  scroll-snap-align: start;
}
.m-hero__slide picture,
.m-hero__slide img {
  display: block;
  width: 100%;
  height: auto;
}
.m-hero__slide::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(
    90deg,
    rgba(250, 247, 242, 0.92) 0%,
    rgba(250, 247, 242, 0.55) 34%,
    rgba(250, 247, 242, 0) 58%
  );
}
.m-hero__content {
  position: absolute;
  z-index: 2;
  left: 7%;
  top: 50%;
  transform: translateY(-50%);
  max-width: min(46%, 470px);
}
.m-hero__eyebrow {
  display: inline-block;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--red);
  margin-bottom: 12px;
}
.m-hero__title {
  font-size: clamp(26px, 4vw, 46px);
  line-height: 1.08;
  font-weight: 800;
  color: var(--secondary-main);
  margin: 0 0 14px;
  letter-spacing: -0.01em;
}
.m-hero__sub {
  font-size: clamp(14px, 1.4vw, 16px);
  line-height: 1.55;
  color: #3b4252;
  margin: 0 0 22px;
}
.m-hero__cta {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: var(--secondary-main);
  color: #fff;
  font-weight: 700;
  font-size: 14px;
  padding: 13px 26px;
  border-radius: 999px;
  text-decoration: none;
  box-shadow: 0 10px 24px rgba(27, 36, 64, 0.22);
}
.m-hero__dots {
  position: absolute;
  z-index: 3;
  left: 0;
  right: 0;
  bottom: 14px;
  display: flex;
  gap: 7px;
  justify-content: center;
}
.m-hero__dots span {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: rgba(27, 36, 64, 0.28);
}
.m-hero__dots span.is-on {
  background: var(--gold);
  width: 22px;
  border-radius: 999px;
}
@media (max-width: 767px) {
  .m-hero__slide::after {
    background: linear-gradient(
      180deg,
      rgba(250, 247, 242, 0.92) 0%,
      rgba(250, 247, 242, 0.5) 30%,
      rgba(250, 247, 242, 0) 62%
    );
  }
  .m-hero__content {
    top: 6%;
    left: 7%;
    right: 7%;
    transform: none;
    max-width: none;
  }
}
/* section label (preview only) */
.m-lab {
  font: 600 10px/1.4 monospace;
  color: #b9b3a6;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  padding: 18px 16px 0;
  max-width: 1200px;
  margin: 0 auto;
}
.m-sec {
  padding: clamp(34px, 5vw, 58px) 0;
}
.m-head {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 22px;
}
.m-eyebrow {
  display: inline-block;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--red);
  margin: 0 0 8px;
}
.m-h2 {
  font-size: clamp(22px, 3vw, 32px);
  font-weight: 800;
  color: var(--secondary-main);
  margin: 0;
  letter-spacing: -0.01em;
}
/* categories */
.m-cats {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px 8px;
  padding: 4px 2px;
  justify-items: center;
}
.m-cat {
  text-decoration: none;
  text-align: center;
  width: 100%;
  font-size: 12px;
  font-weight: 600;
  color: #33405e;
}
.m-cat__img {
  display: block;
  width: min(84px, 100%);
  aspect-ratio: 1;
  border-radius: 50%;
  overflow: hidden;
  margin: 0 auto 8px;
  border: 3px solid #fff;
  box-shadow:
    0 0 0 1.5px var(--red),
    0 8px 18px rgba(27, 36, 64, 0.1);
}
.m-cat__img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
/* featured row */
.m-row {
  display: flex;
  align-items: stretch;
  gap: 14px;
  overflow-x: auto;
  padding: 4px 2px 8px;
  scrollbar-width: none;
}
.m-row::-webkit-scrollbar {
  display: none;
}
.m-pcard {
  position: relative;
  flex: 0 0 230px;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 14px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}
.m-pcard__badge {
  position: absolute;
  top: 10px;
  left: 10px;
  z-index: 2;
  background: var(--red);
  color: #fff;
  font-size: 11px;
  font-weight: 700;
  padding: 4px 9px;
  border-radius: 6px;
}
.m-pcard__img {
  flex: 0 0 auto;
  height: 210px;
  background: var(--cream);
  overflow: hidden;
}
.m-pcard__img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.m-pcard__b {
  padding: 13px;
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  gap: 3px;
}
.m-pcard__b h4 {
  margin: 0;
  font-size: 14px;
  color: var(--secondary-main);
  line-height: 1.3;
}
.m-pcard__b small {
  color: var(--muted);
  font-size: 12px;
}
.m-pcard__price {
  display: flex;
  align-items: baseline;
  gap: 8px;
  margin: 8px 0 10px;
}
.m-pcard__price b {
  font-size: 17px;
  color: var(--secondary-main);
}
.m-pcard__mrp {
  font-size: 13px;
  color: var(--muted);
  text-decoration: line-through;
}
.m-pcard__cta {
  justify-content: center;
  background: #1f9d55;
  font-size: 13px;
  padding: 10px 14px;
  border-radius: 10px;
  margin-top: auto;
}
/* footer */
/* Footer */
.m-foot {
  background: #11182a;
  color: #aeb6c7;
}

.m-foot__cta {
  background: #0c1322;
  text-align: center;
  padding: 30px 16px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.07);
}

.m-foot__cta h2 {
  margin: 0 0 6px;
  color: #fff;
  font-size: clamp(22px, 3vw, 30px);
  font-weight: 800;
}

.m-foot__cta h2 em {
  color: var(--gold);
  font-style: italic;
}

.m-foot__cta p {
  margin: 0;
  color: #8b93a6;
  font-size: 14px;
}

.m-foot__badges {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 12px;
  margin-top: 18px;
}

.m-foot__badge {
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 10px;
  padding: 10px 16px;
  font-size: 13px;
  color: #cfd5e1;
}

.m-foot__badge b {
  color: var(--gold);
}

.m-foot__cols {
  display: grid;
  grid-template-columns: 1fr;
  gap: 30px;
  max-width: 1200px;
  margin: auto;
  padding: 50px 20px;
}

.m-foot__cols h4 {
  color: #fff;
  font-size: 15px;
  margin-bottom: 15px;
}

.m-foot__cols a,
.m-foot__cols p {
  display: block;
  color: #9aa3b6;
  text-decoration: none;
  font-size: 13px;
  line-height: 2;
  margin: 0;
}

.m-foot__cols a:hover {
  color: #fff;
}

/* Brand */

.m-foot__wm {
  display: flex;
  flex-direction: column;
  gap: 4px;
  margin-bottom: 18px;
  line-height: 1;
}

.m-foot__wm b {
  display: block;
  font-size: 28px;
  font-weight: 800;
  letter-spacing: 0.08em;
  color: var(--gold);
}

.m-foot__wm span {
  display: block;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.35em;
  color: #cfd5e1;
  text-transform: uppercase;
}

.m-foot__brand p {
  font-size: 13px;
  line-height: 1.8;
  color: #9aa3b6;
  max-width: 320px;
}

.m-foot__bottom {
  border-top: 1px solid rgba(255, 255, 255, 0.07);
  text-align: center;
  font-size: 12px;
  color: #6b7488;
  padding: 18px 16px;
}

/* WhatsApp */

.m-wa {
  position: fixed;
  right: 16px;
  bottom: 16px;
  z-index: 60;
  width: 54px;
  height: 54px;
  border-radius: 50%;
  background: #1f9d55;
  color: #fff;
  display: grid;
  place-items: center;
  font-size: 26px;
  text-decoration: none;
  box-shadow: 0 8px 22px rgba(31, 157, 85, 0.45);
}

/* Responsive */

@media (max-width: 600px) {
  .m-header__in {
    gap: 10px;
  }

  .m-logo small {
    display: none;
  }

  .m-logo b {
    font-size: 16px;
  }

  .m-ico > span {
    display: none;
  }

  .m-ico {
    gap: 10px;
  }

  .m-ico .m-pill {
    padding: 0 14px;
    height: 38px;
    font-size: 13px;
  }

  .m-search {
    height: 38px;
    gap: 6px;
  }

  .m-foot__wm {
    align-items: center;
    text-align: center;
  }

  .m-foot__brand p {
    max-width: 100%;
    text-align: center;
  }

  .m-foot__cols {
    text-align: center;
  }
}

@media (min-width: 600px) {
  .m-foot__cols {
    grid-template-columns: 2fr 1fr 1fr 1fr;
    gap: 40px;
  }
}

@media (min-width: 760px) {
  .m-cats {
    display: flex;
    justify-content: space-between;
    gap: 8px;
  }

  .m-cat {
    width: 92px;
  }

  .m-cat__img {
    width: 84px;
  }
}

@media (min-width: 980px) {
  .m-nav {
    display: flex;
  }

  .m-ico {
    margin-left: 0;
  }
}

/* BEGIN shoopy-gen:classic-theme-fit */
/* The classic theme renders each custom HtmlRenderer (Tier-B .sx) section
   inside its own .page-container wrapper — px-4/md:px-10 side padding AND
   max-width:1600px with auto margins — so the cream section backgrounds
   (.sx-about, .sx-bulk, .sx-blog) stop at the container edge instead of
   running edge-to-edge like the reference. calc(50% - 50vw) side margins
   pull every .sx section out to the true viewport width at ANY screen size;
   the inner .sx-wrap re-centres the content at 1200px. 100vw includes the
   scrollbar, so body gets overflow-x:clip to swallow the few px of
   overhang. */
.sx.sx-section {
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
}
html,
body {
  overflow-x: clip;
}

/* The last section otherwise ends flush against the footer (0px). Give the
   page body the SAME gap before the footer as the theme puts between
   sections (measured: 16px mobile / 32px desktop) — applies to every page. */
main {
  padding-bottom: 16px;
}
@media (min-width: 768px) {
  main {
    padding-bottom: 32px;
  }
}

/* Hide the Browse Categories section — the live store's category tiles are
   brand logos that don't match the reference design. #categories carries the
   heading + swiper; the :has() rule also removes the wrapper's spacing. */
#categories {
  display: none !important;
}
.page-container:has(#categories) {
  display: none !important;
}

/* Native product sections (Featured / Best Selling / Products) span the
   theme's full 1600px page-container on wide screens. Cap their inner
   .section grid at 1168px — the same content box as .sx-wrap (1200px incl.
   2×16px padding) — so product rows line up with the custom sections'
   content edge. The .sx sections' full-bleed calc(50% - 50vw) margins are
   relative to this same centred parent, so they keep spanning the full
   viewport. */
.page-container > .section {
  max-width: 1168px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}
/* END shoopy-gen:classic-theme-fit */

/* BEGIN shoopy-gen:classic-native-match */
/* Restyle the classic theme's native Tier-A chrome/sections (section
   headings, category tiles, product-card sale badge, footer) so the live
   store reads like the Chetak reference mockup. These override real theme
   classes and are intentionally store-scoped (this CSS only loads for
   chetakfurniture). The yellow-blob product photos are baked into the image
   assets themselves, so they can't be changed here — only the card chrome. */

/* Section headings (Featured / Best Selling Products / Products …)
   → same styling as the .sx-h2 headings (size, weight, colour, tracking). */
.section-heading {
  color: var(--secondary-main) !important;
  font-weight: 800 !important;
  font-size: clamp(24px, 3.2vw, 34px) !important;
  line-height: 1.15 !important;
  letter-spacing: -0.01em;
}

/* Category tiles → circular image with a brick-red ring (reference look),
   replacing the theme's rounded-square tiles. Covers both the photo tiles
   and the letter-placeholder tiles. */
#categories .cat-card-img-container,
#categories .cat-card-img-root,
#categories .cat-card-no-img-container,
#categories .cat-card-letter-container {
  border-radius: 50% !important;
  aspect-ratio: 1 / 1;
  overflow: hidden;
}
#categories .cat-card-img-root,
#categories .cat-card-no-img-container {
  border: 3px solid #fff;
  box-shadow:
    0 0 0 1.5px var(--red),
    0 8px 18px rgba(27, 36, 64, 0.1);
}
#categories .cat-card-img {
  border-radius: 50% !important;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
#categories .cat-card-title {
  color: var(--secondary-main);
  font-weight: 600;
}

/* Featured Products section → match the reference: a full-bleed cream band
   with a red eyebrow over the heading and a ghost-pill action on the right.
   Targeted via the section's own collection link (position-independent, so
   adding/reordering sections in the admin can't break it). */
[class*="section-wrapper"]:has(a[href="/collections/featured-products"]) {
  background: var(--cream) !important;
  padding: clamp(28px, 4vw, 52px) 0;
}
/* The theme also paints the inner container white (via its
   --section-background-color / --sec-bg-color vars) — clear it so the whole
   band reads cream and only the product cards stay white. */
[class*="section-wrapper"]:has(a[href="/collections/featured-products"])
  .page-container,
[class*="section-wrapper"]:has(a[href="/collections/featured-products"])
  .section {
  background: transparent !important;
  background-color: transparent !important;
}
/* Eyebrow above the "Featured Products" heading (reference eyebrow text). */
.section:has(a[href="/collections/featured-products"])
  .section-heading::before {
  content: "Rosebuds best sellers";
  display: block;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--red);
  margin-bottom: 8px;
}
/* The heading row already carries its own "View All" pill, so the duplicate
   button below the product grid is hidden on mobile. */
@media (max-width: 767px) {
  .prod-collection-container .view-all {
    display: none !important;
  }
}

/* "View All" → ghost pill (reference "Explore the category" button), on all
   product-section headings. */
.section-heading-viewall {
  display: inline-flex;
  align-items: center;
  background: #fff;
  border: 1.5px solid var(--line);
  border-radius: 999px;
  padding: 11px 22px;
  font-size: 14px;
  font-weight: 700;
  color: var(--secondary-main) !important;
  text-decoration: none;
}

/* Product cards → match the reference featured card (.m-pcard) as closely as
   the theme DOM allows, colour + dimension wise. */

/* Card shell: white, 1px cream line, 14px radius (reference). */
.sh-product-card.pr-long-card,
.product-card .sh-product-card {
  border: 1px solid var(--line) !important;
  border-radius: 14px !important;
  box-shadow: none !important;
}

/* Image sits on a cream panel like the reference (shows behind transparent
   PNGs; harmless behind full-bleed shots). */
.pr-image-ctn.sh-product-img {
  background: var(--cream);
}

/* Reference cards carry no wishlist heart or rating chip — hide both. */
.sh-product-card .pr-wishlist,
.sh-product-card .pr-rating {
  display: none !important;
}

/* Sale badge → brick-red, pinned top-left, uppercase ("35% OFF"), reference
   dimensions. */
.pr-discount.sh-product-card-discount-tag {
  background: var(--red) !important;
  color: #fff !important;
  top: 10px;
  left: 10px;
  right: auto;
  padding: 4px 9px;
  border-radius: 6px;
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
}

/* Title → brand navy, reference weight/size, with the reference's breathing
   room below it. */
.pr-title.sh-product-card-name {
  color: var(--secondary-main) !important;
  font-weight: 700 !important;
  font-size: 15px !important;
  line-height: 1.3 !important;
  margin: 0 0 4px !important;
}

/* Price row rhythm → reference .m-pcard__price (margin 8px 0 10px, baseline
   gap between sale price and struck MRP). */
.sh-product-card .pr-price.sh-product-card-price-ctn {
  margin: 6px 0 10px !important;
  gap: 8px;
  align-items: baseline;
}

/* Image flush to the card edges (reference): the theme pads the whole card
   by 8px — strip it so the photo runs edge-to-edge; the body keeps its own
   spacing via .pr-card-content below. Image follows the card's top radius,
   bottom corners flat. */
.sh-product-card.pr-long-card {
  padding: 0 !important;
}
.sh-product-card .pr-image-ctn,
.sh-product-card .pr-image-ctn .pr-image {
  border-radius: 13px 13px 0 0 !important;
}

/* Card body spacing → reference breathing room. */
.sh-product-card .pr-card-content {
  padding: 13px 14px 16px !important;
}

/* Variant selects (reference has none) → blend with the card chrome. */
.sh-product-card select {
  border: 1px solid var(--line) !important;
  border-radius: 8px !important;
  color: var(--ink) !important;
  font-size: 13px;
  background-color: #fff;
}

/* Price → sale price 19px navy bold; MRP 13px muted strike-through. */
.pr-sale-price.sh-product-card-price {
  color: var(--secondary-main) !important;
  font-size: 19px !important;
  font-weight: 700 !important;
}
.pr-mrp-price.sh-product-card-mrp {
  color: var(--muted) !important;
  font-size: 13px !important;
}

/* "Order on WhatsApp" CTA → solid brand green, white bold label, text only
   (the reference button has no icon), replacing the theme's outlined red
   button. */
.pr-card-action-enquiry.sh-product-card-enquiry {
  background: #1f9d55 !important;
  border: none !important;
  border-radius: 10px !important;
  color: #fff !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  min-height: 44px;
}
.pr-card-action-enquiry.sh-product-card-enquiry,
.pr-card-action-enquiry.sh-product-card-enquiry * {
  color: #fff !important;
}
.pr-card-action-enquiry.sh-product-card-enquiry svg,
.pr-card-action-enquiry.sh-product-card-enquiry .whatsapp-enq-button-icon {
  display: none !important;
}

/* PDP "Order on WhatsApp" enquiry button (product-footer) → same brand
   green as the product-card CTAs, replacing the theme-red MUI button. */
button.sh-product-enquiry,
button.sh-product-enquiry:hover,
button.sh-product-enquiry:focus {
  background: #1f9d55 !important;
  background-color: #1f9d55 !important;
  border-color: #1f9d55 !important;
  color: #fff !important;
  border-radius: 10px !important;
}
button.sh-product-enquiry a,
button.sh-product-enquiry span {
  color: #fff !important;
}

/* Footer → deep-navy premium surface with gold section titles, matching the
   reference footer (the theme default renders it light). */
.footer-type-3 {
  background: #11182a !important;
}
.footer-type-3,
.footer-type-3 p,
.footer-type-3 span,
.footer-type-3 abbr,
.footer-type-3 strong,
.footer-type-3 li {
  color: #aeb6c7 !important;
}
.footer-type-3 .footer-row-title {
  color: var(--gold) !important;
}
.footer-type-3 a {
  color: #9aa3b6 !important;
}
.footer-type-3 a:hover {
  color: #fff !important;
}
.footer-type-3 svg,
.footer-type-3 .sh-footer-icon {
  fill: var(--gold) !important;
  color: var(--gold) !important;
}

/* Header → align to the reference's navy-on-white palette. (The layout itself
   — search in the centre, nav on the right, the cart drawn as a labelled
   "Cart · 0" pill, and the menu labels — is theme + store-menu data and can't
   be restructured from CSS; the colours can.) */

/* Recolour the header accent (account / cart / search icons) from theme red
   to brand navy. */
#app-header.sh-header-main {
  --header-accent: var(--secondary-main);
}

/* Nav links → brand navy, medium weight (override the theme's inline black),
   with a brick-red hover like the reference. */
#app-header .nav-link {
  color: var(--secondary-main) !important;
  font-weight: 600;
}
#app-header .nav-link:hover {
  color: var(--red) !important;
}

/* Wishlist heart → navy to match the rest of the header. */
#app-header .header-wishlist a,
#app-header .header-wishlist svg {
  color: var(--secondary-main) !important;
  fill: var(--secondary-main) !important;
}

/* Cleaner text nav — drop the dropdown carets, as in the reference. */
#app-header .nav-item > svg {
  display: none;
}
/* END shoopy-gen:classic-native-match */

/* BEGIN shoopy-gen:header-match */
/* Rebuild the desktop header chrome to mirror the reference mockup:
   logo · [pinned-open cream search pill] · nav · heart · navy "Cart · 0"
   pill. Everything below is scoped to the DESKTOP header (.mob-hide) except
   where noted, so the mobile header keeps its stock layout. */

/* --- Announcement bar: the theme's .app-bar .notice adds 10.5px padding and
   .notice-message a max-width, which draw a pale ring around the navy strip.
   Remove both so the bar runs edge-to-edge like the reference. --- */
#app-header .notice {
  padding: 0 !important;
}
#app-header .notice-message {
  max-width: 100% !important;
  width: 100%;
}

/* --- Search + layout: reference order is logo · search · …gap… · nav.
   The theme keeps search in the right icon cluster, and the nav-overflow JS
   (useOverflowMenu) measures that cluster's width to decide how many menu
   items fit — so the pill is lifted OUT of flow (position:absolute, parked
   beside the logo) and its slot is reserved with a margin on the logo. That
   keeps the JS measurements truthful: nav goes right (margin-left:auto),
   search sits left, pinned open as a cream input pill (reference .m-search)
   at ALL desktop widths — when space runs short the nav scrolls horizontally
   (scrollbar hidden) instead of colliding. --- */
/* Store title next to the logo — kept visible, styled as the reference
   wordmark (.m-logo): "CHETAK" in navy over "FURNITURE" in red caps. */
.sh-header-main.mob-hide .title-ctn a {
  display: inline-flex !important;
}
.sh-header-main.mob-hide .title-ctn .title {
  margin: 0;
  font-size: 18px;
  font-weight: 800;
  color: var(--secondary-main);
  white-space: nowrap;
  letter-spacing: 0.02em;
  line-height: 1;
}
.sh-header-main.mob-hide .title-ctn .punchline {
  margin: 3px 0 0;
  line-height: 1;
}
.sh-header-main.mob-hide .title-ctn .punchline a {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.18em;
  color: var(--red);
  text-decoration: none;
  white-space: nowrap;
}
/* Header row wrapped into the same 1200px content container as the page
   sections (reference .m-header__in: max-width 1200 + 16px padding), so the
   logo and heart line up exactly with the section content edges. */
.sh-header-main.mob-hide .app-bar-main .page-container {
  position: relative;
  max-width: 1200px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 16px;
  padding-right: 16px;
  gap: 16px;
}
/* Flatten the theme's two header clusters (logo+nav / icons) into ONE flex
   row so the search pill can sit between logo and nav and flex like the
   reference .m-search. Side effect: the nav-overflow JS measures the icon
   cluster as zero width and keeps every menu item visible — which is what
   we want, since the scrollable nav below replaces its "···" behaviour. */
.sh-header-main.mob-hide
  .app-bar-main
  .page-container
  > .flex.items-center.gap-4 {
  display: contents;
}
.sh-header-main.mob-hide .logo-ctn {
  order: -2;
}
/* The emptied location-selector wrapper would otherwise leave a stray flex
   gap in the flattened row. */
.sh-header-main.mob-hide
  .app-bar-main
  .page-container
  div:has(> button[aria-label="Select delivery location"]) {
  display: none !important;
}
/* Menu on the right; scrolls horizontally (scrollbar hidden) when space
   runs short instead of colliding (reference .m-row pattern). */
.sh-header-main.mob-hide nav.desktop-nav {
  margin-left: auto;
  min-width: 0;
  overflow-x: auto;
  scrollbar-width: none;
}
.sh-header-main.mob-hide nav.desktop-nav::-webkit-scrollbar {
  display: none;
}
/* Reference responsive behaviour: below 980px the nav hides and the search
   keeps the space (the heart takes over pushing the icons right). */
@media (max-width: 979px) {
  .sh-header-main.mob-hide nav.desktop-nav {
    display: none;
  }
  .sh-header-main.mob-hide .header-wishlist {
    margin-left: auto;
  }
}
/* The pill itself — in flow between logo and nav, growing to 440px and
   shrinking to 180px, exactly the reference .m-search (flex:1, max 440). */
.sh-header-main.mob-hide .search-container {
  order: -1;
  flex: 1 1 auto;
  max-width: 440px;
  min-width: 180px;
  padding: 0 16px;
  height: 42px;
  background: var(--cream);
  border: 1px solid var(--line) !important;
  border-radius: 999px !important;
  gap: 6px;
}
  .sh-header-main.mob-hide .search-container:before {
    content: unset !important;
  }
  .sh-header-main.mob-hide .search-container .input-container {
    display: block !important;
    opacity: 1 !important;
    pointer-events: auto !important;
    visibility: visible !important;
    width: auto !important;
    flex: 1;
    min-width: 0;
  }
  .sh-header-main.mob-hide .search-shell {
    padding: 0 !important;
  }
  .sh-header-main.mob-hide .input-container .search-box {
    border: none !important;
    background: transparent !important;
    box-shadow: none !important;
  }
  .sh-header-main.mob-hide #desktop-search-bar {
    color: var(--ink) !important;
    font-size: 14px;
  }
  .sh-header-main.mob-hide #desktop-search-bar::placeholder {
    color: var(--muted);
    opacity: 1;
  }
  .sh-header-main.mob-hide .search-container .search-icon {
    order: -1;
  }
  .sh-header-main.mob-hide .search-icon svg {
    width: 20px;
    height: 20px;
    flex: none;
    color: var(--muted);
  }
  .sh-header-main.mob-hide .search-btn-close {
    margin-right: 4px !important;
    padding-left: 6px !important;
  }

/* --- Nav: swap Tailwind space-x margins for an even reference-style gap. --- */
#app-header nav.desktop-nav .space-x-4 > :not([hidden]) ~ :not([hidden]) {
  margin: unset !important;
}
#app-header nav.desktop-nav > .flex.items-center.space-x-4 {
  gap: 20px;
}
#app-header .nav-link {
  font-size: 14px;
}

/* --- Right cluster: reference shows heart + cart pill only. --- */
/* Hide the delivery-location selector (not in the reference; both headers). */
#app-header [aria-label="Select delivery location"] {
  display: none !important;
}
/* Hide the account icon on desktop (account stays reachable via footer
   Quick Links and the mobile menu). */
.sh-header-main.mob-hide .account-popup {
  display: none !important;
}
/* Un-hide the wishlist heart (theme hides it; the reference shows ♡). */
.sh-header-main.mob-hide .header-wishlist {
  display: flex !important;
}

/* --- Cart: removed from the header (desktop AND mobile) — the store is
   enquiry-driven (WhatsApp ordering), so no cart entry point is shown. The
   :has() rule also removes the cart's wrapper so no stray flex gap
   remains in the flattened desktop row. --- */
#app-header a[href="/cart-detail"],
#app-header div:has(> a[href="/cart-detail"]) {
  display: none !important;
}
/* END shoopy-gen:header-match */