/* =====================================================================
   MEGAGEN — Product-landing redesign (rd-landing.css). Loads after the
   foundation. Elevates the product landing/detail surfaces:
     · Editorial landing sections  (.mg-arw-*)
     · Product detail blocks       (.mg-pdp__*)
     · Related products            (.mg-related*)
     · FAQ accordion               (.mg-faq*)
   Token-driven, RTL logical properties, Persian-safe (no glyph tracking),
   dark-mode parity, calm motion. Never touches load-bearing rules.
   ===================================================================== */

/* ---------- Editorial landing (.mg-arw-*) — SAFE additive polish only.
   Text colors are intentionally left to enhance.css, which already handles
   light sections vs. the `--light` variants on dark backgrounds. Overriding
   them here previously forced white headings/badges to dark (dark-on-dark). */
.mg-arw-h2 { text-wrap: balance; }
.mg-arw-lead { max-inline-size: 70ch; }

/* Stats read as data (tabular figures) — no color change */
.mg-arw-stat, .mg-stat__num, .mg-arw-stats { font-variant-numeric: tabular-nums; font-feature-settings: "tnum"; }

/* Figures — soft elevation + clean corners */
.mg-arw-fig, .mg-arw-fig--wide {
  border-radius: var(--mg-r-lg, 22px);
  box-shadow: var(--mg-shadow, 0 10px 34px -14px rgba(11,19,32,.16));
  overflow: hidden;
}
.mg-arw-fig img, .mg-arw-fig--wide img { display: block; inline-size: 100%; height: auto; }

/* List markers in accent (light sections) */
.mg-arw-list li::marker { color: var(--mg-accent, #0067b1); }

/* ---------- Product detail blocks (.mg-pdp__*) ---------- */
.mg-pdp__block { margin-block: clamp(2.5rem, 6vw, 4.5rem); }

/* Spec table — same disciplined data language as the order tables */
.mg-pdp__spectable {
  inline-size: 100%; border-collapse: separate; border-spacing: 0;
  border: 1px solid var(--mg-border, #e5eaf1); border-radius: var(--mg-r, 14px); overflow: hidden;
  font-variant-numeric: tabular-nums;
}
.mg-pdp__specrow { display: grid; grid-template-columns: minmax(120px, 1fr) 2fr; }
.mg-pdp__specrow > :first-child { background: var(--mg-surface-2, #eef3f9); color: var(--mg-heading, #0a1626); font-weight: 600; }
.mg-pdp__specrow > * { padding: 12px 16px; border-block-end: 1px solid var(--mg-border, #e5eaf1); }
.mg-pdp__specrow:last-child > * { border-block-end: 0; }

/* Feature cards */
.mg-pdp__fgrid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: clamp(14px, 2vw, 20px); }
.mg-pdp__fcard {
  background: var(--mg-bg, #fff);
  border: 1px solid var(--mg-border, #e5eaf1);
  border-radius: var(--mg-r-lg, 22px);
  padding: clamp(18px, 2.4vw, 26px);
  box-shadow: var(--mg-shadow-xs, 0 1px 2px rgba(11,19,32,.06));
  transition: transform var(--mg-dur,.24s) var(--mg-ease), box-shadow var(--mg-dur,.24s) var(--mg-ease), border-color var(--mg-dur,.24s) ease;
}
.mg-pdp__fcard:hover { transform: translateY(-4px); box-shadow: var(--mg-shadow, 0 10px 34px -14px rgba(11,19,32,.16)); border-color: var(--mg-border-strong, #d4dce7); }
.mg-pdp__fcard h3, .mg-pdp__fcard h4 { color: var(--mg-heading, #0a1626); }

/* Product CTA button */
.mg-pdp__btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  min-block-size: 46px; padding: 12px 26px;
  border-radius: var(--mg-r-pill, 999px); font-weight: 700; text-decoration: none;
  background: var(--mg-accent, #0067b1); color: #fff; border: 1px solid transparent;
  box-shadow: 0 10px 26px -12px rgba(0,103,177,.7);
  transition: transform var(--mg-dur,.24s) var(--mg-ease), background-color var(--mg-dur,.24s) ease, box-shadow var(--mg-dur,.24s) var(--mg-ease);
}
.mg-pdp__btn:hover { background: var(--mg-accent-deep, #024e86); transform: translateY(-2px); }
.mg-pdp-body .mg-pdp__btn.primary {
  background: var(--mg-pa, var(--mg-accent, #0067b1));
  color: #fff;
}
.mg-pdp-body .mg-pdp__btn.ghost {
  background: transparent;
  color: var(--mg-pa, var(--mg-accent, #0067b1));
  border-color: currentColor;
  box-shadow: none;
}
.mg-pdp-body .mg-pdp__btn.ghost:hover {
  background: color-mix(in srgb, var(--mg-pa, var(--mg-accent, #0067b1)) 8%, transparent);
  color: var(--mg-pa, var(--mg-accent, #0067b1));
}

/* ---------- Related products ---------- */
.mg-related__card {
  border: 1px solid var(--mg-border, #e5eaf1); border-radius: var(--mg-r-lg, 22px);
  background: var(--mg-bg, #fff); overflow: hidden;
  box-shadow: var(--mg-shadow-xs, 0 1px 2px rgba(11,19,32,.06));
  transition: transform var(--mg-dur,.24s) var(--mg-ease), box-shadow var(--mg-dur,.24s) var(--mg-ease), border-color var(--mg-dur,.24s) ease;
}
.mg-related__card:hover { transform: translateY(-4px); box-shadow: var(--mg-shadow, 0 10px 34px -14px rgba(11,19,32,.16)); border-color: var(--mg-border-strong, #d4dce7); }
.mg-related__go { color: var(--mg-accent, #0067b1); font-weight: 700; }

/* ---------- FAQ ---------- */
.mg-faq__q {
  color: var(--mg-heading, #0a1626); font-weight: 700;
  padding-block: 16px; border-block-end: 1px solid var(--mg-border, #e5eaf1);
  cursor: pointer; transition: color var(--mg-dur,.24s) ease;
}
.mg-faq__q:hover { color: var(--mg-accent, #0067b1); }

/* ---------- Dark-mode parity ---------- */
[data-theme="dark"] .mg-arw-sec--soft { background: var(--mg-surface, #131d2c); }
[data-theme="dark"] .mg-pdp__specrow > :first-child { background: rgba(255,255,255,.05); }
[data-theme="dark"] .mg-pdp__fcard, [data-theme="dark"] .mg-related__card { background: var(--mg-surface, #131d2c); border-color: rgba(255,255,255,.09); }
[data-theme="dark"] .mg-arw-badge { background: rgba(0,103,177,.16); color: #bfe0fb; border-color: rgba(255,255,255,.12); }

/* ---------- Interactive product hotspots ---------- */
.mg-arw-hotspots { position: relative; max-inline-size: 980px; margin: clamp(24px, 4vw, 46px) auto 0; overflow: visible; border: 1px solid var(--mg-border, #e5eaf1); background: var(--mg-surface, #f5f8fc); }
.mg-arw-hotspots__image { display: block; inline-size: 100%; block-size: auto; }
.mg-arw-hotspot { position: absolute; left: calc(var(--mg-hotspot-x) * 1%); top: calc(var(--mg-hotspot-y) * 1%); z-index: 2; }
.mg-arw-hotspot__button { display: grid; place-items: center; inline-size: 42px; block-size: 42px; padding: 0; border: 0; border-radius: 50%; background: var(--mg-pa, var(--mg-accent, #0067b1)); color: #fff; font: 500 30px/1 Arial, sans-serif; cursor: pointer; transform: translate(-50%, -50%); box-shadow: 0 0 0 7px rgba(255,255,255,.55), 0 7px 18px -9px rgba(0,45,83,.8); transition: transform .2s ease, background-color .2s ease; }
.mg-arw-hotspot__button:hover, .mg-arw-hotspot__button:focus-visible, .mg-arw-hotspot.is-active .mg-arw-hotspot__button { transform: translate(-50%, -50%) scale(1.1); background: var(--mg-accent-deep, #024e86); outline: 0; }
.mg-arw-hotspot__tip { position: absolute; z-index: 3; inset-block-end: calc(100% + 16px); left: 50%; inline-size: min(270px, 72vw); padding: 14px 16px; border: 1px solid var(--mg-border, #e5eaf1); background: color-mix(in srgb, var(--mg-bg, #fff) 94%, transparent); color: var(--mg-text, #0b1320); text-align: right; opacity: 0; pointer-events: none; transform: translate(-50%, 8px); transition: opacity .18s ease, transform .18s ease; backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); }
.mg-arw-hotspot.is-tip-below .mg-arw-hotspot__tip { inset-block-start: calc(100% + 16px); inset-block-end: auto; transform: translate(-50%, -8px); }
.mg-arw-hotspot__tip b, .mg-arw-hotspot__tip span { display: block; }
.mg-arw-hotspot__tip b { margin-block-end: 5px; color: var(--mg-heading, #0a1626); font-size: 15px; }
.mg-arw-hotspot__tip span { color: var(--mg-muted, #5a6b7e); font-size: 14px; line-height: 1.8; }
@media (hover:hover) { .mg-arw-hotspot:hover .mg-arw-hotspot__tip { opacity: 1; transform: translate(-50%, 0); } }
.mg-arw-hotspot:focus-within .mg-arw-hotspot__tip, .mg-arw-hotspot.is-active .mg-arw-hotspot__tip { opacity: 1; transform: translate(-50%, 0); }
.mg-arw-hotspot.is-tip-below:focus-within .mg-arw-hotspot__tip, .mg-arw-hotspot.is-tip-below.is-active .mg-arw-hotspot__tip { transform: translate(-50%, 0); }

/* ---------- Scientific evidence ---------- */
.mg-arw-evidence { border-block: 1px solid var(--mg-border, #e5eaf1); background: var(--mg-surface-2, #f3f7fb); }
.mg-arw-evidence__head { display: grid; grid-template-columns: minmax(220px, .72fr) minmax(300px, 1.28fr); gap: 12px clamp(28px, 6vw, 80px); align-items: end; margin-block-end: clamp(26px, 4vw, 44px); }
.mg-arw-evidence__kicker { grid-column: 1 / -1; color: var(--mg-accent, #0067b1); font-size: 14px; font-weight: 800; }
.mg-arw-evidence__head .mg-arw-h2, .mg-arw-evidence__head .mg-arw-lead { margin: 0; }
.mg-arw-evidence__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1px; overflow: hidden; border: 1px solid var(--mg-border, #e5eaf1); background: var(--mg-border, #e5eaf1); }
.mg-evidence-card { display: flex; flex-direction: column; min-block-size: 330px; padding: clamp(22px, 3vw, 34px); background: var(--mg-bg, #fff); }
.mg-evidence-card__meta { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px; margin-block-end: 18px; color: var(--mg-muted, #5a6b7e); font-size: 14px; font-weight: 700; }
.mg-evidence-card__meta span { padding: 5px 9px; border: 1px solid color-mix(in srgb, var(--mg-accent, #0067b1) 24%, var(--mg-border, #e5eaf1)); color: var(--mg-accent-deep, #024e86); background: color-mix(in srgb, var(--mg-accent, #0067b1) 6%, var(--mg-bg, #fff)); }
.mg-evidence-card h3 { margin: 0 0 14px; color: var(--mg-heading, #0a1626); font-size: clamp(19px, 2vw, 24px); line-height: 1.55; }
.mg-evidence-card p { margin: 0; line-height: 1.95; }
.mg-evidence-card__finding { color: var(--mg-text, #0b1320); }
.mg-evidence-card__limit { margin-block-start: 16px !important; padding-block-start: 14px; border-block-start: 1px solid var(--mg-border, #e5eaf1); color: var(--mg-muted, #5a6b7e); font-size: 14px; }
.mg-evidence-card__limit strong { color: var(--mg-heading, #0a1626); }
.mg-evidence-card footer { display: flex; flex-wrap: wrap; align-items: end; justify-content: space-between; gap: 14px; margin-block-start: auto; padding-block-start: 24px; }
.mg-evidence-card cite { max-inline-size: 68%; color: var(--mg-muted, #5a6b7e); font-size: 14px; font-style: normal; direction: ltr; text-align: left; }
.mg-evidence-card a { display: inline-flex; min-height: 44px; align-items: center; color: var(--mg-accent, #0067b1); font-size: 14px; font-weight: 800; text-decoration: none; }
.mg-evidence-card a:hover { text-decoration: underline; text-underline-offset: 4px; }
.mg-evidence-card a:focus-visible { outline: 3px solid color-mix(in srgb, var(--mg-accent, #0067b1) 36%, transparent); outline-offset: 4px; }
.mg-arw-evidence__notice { margin-block-start: 18px; padding: 14px 18px; border-inline-start: 3px solid var(--mg-accent, #0067b1); background: var(--mg-bg, #fff); color: var(--mg-muted, #5a6b7e); font-size: 14px; line-height: 1.9; }
.mg-arw-evidence__notice strong { color: var(--mg-heading, #0a1626); }

/* ---------- Dark-mode parity for every product landing ---------- */
html[data-theme="dark"] .mg-pdp-body .mg-arw,
html[data-theme="dark"] .mg-pdp-body .mg-arw-sec { background: var(--mg-bg); color: var(--mg-text); }
html[data-theme="dark"] .mg-pdp-body .mg-arw-sec--soft,
html[data-theme="dark"] .mg-pdp-body .mg-arw-closing,
html[data-theme="dark"] .mg-pdp-body .mg-pdp__bottom { background: var(--mg-surface); }
html[data-theme="dark"] .mg-pdp-body .mg-arw-h2:not(.mg-arw-h2--light),
html[data-theme="dark"] .mg-pdp-body .mg-arw-hotspot__tip b { color: var(--mg-heading); }
html[data-theme="dark"] .mg-pdp-body .mg-arw-lead:not(.mg-arw-lead--light),
html[data-theme="dark"] .mg-pdp-body .mg-arw-closing__text p,
html[data-theme="dark"] .mg-pdp-body .mg-arw-hotspot__tip span { color: var(--mg-muted); }
html[data-theme="dark"] .mg-pdp-body .mg-pdp__btn.ghost { color: #fff; border-color: rgba(255,255,255,.46); background: rgba(255,255,255,.06); }
html[data-theme="dark"] .mg-pdp-body .mg-pdp__btn.ghost:hover { background: rgba(255,255,255,.14); }
html[data-theme="dark"] .mg-arw-hotspots { border-color: rgba(255,255,255,.12); background: var(--mg-surface); }
html[data-theme="dark"] .mg-arw-hotspot__button { box-shadow: 0 0 0 7px rgba(19,29,44,.7), 0 7px 18px -9px rgba(0,0,0,.8); }
html[data-theme="dark"] .mg-arw-hotspot__tip { border-color: rgba(255,255,255,.14); background: rgba(19,29,44,.9); }
html[data-theme="dark"] .mg-arw-evidence { background: var(--mg-surface); border-color: rgba(255,255,255,.12); }
html[data-theme="dark"] .mg-arw-evidence__grid { border-color: rgba(255,255,255,.12); background: rgba(255,255,255,.12); }
html[data-theme="dark"] .mg-evidence-card, html[data-theme="dark"] .mg-arw-evidence__notice { background: var(--mg-bg); }
html[data-theme="dark"] .mg-evidence-card__meta span { color: #bfe0fb; background: rgba(0,103,177,.16); border-color: rgba(255,255,255,.12); }

/* Shared surfaces that previously retained a white paint in dark mode. */
html[data-theme="dark"] .mg-pdf-library,
html[data-theme="dark"] .mg-pdf-library__hero,
html[data-theme="dark"] .mg-v2-library,
html[data-theme="dark"] .mg-blog-body,
html[data-theme="dark"] .mg-contact-page { background: var(--mg-bg); color: var(--mg-text); }
html[data-theme="dark"] .mg-pdf-library__search,
html[data-theme="dark"] .mg-pdf-library__filters select,
html[data-theme="dark"] .mg-pdf-library__rail-item,
html[data-theme="dark"] .mg-pdf-library__pagination .page-numbers a,
html[data-theme="dark"] .mg-pdf-library__pagination .page-numbers .current,
html[data-theme="dark"] .mg-blog-card,
html[data-theme="dark"] .mg-contact-info,
html[data-theme="dark"] .mg-contact-formwrap,
html[data-theme="dark"] .mg-auth__card,
html[data-theme="dark"] .mg-dcard,
html[data-theme="dark"] .mg-search-item,
html[data-theme="dark"] .mg-faq__item { background: var(--mg-surface); color: var(--mg-text); border-color: rgba(255,255,255,.12); }
html[data-theme="dark"] .mg-pdf-library__rail-item,
html[data-theme="dark"] .mg-pdf-library__pagination .page-numbers a,
html[data-theme="dark"] .mg-pdf-library__pagination .page-numbers .current { color: var(--mg-text); }
html[data-theme="dark"] .mg-pdf-library input,
html[data-theme="dark"] .mg-pdf-library select,
html[data-theme="dark"] .mg-contact-form input,
html[data-theme="dark"] .mg-contact-form select,
html[data-theme="dark"] .mg-contact-form textarea { background: var(--mg-surface-2); color: var(--mg-text); border-color: rgba(255,255,255,.16); }

@media (max-width: 640px) {
	.mg-arw-evidence__head { grid-template-columns: 1fr; }
	.mg-arw-evidence__grid { grid-template-columns: 1fr; }
	.mg-evidence-card { min-block-size: 0; }
	.mg-evidence-card cite { max-inline-size: 100%; }
  .mg-arw-hotspot__button { inline-size: 46px; block-size: 46px; font-size: 25px; }
  .mg-arw-hotspot__tip { inset-block-end: calc(100% + 12px); inline-size: min(238px, 74vw); padding: 11px 12px; }
}

/* ---------- Motion discipline ---------- */
@media (prefers-reduced-motion: reduce) {
  .mg-pdp__fcard, .mg-related__card, .mg-pdp__btn { transition: none !important; }
  .mg-pdp__fcard:hover, .mg-related__card:hover, .mg-pdp__btn:hover { transform: none !important; }
}