:root {
  --readable-link: #26378f;
  --readable-action: #2e3f9e;
  --readable-action-hover: #202b72;
  --readable-chip-bg: #eef2ff;
  --readable-chip-border: #c8d2ff;
}

body > header .header-container,
header.top-header .header-container {
  width: min(96vw, 1560px) !important;
  max-width: min(96vw, 1560px) !important;
  margin-left: auto !important;
  margin-right: auto !important;
  display: grid !important;
  grid-template-columns: minmax(178px, max-content) minmax(240px, 1fr) max-content max-content !important;
  align-items: center !important;
  justify-content: normal !important;
  gap: 14px !important;
  text-align: left !important;
}

body > header .header-container .logo,
header.top-header .header-container .logo,
body > header .logo.logo-stack,
header.top-header .logo.logo-stack {
  grid-column: 1 !important;
  justify-self: start !important;
  align-items: flex-start !important;
  justify-content: flex-start !important;
  text-align: left !important;
  width: auto !important;
  max-width: none !important;
}

body > header .logo-stack .logo-brand,
header.top-header .logo-stack .logo-brand,
body > header .logo .logo-brand,
header.top-header .logo .logo-brand {
  justify-content: flex-start !important;
  text-align: left !important;
}

body > header .site-search,
header.top-header .site-search {
  grid-column: 2 !important;
  justify-self: stretch !important;
  width: 100% !important;
}

body > header #main-nav.main-nav,
header.top-header #main-nav.main-nav {
  grid-column: 3 !important;
  justify-self: end !important;
  justify-content: flex-end !important;
}

body > header .nav-toggle,
header.top-header .nav-toggle {
  grid-column: 4 !important;
  justify-self: end !important;
}

body > header .popular-wrap,
header.top-header .popular-wrap {
  grid-column: 1 / -1 !important;
}

@media (max-width: 1180px) {
  body > header .header-container,
  header.top-header .header-container {
    grid-template-columns: minmax(170px, max-content) minmax(220px, 1fr) max-content !important;
  }

  body > header #main-nav.main-nav,
  header.top-header #main-nav.main-nav {
    display: none !important;
  }

  body > header .nav-toggle,
  header.top-header .nav-toggle {
    display: inline-block !important;
    grid-column: 3 !important;
  }
}

@media (max-width: 768px) {
  body > header .header-container,
  header.top-header .header-container {
    width: calc(100vw - 20px) !important;
    max-width: calc(100vw - 20px) !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    gap: 10px !important;
  }

  body > header .site-search,
  header.top-header .site-search {
    display: none !important;
  }

  body > header .nav-toggle,
  header.top-header .nav-toggle {
    grid-column: 2 !important;
  }
}

.hero-header .hero-lead strong,
.hero-header .hero-lead a,
.hero-header p strong,
.hero-header p a {
  background: var(--readable-chip-bg) !important;
  border-radius: 5px;
  color: var(--readable-link) !important;
  font-weight: 800;
  padding: 0 0.18em;
  text-decoration-color: currentColor;
  text-underline-offset: 3px;
}

.hero-header .hero-lead a:hover,
.hero-header p a:hover {
  background: #dfe6ff !important;
  color: #1c286f !important;
}

.site-search button,
.search-page-control button,
.search-result-open,
.tool-btn:not(.tool-btn-secondary),
.cta-button,
.hub-card .hub-link,
.artigos-hub-section .hub-link,
.insideout-article .hub-link,
.editorial-hub-card .hub-link,
.sim-primary-button,
.popular-nav a.hot {
  background: var(--readable-action) !important;
  border-color: var(--readable-action) !important;
  color: #ffffff !important;
}

.site-search button:hover,
.site-search button:focus-visible,
.search-page-control button:hover,
.search-page-control button:focus-visible,
.search-result-open:hover,
.search-result-open:focus-visible,
.tool-btn:not(.tool-btn-secondary):hover,
.tool-btn:not(.tool-btn-secondary):focus-visible,
.cta-button:hover,
.cta-button:focus-visible,
.hub-card:hover .hub-link,
.hub-card:focus-visible .hub-link,
.artigos-hub-section a:focus-visible .hub-link,
.artigos-hub-section a:hover .hub-link,
.insideout-article .hub-link:hover,
.insideout-article .hub-link:focus-visible,
.editorial-hub-card:hover .hub-link,
.editorial-hub-card:focus-visible .hub-link,
.sim-primary-button:hover,
.sim-primary-button:focus-visible,
.popular-nav a.hot:hover,
.popular-nav a.hot:focus-visible {
  background: var(--readable-action-hover) !important;
  border-color: var(--readable-action-hover) !important;
  color: #ffffff !important;
}

.tool-btn-secondary,
a.tool-btn-secondary {
  background: #ffffff !important;
  border-color: #b9c3d8 !important;
  color: var(--readable-link) !important;
}

.tool-btn-secondary:hover,
.tool-btn-secondary:focus-visible,
a.tool-btn-secondary:hover,
a.tool-btn-secondary:focus-visible {
  background: var(--readable-chip-bg) !important;
  border-color: var(--readable-chip-border) !important;
  color: #1c286f !important;
}

.editorial-prose a,
.tool-page-main a:not(.tool-btn):not(.search-result-open):not(.hub-link),
.insideout-article a:not(.hub-link),
.artigos-hub-container a:not(.hub-link),
.guides-section a:not(.hub-link),
#description-container a,
.section a,
.intro-text a,
.subsection a {
  color: var(--readable-link) !important;
}

.web-design-section strong,
.web-design-section li strong,
.insideout-article .web-design-section strong {
  color: var(--ink) !important;
}

.copy-tip {
  background: #273047 !important;
  border-left-color: var(--accent) !important;
  color: #ffffff !important;
}

.copy-tip strong,
.copy-tip .copy-text {
  color: #ffffff !important;
}

.copy-format-label {
  color: #ffffff !important;
  text-shadow: 0 1px 3px rgb(0 0 0 / 0.35);
}

#cookie-banner {
  background: #202535 !important;
  color: #ffffff !important;
}

#cookie-banner a,
#policy-link {
  color: #dfe6ff !important;
}

#accept-cookies {
  background: #ffffff !important;
  border-color: #ffffff !important;
  color: #202535 !important;
}

#accept-cookies:hover,
#accept-cookies:focus-visible {
  background: #dfe6ff !important;
  border-color: #dfe6ff !important;
  color: #202535 !important;
}

#center-content th {
  background: #202535 !important;
  color: #ffffff !important;
}

.home-section-card span:last-child,
.hub-feature-card span,
.hub-next-areas span,
.intro-text,
.tool-page-main .intro-text {
  color: #4f5b70;
}

.ts-preview-label,
.ts-sample-text {
  color: inherit;
}

.adsense-container script {
  display: none !important;
}

a.search-result-open,
a.search-result-open *,
.cta-content,
.cta-content *,
.tool-btn:not(.tool-btn-secondary),
.tool-btn:not(.tool-btn-secondary) *,
.hub-card .hub-link,
.hub-card .hub-link *,
.insideout-article .hub-link,
.insideout-article .hub-link *,
.editorial-hub-card .hub-link,
.editorial-hub-card .hub-link * {
  color: #ffffff !important;
}

a.search-result-open,
.cta-content,
.tool-btn:not(.tool-btn-secondary),
.hub-card .hub-link,
.insideout-article .hub-link,
.editorial-hub-card .hub-link {
  background: var(--readable-action) !important;
  border-color: var(--readable-action) !important;
}

.guides-page a.editorial-hub-card,
.guides-page a.editorial-hub-card:hover,
.guides-page a.editorial-hub-card:focus-visible {
  color: inherit !important;
  text-decoration: none !important;
}

.guides-page .editorial-hub-card .hub-link,
.guides-page .editorial-hub-card:hover .hub-link,
.guides-page .editorial-hub-card:focus-visible .hub-link {
  align-self: flex-start !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  color: var(--brand-dark) !important;
  display: inline !important;
  font-size: 0.88rem !important;
  font-weight: 900 !important;
  line-height: 1.35 !important;
  margin-top: auto !important;
  padding: 0 !important;
  position: static !important;
  text-decoration: none !important;
}

.guides-page .editorial-hub-card:hover .hub-link,
.guides-page .editorial-hub-card:focus-visible .hub-link {
  color: var(--ink) !important;
}
