/* Phase 1 readability patches — surgical, real-theme selectors only.
 * 2026-05-17. Five areas: meta contrast, grid gap, sidebar density,
 * hero CTA prominence, title hover. No global font-size or h1-h6 override.
 */

/* Area 1: Blog post meta — stronger contrast on metadata + separators */
.aw-entry__post-meta {
  /* reason: secondary #6E6E6E on light bg is borderline for 14px metadata */
  --aw-color-secondary: #5a5a5a;
}

.aw-entry__post-meta .aw-meta-date:not(:first-child):before {
  /* reason: separator #D2D2D2 too faint, contrast-400 (#777) reads */
  background: var(--aw-color-contrast-400);
}

/* Area 2: Blog grid — wider column gap to match generous row rhythm.
 * Three-class selector required because customizer emits an inline <style>
 * block AFTER all external CSS with .aw-posts-area__archive.aw-posts-area__grid
 * { --aw-posts-area-grid-column-gap: 32px } at 0,0,2,0 — same specificity but
 * later source order wins. Adding .aw-posts-area__main (also on the same
 * element) bumps us to 0,0,3,0 and out-specifies the inline rule. */
@media (min-width: 992px) {
  .aw-posts-area__main.aw-posts-area__archive.aw-posts-area__grid {
    /* reason: 1.5rem col vs 4rem row felt squished; balance horizontal */
    --aw-posts-area-grid-column-gap: 2rem;
  }
}

@media (min-width: 1200px) {
  .aw-posts-area__main.aw-posts-area__archive.aw-posts-area__grid {
    --aw-posts-area-grid-column-gap: 2.5rem;
  }
}

/* Area 3: Sidebar density — tighten widget gap at narrow sidebars */
@media (min-width: 992px) and (max-width: 1399px) {
  .widget:not(:last-child) {
    /* reason: 3rem stack creates long scroll in ~300px sidebar */
    margin-bottom: 2rem;
  }
}

/* Area 4: Hero CTA — give the homepage call-to-action visual weight */
.aw-hero-homepage__cta .aw-button,
.aw-hero-type-1 .aw-button {
  /* reason: generic .aw-button inherits inline content width, hero needs commanding presence */
  min-width: 220px;
  padding: 0.875rem 2rem;
  font-size: 1.0625rem;
  font-weight: 600;
  text-align: center;
}

@media (max-width: 575px) {
  .aw-hero-homepage__cta .aw-button,
  .aw-hero-type-1 .aw-button {
    /* reason: full-width tappable on small screens */
    width: 100%;
    min-width: auto;
  }
}

/* Area 5: Entry title hover — accent colour beats subtle grey shift */
.aw-entry__title a {
  transition: color 0.2s ease;
}

.aw-entry__title a:hover {
  /* reason: #4A4A4A → #1D1D1D shift не очевиден при scan; accent даёт чёткий feedback */
  color: var(--aw-color-accent);
}
