/* ======================================================================
   MINDSUTRA WINDOWS PRODUCT PAGES — SHARED PREMIUM PRESENTATION LAYER
   Phase 4, 04 August 2026
   Scope: visual consistency, responsive display and maintainability only.
   Business logic, content, prices, links and product mappings are untouched.
   ====================================================================== */

body.mst-windows-product-page {
  --mst-product-accent: #6f3c12;
  --mst-product-accent-deep: #43230b;
  --mst-product-gold: #c99a45;
  --mst-product-gold-soft: #f4e4c2;
  --mst-product-ink: #2e271f;
  --mst-product-muted: #6d6256;
  --mst-product-surface: #fffdf9;
  --mst-product-surface-alt: #fff8ec;
  --mst-product-line: rgba(110, 72, 31, 0.19);
  --mst-product-shadow: 0 16px 38px rgba(57, 38, 18, 0.10);
  --mst-product-shadow-soft: 0 8px 22px rgba(57, 38, 18, 0.075);
  --mst-product-radius-lg: 24px;
  --mst-product-radius-md: 16px;
  --mst-product-radius-sm: 11px;
  background-color: #fffaf1;
  color: var(--mst-product-ink);
  overflow-x: hidden;
  overflow-x: clip;
}

body.mst-windows-product-page.mst-family-vedic {
  --mst-product-accent: #7b4110;
  --mst-product-accent-deep: #4a2508;
}
body.mst-windows-product-page.mst-family-lalkitab {
  --mst-product-accent: #7b2633;
  --mst-product-accent-deep: #4a101b;
}
body.mst-windows-product-page.mst-family-numerology {
  --mst-product-accent: #514180;
  --mst-product-accent-deep: #30234f;
}
body.mst-windows-product-page.mst-family-jaimini {
  --mst-product-accent: #17625d;
  --mst-product-accent-deep: #0c3c39;
}
body.mst-windows-product-page.mst-family-kp {
  --mst-product-accent: #28547b;
  --mst-product-accent-deep: #173450;
}
body.mst-windows-product-page.mst-family-matching {
  --mst-product-accent: #883c61;
  --mst-product-accent-deep: #54213a;
}
body.mst-windows-product-page.mst-family-remedies {
  --mst-product-accent: #38694f;
  --mst-product-accent-deep: #214632;
}
body.mst-windows-product-page.mst-family-financial {
  --mst-product-accent: #2f4866;
  --mst-product-accent-deep: #192d45;
}
body.mst-windows-product-page.mst-family-special {
  --mst-product-accent: #5d3d74;
  --mst-product-accent-deep: #382348;
}

/* Stable anchor positioning below the shared header. */
body.mst-windows-product-page main [id],
body.mst-windows-product-page .page-header[id],
body.mst-windows-product-page .hero-shell[id],
body.mst-windows-product-page .page-head-shell[id] {
  scroll-margin-top: 104px;
}

/* Premium but restrained top-level rhythm. */
body.mst-windows-product-page .page-header,
body.mst-windows-product-page .hero-shell,
body.mst-windows-product-page .page-head-shell {
  position: relative;
  isolation: isolate;
}

body.mst-windows-product-page .page-header::after,
body.mst-windows-product-page .hero-shell::after,
body.mst-windows-product-page .page-head-shell::after {
  content: "";
  position: absolute;
  inset: auto 7% 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(201, 154, 69, 0.55), transparent);
  pointer-events: none;
}

/* Consistent readable heading hierarchy without changing page content. */
body.mst-windows-product-page h1 {
  text-wrap: balance;
  letter-spacing: -0.025em;
}
body.mst-windows-product-page .section-head h2,
body.mst-windows-product-page .section-title,
body.mst-windows-product-page .card-title,
body.mst-windows-product-page .page-title {
  text-wrap: balance;
}
body.mst-windows-product-page main p,
body.mst-windows-product-page main li,
body.mst-windows-product-page .page-header p,
body.mst-windows-product-page .hero-shell p,
body.mst-windows-product-page .page-head-shell p {
  line-height: 1.68;
}

/* Shared card finish. It deliberately does not replace family colours. */
body.mst-windows-product-page :where(
  .card,
  .section-card,
  .section-shell,
  .group-card,
  .content-card,
  .feature,
  .feature-card,
  .faq,
  .faq-card,
  .sample-card,
  .module-card,
  .value-card,
  .trust-card,
  .metric-card,
  .highlight-card,
  .link-card,
  .shot-card,
  .video-card,
  .premium-card,
  .list-card
) {
  border-radius: var(--mst-product-radius-md);
}

body.mst-windows-product-page :where(
  .section-card,
  .section-shell,
  .group-card,
  .content-card,
  .sample-card,
  .module-card,
  .value-card,
  .trust-card,
  .metric-card,
  .highlight-card,
  .link-card,
  .video-card,
  .premium-card,
  .list-card
) {
  border-color: var(--mst-product-line);
  box-shadow: var(--mst-product-shadow-soft);
}

body.mst-windows-product-page .section-head {
  position: relative;
  gap: 14px;
}
body.mst-windows-product-page .section-head h2::after {
  content: "";
  display: block;
  width: clamp(54px, 8vw, 92px);
  height: 3px;
  margin-top: 10px;
  border-radius: 999px;
  background: linear-gradient(90deg, var(--mst-product-accent), var(--mst-product-gold));
}

/* Central CTA language: primary, secondary and quiet action. */
body.mst-windows-product-page :where(
  a.btn,
  button.btn,
  a.btn-primary,
  button.btn-primary,
  a.btn-secondary,
  button.btn-secondary,
  a.btn-outline,
  button.btn-outline,
  a.btn-ghost,
  button.btn-ghost,
  a.primary,
  button.primary,
  a.btn-solid,
  button.btn-solid,
  a.btn-dark,
  button.btn-dark,
  a.download-btn,
  button.download-btn,
  a.btn-download,
  button.btn-download
) {
  min-height: 46px;
  padding: 11px 18px;
  border-radius: var(--mst-product-radius-sm);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  font-weight: 800;
  line-height: 1.24;
  text-align: center;
  text-decoration: none;
  white-space: normal;
  transition: transform 160ms ease, box-shadow 160ms ease, border-color 160ms ease, background-color 160ms ease;
}

body.mst-windows-product-page :where(
  a.btn-primary,
  button.btn-primary,
  a.primary,
  button.primary,
  a.btn-solid,
  button.btn-solid,
  a.btn-dark,
  button.btn-dark
) {
  color: #fff;
  border-color: transparent;
  background: linear-gradient(135deg, var(--mst-product-accent-deep), var(--mst-product-accent));
  box-shadow: 0 9px 20px rgba(55, 35, 17, 0.18);
}

body.mst-windows-product-page :where(
  a.btn-outline,
  button.btn-outline,
  a.btn-secondary,
  button.btn-secondary,
  a.btn-ghost,
  button.btn-ghost,
  a.download-btn,
  button.download-btn,
  a.btn-download,
  button.btn-download
) {
  color: var(--mst-product-accent-deep);
  border-color: rgba(111, 60, 18, 0.38);
  background: rgba(255, 253, 248, 0.94);
}

@media (hover: hover) and (pointer: fine) {
  body.mst-windows-product-page :where(
    a.btn,
    button.btn,
    a.btn-primary,
    button.btn-primary,
    a.btn-secondary,
    button.btn-secondary,
    a.btn-outline,
    button.btn-outline,
    a.primary,
    button.primary,
    a.btn-solid,
    button.btn-solid,
    a.btn-dark,
    button.btn-dark,
    a.download-btn,
    button.download-btn,
    a.btn-download,
    button.btn-download
  ):hover {
    transform: translateY(-2px);
    box-shadow: 0 12px 25px rgba(48, 31, 15, 0.15);
  }
}

/* Keyboard-visible focus is shared and predictable. */
body.mst-windows-product-page :where(a, button, input, select, textarea, [tabindex]):focus-visible {
  outline: 3px solid #d9ae62;
  outline-offset: 3px;
}

/* CTA rows wrap gracefully instead of producing broken multi-line buttons. */
body.mst-windows-product-page :where(.cta-row, .btn-row, .hero-actions, .cta-actions, .sample-actions) {
  gap: 10px;
  align-items: stretch;
}
body.mst-windows-product-page :where(.cta-row, .btn-row, .hero-actions, .cta-actions, .sample-actions) > :where(a, button) {
  flex: 1 1 150px;
}

/* In-page discovery links stay compact on small screens. */
body.mst-windows-product-page :where(.quick-links, .page-short-links) {
  scrollbar-width: thin;
  scrollbar-color: rgba(111, 60, 18, 0.42) transparent;
}
body.mst-windows-product-page :where(.quick-links, .page-short-links) a {
  min-height: 40px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
}
body.mst-windows-product-page :where(.quick-links, .page-short-links) a.is-current-section {
  color: #fff;
  border-color: var(--mst-product-accent);
  background: var(--mst-product-accent);
}

/* Tabs, contents and slider controls receive usable touch areas. */
body.mst-windows-product-page :where(
  .toc-tab,
  .ms-contents-tab,
  .sample-tab,
  .tab-btn,
  .content-tab,
  .video-tab,
  .faq-q,
  .acc-trigger,
  .kp-toggle-btn,
  .read-toggle
) {
  min-height: 44px;
  border-radius: 10px;
}
body.mst-windows-product-page :where(
  .icon-btn,
  .slider-btn,
  .slider-prev,
  .slider-next,
  .video-slider-btn,
  .js-shots-prev,
  .js-shots-next,
  button.prev,
  button.next
) {
  min-width: 44px;
  min-height: 44px;
}

/* Media remains stable and visually finished. */
body.mst-windows-product-page :where(.product-visual, .hero-media, .hero-image, .media-box, .shot-card) img {
  max-width: 100%;
  height: auto;
}
body.mst-windows-product-page iframe[src*="youtube"],
body.mst-windows-product-page iframe[src*="youtu.be"] {
  width: 100%;
  max-width: 100%;
  aspect-ratio: 16 / 9;
  height: auto;
  border-radius: 14px;
  background: #111;
}

/* Tables keep their existing page-specific responsive treatment. */
body.mst-windows-product-page main table {
  max-width: 100%;
}

/* Lightweight active-section indicator is enhancement-only. */
body.mst-windows-product-page :where(.quick-links, .page-short-links) a {
  transition: color 160ms ease, background-color 160ms ease, border-color 160ms ease;
}

@media (max-width: 991.98px) {
  body.mst-windows-product-page .page-header .hero-wrap,
  body.mst-windows-product-page .hero-shell .hero-grid,
  body.mst-windows-product-page .page-head-shell .page-head-grid {
    gap: 22px;
  }

  body.mst-windows-product-page :where(.quick-links, .page-short-links) {
    display: flex;
    flex-wrap: nowrap;
    gap: 8px;
    overflow-x: auto;
    padding: 3px 2px 9px;
    scroll-snap-type: x proximity;
  }
  body.mst-windows-product-page :where(.quick-links, .page-short-links) a {
    flex: 0 0 auto;
    scroll-snap-align: start;
    white-space: nowrap;
  }

  body.mst-windows-product-page :where(
    .toc-tabs,
    .ms-contents-tabs,
    .sample-tabs,
    .content-tabs,
    .video-tabs,
    .tab-list
  ) {
    max-width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
  }
}

@media (max-width: 767.98px) {
  body.mst-windows-product-page {
    --mst-product-radius-lg: 19px;
    --mst-product-radius-md: 14px;
  }

  body.mst-windows-product-page .page-header,
  body.mst-windows-product-page .hero-shell,
  body.mst-windows-product-page .page-head-shell {
    padding-top: clamp(24px, 7vw, 34px);
    padding-bottom: clamp(26px, 8vw, 38px);
  }

  body.mst-windows-product-page .page-header .hero-wrap,
  body.mst-windows-product-page .hero-shell .hero-grid,
  body.mst-windows-product-page .page-head-shell .page-head-grid {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  body.mst-windows-product-page h1,
  body.mst-windows-product-page .hero-title,
  body.mst-windows-product-page .page-title {
    font-size: clamp(1.82rem, 8vw, 2.45rem);
    line-height: 1.12;
  }

  body.mst-windows-product-page .section-head h2,
  body.mst-windows-product-page .section-title {
    font-size: clamp(1.38rem, 6vw, 1.82rem);
    line-height: 1.2;
  }

  body.mst-windows-product-page main > section,
  body.mst-windows-product-page main > .section {
    scroll-margin-top: 86px;
  }

  body.mst-windows-product-page :where(.card, .section-card, .section-shell, .group-card) {
    border-radius: var(--mst-product-radius-md);
  }

  body.mst-windows-product-page :where(.section-card, .section-shell, .group-card) {
    padding-left: clamp(14px, 4.5vw, 20px);
    padding-right: clamp(14px, 4.5vw, 20px);
  }

  body.mst-windows-product-page :where(.cta-row, .btn-row, .hero-actions, .cta-actions, .sample-actions) {
    display: flex;
    flex-wrap: wrap;
  }
  body.mst-windows-product-page :where(.cta-row, .btn-row, .hero-actions, .cta-actions, .sample-actions) > :where(a, button) {
    min-width: min(100%, 142px);
  }

  body.mst-windows-product-page :where(.product-visual, .hero-media, .hero-image) img {
    max-height: 390px;
    object-fit: contain;
  }

  body.mst-windows-product-page main p,
  body.mst-windows-product-page main li {
    font-size: max(15px, 0.96rem);
  }

}

@media (max-width: 479.98px) {
  body.mst-windows-product-page :where(
    a.btn,
    button.btn,
    a.btn-primary,
    button.btn-primary,
    a.btn-secondary,
    button.btn-secondary,
    a.btn-outline,
    button.btn-outline,
    a.primary,
    button.primary,
    a.btn-solid,
    button.btn-solid,
    a.btn-dark,
    button.btn-dark,
    a.download-btn,
    button.download-btn,
    a.btn-download,
    button.btn-download
  ) {
    padding-inline: 13px;
    font-size: 0.92rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  body.mst-windows-product-page *,
  body.mst-windows-product-page *::before,
  body.mst-windows-product-page *::after {
    scroll-behavior: auto !important;
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}

/* ===== PHASE 08: AA CONTRAST SAFETY ===== */
/* Keep old/struck prices visibly secondary while meeting normal-text AA contrast on light product surfaces. */
body.mst-windows-product-page .strike{color:#6b7280}

/* =========================================================
   MINDSUTRA PREMIUM CTA OPTION B — FINAL SITEWIDE
   Product content action rows only.
========================================================= */
body.mst-windows-product-page :where(.hero-actions,.cta-row,.cta-actions) > :where(
 a.btn-primary,button.btn-primary,a.primary,button.primary,a.btn-solid,button.btn-solid,a.btn-dark,button.btn-dark
){
  border-radius:18px!important;
  border-color:#9f470c!important;
  background:linear-gradient(90deg,#9f470c 0%,#ac520e 52%,#b55a0d 100%)!important;
  color:#fff!important;
  box-shadow:0 9px 20px rgba(145,72,14,.18),inset 0 1px 0 rgba(255,235,205,.20)!important;
  text-decoration:none!important;
  transition:transform .18s ease,box-shadow .18s ease,filter .18s ease,background .18s ease,border-color .18s ease,color .18s ease;
}
body.mst-windows-product-page :where(.hero-actions,.cta-row,.cta-actions) > :where(
 a.btn-primary,button.btn-primary,a.primary,button.primary,a.btn-solid,button.btn-solid,a.btn-dark,button.btn-dark
):is(:hover,:focus-visible){
  transform:translateY(-1px);
  border-color:#7f3508!important;
  background:linear-gradient(90deg,#813707 0%,#93400a 52%,#a64b0f 100%)!important;
  color:#fff!important;
  box-shadow:0 13px 24px rgba(126,57,8,.23),inset 0 1px 0 rgba(255,235,205,.24)!important;
  filter:none!important;
  outline:3px solid rgba(159,71,12,.20)!important;
  outline-offset:2px;
}
body.mst-windows-product-page :where(.hero-actions,.cta-row,.cta-actions) > :where(
 a.btn-outline,button.btn-outline,a.btn-secondary,button.btn-secondary
){
  border-radius:18px!important;
  border-color:#c1681e!important;
  background:linear-gradient(180deg,#fffefa 0%,#fff8ed 100%)!important;
  color:#743410!important;
  box-shadow:0 7px 17px rgba(151,83,24,.10),inset 0 1px 0 rgba(255,255,255,.92)!important;
  text-decoration:none!important;
  transition:transform .18s ease,box-shadow .18s ease,background .18s ease,border-color .18s ease,color .18s ease;
}
body.mst-windows-product-page :where(.hero-actions,.cta-row,.cta-actions) > :where(
 a.btn-outline,button.btn-outline,a.btn-secondary,button.btn-secondary
):is(:hover,:focus-visible){
  transform:translateY(-1px);
  border-color:#9f470c!important;
  background:linear-gradient(180deg,#fff8ec 0%,#f8e4c7 100%)!important;
  color:#622b0d!important;
  box-shadow:0 11px 21px rgba(151,83,24,.15)!important;
  filter:none!important;
  outline:3px solid rgba(159,71,12,.16)!important;
  outline-offset:2px;
}
