/*
Theme Name: QOLCS GeneratePress Child
Theme URI: https://qolcs.org/
Description: Lightweight, accessible GeneratePress child theme for Quality of Life Community Services.
Author: Quality of Life Community Services
Template: generatepress
Version: 1.1.1
Text Domain: qolcs-generatepress-child
*/

:root {
  --qolcs-navy: #15324a;
  --qolcs-blue: #005ea8;
  --qolcs-blue-dark: #003e73;
  --qolcs-gold: #f2b134;
  --qolcs-ink: #17212b;
  --qolcs-muted: #52606d;
  --qolcs-surface: #ffffff;
  --qolcs-bg: #f5f7fa;
  --qolcs-border: #d7dee7;
}

html {
  font-size: 100%;
  scroll-behavior: smooth;
}

body,
button,
input,
select,
textarea {
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}

body {
  color: var(--qolcs-ink);
  background: var(--qolcs-bg);
  font-size: 18px;
  line-height: 1.7;
  text-rendering: optimizeLegibility;
}

a {
  color: var(--qolcs-blue);
  text-decoration-thickness: 0.1em;
  text-underline-offset: 0.16em;
}

a:hover {
  color: var(--qolcs-blue-dark);
}

a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
  outline: 3px solid var(--qolcs-gold);
  outline-offset: 3px;
}

.site-header {
  background: var(--qolcs-surface);
  border-bottom: 1px solid var(--qolcs-border);
}

.inside-header {
  padding: 24px 32px;
}

.site-branding .main-title {
  font-size: clamp(1.35rem, 2.4vw, 1.85rem);
  line-height: 1.18;
  letter-spacing: -0.02em;
}

.main-title a {
  color: var(--qolcs-navy);
}

.site-description {
  color: var(--qolcs-muted);
}

.main-navigation {
  background: var(--qolcs-navy);
}

.main-navigation .main-nav ul li a,
.menu-toggle,
.main-navigation .menu-bar-item > a {
  color: #ffffff;
  font-weight: 700;
  letter-spacing: 0.01em;
}

.main-navigation .main-nav ul li:hover > a,
.main-navigation .main-nav ul li:focus-within > a,
.main-navigation .main-nav ul li[class*="current-menu-"] > a {
  color: #ffffff;
  background: var(--qolcs-blue);
}

.main-navigation ul ul {
  background: var(--qolcs-navy);
}

.main-navigation .main-nav ul ul li a {
  font-size: 1rem;
}

@media (min-width: 769px) {
  .main-navigation .main-nav > ul {
    flex-wrap: nowrap;
  }

  .main-navigation .main-nav > ul > li > a {
    padding-right: 14px;
    padding-left: 14px;
    font-size: 0.94rem;
    white-space: nowrap;
  }

  .main-navigation .main-nav > ul > li.qolcs-donate-menu {
    margin-left: auto;
  }
}

.site-content {
  padding: clamp(24px, 4vw, 56px);
}

.site-content .content-area {
  width: 100%;
}

.widget-area {
  display: none;
}

.inside-article {
  padding: clamp(30px, 5vw, 64px);
  border: 1px solid var(--qolcs-border);
  border-radius: 12px;
  box-shadow: 0 12px 32px rgba(21, 50, 74, 0.08);
}

.entry-title {
  color: var(--qolcs-navy);
  font-size: clamp(2.25rem, 6vw, 4rem);
  line-height: 1.08;
  letter-spacing: -0.035em;
}

.entry-content {
  margin-top: 1.5rem;
}

.entry-content p,
.entry-content li {
  max-width: 74ch;
}

.entry-content h2,
.entry-content h3,
.entry-content h4 {
  color: var(--qolcs-navy);
  line-height: 1.2;
  letter-spacing: -0.02em;
  margin-top: 1.6em;
}

.entry-content h2 {
  font-size: clamp(1.75rem, 4vw, 2.75rem);
}

.entry-content h3 {
  font-size: clamp(1.35rem, 3vw, 2rem);
}

.wp-block-columns {
  gap: clamp(24px, 4vw, 48px);
}

.wp-block-button__link,
button,
input[type="submit"] {
  min-height: 48px;
  border-radius: 6px;
  background: var(--qolcs-blue);
  color: #ffffff !important;
  font-weight: 700;
  padding: 0.78em 1.25em;
}

.wp-block-button__link:hover,
button:hover,
input[type="submit"]:hover {
  background: var(--qolcs-blue-dark);
  color: #ffffff !important;
}

input,
select,
textarea {
  min-height: 48px;
  border: 2px solid #7b8794;
  border-radius: 4px;
  font-size: 1rem;
}

.site-footer,
.site-info {
  background: var(--qolcs-navy);
  color: #ffffff;
}

.site-info a {
  color: #ffffff;
}

@media (max-width: 768px) {
  body {
    font-size: 17px;
  }

  .inside-header {
    padding: 20px;
  }

  .site-content {
    padding: 18px;
  }

  .inside-article {
    padding: 28px 22px;
    border-radius: 8px;
  }

  .entry-title {
    font-size: clamp(2rem, 12vw, 3rem);
  }

  .main-navigation .main-nav ul li a {
    padding: 14px 20px;
  }
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }

  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}