/* کاتالوگ دیجیتال تعاملی — تمیز، خوانا، موبایل‌اول */

.catalog-interactive {
  --page-ratio: 3 / 4;
  --page-max-w: min(400px, 94vw);
  --ix-ink: #2a211c;
  --ix-muted: #6b5b50;
  --ix-paper: #f4ebe0;
  --ix-card: #fffdf9;
}

.catalog-interactive .ambient-stage {
  background:
    radial-gradient(ellipse 70% 45% at 50% -10%, rgba(180, 16, 17, 0.22), transparent 55%),
    #161210;
}

.catalog-interactive .stage {
  padding: 108px 12px 104px;
  position: relative;
  z-index: 2;
}

.catalog-interactive .top,
.catalog-interactive .dock {
  z-index: 30;
}

/* هدر تعاملی فقط منو + عنوان + لینک کاتالوگ معمولی */
.catalog-interactive .top--pro {
  grid-template-columns: auto minmax(0, 1fr);
}

.catalog-interactive .top--pro .top-interactive {
  grid-column: 1 / -1;
  grid-row: 2;
}

@media (min-width: 721px) {
  .catalog-interactive .top--pro {
    grid-template-columns: auto minmax(0, 1fr) auto;
  }

  .catalog-interactive .top--pro .top-interactive {
    grid-column: 3;
    grid-row: 1;
    width: auto;
    max-width: 12rem;
  }
}

.catalog-interactive .viewer {
  max-height: calc(100dvh - 210px);
}

.catalog-interactive .page-nav {
  opacity: 0.92;
}

.catalog-interactive .catalog-page {
  border-radius: 18px;
  background: var(--ix-paper);
  box-shadow: 0 18px 40px rgba(0, 0, 0, 0.35);
}

/* Cover */
.ix-cover {
  background:
    radial-gradient(circle at 70% 12%, rgba(215, 168, 110, 0.22), transparent 42%),
    linear-gradient(168deg, #c41819 0%, #b41011 42%, #8e0c0d 100%);
  color: #fffaf3;
}

.ix-cover .kicker-en {
  color: rgba(215, 168, 110, 0.95);
  letter-spacing: 0.18em;
}

.ix-cover .display,
.ix-cover .subtitle {
  color: #fffaf3;
}

.ix-cover .cover-logo-wrap {
  background: rgba(255, 253, 248, 0.94);
  border-radius: 16px;
  padding: 0.85rem 1.1rem;
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.18);
}

.ix-cover .cover-logo {
  filter: none;
  width: min(200px, 58vw);
  height: auto;
}

.ix-cover .cta-pill {
  background: rgba(255, 253, 248, 0.16);
  border: 1px solid rgba(215, 168, 110, 0.55);
  color: #fffaf3;
}

.ix-tan,
.ix-cream {
  background: var(--ix-paper);
  color: var(--ix-ink);
}

.ix-brand {
  background: linear-gradient(165deg, #8e0c0d, #b41011 55%, #6d090a);
  color: #fff8ef;
}

.ix-brand .kicker,
.ix-brand .display,
.ix-brand .kicker-en {
  color: #f6e2c0;
}

.ix-brand .contact-chip {
  background: rgba(255, 253, 248, 0.12);
  border-color: rgba(215, 168, 110, 0.35);
  color: #fff8ef;
}

/* صفحه ارتباط — کرم خوانا، نه قرمز روی قرمز */
.ix-contact {
  background:
    linear-gradient(180deg, rgba(180, 16, 17, 0.06), transparent 28%),
    var(--ix-paper);
  color: var(--ix-ink);
  justify-content: flex-start;
  padding-bottom: 1.1rem;
}

.ix-contact .display-sm {
  color: var(--ix-ink);
}

.ix-contact .contact-channels {
  width: 100%;
  max-width: none;
}

.ix-contact .contact-chip {
  background: var(--ix-card);
  border: 1px solid rgba(180, 16, 17, 0.14);
  color: var(--ix-ink);
  box-shadow: 0 4px 14px rgba(60, 30, 10, 0.06);
}

.ix-contact .contact-chip-meta {
  align-items: flex-start;
  width: 100%;
}

.ix-contact .contact-chip-meta b {
  color: #8e0c0d;
  font-size: 0.72rem;
}

.ix-contact .contact-chip-meta span {
  color: var(--ix-ink);
  font-size: 0.92rem;
}

.ix-contact .contact-actions {
  width: 100%;
  max-width: none;
}

.ix-contact .cta-solid {
  background: #b41011;
  color: #fffaf3;
  border-color: transparent;
}

.ix-contact .cta-outline {
  color: #8e0c0d;
  border-color: rgba(180, 16, 17, 0.35);
  background: transparent;
}

.display-sm {
  font-size: clamp(1.05rem, 3.8vw, 1.3rem);
  line-height: 1.5;
  color: var(--ix-ink);
}

.page-scroll {
  overflow: auto;
  justify-content: flex-start;
  align-items: stretch;
  text-align: start;
  padding: 1.25rem 1.1rem 1.4rem;
  gap: 0.65rem;
}

.page-scroll .page-header {
  align-items: flex-start;
}

.page-scroll .body {
  margin: 0;
  font-size: 0.86rem;
  line-height: 1.7;
  color: var(--ix-muted);
}

.ix-list {
  margin: 0.35rem 0 0;
  padding: 0 1rem 0 0;
  display: grid;
  gap: 0.5rem;
  color: var(--ix-ink);
  font-size: 0.86rem;
  line-height: 1.55;
}

.ix-cards {
  display: grid;
  gap: 0.5rem;
  margin-top: 0.35rem;
}

.ix-card {
  display: grid;
  gap: 0.2rem;
  text-align: start;
  padding: 0.8rem 0.9rem;
  border-radius: 14px;
  border: 1px solid rgba(180, 16, 17, 0.12);
  background: var(--ix-card);
  color: inherit;
  font: inherit;
  box-shadow: 0 4px 14px rgba(60, 30, 10, 0.05);
}

.ix-card:active {
  transform: scale(0.99);
}

.ix-card strong {
  font-size: 0.86rem;
  color: #8e0c0d;
}

.ix-card span {
  font-size: 0.74rem;
  line-height: 1.5;
  color: var(--ix-muted);
}

.ix-program-grid {
  display: grid;
  gap: 0.5rem;
  margin-top: 0.35rem;
}

.ix-program {
  padding: 0.75rem 0.85rem;
  border-radius: 12px;
  background: var(--ix-card);
  border: 1px solid rgba(215, 168, 110, 0.4);
}

.ix-program h3 {
  margin: 0 0 0.25rem;
  font-size: 0.82rem;
  color: #8e0c0d;
}

.ix-program p {
  margin: 0;
  font-size: 0.74rem;
  line-height: 1.5;
  color: var(--ix-muted);
}

.catalog-interactive .contact-channels {
  display: grid;
  gap: 0.45rem;
  width: min(100%, 280px);
  margin-top: 0.75rem;
}

.catalog-interactive .contact-actions {
  display: grid;
  gap: 0.45rem;
  width: min(100%, 280px);
  margin-top: 0.85rem;
}

.catalog-interactive .contact-chip {
  justify-content: center;
}

.catalog-interactive .kicker {
  color: #8e0c0d;
}

.catalog-interactive .kicker-en {
  color: rgba(140, 90, 40, 0.7);
}

@media (max-width: 560px) {
  .catalog-interactive .stage {
    padding: 102px 6px 88px;
  }

  .catalog-interactive .viewer {
    max-height: calc(100dvh - 188px);
    width: min(var(--page-max-w), 100vw);
  }

  .catalog-interactive .catalog-page {
    border-radius: 14px;
  }

  /* موبایل: فلش‌ها بیرون از محتوا — فقط سوایپ + داک */
  .catalog-interactive .page-nav {
    display: none;
  }

  .catalog-interactive .page-scroll {
    padding: 1rem 0.9rem 1.15rem;
  }

  .ix-contact .contact-actions {
    padding-bottom: 0.25rem;
  }
}
