/* GetMyCert redesign — certification landing pages (injected after inline styles) */

:root {
  --primary: #0B1220;
  --accent: #0D9488;
  --accent-light: #14B8A6;
  --bg-light: #F6F8FC;
  --text-dark: #1B2434;
  --text-light: #5B6779;
  --border: #E4E9F2;
  --gmc-ink: #070B14;
  --gmc-mint: #2DE3B7;
  --gmc-cyan: #4CC9F0;
  --gmc-violet: #8B7CFF;
  --gmc-grad: linear-gradient(90deg, #2DE3B7, #4CC9F0 55%, #8B7CFF);
  --gmc-grad-light: linear-gradient(90deg, #0D9488, #0E7490 55%, #6D5BD0);
}

body {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
  color: var(--text-dark);
  background: #FBFCFE;
}

h1, h2, h3, .section-title, .hero-text h1 {
  font-family: 'Space Grotesk', 'Inter', sans-serif !important;
  letter-spacing: -0.02em;
}

/* progress bar (element added by gmc-redesign.js) */
.gmc-progress {
  position: fixed; top: 0; left: 0; height: 3px; width: 0;
  background: var(--gmc-grad); z-index: 200; border-radius: 0 3px 3px 0;
}

/* ---------- nav: midnight glass (body > nav only — page bodies contain inline breadcrumb <nav>s) ---------- */
body > nav {
  background: rgba(7, 11, 20, 0.85) !important;
  -webkit-backdrop-filter: blur(16px); backdrop-filter: blur(16px);
  border-bottom: 1px solid rgba(232, 237, 247, 0.08) !important;
  box-shadow: none !important;
  padding: 14px 0 !important;
}
body > nav .logo { color: #E8EDF7 !important; font-family: 'Space Grotesk', sans-serif; font-weight: 600 !important; }
body > nav .nav-links a { color: #9AA7BD !important; font-weight: 500 !important; }
body > nav .nav-links a:hover { color: #E8EDF7 !important; }

/* breadcrumb navs inside content: plain inline text, never sticky bars
   (the base gmc-seo.css styles every <nav> as a sticky white bar) */
nav[aria-label="breadcrumb"] {
  position: static !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 0 14px !important;
}
nav[aria-label="breadcrumb"] a { color: var(--accent) !important; text-decoration: none; }

/* promo banner (about.html) */
.promo-banner {
  background: #0B1120 !important; color: #9AA7BD !important;
  border-bottom: 1px solid rgba(232, 237, 247, 0.08);
}
.promo-banner span { color: var(--gmc-mint) !important; }

/* ---------- hero: midnight aurora ---------- */
.hero {
  background:
    radial-gradient(720px 420px at 88% -20%, rgba(139, 124, 255, 0.25), transparent 65%),
    radial-gradient(820px 500px at -8% 120%, rgba(45, 227, 183, 0.18), transparent 65%),
    radial-gradient(420px 320px at 70% 100%, rgba(76, 201, 240, 0.12), transparent 65%),
    #070B14 !important;
  border-bottom: none !important;
  padding: 84px 20px 64px !important;
  position: relative;
  overflow: hidden;
}
.hero::before {
  content: ''; position: absolute; inset: 0; pointer-events: none;
  background-image: linear-gradient(rgba(232,237,247,.045) 1px, transparent 1px), linear-gradient(90deg, rgba(232,237,247,.045) 1px, transparent 1px);
  background-size: 48px 48px;
  -webkit-mask-image: radial-gradient(700px 420px at 50% 30%, #000 25%, transparent 75%);
  mask-image: radial-gradient(700px 420px at 50% 30%, #000 25%, transparent 75%);
}
.hero .container, .hero-content { position: relative; }
.hero-icon {
  background: rgba(232, 237, 247, 0.05);
  border: 1px solid rgba(232, 237, 247, 0.12);
  border-radius: 18px; padding: 16px; line-height: 0;
}
.hero-icon svg { stroke: var(--gmc-mint) !important; }
.hero h1 {
  color: #E8EDF7 !important;
  font-size: clamp(2rem, 4.6vw, 3.3rem) !important;
  font-weight: 700 !important;
  line-height: 1.06 !important;
  letter-spacing: -0.03em !important;
}
.hero p, .hero-text p { color: #9AA7BD !important; font-size: 17px !important; }
.hero-text p { max-width: 62ch; }

.quick-stats { gap: 12px !important; }
.quick-stats .stat {
  background: rgba(232, 237, 247, 0.045) !important;
  border: 1px solid rgba(232, 237, 247, 0.11) !important;
  border-radius: 14px !important;
  padding: 14px 22px !important;
  box-shadow: none !important;
}
.stat-label { color: #6B7890 !important; font-size: 11px !important; font-weight: 700 !important; letter-spacing: 0.1em; text-transform: uppercase; }
.stat-value {
  font-family: 'Space Grotesk', sans-serif !important; font-weight: 700 !important;
  background: var(--gmc-grad); -webkit-background-clip: text; background-clip: text;
  color: transparent !important;
}

/* hero CTA buttons if present */
.hero .cta-button, .hero a.cta-button {
  background: var(--gmc-grad) !important; color: #04110D !important;
  border-radius: 999px !important; font-weight: 700 !important;
  box-shadow: 0 10px 30px -10px rgba(45, 227, 183, 0.5) !important;
  border: none !important;
}

/* ---------- content ---------- */
.content-section { padding: 56px 20px !important; }
.section-title {
  color: var(--primary) !important;
  font-size: clamp(1.55rem, 2.8vw, 2.1rem) !important;
  font-weight: 700 !important;
  position: relative;
  padding-bottom: 14px;
}
.section-title::after {
  content: ''; position: absolute; left: 0; bottom: 0;
  width: 52px; height: 3.5px; border-radius: 3px; background: var(--gmc-grad-light);
}
.lead, .lede { color: var(--text-dark) !important; font-weight: 500; }
.section-text { color: #3D495C !important; line-height: 1.75 !important; }
.section-text strong { color: var(--primary); }

/* tables → cards */
.details-table, .domain-table {
  border: 1px solid var(--border) !important;
  border-radius: 16px !important;
  overflow: hidden;
  box-shadow: 0 10px 30px -18px rgba(11, 18, 32, 0.18) !important;
  border-collapse: separate !important; border-spacing: 0 !important;
}
.details-table td { border-color: var(--border) !important; }
.details-table td:first-child { color: var(--primary) !important; font-weight: 600 !important; }

/* domain bars */
.domain-bar, .domain-track, .weight-track, .domain-bar-track {
  background: #EAEEF6 !important; border-radius: 99px !important; overflow: hidden;
}
.domain-bar span, .domain-fill, .weight-fill, .domain-bar-fill {
  background: var(--gmc-grad-light) !important; border-radius: 99px !important;
}
.domain-item, .domain-card, .domain-row {
  border: 1px solid var(--border) !important; border-radius: 16px !important;
  background: #fff !important;
  box-shadow: 0 8px 24px -16px rgba(11, 18, 32, 0.12) !important;
  transition: transform .25s ease, box-shadow .25s ease;
}
.domain-item:hover, .domain-card:hover { transform: translateY(-3px); box-shadow: 0 16px 36px -16px rgba(11, 18, 32, 0.18) !important; }
.domain-weight, .domain-pct { color: var(--accent) !important; font-family: 'Space Grotesk', sans-serif; font-weight: 700 !important; }

/* tips / cards / faq / resources */
.tip, .faq-item, .resource-link, .callout, .note-box, .verdict-box, .note, .notice {
  border: 1px solid var(--border) !important;
  border-radius: 16px !important;
  background: #fff !important;
  box-shadow: 0 8px 24px -16px rgba(11, 18, 32, 0.1) !important;
}
.tip { transition: transform .25s ease, box-shadow .25s ease; }
.tip:hover { transform: translateY(-3px); }
.tip h4, .faq-item h4 { color: var(--primary) !important; font-family: 'Space Grotesk', sans-serif; }
.resource-link { transition: transform .25s ease, border-color .25s ease !important; }
.resource-link:hover { transform: translateX(4px); border-color: var(--accent) !important; }
.resource-title { color: var(--primary) !important; font-weight: 700 !important; }
.resource-arrow { color: var(--accent) !important; }
.verdict-box, .callout {
  border-left: 4px solid var(--accent) !important;
  background: linear-gradient(135deg, rgba(13, 148, 136, 0.05), rgba(109, 91, 208, 0.04)) !important;
}
.check-list li::before { color: var(--accent) !important; }
.pill {
  background: rgba(13, 148, 136, 0.08) !important; color: var(--accent) !important;
  border: 1px solid rgba(13, 148, 136, 0.25) !important; border-radius: 999px !important;
}

/* ---------- CTA section: midnight aurora panel ---------- */
.cta-section {
  background:
    radial-gradient(560px 340px at 85% -20%, rgba(139, 124, 255, 0.3), transparent 65%),
    radial-gradient(620px 380px at 0% 130%, rgba(45, 227, 183, 0.22), transparent 65%),
    #0B1120 !important;
  border-radius: 26px;
  margin: 30px auto !important;
  max-width: 1160px;
}
.cta-section h2 { color: #E8EDF7 !important; font-weight: 700 !important; }
.cta-section p { color: #9AA7BD !important; }
.cta-button {
  background: var(--gmc-grad) !important; color: #04110D !important;
  border-radius: 999px !important; font-weight: 700 !important;
  box-shadow: 0 12px 34px -12px rgba(45, 227, 183, 0.55) !important;
  border: none !important;
  transition: transform .25s cubic-bezier(.2,.8,.25,1), box-shadow .25s !important;
}
.cta-button:hover { transform: translateY(-2px) scale(1.02); box-shadow: 0 18px 44px -12px rgba(76, 201, 240, 0.6) !important; }
.inline-cta { border-radius: 16px !important; }
.inline-cta a {
  background: var(--gmc-grad) !important; color: #04110D !important;
  border-radius: 999px !important; font-weight: 700 !important;
  box-shadow: 0 10px 28px -10px rgba(45, 227, 183, 0.5) !important;
  border: none !important; display: inline-block;
  transition: transform .25s cubic-bezier(.2,.8,.25,1), box-shadow .25s !important;
}
.inline-cta a:hover { transform: translateY(-2px) scale(1.02); box-shadow: 0 16px 38px -12px rgba(76, 201, 240, 0.55) !important; }
.disclaimer p { color: #6B7890 !important; }

/* ---------- footer: midnight ---------- */
footer, .footer { background: #070B14 !important; border-top: 1px solid rgba(232, 237, 247, 0.07); }
.footer-section h4 { color: #6B7890 !important; letter-spacing: 0.1em; text-transform: uppercase; font-size: 12px !important; }
.footer-section a { color: #9AA7BD !important; }
.footer-section a:hover { color: var(--gmc-mint) !important; }
.footer-bottom { border-top: 1px solid rgba(232, 237, 247, 0.07) !important; color: #6B7890 !important; }
.footer-bottom p { color: #6B7890 !important; }

/* ---------- reveal animations (gated behind .gmc-anim set by JS) ---------- */
.gmc-anim .gmc-rv { opacity: 0; transform: translateY(18px); transition: opacity .7s ease, transform .7s cubic-bezier(.2,.8,.25,1); }
.gmc-anim .gmc-rv.gmc-in { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
  .gmc-anim .gmc-rv { opacity: 1 !important; transform: none !important; transition: none !important; }
}

/* mobile polish */
@media (max-width: 768px) {
  .hero { padding: 64px 16px 44px !important; }
  .hero-header { flex-direction: column; gap: 16px !important; }
  .quick-stats .stat { padding: 12px 16px !important; }
  nav .nav-container { gap: 12px; }
  nav .nav-links { gap: 14px !important; }
  nav .nav-links a { font-size: 13px !important; white-space: nowrap; }
}
@media (max-width: 540px) {
  nav .nav-links li:nth-child(n+3) { display: none; }
}