/* Blue homepage refinements, scoped by loading this stylesheet only in index.html. */
body[data-theme="blue"] {
  --ink: #142648;
  --muted: #7a8aa3;
  --primary: #087af5;
  --radius: 22px;
  background: #f6f9fe;
}
.brand-mark { width: 52px; height: 52px; flex-shrink: 0; filter: drop-shadow(0 5px 9px #087af522); }
.brand-name { font-size: 31px; letter-spacing: -1.3px; color: #173761; }
.brand-tagline { color: #8290a7; font-size: 10px; }
.header-inner { min-height: 94px; }
.header-actions .icon-button { color: #667d9c; }
.icon-duotone { fill: none; }
.icon-button:hover { background: #eaf3ff; color: var(--primary); }
.header-actions .new-ad { box-shadow: 0 5px 16px #087af529; border-radius: 13px; }
.search-form { border-color: #e0eaf7; box-shadow: 0 5px 18px #143e7306; padding: 6px 9px; }
.search-form input { font-size: 14px; }
.search-submit { background: #edf5ff; border-radius: 11px; }
.city-button { border-color: #e0eaf7; }
.search-row { margin-block: 20px 13px; }
.arrow-left { transform: rotate(180deg); }

/* A real three-slide cover flow; neighboring cards are always visible. */
.blue-carousel { margin: 0 -8px 23px; }
.carousel-stage { position: relative; height: 380px; perspective: 1300px; overflow: hidden; touch-action: pan-y; isolation: isolate; border-radius: 24px; }
.showcase-slide {
  position: absolute; top: 19px; left: 12%; width: 76%; height: 338px;
  border-radius: 24px; overflow: hidden; background: #e6e7e7;
  transform-style: preserve-3d; transform-origin: center; cursor: pointer;
  transition: transform .6s cubic-bezier(.22,.7,.2,1), opacity .6s, filter .6s, box-shadow .6s;
  backface-visibility: hidden; box-shadow: 0 13px 24px #183b6614;
}
.showcase-slide > img { height: 100%; width: 100%; object-position: 65% 58%; user-select: none; }
.showcase-slide[data-slide-index="1"] > img { object-position: 50% 74%; }
.showcase-slide[data-slide-index="2"] > img { object-position: 60% 55%; }
.showcase-slide:after { content: ''; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(90deg,#f7f8f4f5 0%,#f7f8f4dc 27%,#f7f8f479 46%,transparent 69%); }
.showcase-slide[data-slide-index="2"]:after { background: linear-gradient(90deg,#f3f6fcfa,#f3f6fcd4 37%,#f3f6fc22 68%,transparent); }
.showcase-slide.is-active { z-index: 3; opacity: 1; transform: translateX(0) scale(1) rotateY(0); cursor: auto; box-shadow: 0 16px 23px #14325418; }
.showcase-slide.is-prev { z-index: 1; transform: translateX(87%) scale(.86) rotateY(-17deg); opacity: .72; filter: saturate(.8); }
.showcase-slide.is-next { z-index: 2; transform: translateX(-87%) scale(.86) rotateY(17deg); opacity: .72; filter: saturate(.8); }
.showcase-copy { position: absolute; z-index: 1; inset: 0 auto 0 0; width: 56%; padding: 25px 40px; display: flex; flex-direction: column; align-items: flex-start; justify-content: center; text-align: right; direction: rtl; }
.hero-eyebrow { display: inline-flex; align-items: center; gap: 6px; font-size: 11px; font-weight: 700; color: #46739c; margin-bottom: 11px; }
.hero-eyebrow .icon { width: 18px; height: 18px; color: var(--primary); }
.showcase-copy h2 { font-size: 33px; font-weight: 900; letter-spacing: -.9px; line-height: 1.65; color: #15334f; }
.showcase-copy h2 span { color: #1261b9; }
.showcase-copy p { margin: 10px 0 18px; font-size: 12px; color: #5c7187; line-height: 2; }
.showcase-copy .button { font-size: 12px; padding-inline: 18px; gap: 10px; border-radius: 12px; }
.showcase-copy .button:focus-visible { outline-offset: -4px; }
.showcase-slide:not(.is-active) .showcase-copy { opacity: 0; pointer-events: none; }
.carousel-arrow { position: absolute; top: calc(50% - 22px); z-index: 5; display: flex; align-items: center; justify-content: center; width: 44px; height: 44px; background: #fff; color: #176ccd; border: 1px solid #e2eaf5; border-radius: 50%; box-shadow: 0 4px 15px #1237581c; transition: transform .2s, background .2s; }
.carousel-arrow:hover { background: #ecf5ff; transform: scale(1.07); }
.carousel-arrow .icon { width: 22px; height: 22px; }
.carousel-previous { right: 9%; }
.carousel-next { left: 9%; }
.carousel-footer { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin: -1px 12% 0; }
.carousel-caption { color: #8291a6; font-size: 11px; }
.carousel-controls { margin: 0; gap: 7px; direction: rtl; }
.carousel-dot { width: 7px; height: 7px; background: #cad8e9; }
.carousel-dot[aria-pressed="true"] { width: 28px; background: #0b7df9; }
.carousel-counter { display: flex; align-items: center; gap: 5px; color: #a1adc1; font-size: 11px; min-width: 45px; justify-content: flex-end; }
.carousel-counter b { color: #557399; font-size: 13px; }

/* More deliberate icon surfaces and section hierarchy. */
.category-panel { padding: 23px 24px 20px; box-shadow: 0 6px 24px #264d7e05; }
.category-art { background: linear-gradient(135deg,#fff,var(--tint)); border: 1px solid color-mix(in srgb,var(--color) 10%,white); height: 73px; }
.category-art .icon { width: 39px; height: 39px; fill: none; filter: drop-shadow(0 3px 3px color-mix(in srgb,var(--color) 14%,transparent)); }
.category-label { font-size: 12px; color: #354f6c; }
.section-title { font-size: 21px; color: #18345b; }
.section-title > [data-icon] { width: 32px; height: 32px; background: #eaf3ff; border-radius: 10px; color: #087af5; }
.section-title > [data-icon] .icon { width: 22px; height: 22px; }
.section-subtitle { display: flex; align-items: center; gap: 8px; margin-top: 6px; }
.location-label { display: inline-flex; align-items: center; gap: 3px; padding: 1px 8px; border-radius: 7px; background: #eaf2fd; color: #4976a5; font-size: 10px; }
.location-label .icon { width: 12px; height: 12px; }
.view-all { font-weight: 400; gap: 8px; }
.view-all [data-icon] { width: 23px; height: 23px; background: #eaf3ff; border-radius: 50%; }
.view-all .icon { width: 13px; height: 13px; }
.quick-item { padding-block: 15px; font-weight: 400; }
.quick-item .icon { width: 27px; height: 27px; }
.quick-item:hover { background: #fcfdff; }

/* Each photo owns its favorite button, picture count and promotion badge. */
.ad-card { border-radius: 19px; border-color: #e5edf8; box-shadow: 0 6px 22px #1f437906; }
.card-media { position: relative; margin: 8px 8px 0; border-radius: 13px; }
.media-link { padding: 0; display: block; width: 100%; height: 100%; border-radius: inherit; }
.media-link:focus-visible { outline-offset: -4px; }
.media-link img { height: 100%; }
.favorite-button, .list-card .favorite-button { position: absolute; top: 10px; left: 10px; right: auto; bottom: auto; width: 34px; height: 34px; background: #fffffff0; backdrop-filter: blur(8px); color: #44627f; border-radius: 50%; filter: none; box-shadow: 0 2px 8px #091d2810; border: 1px solid #ffffff90; z-index: 2; }
.favorite-button .icon, .list-card .favorite-button .icon { width: 21px; height: 21px; }
.favorite-button:hover { background: #fff; transform: scale(1.08); }
.favorite-button[aria-pressed="true"], .list-card .favorite-button[aria-pressed="true"] { color: #ef386d; background: #fff1f5; }
.favorite-button[aria-pressed="true"] .icon, .list-card .favorite-button[aria-pressed="true"] .icon { fill: none; stroke: none; }
.favorite-button[aria-pressed="true"] .icon .icon-base { opacity: 1; }
.photo-count { position: absolute; left: 10px; bottom: 10px; display: flex; align-items: center; gap: 4px; padding: 3px 7px; border-radius: 7px; background: #152435aa; backdrop-filter: blur(7px); color: #fff; font-size: 10px; pointer-events: none; }
.photo-count .icon { width: 15px; height: 15px; }
.card-badge { right: 10px; bottom: 10px; border-radius: 7px; background: #ffdf78; padding: 4px 8px; font-size: 10px; box-shadow: 0 2px 6px #523d0b0b; }
.card-badge .icon { width: 13px; height: 13px; fill: none; }
.card-body { width: 100%; text-align: right; padding: 13px 16px 14px; }
.card-topline { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 8px; }
.condition-label { font-size: 10px; line-height: 1.5; color: #8793a4; }
.condition-good { color: #289c7d; }
.condition-label:before { content: ''; display: inline-block; width: 4px; height: 4px; border-radius: 50%; background: currentColor; margin-left: 5px; vertical-align: middle; opacity: .65; }
.posted-time { color: #95a1b2; font-size: 10px; }
.card-body h3 { font-size: 15px; line-height: 1.8; min-height: 27px; margin-bottom: 8px; }
.card-meta { margin-top: 4px; color: #8c98ac; font-size: 11px; gap: 5px; }
.card-meta .icon { width: 14px; height: 14px; color: #9aacc1; }
.card-price { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-top: 14px; padding-top: 12px; border-top: 1px solid #f0f3f9; font-size: 17px; color: #176dcc; }
.card-price small { font-size: 11px; font-weight: 400; }
.card-open-arrow { display: inline-flex; align-items: center; justify-content: center; width: 25px; height: 25px; flex-shrink: 0; border-radius: 50%; background: #f0f6fe; color: #2782e6; }
.card-open-arrow .icon { width: 14px; height: 14px; transform: rotate(180deg); }
.list-card { grid-template-columns: 142px minmax(0,1fr); padding: 8px; border-radius: 17px; border-color: #e3edf8; align-items: stretch; }
.list-card .card-media { width: 142px; height: 140px; aspect-ratio: auto; margin: 0; border-radius: 11px; }
.list-card .card-body { padding: 5px 16px 4px 5px; min-width: 0; direction: rtl; }
.list-card .card-topline { margin-bottom: 3px; }
.list-card h3 { font-size: 14px; margin-bottom: 3px; padding: 0; min-height: auto; }
.list-card .card-description { font-size: 11px; color: #96a1b3; line-height: 1.7; }
.list-card .card-meta { padding: 0; flex-wrap: nowrap; margin-top: 8px; gap: 5px; white-space: nowrap; font-size: 10px; }
.list-card .meta-divider { color: #bdc7d3; }
.list-card .card-price { position: static; margin-top: 9px; padding-top: 7px; font-size: 15px; }
.list-card .card-price small { font-size: 10px; }
.list-card .card-open-arrow { width: 23px; height: 23px; }
.list-card .favorite-button { top: 7px; left: 7px; width: 30px; height: 30px; display: flex; }
.list-card .favorite-button .icon { width: 19px; height: 19px; }
.list-card .photo-count { left: 7px; bottom: 7px; padding: 2px 5px; font-size: 9px; }
.list-card .photo-count .icon { width: 13px; height: 13px; }

/* Search suggestions are queries, not category filters. */
.popular-searches { display: flex; align-items: center; gap: 16px; margin: 18px 0; border-top: 1px solid #e9eff8; padding-top: 16px; }
.popular-label { display: flex; align-items: center; gap: 6px; white-space: nowrap; color: #74849b; font-size: 11px; }
.popular-label .icon { color: #f59a35; width: 19px; height: 19px; }
.search-chips { margin: 0; padding: 3px 2px; flex: 1; gap: 8px; }
.search-chip { padding: 6px 11px; border-radius: 9px; font-size: 11px; background: #fff; color: #6282a5; border-color: #dfeaf7; gap: 5px; min-height: 34px; }
.search-chip .icon { width: 14px; height: 14px; color: #94afcb; }
.search-chip:hover { border-color: #7db7fb; background: #f0f7ff; }
.search-chip[aria-pressed="true"] .icon { color: #fff; }
.saved-count { position: absolute; top: 3px; right: 0; min-width: 15px; height: 15px; border-radius: 6px; color: #fff; background: #ff527b; font-size: 8px; line-height: 15px; border: 1px solid #fff; padding-inline: 3px; }
.saved-count[hidden] { display: none; }
.bottom-nav [data-action="favorites"] .saved-count { top: -2px; right: calc(50% - 23px); }
.bottom-nav { background: #fffffff5; border-radius: 19px 19px 0 0; border-color: #e1ebfa; box-shadow: 0 -5px 25px #14345e08; }
.bottom-nav .icon { width: 26px; height: 26px; fill: none; color: #95a4ba; }
.bottom-nav :is(button,a).active .icon { color: #0779f5; fill: none; }
.bottom-nav :is(button,a).active:after { content: ''; position: absolute; bottom: -5px; width: 4px; height: 4px; border-radius: 50%; background: #087af5; }
.bottom-nav .nav-create .create-circle { background: linear-gradient(145deg,#31a5ff,#0878f5); box-shadow: 0 4px 16px #087af532; }
.bottom-nav .nav-create .icon { color: #fff; }
.trust-icon { border-radius: 15px; background: #eef5ff; }
.detail-gallery { position: relative; }
.detail-gallery .detail-img { height: 240px; width: 100%; }
.detail-photo-count { position: absolute; bottom: 12px; left: 12px; background: #193046b0; color: #fff; display: flex; align-items: center; gap: 5px; padding: 5px 9px; border-radius: 8px; font-size: 11px; }
.detail-photo-count .icon { width: 16px; height: 16px; }
.gallery-arrow { position: absolute; top: calc(50% - 18px); width: 36px; height: 36px; background: #fff; color: #32638f; display: flex; justify-content: center; align-items: center; border-radius: 50%; box-shadow: 0 2px 12px #0002; }
.gallery-prev { right: 10px; }
.gallery-next { left: 10px; }
.gallery-next .icon { transform: rotate(180deg); }

@media (max-width:1050px) {
  .carousel-stage { height: 335px; }
  .showcase-slide { height: 291px; left: 10%; width: 80%; }
  .showcase-copy { width: 62%; padding: 23px 30px; }
  .showcase-copy h2 { font-size: 28px; }
  .carousel-previous { right: 7%; }
  .carousel-next { left: 7%; }
  .list-card .card-media { width: 142px; height: 140px; }
  .list-card .card-price { position: static; }
  .popular-searches { gap: 9px; }
  .popular-label { font-size: 10px; }
}
@media (max-width:700px) {
  .header-inner { min-height: 79px; }
  .brand { gap: 6px; }
  .brand-mark { width: 40px; height: 40px; }
  .brand-name { font-size: 25px; letter-spacing: -1px; }
  .brand-tagline { font-size: 8px; }
  .header-actions .new-ad { font-size: 11px; padding: 8px 12px; min-height: 38px; }
  .search-row { margin-block: 13px 8px; }
  .search-form input { font-size: 11px; }
  .search-submit { width: 34px; height: 34px; border-radius: 9px; }
  .search-submit .icon { width: 19px; height: 19px; }
  .city-button { min-width: 88px; }
  .blue-carousel { margin-inline: -9px; margin-bottom: 20px; }
  .carousel-stage { height: 294px; perspective: 850px; border-radius: 0; }
  .showcase-slide { top: 16px; left: 8%; width: 84%; height: 259px; border-radius: 19px; }
  .showcase-slide.is-prev { transform: translateX(90%) scale(.85) rotateY(-17deg); }
  .showcase-slide.is-next { transform: translateX(-90%) scale(.85) rotateY(17deg); }
  .showcase-slide:after { background: linear-gradient(90deg,#f5f7f5f5,#f5f7f5d1 45%,#f5f7f52b 73%,transparent); }
  .showcase-copy { width: 77%; padding: 22px 19px; }
  .showcase-copy h2 { font-size: 24px; line-height: 1.7; letter-spacing: -.8px; }
  .hero-eyebrow { font-size: 9px; margin-bottom: 8px; gap: 4px; }
  .hero-eyebrow .icon { width: 15px; height: 15px; }
  .showcase-copy p { font-size: 10px; margin-block: 8px 15px; line-height: 1.9; }
  .showcase-copy .button { min-height: 37px; padding: 8px 11px; font-size: 10px; gap: 7px; }
  .showcase-copy .button .icon { width: 15px; height: 15px; }
  .carousel-arrow { width: 36px; height: 36px; top: calc(50% - 18px); }
  .carousel-arrow .icon { width: 18px; height: 18px; }
  .carousel-previous { right: 2px; }
  .carousel-next { left: 2px; }
  .carousel-footer { margin: 1px 9% 0; }
  .carousel-caption { font-size: 9px; }
  .carousel-counter { min-width: 28px; font-size: 9px; gap: 3px; }
  .carousel-counter b { font-size: 11px; }
  .carousel-controls { gap: 5px; }
  .category-panel { padding: 15px 12px; }
  .category-grid { gap: 16px 10px; }
  .category-art { height: 55px; border-radius: 14px; }
  .category-art .icon { width: 31px; height: 31px; }
  .category-label { font-size: 10px; }
  .section-title { font-size: 17px; }
  .section-title > [data-icon] { width: 28px; height: 28px; border-radius: 9px; }
  .section-title > [data-icon] .icon { width: 19px; height: 19px; }
  .view-all { font-size: 10px; gap: 5px; }
  .view-all [data-icon] { width: 21px; height: 21px; }
  .featured-grid .ad-card { flex-basis: 76%; }
  .card-media { margin: 7px 7px 0; }
  .favorite-button { top: 9px; left: 9px; width: 33px; height: 33px; }
  .card-body { padding: 11px 13px 13px; }
  .card-body h3 { font-size: 14px; margin-bottom: 7px; }
  .card-topline { margin-bottom: 6px; }
  .card-price { font-size: 16px; margin-top: 11px; padding-top: 9px; }
  .card-price small { font-size: 10px; }
  .list-card { grid-template-columns: 109px minmax(0,1fr); padding: 7px; border-radius: 15px; }
  .list-card .card-media { width: 109px; height: 134px; }
  .list-card .card-body { padding: 4px 10px 2px 1px; }
  .list-card .favorite-button { top: 7px; left: 7px; right: auto; width: 29px; height: 29px; }
  .list-card .favorite-button .icon { width: 18px; height: 18px; }
  .list-card h3 { font-size: 12px; padding: 0; white-space: nowrap; margin-bottom: 5px; }
  .list-card .card-description { font-size: 10px; }
  .list-card .card-meta { font-size: 9px; gap: 3px; flex-wrap: wrap; margin-top: 7px; }
  .list-card .card-meta .icon { width: 12px; height: 12px; }
  .list-card .card-price { font-size: 13px; padding-top: 7px; margin-top: 8px; gap: 3px; }
  .list-card .card-price small { font-size: 9px; }
  .list-card .card-open-arrow { width: 20px; height: 20px; }
  .list-card .card-open-arrow .icon { width: 12px; height: 12px; }
  .condition-label, .posted-time { font-size: 9px; }
  .section-subtitle { font-size: 9px; gap: 5px; }
  .location-label { font-size: 9px; }
  .popular-searches { display: block; margin-block: 15px; padding-top: 12px; }
  .popular-label { font-size: 10px; margin-bottom: 7px; }
  .popular-label .icon { width: 17px; height: 17px; }
  .search-chips { padding: 4px 2px; gap: 6px; }
  .search-chip { font-size: 10px; padding: 6px 10px; border-radius: 8px; min-height: 33px; }
  .search-chip .icon { width: 13px; height: 13px; }
  .quick-item { padding-block: 12px; font-size: 11px; }
  .quick-item .icon { width: 24px; height: 24px; }
  .bottom-nav { min-height: 73px; padding-top: 10px; }
  .bottom-nav :is(button,a) { gap: 4px; font-size: 9px; }
  .bottom-nav .icon { width: 26px; height: 26px; }
  .bottom-nav .nav-create .create-circle { width: 48px; height: 48px; }
}
@media (max-width:360px) {
  .brand-mark { width: 35px; height: 35px; }
  .brand-name { font-size: 23px; }
  .brand-tagline { font-size: 7px; }
  .showcase-copy { padding-inline: 16px; width: 81%; }
  .showcase-copy h2 { font-size: 21px; }
  .showcase-copy p { font-size: 9px; }
  .hero-eyebrow { font-size: 8px; }
  .carousel-caption { font-size: 8px; }
  .list-card { grid-template-columns: 91px minmax(0,1fr); }
  .list-card .card-media { width: 91px; }
  .list-card h3 { font-size: 11px; }
  .list-card .card-price { font-size: 12px; }
  .list-card .card-description { font-size: 9px; }
  .category-label { font-size: 9px; }
}
@media (prefers-reduced-motion: reduce) {
  .showcase-slide, .carousel-arrow { transition: none; }
}
/* Keep copy on the quiet portion of the photograph and side previews photographic. */
.showcase-copy{align-items:center;text-align:center}
.showcase-slide:not(.is-active):after{background:#183d5808}
.showcase-slide.is-prev,.showcase-slide.is-next{opacity:.84;filter:saturate(.92)}
@media(max-width:700px){.showcase-copy{width:75%;padding-inline:11px}.showcase-copy h2{font-size:23px}.showcase-copy p{font-size:10px}.hero-eyebrow{font-size:8px}.carousel-counter{direction:rtl}.photo-count{font-variant-numeric:tabular-nums}}
@media(max-width:360px){.showcase-copy h2{font-size:20px}.showcase-copy p{font-size:9px}}

/* Icons from the user's Marketplace Twotone pack; preserve the supplied artwork. */
img.pack-icon{object-fit:contain;flex-shrink:0;filter:none!important;vertical-align:middle;pointer-events:none}
.category-art{background:linear-gradient(145deg,#fbfdff,#edf2ff);border-color:#e4eaff}
.category-art .pack-icon{width:48px;height:48px}
.category:hover .category-art{box-shadow:0 6px 16px #2856ff12}
.header-actions .icon-button .pack-icon{width:32px;height:32px}
.quick-item .pack-icon{width:32px;height:32px}
.bottom-nav .pack-icon{width:34px;height:34px}
.bottom-nav .nav-create .create-circle{background:#fff;border-color:#eaf1ff;box-shadow:0 4px 17px #073ef12b}
.bottom-nav .nav-create .pack-icon{width:35px;height:35px}
.button-primary .pack-icon{background:#fff;border-radius:5px;padding:1px;width:23px;height:23px}
.showcase-copy .button .pack-icon{background:none;padding:0}
.hero-eyebrow .pack-icon{width:23px;height:23px}
.section-title>[data-icon] .pack-icon{width:26px;height:26px}
.section-title>.star-icon{background:#fff5df}
.favorite-button .pack-icon,.list-card .favorite-button .pack-icon{width:24px;height:24px;opacity:.65}
.favorite-button[aria-pressed=true],.list-card .favorite-button[aria-pressed=true]{background:#edf2ff;border-color:#b7c6ff}
.favorite-button[aria-pressed=true] .pack-icon{opacity:1}
.favorite-button[aria-pressed=true]:after{content:'✓';position:absolute;bottom:-2px;right:-2px;width:13px;height:13px;line-height:12px;border:1px solid #fff;border-radius:50%;background:#073ef1;color:white;font-family:Tahoma,sans-serif;font-size:9px}
.photo-count,.detail-photo-count{background:#fffffff0;color:#345491;box-shadow:0 2px 8px #101f3412}
.photo-count .pack-icon{width:18px;height:18px}
.list-card .photo-count .pack-icon{width:16px;height:16px}
.card-meta .pack-icon{width:16px;height:16px}
.card-badge .pack-icon{width:17px;height:17px}
.trust-icon .pack-icon{width:34px;height:34px}
.popular-label .pack-icon{width:22px;height:22px}
.search-chip .pack-icon{width:17px;height:17px}
.search-chip[aria-pressed=true]{background:#edf2ff;color:#073ef1;border-color:#c1ceff}
@media(max-width:700px){.category-art .pack-icon{width:39px;height:39px}.header-actions .icon-button .pack-icon{width:28px;height:28px}.bottom-nav .pack-icon{width:31px;height:31px}.bottom-nav :is(button,a){gap:1px}.quick-item .pack-icon{width:29px;height:29px}.list-card .favorite-button .pack-icon{width:22px;height:22px}.section-title>[data-icon] .pack-icon{width:24px;height:24px}.trust-icon .pack-icon{width:30px;height:30px}.card-meta .pack-icon{width:14px;height:14px}.hero-eyebrow .pack-icon{width:20px;height:20px}}

/* Soft circular halos, matching the user's Two-Tone Persian Marketplace grid. */
.category-panel {
  background: transparent;
  border: 0;
  box-shadow: none;
  padding: 17px 12px 13px;
}
.category-grid { gap: 22px; }
.category { gap: 9px; }
.category-art {
  position: relative;
  isolation: isolate;
  width: 82px;
  height: 82px;
  background: transparent;
  border: 0;
  border-radius: 50%;
  box-shadow: none;
}
.category-art::before {
  content: '';
  position: absolute;
  inset: 2px;
  z-index: -1;
  border-radius: 50%;
  background: radial-gradient(circle at 42% 38%, #e8ecff 0%, #edf1ff 48%, #f1f4ffb3 72%, #f1f4ff00 100%);
  transition: background .2s, transform .2s;
}
.category-art .pack-icon { width: 72px; height: 72px; }
.category:hover .category-art { box-shadow: none; transform: translateY(-3px); }
.category:hover .category-art::before { transform: scale(1.06); }
.category[aria-pressed=true] .category-art { outline: 0; }
.category[aria-pressed=true] .category-art::before {
  background: radial-gradient(circle at 42% 38%, #dbe3ff 0%, #e4ebff 58%, #edf1ff00 100%);
}
.category[aria-pressed=true] .category-label { color: #073ef1; }
@media (max-width:700px) {
  .category-panel { padding: 6px 4px 9px; }
  .category-grid { gap: 16px 8px; }
  .category { gap: 6px; }
  .category-art { width: 64px; height: 64px; }
  .category-art .pack-icon { width: 57px; height: 57px; }
}
@media (max-width:360px) {
  .category-art { width: 59px; height: 59px; }
  .category-art .pack-icon { width: 53px; height: 53px; }
}

/* Review comments: white category surface, blue promotions and a clear add action. */
.category-panel{background:#fff;border:0;border-radius:22px;padding:22px 16px 20px}
.card-badge{background:#edf3ff;color:#164bba;box-shadow:0 2px 8px #12366c12;border:1px solid #cbdcff}
.section-title>.star-icon{background:#edf3ff}
.bottom-nav .nav-create .pack-icon{width:40px;height:40px}
.new-ad .pack-icon{background:none;padding:0;border-radius:50%;width:24px;height:24px}
.brand-mark{filter:none}
.footer-credentials h3{margin-bottom:13px}
.trust-placeholder{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;width:154px;min-height:152px;padding:15px;border:1px dashed #ced9eb;border-radius:16px;background:#fff;color:#91a1b9;text-align:center}
.trust-placeholder-mark{display:flex;align-items:center;justify-content:center;width:42px;height:42px;color:#a5b6ce;margin-bottom:2px}
.trust-placeholder-mark svg{width:42px;height:42px}
.trust-placeholder strong{font-size:11px;font-weight:400;color:#7a8da8}
.trust-placeholder>span:last-child{font-size:9px;color:#a1afc2}
@media(max-width:700px){.category-panel{padding:15px 7px 14px;border-radius:19px}.footer-credentials{display:flex;flex-direction:column;align-items:center}.footer-credentials h3{align-self:flex-start}.trust-placeholder{width:148px;min-height:146px}.bottom-nav .nav-create .pack-icon{width:39px;height:39px}}
/* A lighter photographic carousel, with pagination recessed into the card edge. */
.blue-carousel{position:relative;margin-bottom:23px}
.showcase-slide{mask-image:radial-gradient(ellipse 66px 25px at 50% 100%,transparent 98%,#000 100%);-webkit-mask-image:radial-gradient(ellipse 66px 25px at 50% 100%,transparent 98%,#000 100%)}
.showcase-slide:after,.showcase-slide[data-slide-index="2"]:after{background:linear-gradient(90deg,#1023369e 0%,#10233652 28%,#10233600 65%)}
.showcase-slide:not(.is-active):after{background:#10233609}
.showcase-copy{width:54%;align-items:flex-start;text-align:right;justify-content:flex-end;padding:28px 35px 42px;gap:17px}
.showcase-copy h2{color:#fff;text-shadow:0 2px 18px #09233833;font-size:30px;line-height:1.6;letter-spacing:-.8px}
.showcase-copy h2 span{color:#fff}
.showcase-copy .button{background:#ffffffee;color:#175fab;box-shadow:0 3px 14px #102a4415;font-size:11px;min-height:40px;padding:8px 13px}
.showcase-slide>img{object-position:65% 54%}
.showcase-slide[data-slide-index="1"]>img,.showcase-slide[data-slide-index="2"]>img{object-position:center}
.carousel-footer{position:absolute;bottom:21px;left:50%;transform:translateX(-50%);margin:0;z-index:4;width:116px;height:30px;justify-content:center;gap:0}
.carousel-controls{gap:2px}
.carousel-dot,.carousel-dot[aria-pressed=true]{display:flex;align-items:center;justify-content:center;background:transparent;width:22px;height:26px;transition:width .25s}
.carousel-dot:before{content:'';width:7px;height:7px;border-radius:20px;background:#c6d2e7;transition:width .25s,background .25s}
.carousel-dot[aria-pressed=true]{width:34px;background:transparent}
.carousel-dot[aria-pressed=true]:before{width:27px;background:#087af5;box-shadow:0 2px 5px #087af51c}
/* Soft layered glow without a hard circular edge. */
.category-art:before{inset:0;background:radial-gradient(ellipse at 40% 32%,#f8fbff 8%,#e6edff 48%,#edf2ff8a 69%,#fff0 82%);box-shadow:0 7px 16px -10px #5487ed4a}
.category-art:after{content:'';position:absolute;z-index:-2;inset:10px -3px -1px;border-radius:50%;background:radial-gradient(ellipse,#dce8ff66,transparent 70%);filter:blur(4px);pointer-events:none}
.category:hover .category-art:before{transform:scale(1.08);box-shadow:0 8px 20px -9px #5487ed60}
.category[aria-pressed=true] .category-art:before{background:radial-gradient(ellipse at 40% 32%,#f4f8ff,#dfe8ff 50%,#edf2ff8a 72%,#fff0 85%)}
.quick-item .pack-icon{width:44px;height:44px}
.quick-item{gap:14px;padding-block:12px}
/* Support and the trust mark share the same footer area. */
.footer-main{grid-template-columns:1.1fr .7fr 1.6fr;gap:28px}
.footer-assistance{display:grid;grid-template-columns:minmax(0,1fr) 120px;gap:20px;align-items:start}
.footer-assistance .footer-contact{border:0;padding:0}
.footer-assistance .footer-contact .button{margin-top:14px;padding:8px 12px;font-size:11px;min-height:38px;max-width:100%}
.footer-assistance .footer-credentials{display:flex;flex-direction:column;align-items:center;padding:0;border:0}
.footer-assistance .footer-credentials h3{align-self:center;font-size:12px;margin-bottom:12px}
.footer-assistance .trust-placeholder{width:120px;min-height:129px;padding:10px;gap:5px}
.footer-assistance .trust-placeholder strong{font-size:10px}
.footer-assistance .trust-placeholder>span:last-child{font-size:8px}
/* Keyboard-accessible sample search suggestions. */
.search-row{position:relative;z-index:7}
.search-form{position:relative;overflow:visible}
.search-selected-category{flex-shrink:0;padding:3px 9px;background:#edf3ff;color:#47719c;font-size:10px;border-radius:7px;margin-left:6px;max-width:95px;text-align:center}
.search-selected-category[hidden],.search-suggestions[hidden]{display:none}
.search-suggestions{position:absolute;top:calc(100% + 8px);right:0;left:0;border:1px solid #e3ecf9;border-radius:15px;background:#fff;box-shadow:0 14px 40px #1538561a;padding:8px;max-height:350px;overflow:auto;z-index:12}
.suggestions-heading{color:#95a3b8;font-size:10px;padding:5px 11px 9px}
/* The «پاک کردن» button next to «جستجوهای اخیر شما». */
.home-search-clear{margin-inline-start:auto;padding:4px 11px;border:1px solid color-mix(in srgb,var(--accent,#087af5) 22%,var(--ui-line,#e3ecf9));border-radius:8px;background:var(--accent-pale,#f0f6ff);font:inherit;font-size:10px;font-weight:500;line-height:1.5;color:var(--accent-strong,#0968d1);cursor:pointer;transition:background .15s,border-color .15s}
.home-search-clear:hover{border-color:var(--accent,#087af5);background:var(--accent-soft,#e8f1ff)}
.suggestion-row{display:flex;justify-content:space-between;align-items:center;gap:14px;cursor:pointer;padding:11px 12px;border-radius:10px;transition:background .15s}
.suggestion-row:hover,.suggestion-row[aria-selected=true]{background:#f0f6ff}
.suggestion-label{font-size:13px;color:#274b71}
.suggestion-category{font-size:10px;color:#8ca0b9;text-align:left}
.suggestions-empty{padding:12px;font-size:11px;color:#8193a9}
@media(max-width:1050px){.showcase-copy{padding:25px 28px 35px;width:60%}.showcase-copy h2{font-size:26px}.carousel-footer{bottom:24px}.footer-main{gap:22px}.footer-assistance{grid-template-columns:minmax(0,1fr) 110px;gap:12px}.footer-assistance .trust-placeholder{width:110px}}
@media(max-width:700px){.showcase-copy{width:76%;padding:19px 20px 36px;gap:14px}.showcase-copy h2{font-size:23px}.showcase-copy .button{min-height:35px;font-size:10px;padding:7px 10px}.showcase-slide:after,.showcase-slide[data-slide-index="2"]:after{background:linear-gradient(90deg,#10233692,#10233630 44%,transparent 75%)}.showcase-slide:not(.is-active):after{background:#10233609}.carousel-footer{bottom:14px}.showcase-slide{mask-image:radial-gradient(ellipse 59px 23px at 50% 100%,transparent 98%,#000 100%);-webkit-mask-image:radial-gradient(ellipse 59px 23px at 50% 100%,transparent 98%,#000 100%)}.quick-item .pack-icon{width:39px;height:39px}.quick-item{gap:8px;padding:9px 11px;font-size:11px}.footer-main{grid-template-columns:1fr}.footer-assistance{grid-template-columns:minmax(0,1fr) 120px;gap:20px;border-top:1px solid var(--line);padding-top:20px}.footer-assistance .trust-placeholder{width:120px}.suggestion-row{padding:10px;gap:5px;align-items:flex-start}.suggestion-label{font-size:12px}.suggestion-category{font-size:9px;max-width:48%}.search-selected-category{font-size:9px;padding:3px 6px;max-width:78px}.search-form input{min-width:0}.search-suggestions{max-height:300px}}
@media(max-width:360px){.showcase-copy h2{font-size:21px}.showcase-copy{padding-inline:17px}.quick-item .pack-icon{width:35px;height:35px}.quick-item{font-size:10px;padding-inline:8px}.footer-assistance{gap:13px;grid-template-columns:minmax(0,1fr) 106px}.footer-assistance .trust-placeholder{width:106px}.footer-assistance .footer-contact p{font-size:10px}.footer-assistance .footer-contact .button{font-size:10px;padding-inline:7px}}
.showcase-copy{align-items:flex-end}
.showcase-copy h2{text-shadow:0 2px 12px #08203ba6}
.showcase-slide:after,.showcase-slide[data-slide-index="2"]:after{background:linear-gradient(90deg,#102336ad 0%,#10233668 36%,#10233600 74%)}
.showcase-slide:not(.is-active):after{background:#10233609}
@media(max-width:700px){.showcase-slide:after,.showcase-slide[data-slide-index="2"]:after{background:linear-gradient(90deg,#102336a3,#10233659 55%,transparent 90%)}.showcase-slide:not(.is-active):after{background:#10233609}}
/* Organic pastel shapes behind the supplied artwork. */
.category-art{--blob-angle:-14deg;--blob-radius:34% 66% 59% 41% / 53% 38% 62% 47%;--blob-start:#e3edff;--blob-end:#efebff}
.category-art::before{inset:5px 3px 2px;background:linear-gradient(140deg,var(--blob-start),var(--blob-end));border-radius:var(--blob-radius);transform:rotate(var(--blob-angle));box-shadow:none;filter:none;opacity:.82}
.category-art::after{inset:18px 0 -1px 18px;border-radius:63% 37% 29% 71% / 34% 61% 39% 66%;background:linear-gradient(145deg,#d7e6ff,#eee8ff);filter:blur(3px);transform:rotate(23deg);opacity:.38;box-shadow:none}
.category:nth-child(3n+2) .category-art{--blob-angle:18deg;--blob-radius:62% 38% 44% 56% / 36% 59% 41% 64%;--blob-start:#e4f1ff;--blob-end:#e9eaff}
.category:nth-child(3n) .category-art{--blob-angle:-24deg;--blob-radius:41% 59% 31% 69% / 64% 34% 66% 36%;--blob-start:#eae9ff;--blob-end:#e2f0ff}
.category:nth-child(even) .category-art::after{inset:0 13px 19px -2px;transform:rotate(-19deg);border-radius:29% 71% 64% 36% / 68% 33% 67% 32%}
.category:hover .category-art::before{transform:rotate(var(--blob-angle)) scale(1.05);box-shadow:none}
.category[aria-pressed=true] .category-art::before{background:linear-gradient(140deg,#d9e5ff,#e6e0ff);opacity:1}
/* Match the sample's shallow S-curve recess, rather than an elliptical cutout. */
.showcase-slide{mask-image:none;-webkit-mask-image:none}
.carousel-footer{--recess-gap:23px;bottom:var(--recess-gap);width:176px;height:34px;isolation:isolate}
.carousel-footer::before{content:'';position:absolute;inset:0;z-index:-1;background:url('../icons/carousel-recess.svg') center bottom / 100% 100% no-repeat;pointer-events:none}
.carousel-controls{gap:3px;padding-top:8px}
.carousel-dot,.carousel-dot[aria-pressed=true]{width:21px;height:26px;background:transparent}
.carousel-dot::before{width:8px;height:8px;background:#cbd3df;box-shadow:none}
.carousel-dot[aria-pressed=true]{width:34px}
.carousel-dot[aria-pressed=true]::before{width:29px;height:9px;background:#087af5;box-shadow:none}
@media(max-width:1050px){.carousel-footer{--recess-gap:25px;width:166px;height:32px}}
@media(max-width:700px){.carousel-footer{--recess-gap:19px;width:152px;height:30px}.carousel-controls{padding-top:6px}}

/* Original full-width mobile navigation, with a small increase in icon size. */
@media(max-width:700px){
 .bottom-nav .pack-icon{width:34px;height:34px}
 .bottom-nav .nav-create .pack-icon{width:40px;height:40px}
}
/* Section separators fade gently at their ends. Keep closed card outlines intact. */
.card-price,.list-card .card-price{position:static;inset:auto;border-top:0;background-image:linear-gradient(90deg,transparent,#edf1f8 7%,#edf1f8 93%,transparent);background-size:100% 1px;background-position:0 0;background-repeat:no-repeat}
.card-price::before{content:none}
.popular-searches,.footer-bottom{position:relative;border-top:0}
.popular-searches::before,.footer-bottom::before{content:'';position:absolute;top:0;right:0;left:0;height:1px;background:linear-gradient(90deg,transparent,#e6edf8 6%,#e6edf8 94%,transparent);pointer-events:none}
.trust-item+.trust-item{position:relative;border-right:0}
.trust-item+.trust-item::before{content:'';position:absolute;right:0;top:0;bottom:0;width:1px;background:linear-gradient(180deg,transparent,#e6edf8 8%,#e6edf8 92%,transparent);pointer-events:none}
@media(max-width:700px){
 .trust-item+.trust-item,.footer-links,.footer-assistance{position:relative;border-top:0}
 .trust-item+.trust-item::before,.footer-links::before,.footer-assistance::before{content:'';position:absolute;top:0;right:0;left:0;bottom:auto;width:auto;height:1px;background:linear-gradient(90deg,transparent,#e6edf8 6%,#e6edf8 94%,transparent);pointer-events:none}
}