/*
  Easy theme overrides for AussieGuy92.com.

  Edit this file for simple visual changes without digging through
  public_html/assets/site.css.

  Keep the values conservative. If something breaks, delete the changed line
  and the main site stylesheet will take over again.
*/

:root {
  /*
    Homepage post slider title size.
    Previous size was about: clamp(46px, 4.4vw, 68px)
    Current size is about 25% smaller.
  */
  --home-slider-title-size: clamp(32px, 3vw, 50px);
  --home-slider-title-spacing: -1.2px;

  /*
    Main accent colors.
    These affect buttons, highlights and panels throughout the site.
  */
  --teal: #2eaab2;
  --green: #397e46;
  --blue: #236d98;
  --gold: #8c6924;
}

/*
  Readability pass.

  These rules reduce cramped lettering, improve line spacing in cards,
  and keep blog section headings aligned with the content they introduce.
*/

.primary-nav a,
.inner-nav a,
.enter-pill,
.blog-category-bar a,
.directory-categories button {
  letter-spacing: 0 !important;
}

.section-kicker,
.eyebrow,
.blog-featured-category,
.blog-card-meta,
.blog-card footer,
.directory-card-copy > span,
.directory-toolbar > span {
  letter-spacing: .7px !important;
}

.directory-hero h1,
.blog-heading h1,
.blog-archive-heading h1,
.markdown-page-heading h1,
.php-hub-hero h1,
.content-directory-hero h1 {
  letter-spacing: -.8px !important;
  line-height: 1.08 !important;
}

/*
  Strong title sizing overrides.
  These are intentionally explicit because older compatibility CSS also targets
  the same headings later in the cascade.
*/

.hero .hero-slide h1,
.site-shell .hero h1 {
  font-size: clamp(32px, 3vw, 50px) !important;
  line-height: 1.08 !important;
  letter-spacing: -1.2px !important;
  font-weight: 560 !important;
  max-width: 720px !important;
}

.directory-hero h1,
.markdown-page-heading h1,
.php-hub-hero h1,
.content-directory-hero h1 {
  font-size: clamp(38px, 4vw, 54px) !important;
  line-height: 1.08 !important;
  letter-spacing: -.9px !important;
  font-weight: 620 !important;
}

.blog-heading h1,
.blog-archive-heading h1 {
  font-size: clamp(45px, 5vw, 66px) !important;
  line-height: 1.04 !important;
  letter-spacing: -1.4px !important;
}

.post-hero h1,
.markdown-post-page .post-hero-copy h1 {
  font-size: clamp(43px, 4.8vw, 68px) !important;
  line-height: 1.03 !important;
  letter-spacing: -1.6px !important;
}

.blog-latest > header,
.blog-categories > header,
.blog-tags-cloud > header {
  display: block !important;
  margin-bottom: 24px !important;
}

.blog-latest h2,
.blog-categories h2,
.blog-tags-cloud h2 {
  margin-top: 8px !important;
  letter-spacing: -.8px !important;
  line-height: 1.12 !important;
}

.blog-card h2,
.directory-card h2,
.resource-card h3,
.blog-category-copy > strong,
.content-directory-card h2 {
  letter-spacing: 0 !important;
  line-height: 1.22 !important;
}

.inner-page .blog-card p,
.directory-card p,
.resource-card p,
.content-directory-card p,
.markdown-body p,
.markdown-body li {
  line-height: 1.68 !important;
}

.blog-tags-cloud a,
.post-tags a,
.post-tags span {
  letter-spacing: 0 !important;
  text-transform: none !important;
  font-size: 13px !important;
  font-weight: 750 !important;
  line-height: 1.2 !important;
}

.blog-tags-cloud a span {
  font-size: 12px !important;
  font-weight: 800 !important;
}

/*
  Search experience overrides.

  The search index is generated by PHP, but these rules keep both the popup
  and the full search page readable without editing the larger compiled CSS.
*/

.global-search-backdrop {
  align-items: flex-start !important;
  padding: clamp(72px, 12vh, 120px) 20px 24px !important;
  background: rgba(3, 7, 18, .78) !important;
  backdrop-filter: blur(14px) !important;
}

.global-search-panel {
  width: min(720px, calc(100vw - 32px)) !important;
  padding: 24px !important;
  border-radius: 20px !important;
}

.global-search-panel > header {
  margin-bottom: 18px !important;
}

.global-search-panel h2 {
  font-size: 20px !important;
  letter-spacing: -.2px !important;
}

.global-search-panel > label {
  min-height: 58px !important;
  padding: 0 14px !important;
  border-radius: 12px !important;
}

.global-search-panel input {
  font-size: 16px !important;
  min-width: 0 !important;
}

.global-search-results {
  max-height: min(52vh, 480px) !important;
  overflow: auto !important;
  padding-right: 2px !important;
}

.global-search-results > span {
  margin: 18px 0 10px !important;
  letter-spacing: .7px !important;
}

.global-search-results > a {
  align-items: center !important;
  border-radius: 12px !important;
  gap: 18px !important;
  padding: 14px !important;
}

.global-search-results strong {
  font-size: 16px !important;
  letter-spacing: 0 !important;
  line-height: 1.25 !important;
}

.global-search-results p,
.global-search-empty {
  font-size: 14px !important;
  line-height: 1.5 !important;
}

.global-search-all {
  min-height: 48px !important;
  margin-top: 18px !important;
  border-radius: 10px !important;
  font-size: 13px !important;
}

.search-page-input {
  min-height: 56px !important;
  border-radius: 12px !important;
  padding: 0 6px 0 18px !important;
}

.search-page-input input {
  font-size: 16px !important;
  letter-spacing: 0 !important;
  color: #f7f7f4 !important;
}

.search-page-input input::placeholder {
  letter-spacing: 0 !important;
  color: rgba(247, 247, 244, .58) !important;
}

.search-page-input > button {
  min-height: 44px !important;
  padding: 0 24px !important;
  border-radius: 14px !important;
  font-size: 12px !important;
  letter-spacing: .4px !important;
}

.search-results-shell {
  align-items: start !important;
}

.search-filters > div {
  display: none !important;
}

.search-results > header h2 {
  font-size: clamp(28px, 3vw, 42px) !important;
  line-height: 1.08 !important;
  letter-spacing: -.7px !important;
}

.search-result-card {
  border-radius: 16px !important;
  gap: 18px !important;
  padding: 18px !important;
}

.search-result-card strong {
  font-size: clamp(19px, 2vw, 25px) !important;
  line-height: 1.18 !important;
  letter-spacing: -.2px !important;
}

.search-result-card p {
  font-size: 15px !important;
  line-height: 1.58 !important;
}