.store-page {
    --store-ink: #18304b;
    --store-muted: #66778a;
    --store-orange: #ff511a;
    --store-green: #43ba7f;
    --store-surface: #f6f8fa;
    color: var(--store-ink);
    background: #fff;
}

.store-page[dir="rtl"] {
    font-family: Tahoma, Arial, sans-serif;
}

/* The base template gives every section a 120px top margin. Store owns its
   vertical rhythm, so reset it here—especially for the first hero section. */
.store-page section {
    margin-top: 0;
}

/* Other public pages intentionally shrink from 110px to 80px on scroll. Store
   uses the complete 80px sticky state from first paint, scoped to its marker so
   the shared header behaviour remains unchanged everywhere else. Repeating the
   selector with .background-header prevents any value changing when the shared
   scroll script adds or removes that class. */
.header-area.store-public-header,
.header-area.store-public-header.background-header {
    background: rgba(0, 0, 0, .55);
    box-shadow: 0 0 10px rgba(0, 0, 0, .15);
    height: 80px !important;
    left: 0;
    position: fixed !important;
    right: 0;
    top: 0 !important;
}

.header-area.store-public-header .main-nav .nav {
    margin-top: 18px !important;
}

.header-area.store-public-header .main-nav .menu-trigger {
    top: 23px;
}

.store-hero {
    padding: 155px 0 74px;
    background:
        radial-gradient(circle at 85% 20%, rgba(67, 186, 127, .18), transparent 28%),
        linear-gradient(135deg, #10253c 0%, #183f59 100%);
    color: #fff;
}

.store-hero__inner {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 40px;
}

.store-hero__copy { max-width: 790px; }
.store-eyebrow { color: #73d8a6; font-size: 13px; font-weight: 700; letter-spacing: .13em; text-transform: uppercase; }
.store-hero h1 { color: #fff; font-size: clamp(34px, 5vw, 62px); line-height: 1.08; margin: 14px 0 18px; }
.store-hero p { color: rgba(255,255,255,.78); font-size: 17px; line-height: 1.85; margin: 0; }
.store-content { padding: 58px 0 90px; }
.store-filter { background: var(--store-surface); border: 1px solid #e5eaee; border-radius: 18px; padding: 22px; margin-bottom: 36px; }
.store-filter label { display: block; font-size: 13px; font-weight: 700; margin-bottom: 8px; }
.store-filter input, .store-filter select { background: #fff; border: 1px solid #dce3e9; border-radius: 9px; height: 48px; padding: 0 14px; width: 100%; }
.store-filter__actions { display: flex; align-items: center; gap: 13px; height: 100%; padding-top: 25px; }
.store-button { align-items: center; background: var(--store-orange); border: 0; border-radius: 8px; color: #fff; display: inline-flex; font-weight: 600; justify-content: center; min-height: 46px; padding: 0 21px; }
.store-button:hover { background: #dc4212; color: #fff; }
.store-clear { color: var(--store-muted); font-size: 13px; text-decoration: underline; }
.store-results { color: var(--store-muted); font-size: 14px; margin-bottom: 18px; }

.store-card { background: #fff; border: 1px solid #e4e9ed; border-radius: 17px; box-shadow: 0 12px 34px rgba(24, 48, 75, .07); display: flex; flex-direction: column; height: 100%; overflow: hidden; transition: transform .2s ease, box-shadow .2s ease; }
.store-card:hover { box-shadow: 0 18px 42px rgba(24, 48, 75, .13); transform: translateY(-4px); }
.store-card__cover { aspect-ratio: 16 / 10; background: linear-gradient(135deg, #dce8e3, #dce4ec); overflow: hidden; position: relative; }
.store-card__cover img { height: 100%; object-fit: cover; width: 100%; }
.store-cover-placeholder { align-items: center; color: #718394; display: flex; font-size: 34px; height: 100%; justify-content: center; }
.store-card__body { display: flex; flex: 1; flex-direction: column; padding: 23px; }
.store-card h2 { font-size: 21px; line-height: 1.35; margin: 8px 0 10px; }
.store-card p { color: var(--store-muted); line-height: 1.75; margin-bottom: 20px; }
.store-card__link { color: var(--store-orange); font-weight: 700; margin-top: auto; }
.store-pills { display: flex; flex-wrap: wrap; gap: 7px; }
.store-pill { background: #eaf7f1; border-radius: 999px; color: #278b5c; display: inline-block; font-size: 12px; font-weight: 600; padding: 5px 10px; }
.store-pill--tag { background: #eef2f6; color: #5d6e80; }
.store-price { color: var(--store-ink); font-size: 13px; font-weight: 700; margin-bottom: 8px; }

.store-empty { background: var(--store-surface); border-radius: 18px; padding: 70px 25px; text-align: center; }
.store-empty i { color: var(--store-green); font-size: 42px; margin-bottom: 20px; }
.store-empty h2 { font-size: 24px; }
.store-empty p { color: var(--store-muted); margin: 0; }

.store-pagination { display: flex; justify-content: center; gap: 7px; list-style: none; margin: 42px 0 0; padding: 0; }
.store-pagination a, .store-pagination span { align-items: center; border: 1px solid #dce3e9; border-radius: 8px; color: var(--store-ink); display: flex; min-height: 40px; min-width: 40px; justify-content: center; padding: 0 12px; }
.store-pagination .active span { background: var(--store-orange); border-color: var(--store-orange); color: #fff; }
.store-pagination .disabled span { color: #aab4be; }

.store-detail-hero { padding-bottom: 48px; }
.store-back { color: #74d9a7; display: inline-block; font-weight: 600; margin-bottom: 20px; }
.store-detail { padding: 55px 0 90px; }
.store-detail__cover { aspect-ratio: 16 / 9; background: #e8eef1; border-radius: 20px; box-shadow: 0 18px 45px rgba(24,48,75,.13); overflow: hidden; }
.store-detail__cover img { height: 100%; object-fit: cover; width: 100%; }
.store-detail__section { border-bottom: 1px solid #e5eaee; padding: 30px 0; }
.store-detail__section:last-child { border-bottom: 0; }
.store-detail__section h2 { font-size: 24px; margin-bottom: 15px; }
.store-detail__description { color: var(--store-muted); font-size: 16px; line-height: 1.9; white-space: pre-line; }
.store-highlights { display: grid; gap: 12px; list-style: none; margin: 0; padding: 0; }
.store-highlights li { align-items: flex-start; display: flex; gap: 10px; }
.store-highlights i { color: var(--store-green); margin-top: 5px; }
.store-gallery { margin-top: 24px; }
.store-gallery__item { background: #edf1f4; border-radius: 14px; height: 100%; overflow: hidden; }
.store-gallery__media { aspect-ratio: 4 / 3; width: 100%; }
.store-gallery__media img, .store-gallery__media video { height: 100%; object-fit: cover; width: 100%; }
.store-gallery__caption { color: var(--store-muted); font-size: 13px; line-height: 1.55; margin: 0; padding: 13px 15px; }

[dir="rtl"] .store-highlights i { transform: scaleX(-1); }

@media (max-width: 991px) {
    .store-hero { padding-top: 135px; }
    .store-hero__inner { align-items: flex-start; flex-direction: column; gap: 25px; }
    .store-filter__actions { padding-top: 12px; }
}

@media (max-width: 767px) {
    .header-area.store-public-header.header-sticky .nav {
        margin-top: 80px !important;
    }
}

@media (max-width: 575px) {
    .store-hero { padding: 125px 0 56px; }
    .store-content, .store-detail { padding: 40px 0 65px; }
    .store-filter { padding: 17px; }
    .store-filter__actions { align-items: stretch; flex-direction: column; }
    .store-button { width: 100%; }
}

/* Interest toggle on the listing detail page. */
.store-interest { align-items: center; background: var(--store-surface); border: 1px solid #e5eaee; border-radius: 14px; display: flex; flex-wrap: wrap; gap: 20px; justify-content: space-between; padding: 22px 24px; }
.store-interest--active { background: #f1faf5; border-color: #cdeadb; }
.store-interest__copy { flex: 1 1 260px; }
.store-interest__copy h2 { font-size: 20px; margin: 0 0 6px; }
.store-interest__copy p { color: var(--store-muted); font-size: 14px; line-height: 1.6; margin: 0; }
.store-interest__btn { align-items: center; background: var(--store-orange); border: 0; border-radius: 8px; color: #fff; cursor: pointer; display: inline-flex; font-weight: 600; gap: 9px; justify-content: center; min-height: 46px; padding: 0 22px; transition: background .15s ease; }
.store-interest__btn:hover { background: #dc4212; color: #fff; }
.store-interest__btn--active { background: var(--store-green); }
.store-interest__btn--active:hover { background: #35a26c; }
.store-interest__btn:focus-visible { outline: 2px solid var(--store-ink); outline-offset: 2px; }
.store-interest__flash { background: #eaf7f1; border-radius: 8px; color: #278b5c; font-size: 14px; font-weight: 600; margin: 0 0 16px; padding: 12px 15px; }

@media (max-width: 575px) {
    .store-interest { padding: 18px; }
    .store-interest__btn, .store-interest form { width: 100%; }
}

/* Disclosure-gated detail sections. Each renders only when the listing's
   per-field switch is on, so any of these may be absent on a given design. */
.store-specs { display: grid; gap: 16px; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); margin: 0; }
.store-specs__item { background: var(--store-surface); border: 1px solid #e5eaee; border-radius: 12px; padding: 16px 18px; }
.store-specs dt { color: var(--store-muted); font-size: 12px; font-weight: 700; letter-spacing: .07em; margin-bottom: 6px; text-transform: uppercase; }
.store-specs dd { color: var(--store-ink); font-size: 19px; font-weight: 700; margin: 0; }

.store-team { display: grid; gap: 10px; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); list-style: none; margin: 0; padding: 0; }
.store-team__member { align-items: baseline; background: var(--store-surface); border: 1px solid #e5eaee; border-radius: 12px; display: flex; flex-wrap: wrap; gap: 8px; padding: 13px 16px; }
.store-team__name { color: var(--store-ink); font-weight: 700; }
.store-team__role { color: var(--store-muted); font-size: 13px; }

/* Wide content scrolls inside its own box so the page body never does. */
.store-table-scroll { -webkit-overflow-scrolling: touch; overflow-x: auto; }
.store-materials { border-collapse: collapse; min-width: 480px; width: 100%; }
.store-materials th, .store-materials td { border-bottom: 1px solid #e5eaee; padding: 11px 14px; text-align: start; }
.store-materials th { color: var(--store-muted); font-size: 12px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; white-space: nowrap; }
.store-materials td { color: var(--store-ink); font-size: 15px; }
.store-materials tbody tr:last-child th, .store-materials tbody tr:last-child td { border-bottom: 0; }

.store-files__hint { color: var(--store-muted); font-size: 14px; margin-bottom: 14px; }
.store-files { display: grid; gap: 10px; list-style: none; margin: 0; padding: 0; }
.store-files__item { align-items: center; background: var(--store-surface); border: 1px solid #e5eaee; border-radius: 12px; display: flex; flex-wrap: wrap; gap: 10px; justify-content: space-between; padding: 13px 16px; }
.store-files__item a { align-items: center; color: var(--store-ink); display: inline-flex; font-weight: 600; gap: 10px; min-width: 0; }
.store-files__item a:hover { color: var(--store-orange); }
.store-files__item i { color: var(--store-green); }
.store-files__name { overflow-wrap: anywhere; }
.store-files__meta { color: var(--store-muted); font-size: 12.5px; white-space: nowrap; }

@media (max-width: 575px) {
    .store-specs { grid-template-columns: 1fr; }
    .store-files__item { align-items: flex-start; flex-direction: column; gap: 6px; }
}