/* MyHDVideo Phase 4.1: contrast, spacing and compact homepage downloader links. */

header,
.site-header,
[class*="site-header"],
.navbar,
.site-nav {
  color: #111827;
}

header nav a:not(.btn):not(.button):not([class*="button"]):not([class*="cta"]),
.site-header nav a:not(.btn):not(.button):not([class*="button"]):not([class*="cta"]),
.navbar a:not(.btn):not(.button):not([class*="button"]):not([class*="cta"]),
.site-nav a:not(.btn):not(.button):not([class*="button"]):not([class*="cta"]) {
  color: #172033 !important;
  opacity: 1 !important;
  text-decoration-color: currentColor;
}

header nav a:hover,
.site-header nav a:hover,
.navbar a:hover,
.site-nav a:hover {
  color: #2457eb !important;
}

header nav button,
header nav [role="button"],
.site-header nav button,
.site-header nav [role="button"] {
  color: #172033 !important;
  opacity: 1 !important;
}

header a.btn,
header a.button,
header a[class*="button"],
header a[class*="cta"],
header button,
.site-header a.btn,
.site-header a.button,
.site-header a[class*="button"],
.site-header a[class*="cta"],
.site-header button {
  color: #ffffff !important;
}

/* Correct white-on-pale headings in the Phase 4 hero. */
body.phase4-seo-page main > section:first-of-type h1,
body.phase4-seo-page main > section:first-of-type h2,
body.phase4-seo-page main > section:first-of-type h3,
body.phase4-seo-page main > section:first-of-type h4,
body.phase4-seo-page main [class*="hero"] h1,
body.phase4-seo-page main [class*="hero"] h2,
body.phase4-seo-page main [class*="hero"] h3,
body.phase4-seo-page main [class*="hero"] h4 {
  color: #111827 !important;
  opacity: 1 !important;
}

body.phase4-seo-page main > section:first-of-type p,
body.phase4-seo-page main > section:first-of-type li,
body.phase4-seo-page main > section:first-of-type small,
body.phase4-seo-page main [class*="hero"] p,
body.phase4-seo-page main [class*="hero"] li,
body.phase4-seo-page main [class*="hero"] small {
  color: #334155 !important;
  opacity: 1 !important;
}

body.phase4-seo-page main :is(
  [class*="hero"],
  [class*="example"],
  [class*="step"],
  [class*="card"],
  [class*="panel"],
  [class*="faq"],
  [class*="box"],
  [class*="url"],
  [class*="pattern"],
  [class*="code"],
  [class*="tag"],
  [class*="pill"],
  [class*="related"]
) :is(h1, h2, h3, h4, h5, h6, p, li, span, strong, em, small, code, pre, summary, label, dt, dd) {
  color: #1f2937 !important;
  opacity: 1 !important;
}

body.phase4-seo-page main :is(
  [class*="hero"],
  [class*="example"],
  [class*="step"],
  [class*="card"],
  [class*="panel"],
  [class*="faq"],
  [class*="box"],
  [class*="url"],
  [class*="pattern"],
  [class*="code"],
  [class*="tag"],
  [class*="pill"],
  [class*="related"]
) a:not(.btn):not(.button):not([class*="button"]):not([class*="cta"]) {
  color: #1d4ed8 !important;
  opacity: 1 !important;
  text-decoration-thickness: 1px;
  text-underline-offset: 0.16em;
}

body.phase4-seo-page main :is(
  [class*="hero"],
  [class*="example"],
  [class*="step"],
  [class*="card"],
  [class*="panel"],
  [class*="faq"],
  [class*="box"],
  [class*="url"],
  [class*="pattern"],
  [class*="code"],
  [class*="tag"],
  [class*="pill"],
  [class*="related"]
) :is(button, .btn, .button, [class*="button"], [class*="cta"]) {
  color: #ffffff !important;
  opacity: 1 !important;
}

body.phase4-seo-page main [class*="hero"] :is(.btn, .button, [class*="button"], [class*="cta"]) {
  background-color: #2457eb !important;
  border-color: #2457eb !important;
  color: #ffffff !important;
}

body.phase4-seo-page main [class*="hero"] :is(.btn, .button, [class*="button"], [class*="cta"]):hover {
  background-color: #1d4ed8 !important;
}

/* Compact additional downloader links inside the homepage platform section. */
.phase4-more-downloaders {
  margin: 1.25rem 0 0;
  padding: 1rem 1.1rem;
  border: 1px solid #30394b;
  border-radius: 1rem;
  background: linear-gradient(135deg, #111827 0%, #151e30 100%);
  color: #f8fafc;
}

.phase4-more-downloaders__heading {
  margin: 0 0 0.75rem;
  color: #f8fafc !important;
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0.09em;
  line-height: 1.4;
  text-transform: uppercase;
}

.phase4-more-downloaders__links {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
}

.phase4-more-downloaders__links a {
  display: inline-flex;
  align-items: center;
  min-height: 2.25rem;
  padding: 0.45rem 0.8rem;
  border: 1px solid #3a465b;
  border-radius: 999px;
  background: #1d293b;
  color: #e7efff !important;
  font-size: 0.875rem;
  font-weight: 650;
  line-height: 1.25;
  text-decoration: none;
  transition: background-color 150ms ease, border-color 150ms ease, transform 150ms ease;
}

.phase4-more-downloaders__links a:hover,
.phase4-more-downloaders__links a:focus-visible {
  border-color: #7295ff;
  background: #263b62;
  color: #ffffff !important;
  outline-offset: 3px;
}

@media (max-width: 640px) {
  .phase4-more-downloaders {
    padding: 0.9rem;
    border-radius: 0.85rem;
  }

  .phase4-more-downloaders__links {
    gap: 0.4rem;
  }

  .phase4-more-downloaders__links a {
    min-height: 2.1rem;
    padding: 0.4rem 0.65rem;
    font-size: 0.82rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  .phase4-more-downloaders__links a {
    transition: none;
  }
}

/* PHASE 4.3 HOMEPAGE SPACING */

/* Keep the platform cards and compact guide strip intact. */
html body main > #platform-downloaders {
  margin-bottom: 0 !important;
  padding-bottom: 24px !important;
}

/* First marked gap: platform guides to three simple steps. */
html body main > #platform-downloaders + section {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  padding-top: 24px !important;
  padding-bottom: 24px !important;
}

/* Second marked gap: three simple steps to feature section. */
html body main > #platform-downloaders + section + section {
  margin-top: 0 !important;
  padding-top: 24px !important;
}

/* Keep spacing compact on smaller screens as well. */
@media (max-width: 768px) {
  html body main > #platform-downloaders {
    padding-bottom: 20px !important;
  }

  html body main > #platform-downloaders + section {
    padding-top: 20px !important;
    padding-bottom: 20px !important;
  }

  html body main > #platform-downloaders + section + section {
    padding-top: 20px !important;
  }
}

/* PHASE 4.4 COMPACT HOMEPAGE */

/* Compact the six homepage platform cards. */
html body #platform-downloaders .platform-card {
  min-height: 0 !important;
  padding-top: 0.9rem !important;
  padding-bottom: 0.9rem !important;
}

html body #platform-downloaders .platform-card-action {
  display: inline-flex !important;
  align-items: center;
  width: fit-content;
  margin-top: 0.6rem !important;
  padding: 0.4rem 0.65rem !important;
  border: 1px solid rgba(129, 140, 248, 0.4);
  border-radius: 8px;
  background: rgba(99, 102, 241, 0.12);
  text-decoration: none !important;
}

/* Close the gap below the downloader hero/source strip. */
html body main > section:has(.platform-row) {
  min-height: 0 !important;
  margin-bottom: 0 !important;
  padding-bottom: 12px !important;
}

html body main > section:has(.platform-row) + #platform-downloaders {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

/* Close the gap between platform guides and Three Simple Steps. */
html body main > #platform-downloaders {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

html body main > #platform-downloaders .phase4-more-downloaders {
  margin-top: 12px !important;
  margin-bottom: 0 !important;
}

html body main > #platform-downloaders + #how-it-works {
  margin-top: 0 !important;
  padding-top: 12px !important;
}

html body main > #platform-downloaders + #how-it-works .section-heading {
  margin-top: 0 !important;
}


/* GDPR POLICY FOOTER LINK */
html body .footer-gdpr-link,
html body footer a[href="/privacy-policy/"] {
  color: #cbd5e1 !important;
  text-underline-offset: 3px;
}

/* PHASE 4.5 DOWNLOADER CTA AND CONTRAST FIXES */

/* Homepage: keep the tool category, title and download action.
   Hide the longer descriptive copy inside platform cards. */
html body .platform-hub .platform-card p:not([class*="kicker"]):not([class*="category"]):not([class*="eyebrow"]):not([class*="label"]):not([class*="tag"]):not([class*="type"]) {
  display: none !important;
}

html body .platform-hub .platform-card .platform-card-description,
html body .platform-hub .platform-card .card-description,
html body .platform-hub .platform-card .tool-description,
html body .platform-hub .platform-card .platform-card-copy,
html body .platform-hub .platform-card .description {
  display: none !important;
}

html body .platform-hub .platform-card {
  min-height: 0 !important;
  height: auto !important;
}

/* Header: improve logo and navigation contrast on every page. */
html body .site-shell header.topbar,
html body header.topbar {
  background-color: #090a10 !important;
  color: #f8fafc !important;
}

html body header.topbar .brand,
html body header.topbar .brand *,
html body header.topbar nav.nav-links a:not(.btn):not(.button):not([class*="button"]):not([class*="cta"]),
html body header.topbar .nav-links > a:not(.btn):not(.button):not([class*="button"]):not([class*="cta"]),
html body header.topbar nav.nav-links details.nav-dropdown > summary,
html body header.topbar nav.nav-links details.nav-dropdown > summary * {
  color: #e2e8f0 !important;
  -webkit-text-fill-color: #e2e8f0 !important;
  opacity: 1 !important;
}

html body header.topbar nav.nav-links a:hover,
html body header.topbar nav.nav-links details.nav-dropdown > summary:hover {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

/* Downloader SEO pages: prevent dark H1 text on the dark background. */
html body header.page-heading.seo-page-heading h1,
html body .seo-page-heading h1,
html body .page-heading h1 {
  color: #f8fafc !important;
  -webkit-text-fill-color: #f8fafc !important;
  background: none !important;
  background-image: none !important;
  -webkit-background-clip: border-box !important;
  background-clip: border-box !important;
  opacity: 1 !important;
}

html body .seo-page-heading .primary-btn {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}